/* ============ Boris Yonchev — Racing Driver ============ */

html { scroll-behavior: smooth; }

body {
  background-color: #050505;
  color: #ffffff;
  margin: 0;
  overflow-x: hidden;
  font-family: 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
}

::selection { background: #E10600; color: #fff; }

/* Custom scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #0A0A0A; }
::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 0; }
::-webkit-scrollbar-thumb:hover { background: #E10600; }

/* Skip link (a11y) */
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100000;
  background: #E10600; color: #fff; padding: .75rem 1.5rem;
  font-weight: 900; text-transform: uppercase; letter-spacing: .2em; font-size: .7rem;
}
.skip-link:focus { left: 0; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  font-family: 'Inter Tight', sans-serif; font-weight: 900;
  text-transform: uppercase; letter-spacing: .18em;
  transition: all .3s ease; cursor: pointer; text-decoration: none;
  position: relative; overflow: hidden;
}
.btn-primary { background: #E10600; color: #fff; box-shadow: 0 0 25px rgba(225,6,0,.4); }
.btn-primary:hover { background: #fff; color: #E10600; box-shadow: 0 0 35px rgba(255,255,255,.25); }
.btn-outline { border: 1px solid #fff; color: #fff; }
.btn-outline:hover { background: #fff; color: #E10600; }
.btn svg { transition: transform .3s ease; }
.btn:hover svg { transform: translateX(4px); }

/* Navbar scrolled state */
#navbar { transition: all .3s ease; }
#navbar.scrolled {
  background: rgba(0,0,0,.95);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding-top: .75rem; padding-bottom: .75rem;
}
.nav-link { position: relative; }
.nav-link::after {
  content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 2px;
  background: #E10600; transition: width .3s ease;
}
.nav-link:hover::after, .nav-link.active::after { width: 100%; }

/* Mobile menu */
#mobileMenu {
  transform: translateY(-100%);
  transition: transform .5s cubic-bezier(.77,0,.18,1);
}
#mobileMenu.open { transform: translateY(0); }
#mobileMenu .m-link { opacity: 0; transform: translateY(24px); transition: all .5s ease; }
#mobileMenu.open .m-link { opacity: 1; transform: translateY(0); }

/* Scroll reveal */
.reveal { opacity: 0; transform: translateY(36px); transition: opacity .8s ease, transform .8s ease; will-change: opacity, transform; }
.reveal-left { transform: translateX(-48px); }
.reveal-right { transform: translateX(48px); }
.reveal.visible { opacity: 1; transform: translate(0,0); }
@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-left, .reveal-right { opacity: 1; transform: none; transition: none; }
}

/* Marquee ticker */
.ticker { overflow: hidden; white-space: nowrap; }
.ticker-inner { display: inline-block; animation: ticker 28s linear infinite; }
@keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Hero giant background word */
.bg-word {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  pointer-events: none; user-select: none;
}
.bg-word span {
  font-family: 'Inter Tight', sans-serif; font-weight: 900; text-transform: uppercase;
  color: #fff; opacity: .03; line-height: 1; letter-spacing: -.04em;
}

/* Checkered accent strip */
.checkers {
  background-image: repeating-conic-gradient(#ffffff14 0% 25%, transparent 0% 50%);
  background-size: 16px 16px;
}

/* Path page timeline */
.timeline-line {
  position: absolute; left: 27px; top: 0; bottom: 0; width: 2px;
  background: linear-gradient(to bottom, #E10600, rgba(225,6,0,.15));
}
@media (min-width: 768px) { .timeline-line { left: 50%; margin-left: -1px; } }

/* Image hover zoom */
.img-zoom { overflow: hidden; }
.img-zoom img { transition: transform .7s ease, opacity .7s ease; }
.img-zoom:hover img { transform: scale(1.06); }

/* Card hover */
.hover-card { transition: border-color .4s ease, transform .4s ease, box-shadow .4s ease; }
.hover-card:hover { border-color: rgba(225,6,0,.6) !important; transform: translateY(-4px); box-shadow: 0 18px 40px -18px rgba(225,6,0,.35); }

/* Diagonal red stripes overlay for stats bar */
.stripes {
  background-image: repeating-linear-gradient(-45deg, rgba(0,0,0,.12) 0 14px, transparent 14px 28px);
}

/* Language dropdown */
.lang-menu { display: none; }
.lang-menu.open { display: block; }

/* Focus visibility (a11y) */
a:focus-visible, button:focus-visible {
  outline: 2px solid #E10600; outline-offset: 3px;
}

/* Bulgarian flag stripe */
.flag-bg { display: flex; flex-direction: column; overflow: hidden; }
.flag-bg .f-w { flex: 1; background: #fff; }
.flag-bg .f-g { flex: 1; background: #00966E; }
.flag-bg .f-r { flex: 1; background: #D62612; }
