/* ═══════════════════════════════════════════════════════════
   Massiveforge · landscaping-jonesboro · design-b
   Design: specimen (remapped to slot "b")
   All selectors scoped [data-design="b"].dq-design or .dq-design[data-design="b"].dq-design
   All keyframes prefixed b-
   ═══════════════════════════════════════════════════════════ */

/* ── Token block ─────────────────────────────────────────── */
[data-design="b"] {
  --gampi:      #F3ECD8;
  --gampi-deep: #E5DAB8;
  --ink:        #181A12;
  --ink-soft:   #3D3F30;
  --muted:      #7B7556;
  --rule:       #262818;
  --moss:       #3C5A2E;
  --moss-deep:  #243A1D;
  --bloom-red:  #9C2F22;
  --autumn:     #A8612A;
  --soil:       #5A3F25;
  --critical:   #7B1812;
  /* seasonal accent — overridden by JS at first paint; moss is resting default */
  --accent:     var(--moss);

  --font-binomial: "GT Sectra Italic", "Tiempos Italic", "EB Garamond Italic", serif;
  --font-display:  "GT Sectra", "Tiempos", "EB Garamond", serif;
  --font-body:     "Adobe Caslon Pro", "Crimson Pro", Georgia, serif;
  --font-tag:      "GT America Mono", "JetBrains Mono", monospace;
  --font-margin:   "Caveat", "Homemade Apple", cursive;

  --text-tag:     11px;
  --text-cap:     13px;
  --text-body:    17px;
  --text-helper:  20px;
  --text-binomial: 22px;
  --text-deck:    26px;
  --text-head:    44px;
  --text-banner:  72px;

  --space-tendril: 2px;
  --space-em:      8px;
  --space-leaf:    16px;
  --space-stem:    24px;
  --space-bed:     48px;
  --space-row:     72px;
  --space-garden:  144px;

  --dur-tick:    140ms;
  --dur-snap:    240ms;
  --dur-unfurl:  680ms;
  --dur-bloom:   1100ms;
  --dur-grow:    1800ms;
  --dur-ambient: 18000ms;
  --ease-unfurl: cubic-bezier(.22, 1, .36, 1);
  --ease-bloom:  cubic-bezier(.34, .04, .26, 1);
  --ease-grow:   cubic-bezier(.16, 1, .3, 1);
  --ease-rustle: cubic-bezier(.45, .05, .55, .95);

  --radius-zero: 0;
  --radius-tag:  2px;

  --shadow-mat:  0 0 0 1px var(--rule);
  --shadow-press: inset 0 2px 0 rgba(0,0,0,.1);
  --shadow-tag:  1px 1px 0 var(--gampi-deep), 2px 2px 0 var(--rule);
  --shadow-leaf: 0 0 0 1px var(--moss-deep);

  color:       var(--ink);
  background:  var(--gampi);
  font-family: var(--font-body);
}
[data-design="b"].dq-design * { box-sizing: border-box; }

/* dark mode */
@media (prefers-color-scheme: dark) {
  [data-design="b"] {
    --gampi:      #0D0F0A;
    --gampi-deep: #15180F;
    --ink:        #E8E3CC;
    --ink-soft:   #BFB89A;
    --muted:      #7E785A;
    --rule:       #9A926E;
    --moss:       #7A9A60;
    --moss-deep:  #5A7848;
    --bloom-red:  #C9483A;
    --autumn:     #D3854A;
    --soil:       #8A6840;
    --critical:   #BC372A;
  }
}

/* ── Article base ─────────────────────────────────────────── */
[data-design="b"].dq-design,
[data-design="b"] .dq-design {
  max-width: 100%;
  overflow-x: clip;
}
[data-design="b"].dq-design * { min-width: 0; }
[data-design="b"].dq-design img,
[data-design="b"].dq-design svg:not([data-keep-size]) {
  max-width: 100%;
  height: auto;
}


/* ══════════════════════════════════════════════════════════════
   ELEMENT 1 — Bloom Bar Header
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-header {
  position: sticky;
  top: 0;
  z-index: 40;
  isolation: isolate;
  background: color-mix(in oklab, var(--gampi) 92%, transparent);
  border-bottom: 1px solid var(--rule);
}
[data-design="b"] .rf-header__bar {
  max-width: 1280px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-stem);
  padding: var(--space-leaf) clamp(16px, 5vw, 48px);
}
[data-design="b"] .rf-logo {
  font-family: var(--font-display);
  font-size: clamp(17px, 2.6vw, 24px);
  letter-spacing: .01em;
  line-height: 1;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: min(62vw, 480px);
}

/* Bloom Bar — seasonal hairline draws across header bottom */
[data-design="b"] .rf-bloombar {
  position: absolute;
  left: 0;
  bottom: -1px;
  height: 3px;
  width: 100%;
  transform-origin: left center;
  transform: scaleX(0);
  background: linear-gradient(
    90deg,
    var(--accent),
    color-mix(in oklab, var(--accent) 50%, transparent)
  );
  animation: b-bloombar 24s var(--ease-grow) infinite;
}
@keyframes b-bloombar {
  0%   { transform: scaleX(0); transform-origin: left center;  opacity: 0; }
  12%  { opacity: 1; }
  46%  { transform: scaleX(1); transform-origin: left center;  opacity: 1; }
  54%  { transform: scaleX(1); transform-origin: right center; opacity: 1; }
  100% { transform: scaleX(0); transform-origin: right center; opacity: 0; }
}

/* hamburger as leaf strokes */
[data-design="b"] .rf-burger {
  appearance: none;
  width: 44px;
  height: 44px;
  cursor: pointer;
  border: 1px solid var(--rule);
  background: var(--gampi);
  border-radius: var(--radius-tag);
  box-shadow: var(--shadow-tag);
  display: grid;
  place-content: center;
  gap: 4px;
  flex-shrink: 0;
}
[data-design="b"] .rf-burger__leaf {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--ink);
  transition:
    transform var(--dur-snap) var(--ease-unfurl),
    opacity  var(--dur-snap) var(--ease-unfurl);
}
[data-design="b"] .rf-burger[aria-expanded="true"] .rf-burger__leaf:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
[data-design="b"] .rf-burger[aria-expanded="true"] .rf-burger__leaf:nth-child(2) {
  opacity: 0;
}
[data-design="b"] .rf-burger[aria-expanded="true"] .rf-burger__leaf:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

/* drawer */
[data-design="b"] .rf-drawer {
  position: fixed;
  inset: 0;
  z-index: 50;
  background: color-mix(in oklab, var(--ink) 35%, transparent);
}
[data-design="b"] .rf-drawer[hidden] { display: none; }
[data-design="b"] .rf-drawer__sheet {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: min(86vw, 340px);
  padding: var(--space-row) var(--space-stem);
  background: var(--gampi-deep);
  border-left: 1px solid var(--rule);
  display: flex;
  flex-direction: column;
  gap: var(--space-leaf);
  transform: translateX(8px);
  opacity: 0;
  animation: b-drawer-in var(--dur-unfurl) var(--ease-unfurl) forwards;
}
@keyframes b-drawer-in { to { transform: translateX(0); opacity: 1; } }
[data-design="b"] .rf-drawer a {
  font-family: var(--font-binomial);
  font-style: italic;
  font-size: var(--text-deck);
  color: var(--ink);
  text-decoration: none;
  padding-block: var(--space-em);
  border-bottom: 1px solid var(--rule);
}
[data-design="b"] .rf-drawer a:last-child { border-bottom: none; }
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-drawer a:hover { color: var(--accent); }
}
[data-design="b"] .rf-drawer__phone {
  font-family: var(--font-tag);
  font-size: var(--text-cap);
  letter-spacing: .06em;
  color: var(--muted);
  font-style: normal;
}
@media (max-width: 390px) {
  [data-design="b"] .rf-drawer__sheet { width: 100vw; border-left: none; }
}


/* ══════════════════════════════════════════════════════════════
   ELEMENT 3 — Hero Specimen
   isolation:isolate on section; text layer z-index ABOVE backdrop
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-hero {
  position: relative;
  isolation: isolate;
  min-height: 70vh;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  overflow: hidden;
  padding: var(--space-garden) clamp(16px, 5vw, 48px);
}

/* backdrop — sits BELOW hero text */
[data-design="b"] .b-hero__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

/* seasonal wash — visible at first paint, continuous ambient motion */
[data-design="b"] .b-season-wash {
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 110% 90% at 68% 48%,
    color-mix(in oklab, var(--accent) 28%, var(--gampi)),
    var(--gampi) 72%
  );
  animation: b-wash-drift 12s var(--ease-rustle) infinite alternate;
}
@keyframes b-wash-drift {
  0%   { transform: scale(1)    translateX(0);    opacity: 1; }
  50%  { transform: scale(1.04) translateX(12px); opacity: 0.88; }
  100% { transform: scale(1)    translateX(-8px); opacity: 1; }
}

/* hero specimen SVG — large botanical engraving */
[data-design="b"] .b-hero__specimen-svg {
  position: absolute;
  right: clamp(-40px, -2vw, 20px);
  top: 50%;
  transform: translateY(-50%);
  width: clamp(220px, 38vw, 480px);
  height: auto;
  opacity: 0.22;
}
[data-design="b"] .b-tag-text {
  font-family: var(--font-tag);
  font-size: 8px;
  letter-spacing: .1em;
  text-transform: uppercase;
  fill: var(--muted);
}

/* stem draw-in */
[data-design="b"] .b-stem {
  fill: none;
  stroke: var(--soil);
  stroke-width: 2.4;
  stroke-linecap: round;
}
[data-design="b"] .b-stem--hero {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: b-stem-grow var(--dur-grow) var(--ease-grow) forwards;
}
@keyframes b-stem-grow { to { stroke-dashoffset: 0; } }

/* leaves — resting opacity:1, rustle when .is-rustling on root */
[data-design="b"] .b-leaf {
  fill: var(--moss);
  stroke: var(--moss-deep);
  stroke-width: 1;
  transform-box: fill-box;
  transform-origin: 100% 50%;
}
[data-design="b"].is-rustling .b-leaf.b-leaf--1 { animation: b-rustle 18s var(--ease-rustle) infinite; }
[data-design="b"].is-rustling .b-leaf.b-leaf--2 { animation: b-rustle 21s var(--ease-rustle) .6s infinite; }
[data-design="b"].is-rustling .b-leaf.b-leaf--3 { animation: b-rustle 24s var(--ease-rustle) 1.1s infinite; }
[data-design="b"].is-rustling .b-leaf.b-leaf--4 { animation: b-rustle 19s var(--ease-rustle) .4s infinite; }
[data-design="b"].is-rustling .b-leaf.b-leaf--5 { animation: b-rustle 22s var(--ease-rustle) .9s infinite; }
@keyframes b-rustle {
  0%,100% { transform: rotate(0deg); }
  25%     { transform: rotate(2deg); }
  60%     { transform: rotate(-2deg); }
}

/* bloom petals — start at scale(0.94) opacity:1 (never scale(0)/opacity:0) */
[data-design="b"] .b-petal {
  fill: var(--bloom-red);
  transform-box: fill-box;
  transform-origin: 0 0;
  transform: scale(0.94);
  opacity: 1;
}
[data-design="b"] .b-bloom.is-open .b-petal {
  animation: b-bloom var(--dur-bloom) var(--ease-bloom) forwards;
  animation-delay: calc(var(--i) * 80ms);
}
@keyframes b-bloom { to { transform: scale(1); } }
[data-design="b"] .b-stamen {
  fill: var(--autumn);
}

/* hero TEXT — z-index:2 above backdrop z-index:0 */
[data-design="b"] .b-hero__text {
  position: relative;
  z-index: 2;
  max-width: 640px;
}
[data-design="b"] .b-hero__kicker {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 var(--space-em);
}
[data-design="b"] .b-hero__name {
  font-family: var(--font-display);
  font-size: clamp(36px, 7.5vw, 72px);
  line-height: 1.02;
  margin: 0 0 var(--space-leaf);
  color: var(--ink);
}
[data-design="b"] .b-hero__desc {
  font-family: var(--font-tag);
  font-size: var(--text-cap);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 var(--space-stem);
}
[data-design="b"] .b-hero__binomial {
  font-family: var(--font-binomial);
  font-style: italic;
  font-size: var(--text-binomial);
  color: var(--moss-deep);
  margin: 0 0 var(--space-leaf);
}
[data-design="b"] .b-hero__deck {
  font-family: var(--font-body);
  font-size: var(--text-helper);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 46ch;
  margin: 0 0 var(--space-bed);
}

/* ── ELEMENT 2 — CTA (funnel anchor) ─────────────────────── */
[data-design="b"] .rf-cta {
  --leaf: 0;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--space-em);
  padding: 14px 28px;
  font-family: var(--font-binomial);
  font-style: italic;
  font-size: var(--text-helper);
  color: var(--gampi);
  background: var(--moss);
  text-decoration: none;
  border-radius: var(--radius-tag);
  box-shadow: var(--shadow-tag);
  will-change: transform;
  animation: b-cta-breath 5s var(--ease-bloom) infinite;
  transition:
    background var(--dur-snap) var(--ease-unfurl),
    transform  var(--dur-tick) var(--ease-unfurl);
}
@keyframes b-cta-breath {
  0%,100% { box-shadow: var(--shadow-tag); }
  50%     {
    box-shadow: var(--shadow-tag),
                0 0 0 4px color-mix(in oklab, var(--accent) 22%, transparent);
  }
}
[data-design="b"] .rf-cta__leaf {
  width: 18px;
  height: 18px;
  overflow: visible;
  flex: none;
}
[data-design="b"] .rf-cta__leaf path {
  fill: none;
  stroke: var(--gampi);
  stroke-width: 1.4;
  stroke-dasharray: 1;
  stroke-dashoffset: calc(1 - var(--leaf));
  transition: stroke-dashoffset var(--dur-unfurl) var(--ease-unfurl);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-cta:hover { --leaf: 1; background: var(--moss-deep); }
}
[data-design="b"] .rf-cta:focus-visible {
  --leaf: 1;
  outline: 2px solid var(--bloom-red);
  outline-offset: 4px;
}
[data-design="b"] .rf-cta:active {
  transform: translateY(2px);
  box-shadow: var(--shadow-press);
}
[data-design="b"] .rf-cta__label { /* opacity always 1 — no opacity:0 states */ }


/* ══════════════════════════════════════════════════════════════
   ELEMENT 4 — Bloom Calendar (service schedule mid-page)
   Scroll-driven parallax: calendar translates on scroll (TRIAD-2)
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-calendar {
  max-width: 1280px;
  margin-inline: auto;
  padding: var(--space-row) clamp(16px, 5vw, 48px);
  will-change: transform;
}
[data-design="b"] .rf-calendar__title {
  font-family: var(--font-display);
  font-size: clamp(28px, 5vw, var(--text-head));
  color: var(--ink);
  margin: 0 0 var(--space-em);
}
[data-design="b"] .rf-calendar__sub {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 56ch;
  margin: 0 0 var(--space-stem);
}
[data-design="b"] .rf-calendar__frame {
  position: relative;
  overflow: hidden;
  min-height: 32px;
}
[data-design="b"] .rf-calendar__axis {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 2px;
  margin-bottom: var(--space-em);
}
[data-design="b"] .rf-calendar__axis span {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  text-align: center;
  color: var(--muted);
  min-width: 0;
}
[data-design="b"] .rf-calendar__axis span.is-now {
  color: var(--gampi);
  background: var(--accent);
  border-radius: var(--radius-tag);
}
[data-design="b"] .rf-cal-row { margin-bottom: var(--space-leaf); }
[data-design="b"] .rf-cal-row__name {
  display: block;
  font-family: var(--font-binomial);
  font-style: italic;
  font-size: var(--text-body);
  color: var(--moss-deep);
  margin-bottom: 4px;
}
[data-design="b"] .rf-cal-row__track {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 2px;
}
[data-design="b"] .rf-cal-row__track i {
  height: 12px;
  min-width: 0;
  background: var(--gampi-deep);
  border: 1px solid transparent;
  display: block;
}
[data-design="b"] .rf-cal-row__track i.in-bloom {
  background: color-mix(in oklab, var(--accent) 70%, var(--gampi));
  border-color: var(--accent);
}
/* season wave — translucent band sweeping Jan→Dec */
[data-design="b"] .rf-calendar__wave {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 8.34%;
  pointer-events: none;
  transform: translateX(0);
  background: linear-gradient(
    90deg,
    transparent,
    color-mix(in oklab, var(--accent) 24%, transparent),
    transparent
  );
  animation: b-cal-wave 18s linear infinite;
}
@keyframes b-cal-wave { from { transform: translateX(0); } to { transform: translateX(1100%); } }
[data-design="b"] .rf-calendar__frame.is-paused .rf-calendar__wave {
  animation-play-state: paused;
}
@media (max-width: 560px) {
  [data-design="b"] .rf-cal-row__track i { height: 10px; }
  [data-design="b"] .rf-calendar__axis span { font-size: 9px; }
}


/* ══════════════════════════════════════════════════════════════
   Services — Specimen Set plates
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-services {
  background: var(--gampi-deep);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
[data-design="b"] .b-services__inner {
  max-width: 1280px;
  margin-inline: auto;
  padding: var(--space-row) clamp(16px, 5vw, 48px);
}
[data-design="b"] .b-section-head {
  font-family: var(--font-display);
  font-size: clamp(28px, 5vw, var(--text-head));
  color: var(--ink);
  margin: 0 0 var(--space-em);
}
[data-design="b"] .b-section-sub {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 56ch;
  margin: 0 0 var(--space-row);
}
[data-design="b"] .b-service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px;
}
[data-design="b"] .b-plate {
  background: var(--gampi);
  border: 1px solid var(--rule);
  box-shadow: var(--shadow-mat);
  padding: var(--space-stem) var(--space-stem) var(--space-bed);
}
[data-design="b"] .b-plate__icon {
  height: 80px;
  margin-bottom: var(--space-leaf);
  display: flex;
  align-items: center;
}
[data-design="b"] .b-plate__svg {
  width: 56px;
  height: 56px;
  overflow: visible;
}
[data-design="b"] .b-plate-stem {
  stroke: var(--soil);
  stroke-width: 1.6;
  stroke-linecap: round;
}
[data-design="b"] .b-plate-leaf {
  fill: var(--moss);
  stroke: var(--moss-deep);
  stroke-width: 0.8;
  transform-box: fill-box;
  transform-origin: 100% 50%;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-plate:hover .b-plate-leaf {
    animation: b-rustle 4s var(--ease-rustle) infinite;
  }
}
[data-design="b"] .b-plate__name {
  font-family: var(--font-display);
  font-size: var(--text-deck);
  color: var(--ink);
  margin: 0 0 var(--space-em);
  line-height: 1.2;
}
[data-design="b"] .b-plate__tag {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 var(--space-leaf);
}
[data-design="b"] .b-plate__body {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: 1.7;
  color: var(--ink-soft);
  margin: 0;
  max-width: 42ch;
}
[data-design="b"] .b-services__cta {
  margin-top: var(--space-row);
  display: flex;
  justify-content: flex-start;
}


/* ══════════════════════════════════════════════════════════════
   About / Service Area
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-about {
  max-width: 1280px;
  margin-inline: auto;
  padding: var(--space-row) clamp(16px, 5vw, 48px);
}
[data-design="b"] .b-about__inner {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: var(--space-row);
  align-items: start;
}
[data-design="b"] .b-about__body {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: 1.7;
  color: var(--ink-soft);
  margin: 0 0 var(--space-leaf);
  max-width: 58ch;
}
[data-design="b"] .b-about__tag-schedule {
  background: var(--gampi-deep);
  border: 1px solid var(--rule);
  box-shadow: var(--shadow-mat);
  padding: var(--space-stem);
  display: flex;
  flex-direction: column;
  gap: var(--space-em);
}
[data-design="b"] .b-tag-row {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-bottom: var(--space-em);
  border-bottom: 1px solid var(--rule);
}
[data-design="b"] .b-tag-row:last-child { border-bottom: none; }
[data-design="b"] .b-tag-label {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}
[data-design="b"] .b-tag-value {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink);
}
[data-design="b"] .b-tag-value a {
  color: var(--moss);
  text-decoration: none;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-tag-value a:hover { color: var(--moss-deep); }
}


/* ══════════════════════════════════════════════════════════════
   ELEMENT 6 — Pointer (surveyed-grown wayfinding)
   data-mf-role="pointer"
   Immediately before #funnel — LAST thing before funnel
   Visible at first paint: opacity:1, min-height 48px
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-pointer {
  padding: var(--space-bed) clamp(16px, 5vw, 48px);
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 48px;
  overflow: hidden;
}
[data-design="b"] .b-pointer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-stem);
  width: 100%;
  max-width: 480px;
}
/* contour lines — drawn via clip-path, fully visible at first paint */
[data-design="b"] .b-pointer__contour {
  width: 100%;
  max-width: 400px;
  height: 64px;
  overflow: visible;
}
[data-design="b"] .b-pointer__line {
  fill: none;
  stroke: var(--accent);
  stroke-linecap: round;
  stroke-width: 1.2;
}
[data-design="b"] .b-pointer__line--1 {
  opacity: 0.7;
  animation: b-contour-draw 2.4s var(--ease-grow) forwards;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  pathLength: 1;
}
[data-design="b"] .b-pointer__line--2 {
  opacity: 0.45;
  animation: b-contour-draw 2.8s var(--ease-grow) .3s forwards;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  pathLength: 1;
}
/* Use clip-path for the draw-in — not width/height transitions */
@keyframes b-contour-draw { to { stroke-dashoffset: 0; } }

[data-design="b"] .b-pointer__label {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
}
/* planted-row sprouting dots */
[data-design="b"] .b-pointer__row {
  display: flex;
  gap: 12px;
  align-items: center;
}
[data-design="b"] .b-pointer__seed {
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
  transform: scale(0.92);
  animation: b-seed-sprout 3.6s var(--ease-grow) infinite;
}
[data-design="b"] .b-pointer__seed:nth-child(2) { animation-delay: .18s; }
[data-design="b"] .b-pointer__seed:nth-child(3) { animation-delay: .36s; }
[data-design="b"] .b-pointer__seed:nth-child(4) { animation-delay: .54s; }
[data-design="b"] .b-pointer__seed:nth-child(5) { animation-delay: .72s; }
@keyframes b-seed-sprout {
  0%,100% { transform: scale(0.92); opacity: 0.5; }
  50%     { transform: scale(1);    opacity: 1; }
}


/* ══════════════════════════════════════════════════════════════
   ELEMENT 5 — Routing Funnel
   id="funnel" data-mf-role="funnel"
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-consult {
  max-width: 760px;
  margin-inline: auto;
  padding: var(--space-row) clamp(16px, 5vw, 48px);
}
[data-design="b"] .rf-consult__title {
  font-family: var(--font-display);
  font-size: clamp(28px, 5vw, var(--text-head));
  color: var(--ink);
  margin: 0 0 var(--space-stem);
}
[data-design="b"] .rf-funnel {
  background: var(--gampi);
  border: 1px solid var(--rule);
  box-shadow: var(--shadow-mat);
  padding: var(--space-bed) var(--space-stem);
}
[data-design="b"] .rf-funnel__progress {
  list-style: none;
  display: flex;
  gap: var(--space-em);
  margin: 0 0 var(--space-stem);
  padding: 0;
}
[data-design="b"] .rf-funnel__progress li {
  height: 3px;
  flex: 1;
  background: var(--gampi-deep);
}
[data-design="b"] .rf-funnel__progress li.is-done { background: var(--accent); }
[data-design="b"] .rf-step {
  display: none;
  border: 0;
  margin: 0;
  padding: 0;
  min-inline-size: 0;
}
[data-design="b"] .rf-step.is-active {
  display: block;
  animation: b-step-grow var(--dur-unfurl) var(--ease-grow);
}
@keyframes b-step-grow {
  from { opacity: 0; clip-path: inset(100% 0 0 0); }
  to   { opacity: 1; clip-path: inset(0 0 0 0); }
}
[data-design="b"] .rf-step legend {
  font-family: var(--font-binomial);
  font-style: italic;
  font-size: var(--text-deck);
  color: var(--ink);
  margin-bottom: var(--space-stem);
}
[data-design="b"] .rf-choices {
  display: flex;
  flex-direction: column;
  gap: var(--space-em);
}
[data-design="b"] .rf-chip {
  text-align: left;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink);
  background: var(--gampi);
  border: 1px solid var(--rule);
  border-radius: var(--radius-tag);
  padding: 14px var(--space-leaf);
  min-height: 56px;
  transition:
    border-color var(--dur-tick) var(--ease-unfurl),
    background   var(--dur-tick) var(--ease-unfurl),
    transform    var(--dur-tick) var(--ease-unfurl);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-chip:hover { border-color: var(--moss); }
}
[data-design="b"] .rf-chip:focus-visible {
  outline: 2px solid var(--bloom-red);
  outline-offset: 2px;
}
[data-design="b"] .rf-chip[aria-pressed="true"] {
  background: color-mix(in oklab, var(--accent) 18%, var(--gampi));
  border-color: var(--accent);
  transform: translateX(2px);
}
[data-design="b"] .rf-tagslip { display: block; margin-bottom: var(--space-leaf); }
[data-design="b"] .rf-tagslip span {
  display: block;
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 4px;
}
[data-design="b"] .rf-tagslip input,
[data-design="b"] .rf-tagslip textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink);
  background: var(--gampi);
  border: 1px solid var(--rule);
  border-radius: var(--radius-tag);
  padding: 10px var(--space-leaf);
  resize: vertical;
}
[data-design="b"] .rf-tagslip input:focus-visible,
[data-design="b"] .rf-tagslip textarea:focus-visible {
  outline: none;
  border: 2px solid var(--moss);
}
[data-design="b"] .rf-confirm { text-align: center; }
[data-design="b"] .rf-confirm__kicker {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--muted);
}
[data-design="b"] .b-confirm__plant {
  font-family: var(--font-binomial);
  font-style: italic;
  font-size: var(--text-deck);
  color: var(--moss-deep);
  margin: var(--space-em) 0;
}
[data-design="b"] .b-confirm__note {
  font-family: var(--font-body);
  color: var(--ink-soft);
}
[data-design="b"] .rf-funnel__nav {
  display: flex;
  justify-content: space-between;
  gap: var(--space-em);
  margin-top: var(--space-bed);
}
[data-design="b"] .rf-back,
[data-design="b"] .rf-next,
[data-design="b"] .rf-submit {
  cursor: pointer;
  font-family: var(--font-binomial);
  font-style: italic;
  font-size: var(--text-body);
  border-radius: var(--radius-tag);
  padding: 12px 28px;
  min-height: 44px;
}
[data-design="b"] .rf-next,
[data-design="b"] .rf-submit {
  color: var(--gampi);
  background: var(--moss);
  border: 1px solid var(--moss-deep);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-next:hover,
  [data-design="b"] .rf-submit:hover { background: var(--moss-deep); }
}
[data-design="b"] .rf-back {
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--rule);
}
[data-design="b"] .rf-back[hidden]   { display: none; }
[data-design="b"] .rf-submit[hidden] { display: none; }

[data-design="b"] .b-funnel__below {
  font-family: var(--font-body);
  font-size: var(--text-cap);
  color: var(--muted);
  margin-top: var(--space-stem);
  line-height: 1.6;
}
[data-design="b"] .b-funnel__below a {
  color: var(--moss);
  text-decoration: none;
}


/* ══════════════════════════════════════════════════════════════
   Footer — Catalog Imprint
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-footer {
  border-top: 1px solid var(--rule);
  background: var(--gampi-deep);
  margin-top: var(--space-row);
}
[data-design="b"] .b-footer__inner {
  max-width: 1280px;
  margin-inline: auto;
  padding: var(--space-row) clamp(16px, 5vw, 48px);
  display: flex;
  flex-direction: column;
  gap: var(--space-em);
}
[data-design="b"] .b-footer__name {
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--text-binomial);
  color: var(--ink);
  margin: 0;
}
[data-design="b"] .b-footer__detail {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink-soft);
  margin: 0;
}
[data-design="b"] .b-footer__detail a {
  color: var(--moss);
  text-decoration: none;
}
[data-design="b"] .b-footer__copy {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0;
}
[data-design="b"] .b-footer__imprint {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0;
}


/* ══════════════════════════════════════════════════════════════
   Scroll-driven parallax — TRIAD-2 (genuine scroll-linked motion)
   Calendar section translates on scroll — not a fade-in
   Implemented via JS IntersectionObserver + CSS custom property
   (see script.js b-scroll-parallax)
   ══════════════════════════════════════════════════════════════ */
[data-design="b"] .b-calendar {
  --scroll-shift: 0px;
  transform: translateY(var(--scroll-shift));
  transition: transform 0ms linear; /* updated in rAF loop */
}


/* ══════════════════════════════════════════════════════════════
   Reduced motion fallbacks
   ══════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .rf-bloombar           { animation: none; transform: scaleX(1); opacity: 1; }
  [data-design="b"] .rf-drawer__sheet      { animation: none; transform: none; opacity: 1; }
  [data-design="b"] .rf-burger__leaf       { transition: none; }
  [data-design="b"] .b-season-wash         { animation: none; }
  [data-design="b"] .b-stem--hero          { animation: none; stroke-dashoffset: 0; }
  [data-design="b"] .b-leaf               { animation: none !important; transform: none !important; }
  [data-design="b"] .b-petal              { animation: none !important; transform: scale(1); }
  [data-design="b"] .rf-cta               { animation: none; transition: background var(--dur-snap); }
  [data-design="b"] .rf-cta__leaf path    { transition: none; stroke-dashoffset: 0; }
  [data-design="b"] .rf-calendar__wave    { animation: none; opacity: .25; }
  [data-design="b"] .rf-step.is-active    { animation: none; }
  [data-design="b"] .rf-chip              { transition: none; }
  [data-design="b"] .b-pointer__line--1,
  [data-design="b"] .b-pointer__line--2   { animation: none; stroke-dashoffset: 0; }
  [data-design="b"] .b-pointer__seed      { animation: none; transform: scale(1); opacity: 1; }
  [data-design="b"] .b-calendar          { transform: none; transition: none; }
}


/* ══════════════════════════════════════════════════════════════
   Mobile / responsive — no h-scroll at 320/390/768/1440
   EVERY rule scoped to .dq-design to avoid chrome-kit leaks
   ══════════════════════════════════════════════════════════════ */
[data-design="b"].dq-design,
[data-design="b"] .dq-design {
  max-width: 100%;
  overflow-x: clip;
}
[data-design="b"].dq-design * { min-width: 0; }
[data-design="b"].dq-design img,
[data-design="b"].dq-design svg:not([data-keep-size]) {
  max-width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  [data-design="b"] .b-hero { min-height: 60vh; padding-block: var(--space-row); }
  [data-design="b"] .b-hero__specimen-svg { display: none; }
  [data-design="b"] .b-about__inner {
    grid-template-columns: 1fr;
    gap: var(--space-bed);
  }
  [data-design="b"] .b-service-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  [data-design="b"] .rf-logo { font-size: 17px; }
  [data-design="b"] .b-hero__name { font-size: clamp(28px, 9vw, 44px); }
  [data-design="b"] .b-hero__deck { font-size: var(--text-body); }
  [data-design="b"] .rf-cta { font-size: var(--text-body); padding: 12px 20px; }
}
@media (max-width: 390px) {
  [data-design="b"] .rf-header__bar { padding-inline: 16px; }
  [data-design="b"] .b-hero { padding-inline: 16px; }
  [data-design="b"] .b-services__inner,
  [data-design="b"] .b-about,
  [data-design="b"] .b-calendar,
  [data-design="b"] .b-consult { padding-inline: 16px; }
  [data-design="b"] .rf-funnel { padding: var(--space-stem) var(--space-leaf); }
  [data-design="b"] .rf-funnel__nav { flex-direction: column-reverse; }
  [data-design="b"] .rf-back,
  [data-design="b"] .rf-next,
  [data-design="b"] .rf-submit { width: 100%; }
}

/* Phase-3.4 hero visibility floor (forge_assemble) */
[data-design="b"] [data-mf-role="hero"] :is(h1,h2,p,.headline,.subtitle,.proof,[class*="headline"],[class*="subtitle"],[class*="proof"]),
[data-design="b"] [data-mf-role="cta"] { opacity: 1 !important; }
