/* ==========================================================================
   VARIABLES ET POLICES (Héritées du Global)
   ========================================================================== */
:root {
    --noir: #0c0a08ff;
    --rouge-fonce: #832226ff;
    --rouge: #f93943;
    --turf: #1c7253ff;
    --emerald : #2cda9dff;
    --marine: #2b4570ff;
    --vert: #a9e5bbff;
    --lavande: #d8d4f2ff;
    --creme: #fefcf2ff;
    --blanc: #ffffffff;
    --jasmine: #FFEE88;
    --icterine: #fcfc62;
    --bleu-nuit: #1c2e4a;
    --bleu-gris: #95A1B1;
    --font-main: 'Montserrat', sans-serif;
    --font-titles: 'Inter', sans-serif;
}

@font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 500; src: url('../fonts/montserrat-v30-latin-500.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 600; src: url('../fonts/montserrat-v30-latin-600.woff2') format('woff2'); }

/* ==========================================================================
   ACCUEIL V3 - STYLES SPÉCIFIQUES
   ========================================================================== */

/* --- CHARTE GRAPHIQUE (Classes Personnalisées) --- */
/* Boutons Rouges (Marque) */
.btn-cw-rouge {
    background-color: var(--rouge) !important;
    border-color: var(--rouge) !important;
    color: #fff !important;
}

.btn-cw-rouge:hover {
    background-color: var(--creme) !important;
    border-color: var(--creme) !important;
    color: var(--rouge) !important;
}

/* Textes et Icônes rouges */
.text-cw-rouge {
    color: var(--rouge) !important;
}

/* Badges et fonds rouges */
.bg-cw-rouge {
    background-color: var(--rouge) !important;
    color: #fff !important;
}

/* --- HERO SECTION --- */
.hero-section {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 2rem 2%;
    margin-top: 0;
    min-height: calc(100vh - 80px);
}

/* Force le style de la marque dans la navbar (pas de global CSS sur la homepage) */
.navbar-brand {
    color: var(--creme) !important;
    font-size: 1.4rem;
    font-weight: 500;
}
.navbar-brand span {
    color: var(--creme) !important;
}
.navbar-brand span.text-cw-rouge {
    color: var(--rouge) !important;
}

/* Nom de marque au-dessus du H1 */
.marque-nom {
    font-family: var(--font-main);
    font-size: 5rem;
    font-weight: 600;
    color: var(--creme) !important;
    letter-spacing: 2px;
}

/* Titre Principal H1 */
.hero-section h1 {
    font-family: var(--font-main);
    color: var(--rouge) !important;
    font-size: 3.5rem;
    line-height: 1.2;
    font-weight: 500;
    white-space: nowrap;
}

/* Boîte pour les titres */
.header-content {
    background-color: rgba(12, 10, 8, 0.5); 
    backdrop-filter: blur(.5rem); 
    border: 1px solid rgba(255, 255, 255, 0.1); 
    border-radius: .5rem;
    padding: 1.5rem 2rem;
}

/* Phrase de qualification (Cible) */
.qualification-cible {
    font-size: 1.5rem;
    color: var(--rouge) !important;
    font-weight: 400;
    letter-spacing: 0.7px;
    /* margin-bottom: 2rem;*/
}

/* --- BANDEAU AUTORITÉ (Preuve Sociale) --- */
.bandeau-autorite {
    padding: 1rem 0;
}

.bandeau-autorite .stat-icon {
    font-size: 1.3rem;
    color: var(--creme);
    margin-right: 0.4rem;
}

.bandeau-autorite .stat-number {
    font-size: 1.5rem;
    color: var(--creme) !important;
    font-weight: 700;
}

.bandeau-autorite .stat-label {
    opacity: 0.85;
    color: var(--creme) !important;
    font-size: 0.85rem;
    line-height: 1.2;
}


/* --- BLOCS CTA PREMIUM (Offres) --- */
.cta-block-premium {
    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 1.5rem 1.25rem;
    background-color: rgba(12, 10, 8, 0.35);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-top: 3px solid var(--rouge);
    border-radius: .5rem;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
    text-decoration: none;
}

.cta-block-premium .cta-top {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* État Survol */
.cta-block-premium:hover {
    transform: translateY(-5px);
    background-color: rgba(12, 10, 8, 0.15);
    border-color: #fff !important;
    box-shadow: 0 0 10px 3px rgba(255, 255, 255, 0.2);
}

.cta-block-premium:hover h3,
.cta-block-premium:hover .cta-icon,
.cta-block-premium:hover .cta-description {
    color: #fff !important;
}

.cta-block-premium .cta-icon {
    width: 35px;
    text-align: center;
    font-size: 1.6rem;
    color: var(--rouge);
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.cta-block-premium:hover .cta-icon {
    transform: scale(1.1);
}

.cta-block-premium h3 {
    font-size: 1.15rem;
    font-weight: 600;
    margin: 0;
    color: var(--creme);
    letter-spacing: -0.2px;
    font-family: var(--font-main);
}

.cta-block-premium .cta-description {
    font-size: 0.85rem;
    color: rgba(254, 252, 242, 0.7);
    margin: 0;
    font-weight: 400;
}

.cta-block-premium:hover .cta-description {
    color: rgba(254, 252, 242, 0.9);
}

.cta-block-premium .cta-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    margin-top: 0.75rem;
    padding-top: 0.6rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 0.8rem;
    font-weight: 500;
    color: rgba(254, 252, 242, 0.5);
    transition: all 0.3s ease;
}

.cta-block-premium:hover .cta-footer {
    color: #fff;
}


/* --- RESPONSIVE --- */
/* Grands écrans : limiter la largeur des blocs CTA */
@media (min-width: 1400px) {
    .hero-section .row.justify-content-center {
        max-width: 70vw;
        margin-left: auto;
        margin-right: auto;
    }
    .marque-nom {
        font-size: 4vw;
    }
    .hero-section h1 {
        font-size: 2.8vw;
    }
}

/* Tablette : ajustement texte pour grille 2x2 */
@media (min-width: 768px) and (max-width: 991px) {
    .cta-block-premium h3 { font-size: 1rem; }
    .cta-block-premium .cta-description { font-size: 0.8rem; }
    .cta-block-premium .cta-icon { font-size: 1.3rem; width: 30px; }
    .cta-block-premium { padding: 1rem; }
    .cta-block-premium .cta-top { gap: 0.75rem; }
}

@media (max-width: 767px) {
    .hero-section { margin-top: -2.5rem; }
    .marque-nom { font-size: 2rem; }
    .hero-section h1 { font-size: 1.5rem; white-space: normal; }
    .qualification-cible { font-size: 0.9rem; margin-bottom: 1.5rem; }
    .bandeau-autorite { padding: 0.75rem 0; margin: 1rem 0; }
    .bandeau-autorite .stat-number { font-size: 1.2rem !important; }
    .bandeau-autorite .stat-label { font-size: 0.7rem !important; }
    .cta-block-premium { padding: 1rem; }
    .cta-block-premium h3 { font-size: 1rem; }
}

/* ==========================================================================
   FOOTER & CONTACT BAR ADAPTATION (REMPLACE BG-LIGHT)
   ========================================================================== */

/* Ciblage précis pour transformer le bg-light (blanc) en thème sombre sur la home */
body .content-wrapper .bg-light {
    background-color: transparent !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important; /* Force la bordure */
    color: var(--creme) !important;
}

/* Suppression de la marge spécifique au footer pour le coller à la barre */
body .content-wrapper footer.bg-light {
    margin-top: 0 !important;
}

/* Adaptation des textes gris (muted) en blanc cassé */
body .content-wrapper .bg-light .text-muted {
    color: rgba(254, 252, 242, 0.7) !important;
}

/* Hover rouge sur les liens */
body .content-wrapper .bg-light a.text-muted:hover {
    color: var(--rouge) !important;
    text-decoration: none;
}

/* Titres du footer */
body .content-wrapper .bg-light .footer-title {
    color: var(--creme) !important;
    opacity: 0.9;
}

/* Logo dans le footer : inversion pour le rendre blanc */
body .content-wrapper .bg-light img {
    filter: brightness(0) invert(1);
    opacity: 0.8;
}