/* V26 (22/09/2026): as camadas V22 -> V25 consolidadas numa passada so. O que era sobrescrito depois
   saiu, o que valia continua igual (conferido por estilo computado, elemento a elemento). Fontes: so as
   faces que a pagina usa. */
@font-face{font-family:Inter;src:url('fonts/inter-latin-400-normal.8909904ab6.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('fonts/inter-latin-500-normal.f3779f1efc.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url('fonts/inter-latin-600-normal.f9a06e79cd.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('fonts/instrument-serif-latin-400-normal.5eb09b5ac0.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Pinyon Script';src:url('fonts/pinyon-script-latin-400-normal.7d244a9dc0.woff2') format('woff2');font-weight:400;font-display:swap}
:root{--ink:#0F1010;--paper:#D8DADB;--muted:#787C7C;--earth:#7E5B47;--copper:#B98A6B;--title-size:clamp(2rem,3.15vw,2.75rem);--body-size:clamp(1.0625rem,1.25vw,1.125rem);--copy-width:32rem;--gutter:7vw;color-scheme:dark;font-family:Inter,Arial,sans-serif;font-synthesis:none}
/* Rolagem nativa sem 'smooth': quem suaviza e o Lenis (roda) ou o irPara (botoes). Com 'smooth' aqui, um
   Tab ate o CTA atravessava a cidade inteira numa rolagem de 13 mil px. */
*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:0;background:var(--ink);scrollbar-color:var(--earth) var(--ink)}
/* O foco do teclado nunca fica escondido atras do cabecalho (ele cobre a faixa de cima enquanto nao e empurrado). */
a,button,summary{scroll-margin-top:8.5rem}@media(max-width:900px){a,button,summary{scroll-margin-top:7rem}}
/* Lenis (so na roda do mouse/trackpad): ele e quem suaviza, o navegador nao pode suavizar por cima. */
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-stopped{overflow:clip}
body{margin:0;color:var(--paper);background:var(--ink);overflow-x:clip}
p,h1,h2{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
a,button,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--copper);outline-offset:6px}
::selection{background:var(--copper);color:var(--ink)}
.skip{position:fixed;z-index:100;left:1rem;top:-5rem;background:var(--paper);color:var(--ink);padding:1rem}.skip:focus{top:1rem}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Cabecalho: se sustenta pela sombra do proprio texto, sem faixa sobre a imagem (V25). */
.header{position:fixed;z-index:30;top:0;inset-inline:0;padding:2rem 4.5vw;display:flex;align-items:center;justify-content:space-between;pointer-events:none}
/* O texto empurra o cabecalho pra fora da tela (site.js); a volta desliza. Com foco do teclado, fica. */
.header.deslizando{transition:transform .42s cubic-bezier(.2,.7,.2,1)}.header:has(:focus-visible){transform:none!important}
.header a{pointer-events:auto}.header .brand,.header nav{text-shadow:0 1px 3px rgba(15,16,16,.95),0 2px 14px rgba(15,16,16,.85),0 0 28px rgba(15,16,16,.6)}
.brand{font-size:clamp(1.25rem,1.75vw,1.75rem);font-weight:600;letter-spacing:-.035em;line-height:1.1}
.brand span{display:block;margin-top:.5rem;font-size:.78rem;font-weight:400;letter-spacing:0}
.header nav{display:flex;align-items:center;gap:2.8rem;font-size:.94rem}
.nav-cta{display:flex;gap:1rem;align-items:center;position:relative;padding:.4rem 0}
.nav-cta:after{content:'';position:absolute;height:1px;background:var(--paper);bottom:0;left:0;width:100%;transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav-cta:hover:after{transform:scaleX(1)}

/* A cena. Uma imagem por vez, desenhada pelo motor (motor/compositor.js); a <img> e so o que aparece
   antes do primeiro desenho, com o MESMO enquadramento (zoom 1.018 e foco, ajustados no <head>). */
#cinema{display:none;position:fixed;inset:0;z-index:0;background:var(--ink);overflow:hidden;pointer-events:none}.enhanced #cinema{display:block}
/* Toque: altura fixa na maior janela. A barra de endereco aparecendo/sumindo nao redimensiona o canvas. */
@media(pointer:coarse){#cinema{bottom:auto;height:100lvh}}
#fallback-scene,#world-canvas{position:absolute;inset:0;width:100%;height:100%}
#world-canvas{opacity:0}#cinema.webgl-ready #world-canvas{opacity:1}#cinema.webgl-ready #fallback-scene{visibility:hidden}
#fallback-scene img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:var(--foco-x,50%) 50%;transform:scale(1.018)}
/* A mesma luz de leitura do shader, pra imagem de reserva nao escurecer de repente quando o canvas assume. */
#fallback-scene:after{content:'';position:absolute;inset:0;opacity:var(--la,0);background:radial-gradient(ellipse var(--lw,600px) var(--lh,460px) at var(--lx,30%) var(--ly,50%),rgba(15,16,16,.34) 0%,rgba(15,16,16,.28) 34%,rgba(15,16,16,.15) 60%,transparent 100%)}
.scene-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(15,16,16,.16));opacity:calc(1 - var(--room-entry,0))}
.faq-shade{position:absolute;inset:0;background:var(--ink);opacity:0;z-index:5;pointer-events:none;will-change:opacity}

/* Capitulos e leitura */
main{position:relative;z-index:1}.chapter{position:relative;min-height:100svh}
.stage{position:relative;min-height:100svh;display:flex;align-items:center;padding:8rem var(--gutter);isolation:isolate;overflow:clip}
.reading-image{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;opacity:.55}
.stage:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(15,16,16,.74),rgba(15,16,16,.1)),linear-gradient(transparent 55%,var(--ink))}
.copy{width:100%;min-width:0;max-width:var(--copy-width);position:relative}
.copy h1,.copy h2,.body-copy{width:100%;max-width:none}
/* Titulos: Instrument Serif; o destaque em cobre com a inicial em Pinyon Script (V22). */
.copy h1,.copy h2,.faq-intro h2{font-family:'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-.005em;text-wrap:balance}
.copy h1{font-size:clamp(2.5rem,4.6vw,4.1rem);line-height:1.02;margin-bottom:1.5rem}
.copy h2{font-size:clamp(2.35rem,3.9vw,3.4rem);line-height:1.05;margin-bottom:1.5rem}
.faq-intro h2{font-size:clamp(2rem,3vw,2.75rem);line-height:1.2;margin-bottom:0}
.copy h1 strong,.copy h2 strong,.faq-intro h2 strong{font-weight:400;font-style:normal;color:var(--copper)}
.lead{white-space:nowrap}
.script{font-family:'Pinyon Script',cursive;font-size:1.42em;line-height:0;display:inline-block;vertical-align:baseline;margin:0 .03em 0 .02em;letter-spacing:0;transform:translateY(.02em)}
.reading-line{display:block}.compound{white-space:nowrap}
.body-copy{font-size:var(--body-size);line-height:1.6;letter-spacing:0;text-wrap:pretty;hyphens:none}
.body-copy p+p{margin-top:.8em}
.enhanced .copy h1,.enhanced .copy h2{color:#ece8e2}
.enhanced .body-copy{color:#e5e4e1}
.story-start{display:inline-flex;margin-top:1.75rem;gap:1.25rem;font-size:.875rem;align-items:center}.story-start span{font-size:1.2rem}
.chapter-1 .stage{justify-content:flex-end}
.chapter-2 .stage{justify-content:center}.chapter-2 .copy{text-align:center}
.chapter-4 .copy,.chapter-5 .copy,.chapter-6 .copy{width:min(43vw,var(--copy-width))}
.chapter-4 .reading-image,.chapter-5 .reading-image,.chapter-6 .reading-image{left:auto;right:0;width:66%;object-fit:cover;object-position:80% center}
.chapter-4 .stage:before,.chapter-5 .stage:before,.chapter-6 .stage:before{background:linear-gradient(90deg,var(--ink),rgba(15,16,16,.85) 35%,transparent 85%)}
.credentials{color:var(--copper);font-size:.875rem;line-height:1.7;margin-top:1.35rem}
.session-facts{list-style:none;display:flex;flex-wrap:wrap;gap:1.35rem;padding:0;margin:1.5rem 0 0;color:var(--copper);font-size:.9375rem}
.session-facts li{display:flex;align-items:center;gap:.5rem;white-space:nowrap}.session-facts svg{width:1.2rem;height:1.2rem;flex:none}
.cta{display:inline-flex;inline-size:max-content;max-inline-size:100%;align-items:center;justify-content:center;gap:.75rem;padding:1rem 1.25rem;border-radius:100px;color:var(--ink);background:var(--paper);font-size:1rem;font-weight:500;line-height:1.4;transition:background .2s,transform .2s}
.cta>span:last-child{flex:none;font-size:1.1em}.cta:hover{background:white;transform:translateY(-2px)}.cta:active{transform:scale(.98)}
.chapter-6 .cta{margin-top:1.5rem}.contact-note{font-size:.8125rem;line-height:1.5;margin-top:.75rem}
.faq-link{display:inline-flex;gap:1rem;margin-top:1.4rem;font-size:.875rem;line-height:1.5}
@media(min-width:901px){.body-copy,.copy .credentials,.copy .contact-note{max-width:26.5rem}.chapter-2 .body-copy{margin-inline:auto}}
@media(max-width:1100px) and (min-width:901px){.chapter-4 .copy,.chapter-5 .copy,.chapter-6 .copy{width:min(45vw,var(--copy-width))}}

/* Com o motor: capitulos altos, palco preso (sticky). Leitura devagar, depois viagem (V24). */
.enhanced .chapter{height:180svh;min-height:0}
.enhanced .chapter-0,.enhanced .chapter-1{height:320svh}.enhanced .chapter-2,.enhanced .chapter-3{height:260svh}
.enhanced .chapter-5{height:150svh}.enhanced .chapter-6{height:125svh}
.enhanced .stage{position:sticky;top:0;height:100svh;min-height:0;overflow:visible}.enhanced .reading-image,.enhanced .stage:before{display:none}
.enhanced .chapter.flow{height:auto;min-height:100svh}.enhanced .chapter.flow .stage{height:auto;min-height:100svh;position:relative;overflow:visible}
/* O parallax do ponteiro (so desktop) e escrito direto na copia ativa pelo site.js. */
@media(min-width:901px){.enhanced .copy{will-change:transform}}

/* Controles */
.experience-controls{display:none;position:fixed;z-index:40;bottom:1.3rem;left:4.5vw;right:4.5vw;justify-content:space-between;align-items:center;pointer-events:none}
.enhanced .experience-controls{display:flex}.experience-controls button{pointer-events:auto;font-size:.8125rem;min-width:44px;min-height:44px;padding:.65rem 0}
.preferences,.progress-tools{display:flex;align-items:center;gap:1.5rem}.progress-tools{gap:1.1rem}.progress-tools>span{font-size:.75rem;font-variant-numeric:tabular-nums;letter-spacing:.08em}
#next{display:grid;place-items:center;width:2.75rem;height:2.75rem;border:1px solid rgba(216,218,219,.45);border-radius:50%;font-size:1.2rem}
#sound{display:flex;align-items:center;gap:.65rem}.sound-icon{display:flex;align-items:center;gap:3px;height:16px}
.sound-icon i{width:2px;height:7px;background:var(--paper)}.sound-icon i:nth-child(2){height:13px}.sound-icon i:nth-child(3){height:10px}
[aria-pressed=true] .sound-icon i{animation:meter .95s ease-in-out infinite alternate}[aria-pressed=true] .sound-icon i:nth-child(2){animation-delay:-.7s}[aria-pressed=true] .sound-icon i:nth-child(3){animation-delay:-.3s}
@keyframes meter{from{transform:scaleY(.4)}to{transform:scaleY(1)}}
.reading-progress{position:fixed;z-index:45;left:0;bottom:0;width:100%;height:2px;pointer-events:none}.reading-progress i{height:100%;display:block;background:var(--copper);transform:scaleX(0);transform-origin:left;will-change:transform}

/* FAQ e rodape */
.faq-section{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1.4fr;align-content:start;gap:6vw;padding:8rem 8vw 4rem}
.faq-intro .cta{margin-top:1.5rem}
.faq-list details{border-top:1px solid rgba(216,218,219,.25);padding:1.5rem 0}.faq-list details:last-child{border-bottom:1px solid rgba(216,218,219,.25)}
.faq-list summary{list-style:none;display:flex;gap:1.25rem;align-items:center;justify-content:space-between;cursor:pointer;font-size:1.0625rem;line-height:1.5;font-weight:500}
.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{font-size:1.4rem;font-weight:400;color:var(--copper)}.faq-list details[open] summary span{transform:rotate(45deg)}
.faq-list details p{font-size:1rem;line-height:1.7;max-width:38rem;padding:1rem 2rem 0 0}
.footer{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1.4fr;align-items:start;gap:9vw;padding:3rem 8vw 7rem;font-size:.83rem}
.footer p{line-height:1.7}.footer-identity .brand{display:inline-block}.footer-identity>p{margin-top:1.2rem}.back-top{display:inline-flex;align-items:center;gap:1rem;margin-top:1.8rem}
.footer-safety{max-width:38rem;font-size:.875rem;line-height:1.7}.footer-safety .safety-title{font-size:1rem;font-weight:500;margin-bottom:.85rem}
.footer-safety p a{text-decoration:underline;text-underline-offset:.22em;text-decoration-color:var(--copper)}
.safety-source{display:inline-block;color:var(--copper);font-size:.8rem;margin-top:.9rem;line-height:1.6}
/* No FAQ a barra de controles e solida, com borda seca: as perguntas passavam por baixo dos rotulos e os
   dois textos se misturavam no celular (auditoria de 22/09/2026). */
.in-faq .progress-tools{display:none}.in-faq .experience-controls{background:var(--ink);bottom:0;left:0;right:0;padding:1.5rem 4.5vw 1rem}

@media(max-width:900px){
 :root{--title-size:clamp(1.75rem,7.7vw,2.25rem);--body-size:1rem;--gutter:6vw}
 .header{padding:1.5rem 6vw}.brand{font-size:1.25rem}.brand span{font-size:.6875rem;margin-top:.4rem}
 .header nav{gap:0;font-size:.8125rem}.header nav>a:first-child{display:none}.nav-cta{gap:.65rem}
 .stage{padding:7rem var(--gutter);justify-content:center}
 .copy h1{font-size:clamp(2.4rem,10vw,3.1rem);margin-bottom:1.25rem}
 .copy h2{font-size:clamp(2.1rem,8.6vw,2.8rem);margin-bottom:1.25rem}
 .body-copy{line-height:1.6}.body-copy p+p{margin-top:.8em}
 .chapter-4 .stage,.chapter-5 .stage,.chapter-6 .stage{padding:42svh var(--gutter) 6rem;align-items:flex-start;justify-content:center}
 .chapter-4 .copy,.chapter-5 .copy,.chapter-6 .copy{width:100%}
 .credentials{font-size:.875rem;margin-top:1.25rem}
 .experience-controls{bottom:0;left:0;right:0;padding:.75rem 6vw .5rem;background:linear-gradient(transparent,rgba(15,16,16,.85) 90%)}
 .preferences{gap:1rem}.progress-tools{gap:.65rem}.experience-controls button{font-size:.75rem}.progress-tools>span{font-size:.6875rem}
 .session-facts{gap:1.2rem;font-size:.875rem}.session-facts li{gap:.45rem}.session-facts svg{width:1.1rem;height:1.1rem}
 .chapter-4 .reading-image,.chapter-5 .reading-image,.chapter-6 .reading-image{width:100%;height:100%;object-position:80% 50%}
 .chapter-4 .stage:before,.chapter-5 .stage:before,.chapter-6 .stage:before{background:linear-gradient(0deg,rgba(0,0,0,.64) 38%,transparent 85%)}
 .faq-section{padding:6rem 6vw 3rem;gap:1.5rem}.footer{padding-inline:6vw}
 /* V22d: no celular cada capitulo tem o seu lugar (texto onde a imagem esta vazia). */
 .chapter-0 .stage{align-items:flex-start;padding-top:7.5rem}
 .chapter-1 .stage,.chapter-3 .stage{align-items:flex-end;padding-bottom:7.5rem}
 .chapter-2 .stage{align-items:flex-start;padding-top:8rem}
 .chapter-1 .copy h2 br{display:none}
 .enhanced .chapter-0,.enhanced .chapter-1{height:280svh}
 .enhanced .chapter-2,.enhanced .chapter-3{height:240svh}
 .enhanced .chapter.flow{height:auto;min-height:100svh}
 /* Contraste sobre a imagem (V26): uma sombra colada as letras (poucos px), a mesma tecnica do cabecalho.
    Nada de nuvem larga: cortada pela linha do cabecalho, ela virava uma placa escura de borda reta. */
 .enhanced .copy h1,.enhanced .copy h2{text-shadow:0 1px 2px rgba(15,16,16,.85),0 0 3px rgba(15,16,16,.75),0 0 6px rgba(15,16,16,.45)}
 .enhanced .copy .body-copy,.enhanced .copy .credentials,.enhanced .copy .session-facts,.enhanced .copy .contact-note,.enhanced .copy .faq-link,.enhanced .copy .story-start{text-shadow:0 1px 2px rgba(15,16,16,.9),0 0 3px rgba(15,16,16,.7)}
}
@media(max-width:700px){
 .faq-section{grid-template-columns:1fr}.faq-intro .cta{margin-top:1rem}.faq-list details{padding:1.3rem 0}
 .faq-list summary{font-size:1rem}.footer{grid-template-columns:1fr;gap:2.5rem;padding-top:1.5rem;font-size:.8125rem}
}
/* Celular em pe (V26): o texto dos capitulos do filme fica embaixo, longe do rosto dele — em telas de
   altura real (iPhone com as barras) ele passava por cima dos olhos. O capitulo 2 desce pra faixa escura
   dos telhados, onde o titulo em cobre se le. */
@media(max-width:600px){
 .chapter-1 .stage{padding-bottom:4.5rem}
 .chapter-4 .stage,.chapter-5 .stage,.chapter-6 .stage{padding:30svh var(--gutter) 4.5rem;align-items:flex-end}
}
/* Celular deitado (V26): antes os sete capitulos viravam fluxo, o titulo era cortado pelo cabecalho e o
   CTA ficava sob os controles. */
@media(max-width:900px) and (orientation:landscape){
 .header{padding-block:.75rem}.brand span{margin-top:.2rem}:root{--body-size:.9375rem}.body-copy{line-height:1.5}
 .copy h1{font-size:clamp(1.75rem,9svh,2.4rem);margin-bottom:.75rem}.copy h2{font-size:clamp(1.6rem,8.5svh,2.2rem);margin-bottom:.75rem}
 .enhanced .stage,.enhanced .chapter-0 .stage,.enhanced .chapter-1 .stage,.enhanced .chapter-2 .stage,.enhanced .chapter-3 .stage,.enhanced .chapter-4 .stage,.enhanced .chapter-5 .stage,.enhanced .chapter-6 .stage{padding:4.25rem var(--gutter) 3.5rem;align-items:center}
 .enhanced .chapter-4 .stage,.enhanced .chapter-5 .stage,.enhanced .chapter-6 .stage{justify-content:flex-start}
 .chapter-4 .copy,.chapter-5 .copy,.chapter-6 .copy{width:min(56vw,var(--copy-width))}
 .story-start{margin-top:.75rem}.credentials,.session-facts{margin-top:.75rem}.chapter-6 .cta{margin-top:.9rem}.faq-link{margin-top:.6rem}
}
@media(max-width:360px){:root{--title-size:1.75rem}.brand{font-size:1.15rem}.header nav{font-size:.75rem}.preferences{gap:.75rem}.session-facts{gap:.85rem}}
@media(max-height:700px) and (min-width:901px){.stage{padding-block:6rem}:root{--title-size:clamp(2rem,3.15vw,2.5rem);--body-size:1rem}.body-copy{line-height:1.5}}

/* Movimento pausado e movimento reduzido: todo o conteudo, texto sempre inteiro (opacidade 1). */
.motion-reduced .chapter{height:auto;min-height:100svh}.motion-reduced .stage{position:relative;min-height:100svh;height:auto}
.motion-reduced .reading-image,.motion-reduced .stage:before{display:block}.motion-reduced #cinema{visibility:hidden}.motion-reduced .sound-icon i{animation:none}
.motion-reduced .copy{opacity:1!important;transform:none!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.enhanced .chapter{height:auto;min-height:100svh}.enhanced .stage{position:relative;min-height:100svh;height:auto}.enhanced .reading-image,.enhanced .stage:before{display:block}.enhanced #cinema{display:none}.enhanced .copy{opacity:1!important;transform:none!important}}