/* ===========================================================================
   Thème « Charte officielle » — complément structurel
   ---------------------------------------------------------------------------
   Reprise de l'identité visuelle remise par le studio. Chargé après app.css
   uniquement quand ce thème est sélectionné.

   Les couleurs et la pile typographique sont des jetons, déclarés dans
   App\Theming\ThemeRegistry. Ce fichier ne porte que ce qu'un jeton ne peut
   pas exprimer : les fichiers de police, le traitement du nom en italique et
   le bandeau sombre.

   ⚠️ Poppins est hébergée ici même (public/fonts) et non chargée depuis
   Google Fonts : un appel à fonts.googleapis.com transmettrait l'adresse IP
   de chaque visiteur à un tiers, sans base légale ni consentement.
   Licence SIL OFL 1.1 — voir public/fonts/POPPINS-OFL.txt.
   =========================================================================== */

/* --- Poppins, servie par le site ------------------------------------------ */
/* `swap` : le texte s'affiche tout de suite dans la police de repli, puis
   bascule. Mieux vaut un empattement qui change qu'un écran blanc. */

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/poppins-300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/poppins-300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+1E00-1EFF, U+2020, U+20A0-20AB, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/poppins-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/poppins-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+1E00-1EFF, U+2020, U+20A0-20AB, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/poppins-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/poppins-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+1E00-1EFF, U+2020, U+20A0-20AB, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+1E00-1EFF, U+2020, U+20A0-20AB, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Italique gras : réservé au nom, comme sur le logotype. */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins-700-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins-700-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+1E00-1EFF, U+2020, U+20A0-20AB, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* --- Graisses de la charte : Bold pour les titres, Light pour le corps ----- */
body { font-weight: 300; }
h1, h2, h3, h4 { font-weight: 700; letter-spacing: -0.01em; }
strong, b, th { font-weight: 600; }

/* --- Logotype : LAMBEC bleu, TRANS EXPRESS orange, le tout en italique ----- */
/* Traitement typographique tant qu'aucun fichier de logo n'est déposé.
   Dès qu'une image l'est, elle prend la place et ces règles ne s'appliquent
   plus (le composant bascule sur <img>). */
.logo__wordmark {
  font-style: italic;
  font-weight: 700;
  /* Le logotype de la charte est en capitales. */
  text-transform: uppercase;
  letter-spacing: -0.01em;
  color: var(--ltx-accent);
}
.logo__wordmark-strong { color: var(--ltx-navy); }
/* Sur aplat sombre, le premier mot passe au blanc et le second garde
   l'orange. Ces sélecteurs doublent la spécificité de la règle d'app.css qui
   met tout le nom en blanc, sans quoi le logotype perdrait ses deux tons. */
.site-header .logo__wordmark-strong,
.logo--inverted .logo__wordmark-strong { color: var(--ltx-on-navy); }
.site-header .logo__wordmark,
.logo--inverted .logo__wordmark { color: var(--ltx-accent); }

/* --- Bandeau sombre à liseré orange --------------------------------------- */
.site-header {
  background: var(--ltx-surface-navy);
  border-bottom: 3px solid var(--ltx-accent);
}
.site-header .logo,
.site-header__phone { color: var(--ltx-on-navy); }
.site-header__tagline { color: rgba(255, 255, 255, 0.7); }

.site-nav__link { color: var(--ltx-on-navy); font-weight: 600; }
.site-nav__link:hover,
.site-nav__link--current { color: var(--ltx-accent); }

/* --- Bannière : aplat bleu, photo en fond si elle est déposée -------------- */
.hero {
  padding-block: var(--ltx-space-16);
  background: linear-gradient(rgba(15, 47, 95, 0.9), rgba(15, 47, 95, 0.9)),
              var(--ltx-hero-image, none) center / cover no-repeat,
              var(--ltx-navy);
  color: var(--ltx-on-navy);
  text-align: center;
  /* Le bloc vit dans .container : on déborde jusqu'aux bords de la fenêtre
     sans toucher à la largeur de lecture du texte. */
  box-shadow: 0 0 0 100vmax var(--ltx-navy);
  clip-path: inset(0 -100vmax);
  margin-bottom: 0;
}
.hero__title { color: var(--ltx-on-navy); max-width: none; }
.hero__lead {
  color: rgba(255, 255, 255, 0.88);
  max-width: 50rem;
  margin-inline: auto;
}
.hero__eyebrow { color: var(--ltx-accent); }
.hero__actions { justify-content: center; }

.hero .badge-list { justify-content: center; }
.hero .badge {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 20px;
  padding: 0.5rem 1rem;
  color: var(--ltx-on-navy);
}

/* --- Titres de section centrés, soulignés d'un trait orange ---------------- */
.section h2,
.form-section h2 { text-align: center; }
.section h2::after,
.form-section h2::after {
  content: '';
  display: block;
  width: 50px;
  height: 3px;
  margin: 0.65rem auto 0;
  background: var(--ltx-accent);
}
.section__intro { text-align: center; margin-inline: auto; }

/* --- Cartes : liseré orange à gauche --------------------------------------- */
.card {
  background: var(--ltx-surface);
  border: 1px solid var(--ltx-border);
  border-left: 4px solid var(--ltx-accent);
  box-shadow: 0 4px 6px rgba(15, 47, 95, 0.06);
}

/* --- Zone d'intervention : encart bleu ------------------------------------- */
.zone-grid {
  background: var(--ltx-navy);
  color: var(--ltx-on-navy);
  border-left: 6px solid var(--ltx-accent);
  border-radius: var(--ltx-radius);
  padding: var(--ltx-space-8);
}
.zone__heading { color: var(--ltx-accent); }
.zone-grid .tag {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.28);
  color: var(--ltx-on-navy);
}
.zone-grid .tag--accent { border-color: var(--ltx-accent); color: var(--ltx-accent); }

/* --- Boutons : orange plein, arrondi --------------------------------------- */
.btn { font-weight: 600; }
.btn--primary {
  background: var(--ltx-accent);
  border-color: var(--ltx-accent);
  /* La charte montre du blanc sur l'orange : 2,8:1, sous le seuil de
     lisibilité. --ltx-on-accent retient la teinte qui passe. */
  color: var(--ltx-on-accent);
}
.btn--primary:hover:not(:disabled) {
  background: var(--ltx-accent-dark);
  border-color: var(--ltx-accent-dark);
  color: var(--ltx-on-accent);
}
.hero .btn--secondary {
  color: var(--ltx-on-navy);
  border-color: rgba(255, 255, 255, 0.45);
  background: transparent;
}
.hero .btn--secondary:hover:not(:disabled) {
  border-color: var(--ltx-on-navy);
  background: rgba(255, 255, 255, 0.08);
}

/* --- Pied de page ---------------------------------------------------------- */
.site-footer { border-top: 3px solid var(--ltx-accent); }

@media (prefers-reduced-motion: no-preference) {
  .site-nav__link,
  .btn { transition: color 200ms ease, background-color 200ms ease, border-color 200ms ease; }
}