:root{
  --black:#050505;
  --surface-1:#0e0e0e;
  --surface-2:#161616;
  --line:rgba(255,255,255,0.12);
  --line-soft:rgba(255,255,255,0.07);
  --white:#ffffff;
  --off:#f5f4f2;
  --off-2:#eeece8;
  --silver:#c9c9c9;
  --muted:#8f8f8f;
  --muted-dk:#6f6f6f;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--black);
  color:var(--white);
  font-family:'Inter',sans-serif;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}
.font-display{font-family:'Manrope',sans-serif;}
.tracking-wide-xl{letter-spacing:0.22em;}
.tracking-wide-xxl{letter-spacing:0.32em;}

.diamond{
  width:7px;height:7px;
  background:currentColor;
  transform:rotate(45deg);
  display:inline-block;
  flex-shrink:0;
}
.diamond-outline{
  width:9px;height:9px;
  border:1px solid currentColor;
  transform:rotate(45deg);
  display:inline-block;
  flex-shrink:0;
}

.header-search{
  display:flex;
  align-items:center;
  gap:10px;
  border-bottom:1px solid rgba(255,255,255,0.18);
  padding:7px 2px;
  transition:border-color .3s ease;
}
.header-search:focus-within{border-color:rgba(255,255,255,0.6);}
.header-search input{
  background:transparent;
  border:0;
  outline:none;
  font-family:'Manrope',sans-serif;
  font-size:13px;
  letter-spacing:0.02em;
  color:#fff;
  width:100%;
}
.header-search input::placeholder{color:rgba(255,255,255,0.45);}
.header-search button{
  color:rgba(255,255,255,0.6);
  transition:color .3s ease;
  flex-shrink:0;
  display:flex;
  background:none;
  border:0;
  cursor:pointer;
  padding:0;
}
.header-search button:hover{color:#fff;}

.mobile-link{transition:color .3s ease, opacity .3s ease;}
.mobile-link.active{color:var(--silver) !important;}
#site-header{
  transition:background-color .5s ease, border-color .5s ease, backdrop-filter .5s ease, padding .35s ease;
  border-bottom:1px solid transparent;
}
#site-header.scrolled{
  background-color:rgba(5,5,5,0.86);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-soft);
}
#site-header.solid{
  background-color:rgba(5,5,5,0.96);
  border-bottom:1px solid var(--line-soft);
}
.nav-link{
  position:relative;
  color:var(--silver);
  transition:color .3s ease;
}
.nav-link::after{
  content:'';
  position:absolute;
  left:0; bottom:-6px;
  width:0; height:1px;
  background:var(--white);
  transition:width .35s ease;
}
.nav-link:hover{color:var(--white);}
.nav-link:hover::after{width:100%;}
.nav-link.active{color:var(--white);}
.nav-link.active::after{width:100%;}

.btn-primary{
  background:var(--white); color:#000;
  transition:background-color .35s ease, transform .35s ease;
}
.btn-primary:hover{background:var(--silver); transform:translateY(-1px);}
.btn-outline{
  background:transparent; color:var(--white); border:1px solid rgba(255,255,255,0.55);
  transition:border-color .35s ease, background-color .35s ease, transform .35s ease;
}
.btn-outline:hover{border-color:#fff; background:rgba(255,255,255,0.06); transform:translateY(-1px);}

/* hero video background (home only) */
#hero{
  position:relative;
  height:100svh;
  min-height:640px;
  overflow:hidden;
  background:#000 url('https://images.unsplash.com/photo-1767907571229-01cf4ba03590?fm=jpg&q=70&w=2200&auto=format&fit=crop') center 38% / cover no-repeat;
}
#hero-video-wrap{
  position:absolute; inset:0;
  overflow:hidden;
  pointer-events:none;
}
#yt-bg-mount, #hero-video-wrap iframe{
  position:absolute;
  top:50%; left:50%;
  width:177.78vh;
  height:100vh;
  min-width:100%;
  min-height:56.25vw;
  transform:translate(-50%,-50%);
  border:0;
}
#hero-video-wrap iframe{
  opacity:0;
  transition:opacity 1.2s ease;
}
#hero-video-wrap iframe.ready{opacity:1;}
#hero-video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 38%;
  opacity:0;
  transition:opacity 1s ease;
}
#hero-video.ready{opacity:1;}
#hero h1, #hero p, #hero .fade-up{
  text-shadow:0 1px 3px rgba(0,0,0,0.75), 0 4px 24px rgba(0,0,0,0.5);
}
.hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.20) 35%, rgba(0,0,0,.06) 60%, rgba(0,0,0,.18) 100%),
    linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.0) 32%, rgba(0,0,0,.0) 55%, rgba(0,0,0,.22) 100%);
}

/* page banner (inner pages) */
.page-banner{
  position:relative;
  height:52vh;
  min-height:380px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background-color:#000;
  background-size:cover;
  background-position:center;
}
.page-banner .overlay{
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.35) 100%);
}

.fade-up{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);
}
.fade-up.in{opacity:1; transform:translateY(0);}

.scroll-cue{animation:cueMove 2.2s ease-in-out infinite;}
@keyframes cueMove{
  0%,100%{transform:translateY(0); opacity:.55;}
  50%{transform:translateY(8px); opacity:1;}
}

.brand-logo{
  height:34px;
  width:auto;
  filter:brightness(0) invert(1);
  opacity:0.55;
  transition:opacity .35s ease;
}
.brand-logo:hover{opacity:1;}
@media (min-width:768px){
  .brand-logo{height:40px;}
}

.marquee-track{
  display:flex;
  width:max-content;
  animation:marquee 70s linear infinite;
}
@keyframes marquee{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

.car-card{transition:transform .5s cubic-bezier(.2,.7,.2,1);}
.car-img-wrap{overflow:hidden;}
.car-img{transition:transform .8s cubic-bezier(.2,.7,.2,1);}
.car-card:hover .car-img{transform:scale(1.06);}
.car-card:hover .details-arrow{transform:translateX(6px);}
.details-arrow{transition:transform .35s ease;}

.num-block{transition:transform .5s ease;}
.service-item:hover .num-block{transform:translateX(4px);}
.service-item{border-top:1px solid var(--line-soft);}
.service-item:last-child{border-bottom:1px solid var(--line-soft);}

.step-item{border-top:1px solid var(--line-soft);}
.step-item:last-child{border-bottom:1px solid var(--line-soft);}

input::placeholder, textarea::placeholder{color:#9a9a9a;}

.cookie-banner{transition:transform .6s ease;}

@media (prefers-reduced-motion: reduce){
  .fade-up{opacity:1 !important; transform:none !important; transition:none !important;}
  .scroll-cue{animation:none;}
  .marquee-track{animation:none;}
}

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