/* Global CSS overrides for Webflow layout issues
   (extracted from layout.tsx to avoid in-body <style> W3C error) */

/* Fix: wrapper_portfolio-service is a 4-col grid in Webflow CSS,
   but our pages nest portfolio-grid-4col divs inside it.
   Make each row span all columns so cards render at full width. */
.wrapper_portfolio-service > .portfolio-grid-4col {
  grid-column: 1 / -1;
}

/* Hide Lottie on mobile — hero-lottie-init.js skips loading <768px.
   Show a subtle gradient fallback so the hero area isn't empty. */
@media (max-width: 767px) {
  .hero_lottie {
    display: none !important;
  }
}

/* Mobile nav: toggle hamburger ↔ X icon */
.nav-icon-open { display: block; }
.nav-icon-close { display: none; }
.w--open .nav-icon-open { display: none; }
.w--open .nav-icon-close { display: block; }