:root{
  --sand:#F2EEE6; --sand-2:#E8E2D6; --paper:#FFFFFF; --ink:#0D0D0D;
  --muted:#6B675F; --faint:#8C877D; --unlit:#CFC9BD; --line:#DED8CC;
  --accent:#FF5A1F; --accent-ink:#FFFFFF;
  --card:var(--paper);
  --glass:rgba(242,238,230,.78);
  --radius:24px; --radius-lg:32px;
  --pad:clamp(20px,4vw,56px);
  --maxw:1440px;
  --f-display:"Inter Tight","SF Pro Display",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --f-text:"Inter",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --ease:cubic-bezier(.2,.7,.1,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{margin:0; background:var(--sand); color:var(--ink); font:400 17px/1.55 var(--f-text); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden}
img{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:10px}
.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad)}
.on-dark{color:#fff}
.bg-sand{background:var(--sand); --card:var(--paper)}
.bg-paper{background:var(--paper); --card:var(--sand)}

/* Tipografia */
.label{font:500 12px/1.3 var(--f-mono); letter-spacing:.08em; text-transform:uppercase; margin:0}
.label::before{content:"[ "} .label::after{content:" ]"}
.display{font:600 clamp(56px,11.5vw,184px)/.9 var(--f-display); letter-spacing:-.05em; margin:0; display:block}
.h2{font:600 clamp(40px,6.2vw,96px)/.95 var(--f-display); letter-spacing:-.04em; margin:0; text-wrap:balance}
.h2-md{font-size:clamp(36px,4.6vw,72px)}
.h3{font:600 clamp(24px,2.2vw,32px)/1.08 var(--f-display); letter-spacing:-.025em; margin:0}
.lead{font-size:clamp(17px,1.35vw,20px); line-height:1.5; color:var(--muted); margin:0; max-width:36ch}
.on-dark .lead{color:rgba(255,255,255,.72)}
.muted{color:var(--muted)}
@media (max-width:640px){.hide-sm{display:none}}

/* Botões */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; height:52px; padding:0 24px; border-radius:999px; font:500 15px/1 var(--f-text); letter-spacing:-.005em; white-space:nowrap; transition:transform .35s var(--ease), background-color .3s, color .3s, box-shadow .3s}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--accent); color:var(--accent-ink)}
.btn-ghost{box-shadow:inset 0 0 0 1px currentColor}
.btn-ghost:hover{background:var(--ink); color:#fff; box-shadow:inset 0 0 0 1px var(--ink)}
.on-dark .btn-ghost:hover{background:#fff; color:var(--ink); box-shadow:inset 0 0 0 1px #fff}
.btn-glass{background:rgba(255,255,255,.16); color:#fff; -webkit-backdrop-filter:blur(16px) saturate(160%); backdrop-filter:blur(16px) saturate(160%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}
.btn-glass:hover{background:rgba(255,255,255,.28)}
.btn-sm{height:40px; padding:0 18px; font-size:14px}
.btn-block{width:100%; height:56px; font-size:16px}
.arrow{flex:none; transition:transform .35s var(--ease)}
.btn:hover .arrow{transform:translateX(3px)}
.round{display:inline-grid; place-items:center; width:48px; height:48px; border-radius:999px; box-shadow:inset 0 0 0 1px var(--line); background:var(--paper); transition:background-color .25s, opacity .25s}
.round:hover{background:var(--sand-2)}
.round:disabled{opacity:.35; cursor:default}

/* Etiquetas de vidro */
.chip{position:absolute; z-index:2; top:18px; left:18px; padding:9px 14px; border-radius:999px; background:rgba(16,16,16,.34); color:#fff; -webkit-backdrop-filter:blur(14px) saturate(160%); backdrop-filter:blur(14px) saturate(160%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.22); font:500 11px/1 var(--f-mono); letter-spacing:.1em; text-transform:uppercase}

/* Revelar ao rolar */
.js [data-reveal]{opacity:0; transform:translateY(28px); transition:opacity 1s var(--ease), transform 1s var(--ease); transition-delay:calc(var(--d,0) * 90ms)}
.js [data-reveal].in{opacity:1; transform:none}

/* Header */
.header{position:fixed; inset:0 0 auto; z-index:50; transition:background-color .4s, box-shadow .4s}
.header.is-scrolled{background:var(--glass); -webkit-backdrop-filter:saturate(180%) blur(20px); backdrop-filter:saturate(180%) blur(20px); box-shadow:0 1px 0 rgba(0,0,0,.06)}
.bar{height:72px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px}
.logo{display:flex; align-items:center; gap:12px; justify-self:start}
.logo img{height:44px; width:auto}
.logo span{font:600 17px/1 var(--f-display); letter-spacing:-.02em}
.nav{display:flex; align-items:center; gap:30px; font:500 14px/1 var(--f-text)}
.nav > a, .nav-more-btn{opacity:.7; transition:opacity .2s}
.nav > a:hover, .nav-more-btn:hover, .nav-more-btn[aria-expanded="true"]{opacity:1}
.nav-more{position:relative}
.nav-more-btn{display:inline-flex; align-items:center; gap:6px; font:inherit; height:40px}
.nav-more-btn svg{transition:transform .3s var(--ease)}
.nav-more-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav-menu{position:absolute; top:calc(100% + 14px); left:50%; width:300px; margin-left:-150px; padding:8px; border-radius:20px; background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%); box-shadow:0 24px 60px rgba(0,0,0,.14), inset 0 0 0 1px rgba(0,0,0,.05); display:flex; flex-direction:column; animation:menuIn .28s var(--ease)}
.nav-menu[hidden]{display:none}
.nav-menu::before{content:""; position:absolute; left:0; right:0; top:-16px; height:16px}
.nav-menu a{display:flex; flex-direction:column; gap:3px; padding:12px 14px; border-radius:14px; transition:background-color .2s}
.nav-menu a:hover, .nav-menu a:focus-visible{background:var(--sand)}
.nav-menu strong{font:600 15px/1.2 var(--f-display); letter-spacing:-.01em}
.nav-menu span{font-size:13px; line-height:1.35; color:var(--muted)}
@keyframes menuIn{from{opacity:0; transform:translateY(-6px)}}
.actions{justify-self:end; display:flex; align-items:center; gap:8px}
.menu-btn{display:none; width:44px; height:44px; border-radius:999px; place-items:center}
.menu-btn i, .menu-btn i::before{display:block; width:18px; height:1.5px; background:currentColor; position:relative}
.menu-btn i::before{content:""; position:absolute; top:6px}
.menu-btn i{transform:translateY(-3px)}
@media (max-width:960px){
  .bar{grid-template-columns:1fr auto}
  .nav{display:none}
  .menu-btn{display:grid}
  .logo span{display:none}
  .actions .btn{height:40px; padding:0 16px; font-size:14px}
}
.sheet{position:fixed; inset:0; z-index:70; background:var(--sand); padding:88px var(--pad) 40px; display:flex; flex-direction:column; overflow-y:auto; overscroll-behavior:contain; transform:translateY(-102%); visibility:hidden; transition:transform .55s var(--ease), visibility 0s .55s}
.sheet.open{transform:none; visibility:visible; transition:transform .55s var(--ease)}
.sheet a.big{font:600 44px/1.1 var(--f-display); letter-spacing:-.035em; padding:12px 0; border-bottom:1px solid var(--line)}
.sheet .btn{margin-top:32px}
.sheet-label{margin:28px 0 4px; color:var(--muted)}
.sheet-sub{display:flex; flex-direction:column}
.sheet-sub a{font:500 22px/1.2 var(--f-display); letter-spacing:-.02em; padding:13px 0; border-bottom:1px solid var(--line)}
.sheet-close{position:absolute; top:14px; right:var(--pad); width:44px; height:44px; border-radius:999px; font-size:28px; line-height:1}

/* Hero */
.hero{padding-top:clamp(112px,13vw,164px)}
.hero-top{display:flex; flex-direction:column; gap:clamp(32px,3.4vw,48px); padding-bottom:clamp(36px,4.4vw,64px)}
.hero-title{margin:0; display:flex; flex-direction:column; gap:clamp(18px,2vw,28px)}
/* Cada palavra sobe dentro de uma janela que recorta. A folga deixa passar acentos, a perna do g e do ç e a ponta da última letra */
.display .w{display:inline-block; overflow:hidden; vertical-align:top; padding:.2em .08em; margin:-.2em -.08em}
.display .w > span{display:inline-block}
.js .display .w > span{transform:translateY(calc(100% + .4em)); animation:rise 1s var(--ease) forwards; animation-delay:calc(var(--i) * 85ms + 120ms)}
@keyframes rise{to{transform:none}}
.hero-row{display:flex; align-items:flex-end; justify-content:space-between; gap:24px 48px; flex-wrap:wrap}
.hero-row .lead{max-width:30ch; text-wrap:balance}
.js .hero-row{opacity:0; animation:fadeUp 1s var(--ease) .5s forwards}
@keyframes fadeUp{from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none}}
.cta-row{display:flex; flex-wrap:wrap; gap:10px}
.hero-media{padding-inline:var(--inset,var(--pad))}
.hero-frame{position:relative; height:min(84vh,900px); min-height:420px; border-radius:var(--r,32px); overflow:hidden; background:#cfc8bb; max-width:calc(var(--maxw) - 2 * 56px + 2 * (56px - var(--inset,56px))); margin-inline:auto}
.hero-frame img{width:100%; height:100%; object-fit:cover; object-position:50% 62%; transform:scale(var(--zoom,1.08)); transform-origin:50% 60%}
.hero-frame::after{content:""; position:absolute; inset:auto 0 0; height:40%; background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.35)); pointer-events:none}
.next-card{position:absolute; z-index:2; left:20px; bottom:20px; display:flex; align-items:center; gap:14px; padding:14px 20px 14px 16px; border-radius:20px; background:rgba(16,16,16,.34); -webkit-backdrop-filter:blur(18px) saturate(160%); backdrop-filter:blur(18px) saturate(160%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); transition:background-color .3s}
.next-card:hover{background:rgba(16,16,16,.5)}
.next-card small{display:block; font:500 11px/1 var(--f-mono); letter-spacing:.1em; text-transform:uppercase; opacity:.78; margin-bottom:6px}
.next-card strong{display:block; font:600 20px/1.1 var(--f-display); letter-spacing:-.015em}
.dot{flex:none; width:10px; height:10px; border-radius:50%; background:var(--accent)}
@media (max-width:640px){
  .hero-frame{height:72vh; min-height:380px}
  .hero-frame img{object-position:46% 70%}
  .cta-row{width:100%}
  .cta-row .btn{flex:1 1 100%}
}

/* Seções */
.section{padding-block:clamp(96px,12vw,176px)}
.section-sm{padding-block:clamp(64px,8vw,112px)}
.sec-head{display:flex; flex-direction:column; gap:20px; margin-bottom:clamp(40px,6vw,88px)}
.sec-head.row{flex-direction:row; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap}
.sec-head.row > div{display:flex; flex-direction:column; gap:20px}

/* Manifesto */
.manifesto-text{font:500 clamp(30px,4.3vw,66px)/1.1 var(--f-display); letter-spacing:-.035em; margin:28px 0 0; max-width:1180px}
.js .manifesto-text .mw{color:var(--unlit); transition:color .4s}
.js .manifesto-text .mw.on{color:var(--ink)}
.stats{display:grid; grid-template-columns:repeat(var(--cols,3),1fr); gap:0 32px; margin-top:clamp(72px,9vw,128px)}
.stat{border-top:1px solid var(--ink); padding-top:20px; display:flex; flex-direction:column; gap:8px}
.stat strong{font:600 clamp(48px,5.6vw,88px)/1 var(--f-display); letter-spacing:-.045em}
.stat span{color:var(--muted); font-size:15px}
@media (max-width:760px){.stats{grid-template-columns:1fr 1fr; gap:36px 20px} .stat:last-child:nth-child(odd){grid-column:1/-1}}

/* Aulas */
.aulas-grid{display:grid; grid-template-columns:1.1fr .9fr; grid-template-rows:auto 1fr; grid-template-areas:"head media" "list media"; column-gap:clamp(32px,6vw,96px)}
.aulas-head{grid-area:head; margin-bottom:48px}
.aulas-list{grid-area:list; align-self:end}
.levels{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.level{width:100%; display:flex; align-items:flex-start; gap:20px; padding:24px 0; border-bottom:1px solid var(--line); text-align:left; color:var(--faint); transition:color .35s}
.level .num{font:500 12px/1 var(--f-mono); letter-spacing:.08em; padding-top:.6em}
.level .name{font:600 clamp(36px,4.6vw,72px)/1 var(--f-display); letter-spacing:-.04em}
.level.is-active, .level:hover{color:var(--ink)}
.level .go{margin-left:auto; align-self:center; opacity:0; transform:translateX(-8px); transition:opacity .35s, transform .35s var(--ease)}
.level.is-active .go{opacity:1; transform:none}
.levels-media{grid-area:media; position:relative; aspect-ratio:4/5; border-radius:var(--radius); overflow:hidden; background:#d9d2c5}
.lm{position:absolute; inset:0; margin:0; opacity:0; transform:scale(1.05); transition:opacity .7s var(--ease), transform 1.4s var(--ease)}
.lm.is-active{opacity:1; transform:none}
.lm img{width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.08)}
.lm-caption{position:absolute; z-index:2; left:16px; right:16px; bottom:16px; padding:18px 20px; border-radius:18px; background:rgba(255,255,255,.76); -webkit-backdrop-filter:blur(18px) saturate(160%); backdrop-filter:blur(18px) saturate(160%)}
.lm-caption p{margin:8px 0 0; font-size:16px; line-height:1.45}
@media (max-width:960px){
  .aulas-grid{grid-template-columns:1fr; grid-template-areas:"head" "media" "list"; row-gap:24px}
  .aulas-head{margin-bottom:0}
  .levels-media{aspect-ratio:4/4.6}
  .level{padding:18px 0}
}

/* Quadras */
.car-ctrl{display:flex; gap:8px}
@media (max-width:760px), (hover:none) and (pointer:coarse){.sec-head.row > .car-ctrl{display:none}}
.carousel{display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:var(--pad); padding-inline:var(--pad); padding-bottom:4px; scrollbar-width:none; overscroll-behavior-x:contain}
.carousel::-webkit-scrollbar{display:none}
.car-spacer{flex:0 0 max(1px,calc(var(--pad) - 16px))}
@media (min-width:1552px){.carousel{padding-inline:calc((100vw - var(--maxw)) / 2 + var(--pad)); scroll-padding-inline:calc((100vw - var(--maxw)) / 2 + var(--pad))}}
.court{position:relative; flex:0 0 clamp(280px,30vw,440px); aspect-ratio:3/4; border-radius:var(--radius); overflow:hidden; scroll-snap-align:start; background:#cfc8bb; color:#fff; margin:0}
.court img{width:100%; height:100%; object-fit:cover; filter:saturate(.88) contrast(1.05); transition:transform 1.4s var(--ease)}
.court:hover img{transform:scale(1.045)}
.court::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 45%,rgba(0,0,0,.66) 100%); pointer-events:none}
.court-info{position:absolute; z-index:2; left:20px; right:20px; bottom:20px}
.court-info h3{font:600 32px/1 var(--f-display); letter-spacing:-.035em; margin:0}
.court-info p{margin:8px 0 16px; font-size:15px; opacity:.86}

/* Horários */
.tabs{display:inline-flex; gap:4px; padding:4px; border-radius:999px; background:var(--card); margin-bottom:24px; max-width:100%; overflow-x:auto; scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{height:44px; padding:0 20px; border-radius:999px; font:500 15px/1 var(--f-text); color:var(--muted); white-space:nowrap; transition:background-color .25s, color .25s}
.tabs button[aria-selected="true"]{background:var(--ink); color:#fff}
.slots{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px}
.slot{position:relative; background:var(--card); border-radius:22px; padding:22px; min-height:172px; display:flex; flex-direction:column; gap:10px; animation:slotIn .5s var(--ease) both; animation-delay:calc(var(--i) * 45ms)}
@keyframes slotIn{from{opacity:0; transform:translateY(10px)}}
.slot strong{font:600 clamp(44px,4.2vw,60px)/1 var(--f-display); letter-spacing:-.045em; margin-top:auto}
.slot-top{display:flex; align-items:center; justify-content:space-between; gap:8px}
.slot-wide{grid-column:1/-1; min-height:0; flex-direction:row; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; padding:32px}
.slot-wide p{margin:0; max-width:52ch; font-size:18px}

/* Planos */
.planos-grid{display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(32px,5vw,80px); align-items:stretch}
.planos-intro{display:flex; flex-direction:column; gap:22px}
.exp-card{margin-top:auto; background:var(--ink); border-radius:var(--radius-lg); padding:clamp(24px,3vw,40px); display:flex; flex-direction:column; gap:14px; align-items:flex-start}
.exp-card p:not(.label){margin:0 0 10px; color:rgba(255,255,255,.72); max-width:40ch}
.config{background:var(--card); border-radius:var(--radius-lg); padding:clamp(24px,3.2vw,44px); display:flex; flex-direction:column; gap:20px}
.cfg-row{display:flex; align-items:center; justify-content:space-between; gap:12px 16px; flex-wrap:wrap}
.cfg-label{font-size:15px; color:var(--muted)}
.seg{display:inline-flex; padding:4px; border-radius:999px; background:var(--sand)}
.seg button{height:40px; min-width:56px; padding:0 16px; border-radius:999px; font:500 15px/1 var(--f-text); color:var(--muted); transition:background-color .25s, color .25s}
.seg button[aria-pressed="true"]{background:var(--ink); color:#fff}
.price{border-top:1px solid var(--line); padding-top:26px; margin-top:6px; flex:1}
.price-num{display:flex; align-items:flex-start; gap:8px; font-family:var(--f-display); line-height:.9; margin:18px 0 14px}
.price-num .cur{font-size:28px; font-weight:600; letter-spacing:-.02em; margin-top:.35em}
#priceVal{font-size:clamp(96px,10.5vw,168px); font-weight:600; letter-spacing:-.055em; display:inline-block}
#priceVal.bump{animation:bump .45s var(--ease)}
@keyframes bump{from{opacity:.2; transform:translateY(14px)}}
.price-num .per{align-self:flex-end; font-size:20px; color:var(--muted); letter-spacing:-.01em; margin-bottom:.7em}
.price-note{margin:0; color:var(--muted); font-size:15px}
.plan-name{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:16px}
.rec{display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 12px; border-radius:999px; background:var(--accent); color:var(--accent-ink); font:500 11px/1 var(--f-mono); letter-spacing:.08em; text-transform:uppercase}
.rec[hidden]{display:none}
.seg button{position:relative}
.rec-dot{position:absolute; top:7px; right:9px; width:6px; height:6px; border-radius:50%; background:var(--accent)}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.credits{grid-column:1/-1; margin-top:clamp(24px,4vw,56px)}
.credits-head{display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:20px}
.credit-grid{display:grid; grid-template-columns:repeat(var(--cols,4),1fr); gap:12px}
.credit-price{display:inline-flex; align-items:flex-start; gap:4px; font:600 32px/1 var(--f-display); letter-spacing:-.03em; color:var(--ink)}
.credit-price i{font-style:normal; font-size:15px; margin-top:3px; color:var(--muted)}
.credit-price small{align-self:flex-end; margin:0 0 3px 2px; font:500 14px/1 var(--f-text); letter-spacing:0; color:var(--muted)}
.credit{background:var(--card); border-radius:var(--radius); padding:26px; display:flex; flex-direction:column; gap:10px; min-height:230px}
.credit h4{font:600 28px/1.05 var(--f-display); letter-spacing:-.03em; margin:4px 0 0}
.credit p{margin:0; color:var(--muted); font-size:15px}
.credit .row{margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:14px; border-top:1px solid var(--line); font-size:15px}
.credit a{font-weight:500; display:inline-flex; align-items:center; gap:8px}
@media (max-width:960px){.planos-grid{grid-template-columns:1fr} .credit-grid{grid-template-columns:1fr 1fr}}

/* Como começar */
.steps{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(var(--cols,3),1fr); background:var(--card); border-radius:var(--radius-lg)}
.step{display:flex; flex-direction:column; gap:10px; padding:clamp(24px,2.8vw,36px); border-left:1px solid var(--line)}
.step:first-child{border-left:0}
.step .label{color:var(--muted)}
.step h3{margin:4px 0 0; font:600 clamp(22px,1.9vw,28px)/1.1 var(--f-display); letter-spacing:-.02em}
.step > p:not(.label){margin:0; color:var(--muted); font-size:15px; max-width:34ch}
.step .btn, .step .stores{margin-top:auto; align-self:flex-start}
.step .btn{margin-top:auto}
.stores{display:flex; flex-wrap:wrap; gap:8px; padding-top:6px}

/* Comunidade */
.com{position:relative; min-height:max(560px,100vh); display:flex; align-items:flex-end; overflow:hidden; background:#1a1a19}
.com-media{position:absolute; inset:-8% 0; will-change:transform}
.com-media img{width:100%; height:100%; object-fit:cover; object-position:50% 40%; filter:saturate(.9) contrast(1.04)}
.com::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.05) 30%,rgba(0,0,0,.7) 100%)}
.com-content{position:relative; z-index:2; width:100%; padding-block:clamp(56px,8vw,120px); display:flex; flex-direction:column; gap:20px}
.com-grid{display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px}
.quote{margin:0; background:var(--card); border-radius:var(--radius-lg); padding:clamp(24px,2.6vw,36px); display:flex; flex-direction:column; gap:28px; justify-content:space-between; min-height:300px}
.quote blockquote{margin:0; font:500 clamp(22px,1.9vw,28px)/1.25 var(--f-display); letter-spacing:-.02em}
.quote figcaption{display:flex; align-items:center; gap:14px; font-size:15px}
.quote figcaption small{display:block; color:var(--muted); font-size:14px}
.avatar{flex:none; width:44px; height:44px; border-radius:50%; background:linear-gradient(160deg,#E2DBCE,#C9C1B2)}
.ig-card{position:relative; overflow:hidden; display:grid; grid-template-columns:1fr auto; align-items:center; gap:36px 64px; background:var(--ink); border-radius:var(--radius-lg); padding:clamp(28px,4.4vw,64px)}
.ig-card::before{content:""; position:absolute; width:560px; height:560px; left:-180px; bottom:-320px; background:radial-gradient(closest-side, rgba(255,90,31,.34), rgba(255,90,31,0)); pointer-events:none}
.ig-copy{position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:14px}
.ig-copy .label{color:rgba(255,255,255,.6)}
.ig-handle{margin:2px 0 0; font:600 clamp(40px,5.4vw,80px)/1 var(--f-display); letter-spacing:-.045em}
.ig-copy p:not(.label){margin:0; color:rgba(255,255,255,.72); max-width:36ch}
.ig-copy .btn{margin-top:12px}
.ig-card:hover .btn .arrow, .ig-card:hover .btn{transform:translateY(-1px)}
.ig-grid{position:relative; display:grid; grid-template-columns:repeat(2, clamp(120px,13vw,188px)); gap:12px; padding-bottom:28px}
.ig-grid img{width:100%; aspect-ratio:1; object-fit:cover; border-radius:18px; filter:saturate(.9) contrast(1.05); transform:translateY(var(--y,0)) scale(var(--s,1)); transition:transform .9s var(--ease)}
.ig-grid img:nth-child(even){--y:28px}
.ig-card:hover .ig-grid img{--s:1.03}
@media (max-width:760px){.ig-card{grid-template-columns:1fr} .ig-grid{grid-template-columns:repeat(4,1fr); gap:8px; padding-bottom:0} .ig-grid img{border-radius:12px} .ig-grid img:nth-child(even){--y:0}}
@media (max-width:960px){.com-grid{grid-template-columns:1fr}}

/* Parceiros */
.logos{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); gap:10px}
.logos a, .logos .logo-tile{display:grid; place-items:center; aspect-ratio:4/3; background:var(--card); border-radius:18px; padding:14px 12px}
.logos img{max-height:48px; max-width:100%; width:auto; object-fit:contain; filter:grayscale(1) contrast(1.1); mix-blend-mode:multiply; opacity:.82; transition:opacity .3s, filter .3s}
.logos a:hover img{opacity:1; filter:none}
@media (max-width:640px){.logos{grid-template-columns:repeat(3,1fr)}}

/* FAQ */
.faq-grid{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,6vw,96px); align-items:start}
.faq-grid .sec-head{position:sticky; top:112px; margin:0}
.qa details{border-bottom:1px solid var(--line)}
.qa details:first-child{border-top:1px solid var(--line)}
.qa summary{list-style:none; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 0; cursor:pointer; font:500 clamp(20px,1.9vw,26px)/1.2 var(--f-display); letter-spacing:-.02em}
.qa summary::-webkit-details-marker{display:none}
.plus{flex:none; position:relative; width:36px; height:36px; border-radius:50%; box-shadow:inset 0 0 0 1px var(--line); transition:transform .4s var(--ease), background-color .3s}
.plus::before, .plus::after{content:""; position:absolute; left:50%; top:50%; width:12px; height:1.5px; background:currentColor; transform:translate(-50%,-50%)}
.plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.qa details[open] .plus{transform:rotate(45deg); background:var(--ink); color:#fff; box-shadow:none}
.qa details p{margin:0 0 28px; max-width:60ch; color:var(--muted); animation:fade .5s var(--ease)}
@keyframes fade{from{opacity:0; transform:translateY(-6px)}}
@media (max-width:960px){.faq-grid{grid-template-columns:1fr} .faq-grid .sec-head{position:static}}

/* CTA final e rodapé */
.final{background:var(--ink); padding-block:clamp(80px,9vw,128px) clamp(56px,6vw,88px)}
.final-row{display:flex; align-items:flex-end; justify-content:space-between; gap:28px 48px; flex-wrap:wrap}
.final-copy{display:flex; flex-direction:column; gap:16px; max-width:640px}
.final-title{font:600 clamp(28px,3.2vw,48px)/1.08 var(--f-display); letter-spacing:-.03em; margin:0; text-wrap:balance}
.footer{background:var(--ink); padding-bottom:28px}
.foot-grid{display:grid; grid-template-columns:1.4fr repeat(var(--cols,3),1fr); gap:32px; padding-block:48px; border-top:1px solid #262624}
.foot-grid ul{list-style:none; margin:16px 0 0; padding:0; display:flex; flex-direction:column; gap:10px; font-size:15px}
.foot-grid ul a{opacity:.72; transition:opacity .2s}
.foot-grid ul a:hover{opacity:1}
.foot-grid .label{color:rgba(255,255,255,.5)}
.foot-brand img{height:64px; width:auto; filter:invert(1)}
.foot-brand p{margin:16px 0 0; color:rgba(255,255,255,.6); font-size:15px; max-width:30ch}
.foot-bottom{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:20px; border-top:1px solid #262624; font:500 11px/1.4 var(--f-mono); letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.45)}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr} .foot-brand{grid-column:1/-1}}

/* Barra fixa no celular */
.mbar{position:fixed; z-index:40; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); display:none; gap:8px; padding:6px; border-radius:999px; background:var(--glass); -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%); box-shadow:0 10px 30px rgba(0,0,0,.14), inset 0 0 0 1px rgba(0,0,0,.05); transform:translateY(150%); transition:transform .5s var(--ease)}
.mbar.show{transform:none}
.mbar .btn{flex:1; height:48px}
.mbar .round{width:48px; height:48px; background:var(--ink); color:#fff; box-shadow:none}
@media (max-width:760px){.mbar{display:flex}}

/* Ajustes finos no celular */
@media (max-width:640px){
  .tabs{display:flex; width:100%}
  .tabs button{flex:1 1 auto; padding:0 10px; font-size:14px}
  .slots{grid-template-columns:1fr 1fr; gap:10px}
  .slot{min-height:132px; padding:18px 16px}
  .slot strong{font-size:40px}
  .slot-wide{grid-column:1/-1; padding:24px}
  .lm-caption{left:12px; right:12px; bottom:12px; padding:14px 16px}
  .lm-caption p{font-size:15px}
  .exp-card{margin-top:8px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important}
  .js [data-reveal]{opacity:1; transform:none}
  .js .display .w > span{transform:none}
}

/* Painel: horários em abas geradas no servidor */
.slots[hidden]{display:none}
.hero-row > span:empty{display:none}

/* Prévia do painel: tudo visível na hora, sem animação de entrada */
html.previa [data-reveal]{opacity:1 !important; transform:none !important; transition:none !important}
html.previa .display .w > span{transform:none !important; animation:none !important}
html.previa .hero-row{opacity:1 !important; animation:none !important}
html.previa .manifesto-text .mw{color:inherit !important}


/* Celular: topo centralizado e fileiras que se arrastam para o lado */
@media (max-width:760px){
  .hero-top{align-items:center; text-align:center}
  .hero-title{align-items:center}
  .hero-row{flex-direction:column; align-items:center; text-align:center}
  .hero-row .lead{margin-inline:auto}
  .cta-row{justify-content:center}

  /* A largura total dos cards não pode alargar a página: só a fileira rola */
  .credits{min-width:0}
  .credit-grid,
  .steps{display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scrollbar-width:none;
    contain:inline-size; margin-inline:calc(-1 * var(--pad)); padding:2px 0 8px var(--pad); scroll-padding-inline:var(--pad)}
  .credit-grid::-webkit-scrollbar,
  .steps::-webkit-scrollbar{display:none}
  .credit-grid::after,
  .steps::after{content:""; flex:0 0 max(1px, calc(var(--pad) - 12px))}
  .credit{flex:0 0 min(78%, 300px); scroll-snap-align:start; min-height:0}
  .steps{background:none; border-radius:0}
  .step{flex:0 0 min(80%, 320px); scroll-snap-align:start; border:0; background:var(--card); border-radius:var(--radius-lg)}
}

/* Celular estreito: os seletores do plano ocupam a linha toda, em partes iguais */
@media (max-width:480px){
  .cfg-row .seg{display:flex; width:100%}
  .cfg-row .seg button{flex:1 1 0; min-width:0; padding:0 8px}
}
