/**
 * IISLTech - Responsive Design Stylesheet
 * Breakpoints: 1440px, 1200px, 1024px, 768px, 480px, 375px
 */

/* Max 1440px adjustments */
@media (max-width: 1440px) {
    .container-xl {
        max-width: 1320px;
    }
}

/* Max 1200px (Desktop / Laptop) */
@media (max-width: 1200px) {
    .hero-headline {
        font-size: 2.85rem;
    }
    .hero-main-img {
        height: 400px;
    }
    .floating-metric-badge {
        padding: 0.65rem 1rem;
        font-size: 0.85rem;
    }
    .section-py {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
    }
}

/* Max 1024px (Tablets landscape & small laptops) */
@media (max-width: 1024px) {
    .hero-section {
        padding-top: 3.5rem;
        padding-bottom: 4.5rem;
    }
    .hero-headline {
        font-size: 2.45rem;
    }
    .hero-main-img {
        height: 360px;
    }
    .badge-top-right {
        right: 0;
    }
    .badge-bottom-left {
        left: 0;
    }
    .cta-banner-section {
        padding: 3.5rem 2rem;
    }
    .dropdown-mega .mega-menu-content {
        max-width: 95vw;
    }
}

/* Max 768px (Tablets portrait & large phones) */
@media (max-width: 768px) {
    .section-py {
        padding-top: 3.75rem;
        padding-bottom: 3.75rem;
    }
    .hero-section {
        padding-top: 2.5rem;
        padding-bottom: 3.5rem;
        text-align: center;
    }
    .hero-headline {
        font-size: 2.15rem;
    }
    .hero-subcopy {
        font-size: 1.05rem;
        margin-left: auto;
        margin-right: auto;
    }
    .hero-actions {
        justify-content: center !important;
    }
    .hero-trust-indicators {
        justify-content: center !important;
    }
    .hero-main-img-card {
        margin-top: 2.5rem;
    }
    .hero-main-img {
        height: 300px;
    }
    .floating-metric-badge {
        position: static;
        margin: 1rem auto 0;
        display: inline-flex;
        animation: none;
    }
    .badge-top-right, .badge-bottom-left {
        position: static;
    }
    .floating-badges-mobile-row {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-top: 1rem;
    }

    .section-title {
        font-size: 1.85rem;
    }

    /* Workflow Diagram Stack */
    .ai-workflow-container .row > .workflow-arrow-divider {
        transform: rotate(90deg);
        margin: 0.5rem 0;
    }

    .cta-banner-section {
        padding: 2.75rem 1.5rem;
        border-radius: var(--radius-lg);
        text-align: center;
    }
    .cta-banner-section .d-flex {
        justify-content: center !important;
    }

    .phone-mockup-frame {
        max-width: 280px;
    }
    .phone-screen {
        height: 440px;
    }
}

/* Max 480px (Standard Mobile) */
@media (max-width: 480px) {
    .hero-headline {
        font-size: 1.85rem;
    }
    .section-title {
        font-size: 1.65rem;
    }
    .btn-lg {
        min-height: 48px;
        padding: 0.75rem 1.5rem;
        font-size: 0.95rem;
        width: 100%;
    }
    .hero-actions {
        flex-direction: column;
        width: 100%;
    }
    .hero-actions .btn {
        width: 100%;
    }

    .feature-card {
        padding: 1.5rem;
    }
    .process-step-card {
        padding: 1.4rem;
    }
    .portfolio-img-wrapper {
        height: 200px;
    }
    .blog-img-wrapper {
        height: 180px;
    }
    .cta-banner-section {
        padding: 2rem 1.25rem;
    }
}

/* Max 375px (Small Mobile / iPhone SE) */
@media (max-width: 375px) {
    .brand-name {
        font-size: 1.25rem;
    }
    .hero-headline {
        font-size: 1.65rem;
    }
    .section-title {
        font-size: 1.5rem;
    }
    .section-badge {
        font-size: 0.75rem;
        padding: 0.3rem 0.75rem;
    }
    .hero-main-img {
        height: 240px;
    }
}

/* Zero Horizontal Overflow Enforcer */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}
img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    max-width: 100%;
}
