/* #region PMR:HERO-REVEAL-CSS-PROTECTED */
/* PM Cleaning hero reveal - composant isole. Tous les selecteurs sont prefixes pmr.
   Version V12 (2026-09-05) : rythme accelere, flots plus dynamiques, etoiles scintillantes,
   lumiere au curseur disponible des le depart, bouton rejouer discret.
   Regle : ne modifier ce fichier que sur demande explicite de Pierre portant sur l'effet. */

/* #region PMR:HR-TOKENS  <-- LES 6 REGLAGES A TOUCHER EN PREMIER */
.pm-hero-reveal{
  --pmr-tint:#07392f;          /* fond sous la photo pendant le chargement */
  --pmr-duration:3s;           /* reglage Pierre 05/09/2026. V12 = 5.2s, V11 = 7.6s. Pilote par data-duration */
  --pmr-mark-duration:1.8s;    /* reglage Pierre. Pilote par le JS : 60% de la duree */
  --pmr-flow-amp:1.8;          /* reglage Pierre. 1 = V12 initial, 0.6 = proche V11 */
  --pmr-glint-size:16px;       /* taille des etoiles */
  --pmr-position:center;       /* cadrage de la photo */
  position:relative;
  isolation:isolate;
  overflow:hidden;
  contain:paint;
  background:var(--pmr-tint);
}
/* #endregion PMR:HR-TOKENS */

/* #region PMR:HR-LAYERS  photo sale, photo propre, voile mineral */
.pm-hero-reveal>picture{display:block;width:100%;height:100%}
.pm-hero-reveal .pmr-fallback{
  width:100%;height:100%;object-fit:cover;object-position:var(--pmr-position);border-radius:inherit
}
.pmr-layer,.pmr-light-mark,.pmr-sweep,.pmr-glints,.pmr-pointer{
  position:absolute;inset:0;pointer-events:none
}
.pmr-layer{background-position:var(--pmr-position);background-size:cover;background-repeat:no-repeat}
.pmr-dark{
  z-index:1;
  background-color:var(--pmr-tint);
  background-blend-mode:normal;
  filter:grayscale(.24) saturate(.8) brightness(.92) contrast(.87);
  transform:scale(1.012)
}
.pmr-dark:after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(135deg,rgba(30,73,66,.05),rgba(23,54,51,.11)),
    radial-gradient(ellipse at 24% 28%,rgba(222,229,225,.17),transparent 43%),
    radial-gradient(ellipse at 72% 58%,rgba(91,131,121,.09),transparent 48%),
    radial-gradient(ellipse at 44% 82%,rgba(202,215,209,.1),transparent 42%);
  background-size:auto;
  opacity:.62
}
.pmr-clean{
  z-index:2;
  clip-path:inset(0 100% 0 0);
  filter:saturate(1.015) brightness(1.01) contrast(1.025);
  transform:scale(1.012);
  animation:pmr-clean-reveal var(--pmr-duration) cubic-bezier(.58,.02,.28,1) forwards
}
.pmr-clean:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(118deg,transparent 0 45%,rgba(255,248,218,.14) 50%,transparent 58%)
}
/* #endregion PMR:HR-LAYERS */

/* #region PMR:HR-LOGO-FLOW  logo PM lumineux, flots wavy, bulles */
.pmr-light-mark{
  z-index:3;left:52%;top:48%;right:auto;bottom:auto;width:258px;aspect-ratio:1;
  transform:translate(-50%,-50%) scale(.76);opacity:0;
  filter:drop-shadow(0 0 14px rgba(255,248,220,.5)) drop-shadow(0 0 38px rgba(194,232,214,.26));
  animation:pmr-mark-collapse var(--pmr-mark-duration) cubic-bezier(.54,.02,.3,1) forwards
}
.pmr-light-mark:before,.pmr-light-mark:after{
  content:"";position:absolute;pointer-events:none;opacity:0
}
.pmr-light-mark:before{
  z-index:0;inset:24%;border-radius:48% 52% 56% 44% / 43% 57% 45% 55%;
  background:radial-gradient(circle at 48% 46%,rgba(255,253,237,.92) 0 8%,rgba(240,211,128,.54) 22%,rgba(231,194,96,.22) 42%,transparent 69%);
  filter:blur(9px);
  animation:pmr-gold-bloom var(--pmr-mark-duration) ease-out forwards
}
.pmr-light-mark:after{
  z-index:1;inset:8%;border-radius:55% 45% 61% 39% / 42% 57% 43% 58%;
  background:
    radial-gradient(ellipse 58% 42% at 34% 39%,rgba(188,226,209,.3),transparent 72%),
    radial-gradient(ellipse 52% 62% at 67% 54%,rgba(244,222,154,.24),transparent 70%),
    radial-gradient(ellipse 50% 34% at 48% 71%,rgba(213,238,226,.22),transparent 68%);
  filter:blur(15px);mix-blend-mode:screen;
  animation:pmr-watercolor-wash var(--pmr-mark-duration) ease-in-out forwards
}
.pmr-light-mark>img{
  position:absolute;z-index:3;left:50%;top:50%;width:104px;height:auto;
  transform:translate(-50%,-48%);opacity:.88;
  filter:sepia(.12) saturate(1.08) drop-shadow(0 0 7px rgba(255,255,246,.74)) drop-shadow(0 0 22px rgba(232,202,119,.5)) drop-shadow(0 0 32px rgba(210,239,225,.3));
  animation:pmr-mark-pulse var(--pmr-mark-duration) ease-out forwards
}
.pmr-light-mark svg{position:absolute;z-index:2;inset:0;width:100%;height:100%;overflow:visible}
.pmr-light-mark .pmr-flow{
  fill:none;stroke:url(#pmr-flow-gradient);stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:620;stroke-dashoffset:620;transform-box:fill-box;transform-origin:center;
  filter:drop-shadow(0 0 6px rgba(255,251,226,.8)) drop-shadow(0 0 16px rgba(194,232,214,.46));
  animation:pmr-flow-draw var(--pmr-mark-duration) cubic-bezier(.24,.03,.2,1) var(--pmr-flow-delay,0s) forwards
}
/* V12 : ecart des delais elargi (V11 = .02s a .26s) pour un enchainement lisible */
.pmr-flow-a{--pmr-path-opacity:.92;--pmr-path-late-opacity:.72;--pmr-flow-delay:0s;stroke-width:5.6}
.pmr-flow-a-echo{--pmr-path-opacity:.2;--pmr-path-late-opacity:.15;--pmr-flow-delay:.07s;stroke-width:11.5;filter:blur(2.4px) drop-shadow(0 0 13px rgba(234,213,150,.34))}
.pmr-flow-b{--pmr-path-opacity:.74;--pmr-path-late-opacity:.57;--pmr-flow-delay:.16s;stroke-width:3.3}
.pmr-flow-c{--pmr-path-opacity:.5;--pmr-path-late-opacity:.38;--pmr-flow-delay:.27s;stroke-width:1.8}
.pmr-flow-d{--pmr-path-opacity:.36;--pmr-path-late-opacity:.27;--pmr-flow-delay:.35s;stroke-width:6.4;filter:blur(.65px) drop-shadow(0 0 11px rgba(205,235,220,.3))}
.pmr-flow-e{--pmr-path-opacity:.7;--pmr-path-late-opacity:.54;--pmr-flow-delay:.23s;stroke-width:4.2}
.pmr-flow-f{--pmr-path-opacity:.44;--pmr-path-late-opacity:.33;--pmr-flow-delay:.42s;stroke-width:2.1}
.pmr-bubble{
  fill:rgba(255,251,229,.04);stroke:rgba(236,246,238,.66);stroke-width:1.35;
  transform-box:fill-box;transform-origin:center;opacity:0;
  filter:drop-shadow(0 0 6px rgba(242,222,163,.24));
  animation:pmr-bubble-drift var(--pmr-mark-duration) ease-out var(--pmr-bubble-delay,0s) forwards
}
.pmr-bubble-a{--pmr-bubble-delay:.2s}.pmr-bubble-b{--pmr-bubble-delay:.44s}
/* #endregion PMR:HR-LOGO-FLOW */

/* #region PMR:HR-SWEEP  balayage lumineux qui enleve le voile */
.pmr-sweep{
  z-index:4;left:30%;right:auto;width:46%;opacity:0;transform:skewX(-7deg);
  background:linear-gradient(90deg,transparent 0%,rgba(255,248,218,.05) 17%,rgba(255,250,226,.26) 40%,rgba(255,255,247,.56) 52%,rgba(214,243,229,.23) 65%,transparent 100%);
  filter:blur(2px);box-shadow:28px 0 78px rgba(255,248,213,.26),64px 0 130px rgba(218,242,229,.17);
  mix-blend-mode:screen;animation:pmr-beam-travel var(--pmr-duration) cubic-bezier(.58,.02,.28,1) forwards
}
.pmr-sweep:before{
  content:"";position:absolute;left:49%;top:-8%;bottom:-8%;width:18px;
  background:linear-gradient(90deg,transparent,rgba(255,254,235,.74),transparent);
  filter:blur(5px);box-shadow:0 0 24px 8px rgba(255,250,222,.22),0 0 48px 18px rgba(217,241,229,.13)
}
.pmr-sweep:after{
  content:"";position:absolute;left:4%;right:-12%;top:12%;height:68%;
  background:radial-gradient(ellipse at 56% 42%,rgba(255,255,244,.5),rgba(255,246,201,.23) 24%,rgba(222,244,231,.08) 45%,transparent 70%);
  filter:blur(7px)
}
/* #endregion PMR:HR-SWEEP */

/* #region PMR:HR-GLINTS  etoiles / scintillement de finition
   V11 : croix 4 branches, 1 flash de 0.38s, 5 desktop / 2 mobile.
   V12 : etoile 8 branches + coeur diffus, 3 pulsations, 9 desktop / 4 mobile. */
.pmr-glints{z-index:5}
.pmr-glints i{
  position:absolute;left:var(--x);top:var(--y);
  width:calc(var(--pmr-glint-size) * var(--gs,1));
  height:calc(var(--pmr-glint-size) * var(--gs,1));
  margin:calc(var(--pmr-glint-size) * var(--gs,1) / -2) 0 0 calc(var(--pmr-glint-size) * var(--gs,1) / -2);
  opacity:0;
  background:radial-gradient(circle at 50% 50%,rgba(255,253,235,.92) 0 7%,rgba(255,245,200,.34) 19%,transparent 62%);
  filter:drop-shadow(0 0 8px rgba(255,250,216,.82)) drop-shadow(0 0 18px rgba(232,202,119,.42));
  animation:pmr-finish-glint var(--pmr-duration) ease-out var(--delay) forwards
}
.pmr-glints i:before,.pmr-glints i:after{
  content:"";position:absolute;left:50%;top:50%;
  background:linear-gradient(#fffdf2,#fff2bd);border-radius:999px;transform:translate(-50%,-50%)
}
.pmr-glints i:before{width:2px;height:100%}
.pmr-glints i:after{width:100%;height:2px}
.pmr-glints b{position:absolute;inset:0;transform:rotate(45deg);opacity:.7}
.pmr-glints b:before,.pmr-glints b:after{
  content:"";position:absolute;left:50%;top:50%;
  background:#fff8dc;border-radius:999px;transform:translate(-50%,-50%)
}
.pmr-glints b:before{width:1.5px;height:62%}
.pmr-glints b:after{width:62%;height:1.5px}
/* #endregion PMR:HR-GLINTS */

/* #region PMR:HR-POINTER  lumiere qui suit la souris dans le heros
   V11 : active seulement apres la fin de la revelation (7.6s d'attente).
   V12 : active des que le curseur entre, y compris pendant la revelation. */
.pmr-pointer{
  z-index:6;
  background:
    radial-gradient(circle 72px at var(--pmr-x,72%) var(--pmr-y,42%),rgba(255,254,242,.32),transparent 70%),
    radial-gradient(circle 175px at var(--pmr-x,72%) var(--pmr-y,42%),rgba(255,253,229,.26),rgba(229,247,237,.1) 42%,transparent 74%);
  mix-blend-mode:screen;opacity:0;transition:opacity .24s
}
.pmr-pointer-active .pmr-pointer{opacity:1}
/* #endregion PMR:HR-POINTER */

/* #region PMR:HR-REPLAY  bouton rejouer, discret par defaut */
.pmr-replay{
  position:absolute;z-index:8;right:16px;top:16px;
  width:40px;height:40px;padding:0;font-size:0;line-height:0;
  display:grid;place-items:center;
  border:1px solid rgba(227,205,130,.6);border-radius:999px;
  background:rgba(7,57,47,.62);color:#fff;
  opacity:.45;backdrop-filter:blur(8px);
  transition:opacity .24s ease,background-color .24s ease,transform .24s ease
}
.pmr-replay:before{content:"\21BB";font-size:1.05rem;line-height:1}
.pmr-replay:hover,.pmr-replay:focus-visible{opacity:1;background:rgba(7,57,47,.92);transform:scale(1.06)}
/* #endregion PMR:HR-REPLAY */

/* #region PMR:HR-STATES */
.pmr-running .pmr-clean{will-change:clip-path}
.pmr-running .pmr-sweep{will-change:left,opacity}
.pmr-complete .pmr-dark,.pmr-complete .pmr-clean,.pmr-complete .pmr-light-mark,.pmr-complete .pmr-sweep,.pmr-complete .pmr-glints{display:none}
.pmr-paused .pmr-layer,.pmr-paused .pmr-light-mark,.pmr-paused .pmr-light-mark *,.pmr-paused .pmr-light-mark:before,.pmr-paused .pmr-light-mark:after,.pmr-paused .pmr-sweep,.pmr-paused .pmr-glints i{animation-play-state:paused!important}
/* #endregion PMR:HR-STATES */

/* #region PMR:HR-KEYFRAMES
   V12 : le temps mort de fin (24% de la duree en V11) est supprime.
   Repartition V12 : logo 0 -> 45% | balayage 26% -> 84% | etoiles 60% -> 94%. */
@keyframes pmr-mark-collapse{0%{opacity:0;transform:translate(-50%,-50%) scale(.72) rotate(-4deg)}9%{opacity:.95;transform:translate(-50%,-50%) scale(.96) rotate(1deg)}38%{opacity:.97;transform:translate(-50%,-51.5%) scale(1.045) rotate(2deg)}60%{opacity:.95;transform:translate(-50%,-48.5%) scale(.985) rotate(-2deg)}80%{opacity:1;transform:translate(-50%,-50%) scale(.64,1.3)}100%{opacity:0;transform:translate(-50%,-50%) scale(.09,3.4)}}
@keyframes pmr-mark-pulse{0%,8%{opacity:0;transform:translate(-50%,-43%) scale(.9)}22%{opacity:.8;transform:translate(-50%,-49%) scale(1.01)}46%{opacity:.88;transform:translate(-50%,-51.5%) scale(1.055)}68%{opacity:.76;transform:translate(-50%,-47.5%) scale(.99)}100%{opacity:.04;transform:translate(-50%,-48%) scale(.84)}}
@keyframes pmr-gold-bloom{0%,6%{opacity:0;transform:scale(.5) rotate(-14deg)}22%{opacity:.7;transform:scale(.96) rotate(2deg)}42%{opacity:.84;transform:scale(1.17) rotate(9deg)}60%{opacity:.5;transform:scale(.95) rotate(-6deg)}78%{opacity:.3;transform:scale(1.08,.9) rotate(5deg)}100%{opacity:0;transform:scale(.58,1.66) rotate(15deg)}}
@keyframes pmr-watercolor-wash{0%,5%{opacity:0;transform:translate(calc(-13px * var(--pmr-flow-amp)),calc(8px * var(--pmr-flow-amp))) scale(.68) rotate(-10deg)}23%{opacity:.5;transform:translate(calc(2px * var(--pmr-flow-amp)),calc(-4px * var(--pmr-flow-amp))) scale(.98) rotate(2deg)}44%{opacity:.62;transform:translate(calc(10px * var(--pmr-flow-amp)),calc(2px * var(--pmr-flow-amp))) scale(1.12,.94) rotate(8deg)}64%{opacity:.42;transform:translate(calc(-4px * var(--pmr-flow-amp)),calc(-8px * var(--pmr-flow-amp))) scale(.96,1.12) rotate(-4deg)}100%{opacity:0;transform:translate(calc(44px * var(--pmr-flow-amp)),0) scale(.4,1.66) rotate(14deg)}}
@keyframes pmr-flow-draw{0%{stroke-dashoffset:620;opacity:0;transform:translate(calc(-16px * var(--pmr-flow-amp)),calc(10px * var(--pmr-flow-amp))) scale(.88) rotate(-8deg)}16%{opacity:var(--pmr-path-opacity);transform:translate(calc(-4px * var(--pmr-flow-amp)),calc(-4px * var(--pmr-flow-amp))) scale(.97,1.05) rotate(-2deg)}38%{stroke-dashoffset:120;opacity:var(--pmr-path-opacity);transform:translate(calc(9px * var(--pmr-flow-amp)),calc(6px * var(--pmr-flow-amp))) scale(1.055,.94) rotate(4deg)}58%{stroke-dashoffset:0;opacity:var(--pmr-path-late-opacity);transform:translate(calc(-3px * var(--pmr-flow-amp)),calc(-9px * var(--pmr-flow-amp))) scale(.98,1.07) rotate(-5deg)}78%{opacity:var(--pmr-path-late-opacity);transform:translate(calc(15px * var(--pmr-flow-amp)),calc(-3px * var(--pmr-flow-amp))) scale(1.03,.95) rotate(7deg)}100%{stroke-dashoffset:-150;opacity:.03;transform:translate(calc(40px * var(--pmr-flow-amp)),calc(2px * var(--pmr-flow-amp))) scale(.58,1.36) rotate(15deg)}}
@keyframes pmr-bubble-drift{0%,10%{opacity:0;transform:translate(-5px,9px) scale(.4)}28%{opacity:.46;transform:translate(1px,1px) scale(.88)}54%{opacity:.7;transform:translate(7px,-6px) scale(1.12)}76%{opacity:.24;transform:translate(13px,-11px) scale(1.24)}100%{opacity:0;transform:translate(22px,-14px) scale(1.36)}}
@keyframes pmr-clean-reveal{0%,26%{clip-path:inset(0 100% 0 0)}84%,100%{clip-path:inset(0)}}
@keyframes pmr-beam-travel{0%,26%{left:30%;opacity:0}33%{left:35%;opacity:.8}82%{left:110%;opacity:.8}88%,100%{left:110%;opacity:0}}
@keyframes pmr-finish-glint{0%,60%{opacity:0;transform:scale(.18) rotate(0)}66%{opacity:1;transform:scale(1.12) rotate(12deg)}72%{opacity:.3;transform:scale(.7) rotate(22deg)}78%{opacity:.96;transform:scale(1.04) rotate(32deg)}84%{opacity:.24;transform:scale(.64) rotate(42deg)}89%{opacity:.8;transform:scale(.94) rotate(52deg)}94%,100%{opacity:0;transform:scale(.14) rotate(64deg)}}
/* #endregion PMR:HR-KEYFRAMES */

/* #region PMR:HR-RESPONSIVE */
@media(max-width:900px){.pmr-light-mark{left:55%;width:210px}.pmr-replay{right:12px;top:12px}}
@media(max-width:620px){
  .pm-hero-reveal{--pmr-flow-amp:.82;--pmr-glint-size:14px}
  .pmr-dark{filter:grayscale(.2) saturate(.82) brightness(.94) contrast(.88);transform:none}
  .pmr-dark:after{background:linear-gradient(145deg,rgba(30,73,66,.04),rgba(23,54,51,.09)),radial-gradient(ellipse at 34% 28%,rgba(222,229,225,.15),transparent 50%),radial-gradient(ellipse at 72% 66%,rgba(91,131,121,.08),transparent 54%);background-size:auto;opacity:.58}
  .pmr-clean{filter:saturate(1.01) brightness(1.005) contrast(1.015);transform:none}
  .pmr-clean:after{display:none}
  .pmr-light-mark{left:56%;top:45%;width:162px;filter:drop-shadow(0 0 14px rgba(255,248,220,.6))}
  .pmr-light-mark:before{inset:25%;filter:blur(7px)}
  .pmr-light-mark:after{inset:9%;filter:blur(10px);mix-blend-mode:normal}
  .pmr-light-mark>img{width:70px;filter:sepia(.16) saturate(1.1) drop-shadow(0 0 7px rgba(255,255,246,.74)) drop-shadow(0 0 17px rgba(232,202,119,.46))}
  .pmr-light-mark .pmr-flow{filter:drop-shadow(0 0 7px rgba(255,251,226,.62))}
  .pmr-flow-a{stroke-width:4.6}.pmr-flow-a-echo{stroke-width:8.4}.pmr-flow-b{stroke-width:2.8}.pmr-flow-e{stroke-width:3.5}
  .pmr-bubble{stroke:rgba(236,246,238,.42);stroke-width:1.15}
  .pmr-sweep{width:54%;filter:blur(1px);box-shadow:25px 0 58px rgba(255,248,213,.2);mix-blend-mode:normal}
  .pmr-sweep:before{width:13px;filter:blur(4px);box-shadow:0 0 20px 6px rgba(255,250,222,.18)}
  .pmr-sweep:after{display:none}
  .pmr-glints i:nth-child(n+5){display:none}
  .pmr-replay{width:44px;height:44px;min-height:44px;opacity:.62;background:rgba(7,57,47,.9);backdrop-filter:none;touch-action:manipulation}
  .pmr-replay:before{font-size:1.3rem}
}
@media(pointer:coarse){.pmr-pointer{display:none}}
/* #endregion PMR:HR-RESPONSIVE */

/* #region PMR:HR-REDUCED-MOTION */
@media(prefers-reduced-motion:reduce){.pmr-dark,.pmr-light-mark,.pmr-sweep,.pmr-glints,.pmr-pointer,.pmr-replay{display:none!important}.pmr-clean{animation:none!important;clip-path:inset(0)!important}.pm-hero-reveal .pmr-fallback{visibility:visible}}
/* #endregion PMR:HR-REDUCED-MOTION */
/* #endregion PMR:HERO-REVEAL-CSS-PROTECTED */
