/* Feuille des pages annexes (404 et mentions légales).
   Même charte que la page d'accueil : l'or est relevé sur le blason,
   le noir vient de la charte Sylha. Un seul monde, la nuit. */
:root{
  color-scheme:dark;
  --nuit-profonde:#040a16;
  --nuit-haute:#131c2e;
  --noir-demi:#1e1e1e;
  --or-base:#A68230;
  --or-median:#BD9941;
  --or-lumiere:#D0AC51;
  --or-eclat:#E6C469;
  --blanc:#f4efe3;
  --blanc-doux:#cfc9bd;
  --blanc-tenu:#9d998f;
  --trait:rgba(189,153,65,.20);
  --gravure:"Cinzel","Trajan Pro",Georgia,serif;
  --parole:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --service:"Fira Sans","Segoe UI",system-ui,-apple-system,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;}
body{
  margin:0;
  min-height:100svh;
  background:
    radial-gradient(120% 70% at 50% 6%, var(--nuit-haute) 0%, #0b1526 42%, var(--nuit-profonde) 80%),
    var(--nuit-profonde);
  color:var(--blanc-doux);
  font-family:var(--service);
  font-size:17px;font-weight:300;line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
.enveloppe{max-width:64ch;margin:0 auto;padding:clamp(3rem,10vh,6rem) clamp(1.2rem,5vw,2.4rem);}
.marque{
  display:inline-flex;align-items:center;gap:.8rem;
  font-family:var(--gravure);font-weight:600;text-transform:uppercase;
  letter-spacing:.2em;font-size:.86rem;color:var(--or-lumiere);text-decoration:none;
  margin-bottom:3rem;
}
.marque img{width:38px;height:38px;}
h1{
  margin:0 0 1.1rem;font-family:var(--gravure);font-weight:600;
  text-transform:uppercase;letter-spacing:.15em;
  font-size:clamp(1.3rem,3.6vw,2rem);color:var(--or-lumiere);text-wrap:balance;
}
h2{
  margin:2.6rem 0 .9rem;font-family:var(--service);font-weight:500;
  font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--or-base);
}
.regle{height:1px;background:linear-gradient(90deg,var(--or-median),var(--trait) 22%,transparent 60%);margin-bottom:1.6rem;}
p{margin:0 0 1.05em;}
p:last-child{margin-bottom:0;}
.parole{font-family:var(--parole);font-size:clamp(1.2rem,2.5vw,1.5rem);line-height:1.6;color:var(--blanc);}
a{color:var(--or-lumiere);text-underline-offset:.22em;}
a:hover{color:var(--or-eclat);}
:focus-visible{outline:2px solid var(--or-eclat);outline-offset:3px;}
dl{margin:0;}
dl div{display:grid;grid-template-columns:minmax(9rem,13rem) 1fr;gap:1.4rem;padding:.9rem 0;border-top:1px solid var(--trait);}
dl div:last-child{border-bottom:1px solid var(--trait);}
dt{font-family:var(--parole);font-size:1.12rem;color:var(--or-lumiere);}
dd{margin:0;font-size:.95rem;}
@media(max-width:640px){dl div{grid-template-columns:1fr;gap:.2rem;}}
.a-remplir{
  display:inline-block;padding:.05em .5em;
  background:var(--noir-demi);border:1px dashed var(--or-base);
  color:var(--or-eclat);font-family:var(--service);font-size:.86rem;
}
.bouton{
  display:inline-block;margin-top:2rem;
  font-family:var(--service);font-size:.76rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
  padding:.82rem 1.7rem;border:1px solid var(--or-base);color:var(--or-lumiere);
  transition:background .5s cubic-bezier(.16,.72,.24,1);
}
.bouton:hover{background:rgba(189,153,65,.12);color:var(--or-eclat);}
footer{margin-top:3.4rem;padding-top:1.5rem;border-top:1px solid rgba(189,153,65,.12);font-size:.8rem;color:var(--blanc-tenu);}