/* ===============================
   GLOBAL RESPONSIVE SETTINGS
================================ */

img {
    max-width: 100%;
    height: auto;
}

.container {
    width: 90%;
    max-width: 1200px;
    margin: auto;
}


/* ===============================
   LARGE TABLETS
================================ */

@media (max-width: 1024px) {

    .nav-container {
        padding: 10px 0;
    }

    .navbar img {
        width: 170px;
        height: auto;
    }


    .hero-title {
        font-size: 42px;
        line-height: 1.2;
    }

    .hero-desc {
        font-size: 17px;
        max-width: 700px;
    }


    .info-grid {
        grid-template-columns: repeat(2,1fr);
        gap: 25px;
    }


    .grid-2 {
        grid-template-columns: 1fr;
        gap: 40px;
    }


    .image-frame img {
        width: 100%;
    }


    .stats-grid {
        grid-template-columns: repeat(2,1fr);
        gap: 25px;
    }


    .cards-grid {
        grid-template-columns: repeat(2,1fr);
    }


    .footer-grid {
        grid-template-columns: repeat(2,1fr);
        gap: 35px;
    }

}


/* ===============================
   MOBILE MENU
================================ */


@media(max-width:768px){

    .navbar {
        position: relative;
    }


    .nav-container {
        display:flex;
        justify-content:space-between;
        align-items:center;
    }


    .navbar img {
        width:150px;
    }


    .mobile-toggle {
        display:block;
        background:none;
        border:none;
        font-size:28px;
        color:#7a1f2b;
        cursor:pointer;
    }


    .nav-menu {

        position:absolute;
        top:100%;
        left:0;
        width:100%;
        background:#fff;

        display:flex;
        flex-direction:column;
        align-items:center;

        padding:20px 0;

        transform:translateY(-150%);
        transition:.3s ease;

        box-shadow:0 10px 30px rgba(0,0,0,.1);
        z-index:999;

    }


    .nav-menu.active {

        transform:translateY(0);

    }


    .nav-link {

        padding:12px;
        width:100%;
        text-align:center;

    }


    .nav-cta {

        margin-top:10px;

    }



/* HERO */

.hero-section {

    min-height:650px;
    padding:100px 0 60px;

}


.hero-content {

    text-align:center;

}


.badge-gold {

    font-size:12px;
    padding:8px 12px;

}


.hero-title {

    font-size:32px;
    line-height:1.25;

}


.hero-desc {

    font-size:16px;

}


.hero-btns {

    flex-direction:column;
    gap:15px;

}


.hero-btns .btn {

    width:100%;

}


/* QUICK INFO */

.info-grid {

    grid-template-columns:1fr;
    gap:20px;

}


.info-item {

    padding:20px;

}


/* INTRO */

.section {

    padding:50px 0;

}


.section-title {

    font-size:30px;

}


.feature-checklist li {

    font-size:15px;

}



/* STATS */


.stats-grid {

    grid-template-columns:1fr;
}


.stat-card {

    padding:30px;

}



/* PORTFOLIO */

.cards-grid {

    grid-template-columns:1fr;

}


.card {

    margin-bottom:25px;

}


.card-img {

    height:250px;
    object-fit:cover;

}


/* FOOTER */

.footer-grid {

    grid-template-columns:1fr;

    text-align:center;

}


.footer img {

    margin:auto;

}


}


/* ===============================
 SMALL MOBILE
================================ */


@media(max-width:480px){


.container {

    width:92%;

}


.navbar img {

    width:130px;

}


.hero-section {

    min-height:600px;

}


.hero-title {

    font-size:27px;

}


.hero-desc {

    font-size:15px;

}


.section-title {

    font-size:26px;

}


.lead-text {

    font-size:18px;

}


.info-item {

    flex-direction:column;
    text-align:center;

}


.info-icon {

    margin-bottom:15px;

}


.stat-num {

    font-size:38px;

}


.card-body h3 {

    font-size:22px;

}


.footer-desc {

    font-size:14px;

}


}