/* =============================================================
   CVC MAGAZINE EDITORIAL TYPOGRAPHY V1
   Primera etapa: entradas individuales en staging.
   ============================================================= */

body.single-post {
    --cvc-editorial-display:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif;

    --cvc-editorial-body:
        "Plus Jakarta Sans",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    --cvc-editorial-ink: #17171c;
    --cvc-editorial-copy: #35353a;
}

/* Base tipográfica de la entrada. */
body.single-post,
body.single-post button,
body.single-post input,
body.single-post select,
body.single-post textarea {
    font-family: var(--cvc-editorial-body);
}

/* Titular principal con personalidad de magazine. */
body.single-post .entry-title {
    color: var(--cvc-editorial-ink);
    font-family: var(--cvc-editorial-display);
    font-size: clamp(34px, 4.5vw, 62px);
    font-style: normal;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: .98;
    text-wrap: balance;
}

/* Bajada o primer párrafo destacado. */
body.single-post .entry-content > p.has-large-font-size {
    color: #29292e;
    font-family: var(--cvc-editorial-body);
    font-size: clamp(20px, 2.1vw, 25px);
    font-weight: 400;
    letter-spacing: -.018em;
    line-height: 1.48;
}

/* Lectura del cuerpo. */
body.single-post .entry-content {
    color: var(--cvc-editorial-copy);
    font-family: var(--cvc-editorial-body);
}

body.single-post .entry-content p,
body.single-post .entry-content li {
    font-family: inherit;
    font-size: clamp(18px, 1.5vw, 21px);
    font-weight: 400;
    letter-spacing: -.012em;
    line-height: 1.72;
}

/* Subtítulos editoriales. */
body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.single-post .entry-content h4 {
    color: var(--cvc-editorial-ink);
    font-family: var(--cvc-editorial-display);
    font-style: normal;
    font-weight: 800;
    letter-spacing: -.035em;
    line-height: 1.08;
    text-wrap: balance;
}

body.single-post .entry-content h2 {
    font-size: clamp(27px, 3vw, 40px);
    margin-block: 1.65em .65em;
}

body.single-post .entry-content h3 {
    font-size: clamp(23px, 2.4vw, 32px);
    margin-block: 1.5em .6em;
}

/* Negritas visibles sin endurecer todo el párrafo. */
body.single-post .entry-content strong,
body.single-post .entry-content b {
    color: #202025;
    font-weight: 700;
}

/* Metadatos, autor, fecha y categorías. */
body.single-post .entry-meta,
body.single-post .entry-meta a,
body.single-post .entry-footer,
body.single-post .entry-footer a {
    font-family: var(--cvc-editorial-body);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -.01em;
}

/* Módulos y títulos secundarios de la entrada. */
body.single-post .entry-content .wp-block-heading,
body.single-post #lo-mas-visto-ahora h2,
body.single-post #lo-mas-visto-ahora .main-section__title {
    font-family: var(--cvc-editorial-display);
}

/* Ajuste específico para teléfonos. */
@media (max-width: 680px) {
    body.single-post .entry-title {
        font-size: clamp(32px, 9.3vw, 43px);
        letter-spacing: -.042em;
        line-height: 1;
    }

    body.single-post .entry-content > p.has-large-font-size {
        font-size: 20px;
        line-height: 1.5;
    }

    body.single-post .entry-content p,
    body.single-post .entry-content li {
        font-size: 18px;
        line-height: 1.7;
    }

    body.single-post .entry-content h2 {
        font-size: 28px;
    }

    body.single-post .entry-content h3 {
        font-size: 24px;
    }
}

/* =============================================================
   CVC MAGAZINE — BARLOW CONDENSED TEST V1
   Ajuste de titulares para la alternativa tipográfica.
   ============================================================= */

body.single-post .entry-title {
    font-family:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif;

    font-size: clamp(38px, 5vw, 68px);
    font-weight: 700;
    letter-spacing: -.022em;
    line-height: .94;
}

body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.single-post .entry-content h4 {
    font-family:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif;

    font-weight: 700;
    letter-spacing: -.015em;
    line-height: 1;
}

/*
 * La bajada mantiene Plus Jakarta Sans, pero pierde parte
 * del peso para no competir con el titular.
 */
body.single-post .entry-content > p.has-large-font-size,
body.single-post .entry-content > p.has-large-font-size strong {
    font-family: var(--cvc-editorial-body);
    font-size: clamp(19px, 2vw, 23px);
    font-weight: 600;
    letter-spacing: -.012em;
    line-height: 1.48;
}

@media (max-width: 680px) {
    body.single-post .entry-title {
        font-size: clamp(39px, 11.2vw, 49px);
        letter-spacing: -.018em;
        line-height: .93;
    }

    body.single-post .entry-content > p.has-large-font-size,
    body.single-post .entry-content > p.has-large-font-size strong {
        font-size: 19px;
        font-weight: 600;
        line-height: 1.48;
    }

    body.single-post .entry-content h2 {
        font-size: 30px;
    }

    body.single-post .entry-content h3 {
        font-size: 26px;
    }
}

/* =============================================================
   CVC MAGAZINE TYPOGRAPHY FINAL V2
   Jerarquía definitiva para entradas individuales.
   ============================================================= */

/*
 * H1 — Titular principal.
 * Barlow 600 mantiene impacto sin cerrar demasiado las letras.
 */
body.single-post .entry-header .entry-title,
body.single-post h1.entry-title {
    font-family:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif !important;

    font-size: clamp(38px, 5vw, 68px);
    font-style: normal;
    font-weight: 600 !important;
    letter-spacing: -.018em;
    line-height: .94;
    text-wrap: balance;
}

/*
 * Bajada editorial.
 * Plus Jakarta 600 crea una transición entre titular y cuerpo.
 */
body.single-post .entry-content > p.has-large-font-size,
body.single-post .entry-content > p.has-large-font-size strong,
body.single-post .entry-content > p.has-large-font-size b {
    font-family:
        "Plus Jakarta Sans",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif !important;

    font-size: clamp(19px, 2vw, 23px);
    font-style: normal;
    font-weight: 600 !important;
    letter-spacing: -.012em;
    line-height: 1.48;
}

/*
 * Cuerpo de la noticia.
 */
body.single-post .entry-content {
    font-family:
        "Plus Jakarta Sans",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

body.single-post .entry-content p:not(.has-large-font-size),
body.single-post .entry-content li {
    font-family: inherit;
    font-size: clamp(18px, 1.5vw, 21px);
    font-style: normal;
    font-weight: 400;
    letter-spacing: -.012em;
    line-height: 1.72;
}

/*
 * Negritas interiores.
 */
body.single-post .entry-content p:not(.has-large-font-size) strong,
body.single-post .entry-content p:not(.has-large-font-size) b,
body.single-post .entry-content li strong,
body.single-post .entry-content li b {
    color: #202025;
    font-family: inherit;
    font-style: normal;
    font-weight: 700;
}

/*
 * H2, H3 y H4.
 * Conservan más peso que el H1 para marcar cortes editoriales.
 */
body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.single-post .entry-content h4 {
    color: #17171c;
    font-family:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif !important;

    font-style: normal;
    font-weight: 700 !important;
    letter-spacing: -.012em;
    line-height: 1;
    text-wrap: balance;
}

body.single-post .entry-content h2 {
    font-size: clamp(29px, 3vw, 40px);
    margin-block: 1.6em .65em;
}

body.single-post .entry-content h3 {
    font-size: clamp(25px, 2.5vw, 33px);
    margin-block: 1.5em .6em;
}

body.single-post .entry-content h4 {
    font-size: clamp(22px, 2.1vw, 28px);
    margin-block: 1.4em .55em;
}

/*
 * Metadatos y elementos complementarios.
 */
body.single-post .entry-meta,
body.single-post .entry-meta a,
body.single-post .entry-footer,
body.single-post .entry-footer a {
    font-family:
        "Plus Jakarta Sans",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-weight: 400;
}

/*
 * Adaptación móvil.
 */
@media (max-width: 680px) {
    body.single-post .entry-header .entry-title,
    body.single-post h1.entry-title {
        font-size: clamp(39px, 11.2vw, 49px);
        font-weight: 600 !important;
        letter-spacing: -.014em;
        line-height: .94;
    }

    body.single-post .entry-content > p.has-large-font-size,
    body.single-post .entry-content > p.has-large-font-size strong,
    body.single-post .entry-content > p.has-large-font-size b {
        font-size: 19px;
        font-weight: 600 !important;
        letter-spacing: -.01em;
        line-height: 1.5;
    }

    body.single-post .entry-content p:not(.has-large-font-size),
    body.single-post .entry-content li {
        font-size: 18px;
        font-weight: 400;
        line-height: 1.7;
    }

    body.single-post .entry-content h2 {
        font-size: 30px;
        font-weight: 700 !important;
        line-height: 1;
    }

    body.single-post .entry-content h3 {
        font-size: 26px;
        font-weight: 700 !important;
    }

    body.single-post .entry-content h4 {
        font-size: 23px;
        font-weight: 700 !important;
    }
}

/* =============================================================
   CVC MAGAZINE EDITORIAL LINKS V1
   Enlaces limpios, sin subrayado tradicional.
   ============================================================= */

body.single-post {
    --cvc-link-red: #e52834;
    --cvc-link-red-dark: #c81927;
    --cvc-link-yellow: #ffd536;
    --cvc-link-yellow-soft: #fff2a8;
}

/*
 * Enlaces editoriales dentro de párrafos y listas.
 * La especificidad elimina el subrayado heredado del tema.
 */
body.single-post .entry-content p a,
body.single-post .entry-content li a {
    background-color: transparent;
    border: 0;
    border-radius: 4px;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    box-shadow: none;
    color: var(--cvc-link-red);
    display: inline;
    font-family: inherit;
    font-style: inherit;
    font-weight: 600;
    margin-inline: -2px;
    padding: 1px 2px;
    text-decoration: none !important;
    text-decoration-color: transparent !important;
    text-decoration-line: none !important;
    text-shadow: none;
    transition:
        background-color .18s ease,
        color .18s ease,
        box-shadow .18s ease;
}

/*
 * Evita que el navegador cambie los enlaces visitados a morado.
 */
body.single-post .entry-content p a:visited,
body.single-post .entry-content li a:visited {
    color: var(--cvc-link-red);
    text-decoration: none !important;
}

/*
 * Interacción editorial amarilla.
 */
body.single-post .entry-content p a:hover,
body.single-post .entry-content li a:hover {
    background-color: var(--cvc-link-yellow);
    color: #17171c;
    text-decoration: none !important;
}

/*
 * Respuesta táctil.
 */
body.single-post .entry-content p a:active,
body.single-post .entry-content li a:active {
    background-color: var(--cvc-link-yellow-soft);
    color: #17171c;
    text-decoration: none !important;
}

/*
 * Accesibilidad mediante teclado.
 */
body.single-post .entry-content p a:focus-visible,
body.single-post .entry-content li a:focus-visible {
    background-color: var(--cvc-link-yellow);
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px var(--cvc-link-red);
    color: #17171c;
    outline: 0;
    text-decoration: none !important;
}

/*
 * Las imágenes enlazadas no reciben color, fondo ni padding.
 */
body.single-post .entry-content figure a,
body.single-post .entry-content figure a:hover,
body.single-post .entry-content figure a:focus,
body.single-post .entry-content figure a:active,
body.single-post .entry-content .wp-block-image a,
body.single-post .entry-content .wp-block-gallery a {
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    color: inherit;
    margin: 0;
    padding: 0;
    text-decoration: none !important;
}

/*
 * Mantiene el mismo tratamiento en teléfonos.
 */
@media (max-width: 680px) {
    body.single-post .entry-content p a,
    body.single-post .entry-content li a {
        border-radius: 3px;
        margin-inline: -1px;
        padding: 1px;
    }
}

/*
 * Los dispositivos táctiles no deben conservar un hover pegado.
 */
@media (hover: none) {
    body.single-post .entry-content p a:hover,
    body.single-post .entry-content li a:hover {
        background-color: transparent;
        color: var(--cvc-link-red);
    }

    body.single-post .entry-content p a:active,
    body.single-post .entry-content li a:active {
        background-color: var(--cvc-link-yellow);
        color: #17171c;
    }
}

/* =============================================================
   CVC MAGAZINE BODY AND CATEGORY FINAL V1
   Cuerpo estable a 19px y categoría editorial amarilla.
   ============================================================= */

body.single-post {
    --cvc-category-yellow: #ffd536;
    --cvc-category-yellow-hover: #ffe46e;
    --cvc-category-ink: #17171c;
}

/*
 * Tamaño definitivo del cuerpo.
 */
body.single-post .entry-content p:not(.has-large-font-size),
body.single-post .entry-content li {
    font-size: 19px !important;
    font-weight: 400;
    letter-spacing: -.012em;
    line-height: 1.72;
}

/*
 * Negritas interiores.
 */
body.single-post .entry-content p:not(.has-large-font-size) strong,
body.single-post .entry-content p:not(.has-large-font-size) b,
body.single-post .entry-content li strong,
body.single-post .entry-content li b {
    font-size: inherit;
    font-weight: 700;
}

/*
 * Píldora de categoría.
 * Se incluyen diferentes selectores porque Bloglo puede cambiar
 * ligeramente el marcado según la plantilla de la entrada.
 */
body.single-post .entry-header a[rel~="category"],
body.single-post .entry-header .cat-links a,
body.single-post .entry-header .post-categories a,
body.single-post .entry-header .entry-categories a,
body.single-post .entry-header .bloglo-entry-meta .cat-links a,
body.single-post .entry-header .bloglo-entry-meta-elements .cat-links a {
    align-items: center;
    background: var(--cvc-category-yellow) !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    color: var(--cvc-category-ink) !important;
    display: inline-flex;
    font-family:
        "Plus Jakarta Sans",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif !important;
    font-size: 12px !important;
    font-style: normal;
    font-weight: 700 !important;
    justify-content: center;
    letter-spacing: -.01em;
    line-height: 1 !important;
    margin: 0 6px 8px 0;
    min-height: 29px;
    padding: 7px 13px !important;
    text-decoration: none !important;
    text-transform: none;
    transition:
        background-color .18s ease,
        transform .18s ease;
}

/*
 * Interacción de la categoría.
 */
body.single-post .entry-header a[rel~="category"]:hover,
body.single-post .entry-header .cat-links a:hover,
body.single-post .entry-header .post-categories a:hover,
body.single-post .entry-header .entry-categories a:hover {
    background: var(--cvc-category-yellow-hover) !important;
    color: var(--cvc-category-ink) !important;
    text-decoration: none !important;
    transform: translateY(-1px);
}

body.single-post .entry-header a[rel~="category"]:active,
body.single-post .entry-header .cat-links a:active,
body.single-post .entry-header .post-categories a:active,
body.single-post .entry-header .entry-categories a:active {
    background: var(--cvc-category-yellow) !important;
    transform: translateY(0);
}

/*
 * Foco accesible.
 */
body.single-post .entry-header a[rel~="category"]:focus-visible,
body.single-post .entry-header .cat-links a:focus-visible,
body.single-post .entry-header .post-categories a:focus-visible,
body.single-post .entry-header .entry-categories a:focus-visible {
    background: var(--cvc-category-yellow) !important;
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px #e52834 !important;
    color: var(--cvc-category-ink) !important;
    outline: 0;
}

/*
 * Ajustes para teléfono.
 */
@media (max-width: 680px) {
    body.single-post .entry-content p:not(.has-large-font-size),
    body.single-post .entry-content li {
        font-size: 19px !important;
        line-height: 1.7;
    }

    body.single-post .entry-header a[rel~="category"],
    body.single-post .entry-header .cat-links a,
    body.single-post .entry-header .post-categories a,
    body.single-post .entry-header .entry-categories a {
        font-size: 12px !important;
        min-height: 28px;
        padding: 7px 12px !important;
    }
}

/* =============================================================
   CVC MAGAZINE MAIN CATEGORY SELECTOR V2
   Selector basado en la estructura real de la entrada.
   ============================================================= */

/*
 * Categoría principal ubicada sobre el H1.
 * La condición article.bloglo-article evita afectar las categorías
 * de Lo más visto, noticias relacionadas y otras tarjetas.
 */
body.single-post
article.bloglo-article
.post-category
.cat-links
a[rel~="category"] {
    align-items: center;
    background-color: #ffd536 !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    color: #17171c !important;
    display: inline-flex;
    font-family:
        "Plus Jakarta Sans",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif !important;
    font-size: 12px !important;
    font-style: normal;
    font-weight: 700 !important;
    justify-content: center;
    letter-spacing: -.01em;
    line-height: 1 !important;
    margin: 0 6px 10px 0 !important;
    min-height: 29px;
    padding: 7px 13px !important;
    text-decoration: none !important;
    text-shadow: none !important;
    text-transform: none !important;
    transition:
        background-color .18s ease,
        transform .18s ease;
}

body.single-post
article.bloglo-article
.post-category
.cat-links
a[rel~="category"]:visited {
    background-color: #ffd536 !important;
    color: #17171c !important;
}

body.single-post
article.bloglo-article
.post-category
.cat-links
a[rel~="category"]:hover {
    background-color: #ffe46e !important;
    color: #17171c !important;
    text-decoration: none !important;
    transform: translateY(-1px);
}

body.single-post
article.bloglo-article
.post-category
.cat-links
a[rel~="category"]:active {
    background-color: #ffd536 !important;
    color: #17171c !important;
    transform: translateY(0);
}

body.single-post
article.bloglo-article
.post-category
.cat-links
a[rel~="category"]:focus-visible {
    background-color: #ffd536 !important;
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px #e52834 !important;
    color: #17171c !important;
    outline: 0;
}

/*
 * Neutraliza posibles fondos heredados en el span contenedor.
 */
body.single-post
article.bloglo-article
.post-category
.cat-links
> span {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/*
 * Ajuste móvil.
 */
@media (max-width: 680px) {
    body.single-post
    article.bloglo-article
    .post-category
    .cat-links
    a[rel~="category"] {
        font-size: 12px !important;
        min-height: 28px;
        padding: 7px 12px !important;
    }
}

/* =============================================================
   CVC MAGAZINE CATEGORY SIZE FINAL V3
   ============================================================= */

body.single-post
article.bloglo-article
.post-category
.cat-links
a[rel~="category"] {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    min-height: 31px;
    padding: 8px 15px !important;
}

@media (max-width: 680px) {
    body.single-post
    article.bloglo-article
    .post-category
    .cat-links
    a[rel~="category"] {
        font-size: 13px !important;
        min-height: 31px;
        padding: 8px 14px !important;
    }
}
