@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,700&display=swap");


/* =========================================================
   INSPIRA FAM EXPERIENCE 2026 — STYLE NOVO
   Mobile-first. Use CTRL+F pelos títulos abaixo.
========================================================= */
:root{
--navy:#00101d;
--purple:#390099;
--magenta:#9e0059;
--pink:#ff0054;
--orange:#ff5400;
--yellow:#ffbd00;
--off:#f3f3f1;
--white:#fff;
--ink:#071421;
--ease:cubic-bezier(.22,.8,.22,1);
--radius:28px;
--pad:clamp(22px,5vw,72px)}

*{
box-sizing:border-box}

html{
scroll-behavior:smooth;
scroll-padding-top:90px}

body{
margin:0;
background:var(--navy);
color:#fff;
font-family:"DM Sans",sans-serif;
overflow-x:hidden}

body.menu-open{
overflow:hidden}

button,a,input,textarea,select{
font:inherit;
-webkit-tap-highlight-color:transparent}

button{
cursor:pointer}

a{
color:inherit;
text-decoration:none}

img,video{
display:block;
max-width:100%}

h1,h2,h3,p{
margin-top:0}

h1,h2{
font-size:clamp(3.2rem,12vw,8rem);
line-height:.82;
letter-spacing:-.065em;
margin-bottom:28px}

h1 i,h2 i{
font-style:italic}

p{
line-height:1.65}

.section-dark{
background:var(--navy);
color:#fff}
.section-light{
background:var(--off);
color:var(--navy)}

.section-gradient{
background:linear-gradient(135deg,var(--purple),var(--magenta),var(--pink));
color:#fff}

.kicker,.eyebrow{
display:inline-block;
font-size:.7rem;
font-weight:700;
letter-spacing:.17em;
text-transform:uppercase;
margin-bottom:20px}

.section-index{
position:absolute;
top:26px;
left:var(--pad);
font-size:.65rem;
letter-spacing:.16em;
opacity:.45}

.noise{
position:fixed;
inset:0;
pointer-events:none;
z-index:999;
opacity:.025;
background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}


/* REVEAL / ACESSIBILIDADE */
.reveal{
opacity:0;
transform:translateY(26px);
filter:blur(4px);
transition:opacity .7s var(--ease),transform .7s var(--ease),filter .7s var(--ease)}

.reveal.visible{
opacity:1;
transform:none;
filter:none}

@media(prefers-reduced-motion:reduce){
html{
scroll-behavior:auto}
.reveal{
opacity:1;
transform:none;
filter:none;
transition:none}
.float-a,.float-b,.float-c{
animation:none!important}
}


/* MENU */
.site-nav{
position:fixed;
z-index:700;
top:12px;
left:12px;
right:12px;
min-height:62px;
padding:9px 10px 9px 16px;
display:flex;
align-items:center;
justify-content:space-between;
background:rgba(0,16,29,.82);
border:1px solid rgba(255,255,255,.16);
border-radius:24px;
backdrop-filter:blur(18px)}

.brand-link img{
width:145px}

.menu-toggle{
width:44px;
height:44px;
border:0;
border-radius:50%;
background:var(--pink);
display:grid;
place-content:center;
gap:6px}

.menu-toggle span{
width:19px;
height:2px;
background:#fff;
transition:.3s}

.menu-open .menu-toggle span:first-child{
transform:translateY(4px) rotate(45deg)}

.menu-open .menu-toggle span:last-child{
transform:translateY(-4px) rotate(-45deg)}

.nav-links{
position:fixed;
inset:84px 12px auto;
display:none;
flex-direction:column;
padding:14px;
background:rgba(0,16,29,.96);
border:1px solid rgba(255,255,255,.15);
border-radius:24px;
box-shadow:0 20px 60px rgba(0,0,0,.3)}

.menu-open .nav-links{
display:flex}

.nav-link{
padding:16px 18px;
border-radius:16px;
font-size:.75rem;
font-weight:700;
letter-spacing:.1em;
text-transform:uppercase}

.nav-link.active{
background:rgba(255,255,255,.1)}
.nav-cta{
background:var(--pink)}


/* BOTÕES */
.button{
display:inline-flex;
align-items:center;
justify-content:center;
gap:16px;
min-height:52px;
padding:15px 21px;
border:0;
border-radius:999px;
font-size:.7rem;
font-weight:700;
letter-spacing:.1em;
text-transform:uppercase;
transition:transform .25s var(--ease),box-shadow .25s}

.button:active{
transform:scale(.97)}
.button-light{
background:#fff;
color:var(--navy)}
.button-dark{
background:var(--navy);
color:#fff}
.button-pink{
background:var(--pink);
color:#fff}

.button-row,.hero-actions{
display:flex;
flex-wrap:wrap;
gap:12px;
align-items:center}


/* HERO HOME */
.hero{
position:relative;
min-height:100svh;
padding:145px var(--pad) 85px;
display:flex;
align-items:flex-end;
overflow:hidden;
background:var(--navy)}

.hero-stripes{
position:absolute;
inset:-20%;
background:repeating-linear-gradient(110deg,transparent 0 90px,rgba(255,0,84,.11) 90px 150px,transparent 150px 220px,rgba(255,84,0,.09) 220px 280px)}

.hero-media{
position:absolute;
inset:82px 0 auto 20%;
height:52svh;
overflow:hidden;
clip-path:polygon(10% 0,100% 5%,94% 100%,0 90%)}

.hero-video{
width:100%;
height:100%;
object-fit:cover}

.hero-gradient{
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(0,16,29,.05) 20%,rgba(0,16,29,.88) 75%,var(--navy))}

.hero-copy{
position:relative;
z-index:4;
max-width:700px}

.hero-logo{
width:min(560px,85vw);
margin-bottom:24px}

.hero-subtitle{
font-size:clamp(1.15rem,4.8vw,1.7rem);
max-width:480px}

.access-note{
font-size:.68rem;
letter-spacing:.08em;
text-transform:uppercase}
.access-note b{
color:var(--yellow)}

.sticker{
position:absolute;
pointer-events:none;
width:70px;
z-index:3}
.sticker-star{
right:5%;
top:20%}
.sticker-square{
right:10%;
top:48%}
.sticker-arc{
left:3%;
top:16%}

.float-a{
animation:floatA 5s ease-in-out infinite}
.float-b{
animation:floatB 6s ease-in-out infinite}
.float-c{
animation:floatA 7s ease-in-out infinite reverse}

@keyframes floatA{
50%{
transform:translateY(-14px) rotate(8deg)}
}
@keyframes floatB{
50%{
transform:translate(7px,-10px) rotate(-10deg)}
}

.scroll-cue{
position:absolute;
right:var(--pad);
bottom:24px;
z-index:5;
font-size:.6rem;
text-transform:uppercase;
letter-spacing:.14em;
opacity:.7}


/* BANNER DE INSCRIÇÃO */
.registration-banner{
padding:64px var(--pad);
background:var(--yellow);
color:var(--navy);
display:grid;
gap:28px}

.registration-banner h2{
font-size:clamp(2.8rem,9vw,6.4rem)}

.registration-banner-copy{
max-width:580px}
.registration-banner-copy p{
font-size:1.05rem}


/* SEÇÕES HOME */
.manifesto,.impact,.experiences,.schedule,.gallery,.location,.social{
position:relative;
padding:110px var(--pad) 80px}

.section-heading{
max-width:850px}
.section-heading>p{
max-width:620px}

.manifesto{
min-height:760px;
overflow:hidden}
.manifesto-copy{
display:grid;
gap:28px;
max-width:1000px}
.lead{
font-size:clamp(2rem,8vw,5rem);
line-height:.9}
.signature{
font-size:clamp(1rem,4vw,1.6rem);
font-style:italic;
display:flex;
flex-wrap:wrap;
gap:12px}
.signature span{
color:var(--pink)}

.floating-word{
position:absolute;
bottom:-.15em;
left:-.04em;
font-size:clamp(6rem,22vw,18rem);
font-weight:700;
letter-spacing:-.09em;
opacity:.045;
white-space:nowrap}

.edition-list{
border-top:1px solid rgba(0,16,29,.2)}
.edition{
display:grid;
grid-template-columns:80px 1fr;
gap:20px;
padding:24px 0;
border-bottom:1px solid rgba(0,16,29,.2)}
.edition>span{
font-weight:700}
.edition small{
letter-spacing:.15em}
.edition h3{
font-size:clamp(2rem,7vw,4rem);
margin:5px 0}

.experience-grid{
display:grid;
gap:10px;
margin-top:40px}
.experience-card{
min-height:105px;
padding:22px;
border:1px solid rgba(255,255,255,.25);
background:rgba(255,255,255,.08);
color:#fff;
border-radius:22px;
text-align:left;
display:grid;
grid-template-columns:34px 1fr auto;
align-items:center;
gap:12px;
transition:.25s}
.experience-card strong{
font-size:1.05rem}
.experience-card i{
font-size:1.5rem}
.experience-card:active,.experience-card.touch-active{
background:#fff;
color:var(--navy);
transform:scale(.985)}


/* PROGRAMAÇÃO */
.schedule-head{
max-width:900px}
.schedule-callout{
margin:35px 0;
padding:24px;
border:1px solid rgba(255,255,255,.18);
border-radius:22px;
display:grid;
gap:8px}
.schedule-callout span{
color:var(--yellow);
font-weight:700}
.schedule-callout strong{
font-size:1.2rem}
.schedule-callout small{
opacity:.7;
line-height:1.5}

.schedule-tabs{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:8px;
margin-bottom:16px}
.schedule-tab{
padding:16px 10px;
border:1px solid rgba(255,255,255,.2);
border-radius:18px;
background:transparent;
color:#fff;
display:grid;
gap:4px}
.schedule-tab span{
font-size:.6rem;
letter-spacing:.14em}
.schedule-tab.active{
background:var(--pink);
border-color:var(--pink)}

.schedule-panel{
display:none;
border-radius:24px;
overflow:hidden;
background:#fff;
color:var(--navy)}
.schedule-panel.active{
display:block;
animation:panelIn .35s var(--ease)}
@keyframes panelIn{
from{
opacity:0;
transform:translateY(8px)}
}

.schedule-day{
padding:20px;
background:var(--yellow);
display:grid;
gap:5px}
.schedule-day span{
font-size:.65rem;
letter-spacing:.14em}
.schedule-row{
display:grid;
grid-template-columns:85px 1fr;
gap:15px;
padding:20px;
border-bottom:1px solid rgba(0,16,29,.1)}
.schedule-row time{
font-weight:700;
color:var(--pink)}
.schedule-row p{
margin:5px 0 0;
font-size:.88rem}


/* GALERIA 2025 */
.photo-grid{
display:grid;
grid-template-columns:1fr;
gap:14px;
margin-top:36px}
.photo-slot{
margin:0}
.photo-slot div{
aspect-ratio:4/3;
border:2px dashed rgba(0,16,29,.22);
border-radius:22px;
display:grid;
place-items:center;
font-weight:700;
letter-spacing:.15em;
background:linear-gradient(135deg,rgba(57,0,153,.08),rgba(255,0,84,.08))}
.photo-slot figcaption{
padding:9px 4px;
font-size:.7rem;
text-transform:uppercase;
letter-spacing:.1em}


/* LOCALIZAÇÃO */
.location{
display:grid;
gap:45px}
.location-copy{
max-width:720px}
.location-copy p{
font-size:1rem}
.location-copy b{
color:var(--yellow)}

.info-grid{
display:grid;
gap:10px}
.info-grid article{
padding:22px;
border:1px solid rgba(255,255,255,.16);
border-radius:20px}
.info-grid article>span{
color:var(--pink);
font-weight:700}
.info-grid h3{
margin:10px 0 8px}
.info-grid p{
margin:0;
opacity:.8}

.social{
min-height:560px;
display:flex;
align-items:center}
.social>div{
max-width:900px}

.final-cta,.faq-final{
padding:100px var(--pad);
background:var(--pink);
color:#fff}
.final-cta h2,.faq-final h2{
font-size:clamp(3.5rem,12vw,8rem)}


/* SUBPÁGINAS */
.subhero{
position:relative;
min-height:70svh;
padding:150px var(--pad) 70px;
display:flex;
align-items:flex-end;
overflow:hidden;
background:var(--navy)}
.subhero>div:first-child{
position:relative;
z-index:2;
max-width:900px}
.subhero h1{
font-size:clamp(4rem,14vw,9rem)}
.subhero p{
max-width:620px}

.date-badge{
position:absolute;
right:var(--pad);
top:120px;
font-size:clamp(2.5rem,10vw,6rem);
font-weight:700;
letter-spacing:-.06em;
color:var(--yellow)}
.date-badge span{
display:block;
font-size:.22em;
letter-spacing:.15em;
text-align:right}

.question-mark{
position:absolute;
right:3%;
top:18%;
font-size:40vw;
font-weight:700;
line-height:.7;
color:rgba(255,255,255,.04)}


/* INSCRIÇÕES */
.choice-section{
padding:90px var(--pad)}
.choice-grid{
display:grid;
gap:14px}
.choice-card{
min-height:310px;
padding:26px;
border:0;
border-radius:28px;
text-align:left;
background:var(--navy);
color:#fff;
display:flex;
flex-direction:column;
align-items:flex-start}
.choice-card.commercial{
background:var(--purple)}
.choice-card>span{
color:var(--yellow);
font-weight:700}
.choice-card small{
margin-top:35px;
letter-spacing:.14em}
.choice-card h3{
font-size:clamp(2rem,8vw,4rem);
line-height:.9;
margin:14px 0}
.choice-card p{
opacity:.75}
.choice-card b{
margin-top:auto}

.forms-section{
padding:100px var(--pad)}
.form-shell{
max-width:1000px;
margin:auto}
.event-form{
display:grid;
gap:16px;
margin-top:38px}
.event-form label{
display:grid;
gap:8px;
font-size:.72rem;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase}
.event-form input,.event-form textarea,.event-form select{
width:100%;
border:1px solid rgba(255,255,255,.22);
border-radius:15px;
background:rgba(255,255,255,.08);
color:#fff;
padding:15px;
outline:none}
.event-form select option{
color:#111}
.event-form input:focus,.event-form textarea:focus,.event-form select:focus{
border-color:var(--pink);
box-shadow:0 0 0 3px rgba(255,0,84,.15)}
.full{
grid-column:1/-1}
.submit-button[disabled]{
opacity:.55;
cursor:wait}

.form-result{
text-align:center;
padding:50px 0}
.form-result>img{
width:100px;
margin:0 auto 20px}
.form-result h3{
font-size:clamp(2.8rem,10vw,6rem)}
.form-result .button-row{
justify-content:center}


/* MAPA */
.map-section{
padding:90px var(--pad)}
.map-frame{
margin-top:35px;
padding:10px;
background:#fff;
border:1px solid rgba(0,16,29,.15);
border-radius:28px;
box-shadow:0 20px 60px rgba(0,16,29,.1)}
.map-frame img{
width:100%;
border-radius:20px}
.map-placeholder{
min-height:55vh;
border:2px dashed rgba(0,16,29,.2);
border-radius:20px;
display:grid;
place-content:center;
text-align:center;
gap:14px}
.map-placeholder strong{
font-size:clamp(3rem,12vw,8rem);
letter-spacing:-.07em}
.map-placeholder code{
font-size:.75rem}

.legend-card{
margin-top:24px;
padding:26px;
border-radius:28px;
background:var(--navy);
color:#fff;
display:grid;
gap:25px}
.legend-card h3{
font-size:1.4rem}
.map-legend{
list-style:none;
margin:0;
padding:0;
display:grid;
gap:8px}
.map-legend li{
display:grid;
grid-template-columns:48px 1fr;
align-items:center;
padding:13px;
border:1px solid rgba(255,255,255,.14);
border-radius:14px}
.map-legend b{
color:var(--yellow)}
.map-final{
padding:90px var(--pad)}


/* FAQ */
.quick-facts{
padding:25px var(--pad);
display:grid;
gap:8px}
.quick-facts article{
padding:20px;
border:1px solid rgba(0,16,29,.15);
border-radius:18px;
display:grid}
.quick-facts span,.quick-facts small{
font-size:.65rem;
letter-spacing:.12em}
.quick-facts strong{
font-size:1.4rem}

.faq-content{
padding:90px var(--pad)}
.faq-list{
margin-top:30px}
.faq-list details{
border-top:1px solid rgba(0,16,29,.18)}
.faq-list details:last-child{
border-bottom:1px solid rgba(0,16,29,.18)}
.faq-list summary{
list-style:none;
display:grid;
grid-template-columns:42px 1fr auto;
gap:12px;
align-items:center;
padding:20px 0;
cursor:pointer}
.faq-list summary::-webkit-details-marker{
display:none}
.faq-list summary b{
color:var(--pink)}
.faq-list summary i{
font-size:1.5rem;
transition:.25s}
.faq-list details[open] summary i{
transform:rotate(45deg)}
.faq-list details p{
padding:0 0 20px 54px;
max-width:750px}


/* MODAL */
.experience-modal{
width:min(620px,calc(100% - 28px));
border:0;
border-radius:28px;
padding:34px;
background:var(--off);
color:var(--navy)}
.experience-modal::backdrop{
background:rgba(0,16,29,.8);
backdrop-filter:blur(5px)}
.experience-modal h3{
font-size:clamp(2rem,8vw,4rem);
line-height:.9}
.modal-close{
position:absolute;
right:15px;
top:15px;
width:42px;
height:42px;
border:0;
border-radius:50%;
background:var(--navy);
color:#fff;
font-size:1.5rem}


/* FOOTER */
.footer{
padding:32px var(--pad);
background:var(--navy);
border-top:1px solid rgba(255,255,255,.13);
display:grid;
gap:18px;
align-items:center}
.footer img{
width:150px}
.footer div{
display:flex;
flex-wrap:wrap;
gap:12px 24px;
font-size:.68rem;
letter-spacing:.1em}
.footer a{
font-size:.72rem;
text-transform:uppercase}


/* DESKTOP */
@media(min-width:760px){

  .site-nav{
top:18px;
left:50%;
right:auto;
transform:translateX(-50%);
width:calc(100% - 40px);
max-width:1400px;
border-radius:30px}

  .menu-toggle{
display:none}
.nav-links{
position:static;
display:flex;
flex-direction:row;
padding:0;
background:none;
border:0;
box-shadow:none}
.nav-link{
padding:11px 14px;
border-radius:999px}

  .nav-link:hover{
background:rgba(255,255,255,.1)}
.nav-cta:hover{
background:var(--pink)}

  .hero{
padding-top:18vh;
align-items:center}
.hero-media{
inset:8vh -4vw auto auto;
width:68vw;
height:84vh}
.hero-gradient{
background:linear-gradient(90deg,var(--navy) 0%,rgba(0,16,29,.82) 30%,rgba(0,16,29,.12) 72%)}

  .sticker{
width:105px}
.registration-banner{
grid-template-columns:1.1fr .9fr;
align-items:end}

  .manifesto-copy{
grid-template-columns:.7fr 1.3fr;
margin-left:auto}
.experience-grid{
grid-template-columns:repeat(2,1fr)}
.experience-card:hover{
background:#fff;
color:var(--navy);
transform:translateY(-3px)}

  .schedule-tabs{
grid-template-columns:repeat(4,1fr)}
.schedule-row{
grid-template-columns:130px 1fr}
.photo-grid{
grid-template-columns:repeat(3,1fr)}
.photo-slot:nth-child(2),.photo-slot:nth-child(5){
transform:translateY(28px)}

  .location{
grid-template-columns:1fr 1fr;
align-items:start}
.info-grid{
grid-template-columns:repeat(2,1fr)}

  .choice-grid{
grid-template-columns:1fr 1fr}
.choice-card{
min-height:420px;
padding:36px}
.choice-card:hover{
transform:translateY(-6px)}

  .event-form{
grid-template-columns:repeat(2,1fr)}
.legend-card{
grid-template-columns:.8fr 1.2fr;
padding:38px}
.map-legend{
grid-template-columns:1fr 1fr}

  .quick-facts{
grid-template-columns:repeat(3,1fr)}
.footer{
grid-template-columns:auto 1fr auto}

}

@media(min-width:1200px){
.experience-grid{
grid-template-columns:repeat(3,1fr)}
.experience-card{
min-height:135px}
.photo-grid{
gap:22px}
}

/* EXPERIENCE — redesigned responsive composition */
[hidden]{
display:none!important}
body{
overflow-x:clip}
h1,h2{
line-height:.98;
letter-spacing:-.055em;
text-wrap:balance;
font-size:clamp(2.8rem,8vw,7.5rem)}
h3{
line-height:1.12}
.kicker,.eyebrow{
font-size:.875rem;
letter-spacing:.12em}
.section-index{
font-size:.8rem}
.button,.nav-link{
font-size:.875rem;
letter-spacing:.04em}
.button:hover{
transform:translateY(-3px);
box-shadow:0 8px 0 rgba(255,255,255,.12)}
:focus-visible{
outline:3px solid var(--yellow);
outline-offset:5px}
.skip-link{
position:fixed;
top:-100px;
left:20px;
z-index:9999;
padding:16px;
background:white;
color:var(--navy)}
.skip-link:focus{
top:20px}
.reveal{
opacity:1;
filter:none;
transform:none}
.js-motion .reveal{
opacity:0;
transform:translateY(24px);
transition:opacity .6s,transform .6s}
.js-motion .reveal.visible{
opacity:1;
transform:none}
.site-nav{
border-radius:18px}
.brand-link img{
width:180px}
.hero{
min-height:850px;
min-height:100svh;
position:relative;
padding:180px var(--pad) 140px;
display:flex;
align-items:center;
background:radial-gradient(ellipse at 85% 45%,#390099 0,transparent 55%),var(--navy);
isolation:isolate;
overflow:hidden}
.hero-copy{
width:65%;
position:relative;
z-index:3}
.hero-logo{
width:min(100%,720px)}
.hero-subtitle{
font-size:clamp(1.4rem,2.6vw,2.3rem);
max-width:560px;
margin:35px 0}
.hero-subtitle strong{
color:var(--yellow)}
.hero-orbit{
position:absolute;
width:40%;
aspect-ratio:1;
right:3%;
top:24%;
display:grid;
place-items:center;
border:1px solid #ffffff26;
border-radius:50%;
transform:rotate(-9deg)}
.hero-orbit:before{
content:'';
position:absolute;
inset:12%;
border:1px dashed #ffffff33;
border-radius:50%}
.orbit-main{
width:70%;
filter:drop-shadow(0 25px 25px #0005);
animation:orbitFloat 6s ease-in-out infinite}
.orbit-friend{
position:absolute;
width:27%;
right:-5%;
bottom:0;
transform:rotate(15deg)}
.orbit-label{
position:absolute;
top:-20px;
font-size:.9rem;
letter-spacing:.2em;
color:var(--yellow);
background:var(--purple);
padding:14px 22px;
border-radius:30px}
.hero .sticker{
width:clamp(70px,9vw,130px);
z-index:2}
.hero .sticker-star{
top:14%;
left:40%;
right:auto}
.hero .sticker-square{
left:auto;
right:5%;
top:13%;
bottom:auto}
.hero .sticker-arc{
left:8%;
top:auto;
bottom:100px}
.hero-facts{
position:absolute;
bottom:32px;
left:var(--pad);
right:var(--pad);
display:flex;
justify-content:space-between;
border-top:1px solid #ffffff35;
padding-top:20px;
font-size:.875rem;
gap:20px}
.hero-facts b{
font-size:1.6rem;
margin-right:12px}
.scroll-cue{
display:none}
.hero-actions{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:16px}
.access-note{
font-size:.875rem}
.marquee{
background:var(--yellow);
color:var(--navy);
padding:20px 0;
overflow:hidden;
transform:rotate(-1.5deg);
margin:-10px 0;
position:relative;
z-index:5}
.marquee>div{
width:max-content;
white-space:nowrap;
font-size:clamp(1.4rem,3vw,2.5rem);
font-weight:bold;
animation:marquee 28s linear infinite}
.registration-banner{
padding:85px var(--pad);
background:var(--pink);
color:white}
.registration-banner h2{
font-size:clamp(2.5rem,5vw,4.5rem)}
.manifesto,.impact,.experiences,.schedule,.gallery,.location,.social{
padding:100px var(--pad);
position:relative}
.manifesto{
overflow:hidden}
.manifesto-copy{
margin-top:35px;
max-width:100%;
gap:40px}
.manifesto-copy .lead{
font-size:clamp(2rem,4vw,4rem);
overflow-wrap:anywhere}
.floating-word{
opacity:.035;
pointer-events:none}
.edition{
transition:padding .25s,background .25s;
border-radius:12px}
.edition:hover{
background:#ffbd0033;
padding-left:20px}
.experience-card{
border-radius:16px;
min-height:160px;
box-shadow:0 10px 30px #0001}
.experience-card strong{
font-size:1.25rem;
line-height:1.3}
.coming-soon{
margin-top:35px;
padding:clamp(25px,5vw,70px);
border:1px solid currentColor;
border-radius:24px;
position:relative;
overflow:hidden}
.coming-soon>strong{
display:block;
font-size:clamp(3rem,10vw,9rem);
line-height:1.15;
letter-spacing:-.06em;
margin:25px 0;
color:var(--pink)}
.schedule .coming-soon>strong{
color:var(--yellow)}
.coming-soon p{
max-width:620px;
font-size:1.1rem}
.pill{
display:inline-flex;
border:1px solid currentColor;
padding:9px 15px;
border-radius:40px;
font-size:.875rem}
.date-strip{
display:flex;
flex-wrap:wrap;
gap:10px;
margin:25px 0}
.date-strip span{
border:1px solid #ffffff40;
padding:14px 20px;
border-radius:12px}
.gallery{
overflow:hidden;
background:#efeaf8}
.gallery-toolbar{
display:flex;
justify-content:space-between;
align-items:center;
gap:15px;
margin-top:40px}
.gallery-toolbar p{
margin:0}
.gallery-toolbar button,.gallery-modal-controls button{
width:48px;
height:48px;
border-radius:50%;
border:1px solid currentColor;
background:transparent;
color:inherit;
font-size:1.3rem}
.gallery-track{
display:flex;
gap:24px;
overflow-x:auto;
scroll-snap-type:x mandatory;
padding:25px 5px 35px;
scrollbar-width:thin;
scrollbar-color:var(--purple) transparent}
.memory-card{
flex:0 0 34%;
scroll-snap-align:center;
min-height:470px;
border:0;
border-radius:18px;
padding:24px;
display:flex;
flex-direction:column;
align-items:flex-start;
color:#fff;
background:var(--purple);
text-align:left;
transition:transform .3s}
.memory-card:nth-child(even){
transform:rotate(2deg)}
.memory-card:nth-child(odd){
transform:rotate(-2deg)}
.memory-card:hover{
transform:rotate(0) translateY(-6px)}
.memory-card img{
height:220px;
width:100%;
object-fit:contain;
margin:25px 0;
transition:transform .3s}
.memory-card:hover img{
transform:scale(1.06) rotate(-8deg)}
.memory-card strong{
font-size:clamp(1.8rem,3vw,2.8rem);
line-height:1.03;
letter-spacing:-.04em}
.memory-top,.memory-bottom{
font-size:.8rem;
letter-spacing:.08em}
.memory-bottom{
margin-top:auto;
padding-top:25px}
.memory-1{
background:var(--pink)}
.memory-2{
background:var(--orange)}
.memory-3{
background:var(--magenta)}
.memory-4{
background:var(--navy)}
.gallery-note{
font-size:.875rem;
max-width:650px}
.gallery-modal{
width:min(700px,calc(100% - 24px));
max-height:90svh;
overflow:auto;
border:0;
border-radius:24px;
background:var(--navy);
color:white;
padding:25px}
.gallery-modal::backdrop{
background:#00101deb;
backdrop-filter:blur(8px)}
.gallery-close{
position:absolute;
right:12px;
top:12px;
z-index:2;
width:44px;
height:44px;
border-radius:50%;
border:0;
font-size:1.8rem}
.gallery-modal .memory-card{
width:100%;
min-height:400px;
transform:none;
pointer-events:none}
.gallery-modal .memory-card img{
height:220px}
.gallery-modal>p{
margin:18px 0}
.gallery-modal-controls{
display:flex;
justify-content:space-between}
.arrival-info{
display:grid;
grid-template-columns:1fr 1fr;
gap:30px;
margin-top:35px}
.arrival-info>div{
padding:30px;
border-radius:20px;
background:var(--navy);
color:white}
.arrival-info h3{
font-size:1.8rem}
.arrival-info .kicker{
color:var(--yellow)}
.subhero{
padding-top:200px;
min-height:650px;
background:radial-gradient(ellipse at 95% 60%,#390099 0,transparent 65%),var(--navy)}
.subhero h1{
font-size:clamp(3rem,8vw,7.5rem)}
.subhero .sticker{
position:absolute;
right:8%;
top:140px;
width:150px;
opacity:1}
.date-badge{
top:100px;
font-size:3rem}
.choice-card{
transition:transform .25s,box-shadow .25s}
.choice-card:hover,.choice-card:focus-visible{
box-shadow:0 14px 0 #ffbd00;
transform:translateY(-8px)}
.event-form label{
font-size:.875rem}
.form-status{
padding:18px;
border:1px solid var(--pink);
border-radius:12px}
.footer div,.footer a,.quick-facts span,.quick-facts small{
font-size:.875rem}
.experience-modal h3{
line-height:1.1;
padding-top:25px}
.info-grid p{
opacity:1}
.section-heading p{
max-width:650px}
.final-cta{
background:var(--yellow);
color:var(--navy)}
.final-cta h2,.faq-final h2{
font-size:clamp(3rem,9vw,7rem)}

@keyframes orbitFloat{
50%{
transform:translateY(-20px) rotate(10deg)}
}
@keyframes marquee{
to{
transform:translateX(-50%)}
}

@media(max-width:900px){
.hero-copy{
width:72%}
.hero-orbit{
right:-8%;
width:45%;
top:35%;
opacity:.85}
.hero .sticker-star{
left:50%;
top:16%}
.memory-card{
flex-basis:48%}
.location{
grid-template-columns:1fr}
.hero-facts b{
display:block}
.manifesto-copy{
grid-template-columns:1fr}
.lead br{
display:none}
}

@media(max-width:600px){
:root{
--pad:22px}
.hero{
padding-top:160px;
padding-bottom:150px;
min-height:960px;
align-items:flex-start;
display:block}
.hero-copy{
width:100%;
margin-top:60px}
.hero-logo{
width:100%}
.hero-subtitle{
font-size:1.7rem;
margin:25px 0}
.hero-orbit{
position:relative;
top:auto;
right:auto;
width:68%;
margin:60px 10% 0 24%;
opacity:1}
.orbit-label{
font-size:.75rem;
padding:10px;
top:-15px}
.hero .sticker-star{
top:105px;
left:7%;
width:75px}
.hero .sticker-square{
top:120px;
right:15%;
width:70px}
.hero .sticker-arc{
bottom:210px;
left:5%;
width:75px}
.hero-facts{
font-size:.75rem;
bottom:25px}
.hero-facts b{
font-size:1.4rem}
.hero-facts span{
max-width:48%}
.hero-actions .button{
width:100%}
.manifesto,.impact,.experiences,.schedule,.gallery,.location,.social{
padding:80px var(--pad)}
.experience-grid{
grid-template-columns:1fr}
.experience-card{
min-height:115px}
.memory-card{
flex-basis:86%;
min-height:430px}
.memory-card strong{
font-size:2rem}
.memory-card img{
height:190px}
.gallery-toolbar p{
max-width:60%;
font-size:.875rem}
.gallery-toolbar>div{
display:flex;
gap:6px}
.arrival-info{
grid-template-columns:1fr}
.subhero{
padding-top:220px;
min-height:650px}
.subhero .sticker{
top:100px;
right:10%;
width:90px}
.date-badge{
left:var(--pad);
right:auto;
top:105px;
font-size:2.7rem}
.subhero h1{
font-size:clamp(2.8rem,11vw,4rem)}
.choice-card{
min-height:340px}
.choice-card h3{
font-size:2.4rem;
line-height:1.05}
.choice-card small{
font-size:.8rem}
.footer img{
width:180px}
.faq-list summary{
grid-template-columns:28px 1fr 20px;
gap:8px}
.faq-list details p{
padding-left:36px}
.coming-soon{
padding:24px}
.coming-soon>strong{
font-size:clamp(2.6rem,11vw,4.6rem)}
.button-row{
align-items:stretch}
.button-row .button{
width:100%}
.signature{
font-size:1.4rem}
}

@media(prefers-reduced-motion:reduce){
*,*:before,*:after{
animation:none!important;
transition:none!important;
scroll-behavior:auto!important}
.js-motion .reveal{
opacity:1;
transform:none}
}


/* =========================================================
   10. REVISÃO RESPONSIVA — OUTUBRO 2026
   Pesquise: STICKERS, HERO, MOBILE, RETORNO.
   As novas ilustrações ocupam espaço real no grid/flex.
========================================================= */

/* STICKERS — trilhas decorativas, sem posicionamento sobre texto */
.sticker-rail {

  display:flex;

  align-items:center;

  justify-content:flex-end;

  flex-wrap:wrap;

  gap:clamp(16px,3vw,40px);

  padding:20px 6px;

  margin:24px 0;

  pointer-events:none;

}

.sticker-rail img {

  width:clamp(64px,8vw,110px);

  height:clamp(64px,8vw,110px);

  object-fit:contain;

  animation:stickerBob 6s ease-in-out infinite;

}

.sticker-rail img:nth-child(2){
animation-delay:-2s}

.sticker-rail img:nth-child(3){
animation-delay:-4s}

@keyframes stickerBob{
50%{
transform:translateY(-7px) rotate(5deg)}
}

.edition {

  grid-template-columns:80px minmax(0,1fr) clamp(70px,10vw,140px);

  align-items:center;

}

.edition-sticker{
width:100%;
max-height:130px;
object-fit:contain;
padding:8px;
animation:stickerBob 7s ease-in-out infinite}

.edition:nth-child(2) .edition-sticker{
animation-delay:-3s}

.edition h3{
overflow-wrap:anywhere}


/* HERO DES SUBPÁGINAS — texto e stickers em colunas separadas */
.subhero {

  display:grid;

  grid-template-columns:minmax(0,1fr) minmax(140px,25%);

  align-items:center;

  gap:32px;

}

.subhero>div:first-child{
min-width:0;
max-width:100%}

.subhero .hero-rail{
margin:0;
justify-content:center;
align-content:center}

.subhero .hero-rail img{
width:clamp(75px,10vw,140px);
height:clamp(75px,10vw,140px)}

.subhero h1{
font-size:clamp(2.75rem,6.8vw,7rem);
overflow-wrap:normal}


/* RESPONSIVIDADE — controles, grid e textos redimensionáveis */
main,section,.section-heading,.location-copy,.form-shell,.choice-card,.info-grid article{
min-width:0}

input,select,textarea{
min-width:0;
font-size:1rem}

.button {
max-width:100%;
white-space:normal;
text-align:center;
overflow-wrap:anywhere}

.nav-links{
max-height:calc(100svh - 110px);
overflow-y:auto}

.gallery-toolbar>div{
display:flex;
gap:8px;
flex-shrink:0}

.memory-top,.memory-bottom{
overflow-wrap:anywhere}

.memory-card{
min-width:0}

.form-result h3{
overflow-wrap:anywhere;
line-height:1.1}

.hero-copy{
min-width:0}


/* HERO PRINCIPAL — cada elemento em área própria do grid */
.hero {

  display:grid;

  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);

  grid-template-rows:auto auto auto;

  align-items:center;

  gap:36px 45px;

  padding:125px var(--pad) 35px;

}

.hero-copy{
grid-column:1;
grid-row:2;
width:100%;
margin:0}

.hero-orbit{
grid-column:2;
grid-row:2;
position:relative;
top:auto;
right:auto;
width:90%;
margin:25px auto;
opacity:1}

.hero .sticker{
position:static;
inset:auto;
max-width:100%;
width:90px;
margin:0;
justify-self:center}

.hero .sticker-star{
grid-column:1;
grid-row:1;
justify-self:start}

.hero .sticker-square{
grid-column:2;
grid-row:1;
justify-self:end}

.hero .sticker-arc{
grid-column:2;
grid-row:3;
justify-self:start}

.hero-facts{
position:static;
grid-column:1 / -1;
grid-row:4;
margin-top:15px}

.hero .orbit-label{
max-width:105%;
text-align:center;
white-space:normal;
line-height:1.6}

.footer [data-back-top],.footer [data-back-event]{
display:inline-flex;
min-height:44px;
align-items:center;
padding:8px 0}


/* TABLET — conserver todos os elementos, adaptar distribuição */
@media(max-width:900px){

  .hero{
gap:28px 20px}

  .hero .sticker{
width:75px}

  .subhero{
grid-template-columns:minmax(0,1fr) 150px;
gap:20px}

  .subhero .hero-rail img{
width:85px;
height:85px}

  .subhero h1{
font-size:clamp(2.75rem,7vw,5rem)}

}


/* MOBILE — fluxo vertical e áreas reservadas para ilustrações */
@media(max-width:600px){

  .hero{
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
min-height:auto;
padding:110px var(--pad) 28px;
gap:26px 15px}

  .hero .sticker{
width:70px}

  .hero-copy{
grid-column:1 / -1;
grid-row:2;
margin:0}

  .hero-orbit{
grid-column:1 / -1;
grid-row:3;
width:65%;
margin:30px 0 30px auto}

  .hero .sticker-arc{
grid-column:1;
grid-row:3;
width:65px;
align-self:end;
justify-self:start}

  .hero-facts{
grid-row:4;
gap:16px;
margin:0}

  .hero-facts span{
max-width:50%;
min-width:0;
line-height:1.6}

  .subhero{
display:flex;
flex-direction:column-reverse;
align-items:stretch;
justify-content:center;
padding:105px var(--pad) 55px;
gap:25px;
min-height:auto}

  .subhero .hero-rail{
padding:10px 0;
justify-content:space-between}

  .subhero .hero-rail img{
width:70px;
height:70px}

  .subhero h1{
font-size:clamp(2.5rem,10.5vw,4rem)}

  .sticker-rail{
justify-content:center;
gap:24px;
padding:18px 0}

  .sticker-rail img{
width:70px;
height:70px}

  .edition{
grid-template-columns:52px minmax(0,1fr) 65px;
gap:12px;
padding:24px 0}

  .edition h3{
font-size:clamp(1.45rem,6.5vw,2.4rem);
line-height:1.15}

  .edition small{
font-size:.8rem}

  .edition-sticker{
padding:0}

  .edition:hover{
padding-left:0}

  .experience-card{
grid-template-columns:26px minmax(0,1fr) 20px;
gap:10px;
padding:20px}

  .experience-card strong{
font-size:1.05rem}

  .choice-card h3{
font-size:clamp(1.9rem,8vw,2.4rem)}

  .coming-soon>strong{
font-size:clamp(2.4rem,10.5vw,4.6rem)}

  .date-strip span{
padding:12px 15px}

  .faq-list summary{
padding:20px 0;
line-height:1.5}

  .footer{
gap:15px}

}

@media(prefers-reduced-motion:reduce){
.sticker-rail img,.edition-sticker{
animation:none!important}
}


/* =========================================================
   11. MOBILE — largura real, conteúdo fluido e menu visível
   O conteúdo nunca pode impor largura maior que a tela.
========================================================= */
html{width:100%;max-width:100%;overflow-x:hidden}
body{width:100%;max-width:100%;min-width:0;overflow-x:hidden}
main{width:100%;max-width:100%;container-type:inline-size;container-name:site-content}
main>section{width:100%;max-width:100%;min-width:0}
section>div,article,figure,form{min-width:0}
.hero-copy,.hero-actions,.registration-banner-copy,.schedule-head,.section-heading{max-width:100%;min-width:0}
p,small,strong,label,h1,h2,h3{overflow-wrap:break-word}
.hero-logo{display:block;width:100%;max-width:100%;height:auto;min-width:0}
.hero-actions{width:100%;max-width:100%}
.access-note{max-width:100%;white-space:normal;line-height:1.65}
.site-nav{box-sizing:border-box;max-width:calc(100% - 24px);gap:12px}
.brand-link{min-width:0;flex:0 1 180px;max-width:calc(100% - 56px)}
.brand-link img{width:100%;max-width:180px;height:auto}
.menu-toggle{flex:0 0 44px}
.marquee{max-width:100%}
.gallery-track{width:100%;max-width:100%;min-width:0}
/* Tablet e celular recebem menu compacto para não cortar a navegação. */
@media(max-width:1024px){
 .site-nav{top:12px;left:12px;right:12px;transform:none;width:auto;max-width:calc(100% - 24px)}
 .menu-toggle{display:grid}
 .nav-links{position:absolute;top:calc(100% + 12px);left:0;right:0;bottom:auto;display:none;flex-direction:column;padding:14px;background:var(--navy);border:1px solid #ffffff30;border-radius:18px;width:100%;max-width:100%}
 .menu-open .nav-links{display:flex}
 .nav-link{width:100%;padding:16px;white-space:normal}
}
/* Também se adapta a prévias estreitas dentro de uma janela maior. */
@container site-content (max-width:600px){
 .hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:110px 20px 28px;gap:25px 12px;min-height:auto}
 .hero-copy{grid-column:1 / -1;grid-row:2;width:100%;margin:0}
 .hero .sticker-star{grid-column:1;grid-row:1}
 .hero .sticker-square{grid-column:2;grid-row:1}
 .hero .sticker{width:65px;position:static}
 .hero-orbit{grid-column:1 / -1;grid-row:3;width:60%;margin:35px 6% 30px auto;right:auto;top:auto;position:relative}
 .hero .sticker-arc{grid-column:1;grid-row:3;align-self:end}
 .hero-facts{grid-column:1 / -1;grid-row:4;position:static;gap:15px}
 .hero-facts span{flex:1;max-width:none;font-size:.75rem}
 .hero-facts b{display:block;font-size:1.25rem;margin:0}
 .hero-subtitle{font-size:1.35rem;line-height:1.5}
 .hero-actions .button{width:100%;font-size:.8rem;padding:15px 12px;letter-spacing:.02em}
 .access-note{font-size:.75rem;letter-spacing:.03em}
 .orbit-label{font-size:.65rem;letter-spacing:.08em;padding:8px 10px;width:100%;max-width:100%;top:-15px}
 .registration-banner,.location,.manifesto-copy,.experience-grid,.choice-grid,.arrival-info,.quick-facts,.info-grid,.event-form{grid-template-columns:minmax(0,1fr)}
 .subhero{display:flex;flex-direction:column-reverse;padding:110px 20px 50px;min-height:auto}
 h1,h2,.subhero h1,.final-cta h2,.faq-final h2{font-size:clamp(2.25rem,10cqw,3.75rem);line-height:1.05}
 .manifesto,.impact,.experiences,.schedule,.gallery,.location,.social,.choice-section,.forms-section,.faq-content,.map-section,.map-final,.final-cta,.faq-final{padding:65px 20px}
 .coming-soon>strong{font-size:clamp(2.25rem,10cqw,3.5rem)}
 .coming-soon{padding:22px}
 .memory-card{flex:0 0 86%;min-width:0}
 .memory-card strong{font-size:1.8rem}
 .edition{grid-template-columns:48px minmax(0,1fr) 58px;gap:10px}
 .edition h3{font-size:clamp(1.4rem,6cqw,2rem)}
 .form-result h3{font-size:clamp(2rem,9cqw,3.5rem)}
 .sticker-rail{gap:20px}
 .sticker-rail img{width:60px;height:60px}
}
@media(max-width:360px){
 .brand-link{flex-basis:155px}
 .site-nav{padding-left:12px;gap:8px}
 .hero .sticker{width:60px}
 .gallery-toolbar{align-items:flex-start}
 .gallery-toolbar p{max-width:55%}
 .gallery-toolbar button{width:44px;height:44px}
}

/* 12. NAVEGAÇÃO — nomes brancos e página atual destacada */
.nav-links .nav-link{color:#fff}
.nav-links .nav-link.active,.nav-links .nav-link[aria-current="page"]{color:#fff;background:var(--purple);box-shadow:inset 0 -3px 0 var(--yellow)}
.nav-links .nav-cta{color:#fff;background:var(--pink)}
.nav-links .nav-cta.active,.nav-links .nav-cta[aria-current="page"]{background:var(--purple);box-shadow:inset 0 -3px 0 var(--yellow)}
@media(hover:hover){.nav-links .nav-link:hover{color:#fff;background:#390099cc}}
