:root{--fth-red:#DC2626;--fth-red-glow:rgba(220,38,38,0.6);--nw-accent:#0ea5e9;--dark:#050505;--green:#22c55e;--yellow:#eab308}

*{margin:0;padding:0;box-sizing:border-box}

html,body{height:100%;overflow:hidden}

body{font-family:Impact,'Arial Black',sans-serif;background:var(--dark);color:#fff}

.splash{position:fixed;inset:0;cursor:pointer}

.slideshow{position:absolute;inset:0;z-index:0}

.slide{position:absolute;inset:0;opacity:0;background-size:cover;background-position:center;will-change:transform,opacity}

.slide.active{opacity:1;z-index:1}

.slide.exiting{z-index:0}

.slide.fade-in{animation:fadeIn 1.5s ease-out forwards,kb 12s ease-out 1.5s forwards}

.slide.fade-zoom{animation:fadeZoom 1.5s ease-out forwards,kb 12s ease-out 1.5s forwards}

.slide.slide-left{animation:slideLeft 1.2s ease-out forwards,kb 12s ease-out 1.2s forwards}

.slide.slide-right{animation:slideRight 1.2s ease-out forwards,kb 12s ease-out 1.2s forwards}

.slide.slide-up{animation:slideUp 1.2s ease-out forwards,kb 12s ease-out 1.2s forwards}

.slide.slide-down{animation:slideDown 1.2s ease-out forwards,kb 12s ease-out 1.2s forwards}

.slide.zoom-in{animation:zoomIn 1.4s ease-out forwards,kb 12s ease-out 1.4s forwards}

.slide.zoom-out{animation:zoomOut 1.4s ease-out forwards,kb 12s ease-out 1.4s forwards}

.slide.rotate-in{animation:rotateIn 1.5s ease-out forwards,kb 12s ease-out 1.5s forwards}

.slide.flip-x{animation:flipX 1.3s ease-out forwards,kb 12s ease-out 1.3s forwards}

.slide.flip-y{animation:flipY 1.3s ease-out forwards,kb 12s ease-out 1.3s forwards}

.slide.blur-in{animation:blurIn 1.5s ease-out forwards,kb 12s ease-out 1.5s forwards}

.slide.swing-in{animation:swingIn 1.4s ease-out forwards,kb 12s ease-out 1.4s forwards}

.slide.bounce-in{animation:bounceIn 1.2s cubic-bezier(0.68,-0.55,0.265,1.55) forwards,kb 12s ease-out 1.2s forwards}

.slide.spiral{animation:spiral 1.5s ease-out forwards,kb 12s ease-out 1.5s forwards}

@keyframes kb{from{transform:scale(1) translate(0,0)}to{transform:scale(1.08) translate(-1%,-0.5%)}}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}

@keyframes fadeZoom{from{opacity:0;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}

@keyframes slideLeft{from{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}

@keyframes slideRight{from{opacity:0;transform:translateX(-100%)}to{opacity:1;transform:translateX(0)}}

@keyframes slideUp{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}

@keyframes slideDown{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}

@keyframes zoomIn{from{opacity:0;transform:scale(0.3)}to{opacity:1;transform:scale(1)}}

@keyframes zoomOut{from{opacity:0;transform:scale(2)}to{opacity:1;transform:scale(1)}}

@keyframes rotateIn{from{opacity:0;transform:rotate(-200deg) scale(0)}to{opacity:1;transform:rotate(0) scale(1)}}

@keyframes flipX{from{opacity:0;transform:perspective(1000px) rotateX(90deg)}to{opacity:1;transform:perspective(1000px) rotateX(0)}}

@keyframes flipY{from{opacity:0;transform:perspective(1000px) rotateY(90deg)}to{opacity:1;transform:perspective(1000px) rotateY(0)}}

@keyframes blurIn{from{opacity:0;filter:blur(30px)}to{opacity:1;filter:blur(0)}}

@keyframes swingIn{from{opacity:0;transform:rotateX(-90deg);transform-origin:top center}to{opacity:1;transform:rotateX(0);transform-origin:top center}}

@keyframes bounceIn{0%{opacity:0;transform:scale(0.3)}50%{transform:scale(1.05)}70%{transform:scale(0.95)}100%{opacity:1;transform:scale(1)}}

@keyframes spiral{from{opacity:0;transform:rotate(720deg) scale(0)}to{opacity:1;transform:rotate(0) scale(1)}}

.content{position:absolute;inset:0;z-index:2;pointer-events:none}

.fth-top{position:absolute;top:20px;left:50%;transform:translateX(-50%);font-size:clamp(32px,9vw,80px);letter-spacing:6px;color:#fff;text-shadow:4px 4px 0 var(--fth-red),6px 6px 0 #000;text-transform:uppercase;white-space:nowrap}

.category{position:absolute;top:50%;left:50%;transform:translate(-50%,-90px);background:rgba(0,0,0,0.7);padding:6px 16px;border-radius:4px;font-size:14px;letter-spacing:3px;text-transform:uppercase;font-family:Arial,sans-serif}

.vehicle-name{position:absolute;top:50%;left:50%;transform:translate(-50%,-20px);font-size:clamp(32px,7vw,80px);text-align:center;max-width:90%;color:#fff;text-shadow:4px 4px 0 #000,0 0 40px rgba(0,0,0,0.9);text-transform:uppercase;letter-spacing:3px}

.price{position:absolute;top:50%;left:50%;transform:translate(-50%,60px);font-size:clamp(28px,5vw,50px);color:var(--fth-red);text-shadow:2px 2px 0 #000}

.stock{position:absolute;top:50%;left:50%;transform:translate(-50%,115px);padding:6px 14px;border-radius:4px;font-size:14px;font-family:Arial,sans-serif;font-weight:bold;letter-spacing:1px}

.stock.in{background:var(--green);color:#000}

.stock.low{background:var(--yellow);color:#000}

.cta{position:absolute;bottom:100px;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:12px;background:var(--fth-red);padding:18px 50px;border-radius:8px;font-size:clamp(20px,5vw,32px);letter-spacing:3px;text-decoration:none;color:#fff;text-transform:uppercase;box-shadow:0 10px 40px var(--fth-red-glow);transition:all 0.3s;pointer-events:auto}

.cta:hover{transform:translateX(-50%) translateY(-4px) scale(1.05);box-shadow:0 20px 60px var(--fth-red-glow)}

.cta svg{width:28px;height:28px;stroke:currentColor;stroke-width:2.5;fill:none}

.progress{position:absolute;bottom:0;left:0;height:4px;background:var(--fth-red);width:0;z-index:10}

.progress.running{animation:progressBar 6s linear forwards}

@keyframes progressBar{from{width:0}to{width:100%}}

.counter{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);font-family:Arial,sans-serif;font-size:14px;color:rgba(255,255,255,0.5);z-index:2}

.particles{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}

.particle{position:absolute;width:3px;height:3px;background:rgba(139,90,43,0.5);border-radius:50%;animation:drift 12s linear infinite}

@keyframes drift{0%{transform:translateX(-50px) translateY(100vh) rotate(0);opacity:0}10%{opacity:0.7}90%{opacity:0.7}100%{transform:translateX(100vw) translateY(-50px) rotate(720deg);opacity:0}}

.footer{position:absolute;bottom:20px;right:20px;z-index:2}

.nw-link{display:flex;align-items:center;gap:6px;font-family:Arial,sans-serif;font-size:11px;color:rgba(255,255,255,0.4);text-decoration:none;pointer-events:auto}

.nw-link:hover{color:var(--nw-accent)}

.nw-badge{width:16px;height:16px;background:var(--nw-accent);border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700}