/* Pages légales · reprend les tokens et les polices de styles.css */

.legal-header{
  grid-template-columns:auto 1fr auto;
}
.legal-header .header-back{
  padding:.62rem 1.1rem;
  border-radius:999px;
  color:white;
  font-size:.86rem;
  font-weight:600;
  text-decoration:none;
  background:rgba(255,255,255,.1);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
  transition:background .35s var(--ease);
}
.legal-header .header-back:hover{background:rgba(255,255,255,.2)}

.legal{
  width:min(760px, calc(100% - 2.4rem));
  margin:0 auto;
  padding:9.5rem 0 5rem;
}

.legal-intro{margin-bottom:3.5rem}
.legal-intro .eyebrow{
  margin:0 0 .9rem;
  color:var(--blue);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.legal-intro h1{
  margin:0 0 1rem;
  font-size:clamp(2.1rem, 5.2vw, 3.1rem);
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.02em;
}
.legal-intro p{margin:0;color:var(--muted);font-size:1.05rem;max-width:56ch}

.legal section{
  padding-top:2.6rem;
  margin-top:2.6rem;
  border-top:1px solid var(--line);
}
.legal h2{
  margin:0 0 1.1rem;
  font-size:1.32rem;
  font-weight:700;
  letter-spacing:-.01em;
}
.legal h3{
  margin:2rem 0 .6rem;
  font-size:1.02rem;
  font-weight:600;
}
.legal p{margin:0 0 1rem;max-width:64ch}
.legal ul{margin:0 0 1rem;padding-left:1.15rem;max-width:64ch}
.legal li{margin-bottom:.45rem}
.legal a{color:var(--blue);text-underline-offset:.22em}

/* Bloc d'identité : libellé / valeur */
.legal-identity{
  display:grid;
  grid-template-columns:minmax(9.5rem, 13rem) 1fr;
  gap:.1rem 1.6rem;
  margin:0;
  padding:1.6rem 1.8rem;
  border-radius:var(--radius-in);
  background:var(--paper-2);
  box-shadow:inset 0 0 0 1px var(--line);
}
.legal-identity dt{
  padding:.55rem 0;
  color:var(--muted);
  font-size:.86rem;
  font-weight:600;
  letter-spacing:.02em;
}
.legal-identity dd{
  margin:0;
  padding:.55rem 0;
  font-weight:500;
}
.legal-identity dt + dd{border-bottom:1px solid var(--line)}
.legal-identity dt{border-bottom:1px solid var(--line)}
.legal-identity dt:nth-last-of-type(1),
.legal-identity dd:nth-last-of-type(1){border-bottom:0}

@media (max-width:640px){
  .legal{padding-top:7.5rem}
  .legal-identity{grid-template-columns:1fr;padding:1.3rem 1.4rem}
  .legal-identity dt{padding-bottom:0;border-bottom:0}
  .legal-identity dd{padding-top:.15rem}
}

/* Marqueur de brouillon : impossible à publier sans le voir.
   Retirer la classe .is-draft du <body> quand tout est confirmé. */
.todo{
  padding:.08em .45em;
  border-radius:.35em;
  color:#7a4a05;
  font-weight:600;
  background:#ffedcc;
  box-shadow:inset 0 0 0 1px #f0c979;
}
.draft-banner{
  position:sticky;
  top:0;
  z-index:50;
  padding:.7rem 1.2rem;
  color:#7a4a05;
  font-size:.9rem;
  font-weight:600;
  text-align:center;
  background:#ffedcc;
  box-shadow:inset 0 -1px 0 #f0c979;
}
body:not(.is-draft) .draft-banner{display:none}
body:not(.is-draft) .todo{padding:0;color:inherit;font-weight:inherit;background:none;box-shadow:none}

.legal-footer{
  width:min(760px, calc(100% - 2.4rem));
  margin:0 auto;
  padding:2.2rem 0 5rem;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.9rem;
}
.legal-footer nav{display:flex;flex-wrap:wrap;gap:1.4rem;margin-top:.7rem}
.legal-footer a{color:var(--muted);text-decoration:none}
.legal-footer a:hover{color:var(--ink);text-decoration:underline}

/* 13/10 · le bandeau de preparation ne recouvre plus l'en-tete ; liens soulignes. */
body.is-draft .draft-banner{position:static}
.legal a{text-decoration:underline}