/* ============================================================
   MODALES LÉGALES — mentions / confidentialité / CGV en popup
   Le contenu vit dans des <template>, injecté à l'ouverture.
   ============================================================ */

.lmodal{
  position:fixed; inset:0; z-index:1000;
  display:none;
  align-items:flex-start; justify-content:center;
  padding:40px 20px;
  overflow-y:auto;
}
.lmodal.open{ display:flex }

.lmodal__backdrop{
  position:fixed; inset:0;
  background:rgba(6,20,13,.55);
  backdrop-filter:blur(3px);
  opacity:0;
  transition:opacity .3s ease;
}
.lmodal.open .lmodal__backdrop{ opacity:1 }

.lmodal__panel{
  position:relative;
  width:min(760px, 100%);
  margin:auto 0;
  background:#fff;
  border-radius:22px;
  box-shadow:0 40px 90px -30px rgba(6,20,13,.6);
  opacity:0;
  transform:translateY(18px) scale(.98);
  transition:opacity .35s ease, transform .4s var(--ease-out);
}
.lmodal.open .lmodal__panel{ opacity:1; transform:none }

.lmodal__close{
  position:sticky; top:0; float:right;
  display:grid; place-items:center;
  width:38px; height:38px; margin:14px 14px 0 0;
  border:0; border-radius:50%;
  background:#F1EFEA; color:#3E453F;
  cursor:pointer; z-index:2;
  transition:background .25s ease, color .25s ease, transform .3s var(--ease-spring);
}
.lmodal__close:hover{ background:var(--brand); color:#fff; transform:rotate(90deg) }
.lmodal__close svg{ width:17px; height:17px }

.lmodal__body{ padding:8px 40px 44px }
.lmodal__body h2:first-of-type{ margin-top:8px }

/* réutilise la typo des pages légales */
.lmodal__body h1{
  font-size:clamp(23px,4vw,30px); font-weight:700; letter-spacing:-.03em; line-height:1.14;
  padding-right:40px;
}
.lmodal__date{ margin-top:8px; font-size:12px; font-weight:500; color:var(--ink-mute) }
.lmodal__body h2{
  margin-top:32px; margin-bottom:10px;
  font-size:15px; font-weight:700; letter-spacing:-.02em; color:var(--brand);
}
.lmodal__body p{ margin-top:11px; font-size:13px; line-height:1.72; font-weight:500; color:#3E453F }
.lmodal__body ul{ margin-top:11px; list-style:none; padding:0 }
.lmodal__body li{
  position:relative; margin-top:8px; padding-left:19px;
  font-size:13px; line-height:1.68; font-weight:500; color:#3E453F;
}
.lmodal__body li::before{
  content:""; position:absolute; left:2px; top:9px;
  width:5px; height:5px; border-radius:50%; background:var(--brand-soft);
}
.lmodal__body b{ font-weight:700; color:var(--ink) }
.lmodal__body a{ color:var(--brand); font-weight:600; text-decoration:none; border-bottom:1.5px solid var(--brand-soft) }
.lmodal__box{
  margin-top:14px; padding:16px 18px; border-radius:14px;
  background:#FBFAF7; box-shadow:0 0 0 1px #E9E7E1 inset;
}
.lmodal__box p:first-child{ margin-top:0 }

body.lmodal-open{ overflow:hidden }

@media (max-width:640px){
  .lmodal{ padding:0 }
  .lmodal__panel{ border-radius:0; min-height:100% }
  .lmodal__body{ padding:8px 20px 40px }
  .lmodal__body p, .lmodal__body li{ font-size:12.5px }
}