*{box-sizing:border-box}
:root{color-scheme:light;--ink:#14243b;--muted:#465467;--line:#e3e7ed;--canvas:#f5f6f8}
body{margin:0;background:white;color:var(--ink);font:1rem/1.65 Inter,system-ui,sans-serif}
a{color:#244e76;text-underline-offset:.18em}
a:focus-visible{outline:3px solid #326892;outline-offset:5px}
.skip{position:absolute;left:1rem;top:-6rem;background:white;padding:.5rem;z-index:2}.skip:focus{top:1rem}
nav,.footer-inner{max-width:75rem;margin:auto;padding:.8rem clamp(1.1rem,4vw,2.6rem);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
nav a{text-decoration:none;font-weight:650;color:var(--ink)}nav a:hover{text-decoration:underline}
.brand{letter-spacing:-.035em;font-weight:750}
.hero{background:radial-gradient(ellipse at 76% 0%,#e3ebf5,transparent 64%),var(--canvas);border-block:1px solid var(--line);padding:clamp(3rem,8vw,7rem) 1.15rem;text-align:center}
.hero-inner{max-width:59rem;margin:auto}.hero h1{font-size:clamp(2.4rem,6.2vw,5rem);line-height:1.045;letter-spacing:-.064em;margin:0 auto;text-wrap:balance;font-weight:750}
.hero p{max-width:43rem;margin:1.5rem auto 0;color:var(--muted);font-size:clamp(1.08rem,2.15vw,1.3rem);line-height:1.55}
.hero .cta{margin-top:1.6rem}
.cta{display:inline-flex;align-items:center;justify-content:center;min-height:46px;border-radius:100px;padding:.72rem 1.25rem;background:#152b46;color:white;text-decoration:none;font-weight:670}
.cta:hover{background:#24486d}
.reading{max-width:51rem;padding:clamp(2rem,5vw,4.5rem) 1.15rem;margin:auto;display:grid;gap:1.2rem}
.panel{border:1px solid var(--line);border-radius:1.45rem;padding:clamp(1.25rem,4vw,2.5rem);box-shadow:0 10px 30px #14243b06}
.panel h2,.panel h3,.next h2{line-height:1.12;letter-spacing:-.038em;margin:0 0 .8rem}
.panel h2,.next h2{font-size:clamp(1.5rem,3.4vw,2.1rem)}.panel h3{font-size:1.28rem;margin-top:1.6rem}
.panel p,.panel li{color:var(--muted)}.panel p:last-child{margin-bottom:0}.panel ul{padding-left:1.2em}.panel li+li{margin-top:.55rem}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}th,td{border-bottom:1px solid var(--line);padding:.62rem .4rem;text-align:left}th:last-child,td:last-child{text-align:right}
.next{background:#eef3f9;padding:clamp(1.35rem,4vw,2.5rem);border-radius:1.45rem}.next p{margin:.4rem 0 1rem;color:var(--muted)}
.disclaimer{color:var(--muted);font-size:.875rem;margin:.1rem 0}
footer{background:var(--canvas);border-top:1px solid var(--line);font-size:.9rem;color:var(--muted)}
@media(max-width:450px){nav{gap:.45rem;font-size:.87rem}.hero h1{letter-spacing:-.055em}.hero{text-align:left}.panel{border-radius:1.15rem}table{font-size:.87rem}}

.article-photo{width:min(66rem,calc(100% - 2.3rem));margin:clamp(1.2rem,4vw,2.6rem) auto 0;overflow:hidden;border-radius:clamp(1rem,3vw,1.65rem);background:#e7eaf0}
.article-photo img{display:block;width:100%;height:clamp(16rem,40vw,29rem);object-fit:cover;object-position:50% 53%}
@media(max-width:450px){.article-photo img{height:15rem}}

.hero{background:radial-gradient(ellipse at 74% 5%,#d7e5f2,transparent 65%),#f2f5f9}
.reading{counter-reset:article-step}
.panel[data-step]{counter-increment:article-step;position:relative;padding-left:clamp(4.2rem,8vw,6rem)}
.panel[data-step]::before{content:counter(article-step,decimal-leading-zero);position:absolute;left:clamp(1.1rem,3vw,2rem);top:clamp(1.2rem,4vw,2.5rem);display:grid;place-items:center;width:2.55rem;height:2.55rem;border-radius:50%;background:#e8f0f8;color:#1e4164;font-weight:750;font-variant-numeric:tabular-nums}
.feature{background:#172c46;color:white;border-radius:1.5rem;padding:clamp(1.3rem,4vw,2.4rem)}
.feature h2{margin:0 0 1rem;line-height:1.13;letter-spacing:-.035em;font-size:clamp(1.45rem,4vw,2rem)}
.feature ul{margin:0;padding:0;list-style:none;display:grid;gap:.55rem}
.feature li{padding:.75rem .95rem;border-radius:.75rem;background:#ffffff12;overflow-wrap:anywhere}
.checklist li::before{content:'✓';margin-right:.65rem;color:#b9d7f4;font-weight:750}
.budget li:last-child{background:#dceafa;color:#14243b;font-weight:750}
.panel table tr:last-child{background:#e8f0f8;font-weight:750}
@media(max-width:450px){.panel[data-step]{padding-left:1.25rem}.panel[data-step]::before{position:static;margin-bottom:.75rem}}
