/* ============================================================
   variables.css — Tokens do design system do Colégio Ibiracy
   Paleta: dark-amethyst #271B47 · white #FFFFFF · white-2 #FEFEFE
          lavender-blush #F6EBEA · dark-wine #872024
   ============================================================ */
:root {
  /* ---- Paleta institucional ---- */
  --bg: #FEFEFE;              /* white-2 — fundo principal */
  --bg-2: #F6EBEA;            /* lavender-blush — fundo secundário */
  --surface: #FFFFFF;         /* white — cartões */
  --primary: #271B47;         /* dark-amethyst — ações primárias, títulos, seção escura */
  --primary-dark: #1C1235;    /* amethyst profundo — hover, rodapé, CTA final */
  --secondary: #872024;       /* dark-wine — acento (frisos, rótulos, detalhes) */
  --on-dark-accent: #EBA7AB;  /* vinho claro — acento legível sobre fundo escuro */
  --accent: #D9CDE8;          /* lavanda — bordas de hover e decoração */
  --wine-tint: #F7E6E6;       /* vinho pálido — painéis temáticos */
  --heading: #271B47;
  --text: #514B63;            /* contraste ~8.2:1 sobre o fundo */
  --muted: #767083;           /* contraste ~4.7:1 sobre o fundo */
  --border: #E7E1EE;
  --danger: #872024;
  --danger-bg: #F9ECEC;
  --danger-border: #E7B9BC;
  --on-primary: #FFFFFF;

  /* ---- Tipografia ---- */
  --font-display: "DM Serif Display", Georgia, "Times New Roman", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;

  /* ---- Escala de espaçamento (16–96px) ---- */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 48px;
  --space-6: 64px;
  --space-7: 96px;

  /* ---- Raios de borda ---- */
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 32px;
  --r-pill: 999px;

  /* ---- Sombras suaves em tom amethyst ---- */
  --shadow-sm: 0 1px 2px rgba(39, 27, 71, 0.06), 0 2px 10px rgba(39, 27, 71, 0.05);
  --shadow-md: 0 6px 16px rgba(39, 27, 71, 0.08), 0 18px 44px rgba(39, 27, 71, 0.08);
  --shadow-lg: 0 14px 34px rgba(39, 27, 71, 0.12), 0 36px 80px rgba(39, 27, 71, 0.14);

  /* ---- Layout ---- */
  --container: 1180px;
  --header-h: 76px;

  /* ---- Movimento ---- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast: 160ms;
  --dur: 280ms;
  --dur-slow: 520ms;
}
