/* ==========================================================================
   SNL — Base typographique & utilitaires
   S'appuie sur les variables de tokens.css. Volontairement léger :
   la mise en page des pages est faite avec Elementor (Étape 2).
   ========================================================================== */

/* ---- Sécurité responsive : médias fluides, pas de débordement horizontal ---- */
img, svg, video, iframe { max-width: 100%; }
.snl img { height: auto; }
.snl, .snl * { box-sizing: border-box; }
/* Garde-fou global : empêche tout débordement horizontal (compatible tous navigateurs). */
html, body { max-width: 100%; overflow-x: hidden; }

/* ---- Typographie de base (s'applique hors conteneurs Elementor) ---- */
body {
  font-family: var(--snl-font-sans);
  color: var(--snl-charcoal);
  background-color: var(--snl-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Titres — référence DM Serif Display (cf. titre du hero slider) :
   700 · line-height 1.08 · letter-spacing -0.01em */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--snl-font-serif);
  color: var(--snl-charcoal);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.01em;
}

a {
  color: var(--snl-red);
  text-decoration: none;
}
a:hover { color: var(--snl-red-dark); }

/* Aucun soulignement sur AUCUN lien du site (demande client) — prioritaire pour
   battre le kit Elementor, le contenu d'article (the_content) et le thème parent. */
a,
a:link, a:visited, a:hover, a:focus, a:active,
.elementor a, .elementor a:hover,
.elementor-widget-text-editor a,
.snl a, .snl-prose a, .snl-article__content a, .snl-single__content a,
.entry-content a, .e-con a {
  text-decoration: none !important;
}

/* ---- Sélection texte aux couleurs de marque ---- */
::selection { background: var(--snl-red); color: #fff; }

/* ==========================================================================
   Utilitaires réutilisables (repris de la maquette Replit)
   ========================================================================== */

/* Section sombre — fond #0A0B0F, texte clair (hero, premium, stats, newsletter) */
.snl-dark {
  background-color: var(--snl-black);
  color: #fff;
}
.snl-dark h1, .snl-dark h2, .snl-dark h3,
.snl-dark h4, .snl-dark h5, .snl-dark h6 { color: #fff; }

/* "Eyebrow" / surtitre en Space Mono — ex. "À LA UNE", "CONTENUS PREMIUM" */
.snl-eyebrow {
  font-family: var(--snl-font-mono);
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--snl-red);
}

/* Titres éditoriaux serif (Playfair) */
.snl-display {
  font-family: var(--snl-font-serif);
  font-weight: 400;
  line-height: 1.05;
}

/* Texte mono générique (labels, métadonnées) */
.snl-mono {
  font-family: var(--snl-font-mono);
  text-transform: uppercase;
  letter-spacing: 0.15em;
}

/* ---- Marquee partenaires (repris de index.css Replit) ---- */
@keyframes snl-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.snl-marquee {
  display: inline-flex;
  animation: snl-marquee 40s linear infinite;
  white-space: nowrap;
}
.snl-marquee--fast { animation-duration: 30s; }

@media (prefers-reduced-motion: reduce) {
  .snl-marquee { animation: none; }
}

/* ==========================================================================
   Garde-fous Elementor : les Global Fonts du kit prennent le relais,
   mais on fournit un défaut cohérent si un widget n'hérite pas du kit.
   ========================================================================== */
.elementor-widget-heading .elementor-heading-title { font-family: var(--snl-font-serif); }