/* ═══════════════════════════════════════════════════════════════════
   DESIGN-B — Quarryworks for Robinson's Quality Roofing
   Slot-scope: [data-design="b"] — ZERO [data-design="b"] left.
   Expose --design-b-primary on [data-design="b"].
   All rules scoped under .dq-design or [data-design="b"].
   NO bare element / img / svg rules.
═══════════════════════════════════════════════════════════════════ */

/* ── 0. Design-B tokens ──────────────────────────────────────────── */
[data-design="b"] {
  --design-b-primary:    #A74628; /* terracotta */

  --qw-limestone:        #E4DCC4;
  --qw-limestone-deep:   #D4C8A7;
  --qw-slate:            #262528;
  --qw-slate-soft:       #454547;
  --qw-muted:            #7E7660;
  --qw-rule:             #1A191A;
  --qw-terracotta:       #A74628;
  --qw-copper-oxide:     #3A6B4F;
  --qw-carved-red:       #7A1E15;
  --qw-moss:             #3D5230;
  --qw-critical:         #5A140E;

  --qw-font-carved:      "Trajan Pro", "Cinzel", "Goudy Old Style", serif;
  --qw-font-display:     "Founders Grotesk Condensed", "Druk Wide", "Arial Narrow", sans-serif;
  --qw-font-body:        "Sentinel Book", "Roboto Slab", "PT Serif", Georgia, serif;
  --qw-font-mark:        "Cinzel", serif;
  --qw-font-data:        "IBM Plex Mono", "JetBrains Mono", "Courier New", monospace;

  --qw-text-dim:         12px;
  --qw-text-cap:         14px;
  --qw-text-body:        17px;
  --qw-text-deck:        clamp(20px, 2.8vw, 26px);
  --qw-text-head:        clamp(28px, 4vw, 44px);
  --qw-text-banner:      clamp(44px, 7vw, 72px);
  --qw-text-monument:    clamp(52px, 10vw, 120px);

  --qw-space-chisel:     2px;
  --qw-space-em:         8px;
  --qw-space-bed:        16px;
  --qw-space-course:     24px;
  --qw-space-pier:       56px;
  --qw-space-bay:        88px;
  --qw-space-quarry:     clamp(96px, 14vw, 144px);

  --qw-dur-tick:         160ms;
  --qw-dur-set:          420ms;
  --qw-dur-chisel:       680ms;
  --qw-dur-quarry:       1100ms;
  --qw-dur-cure:         2200ms;
  --qw-dur-dust:         32000ms;

  --qw-ease-set:         cubic-bezier(.65,.05,.36,1);
  --qw-ease-chisel:      cubic-bezier(.7,0,.84,0);
  --qw-ease-cure:        cubic-bezier(.45,.05,.55,.95);
  --qw-ease-ledger:      cubic-bezier(.34,.04,.26,1);

  --qw-radius-zero:      0;
  --qw-radius-pin:       2px;

  --qw-shadow-carved:    inset 0 1px 0 rgba(0,0,0,.5), inset 0 -1px 0 rgba(255,255,255,.06);
  --qw-shadow-block:     2px 2px 0 var(--qw-limestone-deep), 4px 4px 0 var(--qw-rule);
  --qw-shadow-press:     inset 0 3px 0 rgba(0,0,0,.3);
  --qw-shadow-mark:      inset 0 0 0 2px var(--qw-carved-red);
}

@media (prefers-color-scheme: dark) {
  [data-design="b"] {
    --qw-limestone:       #0E0C08;
    --qw-limestone-deep:  #181510;
    --qw-slate:           #E9E4D2;
    --qw-slate-soft:      #BFB89E;
    --qw-muted:           #857C62;
    --qw-rule:            #A89C7A;
    --qw-terracotta:      #CD6B45;
    --qw-copper-oxide:    #6E9D7F;
    --qw-carved-red:      #A33A2C;
    --qw-moss:            #789560;
    --qw-critical:        #A2271C;
  }
}

/* ── 1. Base reset (design-b scoped) ─────────────────────────────── */
[data-design="b"].dq-design {
  box-sizing: border-box;
  background: var(--qw-limestone);
  color: var(--qw-slate);
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  line-height: 1.65;
}

[data-design="b"].dq-design *,
[data-design="b"].dq-design *::before,
[data-design="b"].dq-design *::after {
  box-sizing: inherit;
}

/* ── 2. E1 — HEADER ──────────────────────────────────────────────── */
[data-design="b"] .qw-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--qw-limestone);
  border-bottom: 1px solid var(--qw-rule);
}

[data-design="b"] .qw-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--qw-space-course) var(--qw-space-pier);
  max-width: 1280px;
  margin: 0 auto;
}

[data-design="b"] .qw-logo {
  text-decoration: none;
  color: var(--qw-slate);
  display: flex;
  align-items: baseline;
  gap: var(--qw-space-course);
  flex-wrap: wrap;
}

[data-design="b"] .qw-logo__mark {
  font-family: var(--qw-font-carved);
  font-size: clamp(15px, 2vw, 22px);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-shadow: var(--qw-carved-depth, 0 1px 0 rgba(0,0,0,.15));
  transition: text-shadow 280ms var(--qw-ease-set);
}

[data-design="b"] .qw-header--deep .qw-logo__mark {
  --qw-carved-depth: 0 2px 0 rgba(0,0,0,.32), 0 -1px 0 rgba(255,255,255,.12);
}

[data-design="b"] .qw-logo__desc {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--qw-muted);
}

/* Hamburger — only visible element in header bar besides logo */
[data-design="b"] .qw-hamburger {
  background: none;
  border: none;
  cursor: pointer;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
}

[data-design="b"] .qw-hamburger__bar {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--qw-slate);
  transition: transform 240ms var(--qw-ease-set), opacity 200ms;
}

[data-design="b"] .qw-hamburger[aria-expanded="true"] .qw-hamburger__bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
[data-design="b"] .qw-hamburger[aria-expanded="true"] .qw-hamburger__bar:nth-child(2) {
  opacity: 0;
}
[data-design="b"] .qw-hamburger[aria-expanded="true"] .qw-hamburger__bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Header rule — 32s sweep animation */
[data-design="b"] .qw-header__rule {
  height: 2px;
  background: var(--qw-rule);
  transform-origin: center center;
  animation: b-rule-draw 32s var(--qw-ease-cure) infinite;
}

@keyframes b-rule-draw {
  0%, 5%    { transform: scaleX(0); }
  45%, 55%  { transform: scaleX(1); }
  95%, 100% { transform: scaleX(0); }
}

/* ── 3. DRAWER — focus-trapped nav overlay ───────────────────────── */
[data-design="b"] .qw-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(340px, 92vw);
  background: var(--qw-limestone);
  border-left: 2px solid var(--qw-rule);
  z-index: 200;
  transform: translateX(100%);
  transition: transform 360ms var(--qw-ease-set);
  overflow-y: auto;
}

[data-design="b"] .qw-drawer[hidden] {
  display: none;
}

[data-design="b"] .qw-drawer:not([hidden]) {
  transform: translateX(0);
}

[data-design="b"] .qw-drawer__inner {
  padding: var(--qw-space-pier) var(--qw-space-course);
  display: flex;
  flex-direction: column;
  gap: var(--qw-space-pier);
  min-height: 100%;
}

[data-design="b"] .qw-drawer__close {
  align-self: flex-end;
  background: none;
  border: 1px solid var(--qw-rule);
  color: var(--qw-slate);
  font-size: 16px;
  cursor: pointer;
  min-width: 44px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 200ms;
}

[data-design="b"] .qw-drawer__close:hover {
  background: var(--qw-limestone-deep);
}

[data-design="b"] .qw-drawer__nav {
  display: flex;
  flex-direction: column;
  gap: var(--qw-space-course);
}

[data-design="b"] .qw-drawer__link {
  font-family: var(--qw-font-display);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-slate);
  text-decoration: none;
  border-bottom: 1px solid var(--qw-limestone-deep);
  padding-bottom: var(--qw-space-course);
  transition: color 200ms;
}

[data-design="b"] .qw-drawer__link:hover {
  color: var(--qw-terracotta);
}

[data-design="b"] .qw-drawer__actions {
  display: flex;
  flex-direction: column;
  gap: var(--qw-space-course);
  margin-top: auto;
}

[data-design="b"] .qw-drawer__phone {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-body);
  color: var(--qw-slate);
  text-decoration: none;
  letter-spacing: 0.04em;
  min-height: 44px;
  display: flex;
  align-items: center;
}

/* Smoke overlay */
[data-design="b"] .qw-drawer__smoke {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 199;
  transition: opacity 360ms;
}

[data-design="b"] .qw-drawer__smoke[hidden] {
  display: none;
}

/* ── 4. E2 — CTA BUTTON — "The Bid Stone" ───────────────────────── */
[data-design="b"] .qw-cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 16px 28px;
  font-family: var(--qw-font-display);
  font-weight: 600;
  font-size: var(--qw-text-cap);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-limestone);
  background: var(--qw-slate);
  border: none;
  border-radius: 0;
  text-decoration: none;
  cursor: pointer;
  box-shadow: var(--qw-shadow-block);
  transition: transform 160ms var(--qw-ease-set), box-shadow 240ms var(--qw-ease-set);
  min-height: 44px;
  min-width: 44px;
}

[data-design="b"] .qw-cta::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: var(--qw-terracotta);
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform 360ms var(--qw-ease-set);
}

[data-design="b"] .qw-cta:hover,
[data-design="b"] .qw-cta:focus-visible {
  box-shadow: 3px 3px 0 var(--qw-limestone-deep), 6px 6px 0 var(--qw-rule);
}

[data-design="b"] .qw-cta:hover::after,
[data-design="b"] .qw-cta:focus-visible::after {
  transform: scaleX(1);
}

[data-design="b"] .qw-cta:focus-visible {
  outline: 2px solid var(--qw-copper-oxide);
  outline-offset: 6px;
}

[data-design="b"] .qw-cta:active {
  transform: translate(3px, 3px);
  box-shadow: var(--qw-shadow-press);
}

[data-design="b"] .qw-cta__mark {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--qw-carved-red);
  opacity: 0;
  transition: opacity 240ms var(--qw-ease-set);
}

[data-design="b"] .qw-cta:active .qw-cta__mark {
  opacity: 1;
}

/* ── 5. E3 — HERO — unique animated backdrop ─────────────────────── */
[data-design="b"] .qw-hero {
  position: relative;
  min-height: 72vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--qw-slate);
}

/* Backdrop — ONE animated layer: Ken-Burns photo + dust */
[data-design="b"] .qw-hero__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
}

[data-design="b"] .qw-hero__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  /* Ken-Burns: slow ambient zoom — perceptible, sustained, never arrives-then-freezes */
  animation: b-hero-ken 18s ease-in-out infinite alternate;
  will-change: transform;
}

@keyframes b-hero-ken {
  0%   { transform: scale(1)    translate(0%,    0%); }
  50%  { transform: scale(1.04) translate(-0.8%, -0.5%); }
  100% { transform: scale(1.07) translate(0.8%,  0.4%); }
}

/* Dust motes — ambient atmosphere layer (part of the one layer; they're within backdrop) */
[data-design="b"] .qw-hero__dust {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

[data-design="b"] .qw-hero__mote {
  position: absolute;
  border-radius: 50%;
  background: rgba(228, 220, 196, 0.18);
}

[data-design="b"] .qw-hero__mote--a {
  width: 3px; height: 3px;
  top: 30%; left: 20%;
  animation: b-mote-a var(--qw-dur-dust) linear infinite;
}
[data-design="b"] .qw-hero__mote--b {
  width: 2px; height: 2px;
  top: 55%; left: 65%;
  animation: b-mote-b calc(var(--qw-dur-dust) * 0.75) linear infinite;
}
[data-design="b"] .qw-hero__mote--c {
  width: 4px; height: 4px;
  top: 20%; left: 78%;
  animation: b-mote-c calc(var(--qw-dur-dust) * 1.2) linear infinite;
}

@keyframes b-mote-a {
  0%   { transform: translate(0, 0)    opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 0.6; }
  100% { transform: translate(18px, -120px); opacity: 0; }
}
@keyframes b-mote-b {
  0%   { transform: translate(0, 0);   opacity: 0; }
  10%  { opacity: 0.8; }
  90%  { opacity: 0.3; }
  100% { transform: translate(-14px, -90px); opacity: 0; }
}
@keyframes b-mote-c {
  0%   { transform: translate(0, 0);   opacity: 0; }
  8%   { opacity: 0.55; }
  88%  { opacity: 0.2; }
  100% { transform: translate(10px, -140px); opacity: 0; }
}

/* Dark veil over photo for text legibility */
[data-design="b"] .qw-hero__veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(26, 25, 26, 0.72) 0%,
    rgba(38, 37, 40, 0.55) 50%,
    rgba(26, 25, 26, 0.65) 100%
  );
}

/* Hero content — text always opacity:1 at first paint */
[data-design="b"] .qw-hero__content {
  position: relative;
  z-index: 1;
  max-width: 760px;
  padding: clamp(80px, 12vw, 128px) clamp(24px, 6vw, 88px);
}

[data-design="b"] .qw-hero__stamp {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--qw-terracotta);
  margin: 0 0 var(--qw-space-bed);
  opacity: 1;
}

/* HARD: hero headline opacity:1 at first paint */
[data-design="b"] .qw-hero__headline {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-banner);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  line-height: 1.05;
  color: var(--qw-limestone);
  text-shadow: var(--qw-shadow-carved);
  margin: 0 0 var(--qw-space-course);
  opacity: 1;
}

[data-design="b"] .qw-hero__subtitle {
  font-family: var(--qw-font-body);
  font-size: clamp(15px, 1.6vw, 18px);
  line-height: 1.55;
  color: var(--qw-limestone-deep);
  margin: 0 0 var(--qw-space-bed);
  opacity: 1;
  max-width: 55ch;
}

[data-design="b"] .qw-hero__proof {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--qw-muted);
  margin: 0 0 var(--qw-space-pier);
  opacity: 1;
}

[data-design="b"] .qw-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--qw-space-course);
  align-items: center;
}

/* ── 6. E6 — POINTER ─────────────────────────────────────────────── */
[data-design="b"] .qw-pointer {
  display: flex;
  justify-content: center;
  padding: clamp(48px, 8vw, 88px) 16px clamp(64px, 10vw, 104px);
  background: var(--qw-limestone);
  /* Ridge-line roofing register: terracotta accent */
  color: var(--qw-muted);
}

[data-design="b"] .qw-pointer__inner {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

[data-design="b"] .qw-pointer__tick {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  opacity: 0.7;
}

[data-design="b"] .qw-pointer__rule {
  display: block;
  width: 2px;
  height: 64px;
  background: currentColor;
  transform-origin: top center;
  animation: b-pointer-extend 5.5s ease-in-out infinite;
}

/* Ridge mark — the roofing-specific visual accent on the pointer */
[data-design="b"] .qw-pointer__ridge {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 40px;
  height: 2px;
  background: var(--qw-terracotta);
  opacity: 0;
  animation: b-pointer-ridge 5.5s ease-in-out infinite;
}

[data-design="b"] .qw-pointer__label {
  font-family: var(--qw-font-display);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--qw-terracotta);
  opacity: 0;
  margin-top: var(--qw-space-em);
  animation: b-pointer-stamp 5.5s ease-in-out infinite;
}

@keyframes b-pointer-extend {
  0%, 100% { transform: scaleY(0.35); opacity: 0.35; }
  50%      { transform: scaleY(1);    opacity: 0.9; }
}

@keyframes b-pointer-ridge {
  0%, 25%, 100% { opacity: 0; }
  45%, 65%      { opacity: 0.85; }
}

@keyframes b-pointer-stamp {
  0%, 30%, 100% { opacity: 0; }
  50%, 70%      { opacity: 1; }
}

/* ── 7. E5 — FUNNEL ──────────────────────────────────────────────── */
[data-design="b"] .qw-funnel {
  background: var(--qw-limestone);
  padding: var(--qw-space-quarry) clamp(24px, 6vw, 88px);
  max-width: 880px;
  margin: 0 auto;
  border-top: 2px solid var(--qw-rule);
}

[data-design="b"] .qw-funnel__stamp,
[data-design="b"] .qw-funnel__step-num {
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-muted);
  margin: 0 0 var(--qw-space-bed);
}

[data-design="b"] .qw-funnel__title {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-head);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 var(--qw-space-bed);
  color: var(--qw-slate);
  text-shadow: var(--qw-shadow-carved);
}

[data-design="b"] .qw-funnel__deck {
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  line-height: 1.7;
  color: var(--qw-slate-soft);
  margin: 0 0 var(--qw-space-pier);
  max-width: 60ch;
}

[data-design="b"] .qw-funnel__progress {
  display: flex;
  gap: var(--qw-space-em);
  list-style: none;
  padding: 0;
  margin: 0 0 var(--qw-space-pier);
  flex-wrap: wrap;
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

[data-design="b"] .qw-funnel__progress li {
  padding: 4px 10px;
  border: 1px solid var(--qw-rule);
  color: var(--qw-muted);
}

[data-design="b"] .qw-funnel__progress li[aria-current="true"] {
  border-color: var(--qw-slate);
  color: var(--qw-slate);
}

[data-design="b"] .qw-funnel__progress li.qw-funnel__progress-item--set {
  border-color: var(--qw-moss);
  color: var(--qw-moss);
}

[data-design="b"] .qw-funnel__form {
  position: relative;
}

[data-design="b"] .qw-funnel__step {
  background: var(--qw-limestone-deep);
  border: 2px solid var(--qw-slate);
  padding: var(--qw-space-course);
  margin: 0 0 var(--qw-space-bed);
  position: relative;
  opacity: 0;
  transform: translateY(-16px);
  transition: opacity var(--qw-dur-set) var(--qw-ease-set),
              transform var(--qw-dur-set) var(--qw-ease-set);
}

[data-design="b"] .qw-funnel__step:not([hidden]):not(.qw-funnel__step--buried) {
  opacity: 1;
  transform: translateY(0);
}

[data-design="b"] .qw-funnel__step[hidden] {
  display: block;
  opacity: 0;
  transform: translateY(-16px);
  visibility: hidden;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

[data-design="b"] .qw-funnel__step.qw-funnel__step--buried {
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
}

[data-design="b"] .qw-funnel__legend {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-deck);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--qw-slate);
  padding: 0;
  margin: 0 0 var(--qw-space-course);
  display: block;
  width: 100%;
}

[data-design="b"] .qw-funnel__choices {
  display: grid;
  gap: var(--qw-space-em);
  margin: 0 0 var(--qw-space-course);
}

[data-design="b"] .qw-funnel__choice {
  display: flex;
  align-items: center;
  gap: var(--qw-space-course);
  padding: var(--qw-space-course);
  background: var(--qw-limestone);
  border: 1px solid var(--qw-rule);
  cursor: pointer;
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  color: var(--qw-slate);
  transition: border-color 240ms var(--qw-ease-set);
  min-height: 44px;
}

[data-design="b"] .qw-funnel__choice:hover {
  border-color: var(--qw-terracotta);
}

[data-design="b"] .qw-funnel__choice input {
  accent-color: var(--qw-terracotta);
  min-width: 18px;
  min-height: 18px;
  flex-shrink: 0;
}

[data-design="b"] .qw-funnel__choice:has(input:checked) {
  border-color: var(--qw-terracotta);
}

[data-design="b"] .qw-funnel__note {
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  color: var(--qw-slate-soft);
  margin: 0 0 var(--qw-space-course);
  padding: var(--qw-space-bed) var(--qw-space-course);
  border-left: 3px solid var(--qw-terracotta);
  background: var(--qw-limestone);
}

[data-design="b"] .qw-funnel__note[hidden] {
  display: none;
}

[data-design="b"] .qw-funnel__fields {
  display: grid;
  gap: var(--qw-space-course);
  margin: 0 0 var(--qw-space-course);
}

[data-design="b"] .qw-funnel__field {
  display: block;
}

[data-design="b"] .qw-funnel__field-label {
  display: block;
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-slate);
  margin-bottom: var(--qw-space-em);
}

[data-design="b"] .qw-req {
  color: var(--qw-carved-red);
  margin-left: 2px;
}

[data-design="b"] .qw-funnel__field-input {
  width: 100%;
  padding: 10px 12px;
  background: var(--qw-limestone);
  border: 1px solid var(--qw-rule);
  border-radius: 0;
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-body);
  color: var(--qw-slate);
  transition: border-color 120ms var(--qw-ease-set);
  min-height: 44px;
}

[data-design="b"] .qw-funnel__field-input:focus {
  outline: none;
  border-color: var(--qw-slate);
  border-width: 2px;
  padding: 9px 11px;
}

[data-design="b"] .qw-funnel__field-input[aria-invalid="true"] {
  border-color: var(--qw-carved-red);
}

[data-design="b"] .qw-funnel__field-input--area {
  min-height: 96px;
  resize: vertical;
}

[data-design="b"] .qw-funnel__next,
[data-design="b"] .qw-funnel__submit {
  font-family: var(--qw-font-display);
  font-weight: 600;
  font-size: var(--qw-text-cap);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-limestone);
  background: var(--qw-slate);
  border: none;
  border-radius: 0;
  padding: 14px 28px;
  cursor: pointer;
  box-shadow: var(--qw-shadow-block);
  transition: transform 160ms var(--qw-ease-set), box-shadow 240ms var(--qw-ease-set);
  min-height: 44px;
  min-width: 44px;
}

[data-design="b"] .qw-funnel__next:hover,
[data-design="b"] .qw-funnel__submit:hover {
  box-shadow: 3px 3px 0 var(--qw-limestone-deep), 6px 6px 0 var(--qw-rule);
}

[data-design="b"] .qw-funnel__next:active,
[data-design="b"] .qw-funnel__submit:active {
  transform: translate(3px, 3px);
  box-shadow: var(--qw-shadow-press);
}

[data-design="b"] .qw-funnel__next:focus-visible,
[data-design="b"] .qw-funnel__submit:focus-visible {
  outline: 2px solid var(--qw-copper-oxide);
  outline-offset: 4px;
}

/* Confirmation */
[data-design="b"] .qw-funnel__confirm {
  background: var(--qw-limestone-deep);
  border: 2px solid var(--qw-carved-red);
  padding: var(--qw-space-course);
  margin-top: var(--qw-space-bed);
  position: relative;
}

[data-design="b"] .qw-funnel__confirm[hidden] {
  display: none;
}

[data-design="b"] .qw-funnel__mark {
  position: absolute;
  top: var(--qw-space-bed);
  right: var(--qw-space-bed);
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 2px solid var(--qw-carved-red);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--qw-font-mark);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--qw-carved-red);
  margin: 0;
  text-transform: uppercase;
}

[data-design="b"] .qw-funnel__stamp--accepted {
  color: var(--qw-carved-red);
  border: 1px solid var(--qw-carved-red);
  padding: 4px 10px;
  display: inline-block;
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 var(--qw-space-bed);
}

[data-design="b"] .qw-funnel__confirm-title {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-deck);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--qw-slate);
  margin: var(--qw-space-bed) 0;
}

[data-design="b"] .qw-funnel__confirm-body {
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  line-height: 1.7;
  color: var(--qw-slate-soft);
  margin: 0;
}

/* Below-funnel trust block */
[data-design="b"] .qw-funnel__trust {
  margin-top: var(--qw-space-pier);
  padding-top: var(--qw-space-course);
  border-top: 1px solid var(--qw-limestone-deep);
}

[data-design="b"] .qw-funnel__trust-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--qw-space-bed) var(--qw-space-pier);
  margin: 0;
}

[data-design="b"] .qw-funnel__trust-item dt {
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-muted);
  margin-bottom: 4px;
}

[data-design="b"] .qw-funnel__trust-item dd {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  color: var(--qw-slate);
  margin: 0;
}

[data-design="b"] .qw-funnel__trust-item a {
  color: var(--qw-slate);
  text-decoration: none;
  border-bottom: 1px solid var(--qw-terracotta);
}

/* ── 8. E3/E4 — SPECIMEN COURSE (services) ───────────────────────── */
[data-design="b"] .qw-course {
  background: var(--qw-limestone);
  padding: var(--qw-space-quarry) clamp(24px, 6vw, 88px);
  max-width: 1280px;
  margin: 0 auto;
  border-top: 2px solid var(--qw-rule);
}

[data-design="b"] .qw-course__head {
  margin-bottom: var(--qw-space-bay);
}

[data-design="b"] .qw-course__stamp {
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-muted);
  margin: 0 0 var(--qw-space-bed);
}

[data-design="b"] .qw-course__title {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-head);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0;
  color: var(--qw-slate);
  text-shadow: 0 1px 0 rgba(0,0,0,.15);
}

[data-design="b"] .qw-course__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: var(--qw-space-pier);
}

@media (min-width: 768px) {
  [data-design="b"] .qw-course__list {
    grid-template-columns: 1fr 1fr;
  }
}

[data-design="b"] .qw-plate {
  background: var(--qw-limestone-deep);
  border: 1px solid var(--qw-rule);
  padding: var(--qw-space-course);
  position: relative;
  opacity: 0;
  transform: translateY(-12px);
  transition: opacity var(--qw-dur-set) var(--qw-ease-set),
              transform var(--qw-dur-set) var(--qw-ease-set);
}

[data-design="b"] .qw-plate--set {
  opacity: 1;
  transform: translateY(0);
}

[data-design="b"] .qw-plate--set::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: var(--qw-terracotta);
  animation: b-mortar 1200ms var(--qw-ease-cure);
}

@keyframes b-mortar {
  0%   { opacity: 0; }
  20%  { opacity: 1; }
  100% { opacity: 0.6; }
}

[data-design="b"] .qw-plate__num {
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-muted);
  display: block;
  margin-bottom: var(--qw-space-bed);
}

[data-design="b"] .qw-plate__title {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-deck);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 var(--qw-space-bed);
  color: var(--qw-slate);
}

[data-design="b"] .qw-plate__body {
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  line-height: 1.7;
  color: var(--qw-slate-soft);
  margin: 0 0 var(--qw-space-course);
}

[data-design="b"] .qw-plate__mark {
  position: absolute;
  bottom: var(--qw-space-bed);
  right: var(--qw-space-bed);
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 2px solid var(--qw-carved-red);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--qw-font-mark);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--qw-carved-red);
  text-transform: uppercase;
}

[data-design="b"] .qw-course__cta-repeat {
  margin-top: var(--qw-space-bay);
  display: flex;
  justify-content: flex-start;
}

/* ── 9. E4 — CHISEL STRIKE / PROCESS ────────────────────────────── */
[data-design="b"] .qw-strike {
  background: var(--qw-limestone-deep);
  padding: var(--qw-space-quarry) clamp(24px, 6vw, 88px);
  text-align: center;
  max-width: 100%;
  border-top: 2px solid var(--qw-rule);
}

[data-design="b"] .qw-strike__title {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-monument);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 var(--qw-space-pier);
  color: var(--qw-slate);
  line-height: 0.92;
  text-shadow: var(--qw-shadow-carved);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--qw-dur-quarry) var(--qw-ease-set),
              transform var(--qw-dur-quarry) var(--qw-ease-set);
}

[data-design="b"] .qw-strike__title--struck {
  opacity: 1;
  transform: translateY(0);
}

[data-design="b"] .qw-strike__title--struck::after {
  content: "";
  display: inline-block;
  width: 3px; height: 3px;
  background: var(--qw-limestone-deep);
  margin-left: 4px;
  animation: b-chip-fall 600ms var(--qw-ease-cure);
  vertical-align: baseline;
}

@keyframes b-chip-fall {
  0%   { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(8px); }
}

[data-design="b"] .qw-strike__deck {
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  line-height: 1.7;
  color: var(--qw-slate-soft);
  margin: 0 auto var(--qw-space-bay);
  max-width: 60ch;
}

[data-design="b"] .qw-process__list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 640px;
  display: flex;
  flex-direction: column;
  gap: var(--qw-space-pier);
  text-align: left;
}

[data-design="b"] .qw-process__item {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: var(--qw-space-course);
  align-items: start;
}

[data-design="b"] .qw-process__num {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-deck);
  color: var(--qw-terracotta);
  line-height: 1;
  padding-top: 2px;
}

[data-design="b"] .qw-process__phase {
  font-family: var(--qw-font-carved);
  font-size: clamp(15px, 1.6vw, 18px);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--qw-slate);
  display: block;
  margin-bottom: 4px;
}

[data-design="b"] .qw-process__desc {
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  line-height: 1.6;
  color: var(--qw-slate-soft);
  margin: 0;
}

/* ── 10. ABOUT / QUARRY BOOK ─────────────────────────────────────── */
[data-design="b"] .qw-about {
  background: var(--qw-limestone);
  padding: var(--qw-space-quarry) clamp(24px, 6vw, 88px);
  border-top: 2px solid var(--qw-rule);
}

[data-design="b"] .qw-about__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--qw-space-bay);
  max-width: 1280px;
  margin: 0 auto;
}

@media (min-width: 768px) {
  [data-design="b"] .qw-about__inner {
    grid-template-columns: 3fr 2fr;
    align-items: start;
  }
}

[data-design="b"] .qw-about__body {
  font-family: var(--qw-font-body);
  font-size: var(--qw-text-body);
  line-height: 1.75;
  color: var(--qw-slate-soft);
  margin: 0 0 var(--qw-space-course);
  max-width: 66ch;
}

[data-design="b"] .qw-about__ledger {
  background: var(--qw-limestone-deep);
  border: 1px solid var(--qw-rule);
  padding: var(--qw-space-course);
}

[data-design="b"] .qw-about__schedule {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--qw-space-course);
  margin: 0;
}

[data-design="b"] .qw-about__schedule-item dt {
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-muted);
  margin-bottom: 2px;
}

[data-design="b"] .qw-about__schedule-item dd {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  color: var(--qw-slate);
  margin: 0;
}

[data-design="b"] .qw-about__schedule-item a {
  color: var(--qw-slate);
  text-decoration: none;
  border-bottom: 1px solid var(--qw-terracotta);
}

/* ── 11. FOOTER ──────────────────────────────────────────────────── */
[data-design="b"] .qw-footer {
  background: var(--qw-slate);
  padding: var(--qw-space-quarry) clamp(24px, 6vw, 88px);
  border-top: 2px solid var(--qw-rule);
}

[data-design="b"] .qw-footer__inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  gap: var(--qw-space-bay);
}

[data-design="b"] .qw-footer__brand {
  border-bottom: 1px solid var(--qw-slate-soft);
  padding-bottom: var(--qw-space-course);
}

[data-design="b"] .qw-footer__name {
  font-family: var(--qw-font-carved);
  font-size: var(--qw-text-deck);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--qw-limestone);
  margin: 0 0 var(--qw-space-em);
  text-shadow: var(--qw-shadow-carved);
}

[data-design="b"] .qw-footer__established {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--qw-terracotta);
  margin: 0;
}

[data-design="b"] .qw-footer__cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--qw-space-pier);
}

[data-design="b"] .qw-footer__col-head {
  font-family: var(--qw-font-display);
  font-size: var(--qw-text-dim);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--qw-muted);
  margin: 0 0 var(--qw-space-course);
}

[data-design="b"] .qw-footer__link {
  color: var(--qw-limestone-deep);
  text-decoration: none;
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  display: block;
  margin-bottom: var(--qw-space-em);
  transition: color 200ms;
}

[data-design="b"] .qw-footer__link:hover {
  color: var(--qw-terracotta);
}

[data-design="b"] .qw-footer__copy {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  color: var(--qw-limestone-deep);
  margin: 0 0 var(--qw-space-course);
  line-height: 1.6;
}

[data-design="b"] .qw-cta--footer {
  margin-top: var(--qw-space-course);
  font-size: 12px;
  padding: 12px 20px;
}

[data-design="b"] .qw-footer__legal {
  font-family: var(--qw-font-data);
  font-size: var(--qw-text-dim);
  color: var(--qw-muted);
  margin: 0;
  border-top: 1px solid var(--qw-slate-soft);
  padding-top: var(--qw-space-course);
}

/* ── 12. RESPONSIVE ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  [data-design="b"] .qw-header__bar { padding: var(--qw-space-bed) var(--qw-space-course); }
  [data-design="b"] .qw-logo__desc  { display: none; }
  [data-design="b"] .qw-hero        { min-height: 100svh; align-items: flex-end; }
  [data-design="b"] .qw-hero__content { padding: var(--qw-space-bay) var(--qw-space-course) clamp(48px,10vw,80px); }
  [data-design="b"] .qw-funnel      { padding: var(--qw-space-bay) var(--qw-space-course); }
  [data-design="b"] .qw-funnel__step { padding: var(--qw-space-bed); }
  [data-design="b"] .qw-course,
  [data-design="b"] .qw-strike,
  [data-design="b"] .qw-about       { padding: var(--qw-space-bay) var(--qw-space-course); }
}

@media (max-width: 560px) {
  [data-design="b"] .qw-hero__headline { font-size: clamp(32px, 9vw, 56px); }
}

/* ── 13. PREFERS-REDUCED-MOTION ──────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .qw-header__rule { animation: none; transform: scaleX(1); opacity: .5; }
  [data-design="b"] .qw-logo__mark   { transition: none; }
  [data-design="b"] .qw-hero__photo  { animation: none; }
  [data-design="b"] .qw-hero__mote   { animation: none; opacity: 0; }
  [data-design="b"] .qw-pointer__rule  { animation: none; opacity: 0.7; transform: scaleY(1); }
  [data-design="b"] .qw-pointer__label { animation: none; opacity: 0.7; }
  [data-design="b"] .qw-pointer__ridge { animation: none; opacity: 0.7; }
  [data-design="b"] .qw-plate          { transition: opacity 200ms linear; transform: none; }
  [data-design="b"] .qw-plate--set::after { animation: none; opacity: .6; }
  [data-design="b"] .qw-strike__title  { transition: none; opacity: 1; transform: none; }
  [data-design="b"] .qw-strike__title--struck::after { animation: none; opacity: 0; }
  [data-design="b"] .qw-funnel__step   { transition: opacity 200ms linear; transform: none; }
  [data-design="b"] .qw-funnel__step[hidden] { transform: none; }
  [data-design="b"] .qw-cta,
  [data-design="b"] .qw-cta::after,
  [data-design="b"] .qw-cta__mark      { transition: none; }
  [data-design="b"] .qw-hamburger__bar { transition: none; }
  [data-design="b"] .qw-drawer         { transition: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   HARD CONTRACT — mobile no-hscroll guards (appended last, verbatim)
═══════════════════════════════════════════════════════════════════ */
[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;
}

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