@font-face{font-family:"Outfit";font-style:normal;font-weight:300 900;font-display:swap;src:url(fontes/outfit-latin-v1.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --verde:#09665D; --petroleo:#0A5C6C; --azul:#0B599B; --azul-escuro:#0A2540; --turquesa:#149BA6;
  --amarelo:#F0D878; --creme:#EADED2; --papel:#F4F7F8; --tinta:#0A2540; --suave:#4A6274; --linha:#D6E0E5;
  --raio:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:400 17px/1.6 "Outfit",system-ui,sans-serif;color:var(--tinta);background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h2{font-weight:800;font-size:clamp(28px,4.6vw,40px);line-height:1.1;margin:0 0 14px;letter-spacing:-.01em}
.sub{color:var(--suave);margin:0 0 22px;max-width:62ch}
.miolo{max-width:1120px;margin:0 auto;padding:0 20px}
.miolo.estreito{max-width:760px}
.duas{display:grid;gap:40px;align-items:center}
.duas.topo{align-items:start}
@media (min-width:860px){.duas{grid-template-columns:1fr 1fr;gap:56px}}
.faixa{padding:56px 0;position:relative}
@media (max-width:759px){.faixa{padding:44px 0}}
.faixa.clara{background:var(--papel)}

/* Fundo da identidade, como no telão: a camada "BG FUNDO" dos PSDs nacionais
   (degradê com grão), mais a luz turquesa à direita e a verde embaixo */
.hero,.inscricao{
  color:#fff;position:relative;overflow:hidden;isolation:isolate;
  background:#0B599B url(img/fundo-textura.webp) center/cover no-repeat;
}
/* Celular: o topo, mais alto que largo, mostra só a faixa central do fundo (393 de 1600 px, em 375 px
   de tela); o recorte central de 640 px na mesma resolução fica igual na tela, com o mesmo grão,
   e pesa 53 KB em vez de 117 KB (PageSpeed, 25/10/2026) */
@media (max-width:480px){.hero{background-image:url(img/fundo-textura-640.webp)}}
/* Na inscrição, que é alta, a imagem esticada engrossaria o grão: degradê do pacote com grão fino em ladrilho */
.inscricao{background:linear-gradient(160deg,#0A5C6C 0%,#0C547A 40%,#0B599B 100%)}
.inscricao::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url(img/grao.webp);opacity:.22;mix-blend-mode:overlay}
.hero::before,.inscricao::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;mix-blend-mode:screen;
  background:
    radial-gradient(ellipse 30% 55% at 102% 45%, rgba(20,155,166,.75), rgba(20,155,166,0) 72%),
    radial-gradient(ellipse 55% 50% at -4% 104%, rgba(9,102,93,.6), rgba(9,102,93,0) 70%)}
/* Elemento de apoio: a espiral de linhas do pacote (BG_2b), sutil, no canto inferior esquerdo */
.espiral{position:absolute;z-index:-1;left:-260px;bottom:-420px;width:980px;max-width:none;opacity:.2;transform:scaleX(-1);pointer-events:none}
@media (max-width:899px){.espiral{left:-240px;bottom:-300px;width:640px}}
.hero-miolo{position:relative;max-width:1120px;margin:0 auto;padding:28px 20px 56px}
.logos{display:flex;align-items:center;gap:28px}
.logos img:first-child{height:46px;width:auto}
.logos img:last-child{height:60px;width:auto}
.hero-grade{display:grid;gap:28px;align-items:center;margin-top:32px}
@media (min-width:900px){.hero-grade{grid-template-columns:minmax(0,1fr) minmax(320px,430px);gap:32px;margin-top:40px}}
.kicker{text-transform:uppercase;letter-spacing:.16em;font-size:14px;margin:0 0 12px;color:#d6ecef}
.kicker b{color:var(--amarelo);font-weight:600}
h1{margin:0;text-transform:uppercase;line-height:.9}
h1 .fino{display:block;font-weight:300;font-size:clamp(44px,7.4vw,78px);letter-spacing:.02em}
h1 .forte{display:block;font-weight:900;font-size:clamp(58px,10.4vw,108px);color:var(--creme)}
.data{font-weight:800;font-size:clamp(24px,3.6vw,34px);margin:22px 0 6px}
.selo{display:inline-block;background:var(--amarelo);color:var(--azul-escuro);font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:.08em;border-radius:999px;padding:6px 14px;margin:4px 0 18px}
@media (max-width:480px){.selo{font-size:12.5px;letter-spacing:.05em;padding:6px 12px}}
.resumo{max-width:52ch;color:#e3f0f2;margin:0 0 26px}
.acoes{display:flex;flex-wrap:wrap;gap:12px}
/* A roda do pacote girando, com os números da Semana no meio (no telão, o QR fica nesse lugar) */
.roda{position:relative;aspect-ratio:1;width:100%;max-width:440px;justify-self:center;display:grid;place-items:center;container-type:inline-size}
.roda .anel{position:absolute;inset:0;width:100%;animation:gira 120s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.roda .anel{animation:none}}
.roda .numeros{position:relative;list-style:none;margin:0;padding:0;width:56%;aspect-ratio:1;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
.roda .numeros li{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.1}
.roda .numeros li:nth-child(odd){border-right:1px solid rgba(255,255,255,.28)}
.roda .numeros li:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.28)}
.roda .numeros b{font-size:13cqw;font-weight:900;line-height:1;color:var(--creme)}
.roda .numeros span{font-size:3.1cqw;text-transform:uppercase;letter-spacing:.08em;color:#d6ecef;margin-top:1.4cqw}
@media (max-width:899px){.roda{max-width:270px}}
@media (max-width:480px){
  .hero-miolo{padding-bottom:36px}
  .hero-grade{gap:20px;margin-top:24px}
  .data{margin-top:16px}
  .selo{margin-bottom:14px}
  .resumo{margin-bottom:20px}
  .acoes{flex-wrap:nowrap;gap:8px}
  .acoes .botao{flex:1;padding:13px 10px;font-size:15px}
}

.botao{display:inline-block;font:inherit;font-weight:600;text-decoration:none;border:0;border-radius:999px;padding:14px 24px;cursor:pointer;line-height:1.2;text-align:center}
.botao.primario{background:var(--amarelo);color:var(--azul-escuro)}
.botao.primario:hover{filter:brightness(1.05)}
.botao.secundario{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.35)}
.botao.contorno{border:1.5px solid var(--azul);color:var(--azul)}
.botao.grande{width:100%;font-size:19px;padding:18px}
.botao:disabled{opacity:.6;cursor:wait}
.botao:focus-visible,input:focus-visible,summary:focus-visible,.aba:focus-visible{outline:3px solid var(--turquesa);outline-offset:2px}

.noite{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:0}
.noite li{border-bottom:1px solid var(--linha);padding:14px 0;display:flex;gap:14px}
.noite li:first-child{padding-top:4px}
.noite .hora{font-weight:900;color:var(--turquesa);font-size:22px;min-width:66px;line-height:1.3}
.noite p{margin:2px 0 0;color:var(--suave)}


/* Todos os dias à vista, sem rolar para o lado: 3 por linha no celular, 6 numa linha no computador */
.abas{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
@media (min-width:700px){.abas{grid-template-columns:repeat(6,1fr)}}
.aba{font:inherit;border:1.5px solid var(--linha);background:#fff;color:var(--tinta);border-radius:14px;padding:10px 6px;cursor:pointer;display:grid;gap:2px;text-align:center;line-height:1.2}
.aba b{font-weight:800;font-size:16px}
.aba span{font-size:14px;color:var(--suave)}
.aba[aria-selected="true"] span{color:#cfe0ea}
.aba.vazia span{color:inherit}
.aba[aria-selected="true"]{background:var(--azul-escuro);border-color:var(--azul-escuro);color:#fff}
.aba.vazia{color:#9aaab4;cursor:default}
.dia[hidden]{display:none}
.cartoes{display:grid;gap:14px}
@media (min-width:760px){.cartoes{grid-template-columns:1fr 1fr}}
.cartao{border:1px solid var(--linha);border-radius:var(--raio);padding:20px;background:#fff;display:flex;flex-direction:column;gap:6px}
.cartao.palestra{background:linear-gradient(120deg,#0A5C6C,#0B599B);color:#fff;border:0}
@media (min-width:760px){.cartao.palestra{grid-column:1/-1}}
.cartao .tipo{font-size:13px;text-transform:uppercase;letter-spacing:.12em;font-weight:600;color:var(--turquesa)}
.cartao.palestra .tipo{color:var(--amarelo)}
.cartao h3{margin:0;font-size:21px;line-height:1.25;font-weight:800}
.cartao .meta{font-size:15px;color:var(--suave)}
.cartao.palestra .meta,.cartao.palestra p{color:#dcecf0}
.cartao p{margin:4px 0 0}
.vagas{font-size:14px;font-weight:600;color:var(--verde)}
.vagas.enchendo{color:#8A5A00}
.vagas.poucas{color:#B35C00}
.vagas.esgotada{color:#B3261E}
.cartao.palestra .vagas{color:var(--amarelo)}
/* Dia que já não recebe inscrição: aba apagada, aviso e cartões esmaecidos */
.aba i{font-style:normal;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#B3261E}
.aba.encerrada:not([aria-selected="true"]){background:#F1F3F4;color:#7d8d97}
.aba.encerrada[aria-selected="true"] i{color:#FFD3CE}
.encerrado{background:#FFF4E5;color:#7A4A00;border-radius:12px;padding:10px 14px;margin:0 0 14px;font-weight:600}
.cartoes.passado .cartao{opacity:.6}
.nota-encerrado{margin:0 0 12px;color:#FFE08A;font-size:15px}
.rodape-cartao{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px}
.saiba-mais{font:inherit;font-size:15px;font-weight:600;background:none;border:1.5px solid var(--linha);color:var(--azul);border-radius:999px;padding:6px 14px;cursor:pointer;flex:none}
.cartao.palestra .saiba-mais{color:#fff;border-color:rgba(255,255,255,.45)}
.saiba-mais:focus-visible{outline:3px solid var(--turquesa);outline-offset:2px}
/* Janela do "Saiba mais": centrada no computador, subindo de baixo no celular */
.detalhe{border:0;padding:0;background:transparent;max-width:640px;width:calc(100% - 32px);max-height:85vh;color:var(--tinta)}
.detalhe::backdrop{background:rgba(10,37,64,.55)}
.detalhe-caixa{background:#fff;border-radius:var(--raio);padding:26px 24px 22px;position:relative;display:grid;gap:10px;overflow:auto;max-height:85vh}
.detalhe .tipo{font-size:13px;text-transform:uppercase;letter-spacing:.12em;font-weight:600;color:var(--turquesa);padding-right:36px}
.detalhe h3{margin:0;font-size:23px;line-height:1.25;font-weight:800}
.detalhe p{margin:0}
.detalhe-x{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;border:0;background:var(--papel);font-size:26px;line-height:1;cursor:pointer;color:var(--tinta)}
.detalhe .botao{margin-top:6px;justify-self:start}
@media (max-width:640px){
  .detalhe{width:100%;max-width:none;margin:auto 0 0;max-height:88vh}
  .detalhe-caixa{border-radius:var(--raio) var(--raio) 0 0;max-height:88vh;padding-bottom:calc(22px + env(safe-area-inset-bottom))}
  .detalhe .botao{justify-self:stretch}
  .detalhe[open]{animation:sobe .22s ease-out}
}
@keyframes sobe{from{transform:translateY(40px);opacity:0}}
@media (prefers-reduced-motion:reduce){.detalhe[open]{animation:none}}
.quinta{border:1.5px dashed var(--linha);border-radius:var(--raio);padding:18px;color:var(--suave);text-align:center}

/* formulário */
.inscricao .miolo{position:relative}
.inscricao .sub{color:#d6ecef}
form{display:grid;gap:18px}
fieldset{border:0;margin:0;padding:0}
.dados{display:grid;gap:14px;background:rgba(255,255,255,.08);border-radius:var(--raio);padding:18px}
label{display:grid;gap:6px;font-weight:600}
label small{font-weight:400;opacity:.8}
input[type=text],input:not([type]),input[type=tel],input[type=email]{font:inherit;font-weight:400;padding:13px 14px;border-radius:12px;border:1.5px solid transparent;background:#fff;color:var(--tinta);width:100%}
input[aria-invalid="true"]{border-color:#FF8A80}
.escolha-dia{background:#fff;color:var(--tinta);border-radius:var(--raio);padding:16px 18px;margin:0 0 12px}
.escolha-dia legend{font-weight:900;font-size:19px;padding:0;margin-bottom:6px;float:left;width:100%}
.escolha-dia .grupo{clear:both;display:grid;gap:8px;margin-top:8px}
.escolha-dia .rotulo-grupo{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--suave);margin-top:8px}
.opcao{display:flex;gap:12px;align-items:flex-start;font-weight:400;border:1.5px solid var(--linha);border-radius:12px;padding:10px 12px;cursor:pointer}
.opcao input{margin-top:4px;width:20px;height:20px;flex:none;accent-color:var(--azul)}
.opcao b{display:block;font-weight:600;line-height:1.3}
.opcao span{font-size:14px;color:var(--suave)}
.opcao:has(input:checked){border-color:var(--azul);background:#EEF5FB}
.opcao.esgotada{opacity:.55;cursor:not-allowed}
.opcao .dica{display:block;font-style:normal;font-size:13.5px;line-height:1.35;margin-top:3px;color:var(--petroleo)}
.opcao .dica.em-outro{color:#7A5200;font-weight:600}
.troca{margin:0;padding:9px 12px;border-radius:10px;background:#FFF4CC;border-left:4px solid var(--amarelo);color:#4A3A00;font-size:14.5px;line-height:1.4}
.limpar-oficina{font:inherit;font-size:14px;background:none;border:0;color:var(--azul);text-decoration:underline;cursor:pointer;justify-self:start;padding:2px 0}
/* Aviso de consentimento abaixo do botão, discreto, como nas páginas do Filosofia para Viver */
.aviso{margin:-6px 0 0;text-align:center;font-size:13px;line-height:1.5;color:rgba(255,255,255,.62)}
.aviso a{color:inherit;text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:2px}
.aviso a:hover{color:rgba(255,255,255,.85);text-decoration-color:currentColor}
.erro{background:#FFE6E3;color:#7A1A12;border-radius:12px;padding:12px 14px;margin:0;font-weight:600}
.erro p{margin:0 0 6px}
.erro ul{margin:0;padding-left:18px;display:grid;gap:6px}
/* inscrição repetida: botão do WhatsApp dentro do aviso (verde escuro da marca, contraste 6,8:1 com o branco) */
.whats-erro{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:12px;padding:13px 16px;background:var(--verde);color:#fff;font-size:16px}
.whats-erro svg{flex:none;width:24px;height:24px}
.whats-erro:hover{filter:brightness(1.12)}
.ir-campo{display:block;font:inherit;font-weight:600;color:#7A1A12;background:none;border:0;padding:0;text-align:left;text-decoration:underline;cursor:pointer}
.sucesso{background:#fff;color:var(--tinta);border-radius:var(--raio);padding:24px;display:grid;gap:12px}
.sucesso h3{margin:0;font-size:28px;font-weight:900;color:var(--verde);display:flex;align-items:center;gap:12px;outline:0}
#sucesso{scroll-margin-top:16px;border:3px solid var(--amarelo);box-shadow:0 12px 40px rgba(0,20,40,.35)}
.sucesso .ok{flex:none;width:44px;height:44px;border-radius:50%;background:var(--verde);color:#fff;display:grid;place-items:center;font-size:24px}
.sucesso ul{margin:0;padding-left:20px}
.sucesso .botao.secundario{color:var(--azul);border-color:var(--linha);background:#fff}

details{border-bottom:1px solid var(--linha);padding:12px 0}
summary{font-weight:600;cursor:pointer}
details p{margin:8px 0 0;color:var(--suave)}

.rodape{background:var(--azul-escuro);color:#c9d8e2;text-align:center;padding:40px 20px 56px;font-size:15px}
.rodape img{height:64px;width:auto;margin:0 auto 14px}

/* mensagem embaixo do campo: erro ou sugestão de e-mail */
.ajuda{font-weight:400;font-size:14px;min-height:0;color:#FFE08A}
.ajuda:empty{display:none}
.ajuda.falha{color:#FFD3CE}
.usar-sugestao{font:inherit;font-weight:600;color:var(--amarelo);background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
.link-whats{color:inherit;font-weight:600}

/* botão do WhatsApp que acompanha a rolagem */
.whats-flutuante{position:fixed;right:16px;bottom:16px;z-index:20;display:flex;align-items:center;gap:8px;
  background:#25D366;color:#fff;text-decoration:none;font-weight:600;border-radius:999px;padding:12px 18px 12px 14px;
  box-shadow:0 8px 24px rgba(0,30,40,.28)}
.whats-flutuante:hover{filter:brightness(1.05)}
.whats-flutuante{transition:opacity .2s,transform .2s}
.whats-flutuante.recolhido{opacity:0;transform:translateY(20px);pointer-events:none}
.whats-flutuante:focus-visible{outline:3px solid var(--azul-escuro);outline-offset:3px}
@media (max-width:480px){.whats-flutuante{padding:12px}.whats-flutuante span{display:none}}
.rodape{padding-bottom:96px}

[hidden]{display:none!important}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
