@font-face {
  font-family: 'Font Awesome 5 Pro';
  font-style: normal;
  font-weight: 300;
  font-display: auto;
  src: url('../fonts/fa-light-300.woff2') format('woff2'), url('../fonts/fa-light-300.woff') format('woff');
}

@font-face {
  font-family: 'Font Awesome 5 Pro';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: url('../fonts/fa-regular-400.woff2') format('woff2'), url('../fonts/fa-regular-400.woff') format('woff');
}

@font-face {
  font-family: 'Font Awesome 5 Pro';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: url('../fonts/fa-solid-900.woff2') format('woff2'), url('../fonts/fa-solid-900.woff') format('woff');
}

@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: url('../fonts/fa-brands-400.woff2') format('woff2'), url('../fonts/fa-brands-400.woff') format('woff');
}

.fal {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 300;
}

.far {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 400;
}

.fas {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
}

.fab {
  font-family: 'Font Awesome 5 Brands';
  font-weight: 400;
}

/* custom-scrollbar-fix.css
   1. Locomotive Scroll virtual scrollbar (.c-scrollbar / .c-scrollbar_thumb)
   2. Native cross-browser branded scrollbars (Firefox, Chrome, Safari, Edge)
   3. Mobile fluidity and virtual scrollbar suppression
   4. Smooth scroll collision prevention and containment */

/* --------------------------------------------------------------------------
   1. LOCOMOTIVE VIRTUAL SCROLLBAR SUPPRESSION
   -------------------------------------------------------------------------- */
.c-scrollbar {
  display: none !important;
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* --------------------------------------------------------------------------
   2. NATIVE CROSS-BROWSER BRANDED SCROLLBARS (Firefox, Chrome, Edge, Safari)
   -------------------------------------------------------------------------- */
/* Modern standard scrollbar for Firefox, Chrome 121+, Edge 121+, Safari 17.4+ */
html,
body,
* {
  scrollbar-width: thin;
  scrollbar-color: #6d1434 rgba(0, 0, 0, 0.05);
}

/* WebKit custom scrollbars (Chrome, Safari, Edge, Opera) */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.03);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background-color: #6d1434;
  border-radius: 4px;
  border: 2px solid transparent;
  background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #4a0d23;
}

/* --------------------------------------------------------------------------
   3. CONTAINER STRUCTURE & ZERO-BLANK-SPACE FOOTER DOCKING
   -------------------------------------------------------------------------- */
.smooth-scroll {
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: visible;
}

.section-wrapper {
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  position: relative;
  overflow: visible;
}

/* Footer layout: docked at bottom of page with zero extra space */
.footer {
  margin-top: auto;
  width: 100%;
  display: block;
  position: relative;
  clear: both;
  box-sizing: border-box;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.footer-strip-img {
  display: block;
  width: 100%;
  margin-bottom: 0 !important;
  vertical-align: bottom;
}

/* Container stability: ensure outer wrappers and footer are visible and docked */
.smooth-scroll,
.section-wrapper {
  opacity: 1 !important;
  visibility: visible !important;
}

/* --------------------------------------------------------------------------
   4. SCROLL ANIMATION CSS (InView Reveal & Parallax Float on Scroll)
   -------------------------------------------------------------------------- */
/* Smooth reveal animations for images and content boxes as you scroll into view */
.image-box img,
.side-image img,
.image-content-box figure img,
.collection-box img,
.exhibition-box figure .img,
.recent-news figure img,
.blog-post figure img {
  opacity: 0;
  transform: scale(1.18);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.image-box.is-inview img,
.side-image.is-inview img,
.image-content-box.is-inview figure img,
.collection-box.is-inview img,
.exhibition-box.is-inview .img,
.recent-news figure.is-inview img,
.blog-post figure.is-inview img {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* Smooth motion for parallax elements floating with scroll */
[data-scroll][data-scroll-speed] {
  transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1);
  will-change: transform;
}

/* --------------------------------------------------------------------------
   4. FULL NATURAL SCROLLING (HEADER TO FOOTER)
   -------------------------------------------------------------------------- */
/* Standard smooth scroll for all pages without scroll hijack */
html {
  scroll-behavior: smooth !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  max-width: 100%;
}

body {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  max-width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
}

/* Ensure html and body are NEVER locked with overflow: hidden */
html.has-scroll-smooth,
body.has-scroll-smooth,
.has-scroll-smooth {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  height: auto !important;
  position: static !important;
}

/* --------------------------------------------------------------------------
   5. INNER SCROLLABLE CONTAINERS (iOS Momentum & Containment)
   -------------------------------------------------------------------------- */
.side-widget,
.venue-drawer-body,
.side-content-scroll,
.search-box,
.events-scroll-wrapper,
.filter-dropdown-menu,
.cookie-consent-banner,
.modal-body,
.overflow-scroll-wrap {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  overscroll-behavior-y: contain;
}

.side-widget {
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

.search-box {
  max-height: 100vh;
  max-height: 100dvh;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* --------------------------------------------------------------------------
   6. SEARCH BOX MEGA-DROPDOWN SUB-MENU (Reveal on Hover)
   -------------------------------------------------------------------------- */
.search-box .dropdown-vertical-links li.has-dropdown {
  position: relative;
}

.search-box .dropdown-vertical-links li.has-dropdown .sub-menu {
  list-style: none;
  padding: 0 0 0 18px;
  margin: 0;
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease, padding 0.35s ease, visibility 0.35s ease;
}

.search-box .dropdown-vertical-links li.has-dropdown:hover .sub-menu {
  max-height: 160px;
  opacity: 1;
  visibility: visible;
  padding: 4px 0 12px 18px;
}

.search-box .dropdown-vertical-links li.has-dropdown .sub-menu li {
  border-bottom: none !important;
}

.search-box .dropdown-vertical-links li.has-dropdown .sub-menu li a {
  font-family: 'Hero New', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 6px 0 !important;
  letter-spacing: 1.5px !important;
  color: #666 !important;
  text-transform: uppercase !important;
  transition: color 0.2s ease, padding-left 0.2s ease;
}

.search-box .dropdown-vertical-links li.has-dropdown .sub-menu li a:hover {
  color: #b3643b !important;
  padding-left: 6px !important;
}