/*
 * JaimeDiaz.TV Portal Reboot
 * Core tokens — v1.0.0
 */

:root {
    /* =====================================================
       Brand palette
       ===================================================== */

    --jdr-navy-950: #10133f;
    --jdr-navy-900: #15194d;
    --jdr-navy-800: #202763;
    --jdr-blue-700: #255f9d;
    --jdr-blue-600: #3478b9;
    --jdr-blue-500: #4b91cf;

    --jdr-sky-100: #dcefff;
    --jdr-sky-75: #e9f5ff;
    --jdr-sky-50: #f4faff;

    --jdr-orange-700: #d94d21;
    --jdr-orange-600: #ef6335;
    --jdr-orange-500: #ff774d;
    --jdr-orange-400: #ff9f43;
    --jdr-orange-100: #ffe9df;

    --jdr-red-600: #c92537;
    --jdr-red-500: #dc3042;
    --jdr-red-100: #fde8eb;

    --jdr-white: #ffffff;
    --jdr-ivory: #fffdfa;
    --jdr-canvas: var(--jdr-sky-100);
    --jdr-surface: var(--jdr-white);
    --jdr-surface-soft: var(--jdr-sky-50);

    --jdr-text-primary: #11182e;
    --jdr-text-secondary: #4d5f78;
    --jdr-text-muted: #71829a;

    --jdr-border-soft: rgba(37, 95, 157, 0.13);
    --jdr-border-medium: rgba(37, 95, 157, 0.22);

    /* =====================================================
       Layout
       ===================================================== */

    --jdr-site-width: 1240px;
    --jdr-content-width: 1120px;
    --jdr-rail-width: 300px;
    --jdr-page-padding: 20px;
    --jdr-grid-gap: 22px;

    /* Future advertising skins */

    --jdr-skin-width: 150px;
    --jdr-skin-gap: 20px;

    /* =====================================================
       Radius
       ===================================================== */

    --jdr-radius-xs: 6px;
    --jdr-radius-sm: 10px;
    --jdr-radius-md: 16px;
    --jdr-radius-lg: 22px;
    --jdr-radius-xl: 30px;
    --jdr-radius-pill: 999px;

    /* =====================================================
       Shadows
       ===================================================== */

    --jdr-shadow-sm:
        0 6px 20px rgba(16, 19, 63, 0.07);

    --jdr-shadow-md:
        0 14px 38px rgba(16, 19, 63, 0.13);

    --jdr-shadow-header:
        0 16px 42px rgba(16, 19, 63, 0.19);

    /* =====================================================
       Motion
       ===================================================== */

    --jdr-duration-fast: 150ms;
    --jdr-duration-normal: 240ms;
    --jdr-duration-slow: 360ms;

    --jdr-ease-standard: cubic-bezier(0.2, 0, 0, 1);

    /* =====================================================
       Layering
       ===================================================== */

    --jdr-z-header: 300;
    --jdr-z-overlay: 400;
    --jdr-z-menu: 500;
}

@media (max-width: 767px) {
    :root {
        --jdr-page-padding: 14px;
    }
}

/* =========================================================
   JaimeDiaz.TV original petroleum palette — v1.1.0
   ========================================================= */

:root {
    --jdr-navy-950: #0e3038;
    --jdr-navy-900: #123b46;
    --jdr-navy-800: #1d5660;

    --jdr-blue-700: #286a73;
    --jdr-blue-600: #3b7b82;
    --jdr-blue-500: #5b9298;

    --jdr-sky-100: #e8f2f3;
    --jdr-sky-75: #eff7f7;
    --jdr-sky-50: #f7fbfa;

    --jdr-orange-700: #b9432c;
    --jdr-orange-600: #d84f34;
    --jdr-orange-500: #e85d3f;
    --jdr-orange-400: #ef795f;
    --jdr-orange-100: #fbe8e2;

    --jdr-red-600: #ad2033;
    --jdr-red-500: #c92a3d;
    --jdr-red-100: #f9e6e9;

    --jdr-white: #ffffff;
    --jdr-ivory: #fffdf7;
    --jdr-canvas: #e8f2f3;
    --jdr-surface: #ffffff;
    --jdr-surface-soft: #f7fbfa;

    --jdr-text-primary: #132b34;
    --jdr-text-secondary: #4e6970;
    --jdr-text-muted: #74898e;

    --jdr-border-soft: rgba(18, 59, 70, 0.12);
    --jdr-border-medium: rgba(18, 59, 70, 0.22);

    --jdr-shadow-sm:
        0 6px 20px rgba(14, 48, 56, 0.07);

    --jdr-shadow-md:
        0 14px 38px rgba(14, 48, 56, 0.12);

    --jdr-shadow-header:
        0 16px 42px rgba(14, 48, 56, 0.18);
}

/* =========================================================
   Official JaimeDiaz.TV palette — v1.2.0
   Petroleum + soft gold
   ========================================================= */

:root {
    /* Identidad */
    --jdr-navy-950: #0d3038;
    --jdr-navy-900: #123b46;
    --jdr-navy-800: #1b515b;

    --jdr-blue-700: #286873;
    --jdr-blue-600: #3a7981;
    --jdr-blue-500: #60949a;

    /* Fondos */
    --jdr-sky-100: #edf3f2;
    --jdr-sky-75: #f3f7f6;
    --jdr-sky-50: #f8fbfa;

    /* Acento dorado */
    --jdr-orange-700: #987126;
    --jdr-orange-600: #b48730;
    --jdr-orange-500: #c89a3d;
    --jdr-orange-400: #d8ae58;
    --jdr-orange-100: #f5ead2;

    /* Estados críticos: no decorativos */
    --jdr-red-600: #a92335;
    --jdr-red-500: #c72e42;
    --jdr-red-100: #f9e7ea;

    --jdr-white: #ffffff;
    --jdr-ivory: #fffdf8;
    --jdr-canvas: #edf3f2;
    --jdr-surface: #ffffff;
    --jdr-surface-soft: #f8fbfa;

    --jdr-text-primary: #182a31;
    --jdr-text-secondary: #51686e;
    --jdr-text-muted: #788b90;

    --jdr-border-soft: rgba(18, 59, 70, 0.12);
    --jdr-border-medium: rgba(18, 59, 70, 0.21);

    --jdr-shadow-sm:
        0 6px 20px rgba(13, 48, 56, 0.07);

    --jdr-shadow-md:
        0 14px 38px rgba(13, 48, 56, 0.12);

    --jdr-shadow-header:
        0 16px 42px rgba(13, 48, 56, 0.18);
}