:root {
  --navy-950: #01152d;
  --navy-900: #042039;
  --navy-800: #0a2c4a;
  --navy-700: #15385b;
  --navy-600: #264b73;
  --gold-500: #b79044;
  --gold-400: #c9a460;
  --gold-300: #dcbc82;
  --gold-600: #97772f;
  --gold-700: #8b6a32;
  /* Sémantiques succès / erreur — utilisées pour les badges, status pills,
     hovers destructifs et bordures left de cartes. Les versions rgba(...)
     correspondantes restent hardcodées (rgba(76, 145, 80, 0.x) pour green,
     rgba(196, 69, 61, 0.x) pour red) — si tu changes les teintes ci-dessous,
     mets à jour ces rgba en parallèle. */
  --green-500: #4c9150;
  --red-500: #c4453d;
  --red-700: #a33933;
  --cream: #f5efe3;
  --cream-100: #fbf8f0;
  --cream-dark: #e8dfc9;
  --ink: #01152d;
  --muted: #566479;
  --line: rgba(183, 144, 68, 0.2);
  --line-strong: rgba(183, 144, 68, 0.42);
  --font-display: 'Cormorant Garamond', Georgia, serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: 'Manrope', sans-serif;
  background: var(--cream);
  color: var(--ink);
  line-height: 1.6;
  overflow-x: hidden;
  font-weight: 400;
  /* Protection : empêcher le scroll horizontal au niveau du body */
  max-width: 100%;
}

/* Protection globale : empêcher tout élément de dépasser le viewport */
html {
  overflow-x: hidden;
  max-width: 100%;
}

/* box-sizing universel — assure que padding/border n'ajoutent pas à la largeur */
*, *::before, *::after {
  box-sizing: border-box;
}

/* Images, vidéos, iframes : toujours respecter la largeur du conteneur.
   Exception : .hero-emblem-img qui doit rester carrée (width=height) pour
   garder son aspect circulaire avec border-radius:50%. */
img, video, iframe, svg, canvas {
  max-width: 100%;
  height: auto;
}

img.hero-emblem-img {
  /* Restaurer la dimension carrée définie par le composant lui-même */
  width: 100%;
  height: 100%;
}

/* Tableaux dans le contenu textuel */
table {
  max-width: 100%;
}

/* Garde-fou ultime sur mobile : aucun élément de premier niveau ne doit déborder */
@media (max-width: 768px) {
  body > *,
  body > main > *,
  .section > .section-inner > * {
    max-width: 100%;
  }
  /* Forcer les SVG décoratifs à respecter leur conteneur */
  svg:not([width]) {
    max-width: 100%;
  }
}

.display {
  font-family: 'StraightHyphen', 'Cormorant Garamond', serif;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.05;
}

/* Règle ultra-radicale : aucun <em> ne doit être italique sur le site */
em {
  font-style: normal !important;
  font-synthesis: none !important;
}

.eyebrow {
  font-family: 'Manrope', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gold-600);
}