:root{
  --ink:#0B0704; --panel:#582509; --panel-2:#634F2A; --line:#B08D63;
  --text:#E9DBC6; --muted:#B08D63; --amber:#D8921E; --amber-dim:#A15A20; --soft:#d8c8ae;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{background:var(--ink);color:var(--text);font-family:'Inter',-apple-system,system-ui,sans-serif;font-size:17px;line-height:1.6;overflow-x:hidden}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding-inline:20px}
.narrow{max-width:760px}
.skip{position:absolute;left:-999px;top:8px;background:var(--amber);color:var(--ink);padding:8px 12px;border-radius:6px;z-index:10}
.skip:focus{left:8px}
header.site{border-bottom:1px solid #3a2a14;position:sticky;top:0;background:rgba(11,7,4,.94);backdrop-filter:blur(6px);z-index:5}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:14px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:34px;height:34px;border-radius:8px}
.brand b{font-family:'Chakra Petch',sans-serif;letter-spacing:.16em;font-size:17px;font-weight:700}
nav.main a{color:var(--muted);font-size:14px;text-decoration:none;margin-left:20px;white-space:nowrap}
nav.main a:hover,nav.main a[aria-current]{color:var(--text)}
h1,h2,h3{font-family:'Chakra Petch',sans-serif;line-height:1.1;text-wrap:balance}
h1{font-size:clamp(36px,6.2vw,62px);font-weight:700;letter-spacing:.01em}
h2{font-size:clamp(26px,4vw,38px);margin-bottom:12px}
h3{font-size:21px}
.eyebrow{font-family:'Chakra Petch',sans-serif;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--amber);margin-bottom:16px}
.lead{margin-top:20px;color:var(--soft);max-width:34em}
.sub{color:var(--muted);max-width:38em}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'Chakra Petch',sans-serif;font-weight:600;letter-spacing:.08em;font-size:14px;text-transform:uppercase;text-decoration:none;padding:14px 20px;border-radius:10px;border:1px solid var(--line);color:var(--text);background:transparent;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px);background:#1b120a}
.btn.primary{background:var(--amber);border-color:var(--amber);color:var(--ink)}
.btn.primary:hover{background:#e6a032}
.btn small{display:block;font-size:10px;letter-spacing:.14em;opacity:.75;font-weight:500}
.btn span{line-height:1.15}
.note{margin-top:16px;font-size:14px;color:var(--muted)}
.hero{position:relative;padding-block:60px 70px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.device{justify-self:center;position:relative;width:min(320px,100%)}
.device img{width:100%;height:auto;display:block;border-radius:30px;border:1px solid var(--line);box-shadow:0 30px 70px rgba(0,0,0,.6)}
.rings{position:absolute;inset:-60px;z-index:-1;display:grid;place-items:center;pointer-events:none}
.rings i{position:absolute;border:1px solid var(--amber-dim);border-radius:50%;opacity:.4;animation:pulse 6s ease-out infinite;max-width:120vw;max-height:120vw}
.rings i:nth-child(1){width:380px;height:380px}
.rings i:nth-child(2){width:520px;height:520px;animation-delay:2s}
.rings i:nth-child(3){width:660px;height:660px;animation-delay:4s}
@keyframes pulse{0%{opacity:.5;transform:scale(.9)}100%{opacity:0;transform:scale(1.15)}}
@media (prefers-reduced-motion:reduce){.rings i{animation:none;opacity:.2}}
section.block{padding-block:64px;border-top:1px solid #2a1d0e}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}
.cols.two{grid-template-columns:repeat(2,1fr)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:24px}
.card .n{font-family:'Chakra Petch',sans-serif;color:var(--amber);font-size:13px;letter-spacing:.2em}
.card h3{margin:8px 0}
.card p{color:#e0d0b6;font-size:16px}
.plain{padding-left:16px;border-left:2px solid var(--amber-dim)}
.plain b{display:block;font-family:'Chakra Petch',sans-serif;font-size:18px}
.plain span{color:#cdbb9f;font-size:16px}
.who{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 40px;margin-top:30px}
.demo{margin-top:30px;background:#140d07;border:1px solid var(--line);border-radius:16px;padding:26px 22px}
.demo .line{font-family:'Chakra Petch',sans-serif;font-size:clamp(20px,3.4vw,30px);line-height:1.5}
.demo .w{padding:1px 3px;border-radius:4px;color:#8a7352;transition:color .2s,background .2s}
.demo .w.done{color:var(--text)}
.demo .w.ear{background:var(--amber);color:var(--ink)}
.demo .w.you{box-shadow:inset 0 -3px 0 var(--amber)}
.demo .legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:18px;font-size:14px;color:var(--muted)}
.demo .legend i{display:inline-block;width:14px;height:14px;border-radius:3px;vertical-align:-2px;margin-right:6px}
.demo .legend .a{background:var(--amber)}
.demo .legend .b{box-shadow:inset 0 -3px 0 var(--amber);background:#2a1d0e}
.video{margin-top:30px}
.video video{width:100%;border-radius:16px;border:1px solid var(--line);background:#000;display:block}
.table{overflow-x:auto;margin-top:26px}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:15px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid #3a2a14;vertical-align:top}
th{font-family:'Chakra Petch',sans-serif;font-weight:600;letter-spacing:.06em;color:var(--muted);font-size:13px;text-transform:uppercase}
tr.us td{color:var(--text);background:rgba(216,146,30,.09)}
.tag{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px}
.tag .big{font-family:'Chakra Petch',sans-serif;font-size:44px;font-weight:700;color:var(--amber);line-height:1}
.tag ul{list-style:none;margin-top:16px;color:#e0d0b6;font-size:16px}
.tag li{padding:6px 0;border-top:1px solid #7a4a25}
.price{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
details{border-bottom:1px solid #3a2a14;padding:16px 0}
summary{cursor:pointer;font-family:'Chakra Petch',sans-serif;font-size:19px;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:'+';color:var(--amber);font-size:24px;line-height:1}
details[open] summary::after{content:'\2212'}
details p,details ul{color:#d8c8ae;margin-top:10px;font-size:16px;max-width:46em}
details ul{padding-left:22px}
.doc h1{font-size:clamp(32px,5vw,46px);margin-bottom:8px}
.doc h2{font-size:24px;margin:34px 0 8px}
.doc p,.doc li{color:#dccdb3;margin-top:10px;font-size:16.5px}
.doc ul{padding-left:22px}
.doc .callout{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin-top:22px}
.doc .updated{color:var(--muted);font-size:14px;margin-top:6px}
.contact-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;margin-top:22px;max-width:520px}
.contact-card a{color:var(--amber);font-size:20px;font-family:'Chakra Petch',sans-serif}
footer.site{border-top:1px solid #2a1d0e;padding-block:34px;color:var(--muted);font-size:14px}
footer.site .wrap{display:flex;flex-wrap:wrap;gap:14px 40px;justify-content:space-between}
footer.site a{text-decoration:none;margin-right:18px;display:inline-block;padding-block:4px}
footer.site a:hover{color:var(--text)}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
@media (max-width:820px){
  .hero{padding-block:36px 50px}
  .hero .wrap,.price{grid-template-columns:1fr}
  .cols,.cols.two,.who{grid-template-columns:1fr}
  .device{width:min(260px,72%)}
  nav.main a{margin-left:14px}
  nav.main a.hide-sm{display:none}
}