/* ============================================================
   GC Lab — Design System v2 · DARK-FIRST
   Editorial · monocromo + chartreuse · 2026
   ============================================================ */

:root {
    /* ---------- Background scale (dark) ---------- */
    --paper:      #0e0e0c;     /* fondo principal — warm near-black */
    --paper-soft: #16161412;   /* surface elevada (sutil) */
    --paper-card: #18181612;   /* cards */
    --paper-deep: #000000;     /* secciones de showcase ultra-oscuras */

    /* ---------- Text scale (claro sobre dark) ---------- */
    --ink:        #f4f3eb;     /* texto principal y headings */
    --ink-soft:   #d8d8d0;     /* body párrafos */
    --ink-muted:  #b0b0a8;     /* muted — NUNCA bajar de aquí */
    --ink-faint:  #7c7c74;     /* solo para hints / captions opcionales */

    /* ---------- Accent ---------- */
    --volt:       #d4ff3a;     /* chartreuse eléctrico — único acento */
    --volt-deep:  #b8e62a;     /* hover/active */
    --volt-tint:  rgba(212, 255, 58, 0.15);
    --on-volt:    #0a0a0a;     /* texto SOBRE chartreuse — siempre dark */

    /* semánticos */
    --ok:     #6fd47b;
    --warn:   #ffb84a;
    --danger: #ff7670;

    /* ---------- Lines / borders ---------- */
    --line:        rgba(255, 255, 255, 0.10);
    --line-strong: rgba(255, 255, 255, 0.22);
    --line-bold:   rgba(255, 255, 255, 0.45);

    /* ---------- Tipografía ---------- */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

    --tracking-tight:  -0.04em;
    --tracking-snug:   -0.02em;
    --tracking-normal: 0;
    --tracking-wide:   0.06em;
    --tracking-mono:   0.02em;

    /* ---------- Escala fluida ---------- */
    --t-display:       clamp(3rem, 8vw, 6.5rem);
    --t-h1:            clamp(2.25rem, 5vw, 4rem);
    --t-h2:            clamp(1.75rem, 3.2vw, 2.6rem);
    --t-h3:            1.35rem;
    --t-h4:            1.1rem;
    --t-body:          1rem;
    --t-body-l:        1.125rem;
    --t-small:         0.875rem;
    --t-mono-eyebrow:  0.78rem;
    --t-caption:       0.78rem;

    /* ---------- Layout ---------- */
    --content-max:    1280px;
    --prose-max:      720px;
    --gutter:         clamp(1.25rem, 3vw, 2.5rem);
    --section-py:     clamp(4rem, 8vw, 8rem);
    --section-py-tight: clamp(2.5rem, 5vw, 4rem);

    /* ---------- Bordes ---------- */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   12px;
    --radius-pill: 999px;

    /* ---------- Easing ---------- */
    --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --t-fast:      120ms;
    --t-base:      220ms;
    --t-slow:      420ms;
}