/* Páginas internas e peças compartilhadas (cabeçalho com fundo, rodapé, topo de página, perguntas, vídeos) */
.pular{position:fixed;left:12px;top:-60px;z-index:20;background:var(--navy);color:#fff;font-weight:800;padding:10px 16px;border-radius:12px;transition:top .15s}
.pular:focus{top:12px}

body.pagina-interna{background:#fff}
.pagina-interna .barra{top:0;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(7,71,107,.1)}
.pagina-interna .menu{background:transparent;box-shadow:none;backdrop-filter:none}
.menu a[aria-current=page]{background:var(--navy);color:#fff}
@media (max-width:1240px){ .pagina-interna .menu{background:#fff;box-shadow:0 22px 50px -20px rgba(7,71,107,.6)} }

main.pagina{max-width:1160px;margin:0 auto;padding:108px clamp(16px,4vw,40px) 10px}
.topo-pagina{margin-bottom:clamp(30px,5vw,56px);max-width:860px}
.topo-pagina h1{font:600 clamp(36px,6vw,60px)/1.04 Fredoka,sans-serif;margin:10px 0 14px;text-wrap:balance}
.topo-pagina h1 em{font-style:normal;color:var(--orange)}
.topo-pagina .faixa{font:600 clamp(18px,2.2vw,22px) Fredoka,sans-serif;margin:-6px 0 14px}
.turma-topo{border-left:10px solid var(--cor);padding-left:clamp(16px,3vw,28px)}
.turma-topo h1{color:var(--cor)}
.migalha{font-size:14px;font-weight:700;margin:0;opacity:.8}
.migalha a{color:inherit}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px;padding:0}
.chips li{background:color-mix(in srgb,var(--cor,#07476B) 12%,#fff);font:800 14px Nunito,sans-serif;padding:8px 14px;border-radius:99px}
.chips.links li{padding:0;background:none}
.chips.links a{display:block;background:#f4f9fd;color:var(--navy);text-decoration:none;padding:9px 16px;border-radius:99px;box-shadow:inset 0 0 0 2px rgba(7,71,107,.18)}
.bloco p a,.lead a,.mais a{color:var(--navy);font-weight:800;text-underline-offset:4px}
.mais{margin:18px 0 0;font-size:16px}
.texto{max-width:70ch}
.texto p,.texto li{font-size:17px;line-height:1.6;font-weight:500}
.texto h2{margin-top:36px}
.texto h3{font:600 22px Fredoka,sans-serif;margin:26px 0 6px}

/* atalhos com foto */
.atalhos{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.atalhos a{display:flex;flex-direction:column;text-decoration:none;color:var(--navy);background:#fff;border-radius:24px;overflow:hidden;border:1px solid rgba(7,71,107,.12);border-bottom:7px solid var(--cor);transition:transform .15s,box-shadow .15s}
.atalhos a:hover{transform:translateY(-4px);box-shadow:0 22px 40px -24px rgba(7,71,107,.5)}
.atalhos img{width:100%;height:180px;object-fit:cover;display:block}
.atalhos strong{font:600 24px Fredoka,sans-serif;color:var(--cor);padding:16px 18px 2px}
.atalhos span{font-size:15.5px;line-height:1.45;font-weight:500;padding:0 18px 18px}

/* fotos dentro das páginas */
.fotos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:0 0 8px}
.fotos figure{margin:0}
.fotos img{width:100%;height:300px;object-fit:cover;border-radius:22px;display:block}
.fotos figcaption{font-size:14px;font-weight:700;margin-top:8px;opacity:.85}
.foto-larga img{height:auto;max-height:420px}

/* vídeos do Instagram (links) */
.videos-lista{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.videos-lista a{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;height:100%;text-decoration:none;color:var(--navy);background:#f4f9fd;border-radius:20px;padding:16px 18px;font-size:14.5px;line-height:1.4;font-weight:500;transition:transform .15s}
.videos-lista a:hover{transform:translateY(-3px)}
.videos-lista strong{display:block;font:600 19px Fredoka,sans-serif}
.videos-lista .tocar{grid-row:span 2;width:46px;height:46px;border-radius:50%;background:var(--orange);display:grid;place-items:center}
.videos-lista .tocar::after{content:"";border-left:15px solid #3a1d00;border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}
.videos-lista .destaque a{background:var(--navy);color:#fff}

/* perguntas */
.faq details{border-bottom:1px solid rgba(7,71,107,.14);padding:4px 0}
.faq summary{cursor:pointer;font:600 19px Fredoka,sans-serif;padding:14px 34px 14px 0;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:26px;color:var(--orange)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 16px;font-size:16.5px;line-height:1.55;font-weight:500;max-width:70ch}

/* turmas vizinhas */
.vizinhas{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vizinha{display:block;text-decoration:none;color:var(--navy);background:color-mix(in srgb,var(--cor) 9%,#fff);border-radius:20px;padding:16px 18px;border-top:6px solid var(--cor)}
.vizinha span{display:block;font:800 12px Nunito,sans-serif;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.vizinha strong{display:block;font:600 24px Fredoka,sans-serif;color:var(--cor)}
.vizinha em{font-style:normal;font-size:14px;font-weight:600}
.vizinhas>a:last-child{text-align:right}

/* rodapé */
.rodape-site{background:var(--navy);color:#fff;margin-top:clamp(40px,6vw,80px);padding:clamp(30px,5vw,56px) clamp(18px,5vw,72px)}
.conteudo .rodape-site{margin:0 calc(-1 * clamp(18px,5vw,72px));}
.rodape-grade{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:clamp(20px,4vw,48px)}
.rodape-site .logo-img{width:84px;height:84px;margin-bottom:12px}
.rodape-site p{margin:0 0 10px;font-size:15px;line-height:1.5;font-weight:500}
.rodape-site strong{display:block;font:600 18px Fredoka,sans-serif;margin-bottom:10px}
.rodape-site a{color:#fff;text-underline-offset:4px}
.rodape-site nav a{display:block;padding:5px 0;text-decoration:none;font-weight:700;font-size:15px}
.rodape-site nav a:hover{text-decoration:underline}
@media (max-width:760px){
  .rodape-grade{grid-template-columns:1fr}
  .vizinhas{grid-template-columns:1fr}
  .vizinhas>a:last-child{text-align:left}
  .fotos img{height:240px}
}

/* tabela de aulas por turma */
.tabela-rolagem{overflow-x:auto}
.tabela{width:100%;max-width:640px;border-collapse:collapse;font-size:16px;font-weight:600}
.tabela th,.tabela td{text-align:left;padding:13px 14px;border-bottom:1px solid rgba(7,71,107,.14)}
.tabela thead th{font:600 17px Fredoka,sans-serif;background:#f4f9fd}
.tabela tbody th a{color:var(--navy);text-underline-offset:4px}
.tabela td.sim{color:#1d7a34;font-weight:800}
.aviso-rodape{font-size:12.5px !important;opacity:.8;margin-top:14px !important}
.topo-pagina .selo{margin-bottom:6px}

/* ajustes da revisão de direção de arte */
.grade{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.turmas-grade,.fatos,.videos-lista{grid-template-columns:repeat(3,1fr)}
.grade.par,.fatos.par{grid-template-columns:repeat(2,1fr)}
@media (max-width:980px){ .turmas-grade,.fatos,.videos-lista{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .turmas-grade,.fatos,.videos-lista,.grade,.grade.par,.fatos.par{grid-template-columns:1fr} }

.logo-img{width:64px;height:64px}
.rodape-site .logo-img{width:84px;height:84px}
.so-menu{display:none}
@media (max-width:1240px){ .menu a.so-menu{display:block;background:var(--orange);color:#3a1d00;text-align:center;margin-top:6px} }
@media (max-width:640px){ .so-largo{display:none} .logo-img{width:56px;height:56px} .logo-img.grande{display:none} }

/* depois da visita (ou sem 3D), o cabeçalho ganha fundo para os títulos não passarem por trás */
.na-info .barra,.sem3d .barra{top:0;padding-top:14px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(7,71,107,.1)}
.na-info .paradas{display:none}
.paradas a{min-width:32px;min-height:32px}
@media (max-width:760px){ .paradas{display:none} }

/* abertura no celular: um botão principal de largura total e o secundário como link */
@media (max-width:900px) and (orientation:portrait), (max-width:639px){
  .hero .botoes{display:grid;gap:4px}
  .hero .botao.p{text-align:center}
  .hero .botao.s{box-shadow:none;background:none;padding:8px 0;text-align:center;text-decoration:underline;text-underline-offset:4px}
  .hero .dica{display:none}
}