/*
 * Retoques de la landing noruega (/no/) sobre el sistema visual normal de FabelTales (theme.css +
 * dark-mode.css). Todo con los tokens del tema, así que el modo oscuro funciona sin reglas propias.
 * Solo cubre lo que theme.css no trae: tamaño de la imagen de intro, hueco de tarjeta sin portada,
 * meta de lectura y el bloque «cómo lo hacemos».
 */

.no-intro .intro-image.no-intro-image { flex: 1 1 320px; max-width: 480px; }
.no-intro .no-intro-image img { max-height: none; aspect-ratio: 16 / 9; }

.no-button {
    display: inline-block;
    padding: 0.6rem 1.25rem;
    border-radius: 999px;
    background: var(--color-accent);
    color: var(--color-surface);
    font-weight: 600;
    text-decoration: none;
}
.no-button:hover { filter: brightness(1.1); }
.no-intro-cta { margin-bottom: 0; }

.no-card-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 140px;
    font-size: 2.5rem;
    background: var(--color-sky);
}
.story-grid > .story-card:nth-child(3n+2) .no-card-placeholder { background: var(--color-mint); }
.story-grid > .story-card:nth-child(3n+3) .no-card-placeholder { background: var(--color-cream); }

.no-how-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}
@media (min-width: 900px) { .no-how-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 560px) { .no-how-grid { grid-template-columns: 1fr; } }

.no-how-grid li {
    border-radius: var(--radius);
    padding: 1.1rem 1.1rem 1.25rem;
    background: var(--color-sky);
    color: var(--color-teal);
}
.no-how-grid li:nth-child(4n+2) { background: var(--color-mint); color: var(--color-forest); }
.no-how-grid li:nth-child(4n+3) { background: var(--color-cream); color: var(--color-accent-warm); }
.no-how-grid li:nth-child(4n+4) { background: var(--color-gold-tint); color: var(--color-gold-text); }
.no-how-grid h3 { margin: 0.25rem 0 0.5rem; text-align: left; font-size: 1.2rem; font-weight: 600; color: inherit; }
.content-card .footer-sister-site { margin-top: 2.5rem; margin-bottom: 0; }
.no-how-grid p { margin: 0; font-size: 0.93rem; color: var(--color-text); }
.no-how-numeral { font-family: var(--font-story-display); font-weight: 600; font-size: 1.4rem; }


.no-button-ghost {
    background: transparent;
    color: var(--color-accent);
    box-shadow: inset 0 0 0 2px var(--color-accent);

}
.no-button-ghost:hover { background: var(--color-accent); color: var(--color-surface); filter: none; }
.no-intro-cta .no-button { margin-bottom: 0.5rem; }

/* Sin cuentos, «Nytt på hylla» es una sola línea, no un bloque grande. */
.no-shelf-soon { margin-top: 1.5rem; }
.no-shelf-soon h2 { font-size: 1.35rem; margin-bottom: 0.25rem; }
.no-shelf-soon .showcase-intro { margin-bottom: 0; }

.footer-explore { list-style: none; margin: 0 0 0.75rem; padding: 0; }
.footer-explore li { margin: 0.2rem 0; }
.no-intro-cta { display: flex; flex-wrap: wrap; gap: 0.5rem 0.75rem; align-items: center; }
.no-intro-cta .no-button { margin-bottom: 0; }