/* ==========================================================================
   DIRECTION ARTISTIQUE — harmonisation de tout le site
   Chargée en dernier sur les 11 pages. Elle aligne ce qui gardait l'ancien
   style (verre dépoli, boutons dégradés qui brillent et pulsent, pastilles
   en capitales espacées) sur le langage des sections refaites :
     · surfaces pleines #111F34, grands arrondis ;
     · bouton principal blanc, bouton secondaire sombre ;
     · accroches en casse de phrase, dans la couleur d'accent ;
     · titres très grands, serrés ; texte courant gris doux.
   ========================================================================== */
:root {
    --da-tuile: #111F34;
    --da-creux: #0B1629;
    --da-trait: rgba(255, 255, 255, 0.07);
    --da-doux: #8E9BB0;
    --da-clair: #F5F7FA;
}

/* ---------------------------------------------------------------- BOUTONS
   Plus de dégradé, de halo, de reflet qui passe ni de pulsation. */
.btn-primary,
.nav-links a.btn-nav {
    background: #FFFFFF;
    color: #0B1829;
    border: 0;
    box-shadow: none;
    animation: none;
    font-weight: 700;
}
.btn-primary::before, .btn-primary::after,
.nav-links a.btn-nav::before, .nav-links a.btn-nav::after { display: none; }
.btn-primary:hover,
.nav-links a.btn-nav:hover {
    background: #E8EEF7;
    color: #0B1829;
    opacity: 1;
    box-shadow: none;
    transform: translateY(-1px);
}
.btn-secondary {
    background: var(--da-tuile);
    color: var(--da-clair);
    border: 0;
}
.btn-secondary:hover { background: #18294A; color: #FFFFFF; border: 0; }
.nav-links a.nav-login {
    border: 0;
    background: rgba(255, 255, 255, 0.08);
    color: var(--da-clair);
}
.nav-links a.nav-login:hover { background: rgba(255, 255, 255, 0.16); color: #FFFFFF; box-shadow: none; }

/* ---------------------------------------------------------------- ACCROCHES
   Les pastilles en capitales espacées deviennent de simples accroches.
   Le texte est saisi en capitales dans le HTML : on le remet en casse de
   phrase. */
.hero-badge,
.section-tag {
    display: block;
    width: auto;
    padding: 0;
    margin-bottom: 12px;
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0;
    color: #93C5FD;
}
.hero-badge::before, .hero-badge::after { display: none; }

/* Les filets entre sections : un bloc sur deux en avait un. Le rythme
   vient maintenant des espacements, comme sur le reste. */
.gradient-divider { opacity: 0.35; }

/* ---------------------------------------------------------------- FAQ */
.faq-item {
    border: 0;
    border-radius: 20px;
    background: var(--da-tuile);
    margin-bottom: 10px;
}
.faq-item:hover { border: 0; }
.faq-item.active { border: 0; background: #14243C; }
.faq-question { padding: 22px 26px; font-size: 1.05rem; font-weight: 600; color: var(--da-clair); }
.faq-question:hover { background: none; }
.faq-icon { color: var(--da-doux); }
.faq-item.active .faq-icon { color: #93C5FD; }
.faq-answer p { padding: 0 26px 24px; font-size: 1rem; line-height: 1.6; color: var(--da-doux); }

/* ---------------------------------------------------------------- PIED DE PAGE */
footer { border-top: 1px solid var(--da-trait); }
.footer-col h4 { text-transform: none; letter-spacing: 0; font-size: 0.95rem; color: var(--da-clair); }
.footer-col a { color: var(--da-doux); font-size: 0.92rem; }
.footer-col a:hover { color: #FFFFFF; }
.footer-brand p { color: var(--da-doux); }
.footer-bottom { border-top: 1px solid var(--da-trait); }

/* ---------------------------------------------------------------- EN-TÊTES DE PAGE
   (Contact, Dashboard, À propos) */
.page-hero { padding-top: 150px; padding-bottom: 56px; }
.page-hero h1 {
    font-size: clamp(2.8rem, 6vw, 4.8rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.05em;
    margin-bottom: 20px;
}
.page-hero p, .page-hero-sub { font-size: 1.15rem; line-height: 1.55; color: var(--da-doux); }

/* ---------------------------------------------------------------- À PROPOS
   Ces blocs n'avaient aucun style : ils héritaient des valeurs par défaut. */
.about-content { max-width: 760px; margin: 0 auto; padding-bottom: 40px; }
.about-content h2 {
    margin: 56px 0 14px;
    font-size: clamp(1.7rem, 3vw, 2.2rem);
    font-weight: 800;
    letter-spacing: -0.035em;
    color: var(--da-clair);
}
.about-content h2:first-child { margin-top: 0; }
.about-content p { font-size: 1.08rem; line-height: 1.7; color: var(--da-doux); margin-bottom: 14px; }
.commitments-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-top: 22px; }
.commitment-item {
    padding: 26px 24px;
    border-radius: 22px;
    background: var(--da-tuile);
}
.commitment-item h3,
.commitment-item strong { display: block; margin: 0 0 8px; font-size: 1.12rem; font-weight: 700; letter-spacing: -0.02em; color: var(--da-clair); }
.commitment-item p { margin: 0; font-size: 0.95rem; line-height: 1.55; color: var(--da-doux); }

/* ---------------------------------------------------------------- PAGES LÉGALES
   CGV, mentions légales, confidentialité : une colonne de lecture sobre. */
.legal-content { max-width: 740px; padding: 150px 0 90px; }
.legal-content h1 {
    font-size: clamp(2.6rem, 5vw, 4rem);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.045em;
    margin-bottom: 40px;
}
.legal-content h2 {
    margin-top: 52px;
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.025em;
    color: var(--da-clair);
}
.legal-content p, .legal-content li { font-size: 1.02rem; line-height: 1.75; color: var(--da-doux); }
.legal-content ul li::before { background: #93C5FD; width: 5px; height: 5px; top: 11px; }
.legal-content a { color: #93C5FD; }
.legal-content strong { color: var(--da-clair); }

/* ---------------------------------------------------------------- CONNEXION */
.login-aura { display: none; }
.login-inner {
    background: var(--da-tuile);
    border: 0;
    border-radius: 30px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.7);
}
.login-inner::before { display: none; }
.login-emblem {
    background: linear-gradient(160deg, #26262A 0%, #000000 70%);
    border: 0;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14);
    border-radius: 22px;
}
.login-title { font-size: 2rem; letter-spacing: -0.04em; }
.login-sub { color: var(--da-doux); }
.login-group input {
    background: var(--da-creux);
    border: 1px solid var(--da-trait);
    border-radius: 14px;
}
.login-group input:focus { border-color: #3B82F6; box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.18); }
.login-submit,
.login-submit:hover {
    background: #FFFFFF;
    color: #0B1829;
    border-radius: 999px;
    font-weight: 700;
}
.login-submit:hover { background: #E8EEF7; }
.login-forgot, .login-signup a { color: #93C5FD; }
.login-trust { border-top: 1px solid var(--da-trait); }
.login-trust-item svg { stroke: #93C5FD; }

/* Les accroches s'affichent telles qu'écrites : l'ancien style les forçait
   en capitales. Le texte est désormais saisi en casse de phrase, ce qui
   garde les sigles intacts (« Plateforme IA tout-en-un »). */
.hero-badge,
.section-tag,
.uc-card-badge,
.uc-hero-badge,
.contact-booking-tag { text-transform: none; }
