/* La Parenthèse Enchantée — Intro signature production
   Isolation complète par préfixe lpe-intro- pour éviter les collisions. */

html.lpe-intro-active,
html.lpe-intro-active body {
  overflow: hidden;
}

.lpe-intro {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  overflow: hidden;
  background: radial-gradient(circle at 50% 44%, #fffef9 0, #f9edda 41%, #dec69e 100%);
  opacity: 1;
  transition: opacity .68s ease;
  contain: layout paint;
}

.lpe-intro.is-gone {
  display: none;
}

.lpe-intro__garden {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 50% 65%, rgba(255,255,244,.6), transparent 35%),
    linear-gradient(to top, rgba(128,105,57,.14), transparent 35%);
  filter: saturate(.9);
}

.lpe-intro__haze {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: radial-gradient(circle at center, transparent 26%, rgba(76,52,23,.085));
  transition: opacity 1.1s ease;
}

.lpe-intro__paren {
  position: absolute;
  top: 50%;
  width: min(23vw, 310px);
  height: 82vh;
  z-index: 5;
  filter:
    drop-shadow(0 0 5px #fff8df)
    drop-shadow(0 0 13px #ffd979)
    drop-shadow(0 0 24px #e9a6344f);
  will-change: transform, opacity;
}

.lpe-intro__paren::after {
  content: "";
  position: absolute;
  inset: 8% 12%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255,240,188,.16), transparent 68%);
  filter: blur(14px);
  opacity: .5;
  animation: lpeIntroAura 1.8s ease-in-out infinite alternate;
  pointer-events: none;
}

.lpe-intro__paren--left {
  left: 50%;
  transform: translate(-120%, -50%);
}

.lpe-intro__paren--right {
  right: 50%;
  transform: translate(120%, -50%);
}

.lpe-intro__paren svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.lpe-intro__line {
  fill: none;
  stroke: url(#lpeIntroGold);
  stroke-width: 5.6;
  stroke-linecap: round;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: lpeIntroDraw 1.45s ease .15s forwards;
}

.lpe-intro__shine {
  fill: none;
  stroke: #fff9dc;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: lpeIntroDraw 1.45s ease .32s forwards;
}

.lpe-intro__flower,
.lpe-intro__spark-svg {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: lpeIntroBloom .45s cubic-bezier(.2,.8,.2,1) forwards;
}

.lpe-intro__f1 { animation-delay: .62s; }
.lpe-intro__f2 { animation-delay: .82s; }
.lpe-intro__f3 { animation-delay: 1.02s; }
.lpe-intro__f4 { animation-delay: 1.20s; }
.lpe-intro__f5 { animation-delay: 1.38s; }

.lpe-intro__pink { fill: #efb7c0; }
.lpe-intro__white { fill: #fff8ed; }
.lpe-intro__spark-svg {
  fill: #fff8d7;
  filter: drop-shadow(0 0 5px #fff) drop-shadow(0 0 9px #ffc94d);
}

.lpe-intro__center {
  position: absolute;
  inset: 0;
  z-index: 7;
  display: grid;
  place-items: center;
  text-align: center;
  transition: opacity .68s ease, transform 1.05s ease;
}

.lpe-intro__inner {
  padding: 1.5rem;
}

.lpe-intro__logo {
  width: min(190px, 26vw);
  max-height: 170px;
  object-fit: contain;
  opacity: 0;
  transform: scale(.78);
  animation: lpeIntroLogo .7s ease .55s forwards;
}

.lpe-intro__brand {
  margin: .35rem 0;
  color: #302b27;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4.3vw, 4rem);
  font-weight: 400;
  line-height: 1.05;
  opacity: 0;
  animation: lpeIntroFade .6s ease .82s forwards;
}

.lpe-intro__tag {
  color: #8d713e;
  font: 700 .7rem/1.6 Arial, sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  opacity: 0;
  animation: lpeIntroFade .6s ease 1s forwards;
}

.lpe-intro__script {
  margin-top: 1rem;
  color: #ad6874;
  font: italic 1.15rem Georgia, "Times New Roman", serif;
  opacity: 0;
  animation: lpeIntroFade .6s ease 1.18s forwards;
}

.lpe-intro__layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.lpe-intro__layer--back { z-index: 2; filter: blur(1.5px); }
.lpe-intro__layer--mid { z-index: 6; }
.lpe-intro__layer--front { z-index: 9; }

.lpe-intro__particle {
  position: absolute;
  will-change: transform, opacity;
}

.lpe-intro__dust {
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: #ffe8a7;
  box-shadow: 0 0 5px #ffc956;
}

.lpe-intro__star {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 6px #fff, 0 0 13px #ffc84f;
}

.lpe-intro__petal {
  width: 10px;
  height: 14px;
  border-radius: 70% 30% 70% 30%;
  background: linear-gradient(135deg, #eeb6c0, #fff0f1);
}

.lpe-intro__butterfly {
  color: #ffd77e;
  font-size: 16px;
  text-shadow: 0 0 8px #fff, 0 0 12px #f7b83d;
}

.lpe-intro__paw {
  color: #fff0bd;
  font: 14px Arial, sans-serif;
  text-shadow: 0 0 7px #fff, 0 0 13px #ffc95b;
}

.lpe-intro__flash {
  position: absolute;
  inset: 0;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  background: radial-gradient(ellipse, rgba(255,249,219,.68), transparent 50%);
}

.lpe-intro__skip {
  position: absolute;
  right: 24px;
  bottom: 22px;
  z-index: 12;
  border: 0;
  padding: .55rem .7rem;
  background: transparent;
  color: #70685e;
  font: 500 .82rem Arial, sans-serif;
  cursor: pointer;
}

.lpe-intro__skip:hover,
.lpe-intro__skip:focus-visible {
  color: #3e372f;
  text-decoration: underline;
}

.lpe-intro.is-opening .lpe-intro__paren--left {
  animation: lpeIntroOpenLeft 1.55s cubic-bezier(.72,0,.18,1) forwards;
}

.lpe-intro.is-opening .lpe-intro__paren--right {
  animation: lpeIntroOpenRight 1.55s cubic-bezier(.72,0,.18,1) forwards;
}

.lpe-intro.is-opening .lpe-intro__center {
  opacity: 0;
  transform: scale(.97);
}

.lpe-intro.is-opening .lpe-intro__haze {
  opacity: 0;
}

.lpe-intro.is-opening .lpe-intro__flash {
  animation: lpeIntroFlash 1.18s ease;
}

@keyframes lpeIntroDraw {
  to { stroke-dashoffset: 0; }
}

@keyframes lpeIntroBloom {
  from { opacity: 0; transform: scale(.05) rotate(-25deg); }
  to { opacity: 1; transform: scale(1) rotate(0); }
}

@keyframes lpeIntroLogo {
  to { opacity: 1; transform: scale(1); }
}

@keyframes lpeIntroFade {
  to { opacity: 1; }
}

@keyframes lpeIntroAura {
  from { opacity: .28; transform: scale(.96); }
  to { opacity: .58; transform: scale(1.04); }
}

@keyframes lpeIntroOpenLeft {
  to { transform: translate(-325%, -50%) scale(1.18) rotate(-6deg); opacity: .05; }
}

@keyframes lpeIntroOpenRight {
  to { transform: translate(325%, -50%) scale(1.18) rotate(6deg); opacity: .05; }
}

@keyframes lpeIntroFlash {
  0% { opacity: 0; }
  40% { opacity: .34; }
  100% { opacity: 0; }
}

@media (max-width: 800px) {
  .lpe-intro__paren {
    width: 35vw;
    height: 73vh;
  }

  .lpe-intro__brand {
    font-size: clamp(1.75rem, 8vw, 2.7rem);
  }

  .lpe-intro__tag {
    font-size: .63rem;
  }

  .lpe-intro__script {
    font-size: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lpe-intro {
    display: none !important;
  }
}
