/* Click Price Index pages (built by tools/build_data.py). Same tokens as the home page. */
:root{
  --black:#111111; --green:#1E3A27; --blue:#0052CC; --chalk:#F4F4F2; --white:#ffffff; --line:#D2D6CF; --ink-2:#2f3a33; --red:#e5372b;
  --cta:#FFB81C; --cta-hover:#FFCA4D; --cta-ink:#111111;
  --mono:'Roboto Mono',ui-monospace,monospace; --serif:'DM Serif Display',Georgia,serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--chalk);color:var(--black);font:15px/1.7 var(--mono);-webkit-font-smoothing:antialiased}
a{color:inherit}
button,input{font:inherit}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.skip{position:absolute;top:-100px;left:1rem;background:#fff;padding:1rem;z-index:50}.skip:focus{top:1rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.container{width:min(1100px,calc(100% - 32px));margin:auto}
h1{font:400 clamp(30px,4vw,44px)/1.1 var(--serif);letter-spacing:-.02em;margin:0 0 16px}
h2{font:400 clamp(22px,2.6vw,30px)/1.15 var(--serif);margin:44px 0 14px}
.eyebrow{font-size:12px;color:var(--green);font-weight:700;text-transform:uppercase;letter-spacing:.12em;margin:8px 0 12px}
.crumbs{font-size:12px;color:var(--ink-2);margin:18px 0 0}.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}
.answer{font-size:17px;line-height:1.7;background:var(--white);border-left:4px solid var(--green);padding:16px 20px;margin:0 0 22px;max-width:820px}
.note{font-size:12px;color:#4a564d}
.links{line-height:2}
.links a{white-space:nowrap}

.cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--cta);color:var(--cta-ink);
  border:2px solid var(--black);font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;
  padding:14px 22px;min-height:52px;cursor:pointer;box-shadow:4px 4px 0 var(--black)}
.cta:hover{background:var(--cta-hover)}
.cta.small{min-height:38px;padding:8px 14px;font-size:11px;box-shadow:3px 3px 0 var(--black)}

.topbar{position:sticky;top:0;z-index:40;background:rgba(244,244,242,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.topbar-inner{min-height:60px;display:flex;align-items:center;gap:24px}
.logo{font-size:17px;font-weight:700;letter-spacing:-.04em;text-decoration:none;white-space:nowrap;line-height:1.15}
.tagline{display:block;font-size:10px;font-weight:600;letter-spacing:.04em;color:var(--green);margin-top:3px}
.nav{display:flex;gap:18px}
.nav a{white-space:nowrap;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;color:var(--ink-2)}
.nav a:hover{color:var(--black);text-decoration:underline;text-underline-offset:4px}
.spacer{flex:1}

.stats,.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0 0 8px}
.stat,.card{background:var(--white);border:1px solid var(--line);border-top:4px solid var(--black);padding:14px 16px;text-decoration:none;display:block}
.stat span,.card span{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.stat b,.card b{display:block;font:400 30px/1.2 var(--serif);color:var(--green);margin-top:6px}
.stat small,.card small{display:block;font-size:12px;color:var(--ink-2)}
.card:hover{border-top-color:var(--cta)}

.scroll{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;background:var(--white);font-size:14px}
.data th,.data td{border:1px solid var(--line);padding:9px 12px;text-align:left;white-space:nowrap}
.data thead th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;background:#e9ece6}
.data td:nth-child(n+2){font-variant-numeric:tabular-nums}

.calc,.bridge,.magnet{background:var(--white);border:2px solid var(--black);padding:22px;margin:36px 0}
.calc h2,.bridge h2,.magnet h2{margin-top:0}
.calc-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.calc label{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.calc input,.magnet input[type=email]{display:block;width:100%;min-height:44px;border:1.5px solid #8d988f;background:#fff;padding:8px 12px;font-size:15px;margin-top:4px;border-radius:0}
.calc-out{font-size:18px;margin:16px 0 4px}.calc-out strong{font:400 30px var(--serif);color:var(--green)}
.bridge{background:var(--green);color:#fff;border-color:var(--green)}
.bridge p{color:#dce9df;max-width:760px}
.bridge .cta{border-color:var(--cta);box-shadow:none}
.magnet-form{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.magnet-form input[type=email]{flex:1 1 260px;margin:0}
.form-status{flex-basis:100%;font-size:13px;margin:0;min-height:1.2em}
.magnet.is-done{background:#e8f3eb;border-color:var(--green)}

details{background:var(--white);border:1px solid var(--line);padding:12px 16px;margin:8px 0}
summary{font-weight:700;cursor:pointer}
details p{margin:10px 0 0}
.prose{max-width:820px}.prose li{margin:6px 0}

footer{background:#0a0a0a;color:#c9cdc9;font-size:12px;padding:28px 0 60px;margin-top:60px}
.foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;line-height:2}
footer a{text-decoration:none}footer a:hover{color:var(--cta)}

@media (max-width:1020px){.nav{display:none}}
@media (max-width:860px){.calc-fields{grid-template-columns:1fr}.answer{font-size:16px}}
@media (max-width:520px){.tagline{display:none}.stat b,.card b{font-size:26px}}
