/* SEMAI — Motion
   Precise, quiet, engineered. Short durations, confident easing. Fades and
   small translations; no bounce, no theatrics. Motion should feel like a
   system settling into place, not an effect. */

:root {
  /* Durations */
  --dur-instant: 80ms;   /* @kind other */
  --dur-fast: 140ms;     /* @kind other */
  --dur-base: 200ms;     /* @kind other */
  --dur-slow: 320ms;     /* @kind other */
  --dur-slower: 520ms;   /* @kind other */

  /* Easing */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);       /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);    /* @kind other */
  --ease-standard: cubic-bezier(0.4, 0.0, 0.2, 1);  /* @kind other */
  --ease-entrance: cubic-bezier(0.16, 1, 0.3, 1);   /* @kind other */

  /* Common transitions */
  --t-colors: color var(--dur-fast) var(--ease-out),
              background-color var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out); /* @kind other */
  --t-transform: transform var(--dur-base) var(--ease-out);
  --t-all: all var(--dur-base) var(--ease-out); /* @kind other */
}

@keyframes semai-fade-up {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes semai-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes semai-caret {
  0%, 45% { opacity: 1; }
  55%, 100% { opacity: 0; }
}
@keyframes semai-pulse {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 1; }
}
@keyframes semai-scan {
  from { background-position: 0 0; }
  to   { background-position: 0 -40px; }
}

/* ---- Expressive brand motion (Linear/Vercel-inspired, still restrained) ---- */

/* Slow drifting aurora glow behind hero content */
@keyframes semai-aurora {
  0%   { transform: translate3d(-6%, -3%, 0) scale(1);   opacity: 0.9; }
  50%  { transform: translate3d(6%, 4%, 0) scale(1.15);  opacity: 1; }
  100% { transform: translate3d(-6%, -3%, 0) scale(1);   opacity: 0.9; }
}

/* Grid mesh slowly panning — the "system is alive" texture */
@keyframes semai-grid-pan {
  from { background-position: 0 0, 0 0; }
  to   { background-position: 40px 40px, 40px 40px; }
}

/* Shimmer sweep across the violet part of the logo / accents */
@keyframes semai-shimmer {
  0%   { background-position: -180% 0; }
  100% { background-position: 180% 0; }
}

/* Gentle vertical float for hero product shots */
@keyframes semai-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}

/* Sygnet "listening" ring — slow rotate */
@keyframes semai-ring-rotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Expanding radar ping */
@keyframes semai-ping {
  0%   { transform: scale(0.6); opacity: 0.55; }
  70%  { opacity: 0; }
  100% { transform: scale(2.4); opacity: 0; }
}

/* Typing caret blink (block) */
@keyframes semai-blink {
  0%, 49%  { opacity: 1; }
  50%, 100%{ opacity: 0; }
}

/* Marquee for the ecosystem strip */
@keyframes semai-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Counter-rotate (rings spinning the other way) */
@keyframes semai-ring-rotate-rev {
  from { transform: rotate(360deg); }
  to   { transform: rotate(0deg); }
}

/* Orbiting satellite dot around the sygnet */
@keyframes semai-orbit {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Slow conic sweep for the Vercel-style halo */
@keyframes semai-conic-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Soft glow breathing for the hero mark */
@keyframes semai-breathe {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50%      { opacity: 1;    transform: scale(1.06); }
}

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