/* ==========================================================================
   ISAC — Design Tokens
   Base do Media Kit. Cores oficiais conforme "Manual de marca ISAC".
   Nenhum valor de cor da marca pode ser alterado por aproximação.
   ========================================================================== */

:root {
  /* --- Cores oficiais da marca ------------------------------------------ */
  --brand-azul: #005AA9;          /* RGB 0 90 169   | CMYK 100 70 0 0 */
  --brand-azul-2: #0092D5;        /* RGB 0 146 213  | CMYK 100 25 0 0 */
  --brand-cinza: #606062;         /* RGB 96 96 98   | CMYK 64 56 53 28 */

  /* --- Paleta funcional derivada ---------------------------------------- */
  --color-primary: var(--brand-azul);
  --color-primary-dark: #00447F;
  --color-primary-darker: #00305C;
  --color-primary-light: #E6F0F8;
  --color-primary-tint: #CCE0F0;

  --color-secondary: var(--brand-azul-2);
  --color-secondary-dark: #0077AE;
  --color-secondary-light: #E5F5FC;

  --color-neutral: var(--brand-cinza);
  --color-neutral-dark: #2E2E30;
  --color-neutral-mid: #8A8A8D;
  --color-neutral-light: #E4E6E9;
  --color-neutral-lighter: #F2F3F5;

  /* Cores de apoio, uso restrito a indicadores e categorias */
  --color-success: #0E8A72;
  --color-success-light: #E7F5F1;
  --color-warning: #B4590B;
  --color-warning-light: #FBEDE2;
  --color-accent: #D54300;
  --color-accent-light: #FCECE5;

  /* --- Superfícies e texto ---------------------------------------------- */
  --color-bg: #FFFFFF;
  --color-surface: #F7F9FC;
  --color-surface-2: #EEF3F9;
  --color-border: var(--color-neutral-light);

  --color-text: #1F2A37;
  --color-text-muted: var(--color-neutral);
  --color-text-inverse: #FFFFFF;
  --color-text-on-dark-muted: #C5DAEC;

  /* --- Gradientes institucionais ---------------------------------------- */
  --gradient-brand: linear-gradient(135deg, var(--color-primary-darker) 0%, var(--color-primary) 45%, var(--color-secondary) 100%);
  --gradient-brand-soft: linear-gradient(135deg, var(--color-primary-light) 0%, var(--color-secondary-light) 100%);

  /* --- Tipografia -------------------------------------------------------- */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display: 'Outfit', 'Inter', system-ui, sans-serif;

  /* Escala fluida: min em 360px, max em 1280px */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: clamp(1.0625rem, 0.4vw + 0.95rem, 1.125rem);
  --text-lg: clamp(1.25rem, 0.8vw + 1.05rem, 1.5rem);
  --text-xl: clamp(1.625rem, 1.6vw + 1.25rem, 2.25rem);
  --text-2xl: clamp(2rem, 2.6vw + 1.4rem, 3rem);
  --text-3xl: clamp(2.375rem, 3.6vw + 1.55rem, 3.75rem);

  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-normal: 1.65;

  --tracking-tight: -0.02em;
  --tracking-wide: 0.08em;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  /* --- Espaçamento, escala base-4 --------------------------------------- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Respiro vertical de seção, responsivo */
  --section-y: clamp(3.5rem, 7vw, 6.5rem);

  /* --- Layout ------------------------------------------------------------ */
  --container-max: 1240px;
  --container-narrow: 760px;
  --container-pad: clamp(1rem, 4vw, 1.5rem);
  --header-height: 76px;

  /* --- Bordas ------------------------------------------------------------ */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* --- Sombras, tingidas com o azul da marca ----------------------------- */
  --shadow-xs: 0 1px 2px rgba(0, 68, 127, 0.06);
  --shadow-sm: 0 2px 8px rgba(0, 68, 127, 0.07);
  --shadow-md: 0 8px 24px rgba(0, 68, 127, 0.09);
  --shadow-lg: 0 18px 48px rgba(0, 68, 127, 0.13);
  --shadow-ring: 0 0 0 3px rgba(0, 146, 213, 0.28);

  /* --- Movimento --------------------------------------------------------- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 150ms var(--ease);
  --transition: 250ms var(--ease);
  --transition-slow: 400ms var(--ease-out);

  /* --- Camadas ----------------------------------------------------------- */
  --z-dropdown: 200;
  --z-header: 300;
  --z-drawer: 400;
  --z-overlay: 390;

  /* --- Compatibilidade com a nomenclatura antiga ------------------------- */
  --font-family-sans: var(--font-sans);
  --font-family-display: var(--font-display);
  --font-size-xs: var(--text-xs);
  --font-size-sm: var(--text-sm);
  --font-size-base: var(--text-base);
  --font-size-md: var(--text-md);
  --font-size-lg: var(--text-lg);
  --font-size-xl: var(--text-xl);
  --font-size-2xl: var(--text-2xl);
  --font-weight-regular: var(--weight-regular);
  --font-weight-medium: var(--weight-medium);
  --font-weight-semibold: var(--weight-semibold);
  --font-weight-bold: var(--weight-bold);
  --spacing-1: var(--space-1);
  --spacing-2: var(--space-2);
  --spacing-3: var(--space-3);
  --spacing-4: var(--space-4);
  --spacing-5: var(--space-5);
  --spacing-6: var(--space-6);
  --spacing-8: var(--space-8);
  --spacing-12: var(--space-12);
  --spacing-16: var(--space-16);
  --border-radius-sm: var(--radius-sm);
  --border-radius-md: var(--radius-md);
  --border-radius-lg: var(--radius-lg);
  --border-radius-full: var(--radius-full);
  --transition-normal: var(--transition);
}
