/* ==========================================================================
   Aldin Cycles - Local Font Override & JavaScript Enhancements
   ========================================================================== */

/* Font Face - Local fonts to override production CSS font paths */
@font-face {
  font-family: 'Race Sport';
  src: url('../fonts/RaceSportRegular.woff2') format('woff2'),
  url('../fonts/RaceSportRegular.woff') format('woff'),
  url('../fonts/race_sport.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Mobile Menu Transitions */
[class*="mobile-menu"] {
  transition: opacity 0.3s ease, transform 0.3s ease !important;
}

/* FAQ Accordion Transitions */
.mantine-Accordion-panel {
  transition: height 0.2s ease, opacity 0.2s ease !important;
}

.mantine-Accordion-chevron {
  transition: transform 0.2s ease !important;
}

/* Scroll Animations */
.fade-in-on-scroll {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in-on-scroll.fade-in {
  opacity: 1;
  transform: translateY(0);
}

/* Apply scroll animations to sections */
[class*="_section_"] {
  transition: opacity 0.6s ease, transform 0.6s ease;
}

/* ==========================================================================
   Header Scroll Effect - Transparent to White
   ========================================================================== */

/* Header component container */
#header-component {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0) 100%);
}

/* Fixed header spacing - add padding to main content */
main {
  padding-top: 80px;
}

/* Ensure header nav is visible */
#main-header {
  position: relative !important;
}

/* Header transparent state (at top of page) */
#main-header.header-transparent ._nav-links-item_o2316_9 span,
#main-header.header-transparent ._nav-links-item_o2316_9 {
  color: white !important;
}

#main-header.header-transparent ._nav-links_o2316_1 svg {
  stroke: white !important;
}

#main-header.header-transparent .m_77c9d27d {
  background: white !important;
  color: #007bff !important;
}

#main-header.header-transparent ._menu-btn_o2316_49 {
  color: white !important;
}

#main-header.header-transparent ._menu-btn_o2316_49 svg {
  stroke: white !important;
}

/* Header container background transition */
#header-component {
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Header scrolled state (white background) */
#main-header.header-scrolled ._nav-links-item_o2316_9 span,
#main-header.header-scrolled ._nav-links-item_o2316_9 {
  color: var(--mantine-color-deepBlue-text) !important;
  text-shadow: none !important;
}

#main-header.header-scrolled ._nav-links_o2316_1 svg {
  stroke: var(--mantine-color-deepBlue-text) !important;
  filter: none !important;
}

#main-header.header-scrolled ._menu-btn_o2316_49 {
  color: var(--mantine-color-deepBlue-text) !important;
}

#main-header.header-scrolled ._menu-btn_o2316_49 svg {
  stroke: var(--mantine-color-deepBlue-text) !important;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}