/* =============================================================================
   mooove.club — pages légales (mentions, CGV, confidentialité, désinscription)
   Mêmes tokens que maison-de-lia.html. Feuille partagée : une seule règle de
   contraste à tenir, un seul endroit à changer si la charte bouge.

   RÈGLE DE CONTRASTE (pack 02) : sur --ice, ne JAMAIS utiliser --cyan pour du
   texte, le ratio est insuffisant. Utiliser --electric. Le bug historique de la
   page venait de là.
   ========================================================================== */
:root{
  --navy:#052139;--ice:#eff9fe;--cyan:#2ac2de;--sky:#c7eafb;--electric:#3c5eab;
  --amber:#f6923e;--white:#fff;--hair:rgba(239,249,254,.22);--ink-hair:rgba(5,33,57,.18);
  --font:"Archivo","Inter","Helvetica Neue",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--navy);font-family:var(--font);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--electric)}
:focus-visible{outline:3px solid var(--electric);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-9999px;background:var(--cyan);color:var(--navy);padding:.8rem 1.2rem;font-weight:800;z-index:400}
.skip:focus{left:1rem;top:1rem}

.topbar{background:var(--navy);color:var(--ice);padding:1.3rem 0}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.wordmark{font-size:1.4rem;font-weight:850;letter-spacing:-.09em;text-decoration:none;color:var(--ice);line-height:1}
.wordmark i{font-weight:500;font-style:normal}
.wordmark small{display:block;font-size:.48rem;font-weight:650;letter-spacing:.18em;text-transform:uppercase;margin-top:-2px}
.topbar nav{display:flex;gap:1.2rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;flex-wrap:wrap}
.topbar nav a{color:rgba(239,249,254,.75);text-decoration:none}
.topbar nav a:hover{color:var(--cyan)}

.wrap{width:min(820px,90vw);margin:auto}
main{padding:4rem 0 5rem}
h1{font-size:clamp(2rem,5vw,3.1rem);font-weight:850;letter-spacing:-.04em;line-height:1.02;margin:.2em 0 .4em}
h2{font-size:clamp(1.25rem,2.4vw,1.6rem);font-weight:800;letter-spacing:-.025em;line-height:1.15;margin:2.6rem 0 .8rem;padding-top:1.6rem;border-top:1px solid var(--ink-hair)}
h3{font-size:1.02rem;font-weight:750;margin:1.6rem 0 .5rem}
p,li{font-size:1rem;color:rgba(5,33,57,.82)}
ul,ol{padding-left:1.3rem}
li{margin-bottom:.5rem}
.lede{font-size:1.1rem;color:rgba(5,33,57,.7);max-width:62ch}
.updated{font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--electric)}
dl{margin:0}
dt{font-weight:750;margin-top:1rem}
dd{margin:.2rem 0 0;color:rgba(5,33,57,.82)}
table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.95rem}
th,td{text-align:left;padding:.7rem .6rem;border-bottom:1px solid var(--ink-hair);vertical-align:top}
th{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--electric)}
.tablewrap{overflow-x:auto}

/* Fait à compléter par MOOOVE. Volontairement voyant : une page légale qui part
   en ligne avec un trou doit se voir immédiatement, pas se découvrir en litige.
   Ne PAS inventer ces valeurs — elles engagent la société. */
.todo{display:inline-block;background:#fff3e6;border:1px dashed var(--amber);color:#9a4f00;
      font-size:.82rem;font-weight:700;padding:.15rem .5rem;border-radius:6px;white-space:nowrap}
.notice{background:var(--ice);border-left:4px solid var(--electric);padding:1.1rem 1.3rem;border-radius:0 8px 8px 0;margin:1.6rem 0}
.notice p:last-child{margin-bottom:0}
.notice p:first-child{margin-top:0}
/* Etats du message de desinscription. Vert/rouge assez sombres pour rester
   lisibles sur --ice : cf. la regle de contraste en tete de fichier. */
.notice.ok{border-left-color:#0b7a52;background:#eef9f4;color:#0b5138}
.notice.err{border-left-color:#b3261e;background:#fdefee;color:#8c1d18}
.notice:empty{display:none}

.footer{background:var(--navy);color:rgba(239,249,254,.6);padding:2.5rem 0;font-size:.85rem}
.footer .wrap{display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.footer a{color:rgba(239,249,254,.75);text-decoration:none}
.footer a:hover{color:var(--cyan)}
.footer-legal{display:flex;gap:1.2rem;flex-wrap:wrap;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}

@media(max-width:560px){
  main{padding:2.5rem 0 3.5rem}
  h2{margin-top:2rem}
}