/* Additions on top of the original compiled stylesheet (app.css). */

/* Modals */
.modal.is-open { display: flex; }
.modal .modal-panel { animation: modal-in .22s ease-out; }
@keyframes modal-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
body.modal-open { overflow: hidden; }
[data-success].is-visible { display: flex; }

/* Honeypot field — invisible to people, visible to bots */
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

/* Header: compact glass bar once the page is scrolled (the original toggled these classes in React) */
#site-header.is-scrolled { padding-top: .75rem; padding-bottom: .75rem; }
#site-header.is-scrolled #site-nav {
  background: rgba(8, 15, 32, .75);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border-color: hsla(0, 0%, 100%, .08);
  box-shadow: 0 8px 40px -12px rgba(0, 0, 0, .6);
}
#site-nav { border: 1px solid transparent; }
#site-nav a[data-nav-link].is-active { color: #fff; background: rgba(255, 255, 255, .05); }

/* Platform diagram hover glow */
.pf-card:hover { transform: scale(1.05); box-shadow: 0 0 20px var(--glow) !important; }
.pf-center:hover { transform: scale(1.1); }
.pf-center:hover > div { box-shadow: 0 0 30px var(--glow) !important; }

/* Workflow engine */
[data-wf-step] { transition: background .5s, border-color .5s, box-shadow .5s, transform .5s; }
[data-wf-step].is-active { transform: scale(1.02); }
[data-wf-line] { transition: background .5s; }

/* Muted AI call: freeze the waveform */
#voice-agent.is-muted [style*="animation"] { animation-play-state: paused !important; }

/* Simple content pages (privacy, terms, cookies, 404) */
.prose-page h2 { font-size: 1.25rem; font-weight: 700; color: #fff; margin: 2rem 0 .75rem; }
.prose-page p, .prose-page li { color: #94a3b8; line-height: 1.75; font-size: .95rem; }
.prose-page ul { list-style: disc; padding-left: 1.25rem; margin: .5rem 0 1rem; }
.prose-page a { color: #38bdf8; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
