/* ==========================================================================
   MY MAMA AGENCY — Responsive Stylesheet
   Mobile First / Breakpoints
   ========================================================================== */

/* ═══════════════════════════════════════════════
   XXL (≥1400px)
════════════════════════════════════════════════ */
@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1320px;
    }
}

/* ═══════════════════════════════════════════════
   XL (≥1200px)
════════════════════════════════════════════════ */
@media (min-width: 1200px) {
    .hero-composition { min-height: 600px; }
}

/* ═══════════════════════════════════════════════
   LG (≥992px)
════════════════════════════════════════════════ */
@media (max-width: 991.98px) {
    /* Header & Navigation */
    .main-header { padding: 1rem 0; background: var(--bg-primary); }
    .main-header.scrolled { padding: 1rem 0; }
    
    .site-logo, .main-header.scrolled .site-logo { color: var(--text-main); }
    
    /* Disable Custom Cursor on tablet/mobile */
    .custom-cursor { display: none !important; }
    body, a, button, input, textarea { cursor: auto !important; }

    /* Forms & Containers */
    .section-padding { padding-top: var(--section-padding-sm); padding-bottom: var(--section-padding-sm); }
    
    /* Sticky CTA Padding */
    .main-footer { padding-bottom: 70px; }
    body { padding-bottom: 50px; }
}

/* ═══════════════════════════════════════════════
   MD (≥768px)
════════════════════════════════════════════════ */
@media (max-width: 767.98px) {
    /* Typography */
    .display-huge { font-size: clamp(3rem, 12vw, 4.5rem); }
    .display-large { font-size: clamp(2.5rem, 10vw, 3.5rem); }
    
    /* Layout */
    .hero-section { min-height: 80vh; text-align: center; padding-top: 100px; }
    .hero-composition { min-height: 400px; margin-top: 2rem; }
    .floating-label { font-size: 0.65rem; padding: 0.3rem 0.8rem; }
    
    .dna-card { height: 250px; margin-bottom: 1rem; }
    .service-card { padding: 2rem 1.5rem; margin-bottom: 1rem; }
    
    .footer-top .col-lg-3, .footer-top .col-lg-4, .footer-top .col-lg-2 {
        text-align: center;
        margin-bottom: 2rem;
    }
    .footer-logo { align-items: center; }
    .footer-bottom { text-align: center; padding-bottom: 3rem; }
    .footer-legal-links { justify-content: center !important; }
    
    /* Process */
    .process-timeline { border-left: none; padding-left: 0; }
    .process-step { padding-bottom: 3rem; text-align: center; }
    
    /* Marquee */
    .marquee-item { font-size: 2rem; }
}

/* ═══════════════════════════════════════════════
   SM (≥576px)
════════════════════════════════════════════════ */
@media (max-width: 575.98px) {
    .section-padding { padding-top: 60px; padding-bottom: 60px; }
    
    .talent-filter { flex-direction: column; width: 100%; }
    .filter-btn { width: 100%; text-align: center; margin-bottom: 0.25rem; }
    
    .hero-ctas { flex-direction: column; width: 100%; }
    .btn-solid-dark, .btn-outline-dark, .btn-cta-primary { width: 100%; text-align: center; }
    
    .cookie-banner { text-align: center; padding-bottom: 80px; /* space for mobile sticky cta */ }
    .btn-cookie-accept, .btn-cookie-reject, .btn-cookie-settings { width: 100%; margin-bottom: 0.5rem; }
}

/* ═══════════════════════════════════════════════
   XS (<480px)
════════════════════════════════════════════════ */
@media (max-width: 479.98px) {
    .logo-line-1 { font-size: 1.2rem; }
    .mobile-nav-link { font-size: 1.25rem; }
    .mobile-nav { padding-top: 5rem; }
    
    .form-control, .form-select { font-size: 0.9rem; padding: 0.8rem; }
}
