/* ===== RISK BANNER ===== */
.risk-banner{background:var(--bg-panel-2);border-bottom:1px solid var(--border);font-size:.8rem;color:var(--text-dim);padding:8px 0;text-align:center}
.risk-banner strong{color:var(--bear)}

/* ===== HERO SPLIT ===== */
.hero-split{position:relative;overflow:hidden;padding-block:clamp(48px,8vw,90px)}
.hero-split::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 480px at 80% -10%,rgba(59,130,246,.18),transparent 60%),radial-gradient(700px 420px at 10% 110%,rgba(0,197,130,.12),transparent 60%);pointer-events:none}
.hero-grid{position:relative;display:grid;gap:clamp(32px,5vw,56px);align-items:center;grid-template-columns:1fr}
@media(min-width:780px){.hero-grid{grid-template-columns:1.05fr .95fr}}
.hero-copy .eyebrow{display:inline-block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cta);font-weight:700;margin-bottom:16px}
.hero-copy p{font-size:1.12rem;margin:18px 0 28px;max-width:46ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.hero-trust{display:flex;flex-wrap:wrap;gap:20px;margin-top:28px;font-size:.85rem;color:var(--text-dim)}
.hero-trust span{display:flex;align-items:center;gap:7px}
.hero-trust span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bull)}

/* GLASS PANEL */
.glass{background:var(--glass-bg);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow);position:relative}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,var(--glass-hi),transparent 40%);pointer-events:none}

.hero-panel{padding:22px}
.hero-panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:.85rem;color:var(--text-muted)}
.quote-list{display:flex;flex-direction:column;gap:2px}
.quote-row{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:12px 10px;border-radius:var(--radius-sm);transition:background .15s ease}
.quote-row:hover{background:rgba(255,255,255,.03)}
.quote-sym{font-weight:700;color:var(--text)}
.quote-px{font-variant-numeric:tabular-nums;color:var(--text)}
.quote-chg{font-variant-numeric:tabular-nums;font-weight:700;font-size:.88rem;padding:3px 8px;border-radius:6px}
.chg-up{color:var(--bull);background:rgba(0,197,130,.12)}
.chg-down{color:var(--bear);background:rgba(255,74,90,.12)}

/* ===== MARQUEE TICKER ===== */
.ticker-viewport{background:var(--bg-panel);border-block:1px solid var(--border);overflow:hidden;position:relative}
.ticker-marquee{display:flex;width:max-content}
.ticker-track{display:flex;align-items:center;gap:38px;padding:12px 19px;animation:tickerScroll 38s linear infinite;white-space:nowrap}
.ticker-viewport:hover .ticker-track,.ticker-viewport:focus-within .ticker-track{animation-play-state:paused}
.ticker-item{display:inline-flex;align-items:center;gap:9px;font-size:.9rem;font-variant-numeric:tabular-nums}
.ticker-item .t-sym{font-weight:700;color:var(--text-muted)}
.ticker-item .t-px{color:var(--text)}
.ticker-item .t-chg.up{color:var(--bull)}
.ticker-item .t-chg.down{color:var(--bear)}
@keyframes tickerScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* ===== STATS BENTO ===== */
.bento{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}
@media(min-width:780px){.bento{grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr}.bento .bento-lg{grid-column:span 2;grid-row:span 2}}
.bento-cell{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;justify-content:center;gap:8px;transition:border-color .2s ease,transform .2s ease}
.bento-cell:hover{border-color:var(--system);transform:translateY(-3px)}
.bento-cell .stat-num{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}
.bento-cell .stat-label{font-size:.85rem;color:var(--text-muted)}
.bento-lg{background:linear-gradient(140deg,var(--bg-panel-2),var(--bg-panel))}
.bento-lg .stat-num{color:var(--cta)}

/* ===== TABS ===== */
.tab-list{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--border);margin-bottom:24px}
.tab-btn{padding:11px 18px;font-weight:600;color:var(--text-muted);border-bottom:2px solid transparent;border-radius:var(--radius-sm) var(--radius-sm) 0 0;transition:color .18s ease,border-color .18s ease,background .18s ease}
.tab-btn:hover{color:var(--text);background:rgba(255,255,255,.03)}
.tab-btn.is-active{color:var(--cta);border-bottom-color:var(--cta)}
.tab-panel{display:none}
.tab-panel.is-active{display:block;animation:fadeIn .35s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.tab-panel.is-active{animation:none}}

/* dense table */
.data-table{width:100%;border-collapse:collapse;font-size:.92rem;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.data-table th,.data-table td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--border-soft)}
.data-table th{background:var(--bg-panel-2);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);font-weight:700}
.data-table td{color:var(--text-muted)}
.data-table td:first-child{color:var(--text);font-weight:600}
.data-table tbody tr:hover{background:rgba(255,255,255,.025)}
.data-table .num{text-align:right;font-variant-numeric:tabular-nums;color:var(--text)}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ===== SESSION STRIP ===== */
.session-strip{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}
@media(min-width:780px){.session-strip{grid-template-columns:repeat(4,1fr)}}
.session-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.session-card .s-name{font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}
.session-card .s-dot{width:9px;height:9px;border-radius:50%}
.s-dot.open{background:var(--bull);box-shadow:0 0 8px var(--bull)}
.s-dot.closed{background:var(--text-dim)}
.session-card .s-time{font-size:.82rem;color:var(--text-muted);margin-top:6px;font-variant-numeric:tabular-nums}
.session-card .s-status{margin-top:10px;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.s-status.open{color:var(--bull)}
.s-status.closed{color:var(--text-dim)}

/* ===== COMPARISON MATRIX ===== */
.matrix{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:640px){.matrix{grid-template-columns:repeat(2,1fr)}}
@media(min-width:780px){.matrix{grid-template-columns:repeat(3,1fr)}}
.acct-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;display:flex;flex-direction:column;gap:14px;transition:transform .2s ease,border-color .2s ease}
.acct-card:hover{transform:translateY(-4px);border-color:var(--cta)}
.acct-card.featured{border-color:var(--cta);box-shadow:0 0 0 1px var(--cta),var(--shadow)}
.acct-card .acct-tag{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cta);font-weight:700}
.acct-card .acct-name{font-size:1.4rem;font-weight:800;color:var(--text)}
.acct-card .acct-spread{font-variant-numeric:tabular-nums;font-size:2rem;font-weight:800;color:var(--text)}
.acct-card .acct-spread small{font-size:.8rem;color:var(--text-dim);font-weight:500}
.acct-feats{display:flex;flex-direction:column;gap:9px;margin-top:4px}
.acct-feats li{display:flex;align-items:flex-start;gap:9px;font-size:.9rem;color:var(--text-muted)}
.acct-feats li::before{content:"";flex:none;width:16px;height:16px;margin-top:2px;border-radius:50%;background:rgba(0,197,130,.15);background-image:linear-gradient(135deg,transparent,transparent);box-shadow:inset 0 0 0 1px var(--bull)}
.acct-card .btn{margin-top:auto}

/* ===== PLATFORM / SCREENSHOT MOCK FRAMES ===== */
.platform-teaser{display:grid;gap:clamp(28px,5vw,48px);align-items:center;grid-template-columns:1fr}
@media(min-width:780px){.platform-teaser{grid-template-columns:1fr 1fr}}
.mock-frame{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--glass-border);background:var(--bg-panel);box-shadow:var(--shadow-lg)}
.mock-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:var(--bg-elev);border-bottom:1px solid var(--border)}
.mock-bar .dot{width:11px;height:11px;border-radius:50%}
.mock-bar .dot:nth-child(1){background:var(--bear)}
.mock-bar .dot:nth-child(2){background:var(--cta)}
.mock-bar .dot:nth-child(3){background:var(--bull)}
.mock-bar .mock-url{margin-left:12px;font-size:.78rem;color:var(--text-dim);background:var(--bg-base);padding:4px 12px;border-radius:6px;flex:1}
.mock-body{padding:18px;display:grid;gap:12px;grid-template-columns:2fr 1fr;min-height:240px}
.mock-chart{background:linear-gradient(180deg,rgba(59,130,246,.08),transparent);border:1px solid var(--border);border-radius:var(--radius-sm);position:relative;overflow:hidden;min-height:200px}
.mock-chart::before{content:"";position:absolute;inset:auto 0 0 0;height:60%;background:linear-gradient(180deg,rgba(0,197,130,.12),transparent);clip-path:polygon(0 80%,12% 60%,24% 70%,38% 40%,52% 55%,66% 25%,80% 45%,100% 20%,100% 100%,0 100%)}
.mock-side{display:flex;flex-direction:column;gap:8px}
.mock-side .mock-row{display:flex;justify-content:space-between;font-size:.78rem;padding:7px 9px;background:var(--bg-panel-2);border-radius:6px;font-variant-numeric:tabular-nums;color:var(--text-muted)}
.mock-side .mock-row .up{color:var(--bull)}
.mock-side .mock-row .down{color:var(--bear)}
.platform-feats{display:flex;flex-direction:column;gap:16px}
.platform-feats li{display:flex;gap:14px;align-items:flex-start}
.platform-feats .pf-ic{flex:none;width:40px;height:40px;border-radius:10px;background:rgba(59,130,246,.12);display:grid;place-items:center;color:var(--system);font-weight:800}
.platform-feats h4{margin-bottom:3px}
.platform-feats p{font-size:.9rem}

/* orderbook rail */
.orderbook-rail{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px;font-variant-numeric:tabular-nums}
.orderbook-rail h3{margin-bottom:14px;font-size:1rem}
.ob-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;font-size:.82rem;padding:5px 0}
.ob-row.head{color:var(--text-dim);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border);padding-bottom:8px;margin-bottom:4px}
.ob-row .ask{color:var(--bear)}
.ob-row .bid{color:var(--bull)}
.ob-spread{text-align:center;font-size:.78rem;color:var(--text-dim);padding:8px 0;border-block:1px solid var(--border);margin-block:6px}

/* ===== STEPS ===== */
.steps-list{display:grid;gap:18px;grid-template-columns:1fr;counter-reset:step}
@media(min-width:780px){.steps-list{grid-template-columns:repeat(4,1fr)}}
.step{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:22px;position:relative}
.step::before{counter-increment:step;content:counter(step);display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:rgba(240,167,66,.12);color:var(--cta);font-weight:800;font-family:var(--font-display);margin-bottom:14px}
.step h4{margin-bottom:7px}
.step p{font-size:.9rem}

/* zigzag steps */
.zigzag{display:flex;flex-direction:column;gap:clamp(28px,5vw,52px)}
.zigzag-item{display:grid;gap:24px;align-items:center;grid-template-columns:1fr}
@media(min-width:780px){.zigzag-item{grid-template-columns:1fr 1fr}.zigzag-item:nth-child(even) .zigzag-media{order:-1}}
.zigzag-media{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);min-height:200px;display:grid;place-items:center;color:var(--text-dim);overflow:hidden;position:relative}
.zigzag-media .zz-num{font-size:4rem;font-weight:800;font-family:var(--font-display);color:rgba(240,167,66,.18)}
.zigzag-copy .step-kicker{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cta);font-weight:700;margin-bottom:10px;display:block}
.zigzag-copy p{margin-top:10px}

/* ===== CTA ===== */
.cta-band{background:linear-gradient(135deg,var(--bg-panel-2),var(--bg-panel));border:1px solid var(--border);border-radius:var(--radius-lg);padding:clamp(32px,5vw,56px);text-align:center;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 50% -20%,rgba(240,167,66,.16),transparent 60%);pointer-events:none}
.cta-band p{max-width:54ch;margin:14px auto 28px;font-size:1.08rem}
.cta-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;position:relative}
.cta-dual{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:780px){.cta-dual{grid-template-columns:1fr 1fr}}
.cta-dual .cta-half{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px;text-align:center}
.cta-dual .cta-half.primary{border-color:var(--cta);background:linear-gradient(140deg,rgba(240,167,66,.08),var(--bg-panel))}
.cta-dual .cta-half p{margin:12px 0 22px;font-size:.95rem}

.dual-cta{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:640px){.dual-cta{grid-template-columns:1fr 1fr}}
.dual-cta .btn{width:100%}

/* ===== FAQ / ACCORDION ===== */
.accordion{display:flex;flex-direction:column;gap:12px}
.accordion-item,.faq-item,.checklist-item{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.accordion-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:18px 20px;text-align:left;font-weight:600;color:var(--text);font-size:1rem}
.accordion-trigger::after{content:"+";font-size:1.4rem;font-weight:400;color:var(--cta);transition:transform .25s ease;flex:none;line-height:1}
.accordion-item.open .accordion-trigger::after,.faq-item.open .accordion-trigger::after,.checklist-item.open .accordion-trigger::after{content:"\2212"}
.accordion-body,.faq-body,.checklist-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
@media(prefers-reduced-motion:reduce){.accordion-body,.faq-body,.checklist-body{transition:none}}
.accordion-body>div,.faq-body>div,.checklist-body>div{padding:0 20px 20px;color:var(--text-muted);font-size:.94rem}

/* ===== FAQ SEARCH / CATEGORIES ===== */
.faq-search{display:flex;gap:10px;max-width:520px;margin-bottom:24px}
.faq-search input{flex:1;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:13px 16px;color:var(--text)}
.faq-search input::placeholder{color:var(--text-dim)}
.faq-search input:focus{outline:none;border-color:var(--system)}
.faq-cats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.faq-cat{padding:8px 16px;border-radius:999px;background:var(--bg-panel);border:1px solid var(--border);font-size:.86rem;color:var(--text-muted)}
.faq-cat:hover,.faq-cat.is-active{color:var(--cta);border-color:var(--cta)}

/* ===== SEG CONTROL ===== */
.seg-control{display:inline-flex;background:var(--bg-panel);border:1px solid var(--border);border-radius:999px;padding:4px;gap:4px;margin-bottom:24px}
.seg-btn{padding:9px 20px;border-radius:999px;font-weight:600;font-size:.9rem;color:var(--text-muted);transition:background .18s ease,color .18s ease}
.seg-btn.is-active{background:var(--cta);color:var(--cta-ink)}
.seg-panel{display:none}
.seg-panel.is-active{display:block;animation:fadeIn .35s ease}

/* ===== EXPAND CARDS ===== */
.expand-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:780px){.expand-grid{grid-template-columns:repeat(2,1fr)}}
.expand-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.expand-trigger{width:100%;text-align:left;padding:20px;display:flex;justify-content:space-between;align-items:center;gap:12px;font-weight:700;color:var(--text)}
.expand-trigger::after{content:"";width:9px;height:9px;border-right:2px solid var(--cta);border-bottom:2px solid var(--cta);transform:rotate(45deg);transition:transform .25s ease;flex:none}
.expand-card.open .expand-trigger::after{transform:rotate(-135deg)}
.expand-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
.expand-card.open .expand-body{max-height:600px}
.expand-body>div{padding:0 20px 20px;color:var(--text-muted);font-size:.92rem}
@media(prefers-reduced-motion:reduce){.expand-body{transition:none}}

/* ===== GENERIC CARD GRID ===== */
.card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:24px;transition:transform .2s ease,border-color .2s ease}
.card:hover{transform:translateY(-3px);border-color:var(--system)}
.card .card-ic{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;background:rgba(59,130,246,.12);color:var(--system);font-weight:800;font-size:1.1rem;margin-bottom:14px}
.card h3,.card h4{margin-bottom:8px}
.card p{font-size:.93rem}

/* ===== PAGE HEADER ===== */
.page-header{position:relative;overflow:hidden;padding-block:clamp(48px,7vw,84px);border-bottom:1px solid var(--border)}
.page-header::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 360px at 70% -20%,rgba(59,130,246,.14),transparent 60%);pointer-events:none}
.page-header .breadcrumb{font-size:.82rem;color:var(--text-dim);margin-bottom:14px}
.page-header .breadcrumb a:hover{color:var(--cta)}
.page-header p{margin-top:16px;max-width:60ch;font-size:1.1rem}
.guide-header{padding-block:clamp(40px,6vw,72px)}
.guide-header .meta{display:flex;flex-wrap:wrap;gap:18px;margin-top:18px;font-size:.84rem;color:var(--text-dim)}
.guide-header .meta span{display:flex;align-items:center;gap:7px}

/* ===== PROSE ===== */
.prose{max-width:74ch}
.prose h2{margin-top:36px;margin-bottom:14px}
.prose h3{margin-top:26px;margin-bottom:10px}
.prose p{margin-bottom:16px}
.prose ul{margin:0 0 16px;padding-left:0;display:flex;flex-direction:column;gap:9px}
.prose ul li{position:relative;padding-left:22px;color:var(--text-muted)}
.prose ul li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:2px;background:var(--cta)}
.prose a{color:var(--system);text-decoration:underline;text-underline-offset:2px}

/* TOC */
.toc{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:22px;position:sticky;top:80px}
.toc h4{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);margin-bottom:14px}
.toc ul{display:flex;flex-direction:column;gap:9px}
.toc a{font-size:.9rem;color:var(--text-muted)}
.toc a:hover{color:var(--cta)}
.prose-layout{display:grid;gap:32px;grid-template-columns:1fr}
@media(min-width:780px){.prose-layout{grid-template-columns:240px 1fr}}

/* RISK SECTION (dark callout) */
.risk-section{background:var(--dark-section);color:#f4f6f9;border:1px solid var(--bear);border-radius:var(--radius-lg);padding:28px}
.risk-section *{color:inherit}
.risk-section h3{color:var(--bear)}
.risk-section p{color:var(--text-muted);margin-top:10px}

/* ===== TIMELINE ===== */
.timeline{position:relative;display:flex;flex-direction:column;gap:28px;padding-left:28px}
.timeline::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:var(--border)}
.timeline-item{position:relative}
.timeline-item::before{content:"";position:absolute;left:-28px;top:5px;width:16px;height:16px;border-radius:50%;background:var(--bg-base);border:3px solid var(--cta)}
.timeline-item .tl-year{font-family:var(--font-display);font-weight:800;color:var(--cta);font-variant-numeric:tabular-nums}
.timeline-item h4{margin:4px 0 6px}
.timeline-item p{font-size:.92rem}

/* ===== INFO / SUPPORT ===== */
.info-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px;display:grid;gap:18px}
.info-row{display:flex;align-items:flex-start;gap:14px}
.info-row .ic{flex:none;width:42px;height:42px;border-radius:11px;background:rgba(59,130,246,.12);color:var(--system);display:grid;place-items:center;font-weight:800}
.info-row strong{color:var(--text);display:block}
.info-row span{font-size:.9rem;color:var(--text-muted)}
.hours-table{width:100%;border-collapse:collapse;font-size:.92rem}
.hours-table td{padding:11px 0;border-bottom:1px solid var(--border-soft);color:var(--text-muted)}
.hours-table td:last-child{text-align:right;color:var(--text);font-variant-numeric:tabular-nums}

/* ===== TRUST BADGES ===== */
.trust-badges{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}
@media(min-width:780px){.trust-badges{grid-template-columns:repeat(4,1fr)}}
.trust-badge{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:20px;text-align:center}
.trust-badge .tb-ic{width:48px;height:48px;margin:0 auto 12px;border-radius:12px;background:rgba(0,197,130,.12);color:var(--bull);display:grid;place-items:center;font-weight:800}
.trust-badge strong{display:block;color:var(--text);font-size:.95rem}
.trust-badge span{font-size:.82rem;color:var(--text-dim)}

/* tips / note panel */
.tips-panel,.note-panel{background:var(--bg-panel-2);border:1px solid var(--border);border-left:3px solid var(--cta);border-radius:var(--radius);padding:24px}
.tips-panel ul{display:flex;flex-direction:column;gap:11px;margin-top:14px}
.tips-panel ul li{position:relative;padding-left:24px;font-size:.92rem;color:var(--text-muted)}
.tips-panel ul li::before{content:"\2713";position:absolute;left:0;color:var(--bull);font-weight:800}

/* related links */
.related-links{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:640px){.related-links{grid-template-columns:repeat(3,1fr)}}
.related-link{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;font-weight:600;color:var(--text);transition:border-color .2s ease,transform .2s ease}
.related-link:hover{border-color:var(--cta);transform:translateX(3px)}
.related-link::after{content:"\2192";color:var(--cta)}

/* methods grid */
.methods-grid{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}
@media(min-width:780px){.methods-grid{grid-template-columns:repeat(4,1fr)}}
.method-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:20px;text-align:center}
.method-card .m-ic{width:44px;height:44px;margin:0 auto 10px;border-radius:11px;background:var(--bg-elev);display:grid;place-items:center;color:var(--cta);font-weight:800}
.method-card strong{display:block;color:var(--text);font-size:.92rem}
.method-card span{font-size:.8rem;color:var(--text-dim);font-variant-numeric:tabular-nums}

/* demo vs live two-col */
.compare-two{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:640px){.compare-two{grid-template-columns:1fr 1fr}}
.compare-col{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px}
.compare-col.live{border-color:var(--cta)}
.compare-col h3{margin-bottom:16px}
.compare-col ul{display:flex;flex-direction:column;gap:11px}
.compare-col ul li{display:flex;gap:10px;font-size:.92rem;color:var(--text-muted)}
.compare-col ul li::before{content:"\2022";color:var(--cta);font-weight:800}

/* capability grid (same as cards) */
.capability-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:640px){.capability-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:780px){.capability-grid{grid-template-columns:repeat(3,1fr)}}

/* sys requirements */
.req-cols{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:640px){.req-cols{grid-template-columns:1fr 1fr}}

/* promo code box */
.promo-box{background:linear-gradient(135deg,rgba(240,167,66,.1),var(--bg-panel));border:1px dashed var(--cta);border-radius:var(--radius-lg);padding:28px;text-align:center}
.promo-code-val{font-family:var(--font-display);font-size:clamp(1.6rem,4vw,2.4rem);font-weight:800;letter-spacing:.1em;color:var(--cta);margin:10px 0}