/* =========================================================================
   VIVEK DIGITAL — Thank You Page Animation System
   Scoped exclusively to body.page-id-345 (Thank You / post-submit).
   Content is a flat stack of Elementor containers, so this uses a
   content-agnostic reveal system (JS adds .ty-reveal/.ty-in) rather than
   hardcoded per-block hashes — robust if the page content is edited later.
   Tokens shared with the rest of the site (Astra blue palette).
   No content, text, layout, colors, or functionality are altered — only
   opacity/transform/background transitions are added.
   ========================================================================= */

body.page-id-345 {
  --ty-blue: #046BD2;
  --ty-blue-dark: #045CB4;
  --ty-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---- base reveal primitive (opacity/transform only, zero layout shift) ---- */
body.page-id-345 .ty-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.65s var(--ty-ease), transform 0.65s var(--ty-ease);
  transition-delay: var(--ty-delay, 0ms);
  will-change: opacity, transform;
}
body.page-id-345 .ty-reveal.ty-in {
  opacity: 1;
  transform: translateY(0);
}

/* the very first block ("🎉 Thank You!") gets a slightly softer scale-in
   flourish instead of plain translateY, since it's the confirmation moment */
body.page-id-345 .elementor-345 > .elementor-element:nth-child(1).ty-reveal {
  transform: translateY(14px) scale(0.97);
}
body.page-id-345 .elementor-345 > .elementor-element:nth-child(1).ty-reveal.ty-in {
  transform: translateY(0) scale(1);
}

/* =========================================================================
   Ambient success glow — extremely subtle, brand-blue, slow pulse
   ========================================================================= */
body.page-id-345 .elementor-345 {
  position: relative;
}
body.page-id-345 .elementor-345::before {
  content: "";
  position: absolute;
  top: -60px;
  left: 50%;
  transform: translateX(-50%);
  width: 640px;
  height: 320px;
  max-width: 90vw;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(circle, rgba(4, 107, 210, 0.055) 0%, transparent 70%);
  animation: ty-pulse 7s ease-in-out infinite;
}
@keyframes ty-pulse {
  0%, 100% { opacity: 0.7; transform: translateX(-50%) scale(1); }
  50%      { opacity: 1;   transform: translateX(-50%) scale(1.05); }
}
body.page-id-345 .elementor-345 > .elementor-element {
  position: relative;
  z-index: 1;
}

/* =========================================================================
   Mobile optimization — no background pulse loop, lighter reveal distance
   ========================================================================= */
@media (max-width: 767px) {
  body.page-id-345 .elementor-345::before {
    animation: none;
  }
  body.page-id-345 .ty-reveal {
    transform: translateY(14px);
  }
  body.page-id-345 .elementor-345 > .elementor-element:nth-child(1).ty-reveal {
    transform: translateY(10px) scale(0.98);
  }
}

/* =========================================================================
   Respect prefers-reduced-motion — static, fully visible, no motion
   ========================================================================= */
@media (prefers-reduced-motion: reduce) {
  body.page-id-345 * {
    animation: none !important;
    transition: none !important;
  }
  body.page-id-345 .ty-reveal,
  body.page-id-345 .elementor-345 > .elementor-element:nth-child(1).ty-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}