:root{--navy:#14285A;--navy2:#22397a;--sun:#F9A825;--sun-d:#C25E00;--cream:#FFF8EC;--cream2:#FFF1D0;--ink:#1d2433;--muted:#4a5468;--card:#fff;--r:22px;--shadow:0 2px 6px rgba(20,40,90,.06),0 12px 30px rgba(20,40,90,.10);
--sans:"Atkinson Hyperlegible",Verdana,Arial,sans-serif;--serif:"Fraunces",Georgia,"Times New Roman",serif}
*{box-sizing:border-box}
html{font-size:20px;scroll-behavior:smooth}html.big{font-size:26px}
body{margin:0;font-family:var(--sans);line-height:1.65;color:var(--ink);background:var(--cream)}
h1,h2,h3{font-family:var(--serif);color:var(--navy);line-height:1.2;letter-spacing:-.01em}
h1{font-size:clamp(2rem,4.5vw,2.9rem);margin:.2em 0 .4em}h2{font-size:1.7rem}h3{font-size:1.25rem}
img,svg{max-width:100%}
.wrap{max-width:60rem;margin:0 auto;padding:0 1.2rem}
a{color:var(--navy);text-underline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible{outline:4px solid var(--sun);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.6rem 1rem;z-index:10}
.center{text-align:center}.sub{color:var(--muted);font-size:1.05rem;max-width:36rem;margin:0 auto 2rem}
/* header */
header.site{background:rgba(255,253,248,.96);position:sticky;top:0;z-index:5;box-shadow:0 2px 14px rgba(20,40,90,.08)}
header.site .wrap{display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;align-items:center;justify-content:space-between;padding:.5rem 1.2rem}
.logo{line-height:0}.logo img{height:72px;width:auto;display:block}
nav{display:flex;flex-wrap:wrap;gap:.2rem}
nav a{font-weight:700;text-decoration:none;padding:.45rem .8rem;border-radius:999px}
nav a:hover{background:var(--cream2)}
/* buttons */
.btn,.toggle,button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:.7rem 1.5rem;font:700 1rem var(--sans);border-radius:999px;border:3px solid var(--navy);background:var(--navy);color:#fff;text-decoration:none;cursor:pointer;margin:.3rem .2rem .3rem 0;transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover,button:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(20,40,90,.25)}
.btn.sun{background:var(--sun);border-color:var(--sun);color:var(--navy)}
.btn.alt,.toggle{background:#fff;color:var(--navy)}
.toggle{min-height:48px;padding:.5rem 1.1rem;font-size:.9rem}
.btn.small{font-size:.92rem;min-height:48px;padding:.5rem 1.2rem}
/* hero */
.hero{position:relative;background:radial-gradient(ellipse at 80% 70%,#FFE29A 0,rgba(255,226,154,0) 55%),linear-gradient(180deg,#FFF3DA 0%,#FFE2B0 60%,#FFD58A 100%);padding:3.5rem 0 5rem;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center}
.hero .lead{font-size:1.2rem;color:#2c3446;max-width:32rem}
.hero .btn:first-of-type{background:var(--navy)}
.hero-art{width:100%;height:auto;filter:drop-shadow(0 18px 30px rgba(20,40,90,.18))}
.eyebrow{display:inline-block;font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--sun-d);background:rgba(255,255,255,.75);padding:.25rem .8rem;border-radius:999px;margin:0}
.lead{font-size:1.15rem}
.wave-bottom,.wave-top{position:absolute;left:0;right:0;line-height:0;color:var(--cream)}
.wave-bottom{bottom:-1px}.wave-top{top:-1px;transform:rotate(180deg);color:var(--cream)}
.wave{width:100%;height:60px;display:block}
/* cards */
section.wrap{padding-top:2.5rem;padding-bottom:1.5rem}
.cards{list-style:none;padding:0;display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fill,minmax(16.5rem,1fr))}
.card{background:var(--card);border-radius:var(--r);padding:1.5rem;box-shadow:var(--shadow);display:flex;flex-direction:column;border:1px solid #f0e4cc;transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-6px);box-shadow:0 4px 10px rgba(20,40,90,.08),0 22px 40px rgba(20,40,90,.16)}
.card-icon{width:84px;height:84px;border-radius:24px;background:linear-gradient(135deg,#FFF1D0,#FFE0A3);display:grid;place-items:center;margin-bottom:.8rem}
.card-icon svg{width:56px;height:56px}
.card h3{margin:.2rem 0 .4rem}.card h3 a{text-decoration:none}.card h3 a:hover{text-decoration:underline}
.card p{color:var(--muted);flex:1}.card .btn{align-self:flex-start}
/* how */
.how{padding:3rem 0 2rem}
.how-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;counter-reset:s}
.how-steps li{background:#fff;border-radius:var(--r);padding:1.6rem;box-shadow:var(--shadow);text-align:center}
.num{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--sun);color:var(--navy);font:700 1.6rem var(--serif);box-shadow:0 0 0 8px #FFF1D0}
.how-steps h3{margin:.9rem 0 .3rem}.how-steps p{color:var(--muted);margin:0}
/* quotes */
.quotes{padding:2rem 0 4.5rem}
.badge{display:inline-block;background:var(--navy);color:#fff;font-weight:700;font-size:.8rem;padding:.15rem .7rem;border-radius:999px;margin-right:.3rem}
.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.quote{margin:0;background:var(--cream2);border-radius:var(--r);padding:1.5rem;position:relative}
.quote blockquote{margin:0;font-family:var(--serif);font-size:1.15rem;color:var(--navy);line-height:1.45}
.quote figcaption{margin-top:.8rem;color:var(--muted);font-weight:700;font-size:.9rem}
/* newsletter */
.news{position:relative;background:linear-gradient(135deg,#14285A 0%,#22397a 70%,#2d4a94 100%);color:#fff;padding:5.5rem 0 3.5rem;margin-top:2rem}
.news .wave-top{color:var(--cream)}
.news-inner{display:grid;grid-template-columns:auto 1fr 1.1fr;gap:1.6rem;align-items:center}
.env{width:96px;height:96px}
.news h2{color:#fff;margin:0 0 .3rem}.news p{margin:.2rem 0;color:#e7ebf5}
.news form{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:var(--r);padding:1.2rem}
.news label{display:block;font-weight:700;margin-bottom:.3rem}
.news input{width:100%;min-height:54px;font:1rem var(--sans);padding:.6rem 1rem;border-radius:14px;border:3px solid transparent}
.news button{background:var(--sun);border-color:var(--sun);color:var(--navy);margin-top:.7rem;width:100%}
#nlmsg{font-weight:700;color:#FFE29A}
/* footer */
footer.site{background:#0d1c42;color:#dfe5f2;padding:2.5rem 0}
.foot{display:flex;gap:1.4rem;align-items:flex-start}.foot-logo{width:64px;height:64px;background:#fff;border-radius:18px;padding:6px}
footer.site a{color:#FFD27A}footer.site p{margin:.3rem 0}footer.site strong{color:#fff}
/* guide pages */
.guide-hero{position:relative;background:linear-gradient(180deg,#FFF3DA,#FFDDA0);padding:2rem 0 4.5rem}
.gh-row{display:flex;gap:1.6rem;align-items:center}
.gh-icon{flex:none;width:130px;height:130px;border-radius:34px;background:#fff;display:grid;place-items:center;box-shadow:var(--shadow)}
.gh-icon svg{width:88px;height:88px}
.guide-hero h1{margin:.3rem 0}.guide-hero .lead{margin:0;color:#2c3446}
.crumb{margin:0 0 1rem}.crumb a{font-weight:700;text-decoration:none;background:#fff;padding:.35rem .9rem;border-radius:999px;box-shadow:0 2px 8px rgba(20,40,90,.1)}
.prose{max-width:46rem;padding-top:1rem;padding-bottom:1rem}
.prose h2{margin-top:2.2rem;padding-bottom:.3rem;border-bottom:3px solid var(--cream2)}
.steps{list-style:none;padding:0;counter-reset:st;margin:1rem 0}
.steps li{counter-increment:st;position:relative;padding:1rem 1.2rem 1rem 4.4rem;margin:.8rem 0;background:#fff;border-radius:18px;box-shadow:0 2px 10px rgba(20,40,90,.07);min-height:3.6rem}
.steps li::before{content:counter(st);position:absolute;left:1rem;top:.85rem;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--navy);color:#fff;font:700 1.1rem/2.4rem var(--serif);text-align:center}
.inline-tip{display:inline-block;background:var(--sun);color:var(--navy);font-weight:700;font-size:.8rem;padding:.05rem .6rem;border-radius:999px;margin-right:.3rem}
.tip,.warn{display:flex;gap:1rem;background:#FFF4D6;border-left:8px solid var(--sun);border-radius:18px;padding:1.2rem 1.4rem;margin:2rem 0}
.warn{background:#FDE8E4;border-color:#C0392B}
.tip h2,.warn h2{margin:0 0 .3rem;border:0;font-size:1.3rem}.tip p{margin:0}
.callout-ic{font-size:1.8rem;line-height:1}
.updated{color:var(--muted);font-size:.9rem}
@media (max-width:800px){.hero-grid,.news-inner{grid-template-columns:1fr}.hero-art{max-width:300px;margin:0 auto}.how-steps,.quote-grid{grid-template-columns:1fr}.gh-row{flex-direction:column;align-items:flex-start}.gh-icon{width:96px;height:96px}.gh-icon svg{width:64px;height:64px}.logo img{height:56px}.env{width:72px;height:72px}.hero{padding-top:2rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}.card:hover,.btn:hover,button:hover{transform:none}}
.card.more{background:linear-gradient(160deg,#FFF1D0,#FFD98C);border-color:#f5d48a}.card.more .card-icon{background:#fff;font-size:2.4rem}.card.more p{color:#3b4356}
