/* ============================================================
   static.css — overrides for the pure HTML/CSS/Bootstrap build
   (no JavaScript is used anywhere on this website)
   ============================================================ */

/* 1. Scroll-reveal animations were JS driven — show everything */
.rv, .reveal, .reveal-zoom, .reveal-left, .reveal-right {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* 2. Hero banner controls are implemented below without JavaScript */

/* 3. Carousel dots / testimonial arrows were JS driven */
.mcar-dots, .t-dots, .slider-dots, .t-nav { display: none !important; }
.t-track { transform: none !important; }

/* 4. Gallery filter chips need JS — hidden in the static build */
.chips, #galChips { display: none !important; }

/* 5. Gallery items are plain links that open the full image / video */
a.g-item, a.v-thumb { display: block; text-decoration: none; }

/* 6. FAQ — CSS only accordion using <details> */
.faq-q { list-style: none; }
.faq-q > summary { list-style: none; cursor: pointer; }
.faq-q > summary::-webkit-details-marker { display: none; }
.faq-q[open] > summary i { transform: rotate(180deg); }
.faq-q[open] .faq-a { max-height: 600px; }

/* 7. CSS only mobile navigation (no bootstrap JS) */
.nav-check { display: none; }
@media (max-width: 991.98px) {
  .site-nav .nav-menu { display: none; }
  .nav-check:checked ~ .nav-menu { display: block !important; width: 100%; }
  .site-nav .navbar-toggler { cursor: pointer; margin-left: auto; }
}

/* 8. Back to top is an anchor link in the static build */
.back-to-top { text-decoration: none; }

/* 9. Video players use native controls */
.v-main video, .about-vid { width: 100%; display: block; }

/* ============================================================
   CSS-ONLY INTERACTIONS (no JS): hero slider, gallery filter,
   mobile submenu dropdown
   ============================================================ */

/* --- 1. HERO SLIDER: touch swipe + arrows + dots, no JavaScript --- */
.hero-slider {
  position: relative;
  overflow: visible !important;
}
.hs-slide:not(:first-child) { display: flex !important; }
.hs-track {
  width: 100% !important;
  display: flex !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  touch-action: pan-x;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  animation: none !important;
}
.hs-track::-webkit-scrollbar { display: none; }
.hs-slide {
  flex: 0 0 100% !important;
  min-width: 100%;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.hs-nav {
  display: flex !important;
  opacity: 1 !important;
  position: absolute;
  top: 50%;
  z-index: 8;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.85);
  border-radius: 50%;
  background: rgba(0,74,172,.92);
  color: #fff;
  box-shadow: 0 8px 20px rgba(0,74,172,.25);
  transform: translateY(-50%);
  transition: background .2s ease, transform .2s ease;
}
.hs-nav:hover { background: var(--blue); color: #fff; transform: translateY(-50%) scale(1.08); }
.hs-nav.prev { left: 8px; }
.hs-nav.next { right: 8px; }
.hero-dots, #hsDots {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 14px;
}
.hero-dots a {
  display: block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #b8c8df;
  box-shadow: 0 0 0 1px rgba(0,74,172,.12);
  transition: width .2s ease, background .2s ease;
}
.hero-dots a:hover, .hero-dots a:focus, .hero-dots a.on {
  width: 24px;
  border-radius: 999px;
  background: var(--navy);
}
.hero:has(#hero-slide-2:target) .hero-dots a,
.hero:has(#hero-slide-3:target) .hero-dots a,
.hero:has(#hero-slide-4:target) .hero-dots a { width: 9px; border-radius: 50%; background: #b8c8df; }
.hero:has(#hero-slide-2:target) .hero-dots a:nth-child(2),
.hero:has(#hero-slide-3:target) .hero-dots a:nth-child(3),
.hero:has(#hero-slide-4:target) .hero-dots a:nth-child(4) { width: 24px; border-radius: 999px; background: var(--navy); }
@media (max-width: 767.98px) {
  .hs-nav { width: 38px; height: 38px; font-size: 14px; }
  .hs-nav.prev { left: 4px; }
  .hs-nav.next { right: 4px; }
  .hero-dots, #hsDots { margin-top: 10px; }
}

/* --- 2. PHOTO GALLERY FILTER (radio + labels, no JS) --- */
.chips, #galChips { display: flex !important; }
.chips .chip { cursor: pointer; user-select: none; }
#h-all:checked   ~ #galChips label[for="h-all"],
#h-vehicles:checked ~ #galChips label[for="h-vehicles"],
#h-interior:checked ~ #galChips label[for="h-interior"],
#h-units:checked ~ #galChips label[for="h-units"],
#h-factory:checked ~ #galChips label[for="h-factory"],
#h-events:checked ~ #galChips label[for="h-events"],
#g-all:checked   ~ #galChips label[for="g-all"],
#g-vehicles:checked ~ #galChips label[for="g-vehicles"],
#g-interior:checked ~ #galChips label[for="g-interior"],
#g-units:checked ~ #galChips label[for="g-units"],
#g-factory:checked ~ #galChips label[for="g-factory"],
#g-events:checked ~ #galChips label[for="g-events"] {
  background: var(--navy); color: #fff;
}
/* hide non-matching tiles */
#h-vehicles:checked ~ .mcar-wrap [data-cat]:not([data-cat="vehicles"]),
#h-interior:checked ~ .mcar-wrap [data-cat]:not([data-cat="interior"]),
#h-units:checked    ~ .mcar-wrap [data-cat]:not([data-cat="units"]),
#h-factory:checked  ~ .mcar-wrap [data-cat]:not([data-cat="factory"]),
#h-events:checked   ~ .mcar-wrap [data-cat]:not([data-cat="events"]),
#g-vehicles:checked ~ .mcar-wrap [data-cat]:not([data-cat="vehicles"]),
#g-interior:checked ~ .mcar-wrap [data-cat]:not([data-cat="interior"]),
#g-units:checked    ~ .mcar-wrap [data-cat]:not([data-cat="units"]),
#g-factory:checked  ~ .mcar-wrap [data-cat]:not([data-cat="factory"]),
#g-events:checked   ~ .mcar-wrap [data-cat]:not([data-cat="events"]) {
  display: none !important;
}

/* --- 3. MOBILE SUBMENU DROPDOWN (checkbox toggle) --- */
.sub-check { display: none; }
.sub-tog { display: none; }
@media (max-width: 991.98px) {
  .site-nav .has-sub { position: relative; }
  .sub-tog {
    display: flex; align-items: center; justify-content: center;
    position: absolute; right: 4px; top: 2px;
    width: 34px; height: 34px; border-radius: 8px; z-index: 5;
    color: var(--blue, #004aac); cursor: pointer; font-size: 13px;
    transition: transform .25s ease, background .2s ease;
  }
  .sub-tog:hover { background: rgba(0,74,172,.08); }
  .site-nav .sub-menu {
    display: block; max-height: 0; overflow: hidden;
    opacity: 0; visibility: hidden;
    transition: max-height .32s ease, opacity .25s ease, visibility .25s;
  }
  .sub-check:checked ~ .sub-menu {
    max-height: 340px; opacity: 1; visibility: visible;
  }
  .sub-check:checked ~ .sub-tog { transform: rotate(180deg); }
}
