/* =============================================
   TNC — CSS GLOBAL
   Anciennement : Custom CSS d'Elementor
   Indépendant d'Elementor, prêt pour migration
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@300;400;500&display=swap');


/* =============================================
   1. TYPOGRAPHIE GLOBALE
   ============================================= */

/* Corps de texte : DM Sans Light */
body, p, li, span, .tnc-faq-answer, .tag {
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 300 !important;
    font-size: clamp(0.95rem, 1vw + 0.7rem, 1.0625rem) !important;
    line-height: 1.7 !important;
    color: #1C1C1C !important;
}

/* H2 : Cormorant Garamond Medium */
h2,
.elementor-widget-heading h2.elementor-heading-title {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 500 !important;
    font-style: normal !important;
    color: #1C1C1C !important;
    font-size: clamp(1.75rem, 3.5vw, 2.5rem) !important;
    line-height: 1.2 !important;
    text-align: center;
    margin-bottom: 2rem;
}

/* H3 : Cormorant Garamond Italic */
h3,
.elementor-widget-heading h3.elementor-heading-title,
.tnc-faq-question {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 500 !important;
    font-style: italic !important;
    color: #BB2649 !important;
    font-size: clamp(1.2rem, 2vw, 1.45rem) !important;
    line-height: 1.4 !important;
}


/* =============================================
   2. COMPOSANTS — TAGS "POUR QUI"
   ============================================= */

.tnc-target-container {
    text-align: center;
    padding: 40px 10px;
    background-color: #F0EEE9;
}

.tnc-target-tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    max-width: 1000px;
    margin: 0 auto;
}

.tag {
    padding: 9px 18px;
    border: 1px solid #BB2649 !important;
    color: #BB2649 !important;
    background-color: transparent !important;
    border-radius: 4px;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 0.875rem !important;
    font-weight: 400 !important;
    transition: all 0.3s ease-in-out;
    cursor: default;
}

.tag:hover {
    background-color: #BB2649 !important;
    color: #F0EEE9 !important;
    transform: translateY(-3px);
}


/* =============================================
   3. COMPOSANTS — FAQ
   ============================================= */

.tnc-faq-wrapper {
    max-width: 900px;
    margin: 60px auto;
}

.tnc-faq-item {
    margin-bottom: 25px;
    border-bottom: 1px solid #D4C5BE;
    padding-bottom: 20px;
}

.tnc-faq-question {
    display: block;
    margin-bottom: 10px;
}

.tnc-faq-answer strong {
    color: #BB2649;
    font-weight: 500;
}

/* Eyebrow / labels en DM Sans uppercase */
.tnc-eyebrow {
    font-family: 'DM Sans', sans-serif !important;
    font-size: 0.7rem !important;
    font-weight: 400 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: #C4956A !important;
}


/* =============================================
   4. INTERACTIONS
   ============================================= */

/* Lévitation colonnes Elementor */
.elementor-column:hover {
    transform: translateY(-6px);
    transition: all 0.3s ease-in-out;
}

/* Liens */
a {
    color: #BB2649 !important;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease;
}

a:hover {
    border-bottom-color: #BB2649;
}

/* Boutons CTA principal */
.elementor-button.tnc-btn-primary,
.elementor-button-wrapper .elementor-button {
    background-color: #BB2649 !important;
    color: #F0EEE9 !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 12px 24px !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}

.elementor-button.tnc-btn-primary:hover,
.elementor-button-wrapper .elementor-button:hover {
    background-color: #1C1C1C !important;
    color: #F0EEE9 !important;
    transform: translateY(-2px) !important;
}

/* Bouton secondaire */
.elementor-button.tnc-btn-secondary {
    background-color: #C4956A !important;
    color: #1C1C1C !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 12px 24px !important;
    transition: background-color 0.2s ease !important;
}
