/* =======================================================================
   Prof. Eduardo Gabriel  |  EduInApple  |  Partido Missão 14334
   Folha de estilo principal
   Ordem: tokens > reset > utilitarios > componentes > secoes > temas > media
   ======================================================================= */

/* ------------------------------ 1. TOKENS ------------------------------ */
:root{
  /* escala de fonte controlada pelo painel de acessibilidade */
  --fs-scale: 1;
  font-size: calc(100% * var(--fs-scale));

  /* marca */
  --amarelo:        #FFC61A;
  --amarelo-claro:  #FFDA6B;
  --amarelo-escuro: #C99000;
  --amarelo-fundo:  #4A3A05;

  /* tipografia */
  --ff-display: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;
  --ff-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --step--1: clamp(0.82rem, 0.80rem + 0.10vw, 0.88rem);
  --step-0:  clamp(1.00rem, 0.96rem + 0.20vw, 1.09rem);
  --step-1:  clamp(1.15rem, 1.08rem + 0.35vw, 1.35rem);
  --step-2:  clamp(1.40rem, 1.25rem + 0.75vw, 1.85rem);
  --step-3:  clamp(1.75rem, 1.45rem + 1.50vw, 2.60rem);
  --step-4:  clamp(2.20rem, 1.60rem + 3.00vw, 3.80rem);
  --step-5:  clamp(2.80rem, 1.60rem + 6.00vw, 6.00rem);

  /* espacamento */
  --sp-1: .25rem; --sp-2: .5rem;  --sp-3: .75rem; --sp-4: 1rem;
  --sp-5: 1.5rem; --sp-6: 2rem;   --sp-7: 3rem;   --sp-8: 4rem;
  --sp-9: 6rem;

  --wrap: 1180px;
  --radius-sm: 8px;
  --radius:    14px;
  --radius-lg: 22px;
  --radius-pill: 999px;

  --dur: .25s;
  --ease: cubic-bezier(.4,0,.2,1);

  --head-h: 66px;
}

/* ---- Tema escuro (padrao) ---- */
[data-theme="dark"]{
  --bg:            #0B0B0C;
  --bg-alt:        #131316;
  --surface:       #1A1A1E;
  --surface-2:     #232329;
  --border:        #34343C;
  --border-strong: #4A4A55;

  --txt:      #F5F5F6;   /* 17.6:1 sobre --bg */
  --txt-mute: #B7B7BE;   /*  8.4:1 sobre --bg */
  --txt-dim:  #9A9AA3;   /*  6.0:1 sobre --bg */

  --accent:        #FFC61A;   /* 11.9:1 sobre --bg */
  --accent-txt:    #0B0B0C;   /* texto sobre botao amarelo */
  --accent-soft:   rgba(255,198,26,.14);
  --accent-border: rgba(255,198,26,.38);

  --focus: #7FD4FF;
  --shadow: 0 18px 45px -18px rgba(0,0,0,.85);
  --glow: radial-gradient(60% 60% at 70% 30%, rgba(255,198,26,.22), transparent 70%);
}

/* ---- Tema claro ---- */
[data-theme="light"]{
  --bg:            #FFFFFF;
  --bg-alt:        #F5F5F3;
  --surface:       #FFFFFF;
  --surface-2:     #F0F0EE;
  --border:        #D8D8D4;
  --border-strong: #A9A9A3;

  --txt:      #16161A;   /* 17.4:1 sobre branco */
  --txt-mute: #4A4A52;   /*  8.9:1 sobre branco */
  --txt-dim:  #5E5E66;   /*  6.4:1 sobre branco */

  --accent:        #7A5600;   /* 6.6:1 sobre branco, para texto e links */
  --accent-txt:    #FFFFFF;
  --accent-soft:   rgba(122,86,0,.09);
  --accent-border: rgba(122,86,0,.32);

  --focus: #0B5FB8;
  --shadow: 0 16px 40px -20px rgba(0,0,0,.28);
  --glow: radial-gradient(55% 55% at 78% 22%, rgba(255,198,26,.28), transparent 72%);
}

/* ---- Alto contraste, escuro ---- */
[data-theme="dark"][data-contrast="high"]{
  --bg: #000000; --bg-alt: #000000; --surface: #000000; --surface-2: #0A0A0A;
  --border: #FFFFFF; --border-strong: #FFFFFF;
  --txt: #FFFFFF; --txt-mute: #FFFFFF; --txt-dim: #F2F2F2;
  --accent: #FFE24D; --accent-txt: #000000;
  --accent-soft: rgba(255,226,77,.20); --accent-border: #FFE24D;
  --focus: #FFFFFF;
  --glow: none; --shadow: none;
}
/* ---- Alto contraste, claro ---- */
[data-theme="light"][data-contrast="high"]{
  --bg: #FFFFFF; --bg-alt: #FFFFFF; --surface: #FFFFFF; --surface-2: #FFFFFF;
  --border: #000000; --border-strong: #000000;
  --txt: #000000; --txt-mute: #000000; --txt-dim: #1A1A1A;
  --accent: #4A3400; --accent-txt: #FFFFFF;
  --accent-soft: rgba(0,0,0,.07); --accent-border: #000000;
  --focus: #000000;
  --glow: none; --shadow: none;
}
[data-contrast="high"] .hero__glow,
[data-contrast="high"] .ticker__track{ opacity: 1; }
[data-contrast="high"] .card,
[data-contrast="high"] .link-card,
[data-contrast="high"] .btn{ border-width: 2px; }

/* ---- Reduzir animacao ---- */
[data-motion="reduced"] *,
[data-motion="reduced"] *::before,
[data-motion="reduced"] *::after{
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001ms !important;
  scroll-behavior: auto !important;
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
}

/* ------------------------------ 2. RESET ------------------------------- */
*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; scroll-padding-top: calc(var(--head-h) + 56px); -webkit-text-size-adjust: 100%; }
body{
  margin:0;
  background: var(--bg);
  color: var(--txt);
  font-family: var(--ff-body);
  font-size: var(--step-0);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
img,svg,picture,video{ max-width:100%; display:block; }
h1,h2,h3,h4{ font-family: var(--ff-display); line-height:1.05; margin:0 0 var(--sp-3); text-wrap: balance; letter-spacing:.005em; }
h1{ font-size: var(--step-4); }
h2{ font-size: var(--step-3); }
h3{ font-size: var(--step-1); }
p{ margin:0 0 var(--sp-4); text-wrap: pretty; }
ul,ol{ margin:0; padding:0; list-style:none; }
a{ color: var(--accent); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover{ text-decoration-color: currentColor; }
button{ font: inherit; color: inherit; }
code{ font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9em; }
strong{ font-weight: 700; }

/* foco visivel e consistente */
:where(a,button,input,textarea,select,[tabindex]):focus-visible{
  outline: 3px solid var(--focus);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}

/* ---------------------------- 3. UTILITARIOS --------------------------- */
.wrap{ width:100%; max-width: var(--wrap); margin-inline:auto; padding-inline: clamp(1rem, 4vw, 2rem); }
.sr-only{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip-link{
  position:absolute; left:var(--sp-4); top:-100px; z-index:200;
  background: var(--accent); color: var(--accent-txt);
  padding:.7rem 1.1rem; border-radius: var(--radius-sm); font-weight:700;
  text-decoration:none; transition: top var(--dur) var(--ease);
}
.skip-link:focus{ top: var(--sp-4); }

.ico{ width:1.15em; height:1.15em; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

.kicker{
  font-family: var(--ff-body); font-size: var(--step--1); font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color: var(--accent);
  margin:0 0 var(--sp-3);
}
.eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size: var(--step--1); font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color: var(--txt-mute); background: var(--accent-soft);
  border:1px solid var(--accent-border); border-radius: var(--radius-pill);
  padding:.4rem .9rem; margin:0 0 var(--sp-5);
}
.eyebrow .dot{ width:.5rem; height:.5rem; border-radius:50%; background: var(--accent); flex:0 0 auto; }

.link-arrow{ display:inline-flex; align-items:center; gap:.45rem; font-weight:700; text-decoration:none; }
.link-arrow:hover{ text-decoration: underline; }
.link-arrow .ico{ transition: transform var(--dur) var(--ease); }
.link-arrow:hover .ico{ transform: translateX(4px); }

/* ---------------------------- 4. COMPONENTES --------------------------- */

/* --- Botoes --- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family: var(--ff-body); font-weight:700; font-size: var(--step-0);
  line-height:1.2; text-align:center; text-decoration:none; cursor:pointer;
  padding:.8rem 1.35rem; min-height:44px;
  border-radius: var(--radius-pill); border:2px solid transparent;
  transition: transform var(--dur) var(--ease), background-color var(--dur) var(--ease),
              color var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.btn:hover{ transform: translateY(-2px); }
.btn:active{ transform: translateY(0); }
.btn--primary{ background: var(--accent); color: var(--accent-txt); border-color: var(--accent); }
.btn--primary:hover{ background: var(--amarelo-claro); border-color: var(--amarelo-claro); color:#0B0B0C; }
[data-theme="light"] .btn--primary:hover{ background:#5C4100; border-color:#5C4100; color:#fff; }
.btn--ghost{ background: transparent; color: var(--txt); border-color: var(--border-strong); }
.btn--ghost:hover{ border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.btn--sm{ padding:.5rem 1rem; font-size: var(--step--1); min-height:38px; }
.btn--lg{ padding:1rem 1.7rem; font-size: var(--step-1); min-height:52px; }
.btn--block{ width:100%; }

/* --- Barra de acessibilidade --- */
.a11y-bar{
  background: var(--bg-alt);
  border-bottom:1px solid var(--border);
  position: relative; z-index: 60;
}
.a11y-bar__inner{ display:flex; align-items:center; justify-content:flex-end; gap:var(--sp-4); flex-wrap:wrap; padding-block:.45rem; }
.a11y-bar__label{
  margin:0; font-size: var(--step--1); font-weight:600; color: var(--txt-dim);
  letter-spacing:.08em; text-transform:uppercase;
}
.a11y-group{ display:flex; align-items:center; gap:.35rem; flex-wrap:wrap; }
.a11y-btn{
  display:inline-flex; align-items:center; gap:.4rem;
  min-height:36px; min-width:36px; padding:.3rem .6rem;
  background: var(--surface); color: var(--txt);
  border:1px solid var(--border); border-radius: var(--radius-sm);
  font-size: var(--step--1); font-weight:600; cursor:pointer;
  transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.a11y-btn:hover{ border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.a11y-btn[aria-pressed="true"]{ background: var(--accent); border-color: var(--accent); color: var(--accent-txt); }
.a11y-btn .ico{ width:1em; height:1em; }
.a11y-sep{ width:1px; height:22px; background: var(--border); margin-inline:.25rem; }
@media (max-width: 700px){
  .a11y-bar__inner{ justify-content:center; gap:.4rem; padding-block:.35rem; }
  .a11y-bar__label{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .a11y-btn__txt{ display:none; }
  .a11y-btn--wide{ padding:.3rem .55rem; }
}

/* --- Cabecalho --- */
.site-head{
  position: sticky; top:0; z-index:50;
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(12px);
  border-bottom:1px solid var(--border);
}
@supports not (background: color-mix(in srgb, red 50%, blue)){
  .site-head{ background: var(--bg); }
}
[data-contrast="high"] .site-head{ background: var(--bg); backdrop-filter:none; }
.site-head__inner{ display:flex; align-items:center; justify-content:space-between; gap: clamp(.75rem, 2vw, 1.5rem); min-height: var(--head-h); }

.brand{ display:inline-flex; align-items:center; gap:.6rem; text-decoration:none; color: var(--txt); flex:0 0 auto; }
.brand__mark{
  font-family: var(--ff-display); font-weight:800; font-size:.95rem; letter-spacing:.02em;
  background: var(--accent); color: var(--accent-txt);
  padding:.3rem .5rem; border-radius:8px; line-height:1;
}
.brand__txt{ display:flex; flex-direction:column; line-height:1.15; }
.brand__txt strong{ font-family: var(--ff-display); font-size: var(--step-1); font-weight:700; }
.brand__txt small{ font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color: var(--txt-dim); }
.site-head .brand__txt strong,
.site-head .brand__txt small{ white-space:nowrap; }

.nav__list{ display:flex; align-items:center; gap: clamp(.7rem, 1.5vw, 1.7rem); }
@media (min-width: 1081px) and (max-width: 1260px){
  .nav__list{ gap:.85rem; }
  .nav__list a{ font-size:.88rem; }
  .nav__list .nav__cta a.btn-apoiar{ padding:.55rem .95rem; font-size:.88rem; }
  .nav__cta{ padding-left:.85rem; }
}
/* rótulo curto em telas apertadas, completo nas largas */
.btn-apoiar__curto{ display:none; }
@media (min-width: 1081px) and (max-width: 1260px){
  .btn-apoiar__full{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .btn-apoiar__curto{ display:inline; }
}
.nav__list a{
  position:relative;
  color: var(--txt-mute); text-decoration:none; font-weight:600; font-size:.95rem;
  padding:.45rem .1rem; white-space:nowrap;
  transition: color var(--dur) var(--ease);
}
/* sublinhado animado */
.nav__list li:not(.nav__cta) a::after{
  content:""; position:absolute; left:0; right:0; bottom:.05rem; height:2px;
  background: var(--accent); border-radius:2px;
  transform: scaleX(0); transform-origin:left;
  transition: transform var(--dur) var(--ease);
}
.nav__list li:not(.nav__cta) a:hover,
.nav__list li:not(.nav__cta) a[aria-current="true"]{ color: var(--txt); }
.nav__list li:not(.nav__cta) a:hover::after,
.nav__list li:not(.nav__cta) a[aria-current="true"]::after{ transform: scaleX(1); }
.nav__list li:not(.nav__cta) a[aria-current="true"]{ color: var(--accent); }

/* separador antes do CTA */
.nav__cta{ position:relative; padding-left: clamp(1rem, 2vw, 1.9rem); }
.nav__cta::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:1px; height:24px; background: var(--border);
}

/* botao Apoiar em destaque */
.nav__list .nav__cta a.btn-apoiar{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.62rem 1.15rem; min-height:42px;
  font-family: var(--ff-body); font-weight:700; font-size:.95rem; line-height:1;
  color: var(--accent-txt); background: var(--accent);
  border:2px solid var(--accent); border-radius: var(--radius-pill);
  box-shadow: 0 0 0 0 var(--accent-border);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease),
              background-color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.nav__list .nav__cta a.btn-apoiar::after{ display:none; }
.nav__list .nav__cta a.btn-apoiar .ico{ width:1.05em; height:1.05em; }
.nav__list .nav__cta a.btn-apoiar:hover{
  transform: translateY(-2px);
  background: var(--amarelo-claro); border-color: var(--amarelo-claro); color:#0B0B0C;
  box-shadow: 0 8px 22px -8px var(--accent-border), 0 0 0 5px var(--accent-soft);
}
[data-theme="light"] .nav__list .nav__cta a.btn-apoiar:hover{ background:#5C4100; border-color:#5C4100; color:#fff; }
/* pulso discreto para chamar o olho */
.nav__list .nav__cta a.btn-apoiar .pulse{
  width:.5rem; height:.5rem; border-radius:50%; flex:0 0 auto;
  background: currentColor; opacity:.85;
  animation: pulse 2.4s var(--ease) infinite;
}
@keyframes pulse{
  0%,100%{ transform: scale(1); opacity:.85; }
  50%{ transform: scale(1.5); opacity:.35; }
}

.nav-toggle{
  display:none; align-items:center; justify-content:center;
  width:44px; height:44px; background: var(--surface);
  border:1px solid var(--border); border-radius: var(--radius-sm); cursor:pointer;
}
.nav-toggle__bars{ display:grid; gap:5px; }
.nav-toggle__bars span{ display:block; width:20px; height:2px; background: var(--txt); border-radius:2px; transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1080px){
  .nav-toggle{ display:inline-flex; }
  .nav{
    position:absolute; left:0; right:0; top:100%;
    background: var(--bg);
    border-bottom:1px solid var(--border);
    box-shadow: var(--shadow);
    max-height:0; overflow:hidden; visibility:hidden;
    transition: max-height .3s var(--ease), visibility .3s var(--ease);
  }
  .nav.is-open{ max-height: min(86vh, 700px); overflow-y:auto; visibility:visible; }
  .nav__list{
    flex-direction:column; align-items:stretch; gap:0;
    padding: var(--sp-3) clamp(1rem,4vw,2rem) var(--sp-5);
  }
  .nav__list li:not(.nav__cta){ border-bottom:1px solid var(--border); }
  .nav__list li:not(.nav__cta) a{
    display:flex; align-items:center; justify-content:space-between;
    padding:1rem .25rem; font-size: var(--step-1); font-weight:700;
    font-family: var(--ff-display); letter-spacing:.01em;
  }
  .nav__list li:not(.nav__cta) a::after{ display:none; }
  .nav__list li:not(.nav__cta) a::before{
    content:"›"; order:2; font-size:1.4em; line-height:1; color: var(--txt-dim);
    transition: transform var(--dur) var(--ease), color var(--dur) var(--ease);
  }
  .nav__list li:not(.nav__cta) a:hover::before{ color: var(--accent); transform: translateX(3px); }
  .nav__list li:not(.nav__cta) a[aria-current="true"]{
    color: var(--accent); padding-left:.7rem;
    border-left:3px solid var(--accent); margin-left:-.7rem;
  }
  .nav__cta{ padding-left:0; padding-top: var(--sp-4); }
  .nav__cta::before{ display:none; }
  .nav__list .nav__cta a.btn-apoiar{
    display:flex; width:100%; justify-content:center;
    padding:.95rem 1.2rem; min-height:52px; font-size: var(--step-1);
  }
  /* aviso curto sob o botao */
  .nav__note{
    margin: var(--sp-3) 0 0; text-align:center;
    font-size:.8rem; color: var(--txt-dim);
  }
}
@media (min-width: 1081px){ .nav__note{ display:none; } }

/* --- Cartoes --- */
.cards{ display:grid; gap: var(--sp-4); grid-template-columns: repeat(auto-fit, minmax(265px, 1fr)); }
.card{
  display:flex; flex-direction:column; height:100%; background: var(--surface);
  border:1px solid var(--border); border-radius: var(--radius-lg);
  padding: var(--sp-5);
  transition: transform var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.card:hover{ transform: translateY(-4px); border-color: var(--accent-border); box-shadow: var(--shadow); }
.card__num{
  display:block; margin:0 0 .45rem;
  font-family: var(--ff-display); font-size: var(--step-2); font-weight:800;
  color: var(--accent); line-height:1; letter-spacing:.02em;
}
.card__num::after{
  content:""; display:block; width:2.2rem; height:3px; margin-top:.45rem;
  background: var(--accent); border-radius:2px;
}
.card__title{ margin:0 0 var(--sp-2); font-size: var(--step-1); }
.card p{ margin:0; color: var(--txt-mute); font-size:.97rem; }

/* --- Cartoes de link --- */
.links{ display:grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fit, minmax(295px, 1fr)); }
.link-card{
  display:flex; align-items:center; gap: var(--sp-4); height:100%;
  padding: var(--sp-4);
  background: var(--surface); color: var(--txt); text-decoration:none;
  border:1px solid var(--border); border-radius: var(--radius);
  min-height:74px;
  transition: transform var(--dur) var(--ease), border-color var(--dur) var(--ease),
              background-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.link-card:hover{ transform: translateY(-3px); border-color: var(--accent); background: var(--accent-soft); box-shadow: var(--shadow); }
.link-card__ico{
  display:grid; place-items:center; width:46px; height:46px; flex:0 0 auto;
  border-radius:12px; background: var(--accent-soft); color: var(--accent);
  border:1px solid var(--accent-border);
}
.link-card__ico svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.link-card__txt{ display:flex; flex-direction:column; min-width:0; flex:1 1 auto; }
.link-card__txt strong{ font-size: var(--step-0); }
.link-card__txt small{ color: var(--txt-dim); font-size:.85rem; overflow-wrap:anywhere; }
.link-card__go{ color: var(--txt-dim); flex:0 0 auto; }
.link-card__go svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition: transform var(--dur) var(--ease); }
.link-card:hover .link-card__go{ color: var(--accent); }
.link-card:hover .link-card__go svg{ transform: translateX(4px); }
.link-card--hi{ border-color: var(--accent-border); background: var(--accent-soft); }
.link-card--wa .link-card__ico{ background: rgba(37,211,102,.14); border-color: rgba(37,211,102,.45); color:#25D366; }
[data-theme="light"] .link-card--wa .link-card__ico{ color:#0F7A38; }
[data-contrast="high"] .link-card--wa .link-card__ico{ background: var(--accent-soft); border-color: var(--border); color: var(--txt); }

/* --- Formulario --- */
.form{ display:grid; gap: var(--sp-4); }
.field{ display:grid; gap:.4rem; }
.field label{ font-weight:600; font-size:.95rem; }
.field .opt{ color: var(--txt-dim); font-weight:400; }
.field input,.field textarea{
  width:100%; padding:.8rem .95rem; min-height:46px;
  font: inherit; color: var(--txt);
  background: var(--surface); border:1px solid var(--border-strong); border-radius: var(--radius-sm);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.field textarea{ resize: vertical; }
.field input:hover,.field textarea:hover{ border-color: var(--accent); }
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{ border-color:#FF6B6B; }
[data-theme="light"] .field input[aria-invalid="true"],
[data-theme="light"] .field textarea[aria-invalid="true"]{ border-color:#B3261E; }
.field__err{ margin:0; font-size:.85rem; font-weight:600; color:#FF9A9A; }
[data-theme="light"] .field__err{ color:#96150F; }
[data-contrast="high"] .field__err{ color: var(--txt); text-decoration: underline; }
.form__note{ margin:0; font-size:.85rem; color: var(--txt-dim); }

/* --- Voltar ao topo --- */
.to-top{
  position: fixed; right: clamp(.75rem,3vw,1.5rem); bottom: clamp(.75rem,3vw,1.5rem);
  z-index:40; display:grid; place-items:center;
  width:48px; height:48px; border-radius:50%;
  background: var(--accent); color: var(--accent-txt);
  border:2px solid var(--accent); box-shadow: var(--shadow);
  opacity:0; visibility:hidden; transform: translateY(10px);
  transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease), visibility var(--dur);
}
.to-top.is-visible{ opacity:1; visibility:visible; transform:none; }
.to-top .ico{ width:22px; height:22px; }

/* ------------------------------ 5. SECOES ------------------------------ */
.sec{ padding-block: clamp(3rem, 8vw, var(--sp-9)); }
.sec--alt{ background: var(--bg-alt); }
.sec__head{ margin-bottom: var(--sp-6); }
.sec__head--center{ text-align:center; max-width: 62ch; margin-inline:auto; }
.sec__sub{ color: var(--txt-mute); font-size: var(--step-1); margin-bottom:0; }
.sec__grid{ display:grid; gap: var(--sp-6); align-items:start; }
@media (min-width: 900px){
  .sec__grid{ grid-template-columns: 1fr 1.15fr; gap: var(--sp-8); }
}
.prose p{ color: var(--txt-mute); }
.prose strong{ color: var(--txt); }
.prose__cta{ margin-top: var(--sp-5); }

/* --- Hero --- */
.hero{ position:relative; overflow:hidden; padding-block: clamp(2.5rem, 7vw, 5rem) clamp(2.5rem, 7vw, 4.5rem); }
.hero__glow{ position:absolute; inset:-20% -10% auto -10%; height:130%; background: var(--glow); pointer-events:none; }
.hero__inner{ position:relative; display:grid; gap: var(--sp-6); align-items:center; }
@media (min-width: 900px){
  .hero__inner{ grid-template-columns: 1.1fr .9fr; gap: var(--sp-8); }
}
.hero__title{
  font-size: var(--step-5); font-weight:800; letter-spacing:-.01em;
  margin:0 0 var(--sp-2); line-height:.95;
}
.hero__title-1{ color: var(--txt); }
.hero__title-2{ color: var(--accent); }
.hero__name{
  font-family: var(--ff-display); font-size: var(--step-2); font-weight:700;
  text-transform:uppercase; letter-spacing:.04em; margin:0 0 var(--sp-3); color: var(--txt);
}
.hero__tag{
  display:inline-block; margin:0 0 var(--sp-5);
  font-family: var(--ff-display); font-size: var(--step-1); font-weight:700;
  text-transform:uppercase; letter-spacing:.07em;
  background: var(--accent); color: var(--accent-txt);
  padding:.3rem .9rem; border-radius:6px; transform: rotate(-1.2deg);
}
.hero__lead{ color: var(--txt-mute); font-size: var(--step-1); max-width: 52ch; }
.hero__lead strong{ color: var(--txt); }
.hero__actions{ display:flex; flex-wrap:wrap; gap: var(--sp-3); margin-bottom: var(--sp-6); }
@media (max-width: 480px){ .hero__actions .btn{ width:100%; } }

.pillars{ display:grid; gap: var(--sp-3); }
@media (min-width: 560px){ .pillars{ grid-template-columns: repeat(3,1fr); } }
.pillars li{ display:flex; align-items:center; gap:.7rem; }
.pillars__ico{
  display:grid; place-items:center; width:40px; height:40px; flex:0 0 auto;
  border-radius:50%; background: var(--accent-soft); border:1px solid var(--accent-border); color: var(--accent);
}
.pillars__ico svg{ width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.pillars__txt{ font-size:.95rem; color: var(--txt-mute); line-height:1.3; }
.pillars__txt strong{ color: var(--txt); display:block; }

/* --- Foto do hero --- */
.hero__media{ margin:0; }
.hero__photo-wrap{
  position:relative; max-width:460px; margin-inline:auto;
  border-radius: var(--radius-lg); overflow:hidden;
  border:2px solid var(--accent-border);
  box-shadow: var(--shadow), 0 0 0 8px var(--accent-soft);
}
.hero__photo{ width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; }
.numero-badge{
  position:absolute; left:0; right:0; bottom:0; margin:0;
  display:flex; align-items:baseline; justify-content:center; gap:.6rem;
  padding:.55rem .9rem;
  background: var(--accent); color: var(--accent-txt);
}
.numero-badge__label{
  font-size: var(--step--1); font-weight:700; letter-spacing:.12em; text-transform:uppercase;
}
.numero-badge__num{
  font-family: var(--ff-display); font-size: var(--step-3); font-weight:800; letter-spacing:.02em; line-height:1;
}

/* --- Faixa rolante --- */
.ticker{ overflow:hidden; background: var(--accent); color: var(--accent-txt); padding-block:.6rem; border-block:1px solid var(--accent); }
.ticker__track{
  display:flex; align-items:center; gap: var(--sp-4); width:max-content;
  font-family: var(--ff-display); font-size: var(--step-1); font-weight:700;
  text-transform:uppercase; letter-spacing:.1em;
  animation: ticker 26s linear infinite;
}
@keyframes ticker{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }

/* --- Numero grande --- */
.numero{ background: var(--bg); padding-block: clamp(2.5rem, 6vw, 4.5rem); border-bottom:1px solid var(--border); }
.numero__inner{ display:grid; gap: var(--sp-5); align-items:center; }
@media (min-width: 900px){ .numero__inner{ grid-template-columns: 1fr 1.2fr; gap: var(--sp-7); } }
.numero__title{ font-size: var(--step-3); margin-bottom: var(--sp-2); }
.numero__sub{ color: var(--txt-mute); margin:0; }
.numero__big{
  margin:0; text-align:center;
  font-family: var(--ff-display); font-weight:800; line-height:.85;
  font-size: clamp(4.5rem, 20vw, 12rem);
  letter-spacing:.01em;
  color: var(--accent);
  text-shadow: 0 0 40px rgba(255,198,26,.28);
}
[data-theme="light"] .numero__big{ color: var(--txt); text-shadow:none; -webkit-text-stroke: 2px var(--amarelo-escuro); }
[data-contrast="high"] .numero__big{ text-shadow:none; -webkit-text-stroke:0; color: var(--accent); }
[data-theme="light"][data-contrast="high"] .numero__big{ color: var(--txt); }

/* --- Plano de governo --- */
.plano__grid{ display:grid; gap: var(--sp-6); align-items:center; }
@media (min-width: 900px){ .plano__grid{ grid-template-columns: 1.2fr .8fr; gap: var(--sp-8); } }
.plano__copy p{ color: var(--txt-mute); }
.plano__copy strong{ color: var(--txt); }
.steps{ counter-reset: st; display:grid; gap: var(--sp-4); margin-block: var(--sp-5); }
.steps li{ counter-increment: st; position:relative; padding-left:3rem; }
.steps li::before{
  content: counter(st); position:absolute; left:0; top:0;
  display:grid; place-items:center; width:2.1rem; height:2.1rem;
  border-radius:50%; background: var(--accent); color: var(--accent-txt);
  font-family: var(--ff-display); font-weight:800; font-size:1.05rem;
}
.steps li strong{ display:block; font-family: var(--ff-display); font-size: var(--step-1); }
.steps li span{ color: var(--txt-mute); font-size:.95rem; }
.plano__actions{ display:flex; flex-wrap:wrap; gap: var(--sp-3); }
@media (max-width: 480px){ .plano__actions .btn{ width:100%; } }

.book{ display:grid; place-items:center; }
.book__cover{
  position:relative; width:min(300px, 80vw); aspect-ratio: 3/4.2;
  background: linear-gradient(160deg, var(--amarelo) 0%, var(--amarelo-escuro) 100%);
  color:#0B0B0C; border-radius: 6px var(--radius) var(--radius) 6px;
  border-left: 10px solid rgba(0,0,0,.35);
  box-shadow: var(--shadow);
  padding: var(--sp-6) var(--sp-5);
  display:flex; flex-direction:column; justify-content:center;
  transform: rotate(-2.5deg);
  transition: transform var(--dur) var(--ease);
}
.book__cover:hover{ transform: rotate(0deg) scale(1.02); }
[data-contrast="high"] .book__cover{ background: var(--accent); color: var(--accent-txt); border:2px solid var(--border); border-left-width:10px; }
[data-contrast="high"] .book__num{ color: var(--accent-txt); }
.book__kicker{ margin:0 0 var(--sp-3); font-size:.78rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.book__title{ margin:0 0 var(--sp-3); font-family: var(--ff-display); font-size: clamp(2rem,7vw,2.9rem); font-weight:800; line-height:.92; }
.book__sub{ margin:0; font-size:.85rem; font-weight:600; }
.book__num{
  position:absolute; right: var(--sp-4); bottom: var(--sp-4);
  font-family: var(--ff-display); font-size:2.6rem; font-weight:800; line-height:1;
  color: rgba(0,0,0,.55);
}

/* --- Apoie --- */
.apoie__inner{ text-align:center; }
.apoie__actions{ display:flex; flex-wrap:wrap; justify-content:center; gap: var(--sp-3); margin-top: var(--sp-6); }
@media (max-width: 560px){ .apoie__actions .btn{ width:100%; } }
.apoie__note{ margin: var(--sp-5) auto 0; max-width:54ch; font-size:.88rem; color: var(--txt-dim); }

/* --- Contato --- */
.contato__grid{ display:grid; gap: var(--sp-6); align-items:start; }
@media (min-width: 900px){ .contato__grid{ grid-template-columns: 1fr 1fr; gap: var(--sp-8); } }

/* --- Rodape --- */
.site-foot{ background: var(--bg-alt); border-top:1px solid var(--border); padding-block: var(--sp-7) var(--sp-6); }
.site-foot__inner{ display:grid; gap: var(--sp-6); }
@media (min-width: 800px){
  .site-foot__inner{ grid-template-columns: 1.2fr 1fr auto; align-items:start; }
  .site-foot__legal{ grid-column: 1 / -1; }
}
.site-foot .brand__txt strong{ font-size: var(--step-2); }
.site-foot__tag{ margin: var(--sp-3) 0 0; font-family: var(--ff-display); font-size: var(--step-1); color: var(--accent); text-transform:uppercase; letter-spacing:.06em; overflow-wrap:break-word; }
.site-foot .brand__txt small{ letter-spacing:.1em; overflow-wrap:break-word; }
.site-foot__nav ul{ display:grid; gap:.55rem; }
.site-foot__nav a{ color: var(--txt-mute); text-decoration:none; font-weight:600; font-size:.95rem; }
.site-foot__nav a:hover{ color: var(--accent); text-decoration: underline; }
.site-foot__social{ display:flex; gap:.6rem; flex-wrap:wrap; }
.site-foot__social a{
  display:grid; place-items:center; width:44px; height:44px;
  border-radius:50%; background: var(--surface); color: var(--txt);
  border:1px solid var(--border); text-decoration:none;
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.site-foot__social a:hover{ background: var(--accent); color: var(--accent-txt); border-color: var(--accent); }
.site-foot__social .ico{ width:21px; height:21px; }
.site-foot__legal{ border-top:1px solid var(--border); padding-top: var(--sp-5); }
.site-foot__legal p{ margin:0 0 .4rem; font-size:.85rem; color: var(--txt-dim); max-width:70ch; }

/* --------------------------- 6. IMPRESSAO ------------------------------ */
@media print{
  .a11y-bar,.nav,.nav-toggle,.to-top,.hero__glow,.ticker{ display:none !important; }
  body{ background:#fff; color:#000; }
  .btn{ border:1px solid #000; }
}

/* =======================================================================
   7. ADICIONAIS  |  preloader, cargo no hero, vídeos e página bio
   ======================================================================= */

/* --- Preloader --- */
.preloader{
  position:fixed; inset:0; z-index:300;
  display:grid; place-items:center;
  background: var(--bg);
  transition: opacity .45s var(--ease), visibility .45s var(--ease);
}
html:not(.is-loading) .preloader{ opacity:0; visibility:hidden; pointer-events:none; }
html.is-loading{ overflow:hidden; }
.preloader__inner{ display:grid; justify-items:center; gap: var(--sp-5); padding: var(--sp-5); }
.preloader__logo{
  margin:0; font-family: var(--ff-display); font-weight:800;
  font-size: clamp(2rem, 9vw, 3.4rem); line-height:1; letter-spacing:-.01em;
  color: var(--txt);
}
.preloader__logo-hi{ color: var(--accent); }
.preloader__ring{
  position:relative; display:grid; place-items:center;
  width:118px; height:118px; border-radius:50%;
  border:3px solid var(--border);
}
.preloader__ring::before{
  content:""; position:absolute; inset:-3px; border-radius:50%;
  border:3px solid transparent; border-top-color: var(--accent); border-right-color: var(--accent);
  animation: spin 1s linear infinite;
}
@keyframes spin{ to{ transform: rotate(360deg); } }
.preloader__num{
  font-family: var(--ff-display); font-weight:800; font-size:1.9rem;
  color: var(--accent); line-height:1;
}
.preloader__bar{
  margin:0; width:min(220px, 60vw); height:5px;
  background: var(--surface-2); border-radius: var(--radius-pill); overflow:hidden;
}
.preloader__bar span{
  display:block; width:40%; height:100%;
  background: var(--accent); border-radius: var(--radius-pill);
  animation: slide 1.25s var(--ease) infinite;
}
@keyframes slide{
  0%{ transform: translateX(-110%); }
  100%{ transform: translateX(320%); }
}
/* sem animação: mostra estado estático e sai rápido */
[data-motion="reduced"] .preloader__ring::before{ animation:none; border-color: var(--accent); }
[data-motion="reduced"] .preloader__bar span{ animation:none; width:100%; }
@media (prefers-reduced-motion: reduce){
  .preloader__ring::before{ animation:none; border-color: var(--accent); }
  .preloader__bar span{ animation:none; width:100%; }
}
[data-contrast="high"] .preloader__ring{ border-color: var(--border); }

/* --- Cargo no hero --- */
.hero__role{
  margin:0 0 var(--sp-4);
  display:inline-flex; align-items:center; gap:.5rem;
  font-size: var(--step--1); font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color: var(--txt-mute);
}
.hero__role::before{
  content:""; width:1.6rem; height:2px; background: var(--accent); border-radius:2px;
}

/* --- Seção de vídeos --- */
.videos__grid{
  display:grid; gap: var(--sp-4); justify-content:center;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 300px));
}
.video-card{
  position:relative; display:flex; flex-direction:column;
  background: var(--surface); border:1px solid var(--border);
  border-radius: var(--radius); overflow:hidden;
}
.video-card__frame{
  position:relative; width:100%; aspect-ratio: 9/16; background: var(--surface-2);
}
.video-card__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-card__play{
  position:absolute; inset:0; display:grid; place-items:center; gap:.6rem;
  align-content:center;
  width:100%; background: var(--surface-2); color: var(--txt);
  border:0; cursor:pointer; text-align:center; padding: var(--sp-5);
  transition: background-color var(--dur) var(--ease);
}
.video-card__play:hover{ background: var(--accent-soft); }
.video-card__play-ico{
  display:grid; place-items:center; width:64px; height:64px; border-radius:50%;
  background: var(--accent); color: var(--accent-txt);
}
.video-card__play-ico svg{ width:28px; height:28px; fill: currentColor; stroke:none; margin-left:3px; }
.video-card__play-txt{ font-weight:700; font-size:.95rem; }
.video-card__play-sub{ font-size:.82rem; color: var(--txt-dim); }
.video-card__foot{
  display:flex; align-items:center; gap:.5rem;
  padding:.7rem var(--sp-4); border-top:1px solid var(--border);
  font-size:.85rem; color: var(--txt-mute);
}
.video-card__tag{
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  background: var(--accent-soft); color: var(--accent);
  border:1px solid var(--accent-border); border-radius: var(--radius-pill);
  padding:.15rem .5rem;
}
.videos__empty{
  text-align:center; border:1px dashed var(--border-strong);
  border-radius: var(--radius-lg); padding: var(--sp-6) var(--sp-5);
  background: var(--surface);
}
.videos__empty p{ color: var(--txt-mute); max-width:52ch; margin-inline:auto; }
.videos__actions{ display:flex; flex-wrap:wrap; justify-content:center; gap: var(--sp-3); margin-top: var(--sp-5); }
@media (max-width: 520px){ .videos__actions .btn{ width:100%; } }
.videos__note{ margin: var(--sp-5) auto 0; max-width:60ch; text-align:center; font-size:.85rem; color: var(--txt-dim); }

/* =======================================================================
   8. FAIXA DE CAMPANHA NO RODAPÉ
   Reconstrução responsiva da arte oficial (Canva, "Roda pé Eduardo G.").
   As cores são fixas de propósito: é peça de campanha, não segue o tema.
   ======================================================================= */
.rodape-arte{
  --arte-papel:  #F2F1EE;
  --arte-tinta:  #0B0B0C;
  --arte-amarelo:#F5B202;

  width:100%; margin:0 0 var(--sp-6);
  overflow:hidden;
  border-block:1px solid rgba(0,0,0,.18);
}

/* --- banda clara --- */
.rodape-arte__papel{
  position:relative;
  background-color: var(--arte-papel);
  background-image: url("../assets/textura-papel.webp");
  background-size: 420px auto;
  background-blend-mode: multiply;
  color: var(--arte-tinta);
  padding: clamp(1.1rem, 4vw, 2rem) clamp(1rem, 4vw, 2rem) clamp(.9rem, 3vw, 1.4rem);
  text-align:center;
}

.rodape-arte__vote{
  display:inline-block; margin:0 0 clamp(.5rem, 1.6vw, .85rem);
  background: var(--arte-amarelo); color: var(--arte-tinta);
  font-family: var(--ff-display); font-weight:800;
  font-size: clamp(1.05rem, 3.4vw, 1.7rem);
  line-height:1; letter-spacing:.1em; text-transform:uppercase;
  padding:.3em .65em;
}

.rodape-arte__linha{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap: clamp(.4rem, 1.6vw, 1rem);
  margin-bottom: clamp(.55rem, 1.8vw, .9rem);
}

.rodape-arte__nome{
  display:flex; flex-direction:column; margin:0;
  font-family: var(--ff-display); font-weight:700;
  font-size: clamp(1.9rem, 7.2vw, 4rem);
  line-height:.92; letter-spacing:.02em;
  text-align:left;
}
.rodape-arte__nome span{ display:block; }

.rodape-arte__num{
  margin:0;
  font-family: var(--ff-display); font-weight:800;
  font-size: clamp(2.9rem, 12vw, 6.6rem);
  line-height:.82; letter-spacing:-.01em;
}

.rodape-arte__cargo{
  display:inline-block; margin:0;
  background: var(--arte-amarelo); color: var(--arte-tinta);
  font-family: var(--ff-display); font-weight:700;
  font-size: clamp(.88rem, 3vw, 1.6rem);
  line-height:1.1; letter-spacing:.09em; text-transform:uppercase;
  padding:.3em .7em;
  max-width:100%;
}

/* --- banda preta com a chapa majoritária --- */
.rodape-arte__faixa{
  background: #000;
  padding: clamp(.75rem, 2.4vw, 1.15rem) var(--sp-4);
  display:grid; place-items:center;
}
.rodape-arte__faixa img{
  width: clamp(150px, 32vw, 250px); height:auto;
}

/* --- telas estreitas: nome acima do número --- */
@media (max-width: 430px){
  .rodape-arte__linha{ flex-direction:column; gap:.15rem; }
  .rodape-arte__nome{ text-align:center; }
}

/* --- alto contraste: sem textura, papel branco puro --- */
[data-contrast="high"] .rodape-arte__papel{
  background-image:none; background-color:#FFF;
}
[data-contrast="high"] .rodape-arte{ border-block-color:#000; }
[data-contrast="high"] .rodape-arte__vote,
[data-contrast="high"] .rodape-arte__cargo{ outline:2px solid #000; outline-offset:0; }

/* --- impressão --- */
@media print{ .rodape-arte__faixa{ background:#000 !important; } }

