:root{
  --ink:#0E0E10; --raised:#17171B; --raised2:#202026; --line:#2B2B32;
  --text:#F3F0E8; --muted:#A8A5AD; --gold:#DBB861; --gold-ink:#16130B; --gold-soft:rgba(219,184,97,.12); --ok:#86C996;
  --display:"Poppins",system-ui,sans-serif; --body:"Manrope",system-ui,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--body);font-size:17px;line-height:1.62;
  padding:0 max(16px,env(safe-area-inset-left)) 56px max(16px,env(safe-area-inset-right))}
.wrap{max-width:720px;margin:0 auto}
h1,h2,h3{font-family:var(--display);margin:0;line-height:1.12;text-wrap:balance}
p{margin:12px 0}
a{color:var(--gold)}
b,strong{color:#fff;font-weight:700}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:8px}

.cover{margin-top:20px;background:var(--gold);color:var(--gold-ink);border-radius:28px;padding:26px 24px 28px;position:relative;overflow:hidden}
.cover::after{content:"";position:absolute;right:-60px;bottom:-60px;width:220px;height:220px;border-radius:50%;border:34px solid rgba(22,19,11,.07)}
.from{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:600}
.from img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:3px solid var(--gold-ink)}
.from span{display:block;font-weight:500;opacity:.72;font-size:13.5px}
.cover h1{font-size:clamp(34px,9vw,58px);font-weight:800;letter-spacing:-.02em;margin-top:22px}
.cover p{font-size:17.5px;max-width:52ch;margin:14px 0 0;font-weight:500}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;position:relative;z-index:1}
.facts span{background:var(--gold-ink);color:var(--gold);border-radius:999px;padding:7px 13px;font-size:14px;font-weight:700}

section{padding-top:44px}
.sec-h{display:flex;gap:14px;align-items:flex-start}
.step{flex:none;width:40px;height:40px;border-radius:12px;border:2px solid var(--gold);color:var(--gold);display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:18px;margin-top:-2px}
h2{font-size:clamp(23px,5vw,30px);font-weight:700}
.lead{color:var(--muted);max-width:62ch}
.sub{color:var(--muted);font-size:15px}
ul.list{padding-left:20px;margin:12px 0}ul.list li{margin:7px 0}
ol.list{padding-left:22px;margin:12px 0}ol.list li{margin:9px 0;padding-left:4px}
ol.list li::marker{color:var(--gold);font-family:var(--display);font-weight:700}
.panel{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:18px 18px 16px;margin-top:16px}
.panel h3{font-size:18px;font-weight:700}
.line-quote{border-left:3px solid var(--gold);padding:4px 0 4px 16px;margin-top:18px;font-family:var(--display);font-weight:600;font-size:19px;line-height:1.35}

.chat{background:var(--raised);border:1px solid var(--line);border-radius:22px;padding:14px;margin-top:16px}
.chat-top{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 4px 12px;border-bottom:1px solid var(--line);margin-bottom:14px}
.chat-top .who{font-weight:700;font-size:15px}
.chat-top .who small{display:block;color:var(--muted);font-weight:500;font-size:13px}
.bubble{max-width:92%;padding:12px 15px;border-radius:20px;font-size:16px;line-height:1.5;white-space:pre-line;margin:8px 0}
.me{margin-left:auto;background:var(--gold);color:var(--gold-ink);border-bottom-right-radius:6px;font-weight:500}
.me b{color:var(--gold-ink)}
.them{background:var(--raised2);color:var(--text);border-bottom-left-radius:6px}
.copy{font-family:var(--body);font-weight:700;font-size:14px;background:transparent;color:var(--gold);border:1.5px solid var(--gold);border-radius:999px;padding:7px 14px;cursor:pointer;flex:none}
.copy.done{background:var(--ok);border-color:var(--ok);color:#0b1a0f}

details.qa{background:var(--raised);border:1px solid var(--line);border-radius:18px;margin-top:10px;overflow:hidden}
details.qa summary{list-style:none;cursor:pointer;padding:15px 18px;font-weight:700;display:flex;gap:12px;align-items:center}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary::after{content:"+";margin-left:auto;color:var(--gold);font-size:24px;line-height:1;font-weight:500}
details.qa[open] summary::after{content:"–"}
details.qa .body{padding:0 14px 14px}

.rows{display:grid;gap:10px;margin-top:16px}
.row{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:16px 18px}
.row h3{font-size:17.5px;font-weight:700}
.row .what{color:var(--muted);font-size:15px;margin-top:4px}
.row .say{margin-top:10px;padding:10px 14px;border-radius:14px;background:var(--gold-soft);color:var(--text);font-size:15.5px}

.check{list-style:none;padding:0;margin:14px 0}
.check li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}
.check input{appearance:none;flex:none;width:24px;height:24px;border:2px solid var(--gold);border-radius:7px;margin:1px 0 0;cursor:pointer;display:grid;place-items:center}
.check input:checked{background:var(--gold)}
.check input:checked::after{content:"";width:6px;height:11px;border:solid var(--gold-ink);border-width:0 3px 3px 0;transform:rotate(45deg) translate(-1px,-1px)}
.check label{cursor:pointer}

.money{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-top:16px}
.price{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:18px}
.price .lbl{color:var(--muted);font-size:14px;font-weight:600}
.price .big{font-family:var(--display);font-weight:800;font-size:clamp(28px,6.5vw,36px);color:var(--gold);line-height:1.1;margin-top:4px;font-variant-numeric:tabular-nums}
.calc{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;font-family:var(--display);font-weight:700;font-size:19px}
.calc i{font-style:normal;color:var(--muted)}
.calc .res{background:var(--gold);color:var(--gold-ink);border-radius:12px;padding:5px 14px}

.code{background:#09090B;border:1px solid var(--line);border-radius:18px;margin-top:16px;overflow:hidden}
.code-top{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px 10px 16px;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted);font-weight:600}
.code pre{margin:0;padding:16px;white-space:pre-wrap;font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:14px;line-height:1.65;color:#ECE8DE}

details.series{background:var(--raised);border:1px solid var(--line);border-radius:18px;margin-top:10px;overflow:hidden}
details.series summary{list-style:none;cursor:pointer;padding:16px 18px;font-family:var(--display);font-weight:600;display:flex;align-items:center;gap:10px}
details.series summary::-webkit-details-marker{display:none}
details.series summary small{font-family:var(--body);color:var(--muted);font-weight:500;font-size:14px}
details.series summary::after{content:"+";margin-left:auto;color:var(--gold);font-size:24px;line-height:1;font-weight:500}
details.series[open] summary::after{content:"–"}
.niche{padding:14px 18px;border-top:1px solid var(--line)}
.niche h3{font-family:var(--body);font-size:16.5px;font-weight:700}
.niche .q{display:inline-block;margin-top:6px;background:var(--gold-soft);color:var(--gold);border-radius:8px;padding:2px 9px;font-size:14px;font-weight:600}
.niche p{margin:6px 0 0;color:var(--muted);font-size:15px}

.btn{display:flex;justify-content:space-between;align-items:center;gap:14px;background:var(--gold);color:var(--gold-ink);text-decoration:none;border-radius:18px;padding:16px 20px;margin-top:16px;font-weight:700}
.btn strong{display:block;font-family:var(--display);font-size:18px;color:var(--gold-ink)}
.btn small{display:block;font-weight:600;opacity:.7;font-size:14px}
.btn svg{flex:none}
.end{margin-top:48px;border:2px solid var(--gold);border-radius:28px;padding:24px 22px;text-align:left}
.end h2{color:var(--gold)}
.end .from{color:var(--text)}
.end .from img{border-color:var(--gold)}
.end a.follow{display:inline-block;margin-top:16px;background:var(--gold);color:var(--gold-ink);text-decoration:none;font-weight:800;padding:12px 20px;border-radius:999px}
footer{color:var(--muted);font-size:13.5px;text-align:center;margin-top:24px}
footer a{color:var(--muted)}
@media (prefers-reduced-motion:no-preference){.copy{transition:background .2s,color .2s}details[open] .body,details[open] .niche{animation:open .22s ease-out}@keyframes open{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}}

.hub{padding-top:44px;text-align:center}
.hub img.av{width:112px;height:112px;border-radius:50%;object-fit:cover;border:4px solid var(--gold)}
.hub h1{font-size:clamp(30px,8vw,44px);font-weight:800;margin-top:16px;letter-spacing:-.02em}
.hub p{color:var(--muted);max-width:44ch;margin:10px auto 0}
.links{display:grid;gap:12px;margin-top:30px;text-align:left}
.guide{display:flex;gap:16px;align-items:center;text-decoration:none;color:var(--text);background:var(--raised);border:1px solid var(--line);border-radius:22px;padding:14px}
.guide .thumb{flex:none;width:76px;height:76px;border-radius:16px;background:var(--gold);color:var(--gold-ink);display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:15px;text-align:center;line-height:1.1;padding:6px}
.guide strong{display:block;font-family:var(--display);font-size:17.5px;line-height:1.25}
.guide small{display:block;color:var(--muted);font-size:14.5px;margin-top:3px}
.socials{display:flex;gap:10px;justify-content:center;margin-top:26px;flex-wrap:wrap}
.socials a{color:var(--text);text-decoration:none;border:1.5px solid var(--line);border-radius:999px;padding:9px 16px;font-weight:700;font-size:15px}
