/* ==========================================================================
   AstraCursus — design tokens (revisione visiva "tre notti")
   Palette di marca e scala tipografica/spaziale invariate.
   Le tre varianti grafiche (Osservatorio, Costellazione, Aurora) ridefiniscono
   SOLO i token semantici, mai la palette di marca. Tutte e tre partono dalla
   vecchia variante "Cosmico" (l'unica gradita), declinandola in tre direzioni
   scure coerenti e distinte per composizione, non per semplice scambio colore.
   ========================================================================== */

:root {
  /* --- palette di marca (invariata su tutte le varianti) --- */
  --brand-midnight: #142e3a;
  --brand-aurora: #4fb9ad;
  --brand-amber: #e9b47a;
  --brand-slate: #536674;
  --brand-arctic: #f4f7f5;

  /* --- tipografia --- */
  --font-head: "Manrope", "Segoe UI", system-ui, sans-serif;
  --font-body: "Source Sans 3", "Segoe UI", system-ui, sans-serif;

  /* --- scala spaziatura 4/8/12/16/24/32/48/64/96 --- */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-6: 24px;
  --s-8: 32px;
  --s-12: 48px;
  --s-16: 64px;
  --s-24: 96px;

  /* --- layout --- */
  --container: 1200px;
  --gutter: 24px;
  --radius-card: 16px;
  --radius-btn: 8px;
  --focus: #7fe3d6;
  --focus-ring: 3px;
  --danger: #ffb4ab;
}

/* --- tipografia fluida, entro le soglie del brief --- */
:root {
  --fs-h1: clamp(2.125rem, 1.35rem + 3.2vw, 3.75rem); /* 34 -> 60 */
  --fs-h2: clamp(1.625rem, 1.22rem + 1.7vw, 2.5rem);  /* 26 -> 40 */
  --fs-h3: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);  /* 20 -> 26 */
  --fs-body: clamp(1rem, 0.97rem + 0.15vw, 1.125rem);
  --lh-body: 1.6;
  --fs-label: 0.8125rem;
  --measure: 68ch;
}

/* ==========================================================================
   TEMA 1 — "Osservatorio"  (baseline affinata del vecchio Cosmico)
   Notte profonda, orbite, annotazioni e pannelli dati. Accento aurora.
   Composizione asimmetrica: testo a sinistra, strumentazione a destra.
   ========================================================================== */
:root,
[data-variant="osservatorio"] {
  --surface: #0b1c24;
  --surface-2: rgba(255, 255, 255, 0.05);
  --surface-3: #0f2731;
  --ink: #eaf2f0;
  --ink-muted: #a7bcc1;
  --line: rgba(79, 185, 173, 0.22);
  --line-strong: rgba(79, 185, 173, 0.46);
  --accent: var(--brand-aurora);
  --accent-2: var(--brand-amber);
  --btn-bg: var(--brand-aurora);
  --btn-fg: #08222a;
  --btn-dark-bg: rgba(255, 255, 255, 0.1);
  --btn-dark-fg: #ffffff;
  --radius: 16px;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
  --hero-pad: clamp(56px, 8vw, 128px);
  --focus: #7fe3d6;
  --danger: #ffb4ab;
  --glow-a: rgba(79, 185, 173, 0.22);
  --glow-b: rgba(233, 180, 122, 0.14);
  --grid-line: rgba(79, 185, 173, 0.10);
  --accent-ink: #06232b;
}

/* ==========================================================================
   TEMA 2 — "Costellazione"  (conoscenza collegata all'applicazione)
   Notte blu più fredda e regolare, nodi e legami sempre visibili, impulsi
   lungo le connessioni. Hero centrata e diagramma a tutta larghezza.
   ========================================================================== */
[data-variant="costellazione"] {
  --surface: #0a1622;
  --surface-2: rgba(140, 176, 210, 0.06);
  --surface-3: #0d2030;
  --ink: #eef4f8;
  --ink-muted: #9db4c6;
  --line: rgba(126, 176, 200, 0.24);
  --line-strong: rgba(126, 190, 208, 0.5);
  --accent: var(--brand-aurora);
  --accent-2: var(--brand-amber);
  --btn-bg: var(--brand-aurora);
  --btn-fg: #06202a;
  --btn-dark-bg: rgba(255, 255, 255, 0.1);
  --btn-dark-fg: #ffffff;
  --radius: 14px;
  --shadow: 0 20px 55px rgba(0, 0, 0, 0.5);
  --hero-pad: clamp(60px, 8vw, 120px);
  --focus: #8fe0d4;
  --danger: #ffb4ab;
  --glow-a: rgba(79, 185, 173, 0.18);
  --glow-b: rgba(126, 176, 210, 0.16);
  --grid-line: rgba(126, 176, 200, 0.12);
  --accent-ink: #05212b;
  --link-tint: rgba(79, 185, 173, 0.5);
}

/* ==========================================================================
   TEMA 3 — "Aurora"  (flusso editoriale, luce che scorre)
   Notte calda, nastri d'ombra e d'oro, ritmo di lettura più ampio e arioso.
   Composizione larga con testata generosa e traccia fluida.
   ========================================================================== */
[data-variant="aurora"] {
  --surface: #0c1a22;
  --surface-2: rgba(233, 180, 122, 0.07);
  --surface-3: #13252f;
  --ink: #f4f7f3;
  --ink-muted: #c0cbc5;
  --line: rgba(233, 180, 122, 0.24);
  --line-strong: rgba(233, 180, 122, 0.46);
  --accent: var(--brand-amber);
  --accent-2: var(--brand-aurora);
  --btn-bg: var(--brand-amber);
  --btn-fg: #2a1c0c;
  --btn-dark-bg: rgba(255, 255, 255, 0.12);
  --btn-dark-fg: #ffffff;
  --radius: 20px;
  --shadow: 0 22px 60px rgba(0, 0, 0, 0.48);
  --hero-pad: clamp(64px, 9vw, 150px);
  --focus: #ffd9a8;
  --danger: #ffc4b8;
  --glow-a: rgba(233, 180, 122, 0.20);
  --glow-b: rgba(79, 185, 173, 0.12);
  --grid-line: rgba(233, 180, 122, 0.10);
  --accent-ink: #2a1c0c;
  --link-tint: rgba(233, 180, 122, 0.5);
}