/* ==========================================================================
   TAXI BUSINESS HELP — ANIMATION LAYER
   Loader, Cursor, Reveals, Particles, Blobs, 3D Tilt, Transitions
   ========================================================================== */

/* ---------- Preloader ---------- */
#preloader{
  position:fixed;inset:0;z-index:9999;background:var(--surface-0);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;
  transition:opacity .8s var(--ease-premium),visibility .8s var(--ease-premium);
}
#preloader.done{opacity:0;visibility:hidden;pointer-events:none;}
.pre-mark{
  width:64px;height:64px;border-radius:18px;background:var(--grad-accent);
  display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:1.4rem;color:#04140c;
  box-shadow:var(--shadow-glow);animation:preSpin 1.4s var(--ease-premium) infinite;
}
@keyframes preSpin{0%{transform:rotate(0) scale(1);}50%{transform:rotate(180deg) scale(1.08);}100%{transform:rotate(360deg) scale(1);}}
.pre-bar{width:220px;height:3px;border-radius:10px;background:rgba(255,255,255,.08);overflow:hidden;}
.pre-bar span{display:block;height:100%;width:0%;background:var(--grad-accent);transition:width .3s ease;}
.pre-text{font-family:var(--font-display);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--c-muted);}

/* ---------- Custom Cursor ---------- */
.cursor-dot,.cursor-ring{
  position:fixed;top:0;left:0;pointer-events:none;z-index:9998;
  transform:translate(-50%,-50%);border-radius:50%;
  will-change:transform;
}
.cursor-dot{width:8px;height:8px;background:var(--c-accent);}
.cursor-ring{width:38px;height:38px;border:1.5px solid rgba(6,182,212,.5);transition:width .3s ease,height .3s ease,border-color .3s ease,background .3s ease;}
.cursor-ring.hover{width:64px;height:64px;background:rgba(6,182,212,.08);border-color:var(--c-accent);}
@media (hover:none), (pointer:coarse){.cursor-dot,.cursor-ring{display:none;}}

/* ---------- Scroll Reveal ---------- */
[data-reveal]{opacity:0;transition:opacity .9s var(--ease-premium),transform .9s var(--ease-premium),filter .9s var(--ease-premium);}
[data-reveal="up"]{transform:translateY(56px);}
[data-reveal="down"]{transform:translateY(-56px);}
[data-reveal="left"]{transform:translateX(-56px);}
[data-reveal="right"]{transform:translateX(56px);}
[data-reveal="scale"]{transform:scale(.86);}
[data-reveal="rotate"]{transform:perspective(1000px) rotateX(18deg) translateY(40px);}
[data-reveal].in-view{opacity:1;transform:none;filter:none;}

.reveal-stagger > *{transition-delay:calc(var(--i,0) * 90ms);}

/* Split text */
.split-line{overflow:hidden;display:inline-block;vertical-align:top;}
.split-line > span{display:inline-block;transform:translateY(110%);transition:transform .9s var(--ease-premium);}
.split-line.in-view > span{transform:translateY(0);}

/* ---------- Blob Animation ---------- */
.blob{
  position:absolute;border-radius:42% 58% 65% 35% / 45% 45% 55% 55%;
  background:var(--grad-accent);filter:blur(10px);opacity:.28;
  animation:blobMove 14s ease-in-out infinite;
}
@keyframes blobMove{
  0%,100%{border-radius:42% 58% 65% 35% / 45% 45% 55% 55%;transform:rotate(0deg) scale(1);}
  33%{border-radius:60% 40% 30% 70% / 55% 60% 40% 45%;transform:rotate(8deg) scale(1.08);}
  66%{border-radius:35% 65% 55% 45% / 40% 35% 65% 60%;transform:rotate(-6deg) scale(.96);}
}

/* ---------- Particle Canvas ---------- */
#particle-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.6;}

/* ---------- 3D Tilt ---------- */
.tilt{transform-style:preserve-3d;transition:transform .2s ease-out;}
.tilt-inner{transform-style:preserve-3d;}

/* ---------- Counter ---------- */
[data-counter]{font-variant-numeric:tabular-nums;}

/* ---------- Fade Sequence Utilities ---------- */
.fade-in{animation:fadeIn 1s var(--ease-premium) both;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.scale-in{animation:scaleIn 1s var(--ease-premium) both;}
@keyframes scaleIn{from{opacity:0;transform:scale(.9);}to{opacity:1;transform:scale(1);}}

/* ---------- Marquee Rotate Badge (awards etc) ---------- */
.rotate-badge{animation:rotate360 12s linear infinite;}
@keyframes rotate360{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}

/* ---------- Hero Grid Pattern ---------- */
.grid-pattern{
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(148,163,184,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 20%,#000 40%,transparent 100%);
  mask-image:radial-gradient(ellipse 80% 60% at 50% 20%,#000 40%,transparent 100%);
}

/* ---------- Page Transition Overlay ---------- */
#page-transition{
  position:fixed;inset:0;z-index:9997;background:var(--surface-0);
  transform:translateY(100%);pointer-events:none;
}
#page-transition.leaving{animation:pageOut .6s var(--ease-premium) forwards;}
@keyframes pageOut{from{transform:translateY(100%);}to{transform:translateY(0);}}

/* ---------- Floating Card Parallax Set ---------- */
.float-card{
  position:absolute;padding:16px 20px;border-radius:18px;
  background:rgba(17,24,39,.75);border:1px solid var(--c-border-strong);
  backdrop-filter:blur(16px);box-shadow:var(--shadow-lg);
  display:flex;align-items:center;gap:12px;
  animation:floatY 5s ease-in-out infinite;
}
.float-card .fc-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--grad-accent);color:#04140c;flex-shrink:0;}
.float-card .fc-icon svg{width:20px;height:20px;}
.float-card strong{display:block;font-size:.95rem;color:var(--c-white);font-family:var(--font-display);}
.float-card small{color:var(--c-muted);font-size:.76rem;}

/* ---------- Magnetic hover glow on buttons ---------- */
.btn::after{
  content:'';position:absolute;inset:0;border-radius:inherit;opacity:0;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.35),transparent 60%);
  transition:opacity .3s ease;pointer-events:none;
}
.btn:hover::after{opacity:1;}

/* ---------- Reduced Motion ---------- */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
  [data-reveal]{opacity:1;transform:none;}
}
