/* ==========================================================================
                   CONTACT.CSS - Stanley BA Art
                   ========================================================================== */
                
                .contact-page {
                    padding: 50px 0 90px 0;
                }
                
                .contact-header {
                    text-align: center;
                    max-width: 700px;
                    margin: 0 auto 60px auto;
                }
                
                .contact-header h1 {
                    font-family: var(--font-heading);
                    font-size: 2.5rem;
                    font-weight: 500;
                    color: var(--text-dark);
                    margin-bottom: 15px;
                }
                
                .contact-header p {
                    font-size: 1rem;
                    color: #7a6e6b;
                    line-height: 1.6;
                }
                
                .contact-grid {
                    display: grid;
                    grid-template-columns: 1fr 1.3fr;
                    gap: 50px;
                    align-items: start;
                }
                
                /* Boîte d'informations */
                .contact-info-box {
                    background-color: #f7f4ef;
                    border: 1px solid var(--border-soft);
                    padding: 40px;
                    border-radius: 8px;
                }
                
                .contact-info-box h3 {
                    font-family: var(--font-heading);
                    font-size: 1.4rem;
                    color: var(--text-dark);
                    margin-bottom: 15px;
                }
                
                .contact-intro {
                    font-size: 0.95rem;
                    color: #7a6e6b;
                    line-height: 1.7;
                    margin-bottom: 30px;
                }
                
                .contact-details-list {
                    list-style: none;
                    padding: 0;
                    margin: 0 0 40px 0;
                }
                
                .contact-details-list li {
                    display: flex;
                    align-items: flex-start;
                    gap: 20px;
                    margin-bottom: 25px;
                }
                
                .contact-details-list li i {
                    font-size: 1.1rem;
                    color: var(--accent-terracotta);
                    margin-top: 3px;
                }
                
                .contact-details-list strong {
                    display: block;
                    font-size: 0.9rem;
                    color: var(--text-dark);
                    margin-bottom: 2px;
                }
                
                .contact-details-list span {
                    font-size: 0.85rem;
                    color: #7a6e6b;
                }
                
                .contact-socials-box span {
                    font-size: 0.8rem;
                    text-transform: uppercase;
                    letter-spacing: 2px;
                    color: var(--text-dark);
                    font-weight: 600;
                    display: block;
                    margin-bottom: 12px;
                }
                
                .social-icons {
                    display: flex;
                    gap: 12px;
                }
                
                .social-icons a {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    width: 36px;
                    height: 36px;
                    border-radius: 50%;
                    background-color: #ffffff;
                    border: 1px solid var(--border-soft);
                    color: var(--text-dark);
                    text-decoration: none;
                    transition: all 0.3s ease;
                }
                
                .social-icons a:hover {
                    background-color: var(--accent-terracotta);
                    color: #ffffff;
                    border-color: var(--accent-terracotta);
                }
                
                /* Boîte du formulaire */
                .contact-form-box {
                    background-color: #ffffff;
                    border: 1px solid var(--border-soft);
                    padding: 40px;
                    border-radius: 8px;
                    box-shadow: 0 10px 30px rgba(44, 37, 35, 0.03);
                }
                
                .form-group {
                    margin-bottom: 22px;
                }
                
                .form-group label {
                    display: block;
                    font-size: 0.85rem;
                    font-weight: 600;
                    text-transform: uppercase;
                    letter-spacing: 0.5px;
                    color: var(--text-dark);
                    margin-bottom: 8px;
                }
                
                .form-group input,
                .form-group textarea {
                    width: 100%;
                    padding: 14px 16px;
                    border: 1px solid var(--border-soft);
                    border-radius: 4px;
                    font-family: var(--font-sans);
                    font-size: 0.95rem;
                    color: var(--text-dark);
                    background-color: #fcfbfa;
                    transition: border-color 0.3s ease, background-color 0.3s ease;
                }
                
                .form-group input:focus,
                .form-group textarea:focus {
                    outline: none;
                    border-color: var(--accent-terracotta);
                    background-color: #ffffff;
                }
                
                .btn-submit {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    gap: 10px;
                    padding: 14px;
                    margin-top: 10px;
                }
                
                /* Alertes de succès / erreur */
                .alert-success {
                    text-align: center;
                    padding: 40px 20px;
                }
                
                .alert-success i {
                    font-size: 3rem;
                    color: #2e7d32;
                    margin-bottom: 15px;
                }
                
                .alert-success h3 {
                    font-family: var(--font-heading);
                    font-size: 1.5rem;
                    color: var(--text-dark);
                    margin-bottom: 10px;
                }
                
                .alert-success p {
                    color: #7a6e6b;
                    font-size: 0.95rem;
                }
                
                .alert-error {
                    background-color: #ffebee;
                    color: #c62828;
                    padding: 12px 16px;
                    border-radius: 4px;
                    font-size: 0.9rem;
                    margin-bottom: 25px;
                    display: flex;
                    align-items: center;
                    gap: 10px;
                }
                
                /* Responsive */
                @media (max-width: 900px) {
                    .contact-grid {
                        grid-template-columns: 1fr;
                        gap: 30px;
                    }
                }