/* ------------------------------------------------------------------
   Vizr — pages légales (mentions légales, confidentialité, conditions).
   Mêmes couleurs, polices, en-tête et pied de page que la page d'accueil ;
   une colonne de lecture confortable, sans animation.
------------------------------------------------------------------- */
:root{
  --bg:#0b0d12; --s1:#141821; --s2:#1b202b; --s3:#252b38;
  --text:#e8eaf0; --muted:#98a0b3; --faint:#838ba0;
  --blue:#5b8cff; --violet:#8a5bff;
  --grad:linear-gradient(120deg,var(--blue),var(--violet));
  --head:"Geologica",system-ui,sans-serif; --body:"Onest",system-ui,sans-serif;
  --gut:clamp(20px,5vw,84px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--body);font-size:17px;line-height:1.7;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
::selection{background:var(--violet);color:#fff}

/* lumière d'ambiance fixe (pas d'animation sur une page de lecture) */
.aura{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.aura i{position:absolute;width:80vmax;height:80vmax;border-radius:50%}
.aura i:nth-child(1){background:radial-gradient(closest-side,rgba(44,73,184,.30),rgba(44,73,184,0));left:-40vmax;top:-46vmax}
.aura i:nth-child(2){background:radial-gradient(closest-side,rgba(90,47,196,.24),rgba(90,47,196,0));right:-46vmax;top:30vh}

header{display:flex;align-items:center;justify-content:space-between;padding:14px var(--gut)}
.logo{display:flex;align-items:center;gap:10px;font:600 22px var(--head);letter-spacing:-.02em;text-decoration:none}
.logo img{width:30px;height:30px}
.btn{display:inline-flex;align-items:center;font:600 14.5px var(--body);padding:13px 18px;border-radius:11px;color:#fff;text-decoration:none;background:var(--grad);
  box-shadow:0 10px 40px -10px rgba(110,110,255,.7),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.btn:hover{transform:translateY(-2px)}

main{flex:1;width:100%;max-width:820px;margin:0 auto;padding:clamp(40px,7vw,90px) var(--gut) 90px}
.kicker{font-size:14px;color:var(--faint)}
h1{font:500 clamp(38px,5vw,64px)/1.05 var(--head);letter-spacing:-.035em;margin-top:10px}
h1 .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--muted);font-size:clamp(17px,1.4vw,19px);margin-top:20px;max-width:38em}
h2{font:500 clamp(24px,2.4vw,30px)/1.2 var(--head);letter-spacing:-.025em;margin:56px 0 14px;padding-top:26px;border-top:1px solid rgba(255,255,255,.08)}
h3{font:500 19px/1.3 var(--head);letter-spacing:-.01em;margin:28px 0 8px}
main p,main li{color:#c9cede}
main p+p{margin-top:12px}
main ul{margin-block-start:10px;margin-inline-start:1.2em}
main li+li{margin-top:6px}
main strong{color:var(--text);font-weight:600}
main a{color:#a8b9ff;text-decoration:underline;text-decoration-color:rgba(168,185,255,.4);text-underline-offset:3px}
main a:hover{text-decoration-color:#a8b9ff}

/* fiche d'identité (éditeur, hébergeur) */
.card{margin-top:16px;padding:22px 24px;border-radius:18px;background:var(--s1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.card dl{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:8px 22px}
.card dt{color:var(--faint);font-size:15px}
.card dd{color:var(--text)}
@media(max-width:560px){.card dl{grid-template-columns:1fr;gap:2px}.card dd+dt{margin-top:10px}}

/* tableau des traitements : en lignes sur ordinateur, en fiches sur téléphone */
.table{margin-top:18px;border-radius:18px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.table table{width:100%;border-collapse:collapse;font-size:15.5px}
.table th{font:500 14px var(--body);color:var(--faint);text-align:start;padding:14px 16px;background:var(--s1)}
.table td{padding:14px 16px;vertical-align:top;color:#c9cede;border-top:1px solid rgba(255,255,255,.07)}
.table td:first-child{color:var(--text);font-weight:500}
@media(max-width:720px){
  .table thead{display:none}
  .table tr{display:block;padding:14px 16px;border-top:1px solid rgba(255,255,255,.07)}
  .table tr:first-child{border-top:0}
  .table td{display:block;padding:3px 0;border:0}
  .table td::before{content:attr(data-l);display:block;font-size:13px;color:var(--faint)}
  .table td:first-child::before{display:none}
  .table td:first-child{font-size:17px;padding-bottom:6px}
}

.toc{margin-top:30px;display:flex;flex-wrap:wrap;gap:8px}
.toc a{font-size:14.5px;color:var(--muted);text-decoration:none;padding:7px 12px;border-radius:10px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.toc a:hover{color:var(--text)}
h2[id]{scroll-margin-top:20px}

footer{padding:34px var(--gut);border-top:1px solid rgba(255,255,255,.07);display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;color:var(--faint);font-size:14.5px}
footer a{color:var(--faint);text-decoration:none;transition:color .2s}
footer a:hover,footer a[aria-current]{color:var(--text)}
.legal{display:flex;flex-wrap:wrap;gap:16px}

/* information encore à fournir (ne doit jamais rester une fois en ligne) */
mark.todo{background:#f0883e;color:#111;padding:0 6px;border-radius:5px;font-weight:600}

/* arabe : polices arabes du site, pas d'espacement négatif (il casserait les liaisons), marge pour les points sous les lettres */
html[lang=ar]{--head:"Readex Pro",system-ui,sans-serif;--body:"IBM Plex Sans Arabic",system-ui,sans-serif}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] .logo{letter-spacing:0}
html[lang=ar] h1{line-height:1.3}
html[lang=ar] h1 .g{padding-block:.12em .38em}
html[lang=ar] body{line-height:1.85}