/* ── IQ scale page ─────────────────────────────────────────────────────────
   Only the widgets live here. Headings and prose come from the `page` row and
   use the same inline spacing as the About and Privacy rows. */

.sc-curve { margin: var(--s6) 0 var(--s7); }
.sc-curve svg { display: block; width: 100%; height: auto; }
.sc-curve figcaption { margin-top: var(--s2); }

.sc-curve__band            { fill: var(--brand); }
.sc-curve__band--0         { fill-opacity: .55; }
.sc-curve__band--1         { fill-opacity: .38; }
.sc-curve__band--2         { fill-opacity: .24; }
.sc-curve__band--3         { fill-opacity: .12; }
.sc-curve__line            { fill: none; stroke: var(--brand); stroke-width: 2; }
.sc-curve__axis            { stroke: var(--line-strong); stroke-width: 1; }
.sc-curve__marker          { stroke: var(--signal); stroke-width: 2.5; stroke-dasharray: 5 4; }
.sc-curve__share,
.sc-curve__tick            { font-family: var(--font-body); text-anchor: middle; }
.sc-curve__share           { font-size: 13px; font-weight: 600; fill: var(--ink); }
.sc-curve__tick            { font-size: 13px; fill: var(--ink-3); }

.sc-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); margin-bottom: var(--s4); }
.sc-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); min-width: 460px; }
.sc-table th {
    text-align: left; padding: var(--s3) var(--s4);
    background: var(--surface-2); color: var(--ink); font-weight: 600;
    border-bottom: 1px solid var(--line);
}
.sc-table td { padding: var(--s3) var(--s4); border-bottom: 1px solid var(--line); color: var(--ink-2); }
.sc-table tr:last-child td { border-bottom: 0; }

.sc-calc { margin: var(--s4) 0 var(--s7); display: grid; gap: var(--s5); }
.sc-calc__form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--s4); }
.sc-field { display: grid; gap: var(--s2); min-width: 0; font-size: var(--fs-sm); color: var(--ink-2); }
.sc-field input,
.sc-field select {
    width: 100%; min-width: 0; min-height: 44px; padding: var(--s2) var(--s3);
    background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-sm);
}
.sc-field input { font-size: var(--fs-md); }
.sc-field input:focus-visible,
.sc-field select:focus-visible { outline: 2px solid var(--brand); outline-offset: 1px; }

.sc-calc__out p { margin: 0; color: var(--ink-2); }
.sc-calc__out p + p { margin-top: var(--s2); }
.sc-calc__pct { font-family: var(--font-display); }
.sc-calc__pct .num { font-size: var(--fs-2xl); font-weight: 600; color: var(--brand); }
.sc-calc__unit { font-size: var(--fs-md); color: var(--ink-2); }