/* Showpiece 1 — Spritz hero. Visual layer only; text lives in Elementor widgets. */
#spritz-hero {
  position: relative;
  overflow: hidden;
  cursor: crosshair;
  -webkit-tap-highlight-color: transparent;
  background:
    radial-gradient(ellipse 60% 50% at 50% 50%, var(--e-global-color-pnpwhite), transparent 70%),
    radial-gradient(circle at 15% 20%, var(--e-global-color-pnpblush) 0, transparent 40%),
    radial-gradient(circle at 85% 80%, var(--e-global-color-pnpblush) 0, transparent 45%),
    var(--e-global-color-pnpcream) !important;
}
#spritz-hero > .e-con-inner { position: relative; z-index: 2; will-change: transform, opacity; }
#spritz-hero .pnp-spritz-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }

.hero-headline .elementor-heading-title { max-width: 900px; margin: 0 auto; }
.hero-kicker .elementor-heading-title { display: inline-flex; align-items: center; gap: 12px; }
.hero-kicker .elementor-heading-title::before,
.hero-kicker .elementor-heading-title::after { content: ""; width: 28px; height: 1px; background: currentColor; }
.hero-hint .elementor-heading-title { opacity: 0.7; }

.hero-word { display: inline-block; }
#spritz-hero.pnp-hero-ready .hero-word { opacity: 0; transform: translateY(0.35em) rotate(2deg); transition: opacity 0.9s cubic-bezier(.22,1,.36,1), transform 0.9s cubic-bezier(.22,1,.36,1); }
#spritz-hero.pnp-hero-ready.is-in .hero-word { opacity: 1; transform: none; }
#spritz-hero.pnp-hero-ready .hero-kicker,
#spritz-hero.pnp-hero-ready .hero-action,
#spritz-hero.pnp-hero-ready .hero-hint { opacity: 0; transform: translateY(14px); transition: opacity 0.9s cubic-bezier(.22,1,.36,1) 0.7s, transform 0.9s cubic-bezier(.22,1,.36,1) 0.7s; }
#spritz-hero.pnp-hero-ready .hero-kicker { transition-delay: 0.1s; }
#spritz-hero.pnp-hero-ready.is-in .hero-kicker,
#spritz-hero.pnp-hero-ready.is-in .hero-action,
#spritz-hero.pnp-hero-ready.is-in .hero-hint { opacity: 1; transform: none; }

@media (max-width: 767px) {
  .hero-kicker .elementor-heading-title::before,
  .hero-kicker .elementor-heading-title::after { display: none; }
  .hero-kicker .elementor-heading-title { font-size: 11px; letter-spacing: 1.6px; }
}
@media (prefers-reduced-motion: reduce) {
  #spritz-hero.pnp-hero-ready .hero-word,
  #spritz-hero.pnp-hero-ready .hero-kicker,
  #spritz-hero.pnp-hero-ready .hero-action,
  #spritz-hero.pnp-hero-ready .hero-hint { opacity: 1; transform: none; transition: none; }
}
