:root{
  --bg:#0d0d0d;
  --bg2:#151515;
  --gold:#d5a62e;
  --ivory:#f5f0e6;
  --muted:#b9b1a3;
  --earth:#222019;
  --line:rgba(213,166,46,.25);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;width:100%;max-width:100%;overflow-x:clip}
body{
  margin:0;
  background:var(--bg);
  color:var(--ivory);
  font-family:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  line-height:1.6;
  width:100%;
  max-width:100%;
  overflow-x:clip;
}
body.menu-open{overflow:hidden}
img{display:block;width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;line-height:.96;margin:0 0 1rem;font-weight:600;letter-spacing:-.025em}
h1{font-size:clamp(2.8rem,11vw,6.2rem);max-width:12ch;font-weight:600}
h2{font-size:clamp(2.35rem,8vw,4.8rem);max-width:15ch;font-weight:600}
h3{font-size:1.55rem;font-weight:600}
.container{width:min(calc(100% - 36px),1180px);margin-inline:auto}
.section{padding:76px 0}
.section-dark{background:var(--bg2)}
.section-earth{background:var(--earth)}
.eyebrow{font-family:"Manrope",sans-serif;letter-spacing:.19em;font-size:.7rem;font-weight:800;color:var(--gold);margin:0 0 14px;text-transform:uppercase}

.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 18px;
  transition:.25s;
  background:linear-gradient(to bottom,rgba(0,0,0,.74),transparent);
}
.site-header.scrolled,
.site-header.menu-open{
  background:rgba(13,13,13,.96);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.brand img{width:58px;height:auto}
.menu-toggle{
  width:48px;
  height:48px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.35);
  border-radius:50%;
  display:grid;
  place-content:center;
  gap:5px;
  cursor:pointer;
}
.menu-toggle span{width:22px;height:2px;background:var(--ivory);display:block;transition:.2s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.main-nav{
  position:fixed;
  top:78px;
  left:16px;
  right:16px;
  z-index:90;
  display:grid;
  gap:14px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:22px;
  background:rgba(16,16,16,.98);
  box-shadow:0 26px 60px rgba(0,0,0,.45);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-10px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
}
.main-nav.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.main-nav a{
  text-decoration:none;
  font:600 1.35rem "Cormorant Garamond",Georgia,serif;
  padding:.15rem 0;
}

.hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;padding:120px 0 64px}
.hero-media,.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-media img{object-position:57% center}
.hero-shade,.banner-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2) 20%,rgba(0,0,0,.84) 90%)}
.hero-content{position:relative;z-index:2}
.hero-copy{max-width:32rem;font-size:1.05rem;color:#eee}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.btn{min-height:48px;padding:13px 18px;border-radius:999px;text-decoration:none;font-family:"Manrope",sans-serif;font-weight:800;letter-spacing:.01em;display:inline-flex;align-items:center;justify-content:center}
.btn-gold{background:var(--gold);color:#111}
.btn-ghost{border:1px solid rgba(255,255,255,.45);background:rgba(0,0,0,.2)}
.intro p{max-width:62ch;color:#d6d0c6}
.intro a,.split a,.section a{text-underline-offset:3px}
.quick-links,.inline-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.quick-links a,.inline-links a,.outdoor-grid a{border:1px solid var(--line);padding:10px 13px;text-decoration:none;border-radius:999px}

.service-grid{display:grid;gap:16px;margin-top:28px}
.visual-card{position:relative;min-height:360px;overflow:hidden;border-radius:20px;text-decoration:none;background:#222}
.visual-card picture,.visual-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.visual-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.85))}
.visual-card span{position:absolute;left:20px;bottom:20px;z-index:2;display:grid}
.visual-card b{font-family:"Manrope",sans-serif;font-size:1.15rem;letter-spacing:.08em}
.visual-card small{color:#ddd}

.split{display:grid;gap:28px}
.split-media{border-radius:20px;overflow:hidden}
.split-media img{aspect-ratio:4/3;object-fit:cover}
.split-copy p{color:#d2cbc0}
.text-link{font-weight:800;color:var(--gold)}

.image-banner{min-height:76svh;position:relative;display:flex;align-items:flex-end;padding:60px 0}
.image-banner>picture,.image-banner>picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.banner-copy{position:relative;z-index:2}

.vehicle-heading{display:flex;align-items:end;justify-content:space-between;gap:16px}
.vehicle-controls{display:flex;gap:8px;flex:0 0 auto}
.vehicle-arrow{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#111;color:var(--ivory);font-size:1.25rem;cursor:pointer;display:grid;place-items:center}
.vehicle-arrow:active{transform:scale(.96)}
.vehicle-hint{margin-top:2px;color:var(--muted);font-size:.82rem}
.vehicle-scroller{cursor:grab}
.vehicle-scroller.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.vehicle-scroller.dragging *{pointer-events:none}
.vehicle-scroller{
  display:flex;
  gap:14px;
  width:100%;
  max-width:100vw;
  overflow-x:auto;
  overflow-y:hidden;
  padding:18px 18px 20px;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:18px;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
  overscroll-behavior-inline:contain;
}
.vehicle-scroller::-webkit-scrollbar{display:none}
.vehicle-card{
  flex:0 0 min(82vw,340px);
  scroll-snap-align:start;
  scroll-snap-stop:always;
  background:#1b1b1b;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  min-width:0;
}
.vehicle-card img{aspect-ratio:4/5;object-fit:cover}
.vehicle-card h3,.vehicle-card p{margin-left:16px;margin-right:16px}
.vehicle-card h3{margin-top:16px;margin-bottom:4px}
.vehicle-card p{margin-top:0;color:var(--muted)}

.outdoor-grid{display:grid;gap:12px;margin-top:26px}
.outdoor-grid a{border-radius:14px;padding:18px}
.why-grid{display:grid;gap:12px;margin-top:28px}
.why-grid>div{border-top:1px solid var(--line);padding:16px 0;display:grid;gap:4px}
.why-grid span{color:var(--muted)}
.contact-strip{padding:80px 0 110px;background:#121212;border-top:1px solid var(--line)}
address{font-style:normal;color:var(--muted);margin-top:30px}
.mobile-call{position:fixed;z-index:45;left:16px;right:16px;bottom:calc(12px + env(safe-area-inset-bottom));height:50px;background:var(--gold);color:#111;border-radius:999px;display:grid;place-items:center;text-decoration:none;font-weight:900;box-shadow:0 10px 30px rgba(0,0,0,.35)}
footer{padding:54px 0 90px;background:#090909;border-top:1px solid var(--line)}
.footer-grid{display:grid;gap:30px}
.footer-grid img{width:72px}
.footer-grid>div{display:grid;gap:8px}
.footer-grid a{text-decoration:none}
.copyright{width:min(calc(100% - 36px),1180px);margin:28px auto 0;color:#777;font-size:.85rem}

@media(min-width:760px){
  .container{width:min(calc(100% - 64px),1180px)}
  .service-grid{grid-template-columns:repeat(3,1fr)}
  .visual-card{min-height:520px}
  .split{grid-template-columns:1.15fr .85fr;align-items:center}
  .vehicle-scroller{padding-left:max(32px,calc((100vw - 1180px)/2));padding-right:32px;scroll-padding-inline:max(32px,calc((100vw - 1180px)/2))}.vehicle-card{flex-basis:min(40vw,420px)}
  .outdoor-grid,.why-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr}
  .mobile-call{display:none}
}

@media(min-width:980px){
  .site-header{padding:12px 32px}
  .menu-toggle{display:none}
  .main-nav{
    position:static;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
    background:transparent;
    border:none;
    box-shadow:none;
    padding:0;
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:24px;
  }
  .main-nav a{font:700 .78rem "Manrope",system-ui;text-transform:uppercase;letter-spacing:.11em}
  .hero{padding-bottom:84px}
  .hero-media img{object-position:center 58%}
  .vehicle-card{flex-basis:min(28vw,360px)}
  .outdoor-grid{grid-template-columns:repeat(4,1fr)}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* V4: one-at-a-time premium vehicle carousel */
.vehicles-section{overflow:hidden}
.vehicle-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
.vehicle-controls{display:flex;gap:8px;flex:0 0 auto}
.vehicle-arrow{
  width:46px;height:46px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,255,255,.02);color:var(--ivory);font-size:1.25rem;
  display:grid;place-items:center;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.vehicle-arrow:hover{border-color:var(--gold);background:rgba(213,166,46,.08);transform:translateY(-2px)}
.vehicle-arrow:active{transform:scale(.95)}
.vehicle-carousel{
  margin-top:28px;
  overflow:hidden;
  border-radius:24px;
  padding:0;
  touch-action:pan-y;
}
.vehicle-track{
  display:flex;
  width:100%;
  transition:transform .55s cubic-bezier(.22,.75,.18,1);
  will-change:transform;
}
.vehicle-card{
  flex:0 0 100%;
  min-width:100%;
  background:linear-gradient(180deg,#1a1a1a,#111);
  border:1px solid rgba(213,166,46,.28);
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.34);
  opacity:.58;
  transform:scale(.965);
  transition:opacity .5s ease,transform .55s cubic-bezier(.22,.75,.18,1),box-shadow .5s ease,border-color .5s ease;
}
.vehicle-card.active{
  opacity:1;
  transform:scale(1);
  border-color:rgba(213,166,46,.56);
  box-shadow:0 28px 70px rgba(0,0,0,.48),0 0 0 1px rgba(213,166,46,.08) inset;
}
.vehicle-image-wrap{position:relative;overflow:hidden;background:#0b0b0b}
.vehicle-image-wrap:after{
  content:"";position:absolute;inset:auto 0 0;height:34%;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.44));pointer-events:none;
}
.vehicle-card img{
  width:100%;height:clamp(360px,68svh,600px);object-fit:cover;
  transform:scale(1.025);transition:transform 1s cubic-bezier(.22,.75,.18,1),filter .5s ease;
  filter:saturate(.88) contrast(1.02);
}
.vehicle-card.active img{transform:scale(1.075);filter:saturate(1) contrast(1.04)}
.vehicle-info{
  display:flex;align-items:flex-start;gap:16px;padding:18px 18px 20px;
  position:relative;
}
.vehicle-info:before{
  content:"";position:absolute;left:18px;right:18px;top:0;height:1px;
  background:linear-gradient(90deg,var(--gold),transparent 75%);
  transform:scaleX(.25);transform-origin:left;transition:transform .6s ease;
}
.vehicle-card.active .vehicle-info:before{transform:scaleX(1)}
.vehicle-count{
  color:var(--gold);font-size:.74rem;letter-spacing:.15em;font-weight:800;padding-top:6px;
}
.vehicle-card h3{margin:0 0 4px;font-size:1.55rem}
.vehicle-card p{margin:0;color:var(--muted)}
.vehicle-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px}
.vehicle-dots{display:flex;gap:7px}
.vehicle-dots button{
  width:8px;height:8px;padding:0;border:0;border-radius:999px;background:#5d574c;cursor:pointer;
  transition:width .3s ease,background .3s ease;
}
.vehicle-dots button.active{width:28px;background:var(--gold)}
.vehicle-hint{color:var(--muted);font-size:.78rem;text-align:right}

@media(max-width:759px){
  .vehicle-heading{align-items:center}
  .vehicle-heading h2{max-width:9ch}
  .vehicle-carousel{width:100%;max-width:100%;margin-inline:auto}
  .vehicle-card img{height:min(64svh,560px)}
  .vehicle-hint{max-width:13rem}
}
@media(min-width:760px){
  .vehicle-carousel{max-width:820px}
  .vehicle-footer{max-width:820px}
  .vehicle-card img{height:590px}
}
@media(min-width:980px){
  .vehicle-carousel{max-width:900px}
  .vehicle-footer{max-width:900px}
  .vehicle-card img{height:620px}
}

/* =========================================================
   Fotis Motion System V1 — Mustang Events
   Mobile-first, lightweight motion only
   ========================================================= */

/* Scroll progress */
.scroll-progress{
  position:fixed;
  top:0;left:0;
  width:100%;
  height:2px;
  z-index:120;
  pointer-events:none;
  background:transparent;
}
.scroll-progress__bar{
  display:block;
  width:100%;height:100%;
  transform:scaleX(0);
  transform-origin:left center;
  background:linear-gradient(90deg,#8b6518,var(--gold),#f2d578);
  box-shadow:0 0 12px rgba(213,166,46,.45);
  will-change:transform;
}

/* Hero: slow cinematic zoom + gentle content entrance */
.hero-media img{
  animation:heroCinematicZoom 14s ease-out both;
  transform-origin:58% 50%;
  will-change:transform;
}
@keyframes heroCinematicZoom{
  from{transform:scale(1.035)}
  to{transform:scale(1.105)}
}
.hero-content .eyebrow,
.hero-content h1,
.hero-content .hero-copy,
.hero-content .cta-row{
  opacity:0;
  transform:translateY(20px);
  animation:heroTextIn .72s cubic-bezier(.22,.75,.18,1) forwards;
}
.hero-content h1{animation-delay:.09s}
.hero-content .hero-copy{animation-delay:.18s}
.hero-content .cta-row{animation-delay:.27s}
@keyframes heroTextIn{
  to{opacity:1;transform:translateY(0)}
}

/* Generic scroll reveal */
.motion-reveal{
  opacity:0;
  transform:translateY(24px);
  filter:blur(8px);
  transition:
    opacity .72s cubic-bezier(.22,.75,.18,1),
    transform .72s cubic-bezier(.22,.75,.18,1),
    filter .72s ease;
  transition-delay:var(--motion-delay,0ms);
  will-change:opacity,transform,filter;
}
.motion-reveal.is-visible{
  opacity:1;
  transform:none;
  filter:blur(0);
}

/* Image mask reveal */
.motion-image{
  overflow:hidden;
  clip-path:inset(0 0 12% 0 round 20px);
  transition:clip-path .9s cubic-bezier(.22,.75,.18,1);
}
.motion-image.is-visible{clip-path:inset(0 0 0 0 round 20px)}
.motion-image img{
  transform:scale(1.055);
  transition:transform 1.05s cubic-bezier(.22,.75,.18,1),filter .7s ease;
  filter:saturate(.82) contrast(1.02);
}
.motion-image.is-visible img{
  transform:scale(1);
  filter:saturate(1) contrast(1.03);
}

/* Premium service-card motion */
.visual-card{
  isolation:isolate;
  border:1px solid rgba(213,166,46,.16);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.visual-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  border-radius:inherit;
  border:1px solid transparent;
  background:linear-gradient(120deg,transparent 20%,rgba(213,166,46,.55),transparent 78%) border-box;
  -webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:0;
  transition:opacity .32s ease;
}
.visual-card img{transition:transform .8s cubic-bezier(.22,.75,.18,1),filter .45s ease}
.visual-card:active{transform:scale(.985)}
@media(hover:hover){
  .visual-card:hover{
    transform:translateY(-5px);
    border-color:rgba(213,166,46,.45);
    box-shadow:0 18px 42px rgba(0,0,0,.32);
  }
  .visual-card:hover::before{opacity:1}
  .visual-card:hover img{transform:scale(1.055);filter:saturate(1.05)}
}

/* Split section subtle image movement */
.split-media img{
  transition:transform 1s cubic-bezier(.22,.75,.18,1);
  transform:scale(1.03);
}
.split-media.is-visible img{transform:scale(1)}

/* Horses banner: slow scale only while visible */
.image-banner>picture img{
  transform:scale(1.035);
  transition:transform 5.5s cubic-bezier(.22,.75,.18,1);
}
.image-banner.motion-active>picture img{transform:scale(1.09)}
.banner-copy h2{max-width:12ch}

/* Vehicle carousel: stronger premium transition */
.vehicle-card{
  transform:scale(.972) translateY(8px);
}
.vehicle-card.active{
  transform:scale(1) translateY(0);
}
.vehicle-card.active .vehicle-count{
  text-shadow:0 0 16px rgba(213,166,46,.35);
}
.vehicle-arrow{
  position:relative;
  overflow:hidden;
}
.vehicle-arrow::after{
  content:"";
  position:absolute;
  inset:-40%;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%);
  transform:translateX(-120%);
}
.vehicle-arrow:active::after{animation:buttonSweep .5s ease}
@keyframes buttonSweep{to{transform:translateX(120%)}}

/* Chips / links: soft motion */
.quick-links a,.inline-links a,.outdoor-grid a{
  transition:transform .22s ease,border-color .22s ease,background .22s ease;
}
.quick-links a:active,.inline-links a:active,.outdoor-grid a:active{transform:scale(.97)}
@media(hover:hover){
  .quick-links a:hover,.inline-links a:hover,.outdoor-grid a:hover{
    transform:translateY(-2px);
    border-color:rgba(213,166,46,.58);
    background:rgba(213,166,46,.055);
  }
}

/* Why section: sequential gold line reveal */
.why-grid>div{position:relative;border-top:0}
.why-grid>div::before{
  content:"";
  position:absolute;
  top:0;left:0;
  width:100%;height:1px;
  background:linear-gradient(90deg,var(--gold),rgba(213,166,46,.12));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .7s cubic-bezier(.22,.75,.18,1);
}
.why-grid>div.is-visible::before{transform:scaleX(1)}

/* CTA micro glow — static and light on mobile */
.btn-gold,.mobile-call{
  position:relative;
  overflow:hidden;
}
.btn-gold::after,.mobile-call::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,transparent 25%,rgba(255,255,255,.22) 48%,transparent 70%);
  transform:translateX(-125%);
  animation:ctaShine 5.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes ctaShine{
  0%,72%,100%{transform:translateX(-125%)}
  82%{transform:translateX(125%)}
}

/* Header refinement */
.site-header .brand{
  transition:transform .28s ease,opacity .28s ease;
}
.site-header.scrolled .brand{transform:scale(.93)}

/* Mobile: keep motion elegant and cheap */
@media(max-width:759px){
  .section{padding-block:68px}
  .motion-reveal{transform:translateY(18px);filter:blur(6px)}
  .vehicle-card.active img{transform:scale(1.045)}
  .image-banner>picture img{transition-duration:4.5s}
}

/* Respect reduced motion */
@media(prefers-reduced-motion:reduce){
  .hero-media img,
  .hero-content .eyebrow,
  .hero-content h1,
  .hero-content .hero-copy,
  .hero-content .cta-row,
  .btn-gold::after,
  .mobile-call::after{
    animation:none!important;
  }
  .hero-content .eyebrow,
  .hero-content h1,
  .hero-content .hero-copy,
  .hero-content .cta-row,
  .motion-reveal{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
  }
  .motion-image{clip-path:none!important}
  .motion-image img,.image-banner>picture img{transform:none!important}
}

/* V6 — Horses banner full-bleed fix */
.image-banner{
  min-height:100svh;
  margin:0;
  padding:0;
  overflow:hidden;
  background:#0d0d0d;
}
.image-banner>picture{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  overflow:hidden;
}
.image-banner>picture img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  object-fit:cover;
  object-position:center center;
}
.banner-copy{
  position:relative;
  z-index:2;
  width:min(calc(100% - 36px),1180px);
  margin-inline:auto;
  padding:72px 0 58px;
  align-self:flex-end;
}
@media(min-width:760px){
  .banner-copy{width:min(calc(100% - 64px),1180px);padding:88px 0 72px}
}

/* V7 — header/content seam fix */
@media(max-width:979px){
  .site-header{
    height:80px;
    min-height:80px;
    padding:0 16px;
    margin:0;
  }
  .brand,.menu-toggle{margin:0}
  .main-nav{top:80px}
  main{
    margin:0;
    padding:0;
  }
  .hero{
    margin:0;
    padding-top:120px;
  }
  .hero-media,.hero-media img{
    top:0;
    bottom:0;
  }
  section[id]{scroll-margin-top:80px}
  .image-banner{
    margin-top:0!important;
    margin-bottom:0!important;
    border-top:0!important;
    border-bottom:0!important;
  }
}

/* V8 — contain cinematic hero zoom inside the hero bounds */
.hero{
  overflow:hidden;
  isolation:isolate;
}
.hero-media{
  display:block;
  overflow:hidden;
  line-height:0;
}
.hero-media img{
  backface-visibility:hidden;
  transform:translateZ(0) scale(1.035);
}


/* V28 — mobile viewport lock + complete services menu */
html,body{
  width:100%;
  max-width:100%;
  overflow-x:clip;
}
body{position:relative}
main,header,footer,section{max-width:100%}
img,picture,video,svg{max-width:100%}

.desktop-nav{display:none}
.mobile-nav{display:grid;gap:0;min-width:0}
.mobile-nav-label{
  margin:14px 0 6px;
  padding:10px 0 7px;
  border-bottom:1px solid rgba(213,166,46,.28);
  color:var(--gold);
  font:800 .68rem/1.2 "Manrope",system-ui,sans-serif;
  letter-spacing:.16em;
}
.mobile-nav-label:first-child{margin-top:0}
.mobile-nav a{
  display:block;
  min-width:0;
  padding:9px 0;
  font:600 1.05rem/1.22 "Manrope",system-ui,sans-serif;
  overflow-wrap:anywhere;
}
@media(max-width:979px){
  .main-nav{
    left:12px;
    right:12px;
    width:auto;
    max-width:calc(100% - 24px);
    max-height:calc(100dvh - 96px - env(safe-area-inset-bottom));
    padding:18px 20px 24px;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  body.menu-open{overflow:hidden;overscroll-behavior:none}
  .vehicle-carousel,.vehicle-track,.vehicle-card{max-width:100%}
}
@media(min-width:980px){
  .desktop-nav{display:flex;align-items:center;gap:22px}
  .mobile-nav{display:none}
  .main-nav{overflow:visible;max-height:none}
}

/* V29 — mobile header/menu rebuild: keep brand visible and menu fully usable */
@media (max-width:979px){
  .site-header{
    height:88px;
    min-height:88px;
    padding:8px 16px 8px 18px;
    z-index:130;
    isolation:isolate;
    background:rgba(13,13,13,.92);
    border-bottom:1px solid rgba(213,166,46,.14);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }
  .site-header.menu-open,
  .site-header.scrolled{
    background:rgba(13,13,13,.985);
    border-bottom-color:rgba(213,166,46,.26);
  }
  .site-header .brand{
    position:relative;
    z-index:132;
    display:flex;
    align-items:center;
    flex:0 0 auto;
    min-width:76px;
    height:72px;
    margin:0;
    transform:none !important;
  }
  .site-header .brand img{
    width:72px;
    max-width:72px;
    height:72px;
    object-fit:contain;
    object-position:left center;
  }
  .menu-toggle{
    position:relative;
    z-index:132;
    flex:0 0 54px;
    width:54px;
    height:54px;
    margin:0;
    background:rgba(18,18,18,.96);
    border-color:rgba(213,166,46,.34);
  }
  .menu-toggle span{width:25px;height:2px}

  .main-nav{
    position:fixed;
    z-index:120;
    top:88px;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    max-width:none;
    max-height:none;
    margin:0;
    padding:18px 22px calc(32px + env(safe-area-inset-bottom));
    border:0;
    border-radius:0;
    background:rgba(13,13,13,.995);
    box-shadow:none;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-8px);
  }
  .main-nav.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
  }
  .mobile-nav{
    display:block;
    width:min(100%,560px);
    margin:0 auto;
    padding-bottom:24px;
  }
  .mobile-nav-label{
    margin:18px 0 5px;
    padding:10px 2px 9px;
    border-bottom:1px solid rgba(213,166,46,.3);
    font-size:.68rem;
    letter-spacing:.17em;
  }
  .mobile-nav-label:first-child{margin-top:0}
  .mobile-nav a{
    display:flex;
    align-items:center;
    width:100%;
    min-height:46px;
    padding:10px 2px;
    border-bottom:1px solid rgba(255,255,255,.055);
    font:600 1rem/1.28 "Manrope",system-ui,sans-serif;
    letter-spacing:0;
    overflow-wrap:normal;
    word-break:normal;
  }
  .mobile-nav a:last-child{border-bottom:0}
  body.menu-open{
    overflow:hidden !important;
    touch-action:none;
  }
}

@media (max-width:420px){
  .site-header{height:82px;min-height:82px;padding:7px 14px 7px 16px}
  .site-header .brand{height:68px;min-width:70px}
  .site-header .brand img{width:68px;max-width:68px;height:68px}
  .menu-toggle{width:52px;height:52px;flex-basis:52px}
  .main-nav{top:82px;padding:14px 18px calc(28px + env(safe-area-inset-bottom))}
  .mobile-nav a{font-size:.96rem;min-height:44px;padding:9px 2px}
}

/* =========================================================
   V30 — definitive responsive header/navigation
   Asset filename changed to defeat stale browser cache.
   ========================================================= */
.site-header{
  width:100%;
  max-width:none;
}
.desktop-nav{display:none}
.mobile-nav{display:block}

@media (max-width:979px){
  .site-header{
    height:84px;
    min-height:84px;
    padding:7px 14px 7px 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:rgba(10,10,10,.96);
    border-bottom:1px solid rgba(213,166,46,.18);
    z-index:150;
  }
  .site-header .brand{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    width:74px;
    min-width:74px;
    height:70px;
    z-index:152;
  }
  .site-header .brand img{
    display:block;
    width:70px;
    max-width:70px;
    height:70px;
    object-fit:contain;
    object-position:left center;
  }
  .menu-toggle{
    display:grid;
    place-content:center;
    width:52px;
    height:52px;
    flex:0 0 52px;
    border-radius:50%;
    z-index:152;
  }
  .main-nav{
    position:fixed;
    top:84px;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    max-width:none;
    max-height:none;
    padding:14px 18px calc(30px + env(safe-area-inset-bottom));
    margin:0;
    border:0;
    border-radius:0;
    background:#0d0d0d;
    overflow-y:auto;
    overflow-x:hidden;
    z-index:140;
  }
  .desktop-nav{display:none !important}
  .mobile-nav{
    display:block !important;
    width:min(100%,560px);
    margin:0 auto;
  }
  .mobile-nav-label{
    margin:16px 0 5px;
    padding:9px 2px 8px;
    color:var(--gold);
    border-bottom:1px solid rgba(213,166,46,.28);
    font:800 .67rem/1.2 "Manrope",system-ui,sans-serif;
    letter-spacing:.16em;
  }
  .mobile-nav-label:first-child{margin-top:0}
  .mobile-nav a{
    display:flex;
    align-items:center;
    width:100%;
    min-height:43px;
    padding:9px 2px;
    border-bottom:1px solid rgba(255,255,255,.055);
    text-decoration:none;
    text-transform:none;
    letter-spacing:0;
    font:600 .95rem/1.3 "Manrope",system-ui,sans-serif;
  }
  body.menu-open{overflow:hidden !important}
}

@media (min-width:980px){
  .site-header{
    height:88px;
    min-height:88px;
    padding:10px clamp(24px,3vw,52px);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;
    background:rgba(10,10,10,.88);
    border-bottom:1px solid rgba(213,166,46,.14);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  .site-header .brand{
    display:flex;
    align-items:center;
    flex:0 0 auto;
    width:72px;
    height:68px;
  }
  .site-header .brand img{
    width:68px;
    max-width:68px;
    height:68px;
    object-fit:contain;
  }
  .menu-toggle{display:none !important}
  .main-nav{
    position:static !important;
    inset:auto !important;
    width:auto !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
    display:block !important;
  }
  .mobile-nav{display:none !important}
  .desktop-nav{
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    gap:clamp(18px,1.8vw,32px);
    white-space:nowrap;
  }
  .desktop-nav a{
    display:block;
    padding:9px 0;
    text-decoration:none;
    text-transform:uppercase;
    font:700 clamp(.68rem,.72vw,.78rem)/1.2 "Manrope",system-ui,sans-serif;
    letter-spacing:.10em;
    color:var(--ivory);
    transition:color .2s ease;
  }
  .desktop-nav a:hover{color:var(--gold)}
}

/* =========================================================
   V31 — bulletproof mobile navigation drawer
   ========================================================= */
@media (max-width:979px){
  .site-header{
    height:84px !important;
    min-height:84px !important;
    z-index:10000 !important;
  }
  .site-header .brand,
  .menu-toggle{z-index:10002 !important}

  .main-nav{
    position:fixed !important;
    top:84px !important;
    left:0 !important;
    right:auto !important;
    bottom:auto !important;
    width:100vw !important;
    max-width:100vw !important;
    height:calc(100dvh - 84px) !important;
    min-height:calc(100dvh - 84px) !important;
    max-height:calc(100dvh - 84px) !important;
    margin:0 !important;
    padding:12px 18px calc(28px + env(safe-area-inset-bottom)) !important;
    border:0 !important;
    border-radius:0 !important;
    background:#0d0d0d !important;
    box-shadow:none !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
    z-index:10001 !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
  }
  .main-nav:not(.open){display:none !important}
  .main-nav.open{display:block !important;pointer-events:auto !important}

  .desktop-nav{display:none !important}
  .mobile-nav{
    display:block !important;
    width:100% !important;
    max-width:560px !important;
    margin:0 auto !important;
    padding:0 0 24px !important;
  }
  .mobile-nav-label{
    display:block !important;
    margin:16px 0 4px !important;
    padding:10px 2px 8px !important;
    color:var(--gold) !important;
    border-bottom:1px solid rgba(213,166,46,.28) !important;
    font:800 .68rem/1.2 "Manrope",system-ui,sans-serif !important;
    letter-spacing:.16em !important;
  }
  .mobile-nav-label:first-child{margin-top:0 !important}
  .mobile-nav a{
    display:flex !important;
    align-items:center !important;
    width:100% !important;
    min-height:46px !important;
    margin:0 !important;
    padding:10px 2px !important;
    border-bottom:1px solid rgba(255,255,255,.06) !important;
    color:var(--ivory) !important;
    text-decoration:none !important;
    text-transform:none !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:break-word !important;
    font:600 1rem/1.3 "Manrope",system-ui,sans-serif !important;
    letter-spacing:0 !important;
  }
  body.menu-open{
    position:fixed !important;
    width:100% !important;
    overflow:hidden !important;
  }
}

@media (max-width:420px){
  .site-header{height:82px !important;min-height:82px !important}
  .main-nav{
    top:82px !important;
    height:calc(100dvh - 82px) !important;
    min-height:calc(100dvh - 82px) !important;
    max-height:calc(100dvh - 82px) !important;
  }
}