/* ===================================================================
Lumex marketing polish layer  (loaded only on marketing pages)
- scroll-reveal safety net
- card / tile hover elevation
- animated hero heading letters
=================================================================== */

/* Scroll-reveal: never leave content hidden if AOS fails or motion is reduced */
.aos-off [data-aos] { opacity: 1 !important; transform: none !important; }
[data-aos] { will-change: opacity, transform; }

/* ---- Hover elevation for cards ---- */
.card {
  transition: transform .18s ease, border-color .18s ease;
}

a.card { text-decoration: none; }
a.card:hover { border-color: var(--color-primary); }

/* Soften AOS fade-up to a subtle 10px rise */
[data-aos="fade-up"] { transform: translate3d(0, 10px, 0); }

@media (prefers-reduced-motion: reduce) {
  .card { transition: none; }
  .card:hover { transform: none; }
}

/* ---- Tighter spacing on phones ---- */
@media (max-width: 640px) {
  .section { padding-block: 30px; padding-inline: 14px; }
  .footer { padding: 44px 20px 24px; }
  .marketing-nav-inner { padding: 12px 18px; }
  .lead { font-size: 16px; }
  .hero-eyebrow { margin-bottom: 18px; }
}
@media (max-width: 560px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 26px; } }

/* wui-* pickers (select / datepicker / autocomplete / multiselect / phone) open a
   position:fixed menu, and a transformed ANCESTOR reparents fixed positioning, throwing
   the menu off-screen. AOS leaves a residual transform on every animated section, so
   neutralize it on any section that contains such a control. The menu then anchors to the
   viewport and opens in place. This is the automatic, permanent version of the per-section
   data-no-aos opt-out — a picker-bearing section simply never carries a transform. */
section:has(wui-select, wui-datepicker, wui-autocomplete, wui-multiselect, wui-phone) {
  transform: none !important;
}