/*
 * Blöð: an issue's or a supplement's page and the outlet's list of them (templates/issues/issue_detail.html, subissue_detail.html,
 * issue_list.html; snippets/blad_hero.html, blad_pages.html, issue-item.html). Loaded on those pages only. In each outlet's look by its
 * own colours (--base-*), with Heimildin's where a look has none.
 */
.blad { --blad-ink: var(--base-ink, #141414); --blad-muted: var(--base-muted, #6b6b6b); --blad-line: var(--base-line, #dedede);
        --blad-surface: var(--base-surface, #f2f2f2); --blad-accent: var(--base-accent, #d10000); --blad-bg: var(--base-bg, #fff);
        padding-bottom: 3rem; }

.blad__crumbs { padding: 1.25rem 0 0; font-size: .875rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.blad__crumbs a { color: var(--blad-muted); text-decoration: none; }
.blad__crumbs a::before { content: "‹ "; }
.blad__crumbs a:hover { color: var(--blad-ink); }

/* ---- The top: the cover beside what it is and what may be done with it */
.blad-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding: 1.25rem 0 2rem; border-bottom: 1px solid var(--blad-line); }
.blad-hero__cover img { display: block; width: 100%; max-width: 460px; height: auto; margin: 0 auto; box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 10px 30px rgba(0,0,0,.12); }
.blad-hero__body { min-width: 0; }
.blad-hero__kicker { margin: 0 0 .35rem; color: var(--blad-accent); font-size: .875rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.blad-hero__kicker a { color: inherit; text-decoration: none; }
.blad-hero__kicker a:hover { text-decoration: underline; }
.blad-hero__title { margin: 0; color: var(--blad-ink); font-family: var(--st-font-headline, var(--base-font-heading, "tiemposheadline_web", serif)); font-size: 2.25rem; font-weight: 700; line-height: 1.1; }
.blad-hero__meta { margin: .5rem 0 0; color: var(--blad-muted); font-size: .9375rem; }
.blad-hero__lead { margin: 1rem 0 0; max-width: 38em; color: var(--blad-ink); font-size: 1.125rem; line-height: 1.55; }
.blad-hero__actions { display: flex; flex-wrap: wrap; gap: .625rem; margin-top: 1.5rem; }
.blad-hero__next { margin: 1.5rem 0 0; color: var(--blad-muted); font-size: .9375rem; }

.blad-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 1.4em; border: 1px solid var(--blad-line);
            border-radius: 4px; background: var(--blad-bg); color: var(--blad-ink) !important; font-size: 1rem; font-weight: 700; text-decoration: none !important;
            transition: background-color 150ms ease-in-out, border-color 150ms ease-in-out; }
.blad-btn:hover { border-color: var(--blad-ink); }
.blad-btn--primary { border-color: var(--blad-ink); background: var(--blad-ink); color: var(--blad-bg) !important; }
.blad-btn--primary:hover { background: var(--blad-accent); border-color: var(--blad-accent); }

/* The subscription (core/snippets/paywall.html), said of the paper, beside its cover rather than across the page. */
.blad-hero__paywall { margin-top: 1.5rem; scroll-margin-top: 6rem; }
.blad-hero__paywall .paywall { margin: 0; padding: 1.25rem 0 0; border-top: 1px solid var(--blad-line); }
.blad-hero__paywall .paywall-content { max-width: none; text-align: left; }
.blad-hero__paywall .paywall .paywall-title { font-size: 1.5rem; }
.blad-hero__paywall .paywall .paywall-login-options { max-width: 360px; margin: .5rem 0 0; }

@media (min-width: 768px) {
    .blad-hero { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 3rem; padding: 2rem 0 3rem; align-items: start; }
    .blad-hero__cover img { margin: 0; }
    .blad-hero__body { padding-top: 1rem; }
    .blad-hero__title { font-size: 3rem; }
}
@media (min-width: 1200px) { .blad-hero__title { font-size: 3.5rem; } }

/* ---- Sections under it */
.blad-section__title { margin: 0 0 1rem; color: var(--blad-ink); font-size: 1rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.blad-parts, .blad-pages, .blad-articles, .blad-more { padding: 2rem 0; border-bottom: 1px solid var(--blad-line); }
.blad-more { border-bottom: 0; }

/* The pages, small, in a row to scroll */
.blad-pages__list { display: flex; gap: .75rem; margin: 0; padding: 0 0 .75rem; overflow-x: auto; list-style: none; scroll-snap-type: x proximity;
                    -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.blad-pages__item { flex: 0 0 96px; scroll-snap-align: start; }
.blad-pages__link { display: block; color: var(--blad-muted); text-align: center; text-decoration: none; }
.blad-pages__link img { display: block; width: 96px; height: auto; aspect-ratio: 2 / 3; object-fit: cover; background: var(--blad-surface);
                        box-shadow: 0 0 0 1px var(--blad-line); transition: transform 150ms ease-in-out, box-shadow 150ms ease-in-out; }
.blad-pages__link:hover img, .blad-pages__link:focus-visible img { transform: translateY(-2px); box-shadow: 0 0 0 1px var(--blad-ink), 0 6px 14px rgba(0,0,0,.12); }
.blad-pages__number { display: block; margin-top: .3rem; font-size: .75rem; font-variant-numeric: tabular-nums; }

/* The parts that come with it, big (a link to one the reader may read) */
.blad-parts__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; margin: 0; padding: 0; list-style: none; }
.blad-parts__card { display: flex; gap: 1.25rem; align-items: flex-start; color: var(--blad-ink); text-decoration: none; }
.blad-parts__cover img { display: block; width: 140px; height: auto; box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 8px 22px rgba(0,0,0,.12);
                         transition: transform 150ms ease-in-out; }
a.blad-parts__card:hover .blad-parts__cover img { transform: translateY(-3px); }
.blad-parts__text { display: flex; flex-direction: column; gap: .4rem; min-width: 0; padding-top: .25rem; }
.blad-parts__name { font-family: var(--st-font-headline, var(--base-font-heading, "tiemposheadline_web", serif)); font-size: 1.5rem; font-weight: 700; line-height: 1.15; }
.blad-parts__about { color: var(--blad-muted); font-size: .9375rem; line-height: 1.5; }
.blad-parts__go { margin-top: .25rem; color: var(--blad-accent); font-size: .875rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
a.blad-parts__card:hover .blad-parts__name { text-decoration: underline; }
@media (min-width: 768px) {
    .blad-parts__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; }
    .blad-parts__cover img { width: 200px; }
    .blad-parts__name { font-size: 1.75rem; }
}

/* Its articles on the site: a strip of the first (the site's teasers, a row to scroll), a word that not all of it comes, the rest on its own
   page */
.blad-section__title a { color: inherit; text-decoration: none; }
.blad-section__title a:hover { text-decoration: underline; }
.blad-strip { display: flex; gap: 1.25rem; margin: 0; padding: 0 0 .75rem; overflow-x: auto; list-style: none; scroll-snap-type: x proximity;
              -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.blad-strip__item { flex: 0 0 78%; min-width: 0; scroll-snap-align: start; }
@media (min-width: 600px) { .blad-strip__item { flex-basis: calc((100% - 1.25rem) / 2.3); } }
@media (min-width: 992px) { .blad-strip__item { flex-basis: calc((100% - 3.75rem) / 3.6); } }
.blad-articles__note { margin: .75rem 0 0; color: var(--blad-muted); font-size: .9375rem; }

/* Its articles on the site, the paper's pages over each (the issue's own page of them: issue_articles.html) */
.blad-articles__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
.blad-articles__item { position: relative; min-width: 0; }
.blad-articles__pages { display: block; margin-bottom: .4rem; color: var(--blad-muted); font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
@media (min-width: 600px) { .blad-articles__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .blad-articles__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; } }

/* The outlet's other issues */
.blad-more__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.blad-more__all { color: var(--blad-muted); font-size: .875rem; font-weight: 700; text-decoration: none; }
.blad-more__all:hover { color: var(--blad-ink); }

/* ---- The list of Blöð (and the cards on an issue's page) */
.blad-list__next { margin: .25rem 0 1rem; color: var(--base-muted, #6b6b6b); font-size: .9375rem; }
.issue-item__cover img { display: block; aspect-ratio: auto; background: var(--base-surface, #f2f2f2); }
.issue-item__lead { display: -webkit-box; margin: .35rem 0 0; overflow: hidden; color: var(--base-ink, #141414); font-size: .875rem; line-height: 1.45;
                    -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.issue-item--large .issue-item__lead { font-size: 1rem; -webkit-line-clamp: 4; max-width: 34em; }

/* ---- The issue's articles on the site, all of them (issue_articles.html) */
.blad-efni { display: flex; gap: 1.5rem; align-items: flex-start; padding: 1.25rem 0 1.75rem; border-bottom: 1px solid var(--blad-line); margin-bottom: 1.75rem; }
.blad-efni__cover img { display: block; width: 96px; height: auto; box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 6px 16px rgba(0,0,0,.12); }
.blad-efni__body { min-width: 0; }
.blad-efni__note { margin: .75rem 0 0; max-width: 40em; color: var(--blad-muted); font-size: .9375rem; line-height: 1.5; }
.blad-efni__note a { color: var(--blad-ink); font-weight: 700; }
.blad-efni__grid .col-6 { margin-bottom: 1.5rem; }
.blad-efni__empty { color: var(--blad-muted); }
@media (min-width: 768px) { .blad-efni__cover img { width: 120px; } }