/* Fontes alojadas no site (Bebas Neue e Sora, licença OFL), em vez do Google Fonts: o IP de quem visita não sai para a Google */
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/bebas-neue-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/bebas-neue-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Sora';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/sora-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Sora';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/sora-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  --bg:#13111A; --bg2:#1B1824; --ink:#F2EFF8; --mute:#9C96AE; --line:rgba(242,239,248,.12);
  --lil:#C4B8E8; --vio:#5B3EBF; --paper:#F3F1F7; --paper-ink:#13111A;
  --hh:#93ACFB; --fem:#E8A0B4; --house:#5EC8C2; --pop:#B09ED8; --brk:#F0A060; --comp:#8A8499; --lab:#C4B8E8;
  --ease:cubic-bezier(.16,1,.3,1);
  --gut:clamp(16px,4vw,56px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
main{overflow-x:clip} /* a faixa lilás rodada não cria scroll lateral; clip não estraga o sticky */
body{background:var(--bg);color:var(--ink);font-family:'Sora',system-ui,sans-serif;font-size:15px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.bb{font-family:'Bebas Neue',Impact,sans-serif;font-weight:400;letter-spacing:.01em;line-height:.88}
.lbl{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--lil)}
.btn{display:inline-flex;align-items:center;gap:.6em;padding:15px 26px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;transition:transform .4s var(--ease),background .3s,color .3s}
.btn:hover{transform:translateY(-2px)}
.btn-lil{background:var(--lil);color:var(--bg)}
.btn-lil:hover{background:#fff}
.btn-ghost{border:1px solid rgba(255,255,255,.4);color:#fff;backdrop-filter:blur(8px)}
.btn-ghost:hover{background:#fff;color:var(--bg)}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:200;background:#fff;color:#000;padding:8px 12px}

/* ===== HEADER ===== */
.hd{position:fixed;inset:0 0 auto 0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px calc(var(--gut) + 170px) 28px var(--gut);mix-blend-mode:difference;color:#fff;pointer-events:none}
.hd>*{pointer-events:auto}
.logo svg{display:block;height:44px;width:auto} /* barra do topo mais alta e logótipo maior (pedido do João, 20 out 2026; +20% a 20 out) */
@media(max-width:600px){.logo svg{height:36px}}
@media(max-width:400px){.logo svg{height:30px}}
@media(max-width:350px){.logo svg{height:24px}a.cta-fix{padding:7px 9px;letter-spacing:.06em}} /* ecrãs estreitos: o botão "Aula grátis" não toca no logótipo */
.logo .cls-1{fill:#fff}
.nav{display:flex;gap:28px;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.nav a{position:relative;padding:4px 0}
.nav a::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.cta-fix{position:fixed;right:var(--gut);top:26px;z-index:101;padding:11px 20px;font-size:12px}
.burger{display:none;width:44px;height:44px;position:relative}
.burger i{position:absolute;left:10px;right:10px;height:1.5px;background:#fff;transition:transform .4s var(--ease),top .4s var(--ease)}
.burger i:nth-child(1){top:17px}.burger i:nth-child(2){top:26px}
.menu-open .burger i:nth-child(1){top:21px;transform:rotate(45deg)}
.menu-open .burger i:nth-child(2){top:21px;transform:rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:99;background:var(--bg);display:flex;flex-direction:column;justify-content:flex-end;padding:100px var(--gut) 40px;clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease)}
.menu-open .mnav{clip-path:inset(0 0 0 0)}
.mnav a.bb{font-size:clamp(3rem,14vw,5rem);display:block;border-bottom:1px solid var(--line);padding:6px 0 2px}
.mnav a.bb:hover{color:var(--lil)}
.mnav .meta{margin-top:28px;color:var(--mute);font-size:13px}
.mnav .meta a{display:inline-block;padding:6px 0;color:var(--ink);text-decoration:underline;text-decoration-color:var(--mute);text-underline-offset:4px}.mnav .meta a:hover{color:var(--lil)}
@media(max-width:1320px){.nav{gap:20px;font-size:11px}}
@media(max-width:1200px){.hd{padding-right:var(--gut)}.nav{display:none}.burger{display:block}.cta-fix{right:calc(var(--gut) + 54px);top:30px}} /* 1200 e não 1160: com o logótipo de 44 px o menu completo já não cabe ao lado do botão (QA 20 out 2026) */
@media(max-width:600px){.cta-fix{padding:8px 14px;font-size:10.5px;letter-spacing:.12em;top:34px}} /* telemóvel: logótipo maior, botão mais pequeno (pedido do João, 20 out 2026) */
@media(max-width:420px){.cta-fix{padding:7px 11px;font-size:10px;letter-spacing:.1em;top:35px;right:calc(var(--gut) + 48px)}}
@media(max-width:380px){.cta-fix .seta{display:none}} /* ecrãs estreitos: sem a seta, o botão não toca no logótipo */

/* ===== HERO ===== */
.hero{position:relative;height:150vh}
.hero .bg{position:sticky;top:0;height:100vh;overflow:hidden}
.hero .bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;will-change:transform}
.hero .bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,var(--bg) 0%,rgba(19,17,26,.55) 30%,rgba(19,17,26,0) 60%),linear-gradient(to right,rgba(19,17,26,.6),transparent 55%)}
.hero .copy{position:absolute;left:var(--gut);right:var(--gut);bottom:clamp(90px,14vh,150px);z-index:2;will-change:transform,opacity}
.hero h1{font-size:clamp(4.6rem,min(15.5vw,21vh),16rem);text-transform:uppercase}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln>span{display:inline-block;transform:translateY(105%);animation:up 1.2s var(--ease) forwards}
.hero h1 .ln:nth-child(2)>span{animation-delay:.12s}
.hero h1 .ln:nth-child(3)>span{animation-delay:.24s}
.hero h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--lil)}
.hero .row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;margin-top:26px;opacity:0;animation:fade 1s .7s ease forwards}
.hero .row p{max-width:380px;font-size:clamp(15px,1.3vw,18px);color:#D9D4E6}
.hero .row .btns{display:flex;gap:12px;flex-wrap:wrap}
.hero .scrollhint{position:absolute;right:var(--gut);top:50%;z-index:2;writing-mode:vertical-rl;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.6);display:flex;align-items:center;gap:12px}
.hero .scrollhint::after{content:'';width:1px;height:60px;background:linear-gradient(var(--lil),transparent);animation:drip 2s ease-in-out infinite}
@keyframes up{to{transform:none}}
@keyframes fade{to{opacity:1}}
.hero .live{position:absolute;z-index:2;right:var(--gut);top:96px;display:flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#fff;opacity:0;animation:fade 1s .4s forwards}
.hero .live i{width:8px;height:8px;border-radius:50%;background:var(--lil);animation:blink 1.4s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* ecrãs baixos (telemóvel deitado, zoom a 200 %): o banner cabe inteiro, sem o título sair pelo topo */
@media(max-height:700px){.hero .copy{bottom:24px}.hero h1{font-size:clamp(2.6rem,min(12vw,17vh),16rem)}.hero .row{margin-top:12px}.hero .row p,.hero .live,.hero .scrollhint{display:none}.hero .hero-lbl{margin-bottom:8px!important}}
@media(max-width:700px){.hero .copy{text-shadow:0 1px 16px rgba(19,17,26,.7)}.hero .hero-lbl{display:inline-block!important;padding:4px 9px;border-radius:999px;background:rgba(19,17,26,.62);text-shadow:none}.hero .scrollhint{display:none}.hero .bg img{object-position:50% 40%}}

/* ===== MARQUEE ===== */
.mq{position:relative;z-index:3;margin-top:-60px;background:var(--lil);color:var(--bg);overflow:hidden;transform:rotate(-1.5deg) scale(1.03);padding:14px 0}
.mq .tr{display:flex;width:max-content;animation:mq 32s linear infinite}
.mq span{font-family:'Bebas Neue';font-size:clamp(1.6rem,3vw,2.6rem);line-height:1;padding:0 26px;white-space:nowrap;display:flex;align-items:center;gap:52px}
.mq span::after{content:'✦';font-size:.6em}
@keyframes mq{to{transform:translateX(-50%)}}

/* ===== SOBRE ===== */
.sobre{padding:clamp(110px,18vh,200px) var(--gut) clamp(80px,12vh,140px);position:relative}
.sobre .lbl{display:block;margin-bottom:34px}
.stmt{font-size:clamp(2rem,4.6vw,4.4rem);font-weight:600;line-height:1.08;letter-spacing:-.025em;max-width:1300px}
.stmt .w{opacity:.14;transition:opacity .25s linear}
.stmt .w.on{opacity:1}
.stmt .hl{color:var(--lil)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(70px,10vh,120px);border-top:1px solid var(--line)}
.stat{padding:28px 24px 0 0;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat+.stat{padding-left:24px}
.stat b{display:block;font-family:'Bebas Neue';font-weight:400;font-size:clamp(3.6rem,7vw,6.6rem);line-height:.9;color:var(--ink)}
.stat span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.sobre-foto{margin-top:clamp(70px,10vh,120px);aspect-ratio:2/1;border-radius:4px}
.sobre-foto img{width:100%;height:100%;object-fit:cover}
@media(max-width:800px){.sobre-foto{aspect-ratio:4/3}}
.sobre .story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,100px);margin-top:clamp(70px,10vh,120px);color:#CFC9DD;font-size:16px}
.sobre .story p+p{margin-top:1em}
.sobre .story strong{color:var(--ink);font-weight:600}
@media(max-width:800px){.stats{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(3){padding-left:0}.stat{padding-bottom:26px}.sobre .story{grid-template-columns:1fr}}

/* ===== MODALIDADES: carrossel horizontal (scroll-snap) em todos os ecrãs ===== */
/* o scroll vertical da página passa sempre; muda-se de modalidade a deslizar (dedo, trackpad), com as setas ‹ › ou com o teclado */
.hs{position:relative}
.hsS{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;background:var(--bg)}
.hsS::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 70% 50%,rgba(91,62,191,.22),transparent 70%);pointer-events:none}
.track{position:relative;display:flex;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none}
.track::-webkit-scrollbar{display:none}
/* espaço no fim para o último cartão também alinhar à esquerda (contador certo em ecrãs muito largos) */
.track::after{content:'';flex:0 0 auto;width:calc(100% - min(100%,1180px))}
.track:focus-visible{outline:2px solid var(--lil);outline-offset:-6px}
.panel{flex:0 0 auto;width:100%;height:100%;position:relative;display:flex;align-items:center;padding:110px var(--gut) 110px;scroll-snap-align:start}
.panel.intro{width:min(100%,760px);flex-direction:column;align-items:flex-start;justify-content:center}
.panel.intro h2{font-size:clamp(3.2rem,min(11vw,18vh),11rem);text-transform:uppercase} /* limitado também pela altura: nunca desce até às setas */
.panel.intro p{max-width:420px;margin-top:22px;color:#CFC9DD}
.panel.intro .arrow{margin-top:36px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--lil);display:flex;align-items:center;gap:14px}
.panel.intro .arrow::after{content:'';width:80px;height:1px;background:var(--lil);animation:slide 2s var(--ease) infinite}
@keyframes slide{0%{transform:scaleX(0);transform-origin:left}60%{transform:scaleX(1);transform-origin:left}61%{transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
.mod{width:min(100%,1180px);gap:clamp(24px,4vw,64px)}
.mod .ph{position:relative;height:min(74vh,calc(max(100vh,560px) - 236px),720px);aspect-ratio:3/4;overflow:hidden;border-radius:4px;flex:0 0 auto}
.mod .ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.4s var(--ease)}
.mod:hover .ph img{transform:scale(1.02)}
.mod .ph .n{position:absolute;left:16px;top:14px;font-family:'Bebas Neue';font-size:22px;color:#fff;mix-blend-mode:difference}
.mod .tx{max-width:min(420px,100%);min-width:0}
.mod .tag{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--c)}
.mod .tag::before{content:'';width:10px;height:10px;border-radius:50%;background:var(--c)}
.mod h3{font-size:clamp(4rem,9vw,9rem);text-transform:uppercase;margin:16px 0 18px}
.mod p{color:#CFC9DD}
.mod .age{display:inline-block;margin-top:24px;padding:8px 16px;border:1px solid var(--c);border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--c)}
.hsS .prog{position:absolute;left:var(--gut);right:var(--gut);bottom:32px;height:1px;background:var(--line)}
.hsS .prog i{position:absolute;inset:0;background:var(--lil);transform-origin:left;transform:scaleX(0)}
.hsS .cnt{position:absolute;right:var(--gut);bottom:44px;font-family:'Bebas Neue';font-size:20px;color:var(--mute)}
.hs-nav{position:absolute;left:var(--gut);bottom:46px;display:flex;gap:10px;z-index:2}
.hs-btn{width:44px;height:44px;border-radius:999px;background:none;border:1px solid rgba(242,239,248,.3);color:var(--ink);font-size:22px;line-height:1;display:grid;place-items:center;cursor:pointer;transition:border-color .3s,color .3s,opacity .3s}
.hs-btn:hover:not(:disabled){border-color:var(--lil);color:var(--lil)}
.hs-btn:disabled{opacity:.3;cursor:default}
.hs-btn:focus-visible{outline:2px solid var(--lil);outline-offset:2px}
@media(max-width:800px){
  .mod{flex-direction:column;align-items:flex-start;justify-content:center;gap:18px;padding-top:104px}
  .mod .tx{width:100%}
  .mod .ph{height:auto;width:min(62vw,40vh);max-height:46vh}
  .mod h3{font-size:clamp(3.4rem,15vw,5rem);margin:10px 0}
  .mod p{font-size:14px}
  .mod .age{margin-top:14px}
  /* telemóvel: desliza-se com o dedo (sem setas); cartões a 86 % para se ver a ponta do seguinte */
  .hs-nav{display:none}
  .panel{padding-bottom:70px}
  .panel,.panel.intro{width:86%}
  .track::after{width:14%} /* vê-se a ponta do cartão seguinte: há mais para deslizar */
}
@media(max-height:780px){.panel.intro h2{font-size:clamp(3.2rem,min(11vw,15vh),11rem)}.panel.intro p{margin-top:14px}.panel.intro .arrow{display:none}}
/* telemóveis baixos (ex.: 320x640, 375x667): foto e texto mais pequenos para o cartão caber entre o logótipo e o contador */
@media(max-width:800px) and (max-height:720px){.mod{gap:12px;padding-bottom:84px}.mod .ph{max-height:none;width:min(62vw,24vh)}.mod h3{font-size:clamp(2.8rem,12vw,4rem);margin:6px 0}.mod p{font-size:13px;line-height:1.5}.mod .age{margin-top:10px;padding:6px 14px}}
/* tablet na vertical (ex.: iPad 820 px): a foto limita-se pela largura para o nome caber ao lado */
@media(min-width:801px) and (max-width:1100px){.mod .ph{height:auto;width:min(44vw,calc(min(74vh, max(100vh,560px) - 236px) * .75))}}

/* ===== CHAPTERS (pinned bg) ===== */
.ch{position:relative}
.ch .bg{position:sticky;top:0;height:100vh;overflow:hidden;z-index:0}
.ch .bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.ch .bg::before{content:'';position:absolute;inset:0 0 auto 0;height:22vh;background:linear-gradient(to bottom,var(--bg),transparent);z-index:1}
.ch .bg::after{content:'';position:absolute;inset:auto 0 0 0;height:30vh;background:linear-gradient(to top,var(--bg),transparent);z-index:1}
.ch .bg .dim{position:absolute;inset:0;background:rgba(19,17,26,.25);z-index:1}
/* Competição: mais escuro à esquerda, onde fica o título "We're all team." (contraste ≥ 3:1 sobre a foto real) */
#competicao .bg .dim{background:linear-gradient(90deg,rgba(19,17,26,.82) 0%,rgba(19,17,26,.6) 45%,rgba(19,17,26,.25) 80%)}
@media(max-width:800px){#competicao .bg .dim{background:rgba(19,17,26,.6)}}
.ch .fl{position:relative;z-index:2;margin-top:-100vh}
.scene{min-height:100vh;position:relative;padding:0 var(--gut);display:flex;align-items:center}
.scene.end{align-items:flex-end;padding-bottom:16vh}
.ch-title{font-size:clamp(5rem,17vw,17rem);text-transform:uppercase;text-shadow:0 10px 60px rgba(0,0,0,.4)}
.plate{width:min(440px,100%);padding:clamp(26px,3vw,40px);border-radius:4px;background:rgba(19,17,26,.72);backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3);border:1px solid rgba(196,184,232,.18)}
.plate.lil{background:rgba(196,184,232,.92);color:var(--bg);border-color:transparent}
.plate.lil .lbl{color:#3F2899} /* contraste 4,97:1 sobre o lilás */
.plate.lil p{color:#2C2638}
.plate h3{font-size:clamp(2.6rem,4.6vw,4rem);text-transform:uppercase;margin:12px 0 14px}
.plate p{color:#D9D4E6;font-size:14.5px}
.scene.r{justify-content:flex-end}

/* archive: list + sticky photo (same pattern as equipa) */
.arch{position:relative;z-index:2;background:var(--bg);padding:clamp(60px,10vh,110px) var(--gut) clamp(100px,14vh,160px)}
.arch-in{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(30px,5vw,90px)}
.arch-side{position:sticky;top:110px;align-self:start}
.arch-hd h2{font-size:clamp(3rem,6vw,5.4rem);text-transform:uppercase}
.arch-hd p{max-width:380px;color:var(--mute);font-size:14px;margin-top:14px}
.arch-ph{position:relative;margin-top:30px;width:min(100%,62vh);aspect-ratio:4/3;overflow:hidden;border-radius:4px;background:var(--bg2)}
.arch ul{list-style:none;border-top:1px solid var(--line)}
.arch li{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);cursor:default;outline:none;transition:padding .5s var(--ease),color .3s}
.arch li .bb{font-size:clamp(2.2rem,4.6vw,4.2rem);text-transform:uppercase}
.arch li small{font-size:12px;letter-spacing:.16em;color:var(--mute);white-space:nowrap}
.arch li.act{padding-left:22px;color:var(--lil)}
.arch li:first-child .bb::after{content:'Mais recente';font-family:'Sora';font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;vertical-align:top;margin-left:14px;padding:4px 10px;border-radius:999px;background:var(--lil);color:var(--bg);position:relative;top:.6em}

/* shared: crossfading photo stack + hidden thumbs on desktop */
.eq-ph img,.arch-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .6s ease,transform 1.2s var(--ease)}
.eq-ph img.on,.arch-ph img.on{opacity:1;transform:none}
.eq li .th,.arch li .th{display:none}

@media(max-width:800px){
  .arch-in{grid-template-columns:1fr}
  .arch-side{position:static}
  .arch-ph{display:none}
  .arch li{display:grid;grid-template-columns:96px 1fr auto;align-items:center;gap:14px;padding:12px 0}
  .arch li.act{padding-left:0}
  .arch li .th{display:block;width:96px;aspect-ratio:4/3;object-fit:cover;border-radius:3px}
  .arch li .bb{font-size:clamp(1.7rem,7vw,2.4rem)}
  .arch li:first-child .bb::after{display:none}
}

/* competition */
.teams{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;width:100%}
.team{padding:26px 22px 24px;border-radius:4px;background:rgba(19,17,26,.7);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(196,184,232,.16);display:flex;flex-direction:column;min-height:260px;transition:transform .6s var(--ease),border-color .3s}
.team:hover{transform:translateY(-6px);border-color:var(--lil)}
.team .bb{font-size:clamp(2.4rem,3.4vw,3.2rem);text-transform:uppercase;margin:10px 0 12px}
.team p{color:#CFC9DD;font-size:13.5px;flex:1}
.team small{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:11.5px;letter-spacing:.08em;color:var(--lil)}
.wearteam{font-size:clamp(5rem,15vw,15rem);text-transform:uppercase;line-height:.84}
.wearteam em{font-style:normal;color:transparent;-webkit-text-stroke:2px #fff}
@media(max-width:1000px){.teams{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.teams{grid-template-columns:1fr}.team{min-height:0}}

/* ===== HORÁRIOS ===== */
.hor{position:relative;background:var(--paper);color:var(--paper-ink);padding:clamp(90px,14vh,150px) var(--gut);border-radius:28px 28px 0 0;z-index:3}
.hor .lbl{color:var(--vio)}
.hor-hd{display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:end;margin-bottom:46px}
.hor-hd h2{font-size:clamp(4rem,10vw,9.5rem);text-transform:uppercase;margin-top:12px}
.hor-hd p{color:#4B4558;max-width:420px;justify-self:end}
.days{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.days::-webkit-scrollbar{display:none}
.day{flex:0 0 auto;padding:12px 22px;border-radius:999px;border:1px solid rgba(19,17,26,.18);font-size:13px;font-weight:600;letter-spacing:.04em;transition:background .3s,color .3s,border-color .3s}
.day:hover{border-color:var(--paper-ink)}
.day[aria-pressed=true]{background:var(--paper-ink);color:var(--paper);border-color:var(--paper-ink)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 34px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;font-size:12px;font-weight:500;background:#E6E2EE;transition:background .3s,color .3s}
.chip::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--c,#13111A)}
.chip.on{background:var(--paper-ink);color:#fff}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;min-height:260px}
.cls{position:relative;background:#fff;border-radius:6px;padding:20px 20px 18px 24px;overflow:hidden;animation:cin .6s var(--ease) both}
.cls::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--c)}
.cls .t{font-family:'Bebas Neue';font-size:34px;line-height:1}
.cls .t.var{font-size:24px;color:#6B6478}
.cls .n{font-weight:600;font-size:15px;margin-top:6px}
.cls .m{font-size:12.5px;color:#6B6478;margin-top:2px}
/* etiqueta em texto escuro (contraste 8:1) com o ponto na cor da modalidade, como nos filtros */
.cls .k{position:absolute;right:16px;top:18px;display:flex;align-items:center;gap:6px;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#4B4558}
.cls .k::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--c)}
.empty{grid-column:1/-1;padding:40px;text-align:center;color:#6B6478;border:1px dashed rgba(19,17,26,.2);border-radius:6px}
@keyframes cin{from{opacity:0;transform:translateY(14px)}}
.estrat{margin-top:44px;border-top:1px solid rgba(19,17,26,.14)}
.estrat summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:22px 0;font-weight:600}
.estrat summary::-webkit-details-marker{display:none}
.estrat summary::after{content:'+';font-size:26px;font-weight:300;transition:transform .4s var(--ease)}
.estrat[open] summary::after{transform:rotate(45deg)}
.estrat .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:26px 40px;padding-bottom:20px}
.estrat h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--vio);margin-bottom:10px}
.estrat .it{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid rgba(19,17,26,.08);font-size:13.5px}
.estrat .it span:last-child{color:#6B6478}
.estrat .note{font-size:13px;color:#6B6478;margin-bottom:22px;max-width:640px}
@media(max-width:800px){.hor-hd{grid-template-columns:1fr}.hor-hd p{justify-self:start}}

/* ===== EQUIPA ===== */
.eq{background:var(--paper);color:var(--paper-ink);padding:0 var(--gut) clamp(90px,14vh,150px);position:relative;z-index:3}
.eq-in{border-top:1px solid rgba(19,17,26,.14);padding-top:clamp(70px,10vh,110px);display:grid;grid-template-columns:1fr 1.5fr;gap:clamp(30px,6vw,100px)}
.eq-side{position:sticky;top:110px;align-self:start}
.eq .lbl{color:var(--vio)}
.eq h2{font-size:clamp(3.4rem,6vw,6rem);text-transform:uppercase;margin:12px 0 16px}
.eq-side p{color:#4B4558;max-width:360px}
.eq-ph{position:relative;margin-top:28px;width:min(100%,44vh);aspect-ratio:1/1;overflow:hidden;border-radius:4px;background:#E6E2EE}
.eq ul{list-style:none}
.eq li{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:12px 0;border-bottom:1px solid rgba(19,17,26,.12);position:relative;overflow:hidden;cursor:default;outline:none}
.eq li::before{content:'';position:absolute;inset:0;background:var(--paper-ink);transform:translateY(101%);transition:transform .5s var(--ease);z-index:0}
.eq li.act::before{transform:none}
.eq li>*{position:relative;z-index:1;transition:color .3s,transform .5s var(--ease)}
.eq li.act>*{color:#fff}
.eq li.act .bb{transform:translateX(16px);color:var(--lil)}
.eq li .bb{font-size:clamp(2.2rem,4.4vw,3.8rem);text-transform:uppercase}
.eq li small{font-size:12px;color:#6B6478;text-align:right;padding-right:10px}
@media(max-width:800px){
  .eq-in{grid-template-columns:1fr}
  .eq-side{position:static}
  .eq-ph{display:none}
  .eq ul{display:grid;grid-template-columns:1fr 1fr;gap:18px 12px}
  .eq li{display:block;padding:0;border:0}
  .eq li::before{display:none}
  .eq li.act>*,.eq li.act .bb{color:inherit;transform:none}
  .eq li.act small{color:#6B6478}
  .eq li .th{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px;margin-bottom:10px}
  .eq li .bb{font-size:clamp(1.5rem,6vw,2rem);display:block}
  .eq li small{display:block;text-align:left;padding:2px 0 0;font-size:11.5px}
}

/* ===== COMPLEMENTAR ===== */
.cmp{background:var(--bg);padding:clamp(100px,16vh,170px) var(--gut);position:relative;z-index:3}
.cmp-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:46px}
.cmp-hd h2{font-size:clamp(3.4rem,7vw,6.6rem);text-transform:uppercase;margin-top:12px}
.cmp-hd p{max-width:380px;color:var(--mute)}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.c3{padding:30px 28px;border:1px solid var(--line);border-radius:6px;min-height:300px;display:flex;flex-direction:column;transition:background .4s,border-color .4s,transform .6s var(--ease)}
.c3:hover{background:var(--bg2);border-color:var(--lil);transform:translateY(-4px)}
.c3 .num{font-family:'Bebas Neue';font-size:20px;color:var(--lil)}
.c3 h3{font-size:clamp(2.4rem,3.6vw,3.4rem);text-transform:uppercase;margin:auto 0 14px;padding-top:50px}
.c3 p{color:#CFC9DD;font-size:14px}
@media(max-width:860px){.cards3{grid-template-columns:1fr}.c3{min-height:0}}

/* ===== PARCEIROS E APOIOS ===== */
.spons{background:var(--bg);padding:clamp(50px,8vh,90px) var(--gut);position:relative;z-index:3;display:grid;grid-template-columns:auto 1fr;gap:clamp(30px,6vw,110px);border-top:1px solid var(--line)}
.sp-grp .lbl{display:block;margin-bottom:22px}
.sp-logos{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(28px,4vw,56px)}
.sp-logos a{display:block;opacity:.6;transition:opacity .3s,transform .5s var(--ease)}
.sp-logos .nolink{display:block;opacity:.6}
.load-msg{font-size:14px;opacity:.7;padding:12px 0;max-width:560px}
.sp-logos a:hover,.sp-logos a:focus-visible{opacity:1;transform:translateY(-3px) rotate(-2deg)}
.sp-logos img{height:42px;width:auto;filter:brightness(0) invert(1)}
.sp-logos img.sm{height:30px}
@media(max-width:700px){.spons{grid-template-columns:1fr}.sp-logos img{height:34px}.sp-logos img.sm{height:24px}}

/* ===== CTA / CONTACTO ===== */
.ctx{position:relative;overflow:hidden;background:var(--bg);z-index:3}
.ctx .wash{position:absolute;inset:0;z-index:0}
.ctx .wash img{width:100%;height:100%;object-fit:cover;opacity:.5}
.ctx .wash::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,var(--bg) 0%,rgba(19,17,26,.5) 35%,rgba(19,17,26,.75) 70%,var(--bg) 100%)}
.ctx>*:not(.wash){position:relative;z-index:2}
.areyou{padding:clamp(120px,22vh,240px) var(--gut) clamp(80px,12vh,120px);text-align:center}
.areyou .lbl{display:block;margin-bottom:22px}
.areyou h2{font-size:clamp(5.4rem,19vw,19rem);text-transform:uppercase}
.areyou h2 em{font-style:normal;color:var(--lil)}
.areyou p{max-width:460px;margin:22px auto 34px;color:#D9D4E6;font-size:17px}
.contact{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding:46px var(--gut) clamp(80px,12vh,120px);border-top:1px solid var(--line);margin:0 var(--gut);padding-left:0;padding-right:0}
.contact h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--lil);margin-bottom:12px;font-weight:600}
.contact h5{font-size:11px;font-weight:600;color:var(--mute);margin:14px 0 2px}
.contact h4+h5{margin-top:0}
.contact p,.contact a{font-size:14.5px;color:#E3DFEC;display:block;line-height:1.8}
.contact a:hover{color:var(--lil)}
#marcar{scroll-margin-top:120px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.arch li:focus-visible{outline:2px solid var(--lil);outline-offset:4px}
.eq li:focus-visible{outline:2px solid var(--vio);outline-offset:4px} /* fundo claro: violeta (6,49:1) */
.form input::-webkit-outer-spin-button,.form input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.form input[type=number]{-moz-appearance:textfield} /* o cabeçalho fixo não tapa o formulário */
.form-alt{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.04)}
.form-alt[hidden]{display:none}
.form-alt p{flex-basis:100%;margin:0;font-size:13.5px;color:var(--ink)}
.form-alt .btn{padding:11px 18px;font-size:11px}
.contact .form-alt .btn{display:inline-flex;color:#fff;line-height:1.6} /* o link do Gmail igual ao botão Copiar */
.form-alt p:focus{outline:none}
.contact .form-alt .form-alt-tel{font-size:12.5px;color:var(--mute)}
.contact .form-alt-tel a{display:inline;font-size:inherit;color:var(--ink);text-decoration:underline}
.contact .form-note{font-size:12.5px;line-height:1.6;color:var(--mute)}.contact .form-note a{display:inline;font-size:inherit;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.join{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:28px}.join p{color:#E3DFEC;max-width:520px}
/* texto da Competição sobre a foto: sombra para manter a leitura nas zonas claras */
#competicao .scene.end p{text-shadow:0 1px 2px rgba(19,17,26,.9),0 0 18px rgba(19,17,26,.8)}
/* formulário "Fala connosco" (opção 2 aprovada pelo João, 20 out 2026): etiqueta visível por cima de cada campo, caixas de escrever */
.form{grid-column:1/-1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px 14px;margin-top:20px;align-items:start}
.form .w2{grid-column:span 2}.form .w3{grid-column:span 3}.form .w6{grid-column:1/-1}
.contact .form .lb{display:block;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--lil);margin:0 0 8px 4px;line-height:1.4}
.contact .form .lb i{font-style:normal;color:#CFC9DD;letter-spacing:.12em}
.form input,.form select,.form textarea{width:100%;background-color:rgba(255,255,255,.07);border:1.5px solid rgba(242,239,248,.5);border-radius:14px;padding:15px 18px;color:var(--ink);font:inherit;font-size:16px;outline:none;transition:border-color .3s}
.form textarea{resize:vertical;min-height:150px;line-height:1.6;display:block}
.form select{appearance:none;-webkit-appearance:none;padding-right:46px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23C4B8E8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 20px center}
.form select option{background:var(--bg)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--lil)}
.form input:focus-visible,.form select:focus-visible,.form textarea:focus-visible{outline:2px solid var(--lil);outline-offset:2px}
.form ::placeholder{color:#A9A3BA}
.form select:has(option[value=""]:checked){color:#A9A3BA} /* "Escolhe" cinzento como os exemplos: não parece já escolhido */
.form-end{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:14px 24px;flex-wrap:wrap}
.contact .form-end .form-note{font-size:13.5px;color:#CFC9DD;margin:0;max-width:640px}
@media(max-width:1100px){.form .w2{grid-column:span 3}.form .w2:nth-child(3){grid-column:1/-1}}
@media(max-width:900px){.contact{grid-template-columns:1fr 1fr}.form{grid-template-columns:1fr}.form .w2,.form .w3,.form .w2:nth-child(3){grid-column:1/-1}.form-end{flex-direction:column;align-items:stretch}.form-end .btn{justify-content:center}}
@media(max-width:520px){.contact{grid-template-columns:1fr}}

/* ===== FOOTER ===== */
.ft{background:#0C0B10;padding:60px var(--gut) 30px;position:relative;z-index:3;overflow:hidden}
/* footer: giant R&D drawn from the logo's own paths — outline that fills on hover / when in view on touch */
.ft .giant{position:relative;width:clamp(280px,58vw,920px);margin:10px auto 44px;aspect-ratio:75/40}
.ft .rd-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ft .rd-o{fill:none;stroke:rgba(242,239,248,.38);stroke-width:1.5px;stroke-linejoin:round;transition:opacity .5s ease .4s}
.ft .rd-o use+use{stroke:rgba(196,184,232,.6)}
.ft .rd-f1{fill:var(--ink);clip-path:inset(0 100% 0 0);transition:clip-path .9s var(--ease)}
.ft .rd-f2{fill:var(--lil);clip-path:inset(0 100% 0 0);transition:clip-path .6s var(--ease) .3s}
.ft .giant:hover .rd-f1,.ft .giant:hover .rd-f2,.ft .giant.fill .rd-f1,.ft .giant.fill .rd-f2{clip-path:inset(0 0 0 0)}
.ft .giant:hover .rd-o,.ft .giant.fill .rd-o{opacity:0}
.ft-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;font-size:12.5px;color:var(--mute);border-top:1px solid var(--line);padding-top:24px}
.ft-row nav{display:flex;flex-wrap:wrap;gap:22px}
.ft-row a:hover{color:var(--ink)}
.ft-row .pw a{font-weight:700;color:var(--ink)}
.ft-row .pw a:hover{color:var(--lil)}

/* ===== REVEALS ===== */
.rt>*{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform 1s var(--ease)}
.rt.in>*{opacity:1;transform:none}
.rt>*:nth-child(2){transition-delay:.08s}.rt>*:nth-child(3){transition-delay:.16s}.rt>*:nth-child(4){transition-delay:.24s}.rt>*:nth-child(5){transition-delay:.32s}.rt>*:nth-child(6){transition-delay:.4s}.rt>*:nth-child(7){transition-delay:.48s}.rt>*:nth-child(8){transition-delay:.56s}.rt>*:nth-child(9){transition-delay:.64s}
.rv{overflow:hidden}
.rv img{transform:scale(1.14);opacity:0;transition:transform 1.6s var(--ease),opacity 1s ease}
.rv.in img{transform:scale(1);opacity:1}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .hero{height:100vh}
  /* o carrossel das Modalidades fica em slide: deslizar é o visitante a mexer, não uma animação (antes empilhava, pedido do João a 20 out 2026) */
  .mod .ph img,.mod:hover .ph img{transform:none}
  .stmt .w{opacity:1}
}