
:root{--bg:#f4f7f6;--ink:#10242b;--mut:#4d6169;--line:#d3dfdd;--teal:#0b6e7d;--teal2:#064a55;--hot:#e4571a;--card:#fff;--ice:#dff1f1}
@media(prefers-color-scheme:dark){:root{--bg:#0d1a1f;--ink:#e6f1f0;--mut:#9db4b8;--line:#223840;--teal:#4cc3d1;--teal2:#0f2a31;--hot:#ff7a3d;--card:#13262c;--ice:#12303a}}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;font:17px/1.65 "Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);padding-bottom:4.2rem}
h1,h2,h3{font-family:"Bricolage Grotesque","Figtree",system-ui,sans-serif;line-height:1.15;margin:0 0 .6em;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,6vw,3.7rem);font-weight:800}h2{font-size:clamp(1.6rem,3.6vw,2.3rem)}h3{font-size:1.2rem}
a{color:var(--teal)}p{margin:0 0 1em;max-width:68ch}
.wrap{max-width:1120px;margin:0 auto;padding:0 1.2rem}
.top{background:var(--hot);color:#fff;font-size:.92rem;text-align:center;padding:.45rem 1rem}.top a{color:#fff;font-weight:700;margin:0 .4rem}
header.nav{position:sticky;top:0;z-index:20;background:var(--card);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:4rem}
.logo{font:800 1.2rem "Bricolage Grotesque",system-ui,sans-serif;color:var(--ink);text-decoration:none}.logo b{color:var(--teal)}
.nav nav{display:flex;gap:1.3rem}.nav nav a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.95rem}.nav nav a:hover{color:var(--teal)}
.btn{display:inline-block;padding:.8rem 1.3rem;border-radius:.6rem;font-weight:700;text-decoration:none;border:2px solid transparent;transition:transform .15s}
.btn:hover{transform:translateY(-2px)}.btn.hot{background:var(--hot);color:#fff}.btn.line{border-color:var(--teal);color:var(--teal)}.btn.wa{background:#1f9d55;color:#fff}
.hero{background:var(--teal2);color:#e9f6f6;padding:4rem 0 4.5rem;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;right:-6rem;top:-6rem;width:26rem;height:26rem;border-radius:50%;border:2.5rem solid rgba(255,255,255,.06)}
.hero:after{content:"";position:absolute;right:3rem;bottom:-9rem;width:22rem;height:22rem;border-radius:50%;border:1.5rem solid rgba(255,255,255,.05)}
.hero h1{color:#fff;max-width:16ch}.hero p{font-size:1.15rem;color:#c5e3e5}.hero .wrap{position:relative;z-index:1}
.cta{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.6rem 0 1rem}.ticks{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;color:#c5e3e5;font-weight:600}
section{padding:3.6rem 0}section.alt{background:var(--card);border-block:1px solid var(--line)}
.grid{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:.9rem;padding:1.4rem}.alt .card{background:var(--bg)}
.card .ic{font-size:1.8rem}.card ul{padding-left:1.1rem;margin:.6rem 0 1rem;color:var(--mut)}.card h3 a{color:var(--ink);text-decoration:none}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}.chips a{padding:.35rem .8rem;border:1px solid var(--line);border-radius:2rem;text-decoration:none;color:var(--ink);background:var(--card);font-size:.93rem}.chips a:hover{border-color:var(--teal);color:var(--teal)}
.steps{counter-reset:s;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.steps div{counter-increment:s;border-left:3px solid var(--teal);padding-left:1rem}.steps div:before{content:counter(s);font:800 1.8rem "Bricolage Grotesque",sans-serif;color:var(--teal)}
details{background:var(--card);border:1px solid var(--line);border-radius:.7rem;padding:.9rem 1.2rem;margin-bottom:.7rem}summary{cursor:pointer;font-weight:700}details p{margin:.7rem 0 0}
form{display:grid;gap:.8rem;max-width:560px}input,select,textarea{font:inherit;padding:.75rem;border-radius:.5rem;border:1px solid var(--line);background:var(--card);color:var(--ink);width:100%}
.crumb{font-size:.9rem;color:var(--mut);padding:1rem 0 0}.crumb a{color:var(--mut)}
.pagehead{padding:2.6rem 0 2rem;background:var(--ice)}.pagehead h1{font-size:clamp(1.9rem,4.6vw,2.9rem)}
footer{background:var(--teal2);color:#b5d3d6;padding:3rem 0 2rem;font-size:.95rem}footer a{color:#fff;text-decoration:none}footer h4{color:#fff;margin:0 0 .6rem}footer .cols{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}footer ul{list-style:none;padding:0;margin:0;line-height:2}
.small{font-size:.82rem;opacity:.8;margin-top:2rem}
.bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;background:var(--card);border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(0,0,0,.12)}
.bar a{flex:1;text-align:center;padding:.9rem .3rem;font-weight:700;text-decoration:none;color:#fff}.bar .c1{background:var(--hot)}.bar .c2{background:var(--teal)}.bar .c3{background:#1f9d55}
@media(min-width:900px){.bar{left:auto;right:1.2rem;bottom:1.2rem;border-radius:.8rem;overflow:hidden;width:auto}.bar a{padding:.8rem 1.2rem}body{padding-bottom:0}}
@media(max-width:760px){.nav nav{display:none}}
:focus-visible{outline:3px solid var(--hot);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
