/* ==========================================================================
   Páginas públicas — 3 superficies de sección (fuente de verdad)
   --------------------------------------------------------------------------
   REGLA DE ORO
   - Solo hay 3 fondos de sección en las páginas públicas:
       --pub-bg-dark   #060d1c
       --pub-bg-blue   linear-gradient(125deg, #0753c8 0%, #092c78 100%)
       --pub-bg-light  #ffffff
   - Todo bloque con fondo propio usa la clase .landing-block + un modificador
     semántico (.landing-block--<bloque>). No se pone color de fondo suelto.
   - Los acentos de texto / botones / íconos quedan fuera de esta regla.

   Documentación:
   - Regla agente: .cursor/rules/public-pages-colors.mdc
   - Spec:        docs/specs/landing.md  (sección "Sistema de fondos por bloque")
   ========================================================================== */

[data-surface="public"] {
    /* ── Las 3 superficies de sección ──────────────────────────────────────── */
    --pub-bg-dark: #060d1c;
    --pub-bg-blue: linear-gradient(125deg, #0753c8 0%, #092c78 100%);
    --pub-bg-light: #ffffff;

    /* ── Texto por superficie ──────────────────────────────────────────────── */
    --pub-text-on-dark: #ffffff;
    --pub-text-on-dark-muted: #aebcd1;
    --pub-text-on-blue: #ffffff;
    --pub-text-on-blue-muted: #c3d8fb;
    --pub-text-on-light: #142340;
    --pub-text-on-light-muted: #66758c;

    /* ── Glows decorativos (derivados del azul, no son fondos de sección) ──── */
    --pub-glow: rgb(7 83 200 / 0.30);
    --pub-glow-soft: rgb(7 83 200 / 0.16);

    /* Alias de compatibilidad para páginas que aún leen tokens --landing-*. */
    --landing-blue: #0753c8;
    --landing-blue-deep: #092c78;
    --landing-ink-900: var(--pub-bg-dark);
    --landing-ink-800: var(--pub-bg-dark);
    --landing-ink-700: var(--pub-bg-dark);
    --landing-glow: var(--pub-glow);
    --landing-glow-soft: var(--pub-glow-soft);
}

/* Base compartida por todo bloque con fondo propio. */
.landing-block {
    position: relative;
    isolation: isolate;
    /* `background` (shorthand) acepta color Y gradiente vía --block-bg. */
    background: var(--block-bg, var(--pub-bg-dark));
}

/* Glow decorativo consistente y por bloque. */
.landing-block::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: var(--block-glow, none);
}

/* ── Filosofía ───────────────────────────────────────────────────────────── */
.landing-block--filosofia {
    --block-bg: var(--pub-bg-light);
    --block-glow:
        radial-gradient(ellipse 70% 75% at 85% 0%, var(--pub-glow-soft), transparent 72%),
        radial-gradient(ellipse 55% 60% at 8% 100%, var(--pub-glow-soft), transparent 74%);
}

/* ── Logros ──────────────────────────────────────────────────────────────── */
.landing-block--logros {
    --block-bg: var(--pub-bg-blue);
    --block-glow: radial-gradient(ellipse 75% 70% at 12% 0%, rgb(255 255 255 / 0.16), transparent 74%);
}

/* ── Episodios ───────────────────────────────────────────────────────────── */
.landing-block--episodios {
    --block-bg: var(--pub-bg-dark);
    --block-glow:
        radial-gradient(ellipse 85% 65% at 50% 100%, var(--pub-glow), transparent 76%),
        radial-gradient(ellipse 50% 50% at 6% 0%, var(--pub-glow-soft), transparent 72%);
}

/* ── Círculo de crecimiento ──────────────────────────────────────────────── */
.landing-block--circulo {
    --block-bg: var(--pub-bg-light);
    --block-glow: radial-gradient(ellipse 70% 70% at 90% 12%, var(--pub-glow-soft), transparent 74%);
}

/* ── CTA — bloque protagonista (único con azul pleno) ────────────────────── */
.landing-block--cta {
    --block-bg: var(--pub-bg-blue);
    --block-glow: radial-gradient(ellipse 75% 95% at 50% 0%, rgb(255 255 255 / 0.14), transparent 65%);
}

/* ── Logo sobre superficies claras ───────────────────────────────────────── */
/* El mark (assets/img/fdc-mark-160.webp) es blanco monocromo y no existe version
   oscura. Sobre superficies claras se invierte por CSS conservando su alfa, y se
   neutraliza el ring para que no quede un halo azul invertido. La clase duplicada
   sube la especificidad para ganarle a las utilidades ring-* sin depender del orden. */
[data-surface="public"] .pub-logo-invert.pub-logo-invert {
    filter: invert(1);
    box-shadow: none;
}
