@charset "utf-8";
/* =============================================================================================
   Colégio Unifev — folha de estilo única do site (nenhuma página tem CSS próprio).
   Tamanhos em rem: os botões A+ / A− da barra de acessibilidade mudam a fonte da raiz e tudo
   acompanha. Seções, na ordem:
     1. base            6. lateral              11. corpo docente      16. galeria
     2. acessibilidade  7. textos (card-texto)  12. bolsas             17. mapa do site
     3. topo            8. home                 13. calendário         18. rodapé
     4. menu            9. ensino               14. aplicativo         19. alto contraste
     5. título          10. pessoas             15. notícias           20. menos movimento
   ============================================================================================= */

/* 1. base ------------------------------------------------------------------------------------ */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Ubuntu'), url(../fontes/ubuntu.woff) format('woff');
}

:root {
    --azul: #1f62b0;
    --azul-marca: #034ea2;        /* faixa do menu, igual ao site e à Rádio e TV */
    --laranja-marca: #ff8a02;
    --azul-escuro: #154a87;
    --ciano: #01a6d6;
    --ciano-texto: #00739e;       /* ciano para texto sobre branco (4,9:1); o #01a6d6 fica nos fundos */
    --ciano-claro: #eaf7fc;
    --laranja: #fe8a00;
    --laranja-claro: #fff1e3;
    --verde: #25b25b;
    --verde-texto: #1a7a40;
    --verde-claro: #e6f7ec;
    --roxo: #7a5cc4;
    --roxo-claro: #f0ecfa;
    --texto: #4a4b4d;
    --texto-forte: #2f3336;
    --texto-suave: #63666a;       /* cinza de legenda que ainda passa de 4,5:1 no branco */
    --borda: #e6e8eb;
    --fundo-suave: #f5f6f7;
    --sombra: 0 1px 4px rgba(0, 0, 0, .08);
    --raio: 12px;
    --fonte: 'Ubuntu', Arial, sans-serif;
    --fonte-menu: 'Montserrat', 'Ubuntu', Arial, sans-serif;   /* topo e menus, como o site */
    --acess-fundo: #033466;
    --acess-foco: #ed6c05;
}

*, *::before, *::after { box-sizing: border-box; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    background: #fff;
    color: var(--texto);
    font-family: var(--fonte);
    font-size: 1rem;
    line-height: 1.5;
}

img, video, iframe { max-width: 100%; }
img { height: auto; border: 0; }
a { color: var(--azul); }
h1, h2, h3, h4 { color: var(--texto-forte); line-height: 1.25; }
button { font: inherit; }

.container {
    width: 100%;
    max-width: calc(1024px + 2rem);
    margin-inline: auto;
    padding-inline: 1rem;
}

.ico {
    width: 1em;
    height: 1em;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    vertical-align: -.125em;
}

.visualmente-oculto {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

[hidden] { display: none !important; }

/* Foco do teclado sempre visível: anel laranja com respiro branco, que aparece tanto no branco
   quanto no azul. Só no teclado (:focus-visible); o clique não mostra. */
:focus-visible {
    outline: 2px solid var(--acess-foco);
    outline-offset: 2px;
    box-shadow: 0 0 0 2px #fff;
}
/* <main>, menu e rodapé recebem o foco pelos atalhos; o anel em volta deles só atrapalha */
[tabindex="-1"]:focus { outline: none; box-shadow: none; }

@media (min-width: 992px) { .so-celular { display: none !important; } }
@media (max-width: 991.98px) { .so-computador { display: none !important; } }

/* 2. acessibilidade -------------------------------------------------------------------------- */
.acess-pular {
    position: absolute;
    left: 12px;
    top: -80px;
    z-index: 10000;
    padding: 10px 16px;
    border-radius: 4px;
    background: #fff;
    color: var(--azul);
    font-weight: 700;
    text-decoration: none;
}
.acess-pular:focus { top: 12px; }

.acess {
    background: var(--acess-fundo);
    color: #fff;
    font-size: .75rem;
    line-height: 1.3;
}
.acess a,
.acess button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 24px;
    padding: 4px 0;
    border: 0;
    background: none;
    color: #fff;
    font: inherit;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.acess a:hover,
.acess button:hover { color: #fff; text-decoration: underline; }
.acess [aria-current] { text-decoration: underline; }
.acess kbd {
    padding: 0 5px;
    border-radius: 3px;
    background: rgba(255, 255, 255, .18);
    color: #fff;
    font-family: inherit;
    font-size: inherit;
    font-weight: 700;
}
.acess button[data-acess="aumentar"],
.acess button[data-acess="diminuir"],
.acess button[data-acess="original"] {
    justify-content: center;
    min-width: 24px;
    font-size: 1.1em;
}
.acess-interno {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0 16px;
}
.acess-grupo {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0 14px;
}
/* chave liga/desliga do contraste */
.acess-chave {
    position: relative;
    flex: none;
    width: 32px;
    height: 18px;
    border-radius: 9px;
    background: rgba(255, 255, 255, .35);
    transition: background .15s;
}
.acess-chave::after {
    content: '';
    position: absolute;
    left: 2px;
    top: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    transition: transform .15s;
}
.acess [aria-checked="true"] .acess-chave { background: var(--acess-foco); }
.acess [aria-checked="true"] .acess-chave::after { transform: translateX(14px); }

/* No celular ficam só os recursos; os atalhos de teclado e o mapa saem da barra
   (o mapa continua no rodapé e o "Pular para o conteúdo" continua no primeiro Tab). */
@media (max-width: 991.98px) {
    .acess-atalhos,
    .acess .acess-mapa { display: none; }
    .acess-interno,
    .acess-grupo { justify-content: center; }
    .acess-grupo { gap: 0 12px; }
}
@media (max-width: 479.98px) {
    .acess-grupo { gap: 0 10px; }
    .acess .ico { display: none; }
}

/* 3. topo ------------------------------------------------------------------------------------ */
/* faixa colorida de 3px abaixo da barra de acessibilidade, igual à do site (.detalhe-degrade) */
.detalhe-degrade {
    height: 3px;
    background: url(../img/detalhe.jpg) center / cover;
}

/* menu secundário no topo, à direita — mesmo padrão do site (.secondary-menu) */
.topo-direita {
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .875rem;
}
.menu-secundario ul {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu-secundario a {
    display: inline-block;
    margin: 0 0 0 1.25rem;
    color: #333;
    font-family: var(--fonte-menu);
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
}
.menu-secundario a:hover { color: var(--azul); }
/* texto ampliado pelo A+ (data-fonte na raiz): aí o menu secundário pode quebrar de linha */
html[data-fonte] .topo-direita { flex: 0 1 auto; min-width: 0; }
html[data-fonte] .menu-secundario ul { flex-wrap: wrap; }

.topo-principal {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    min-height: 8.125rem;
}
/* o logo cede espaço antes do menu secundário (que só quebra de linha em último caso) */
.logo { flex: 0 100 auto; min-width: 10rem; display: block; line-height: 0; }
.logo img { width: 21.5rem; max-width: 100%; }

.redes {
    display: flex;
    gap: .875rem;
    padding-right: 3px;
}
.redes a,
.rodape-redes a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--laranja);
    color: #fff;
    font-size: 1.1rem;
    transition: background .15s;
}
/* no topo, cada rede na cor da marca com aro branco, como na Rádio e TV Unifev */
.redes a { width: 2.5rem; height: 2.5rem; box-shadow: 0 0 0 2px #fff, 0 0 0 3px currentColor; font-size: 1.15rem; transition: transform .15s; }
.redes a.facebook { background: #1877f2; color: #1877f2; }
.redes a.instagram { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); color: #d6249f; }
.redes a.youtube { background: #e62117; color: #e62117; }
.redes a .ico { color: #fff; }
.redes a:hover { transform: translateY(-2px); }


.menu-botao {
    display: none;
    align-items: center;
    gap: .5rem;
    margin-left: auto;
    padding: .5rem .875rem;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #fff;
    color: var(--azul);
    font-weight: 700;
    cursor: pointer;
}
.menu-botao .ico { font-size: 1.4rem; }
.menu-botao .fecha,
.menu-botao[aria-expanded="true"] .abre { display: none; }
.menu-botao[aria-expanded="true"] .fecha { display: inline; }

@media (max-width: 991.98px) {
    .redes,
    .topo-direita { display: none; }
    .topo-principal { min-height: 4.5rem; gap: 1rem; }
    .logo img { width: 13rem; }
    .menu-botao { display: inline-flex; }
}
@media (max-width: 379.98px) {
    .logo img { width: 10.5rem; }
    .menu-botao span { display: none; }
}

/* 4. menu ------------------------------------------------------------------------------------ */
/* Mesmo padrão do site e da Rádio e TV Unifev: faixa de ponta a ponta no azul da marca (#034ea2),
   itens à esquerda em caixa alta pequena e traço laranja só sob o item ativo. */
.menu { position: relative; z-index: 300; margin-bottom: .625rem; background: var(--azul-marca); }
.menu .container { padding-inline: 1rem; }
.menu-lista {
    display: flex;
    flex-wrap: wrap;          /* com o A+ os itens crescem e passam para uma segunda linha */
    gap: 0 2.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu-lista > li { position: relative; }
.menu-lista > li.menu-inicio { display: none; }
.menu-item,
.menu-inicio > a {
    position: relative;
    display: flex;
    align-items: center;
    gap: .375rem;
    height: 3.25rem;
    padding: 0;
    border: 0;
    background: none;
    color: #fff;
    font-family: var(--fonte-menu);
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: .01em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.menu-inicio > a .ico { font-size: 1.15rem; }
.menu-item .seta { font-size: .75rem; opacity: .8; transition: transform .15s; }
.menu-item[aria-expanded="true"] .seta { transform: rotate(180deg); }
/* traço laranja: no item ativo fica sempre; nos outros aparece no mouse/foco */
.menu-item::after,
.menu-inicio > a::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background: var(--laranja-marca);
    transform: scaleX(0);
    transition: transform .15s;
}
.menu-lista > li:hover > .menu-item::after,
.menu-item:focus-visible::after,
.menu-item[aria-expanded="true"]::after,
.menu-lista > li.ativo > .menu-item::after,
.menu-lista > li.ativo > a::after { transform: none; }

/* entre 992 e 1200 px os itens não cabem com o espaçamento cheio */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .menu-lista { gap: 0 1.5rem; }
    .menu-portal > .menu-item { padding: 0 1rem; }
}

/* Portal: bloco laranja no fim da faixa, como o PORTAL do site */
.menu-lista > li.menu-portal { margin-left: auto; }
.menu-portal > .menu-item { padding: 0 1.5rem; background: var(--laranja-marca); }
.menu-portal > .menu-item:hover,
.menu-portal > .menu-item[aria-expanded="true"] { background: #e67c00; }
.menu-portal > .menu-item::after { display: none; }

.submenu {
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 300;
    min-width: 16.25rem;
    margin: 0;
    padding: .375rem 0;
    list-style: none;
    background: #fff;
    border-top: 3px solid var(--laranja);
    border-radius: 0 0 10px 10px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .15s, transform .15s, visibility .15s;
}
.menu-lista > li:last-child .submenu { left: auto; right: 0; }
.menu-item[aria-expanded="true"] + .submenu { opacity: 1; visibility: visible; transform: none; }
@media (hover: hover) and (min-width: 992px) {
    .menu-lista > li:hover > .submenu { opacity: 1; visibility: visible; transform: none; }
}
.submenu a {
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: .625rem 1.125rem;
    border-left: 3px solid transparent;
    color: var(--texto-forte);
    font-size: .875rem;
    text-decoration: none;
    white-space: nowrap;
    transition: background .12s, color .12s;
}
.submenu a:hover,
.submenu a[aria-current] { background: var(--ciano-claro); color: var(--ciano-texto); border-left-color: var(--ciano); }
.separador { height: 1px; margin: .375rem 0; background: #eef0f2; }
.selo-pdf {
    margin-left: auto;
    padding: 1px 5px;
    border-radius: 4px;
    background: #ffe9e6;
    color: #b8322a;
    font-size: .625rem;
    font-weight: 700;
}
.menu-extra { display: none; }

/* celular: painel que desce abaixo do topo, com os submenus em sanfona */
@media (max-width: 991.98px) {
    .menu { display: none; }
    .menu.aberto { display: block; }
    .menu .container { padding: 0; }
    .menu { margin-bottom: 0; }
    .menu-lista { flex-direction: column; gap: 0; }
    .menu-lista > li { border-top: 1px solid rgba(255, 255, 255, .2); }
    .menu-lista > li.menu-inicio { display: block; }
    .menu-lista > li.menu-portal { margin-left: 0; }
    .menu-portal > .menu-item { padding: .75rem 1rem; }
    .menu-item,
    .menu-inicio > a {
        justify-content: space-between;
        width: 100%;
        height: auto;
        min-height: 3rem;
        padding: .75rem 1rem;
        font-size: .875rem;
    }
    .menu-inicio > a { justify-content: flex-start; gap: .625rem; }
    /* no celular o traço do ativo fica na lateral */
    .menu-item::after,
    .menu-inicio > a::after { left: 0; right: auto; top: 0; bottom: 0; width: 4px; height: auto; }
    .menu-item .seta { font-size: 1rem; }
    .submenu {
        position: static;
        display: none;
        min-width: 0;
        border-top: 0;
        border-radius: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        transition: none;
    }
    .menu-item[aria-expanded="true"] + .submenu { display: block; }
    .submenu a { padding: .75rem 1.5rem; white-space: normal; font-size: .9375rem; }
    .menu-extra {
        display: flex;
        flex-direction: column;
        gap: .875rem;
        padding: 1rem;
        background: #fff;
        border-bottom: 3px solid var(--laranja);
    }
    .menu-sites { display: flex; flex-wrap: wrap; gap: .5rem 1rem; padding-top: .75rem; border-top: 1px solid var(--borda); }
    .menu-sites a { color: var(--texto-suave); font-size: .8125rem; font-weight: 700; text-transform: uppercase; text-decoration: none; }
}

/* 5. título da página ------------------------------------------------------------------------ */
.titulo-pagina { margin-bottom: 1.25rem; }
/* o filete fica na largura do conteúdo (sem o respiro lateral do .container) */
.titulo-pagina .container {
    padding-top: .875rem;
    padding-bottom: .75rem;
    background: linear-gradient(#fcbc75, #fcbc75) center bottom / calc(100% - 2rem) 3px no-repeat;
}
.trilha ol {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--texto-suave);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
}
.trilha li + li::before { content: '/'; margin: 0 .375rem; }
.trilha a { color: var(--ciano-texto); text-decoration: none; }
.trilha a:hover { text-decoration: underline; }
.titulo-pagina h1 {
    margin: .25rem 0 0;
    color: var(--texto-forte);
    font-size: 1.5rem;
}

main { display: block; padding-bottom: 2rem; }
main.inicio { padding-top: 0; }

/* 6. lateral (Quem Somos, Conheça) ----------------------------------------------------------- */
.com-lateral {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
}
.lateral { flex: 0 0 14.375rem; }
.lateral-titulo {
    padding: 0 .875rem .5rem;
    color: var(--texto-suave);
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .6px;
    text-transform: uppercase;
}
.lateral ul {
    margin: 0;
    padding: .375rem 0;
    list-style: none;
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: 10px;
    box-shadow: var(--sombra);
}
.lateral a {
    display: block;
    padding: .625rem .875rem;
    border-left: 3px solid transparent;
    color: var(--texto);
    font-size: .875rem;
    text-decoration: none;
    transition: background .12s, color .12s, border-color .12s;
}
.lateral a:hover { background: var(--ciano-claro); color: var(--ciano-texto); border-left-color: var(--ciano); }
.lateral a[aria-current] { background: var(--ciano-claro); color: var(--azul); font-weight: 700; border-left-color: var(--laranja); }
.lateral-conteudo { flex: 1 1 auto; min-width: 0; }

/* no celular a lateral vira uma fileira de botões que rola de lado */
@media (max-width: 759.98px) {
    .com-lateral { flex-direction: column; gap: 1rem; }
    .lateral { flex: none; width: 100%; }
    .lateral-titulo { display: none; }
    .lateral ul {
        display: flex;
        gap: .5rem;
        padding: 0 0 .25rem;
        overflow-x: auto;
        border: 0;
        box-shadow: none;
        background: none;
        scrollbar-width: thin;
    }
    .lateral a {
        padding: .4375rem .875rem;
        border: 1px solid var(--borda);
        border-radius: 999px;
        white-space: nowrap;
        font-size: .8125rem;
        font-weight: 700;
    }
    .lateral a[aria-current] { background: var(--ciano); border-color: var(--ciano); color: #fff; }
}

/* 7. textos (card-texto) --------------------------------------------------------------------- */
.card-texto {
    padding: 1.625rem 1.875rem 1.75rem;
    background: #fff;
    border: 1px solid var(--borda);
    border-left: 5px solid var(--ciano);
    border-radius: var(--raio);
    box-shadow: var(--sombra);
}
.card-texto h2 {
    margin: 0 0 .25rem;
    color: var(--azul);
    font-size: 1.5rem;
}
.card-texto .lead { margin: 0 0 1.125rem; font-size: 1rem; line-height: 1.55; }
.card-texto p {
    margin: 0 0 .875rem;
    font-size: .9375rem;
    line-height: 1.7;
    text-align: justify;
    hyphens: auto;
}
.card-texto p:last-child { margin-bottom: 0; }
.card-texto strong { color: var(--texto-forte); }

.marcos { display: flex; gap: .75rem; margin: 1.125rem 0 1.5rem; }
.marco {
    flex: 1 1 0;
    padding: 1rem 1rem .875rem;
    border: 1px solid #e3e5e8;
    border-radius: 8px;
}
.marco b { display: block; color: var(--azul); font-size: 1.625rem; line-height: 1; }
.marco b::after {
    content: '';
    display: block;
    width: 28px;
    height: 3px;
    margin: .625rem 0 .5rem;
    border-radius: 2px;
    background: var(--laranja);
}
.marco span { display: block; color: var(--texto-suave); font-size: .8125rem; line-height: 1.4; }

.difs { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.125rem 0 1.375rem; }
.dif {
    flex: 1 1 calc(50% - .375rem);
    min-width: 15rem;
    padding: 1rem 1.125rem;
    border-top: 3px solid var(--ciano);
    border-radius: 10px;
    background: var(--fundo-suave);
}
.dif .ico { font-size: 1.625rem; margin-bottom: .375rem; color: var(--ciano); }
.dif:nth-child(2) { border-top-color: var(--verde); } .dif:nth-child(2) .ico { color: var(--verde); }
.dif:nth-child(3) { border-top-color: var(--roxo); } .dif:nth-child(3) .ico { color: var(--roxo); }
.dif:nth-child(4) { border-top-color: var(--laranja); } .dif:nth-child(4) .ico { color: var(--laranja); }
.dif h3 { margin: 0 0 .375rem; font-size: .9375rem; }
.card-texto .dif p { margin: 0; font-size: .875rem; line-height: 1.55; text-align: left; }
.card-texto .lema {
    margin-top: 1.125rem;
    padding: .875rem 1.125rem;
    border-left: 4px solid var(--laranja);
    border-radius: 0 8px 8px 0;
    background: #fff8ef;
    color: #6b4a1e;
}

@media (max-width: 759.98px) {
    .card-texto { padding: 1.25rem 1.125rem 1.375rem; }
    .marcos { flex-wrap: wrap; }
    .marco { flex: 1 1 calc(50% - .375rem); }
    .dif { min-width: 0; flex-basis: 100%; }
}

/* 8. home ------------------------------------------------------------------------------------ */
.carrossel {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1024 / 340;
    background: #dfe3e8;
}
.carrossel-slide { margin: 0; }
.carrossel-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* com JavaScript os banners se sobrepõem e trocam por opacidade; sem ele aparece só o primeiro */
.carrossel-slide + .carrossel-slide { display: none; }
.carrossel.pronto .carrossel-slide {
    display: block;
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s, visibility 1s;
}
.carrossel.pronto .carrossel-slide.ativo { opacity: 1; visibility: visible; }
.carrossel-controles { display: none; }
.carrossel.pronto .carrossel-controles { display: block; }
.carrossel-anterior,
.carrossel-proxima,
.carrossel-pausa {
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, .45);
    color: #fff;
    cursor: pointer;
    transition: background .15s, opacity .15s;
}
.carrossel-anterior,
.carrossel-proxima { top: 50%; width: 2.75rem; height: 2.75rem; margin-top: -1.375rem; font-size: 1.5rem; opacity: 0; }
.carrossel-anterior { left: .75rem; }
.carrossel-proxima { right: .75rem; }
.carrossel:hover .carrossel-anterior,
.carrossel:hover .carrossel-proxima,
.carrossel-anterior:focus-visible,
.carrossel-proxima:focus-visible { opacity: 1; }
.carrossel-pausa { right: .75rem; bottom: .75rem; width: 2.25rem; height: 2.25rem; font-size: 1rem; }
.carrossel-pausa .tocar,
.carrossel-pausa.parado .pausar { display: none; }
.carrossel-pausa.parado .tocar { display: block; }
.carrossel-anterior:hover,
.carrossel-proxima:hover,
.carrossel-pausa:hover { background: rgba(0, 0, 0, .7); }
.carrossel-pontos {
    position: absolute;
    left: 0;
    right: 0;
    bottom: .875rem;
    z-index: 2;
    display: flex;
    justify-content: center;
    gap: .5rem;
}
.carrossel-pontos button {
    width: 12px;
    height: 12px;
    padding: 0;
    border: 2px solid #fff;
    border-radius: 50%;
    background: rgba(0, 0, 0, .3);
    cursor: pointer;
}
.carrossel-pontos button[aria-current="true"] { background: #fff; }
@media (hover: none) {
    .carrossel-anterior, .carrossel-proxima { display: none; }
}

.atalhos {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .875rem;
    margin: 1.125rem 0 .375rem;
}
.atalho {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .875rem 1rem;
    border: 1px solid var(--borda);
    border-left: 5px solid var(--ciano);
    border-radius: 10px;
    background: #fff;
    box-shadow: var(--sombra);
    color: var(--texto-forte);
    text-decoration: none;
    transition: transform .15s, box-shadow .15s;
}
.atalho:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0, 0, 0, .14); }
.atalho-icone {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 2.625rem;
    height: 2.625rem;
    border-radius: 50%;
    background: var(--ciano-claro);
    color: var(--ciano);
    font-size: 1.375rem;
}
.atalho strong { display: block; font-size: .9375rem; line-height: 1.15; }
.atalho small { display: block; margin-top: 2px; color: var(--texto-suave); font-size: .75rem; }
.atalho.laranja { border-left-color: var(--laranja); } .atalho.laranja .atalho-icone { background: var(--laranja-claro); color: var(--laranja); }
.atalho.verde { border-left-color: var(--verde); } .atalho.verde .atalho-icone { background: var(--verde-claro); color: var(--verde); }
.atalho.roxo { border-left-color: var(--roxo); } .atalho.roxo .atalho-icone { background: var(--roxo-claro); color: var(--roxo); }

.ultimas { margin-top: 1.25rem; }
.secao-cabeca {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: .5rem 0 .75rem;
}
.secao-cabeca h2,
.secao-titulo {
    display: flex;
    align-items: center;
    gap: .625rem;
    margin: 0;
    color: var(--texto-forte);
    font-size: 1.1875rem;
}
.secao-cabeca h2::before,
.secao-titulo::before {
    content: '';
    display: inline-block;
    flex: none;
    width: 5px;
    height: 20px;
    border-radius: 3px;
    background: var(--laranja);
}
.ver-todas { color: var(--azul); font-size: .875rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ver-todas:hover { text-decoration: underline; }
.ver-todas .ico { color: var(--laranja); }

.cartoes-noticia {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.cartao-noticia {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--borda);
    border-radius: 10px;
    background: #fff;
    box-shadow: var(--sombra);
    color: var(--texto-forte);
    text-decoration: none;
    transition: transform .15s, box-shadow .15s;
}
.cartao-noticia:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0, 0, 0, .14); }
.cartao-noticia-foto { position: relative; aspect-ratio: 16 / 9; background: #e7e8ea; }
.cartao-noticia-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cartao-noticia-data {
    position: absolute;
    left: .75rem;
    top: .75rem;
    width: 3.125rem;
    padding: .3125rem 0 .25rem;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
    color: #c46a00;
    font-size: .6875rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
}
.cartao-noticia-data b { display: block; margin-bottom: 2px; color: var(--texto-forte); font-size: 1.375rem; }
.cartao-noticia h3 {
    flex: 1 1 auto;
    margin: 0;
    padding: .75rem .875rem .375rem;
    color: var(--azul);
    font-size: .9375rem;
    line-height: 1.35;
}
.cartao-noticia:hover h3 { text-decoration: underline; }
.cartao-noticia-leia { padding: 0 .875rem .75rem; color: var(--texto-suave); font-size: .75rem; }

.aviso-vazio { padding: 2.5rem 0; color: var(--texto-suave); text-align: center; }

@media (max-width: 991.98px) {
    .atalhos { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 759.98px) {
    .cartoes-noticia { grid-template-columns: 1fr; }
    .carrossel-pontos { bottom: .5rem; }
}
@media (max-width: 479.98px) {
    .atalhos { gap: .5rem; margin-top: .75rem; }
    .atalho { flex-direction: column; align-items: flex-start; gap: .5rem; padding: .75rem; }
    .atalho small { display: none; }
    .carrossel-pontos { display: none; }
    .carrossel-pausa { right: .375rem; bottom: .375rem; width: 2rem; height: 2rem; }
}

/* 9. ensino ---------------------------------------------------------------------------------- */
.segmentos { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .875rem; }
.segmentos a {
    padding: .4375rem .875rem;
    border: 1px solid #e3e5e8;
    border-radius: 999px;
    background: #fff;
    color: var(--texto);
    font-size: .8125rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .12s, color .12s;
}
.segmentos a:hover { background: var(--ciano-claro); border-color: #c9ecf7; color: var(--ciano-texto); }
.segmentos a[aria-current] { background: var(--ciano); border-color: var(--ciano); color: #fff; }

.hero {
    position: relative;
    height: 18.75rem;
    margin-bottom: 1.125rem;
    overflow: hidden;
    border-radius: 14px;
    background: #dfe3e8;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}
.hero-imagem { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(20, 40, 80, .82) 0%, rgba(20, 40, 80, .35) 45%, rgba(20, 40, 80, 0) 75%);
}
.hero-texto { position: absolute; left: 1.625rem; right: 1.625rem; bottom: 1.375rem; z-index: 1; color: #fff; }
.hero-titulo {
    margin: 0 0 .375rem;
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}
.hero-slogan {
    display: inline-block;
    max-width: 38.75rem;
    margin: 0;
    padding: .5rem .875rem;
    border-radius: 8px;
    background: rgba(254, 138, 0, .92);
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1.4;
}
.hero.mini { height: 10.625rem; }
.hero.mini .hero-imagem { object-position: center 12%; }
.hero.mini .hero-titulo { font-size: 1.625rem; }
.hero.mini .hero-texto { bottom: 1.125rem; }

.colunas { display: flex; align-items: flex-start; gap: 1rem; }
.coluna-principal { flex: 1 1 auto; min-width: 0; }
.coluna-lateral { display: flex; flex: 0 0 18.125rem; flex-direction: column; gap: .875rem; }

.cartao {
    border: 1px solid var(--borda);
    border-radius: var(--raio);
    background: #fff;
    box-shadow: var(--sombra);
}
.cartao.texto { padding: 1.5rem 1.75rem 1.625rem; border-left: 5px solid var(--ciano); }
.cartao.texto > h2 { margin: 0 0 .75rem; color: var(--azul); font-size: 1.3125rem; }
.cartao.texto h3 { margin: 1.375rem 0 .5rem; color: var(--azul); font-size: 1.0625rem; line-height: 1.3; }
.cartao.texto h3:first-child,
.cartao.texto .bloco:first-child h3 { margin-top: 0; }
.cartao.texto p { margin: 0 0 .75rem; font-size: .9375rem; line-height: 1.7; text-align: justify; hyphens: auto; }
.cartao.texto p:last-child { margin-bottom: 0; }
.cartao.texto ul.itens { margin: 0 0 .75rem; padding-left: 1.25rem; font-size: .9375rem; line-height: 1.7; }
.citacao {
    margin: 0 0 1.125rem;
    padding: .75rem 1.125rem;
    border-left: 4px solid var(--laranja);
    border-radius: 0 8px 8px 0;
    background: #fff8ef;
    color: #6b4a1e;
    font-size: .9375rem;
}
.citacao p { margin: 0; }
.citacao footer { margin-top: .25rem; font-size: .8125rem; font-style: italic; }
.destaque {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: 1.25rem;
    padding: .875rem 1rem;
    border-radius: 10px;
    background: var(--verde-claro);
    color: #1f6b3a;
    font-size: .875rem;
    line-height: 1.45;
}
.destaque .ico { font-size: 1.625rem; color: var(--verde); }
.conheca-mais { margin-top: 1.25rem; padding-top: 1.125rem; border-top: 1px solid #eef0f2; }
.cartao.texto .conheca-mais h3 {
    margin: 0 0 .625rem;
    color: var(--texto-suave);
    font-size: .8125rem;
    letter-spacing: .5px;
    text-transform: uppercase;
}
.chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.chips a {
    padding: .5rem .875rem;
    border: 1px solid #c9ecf7;
    border-radius: 999px;
    background: var(--ciano-claro);
    color: var(--ciano-texto);
    font-size: .84375rem;
    font-weight: 700;
    text-decoration: none;
}
.chips a:hover { background: var(--ciano); border-color: var(--ciano); color: #fff; }

.cartao.info { padding: 1.125rem 1.25rem; }
.cartao.info h2 {
    display: flex;
    align-items: center;
    gap: .4375rem;
    margin: 0 0 .625rem;
    color: var(--texto-suave);
    font-size: .75rem;
    letter-spacing: .5px;
    text-transform: uppercase;
}
.cartao.info h2 .ico { color: var(--ciano); font-size: .9375rem; }
.info-nome { margin-bottom: .25rem; color: var(--azul); font-size: 1rem; font-weight: 700; }
.info-linha { font-size: .84375rem; line-height: 1.5; }
a.info-linha { display: flex; align-items: center; gap: .4375rem; margin-top: .375rem; color: var(--ciano-texto); text-decoration: none; word-break: break-word; }
a.info-linha:hover { text-decoration: underline; }
.responsavel { display: flex; align-items: center; gap: .75rem; }
.avatar {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    background: var(--laranja-claro);
    color: #c46a00;
    font-size: .9375rem;
    font-weight: 700;
}

.submenu-medio { flex: 0 0 14.375rem; }
.submenu-medio .voltar { margin: .625rem .875rem 0; font-size: .8125rem; }

@media (max-width: 759.98px) {
    .colunas { flex-direction: column; }
    .coluna-lateral,
    .submenu-medio { flex-basis: auto; width: 100%; }
    .hero { height: 13.75rem; }
    .hero-titulo { font-size: 1.625rem; }
    .hero-texto { left: 1rem; right: 1rem; bottom: 1rem; }
    .hero-slogan { font-size: .875rem; }
    .cartao.texto { padding: 1.25rem 1.125rem; }
}
@media (max-width: 479.98px) {
    .hero { height: auto; min-height: 13.75rem; }
    .hero-texto { position: relative; left: 0; right: 0; bottom: 0; padding: 6rem 1rem 1rem; }
}

/* 10. pessoas (Direção, Equipe Pedagógica) --------------------------------------------------- */
.pessoa {
    display: flex;
    align-items: flex-start;
    gap: 1.375rem;
    margin: 0 0 1rem;
    padding: 1.375rem 1.5rem;
    border: 1px solid var(--borda);
    border-left: 5px solid var(--ciano);
    border-radius: var(--raio);
    background: #fff;
    box-shadow: var(--sombra);
}
.pessoa-foto {
    flex: 0 0 8.125rem;
    width: 8.125rem;
    height: 9.375rem;
    overflow: hidden;
    border-radius: var(--raio);
    background: var(--ciano-claro);
}
/* as fotos são quadradas com fundo transparente e a cabeça rente ao topo: contain + base */
.pessoa-foto img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.pessoa-foto.vazia { display: flex; align-items: center; justify-content: center; color: var(--ciano-texto); font-size: 2.75rem; font-weight: 700; }
.pessoa-dados { flex: 1 1 auto; min-width: 0; }
.pessoa-nome { margin: 0; color: var(--azul); font-size: 1.1875rem; }
.pessoa-cargo { display: block; margin: .25rem 0 .75rem; color: var(--texto); font-size: .84375rem; font-weight: 700; }
.pessoa-bio { font-size: .875rem; }
.pessoa-bio p { margin: 0 0 .5rem; line-height: 1.55; text-align: left; }
.pessoa-bio p:last-child { margin-bottom: 0; }
@media (max-width: 599.98px) {
    .pessoa { flex-direction: column; padding: 1.125rem; }
}

/* 11. corpo docente -------------------------------------------------------------------------- */
.docentes-topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .875rem;
    margin-bottom: .875rem;
}
.docentes-topo h2 { margin: 0; color: var(--azul); font-size: 1.375rem; }
.docentes-topo h2 small { display: block; margin-top: 2px; color: var(--texto-suave); font-size: .8125rem; font-weight: 400; }
.docentes-busca { position: relative; flex: 0 0 16.25rem; }
.docentes-busca input {
    width: 100%;
    padding: .5625rem .75rem .5625rem 2.125rem;
    border: 1px solid #b9bcc0;
    border-radius: 999px;
    background: #fff;
    color: var(--texto-forte);
    font: .875rem var(--fonte);
}
.docentes-busca input:focus { border-color: var(--ciano); outline: 2px solid var(--acess-foco); outline-offset: 1px; }
.docentes-busca .ico { position: absolute; left: .75rem; top: 50%; margin-top: -.5rem; color: var(--texto-suave); }
.docentes-segmento {
    margin-bottom: .875rem;
    overflow: hidden;
    border: 1px solid var(--borda);
    border-left: 5px solid var(--ciano);
    border-radius: var(--raio);
    background: #fff;
    box-shadow: var(--sombra);
}
.docentes-segmento h3 {
    display: flex;
    align-items: center;
    margin: 0;
    padding: .6875rem 1rem;
    border-bottom: 1px solid #e7e8ea;
    background: var(--fundo-suave);
    font-size: .9375rem;
}
.docentes-qtd {
    margin-left: auto;
    padding: 2px .5625rem;
    border: 1px solid #e7e8ea;
    border-radius: 999px;
    background: #fff;
    color: var(--ciano-texto);
    font-size: .75rem;
}
.docentes-segmento ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin: 0;
    padding: .5rem .75rem;
    list-style: none;
}
.docentes-segmento li { display: flex; align-items: center; gap: .5625rem; padding: .375rem; font-size: .875rem; color: #3a3c3e; }
.docentes-segmento .avatar { width: 1.875rem; height: 1.875rem; background: var(--ciano-claro); color: var(--ciano-texto); font-size: .6875rem; }
.docentes-segmento.s5 { border-left-color: var(--verde); } .docentes-segmento.s5 .docentes-qtd, .docentes-segmento.s5 .avatar { color: var(--verde-texto); } .docentes-segmento.s5 .avatar { background: var(--verde-claro); }
.docentes-segmento.s6 { border-left-color: var(--roxo); } .docentes-segmento.s6 .docentes-qtd, .docentes-segmento.s6 .avatar { color: #5e43a6; } .docentes-segmento.s6 .avatar { background: var(--roxo-claro); }
.docentes-segmento.s2 { border-left-color: var(--laranja); } .docentes-segmento.s2 .docentes-qtd, .docentes-segmento.s2 .avatar { color: #a85800; } .docentes-segmento.s2 .avatar { background: var(--laranja-claro); }
.docentes-nota { margin: .375rem .25rem 0; color: var(--texto-suave); font-size: .75rem; }
@media (max-width: 599.98px) {
    .docentes-topo { flex-direction: column; align-items: stretch; }
    .docentes-busca { flex-basis: auto; }
    .docentes-segmento ul { grid-template-columns: 1fr; }
}

/* 12. bolsas --------------------------------------------------------------------------------- */
.bolsas-intro { display: flex; align-items: flex-start; gap: 1.375rem; }
.bolsas-intro .card-texto { flex: 1 1 auto; }
.solicitar {
    flex: 0 0 15.625rem;
    padding: 1.25rem 1.25rem 1.125rem;
    border-radius: var(--raio);
    background: var(--azul);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
    color: #fff;
}
.solicitar h2 { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem; color: #fff; font-size: 1rem; }
.solicitar p { margin: 0 0 .75rem; font-size: .84375rem; line-height: 1.5; }
.solicitar strong { color: #ffd9a8; }
.solicitar .telefone {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .4375rem .875rem;
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-size: .9375rem;
    font-weight: 700;
    text-decoration: none;
}
.solicitar .telefone:hover { background: #fff; color: var(--azul); }
.secao-titulo { margin: 1.375rem .25rem .75rem; }
.descontos { display: grid; grid-template-columns: repeat(2, 1fr); gap: .875rem; }
.desconto {
    padding: 1.125rem 1.25rem;
    border: 1px solid var(--borda);
    border-top: 4px solid var(--ciano);
    border-radius: var(--raio);
    background: #fff;
    box-shadow: var(--sombra);
}
.desconto-selo {
    display: inline-block;
    margin-bottom: .5rem;
    padding: .25rem .6875rem;
    border-radius: 999px;
    background: var(--ciano-claro);
    color: var(--ciano-texto);
    font-size: .8125rem;
    font-weight: 700;
}
.desconto:nth-child(2) { border-top-color: var(--verde); } .desconto:nth-child(2) .desconto-selo { background: var(--verde-claro); color: var(--verde-texto); }
.desconto:nth-child(3) { border-top-color: var(--laranja); } .desconto:nth-child(3) .desconto-selo { background: var(--laranja-claro); color: #a85800; }
.desconto:nth-child(4) { border-top-color: var(--roxo); } .desconto:nth-child(4) .desconto-selo { background: var(--roxo-claro); color: #5e43a6; }
.desconto:nth-child(5) { border-top-color: var(--azul); } .desconto:nth-child(5) .desconto-selo { background: #e8eef8; color: var(--azul); }
.desconto h3 { margin: 0 0 .375rem; font-size: 1rem; }
.desconto p { margin: 0; font-size: .875rem; line-height: 1.55; }

.lista-pdf {
    overflow: hidden;
    border: 1px solid var(--borda);
    border-left: 5px solid var(--laranja);
    border-radius: var(--raio);
    background: #fff;
    box-shadow: var(--sombra);
}
.lista-pdf h3 { margin: 0; padding: .6875rem 1rem; border-bottom: 1px solid #e7e8ea; background: var(--fundo-suave); font-size: .9375rem; }
.lista-pdf ul { margin: 0; padding: .25rem 0; list-style: none; }
.lista-pdf li + li { border-top: 1px solid #f0f1f2; }
.lista-pdf a { display: flex; align-items: center; gap: .625rem; padding: .625rem 1rem; color: #3a3c3e; font-size: .875rem; text-decoration: none; }
.lista-pdf a:hover { background: #f2fafd; color: var(--ciano-texto); }
.lista-pdf .selo-pdf { margin-left: 0; }
.lista-pdf .ico { margin-left: auto; color: #9a9c9f; }
@media (max-width: 759.98px) {
    .bolsas-intro { flex-direction: column; }
    .solicitar { flex-basis: auto; width: 100%; }
    .descontos { grid-template-columns: 1fr; }
}

/* 13. calendário ----------------------------------------------------------------------------- */
.documentos { font-size: .9375rem; line-height: 1.45; }
.documentos .intro { margin: 0 0 1.625rem; color: var(--texto-suave); }
.documentos section { margin-bottom: 2rem; }
.documentos h2 {
    margin: 0 0 .375rem;
    padding-bottom: .375rem;
    border-bottom: 2px solid var(--laranja);
    font-size: 1.0625rem;
}
.documentos ul { margin: 0; padding: 0; list-style: none; }
.documentos li {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .25rem 1rem;
    padding: .625rem 0;
    border-bottom: 1px solid #ececec;
}
.documentos li:last-child { border-bottom: 0; }
.documentos .nome { flex: 1 1 16rem; }
.documentos .opcoes { display: flex; flex-wrap: wrap; gap: .25rem 0; }
.documentos .opcoes a + a::before { content: '·'; margin: 0 .5rem; color: #9a9c9f; }
.documentos a { color: var(--azul); text-decoration: none; }
.documentos a:hover { text-decoration: underline; }
.documentos .formato { color: var(--texto-suave); font-size: .75rem; letter-spacing: .4px; text-transform: uppercase; }
.documentos .principal .nome a { color: #b35f00; font-size: 1rem; font-weight: 700; }
.documentos .obs { margin-top: .5rem; color: var(--texto-suave); font-size: .8125rem; }
.documentos .obs a { color: inherit; }

/* 14. aplicativo ----------------------------------------------------------------------------- */
.aplicativo { color: #333; font-size: .9375rem; }
.aplicativo h2 {
    margin: 0 0 .875rem;
    padding-bottom: .375rem;
    border-bottom: 2px solid var(--laranja);
    font-size: 1.0625rem;
}
.aplicativo section { margin-bottom: 2.25rem; }
.aplicativo p { margin: 0 0 .625rem; }
.app-abertura { display: flex; align-items: center; gap: 2rem; margin-bottom: 2.5rem; }
.app-abertura-texto { flex: 1 1 auto; }
.app-abertura h2 { margin: 0 0 .625rem; padding: 0; border: 0; color: var(--azul); font-size: 1.625rem; }
.app-chamada { max-width: 35rem; color: #444; font-size: 1rem; }
.lojas { display: flex; flex-wrap: wrap; gap: .625rem; margin-top: 1rem; }
.lojas img { display: block; width: auto; height: 2.875rem; }
.qrcode { flex: none; padding: 1rem; border: 1px solid #e3e5e8; border-radius: 8px; text-align: center; }
.qrcode img { display: block; width: 10.625rem; height: 10.625rem; margin: 0 auto .5rem; }
.qrcode small { display: block; max-width: 11.25rem; color: var(--texto-suave); font-size: .75rem; line-height: 1.4; }
.app-lado-a-lado { display: flex; align-items: flex-start; gap: 1.75rem; }
.passos { flex: 1 1 auto; margin: 0; padding: 0; list-style: none; counter-reset: passo; }
.passos li { position: relative; padding: 0 0 1.125rem 2.875rem; counter-increment: passo; }
.passos li::before {
    content: counter(passo);
    position: absolute;
    left: 0;
    top: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--azul);
    color: #fff;
    font-weight: 700;
    line-height: 2rem;
    text-align: center;
}
.passos h3 { margin: .25rem 0; font-size: 1rem; }
.app-tela { flex: 0 0 16.25rem; width: 16.25rem; border-radius: 8px; }
.app-funcoes { flex: 0 0 23.75rem; width: 23.75rem; }
.recursos { flex: 1 1 auto; margin: 0; padding: 0; list-style: none; }
.recursos li { padding: .75rem 0; border-bottom: 1px solid #ececec; }
.recursos li:last-child { border-bottom: 0; }
.recursos b { display: block; margin-bottom: 2px; color: #222; font-size: .96875rem; }
.recursos span { color: #555; font-size: .875rem; }
.app-fim {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.375rem 1.5rem;
    border-radius: 8px;
    background: #f7f7f7;
}
.app-fim p { margin: 0; }
.app-fim b { display: block; color: #222; font-size: 1rem; }
.botao {
    display: inline-block;
    flex: none;
    padding: .625rem 1.25rem;
    border-radius: 4px;
    background: #b35f00;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}
.botao:hover { background: #8f4c00; }
@media (max-width: 759.98px) {
    .app-abertura, .app-lado-a-lado, .app-fim { flex-direction: column; align-items: stretch; }
    .app-tela, .app-funcoes { flex-basis: auto; width: 100%; max-width: 23.75rem; margin-inline: auto; }
    .qrcode { align-self: center; }
}

/* 15. notícias ------------------------------------------------------------------------------- */
.noticias-lista { color: #333; }
.noticias-lista a { color: inherit; text-decoration: none; }
.noticia-data { color: var(--texto-suave); font-size: .75rem; letter-spacing: .4px; text-transform: uppercase; }
.noticias-lista h2,
.noticias-lista h3 { margin: .125rem 0 .25rem; color: var(--azul); line-height: 1.3; }
.noticias-lista a:hover h2,
.noticias-lista a:hover h3 { text-decoration: underline; }
.noticia-resumo { margin: .25rem 0 0; color: #555; font-size: .875rem; line-height: 1.5; }
.noticia-principal {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: .5rem;
    padding-bottom: 1.375rem;
    border-bottom: 2px solid var(--laranja);
}
.noticia-principal .noticia-foto { flex: 0 0 28.75rem; aspect-ratio: 23 / 15; }
.noticia-principal h2 { margin: .375rem 0 .5rem; font-size: 1.5rem; }
.noticia-principal .noticia-resumo { font-size: .9375rem; }
.noticia-item { display: flex; align-items: flex-start; gap: 1.125rem; padding: 1rem 0; border-bottom: 1px solid #ececec; }
.noticia-item:last-of-type { border-bottom: 0; }
.noticia-item .noticia-foto { flex: 0 0 11.25rem; aspect-ratio: 3 / 2; }
.noticia-item h3 { font-size: 1.0625rem; }
.noticia-foto { overflow: hidden; border-radius: 6px; background: #eee; }
.noticia-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.noticias-mais { margin-top: 1.5rem; padding-top: .875rem; border-top: 1px solid #ececec; font-size: .875rem; }
.noticias-mais a { color: var(--azul) !important; font-weight: 700; }
.noticias-mais a:hover { text-decoration: underline !important; }
@media (max-width: 759.98px) {
    .noticia-principal { flex-direction: column; }
    .noticia-principal .noticia-foto { flex-basis: auto; width: 100%; }
    .noticia-item .noticia-foto { flex-basis: 7.5rem; }
    .noticia-item .noticia-resumo { display: none; }
}

/* notícia aberta */
.noticia { max-width: 48rem; margin-inline: auto; color: #444; }
.noticia-cabeca { margin-bottom: 1.25rem; }
.noticia-antetitulo { margin: 0 0 .25rem; color: var(--texto-suave); font-size: 1rem; font-weight: 700; }
.noticia h2.noticia-titulo { margin: .25rem 0 .5rem; color: var(--ciano-texto); font-size: 1.75rem; line-height: 1.2; }
.noticia-subtitulo { margin: 0 0 .75rem; color: var(--texto-suave); font-size: 1.0625rem; font-style: italic; }
.noticia-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; color: var(--texto-suave); font-size: .875rem; }
.compartilhar { display: flex; align-items: center; gap: .375rem; }
.compartilhar a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--azul);
    color: #fff;
    font-size: 1rem;
}
.compartilhar a:hover { background: var(--azul-escuro); }
.noticia-capa { float: right; width: 23.75rem; max-width: 50%; margin: 0 0 1rem 1.25rem; }
.noticia-capa img { display: block; width: 100%; border-radius: 6px; }
.noticia-capa figcaption { margin-top: .25rem; color: var(--texto-suave); font-size: .75rem; }
.noticia-corpo { font-size: 1rem; line-height: 1.7; text-align: justify; hyphens: auto; overflow-wrap: break-word; }
.noticia-corpo::after { content: ''; display: block; clear: both; }
.noticia-corpo img { max-width: 100%; height: auto !important; }
.noticia-corpo iframe { max-width: 100%; }
.noticia-assinatura { clear: both; margin-top: 1rem; color: var(--texto-suave); font-size: .875rem; }
.noticia-galeria {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr));
    gap: .5rem;
    margin: 1.5rem 0 0;
    padding: .75rem;
    border-radius: 8px;
    background: #eef0f2;
}
.noticia-galeria a { display: block; aspect-ratio: 1; overflow: hidden; border-radius: 4px; }
.noticia-galeria img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.noticia-galeria a:hover img { transform: scale(1.05); }
.relacionadas { margin-top: 2.25rem; }
.relacionadas ul { margin: 0; padding: 0; list-style: none; }
.relacionadas li { padding: .75rem 0; border-bottom: 1px solid #ececec; }
.relacionadas a { color: var(--ciano-texto); font-size: 1.0625rem; text-decoration: none; }
.relacionadas a:hover { text-decoration: underline; }
.relacionadas p { margin: .125rem 0 0; color: var(--texto-suave); font-size: .8125rem; }
.etiquetas { display: flex; flex-wrap: wrap; gap: .375rem; margin: 1.75rem 0 0; padding: 0; list-style: none; }
.etiquetas li { padding: .25rem .625rem; border-radius: 4px; background: var(--azul); color: #fff; font-size: .8125rem; }
.voltar { display: inline-flex; align-items: center; gap: .375rem; margin-top: 2rem; color: var(--azul); font-weight: 700; text-decoration: none; }
.voltar:hover { text-decoration: underline; }
@media (max-width: 599.98px) {
    .noticia h2.noticia-titulo { font-size: 1.375rem; }
    .noticia-capa { float: none; width: 100%; max-width: none; margin: 0 0 1rem; }
    .noticia-corpo { text-align: left; }
}

/* 16. galeria -------------------------------------------------------------------------------- */
.fotos {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(13.4375rem, 1fr));
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.fotos a {
    display: block;
    overflow: hidden;
    aspect-ratio: 215 / 155;
    border-radius: 6px;
    background: #e7e8ea;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, .25);
}
.fotos img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); transition: filter .3s, transform .3s; }
.fotos a:hover img,
.fotos a:focus-visible img { filter: none; transform: scale(1.03); }
@media (max-width: 479.98px) {
    .fotos { grid-template-columns: repeat(2, 1fr); gap: .5rem; }
}

.galeria-visor {
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;
    margin: 0;
    padding: 3.5rem 4rem;
    border: 0;
    background: rgba(0, 0, 0, .92);
    color: #fff;
}
.galeria-visor::backdrop { background: rgba(0, 0, 0, .6); }
.galeria-visor figure { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; margin: 0; }
.galeria-visor img { max-width: 100%; max-height: calc(100% - 2rem); object-fit: contain; }
.galeria-visor figcaption { margin-top: .5rem; font-size: .875rem; text-align: center; }
.galeria-fechar,
.galeria-anterior,
.galeria-proxima {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .15);
    color: #fff;
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
}
.galeria-fechar:hover,
.galeria-anterior:hover,
.galeria-proxima:hover { background: rgba(255, 255, 255, .3); }
.galeria-fechar { top: .75rem; right: .75rem; }
.galeria-anterior { left: .75rem; top: 50%; margin-top: -1.5rem; }
.galeria-proxima { right: .75rem; top: 50%; margin-top: -1.5rem; }
.galeria-visor.uma .galeria-anterior,
.galeria-visor.uma .galeria-proxima { display: none; }
.galeria-contador { position: absolute; left: 1rem; top: 1.25rem; font-size: .875rem; }
@media (max-width: 599.98px) {
    .galeria-visor { padding: 3.5rem .5rem; }
    .galeria-anterior, .galeria-proxima { top: auto; bottom: .75rem; margin-top: 0; }
}

/* vídeo responsivo */
.video { position: relative; aspect-ratio: 16 / 9; margin-bottom: 1.5rem; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 8px; }

/* 17. mapa do site --------------------------------------------------------------------------- */
.mapa-site {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: 1.25rem 2rem;
}
.mapa-site h2 { margin: 0 0 .5rem; padding-bottom: .375rem; border-bottom: 2px solid var(--laranja); font-size: 1rem; }
.mapa-site h2 a { color: inherit; text-decoration: none; }
.mapa-site ul { margin: 0; padding: 0; list-style: none; }
.mapa-site li { padding: .3125rem 0; }
.mapa-site li a { color: var(--ciano-texto); font-size: .9375rem; text-decoration: none; }
.mapa-site li a:hover { text-decoration: underline; }
.mapa-site .separador { display: none; }
.mapa-site .selo-pdf { margin-left: .375rem; }

/* 18. rodapé --------------------------------------------------------------------------------- */
.rodape { background: var(--azul); color: #fff; font-size: .8125rem; line-height: 1.5; }
.rodape-grade {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 1.5rem;
    padding-top: 1.75rem;
    padding-bottom: 1.5rem;
}
.rodape-marca img { width: 12.5rem; }
.rodape-redes { display: flex; gap: .375rem; margin-top: 1rem; }
.rodape-redes a { background: rgba(255, 255, 255, .15); }
.rodape-redes a:hover { background: var(--laranja); }
.rodape-bloco { display: flex; flex-direction: column; gap: .25rem; padding-left: .5rem; border-left: 4px solid #fff; }
.rodape-bloco h2 { margin: 0 0 .25rem; color: #fff; font-size: .8125rem; text-transform: uppercase; letter-spacing: .5px; }
.rodape a { color: #fff; text-decoration: none; }
.rodape-bloco a:hover { text-decoration: underline; }
.rodape-base { border-top: 1px solid rgba(255, 255, 255, .25); font-size: .75rem; }
.rodape-base .container { display: flex; flex-direction: column; gap: .5rem; padding-top: .875rem; padding-bottom: .875rem; }
.rodape-base p { margin: 0; opacity: .85; }
.rodape-base address { display: flex; flex-direction: column; font-style: normal; }
@media (max-width: 759.98px) {
    .rodape-grade { grid-template-columns: 1fr 1fr; }
    .rodape-marca { grid-column: 1 / -1; }
}
@media (max-width: 419.98px) {
    .rodape-grade { grid-template-columns: 1fr; }
}

/* 19. alto contraste ------------------------------------------------------------------------- */
/* Mesmas regras do site. Tudo começa por html.alto-contraste:is(#ac-id, *): o :is() dá peso de
   id ao seletor, para o !important daqui vencer qualquer regra do layout; dentro do :where() o
   resto não pesa. O VLibras ([vw]) fica de fora: tem as próprias cores. Destaque em ciano #0ff
   (16,7:1 sobre o preto). */
html.alto-contraste:is(#ac-id, *) body,
html.alto-contraste:is(#ac-id, *) :where(*:not([vw], [vw] *, img, video, iframe, svg, svg *, .hero, .hero *, dialog, dialog *)) {
    background-color: #000 !important;
    background-image: none !important;
    color: #fff !important;
    border-color: #fff !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
html.alto-contraste:is(#ac-id, *) :where(a:not([vw] *)),
html.alto-contraste:is(#ac-id, *) :where(a:not([vw] *) *) {
    color: #0ff !important;
}
html.alto-contraste:is(#ac-id, *) :where(a:not([vw] *)) { text-decoration: underline !important; }
html.alto-contraste:is(#ac-id, *) :where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid #0ff !important;
    outline-offset: 2px;
}
html.alto-contraste:is(#ac-id, *) ::placeholder { color: #ccc !important; opacity: 1; }
/* botão de fundo cheio vira preto como o resto; sem borda ele some */
html.alto-contraste:is(#ac-id, *) :where(button:not([vw] *, .acess *, .menu-item), .botao, .chips a, .segmentos a) {
    border: 1px solid #fff !important;
}
/* faixa do menu: só um filete branco embaixo para separar do conteúdo; traço do ativo em ciano */
html.alto-contraste:is(#ac-id, *) .menu { border-bottom: 1px solid #fff !important; }
html.alto-contraste:is(#ac-id, *) .menu-lista :where(.menu-item, .menu-inicio > a)::after { background: #0ff !important; }
html.alto-contraste:is(#ac-id, *) :where(.segmentos a[aria-current], .lateral a[aria-current]) {
    background-color: #0ff !important;
    color: #000 !important;
}
/* logos coloridos somem no fundo preto */
html.alto-contraste:is(#ac-id, *) :where(.logo img, .rodape-marca img) { filter: brightness(0) invert(1); }
/* foto do segmento com o título por cima: a foto fica, escurecida, e o texto branco vai por cima */
html.alto-contraste:is(#ac-id, *) .hero::after { background: rgba(0, 0, 0, .72) !important; }
html.alto-contraste:is(#ac-id, *) .hero :where(.hero-titulo, .hero-slogan) {
    background: transparent !important;
    color: #fff !important;
    text-shadow: none !important;
}
html.alto-contraste:is(#ac-id, *) .hero-slogan { padding-left: 0 !important; }
/* fotos da galeria ficam coloridas: o cinza era só enfeite */
html.alto-contraste:is(#ac-id, *) .fotos img { filter: none; }
html.alto-contraste:is(#ac-id, *) .galeria-visor { background: #000 !important; }
html.alto-contraste:is(#ac-id, *) .galeria-visor :where(button) { background: #000 !important; color: #fff !important; border: 1px solid #fff !important; }
html.alto-contraste:is(#ac-id, *) .acess-chave { border: 1px solid #fff; }
html.alto-contraste:is(#ac-id, *) .acess [aria-checked="true"] .acess-chave { background-color: #0ff !important; }
html.alto-contraste:is(#ac-id, *) .acess [aria-checked="true"] .acess-chave::after { background: #000 !important; }

/* 20. menos movimento ------------------------------------------------------------------------ */
/* Quem pediu ao sistema para reduzir movimento não vê animação, transição nem rolagem suave. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}