:root{
  --panel:rgba(13,16,25,.55);--line:rgba(100,120,160,.14);
  --max:1040px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;background:var(--bg);}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.85;font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden;text-align:left;}
a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;}

#bg{position:fixed;inset:0;z-index:0;display:block;}
.veil{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 38%, rgba(11,13,18,.3) 0%, rgba(11,13,18,.6) 60%, rgba(11,13,18,.94) 100%),
    linear-gradient(180deg, rgba(11,13,18,.5) 0%, rgba(11,13,18,0) 22%, rgba(11,13,18,0) 70%, rgba(11,13,18,.88) 100%);}
.wrap{position:relative;z-index:2;}

.skip{position:absolute;left:-9999px;top:0;background:var(--accent);color:#1a1206;padding:8px 14px;border-radius:6px;}
.skip:focus{left:12px;top:12px;z-index:99;}

header.site{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:16px;
  padding:13px 22px;backdrop-filter:blur(10px);background:rgba(11,13,18,.6);border-bottom:1px solid var(--line);}
.brand{font-family:var(--mono);font-weight:700;letter-spacing:-.02em;font-size:22px;line-height:1;}
.brand .approx{font-family:var(--mono);color:var(--accent);font-size:.7em;margin:0 .06em;vertical-align:.08em;}
a.brand{color:inherit;text-decoration:none;transition:opacity .15s;}
a.brand:hover{opacity:.78;text-decoration:none;}
nav.top{margin-left:auto;display:flex;gap:20px;font-size:14px;}
nav.top a{color:var(--ink-dim);}
nav.top a:hover{color:var(--ink);text-decoration:none;}
@media(max-width:640px){nav.top{display:none;}}

section{padding:80px 22px;}
.inner{max-width:var(--max);margin:0 auto;}

.hero{min-height:86vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;padding-top:56px;}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.3em;color:var(--accent-2);text-transform:uppercase;margin:0 0 20px;}
h1.display{margin:0 0 26px;font-weight:400;}
.bebas{font-family:var(--mono);display:block;font-size:clamp(2.8rem,11vw,6.5rem);line-height:.95;letter-spacing:.01em;
  background:linear-gradient(100deg,var(--accent),#f3d9b1 42%,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 2px 40px rgba(0,0,0,.4);}
.bebas .approx{font-family:var(--mono);font-weight:300;font-size:.48em;-webkit-text-fill-color:var(--ink-dim);vertical-align:.24em;margin:0 .1em;}
.h1-sub{display:block;font-family:var(--sans);font-size:clamp(1.05rem,2.6vw,1.5rem);font-weight:700;color:var(--ink);margin-top:18px;letter-spacing:.02em;}
.lead{font-size:clamp(1rem,2.3vw,1.18rem);color:var(--ink-dim);max-width:660px;margin:0 0 36px;text-shadow:0 1px 16px rgba(0,0,0,.6);}
.cta{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:#1a1206;font-weight:700;
  padding:15px 30px;border-radius:999px;font-size:16px;box-shadow:0 10px 40px rgba(217,154,95,.32);transition:transform .15s,box-shadow .15s;}
.cta:hover{transform:translateY(-2px);text-decoration:none;box-shadow:0 14px 50px rgba(217,154,95,.48);}
.cta svg{width:18px;height:18px;}
.cta-sub{margin:16px 0 0;font-size:13px;color:var(--ink-faint);}

h2{font-size:clamp(1.45rem,3.4vw,2.1rem);margin:0 0 14px;font-weight:800;letter-spacing:.01em;}
.sec-lead{color:var(--ink-dim);max-width:680px;margin:0 0 42px;}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;backdrop-filter:blur(12px);}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;}
.card{padding:26px 24px;}
.card .ic{width:34px;height:34px;color:var(--accent);margin-bottom:14px;}
.card h3{margin:0 0 8px;font-size:1.12rem;}
.card p{margin:0;color:var(--ink-dim);font-size:.95rem;}

.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px;}
.feat{display:flex;gap:16px;padding:20px;align-items:flex-start;}
.feat svg{width:46px;height:46px;flex:none;color:var(--accent-2);}
.feat h3{margin:0 0 8px;font-size:1.08rem;line-height:1.4;}
.feat p{margin:0;color:var(--ink-dim);font-size:.9rem;line-height:1.7;}

.steps{counter-reset:s;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
.step{padding:26px 24px;}
.step::before{counter-increment:s;content:counter(s);font-family:var(--mono);font-size:38px;font-weight:700;color:var(--accent);opacity:.7;display:block;margin-bottom:6px;line-height:1;}
.step h3{margin:0 0 6px;font-size:1.06rem;}
.step p{margin:0;color:var(--ink-dim);font-size:.93rem;}

.uses{display:flex;flex-wrap:wrap;gap:10px;}
.use{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:999px;padding:9px 18px;font-size:.92rem;color:var(--ink);}

details{border-bottom:1px solid var(--line);padding:18px 4px;}
details summary{cursor:pointer;font-weight:700;font-size:1.05rem;list-style:none;display:flex;align-items:center;gap:12px;}
details summary::-webkit-details-marker{display:none;}
details summary::before{content:"+";color:var(--accent);font-family:var(--mono);font-size:1.3rem;flex:none;transition:transform .2s;}
details[open] summary::before{transform:rotate(45deg);}
details p{color:var(--ink-dim);margin:12px 0 0 28px;font-size:.96rem;}

.final{padding:92px 22px;}
.final h2{margin-bottom:24px;}
.disclaimer{padding:8px 22px 76px;}
.disclaimer h2{font-size:1.02rem;margin:0 0 12px;color:var(--ink-dim);font-weight:700;}
.disclaimer p{font-size:.82rem;color:var(--ink-faint);line-height:1.95;margin:0;}

footer{position:relative;z-index:2;border-top:1px solid var(--line);padding:44px 22px;background:rgba(7,8,14,.85);backdrop-filter:blur(8px);}
.foot{max-width:var(--max);margin:0 auto;display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center;}
.foot nav{display:flex;gap:6px 9px;flex-wrap:wrap;align-items:center;font-size:.76rem;}
.foot nav a{color:var(--ink-dim);}
.foot nav .sep{color:var(--ink-faint);opacity:.5;}
.foot .copy{font-size:.78rem;color:var(--ink-faint);}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}