/* =========================================================
   AEROCLUBE DE SOROCABA — STYLE.CSS ÚNICO
========================================================= */

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    color: #17202a;
    background: #fff;
}

/* =========================
   MENU
========================= */

.navbar {
    background: #fff;
    padding: 12px 0;
    box-shadow: 0 2px 15px rgba(0,0,0,.08);
}

.navbar .container {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

.logo {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-size: 20px;
    font-weight: 800;
    color: #123b5d;
    white-space: nowrap;
    flex-shrink: 1;
}

.logo img {
    height: 50px;
    width: auto;
    flex-shrink: 0;
}

.logo span { color: #123b5d; }
.logo b { color: #f58220; }

.navbar-nav .nav-link {
    font-weight: 600;
    color: #243746;
    margin-left: 20px;
}

.btn-menu {
    background: #f58220 !important;
    color: #fff !important;
    border-radius: 6px;
    padding: 10px 20px !important;
    margin-left: 20px !important;
    font-weight: 700 !important;
    display: inline-block;
}

.btn-menu:hover {
    background: #d9680d !important;
    color: #fff !important;
}


.bottom-menu {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 20px;
}

.bottom-menu a {
    display: flex;
    align-items: center;
    gap: 13px;
    color: #dbe6ed;
    text-decoration: none;
    padding: 13px 14px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
}

.bottom-menu a:hover {
    background: #f58220;
    color: #fff;
}

.bottom-menu i {
    font-size: 18px;
    width: 20px;
}


/* =========================
   BOTÕES
========================= */

.btn-orange {
    display: inline-block;
    background: #f58220;
    color: #fff !important;
    padding: 14px 28px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 800;
    font-size: 14px;
    transition: .3s;
}

.btn-orange:hover {
    background: #d9680d;
    color: #fff !important;
    transform: translateY(-2px);
}

.btn-primary-custom {
    background: #f58220;
    border: none;
    color: #fff;
    padding: 15px 28px;
    border-radius: 6px;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
    margin-right: 10px;
}

.btn-outline-custom {
    border: 2px solid #fff;
    color: #fff;
    padding: 13px 28px;
    border-radius: 6px;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
}

/* =========================
   WHATSAPP
========================= */

.whatsapp-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 99999;
    cursor: pointer;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #25D366;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 5px 18px rgba(0,0,0,.25);
    text-decoration: none;
}

.whatsapp-icon img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

/* =========================
   INDEX — HERO
========================= */

.hero {
    min-height: 650px;

    background:
        linear-gradient(rgba(5,25,42,.40), rgba(5,25,42,.72)),
        url('aero.jpg')
        center/cover no-repeat;

    display: flex;
    align-items: center;
    color: white;
}

.hero-content { max-width: 850px; }

.hero small {
    display: inline-block;
    background: rgba(245,130,32,.95);
    padding: 8px 16px;
    border-radius: 30px;
    font-weight: 700;
    margin-bottom: 20px;
}

.hero h1 {
    font-size: 56px;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 25px;
}

.hero p {
    font-size: 20px;
    line-height: 1.7;
    max-width: 700px;
    margin-bottom: 35px;
}

/* =========================
   INDEX — SEÇÕES
========================= */

.section { padding: 90px 0; }

.section-title {
    text-align: center;
    margin-bottom: 55px;
}

.section-title small {
    color: #f58220;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.section-title h2 {
    font-size: 38px;
    font-weight: 800;
    color: #123b5d;
    margin-top: 10px;
}

.section-title p {
    color: #687782;
    max-width: 650px;
    margin: 15px auto;
    line-height: 1.7;
}

/* =========================
   CURSOS
========================= */

.course-card {
    border: none;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,.10);
    height: 100%;
    transition: .3s;
    background: #fff;
}

.course-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 15px 35px rgba(0,0,0,.15);
}

.course-image {
    height: 210px;
    background-size: cover;
    background-position: center;
}

.course-body { padding: 28px; }

.course-body h3 {
    color: #123b5d;
    font-size: 22px;
    font-weight: 800;
}

.course-body p {
    color: #687782;
    line-height: 1.7;
}

.course-link {
    color: #f58220;
    font-weight: 700;
    text-decoration: none;
}

/* =========================
   DIFERENCIAIS
========================= */

.diferenciais { background: #f4f7f9; }

.feature {
    text-align: center;
    padding: 25px;
}

.feature-icon {
    width: 70px;
    height: 70px;
    background: #123b5d;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 28px;
}

.feature h4 {
    font-weight: 800;
    color: #123b5d;
}

.feature p {
    color: #687782;
    line-height: 1.6;
}

/* =========================
   CONTATO
========================= */

.contact-box {
    background: #f4f7f9;
    border-radius: 12px;
    padding: 35px;
}

.contact-box h3 {
    color: #123b5d;
    font-weight: 800;
    margin-bottom: 25px;
}

.form-control,
.form-select {
    padding: 13px;
    border-radius: 6px;
}

/* =========================
   HISTÓRIA — HERO
========================= */

.history-hero {
    min-height: 470px;
    background:
        linear-gradient(
            90deg,
            rgba(18,59,93,.05) 0%,
            rgba(18,59,93,.20) 35%,
            rgba(18,59,93,.70) 70%,
            rgba(18,59,93,.95) 100%
        ),
        url('aero.jpg') center center / cover no-repeat;
    display: flex;
    align-items: center;
    color: #fff;
}

.history-hero-content { max-width: 720px; }

.history-hero small {
    display: inline-block;
    background: #f58220;
    padding: 8px 18px;
    border-radius: 30px;
    font-weight: 800;
    margin-bottom: 20px;
    letter-spacing: .5px;
}

.history-hero h1 {
    font-size: 56px;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 20px;
}

.history-hero h1 span { color: #f58220; }

.history-hero p {
    font-size: 20px;
    line-height: 1.7;
    max-width: 650px;
}

/* =========================
   HISTÓRIA — INTRO
========================= */

.intro { padding: 90px 0 70px; }

.intro-label {
    color: #f58220;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.intro h2 {
    color: #123b5d;
    font-size: 40px;
    font-weight: 800;
    margin: 12px 0 25px;
}

.intro p {
    color: #647480;
    font-size: 17px;
    line-height: 1.9;
}

.year-box {
    border-left: 5px solid #f58220;
    padding: 20px 25px;
    margin-top: 30px;
    background: #f7f9fa;
}

.year-box strong {
    display: block;
    color: #123b5d;
    font-size: 30px;
    font-weight: 800;
}

.year-box span {
    color: #687782;
    font-weight: 600;
}

/* =========================
   HISTÓRIA — CARDS
========================= */

.history-section {
    background: #f4f7f9;
    padding: 90px 0;
}

.history-card {
    background: #fff;
    border-radius: 14px;
    padding: 35px;
    height: 100%;
    box-shadow: 0 8px 30px rgba(0,0,0,.07);
    border-top: 4px solid #f58220;
    transition: .3s;
}

.history-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(0,0,0,.12);
}

.history-card h3 {
    color: #123b5d;
    font-size: 22px;
    font-weight: 800;
    margin-bottom: 18px;
}

.history-card p {
    color: #687782;
    line-height: 1.8;
    margin-bottom: 0;
}

/* =========================
   HISTÓRIA — FRASE
========================= */

.quote-section {
    padding: 100px 0;
    background: #123b5d;
    color: #fff;
    text-align: center;
}

.quote-section .quote-icon {
    font-size: 50px;
    color: #f58220;
    margin-bottom: 20px;
}

.quote-section h2 {
    max-width: 850px;
    margin: auto;
    font-size: 34px;
    line-height: 1.5;
    font-weight: 700;
}

.quote-section p {
    margin-top: 25px;
    color: #c9d5dd;
    font-size: 17px;
}

/* =========================
   HISTÓRIA — INSTALAÇÕES
========================= */

.facilities { padding: 90px 0; }

.facilities h2 {
    color: #123b5d;
    font-size: 38px;
    font-weight: 800;
    margin-bottom: 25px;
}

.facilities p {
    color: #687782;
    line-height: 1.9;
    font-size: 17px;
}

.facility-box {
    background: #f4f7f9;
    border-radius: 14px;
    padding: 30px;
    margin-top: 25px;
}

.facility-box strong {
    color: #123b5d;
    font-size: 20px;
}

/* =========================
   CTA — COMPARTILHADO
========================= */

.cta {
    background: #123b5d;
    color: #fff;
    padding: 90px 0;
    text-align: center;
}

.cta-logo {
    display: block;
    width: 420px;
    max-width: 85%;
    height: auto;
    margin: 0 auto 35px;
}

.cta h2 {
    font-size: 40px;
    font-weight: 800;
    margin-bottom: 20px;
}

.cta p {
    font-size: 18px;
    max-width: 700px;
    margin: 0 auto 30px;
    line-height: 1.7;
    color: #d8e1e7;
}

/* =========================
   FOOTER
========================= */

footer {
    background: #0c263a;
    color: #d7e0e6;
    padding: 45px 0 25px;
}

footer h5 {
    color: #fff;
    font-weight: 800;
    margin-bottom: 20px;
}

footer p { color: #b7c4cc; }

.copyright {
    border-top: 1px solid rgba(255,255,255,.1);
    margin-top: 30px;
    padding-top: 20px;
    font-size: 13px;
    color: #91a3af;
}

/* =========================
   RESPONSIVO
========================= */

@media (max-width: 991.98px) {

    .navbar .container {
        flex-wrap: wrap;
    }

    .logo {
        flex: 1;
        min-width: 0;
        font-size: 13px;
        gap: 5px;
    }

    .logo img { height: 38px; }

    .logo span { white-space: nowrap; }

    .navbar-toggler {
        margin-left: auto;
        flex-shrink: 0;
        padding: 4px 6px;
    }

    .navbar-collapse {
        flex-basis: 100%;
        width: 100%;
    }

    .navbar-collapse .navbar-nav {
        width: 100%;
        padding-top: 15px;
    }

    .navbar-collapse .nav-item { width: 100%; }

    .navbar-collapse .nav-link {
        margin-left: 0;
        padding: 10px 5px;
    }

    .history-hero { min-height: 500px; }

    .history-hero h1 { font-size: 40px; }

    .history-hero p { font-size: 17px; }

    .intro,
    .history-section,
    .facilities {
        padding: 65px 0;
    }

    .intro h2,
    .facilities h2 {
        font-size: 30px;
    }

    .quote-section h2 { font-size: 27px; }

    .cta h2 { font-size: 30px; }
}

@media (max-width: 768px) {

    .hero { min-height: 600px; }

    .hero h1 { font-size: 38px; }

    .hero p { font-size: 17px; }

    .btn-primary-custom,
    .btn-outline-custom {
        display: block;
        text-align: center;
        margin: 10px 0;
    }

    .section { padding: 65px 0; }

    .section-title h2 { font-size: 30px; }

    .cta h2 { font-size: 30px; }

    .whatsapp-icon {
        width: 52px;
        height: 52px;
        right: 15px;
        bottom: 15px;
    }

    .whatsapp-icon img {
        width: 52px;
        height: 52px;
    }
}


/* === CSS Painel Admin === */ 

*{box-sizing:border-box}
body{margin:0;background:#f4f7f9;font-family:'Montserrat',sans-serif;color:#243746}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:250px;background:#123b5d;color:#fff;padding:25px 18px;z-index:10}
.brand{display:flex;align-items:center;gap:10px;padding:0 8px 28px;border-bottom:1px solid rgba(255,255,255,.12)}
.brand img{width:42px;height:42px;object-fit:contain}
.brand strong{font-size:15px;line-height:1.2}
.brand span{display:block;color:#f58220;font-size:11px;margin-top:3px}
.menu{margin-top:25px}
.menu a{display:flex;align-items:center;gap:13px;color:#dbe6ed;text-decoration:none;padding:13px 14px;border-radius:8px;margin-bottom:5px;font-size:14px;font-weight:600}
.menu a:hover,.menu a.active{background:#f58220;color:#fff}
.menu i{font-size:18px;width:20px}
.bottom-menu{position:absolute;left:18px;right:18px;bottom:20px}
.main{margin-left:250px;min-height:100vh}
.topbar{height:76px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 32px;box-shadow:0 2px 12px rgba(0,0,0,.06)}
.page-title{font-size:21px;font-weight:800;color:#123b5d}
.user{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700}
.avatar{width:38px;height:38px;border-radius:50%;background:#f58220;color:#fff;display:flex;align-items:center;justify-content:center}
.content{padding:30px}
.welcome{margin-bottom:25px}
.welcome h1{font-size:27px;font-weight:800;color:#123b5d;margin-bottom:5px}
.welcome p{margin:0;color:#71818c;font-size:14px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:28px}
.card-admin{background:#fff;border-radius:12px;padding:20px;box-shadow:0 5px 20px rgba(0,0,0,.06);border-left:4px solid #f58220}
.card-admin .icon{font-size:25px;color:#f58220;margin-bottom:10px}
.card-admin strong{display:block;font-size:27px;color:#123b5d}
.card-admin span{font-size:12px;color:#7b8a93}
.panel{background:#fff;border-radius:12px;box-shadow:0 5px 20px rgba(0,0,0,.06);overflow:hidden}
.panel-head{padding:20px 22px;border-bottom:1px solid #edf0f2;display:flex;justify-content:space-between;align-items:center}
.panel-head h3{font-size:17px;font-weight:800;color:#123b5d;margin:0}
.btn-orange{background:#f58220;color:#fff;border:0;border-radius:6px;padding:9px 16px;font-size:12px;font-weight:800}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th{background:#f8fafb;color:#71818c;font-size:11px;text-transform:uppercase;padding:12px 18px;text-align:left}
td{padding:15px 18px;border-top:1px solid #eef1f3}
.badge-status{padding:5px 9px;border-radius:20px;font-size:10px;font-weight:800;background:#e6f6ec;color:#218447}
.badge-flight{padding:5px 9px;border-radius:20px;font-size:10px;font-weight:800;background:#e8f0f8;color:#123b5d}
.footer{padding:25px 30px;color:#8a989f;font-size:11px}
@media(max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.sidebar{width:68px;padding:18px 8px}.brand strong,.brand span,.menu a span,.bottom-menu span{display:none}.brand{justify-content:center;border:0}.menu a{justify-content:center}.main{margin-left:68px}.topbar{padding:0 18px}.content{padding:18px}.cards{grid-template-columns:1fr 1fr}.page-title{font-size:16px}}