/* Qualiq docs: sidebar + one topic at a time. Uses the shared brand tokens. */
:root{--docs-warm:var(--warn);--docs-warm-soft:var(--warn-soft);--docs-good-soft:var(--accent-soft)}
.docs-shell{display:grid;grid-template-columns:200px minmax(0,720px);gap:64px;padding-top:48px;padding-bottom:64px}
.docs-side{position:sticky;top:24px;align-self:start;font-size:var(--text-ui)}
.docs-menu summary{display:none}
.docs-menu p{margin:22px 0 8px;font-size:var(--text-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--muted)}
.docs-menu p:first-of-type{margin-top:0}
.docs-menu a{display:block;padding:6px 10px;margin-left:-10px;border:0;border-radius:var(--radius-sm);color:var(--ink-2)}
.docs-menu a:hover{color:var(--ink);background:var(--bg-2)}
.docs-menu a[aria-current="page"]{color:var(--ink);background:var(--bg-2);box-shadow:inset 2px 0 0 var(--accent)}
.docs-body{min-width:0;font-size:var(--text-body);line-height:1.8;color:var(--ink-2)}
.docs-body section+section{margin-top:72px;padding-top:40px;border-top:1px solid var(--rule)}
.js .docs-body section[hidden]{display:none}
.js .docs-body section+section{margin-top:0;padding-top:0;border-top:0}
.docs-body h1{font-size:var(--text-display);font-weight:400;letter-spacing:-1.5px;line-height:1.15;color:var(--ink);margin:6px 0 16px}
.docs-body h2{font-size:var(--text-h4);font-weight:400;color:var(--ink);margin:44px 0 14px}
.docs-body p{max-width:none}
.docs-body a{border-bottom-color:var(--rule-strong)}
.docs-body b{color:var(--ink);font-weight:500}
.docs-kicker{font-size:var(--text-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--accent);margin:0}
.docs-lead{font-size:var(--text-lead);line-height:1.75;color:var(--ink)}
.docs-note{font-size:var(--text-caption);color:var(--muted)}
.docs-status{margin-top:28px;padding:12px 14px;border:1px solid var(--rule);border-radius:var(--radius-md);font-size:var(--text-small);color:var(--ink-2)}

.product-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:28px 0 8px}
.product-card{display:grid;gap:8px;align-content:start;padding:18px;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--bg-2);font-size:var(--text-small);line-height:1.65;color:var(--ink-2)}
.product-card:hover{border-color:var(--rule-strong)}
.product-card b{font-size:var(--text-lead)}
.product-card small{margin-top:4px;font-size:var(--text-micro);color:var(--muted)}
.glyph{font-size:var(--text-h4);color:var(--accent)}
.glyph.down{color:var(--docs-warm)}

.now-later{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);border:1px solid var(--rule-strong);border-radius:var(--radius-lg);overflow:hidden}
.now-later>div{padding:20px 22px}
.now-later small{display:block;font-size:var(--text-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.now{background:var(--bg-2);display:grid;align-content:start}
.now strong{font-size:var(--text-h1);font-weight:400;color:var(--ink);line-height:1.2}
.now span{font-size:var(--text-small)}
.now em{font-style:normal;color:var(--accent);margin-top:10px}
.later p{display:flex;align-items:center;gap:10px;margin:0 0 10px;color:var(--ink)}
.later p.plus{margin:14px 0 0;color:var(--accent);font-size:var(--text-small)}
.pill{flex:none;border:1px solid var(--rule-strong);border-radius:var(--radius-pill);padding:2px 9px;font-size:var(--text-caption);color:var(--ink-2)}
.pill.hot{border-color:var(--docs-warm);color:var(--ink)}

.steps{list-style:none;counter-reset:step;padding:0;margin:26px 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.steps li{counter-increment:step;display:grid;gap:6px;align-content:start;padding:16px;border:1px solid var(--rule);border-radius:var(--radius-md);font-size:var(--text-small);line-height:1.65}
.steps li::before{content:counter(step);width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-size:var(--text-small)}
.steps b{font-size:var(--text-body)}

.facts{margin:18px 0;border-top:1px solid var(--rule)}
.facts>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:11px 0;border-bottom:1px solid var(--rule);font-size:var(--text-ui)}
.facts dt{color:var(--muted)}
.facts dd{margin:0;color:var(--ink)}

.example{padding:14px 16px;border-left:2px solid var(--accent);background:var(--bg-2);border-radius:0 8px 8px 0;color:var(--ink)}
.outcomes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0}
.outcomes.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.outcomes>div{display:grid;gap:4px;padding:15px 16px;border:1px solid var(--rule);border-radius:var(--radius-md)}
.outcomes>div.hot{border-color:var(--docs-warm)}
.outcomes small{font-size:var(--text-caption);color:var(--muted)}
.outcomes span{font-size:var(--text-small)}
.callout{margin:12px 0;padding:13px 16px;border-radius:var(--radius-md);font-size:var(--text-ui);line-height:1.7}
.callout b{display:block;margin-bottom:3px;font-size:var(--text-caption);letter-spacing:var(--tracking-label);text-transform:uppercase}
.callout.good{background:var(--docs-good-soft);border:1px solid var(--accent-line)}
.callout.good b{color:var(--accent)}
.callout.warn{background:var(--docs-warm-soft);border:1px solid var(--warn-line)}
.callout.warn b{color:var(--warn)}

.dchart{margin:20px 0 6px;min-height:120px;padding:14px;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--bg-2)}
.dchart svg{display:block;width:100%;height:auto;overflow:visible;font-family:var(--font-mono)}
.dchart text{fill:var(--muted);font-size:var(--text-caption)}
.dchart .t-ink{fill:var(--ink)}
.dchart .t-accent{fill:var(--accent)}
.dchart .t-warm{fill:var(--warn)}
.dchart .t-dark{fill:var(--accent-ink)}
.dchart .axis{stroke:var(--rule-strong);stroke-width:1}
.dchart .grid{stroke:var(--rule);stroke-width:1}
.dchart .target{stroke:var(--ink-2);stroke-width:1;stroke-dasharray:4 5}
.dchart .today{stroke:var(--rule-strong);stroke-width:1;stroke-dasharray:2 4}
.dchart .line{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.dchart .l-accent{stroke:var(--accent)}
.dchart .l-warm{stroke:var(--docs-warm)}
.dchart .l-muted{stroke:var(--muted);stroke-dasharray:5 5}
.dchart .dot-accent{fill:var(--accent)}
.dchart .dot-warm{fill:var(--docs-warm)}
.dchart .zone{fill:var(--docs-good-soft)}
.dchart .zone-warm{fill:var(--docs-warm-soft)}
.dchart .bar{fill:var(--accent);opacity:.35;cursor:pointer}
.dchart .bar.on{opacity:1}
.dchart .bar-warm{fill:var(--docs-warm);opacity:.35;cursor:pointer}
.dchart .bar-warm.on{opacity:1}
.dchart .seg-you{fill:var(--accent)}
.dchart .seg-fee{fill:var(--bg-3)}

.seg{display:inline-flex;border:1px solid var(--rule-strong);border-radius:var(--radius-md);overflow:hidden;margin-top:4px}
.seg button{padding:7px 14px;font-size:var(--text-small);color:var(--ink-2)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.ladder-read{min-height:1.8em;color:var(--ink)}
.formula{font-size:var(--text-lead);color:var(--ink);margin:10px 0}
.formula.small{font-size:var(--text-ui);color:var(--ink-2)}

.risks{list-style:none;padding:0;margin:20px 0;border-top:1px solid var(--rule)}
.risks li{padding:12px 0;border-bottom:1px solid var(--rule);font-size:var(--text-ui);color:var(--ink)}
.faq details{border-bottom:1px solid var(--rule);padding:14px 0}
.faq details:first-child{border-top:1px solid var(--rule)}
.faq summary{cursor:pointer;color:var(--ink);font-size:var(--text-body)}
.faq details p{margin:10px 0 0;font-size:var(--text-ui)}

.pager{display:flex;justify-content:space-between;gap:12px;margin-top:56px;padding-top:20px;border-top:1px solid var(--rule)}
.pager a{display:grid;gap:3px;padding:12px 16px;border:1px solid var(--rule);border-radius:var(--radius-md);font-size:var(--text-ui);color:var(--ink);max-width:48%}
.pager a:hover{border-color:var(--rule-strong)}
.pager a small{font-size:var(--text-micro);color:var(--muted)}
#pager-next{margin-left:auto;text-align:right}
.pager a[hidden]{display:none}

@media(max-width:900px){
  .docs-shell{grid-template-columns:minmax(0,1fr);gap:18px;padding-top:20px}
  .docs-side{position:static}
  .docs-menu{border:1px solid var(--rule);border-radius:var(--radius-md);padding:10px 14px}
  .docs-menu summary{display:block;cursor:pointer;color:var(--ink)}
  .docs-menu[open] summary{margin-bottom:12px}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .product-cards,.outcomes,.outcomes.three,.now-later{grid-template-columns:minmax(0,1fr)}
  .steps{grid-template-columns:minmax(0,1fr)}
  .facts>div{grid-template-columns:minmax(0,1fr);gap:2px}
  .docs-lead{font-size:var(--text-lead)}
}

.steps.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:700px){.steps.three{grid-template-columns:1fr}}
/* Oct 20, 2026: interactive strategy pages. */
.product-cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.tier-seg{margin:0 0 14px}
.close-slider{width:100%;margin:6px 0 4px;accent-color:var(--accent)}
.close-read{min-height:3.4em;color:var(--ink);font-size:var(--text-ui);line-height:1.7}
.close-read b{color:var(--docs-warm)}
.dchart .pick{stroke:var(--docs-warm);stroke-dasharray:3 4;stroke-width:1.2}
@media(max-width:900px){.product-cards.two{grid-template-columns:minmax(0,1fr)}}