/* =========================================================
   FPIVOT – ANIMATIONS
========================================================= */
@keyframes hover-float {
  0%,100% { transform: translateY(0) rotate(0deg); }
  30%     { transform: translateY(-10px) rotate(1.5deg); }
  70%     { transform: translateY(-5px) rotate(-1deg); }
}
@keyframes spin-prop {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes speed-line {
  0%   { transform: translateX(-120%); opacity: 0; }
  8%   { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translateX(130vw); opacity: 0; }
}
@keyframes radar-sweep {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes radar-ping {
  0%   { transform: scale(0.8); opacity: 1; }
  100% { transform: scale(2.8); opacity: 0; }
}
@keyframes scan-line {
  0%   { top: -2px; }
  100% { top: 100%; }
}
@keyframes reveal-up {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes glitch-1 {
  0%,45%,55%,100% { clip-path: inset(0 0 100% 0); transform: translate(0); }
  47%  { clip-path: inset(8% 0 55% 0);  transform: translate(-3px, 2px); }
  49%  { clip-path: inset(38% 0 22% 0); transform: translate(3px,-2px); }
  51%  { clip-path: inset(65% 0 8% 0);  transform: translate(-2px, 1px); }
  53%  { clip-path: inset(18% 0 48% 0); transform: translate(2px,-1px); }
}
@keyframes blink-cursor {
  0%,100% { opacity: 1; }
  50%     { opacity: 0; }
}
@keyframes logo-glow {
  0%,100% { text-shadow: 0 0 6px var(--y); }
  50%     { text-shadow: 0 0 20px var(--y), 0 0 40px rgba(200,255,0,0.3); }
}
@keyframes drone-fly-in {
  from { transform: translateX(-300px) translateY(-120px) rotate(-25deg); opacity: 0; }
  to   { transform: translateX(0) translateY(0) rotate(0deg); opacity: 1; }
}
@keyframes shake-x {
  0%,100% { transform: translateX(0); }
  20%     { transform: translateX(-8px) rotate(-2deg); }
  40%     { transform: translateX(8px) rotate(2deg); }
  60%     { transform: translateX(-5px); }
  80%     { transform: translateX(5px); }
}
@keyframes page-enter {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Page enter ─────────────────────────────────────────── */
body { animation: page-enter .35s ease both; }

/* ── Hero stagger ───────────────────────────────────────── */
.hero-left .label      { animation: reveal-up .6s ease both .05s; }
.hero-left .t-hero     { animation: reveal-up .7s ease both .15s; }
.hero-left .t-body     { animation: reveal-up .6s ease both .28s; }
.hero-left .hero-cta   { animation: reveal-up .6s ease both .38s; }
.hero-left .hero-stats { animation: reveal-up .6s ease both .50s; }

/* ── Scroll reveal ──────────────────────────────────────── */
.reveal       { opacity:0; transform:translateY(24px);  transition:opacity .5s ease,transform .5s ease; }
.reveal-left  { opacity:0; transform:translateX(-24px); transition:opacity .5s ease,transform .5s ease; }
.reveal-right { opacity:0; transform:translateX(24px);  transition:opacity .5s ease,transform .5s ease; }
.reveal.visible,.reveal-left.visible,.reveal-right.visible { opacity:1; transform:translate(0); }

/* ── Logo ───────────────────────────────────────────────── */
.logo-slash { animation: logo-glow 3s ease-in-out infinite; display:inline-block; }

/* ── Speed lines ────────────────────────────────────────── */
.speed-lines { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
.speed-line  {
  position:absolute; height:1px;
  background:linear-gradient(90deg,transparent,rgba(200,255,0,.55),transparent);
  animation:speed-line linear infinite;
}

/* ── Scan overlay ───────────────────────────────────────── */
.scan-overlay { position:absolute; inset:0; pointer-events:none; z-index:2; overflow:hidden; }
.scan-overlay::after {
  content:''; position:absolute; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,rgba(200,255,0,.12),transparent);
  animation:scan-line 7s linear infinite;
}

/* ── Drone float ────────────────────────────────────────── */
.drone-float { animation:hover-float 3.8s ease-in-out infinite; }
.prop-spin   { animation:spin-prop .13s linear infinite; transform-origin:center; }

/* ── Radar ──────────────────────────────────────────────── */
.radar { position:relative; width:110px; height:110px; flex-shrink:0; }
.radar-ring { position:absolute; border-radius:50%; border:1px solid rgba(200,255,0,.18); }
.radar-ring:nth-child(1){ inset:0; }
.radar-ring:nth-child(2){ inset:22%; }
.radar-ring:nth-child(3){ inset:44%; border-color:rgba(200,255,0,.35); }
.radar-arm  { position:absolute; inset:0; border-radius:50%; overflow:hidden; animation:radar-sweep 3s linear infinite; }
.radar-arm::after {
  content:''; position:absolute; top:50%; left:50%;
  width:50%; height:2px;
  background:linear-gradient(90deg,rgba(200,255,0,.8),transparent);
  transform-origin:left center;
}
.radar-blip { position:absolute; width:5px; height:5px; border-radius:50%; background:var(--y); box-shadow:0 0 6px var(--y); }
.radar-blip::after { content:''; position:absolute; inset:0; border-radius:50%; background:var(--y); animation:radar-ping 2.2s ease-out infinite; }
.radar-blip:nth-child(5){ top:22%;left:58%; }
.radar-blip:nth-child(6){ top:62%;left:28%; animation-delay:.8s; }
.radar-blip:nth-child(7){ top:38%;left:72%; animation-delay:1.4s; }

/* ── Glitch text ────────────────────────────────────────── */
.glitch { position:relative; display:inline-block; }
.glitch::before {
  content:attr(data-g); position:absolute; top:0; left:0;
  width:100%; height:100%; color:var(--y);
  animation:glitch-1 5s infinite; pointer-events:none;
}

/* ── 404 drone ──────────────────────────────────────────── */
#drone-404-wrap { animation:drone-fly-in 1.1s cubic-bezier(.22,1,.36,1) both .2s; }
.shake { animation:shake-x .6s ease; }

/* ── Card sweep ─────────────────────────────────────────── */
.pcard { overflow:hidden; }
.pcard::after {
  content:''; position:absolute; top:-60%; left:-60%;
  width:35%; height:220%;
  background:linear-gradient(105deg,transparent,rgba(200,255,0,.05),transparent);
  transform:skewX(-15deg); transition:left .55s ease; pointer-events:none;
}
.pcard:hover::after { left:130%; }

/* ── Button ripple ──────────────────────────────────────── */
.btn-primary { position:relative; overflow:hidden; }
.btn-primary::after {
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at center,rgba(255,255,255,.18),transparent 70%);
  opacity:0; transition:opacity .2s;
}
.btn-primary:hover::after { opacity:1; }

/* ── Terminal cursor ────────────────────────────────────── */
.cursor-blink {
  display:inline-block; width:8px; height:1.1em;
  background:var(--y); vertical-align:middle; margin-left:3px;
  animation:blink-cursor 1s step-end infinite;
}
