:root{
  --bg:#040407; --text:#f2f1ee; --muted:#8e8c9b; --line:rgba(255,255,255,.09);
  --blue:#4040ff; --yellow:#f5c518; --red:#ff2d2d; --green:#22e04a; --violet:#8b5cff; --black:#2a2a33;
  --head:'Archivo',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace; --stencil:'Saira Stencil One',Impact,sans-serif;
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%;overscroll-behavior:none;overflow-x:clip}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font-family:var(--head);color:var(--text);background:var(--bg);overflow-x:clip;min-height:100vh;-webkit-font-smoothing:antialiased}
html.lock body{overflow:hidden;height:100vh}
img{display:block;max-width:100%;-webkit-user-drag:none;user-select:none}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.mono{font-family:var(--mono);text-transform:uppercase;letter-spacing:.22em;font-size:11px}
em{font-style:normal;color:var(--violet)}

/* Fundo */
#dust{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
#bg,.bg-fallback{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.bg-fallback{background:radial-gradient(70% 45% at 50% 28%,#1b1b6b 0,#0b0820 45%,transparent 75%),var(--bg);opacity:0;transition:opacity .6s}
.no-gl .bg-fallback{opacity:1}
.grain{position:fixed;inset:0;z-index:60;pointer-events:none;background-image:var(--grain);opacity:.06}

/* Loader */
#loader{position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px}
#loader img{width:min(54vw,240px);opacity:.95}
.ld-bar{width:min(54vw,240px);height:1px;background:var(--line);overflow:hidden}
.ld-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--violet),var(--yellow));transform-origin:left;transform:scaleX(0)}
.ld-n{color:var(--muted)}
html:not(.js) #loader{display:none}

/* Header */
.top{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;align-items:center;justify-content:space-between;
  padding:max(14px,env(safe-area-inset-top)) 16px 12px;pointer-events:none}
.top>*{pointer-events:auto}
.brand img{height:22px;width:auto}
.wa-top{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(14,14,24,.7);border:1px solid rgba(255,255,255,.12)}
.wa-top svg{width:22px;height:22px}
.progress{position:absolute;left:0;top:0;height:2px;width:100%;background:linear-gradient(90deg,var(--blue),var(--violet),var(--yellow));transform-origin:left;transform:scaleX(0)}

main{position:relative;z-index:2}
.sec{position:relative;max-width:560px;margin:0 auto;padding:96px 20px 20px}
.title{font-family:var(--head);font-stretch:125%;font-weight:850;text-transform:uppercase;font-size:clamp(38px,11.5vw,62px);line-height:.92;letter-spacing:-.01em;margin-bottom:28px}
.title .ln{overflow:hidden;padding-bottom:.06em}

/* HERO */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}
.hero-stage{perspective:1100px;width:100%;display:grid;place-items:center;margin-top:-4vh}
.tilt,.deck{transform-style:preserve-3d}
/* left: centro óptico — o "+" alonga a logo para a direita, então "UNO" parecia deslocado */
.deck{--w:min(88vw,460px);position:relative;left:calc(var(--w) * .025);width:var(--w);height:calc(var(--w) * .95)}
.hcard{position:absolute;left:50%;top:50%;width:calc(var(--w) * .36);aspect-ratio:2/3;transform-style:preserve-3d;will-change:transform}
.hc-in{position:relative;width:100%;height:100%;transform-style:preserve-3d}
.hc-in img{width:100%;height:100%;filter:drop-shadow(0 18px 24px rgba(0,0,0,.6))}
.glow{position:absolute;inset:-35%;border-radius:50%;background:radial-gradient(closest-side,var(--gc),transparent);opacity:.55;transform:translateZ(-30px)}
.hcard[data-k=red]{--gc:rgba(255,45,45,.55)}.hcard[data-k=yellow]{--gc:rgba(245,197,24,.5)}
.hcard[data-k=blue]{--gc:rgba(64,64,255,.7)}.hcard[data-k=black]{--gc:rgba(160,160,200,.25)}
.htext{position:absolute;left:50%;top:50%;width:calc(var(--w) * .98);transform-style:preserve-3d;will-change:transform}
.htext img{width:100%;filter:drop-shadow(0 14px 18px rgba(0,0,0,.8))}
.shine{position:absolute;inset:0;pointer-events:none;-webkit-mask:url(/img/logo-text.webp) center/100% 100% no-repeat;mask:url(/img/logo-text.webp) center/100% 100% no-repeat;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.9) 50%,transparent 62%) no-repeat;background-size:300% 100%;background-position:150% 0;mix-blend-mode:overlay}
.shock{position:absolute;left:50%;top:62%;width:60%;aspect-ratio:1;margin-left:-30%;margin-top:-30%;border-radius:50%;border:2px solid rgba(160,150,255,.8);opacity:0;pointer-events:none}
.hero-sub{position:absolute;bottom:calc(16vh + env(safe-area-inset-bottom));color:#cfcbe8;letter-spacing:.42em;font-size:12px}
.scroll-hint{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom));color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:8px;font-size:10px}
.scroll-hint span{font-size:14px;animation:bob 1.8s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(6px)}}

/* EVENTO */
.ev{--ac:var(--blue);position:relative;border-radius:28px;padding:22px;overflow:hidden;
  background:linear-gradient(165deg,color-mix(in srgb,var(--ac) 30%,transparent),rgba(12,12,22,.88) 46%);border:1px solid rgba(255,255,255,.12);
  box-shadow:0 40px 80px -30px color-mix(in srgb,var(--ac) 55%,transparent),inset 0 1px 0 rgba(255,255,255,.12)}
.ev::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.05;pointer-events:none}
.pill{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font-size:10px}
.pill i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(34,224,74,.6);animation:ping 1.8s infinite}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(34,224,74,0)}100%{box-shadow:0 0 0 0 rgba(34,224,74,0)}}
.ev-card{position:absolute;right:-14px;top:-10px;width:92px;aspect-ratio:2/3;transform:rotate(14deg);perspective:700px;pointer-events:none;z-index:2}
.ev-card.has-photo{width:100px;right:18px;top:18px;transform:rotate(6deg)}
.ev-flip{position:relative;width:100%;height:100%;transform-style:preserve-3d}
.ev-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.ev-face img{width:100%;height:100%;filter:drop-shadow(0 16px 20px rgba(0,0,0,.6))}
.ev-face.front{transform:rotateY(180deg);opacity:0;border:4px solid #ecebe6;border-radius:9%;overflow:hidden;background:#111;box-shadow:0 18px 30px -10px rgba(0,0,0,.8)}
.ev-face.front img{object-fit:cover;filter:none}
/* Com foto: o título divide a largura com a carta; a fonte encolhe para palavras longas caberem inteiras */
.ev.with-photo{container-type:inline-size}
.ev.with-photo h2{min-height:96px;max-width:calc(100% - 110px);font-size:clamp(19px,calc((100cqw - 154px) / 7.4),34px);overflow-wrap:break-word}
html.static .ev-face.front{opacity:1;transform:none}
html.static .ev-face.back{display:none}
.ev h2{font-stretch:125%;font-weight:850;text-transform:uppercase;font-size:clamp(30px,9vw,44px);line-height:.95;margin:18px 0 22px;max-width:88%}
.ev-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.ev-grid>div{padding:14px 0;border-bottom:1px solid var(--line)}
.ev-grid>div:nth-child(odd):not(.full){border-right:1px solid var(--line);padding-right:12px}
.ev-grid>div:nth-child(even){padding-left:14px}
.ev-grid .full{grid-column:1/-1}
.ev-grid span{display:block;color:var(--muted);font-size:10px;margin-bottom:6px}
.ev-grid b{font-size:20px;font-weight:700;line-height:1.15;display:block}
.ev-grid small{display:block;color:#bdbac9;font-size:15px;margin-top:3px}
.ev-note{color:#d8d5e6;font-size:16px;margin:16px 0 0}
.btns{display:flex;gap:10px;margin-top:20px}
.btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:54px;border-radius:999px;font:700 16px var(--head);cursor:pointer;border:0;
  background:var(--text);color:#0a0a10;transition:transform .2s}
.btn.ghost{background:transparent;color:var(--text);border:1px solid rgba(255,255,255,.25)}
.btn:active{transform:scale(.96)}
.btn svg{width:19px;height:19px}

/* LINKS */
.links{border-top:1px solid var(--line);perspective:900px}
.lk{display:flex;align-items:center;gap:14px;padding:18px 4px;border-bottom:1px solid var(--line);transform-origin:50% 0;transition:background .25s}
.lk:active{background:rgba(255,255,255,.04)}
.lk-n{color:var(--muted);font-size:11px;width:22px;letter-spacing:.05em}
.lk-ic{flex:none;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(145deg,var(--c),color-mix(in srgb,var(--c) 55%,#000));border:2px solid rgba(255,255,255,.85);box-shadow:0 10px 24px -8px var(--c)}
.lk-ic.dark{color:#111}
.lk-ic svg{width:22px;height:22px}
.lk-t{flex:1;min-width:0}
.lk-t b{display:block;font-size:18px;font-weight:700;line-height:1.15}
.lk-t small{display:block;color:var(--muted);font-size:14px;margin-top:3px}
.lk-go{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;transition:transform .3s,background .3s}
.lk-go svg{width:16px;height:16px}
.lk:hover .lk-go{background:var(--text);color:#000;transform:rotate(-45deg)}

/* MANIFESTO + OBJETIVOS */
.big-text{font-size:clamp(26px,7.6vw,40px);font-weight:700;line-height:1.12;letter-spacing:-.01em;margin-bottom:90px}
.big-text .w{opacity:.14}
.goals{list-style:none;border-top:1px solid var(--line)}
.goals li{display:flex;gap:18px;padding:24px 0;border-bottom:1px solid var(--line)}
.goals .n{color:var(--c);font-size:22px;font-weight:600;letter-spacing:0;line-height:1;padding-top:4px}
.goals h3{font-stretch:125%;font-weight:850;text-transform:uppercase;font-size:24px;margin-bottom:6px}
.goals p{color:#b5b2c2;font-size:17px;line-height:1.45}

/* RAÍZES */
.roots-stage{position:relative;height:100vh;height:100svh;overflow:hidden;max-width:560px;margin:0 auto;padding:96px 20px 0}
.slots{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;max-width:400px;margin:0 auto}
.slots i{aspect-ratio:2/3;border-radius:10px;border:1px dashed rgba(255,255,255,.18)}
.rdeck{position:absolute;left:50%;top:60%;width:0;height:0;perspective:1200px}
.rc{position:absolute;left:0;top:0;width:min(58vw,250px);aspect-ratio:2/3;transform-style:preserve-3d;will-change:transform;container-type:inline-size}
.rf{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:7%}
.rf.front img{width:100%;height:100%;filter:drop-shadow(0 20px 26px rgba(0,0,0,.55))}
.rf.back{transform:rotateY(180deg);background:radial-gradient(120% 80% at 50% 0,color-mix(in srgb,var(--c) 38%,#0b0b12),#09090f 70%);
  border:max(3px,2.4cqw) solid #e9e7e1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8cqw;overflow:hidden;
  box-shadow:0 30px 50px -20px color-mix(in srgb,var(--c) 70%,transparent)}
.rf.back::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.09}
.rf.back b{font-family:var(--stencil);font-weight:400;font-size:58cqw;line-height:.9;color:var(--c);text-shadow:0 0 30px color-mix(in srgb,var(--c) 60%,transparent)}
.rf.back .w{font-stretch:125%;font-weight:850;text-transform:uppercase;font-size:10.5cqw;line-height:1;margin-top:5cqw}
.rf.back p{color:#c9c6d6;font-size:7.2cqw;line-height:1.3;margin-top:4cqw}
.roots-end{position:absolute;left:20px;right:20px;top:42%;text-align:center}
.roots-end .title{font-size:clamp(52px,17vw,88px);margin-bottom:18px}
.roots-end p{color:#b5b2c2;font-size:18px;line-height:1.45;max-width:340px;margin:0 auto}
html.js:not(.static) .roots-end>*{opacity:0}
html.static .roots-end{position:static;margin-top:30px}
.roots-hint{position:absolute;left:0;right:0;bottom:calc(26px + env(safe-area-inset-bottom));text-align:center;color:var(--muted);font-size:10px}

/* GALERIA */
.gal-stage{position:relative;height:100vh;height:100svh;overflow:hidden;max-width:560px;margin:0 auto;padding:96px 20px 0}
.gal-title{position:relative;z-index:1}
.boxwrap{--bw:min(94vw,440px);position:absolute;left:50%;width:var(--bw);aspect-ratio:900/1199;margin-left:calc(var(--bw) / -2);top:calc(100% - var(--bw) * 1.332 * .6);z-index:2}
.box{width:100%;height:100%;-webkit-mask-image:linear-gradient(#000 38%,transparent 58%);mask-image:linear-gradient(#000 38%,transparent 58%)}
.slot{position:absolute;inset:0;perspective:1100px;
  clip-path:polygon(-300% -400%,400% -400%,400% 24.75%,99.32% 24.75%,97.7% 24.34%,95.27% 27.79%,92.03% 31.64%,88.78% 35.4%,86.35% 37.42%,80.68% 35.9%,75% 34.38%,70.14% 33.06%,67.7% 32.45%,66.08% 33.16%,64.46% 33.67%,62.84% 33.98%,61.22% 33.87%,59.59% 33.57%,57.97% 33.06%,56.35% 31.85%,54.73% 29.41%,49.86% 28.19%,45% 26.88%,41.76% 26.06%,39.32% 24.34%,-300% 24.34%)}
.pc{position:absolute;left:0;top:0;width:56%;aspect-ratio:4/3;transform-style:preserve-3d;will-change:transform}
.pf{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:4.7% / 6.3%;overflow:hidden}
.pf.back img{width:100%;height:100%}
.pf.front{transform:rotateY(180deg);border:4px solid #ecebe6;background:#111;box-shadow:0 24px 40px -14px rgba(0,0,0,.8)}
.pf.front img{width:100%;height:100%;object-fit:cover}

.foot{position:relative;text-align:center;padding:120px 20px calc(48px + env(safe-area-inset-bottom))}
.foot img{width:min(70vw,320px);margin:0 auto 18px}
.foot p{color:#cfcbe8;letter-spacing:.42em}
.foot small{display:block;color:var(--muted);margin-top:26px;font-size:10px}

/* Celular: sem filtros (drop-shadow recalcula a cada quadro de animação 3D) e sem camada de grão fixa */
html.mobile .grain{display:none}
html.mobile .hc-in img,html.mobile .htext img,html.mobile .rf.front img,html.mobile .ev-face img,html.mobile #loader img{filter:none}
html.mobile .glow{opacity:.35}
html.mobile .ev{box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
html.mobile .lk-ic{box-shadow:none}

/* Sem animação: layout estático legível */
html.static #loader,html.static .scroll-hint,html.static .roots-hint{display:none}
html.static .roots-stage,html.static .gal-stage{height:auto;padding-bottom:40px}
html.static .rdeck{position:static;width:auto;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;perspective:none}
html.static .rc{position:relative;width:auto}
html.static .rf.front{display:none}
html.static .rf.back{transform:none}
html.static .slots{display:none}
html.static .boxwrap{position:relative;top:auto;left:auto;margin:20px 0 0;width:auto;aspect-ratio:auto}
html.static .box{display:none}
html.static .slot{position:static;clip-path:none;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}
html.static .pc{position:relative;width:auto}
html.static .pf.back{display:none}
html.static .slot{grid-template-columns:1fr}
html.static .pf.front{transform:none;position:relative;aspect-ratio:4/3}
html.static .hcard,html.static .htext{transform:translate(-50%,-50%)}
