
@font-face{font-family:'Altone';font-weight:400;font-style:normal;font-display:swap;src:url('/horario-assets/altone-regular.4e69435c.woff2') format('woff2')}
@font-face{font-family:'Altone';font-weight:700;font-style:normal;font-display:swap;src:url('/horario-assets/altone-bold.e5f3587c.woff2') format('woff2')}
@font-face{font-family:'Altone';font-weight:800;font-style:normal;font-display:swap;src:url('/horario-assets/altone-extrabold.c341dc6f.woff2') format('woff2')}

:root{
  --verde:#ceff00; --verde-pressed:#a6cf00; --verde-profundo:#5c6e00;
  --preto:#000; --branco:#fff;
  --n700:#3a3a3a; --n600:#565656; --n300:#d9d9d9; --n200:#ececec; --n100:#f5f5f5;
  --preto-72:rgba(0,0,0,.72); --preto-18:rgba(0,0,0,.18); --branco-16:rgba(255,255,255,.16);
  --pattern:url('/horario-assets/pattern.0286a8a2.png');
  --cont:72rem; --raio-lg:1.25rem; --raio-pill:999px;
  --vao:clamp(3.5rem,6vw,5.5rem);
  --menu-topo:clamp(1.1rem,2vw,1.6rem); --menu-lado:clamp(1.1rem,2vw,1.6rem);
  --menu-icone:1.5rem; --menu-pad-x:.85rem; --menu-pad-y:.62rem;
  --menu-chao:rgba(5,6,4,.86);
  --ease-enfase:cubic-bezier(.16,1,.3,1);
  --esp-secao:clamp(3.5rem,2rem + 7vw,8rem);
  --ease:cubic-bezier(.2,.6,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--branco);color:var(--preto);
  font-family:'Altone',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:400;line-height:1.5;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
:where(a,button):focus-visible{outline:3px solid var(--verde-profundo);outline-offset:2px;border-radius:4px}

/* ---------- menu pílula (mesmo padrão do site novo) ---------- */
.menu{position:fixed;top:var(--menu-topo);left:var(--menu-lado);z-index:50;
  width:max-content;max-width:calc(100vw - var(--menu-lado)*2)}
.menu__pilula{position:relative;overflow:hidden;border-radius:var(--raio-pill);
  background:var(--menu-chao);contain:layout paint;
  transition:width 220ms var(--ease-enfase),height 220ms var(--ease-enfase),
             border-radius 220ms var(--ease-enfase)}
.menu--vivo .menu__pilula{width:var(--menu-larg-fechada);height:var(--menu-alt-fechada)}
.menu--vivo.esta-aberto .menu__pilula{width:var(--menu-larg-aberta);height:var(--menu-alt-aberta);
  border-radius:1.35rem}
.menu__linha{display:flex;align-items:center;justify-content:space-between;gap:.7rem;
  padding:var(--menu-pad-y) var(--menu-pad-x)}
.menu__marca{display:flex;align-items:center;border-radius:var(--raio-pill)}
.menu__marca img{height:var(--menu-icone);width:auto;display:block}
.menu__botao{display:flex;align-items:center;justify-content:center;
  width:1.9rem;height:1.9rem;margin:-.2rem -.15rem -.2rem 0;padding:0;border:0;background:none;
  cursor:pointer;border-radius:var(--raio-pill);color:var(--branco)}
.menu__tracos{display:block;position:relative;width:1.05rem;height:.62rem}
.menu__tracos i{position:absolute;left:0;right:0;height:2px;border-radius:2px;background:currentColor;
  transition:transform 220ms var(--ease-enfase),opacity 220ms var(--ease-enfase)}
.menu__tracos i:nth-child(1){top:0}
.menu__tracos i:nth-child(2){top:calc(50% - 1px)}
.menu__tracos i:nth-child(3){bottom:0}
.esta-aberto .menu__tracos i:nth-child(1){transform:translateY(.29rem) rotate(45deg)}
.esta-aberto .menu__tracos i:nth-child(2){opacity:0}
.esta-aberto .menu__tracos i:nth-child(3){transform:translateY(-.29rem) rotate(-45deg)}
.menu--vivo .menu__painel{visibility:hidden;transition:visibility 0s linear 220ms}
.menu--vivo.esta-aberto .menu__painel{visibility:visible;transition:visibility 0s}
.menu__lista{width:max-content;margin:0;padding:.2rem var(--menu-pad-x) .8rem;list-style:none;
  display:flex;flex-direction:column}
.menu__link{position:relative;display:block;padding:.62rem 0;
  font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  text-decoration:none;white-space:nowrap;color:rgba(255,255,255,.72);
  transition:color 220ms var(--ease-enfase)}
.menu__link:hover,.menu__link[aria-current]{color:var(--branco)}
.menu__link::after{content:'';position:absolute;left:0;right:0;bottom:.36rem;height:.13rem;
  background:var(--verde);transform:scaleX(0);transform-origin:0 50%;
  transition:transform 220ms var(--ease-enfase)}
.menu__link:hover::after,.menu__link[aria-current]::after{transform:scaleX(1)}
.menu--vivo .menu__lista li{opacity:0;transform:translateY(.5rem);
  transition:opacity 220ms var(--ease-enfase),transform 220ms var(--ease-enfase)}
.menu--vivo.esta-aberto .menu__lista li{opacity:1;transform:none;transition-delay:calc(var(--i) * 55ms)}
.menu__link--site{margin-top:.35rem;padding-top:.85rem;border-top:1px solid rgba(255,255,255,.16)}
.menu a:focus-visible,.menu button:focus-visible{outline:3px solid var(--verde);outline-offset:3px}

/* ---------- capa ---------- */
.capa{position:relative;overflow:hidden;background:var(--verde);color:var(--preto);
  padding:clamp(5rem,8vw,7rem) 0 clamp(2.6rem,6vw,4.5rem)}
.capa__pattern{position:absolute;inset:0;pointer-events:none;
  -webkit-mask:var(--pattern) left -18% center/auto clamp(28rem,52vw,58rem) no-repeat;
  mask:var(--pattern) left -18% center/auto clamp(28rem,52vw,58rem) no-repeat;
  background:var(--preto);opacity:.14}
.faixa{max-width:var(--cont);margin:0 auto;padding:0 clamp(1.1rem,3.4vw,2.4rem);position:relative;text-align:center}
.eyebrow{margin:0 0 .9rem;font-weight:700;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase}
.eyebrow::before{content:"";display:inline-block;width:1.5rem;height:3px;background:var(--preto);
  vertical-align:.28em;margin-right:.6rem}
.pontos .eyebrow::before,.intro .eyebrow::before{background:var(--preto)}
.capa__titulo{margin:0;font-size:clamp(2.6rem,1rem + 6vw,5.4rem);line-height:.92;letter-spacing:-.03em;font-weight:400}
.capa__titulo strong{display:block;font-weight:700}
.capa__sub{margin:1.4rem auto 0;max-width:44rem;font-size:clamp(1rem,.94rem + .3vw,1.2rem);color:var(--preto-72)}

/* ---------- pontos ---------- */
.pontos{padding:var(--vao) 0}
.abas{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin:0 0 2.4rem;padding:0;list-style:none}
.aba{appearance:none;border:1px solid var(--n300);background:var(--branco);color:var(--preto);
  font:inherit;font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;
  padding:.72rem 1.1rem;border-radius:var(--raio-pill);cursor:pointer;min-height:2.75rem;
  transition:background 120ms var(--ease),border-color 120ms var(--ease)}
.aba:hover{border-color:var(--preto)}
.aba[aria-selected="true"]{background:var(--preto);border-color:var(--preto);color:var(--verde)}
.ponto__nome{margin:0 0 1.6rem;text-align:center;font-size:clamp(1.4rem,1.1rem + 1vw,2rem);font-weight:700;letter-spacing:-.01em}
.grade{display:grid;grid-template-columns:1fr;gap:1rem;margin:0 auto;padding:0;list-style:none;max-width:42rem}
.linha{border:1px solid var(--n300);border-radius:var(--raio-lg);padding:1.6rem 1.5rem;background:var(--branco);
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:.55rem}
.linha__dia{margin:0;font-weight:700;font-size:1.05rem;letter-spacing:.01em}
.linha__hora{margin:0;font-weight:800;font-size:clamp(1.35rem,1.1rem + .9vw,1.8rem);line-height:1.1;letter-spacing:-.02em}
.linha__atividade{align-self:center;margin:0;background:var(--verde);color:var(--preto);
  font-weight:800;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.35rem .7rem;border-radius:var(--raio-pill)}
.locais{margin:.35rem 0 0;padding:0;list-style:none;display:flex;flex-direction:column;align-items:center;gap:.5rem}
.local{display:block;font-size:.96rem;color:var(--n700);line-height:1.45}
.local::before{content:"";display:inline-block;width:.55rem;height:.55rem;margin-right:.5rem;
  vertical-align:.05em;background:var(--verde);border-radius:2px;transform:skewX(-12deg)}
.local b{display:block;font-weight:700;color:var(--preto);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}

.vazio{margin:0;font-size:1rem;color:var(--n600)}

/* ---------- hub ---------- */
/* a box do texto: mesmo desenho da box de fechamento do site novo.
   Campo neon cheio, o mesmo raio de canto, o raio da marca sangrando pela
   esquerda e se dissolvendo antes de encostar na leitura. Dentro de campo
   verde cheio, toda informação é preta (texto branco no neon dá 1,17:1). */
/* no hub o bloco de cards não fecha com respiro próprio: quem dá o vão
   seguinte é a seção do texto, senão os dois somam e viram um buraco */
.pontos--hub{padding-bottom:0}
.intro{padding:var(--vao) 0}
.caixa{container-type:inline-size;position:relative;overflow:clip;isolation:isolate;
  background:var(--verde);color:var(--preto);
  border-radius:clamp(1.6rem,1.2rem + 1.2vw,2.4rem);
  display:flex;flex-direction:column}
.caixa__raio{position:absolute;z-index:0;pointer-events:none;
  width:95cqw;aspect-ratio:750/840;
  background:var(--preto);opacity:.14;
  left:-40cqw;top:56%;transform:translateY(-50%);
  -webkit-mask:var(--pattern) center/contain no-repeat;
          mask:var(--pattern) center/contain no-repeat}
@supports (mask-composite: intersect) or (-webkit-mask-composite: source-in){
  /* o degradê morre antes da coluna de leitura, medido em vw para fechar em
     qualquer largura; o max() é o piso do celular */
  .caixa__raio{
    --raio-fim:38%;
    --raio-inicio:18%;
    --raio-dissolve:linear-gradient(90deg,#000 0 var(--raio-inicio),transparent var(--raio-fim));
    -webkit-mask-image:var(--pattern),var(--raio-dissolve);
            mask-image:var(--pattern),var(--raio-dissolve);
    -webkit-mask-size:contain,100% 100%;   mask-size:contain,100% 100%;
    -webkit-mask-position:center,center;   mask-position:center,center;
    -webkit-mask-repeat:no-repeat,no-repeat; mask-repeat:no-repeat,no-repeat;
    -webkit-mask-composite:source-in;      mask-composite:intersect}
}
.caixa__miolo{position:relative;z-index:1;display:flex;flex-direction:column;
  align-items:center;text-align:center;gap:1rem;
  padding:clamp(3rem,8vh,5rem) clamp(1.2rem,4vw,3rem)}
.caixa__miolo .eyebrow{margin-bottom:.4rem}
.caixa__miolo p{max-width:52rem;margin:0;font-size:clamp(1rem,.95rem + .35vw,1.18rem);
  line-height:1.45;color:var(--preto-72)}
.caixa__abre{font-size:clamp(1.35rem,1rem + 1.6vw,2.1rem)!important;line-height:1.24;
  font-weight:700;color:var(--preto)!important;max-width:44rem;text-wrap:balance}
.regioes{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;
  margin:0 auto;padding:0;list-style:none;max-width:62rem}
.regiao{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  text-align:center;gap:2.5rem;min-height:11rem;padding:1.5rem;border-radius:var(--raio-lg);background:var(--preto);
  color:var(--branco);text-decoration:none;transition:transform 220ms var(--ease)}
.regiao:hover{transform:translateY(-3px)}
.regiao::after{content:"";position:absolute;right:-22%;bottom:-30%;width:16rem;height:16rem;
  -webkit-mask:var(--pattern) center/contain no-repeat;mask:var(--pattern) center/contain no-repeat;
  background:var(--verde);opacity:.2;pointer-events:none}
.regiao__nome{font-weight:700;font-size:1.5rem;letter-spacing:-.01em;position:relative}
.regiao__ver{position:relative;font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--verde)}

/* ---------- rodapé ---------- */
.rodape{background:var(--preto);color:rgba(255,255,255,.72);padding:clamp(2.5rem,5vw,4rem) 0}
.rodape__faixa{max-width:var(--cont);margin:0 auto;padding:0 clamp(1.1rem,3.4vw,2.4rem);
  display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;justify-content:center;gap:1rem;text-align:center}
.rodape img{height:1.9rem;width:auto}
.rodape__faixa p{margin:0;font-size:.85rem}
.aviso{margin:1.6rem auto 0;max-width:var(--cont);padding:0 clamp(1.1rem,3.4vw,2.4rem);text-align:center;
  font-size:.78rem;color:rgba(255,255,255,.5)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- celular (bloco único) ---------- */
@media (max-width:48rem){
  .capa{padding:5rem 0 2.2rem}
  .capa__pattern{-webkit-mask-position:left -42% center;mask-position:left -42% center}
  .linha{padding:1.2rem 1.25rem}
  .regioes{grid-template-columns:1fr}
  /* No estreito a coluna de texto ocupa a box inteira, então não sobra
     lateral para o raio: ele desce para o pé da box, onde tem massa (a lição
     do tonal que some em 390px) sem passar por baixo de uma linha sequer. */
  .caixa__miolo{padding:2.6rem 1.3rem 13rem;gap:.9rem}
  /* tonal a 14% some numa faixa pequena de tela estreita (medido em rodada
     anterior): no celular o mesmo grafismo pede um pouco mais de tinta */
  .caixa__raio{width:150cqw;left:-25cqw;top:auto;bottom:-120px;transform:none;opacity:.22;
    --raio-dissolve:linear-gradient(0deg,#000 0 32%,transparent 52%)}
}
