/* ── shared-fx.css ── futuristic uplift for all pages ── */

/* Grid texture overlay */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,92,0,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,92,0,.035) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
  z-index: 0;
}

/* Global canvas backdrop */
#bg-canvas {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  opacity: 0.55;
}

/* ensure all content sits above canvas */
nav, main, footer { position: relative; z-index: 1; }

/* ── Orbs ── */
.fx-orb {
  position: fixed;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
  animation: orb-drift 18s ease-in-out infinite alternate;
}
.fx-orb-1 {
  width: 520px; height: 520px;
  background: radial-gradient(circle, rgba(255,92,0,.18) 0%, transparent 70%);
  top: -120px; right: -100px;
  animation-duration: 22s;
}
.fx-orb-2 {
  width: 380px; height: 380px;
  background: radial-gradient(circle, rgba(255,138,61,.12) 0%, transparent 70%);
  bottom: 10%; left: -80px;
  animation-duration: 28s;
  animation-delay: -8s;
}
.fx-orb-3 {
  width: 280px; height: 280px;
  background: radial-gradient(circle, rgba(255,200,100,.09) 0%, transparent 70%);
  top: 40%; right: 15%;
  animation-duration: 34s;
  animation-delay: -14s;
}
@keyframes orb-drift {
  0%   { transform: translate(0, 0) scale(1); }
  33%  { transform: translate(30px, -40px) scale(1.08); }
  66%  { transform: translate(-20px, 20px) scale(0.95); }
  100% { transform: translate(15px, -15px) scale(1.04); }
}

/* ── Scroll reveal ── */
.fx-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .55s ease, transform .55s ease;
}
.fx-reveal.fx-visible {
  opacity: 1;
  transform: none;
}

/* ── Card hover glow ── */
.card {
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease !important;
  will-change: transform;
}
.card:hover {
  border-color: rgba(255,92,0,.38) !important;
  box-shadow: 0 0 28px rgba(255,92,0,.12), 0 4px 24px rgba(0,0,0,.4);
  transform: translateY(-3px);
}

/* ── Button glow pulse ── */
.btn.primary {
  position: relative;
  overflow: hidden;
}
.btn.primary::after {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: rgba(255,92,0,.22);
  filter: blur(10px);
  opacity: 0;
  transition: opacity .3s ease;
  pointer-events: none;
}
.btn.primary:hover::after { opacity: 1; }

/* ── Eyebrow scanner ── */
.eyebrow {
  position: relative;
  display: inline-block;
}
.eyebrow::after {
  content: '';
  position: absolute;
  left: 0; bottom: -3px;
  height: 1px; width: 0;
  background: var(--accent, #ff5c00);
  transition: width .6s ease;
}
.eyebrow.fx-visible::after { width: 100%; }

/* ── Glitch flicker on section entry ── */
@keyframes glitch-in {
  0%   { clip-path: inset(0 0 95% 0); opacity: .3; }
  20%  { clip-path: inset(0 0 60% 0); opacity: .7; }
  40%  { clip-path: inset(0 0 30% 0); opacity: 1; }
  60%  { clip-path: inset(40% 0 0 0); opacity: .8; }
  80%  { clip-path: inset(10% 0 0 0); opacity: 1; }
  100% { clip-path: inset(0 0 0 0); opacity: 1; }
}
.fx-glitch.fx-visible h1,
.fx-glitch.fx-visible h2 {
  animation: glitch-in .5s ease forwards;
}

/* ── Nav link hover underline ── */
.nav-links a:not(.cta) {
  position: relative;
  transition: color .18s ease;
}
.nav-links a:not(.cta)::after {
  content: '';
  position: absolute;
  left: 0; bottom: -2px;
  height: 1px; width: 0;
  background: var(--accent, #ff5c00);
  transition: width .22s ease;
}
.nav-links a:not(.cta):hover { color: #fff !important; }
.nav-links a:not(.cta):hover::after { width: 100%; }

/* ── Section divider scan line ── */
main section + section::before {
  content: '';
  display: block;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,92,0,.25), transparent);
  margin-bottom: 0;
  position: relative;
  top: -1px;
}

/* ── Hero panel animated border ── */
.hero-panel {
  position: relative;
  overflow: hidden;
}
.hero-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: conic-gradient(from var(--angle, 0deg), transparent 60%, rgba(255,92,0,.55) 70%, transparent 80%);
  animation: border-spin 4s linear infinite;
  z-index: 0;
  pointer-events: none;
  opacity: .7;
}
.hero-panel > * { position: relative; z-index: 1; }
@property --angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
@keyframes border-spin {
  to { --angle: 360deg; }
}

/* ── Proof chip hover ── */
.proof-chip {
  transition: border-color .2s, background .2s, transform .2s;
  cursor: default;
}
.proof-chip:hover {
  border-color: rgba(255,92,0,.35) !important;
  background: rgba(255,92,0,.05) !important;
  transform: translateY(-2px);
}

/* ── Mouse cursor glow ── */
#cursor-glow {
  position: fixed;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,92,0,.07) 0%, transparent 70%);
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 9999;
  transition: opacity .3s;
}