:root{--ink:#0f0f0f;--coal:#1a1816;--char:#2C2925;--line:#2a2724;--gold:#D4A64A;--gold2:#F0D48A;--copper:#B87333;--cream:#ECE7DE;--muted:#A39C90;
--disp:'Anton',Impact,sans-serif;--body:'Barlow','Helvetica Neue',Arial,sans-serif;--cond:'Barlow Condensed','Barlow',sans-serif;--side:270px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--cream);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(900px 500px at 85% -10%,rgba(212,166,74,.08),transparent 60%),radial-gradient(700px 400px at -10% 110%,rgba(184,115,51,.06),transparent 60%);z-index:0}
img{max-width:100%;display:block}button{font-family:inherit}
.eyebrow{font-family:var(--cond);color:var(--gold);letter-spacing:.32em;font-size:13px;font-weight:600;text-transform:uppercase}
.muted{color:var(--muted)}.wrap{position:relative;z-index:1;max-width:1040px;margin:0 auto;padding:0 28px}
.topbar{position:fixed;top:0;left:0;right:0;height:62px;z-index:30;display:flex;align-items:center;gap:20px;padding:0 22px;background:rgba(15,15,15,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;color:var(--cream);text-decoration:none;font-family:var(--cond);letter-spacing:.2em;font-size:15px}.brand b{color:var(--gold);font-weight:600}
.topprog{margin-left:auto;display:flex;align-items:center;gap:12px;font-family:var(--cond);color:var(--gold2);letter-spacing:.1em}
.bar{width:180px;height:5px;background:var(--char);border-radius:3px;overflow:hidden}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--copper),var(--gold),var(--gold2));transition:width .7s ease}
.menu{display:none;background:none;border:1px solid var(--line);color:var(--cream);border-radius:8px;width:40px;height:36px;font-size:18px;cursor:pointer}
.side{position:fixed;top:62px;left:0;bottom:0;width:var(--side);z-index:20;background:rgba(18,17,16,.96);border-right:1px solid var(--line);padding:24px 14px;overflow:auto;transition:transform .3s ease}
.side-h{font-family:var(--cond);letter-spacing:.3em;text-transform:uppercase;color:var(--muted);font-size:12px;padding:0 10px 12px}
.nav-i{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:1px solid transparent;color:var(--cream);padding:10px;border-radius:10px;cursor:pointer;font-size:15px;transition:.2s}
.nav-i:hover{background:var(--coal)}.nav-i.on{background:var(--char);border-color:rgba(212,166,74,.5)}
.nav-i .n{font-family:var(--disp);color:var(--muted);width:26px;font-size:16px}.nav-i.done .n{color:var(--gold)}
.nav-i .st{margin-left:auto;font-size:11px;letter-spacing:.15em;color:var(--gold);font-family:var(--cond)}
.nav-i.lock{opacity:.45}
.reset{margin:22px 10px 0;background:none;border:none;color:var(--muted);font-size:12px;cursor:pointer;text-decoration:underline}
main{margin-left:var(--side);padding-top:62px;padding-bottom:60px}
.hero{position:relative;min-height:78vh;display:flex;align-items:flex-end;overflow:hidden;border-bottom:1px solid var(--line)}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.06);animation:drift 24s ease-in-out infinite alternate}
@keyframes drift{to{transform:scale(1.14) translate(-1.5%,-1%)}}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(95deg,rgba(15,15,15,.96) 18%,rgba(15,15,15,.7) 50%,rgba(15,15,15,.2)),linear-gradient(0deg,var(--ink),transparent 40%)}
.hero-in{position:relative;z-index:2;padding:80px 56px 64px;max-width:760px;animation:up .9s ease both}
.hero-logo{margin-bottom:22px;filter:drop-shadow(0 0 18px rgba(212,166,74,.35))}
h1{font-family:var(--disp);font-weight:400;font-size:clamp(56px,9vw,112px);line-height:.92;letter-spacing:.01em;margin:14px 0 18px;background:linear-gradient(180deg,#fff 0%,var(--cream) 55%,var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
.lede{font-size:19px;color:#cfc8bc;max-width:520px;margin:0}
.hero-cta{display:flex;align-items:center;gap:18px;margin-top:30px;flex-wrap:wrap}.hint{color:var(--muted);font-size:14px}
.hero-stats{display:flex;gap:40px;margin-top:44px;padding-top:24px;border-top:1px solid var(--line)}
.hero-stats b{display:block;font-family:var(--disp);font-weight:400;font-size:38px;color:var(--gold);line-height:1}.hero-stats span{font-family:var(--cond);letter-spacing:.2em;text-transform:uppercase;font-size:12px;color:var(--muted)}
.btn{border:1px solid var(--line);background:var(--coal);color:var(--cream);padding:13px 24px;border-radius:999px;font-size:15px;font-weight:600;letter-spacing:.04em;cursor:pointer;transition:.25s}
.btn:hover{border-color:var(--gold)}.btn:disabled{opacity:.35;cursor:not-allowed}
.btn.gold{background:linear-gradient(135deg,var(--gold2),var(--gold) 55%,var(--copper));color:#16130f;border:none;box-shadow:0 10px 30px -10px rgba(212,166,74,.6)}
.btn.gold:hover{transform:translateY(-2px);box-shadow:0 16px 36px -10px rgba(212,166,74,.75)}
.welcome{padding-top:72px}.h2{font-family:var(--disp);font-weight:400;font-size:clamp(30px,4vw,44px);line-height:1.05;margin:10px 0 12px;letter-spacing:.01em}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:34px 0 54px}
.tcard{background:linear-gradient(180deg,var(--coal),#141312);border:1px solid var(--line);border-radius:18px;padding:24px}
.tcard .k{font-family:var(--disp);color:var(--gold);font-size:20px}.tcard h3{margin:8px 0 6px;font-size:19px}.tcard p{margin:0;color:var(--muted);font-size:15px}
.grid-mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.mcard{position:relative;height:180px;border-radius:18px;overflow:hidden;border:1px solid var(--line);cursor:pointer;background:#000;transition:transform .3s,border-color .3s;text-align:left;padding:0;color:inherit}
.mcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;transition:transform .6s,opacity .3s}
.mcard:hover{transform:translateY(-4px);border-color:var(--gold)}.mcard:hover img{transform:scale(1.07);opacity:.7}
.mcard:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,10,.95) 10%,transparent 75%)}
.mcard .c{position:absolute;z-index:2;left:18px;right:18px;bottom:16px}.mcard .num{font-family:var(--disp);color:var(--gold);font-size:15px;letter-spacing:.1em}
.mcard .t{font-weight:700;font-size:18px;margin-top:2px}.mcard .g{font-size:13px;color:var(--muted)}
.mcard .badge{position:absolute;z-index:2;top:14px;right:14px;font-family:var(--cond);letter-spacing:.18em;font-size:11px;padding:4px 10px;border-radius:999px;background:rgba(15,15,15,.7);border:1px solid var(--line);color:var(--muted)}
.mcard .badge.ok{color:#16130f;background:var(--gold);border-color:var(--gold)}
#view{padding-top:70px;scroll-margin-top:70px}
.banner{position:relative;height:320px;border-radius:24px;overflow:hidden;border:1px solid var(--line);animation:up .6s ease both}
.banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.banner:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--ink) 4%,rgba(15,15,15,.35) 60%,rgba(15,15,15,.1))}
.banner .c{position:absolute;z-index:2;left:36px;bottom:30px;right:36px}
.banner h2{font-family:var(--disp);font-weight:400;font-size:clamp(40px,6vw,68px);line-height:1;margin:8px 0 6px}.banner p{margin:0;color:#cfc8bc}
.block{margin-top:44px;animation:up .6s ease both}.block h3.sec{font-family:var(--cond);font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-size:14px;margin:0 0 16px;display:flex;align-items:center;gap:14px}
.block h3.sec:after{content:"";flex:1;height:1px;background:var(--line)}
.panel{background:linear-gradient(180deg,#151413,#111);border:1px solid var(--line);border-radius:20px;padding:28px}
.panel svg{width:100%;height:auto;display:block}
.rows{display:grid;gap:12px;margin-top:18px}.row{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:16px 20px;border:1px solid var(--line);border-radius:14px;background:var(--coal)}
.row b{color:var(--cream)}.row span{color:var(--muted)}
.steps{counter-reset:s;display:grid;gap:12px}.step{position:relative;padding:16px 18px 16px 66px;border:1px solid var(--line);border-radius:14px;background:var(--coal)}
.step:before{counter-increment:s;content:counter(s,decimal-leading-zero);position:absolute;left:18px;top:14px;font-family:var(--disp);color:var(--gold);font-size:22px}
.step b{display:block}.step span{color:var(--muted);font-size:15px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}.two h4{margin:0 0 12px;font-size:18px}
.quote{border-left:2px solid var(--gold);padding:14px 22px;margin:0 0 14px;background:linear-gradient(90deg,rgba(212,166,74,.07),transparent);border-radius:0 14px 14px 0}
.quote small{display:block;font-family:var(--cond);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-size:12px;margin-bottom:4px}.quote p{margin:0;font-size:18px;font-style:italic;color:#e3ddd2}
.callout{display:flex;gap:16px;align-items:flex-start;padding:18px 22px;border-radius:14px;border:1px solid rgba(212,166,74,.4);background:rgba(212,166,74,.06);margin-top:18px}
.callout.warn{border-color:rgba(184,115,51,.6);background:rgba(184,115,51,.08)}.callout b{color:var(--gold2)}
table.t{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.t th{text-align:left;font-family:var(--cond);letter-spacing:.2em;text-transform:uppercase;font-size:12px;color:var(--gold);background:var(--char);padding:12px 18px}
.t td{padding:14px 18px;border-top:1px solid var(--line);vertical-align:top}.t td:first-child{font-weight:600;white-space:nowrap}.t td:last-child{color:#d5cec2}
ol.nl{margin:0;padding:0;list-style:none;counter-reset:n;display:grid;gap:10px}ol.nl li{counter-increment:n;padding:14px 18px 14px 60px;position:relative;border:1px solid var(--line);border-radius:14px;background:var(--coal)}
ol.nl li:before{content:counter(n);position:absolute;left:20px;top:12px;font-family:var(--disp);color:var(--gold);font-size:20px}
.q{background:var(--coal);border:1px solid var(--line);border-radius:18px;padding:22px;margin-bottom:14px}
.q .qq{font-weight:600;font-size:18px;margin-bottom:14px}.q .qq em{font-style:normal;font-family:var(--disp);color:var(--gold);margin-right:10px}
.opt{display:block;width:100%;text-align:left;padding:13px 16px;margin-top:8px;border-radius:12px;border:1px solid var(--line);background:#121110;color:var(--cream);font-size:16px;cursor:pointer;transition:.2s}
.opt:hover{border-color:var(--gold)}.opt.right{border-color:var(--gold);background:rgba(212,166,74,.14)}.opt.wrong{border-color:var(--copper);background:rgba(184,115,51,.1)}
.fb{margin-top:10px;font-size:15px;animation:up .4s ease both}.fb.ok{color:var(--gold2)}.fb.no{color:var(--copper)}
.gate{font-family:var(--cond);letter-spacing:.16em;text-transform:uppercase;font-size:14px;color:var(--muted);margin:10px 0 0}.gate.ok{color:var(--gold)}
.navrow{display:flex;justify-content:space-between;gap:12px;margin-top:28px}
.cert{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--gold);padding:56px 28px;text-align:center;background:#0d0d0d;margin-top:24px}
.cert img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.16}
.cert:before{content:"";position:absolute;inset:12px;border:1px solid rgba(212,166,74,.35);border-radius:16px;pointer-events:none}
.cert .in{position:relative}.cert h2{font-family:var(--disp);font-weight:400;font-size:clamp(40px,6vw,64px);margin:10px 0 0;line-height:1}
.cert .rule{width:70px;height:2px;background:var(--gold);margin:18px auto}.cert .nm{font-size:30px;font-weight:600;color:var(--gold2)}.cert .meta{color:var(--muted);font-size:14px;margin-top:12px}
.cert.locked{border-color:var(--line);filter:grayscale(1);opacity:.55}
input.name{width:100%;max-width:420px;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:#121110;color:var(--cream);font-size:16px;font-family:inherit}
input.name:focus{outline:none;border-color:var(--gold)}
.checks label{display:flex;gap:14px;align-items:flex-start;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:var(--coal);margin-bottom:10px;cursor:pointer}
.checks input{accent-color:var(--gold);width:18px;height:18px;margin-top:4px}
.checks small{display:block;color:var(--muted)}
.foot{margin-left:var(--side);padding:30px;text-align:center;color:#6d675e;font-size:13px;border-top:1px solid var(--line)}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (max-width:900px){.side{transform:translateX(-100%)}.side.open{transform:none}main,.foot{margin-left:0}.menu{display:block}.bar{width:90px}
.trio,.two{grid-template-columns:1fr}.row{grid-template-columns:1fr;gap:4px}.hero-in{padding:60px 24px 48px}.hero-stats{gap:24px}.banner{height:240px}.banner .c{left:22px}}
@media print{.topbar,.side,.foot,.hero,.welcome,.navrow,.noprint{display:none!important}main{margin:0;padding:0}.cert{break-inside:avoid}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.gate-ov{position:fixed;inset:0;z-index:60;background:rgba(8,8,8,.82);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:20px}
.gate-ov[hidden]{display:none}
.gate-card{width:100%;max-width:480px;background:linear-gradient(180deg,#1a1816,#121110);border:1px solid rgba(212,166,74,.45);border-radius:24px;padding:34px;animation:up .5s ease both;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.gate-card label{display:block;font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:var(--muted);margin-top:16px}
.gate-card label small{text-transform:none;letter-spacing:0}
.gate-card input{display:block;width:100%;margin-top:6px;padding:13px 15px;border-radius:12px;border:1px solid var(--line);background:#0f0f0f;color:var(--cream);font:16px var(--body)}
.gate-card input:focus{outline:none;border-color:var(--gold)}.err{color:var(--copper);min-height:1em;margin:10px 0 0;font-size:14px}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.tab{border:1px solid var(--line);background:var(--coal);color:var(--muted);border-radius:999px;padding:9px 16px;cursor:pointer;font-size:14px;font-weight:600}
.tab.on{color:#16130f;background:var(--gold);border-color:var(--gold)}
.line{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:var(--coal);margin-bottom:10px}
.line .who{font-family:var(--cond);letter-spacing:.18em;text-transform:uppercase;font-size:12px;color:var(--gold);padding-top:3px}.line .who.h{color:var(--muted)}
.line p{margin:0}.line p i{color:var(--muted)}
.faq details{border:1px solid var(--line);border-radius:14px;background:var(--coal);margin-bottom:10px;padding:0 18px}
.faq summary{cursor:pointer;padding:15px 0;font-weight:600;list-style:none}.faq summary:before{content:"+";color:var(--gold);font-family:var(--disp);margin-right:12px}
.faq details[open] summary:before{content:"–"}.faq details p{margin:0 0 16px;color:#d5cec2}
.kgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.kcard{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--coal)}
.kcard .ph{height:120px;background-size:cover;background-position:center;position:relative}.kcard .ph:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--coal),transparent)}
.kcard .b{padding:4px 20px 20px}.kcard h4{margin:0 0 8px;font-size:18px}.kcard ul{margin:0;padding-left:18px;color:#d5cec2;font-size:15px}
.rec{border:1px solid var(--line);border-radius:18px;background:var(--coal);padding:22px;margin-bottom:16px}
.rec.done{border-color:rgba(212,166,74,.55)}.rec h4{margin:0;font-size:19px;display:flex;align-items:center;gap:12px}.rec h4 em{font-style:normal;font-family:var(--disp);color:var(--gold)}
.rec .brief{color:#d5cec2;margin:10px 0 14px;font-size:15px}.rec .ctl{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.rec audio{height:38px;max-width:100%}.rec .t{font-family:var(--disp);color:var(--gold2);min-width:60px}
.dot{width:10px;height:10px;border-radius:50%;background:#c0392b;display:inline-block;animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.2}}
.prog{height:8px;background:var(--char);border-radius:4px;overflow:hidden;margin:14px 0 6px}.prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--copper),var(--gold),var(--gold2));transition:width .3s}
.stat{color:var(--muted);font-size:14px}
@media (max-width:900px){.kgrid{grid-template-columns:1fr}.line{grid-template-columns:1fr;gap:4px}}
