/* ============================================================
   SACRED LIGHT THEME — Fundación Internacional Liberación y Vida
   Custom theme derived from the foundation's logo identity
   theme-factory skill: custom theme "Sacred Light"
   ============================================================ */

:root {
    /* ── Brand Colors (extracted from logo) ───────────────── */
    --color-primary:       #1E3D8F;   /* Azul real del anillo del logo */
    --color-primary-dark:  #152D6B;   /* Hover / footer */
    --color-primary-light: #2A55C0;   /* Acentos, borders */
    --color-gold:          #C8920A;   /* Dorado del sol */
    --color-gold-light:    #E5AD2A;   /* Hover dorado */
    --color-gold-dim:      #8A640A;   /* Dorado oscuro, texto sobre dorado */
    --color-dark:          #0D0D12;   /* Negro del logo (hero, footer) */
    --color-dark-soft:     #111827;   /* Azul noche (ministerios bg) */
    --color-dark-card:     #1a2235;   /* Tarjetas sobre fondo oscuro */
    --color-white:         #FFFFFF;
    --color-off-white:     #F5F3EE;   /* Crema cálida (secciones alternas) */
    --color-text:          #1C1C1C;
    --color-text-muted:    #6B7280;
    --color-text-light:    rgba(255,255,255,0.80);

    /* ── Typography (frontend-design: distinctive, non-generic) ── */
    --font-display: 'Cinzel', 'Trajan Pro', Georgia, serif;   /* Títulos principales */
    --font-body:    'Lato', 'Open Sans', system-ui, sans-serif;

    /* ── Type Scale ───────────────────────────────────────── */
    --text-xs:   0.75rem;
    --text-sm:   0.875rem;
    --text-base: 1rem;
    --text-lg:   1.125rem;
    --text-xl:   1.25rem;
    --text-2xl:  1.5rem;
    --text-3xl:  1.875rem;
    --text-4xl:  2.25rem;
    --text-5xl:  3rem;
    --text-6xl:  3.75rem;

    /* ── Spacing Scale ────────────────────────────────────── */
    --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;
    --space-32: 8rem;

    /* ── Layout ───────────────────────────────────────────── */
    --container-max: 1200px;
    --navbar-height: 76px;

    /* ── Borders & Radius ─────────────────────────────────── */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   16px;
    --radius-xl:   24px;
    --radius-full: 9999px;

    /* ── Shadows ──────────────────────────────────────────── */
    --shadow-sm:   0 1px 4px rgba(0,0,0,.12);
    --shadow-card: 0 4px 24px rgba(30,61,143,.12);
    --shadow-lg:   0 8px 48px rgba(30,61,143,.18);
    --shadow-gold: 0 0 32px rgba(200,146,10,.25);
    --shadow-dark: 0 8px 40px rgba(0,0,0,.40);

    /* ── Gradients ────────────────────────────────────────── */
    --gradient-gold:    linear-gradient(90deg, transparent, #C8920A 50%, transparent);
    --gradient-hero:    linear-gradient(160deg, #0D0D12 0%, #111827 60%, #1a2235 100%);
    --gradient-primary: linear-gradient(135deg, #152D6B 0%, #1E3D8F 100%);

    /* ── Transitions ──────────────────────────────────────── */
    --transition-fast:   150ms ease;
    --transition-base:   300ms ease;
    --transition-slow:   500ms cubic-bezier(0.4, 0, 0.2, 1);

    /* ── Z-index Stack ────────────────────────────────────── */
    --z-base:     1;
    --z-dropdown: 100;
    --z-navbar:   200;
    --z-lightbox: 300;
}
