/* ── Hero ── */
.hero{background:linear-gradient(150deg,var(--charcoal) 0%,var(--slate) 55%,#1b3540 100%);
  color:#fff;padding:96px 32px 72px;text-align:center;position:relative}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 55% at 50% 110%,rgba(82,121,111,0.28),transparent)}
.hero::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;pointer-events:none;
  background:linear-gradient(90deg,#CAD2C5,#84A98C,#52796F,#354F52)}
.eyebrow-pill{display:inline-flex;align-items:center;gap:8px;position:relative;z-index:2;
  background:rgba(132,169,140,0.15);border:1px solid rgba(132,169,140,0.3);
  padding:5px 14px 5px 10px;border-radius:20px;font-size:12px;font-weight:600;
  letter-spacing:0.5px;color:var(--ash);margin-bottom:24px}
.live-dot{width:7px;height:7px;border-radius:50%;background:#4caf50;
  box-shadow:0 0 6px #4caf5066;animation:pulse 2s infinite}
.hero h1{font-size:58px;font-weight:800;line-height:1.3;max-width:820px;margin:0 auto 20px;
  background:linear-gradient(135deg,#fff 30%,rgba(202,210,197,0.8));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-1px;
  position:relative;z-index:2}
.hero-sub{font-size:19px;color:rgba(255,255,255,0.62);max-width:760px;
  margin:0 auto 36px;line-height:1.65;position:relative;z-index:2}
.hero-sub-current + .hero-sub{display:none}
.replacement-copy + .ss{display:none}
.cf-success-current + h3{display:none}
.hero-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  position:relative;z-index:2}
.btn-hp{padding:14px 30px;border-radius:8px;font-size:15px;font-weight:700;
  background:var(--deep);color:#fff;text-decoration:none;
  box-shadow:0 4px 24px rgba(82,121,111,0.4);transition:all 0.2s}
.btn-hp:hover{background:var(--teal);transform:translateY(-2px)}
.btn-hs{padding:14px 30px;border-radius:8px;font-size:15px;font-weight:700;
  background:transparent;color:#fff;text-decoration:none;
  border:2px solid rgba(255,255,255,0.22);transition:all 0.2s}
.btn-hs:hover{border-color:#fff;background:rgba(255,255,255,0.06)}

/* ── Stats row ── */
.stats-row{background:var(--charcoal);border-bottom:1px solid rgba(255,255,255,0.06);
  display:flex;justify-content:center;flex-wrap:wrap}
.sr-item{padding:20px 48px;border-right:1px solid rgba(255,255,255,0.07);text-align:center;
  min-width:160px}
.sr-item:last-child{border-right:none}
.sr-num{font-size:28px;font-weight:800;color:#fff;letter-spacing:-0.5px}
.sr-lbl{font-size:10px;color:rgba(255,255,255,0.38);margin-top:3px;text-transform:uppercase;letter-spacing:0.8px}
.sr-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#4caf50;
  vertical-align:middle;margin-right:5px;box-shadow:0 0 5px #4caf5066}

/* ── Numbers bar ── */
.numbers-bar{background:var(--deep);padding:12px 32px;
  display:flex;justify-content:center;align-items:center;gap:0;flex-wrap:wrap}
.nb-item{padding:6px 28px;border-right:1px solid rgba(255,255,255,0.15);
  text-align:center;font-size:12px;font-weight:600;color:rgba(255,255,255,0.85)}
.nb-item:last-child{border-right:none}
.nb-item span{font-weight:800;color:#fff}

/* ── Trust bar ── */
.trust-bar{padding:14px 32px;background:var(--surface);border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap}
.trust-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--slate);opacity:0.38}
.trust-item{font-size:12px;font-weight:600;color:var(--slate);opacity:0.55;display:flex;align-items:center;gap:5px}

/* ── Section helpers ── */
.section{padding:72px 0}
.section-alt{background:rgba(202,210,197,0.055)}
.eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--deep);margin-bottom:10px}
.sh{font-family:var(--font-heading);font-size:36px;font-weight:800;color:var(--slate);line-height:1.2;margin-bottom:14px;letter-spacing:-0.5px}
.ss{font-size:15px;color:var(--deep);line-height:1.7}
.center{text-align:center}.center .ss{margin:0 auto}

.home-page{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);position:relative;overflow-x:clip;overflow-y:hidden}
.home-page::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg, transparent 0%, rgba(53,79,82,0.08) 11%, transparent 11.25%, transparent 22%, rgba(53,79,82,0.06) 22.2%, transparent 22.45%, transparent 35%, rgba(53,79,82,0.06) 35.18%, transparent 35.42%, transparent 51%, rgba(53,79,82,0.06) 51.16%, transparent 51.38%, transparent 68%, rgba(53,79,82,0.06) 68.18%, transparent 68.42%, transparent 84%, rgba(53,79,82,0.06) 84.18%, transparent 84.42%, transparent 100%),
    linear-gradient(180deg, rgba(255,255,255,0.06), transparent 18%);
  opacity:0.42}
.home-page::after{content:"";position:absolute;left:2.5%;right:2.5%;top:18px;bottom:18px;pointer-events:none;
  border:1px solid rgba(132,169,140,0.12);border-radius:28px;opacity:0.32}
.home-page .section,
.home-page .section-alt{position:relative;margin:0;padding:84px 42px 92px;overflow:hidden;
  content-visibility:auto;contain:layout paint style;contain-intrinsic-size:auto 960px}
.home-page .section{background:transparent}
.home-page .section-alt{background:
  linear-gradient(180deg, rgba(255,255,255,0.02), rgba(202,210,197,0.08)),
  linear-gradient(90deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01) 62%, rgba(132,169,140,0.04))}
.home-page .section::before,
.home-page .section-alt::before{content:"";position:absolute;inset:14px 20px;pointer-events:none;border-radius:26px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.05), transparent 34%),
    repeating-linear-gradient(90deg, transparent 0 136px, rgba(84,127,111,0.05) 136px 138px),
    repeating-linear-gradient(180deg, transparent 0 118px, rgba(84,127,111,0.035) 118px 120px);
  border:1px solid rgba(255,255,255,0.04)}
.home-page .section::after,
.home-page .section-alt::after{content:"";position:absolute;inset:auto 10% 16px auto;width:320px;height:180px;pointer-events:none;
  background:radial-gradient(circle at center, rgba(132,169,140,0.09), transparent 72%);opacity:0.26}
.home-page .section > *,
.home-page .section-alt > *{position:relative;z-index:2}
.home-page .section .center{text-align:left}
.home-page .section .center .ss,
.home-page .section-alt .center .ss{margin:0}
.home-ribbon{position:relative;padding:20px 42px 6px}
.home-ribbon::before{content:"";position:absolute;left:42px;right:42px;top:48px;height:1px;
  background:linear-gradient(90deg, rgba(132,169,140,0.02), rgba(132,169,140,0.34), rgba(132,169,140,0.02))}
.home-ribbon-track{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.ribbon-node{position:relative;padding:18px 18px 16px;border-radius:18px;overflow:hidden;
  background:rgba(24,37,43,0.8);border:1px solid rgba(255,255,255,0.08);box-shadow:0 10px 24px rgba(47,62,70,0.1)}
.ribbon-node::after{content:"";position:absolute;top:50%;right:-9px;width:18px;height:18px;border-radius:50%;
  background:rgba(132,169,140,0.18);box-shadow:0 0 0 6px rgba(132,169,140,0.06)}
.ribbon-node:last-child::after{display:none}
.ribbon-node small{display:block;font-size:10px;font-weight:800;letter-spacing:0.9px;text-transform:uppercase;color:rgba(202,210,197,0.46);margin-bottom:10px}
.ribbon-node strong{display:block;font-size:16px;font-weight:800;color:#fff;line-height:1.25}
.ribbon-node span{display:block;margin-top:6px;font-size:12px;line-height:1.55;color:rgba(202,210,197,0.68)}
.ribbon-node b{display:inline-flex;align-items:center;gap:8px;margin-top:12px;padding:6px 10px;border-radius:999px;
  background:rgba(132,169,140,0.12);font-size:10px;font-weight:800;letter-spacing:0.7px;text-transform:uppercase;color:#dce6dd}
.band-head{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(240px,0.5fr);gap:28px;align-items:end}
.band-head-single{grid-template-columns:minmax(0,1fr)}
.band-head-single>div:last-child{display:none}
.band-head-single>.band-stamp{display:none}
.band-stamp{padding:18px 18px 16px;border-radius:18px;background:rgba(255,255,255,0.8);
  border:1px solid rgba(132,169,140,0.18);box-shadow:var(--shadow)}
.band-stamp-dark{background:rgba(24,37,43,0.78);border-color:rgba(255,255,255,0.08)}
.band-stamp-label{font-size:10px;font-weight:800;letter-spacing:0.9px;text-transform:uppercase;color:rgba(53,79,82,0.54);margin-bottom:12px}
.band-stamp-dark .band-stamp-label{color:rgba(202,210,197,0.45)}
.signal-stack{display:grid;gap:10px}
.signal-stack div{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:12px;background:rgba(82,121,111,0.08)}
.band-stamp-dark .signal-stack div{background:rgba(255,255,255,0.06)}
.signal-stack span{font-size:10px;font-weight:800;letter-spacing:0.8px;text-transform:uppercase;color:rgba(53,79,82,0.52)}
.band-stamp-dark .signal-stack span{color:rgba(202,210,197,0.5)}
.signal-stack strong{font-size:12px;font-weight:700;color:var(--slate)}
.band-stamp-dark .signal-stack strong{color:#fff}
.signal-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.signal-chip{padding:16px 16px 14px;border-radius:18px;background:rgba(255,255,255,0.72);
  border:1px solid rgba(132,169,140,0.14);box-shadow:var(--shadow)}
.signal-chip strong{display:block;font-size:13px;font-weight:800;color:var(--slate);margin-bottom:5px}
.signal-chip span{display:block;font-size:12px;line-height:1.55;color:rgba(53,79,82,0.74)}
.signal-chip em{display:block;margin-top:10px;font-style:normal;font-size:10px;font-weight:800;letter-spacing:0.8px;text-transform:uppercase;color:rgba(53,79,82,0.5)}
.security-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.faq-head{text-align:center;margin:0 0 28px}
.faq-head .sh{margin:0}
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.faq-column{display:grid;gap:14px;align-content:start}
.faq-item{background:rgba(255,255,255,0.72);border:1px solid rgba(132,169,140,0.16);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:block;width:100%}
.note-panel{padding:20px 22px;border-radius:18px;background:rgba(255,255,255,0.78);border:1px solid rgba(132,169,140,0.16);box-shadow:var(--shadow)}
.note-panel h4{font-size:12px;font-weight:800;letter-spacing:0.9px;text-transform:uppercase;color:rgba(53,79,82,0.56);margin-bottom:12px}
.note-panel ul{list-style:none;display:grid;gap:10px;padding:0;margin:0}
.note-panel li{padding:10px 12px;border-radius:12px;background:rgba(82,121,111,0.08);font-size:12px;line-height:1.55;color:var(--slate)}
.oss-shell{display:grid;grid-template-columns:minmax(0,1.16fr) 300px;gap:28px;align-items:stretch}
.contact-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.contact-rail{display:grid;gap:14px}
.contact-rail-card{padding:16px 18px;border-radius:16px;background:rgba(24,37,43,0.8);border:1px solid rgba(255,255,255,0.08)}
.contact-rail-card strong{display:block;font-size:11px;font-weight:800;letter-spacing:0.9px;text-transform:uppercase;color:rgba(202,210,197,0.46);margin-bottom:8px}
.contact-rail-card span{display:block;font-size:15px;font-weight:800;color:#fff}
.contact-rail-card small{display:block;margin-top:6px;font-size:12px;line-height:1.5;color:rgba(202,210,197,0.62)}
.split-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start}
.side-stack{display:grid;gap:16px}
.side-stack .note-panel{height:100%}
.split-shell-integration{align-items:stretch}
.integration-stack{display:grid;grid-template-rows:auto 1fr;gap:24px}
.integration-intro{display:grid;gap:10px;align-content:start}
.integration-intro .ss{margin:0}
.side-stack-integration{display:grid;gap:16px;align-content:start}
.quickstart-shell{display:grid;gap:16px}
.developer-proof{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,0.92fr);gap:30px;align-items:start}
.developer-proof-copy{display:grid;gap:18px}
.developer-proof-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.proof-point{padding:16px 16px 14px;border-radius:18px;background:rgba(255,255,255,0.78);
  border:1px solid rgba(132,169,140,0.16);box-shadow:var(--shadow)}
.proof-point strong{display:block;font-size:11px;font-weight:800;letter-spacing:0.8px;text-transform:uppercase;color:var(--deep);margin-bottom:7px}
.proof-point span{display:block;font-size:13px;line-height:1.6;color:var(--slate)}
.proof-actions{display:flex;gap:12px;flex-wrap:wrap}
.proof-shell{background:rgba(24,37,43,0.92);border-radius:18px;overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);box-shadow:0 20px 48px rgba(47,62,70,0.16)}
.proof-bar{display:flex;justify-content:space-between;gap:16px;align-items:center;
  padding:12px 16px;background:rgba(0,0,0,0.24);border-bottom:1px solid rgba(255,255,255,0.08)}
.proof-label{font-size:11px;font-weight:800;letter-spacing:0.8px;text-transform:uppercase;color:rgba(202,210,197,0.78)}
.proof-meta{font-size:11px;color:rgba(202,210,197,0.42)}
.proof-code{padding:18px 20px 20px;font-family:var(--font-mono);font-size:12px;line-height:1.9;color:#e2e8f0}
.proof-code div + div{margin-top:6px}
.proof-step{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-right:10px;
  border-radius:999px;background:rgba(132,169,140,0.2);font-size:10px;font-weight:800;color:#dce6dd}
.proof-path{color:#b7d0bd;font-weight:700}
.proof-body{color:#f1d28a}
.proof-result{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,0.08);color:rgba(202,210,197,0.78)}
.proof-result strong{color:#fff}
.section-integration .cb{width:100%}
.section-integration .cb-content{height:432px}
.integration-actions{display:flex;gap:10px;flex-wrap:wrap}
.home-page .demo-wrap{max-width:none}
.home-page .oss-wrap p{max-width:none}
.home-page .pf-lead{max-width:none}
.home-page section:has(.roadmap-strip){display:none}
.home-page .cta-final{padding:96px 42px 108px;position:relative}
.home-page .cta-final p{max-width:none}
.home-page .cta-final::before{content:"";position:absolute;inset:18px 24px;border-radius:28px;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.04), transparent 36%),
    repeating-linear-gradient(90deg, transparent 0 160px, rgba(84,127,111,0.05) 160px 162px);
  border:1px solid rgba(255,255,255,0.05)}
.home-page .cta-final > *{position:relative;z-index:1}
@media(max-width:1180px){
  .home-ribbon-track{grid-template-columns:repeat(2,minmax(0,1fr))}
  .band-head,.faq-grid,.oss-shell,.contact-shell,.split-shell{grid-template-columns:1fr}
}
@media(max-width:1100px){
  .narrative-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1040px){
  .signal-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .security-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .developer-proof,.developer-proof-points{grid-template-columns:1fr}
}
@media(max-width:900px){
  .home-page .section,.home-page .section-alt,.home-page .cta-final{padding:74px 24px 82px}
  .home-ribbon{padding:18px 24px 0}
  .security-grid{grid-template-columns:1fr}
  .home-page .grid-2,.home-page .grid-3{grid-template-columns:1fr}
}
@media(max-width:640px){
  .home-ribbon-track,.signal-strip,.narrative-grid{grid-template-columns:1fr}
}

/* ── Opportunity cards ── */
.opp-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;
  padding:28px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.opp-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;pointer-events:none;
  background:linear-gradient(90deg,var(--deep),var(--teal))}
.opp-num{font-size:42px;font-weight:800;color:var(--slate);letter-spacing:-1px;line-height:1}
.opp-unit{font-size:18px;font-weight:700;color:var(--deep)}
.opp-lbl{font-size:14px;font-weight:600;color:var(--slate);margin-top:8px}
.opp-src{font-size:11px;color:var(--slate);opacity:0.4;margin-top:4px}

/* ── Architecture diagram ── */
.arch-wrap{background:var(--charcoal);border-radius:16px;padding:32px;overflow-x:auto}
.arch-row{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:nowrap;min-width:600px}
.arch-box{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);
  border-radius:10px;padding:12px 16px;text-align:center;flex-shrink:0}
.arch-box-primary{background:rgba(82,121,111,0.25);border-color:rgba(132,169,140,0.4)}
.arch-box .ab-icon{font-size:20px;margin-bottom:4px}
.arch-box .ab-title{font-size:11px;font-weight:700;color:#fff}
.arch-box .ab-sub{font-size:10px;color:rgba(255,255,255,0.4);margin-top:2px}
.arch-arrow{font-size:18px;color:rgba(132,169,140,0.6);margin:0 8px;flex-shrink:0}
.arch-layer-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.8px;
  color:rgba(255,255,255,0.25);margin-bottom:12px;text-align:center}
.arch-rails{display:flex;gap:8px;margin-top:8px;justify-content:center;flex-wrap:wrap}
.arch-rail{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);
  border-radius:6px;padding:5px 10px;font-size:10px;font-weight:600;color:rgba(255,255,255,0.5)}

/* ── Partnership tiers ── */
.tier-card{background:var(--surface);border:2px solid var(--border);border-radius:16px;
  padding:32px;box-shadow:var(--shadow);position:relative;transition:transform 0.15s,border-color 0.15s}
.tier-card:hover{transform:translateY(-4px);border-color:var(--teal)}
.tier-card.featured{border-color:var(--deep)}
.tier-badge{position:absolute;top:-1px;left:50%;transform:translateX(-50%);
  background:var(--deep);color:#fff;font-size:10px;font-weight:700;
  padding:3px 14px;border-radius:0 0 8px 8px;letter-spacing:0.5px;text-transform:uppercase}
.tier-icon{font-size:28px;margin-bottom:14px}
.tier-name{font-size:20px;font-weight:800;color:var(--slate);margin-bottom:6px}
.tier-desc{font-size:13px;color:var(--deep);line-height:1.6;margin-bottom:18px}
.tier-perks{list-style:none;padding:0;margin:0 0 20px}
.tier-perks li{padding:6px 0;font-size:13px;color:var(--slate);
  border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:8px}
.tier-perks li:last-child{border-bottom:none}
.pc{color:var(--deep);font-weight:700;flex-shrink:0}
.tier-for{font-size:11px;font-weight:700;color:var(--deep);
  background:rgba(82,121,111,0.08);padding:6px 10px;border-radius:6px}

/* ── Integration steps ── */
.steps-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.step-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px;box-shadow:var(--shadow)}
.step-num{width:36px;height:36px;border-radius:50%;background:var(--deep);color:#fff;
  font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.step-tag{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;
  letter-spacing:0.5px;padding:2px 8px;border-radius:8px;margin-bottom:6px;
  background:rgba(82,121,111,0.12);color:var(--deep)}
.step-card h4{font-size:14px;font-weight:700;color:var(--slate);margin-bottom:4px}
.step-card p{font-size:13px;color:var(--deep);line-height:1.6}

/* ── Use cases ── */
.uc-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:24px;box-shadow:var(--shadow);transition:transform 0.15s}
.uc-card:hover{transform:translateY(-3px)}
.uc-icon{width:46px;height:46px;border-radius:11px;
  background:linear-gradient(135deg,rgba(82,121,111,0.14),rgba(132,169,140,0.08));
  display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:14px}
.uc-card h3{font-size:15px;font-weight:700;color:var(--slate);margin-bottom:6px}
.uc-card p{font-size:13px;color:var(--deep);line-height:1.6}
.uc-tag{display:inline-block;margin-top:10px;font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.5px;color:var(--deep);
  background:rgba(82,121,111,0.1);padding:2px 8px;border-radius:10px}

/* ── Security ── */
.sec-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:20px 24px;box-shadow:var(--shadow);display:flex;gap:16px;align-items:flex-start}
.sec-icon{width:42px;height:42px;border-radius:10px;flex-shrink:0;
  background:linear-gradient(135deg,rgba(82,121,111,0.15),rgba(132,169,140,0.08));
  display:flex;align-items:center;justify-content:center;font-size:20px}
.sec-card h4{font-size:14px;font-weight:700;color:var(--slate);margin-bottom:4px}
.sec-card p{font-size:12px;color:var(--deep);line-height:1.6}

/* ── Live demo widget ── */
.demo-wrap{background:var(--charcoal);border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,0.08);max-width:560px;width:100%}
.demo-bar{background:rgba(0,0,0,0.3);padding:10px 16px;display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,0.06)}
.demo-dot{width:10px;height:10px;border-radius:50%}
.demo-title{font-size:12px;font-weight:600;color:rgba(255,255,255,0.4);margin-left:4px}
.demo-body{padding:20px}
.demo-select{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.demo-btn{padding:6px 14px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;
  border:1.5px solid rgba(255,255,255,0.15);background:transparent;
  color:rgba(255,255,255,0.55);transition:all 0.15s}
.demo-btn.active,.demo-btn:hover{background:rgba(82,121,111,0.3);color:#fff;border-color:var(--teal)}
.demo-output{font-family:var(--font-mono);font-size:11.5px;line-height:1.75;
  color:#e2e8f0;height:220px;overflow-y:auto;white-space:pre-wrap}
.demo-run{background:var(--deep);color:#fff;border:none;padding:9px 22px;border-radius:7px;
  font-size:13px;font-weight:700;cursor:pointer;transition:background 0.15s;margin-top:12px}
.demo-run:hover{background:var(--teal)}
.demo-run:disabled{opacity:0.5;cursor:not-allowed}
.dhl-k{color:#84A98C}.dhl-s{color:#fbbf24}.dhl-n{color:#f87171}


/* ── Roadmap ── */
.rm-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:20px 24px;box-shadow:var(--shadow)}
.rm-status{display:inline-block;padding:2px 10px;border-radius:10px;font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.5px;margin-bottom:10px}
.rm-done{background:rgba(82,121,111,0.12);color:var(--deep)}
.rm-next{background:rgba(212,160,60,0.15);color:#7a5800}
.rm-future{background:rgba(202,210,197,0.2);color:var(--slate)}
.rm-card h4{font-size:14px;font-weight:700;color:var(--slate);margin-bottom:4px}
.rm-card p{font-size:12px;color:var(--deep);line-height:1.55}
.rm-q{font-size:11px;font-weight:700;color:var(--slate);opacity:0.4;margin-top:8px}

/* ── FAQ ── */
.faq-item{transition:border-color 0.18s ease,box-shadow 0.18s ease}
.faq-q{padding:18px 20px 16px;font-size:15px;font-weight:600;color:var(--slate);cursor:pointer;
  display:flex;justify-content:space-between;align-items:flex-start;user-select:none;gap:16px;line-height:1.45}
.faq-q-text{flex:1;min-width:0}
.faq-q:hover{color:var(--deep)}
.faq-icon{font-size:22px;font-weight:300;color:var(--deep);transition:transform 0.2s;flex-shrink:0;line-height:1;margin-top:2px}
.faq-a{font-size:14px;color:var(--deep);line-height:1.75;padding:0 20px 20px;display:none}
.faq-a code{background:rgba(82,121,111,0.1);padding:1px 6px;border-radius:3px;font-size:12px}
.faq-item.open{border-color:rgba(82,121,111,0.28);box-shadow:0 10px 28px rgba(47,62,70,0.1)}
.faq-item.open .faq-icon{transform:rotate(45deg)}
.faq-item.open .faq-a{display:block}
@media(max-width:640px){
  .faq-q{padding:16px 18px 14px;font-size:14px;gap:12px}
  .faq-icon{font-size:20px}
  .faq-a{padding:0 18px 18px;font-size:13.5px;line-height:1.7}
}

/* ── Open source ── */
.oss-wrap{background:var(--charcoal);border-radius:16px;padding:36px 40px;color:#fff;
  display:flex;align-items:center;gap:36px;flex-wrap:wrap}
.oss-icon{font-size:52px;flex-shrink:0}
.oss-wrap h3{font-size:22px;font-weight:800;margin-bottom:8px}
.oss-wrap p{font-size:14px;color:rgba(255,255,255,0.6);line-height:1.7;max-width:480px}
.oss-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.oss-pill{padding:4px 12px;border-radius:10px;font-size:11px;font-weight:700;
  background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.7)}
.oss-btns{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.btn-oss{padding:9px 20px;border-radius:7px;font-size:13px;font-weight:700;text-decoration:none;transition:all 0.15s}
.btn-oss-p{background:var(--teal);color:#fff}
.btn-oss-p:hover{background:var(--deep)}
.btn-oss-s{background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.8);border:1px solid rgba(255,255,255,0.15)}
.btn-oss-s:hover{background:rgba(255,255,255,0.14);color:#fff}

/* ── Contact form ── */
.contact-form{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:36px;box-shadow:var(--shadow)}
.cf-field{margin-bottom:14px}
.cf-field label{display:block;font-size:12px;font-weight:700;color:var(--slate);margin-bottom:5px;text-transform:uppercase;letter-spacing:0.5px}
.cf-field input,.cf-field select,.cf-field textarea{width:100%;padding:10px 14px;border-radius:8px;
  border:1.5px solid var(--border);font-size:14px;background:var(--bg);color:var(--text);
  outline:none;font-family:inherit;transition:border-color 0.15s}
.cf-field input:focus,.cf-field select:focus,.cf-field textarea:focus{border-color:var(--deep)}
.cf-field textarea{resize:vertical;min-height:90px}
.cf-select-shell{position:relative}
.cf-select-native{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
.cf-select-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 14px;border-radius:8px;border:1.5px solid var(--border);background:
  linear-gradient(180deg,rgba(255,255,255,0.92),rgba(247,250,248,0.92));color:var(--text);cursor:pointer;
  font-family:inherit;font-size:14px;text-align:left;transition:border-color 0.15s,box-shadow 0.15s,transform 0.15s}
.cf-select-trigger:hover{border-color:rgba(53,79,82,0.42);box-shadow:0 10px 20px rgba(47,62,70,0.08)}
.cf-select-trigger:focus-visible{outline:none;border-color:var(--deep);box-shadow:0 0 0 4px rgba(132,169,140,0.18)}
.cf-select-trigger.is-open{border-color:var(--deep);box-shadow:0 14px 30px rgba(47,62,70,0.12)}
.cf-select-trigger-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--slate);font-weight:600}
.cf-select-trigger-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;
  color:var(--deep);flex-shrink:0;transition:transform 0.15s}
.cf-select-trigger.is-open .cf-select-trigger-icon{transform:rotate(180deg)}
.cf-select-menu{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:40;padding:6px;
  border-radius:14px;border:1px solid rgba(132,169,140,0.24);background:
  linear-gradient(180deg,rgba(255,255,255,0.98),rgba(244,248,245,0.98));box-shadow:0 20px 42px rgba(47,62,70,0.16)}
.cf-select-menu[hidden]{display:none !important}
.cf-select-menu-inner{display:grid;gap:4px;max-height:240px;overflow:auto}
.cf-select-option{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 12px;border:none;border-radius:10px;background:transparent;color:var(--slate);cursor:pointer;
  font:inherit;text-align:left;transition:background 0.15s,color 0.15s}
.cf-select-option:hover,.cf-select-option:focus-visible{background:rgba(82,121,111,0.1);outline:none}
.cf-select-option.is-selected{background:rgba(82,121,111,0.15)}
.cf-select-option-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.cf-select-option-title{font-size:13px;font-weight:700;line-height:1.35;white-space:normal}
.cf-select-option-meta{font-size:10px;font-weight:700;line-height:1.4;letter-spacing:0.7px;text-transform:uppercase;color:rgba(53,79,82,0.56)}
.cf-select-option-check{font-size:13px;font-weight:800;color:var(--deep);opacity:0;flex-shrink:0}
.cf-select-option.is-selected .cf-select-option-check{opacity:1}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.cf-row{grid-template-columns:1fr}}
.cf-submit{width:100%;padding:13px;border-radius:8px;background:var(--deep);color:#fff;
  border:none;font-size:15px;font-weight:700;cursor:pointer;transition:background 0.15s;margin-top:4px}
.cf-submit:hover{background:var(--slate)}
.cf-success{text-align:center;padding:32px;display:none}
.cf-success h3{font-size:20px;font-weight:700;color:var(--slate);margin-bottom:8px}
.cf-success p{font-size:14px;color:var(--deep)}

/* ── CTA ── */
.cta-final{background:linear-gradient(150deg,var(--slate),var(--charcoal));
  padding:88px 32px;text-align:center;position:relative}
.cta-final::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 50% 70% at 50% 120%,rgba(132,169,140,0.18),transparent)}
.cta-final h2{font-size:40px;font-weight:800;color:#fff;letter-spacing:-0.5px;margin-bottom:14px;position:relative;z-index:1}
.cta-final p{color:rgba(255,255,255,0.55);font-size:17px;max-width:520px;margin:0 auto 36px;position:relative;z-index:1}
.cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}

/* ── Code block ── */
.cb{background:var(--charcoal);border-radius:12px;overflow:hidden}
.cb-tabs{display:flex;background:rgba(0,0,0,0.25);border-bottom:1px solid rgba(255,255,255,0.06)}
.cb-tab{padding:14px 18px;font-size:12px;font-weight:600;color:rgba(255,255,255,0.4);
  cursor:pointer;border-bottom:2px solid transparent;transition:all 0.15s}
.cb-tab.active{color:#fff;border-bottom-color:var(--teal)}
.cb-content{padding:22px 24px;font-family:var(--font-mono);font-size:12.5px;
  line-height:1.75;color:#e2e8f0;display:none}
.cb-content.active{display:block}
.hc{color:#5e7a9a}.hk{color:#84A98C}.hs{color:#fbbf24}.hn{color:#f87171}.hu{color:#93c5fd}

/* ── Flow steps ── */
.fstep{display:flex;align-items:flex-start;gap:14px;margin-bottom:20px}
.fnum{width:30px;height:30px;border-radius:50%;background:var(--deep);color:#fff;
  font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fstep h4{font-size:13px;font-weight:700;color:var(--slate);margin-bottom:2px}
.fstep p{font-size:12px;color:var(--deep);line-height:1.55}

/* ── Hero canvas network ── */
#hero-net{position:absolute;inset:0;pointer-events:none;opacity:0.16;z-index:1}

/* ── Transaction ticker ── */
.tx-ticker{background:rgba(35,50,58,0.97);border-bottom:1px solid rgba(132,169,140,0.12);
  overflow-x:clip;overflow-y:hidden;height:36px;display:flex;align-items:center;position:relative;contain:paint}
.tx-ticker::before,.tx-ticker::after{content:"";position:absolute;top:0;bottom:0;
  width:64px;z-index:2;pointer-events:none}
.tx-ticker::before{left:0;background:linear-gradient(90deg,rgb(35,50,58),transparent)}
.tx-ticker::after{right:0;background:linear-gradient(270deg,rgb(35,50,58),transparent)}
.tx-ticker-inner{display:flex;align-items:center;animation:ticker 42s linear infinite;
  white-space:nowrap}
.tx-ticker-inner:hover{animation-play-state:paused}
.tx-tick{padding:0 22px;font-size:11px;font-weight:600;color:rgba(255,255,255,0.4);
  border-right:1px solid rgba(255,255,255,0.06);display:inline-flex;align-items:center;
  gap:8px;height:36px}
.tx-tick-amt{color:rgba(132,169,140,0.95);font-weight:800}
.tx-tick-rail{padding:1px 7px;border-radius:8px;font-size:10px;font-weight:700;
  background:rgba(82,121,111,0.3);color:rgba(202,210,197,0.85);letter-spacing:0.3px}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ── Card shimmer on hover ── */
@keyframes shimmer{0%{background-position:200% center}100%{background-position:-200% center}}
.opp-card::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:14px;
  background:linear-gradient(120deg,transparent 30%,rgba(202,210,197,0.13) 50%,transparent 70%);
  background-size:200% auto;opacity:0;transition:opacity 0.2s}
.opp-card:hover::after{opacity:1;animation:shimmer 1.2s ease-in-out}

/* ── Arch box scroll reveal ── */
.arch-box{transition:opacity 0.45s ease,transform 0.45s ease}
.arch-box.arch-hidden{opacity:0;transform:translateY(14px)}
.arch-arrow{transition:opacity 0.45s ease}
.arch-arrow.arch-hidden{opacity:0}
.arch-rail{transition:all 0.2s;cursor:default}
.arch-rail:hover{background:rgba(132,169,140,0.18);border-color:rgba(132,169,140,0.45);
  box-shadow:0 0 12px rgba(82,121,111,0.3)}

.pf-shell{background:linear-gradient(180deg,rgba(47,62,70,0.98),rgba(38,52,60,0.98));border-radius:20px;
  padding:22px 22px 24px;border:1px solid rgba(255,255,255,0.08);box-shadow:0 14px 36px rgba(47,62,70,0.14)}
.pf-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px;margin-bottom:16px}
.pf-lead{max-width:680px}
.pf-kicker{font-size:11px;font-weight:800;letter-spacing:0.8px;text-transform:uppercase;color:rgba(202,210,197,0.58);margin-bottom:8px}
.pf-lead h3{font-size:28px;font-weight:800;color:#fff;line-height:1.15;margin-bottom:10px;letter-spacing:-0.4px}
.pf-lead p{font-size:14px;line-height:1.7;color:rgba(202,210,197,0.72)}
.pf-switch{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:8px;justify-content:end;align-content:start;justify-self:end}
.pf-switch-btn{padding:7px 14px;border-radius:999px;font-size:12px;font-weight:700;
  border:1px solid rgba(255,255,255,0.14);background:transparent;color:rgba(255,255,255,0.56);
  cursor:pointer;transition:all 0.15s}
.pf-switch-btn:hover,.pf-switch-btn.active{background:rgba(82,121,111,0.3);border-color:var(--teal);color:#fff}
.pf-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:16px}
.pf-meta{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:12px 14px}
.pf-meta-label{display:block;font-size:10px;font-weight:800;letter-spacing:0.8px;text-transform:uppercase;color:rgba(202,210,197,0.48)}
.pf-meta-value{display:block;margin-top:7px;font-size:14px;font-weight:700;color:#fff;line-height:1.3}
.pf-meta-value.is-policy{color:var(--ash)}
.pf-canvas-wrap{border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,0.04),rgba(255,255,255,0.02));
  border:1px solid rgba(255,255,255,0.08);padding:16px}
#payment-flow-canvas{display:block;width:100%;height:530px}
.pf-legend{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.pf-stage{border-radius:12px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);
  padding:12px 12px 10px;transition:all 0.2s}
.pf-stage.active{background:rgba(132,169,140,0.14);border-color:rgba(132,169,140,0.35)}
.pf-stage.done{background:rgba(82,121,111,0.18);border-color:rgba(132,169,140,0.22)}
.pf-stage:hover{border-color:rgba(132,169,140,0.3);background:rgba(132,169,140,0.08)}
.pf-stage strong{display:block;font-size:11px;font-weight:800;letter-spacing:0.7px;text-transform:uppercase;color:#fff}
.pf-stage span{display:block;margin-top:6px;font-size:11px;line-height:1.45;color:rgba(255,255,255,0.55)}
.pf-bottom{display:grid;grid-template-columns:1.1fr 0.8fr 1.1fr;gap:14px;margin-top:14px}
.pf-card{background:rgba(255,255,255,0.96);border:1px solid rgba(132,169,140,0.2);border-radius:16px;padding:20px 22px;box-shadow:var(--shadow)}
.pf-card p{font-size:14px;color:var(--deep);line-height:1.7}
.pf-status-title{font-size:10px;font-weight:800;letter-spacing:0.85px;text-transform:uppercase;color:var(--deep);opacity:0.72}
.pf-status-head{font-size:20px;font-weight:800;color:var(--slate);margin:8px 0 6px;line-height:1.2}
.pf-status-chip{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:8px 12px;border-radius:999px;
  background:rgba(82,121,111,0.1);border:1px solid rgba(82,121,111,0.18);font-size:12px;font-weight:800;color:var(--slate)}
.pf-status-chip::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px rgba(132,169,140,0.12)}
.pf-status-chip[data-kind="fallback"]{background:rgba(251,191,36,0.12);border-color:rgba(251,191,36,0.28)}
.pf-status-chip[data-kind="fallback"]::before{background:#fbbf24;box-shadow:0 0 0 4px rgba(251,191,36,0.14)}
.pf-status-chip[data-kind="hold"]{background:rgba(248,113,113,0.1);border-color:rgba(248,113,113,0.22)}
.pf-status-chip[data-kind="hold"]::before{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,0.15)}
.pf-meta-value.is-policy[data-kind="fallback"]{color:#f7d88a}
.pf-meta-value.is-policy[data-kind="hold"]{color:#f6c177}
.pf-note{margin-top:12px}
.pf-effects{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px}
.pf-effects li{padding:10px 12px;border-radius:12px;background:rgba(82,121,111,0.08);border:1px solid rgba(82,121,111,0.12);
  font-size:13px;color:var(--slate);line-height:1.55}
@media(max-width:1180px){
  .pf-top{grid-template-columns:1fr}
  .pf-switch{grid-auto-flow:row;grid-template-columns:repeat(3,max-content);justify-content:start;justify-self:start}
}
@media(max-width:1040px){
  .pf-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pf-legend{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .pf-switch{grid-template-columns:repeat(2,max-content)}
  .pf-summary,.pf-legend{grid-template-columns:1fr 1fr}
  .pf-bottom{grid-template-columns:1fr}
  #payment-flow-canvas{height:460px}
}
@media(max-width:560px){
  .pf-switch{grid-template-columns:1fr;justify-items:start}
  .pf-summary,.pf-legend{grid-template-columns:1fr}
  #payment-flow-canvas{height:420px}
}

/* ── Typewriter reveal ── */
.cb-content.active.tw-reveal{clip-path:inset(0 0 0% 0)}
.cb-content.active.tw-hidden{clip-path:inset(0 0 100% 0)}
.cb-content.active{transition:clip-path 1.5s cubic-bezier(0.4,0,0.2,1)}
.tw-cursor{display:inline-block;width:2px;height:0.9em;background:var(--teal);
  vertical-align:text-bottom;margin-left:2px;animation:blink 1s step-end infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}


/* ── Stat counter flash ── */
@keyframes count-flash{0%,100%{color:#fff}50%{color:rgba(132,169,140,0.9)}}
.sr-num.counting{animation:count-flash 0.25s ease}

/* ── Live dot burst ── */
@keyframes dot-burst{0%{box-shadow:0 0 0 0 rgba(76,175,80,0.65)}
  60%{box-shadow:0 0 0 10px rgba(76,175,80,0)}100%{box-shadow:0 0 6px rgba(76,175,80,0.4)}}
.live-dot.burst{animation:dot-burst 0.55s ease-out}

/* ── Rail badge hover glow ── */
.badge{transition:box-shadow 0.18s}
.badge-internal:hover{box-shadow:0 0 9px rgba(82,121,111,0.6)}
.badge-x402:hover{box-shadow:0 0 9px rgba(132,169,140,0.6)}
.badge-ach:hover{box-shadow:0 0 9px rgba(212,160,60,0.5)}
.badge-card:hover{box-shadow:0 0 9px rgba(196,91,74,0.5)}
.badge-crypto:hover{box-shadow:0 0 9px rgba(82,121,111,0.6)}

/* ── Card float-in ── */
.float-card{opacity:1;transform:none;transition:none}
.float-card.float-in{opacity:1;transform:none}

/* ── Sticky nav ── */
.sticky-nav{position:sticky;left:0;right:0;top:56px;z-index:95;background:rgba(24,37,43,0.98);border-bottom:1px solid rgba(255,255,255,0.07)}
.sticky-nav-inner{max-width:1200px;margin:0 auto;padding:0 32px;display:flex;align-items:center;gap:24px;height:48px}
.snav-link{font-size:13px;font-weight:600;color:rgba(202,210,197,0.7);text-decoration:none;transition:color 0.15s}
.snav-link:hover{color:#fff}
.snav-cta{padding:6px 16px;border-radius:8px;background:var(--deep);color:#fff;font-size:13px;font-weight:700;text-decoration:none;transition:opacity 0.15s}
.snav-cta:hover{opacity:0.85}
@media(max-width:760px){
  .hero{padding:72px 20px 56px}
  .hero h1{font-size:clamp(38px,11vw,48px);line-height:1.08;letter-spacing:-0.04em}
  .hero-sub{font-size:16px;line-height:1.6;margin-bottom:24px}
  .hero-btns{flex-direction:column;align-items:stretch;max-width:420px;margin:0 auto}
  .btn-hp,.btn-hs{width:100%;text-align:center}
  .sticky-nav-inner{padding:0 16px;gap:14px;height:52px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}
  .sticky-nav-inner::-webkit-scrollbar{display:none}
  .snav-link,.snav-cta{white-space:nowrap;flex-shrink:0}
  .stats-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-content:stretch}
  .sr-item{min-width:0;padding:16px 14px;border-right:none;border-bottom:1px solid rgba(255,255,255,0.07)}
  .sr-item:nth-child(odd){border-right:1px solid rgba(255,255,255,0.07)}
  .sr-item:nth-child(5){grid-column:1 / -1}
  .sr-num{font-size:24px}
  .numbers-bar,.trust-bar{padding-inline:16px;justify-content:flex-start}
  .nb-item{width:50%;padding:8px 12px;border-right:none;text-align:left}
  .trust-item{width:100%;justify-content:flex-start}
  .home-page::after{display:none}
  .home-page .section,.home-page .section-alt,.home-page .cta-final{padding:56px 16px 64px}
  .home-page .section::before,.home-page .section-alt::before{inset:8px 10px;border-radius:20px}
  .home-page .section::after,.home-page .section-alt::after{display:none}
  .sh{font-size:clamp(28px,8vw,34px);line-height:1.12}
  .ss{font-size:14px;line-height:1.65}
  .ribbon-node,.signal-chip,.note-panel,.step-card,.tier-card,.uc-card,.sec-card{padding:18px 16px}
  .oss-wrap{padding:24px 20px;gap:20px}
  .contact-form{padding:24px 18px}
  .steps-grid{grid-template-columns:1fr}
  .pf-shell{padding:18px 14px 20px}
  .pf-lead h3{font-size:24px}
  .pf-lead p,.pf-card p{font-size:13px}
  .pf-card{padding:18px 16px}
  .pf-status-head{font-size:18px}
  .demo-body{padding:16px}
  .cb-tabs{overflow-x:auto;scrollbar-width:none}
  .cb-tabs::-webkit-scrollbar{display:none}
  .cb-tab{white-space:nowrap;padding:12px 14px}
  .cb-content{padding:16px;font-size:12px;line-height:1.65}
  .section-integration .cb-content{height:auto;min-height:320px}
  .cta-final h2{font-size:32px;line-height:1.08}
  .cta-final p{font-size:15px;margin-bottom:24px}
  .cta-btns{flex-direction:column;align-items:stretch;max-width:420px;margin:0 auto}
}
@media(max-width:520px){
  .eyebrow-pill{font-size:11px;letter-spacing:0.04em;padding:5px 12px 5px 9px}
  .stats-row{grid-template-columns:1fr}
  .sr-item,.sr-item:nth-child(odd){border-right:none}
  .sr-item:nth-child(5){grid-column:auto}
  .nb-item{width:100%}
  .proof-actions,.integration-actions,.cta-btns,.hero-btns{gap:10px}
  .btn-hp,.btn-hs,.btn-oss,.cf-submit{min-height:46px}
}
@media (prefers-reduced-motion: reduce){
  .tx-ticker-inner{animation:none}
  .arch-box,.arch-arrow,.cb-content.active{transition:none!important}
}

.narrative-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
@media(max-width:1100px) and (min-width:641px){
  .narrative-card:last-child:nth-child(2n+1){grid-column:1 / -1;max-width:calc(50% - 11px);margin:0 auto;width:100%}
}
.narrative-card{background:var(--charcoal);border:1px solid rgba(255,255,255,0.07);
  border-radius:18px;padding:28px 28px 24px;position:relative;overflow:hidden}
.narrative-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--deep),var(--teal))}
.narrative-type{font-size:10px;font-weight:800;letter-spacing:0.9px;text-transform:uppercase;
  color:rgba(202,210,197,0.46);margin-bottom:14px;display:flex;align-items:center;gap:8px}
.narrative-type::after{content:"";flex:1;height:1px;background:rgba(255,255,255,0.06)}
.narrative-card h3{font-size:16px;font-weight:800;color:#fff;line-height:1.3;margin-bottom:10px}
.narrative-before{background:rgba(196,91,74,0.1);border:1px solid rgba(196,91,74,0.18);
  border-radius:10px;padding:10px 14px;font-size:12px;color:rgba(255,200,190,0.82);
  line-height:1.6;margin-bottom:10px}
.narrative-before strong{display:block;font-size:10px;font-weight:800;letter-spacing:0.7px;
  text-transform:uppercase;color:rgba(196,91,74,0.7);margin-bottom:4px}
.narrative-after{background:rgba(82,121,111,0.15);border:1px solid rgba(132,169,140,0.2);
  border-radius:10px;padding:10px 14px;font-size:12px;color:rgba(202,220,205,0.85);
  line-height:1.6;margin-bottom:14px}
.narrative-after strong{display:block;font-size:10px;font-weight:800;letter-spacing:0.7px;
  text-transform:uppercase;color:rgba(132,169,140,0.7);margin-bottom:4px}
.narrative-outcome{font-size:11px;font-weight:800;color:var(--teal);
  display:flex;align-items:center;gap:6px}
.narrative-outcome::before{content:"\2192";opacity:0.6}
@media(max-width:1100px){
  .narrative-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:860px){
  .narrative-grid{grid-template-columns:1fr;gap:16px}
  .narrative-card:last-child:nth-child(2n+1){grid-column:auto;max-width:none;margin:0;width:auto}
  .narrative-card{padding:22px 18px 20px;border-radius:16px}
  .narrative-type{font-size:9px;letter-spacing:0.08em;margin-bottom:12px}
  .narrative-card h3{font-size:20px;line-height:1.25}
  .narrative-before,.narrative-after{padding:10px 12px;font-size:12.5px;line-height:1.55}
}