/* ARABIDS 1.2.128 — full-width photography with taller, more relaxed desktop
   chapters. Increase breathing room INSIDE the real image, never by inserting
   empty strips or separating the photo backgrounds from each other. */

@media (min-width:992px) {
  /* Extend each photographic chapter vertically without changing its width,
     visual identity, overlay text, or soft transitions from v127. */
  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,
    .what_is_section,
    .who_its_for_section,
    .faq_section
  ) {
    box-sizing:border-box !important;
    min-height:clamp(850px,77vw,1120px) !important;
    padding-top:clamp(102px,9vw,152px) !important;
    padding-bottom:clamp(120px,10.5vw,180px) !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
    background-attachment:scroll !important;
  }

  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,
    .what_is_section,
    .who_its_for_section,
    .faq_section
  ) > .container {
    width:100% !important;
    flex:0 0 auto !important;
    position:relative !important;
    z-index:3 !important;
  }

  /* The headline gets its own breathing space over the photograph, then the
     cards sit lower with an intentional but unbroken expanse of imagery. */
  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,
    .what_is_section,
    .who_its_for_section,
    .faq_section
  ) .arabids-editorial-intro {
    min-height:clamp(310px,28vw,418px) !important;
    margin-bottom:clamp(52px,5.5vw,82px) !important;
  }

  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,
    .what_is_section,
    .who_its_for_section,
    .faq_section
  ) :is(.flex,.flex-wrap) {
    row-gap:clamp(22px,2.6vw,42px) !important;
  }
}

/* 992–1199px: retain the additional photo depth, but give content more room
   to wrap instead of compressing the cards into one crowded row. */
@media (min-width:992px) and (max-width:1199px) {
  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,
    .what_is_section,
    .who_its_for_section,
    .faq_section
  ) {
    min-height:880px !important;
    padding-top:94px !important;
    padding-bottom:124px !important;
  }
}
