/* ==========================================================================
   Sudota Intelligence — homepage
   Maps v2's layout tokens onto the production design system
   (Sora / Inter / IBM Plex Mono, #1D6AE5, purple = AI only, cool slate).
   ========================================================================== */

:root {
  /* surfaces — cool slate, never warm gray */
  --paper:    #F8FAFC;
  --panel:    #FFFFFF;
  --panel-2:  #F1F5F9;
  --panel-3:  #E2E8F0;
  --card:     #FFFFFF;
  --inkband:  #0F172A;
  /* film register — the homepage film header band.
     Deliberately deeper than --inkband so the video layer reads as environment. */
  --void:       #060B14;
  --film-ink:   #E9F1FB;
  --film-ink-2: #A7B9CF;
  /* Ghost outline on the film band. #22395D was 1.7:1 on --void;
     #647996 is 4.4:1 on --void and 3.8:1 on the bright film composite. */
  --film-line:  #647996;

  --ink:      #0F172A;
  --ink-2:    #334155;
  /* WCAG 1.4.3: --muted and --muted-2 are body-scale text on --paper/--panel.
     The v3 values (#94A3B8 / #64748B) measured 2.4:1 and 4.5:1; these are
     4.6:1 and 7.2:1. --muted-faint is the decorative-only step (icons,
     rules, disabled states) and must never carry copy. */
  --muted:    #64748B;
  --muted-2:  #475569;
  --muted-faint: #94A3B8;

  --line:      #E2E8F0;
  --line-soft: #F1F5F9;
  --line-ink:  rgba(15, 23, 42, .45);

  /* brand primary — not v2 electric indigo */
  --volt:      #1D6AE5;
  --volt-hover:#1558C0;
  --volt-soft: rgba(29, 106, 229, .08);
  /* --volt is a fill/accent colour (4.43:1 as small bold text on --volt-soft).
     Small text that has to read blue uses this instead: 5.9:1 on --volt-soft,
     6.6:1 on white (WCAG 1.4.3 AA). */
  --volt-ink:  #1558C0;
  --acid:      #ECFDF5;
  --acid-ink:  #059669;
  --pass:      #059669;
  /* --pass is a fill/dot/border colour (3.8:1 as text on white). Text that
     has to read green uses these instead: 5.5:1 on white, 9.3:1 on inkband. */
  --pass-ink:     #047857;
  --pass-on-dark: #34D399;
  --fail:      #DC2626;
  --ai:        #7C3AED;

  /* citation classes — product homepage */
  --cite-kb:    #059669;
  --cite-voice: #7C3AED;
  --cite-play:  #1D6AE5;
  --cite-web:   #D97706;

  --font-display: 'Sora', sans-serif;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans TC', 'Noto Sans SC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  --mono: 'IBM Plex Mono', 'SF Mono', ui-monospace, monospace;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --shell: 1200px;
  --nav-h: 60px;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; }
a { color: inherit; }
h1, h2, h3, h4, p, figure, dl, dd { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
::selection { background: var(--volt-soft); color: var(--ink); }

:focus-visible {
  outline: 2px solid var(--volt);
  outline-offset: 2px;
}

.shell {
  width: min(var(--shell), 100% - 48px);
  margin-inline: auto;
}

.mono { font-family: var(--mono); }
.num { font-variant-numeric: tabular-nums; }

.gridlines { display: none; }

main, footer { position: relative; z-index: 1; }

.rv {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  transition-delay: var(--d, 0ms);
}
.rv.is-in { opacity: 1; transform: none; }

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