/* =========================
   mentionslegales.css — responsive clean
   ========================= */

:root {
  /* Couleurs */
  --bg: #070707;
  --fg: #fbfaf9;
  --accent: #ff7300;

  /* Largeur de lecture */
  --content-max: 980px;

  /* Espacements */
  --pad-page: clamp(14px, 3vh, 34px);
  --gap-1: clamp(10px, 1.6vh, 16px);
  --gap-2: clamp(14px, 2.4vh, 24px);

  /* Titres et textes */
  --fs-h1: clamp(32px, 3.2vw + 1rem, 64px);
  --fs-h2: clamp(16px, 1.2vw + 0.9rem, 28px);

  /* Nom “Guillaume Mouleux” : remplace 10vw par clamp */
  --fs-name: clamp(64px, 10vw, 160px);

  --fs-ei: clamp(14px, 1.2vw + 0.6rem, 28px);
  --fs-legal: clamp(13px, 0.8vw + 0.65rem, 18px);

  /* Footer */
  --footer-h: clamp(44px, 6vh, 58px);
  --footer-fs: clamp(12px, 0.7vw + 0.6rem, 14px);
}

body {
  background-color: var(--bg);
}

/* Page */
.mentionslegales-container1 {
  width: 100%;
  min-height: 100svh;
  display: grid;
  grid-template-rows: 1fr var(--footer-h);
  align-items: center;
  justify-items: center;
  padding: var(--pad-page);
  background-color: var(--bg);
}

/* Contenu */
.mentionslegales-container2 {
  width: min(100%, var(--content-max));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--gap-1);
  text-align: center;
  overflow: visible;
}

/* Titres */
.mentionslegales-text10 {
  color: var(--fg);
  font-size: var(--fs-h1);
  line-height: 1.05;
}

.mentionslegales-text11 {
  color: var(--fg);
  font-size: var(--fs-h2);
  line-height: 1.2;
}

/* Nom + EI */
.mentionslegales-container3 {
  display: flex;
  align-items: baseline;
  justify-content: center;
  flex-wrap: wrap; /* évite les débordements si écran trop étroit */
}

.mentionslegales-text12 {
  color: var(--accent);
  font-size: var(--fs-name);
  max-width: 100%;
  font-family: "G-Manuscript", "Inter", system-ui, sans-serif;
  padding-right: 0;
  line-height: 1;
}

.mentionslegales-text13 {
  color: var(--fg);
  font-size: var(--fs-ei);
  max-width: none;
  line-height: 1;
}

/* Bloc legal */
.mentionslegales-text14 {
  color: var(--fg);
  width: 100%;
  max-width: 72ch; /* largeur de lecture confortable */
  font-size: var(--fs-legal);
  font-style: italic;
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 300;
  line-height: 1.45;
  padding: 0;
}

/* Footer */
.mentionslegales-footer {
  width: 100%;
  height: var(--footer-h);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0; /* on met juste le texte + span année qui suit */
  background-color: var(--bg);
  color: rgb(119, 119, 119);
  font-size: var(--footer-fs);
}

.mentionslegales-footer * {
  color: inherit;
}

/* Nettoyage wrappers teleport */
.mentionslegales-container4,
.mentionslegales-container5,
.mentionslegales-container7 {
  display: contents;
}