:root {
  --black: #0a0a0a; --dark: #111318; --card: #161b24; --border: #1e2530;
  --orange: #f97316; --orange-light: #fb923c; --orange-glow: rgba(249,115,22,0.15);
  --white: #f8f9fa; --muted: #8892a4; --text: #cdd5e0;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Outfit',sans-serif; background:var(--black); color:var(--text); overflow-x:hidden; }
header { position:fixed; top:0; left:0; right:0; z-index:1000; padding:0 5%; display:flex; align-items:center; justify-content:space-between; height:70px; background:rgba(10,10,10,0.88); backdrop-filter:blur(16px); border-bottom:1px solid var(--border); transition:all 0.3s; }
header.scrolled { background:rgba(10,10,10,0.97); box-shadow:0 4px 30px rgba(0,0,0,0.4); }
.logo { font-family:'Bebas Neue',sans-serif; font-size:1.6rem; letter-spacing:2px; color:var(--white); text-decoration:none; }
.logo span { color:var(--orange); }
nav { display:flex; gap:2rem; align-items:center; }
nav a { color:var(--muted); text-decoration:none; font-size:0.875rem; font-weight:500; letter-spacing:0.5px; transition:color 0.2s; position:relative; }
nav a::after { content:''; position:absolute; bottom:-4px; left:0; right:0; height:2px; background:var(--orange); transform:scaleX(0); transition:transform 0.2s; }
nav a:hover, nav a.active { color:var(--orange); }
nav a:hover::after, nav a.active::after { transform:scaleX(1); }
.nav-cta { background:var(--orange); color:#fff!important; padding:0.5rem 1.2rem; border-radius:6px; font-weight:600!important; transition:all 0.2s!important; }
.nav-cta:hover { background:var(--orange-light)!important; transform:translateY(-2px); box-shadow:0 6px 20px rgba(249,115,22,0.35); }
.nav-cta::after { display:none!important; }
.hamburger { display:none; cursor:pointer; flex-direction:column; gap:5px; }
.hamburger span { display:block; width:24px; height:2px; background:var(--white); border-radius:2px; transition:0.3s; }
.mobile-nav { display:none; position:fixed; top:70px; left:0; right:0; background:rgba(10,10,10,0.97); backdrop-filter:blur(16px); border-bottom:1px solid var(--border); padding:1.5rem 5%; flex-direction:column; gap:1rem; z-index:999; }
.mobile-nav.open { display:flex; }
.mobile-nav a { color:var(--muted); text-decoration:none; font-size:1rem; font-weight:500; padding:0.5rem 0; border-bottom:1px solid var(--border); transition:color 0.2s; }
.mobile-nav a:hover { color:var(--orange); }
@keyframes fadeUp { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes floatY { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.4;transform:scale(1.5)} }
@keyframes ticker { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes shimmer { from{background-position:0} to{background-position:200%} }
@keyframes carDriveIn { from{transform:translateX(80px);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes beamPulse { 0%,100%{opacity:0.06} 50%{opacity:0.14} }
@keyframes roadDash { from{stroke-dashoffset:0} to{stroke-dashoffset:-80} }
@keyframes wheelRot { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes shieldAnim { 0%,100%{filter:drop-shadow(0 0 6px rgba(249,115,22,0.2))} 50%{filter:drop-shadow(0 0 20px rgba(249,115,22,0.55))} }
@keyframes iconFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
@keyframes mapPingAnim { 0%,100%{r:5;opacity:1} 60%{r:18;opacity:0} }
@keyframes speedLineFade { 0%{transform:translateX(0);opacity:0.35} 100%{transform:translateX(-30px);opacity:0} }
.reveal { opacity:0; transform:translateY(30px); transition:opacity 0.7s ease, transform 0.7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.btn-primary { background:var(--orange); color:#fff; padding:0.9rem 2rem; border-radius:8px; font-size:1rem; font-weight:600; text-decoration:none; border:none; cursor:pointer; transition:all 0.25s; display:inline-flex; align-items:center; gap:8px; }
.btn-primary:hover { background:var(--orange-light); transform:translateY(-3px); box-shadow:0 12px 30px rgba(249,115,22,0.35); }
.btn-outline { background:transparent; color:var(--white); padding:0.9rem 2rem; border-radius:8px; font-size:1rem; font-weight:600; text-decoration:none; border:1px solid var(--border); cursor:pointer; transition:all 0.25s; display:inline-flex; align-items:center; gap:8px; }
.btn-outline:hover { border-color:var(--orange); color:var(--orange); transform:translateY(-3px); }
.ticker { background:var(--orange); padding:0.7rem 0; overflow:hidden; white-space:nowrap; }
.ticker-track { display:inline-flex; animation:ticker 28s linear infinite; }
.ticker-item { font-size:0.78rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#fff; padding:0 2.5rem; }
.ticker-dot { color:rgba(255,255,255,0.4); padding:0 0.5rem; }
section { padding:100px 5%; }
.section-tag { display:inline-block; font-size:0.75rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--orange); margin-bottom:1rem; }
.section-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(2.5rem,5vw,4rem); color:var(--white); letter-spacing:1px; line-height:1; margin-bottom:1rem; }
.section-subtitle { font-size:1rem; color:var(--muted); line-height:1.7; max-width:540px; }
footer { background:var(--dark); border-top:1px solid var(--border); padding:60px 5% 30px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; margin-bottom:3rem; }
.footer-brand .logo { font-size:1.8rem; display:block; margin-bottom:1rem; }
.footer-brand p { color:var(--muted); font-size:0.875rem; line-height:1.7; max-width:280px; }
.footer-col h5 { font-weight:700; color:var(--white); font-size:0.85rem; letter-spacing:1px; text-transform:uppercase; margin-bottom:1.2rem; }
.footer-links { list-style:none; display:flex; flex-direction:column; gap:0.7rem; }
.footer-links a { color:var(--muted); text-decoration:none; font-size:0.875rem; transition:color 0.2s; }
.footer-links a:hover { color:var(--orange); }
.footer-bottom { border-top:1px solid var(--border); padding-top:2rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.footer-bottom p { color:var(--muted); font-size:0.8rem; }
.footer-legal { display:flex; gap:1.5rem; }
.footer-legal a { color:var(--muted); text-decoration:none; font-size:0.8rem; transition:color 0.2s; }
.footer-legal a:hover { color:var(--orange); }
/* POPUP */
.popup-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.8); z-index:9999; display:flex; align-items:center; justify-content:center; padding:1.5rem; opacity:0; visibility:hidden; transition:all 0.4s; backdrop-filter:blur(8px); }
.popup-overlay.active { opacity:1; visibility:visible; }
.popup { background:var(--dark); border:1px solid rgba(249,115,22,0.35); border-radius:24px; padding:3rem 2.5rem; max-width:480px; width:100%; text-align:center; position:relative; transform:scale(0.85) translateY(30px); transition:all 0.45s cubic-bezier(0.34,1.56,0.64,1); overflow:hidden; }
.popup-overlay.active .popup { transform:scale(1) translateY(0); }
.popup::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--orange),#ff6b00,var(--orange)); background-size:200%; animation:shimmer 2s linear infinite; }
.popup-glow { position:absolute; top:-50%; left:50%; transform:translateX(-50%); width:300px; height:300px; background:radial-gradient(circle,rgba(249,115,22,0.12),transparent 70%); pointer-events:none; }
.popup-close { position:absolute; top:1rem; right:1rem; width:32px; height:32px; background:var(--card); border:1px solid var(--border); border-radius:50%; color:var(--muted); font-size:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.2s; line-height:1; }
.popup-close:hover { border-color:var(--orange); color:var(--orange); }
.popup-emoji { font-size:3.5rem; display:block; margin-bottom:1rem; animation:floatY 3s ease-in-out infinite; }
.popup-tag { display:inline-block; background:var(--orange-glow); border:1px solid rgba(249,115,22,0.3); color:var(--orange); font-size:0.7rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:0.3rem 1rem; border-radius:100px; margin-bottom:1rem; }
.popup h2 { font-family:'Bebas Neue',sans-serif; font-size:2.5rem; color:var(--white); letter-spacing:1px; margin-bottom:0.7rem; position:relative; }
.popup p { color:var(--muted); font-size:0.95rem; line-height:1.6; margin-bottom:2rem; position:relative; }
.popup-perks { display:flex; justify-content:center; gap:1.5rem; flex-wrap:wrap; margin-bottom:2rem; position:relative; }
.popup-perk { display:flex; align-items:center; gap:6px; font-size:0.8rem; font-weight:600; color:var(--text); }
.popup-perk span { color:var(--orange); }
.popup-btn { display:inline-flex; align-items:center; gap:8px; background:var(--orange); color:#fff; padding:1rem; border-radius:12px; font-size:1.05rem; font-weight:700; text-decoration:none; border:none; cursor:pointer; transition:all 0.2s; position:relative; width:100%; justify-content:center; margin-bottom:0.75rem; box-shadow:0 8px 30px rgba(249,115,22,0.35); }
.popup-btn:hover { background:var(--orange-light); transform:translateY(-2px); box-shadow:0 12px 40px rgba(249,115,22,0.45); }
.popup-skip { font-size:0.8rem; color:var(--muted); cursor:pointer; background:none; border:none; transition:color 0.2s; position:relative; }
.popup-skip:hover { color:var(--white); }
.scroll-top { position:fixed; bottom:2rem; right:2rem; width:44px; height:44px; background:var(--orange); color:#fff; border:none; border-radius:10px; font-size:1.2rem; cursor:pointer; display:flex; align-items:center; justify-content:center; opacity:0; transform:translateY(20px); transition:all 0.3s; z-index:500; box-shadow:0 4px 20px rgba(249,115,22,0.4); }
.scroll-top.show { opacity:1; transform:translateY(0); }
.scroll-top:hover { background:var(--orange-light); transform:translateY(-3px); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1rem; }
.form-group { display:flex; flex-direction:column; gap:0.4rem; margin-bottom:1rem; }
.form-group label { font-size:0.8rem; font-weight:600; color:var(--muted); letter-spacing:0.5px; text-transform:uppercase; }
.form-group input,.form-group select,.form-group textarea { background:var(--dark); border:1px solid var(--border); border-radius:10px; padding:0.8rem 1rem; color:var(--white); font-family:'Outfit',sans-serif; font-size:0.9rem; transition:border-color 0.2s; outline:none; width:100%; }
.form-group input:focus,.form-group select:focus,.form-group textarea:focus { border-color:var(--orange); }
.form-group select option { background:var(--dark); }
.form-group textarea { resize:vertical; min-height:100px; }
.alert { padding:1rem 1.5rem; border-radius:10px; font-size:0.9rem; margin-bottom:1.5rem; }
.alert-success { background:rgba(34,197,94,0.1); border:1px solid rgba(34,197,94,0.3); color:#4ade80; }
.alert-error { background:rgba(239,68,68,0.1); border:1px solid rgba(239,68,68,0.3); color:#f87171; }
.cta-strip { background:linear-gradient(135deg,rgba(249,115,22,0.13),rgba(249,115,22,0.03)); border-top:1px solid rgba(249,115,22,0.2); border-bottom:1px solid rgba(249,115,22,0.2); padding:80px 5%; text-align:center; position:relative; overflow:hidden; }
.cta-strip::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(249,115,22,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(249,115,22,0.03) 1px,transparent 1px); background-size:40px 40px; }
.cta-strip>* { position:relative; z-index:1; }
.cta-strip h2 { font-family:'Bebas Neue',sans-serif; font-size:clamp(2rem,5vw,4rem); color:var(--white); letter-spacing:1px; margin-bottom:1rem; }
.cta-strip p { color:var(--muted); font-size:1.05rem; max-width:500px; margin:0 auto 2rem; line-height:1.6; }
.brands-section { background:var(--dark); border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:60px 5%; text-align:center; }
.brands-label { font-size:0.75rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--muted); margin-bottom:2rem; }
.brands-row { display:flex; gap:1.5rem; justify-content:center; flex-wrap:wrap; align-items:center; }
.brand-chip { background:var(--card); border:1px solid var(--border); border-radius:10px; padding:0.7rem 1.4rem; font-size:0.85rem; font-weight:600; color:var(--muted); transition:all 0.25s; }
.brand-chip:hover { color:var(--white); border-color:rgba(249,115,22,0.4); transform:translateY(-3px); background:rgba(249,115,22,0.07); }
@media(max-width:1100px) { .footer-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:768px) { nav { display:none; } .hamburger { display:flex; } .footer-grid { grid-template-columns:1fr; } .form-row { grid-template-columns:1fr; } }