/*
 * Víkingur 26: the news article (single-post.php), after the design's
 * ArticlePage (ui_kits/web/MatchArticle.jsx). PageHero and the icon button
 * are shared components, in components.css.
 */

.vik-article__caption{margin:12px 0 0;font-size:13px;line-height:1.45;color:var(--text-secondary)}

/* ── Column ── */
.vik-article__sec{padding-top:40px}
.vik-article__wrap{display:grid;gap:40px;justify-items:center}
.vik-article__wrap>*{width:100%;max-width:760px}

/* ── Byline: crest, club, reading time; share buttons ── */
.vik-byline{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-bottom:24px;border-bottom:1px solid var(--border-hairline)}
.vik-byline__who{display:flex;align-items:center;gap:12px}
.vik-byline__who img{display:block;height:36px;width:auto}
.vik-byline__text{display:grid}
.vik-byline__text b{font-size:15px}
.vik-byline__text span{font-size:13px;color:var(--text-secondary)}
.vik-byline__actions{display:flex;gap:8px}

/* ── The text ── */
.vik-prose{display:grid;gap:24px;font-size:19px;line-height:1.65;color:var(--ink);overflow-wrap:break-word}
.vik-prose>*{margin:0;min-width:0}
/* The opening paragraph is the lede, as in the design. */
.vik-prose>p:first-child{font-size:23px;line-height:1.5;font-weight:500}
.vik-prose h2,.vik-prose h3,.vik-prose h4{margin-top:16px;font-family:var(--font-display);font-weight:900;line-height:.95;text-transform:uppercase}
.vik-prose h2{font-size:clamp(32px,3.4vw,44px)}
.vik-prose h3{font-size:clamp(26px,2.6vw,34px)}
.vik-prose h4{font-size:24px}
.vik-prose a{color:var(--text-brand);text-decoration:underline;text-underline-offset:.15em}
.vik-prose a:hover{color:var(--action-primary-hover)}
.vik-prose ul,.vik-prose ol{padding-left:1.3em;display:grid;gap:8px}
.vik-prose ol{font-variant-numeric:tabular-nums}
.vik-prose hr{border:0;border-top:1px solid var(--border-hairline)}
.vik-prose img{max-width:100%;height:auto;display:block}
.vik-prose .aligncenter{margin-left:auto;margin-right:auto}
.vik-prose figure,.vik-prose .wp-caption{width:auto!important;max-width:100%}
.vik-prose figcaption,.vik-prose .wp-caption-text{margin-top:10px;font-size:13px;line-height:1.45;color:var(--text-secondary)}
.vik-prose iframe{display:block;width:100%;height:auto;aspect-ratio:16/9;border:0}
.vik-prose table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;font-size:15px;line-height:1.4}
.vik-prose th,.vik-prose td{padding:10px 12px;border-bottom:1px solid var(--border-hairline);text-align:left;vertical-align:top}
.vik-prose th{font-family:var(--font-condensed);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
/* Quotes: the design's red rule. Long quotes stay readable; short ones
   (marked is-pull in inc/article.php) get the design's big pull quote. */
.vik-prose blockquote{padding:4px 0 4px 28px;border-left:4px solid var(--vik-astrida);font-size:21px;line-height:1.55;font-weight:500}
.vik-prose blockquote p{margin:0}
.vik-prose blockquote p+p{margin-top:12px}
.vik-prose blockquote.is-pull{padding:8px 0 8px 28px;font-family:var(--font-display);font-weight:900;font-size:clamp(36px,4.4vw,56px);line-height:.92;text-transform:uppercase}
/* WordPress [gallery] in older posts. */
.vik-prose .gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.vik-prose .gallery br{display:none}
.vik-prose .gallery-item{margin:0}
.vik-prose .gallery-item img{width:100%;aspect-ratio:1;object-fit:cover}

/* ── Video and gallery: wider than the text, as the design's figure ── */
.vik-article__wrap>.vik-article__video,.vik-article__wrap>.vik-gallery{max-width:1100px}
.vik-article__video iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:var(--black)}
.vik-gallery__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.vik-gallery__grid a{display:block;overflow:hidden;background:var(--gray-100)}
.vik-gallery__grid img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform 600ms var(--ease-strike)}
.vik-gallery__grid a:hover img{transform:scale(1.04)}
.vik-gallery__grid a:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}

/* ── Tengdar fréttir ── */
.vik-related{background:var(--canvas)}
.vik-related__kicker{margin:0 0 8px;font-family:var(--font-condensed);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-brand)}
.vik-related__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}

@media (max-width:1060px){
	.vik-related__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.vik-related__grid>:nth-child(3){display:none}
}
@media (max-width:640px){
	.vik-prose{font-size:18px}
	.vik-prose>p:first-child{font-size:20px}
	.vik-prose blockquote{padding-left:20px;font-size:19px}
	.vik-gallery__grid,.vik-prose .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
	.vik-related__grid{grid-template-columns:1fr}
	.vik-related__grid>:nth-child(3){display:block}
}
@media (prefers-reduced-motion:reduce){.vik-gallery__grid img{transition:none}}