:root{--bg:#F2F6F4;--card:#FFFFFF;--ink:#12302B;--mute:#4F625E;--acc:#F2A007;--accink:#2A1B00;--line:#D5E0DC;--deep:#12302B;--wa:#1FA855;--red:#E4572E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0D1D1A;--card:#16302B;--ink:#EAF3F0;--mute:#9DB5AF;--line:#28463F;--deep:#071210}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 "Nunito Sans",system-ui,sans-serif;-webkit-text-size-adjust:100%}
h1,h2,h3{font-family:Sora,system-ui,sans-serif;line-height:1.2;margin:0 0 .5em;color:var(--ink)}
h1{font-size:clamp(28px,5vw,44px);font-weight:800}
h2{font-size:clamp(22px,3.4vw,30px);font-weight:800;margin-top:1.6em}
h3{font-size:19px;font-weight:700}
a{color:inherit}
img{max-width:100%;height:auto}
.container{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:760px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--acc);color:var(--accink);padding:8px 12px;z-index:20}
/* header */
.site-header{background:var(--deep);color:#F2F6F4;position:sticky;top:0;z-index:10}
.site-header .row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;flex-wrap:wrap;padding:8px 0}
.brand{font:800 18px Sora,sans-serif;text-decoration:none;color:#F2F6F4}
.brand span{color:var(--acc)}
.nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.nav a{color:#DCEBE6;text-decoration:none;font-weight:700;font-size:15px;padding:8px 12px;border-radius:8px}
.nav a:hover,.nav a[aria-current=page]{background:rgba(255,255,255,.1)}
.nav .cta{background:var(--acc);color:var(--accink)}
/* buttons */
.btn{display:inline-block;border:0;border-radius:12px;padding:14px 22px;font:800 16px Sora,sans-serif;background:var(--acc);color:var(--accink);text-decoration:none;cursor:pointer;text-align:center}
.btn.block{display:block;width:100%}
.btn.wa{background:var(--wa);color:#fff}
.btn.alt{background:transparent;color:var(--ink);border:2px solid var(--acc)}
.btn.ghost{background:transparent;color:inherit;border:2px solid var(--line)}
.btn.sm{padding:10px 14px;font-size:14px}
.btn[aria-disabled=true]{opacity:.5;pointer-events:none}
.btn:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
/* hero */
.hero{background:var(--deep);color:#F2F6F4;padding:44px 0 56px}
.hero h1{color:#F2F6F4}
.hero p{color:#B9CEC8;font-size:19px;max-width:620px}
.hero .grid{display:grid;gap:28px;align-items:center}
@media(min-width:820px){.hero .grid{grid-template-columns:1.2fr .8fr}}
.hero .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hero .btn.ghost{color:#F2F6F4;border-color:#3C5F57}
.hero img.pic{border-radius:16px;border:1px solid #28463F;background:#fff;max-width:340px;margin:0 auto;display:block}
.tag{display:inline-block;background:var(--acc);color:var(--accink);font:800 12px Sora;padding:5px 10px;border-radius:99px;margin-bottom:14px;letter-spacing:.3px}
.crumbs{font-size:14px;color:var(--mute);margin:18px 0 0}
.crumbs a{color:var(--mute)}
.page-head{padding:34px 0 8px}
.page-head p{color:var(--mute);font-size:19px;max-width:680px}
/* sections & cards */
section.block{margin:56px 0}
.lead{color:var(--mute);max-width:660px}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px}
.card h3{margin-bottom:6px}
.card p{margin:0 0 10px;color:var(--mute);font-size:15.5px;line-height:1.5}
.card.best{border:2px solid var(--acc);position:relative}
.ribbon{position:absolute;top:-12px;right:16px;background:var(--wa);color:#fff;font:800 12px Sora;padding:5px 10px;border-radius:99px}
.price{font:800 30px Sora,sans-serif;margin:6px 0}
.price s{font:600 17px "Nunito Sans";color:var(--mute);margin-right:6px}
.price small{font:400 14px "Nunito Sans";color:var(--mute);margin-left:6px}
.save{color:var(--wa);font-weight:700;font-size:14px;margin:0 0 10px}
.prod{display:flex;gap:16px}
.prod img{flex:none;width:110px;border-radius:8px;border:1px solid var(--line);align-self:flex-start;background:#fff}
.prod .btn{margin-top:4px}
.covers{display:flex;gap:6px;margin:12px 0}
.covers img{flex:1;min-width:0;border-radius:6px;border:1px solid var(--line);background:#fff}
.steps{counter-reset:s;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));list-style:none;padding:0}
.steps li{counter-increment:s;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px 18px 18px 64px;position:relative}
.steps li:before{content:counter(s);position:absolute;left:16px;top:16px;width:36px;height:36px;border-radius:50%;background:var(--acc);color:var(--accink);font:800 17px Sora;display:grid;place-items:center}
.steps b{display:block;font-family:Sora;margin-bottom:4px}
.tree{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px 0}
.tree .n{background:var(--deep);color:#F2F6F4;border-radius:16px;padding:14px 22px;text-align:center;min-width:92px}
.tree .n b{display:block;font:800 30px Sora;color:var(--acc)}
.tree .ar{font:800 24px Sora;color:var(--acc)}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.checks li{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px 12px 44px;position:relative}
.checks li:before{content:"";position:absolute;left:17px;top:19px;width:12px;height:7px;border-left:3px solid var(--wa);border-bottom:3px solid var(--wa);transform:rotate(-45deg)}
.checks small{display:block;color:var(--mute);font-size:14.5px;line-height:1.45}
.strip{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
.strip img{flex:none;width:230px;border-radius:12px;border:1px solid var(--line);background:#fff;scroll-snap-align:start}
details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:10px}
summary{font-weight:700;cursor:pointer}
details p{margin:8px 0 0;color:var(--mute)}
.callout{background:var(--card);border-left:5px solid var(--acc);border-radius:10px;padding:14px 18px;margin:18px 0}
.callout p{margin:0 0 12px}.callout p:last-child{margin:0}
.cta-box{background:var(--deep);color:#F2F6F4;border-radius:18px;padding:24px;margin:40px 0;display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.cta-box img{width:96px;border-radius:8px;background:#fff}
.cta-box h3{color:#F2F6F4;margin-bottom:4px}
.cta-box p{margin:0 0 10px;color:#B9CEC8}
.cta-box .btn.ghost{color:#F2F6F4;border-color:#3C5F57}
/* article */
.article{padding:10px 0 40px}
.article p,.article li{font-size:18px}
.article ul,.article ol{padding-left:22px}
.article li{margin:6px 0}
.article table,.table{border-collapse:collapse;width:100%;margin:18px 0;background:var(--card);border-radius:12px;overflow:hidden;font-size:16px}
.article th,.article td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.article th{background:var(--deep);color:#F2F6F4}
figure.pg{float:right;margin:4px 0 14px 22px;width:220px}
figure.pg img{border-radius:10px;border:1px solid var(--line);background:#fff;width:100%}
figure.pg figcaption{font-size:13px;color:var(--mute);margin-top:4px}
@media(max-width:620px){figure.pg{float:none;margin:12px auto;width:200px}}
.meta{color:var(--mute);font-size:15px;margin:0 0 18px}
.post-card{display:flex;flex-direction:column}
.post-card h3 a{text-decoration:none}
.post-card .meta{margin:0 0 8px;font-size:14px}
.more-link{font-weight:700;text-decoration:none;color:var(--ink);border-bottom:2px solid var(--acc)}
/* guides purchase */
.buybox{position:sticky;top:76px}
.two{display:grid;gap:32px;margin:26px 0 0}
@media(min-width:860px){.two{grid-template-columns:1fr 340px;align-items:start}}
.factlist{list-style:none;padding:0;margin:12px 0 0;font-size:15px;color:var(--mute)}
.factlist li{padding:3px 0}
.safe{text-align:center;color:var(--mute);font-size:14px;margin:10px 0 0}
.sticky-buy{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);padding:10px 16px;display:none;z-index:9}
.sticky-buy.on{display:block}
.sticky-buy .row{max-width:760px;margin:0 auto;display:flex;align-items:center;gap:12px}
.sticky-buy b{font:800 20px Sora}
.sticky-buy .btn{flex:1}
@media(min-width:860px){.sticky-buy{display:none!important}}
.gift{margin:22px 0;padding:22px;border-radius:16px;background:var(--deep);color:#F2F6F4}
.gift h2{margin:0 0 6px;color:#F2F6F4;font-size:24px}
.gift p{color:#B9CEC8;margin:0 0 14px}
.gift input{width:100%;max-width:360px;padding:14px;border-radius:12px;border:0;font:17px "Nunito Sans",sans-serif;background:#fff;color:#12302B;margin-bottom:10px;display:block}
.gift .btn{margin-right:8px;margin-bottom:8px}
.gift .btn.ghost{color:#F2F6F4;border-color:#3C5F57}
.refd{display:none;margin:22px 0;padding:18px;border-radius:16px;border:2px solid var(--acc);background:var(--card)}
.rv{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:8px}
/* footer */
.site-footer{background:var(--deep);color:#B9CEC8;margin-top:64px;padding:40px 0 30px;font-size:15px}
.site-footer h4{font:800 15px Sora;color:#F2F6F4;margin:0 0 10px}
.site-footer a{color:#B9CEC8;text-decoration:none;display:block;padding:3px 0}
.site-footer a:hover{color:#fff}
.fgrid{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.site-footer .small{border-top:1px solid #28463F;margin-top:26px;padding-top:16px;font-size:13.5px}
.disc{display:inline-block;border:2px solid var(--acc);border-radius:99px;padding:4px 14px;color:#fff;font-weight:700;margin-bottom:10px}
.prose h2{margin-top:1.4em;font-size:24px}
.prose p,.prose li{color:var(--ink)}
@media(max-width:620px){.site-header .row{justify-content:center}.brand{width:100%;text-align:center}.nav{justify-content:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.two>*{min-width:0}
@media(max-width:620px){.site-header{position:static}.tree{flex-wrap:nowrap;gap:6px}.tree .n{padding:12px 10px;min-width:0;flex:1}.tree .n b{font-size:26px}.tree .ar{font-size:18px}}
