/* Final visual correction pass (2026-10-11): compact hero-to-program transition,
   balanced programme cards, and a consistent warm SPA background. */
:root {
  --spa-page-bg: #F7F0E4;
  --spa-card-bg: #FFFDF8;
  --spa-card-border: #E5D6BF;
  --spa-ink: #29382F;
  --spa-body: #555C53;
  --spa-green: #1B6048;
  --spa-green-hover: #124A37;
  --spa-gold: #BD955E;
}

/* Keep the entire page on one warm background; cards remain light for contrast. */
html,
body,
header,
#block4_programmsid,
#block5_priceid,
#block2id,
.block3_sertifacate,
#map_block,
#block6_contactsid {
  background-color: var(--spa-page-bg) !important;
  background-image: none !important;
}

/* Keep the programme section close to the hero while retaining clear section hierarchy. */
#block4_programmsid {
  padding-top: clamp(25px, 2.4vw, 34px) !important;
  padding-bottom: clamp(23px, 2.2vw, 30px) !important;
  border-top: 1px solid var(--spa-card-border) !important;
  border-bottom: 1px solid var(--spa-card-border) !important;
  scroll-margin-top: 126px !important;
}
#block4_programmsid > .wrapper {
  width: min(calc(100% - 36px), 1120px) !important;
  max-width: 1120px !important;
  margin-inline: auto !important;
}
#block4_programmsid .block4_h1 {
  margin: 0 auto 20px !important;
  color: var(--spa-ink) !important;
  text-align: center !important;
  text-wrap: balance;
}
#block4_programmsid .owl-carousel {
  max-width: 1080px !important;
  margin: 0 auto !important;
  padding: 0 42px 5px !important;
  box-sizing: border-box !important;
}
#block4_programmsid .owl-stage,
#block4_programmsid .owl-item,
#block4_programmsid .owl-item > .item {
  display: flex !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}
#block4_programmsid .owl-stage {
  align-items: stretch !important;
}
#block4_programmsid .owl-item > .item {
  width: 100% !important;
  min-width: 0 !important;
}

/* Consistent cards: remove the legacy 60px heading padding that created a large gap
   below the illustration; enlarge the art panel and align prices along the bottom. */
#block4_programmsid [class^="slider_bg_item"] {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: auto !important;
  min-height: 330px !important;
  margin: 0 !important;
  padding: 12px 16px 13px !important;
  border: 1px solid var(--spa-card-border) !important;
  border-radius: 16px !important;
  background: var(--spa-card-bg) !important;
  box-shadow: 0 6px 16px rgba(91, 65, 35, .075) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  overflow-wrap: normal !important;
}
#block4_programmsid [class^="slider_bg_item"]:hover {
  border-color: #D5BE98 !important;
  box-shadow: 0 9px 20px rgba(91, 65, 35, .11) !important;
  transform: translateY(-1px) !important;
}
#block4_programmsid [class^="slider_item"][class$="_logo"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 76px !important;
  width: 100% !important;
  height: 76px !important;
  min-height: 76px !important;
  margin: 0 auto 8px !important;
  padding: 4px 10px !important;
  border: 1px solid #EEE2CE !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, #FCF7EE 0%, #F4E9D6 100%) !important;
  box-sizing: border-box !important;
}
#block4_programmsid [class^="slider_item"][class$="_logo"] img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: min(100%, 210px) !important;
  max-height: 66px !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  object-position: center !important;
}
#block4_programmsid [class^="block4_item"][class$="_headline"] {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 38px !important;
  margin: 0 auto 6px !important;
  padding: 0 !important;
  color: var(--spa-green) !important;
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: clamp(15px, 1.05vw, 17px) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
  text-align: center !important;
  text-wrap: balance;
}
#block4_programmsid [class^="slider_item"][class$="_line"] {
  flex: 0 0 2px !important;
  width: 48px !important;
  min-width: 48px !important;
  height: 2px !important;
  margin: 0 auto 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 99px !important;
  background: linear-gradient(90deg, transparent, var(--spa-gold), transparent) !important;
  opacity: 1 !important;
  filter: none !important;
}
#block4_programmsid p[class^="slider_item"][class$="_p"] {
  flex: 1 0 auto !important;
  min-height: 62px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: var(--spa-body) !important;
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.48 !important;
  text-align: left !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}
#block4_programmsid p[class^="slider_item"][class$="_h4"] {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  min-height: 32px !important;
  margin: 0 0 6px !important;
  padding: 6px 9px !important;
  border: 1px solid #EDE1D0 !important;
  border-radius: 8px !important;
  background: #FAF4E9 !important;
  color: var(--spa-green) !important;
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}
#block4_programmsid p[class^="slider_item"][class$="_h4"]:last-child {
  margin-bottom: 0 !important;
}

/* Arrow buttons stay in the side gutters rather than covering card text. */
#block4_programmsid .owl-nav {
  position: absolute !important;
  top: 47% !important;
  right: 0 !important;
  left: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  pointer-events: none !important;
  z-index: 20 !important;
}
#block4_programmsid .owl-nav button.owl-prev,
#block4_programmsid .owl-nav button.owl-next {
  position: absolute !important;
  top: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #D5BE98 !important;
  border-radius: 50% !important;
  background: var(--spa-green) !important;
  color: #FFFDF8 !important;
  box-shadow: 0 4px 11px rgba(29, 71, 52, .16) !important;
  transform: translateY(-50%) !important;
  pointer-events: auto !important;
}
#block4_programmsid .owl-nav button.owl-prev { left: 1px !important; }
#block4_programmsid .owl-nav button.owl-next { right: 1px !important; }
#block4_programmsid .owl-nav button span {
  color: #FFFDF8 !important;
  font-family: Arial, sans-serif !important;
  font-size: 26px !important;
  line-height: 1 !important;
}
#block4_programmsid .owl-dots {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  margin: 7px auto 0 !important;
}
#block4_programmsid .owl-dots .owl-dot span {
  width: 7px !important;
  height: 7px !important;
  margin: 0 !important;
  border-radius: 99px !important;
  background: #DCC9A8 !important;
}
#block4_programmsid .owl-dots .owl-dot.active span {
  width: 18px !important;
  background: var(--spa-green) !important;
}

/* Carry the same page background through pricing, about, certificates, map and contacts. */
#block5_priceid,
#block2id,
.block3_sertifacate,
#map_block,
#block6_contactsid {
  background: var(--spa-page-bg) !important;
  background-image: none !important;
}

@media (max-width: 1024px) {
  #block4_programmsid { padding-top: 25px !important; padding-bottom: 24px !important; }
  #block4_programmsid .block4_h1 { margin-bottom: 17px !important; }
  #block4_programmsid .owl-carousel { padding: 0 36px 5px !important; }
  #block4_programmsid [class^="slider_bg_item"] { padding: 11px 14px 12px !important; }
  #block4_programmsid [class^="slider_item"][class$="_logo"] { flex-basis: 72px !important; height: 72px !important; min-height: 72px !important; }
  #block4_programmsid [class^="slider_item"][class$="_logo"] img { max-height: 62px !important; }
  #block4_programmsid p[class^="slider_item"][class$="_p"] { min-height: 54px !important; font-size: 12.8px !important; }
  #block4_programmsid p[class^="slider_item"][class$="_h4"] { min-height: 30px !important; font-size: 12px !important; }
}

@media (max-width: 767px) {
  #block4_programmsid { padding: 23px 0 22px !important; }
  #block4_programmsid > .wrapper { width: calc(100% - 24px) !important; }
  #block4_programmsid .block4_h1 { margin-bottom: 15px !important; }
  #block4_programmsid .owl-carousel { padding: 0 30px 4px !important; }
  #block4_programmsid [class^="slider_bg_item"] { min-height: 0 !important; padding: 10px 12px 12px !important; border-radius: 14px !important; }
  #block4_programmsid [class^="slider_item"][class$="_logo"] { flex-basis: 68px !important; height: 68px !important; min-height: 68px !important; margin-bottom: 7px !important; padding: 3px 7px !important; }
  #block4_programmsid [class^="slider_item"][class$="_logo"] img { max-width: min(100%, 200px) !important; max-height: 60px !important; }
  #block4_programmsid [class^="block4_item"][class$="_headline"] { min-height: 36px !important; margin: 0 auto 5px !important; padding: 0 !important; font-size: 15px !important; line-height: 1.28 !important; }
  #block4_programmsid [class^="slider_item"][class$="_line"] { margin-bottom: 7px !important; }
  #block4_programmsid p[class^="slider_item"][class$="_p"] { min-height: 0 !important; margin-bottom: 8px !important; font-size: 13px !important; line-height: 1.45 !important; }
  #block4_programmsid p[class^="slider_item"][class$="_h4"] { min-height: 30px !important; padding: 6px 8px !important; margin-bottom: 5px !important; font-size: 12px !important; }
  #block4_programmsid .owl-nav button.owl-prev,
  #block4_programmsid .owl-nav button.owl-next { width: 28px !important; height: 28px !important; }
  #block4_programmsid .owl-nav button span { font-size: 22px !important; }
  #block5_priceid,
  #block2id,
  .block3_sertifacate,
  #map_block,
  #block6_contactsid { background: var(--spa-page-bg) !important; }
}

@media (max-width: 380px) {
  #block4_programmsid > .wrapper { width: calc(100% - 18px) !important; }
  #block4_programmsid .owl-carousel { padding-left: 27px !important; padding-right: 27px !important; }
  #block4_programmsid [class^="slider_bg_item"] { padding: 9px 10px 10px !important; }
  #block4_programmsid [class^="slider_item"][class$="_logo"] { flex-basis: 62px !important; height: 62px !important; min-height: 62px !important; }
  #block4_programmsid [class^="slider_item"][class$="_logo"] img { max-height: 54px !important; }
  #block4_programmsid p[class^="slider_item"][class$="_h4"] { font-size: 11.5px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #block4_programmsid [class^="slider_bg_item"],
  #block4_programmsid .owl-nav button,
  #block4_programmsid .owl-dots .owl-dot span { transition: none !important; }
}

.header-carousel-toggle {
  display: block;
  margin: 10px auto 0;
  padding: 8px 14px;
  border: 1px solid #8b7655;
  border-radius: 999px;
  background: #fffaf2;
  color: #2b3129;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}

.header-carousel-toggle:focus-visible {
  outline: 3px solid #c7a36f;
  outline-offset: 3px;
}

.service-detail-link {
  color: #1b6048 !important;
  font-size: .92em;
  font-weight: 700;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.service-detail-link:focus-visible {
  outline: 3px solid #c7a36f;
  outline-offset: 3px;
}


/* Mobile QA fix: the navigation already contains the brand; remove the oversized duplicate logo below it. */
@media (max-width: 767px) {
  .header_logo,
  .header_top_border {
    display: none !important;
  }
  .block1_headline {
    /* Leave clearance for the fixed mobile navigation after removing the duplicate logo. */
    padding-top: 88px !important;
  }
}
