/* Scoped to the existing Contact Details block; shared tokens remain unchanged. */
.bb-contact-details.bb-business-card {
  display: block;
  justify-items: stretch;
  width: 100%;
  margin-top: 28px;
  padding: clamp(24px, 2.2vw, 34px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--wp--preset--color--dark-green, #17251f);
  color: var(--ink);
  font-family: inherit;
  line-height: 1.6;
}
.bb-business-card > * { width: 100%; min-width: 0; }
.bb-business-card .bb-business-heading { position: relative; padding-bottom: 22px; }
.bb-business-card .bb-business-heading::after { content: ""; display: block; width: 28px; height: 2px; margin-top: 20px; background: var(--coral); }
.bb-business-card .bb-business-heading > .micro { color: var(--sage); font-size: 10px; letter-spacing: .18em; line-height: 1.5; margin: 0 0 13px; }
.bb-business-card .bb-business-heading h2 { color: var(--ink); font-size: clamp(27px, 2.2vw, 32px); line-height: 1.15; font-weight: 700; letter-spacing: -.045em; margin: 0 0 5px; overflow-wrap: anywhere; }
.bb-business-card p.bb-business-person { color: var(--ink); font-size: 16px; line-height: 1.6; margin: 0; }
.bb-business-card .bb-business-address { display: grid; margin: 0 0 22px; color: var(--muted); font-style: normal; font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
.bb-business-card .bb-business-contact { display: grid; gap: 10px; padding-bottom: 23px; }
.bb-business-card .bb-business-contact a { display: grid; gap: 1px; justify-items: start; min-height: 48px; padding-block: 4px; font-size: 16px; line-height: 1.6; color: var(--ink); overflow-wrap: anywhere; transition: color .18s; }
.bb-business-card .bb-business-label { color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.6; letter-spacing: .02em; margin: 0; }
.bb-business-card .bb-business-contact a:hover { color: var(--coral-l); }
.bb-business-card .bb-business-register { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; padding-block: 20px; border-top: 1px solid var(--line); margin: 0; }
.bb-business-card .bb-business-register dd { font-size: 14px; line-height: 1.7; margin: 3px 0 0; overflow-wrap: anywhere; }
.bb-business-card .bb-business-bank { border-top: 1px solid var(--line); padding-top: 20px; }
.bb-business-card p.bb-business-bank-name { margin: 3px 0 8px; color: var(--ink); font-size: 14px; line-height: 1.7; }
.bb-business-card p.bb-business-account { margin: 0; color: var(--ink); font-size: 15px; line-height: 1.9; font-variant-numeric: tabular-nums; letter-spacing: 0; }
.bb-business-account span { display: inline-block; white-space: nowrap; }
.bb-business-card .bb-business-copy { display: inline-flex; align-items: center; gap: 8px; padding: 8px 0; min-height: 44px; margin-top: 9px; border: 0; border-radius: 3px; background: transparent; color: var(--sage); font: inherit; font-size: 12px; line-height: 1.5; text-align: start; cursor: pointer; transition: color .18s; }
.bb-business-card .bb-business-copy[hidden] { display: none; }
.bb-business-card .bb-business-copy:hover { color: var(--coral-l); }
.bb-business-card .bb-business-copy:disabled { cursor: wait; opacity: .65; }
.bb-business-copy svg { flex: 0 0 17px; width: 17px; height: 17px; }
.bb-business-card :is(a, button):focus-visible { outline: 2px solid var(--coral-l); outline-offset: 4px; }
.bb-business-card .bb-business-copy-status { display: block; min-height: 1.6em; font-size: 12px; line-height: 1.6; color: var(--sage); }
.bb-business-card :is(dd, .bb-business-contact, .bb-business-account) { font-variant-numeric: tabular-nums; }
/* The card keeps its intrinsic height; a lighter illustration completes the column. */
.bb-contact-composition { display: grid; align-content: start; gap: 24px; min-width: 0; }
.bb-contact-composition > .bb-business-card { margin-top: 0; }
.bb-contact-composition > .bb-contact-flow { width: 100%; max-width: 480px; margin: 0 auto; padding: 0; border: 0; background: none; }
@media (min-width: 901px) {
  .bb-contact-layout > .bb-contact-aside:has(.bb-contact-composition > .bb-contact-flow) { align-self: stretch; display: grid; }
  .bb-contact-aside .bb-contact-composition:has(> .bb-contact-flow) { grid-template-rows: auto 1fr; }
  .bb-contact-composition > .bb-contact-flow { align-self: end; }
}
.bb-contact-flow-svg { display: block; width: 100%; height: auto; overflow: hidden; }
.bb-contact-flow .bb-contact-flow-guide { stroke: var(--sage); stroke-opacity: .12; stroke-width: 1; }
.bb-contact-flow .bb-contact-flow-ring { stroke: var(--sage); stroke-opacity: .28; stroke-width: 1; }
.bb-contact-flow .bb-contact-flow-glyph { stroke: var(--sage); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.bb-contact-flow .bb-contact-flow-check { stroke: var(--coral); }
.bb-contact-flow .bb-contact-flow-label { fill: var(--muted); font: 13px/1.4 Inter, ui-sans-serif, sans-serif; letter-spacing: 0; }
.bb-contact-flow .bb-packet { stroke-width: 1.5; stroke-dasharray: 3 97; opacity: .8; animation-duration: 7s; }
.bb-contact-flow .bb-topology { stroke-opacity: .3; stroke-width: 1; }
.bb-contact-flow .bb-port { r: 1.5; opacity: .7; }
.bb-contact-flow .bb-route-arrow { stroke-opacity: .4; }
.bb-no-pulse .bb-contact-flow .bb-packet, .bb-motion-off .bb-contact-flow .bb-packet, [data-bb-animation="off"] .bb-contact-flow .bb-packet { opacity: 0; }
.editor-styles-wrapper .bb-contact-flow *, .bb-contact-flow.bb-svg-outside *, .bb-page-hidden .bb-contact-flow * { animation-play-state: paused !important; }
@media (max-width: 900px) { .bb-contact-composition { gap: 20px; } }
@media (max-width: 610px) {
  .bb-contact-details.bb-business-card { margin-top: 24px; padding: 24px; }
  .bb-contact-composition > .bb-business-card { margin-top: 0; }
  .bb-business-card .bb-business-register { grid-template-columns: 1fr; gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .bb-business-card :is(a, button) { transition: none; }
  .bb-contact-flow * { animation: none !important; }
}