/* ═══════════════════════════════════════════════════════════
   ConvoAct — NUCLEAR Effects Layer
   Extreme animations, immersion, and interactivity.
   Loaded after style.css on all pages.
   ═══════════════════════════════════════════════════════════ */

/* ── 1. PRELOADER ── */
.nuclear-preloader {
  position: fixed; inset: 0; z-index: 99999;
  background: var(--bg);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 24px;
  transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
              visibility 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.nuclear-preloader.done {
  opacity: 0; visibility: hidden; pointer-events: none;
}
.preloader-logo {
  position: relative; width: 64px; height: 64px;
}
.preloader-logo img {
  width: 48px; height: 48px;
  border-radius: 12px;
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
.preloader-ring {
  position: absolute; inset: 0;
  border: 3px solid transparent;
  border-top-color: var(--primary);
  border-right-color: var(--accent);
  border-radius: 50%;
  animation: preloaderSpin 0.7s linear infinite;
}
@keyframes preloaderSpin { to { transform: rotate(360deg); } }

.preloader-bar {
  width: 120px; height: 3px;
  background: var(--muted); border-radius: 2px; overflow: hidden;
}
.preloader-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  border-radius: 2px;
  animation: preloaderFill 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
@keyframes preloaderFill { to { width: 100%; } }


/* ── 2. CUSTOM CURSOR ── */
@media (pointer: fine) {
  html:not([data-reduced-motion]) body { cursor: none; }
  html:not([data-reduced-motion]) a,
  html:not([data-reduced-motion]) button,
  html:not([data-reduced-motion]) [role="tab"],
  html:not([data-reduced-motion]) input,
  html:not([data-reduced-motion]) textarea,
  html:not([data-reduced-motion]) select,
  html:not([data-reduced-motion]) .team-link-card,
  html:not([data-reduced-motion]) .trust-badge,
  html:not([data-reduced-motion]) .nav-cta,
  html:not([data-reduced-motion]) .btn-primary,
  html:not([data-reduced-motion]) .btn-ghost,
  html:not([data-reduced-motion]) .contact-email-btn,
  html:not([data-reduced-motion]) .legal-accordion-btn,
  html:not([data-reduced-motion]) .arch-node,
  html:not([data-reduced-motion]) .edge-card,
  html:not([data-reduced-motion]) .selector-chip,
  html:not([data-reduced-motion]) .feat-tab,
  html:not([data-reduced-motion]) .team-bio-toggle,
  html:not([data-reduced-motion]) .theme-toggle,
  html:not([data-reduced-motion]) .legal-toc-link,
  html:not([data-reduced-motion]) .legal-back-to-top { cursor: none; }
}

.nuclear-cursor {
  position: fixed; top: 0; left: 0; z-index: 99998;
  pointer-events: none; will-change: transform;
  mix-blend-mode: difference;
}
.nuclear-cursor-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #fff;
  transition: transform 0.15s ease, background 0.2s ease;
}
.nuclear-cursor-ring {
  position: absolute; top: -14px; left: -14px;
  width: 36px; height: 36px; border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,0.5);
  opacity: 0.4;
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              opacity 0.3s ease, width 0.3s ease, height 0.3s ease,
              top 0.3s ease, left 0.3s ease;
}
.nuclear-cursor.hovering .nuclear-cursor-ring {
  transform: scale(1.8); opacity: 0.7;
}
.nuclear-cursor.clicking .nuclear-cursor-dot {
  transform: scale(0.5);
}


/* ── 3. FILM GRAIN OVERLAY ── */
body::after {
  content: '';
  position: fixed; inset: 0; z-index: 99990;
  pointer-events: none;
  opacity: 0.025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  mix-blend-mode: overlay;
}
[data-theme="dark"] body::after { opacity: 0.035; }


/* ── 4. SCROLL-LINKED BACKGROUND GRADIENT ── */
body {
  background-image:
    radial-gradient(ellipse at 10% 10%, hsla(var(--scroll-hue-1, 160), 50%, 50%, 0.035), transparent 50%),
    radial-gradient(ellipse at 90% 80%, hsla(var(--scroll-hue-2, 43), 50%, 50%, 0.035), transparent 50%);
}
[data-theme="dark"] body {
  background-image:
    radial-gradient(ellipse at 10% 10%, hsla(var(--scroll-hue-1, 160), 50%, 50%, 0.05), transparent 50%),
    radial-gradient(ellipse at 90% 80%, hsla(var(--scroll-hue-2, 43), 50%, 50%, 0.05), transparent 50%);
}


/* ── 5. CINEMATIC DARK MODE TOGGLE ── */
.theme-wipe {
  position: fixed; z-index: 99997;
  border-radius: 50%;
  pointer-events: none;
  transform: scale(0);
  will-change: transform;
}
.theme-wipe.expanding {
  transition: transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);
  transform: scale(1);
}
.theme-wipe.fading {
  transition: opacity 0.4s ease;
  opacity: 0;
}


/* ── 6. ENHANCED STAGGER CASCADES ── */
[data-reveal-stagger].visible > * {
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
[data-reveal-stagger].visible > *:nth-child(7) { transition-delay: 0.72s; }
[data-reveal-stagger].visible > *:nth-child(8) { transition-delay: 0.84s; }
[data-reveal-stagger].visible > *:nth-child(9) { transition-delay: 0.96s; }
[data-reveal-stagger].visible > *:nth-child(10) { transition-delay: 1.08s; }
[data-reveal-stagger].visible > *:nth-child(11) { transition-delay: 1.2s; }
[data-reveal-stagger].visible > *:nth-child(12) { transition-delay: 1.32s; }


/* ── 7. TEXT SCRAMBLE REVEAL ── */
[data-reveal="scramble"] {
  opacity: 0;
  transition: opacity 0.3s ease;
}
[data-reveal="scramble"].visible {
  opacity: 1;
}


/* ── 8. SCROLL VELOCITY SKEW ── */
.section {
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}


/* ═══════════════════════════════════════════════════════════
   INDEX.HTML — FLAGSHIP
   ═══════════════════════════════════════════════════════════ */

/* ── Hero Cinematic Entrance ── */
[data-reveal="hero-entrance"] .hero-badge {
  opacity: 0; transform: translateY(-20px) rotate(-6deg) scale(0.8);
  transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.2s;
}
[data-reveal="hero-entrance"].visible .hero-badge {
  opacity: 1; transform: translateY(0) rotate(-2deg) scale(1);
}
[data-reveal="hero-entrance"] h1 {
  opacity: 0; transform: translateY(50px);
  transition: all 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.4s;
}
[data-reveal="hero-entrance"].visible h1 {
  opacity: 1; transform: translateY(0);
}
[data-reveal="hero-entrance"] .hero-desc {
  opacity: 0; transform: translateY(30px);
  transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.7s;
}
[data-reveal="hero-entrance"].visible .hero-desc {
  opacity: 1; transform: translateY(0);
}
[data-reveal="hero-entrance"] .hero-actions {
  opacity: 0; transform: translateY(25px);
  transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.9s;
}
[data-reveal="hero-entrance"].visible .hero-actions {
  opacity: 1; transform: translateY(0);
}
[data-reveal="hero-entrance"] .hero-stats {
  opacity: 0; transform: translateY(20px);
  transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1) 1.1s;
}
[data-reveal="hero-entrance"].visible .hero-stats {
  opacity: 1; transform: translateY(0);
}

/* ── Hero Floating Orbs ── */
.hero-orbs {
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none; overflow: hidden;
}
.hero-orb {
  position: absolute;
  width: var(--orb-size); height: var(--orb-size);
  border-radius: 50%;
  background: radial-gradient(circle, hsla(var(--orb-hue), 60%, 60%, 0.3), transparent 70%);
  left: var(--orb-x); top: var(--orb-y);
  animation: orbFloat var(--orb-duration) ease-in-out var(--orb-delay) infinite alternate;
  filter: blur(3px);
  will-change: transform;
}
@keyframes orbFloat {
  0%   { transform: translate(0, 0) scale(1); opacity: 0.3; }
  33%  { transform: translate(25px, -35px) scale(1.3); opacity: 0.6; }
  66%  { transform: translate(-20px, 20px) scale(0.8); opacity: 0.5; }
  100% { transform: translate(10px, -15px) scale(1.1); opacity: 0.35; }
}

/* ── Hero Phones 3D ── */
.hero-phones {
  perspective: 1200px;
  transform-style: preserve-3d;
}
.hero-phones .phone-mockup {
  transition: transform 0.15s ease;
  will-change: transform;
}

/* ── Stats Counter Landing ── */
.stat-number.number-landed {
  animation: numberLand 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes numberLand {
  0% { transform: scale(1); }
  40% { transform: scale(1.35); }
  70% { transform: scale(0.95); }
  100% { transform: scale(1); }
}

/* ── Privacy Pipeline Glow Trail ── */
.privacy-pipeline.animating .pipeline-packet {
  box-shadow:
    0 0 8px rgba(var(--primary-rgb), 0.6),
    0 0 20px rgba(var(--primary-rgb), 0.4),
    0 0 40px rgba(var(--primary-rgb), 0.2);
}
.privacy-pipeline.animating .pipeline-packet::after {
  content: '';
  position: absolute;
  right: 100%; top: 50%;
  width: 50px; height: 2px;
  transform: translateY(-50%);
  background: linear-gradient(90deg, transparent, rgba(var(--primary-rgb), 0.5));
  border-radius: 2px;
}

/* ── Comparison Table Row Sweep ── */
.compare-table tbody tr {
  position: relative;
  overflow: hidden;
}
.compare-table tbody tr::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 10%, rgba(var(--primary-rgb), 0.1) 50%, transparent 90%);
  transform: translateX(-110%);
  pointer-events: none;
}
.compare-wrap.visible .compare-table tbody tr::after {
  animation: rowSweep 0.7s ease forwards;
  animation-delay: calc(var(--row-i, 0) * 0.07s + 0.2s);
}
@keyframes rowSweep {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(110%); }
}

/* ── Architecture Animated Lines ── */
.nuclear-arch-line {
  stroke: var(--primary);
  stroke-width: 2;
  stroke-dasharray: 8 4;
  stroke-dashoffset: 24;
  animation: archLineDash 1s linear infinite;
  opacity: 0.5;
  filter: drop-shadow(0 0 3px rgba(var(--primary-rgb), 0.4));
}
@keyframes archLineDash {
  to { stroke-dashoffset: 0; }
}
.arch-svg-overlay {
  position: absolute; inset: 0; pointer-events: none; z-index: 10;
  overflow: visible;
}


/* ═══════════════════════════════════════════════════════════
   LEGAL PAGES (accessibility, privacy-policy, terms)
   ═══════════════════════════════════════════════════════════ */

/* ── Per-Section Reading Progress ── */
.legal-block {
  position: relative;
}
.legal-section-progress {
  position: absolute;
  top: 0; left: -16px;
  width: 3px; height: 100%;
  background: var(--muted);
  border-radius: 2px;
  overflow: hidden;
}
.legal-section-progress::after {
  content: '';
  position: absolute; top: 0; left: 0;
  width: 100%;
  height: calc(var(--progress, 0) * 100%);
  background: linear-gradient(180deg, var(--primary), var(--accent));
  border-radius: 2px;
  transition: height 0.1s linear;
  box-shadow: 0 0 6px rgba(var(--primary-rgb), 0.3);
}

/* ── TOC Active Link Glow ── */
.legal-toc-link.active {
  text-shadow: 0 0 8px rgba(var(--primary-rgb), 0.2);
}
.legal-toc-link.active::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--primary);
  border-radius: 2px;
  animation: tocGlow 2s ease infinite;
  box-shadow: 0 0 8px rgba(var(--primary-rgb), 0.4);
}
@keyframes tocGlow {
  0%, 100% { box-shadow: 0 0 4px rgba(var(--primary-rgb), 0.2); }
  50%      { box-shadow: 0 0 12px rgba(var(--primary-rgb), 0.6); }
}

/* ── Accordion Spring Physics ── */
.legal-accordion-panel {
  transition: max-height 0.5s cubic-bezier(0.34, 1.56, 0.64, 1),
              padding 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.legal-accordion-btn {
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.legal-accordion-btn[aria-expanded="true"] {
  transform: scale(1.01);
  background: rgba(var(--primary-rgb), 0.04);
}

/* ── Callout Box Float-In ── */
.legal-callout {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.legal-callout-accent {
  transform: translateX(30px);
}
.legal-block.visible .legal-callout,
.legal-content .legal-callout.visible {
  opacity: 1;
  transform: translateX(0);
}

/* ── Reading Position Highlight ── */
.legal-block p {
  transition: opacity 0.2s ease, transform 0.2s ease;
}


/* ═══════════════════════════════════════════════════════════
   AI.HTML
   ═══════════════════════════════════════════════════════════ */

/* ── Hero Counter Explosion ── */
.ai-hero-number .number-landed {
  animation: numberLand 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ── Coach Simulator Morph ── */
.coach-chat-sim {
  transition: border-color 0.5s ease, box-shadow 0.5s ease;
}
.coach-avatar-wrap {
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.coach-avatar-wrap.switching {
  transform: scale(0) rotate(180deg);
}

/* ── Category Nav Dot Pulse ── */
.ai-cat-link.active::after {
  content: '';
  position: absolute;
  bottom: -4px; left: 50%;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: currentColor;
  transform: translateX(-50%);
  animation: catDotPulse 1.5s ease infinite;
}
@keyframes catDotPulse {
  0%, 100% { opacity: 1; transform: translateX(-50%) scale(1); }
  50% { opacity: 0.4; transform: translateX(-50%) scale(1.8); }
}

/* ── Feature Card 3D Reveal ── */
.vision-card,
.coach-feature-item {
  transform: perspective(800px) rotateY(6deg);
  opacity: 0;
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              opacity 0.6s ease;
}
[data-reveal-stagger].visible .vision-card,
[data-reveal-stagger].visible .coach-feature-item,
.vision-card.visible,
.coach-feature-item.visible {
  transform: perspective(800px) rotateY(0deg);
  opacity: 1;
}


/* ═══════════════════════════════════════════════════════════
   TEAM.HTML
   ═══════════════════════════════════════════════════════════ */

/* ── Photo 3D Tilt ── */
.team-photo-wrap {
  transition: transform 0.3s ease;
}

/* ── Bio Typewriter ── */
.team-role.typewriter-ready {
  border-right: 2px solid var(--primary);
  animation: blink 0.8s step-end infinite;
  min-height: 1.5em;
}
.team-role.typewriter-done {
  border-right: none;
  animation: none;
}

/* ── Fun Fact Bounce-In ── */
.team-facts[data-reveal-stagger].visible .team-fact {
  animation: factBounceIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
.team-facts[data-reveal-stagger].visible .team-fact:nth-child(1) { animation-delay: 0.05s; }
.team-facts[data-reveal-stagger].visible .team-fact:nth-child(2) { animation-delay: 0.15s; }
.team-facts[data-reveal-stagger].visible .team-fact:nth-child(3) { animation-delay: 0.25s; }
.team-facts[data-reveal-stagger].visible .team-fact:nth-child(4) { animation-delay: 0.35s; }
.team-facts[data-reveal-stagger].visible .team-fact:nth-child(5) { animation-delay: 0.45s; }
.team-facts[data-reveal-stagger].visible .team-fact:nth-child(6) { animation-delay: 0.55s; }

@keyframes factBounceIn {
  0%   { opacity: 0; transform: translateY(30px) scale(0.5) rotate(-8deg); }
  60%  { transform: translateY(-5px) scale(1.08) rotate(1deg); }
  100% { opacity: 1; transform: translateY(0) scale(1) rotate(0deg); }
}

/* ── Social Link Bounce Stagger ── */
.team-links[data-reveal-stagger].visible .team-link-card {
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}


/* ═══════════════════════════════════════════════════════════
   REDUCED MOTION — NUCLEAR KILL SWITCH
   ═══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .nuclear-cursor { display: none !important; }
  html body { cursor: auto !important; }
  html a, html button, html [role="tab"] { cursor: auto !important; }
  body::after { display: none !important; }
  .nuclear-preloader { display: none !important; }
  .theme-wipe { display: none !important; }
  .hero-orbs { display: none !important; }
  .hero-orb { animation: none !important; }
  .legal-section-progress { display: none !important; }
  .section { transition: none !important; }

  [data-reveal="hero-entrance"] .hero-badge,
  [data-reveal="hero-entrance"] h1,
  [data-reveal="hero-entrance"] .hero-desc,
  [data-reveal="hero-entrance"] .hero-actions,
  [data-reveal="hero-entrance"] .hero-stats {
    opacity: 1 !important; transform: none !important;
    transition: none !important;
  }

  .vision-card, .coach-feature-item {
    opacity: 1 !important; transform: none !important;
  }

  .legal-callout { opacity: 1 !important; transform: none !important; }

  .team-facts .team-fact { animation: none !important; opacity: 1 !important; transform: none !important; }
}