/* ================================================================
   EC Lawn Care — Design B (specimen slot)
   All selectors scoped to [data-design="b"] / .dq-design
   All keyframes prefixed specimen-b-
   ZERO [data-design="b"].dq-design selectors
   ================================================================ */

/* ── 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 — script overrides per season; moss is the 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; }
[data-design="b"].dq-design svg { max-width: 100%; }

@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;
  }
}

/* expose design-b primary */
[data-design="b"] { --design-b-primary: var(--moss); }

/* ── Mobile no-hscroll floor ─────────────────────────────────── */
[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;
}

/* ── Layout utility ──────────────────────────────────────────── */
[data-design="b"] .rf-section-inner {
  max-width: 1180px;
  margin-inline: auto;
  padding-inline: clamp(16px, 5vw, 40px);
}

/* ================================================================
   ELEMENT 1 — Bloom Bar header
   ================================================================ */
[data-design="b"] .rf-header {
  position: sticky;
  top: 0;
  z-index: 40;
  isolation: isolate;
  background: color-mix(in oklab, var(--gampi) 92%, transparent);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--rule);
}

[data-design="b"] .rf-header__bar {
  max-width: 1180px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-stem);
  padding: var(--space-leaf) clamp(16px, 5vw, 40px);
}

[data-design="b"] .rf-logo {
  font-family: var(--font-display);
  font-size: clamp(20px, 3.2vw, 28px);
  letter-spacing: .01em;
  line-height: 1;
  color: var(--ink);
  text-decoration: none;
}

/* Bloom Bar — seasonal hairline, slow ambient draw */
[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: specimen-b-bloombar 24s var(--ease-grow) infinite;
}

@keyframes specimen-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 — three 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;
}
[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: specimen-b-drawer-in var(--dur-unfurl) var(--ease-unfurl) forwards;
}
@keyframes specimen-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__cta {
  background: var(--moss);
  color: var(--gampi) !important;
  border-radius: var(--radius-tag);
  padding: var(--space-em) var(--space-leaf) !important;
  text-align: center;
  border-bottom: none !important;
}
[data-design="b"] .rf-drawer__phone {
  font-family: var(--font-tag) !important;
  font-style: normal !important;
  font-size: var(--text-body) !important;
  letter-spacing: .06em;
  color: var(--ink-soft) !important;
  border-bottom: none !important;
}

@media (max-width: 560px) {
  [data-design="b"] .rf-header__bar { padding-inline: 16px; }
  [data-design="b"] .rf-logo { font-size: 20px; }
}
@media (max-width: 390px) {
  [data-design="b"] .rf-drawer__sheet {
    width: 100vw;
    border-left: none;
    padding: var(--space-bed) var(--space-stem);
  }
}
@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; }
}

/* ================================================================
   ELEMENT 3 — Hero (unique animated hero backdrop)
   Seasonal wash + mown-stripe motif + botanical SVG engraving
   ================================================================ */
[data-design="b"] .rf-hero {
  position: relative;
  overflow: hidden;
  min-height: clamp(520px, 75vh, 820px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Full-bleed backdrop */
[data-design="b"] .rf-hero__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

/* Seasonal color wash — a shifting field behind the stripes */
[data-design="b"] .rf-hero__backdrop::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    160deg,
    color-mix(in oklab, var(--accent) 28%, var(--gampi)),
    var(--gampi) 55%,
    color-mix(in oklab, var(--moss) 14%, var(--gampi-deep))
  );
  animation: specimen-b-wash 12s var(--ease-rustle) infinite alternate;
}
@keyframes specimen-b-wash {
  0%   { opacity: 0.72; }
  100% { opacity: 1; }
}

/* Mown-stripe field */
[data-design="b"] .rf-stripe-field {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  overflow: hidden;
}
[data-design="b"] .rf-stripe {
  flex: 1;
  opacity: 0;
  animation: specimen-b-stripe-in var(--dur-grow) var(--ease-grow) forwards;
}
[data-design="b"] .rf-stripe--1 { background: color-mix(in oklab, var(--moss) 10%, transparent); animation-delay: 0ms; }
[data-design="b"] .rf-stripe--2 { background: color-mix(in oklab, var(--moss)  6%, transparent); animation-delay: 120ms; }
[data-design="b"] .rf-stripe--3 { background: color-mix(in oklab, var(--moss) 12%, transparent); animation-delay: 240ms; }
[data-design="b"] .rf-stripe--4 { background: color-mix(in oklab, var(--moss)  7%, transparent); animation-delay: 360ms; }
[data-design="b"] .rf-stripe--5 { background: color-mix(in oklab, var(--moss) 11%, transparent); animation-delay: 480ms; }
[data-design="b"] .rf-stripe--6 { background: color-mix(in oklab, var(--moss)  8%, transparent); animation-delay: 600ms; }
[data-design="b"] .rf-stripe--7 { background: color-mix(in oklab, var(--moss) 13%, transparent); animation-delay: 720ms; }

@keyframes specimen-b-stripe-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Drawn contour motif */
[data-design="b"] .rf-hero__motif {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  opacity: 0.22;
}
[data-design="b"] .rf-motif-row {
  fill: none;
  stroke: var(--moss-deep);
  stroke-width: 1.2;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}
[data-design="b"] .rf-motif-row--1 {
  pathLength: 1;
  animation: specimen-b-row-draw 1.8s var(--ease-grow) 0.4s forwards;
}
[data-design="b"] .rf-motif-row--2 {
  pathLength: 1;
  animation: specimen-b-row-draw 1.8s var(--ease-grow) 0.7s forwards;
}
[data-design="b"] .rf-motif-row--3 {
  pathLength: 1;
  animation: specimen-b-row-draw 1.8s var(--ease-grow) 1.0s forwards;
}
@keyframes specimen-b-row-draw {
  to { stroke-dashoffset: 0; }
}

/* Hero inner layout — content column */
[data-design="b"] .rf-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin-inline: auto;
  width: 100%;
  padding: var(--space-garden) clamp(16px, 5vw, 40px) var(--space-row);
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: var(--space-row);
  align-items: center;
}

/* Hero text */
[data-design="b"] .rf-hero__kicker {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: var(--space-em);
}
[data-design="b"] .rf-hero__name {
  font-family: var(--font-display);
  font-size: clamp(32px, 6vw, 60px);
  line-height: 1.06;
  margin: var(--space-em) 0 var(--space-leaf);
  color: var(--ink);
}
[data-design="b"] .rf-hero__desc {
  font-family: var(--font-tag);
  font-size: var(--text-cap);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
  line-height: 1.6;
  margin-bottom: var(--space-stem);
}
[data-design="b"] .rf-hero__proof {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink-soft);
  margin-bottom: var(--space-row);
}

/* Hero specimen figure */
[data-design="b"] .rf-specimen {
  margin: 0;
  text-align: center;
}
[data-design="b"] .rf-specimen__plate {
  width: 100%;
  max-width: 260px;
  height: auto;
  background: var(--gampi);
  padding: var(--space-stem);
  box-shadow: var(--shadow-mat);
}
[data-design="b"] .rf-specimen__tag {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
  display: block;
  margin-top: var(--space-em);
}

/* Botanical SVG animations */
[data-design="b"] .rf-stem {
  fill: none;
  stroke: var(--soil);
  stroke-width: 2.4;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: specimen-b-stem-grow var(--dur-grow) var(--ease-grow) forwards;
}
@keyframes specimen-b-stem-grow {
  to { stroke-dashoffset: 0; }
}
[data-design="b"] .rf-leaf {
  fill: var(--moss);
  stroke: var(--moss-deep);
  stroke-width: 1;
  transform-box: fill-box;
  transform-origin: 100% 50%;
}
[data-design="b"].is-rustling .rf-leaf[data-leaf="1"] {
  animation: specimen-b-rustle 18s var(--ease-rustle) infinite;
}
[data-design="b"].is-rustling .rf-leaf[data-leaf="2"] {
  animation: specimen-b-rustle 21s var(--ease-rustle) 0.6s infinite;
}
[data-design="b"].is-rustling .rf-leaf[data-leaf="3"] {
  animation: specimen-b-rustle 24s var(--ease-rustle) 1.1s infinite;
}
@keyframes specimen-b-rustle {
  0%,100% { transform: rotate(0deg); }
  25%     { transform: rotate(2deg); }
  60%     { transform: rotate(-2deg); }
}

[data-design="b"] .rf-petal {
  fill: var(--bloom-red);
  transform-box: fill-box;
  transform-origin: 0 0;
  transform: scale(0.94);
  opacity: 1;
}
[data-design="b"] .rf-bloom.is-open .rf-petal {
  animation: specimen-b-bloom var(--dur-bloom) var(--ease-bloom) forwards;
  animation-delay: calc(var(--i) * 80ms);
}
@keyframes specimen-b-bloom {
  from { transform: scale(0.94); }
  to   { transform: scale(1); }
}
[data-design="b"] .rf-stamen {
  fill: var(--autumn);
  opacity: 1;
}

/* HERO responsive */
@media (max-width: 768px) {
  [data-design="b"] .rf-hero__inner {
    grid-template-columns: 1fr;
    gap: var(--space-bed);
    padding-block: var(--space-row);
  }
  [data-design="b"] .rf-specimen { order: -1; }
  [data-design="b"] .rf-specimen__plate { max-width: 200px; }
}
@media (max-width: 390px) {
  [data-design="b"] .rf-specimen__plate { max-width: 168px; padding: var(--space-leaf); }
  [data-design="b"] .rf-hero__name { font-size: clamp(28px, 8vw, 40px); }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .rf-hero__backdrop::before { animation: none; opacity: 0.85; }
  [data-design="b"] .rf-stripe { animation: none; opacity: 1; }
  [data-design="b"] .rf-motif-row { animation: none; stroke-dashoffset: 0; }
  [data-design="b"] .rf-stem { animation: none; stroke-dashoffset: 0; }
  [data-design="b"] .rf-leaf { animation: none !important; transform: none !important; }
  [data-design="b"] .rf-petal { animation: none !important; transform: scale(1); opacity: 1; }
  [data-design="b"] .rf-stamen { opacity: 1; }
}

/* ================================================================
   ELEMENT 2 — Animated CTA (Plant button)
   ================================================================ */
[data-design="b"] .rf-cta {
  --leaf: 0;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--space-em);
  max-width: 100%;
  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: specimen-b-cta-breath 5s var(--ease-bloom) infinite;
  transition:
    background var(--dur-snap) var(--ease-unfurl),
    transform  var(--dur-tick) var(--ease-unfurl);
}
@keyframes specimen-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);
}
[data-design="b"] .rf-cta:active {
  transform: translateY(2px);
  box-shadow: var(--shadow-press);
}

@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;
  }
}

@media (max-width: 390px) {
  [data-design="b"] .rf-cta {
    font-size: var(--text-body);
    padding: 12px 20px;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .rf-cta {
    animation: none;
    transition: background var(--dur-snap);
  }
  [data-design="b"] .rf-cta__leaf path {
    transition: none;
    stroke-dashoffset: 0;
  }
}

/* ================================================================
   ELEMENT 6 — Pointer (surveyed-grown, planting-row ticks)
   data-mf-role="pointer"
   Must be opacity:1, height >= 8px, last before #funnel
   ================================================================ */
[data-design="b"] .rf-pointer {
  max-width: 1180px;
  margin-inline: auto;
  padding: var(--space-bed) clamp(16px, 5vw, 40px);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 1;
}
[data-design="b"] .rf-pointer__svg {
  width: clamp(120px, 30vw, 200px);
  height: auto;
  min-height: 48px;
  overflow: visible;
}
[data-design="b"] .rf-pointer__row {
  fill: none;
  stroke: var(--accent);
  stroke-width: 1.5;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: specimen-b-ptr-row 1.4s var(--ease-grow) 0.6s forwards;
}
@keyframes specimen-b-ptr-row {
  to { stroke-dashoffset: 0; }
}
[data-design="b"] .rf-pointer__tick {
  stroke: var(--moss);
  stroke-width: 1.2;
  stroke-linecap: round;
  transform-origin: center bottom;
  transform: scaleY(0);
  animation: specimen-b-tick-grow 0.5s var(--ease-unfurl) forwards;
}
[data-design="b"] .rf-pointer__tick--1 { animation-delay: 1.4s; }
[data-design="b"] .rf-pointer__tick--2 { animation-delay: 1.7s; }
[data-design="b"] .rf-pointer__tick--3 { animation-delay: 2.0s; }
@keyframes specimen-b-tick-grow {
  to { transform: scaleY(1); }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .rf-pointer__row { animation: none; stroke-dashoffset: 0; }
  [data-design="b"] .rf-pointer__tick { animation: none; transform: scaleY(1); }
}

/* ================================================================
   ELEMENT 5 — Routing qualifying funnel
   ================================================================ */
[data-design="b"] .rf-consult {
  max-width: 720px;
  margin-inline: auto;
  padding: var(--space-row) clamp(16px, 5vw, 40px);
}
[data-design="b"] .rf-consult__title {
  font-family: var(--font-display);
  font-size: clamp(28px, 5vw, var(--text-head));
  color: var(--ink);
  margin-bottom: var(--space-em);
}
[data-design="b"] .rf-consult__sub {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink-soft);
  margin-bottom: var(--space-stem);
  max-width: 58ch;
}
[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: specimen-b-step-grow var(--dur-unfurl) var(--ease-grow);
}
@keyframes specimen-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);
}
[data-design="b"] .rf-chip__sub {
  display: block;
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: 3px;
}
[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);
}

@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-chip:hover {
    border-color: var(--moss);
  }
}

/* Tag slip inputs */
[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 {
  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);
}
[data-design="b"] .rf-tagslip input:focus-visible {
  outline: none;
  border: 2px solid var(--moss);
}

/* Confirm state */
[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"] .rf-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"] .rf-confirm__note {
  font-family: var(--font-body);
  color: var(--ink-soft);
}

/* Funnel nav */
[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 24px;
  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);
}
[data-design="b"] .rf-back {
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--rule);
}
[data-design="b"] .rf-back[hidden],
[data-design="b"] .rf-submit[hidden] { display: none; }

@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-next:hover,
  [data-design="b"] .rf-submit:hover { background: var(--moss-deep); }
}

@media (max-width: 390px) {
  [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%; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .rf-step.is-active { animation: none; }
  [data-design="b"] .rf-chip { transition: none; }
}

/* ================================================================
   ELEMENT 4 — Bloom Calendar (service calendar, mid-page)
   ================================================================ */
[data-design="b"] .rf-calendar {
  background: var(--gampi-deep);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  padding-block: var(--space-row);
}
[data-design="b"] .rf-calendar .rf-section-inner {
  /* inherits rf-section-inner max-width */
}
[data-design="b"] .rf-calendar__sub {
  font-family: var(--font-body);
  color: var(--ink-soft);
  margin: var(--space-em) 0 var(--space-stem);
  max-width: 56ch;
}
[data-design="b"] .rf-calendar__frame {
  position: relative;
  overflow: hidden;
}
[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;
}
[data-design="b"] .rf-cal-row__track i.in-bloom {
  background: color-mix(in oklab, var(--accent) 70%, var(--gampi));
  border-color: var(--accent);
}
[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: specimen-b-cal-wave 18s linear infinite;
}
@keyframes specimen-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; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .rf-calendar__wave { animation: none; opacity: .25; }
}

/* ================================================================
   Process section
   ================================================================ */
[data-design="b"] .rf-process {
  padding-block: var(--space-row);
}
[data-design="b"] .rf-process__steps {
  list-style: none;
  margin: var(--space-stem) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-stem);
}
[data-design="b"] .rf-process__step {
  display: flex;
  align-items: flex-start;
  gap: var(--space-leaf);
  padding: var(--space-stem);
  border: 1px solid var(--rule);
  border-radius: var(--radius-tag);
  background: var(--gampi);
  box-shadow: var(--shadow-mat);
}
[data-design="b"] .rf-process__num {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .14em;
  color: var(--accent);
  flex: none;
  padding-top: 3px;
}
[data-design="b"] .rf-process__step strong {
  display: block;
  font-family: var(--font-display);
  font-size: var(--text-helper);
  color: var(--ink);
  margin-bottom: var(--space-em);
}
[data-design="b"] .rf-process__step p {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink-soft);
  line-height: 1.6;
  margin: 0;
}
/* Scroll-reveal: process steps fade+slide in from bottom (TRIAD-2 scroll-driven) */
[data-design="b"] .rf-process__step {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity  var(--dur-grow) var(--ease-grow),
    transform var(--dur-grow) var(--ease-grow);
}
[data-design="b"] .rf-process__step.scroll-hidden {
  opacity: 0;
  transform: translateY(32px);
}

/* ================================================================
   Services grid
   ================================================================ */
[data-design="b"] .rf-services-list {
  background: var(--gampi-deep);
  padding-block: var(--space-row);
  border-top: 1px solid var(--rule);
}
[data-design="b"] .rf-services__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--space-stem);
  margin-top: var(--space-stem);
}
[data-design="b"] .rf-service-plate {
  background: var(--gampi);
  border: 1px solid var(--rule);
  padding: var(--space-stem);
  box-shadow: var(--shadow-mat);
}
[data-design="b"] .rf-service__tag {
  display: block;
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: var(--space-leaf);
}
[data-design="b"] .rf-service-plate ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-em);
}
[data-design="b"] .rf-service-plate li {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink-soft);
  padding-left: var(--space-leaf);
  position: relative;
}
[data-design="b"] .rf-service-plate li::before {
  content: "·";
  position: absolute;
  left: 0;
  color: var(--accent);
}

/* ================================================================
   Photo gallery
   ================================================================ */
[data-design="b"] .rf-gallery {
  padding-block: var(--space-row);
}
[data-design="b"] .rf-gallery__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 32px;
  margin-top: var(--space-stem);
}
[data-design="b"] .rf-gallery__item {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--rule);
  box-shadow: var(--shadow-mat);
}
[data-design="b"] .rf-gallery__item img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
  transition: transform var(--dur-bloom) var(--ease-grow);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-gallery__item:hover img {
    transform: scale(1.03);
  }
}
[data-design="b"] .rf-gallery__cta-wrap {
  margin-top: var(--space-row);
  text-align: center;
}

/* ================================================================
   Service area
   ================================================================ */
[data-design="b"] .rf-area {
  background: var(--gampi-deep);
  border-top: 1px solid var(--rule);
  padding-block: var(--space-row);
}
[data-design="b"] .rf-area__lead {
  font-family: var(--font-body);
  font-size: var(--text-helper);
  color: var(--ink-soft);
  margin-bottom: var(--space-leaf);
}
[data-design="b"] .rf-area__list {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-stem);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-em) var(--space-leaf);
}
[data-design="b"] .rf-area__list li {
  font-family: var(--font-tag);
  font-size: var(--text-body);
  letter-spacing: .06em;
  color: var(--ink);
  background: var(--gampi);
  border: 1px solid var(--rule);
  padding: var(--space-em) var(--space-stem);
  border-radius: var(--radius-tag);
}
[data-design="b"] .rf-area__hours {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink-soft);
  line-height: 1.6;
}

/* ================================================================
   About section
   ================================================================ */
[data-design="b"] .rf-about {
  padding-block: var(--space-row);
}
[data-design="b"] .rf-about__inner {
  display: grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap: var(--space-row);
  align-items: center;
}
[data-design="b"] .rf-about__kicker {
  display: block;
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: var(--space-em);
}
[data-design="b"] .rf-about p {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--ink-soft);
  line-height: 1.7;
  max-width: 64ch;
  margin-bottom: var(--space-leaf);
}
[data-design="b"] .rf-about__tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-em);
  margin-top: var(--space-stem);
}
[data-design="b"] .rf-badge {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .12em;
  color: var(--gampi);
  background: var(--moss);
  padding: var(--space-em) var(--space-stem);
  border-radius: var(--radius-tag);
}
[data-design="b"] .rf-about__specimen img {
  width: 100%;
  height: auto;
  border: 1px solid var(--rule);
  box-shadow: var(--shadow-mat);
}
@media (max-width: 768px) {
  [data-design="b"] .rf-about__inner {
    grid-template-columns: 1fr;
  }
  [data-design="b"] .rf-about__specimen { order: -1; }
}

/* ================================================================
   Shared section titles
   ================================================================ */
[data-design="b"] .rf-section-title {
  font-family: var(--font-display);
  font-size: clamp(28px, 5vw, var(--text-head));
  color: var(--ink);
  line-height: 1.1;
  margin: 0 0 var(--space-stem);
}

/* ================================================================
   Footer
   ================================================================ */
[data-design="b"] .rf-footer {
  background: var(--ink);
  color: var(--gampi);
  padding-block: var(--space-row);
  border-top: 1px solid var(--rule);
}
[data-design="b"] .rf-footer__inner {
  display: grid;
  gap: var(--space-stem);
}
[data-design="b"] .rf-footer__brand {
  display: flex;
  flex-direction: column;
  gap: var(--space-em);
}
[data-design="b"] .rf-footer__name {
  font-family: var(--font-display);
  font-size: clamp(22px, 4vw, 32px);
  color: var(--gampi);
}
[data-design="b"] .rf-footer__sub {
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .14em;
  color: var(--muted);
}
[data-design="b"] .rf-footer__links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-em) var(--space-stem);
}
[data-design="b"] .rf-footer__links a {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--gampi-deep);
  text-decoration: none;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .rf-footer__links a:hover { color: var(--gampi); }
}
[data-design="b"] .rf-footer__trust {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-em) var(--space-leaf);
  font-family: var(--font-tag);
  font-size: var(--text-tag);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
}
[data-design="b"] .rf-footer__copy {
  font-family: var(--font-body);
  font-size: var(--text-cap);
  color: var(--muted);
  margin: 0;
}

/* 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; }