/* Photos Nouvelles — accueil mobile, 19 octobre 2026.
   Les proportions, dorures et volumes existants restent définis dans index.html.
   Le mobile garde le verre avec des gradients fixes, sans filtrer le fond animé. */

html.pn-mobile-scene #fondvid {
  filter: none;
  mix-blend-mode: normal;
}

html.pn-mobile-scene #burst{display:none}

/* Le décor repose : les ressources vont à la vidéo, au doigt et aux animations d'accueil. */
html.pn-mobile-scene #galaxy {
  transform:scale(1.08);
  animation:none;
}
html.pn-mobile-scene .brand,
html.pn-mobile-scene .menu .panel,
html.pn-mobile-scene #welcome-center .wc-reflection{animation:none}
html.pn-mobile-scene #welcome-center .wc-reflection{transform:scaleY(-1)}
html.pn-mobile-scene .stage{perspective:none}
html.pn-mobile-scene .world,
html.pn-mobile-scene .card{transform-style:flat;will-change:auto}

html.pn-mobile-scene .panel,
html.pn-mobile-scene #enter .e-btn,
html.pn-mobile-scene #avis-pill,
html.pn-mobile-scene #kdo-pill,
html.pn-mobile-scene #mc-pill,
html.pn-mobile-scene #mc-ov {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

html.pn-mobile-scene .panel {
  background: linear-gradient(135deg, rgba(150,186,246,.24), rgba(20,35,77,.24) 50%, rgba(112,152,228,.22));
  box-shadow: 0 10px 18px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.58), inset 0 -5px 12px rgba(14,28,66,.42);
  transition: border-color .3s ease;
}

html.pn-mobile-scene .panel:hover,
html.pn-mobile-scene .panel:focus-visible {
  box-shadow: 0 10px 18px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.58), inset 0 -5px 12px rgba(14,28,66,.42);
}

html.pn-mobile-scene .panel::after {
  box-shadow: 0 5px 8px rgba(0,0,0,.28);
}

html.pn-mobile-scene .card .frame {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.23), 0 0 0 1px rgba(180,205,250,.28), 0 8px 15px rgba(0,0,0,.42);
}

html.pn-mobile-scene .card.faint .frame {
  filter: none;
}

/* Reflets peints une seule fois ; aucune animation de background-position. */
html.pn-mobile-scene .card .frame::before,
html.pn-mobile-scene .panel::before {
  animation: none;
  background: linear-gradient(116deg, rgba(255,255,255,.13), transparent 27%, transparent 57%, rgba(255,255,255,.17) 73%, transparent);
  background-position: 0 0;
  background-size: 100% 100%;
  mix-blend-mode: normal;
}

html.pn-mobile-scene .card .frame::after {
  mix-blend-mode: normal;
}

html.pn-mobile-scene .panel .lbl,
html.pn-mobile-scene .brand img,
html.pn-mobile-scene .welcome h1,
html.pn-mobile-scene #welcome-center .wc-word,
html.pn-mobile-scene #welcome-center .wc-reflection,
html.pn-mobile-scene #enter .e-logo,
html.pn-mobile-scene #enter .e-script,
html.pn-mobile-scene #avis-pill .ap-star,
html.pn-mobile-scene #kdo-pill .ap-lbl,
html.pn-mobile-scene #mc-pill .mc-key,
html.pn-mobile-scene #mc-card .mc-em,
html.pn-mobile-scene #pourquoi .pq-head {
  filter: none;
}

/* Le texte garde son dégradé or original. Ombre courte, fixe et lisible. */
html.pn-mobile-scene .panel .lbl,
html.pn-mobile-scene #welcome-center .wc-word,
html.pn-mobile-scene #enter .e-script,
html.pn-mobile-scene #mc-card .mc-em,
html.pn-mobile-scene #pourquoi .pq-head {
  text-shadow: 0 2px 3px rgba(0,0,0,.35);
}

html.pn-mobile-scene .welcome h1 {
  animation: none;
  text-shadow: 0 1px 0 rgba(255,245,210,.18), 0 3px 4px rgba(0,0,0,.32);
}

html.pn-mobile-scene .welcome h1::after {
  animation: none;
  background-position: 36% 0;
  background-size: 100% 100%;
  opacity: .2;
}

html.pn-mobile-scene #welcome-center .wc-reflection {
  opacity: .18;
}

html.pn-mobile-scene #enter .e-btn {
  animation: none;
  box-shadow: 0 0 0 1px rgba(230,201,138,.2), 0 8px 16px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,248,225,.14);
}

html.pn-mobile-scene #avis-pill,
html.pn-mobile-scene #kdo-pill,
html.pn-mobile-scene #mc-pill,
html.pn-mobile-scene #avis-pill:hover,
html.pn-mobile-scene #kdo-pill:hover,
html.pn-mobile-scene #mc-pill:hover {
  box-shadow: 0 5px 10px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.16);
  transition: opacity .8s ease, transform .8s ease, border-color .3s ease;
}

html.pn-mobile-scene #enter .e-btn::after,
html.pn-mobile-scene #avis-pill::after,
html.pn-mobile-scene #kdo-pill::after,
html.pn-mobile-scene #mc-pill::after {
  animation: none;
  left: 18%;
  opacity: .18;
}

html.pn-mobile-scene #pourquoi,
html.pn-mobile-scene #mc-card {
  box-shadow: 0 9px 18px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.14);
}

html.pn-mobile-scene #pourquoi .pq-txt {
  text-shadow: 0 2px 3px rgba(0,0,0,.7);
}

/* La préparation et les onglets superposés suspendent aussi les animations CSS.
   Les cartes pilotées par Web Animations restent gérées par le moteur mobile. */
html.pn-mobile-scene.pn-scene-preparing *,
html.pn-mobile-scene.pn-scene-preparing *::before,
html.pn-mobile-scene.pn-scene-preparing *::after,
html.pn-mobile-scene.pn-scene-suspended *,
html.pn-mobile-scene.pn-scene-suspended *::before,
html.pn-mobile-scene.pn-scene-suspended *::after {
  animation-play-state: paused !important;
}

@media (orientation: portrait) {
  html.pn-mobile-scene #fondvid {
    object-position: calc(50% - 12vw) center;
  }
}

/* GPU puissants : profondeur, réfraction intégrale et finitions plus riches. */
html.pn-mobile-scene.pn-quality-high .stage{perspective:1400px}
html.pn-mobile-scene.pn-quality-high .world,
html.pn-mobile-scene.pn-quality-high .card{transform-style:preserve-3d;will-change:transform}
html.pn-mobile-scene.pn-quality-high .panel{
  -webkit-backdrop-filter:blur(6px) saturate(1.2);backdrop-filter:blur(6px) saturate(1.2);
  box-shadow:0 20px 35px rgba(0,0,0,.48),inset 0 2px 0 rgba(255,255,255,.62),inset 0 -9px 20px rgba(14,28,66,.5),0 0 20px rgba(150,180,255,.12);
}
html.pn-mobile-scene.pn-quality-high .panel::before,
html.pn-mobile-scene.pn-quality-high .card .frame::before{
  background:linear-gradient(116deg,transparent 36%,rgba(255,255,255,.46) 49%,rgba(255,255,255,.12) 55%,transparent 68%);
  background-size:230% 100%;animation:glint 9s ease-in-out infinite;
}
html.pn-mobile-scene.pn-quality-high .brand img{filter:drop-shadow(0 4px 14px rgba(0,0,0,.7)) drop-shadow(0 6px 22px rgba(230,201,138,.4))}
html.pn-mobile-scene.pn-quality-high .card.faint .frame{filter:blur(1px) saturate(.9)}
html.pn-mobile-scene.pn-quality-high .card .frame{box-shadow:inset 0 0 0 1px rgba(255,255,255,.25),0 0 0 1px rgba(180,205,250,.34),0 0 16px rgba(160,196,255,.32),0 20px 40px rgba(0,0,0,.5)}
html.pn-mobile-scene.pn-quality-high #welcome-center .wc-word{filter:drop-shadow(0 3px 12px rgba(0,0,0,.5)) drop-shadow(0 0 18px rgba(160,200,255,.35))}
html.pn-mobile-scene.pn-quality-high #welcome-center .wc-reflection{filter:blur(1.5px)}