/* =============================================
   Falcon Sails — Shared Styles
   Everything here loads on every page regardless
   of which Details Block style is selected.
   ============================================= */

/* =============================================
   Hero Banner - Cover Block
   Usage: add "hero-banner" to the cover block's
   Additional CSS class(es) field
   ============================================= */

/* --- Base / Desktop (1200px+) --- */
.wp-block-cover.hero-banner {
  min-height: 700px;
}

/* --- Laptop (1024px – 1199px) --- */
@media (max-width: 1199px) {
  .wp-block-cover.hero-banner[style*="min-height"] {
    min-height: 75vh !important;
  }
}

/* --- Tablet (768px – 1023px) --- */
@media (max-width: 1023px) {
  .wp-block-cover.hero-banner[style*="min-height"] {
    min-height: 60vh !important;
  }
}

/* --- Mobile Landscape (480px – 767px) --- */
@media (max-width: 767px) {
  .wp-block-cover.hero-banner[style*="min-height"] {
    min-height: 50vh !important;
    background-position: center center;
  }
}

/* --- Mobile Portrait (up to 479px) --- */
@media (max-width: 479px) {
  .wp-block-cover.hero-banner[style*="min-height"] {
    min-height: 45vh !important;
    background-position: center center;
  }
}