/* ==========================================================================
   Jerry Cerda Tile & Wood Floors — Site B — Kiln Card design, remapped to
   [data-design="b"]. Fired-earth blend-card system: one clay body run buff
   -> salmon -> flash -> clinker, on kraft-cream card stock. Tile's own trust
   dimension (waterproofing) is folded into the estimator's live line-item;
   the trade has no separate waterproofing section per brief (no
   waterproofing_system field supplied) so the estimator readout carries it.
   ========================================================================== */

[data-design="b"] {
  --design-b-primary: #C0684A;
  --b-paper: #F4EDE1;
  --b-paper-deep: #E9DDC9;
  --b-ink: #2B221B;
  --b-muted: #7A6A57;
  --b-buff: #D9B98A;
  --b-salmon: #C0684A;
  --b-flash: #95463A;
  --b-clinker: #4E312C;
  --b-critical: #8A3B2E;
  --b-success: #5C6B4A;

  --b-t-caption: 0.8rem;
  --b-t-body: clamp(1rem, 0.95rem + 0.25vw, 1.1875rem);
  --b-t-sub: 1.25rem;
  --b-t-h3: 1.5625rem;
  --b-t-h2: 1.953rem;
  --b-t-h1: clamp(1.953rem, 1.4rem + 2.6vw, 3.4rem);
  --b-t-display: clamp(2.4rem, 1.6rem + 4vw, 4.2rem);

  --b-ease-pull: cubic-bezier(0.33, 0, 0.15, 1);
  --b-ease-seat: cubic-bezier(0.2, 0.9, 0.28, 1);
  --b-d-press: 160ms;
  --b-d-fire: 240ms;
  --b-d-draft: 420ms;
  --b-d-arrive: 700ms;

  display: block;
  background: var(--b-paper);
  color: var(--b-ink);
  font-family: "Source Serif 4", Georgia, serif;
}

/* ---------- 1. Header ---------- */
[data-design="b"].kc-header { position: sticky; top: 0; z-index: 40; background: var(--b-paper); }
[data-design="b"] .kc-header__bar {
  max-width: 1320px; margin-inline: auto; padding: 16px clamp(20px, 5vw, 48px);
  display: flex; align-items: center; justify-content: space-between; box-sizing: border-box;
}
[data-design="b"] .kc-logo {
  font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: clamp(1.05rem, 0.95rem + 0.6vw, 1.4rem); line-height: 1.15; letter-spacing: 0.01em;
  color: var(--b-ink); text-decoration: none; max-width: 70%;
}
[data-design="b"] .kc-header__range { height: 3px; overflow: hidden; position: relative; }
[data-design="b"] .kc-header__range-strip {
  position: absolute; inset-block: 0; left: 0; width: 200%;
  background: linear-gradient(90deg,
    var(--b-buff) 0%, var(--b-salmon) 20%, var(--b-flash) 35%, var(--b-clinker) 50%,
    var(--b-flash) 65%, var(--b-salmon) 80%, var(--b-buff) 100%);
  animation: b-range-drift 26s linear infinite; will-change: transform;
}
@keyframes b-range-drift { from { transform: translateX(0); } to { transform: translateX(-50%); } }
[data-design="b"] .kc-burger {
  width: 48px; height: 48px; display: grid; place-content: center; gap: 7px;
  background: none; border: 2px solid var(--b-ink); border-radius: 0; cursor: pointer;
}
[data-design="b"] .kc-burger__line {
  display: block; width: 20px; height: 2px; background: var(--b-ink);
  transition: transform var(--b-d-press) var(--b-ease-seat);
}
[data-design="b"] .kc-burger[aria-expanded="true"] .kc-burger__line:first-child { transform: translateY(4.5px) rotate(45deg); }
[data-design="b"] .kc-burger[aria-expanded="true"] .kc-burger__line:last-child { transform: translateY(-4.5px) rotate(-45deg); }
[data-design="b"] .kc-drawer {
  position: fixed; inset: 0; z-index: 39; background: var(--b-paper-deep);
  opacity: 0; display: none; transition: opacity 280ms var(--b-ease-pull);
}
[data-design="b"] .kc-drawer.is-open { display: block; opacity: 1; }
[data-design="b"] .kc-drawer__inner {
  max-width: 1320px; margin-inline: auto; box-sizing: border-box;
  padding: 128px clamp(20px, 5vw, 48px) 48px; display: grid; gap: 24px;
}
[data-design="b"] .kc-drawer__link {
  font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: clamp(1.4rem, 1.15rem + 1.6vw, 2.2rem); color: var(--b-ink); text-decoration: none;
  padding: 8px 0 8px 20px; border-left: 12px solid var(--b-buff);
  transition: border-color var(--b-d-fire) var(--b-ease-seat);
}
[data-design="b"] .kc-drawer__link:focus-visible { outline: 3px solid var(--b-salmon); outline-offset: 2px; border-left-color: var(--b-flash); }
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .kc-drawer__link:hover { border-left-color: var(--b-flash); }
}
[data-design="b"] .kc-drawer__actions { margin-top: 32px; display: grid; gap: 16px; }
[data-design="b"] .kc-drawer__phone,
[data-design="b"] .kc-drawer__funnel {
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 1.1rem;
  color: var(--b-ink); text-decoration: none; padding: 14px 20px; min-height: 44px;
  border: 2px solid var(--b-ink); text-align: center; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center;
}
[data-design="b"] .kc-drawer__funnel { background: var(--b-salmon); color: var(--b-paper); border-color: var(--b-clinker); }
@media (max-width: 560px) { [data-design="b"] .kc-header__bar { padding-block: 12px; } }

/* ---------- 2. CTA — Damper Handle ---------- */
[data-design="b"] .kc-cta {
  position: relative; display: inline-flex; align-items: center; gap: 12px;
  min-height: 56px; padding: 16px 28px; box-sizing: border-box; max-width: min(100%, 340px);
  background: var(--b-salmon); color: var(--b-paper); text-decoration: none;
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 1.05rem;
  letter-spacing: 0.06em; text-transform: uppercase;
  border: 2px solid var(--b-clinker); box-shadow: 4px 4px 0 var(--b-clinker);
  transition: transform var(--b-d-press) var(--b-ease-seat),
              box-shadow var(--b-d-press) var(--b-ease-seat),
              background-color var(--b-d-fire) var(--b-ease-seat);
  overflow: hidden;
}
[data-design="b"] .kc-cta__ember {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(120% 160% at 50% 110%, var(--b-flash) 0%, rgba(149,70,58,0) 62%);
  opacity: 0.35; animation: b-ember-breath 5s var(--b-ease-pull) infinite; will-change: opacity;
}
@keyframes b-ember-breath { 0%, 100% { opacity: 0.35; } 50% { opacity: 0.75; } }
[data-design="b"] .kc-cta__label,
[data-design="b"] .kc-cta__tick { position: relative; }
[data-design="b"] .kc-cta__tick { font-size: 0.7em; transform: translateY(1px); }
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .kc-cta:hover {
    background: var(--b-flash); transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--b-clinker);
  }
}
[data-design="b"] .kc-cta:focus-visible { outline: 3px solid var(--b-salmon); outline-offset: 3px; }
[data-design="b"] .kc-cta:active { transform: translate(3px, 3px); box-shadow: 0 0 0 var(--b-clinker); }

[data-design="b"] .kc-cta-repeat { display: flex; justify-content: center; padding: 48px clamp(20px, 5vw, 48px); background: var(--b-paper); }

/* ---------- 3. Hero — blend-field ---------- */
[data-design="b"] .kc-hero {
  position: relative; min-height: 76vh; display: flex; align-items: flex-end;
  overflow: hidden; background: var(--b-paper-deep); isolation: isolate;
}
@media (max-width: 768px) { [data-design="b"] .kc-hero { min-height: 100svh; } }
[data-design="b"] .kc-hero__field {
  position: absolute; inset: 0; display: grid; z-index: 1;
  grid-template-columns: repeat(auto-fill, minmax(min(11vw, 96px), 1fr));
  grid-auto-rows: minmax(min(8vw, 64px), 1fr); gap: 5px; padding: 5px; box-sizing: border-box;
}
[data-design="b"] .kc-hero__chip { background: var(--b-buff); }
[data-design="b"] .kc-hero__chip:nth-of-type(3n) { background: var(--b-salmon); }
[data-design="b"] .kc-hero__chip:nth-of-type(4n) { background: var(--b-paper); }
[data-design="b"] .kc-hero__chip:nth-of-type(7n) { background: var(--b-flash); }
[data-design="b"] .kc-hero__chip:nth-of-type(11n) { background: var(--b-clinker); }
[data-design="b"] .kc-hero__chip:nth-of-type(13n) { background: var(--b-paper-deep); }
[data-design="b"] .kc-hero__shimmer {
  position: absolute; top: -20%; left: -30%; width: 55%; height: 140%; z-index: 1;
  background: linear-gradient(105deg, rgba(244,237,225,0) 0%, rgba(244,237,225,0.5) 45%, rgba(217,185,138,0.35) 55%, rgba(244,237,225,0) 100%);
  animation: b-shimmer 9s var(--b-ease-pull) infinite; will-change: transform; pointer-events: none;
}
@keyframes b-shimmer {
  0% { transform: translateX(-40%) skewX(-8deg); }
  100% { transform: translateX(320%) skewX(-8deg); }
}
[data-design="b"] .kc-hero__tint {
  position: absolute; inset: 0; background: var(--b-clinker); opacity: 0; pointer-events: none; z-index: 1;
}
[data-design="b"] .kc-hero__content {
  position: relative; z-index: 5; isolation: isolate; width: 100%; max-width: 1320px; margin-inline: auto;
  box-sizing: border-box; padding: 96px clamp(20px, 5vw, 48px) 64px;
  background: linear-gradient(180deg, rgba(244,237,225,0) 0%, rgba(244,237,225,0.88) 34%, rgba(244,237,225,0.96) 100%);
}
[data-design="b"] .kc-hero__title {
  font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: var(--b-t-display); line-height: 1.05; color: var(--b-ink);
  margin: 0 0 16px; max-width: 18ch; opacity: 1;
}
[data-design="b"] .kc-hero__sub {
  font-family: "Source Serif 4", Georgia, serif; font-size: var(--b-t-sub); line-height: 1.5;
  color: var(--b-ink); margin: 0 0 12px; max-width: 52ch; opacity: 1;
}
[data-design="b"] .kc-hero__proof {
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: var(--b-t-caption);
  line-height: 1.6; color: var(--b-muted); margin: 0 0 32px; opacity: 1;
}
[data-design="b"] .kc-hero__chiplabel {
  display: inline-block; margin-left: 12px; padding: 3px 12px; border: 1px solid var(--b-muted);
  border-radius: 999px; color: var(--b-ink); opacity: 1;
}
[data-design="b"] .kc-hero__chiplabel:empty { display: none; }

/* ---------- 6. Pointer — downdraft ---------- */
[data-design="b"] .kc-pointer {
  display: grid; justify-items: center; gap: 12px; padding: 48px 0 32px;
  background: var(--b-paper); opacity: 1;
}
[data-design="b"] .kc-pointer__flue { display: flex; gap: 10px; height: 72px; }
[data-design="b"] .kc-pointer__path {
  display: block; width: 3px; height: 100%;
  background: linear-gradient(180deg, var(--b-buff) 0%, var(--b-salmon) 55%, var(--b-flash) 100%);
  clip-path: inset(0 0 100% 0);
  animation: b-downdraft 5s var(--b-ease-pull) infinite;
}
[data-design="b"] .kc-pointer__path:nth-child(2) { animation-delay: 0.5s; height: 85%; align-self: flex-end; }
[data-design="b"] .kc-pointer__path:nth-child(3) { animation-delay: 1s; height: 70%; }
@keyframes b-downdraft {
  0% { clip-path: inset(0 0 100% 0); opacity: 1; }
  45% { clip-path: inset(0 0 0 0); opacity: 1; }
  70% { clip-path: inset(0 0 0 0); opacity: 0; }
  100% { clip-path: inset(0 0 100% 0); opacity: 0; }
}
[data-design="b"] .kc-pointer__label {
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.8rem; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--b-muted); opacity: 1;
}

/* ---------- 5. The Kiln — estimator funnel ---------- */
[data-design="b"] .kc-kiln { padding: 96px 0; background: var(--b-paper); }
@media (max-width: 768px) { [data-design="b"] .kc-kiln { padding: 64px 0; } }
[data-design="b"] .kc-kiln__card {
  --b-open: 0;
  position: relative; max-width: min(92vw, 760px); margin-inline: auto; box-sizing: border-box;
  background: var(--b-paper); border: 2px solid var(--b-ink);
  box-shadow: 8px 8px 0 var(--b-paper-deep); padding: clamp(24px, 4vw, 48px); overflow: hidden;
}
[data-design="b"] .kc-kiln__card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(217,185,138,0.20) 0%, rgba(149,70,58,0.16) 55%, rgba(78,49,44,0.22) 100%);
  opacity: var(--b-open); transition: opacity var(--b-d-arrive) var(--b-ease-pull);
}
[data-design="b"] .kc-kiln__title {
  position: relative; font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: var(--b-t-h2); line-height: 1.25; margin: 0 0 24px; color: var(--b-ink);
}
[data-design="b"] .kc-kiln__damper { position: relative; height: 32px; margin: 0 0 8px; }
[data-design="b"] .kc-kiln__damper-track {
  position: absolute; left: 0; right: 0; top: 14px; height: 4px; background: var(--b-paper-deep);
  border: 1px solid var(--b-ink);
}
[data-design="b"] .kc-kiln__damper-handle {
  position: absolute; left: 0; top: 0; width: 48px; height: 32px;
  background: var(--b-salmon); border: 2px solid var(--b-clinker); box-sizing: border-box;
  transform: translateX(calc(var(--b-open) * (100% * 5.8)));
  transition: transform var(--b-d-draft) var(--b-ease-pull), background-color var(--b-d-fire) var(--b-ease-seat);
  will-change: transform;
}
[data-design="b"] .kc-kiln__card.is-done .kc-kiln__damper-handle { background: var(--b-clinker); }
[data-design="b"] .kc-kiln__damper-scale {
  position: absolute; inset: 0; display: flex; justify-content: space-between; align-items: flex-end;
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.65rem; color: var(--b-muted);
  pointer-events: none;
}
[data-design="b"] .kc-kiln__damper-scale em { font-style: normal; transform: translateY(14px); }
[data-design="b"] .kc-kiln__stepline {
  position: relative; font-family: "IBM Plex Mono", "Courier New", monospace;
  font-size: var(--b-t-caption); color: var(--b-muted); margin: 16px 0 24px;
}

/* Live range readout (EST-4) */
[data-design="b"] .kc-kiln__range {
  position: relative; background: var(--b-paper-deep); border: 2px solid var(--b-ink);
  padding: 16px 20px; margin: 0 0 24px; display: grid; gap: 4px;
}
[data-design="b"] .kc-kiln__range-label {
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: var(--b-t-caption);
  text-transform: uppercase; letter-spacing: 0.06em; color: var(--b-muted);
}
[data-design="b"] .kc-kiln__range-value {
  font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: var(--b-t-h3); color: var(--b-flash); transition: color var(--b-d-fire) var(--b-ease-seat);
}
[data-design="b"] .kc-kiln__range-value.is-live { color: var(--b-clinker); }
[data-design="b"] .kc-kiln__range-note {
  font-family: "Source Serif 4", Georgia, serif; font-size: var(--b-t-caption); color: var(--b-muted);
}

[data-design="b"] .kc-kiln__step { position: relative; border: 0; padding: 0; margin: 0; }
[data-design="b"] .kc-kiln__step.is-current { animation: b-draft-in var(--b-d-draft) var(--b-ease-pull) both; }
@keyframes b-draft-in {
  from { clip-path: inset(0 0 100% 0); opacity: 0.4; }
  to { clip-path: inset(0 0 0 0); opacity: 1; }
}
[data-design="b"] .kc-kiln__q {
  font-family: "Source Serif 4", Georgia, serif; font-size: var(--b-t-h3); line-height: 1.35;
  color: var(--b-ink); margin: 0 0 20px; padding: 0; max-width: 32ch;
}
[data-design="b"] .kc-kiln__chips { display: flex; flex-wrap: wrap; gap: 12px; position: relative; }
[data-design="b"] .kc-kiln__chip {
  min-height: 56px; padding: 14px 20px; box-sizing: border-box; cursor: pointer;
  background: var(--b-buff); color: var(--b-ink); border: 2px solid var(--b-ink); border-radius: 0;
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.95rem; text-align: left;
  box-shadow: 3px 3px 0 var(--b-clinker); opacity: 1;
  transition: transform var(--b-d-press) var(--b-ease-seat),
              box-shadow var(--b-d-press) var(--b-ease-seat),
              background-color var(--b-d-fire) var(--b-ease-seat),
              color var(--b-d-fire) var(--b-ease-seat);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .kc-kiln__chip:hover { background: var(--b-salmon); color: var(--b-paper); }
}
[data-design="b"] .kc-kiln__chip:focus-visible { outline: 3px solid var(--b-salmon); outline-offset: 2px; }
[data-design="b"] .kc-kiln__chip:active,
[data-design="b"] .kc-kiln__chip.is-fired {
  background: var(--b-clinker); color: var(--b-paper);
  transform: translate(3px, 3px); box-shadow: 0 0 0 var(--b-clinker);
}
[data-design="b"] .kc-kiln__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 560px) { [data-design="b"] .kc-kiln__fields { grid-template-columns: 1fr; } }
[data-design="b"] .kc-kiln__field { display: grid; gap: 8px; }
[data-design="b"] .kc-kiln__field--wide { grid-column: 1 / -1; }
[data-design="b"] .kc-kiln__field span {
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: var(--b-t-caption);
  text-transform: uppercase; letter-spacing: 0.06em; color: var(--b-muted);
}
[data-design="b"] .kc-kiln__field input,
[data-design="b"] .kc-kiln__field textarea {
  min-height: 48px; padding: 12px 14px; box-sizing: border-box; width: 100%;
  background: var(--b-paper-deep); color: var(--b-ink); border: 0; border-bottom: 2px solid var(--b-ink);
  border-radius: 3px 3px 0 0; font-family: "Source Serif 4", Georgia, serif; font-size: 1rem;
}
[data-design="b"] .kc-kiln__field input:focus-visible,
[data-design="b"] .kc-kiln__field textarea:focus-visible {
  outline: 3px solid var(--b-salmon); outline-offset: 1px;
}
[data-design="b"] .kc-kiln__error {
  color: var(--b-critical); font-family: "IBM Plex Mono", "Courier New", monospace;
  font-size: var(--b-t-caption); margin: 16px 0 0;
}
[data-design="b"] .kc-kiln__submit {
  margin-top: 24px; min-height: 56px; padding: 16px 28px; cursor: pointer;
  background: var(--b-salmon); color: var(--b-paper); border: 2px solid var(--b-clinker); border-radius: 0;
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 1.05rem; text-transform: uppercase;
  letter-spacing: 0.06em; box-shadow: 4px 4px 0 var(--b-clinker);
  transition: transform var(--b-d-press) var(--b-ease-seat), box-shadow var(--b-d-press) var(--b-ease-seat);
}
[data-design="b"] .kc-kiln__submit:active { transform: translate(3px, 3px); box-shadow: 0 0 0 var(--b-clinker); }
[data-design="b"] .kc-kiln__submit:focus-visible { outline: 3px solid var(--b-salmon); outline-offset: 3px; }
[data-design="b"] .kc-kiln__done { position: relative; }
[data-design="b"] .kc-kiln__done-head {
  font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: var(--b-t-h3); color: var(--b-ink); margin: 0 0 12px;
}
[data-design="b"] .kc-kiln__done-body {
  font-family: "Source Serif 4", Georgia, serif; font-size: var(--b-t-body); line-height: 1.65;
  color: var(--b-ink); margin: 0; max-width: 56ch;
}
[data-design="b"] .kc-kiln__foot {
  position: relative; display: flex; justify-content: space-between; align-items: center; margin-top: 32px;
}
[data-design="b"] .kc-kiln__back {
  background: none; border: 0; padding: 12px; min-height: 44px; cursor: pointer;
  font-family: "IBM Plex Mono", "Courier New", monospace; color: var(--b-muted); font-size: 0.9rem;
}
[data-design="b"] .kc-kiln__back:focus-visible { outline: 3px solid var(--b-salmon); }
[data-design="b"] .kc-kiln__phone {
  font-family: "IBM Plex Mono", "Courier New", monospace; color: var(--b-ink); font-size: 0.9rem;
  text-decoration: none; border-bottom: 2px solid var(--b-salmon); padding: 8px 0; min-height: 44px;
  display: inline-flex; align-items: center;
}

/* ---------- 4. Kiln Log — Gallery ---------- */
[data-design="b"] .kc-log { position: relative; overflow: hidden; background: var(--b-paper-deep); padding: 96px 0; }
@media (max-width: 768px) { [data-design="b"] .kc-log { padding: 64px 0; } }
[data-design="b"] .kc-log__heat {
  position: absolute; left: 0; right: 0; top: 0; height: 200%;
  background: linear-gradient(0deg, rgba(192,104,74,0.14) 0%, rgba(233,221,201,0) 40%, rgba(192,104,74,0.14) 60%, rgba(233,221,201,0) 100%);
  animation: b-updraft 18s linear infinite; will-change: transform; pointer-events: none;
}
@keyframes b-updraft { from { transform: translateY(0); } to { transform: translateY(-50%); } }
[data-design="b"] .kc-log__inner { position: relative; max-width: 1320px; margin-inline: auto; box-sizing: border-box; padding-inline: clamp(20px, 5vw, 48px); }
[data-design="b"] .kc-log__strip { display: flex; gap: 8px; margin: 0 0 48px; }
[data-design="b"] .kc-log__pos {
  position: relative; width: 64px; height: 40px; border: 2px solid var(--b-ink); border-radius: 0;
  background: var(--b-buff); cursor: pointer; padding: 0; overflow: hidden;
  transition: background-color var(--b-d-fire) var(--b-ease-seat), transform var(--b-d-press) var(--b-ease-seat);
}
[data-design="b"] .kc-log__pos:nth-child(2) { background: var(--b-salmon); }
[data-design="b"] .kc-log__pos:nth-child(3) { background: var(--b-flash); }
[data-design="b"] .kc-log__pos:nth-child(4) { background: var(--b-clinker); }
[data-design="b"] .kc-log__pos span {
  position: absolute; inset: 0; display: grid; place-content: center;
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.65rem; letter-spacing: 0.08em;
  color: var(--b-paper); opacity: 0; transition: opacity var(--b-d-fire) var(--b-ease-seat);
}
[data-design="b"] .kc-log__pos.is-flipped { transform: translateY(2px); }
[data-design="b"] .kc-log__pos.is-flipped span { opacity: 1; }
[data-design="b"] .kc-log__entries { margin: 0; display: grid; gap: 24px; }
[data-design="b"] .kc-log__entry {
  background: var(--b-paper); border: 2px solid var(--b-ink); box-shadow: 6px 6px 0 rgba(78,49,44,0.14);
  padding: 24px; max-width: 72ch; box-sizing: border-box;
}
[data-design="b"] .kc-log__entry dt {
  font-family: "IBM Plex Mono", "Courier New", monospace; text-transform: uppercase;
  letter-spacing: 0.06em; font-size: var(--b-t-caption); color: var(--b-flash); margin: 0 0 8px;
}
[data-design="b"] .kc-log__entry dd {
  margin: 0; font-family: "Source Serif 4", Georgia, serif; font-size: var(--b-t-body);
  line-height: 1.65; color: var(--b-ink);
}

/* ---------- 7. Scroll choreography ---------- */
[data-design="b"] .kc-scrollhead {
  display: flex; align-items: center; gap: 16px; max-width: 1320px; margin-inline: auto;
  box-sizing: border-box; padding: 0 clamp(20px, 5vw, 48px); margin-bottom: 32px;
}
[data-design="b"] .kc-scrollhead__chip { width: 40px; height: 26px; background: var(--b-flash); border: 2px solid var(--b-ink); flex: none; }
[data-design="b"] .kc-scrollhead__title {
  font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: var(--b-t-h2); line-height: 1.25; color: var(--b-ink); margin: 0;
}
@supports (animation-timeline: view()) {
  [data-design="b"] .kc-hero__tint {
    animation: b-fire-down linear both; animation-timeline: view(); animation-range: exit 0% exit 100%;
  }
  @keyframes b-fire-down { from { opacity: 0; } to { opacity: 0.45; } }
  [data-design="b"] .kc-scrollhead__chip {
    animation: b-chip-fire linear both; animation-timeline: view(); animation-range: entry 0% entry 80%;
  }
  [data-design="b"] .kc-scrollhead__title {
    animation: b-title-seat linear both; animation-timeline: view(); animation-range: entry 0% entry 80%;
  }
  @keyframes b-chip-fire { from { opacity: 0.15; } to { opacity: 1; } }
  @keyframes b-title-seat { from { transform: translateY(12px); opacity: 0.3; } to { transform: translateY(0); opacity: 1; } }
}

/* ---------- Process ---------- */
[data-design="b"] .kc-process { padding: 96px 0; background: var(--b-paper); }
@media (max-width: 768px) { [data-design="b"] .kc-process { padding: 64px 0; } }
[data-design="b"] .kc-process__inner { max-width: 1320px; margin-inline: auto; box-sizing: border-box; padding-inline: clamp(20px, 5vw, 48px); }
[data-design="b"] .kc-process__track { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
@media (max-width: 768px) { [data-design="b"] .kc-process__track { grid-template-columns: 1fr; } }
[data-design="b"] .kc-process__phase {
  background: var(--b-paper-deep); border: 2px solid var(--b-ink); padding: 24px; box-sizing: border-box;
}
[data-design="b"] .kc-process__num {
  display: block; font-family: "IBM Plex Mono", "Courier New", monospace; font-size: var(--b-t-h3);
  color: var(--b-salmon); margin-bottom: 8px;
}
[data-design="b"] .kc-process__label {
  display: block; font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif;
  font-size: 1.05rem; color: var(--b-ink); margin-bottom: 8px;
}
[data-design="b"] .kc-process__phase p { margin: 0; font-size: var(--b-t-caption); line-height: 1.6; color: var(--b-muted); }

/* ---------- Tile Types ---------- */
[data-design="b"] .kc-types { padding: 96px 0; background: var(--b-paper-deep); }
@media (max-width: 768px) { [data-design="b"] .kc-types { padding: 64px 0; } }
[data-design="b"] .kc-types__inner { max-width: 1320px; margin-inline: auto; box-sizing: border-box; padding-inline: clamp(20px, 5vw, 48px); }
[data-design="b"] .kc-types__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
@media (max-width: 768px) { [data-design="b"] .kc-types__grid { grid-template-columns: repeat(2, 1fr); } }
[data-design="b"] .kc-types__chip-card {
  display: flex; align-items: center; gap: 12px; background: var(--b-paper); border: 2px solid var(--b-ink);
  padding: 16px; box-sizing: border-box; font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.9rem;
}
[data-design="b"] .kc-types__chip { width: 28px; height: 28px; border: 2px solid var(--b-ink); flex: none; }
[data-design="b"] .kc-types__chip.range-1 { background: var(--b-buff); }
[data-design="b"] .kc-types__chip.range-2 { background: var(--b-salmon); }
[data-design="b"] .kc-types__chip.range-3 { background: var(--b-flash); }
[data-design="b"] .kc-types__chip.range-4 { background: var(--b-clinker); }
[data-design="b"] .kc-types__note { margin: 24px 0 0; color: var(--b-muted); font-size: var(--b-t-caption); }

/* ---------- About ---------- */
[data-design="b"] .kc-about { padding: 96px 0; background: var(--b-paper); }
@media (max-width: 768px) { [data-design="b"] .kc-about { padding: 64px 0; } }
[data-design="b"] .kc-about__inner { max-width: 1320px; margin-inline: auto; box-sizing: border-box; padding-inline: clamp(20px, 5vw, 48px); }
[data-design="b"] .kc-about__body { max-width: 65ch; font-size: var(--b-t-body); line-height: 1.7; color: var(--b-ink); margin: 0; }

/* ---------- Service Area ---------- */
[data-design="b"] .kc-area { padding: 96px 0; background: var(--b-paper-deep); }
@media (max-width: 768px) { [data-design="b"] .kc-area { padding: 64px 0; } }
[data-design="b"] .kc-area__inner { max-width: 1320px; margin-inline: auto; box-sizing: border-box; padding-inline: clamp(20px, 5vw, 48px); }
[data-design="b"] .kc-area__chips { display: flex; flex-wrap: wrap; gap: 12px; }
[data-design="b"] .kc-area__chip {
  padding: 10px 18px; background: var(--b-paper); border: 2px solid var(--b-ink);
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.9rem; color: var(--b-ink);
}

/* ---------- Footer ---------- */
[data-design="b"] .kc-footer { background: var(--b-clinker); color: var(--b-paper); padding: 64px 0 0; }
[data-design="b"] .kc-footer__inner {
  max-width: 1320px; margin-inline: auto; box-sizing: border-box; padding: 0 clamp(20px, 5vw, 48px) 48px;
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px;
}
@media (max-width: 768px) { [data-design="b"] .kc-footer__inner { grid-template-columns: 1fr; } }
[data-design="b"] .kc-footer__name { font-family: "Archivo Black", "Franklin Gothic Medium", "Arial Black", sans-serif; font-size: 1.1rem; margin: 0 0 8px; }
[data-design="b"] .kc-footer__addr { font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.85rem; color: var(--b-buff); margin: 0; }
[data-design="b"] .kc-footer__nav { display: flex; flex-direction: column; gap: 12px; }
[data-design="b"] .kc-footer__nav a { color: var(--b-paper); text-decoration: none; font-size: 0.95rem; border-bottom: 2px solid transparent; padding-bottom: 2px; width: fit-content; }
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .kc-footer__nav a:hover { border-bottom-color: var(--b-salmon); }
}
[data-design="b"] .kc-footer__group { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
[data-design="b"] .kc-footer__phone,
[data-design="b"] .kc-footer__funnel {
  font-family: "IBM Plex Mono", "Courier New", monospace; font-size: 0.9rem; text-decoration: none;
  padding: 10px 16px; border: 2px solid var(--b-paper); color: var(--b-paper); min-height: 44px;
  display: inline-flex; align-items: center; box-sizing: border-box;
}
[data-design="b"] .kc-footer__funnel { background: var(--b-salmon); border-color: var(--b-salmon); }
[data-design="b"] .kc-footer__strip {
  height: 10px;
  background: linear-gradient(90deg, var(--b-buff), var(--b-salmon), var(--b-flash), var(--b-clinker), var(--b-flash), var(--b-salmon), var(--b-buff));
}
[data-design="b"] .kc-footer__copy { text-align: center; padding: 16px; margin: 0; font-size: 0.8rem; color: var(--b-buff); font-family: "IBM Plex Mono", "Courier New", monospace; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .kc-header__range-strip { animation: none; transform: translateX(-25%); }
  [data-design="b"] .kc-drawer { transition: none; }
  [data-design="b"] .kc-cta__ember { animation: none; opacity: 0.5; }
  [data-design="b"] .kc-cta { transition: none; }
  [data-design="b"] .kc-hero__shimmer { animation: none; transform: translateX(90%) skewX(-8deg); }
  [data-design="b"] .kc-pointer__path { animation: none; clip-path: inset(0 0 30% 0); opacity: 0.8; }
  [data-design="b"] .kc-log__heat { animation: none; transform: translateY(-25%); }
  [data-design="b"] .kc-log__pos, [data-design="b"] .kc-log__pos span { transition: none; }
  [data-design="b"] .kc-kiln__step.is-current { animation: none; }
  [data-design="b"] .kc-kiln__damper-handle { transition: none; }
  [data-design="b"] .kc-kiln__card::before { transition: none; }
  [data-design="b"] .kc-kiln__chip, [data-design="b"] .kc-kiln__submit { transition: none; }
  [data-design="b"] .kc-hero__tint,
  [data-design="b"] .kc-scrollhead__chip,
  [data-design="b"] .kc-scrollhead__title { animation: none; }
}

/* ==========================================================================
   Mobile / no-h-scroll safety net — appended at bottom per contract, scoped
   strictly to .dq-design so it never leaks onto shared chrome-kit modal.
   ========================================================================== */
[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; }

/* stranded-wrapper autofix (drain 2026-07-03): every fixed max-width column centers — gate content_uncentered_left_stranded */
[data-design="b"] .kc-hero__sub { margin-inline: auto; }
[data-design="b"] .kc-kiln__q { margin-inline: auto; }
[data-design="b"] .kc-kiln__done-body { margin-inline: auto; }
[data-design="b"] .kc-log__entry { margin-inline: auto; }
[data-design="b"] .kc-about__body { margin-inline: 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; }