/* ── OFHF Tildelinger ─────────────────────────────────────────────────────── */

:root {
	--ofhf-marine:    #034060;
	--ofhf-marine-lys:#3b6ca2;
	--ofhf-rod:       #e72f2c;
	--ofhf-mork:      #1a1a1a;
	--ofhf-tekst:     #333;
	--ofhf-kant:      #dde4ea;
	--ofhf-bakgr:     #f4f7f9;
	--ofhf-skygge:    0 2px 10px rgba(3, 64, 96, 0.10);
}

/* ── Arkiv / listeside ────────────────────────────────────────────────────── */

.ofhf-tildelinger-arkiv {
	display:        flex;
	flex-direction: column;
	gap:            2rem;
	max-width:      820px;
	margin:         2.5rem auto;
	padding:        0 1.5rem;
}

.ofhf-tildeling-kort {
	background:    #fff;
	border:        1px solid var(--ofhf-kant);
	border-radius: 8px;
	box-shadow:    var(--ofhf-skygge);
	overflow:      hidden;
}

/* Bildedel */
.ofhf-kort-bilde-wrap {
	position: relative;
	width:    100%;
}

.ofhf-kort-bilde-wrap img {
	display:    block;
	width:      100%;
	height:     280px;
	object-fit: cover;
}

.ofhf-kort-bilde-placeholder {
	width:      100%;
	height:     180px;
	background: var(--ofhf-marine);
}

.ofhf-bilde-hel img {
	height:     auto;
	object-fit: unset;
}

.ofhf-kort-aar-badge {
	position:    absolute;
	bottom:      0;
	left:        0;
	background:  var(--ofhf-marine);
	color:       #fff;
	font-size:   1.6rem;
	font-weight: 800;
	padding:     0.4rem 1.1rem;
	letter-spacing: 0.5px;
}

/* Innholdsdel */
.ofhf-kort-innhold {
	padding: 1.25rem 1.5rem 1.5rem;
}

.ofhf-kort-mottaker-tittel {
	font-size:      0.7rem;
	font-weight:    700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color:          var(--ofhf-marine);
	margin:         0 0 0.6rem;
	padding-bottom: 0.4rem;
	border-bottom:  2px solid var(--ofhf-marine);
}

.ofhf-kort-mottaker-liste {
	list-style:   none;
	margin:       0;
	padding:      0;
	column-count: 2;
	column-gap:   1.5rem;
}

.ofhf-kort-mottaker-liste li {
	padding:      0.35rem 0;
	border-bottom: 1px solid var(--ofhf-kant);
	font-size:    0.9rem;
	color:        var(--ofhf-tekst);
	break-inside: avoid;
}

.ofhf-les-mer {
	display:         inline-block;
	margin-top:      1.25rem;
	padding:         0.55rem 1.25rem;
	background:      var(--ofhf-rod);
	color:           #fff;
	text-decoration: none;
	border-radius:   4px;
	font-size:       0.9rem;
	font-weight:     600;
	transition:      background 0.18s ease;
}

.ofhf-les-mer:hover {
	background: #c42320;
}

/* ── Detaljside ───────────────────────────────────────────────────────────── */

.ofhf-tildeling-side {
	max-width: 900px;
	margin:    0 auto;
	padding:   0 1.5rem 4rem;
}

.ofhf-ts-topp {
	padding: 2rem 0 1.5rem;
}

.ofhf-ts-tilbake {
	display:         inline-block;
	font-size:       0.85rem;
	color:           var(--ofhf-marine);
	text-decoration: none;
	margin-bottom:   1rem;
}

.ofhf-ts-tilbake:hover {
	text-decoration: underline;
}

.ofhf-ts-label {
	font-size:      0.7rem;
	font-weight:    700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color:          var(--ofhf-marine);
	margin:         0 0 0.25rem;
}

.ofhf-ts-aar {
	font-size:   3.5rem;
	font-weight: 900;
	color:       var(--ofhf-mork);
	margin:      0;
	line-height: 1;
}

.ofhf-ts-bilde {
	margin:        1.5rem 0;
	border-radius: 8px;
	overflow:      hidden;
	box-shadow:    var(--ofhf-skygge);
}

.ofhf-ts-bilde img {
	display: block;
	width:   100%;
	height:  auto;
}

.ofhf-ts-bildetekst {
	font-size:   0.8rem;
	color:       #777;
	padding:     0.4rem 0.5rem;
	font-style:  italic;
	border-top:  1px solid var(--ofhf-kant);
	margin:      0;
}

.ofhf-ts-intro {
	background:    #eef3f7;
	border-left:   4px solid var(--ofhf-marine);
	border-radius: 0 4px 4px 0;
	padding:       1rem 1.25rem;
	margin-bottom: 1.5rem;
	font-size:     1.05rem;
	color:         var(--ofhf-tekst);
}

.ofhf-ts-intro p {
	margin: 0;
}

.ofhf-ts-brodtekst {
	margin-bottom: 2rem;
	font-size:     1rem;
	line-height:   1.75;
	color:         var(--ofhf-tekst);
}

.ofhf-ts-brodtekst p        { margin-bottom: 1em; }
.ofhf-ts-brodtekst h2,
.ofhf-ts-brodtekst h3       { color: var(--ofhf-marine); margin: 1.5em 0 0.5em; font-weight: 700; }
.ofhf-ts-brodtekst ul,
.ofhf-ts-brodtekst ol       { padding-left: 1.5rem; margin-bottom: 1em; }
.ofhf-ts-brodtekst li       { margin-bottom: 0.3em; }
.ofhf-ts-brodtekst a        { color: var(--ofhf-marine); text-decoration: underline; }
.ofhf-ts-brodtekst strong   { font-weight: 700; }
.ofhf-ts-brodtekst em       { font-style: italic; }

.ofhf-ts-mottaker-tittel {
	font-size:      0.7rem;
	font-weight:    700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color:          var(--ofhf-marine);
	margin:         0 0 0.75rem;
	border-bottom:  2px solid var(--ofhf-marine);
	padding-bottom: 0.5rem;
}

.ofhf-ts-liste ul {
	list-style:   none;
	margin:       0;
	padding:      0;
	column-count: 2;
	column-gap:   2rem;
}

.ofhf-ts-liste li {
	padding:      0.45rem 0;
	border-bottom: 1px solid var(--ofhf-kant);
	font-size:    0.95rem;
	color:        var(--ofhf-tekst);
	break-inside: avoid;
}

/* ── Mobil ────────────────────────────────────────────────────────────────── */

@media (max-width: 600px) {
	.ofhf-kort-bilde-wrap img {
		height: 200px;
	}

	.ofhf-kort-mottaker-liste {
		column-count: 1;
	}

	.ofhf-ts-aar {
		font-size: 2.5rem;
	}

	.ofhf-ts-liste ul {
		column-count: 1;
	}
}