/* ===== TICKER ===== */
.ticker-header{background:var(--text-light);color:#f4f6f9;border-bottom:1px solid rgba(255,255,255,.08)}
.ticker-header *{color:inherit}
.ticker-viewport{overflow:hidden;position:relative}
.ticker-marquee{display:flex;width:max-content;animation:ticker-scroll 32s linear infinite}
.ticker-viewport:hover .ticker-marquee,.ticker-viewport:focus-within .ticker-marquee{animation-play-state:paused}
.ticker-track{display:flex;flex-shrink:0}
.ticker-item{display:inline-flex;align-items:center;gap:.5em;padding:.6em 1.2em;font-size:.85rem;font-weight:600;white-space:nowrap;border-right:1px solid rgba(255,255,255,.08)}
.ticker-item .sym{color:#aeb6c2;font-weight:700}
.ticker-item .up{color:var(--bull)}
.ticker-item .down{color:var(--bear)}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ===== HERO TELEMETRY ===== */
.hero-telemetry{position:relative;background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);overflow:hidden}
.hero-grid{display:grid;gap:2rem;align-items:center;grid-template-columns:1fr}
@media(min-width:780px){.hero-grid{grid-template-columns:1.1fr .9fr}}
.hero-telemetry h1{margin-bottom:.6rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.telemetry-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-md);padding:1.4rem}
.telemetry-row{display:flex;justify-content:space-between;align-items:center;padding:.7rem 0;border-bottom:1px solid var(--border)}
.telemetry-row:last-child{border-bottom:0}
.telemetry-row .lbl{color:var(--muted);font-size:.9rem}
.telemetry-row .val{font-weight:700;font-variant-numeric:tabular-nums}
.number-ticker{font-variant-numeric:tabular-nums}

/* STAT cards */
.stat-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr);margin-top:1.5rem}
@media(min-width:640px){.stat-grid{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem;text-align:center}
.stat .num{font-size:1.7rem;font-weight:800;color:var(--system);font-variant-numeric:tabular-nums}
.stat .cap{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}

/* ===== ANIMATED GRADIENT BORDER CTA ===== */
.gradient-border{position:relative;border-radius:var(--radius-sm);padding:2px;background:linear-gradient(120deg,var(--system),var(--bull),var(--system));background-size:200% 200%;animation:gb-move 4s ease infinite;display:inline-block}
.gradient-border .btn{margin:0}
@keyframes gb-move{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@media(prefers-reduced-motion:reduce){.gradient-border{animation:none}}

/* ===== WORKSPACE SPLIT ===== */
.workspace-split{display:grid;gap:1.5rem;grid-template-columns:1fr}
@media(min-width:780px){.workspace-split{grid-template-columns:1fr 1fr}}
.workspace-panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease}
.workspace-panel:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}

/* ===== PANELS / CARDS ===== */
.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-sm)}
.panel-hover{transition:transform .2s ease,box-shadow .2s ease}
.panel-hover:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.4rem}
.icon-card{text-align:center}
.icon-card .ico{width:48px;height:48px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--panel-2);color:var(--system);font-weight:800;margin:0 auto .8rem;font-size:1.2rem}

/* ===== TABS ===== */
.tab-list{display:flex;flex-wrap:wrap;gap:.4rem;border-bottom:1px solid var(--border);margin-bottom:1.5rem}
.tab-btn{background:none;border:0;padding:.7em 1.1em;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;border-radius:var(--radius-sm) var(--radius-sm) 0 0}
.tab-btn:hover{color:var(--text-light);background:var(--panel-2)}
.tab-btn.is-active{color:var(--system);border-bottom-color:var(--system)}
.tab-panel{display:none}
.tab-panel.is-active{display:block;animation:fade-in .3s ease}
@keyframes fade-in{from{opacity:0}to{opacity:1}}

/* ===== SEG CONTROL ===== */
.seg-control{display:inline-flex;background:var(--panel-2);border-radius:var(--radius-sm);padding:4px;gap:4px;margin-bottom:1.4rem}
.seg-btn{background:none;border:0;padding:.55em 1.2em;font-weight:600;color:var(--muted);border-radius:var(--radius-sm)}
.seg-btn.is-active{background:var(--panel);color:var(--text-light);box-shadow:var(--shadow-sm)}
.seg-panel{display:none}
.seg-panel.is-active{display:block}

/* ===== CHIPS / FILTERS ===== */
.chip-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.6rem}
.chip{background:var(--panel);border:1px solid var(--border);border-radius:999px;padding:.45em 1.1em;font-size:.9rem;font-weight:600;color:var(--muted);transition:all .15s ease}
.chip:hover{border-color:var(--system);color:var(--text-light)}
.chip.is-active{background:var(--system);border-color:var(--system);color:#fff}
.filter-item.is-hidden{display:none}

/* ===== COMPARISON MATRIX / TABLES ===== */
.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel)}
.matrix,.data-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:520px}
.matrix th,.matrix td,.data-table th,.data-table td{padding:.85em 1em;text-align:left;border-bottom:1px solid var(--border)}
.matrix thead th,.data-table thead th{background:var(--panel-2);font-weight:700;position:sticky;top:0}
.matrix tbody tr:hover,.data-table tbody tr:hover{background:var(--panel-2)}
.data-table th[data-sort]{cursor:pointer;user-select:none}
.data-table th[data-sort]::after{content:'\2195';margin-left:.4em;opacity:.4;font-size:.8em}
.data-table th.sort-asc::after{content:'\2191';opacity:1}
.data-table th.sort-desc::after{content:'\2193';opacity:1}
.sticky-col{position:sticky;left:0;background:var(--panel);z-index:1;font-weight:600}
.matrix .yes{color:var(--bull);font-weight:700}
.matrix .no{color:var(--bear);font-weight:700}
.cell-bull{color:var(--bull);font-weight:700}
.cell-bear{color:var(--bear);font-weight:700}

/* responsive stacked table */
@media(max-width:639px){
  .responsive-table thead{display:none}
  .responsive-table tr{display:block;border-bottom:2px solid var(--border)}
  .responsive-table td{display:flex;justify-content:space-between;border:0;border-bottom:1px solid var(--border)}
  .responsive-table td::before{content:attr(data-label);font-weight:700;color:var(--muted)}
}

/* ===== PLATFORM STRIP / MOCK FRAMES ===== */
.platform-strip{display:grid;gap:1rem;grid-template-columns:1fr;}
@media(min-width:640px){.platform-strip{grid-template-columns:repeat(3,1fr)}}
.mock-frame{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.mock-frame .frame-bar{display:flex;align-items:center;gap:6px;padding:.6em .9em;background:var(--panel-2);border-bottom:1px solid var(--border)}
.mock-frame .frame-bar i{width:10px;height:10px;border-radius:50%;background:var(--border);display:block}
.mock-frame .frame-bar i:nth-child(1){background:var(--bear)}
.mock-frame .frame-bar i:nth-child(2){background:#f5c518}
.mock-frame .frame-bar i:nth-child(3){background:var(--bull)}
.mock-frame .frame-body{padding:1.4rem;min-height:160px;display:flex;align-items:center;justify-content:center;color:var(--muted);background:repeating-linear-gradient(45deg,var(--panel),var(--panel) 12px,var(--panel-2) 12px,var(--panel-2) 24px)}
.zoomable{overflow:hidden}
.zoomable img,.zoomable .mock-frame{transition:transform .35s ease}
.zoomable:hover img,.zoomable:hover .mock-frame{transform:scale(1.04)}

/* ===== CAROUSEL ===== */
.carousel{position:relative}
.carousel-viewport{overflow:hidden;border-radius:var(--radius)}
.carousel-track{display:flex;transition:transform .4s ease}
.carousel-slide{min-width:100%;flex-shrink:0}
.carousel-nav{display:flex;justify-content:center;gap:.6rem;margin-top:1rem}
.carousel-dot{width:10px;height:10px;border-radius:50%;border:0;background:var(--border);padding:0}
.carousel-dot.is-active{background:var(--system)}
.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:var(--panel);border:1px solid var(--border);border-radius:50%;width:40px;height:40px;box-shadow:var(--shadow-sm);z-index:2}
.carousel-btn.prev{left:10px}
.carousel-btn.next{right:10px}

/* ===== ACCORDION (generic / faq / checklist) ===== */
.accordion-item,.faq-item,.checklist-item{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:.7rem;overflow:hidden}
.accordion-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:1.05em 1.2em;background:none;border:0;text-align:left;font-weight:600;color:var(--text-light);gap:1rem}
.accordion-trigger:hover{background:var(--panel-2)}
.accordion-trigger::after{content:'+';font-size:1.4rem;font-weight:400;color:var(--system);transition:transform .25s ease;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}
.accordion-body>*,.faq-body>*,.checklist-body>*{padding:0 1.2em}
.accordion-body>*:first-child,.faq-body>*:first-child,.checklist-body>*:first-child{padding-top:.2em}
.accordion-body>*:last-child,.faq-body>*:last-child,.checklist-body>*:last-child{padding-bottom:1.1em}

/* checklist strike */
.checklist-item .check-state{display:inline-flex;align-items:center;gap:.5em}
.checklist-item.checked .check-label{text-decoration:line-through;color:var(--muted)}
.check-mark{width:20px;height:20px;border:2px solid var(--border);border-radius:4px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.checklist-item.checked .check-mark,.check-mark.checked{background:var(--bull);border-color:var(--bull);color:#fff}

/* interactive checklist row */
.icheck{display:flex;align-items:center;gap:.7em;padding:.8em 1em;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:.6rem;cursor:pointer}
.icheck .box{width:22px;height:22px;border:2px solid var(--border);border-radius:5px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:#fff}
.icheck.done .box{background:var(--bull);border-color:var(--bull)}
.icheck.done span{text-decoration:line-through;color:var(--muted)}

/* ===== EXPAND CARDS / ROW EXPAND ===== */
.expand-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:.8rem;overflow:hidden}
.expand-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:1.1em 1.3em;background:none;border:0;text-align:left;font-weight:600;gap:1rem}
.expand-trigger::after{content:'\25BC';font-size:.7rem;color:var(--system);transition:transform .25s ease}
.expand-card.open .expand-trigger::after{transform:rotate(180deg)}
.expand-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
.expand-card.open .expand-body{max-height:600px}
.expand-body .inner{padding:0 1.3em 1.2em}

/* table row expand */
tr.detail-row{display:none}
tr.detail-row.open{display:table-row}
tr.detail-row td{background:var(--panel-2)}
tr.expandable-row{cursor:pointer}

/* ===== STEPS / CORRIDOR / RAIL ===== */
.steps{display:grid;gap:1rem;counter-reset:step}
.step{position:relative;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.3rem 1.3rem 1.3rem 3.6rem;counter-increment:step}
.step::before{content:counter(step);position:absolute;left:1.1rem;top:1.2rem;width:34px;height:34px;border-radius:50%;background:var(--system);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center}
.step h3{margin-bottom:.3rem;font-size:1.1rem}
.step.is-active{border-color:var(--system);box-shadow:0 0 0 3px rgba(59,130,246,.15)}

.step-corridor{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:640px){.step-corridor{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.corridor-rail{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.4rem}
.rail-dot{display:flex;align-items:center;gap:.5em;padding:.5em 1em;border:1px solid var(--border);border-radius:999px;background:var(--panel);font-weight:600;font-size:.9rem;color:var(--muted)}
.rail-dot.is-active{background:var(--system);border-color:var(--system);color:#fff}

/* ===== TIMELINE (scroll snap / spy) ===== */
.timeline{position:relative;padding-left:1.6rem}
.timeline::before{content:'';position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--border)}
.timeline-item{position:relative;padding-bottom:1.8rem}
.timeline-item::before{content:'';position:absolute;left:-1.6rem;top:4px;width:14px;height:14px;border-radius:50%;background:var(--panel);border:3px solid var(--border);transition:border-color .3s ease}
.timeline-item.is-active::before{border-color:var(--system)}
.timeline-snap{display:flex;gap:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem}
.timeline-snap>*{scroll-snap-align:start;min-width:min(80vw,300px)}

/* ===== VALUES GRID ===== */
.values-grid{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:640px){.values-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:780px){.values-grid{grid-template-columns:repeat(3,1fr)}}

/* ===== PARALLAX BAND / RISK BAND ===== */
.parallax-band{position:relative;background:var(--text-light);color:#f4f6f9;padding:clamp(50px,8vw,90px) 0;overflow:hidden}
.parallax-band *{color:inherit}
.parallax-band .bg-layer{position:absolute;inset:-20% 0;background:radial-gradient(circle at 30% 30%,rgba(59,130,246,.25),transparent 60%),radial-gradient(circle at 70% 70%,rgba(0,197,130,.18),transparent 60%);will-change:transform}
.risk-band{background:var(--text-light);color:#f4f6f9;padding:clamp(30px,5vw,50px) 0}
.risk-band *{color:inherit}
.risk-band .risk-inner{display:flex;gap:1rem;align-items:flex-start;background:rgba(255,74,90,.12);border:1px solid rgba(255,74,90,.35);border-radius:var(--radius);padding:1.4rem}
.risk-band .risk-inner .badge{flex-shrink:0;font-weight:800;color:var(--bear)}

/* ===== DUAL CTA ===== */
.dual-cta{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:640px){.dual-cta{grid-template-columns:1fr 1fr}}
.cta-block{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;text-align:center}
.cta-block.primary-block{background:linear-gradient(135deg,var(--system),#2f6fd6);color:#fff;border:0}
.cta-block.primary-block *{color:#fff}
.cta-emphasis{animation:cta-pulse 2.4s ease infinite}
@keyframes cta-pulse{0%,100%{box-shadow:0 0 0 0 rgba(59,130,246,.4)}50%{box-shadow:0 0 0 12px rgba(59,130,246,0)}}
@media(prefers-reduced-motion:reduce){.cta-emphasis{animation:none}}

/* ===== TOOLTIP ===== */
.tooltip{position:relative;border-bottom:1px dotted var(--system);cursor:help}
.tooltip .tip-bubble{position:absolute;bottom:130%;left:50%;transform:translateX(-50%) translateY(6px);background:var(--text-light);color:#f4f6f9;padding:.5em .8em;border-radius:var(--radius-sm);font-size:.82rem;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s ease;z-index:30;box-shadow:var(--shadow-md);max-width:240px;white-space:normal;width:max-content}
.tooltip .tip-bubble *{color:#f4f6f9}
.tooltip:hover .tip-bubble,.tooltip:focus-within .tip-bubble,.tooltip.is-open .tip-bubble{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}

/* ===== TOC / SCROLL SPY ===== */
.toc-layout{display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:780px){.toc-layout{grid-template-columns:240px 1fr}}
.toc{position:sticky;top:calc(var(--header-h) + 16px);align-self:start;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem}
.toc ul{list-style:none;margin:0;padding:0}
.toc li{margin-bottom:.3rem}
.toc a{display:block;padding:.4em .6em;border-radius:var(--radius-sm);color:var(--muted);font-size:.9rem;border-left:2px solid transparent}
.toc a:hover{background:var(--panel-2);text-decoration:none}
.toc a.is-active{color:var(--system);border-left-color:var(--system);background:var(--panel-2);font-weight:600}
.legal-section{scroll-margin-top:calc(var(--header-h) + 20px);margin-bottom:2rem}

/* ===== TIER CARDS / LADDER ===== */
.tier-grid{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:640px){.tier-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:780px){.tier-grid{grid-template-columns:repeat(3,1fr)}}
.tier-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem;transition:transform .2s ease,box-shadow .2s ease}
.tier-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.tier-card.featured{border-color:var(--system);box-shadow:0 0 0 2px rgba(59,130,246,.2)}
.tier-card .tier-name{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--system);font-weight:700}
.tier-card .tier-val{font-size:2rem;font-weight:800;margin:.3rem 0}
.ladder{display:grid;gap:.8rem}
.ladder-rung{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.2rem}
.ladder-bar{height:8px;border-radius:999px;background:var(--panel-2);overflow:hidden}
.ladder-bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--system),var(--bull));width:0;transition:width 1s ease}

/* ===== MARQUEE SLOW (testimonials) ===== */
.marquee-slow .ticker-marquee{animation-duration:42s}
.quote-item{min-width:min(80vw,360px);background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.3rem;margin-right:1rem;flex-shrink:0}

/* ===== SEARCH ===== */
.search-box{display:flex;gap:.6rem;max-width:520px}
.search-box input{flex:1;padding:.8em 1em;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:1rem;background:var(--panel);color:var(--text-light)}
.search-box input:focus{outline:2px solid var(--system);outline-offset:1px}
.faq-item.is-hidden{display:none}
.expand-all-btn{margin-bottom:1rem}

/* ===== FLIP CARD (promo) ===== */
.flip-card{perspective:1000px;max-width:380px;margin:0 auto}
.flip-inner{position:relative;transition:transform .6s ease;transform-style:preserve-3d;min-height:200px}
.flip-card.flipped .flip-inner{transform:rotateY(180deg)}
.flip-face{position:absolute;inset:0;backface-visibility:hidden;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.8rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.flip-face.back{transform:rotateY(180deg);background:linear-gradient(135deg,var(--system),var(--bull));color:#fff}
.flip-face.back *{color:#fff}
@media(prefers-reduced-motion:reduce){.flip-inner{transition:none}}

/* ===== NOTICE SHAKE / EXPAND NOTICE ===== */
.notice{background:rgba(255,74,90,.08);border:1px solid rgba(255,74,90,.35);border-radius:var(--radius);padding:1.2rem;display:flex;gap:.8rem;align-items:flex-start}
.notice .ico{color:var(--bear);font-weight:800;flex-shrink:0}
.notice.shake{animation:nudge 6s ease infinite}
@keyframes nudge{0%,90%,100%{transform:translateX(0)}92%{transform:translateX(-4px)}94%{transform:translateX(4px)}96%{transform:translateX(-3px)}98%{transform:translateX(3px)}}
@media(prefers-reduced-motion:reduce){.notice.shake{animation:none}}
.expand-notice .notice-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
.expand-notice.open .notice-body{max-height:300px}

/* ===== STICKY MOBILE CTA ===== */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;background:var(--panel);border-top:1px solid var(--border);padding:.8rem var(--space);box-shadow:0 -4px 20px rgba(20,24,32,.12);z-index:800;transform:translateY(100%);transition:transform .3s ease}
.sticky-cta.is-visible{transform:translateY(0)}
.sticky-cta .btn{width:100%}
@media(min-width:780px){.sticky-cta{display:none}}

/* ===== INFO CARDS / MAP ===== */
.info-cards{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:640px){.info-cards{grid-template-columns:repeat(3,1fr)}}
.info-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;transition:transform .2s ease,box-shadow .2s ease}
.info-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.static-map{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius);min-height:220px;display:flex;align-items:center;justify-content:center;color:var(--muted);background-image:linear-gradient(0deg,var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:32px 32px}
.copy-ref{display:inline-flex;align-items:center;gap:.6em;background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.5em .8em;font-family:monospace;font-size:.9rem}
.copy-btn{background:var(--system);color:#fff;border:0;border-radius:var(--radius-sm);padding:.4em .8em;font-size:.82rem;font-weight:600}
.copy-btn.copied{background:var(--bull)}

/* collapse generic */
.collapse-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
.collapse.open .collapse-body{max-height:400px}
.collapse-trigger{display:inline-flex;align-items:center;gap:.5em;background:none;border:0;color:var(--system);font-weight:600;padding:0}

/* ===== MODAL ===== */
.modal-overlay{position:fixed;inset:0;background:rgba(20,24,32,.55);display:flex;align-items:center;justify-content:center;padding:1.5rem;opacity:0;visibility:hidden;transition:opacity .25s ease;z-index:1000}
.modal-overlay.is-open{opacity:1;visibility:visible}
.modal-box{background:var(--panel);border-radius:var(--radius);max-width:480px;width:100%;padding:2rem;box-shadow:var(--shadow-lg);transform:translateY(12px);transition:transform .25s ease}
.modal-overlay.is-open .modal-box{transform:none}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:0;font-size:1.4rem;color:var(--muted)}

/* dismiss banner */
.notice-banner{background:var(--text-light);color:#f4f6f9;padding:.9rem var(--space)}
.notice-banner *{color:#f4f6f9}
.notice-banner.is-dismissed{display:none}
.notice-banner .inner{max-width:var(--maxw);margin:0 auto;display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:.9rem}
.notice-banner .dismiss{background:var(--system);color:#fff;border:0;border-radius:var(--radius-sm);padding:.4em 1em;font-weight:600}

/* badges */
.badge-pill{display:inline-block;padding:.3em .8em;border-radius:999px;font-size:.78rem;font-weight:700;background:var(--panel-2);color:var(--system)}
.badge-updated{background:rgba(0,197,130,.12);color:var(--bull)}
.risk-badge{display:inline-block;padding:.3em .8em;border-radius:999px;background:rgba(255,74,90,.12);color:var(--bear);font-weight:700;font-size:.78rem;animation:badge-pulse 2s ease infinite}
@keyframes badge-pulse{0%,100%{opacity:1}50%{opacity:.6}}
@media(prefers-reduced-motion:reduce){.risk-badge{animation:none}}

/* capability/method grid */
.cap-grid,.method-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
@media(min-width:640px){.cap-grid,.method-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:780px){.cap-grid,.method-grid{grid-template-columns:repeat(4,1fr)}}

/* feature bullets */
.feature-list{list-style:none;padding:0;display:grid;gap:.8rem}
.feature-list li{display:flex;gap:.7em;align-items:flex-start;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.9em 1.1em}
.feature-list li::before{content:'\2713';color:var(--bull);font-weight:800;flex-shrink:0}

/* print */
@media print{.site-header,.site-footer,#main-nav,#hamburger-btn,.sticky-cta,#scroll-progress,.notice-banner{display:none!important}body{background:#fff}.toc{position:static}}

/* utility */
.mt-2{margin-top:1rem}.mt-3{margin-top:1.6rem}.mb-2{margin-bottom:1rem}.flex-center{display:flex;align-items:center;gap:.6rem}