/* Layout fixes (custom overrides loaded after theme breakpoint CSS)
   - Keep section-to-section spacing consistent across breakpoints
   - Avoid accidental gaps around the #scroll anchor */

:root {
  --valentino-section-gap: clamp(16px, 2.2vw, 28px);
}

.page_wrapper > #scroll {
  height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

/* Add a small, consistent breathing room between major blocks. */
.page_wrapper > section:not(.page_hero),
.page_wrapper > div.acf_editor,
.page_wrapper > div.acf_banner,
.page_wrapper > section.acf_box_img_txt,
.page_wrapper > div.container,
.page_wrapper > div.map_wrapper {
  margin-bottom: var(--valentino-section-gap);
}

/* Don't force extra space after the last block (usually the footer). */
.page_wrapper > :last-child {
  margin-bottom: 0 !important;
}

/* Home: image directly under the hero (smaller than full container width). */
.home .home_top_feature_copy,
.home .home_top_feature_img {
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}

.home .home_top_feature_copy {
  text-align: center;
}

.home .home_top_feature_img {
  margin-top: calc(var(--valentino-section-gap) / 1.25);
}

.home .home_top_feature_img img {
  display: block;
  width: 100%;
  height: auto;
}

/* Mobile/tablet: add breathing room between text and image inside the Box Img + Txt blocks. */
@media screen and (max-width: 840px) {
  .acf_box_img_txt > .container > picture {
    margin-top: var(--valentino-section-gap) !important;
  }
}

/* Philosophy: ensure text + image are side-by-side on desktop, stacked on mobile. */
.page-philosophy .acf_box_img_txt > .container {
  display: flex;
  gap: var(--valentino-section-gap);
  align-items: center;
}

.page-philosophy .acf_box_img_txt > .container > div {
  flex: 1 1 55%;
  min-width: 0;
}

.page-philosophy .acf_box_img_txt > .container > picture {
  flex: 1 1 45%;
  min-width: 0;
}

@media screen and (max-width: 840px) {
  .page-philosophy .acf_box_img_txt > .container {
    flex-direction: column;
    align-items: stretch;
  }
}


/* Cookiebot banner: enforce brand blue accents (override any beige/gold defaults) */
:root {
  --valentino-brand-blue: #0E4B6C;
}

#CybotCookiebotDialogNav {
  border-bottom-color: var(--valentino-brand-blue) !important;
}

#CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink.CybotCookiebotDialogActive {
  border-bottom-color: var(--valentino-brand-blue) !important;
}