/* ============================================================ CORRECTIFS MOBILE — etirementsdanses.fr À ajouter dans APRÈS le CSS principal : ============================================================ */ @media (max-width: 767px) { /* Marges latérales globales plus généreuses */ .container { padding: 0 24px; } /* Sections : réduire le padding vertical sur mobile */ .section { padding: 50px 0; } /* Titres de section : taille réduite sur petits écrans */ .section-title { font-size: 2rem; margin-bottom: 36px; } /* Hero intro : plus d'air sur les côtés */ .hero-intro { padding: 40px 24px 24px; } /* Grilles : forcer une seule colonne et espacements corrects */ .locations-grid, .sessions-grid, .planning-grid, .tarifs-grid, .lieux-pratique-grid, .photos-grid, .benefits-grid { padding: 0 8px; } /* Tarifs : éviter que les cartes débordent */ .tarif-card { margin: 0 4px; } /* Footer : espacements */ .footer-container { padding: 0 24px; gap: 28px; } /* Contact layout : padding interne */ .contact-layout { padding: 0 8px; } /* Formulaires : champs pleine largeur avec marge */ form input, form textarea, form select { width: 100%; box-sizing: border-box; } } @media (max-width: 480px) { /* Très petits écrans : encore un peu plus de marge */ .container { padding: 0 20px; } .section-title { font-size: 1.7rem; } }