/* ==========================================================================
   LCB - TAXI/VTC — feuille de base
   DA sombre et éditoriale (référence choisie par le client : taxiyaka.wixsite.com) :
   fond anthracite neutre, panneaux légèrement plus clairs, titres en Playfair
   Display, texte fin en Montserrat, photos en grands blocs. Le bleu de marque
   est réservé aux boutons d'appel et aux petits accents (filets, surtitres).
   ========================================================================== */

:root {
    /* Couleurs */
    --nuit: #121216;            /* fond de page */
    --panneau: #1B1B21;         /* blocs et cartes posés sur le fond */
    --panneau-2: #23232B;       /* survol / surface surélevée */
    --blanc: #FFFFFF;
    --texte: rgba(255, 255, 255, .84);
    --texte-2: rgba(255, 255, 255, .64);
    --texte-3: rgba(255, 255, 255, .45);
    --ligne: rgba(255, 255, 255, .11);
    --ligne-2: rgba(255, 255, 255, .22);
    --bleu: #2434B5;            /* bleu de marque, relevé pour tenir sur fond sombre */
    --bleu-fonce: #1C2897;      /* survol (le bleu d'origine) */
    --bleu-clair: #8FA0FF;      /* accent texte lisible sur fond sombre (7:1) */
    --encre: #121216;           /* texte sur bouton blanc */

    /* Typo */
    --serif: 'Playfair Display', 'Georgia', 'Times New Roman', serif;
    --sans: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;

    /* Échelle (base 17 px) */
    --t-xs: .8rem;
    --t-sm: .9rem;
    --t-md: 1.0625rem;
    --t-lg: 1.2rem;
    --t-xl: 1.5rem;
    --t-2xl: clamp(1.8rem, 3vw, 2.3rem);
    --t-3xl: clamp(2.2rem, 4.2vw, 3.3rem);
    --t-hero: clamp(2.5rem, 5.4vw, 4.6rem);

    /* Rythme */
    --gouttiere: clamp(1rem, 4vw, 2.5rem);
    --contenu: 1200px;
    --section: clamp(4rem, 9vw, 7.5rem);
    --rayon: 2px;
    --transition: 180ms ease;
    --ombre: 0 30px 60px -30px rgba(0, 0, 0, .8);
}

*, *::before, *::after { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: var(--sans);
    font-size: var(--t-md);
    font-weight: 300;
    line-height: 1.75;
    color: var(--texte);
    background: var(--nuit);
    -webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

:focus-visible {
    outline: 2px solid var(--bleu-clair);
    outline-offset: 3px;
}

h1, h2, h3, h4 {
    font-family: var(--serif);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -.005em;
    color: var(--blanc);
    margin: 0 0 .5em;
    text-wrap: balance;
}

h1 { font-size: var(--t-hero); }
h2 { font-size: var(--t-3xl); }
h3 { font-size: var(--t-xl); }
h4 { font-size: var(--t-lg); }

p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

strong { font-weight: 500; color: var(--blanc); }

ul, ol { margin: 0; padding: 0; list-style: none; }

.container {
    width: min(100% - 2 * var(--gouttiere), var(--contenu));
    margin-inline: auto;
}

.prose { max-width: 66ch; }

/* Surtitre : petite ligne en capitales espacées au-dessus des titres */
.surtitre {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    font-family: var(--sans);
    font-size: var(--t-xs);
    font-weight: 500;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--bleu-clair);
    margin-bottom: 1.1rem;
}
.surtitre::before {
    content: "";
    width: 2rem; height: 1px;
    background: currentColor;
}

/* Sections ---------------------------------------------------------------- */

.section { padding-block: var(--section); }
.section--panneau { background: var(--panneau); }
.section--filet { border-top: 1px solid var(--ligne); }

.section-tete {
    display: grid;
    gap: .75rem;
    max-width: 64ch;
    margin-bottom: clamp(2rem, 5vw, 3.5rem);
}
.section-tete h2 { margin: 0; }
.section-tete p { font-size: var(--t-lg); color: var(--texte-2); }
.section-tete--centree { margin-inline: auto; text-align: center; }
.section-tete--centree .surtitre { justify-content: center; }
.section-tete--centree .surtitre::before { display: none; }

.texte-secondaire { color: var(--texte-2); }
.texte-intro { font-size: var(--t-lg); line-height: 1.65; }

/* Utilitaires -------------------------------------------------------------- */

.visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0);
    white-space: nowrap; border: 0;
}

.nowrap { white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}