/* ═══════════════════════════════════════════════════
   TIME UP — pages légales
   Feuille autonome : mêmes jetons que la landing,
   sans les composants de la page d'accueil.
   ═══════════════════════════════════════════════════ */

:root{
  --bg:#0C1522;
  --bg-deep:#080e18;
  --surface:#12202F;
  --surface-2:#16283a;
  --line:rgba(255,255,255,.09);
  --line-strong:rgba(255,255,255,.16);
  --muted:#6E819A;
  --text:#E9F1FA;
  --aqua:#37E0C3;
  --blue:#2AA0E0;
  --red:#F2415C;

  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;

  --r-sm:14px; --r:20px;
  --pad:clamp(20px,5vw,40px);
  --maxw:760px;
}

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

html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}

body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--text);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

svg{display:block}
a{color:inherit}
ul,ol{list-style:none}
::selection{background:var(--aqua);color:#04202b}
:focus-visible{outline:2px solid var(--aqua);outline-offset:3px;border-radius:6px}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}

/* ─── fond ──────────────────────────────────────── */
.aurora{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.aurora__blob{position:absolute;border-radius:50%;filter:blur(120px);opacity:.16;
  width:60vw;height:60vw;max-width:700px;max-height:700px;top:-24vw;right:-16vw;
  background:radial-gradient(circle,var(--aqua),transparent 70%)}

/* ─── nav ───────────────────────────────────────── */
.nav{position:sticky;top:0;z-index:50;background:rgba(8,14,24,.78);
  backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--line)}
.nav__inner{display:flex;align-items:center;gap:20px;height:64px}

.brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;flex-shrink:0}
.brand__icon{width:26px;height:26px;border-radius:7px;display:block;
  box-shadow:0 0 0 1px var(--line-strong),0 2px 10px rgba(0,0,0,.4)}
.brand__word{font-size:14px;font-weight:700;letter-spacing:.16em}

.nav__spacer{margin-left:auto}

.lang{display:inline-flex;border:1px solid var(--line-strong);border-radius:999px;overflow:hidden}
.lang a{padding:5px 11px;font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--muted);
  text-decoration:none;transition:background .2s,color .2s}
.lang a:hover{color:var(--text)}
.lang a[aria-current="true"]{background:var(--aqua);color:#04202b}

/* ─── en-tête du document ───────────────────────── */
.head{padding:clamp(48px,9vw,88px) 0 clamp(24px,4vw,36px)}
.head__kicker{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--aqua);margin-bottom:14px}
.head h1{font-size:clamp(30px,6vw,46px);line-height:1.1;letter-spacing:-.02em;font-weight:700}
.head__meta{margin-top:16px;font-size:14px;color:var(--muted)}
.head__meta strong{color:var(--text);font-weight:600}

/* ─── résumé encadré ────────────────────────────── */
.tldr{margin:8px 0 clamp(32px,5vw,52px);padding:clamp(20px,4vw,28px);
  background:linear-gradient(180deg,var(--surface),var(--surface-2));
  border:1px solid var(--line);border-radius:var(--r)}
.tldr h2{font-size:15px;font-weight:600;letter-spacing:.02em;margin-bottom:14px;color:var(--aqua)}
.tldr ul{display:grid;gap:10px}
.tldr li{position:relative;padding-left:26px;font-size:15px;color:#cfdcea}
.tldr li::before{content:"";position:absolute;left:6px;top:.62em;width:7px;height:7px;
  border-radius:50%;background:var(--aqua);box-shadow:0 0 10px rgba(55,224,195,.6)}

/* ─── sommaire ──────────────────────────────────── */
.toc{margin-bottom:clamp(36px,6vw,60px);padding-top:6px;border-top:1px solid var(--line)}
.toc h2{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin:22px 0 14px}
.toc ol{counter-reset:toc;display:grid;gap:7px}
.toc li{counter-increment:toc;font-size:15px}
.toc a{color:var(--muted);text-decoration:none;transition:color .2s}
.toc a::before{content:counter(toc) ". ";font-variant-numeric:tabular-nums;color:var(--line-strong)}
.toc a:hover{color:var(--aqua)}

/* ─── corps ─────────────────────────────────────── */
.doc{counter-reset:sec;padding-bottom:clamp(48px,8vw,90px)}
.doc section{margin-bottom:clamp(34px,5vw,50px);counter-increment:sec;scroll-margin-top:88px}
.doc h2{font-size:clamp(19px,3.2vw,23px);line-height:1.3;letter-spacing:-.01em;font-weight:700;
  margin-bottom:14px;display:flex;gap:12px;align-items:baseline}
.doc h2::before{content:counter(sec);font-size:13px;font-weight:600;color:var(--aqua);
  font-variant-numeric:tabular-nums;flex-shrink:0;padding-top:2px}
.doc h3{font-size:16px;font-weight:600;margin:24px 0 8px;color:#dbe6f2}
.doc p{margin-bottom:14px;color:#c3d1e0}
.doc p:last-child{margin-bottom:0}
.doc strong{color:var(--text);font-weight:600}
.mono{font-family:var(--mono);font-size:.92em;color:#a9bccd}
.doc em{color:var(--text);font-style:italic}

.doc ul{display:grid;gap:9px;margin:0 0 16px}
.doc ul li{position:relative;padding-left:20px;color:#c3d1e0}
.doc ul li::before{content:"";position:absolute;left:4px;top:.68em;width:5px;height:5px;
  border-radius:50%;background:var(--line-strong)}
.doc ul li strong{color:var(--text)}

.doc a[href^="mailto"],.doc a[href^="http"],.doc a[href$=".html"]{
  color:var(--aqua);text-decoration:none;border-bottom:1px solid rgba(55,224,195,.35);
  transition:border-color .2s}
.doc a[href^="mailto"]:hover,.doc a[href^="http"]:hover,.doc a[href$=".html"]:hover{
  border-bottom-color:var(--aqua)}

/* encadré d'avertissement */
.callout{margin:18px 0;padding:18px 20px;border-radius:var(--r-sm);
  background:rgba(242,65,92,.07);border:1px solid rgba(242,65,92,.28)}
.callout p{color:#e7d3d8}
.callout p:first-child{margin-top:0}
.callout strong{color:#ffd7de}

.callout--calm{background:rgba(42,160,224,.07);border-color:rgba(42,160,224,.26)}
.callout--calm p{color:#cfdeeb}
.callout--calm strong{color:#dbeefb}

/* tableau simple */
.table{width:100%;border-collapse:collapse;margin:6px 0 18px;font-size:14.5px;
  display:block;overflow-x:auto}
.table th,.table td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);
  vertical-align:top}
.table th{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap}
.table td{color:#c3d1e0}
.table td:first-child{color:var(--text);font-weight:500;white-space:nowrap}

/* ─── pied ──────────────────────────────────────── */
.footer{border-top:1px solid var(--line);padding:32px 0 48px}
.footer__inner{display:flex;flex-wrap:wrap;gap:16px 26px;align-items:center;
  font-size:14px;color:var(--muted)}
.footer a{color:var(--muted);text-decoration:none;transition:color .2s}
.footer a:hover{color:var(--aqua)}
.footer__legal{margin-left:auto;font-size:13px}

@media (max-width:560px){
  .footer__legal{margin-left:0;width:100%}
  .doc h2{gap:9px}
}