/* Breu — produtora audiovisual (projeto conceito VEXA) */

@font-face{font-family:"Anton";src:url(../fonts/anton.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Archivo";src:url(../fonts/archivo.woff2) format("woff2");font-weight:300 800;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"DM Mono";src:url(../fonts/dmmono-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"DM Mono";src:url(../fonts/dmmono-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --breu:#070708;
  --carvao:#0E0E10;
  --grafite:#17171A;
  --linha:rgba(236,232,225,.12);
  --osso:#ECE8E1;
  --cinza:#A3A09A;
  --rec:#FF3B30;
  --rec-esc:#D92B21;
  --f-tit:"Anton",Impact,"Arial Narrow",sans-serif;
  --f-txt:"Archivo",system-ui,sans-serif;
  --f-mono:"DM Mono",ui-monospace,monospace;
  --faixa:34px;
  --sai:cubic-bezier(.16,1,.3,1);
  --cine:cubic-bezier(.77,0,.18,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--breu);color:var(--osso);font:400 17px/1.6 var(--f-txt);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
:focus-visible{outline:2px solid var(--rec);outline-offset:3px}
::selection{background:var(--rec);color:#fff}
h1,h2,h3{margin:0;font-weight:400}
p{margin:0}
em{font-style:normal}

/* ---------- Faixa VEXA ---------- */
.vexa-faixa{position:fixed;inset:0 0 auto;z-index:95;height:var(--faixa);display:flex;align-items:center;justify-content:center;gap:14px;padding:0 14px;
  background:#000;border-bottom:1px solid var(--linha);color:#D9D5CE;font:400 12.5px/1 var(--f-txt);white-space:nowrap}
.vexa-faixa strong{color:#fff;font-weight:700;letter-spacing:.04em}
.vexa-faixa a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:1px}
@media (max-width:420px){.vexa-faixa{font-size:11.5px;gap:10px}}

/* ---------- Grão de filme ---------- */
.grao{position:fixed;inset:-100%;width:300%;height:300%;z-index:80;pointer-events:none;opacity:.075;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  animation:grao 1s steps(1) infinite}
@keyframes grao{0%{transform:translate(0,0)}12%{transform:translate(-7%,4%)}25%{transform:translate(5%,-8%)}37%{transform:translate(-3%,9%)}50%{transform:translate(8%,2%)}62%{transform:translate(-9%,-4%)}75%{transform:translate(3%,7%)}87%{transform:translate(-5%,-9%)}}

/* ---------- Cursor ---------- */
.cursor{position:fixed;left:0;top:0;z-index:99;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;border:1.5px solid var(--osso);pointer-events:none;
  display:grid;place-items:center;opacity:0;transition:width .35s var(--sai),height .35s var(--sai),margin .35s var(--sai),background .3s,border-color .3s,opacity .3s;will-change:transform}
.cursor.on{opacity:1}
.cursor.link{width:40px;height:40px;margin:-20px 0 0 -20px;background:rgba(236,232,225,.1)}
.cursor.rotulado{width:86px;height:86px;margin:-43px 0 0 -43px;background:var(--rec);border-color:var(--rec)}
.cursor-rotulo{font:500 11px/1 var(--f-mono);letter-spacing:.12em;color:#fff;opacity:0;transition:opacity .2s}
.cursor.rotulado .cursor-rotulo{opacity:1}
.cursor.some{opacity:0}
@media (hover:none),(pointer:coarse){.cursor{display:none}}

/* ---------- Botões ---------- */
.btn{--mx:0px;--my:0px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;border:1px solid transparent;
  font:600 15.5px/1 var(--f-txt);letter-spacing:.01em;text-decoration:none;white-space:nowrap;transform:translate(var(--mx),var(--my));transition:transform .4s var(--sai),background .3s,color .3s,border-color .3s}
.btn svg{transition:transform .3s var(--sai)}
.btn:hover svg{transform:translateX(3px)}
.btn-sm{min-height:42px;padding:0 18px;font-size:14px}
.btn-osso{background:var(--osso);color:var(--breu)}
.btn-osso:hover{background:#fff}
.btn-linha{border-color:rgba(236,232,225,.4);color:var(--osso);background:rgba(7,7,8,.25)}
.btn-linha:hover{border-color:var(--osso);background:rgba(236,232,225,.08)}
.btn-rec{background:var(--rec);color:#fff}
.btn-rec:hover{background:var(--rec-esc)}
.ponto-rec{width:8px;height:8px;border-radius:50%;background:currentColor;animation:pisca 1.2s steps(1) infinite}
.btn-rec .ponto-rec{background:#fff}
@keyframes pisca{50%{opacity:.15}}

/* ---------- Nav ---------- */
.nav{position:fixed;z-index:90;top:var(--faixa);left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(16px,3vw,40px);
  transition:transform .5s var(--sai),background .4s}
.nav.solida{background:rgba(7,7,8,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--linha)}
.nav.some{transform:translateY(-130%)}
.marca{display:flex;align-items:baseline;gap:6px;text-decoration:none}
.marca-nome{font:400 28px/1 var(--f-tit);letter-spacing:.04em}
.marca-rec{width:9px;height:9px;border-radius:50%;background:var(--rec);transform:translateY(-2px);box-shadow:0 0 12px rgba(255,59,48,.8);animation:pisca 1.6s steps(1) infinite}
.marca-sub{font:400 12px/1 var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--cinza)}
.nav-links{display:none;gap:30px}
.nav-links a{position:relative;font:500 12.5px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#CFCBC4;padding:6px 0}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--rec);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--sai)}
.nav-links a:hover{color:#fff}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left}
@media (min-width:980px){.nav-links{display:flex}}

/* ---------- Comuns ---------- */
.rotulo{font:500 12px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--cinza);margin-bottom:22px}
.h2{font:400 clamp(48px,8vw,124px)/.9 var(--f-tit);text-transform:uppercase;letter-spacing:-.005em}
.h2 em{color:transparent;-webkit-text-stroke:1.5px var(--osso)}
.h2-m{font-size:clamp(40px,5.6vw,84px)}
.js .revela{opacity:0;transform:translateY(40px);transition:opacity 1s var(--sai),transform 1s var(--sai)}
.js .revela.visto{opacity:1;transform:none}

/* ---------- HERO ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:620px;overflow:hidden;background:#000;isolation:isolate}
.hero-midia{position:absolute;inset:0;z-index:-1;will-change:transform}
.hero-img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);animation:kb 16s var(--sai) both}
@keyframes kb{from{transform:scale(1.2)}to{transform:scale(1.04)}}
.hero-vinheta{position:absolute;inset:0;background:radial-gradient(120% 90% at 60% 40%,transparent 30%,rgba(0,0,0,.7) 100%),linear-gradient(transparent 45%,rgba(0,0,0,.85))}
.tarja{position:absolute;left:0;right:0;height:11vh;background:#000;z-index:3;transform:scaleY(var(--t,1))}
.tarja-t{top:0;transform-origin:top}
.tarja-b{bottom:0;transform-origin:bottom}
.js .tarja{transform:scaleY(4.6)}
.js .pronto .tarja{transform:scaleY(var(--t,1));transition:transform 1.5s var(--cine) .2s}
.js .pronto.solto .tarja{transition:none}
.visor{position:absolute;inset:calc(11vh + 16px) clamp(14px,3vw,36px);z-index:2;pointer-events:none;font:500 12px/1 var(--f-mono);letter-spacing:.12em;color:rgba(255,255,255,.85)}
.js .visor{opacity:0;transition:opacity .8s 1.4s}
.js .pronto .visor{opacity:1}
.canto{position:absolute;width:26px;height:26px;border:1.5px solid rgba(255,255,255,.7)}
.c1{left:0;top:0;border-right:0;border-bottom:0}.c2{right:0;top:0;border-left:0;border-bottom:0}.c3{left:0;bottom:0;border-right:0;border-top:0}.c4{right:0;bottom:0;border-left:0;border-top:0}
.visor-topo,.visor-base{position:absolute;left:38px;right:38px;display:flex;gap:22px;align-items:center}
.visor-topo{top:8px}
.visor-base{bottom:8px;justify-content:flex-end}
.rec{display:inline-flex;align-items:center;gap:8px;color:#fff}
.rec b{width:10px;height:10px;border-radius:50%;background:var(--rec);animation:pisca 1s steps(1) infinite}
.tc{font-variant-numeric:tabular-nums}
.visor-dir{margin-left:auto}
.bateria{width:26px;height:12px;border:1.5px solid rgba(255,255,255,.8);border-radius:2px;padding:1.5px;position:relative}
.bateria::after{content:"";position:absolute;right:-4px;top:3px;width:2px;height:4px;background:rgba(255,255,255,.8)}
.bateria i{display:block;height:100%;width:70%;background:#fff}
.foco{position:absolute;left:0;top:0;width:96px;height:72px;margin:-36px 0 0 -48px;will-change:transform}
.foco i{position:absolute;width:14px;height:14px;border:1.5px solid #fff}
.foco i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.foco i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
.foco i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.foco i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.foco span{position:absolute;left:0;top:-18px;font-size:10.5px}
.foco.trava i{border-color:var(--rec)}
.foco.trava{animation:trava .35s var(--sai)}
@keyframes trava{0%{scale:1.25}100%{scale:1}}
.hero-txt{position:absolute;z-index:4;left:clamp(18px,4vw,64px);right:clamp(18px,4vw,64px);bottom:calc(11vh + 58px)}
.hero-sobre{font:500 12.5px/1 var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:#E2DED7;margin-bottom:16px}
.hero-t{font:400 clamp(64px,12.5vw,210px)/.86 var(--f-tit);text-transform:uppercase;letter-spacing:-.01em}
.linha{display:block;overflow:hidden;padding-top:.13em;margin-top:-.09em}
.linha > span{display:block}
.js .linha > span{transform:translateY(108%);transition:transform 1.3s var(--cine);transition-delay:var(--d)}
.js .pronto .linha > span{transform:none}
.hero-t em{color:transparent;-webkit-text-stroke:2px var(--osso)}
.hero-pe{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 40px;margin-top:26px}
.hero-pe p{max-width:46ch;color:#DDD9D2;font-size:17px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.js .entra{opacity:0;transform:translateY(20px);transition:opacity 1s var(--sai),transform 1s var(--sai);transition-delay:var(--d)}
.js .pronto .entra{opacity:1;transform:none}
.rolar{position:absolute;z-index:4;right:clamp(18px,4vw,64px);top:calc(11vh + 70px);display:flex;flex-direction:column;align-items:center;gap:10px;font:500 11px/1 var(--f-mono);letter-spacing:.2em;text-transform:uppercase;writing-mode:vertical-rl;color:#CFCBC4}
.rolar i{width:1px;height:60px;background:linear-gradient(var(--osso),transparent);animation:desce 2s var(--sai) infinite;transform-origin:top}
@keyframes desce{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@media (max-width:700px){
  .visor-dir,.visor-base{display:none}
  .hero-t{font-size:clamp(58px,17vw,96px)}
  .hero-pe p{font-size:16px}
  .rolar{display:none}
  .hero-txt{bottom:calc(11vh + 22px)}
  .foco{display:none}
}

/* ---------- Película ---------- */
.pelicula{position:relative;display:flex;overflow:hidden;padding:26px 0;background:#121214;border-block:1px solid var(--linha)}
.pelicula::before,.pelicula::after{content:"";position:absolute;left:0;right:0;height:9px;background:repeating-linear-gradient(90deg,transparent 0 10px,#2A2A2E 10px 24px);opacity:.9}
.pelicula::before{top:7px}.pelicula::after{bottom:7px}
.pel-trilho{display:flex;flex-shrink:0;align-items:center;gap:34px;padding-right:34px;animation:rola 40s linear infinite}
.pel-trilho span{font:400 clamp(30px,4.4vw,58px)/1 var(--f-tit);text-transform:uppercase;white-space:nowrap}
.pel-trilho span:nth-child(4n+3){color:transparent;-webkit-text-stroke:1.2px var(--osso)}
.pel-trilho b{width:12px;height:12px;border-radius:50%;background:var(--rec)}
@keyframes rola{to{transform:translateX(-100%)}}
.pausa .pel-trilho,.pausa .cred-rolo{animation-play-state:paused}

/* ---------- Manifesto ---------- */
.manifesto{position:relative;height:220vh}
.manifesto-presa{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;max-width:1240px;margin:0 auto;padding:90px clamp(18px,4vw,64px) 40px}
.manifesto-txt{font:500 clamp(28px,4.4vw,64px)/1.12 var(--f-txt);letter-spacing:-.025em;font-stretch:88%}
.manifesto-txt .p{opacity:.14;transition:opacity .25s}
.manifesto-txt .p.on{opacity:1}
.manifesto-txt .p.rec{color:var(--rec)}

/* ---------- Reel ---------- */
.reel{position:relative;height:400vh;background:var(--breu)}
.reel-presa{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;gap:clamp(18px,3vh,34px);overflow:hidden;padding-top:calc(var(--faixa) + 50px)}
.reel-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 30px;padding:0 clamp(18px,4vw,64px)}
.reel-cab .h2{font-size:clamp(46px,7vw,110px)}
.reel-cab .rotulo{margin-bottom:14px}
.reel-dica{font:500 12px/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cinza)}
.reel-trilho{display:flex;gap:clamp(14px,2vw,26px);padding:0 clamp(18px,4vw,64px);will-change:transform;width:max-content}
.rc{position:relative;flex:none;width:clamp(240px,24vw,350px);aspect-ratio:4/5;max-height:58vh;border-radius:6px;overflow:hidden;background:#111;cursor:pointer;
  border:1px solid var(--linha);transition:transform .6s var(--sai),border-color .4s;text-align:left;padding:0;color:inherit}
.rc:hover,.rc.tocando{border-color:rgba(236,232,225,.35)}
@supports (aspect-ratio:4/5){.rc{height:auto}}
.rc-f{position:absolute;inset:0;opacity:0;transition:opacity .8s ease}
.rc-f.on{opacity:1}
.rc-f img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 4s linear}
.rc:not(.tocando) .rc-f img{filter:grayscale(.55) brightness(.75)}
.rc.tocando .rc-f.on img{transform:scale(1.16) translate(var(--kx,0),var(--ky,0))}
.rc::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.55),transparent 30%,transparent 50%,rgba(0,0,0,.85));pointer-events:none}
.rc-topo{position:absolute;z-index:2;left:16px;right:16px;top:14px}
.rc-seg{display:flex;gap:4px;margin-bottom:12px}
.rc-seg i{flex:1;height:2px;background:rgba(255,255,255,.28);overflow:hidden;border-radius:2px}
.rc-seg i b{display:block;height:100%;background:#fff;transform:scaleX(0);transform-origin:left}
.rc-meta{display:flex;justify-content:space-between;font:500 11.5px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:#E5E1DA}
.rc-base{position:absolute;z-index:2;left:16px;right:16px;bottom:16px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.rc-base .rc-tit{display:block;font:400 clamp(28px,2.6vw,40px)/.95 var(--f-tit);text-transform:uppercase}
.rc-base small{display:block;margin-top:8px;font:500 11.5px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#D3CFC8}
.rc-play{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.5);transition:background .3s,border-color .3s,transform .4s var(--sai)}
.rc:hover .rc-play,.rc.tocando .rc-play{background:var(--rec);border-color:var(--rec);transform:scale(1.08)}
.rc-cta{display:flex;flex-direction:column;justify-content:space-between;padding:22px;background:var(--rec);border-color:var(--rec);text-decoration:none}
.rc-cta::after{display:none}
.rc-cta span{font:500 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.rc-cta strong{font:400 clamp(40px,4vw,62px)/.92 var(--f-tit);text-transform:uppercase}
.reel-barra{margin:0 clamp(18px,4vw,64px);height:1px;background:var(--linha)}
.reel-barra i{display:block;height:100%;background:var(--rec);transform-origin:left;transform:scaleX(0)}
@media (max-width:700px){.rc{width:70vw;max-height:52vh}.reel-dica{display:none}}

/* ---------- Ilha de edição ---------- */
.ilha{padding:130px clamp(18px,4vw,64px);max-width:1360px;margin:0 auto}
.ilha-cab{display:grid;gap:10px 60px;margin-bottom:46px}
@media (min-width:960px){.ilha-cab{grid-template-columns:1.5fr 1fr;align-items:end}.ilha-cab .rotulo{grid-column:1/-1}}
.ilha-cab .h2{font-size:clamp(46px,6.4vw,100px)}
.ilha-p{color:var(--cinza);max-width:52ch}
.ilha-mesa{display:grid;gap:18px}
.monitor{width:min(100%,860px);margin:0 auto;border:1px solid var(--linha);background:var(--carvao);border-radius:8px;overflow:hidden}
.mon-topo,.mon-ctrl{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;font:500 11.5px/1 var(--f-mono);letter-spacing:.08em;color:var(--cinza)}
.mon-tc{color:var(--rec);font-size:14px;font-variant-numeric:tabular-nums}
.mon-tela{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.mon-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .25s}
.mon-img.on{opacity:1}
.mon-fim{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:#000;opacity:0;transition:opacity .3s}
.mon-fim.on{opacity:1}
.mon-fim span{font:400 clamp(30px,5vw,60px)/1 var(--f-tit);text-transform:uppercase;letter-spacing:.04em}
.mon-fim small{font:500 12px/1 var(--f-mono);letter-spacing:.3em;text-transform:uppercase;color:var(--cinza);margin-top:12px}
.mon-titulo{position:absolute;left:8%;bottom:12%;font:400 clamp(26px,4.6vw,58px)/1 var(--f-tit);text-transform:uppercase;text-shadow:0 2px 30px rgba(0,0,0,.6)}
.mon-titulo.entra2{animation:titulo .6s var(--sai)}
@keyframes titulo{from{clip-path:inset(0 100% 0 0);transform:translateX(-10px)}to{clip-path:inset(0 0 0 0);transform:none}}
.mon-safe{position:absolute;inset:6% 5%;border:1px dashed rgba(255,255,255,.18);pointer-events:none}
.mon-ctrl{border-top:1px solid var(--linha)}
.mon-play{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--linha);background:transparent;color:var(--osso);transition:background .3s}
.mon-play:hover{background:var(--rec);border-color:var(--rec)}
.linha-tempo{position:relative;padding:28px 0 10px 46px;border:1px solid var(--linha);background:var(--carvao);border-radius:8px;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize;overflow:hidden}
.lt-regua{position:absolute;left:46px;right:0;top:0;height:22px;border-bottom:1px solid var(--linha);
  background:repeating-linear-gradient(90deg,rgba(236,232,225,.3) 0 1px,transparent 1px calc(100% / 30)) bottom/100% 6px no-repeat;font:500 10px/22px var(--f-mono);color:var(--cinza)}
.lt-regua span{position:absolute;top:0;transform:translateX(4px)}
.lt-faixa{position:relative;height:40px;margin:6px 8px 0 0}
.lt-faixa[data-nome="V1"]{height:58px}
.lt-faixa::before{content:attr(data-nome);position:absolute;left:-40px;top:50%;transform:translateY(-50%);font:500 11px/1 var(--f-mono);color:var(--cinza)}
.clip{position:absolute;top:0;bottom:0;left:calc(var(--i) / 30 * 100%);width:calc((var(--f) - var(--i)) / 30 * 100% - 2px);border-radius:4px;overflow:hidden;
  display:flex;align-items:flex-end;padding:5px 7px;font:500 10.5px/1 var(--f-mono);white-space:nowrap;transition:filter .2s}
.clip.titulo{background:#D9D3C7;color:#141414;align-items:center}
.clip.video{background:#222 var(--img) center/cover;color:#fff;text-shadow:0 1px 3px #000}
.clip.video::before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(0,0,0,.7));z-index:0}
.clip.video{z-index:0}
.clip.preto{background:#000;border:1px solid #333}
.clip.audio{background:#14302A;color:#7FE3C4;align-items:center}
.clip.loc{background:#3A2614;color:#F2B98A;align-items:center}
.clip.ativo{filter:brightness(1.35);box-shadow:inset 0 0 0 1.5px var(--osso)}
.onda{position:absolute;inset:4px 0;width:100%;height:calc(100% - 8px);opacity:.6}
.onda path{fill:#4FD1A5}
.clip.audio{position:absolute}
.clip > *{position:relative}
.clip.audio .onda{position:absolute}
.agulha{position:absolute;top:0;bottom:0;left:0;width:2px;background:var(--rec);z-index:5;will-change:transform;pointer-events:none}
.agulha i{position:absolute;left:-7px;top:0;width:16px;height:18px;background:var(--rec);clip-path:polygon(0 0,100% 0,100% 60%,50% 100%,0 60%)}
@media (max-width:700px){.clip{font-size:0}.clip.titulo,.clip.loc{font-size:9px}}

/* ---------- Processo ---------- */
.processo{position:relative;height:520vh;background:linear-gradient(var(--breu),#0B0B0D 20%,#0B0B0D 80%,var(--breu))}
.proc-presa{position:sticky;top:0;height:100vh;height:100svh;max-width:1360px;margin:0 auto;padding:calc(var(--faixa) + 76px) clamp(18px,4vw,64px) 28px;display:grid;gap:22px;align-items:center}
@media (min-width:960px){.proc-presa{grid-template-columns:1fr 1fr;gap:60px}}
.proc-esq .rotulo{margin-bottom:14px}
.proc-lista{list-style:none;margin:26px 0 0;padding:0;display:grid}
.proc-lista li{display:grid;grid-template-columns:48px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--linha);opacity:.38;transition:opacity .4s}
.proc-lista li.on{opacity:1}
.proc-lista .pn{font:500 13px/1.6 var(--f-mono);color:var(--cinza);transition:color .4s}
.proc-lista li.on .pn{color:var(--rec)}
.proc-lista b{display:block;font:400 26px/1.1 var(--f-tit);text-transform:uppercase;letter-spacing:.01em}
.proc-lista p{max-height:0;overflow:hidden;color:var(--cinza);font-size:15.5px;transition:max-height .6s var(--sai),margin .6s var(--sai)}
.proc-lista li.on p{max-height:110px;margin-top:6px}
.proc-prog{height:2px;background:var(--linha);margin-top:6px}
.proc-prog i{display:block;height:100%;background:var(--rec);transform-origin:left;transform:scaleX(0)}
.proc-palco{position:relative;height:min(62vh,560px);border:1px solid var(--linha);border-radius:10px;background:radial-gradient(circle at 50% 40%,#1A1A1D,#0C0C0E);overflow:hidden}
.pv{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:scale(.94);transition:opacity .6s var(--sai),transform .8s var(--sai);pointer-events:none}
.pv.on{opacity:1;transform:none;pointer-events:auto}
.nota{position:absolute;left:calc(50% + var(--x));top:calc(50% + var(--y));padding:16px 18px;width:200px;background:var(--osso);color:#151515;font:500 14px/1.35 var(--f-mono);box-shadow:0 20px 30px -14px rgba(0,0,0,.8);
  transform:translate(-50%,-50%) rotate(var(--r)) translateY(-40px);opacity:0;transition:transform .7s var(--sai),opacity .5s}
.n-rec{background:var(--rec);color:#fff}
.pv1.on .nota{transform:translate(-50%,-50%) rotate(var(--r));opacity:1}
.pv1.on .nota:nth-child(2){transition-delay:.12s}.pv1.on .nota:nth-child(3){transition-delay:.24s}.pv1.on .nota:nth-child(4){transition-delay:.36s}
.folha{width:min(82%,420px);height:82%;padding:26px 28px;background:var(--osso);color:#151515;box-shadow:0 30px 50px -20px rgba(0,0,0,.9);overflow:hidden}
.folha pre{margin:0;font:400 13px/1.65 var(--f-mono);white-space:pre-wrap}
.folha pre b{font-weight:500}
.story{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:min(86%,460px)}
.story figure{margin:0}
.story svg{width:100%;aspect-ratio:16/9;background:#ECE8E1;border-radius:3px}
.story path,.story circle,.story rect{fill:none;stroke:#151515;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.6s var(--sai)}
.pv3.on .story path,.pv3.on .story circle,.pv3.on .story rect{stroke-dashoffset:0}
.pv3.on .story figure:nth-child(2) *{transition-delay:.2s}.pv3.on .story figure:nth-child(3) *{transition-delay:.4s}.pv3.on .story figure:nth-child(4) *{transition-delay:.6s}
.story figcaption{margin-top:6px;font:500 11px/1 var(--f-mono);letter-spacing:.08em;color:var(--cinza)}
.claq{width:min(80%,380px);height:auto;overflow:visible}
.claq-braco{transform-origin:20px 74px;transform:rotate(-24deg);transition:transform .5s var(--sai)}
.pv4.on .claq-braco{animation:bate 1.6s var(--sai) .3s both}
@keyframes bate{0%{transform:rotate(-24deg)}38%{transform:rotate(-24deg)}50%{transform:rotate(0)}58%{transform:rotate(-3deg)}66%,100%{transform:rotate(0)}}
.claq.bate .claq-braco{animation:bate2 .7s var(--sai) both}
@keyframes bate2{0%{transform:rotate(-24deg)}45%{transform:rotate(0)}60%{transform:rotate(-4deg)}75%{transform:rotate(0)}100%{transform:rotate(-24deg)}}
.cor{--c:50%;position:relative;width:min(82%,520px);aspect-ratio:4/3;overflow:hidden;border-radius:4px;touch-action:none;cursor:ew-resize}
.cor img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cor-log{filter:saturate(.3) contrast(.72) brightness(1.15)}
.cor-grade{filter:saturate(1.2) contrast(1.12) sepia(.12);clip-path:inset(0 0 0 var(--c))}
.cor-alca{position:absolute;top:0;bottom:0;left:var(--c);width:2px;margin-left:-1px;background:#fff}
.cor-alca i{position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.5)}
.cor-alca i::before{content:"‹ ›";position:absolute;inset:0;display:grid;place-items:center;color:#111;font:700 15px/1 var(--f-txt)}
.cor-rot{position:absolute;top:12px;padding:5px 8px;background:rgba(0,0,0,.6);font:500 10.5px/1 var(--f-mono);letter-spacing:.1em}
.cr1{left:12px}.cr2{right:12px}
.formatos{display:flex;align-items:flex-end;justify-content:center;gap:16px;width:90%}
.fmt{position:relative;display:block;overflow:hidden;border-radius:4px;border:1px solid rgba(236,232,225,.3);opacity:0;transform:translateY(30px);transition:opacity .5s,transform .7s var(--sai)}
.fmt img{width:100%;height:100%;object-fit:cover}
.fmt b{position:absolute;left:8px;bottom:8px;padding:4px 7px;background:rgba(0,0,0,.65);font:500 11px/1 var(--f-mono)}
.f169{width:48%;aspect-ratio:16/9}.f916{width:20%;aspect-ratio:9/16}.f11{width:26%;aspect-ratio:1}
.pv6.on .fmt{opacity:1;transform:none}
.pv6.on .f916{transition-delay:.15s}.pv6.on .f11{transition-delay:.3s}
.entregue{position:absolute;bottom:22px;display:flex;align-items:center;gap:8px;font:500 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--rec)}
.entregue .ponto-rec{color:var(--rec)}
@media (max-width:959px){
  .proc-presa{grid-template-rows:auto 1fr;align-items:start;gap:16px;padding-top:calc(var(--faixa) + 70px)}
  .proc-palco{order:-1;height:34vh}
  .proc-esq .h2{font-size:34px}
  .proc-lista{margin-top:12px}
  .proc-lista li{display:none;border:0;padding:0}
  .proc-lista li.on{display:grid}
  .proc-lista b{font-size:24px}
  .nota{width:150px;font-size:12px;padding:10px 12px}
  .folha{padding:14px 16px}.folha pre{font-size:11px}
}

/* ---------- Serviços ---------- */
.servicos{position:relative;padding:130px clamp(18px,4vw,64px);max-width:1360px;margin:0 auto}
.serv-cab{margin-bottom:50px}
.serv-lista{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--linha)}
.serv{position:relative;display:grid;grid-template-columns:44px 1fr;gap:6px 18px;align-items:center;padding:24px 0;border-top:1px solid var(--linha)}
@media (min-width:900px){.serv{grid-template-columns:70px 1fr 340px;padding:30px 0}}
.sn{font:500 13px/1 var(--f-mono);color:var(--cinza)}
.serv h3{font:400 clamp(40px,6.4vw,100px)/.95 var(--f-tit);text-transform:uppercase;transition:color .4s,transform .6s var(--sai)}
.serv p{grid-column:2;color:var(--cinza);font-size:15.5px;max-width:42ch}
@media (min-width:900px){.serv p{grid-column:auto}}
.serv-mini{display:none}
@media (hover:hover) and (pointer:fine){
  .serv:hover h3{color:transparent;-webkit-text-stroke:1.5px var(--rec);transform:translateX(18px)}
  .serv:hover .sn{color:var(--rec)}
}
@media (hover:none),(pointer:coarse){
  .serv{grid-template-columns:44px 1fr 74px}
  .serv-mini{display:block;grid-row:1/3;grid-column:3;width:74px;height:92px;object-fit:cover;border-radius:4px}
  .serv p{grid-column:2}
}
.serv-flutua{position:fixed;left:0;top:0;z-index:20;width:260px;aspect-ratio:4/5;margin:-160px 0 0 -130px;pointer-events:none;overflow:hidden;border-radius:6px;
  opacity:0;transform:scale(.6);transition:opacity .35s,scale .5s var(--sai);will-change:transform}
.serv-flutua.on{opacity:1;scale:1}
.serv-flutua img{width:100%;height:100%;object-fit:cover}
@media (hover:none),(pointer:coarse){.serv-flutua{display:none}}
.dados{display:grid;grid-template-columns:repeat(2,1fr);gap:30px 20px;margin:90px 0 0}
@media (min-width:900px){.dados{grid-template-columns:repeat(4,1fr)}}
.dado{border-top:1px solid var(--rec);padding-top:18px}
.dado dt{font:400 clamp(60px,7vw,110px)/1 var(--f-tit)}
.dado dt small{font-size:.32em;margin-left:6px;color:var(--cinza);font-family:var(--f-mono);letter-spacing:.06em}
.dado dd{margin:10px 0 0;color:var(--cinza);font-size:15px;max-width:26ch}
.dado:nth-child(2){transition-delay:.1s}.dado:nth-child(3){transition-delay:.2s}.dado:nth-child(4){transition-delay:.3s}

/* ---------- FAQ ---------- */
.faq{padding:40px clamp(18px,4vw,64px) 130px;max-width:1360px;margin:0 auto;display:grid;gap:30px}
@media (min-width:960px){.faq{grid-template-columns:.8fr 1.2fr;gap:60px}}
.faq-lista details{border-top:1px solid var(--linha)}
.faq-lista details:last-child{border-bottom:1px solid var(--linha)}
.faq-lista summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 0;cursor:pointer;font:600 clamp(17px,1.6vw,20px)/1.35 var(--f-txt)}
.faq-lista summary::-webkit-details-marker{display:none}
.faq-lista summary i{position:relative;flex:none;width:18px;height:18px}
.faq-lista summary i::before,.faq-lista summary i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:var(--osso);transition:transform .5s var(--sai),background .3s}
.faq-lista summary i::after{transform:rotate(90deg)}
.faq-lista details[open] summary i::after{transform:rotate(0)}
.faq-lista details[open] summary i::before{background:var(--rec)}
.faq-lista details[open] summary{color:#fff}
.faq-lista details p{padding:0 0 24px;color:var(--cinza);max-width:62ch}
.faq-lista details[open] p{animation:abre .6s var(--sai)}
@keyframes abre{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ---------- Orçamento ---------- */
.orcamento{position:relative;padding:130px clamp(18px,4vw,64px);overflow:hidden;isolation:isolate;border-top:1px solid var(--linha)}
.orc-fundo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;opacity:.32}
.orcamento::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--breu) 25%,rgba(7,7,8,.6)),linear-gradient(var(--breu),transparent 30%,transparent 70%,var(--breu))}
.orc-in{max-width:1240px;margin:0 auto;display:grid;gap:56px;align-items:center}
@media (min-width:960px){.orc-in{grid-template-columns:1.05fr .95fr}}
.orc-txt > p:not(.rotulo){color:#CFCBC4;margin-top:20px;max-width:46ch}
.orc-form{display:grid;gap:22px;margin-top:34px;max-width:580px}
.campo{display:grid;gap:10px;border:0;margin:0;padding:0;min-width:0}
.campo > span,.campo legend{padding:0;margin-bottom:10px;font:500 11.5px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cinza)}
.campo input[type=text]{width:100%;padding:14px 0;border:0;border-bottom:1px solid rgba(236,232,225,.35);background:transparent;font:400 22px/1.2 var(--f-txt);color:#fff;border-radius:0;transition:border-color .3s}
.campo input[type=text]::placeholder{color:#77746F}
.campo input[type=text]:focus{outline:0;border-color:var(--rec)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{position:relative}
.chips input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.chips span{display:inline-block;padding:11px 16px;border:1px solid rgba(236,232,225,.25);border-radius:999px;font:500 14.5px/1 var(--f-txt);transition:background .3s,color .3s,border-color .3s}
.chips input:checked + span{background:var(--osso);color:var(--breu);border-color:var(--osso)}
.chips input:focus-visible + span{outline:2px solid var(--rec);outline-offset:3px}
.orc-form .btn{justify-self:start}
.form-obs{font-size:13px;color:#8F8C86}
.orc-claq{display:flex;flex-direction:column;align-items:center;gap:16px}
.orc-claq .claq{width:min(100%,460px);filter:drop-shadow(0 30px 40px rgba(0,0,0,.7))}
.orc-claq .claq-braco{transform:rotate(-14deg)}
.claq-dica{font:500 11.5px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cinza)}
#cq-marca,#cq-tipo,#cq-prazo{transition:opacity .2s}

/* ---------- Rodapé ---------- */
.rodape{position:relative;padding:90px clamp(18px,4vw,64px) 46px;border-top:1px solid var(--linha);overflow:hidden}
.creditos{height:150px;overflow:hidden;text-align:center;-webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent)}
.cred-rolo{animation:creditos 16s linear infinite}
.cred-rolo p{margin:0 0 18px;font:400 22px/1.1 var(--f-tit);text-transform:uppercase;letter-spacing:.06em}
.cred-rolo small{display:block;margin-bottom:4px;font:500 10.5px/1 var(--f-mono);letter-spacing:.2em;color:var(--cinza)}
@keyframes creditos{from{transform:translateY(150px)}to{transform:translateY(-100%)}}
.rodape-marca{margin:30px 0 0;overflow:hidden;text-align:center;font:400 clamp(110px,31vw,480px)/.8 var(--f-tit);letter-spacing:-.01em;padding-top:.04em}
.rodape-marca span{display:inline-block;position:relative}
.rodape-marca span::after{content:"";position:absolute;right:-.12em;bottom:.08em;width:.09em;height:.09em;border-radius:50%;background:var(--rec);box-shadow:0 0 .2em rgba(255,59,48,.7)}
.js .rodape-marca span{transform:translateY(100%);transition:transform 1.4s var(--cine)}
.js .rodape-marca.visto span{transform:none}
.rodape-linhas{display:grid;gap:30px;margin-top:40px;padding-top:30px;border-top:1px solid var(--linha)}
@media (min-width:860px){.rodape-linhas{grid-template-columns:1fr 1fr}}
.rodape-linhas > p{max-width:56ch;color:#8F8C86;font-size:14.5px}
.rodape-vexa{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.rodape-vexa p{width:100%;font:400 24px/1.1 var(--f-tit);text-transform:uppercase;letter-spacing:.02em}
.rodape-voltar{font-size:15px;color:#CFCBC4}

/* ---------- Player ---------- */
.player{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px}
.player[hidden]{display:none}
.pl-fundo{position:absolute;inset:0;background:rgba(0,0,0,.9)}
.pl-caixa{position:relative;display:grid;gap:24px;width:min(1080px,100%);max-height:calc(100vh - 40px);overflow:auto;padding:20px;border:1px solid var(--linha);border-radius:10px;background:var(--carvao);
  animation:plEntra .6s var(--sai)}
@keyframes plEntra{from{opacity:0;transform:scale(.94) translateY(20px)}to{opacity:1;transform:none}}
@media (min-width:860px){.pl-caixa{grid-template-columns:auto 1fr;padding:24px;gap:34px}}
.pl-fechar{position:absolute;right:12px;top:12px;z-index:3;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--linha);background:rgba(0,0,0,.5);color:#fff}
.pl-fechar:hover{background:var(--rec);border-color:var(--rec)}
.pl-tela{position:relative;width:min(100%,calc(70vh * .8));aspect-ratio:4/5;overflow:hidden;border-radius:6px;background:#000;justify-self:center}
.pl-tela .rc-f{opacity:0}
.pl-tela .rc-f.on{opacity:1}
.pl-tela .rc-f img{transition:transform 4s linear}
.pl-tela .rc-f.on img{transform:scale(1.16) translate(var(--kx,0),var(--ky,0))}
.pl-tela::before,.pl-tela::after{content:"";position:absolute;left:0;right:0;height:8%;background:#000;z-index:2}
.pl-tela::before{top:0}.pl-tela::after{bottom:0}
.pl-info{display:flex;flex-direction:column;gap:14px;padding-top:10px}
.pl-info .rotulo{margin:0}
.pl-info h3{font:400 clamp(40px,5vw,72px)/.92 var(--f-tit);text-transform:uppercase}
.pl-info > p:not(.rotulo){color:#CFCBC4}
.pl-ficha{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:6px 0;font-size:14.5px}
.pl-ficha dt{font:500 11px/1.9 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cinza)}
.pl-ficha dd{margin:0}
.pl-ctrl{display:flex;align-items:center;gap:14px;margin-top:auto}
.pl-ctrl button{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:0;background:var(--osso);color:var(--breu)}
.pl-barra{flex:1;height:3px;background:var(--linha);overflow:hidden}
.pl-barra i{display:block;height:100%;background:var(--rec);transform-origin:left;transform:scaleX(0)}
#pl-tc{font:500 12px/1 var(--f-mono);color:var(--cinza);font-variant-numeric:tabular-nums}
.pl-nav{display:flex;gap:10px}
.pl-nav button{flex:1;padding:12px;border-radius:999px;border:1px solid var(--linha);background:transparent;font:500 12px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase}
.pl-nav button:hover{border-color:var(--osso)}
.pl-aviso{font-size:12.5px;color:#8F8C86 !important}

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  .grao{display:none}
  .cursor{display:none}
  .js .revela,.js .entra,.js .linha > span,.js .visor,.js .rodape-marca span{opacity:1 !important;transform:none !important}
  .js .tarja{transform:scaleY(1) !important}
  .hero-img{transform:none}
  .manifesto,.reel,.processo{height:auto}
  .manifesto-presa,.proc-presa{position:relative;height:auto;padding-top:120px;padding-bottom:120px}
  .manifesto-txt .p{opacity:1}
  .reel-presa{position:relative;height:auto;padding:120px 0}
  .reel-trilho{width:auto;overflow-x:auto;transform:none !important;padding-bottom:16px}
  .rc .rc-f:first-child{opacity:1}
  .rc:not(.tocando) .rc-f img{filter:none}
  .proc-palco{display:none}
  .proc-lista li,.proc-lista li.on{display:grid;opacity:1}
  .proc-lista p{max-height:none;margin-top:6px}
  .proc-prog{display:none}
  .creditos{height:auto}
  .cred-rolo{transform:none}
  .foco{display:none}
}