/* ====================== BASE ======================
   Reset + typographie + micro-détails propres
   =================================================== */
*, *::before, *::after { box-sizing: border-box; }

/* ANTI-SCROLL-HORIZONTAL obligatoire (PIEGE PROD #11 : jamais overscroll-behavior:none sur body/html) */
html {
  overflow-x: clip;
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-h-mobile);
  -webkit-text-size-adjust: 100%;
}
@media (min-width: 768px) {
  html { scroll-padding-top: var(--header-h); }
}

body {
  margin: 0;
  overflow-x: clip; /* clip = pas de conteneur de scroll, anti-PIEGE #11 */
  background-color: var(--bg);
  color: var(--text);
  font-family: var(--ff-body);
  font-size: 1rem;
  line-height: 1.65;
  max-width: 100vw;
}

/* [hidden] DOIT être display:none pour ne pas être écrasé (PIEGE PROD #8) */
[hidden] { display: none !important; }

/* Reset figures (PIEGE PROD #5 : sans ça la marge UA déborde) */
figure { margin: 0; }

/* Images, vidéos, iframes responsives */
img, video, iframe { max-width: 100%; display: block; }

/* Reset listes */
ul, ol { margin: 0; padding: 0; list-style: none; }

/* Titres reset */
h1, h2, h3, h4, h5, h6 { margin: 0; line-height: 1.1; }

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

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Focus visible accessible */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 3px;
}

/* Placeholder */
::placeholder { color: var(--text-mute); opacity: 1; }

/* DM Sans + Cormorant Garamond depuis Google Fonts (déclarés dans HTML) */
/* Tailles fluides */
h1 { font-family: var(--ff-display); font-size: clamp(2.4rem, 6vw, 4.4rem); font-weight: 500; }
h2 { font-family: var(--ff-display); font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 500; }
h3 { font-family: var(--ff-display); font-size: clamp(1.3rem, 2.5vw, 1.7rem); font-weight: 500; }
h4 { font-family: var(--ff-display); font-size: clamp(1.1rem, 2vw, 1.35rem); font-weight: 500; }

/* Italique Cormorant signature */
em { font-style: italic; }

/* Corps de texte minimum 16px mobile (REGLE MOBILE #4) */
body { font-size: clamp(1rem, 1.6vw, 1.06rem); }

/* Bouton reset */
button {
  font-family: inherit;
  font-size: inherit;
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  color: inherit;
}