/*
 * Planeta Triatlón — artículo, listados y páginas (diseño de noviembre de
 * 2026).
 *
 * No hay wireframe de estas plantillas: todo sale del sistema de la
 * propuesta, con las mismas medidas que la portada.
 *   - Titulares: DM Sans 800 con el espaciado apretado del titular de
 *     apertura (50 px / -1,8 px; 31 px en móvil).
 *   - Entradilla y texto: Newsreader, como pide el brief.
 *   - Rayas de 3 px para abrir bloques, filetes de 1 px #D6D3CC, esquinas
 *     rectas, sin sombras.
 *   - El color de categoría, solo en la pastilla y, a lo grande, en la
 *     cabecera de su sección.
 * Se carga en todas las páginas menos la portada, junto a marca.css.
 */

/* ── Bloques ──────────────────────────────────────────────────────────── */

.pn-bloque {
    padding-top: 64px;
}

.pn-cabeza + .pn-medianas {
    margin-top: 22px;
}

.pn-medianas--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 40px;
}

.pn-vacio {
    padding-top: 56px;
    font-size: 18px;
    color: var(--pn-texto-2);
}

/* ── Cabecera de sección, autor, búsqueda y 404 ───────────────────────── */

.pn-seccion {
    border-bottom: 3px solid var(--pn-negro);
}

.pn-seccion__in {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    padding-top: 40px;
    padding-bottom: 32px;
}

.pn-seccion__texto {
    min-width: 0;
}

.pn-seccion__foto {
    flex: 0 0 96px;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--pn-gris);
}

.pn-seccion__antetitulo {
    font-size: 15px;
    font-weight: 800;
}

.pn-seccion__titulo {
    margin: 8px 0 0;
    font-size: 72px;
    line-height: 0.98;
    font-weight: 800;
    letter-spacing: -3px;
    text-transform: lowercase;
}

.pn-seccion__antetitulo + .pn-seccion__titulo {
    margin-top: 8px;
}

.pn-seccion--autor .pn-seccion__titulo {
    text-transform: none;
}

.pn-seccion__descripcion {
    margin-top: 14px;
    font-family: var(--pn-serif);
    font-size: 19px;
    line-height: 1.45;
    color: #33312C;
    max-width: 680px;
}

.pn-seccion__descripcion p {
    margin: 0 0 0.6em;
}

.pn-seccion__descripcion p:last-child {
    margin-bottom: 0;
}

.pn-seccion__descripcion a {
    color: inherit;
    text-decoration: underline;
    text-decoration-color: var(--pn-amarillo);
    text-decoration-thickness: 3px;
    text-underline-offset: 2px;
}

.pn-seccion .pn-buscador__form {
    margin-top: 20px;
    max-width: 560px;
}

/* El color de la sección, a lo grande. */
.pn-seccion--color {
    border-bottom: 0;
}

.pn-seccion--rojo {
    background: var(--pn-rojo);
    color: var(--pn-blanco);
}

.pn-seccion--naranja {
    background: var(--pn-naranja);
}

.pn-seccion--amarillo {
    background: var(--pn-amarillo);
}

.pn-seccion--azul {
    background: var(--pn-azul);
}

.pn-seccion--verde {
    background: var(--pn-verde);
}

.pn-seccion--color .pn-seccion__descripcion {
    color: inherit;
}

.pn-seccion--color .pn-seccion__descripcion a {
    text-decoration-color: currentColor;
}

/* ── Primera pieza de un listado ──────────────────────────────────────── */

.pn-lider__foto {
    height: 460px;
}

.pn-lider__pastilla {
    margin-top: 20px;
}

.pn-lider__titulo {
    margin: 8px 0 0;
    font-size: 40px;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -1.4px;
}

.pn-lider__foto + .pn-lider__titulo {
    margin-top: 20px;
}

.pn-lider__entradilla {
    font-family: var(--pn-serif);
    font-size: 19px;
    line-height: 1.4;
    margin: 12px 0 0;
    color: #33312C;
    max-width: 680px;
}

/* ── Paginación ───────────────────────────────────────────────────────── */

.pn-paginacion {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 48px;
    font-family: var(--pn-sans);
}

.pn-paginacion .page-numbers,
.pn-paginacion .post-page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 14px;
    border: 1.5px solid var(--pn-negro);
    font-size: 15px;
    font-weight: 800;
    color: var(--pn-negro);
    text-decoration: none;
}

.pn-paginacion .current {
    background: var(--pn-negro);
    color: var(--pn-blanco);
}

.pn-paginacion .dots {
    border: 0;
}

/* ── Artículo ─────────────────────────────────────────────────────────── */

.pn-articulo__titulo {
    margin: 8px 0 0;
    font-size: 50px;
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: -1.8px;
}

.pn-articulo__titulo:first-child {
    margin-top: 0;
}

.pn-articulo__entradilla {
    font-family: var(--pn-serif);
    font-size: 21px;
    line-height: 1.4;
    margin: 14px 0 0;
    color: #33312C;
    max-width: 680px;
}

.pn-firma a {
    color: var(--pn-negro);
}

.pn-articulo__foto {
    margin: 28px 0 0;
}

.pn-articulo__foto .pn-foto {
    aspect-ratio: 16 / 9;
}

.pn-articulo__foto figcaption {
    margin-top: 8px;
    font-size: 12px;
    color: #4A4740;
}

.pn-articulo__lateral {
    align-self: flex-start;
    position: sticky;
    top: 24px;
}

.pn-publi-lateral {
    margin-top: 32px;
    width: 300px;
    max-width: 100%;
    min-height: 250px;
}

/* Texto del artículo y de las páginas */
.pn-texto {
    max-width: 680px;
    margin-top: 32px;
    font-family: var(--pn-serif);
    font-size: 20px;
    line-height: 1.6;
    color: var(--pn-negro);
    overflow-wrap: break-word;
}

.pn-texto > * {
    margin-top: 0;
    margin-bottom: 0;
}

.pn-texto > * + * {
    margin-top: 1em;
}

.pn-texto strong,
.pn-texto b {
    font-weight: 600;
}

.pn-texto h2,
.pn-texto h3,
.pn-texto h4 {
    font-family: var(--pn-sans);
    font-weight: 800;
    color: var(--pn-negro);
}

.pn-texto h2 {
    margin-top: 1.8em;
    padding-top: 12px;
    border-top: 3px solid var(--pn-negro);
    font-size: 30px;
    line-height: 1.1;
    letter-spacing: -1px;
}

.pn-texto h3 {
    margin-top: 1.5em;
    font-size: 22px;
    line-height: 1.2;
    letter-spacing: -0.6px;
}

.pn-texto h4 {
    margin-top: 1.4em;
    font-size: 18px;
    line-height: 1.25;
    letter-spacing: -0.3px;
}

.pn-texto h2 + *,
.pn-texto h3 + *,
.pn-texto h4 + * {
    margin-top: 0.6em;
}

.pn-texto a {
    color: var(--pn-negro);
    text-decoration: underline;
    text-decoration-color: var(--pn-amarillo);
    text-decoration-thickness: 3px;
    text-underline-offset: 2px;
}

.pn-texto a:hover {
    background: var(--pn-amarillo);
}

.pn-texto ul,
.pn-texto ol {
    padding-left: 1.2em;
}

.pn-texto li + li {
    margin-top: 0.4em;
}

.pn-texto blockquote {
    margin: 1.6em 0 0;
    padding: 0 0 0 20px;
    border-left: 3px solid var(--pn-negro);
    font-family: var(--pn-sans);
    font-size: 24px;
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: -0.6px;
}

.pn-texto blockquote p {
    margin: 0;
}

.pn-texto blockquote cite {
    display: block;
    margin-top: 8px;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: normal;
    color: var(--pn-texto-2);
}

.pn-texto img {
    display: block;
    max-width: 100%;
    height: auto;
}

.pn-texto figure {
    margin-left: 0;
    margin-right: 0;
}

.pn-texto > figure,
.pn-texto > .wp-block-image {
    margin-top: 1.6em;
}

.pn-texto figcaption,
.pn-texto .wp-element-caption {
    margin-top: 8px;
    font-family: var(--pn-sans);
    font-size: 13px;
    line-height: 1.4;
    color: var(--pn-texto-2);
}

.pn-texto .aligncenter {
    margin-left: auto;
    margin-right: auto;
}

.pn-texto iframe,
.pn-texto video {
    max-width: 100%;
}

.pn-texto hr {
    border: 0;
    border-top: 1px solid var(--pn-filete);
    margin: 2em 0;
}

/* Tablas: DM Sans, cabecera con raya de 3 px y filetes entre filas. En móvil
   ruedan dentro de su caja en vez de empujar la página. */
.pn-texto .wp-block-table,
.pn-texto table {
    margin-top: 1.6em;
}

.pn-texto .wp-block-table {
    overflow-x: auto;
}

.pn-texto table {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--pn-sans);
    font-size: 15px;
    line-height: 1.35;
}

.pn-texto .wp-block-table table {
    margin-top: 0;
}

.pn-texto th,
.pn-texto td {
    padding: 10px 12px 10px 0;
    text-align: left;
    vertical-align: top;
    border: 0;
    border-bottom: 1px solid var(--pn-filete);
}

.pn-texto th,
.pn-texto thead td {
    font-weight: 800;
    border-bottom: 3px solid var(--pn-negro);
}

/* Caja de «conclusiones clave» */
.pn-texto .conclusiones-clave {
    background: #F3F1EC;
    padding: 20px 24px;
}

.pn-texto .conclusiones-clave h2,
.pn-texto .conclusiones-clave h3 {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.pn-texto .conclusiones-clave .wp-block-group__inner-container > * + * {
    margin-top: 0.8em;
}

/* Índice del artículo (plugin Easy Table of Contents): un módulo más, con su
   raya de 3 px y el rótulo en minúsculas. */
.pn-texto #ez-toc-container,
.pn-texto .ez-toc-container {
    width: 100%;
    margin-top: 1.6em;
    padding: 10px 0 0;
    background: none;
    border: 0;
    border-top: 3px solid var(--pn-negro);
    border-radius: 0;
    box-shadow: none;
    font-family: var(--pn-sans);
}

.pn-texto #ez-toc-container p.ez-toc-title,
.pn-texto .ez-toc-title {
    font-family: var(--pn-sans);
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.6px;
    text-transform: lowercase;
    color: var(--pn-negro);
}

.pn-texto #ez-toc-container ul,
.pn-texto #ez-toc-container nav > ul {
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}

.pn-texto #ez-toc-container ul ul {
    margin: 0;
    padding-left: 16px;
}

.pn-texto #ez-toc-container li {
    margin: 0;
    list-style: none;
    border-top: 1px solid var(--pn-filete);
}

.pn-texto #ez-toc-container li::before {
    display: none;
}

.pn-texto #ez-toc-container a {
    display: block;
    padding: 10px 0;
    font-size: 15px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--pn-negro);
    text-decoration: none;
}

.pn-texto #ez-toc-container a:hover {
    background: none;
    text-decoration: underline;
}

.pn-texto #ez-toc-container .ez-toc-btn,
.pn-texto #ez-toc-container .ez-toc-toggle {
    background: none;
    border: 0;
    box-shadow: none;
}

/* Aviso de calculadora dentro del artículo: la franja amarilla en pequeño. */
.pn-aviso-calc {
    margin-top: 1.6em;
    background: var(--pn-amarillo);
    padding: 20px 24px;
    font-family: var(--pn-sans);
}

.pn-aviso-calc__rotulo {
    display: block;
    font-size: 15px;
    font-weight: 800;
}

.pn-texto .pn-aviso-calc__texto,
.pn-aviso-calc__texto {
    margin: 6px 0 14px;
    font-size: 17px;
    line-height: 1.4;
}

.pn-texto a.pn-aviso-calc__boton {
    display: inline-block;
    background: var(--pn-negro);
    color: var(--pn-blanco);
    padding: 12px 18px;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
}

/* Formularios de Contact Form 7 (contacto y similares). Solo los suyos: las
   calculadoras pegadas en HTML traen su propio estilo y no se tocan. */
.pn-texto .wpcf7 input[type="text"],
.pn-texto .wpcf7 input[type="email"],
.pn-texto .wpcf7 input[type="tel"],
.pn-texto .wpcf7 input[type="url"],
.pn-texto .wpcf7 input[type="number"],
.pn-texto .wpcf7 select,
.pn-texto .wpcf7 textarea {
    width: 100%;
    max-width: 480px;
    margin: 0 0 10px;
    font-family: var(--pn-sans);
    font-size: 16px;
    padding: 12px 14px;
    border: 1.5px solid var(--pn-negro);
    border-radius: 0;
    color: var(--pn-negro);
    background: var(--pn-blanco);
}

.pn-texto .wpcf7 textarea {
    max-width: 100%;
    min-height: 140px;
}

.pn-texto .wpcf7 input[type="submit"] {
    font-family: var(--pn-sans);
    background: var(--pn-negro);
    color: var(--pn-blanco);
    border: 0;
    border-radius: 0;
    padding: 14px 22px;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
}

/* ── Páginas ──────────────────────────────────────────────────────────── */

.pn-pagina {
    padding-top: 40px;
}

/* Página /calculadoras/: la franja amarilla de la portada, a página entera. */
.pn-calcs {
    background: var(--pn-amarillo);
}

.pn-calcs__in {
    padding-top: 56px;
    padding-bottom: 56px;
}

.pn-calcs__antetitulo {
    font-size: 15px;
    font-weight: 800;
}

.pn-calcs__titulo {
    margin: 10px 0 0;
    font-size: 44px;
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: -1.6px;
    text-transform: lowercase;
}

.pn-calcs__intro {
    margin-top: 14px;
    font-family: var(--pn-serif);
    font-size: 19px;
    line-height: 1.45;
    max-width: 680px;
}

.pn-calcs__intro p {
    margin: 0 0 0.6em;
}

.pn-calcs__lista {
    list-style: none;
    margin: 28px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 10px;
}

.pn-calcs__item {
    background: var(--pn-blanco);
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.pn-calcs__nombre {
    margin: 0;
    font-size: 22px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.6px;
}

.pn-calcs__texto {
    flex: 1;
    margin: 8px 0 18px;
    font-size: 15px;
    line-height: 1.4;
    color: var(--pn-texto-2);
}

.pn-portada a.pn-calcs__boton,
a.pn-calcs__boton {
    background: var(--pn-negro);
    color: var(--pn-blanco);
    padding: 12px 18px;
    font-size: 15px;
    font-weight: 800;
}

/* Nuestro equipo */
.pn-equipo {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 32px;
}

.pn-equipo__enlace {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    border-top: 3px solid var(--pn-negro);
    padding-top: 14px;
}

.pn-equipo__foto {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 8px;
    background: var(--pn-gris);
}

.pn-equipo__nombre {
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -0.6px;
}

.pn-equipo__total {
    font-size: 12px;
    font-weight: 700;
    color: var(--pn-texto-2);
}

.pn-equipo__bio {
    margin-top: 6px;
    font-size: 15px;
    line-height: 1.4;
}

/* ── Comentarios ──────────────────────────────────────────────────────── */

.pn-comentarios {
    max-width: 680px;
}

.pn-comentarios__lista,
.pn-comentarios__lista .children {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pn-comentarios__lista .children {
    padding-left: 24px;
}

.pn-comentarios__lista .comment-body {
    padding: 16px 0;
    border-bottom: 1px solid var(--pn-filete);
}

.pn-comentarios .comment-author {
    font-size: 15px;
    font-weight: 800;
}

.pn-comentarios .comment-author .says {
    display: none;
}

.pn-comentarios .comment-meta {
    margin-top: 2px;
    font-size: 12px;
    font-weight: 700;
}

.pn-comentarios .comment-meta a {
    color: var(--pn-texto-2);
}

.pn-comentarios .comment-content {
    margin-top: 8px;
    font-family: var(--pn-serif);
    font-size: 18px;
    line-height: 1.5;
}

.pn-comentarios .comment-content p {
    margin: 0 0 0.6em;
}

.pn-comentarios .reply a {
    font-size: 13px;
    font-weight: 800;
}

.pn-comentarios .comment-respond {
    margin-top: 40px;
}

.pn-comentarios .comment-respond:first-child {
    margin-top: 0;
}

.pn-comentarios__form p {
    margin: 14px 0 0;
}

.pn-comentarios__form label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 700;
}

.pn-comentarios__form input[type="text"],
.pn-comentarios__form input[type="email"],
.pn-comentarios__form input[type="url"],
.pn-comentarios__form textarea {
    width: 100%;
    font-family: var(--pn-sans);
    font-size: 16px;
    padding: 12px 14px;
    border: 1.5px solid var(--pn-negro);
    border-radius: 0;
    color: var(--pn-negro);
    background: var(--pn-blanco);
}

.pn-comentarios__form .comment-form-cookies-consent label {
    display: inline;
    font-weight: 400;
}

.pn-comentarios .comment-notes,
.pn-comentarios .logged-in-as {
    font-size: 14px;
    color: var(--pn-texto-2);
}

.pn-comentarios__enviar {
    font-family: var(--pn-sans);
    background: var(--pn-negro);
    color: var(--pn-blanco);
    border: 0;
    border-radius: 0;
    padding: 14px 22px;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
}

/* ═══════════════════════════════════════════════════════════════════════
   PANTALLAS MEDIANAS Y MÓVIL
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
    .pn-medianas--3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pn-articulo__lateral {
        position: static;
    }
}

@media (max-width: 720px) {
    .pn-fila {
        padding: 24px 16px 0;
        gap: 40px;
    }

    .pn-bloque {
        padding-top: 40px;
    }

    .pn-vacio {
        padding-top: 32px;
    }

    .pn-seccion__in {
        gap: 16px;
        padding-top: 28px;
        padding-bottom: 24px;
    }

    .pn-seccion__foto {
        flex-basis: 72px;
        width: 72px;
        height: 72px;
    }

    .pn-seccion__antetitulo {
        font-size: 14px;
    }

    .pn-seccion__titulo {
        font-size: 40px;
        letter-spacing: -1.6px;
    }

    .pn-seccion__descripcion {
        font-size: 17px;
    }

    .pn-lider__foto {
        height: 240px;
        margin: 0 -16px;
    }

    .pn-lider__pastilla {
        margin-top: 14px;
    }

    .pn-lider__titulo {
        margin-top: 6px;
        font-size: 27px;
        line-height: 1.06;
        letter-spacing: -0.9px;
    }

    .pn-lider__foto + .pn-lider__titulo {
        margin-top: 14px;
    }

    .pn-lider__entradilla {
        font-size: 17px;
        margin-top: 10px;
    }

    .pn-paginacion {
        padding-top: 32px;
    }

    .pn-articulo__titulo {
        margin-top: 6px;
        font-size: 31px;
        line-height: 1.04;
        letter-spacing: -1.1px;
    }

    .pn-articulo__entradilla {
        font-size: 18px;
        margin-top: 10px;
    }

    .pn-articulo__foto {
        margin: 20px -16px 0;
    }

    .pn-articulo__foto figcaption {
        padding: 0 16px;
    }

    .pn-texto {
        margin-top: 24px;
        font-size: 18px;
    }

    .pn-texto h2 {
        font-size: 25px;
        letter-spacing: -0.8px;
    }

    .pn-texto h3 {
        font-size: 20px;
        letter-spacing: -0.5px;
    }

    .pn-texto blockquote {
        font-size: 20px;
        letter-spacing: -0.5px;
    }

    .pn-aviso-calc {
        padding: 16px;
    }

    .pn-pagina {
        padding-top: 24px;
    }

    .pn-calcs__in {
        padding-top: 28px;
        padding-bottom: 28px;
    }

    .pn-calcs__antetitulo {
        font-size: 14px;
    }

    .pn-calcs__titulo {
        margin-top: 6px;
        font-size: 30px;
        line-height: 1.03;
        letter-spacing: -1.1px;
    }

    .pn-calcs__lista {
        margin-top: 16px;
        gap: 8px;
    }

    .pn-calcs__item {
        padding: 16px;
    }
}