/* Inspector Mobil - Custom Theme */
:root {
  --primary: #0f766e;
  --secondary: #0a0f1a;
  --accent: #f59e0b;
  --bg: #f4f6f8;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-stretch:normal}
.font-display{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-weight:700}

/* Hero */
.hero-wrap{min-height:100vh;position:relative;background:var(--secondary);overflow:hidden}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center 40%;transform:scale(1.05);animation:heroZoom 20s ease-in-out infinite alternate}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(10,15,26,.94) 0%,rgba(10,15,26,.75) 45%,rgba(10,15,26,.35) 100%)}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(to bottom,black 40%,transparent)}
.scan-beam{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.7;animation:scanDown 4s ease-in-out infinite;pointer-events:none;z-index:5}
@keyframes scanDown{0%,100%{top:15%;opacity:0}50%{top:75%;opacity:.8}}

.hero-title{display:flex;flex-direction:column;gap:.35rem;font-weight:800;letter-spacing:-.03em;text-wrap:balance}
.hero-title-line{font-size:clamp(2rem,4.8vw,3.25rem);line-height:1.12;color:#fff}
.hero-title-accent{font-size:clamp(2rem,4.8vw,3.25rem);line-height:1.12;background:linear-gradient(135deg,var(--accent) 0%,#fde68a 55%,#fbbf24 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-subtitle{font-size:1.0625rem;line-height:1.75;color:#cbd5e1;max-width:32rem;font-weight:400}
.hero-subtitle p{margin:0}
.hero-subtitle strong,.hero-subtitle b{color:#f1f5f9;font-weight:600}
@media(min-width:1024px){.hero-subtitle{font-size:1.125rem;max-width:34rem}}
@keyframes heroZoom{from{transform:scale(1.05)}to{transform:scale(1.12)}}

/* Road animation */
.road-band{position:absolute;bottom:0;left:0;right:0;height:160px;background:linear-gradient(180deg,#1e2433 0%,#0a0d14 100%);border-top:3px solid #334155;z-index:20;overflow:hidden}
.road-markings{position:absolute;top:54%;left:0;right:0;height:6px;overflow:hidden;transform:translateY(-50%)}
.road-markings::before{content:'';display:block;width:200%;height:100%;background:repeating-linear-gradient(90deg,#fbbf24 0 48px,transparent 48px 96px);animation:roadMove .9s linear infinite;will-change:transform}
@keyframes roadMove{from{transform:translateX(0)}to{transform:translateX(-96px)}}
.car-track{position:absolute;left:0;right:0;height:80px;overflow:hidden;pointer-events:none}
.car-track-1{bottom:50px}
.car-track-2{bottom:2px;opacity:.95}
.car-mover{display:inline-block;will-change:transform;filter:drop-shadow(0 14px 22px rgba(0,0,0,.5))}
.car-mover-sedan{animation:carDrive 13s linear infinite}
.car-mover-suv{animation:carDriveSuv 10s linear infinite;animation-delay:-5s}
@keyframes carDrive{0%{transform:translateX(-280px)}100%{transform:translateX(calc(100vw + 280px))}}
@keyframes carDriveSuv{0%{transform:translateX(-280px) scale(.9)}100%{transform:translateX(calc(100vw + 280px)) scale(.9)}}
@keyframes wheelSpin{to{transform:rotate(360deg)}}

/* Car images */
.car-img{width:200px;height:auto;display:block;image-rendering:auto;filter:drop-shadow(0 8px 16px rgba(0,0,0,.45))}
.car-img-sm{width:170px}
.car-mover-sedan .car-img{animation:carBob .4s ease-in-out infinite alternate}
.car-mover-suv .car-img{animation:carBob .45s ease-in-out infinite alternate}
@keyframes carBob{from{transform:translateY(0)}to{transform:translateY(-2px)}}

/* Glass nav */
.nav-glass{background:rgba(10,15,26,.72);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08)}

/* Cards */
.inspect-card{background:#fff;border:1px solid #e2e8f0;border-radius:1.25rem;transition:all .35s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}
.inspect-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary),var(--accent));transform:scaleX(0);transform-origin:left;transition:transform .35s}
.inspect-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px -12px rgba(0,0,0,.15)}
.inspect-card:hover::before{transform:scaleX(1)}

/* Process timeline */
.timeline-line{position:absolute;left:50%;top:0;bottom:0;width:2px;background:linear-gradient(var(--accent),var(--primary));transform:translateX(-50%);opacity:.3}
.step-dot{width:48px;height:48px;border-radius:50%;background:var(--secondary);border:3px solid var(--accent);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--accent);font-family:'Plus Jakarta Sans',system-ui,sans-serif}

/* Reveal */
.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* Marquee */
.marquee-track{display:flex;gap:3rem;animation:marquee 30s linear infinite;width:max-content}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* HUD badge */

.hero-promo-wrap{width:100%;min-width:0;display:flex;justify-content:center;align-items:center}
.hero-promo-slider{position:relative;width:100%;max-width:520px;aspect-ratio:16/10;border-radius:1.25rem;overflow:hidden;border:1px solid rgba(255,255,255,.16);box-shadow:0 24px 55px -16px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.04) inset;background:#0b1220;animation:promoFloat 6s ease-in-out infinite}
.hero-promo-track{display:flex;height:100%;transition:transform .7s cubic-bezier(.4,0,.2,1);will-change:transform}
.hero-promo-slide{min-width:100%;flex-shrink:0;height:100%;position:relative;overflow:hidden;background:#0b1220}
.hero-promo-slide a,.hero-promo-slide-inner{display:block;width:100%;height:100%;position:relative;z-index:1}
.hero-promo-bg{position:absolute;inset:-12%;width:124%;height:124%;object-fit:cover;filter:blur(22px) brightness(.55) saturate(1.1);transform:scale(1.08);pointer-events:none;z-index:0}
.hero-promo-img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.hero-promo-fade{position:absolute;inset:auto 0 0 0;height:28%;background:linear-gradient(transparent,rgba(0,0,0,.35));pointer-events:none;z-index:2}
.hero-promo-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:2.2rem;height:2.2rem;border-radius:9999px;border:1px solid rgba(255,255,255,.22);background:rgba(0,0,0,.45);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(8px);transition:background .2s,opacity .2s;opacity:.8}
.hero-promo-nav:hover{background:rgba(0,0,0,.7);opacity:1}
.hero-promo-prev{left:.65rem}
.hero-promo-next{right:.65rem}
.hero-promo-dots{position:absolute;bottom:.8rem;left:0;right:0;display:flex;justify-content:center;gap:.4rem;z-index:2}
.hero-promo-dot{width:.42rem;height:.42rem;border-radius:9999px;border:none;background:rgba(255,255,255,.45);cursor:pointer;padding:0;transition:all .25s}
.hero-promo-dot.active{width:1.2rem;background:var(--accent)}
@keyframes promoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(min-width:1024px){.hero-promo-wrap{justify-content:flex-end}.hero-promo-slider{max-width:540px}}
@media(max-width:1023px){.hero-promo-wrap{margin-top:1rem}.hero-promo-slider{max-width:100%;animation:none}}
@media(prefers-reduced-motion:reduce){.hero-promo-track{transition:none}.hero-promo-slider{animation:none}}
.hud-pill{background:rgba(0,0,0,.5);border:1px solid rgba(245,158,11,.4);backdrop-filter:blur(8px)}

/* Gallery */
.gallery-item{position:relative;overflow:hidden;border-radius:1rem}
.gallery-item img{transition:transform .5s ease}
.gallery-item:hover img{transform:scale(1.08)}
.gallery-item::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(0,0,0,.6));opacity:0;transition:opacity .3s}
.gallery-item:hover::after{opacity:1}

.wa-float{position:fixed;bottom:1.5rem;right:1.5rem;z-index:50;width:3.75rem;height:3.75rem;border-radius:9999px;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 28px rgba(37,211,102,.5);transition:transform .2s}
.wa-float:hover{transform:scale(1.1)}
.gallery-item{position:relative}
.gallery-item.group span{position:absolute}

.gallery-cell-hidden{display:none!important}
#galleryLoadMore{min-width:220px}