/* NixFleet design v3 (preview) — app tab bar, living gradient headlines, count-up numbers, press-zoom on photos. */

/* 1. App tab bar (only inside the app / home-screen install / ?app=1) */
.nx-tabs{position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:60;display:flex;justify-content:space-around;align-items:center;gap:4px;
  padding:7px 8px;border-radius:24px;background:linear-gradient(180deg,rgba(38,45,107,.82),rgba(24,29,72,.86));
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 18px 40px -16px rgba(5,8,30,.8);max-width:520px;margin:0 auto}
.nx-tabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:50px;justify-content:center;border-radius:18px;color:rgba(255,255,255,.72);
  text-decoration:none;font:700 11px/1.1 var(--nx-body,system-ui);letter-spacing:.01em;transition:background-color .25s,color .25s,transform .12s}
.nx-tabs a i{font-style:normal;line-height:0;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.nx-tabs svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.nx-tabs{transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s}.nx-tabs.hide{transform:translateY(130%);opacity:0}
.nx-tabs a.on{color:#1b2150;background:linear-gradient(180deg,#ffcb4a,#fbb51a 60%,#f4a30c);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 8px 18px -8px rgba(240,138,46,.8)}
.nx-tabs a.on i{transform:translateY(-1px) scale(1.1)}.nx-tabs a.on svg{stroke-width:2.2}
.nx-tabs a:active{transform:scale(.94)}
html.nx-has-tabs body{padding-bottom:calc(86px + env(safe-area-inset-bottom))!important}

@media (prefers-reduced-motion:no-preference){
  /* 2. Living sunset gradient on brand headlines */
  .hero h1 em{background:linear-gradient(90deg,#ff3d8b,#f2663f,#fbb51a,#f2663f,#ff3d8b)!important;background-size:300% 100%!important;
    -webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;animation:nxHue 7s linear infinite}
  @keyframes nxHue{to{background-position:300% 0}}

  /* 3. Vehicle photos: soft zoom while pressing, like a native gallery */
  .grid>* img{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
  .grid>*:active img{transform:scale(1.04)}

  /* 4. Number pop when a price/total appears (class added by nix-v3.js) */
  .nx-pop{animation:nxPop .5s cubic-bezier(.3,1.5,.5,1)}
  @keyframes nxPop{0%{transform:scale(.85);opacity:.3}100%{transform:none;opacity:1}}
}

/* first-launch welcome slides */
.nx-onb{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(30px + env(safe-area-inset-top)) 28px calc(34px + env(safe-area-inset-bottom));color:#fff;text-align:center;
  background:radial-gradient(700px 420px at 50% 8%,rgba(240,138,46,.35),transparent 70%),radial-gradient(600px 400px at 100% 100%,rgba(230,23,122,.28),transparent 70%),#1b2150;transition:opacity .35s,transform .35s}
.nx-onb.out{opacity:0;transform:scale(1.03)}
.nx-onb .sk{position:absolute;top:calc(14px + env(safe-area-inset-top));right:16px;background:none;border:0;color:rgba(255,255,255,.7);font:700 15px var(--nx-body,system-ui);min-height:44px;padding:0 10px;cursor:pointer}
.nx-onb .sl{max-width:360px;animation:nxSl .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes nxSl{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}
.nx-onb .ic{width:132px;height:132px;margin:0 auto 26px;border-radius:40px;display:flex;align-items:center;justify-content:center;font-size:64px;
  background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 24px 50px -20px rgba(0,0,0,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.nx-onb h2{font-family:var(--nx-head,inherit);font-size:26px;line-height:1.2;margin:0 0 12px;letter-spacing:-.015em}
.nx-onb p{font-size:16px;line-height:1.5;color:rgba(255,255,255,.8);margin:0}
.nx-onb .dots{display:flex;gap:8px;margin:34px 0 22px}.nx-onb .dots i{width:8px;height:8px;border-radius:9px;background:rgba(255,255,255,.3);transition:width .3s,background .3s}.nx-onb .dots i.on{width:26px;background:#fbb51a}
.nx-onb .go{width:100%;max-width:360px;min-height:56px;border:0;border-radius:18px;font:800 17px var(--nx-body,system-ui);color:#1b2150;cursor:pointer;
  background:linear-gradient(180deg,#ffcb4a,#fbb51a 60%,#f4a30c);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 14px 30px -12px rgba(240,138,46,.85)}
