/* « Lever de nuit » : le hero mobile (≤ 760 px) devient le ciel des offres. Desktop inchangé.
   Validé en sandbox (Opus Lab 34) le 26 septembre 2026.
   Séquence : écran crème → la nuit s'ouvre en cercle depuis l'étoile du Diagnostic (0,5 → 1,6 s,
   night.js, --night-r) → le titre passe de l'encre au crème (html.is-night) → les constellations
   se tracent (hero-sky.js, mode nuit) → une offre s'allume toutes les 3,4 s avec sa légende.
   Au défilement, le ciel monte plus vite que le texte (--p, night.js). Sans JavaScript, la page
   garde l'écran crème (le cercle reste fermé). */
@media (max-width:760px){
  html .hero{--night-r:0%;--p:0;position:relative;height:calc(100svh - 68px);min-height:600px;max-height:900px;overflow:hidden;background:#fbf1dc}
  html .hero-plate[data-offer-sky]{position:absolute;inset:0;height:auto;width:auto;left:0;margin:0;z-index:1;
    clip-path:circle(var(--night-r) at 22% 58%);transform:translateY(calc(var(--p) * -18%)) scale(calc(1 + var(--p) * .08));transform-origin:50% 30%}
  html .hero-plate[data-offer-sky]::after{content:"";position:absolute;inset:auto 0 0;height:34%;z-index:2;pointer-events:none;
    background:linear-gradient(0deg,rgba(7,12,18,.94) 30%,rgba(7,12,18,.6) 70%,rgba(7,12,18,0))}
  html .hero-plate figcaption{display:none}
  /* Le texte passe en bas, par-dessus le ciel. */
  html .hero-copy{position:absolute;z-index:5;left:0;right:0;bottom:0;top:auto;min-height:0;height:auto;padding:0 20px 26px;background:transparent;pointer-events:none;
    transform:translateY(calc(var(--p) * -6%))}
  html .hero-copy a{pointer-events:auto}
  html .hero-copy .discipline{display:none}
  html .hero-copy h1{margin-top:0;font-size:clamp(44px,12.5vw,58px);line-height:.94;transition:color .6s ease .45s}
  html .hero-copy h1 em{transition:color .6s ease .45s}
  html .hero-copy .intro{margin:16px 0 22px;font-size:16px;line-height:1.45;transition:color .6s ease .45s}
  html .hero .v511-actions .primary{transition:background .8s ease .7s,color .8s ease .7s,box-shadow .8s ease .7s}
  html .hero .hero-text-link{display:none}
  html.is-night .hero{background:#070c12;transition:background 0s linear 1.6s}
  html.is-night .hero-copy h1{color:#f5f1ea}
  html.is-night .hero-copy h1 em{color:#ef8a5f}
  html.is-night .hero-copy .intro{color:rgba(245,241,234,.8)}
  html.is-night .hero .v511-actions .primary{background:#ef673c;color:#0b0f14;box-shadow:4px 5px 0 #efb84e}
  /* Le badge Scrolls devient une pastille en haut du ciel. */
  html .hero .scroll-focus-badge{position:absolute;z-index:6;top:14px;left:20px;right:auto;bottom:auto;margin:0;width:auto;max-width:calc(100% - 40px);height:auto;aspect-ratio:auto;
    flex-direction:row;align-items:center;gap:10px;padding:6px 12px 6px 6px!important;min-height:0!important;border:1px solid rgba(239,184,78,.6);border-radius:999px;background:rgba(7,12,18,.72);box-shadow:none;color:#f5f1ea;
    opacity:0;transform:translateY(-8px);transition:opacity .6s ease 2.2s,transform .6s ease 2.2s;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
  html.is-night .scroll-focus-badge{opacity:1;transform:none}
  html .scroll-focus-badge .scroll-focus-logo,html .scroll-focus-badge .scroll-focus-label{display:none}
  html .hero .scroll-focus-badge .scroll-focus-visual{display:none}
  html .hero .scroll-focus-badge .scroll-focus-title{margin:0;font:600 12px/1.2 var(--sans);letter-spacing:0;color:#f5f1ea;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html .scroll-focus-badge b{font-size:13px;color:#efb84e}
  html .scroll-focus-badge::before{content:"New";flex:none;padding:3px 6px 2px;border-radius:999px;background:#efb84e;color:#0b0f14;font:700 9px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
  html[lang="fr"] .scroll-focus-badge::before{content:"Nouveau"}
  /* Indice de geste, une fois le ciel tracé. */
  html .night-hint{position:absolute;z-index:6;left:0;right:0;top:58%;margin:0;text-align:center;pointer-events:none;font:10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(239,184,78,.85);opacity:0;transition:opacity .8s ease}
  html .night-hint.is-on{opacity:1}
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){
  html .hero{--night-r:150%}
  html .hero *,html .scroll-focus-badge{transition:none!important}
}