/* ============================================
   AMÉLIORATIONS FINALES - ACTION 95
============================================ */

/* "La forme" en outline plus gros */
.word-outline-violet-large {
    color: transparent;
    -webkit-text-stroke: 2px #8DA8FC;
    text-stroke: 2px #8DA8FC;
    font-weight: 900;
    font-size: 1.1em; /* 10% plus gros */
    text-shadow: 0 0 20px rgba(141, 168, 252, 0.3);
}

/* "Quelques K" version réduite sous VISAGES */
.quelques-k-section-small {
    padding: 30px 0; /* Réduit de 80px à 30px */
    background: var(--night-blue);
}

.quelques-k-link-small {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.quelques-k-text-small {
    font-family: var(--font-display);
    font-size: clamp(24px, 3vw, 36px); /* Plus petit : 24-36px */
    font-weight: 700;
    text-transform: uppercase;
    color: rgba(249, 249, 255, 0.7);
    letter-spacing: 0.05em;
}

.quelques-k-logo-small {
    width: clamp(30px, 4vw, 45px); /* Logo réduit */
    height: auto;
    filter: drop-shadow(0 0 15px rgba(167, 226, 255, 0.4));
    transition: all 0.3s ease;
}

.quelques-k-link-small:hover .quelques-k-text-small {
    color: #F9F9FF;
}

.quelques-k-link-small:hover .quelques-k-logo-small {
    filter: drop-shadow(0 0 25px rgba(167, 226, 255, 0.6))
            drop-shadow(0 0 40px rgba(167, 226, 255, 0.4));
    transform: scale(1.05);
}

/* "Quelques cas" avec halo dégradé */
.quelques-k-text-with-halo {
    position: relative;
    display: inline-block;
    font-size: clamp(36px, 5vw, 60px); /* Plus petit */
    color: #F9F9FF;
    font-weight: 900;
    text-transform: uppercase;
    z-index: 2;
}

.quelques-k-text-with-halo::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120%;
    height: 150%;
    background: linear-gradient(135deg, 
        rgba(141, 168, 252, 0.4) 0%,      /* Bleu violet */
        rgba(167, 226, 255, 0.4) 25%,     /* Bleu icid */
        rgba(150, 232, 200, 0.4) 50%,     /* Vert */
        rgba(255, 112, 174, 0.4) 75%,     /* Rose */
        rgba(141, 168, 252, 0.4) 100%     /* Retour bleu */
    );
    border-radius: 50%;
    filter: blur(40px);
    opacity: 0.6;
    z-index: -1;
    transition: all 0.4s ease;
}

.quelques-k-link:hover .quelques-k-text-with-halo::before {
    filter: blur(50px);
    opacity: 0.9;
    width: 130%;
    height: 160%;
}

.quelques-k-title {
    font-size: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Titre CONTACT en H1 avec dégradé centré */
.contact-main-title-gradient {
    font-family: var(--font-display);
    font-size: clamp(24px, 4vw, 42px);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    text-align: center;
    margin: 0 0 20px 0;
    background: linear-gradient(135deg, 
        #8DA8FC 0%,      /* Bleu violet */
        #95B0F9 15%,
        #A7E2FF 35%,     /* Bleu icid */
        #96E8C8 55%,     /* Vert */
        #FF70AE 75%,     /* Rose */
        #F9F9FF 100%     /* Blanc */
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1.1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Tagline centré sous CONTACT */
.contact-tagline-center {
    font-family: var(--font-body);
    font-size: clamp(18px, 2.5vw, 24px);
    font-weight: 400;
    color: rgba(249, 249, 255, 0.7);
    text-align: center;
    margin: 0 0 60px 0;
    line-height: 1.5;
}

/* Layout contact centré - Override du grid */
.contact-layout {
    display: block !important; /* Override grid */
    grid-template-columns: unset !important;
    max-width: 900px;
    margin: 0 auto;
    width: 100%;
}

/* Wrapper formulaire */
.contact-form-wrapper {
    max-width: 900px;
    margin: 0 auto;
    width: 100%;
}

/* Formulaire élargi */
.contact-form {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: block;
}

/* Titre H2 formulaire */
.contact-form-title {
    font-family: var(--font-display);
    font-size: clamp(24px, 3vw, 36px);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #F9F9FF;
    text-align: center;
    margin: 0 0 40px 0;
}

/* Halos sur les photos des visages */
.equipe-photo {
    position: relative;
}

.equipe-photo img {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 0 0px rgba(0, 0, 0, 0));
    transition: filter 0.4s ease, transform 0.4s ease;
}

/* Halos par couleur (data-halo) */
.equipe-member[data-halo="pink"] .equipe-photo img {
    filter: drop-shadow(0 10px 30px rgba(255, 112, 174, 0.3));
}

.equipe-member[data-halo="pink"]:hover .equipe-photo img {
    filter: drop-shadow(0 15px 40px rgba(255, 112, 174, 0.5))
            drop-shadow(0 5px 20px rgba(255, 112, 174, 0.4));
    transform: translateY(-5px);
}

.equipe-member[data-halo="green"] .equipe-photo img {
    filter: drop-shadow(0 10px 30px rgba(150, 232, 200, 0.3));
}

.equipe-member[data-halo="green"]:hover .equipe-photo img {
    filter: drop-shadow(0 15px 40px rgba(150, 232, 200, 0.5))
            drop-shadow(0 5px 20px rgba(150, 232, 200, 0.4));
    transform: translateY(-5px);
}

.equipe-member[data-halo="violet"] .equipe-photo img {
    filter: drop-shadow(0 10px 30px rgba(141, 168, 252, 0.3));
}

.equipe-member[data-halo="violet"]:hover .equipe-photo img {
    filter: drop-shadow(0 15px 40px rgba(141, 168, 252, 0.5))
            drop-shadow(0 5px 20px rgba(141, 168, 252, 0.4));
    transform: translateY(-5px);
}

.equipe-member[data-halo="cyan"] .equipe-photo img {
    filter: drop-shadow(0 10px 30px rgba(167, 226, 255, 0.3));
}

.equipe-member[data-halo="cyan"]:hover .equipe-photo img {
    filter: drop-shadow(0 15px 40px rgba(167, 226, 255, 0.5))
            drop-shadow(0 5px 20px rgba(167, 226, 255, 0.4));
    transform: translateY(-5px);
}

/* Séparateur respiration */
.respiration-separator-section {
    padding: 40px 0;
}

.respiration-separator-line {
    width: 100%;
    max-width: 200px;
    height: 2px;
    background: linear-gradient(
        to right,
        transparent 0%,
        rgba(249, 249, 255, 0.2) 10%,
        rgba(249, 249, 255, 0.4) 50%,
        rgba(249, 249, 255, 0.2) 90%,
        transparent 100%
    );
    margin: 0 auto;
}

/* Responsive */
@media (max-width: 768px) {
    .word-outline-violet-large {
        font-size: 1.05em; /* Légèrement moins gros sur mobile */
    }
    
    .quelques-k-section-small {
        padding: 20px 0;
    }
    
    .quelques-k-text-small {
        font-size: clamp(20px, 5vw, 28px);
    }
    
    .quelques-k-logo-small {
        width: clamp(25px, 6vw, 35px);
    }
    
    .quelques-k-text-with-halo {
        font-size: clamp(28px, 7vw, 48px);
    }
    
    .quelques-k-text-with-halo::before {
        width: 130%;
        height: 160%;
        filter: blur(30px);
    }
    
    .contact-main-title-gradient {
        font-size: clamp(20px, 6vw, 32px);
        margin-bottom: 15px;
    }
    
    .contact-tagline-center {
        font-size: clamp(16px, 4vw, 20px);
        margin-bottom: 40px;
    }
    
    .contact-form-wrapper,
    .contact-layout,
    .contact-form {
        max-width: 100%;
        padding: 0 20px;
    }
    
    .contact-form-title {
        font-size: clamp(20px, 5vw, 28px);
        margin-bottom: 30px;
    }
    
    .respiration-separator-section {
        padding: 30px 0;
    }
    
    .respiration-separator-line {
        max-width: 150px;
        height: 1.5px;
    }
}