/**
 * Club Med visual foundation v1.2.3
 * Central design tokens and non-destructive overrides for legacy components.
 */
:root {
  --cm-primary: #1E2241;
  --cm-primary-rgb: 30, 34, 65;
  --cm-primary-hover: #30365F;
  --cm-primary-strong: #15182F;
  --cm-warm: #F7F0E9;
  /* Shared layout tokens for theme blocks and the integration UI. */
  --cm-container-width: 1200px;
  --cm-wide-width: 1440px;
  --cm-container-gutter: 24px;
  --cm-surface-warm: var(--cm-warm);
  --cm-warm-strong: #EEE2D7;
  --cm-warm-watermark: #A19C97;
  --cm-surface: #FFFFFF;
  --cm-surface-muted: #F8F8FA;
  --cm-text: #1E2241;
  --cm-text-body: #34364A;
  --cm-text-muted: #6D6F7E;
  --cm-border: rgba(var(--cm-primary-rgb, 30, 34, 65), .14);
  --cm-border-strong: rgba(var(--cm-primary-rgb, 30, 34, 65), .24);
  --cm-focus: rgba(var(--cm-primary-rgb, 30, 34, 65), .22);
  --cm-success: #287A52;
  --cm-warning: #A46316;
  --cm-danger: #A32E32;
  --cm-radius-sm: 8px;
  --cm-radius-md: 14px;
  --cm-radius-lg: 20px;
  --cm-radius-pill: 999px;
  --cm-shadow-sm: 0 4px 16px rgba(var(--cm-primary-rgb, 30, 34, 65), .08);
  --cm-shadow-md: 0 12px 34px rgba(var(--cm-primary-rgb, 30, 34, 65), .12);
  --cm-shadow-lg: 0 22px 60px rgba(var(--cm-primary-rgb, 30, 34, 65), .16);
  --cm-space-1: 4px;
  --cm-space-2: 8px;
  --cm-space-3: 12px;
  --cm-space-4: 16px;
  --cm-space-5: 24px;
  --cm-space-6: 32px;
  --cm-space-7: 48px;
  --cm-space-8: 64px;
  --cm-space-9: 96px;
  --cm-transition: 180ms ease;
}

html { scroll-behavior: smooth; }
html, body {
  color: var(--cm-text-body);
  background: var(--cm-surface);
  font-size: 17px;
  line-height: 1.6;
}
body { text-rendering: optimizeLegibility; }
::selection { background: var(--cm-primary); color: #fff; }

body a { transition: color var(--cm-transition), background-color var(--cm-transition), border-color var(--cm-transition), box-shadow var(--cm-transition), transform var(--cm-transition), opacity var(--cm-transition); }
body a:focus-visible,
body button:focus-visible,
/* Do not impose a second focus ring on embedded plugin form controls. */
.gform_wrapper input:focus-visible,
.gform_wrapper select:focus-visible,
.gform_wrapper textarea:focus-visible,
.club-single .club-form input:focus-visible,
.club-single .club-form select:focus-visible,
.club-single .club-form textarea:focus-visible,
.search input:focus-visible,
.footer .newsletter input:focus-visible {
  outline: 3px solid var(--cm-focus);
  outline-offset: 3px;
}

h1, h2, h3, h4, h5, h6,
.title {
  color: var(--cm-primary);
  font-weight: 700;
  letter-spacing: -.015em;
}
h1 { font-size: clamp(calc(2.15rem - 3px), calc(4vw - 3px), calc(3.4rem - 3px)); line-height: 1.08; }
h2 { font-size: clamp(calc(1.8rem - 3px), calc(3vw - 3px), calc(2.55rem - 3px)); line-height: 1.13; }
h3 { font-size: clamp(calc(1.45rem - 3px), calc(2.3vw - 3px), calc(2rem - 3px)); line-height: 1.18; }
h4 { font-size: clamp(calc(1.2rem - 3px), calc(1.8vw - 3px), calc(1.55rem - 3px)); line-height: 1.25; }
h5 { font-size: calc(1.15rem - 3px); line-height: 1.3; }
h6 { font-size: calc(1rem - 3px); line-height: 1.35; }
.main p { line-height: 1.68; }
.main a:not(.button):not(.box):not(.wp-block-button__link) { color: var(--cm-primary); text-underline-offset: .18em; }

.container,
.main > *:not(.alignwide):not(.alignfull),
.shadow-box > *:not(.alignwide):not(.alignfull),
#breadcrumbs, .breadcrumbs {
  max-width: var(--cm-container-width, 1200px);
  box-sizing: border-box;
}

/* Header */
.header { color: var(--cm-primary); }
.header .header__contact-bar {
  background: var(--cm-primary);
  padding: 10px 0;
}
.header .header__menu {
  background: rgba(255,255,255,.98);
  border-bottom: 1px solid var(--cm-border);
  padding: 20px 0;
}
.header.header--scrolled {
  box-shadow: 0 8px 28px rgba(var(--cm-primary-rgb, 30, 34, 65), .12);
}
.header .nav .nav__element .nav__link,
.header .subnav .subnav__element .subnav__link {
  color: var(--cm-primary);
  font-weight: 500;
}
.header .nav .nav__element .nav__link:after { height: 2px !important; background: var(--cm-primary); }
.header .subnav {
  border-top: 0;
  border-radius: 0 0 var(--cm-radius-md) var(--cm-radius-md);
  box-shadow: var(--cm-shadow-md);
}
.header .subnav .subnav__element .subnav__link .subnav__image { border-radius: var(--cm-radius-sm); }
.header__account-link {
  width: 40px;
  height: 40px;
  margin-left: 14px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--cm-warm);
}
.header__account-link:hover { background: var(--cm-warm-strong); transform: translateY(-1px); }
.header__account-icon { width: 20px; height: 20px; display: block; }

/* Mobile navigation */
#mobile-menu { width: min(340px, calc(100vw - 48px)); background: var(--cm-surface); }
.mobile-menu .nav .nav__element .nav__link,
.mobile-menu .subnav .subnav__element .subnav__link { color: var(--cm-primary); }

/* Hero / headbar */
.headbar .headbar__container { min-height: 420px; }
.headbar .headbar__container:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(90deg, rgba(20,22,43,.42) 0%, rgba(20,22,43,.10) 58%, rgba(20,22,43,0) 100%);
}
.headbar .headbar__content { z-index: 2; }
.headbar .headbar__container .headbar__content .headbar__title,
.headbar .headbar__content .headbar__title {
  font-size: clamp(calc(2.5rem - 3px), calc(5vw - 3px), calc(4rem - 3px));
  line-height: 1.04;
  letter-spacing: -.025em;
  text-shadow: 0 3px 20px rgba(0,0,0,.28);
}
.headbar .headbar__container .headbar__search,
.slider .slider__search {
  background: rgba(255,255,255,.94);
  box-shadow: var(--cm-shadow-md);
  border: 1px solid rgba(255,255,255,.7);
}
.headbar .headbar__button,
.slider .slider__content .slider__button {
  background: var(--cm-primary);
  border-radius: var(--cm-radius-pill);
  box-shadow: var(--cm-shadow-sm);
}
.headbar .headbar__button:hover,
.slider .slider__content .slider__button:hover { background: var(--cm-primary-hover); transform: translateY(-1px); }
.headbar .headbar__text {
  color: var(--cm-primary);
  box-shadow: 0 4px 20px rgba(var(--cm-primary-rgb, 30, 34, 65), .08);
}

/* Generic buttons */
.button,
.wp-block-button__link,
.gform_wrapper .gform_footer .gform_button {
  border-radius: var(--cm-radius-pill);
}
.button.button--default-inverted {
  border-color: var(--cm-primary);
  color: var(--cm-primary);
  padding: 11px 28px;
}
.button.button--default-inverted:hover,
.button.button--default-inverted:focus,
.button.button--default-inverted.button--active {
  color: #fff;
  background: var(--cm-primary);
}
.wp-block-button__link { background: var(--cm-primary); color: #fff; padding: .8em 1.55em; }
.wp-block-button__link:hover { background: var(--cm-primary-hover); }

/* Cards / legacy tiles */
.boxes { gap: 24px; margin-bottom: var(--cm-space-8); }
.boxes .boxes__box {
  border-radius: var(--cm-radius-md);
  box-shadow: var(--cm-shadow-sm);
  background: var(--cm-warm);
}
.boxes .box { isolation: isolate; }
/* Avoid permanently compositing every lazy-loaded club image. Chrome can keep
   image layers blank until a hover transform invalidates the paint. */
.boxes .box .box__label {
  padding: 22px 20px 18px;
  width: calc(100% - 40px);
  font-size: 23px;
  line-height: 1.18;
  text-shadow: 0 2px 12px rgba(0,0,0,.42);
}
.boxes.boxes--promotion .box .box__label {
  color: var(--cm-primary);
  background: rgba(247,240,233,.92);
  font-weight: 700;
}
.boxes.boxes--promotion .box:hover .box__label { background: var(--cm-warm); }
.boxes.boxes--club .box .box__price,
.boxes.boxes--clubs .box .box__price {
  background: rgba(var(--cm-primary-rgb), .9);
  border-radius: var(--cm-radius-pill) 0 0 var(--cm-radius-pill);
}
.boxes.boxes--club .boxes__button-more {
  background: var(--cm-primary);
  border-radius: var(--cm-radius-pill);
  box-shadow: var(--cm-shadow-sm);
}
.boxes.boxes--club .boxes__button-more:hover { background: var(--cm-primary-hover); }
.club-shot {
  border: 1px solid var(--cm-border);
  border-radius: var(--cm-radius-md);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--cm-shadow-sm);
}

/* Main content surfaces */
.shadow-box {
  box-shadow: 0 0 9px rgba(0,0,0,.5);
  border: 1px solid var(--cm-border);
  border-radius: var(--cm-radius-md);
}
.main blockquote {
  margin: 2rem 0;
  padding: 1.2rem 1.5rem;
  border-left: 4px solid var(--cm-primary);
  background: var(--cm-warm);
}

/* Forms */
/* Font inheritance only for controls owned by the theme or Gravity Forms.
   Club Med Integration provides its own typography and form-state styles. */
.gform_wrapper :is(input, select, textarea, button),
.club-single .club-form :is(input, select, textarea, button),
.search :is(input, button),
.footer .newsletter :is(input, button) { font: inherit; }
.gform_wrapper .gform_fields .gfield .ginput_container input:not([type=checkbox]):not([type=radio]):not([type=submit]),
.gform_wrapper .gform_fields .gfield .ginput_container select:not([type=checkbox]):not([type=radio]):not([type=submit]),
.gform_wrapper .gform_fields .gfield .ginput_container textarea,
.club-single .club-form .club-single__form-group .club-single__form-input {
  color: var(--cm-text);
  background: #fff;
  border: 1px solid var(--cm-border-strong) !important;
  border-radius: var(--cm-radius-sm);
  padding: 11px 13px;
  min-height: 44px;
  box-sizing: border-box;
}
/* Do not style generic input/select/textarea: CMI handles its own controls. */
.gform_wrapper textarea,
.club-single .club-form textarea { min-height: 120px; }
.gform_wrapper .ginput_container :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus,
.club-single .club-form :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  border-color: var(--cm-primary) !important;
  box-shadow: 0 0 0 3px var(--cm-focus);
  outline: 0;
}
.gform_wrapper .gform_footer .gform_button {
  background: var(--cm-primary);
  border: 0;
  font-size: 17px;
  padding: 13px 28px;
  margin-top: 24px;
}
.gform_wrapper .gform_footer .gform_button:hover { background: var(--cm-primary-hover); }

/* Club pages */
.club-single .club-element {
  border-radius: var(--cm-radius-md);
  overflow: hidden;
  box-shadow: var(--cm-shadow-sm);
  border: 1px solid var(--cm-border);
}
.club-single .club-element .club-element__content { border-color: #fff; }
.club-single .club-form .club-single__form-options .option {
  border: 1px solid var(--cm-border);
  border-radius: var(--cm-radius-md);
  box-shadow: var(--cm-shadow-sm);
}
.club-tabs .club-tabs__menu { gap: 4px; }
.club-single .club-single__calendar.club-calendar .club-calendar__months-list { gap: 8px; }
.club-single .club-single__calendar.club-calendar .club-calendar__months-list .club-calendar__single-month {
  margin: 0;
  background: var(--cm-warm);
  border-radius: var(--cm-radius-sm);
}
.club-single .club-single__calendar.club-calendar .club-calendar__months-list .club-calendar__single-month.club-calendar__single-month--active { background: var(--cm-primary); }

/* Pagination and breadcrumbs */
.clubs-pagination { margin-top: 0; }
.clubs-pagination .page-numbers {
  border-color: var(--cm-border);
  border-radius: var(--cm-radius-sm);
  color: var(--cm-primary);
  min-width: 38px;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.clubs-pagination .page-numbers:hover { background: var(--cm-warm); }
.clubs-pagination .page-numbers.current,
.clubs-pagination .page-numbers.current:hover { background: var(--cm-primary); border-color: var(--cm-primary); color: #fff; }
#breadcrumbs a, .breadcrumbs a, .breadcrumb_last {
  border: 0;
  padding: 6px 0;
  color: var(--cm-text-muted);
}
#breadcrumbs a:hover, .breadcrumbs a:hover { color: var(--cm-primary); }

/* Footer */
.footer .footer__newsletter {
  min-height: 0;
  color: var(--cm-primary);
  background: var(--cm-warm);
}
.footer .footer__newsletter .footer__overlay {
  padding: 56px 0 62px;
  background: none;
}
.footer .footer__newsletter .title.title--white { color: var(--cm-primary); }
.footer .footer__newsletter .newsletter { width: min(760px, 100%); }
.footer .footer__newsletter .newsletter .newsletter__input {
  border: 1px solid var(--cm-border-strong);
  border-radius: var(--cm-radius-pill);
  background: #fff;
  color: var(--cm-primary);
  min-height: 48px;
  box-sizing: border-box;
}
.footer .footer__newsletter .newsletter .newsletter__input::placeholder { color: var(--cm-text-muted); }
.footer .footer__newsletter .newsletter .newsletter__submit {
  border: 1px solid var(--cm-primary);
  border-radius: var(--cm-radius-pill);
  background: var(--cm-primary);
  color: #fff;
  min-height: 48px;
}
.footer .footer__newsletter .newsletter .newsletter__submit:hover { background: var(--cm-primary-hover); color: #fff; }
.footer .footer__newsletter .newsletter .newsletter__agreement { text-align: center; }
.footer .footer__newsletter .newsletter .newsletter__agreement .newsletter__label { color: var(--cm-text-body); }
.footer .footer__contact { background: var(--cm-primary); }
.footer .contact-bar { box-shadow: none; border-top: 1px solid rgba(255,255,255,.12); }
.footer .contact-bar .contact-bar__button { background: var(--cm-primary); box-shadow: none; }
.footer .footer__copyrights {
  background-color: var(--cm-primary-strong);
  padding-top: 64px;
}
.footer .footer__copyrights:before { opacity: .45; }
.footer .footer__copyrights .copyrights .copyrights__text { margin: 36px 0 60px; line-height: 1.6; }

/* Utility surfaces for future blocks */
.cm-surface-warm { background: var(--cm-warm); }
.cm-surface-primary { background: var(--cm-primary); color: #fff; }
.cm-section { padding-block: clamp(48px, 7vw, 96px); }
.cm-section--compact { padding-block: clamp(32px, 5vw, 64px); }
.cm-eyebrow { color: var(--cm-primary); font-size: .8rem; line-height: 1.2; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

@media (max-width: 1200px) {
  .container,
  .main > *:not(.alignwide):not(.alignfull),
  .shadow-box > *:not(.alignwide):not(.alignfull),
  #breadcrumbs, .breadcrumbs { max-width: calc(100% - 30px); }
}

@media (max-width: 991px) {
  .headbar .headbar__container { min-height: 380px; }
  .header__account-link { margin-left: auto; margin-right: 14px; }
  .boxes { gap: 18px; }
}

@media (max-width: 768px) {
  html, body { font-size: 16px; }
  .headbar .headbar__container { min-height: 330px; }
  .headbar .headbar__container:after { background: linear-gradient(0deg, rgba(20,22,43,.48), rgba(20,22,43,.08) 65%); }
  .boxes .boxes__box { border-radius: var(--cm-radius-sm); }
  .footer .contact-bar .container { gap: 18px; }
  .footer .contact-bar .contact-bar__email,
  .footer .contact-bar .contact-bar__phone { font-size: 21px; line-height: 1.2; }
}

@media (max-width: 600px) {
  .footer .footer__newsletter .newsletter .newsletter__input,
  .footer .footer__newsletter .newsletter .newsletter__submit { width: 100%; margin-right: 0; }
  .footer .footer__newsletter .newsletter .newsletter__input { margin-bottom: 10px; }
  .footer .contact-bar .container { flex-direction: column; }
  .footer .footer__copyrights .copyrights .copyrights__text { max-width: 100%; }
  .footer .footer__copyrights .copyrights .copyrights__copy { flex-direction: column; gap: 8px; }
  .footer .footer__copyrights .copyrights .copyrights__copy .part1 { padding-right: 0; border-right: 0; }
  .footer .footer__copyrights .copyrights .copyrights__copy .part2 { padding-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* v1.2.1 visual corrections after live review */

/* Keep hero photography clean. The legacy text shadow is enough for legibility;
   do not tint principal photography with the brand color. */
.headbar .headbar__container:after { content: none; background: none; }
.slider .slider__overlay { background: none; }

/* Restore the previous breadcrumb visual treatment. */
#breadcrumbs a, .breadcrumbs a, .breadcrumb_last {
  margin-right: 7px;
  padding: 8px;
  color: #504747;
  border: 1px solid #d4d1d1;
}
#breadcrumbs a:hover, .breadcrumbs a:hover { color: #504747; }

/* Restore the original photographic newsletter treatment. */
.footer .footer__newsletter {
  min-height: 200px;
  color: #fff;
  background: transparent url(images/newsletter-background2560.webp) bottom center fixed;
  text-align: center;
}
.footer .footer__newsletter .footer__overlay {
  padding: 50px 0 75px;
  background: transparent;
}
.footer .footer__newsletter .title.title--white { color: #fff; }
.footer .footer__newsletter .newsletter { width: auto; }
.footer .footer__newsletter .newsletter .newsletter__input {
  width: 500px;
  min-height: 0;
  border: 2px solid #fff;
  border-radius: 0;
  background: transparent;
  padding: 10px;
  color: #fff;
  text-align: center;
  font-size: 18px;
  line-height: 22px;
  margin-right: 15px;
}
.footer .footer__newsletter .newsletter .newsletter__input::placeholder { color: #fff; opacity: .9; }
.footer .footer__newsletter .newsletter .newsletter__submit {
  width: 180px;
  min-height: 0;
  padding: 10px 0;
  border: 2px solid #fff;
  border-radius: 0;
  background: #fff;
  color: var(--cm-primary);
  text-transform: uppercase;
  font-size: 18px;
  line-height: 22px;
}
.footer .footer__newsletter .newsletter .newsletter__submit:hover {
  color: #fff;
  background: transparent;
}
.footer .footer__newsletter .newsletter .newsletter__agreement { text-align: left; }
.footer .footer__newsletter .newsletter .newsletter__agreement .newsletter__label { color: #fff; }

/* Inverted footer: warm surface with main-color typography and icons.
   The watermark spans the complete lower footer (contact + copyrights) and
   stays in the Warm colour family, 35% darker than the selected Warm colour. */
.footer .footer__lower {
  position: relative;
  overflow: hidden;
  background: var(--cm-warm);
  isolation: isolate;
}
.footer .footer__lower::after {
  content: "";
  position: absolute;
  right: max(-30px, calc((100% - var(--cm-container-width, 1200px)) / 2 - 215px));
  bottom: -30px;
  width: 430px;
  height: 430px;
  background: var(--cm-warm-watermark, #A19C97);
  -webkit-mask: url(images/clubmed-trident-footer.png) center / contain no-repeat;
  mask: url(images/clubmed-trident-footer.png) center / contain no-repeat;
  pointer-events: none;
  z-index: 0;
}
.footer .footer__contact,
.footer .footer__copyrights {
  position: relative;
  z-index: 1;
  background: transparent;
  color: var(--cm-primary);
}
.footer .footer__copyrights {
  overflow: visible;
}
.footer .footer__copyrights > .copyrights {
  position: relative;
  z-index: 1;
}
.footer .contact-bar {
  border-top-color: var(--cm-border);
  box-shadow: none;
}
.footer .contact-bar .contact-bar__button {
  background: var(--cm-warm);
  color: var(--cm-primary);
  border: 1px solid var(--cm-border-strong);
  border-bottom: 0;
  box-shadow: none;
}
.footer .contact-bar .contact-bar__email,
.footer .contact-bar .contact-bar__phone,
.footer .contact-bar__social.social-menu .social-menu__element .social-menu__link {
  color: var(--cm-primary);
}
.footer .contact-bar .contact-bar__email:hover,
.footer .contact-bar .contact-bar__phone:hover,
.footer .contact-bar__social.social-menu .social-menu__element .social-menu__link:hover {
  color: var(--cm-primary-hover);
}
.footer .contact-bar .contact-bar__email:before,
.footer .contact-bar .contact-bar__phone:before {
  content: "";
  flex: 0 0 auto;
  margin-right: 20px;
  display: inline-block;
  background-color: var(--cm-primary);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.footer .contact-bar .contact-bar__email:before {
  width: 43px;
  height: 29px;
  -webkit-mask-image: url(images/mail.webp);
  mask-image: url(images/mail.webp);
}
.footer .contact-bar .contact-bar__phone:before {
  width: 36px;
  height: 36px;
  -webkit-mask-image: url(images/phone-call.png);
  mask-image: url(images/phone-call.png);
}
.footer .footer__copyrights .copyrights,
.footer .footer__copyrights .copyrights .copyrights__menu .copyrights__menu-element .copyrights__menu-link,
.footer .footer__copyrights .copyrights .copyrights__copy .part2 {
  color: var(--cm-primary);
}
.footer .footer__copyrights .copyrights .copyrights__menu .copyrights__menu-element .copyrights__menu-link:hover,
.footer .footer__copyrights .copyrights .copyrights__copy .part2:hover {
  color: var(--cm-primary-hover);
}
.footer .footer__copyrights:before,
.footer .footer__copyrights .copyrights .copyrights__copy:before {
  background: var(--cm-primary);
  opacity: .22;
}
.footer .footer__copyrights .copyrights .copyrights__copy .part1 { border-right-color: var(--cm-primary); }

@media (max-width: 600px) {
  .footer .footer__newsletter .newsletter .newsletter__input,
  .footer .footer__newsletter .newsletter .newsletter__submit { width: 100%; margin-right: 0; }
}

/* Image-card labels keep a neutral contrast gradient instead of tinting photos
   with the selected brand colour. */
.boxes .box .box__label {
  background: linear-gradient(0deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.20) 70%, rgba(0,0,0,0) 100%);
}


/* Prestige / club category badges v1.2.3
   Legacy PNG/WebP files are used only as alpha masks. Their embedded colour
   is never rendered, so the visible badge follows the active design token. */
.club-single .club-single__description.club-description .club-description__main .club-description__prestige::before,
.boxes.boxes--club .box .box__label .box__label-trident::before,
.boxes.boxes--clubs .box .box__label .box__label-trident::before,
.cm-resort-card__tridents::before {
  content: "" !important;
  display: inline-block;
  flex: 0 0 auto;
  width: 70px;
  height: 45px;
  background-color: var(--cm-primary);
  -webkit-mask-image: var(--cm-prestige-mask);
  mask-image: var(--cm-prestige-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.club-description__prestige--3,
.box__label-trident--3,
.cm-prestige-badge--3 { --cm-prestige-mask: url("images/3-tridents-color.png"); }
.club-description__prestige--4,
.box__label-trident--4,
.cm-prestige-badge--4 { --cm-prestige-mask: url("images/4-tridents-color.png"); }
.club-description__prestige--4-5,
.box__label-trident--4-5,
.cm-prestige-badge--4-5 { --cm-prestige-mask: url("images/4-5-tridents-color.png"); }
.club-description__prestige--5,
.box__label-trident--5,
.cm-prestige-badge--5 { --cm-prestige-mask: url("images/5-tridents-color.png"); }
.club-description__prestige--ville,
.box__label-trident--ville,
.cm-prestige-badge--ville { --cm-prestige-mask: url("images/ville-color.png"); }

/* The legacy tiles place the badge directly over photography, so keep the
   inverse white treatment while still using the same mask system. */
.boxes.boxes--club .box .box__label .box__label-trident::before,
.boxes.boxes--clubs .box .box__label .box__label-trident::before {
  background-color: #fff;
}

/* Compact badge inside the new club cards. */
.cm-resort-card__tridents::before {
  width: 52px;
  height: 24px;
}

@media (max-width: 500px) {
  .boxes.boxes--club .box .box__label .box__label-trident::before,
  .boxes.boxes--clubs .box .box__label .box__label-trident::before {
    width: 40px;
    height: 26px;
  }
}

/* 1.3.1 — Exclusive Collection accordion mark follows the active Main colour. */
.club-single .club-single__accordion.accordion .accordion__element .accordion__header .accordion__title.accordion__title--exclusive::before {
  content: "" !important;
  display: inline-block;
  width: 50px;
  height: 40px;
  flex: 0 0 50px;
  margin-right: 10px;
  vertical-align: middle;
  background-color: var(--cm-primary);
  -webkit-mask: url("images/accordion-exclusive.png") center / contain no-repeat;
  mask: url("images/accordion-exclusive.png") center / contain no-repeat;
}

/* The dynamic club mosaic uses the same category mark system as the club page. */
.cm-club-mosaic__tridents::before {
  content: "" !important;
  display: inline-block;
  width: 54px;
  height: 24px;
  background-color: #fff;
  -webkit-mask-image: var(--cm-prestige-mask);
  mask-image: var(--cm-prestige-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

/* 1.3.2 — category mark inside the ClubMed.sk-style homepage cards. */
.cm-sk-club__tridents::before {
  content: "" !important;
  display: inline-block;
  width: 54px;
  height: 24px;
  background-color: #fff;
  -webkit-mask-image: var(--cm-prestige-mask);
  mask-image: var(--cm-prestige-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

/* v1.4.2: homepage hero reverted to the pre-1.4.0 proportions and positioning. */

/* v1.4.1 typography, club accordion and mobile UX fixes */
.title { font-size: 28px; line-height: 33px; }
.title.title--club { font-size: 33px; line-height: 36px; }
.title.title--medium { font-size: 22px; line-height: 26px; }
.title.title--small { font-size: 16px; line-height: 20px; }
.club-single .club-single__accordion.accordion .accordion__element .accordion__header .accordion__title.title.title--medium {
  font-size: 20px;
  line-height: 24px;
}

/* Media & Text blocks loaded through AJAX: preserve the Gutenberg two-column layout. */
.club-single .accordion__content .wp-block-media-text {
  display: grid !important;
  grid-template-columns: 50% 1fr !important;
  align-items: center;
  gap: 0;
  box-sizing: border-box;
}
.club-single .accordion__content .wp-block-media-text__media {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
}
.club-single .accordion__content .wp-block-media-text__content {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  padding: 0 8%;
}
.club-single .accordion__content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media { grid-column: 2; }
.club-single .accordion__content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content { grid-column: 1; }
.club-single .accordion__content .wp-block-media-text__media img,
.club-single .accordion__content .wp-block-media-text__media video {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

/* Gallery cells are 16:9. Cropping hqdefault thumbnails removes YouTube letterboxing. */
.club-single .club-single__gallery.club-gallery .club-gallery__images .club-gallery__image-cont {
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.club-single .club-single__gallery.club-gallery .club-gallery__images .club-gallery__image-cont .club-gallery__image {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  object-fit: cover;
  object-position: center;
}
.club-single .accordion__content .js-map-full {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  cursor: zoom-in;
}
.club-single .accordion__content .accordion__map {
  display: block;
  max-width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  .club-single .club-breadcrumbs {
    align-items: stretch;
    gap: 8px;
  }
  .club-single .club-breadcrumbs #breadcrumbs {
    order: 1;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 4px 0;
    line-height: 1.45;
    overflow-wrap: anywhere;
  }
  .club-single .club-breadcrumbs #breadcrumbs > span {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 2px;
  }
  .club-single .club-breadcrumbs #breadcrumbs a,
  .club-single .club-breadcrumbs #breadcrumbs .breadcrumb_last {
    max-width: 100%;
    margin-right: 4px;
    padding: 6px 8px;
    box-sizing: border-box;
  }
  .club-single .club-breadcrumbs .club-breadcrumbs__tripadvisor {
    order: 2;
    margin: 2px 0 0;
  }
  .club-single .club-breadcrumbs .club-breadcrumbs__tripadvisor.tripadvisor.tripadvisor--right { align-items: flex-start; }

  .club-single .accordion__content .wp-block-media-text.is-stacked-on-mobile {
    grid-template-columns: 100% !important;
  }
  .club-single .accordion__content .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media,
  .club-single .accordion__content .wp-block-media-text.is-stacked-on-mobile.has-media-on-the-right .wp-block-media-text__media {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  .club-single .accordion__content .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content,
  .club-single .accordion__content .wp-block-media-text.is-stacked-on-mobile.has-media-on-the-right .wp-block-media-text__content {
    grid-column: 1 !important;
    grid-row: 2 !important;
    padding: 24px 0 0;
  }
}
@media (max-width: 420px) {
  .club-single .club-breadcrumbs #breadcrumbs { font-size: .7rem; }
  .club-single .club-breadcrumbs #breadcrumbs a,
  .club-single .club-breadcrumbs #breadcrumbs .breadcrumb_last { padding: 5px 6px; }
}


/* v1.4.4 laptop header / hero spacing
   Keep the original hero height, but lower hero content slightly on laptop-width
   screens so the fixed navigation never visually crowds the page title. */
@media screen and (min-width: 992px) and (max-width: 1600px) {
  .headbar .headbar__container .headbar__content,
  .headbar.headbar--home .headbar__container .headbar__content,
  .headbar.headbar--club .headbar__container .headbar__content {
    top: 30%;
  }
}

/* Short laptop screens need a little more breathing room below the fixed menu,
   without changing the hero height itself. */
@media screen and (min-width: 992px) and (max-width: 1600px) and (max-height: 850px) {
  .headbar .headbar__container .headbar__content,
  .headbar.headbar--home .headbar__container .headbar__content,
  .headbar.headbar--club .headbar__container .headbar__content {
    top: 32%;
  }
}

/* v1.4.5 laptop hero height
   Give photography enough vertical space on laptop screens without returning
   to the oversized 1.4.0 hero. Club detail pages keep their existing 70vh hero. */
@media screen and (min-width: 992px) and (max-width: 1600px) {
  .headbar:not(.headbar--club) .headbar__container {
    height: clamp(480px, 56vh, 560px);
    min-height: 480px;
  }
}


/* v1.4.9 softer wide-desktop homepage hero treatment
   Use a central, moderately cropped photograph instead of switching abruptly
   from full-width cover to a fully contained image. A subdued copy of the same
   photo fills the outer edges and the foreground softly blends into it. */
@media screen and (min-width: 1800px) {
  .headbar.headbar--home.headbar--hero-adaptive .headbar__container {
    overflow: hidden;
    background-image: none !important;
    isolation: isolate;
  }

  .headbar.headbar--home.headbar--hero-adaptive .headbar__container::before {
    content: "";
    position: absolute;
    inset: -44px;
    z-index: 0;
    background-image: var(--cm-home-hero-image);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    filter: blur(30px);
    transform: scale(1.035);
    opacity: .62;
  }

  .headbar.headbar--home.headbar--hero-adaptive .headbar__container > .headbar__image {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    right: auto;
    z-index: 1;
    width: clamp(1500px, 78vw, 1900px);
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center center;
    transform: translateX(-50%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.18) 3%, rgba(0,0,0,.48) 6%, rgba(0,0,0,.78) 9%, #000 13%, #000 87%, rgba(0,0,0,.78) 91%, rgba(0,0,0,.48) 94%, rgba(0,0,0,.18) 97%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.18) 3%, rgba(0,0,0,.48) 6%, rgba(0,0,0,.78) 9%, #000 13%, #000 87%, rgba(0,0,0,.78) 91%, rgba(0,0,0,.48) 94%, rgba(0,0,0,.18) 97%, transparent 100%);
  }

  .headbar.headbar--home.headbar--hero-adaptive .headbar__container .headbar__search,
  .headbar.headbar--home.headbar--hero-adaptive .headbar__container .headbar__content {
    z-index: 3;
  }

  .headbar.headbar--home.headbar--hero-adaptive .headbar__container .headbar__fade {
    z-index: 2;
  }
}


/* v1.5.0 compact booking entry point on club pages */
.club-booking-compact {
  width: min(1020px, calc(100% - 40px));
  margin: 18px auto 28px;
  padding: 20px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  box-sizing: border-box;
  border: 1px solid var(--cm-border);
  border-radius: 16px;
  background: var(--cm-warm);
  box-shadow: 0 12px 34px rgba(var(--cm-primary-rgb), .08);
}
.club-booking-compact__intro { min-width: 190px; }
.club-booking-compact__eyebrow {
  display: block;
  margin-bottom: 3px;
  color: rgba(var(--cm-primary-rgb), .64);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.club-booking-compact__title {
  margin: 0;
  color: var(--cm-primary);
  font-size: 21px;
  line-height: 1.2;
  font-weight: 600;
}
.club-booking-compact__actions {
  min-width: 0;
  display: flex;
  align-items: stretch;
  gap: 10px;
}
.club-booking-compact__date {
  min-width: 255px;
  min-height: 58px;
  padding: 9px 15px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--cm-border-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--cm-primary);
  text-align: left;
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.club-booking-compact__date:hover,
.club-booking-compact__date:focus-visible {
  border-color: rgba(var(--cm-primary-rgb), .5);
  box-shadow: 0 6px 18px rgba(var(--cm-primary-rgb), .10);
  outline: none;
}
.club-booking-compact__calendar-icon {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
}
.club-booking-compact__calendar-icon svg { width: 100%; height: 100%; }
.club-booking-compact__date-copy { display: flex; flex-direction: column; min-width: 0; }
.club-booking-compact__date-caption {
  margin-bottom: 1px;
  color: rgba(var(--cm-primary-rgb), .60);
  font-size: 11px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.club-booking-compact__date-value {
  overflow: hidden;
  color: var(--cm-primary);
  font-size: 16px;
  line-height: 1.3;
  font-weight: 600;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.club-booking-compact__cta {
  min-height: 58px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 10px;
  background: var(--cm-primary);
  color: #fff;
  font-size: 15px;
  line-height: 1.2;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.club-booking-compact__cta:hover,
.club-booking-compact__cta:focus-visible {
  background: var(--cm-primary-hover);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(var(--cm-primary-rgb), .16);
  outline: none;
}
.club-booking-compact__arrow { font-size: 19px; line-height: 1; transition: transform .2s ease; }
.club-booking-compact__cta:hover .club-booking-compact__arrow { transform: translateX(3px); }

.club-booking-sticky { display: none; }

@media (max-width: 900px) {
  .club-booking-compact { align-items: stretch; flex-direction: column; gap: 15px; }
  .club-booking-compact__actions { width: 100%; }
  .club-booking-compact__date { flex: 1 1 auto; min-width: 0; }
  .club-booking-compact__cta { flex: 0 0 auto; }
}

@media (max-width: 600px) {
  .club-booking-compact {
    width: calc(100% - 24px);
    margin: 14px auto 22px;
    padding: 16px;
    border-radius: 14px;
  }
  .club-booking-compact__title { font-size: 19px; }
  .club-booking-compact__actions { flex-direction: column; gap: 8px; }
  .club-booking-compact__date,
  .club-booking-compact__cta { width: 100%; min-height: 54px; box-sizing: border-box; }

  .club-booking-sticky:not([hidden]) {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: calc(10px + env(safe-area-inset-bottom));
    z-index: 9998;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 8px;
    padding: 8px;
    border: 1px solid var(--cm-border);
    border-radius: 14px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 12px 36px rgba(var(--cm-primary-rgb), .22);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }
  .club-booking-sticky__date {
    min-width: 0;
    padding: 7px 9px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 0;
    background: transparent;
    color: var(--cm-primary);
    text-align: left;
    cursor: pointer;
  }
  .club-booking-sticky__caption {
    color: rgba(var(--cm-primary-rgb), .58);
    font-size: 10px;
    line-height: 1.2;
    font-weight: 700;
    text-transform: uppercase;
  }
  .club-booking-sticky__value {
    overflow: hidden;
    margin-top: 2px;
    font-size: 14px;
    line-height: 1.25;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .club-booking-sticky__cta {
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: var(--cm-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .club-booking-compact__date,
  .club-booking-compact__cta,
  .club-booking-compact__arrow { transition: none !important; }
}

/* v1.6.42: reserve the fixed header exactly once, on body.
   Previously body padding and .headbar margin added together and left a
   blank strip underneath the navigation. Keep in sync with the tiny inline
   geometry CSS for stable QUIC.cloud async/critical CSS rendering. */
:root {
  --cm-site-header-height: 115px;
}

body:not(.scrolled) {
  padding-top: var(--cm-site-header-height);
}

#wrapper #content > .headbar {
  margin-top: 0;
}

/* WordPress adds its own document offset for the admin toolbar, but fixed
   elements still need an explicit top offset. Keeping both cases aligned
   removes the previous logged-in / logged-out visual discrepancy. */
body.admin-bar .header {
  top: 32px;
}

@media screen and (max-width: 782px) {
  body.admin-bar .header {
    top: 46px;
  }
}


/* v1.5.5 per-page homepage hero display mode.
   Classic deliberately uses the legacy full-width cover behaviour, which is
   preferable for campaign artwork with flat backgrounds or fixed compositions. */
@media screen and (min-width: 1800px) {
  .headbar.headbar--home.headbar--hero-classic .headbar__container {
    overflow: hidden;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }

  .headbar.headbar--home.headbar--hero-classic .headbar__container::before {
    content: none;
  }

  .headbar.headbar--home.headbar--hero-classic .headbar__container > .headbar__image {
    display: none;
  }
}

/* Per-page header colours (v1.5.6). Blank metabox values preserve legacy defaults. */
.headbar .headbar__container .headbar__content .headbar__title,
.headbar .headbar__content .headbar__title {
  color: var(--cm-page-header-title-color, #fff);
}
.headbar.headbar--home .headbar__container .headbar__content .headbar__content-text {
  color: var(--cm-page-header-text-color, #fff);
}
.headbar .headbar__text:not(.headbar__text--search) {
  color: var(--cm-page-header-text-color, var(--cm-primary));
}


/* v1.5.7: hero CTA spacing and compact sizing.
   Keep the CTA visually separate from the title/subtitle while reducing its
   overall footprint. This intentionally overrides legacy responsive values. */
.headbar .headbar__container .headbar__content .headbar__button {
  margin-top: 58px;
  padding: 10px 26px;
  font-size: 18px;
  line-height: 1.2;
}

@media screen and (max-width: 1600px) {
  .headbar .headbar__container .headbar__content .headbar__button,
  .headbar.headbar--home .headbar__container .headbar__content .headbar__button {
    margin-top: 48px;
  }
}

@media screen and (max-width: 1440px) {
  .headbar.headbar--home .headbar__container .headbar__content .headbar__button {
    margin-top: 22px;
  }
}

@media screen and (max-width: 1366px) {
  .headbar .headbar__container .headbar__content .headbar__button,
  .headbar.headbar--home .headbar__container .headbar__content .headbar__button {
    margin-top: 20px;
    padding: 9px 22px;
    font-size: 17px;
  }
}

@media screen and (max-width: 700px) {
  .headbar .headbar__container .headbar__content .headbar__button {
    margin-top: 18px;
    padding: 9px 20px;
    font-size: 16px;
  }
}

/* v1.5.12: club hero title safe area corrected for the intentional
   80px overlap of .club-description (margin-top: -80px). The title group
   is anchored above that overlap plus a visual safety gap, so multi-line
   club names grow upward and can never sit underneath the white description. */
@media screen and (min-width: 701px) and (min-height: 601px) and (max-height: 900px) {
  .headbar.headbar--club .headbar__container .headbar__content {
    top: auto;
    bottom: calc(80px + clamp(24px, 4vh, 40px));
  }
}

/* At <=600px height the legacy stylesheet disables the -80px overlap,
   therefore only a normal bottom gap is required. */
@media screen and (min-width: 701px) and (max-height: 600px) {
  .headbar.headbar--club .headbar__container .headbar__content {
    top: auto;
    bottom: 24px;
  }

  .headbar.headbar--club .headbar__container .headbar__content .headbar__icon .headbar__icon-image {
    width: 128px;
    height: 128px;
  }
}


/* v1.5.13: refined club hero title safe area on laptops.
   Lift the title group slightly farther above the 80px description overlap
   and reduce both the club mark and title without changing hero height. */
@media screen and (min-width: 701px) and (min-height: 601px) and (max-height: 900px) {
  .headbar.headbar--club .headbar__container .headbar__content {
    bottom: calc(80px + clamp(44px, 6vh, 60px));
  }

  .headbar.headbar--club .headbar__container .headbar__content .headbar__icon .headbar__icon-image {
    width: 132px;
    height: 132px;
  }
}

@media screen and (min-width: 1281px) and (min-height: 601px) and (max-height: 900px) {
  .headbar.headbar--club .headbar__container .headbar__content .headbar__title {
    font-size: 50px;
    line-height: 54px;
  }
}

@media screen and (min-width: 701px) and (max-width: 1280px) and (min-height: 601px) and (max-height: 900px) {
  .headbar.headbar--club .headbar__container .headbar__content .headbar__title {
    font-size: 30px;
    line-height: 35px;
  }

  .headbar.headbar--club .headbar__container .headbar__content .headbar__icon .headbar__icon-image {
    width: 120px;
    height: 120px;
  }
}

/* Search boxes: keep the magnifying-glass button outside the input focus ring.
   The wrapper is the visible focus target, preserving keyboard accessibility. */
.search .search__field .search__input:focus,
.search .search__field .search__input:focus-visible {
  border: 0 !important;
  outline: none;
  box-shadow: none;
}
.search .search__field:focus-within {
  box-shadow: 0 0 0 2px rgba(var(--cm-primary-rgb, 30, 34, 65), .12);
}

/* v1.6.43: Desktop mega-menu never moves between hidden and visible coordinates.
   The old top:-500px -> top:calc(...) transition appeared as a large layout shift.
   Keep hover and JS class opening for the existing diagonal-pointer corridor. */
@media (min-width: 992px) and (hover: hover) {
  .header .subnav-container {
    top: calc(100% - 40px);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: none;
  }
  .header .nav .nav__element:hover .subnav-container,
  .header .nav .nav__element.nav__element--submenu-open .subnav-container {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }
}
/* Club hero: its informational title overlay must not intercept photo arrows. */
.headbar.headbar--club .headbar__container .headbar__content { pointer-events: none; }
.headbar.headbar--club .headbar__container .swiper-button-prev,
.headbar.headbar--club .headbar__container .swiper-button-next {
  z-index: 20;
  pointer-events: auto;
}

/* v1.6.37: HTML-discoverable responsive LCP hero on the homepage.
   Only the homepage is affected. On ultrawide screens preserve the existing
   softly blurred backdrop and masked foreground treatment. */
.headbar.headbar--home .headbar__container {
  background-image: none !important;
  overflow: hidden;
}
.headbar.headbar--home .headbar__container > .headbar__image {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
}
/* The special ultrawide adaptive mode keeps its existing image geometry. */
@media screen and (min-width: 1800px) {
  .headbar.headbar--home.headbar--hero-adaptive .headbar__container > .headbar__image {
    top: 0;
    bottom: 0;
    left: 50%;
    right: auto;
    z-index: 1;
    width: clamp(1500px, 78vw, 1900px);
    height: 100%;
    transform: translateX(-50%);
  }
}


/* v1.6.38: archive, search, destination and editorial hero images.
   These were hidden HTML <img> elements with a duplicate CSS background.
   Reveal the responsive image as the sole displayed hero without changing
   overlay geometry, headers, search boxes or the club slider. */
.headbar:not(.headbar--club):not(.headbar--home) .headbar__container {
  background-image: none !important;
  overflow: hidden;
}
.headbar:not(.headbar--club):not(.headbar--home) .headbar__container > .headbar__image {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
}

/* v1.6.47: static expanded header reservation, matching critical header.php CSS.
   Never override this token in JavaScript after paint. */
@media screen and (min-width: 992px) and (max-width: 1050px) {
  :root { --cm-site-header-height: 105px; }
}
@media screen and (max-width: 991px) {
  :root { --cm-site-header-height: 85px; }
}

/* v1.6.46 — menu thumbnails must scale proportionally when HTML dimensions are present.
   The 1.6.45 metadata reserves intrinsic space for CLS, but max-width alone
   scaled down only width, leaving the pixel height from the HTML attribute. */
.header .subnav .subnav__element .subnav__link .subnav__image img {
  width: auto;
  height: auto;
  max-width: 100%;
}
/* v1.6.48: reserve the full club-hero slide width before Swiper is loaded. */
.headbar.headbar--club .headbar__container { width: 100%; min-width: 0; }
.headbar.headbar--club .headbar__container .swiper-container { display: block; width: 100%; min-width: 0; }
.headbar.headbar--club .swiper-wrapper,
.headbar.headbar--club .headbar__image-cont { width: 100%; }
/* Reserve the image's final viewport-wide minimum before Swiper sizes slides. */
.headbar.headbar--club .headbar__container .headbar__image { min-width: max(100%, 100vw); }