/* Vesperian — legal pages (mentions légales, confidentialité) */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/inter-latin-var.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --white: #FFFFFF;
  --ink: #111111;
  --muted: #888888;
  --border: #E8E8E8;
  --surface-dark: #0A0A0A;
  --font: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; }
body { font-family: var(--font); background: var(--white); color: var(--ink); min-height: 100vh; display: flex; flex-direction: column; }
a { color: inherit; text-decoration: none; }

/* Language: without JS both versions show (FR then EN); JS keeps the active one */
html[data-active-lang="fr"] [data-l="en"],
html[data-active-lang="en"] [data-l="fr"] { display: none !important; }

/* ── Nav ── */
.legal-nav {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 20px 48px; border-bottom: 1px solid var(--border);
}
.legal-nav__actions { display: flex; align-items: center; gap: 20px; }
.back-link { font-size: 14px; color: var(--ink); letter-spacing: -0.01em; transition: color 0.2s ease; }
.back-link:hover { color: var(--muted); }
.lang-toggle {
  font-size: 12px; font-weight: 500; letter-spacing: 0.08em; padding: 6px 14px;
  border-radius: 9999px; border: 1px solid rgba(0,0,0,0.25); color: var(--ink);
  background: transparent; cursor: pointer; font-family: var(--font);
  transition: border-color 0.2s, background 0.2s;
}
.lang-toggle:hover { border-color: var(--ink); background: rgba(0,0,0,0.05); }
html:not([data-active-lang]) .lang-toggle { display: none; }

/* ── Brand (same block as the home page, static) ── */
.brand {
  --brand-mark-h: 40px; --brand-gap: 15px; --brand-sep-h: 40px;
  --brand-word-size: 17px; --brand-word-track: 0.31em;
  --brand-base-size: 8.5px; --brand-base-track: 0.1em;
  display: inline-flex; align-items: center; gap: var(--brand-gap);
  color: var(--ink); line-height: 1; flex-shrink: 0;
}
.brand__mark { display: block; height: var(--brand-mark-h); width: auto; aspect-ratio: 152 / 134; flex-shrink: 0; }
.brand__sep { display: block; width: 1px; height: var(--brand-sep-h); background: currentColor; opacity: 0.22; }
.brand__text { display: flex; flex-direction: column; gap: 0.5em; font-size: var(--brand-word-size); }
.brand__word { display: block; font-weight: 500; letter-spacing: var(--brand-word-track); margin-right: calc(-1 * var(--brand-word-track)); text-transform: uppercase; white-space: nowrap; }
.brand__base { display: block; font-size: calc(var(--brand-base-size) / var(--brand-word-size) * 1em); font-weight: 500; letter-spacing: var(--brand-base-track); text-transform: uppercase; white-space: nowrap; opacity: 0.85; }

/* ── Content ── */
.legal { flex: 1; width: 100%; max-width: 760px; margin: 0 auto; padding: 96px 48px 120px; }
html:not([data-active-lang]) .legal + .legal { padding-top: 0; }
.legal__label { font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 20px; }
.legal h1 { font-size: clamp(36px, 5vw, 56px); font-weight: 600; letter-spacing: -0.035em; line-height: 1.05; margin-bottom: 28px; }
.legal__intro { font-size: 18px; line-height: 1.6; color: #444; margin-bottom: 56px; max-width: 620px; }
.legal section { padding: 32px 0; border-top: 1px solid var(--border); display: grid; grid-template-columns: 220px 1fr; gap: 32px; }
.legal h2 { font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; line-height: 1.6; }
.legal p, .legal li { font-size: 15px; line-height: 1.75; color: #333; }
.legal p + p, .legal p + ul, .legal ul + p { margin-top: 12px; }
.legal ul { padding-left: 18px; }
.legal address { font-style: normal; }
.legal a:not(.back-link) { text-decoration: underline; text-decoration-color: rgba(0,0,0,0.3); text-underline-offset: 3px; transition: text-decoration-color 0.2s ease; }
.legal a:not(.back-link):hover { text-decoration-color: currentColor; }
.legal__updated { margin-top: 40px; font-size: 13px !important; color: var(--muted) !important; }

/* ── Footer (same line as the home page) ── */
.legal-footer { background: var(--surface-dark); border-top: 1px solid rgba(255,255,255,0.1); }
.legal-footer__inner { max-width: 1200px; margin: 0 auto; padding: 32px 48px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.footer-legal, .footer-location { font-size: 12px; font-weight: 400; color: rgba(255,255,255,0.9); letter-spacing: 0.01em; }
.footer-location { letter-spacing: 0.03em; }
.footer-legal a { color: inherit; text-decoration: underline; text-decoration-color: rgba(255,255,255,0.35); text-underline-offset: 3px; transition: text-decoration-color 0.2s ease; }
.footer-legal a:hover, .footer-legal a[aria-current="page"] { text-decoration-color: currentColor; }

@media (max-width: 768px) {
  .legal-nav { padding: 16px 24px; }
  .legal { padding: 64px 24px 88px; }
  .legal section { grid-template-columns: 1fr; gap: 10px; padding: 26px 0; }
  .legal__intro { font-size: 16px; margin-bottom: 40px; }
  .legal-footer__inner { padding: 28px 24px; }
}
@media (max-width: 640px) {
  .brand { --brand-mark-h: 28px; --brand-sep-h: 26px; --brand-gap: 12px; --brand-word-size: 16px; --brand-word-track: 0.26em; }
  .brand__base { display: none; }
  .legal-nav__actions { gap: 14px; }
  .back-link__long { display: none; }
}