/* ============================================
   COLÉGIO MONTESSORI — STYLE.CSS
   Estilos globais + Headers múltiplos
   ============================================ */


/* ************************************************************
   GLOBAL — Reset, Variáveis, Base, Container, Footer
   ************************************************************ */

/* ---------- CSS VARIABLES ---------- */
:root {
    --primary: #1a3a6b;
    --primary-light: #2557a7;
    --accent: #e63946;
    --accent-hover: #c1121f;
    --white: #ffffff;
    --gray-light: #f8f9fa;
    --gray-medium: #6c757d;
    --gray-dark: #343a40;
    --text: #2d3436;
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.16);
    --radius: 8px;
    --radius-pill: 50px;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --font-title: 'Montserrat', sans-serif;
    --font-body: 'Inter', sans-serif;
}

/* ---------- RESET & BASE ---------- */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    font-family: var(--font-body);
    color: var(--text);
    line-height: 1.6;
    background-color: var(--gray-light);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    text-decoration: none;
    color: inherit;
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

button {
    border: none;
    background: none;
    cursor: pointer;
    font-family: inherit;
}

/* ---------- CONTAINER ---------- */
.container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- FOCUS VISIBLE ---------- */
:focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 2px;
    border-radius: 2px;
}

/* ---------- FOOTER ---------- */
.site-footer {
    background: var(--primary);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
}

/* Área principal */
.footer__main {
    padding: 60px 0 40px;
}

.footer__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

/* Colunas */
.footer__col {
    display: flex;
    flex-direction: column;
}

/* Logo */
.footer__logo {
    display: inline-block;
    margin-bottom: 16px;
    max-width: 160px;
}

.footer__logo img {
    width: 100%;
    height: auto;
    border-radius: 6px;
}

/* Texto sobre */
.footer__about {
    line-height: 1.7;
    margin-bottom: 20px;
    font-size: 0.88rem;
}

/* Redes sociais */
.footer__social {
    display: flex;
    gap: 10px;
}

.footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: var(--white);
    font-size: 1.1rem;
    transition: var(--transition);
}

.footer__social-link:hover {
    transform: translateY(-3px);
}

.footer__social-link--instagram:hover {
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
}

.footer__social-link--whatsapp:hover {
    background: #25d366;
}

.footer__social-link--email:hover {
    background: var(--accent);
}

/* Títulos das colunas */
.footer__heading {
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 12px;
}

.footer__heading::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 35px;
    height: 3px;
    background: var(--accent);
    border-radius: 2px;
}

/* Lista de links */
.footer__links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.footer__links a {
    color: rgba(255, 255, 255, 0.7);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.2s ease, padding-left 0.2s ease;
    font-size: 0.88rem;
}

.footer__links a i {
    font-size: 0.6rem;
    color: var(--accent);
}

.footer__links a:hover {
    color: var(--white);
    padding-left: 4px;
}

/* Lista de contato */
.footer__contact {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.footer__contact li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 0.88rem;
}

.footer__contact li i {
    width: 16px;
    text-align: center;
    color: var(--accent);
    margin-top: 3px;
    flex-shrink: 0;
}

.footer__contact a {
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.2s ease;
}

.footer__contact a:hover {
    color: var(--white);
}

/* Horários */
.footer__schedule {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

.footer__schedule-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 8px;
}

.footer__schedule-day {
    font-size: 0.85rem;
}

.footer__schedule-time {
    font-weight: 700;
    color: var(--white);
    font-size: 0.85rem;
}

/* CTA Agendar visita */
.footer__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 24px;
    background: #25d366;
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.85rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    transition: var(--transition);
}

.footer__cta:hover {
    background: #20bf5e;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.35);
}

/* Barra inferior */
.footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 20px 0;
}

.footer__bottom-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
}

.footer__copyright {
    font-size: 0.82rem;
    margin: 0;
}

.footer__legal {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
}

.footer__legal li {
    display: inline-flex;
    align-items: center;
}

.footer__legal li + li::before {
    content: "";
    display: inline-block;
    width: 1px;
    height: 12px;
    background: rgba(255, 255, 255, 0.25);
    margin-right: 16px;
}

.footer__legal a {
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color 0.2s ease;
}

.footer__legal a:hover,
.footer__legal a:focus-visible {
    color: var(--white);
    text-decoration: underline;
}

.footer__dev {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.78rem;
    transition: color 0.2s ease;
}

.footer__dev:hover {
    color: rgba(255, 255, 255, 0.8);
}

.footer__dev img {
    height: 40px;
    width: auto;
    opacity: 0.6;
    transition: opacity 0.2s ease;
}

.footer__dev a {
    display: inline-flex;
    line-height: 0;
}

.footer__dev:hover img {
    opacity: 1;
}

/* Tablet */
@media (min-width: 768px) {
    .footer__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 30px;
    }
    .footer__bottom-inner {
        flex-direction: row;
        justify-content: space-between;
    }
}

/* Desktop */
@media (min-width: 1024px) {
    .footer__main { padding: 70px 0 50px; }
    .footer__grid {
        grid-template-columns: 1.4fr 1fr 1.2fr 1fr;
        gap: 40px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .footer__main { padding: 50px 0 30px; }
    .footer__schedule-item { padding: 8px 12px; }
}

/* ---------- HERO PLACEHOLDER ---------- */
.hero-placeholder {
    height: 200vh;
    padding: 140px 20px 40px;
    text-align: center;
}

.hero-placeholder h1 {
    font-family: var(--font-title);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 16px;
}

.hero-placeholder p {
    font-size: 1.1rem;
    color: var(--gray-medium);
}


/* ************************************************************
   HEADER 01 — Original (Top Bar + Main Header branco)
   Arquivo: inc/header.inc.php
   ************************************************************ */

/* ---------- TOP BAR (H1) ---------- */
.top-bar {
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
    height: 40px;
    display: flex;
    align-items: center;
    transition: var(--transition);
    overflow: hidden;
}

.top-bar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}

.top-bar__left,
.top-bar__right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.top-bar__link {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.8rem;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: var(--transition);
    white-space: nowrap;
}

.top-bar__link:hover {
    color: var(--white);
}

.top-bar__link i {
    font-size: 0.75rem;
}

.top-bar__social {
    display: flex;
    align-items: center;
    gap: 10px;
}

.top-bar__social-link {
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.85rem;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: var(--transition);
}

.top-bar__social-link:hover {
    color: var(--white);
    background: rgba(255, 255, 255, 0.15);
    transform: translateY(-1px);
}

/* ---------- SEARCH BOX (H1) ---------- */
.search-box {
    display: flex;
    align-items: center;
    position: relative;
}

.search-box__toggle {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.8rem;
    padding: 4px;
    transition: var(--transition);
}

.search-box__toggle:hover {
    color: var(--white);
}

.search-box__form {
    overflow: hidden;
    width: 0;
    opacity: 0;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.3s ease;
}

.search-box--active .search-box__form {
    width: 200px;
    opacity: 1;
}

.search-box__input {
    width: 100%;
    height: 28px;
    padding: 0 10px;
    border: none;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.15);
    color: var(--white);
    font-size: 0.8rem;
    font-family: var(--font-body);
    outline: none;
    backdrop-filter: blur(4px);
}

.search-box__input::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

/* ---------- MAIN HEADER (H1) ---------- */
.main-header {
    background: var(--white);
    height: 80px;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    position: relative;
    z-index: 100;
}

.main-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}

.main-header__logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.main-header__logo img {
    height: 60px;
    width: auto;
    transition: var(--transition);
}

/* ---------- MAIN NAV Desktop (H1) ---------- */
.main-nav {
    display: none;
}

.main-nav__list {
    display: flex;
    align-items: center;
    gap: 4px;
}

.main-nav__item {
    position: relative;
}

.main-nav__link {
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--gray-dark);
    padding: 8px 16px;
    display: block;
    position: relative;
    transition: color 0.3s ease;
}

.main-nav__link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 16px;
    right: 16px;
    height: 2px;
    background: var(--accent);
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.main-nav__link:hover {
    color: var(--primary);
}

.main-nav__link:hover::after,
.main-nav__item--active .main-nav__link::after {
    transform: scaleX(1);
}

/* ---------- DROPDOWN Desktop (H1) ---------- */
.dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    padding: 8px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.25s ease,
                visibility 0.25s ease,
                transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 200;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.main-nav__item--has-dropdown.is-open > .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown__link {
    display: block;
    padding: 10px 20px;
    font-size: 0.85rem;
    color: var(--gray-dark);
    transition: var(--transition);
}

.dropdown__link:hover {
    background: var(--gray-light);
    color: var(--primary);
    padding-left: 24px;
}

/* ---------- ACTIONS (H1) ---------- */
.main-header__actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

/* ---------- BOTÃO MATRÍCULA (H1) ---------- */
.btn-matricula {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 28px;
    background: linear-gradient(135deg, var(--accent) 0%, #d62839 100%);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: var(--radius-pill);
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(230, 57, 70, 0.3);
}

.btn-matricula:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(230, 57, 70, 0.45);
    background: linear-gradient(135deg, var(--accent-hover) 0%, #a4161a 100%);
}

.btn-matricula:active {
    transform: translateY(0);
}

.btn-matricula--mobile {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 30px;
    padding: 14px 28px;
    font-size: 1rem;
}

/* ---------- HAMBURGER (H1) ---------- */
.hamburger {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    gap: 5px;
    z-index: 1001;
    position: relative;
}

.hamburger__line {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--gray-dark);
    border-radius: 2px;
    transition: var(--transition);
    transform-origin: center;
}

.hamburger--active .hamburger__line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.hamburger--active .hamburger__line:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}

.hamburger--active .hamburger__line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* ---------- MOBILE MENU (H1) ---------- */
.mobile-menu {
    position: fixed;
    inset: 0;
    z-index: 999;
    pointer-events: none;
    visibility: hidden;
}

.mobile-menu--active {
    pointer-events: auto;
    visibility: visible;
}

.mobile-menu__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease;
    backdrop-filter: blur(2px);
}

.mobile-menu--active .mobile-menu__overlay {
    opacity: 1;
}

.mobile-menu__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: 100%;
    background: var(--white);
    padding: 100px 30px 40px;
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    box-shadow: var(--shadow-lg);
}

.mobile-menu--active .mobile-menu__panel {
    transform: translateX(0);
}

.mobile-nav__item {
    opacity: 0;
    transform: translateX(20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.mobile-menu--active .mobile-nav__item {
    opacity: 1;
    transform: translateX(0);
}

.mobile-menu--active .mobile-nav__item:nth-child(1) { transition-delay: 0.1s; }
.mobile-menu--active .mobile-nav__item:nth-child(2) { transition-delay: 0.15s; }
.mobile-menu--active .mobile-nav__item:nth-child(3) { transition-delay: 0.2s; }
.mobile-menu--active .mobile-nav__item:nth-child(4) { transition-delay: 0.25s; }
.mobile-menu--active .mobile-nav__item:nth-child(5) { transition-delay: 0.3s; }

.mobile-nav__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 16px 0;
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 600;
    color: var(--gray-dark);
    transition: color 0.2s ease;
}

a.mobile-nav__link:hover,
button.mobile-nav__link:hover {
    color: var(--primary);
}

.mobile-nav__link i {
    font-size: 0.7rem;
    transition: transform 0.3s ease;
}

.mobile-nav__item--has-dropdown.is-open .mobile-nav__link i {
    transform: rotate(180deg);
}

.mobile-dropdown {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-nav__item--has-dropdown.is-open .mobile-dropdown {
    max-height: 300px;
}

.mobile-dropdown__link {
    display: block;
    padding: 10px 0 10px 16px;
    font-size: 0.9rem;
    color: var(--gray-medium);
    transition: var(--transition);
    border-left: 2px solid transparent;
}

.mobile-dropdown__link:hover {
    color: var(--primary);
    border-left-color: var(--accent);
    padding-left: 20px;
}

/* ---------- STICKY STATE (H1) ---------- */
.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
}

.site-header--sticky .top-bar {
    height: 0;
    overflow: hidden;
    opacity: 0;
}

.site-header--sticky .main-header {
    box-shadow: var(--shadow-md);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.site-header--sticky .main-header__logo img {
    height: 45px;
}

/* ---------- RESPONSIVE (H1) ---------- */
@media (min-width: 768px) {
    .search-box--active .search-box__form {
        width: 240px;
    }
}

@media (min-width: 1024px) {
    .main-nav {
        display: block;
    }

    .hamburger {
        display: none;
    }

    .top-bar__link--contact span {
        display: inline;
    }
}

@media (max-width: 767px) {
    .top-bar {
        height: 0;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .main-header {
        height: 65px;
    }

    .main-header__logo img {
        height: 45px;
    }

    .btn-matricula:not(.btn-matricula--mobile) {
        display: none;
    }

    .hero-placeholder {
        padding: 100px 20px 40px;
    }

    .hero-placeholder h1 {
        font-size: 1.8rem;
    }
}

@media (max-width: 1023px) {
    .top-bar__link--contact span {
        display: none;
    }
}


/* ************************************************************
   HEADER 02 — Moderno (Barra única, busca overlay, design clean)
   Arquivo: inc/header2.inc.php
   ************************************************************ */

/* ---------- BARRA PRINCIPAL (H2) ---------- */
.h2-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
}

.h2-bar {
    background: var(--white);
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    position: relative;
    z-index: 100;
    border-bottom: 3px solid var(--accent);
}

.h2-bar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100px;
}

/* ---------- LOGO (H2) ---------- */
.h2-bar__logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.h2-bar__logo img {
    height: 87px;
    width: auto;
    transition: var(--transition);
}

/* ---------- CENTRO: Info + Nav empilhados (H2) ---------- */
.h2-bar__center {
    display: none;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex: 1;
    padding: 0 30px;
}

/* ---------- INFO STRIP (H2) ---------- */
.h2-info {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    width: 100%;
    justify-content: center;
}

.h2-info__link {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.72rem;
    color: var(--gray-medium);
    transition: color 0.2s ease;
    white-space: nowrap;
}

.h2-info__link:hover {
    color: var(--primary);
}

.h2-info__link i {
    font-size: 0.7rem;
    color: var(--primary-light);
}

.h2-info__divider {
    width: 1px;
    height: 12px;
    background: rgba(0, 0, 0, 0.12);
}

.h2-info__social {
    display: flex;
    align-items: center;
    gap: 6px;
}

.h2-info__social-link {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 0.7rem;
    color: var(--gray-medium);
    transition: var(--transition);
}

.h2-info__social-link:hover {
    color: var(--white);
    transform: translateY(-1px);
}

.h2-info__social-link[aria-label="Facebook"]:hover {
    background: #1877f2;
}

.h2-info__social-link[aria-label="Instagram"]:hover {
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
}

.h2-info__social-link[aria-label="WhatsApp"]:hover {
    background: #25d366;
}

/* ---------- NAV PRINCIPAL (H2 Desktop) ---------- */
.h2-nav {
    padding-top: 6px;
}

.h2-nav__list {
    display: flex;
    align-items: center;
    gap: 2px;
}

.h2-nav__item {
    position: relative;
}

.h2-nav__link {
    font-family: var(--font-title);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--gray-dark);
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    position: relative;
    transition: color 0.2s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.h2-nav__chevron {
    font-size: 0.6rem;
    transition: transform 0.3s ease;
    opacity: 0.75;
}

.h2-nav__item--has-dropdown.is-open .h2-nav__chevron {
    transform: rotate(180deg);
}

.h2-nav__link::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 14px;
    right: 14px;
    height: 2px;
    background: linear-gradient(90deg, var(--primary), var(--primary-light));
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.h2-nav__link:hover {
    color: var(--primary);
}

.h2-nav__link:hover::after {
    transform: scaleX(1);
}

/* ---------- DROPDOWN (H2 Desktop) ---------- */
.h2-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 240px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
    padding: 10px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity 0.25s ease,
                visibility 0.25s ease,
                transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 200;
    border: 1px solid rgba(0, 0, 0, 0.04);
}

.h2-nav__item--has-dropdown.is-open > .h2-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.h2-dropdown__link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 20px;
    font-size: 0.85rem;
    color: var(--gray-dark);
    transition: var(--transition);
}

.h2-dropdown__link i {
    width: 20px;
    text-align: center;
    font-size: 0.8rem;
    color: var(--primary-light);
    opacity: 0.7;
    transition: var(--transition);
}

.h2-dropdown__link:hover {
    background: linear-gradient(90deg, rgba(37, 87, 167, 0.06), transparent);
    color: var(--primary);
    padding-left: 24px;
}

.h2-dropdown__link:hover i {
    opacity: 1;
    color: var(--accent);
}

/* ---------- AÇÕES DIREITA (H2) ---------- */
.h2-bar__right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

/* Portal link */
.h2-portal {
    display: none;
    align-items: center;
    gap: 6px;
    font-family: var(--font-title);
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--primary);
    padding: 8px 14px;
    border-radius: var(--radius);
    border: 1.5px solid rgba(26, 58, 107, 0.2);
    transition: var(--transition);
    white-space: nowrap;
}

.h2-portal:hover {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}

.h2-portal i {
    font-size: 0.8rem;
}

/* Botão busca */
.h2-search-btn {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--gray-dark);
    font-size: 0.9rem;
    transition: var(--transition);
}

.h2-search-btn:hover {
    background: var(--gray-light);
    color: var(--primary);
}

/* Botão CTA Matrícula (H2) */
.h2-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px;
    background: linear-gradient(135deg, var(--accent) 0%, #d62839 100%);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.8px;
    border-radius: var(--radius-pill);
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(230, 57, 70, 0.3);
    white-space: nowrap;
}

.h2-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(230, 57, 70, 0.45);
    background: linear-gradient(135deg, var(--accent-hover) 0%, #a4161a 100%);
}

.h2-cta:active {
    transform: translateY(0);
}

.h2-cta i {
    font-size: 0.75rem;
}

.h2-cta--mobile {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 14px 24px;
    font-size: 0.9rem;
}

/* ---------- HAMBURGER (H2) ---------- */
.h2-hamburger {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    gap: 5px;
    z-index: 1001;
    position: relative;
}

.h2-hamburger__line {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--gray-dark);
    border-radius: 2px;
    transition: var(--transition);
    transform-origin: center;
}

.h2-hamburger__line:nth-child(2) {
    width: 16px;
    margin-left: auto;
}

.h2-hamburger--active .h2-hamburger__line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.h2-hamburger--active .h2-hamburger__line:nth-child(2) {
    opacity: 0;
    width: 0;
}

.h2-hamburger--active .h2-hamburger__line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* ---------- SEARCH OVERLAY (H2) ---------- */
.h2-search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(26, 58, 107, 0.95);
    z-index: 2000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 25vh;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.h2-search-overlay--active {
    opacity: 1;
    visibility: visible;
}

.h2-search-overlay__inner {
    width: 90%;
    max-width: 650px;
    transform: translateY(20px);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.h2-search-overlay--active .h2-search-overlay__inner {
    transform: translateY(0);
}

.h2-search-overlay__form {
    display: flex;
    align-items: center;
    background: var(--white);
    border-radius: 60px;
    padding: 6px 6px 6px 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.h2-search-overlay__icon {
    color: var(--gray-medium);
    font-size: 1.1rem;
    margin-right: 14px;
    flex-shrink: 0;
}

.h2-search-overlay__input {
    flex: 1;
    border: none;
    outline: none;
    font-family: var(--font-body);
    font-size: 1.1rem;
    color: var(--text);
    background: transparent;
    padding: 14px 0;
}

.h2-search-overlay__input::placeholder {
    color: var(--gray-medium);
}

.h2-search-overlay__close {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--gray-light);
    color: var(--gray-dark);
    font-size: 1.1rem;
    transition: var(--transition);
    flex-shrink: 0;
}

.h2-search-overlay__close:hover {
    background: var(--accent);
    color: var(--white);
}

/* ---------- MOBILE MENU (H2) ---------- */
.h2-mobile {
    position: fixed;
    inset: 0;
    z-index: 999;
    pointer-events: none;
    visibility: hidden;
}

.h2-mobile--active {
    pointer-events: auto;
    visibility: visible;
}

.h2-mobile__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.h2-mobile--active .h2-mobile__overlay {
    opacity: 1;
}

.h2-mobile__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: 340px;
    max-width: 88vw;
    height: 100%;
    background: var(--white);
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.h2-mobile--active .h2-mobile__panel {
    transform: translateX(0);
}

.h2-mobile__header {
    padding: 24px 24px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.h2-mobile__close {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--gray-dark);
    font-size: 1.25rem;
    transition: var(--transition);
}

.h2-mobile__close:hover {
    background: var(--gray-light);
    color: var(--accent);
}

.h2-mobile__logo {
    height: 45px;
    width: auto;
}

/* Nav mobile (H2) */
.h2-mobile__nav {
    flex: 1;
    padding: 8px 0;
}

.h2-mobile__list {
    padding: 0;
}

.h2-mobile__item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    opacity: 0;
    transform: translateX(16px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.h2-mobile--active .h2-mobile__item {
    opacity: 1;
    transform: translateX(0);
}

.h2-mobile--active .h2-mobile__item:nth-child(1) { transition-delay: 0.08s; }
.h2-mobile--active .h2-mobile__item:nth-child(2) { transition-delay: 0.12s; }
.h2-mobile--active .h2-mobile__item:nth-child(3) { transition-delay: 0.16s; }
.h2-mobile--active .h2-mobile__item:nth-child(4) { transition-delay: 0.20s; }
.h2-mobile--active .h2-mobile__item:nth-child(5) { transition-delay: 0.24s; }

.h2-mobile__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 15px 24px;
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--gray-dark);
    transition: color 0.2s ease, background 0.2s ease;
}

.h2-mobile__link span {
    display: flex;
    align-items: center;
    gap: 10px;
}

.h2-mobile__link span i {
    width: 20px;
    text-align: center;
    font-size: 0.85rem;
    color: var(--primary-light);
}

a.h2-mobile__link:hover,
button.h2-mobile__link:hover {
    color: var(--primary);
    background: rgba(37, 87, 167, 0.04);
}

.h2-mobile__toggle {
    font-size: 0.65rem;
    color: var(--gray-medium);
    transition: transform 0.3s ease;
}

.h2-mobile__item--has-dropdown.is-open .h2-mobile__toggle {
    transform: rotate(45deg);
}

.h2-mobile__dropdown {
    max-height: 0;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.015);
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.h2-mobile__item--has-dropdown.is-open .h2-mobile__dropdown {
    max-height: 300px;
}

.h2-mobile__dropdown a {
    display: block;
    padding: 11px 24px 11px 56px;
    font-size: 0.88rem;
    color: var(--gray-medium);
    transition: var(--transition);
}

.h2-mobile__dropdown a:hover {
    color: var(--primary);
    background: rgba(37, 87, 167, 0.04);
}

/* Footer do mobile menu (H2) */
.h2-mobile__footer {
    padding: 20px 24px 30px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.h2-mobile__contact {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.h2-mobile__contact a {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8rem;
    color: var(--gray-medium);
    transition: color 0.2s ease;
}

.h2-mobile__contact a:hover {
    color: var(--primary);
}

.h2-mobile__contact a i {
    width: 16px;
    text-align: center;
    color: var(--primary-light);
    font-size: 0.75rem;
}

.h2-mobile__social {
    display: flex;
    gap: 10px;
}

.h2-mobile__social a {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid rgba(0, 0, 0, 0.1);
    color: var(--gray-medium);
    font-size: 0.85rem;
    transition: var(--transition);
}

.h2-mobile__social a:hover {
    color: var(--white);
}

.h2-mobile__social a[aria-label="Facebook"]:hover {
    background: #1877f2;
    border-color: #1877f2;
}

.h2-mobile__social a[aria-label="Instagram"]:hover {
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
    border-color: #dc2743;
}

.h2-mobile__social a[aria-label="WhatsApp"]:hover {
    background: #25d366;
    border-color: #25d366;
}

/* ---------- STICKY STATE (H2) ---------- */
.h2-header--sticky .h2-bar {
    box-shadow: var(--shadow-md);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.h2-header--sticky .h2-bar__inner {
    height: 65px;
}

.h2-header--sticky .h2-bar__logo img {
    height: 50px;
}

.h2-header--sticky .h2-info {
    display: none;
}

/* ---------- RESPONSIVE (H2) — Tablet 768px+ ---------- */
@media (min-width: 768px) {
    .h2-cta span {
        display: inline;
    }
}

/* ---------- RESPONSIVE (H2) — Desktop 1024px+ ---------- */
@media (min-width: 1024px) {
    .h2-bar__center {
        display: flex;
    }

    .h2-hamburger {
        display: none;
    }

    .h2-portal {
        display: flex;
    }
}

/* ---------- RESPONSIVE (H2) — Mobile <768px ---------- */
@media (max-width: 767px) {
    .h2-bar__inner {
        height: 80px;
    }

    .h2-bar__logo img {
        height: 65px;
    }

    /* Sticky no mobile — manter logo grande */
    .h2-header--sticky .h2-bar__inner {
        height: 72px;
    }

    .h2-header--sticky .h2-bar__logo img {
        height: 55px;
    }

    .h2-cta:not(.h2-cta--mobile) {
        padding: 9px 18px;
        font-size: 0.7rem;
        gap: 5px;
    }

    .h2-cta:not(.h2-cta--mobile) span {
        display: inline;
    }

    .h2-cta:not(.h2-cta--mobile) i {
        font-size: 0.75rem;
    }

    .h2-hamburger {
        width: 44px;
        height: 44px;
        background: var(--gray-light);
        border-radius: var(--radius);
        gap: 5px;
    }

    .h2-hamburger__line {
        width: 22px;
        height: 2.5px;
    }

    .h2-hamburger__line:nth-child(2) {
        width: 22px;
        margin-left: 0;
    }

    .h2-search-overlay__input {
        font-size: 1rem;
    }
}


/* ************************************************************
   NÍVEIS DE ENSINO 01 — Cards com ícone, tag e accent bar
   Arquivo: inc/nivelensino.inc.php
   ************************************************************ */

/* ---------- SEÇÃO (NE1) ---------- */
.ne1 {
    padding: 80px 0;
    background: var(--white);
}

/* ---------- CABEÇALHO (NE1) ---------- */
.ne1__header {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 50px;
}

.ne1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.ne1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 16px;
}

.ne1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    line-height: 1.7;
}

/* ---------- GRID DE CARDS (NE1) ---------- */
.ne1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

/* ---------- CARD (NE1) ---------- */
.ne1__card {
    position: relative;
    background: var(--white);
    border-radius: 16px;
    padding: 32px 28px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.ne1__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 48px rgba(26, 58, 107, 0.12);
}

/* Barra accent na base do card */
.ne1__card-accent {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--primary), var(--primary-light));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.ne1__card:hover .ne1__card-accent {
    transform: scaleX(1);
}

/* ---------- IMAGEM DO CARD (NE1) ---------- */
.ne1__card-img {
    display: block;
    width: 100%;
    height: 200px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
}

.ne1__card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.ne1__card:hover .ne1__card-img img {
    transform: scale(1.06);
}

/* ---------- CONTEÚDO DO CARD (NE1) ---------- */
.ne1__card-tag {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px;
}

.ne1__card-title {
    font-family: var(--font-title);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--gray-dark);
    margin-bottom: 10px;
}

.ne1__card-text {
    font-size: 0.9rem;
    color: var(--gray-medium);
    line-height: 1.7;
    margin-bottom: 18px;
}

.ne1__card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-title);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--primary);
    transition: var(--transition);
}

.ne1__card-link i {
    font-size: 0.7rem;
    transition: transform 0.3s ease;
}

.ne1__card-link:hover {
    color: var(--accent);
}

.ne1__card-link:hover i {
    transform: translateX(4px);
}

/* ---------- RESPONSIVE (NE1) — Tablet 768px+ ---------- */
@media (min-width: 768px) {
    .ne1__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ne1__title {
        font-size: 2.4rem;
    }
}

/* ---------- RESPONSIVE (NE1) — Desktop 1024px+ ---------- */
@media (min-width: 1024px) {
    .ne1 {
        padding: 100px 0;
    }

    .ne1__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 28px;
    }

    .ne1__header {
        margin-bottom: 60px;
    }

    .ne1__title {
        font-size: 2.6rem;
    }
}

/* ---------- RESPONSIVE (NE1) — Mobile <768px ---------- */
@media (max-width: 767px) {
    .ne1 {
        padding: 60px 0;
    }

    .ne1__title {
        font-size: 1.8rem;
    }

    .ne1__card {
        padding: 24px 22px;
    }
}


/* ************************************************************
   DIFERENCIAIS 01 — Grid de ícones com hover
   Arquivo: inc/diferenciais.inc.php
   ************************************************************ */

/* ---------- SEÇÃO (DF1) ---------- */
.df1 {
    padding: 80px 0;
    background: var(--gray-light);
}

/* ---------- CABEÇALHO (DF1) ---------- */
.df1__header {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 50px;
}

.df1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.08), rgba(198, 18, 31, 0.08));
    color: var(--accent);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.df1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 16px;
}

.df1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    line-height: 1.7;
}

/* ---------- GRID (DF1) ---------- */
.df1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

/* ---------- ITEM (DF1) ---------- */
.df1__item {
    background: var(--white);
    border-radius: 16px;
    padding: 32px 28px;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.04);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.df1__item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--primary), var(--accent));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.df1__item:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 48px rgba(26, 58, 107, 0.1);
}

.df1__item:hover::before {
    transform: scaleX(1);
}

/* ---------- ÍCONE (DF1) ---------- */
.df1__item-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.07), rgba(37, 87, 167, 0.1));
    color: var(--primary);
    font-size: 1.4rem;
    transition: var(--transition);
}

.df1__item:hover .df1__item-icon {
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    color: var(--white);
    transform: scale(1.08) rotate(-5deg);
}

/* ---------- TEXTO (DF1) ---------- */
.df1__item-title {
    font-family: var(--font-title);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--gray-dark);
    margin-bottom: 10px;
}

.df1__item-text {
    font-size: 0.88rem;
    color: var(--gray-medium);
    line-height: 1.7;
}

/* ---------- RESPONSIVE (DF1) — Tablet 768px+ ---------- */
@media (min-width: 768px) {
    .df1__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .df1__title {
        font-size: 2.4rem;
    }
}

/* ---------- RESPONSIVE (DF1) — Desktop 1024px+ ---------- */
@media (min-width: 1024px) {
    .df1 {
        padding: 100px 0;
    }

    .df1__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .df1__header {
        margin-bottom: 60px;
    }

    .df1__title {
        font-size: 2.6rem;
    }
}

/* ---------- RESPONSIVE (DF1) — Mobile <768px ---------- */
@media (max-width: 767px) {
    .df1 {
        padding: 60px 0;
    }

    .df1__title {
        font-size: 1.8rem;
    }

    .df1__item {
        padding: 24px 20px;
    }
}


/* ************************************************************
   SOBRE O COLÉGIO 01 — Imagem + texto lado a lado
   Arquivo: inc/sobre.inc.php
   ************************************************************ */

.sb1 {
    padding: 80px 0;
    background: var(--white);
}

.sb1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}

/* Imagem */
.sb1__image {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
}

.sb1__image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 16px;
}

.sb1__image-badge {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: var(--primary);
    color: var(--white);
    padding: 14px 20px;
    border-radius: 12px;
    text-align: center;
    box-shadow: var(--shadow-lg);
}

.sb1__image-badge-number {
    display: block;
    font-family: var(--font-title);
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1;
}

.sb1__image-badge-text {
    font-size: 0.7rem;
    font-weight: 500;
    opacity: 0.85;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Conteúdo */
.sb1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.sb1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 20px;
}

.sb1__text {
    font-size: 0.95rem;
    color: var(--gray-medium);
    line-height: 1.8;
    margin-bottom: 14px;
}

.sb1__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.sb1__btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--primary);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: var(--radius-pill);
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(26, 58, 107, 0.25);
}

.sb1__btn-primary:hover {
    background: var(--primary-light);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(26, 58, 107, 0.35);
}

.sb1__btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 24px;
    border: 1.5px solid rgba(26, 58, 107, 0.2);
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: var(--radius-pill);
    transition: var(--transition);
}

.sb1__btn-secondary:hover {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}

.sb1__btn-secondary i {
    transition: transform 0.3s ease;
}

.sb1__btn-secondary:hover i {
    transform: translateX(4px);
}

@media (min-width: 1024px) {
    .sb1 { padding: 100px 0; }
    .sb1__grid { grid-template-columns: 1fr 1fr; gap: 60px; }
    .sb1__title { font-size: 2.6rem; }
}

@media (max-width: 767px) {
    .sb1 { padding: 60px 0; }
    .sb1__title { font-size: 1.8rem; }
}


/* ************************************************************
   NÚMEROS / CONQUISTAS 01 — Contadores animados
   Arquivo: inc/numeros.inc.php
   ************************************************************ */

.nm1 {
    padding: 60px 0;
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
    color: var(--white);
}

.nm1__sr-title {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.nm1__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    text-align: center;
}

.nm1__item {
    padding: 20px 10px;
}

.nm1__number {
    font-family: var(--font-title);
    font-size: 2.8rem;
    font-weight: 800;
    line-height: 1;
    display: inline;
}

.nm1__suffix {
    font-family: var(--font-title);
    font-size: 1.8rem;
    font-weight: 700;
    opacity: 0.8;
}

.nm1__label {
    font-size: 0.85rem;
    opacity: 0.8;
    margin-top: 8px;
    font-weight: 500;
}

@media (min-width: 768px) {
    .nm1__grid { grid-template-columns: repeat(4, 1fr); }
    .nm1__number { font-size: 3.2rem; }
}

@media (min-width: 1024px) {
    .nm1 { padding: 80px 0; }
    .nm1__number { font-size: 3.6rem; }
}


/* ************************************************************
   DEPOIMENTOS 01 — Carrossel de testemunhos
   Arquivo: inc/depoimentos.inc.php
   ************************************************************ */

/* Fundo branco: o cinza #f8f9fa era quase igual ao #f2f8ff que abre a seção
   seguinte, e as duas se fundiam. Com o branco, a onda branca da próxima
   seção passa a ser a fronteira entre elas. */
.dp1 {
    padding: 80px 0;
    background: var(--white);
    /* Em /equipe a seção anterior (eg1) também é branca — sem este fio as duas
       encostariam. Contra fundos escuros (nm1) ou coloridos (lr1) ele some. */
    border-top: 1px solid #eef2f6;
}

.dp1__header {
    text-align: center;
    margin-bottom: 50px;
}

.dp1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.08), rgba(198, 18, 31, 0.08));
    color: var(--accent);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.dp1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

.dp1__carousel {
    position: relative;
    max-width: 720px;
    margin: 0 auto;
}

.dp1__track {
    overflow: hidden;
}

.dp1__card {
    position: relative;
    display: none;
    background: var(--white);
    border-radius: 20px;
    padding: 44px 40px 36px;
    box-shadow: 0 14px 38px rgba(26, 58, 107, 0.1);
    border: 1px solid #edf1f6;
    text-align: center;
    animation: dp1FadeIn 0.5s ease;
}

/* Aspas de marca d'água — dá identidade à seção sem pesar */
.dp1__card::before {
    content: "\f10d";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    top: 20px;
    left: 26px;
    font-size: 2.4rem;
    line-height: 1;
    color: rgba(37, 87, 167, 0.09);
    pointer-events: none;
}

.dp1__card--active {
    display: block;
}

@keyframes dp1FadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.dp1__card-stars {
    color: #f5a623;
    font-size: 1.02rem;
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-bottom: 22px;
}

.dp1__card-text {
    font-size: 1.12rem;
    color: var(--text);
    line-height: 1.75;
    font-style: italic;
    margin-bottom: 26px;
    max-width: 52ch;
    margin-left: auto;
    margin-right: auto;
}

.dp1__card-text p {
    margin: 0;
}

/* Separador entre a citação e quem assina */
.dp1__card-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding-top: 22px;
    border-top: 1px solid #eef2f6;
    text-align: left;
}

.dp1__card-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
    overflow: hidden;
    box-shadow: 0 0 0 4px rgba(37, 87, 167, 0.09);
}

.dp1__card-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dp1__card-name {
    font-family: var(--font-title);
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--primary);
    font-style: normal;
    display: block;
}

.dp1__card-role {
    font-size: 0.8rem;
    color: var(--gray-medium);
}

/* Setas */
.dp1__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    /* Com a seção branca, a seta sem contorno sumia no fundo */
    border: 1px solid #e6ecf3;
    border-radius: 50%;
    background: var(--white);
    color: var(--primary);
    font-size: 0.82rem;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(26, 58, 107, 0.1);
    transition: var(--transition);
    display: none;
}

.dp1__arrow:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
    box-shadow: 0 8px 20px rgba(26, 58, 107, 0.2);
}

.dp1__arrow:focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 3px;
}

.dp1__arrow--prev { left: -60px; }
.dp1__arrow--next { right: -60px; }

/* Dots */
.dp1__dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.dp1__dot {
    width: 10px;
    height: 10px;
    border: none;
    border-radius: 50px;
    background: rgba(26, 58, 107, 0.2);
    cursor: pointer;
    padding: 0;
    transition: width 0.3s ease, background 0.3s ease;
}

.dp1__dot--active {
    width: 28px;
    background: var(--primary);
}

@media (min-width: 1024px) {
    .dp1 { padding: 100px 0; }
    .dp1__title { font-size: 2.6rem; }
    .dp1__arrow { display: flex; align-items: center; justify-content: center; }
}

@media (max-width: 767px) {
    .dp1 { padding: 60px 0; }
    .dp1__title { font-size: 1.8rem; }
    .dp1__card { padding: 28px 22px; }
}


/* ************************************************************
   CTA MATRÍCULA 01 — Faixa de destaque
   Arquivo: inc/cta-matricula.inc.php
   ************************************************************ */

/* Layout principal — full-width split */
.ct1 {
    color: var(--white);
    --ct1-field-radius: 10px;
}

.ct1__inner {
    display: flex;
    flex-direction: column;
    min-height: 420px;
}

/* Lado esquerdo — Chamada */
.ct1__left {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-hover) 100%);
    padding: 60px 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Brilho suave — dá profundidade ao bloco chapado, sem imagem */
.ct1__left::after {
    content: '';
    position: absolute;
    top: -35%;
    right: -18%;
    width: 68%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0) 70%);
    pointer-events: none;
}

.ct1__left-content {
    position: relative;
    z-index: 1;
    max-width: 520px;
}

/* Kicker acima do título */
.ct1__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--font-title);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    opacity: 0.92;
    margin-bottom: 14px;
}

.ct1__eyebrow::before {
    content: '';
    width: 28px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
}

.ct1__title {
    font-family: var(--font-title);
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -0.4px;
    text-transform: uppercase;
    margin-bottom: 14px;
    text-wrap: balance;
}

.ct1__text {
    font-size: 1rem;
    opacity: 0.94;
    line-height: 1.65;
    margin-bottom: 26px;
    max-width: 46ch;
}

.ct1__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ct1__badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 15px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: var(--radius-pill);
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.ct1__badge i {
    font-size: 0.88em;
    opacity: 0.9;
}

/* Seta decorativa — só aparece no desktop */
.ct1__arrow {
    display: none;
}

/* Lado direito — Formulário */
.ct1__right {
    background: var(--primary);
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ct1__form {
    width: 100%;
    max-width: 540px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.ct1__form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.ct1__form-group,
.ct1__form-group--full {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.ct1__label {
    font-family: var(--font-title);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    opacity: 0.9;
}

.ct1__input {
    width: 100%;
    padding: 13px 16px;
    border: 1px solid transparent;
    border-radius: var(--ct1-field-radius);
    font-family: var(--font-body);
    font-size: 0.92rem;
    /* var(--dark) nao existe no :root — herdava o branco da secao e sumia com o texto digitado */
    color: var(--text);
    background: var(--white);
    outline: none;
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.ct1__input:hover {
    border-color: rgba(255, 255, 255, 0.5);
}

.ct1__input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35), 0 4px 14px rgba(0, 0, 0, 0.14);
}

.ct1__input::placeholder {
    color: #9aa3ad;
}

/* Select com seta propria — o controle nativo destoava dos demais campos */
.ct1__select {
    cursor: pointer;
    appearance: none;
    padding-right: 44px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'><path d='M1 1.5 6 6.5l5-5' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 12px 8px;
}

/* Enquanto nada foi escolhido, "Selecione" se comporta como placeholder */
.ct1__select:invalid {
    color: #9aa3ad;
}

.ct1__select option {
    color: var(--text);
}

/* Rodapé do formulário */
.ct1__form-footer {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    margin-top: 6px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.ct1__consent {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ct1__checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.78rem;
    opacity: 0.9;
    cursor: pointer;
    line-height: 1.5;
    max-width: 44ch;
}

.ct1__checkbox {
    margin-top: 1px;
    width: 17px;
    height: 17px;
    accent-color: var(--accent);
    cursor: pointer;
    flex-shrink: 0;
}

.ct1__checkbox:focus-visible {
    outline: 2px solid var(--white);
    outline-offset: 2px;
}

.ct1__trust {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 0.73rem;
    opacity: 0.72;
}

.ct1__link {
    color: var(--white);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}

.ct1__link:hover {
    opacity: 0.75;
}

.ct1__btn-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 15px 34px;
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.92rem;
    font-weight: 700;
    letter-spacing: 0.3px;
    border: none;
    border-radius: var(--ct1-field-radius);
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22);
    transition: var(--transition);
    align-self: flex-end;
}

.ct1__btn-submit i {
    transition: transform 0.25s ease;
}

.ct1__btn-submit:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}

.ct1__btn-submit:hover i {
    transform: translateX(3px);
}

.ct1__btn-submit:active {
    transform: translateY(0);
}

.ct1__btn-submit:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.7);
    outline-offset: 3px;
}

/* Desktop — split horizontal com seta */
@media (min-width: 1024px) {
    .ct1__inner {
        flex-direction: row;
    }

    .ct1__left {
        flex: 1;
        padding: 76px 60px;
        position: relative;
    }

    .ct1__title {
        font-size: 2.35rem;
    }

    /* Seta decorativa entre as duas metades.
       Antes o triangulo era desenhado com border-width fixo de 210px, entao
       so fechava se a secao tivesse exatamente 420px de altura. O clip-path
       acompanha qualquer altura. */
    .ct1__arrow {
        display: block;
        width: 56px;
        flex-shrink: 0;
        background: var(--primary);
        position: relative;
    }

    .ct1__arrow::before {
        content: '';
        position: absolute;
        inset: 0;
        background: var(--accent-hover);
        clip-path: polygon(0 0, 0 100%, 100% 50%);
    }

    .ct1__right {
        flex: 1;
        padding: 56px 60px;
    }

    .ct1__form-footer {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
    }

    .ct1__btn-submit {
        align-self: auto;
    }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {
    .ct1__left { padding: 56px 40px; }
    .ct1__title { font-size: 2rem; }
    .ct1__right { padding: 44px 40px; }
}

/* Mobile */
@media (max-width: 767px) {
    .ct1__inner { min-height: 0; }
    .ct1__left { padding: 44px 20px; }
    .ct1__title { font-size: 1.55rem; }
    .ct1__text { margin-bottom: 20px; }
    .ct1__right { padding: 32px 20px; }
    .ct1__form-row { grid-template-columns: 1fr; gap: 18px; }
    .ct1__form-footer { align-items: stretch; }
    .ct1__btn-submit { width: 100%; align-self: stretch; }
}

/* Respeita quem pediu menos movimento */
@media (prefers-reduced-motion: reduce) {
    .ct1__input,
    .ct1__btn-submit,
    .ct1__btn-submit i {
        transition: none;
    }

    .ct1__btn-submit:hover,
    .ct1__btn-submit:hover i {
        transform: none;
    }
}


/* ************************************************************
   CTA MATRÍCULA 02 — Versão infantil (lúdica)
   Arquivo: resources/components/ctas/cta-matricula-infantil.inc.php
   Variante do ct1. Convivem na mesma página sem conflito.
   ************************************************************ */

.ct2 {
    position: relative;
    overflow: hidden;
    padding: 70px 20px 80px;
    background: linear-gradient(180deg, var(--ct2-bg-top) 0%, #fff6ec 100%);

    /* Azul um pouco mais presente: em #f2f8ff a seção quase encostava no
       branco do bloco anterior e as duas se confundiam. */
    --ct2-bg-top: #e8f1fd;
    --ct2-yellow: #ffc93c;
    --ct2-green: #3ec9a7;
    --ct2-coral: #ff7b6b;
    --ct2-purple: #a78bfa;
    --ct2-field-radius: 14px;
}

/* Onda de transição no topo — fica dentro da seção, sem sobrepor a anterior.
   A cor da seção de cima varia por página (branca, cinza ou azul-escuro),
   entao o branco funciona como divisor em qualquer uma delas. */
.ct2__wave {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    line-height: 0;
    pointer-events: none;
    z-index: 2;
}

.ct2__wave svg {
    display: block;
    width: 100%;
    height: 100%;
}

.ct2__wave path {
    fill: var(--white);
}

/* Manchas coloridas de fundo */
.ct2__blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    opacity: 0.35;
    pointer-events: none;
}

.ct2__blob--1 {
    top: 60px;
    left: -70px;
    width: 220px;
    height: 220px;
    background: var(--ct2-yellow);
}

.ct2__blob--2 {
    bottom: -60px;
    right: -50px;
    width: 260px;
    height: 260px;
    background: var(--ct2-green);
}

.ct2__blob--3 {
    top: 40%;
    right: 12%;
    width: 120px;
    height: 120px;
    background: var(--ct2-coral);
    opacity: 0.22;
}

/* Rabiscos */
.ct2__doodle {
    position: absolute;
    pointer-events: none;
    opacity: 0.5;
}

.ct2__doodle--1 {
    top: 90px;
    right: 8%;
    font-size: 1.6rem;
    color: var(--ct2-yellow);
    transform: rotate(14deg);
}

.ct2__doodle--2 {
    top: 150px;
    left: 9%;
    font-size: 2rem;
    color: var(--ct2-purple);
    opacity: 0.35;
}

.ct2__doodle--3 {
    bottom: 110px;
    left: 6%;
    font-size: 1.4rem;
    color: var(--ct2-coral);
    transform: rotate(-12deg);
}

.ct2__doodle--4 {
    bottom: 90px;
    right: 10%;
    font-size: 1.5rem;
    color: var(--ct2-green);
    transform: rotate(22deg);
}

.ct2__inner {
    position: relative;
    z-index: 1;
    max-width: 940px;
    margin: 0 auto;
}

/* Cabeçalho */
.ct2__head {
    text-align: center;
    margin-bottom: 34px;
}

.ct2__mascot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: var(--white);
    color: var(--primary);
    font-size: 1.7rem;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.1);
}

.ct2__eyebrow {
    display: block;
    font-family: var(--font-title);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 10px;
}

.ct2__title {
    font-family: var(--font-title);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.2;
    color: var(--primary);
    margin-bottom: 14px;
    text-wrap: balance;
}

/* Palavra destacada com traço de marca-texto */
.ct2__title-mark {
    position: relative;
    display: inline-block;
    z-index: 0;
    white-space: nowrap;
}

.ct2__title-mark::after {
    content: '';
    position: absolute;
    left: -6px;
    right: -6px;
    bottom: 2px;
    height: 38%;
    z-index: -1;
    border-radius: var(--radius-pill);
    background: var(--ct2-yellow);
}

.ct2__text {
    font-size: 1.02rem;
    line-height: 1.7;
    color: var(--gray-medium);
    max-width: 52ch;
    margin: 0 auto 22px;
}

.ct2__badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.ct2__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    border-radius: var(--radius-pill);
    background: var(--white);
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.07);
}

.ct2__badge:nth-child(1) i { color: var(--ct2-coral); }
.ct2__badge:nth-child(2) i { color: var(--ct2-green); }
.ct2__badge:nth-child(3) i { color: var(--ct2-purple); }
.ct2__badge:nth-child(4) i { color: var(--ct2-yellow); }

/* Cartão do formulário */
.ct2__card {
    background: var(--white);
    border-radius: 28px;
    padding: 36px;
    box-shadow: 0 18px 50px rgba(26, 58, 107, 0.13);
}

.ct2__form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.ct2__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.ct2__group,
.ct2__group--full {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.ct2__label {
    font-family: var(--font-title);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--primary);
}

/* Campo com ícone à esquerda */
.ct2__field {
    position: relative;
    display: flex;
}

.ct2__field-icon {
    position: absolute;
    top: 50%;
    left: 16px;
    transform: translateY(-50%);
    font-size: 0.92rem;
    color: var(--primary-light);
    opacity: 0.65;
    pointer-events: none;
}

.ct2__input {
    width: 100%;
    padding: 14px 16px 14px 44px;
    border: 2px solid #e8eef5;
    border-radius: var(--ct2-field-radius);
    background: #f8fbff;
    font-family: var(--font-body);
    font-size: 0.94rem;
    color: var(--text);
    outline: none;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.ct2__input::placeholder {
    color: #a3adb9;
}

.ct2__input:hover {
    border-color: #d5e2f0;
}

.ct2__input:focus {
    background: var(--white);
    border-color: var(--primary-light);
    box-shadow: 0 0 0 4px rgba(37, 87, 167, 0.13);
}

.ct2__select {
    cursor: pointer;
    appearance: none;
    padding-right: 44px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'><path d='M1 1.5 6 6.5l5-5' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 12px 8px;
}

.ct2__select:invalid {
    color: #a3adb9;
}

.ct2__select option {
    color: var(--text);
}

/* Rodapé do cartão */
.ct2__footer {
    display: flex;
    flex-direction: column;
    gap: 18px;
    align-items: flex-start;
    margin-top: 4px;
    padding-top: 20px;
    border-top: 2px dashed #e8eef5;
}

.ct2__checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--gray-medium);
    cursor: pointer;
    max-width: 46ch;
}

.ct2__checkbox {
    margin-top: 1px;
    width: 18px;
    height: 18px;
    accent-color: var(--accent);
    cursor: pointer;
    flex-shrink: 0;
}

.ct2__checkbox:focus-visible {
    outline: 2px solid var(--primary-light);
    outline-offset: 2px;
}

.ct2__link {
    color: var(--primary);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.ct2__link:hover {
    color: var(--accent);
}

.ct2__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 34px;
    border: none;
    border-radius: var(--radius-pill);
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.98rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 8px 20px rgba(230, 57, 70, 0.32);
    transition: var(--transition);
}

.ct2__btn i {
    transition: transform 0.25s ease;
}

.ct2__btn:hover {
    background: var(--accent-hover);
    transform: translateY(-3px);
    box-shadow: 0 12px 26px rgba(230, 57, 70, 0.38);
}

.ct2__btn:hover i {
    transform: translateX(3px) rotate(-12deg);
}

.ct2__btn:active {
    transform: translateY(0);
}

.ct2__btn:focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 3px;
}

/* Desktop */
@media (min-width: 1024px) {
    .ct2 { padding: 90px 20px 100px; }
    .ct2__title { font-size: 2.5rem; }
    .ct2__card { padding: 42px 46px; }

    .ct2__footer {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 26px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .ct2 { padding: 62px 16px 60px; }
    /* Onda menor: com 60px ela invadia o mascote no topo */
    .ct2__wave { height: 34px; }
    .ct2__title { font-size: 1.6rem; }
    .ct2__text { font-size: 0.95rem; }
    .ct2__card { padding: 24px 20px; border-radius: 22px; }
    .ct2__row { grid-template-columns: 1fr; }
    .ct2__footer { align-items: stretch; }
    .ct2__btn { width: 100%; }

    /* Rabiscos atrapalham em tela estreita */
    .ct2__doodle,
    .ct2__blob--3 { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ct2__input,
    .ct2__btn,
    .ct2__btn i {
        transition: none;
    }

    .ct2__btn:hover,
    .ct2__btn:hover i {
        transform: none;
    }
}


/* ************************************************************
   GALERIA 01 — Grid de fotos com overlay
   Arquivo: inc/galeria.inc.php
   ************************************************************ */

.gl1 {
    padding: 80px 0;
    background: var(--white);
}

.gl1__header {
    text-align: center;
    margin-bottom: 50px;
}

.gl1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.gl1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

.gl1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.gl1__item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    display: block;
    aspect-ratio: 4/3;
    /* GEO/AXO §C.20: item virou <button> (ação JS de lightbox) — reset de
       estilos nativos de botão + foco visível sobre imagem */
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    text-align: inherit;
    cursor: pointer;
    width: 100%;
}

.gl1__item:focus-visible {
    outline: 3px solid var(--white);
    outline-offset: 3px;
}

.gl1__item--wide {
    aspect-ratio: auto;
}

.gl1__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.gl1__item:hover img {
    transform: scale(1.06);
}

.gl1__item-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(26, 58, 107, 0.85) 0%, rgba(26, 58, 107, 0.2) 60%, transparent 100%);
    display: flex;
    align-items: flex-end;
    padding: 24px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.gl1__item:hover .gl1__item-overlay {
    opacity: 1;
}

.gl1__item-info {
    transform: translateY(12px);
    transition: transform 0.4s ease;
}

.gl1__item:hover .gl1__item-info {
    transform: translateY(0);
}

.gl1__item-title {
    font-family: var(--font-title);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--white);
    margin: 0 0 6px;
}

.gl1__item-desc {
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    line-height: 1.4;
}

@media (min-width: 768px) {
    .gl1__grid {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 280px;
    }
    .gl1__item--wide { grid-column: span 2; }
    .gl1__item { aspect-ratio: auto; }
}

@media (min-width: 1024px) {
    .gl1 { padding: 100px 0; }
    .gl1__title { font-size: 2.6rem; }
    .gl1__grid { gap: 16px; }
}

@media (max-width: 767px) {
    .gl1 { padding: 60px 0; }
    .gl1__title { font-size: 1.8rem; }
    .gl1__grid { grid-template-columns: repeat(2, 1fr); }
    .gl1__item--wide { grid-column: span 2; }
}


/* ************************************************************
   CONTATO 01 — Localização + Mapa
   Arquivo: inc/contato.inc.php
   ************************************************************ */

.cn1 {
    padding: 80px 0;
    background: var(--white);
}

.cn1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    align-items: stretch;
}

/* Informações — lado esquerdo */
.cn1__info {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Blocos viram cards com o mesmo tratamento. Antes eram três estilos
   diferentes (linha divisória, caixa cinza e texto solto), o que fazia a
   coluna parecer três pedaços sem relação entre si. */
.cn1__block {
    padding: 24px 26px;
    border: 1px solid #edf1f6;
    border-radius: 18px;
    background: var(--white);
    box-shadow: 0 6px 20px rgba(26, 58, 107, 0.06);
    transition: box-shadow 0.25s ease;
}

.cn1__block:hover {
    box-shadow: 0 12px 28px rgba(26, 58, 107, 0.1);
}

/* Os três blocos usam o mesmo card, inclusive o de Localização */

/* Cabeçalho com ícone + título */
.cn1__block-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}

.cn1__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.cn1__icon--red {
    background: rgba(230, 57, 70, 0.1);
    color: var(--accent);
}

.cn1__icon--green {
    background: rgba(37, 211, 102, 0.12);
    color: #1faa50;
}

/* Alinhado com as demais seções do site (navy, 2.2rem, sem caixa alta).
   Estava em vermelho maiúsculo, destoando de todos os títulos vizinhos. */
.cn1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.15;
    letter-spacing: -0.4px;
}

.cn1__subtitle {
    font-family: var(--font-title);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--primary);
    letter-spacing: -0.2px;
}

/* Endereço */
.cn1__address {
    font-size: 1.02rem;
    color: var(--gray-dark);
    line-height: 1.7;
    margin-bottom: 18px;
    padding-left: 58px;
}

/* Link destaque "Como chegar" */
.cn1__highlight {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 13px 26px;
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.84rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    border-radius: var(--radius-pill);
    box-shadow: 0 6px 16px rgba(230, 57, 70, 0.28);
    transition: var(--transition);
    margin-left: 58px;
}

.cn1__highlight i {
    transition: transform 0.25s ease;
}

.cn1__highlight:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(230, 57, 70, 0.34);
}

.cn1__highlight:hover i {
    transform: translateX(3px);
}

.cn1__highlight:focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 3px;
}

/* Telefone e WhatsApp lado a lado, como botões de contato */
.cn1__contacts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-left: 58px;
}

.cn1__contact-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    border: 1px solid #e6ecf3;
    border-radius: var(--radius-pill);
    background: var(--gray-light);
    font-size: 0.98rem;
    font-weight: 600;
    color: var(--gray-dark);
    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.cn1__contact-item i {
    text-align: center;
    color: var(--primary);
    font-size: 1rem;
}

.cn1__contact-item--whatsapp i {
    color: #1faa50;
}

.cn1__contact-item:hover {
    color: var(--primary);
    background: var(--white);
    border-color: var(--primary-light);
}

.cn1__contact-item--whatsapp:hover {
    color: #1faa50;
    border-color: #1faa50;
}

.cn1__contact-item:focus-visible {
    outline: 2px solid var(--primary-light);
    outline-offset: 2px;
}

/* Horário e E-mail */
.cn1__extras {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.cn1__extra-item {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.cn1__extra-item i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: rgba(37, 87, 167, 0.09);
    color: var(--primary);
    font-size: 0.9rem;
    flex-shrink: 0;
}

.cn1__extra-item strong {
    display: block;
    font-family: var(--font-title);
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 3px;
}

.cn1__extra-item p {
    font-size: 0.92rem;
    color: var(--gray-medium);
    line-height: 1.5;
    word-break: break-word;
}

.cn1__extra-item a {
    color: var(--primary);
    transition: color 0.2s ease;
}

.cn1__extra-item a:hover {
    color: var(--accent);
}

/* Mapa — lado direito */
.cn1__map-wrapper {
    display: flex;
}

.cn1__map {
    position: relative;
    width: 100%;
    min-height: 380px;
    border: 1px solid #e6ecf3;
    border-radius: 20px;
    overflow: hidden;
    background: var(--gray-light);
    box-shadow: 0 10px 34px rgba(26, 58, 107, 0.12);
}

.cn1__map iframe {
    display: block;
    border: 0;
    width: 100%;
    height: 100%;
    min-height: 380px;
}

/* Desktop */
@media (min-width: 1024px) {
    .cn1 { padding: 100px 0; }
    .cn1__grid {
        grid-template-columns: 1fr 1.15fr;
        gap: 44px;
    }
    .cn1__map { min-height: 100%; }
    .cn1__map iframe { min-height: 100%; }

    /* Horário e e-mail lado a lado — sobrava espaço vazio empilhados */
    .cn1__extras { grid-template-columns: 1fr 1fr; gap: 22px; }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {
    .cn1__grid { gap: 30px; }
    .cn1__extras { grid-template-columns: 1fr 1fr; gap: 20px; }
}

/* Mobile */
@media (max-width: 767px) {
    .cn1 { padding: 60px 0; }
    .cn1__title { font-size: 1.7rem; }
    .cn1__subtitle { font-size: 1.05rem; }
    .cn1__address { padding-left: 0; }
    .cn1__highlight { margin-left: 0; }
    .cn1__contacts { padding-left: 0; }
    .cn1__block { padding: 20px; }
    .cn1__contact-item { width: 100%; }
    .cn1__map { min-height: 300px; }
    .cn1__map iframe { min-height: 300px; }
}

@media (prefers-reduced-motion: reduce) {
    .cn1__highlight,
    .cn1__highlight i {
        transition: none;
    }

    .cn1__highlight:hover,
    .cn1__highlight:hover i {
        transform: none;
    }
}


/* ************************************************************
   HERO INTERNO 01 — Banner de páginas internas
   Arquivo: inc/hero-interno.inc.php
   ************************************************************ */

.hi1 {
    position: relative;
    padding: 100px 0 60px;
    background: linear-gradient(135deg, var(--primary) 0%, #0d2240 100%);
    color: var(--white);
    overflow: hidden;
}

.hi1__bg {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 80% 20%, rgba(37, 87, 167, 0.3) 0%, transparent 50%),
                radial-gradient(circle at 20% 80%, rgba(230, 57, 70, 0.1) 0%, transparent 50%);
}

.hi1__content {
    position: relative;
    z-index: 1;
}

/* Breadcrumb */
.hi1__breadcrumb ol {
    display: flex;
    align-items: center;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    font-size: 0.85rem;
}

.hi1__breadcrumb li {
    display: flex;
    align-items: center;
    gap: 8px;
}

.hi1__breadcrumb li + li::before {
    content: '›';
    color: rgba(255, 255, 255, 0.4);
    font-size: 1.1rem;
}

.hi1__breadcrumb a {
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.2s ease;
}

.hi1__breadcrumb a:hover {
    color: var(--white);
}

.hi1__breadcrumb li[aria-current="page"] {
    color: var(--accent);
    font-weight: 600;
}

/* Título */
.hi1__title {
    font-family: var(--font-title);
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1.2;
}

@media (min-width: 1024px) {
    .hi1 { padding: 130px 0 70px; }
    .hi1__title { font-size: 3rem; }
}

@media (max-width: 767px) {
    .hi1 { padding: 90px 0 40px; }
    .hi1__title { font-size: 1.8rem; }
}


/* ************************************************************
   HISTÓRIA 01 — Nossa História + Linha do Tempo
   Arquivo: inc/historia.inc.php
   ************************************************************ */

.ht1 {
    padding: 80px 0;
    background: var(--white);
}

/* Introdução — imagem + texto */
.ht1__intro {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
    margin-bottom: 80px;
}

.ht1__intro-image {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

.ht1__intro-image img {
    width: 100%;
    height: auto;
    display: block;
}

.ht1__intro-badge {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: var(--accent);
    color: var(--white);
    padding: 12px 20px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 15px rgba(230, 57, 70, 0.4);
}

.ht1__intro-badge-number {
    display: block;
    font-family: var(--font-title);
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1;
}

.ht1__intro-badge-text {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ht1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.ht1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 20px;
}

.ht1__text {
    font-size: 0.95rem;
    color: var(--gray-medium);
    line-height: 1.8;
    margin-bottom: 14px;
}

/* Linha do Tempo */
.ht1__timeline {
    position: relative;
    padding-top: 20px;
}

.ht1__timeline-title {
    font-family: var(--font-title);
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--primary);
    text-align: center;
    margin-bottom: 50px;
}

/* Linha central vertical */
.ht1__timeline-line {
    position: absolute;
    left: 20px;
    top: 100px;
    bottom: 0;
    width: 3px;
    background: linear-gradient(to bottom, var(--primary), var(--accent));
    border-radius: 2px;
}

.ht1__timeline-items {
    display: flex;
    flex-direction: column;
    gap: 30px;
    position: relative;
}

.ht1__timeline-item {
    position: relative;
    padding-left: 54px;
}

/* Ponto na linha */
.ht1__timeline-dot {
    position: absolute;
    left: 12px;
    top: 20px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--white);
    border: 3px solid var(--accent);
    z-index: 1;
    transition: var(--transition);
}

.ht1__timeline-item:hover .ht1__timeline-dot {
    background: var(--accent);
    transform: scale(1.3);
}

/* Card */
.ht1__timeline-card {
    background: var(--gray-light);
    border-radius: 12px;
    padding: 24px;
    transition: var(--transition);
    border-left: 3px solid transparent;
}

.ht1__timeline-item:hover .ht1__timeline-card {
    border-left-color: var(--accent);
    box-shadow: var(--shadow-md);
    transform: translateX(4px);
}

.ht1__timeline-year {
    display: inline-block;
    padding: 4px 12px;
    background: var(--primary);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.8rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    margin-bottom: 10px;
}

.ht1__timeline-card-title {
    font-family: var(--font-title);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 6px;
}

.ht1__timeline-card p {
    font-size: 0.88rem;
    color: var(--gray-medium);
    line-height: 1.6;
}

@media (min-width: 1024px) {
    .ht1 { padding: 100px 0; }
    .ht1__intro { grid-template-columns: 1fr 1fr; gap: 60px; }
    .ht1__title { font-size: 2.6rem; }

    /* Linha central no desktop */
    .ht1__timeline-line {
        left: 50%;
        transform: translateX(-50%);
    }

    .ht1__timeline-items {
        gap: 40px;
    }

    .ht1__timeline-item {
        width: 50%;
        padding-left: 0;
        padding-right: 40px;
    }

    .ht1__timeline-item:nth-child(even) {
        margin-left: 50%;
        padding-left: 40px;
        padding-right: 0;
    }

    .ht1__timeline-dot {
        left: auto;
        right: -9px;
    }

    .ht1__timeline-item:nth-child(even) .ht1__timeline-dot {
        left: -9px;
        right: auto;
    }

    .ht1__timeline-item:hover .ht1__timeline-card {
        transform: translateX(0);
    }

    .ht1__timeline-item:nth-child(odd) .ht1__timeline-card {
        text-align: right;
        border-left: none;
        border-right: 3px solid transparent;
    }

    .ht1__timeline-item:nth-child(odd):hover .ht1__timeline-card {
        border-right-color: var(--accent);
    }

    .ht1__timeline-item:nth-child(even):hover .ht1__timeline-card {
        border-left-color: var(--accent);
    }

    .ht1__timeline-item:nth-child(odd) .ht1__timeline-year {
        display: inline-block;
    }
}

@media (max-width: 767px) {
    .ht1 { padding: 60px 0; }
    .ht1__title { font-size: 1.8rem; }
    .ht1__intro { margin-bottom: 50px; }
    .ht1__timeline-title { font-size: 1.3rem; margin-bottom: 30px; }
    .ht1__timeline-card { padding: 18px; }
}


/* ************************************************************
   MISSÃO, VISÃO E VALORES 01 — Cards
   Arquivo: inc/missao.inc.php
   ************************************************************ */

.mv1 {
    padding: 80px 0;
    background: var(--gray-light);
}

.mv1__header {
    text-align: center;
    margin-bottom: 50px;
}

.mv1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.mv1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

.mv1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.mv1__card {
    background: var(--white);
    border-radius: 16px;
    padding: 36px 28px;
    text-align: center;
    transition: var(--transition);
    box-shadow: var(--shadow-sm);
    border-top: 4px solid transparent;
}

.mv1__card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
}

.mv1__card:nth-child(1):hover { border-top-color: var(--primary); }
.mv1__card:nth-child(2):hover { border-top-color: var(--accent); }
.mv1__card:nth-child(3):hover { border-top-color: #25d366; }

.mv1__card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    margin: 0 auto 20px;
    font-size: 1.5rem;
}

.mv1__card-icon--blue {
    background: rgba(26, 58, 107, 0.1);
    color: var(--primary);
}

.mv1__card-icon--red {
    background: rgba(230, 57, 70, 0.1);
    color: var(--accent);
}

.mv1__card-icon--green {
    background: rgba(37, 211, 102, 0.1);
    color: #25d366;
}

.mv1__card-title {
    font-family: var(--font-title);
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 12px;
}

.mv1__card-text {
    font-size: 0.9rem;
    color: var(--gray-medium);
    line-height: 1.7;
}

.mv1__values-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: left;
}

.mv1__values-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
    color: var(--gray-medium);
}

.mv1__values-list li i {
    color: #25d366;
    font-size: 0.75rem;
}

@media (min-width: 768px) {
    .mv1__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 1024px) {
    .mv1 { padding: 100px 0; }
    .mv1__title { font-size: 2.6rem; }
    .mv1__grid { gap: 30px; }
}

@media (max-width: 767px) {
    .mv1 { padding: 60px 0; }
    .mv1__title { font-size: 1.8rem; }
}


/* ************************************************************
   ESTRUTURA 01 — Infraestrutura do colégio
   Arquivo: inc/estrutura.inc.php
   ************************************************************ */

.et1 {
    padding: 80px 0;
    background: var(--white);
}

.et1__header {
    text-align: center;
    margin-bottom: 50px;
}

.et1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.08), rgba(198, 18, 31, 0.08));
    color: var(--accent);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.et1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 12px;
}

.et1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    max-width: 550px;
    margin: 0 auto;
    line-height: 1.7;
}

.et1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.et1__item {
    background: var(--gray-light);
    border-radius: 14px;
    padding: 28px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: var(--transition);
    border: 1px solid transparent;
}

.et1__item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: rgba(26, 58, 107, 0.1);
    background: var(--white);
}

.et1__item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 12px;
    background: var(--primary);
    color: var(--white);
    font-size: 1.3rem;
    margin-bottom: 16px;
    transition: var(--transition);
}

.et1__item:hover .et1__item-icon {
    background: var(--accent);
    transform: scale(1.1);
}

.et1__item-title {
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 6px;
}

.et1__item-text {
    font-size: 0.82rem;
    color: var(--gray-medium);
    line-height: 1.5;
}

@media (min-width: 768px) {
    .et1__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

@media (min-width: 1024px) {
    .et1 { padding: 100px 0; }
    .et1__title { font-size: 2.6rem; }
    .et1__grid { grid-template-columns: repeat(4, 1fr); gap: 24px; }
}

@media (max-width: 767px) {
    .et1 { padding: 60px 0; }
    .et1__title { font-size: 1.8rem; }
    .et1__grid { grid-template-columns: repeat(2, 1fr); }
}


/* ************************************************************
   LIGHTBOX — Modal de imagem expandida (reutilizável)
   ************************************************************ */

.lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.lightbox.lightbox--active {
    opacity: 1;
    visibility: visible;
}

/* Fundo escuro */
.lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.92);
    cursor: pointer;
}

/* Container da imagem */
.lightbox__content {
    position: relative;
    z-index: 1;
    max-width: 90vw;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: scale(0.9);
    transition: transform 0.3s ease;
}

.lightbox--active .lightbox__content {
    transform: scale(1);
}

.lightbox__img {
    max-width: 100%;
    max-height: 80vh;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    object-fit: contain;
    display: block;
}

/* Legenda */
.lightbox__caption {
    text-align: center;
    margin-top: 16px;
    color: var(--white);
}

.lightbox__caption-title {
    font-family: var(--font-title);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.lightbox__caption-desc {
    font-size: 0.85rem;
    opacity: 0.7;
}

/* Contador */
.lightbox__counter {
    position: absolute;
    top: 16px;
    left: 16px;
    color: rgba(255, 255, 255, 0.6);
    font-family: var(--font-title);
    font-size: 0.85rem;
    font-weight: 600;
    z-index: 2;
}

/* Botão fechar */
.lightbox__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 50%;
    color: var(--white);
    font-size: 1.3rem;
    cursor: pointer;
    transition: background 0.2s ease;
    z-index: 2;
}

.lightbox__close:hover {
    background: rgba(255, 255, 255, 0.25);
}

/* Setas de navegação */
.lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 50%;
    color: var(--white);
    font-size: 1.2rem;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
    z-index: 2;
}

.lightbox__nav:hover {
    background: rgba(255, 255, 255, 0.25);
}

.lightbox__nav--prev {
    left: 16px;
}

.lightbox__nav--prev:hover {
    transform: translateY(-50%) translateX(-3px);
}

.lightbox__nav--next {
    right: 16px;
}

.lightbox__nav--next:hover {
    transform: translateY(-50%) translateX(3px);
}

/* Mobile */
@media (max-width: 767px) {
    .lightbox__nav {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }
    .lightbox__nav--prev { left: 8px; }
    .lightbox__nav--next { right: 8px; }
    .lightbox__close { top: 8px; right: 8px; }
    .lightbox__counter { top: 12px; left: 12px; }
    .lightbox__caption-title { font-size: 0.95rem; }
}


/* ************************************************************
   METODOLOGIA 01 — 3 Pilares pedagógicos
   Arquivo: inc/metodologia.inc.php
   ************************************************************ */

.mt1 {
    padding: 80px 0;
    background: var(--white);
}

.mt1__header {
    text-align: center;
    margin-bottom: 50px;
}

.mt1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.mt1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 12px;
}

.mt1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.7;
}

.mt1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.mt1__card {
    background: var(--gray-light);
    border-radius: 16px;
    padding: 36px 28px;
    transition: var(--transition);
    border-top: 4px solid transparent;
}

.mt1__card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
    background: var(--white);
}

.mt1__card:nth-child(1):hover { border-top-color: var(--primary); }
.mt1__card:nth-child(2):hover { border-top-color: var(--accent); }
.mt1__card:nth-child(3):hover { border-top-color: #25d366; }

.mt1__card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 14px;
    margin-bottom: 20px;
    font-size: 1.4rem;
}

.mt1__card-icon--blue { background: rgba(26, 58, 107, 0.1); color: var(--primary); }
.mt1__card-icon--red { background: rgba(230, 57, 70, 0.1); color: var(--accent); }
.mt1__card-icon--green { background: rgba(37, 211, 102, 0.1); color: #25d366; }

.mt1__card-title {
    font-family: var(--font-title);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 10px;
}

.mt1__card-text {
    font-size: 0.9rem;
    color: var(--gray-medium);
    line-height: 1.7;
    margin-bottom: 16px;
}

.mt1__card-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mt1__card-list li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--gray-dark);
    font-weight: 500;
}

.mt1__card-list li i {
    color: #25d366;
    font-size: 0.7rem;
}

@media (min-width: 768px) {
    .mt1__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 1024px) {
    .mt1 { padding: 100px 0; }
    .mt1__title { font-size: 2.6rem; }
    .mt1__grid { gap: 30px; }
}

@media (max-width: 767px) {
    .mt1 { padding: 60px 0; }
    .mt1__title { font-size: 1.8rem; }
}


/* ************************************************************
   SISTEMA DE ENSINO 01 — Split imagem + texto
   Arquivo: inc/sistema-ensino.inc.php
   ************************************************************ */

.se1 {
    padding: 80px 0;
    background: var(--gray-light);
}

.se1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}

/* Imagem */
.se1__image-wrapper {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

.se1__image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
}

.se1__image-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: var(--primary);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.78rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
}

/* Conteúdo */
.se1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.se1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 20px;
}

.se1__text {
    font-size: 0.95rem;
    color: var(--gray-medium);
    line-height: 1.8;
    margin-bottom: 14px;
}

.se1__benefits {
    list-style: none;
    padding: 0;
    margin: 20px 0 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.se1__benefits li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.9rem;
    color: var(--gray-dark);
}

.se1__benefits li i {
    color: #25d366;
    font-size: 1rem;
    flex-shrink: 0;
}

@media (min-width: 1024px) {
    .se1 { padding: 100px 0; }
    .se1__grid { grid-template-columns: 1fr 1fr; gap: 60px; }
    .se1__title { font-size: 2.4rem; }
}

@media (max-width: 767px) {
    .se1 { padding: 60px 0; }
    .se1__title { font-size: 1.8rem; }
}


/* ************************************************************
   BILÍNGUE 01 — Programa Edify (split invertido)
   Arquivo: inc/bilingue.inc.php
   ************************************************************ */

.bl1 {
    padding: 80px 0;
    background: var(--white);
}

.bl1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}

/* Conteúdo */
.bl1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.08), rgba(198, 18, 31, 0.08));
    color: var(--accent);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.bl1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 20px;
}

.bl1__text {
    font-size: 0.95rem;
    color: var(--gray-medium);
    line-height: 1.8;
    margin-bottom: 14px;
}

/* Destaque informativo */
.bl1__highlight {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.06), rgba(198, 18, 31, 0.06));
    border-left: 3px solid var(--accent);
    border-radius: 0 8px 8px 0;
    margin: 20px 0;
    font-size: 0.88rem;
    color: var(--gray-dark);
    line-height: 1.6;
}

.bl1__highlight i {
    color: var(--accent);
    margin-top: 3px;
    flex-shrink: 0;
}

/* Benefícios com ícone + título + desc */
.bl1__benefits {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.bl1__benefits li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.bl1__benefits li i {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 58, 107, 0.08);
    color: var(--primary);
    border-radius: 10px;
    font-size: 1rem;
    flex-shrink: 0;
}

.bl1__benefits li strong {
    display: block;
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--gray-dark);
    margin-bottom: 2px;
}

.bl1__benefits li p {
    font-size: 0.82rem;
    color: var(--gray-medium);
    line-height: 1.4;
}

/* Imagem */
.bl1__image-wrapper {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

.bl1__image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
}

.bl1__image-flag {
    position: absolute;
    bottom: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.82rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    box-shadow: 0 4px 15px rgba(230, 57, 70, 0.4);
}

@media (min-width: 1024px) {
    .bl1 { padding: 100px 0; }
    .bl1__grid { grid-template-columns: 1fr 1fr; gap: 60px; }
    .bl1__title { font-size: 2.4rem; }
}

@media (max-width: 767px) {
    .bl1 { padding: 60px 0; }
    .bl1__title { font-size: 1.8rem; }
    .bl1__image { order: -1; }
}


/* ************************************************************
   DIFERENCIAIS PEDAGÓGICOS 02 — Grid de cards
   Arquivo: inc/diferenciais-ped.inc.php
   ************************************************************ */

.dp2 {
    padding: 80px 0;
    background: var(--gray-light);
}

.dp2__header {
    text-align: center;
    margin-bottom: 50px;
}

.dp2__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.dp2__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 12px;
}

.dp2__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    max-width: 550px;
    margin: 0 auto;
    line-height: 1.7;
}

.dp2__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.dp2__item {
    background: var(--white);
    border-radius: 14px;
    padding: 28px 24px;
    text-align: center;
    transition: var(--transition);
    border: 1px solid transparent;
    position: relative;
}

.dp2__item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: rgba(26, 58, 107, 0.1);
}

.dp2__item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 12px;
    background: var(--primary);
    color: var(--white);
    font-size: 1.3rem;
    margin: 0 auto 16px;
    transition: var(--transition);
}

.dp2__item:hover .dp2__item-icon {
    background: var(--accent);
    transform: scale(1.1);
}

.dp2__item-title {
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 8px;
}

.dp2__item-text {
    font-size: 0.82rem;
    color: var(--gray-medium);
    line-height: 1.6;
    margin-bottom: 12px;
}

.dp2__item-tag {
    display: inline-block;
    padding: 4px 12px;
    background: rgba(26, 58, 107, 0.06);
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.7rem;
    font-weight: 600;
    border-radius: var(--radius-pill);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

@media (min-width: 768px) {
    .dp2__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .dp2 { padding: 100px 0; }
    .dp2__title { font-size: 2.6rem; }
    .dp2__grid { grid-template-columns: repeat(3, 1fr); gap: 24px; }
}

@media (max-width: 767px) {
    .dp2 { padding: 60px 0; }
    .dp2__title { font-size: 1.8rem; }
    .dp2__grid { grid-template-columns: repeat(2, 1fr); }
}


/* ************************************************************
   SEO HERO 01 — Hero com keyword (reutiliza visual do lh1)
   Arquivo: inc/seo-hero.inc.php
   ************************************************************ */
.sh1 { position: relative; padding: 120px 0 80px; background: linear-gradient(135deg, var(--primary) 0%, #0d2240 100%); color: var(--white); overflow: hidden; }
.sh1__bg { position: absolute; inset: 0; background: radial-gradient(circle at 80% 20%, rgba(37, 87, 167, 0.3) 0%, transparent 50%), radial-gradient(circle at 20% 80%, rgba(230, 57, 70, 0.1) 0%, transparent 50%); }
.sh1__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
.sh1__badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.sh1__mini-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.2); border-radius: var(--radius-pill); font-size: 0.75rem; font-weight: 600; }
.sh1__title { font-family: var(--font-title); font-size: 2.2rem; font-weight: 800; line-height: 1.15; margin-bottom: 16px; }
.sh1__sub { font-size: 1rem; opacity: 0.9; line-height: 1.8; margin-bottom: 28px; max-width: 580px; }
.sh1__ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.sh1__btn-primary { display: inline-flex; align-items: center; gap: 8px; padding: 16px 32px; background: #25d366; color: var(--white); font-family: var(--font-title); font-size: 1rem; font-weight: 700; border-radius: var(--radius-pill); transition: var(--transition); box-shadow: 0 4px 20px rgba(37,211,102,0.4); }
.sh1__btn-primary:hover { background: #20bf5e; transform: translateY(-3px); box-shadow: 0 8px 30px rgba(37,211,102,0.5); }
.sh1__btn-secondary { display: inline-flex; align-items: center; gap: 8px; padding: 16px 32px; border: 2px solid rgba(255,255,255,0.4); color: var(--white); font-family: var(--font-title); font-size: 1rem; font-weight: 600; border-radius: var(--radius-pill); transition: var(--transition); }
.sh1__btn-secondary:hover { background: var(--white); color: var(--primary); border-color: var(--white); }
.sh1__image { border-radius: 20px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.3); }
.sh1__image img { width: 100%; height: auto; display: block; }
@media (min-width: 1024px) { .sh1 { padding: 140px 0 100px; } .sh1__grid { grid-template-columns: 1fr 1fr; gap: 60px; } .sh1__title { font-size: 2.8rem; } }
@media (max-width: 767px) { .sh1 { padding: 100px 0 50px; } .sh1__title { font-size: 1.7rem; } .sh1__image { order: -1; } .sh1__ctas { flex-wrap: nowrap; gap: 10px; } .sh1__btn-primary, .sh1__btn-secondary { flex: 1 1 0; min-width: 0; justify-content: center; text-align: center; padding: 14px 10px; font-size: 0.9rem; } }

/* ************************************************************
   SEO POR QUE ESCOLHER 01 — Blocos de conteúdo rico
   Arquivo: inc/seo-porque.inc.php
   ************************************************************ */
.sp1 { padding: 80px 0; background: var(--white); }
.sp1__header { text-align: center; margin-bottom: 50px; max-width: 800px; margin-left: auto; margin-right: auto; }
.sp1__title { font-family: var(--font-title); font-size: 2.2rem; font-weight: 800; color: var(--primary); margin-bottom: 16px; }
.sp1__intro { font-size: 1rem; color: var(--gray-medium); line-height: 1.8; }
.sp1__grid { display: flex; flex-direction: column; gap: 24px; }
.sp1__block { display: flex; gap: 20px; padding: 28px; background: var(--gray-light); border-radius: 14px; transition: var(--transition); border-left: 4px solid transparent; }
.sp1__block:hover { border-left-color: var(--accent); box-shadow: var(--shadow-md); transform: translateX(4px); background: var(--white); }
.sp1__block-icon { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 12px; background: var(--primary); color: var(--white); font-size: 1.2rem; flex-shrink: 0; }
.sp1__block-content h3 { font-family: var(--font-title); font-size: 1.1rem; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.sp1__block-content p { font-size: 0.9rem; color: var(--gray-medium); line-height: 1.8; }
@media (min-width: 1024px) { .sp1 { padding: 100px 0; } .sp1__title { font-size: 2.6rem; } }
@media (max-width: 767px) { .sp1 { padding: 60px 0; } .sp1__title { font-size: 1.6rem; } .sp1__block { flex-direction: column; gap: 14px; } }

/* ************************************************************
   SEO NÍVEIS 01 — Cards com links internos
   Arquivo: inc/seo-niveis.inc.php
   ************************************************************ */
.sn1 { padding: 80px 0; background: var(--gray-light); }
.sn1__header { text-align: center; margin-bottom: 50px; }
.sn1__title { font-family: var(--font-title); font-size: 2.2rem; font-weight: 800; color: var(--primary); margin-bottom: 12px; }
.sn1__intro { font-size: 1rem; color: var(--gray-medium); line-height: 1.7; max-width: 650px; margin: 0 auto; }
.sn1__grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
.sn1__card { background: var(--white); border-radius: 16px; padding: 32px 28px; transition: var(--transition); border-top: 4px solid transparent; }
.sn1__card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-top-color: var(--accent); }
.sn1__card-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.sn1__card-icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--primary); color: var(--white); font-size: 1.2rem; }
.sn1__card-age { padding: 4px 14px; background: rgba(230,57,70,0.08); color: var(--accent); font-family: var(--font-title); font-size: 0.78rem; font-weight: 700; border-radius: var(--radius-pill); }
.sn1__card-title { font-family: var(--font-title); font-size: 1.2rem; font-weight: 700; color: var(--primary); margin-bottom: 10px; }
.sn1__card-text { font-size: 0.9rem; color: var(--gray-medium); line-height: 1.7; margin-bottom: 16px; }
.sn1__card-link { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-title); font-size: 0.85rem; font-weight: 600; color: var(--accent); transition: gap 0.2s ease; }
.sn1__card-link:hover { gap: 10px; }
@media (min-width: 768px) { .sn1__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .sn1 { padding: 100px 0; } .sn1__title { font-size: 2.6rem; } }
@media (max-width: 767px) { .sn1 { padding: 60px 0; } .sn1__title { font-size: 1.6rem; } }

/* ************************************************************
   SEO DIFERENCIAIS 01 — Lista com texto rico
   Arquivo: inc/seo-diferenciais.inc.php
   ************************************************************ */
.sd1 { padding: 80px 0; background: var(--white); }
.sd1__header { text-align: center; margin-bottom: 50px; max-width: 750px; margin-left: auto; margin-right: auto; }
.sd1__title { font-family: var(--font-title); font-size: 2.2rem; font-weight: 800; color: var(--primary); margin-bottom: 14px; }
.sd1__intro { font-size: 0.95rem; color: var(--gray-medium); line-height: 1.8; }
.sd1__list { display: flex; flex-direction: column; gap: 20px; max-width: 850px; margin: 0 auto; }
.sd1__item { display: flex; gap: 20px; padding: 24px; background: var(--gray-light); border-radius: 14px; transition: var(--transition); }
.sd1__item:hover { box-shadow: var(--shadow-md); transform: translateX(4px); background: var(--white); }
.sd1__item-icon { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 12px; background: var(--primary); color: var(--white); font-size: 1.2rem; flex-shrink: 0; }
.sd1__item:hover .sd1__item-icon { background: var(--accent); }
.sd1__item-content h3 { font-family: var(--font-title); font-size: 1.05rem; font-weight: 700; color: var(--primary); margin-bottom: 6px; }
.sd1__item-content p { font-size: 0.88rem; color: var(--gray-medium); line-height: 1.7; }
@media (min-width: 1024px) { .sd1 { padding: 100px 0; } .sd1__title { font-size: 2.4rem; } }
@media (max-width: 767px) { .sd1 { padding: 60px 0; } .sd1__title { font-size: 1.6rem; } .sd1__item { flex-direction: column; gap: 14px; } }

/* ************************************************************
   SEO LOCAL 01 — Endereço + Mapa
   Arquivo: inc/seo-local.inc.php
   ************************************************************ */
.sl1 { padding: 80px 0; background: var(--gray-light); }
.sl1__grid { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
.sl1__title { font-family: var(--font-title); font-size: 2rem; font-weight: 800; color: var(--primary); margin-bottom: 16px; }
.sl1__text { font-size: 0.95rem; color: var(--gray-medium); line-height: 1.8; margin-bottom: 10px; }
.sl1__details { display: flex; flex-direction: column; gap: 18px; margin: 24px 0; }
.sl1__detail { display: flex; gap: 14px; align-items: flex-start; }
.sl1__detail i { width: 20px; text-align: center; color: var(--accent); font-size: 1rem; margin-top: 3px; flex-shrink: 0; }
.sl1__detail strong { display: block; font-family: var(--font-title); font-size: 0.88rem; font-weight: 700; color: var(--gray-dark); margin-bottom: 2px; }
.sl1__detail p { font-size: 0.85rem; color: var(--gray-medium); line-height: 1.5; }
.sl1__detail a { color: var(--primary); transition: color 0.2s ease; }
.sl1__detail a:hover { color: var(--accent); }
.sl1__btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; background: var(--accent); color: var(--white); font-family: var(--font-title); font-size: 0.85rem; font-weight: 700; border-radius: var(--radius-pill); transition: var(--transition); }
.sl1__btn:hover { background: var(--accent-hover); transform: translateY(-2px); box-shadow: 0 4px 15px rgba(230,57,70,0.3); }
.sl1__map { border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-lg); min-height: 350px; }
.sl1__map iframe { display: block; border: 0; width: 100%; height: 100%; min-height: 350px; }
@media (min-width: 1024px) { .sl1 { padding: 100px 0; } .sl1__grid { grid-template-columns: 1fr 1.2fr; gap: 60px; } .sl1__map { min-height: 420px; } .sl1__map iframe { min-height: 420px; } }
@media (max-width: 767px) { .sl1 { padding: 60px 0; } .sl1__title { font-size: 1.5rem; } }

/* ************************************************************
   SEO LINKS 01 — Internal linking grid
   Arquivo: inc/seo-links.inc.php
   ************************************************************ */
.si1 { padding: 60px 0; background: var(--white); }
.si1__header { text-align: center; margin-bottom: 40px; }
.si1__title { font-family: var(--font-title); font-size: 1.6rem; font-weight: 800; color: var(--primary); margin-bottom: 10px; }
.si1__intro { font-size: 0.9rem; color: var(--gray-medium); line-height: 1.7; max-width: 550px; margin: 0 auto; }
.si1__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.si1__group { background: var(--gray-light); border-radius: 12px; padding: 24px; }
.si1__group-title { display: flex; align-items: center; gap: 8px; font-family: var(--font-title); font-size: 0.9rem; font-weight: 700; color: var(--primary); margin-bottom: 14px; padding-bottom: 10px; border-bottom: 2px solid var(--accent); }
.si1__group-title i { color: var(--accent); }
.si1__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.si1__list a { display: inline-flex; align-items: center; gap: 6px; font-size: 0.85rem; color: var(--gray-medium); transition: color 0.2s ease, padding-left 0.2s ease; }
.si1__list a:hover { color: var(--accent); padding-left: 4px; }
@media (min-width: 1024px) { .si1__grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 767px) { .si1 { padding: 40px 0; } .si1__title { font-size: 1.3rem; } }


/* ************************************************************
   LP HERO 01 — Hero de vendas para landing pages
   Arquivo: inc/lp-hero.inc.php
   ************************************************************ */

.lh1 {
    position: relative;
    padding: 120px 0 80px;
    background: linear-gradient(135deg, var(--primary) 0%, #0d2240 100%);
    color: var(--white);
    overflow: hidden;
}

.lh1__bg {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 80% 20%, rgba(37, 87, 167, 0.3) 0%, transparent 50%),
                radial-gradient(circle at 20% 80%, rgba(230, 57, 70, 0.1) 0%, transparent 50%);
}

.lh1__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}

.lh1__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.lh1__mini-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-pill);
    font-size: 0.75rem;
    font-weight: 600;
}

.lh1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1.15;
    margin-bottom: 16px;
}

.lh1__sub {
    font-size: 1.05rem;
    opacity: 0.9;
    line-height: 1.7;
    margin-bottom: 28px;
    max-width: 540px;
}

/* Os dois CTAs do hero devem caber lado a lado: empilhados, o secundário
   parece um segundo passo em vez de uma alternativa. O wrap continua como
   rede de segurança para telas estreitas. */
.lh1__ctas {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.lh1__btn-primary,
.lh1__btn-secondary {
    white-space: nowrap; /* o rótulo nunca quebra dentro do botão */
}

.lh1__btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 16px 24px;
    background: #25d366;
    color: var(--white);
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    transition: var(--transition);
    box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4);
}

.lh1__btn-primary:hover {
    background: #20bf5e;
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(37, 211, 102, 0.5);
}

.lh1__btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 16px 24px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 600;
    border-radius: var(--radius-pill);
    transition: var(--transition);
}

.lh1__btn-secondary:hover {
    background: var(--white);
    color: var(--primary);
    border-color: var(--white);
}

.lh1__image {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.lh1__image img {
    width: 100%;
    height: auto;
    display: block;
}

/* O hero só vira 2 colunas a partir de 1280px.
   Entre 1024 e 1279 a coluna de texto ficava com ~435px — estreita demais para
   os dois CTAs lado a lado, e o botão secundário caía para a linha de baixo,
   parecendo um segundo passo em vez de uma alternativa. Em coluna única nessa
   faixa o texto respira e os dois botões cabem na mesma linha. */
@media (min-width: 1024px) {
    .lh1 { padding: 140px 0 100px; }
    .lh1__title { font-size: 2.8rem; }
}

@media (min-width: 1280px) {
    .lh1__grid { grid-template-columns: 1fr 1fr; gap: 60px; }
}

@media (max-width: 767px) {
    .lh1 { padding: 100px 0 50px; }
    .lh1__title { font-size: 1.7rem; }
    .lh1__image { order: -1; }
}


/* ************************************************************
   LP PROVA SOCIAL 01 — Barra de números
   Arquivo: inc/lp-prova-social.inc.php
   ************************************************************ */

.lp1 {
    padding: 40px 0;
    background: linear-gradient(135deg, var(--accent) 0%, #d62839 100%);
    color: var(--white);
}

.lp1__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    text-align: center;
}

.lp1__item {
    padding: 10px;
}

.lp1__number {
    font-family: var(--font-title);
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1;
}

.lp1__suffix {
    font-family: var(--font-title);
    font-size: 1.4rem;
    font-weight: 700;
    opacity: 0.8;
}

/* Modo selo: ocupa o mesmo peso visual do número, para a barra não mudar de
   altura quando um item vira número e outro continua selo. */
.lp1__icon {
    display: block;
    font-size: 2rem;
    line-height: 1;
    opacity: 0.95;
}

.lp1__label {
    display: block;
    font-size: 0.82rem;
    opacity: 0.85;
    margin-top: 6px;
    font-weight: 500;
}

@media (min-width: 768px) {
    .lp1__grid { grid-template-columns: repeat(4, 1fr); }
    .lp1__number { font-size: 2.8rem; }
    .lp1__icon { font-size: 2.2rem; }
}

@media (min-width: 1024px) {
    .lp1 { padding: 50px 0; }
    .lp1__number { font-size: 3.2rem; }
    .lp1__icon { font-size: 2.4rem; }
}


/* ************************************************************
   LP VÍDEO 01 — Player sob demanda + CTA
   Arquivo: resources/components/landing-pages/lp-video.inc.php
   ************************************************************ */

.lv1 {
    padding: 80px 0;
    background: var(--gray-light);
}

.lv1__header {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 36px;
}

.lv1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: var(--primary);
    color: var(--white);
    border-radius: var(--radius-pill);
    font-family: var(--font-title);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.lv1__title {
    font-family: var(--font-title);
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.25;
    margin-bottom: 12px;
}

.lv1__subtitle {
    color: var(--gray-medium);
    font-size: 1.02rem;
    line-height: 1.65;
    max-width: 62ch;
    margin: 0 auto;
}

/* Proporção 16:9 reservada antes do clique — o player entra no lugar da capa
   sem empurrar o conteúdo abaixo (CLS ~0). */
.lv1__player {
    position: relative;
    max-width: 900px;
    margin: 0 auto;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    background: var(--gray-dark);
}

.lv1__facade {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

.lv1__cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.lv1__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--accent);
    font-size: 1.6rem;
    box-shadow: var(--shadow-md);
    transition: var(--transition);
    /* A cor do glifo vem do sistema --on-accent (bloco CONTRASTE DO ACCENT no
       fim deste arquivo): branco fixo reprova AA em tenant de accent claro. */
}

.lv1__facade:hover .lv1__play,
.lv1__facade:focus-visible .lv1__play {
    background: var(--accent-hover);
    transform: translate(-50%, -50%) scale(1.08);
}

.lv1__facade:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: -3px;
}

/* O iframe injetado pelo JS ocupa exatamente o espaço já reservado. */
.lv1__player iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.lv1__noscript {
    position: absolute;
    inset: auto 0 0 0;
    padding: 12px;
    text-align: center;
    background: rgba(0, 0, 0, 0.7);
    color: var(--white);
    font-weight: 600;
}

.lv1__cta {
    text-align: center;
    margin-top: 32px;
}

.lv1__cta-apoio {
    color: var(--gray-medium);
    font-size: 1rem;
    margin-bottom: 16px;
}

.lv1__cta-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 34px;
    background: var(--accent);
    border-radius: var(--radius-pill);
    font-family: var(--font-title);
    font-weight: 700;
    font-size: 1.02rem;
    box-shadow: var(--shadow-md);
    transition: var(--transition);
    /* Cor do texto: ver bloco CONTRASTE DO ACCENT no fim deste arquivo. */
}

.lv1__cta-btn:hover,
.lv1__cta-btn:focus-visible {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

/* Anel de atenção — FINITO (3 ciclos e para), disparado pelo JS em momentos de
   intenção: quando o CTA entra na tela e quando o visitante dá play no vídeo.
   Não é loop infinito de propósito: movimento perpétuo lê como site de baixa
   confiança e é justamente confiança que decide matrícula. Também evita o
   território do WCAG 2.2 SC 2.2.2 (conteúdo em movimento contínuo).
   O anel é ::after decorativo: não recebe clique nem entra na árvore de
   acessibilidade, então não muda nada para leitor de tela. */
.lv1__cta-btn::after {
    content: '';
    position: absolute;
    inset: -5px;
    border: 2px solid var(--accent);
    border-radius: inherit;
    opacity: 0;
    pointer-events: none;
}

.lv1__cta-btn.is-pulsing::after {
    animation: lv1-ring 1.5s ease-out 3;
}

@keyframes lv1-ring {
    0%   { transform: scale(1);    opacity: 0.9; }
    70%  { opacity: 0.15; }
    100% { transform: scale(1.3);  opacity: 0; }
}

@media (max-width: 767px) {
    .lv1 { padding: 56px 0; }
    .lv1__title { font-size: 1.45rem; }
    .lv1__play { width: 58px; height: 58px; font-size: 1.2rem; }
    .lv1__cta-btn { width: 100%; justify-content: center; }
}

@media (min-width: 1024px) {
    .lv1 { padding: 100px 0; }
    .lv1__title { font-size: 2.4rem; }
}

@media (prefers-reduced-motion: reduce) {
    .lv1__play,
    .lv1__cta-btn { transition: none; }
    .lv1__facade:hover .lv1__play,
    .lv1__facade:focus-visible .lv1__play { transform: translate(-50%, -50%); }
    .lv1__cta-btn:hover,
    .lv1__cta-btn:focus-visible { transform: none; }
    /* Quem pediu menos movimento não recebe o anel — nem uma vez. */
    .lv1__cta-btn.is-pulsing::after { animation: none; }
}


/* ************************************************************
   LP PARA QUEM 01 — Faixa etária + dores dos pais
   Arquivo: inc/lp-para-quem.inc.php
   ************************************************************ */

.lq1 {
    padding: 80px 0;
    background: var(--white);
}

.lq1__header {
    text-align: center;
    margin-bottom: 50px;
}

.lq1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 14px;
}

.lq1__faixa {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    background: rgba(230, 57, 70, 0.08);
    color: var(--accent);
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
}

.lq1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.lq1__card {
    padding: 30px 24px;
    background: var(--gray-light);
    border-radius: 16px;
    text-align: center;
    transition: var(--transition);
    border: 2px solid transparent;
}

.lq1__card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
    border-color: var(--primary);
    background: var(--white);
}

.lq1__card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--primary);
    color: var(--white);
    font-size: 1.3rem;
    margin: 0 auto 16px;
}

.lq1__card-title {
    font-family: var(--font-title);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 8px;
}

.lq1__card-text {
    font-size: 0.88rem;
    color: var(--gray-medium);
    line-height: 1.6;
}

@media (min-width: 768px) {
    .lq1__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .lq1 { padding: 100px 0; }
    .lq1__title { font-size: 2.6rem; }
    .lq1__grid { grid-template-columns: repeat(4, 1fr); gap: 24px; }
}

@media (max-width: 767px) {
    .lq1 { padding: 60px 0; }
    .lq1__title { font-size: 1.6rem; }
    .lq1__grid { grid-template-columns: repeat(2, 1fr); }
}


/* ************************************************************
   LP DIFERENCIAIS 01 — Grid inclusos na mensalidade
   Arquivo: inc/lp-diferenciais.inc.php
   ************************************************************ */

.ld1 {
    padding: 80px 0;
    background: var(--gray-light);
}

.ld1__header {
    text-align: center;
    margin-bottom: 50px;
}

.ld1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: rgba(37, 211, 102, 0.1);
    color: #25d366;
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.ld1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

.ld1__title strong {
    color: var(--accent);
}

.ld1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

/* Fecho da seção: ancoragem de valor + micro-CTA (opcional, vem do CMS). */
.ld1__fecho {
    margin-top: 32px;
    text-align: center;
}

.ld1__fecho-text {
    max-width: 60ch;
    margin: 0 auto 16px;
    font-size: 1.05rem;
    line-height: 1.6;
    color: var(--text);
}

.ld1__fecho-link {
    display: inline-block;
    font-family: var(--font-title);
    font-weight: 700;
    font-size: 1rem;
    color: var(--accent-hover);
    text-decoration: none;
    border-bottom: 2px solid currentColor;
    padding-bottom: 2px;
    transition: var(--transition);
}

.ld1__fecho-link:hover,
.ld1__fecho-link:focus-visible {
    color: var(--primary);
}

.ld1__item {
    background: var(--white);
    border-radius: 14px;
    padding: 24px 20px;
    text-align: center;
    transition: var(--transition);
    position: relative;
    border: 1px solid transparent;
}

.ld1__item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: rgba(37, 211, 102, 0.3);
}

.ld1__item-tag {
    position: absolute;
    top: 12px;
    right: 12px;
    padding: 3px 10px;
    background: #25d366;
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.6rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    letter-spacing: 0.5px;
}

.ld1__item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 12px;
    background: var(--primary);
    color: var(--white);
    font-size: 1.2rem;
    margin: 0 auto 14px;
    transition: var(--transition);
}

.ld1__item:hover .ld1__item-icon {
    background: var(--accent);
    transform: scale(1.1);
}

.ld1__item-title {
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 6px;
}

.ld1__item-text {
    font-size: 0.8rem;
    color: var(--gray-medium);
    line-height: 1.5;
}

@media (min-width: 768px) {
    .ld1__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .ld1 { padding: 100px 0; }
    .ld1__title { font-size: 2.6rem; }
    .ld1__grid { grid-template-columns: repeat(4, 1fr); gap: 20px; }
}

@media (max-width: 767px) {
    .ld1 { padding: 60px 0; }
    .ld1__title { font-size: 1.6rem; }
    .ld1__grid { grid-template-columns: repeat(2, 1fr); }
}


/* ************************************************************
   LP CTA RÁPIDO 01 — Faixa intermediária de conversão
   Arquivo: inc/lp-cta-rapido.inc.php
   ************************************************************ */

.lr1 {
    padding: 50px 0;
    background: var(--primary);
    color: var(--white);
}

.lr1__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 24px;
}

.lr1__title {
    font-family: var(--font-title);
    font-size: 1.5rem;
    font-weight: 800;
}

.lr1__sub {
    opacity: 0.8;
    font-size: 0.95rem;
}

.lr1__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}

.lr1__btn-whatsapp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: #25d366;
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.35);
}

.lr1__btn-whatsapp:hover {
    background: #20bf5e;
    transform: translateY(-2px);
}

.lr1__btn-phone {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 600;
    border-radius: var(--radius-pill);
    transition: var(--transition);
}

.lr1__btn-phone:hover {
    background: var(--white);
    color: var(--primary);
    border-color: var(--white);
}

@media (min-width: 1024px) {
    .lr1__inner { flex-direction: row; text-align: left; justify-content: space-between; }
    .lr1__title { font-size: 1.7rem; }
}

@media (max-width: 767px) {
    .lr1 { padding: 40px 0; }
    .lr1__title { font-size: 1.3rem; }
}


/* ************************************************************
   LP FAQ 01 — Accordion de perguntas frequentes
   Arquivo: inc/lp-faq.inc.php
   ************************************************************ */

.lf1 {
    padding: 80px 0;
    background: var(--gray-light);
}

.lf1__header {
    text-align: center;
    margin-bottom: 40px;
}

.lf1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.lf1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

.lf1__list {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lf1__item {
    background: var(--white);
    border-radius: 12px;
    overflow: hidden;
    transition: var(--transition);
    border: 1px solid transparent;
}

.lf1__item:hover {
    border-color: rgba(26, 58, 107, 0.1);
}

.lf1__item--active {
    box-shadow: var(--shadow-md);
    border-color: var(--primary);
}

.lf1__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 18px 20px;
    background: none;
    border: none;
    font-family: var(--font-title);
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--primary);
    text-align: left;
    cursor: pointer;
    transition: color 0.2s ease;
}

.lf1__question:hover {
    color: var(--accent);
}

.lf1__arrow {
    font-size: 0.8rem;
    color: var(--gray-medium);
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.lf1__item--active .lf1__arrow {
    transform: rotate(180deg);
    color: var(--accent);
}

.lf1__answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, padding 0.4s ease;
}

.lf1__answer p {
    padding: 0 20px 18px;
    font-size: 0.88rem;
    color: var(--gray-medium);
    line-height: 1.7;
}

@media (min-width: 1024px) {
    .lf1 { padding: 100px 0; }
    .lf1__title { font-size: 2.6rem; }
}

@media (max-width: 767px) {
    .lf1 { padding: 60px 0; }
    .lf1__title { font-size: 1.6rem; }
    .lf1__question { font-size: 0.85rem; padding: 16px; }
}


/* ************************************************************
   LP CTA FINAL 01 — Urgência + Formulário
   Arquivo: inc/lp-cta-final.inc.php
   ************************************************************ */

.lc1 {
    position: relative;
    padding: 80px 0;
    background: linear-gradient(135deg, var(--primary) 0%, #0d2240 100%);
    color: var(--white);
    overflow: hidden;
}

.lc1__bg {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 50%, rgba(230, 57, 70, 0.15) 0%, transparent 50%);
}

.lc1__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}

/* Urgência */
.lc1__badge-urgency {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 18px;
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.8rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    margin-bottom: 20px;
    animation: lc1Pulse 2s ease-in-out infinite;
}

@keyframes lc1Pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(230, 57, 70, 0.4); }
    50% { box-shadow: 0 0 0 12px rgba(230, 57, 70, 0); }
}

.lc1__title {
    font-family: var(--font-title);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 16px;
}

.lc1__text {
    font-size: 0.95rem;
    opacity: 0.85;
    line-height: 1.7;
    margin-bottom: 24px;
}

.lc1__checklist {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lc1__checklist li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
}

.lc1__checklist li i {
    color: #25d366;
    font-size: 1rem;
}

/* Formulário */
.lc1__form-wrapper {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 20px;
    padding: 36px 28px;
    backdrop-filter: blur(10px);
}

.lc1__form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lc1__form-title {
    font-family: var(--font-title);
    font-size: 1.2rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 6px;
}

.lc1__form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.lc1__input {
    padding: 14px 16px;
    border: 1.5px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--white);
    background: rgba(255, 255, 255, 0.08);
    outline: none;
    transition: border-color 0.2s ease;
    width: 100%;
}

.lc1__input:focus {
    border-color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.12);
}

.lc1__input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.lc1__select {
    cursor: pointer;
    appearance: auto;
}

.lc1__select option {
    color: #333;
    background: #fff;
}

.lc1__select option:checked {
    color: #333;
    background: #e9ecef;
}

.lc1__checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.75rem;
    opacity: 0.7;
    cursor: pointer;
}

.lc1__checkbox {
    margin-top: 2px;
    cursor: pointer;
}

.lc1__link {
    color: var(--white);
    text-decoration: underline;
}

.lc1__submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 700;
    border: none;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: var(--transition);
    width: 100%;
    box-shadow: 0 4px 20px rgba(230, 57, 70, 0.4);
}

.lc1__submit:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(230, 57, 70, 0.5);
}

@media (min-width: 1024px) {
    .lc1 { padding: 100px 0; }
    .lc1__grid { grid-template-columns: 1fr 1fr; gap: 60px; }
    .lc1__title { font-size: 2.4rem; }
}

@media (max-width: 767px) {
    .lc1 { padding: 60px 0; }
    .lc1__title { font-size: 1.5rem; }
    .lc1__form-wrapper { padding: 24px 18px; }
    .lc1__form-row { grid-template-columns: 1fr; }
}


/* ************************************************************
   CURSO DETALHE 01 — Página de curso reutilizável
   Arquivo: inc/curso-detalhe.inc.php
   ************************************************************ */

/* Bloco Intro */
.cd1__intro {
    padding: 80px 0;
    background: var(--white);
}

.cd1__intro-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}

.cd1__intro-content {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.cd1__intro-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 16px;
    background: var(--primary);
    color: var(--white);
    font-size: 1.5rem;
    flex-shrink: 0;
}

.cd1__badge {
    display: inline-block;
    padding: 4px 14px;
    font-family: var(--font-title);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: var(--radius-pill);
    margin-bottom: 12px;
}

.cd1__badge--incluso {
    background: rgba(37, 211, 102, 0.1);
    color: #25d366;
}

.cd1__badge--extra {
    background: rgba(230, 57, 70, 0.1);
    color: var(--accent);
}

.cd1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 16px;
}

.cd1__desc {
    font-size: 0.95rem;
    color: var(--gray-medium);
    line-height: 1.8;
}

.cd1__intro-image {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

.cd1__intro-image img {
    width: 100%;
    height: auto;
    display: block;
}

/* Bloco Detalhes */
.cd1__details {
    padding: 60px 0 80px;
    background: var(--gray-light);
}

.cd1__details-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

.cd1__section-title {
    font-family: var(--font-title);
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--accent);
    display: inline-block;
}

/* Benefícios */
.cd1__benefits-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cd1__benefits-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.92rem;
    color: var(--gray-dark);
    padding: 12px 16px;
    background: var(--white);
    border-radius: 10px;
    transition: var(--transition);
}

.cd1__benefits-list li:hover {
    transform: translateX(4px);
    box-shadow: var(--shadow-sm);
}

.cd1__benefits-list li i {
    color: #25d366;
    font-size: 1rem;
    flex-shrink: 0;
}

/* Info prática */
.cd1__info-block {
    margin-bottom: 20px;
}

.cd1__info-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-title);
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--gray-dark);
    margin-bottom: 6px;
}

.cd1__info-label i {
    color: var(--accent);
    font-size: 0.85rem;
}

.cd1__info-text {
    font-size: 0.88rem;
    color: var(--gray-medium);
    line-height: 1.6;
    padding-left: 26px;
}

/* Tags */
.cd1__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-left: 26px;
}

.cd1__tag {
    display: inline-block;
    padding: 5px 14px;
    background: var(--primary);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.72rem;
    font-weight: 600;
    border-radius: var(--radius-pill);
}

/* Botão CTA */
.cd1__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: #25d366;
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.35);
    margin-top: 10px;
}

.cd1__btn:hover {
    background: #20bf5e;
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(37, 211, 102, 0.5);
}

@media (min-width: 1024px) {
    .cd1__intro { padding: 100px 0; }
    .cd1__intro-grid { grid-template-columns: 1fr 1fr; gap: 60px; }
    .cd1__details-grid { grid-template-columns: 1.2fr 1fr; gap: 50px; }
    .cd1__title { font-size: 2.4rem; }
}

@media (max-width: 767px) {
    .cd1__intro { padding: 60px 0; }
    .cd1__title { font-size: 1.6rem; }
    .cd1__intro-content { flex-direction: column; gap: 16px; }
    .cd1__intro-icon { width: 52px; height: 52px; font-size: 1.2rem; }
    .cd1__details { padding: 40px 0 60px; }
}

/* Galeria de fotos do curso */
.cd1__gallery {
    padding: 60px 0;
    background: var(--white);
}

.cd1__gallery-title {
    font-family: var(--font-title);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--primary);
    text-align: center;
    margin-bottom: 30px;
}

.cd1__gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 200px;
    gap: 12px;
}

.cd1__gallery-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    display: block;
}

.cd1__gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.cd1__gallery-item:hover img {
    transform: scale(1.06);
}

.cd1__gallery-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(26, 58, 107, 0.8) 0%, transparent 60%);
    display: flex;
    align-items: flex-end;
    padding: 16px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.cd1__gallery-item:hover .cd1__gallery-overlay {
    opacity: 1;
}

.cd1__gallery-overlay h4 {
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--white);
}

@media (min-width: 768px) {
    .cd1__gallery-grid { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 220px; }
}

@media (min-width: 1024px) {
    .cd1__gallery { padding: 80px 0; }
    .cd1__gallery-grid { gap: 16px; }
}

@media (max-width: 767px) {
    .cd1__gallery { padding: 40px 0; }
    .cd1__gallery-grid { grid-auto-rows: 160px; }
}

/* Depoimento do curso */
.cd1__testimonial {
    padding: 60px 0;
    background: var(--gray-light);
}

.cd1__testimonial-card {
    max-width: 700px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    padding: 40px 30px 30px;
}

.cd1__testimonial-quote {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    font-size: 2.5rem;
    color: var(--accent);
    opacity: 0.3;
}

.cd1__testimonial-text {
    font-size: 1.05rem;
    font-style: italic;
    color: var(--gray-dark);
    line-height: 1.8;
    margin-bottom: 24px;
}

.cd1__testimonial-author strong {
    display: block;
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 2px;
}

.cd1__testimonial-author span {
    font-size: 0.82rem;
    color: var(--gray-medium);
}

@media (min-width: 1024px) {
    .cd1__testimonial { padding: 80px 0; }
    .cd1__testimonial-text { font-size: 1.15rem; }
}

@media (max-width: 767px) {
    .cd1__testimonial { padding: 40px 0; }
    .cd1__testimonial-card { padding: 30px 16px 20px; }
}


/* ************************************************************
   GALERIA DE FOTOS 01 — Grid com filtro + lightbox
   Arquivo: inc/galeria-fotos.inc.php
   ************************************************************ */

.gf1 {
    padding: 80px 0;
    background: var(--white);
}

.gf1__header {
    text-align: center;
    margin-bottom: 30px;
}

.gf1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.gf1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

/* Estado vazio — galeria gerenciada pelo CMS ainda sem fotos publicadas */
.gf1__empty {
    text-align: center;
    color: var(--gray-medium);
    font-size: 1.05rem;
    padding: 48px 20px;
    margin: 0;
}

/* Filtros */
.gf1__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
}

.gf1__filter {
    padding: 8px 20px;
    background: var(--gray-light);
    border: 2px solid transparent;
    border-radius: var(--radius-pill);
    font-family: var(--font-title);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--gray-medium);
    cursor: pointer;
    transition: var(--transition);
}

.gf1__filter:hover {
    color: var(--primary);
    border-color: rgba(26, 58, 107, 0.2);
}

.gf1__filter--active {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}

.gf1__filter--active:hover {
    color: var(--white);
    border-color: var(--primary);
}

/* Grid */
.gf1__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 220px;
    gap: 12px;
}

.gf1__item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    display: block;
}

.gf1__item--hidden {
    display: none;
}

.gf1__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.gf1__item:hover img {
    transform: scale(1.06);
}

/* Overlay */
.gf1__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(26, 58, 107, 0.85) 0%, rgba(26, 58, 107, 0.2) 60%, transparent 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.gf1__item:hover .gf1__overlay {
    opacity: 1;
}

.gf1__overlay-title {
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 4px;
}

.gf1__overlay-desc {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.4;
}

@media (min-width: 768px) {
    .gf1__grid { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 250px; }
}

@media (min-width: 1024px) {
    .gf1 { padding: 100px 0; }
    .gf1__title { font-size: 2.6rem; }
    .gf1__grid { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 240px; gap: 16px; }
}

@media (max-width: 767px) {
    .gf1 { padding: 60px 0; }
    .gf1__title { font-size: 1.8rem; }
    .gf1__filter { padding: 6px 14px; font-size: 0.75rem; }
}


/* ************************************************************
   GALERIA DE VÍDEOS 01 — Grid de vídeos embed
   Arquivo: inc/galeria-videos.inc.php
   ************************************************************ */

.gv1 {
    padding: 80px 0;
    background: var(--white);
}

.gv1__header {
    text-align: center;
    margin-bottom: 50px;
}

.gv1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.08), rgba(198, 18, 31, 0.08));
    color: var(--accent);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.gv1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 12px;
}

.gv1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    max-width: 500px;
    margin: 0 auto;
    line-height: 1.7;
}

.gv1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

.gv1__empty {
    text-align: center;
    color: var(--gray-medium);
    font-size: 1.05rem;
    padding: 48px 20px;
    margin: 0;
}

.gv1__item {
    border-radius: 16px;
    overflow: hidden;
    background: var(--gray-light);
    transition: var(--transition);
}

.gv1__item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

/* Capa clicável — é um <button>, então precisa zerar o estilo nativo */
.gv1__video {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: var(--primary);
    aspect-ratio: 16 / 9;
    overflow: hidden;
    cursor: pointer;
    font: inherit;
    color: inherit;
}

.gv1__cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1), filter 0.3s ease;
}

.gv1__item:hover .gv1__cover,
.gv1__video:focus-visible .gv1__cover {
    transform: scale(1.06);
    filter: brightness(0.75);
}

/* Botão de play sobre a capa */
.gv1__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.94);
    color: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.28);
    transition: var(--transition);
    pointer-events: none;
}

/* Deslocamento ótico: o triângulo do ícone tem o centro de massa à esquerda */
.gv1__play i {
    margin-left: 4px;
}

.gv1__item:hover .gv1__play,
.gv1__video:focus-visible .gv1__play {
    background: var(--accent);
    color: var(--white);
    transform: translate(-50%, -50%) scale(1.1);
}

/* Dica "Ampliar" — só aparece no hover, e nunca em touch (onde não há hover) */
.gv1__expand {
    position: absolute;
    right: 12px;
    bottom: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--radius-pill);
    background: rgba(0, 0, 0, 0.6);
    color: var(--white);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.4px;
    opacity: 0;
    transform: translateY(6px);
    transition: var(--transition);
    pointer-events: none;
}

.gv1__item:hover .gv1__expand,
.gv1__video:focus-visible .gv1__expand {
    opacity: 1;
    transform: translateY(0);
}

.gv1__video:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: -3px;
}

.gv1__info {
    padding: 18px 20px;
}

.gv1__info-title {
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 6px;
}

.gv1__info-desc {
    font-size: 0.85rem;
    color: var(--gray-medium);
    line-height: 1.5;
}

@media (min-width: 768px) {
    .gv1__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .gv1 { padding: 100px 0; }
    .gv1__title { font-size: 2.6rem; }
    .gv1__grid { grid-template-columns: repeat(3, 1fr); gap: 28px; }
}

@media (max-width: 767px) {
    .gv1 { padding: 60px 0; }
    .gv1__title { font-size: 1.8rem; }
    .gv1__play { width: 56px; height: 56px; font-size: 1.1rem; }
    /* Sem hover em touch: a dica fica sempre visível */
    .gv1__expand { opacity: 1; transform: none; }
}


/* ************************************************************
   GALERIA DE VÍDEOS 01 — Modal "Ampliar" do player
   Arquivo: resources/components/sections/galeria-videos.inc.php
   ************************************************************ */

.gv1-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.gv1-modal[hidden] {
    display: none;
}

.gv1-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 15, 25, 0.88);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    animation: gv1FadeIn 0.25s ease;
    cursor: pointer;
}

.gv1-modal__dialog {
    position: relative;
    width: min(1100px, 100%);
    animation: gv1ZoomIn 0.28s cubic-bezier(0.34, 1.3, 0.64, 1);
}

.gv1-modal__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.gv1-modal__title {
    font-family: var(--font-title);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--white);
    margin: 0;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gv1-modal__close {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: var(--white);
    font-size: 1.15rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

.gv1-modal__close:hover,
.gv1-modal__close:focus-visible {
    background: var(--accent);
    transform: rotate(90deg);
}

.gv1-modal__player {
    position: relative;
    aspect-ratio: 16 / 9;
    width: 100%;
    background: #000;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.55);
}

.gv1-modal__player iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

@keyframes gv1FadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes gv1ZoomIn {
    from { opacity: 0; transform: scale(0.94) translateY(12px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Trava o scroll do fundo enquanto o player está aberto */
body.gv1-modal-open {
    overflow: hidden;
}

@media (max-width: 767px) {
    .gv1-modal { padding: 14px; }
    .gv1-modal__title { font-size: 0.95rem; }
    .gv1-modal__close { width: 36px; height: 36px; }
}

@media (prefers-reduced-motion: reduce) {
    .gv1-modal__backdrop,
    .gv1-modal__dialog { animation: none; }
    .gv1__cover { transition: none; }
}


/* ************************************************************
   EVENTOS 01 — Lista de eventos com datas
   Arquivo: inc/eventos-lista.inc.php
   ************************************************************ */

.ev1 {
    padding: 80px 0;
    background: var(--white);
}

.ev1__header {
    text-align: center;
    margin-bottom: 50px;
}

.ev1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.ev1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 12px;
}

.ev1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    max-width: 500px;
    margin: 0 auto;
    line-height: 1.7;
}

.ev1__list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 800px;
    margin: 0 auto;
}

/* Card de evento */
.ev1__card {
    position: relative;
    display: flex;
    gap: 20px;
    background: var(--white);
    border: 1px solid #edf1f6;
    border-radius: 16px;
    padding: 22px 24px;
    box-shadow: 0 4px 16px rgba(26, 58, 107, 0.05);
    transition: var(--transition);
}

/* Fio ligando um evento ao próximo — dá leitura de linha do tempo.
   Desenhado no vão entre os cards, senão o fundo branco o cobriria. */
.ev1__card::before {
    content: '';
    position: absolute;
    top: 100%;
    /* centro do chip de data: 24px de padding + 1px de borda + 76px/2 */
    left: 62px;
    width: 2px;
    height: 20px;
    background: #dfe7f0;
}

.ev1__card:last-child::before {
    display: none;
}

.ev1__card:hover {
    transform: translateX(6px);
    border-color: #d8e3f0;
    box-shadow: 0 10px 26px rgba(26, 58, 107, 0.11);
}

/* Data em destaque */
.ev1__card-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 76px;
    padding: 14px 10px;
    background: linear-gradient(160deg, var(--primary) 0%, var(--primary-light) 100%);
    color: var(--white);
    border-radius: 14px;
    flex-shrink: 0;
    align-self: flex-start;
}

.ev1__card-day {
    font-family: var(--font-title);
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1;
}

.ev1__card-month {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 3px;
}

/* Só aparece quando o evento não é do ano corrente */
.ev1__card-year {
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px solid rgba(255, 255, 255, 0.28);
    font-size: 0.66rem;
    font-weight: 600;
    letter-spacing: 0.6px;
    opacity: 0.85;
}

/* Evento que já aconteceu — presente, mas sem competir com os próximos */
.ev1__card--past {
    background: #fbfcfd;
}

.ev1__card--past .ev1__card-date {
    background: linear-gradient(160deg, #97a4b4 0%, #7d8b9c 100%);
}

.ev1__card--past .ev1__card-title {
    color: var(--gray-dark);
}

/* Conteúdo */
.ev1__card-content {
    flex: 1;
}

.ev1__card-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    font-family: var(--font-title);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    border-radius: var(--radius-pill);
    margin-bottom: 9px;
}

.ev1__card-badge--proximo {
    background: rgba(31, 170, 80, 0.12);
    color: #1faa50;
}

.ev1__card-badge--realizado {
    background: rgba(108, 117, 125, 0.12);
    color: var(--gray-medium);
}

.ev1__card-title {
    font-family: var(--font-title);
    font-size: 1.18rem;
    font-weight: 700;
    color: var(--primary);
    line-height: 1.3;
    margin-bottom: 7px;
}

.ev1__card-desc {
    font-size: 0.92rem;
    color: var(--gray-medium);
    line-height: 1.6;
    margin-bottom: 12px;
}

/* Data, hora e local como chips — antes eram texto solto e sumiam no card */
.ev1__card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ev1__card-meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 12px;
    border-radius: var(--radius-pill);
    background: var(--gray-light);
    font-size: 0.78rem;
    color: var(--gray-dark);
    font-weight: 500;
}

.ev1__card-meta i {
    color: var(--accent);
    font-size: 0.72rem;
}

.ev1__card--past .ev1__card-meta i {
    color: var(--gray-medium);
}

@media (min-width: 1024px) {
    .ev1 { padding: 100px 0; }
    .ev1__title { font-size: 2.6rem; }
}

@media (max-width: 767px) {
    .ev1 { padding: 60px 0; }
    .ev1__title { font-size: 1.8rem; }
    .ev1__card { flex-direction: column; gap: 14px; padding: 20px; }
    .ev1__card:hover { transform: none; }
    .ev1__card-date {
        flex-direction: row;
        align-items: baseline;
        gap: 8px;
        min-width: auto;
        align-self: flex-start;
        padding: 9px 16px;
    }
    .ev1__card-day { font-size: 1.3rem; }
    .ev1__card-month { margin-top: 0; }

    /* Chip vira linha: o fio de timeline perde o alinhamento */
    .ev1__card::before { display: none; }
    .ev1__card-year {
        margin-top: 0;
        padding-top: 0;
        padding-left: 8px;
        border-top: none;
        border-left: 1px solid rgba(255, 255, 255, 0.28);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ev1__card { transition: none; }
    .ev1__card:hover { transform: none; }
}


/* ************************************************************
   CONTATO FORMULÁRIO 01 — Form + Cards de contato rápido
   Arquivo: inc/contato-form.inc.php
   ************************************************************ */

.cf1 {
    padding: 80px 0;
    background: var(--white);
}

.cf1__header {
    text-align: center;
    margin-bottom: 50px;
}

.cf1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.cf1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 12px;
}

.cf1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    max-width: 500px;
    margin: 0 auto;
    line-height: 1.7;
}

.cf1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

/* Formulário */
.cf1__form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.cf1__form-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.cf1__form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cf1__label {
    font-family: var(--font-title);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--gray-dark);
}

.cf1__input {
    padding: 13px 16px;
    border: 1.5px solid rgba(0, 0, 0, 0.1);
    border-radius: var(--radius);
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text);
    background: var(--gray-light);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cf1__input:focus {
    outline: none;
    border-color: var(--primary-light);
    box-shadow: 0 0 0 3px rgba(37, 87, 167, 0.1);
    background: var(--white);
}

.cf1__input::placeholder {
    color: var(--gray-medium);
}

.cf1__select {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236c757d'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 20px;
    padding-right: 40px;
}

.cf1__textarea {
    resize: vertical;
    min-height: 120px;
}

.cf1__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 32px;
    background: var(--primary);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    border: none;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(26, 58, 107, 0.25);
    align-self: flex-start;
}

.cf1__submit:hover {
    background: var(--primary-light);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(26, 58, 107, 0.35);
}

/* Cards de contato rápido */
.cf1__cards {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cf1__card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    background: var(--gray-light);
    border-radius: 12px;
    transition: var(--transition);
    border: 1px solid transparent;
    color: var(--text);
}

.cf1__card:hover {
    transform: translateX(6px);
    box-shadow: var(--shadow-md);
    border-color: rgba(26, 58, 107, 0.1);
    background: var(--white);
}

.cf1__card--whatsapp:hover {
    border-color: rgba(37, 211, 102, 0.3);
}

.cf1__card--instagram:hover {
    border-color: rgba(225, 48, 108, 0.3);
}

.cf1__card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--primary);
    color: var(--white);
    font-size: 1.2rem;
    flex-shrink: 0;
}

.cf1__card--whatsapp .cf1__card-icon {
    background: #25d366;
}

.cf1__card--instagram .cf1__card-icon {
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
}

.cf1__card-content {
    flex: 1;
}

.cf1__card-title {
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 2px;
}

.cf1__card-text {
    font-size: 0.82rem;
    color: var(--gray-medium);
}

.cf1__card-arrow {
    color: var(--gray-medium);
    font-size: 0.85rem;
    transition: transform 0.2s ease;
}

.cf1__card:hover .cf1__card-arrow {
    transform: translateX(4px);
    color: var(--primary);
}

/* Horário */
.cf1__schedule {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.06), rgba(37, 87, 167, 0.06));
    border-radius: 12px;
    border-left: 3px solid var(--primary);
}

.cf1__schedule i {
    color: var(--primary);
    font-size: 1.2rem;
    flex-shrink: 0;
}

.cf1__schedule strong {
    display: block;
    font-family: var(--font-title);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--gray-dark);
    margin-bottom: 2px;
}

.cf1__schedule p {
    font-size: 0.82rem;
    color: var(--gray-medium);
}

@media (min-width: 768px) {
    .cf1__form-row { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 1024px) {
    .cf1 { padding: 100px 0; }
    .cf1__title { font-size: 2.6rem; }
    .cf1__grid { grid-template-columns: 1.2fr 1fr; gap: 50px; }
}

@media (max-width: 767px) {
    .cf1 { padding: 60px 0; }
    .cf1__title { font-size: 1.8rem; }
}


/* ************************************************************
   EQUIPE INTRO 01 — Apresentação da equipe
   Arquivo: inc/equipe-intro.inc.php
   ************************************************************ */

.ei1 {
    padding: 80px 0;
    background: var(--white);
}

.ei1__content {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 50px;
}

.ei1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.ei1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 16px;
}

.ei1__text {
    font-size: 1rem;
    color: var(--gray-medium);
    line-height: 1.8;
}

/* Stats */
.ei1__stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.ei1__stat {
    text-align: center;
    padding: 28px 20px;
    background: var(--gray-light);
    border-radius: 14px;
    transition: var(--transition);
}

.ei1__stat:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.ei1__stat-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: var(--primary);
    color: var(--white);
    font-size: 1.2rem;
    margin: 0 auto 14px;
}

.ei1__stat-number {
    display: block;
    font-family: var(--font-title);
    font-size: 2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1;
    margin-bottom: 6px;
}

.ei1__stat-label {
    font-size: 0.82rem;
    color: var(--gray-medium);
    font-weight: 500;
}

@media (min-width: 768px) {
    .ei1__stats { grid-template-columns: repeat(4, 1fr); }
}

@media (min-width: 1024px) {
    .ei1 { padding: 100px 0; }
    .ei1__title { font-size: 2.6rem; }
    .ei1__stat-number { font-size: 2.4rem; }
}

@media (max-width: 767px) {
    .ei1 { padding: 60px 0; }
    .ei1__title { font-size: 1.8rem; }
}


/* ************************************************************
   EQUIPE GRID 01 — Cards de membros com filtro
   Arquivo: inc/equipe-grid.inc.php
   ************************************************************ */

.eg1 {
    padding: 0 0 80px;
    background: var(--white);
}

.eg1__header {
    text-align: center;
    margin-bottom: 30px;
}

.eg1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

/* Filtros */
.eg1__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
}

.eg1__filter {
    padding: 8px 20px;
    background: var(--gray-light);
    border: 2px solid transparent;
    border-radius: var(--radius-pill);
    font-family: var(--font-title);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--gray-medium);
    cursor: pointer;
    transition: var(--transition);
}

.eg1__filter:hover {
    color: var(--primary);
    border-color: rgba(26, 58, 107, 0.2);
}

.eg1__filter--active {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}

.eg1__filter--active:hover {
    color: var(--white);
    border-color: var(--primary);
}

/* Grid */
.eg1__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

/* Card */
.eg1__card {
    border-radius: 16px;
    overflow: hidden;
    background: var(--gray-light);
    transition: var(--transition);
}

.eg1__card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
}

.eg1__card--hidden {
    display: none;
}

/* Foto */
.eg1__card-photo {
    position: relative;
    aspect-ratio: 1/1;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.1), rgba(37, 87, 167, 0.05));
}

.eg1__card-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.eg1__card:hover .eg1__card-photo img {
    transform: scale(1.05);
}

/* Overlay hover */
.eg1__card-overlay {
    position: absolute;
    inset: 0;
    background: rgba(26, 58, 107, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.eg1__card:hover .eg1__card-overlay {
    opacity: 1;
}

.eg1__card-social {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--white);
    color: var(--primary);
    font-size: 1rem;
    transition: var(--transition);
}

.eg1__card-social:hover {
    background: var(--accent);
    color: var(--white);
    transform: scale(1.1);
}

/* Info */
.eg1__card-info {
    padding: 18px 20px;
    text-align: center;
}

.eg1__card-name {
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 4px;
}

.eg1__card-role {
    font-size: 0.8rem;
    color: var(--gray-medium);
    font-weight: 500;
}

@media (min-width: 768px) {
    .eg1__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 1024px) {
    .eg1 { padding: 0 0 100px; }
    .eg1__title { font-size: 2.6rem; }
    .eg1__grid { grid-template-columns: repeat(4, 1fr); gap: 28px; }
}

@media (max-width: 767px) {
    .eg1 { padding: 0 0 60px; }
    .eg1__title { font-size: 1.8rem; }
    .eg1__filter { padding: 6px 14px; font-size: 0.75rem; }
}


/* ************************************************************
   TOUR VIRTUAL 01 — Intro + Street View
   Arquivo: inc/tour-virtual.inc.php
   ************************************************************ */

.tv1 {
    padding: 80px 0;
    background: var(--white);
}

.tv1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}

/* Conteúdo */
.tv1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.tv1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.2;
    margin-bottom: 20px;
}

.tv1__text {
    font-size: 0.95rem;
    color: var(--gray-medium);
    line-height: 1.8;
    margin-bottom: 14px;
}

/* Destaques */
.tv1__highlights {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 24px 0;
}

.tv1__highlight-item {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.tv1__highlight-item i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(26, 58, 107, 0.08);
    color: var(--primary);
    border-radius: 10px;
    font-size: 1rem;
    flex-shrink: 0;
}

.tv1__highlight-item strong {
    display: block;
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--gray-dark);
    margin-bottom: 2px;
}

.tv1__highlight-item p {
    font-size: 0.82rem;
    color: var(--gray-medium);
    line-height: 1.4;
}

/* Botão */
.tv1__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: #25d366;
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    border-radius: var(--radius-pill);
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.35);
}

.tv1__btn:hover {
    background: #20bf5e;
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(37, 211, 102, 0.5);
}

/* Mapa Street View */
.tv1__map {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    min-height: 350px;
}

.tv1__map iframe {
    display: block;
    border: 0;
    width: 100%;
    height: 100%;
    min-height: 350px;
}

@media (min-width: 1024px) {
    .tv1 { padding: 100px 0; }
    .tv1__grid { grid-template-columns: 1fr 1.2fr; gap: 60px; }
    .tv1__title { font-size: 2.4rem; }
    .tv1__map { min-height: 420px; }
    .tv1__map iframe { min-height: 420px; }
}

@media (max-width: 767px) {
    .tv1 { padding: 60px 0; }
    .tv1__title { font-size: 1.8rem; }
    .tv1__map { min-height: 280px; }
    .tv1__map iframe { min-height: 280px; }
}


/* ************************************************************
   FOTOS DA ESTRUTURA 01 — Grid de fotos com overlay
   Arquivo: inc/fotos-estrutura.inc.php
   ************************************************************ */

.fe1 {
    padding: 0 0 80px;
    background: var(--white);
}

.fe1__header {
    text-align: center;
    margin-bottom: 50px;
}

.fe1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.fe1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
}

.fe1__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 200px;
    gap: 12px;
}

/* Estado vazio — galeria sem fotos cadastradas (fail-closed, nunca vaza
   imagens de outro projeto) */
.fe1__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 48px 24px;
    background: var(--gray-light);
    border: 1px dashed #d0d5dd;
    border-radius: 12px;
    text-align: center;
}

.fe1__empty-icon {
    font-size: 2.5rem;
    color: var(--gray-medium);
}

.fe1__empty-text {
    margin: 0;
    font-size: 1.05rem;
    color: var(--gray-medium);
}

.fe1__item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    display: block;
}

.fe1__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.fe1__item:hover img {
    transform: scale(1.06);
}

/* Overlay com info */
.fe1__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(26, 58, 107, 0.85) 0%, rgba(26, 58, 107, 0.2) 60%, transparent 100%);
    display: flex;
    align-items: flex-end;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.fe1__item:hover .fe1__overlay {
    opacity: 1;
}

.fe1__overlay-info {
    transform: translateY(12px);
    transition: transform 0.4s ease;
}

.fe1__item:hover .fe1__overlay-info {
    transform: translateY(0);
}

.fe1__overlay-title {
    font-family: var(--font-title);
    font-size: 1rem;
    font-weight: 700;
    color: var(--white);
    margin: 0 0 4px;
}

.fe1__overlay-desc {
    font-family: var(--font-body);
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    line-height: 1.4;
}

@media (min-width: 768px) {
    .fe1__grid {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 240px;
    }
    .fe1__item--wide { grid-column: span 2; }
}

@media (min-width: 1024px) {
    .fe1 { padding: 0 0 100px; }
    .fe1__title { font-size: 2.6rem; }
    .fe1__grid {
        grid-template-columns: repeat(4, 1fr);
        grid-auto-rows: 220px;
        gap: 16px;
    }
    .fe1__item--wide { grid-column: span 2; }
}

@media (max-width: 767px) {
    .fe1 { padding: 0 0 60px; }
    .fe1__title { font-size: 1.8rem; }
    .fe1__grid { grid-auto-rows: 160px; }
    .fe1__item--wide { grid-column: span 2; }
}


/* ************************************************************
   RESPONSIVE GLOBAL
   ************************************************************ */
@media (min-width: 768px) {
    .container {
        padding: 0 30px;
    }
}

@media (min-width: 1024px) {
    .container {
        padding: 0 40px;
    }
}


/* ============================================================
   COOKIE CONSENT (LGPD) — Prefixo: cc-
   Camada 19 do seguranca.md
   ============================================================ */

/* Animacao de entrada */
@keyframes cc-slideUp {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Banner principal */
.cc-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9998;
    background: var(--gray-dark, #343a40);
    color: #fff;
    padding: 0;
    animation: cc-slideUp 0.4s ease-out;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    font-family: var(--font-body, 'Inter', sans-serif);
}

.cc-banner[hidden] {
    display: none;
}

.cc-banner__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.cc-banner__text {
    flex: 1;
    min-width: 250px;
}

.cc-banner__text p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #e9ecef;
}

.cc-banner__link {
    color: #adb5bd;
    text-decoration: underline;
    transition: color 0.2s;
}

.cc-banner__link:hover {
    color: #fff;
}

.cc-banner__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* Botoes */
.cc-btn {
    border: none;
    border-radius: var(--radius, 8px);
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    line-height: 1.4;
}

.cc-btn:focus-visible {
    outline: 3px solid #ffc107;
    outline-offset: 2px;
}

.cc-btn--accept {
    background: var(--accent, #e63946);
    color: #fff;
}

.cc-btn--accept:hover {
    background: var(--accent-hover, #c1121f);
}

.cc-btn--reject {
    background: transparent;
    color: #adb5bd;
    border: 1px solid #6c757d;
}

.cc-btn--reject:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.cc-btn--settings {
    background: transparent;
    color: #e9ecef;
    border: 1px solid #adb5bd;
}

.cc-btn--settings:hover {
    background: rgba(255, 255, 255, 0.1);
}

/* Modal de configuracao */
.cc-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.cc-modal[hidden] {
    display: none;
}

.cc-modal__content {
    background: #fff;
    border-radius: 12px;
    padding: 32px;
    max-width: 500px;
    width: 100%;
    max-height: 80vh;
    overflow-y: auto;
    color: var(--text, #2d3436);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.cc-modal__title {
    font-family: var(--font-title, 'Montserrat', sans-serif);
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 20px;
    color: var(--primary, #1a3a6b);
}

.cc-category {
    padding: 16px 0;
    border-bottom: 1px solid #e9ecef;
}

.cc-category:last-of-type {
    border-bottom: none;
}

.cc-category__label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-weight: 600;
    font-size: 15px;
}

.cc-category__label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--accent, #e63946);
}

.cc-category--required .cc-category__label {
    opacity: 0.7;
    cursor: default;
}

.cc-category--required input[type="checkbox"] {
    cursor: default;
}

.cc-category__desc {
    margin: 6px 0 0 28px;
    font-size: 13px;
    color: var(--gray-medium, #6c757d);
    line-height: 1.4;
}

.cc-modal__actions {
    display: flex;
    gap: 10px;
    margin-top: 24px;
    justify-content: flex-end;
}

/* Responsivo mobile */
@media (max-width: 768px) {
    .cc-banner__inner {
        flex-direction: column;
        text-align: center;
        padding: 16px;
        gap: 16px;
    }

    .cc-banner__actions {
        justify-content: center;
        width: 100%;
    }

    .cc-btn {
        flex: 1;
        min-width: 0;
        padding: 10px 14px;
        font-size: 13px;
    }

    .cc-modal__content {
        padding: 24px;
    }

    .cc-modal__actions {
        flex-direction: column;
    }

    .cc-modal__actions .cc-btn {
        width: 100%;
    }
}

/* ************************************************************
   POLÍTICA DE PRIVACIDADE 01 — Página legal LGPD
   Arquivo: resources/components/sections/politica-privacidade.inc.php
   ************************************************************ */

.pp1 {
    padding: 60px 0 80px;
    background: var(--white);
}

.pp1__content {
    max-width: 860px;
    margin: 0 auto;
}

.pp1__intro {
    padding-bottom: 32px;
    margin-bottom: 32px;
    border-bottom: 2px solid var(--gray-light);
}

.pp1__title {
    font-family: var(--font-title);
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    color: var(--primary);
    margin: 0 0 16px;
    line-height: 1.2;
}

.pp1__lead {
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--text);
    margin: 0 0 16px;
}

.pp1__meta {
    font-size: 0.9rem;
    color: var(--gray-medium);
    font-style: italic;
    margin: 0;
}

.pp1__section {
    margin-bottom: 32px;
}

.pp1__section-title {
    font-family: var(--font-title);
    font-size: 1.25rem;
    color: var(--primary);
    margin: 0 0 12px;
    line-height: 1.3;
}

.pp1__subtitle {
    font-family: var(--font-title);
    font-size: 1.05rem;
    color: var(--text);
    margin: 18px 0 8px;
    line-height: 1.35;
}

.footer__legal-entity {
    display: inline-block;
    margin-top: 4px;
    font-size: 0.82rem;
    opacity: 0.75;
}

.pp1__section p {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--text);
    margin: 0 0 12px;
}

.pp1__list {
    list-style: none;
    padding: 0;
    margin: 0 0 12px;
}

.pp1__list li {
    position: relative;
    padding: 6px 0 6px 24px;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text);
}

.pp1__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 14px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
}

.pp1__section a {
    color: var(--primary-light);
    text-decoration: underline;
    transition: var(--transition);
}

.pp1__section a:hover,
.pp1__section a:focus-visible {
    color: var(--accent);
}

/* ************************************************************
   TERMOS DE USO 01 — Página legal
   Arquivo: resources/components/sections/termos-de-uso.inc.php
   ************************************************************ */

.tu1 {
    padding: 60px 0 80px;
    background: var(--white);
}

.tu1__content {
    max-width: 860px;
    margin: 0 auto;
}

.tu1__intro {
    padding-bottom: 32px;
    margin-bottom: 32px;
    border-bottom: 2px solid var(--gray-light);
}

.tu1__title {
    font-family: var(--font-title);
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    color: var(--primary);
    margin: 0 0 16px;
    line-height: 1.2;
}

.tu1__lead {
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--text);
    margin: 0 0 16px;
}

.tu1__meta {
    font-size: 0.9rem;
    color: var(--gray-medium);
    font-style: italic;
    margin: 0;
}

.tu1__section {
    margin-bottom: 32px;
}

.tu1__section-title {
    font-family: var(--font-title);
    font-size: 1.25rem;
    color: var(--primary);
    margin: 0 0 12px;
    line-height: 1.3;
}

.tu1__section p {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--text);
    margin: 0 0 12px;
}

.tu1__list {
    list-style: none;
    padding: 0;
    margin: 0 0 12px;
}

.tu1__list li {
    position: relative;
    padding: 6px 0 6px 24px;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text);
}

.tu1__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 14px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
}

.tu1__section a {
    color: var(--primary-light);
    text-decoration: underline;
    transition: var(--transition);
}

.tu1__section a:hover,
.tu1__section a:focus-visible {
    color: var(--accent);
}

/* Responsive — pp1 + tu1 */
@media (max-width: 768px) {

    .pp1,
    .tu1 {
        padding: 40px 0 60px;
    }

    .pp1__section-title,
    .tu1__section-title {
        font-size: 1.1rem;
    }
}

/* ************************************************************
   TRABALHE CONOSCO 01 — Formulário de candidatura (módulo RH)
   Arquivo: resources/components/sections/trabalhe-conosco.inc.php
   Port do 8-provedor-internet adaptado ao design system escolar.
   ************************************************************ */

.tc1 {
    padding: 80px 0;
    background: var(--white);
}

.tc1__header {
    text-align: center;
    margin-bottom: 50px;
}

.tc1__badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(26, 58, 107, 0.08), rgba(37, 87, 167, 0.08));
    color: var(--primary);
    font-family: var(--font-title);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    margin-bottom: 16px;
}

.tc1__title {
    font-family: var(--font-title);
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 12px;
}

.tc1__subtitle {
    font-size: 1rem;
    color: var(--gray-medium);
    max-width: 640px;
    margin: 0 auto;
    line-height: 1.7;
}

.tc1__form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 860px;
    margin: 0 auto;
}

/* Honeypot — fora da viewport (não usar display:none: bots detectam) */
.tc1__hp {
    position: absolute;
    left: -9999px;
    top: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.tc1__fieldset {
    border: 1.5px solid rgba(0, 0, 0, 0.08);
    border-radius: var(--radius);
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    background: var(--white);
}

.tc1__legend {
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--primary);
    padding: 0 10px;
}

.tc1__row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.tc1__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tc1__label {
    font-family: var(--font-title);
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-dark);
}

.tc1__input {
    padding: 13px 16px;
    border: 1.5px solid rgba(0, 0, 0, 0.1);
    border-radius: var(--radius);
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--text);
    background: var(--gray-light);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    width: 100%;
}

.tc1__input:focus {
    outline: none;
    border-color: var(--primary-light);
    box-shadow: 0 0 0 3px rgba(37, 87, 167, 0.1);
    background: var(--white);
}

.tc1__input::placeholder {
    color: var(--gray-medium);
}

.tc1__select {
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236c757d' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
    cursor: pointer;
}

.tc1__textarea {
    resize: vertical;
    min-height: 110px;
}

.tc1__file input[type="file"] {
    padding: 10px;
    border: 1.5px dashed rgba(0, 0, 0, 0.18);
    border-radius: var(--radius);
    background: var(--gray-light);
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--gray-dark);
    cursor: pointer;
}

.tc1__hint {
    font-size: 0.8rem;
    color: var(--gray-medium);
    min-height: 1em;
}

.tc1__hint.is-ok  { color: #1e8449; }
.tc1__hint.is-err { color: var(--accent); }

.tc1__check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.88rem;
    color: var(--gray-dark);
    line-height: 1.55;
    cursor: pointer;
}

.tc1__check input[type="checkbox"] {
    margin-top: 3px;
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    accent-color: var(--primary);
    cursor: pointer;
}

.tc1__submit {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 34px;
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 700;
    border: none;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: var(--transition);
    box-shadow: var(--shadow-md);
}

.tc1__submit:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.tc1__submit:disabled {
    opacity: 0.65;
    cursor: wait;
    transform: none;
}

.tc1__status {
    font-size: 0.9rem;
    font-weight: 600;
    min-height: 1.2em;
    margin: 0;
}

.tc1__status.is-ok  { color: #1e8449; }
.tc1__status.is-err { color: var(--accent); }

/* Tablet+ */
@media (min-width: 768px) {
    .tc1__row {
        grid-template-columns: 1fr 1fr;
    }

    .tc1__row--three {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .tc1__row--cepaddr {
        grid-template-columns: 220px 1fr;
    }

    .tc1__row--numcomp {
        grid-template-columns: 220px 1fr;
    }

    .tc1__row--ciduf {
        grid-template-columns: 1fr 140px;
    }
}

/* ************************************************************
   ANSWER-BLOCK 01 — Resposta direta no topo (GEO/AXO Seção 2)
   Arquivo: resources/components/sections/answer-block.inc.php
   A classe "answer-block" é contrato do Gate 2 (grep do audit) —
   não renomear. Texto vem 100% do CMS por tenant (Gate 10).
   ************************************************************ */
.answer-block {
    padding: 48px 0;
    background: var(--white);
}

/* Cartão central — destaca a resposta sem competir com o H1 do slider.
   O max-width menor é escopado a esta seção (o .container global é 1280px,
   largo demais para um bloco de texto centralizado). */
.answer-block .container {
    max-width: 900px;
    text-align: center;
    background: var(--gray-light);
    border: 1px solid rgba(26, 58, 107, 0.08);
    border-radius: 16px;
    padding: 40px 24px;
    box-shadow: var(--shadow-sm);
}

.answer-block__question {
    font-family: var(--font-title);
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--primary);
    margin: 0 0 18px;
    line-height: 1.35;
    position: relative;
    padding-bottom: 18px;
}

/* Filete decorativo sob a pergunta */
.answer-block__question::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 56px;
    height: 3px;
    border-radius: 2px;
    background: var(--accent);
}

.answer-block__answer {
    font-family: var(--font-body);
    font-size: 1.06rem;
    color: var(--text);
    line-height: 1.75;
    margin: 0 auto 24px;
    max-width: 68ch;
}

.answer-block__cta {
    margin: 0;
}

.answer-block__link {
    display: inline-block;
    font-family: var(--font-title);
    font-weight: 600;
    color: var(--white);
    background: var(--accent);
    padding: 13px 32px;
    border-radius: var(--radius-pill);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.answer-block__link:hover,
.answer-block__link:focus-visible {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

@media (min-width: 768px) {
    .answer-block {
        padding: 64px 0;
    }

    .answer-block .container {
        padding: 48px 40px;
    }

    .answer-block__question {
        font-size: 1.55rem;
    }

    .answer-block__answer {
        font-size: 1.1rem;
    }
}

/* ************************************************************
   AUTOR PERFIL 01 — Página de autor /equipe/{slug} (GEO/AXO Seção 4.2)
   Arquivo: resources/components/sections/autor-perfil.inc.php
   ************************************************************ */
.au1 {
    padding: 48px 0 64px;
    background: var(--white);
}

.au1__grid {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.au1__foto {
    width: 200px;
    height: 200px;
    object-fit: cover;
    border-radius: 50%;
    box-shadow: var(--shadow-md);
}

.au1__cargo {
    font-family: var(--font-title);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--primary);
    margin: 0 0 4px;
}

.au1__badge,
.ef1__badge {
    display: inline-block;
    font-family: var(--font-body);
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--white);
    background: var(--accent);
    border-radius: var(--radius-pill);
    padding: 2px 10px;
    margin-left: 8px;
    vertical-align: middle;
}

.au1__credencial {
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: var(--gray-medium);
    margin: 0 0 16px;
}

.au1__bio p {
    font-family: var(--font-body);
    color: var(--text);
    line-height: 1.7;
    margin: 0 0 12px;
    max-width: 760px;
}

.au1__links {
    list-style: none;
    padding: 0;
    margin: 16px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.au1__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--primary-light);
    text-decoration: none;
    border: 1px solid var(--primary-light);
    border-radius: var(--radius-pill);
    padding: 6px 14px;
    transition: var(--transition);
}

.au1__link:hover,
.au1__link:focus-visible {
    background: var(--primary-light);
    color: var(--white);
}

.au1__conteudos {
    margin-top: 40px;
}

.au1__conteudos-titulo {
    font-family: var(--font-title);
    font-size: 1.3rem;
    color: var(--gray-dark);
    margin: 0 0 12px;
}

.au1__conteudos-lista {
    padding-left: 20px;
}

.au1__conteudos-lista a {
    color: var(--primary-light);
}

@media (min-width: 768px) {
    .au1__grid {
        flex-direction: row;
        align-items: flex-start;
        gap: 40px;
    }

    .au1__foto-wrap {
        flex: 0 0 auto;
    }
}

/* ************************************************************
   EQUIPE FUNDADORES 01 — Fundadores/liderança no /sobre (GEO/AXO Seção 4.1)
   Arquivo: resources/components/sections/equipe-fundadores.inc.php
   Dados 100% de tenant_seo_people; sem gente cadastrada não renderiza.
   ************************************************************ */
.ef1 {
    padding: 56px 0;
    background: var(--gray-light);
}

.ef1__header {
    text-align: center;
    margin-bottom: 32px;
}

.ef1__title {
    font-family: var(--font-title);
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--gray-dark);
    margin: 0;
}

.ef1__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.ef1__card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    padding: 28px 24px;
    text-align: center;
    transition: var(--transition);
}

.ef1__card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-4px);
}

.ef1__foto {
    width: 110px;
    height: 110px;
    object-fit: cover;
    border-radius: 50%;
    margin-bottom: 14px;
}

.ef1__nome {
    font-family: var(--font-title);
    font-size: 1.15rem;
    margin: 0 0 4px;
}

.ef1__nome-link {
    color: var(--primary);
    text-decoration: none;
}

.ef1__nome-link:hover,
.ef1__nome-link:focus-visible {
    color: var(--primary-light);
    text-decoration: underline;
}

.ef1__cargo {
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--gray-medium);
    margin: 0 0 4px;
}

.ef1__credencial {
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--gray-medium);
    margin: 0 0 10px;
}

.ef1__bio {
    font-family: var(--font-body);
    font-size: 0.92rem;
    color: var(--text);
    line-height: 1.6;
    margin: 0 0 14px;
}

.ef1__perfil-link {
    display: inline-block;
    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--primary-light);
    text-decoration: none;
}

.ef1__perfil-link:hover,
.ef1__perfil-link:focus-visible {
    text-decoration: underline;
}

@media (min-width: 768px) {
    .ef1__grid {
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        max-width: 900px;
        margin: 0 auto;
    }
}

/* ************************************************************
   SKIP LINK — WCAG 2.2 (GEO/AXO Seção 6.5)
   Primeiro elemento focável da página (header2). Invisível até
   receber foco por teclado; agente/leitor de tela navega direto
   ao <main id="main">.
   ************************************************************ */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 10000;
    background: var(--primary);
    color: var(--white);
    font-family: var(--font-body);
    font-weight: 600;
    padding: 12px 20px;
    border-radius: 0 0 var(--radius) 0;
    text-decoration: none;
}

.skip-link:focus,
.skip-link:focus-visible {
    left: 0;
    outline: 3px solid var(--accent);
    outline-offset: 2px;
}

/* ============================================
   **** VISUALLY-HIDDEN UTIL (GEO/AXO Seção 9) ****
   Conteúdo presente para leitores de tela e crawlers, invisível na tela.
   Uso: H1 da home (hero 100% imagem — Gate 13: um único H1 por página).
   ============================================ */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============================================
   **** LEAD FORM FEEDBACK (Etapa E — captação) ****
   Mensagens de sucesso/erro dos formulários públicos de lead
   (ct1, ct2, lc1, cf1) — renderizadas em HTML puro no fluxo sem-JS
   (?lead=ok|err) e injetadas pelo JS no fluxo com fetch.
   Honeypot .lead-hp: campo invisível para humanos (anti-bot).
   ============================================ */
.lead-hp {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.lead-msg {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 24px;
    border-radius: var(--radius);
    font-family: var(--font-body);
    margin-bottom: 16px;
}

.lead-msg i {
    font-size: 1.8rem;
}

.lead-msg strong {
    font-family: var(--font-title);
    font-size: 1.15rem;
}

.lead-msg p {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
}

.lead-msg--ok {
    background: #e8f5e9;
    border: 1px solid #a5d6a7;
    color: #1b5e20;
}

/* Segundo caminho de conversão na tela de sucesso do formulário. */
.lead-msg__wa {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    padding: 11px 22px;
    border-radius: var(--radius-pill);
    background: #25d366;
    color: #06331a;
    font-family: var(--font-title);
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    transition: var(--transition);
}

.lead-msg__wa::before {
    content: "\f232"; /* fa-whatsapp */
    font-family: "Font Awesome 6 Brands";
    font-size: 1.1rem;
}

.lead-msg__wa:hover,
.lead-msg__wa:focus-visible {
    background: #1da851;
    color: var(--white);
    transform: translateY(-2px);
}

.lead-msg--ok i {
    color: #2e7d32;
}

.lead-msg--err {
    background: #fdecea;
    border: 1px solid #f5c6cb;
    color: #7f1d1d;
}

.lead-msg--err i {
    color: #c62828;
}

.lead-msg:focus {
    outline: 3px solid var(--primary-light);
    outline-offset: 2px;
}

/* Botão do form em estado de envio (JS) */
.lead-form-sending button[type="submit"] {
    opacity: 0.6;
    pointer-events: none;
}

/* ************************************************************
   ACESSIBILIDADE WCAG 2.2 AA — GEO/AXO §D (home ≥9,8)
   Overrides cascade-safe (mesma especificidade, declarados por
   último): contraste AA em texto/CTA sobre --accent, foco
   visível nos controles de slider/carrossel/lightbox e
   movimento reduzido global.
   ************************************************************ */

/* §D.23 — Texto branco sobre --accent (#e63946 ≈ 4.17:1) reprova AA para
   texto < 18.66px bold; --accent-hover (#c1121f ≈ 5.6:1) passa. Botões de
   conversão e eyebrows/badges pequenos migram para o tom escuro do par. */
.ct1__btn-submit,
.ct2__btn {
    background: var(--accent-hover);
}

.ne1__card-tag,
.df1__badge,
.dp1__badge,
.ct2__eyebrow {
    color: var(--accent-hover);
}

.ne1__card-link:hover,
.ct2__link:hover {
    color: var(--accent-hover);
}

/* §D.22 — outline do skip-link era --accent sobre --primary (≈1.9:1 <3:1
   não-texto). Branco sobre --primary ≈7.8:1. */
.skip-link:focus,
.skip-link:focus-visible {
    outline-color: var(--white);
}

/* §D.22/§D.25 — foco visível nos controles que só tinham a regra global
   (invisível sobre imagem/fundo escuro): slider, carrossel de depoimentos
   e lightbox. */
.slider__arrow:focus-visible,
.slider__dot:focus-visible,
.lightbox__close:focus-visible,
.lightbox__nav:focus-visible {
    outline: 3px solid var(--white);
    outline-offset: 3px;
}

.dp1__dot:focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 3px;
}

/* §D.26 — movimento reduzido GLOBAL: reveals/contadores/transições viram
   instantâneos; complementa os blocos locais (slider.css já respeita). */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }
}

/* ************************************************************
   LEAD FORM 01 — formulário ÚNICO de captura de leads
   Arquivo: resources/components/forms/lead-form.inc.php
   Substitui os estilos de form duplicados em ct1/ct2/lc1/cf1.
   Linguagem visual herdada do ct2 (campos com ícone, pill vermelho).
   Variante .lf--on-dark para heros/CTAs com fundo escuro.
   ************************************************************ */
.lf {
    --lf-radius: 12px;
    --lf-border: #e8eef5;
    --lf-bg: #f8fbff;
    --lf-label: var(--primary);
    display: block;
}

.lf__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.lf__group {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.lf__group[hidden] {
    display: none;
}

.lf__label {
    font-family: var(--font-title);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--lf-label);
}

.lf__optional {
    font-weight: 500;
    opacity: 0.7;
}

.lf__field {
    position: relative;
    display: flex;
}

.lf__icon {
    position: absolute;
    top: 50%;
    left: 16px;
    transform: translateY(-50%);
    font-size: 0.92rem;
    color: var(--primary-light);
    opacity: 0.65;
    pointer-events: none;
}

.lf__input {
    width: 100%;
    padding: 14px 16px 14px 44px;
    border: 2px solid var(--lf-border);
    border-radius: var(--lf-radius);
    background: var(--lf-bg);
    font-family: var(--font-body);
    font-size: 0.94rem;
    color: var(--text);
    outline: none;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.lf__textarea {
    padding-left: 16px;
    resize: vertical;
    min-height: 104px;
}

.lf__input::placeholder {
    color: #a3adb9;
}

.lf__input:hover {
    border-color: #d5e2f0;
}

.lf__input:focus {
    background: var(--white);
    border-color: var(--primary-light);
    box-shadow: 0 0 0 4px rgba(37, 87, 167, 0.13);
}

.lf__select {
    cursor: pointer;
    appearance: none;
    padding-right: 44px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'><path d='M1 1.5 6 6.5l5-5' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position: right 16px center;
    /* Sem background-size o SVG (que não declara width/height) era esticado
       pelo tamanho do próprio select — a seta saía enorme. */
    background-size: 11px 7px;
}

/* ---------- ERRO POR CAMPO ---------- */
.lf__input[aria-invalid="true"] {
    border-color: var(--accent);
    background: #fff7f7;
}

.lf__input[aria-invalid="true"]:focus {
    box-shadow: 0 0 0 4px rgba(230, 57, 70, 0.16);
}

.lf__error {
    margin: 0;
    font-family: var(--font-body);
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--accent-hover);
    line-height: 1.35;
}

.lf__error[hidden] {
    display: none;
}

/* ---------- CONSENTIMENTO + BOTÃO ---------- */
.lf__footer {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px dashed #dfe7f1;
}

.lf__consent {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 10px;
    align-items: start;
}

.lf__checkbox {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--primary-light);
    cursor: pointer;
    flex-shrink: 0;
}

.lf__checkbox-label {
    font-family: var(--font-body);
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--gray-medium);
    cursor: pointer;
}

.lf__consent .lf__error {
    grid-column: 1 / -1;
}

.lf__link {
    color: var(--primary-light);
    font-weight: 600;
    text-decoration: underline;
}

.lf__link:hover,
.lf__link:focus-visible {
    color: var(--primary);
}

.lf__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 15px 28px;
    border: none;
    border-radius: var(--radius-pill);
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.lf__submit:hover,
.lf__submit:focus-visible {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.lf__submit[disabled] {
    opacity: 0.7;
    cursor: progress;
    transform: none;
    box-shadow: var(--shadow-sm);
}

.lf__status {
    margin: 14px 0 0;
    padding: 12px 16px;
    border-radius: var(--lf-radius);
    font-family: var(--font-body);
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.45;
}

.lf__status[hidden] {
    display: none;
}

.lf__status--ok {
    background: #e8f6ee;
    color: #1b6b3f;
}

.lf__status--err {
    background: #fdecec;
    color: var(--accent-hover);
}

/* ---------- VARIANTE PARA FUNDO ESCURO ---------- */
.lf--on-dark {
    --lf-border: rgba(255, 255, 255, 0.22);
    --lf-bg: rgba(255, 255, 255, 0.1);
    --lf-label: var(--white);
}

.lf--on-dark .lf__input {
    color: var(--white);
}

.lf--on-dark .lf__input::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.lf--on-dark .lf__icon {
    color: var(--white);
    opacity: 0.75;
}

.lf--on-dark .lf__input:hover {
    border-color: rgba(255, 255, 255, 0.4);
}

.lf--on-dark .lf__input:focus {
    background: rgba(255, 255, 255, 0.18);
    border-color: var(--white);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.18);
}

/* Opções do select precisam de fundo claro mesmo na variante escura. */
.lf--on-dark .lf__select option {
    color: var(--text);
    background: var(--white);
}

.lf--on-dark .lf__checkbox-label {
    color: rgba(255, 255, 255, 0.88);
}

.lf--on-dark .lf__link {
    color: var(--white);
}

.lf--on-dark .lf__footer {
    border-top-color: rgba(255, 255, 255, 0.22);
}

.lf--on-dark .lf__error {
    color: #ffc9cd;
}

.lf--on-dark .lf__input[aria-invalid="true"] {
    border-color: #ffc9cd;
    background: rgba(230, 57, 70, 0.18);
}

/* ---------- RESPONSIVO ----------
   Baseado no CONTÊINER, não na janela: o mesmo formulário aparece num
   cartão de ~900px (home) e num de ~500px (coluna da LP). Com media query
   de viewport, a LP virava 2 colunas em campos de ~200px e espremia o
   consentimento em 11 linhas ao lado do botão.

   Base = 1 coluna e rodapé empilhado (também é o fallback para navegador
   sem @container). Duas colunas só quando o cartão realmente comporta. */
.lf {
    container-type: inline-size;
}

.lf__group--full {
    grid-column: 1 / -1;
}

@container (min-width: 560px) {
    .lf__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lf__footer {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
    }

    .lf__submit {
        width: auto;
        flex-shrink: 0;
    }
}

/* ************************************************************
   MODAL DA POLÍTICA DE PRIVACIDADE
   Aberto pelo link de consentimento dos formulários de lead
   (IIFE no script.js). Mantém o visitante na página do formulário.
   ************************************************************ */
.pv-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(15, 26, 45, 0.62);
    backdrop-filter: blur(2px);
}

.pv-modal[hidden] {
    display: none;
}

body.pv-modal-open {
    overflow: hidden;
}

.pv-modal__dialog {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 820px;
    max-height: 88vh;
    background: var(--white);
    border-radius: 16px;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.32);
    outline: none;
    overflow: hidden;
}

.pv-modal__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid #e8eef5;
    flex-shrink: 0;
}

.pv-modal__title {
    margin: 0;
    font-family: var(--font-title);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--primary);
}

.pv-modal__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: none;
    border-radius: 50%;
    background: var(--gray-light);
    color: var(--gray-dark);
    font-size: 1rem;
    cursor: pointer;
    flex-shrink: 0;
    transition: var(--transition);
}

.pv-modal__close:hover,
.pv-modal__close:focus-visible {
    background: var(--accent);
    color: var(--white);
}

.pv-modal__body {
    padding: 4px 24px 8px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.pv-modal__loading {
    padding: 32px 0;
    text-align: center;
    color: var(--gray-medium);
    font-family: var(--font-body);
}

/* O conteúdo importado traz o layout da página; dentro do modal ele
   não deve reservar padding de seção nem largura de container. */
.pv-modal__body .pp1,
.pv-modal__body .pp1__content {
    padding: 0;
    margin: 0;
    max-width: none;
    background: transparent;
    box-shadow: none;
}

.pv-modal__foot {
    padding: 16px 24px 20px;
    border-top: 1px solid #e8eef5;
    text-align: right;
    flex-shrink: 0;
}

.pv-modal__btn {
    padding: 12px 26px;
    border: none;
    border-radius: var(--radius-pill);
    background: var(--accent);
    color: var(--white);
    font-family: var(--font-title);
    font-size: 0.9rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
}

.pv-modal__btn:hover,
.pv-modal__btn:focus-visible {
    background: var(--accent-hover);
}

@media (max-width: 640px) {
    .pv-modal {
        padding: 0;
    }

    .pv-modal__dialog {
        max-width: none;
        max-height: 100vh;
        height: 100%;
        border-radius: 0;
    }
}

/* ---------- CARTÃO PADRÃO DO FORMULÁRIO ----------
   Um único padrão visual em todas as páginas: o mesmo cartão branco da
   home. Antes cada seção resolvia por conta própria (a LP mostrava o
   formulário direto sobre o fundo escuro). Valores herdados do .ct2__card. */
.lf--card {
    background: var(--white);
    border-radius: 28px;
    padding: 36px;
    box-shadow: 0 18px 50px rgba(26, 58, 107, 0.13);
}

@media (max-width: 640px) {
    .lf--card {
        padding: 24px 20px;
        border-radius: 20px;
    }
}

/* A home já tinha o cartão no wrapper da seção; o componente passou a
   fornecê-lo, então o wrapper vira apenas contêiner (evita cartão duplo). */
.ct2__card--flat {
    background: none;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}

/* ************************************************************
   CONTRASTE DO ACCENT (WCAG AA) — sistema por tenant
   O texto sobre o accent NÃO pode ser branco fixo: funciona em
   accent escuro (vermelho) e reprova em accent claro (laranja
   #FF9B24 + branco = 2,11:1). O tema do tenant injeta --on-accent
   já calculado por contraste (app/Support/AccentPalette.php);
   aqui o default preserva o comportamento histórico.
   ************************************************************ */
:root {
    --on-accent: var(--white);
}

.ct1__btn-submit,
.ct2__btn,
.lc1__submit,
.tc1__submit,
.lf__submit,
.pv-modal__btn,
.answer-block__link,
.sl1__btn,
.cn1__highlight,
.ht1__intro-badge,
.bl1__image-flag,
.lc1__badge-urgency,
.au1__badge,
.ef1__badge,
.cc-btn--accept,
.lv1__play,
.lv1__cta-btn {
    color: var(--on-accent);
}

/* No hover o fundo vira --accent-hover (escurecido ate passar AA com
   branco), onde o PRETO cairia para ~4,5:1. Todos os alvos que trocam de
   fundo no hover passam a texto branco. */
.ct1__btn-submit:hover,
.ct1__btn-submit:focus-visible,
.ct2__btn:hover,
.ct2__btn:focus-visible,
.lc1__submit:hover,
.lc1__submit:focus-visible,
.tc1__submit:hover,
.tc1__submit:focus-visible,
.lf__submit:hover,
.lf__submit:focus-visible,
.pv-modal__btn:hover,
.pv-modal__btn:focus-visible,
.answer-block__link:hover,
.answer-block__link:focus-visible,
.sl1__btn:hover,
.sl1__btn:focus-visible,
.cn1__highlight:hover,
.cn1__highlight:focus-visible,
.cc-btn--accept:hover,
.cc-btn--accept:focus-visible,
.lv1__cta-btn:hover,
.lv1__cta-btn:focus-visible,
.lv1__facade:hover .lv1__play,
.lv1__facade:focus-visible .lv1__play {
    color: var(--white);
}

/* ============================================================
   PÁGINA DE ERRO 01 (.pe1) — 404/500 temática, por tenant
   Usa as CSS variables globais (sobrescritas por cms_appearance),
   então acompanha a marca de cada cliente sem override.
   ============================================================ */
.pe1 {
    padding: 80px 0 100px;
    background: var(--white);
}
.pe1__inner {
    max-width: 640px;
    margin: 0 auto;
    text-align: center;
}
.pe1__code {
    font-family: var(--font-title);
    font-size: clamp(64px, 12vw, 120px);
    font-weight: 800;
    line-height: 1;
    color: var(--primary);
    margin: 0 0 8px;
}
.pe1__title {
    font-family: var(--font-title);
    font-size: clamp(24px, 4vw, 34px);
    color: var(--text);
    margin: 0 0 14px;
}
.pe1__text {
    font-size: 17px;
    color: var(--gray-medium);
    line-height: 1.6;
    margin: 0 0 32px;
}
.pe1__btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: var(--accent);
    color: var(--white);
    font-weight: 600;
    border-radius: var(--radius-pill);
    text-decoration: none;
    transition: var(--transition);
}
.pe1__btn:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.pe1__btn:focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 3px;
}