/* ===========================================================================
   AERONOVA — Component classes used by airshipsnova.com.
   Lifted verbatim from the design-system components (Button, Eyebrow, Badge)
   so the page stays static (no React build) for the Cloudflare Pages handoff.
   Source of truth: AERONOVA Design System /components/*.
   =========================================================================== */

/* --- Button --------------------------------------------------------------- */
.an-btn{
  --_bg: var(--violet-700); --_fg: var(--text-primary); --_bd: var(--border-strong);
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  font-family:var(--font-body); font-weight:var(--fw-semibold);
  letter-spacing:.005em; line-height:1; white-space:nowrap;
  border:1px solid var(--_bd); background:var(--_bg); color:var(--_fg);
  border-radius:var(--radius-sm); cursor:pointer;
  padding:0 1.25em; height:2.75em; font-size:var(--text-body);
  transition: transform var(--dur-fast) var(--ease-out),
              background var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out), filter var(--dur-base) var(--ease-out);
}
.an-btn:active{ transform: translateY(0) scale(.98); }
.an-btn:focus-visible{ outline:2px solid var(--focus-ring); outline-offset:2px; }
.an-btn[disabled]{ opacity:.42; cursor:not-allowed; pointer-events:none; }
.an-btn svg{ width:1.15em; height:1.15em; }
.an-btn--primary{ --_bg: transparent; --_fg: var(--violet-900); --_bd: transparent;
  background-image: var(--gradient-dawn); box-shadow: var(--glow-dawn); }
.an-btn--primary:hover{ filter:brightness(1.05); box-shadow:0 14px 48px -12px rgba(233,153,109,.6); }
.an-btn--secondary{ --_bg: transparent; --_fg: var(--text-primary); --_bd: var(--border-strong); }
.an-btn--secondary:hover{ background: rgba(255,255,255,.06); border-color: var(--text-secondary); }
.an-btn--ghost{ --_bg: transparent; --_fg: var(--text-secondary); --_bd: transparent; padding-inline:.6em; }
.an-btn--ghost:hover{ color: var(--text-primary); background: rgba(255,255,255,.05); }
.an-btn--solid{ --_bg: var(--brand-violet); --_fg:#fff; --_bd: transparent; }
.an-btn--solid:hover{ filter:brightness(1.12); }
.an-btn--sm{ height:2.25em; font-size:var(--text-sm); padding-inline:1em; }
.an-btn--lg{ height:3.25em; font-size:var(--text-lead); padding-inline:1.6em; border-radius:var(--radius-md); }
.an-btn--block{ display:flex; width:100%; }

/* --- Badge ---------------------------------------------------------------- */
.an-badge{
  --_bg: rgba(255,255,255,.07); --_fg: var(--text-secondary); --_bd: var(--border-hairline);
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--font-mono); font-size:var(--text-xs); font-weight:var(--fw-medium);
  letter-spacing:.06em; text-transform:uppercase; line-height:1;
  padding:.5em .85em; border-radius:var(--radius-pill);
  background:var(--_bg); color:var(--_fg); border:1px solid var(--_bd); white-space:nowrap;
}
.an-badge__dot{ width:.5em; height:.5em; border-radius:50%; background:currentColor; flex:0 0 auto; }
.an-badge--live .an-badge__dot{ box-shadow:0 0 0 0 currentColor; animation:an-pulse 2s var(--ease-out) infinite; }
@keyframes an-pulse{ 0%{box-shadow:0 0 0 0 rgba(79,178,134,.5)} 70%{box-shadow:0 0 0 .5em rgba(79,178,134,0)} 100%{box-shadow:0 0 0 0 rgba(79,178,134,0)} }
@media (prefers-reduced-motion: reduce){ .an-badge--live .an-badge__dot{ animation:none } }
.an-badge--accent{ --_bg: rgba(233,153,109,.14); --_fg: var(--dawn-peach); --_bd: rgba(233,153,109,.30); }
.an-badge--info{   --_bg: rgba(111,183,230,.14); --_fg: var(--sky-blue);   --_bd: rgba(111,183,230,.30); }
.an-badge--success{--_bg: rgba(79,178,134,.14);  --_fg: var(--success);    --_bd: rgba(79,178,134,.30); }
.an-badge--solid{  --_bg: var(--brand-violet);   --_fg:#fff;               --_bd: transparent; }

/* --- Eyebrow (an-eyebrow alias kept for parity with DS) ------------------- */
.an-eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--font-mono); font-size:var(--text-eyebrow); font-weight:var(--fw-medium);
  letter-spacing:.22em; text-transform:uppercase; color:var(--text-muted);
}
.an-eyebrow::before{ content:""; width:1.75rem; height:1px; background:var(--dawn-peach); flex:0 0 auto; }
.an-eyebrow--bare::before{ display:none; }