/*
 * Noticias CFS Jumilla
 * Mini Fase 22.2
 *
 * Dirección visual:
 * diario deportivo local, compacto y funcional.
 *
 * Display:
 *   Barlow Condensed
 *
 * Lectura/UI:
 *   Source Sans 3
 */

:root {
    --cfs-font-sans:
        "Source Sans 3",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Arial,
        Helvetica,
        sans-serif;

    --cfs-font-display:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        Helvetica,
        sans-serif;

    --cfs-font-editorial:
        "Source Sans 3",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Arial,
        sans-serif;
}

/* =========================================================
   BASE
   ========================================================= */

.cfs-site {
    font-family: var(--cfs-font-sans) !important;
    font-size: 1rem;
    line-height: 1.5;
    font-kerning: normal;
    text-rendering: optimizeLegibility;
}

.cfs-site-main {
    font-family: var(--cfs-font-sans);
}

/* =========================================================
   TITULARES
   ========================================================= */

.cfs-site .cfs-site-main h1,
.cfs-site .cfs-site-main h2,
.cfs-site .cfs-site-main h3,
.cfs-site .cfs-site-main h4,
.cfs-site .cfs-site-main h5,
.cfs-site .cfs-site-main h6 {
    font-family: var(--cfs-font-display) !important;
    font-style: normal !important;
    text-transform: none !important;
    text-wrap: balance;
}

/*
 * H1:
 * antes llegaba visualmente a una escala exagerada.
 * Ahora queda en rango de diario deportivo.
 */

.cfs-site .cfs-site-main h1 {
    font-size: clamp(2.45rem, 4vw, 3.65rem) !important;
    font-weight: 800 !important;
    letter-spacing: -.018em !important;
    line-height: .98 !important;
}

/*
 * Titulares de sección
 */

.cfs-site .cfs-site-main h2 {
    font-size: clamp(1.65rem, 2.35vw, 2.05rem) !important;
    font-weight: 750 !important;
    letter-spacing: -.012em !important;
    line-height: 1 !important;
}

.cfs-site .cfs-site-main h3 {
    font-size: clamp(1.3rem, 1.8vw, 1.55rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.008em !important;
    line-height: 1.05 !important;
}

.cfs-site .cfs-site-main h4,
.cfs-site .cfs-site-main h5,
.cfs-site .cfs-site-main h6 {
    font-weight: 700 !important;
    line-height: 1.1 !important;
}

/* =========================================================
   HERO / PORTADA
   ========================================================= */

/*
 * Blindaje específico para el gran titular de portada.
 * Aunque cfs-home.css tenga una escala anterior más fuerte,
 * esta capa final manda.
 */

.cfs-site .cfs-home-hero h1,
.cfs-site .cfs-home-lead h1,
.cfs-site .cfs-home-hero__title,
.cfs-site .cfs-home-lead__title {
    width: 100%;
    max-width: none;

    font-family: var(--cfs-font-display) !important;
    font-size: clamp(2.65rem, 4.6vw, 4rem) !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
    line-height: .94 !important;
    text-transform: none !important;
    text-wrap: wrap;
}

/*
 * Cuando la portada todavía no tiene noticia publicada,
 * mantenemos impacto sin convertir el mensaje en un cartel gigante.
 */

.cfs-site .cfs-home-empty h1,
.cfs-site .cfs-home-empty__title {
    width: 100%;
    max-width: none;

    font-family: var(--cfs-font-display) !important;
    font-size: clamp(2.55rem, 4.2vw, 3.7rem) !important;
    font-weight: 800 !important;
    letter-spacing: -.018em !important;
    line-height: .95 !important;
    text-wrap: wrap;
}

/* =========================================================
   MASTHEAD
   ========================================================= */

.cfs-site-header__inner {
    min-height: 7rem !important;

    grid-template-columns:
        auto minmax(0, 1fr) !important;

    gap: clamp(.9rem, 2vw, 1.4rem) !important;

    padding-block:
        clamp(1rem, 1.7vw, 1.35rem) !important;
}

.cfs-site-brand {
    max-width: 62rem;
}

.cfs-site-brand__crest {
    width: clamp(3.8rem, 5.2vw, 4.8rem) !important;
    height: clamp(3.8rem, 5.2vw, 4.8rem) !important;
}

.cfs-site-brand__eyebrow {
    margin-bottom: .18rem !important;

    font-family: var(--cfs-font-sans) !important;
    font-size: .67rem !important;
    font-weight: 800 !important;
    letter-spacing: .11em !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
}

.cfs-site-brand__link {
    display: inline-block;

    font-family: var(--cfs-font-display) !important;
    font-size: clamp(2.5rem, 4.3vw, 3.75rem) !important;
    font-style: normal !important;
    font-weight: 800 !important;

    letter-spacing: -.015em !important;
    line-height: .88 !important;

    text-decoration: none !important;
    text-transform: uppercase !important;
}

.cfs-site-brand__strapline {
    max-width: 48rem;

    margin-top: .48rem !important;

    font-family: var(--cfs-font-sans) !important;
    font-size: .9rem !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
}

/*
 * Fase 22 eliminó físicamente este bloque.
 * Defensa adicional ante cachés antiguas.
 */

.cfs-site-edition {
    display: none !important;
}

/* =========================================================
   NAVEGACIÓN
   ========================================================= */

.cfs-site-nav__link,
.cfs-site-nav__summary,
.cfs-site-nav__dropdown-link {
    font-family: var(--cfs-font-display) !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    letter-spacing: .025em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

.cfs-site-utility,
.cfs-site-utility a {
    font-family: var(--cfs-font-sans) !important;
}

.cfs-site-utility__edition,
.cfs-site-utility__account {
    font-size: .72rem !important;
}

/* =========================================================
   BREADCRUMBS / MICROCOPY
   ========================================================= */

.cfs-breadcrumbs,
.cfs-breadcrumbs a {
    font-family: var(--cfs-font-sans) !important;
    font-size: .7rem !important;
    font-weight: 700 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
}

/* =========================================================
   LABELS EDITORIALES
   ========================================================= */

.cfs-site-main [class*="eyebrow"],
.cfs-site-main [class*="kicker"],
.cfs-site-main [class*="label"],
.cfs-site-main [class*="meta"] {
    font-family: var(--cfs-font-sans);
}

/* =========================================================
   CUERPO / LECTURA
   ========================================================= */

.cfs-site-main p,
.cfs-site-main li,
.cfs-site-main blockquote,
.cfs-site-main .cfs-article-body,
.cfs-site-main .cfs-article-lead,
.cfs-site-main .cfs-home-lead__summary,
.cfs-site-main .cfs-home-lead__deck,
.cfs-site-main .cfs-archive-lead__summary,
.cfs-site-main .cfs-institutional-copy {
    font-family: var(--cfs-font-sans) !important;
}

.cfs-site-main p {
    font-size: 1rem;
    line-height: 1.5;
}

/* =========================================================
   DEPORTES / MÓDULOS HOME
   ========================================================= */

.cfs-site .cfs-home-sports h2,
.cfs-site .cfs-home-sports h3,
.cfs-site .cfs-home-latest h2,
.cfs-site .cfs-home-latest h3,
.cfs-site .cfs-home-poll h2,
.cfs-site .cfs-home-poll h3,
.cfs-site [class*="competition"] h2,
.cfs-site [class*="competition"] h3 {
    font-family: var(--cfs-font-display) !important;
}

/*
 * Límites visuales para que las cajas secundarias no compitan con
 * el titular principal.
 */

.cfs-site .cfs-home-sports h2,
.cfs-site .cfs-home-latest h2 {
    font-size: clamp(1.6rem, 2vw, 1.9rem) !important;
}

.cfs-site .cfs-home-sports h3,
.cfs-site .cfs-home-poll h2,
.cfs-site .cfs-home-poll h3 {
    font-size: clamp(1.4rem, 1.75vw, 1.7rem) !important;
}

/* =========================================================
   FOOTER
   ========================================================= */

.cfs-site-footer {
    font-family: var(--cfs-font-sans);
}

.cfs-site-footer__name {
    font-family: var(--cfs-font-display) !important;
    font-size: clamp(1.8rem, 2.6vw, 2.35rem) !important;
    font-weight: 750 !important;
    letter-spacing: -.01em !important;
    line-height: .95 !important;
    text-transform: none !important;
}

.cfs-site-footer__heading,
.cfs-site-footer__kicker {
    font-family: var(--cfs-font-sans) !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
}

.cfs-site-footer__heading {
    font-size: .75rem !important;
    letter-spacing: .08em !important;
}

.cfs-site-footer__kicker {
    font-size: .68rem !important;
    letter-spacing: .1em !important;
}

.cfs-site-footer__description,
.cfs-site-footer__links {
    font-family: var(--cfs-font-sans) !important;
}

/* =========================================================
   CONTROLES
   ========================================================= */

.cfs-site button,
.cfs-site input,
.cfs-site select,
.cfs-site textarea,
.cfs-site label {
    font-family: var(--cfs-font-sans) !important;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 800px) {
    .cfs-site-header__inner {
        min-height: auto !important;

        gap: .8rem !important;
        padding-block: .95rem !important;
    }

    .cfs-site-brand__crest {
        width: 3.6rem !important;
        height: 3.6rem !important;
    }

    .cfs-site-brand__link {
        font-size: clamp(2.2rem, 6.5vw, 3rem) !important;
    }

    .cfs-site-brand__strapline {
        font-size: .84rem !important;
    }

    .cfs-site .cfs-site-main h1,
    .cfs-site .cfs-home-hero h1,
    .cfs-site .cfs-home-lead h1,
    .cfs-site .cfs-home-hero__title,
    .cfs-site .cfs-home-lead__title,
    .cfs-site .cfs-home-empty h1,
    .cfs-site .cfs-home-empty__title {
        font-size: clamp(2.35rem, 7vw, 3.35rem) !important;
    }
}

/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 520px) {
    .cfs-site {
        font-size: .96rem;
    }

    .cfs-site-header__inner {
        gap: .65rem !important;
        padding-block: .8rem !important;
    }

    .cfs-site-brand__crest {
        width: 3rem !important;
        height: 3rem !important;
    }

    .cfs-site-brand__eyebrow {
        font-size: .56rem !important;
        letter-spacing: .08em !important;
    }

    .cfs-site-brand__link {
        font-size: clamp(1.9rem, 8.7vw, 2.45rem) !important;
        line-height: .9 !important;
    }

    .cfs-site-brand__strapline {
        display: none !important;
    }

    .cfs-site .cfs-site-main h1,
    .cfs-site .cfs-home-hero h1,
    .cfs-site .cfs-home-lead h1,
    .cfs-site .cfs-home-hero__title,
    .cfs-site .cfs-home-lead__title,
    .cfs-site .cfs-home-empty h1,
    .cfs-site .cfs-home-empty__title {
        max-width: none;

        font-size: clamp(2.15rem, 10.2vw, 2.85rem) !important;
        line-height: .96 !important;
    }

    .cfs-site .cfs-site-main h2 {
        font-size: clamp(1.5rem, 7vw, 1.85rem) !important;
    }

    .cfs-site .cfs-site-main h3 {
        font-size: clamp(1.25rem, 6vw, 1.5rem) !important;
    }

    .cfs-site-nav__link,
    .cfs-site-nav__summary,
    .cfs-site-nav__dropdown-link {
        font-size: .98rem !important;
    }
}

@media (max-width: 360px) {
    .cfs-site-brand__eyebrow {
        display: none !important;
    }

    .cfs-site-brand__link {
        font-size: 1.9rem !important;
    }

    .cfs-site .cfs-site-main h1,
    .cfs-site .cfs-home-hero h1,
    .cfs-site .cfs-home-lead h1,
    .cfs-site .cfs-home-hero__title,
    .cfs-site .cfs-home-lead__title,
    .cfs-site .cfs-home-empty h1,
    .cfs-site .cfs-home-empty__title {
        font-size: 2.15rem !important;
    }
}

/* =========================================================
   ACCESIBILIDAD
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .cfs-site *,
    .cfs-site *::before,
    .cfs-site *::after {
        scroll-behavior: auto !important;
    }
}
