/* ============================================================
   GPA Design System v4 - Blended Edition (shared stylesheet)
   Skin: Light Stone Amber | Nerve: launch punch | No scroll-reveal
   Serves: vendors, retailers, tradeshows, talk
   ============================================================ */
/* ============================================================
   GPA Design System v3 — Light Stone Amber (demo)
   Palette: White / Stone-2 / Ink / Amber / Deep Amber (slot 2)
   Type: EB Garamond (display) + Inter (body) + JetBrains Mono (data)
   ============================================================ */

:root {
  /* Surfaces */
  --canvas:     #ffffff;
  --stone:      #e8e4da;
  --stone-soft: #f4f2ec;
  --line:       #dad5c9;
  --line-soft:  #e7e3d8;

  /* Ink */
  --ink:        #4a5568;
  --ink-deep:   #252d3b;
  --ink-faint:  #8b94a3;

  /* Signal — amber */
  --amber:        #d97706;
  --amber-lo:     rgba(217,119,6,.08);

  /* Slot 2 — deep amber (amber-900 russet, tonal depth instead of second hue) */
  --ember:      #b45309;
  --ember-deep: #451a03;
  --ember-lo:   rgba(180,83,9,.06);

  /* Semantic */
  --red-out:    #c02626;
  --red-lo:     rgba(192,38,38,.05);

  /* Dark inversion band */
  --dark:       #252d3b;
  --dark-2:     #2e3747;

  /* Type */
  --f-display: 'EB Garamond', Georgia, serif;
  --f-display-i: 'EB Garamond', Georgia, serif;
  --f-body:    'Inter', system-ui, sans-serif;
  --f-mono:    'JetBrains Mono', ui-monospace, monospace;

  /* Spacing */
  --maxw: 1280px;
  --gut:  clamp(20px, 5vw, 80px);
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-snap: cubic-bezier(.16, 1, .3, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--f-body);
  font-size: clamp(15px, 1vw, 17px);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
p { margin: 0 0 1em; }
a:focus-visible, button:focus-visible {
  outline: 2px solid var(--amber);
  outline-offset: 3px;
  border-radius: 3px;
}
.skip {
  position: absolute; left: -999px; top: 0; z-index: 1000;
  background: var(--amber); color: #fff; padding: 12px 18px;
  font-family: var(--f-body); font-weight: 600;
}
.skip:focus { left: 12px; top: 12px; }
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gut); }
/* ---- Type primitives ---- */
h1, h2, h3, h4 { margin: 0; }
h1, .display, .h2 { font-family: var(--f-display); font-weight: 500; }
h3, h4 { font-family: var(--f-body); font-weight: 600; }
.display {
  font-size: clamp(3rem, 7.4vw, 7rem);
  line-height: .975; /* ~5px tighter between hero lines at desktop cap */
  letter-spacing: -.015em;
  color: var(--ink-deep);
}
.h2 {
  font-size: clamp(2.1rem, 4vw, 3.7rem);
  letter-spacing: -.01em;
  line-height: 1.05;
  color: var(--ink);
}
.h3 {
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  font-weight: 600;
  letter-spacing: -.015em;
  line-height: 1.1;
}
.lead {
  font-size: clamp(1.05rem, 1.5vw, 1.3rem);
  line-height: 1.58;
  color: var(--ink);
  font-weight: 400;
}
.eyebrow {
  font-family: var(--f-mono);
  font-size: .7rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .22em;
  color: var(--ink-faint);
  display: inline-flex;
  align-items: center;
  gap: .8em;
}
.eyebrow::before {
  content: "";
  display: inline-block;
  width: 22px; height: 1px;
  background: var(--amber);
}
.accent { color: var(--amber); font-family: var(--f-display-i); font-style: italic; }
.mist   { color: var(--ink); }
/* ---- Buttons ---- */
.btn {
  font-family: var(--f-body);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: .5em;
  text-decoration: none;
  cursor: pointer;
  border: none;
  background: none;
  letter-spacing: -.01em;
  border-radius: 5px;
  transition: transform .22s var(--ease), background .22s, color .22s, border-color .22s;
  white-space: nowrap;
}
.btn-amber {
  background: var(--amber);
  color: #fff;
  padding: 15px 32px;
  font-size: 1rem;
}
.btn-amber:hover {
  background: #92400e;
  transform: translateY(-2px);
}
.btn-ghost {
  background: transparent;
  color: var(--ink-deep);
  border: 1px solid var(--line);
  padding: 14px 26px;
  font-size: .95rem;
}
.btn-ghost:hover {
  border-color: var(--ink);
  background: var(--stone-soft);
  transform: translateY(-2px);
}
.btn-sm { padding: 9px 18px; font-size: .86rem; }
.arr { transition: transform .22s var(--ease); display: inline-block; }
.btn:hover .arr { transform: translateX(4px); }

/* Hero CTA hover: colour-inversion (matches homepage; opaque fills, equal height, no lift) */
.hero-ctas .btn-amber { border: 1.5px solid var(--amber); padding: 15px 30px; font-size: 1rem; }
.hero-ctas .btn-amber:hover { background: var(--canvas); border-color: var(--amber); color: var(--amber); transform: none; }
.hero-ctas .btn-ghost { background: var(--canvas); color: var(--ink-deep); border: 1.5px solid var(--ink-deep); padding: 15px 30px; font-size: 1rem; }
.hero-ctas .btn-ghost:hover { background: var(--ink-deep); color: #fff; border-color: var(--ink-deep); transform: none; }
/* ---- Topbar ---- */
.topbar {
  position: sticky; top: 0; z-index: 60;
  background: rgba(255,255,255,.88);
  border-bottom: 1px solid var(--line-soft);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transition: box-shadow .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease);
}
.topbar.is-scrolled {
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 24px -18px rgba(37,45,59,.28);
}
/* Context-aware theme: bar goes dark while a dark band scrolls beneath it (June 26 build pattern, inverted) */
.logo--dark { display: none; }
.topbar.topbar--dark {
  background: rgba(37,45,59,.92);
  border-bottom-color: var(--dark-2);
}
.topbar.topbar--dark.is-scrolled {
  background: rgba(37,45,59,.96);
  box-shadow: 0 8px 24px -16px rgba(0,0,0,.5);
}
.topbar--dark .logo--light { display: none; }
.topbar--dark .logo--dark  { display: block; }
.topbar--dark .nav a.link { color: #c3c9d4; }
.topbar--dark .nav a.link:hover, .topbar--dark .nav a.link[aria-current] { color: #f6f4ee; }
.topbar--dark .btn-amber { background: var(--amber); color: #fff; }
.topbar--dark .btn-amber:hover { background: #92400e; }
.topbar--dark .menu-toggle { border-color: rgba(255,255,255,.3); color: #f6f4ee; }
.topbar--dark .nav.open { background: var(--dark); border-bottom-color: var(--dark-2); }
@media (prefers-reduced-motion: reduce) { .topbar { transition: none; } }
.topbar .row {
  display: flex; align-items: center; gap: 20px;
  height: 68px;
}
.brand {
  display: flex; align-items: center;
  flex: 0 0 auto; margin-right: auto;
}
.brand img { height: 48px; width: auto; }
.nav { display: flex; align-items: center; gap: 24px; flex: 0 0 auto; }
.nav a.link {
  font-size: .88rem;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -.005em;
  transition: color .2s;
}
.nav a.link:hover, .nav a.link[aria-current] { color: var(--ink-deep); }
.menu-toggle {
  display: none; margin-left: auto;
  background: none; border: 1px solid var(--line);
  color: var(--ink-deep);
  width: 42px; height: 42px;
  align-items: center; justify-content: center;
  cursor: pointer; border-radius: 5px;
}
.menu-toggle svg { width: 18px; height: 18px; }
/* ---- Hero ---- */
section { position: relative; }
.hero {
  background: var(--canvas);
  padding: clamp(60px, 7.5vw, 120px) 0 clamp(52px, 6.5vw, 104px);
  overflow: hidden;
  position: relative;
  text-align: center;
}
#hero-canvas { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
#hero-canvas svg { width: 100%; height: 100%; }
#hero-canvas canvas { display: block; width: 100%; height: 100%; }

.hero-body { position: relative; z-index: 1; max-width: 1160px; margin: 0 auto; }
@media (min-width: 800px) {
  html[lang="en"] .hero-body .display .l1 { white-space: nowrap; } /* English only: keep line 1 intact at desktop; verbose languages wrap (i18n overflow fix) */
}
.hero-body .display { margin-bottom: .35em; }
.hero-sub {
  font-size: clamp(1.08rem, 1.6vw, 1.3rem);
  line-height: 1.6;
  color: var(--ink);
  max-width: 63ch;
  margin: 0 auto clamp(36px, 4.5vw, 54px);
}
.hero-ctas {
  display: flex; align-items: center;
  justify-content: center;
  gap: 14px; flex-wrap: wrap;
}
.hero-scroll {
  margin-top: clamp(36px, 4.5vw, 60px);
  display: flex; flex-direction: column;
  align-items: center; gap: 8px;
  color: var(--ink-faint);
}
.hero-scroll svg { opacity: .5; animation: bounce 2s ease-in-out infinite; }
@keyframes bounce { 0%,100% { transform: translateY(0); } 55% { transform: translateY(6px); } }
/* ---- Hero atmosphere: stone halo + drifting auras ---- */
.hero-atmos { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.halo {
  position: absolute; left: 50%; top: 42%;
  width: min(1380px, 115vw); height: min(760px, 92%);
  transform: translate(-50%, -50%);
  background: radial-gradient(closest-side, rgba(232,228,218,.85), rgba(244,242,236,.45) 55%, transparent 100%);
}
.aura {
  position: absolute; border-radius: 50%;
  filter: blur(70px);
  will-change: transform;
}
.aura-a {
  width: 560px; height: 560px; left: -140px; top: -160px;
  background: radial-gradient(circle, rgba(217,119,6,.16), transparent 70%);
  animation: drift-a 26s ease-in-out infinite alternate;
}
.aura-b {
  width: 640px; height: 640px; right: -180px; bottom: -220px;
  background: radial-gradient(circle, rgba(180,83,9,.13), transparent 70%);
  animation: drift-b 32s ease-in-out infinite alternate;
}
.aura-c {
  width: 420px; height: 420px; left: 58%; top: -120px;
  background: radial-gradient(circle, rgba(139,148,163,.13), transparent 70%);
  animation: drift-c 38s ease-in-out infinite alternate;
}
@keyframes drift-a { from { transform: translate(0,0) scale(1); } to { transform: translate(170px, 100px) scale(1.15); } }
@keyframes drift-b { from { transform: translate(0,0) scale(1.1); } to { transform: translate(-150px, -90px) scale(.95); } }
@keyframes drift-c { from { transform: translate(0,0); } to { transform: translate(-130px, 80px) scale(1.2); } }
@media (prefers-reduced-motion: reduce) { .aura { animation: none; } }
/* Reusable section atmosphere: hero grid + drifting auras (June 26 legibility handling:
   grid vignette-masked, auras blurred hard and kept off-axis from the centered headings) */
.section-atmos { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.section-atmos::before {
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(to right, rgba(74,85,104,.055) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(74,85,104,.055) 1px, transparent 1px);
  background-size: 60px 60px;
  /* grid strongest at the edges, fading to clear behind the centred content */
  -webkit-mask-image: radial-gradient(ellipse 62% 62% at 50% 50%, transparent, rgba(0,0,0,.25) 38%, black 74%);
  mask-image: radial-gradient(ellipse 62% 62% at 50% 50%, transparent, rgba(0,0,0,.25) 38%, black 74%);
}
.section-atmos .aura { filter: blur(72px); }
.section-atmos .aura-a { left: 6%; top: 36%; }
.section-atmos .aura-c { left: auto; right: 6%; top: 32%; }
.section-atmos .aura-b { right: 12%; bottom: 8%; }
.model-selector .wrap, .comparison .wrap { position: relative; z-index: 1; }
/* ---- Trust bar ---- */
.trust-band {
  background: var(--dark);
  padding: clamp(44px, 6vw, 72px) 0;
  border-top: 1px solid var(--dark-2);
  border-bottom: 1px solid var(--dark-2);
}
.trust-inner {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.8vw, 32px); /* tight enough that all four stats hold one line at >=1024px */
  flex-wrap: wrap;
  justify-content: center;
}
.trust-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  flex: 0 1 185px;
}
.trust-item .t-num {
  font-family: var(--f-mono);
  font-size: clamp(1.5rem, 2.6vw, 2.2rem);
  font-weight: 700;
  letter-spacing: -.04em;
  color: #f6f4ee;
  line-height: 1;
}
.trust-item .t-label {
  font-size: .82rem;
  color: #c3c9d4;
  line-height: 1.45;
  max-width: 22ch;
}
.trust-divider { width: 1px; height: 48px; background: rgba(255,255,255,.16); flex-shrink: 0; }
/* ---- Section label ---- */
.viz-label { text-align: center; margin-bottom: clamp(32px, 4vw, 52px); }
/* ---- Three-model selector ---- */
.model-selector { background: var(--canvas); padding: clamp(72px,10vw,130px) 0; }
.model-tabs {
  display: flex; gap: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: clamp(28px,4vw,48px);
  background: var(--canvas);
}
.model-tab {
  flex: 1;
  padding: 14px 20px;
  font-family: var(--f-mono);
  font-size: .78rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--ink-faint);
  background: none;
  border: none;
  border-right: 1px solid var(--line);
  cursor: pointer;
  transition: background .2s, color .2s;
  text-align: center;
  line-height: 1.35;
}
.model-tab:last-child { border-right: none; }
.model-tab:hover { background: var(--stone-soft); color: var(--ink); }
.model-tab.active { background: var(--dark); color: #f6f4ee; box-shadow: inset 0 -3px 0 var(--amber); }
.model-tab.active .tab-sub { color: #c3c9d4; }
.model-tab .tab-sub {
  font-family: var(--f-body);
  font-weight: 400; text-transform: none; letter-spacing: 0;
  font-size: .95em; color: var(--ink);
}
.model-panel { display: none; }
.model-panel.active { display: block; }
.model-stage {
  background: var(--dark);
  border: 1px solid var(--dark-2);
  border-radius: 8px;
  padding: clamp(20px,3vw,40px);
  overflow: hidden;
}
.model-stage svg { display: block; width: 100%; height: auto; }
.model-caption {
  margin-top: 28px;
  font-size: .98rem;
  color: var(--ink);
  text-align: center;
  line-height: 1.6;
  max-width: 78ch;
  margin-left: auto;
  margin-right: auto;
}
.model-caption strong {
  display: block;
  font-family: var(--f-display);
  font-weight: 500;
  font-size: clamp(1.4rem, 2.2vw, 1.8rem);
  line-height: 1.15;
  color: var(--amber);
  margin-bottom: .35em;
}
/* Network animation */
.net-edge { stroke-dasharray: 6 8; animation: flow-edge 2.6s linear infinite; }
.net-edge.e2 { animation-duration: 3.4s; }
.net-edge.e3 { animation-duration: 3s; }
@keyframes flow-edge { to { stroke-dashoffset: -56; } }
.net-pulse { animation: node-pulse 2.8s ease-in-out infinite; }
@keyframes node-pulse { 0%,100% { opacity: .4; r: 4; } 50% { opacity: 1; r: 7; } }
/* ---- ID flexibility band ---- */
.id-band {
  background: var(--stone);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: clamp(72px,10vw,130px) 0;
}
.id-grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(40px,6vw,100px);
  align-items: center;
}
.id-tokens { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.id-token {
  font-family: var(--f-mono);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 8px 16px;
  border-radius: 100px;
  border: 1px solid var(--line);
  color: var(--ink);
  background: var(--canvas);
  transition: border-color .2s, color .2s;
}
.id-token.hi {
  border-color: rgba(180,83,9,.35);
  color: var(--ember-deep);
  background: var(--ember-lo);
}
.id-token.amber-hi {
  border-color: rgba(180,83,9,.35);
  color: var(--amber);
  background: var(--amber-lo);
}
.id-table {
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.id-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 2fr;
  border-bottom: 1px solid var(--line-soft);
  transition: background .2s;
}
.id-row:last-child { border-bottom: none; }
.id-row:hover { background: var(--stone-soft); }
.id-row.head { background: var(--stone-soft); }
.id-cell {
  padding: 14px 20px;
  font-size: .85rem;
  line-height: 1.45;
  color: var(--ink);
  border-right: 1px solid var(--line-soft);
}
.id-cell:last-child { border-right: none; }
.id-row.head .id-cell {
  font-family: var(--f-mono);
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--ink-faint);
}
.id-cell .tag {
  display: inline-block;
  font-family: var(--f-mono);
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: 3px 9px;
  border-radius: 4px;
  background: var(--ember-lo);
  color: var(--ember-deep);
  border: 1px solid rgba(180,83,9,.25);
}
.id-cell .tag-amber {
  background: var(--amber-lo);
  color: var(--amber);
  border-color: rgba(180,83,9,.25);
}
/* ---- Use cases ---- */
.use-cases { background: var(--dark); padding: clamp(72px,10vw,130px) 0; }
.use-cases .h2 { color: #f6f4ee; }
.use-cases .h2 .accent { color: var(--amber); }
.use-cases .lead { color: #c3c9d4; }
.use-cases .eyebrow { color: #a9b1bf; }
.use-case-cards {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 20px;
  margin-top: clamp(36px,5vw,56px);
}
.uc-card {
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 32px 26px;
  display: flex;
  flex-direction: column;
  transition: border-color .25s, transform .25s var(--ease);
}
.uc-card:hover { border-color: var(--ink-faint); transform: translateY(-4px); }
.uc-card.featured {
  border-color: var(--amber);
  background: linear-gradient(160deg, var(--canvas) 55%, #fdf7f0); /* opaque amber tint: card sits on the dark band */
}
.uc-card.featured:hover { border-color: var(--amber); transform: translateY(-4px); }
.uc-num {
  font-family: var(--f-mono);
  font-size: .8rem;
  font-weight: 500;
  color: var(--ink-faint);
  margin-bottom: 22px;
}
.uc-card.featured .uc-num { color: var(--amber); }
.uc-label {
  font-family: var(--f-mono);
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--ember-deep);
  margin-bottom: 10px;
}
.uc-card.featured .uc-label { color: var(--amber); }
.uc-card h3 .hi2 { color: var(--amber); }
.uc-card h3 {
  font-size: 1.12rem;
  font-weight: 600;
  letter-spacing: -.015em;
  color: var(--ink-deep);
  margin-bottom: .5em;
}
.uc-card p { font-size: .88rem; color: var(--ink); line-height: 1.65; margin: 0 0 .8em; flex: 1; }
.uc-link {
  font-size: .85rem; font-weight: 600;
  color: var(--amber);
  margin-top: auto;
  display: inline-flex; align-items: center; gap: .4em;
}
.uc-link:hover { color: #92400e; }
.uc-link:hover .arr { transform: translateX(3px); }
.uc-card .new-badge {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  font-family: var(--f-mono);
  font-size: .62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--amber);
  background: var(--amber-lo);
  border: 1px solid rgba(180,83,9,.25);
  padding: 4px 10px;
  border-radius: 100px;
  margin-top: 14px;
  align-self: flex-start;
}
.uc-card .new-badge .dot { background: var(--amber); width: 5px; height: 5px; border-radius: 50%; display: inline-block; }
/* ---- Manifesto ---- */
.manifesto {
  background: var(--stone-soft);
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  padding: clamp(64px,9vw,120px) 0;
}
.manifesto-inner { max-width: 780px; margin: 0 auto; text-align: center; }
.manifesto .h2 { margin-bottom: .6em; }
.manifesto p {
  font-size: clamp(1rem,1.4vw,1.2rem);
  color: var(--ink);
  line-height: 1.72;
  margin-bottom: 1.2em;
}
.manifesto p:last-child { margin-bottom: 0; }
.manifesto p strong { color: var(--ink-deep); font-weight: 600; }
/* ---- Comparison ---- */
.comparison { background: var(--canvas); padding: clamp(72px,10vw,130px) 0; }
.comparison-table { margin-top: clamp(36px,5vw,60px); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.comp-head { display: grid; grid-template-columns: 1fr 1.1fr 1.3fr; background: var(--stone-soft); border-bottom: 1px solid var(--line); }
.comp-head-cell { padding: 22px 26px; font-family: var(--f-mono); font-size: 1.12rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.comp-head-cell:first-child { color: var(--ink-faint); border-right: 1px solid var(--line-soft); }
.comp-head-cell:nth-child(2) { color: var(--ink); border-right: 1px solid var(--line-soft); background: rgba(74,85,104,.06); }
.comp-head-cell:last-child { color: var(--ember-deep); background: var(--ember-lo); }
.comp-row { display: grid; grid-template-columns: 1fr 1.1fr 1.3fr; border-bottom: 1px solid var(--line-soft); transition: background .2s; }
.comp-row:last-child { border-bottom: none; }
.comp-row:hover { background: var(--stone-soft); }
.comp-cell { padding: 20px 26px; font-size: 1.08rem; line-height: 1.5; display: flex; align-items: flex-start; gap: .6em; }
.comp-cell:first-child { color: var(--ink-deep); font-weight: 600; font-family: var(--f-mono); font-size: .95rem; text-transform: uppercase; letter-spacing: .06em; border-right: 1px solid var(--line-soft); align-items: center; }
.comp-cell:nth-child(2) { color: var(--ink); border-right: 1px solid var(--line-soft); background: rgba(74,85,104,.05); }
.comp-cell:last-child { color: var(--ink-deep); background: var(--ember-lo); font-weight: 500; }
.comp-cell .chk { color: var(--ember); font-weight: 700; }
/* ---- Quote ---- */
.quote-band {
  background: var(--stone);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: clamp(64px,9vw,120px) 0;
}
.quote-inner { max-width: 860px; margin: 0 auto; text-align: center; }
.blockquote {
  font-family: var(--f-display-i);
  font-style: italic;
  font-size: clamp(1.5rem, 2.6vw, 2.4rem);
  letter-spacing: -.01em;
  line-height: 1.32;
  color: var(--ink-deep);
  margin: 0;
}
.quote-attr {
  margin: 22px 0 0;
  font-family: var(--f-mono);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--amber);
}
/* ---- Final CTA (dark inversion band) ---- */
.final-cta {
  background: var(--dark);
  padding: clamp(80px, 12vw, 150px) 0;
  text-align: center;
  overflow: hidden;
  position: relative;
}
.final-cta .inner { position: relative; z-index: 1; max-width: 720px; margin: 0 auto; }
.final-cta .display { color: #f6f4ee; margin-bottom: .4em; }
.final-cta .accent { color: var(--amber); }
.final-cta .lead { color: #c3c9d4; margin: 0 auto clamp(32px, 4vw, 52px); max-width: 46ch; }
.final-cta .btn-amber { background: var(--amber); color: #fff; }
.final-cta .btn-amber:hover { background: #92400e; }
/* ---- Footer ---- */
footer {
  background: var(--canvas);
  border-top: 1px solid var(--line-soft);
  padding: clamp(44px, 5.5vw, 64px) 0 28px;
}
.foot-top {
  display: flex; flex-wrap: wrap; gap: 24px 40px;
  align-items: center; justify-content: space-between;
  margin-bottom: 28px;
}
.foot-brand img { height: 56px; width: auto; }
.foot-links { display: flex; flex-wrap: wrap; gap: 6px 4px; align-items: center; }
.foot-links a {
  font-size: .86rem;
  color: var(--ink);
  font-weight: 500;
  padding: 4px 10px;
  border-radius: 4px;
  transition: color .2s;
}
.foot-links a:hover { color: var(--ink-deep); }
.foot-rule { height: 1px; background: var(--line-soft); margin-bottom: 20px; }
.foot-bottom {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 8px;
}
.copy { font-size: .8rem; color: var(--ink-faint); margin: 0; }
.foot-tagline { font-size: .74rem; color: var(--ink-faint); font-family: var(--f-mono); letter-spacing: .04em; }
/* ---- Responsive ---- */
@media (max-width: 1024px) {
  .id-grid { grid-template-columns: 1fr; }
  .use-case-cards { grid-template-columns: 1fr 1fr; }
  .model-tabs { flex-direction: column; }
  .model-tab { border-right: none; border-bottom: 1px solid var(--line); }
  .model-tab:last-child { border-bottom: none; }
}
@media (max-width: 800px) {
  .nav { display: none; }
  .nav.open {
    display: flex; flex-direction: column; align-items: flex-start; gap: 16px;
    position: absolute; left: 0; right: 0; top: 68px;
    background: var(--canvas); border-bottom: 1px solid var(--line);
    padding: 22px var(--gut); z-index: 50;
  }
  .nav.open .btn-sm { width: 100%; justify-content: center; }
  .menu-toggle { display: inline-flex; }
  .trust-divider { display: none; }
  .foot-bottom { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
  .use-case-cards { grid-template-columns: 1fr; }
  .comp-head { display: none; }
  .comp-row { grid-template-columns: 1fr; }
  .comp-cell { border-right: none !important; border-bottom: 1px solid var(--line-soft); }
  .comp-cell:first-child { background: var(--stone-soft); }
  .hero-ctas { flex-direction: column; align-items: stretch; }
  .hero-ctas .btn { justify-content: center; }
}
/* ---- Vendors page ---- */
.feature-grid { background: var(--canvas); padding: clamp(72px,10vw,130px) 0; position: relative; }
.feature-grid .wrap { position: relative; z-index: 1; }
.uc-card.wide { grid-column: 1 / -1; }
.stat-band {
  background: var(--dark);
  border-top: 1px solid var(--dark-2);
  border-bottom: 1px solid var(--dark-2);
  padding: clamp(48px,6vw,80px) 0;
}
.stat-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.stat-cell {
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 34px 28px;
  text-align: center;
  transition: border-color .25s, transform .25s var(--ease);
}
/* stagger entrance owns the transition on these; hover uses non-transform cues so it stays snappy */
.stat-cell:hover { border-color: var(--ink-faint); background: #fbf7ef; }
.stat-cell .big {
  font-family: var(--f-mono);
  font-size: clamp(2.2rem,3.4vw,3rem);
  font-weight: 700;
  letter-spacing: -.04em;
  color: var(--ink-deep);
  line-height: 1;
  display: block;
  margin-bottom: .35em;
}
.stat-cell .big.amber { color: var(--amber); }
.stat-cell .desc { font-size: .9rem; color: var(--ink); line-height: 1.55; }
.roles-band { background: var(--dark); padding: clamp(72px,10vw,120px) 0; position: relative; }
.roles-band .wrap { position: relative; z-index: 1; }
.roles-band .h2 { color: #f6f4ee; }
.roles-band .h2 .accent { color: var(--amber); }
.roles-band .eyebrow { color: #a9b1bf; }
.role-tiles { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; margin-top: clamp(32px,4vw,52px); }
.role-tiles.role-tiles--3 { grid-template-columns: repeat(3,1fr); }
@media (max-width: 800px) { .role-tiles.role-tiles--3 { grid-template-columns: 1fr; } }
.role-tile {
  background: var(--stone-soft); border: 1px solid var(--line); border-radius: 8px; padding: 28px 26px;
  transition: border-color .25s, transform .25s var(--ease);
}
.role-tile:hover { border-color: var(--amber); box-shadow: 0 0 0 1px var(--amber); }
.role-tile strong { display: block; font-size: 1.06rem; font-weight: 600; color: var(--amber); margin-bottom: .45em; }
.role-tile p { font-size: .95rem; color: var(--ink); line-height: 1.6; margin: 0; }
.pricing-band {
  background: var(--stone-soft);
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  padding: clamp(72px,10vw,120px) 0;
}
.pricing-detail { background: var(--canvas); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; margin-top: clamp(32px,4vw,52px); }
.price-row { display: grid; grid-template-columns: 1fr 2.2fr; border-bottom: 1px solid var(--line-soft); }
.price-row:last-child { border-bottom: none; }
.price-key {
  padding: 20px 24px;
  font-family: var(--f-mono);
  font-size: .85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--ink-deep);
  border-right: 1px solid var(--line-soft);
  background: var(--stone-soft);
  display: flex;
  align-items: center;
}
.price-val { padding: 20px 24px; font-size: 1rem; color: var(--ink); display: flex; align-items: center; gap: .6em; }
.price-val .chk { color: var(--ember); font-weight: 700; }
.price-note { margin-top: 26px; font-size: .88rem; color: var(--ink-faint); text-align: center; }
.entry-band { background: var(--canvas); padding: clamp(72px,10vw,120px) 0; }
.entry-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(28px,6vw,72px); align-items: center; }
.entry-grid p { font-size: 1.05rem; color: var(--ink); line-height: 1.7; margin: 0; }
@media (max-width: 800px) {
  .stat-row { grid-template-columns: 1fr; }
  .role-tiles { grid-template-columns: 1fr; }
  .entry-grid { grid-template-columns: 1fr; }
  .price-row { grid-template-columns: 1fr; }
  .price-key { border-right: none; border-bottom: 1px solid var(--line-soft); }
}
.final-cta .inner { position: relative; z-index: 1; max-width: 960px; margin: 0 auto; }
/* room for 'across the order-to-cash lifecycle.' on one line */
.final-cta .display { color: #f6f4ee; margin-bottom: .4em; }
/* ---- Retailers page ---- */
/* before/after compare */
.compare-band { background: var(--dark); padding: clamp(72px,10vw,130px) 0; position: relative; }
.compare-band .wrap { position: relative; z-index: 1; }
.compare-band .h2 { color: #f6f4ee; }
.compare-band .h2 .accent { color: var(--amber); }
.compare-band .eyebrow { color: #a9b1bf; }
.two-col-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: clamp(36px,5vw,56px); }
.compare-panel {
  background: var(--stone-soft); /* opaque: sits on the dark band */
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 32px 28px;
}
.compare-panel.gpa-side { background: #fdf7f0; border-color: var(--amber); }
.compare-label {
  font-family: var(--f-mono);
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .15em;
  margin-bottom: 20px;
  color: var(--ink);
}
.compare-panel.gpa-side .compare-label { color: var(--ember-deep); }
.problem-list, .solution-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.problem-list li, .solution-list li { display: flex; gap: 14px; align-items: flex-start; font-size: .98rem; color: var(--ink); line-height: 1.6; }
.solution-list li::before { content: "✓"; color: var(--ember); font-weight: 700; flex-shrink: 0; margin-top: .1em; }
/* flow steps */
.flow-band {
  background: var(--stone-soft);
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  padding: clamp(72px,10vw,120px) 0;
}
.flow-steps {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 0;
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  margin-top: clamp(36px,5vw,56px);
}
.flow-step { padding: 34px 28px; border-right: 1px solid var(--line-soft); position: relative; }
.flow-step:last-child { border-right: none; }
.flow-step::after {
  content: '→';
  position: absolute;
  right: -13px; top: 50%;
  transform: translateY(-50%);
  font-size: 1.25rem;
  color: var(--amber);
  z-index: 2;
  font-weight: 700;
}
.flow-step:last-child::after { display: none; }
.flow-n {
  font-family: var(--f-mono);
  font-size: .74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .2em;
  color: var(--amber);
  margin-bottom: 14px;
}
.flow-step h3 { font-size: 1.1rem; font-weight: 600; color: var(--ink-deep); margin-bottom: .4em; }
.flow-step p { font-size: .92rem; color: var(--ink); line-height: 1.6; margin: 0; }
/* roles (dark motif, matches vendors) */
.roles-band .lead { color: #c3c9d4; }
@media (max-width: 900px) {
  .two-col-compare { grid-template-columns: 1fr; }
  .flow-steps { grid-template-columns: 1fr; }
  .flow-step { border-right: none; border-bottom: 1px solid var(--line-soft); }
  .flow-step:last-child { border-bottom: none; }
  .flow-step::after { display: none; }
}
/* ---- Trade Shows page ---- */
/* problem manifesto */
.problem-band {
  background: var(--stone-soft);
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  padding: clamp(64px,9vw,120px) 0;
}
.problem-inner { max-width: 780px; margin: 0 auto; text-align: center; }
.problem-inner p {
  font-size: clamp(1rem,1.4vw,1.2rem);
  color: var(--ink);
  line-height: 1.72;
  margin-bottom: 1.2em;
}
.problem-inner p:last-child { margin-bottom: 0; }
.problem-inner p strong { color: var(--ink-deep); font-weight: 600; }
/* personas (dark band, light cards) */
.who-band { background: var(--dark); padding: clamp(72px,10vw,130px) 0; }
.who-band .h2 { color: #f6f4ee; }
.who-band .h2 .accent { color: var(--amber); }
.who-band .eyebrow { color: #a9b1bf; }
.persona-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: clamp(36px,5vw,56px); }
.persona-card {
  background: var(--stone-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
}
/* jump-to-section anchors on the persona cards clear the sticky header */
#experience, #seller-experience, #promoters, #oem { scroll-margin-top: 80px; }
/* guaranteed gap above the More-for link when card content is full; margin-top:auto still bottom-pins it, so links across a row stay aligned */
.persona-card .uc-link { padding-top: 20px; }
.persona-card:hover { border-color: var(--amber); box-shadow: 0 0 0 1px var(--amber); }
.persona-label {
  font-family: var(--f-mono);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--amber);
  margin-bottom: 12px;
}
.persona-card h3 { font-size: 1.3rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink-deep); margin-bottom: .5em; }
.persona-card .persona-label a { transition: color .2s; }
.persona-card .persona-label a:hover { color: #92400e; }
.persona-card p { font-size: .95rem; color: var(--ink); line-height: 1.65; margin: 0 0 .9em; }
.persona-card ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.persona-card ul li { font-size: .9rem; color: var(--ink); line-height: 1.55; display: flex; align-items: flex-start; gap: 9px; }
.persona-card ul li::before { content: "→"; color: var(--amber); font-weight: 700; flex-shrink: 0; }
/* OEM embed */
.oem-band { background: var(--canvas); padding: clamp(72px,10vw,130px) 0; position: relative; }
.oem-band .wrap { position: relative; z-index: 1; }
.oem-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px,6vw,100px); align-items: center; }
.oem-features { display: flex; flex-direction: column; gap: 20px; margin-top: clamp(24px,3vw,40px); }
.oem-feat { display: flex; gap: 16px; align-items: flex-start; }
.oem-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); flex-shrink: 0; margin-top: 7px; }
.oem-feat strong { display: block; font-size: 1rem; font-weight: 600; color: var(--ink-deep); margin-bottom: .25em; }
.oem-feat p { font-size: .92rem; color: var(--ink); line-height: 1.6; margin: 0; }
.oem-card { background: var(--canvas); border: 1px solid var(--line); border-radius: 8px; padding: clamp(28px,3.5vw,44px); box-shadow: 0 24px 48px -36px rgba(37,45,59,.25); }
.oem-card-title {
  font-family: var(--f-mono);
  font-size: .74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--amber);
  margin-bottom: 14px;
}
.oem-card h3 { font-size: 1.25rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink-deep); margin-bottom: .6em; }
.oem-card p { font-size: .93rem; color: var(--ink); line-height: 1.65; margin: 0 0 24px; }
.integration-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.int-badge {
  font-family: var(--f-mono);
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 6px 12px;
  border-radius: 4px;
  border: 1px solid rgba(180,83,9,.3);
  color: var(--ember-deep);
  background: var(--ember-lo);
}
/* buyer walkthrough */
.walk-band {
  background: var(--stone-soft);
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  padding: clamp(72px,10vw,130px) 0;
}
.walk-steps {
  display: flex; flex-direction: column; gap: 0;
  margin-top: clamp(36px,5vw,56px);
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.walk-step { display: grid; grid-template-columns: 88px 1fr; border-bottom: 1px solid var(--line-soft); transition: background .2s; }
.walk-step:last-child { border-bottom: none; }
.walk-step:hover { background: var(--stone-soft); }
.walk-num {
  display: flex; align-items: center; justify-content: center;
  background: var(--stone-soft);
  border-right: 1px solid var(--line-soft);
  font-family: var(--f-mono);
  font-size: 1.6rem; font-weight: 700;
  color: var(--amber);
  letter-spacing: -.04em;
}
.walk-body { padding: 28px 32px; }
.walk-body strong { display: block; font-size: 1.08rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink-deep); margin-bottom: .35em; }
.walk-body p { font-size: .95rem; color: var(--ink); line-height: 1.65; margin: 0; }
/* QR feature */
.qr-feature {
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: clamp(28px,4vw,52px);
  margin-top: clamp(40px,5vw,64px);
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(28px,4vw,56px);
  align-items: center;
}
.qr-visual {
  background: var(--dark);
  border-radius: 8px;
  padding: 32px;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  text-align: center;
}
.qr-mock {
  width: 120px; height: 120px;
  background: var(--dark-2);
  border: 2px solid var(--amber);
  border-radius: 8px;
  display: grid;
  grid-template-columns: repeat(8,1fr);
  grid-template-rows: repeat(8,1fr);
  gap: 2px;
  padding: 8px;
}
.qr-cell { border-radius: 1px; background: transparent; }
.qr-cell.on { background: var(--amber); }
.qr-caption { font-family: var(--f-mono); font-size: .78rem; font-weight: 600; color: #f6f4ee; letter-spacing: .1em; text-transform: uppercase; }
.qr-sub { font-family: var(--f-mono); font-size: .75rem; color: #a9b1bf; }
.qr-body h3 { font-size: 1.3rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink-deep); margin-bottom: .5em; }
.qr-body p { font-size: .95rem; color: var(--ink); line-height: 1.65; margin: 0 0 .9em; }
.qr-body p:last-child { margin-bottom: 0; }
.qr-body .qr-strong { color: var(--ink-deep); font-weight: 500; }
@media (max-width: 900px) {
  .persona-cards { grid-template-columns: 1fr; }
  .qr-feature { grid-template-columns: 1fr; }
  .oem-grid { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 640px) {
  .walk-step { grid-template-columns: 56px 1fr; }
  .walk-num { font-size: 1.25rem; }
}
/* ---- Talk page ---- */
/* hero + form share one continuous atmosphere via .talk-top */
.talk-top { position: relative; background: var(--canvas); overflow: hidden; }
.talk-top .section-atmos::after {
  /* soften the grid behind the right-hand text column */
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 42% 50% at 74% 62%, rgba(255,255,255,.88), transparent 72%);
}
.talk-hero {
  background: transparent;
  padding: clamp(72px,10vw,120px) 0 clamp(20px,3vw,40px);
  position: relative;
}
.talk-hero .inner { position: relative; z-index: 1; max-width: 760px; }
.talk-hero .display { margin-bottom: .4em; }
.talk-lede {
  font-size: clamp(1.05rem,1.5vw,1.25rem);
  line-height: 1.62;
  color: var(--ink);
  max-width: 62ch;
}
.talk-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px,5vw,80px);
  padding: clamp(40px,6vw,80px) 0 clamp(72px,10vw,130px);
  align-items: start;
  position: relative;
  z-index: 1;
}
/* form card */
.form-card {
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: clamp(28px,3.5vw,44px);
  box-shadow: 0 24px 48px -36px rgba(37,45,59,.25);
}
.form-card > h2 { font-size: 1.5rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink-deep); margin-bottom: 22px; }
.field { margin-bottom: 18px; }
.field label {
  display: block;
  font-size: .88rem;
  font-weight: 600;
  color: var(--ink-deep);
  margin-bottom: 7px;
}
.field .req { color: var(--amber); }
.field input, .field textarea {
  width: 100%;
  font: inherit;
  font-size: .95rem;
  color: var(--ink-deep);
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 12px 14px;
  transition: border-color .2s, box-shadow .2s;
}
.field input::placeholder, .field textarea::placeholder { color: var(--ink-faint); }
.field input:focus, .field textarea:focus {
  outline: none;
  border-color: var(--amber);
  box-shadow: 0 0 0 3px var(--amber-lo);
}
.field textarea { min-height: 130px; resize: vertical; }
.btn-submit {
  display: inline-flex; align-items: center; gap: .5em;
  font: inherit; font-size: .95rem; font-weight: 600;
  background: var(--amber); color: #fff;
  border: none; border-radius: 6px;
  padding: 13px 24px;
  cursor: pointer;
  transition: background .2s, transform .2s var(--ease);
}
.btn-submit:hover { background: var(--amber); transform: translateY(-2px); }
/* path selector */
.path-label {
  font-family: var(--f-mono);
  font-size: .74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--ink-faint);
  margin-bottom: 10px;
}
.path-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.path-badge {
  font-family: var(--f-mono);
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 6px 13px;
  border-radius: 4px;
  border: 1px solid var(--line);
  color: var(--ink);
  background: var(--stone-soft);
  cursor: pointer;
  transition: border-color .2s, color .2s, background .2s;
}
.path-badge:hover { border-color: var(--ink-faint); }
.path-badge.sel, .path-badge.sel-amber {
  border-color: var(--amber);
  color: var(--ember-deep);
  background: var(--ember-lo);
}
/* success state */
.form-success { display: none; text-align: center; padding: 52px 32px; }
.form-success .icon {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--ember-lo);
  border: 1px solid var(--amber);
  color: var(--ember);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 24px;
  font-size: 1.6rem;
  font-weight: 700;
}
.form-success h3 { font-size: 1.4rem; font-weight: 600; color: var(--ink-deep); margin-bottom: .5em; }
.form-success p { font-size: .95rem; color: var(--ink); line-height: 1.65; }
.form-success a { color: var(--amber); font-weight: 600; }
/* how this goes */
.how-section { padding-top: 8px; }
.how-section > h2 { font-size: 1.5rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink-deep); margin-bottom: 24px; }
.steps-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.step-item { display: flex; gap: 16px; align-items: flex-start; }
.step-num {
  width: 34px; height: 34px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-mono); font-size: .95rem; font-weight: 700;
  color: var(--amber);
  background: var(--stone-soft);
  border: 1px solid var(--line);
  border-radius: 50%;
}
.step-item p { font-size: .98rem; color: var(--ink); line-height: 1.62; margin: 0; padding-top: 5px; }
.how-extra p { font-size: .95rem; color: var(--ink); line-height: 1.65; margin: 0; }
.how-extra strong { color: var(--ink-deep); }
.how-extra a { color: var(--amber); font-weight: 600; }
.how-extra a:hover { color: var(--ember-deep); }
/* signals band (dark motif, light cards) */
.signals-band { background: var(--dark); border-top: 1px solid var(--dark-2); padding: clamp(56px,7vw,96px) 0; }
.signals-band .h2 { color: #f6f4ee; }
.signals-band .h2 .accent { color: var(--amber); }
.signals-band .eyebrow { color: #a9b1bf; }
.signals-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: clamp(28px,4vw,44px); }
.signal-card {
  background: var(--stone-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px 24px;
}
.signal-card:hover { border-color: var(--amber); box-shadow: 0 0 0 1px var(--amber); }
.signal-label {
  font-family: var(--f-mono);
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--amber);
  margin-bottom: 10px;
}
.signal-card h3 { font-size: 1.02rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink-deep); margin-bottom: .4em; }
.signal-card p { font-size: .9rem; color: var(--ink); line-height: 1.6; margin: 0; }
@media (max-width: 800px) {
  .talk-layout { grid-template-columns: 1fr; }
  .signals-grid { grid-template-columns: 1fr; }
  .role-tiles { grid-template-columns: 1fr; }
  .entry-grid { grid-template-columns: 1fr; }
}
/* ---- Split hero (tradeshows): headline left, live QR right ---- */
.hero--split { text-align: left; padding-bottom: clamp(28px, 3.5vw, 52px); }
.hero--split .hero-split {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: clamp(36px, 5vw, 80px);
  align-items: center;
}
.hero--split .hero-body { max-width: none; margin: 0; }
.hero--split .hero-sub { margin-left: 0; max-width: 54ch; margin-bottom: clamp(28px, 3.5vw, 44px); }
.hero--split .hero-ctas { justify-content: flex-start; }
.hero--split .qr-visual {
  justify-self: center;
  width: 100%;
  max-width: 420px;
  box-shadow: 0 32px 64px -40px rgba(37,45,59,.45);
}
@media (max-width: 900px) {
  .hero--split .hero-split { grid-template-columns: 1fr; gap: 40px; text-align: center; }
  .hero--split .eyebrow { justify-content: center; }
  .hero--split .hero-sub { margin-left: auto; margin-right: auto; }
  .hero--split .hero-ctas { justify-content: center; }
  .hero--split .qr-visual { max-width: 380px; margin: 0 auto; }
}
/* copy-only follow-on band after the split hero (transparent so the hero network shows through) */
.qr-feature--copy { grid-template-columns: 1fr; max-width: 900px; margin-left: auto; margin-right: auto; background: transparent; }