:root{--bg:#07050c;--bg2:#120a1a;--ink:#c9b8a0;--head:#e8d4b8;--purple:#6b3fa0;--purple2:#2a1640;--orange:#e87830;--orange2:#ffb347;--line:rgba(232,120,48,.28)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg) url(assets/gothic_stone_bg.jpg) repeat;background-image:linear-gradient(180deg,rgba(7,5,12,.7),rgba(20,10,24,.85) 50%,rgba(7,5,12,.95)),image-set(url(assets/gothic_stone_bg.webp) type("image/webp"),url(assets/gothic_stone_bg.jpg) type("image/jpeg"));background-size:auto,256px;background-attachment:fixed;color:var(--ink);font:16px/1.7 "Courier New",Courier,monospace;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
.px{image-rendering:pixelated;image-rendering:crisp-edges}
h1,h2,h3,h4,.btn,.nav,.hero-sub,.hero-by,figcaption,.stats b,.track{font-family:Cinzel,serif}
h2{font-size:clamp(1.6rem,3.2vw,2.4rem);letter-spacing:.14em;color:var(--head);text-align:center;margin-bottom:1.6rem;text-shadow:0 0 18px rgba(232,120,48,.3),0 2px 0 #000}
h2::after{content:"";display:block;width:120px;height:2px;margin:.8rem auto 0;background:linear-gradient(90deg,transparent,var(--orange),transparent)}
h3{color:var(--orange2);letter-spacing:.08em;font-size:1.15rem;margin-bottom:.6rem}
a{color:var(--orange2)}
.skip{position:absolute;left:-999px;top:0;background:var(--orange);color:#000;padding:.5rem 1rem;z-index:99}.skip:focus{left:1rem}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--orange2);outline-offset:3px}

.nav{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:.6rem clamp(1rem,8vw,7rem);background:linear-gradient(180deg,rgba(7,5,12,.92),rgba(7,5,12,0));transition:background .3s}
.nav.scrolled{background:rgba(7,5,12,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(6px)}
.nav ul{display:flex;gap:1.4rem;list-style:none}
.nav a{color:var(--head);text-decoration:none;letter-spacing:.1em;font-size:.85rem}
.nav ul a:hover{color:var(--orange2);text-shadow:0 0 10px var(--orange)}
.nav-logo img{width:40px;filter:drop-shadow(0 0 6px rgba(232,120,48,.5))}
.nav-cta{border:1px solid var(--orange);padding:.3rem .8rem}

.hero{position:relative;min-height:100vh;display:grid;place-items:center;overflow:hidden;text-align:center;padding:6rem 1.5rem 4rem}
.hero-bg{position:absolute;inset:-10% 0 0;z-index:-1}
.hero-bg img{width:100%;height:110%;object-fit:cover;opacity:.45;filter:saturate(.8)}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 40%,transparent 20%,rgba(7,5,12,.85) 75%),linear-gradient(180deg,transparent 60%,var(--bg))}
.hero-logo img{width:min(300px,60vw);margin:0 auto;filter:drop-shadow(0 0 26px rgba(232,120,48,.45));animation:glow 4s ease-in-out infinite}
@keyframes glow{50%{filter:drop-shadow(0 0 40px rgba(232,120,48,.7)) drop-shadow(0 0 70px rgba(107,63,160,.5))}}
.hero-sub{margin-top:1.4rem;font-size:1.5rem;letter-spacing:.2em;color:var(--head)}
.hero-text{font-family:Cinzel,serif;max-width:640px;margin:.8rem auto 0;font-size:clamp(.95rem,1.6vw,1.15rem);line-height:1.8;letter-spacing:.04em;text-shadow:0 1px 0 #000}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2rem}
.hero-by{margin-top:1.6rem;font-size:.8rem;letter-spacing:.3em;text-transform:uppercase;opacity:.7}
.btn{display:inline-block;padding:.85rem 1.8rem;letter-spacing:.12em;font-weight:600;text-decoration:none;border:2px solid var(--orange);cursor:pointer;font-size:.95rem;transition:transform .2s,box-shadow .2s,background .2s}
.btn-primary{background:linear-gradient(180deg,#e87830,#a8461a);color:#1a0a05;box-shadow:0 0 18px rgba(232,120,48,.4),inset 0 -3px 0 rgba(0,0,0,.3)}
.btn-ghost{background:rgba(42,22,64,.55);color:var(--head);border-color:var(--purple)}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 28px rgba(232,120,48,.6)}
.scroll-hint{position:absolute;bottom:1.5rem;left:50%;width:22px;height:36px;border:2px solid var(--line);border-radius:12px;transform:translateX(-50%)}
.scroll-hint::after{content:"";position:absolute;left:50%;top:6px;width:4px;height:8px;margin-left:-2px;background:var(--orange);animation:dot 1.8s infinite}
@keyframes dot{to{transform:translateY(12px);opacity:0}}

.section{max-width:1040px;margin:0 auto;padding:5rem clamp(1.25rem,5vw,2rem)}
.lead{font-size:1.08rem;color:var(--head);max-width:780px;margin:0 auto 2rem;text-align:center}
.center{text-align:center}.muted{opacity:.75;margin-bottom:1.5rem}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.panel{background:linear-gradient(180deg,rgba(42,22,64,.55),rgba(14,8,20,.8));border:1px solid rgba(107,63,160,.5);padding:1.6rem;box-shadow:inset 0 0 30px rgba(0,0,0,.6);position:relative}
.panel::before{content:"";position:absolute;inset:4px;border:1px solid rgba(232,120,48,.12);pointer-events:none}
.stats{display:flex;justify-content:center;gap:clamp(1rem,5vw,4rem);margin-top:2.5rem;flex-wrap:wrap;text-align:center}
.stats b{display:block;font-size:2.8rem;color:var(--orange);text-shadow:0 0 20px rgba(232,120,48,.5);line-height:1}
.stats span{font-size:.8rem;letter-spacing:.15em;text-transform:uppercase}

.char{display:grid;grid-template-columns:minmax(200px,340px) 1fr;gap:2.5rem;align-items:center}
.char-art{background:radial-gradient(circle,rgba(232,120,48,.22),transparent 65%);padding:1rem}
.char-art img{width:100%}
.char .lead{text-align:left;margin:0 0 1rem}
.char h3{margin-top:1.5rem}
.equip{list-style:none;display:grid;gap:.6rem}
.equip li{padding-left:1.2rem;position:relative}.equip li::before{content:"◆";position:absolute;left:0;color:var(--purple);font-size:.7rem;top:.3rem}
.equip b{color:var(--head)}
figcaption{font-size:.8rem;letter-spacing:.1em;text-align:center;margin-top:.5rem;color:var(--head)}

.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.gallery figure{background:rgba(14,8,20,.75);border:1px solid rgba(107,63,160,.45);padding:.8rem;display:flex;flex-direction:column;justify-content:space-between;transition:transform .3s,border-color .3s,box-shadow .3s}
.gallery figure:hover{transform:translateY(-4px);border-color:var(--orange);box-shadow:0 0 24px rgba(232,120,48,.25)}
.gallery img{margin:auto;max-height:220px;width:auto}
.gallery .g-wide{grid-column:1/-1}.gallery .g-wide img{max-height:none;width:100%}

.track{display:flex;align-items:center;justify-content:center;gap:1rem;margin:2.5rem 0 3.5rem;flex-wrap:wrap;text-align:center}
.t-step{border:1px solid var(--purple);padding:.8rem 1.2rem;background:rgba(42,22,64,.5);color:var(--head)}
.t-step small{display:block;font-family:"Courier New",monospace;opacity:.75}
.t-final{border-color:var(--orange);box-shadow:0 0 18px rgba(232,120,48,.35)}
.t-arrow{color:var(--orange);font-size:1.2rem}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1.4rem;margin-top:1rem}
.card{position:relative;aspect-ratio:5/7;padding:1.4rem 1.1rem 1rem;background:linear-gradient(170deg,#2b1a10,#120a08 60%);border:3px solid #b06a35;box-shadow:inset 0 0 0 2px #3a2010,0 10px 30px rgba(0,0,0,.6);display:flex;flex-direction:column;gap:.4rem;transition:transform .3s,box-shadow .3s}
.card.legend{background:linear-gradient(170deg,#2a1640,#0e0814 60%);border-color:#6d6d78;box-shadow:inset 0 0 0 2px #2a2a33,0 0 26px rgba(200,30,60,.35)}
.card:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:0 0 34px rgba(232,120,48,.45)}
.card .cost{position:absolute;top:-12px;left:-12px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#ffb347,#a8461a);color:#1a0a05;font:700 1.1rem Cinzel,serif;border:2px solid #1a0a05}
.card small{font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.card h4{color:var(--head);font-size:1.05rem;line-height:1.3}
.card em{font-style:normal;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--orange2)}
.card.legend em{color:#e05070}
.card p{font-size:.85rem;line-height:1.5;flex:1}
.card footer{font-size:.7rem;border-top:1px solid var(--line);padding-top:.4rem;opacity:.8}

.signup{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;max-width:560px;margin:0 auto}
.signup input{flex:1 1 260px;padding:.85rem 1rem;background:rgba(7,5,12,.85);border:2px solid var(--purple);color:var(--head);font:inherit}
.signup input:focus{border-color:var(--orange);outline:none;box-shadow:0 0 14px rgba(232,120,48,.35)}
.form-msg{flex-basis:100%;text-align:center;min-height:1.5em;font-size:.9rem;color:var(--orange2)}
.foot{text-align:center;padding:3rem 1rem 4rem;border-top:1px solid var(--line);font-size:.8rem;opacity:.8}
.foot img{width:64px;margin:0 auto 1rem}

.torch{position:fixed;top:30vh;width:96px;height:192px;z-index:40;pointer-events:none;background:url(assets/torch/torch_sheet.png) 0 0/768px 192px no-repeat;image-rendering:pixelated;animation:torchIdle .72s steps(8) infinite;transform-origin:50% 31%}
@keyframes torchIdle{to{background-position:-768px 0}}
.torch-l{left:clamp(4px,2vw,40px)}.torch-r{right:clamp(4px,2vw,40px)}

.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform .9s ease}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}

@media (max-width:1180px){.torch{width:48px;height:96px;background-size:384px 96px;animation-name:torchIdleS;opacity:.85}@keyframes torchIdleS{to{background-position:-384px 0}}}
@media (max-width:760px){
 body{background-attachment:scroll;background-size:auto,192px}
 .nav ul{gap:.8rem}.nav ul li:not(:last-child){display:none}
 .torch{width:48px;height:96px;background-size:384px 96px;animation-name:torchIdleS;top:auto;bottom:16px;opacity:.75}
 .char{grid-template-columns:1fr}.char-art{max-width:260px;margin:0 auto}.char .lead{text-align:center}
 .section{padding:3.5rem 1.25rem}
}
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .reveal{opacity:1;transform:none}
}

/* Intro livro + nome */
.intro{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:#050308;transition:opacity .7s ease,visibility .7s}
.intro.done{opacity:0;visibility:hidden;pointer-events:none}
.intro-stage{position:relative;width:min(100vw,1100px);max-height:100vh;aspect-ratio:16/9}
.intro-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:transparent;opacity:0;pointer-events:none}
.intro-video.is-active{opacity:1}
.intro-hint{position:absolute;bottom:4.2rem;left:50%;transform:translateX(-50%);margin:0;z-index:2;color:var(--head);font:600 .75rem Cinzel,serif;letter-spacing:.18em;text-transform:uppercase;opacity:.85;animation:introHint 2.2s ease-in-out infinite}
.intro-hint[hidden]{display:none}
@keyframes introHint{0%,100%{opacity:.35;transform:translateX(-50%) translateY(0)}50%{opacity:.95;transform:translateX(-50%) translateY(4px)}}
.intro-skip{position:absolute;bottom:1.4rem;right:1.4rem;z-index:2;background:rgba(7,5,12,.7);color:var(--head);border:1px solid var(--line);padding:.55rem 1rem;letter-spacing:.12em;font:600 .8rem Cinzel,serif;cursor:pointer}
.intro-skip:hover{border-color:var(--orange);color:var(--orange2)}
body.intro-lock{overflow:hidden}
body.intro-lock .nav,body.intro-lock .torch{visibility:hidden}

/* TESTE hold layers (geometria de assets/hold/layers.json, frame 1200x1200) */
.hold-stack{position:absolute;top:0;left:50%;height:100%;aspect-ratio:1/1;transform:translateX(-50%);opacity:0;pointer-events:none;transition:opacity .25s;isolation:isolate}
body.intro-hold .hold-stack{opacity:1}
body.intro-hold #intro-a{opacity:0}
.hold-stack img{position:absolute;display:block;max-width:none}
.hold-book{inset:0;width:100%;height:100%}
.hold-iris,.hold-glow{inset:0;width:100%;height:100%;will-change:transform}
.hold-glow{mix-blend-mode:lighter;mix-blend-mode:plus-lighter}
