/* =====================================================================
   JACQUELINE MORAES · 40400 — Coragem para virar o jogo
   Identidade: roxo #7E3282 · roxo escuro #392254 · laranja #F1862A · vermelho #E1471E
   Tipografia: Poppins (corpo/display) + Artbrush (assinatura de marca)
   ===================================================================== */

/* ---------- FONTES ---------- */
@font-face{font-family:'Poppins';src:url('../assets/fonts/Poppins-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../assets/fonts/Poppins-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../assets/fonts/Poppins-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../assets/fonts/Poppins-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../assets/fonts/Poppins-ExtraBold.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../assets/fonts/Poppins-Black.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../assets/fonts/Poppins-BlackItalic.woff2') format('woff2');font-weight:900;font-style:italic;font-display:swap}
@font-face{font-family:'Artbrush';src:url('../assets/fonts/Artbrush.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

/* ---------- TOKENS ---------- */
:root{
  --roxo:#7E3282;
  --roxo-esc:#392254;
  --roxo-noite:#241539;
  --roxo-tinta:#170C26;
  --laranja:#F1862A;
  --laranja-claro:#F9A34D;
  --vermelho:#E1471E;

  --creme:#FDF8F2;
  --areia:#F4EAE0;
  --areia-esc:#E7D8C9;
  --tinta:#22132F;
  --tinta-suave:#5A4C66;

  --g-quente:linear-gradient(100deg,var(--laranja) 0%,var(--vermelho) 100%);
  --g-marca:linear-gradient(120deg,var(--laranja) 0%,var(--vermelho) 45%,var(--roxo) 100%);
  --g-noite:linear-gradient(165deg,var(--roxo-noite) 0%,var(--roxo-esc) 45%,#4C2A63 100%);

  --fonte:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --pincel:'Artbrush','Poppins',cursive;

  --r-sm:14px;
  --r-md:24px;
  --r-lg:40px;
  --r-xl:clamp(32px,6vw,80px);

  --sombra-sm:0 4px 18px rgba(35,17,52,.08);
  --sombra:0 18px 50px -18px rgba(35,17,52,.30);
  --sombra-alta:0 40px 90px -30px rgba(35,17,52,.45);

  --topo-h:74px;
  --pad-lat:clamp(20px,5vw,64px);
  --max:1280px;

  --t-rapida:.25s cubic-bezier(.4,0,.2,1);
  --t-media:.45s cubic-bezier(.4,0,.2,1);
  --t-lenta:.9s cubic-bezier(.16,1,.3,1);
}

/* ---------- RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--topo-h) + 12px);
}
body{
  font-family:var(--fonte);
  font-size:clamp(1rem,.96rem + .22vw,1.075rem);
  line-height:1.68;
  color:var(--tinta);
  background:var(--creme);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
h1,h2,h3,h4{line-height:1.06;letter-spacing:-.035em;font-weight:900}
::selection{background:var(--laranja);color:#fff}

/* ---------- SCROLLBAR NA COR DA MARCA ---------- */
html{scrollbar-width:thin;scrollbar-color:var(--roxo) var(--areia)}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:var(--areia)}
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--laranja),var(--vermelho) 45%,var(--roxo));
  border-radius:99px;
  border:3px solid var(--areia);
}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--vermelho),var(--roxo))}
::-webkit-scrollbar-corner{background:var(--areia)}

/* ---------- UTILITÁRIOS ---------- */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad-lat)}
.pincel{
  font-family:var(--pincel);
  font-style:normal;
  letter-spacing:.005em;
  font-weight:400;
  line-height:.9;
  /* o Artbrush tem traços finais (cauda de letras como m, a, o) que ultrapassam
     a largura "oficial" do texto — sem essa folga, o degradê (background-clip:text)
     não pinta esse pedaço final e a última letra parece cortada */
  padding-right:.22em;
}
.pular{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--roxo);color:#fff;padding:12px 20px;border-radius:0 0 12px 0;font-weight:600;
}
.pular:focus{left:0}
:focus-visible{outline:3px solid var(--laranja);outline-offset:3px;border-radius:6px}

/* =====================================================================
   CABEÇALHO
   ===================================================================== */
.topo{
  position:fixed;inset:0 0 auto 0;z-index:100;
  height:var(--topo-h);
  transition:background var(--t-media),box-shadow var(--t-media),backdrop-filter var(--t-media);
}
.topo__int{
  height:var(--topo-h);
  max-width:var(--max);margin-inline:auto;padding-inline:var(--pad-lat);
  display:flex;align-items:center;gap:clamp(14px,3vw,36px);
}
.topo.solido{
  background:rgba(253,248,242,.88);
  backdrop-filter:blur(16px) saturate(1.3);
  -webkit-backdrop-filter:blur(16px) saturate(1.3);
  box-shadow:0 1px 0 rgba(126,50,130,.14),0 10px 34px -22px rgba(35,17,52,.5);
}

.marca{display:flex;align-items:center;gap:11px;flex-shrink:0}
.marca__simbolo{width:40px;height:auto;transition:transform var(--t-media)}
.marca:hover .marca__simbolo{transform:rotate(-8deg) scale(1.08)}
.marca__txt{display:flex;flex-direction:column;line-height:1.05}
.marca__txt strong{
  font-size:clamp(.95rem,.9rem + .25vw,1.08rem);font-weight:800;letter-spacing:-.03em;
  color:#fff;transition:color var(--t-media);white-space:nowrap;
}
.marca__txt em{
  font-style:normal;font-size:.68rem;font-weight:700;letter-spacing:.14em;
  color:var(--laranja);transition:color var(--t-media);
}
.topo.solido .marca__txt strong{color:var(--roxo-esc)}
.topo.solido .marca__txt em{color:var(--vermelho)}

.menu{display:flex;gap:clamp(10px,1.6vw,26px);margin-left:auto}
.menu a{
  position:relative;font-size:.94rem;font-weight:500;color:rgba(255,255,255,.9);
  padding:7px 2px;transition:color var(--t-rapida);white-space:nowrap;
}
.menu a::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:2.5px;border-radius:2px;
  background:var(--g-quente);transform:scaleX(0);transform-origin:left;
  transition:transform var(--t-media);
}
.menu a:hover::after,.menu a.ativo::after{transform:scaleX(1)}
.topo.solido .menu a{color:var(--tinta-suave)}
.topo.solido .menu a:hover,.topo.solido .menu a.ativo{color:var(--roxo)}
.menu a.ativo{color:#fff;font-weight:600}

.topo__acoes{display:flex;align-items:center;gap:12px;margin-left:auto}
/* só no desktop: o menu (em fluxo normal) já empurra tudo para a direita,
   então as ações não precisam de outro margin-left:auto */
@media (min-width:1001px){.menu+.topo__acoes{margin-left:0}}

.topo__progresso{
  position:absolute;left:0;bottom:0;height:3px;width:100%;
  background:var(--g-quente);transform:scaleX(0);transform-origin:left;
  transition:transform .1s linear;
}

.hamb{display:none;width:42px;height:42px;border-radius:12px;position:relative;flex-shrink:0}
.hamb span{
  position:absolute;left:11px;width:20px;height:2.4px;border-radius:2px;background:#fff;
  transition:transform var(--t-media),opacity var(--t-rapida),background var(--t-media);
}
.hamb span:nth-child(1){top:14px}
.hamb span:nth-child(2){top:20px}
.hamb span:nth-child(3){top:26px}
.topo.solido .hamb span{background:var(--roxo-esc)}
.hamb[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hamb[aria-expanded="true"] span:nth-child(2){opacity:0}
.hamb[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* =====================================================================
   BOTÕES
   ===================================================================== */
.btn{
  --bg:var(--g-quente);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 28px;border-radius:99px;
  font-weight:700;font-size:.98rem;letter-spacing:-.01em;line-height:1;
  color:#fff;background:var(--bg);
  position:relative;overflow:hidden;isolation:isolate;
  transition:transform var(--t-rapida),box-shadow var(--t-media),color var(--t-media);
  box-shadow:0 12px 28px -12px rgba(225,71,30,.75);
  text-align:center;
}
.btn::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,var(--vermelho),var(--roxo));
  opacity:0;transition:opacity var(--t-media);
}
.btn:hover{transform:translateY(-3px)}
.btn:hover::before{opacity:1}
.btn:active{transform:translateY(-1px)}
.btn svg{flex-shrink:0}
.btn--zap{--bg:linear-gradient(100deg,#25D366,#12a54c)}
.btn--zap{box-shadow:0 12px 28px -12px rgba(18,165,76,.7)}
.btn--zap::before{background:linear-gradient(100deg,#12a54c,#0b7a37)}
.btn--roxo{--bg:linear-gradient(100deg,var(--roxo),var(--roxo-esc));box-shadow:0 12px 28px -12px rgba(126,50,130,.7)}
.btn--roxo::before{background:linear-gradient(100deg,var(--roxo-esc),var(--roxo-noite))}
.btn--laranja{--bg:var(--g-quente)}
.btn--mini{padding:11px 18px;font-size:.86rem}
.btn--vazado{
  --bg:transparent;color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.42);
}
.btn--vazado::before{background:#fff}
.btn--vazado:hover{color:var(--roxo-esc);box-shadow:inset 0 0 0 2px #fff}
.btn--bloco{width:100%}

/* =====================================================================
   01. HERO
   ===================================================================== */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding-top:calc(var(--topo-h) + clamp(24px,5vh,60px));
  background:var(--g-noite);
  overflow:hidden;
  isolation:isolate;
}
.hero__fundo{position:absolute;inset:0;z-index:-2;overflow:hidden}
.orb{
  position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;
  will-change:transform;
}
.orb--1{width:44vw;height:44vw;min-width:340px;min-height:340px;background:var(--roxo);top:-14%;right:-8%;opacity:.55}
.orb--2{width:36vw;height:36vw;min-width:280px;min-height:280px;background:var(--vermelho);bottom:-10%;left:-6%;opacity:.34}
.orb--3{width:26vw;height:26vw;min-width:220px;min-height:220px;background:var(--laranja);top:38%;left:44%;opacity:.2}
.grade{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:clamp(46px,6vw,80px) clamp(46px,6vw,80px);
  mask-image:radial-gradient(ellipse 80% 65% at 50% 40%,#000 20%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 80% 65% at 50% 40%,#000 20%,transparent 78%);
}

.hero__marca-dagua{
  position:absolute;left:50%;bottom:clamp(120px,20vh,230px);
  transform:translateX(-50%);
  z-index:-1;width:120%;text-align:center;pointer-events:none;
}
.hero__marca-dagua span{
  font-size:clamp(4rem,15vw,15rem);font-weight:900;letter-spacing:-.06em;
  color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.09);
  white-space:nowrap;line-height:1;
}

.hero__int{
  position:relative;
  width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad-lat);
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  align-items:end;gap:clamp(16px,3vw,48px);
  flex:1;
}

.hero__texto{padding-bottom:clamp(28px,6vh,68px);align-self:center}

.etiqueta{
  display:inline-flex;align-items:center;gap:9px;
  padding:8px 16px 8px 12px;border-radius:99px;
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
  backdrop-filter:blur(8px);
  font-size:.78rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:rgba(255,255,255,.92);margin-bottom:clamp(18px,3vh,28px);
}
.etiqueta__ponto{
  width:8px;height:8px;border-radius:50%;background:var(--laranja);flex-shrink:0;
  box-shadow:0 0 0 0 rgba(241,134,42,.7);animation:pulso 2.4s infinite;
}
@keyframes pulso{
  0%{box-shadow:0 0 0 0 rgba(241,134,42,.65)}
  70%{box-shadow:0 0 0 11px rgba(241,134,42,0)}
  100%{box-shadow:0 0 0 0 rgba(241,134,42,0)}
}

.hero__titulo{
  font-size:clamp(3.1rem,10.5vw,7.2rem);
  font-weight:900;letter-spacing:-.045em;line-height:.92;color:#fff;
  margin-bottom:clamp(20px,3vh,30px);
}
/* folga vertical para os traços/descendentes (Artbrush em "Coragem", j/g em "o jogo")
   não serem cortados pelo overflow:hidden da animação — padding-bottom soma espaço
   só embaixo, e o margin-bottom negativo cancela o empurrão na linha seguinte */
.hero__titulo .linha{display:block;overflow:hidden;will-change:transform}
.hero__titulo .linha:first-child{padding-bottom:.34em;margin-bottom:-.3em}
.hero__titulo .linha:last-child{padding-bottom:.42em;margin-bottom:-.4em}
.hero__titulo .pincel{
  display:inline-block;
  font-size:1.24em;line-height:.9;padding-bottom:.16em;
  background:linear-gradient(96deg,var(--laranja) 10%,var(--laranja-claro) 55%,var(--vermelho) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  padding-right:.06em;
}
.hero__titulo .pt{color:var(--laranja);-webkit-text-fill-color:var(--laranja)}

.hero__sub{
  max-width:30ch;font-size:clamp(1.02rem,.95rem + .38vw,1.22rem);
  color:rgba(255,255,255,.82);line-height:1.6;margin-bottom:clamp(24px,4vh,36px);
}
.hero__sub strong{color:#fff;font-weight:700}

.hero__ctas{display:flex;flex-wrap:wrap;gap:13px}

/* --- figura da candidata --- */
.hero__figura{
  position:relative;align-self:end;justify-self:center;
  width:100%;max-width:min(560px,46vw);
  display:flex;align-items:flex-end;justify-content:center;
}
.disco{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:min(94%,470px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 42%,rgba(241,134,42,.95) 0%,rgba(225,71,30,.85) 42%,rgba(126,50,130,.15) 72%,transparent 78%);
  filter:blur(2px);
  z-index:-1;
}
.anel{
  position:absolute;left:50%;bottom:2%;transform:translateX(-50%);
  width:min(112%,560px);aspect-ratio:1;z-index:-1;
  animation:girar 46s linear infinite;
}
.anel svg{width:100%;height:100%;overflow:visible}
.anel__texto{
  font-family:var(--fonte);font-size:12.4px;font-weight:700;letter-spacing:.32em;
  fill:rgba(255,255,255,.62);text-transform:uppercase;
}
@keyframes girar{to{transform:translateX(-50%) rotate(360deg)}}

.hero__foto{
  position:relative;
  width:100%;height:auto;
  max-height:min(78svh,760px);
  object-fit:contain;object-position:bottom center;
  filter:drop-shadow(0 40px 60px rgba(20,8,35,.55));
  will-change:transform;
  /* dissolve a base da foto no fundo, em vez de um corte reto */
  mask-image:linear-gradient(to bottom,#000 84%,rgba(0,0,0,.72) 92%,transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,#000 84%,rgba(0,0,0,.72) 92%,transparent 100%);
}

.selo{
  position:absolute;left:-9%;top:4%;
  display:flex;flex-direction:column;align-items:flex-start;gap:5px;
  padding:13px 19px;border-radius:18px;
  background:rgba(36,21,57,.72);
  box-shadow:inset 0 0 0 1px rgba(241,134,42,.4),0 18px 40px -18px rgba(0,0,0,.7);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  will-change:transform;
}
.selo__label{
  font-size:.63rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.65);
}
.selo img{width:clamp(78px,9vw,112px);height:auto}

.pin{
  position:absolute;
  display:flex;flex-direction:column;gap:1px;
  max-width:172px;padding:12px 16px;border-radius:16px;
  /* fundo escuro: os cartões passam por cima da camisa branca da foto */
  background:rgba(30,16,48,.74);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 18px 36px -20px rgba(0,0,0,.8);
  backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);
  will-change:transform;
}
.pin strong{
  font-size:1.32rem;font-weight:900;letter-spacing:-.03em;line-height:1;
  background:var(--g-quente);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.pin span{font-size:.72rem;line-height:1.35;color:rgba(255,255,255,.82)}
.pin--a{right:0;top:44%}
.pin--b{left:0;bottom:16%}

/* --- faixa de números: emenda a hero na próxima seção --- */
.faixa-num{
  position:relative;z-index:2;
  margin-top:clamp(24px,4vh,50px);
  background:var(--g-quente);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
}
.faixa-num__int{
  max-width:var(--max);margin-inline:auto;padding:clamp(24px,3.4vw,38px) var(--pad-lat);
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2.4vw,34px);
}
.num{
  display:flex;flex-direction:column;gap:5px;
  padding-left:16px;border-left:2.5px solid rgba(255,255,255,.34);
}
.num strong{
  font-size:clamp(1.75rem,1.2rem + 2.1vw,2.85rem);font-weight:900;letter-spacing:-.045em;
  line-height:1;color:#fff;font-variant-numeric:tabular-nums;
}
.num span{font-size:clamp(.76rem,.72rem + .16vw,.87rem);line-height:1.35;color:rgba(255,255,255,.93);font-weight:500}

/* =====================================================================
   CABEÇALHO DE SEÇÃO (padrão comum)
   ===================================================================== */
.secao-cab{
  position:relative;max-width:60rem;
  margin-bottom:clamp(40px,6vw,76px);
}
.secao-cab__num{
  display:block;font-size:.76rem;font-weight:800;letter-spacing:.32em;
  color:var(--vermelho);margin-bottom:14px;
}
.secao-cab__num::before{
  content:'';display:inline-block;width:34px;height:2.5px;border-radius:2px;
  background:var(--g-quente);vertical-align:middle;margin-right:12px;
  transform:translateY(-1px);
}
.secao-cab__tit{
  font-size:clamp(2.1rem,1.2rem + 4.2vw,4.35rem);
  letter-spacing:-.045em;line-height:.98;margin-bottom:clamp(16px,2.4vw,24px);
  color:var(--roxo-esc);
}
.secao-cab__tit .pincel{
  font-size:1.2em;line-height:1.15;display:inline-block;
  background:var(--g-quente);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.secao-cab__olho{
  font-size:clamp(1rem,.95rem + .34vw,1.18rem);
  color:var(--tinta-suave);line-height:1.68;max-width:56ch;
}
.secao-cab--claro .secao-cab__tit{color:#fff}
.secao-cab--claro .secao-cab__olho{color:rgba(255,255,255,.78)}
.secao-cab--claro .secao-cab__num{color:var(--laranja-claro)}

/* =====================================================================
   02. SOBRE
   ===================================================================== */
.sobre{
  position:relative;z-index:2;
  background:var(--creme);
  padding-block:clamp(64px,9vw,120px) clamp(70px,10vw,130px);
}
.sobre__grade{
  display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(28px,5vw,72px);align-items:start;
}
.sobre__col-foto{position:sticky;top:calc(var(--topo-h) + 32px);display:grid;gap:clamp(16px,2.4vw,26px)}

.foto-recorte{position:relative;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sombra)}
.foto-recorte img{width:100%;aspect-ratio:4/3.4;object-fit:cover;transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
.foto-recorte:hover img{transform:scale(1.05)}
.foto-recorte figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:34px 18px 15px;
  background:linear-gradient(to top,rgba(23,12,38,.92),transparent);
  color:#fff;font-size:.8rem;font-weight:600;letter-spacing:.02em;
}
.foto-recorte--desloca{margin-left:clamp(20px,5vw,58px)}
.foto-recorte--desloca img{aspect-ratio:4/3}

.sobre__col-txt p{margin-bottom:1.15em;color:var(--tinta-suave)}
.sobre__col-txt p:last-child{margin-bottom:0}
.sobre__col-txt strong{color:var(--roxo);font-weight:700}
.destaque-p{
  font-size:clamp(1.12rem,1rem + .55vw,1.4rem)!important;
  line-height:1.55;color:var(--tinta)!important;font-weight:500;
  letter-spacing:-.015em;
}
mark{
  background:linear-gradient(to top,rgba(241,134,42,.34) 42%,transparent 42%);
  color:inherit;padding:0 .1em;font-weight:600;
}
.citacao{
  position:relative;
  margin:clamp(26px,4vw,38px) 0;padding:clamp(20px,3vw,28px) clamp(22px,3vw,32px);
  border-radius:var(--r-sm) var(--r-md) var(--r-md) var(--r-sm);
  background:linear-gradient(120deg,rgba(126,50,130,.07),rgba(241,134,42,.09));
  border-left:4px solid transparent;
  border-image:var(--g-quente) 1;
  border-right:0;border-top:0;border-bottom:0;
  font-size:clamp(1.05rem,.98rem + .45vw,1.28rem);
  font-weight:600;line-height:1.5;letter-spacing:-.02em;color:var(--roxo-esc);
}
.assinatura{
  margin-top:clamp(28px,4vw,40px)!important;padding-top:clamp(22px,3vw,30px);
  border-top:2px dashed var(--areia-esc);
  font-family:var(--pincel);font-size:clamp(1.6rem,1.2rem + 1.8vw,2.5rem);
  line-height:.98;color:var(--roxo)!important;
}
.assinatura span{
  display:block;margin-top:12px;
  font-family:var(--fonte);font-size:.8rem;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:var(--vermelho);
}

/* =====================================================================
   03. TRAJETÓRIA
   ===================================================================== */
.trajeto{
  position:relative;z-index:3;
  background:var(--g-noite);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  padding-block:clamp(64px,9vw,116px) clamp(64px,9vw,110px);
  margin-top:calc(-1 * clamp(20px,3vw,44px));
  overflow:hidden;
}
.trajeto .secao-cab{margin-bottom:clamp(24px,3vw,38px)}
.trajeto::before{
  content:'';position:absolute;top:-30%;right:-15%;
  width:60vw;height:60vw;border-radius:50%;
  background:radial-gradient(circle,rgba(241,134,42,.18),transparent 66%);
  pointer-events:none;
}

.linha-tempo{position:relative;margin-top:clamp(8px,2vw,20px)}
.linha-tempo__trilho{
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x proximity;
  padding:clamp(28px,4vw,44px) 0 clamp(20px,3vw,30px);
  -webkit-overflow-scrolling:touch;
  cursor:grab;
}
.linha-tempo__trilho.arrastando{cursor:grabbing;scroll-snap-type:none}
.linha-tempo__trilho::-webkit-scrollbar{height:0}
.linha-tempo__trilho{scrollbar-width:none}

.linha-tempo__barra{
  position:absolute;top:clamp(28px,4vw,44px);left:0;right:0;height:2px;
  background:rgba(255,255,255,.13);
}
.linha-tempo__barra i{
  display:block;height:100%;width:0;background:var(--g-quente);
  box-shadow:0 0 14px rgba(241,134,42,.7);
  transition:width .18s linear;
}

.marcos{
  display:flex;gap:clamp(16px,2.4vw,28px);
  padding-inline:max(var(--pad-lat),calc((100vw - var(--max))/2 + var(--pad-lat)));
  width:max-content;
}
.marco{
  position:relative;scroll-snap-align:center;
  width:clamp(248px,26vw,320px);flex-shrink:0;
  padding-top:38px;
  display:flex;flex-direction:column;
}
.marco::before{
  content:'';position:absolute;top:-7px;left:0;
  width:15px;height:15px;border-radius:50%;
  background:var(--roxo-noite);
  box-shadow:inset 0 0 0 3px var(--laranja),0 0 0 5px rgba(241,134,42,.16);
  transition:box-shadow var(--t-media),transform var(--t-media);
}
.marco:hover::before,.marco.visivel::before{
  box-shadow:inset 0 0 0 4px var(--laranja),0 0 0 9px rgba(241,134,42,.25);
  transform:scale(1.12);
}
.marco__ano{
  display:block;
  font-size:clamp(2rem,1.4rem + 2.2vw,3.05rem);font-weight:900;letter-spacing:-.05em;
  line-height:.9;margin-bottom:12px;
  color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.42);
  transition:color var(--t-media),-webkit-text-stroke-color var(--t-media);
}
.marco:hover .marco__ano,.marco.visivel .marco__ano{
  color:var(--laranja);-webkit-text-stroke-color:transparent;
}
.marco h3{
  font-size:clamp(1.02rem,.95rem + .35vw,1.18rem);font-weight:800;letter-spacing:-.028em;
  line-height:1.22;color:#fff;margin-bottom:9px;
}
.marco p{font-size:.9rem;line-height:1.55;color:rgba(255,255,255,.7)}
.marco p strong{color:var(--laranja-claro);font-weight:700}
.marco img{
  width:100%;aspect-ratio:16/11;object-fit:cover;object-position:50% 15%;
  border-radius:var(--r-sm);margin-top:auto;padding-top:16px;
  box-sizing:content-box;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.8);
  filter:saturate(.9);transition:filter var(--t-media),transform var(--t-media);
}
.marco:hover img{filter:saturate(1.06);transform:translateY(-4px)}
.marco--destaque::before{
  background:var(--laranja);
  box-shadow:inset 0 0 0 3px var(--laranja),0 0 0 8px rgba(241,134,42,.28);
}
.marco--destaque .marco__ano{color:var(--laranja);-webkit-text-stroke-color:transparent}
.marco--fim::before{background:var(--laranja);box-shadow:inset 0 0 0 3px #fff,0 0 0 8px rgba(241,134,42,.35)}
.marco__frase{
  margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.16);
  font-family:var(--pincel);font-size:1.5rem!important;line-height:1;color:var(--laranja)!important;
}

.linha-tempo__ctrl{
  display:flex;align-items:center;justify-content:center;gap:16px;
  margin-top:clamp(14px,2.4vw,24px);
}
.seta{
  width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;color:#fff;
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);
  transition:background var(--t-rapida),transform var(--t-rapida);
}
.seta:hover{background:var(--laranja);color:#fff;transform:scale(1.07)}
.seta:disabled{opacity:.3;pointer-events:none}
.linha-tempo__dica{
  font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(255,255,255,.45);
}
/* variante clara, para usar sobre fundos creme (ex.: esteira de depoimentos) */
.linha-tempo__ctrl--claro .seta{
  color:var(--roxo);
  background:rgba(126,50,130,.07);
  box-shadow:inset 0 0 0 1px rgba(126,50,130,.18);
}
.linha-tempo__ctrl--claro .linha-tempo__dica{color:var(--tinta-suave)}

/* =====================================================================
   04. LUTAS / CAUSAS
   ===================================================================== */
.lutas{
  position:relative;z-index:4;
  background:var(--creme);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  margin-top:calc(-1 * clamp(20px,3vw,44px));
  padding-block:clamp(64px,9vw,120px) clamp(56px,8vw,104px);
}
.causas{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:clamp(16px,2.2vw,26px);
}
.causa{
  position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(26px,3vw,34px);
  border-radius:var(--r-md);
  background:#fff;
  box-shadow:var(--sombra-sm);
  transition:transform var(--t-media),box-shadow var(--t-media);
}
.causa::after{
  content:'';position:absolute;left:0;right:0;top:0;height:4px;
  background:var(--g-quente);transform:scaleX(0);transform-origin:left;
  transition:transform var(--t-media);
}
.causa:hover{transform:translateY(-7px);box-shadow:var(--sombra)}
.causa:hover::after{transform:scaleX(1)}
.causa__topo{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.causa__icone{width:44px;height:44px;color:var(--roxo);transition:color var(--t-media),transform var(--t-media)}
.causa:hover .causa__icone{color:var(--vermelho);transform:scale(1.08) rotate(-4deg)}
.causa__idx{
  font-size:clamp(2.4rem,2rem + 1.6vw,3.4rem);font-weight:900;letter-spacing:-.06em;
  line-height:.8;color:var(--areia);transition:color var(--t-media);
}
.causa:hover .causa__idx{color:rgba(241,134,42,.3)}
.causa h3{
  font-size:clamp(1.28rem,1.1rem + .7vw,1.6rem);letter-spacing:-.035em;
  color:var(--roxo-esc);margin-bottom:12px;
}
.causa p{font-size:.94rem;line-height:1.62;color:var(--tinta-suave)}
.causa p strong{color:var(--roxo);font-weight:700}
.causa--1{background:linear-gradient(160deg,#fff,rgba(126,50,130,.05))}
.causa--2{background:linear-gradient(160deg,#fff,rgba(241,134,42,.07))}
.causa--3{background:linear-gradient(160deg,#fff,rgba(225,71,30,.06))}
.causa--4{background:linear-gradient(160deg,#fff,rgba(126,50,130,.05))}

.lutas__selo{
  text-align:center;margin-top:clamp(40px,6vw,64px);
  font-size:clamp(1.9rem,1.3rem + 2.8vw,3.6rem);line-height:.95;
}
.lutas__selo .pincel{
  line-height:1.15;
  background:var(--g-marca);-webkit-background-clip:text;background-clip:text;color:transparent;
}

/* =====================================================================
   05. CONQUISTAS
   ===================================================================== */
.conquistas{
  position:relative;z-index:5;
  background:var(--g-noite);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  margin-top:calc(-1 * clamp(20px,3vw,44px));
  padding-block:clamp(64px,9vw,116px) clamp(64px,9vw,110px);
  overflow:hidden;
}
.conquistas::before{
  content:'';position:absolute;bottom:-20%;left:-12%;
  width:55vw;height:55vw;border-radius:50%;
  background:radial-gradient(circle,rgba(126,50,130,.4),transparent 66%);
  pointer-events:none;
}
.conquistas .wrap{position:relative}

/* --- placar de números --- */
.placar{
  display:grid;grid-template-columns:repeat(6,1fr);
  gap:clamp(12px,1.6vw,20px);
  margin-bottom:clamp(48px,7vw,84px);
}
.placar__item{
  grid-column:span 2;
  display:flex;flex-direction:column;gap:10px;justify-content:center;
  padding:clamp(24px,3vw,34px);
  border-radius:var(--r-md);
  background:rgba(255,255,255,.055);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  backdrop-filter:blur(6px);
  transition:background var(--t-media),transform var(--t-media),box-shadow var(--t-media);
}
.placar__item:hover{
  background:rgba(255,255,255,.09);transform:translateY(-5px);
  box-shadow:inset 0 0 0 1px rgba(241,134,42,.45);
}
.placar__item strong{
  font-size:clamp(2.6rem,1.6rem + 4.2vw,5.2rem);font-weight:900;letter-spacing:-.055em;
  line-height:.85;font-variant-numeric:tabular-nums;
  background:linear-gradient(100deg,var(--laranja-claro),var(--vermelho));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.placar__item span{font-size:clamp(.86rem,.82rem + .2vw,.98rem);line-height:1.45;color:rgba(255,255,255,.8)}
.placar__item span b{color:#fff;font-weight:700}
.placar__item--grande{grid-column:span 3}
.placar__item--grande strong{font-size:clamp(3.2rem,2rem + 6vw,7rem)}
.placar__item--largo{grid-column:span 3}
.placar__item--orcamento{grid-column:span 6;flex-direction:row;align-items:center;gap:clamp(20px,4vw,50px);flex-wrap:wrap}
.orcam{
  display:flex;align-items:center;gap:clamp(12px,2vw,22px);flex-shrink:0;color:var(--laranja);
}
.orcam b{
  font-size:clamp(1.5rem,1.1rem + 2.2vw,3rem);font-weight:900;letter-spacing:-.05em;line-height:1;
  color:rgba(255,255,255,.55);
}
.orcam__fim{
  background:linear-gradient(100deg,var(--laranja-claro),var(--vermelho));
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
}
.placar__item--orcamento>span:last-child{max-width:34ch}

/* --- abas de mandatos --- */
.cargos{margin-bottom:clamp(48px,7vw,80px)}
.cargos__abas{
  display:flex;gap:10px;flex-wrap:wrap;
  margin-bottom:clamp(22px,3vw,32px);
}
.cargos__abas button{
  display:flex;flex-direction:column;gap:3px;
  padding:14px 22px;border-radius:16px;text-align:left;
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.13);
  color:rgba(255,255,255,.72);
  font-size:.94rem;font-weight:600;letter-spacing:-.015em;
  transition:background var(--t-media),color var(--t-media),box-shadow var(--t-media),transform var(--t-rapida);
}
.cargos__abas button em{
  font-style:normal;font-size:.7rem;font-weight:800;letter-spacing:.13em;
  color:var(--laranja);transition:color var(--t-media);
}
.cargos__abas button:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
.cargos__abas button.ativo{
  background:var(--g-quente);color:#fff;
  box-shadow:0 14px 30px -14px rgba(225,71,30,.8);
}
.cargos__abas button.ativo em{color:rgba(255,255,255,.85)}

.painel{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);
  gap:clamp(24px,4vw,52px);align-items:start;
  animation:surge .55s cubic-bezier(.16,1,.3,1);
}
.painel[hidden]{display:none}
@keyframes surge{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.painel__txt p{color:rgba(255,255,255,.78);margin-bottom:1.1em;font-size:.99rem}
.painel__txt p strong{color:#fff;font-weight:700}
.painel__foto{border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sombra-alta);position:sticky;top:calc(var(--topo-h) + 30px)}
.painel__foto img{width:100%;aspect-ratio:4/3.2;object-fit:cover}

.pilulas{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 8px}
.pilulas li{
  padding:8px 15px;border-radius:99px;
  font-size:.82rem;font-weight:600;letter-spacing:-.01em;
  background:rgba(241,134,42,.16);color:var(--laranja-claro);
  box-shadow:inset 0 0 0 1px rgba(241,134,42,.32);
}
.pilulas--roxo li{
  background:rgba(255,255,255,.07);color:rgba(255,255,255,.9);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);
}

.acordeao{margin-top:24px;display:grid;gap:9px}
.acordeao details{
  border-radius:16px;overflow:hidden;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.11);
  transition:background var(--t-media);
}
.acordeao details[open]{background:rgba(255,255,255,.08)}
.acordeao summary{
  display:flex;align-items:center;gap:12px;
  padding:15px 20px;cursor:pointer;list-style:none;
  font-size:.95rem;font-weight:700;letter-spacing:-.02em;color:#fff;
  transition:color var(--t-rapida);
}
.acordeao summary::-webkit-details-marker{display:none}
.acordeao summary::before{
  content:'';width:9px;height:9px;flex-shrink:0;
  border-right:2.4px solid var(--laranja);border-bottom:2.4px solid var(--laranja);
  transform:rotate(-45deg) translate(-1px,-1px);
  transition:transform var(--t-media);
}
.acordeao details[open] summary::before{transform:rotate(45deg) translate(-2px,-2px)}
.acordeao summary:hover{color:var(--laranja-claro)}
.acordeao ul,.acordeao>details>p{padding:0 20px 18px 41px}
.acordeao li{
  position:relative;padding-left:16px;margin-bottom:9px;
  font-size:.9rem;line-height:1.55;color:rgba(255,255,255,.74);
}
.acordeao li::before{
  content:'';position:absolute;left:0;top:.62em;
  width:6px;height:6px;border-radius:50%;background:var(--laranja);
}
.acordeao li b{color:#fff;font-weight:700}
.acordeao>details>p{font-size:.9rem;line-height:1.6;color:rgba(255,255,255,.74)}
.acordeao>details>p b{color:#fff}

/* --- reconhecimentos --- */
.reconhec{
  padding:clamp(30px,4vw,44px);border-radius:var(--r-md);
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.13);
}
.reconhec h3{
  font-size:clamp(1.4rem,1.1rem + 1.2vw,2rem);color:#fff;margin-bottom:8px;letter-spacing:-.035em;
}
.reconhec__olho{font-size:.96rem;color:rgba(255,255,255,.65);margin-bottom:26px}
.reconhec__grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:clamp(14px,2vw,22px)}
.premio{
  display:flex;gap:14px;align-items:flex-start;
  padding:20px;border-radius:16px;
  background:rgba(241,134,42,.08);
  box-shadow:inset 0 0 0 1px rgba(241,134,42,.24);
  transition:transform var(--t-media),background var(--t-media);
}
.premio:hover{transform:translateY(-4px);background:rgba(241,134,42,.14)}
.premio svg{color:var(--laranja);flex-shrink:0;margin-top:2px}
.premio p{font-size:.88rem;line-height:1.5;color:rgba(255,255,255,.78)}
.premio p b{color:#fff;font-weight:700}

.conquistas__fecho{
  margin-top:clamp(40px,6vw,64px);text-align:center;
  font-size:clamp(1.05rem,.95rem + .7vw,1.5rem);line-height:1.5;
  color:rgba(255,255,255,.72);max-width:46ch;margin-inline:auto;letter-spacing:-.02em;
}
.conquistas__fecho em{
  font-style:normal;font-weight:700;color:#fff;
  background:linear-gradient(to top,rgba(241,134,42,.36) 40%,transparent 40%);
}

/* =====================================================================
   06. VOZES / DEPOIMENTOS / GALERIA
   ===================================================================== */
.vozes{
  position:relative;z-index:6;
  background:var(--creme);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  margin-top:calc(-1 * clamp(20px,3vw,44px));
  padding-block:clamp(64px,9vw,116px) clamp(56px,8vw,100px);
  overflow:hidden;
}

.depo-esteira{
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x proximity;
  padding-block:6px clamp(20px,3vw,34px);
  cursor:grab;
}
.depo-esteira.arrastando{cursor:grabbing;scroll-snap-type:none}
.depo-esteira::-webkit-scrollbar{height:8px}
.depo-esteira::-webkit-scrollbar-track{background:transparent}
.depo-esteira::-webkit-scrollbar-thumb{background:var(--areia-esc);border-radius:99px}
.depo-esteira{scrollbar-width:thin;scrollbar-color:var(--areia-esc) transparent}

.depo-trilho{
  display:flex;gap:clamp(14px,2vw,22px);width:max-content;
  align-items:stretch;   /* cards da mesma altura — sobra de espaço fica dentro do
                            card (entre a citação e a assinatura), não em branco embaixo */
  padding-inline:max(var(--pad-lat),calc((100vw - var(--max))/2 + var(--pad-lat)));
}
.depo{
  scroll-snap-align:center;
  width:clamp(280px,32vw,400px);flex-shrink:0;
  display:flex;flex-direction:column;justify-content:space-between;gap:20px;
  padding:clamp(24px,3vw,32px);
  border-radius:var(--r-md);
  background:#fff;box-shadow:var(--sombra-sm);
  transition:transform var(--t-media),box-shadow var(--t-media);
}
.depo:hover{transform:translateY(-6px);box-shadow:var(--sombra)}
.depo--longo{width:clamp(300px,40vw,510px)}
.depo blockquote{
  position:relative;padding-top:34px;
  font-size:clamp(.95rem,.9rem + .28vw,1.06rem);line-height:1.58;
  color:var(--tinta);font-weight:500;letter-spacing:-.015em;
}
.depo blockquote::before{
  content:'\201C';position:absolute;top:-14px;left:-6px;
  font-family:Georgia,serif;font-size:5.4rem;line-height:1;
  color:var(--areia);
}
.depo--laranja blockquote::before{color:rgba(241,134,42,.28)}
.depo--roxo blockquote::before{color:rgba(126,50,130,.2)}
.depo figcaption{
  display:flex;flex-direction:column;gap:2px;
  padding-top:18px;border-top:2px solid var(--areia);
}
.depo figcaption strong{font-size:1rem;font-weight:800;letter-spacing:-.025em;color:var(--roxo)}
.depo figcaption span{font-size:.8rem;line-height:1.35;color:var(--tinta-suave)}
.depo--laranja{background:linear-gradient(155deg,#fff,rgba(241,134,42,.09))}
.depo--laranja figcaption strong{color:var(--vermelho)}
.depo--roxo{background:linear-gradient(155deg,#fff,rgba(126,50,130,.08))}

.galeria__tit{
  font-size:clamp(1.6rem,1.2rem + 1.8vw,2.5rem);letter-spacing:-.04em;color:var(--roxo-esc);
  margin-top:clamp(34px,5vw,58px);margin-bottom:clamp(20px,3vw,30px);
}
.galeria{
  display:grid;grid-template-columns:repeat(3,1fr);   /* 3 colunas × 2 linhas visíveis */
  gap:10px;padding-inline:var(--pad-lat);max-width:var(--max);margin-inline:auto;
}
.gal--extra[hidden]{display:none}
.galeria__acao{
  display:flex;justify-content:center;
  margin-top:clamp(18px,2.6vw,26px);
}
.btn--vazado-roxo{
  --bg:transparent;color:var(--roxo);
  box-shadow:inset 0 0 0 2px rgba(126,50,130,.3);
}
.btn--vazado-roxo::before{background:var(--roxo)}
.btn--vazado-roxo:hover{color:#fff;box-shadow:inset 0 0 0 2px var(--roxo)}
.btn--vazado-roxo svg{transition:transform var(--t-media)}
.btn--vazado-roxo[aria-expanded="true"] svg{transform:rotate(180deg)}
.gal{
  position:relative;overflow:hidden;border-radius:var(--r-sm);
  aspect-ratio:4/3.3;display:block;width:100%;
  box-shadow:var(--sombra-sm);
  transition:transform var(--t-media),box-shadow var(--t-media);
}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1),filter var(--t-media)}
.gal span{
  position:absolute;left:0;right:0;bottom:0;
  padding:32px 14px 13px;text-align:left;
  background:linear-gradient(to top,rgba(23,12,38,.94),transparent);
  color:#fff;font-size:.78rem;font-weight:600;line-height:1.3;
  transform:translateY(6px);opacity:0;transition:transform var(--t-media),opacity var(--t-media);
}
.gal:hover{transform:translateY(-5px);box-shadow:var(--sombra)}
.gal:hover img{transform:scale(1.08)}
.gal:hover span,.gal:focus-visible span{transform:none;opacity:1}
.gal::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(150deg,rgba(241,134,42,.5),rgba(126,50,130,.5));
  opacity:0;transition:opacity var(--t-media);mix-blend-mode:multiply;
}
.gal:hover::after{opacity:.28}

.video-cta{
  display:flex;align-items:center;gap:18px;
  margin-top:clamp(30px,4vw,48px);
  padding:clamp(18px,2.4vw,24px) clamp(22px,3vw,30px);
  border-radius:var(--r-md);
  background:linear-gradient(110deg,var(--roxo-esc),var(--roxo));
  color:#fff;box-shadow:var(--sombra);
  transition:transform var(--t-media),box-shadow var(--t-media);
}
.video-cta:hover{transform:translateY(-4px);box-shadow:var(--sombra-alta)}
.video-cta__play{
  width:52px;height:52px;flex-shrink:0;border-radius:50%;
  display:grid;place-items:center;
  background:var(--g-quente);color:#fff;
  box-shadow:0 0 0 0 rgba(241,134,42,.6);animation:pulso 2.8s infinite;
}
.video-cta__txt{display:flex;flex-direction:column;gap:2px}
.video-cta__txt strong{font-size:1.08rem;font-weight:800;letter-spacing:-.03em}
.video-cta__txt em{font-style:normal;font-size:.87rem;color:rgba(255,255,255,.7)}
.video-cta__seta{margin-left:auto;flex-shrink:0;color:var(--laranja);transition:transform var(--t-media)}
.video-cta:hover .video-cta__seta{transform:translate(3px,-3px)}

/* =====================================================================
   07. PARTICIPE
   ===================================================================== */
.participe{
  position:relative;z-index:7;
  background:var(--g-noite);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  margin-top:calc(-1 * clamp(20px,3vw,44px));
  padding-block:clamp(64px,9vw,116px) clamp(56px,8vw,96px);
  overflow:hidden;
}
.participe::before{
  content:'';position:absolute;top:-15%;left:50%;transform:translateX(-50%);
  width:75vw;height:60vw;border-radius:50%;
  background:radial-gradient(circle,rgba(241,134,42,.14),transparent 62%);
  pointer-events:none;
}
.participe .wrap{position:relative}

.participe__grade{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
  gap:clamp(16px,2.2vw,24px);align-items:start;
}
.cartao{
  padding:clamp(26px,3.2vw,36px);
  border-radius:var(--r-md);
  background:rgba(255,255,255,.055);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.13);
  backdrop-filter:blur(8px);
}
.cartao h3{
  font-size:clamp(1.3rem,1.1rem + .8vw,1.65rem);letter-spacing:-.035em;color:#fff;margin-bottom:10px;
}
.cartao>p{font-size:.94rem;line-height:1.55;color:rgba(255,255,255,.7);margin-bottom:22px}
.cartao--zap{
  background:linear-gradient(160deg,rgba(37,211,102,.16),rgba(255,255,255,.05));
  box-shadow:inset 0 0 0 1px rgba(37,211,102,.3);
  display:flex;flex-direction:column;align-items:flex-start;
}
.cartao__tel{
  margin-top:16px;font-size:1.14rem;font-weight:800;letter-spacing:-.02em;color:#fff;
}

/* --- formulários --- */
.form{display:grid;gap:13px}

/* --- checkbox "quero ser voluntário" --- */
.checkbox{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;border-radius:13px;cursor:pointer;user-select:none;
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18);
  transition:background var(--t-rapida),box-shadow var(--t-rapida);
}
.checkbox:hover{background:rgba(255,255,255,.08)}
.checkbox:has(input:checked){
  background:rgba(241,134,42,.1);
  box-shadow:inset 0 0 0 1.5px rgba(241,134,42,.5);
}
.checkbox input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.checkbox__caixa{
  flex-shrink:0;width:22px;height:22px;border-radius:7px;
  display:grid;place-items:center;color:transparent;
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35);
  transition:background var(--t-rapida),box-shadow var(--t-rapida),color var(--t-rapida);
}
.checkbox input:checked+.checkbox__caixa{background:var(--g-quente);box-shadow:none;color:#fff}
.checkbox input:focus-visible+.checkbox__caixa{outline:2px solid var(--laranja);outline-offset:2px}
.checkbox__texto{font-size:.94rem;font-weight:600;color:#fff;line-height:1.3}
.campo{position:relative}
.campo-duplo{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.campo input,.campo textarea,.campo select{
  width:100%;padding:19px 16px 8px;
  border-radius:13px;border:0;
  background:rgba(255,255,255,.07);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18);
  color:#fff;font-size:.95rem;
  transition:box-shadow var(--t-rapida),background var(--t-rapida);
  appearance:none;
}
.campo textarea{padding-top:24px;resize:vertical;min-height:96px;line-height:1.5}
.campo select{padding-top:19px;padding-bottom:8px;cursor:pointer}
.campo select option{background:var(--roxo-noite);color:#fff}
.campo input:focus,.campo textarea:focus,.campo select:focus{
  outline:none;background:rgba(255,255,255,.1);
  box-shadow:inset 0 0 0 2px var(--laranja);
}
.campo label{
  position:absolute;left:16px;top:16px;
  font-size:.95rem;color:rgba(255,255,255,.55);
  pointer-events:none;transform-origin:left top;
  transition:transform var(--t-rapida),color var(--t-rapida);
}
.campo input:focus+label,
.campo input:not(:placeholder-shown)+label,
.campo textarea:focus+label,
.campo textarea:not(:placeholder-shown)+label{
  transform:translateY(-9px) scale(.75);color:var(--laranja-claro);
}
.campo .label-select{
  transform:translateY(-9px) scale(.75);color:var(--laranja-claro);
  max-width:calc(100% - 32px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.campo select:invalid{color:rgba(255,255,255,.55)}
.campo select+.label-select{opacity:0}
.campo select:valid+.label-select,.campo select:focus+.label-select{opacity:1}
.campo input.erro,.campo textarea.erro,.campo select.erro{box-shadow:inset 0 0 0 2px var(--vermelho)}
.form .btn{margin-top:6px;width:100%}
.form .btn:disabled{opacity:.6;cursor:not-allowed;pointer-events:none;transform:none}
.form__aviso{
  font-size:.86rem;line-height:1.45;color:var(--laranja-claro);min-height:0;
}
.form__aviso.ok{color:#6ee7a0}
.form__aviso.ruim{color:#ff9d84}

/* --- redes --- */
.redes{margin-top:clamp(48px,7vw,76px);text-align:center}
.redes h3{
  font-size:clamp(1.4rem,1.1rem + 1.3vw,2.1rem);letter-spacing:-.04em;color:#fff;
  margin-bottom:clamp(20px,3vw,28px);
}
.redes__lista{display:flex;flex-wrap:wrap;justify-content:center;gap:11px}
.redes__lista a{
  display:flex;align-items:center;gap:9px;
  padding:12px 20px;border-radius:99px;
  background:rgba(255,255,255,.06);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
  color:rgba(255,255,255,.88);font-size:.9rem;font-weight:600;
  transition:transform var(--t-rapida),background var(--t-media),box-shadow var(--t-media),color var(--t-media);
}
.redes__lista a:hover{
  transform:translateY(-3px);background:var(--g-quente);color:#fff;
  box-shadow:0 14px 30px -14px rgba(225,71,30,.8);
}

/* =====================================================================
   RODAPÉ
   ===================================================================== */
.rodape{
  position:relative;z-index:8;
  background:var(--roxo-tinta);
  color:rgba(255,255,255,.72);
  padding-block:clamp(48px,7vw,80px) 26px;
}
.rodape__topo{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:clamp(28px,5vw,50px);
  padding-bottom:clamp(34px,5vw,50px);
  border-bottom:1px solid rgba(255,255,255,.12);
}
.rodape__marca img{width:clamp(180px,20vw,240px);height:auto}
.rodape__slogan{
  margin-top:16px;font-family:var(--pincel);
  font-size:clamp(1.6rem,1.2rem + 1.8vw,2.4rem);line-height:1;color:#fff;
}
.rodape__slogan .pincel{
  line-height:1.15;
  background:var(--g-quente);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.rodape__urna{
  display:flex;flex-direction:column;align-items:flex-start;gap:9px;
  padding:clamp(20px,2.6vw,26px) clamp(24px,3vw,34px);
  border-radius:var(--r-md);
  background:linear-gradient(140deg,rgba(126,50,130,.4),rgba(241,134,42,.14));
  box-shadow:inset 0 0 0 1px rgba(241,134,42,.34);
}
.rodape__urna>span{
  font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(255,255,255,.6);
}
.rodape__urna img{width:clamp(160px,20vw,220px);height:auto}
.rodape__urna em{font-style:normal;font-size:.84rem;font-weight:600;color:var(--laranja)}

.rodape__info{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));
  gap:clamp(24px,4vw,44px);
  padding-block:clamp(34px,5vw,48px);
}
.rodape__info h4{
  font-size:.74rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;
  color:var(--laranja);margin-bottom:13px;
}
.rodape__info p{font-size:.9rem;line-height:1.6;margin-bottom:5px}
.rodape__info p strong{color:#fff;font-weight:700}
.rodape__partidos{font-size:.8rem!important;line-height:1.55;color:rgba(255,255,255,.55)}
.rodape__info a{transition:color var(--t-rapida)}
.rodape__info a:hover{color:var(--laranja)}
.rodape__nav{display:grid;gap:7px}
.rodape__nav a{font-size:.9rem;transition:color var(--t-rapida),padding-left var(--t-rapida)}
.rodape__nav a:hover{color:var(--laranja);padding-left:5px}

.rodape__base{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;
  padding-top:24px;padding-right:clamp(0px,14vw,190px); /* folga para o botão flutuante */
  border-top:1px solid rgba(255,255,255,.12);
  font-size:.8rem;color:rgba(255,255,255,.5);
}
.topo-link{
  display:inline-flex;align-items:center;gap:7px;font-weight:600;
  transition:color var(--t-rapida),transform var(--t-rapida);
}
.topo-link:hover{color:var(--laranja);transform:translateY(-2px)}

/* =====================================================================
   BOTÃO FLUTUANTE + LIGHTBOX
   ===================================================================== */
.zap-flut{
  position:fixed;right:clamp(14px,2.5vw,28px);bottom:clamp(14px,2.5vw,28px);
  z-index:90;
  display:flex;align-items:center;gap:10px;
  padding:14px 20px 14px 16px;border-radius:99px;
  background:linear-gradient(100deg,#25D366,#12a54c);color:#fff;
  font-weight:700;font-size:.94rem;
  box-shadow:0 16px 34px -12px rgba(18,165,76,.75);
  transform:translateY(140%);opacity:0;
  transition:transform var(--t-lenta),opacity var(--t-media),box-shadow var(--t-media);
}
.zap-flut.aparece{transform:none;opacity:1}
.zap-flut:hover{box-shadow:0 20px 44px -12px rgba(18,165,76,.9);transform:translateY(-3px)}
@media (max-width:600px){
  .zap-flut span{display:none}
  .zap-flut{padding:15px;border-radius:50%}
}

.lightbox{
  position:fixed;inset:0;z-index:200;
  display:grid;place-items:center;gap:16px;align-content:center;
  padding:clamp(16px,4vw,50px);
  background:rgba(23,12,38,.96);
  backdrop-filter:blur(10px);
  animation:apagar .3s ease;
}
@keyframes apagar{from{opacity:0}to{opacity:1}}
.lightbox[hidden]{display:none}
.lightbox img{
  max-width:100%;max-height:82vh;object-fit:contain;
  border-radius:var(--r-sm);box-shadow:0 40px 90px rgba(0,0,0,.6);
}
.lightbox p{color:rgba(255,255,255,.8);font-size:.9rem;font-weight:600;text-align:center}
.lightbox__fechar{
  position:absolute;top:clamp(14px,3vw,28px);right:clamp(14px,3vw,28px);
  width:48px;height:48px;border-radius:50%;
  display:grid;place-items:center;color:#fff;
  background:rgba(255,255,255,.1);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);
  transition:background var(--t-rapida),transform var(--t-rapida);
}
.lightbox__fechar:hover{background:var(--vermelho);transform:rotate(90deg)}

/* =====================================================================
   ANIMAÇÕES DE ENTRADA
   ===================================================================== */
.revela{opacity:0;transform:translateY(28px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)}
.revela.dentro{opacity:1;transform:none}
.revela-1{transition-delay:.07s}
.revela-2{transition-delay:.14s}
.revela-3{transition-delay:.21s}
.revela-4{transition-delay:.28s}

.hero__titulo .linha>span{display:block;transform:translateY(105%);animation:sobe .95s cubic-bezier(.16,1,.3,1) forwards}
.hero__titulo .linha:nth-child(1)>span{animation-delay:.1s}
.hero__titulo .linha:nth-child(2)>span{animation-delay:.2s}
.hero__titulo .linha:nth-child(3)>span{animation-delay:.3s}
@keyframes sobe{to{transform:none}}

.hero__figura{opacity:0;animation:entraFoto 1.3s cubic-bezier(.16,1,.3,1) .25s forwards}
@keyframes entraFoto{from{opacity:0;transform:translateY(40px) scale(.97)}to{opacity:1;transform:none}}

/* =====================================================================
   RESPONSIVO
   ===================================================================== */
@media (max-width:1180px){
  .menu{gap:12px}
  .menu a{font-size:.88rem}
  .pin{max-width:150px;padding:10px 13px}
  .pin strong{font-size:1.15rem}
  .pin span{font-size:.68rem}
}

@media (max-width:1000px){
  :root{--topo-h:66px}
  .menu{
    position:fixed;inset:var(--topo-h) 0 auto 0;
    flex-direction:column;gap:0;margin:0;
    background:rgba(36,21,57,.98);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    padding:14px var(--pad-lat) 26px;
    box-shadow:0 24px 50px -20px rgba(0,0,0,.6);
    transform:translateY(-150%);
    transition:transform var(--t-media);
    max-height:calc(100svh - var(--topo-h));overflow-y:auto;
  }
  .menu.aberto{transform:none}
  .menu a{
    font-size:1.12rem;font-weight:600;padding:15px 0;color:#fff!important;
    border-bottom:1px solid rgba(255,255,255,.1);
  }
  .menu a::after{display:none}
  .topo.solido .menu a{color:#fff!important}
  .hamb{display:block}
  .topo__acoes{margin-left:auto}
  .btn--mini span{display:none}
  .btn--mini{padding:11px;border-radius:50%}

  .hero__int{grid-template-columns:1fr;align-items:center;gap:0}
  .hero__texto{
    text-align:center;padding-bottom:0;order:1;
    display:flex;flex-direction:column;align-items:center;
  }
  .hero__sub{max-width:44ch}
  .hero__ctas{justify-content:center}
  .hero__figura{order:2;max-width:min(440px,86vw);margin-top:clamp(16px,3vh,32px)}
  .hero__foto{max-height:min(56svh,540px)}
  .hero{min-height:auto;padding-bottom:0}
  .selo{left:auto;right:-3%;top:9%;padding:10px 15px}
  .pin--a{right:auto;left:-4%;top:16%}
  .pin--b{left:auto;right:-4%;bottom:20%}
  .anel{width:min(120%,470px)}

  .faixa-num__int{grid-template-columns:repeat(2,1fr)}

  .sobre__grade{grid-template-columns:1fr}
  .sobre__col-foto{
    position:static;grid-template-columns:1fr 1fr;gap:12px;
    margin-bottom:8px;
  }
  .foto-recorte--desloca{margin-left:0}
  .foto-recorte img,.foto-recorte--desloca img{aspect-ratio:1/1}

  .painel{grid-template-columns:1fr}
  .painel__foto{position:static;order:-1;max-height:340px}
  .painel__foto img{aspect-ratio:16/9}

  .placar{grid-template-columns:repeat(2,1fr)}
  .placar__item,.placar__item--grande,.placar__item--largo{grid-column:span 1}
  .placar__item--grande{grid-column:span 2}
  .placar__item--orcamento{grid-column:span 2}

  .cargos__abas button{flex:1 1 210px}
}

@media (max-width:680px){
  :root{--r-xl:28px}
  .causas{grid-template-columns:1fr}
  .hero__titulo{font-size:clamp(2.7rem,12.5vw,4.2rem)}
  .hero__titulo .linha:first-child{padding-bottom:.34em;margin-bottom:-.3em}
  .hero__titulo .linha:last-child{padding-bottom:.24em;margin-bottom:-.24em}
  .hero__marca-dagua{bottom:auto;top:24%}
  .hero__marca-dagua span{font-size:22vw}
  .selo{top:6%;right:-2%}
  .selo__label{font-size:.58rem}
  .pin{max-width:132px;padding:9px 12px;border-radius:13px}
  .pin strong{font-size:1rem}
  .pin span{font-size:.63rem;line-height:1.28}
  .pin--a{top:11%;left:-3%}
  .pin--b{bottom:24%;right:-3%}

  .faixa-num__int{grid-template-columns:1fr;gap:16px}
  .num{padding-left:13px}
  .num strong{font-size:2rem}

  .sobre__col-foto{grid-template-columns:1fr}
  .foto-recorte img,.foto-recorte--desloca img{aspect-ratio:4/3}

  .placar{grid-template-columns:1fr}
  .placar__item,.placar__item--grande,.placar__item--largo,.placar__item--orcamento{grid-column:span 1}
  .placar__item--orcamento{flex-direction:column;align-items:flex-start;gap:14px}

  .campo-duplo{grid-template-columns:1fr}
  .cargos__abas button{flex:1 1 100%}
  .marco{width:min(78vw,300px)}
  .galeria{grid-template-columns:repeat(2,1fr);gap:8px}
  .video-cta{flex-wrap:wrap}
  .video-cta__seta{margin-left:0}
  .rodape__topo{flex-direction:column;align-items:flex-start}
  .rodape__urna{width:100%}
}

@media (max-width:420px){
  .galeria{grid-template-columns:1fr}
  .pin--a,.pin--b{display:none}
}

/* =====================================================================
   PREFERÊNCIAS DE MOVIMENTO / IMPRESSÃO
   ===================================================================== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .revela{opacity:1;transform:none}
  .hero__titulo .linha>span{transform:none}
  .hero__figura{opacity:1}
  .anel{animation:none}
}

@media print{
  .topo,.zap-flut,.linha-tempo__ctrl,.lightbox{display:none!important}
  body{background:#fff;color:#000}
  .hero,.trajeto,.conquistas,.participe,.rodape{background:#fff!important;color:#000}
}
