/* ============================================================
   Proactiva Textil — Contacto premium motion layer (page 435 only).
   Loads AFTER contacto-premium.css so it wins the cascade. Adds living
   gradients, floating brand orbs, a glass quote-form card and richer
   selling cues. All motion is disabled under prefers-reduced-motion.
   ============================================================ */

/* ---------- 1. HERO: living gradient + floating orbs ---------- */
body.page-id-435 .elementor-section:first-child {
  background: linear-gradient(115deg, #021f29 0%, #042f3d 30%, #0b617e 62%, #063d4f 100%) !important;
  background-size: 280% 280% !important;
  animation: ptGradPan 16s ease-in-out infinite;
  position: relative;
  overflow: hidden;
}
body.page-id-435 .elementor-section:first-child::before,
body.page-id-435 .elementor-section:first-child::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  pointer-events: none;
  z-index: 0;
}
body.page-id-435 .elementor-section:first-child::before {
  width: 480px; height: 480px; top: -160px; right: -120px;
  background: radial-gradient(circle, rgba(165, 200, 63, .35), transparent 70%);
  animation: ptFloatA 11s ease-in-out infinite;
}
body.page-id-435 .elementor-section:first-child::after {
  width: 380px; height: 380px; bottom: -140px; left: -100px;
  background: radial-gradient(circle, rgba(37, 211, 102, .22), transparent 70%);
  animation: ptFloatB 14s ease-in-out infinite;
}
body.page-id-435 .elementor-section:first-child .elementor-container { position: relative; z-index: 1; }

/* ---------- 2. STATS band: soft shimmer sweep ---------- */
body.page-id-435 .elementor-section:nth-child(2) {
  position: relative;
  overflow: hidden;
}
body.page-id-435 .elementor-section:nth-child(2)::after {
  content: "";
  position: absolute; top: 0; bottom: 0; width: 40%;
  left: -40%;
  background: linear-gradient(105deg, transparent, rgba(165, 200, 63, .06), transparent);
  animation: ptSweep 7s ease-in-out infinite;
  pointer-events: none;
}

/* ---------- 3. FORM section: breathing backdrop + glass card ---------- */
body.page-id-435 .elementor-section:nth-child(3) {
  background:
    radial-gradient(700px 420px at 85% 20%, rgba(165, 200, 63, .12), transparent 65%),
    radial-gradient(560px 420px at 8% 90%, rgba(11, 97, 126, .10), transparent 65%),
    #FFFFFF !important;
  position: relative;
  overflow: hidden;
}
body.page-id-435 .elementor-section:nth-child(3)::before {
  content: "";
  position: absolute; width: 420px; height: 420px; top: 8%; right: -140px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(165, 200, 63, .16), transparent 70%);
  filter: blur(50px);
  animation: ptBreathe 9s ease-in-out infinite;
  pointer-events: none;
}

/* Quote form -> premium glass card with lime crown */
body.page-id-435 .elementor-section:nth-child(3) .elementor-column:last-child > .elementor-widget-wrap {
  position: relative;
  background: rgba(255, 255, 255, .82);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(4, 47, 61, .08);
  border-radius: 22px;
  padding: 38px 34px 34px !important;
  box-shadow: 0 30px 70px rgba(4, 47, 61, .14);
  overflow: hidden;
}
body.page-id-435 .elementor-section:nth-child(3) .elementor-column:last-child > .elementor-widget-wrap::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 5px;
  background: linear-gradient(90deg, var(--pt-lime), var(--pt-teal), var(--pt-lime));
  background-size: 200% 100%;
  animation: ptFooterEdge2 7s linear infinite;
}

/* Fields: soft, rounded, lime focus ring */
body.page-id-435 .elementor-form .elementor-field {
  border-radius: 12px !important;
  border: 1.5px solid #E2E8E0 !important;
  background: #FAFCF6 !important;
  transition: border-color .15s ease-out, box-shadow .15s ease-out;
  min-height: 46px;
}
body.page-id-435 .elementor-form .elementor-field:focus {
  border-color: var(--pt-lime) !important;
  box-shadow: 0 0 0 4px rgba(165, 200, 63, .18) !important;
  outline: none;
}
body.page-id-435 .elementor-form label { letter-spacing: .3px; }

/* Submit: lime pill, petrol text (accessible), glow + lift */
body.page-id-435 .elementor-form .elementor-button {
  background: var(--pt-lime) !important;
  color: var(--pt-petrol) !important;
  font-weight: 700 !important;
  width: 100%;
  min-height: 52px;
  box-shadow: 0 10px 26px rgba(165, 200, 63, .45);
}
body.page-id-435 .elementor-form .elementor-button:hover {
  background: #b6d85e !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(165, 200, 63, .55);
}

/* ---------- 6. Final CTA: living lime gradient ---------- */
body.page-id-435 .elementor-section:last-child {
  background: linear-gradient(120deg, #8ab030 0%, #a5c83f 45%, #7a9c2a 100%) !important;
  background-size: 240% 240% !important;
  animation: ptGradPan 13s ease-in-out infinite;
  position: relative;
  overflow: hidden;
}
body.page-id-435 .elementor-section:last-child::before {
  content: "";
  position: absolute; width: 460px; height: 460px; top: -180px; right: 6%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, .22), transparent 70%);
  filter: blur(46px);
  animation: ptFloatA 12s ease-in-out infinite;
  pointer-events: none;
}

/* ---------- Keyframes ---------- */
@keyframes ptGradPan { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes ptFloatA { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(-36px, 30px) scale(1.12); } }
@keyframes ptFloatB { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(40px, -26px) scale(1.08); } }
@keyframes ptSweep { 0% { left: -45%; } 55%, 100% { left: 110%; } }
@keyframes ptBreathe { 0%, 100% { transform: scale(1); opacity: .8; } 50% { transform: scale(1.18); opacity: 1; } }
@keyframes ptFooterEdge2 { to { background-position: -200% 0; } }

@media (prefers-reduced-motion: reduce) {
  body.page-id-435 .elementor-section,
  body.page-id-435 .elementor-section::before,
  body.page-id-435 .elementor-section::after,
  body.page-id-435 .elementor-widget-wrap::before {
    animation: none !important;
  }
}
