:root{--night:#020b14;--navy:#061b2c;--panel:rgba(3,22,36,.9);--gold:#d8a64a;--gold2:#f2d18d;--cream:#f6e7c8;--mist:#b9cad5;--teal:#39d7be;--line:rgba(216,166,74,.42);--shadow:0 24px 70px rgba(0,0,0,.5);--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--night);color:var(--cream);font-family:Georgia,"Times New Roman",serif;line-height:1.65}body:before{content:"";position:fixed;inset:0;z-index:-2;background:linear-gradient(rgba(1,10,18,.38),rgba(1,10,18,.92)),url("./media/arcta-clean-world-16x9-v1.webp") center/cover no-repeat}body:after{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(circle at 72% 18%,rgba(216,166,74,.12),transparent 25%),linear-gradient(90deg,rgba(0,7,13,.55),transparent 30%,transparent 70%,rgba(0,7,13,.55));pointer-events:none}
a{color:inherit}.skip{position:fixed;left:1rem;top:-5rem;z-index:100;background:var(--gold2);color:#06111b;padding:.7rem 1rem}.skip:focus{top:1rem}.knowledge-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:2rem;padding:.8rem clamp(1rem,4vw,4rem);background:rgba(1,10,18,.88);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.knowledge-brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--gold2);letter-spacing:.08em;font-size:1.15rem;white-space:nowrap}.seal{display:grid;place-items:center;width:2.5rem;aspect-ratio:1;border:1px solid var(--gold);border-radius:50%}.knowledge-nav{display:flex;align-items:center;gap:clamp(.8rem,2.2vw,2rem);margin-left:auto}.knowledge-nav a{text-decoration:none;color:#e8dbc2;font:600 .78rem/1.2 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;transition:color .2s}.knowledge-nav a:hover,.knowledge-nav a:focus-visible{color:var(--gold2)}.play{border:1px solid var(--gold);padding:.6rem 1rem;background:linear-gradient(#e8c77e,#b8832d);color:#171006!important}.menu{display:none}
.progress{position:fixed;top:0;left:0;z-index:30;height:2px;width:var(--progress,0);background:var(--gold2)}main{width:min(1180px,calc(100% - 2rem));margin:auto}.knowledge-hero{min-height:58vh;display:grid;align-content:center;padding:clamp(5rem,10vw,9rem) clamp(1rem,5vw,5rem);text-align:center}.eyebrow{font:700 .76rem/1.2 system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}h1,h2,h3{line-height:1.12;margin:.4em 0}.knowledge-hero h1{font-size:clamp(2.7rem,7vw,6.5rem);font-weight:500;text-shadow:0 7px 24px #000}.knowledge-hero .lead{max-width:850px;margin:1.2rem auto;color:var(--mist);font-size:clamp(1rem,2vw,1.35rem)}.ornament{width:min(420px,70%);height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:1.7rem auto}.actions{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin-top:1.8rem}.button{display:inline-flex;align-items:center;justify-content:center;min-width:12rem;padding:.85rem 1.4rem;text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font:700 .82rem/1 system-ui,sans-serif;border:1px solid var(--gold);transition:transform .25s var(--ease),box-shadow .25s,color .25s}.button.gold{background:linear-gradient(135deg,#f0d18c,#ad7623);color:#171006;box-shadow:inset 0 0 0 3px rgba(45,25,3,.28)}.button.dark{background:rgba(2,16,28,.8)}.button:hover,.button:focus-visible{transform:translateY(-3px);box-shadow:0 12px 30px rgba(216,166,74,.22)}
.frame{margin:0 0 2rem;padding:clamp(1.3rem,4vw,3.5rem);background:linear-gradient(135deg,rgba(4,30,47,.9),rgba(2,14,25,.86));border:1px solid var(--line);box-shadow:var(--shadow);position:relative}.frame:before,.frame:after{content:"";position:absolute;width:2.2rem;height:2.2rem;border-color:var(--gold);opacity:.75}.frame:before{left:.45rem;top:.45rem;border-left:1px solid;border-top:1px solid}.frame:after{right:.45rem;bottom:.45rem;border-right:1px solid;border-bottom:1px solid}.intro{text-align:center;max-width:900px;margin:0 auto 2.5rem}.intro h2{font-size:clamp(2rem,4vw,3.5rem);font-weight:500}.intro p{color:var(--mist)}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}.card{background:rgba(1,14,24,.72);border:1px solid rgba(216,166,74,.3);padding:1.5rem;transition:transform .3s var(--ease),border-color .3s,background .3s}.card:hover,.card:focus-within{transform:translateY(-5px);border-color:var(--gold);background:rgba(4,31,48,.9)}.card h2,.card h3{color:var(--gold2)}.card p,.card li{color:var(--mist)}.card a.more{display:inline-block;color:var(--gold2);margin-top:.5rem}.principle{scroll-margin-top:6rem}.principle-grid{display:grid;grid-template-columns:5rem 1fr;gap:1.3rem;align-items:start}.principle-icon{display:grid;place-items:center;width:5rem;aspect-ratio:1;border:1px solid var(--gold);border-radius:50%;font-size:2rem;color:var(--gold2);box-shadow:0 0 24px rgba(216,166,74,.15)}.checklist{padding-left:1.1rem}.checklist li{margin:.45rem 0}.technical{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:640px}th,td{text-align:left;vertical-align:top;padding:.8rem;border-bottom:1px solid rgba(216,166,74,.2)}th{color:var(--gold2);font:700 .78rem system-ui,sans-serif;text-transform:uppercase;letter-spacing:.08em}td{color:var(--mist)}
.coin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}.coin-card{text-align:center;scroll-margin-top:6rem}.coin-faces{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;align-items:end}.coin-faces img{width:100%;height:auto;filter:drop-shadow(0 18px 16px rgba(0,0,0,.5));transition:transform .5s var(--ease),filter .5s}.coin-card:hover img:first-child{transform:translateY(-7px) rotate(-2deg)}.coin-card:hover img:last-child{transform:translateY(-7px) rotate(2deg)}.coin-card:hover img{filter:drop-shadow(0 22px 22px rgba(216,166,74,.22))}.coin-card h2{color:var(--gold2)}.coin-meta{font:700 .72rem system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.stage{scroll-margin-top:6rem;display:grid;grid-template-columns:7rem 1fr;gap:1.5rem}.stage-no{font-size:4rem;color:var(--gold);line-height:1}.stage h2{font-size:clamp(1.7rem,3vw,2.7rem)}.stage dl{display:grid;grid-template-columns:10rem 1fr;margin:1rem 0}.stage dt{color:var(--gold2);font-weight:700}.stage dd{margin:0;color:var(--mist)}.route-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.route-list a{text-decoration:none}.route-list .card{height:100%}.notice{border-left:4px solid var(--teal);padding:1rem 1.2rem;background:rgba(4,43,50,.55);color:#d4ebe6}.footer{margin-top:4rem;padding:3rem max(1rem,5vw);border-top:1px solid var(--line);background:rgba(1,9,16,.94);text-align:center}.footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:1.2rem}.footer a{color:var(--gold2)}.footer p{color:var(--mist)}
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}[data-reveal].seen{opacity:1;transform:none}
@media(max-width:800px){.knowledge-header{gap:1rem}.knowledge-nav{display:none;position:absolute;left:0;right:0;top:100%;padding:1rem;flex-direction:column;background:#041321}.knowledge-nav.open{display:flex}.menu{display:block;margin-left:auto;background:none;border:1px solid var(--gold);color:var(--gold2);padding:.55rem}.knowledge-header>.play{display:none}.grid,.coin-grid,.route-list{grid-template-columns:1fr}.knowledge-hero{min-height:48vh;padding-inline:0}.stage{grid-template-columns:1fr}.stage-no{font-size:2.5rem}.stage dl{grid-template-columns:1fr}.principle-grid{grid-template-columns:1fr}.coin-faces{max-width:460px;margin:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}[data-reveal]{opacity:1;transform:none}}

/* Shared ARCTA interaction layer */
.knowledge-header{background:rgba(1,10,18,.92)}
.seal{box-shadow:inset 0 0 0 3px rgba(216,166,74,.08),0 0 18px rgba(216,166,74,.08)}
.knowledge-nav a{position:relative}
.knowledge-nav a:after{content:"";position:absolute;left:0;right:0;bottom:-.45rem;height:1px;background:linear-gradient(90deg,transparent,var(--gold2),transparent);transform:scaleX(0);transition:transform .3s var(--ease)}
.knowledge-nav a:hover:after,.knowledge-nav a:focus-visible:after{transform:scaleX(1)}
.play{position:relative;overflow:hidden;text-decoration:none;box-shadow:inset 0 0 0 3px rgba(45,25,3,.2)}
.button{position:relative;overflow:hidden;font-family:Georgia,"Times New Roman",serif;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}
.button:after,.play:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 18%,rgba(255,244,197,.48) 48%,transparent 72%);transform:translateX(-130%);transition:transform .65s var(--ease)}
.button:hover:after,.button:focus-visible:after,.play:hover:after,.play:focus-visible:after{transform:translateX(130%)}
.gel-reactive{--gel-x:0px;--gel-y:0px;--gel-rx:0deg;--gel-ry:0deg;--gel-scale:1;transform:perspective(700px) translate3d(var(--gel-x),var(--gel-y),0) rotateX(var(--gel-rx)) rotateY(var(--gel-ry)) scale(var(--gel-scale));transform-origin:center;transition:transform 420ms cubic-bezier(.2,.9,.25,1.35),filter 260ms var(--ease);will-change:transform}
.gel-reactive.is-gel-active{--gel-scale:1.025;filter:brightness(1.06)}
.gel-reactive:active{--gel-scale:.965;transition-duration:90ms}
.gel-reactive:focus-visible{outline:3px solid var(--teal);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.gel-reactive{transform:none!important;filter:none!important}}