/* Mineral Presença V2: one immersive stage, with copy above the footage. */
.presence-v2 .story-stage{background:#101410}
.presence-v2 .story-stage .story-media{inset:0;width:100%;height:100%;max-width:none;max-height:none;aspect-ratio:auto;transform:none;margin:0;border:0;box-shadow:none}
.presence-v2 .story-media img,.presence-v2 .story-media video{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.presence-v2 .story-stage .story-shade{display:block;inset:0;background:linear-gradient(0deg,rgba(9,12,10,.94) 0%,rgba(9,12,10,.76) 25%,rgba(9,12,10,.12) 68%),linear-gradient(90deg,rgba(9,12,10,.36),transparent 75%),linear-gradient(180deg,rgba(9,12,10,.7),transparent 23%);transition:opacity .25s}
.presence-v2 .story-stage .story-copy{left:0;right:0;top:auto;bottom:115px;transform:none;width:min(100% - 112px,1400px);margin-inline:auto;transition:opacity .25s;pointer-events:none}
.presence-v2 .story-copy h2{max-width:820px;font-size:clamp(52px,5.9vw,88px);line-height:.98;letter-spacing:-.065em;margin-bottom:23px;text-shadow:0 2px 25px #0008}
.presence-v2 .story-copy p{max-width:530px;color:#f5f2ec;font-size:18px;line-height:1.55;text-shadow:0 1px 12px #000b}
.presence-v2 .chapter-count{color:#e6ded1;margin-bottom:22px}
.presence-v2 .chapter-count b{color:#edbd80}
.presence-v2 .story-top{align-items:flex-start;gap:28px;position:relative;z-index:2}
.presence-v2 .story-top .eyebrow{color:#eed8bb;text-shadow:0 1px 8px #000a}
.story-tools{display:flex;align-items:center;gap:28px}
.presence-v2 .story-mode{color:#f5f2ec;text-shadow:0 1px 8px #000a}
.scene-toggle{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 14px;min-height:44px;border:1px solid #e8d4b66b;color:#f5f2ec;background:#151a17b8;font:10px DMMono,monospace;letter-spacing:.015em;white-space:nowrap;cursor:pointer}
.scene-toggle span{font-size:16px;line-height:1}
.scene-toggle:hover,.scene-toggle[aria-pressed=true]{background:#e8d4b6;color:#171a17;border-color:#e8d4b6}
.presence-v2 .story-bottom{z-index:2;color:#f5f2ec}
.presence-v2 .story-bottom>span{color:#f5f2ec;text-shadow:0 1px 8px #000}
.presence-v2 .story-progress{background:#f5f2ec55}
.presence-v2 .story-progress span{background:#edbd80}
/* Evidence cards live low in these scenes; place the editorial copy higher. */
@media(min-width:801px){
 .presence-v2 .story-stage[data-chapter="2"] .story-copy,
 .presence-v2 .story-stage[data-chapter="3"] .story-copy,
 .presence-v2 .story-stage[data-chapter="4"] .story-copy{top:122px;bottom:auto}
 .presence-v2 .story-stage[data-chapter="2"] .story-copy h2,
 .presence-v2 .story-stage[data-chapter="3"] .story-copy h2,
 .presence-v2 .story-stage[data-chapter="4"] .story-copy h2{font-size:clamp(46px,4.7vw,68px);max-width:730px;margin-bottom:20px}
 .presence-v2 .story-stage[data-chapter="2"] .story-shade,
 .presence-v2 .story-stage[data-chapter="3"] .story-shade,
 .presence-v2 .story-stage[data-chapter="4"] .story-shade{background:linear-gradient(180deg,rgba(9,12,10,.92),rgba(9,12,10,.7) 32%,rgba(9,12,10,.05) 67%,rgba(9,12,10,.65)),linear-gradient(90deg,rgba(9,12,10,.35),transparent 75%)}
}
/* Read the full frame on demand, without changing the scroll position or time. */
.presence-v2 .scene-clear .story-media video,.presence-v2 .scene-clear .story-media img{object-fit:contain;object-position:center;background:#101410}
.presence-v2 .story-stage.scene-clear .story-shade,.presence-v2 .scene-clear .story-copy{opacity:0}
.presence-v2 .scene-clear .story-top>.eyebrow,.presence-v2 .scene-clear .story-mode{visibility:hidden}
.presence-v2 .scene-clear .story-top{pointer-events:none}
.presence-v2 .scene-clear .scene-toggle{pointer-events:auto}
@media(max-width:1150px){.presence-v2 .story-stage .story-copy{width:calc(100% - 72px)}.story-tools{gap:16px}}
@media(max-width:800px){
 .presence-v2 .story-stage,.presence-v2.no-film .story-stage{height:100svh;min-height:650px}
 .presence-v2.has-scrub .story-stage{height:100svh;min-height:620px}
 .presence-v2 .story-stage .story-copy{top:auto;bottom:105px;width:calc(100% - 44px)}
 .presence-v2 .story-copy h2{font-size:clamp(36px,8vw,58px);line-height:1.02;max-width:570px;margin-bottom:20px;letter-spacing:-.06em}
 .presence-v2 .story-copy p{font-size:15px;line-height:1.55;max-width:450px}
 .presence-v2 .chapter-count{font-size:10px;margin-bottom:18px}
 .presence-v2 .story-top{padding-top:25px;gap:15px;align-items:flex-start}
 .presence-v2 .story-top>.eyebrow{max-width:45%;font-size:8px;letter-spacing:.07em;line-height:1.6}
 .story-tools{display:flex;flex-direction:column-reverse;align-items:flex-end;gap:10px}
 .scene-toggle{min-height:44px;font-size:8px;padding:9px 10px;gap:8px}
 .presence-v2 .story-mode{font-size:8px;max-width:150px}
 .presence-v2 .story-stage .story-shade{background:linear-gradient(0deg,rgba(9,12,10,.98),rgba(9,12,10,.88) 29%,rgba(9,12,10,.23) 64%,rgba(9,12,10,.4)),linear-gradient(180deg,rgba(9,12,10,.7),transparent 22%)}
 .presence-v2 .story-stage[data-chapter="1"] .story-media video{object-position:64% center}
 .presence-v2 .story-stage[data-chapter="3"] .story-media video{object-position:30% center}
 .presence-v2 .story-stage[data-chapter="4"] .story-media video{object-position:35% center}
 .presence-v2 .story-stage[data-chapter="5"] .story-media video{object-position:65% center}
 .presence-v2 .story-stage.scene-clear .story-media video{object-position:center}
 .presence-v2 .story-bottom{bottom:30px}
}
@media(max-width:480px){.presence-v2 .story-stage .story-copy{width:calc(100% - 36px);bottom:92px}.presence-v2 .story-copy h2{font-size:clamp(34px,8.8vw,43px)}.presence-v2 .story-copy p{font-size:14px;max-width:360px}.presence-v2 .story-bottom>span{font-size:8px;gap:10px}}
@media(max-height:660px) and (min-width:801px){.presence-v2 .story-stage .story-copy{bottom:85px}.presence-v2 .story-copy h2{font-size:48px}.presence-v2 .story-copy p{font-size:16px}.presence-v2 .story-stage[data-chapter="2"] .story-copy,.presence-v2 .story-stage[data-chapter="3"] .story-copy,.presence-v2 .story-stage[data-chapter="4"] .story-copy{top:110px;bottom:auto}}
@media(prefers-reduced-motion:reduce){.presence-v2 .story-stage .story-copy,.presence-v2 .story-stage .story-shade{transition:none}}

/* ELEVEN11 · ajustes (03/11/2026). No fim de presence-v2.css, a última folha carregada: empatando em especificidade, valem.
   Tipografia: títulos e números de destaque em Inter Tight, a família que o pacote já trazia para o texto. Antes eram
   Arial/Helvetica do sistema (Helvetica no Mac, Arial no Windows, Roboto ou Liberation no Android e no Linux), com o
   tracking afinado para a Helvetica (−0,075 a −0,087 em), que encostava letras nos demais sistemas. Agora o desenho é o
   mesmo em todo aparelho, em seminegrito (o "600" pedia um peso que a Arial não tem e virava negrito). */
h1,h2{font-family:InterTight,Arial,Helvetica,sans-serif;font-weight:600;letter-spacing:-.05em;font-kerning:normal;text-rendering:optimizeLegibility}
.hero h1{letter-spacing:-.058em}
/* Texto vazado: com tracking negativo os contornos de letras vizinhas se cruzam; um pouco mais de ar e o traço fica limpo. */
.outline{letter-spacing:-.03em}
.presence-v2 .story-copy h2{letter-spacing:-.048em}
.weight-values b,.difference>strong,.document-list strong{font-family:InterTight,Arial,sans-serif;font-weight:600;font-variant-numeric:tabular-nums}
.weight-values b,.difference>strong{letter-spacing:-.055em}
.document-list strong{letter-spacing:-.035em}
.panel-copy h3,.prevention-path h3{letter-spacing:-.045em}
@media(min-width:801px){.presence-v2 .story-copy h2{letter-spacing:-.05em}}
@media(max-width:800px){.presence-v2 .story-copy h2{letter-spacing:-.045em}}
/* Textos pequenos (8 a 11 px): a Inter Tight é desenhada para títulos e fica apertada em corpo pequeno; um respiro mínimo. */
.media-note,.motion-toggle,.demo-toolbar>span,.site-footer p,.screen-toolbar>span,.screen-caption,.sources p,.sources li,.demo-disclaimer,.data-strip,.panel-copy .panel-note,.film-dialog-footer,.weight-values small,.document-list small,.research-note p,.status-chip,.difference>span{letter-spacing:.02em;word-spacing:.04em}
/* Hero no celular em pé: o trailer tem um corte vertical próprio (media/lince-trailer-mobile.mp4, recortado plano a
   plano) e preenche a tela, no lugar da faixa 16:9 em "contain" sobre o poster apagado. Tablets usam o trailer horizontal. */
.hero-media>picture{display:block;width:100%;height:100%}
@media(max-width:800px){
 .hero-media img,.hero-media video{object-fit:cover;object-position:58% center}
 .hero-media:has(video.is-ready){background:none}
 .hero-media:has(video.is-ready) .hero-poster{opacity:1}
}
@media(max-width:600px) and (orientation:portrait){.hero-media img,.hero-media video,.hero-media:has(video.is-ready) video{object-fit:cover;object-position:50% 50%}}
/* Rodapé: marca e aviso na linha de cima; créditos do estúdio embaixo, em linha própria. */
.site-footer>.wrap{flex-wrap:wrap}
.site-footer .footer-credit{flex-basis:100%}
@media(max-width:800px){.site-footer>.wrap>p{margin-left:auto;text-align:right}}
@media(max-width:480px){.site-footer>.wrap>p{margin-left:0;text-align:left}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Narrativa, capítulo 6 (desktop): os últimos quadros do scrub trazem a assinatura "Mais precisão. Mais fluidez." gravada no
   canto inferior esquerdo, exatamente sob o texto do capítulo (já era assim no pacote). Como o cliente fez nos capítulos
   2 a 4, o texto sobe para o topo, sobre o céu da rodovia, e as duas frases deixam de se sobrepor. */
@media(min-width:801px){
 .presence-v2 .story-stage[data-chapter="6"] .story-copy{top:122px;bottom:auto}
 .presence-v2 .story-stage[data-chapter="6"] .story-copy h2{font-size:clamp(46px,4.7vw,68px);max-width:730px;margin-bottom:20px}
 .presence-v2 .story-stage[data-chapter="6"] .story-shade{background:linear-gradient(180deg,rgba(9,12,10,.92),rgba(9,12,10,.7) 32%,rgba(9,12,10,.05) 67%,rgba(9,12,10,.65)),linear-gradient(90deg,rgba(9,12,10,.35),transparent 75%)}
}
@media(max-height:660px) and (min-width:801px){.presence-v2 .story-stage[data-chapter="6"] .story-copy{top:110px;bottom:auto}}
/* Contraste (WCAG AA 4,5:1) na barra lateral da demonstração, sobre #EAE3D8: os mesmos tons do cliente, um passo mais
   escuros. Abas inativas e números #70685B (4,3:1) → #6A6255 (4,7:1); rótulo "Ocorrência 0248" #84613D (4,4:1) → #7C5B39 (4,8:1). */
.demo-steps button,.demo-steps button span{color:#6a6255}
.demo-sidebar>.eyebrow{color:#7c5b39}
.demo-steps button[aria-selected=true]{color:var(--graphite)}
.demo-steps button[aria-selected=true] span,.demo-steps button:hover{color:var(--bronze)}
/* "Base da narrativa", sobre #EAE4DA: texto de apoio #6D685F (4,4:1) → #625C53 (5,2:1). */
.sources{color:#625c53}
/* Narrativa "02 / Veja a relação entre os sinais": o vídeo avança 20 % mais devagar por pixel rolado. O percurso da cena
   fixa (altura da trilha − 1 tela) cresce 25 %: desktop 450 → 562,5 svh (trilha 550 → 662,5 svh), celular em pé
   320 → 400 svh (trilha 420 → 500 svh). Os capítulos seguem nas mesmas proporções do filme. */
.has-scrub .story-track{height:662.5svh}
@media(max-width:800px) and (min-height:620px) and (prefers-reduced-motion:no-preference){.has-scrub .story-track{height:500svh!important}}
