/* ===================================================================
   Agentic Prism — Shared motion system
   Single source of truth for scroll-reveal, reduced-motion handling,
   hover gating, press feedback, and shared @keyframes.
   Used by index.html and faq.html — edit here, not per-page.
   =================================================================== */

/* ===== Scroll reveal system ===== */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
.reveal.in { opacity: 1; transform: translateY(0); }
.reveal-stagger.in > * { opacity: 1; transform: translateY(0); }
.reveal-stagger > * { opacity: 0; transform: translateY(24px); transition: opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1); }
.reveal-stagger.in > *:nth-child(1) { transition-delay: .05s; }
.reveal-stagger.in > *:nth-child(2) { transition-delay: .15s; }
.reveal-stagger.in > *:nth-child(3) { transition-delay: .25s; }
.reveal-stagger.in > *:nth-child(4) { transition-delay: .35s; }
.reveal-stagger.in > *:nth-child(5) { transition-delay: .45s; }
.reveal-stagger.in > *:nth-child(6) { transition-delay: .55s; }

/* ===== Shared keyframes ===== */
@keyframes drift { from { transform: translateX(-53%) translateY(0); } to { transform: translateX(-47%) translateY(20px); } }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
@keyframes fadeDown { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes blink { 0%,60%,100%{opacity:.3;} 30%{opacity:1;} }
/* Note: panelIn keyframes removed — #chat-panel now uses an interruptible
   CSS transition (see the per-page #chat-panel rules) instead of a
   restart-from-zero keyframe animation, so open/close can be interrupted
   mid-motion. */

/* ===== Press feedback ===== */
/* .btn covers every button variant on the site (btn-primary, btn-ghost,
   btn-v2-primary, btn-v2-ghost all carry the shared .btn class), so one
   rule gives every CTA instant, physical press feedback. Chips (the FAQ
   suggestion pills) get the same treatment since they're real buttons too. */
.btn:active { transform: scale(0.97); }
.chip:active { transform: scale(0.97); }

/* ===== Reduced motion ===== */
@media (prefers-reduced-motion: reduce) {
  /* Scroll reveal: keep the fade (aids comprehension), drop the slide-up */
  .reveal, .reveal-stagger > * {
    transform: none !important;
    transition: opacity .3s ease !important;
  }
  /* Ambient infinite loops never stop on their own — kill them outright */
  .hero-glow, .cta-section::before, .badge .dot, #chat-launcher, .typing span {
    animation: none !important;
  }
  /* One-shot page-load entrances: show final state immediately, no slide */
  .hero .badge, .hero-actions {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  /* Chat panel: keep the fade (state change needs *some* signal) but drop
     the scale/translate motion */
  #chat-panel {
    transition: opacity .2s ease !important;
  }
  #chat-panel.open {
    transform: none !important;
  }
  /* Chat messages: drop the slide-in keyframe, keep instant visibility */
  .msg-row.enter {
    animation: none !important;
  }
  /* Nav dropdown: drop the scale, keep the fade */
  .nav-dropdown-menu {
    transition: opacity .2s ease !important;
  }
  .nav-dropdown:hover .nav-dropdown-menu {
    transform: translateX(-50%) translateY(0) !important;
  }
}

/* ===== Hover (mouse/trackpad only — prevents sticky hover on tap) ===== */
@media (hover: hover) and (pointer: fine) {
  .nav-links a:hover::after { width: 100%; }
  .btn-primary:hover { background: var(--accent-hover); transform: translateY(-2px); box-shadow: rgba(72,66,233,0.35) 0px 10px 20px -8px; }
  .nav-dropdown:hover .chev { transform: rotate(180deg); }
  .nav-dropdown:hover .nav-dropdown-menu { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0) scale(1); }
  .nav-dropdown-item:hover { background: var(--border-light); }
  .btn-ghost:hover { background: rgba(72,66,233,0.05); }
  .btn-v2-primary:hover { transform: translateY(-2px); }
  .btn-v2-ghost:hover { transform: translateY(-2px); background: rgba(255,255,255,0.2); }
  .agent-learn-link:hover { text-decoration: underline; }
  .card:hover { transform: translateY(-6px); box-shadow: rgba(50,50,93,0.2) 0px 25px 45px -20px, rgba(0,0,0,0.08) 0px 12px 20px -10px; }
  .card:hover .icon { background: var(--accent); transform: scale(1.1) rotate(-6deg); }
  .fc-card:hover { transform: translateY(-6px) scale(1.015); box-shadow: 0 24px 54px rgba(10,4,24,0.6), inset 0 1px 0 rgba(255,255,255,0.08); }
  .solution-card:hover { transform: translateY(-14px) scale(1.04); box-shadow: rgba(0,0,0,0.4) 0px 35px 60px -20px, rgba(72,66,233,0.25) 0px 18px 30px -10px; z-index: 2; }
  .solution-card:hover .sc-mockup { transform: translateY(-2px); }
  .solution-card-image-only:hover .solution-card-full-img { transform: scale(1.03); }
  .agent-card:hover { transform: translateY(-8px) scale(1.01); box-shadow: rgba(50,50,93,0.25) 0px 30px 60px -20px, rgba(0,0,0,0.1) 0px 15px 30px -10px; }
  .agent-card:hover .avatar { transform: rotate(360deg); }
  .agent-more-link:hover { text-decoration: underline; }
  input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.2); }
  .chip:hover { background: rgba(72,66,233,0.12); transform: translateY(-2px); }
  .integration-item:hover { transform: translateY(-4px); box-shadow: rgba(50,50,93,0.15) 0px 15px 30px -15px; }
  .footer-col a:hover { color: var(--accent); }
  .cta-section .btn-primary:hover { box-shadow: rgba(255,255,255,0.3) 0px 10px 20px -8px; }
  #chat-launcher:hover { transform: scale(1.1); animation-play-state: paused; }
  #greeting-bubble .greeting-close:hover { background: var(--border); color: var(--heading); }
  .chat-download:hover { opacity: 1; }
  .slot-day-header:hover { border-color: var(--accent); }
  .slot-box:hover { border-color: var(--accent); background: rgba(72,66,233,0.1); transform: translateY(-1px); }
  .cal-nav button:not(:disabled):hover { border-color: var(--accent); color: var(--accent); }
  .cal-day.available:hover { background: var(--border-light); }
  .cal-time-slot:hover { border-color: var(--accent); color: var(--accent); }
}