/* ==========================================================================
   ClientFit — Safari Compatibility Patch
   Path: /wp-content/themes/clientfit-theme/assets/css/cf-safari-fix.css
   Loaded on: front page only
   Version: 9.0.0
   --------------------------------------------------------------------------
   Restores the hero image fix that was previously working.
   The slider in Safari is now handled by cf-marquee.js (unslick + static).
   ========================================================================== */

/* Hero image — Safari column collapse fix */
.wp-block-columns > .wp-block-column.hero-right {
  flex: 0 1 40% !important;
  min-width: 280px;
  max-width: 100%;
}
.wp-block-columns > .wp-block-column.hero-left {
  flex: 1 1 60% !important;
  min-width: 0;
}
.hero-right .hero-image,
.hero-right .wp-block-image {
  display: block;
  width: 100%;
  margin: 0;
}
.hero-right .hero-image img,
.hero-right .wp-block-image img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
}
@supports (-webkit-touch-callout: none) {
  .wp-block-columns > .wp-block-column.hero-right {
    flex-basis: 40% !important;
    width: 40%;
  }
  .wp-block-columns > .wp-block-column.hero-left {
    flex-basis: 60% !important;
    width: 60%;
  }
}
@media (max-width: 781px) {
  .wp-block-columns > .wp-block-column.hero-right,
  .wp-block-columns > .wp-block-column.hero-left {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100%;
  }
}