/*
Theme Name: VOLTA Landing
Theme URI: https://volta.example
Author: Nilson Silva & M365 Copilot
Description: Landing page para criar desejo e curiosidade — estilo Gen Z. Seções hero, teaser de vídeo, desejo x impacto, LOOP 01 e CTA final. Botões sem navegação.
Version: 1.0.1
License: GPLv2 or later
Text Domain: volta-landing
*/
:root{--bg:#0b0b0b;--fg:#ffffff;--muted:#b8bec9;--accent1:#FFC400;--accent2:#00D1FF;--accent3:#FF4D6D;--accent4:#7CF19E}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#0a0a0a;color:var(--fg);font-family:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button{font:inherit}
.container{width:min(1200px,92vw);margin:0 auto}
.gradient-text{background:linear-gradient(90deg,var(--accent2),var(--accent3),var(--accent1));-webkit-background-clip:text;background-clip:text;color:transparent}
.btn{display:inline-flex;align-items:center;gap:.6rem;background:#111;color:#fff;border:2px solid #222;padding:.9rem 1.2rem;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.25);cursor:pointer;transition:transform .1s ease, background .2s ease}
.btn:hover{transform:translateY(-2px);background:#181818}
.badge{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .6rem;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(8px)}
.noise-overlay{position:fixed;inset:0;pointer-events:none;opacity:.12;background-image:url('assets/img/noise.png');mix-blend-mode:overlay}
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,10,10,.6);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.08)}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;padding:.9rem 0}
.brand{font-family:'Bebas Neue',sans-serif;letter-spacing:.5px;font-size:1.8rem}
.nav{display:flex;gap:1rem;align-items:center}
.nav .pill{padding:.5rem .8rem;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#121212}
.hero{position:relative;display:grid;align-items:center;min-height:88vh;padding:5rem 0;background:linear-gradient(160deg, rgba(0,209,255,.6), rgba(255,196,0,.6) 40%, rgba(255,77,109,.55) 80%), url('assets/img/hero.jpg');background-size:cover;background-position:center}
.hero h1{font-family:'Bebas Neue',sans-serif;line-height:.9;font-size:clamp(2.6rem,6vw,6rem);margin:.6rem 0 1rem}
.hero p{font-size:clamp(1rem,2.4vw,1.4rem);color:var(--muted)}
.hero .cta{margin-top:1.2rem}
.polaroids{position:absolute;right:3vw;top:10vh;display:grid;gap:1rem}
.polaroids .card{width:min(260px,28vw);transform:rotate(-2deg);border-radius:10px;background:#fff;padding:.5rem;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.polaroids .card:nth-child(2){transform:rotate(3deg)}
.section-video{padding:4rem 0;background:linear-gradient(180deg, rgba(0,0,0,.0), rgba(0,0,0,.25)), url('assets/img/shore-placeholder.jpg');background-size:cover;background-position:center}
.section-video h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,5vw,3.5rem)}
.play{width:76px;height:76px;border-radius:999px;border:3px solid #fff;display:grid;place-items:center;margin:1.2rem auto;background:rgba(0,0,0,.25)}
.play::after{content:'';border-left:18px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:6px}
.duo{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;padding:4rem 0}
.duo .panel{border-radius:16px;padding:2rem;background:linear-gradient(135deg, rgba(255,196,0,.25), rgba(0,209,255,.25), rgba(255,77,109,.25));border:1px solid rgba(255,255,255,.12)}
.duo h3{font-family:'Bebas Neue',sans-serif;font-size:clamp(1.8rem,4.2vw,2.6rem)}
.loop{display:grid;grid-template-columns:1fr 1fr;gap:2rem;padding:4rem 0}
.loop .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.thumb{aspect-ratio:4/3;border-radius:14px;background:linear-gradient(135deg,#222,#111)}
.cta-final{padding:5rem 0;background:linear-gradient(45deg, rgba(124,241,158,.25), rgba(0,209,255,.2), rgba(255,77,109,.2))}
.cta-final h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.4rem,6vw,4.4rem)}
.socials{display:flex;gap:.8rem;margin-top:1rem}
.socials .icon{width:38px;height:38px;border-radius:8px;background:#121212;border:1px solid rgba(255,255,255,.12);display:grid;place-items:center}
@media (max-width:900px){.polaroids{display:none}.duo{grid-template-columns:1fr}.loop{grid-template-columns:1fr}}