:root {
  --cyber: #070b19;
  --ink: #0b1024;
  --gold: #f6c945;
  --amberglow: #ffe27a;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  min-height: 100vh;
  background:
    linear-gradient(rgba(246, 201, 69, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(246, 201, 69, .035) 1px, transparent 1px),
    radial-gradient(circle at 15% 10%, rgba(246, 201, 69, .1), transparent 24rem),
    radial-gradient(circle at 85% 20%, rgba(56, 189, 248, .08), transparent 26rem),
    var(--cyber);
  background-size: 42px 42px, 42px 42px, auto, auto, auto;
}

img { max-width: 100%; }

.site-header { transition: background-color .2s ease, box-shadow .2s ease, border-color .2s ease; }
.site-header.nav-scrolled {
  background: rgba(7, 11, 25, .92);
  border-color: rgba(246, 201, 69, .22);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .35);
}

.nav-link, .footer-link, .mobile-nav-link { position: relative; transition: color .18s ease; }
.nav-link:hover, .footer-link:hover, .mobile-nav-link:hover, .nav-link.active, .mobile-nav-link.active { color: var(--gold); }
.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -9px;
  height: 2px;
  transform: scaleX(0);
  background: var(--gold);
  box-shadow: 0 0 14px rgba(246, 201, 69, .9);
  transition: transform .18s ease;
}
.nav-link:hover::after, .nav-link.active::after { transform: scaleX(1); }

.mobile-nav-link {
  display: block;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: .75rem;
  background: rgba(255, 255, 255, .04);
  padding: .85rem 1rem;
  color: #e2e8f0;
  font-weight: 700;
}

.neon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--amberglow), var(--gold));
  color: var(--cyber);
  box-shadow: 0 0 18px rgba(246, 201, 69, .45), inset 0 1px 0 rgba(255, 255, 255, .5);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.neon-button:hover {
  transform: translateY(-2px);
  filter: saturate(1.08);
  box-shadow: 0 0 28px rgba(246, 201, 69, .72), 0 12px 36px rgba(246, 201, 69, .16);
}

.outline-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(246, 201, 69, .75);
  background: rgba(246, 201, 69, .05);
  box-shadow: inset 0 0 18px rgba(246, 201, 69, .08);
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.outline-button:hover {
  transform: translateY(-2px);
  background: rgba(246, 201, 69, .12);
  box-shadow: 0 0 24px rgba(246, 201, 69, .24);
}

.glass-panel, .glass-card {
  border: 1px solid rgba(255, 255, 255, .11);
  background: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .035));
  backdrop-filter: blur(20px);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .3);
}
.glass-card { border-radius: 1rem; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.glass-card:hover {
  transform: translateY(-4px);
  border-color: rgba(246, 201, 69, .38);
  box-shadow: 0 0 28px rgba(246, 201, 69, .13), 0 24px 80px rgba(0, 0, 0, .38);
}

.gold-text { color: var(--gold); text-shadow: 0 0 22px rgba(246, 201, 69, .45); }
.hero-grid::after, .page-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(246, 201, 69, .45), transparent);
}
.page-hero { position: relative; overflow: hidden; }
.page-hero::before {
  content: "";
  position: absolute;
  right: -8rem;
  top: -10rem;
  width: 28rem;
  height: 28rem;
  border: 1px solid rgba(246, 201, 69, .18);
  border-radius: 999px;
  box-shadow: inset 0 0 50px rgba(246, 201, 69, .06), 0 0 80px rgba(246, 201, 69, .08);
}

.hero-bg-slider { position: absolute; inset: 0; z-index: -30; }
.hero-bg-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: scale(1.04);
  transition: opacity 900ms ease, transform 6500ms ease;
}
.hero-bg-slide.is-active { opacity: 1; transform: scale(1); }
.hero-bg-slide img { width: 100%; height: 100%; object-fit: cover; }

.section-kicker {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  color: var(--gold);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .28em;
  text-transform: uppercase;
}
.section-kicker::before {
  content: "";
  width: 2rem;
  height: 1px;
  background: var(--gold);
  box-shadow: 0 0 12px rgba(246, 201, 69, .8);
}

.metric-tile {
  border: 1px solid rgba(246, 201, 69, .28);
  border-radius: .75rem;
  background: rgba(7, 11, 25, .78);
  padding: 1rem;
  backdrop-filter: blur(16px);
}
.metric-tile span {
  display: block;
  color: var(--gold);
  font-family: Orbitron, sans-serif;
  font-size: 1.15rem;
  font-weight: 800;
}
.metric-tile small { display: block; margin-top: .25rem; color: #cbd5e1; font-size: .72rem; }

.stat-number {
  color: rgba(246, 201, 69, .82);
  font-family: Orbitron, sans-serif;
  font-size: .9rem;
  font-weight: 800;
  letter-spacing: .22em;
}
.service-icon {
  width: 4.5rem;
  height: 4.5rem;
  color: var(--gold);
  filter: drop-shadow(0 0 14px rgba(246, 201, 69, .35));
}
.service-card { min-height: 25rem; }

.image-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 1rem;
  background: rgba(255, 255, 255, .05);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .3);
}
.image-card img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 18rem;
  object-fit: cover;
  filter: saturate(.95) contrast(1.03);
}
.image-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 40%, rgba(7, 11, 25, .38));
}

.brand-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.brand-strip img {
  width: 100%;
  height: 7rem;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: .8rem;
  background: rgba(255, 255, 255, .06);
  object-fit: contain;
  padding: 1rem;
}

.repair-item {
  min-height: 11rem;
  border: 1px solid rgba(246, 201, 69, .2);
  border-radius: 1rem;
  background: rgba(255, 255, 255, .055);
  padding: 1.5rem;
  backdrop-filter: blur(18px);
}
.repair-item span {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: radial-gradient(circle, var(--amberglow), var(--gold));
  box-shadow: 0 0 22px rgba(246, 201, 69, .45);
}
.repair-item h3 { margin-top: 1.5rem; color: #fff; font-family: Orbitron, sans-serif; font-size: 1rem; line-height: 1.45; }
.repair-photo, .repair-photo img { min-height: 16rem; }
.repair-photo figcaption {
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  z-index: 1;
  border: 1px solid rgba(246, 201, 69, .2);
  border-radius: .75rem;
  background: rgba(7, 11, 25, .82);
  color: #fff;
  font-weight: 800;
  padding: .8rem 1rem;
  backdrop-filter: blur(16px);
}

.form-field span { display: block; margin-bottom: .55rem; color: #cbd5e1; font-size: .85rem; font-weight: 800; }
.form-field input, .form-field select, .form-field textarea {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: .9rem;
  background: rgba(7, 11, 25, .82);
  color: #fff;
  outline: none;
  padding: .95rem 1rem;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.form-field textarea { resize: vertical; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  border-color: rgba(246, 201, 69, .85);
  background: rgba(7, 11, 25, .95);
  box-shadow: 0 0 0 4px rgba(246, 201, 69, .12), 0 0 24px rgba(246, 201, 69, .16);
}

.map-placeholder::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(246, 201, 69, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(246, 201, 69, .12) 1px, transparent 1px),
    radial-gradient(circle at 65% 40%, rgba(246, 201, 69, .25), transparent 8rem);
  background-size: 34px 34px, 34px 34px, auto;
  opacity: .45;
}
.map-placeholder::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 54%;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 999px;
  background: var(--gold);
  box-shadow: 0 0 0 10px rgba(246, 201, 69, .14), 0 0 28px rgba(246, 201, 69, .8);
}

.hamburger-line, .hamburger-line::before, .hamburger-line::after {
  display: block;
  width: 1.25rem;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transition: transform .18s ease, opacity .18s ease;
}
.hamburger-line { position: relative; }
.hamburger-line::before, .hamburger-line::after { content: ""; position: absolute; left: 0; }
.hamburger-line::before { transform: translateY(-7px); }
.hamburger-line::after { transform: translateY(7px); }
.mobile-menu-button.is-open .hamburger-line { background: transparent; }
.mobile-menu-button.is-open .hamburger-line::before { background: var(--gold); transform: rotate(45deg); }
.mobile-menu-button.is-open .hamburger-line::after { background: var(--gold); transform: rotate(-45deg); }

@media (min-width: 768px) {
  .brand-strip { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .metric-tile { padding: .85rem; }
  .hero-grid { min-height: 100vh; }
}