/* ==========================================================================
   OISHI SUSHI — Animations, révélations au scroll & accessibilité
   ========================================================================== */

/* ---- États de base des révélations (avant entrée dans le viewport) ---- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity var(--dur-cinematic) var(--ease-sumi),transform var(--dur-cinematic) var(--ease-sumi)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal="fade"]{transform:none}
[data-reveal="left"]{transform:translateX(-32px)}
[data-reveal="right"]{transform:translateX(32px)}
[data-reveal="scale"]{transform:scale(.94)}
[data-reveal-delay="1"]{transition-delay:.08s}
[data-reveal-delay="2"]{transition-delay:.16s}
[data-reveal-delay="3"]{transition-delay:.24s}
[data-reveal-delay="4"]{transition-delay:.32s}
[data-reveal-delay="5"]{transition-delay:.40s}
[data-reveal-delay="6"]{transition-delay:.48s}

/* Révélation de titre ligne par ligne (clip + montée) */
.reveal-lines .line{display:block;overflow:hidden}
.reveal-lines .line > span{display:block;transform:translateY(110%);transition:transform var(--dur-cinematic) var(--ease-sumi)}
.reveal-lines.is-in .line > span{transform:translateY(0)}
.reveal-lines.is-in .line:nth-child(2) > span{transition-delay:.08s}
.reveal-lines.is-in .line:nth-child(3) > span{transition-delay:.16s}
.reveal-lines.is-in .line:nth-child(4) > span{transition-delay:.24s}

/* Révélation d'image par clip-path (essuyage) */
.clip-reveal{clip-path:inset(0 100% 0 0);transition:clip-path var(--dur-brush) var(--ease-brush)}
.clip-reveal.is-in{clip-path:inset(0 0 0 0)}

/* ---- Keyframes ---- */
@keyframes scrollPulse{
  0%{transform:translateY(-100%)}
  60%,100%{transform:translateY(250%)}
}
@keyframes marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@keyframes pinPulse{
  0%{transform:translate(-50%,-50%) scale(.6);opacity:.7}
  70%{transform:translate(-50%,-50%) scale(2.4);opacity:0}
  100%{opacity:0}
}
@keyframes emberBreath{
  0%,100%{opacity:.26;transform:scale(1)}
  50%{opacity:.32;transform:scale(1.015)}
}
@keyframes floatUp{
  from{transform:translateY(0);opacity:0}
  10%,90%{opacity:.6}
  to{transform:translateY(-120px);opacity:0}
}
@keyframes drawStroke{ to{stroke-dashoffset:0} }
@keyframes spinSlow{ to{transform:rotate(360deg)} }

/* Voile de chargement / noren */
.noren{position:fixed;inset:0;z-index:9000;display:flex;pointer-events:none}
.noren__panel{flex:1;background:linear-gradient(180deg,#0E0A08,#070504);position:relative;will-change:transform;transition:transform var(--dur-curtain) var(--ease-sumi)}
/* (halos retirés : les deux panneaux restent encre pure, sans glow latéral — anti-slop) */
.noren__seam{position:absolute;top:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(201,166,92,.32),transparent)}
.noren__panel--l .noren__seam{right:0}
.noren__panel--r .noren__seam{left:0}
.noren__mark{position:fixed;inset:0;z-index:9001;display:grid;place-items:center;pointer-events:none;transition:opacity var(--dur-slow) var(--ease-sumi)}
.noren__mark .brand{font-size:clamp(2rem,6vw,3.4rem);flex-direction:column;gap:.2rem;text-align:center}
.noren__mark .u-jp{font-size:1.4rem}
.is-open .noren__panel--l{transform:translateX(-102%)}
.is-open .noren__panel--r{transform:translateX(102%)}
.is-open .noren__mark{opacity:0}
.noren.is-done{display:none}

.ember-particle{position:absolute;bottom:-10px;width:4px;height:4px;border-radius:50%;background:radial-gradient(circle,var(--ember),transparent 70%);will-change:transform,opacity;animation:floatUp linear infinite}

/* Brush divider — animé au scroll via .is-in */
.brush-divider path{stroke-dasharray:1;stroke-dashoffset:1;pathLength:1}
.brush-divider.is-in path{animation:drawStroke var(--dur-brush) var(--ease-brush) forwards}

/* Hero ember breathing (désactivé si reduce) */
.hero__ember{animation:emberBreath 8s var(--ease-sumi) infinite}

/* ======================================================================
   PRÉFÉRENCE : MOUVEMENT RÉDUIT — on garde l'orientation, on coupe le reste
   ====================================================================== */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.1ms!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1!important;transform:none!important}
  .reveal-lines .line > span{transform:none!important}
  .clip-reveal{clip-path:none!important}
  .noren{display:none!important}
  .hero__ember{animation:none!important}
  .scroll-hint__line::after{animation:none!important}
  .marquee__track{animation:none!important}
  .map-pin__pulse{animation:none!important}
  .ember-particle{display:none!important}
  body.has-custom-cursor{cursor:auto!important}
  .cursor-dot,.cursor-ring{display:none!important}
}

/* Classe utilitaire posée par le JS si le mouvement est désactivé manuellement */
html.motion-off [data-reveal]{opacity:1!important;transform:none!important}
html.motion-off .reveal-lines .line > span{transform:none!important}
html.motion-off .clip-reveal{clip-path:none!important}
html.motion-off .noren{display:none!important}
html.motion-off .hero__ember,html.motion-off .marquee__track,html.motion-off .map-pin__pulse,html.motion-off .scroll-hint__line::after{animation:none!important}
html.motion-off .ember-particle{display:none!important}