:root{
  --primary-color:#001f3f;
  --primary-color-light:#0047ab;
  --primary-color-dark:#001429;
  --primary-color-rgb:0, 31, 63;
  --secondary-color:#ffffff;
  --accent-color:#f8f8f8;
  --text-color:#333333;
  --text-color-light:#777777;
  --card-shadow:0 4px 8px rgba(0, 0, 0, 0.1);
  --transition-speed:0.3s;
}


/* Car Silhouette Preloader */
#preloader {
  position: fixed;
  inset: 0;
  background: var(--primary-color); /* match hero / brand background */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 2000;
  opacity: 1;
  visibility: visible;
  transition: opacity 560ms cubic-bezier(0.22, 1, 0.36, 1), visibility 560ms cubic-bezier(0.22, 1, 0.36, 1); /* smoother fade-out */
}

#preloader.hidden {
  opacity: 0;
  visibility: hidden;
}

.preloader-svg {
  width: min(68vw, 560px);
  height: auto;
}

.preloader-svg path {
  stroke: #ffffff; /* white line on dark background */
  stroke-width: 0.5;
  fill: transparent;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Accessibility: reduced motion */
@media (prefers-reduced-motion: reduce) {
  #preloader {
    transition: none !important;
  }
}

/* Crossfade page content with the preloader */
body.preloading > :not(#preloader):not(.hero) {
  opacity: 0;
}

body.page-ready > :not(#preloader) {
  opacity: 1;
  transition: opacity 520ms cubic-bezier(0.22, 1, 0.36, 1) 60ms;
}