/* --- RESPONSIVE LOGIC --- */
@media screen and (max-width: 767px) {

    .container {
        max-width: 100%;
        padding: 20px;
    }

    .marquee-wrapper {
        /* display: none; */
        width: 110%;
    }

    section.section-marquee {
        padding: 0 0 50px 0;
    }

    .bg-watermark {
        width: 100%;
        top: 20%;
        opacity: 0.05;
    }

    .main-content {
        flex-direction: column;
        padding-bottom: 40px;
        gap: 60px;
    }

    .title-poppins,
    .title-playfair {
        font-size: 42px;
        line-height: 1.2;
    }

    .header {
        margin-bottom: 30px;
    }

    .right-col {
        padding-top: 0;
        width: 100%;
    }

    .star-decoration {
        position: relative;
        top: 0;
        left: 0;
        margin-bottom: 15px;
    }

    .video-card {
        max-width: 100%;
    }
}


/* --- RESPONSIVE (Max Width 767px) --- */
@media screen and (max-width: 767px) {
    .section-why {
        padding: 60px 0;
    }

    .why-header {
        flex-direction: column;
        gap: 30px;
    }

    .why-title-col,
    .why-desc-col {
        flex: auto;
        width: 100%;
        text-align: left;
        align-items: flex-start;
    }

    .why-desc-text {
        text-align: left;
        margin-left: 0;
    }

    .why-main-title {
        font-size: 32px;
    }

    .comms-agency-text {
        font-size: 36px;
        /* Scaled down for mobile */
        line-height: 1.2;
        display: block;
        margin-top: 5px;
    }

    .why-grid {
        grid-template-columns: 1fr;
        /* Stack cards vertically */
        gap: 40px;
    }

    .why-pill {
        font-size: 12px;
        line-height: 19px;
        padding: 12px 20px;
    }

    .pills-container {
        gap: 20px;
    }

    .pill-btn {
        max-width: 100%;
    }

}


/* --- RESPONSIVE --- */
@media screen and (max-width: 991px) {
    .expert-grid {
        grid-template-columns: 1fr;
        /* Stack columns on tablet/mobile */
        gap: 50px;
    }

    .expert-titles-wrapper {
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 767px) {
    .expert-header-row {
        flex-direction: column;
        gap: 15px;
    }

    .expert-h2 {
        font-size: 32px;
    }

    .expert-script-gradient {
        font-size: 36px;
    }

    .expert-card {
        padding: 20px;
    }

    .card-img {
        width: 100px;
        height: 70px;
    }
}


/* --- Responsive --- */
@media screen and (max-width: 1024px) {
    .toolkit-grid {
        gap: 20px;
    }

    .toolkit-card {
        width: 45%;
        /* 2 per row on tablet */
    }
}

@media screen and (max-width: 767px) {
    .toolkit-header {
        text-align: left;
        padding: 0 20px;
    }

    .toolkit-title {
        font-size: 32px;
    }

    .toolkit-card {
        width: 100%;
        /* 1 per row on mobile */
        margin-bottom: 20px;
    }

    .toolkit-grid {
        grid-template-columns: repeat(1, 1fr);
        max-width: 90%;
    }

}


/* --- Responsive --- */
@media screen and (max-width: 991px) {
    .stats-grid {
        grid-template-columns: 1fr 1fr;
        /* 2x2 on Tablet */
        gap: 60px;
    }
}

@media screen and (max-width: 500px) {
    .stats-grid {
        grid-template-columns: 1fr;
        /* Stack on Mobile */
        gap: 50px;
    }

    .stat-number-wrapper {
        font-size: 48px;
    }
}

/* --- RESPONSIVE --- */
@media screen and (max-width: 991px) {
    .framework-grid {
        grid-template-columns: 1fr;
        /* Stack on tablet */
        gap: 60px;
    }

    .framework-left {
        position: static;
        /* Remove sticky on mobile */
        text-align: center;
    }

    .framework-img-wrapper {
        margin: 0 auto 30px auto;
    }

    .framework-item {
        flex-direction: column;
        /* Stack number, text, button on mobile */
        position: relative;
    }

    .fw-btn {
        position: absolute;
        top: 40px;
        right: 0;
    }
}

/* --- RESPONSIVE --- */
@media screen and (max-width: 991px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .contact-left {
        text-align: center;
        padding-right: 0;
    }

    .contact-subtext {
        margin: 0 auto;
    }

    .contact-heading {
        font-size: 36px;
    }

    .contact-card {
        padding: 30px;
    }
}


/* --- RESPONSIVE --- */
@media screen and (max-width: 991px) {
    .footer-title-line {
        font-size: 42px;
    }

    .footer-cta-btn {
        width: 70px;
        height: 70px;
    }

    .footer-links-grid {
        grid-template-columns: 1fr 1fr;
        /* 2 cols */
        gap: 50px;
    }
}

@media screen and (max-width: 500px) {
    .footer-cta-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .footer-cta-btn {
        align-self: flex-start;
    }

    .footer-links-grid {
        grid-template-columns: 1fr;
        /* 1 col */
        gap: 40px;
        margin-bottom: 0;
    }

    .footer-col {
        text-align: start;
    }

    .footer-copyright {
        text-align: start;
    }
}