/* ==========================================================================
   Pages intérieures (tarifs, contact, modèles, FAQ, légales) : en-tête de page,
   navigation d'ancres. Le mouvement vient de motion.css.
   ========================================================================== */
.page-hero{position:relative;padding-block:clamp(70px,12vh,140px) clamp(40px,7vw,80px)}
.page-hero h1{font-size:var(--fs-display);max-width:18ch;margin:26px 0 24px}
.page-hero .lead{margin-bottom:34px}
/* le titre part mot à mot quand on descend, et revient en remontant */
.page-hero h1 .sw{--k:clamp(0,calc(1 - ((var(--hero,0) - .1) * 3 * (var(--words,1) + 2) - var(--w,0)) / 3),1)}
.page-hero>.wrap{
  opacity:calc(1 - var(--hero,0) * 1.2);
  transform:translate3d(0,calc(var(--hero,0) * -70px),0);
}

.page-nav{display:flex;flex-wrap:wrap;gap:8px}
.page-nav a{
  display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;border-radius:var(--radius-pill);
  font-size:.88rem;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line-hi);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:color var(--dur-fast),border-color var(--dur-fast),background var(--dur-fast);
}
.page-nav a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--iris)}
.page-nav a:hover{color:var(--text);border-color:rgba(244,114,182,.5);background:var(--iris-soft)}

/* ---------- FAQ repliable (contact.html, faq.html) ---------- */
.faq{display:grid;gap:10px}
.faq-group{display:grid;gap:10px;margin-bottom:clamp(36px,5vw,56px)}
.faq-group h3{display:flex;align-items:center;gap:12px;margin-bottom:8px;font-family:var(--font-mono);font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--muted)}
.faq-group h3::before{content:"";width:28px;height:1px;background:var(--iris)}
.faq details>p+p{padding-top:0;margin-top:-10px}
.faq details{border-radius:var(--radius);border:1px solid var(--line-hi);background:rgba(255,255,255,.03);transition:background var(--dur),border-color var(--dur)}
.faq details[open]{background:rgba(255,255,255,.055);border-color:rgba(244,114,182,.35)}
.faq summary{
  display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;cursor:pointer;list-style:none;
  font-size:1.02rem;font-weight:560;letter-spacing:-.01em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";flex:none;width:28px;height:28px;border-radius:50%;border:1px solid var(--line-hi);
  background:center/12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5F5F7' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  transition:transform var(--dur) var(--ease-lux),background-color var(--dur);
}
.faq details[open] summary::after{transform:rotate(45deg);background-color:rgba(244,114,182,.18)}
.faq details>p,.faq details>div{padding:0 24px 22px;color:var(--muted);max-width:70ch}
.faq details a{color:#F0ABFC;text-decoration:underline;text-underline-offset:3px}

/* ---------- Pages légales ---------- */
.legal{max-width:780px;padding:clamp(28px,4vw,56px);border-radius:var(--radius-l)}
.legal h1{font-size:clamp(2rem,4.4vw,3.2rem)!important;margin:22px 0 10px!important}
.legal .updated{font-family:var(--font-mono);font-size:.76rem;letter-spacing:.08em;color:var(--dim);margin-bottom:36px}
.legal h2{font-size:1.25rem;letter-spacing:-.015em;margin:44px 0 14px;padding-top:26px;border-top:1px solid var(--line)}
.legal p,.legal li{color:var(--muted);line-height:1.7}
.legal p+p{margin-top:12px}
.legal ul{display:grid;gap:10px;margin:12px 0;padding-inline-start:4px}
.legal li{position:relative;padding-inline-start:22px}
.legal li::before{content:"";position:absolute;inset-inline-start:0;top:.72em;width:8px;height:1px;background:var(--iris)}
.legal strong{color:var(--text);font-weight:600}
.legal a:not(.btn){color:#F0ABFC;text-decoration:underline;text-underline-offset:3px}

@media (prefers-reduced-motion:reduce){.page-hero>.wrap{opacity:1;transform:none}}

/* ---------- Page introuvable (404.html) ---------- */
.nf{min-height:calc(100svh - 200px);display:flex;align-items:center}
.nf-code{
  display:block;margin-bottom:10px;font-size:clamp(6rem,19vw,14rem);font-weight:700;letter-spacing:-.06em;line-height:.9;
  background:var(--iris);-webkit-background-clip:text;background-clip:text;color:transparent;
  opacity:calc(.9 - var(--hero,0) * .6);
}
.nf-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
