/* ════════════════════════════════════════════
   FOUNDERPILOT — MOTION / 3D ANIMATION LAYER
   Injected separately — zero changes to existing files
   ════════════════════════════════════════════ */

/* GPU layer promotion for canvas & animated elements */
#bg-canvas { will-change: contents; contain: strict; }
.lp-hero-orb-1, .lp-hero-orb-2 { will-change: transform; contain: layout style; }
.lp-feat-card, .lp-mockup { will-change: transform; backface-visibility: hidden; }

/* ── Scroll Reveal base state ── */
.sr {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity 0.65s cubic-bezier(0.22,1,0.36,1),
              transform 0.65s cubic-bezier(0.22,1,0.36,1);
  will-change: opacity, transform;
}
.sr.sr-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger delays for grids */
.sr-d1 { transition-delay: 0.05s; }
.sr-d2 { transition-delay: 0.13s; }
.sr-d3 { transition-delay: 0.21s; }
.sr-d4 { transition-delay: 0.29s; }
.sr-d5 { transition-delay: 0.37s; }
.sr-d6 { transition-delay: 0.45s; }

/* Slide from left / right variants */
.sr-left  { transform: translateX(-48px) translateY(0); }
.sr-right { transform: translateX(48px)  translateY(0); }
.sr-left.sr-visible,
.sr-right.sr-visible { transform: translateX(0); }

/* Scale-in variant (for stat numbers, badges) */
.sr-scale {
  opacity: 0;
  transform: scale(0.82);
  transition: opacity 0.5s cubic-bezier(0.34,1.56,0.64,1),
              transform 0.5s cubic-bezier(0.34,1.56,0.64,1);
}
.sr-scale.sr-visible { opacity: 1; transform: scale(1); }

/* ── 3D Tilt card wrapper ── */
.tilt-wrap {
  transform-style: preserve-3d;
  perspective: 900px;
  transition: transform 0.1s linear;
}
.tilt-wrap .tilt-shine {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,0.18) 0%, transparent 70%);
  opacity: 0;
  transition: opacity 0.3s;
  z-index: 2;
}
.tilt-wrap:hover .tilt-shine { opacity: 1; }

/* ── Floating pills ── */
@keyframes float-a {
  0%,100% { transform: translateY(0px) rotate(-1deg); }
  50%      { transform: translateY(-10px) rotate(1deg); }
}
@keyframes float-b {
  0%,100% { transform: translateY(0px) rotate(1deg); }
  50%      { transform: translateY(-14px) rotate(-1deg); }
}
@keyframes float-c {
  0%,100% { transform: translateY(0px) rotate(0deg); }
  50%      { transform: translateY(-8px) rotate(2deg); }
}
@keyframes float-d {
  0%,100% { transform: translateY(-4px); }
  50%      { transform: translateY(6px); }
}
@keyframes float-e {
  0%,100% { transform: translateY(0px) rotate(-2deg); }
  50%      { transform: translateY(-12px) rotate(1deg); }
}

.lp-platforms .lp-platform-pill:nth-child(1) { animation: float-a 3.8s ease-in-out infinite; }
.lp-platforms .lp-platform-pill:nth-child(2) { animation: float-b 4.4s ease-in-out infinite 0.4s; }
.lp-platforms .lp-platform-pill:nth-child(3) { animation: float-c 3.5s ease-in-out infinite 0.8s; }
.lp-platforms .lp-platform-pill:nth-child(4) { animation: float-d 4.8s ease-in-out infinite 0.2s; }
.lp-platforms .lp-platform-pill:nth-child(5) { animation: float-e 4.1s ease-in-out infinite 0.6s; }

/* ── Hero text reveal ── */
.hero-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(40px) rotateX(-25deg);
  transform-origin: bottom center;
  animation: word-in 0.7s cubic-bezier(0.22,1,0.36,1) forwards;
}
@keyframes word-in {
  to { opacity: 1; transform: translateY(0) rotateX(0deg); }
}

/* Badge pop-in */
@keyframes badge-pop {
  0%   { opacity: 0; transform: scale(0.7) translateY(8px); }
  70%  { transform: scale(1.06) translateY(-2px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}
.lp-badge { animation: badge-pop 0.6s cubic-bezier(0.34,1.56,0.64,1) 0.1s both; }

/* Sub fade-in */
@keyframes sub-in {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
.lp-sub { animation: sub-in 0.8s ease 0.8s both; }

/* Analyzer slide-up */
.lp-analyzer { animation: sub-in 0.8s ease 1s both; }

/* Platforms slide-up */
.lp-platforms { animation: sub-in 0.6s ease 0.6s both; }

/* ── Parallax orbs (updated by JS) ── */
.lp-hero-orb-1,
.lp-hero-orb-2 {
  transition: transform 0.1s linear;
  will-change: transform;
}

/* ── Mockup 3D float ── */
@keyframes mockup-float {
  0%,100% { transform: translateY(0px) rotateX(2deg); }
  50%      { transform: translateY(-10px) rotateX(1deg); }
}
.lp-mockup {
  transform-style: preserve-3d;
  perspective: 1200px;
  animation: mockup-float 6s ease-in-out infinite;
}

/* ── Step numbers bounce-in ── */
@keyframes step-pop {
  0%   { transform: scale(0) rotate(-15deg); opacity: 0; }
  60%  { transform: scale(1.15) rotate(4deg); opacity: 1; }
  100% { transform: scale(1) rotate(0deg); opacity: 1; }
}
.sr-visible .lp-step-num {
  animation: step-pop 0.5s cubic-bezier(0.34,1.56,0.64,1) 0.25s both;
}

/* ── Stat counter pulse ── */
@keyframes count-pop {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.18); color: var(--primary); }
  100% { transform: scale(1); }
}
.lp-stat-num.counting { animation: count-pop 0.4s ease; }

/* ── Feature card hover lift (3D) ── */
.lp-feat-card {
  transition: transform 0.25s cubic-bezier(0.22,1,0.36,1),
              box-shadow 0.25s ease !important;
  transform-style: preserve-3d;
  will-change: transform;
}

/* ── Plan card hover lift ── */
.lp-plan {
  transition: transform 0.25s cubic-bezier(0.22,1,0.36,1),
              box-shadow 0.25s ease !important;
  will-change: transform;
}
.lp-plan:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 20px 48px rgba(255,107,53,0.13) !important;
}
.lp-plan-featured:hover {
  transform: translateY(-8px) scale(1.03);
  box-shadow: 0 24px 56px rgba(255,107,53,0.22) !important;
}

/* ── Testimonial cards ── */
.lp-testimonial {
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}
.lp-testimonial:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.09) !important;
}

/* ── CTA band — slow subtle shimmer, stays orange ── */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}
.lp-cta-band {
  background-size: 300% auto !important;
  animation: shimmer 8s linear infinite;
  background-image: linear-gradient(135deg, var(--primary) 0%, var(--accent) 35%, #ff8050 55%, var(--primary) 100%) !important;
}

/* ── Nav scroll shrink ── */
.lp-nav.scrolled {
  height: 56px !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.08);
  transition: height 0.3s ease, box-shadow 0.3s ease;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .sr, .hero-word, .lp-badge, .lp-sub, .lp-analyzer, .lp-platforms,
  .lp-platform-pill, .lp-mockup, .lp-feat-card, .lp-plan {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}


/* ════════════════════════════════════════════
   EXTRA SHIMMER EFFECTS
   ════════════════════════════════════════════ */

/* Feature card skeleton shimmer before reveal — very light, slow */
.lp-feat-card.sr:not(.sr-visible) {
  background: linear-gradient(90deg, #f8fafc 25%, #f1f5f9 50%, #f8fafc 75%) !important;
  background-size: 200% 100% !important;
  animation: card-shimmer 2.4s ease infinite !important;
  border-color: #e9eef4 !important;
}
@keyframes card-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Most Popular badge — static gradient, no shimmer */
.lp-plan-badge {
  background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
  animation: none !important;
}

/* Analyzer border shimmer on hover */
.lp-analyzer {
  transition: border-color 0.3s, box-shadow 0.3s;
}
.lp-analyzer:hover {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(255,107,53,0.12), 0 4px 28px rgba(0,0,0,.07) !important;
}

/* Nav logo shimmer on load */
@keyframes logo-shine {
  0%   { filter: brightness(1); }
  50%  { filter: brightness(1.15) drop-shadow(0 0 8px rgba(255,107,53,0.5)); }
  100% { filter: brightness(1); }
}
.lp-logo-img { animation: logo-shine 3s ease-in-out infinite 1s; }

/* Eye-catcher card shimmer border on hover — slow, subtle */
.lp-feat-eyecatcher:hover::after {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,107,53,.2), rgba(255,159,28,.15), rgba(255,107,53,.2));
  background-size: 300% 300%;
  animation: shimmer 6s linear infinite;
  z-index: -1;
  pointer-events: none;
}

/* Pricing featured card border — slow soft glow */
/* Pricing featured card — clean professional highlight */
.lp-plan-featured {
  position: relative;
  box-shadow: 0 12px 40px rgba(255,107,53,0.12);
  border: 2px solid var(--primary);
}

/* ════════════════════════════════════════════
   ANIMATED FOOTER
   ════════════════════════════════════════════ */

/* Wave SVG above footer */
.lp-footer-wave {
  display: block;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  margin-bottom: -2px;
}
.lp-footer-wave svg { display: block; width: 100%; }

/* Animated wave paths */
@keyframes wave1 {
  0%,100% { d: path("M0,40 C200,80 400,0 600,40 C800,80 1000,0 1200,40 L1200,100 L0,100 Z"); }
  50%      { d: path("M0,60 C200,20 400,80 600,60 C800,20 1000,80 1200,60 L1200,100 L0,100 Z"); }
}
@keyframes wave2 {
  0%,100% { d: path("M0,50 C150,20 350,80 550,50 C750,20 950,80 1200,50 L1200,100 L0,100 Z"); }
  50%      { d: path("M0,30 C150,70 350,20 550,50 C750,70 950,20 1200,50 L1200,100 L0,100 Z"); }
}

/* Footer background */
.lp-footer {
  position: relative;
  background: linear-gradient(180deg, var(--bg) 0%, #f0f4ff 100%);
  overflow: hidden;
}

/* Footer grid dot pattern */
.lp-footer::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(255,107,53,0.08) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
}

/* Footer content float-in */
.lp-footer .lp-container > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.lp-footer.footer-visible .lp-container > * { opacity: 1; transform: none; }
.lp-footer.footer-visible .lp-container > *:nth-child(1) { transition-delay: 0.05s; }
.lp-footer.footer-visible .lp-container > *:nth-child(2) { transition-delay: 0.15s; }
.lp-footer.footer-visible .lp-container > *:nth-child(3) { transition-delay: 0.25s; }
.lp-footer.footer-visible .lp-container > *:nth-child(4) { transition-delay: 0.35s; }

/* Footer logo glow pulse */
@keyframes footer-glow {
  0%,100% { filter: drop-shadow(0 0 0px rgba(255,107,53,0)); }
  50%      { filter: drop-shadow(0 0 14px rgba(255,107,53,0.45)); }
}
.lp-footer .lp-logo-img { animation: footer-glow 3.5s ease-in-out infinite; }

/* Footer link hover underline draw */
.lp-footer-links a {
  position: relative;
}
.lp-footer-links a::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 1.5px;
  background: var(--primary);
  transition: width 0.25s ease;
}
.lp-footer-links a:hover::after { width: 100%; }

/* ── Reduced motion overrides ── */
@media (prefers-reduced-motion: reduce) {
  .lp-feat-card.sr:not(.sr-visible),
  .lp-plan-badge, .lp-logo-img,
  .lp-footer .lp-container > * {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ── Autopilot Highlight Section ── */
.lp-ap-grid { display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center }
.lp-ap-feat { display:flex;align-items:center;gap:10px;font-size:0.9rem;color:var(--text) }
.lp-ap-card-wrap { perspective:1000px }
.lp-ap-card {
  background:var(--bg-card);border:1px solid var(--card-border);border-radius:14px;
  padding:22px;box-shadow:0 12px 40px rgba(255,107,53,.1);
  animation:mockup-float 5s ease-in-out infinite;
}
.lp-apt { display:flex;align-items:center;gap:8px;font-size:12px;padding:7px 10px;border-radius:8px }
.lp-apt-done { background:#f0fdf4;color:#166534 }
.lp-apt-run  { background:#eff6ff;color:var(--blue);font-weight:600 }
.lp-apt-wait { background:var(--bg);color:var(--muted) }
.lp-apt-spin {
  width:11px;height:11px;border:2px solid #bfdbfe;border-top-color:var(--blue);
  border-radius:50%;animation:lp-spin .7s linear infinite;flex-shrink:0;
}

/* ── Free API Keys Grid ── */
.lp-keys-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:780px;margin:32px auto 0;text-align:left }
.lp-key-card { background:var(--bg-card);border:1px solid var(--card-border);border-radius:12px;padding:18px 16px;transition:transform .2s,box-shadow .2s }
.lp-key-card:hover { transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.07) }
.lp-key-icon { width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:10px }
.lp-key-name { font-weight:700;font-size:14px;margin-bottom:2px }
.lp-key-free { font-size:11px;font-weight:700;color:var(--green);background:#f0fdf4;border:1px solid #bbf7d0;padding:2px 8px;border-radius:20px;display:inline-block;margin-bottom:6px }
.lp-key-note { font-size:12px;color:var(--muted);line-height:1.5 }

/* Responsive */
@media(max-width:900px) {
  .lp-ap-grid { grid-template-columns:1fr;gap:32px }
  .lp-ap-card-wrap { perspective:none }
  .lp-ap-card { animation:none;max-width:100% }
  .lp-keys-grid { grid-template-columns:repeat(2,1fr) }
}
@media(max-width:500px) {
  .lp-keys-grid { grid-template-columns:1fr }
}
