/* ============================================================================
   Responsive Design & Media Queries
   ============================================================================ */

@media (max-width: 1024px) {
    h1 { font-size: clamp(2.5rem, 8vw, 8rem); }
    h2 { font-size: clamp(2rem, 6vw, 6rem); }
    h3 { font-size: clamp(1.5rem, 4vw, 3rem); }
}

@media (max-width: 768px) {
    :root { --container-padding: 1rem; }

    h1 { font-size: clamp(2rem, 6vw, 6rem); }
    h2 { font-size: clamp(1.75rem, 5vw, 4rem); }
    h3 { font-size: clamp(1.25rem, 3vw, 2rem); }

    .navbar { padding: 1rem 1.5rem; }

    .hero {
        min-height: auto;
        padding: 6rem 1.5rem 3rem;
        margin-top: 5rem;
    }

    /* Canard hero : masqué sur mobile */
    .hero-duck {
        display: none;
    }

    .hero h1 { margin-bottom: 1.5rem; }
    .tagline { font-size: 0.875rem; margin-bottom: 2rem; }
    .hero-description { font-size: 1rem; }

    .manifesto { padding: 5rem 1.5rem; }
    .manifesto-grid { gap: 2rem; }
    .manifesto-text { grid-template-columns: 1fr; gap: 1.5rem; }

    .expertise { padding: 5rem 1.5rem; }
    .expertise-header { gap: 2rem; }
    .expertise-description { max-width: 100%; }

    .ia-factory { padding: 5rem 1.5rem; }
    .ia-grid { gap: 2.5rem; }
    .ia-description { max-width: 100%; }

    .coaching { padding: 5rem 1.5rem; }
    .coaching-header { gap: 2rem; }
    .coaching-content { gap: 2rem; }

    .contact { padding: 5rem 1.5rem; }
    .contact-grid { gap: 2.5rem; }

    .footer { padding: 3rem 1.5rem 1.5rem; }

    .floating-circle-1,
    .floating-circle-2 { display: none; }
}

@media (max-width: 640px) {
    h1 { font-size: clamp(1.75rem, 5vw, 4rem); }
    h2 { font-size: clamp(1.5rem, 4vw, 3rem); }
    h3 { font-size: clamp(1rem, 2.5vw, 1.75rem); }

    .navbar { padding: 0.875rem 1rem; }

    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .hero {
        min-height: 60vh;
        padding: 5rem 1rem 2rem;
        margin-top: 4rem;
    }

    .hero h1 { margin-bottom: 1rem; }
    .tagline { font-size: 0.75rem; margin-bottom: 1.5rem; }
    .cta-group { width: 100%; }

    .floating-badge {
        width: 4rem;
        height: 4rem;
        border-width: 3px;
    }

    .manifesto { padding: 3rem 1rem; }
    .manifesto-title { font-size: 2rem; }
    .manifesto-text { font-size: 1rem; }

    .expertise { padding: 3rem 1rem; }
    .expertise-header { margin-bottom: 3rem; }
    .octogone-title { font-size: 1.75rem; }
    .expertise-description { font-size: 1rem; }
    .services-grid { gap: 1.5rem; }

    .service-card { padding: 1.5rem; }
    .service-card h3 { font-size: 1.5rem; margin-bottom: 1rem; }

    .ia-factory { padding: 3rem 1rem; }
    .ia-factory h2 { font-size: 1.75rem; }
    .contact-box { padding: 1.5rem; }

    .coaching { padding: 3rem 1rem; }
    .coaching-title { font-size: 1.75rem; }
    .coaching-intro { font-size: 1rem; }
    .coaching-details { gap: 1rem; }

    .contact { padding: 3rem 1rem; }
    .contact h2 { font-size: 1.75rem; }
    .contact-details { gap: 1.5rem; }
    .form-group { gap: 0.375rem; }
}

@media (max-width: 480px) {
    :root { font-size: 15px; }

    h1 { font-size: 1.75rem; }
    h2 { font-size: 1.5rem; }
    h3 { font-size: 1.125rem; }

    .navbar { padding: 0.75rem; }

    .hero {
        min-height: 50vh;
        padding: 4rem 0.75rem 1.5rem;
    }

    .services-grid { gap: 1.25rem; }
}