/* Start custom CSS *//* HWT Services draft: only what v4 controls can't express */
@keyframes svcGridpan { from { background-position: 0 0 } to { background-position: 0 -48px } }
@keyframes svcDrift1 { 0% { transform: translate(0,0) } 50% { transform: translate(8vw,6vh) } 100% { transform: translate(0,0) } }
@keyframes svcDrift2 { 0% { transform: translate(0,0) } 50% { transform: translate(-7vw,-5vh) } 100% { transform: translate(0,0) } }
@keyframes svcHueRot { from { filter: blur(70px) hue-rotate(0deg) } to { filter: blur(70px) hue-rotate(28deg) } }
.hwt-bg-grid { animation: svcGridpan 9s linear infinite; }
.hwt-bg-aurora-1 { animation: svcDrift1 26s ease-in-out infinite, svcHueRot 14s ease-in-out infinite alternate; }
.hwt-bg-aurora-2 { animation: svcDrift2 32s ease-in-out infinite, svcHueRot 18s ease-in-out infinite alternate-reverse; }
@media (prefers-reduced-motion: reduce) { .hwt-bg-grid, .hwt-bg-aurora-1, .hwt-bg-aurora-2 { animation: none !important; } }
/* Entrance animations: Elementor interactions ignore reduced motion, so pin them to their end state */
@media (prefers-reduced-motion: reduce) { .hwt-svc-row, .hwt-cta-row, .hwt-container, .hwt-section-head, .hwt-step-card { opacity: 1 !important; transform: none !important; } }
/* Gradient word inside the h1 (e-heading strips span classes) */
.hwt-h1 span { background: linear-gradient(135deg,#6fe3f0,#b09bf0); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* Live stacks at 880px; site breakpoints are 767/1024 */
@media (max-width: 880px) { .hwt-svc-row, .hwt-step-grid { grid-template-columns: 1fr !important; } }/* End custom CSS */