/* ==========================================================================
   Criterio.Capital cc.4 — Cabecera (se carga en todas las plantillas)
   Objetivo: que las 4 entradas del menú (Inicio · Lo que leí esta semana ·
   Deep Dive · Resultados) quepan sin pasar al menú «…» en escritorio ancho.
   El script del tema mueve entradas al «…» si (ancho del menú + 64px) supera
   el hueco disponible; aquí se reduce la separación entre entradas y el margen
   del menú solo a partir de 1200px.
   Móvil (≤767px) no se toca.
   ========================================================================== */

@media (min-width: 1200px) {
    .gh-navigation .nav {
        gap: 20px;
    }

    .gh-navigation.is-middle-logo .gh-navigation-menu {
        margin-right: 0;
    }

    .gh-navigation.is-left-logo .gh-navigation-menu {
        margin-right: 48px;
    }
}

/* ==========================================================================
   Criterio.Capital cc.6 — Aviso de sección vacía (tag.hbs / channels)
   Se carga en todas las plantillas. Caja crema con texto azul noche y filete
   dorado: legible tanto con fondo claro como si el fondo del sitio es oscuro.
   Contraste: #122036 sobre #F0ECE2 ≈ 14:1; #F0ECE2 sobre #122036 ≈ 14:1.
   ========================================================================== */

/* Misma retícula que la cabecera del archivo (.gh-archive) para que el aviso
   quede alineado con el título: 16 columnas y span 12 desde 1200px. */
.cc-tag-empty {
    display: grid;
    grid-template-columns: repeat(16, 1fr);
    gap: var(--grid-gap, 42px);
    margin-block: 8px clamp(64px, 8vw, 112px);
}

.cc-tag-empty-box {
    grid-column: 3 / span 12;
    padding: clamp(24px, 4vw, 40px);
    color: #122036;
    background: #f0ece2;
    border-left: 4px solid #cda862;
    border-radius: 6px;
}

.cc-tag-empty-kicker {
    margin: 0 0 8px;
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #7a5e28; /* dorado oscuro: 5,2:1 sobre crema */
}

.cc-tag-empty-text {
    max-width: 60ch;
    margin: 0;
    font-size: clamp(1.7rem, 0.3vw + 1.6rem, 1.9rem);
    line-height: 1.55;
}

.cc-tag-empty-note {
    margin: 16px 0 0;
    font-size: 1.5rem;
    color: #4f5868;
}

.cc-tag-empty-button {
    display: inline-flex;
    align-items: center;
    margin-top: 20px;
    padding: 10px 20px;
    font-size: 1.5rem;
    font-weight: 600;
    color: #f0ece2;
    background: #122036;
    border-radius: 999px;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.cc-tag-empty-button:hover {
    color: #122036;
    background: #cda862;
    opacity: 1;
}

.cc-tag-empty-back {
    display: inline-block;
    margin: 20px 0 0 20px;
    font-size: 1.5rem;
    font-weight: 600;
    color: #7a5e28;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.cc-tag-empty-back:hover {
    color: #122036;
    opacity: 1;
}

.cc-tag-empty a:focus-visible {
    outline: 3px solid #cda862;
    outline-offset: 3px;
}

@media (max-width: 1199px) {
    .cc-tag-empty {
        display: block;
    }
}

@media (max-width: 480px) {
    .cc-tag-empty-back {
        display: block;
        margin-left: 0;
    }
}

/* ==========================================================================
   Criterio.Capital cc.7 — Secciones channel (seccion-*.hbs)
   En un channel Ghost no añade .tag-template al <body>, así que se replican
   aquí las dos reglas de screen.css que tag.hbs recibe por esa clase.
   ========================================================================== */
.cc-seccion .gh-container {
    margin-top: 0;
}

.cc-seccion .gh-container:not(.has-sidebar) .gh-container-title {
    display: none;
}
