/*
 * Alteria — design tokens.
 * Traducción 1:1 del sistema de la maqueta (src/styles.css, definido en oklch).
 * Única fuente de color, tipografía y forma del theme: ningún widget escribe un hex.
 */

:root {
  /* ── Color ─────────────────────────────────────────────
     El valor oklch original de la maqueta va como comentario. */
  --alteria-background:        #071A22; /* oklch(.206 .030 228) */
  --alteria-foreground:        #F4F8F8; /* oklch(.976 .004 197) */

  --alteria-surface:           #0F2E3B; /* oklch(.285 .043 229) */
  --alteria-surface-2:         #0B222C; /* oklch(.239 .035 229) */

  --alteria-primary:           #45CD81; /* oklch(.756 .161 155) — verde Alteria */
  --alteria-primary-hover:     #2FB86B; /* oklch(.693 .161 153) */
  --alteria-primary-foreground:#08222C; /* oklch(.227 .032 229) */

  --alteria-secondary:         #123B4D; /* oklch(.333 .055 231) */
  --alteria-muted-foreground:  #93AFB6; /* oklch(.735 .032 215) */
  --alteria-accent:            #207082; /* oklch(.506 .079 216) */
  --alteria-accent-teal:       #35A5A5; /* oklch(.661 .098 195) */
  --alteria-emerald:           #45CD81; /* señales positivas — verde marca */
  --alteria-destructive:       #E5484D; /* oklch(.620 .210 25) */

  --alteria-border:            #1B4A5A; /* oklch(.384 .057 224) */
  --alteria-ring:              #45CD81;

  /* Mezclas usadas de forma recurrente (equivalentes a las opacidades de la maqueta). */
  --alteria-primary-08:        rgba(69, 205, 129, .08);
  --alteria-primary-10:        rgba(69, 205, 129, .10);
  --alteria-primary-15:        rgba(69, 205, 129, .15);
  --alteria-primary-20:        rgba(69, 205, 129, .20);
  --alteria-primary-40:        rgba(69, 205, 129, .40);
  --alteria-primary-60:        rgba(69, 205, 129, .60);
  --alteria-emerald-10:        rgba(69, 205, 129, .10);
  --alteria-emerald-30:        rgba(69, 205, 129, .30);
  --alteria-accent-08:         rgba(32, 112, 130, .08);

  /* ── Tipografía ───────────────────────────────────────── */
  --alteria-font-display: "League Spartan", "Inter", ui-sans-serif, system-ui, sans-serif;
  --alteria-font-body:    "League Spartan", "Inter", ui-sans-serif, system-ui, sans-serif;

  --alteria-fs-hero:  40px;             /* 60px en desktop, ver base.css */
  --alteria-fs-h2:    30px;
  --alteria-fs-h3:    18px;
  --alteria-fs-body:  16px;             /* 18px en desktop */
  --alteria-fs-lead:  18px;
  --alteria-fs-sm:    14px;
  --alteria-fs-xs:    12px;

  --alteria-lh-tight: 1.05;
  --alteria-lh-snug:  1.2;
  --alteria-lh-body:  1.625;
  --alteria-tracking-tight: -.02em;
  --alteria-tracking-wide:  .2em;

  /* ── Forma y espacio ──────────────────────────────────── */
  --alteria-radius:     .75rem;          /* 12px */
  --alteria-radius-sm:  calc(var(--alteria-radius) - 4px);
  --alteria-radius-md:  calc(var(--alteria-radius) - 2px);
  --alteria-radius-lg:  var(--alteria-radius);
  --alteria-radius-xl:  calc(var(--alteria-radius) + 4px);
  --alteria-radius-2xl: calc(var(--alteria-radius) + 8px);

  --alteria-container:      72rem;       /* max-w-6xl = 1152px */
  --alteria-container-sm:   64rem;       /* max-w-5xl */
  --alteria-container-xs:   48rem;       /* max-w-3xl */
  --alteria-gutter:         1rem;
  --alteria-gutter-lg:      1.5rem;
  --alteria-space-section:  5rem;        /* 7rem en desktop */

  /* ── Gradientes y sombras ─────────────────────────────── */
  --alteria-gradient-primary: linear-gradient(135deg, #45CD81, #35A5A5);
  --alteria-gradient-aurora:
    radial-gradient(circle at 30% 40%, rgba(53, 165, 165, .55), transparent 60%),
    radial-gradient(circle at 70% 55%, rgba(69, 205, 129, .40), transparent 60%);
  --alteria-shadow-glow: 0 20px 60px -20px rgba(69, 205, 129, .45);
  --alteria-shadow-card: 0 18px 50px -24px rgba(0, 0, 0, .9);
}

/* Breakpoints del proyecto (coinciden con los de Elementor):
   sm 640px · md 768px · lg 1024px */