/* ============================================================
   SE Madureira — Estilos Globais
   Cores oficiais: Verde #1B6B2A | Vermelho #C8102E | Branco #FFF | Amarelo #FFD700
   ============================================================ */

:root {
    /* Verde — cor principal */
    --green:       #1B6B2A;
    --green-dark:  #124a1d;
    --green-light: #e4f0e7;

    /* Vermelho — cor de destaque / CTA */
    --red:         #C8102E;
    --red-dark:    #9e0b23;
    --red-light:   #f5e0e4;

    /* Amarelo — estrelas / badges */
    --yellow:      #FFD700;
    --yellow-dark: #e6c000;

    /* Neutros */
    --white:  #ffffff;
    --black:  #1A1A1A;
    --gray:   #6c757d;
    --light:  #f8f9fa;
    --border: #dee2e6;
    --shadow: 0 4px 24px rgba(0,0,0,.10);

    /* Aliases para compat. com código existente */
    --primary:     var(--green);
    --primary-dark: var(--green-dark);
    --accent:      var(--red);
}

/* Bootstrap overrides — primário = VERDE */
.bg-primary    { background-color: var(--green) !important; }
.btn-primary   { background-color: var(--green); border-color: var(--green); }
.btn-primary:hover { background-color: var(--green-dark); border-color: var(--green-dark); }
.text-primary  { color: var(--green) !important; }
.border-primary{ border-color: var(--green) !important; }

/* Vermelho como danger/accent já vem do Bootstrap — reforços: */
.text-danger   { color: var(--red) !important; }
.btn-danger    { background-color: var(--red); border-color: var(--red); }
.btn-danger:hover { background-color: var(--red-dark); border-color: var(--red-dark); }
.border-danger { border-color: var(--red) !important; }

.btn-accent {
    background-color: #fff;
    color: var(--green);
    font-weight: 700;
    border: 2px solid #fff;
    border-radius: 50px;
    transition: .25s;
}
.btn-accent:hover { background-color: var(--green); color: #fff; border-color: var(--green); }

/* Botão vermelho especial para CTAs de inscrição */
.btn-cta-red {
    background-color: var(--red);
    color: #fff;
    font-weight: 700;
    border: 2px solid var(--red);
    border-radius: 50px;
    transition: .25s;
}
.btn-cta-red:hover { background-color: var(--red-dark); color: #fff; border-color: var(--red-dark); }

/* Global */
* { box-sizing: border-box; }
body { font-family: 'Open Sans', sans-serif; color: var(--black); }
h1,h2,h3,h4,h5,h6 { font-family: 'Montserrat', sans-serif; font-weight: 700; }
a { color: var(--red); text-decoration: none; }
a:hover { color: var(--red-dark); }
img { max-width: 100%; }

/* Topbar */
.topbar {
    background: var(--green-dark);
    color: #fff;
    font-size: .82rem;
    padding: .35rem 0;
}
.topbar a { color: rgba(255,255,255,.75); }
.topbar a:hover { color: #fff; }
.topbar-social a { font-size: 1rem; margin-left: .6rem; }

/* Navbar */
.navbar { box-shadow: 0 2px 12px rgba(0,0,0,.2); }
.navbar-dark .navbar-nav .nav-link {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: .9rem;
    letter-spacing: .02em;
    padding: .5rem .75rem;
    border-radius: 6px;
    transition: background .2s;
}
.navbar-dark .navbar-nav .nav-link:hover { background: rgba(255,255,255,.15); }
.brand-name { font-family: 'Montserrat', sans-serif; font-weight: 900; font-size: 1.15rem; line-height: 1.1; color: #fff; }
.brand-sub  { font-size: .65rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.75); }

/* Hero — listras diagonais verde+vermelho como o uniforme do Madureira */
.hero {
    background: linear-gradient(160deg, var(--green-dark) 0%, var(--green) 45%, var(--red) 100%);
    color: #fff;
    padding: 6rem 0 4rem;
    position: relative;
    overflow: hidden;
}
.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('/assets/images/hero-bg.jpg') center/cover no-repeat;
    opacity: .18;
}
/* Faixa decorativa diagonal (imita listras do uniforme) */
.hero::after {
    content: '';
    position: absolute;
    top: -80px; right: -80px;
    width: 420px; height: 420px;
    background: repeating-linear-gradient(
        -45deg,
        rgba(255,255,255,.04) 0px,
        rgba(255,255,255,.04) 20px,
        transparent 20px,
        transparent 40px
    );
    border-radius: 50%;
    pointer-events: none;
}
.hero-content { position: relative; z-index: 1; }
.hero h1 { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 900; line-height: 1.1; }
.hero p { font-size: 1.15rem; opacity: .92; max-width: 560px; }
.hero-badge {
    display: inline-block;
    background: var(--yellow);
    color: var(--green-dark);
    border-radius: 50px;
    padding: .3rem 1rem;
    font-size: .8rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

/* Section title */
.section-title { font-size: clamp(1.6rem,3vw,2.2rem); font-weight: 900; }
.section-title span { color: var(--green); }
.section-title::after {
    content: '';
    display: block;
    width: 48px;
    height: 4px;
    /* Tricolor: verde | branco | vermelho */
    background: linear-gradient(90deg, var(--green) 33%, #fff 33% 66%, var(--red) 66%);
    border-radius: 2px;
    margin-top: .5rem;
}
.section-title.centered::after { margin-left: auto; margin-right: auto; }

/* Cards */
.card { border: none; border-radius: 12px; box-shadow: var(--shadow); transition: transform .25s, box-shadow .25s; }
.card:hover { transform: translateY(-4px); box-shadow: 0 8px 32px rgba(0,0,0,.15); }
.card-header-red { background: var(--red); color: #fff; border-radius: 12px 12px 0 0 !important; padding: 1rem 1.25rem; }

/* Nucleo cards */
.nucleo-card { border-left: 4px solid var(--green); }
.nucleo-card .age-badge { background: var(--green); color: #fff; font-size: .75rem; font-weight: 700; border-radius: 50px; padding: .2rem .75rem; }
.nucleo-card .info-item { display: flex; align-items: center; gap: .5rem; font-size: .875rem; margin-bottom: .4rem; }
.nucleo-card .info-item i { color: var(--green); width: 16px; }

/* Gallery */
.gallery-thumb { position: relative; overflow: hidden; border-radius: 10px; aspect-ratio: 4/3; cursor: pointer; }
.gallery-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.gallery-thumb:hover img { transform: scale(1.06); }
.gallery-thumb .overlay { position: absolute; inset: 0; background: rgba(27,107,42,0); display: flex; align-items: center; justify-content: center; transition: .3s; }
.gallery-thumb:hover .overlay { background: rgba(27,107,42,.65); }
.gallery-thumb .overlay i { color: #fff; font-size: 2rem; opacity: 0; transition: .3s; }
.gallery-thumb:hover .overlay i { opacity: 1; }

/* Album card */
.album-card img { height: 200px; object-fit: cover; border-radius: 10px 10px 0 0; }
.album-count { position: absolute; top: 10px; right: 10px; background: var(--green); color: #fff; font-size: .75rem; font-weight: 700; border-radius: 50px; padding: .2rem .6rem; }

/* Form */
.form-label { font-weight: 600; font-size: .875rem; }
.form-control:focus, .form-select:focus { border-color: var(--red); box-shadow: 0 0 0 .2rem rgba(200,16,46,.2); }
.step-indicator { display: flex; gap: 0; margin-bottom: 2rem; }
.step { flex: 1; text-align: center; padding: .75rem; font-size: .8rem; font-weight: 700; background: #eee; color: var(--gray); position: relative; }
.step.active { background: var(--red); color: #fff; }
.step.done   { background: #28a745; color: #fff; }
.step:not(:last-child)::after { content: ''; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); border-left: 14px solid #fff; border-top: 22px solid transparent; border-bottom: 22px solid transparent; z-index: 2; }
.step.active::after { border-left-color: #fff; }

/* Transparency */
.doc-item { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: 10px; margin-bottom: .75rem; transition: border-color .2s, box-shadow .2s; }
.doc-item:hover { border-color: var(--green); box-shadow: 0 2px 12px rgba(27,107,42,.12); }
.doc-icon { width: 48px; height: 48px; background: var(--green-light); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: var(--green); font-size: 1.5rem; flex-shrink: 0; }
.doc-cat { display: inline-block; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--green); background: var(--green-light); border-radius: 50px; padding: .15rem .6rem; }

/* Stats */
.stat-card { text-align: center; padding: 2rem 1rem; }
.stat-number { font-size: 3rem; font-weight: 900; color: var(--green); line-height: 1; }
.stat-label  { font-size: .875rem; color: var(--gray); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }

/* Contact */
.contact-info-item { display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.5rem; }
.contact-icon { width: 44px; height: 44px; background: var(--green); color: #fff; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0; }

/* Page hero (inner pages) — tricolor diagonal */
.page-hero { background: linear-gradient(160deg, var(--green-dark) 0%, var(--green) 60%, var(--red) 100%); color: #fff; padding: 3.5rem 0 2.5rem; }
.page-hero h1 { font-size: clamp(1.8rem,4vw,2.8rem); font-weight: 900; }
.breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.6); }
.breadcrumb-item a { color: rgba(255,255,255,.8); }
.breadcrumb-item.active { color: #fff; }

/* Team */
.team-card { text-align: center; }
.team-avatar { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; border: 4px solid var(--green); margin: 0 auto 1rem; display: block; }
.team-avatar-placeholder { width: 100px; height: 100px; border-radius: 50%; background: var(--green-light); border: 4px solid var(--green); margin: 0 auto 1rem; display: flex; align-items: center; justify-content: center; color: var(--green); font-size: 2.5rem; }

/* Footer */
.site-footer { background: var(--green-dark); color: #bcd4c0; padding: 4rem 0 0; margin-top: 5rem; }
.footer-brand { font-family: 'Montserrat',sans-serif; font-weight: 900; color: #fff; font-size: 1.4rem; }
.footer-desc { color: #9fc7a5; }
.footer-heading { font-family: 'Montserrat',sans-serif; font-weight: 700; color: #fff; font-size: .875rem; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 1rem; }
.footer-links { list-style: none; padding: 0; }
.footer-links li { margin-bottom: .4rem; }
.footer-links a { color: #9fc7a5; font-size: .875rem; }
.footer-links a:hover { color: #fff; }
.footer-contact { list-style: none; padding: 0; }
.footer-contact li { display: flex; align-items: flex-start; gap: .6rem; color: #9fc7a5; font-size: .875rem; margin-bottom: .6rem; }
.footer-contact i { color: var(--yellow); margin-top: .15rem; flex-shrink: 0; }
.social-links a { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; margin-right: .4rem; transition: background .2s; font-size: 1rem; }
.social-links a:hover { background: var(--green); }
.footer-divider { border-color: rgba(255,255,255,.1); margin: 3rem 0 1.5rem; }
.footer-bottom { padding-bottom: 1.5rem; }
.footer-bottom a { color: #aaa; }
.footer-bottom a:hover { color: #fff; }

/* WhatsApp float */
.whatsapp-float { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 999; width: 56px; height: 56px; background: #25D366; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.8rem; box-shadow: 0 4px 16px rgba(0,0,0,.25); transition: transform .2s; }
.whatsapp-float:hover { transform: scale(1.1); color: #fff; }

/* Faixa tricolor decorativa (usada no topo da home etc.) */
.tricolor-stripe {
    height: 5px;
    background: linear-gradient(90deg, var(--green) 33.3%, #fff 33.3% 66.6%, var(--red) 66.6%);
}

/* Responsive */
@media (max-width: 768px) {
    .hero { padding: 4rem 0 3rem; }
    .step span { display: none; }
}

/* Lightbox */
.lightbox-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.92); z-index: 9999; display: flex; align-items: center; justify-content: center; }
.lightbox-inner { display: flex; flex-direction: column; align-items: center; max-width: 92vw; }
.lightbox-img { max-height: 85vh; max-width: 92vw; border-radius: 6px; display: block; }
.lightbox-caption { color: rgba(255,255,255,.75); font-size: .85rem; margin-top: .5rem; text-align: center; min-height: 1.2em; }
.lightbox-counter { color: rgba(255,255,255,.5); font-size: .75rem; margin-top: .2rem; }
.lightbox-close { position: absolute; top: 1rem; right: 1.5rem; color: #fff; font-size: 2.5rem; cursor: pointer; line-height: 1; background: none; border: none; padding: 0; }
.lightbox-prev,.lightbox-next { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.15); border: none; color: #fff; font-size: 3rem; line-height: 1; padding: .1rem .6rem; cursor: pointer; border-radius: 4px; transition: background .2s; user-select: none; }
.lightbox-prev { left: 1rem; }
.lightbox-next { right: 1rem; }
.lightbox-prev:hover,.lightbox-next:hover { background: rgba(255,255,255,.3); }
@media (max-width:576px) { .lightbox-prev { left: .3rem; } .lightbox-next { right: .3rem; } .lightbox-prev,.lightbox-next { font-size: 2.2rem; padding: .1rem .4rem; } }

/* ============================================================
   HERO MODERNO
   ============================================================ */
.hero-modern {
    background: linear-gradient(160deg, #0a2e10 0%, var(--green-dark) 40%, #1a4a1a 70%, #2d0a10 100%);
    position: relative;
    overflow: hidden;
    padding-bottom: 0;
}
.hero-bg-overlay {
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 60% 80% at 80% 50%, rgba(200,16,46,.12) 0%, transparent 70%),
        radial-gradient(ellipse 40% 60% at 10% 20%, rgba(27,107,42,.3) 0%, transparent 60%),
        url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}

/* Ticker */
.news-ticker {
    background: rgba(0,0,0,.35);
    border-bottom: 1px solid rgba(255,255,255,.08);
    padding: .5rem 0;
}
.ticker-inner {
    display: flex; align-items: center; gap: .75rem; overflow: hidden;
    font-size: .82rem; color: rgba(255,255,255,.85);
}
.ticker-tag {
    background: var(--yellow); color: var(--green-dark);
    font-weight: 900; font-size: .7rem; border-radius: 4px;
    padding: .15rem .5rem; letter-spacing: .05em; flex-shrink: 0;
}
.ticker-inner a { color: rgba(255,255,255,.9); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ticker-inner a:hover { color: #fff; }

/* Hero content */
.hero-content-modern { padding: 4rem 0 2rem; position: relative; z-index: 2; }
.min-vh-hero { min-height: 72vh; }
.hero-eyebrow {
    display: flex; align-items: center; gap: .5rem;
    color: rgba(255,255,255,.75); font-size: .82rem; font-weight: 700;
    letter-spacing: .1em; text-transform: uppercase; margin-bottom: 1.25rem;
}
.hero-eyebrow .dot { width: 8px; height: 8px; border-radius: 50%; animation: pulse-dot 1.5s infinite; }
.hero-eyebrow .dot.green { background: #4ade80; box-shadow: 0 0 0 0 rgba(74,222,128,.4); }
@keyframes pulse-dot {
    0%  { box-shadow: 0 0 0 0 rgba(74,222,128,.6); }
    70% { box-shadow: 0 0 0 10px rgba(74,222,128,0); }
    100%{ box-shadow: 0 0 0 0 rgba(74,222,128,0); }
}
.hero-title {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(2.8rem, 7vw, 5.5rem);
    font-weight: 900; line-height: 1.0; color: #fff; margin-bottom: .5rem;
}
.hero-title-accent { color: var(--yellow); }
.hero-title-outline {
    -webkit-text-stroke: 2px rgba(255,255,255,.5);
    color: transparent;
}
.hero-desc {
    color: rgba(255,255,255,.78); font-size: 1.1rem;
    max-width: 520px; line-height: 1.7; margin: 1.5rem 0 2rem;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; }
.btn-hero-primary {
    display: inline-flex; align-items: center; gap: .5rem;
    background: var(--red); color: #fff; font-weight: 800; font-family: 'Montserrat',sans-serif;
    padding: .85rem 2rem; border-radius: 50px; text-decoration: none;
    font-size: .95rem; letter-spacing: .02em;
    box-shadow: 0 4px 20px rgba(200,16,46,.4); transition: .25s;
}
.btn-hero-primary:hover { background: var(--red-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 8px 28px rgba(200,16,46,.5); }
.btn-hero-primary.sm { padding: .65rem 1.5rem; font-size: .875rem; }
.btn-hero-ghost {
    display: inline-flex; align-items: center; gap: .5rem;
    background: rgba(255,255,255,.1); color: #fff; font-weight: 700;
    padding: .85rem 1.75rem; border-radius: 50px; text-decoration: none;
    font-size: .95rem; border: 1.5px solid rgba(255,255,255,.25);
    backdrop-filter: blur(4px); transition: .25s;
}
.btn-hero-ghost:hover { background: rgba(255,255,255,.2); color: #fff; transform: translateY(-2px); }
.btn-hero-ghost.sm { padding: .65rem 1.4rem; font-size: .875rem; }
.btn-hero-ghost.dark { background: rgba(0,0,0,.15); border-color: rgba(255,255,255,.35); }

/* Escudo animado */
.hero-escudo-wrap { position: relative; width: 340px; height: 340px; display: flex; align-items: center; justify-content: center; }
.hero-escudo { width: 220px; height: 220px; object-fit: contain; position: relative; z-index: 2; filter: drop-shadow(0 8px 32px rgba(0,0,0,.5)); animation: float-escudo 3s ease-in-out infinite; }
@keyframes float-escudo {
    0%,100% { transform: translateY(0); }
    50%      { transform: translateY(-12px); }
}
.hero-escudo-ring {
    position: absolute; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.12); animation: spin-ring 20s linear infinite;
}
.ring-1 { width: 280px; height: 280px; animation-duration: 20s; }
.ring-2 { width: 320px; height: 320px; animation-direction: reverse; animation-duration: 30s; border-color: rgba(255,215,0,.1); }
@keyframes spin-ring { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* Stats bar */
.hero-stats {
    background: rgba(0,0,0,.45); backdrop-filter: blur(12px);
    border-top: 1px solid rgba(255,255,255,.08);
    padding: 1.5rem 0; margin-top: 2rem;
}
.hero-stats-grid {
    display: flex; align-items: center; justify-content: center;
    gap: 2rem; flex-wrap: wrap;
}
.hero-stat { text-align: center; }
.hero-stat-num { font-family:'Montserrat',sans-serif; font-weight:900; font-size:2.2rem; color:#fff; line-height:1; }
.hero-stat-lbl { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:rgba(255,255,255,.5); margin-top:.2rem; }
.hero-stat-div { width:1px; height:40px; background:rgba(255,255,255,.12); }

/* ============================================================
   SECTION HELPERS
   ============================================================ */
.section-eyebrow {
    display: inline-flex; align-items: center; gap: .4rem;
    font-size: .75rem; font-weight: 800; text-transform: uppercase;
    letter-spacing: .12em; color: var(--green); margin-bottom: .4rem;
}
.section-eyebrow::before { content:''; display:block; width:24px; height:2px; background:var(--green); border-radius:2px; }
.section-eyebrow.light { color: rgba(255,255,255,.6); }
.section-eyebrow.light::before { background: rgba(255,255,255,.4); }
.section-title-new { font-family:'Montserrat',sans-serif; font-size:clamp(1.7rem,3vw,2.4rem); font-weight:900; }
.section-title-new span { color: var(--green); }
.section-title-new.text-white span { color: inherit; }
.accent-yellow { color: var(--yellow) !important; }
.section-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:2rem; gap:1rem; flex-wrap:wrap; }
.btn-see-all {
    display:inline-flex; align-items:center; gap:.4rem; font-size:.82rem;
    font-weight:700; color:var(--green); text-decoration:none;
    border:1.5px solid var(--green); border-radius:50px; padding:.35rem 1rem;
    transition:.2s;
}
.btn-see-all:hover { background:var(--green); color:#fff; }
.btn-see-all.light { color:#fff; border-color:rgba(255,255,255,.4); }
.btn-see-all.light:hover { background:rgba(255,255,255,.2); color:#fff; border-color:#fff; }

/* ============================================================
   NEWS GRID
   ============================================================ */
.news-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    gap: 1.25rem;
}
.news-card { border-radius: 14px; overflow: hidden; transition: transform .25s, box-shadow .25s; color: inherit; }
.news-card:hover { transform: translateY(-4px); box-shadow: 0 12px 36px rgba(0,0,0,.12); }
.news-card-big {
    grid-column: 1; grid-row: 1 / 4; display: flex; flex-direction: column;
    background: #fff; box-shadow: 0 2px 16px rgba(0,0,0,.07);
}
.news-card-small {
    grid-column: 2; display: flex; gap: 0;
    background: #fff; box-shadow: 0 2px 16px rgba(0,0,0,.07);
}
.news-img {
    height: 260px; background-size: cover; background-position: center;
    flex-shrink: 0;
}
.news-img-placeholder { background: var(--green-light); display:flex; align-items:center; justify-content:center; }
.news-placeholder-icon { font-size: 3rem; color: var(--green); opacity: .4; }
.news-img-small {
    width: 110px; min-height: 100px; flex-shrink: 0;
    background-size: cover; background-position: center;
}
.news-img-placeholder-sm { background:var(--green-light); display:flex; align-items:center; justify-content:center; color:var(--green); opacity:.5; font-size:1.3rem; }
.news-body { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; }
.news-body-small { padding: .75rem; flex: 1; display: flex; flex-direction: column; justify-content: center; }
.news-title { font-family:'Montserrat',sans-serif; font-weight:800; font-size:1.15rem; line-height:1.3; color:#1a1a1a; margin: .5rem 0 .5rem; }
.news-title-sm { font-family:'Montserrat',sans-serif; font-weight:700; font-size:.88rem; line-height:1.35; color:#1a1a1a; margin:.3rem 0 .3rem; }
.news-excerpt { color:#666; font-size:.875rem; flex:1; margin-bottom:.75rem; }
.news-meta { font-size:.75rem; color:#999; margin-top:auto; display:flex; align-items:center; gap:.3rem; }
.news-cat {
    display: inline-block; font-size: .68rem; font-weight: 800;
    text-transform: uppercase; letter-spacing: .06em;
    border-radius: 4px; padding: .2rem .55rem;
}
.news-cat-clube      { background:#e4f0e7; color:var(--green); }
.news-cat-competicao { background:#fff3cd; color:#856404; }
.news-cat-alunos     { background:#cce5ff; color:#004085; }
.news-cat-talentos   { background:#f5e0e4; color:var(--red); }
.news-cat-geral      { background:#f0f0f0; color:#555; }

@media(max-width:768px){
    .news-grid { grid-template-columns: 1fr; }
    .news-card-big { grid-column:1; grid-row:auto; }
    .news-card-small { grid-column:1; }
    .min-vh-hero { min-height: auto; padding: 2rem 0; }
    .hero-title { font-size: 2.5rem; }
    .hero-stats-grid { gap: 1rem; }
    .hero-stat-num { font-size: 1.6rem; }
    .hero-stat-div { display: none; }
}

/* ============================================================
   TALENTOS
   ============================================================ */
.section-talentos {
    padding: 5rem 0;
    position: relative;
    overflow: hidden;
}
.talentos-bg {
    position: absolute; inset: 0;
    background: linear-gradient(160deg, #0a2e10 0%, #1B6B2A 50%, #0a1f3a 100%);
}
.talentos-bg::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50' cy='50' r='40' stroke='rgba(255,255,255,0.03)' stroke-width='1' fill='none'/%3E%3C/svg%3E") repeat;
    background-size: 80px;
}
.talentos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1.25rem;
}
.talentos-grid-page {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1.5rem;
}
.talento-card {
    background: rgba(255,255,255,.06); backdrop-filter: blur(4px);
    border: 1px solid rgba(255,255,255,.1); border-radius: 16px;
    overflow: hidden; text-align: center;
    transition: transform .25s, background .25s;
}
.talento-card:hover { transform: translateY(-6px); background: rgba(255,255,255,.1); }
.talento-card-lg { background: rgba(255,255,255,.07); }
.talento-foto-wrap { position: relative; padding: 1.5rem 1.5rem .5rem; }
.talento-foto { width: 90px; height: 90px; border-radius: 50%; object-fit: cover; border: 3px solid var(--yellow); }
.talento-foto-placeholder {
    width: 90px; height: 90px; border-radius: 50%;
    background: rgba(255,255,255,.1); border: 3px solid var(--yellow);
    display: flex; align-items: center; justify-content: center;
    color: rgba(255,255,255,.4); font-size: 2.5rem; margin: 0 auto;
}
.talento-clube-badge {
    position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
    background: var(--yellow); color: var(--green-dark);
    font-size: .65rem; font-weight: 900; border-radius: 50px;
    padding: .15rem .65rem; white-space: nowrap; letter-spacing: .03em;
}
.talento-info { padding: 1rem 1rem 1.25rem; }
.talento-nome { color: #fff; font-weight: 800; font-size: .95rem; font-family:'Montserrat',sans-serif; }
.talento-pos  { color: var(--yellow); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin: .2rem 0; }
.talento-pais { color: rgba(255,255,255,.5); font-size: .72rem; }
.talento-desc { color: rgba(255,255,255,.65); font-size: .82rem; margin-top: .5rem; line-height: 1.5; }

/* ============================================================
   NUCLEO CARDS NOVA VERSÃO
   ============================================================ */
.nucleo-card-new {
    border: none; border-radius: 14px;
    box-shadow: 0 2px 16px rgba(0,0,0,.07);
    overflow: hidden; transition: transform .25s, box-shadow .25s;
}
.nucleo-card-new:hover { transform: translateY(-4px); box-shadow: 0 10px 32px rgba(0,0,0,.12); }
.nucleo-card-header {
    background: linear-gradient(135deg, var(--green-dark), var(--green));
    padding: 1.25rem 1.25rem .75rem; position: relative;
    min-height: 110px;
    display: flex; flex-direction: column; justify-content: flex-end;
}
.nucleo-card-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(10,40,15,.75) 40%, rgba(0,0,0,.25) 100%);
    border-radius: 0;
    pointer-events: none;
}
.nucleo-age {
    display: inline-block; background: var(--yellow); color: var(--green-dark);
    font-size: .7rem; font-weight: 900; border-radius: 50px; padding: .2rem .7rem;
    letter-spacing: .04em; margin-bottom: .4rem; position: relative; z-index: 1;
}
.nucleo-name { color: #fff; font-family:'Montserrat',sans-serif; font-weight:800; font-size:1.15rem; margin:0; position: relative; z-index: 1; }
.nucleo-details { margin-top: .75rem; border-top: 1px solid #eee; padding-top: .75rem; }
.nucleo-details > div { font-size: .82rem; color: #666; display: flex; align-items: center; gap: .4rem; margin-bottom: .3rem; }
.nucleo-details i { color: var(--green); }

/* ============================================================
   CTA TRICOLOR BOX
   ============================================================ */
.cta-box-tricolor {
    border-radius: 20px; overflow: hidden; position: relative;
    background: linear-gradient(135deg, var(--green-dark) 0%, var(--green) 60%, var(--red) 100%);
    padding: 3rem 2rem; text-align: center; color: #fff;
}
.cta-box-stripes {
    position: absolute; top: 0; left: 0; right: 0; height: 6px;
    display: flex;
}
.cta-box-stripes .stripe { flex: 1; }
.cta-box-stripes .green { background: var(--green); }
.cta-box-stripes .white { background: #fff; }
.cta-box-stripes .red   { background: var(--red); }
.cta-logo { width: 80px; height: 80px; object-fit: contain; margin-bottom: 1rem; filter: drop-shadow(0 4px 12px rgba(0,0,0,.3)); }
.cta-box-tricolor h3 { font-family:'Montserrat',sans-serif; font-weight:900; font-size:1.5rem; }
.cta-box-tricolor p { opacity: .85; }

/* ============================================================
   POR QUE - LISTA
   ============================================================ */
.porque-list { display: flex; flex-direction: column; gap: 1rem; }
.porque-item { display: flex; gap: 1rem; align-items: flex-start; }
.porque-icon { width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; flex-shrink: 0; }

/* ============================================================
   NOTÍCIA CONTENT
   ============================================================ */
.noticia-content { font-size: 1.05rem; line-height: 1.85; color: #333; }
.noticia-content p { margin-bottom: 1.25rem; }
.noticia-content h2,h3 { font-family:'Montserrat',sans-serif; font-weight:800; margin:2rem 0 1rem; }
.noticia-content img { max-width:100%; border-radius:10px; margin:1rem 0; }

/* ============================================================
   TALENTOS PAGE
   ============================================================ */
.section-talentos-page { background: var(--light); }
.section-talentos-page .talentos-grid-page .talento-card {
    background: var(--green-dark);
}
.section-talentos-page .talento-desc {
    font-size: .85rem;
    line-height: 1.6;
}


/* ============================================================
   BOTÃO VOLTAR AO TOPO
   ============================================================ */
.back-to-top {
    position: fixed;
    bottom: 90px;
    right: 24px;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--green);
    color: #fff;
    border: none;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s, transform .3s;
    transform: translateY(12px);
    z-index: 999;
    box-shadow: 0 4px 16px rgba(27,107,42,.35);
    cursor: pointer;
}
.back-to-top.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.back-to-top:hover { background: var(--green-dark); transform: translateY(-2px); }

/* ============================================================
   BOTÃO WHATSAPP FLUTUANTE
   ============================================================ */
.whatsapp-float {
    position: fixed;
    bottom: 28px;
    right: 24px;
    background: #25D366;
    color: #fff;
    border-radius: 50px;
    padding: .7rem 1.1rem .7rem .9rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    text-decoration: none;
    font-size: 1.35rem;
    font-weight: 700;
    box-shadow: 0 4px 20px rgba(37,211,102,.45);
    z-index: 1000;
    transition: transform .25s, box-shadow .25s;
    animation: waPulse 2.5s infinite;
}
.whatsapp-float:hover { color: #fff; transform: scale(1.06); box-shadow: 0 6px 28px rgba(37,211,102,.6); animation: none; }
.whatsapp-label { font-size: .82rem; font-weight: 700; letter-spacing: .02em; }
@keyframes waPulse {
    0%,100% { box-shadow: 0 4px 20px rgba(37,211,102,.45); }
    50%      { box-shadow: 0 4px 28px rgba(37,211,102,.75); }
}
@media(max-width:480px){ .whatsapp-label { display:none; } .whatsapp-float { border-radius:50%; padding:.8rem; } }

/* ============================================================
   BANNER LGPD
   ============================================================ */
.lgpd-banner {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: rgba(20,20,20,.97);
    color: #fff;
    z-index: 2000;
    padding: 1rem 1.5rem;
    transform: translateY(100%);
    transition: transform .4s cubic-bezier(.4,0,.2,1);
    backdrop-filter: blur(8px);
}
.lgpd-banner.lgpd-show { transform: translateY(0); }
.lgpd-content { max-width: 900px; margin: 0 auto; display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.lgpd-text { flex: 1; font-size: .88rem; opacity: .9; }
.lgpd-link { color: #4CAF50; text-decoration: underline; }
.lgpd-actions { display: flex; gap: .6rem; flex-shrink: 0; }

/* ============================================================
   NAV LINK ACTIVE
   ============================================================ */
.navbar-nav .nav-link.active {
    color: var(--yellow) !important;
    font-weight: 700;
}

/* ============================================================
   DEPOIMENTOS
   ============================================================ */
.depoimentos-section { background: var(--light); }
.depoimento-card {
    background: #fff;
    border-radius: 16px;
    padding: 2rem 1.75rem;
    box-shadow: 0 4px 24px rgba(0,0,0,.07);
    height: 100%;
    position: relative;
    border-left: 4px solid var(--green);
}
.depoimento-quote {
    font-size: 3rem;
    line-height: 1;
    color: var(--green);
    opacity: .3;
    font-family: Georgia, serif;
    margin-bottom: -.5rem;
}
.depoimento-texto { font-style: italic; color: #444; line-height: 1.7; margin-bottom: 1.25rem; }
.depoimento-autor { display: flex; align-items: center; gap: .75rem; }
.depoimento-avatar {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--green);
}
.depoimento-avatar-placeholder {
    width: 46px; height: 46px; border-radius: 50%;
    background: var(--green-light);
    border: 3px solid var(--green);
    display: flex; align-items: center; justify-content: center;
    color: var(--green); font-size: 1.2rem;
}
.depoimento-nome { font-weight: 700; font-size: .95rem; }
.depoimento-parentesco { font-size: .78rem; color: var(--gray); }

/* ============================================================
   EVENTOS AGENDA
   ============================================================ */
.evento-card {
    display: flex;
    gap: 1.25rem;
    background: #fff;
    border-radius: 14px;
    padding: 1.25rem;
    box-shadow: 0 3px 16px rgba(0,0,0,.07);
    height: 100%;
    border: 1px solid var(--border);
    transition: transform .2s, box-shadow .2s;
}
.evento-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.evento-passado { opacity: .6; }
.evento-data {
    min-width: 52px;
    text-align: center;
    background: var(--green);
    border-radius: 10px;
    padding: .6rem .4rem;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
}
.evento-dia { font-size: 1.6rem; font-weight: 900; line-height: 1; }
.evento-mes { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.evento-info { flex: 1; }
.evento-titulo { font-size: .98rem; font-weight: 700; margin: .35rem 0 .4rem; }
.evento-meta { font-size: .8rem; color: var(--gray); margin-bottom: .2rem; }
.evento-desc { font-size: .83rem; color: #555; margin-top: .5rem; margin-bottom: 0; }

/* Countdown */
.countdown-strip {
    background: linear-gradient(135deg, var(--green-dark), var(--green));
    color: #fff;
    padding: 1.5rem 0;
    text-align: center;
}
.countdown-label { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; opacity: .75; margin-bottom: .5rem; }
.countdown-digits { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; }
.countdown-unit { display: flex; flex-direction: column; align-items: center; min-width: 64px; }
.countdown-num {
    font-size: 2.4rem; font-weight: 900; font-family: 'Montserrat', sans-serif;
    background: rgba(255,255,255,.15);
    border-radius: 10px; padding: .2rem .8rem; line-height: 1.2;
}
.countdown-unit-label { font-size: .65rem; opacity: .7; text-transform: uppercase; letter-spacing: .08em; margin-top: .3rem; }

/* ============================================================
   VIDEO EMBED HOME
   ============================================================ */
.video-section { background: var(--black); padding: 4rem 0; }
.video-wrap { position: relative; padding-bottom: 56.25%; border-radius: 16px; overflow: hidden; }
.video-wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; }

/* ============================================================
   404 PAGE
   ============================================================ */
.error-404 { background: linear-gradient(135deg, var(--green-dark), var(--green)); min-height: 70vh; }

/* ============================================================
   NAVBAR SCROLL TRANSFORM
   ============================================================ */
.navbar { transition: padding .3s ease, background .3s ease, box-shadow .3s ease; }
.navbar-scrolled {
    padding-top: .35rem !important;
    padding-bottom: .35rem !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.18) !important;
    background: rgba(18,74,29,.97) !important;
    backdrop-filter: blur(8px);
}
.navbar-scrolled .navbar-brand img { height: 40px !important; transition: height .3s; }

/* ============================================================
   COMISSAO TECNICA
   ============================================================ */
.staff-card {
    border-radius: 18px; overflow: hidden;
    box-shadow: 0 6px 32px rgba(0,0,0,.10);
    transition: transform .3s, box-shadow .3s;
    background: #fff; height: 100%;
}
.staff-card:hover { transform: translateY(-6px); box-shadow: 0 16px 48px rgba(0,0,0,.15); }
.staff-foto { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: top; display: block; transition: transform .4s; }
.staff-card:hover .staff-foto { transform: scale(1.04); }
.staff-foto-placeholder {
    width: 100%; aspect-ratio: 3/4;
    background: linear-gradient(135deg, var(--green-light), #c8e6c9);
    display: flex; align-items: center; justify-content: center;
    font-size: 5rem; color: var(--green); opacity: .5;
}
.staff-foto-wrap { position: relative; overflow: hidden; }
.staff-overlay {
    position: absolute; bottom: 0; left: 0; right: 0;
    background: linear-gradient(to top, rgba(18,74,29,.9), transparent);
    padding: 1.5rem 1rem .75rem;
}
.staff-cargo {
    display: inline-block; background: var(--red); color: #fff;
    font-size: .65rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
    padding: .2rem .65rem; border-radius: 50px; margin-bottom: .4rem;
}
.staff-nome { color: #fff; font-weight: 800; font-size: 1rem; margin: 0; }
.staff-body { padding: .9rem 1rem 1rem; }
.staff-info { font-size: .8rem; color: var(--gray); line-height: 1.5; }
.staff-badges { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
.staff-badge { font-size: .68rem; font-weight: 700; background: var(--green-light); color: var(--green); padding: .15rem .55rem; border-radius: 50px; }
.staff-social { margin-top: .6rem; }
.staff-social a { color: var(--gray); font-size: 1rem; margin-right: .5rem; transition: color .2s; }
.staff-social a:hover { color: var(--green); }
.staff-coordinator { border: 3px solid var(--yellow); }
.staff-coordinator .staff-cargo { background: var(--yellow); color: var(--black); }

/* ============================================================
   CONQUISTAS / TITULOS
   ============================================================ */
.conquistas-section {
    background: linear-gradient(135deg, var(--green-dark) 0%, #1a3a1f 100%);
    padding: 5rem 0; position: relative; overflow: hidden;
}
.conquista-icon { font-size: 2.8rem; margin-bottom: .6rem; display: block; }
.conquista-num {
    font-size: 3rem; font-weight: 900; font-family: 'Montserrat', sans-serif;
    color: var(--yellow); line-height: 1; display: block;
}
.conquista-label {
    color: rgba(255,255,255,.8); font-size: .88rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: .07em; margin-top: .35rem; display: block;
}
.conquista-sub { color: rgba(255,255,255,.45); font-size: .75rem; margin-top: .2rem; }
.trofeu-card {
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
    border-radius: 14px; padding: 1.25rem; transition: background .25s;
}
.trofeu-card:hover { background: rgba(255,255,255,.1); }
.trofeu-ano {
    font-size: .7rem; font-weight: 800; background: var(--yellow); color: var(--black);
    padding: .15rem .55rem; border-radius: 50px; display: inline-block; margin-bottom: .5rem;
}
.trofeu-titulo { color: #fff; font-weight: 700; font-size: .95rem; margin: 0; }
.trofeu-competicao { color: rgba(255,255,255,.5); font-size: .78rem; margin-top: .2rem; }

/* ============================================================
   PARCEIROS / PATROCINADORES
   ============================================================ */
.parceiros-section { background: var(--light); padding: 3.5rem 0; }
.parceiros-title { font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gray); margin-bottom: 2rem; }
.parceiros-grid { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2rem 3rem; }
.parceiro-item { display: flex; flex-direction: column; align-items: center; gap: .5rem; opacity: .55; transition: opacity .25s, transform .25s; text-decoration: none; }
.parceiro-item:hover { opacity: 1; transform: scale(1.06); }
.parceiro-logo { max-height: 52px; max-width: 140px; object-fit: contain; filter: grayscale(1); transition: filter .25s; }
.parceiro-item:hover .parceiro-logo { filter: grayscale(0); }
.parceiro-nome-text { font-size: .72rem; font-weight: 700; color: var(--gray); text-align: center; text-transform: uppercase; letter-spacing: .05em; }
.parceiro-placeholder {
    height: 52px; min-width: 120px; background: var(--border); border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    padding: .5rem 1rem; font-weight: 800; font-size: .78rem; color: var(--gray); letter-spacing: .05em;
}

/* ============================================================
   MVV — MISSAO VISAO VALORES
   ============================================================ */
.mvv-card {
    border-radius: 20px; padding: 2.5rem 2rem; height: 100%;
    transition: transform .3s, box-shadow .3s; position: relative; overflow: hidden;
}
.mvv-card:hover { transform: translateY(-6px); box-shadow: 0 16px 48px rgba(0,0,0,.12); }
.mvv-icon { font-size: 2.5rem; margin-bottom: 1rem; display: block; }
.mvv-card-green { background: var(--green); color: #fff; }
.mvv-card-red   { background: var(--red); color: #fff; }
.mvv-card-dark  { background: var(--black); color: #fff; }
.mvv-card h5 { font-weight: 800; margin-bottom: .75rem; }
.mvv-card p  { opacity: .85; font-size: .92rem; line-height: 1.7; margin: 0; }

/* ============================================================
   TIMELINE
   ============================================================ */
.timeline { position: relative; padding-left: 2rem; }
.timeline::before {
    content: ''; position: absolute; top: 0; bottom: 0; left: .5rem;
    width: 3px; background: linear-gradient(to bottom, var(--green), var(--red)); border-radius: 2px;
}
.timeline-item { position: relative; padding-bottom: 2rem; }
.timeline-dot {
    position: absolute; left: -1.6rem; top: .2rem;
    width: 16px; height: 16px; border-radius: 50%;
    background: var(--green); border: 3px solid #fff; box-shadow: 0 0 0 3px var(--green);
}
.timeline-year { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--green); margin-bottom: .25rem; }
.timeline-text { font-size: .92rem; color: #444; line-height: 1.65; }

/* ============================================================
   MICRO-INTERACOES
   ============================================================ */
.card { transition: transform .25s ease, box-shadow .25s ease; }
a.text-decoration-none .card:hover { transform: translateY(-4px); }
.btn { transition: transform .15s ease, box-shadow .15s ease, background .2s, color .2s; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.15); }
.btn:active { transform: translateY(0); }
img[loading="lazy"] { opacity: 0; transition: opacity .4s ease; }
img.img-loaded { opacity: 1; }


/* ================================================================
   MOBILE RESPONSIVE — REVISÃO COMPLETA
   ================================================================ */

html, body { overflow-x: hidden; }

/* ----------------------------------------------------------------
   TOPBAR — esconde info em telas pequenas
   ---------------------------------------------------------------- */
@media (max-width: 575px) {
    .topbar-info { display: none !important; }
    .topbar .container { justify-content: center !important; }
    .topbar-social a { font-size: 1.1rem; margin-left: .9rem; }
}

/* ----------------------------------------------------------------
   NAVBAR MOBILE — menu expandido legível
   ---------------------------------------------------------------- */
@media (max-width: 991px) {
    .navbar-collapse {
        background: var(--green-dark);
        padding: .75rem 1rem 1rem;
        border-radius: 0 0 14px 14px;
        margin-top: .5rem;
        box-shadow: 0 8px 24px rgba(0,0,0,.25);
    }
    .navbar-nav .nav-link {
        padding: .6rem .9rem !important;
        border-radius: 8px;
        font-size: .9rem;
    }
    .navbar-nav .nav-link.active {
        background: rgba(255,255,255,.1);
    }
    .navbar-nav .ms-lg-2 { margin-top: .5rem; }
    .navbar-nav .btn-cta-red {
        display: block !important;
        text-align: center;
        width: 100%;
        border-radius: 8px;
    }
    .brand-name { font-size: 1rem; }
    .brand-sub  { font-size: .6rem; }
    .navbar-brand img { height: 44px !important; }
}

/* ----------------------------------------------------------------
   HERO MODERNO
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .hero-content-modern { padding: 1.75rem 0 1rem; }
    .min-vh-hero { min-height: auto !important; padding-bottom: .5rem; }
    .hero-eyebrow { font-size: .72rem; margin-bottom: .75rem; }
    .hero-title { font-size: clamp(1.85rem, 8vw, 2.6rem) !important; line-height: 1.1; }
    .hero-title-outline { -webkit-text-stroke: 1.5px rgba(255,255,255,.5); }
    .hero-desc { font-size: .875rem; line-height: 1.6; margin: 1rem 0 1.5rem; max-width: 100%; }
    .hero-actions { flex-direction: column; gap: .75rem; }
    .btn-hero-primary,
    .btn-hero-ghost { width: 100%; justify-content: center; padding: .8rem 1.5rem; font-size: .9rem; }
    .news-ticker { display: none; }
}
@media (max-width: 768px) {
    .hero-stats { padding: .9rem 0; margin-top: 1rem; }
    .hero-stats-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: .5rem;
        text-align: center;
    }
    .hero-stat-div { display: none !important; }
    .hero-stat-num { font-size: 1.55rem; }
    .hero-stat-lbl { font-size: .62rem; margin-top: .15rem; }
}
@media (max-width: 400px) {
    .hero-title { font-size: 1.7rem !important; }
    .hero-stats-grid { grid-template-columns: 1fr 1fr; }
    .hero-stat-num { font-size: 1.3rem; }
}

/* ----------------------------------------------------------------
   PAGE HERO (páginas internas)
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .page-hero { padding: 2.25rem 0 1.75rem !important; }
    .page-hero h1 { font-size: clamp(1.5rem, 6vw, 2rem); }
    .page-hero p { font-size: .875rem; }
    .breadcrumb { font-size: .8rem; }
}

/* ----------------------------------------------------------------
   SECTION TÍTULOS E HEADERS
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .section-title-new { font-size: clamp(1.4rem, 5.5vw, 1.9rem); }
    .section-header {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem;
        margin-bottom: 1.25rem;
    }
    .section-eyebrow { font-size: .7rem; }
}

/* ----------------------------------------------------------------
   NEWS GRID (já tinha um básico, mas melhorando)
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .news-grid { grid-template-columns: 1fr !important; gap: 1rem; }
    .news-card-big { grid-column: 1; grid-row: auto; }
    .news-card-small { grid-column: 1; flex-direction: row; }
    .news-img { height: 200px; }
    .news-img-small { width: 96px; min-height: 90px; }
    .news-title { font-size: 1rem; }
    .news-title-sm { font-size: .83rem; }
}

/* ----------------------------------------------------------------
   TALENTOS GRID
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .talentos-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
    .talento-foto { width: 72px; height: 72px; }
    .talento-foto-placeholder { width: 72px; height: 72px; font-size: 1.8rem; }
    .talento-nome { font-size: .85rem; }
    .talento-info { padding: .75rem .75rem 1rem; }
    .section-talentos { padding: 3rem 0; }
}

/* ----------------------------------------------------------------
   NÚCLEOS
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .nucleo-name { font-size: 1rem; }
}

/* ----------------------------------------------------------------
   CONQUISTAS
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .conquistas-section { padding: 3rem 0; }
    .conquista-num { font-size: 2rem; }
    .conquista-label { font-size: .78rem; }
    .conquista-icon { font-size: 2rem; margin-bottom: .4rem; }
    .trofeu-titulo { font-size: .88rem; }
}
@media (max-width: 576px) {
    .conquista-num { font-size: 1.75rem; }
}

/* ----------------------------------------------------------------
   PARCEIROS
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .parceiros-grid { gap: 1rem 1.5rem; }
    .parceiro-placeholder { min-width: 80px; font-size: .68rem; padding: .4rem .75rem; height: 44px; }
    .parceiro-logo { max-height: 40px; }
}

/* ----------------------------------------------------------------
   COUNTDOWN
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .countdown-strip { padding: 1.25rem 0; }
    .countdown-digits { gap: .5rem; }
    .countdown-num { font-size: 1.75rem; padding: .2rem .55rem; border-radius: 8px; }
    .countdown-unit { min-width: 50px; }
    .countdown-unit-label { font-size: .6rem; }
    .countdown-label { font-size: .78rem; }
}
@media (max-width: 400px) {
    .countdown-num { font-size: 1.4rem; padding: .15rem .4rem; }
    .countdown-unit { min-width: 40px; }
}

/* ----------------------------------------------------------------
   DEPOIMENTOS
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .depoimento-card { padding: 1.5rem 1.25rem; }
    .depoimento-quote { font-size: 2.2rem; }
    .depoimento-texto { font-size: .9rem; }
}

/* ----------------------------------------------------------------
   EVENTOS
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .evento-card { gap: .75rem; padding: 1rem; }
    .evento-data { min-width: 44px; padding: .5rem .3rem; }
    .evento-dia { font-size: 1.3rem; }
    .evento-mes { font-size: .6rem; }
    .evento-titulo { font-size: .88rem; }
}

/* ----------------------------------------------------------------
   STAFF / COMISSÃO TÉCNICA
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    /* Em 2 colunas no mobile, foto quadrada */
    .staff-foto { aspect-ratio: 1 / 1 !important; }
    .staff-foto-placeholder { aspect-ratio: 1 / 1 !important; font-size: 3rem; }
    .staff-body { padding: .6rem .75rem .75rem; }
    .staff-nome { font-size: .9rem; }
    .staff-info { font-size: .75rem; }
    .staff-badge { font-size: .62rem; }
    .staff-social a { font-size: .9rem; }
}

/* ----------------------------------------------------------------
   MISSÃO / VISÃO / VALORES
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .mvv-card { padding: 1.75rem 1.5rem; }
    .mvv-icon { font-size: 2rem; margin-bottom: .75rem; }
    .mvv-card h5 { font-size: 1rem; }
    .mvv-card p { font-size: .875rem; }
}

/* ----------------------------------------------------------------
   TIMELINE
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .timeline { padding-left: 1.5rem; }
    .timeline::before { left: .4rem; }
    .timeline-dot { left: -1.25rem; width: 14px; height: 14px; }
    .timeline-text { font-size: .875rem; }
}

/* ----------------------------------------------------------------
   FOOTER
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .site-footer { padding: 2.5rem 0 1.5rem; }
    .footer-brand { font-size: 1.1rem; }
    .footer-heading { font-size: .82rem; margin-bottom: .5rem; }
    .footer-links { margin-bottom: .5rem; }
    .footer-links li { margin-bottom: .2rem; }
    .footer-contact li { font-size: .82rem; gap: .4rem; }
    .footer-bottom { text-align: center; gap: .5rem; font-size: .75rem; }
    .footer-divider { margin: 1.5rem 0 1rem; }
}

/* ----------------------------------------------------------------
   BOTÃO WHATSAPP + BACK TO TOP (não sobrepor)
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .whatsapp-float { bottom: 16px; right: 16px; padding: .7rem; border-radius: 50%; }
    .whatsapp-label { display: none; }
    .back-to-top { bottom: 76px; right: 16px; width: 40px; height: 40px; font-size: 1rem; }
}

/* ----------------------------------------------------------------
   LGPD BANNER
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .lgpd-content { flex-direction: column; align-items: flex-start; gap: .75rem; }
    .lgpd-text { font-size: .82rem; }
    .lgpd-actions { width: 100%; display: flex; gap: .5rem; }
    .lgpd-actions .btn { flex: 1; }
}

/* ----------------------------------------------------------------
   GALERIA
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .gallery-thumb { border-radius: 8px; }
}

/* ----------------------------------------------------------------
   INSCRICÃO — FORM STEPS
   ---------------------------------------------------------------- */
@media (max-width: 576px) {
    .steps-bar { overflow-x: auto; gap: .3rem; padding-bottom: .25rem; }
    .step span { display: none; }
    .step { min-width: 32px; }
}

/* ----------------------------------------------------------------
   NOTÍCIA SINGLE
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .noticia-content { font-size: .95rem; line-height: 1.75; }
    .noticia-content h2 { font-size: 1.25rem; }
}

/* ----------------------------------------------------------------
   ADMIN — sidebar oculta em mobile (já existe), mas melhorar
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .main-content { margin-left: 0 !important; }
    .sidebar { transform: translateX(-100%); transition: transform .3s; }
    .content-area { padding: 1rem; }
    .stat-mini .num { font-size: 1.5rem; }
}

/* ----------------------------------------------------------------
   CTA BOX TRICOLOR
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .cta-box-tricolor { padding: 2rem 1.25rem; }
    .cta-box-tricolor h3 { font-size: 1.25rem; }
    .cta-logo { width: 64px; height: 64px; }
}

/* ----------------------------------------------------------------
   SEÇÃO VIDEO
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .video-section { padding: 2.5rem 0; }
}

/* ----------------------------------------------------------------
   CARDS EM GERAL — menos elevação no mobile
   ---------------------------------------------------------------- */
@media (max-width: 768px) {
    .card:hover { transform: none !important; }
    .btn:hover  { transform: none !important; box-shadow: none !important; }
    a.text-decoration-none .card:hover { transform: none !important; }
}


/* ================================================================
   MELHORIAS MOBILE GERAIS — 2025
   ================================================================ */

/* Topbar: esconder completamente em mobile */
@media (max-width:767px) {
    .topbar { display:none !important; }
    .navbar { top:0 !important; }
}

/* Navbar brand logo menor */
@media (max-width:576px) {
    .navbar-brand img { height:36px !important; }
    .brand-name { font-size:.85rem !important; }
    .brand-sub  { display:none !important; }
}

/* Hero: sem altura mínima enorme, conteúdo centralizado */
@media (max-width:767px) {
    .hero-modern { padding-top:0; }
    .hero-content-modern { padding:2rem 0 1.5rem; }
    .min-vh-hero { min-height:auto !important; }
    .hero-title  { font-size:clamp(1.6rem,7vw,2.4rem) !important; }
    .hero-actions { flex-direction:column; gap:.6rem; }
    .btn-hero-primary, .btn-hero-ghost { width:100%; justify-content:center; font-size:.9rem; padding:.75rem 1.25rem; }
    .hero-bg-overlay { display:none; }
}

/* Seções: menos padding no mobile */
@media (max-width:767px) {
    .py-5 { padding-top:2.5rem !important; padding-bottom:2.5rem !important; }
    section.py-5:first-of-type { padding-top:1.5rem !important; }
    .container { padding-left:16px; padding-right:16px; }
}

/* Formulário de inscrição: steps mais compactos */
@media (max-width:575px) {
    .step-indicator { font-size:.72rem; }
    .step { padding:.5rem .3rem; }
    .step i { display:none; }
    .card.shadow-sm.p-4 { padding:1rem !important; }
    .form-step .btn-lg { width:100%; margin-top:.25rem; }
    .form-step .d-flex.justify-content-between { flex-direction:column; gap:.5rem; }
    .form-step .d-flex.justify-content-between .btn { width:100%; }
}

/* Tabela de notícias na home: card empilhado */
@media (max-width:575px) {
    .news-card-small { flex-direction:column !important; }
    .news-img-small  { width:100% !important; height:140px !important; }
    .news-section .row { --bs-gutter-x:0; }
}

/* Núcleos: 1 por linha em telas muito pequenas */
@media (max-width:400px) {
    .col-md-6.col-lg-4 { flex:0 0 100%; max-width:100%; }
}

/* Botões flutuantes: melhor posicionamento */
@media (max-width:575px) {
    .whatsapp-float { bottom:12px; right:12px; width:48px; height:48px; padding:0; display:flex; align-items:center; justify-content:center; border-radius:50% !important; }
    .whatsapp-float .bi { font-size:1.4rem; }
    .back-to-top { bottom:70px; right:12px; width:38px; height:38px; }
}

/* Step indicator mobile */
@media (max-width:575px) {
    .step-indicator { display:flex; }
    .step span { display:none; }
    .step { font-size:.65rem; padding:.4rem .6rem; flex:1; text-align:center; }
}

/* Footer mobile */
@media (max-width:575px) {
    .site-footer .col-lg-2, .site-footer .col-lg-3 { display:none; }
    .site-footer .col-lg-4 { text-align:center; }
    .site-footer .social-links { justify-content:center; }
}

/* ================================================================
   MOBILE REFINADO — LAYOUT HOMOGÊNEO 2025
   Corrige: botões gigantes, hero desalinhado, padding excessivo
   ================================================================ */

/* ---- Navbar: impede quebra de linha (brand + toggler na mesma fila) ---- */
@media (max-width: 991px) {
    /* Bootstrap herda flex-wrap:wrap do .navbar — sobrescrever aqui */
    .navbar { flex-wrap: nowrap !important; }
    .navbar > .container,
    .navbar > .container-fluid {
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
    }
    .navbar-brand {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        overflow: hidden;
    }
    .navbar-toggler {
        flex: 0 0 auto !important;
        margin-left: 8px;
    }
    .brand-name {
        font-size: .78rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 100% !important;
    }
    .brand-sub { display: none !important; }
    .navbar-brand img { height: 36px !important; }
}

/* ---- Hero: padding lateral — abordagem via section ---- */
@media (max-width: 991px) {
    /* Adiciona padding na section e anula todos os gutters internos */
    section.hero-modern { padding-left: 24px !important; padding-right: 24px !important; }
    .hero-modern .container.hero-content-modern {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }
    .hero-modern .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .hero-modern [class*="col-"] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .hero-eyebrow { font-size: .72rem; margin-bottom: .65rem; }
    .hero-title {
        font-size: clamp(1.65rem, 6.8vw, 2.2rem) !important;
        line-height: 1.07 !important;
        margin-bottom: .4rem;
    }
    .hero-desc { font-size: .875rem; margin: .65rem 0 1.1rem; }
    /* Botões alinhados ao texto (sem padding extra) */
    .hero-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: .55rem !important;
    }
    .btn-hero-primary,
    .btn-hero-ghost {
        width: 100% !important;
        min-width: unset !important;
        max-width: unset !important;
        flex: none !important;
        justify-content: center !important;
        padding: .78rem 1rem !important;
        font-size: .88rem !important;
    }
    /* Stats: de ponta a ponta — cancela o padding da section */
    .hero-stats {
        margin-left: -24px !important;
        margin-right: -24px !important;
        padding: .85rem 24px !important;
        margin-top: .75rem;
        border-radius: 0 !important;
    }
    .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: .4rem .5rem;
        justify-items: center;
    }
    .hero-stat-div  { display: none !important; }
    .hero-stat-num  { font-size: 1.25rem; }
    .hero-stat-lbl  { font-size: .55rem; }
}

/* ---- Menu mobile: visual melhorado ---- */
@media (max-width: 991px) {
    .navbar-collapse {
        padding: .5rem .5rem .75rem;
        border-top: 2px solid rgba(255,255,255,.12);
        margin-top: 4px;
    }
    .navbar-nav {
        gap: 2px;
    }
    .navbar-nav .nav-link {
        padding: .65rem 1rem !important;
        font-size: .9rem;
        border-radius: 10px;
        display: flex !important;
        align-items: center;
        border-left: 3px solid transparent;
        transition: background .15s, border-color .15s;
    }
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link.active {
        background: rgba(255,255,255,.12) !important;
        border-left-color: var(--yellow);
        color: #fff !important;
    }
    .navbar-nav .nav-link.active {
        border-left-color: var(--yellow);
        color: var(--yellow) !important;
    }
    /* Botão Inscreva-se no menu */
    .navbar-nav .ms-lg-2 { margin-top: .5rem; }
    .navbar-nav .btn-cta-red {
        display: block !important;
        text-align: center !important;
        padding: .65rem 1.25rem !important;
        font-size: .9rem !important;
        border-radius: 10px !important;
        border-left: none !important;
    }
}

/* ---- Talento único: ocupa largura completa e texto legível ---- */
.talentos-grid-page .talento-card:only-child {
    grid-column: 1 / -1;
    max-width: 560px;
    margin: 0 auto;
    text-align: left;
}
.talentos-grid-page .talento-card:only-child .talento-foto-wrap {
    display: flex;
    justify-content: flex-start;
    padding-left: 1.75rem;
}
.talentos-grid-page .talento-card:only-child .talento-info {
    text-align: left;
    padding: 0 1.75rem 1.5rem;
}
.talentos-grid-page .talento-card:only-child .talento-desc {
    font-size: .95rem;
    line-height: 1.7;
}
/* Mobile: sempre 1 coluna na página de talentos */
@media (max-width: 767px) {
    .talentos-grid-page {
        grid-template-columns: 1fr !important;
    }
    .talentos-grid-page .talento-card:only-child {
        max-width: 100%;
    }
}

/* ---- Botões genéricos: tamanho proporcional ---- */
@media (max-width: 575px) {
    .btn-lg {
        padding: .55rem 1.1rem !important;
        font-size: .88rem !important;
    }
    .btn {
        padding: .42rem .85rem;
        font-size: .84rem;
    }
    /* Grupos de botão não empilham tudo */
    .d-flex.gap-2.flex-wrap > .btn,
    .d-flex.gap-3 > .btn {
        flex: none !important;
    }
}

/* ---- Formulário de inscrição: steps e botões de navegação ---- */
@media (max-width: 575px) {
    /* Steps horizontais compactos */
    .steps-bar, .step-indicator {
        display: flex;
        overflow-x: auto;
        gap: .2rem;
        padding-bottom: .2rem;
        -webkit-overflow-scrolling: touch;
    }
    .step {
        flex: 1;
        min-width: auto;
        font-size: .66rem;
        padding: .45rem .4rem;
        text-align: center;
    }
    .step i { display: none; }
    /* Botões Anterior/Próximo lado a lado, não empilhados */
    .form-step .d-flex.justify-content-between {
        flex-direction: row !important;
        gap: .5rem;
    }
    .form-step .d-flex.justify-content-between .btn {
        flex: 1 !important;
        width: auto !important;
        font-size: .85rem;
        padding: .5rem .75rem;
    }
    /* Card do form: menos padding interno */
    .card.shadow-sm.p-4 { padding: 1rem !important; }
}

/* ---- News cards: imagem lateral mantida no mobile ---- */
@media (max-width: 575px) {
    .news-card-small {
        flex-direction: row !important;
    }
    .news-img-small {
        width: 88px !important;
        min-height: 80px !important;
        height: auto !important;
    }
    .news-body-small { padding: .6rem .7rem; }
    .news-title-sm   { font-size: .8rem; }
    .news-meta       { font-size: .68rem; }
}

/* ---- Núcleos: 2 por linha no mobile ---- */
@media (max-width: 575px) {
    .section-nucleos .row > [class*="col-lg"],
    .section-nucleos .row > [class*="col-md"] {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

/* ---- Títulos de seção: escala proporcional ---- */
@media (max-width: 480px) {
    .section-title-new { font-size: 1.35rem !important; line-height: 1.25; }
    .section-eyebrow   { font-size: .68rem; }
    .py-5 { padding-top: 2.25rem !important; padding-bottom: 2.25rem !important; }
}

/* ---- CTA tricolor: botões sem fullwidth ---- */
@media (max-width: 575px) {
    .cta-box-tricolor .hero-actions,
    .cta-box-tricolor .d-flex.flex-wrap {
        flex-direction: column;
        align-items: center;
    }
    .cta-box-tricolor .btn-hero-primary,
    .cta-box-tricolor .btn-hero-ghost {
        width: auto !important;
        min-width: min(200px, 80vw);
    }
    .cta-box-tricolor h3 { font-size: 1.15rem; }
}

/* ---- Cards em geral: sem espaçamento lateral excessivo ---- */
@media (max-width: 575px) {
    .card { border-radius: 10px !important; }
    .row.g-4 { --bs-gutter-y: 1rem; --bs-gutter-x: .75rem; }
}

/* ---- Container: padding mínimo garantido ---- */
@media (max-width: 400px) {
    .container { padding-left: 12px !important; padding-right: 12px !important; }
    .section-title-new { font-size: 1.2rem !important; }
}

/* ================================================================
   MELHORIAS UX MOBILE + TABLET — 2025
   ================================================================ */

/* ---- 1. Previne zoom automático do iOS ao focar inputs ---- */
@media (max-width: 767px) {
    input, select, textarea {
        font-size: 16px !important;
    }
}

/* ---- 2. Touch targets mínimos 44px (padrão Apple/Google) ---- */
.navbar-nav .nav-link {
    min-height: 44px;
    display: flex !important;
    align-items: center;
}
.navbar-toggler {
    min-width: 44px;
    min-height: 44px;
}
.btn {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.btn-sm { min-height: 34px; }

/* ---- 3. Desabilitar AOS no mobile (evita conteúdo invisible) ---- */
@media (max-width: 767px) {
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        transition-duration: 0ms !important;
        transition-delay: 0ms !important;
    }
}

/* ---- 4. Tablet (768–991px): navbar hambúrguer mais clean ---- */
@media (min-width: 768px) and (max-width: 991px) {
    .navbar-collapse {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--green-dark);
        padding: .75rem 1rem 1rem;
        box-shadow: 0 8px 28px rgba(0,0,0,.3);
        border-top: 1px solid rgba(255,255,255,.08);
        z-index: 1000;
    }
    .navbar-nav {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: .25rem;
    }
    .navbar-nav .nav-item:last-child {
        grid-column: 1 / -1;
        margin-top: .35rem;
    }
    .navbar-nav .btn-cta-red {
        width: 100% !important;
        justify-content: center;
    }
    .navbar { position: relative; }
}

/* ---- 5. Barra CTA sticky no rodapé mobile ---- */
.mobile-cta-bar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1039;
    background: #fff;
    border-top: 2px solid rgba(0,0,0,.09);
    padding: 8px 14px 12px;
    gap: 10px;
    box-shadow: 0 -4px 20px rgba(0,0,0,.14);
}
.mobile-cta-bar .cta-btn {
    flex: 1;
    border-radius: 10px;
    font-weight: 800;
    font-size: .88rem;
    padding: .65rem .5rem;
    text-align: center;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-height: 46px;
}
.mobile-cta-bar .cta-btn-inscricao {
    background: var(--red);
    color: #fff;
    border: 2px solid var(--red);
}
.mobile-cta-bar .cta-btn-wpp {
    background: #25D366;
    color: #fff;
    border: 2px solid #25D366;
}
@media (max-width: 767px) {
    .mobile-cta-bar { display: flex; }
    body { padding-bottom: 72px; }
    .whatsapp-float { display: none !important; }
    .back-to-top { bottom: 82px; }
}

/* ---- 6. Footer mobile: compacto e útil ---- */
@media (max-width: 767px) {
    .site-footer { padding: 2rem 0 1.25rem; }
    /* Esconder colunas de links internos — estão na navbar */
    .site-footer .col-lg-2,
    .site-footer .col-lg-3:not(:last-child) { display: none; }
    /* Coluna de marca: centralizada */
    .site-footer .col-lg-4 {
        text-align: center;
    }
    .site-footer .social-links { justify-content: center; }
    /* Coluna de contato: visível e compacta */
    .site-footer .col-lg-3:last-child { margin-top: 0; }
    .footer-contact li { font-size: .82rem; }
    /* Rodapé final: apenas copyright */
    .footer-bottom { font-size: .72rem; text-align: center; }
    .footer-bottom a { display: none; }
    .footer-bottom a:first-of-type { display: inline; }
}

/* ---- 7. Tablet footer: 2 colunas ---- */
@media (min-width: 768px) and (max-width: 991px) {
    .site-footer .col-lg-2 { display: block; }
    .site-footer .col-lg-3 { flex: 0 0 50%; max-width: 50%; }
    .site-footer .col-lg-4 { flex: 0 0 100%; max-width: 100%; text-align: center; }
    .site-footer .social-links { justify-content: center; }
}

/* ---- 8. Galeria: 2 colunas no mobile ---- */
@media (max-width: 575px) {
    .gallery-grid { grid-template-columns: repeat(2, 1fr) !important; gap: .5rem; }
    .gallery-thumb img { border-radius: 8px; }
}

/* ---- 9. Notícias: cards mobile mais compactos ---- */
@media (max-width: 575px) {
    .news-img { height: 180px; }
    .news-body { padding: 1rem; }
    .news-title { font-size: .95rem; }
}

/* ---- 10. Banner instalação PWA iOS ---- */
.ios-pwa-banner {
    display: none;
    flex-direction: column;
    position: fixed;
    bottom: 80px;
    left: 12px;
    right: 12px;
    z-index: 2000;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 40px rgba(0,0,0,.22);
    padding: 14px 14px 18px;
    border: 1.5px solid rgba(27,107,42,.15);
    transform: translateY(20px);
    opacity: 0;
    transition: transform .35s cubic-bezier(.4,0,.2,1), opacity .35s ease;
}
.ios-pwa-banner.ios-pwa-show {
    transform: translateY(0);
    opacity: 1;
}
.ios-pwa-inner {
    display: flex;
    align-items: center;
    gap: 12px;
}
.ios-pwa-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    object-fit: contain;
    flex-shrink: 0;
    background: var(--green-light);
    padding: 4px;
    border: 1.5px solid var(--border);
}
.ios-pwa-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.ios-pwa-text strong:first-child {
    font-size: .9rem;
    font-weight: 800;
    color: var(--black);
    font-family: 'Montserrat', sans-serif;
}
.ios-pwa-text span {
    font-size: .78rem;
    color: var(--gray);
    line-height: 1.45;
}
.ios-pwa-close {
    position: absolute;
    top: 10px;
    right: 12px;
    background: none;
    border: none;
    color: var(--gray);
    font-size: .9rem;
    padding: 4px;
    cursor: pointer;
    line-height: 1;
}
.ios-pwa-arrow {
    width: 16px;
    height: 16px;
    background: #fff;
    border-right: 1.5px solid rgba(27,107,42,.15);
    border-bottom: 1.5px solid rgba(27,107,42,.15);
    transform: rotate(45deg);
    position: absolute;
    bottom: -9px;
    left: 50%;
    margin-left: -8px;
    box-shadow: 3px 3px 6px rgba(0,0,0,.06);
}

/* ---- 10. Formulário de inscrição: inputs grandes, teclado certo ---- */
@media (max-width: 767px) {
    .form-control, .form-select {
        min-height: 48px;
        border-radius: 10px !important;
        padding: .65rem 1rem !important;
    }
    .form-label { font-weight: 600; font-size: .88rem; margin-bottom: .3rem; }
    .input-group .form-control { min-height: 48px; }
}

/* ================================================================
   MASONRY GALLERY — v8
   ================================================================ */
.masonry-gallery { column-count: 4; column-gap: .75rem; }
.masonry-item { break-inside: avoid; margin-bottom: .75rem; border-radius: 10px; overflow: hidden; cursor: pointer; position: relative; }
.masonry-item img { width: 100%; display: block; transition: transform .25s ease; }
.masonry-item:hover img { transform: scale(1.04); }
.masonry-item .overlay { position: absolute; inset: 0; background: rgba(0,0,0,0); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.5rem; transition: background .25s; }
.masonry-item:hover .overlay { background: rgba(0,0,0,.35); }
@media (max-width: 991px) { .masonry-gallery { column-count: 3; } }
@media (max-width: 575px) { .masonry-gallery { column-count: 2; } }

/* ================================================================
   SKELETON LOADING
   ================================================================ */
@keyframes skeleton-shimmer { 0% { background-position: -500px 0; } 100% { background-position: 500px 0; } }
.sk { background: linear-gradient(90deg, #e8eaed 25%, #f4f4f4 50%, #e8eaed 75%); background-size: 1000px 100%; animation: skeleton-shimmer 1.6s infinite; border-radius: 6px; }
.sk-card { background: #fff; border-radius: 12px; overflow: hidden; border: 1px solid #f0f0f0; margin-bottom: 1rem; }
.sk-img  { width: 100%; height: 200px; }
.sk-body { padding: 1rem; }
.sk-line { height: 12px; margin-bottom: 10px; }
.sk-line.sm { height: 10px; }
.sk-line.w30 { width: 30%; }
.sk-line.w60 { width: 60%; }
.sk-line.w80 { width: 80%; }

/* ================================================================
   TIMELINE APRIMORADA — v2
   ================================================================ */
.timeline-v2 { position: relative; }
.timeline-v2-item { display: flex; gap: 1.25rem; padding-bottom: 2rem; }
.timeline-v2-left { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; width: 56px; }
.timeline-v2-badge { background: var(--green); color: #fff; font-size: .65rem; font-weight: 900; padding: .3rem .4rem; border-radius: 6px; text-align: center; min-width: 46px; line-height: 1.2; letter-spacing: .02em; }
.timeline-v2-line { width: 2px; flex: 1; background: linear-gradient(to bottom, var(--green), var(--red)); opacity: .2; margin-top: .4rem; }
.timeline-v2-item:last-child .timeline-v2-line { display: none; }
.timeline-v2-right { padding-top: .15rem; flex: 1; }
.timeline-v2-title { font-size: .95rem; font-weight: 700; color: var(--black); margin-bottom: .2rem; }
.timeline-v2-text  { font-size: .875rem; color: #555; line-height: 1.6; }

/* ================================================================
   PARCEIROS — página dedicada
   ================================================================ */
.parceiros-page-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); gap: 1.25rem; }
.parceiro-page-card { background: #fff; border: 1.5px solid #f0f0f0; border-radius: 14px; padding: 1.5rem 1rem; display: flex; flex-direction: column; align-items: center; gap: .75rem; transition: border-color .2s, box-shadow .2s; text-decoration: none; color: inherit; }
.parceiro-page-card:hover { border-color: var(--green); box-shadow: 0 4px 20px rgba(27,107,42,.12); color: inherit; }
.parceiro-page-logo { max-width: 120px; max-height: 80px; object-fit: contain; }
.parceiro-page-nome { font-weight: 700; font-size: .9rem; color: var(--black); text-align: center; }
.parceiro-tipo-badge { font-size: .68rem; font-weight: 700; padding: .2rem .6rem; border-radius: 20px; background: var(--green-light); color: var(--green); text-transform: uppercase; letter-spacing: .05em; }

/* ================================================================
   PAGINAÇÃO JS — admin tables
   ================================================================ */
.pagination-bar { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: 1rem; }
.pagination-bar .page-btn { border: 1px solid #dee2e6; border-radius: 6px; padding: .3rem .7rem; font-size: .82rem; cursor: pointer; background: #fff; }
.pagination-bar .page-btn.active { background: var(--green); color: #fff; border-color: var(--green); }
.pagination-bar .page-btn:hover:not(.active) { background: #f0f0f0; }
