:root {
  --zh-accent: #22d3ee;
  --zh-accent-2: #06b6d4;
  --zh-surface: #10182d;
  --zh-ink: #f8fafc;
  --zh-muted: #94a3b8;
}

body[data-zuto-vertical="holidays"] {
  background: #0a1024;
  color: var(--zh-ink);
  overflow-x: hidden;
}

/*
 * Page loader must cover the sticky Holidays navbar. Shared chrome sets
 * #navbar to z-index ≥100000 while .zuto-page-loader is only 99999, so the
 * product menu was painting on top of "INITIALIZING…" before load finished.
 */
html body[data-zuto-vertical="holidays"] #zutoPageLoader.zuto-page-loader,
html body[data-zuto-vertical="holidays"] #zutoPageLoader.elinom-global-loader--page {
  z-index: 200000 !important;
}

/* ── Holidays top menu ─────────────────────────────────────────────── */
html body.erp-body[data-zuto-vertical="holidays"] #navbar.zh-navbar,
html body.erp-body[data-zuto-vertical="holidays"] #navbar.navbar {
  position: sticky !important;
  top: 0;
  z-index: 100000;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  background:
    linear-gradient(180deg, rgba(8, 14, 30, 0.98) 0%, rgba(10, 16, 36, 0.94) 100%) !important;
  border-bottom: 1px solid rgba(34, 211, 238, 0.16) !important;
  box-shadow: 0 12px 32px rgba(2, 6, 23, 0.35) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar.zh-navbar .zh-nav-container {
  position: relative !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-container,
html body.erp-body[data-zuto-vertical="holidays"] #navbar .nav-container {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: 1180px !important;
  min-height: 64px !important;
  height: 64px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-container > zuto-brand {
  flex: 0 0 auto;
  max-width: min(220px, 34vw);
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.zh-nav-menu {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 10px !important;
  list-style: none !important;
  overflow: visible !important;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu::-webkit-scrollbar {
  display: none;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu > li {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

/* Shared ERP chrome injects Copilot into Zuto verticals — keep Holidays product-only. */
html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu > li.copilot-li,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li.copilot-li {
  display: none !important;
}

/*
 * Exact Holidays top-menu design (product reference):
 * white text links + amber skewed ::before pill on the active item.
 * Selectors include #navMenu > li > a to beat erp-marketing-chrome.
 */
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link,
html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu > li > a.zh-nav-link {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;
  gap: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: 36px !important;
  padding: 6px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif !important;
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  overflow: visible !important;
  transition:
    color 0.18s ease,
    transform 0.18s ease !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li {
  display: flex !important;
  align-items: center !important;
  align-self: center !important;
  height: auto !important;
}

/* Text-only nav — hide icons. */
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link > i,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link > i {
  display: none !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link > span,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link > span {
  position: relative !important;
  z-index: 1 !important;
  display: inline-block !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  transform: none !important;
}

/* Kill site.css / ERP underline hover and first-child-always-active chrome. */
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link::after,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link::after,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li:first-child > a.zh-nav-link::after,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li:first-child > a.nav-link::after {
  content: none !important;
  display: none !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li:first-child > a.zh-nav-link:not(.is-active):not(.active):not([aria-current="page"]),
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li:first-child > a.nav-link:not(.is-active):not(.active):not([aria-current="page"]) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
  transform: none !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li:first-child > a.zh-nav-link:not(.is-active):not(.active):not([aria-current="page"])::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li:first-child > a.nav-link:not(.is-active):not(.active):not([aria-current="page"])::before {
  content: none !important;
  display: none !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link:hover,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link:hover {
  color: #fde68a !important;
  -webkit-text-fill-color: #fde68a !important;
  background: transparent !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Active pill — skewed amber gradient behind upright dark text (exact reference). */
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.is-active,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.active,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link[aria-current="page"],
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.is-active,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.active,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link[aria-current="page"] {
  color: #1a2942 !important;
  -webkit-text-fill-color: #1a2942 !important;
  background: transparent !important;
  background-image: none !important;
  font-weight: 800 !important;
  padding: 6px 14px !important;
  transform: none !important;
  box-shadow: none !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.is-active::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.active::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link[aria-current="page"]::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.is-active::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.active::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link[aria-current="page"]::before {
  /* Beat erp-navbar-ref `a::before { content:none; display:none; width:0 }` */
  content: "" !important;
  display: block !important;
  visibility: visible !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  z-index: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%) !important;
  background-image: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%) !important;
  background-color: #f59e0b !important;
  transform: skewX(-20deg) !important;
  box-shadow:
    0 0 0 1px rgba(245, 158, 11, 0.28),
    0 6px 18px rgba(245, 158, 11, 0.42) !important;
  animation: none !important;
  pointer-events: none !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.is-active > span,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.active > span,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link[aria-current="page"] > span,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.is-active > span,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.active > span,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link[aria-current="page"] > span {
  position: relative !important;
  z-index: 1 !important;
  color: #1a2942 !important;
  -webkit-text-fill-color: #1a2942 !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.is-active:hover,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.active:hover,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link[aria-current="page"]:hover,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.is-active:hover,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.active:hover,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link[aria-current="page"]:hover {
  color: #1a2942 !important;
  -webkit-text-fill-color: #1a2942 !important;
  transform: translateY(-1px) !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.is-active:hover::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link.active:hover::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.zh-nav-link[aria-current="page"]:hover::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.is-active:hover::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link.active:hover::before,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li > a.nav-link[aria-current="page"]:hover::before {
  box-shadow:
    0 0 0 1px rgba(245, 158, 11, 0.35),
    0 10px 24px rgba(245, 158, 11, 0.5) !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-mobile-menu-btn,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #mobileMenuBtn {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  height: 42px !important;
  margin-left: auto !important;
  border-radius: 12px !important;
  border: 1px solid rgba(245, 158, 11, 0.4) !important;
  background: rgba(15, 23, 42, 0.72) !important;
  color: #f8fafc !important;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.1) !important;
}

html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-mobile-menu-btn:hover,
html body.erp-body[data-zuto-vertical="holidays"] #navbar #mobileMenuBtn:hover {
  border-color: rgba(245, 158, 11, 0.7) !important;
  color: #fbbf24 !important;
}

/* Util strip sits under the product nav as one Holidays chrome stack */
html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  inset: auto !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  background: rgba(7, 12, 26, 0.92) !important;
  border-top: 1px solid rgba(148, 163, 184, 0.08) !important;
  border-bottom: 0 !important;
}

@media (max-width: 1023px) {
  html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.zh-nav-menu {
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu.mobile-open,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.zh-nav-menu.mobile-open {
    display: flex !important;
    position: absolute !important;
    top: 64px !important;
    left: 12px !important;
    right: 12px !important;
    z-index: 100001 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    max-height: min(70vh, 28rem) !important;
    overflow-y: auto !important;
    padding: 12px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(245, 166, 35, 0.22) !important;
    background:
      radial-gradient(circle at 12% 0%, rgba(245, 166, 35, 0.1), transparent 48%),
      linear-gradient(180deg, #12141c 0%, #0a1024 100%) !important;
    box-shadow: 0 22px 48px rgba(2, 6, 23, 0.55) !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu.mobile-open > li,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.zh-nav-menu.mobile-open > li {
    width: 100% !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-nav-menu.mobile-open .zh-nav-link,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.zh-nav-menu.mobile-open .zh-nav-link,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open > li > a.zh-nav-link {
    width: 100% !important;
    justify-content: flex-start !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    border-radius: 0 !important;
    transform: none !important;
    gap: 0 !important;
    font-size: 0.875rem !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open > li > a.zh-nav-link.is-active,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open > li > a.zh-nav-link.active,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open > li > a.zh-nav-link[aria-current="page"] {
    color: #1a2942 !important;
    -webkit-text-fill-color: #1a2942 !important;
    background: transparent !important;
    padding: 10px 18px !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open > li > a.zh-nav-link.is-active::before,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open > li > a.zh-nav-link.active::before,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open > li > a.zh-nav-link[aria-current="page"]::before {
    content: "" !important;
    display: block !important;
    visibility: visible !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%) !important;
    transform: skewX(-14deg) !important;
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.35) !important;
    animation: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar .zh-mobile-menu-btn,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #mobileMenuBtn {
    display: inline-flex !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar {
    display: none !important;
  }

  /* nav-mobile-util + erp-mobile-nav-redesign win on specificity unless
     Holidays selectors include #navbar + .mobile-open. Keep drawer product-only. */
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.zh-nav-menu.mobile-open #mobileUtilBlock {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin: 0 0 8px !important;
    padding: 0 0 10px !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-util-actions--search,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-util-action--search,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-util-action--signup,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-util-action--secondary,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-util-action--icon,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-lang-select,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .us-trigger,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock #us-trigger,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock #navUserChip,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock #createAccountBtn,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock [aria-label="Account menu"],
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open .mobile-util-action:not(.erp-login-orb):not(.mobile-login-orb):not(.zh-login-pill) {
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-util-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    gap: 0 !important;
    width: 100% !important;
    margin: 0 !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-caption {
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .mobile-util-action.erp-login-orb,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .mobile-util-action.mobile-login-orb,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .mobile-util-action--primary.erp-login-orb,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .erp-login-orb.mobile-login-orb,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-util-action--primary {
    order: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: stretch !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 44px !important;
    height: 44px !important;
    max-height: none !important;
    padding: 0 16px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    border: 1px solid rgba(34, 211, 238, 0.55) !important;
    flex: 1 1 auto !important;
    font-size: 0.92rem !important;
    font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    color: #082f49 !important;
    -webkit-text-fill-color: #082f49 !important;
    background: linear-gradient(135deg, #22d3ee 0%, #06b6d4 100%) !important;
    background-image: linear-gradient(135deg, #22d3ee 0%, #06b6d4 100%) !important;
    background-color: #22d3ee !important;
    background-size: auto !important;
    box-shadow: 0 8px 20px rgba(34, 211, 238, 0.22) !important;
    overflow: visible !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb::before,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb::after,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .erp-login-orb::before,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .mobile-login-orb::before {
    display: none !important;
    content: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb .erp-login-orb-label,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb svg,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .erp-login-orb-label {
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb .erp-login-lock,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb .fa-lock {
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb .erp-login-orb-text,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-orb .mobile-util-label,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .erp-login-orb-text,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu.mobile-open #mobileUtilBlock .mobile-login-pair .mobile-util-label {
    display: inline !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    color: #082f49 !important;
    -webkit-text-fill-color: #082f49 !important;
    font-size: 0.92rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }
}

.zh-hero {
  padding: 128px 16px 40px;
  background:
    radial-gradient(circle at 80% -10%, rgba(34, 211, 238, 0.18), transparent 42%),
    linear-gradient(180deg, #0a1024, #10182d);
}

.zh-hero-inner,
.zh-results,
.zh-panel {
  max-width: 1100px;
  margin: 0 auto;
}

.zh-kicker {
  color: var(--zh-accent);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.78rem;
}

.zh-hero h1 {
  font-size: clamp(1.8rem, 6vw, 3rem);
  line-height: 1.1;
  margin: 8px 0 12px;
}

.zh-lead,
.zh-panel p {
  color: var(--zh-muted);
  line-height: 1.6;
}

.zh-search {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 24px;
  background: rgba(16, 24, 45, 0.92);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 18px;
  padding: 16px;
}

.zh-search > label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.8rem;
  color: #0f172a;
  font-weight: 600;
}

.zh-search > label > input {
  width: 100%;
  min-height: 44px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: #ffffff;
  color: #0f172a;
  -webkit-text-fill-color: #0f172a;
  caret-color: #0f172a;
  padding: 10px 12px;
}

.zh-includes {
  grid-column: 1 / -1;
  border: 0;
  margin: 4px 0 0;
  padding: 0;
  min-width: 0;
}

.zh-includes legend {
  padding: 0;
  margin: 0 0 10px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #0f172a;
}

.zh-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.zh-chip {
  position: relative;
  display: inline-flex;
  margin: 0;
  cursor: pointer;
  user-select: none;
}

.zh-chip input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  pointer-events: none;
}

.zh-chip-face {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.32);
  background: rgba(15, 23, 42, 0.72);
  color: #cbd5e1;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1;
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.zh-chip-face i {
  font-size: 0.82rem;
  color: #67e8f9;
  opacity: 0.75;
}

.zh-chip:hover .zh-chip-face {
  border-color: rgba(34, 211, 238, 0.5);
  color: #f8fafc;
  transform: translateY(-1px);
}

.zh-chip input:focus-visible + .zh-chip-face {
  outline: 2px solid rgba(34, 211, 238, 0.7);
  outline-offset: 2px;
}

.zh-chip input:checked + .zh-chip-face {
  border-color: #22d3ee;
  background: #0e7490;
  color: #ecfeff;
  box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.35);
}

.zh-chip input:checked + .zh-chip-face i {
  color: #ecfeff;
  opacity: 1;
}

.zh-build-btn {
  grid-column: 1 / -1;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  min-height: 54px;
  margin: 4px 0 0;
  padding: 0 22px;
  border: 0;
  border-radius: 14px;
  cursor: pointer;
  color: #042f2e;
  font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1;
  background:
    linear-gradient(120deg, #67e8f9 0%, #22d3ee 38%, #06b6d4 72%, #0891b2 100%);
  box-shadow:
    0 0 0 1px rgba(165, 243, 252, 0.35),
    0 14px 28px rgba(8, 145, 178, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;
}

.zh-build-btn-glow {
  position: absolute;
  inset: -40% -20%;
  z-index: -1;
  background: linear-gradient(
    110deg,
    transparent 30%,
    rgba(255, 255, 255, 0.38) 48%,
    transparent 62%
  );
  transform: translateX(-45%);
  animation: zh-build-sheen 3.8s ease-in-out infinite;
  pointer-events: none;
}

.zh-build-btn > i:first-of-type {
  font-size: 0.95rem;
  opacity: 0.92;
}

.zh-build-btn-arrow {
  font-size: 0.82rem;
  transition: transform 0.2s ease;
}

.zh-build-btn:hover {
  transform: translateY(-1px);
  filter: saturate(1.05) brightness(1.03);
  box-shadow:
    0 0 0 1px rgba(165, 243, 252, 0.5),
    0 18px 34px rgba(8, 145, 178, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.zh-build-btn:hover .zh-build-btn-arrow {
  transform: translateX(3px);
}

.zh-build-btn:active {
  transform: translateY(0);
}

.zh-build-btn:focus-visible {
  outline: 2px solid rgba(34, 211, 238, 0.85);
  outline-offset: 3px;
}

@keyframes zh-build-sheen {
  0%,
  35% {
    transform: translateX(-55%);
  }
  65%,
  100% {
    transform: translateX(55%);
  }
}

.zh-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.zh-quick a {
  color: #e2e8f0;
  text-decoration: none;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 0.85rem;
}

.zh-results,
.zh-panel {
  padding: 24px 16px 64px;
}

.zh-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}

.zh-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 16px;
}

.zh-card h3 {
  margin: 0 0 8px;
  font-size: 1.05rem;
}

.zh-card .price {
  color: var(--zh-accent);
  font-weight: 800;
}

.zh-detail {
  margin-top: 20px;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid rgba(34, 211, 238, 0.28);
}

.zh-components {
  display: grid;
  gap: 8px;
}

.zh-empty {
  color: var(--zh-muted);
}

.zh-demo {
  font-size: 0.75rem;
  color: #fb923c;
}

.zh-source {
  font-size: 0.8rem;
  color: var(--zh-muted);
  margin: 6px 0 0;
}

.zh-events-stay {
  margin: 0 0 16px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(34, 211, 238, 0.22);
  background: rgba(34, 211, 238, 0.06);
}

.zh-events-stay #zhEventsStaySummary {
  margin: 0 0 12px;
  color: #e2e8f0;
  font-weight: 600;
}

/* Hide any leftover page-level auth CTAs if chrome reinjects them. */
body[data-zuto-vertical="holidays"] .nav-container > .nav-auth,
body[data-zuto-vertical="holidays"] .nav-container > .nav-auth-buttons {
  display: none !important;
}

/*
 * nav-mobile-util.js injects #mobileUtilBlock for viewports ≤1279px, but
 * Holidays keeps the desktop icon-pill nav until 1023px. In that gap the
 * injected Search / ··· / Create Account block sits inside #navMenu and
 * spills over the util search row. Hide it whenever the desktop nav shows.
 */
@media (min-width: 1024px) {
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu #mobileUtilBlock,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li.mobile-util-block,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li#mobileUtilBlock,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #navMenu > li#mobileLangFooter {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}

/*
 * Holidays util-bar right cluster.
 * Shared ERP chrome lifts Login/chip/bell/lang onto the nav row (top: -4rem)
 * and can crush #utilAuthGuest while #navUserChip lives inside it — buttons
 * then collide. Keep the cluster on the search row with real gaps.
 */
@media (min-width: 1024px) {
  html body.erp-body[data-zuto-vertical="holidays"] #navbar .container.nav-container,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar .nav-container {
    padding-right: 1.25rem !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-bar-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 20px !important;
    padding: 0.35rem 1rem 0.35rem 1.25rem !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #utilAiSearchSlot,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-ai-search-slot {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    inset: auto !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: min(34rem, calc(100% - 16rem)) !important;
    min-width: 12rem !important;
    margin-right: auto !important;
    z-index: 1 !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-bar-inner > .nav-auth-buttons,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-bar-inner > #navUserChip,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-bar-inner > #navNotifWrap,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-bar-inner > #navUserProfile,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-bar-inner > .util-lang-wrap,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-bar-inner > #utilLangWrapper {
    position: relative !important;
    top: 0 !important;
    bottom: auto !important;
    inset: auto !important;
    transform: none !important;
    align-self: center !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 10px !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    z-index: 3 !important;
    /* erp-nav-chrome sets #util-bar / .util-bar-inner to pointer-events:none
       and only restores auto on chip/bell/lang — not #navUserProfile/Logout. */
    pointer-events: auto !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #utilAiSearchSlot,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-ai-search-slot,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #us-trigger,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .us-trigger,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #navUserProfile .util-btn-logout,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #navNotifBell,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #currentLangDisplay,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .elinom-lang-btn {
    pointer-events: auto !important;
    cursor: pointer !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #utilAuthGuest.nav-auth-buttons {
    width: max-content !important;
    min-width: max-content !important;
  }

  /* Guest ··· chip is redundant next to Login and causes the overlap. */
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #navUserChip {
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .nav-auth-buttons #loginBtn,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn.zh-login-pill,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .nav-auth-buttons #loginBtn.erp-login-orb,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .nav-auth-buttons #loginBtn.util-btn,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn.erp-login-orb,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn.util-btn,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar a#loginBtn.erp-login-orb {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    gap: 8px !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
    background: linear-gradient(120deg, #67e8f9 0%, #22d3ee 55%, #0891b2 100%) !important;
    border: 0 !important;
    box-shadow: 0 8px 18px rgba(8, 145, 178, 0.28) !important;
    filter: none !important;
    color: #042f2e !important;
    -webkit-text-fill-color: #042f2e !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.01em !important;
    overflow: visible !important;
    white-space: nowrap !important;
    text-decoration: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn.erp-login-orb::before,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn::before,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn::after {
    content: none !important;
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn .erp-login-orb-label,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn .erp-login-orb-text {
    display: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn .erp-login-lock,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn .fa-lock,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn .fa-right-to-bracket,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #loginBtn i {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    color: #042f2e !important;
    -webkit-text-fill-color: #042f2e !important;
    font-size: 0.78rem !important;
    background: none !important;
    filter: none !important;
  }

  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar #navNotifWrap,
  html body.erp-body[data-zuto-vertical="holidays"] #navbar #util-bar .util-lang-wrap {
    margin-left: 0 !important;
  }
}

/* Persist logged-in util-bar chrome across reload (beats erp-shell flex!important). */
html[data-erp-auth="1"] body[data-zuto-vertical="holidays"] #navbar.erp-shell-navbar #utilAuthGuest.nav-auth-buttons,
html[data-erp-auth="1"] body[data-zuto-vertical="holidays"] #util-bar #utilAuthGuest {
  display: none !important;
}

html[data-erp-auth="1"] body[data-zuto-vertical="holidays"] #util-bar #navUserProfile {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

html:not([data-erp-auth="1"]) body[data-zuto-vertical="holidays"] #util-bar #navUserProfile {
  display: none !important;
}

body[data-zuto-vertical="holidays"] #util-bar #navUserProfile .nav-user-name {
  color: #e2e8f0;
  font-size: 0.82rem;
  font-weight: 600;
  max-width: 7.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-zuto-vertical="holidays"] #util-bar #navUserProfile .util-btn-logout {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0.42rem 0.82rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.55);
  color: #f8fafc;
  font-size: 0.8rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Holidays notification panel (erp-shell.css is not loaded on this page). */
body[data-zuto-vertical="holidays"] #navNotifWrap {
  position: relative !important;
}

body[data-zuto-vertical="holidays"] #navNotifPanel {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  width: min(320px, 86vw) !important;
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45) !important;
  z-index: 100010 !important;
  overflow: hidden !important;
  color: #e2e8f0 !important;
}

body[data-zuto-vertical="holidays"] #navNotifPanel.nav-bell-panel-hidden,
body[data-zuto-vertical="holidays"] #navNotifPanel[hidden] {
  display: none !important;
}

body[data-zuto-vertical="holidays"] #navNotifPanel .nav-bell-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-bottom: 1px solid #334155;
  font-weight: 700;
  font-size: 0.82rem;
  color: #f1f5f9;
}

body[data-zuto-vertical="holidays"] #navNotifPanel .nav-bell-panel-empty {
  padding: 20px 14px;
  text-align: center;
  color: #94a3b8;
  font-size: 0.8rem;
}

/* Holidays footer — product surface, not ERP marketing chrome */
body[data-zuto-vertical="holidays"] .zh-footer .footer-quick-row,
body[data-zuto-vertical="holidays"] .zh-footer .footer-brand-actions,
body[data-zuto-vertical="holidays"] .zh-footer .footer-desc,
body[data-zuto-vertical="holidays"] .zh-footer [data-elinom-trust-footer],
body[data-zuto-vertical="holidays"] .zh-footer .tcf-host,
body[data-zuto-vertical="holidays"] .zh-footer .tcf-root {
  display: none !important;
}

.zh-footer {
  margin-top: 2rem;
  padding: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  background:
    radial-gradient(circle at 12% 0%, rgba(34, 211, 238, 0.1), transparent 42%),
    linear-gradient(180deg, #0b1224 0%, #070d1a 100%);
}

.zh-footer-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 40px 16px 28px;
  display: grid;
  gap: 28px;
}

.zh-footer-brand {
  display: grid;
  gap: 8px;
  max-width: 520px;
}

.zh-footer-tagline {
  margin: 0;
  color: var(--zh-accent);
  font-weight: 700;
  font-size: 0.95rem;
}

.zh-footer-lead {
  margin: 0;
  color: var(--zh-muted);
  line-height: 1.55;
  font-size: 0.92rem;
}

.zh-footer-cols {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.zh-footer-col {
  display: grid;
  gap: 8px;
  align-content: start;
}

.zh-footer-col h3 {
  margin: 0 0 4px;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #cbd5e1;
}

.zh-footer-col a {
  color: #e2e8f0;
  text-decoration: none;
  font-size: 0.9rem;
  line-height: 1.4;
}

.zh-footer-col a:hover {
  color: var(--zh-accent);
}

.zh-footer-base {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  justify-content: space-between;
  align-items: baseline;
  padding-top: 16px;
  border-top: 1px solid rgba(148, 163, 184, 0.12);
}

.zh-footer-copy,
.zh-footer-note {
  margin: 0;
  color: #94a3b8;
  font-size: 0.8rem;
}

/* Content links on the dark Holidays canvas — avoid browser/default blue. */
body[data-zuto-vertical="holidays"] .zh-panel a,
body[data-zuto-vertical="holidays"] .zh-results a,
body[data-zuto-vertical="holidays"] .zh-card a,
body[data-zuto-vertical="holidays"] .zh-detail a {
  color: #67e8f9;
}

body[data-zuto-vertical="holidays"] .zh-panel a:hover,
body[data-zuto-vertical="holidays"] .zh-results a:hover,
body[data-zuto-vertical="holidays"] .zh-card a:hover,
body[data-zuto-vertical="holidays"] .zh-detail a:hover {
  color: #a5f3fc;
}

@media (max-width: 767px) {
  .zh-hero {
    padding-top: 88px;
  }

  .zh-search {
    grid-template-columns: 1fr;
  }

  .zh-build-btn {
    min-height: 50px;
    font-size: 0.95rem;
    gap: 10px;
  }

  .zh-footer-cols {
    grid-template-columns: 1fr;
  }

  .zh-footer-base {
    flex-direction: column;
  }
}

@media (min-width: 768px) {
  .zh-search {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .zh-includes,
  .zh-build-btn {
    grid-column: 1 / -1;
  }
}