/* Confecção Individual Feline · apresentação do pitch (27/09/2026).
   Visual NOITE do formulário de aplicação: preto quente, oxblood em bloco cheio, marfim, pedra nos fios.
   Tudo que é desenhado é chapado (sem brilho, sem sombra, sem degradê); volume só nas fotos.
   Títulos em Bodoni Moda (a Cormorant tem o ê torto e o texto é cheio de "você"). */

:root{
  --noite-0:#0f0d0c; --noite-1:#161312; --noite-2:#1c1817; --noite-3:#221e1c; --noite-4:#2b2624;
  --oxblood:#4a1210; --oxblood-fundo:#360d0b; --oxblood-vivo:#b04a3f; --oxblood-claro:#d49a8f;
  --pedra:#6a6962; --pedra-media:#8a877f; --pedra-clara:#a8a49a;
  --marfim-texto:#e4e1d9; --marfim-corpo:#c9c4ba; --marfim-numero:#efebe3;
  --papel:#e6e2d9; --tinta:#1a1614; --tinta-corpo:#2e2926; --tinta-apoio:#57534c;
  --display:"Bodoni Moda","Didot","Times New Roman",serif;
  --sans:"Inter Tight","Helvetica Neue",Arial,sans-serif;
  --e:cubic-bezier(0.16,0.84,0.44,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--noite-0);overflow:hidden}
body{font-family:var(--sans);color:var(--marfim-corpo);-webkit-font-smoothing:antialiased;cursor:default}
body.sem-cursor{cursor:none}
ul,ol{list-style:none}
img{display:block}

/* palco fixo 1920×1080, escalado pra caber na tela */
.stage{position:absolute;left:50%;top:50%;width:1920px;height:1080px;transform:translate(-50%,-50%) scale(var(--k,1));transform-origin:center;overflow:hidden;background:var(--noite-1)}
.s{position:absolute;inset:0;background:var(--noite-1);opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s linear .6s}
.s.on{opacity:1;visibility:visible;transition:opacity .6s ease,visibility 0s}
.s.on.sai{opacity:0}

/* ---------- tipografia ---------- */
h1,h2,.t-xl,.t-l,.t-m,.letra,.numero,.noventa,.etapa-num span,.vezes,.ac-l,.ac-r,.cinco-lista li,.feline-fundo,.itens li span{font-optical-sizing:none;font-variation-settings:"opsz" 18}
h1,h2,.t-xl,.t-l,.t-m{font-family:var(--display);font-weight:500;color:var(--marfim-texto);letter-spacing:-.018em}
em{font-style:italic;color:var(--oxblood-claro)}
.t-gigante{font-size:320px;line-height:1}
.t-gigante-2{font-size:176px;line-height:1.02}
.t-xxl{font-size:128px;line-height:1.04}
.t-xl{font-size:100px;line-height:1.08}
.t-l{font-size:68px;line-height:1.18}
.t-m{font-size:50px;line-height:1.28}
.t-corpo{font:300 36px/1.5 var(--sans);color:var(--marfim-corpo);max-width:1180px}
.eyebrow{font:500 18px/1.2 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--pedra-clara)}
.filete{display:flex;align-items:center;width:240px;margin:22px 0 34px}
.filete::before{content:"";width:12px;height:17px;border:1.5px solid var(--pedra-clara);border-radius:50%;flex:0 0 auto}
.filete::after{content:"";height:1px;flex:1;background:var(--pedra)}
.meio-h .filete{margin-inline:auto}

/* ---------- molduras de texto ---------- */
.centro{position:absolute;inset:0;padding:0 200px;display:flex;flex-direction:column;justify-content:center}
.centro > * + *{margin-top:44px}
.centro > .filete,.centro > .eyebrow + .filete{margin-top:22px}
.centro > .filete + *{margin-top:0}
.centro h2{max-width:1560px}
.centro .t-m,.centro .t-l{max-width:1500px}
.meio-h{align-items:center;text-align:center}
.esq{position:absolute;left:160px;top:0;bottom:0;width:900px;display:flex;flex-direction:column;justify-content:center}
.dir{position:absolute;right:160px;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center}
.esq > * + *,.dir > * + *{margin-top:36px}
.esq > .filete,.dir > .filete{margin-top:22px}
.esq > .filete + *,.dir > .filete + *{margin-top:0}

.traco li{position:relative;padding-left:44px;font:300 32px/1.45 var(--sans);color:var(--marfim-corpo)}
.traco li + li{margin-top:22px}
.traco li::before{content:"";position:absolute;left:0;top:.72em;width:24px;height:1px;background:var(--oxblood-claro)}
.traco.grande li{font-size:36px}

/* ---------- animação de entrada (replay a cada vez que o slide entra) ---------- */
.a{opacity:0;transition:opacity .9s var(--e) var(--d,0ms),transform 1.1s var(--e) var(--d,0ms),clip-path 1.4s var(--e) var(--d,0ms),stroke-dashoffset 1.4s var(--e) var(--d,0ms)}
.up{transform:translateY(34px)}
.left{transform:translateX(-56px)}
.right{transform:translateX(56px)}
.pop{transform:scale(.7)}
.rise{transform:translateY(110px);transition-duration:1.2s,1.7s}
.rise-slow{transform:translateY(60px) scale(1.05);transform-origin:left bottom;transition-duration:1.4s,2.6s}
.grow{opacity:1;transform:scaleY(0);transform-origin:bottom;transition-duration:.01s,1.2s}
.wipe{opacity:1;clip-path:inset(0 100% 0 0)}
.reveal{opacity:1;clip-path:inset(100% 0 0 0)}
.unveil{opacity:1;clip-path:inset(0 0 100% 0);transition-duration:.01s,.01s,2s}
.m{display:block;overflow:hidden;padding:0 .12em .1em;margin:0 -.12em -.1em}
.line{display:inline-block;opacity:1;transform:translateY(110%);transition-duration:.01s,1.2s}
path.draw{opacity:1;stroke-dasharray:1;stroke-dashoffset:1}
.s.on .a{opacity:var(--op,1);transform:none}
.s.on .wipe,.s.on .reveal,.s.on .unveil{clip-path:inset(0 0 0 0)}
.s.on path.draw{stroke-dashoffset:0}
.s:not(.on) .a{transition:none}

/* fotos ganham um zoom lento depois de entrar */
.kb img,.caso-foto img,.larissa-foto img,.historia-fotos img{transform:scale(1.08);transition:transform 9s cubic-bezier(.2,.6,.3,1)}
.s.on .caso-foto img,.s.on .larissa-foto img,.s.on .historia-fotos img{transform:scale(1)}
.s:not(.on) img{transition:none}

/* ---------- superfícies ---------- */
.papel{background:var(--papel)}
.papel h1,.papel h2,.papel .t-xl,.papel .t-l,.papel .t-m{color:var(--tinta)}
.papel em{color:var(--oxblood)}
.papel .eyebrow{color:var(--tinta-apoio)}
.papel .filete::before{border-color:var(--tinta-apoio)}
.papel .filete::after{background:var(--pedra-media)}
.mult{mix-blend-mode:multiply}
.bloco{background:var(--oxblood)}
.bloco em{color:var(--oxblood-claro)}

/* ---------- cenas com a Carol (1, 14, 15, 16, 29) ----------
   uma foto só (Magnific, Nano Banana Pro: a foto dela + o cenário) e a névoa do feixe tirada dela; tools/cenas_ia.py */
.cena{position:absolute;inset:0;overflow:hidden;background:var(--noite-0)}
.cena img{position:absolute;inset:0;width:1920px;height:1080px}
.cena-foto{opacity:0;transform:scale(1.06);transform-origin:65% 45%}
.s.on .cena-foto{opacity:1;transform:scale(1);transition:opacity 1.6s ease,transform 16s cubic-bezier(.2,.6,.3,1)}
.cena-luz{mix-blend-mode:screen;opacity:0}
.s.on .cena-luz{animation:respira 7s ease-in-out 1.6s infinite both}
@keyframes respira{0%,100%{opacity:.04}50%{opacity:.16}}
.cena ~ .esq,.cena ~ .dir{z-index:2}

/* ---------- 01 abertura ---------- */
.abertura .esq{width:960px}
.abertura .t-xl{font-size:96px}
.abertura .t-m{color:var(--marfim-corpo);max-width:860px}

/* ---------- 02 o mármore rachado: cinco rachaduras, um ponto de impacto (foto Magnific seedream) ---------- */
.rachado{background:var(--noite-0)}
.rachado-foto{position:absolute;inset:0;width:1920px;height:1080px;opacity:0;transform:scale(1.08);transform-origin:1215px 665px}
.s.on .rachado-foto{opacity:1;transform:scale(1);transition:opacity 1.4s ease,transform 12s cubic-bezier(.2,.6,.3,1)}
.rachado-titulo{position:absolute;left:160px;right:160px;top:92px;text-align:center}
.pontas li{position:absolute;width:0;height:0}
.pontas li i{position:absolute;left:-7px;top:-10px;width:14px;height:20px;border-radius:50%;background:var(--noite-1);border:1.5px solid var(--marfim-texto)}
.pontas li span{position:absolute;white-space:nowrap;background:var(--noite-1);color:var(--marfim-texto);font:500 36px/1 var(--display);font-variation-settings:"opsz" 18;padding:12px 20px 14px}
.pontas .esq span{right:22px;top:-30px}
.pontas .cima span{left:50%;bottom:22px;transform:translateX(-50%)}
.pontas .baixo span{left:50%;top:22px;transform:translateX(-50%)}
.pontas li:first-child span{right:auto;left:22px;top:18px}
.impacto{position:absolute;left:1215px;top:665px;width:0;height:0}
.impacto i{position:absolute;border-radius:50%}
.impacto .miolo{left:-9px;top:-9px;width:18px;height:18px;background:var(--oxblood-vivo)}
.impacto .anel{left:-40px;top:-40px;width:80px;height:80px;border:2px solid var(--oxblood-vivo)}
.s.on .impacto .anel{animation:pulso 2.4s ease-out 2.6s infinite}
@keyframes pulso{0%{transform:scale(.3);opacity:1}100%{transform:scale(1.6);opacity:0}}
.fio-impacto{position:absolute;inset:0;width:1920px;height:1080px}
.fio-impacto path{fill:none;stroke:var(--oxblood-vivo);stroke-width:2}
.causa-bloco{position:absolute;left:1330px;top:740px;width:500px;background:var(--oxblood);padding:34px 40px 38px}
.causa-bloco .eyebrow{color:var(--oxblood-claro)}
.causa-bloco .t-m{margin-top:14px;font-size:50px;line-height:1.14}

/* ---------- 05 e 35: dividido ao meio ---------- */
.lado{position:absolute;top:0;bottom:0;width:960px;padding:0 120px;display:flex;flex-direction:column;justify-content:center}
.lado-a{left:0;background:var(--noite-3)}
.lado-b{right:0;background:var(--oxblood)}
.lado-b .eyebrow{color:var(--oxblood-claro)}
.letra{font:italic 400 240px/1 var(--display);color:var(--marfim-numero);margin:10px 0 48px}
.lado-b .traco li{color:var(--marfim-texto);font-weight:400}
.lado-b .traco li::before{background:var(--marfim-corpo)}
.opcoes-topo{position:absolute;left:0;right:0;top:0;height:300px;padding:0 160px;display:flex;align-items:center;z-index:2}
.opcoes .lado{top:300px;justify-content:flex-start;padding-top:80px}
.opcoes .lado > * + *{margin-top:40px}
.opcoes .eyebrow{margin-bottom:6px}
.opcoes .t-corpo.claro{color:var(--marfim-corpo)}
.opcoes .lado-b .t-m{font-size:58px}

/* ---------- pequenas pedras ---------- */
.pedras{position:absolute;left:200px;bottom:130px;display:flex;gap:28px;align-items:flex-end}
.pedras i{display:block;width:14px;height:20px;border:1.5px solid var(--pedra);border-radius:50%}
.pedras i:nth-child(2n){width:10px;height:14px}
.pedras i:nth-child(3n){width:18px;height:24px}

/* ---------- 08, 09, 17: arte em papel ---------- */
.arte-dir{position:absolute;right:60px;top:40px;bottom:40px;width:1000px;display:flex;align-items:center;justify-content:center}
.arte-dir img{max-width:100%;max-height:100%}
.pedra-sala .esq{width:820px}
.davi-marmore,.davi-img{position:absolute;max-height:1000px}
.davi-marmore{opacity:1;transition:none}
.davi-img{clip-path:circle(0% at 50% 42%);transition:none}
.s.davi.on .davi-marmore{opacity:0;transform:scale(.94);transition:opacity 1.4s ease .9s,transform 1.6s var(--e) .9s}
.s.davi.on .davi-img{clip-path:circle(80% at 50% 42%);transition:clip-path 2.2s cubic-bezier(.5,0,.2,1) 1s}

/* ---------- 10–12: casos ---------- */
.caso-foto{position:absolute;left:0;top:0;bottom:0;width:640px;overflow:hidden}
.caso-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.caso-txt{position:absolute;left:800px;right:160px;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center}
.caso-txt h2{margin-bottom:56px}
.caso-print .caso-txt{left:1080px}
.print-grande{position:absolute;left:160px;top:356px;width:840px;background:#fff;padding:28px}
.print-grande img{width:100%}

/* ---------- 14 michelangelo ---------- */
.michelangelo .esq{width:760px}
.michelangelo .t-xxl{font-size:112px}

/* ---------- 15 domingo ---------- */
.domingo .dir{left:960px}

/* ---------- 16 artista ---------- */
.artista .esq{width:800px}
.artista .esq > .t-m{color:var(--marfim-corpo)}

/* ---------- 21, 26: dois perfis ---------- */
.dupla-topo{position:absolute;left:160px;right:160px;top:110px}
.dupla-prints{position:absolute;left:160px;right:160px;top:420px;display:flex;align-items:center;gap:36px}
.print{flex:1;background:#fff;padding:22px}
.print img{width:100%}
.vezes{font:italic 400 110px/1 var(--display);color:var(--oxblood-claro)}
.dupla-lista{position:absolute;left:160px;right:160px;top:790px;display:grid;grid-template-columns:1fr 1fr;gap:60px}
.dupla-lista li + li{margin-top:0}

/* ---------- 23, 24: números ---------- */
.numero{font:italic 400 360px/1 var(--display);color:var(--marfim-numero);letter-spacing:-.03em;font-variant-numeric:lining-nums}
.meio-h > .numero{margin-top:10px}

/* ---------- 25 larissa ---------- */
.larissa-foto{position:absolute;right:0;top:0;bottom:0;width:860px;overflow:hidden}
.larissa-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}

/* ---------- 29 feline ---------- */
.feline .esq{width:800px}
.feline .esq h2 + h2{margin-top:0}

/* ---------- 30 três meses ---------- */
.noventa{position:absolute;left:110px;top:50%;margin-top:-330px;font:italic 400 640px/1 var(--display);color:var(--marfim-numero);letter-spacing:-.05em}
.tres .dir{left:1000px}

/* ---------- 31–34 etapas ---------- */
.etapa-num{position:absolute;left:0;top:0;bottom:0;width:620px;background:var(--oxblood);display:flex;align-items:center;justify-content:center}
.etapa-num span{display:block;font:italic 400 360px/1 var(--display);color:var(--marfim-numero);letter-spacing:-.04em}
.etapa-txt{position:absolute;left:760px;right:150px;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center}
.etapa-txt > * + *{margin-top:30px}
.etapa-txt > .eyebrow{margin-top:40px}
.etapa-txt > h2{margin-top:14px;margin-bottom:10px}
.trilha{display:flex;gap:14px}
.trilha i{display:block;width:14px;height:20px;border:1.5px solid var(--pedra-clara);border-radius:50%}
.trilha i.feito{background:var(--oxblood-claro);border-color:var(--oxblood-claro)}
.etapa-lista .t-corpo{font-size:30px}
.itens{border-top:1px solid var(--pedra)}
.itens li{display:grid;grid-template-columns:72px 1fr;align-items:baseline;padding:16px 0;border-bottom:1px solid rgba(106,105,98,.55);font:300 27px/1.4 var(--sans);color:var(--marfim-texto)}
.itens li span{font:italic 400 30px/1 var(--display);color:var(--oxblood-claro)}
.etapa-txt > .itens{margin-top:20px}

/* ---------- 36 a.C. / d.C. ---------- */
.ac-l,.ac-r{position:absolute;top:50%;margin-top:-190px;font:400 300px/1.2 var(--display);color:var(--marfim-texto);letter-spacing:-.02em}
.ac-l{right:1060px}
.ac-r{left:1060px}
.ac-traco{position:absolute;left:940px;top:190px;width:40px;height:700px}
.ac-traco path{fill:none;stroke:var(--pedra-clara);stroke-width:1.5}

/* ---------- 37, 38 história ---------- */
.historia .esq{width:700px}
.historia .esq h2{margin-bottom:30px}
.historia-fotos{position:absolute;right:120px;top:120px;bottom:120px;width:880px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.historia-fotos > div{overflow:hidden}
.historia-fotos img{width:100%;height:100%;object-fit:cover}

/* ---------- 41 final: tudo em posição fixa, centralizado no eixo de 960px ---------- */
.final-selo{position:absolute;left:912px;top:64px;width:96px}
.final-perg{position:absolute;left:160px;right:160px;top:190px;text-align:center}
.qr{position:absolute;left:720px;top:330px;width:480px;height:480px;background:var(--papel);padding:34px}
.qr img{width:100%;height:100%}
.aplique{position:absolute;left:0;right:0;top:862px;text-align:center;font:600 40px/1 var(--sans);letter-spacing:.42em;text-transform:uppercase;color:var(--marfim-texto);text-indent:.42em}
.final-url{position:absolute;left:0;right:0;top:928px;text-align:center;font:400 22px/1 var(--sans);letter-spacing:.14em;color:var(--pedra-clara)}

/* ---------- navegação ---------- */
.progresso{position:fixed;left:0;right:0;bottom:0;height:3px;pointer-events:none}
.progresso i{display:block;height:100%;width:0;background:var(--oxblood-vivo);transition:width .5s var(--e)}
.dica{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);white-space:nowrap;font:500 13px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--pedra-clara);background:var(--noite-2);padding:12px 18px;transition:opacity .8s ease;pointer-events:none}
.dica.some{opacity:0}

@media (prefers-reduced-motion: reduce){
  .a,.s,.davi-marmore,.davi-img,img{transition:none !important}
}

/* ---------- PDF (index.html?pdf): cada slide no estado final, uma página 1920×1080 ---------- */
@page{size:1920px 1080px;margin:0}
html:has(body.pdf),body.pdf{height:auto;overflow:visible;background:var(--noite-1)}
body.pdf .stage{position:static;transform:none;width:1920px;height:auto;overflow:visible}
body.pdf .s{position:relative;width:1920px;height:1080px;opacity:1;visibility:visible;break-after:page;page-break-after:always}
body.pdf *,body.pdf *::before,body.pdf *::after{transition:none !important;animation:none !important}
body.pdf .cena-luz{opacity:.1}
body.pdf .progresso,body.pdf .dica{display:none}
