/* Firmagaven konto — guideeffektene (1.8.20).
   To effekter cc aktiverer med klasser i Breakdance (se bruksanvisning-cc.md):
     .fg-guide-klebrig  — to spalter, høyre bildespalte klebrig m/ bildebytte (JS)
     .fg-guide-fast     — fast bakgrunn med paneler som ruller over (ren CSS)
   Pluss panel-/notat-/etikettstiler i profilen.
   Fargene under speiler paletten i gavevelger.css — der er de samme verdiene
   scopet til .fg-gavevelger (navnene --fg-navy/--fg-burg…) og finnes ikke på
   guidesidene; her defineres de på :root med bestillingens navn. Én kilde per
   skop, ingen dobbeltdefinisjon i samme skop. */

:root {
	--fg-marine: #002A3A;
	--fg-lys: #DFF3FA;
	--fg-aksent: #7B2436;
	--fg-aksent-morkere: #5E1A28;
	--fg-sidegra: #F3F4F5; /* 1.8.35: sideflaten utenfor den lyseblå ramma (seriene-forklart) */
	/* Header-høyden på live er 81 px (sticky .bde-section-24-100, målt 18.8);
	   klebrig topp = header + 24 px luft. Endres headeren, endres bare denne. */
	--fg-guide-header: 81px;
	--fg-guide-klebrig-topp: calc(var(--fg-guide-header) + 24px);
}

/* ==========================================================================
   1. Klebrig bildespalte (.fg-guide-klebrig)
   cc: klassen på seksjonen; klassen fg-guide-bilde på bildespalten (kolonnen
   med bildeelementet); data-fg-bilde="URL" (+ valgfri data-fg-alt) på hver
   tekstblokk i venstre spalte. guide.js bytter bildet med 0,4 s overtoning.
   ========================================================================== */

.fg-guide-klebrig .fg-guide-bilde {
	position: sticky;
	top: var(--fg-guide-klebrig-topp);
	align-self: flex-start;
}

/* Bildestabelen guide.js bygger rundt bildet: to lag over hverandre som
   kryssfader. Reservelaget ligger under til det tas i bruk. */
.fg-guide-klebrig .fg-guide-stabel {
	position: relative;
}

.fg-guide-klebrig .fg-guide-stabel img {
	display: block;
	width: 100%;
	height: auto;
	transition: opacity 0.4s ease;
}

.fg-guide-klebrig .fg-guide-stabel img.fg-guide-lag {
	position: absolute;
	inset: 0;
	height: 100%;
	object-fit: cover;
	opacity: 0;
}

.fg-guide-klebrig .fg-guide-stabel img.fg-guide-lag.fg-guide-lag--synlig {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.fg-guide-klebrig .fg-guide-stabel img {
		transition: none;
	}
}

/* Mobilbildet guide.js setter inn over hver tekstblokk. */
img.fg-guide-mobilbilde {
	display: none;
	width: 100%;
	height: auto;
	margin: 0 0 16px;
}

/* Maks 767 px (Breakdance Phone Landscape): klebrigheten av, fellesspalten
   skjult, mobilbildene fram. */
@media (max-width: 767px) {
	.fg-guide-klebrig .fg-guide-bilde {
		display: none;
	}
	img.fg-guide-mobilbilde {
		display: block;
	}
}

/* ==========================================================================
   2. Fast bakgrunn med paneler over (.fg-guide-fast) — ren CSS, ingen JS,
   IKKE background-attachment: fixed (virker ikke på iOS).
   cc: klassen på seksjonen. FØRSTE barn i seksjonsinnholdet = bakgrunnslaget
   (en div med bakgrunnsbildet); resten = paneler. Sløret ligger som eget
   pseudo-lag på bakgrunnen, så cc ikke trenger bygge det.
   ========================================================================== */

.fg-guide-fast {
	position: relative;
}

.fg-guide-fast > .section-container > :first-child,
.fg-guide-fast > :first-child:not(.section-container) {
	position: sticky;
	top: 0;
	height: 100vh;
	width: 100%;
	margin-bottom: -100vh; /* innholdet etterpå starter oppå bakgrunnen */
	overflow: hidden;
	background-size: cover;
	background-position: center;
}

/* Marineblått slør, 55 %, som eget lag over bakgrunnsbildet. */
.fg-guide-fast > .section-container > :first-child::after,
.fg-guide-fast > :first-child:not(.section-container)::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(0, 42, 58, 0.55); /* --fg-marine i 55 % */
	pointer-events: none;
}

/* Panelene (alle barn etter bakgrunnen) ruller over med 60 vh luft mellom. */
.fg-guide-fast > .section-container > :not(:first-child),
.fg-guide-fast > :not(:first-child):not(.section-container) {
	position: relative;
	z-index: 1;
	margin-top: 60vh;
}

.fg-guide-fast > .section-container > :last-child,
.fg-guide-fast > :last-child:not(.section-container):not(:first-child) {
	margin-bottom: 20vh; /* litt luft før neste seksjon tar over */
}

/* ==========================================================================
   3. Panel, notatblokk og etikett i profilen
   ========================================================================== */

.fg-guide-panel {
	box-sizing: border-box;
	width: 100%;
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	background: #FFFFFF;
	padding: 28px;
	box-shadow: 0 12px 40px rgba(0, 42, 58, 0.25);
}

@media (min-width: 768px) {
	.fg-guide-panel {
		padding: 40px;
	}
}

.fg-guide-notat {
	background: var(--fg-lys);
	border-left: 4px solid var(--fg-aksent);
	padding: 16px 20px;
	/* 1.8.35: linjeskiftene i notatet bevares (valgt fremfor nl2br — én
	   mekanisme). «Kort versjon»-blokka er én linje per serie. */
	white-space: pre-line;
}

/* 1.8.36 sak 2: notatets overskriftslinje («Kort versjon:», egen linje
   siden cc-endringen) — 20 px; fet kommer fra strong-taggen. */
.fg-guide-notat > strong:first-child {
	font-size: 20px;
}

.fg-guide-etikett {
	display: block;
	font-family: "Source Sans 3", Lato, Arial, sans-serif;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fg-aksent);
}

/* ==========================================================================
   1.8.22 — guidesider tegnet av pluginen (fg_guide): rammeverk, hero,
   seksjoner, skillebånd, avslutning, lenkeliste og hub-arkivet. Bygget på
   variablene øverst i fila; kontrast ≥ 4,5:1 (hvit på marine = 12:1,
   burgunder på hvit = 7,6:1, marine på lys = 10:1); ingen serif; etiketter
   er korte ord i versaler, aldri hele setninger.
   ========================================================================== */

.fg-guide {
	font-family: Lato, Arial, sans-serif;
	color: #333333;
	line-height: 1.6;
}

.fg-guide-ramme {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 24px;
}

.fg-guide-h1 {
	font-family: Lato, Arial, sans-serif;
	font-size: clamp(30px, 4.5vw, 44px);
	line-height: 1.15;
	color: var(--fg-marine);
	margin: 10px 0 14px;
}

.fg-guide-h2 {
	font-family: Lato, Arial, sans-serif;
	font-size: clamp(21px, 3vw, 27px);
	line-height: 1.25;
	color: var(--fg-marine);
	margin: 6px 0 10px;
}

.fg-guide-hero {
	padding: 48px 0 28px;
}

.fg-guide-hero .fg-guide-ramme {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	gap: 40px;
	align-items: center;
}

.fg-guide-hero__bilde img,
.fg-guide-herobilde {
	display: block;
	width: 100%;
	height: auto;
}

.fg-guide-hero .fg-guide-ramme:has(> .fg-guide-hero__tekst:only-child),
.fg-guide--hub .fg-guide-hero .fg-guide-ramme {
	grid-template-columns: minmax(0, 1fr);
	max-width: 860px;
}

.fg-guide-ingress {
	font-size: 18px;
	color: #333333;
	max-width: 62ch;
	margin: 0;
}

.fg-guide-tekst p {
	margin: 0 0 14px;
}

.fg-guide-passer {
	font-size: 15px;
	color: var(--fg-marine);
	background: var(--fg-lys);
	display: inline-block;
	padding: 6px 12px;
	margin: 4px 0 0;
	/* 1.8.35 (endrer 1.8.33 pkt. 13): streken på VENSTRE side, i aksent-
	   burgunder — gjelder alle guider, ikke bare seriekortene. */
	border-left: 4px solid var(--fg-aksent);
}

.fg-guide-seksjonslenker a,
.fg-guide-lenkeliste a {
	color: var(--fg-marine);
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
	margin-right: 14px;
}

.fg-guide-seksjonslenker a:hover,
.fg-guide-lenkeliste a:hover {
	color: var(--fg-aksent);
}

.fg-guide-seksjon {
	padding: 26px 0;
}

.fg-guide-seksjonsbilde {
	display: block;
	width: 100%;
	height: auto;
	margin: 6px 0 14px;
}

/* Klebrig layout: kolonnene (55/45 som prototypen). */
.fg-guide-kolonner {
	display: grid;
	grid-template-columns: minmax(0, 55fr) minmax(0, 45fr);
	gap: 40px;
	align-items: start;
	padding-top: 12px;
	padding-bottom: 32px;
}

.fg-guide-kolonne-bilde img {
	display: block;
	width: 100%;
	height: auto;
}

@media (max-width: 767px) {
	.fg-guide-hero .fg-guide-ramme,
	.fg-guide-kolonner {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
	}
}

/* Skillebånd: marine flate med bilde og hvit tekst (kontrast via flaten). */
.fg-guide-baand {
	background: var(--fg-marine);
	color: #FFFFFF;
	margin: 26px 0;
	position: relative;
	overflow: hidden;
}

.fg-guide-baand img.fg-guide-baandbilde {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.35; /* over marine: effektiv kontrast for hvit tekst holdes ≥ 4,5:1 */
}

.fg-guide-baand__tekst {
	position: relative;
	max-width: 1120px;
	margin: 0 auto;
	padding: 44px 24px;
}

.fg-guide-baand__tekst h2,
.breakdance .fg-guide-baand__tekst h2,
.breakdance .fg-guide-baand__tekst .fg-guide-h2 {
	color: #FFFFFF;
}

.fg-guide-baand__nummer {
	display: block;
	font-family: "Source Sans 3", Lato, Arial, sans-serif;
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.1em;
	color: var(--fg-lys);
}

/* 1.8.30: full containerbredde — 62ch brakk teksten i tre linjer. */
.fg-guide-baand__tekst p {
	max-width: none;
	margin: 0;
}

/* 1.8.30: belte og bukse på båndets H2 — hvit uansett hva temaet finner på
   (1.8.24-låsen virket først da 1.8.28 kom på; låses nå med spesifisitet
   godt over Breakdance sine globale overskriftsregler). */
.breakdance .fg-guide .fg-guide-baand .fg-guide-baand__tekst h2.fg-guide-h2,
.breakdance .fg-guide .fg-guide-baand .fg-guide-baand__tekst h2,
.fg-guide .fg-guide-baand .fg-guide-baand__tekst h2 {
	color: #FFFFFF;
}

/* Fast layout: bakgrunnslaget + paneler (effekt-CSS lenger opp i fila). */
.fg-guide-fastbakgrunn {
	background-size: cover;
	background-position: center;
	background-color: var(--fg-marine);
}

/* Enkel layout: smalere tekstbredde. */
.fg-guide-enkel {
	max-width: 820px;
}

/* Notat (gjenbruker .fg-guide-notat fra 1.8.20) i innholdsbredden. */
.fg-guide .fg-guide-notat {
	margin: 8px 0 20px;
	max-width: 820px;
}

/* 1.8.30: på seriene-forklart (klebrig) står notatet «Kort versjon» rett
   under heroen i FULL containerbredde. */
.fg-guide--klebrig .fg-guide-notat {
	max-width: none;
	margin-top: 20px;
	padding: 24px;
}

/* Avslutning: marine eller lys flate. */
.fg-guide-avslutning {
	margin-top: 40px;
	padding: 52px 0;
}

/* 1.8.31: på huben ligger den marine avslutningen rett etter tallstripa —
   uten hvitt mellomrom. */
.fg-guide--hub .fg-guide-avslutning {
	margin-top: 0;
}

.fg-guide-avslutning--marine {
	background: var(--fg-marine);
	color: #FFFFFF;
}

.fg-guide-avslutning--marine .fg-guide-h2,
.breakdance .fg-guide-avslutning--marine .fg-guide-h2,
.breakdance .fg-guide-avslutning--marine h2 {
	color: #FFFFFF;
}

.fg-guide-avslutning--lys {
	background: var(--fg-lys);
	color: #333333;
}

.fg-guide-etikett--lys {
	color: var(--fg-lys);
}

.fg-guide-knapp,
a.fg-guide-knapp,
.breakdance a.fg-guide-knapp,
.breakdance a.fg-guide-knapp:visited,
.fg-guide-knapp:visited {
	display: inline-block;
	margin-top: 10px;
	padding: 13px 24px;
	background: var(--fg-aksent);
	color: #FFFFFF;
	font-weight: 700;
	text-decoration: none;
	transition: background-color 0.18s;
}

.fg-guide-knapp:hover,
.breakdance a.fg-guide-knapp:hover,
.breakdance a.fg-guide-knapp:focus-visible,
.breakdance a.fg-guide-knapp:active,
.fg-guide-knapp:focus-visible {
	background: var(--fg-aksent-morkere);
	color: #FFFFFF;
}

/* Lenkeliste nederst. */
.fg-guide-lenkeliste {
	padding: 28px 0 6px;
}

.fg-guide-lenkeliste ul {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 8px;
}

/* Hub-arkivet — 1.8.28: kortene i lik høyde og bredde. Fast bildehøyde
   160 px (object-fit: cover) med gradienten som før over bildet, kortet
   som flex-kolonne på marine flate, tekst og «Les guiden →» festet
   nederst; griden strekker kortene like høye. */
.fg-guide-hubkort {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	padding-bottom: 40px;
	align-items: stretch;
}

@media (max-width: 767px) {
	.fg-guide-hubkort {
		grid-template-columns: minmax(0, 1fr);
	}
}

.fg-guide-kort {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0, 42, 58, 0.14);
	background: var(--fg-marine);
	min-height: 340px;
	text-decoration: none;
}

/* 1.8.31: MÅLT PÅ LIVE — «.breakdance img { max-width:100%; height:auto }»
   i Breakdance sin global-settings.css lastes ETTER guide.css og vant på
   rekkefølge ved lik spesifisitet (0,1,1); img-høyden kollapset til
   naturlig forhold og fløt ut av 160 px-feltet (som manglet overflow).
   Fiks: overflow hidden på feltet + img-regler med .breakdance-spesifisitet
   OG !important på målene som har tapt fem ganger. */
.fg-guide-kort__bilde {
	position: relative;
	flex: 0 0 auto;
	height: 160px !important;
	overflow: hidden;
}

.fg-guide-kort__bilde img,
.breakdance .fg-guide-kort__bilde img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: 100%;
	object-fit: cover;
}

/* 1.8.32: bildet vises RENT — gradienten ligger bare i de nederste 40 px
   av bildefeltet, fra gjennomsiktig til marine, som myk overgang til
   tekstflaten. Ingen tone over resten. */
.fg-guide-kort__bilde::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 40px;
	background: linear-gradient(to bottom, rgba(0, 42, 58, 0) 0%, var(--fg-marine) 100%);
}

.fg-guide-kort__tekst {
	position: relative;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	justify-content: flex-end;
	padding: 22px;
	color: #FFFFFF;
}

.fg-guide-kort__etikett {
	font-family: "Source Sans 3", Lato, Arial, sans-serif;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fg-lys);
}

.fg-guide-kort__tekst h2,
.breakdance .fg-guide-kort__tekst h2 {
	font-size: 21px;
	line-height: 1.25;
	color: #FFFFFF;
	/* 1.8.38 sak 4: 12 px mellom overskrift og brødtekst i hub-kortene
	   (lå som midlertidig CSS hos cc). */
	margin: 6px 0 12px;
}

.fg-guide-kort__tekst p {
	font-size: 14px;
	margin: 0 0 8px;
	color: #FFFFFF;
}

.fg-guide-kort__les,
.breakdance .fg-guide-kort .fg-guide-kort__les {
	font-weight: 700;
	color: #FFFFFF;
	text-decoration: none;
}

/* Hele kortet: hvit tekst i alle tilstander — Breakdance sine globale
   lenke-/overskriftsfarger slår ikke gjennom på mørk flate. */
.breakdance a.fg-guide-kort,
.breakdance a.fg-guide-kort:visited,
.breakdance a.fg-guide-kort:hover,
a.fg-guide-kort,
a.fg-guide-kort:visited {
	color: #FFFFFF;
	text-decoration: none;
}

/* Tallstripa. */
.fg-guide-tallstripe {
	background: var(--fg-lys);
	padding: 34px 0;
	margin: 10px 0 0;
}

.fg-guide-tallgrid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	text-align: center;
}

@media (max-width: 767px) {
	.fg-guide-tallgrid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.fg-guide-tall__verdi {
	display: block;
	font-size: 30px;
	font-weight: 800;
	color: var(--fg-marine);
}

.fg-guide-tall__etikett {
	font-size: 14px;
	color: #333333;
}

/* ==========================================================================
   1.8.24 — flateregelen og gruppe-panelet i fast layout.
   Mørk flate finnes BARE på skillebånd (klebrig/enkel layout) og
   avslutningen med flate marine — ALDRI på seksjoner. I fast layout er
   skillebåndet et vanlig hvitt panel (fg-guide-panel--gruppe) med H2 i
   marine og de påfølgende seksjonene som rader skilt av tynne linjer.
   Kontrast: marine (#002A3A) på hvit = 12,8:1; tekst #333 på hvit = 12,6:1.
   ========================================================================== */

.fg-guide-panel--gruppe .fg-guide-h2,
.breakdance .fg-guide-panel--gruppe .fg-guide-h2 {
	color: var(--fg-marine);
	margin-top: 2px;
}

.fg-guide-h3,
.breakdance .fg-guide .fg-guide-h3 {
	font-family: Lato, Arial, sans-serif;
	font-size: 18px;
	line-height: 1.3;
	color: var(--fg-marine);
	margin: 0 0 6px;
}

.fg-guide-rad {
	padding: 18px 0 6px;
	border-top: 1px solid #E5E7EB;
	margin-top: 14px;
}

.fg-guide-rad:first-of-type {
	border-top: 0;
	margin-top: 6px;
}

.fg-guide-rad .fg-guide-tekst p {
	margin-bottom: 8px;
}

/* ==========================================================================
   1.8.25 — fast layout som redaksjonell side (velg-riktig-kniv):
   marine hero med foto og slør, tallstripe, grunnstamme-kort med produktkort,
   tilleggskort på lys flate og «etter kjøpet» i to spalter. Flateregelen fra
   1.8.24 står: mørk flate BARE hero (over foto m/ slør) og avslutning.
   Kontrast: hvit på marine 15,1:1; hvit over foto + slør er verst ved
   tekstkantens 55 %-punkt, der sløret er ≥ 92 % marine (≈ 12:1, målt som
   kortgradienten i 1.8.24); burgunder etikett på hvit 9,8:1.
   ========================================================================== */

/* Hero (1.8.26-tillegget): halvert — maks 40 vh på desktop. Tekst i
   venstre halvdel, dekkende foto i høyre halvdel med marineblått slør
   (heldekkende marine til 48 %, deretter ned mot 55 % opasitet). Ingen
   knapper — tekstlenker med pil under ingressen. */
.fg-guide-fasthero {
	position: relative;
	background: var(--fg-marine);
	color: #FFFFFF;
	overflow: hidden;
	padding: 36px 0;
}

@media (min-width: 768px) {
	.fg-guide-fasthero {
		/* 1.8.27: gulv på 340 px — 40 vh på et lavt vindu skal aldri
		   klemme heroen (innhold ≈ 334 px målt på live). */
		max-height: max(40vh, 340px);
		display: flex;
		align-items: center;
	}
	.fg-guide-fasthero__ramme {
		width: 100%;
	}
}

img.fg-guide-fasthero__foto {
	position: absolute;
	top: 0;
	right: 0;
	width: 50%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}

/* Sløret må ligge OVER fotoet (fotoet kommer senere i DOM) og under teksten. */
.fg-guide-fasthero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, var(--fg-marine) 48%, rgba(0, 42, 58, 0.55) 100%);
	pointer-events: none;
	z-index: 1;
}

.fg-guide-fasthero__ramme {
	position: relative;
	z-index: 2;
}

.fg-guide-fasthero__tekst {
	max-width: 50%;
}

/* 1.8.35 pkt. 3: tekstspalten i heroen (tittel + ingress) utvides til
   760 px fra 1024 px skjermbredde — ingressen skal bryte på 3–4 linjer,
   ikke 6. Gjelder alle layouter (fasthero OG standard-hero/hub); mobil
   uendret. Knivene i fotoet ligger i høyre tredjedel — sløret ligger
   over fotoet der teksten går lengst ut. */
@media (min-width: 1024px) {
	.fg-guide-fasthero__tekst,
	.fg-guide-hero__tekst {
		max-width: 760px;
	}
}

.fg-guide-fasthero .fg-guide-h1,
.breakdance .fg-guide-fasthero .fg-guide-h1,
.breakdance .fg-guide-fasthero h1 {
	color: #FFFFFF;
}

.fg-guide-fasthero .fg-guide-ingress {
	color: #FFFFFF;
}

/* Tekstlenkene under ingressen: hvite, med pil, uten understreking. */
.fg-guide-fasthero__lenker {
	margin: 16px 0 0;
}

.fg-guide-fasthero__lenke,
.breakdance .fg-guide a.fg-guide-fasthero__lenke,
.breakdance .fg-guide a.fg-guide-fasthero__lenke:visited {
	color: #FFFFFF;
	font-weight: 700;
	text-decoration: none;
	margin-right: 18px;
}

.breakdance .fg-guide a.fg-guide-fasthero__lenke:hover,
.fg-guide-fasthero__lenke:hover {
	color: var(--fg-lys);
	text-decoration: none;
}

@media (max-width: 767px) {
	.fg-guide-fasthero {
		padding: 32px 0 36px;
	}
	/* Foto som vanlig bilde under teksten — sløret og spaltingen er av. */
	img.fg-guide-fasthero__foto {
		position: static;
		display: block;
		width: calc(100% + 48px);
		height: auto;
		margin: 18px -24px -36px;
	}
	.fg-guide-fasthero::before {
		display: none;
	}
	.fg-guide-fasthero__tekst {
		max-width: none;
	}
	.fg-guide-fasthero__ramme {
		display: flex;
		flex-direction: column;
	}
}

/* Tallstripa rett under heroen (inntil tre celler). */
.fg-guide-fasttall {
	background: var(--fg-lys);
	padding: 30px 0;
}

.fg-guide-fasttall__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	text-align: center;
}

/* Tynne linjer mellom cellene (bestillingen A2). */
.fg-guide-fasttall__celle + .fg-guide-fasttall__celle {
	border-left: 1px solid rgba(0, 42, 58, 0.18);
}

.fg-guide-fasttall__verdi {
	display: block;
	font-size: 24px;
	font-weight: 800;
	color: var(--fg-marine);
}

.fg-guide-fasttall__tekst {
	font-size: 14px;
	color: #333333;
}

/* 1.8.27 (trappestripa): burgunder tall, og celler som ankerlenker til
   kortene — uten understreking, hele cellen klikkbar. */
.fg-guide-fasttall__nr {
	color: var(--fg-aksent);
}

a.fg-guide-fasttall__celle,
.breakdance .fg-guide a.fg-guide-fasttall__celle,
.breakdance .fg-guide a.fg-guide-fasttall__celle:visited {
	display: block;
	color: inherit;
	text-decoration: none;
}

a.fg-guide-fasttall__celle:hover .fg-guide-fasttall__verdi,
.breakdance .fg-guide a.fg-guide-fasttall__celle:hover .fg-guide-fasttall__verdi {
	color: var(--fg-aksent);
}

/* Ankerne fra trappestripa lander under den klebrige headeren. */
.fg-guide-fastkort[id] {
	scroll-margin-top: calc(var(--fg-guide-header) + 12px);
}

@media (max-width: 767px) {
	.fg-guide-fasttall__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}
	.fg-guide-fasttall__celle + .fg-guide-fasttall__celle {
		border-left: 0;
		border-top: 1px solid rgba(0, 42, 58, 0.18);
		padding-top: 10px;
	}
}

/* Inngangen over kortgruppene: etikett i burgunder Source Sans 600 (fra
   .fg-guide-etikett), H2 39 px, ingress 18 px grå. 1.8.28: FULL
   containerbredde (som kortgriden) — 720 px-taket brakk H2 i to og
   ingressen i tre linjer. */
.fg-guide-inngang {
	max-width: none;
	padding: 6px 0 18px;
}

.fg-guide-inngang .fg-guide-h2,
.breakdance .fg-guide .fg-guide-inngang .fg-guide-h2 {
	font-size: 39px;
	line-height: 1.15;
}

.fg-guide-inngang .fg-guide-ingress {
	font-size: 18px;
	color: #3D5560;
	max-width: none; /* 1.8.28: basisregelens 62ch brakk ingressen i tre linjer */
}

/* 1.8.36 sak 1: hero-ingressen skal følge tekstspalten (760 px fra 1024 px,
   1.8.35 pkt. 3) — basisregelens 62ch (= 647 px ved 18 px, målt på live)
   satt sitt eget tak INNI spalten og ga fem linjer på seriene-forklart.
   62ch-taket består for ingresser i brødinnholdet. */
.fg-guide-fasthero .fg-guide-ingress,
.fg-guide-hero .fg-guide-ingress {
	max-width: none;
}

/* Grunnstammen (hvit flate) og tillegg (lys flate). */
.fg-guide-grunn {
	padding: 44px 0 36px;
	scroll-margin-top: calc(var(--fg-guide-header) + 12px); /* ankeret #de-tre lander under sticky header */
}

/* 1.8.26: tillegget står på en rolig lys grå flate som i prototypen —
   lyseblått er forbeholdt notatet og tallstripa. */
.fg-guide-tillegg {
	background: #F5F5F2;
	padding: 40px 0 44px;
	margin-top: 8px;
}

/* Kortene: hvit flate, burgunder venstrekant, stort blekt nummer.
   1.8.26: målene fulgt opp mot Lovable-prototypen (Rogers punktliste). */
.fg-guide-fastkort {
	position: relative;
	background: #FFFFFF;
	border-left: 4px solid var(--fg-aksent);
	box-shadow: 0 8px 30px rgba(0, 42, 58, 0.12);
	overflow: hidden;
}

/* Kort 2/3 og tilleggskort: bildet som smalt bånd øverst — FAST 200 px.
   1.8.31: med !important + .breakdance-variant, samme «height:auto»-taper
   som hub-bildet (målt på live — DET var årsaken til ulik båndhøyde). */
.fg-guide-fastkort__bilde,
.breakdance img.fg-guide-fastkort__bilde {
	display: block;
	width: 100% !important;
	height: 200px !important;
	object-fit: cover;
}

.fg-guide-fastkort__innhold {
	position: relative; /* teksten ligger over dekortallet */
	z-index: 1;
	padding: 24px;
}

/* Etikett til venstre, lengdepillen høyrestilt på samme linje (pkt. 2). */
.fg-guide-fastkort__topp {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 8px;
}

.fg-guide-fastkort__topp .fg-guide-etikett {
	display: inline-block;
}

/* 1.8.27: vanlige bokstaver («20 cm», ikke «20 CM») — versalene fra
   1.8.26-prototypen utgår; bakgrunnen er den bestilte lys grå. */
.fg-guide-pille {
	display: inline-block;
	background: #EEF1F3;
	color: var(--fg-marine);
	font-size: 13px;
	font-weight: 600;
	padding: 4px 12px;
	border-radius: 999px;
	white-space: nowrap;
}

/* Kortoverskrift og brødtekst (pkt. 2). */
.fg-guide-fastkort .fg-guide-h3,
.breakdance .fg-guide .fg-guide-fastkort .fg-guide-h3 {
	font-family: Lato, Arial, sans-serif;
	font-size: 31px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 10px;
}

.fg-guide-tillegg .fg-guide-fastkort .fg-guide-h3,
.breakdance .fg-guide .fg-guide-tillegg .fg-guide-fastkort .fg-guide-h3 {
	font-size: 25px; /* tilleggskortene ett hakk under grunnstammen */
}

.fg-guide-fastkort .fg-guide-tekst {
	font-size: 16px;
	line-height: 1.6;
	color: #3D5560;
}

/* Stort tall: 96 px, burgunder 25 % (1.8.27 — 12 % var nesten usynlig),
   nederst til høyre med 24 px luft fra kortbunnen, delvis bak teksten
   (innholdet ligger over med z-index). Gjelder ALLE tre kortene — også
   tallet 1 på det brede (Rogers presisering 29.8: ikke oppe i bildet). */
.fg-guide-fastkort__nr {
	position: absolute;
	bottom: 24px;
	right: 14px;
	z-index: 0;
	font-size: 96px;
	font-weight: 800;
	line-height: 1;
	color: var(--fg-aksent);
	opacity: 0.25;
	pointer-events: none;
}

/* Det brede kortet (nr. 1): bildet fyller venstre 40 % i full korthøyde,
   teksten til høyre med 48 px luft (pkt. 1). To-spaltingen gjelder bare
   når kortet faktisk har bilde (--medbilde) — uten bilde ville innholdet
   havnet alene i 40 %-kolonnen. */
@media (min-width: 768px) {
	.fg-guide-fastkort--bred.fg-guide-fastkort--medbilde {
		display: grid;
		grid-template-columns: minmax(0, 40fr) minmax(0, 60fr);
		align-items: stretch;
	}
	.fg-guide-fastkort--bred .fg-guide-fastkort__bilde,
	.breakdance .fg-guide-fastkort--bred img.fg-guide-fastkort__bilde {
		height: 100% !important; /* fullhøyde, ikke båndformatet */
		object-fit: cover;
	}
	.fg-guide-fastkort--bred .fg-guide-fastkort__innhold {
		padding: 48px;
	}
}

/* Kort side om side. 1.8.28 (utvider 1.8.27-grepet fra grunnstammen til
   ALLE kortpar, også tillegget): lik høyde innen hver rad — innholdet
   toppjustert, kategorilenkene festet nederst, tallet står absolutt. */
.fg-guide-fastkort-par {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px;
	margin-top: 32px;
	align-items: stretch;
}

.fg-guide-fastkort-par .fg-guide-fastkort {
	display: flex;
	flex-direction: column;
}

.fg-guide-fastkort-par .fg-guide-fastkort__innhold {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.fg-guide-fastkort-par .fg-guide-pil-lenker {
	margin-top: auto;
	padding-top: 14px;
}

@media (min-width: 768px) {
	.fg-guide-grunn .fg-guide-fastkort-par {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	}
	/* Fem tilleggskort legges som tre + to, ikke to rader pluss ett. */
	.fg-guide-tillegg .fg-guide-fastkort-par {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 24px;
	}
}

@media (max-width: 767px) {
	.fg-guide-fastkort-par {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
	}
}

/* Notatet: som før (lys flate, burgunder kant), men 24 px padding og samme
   bredde som kortene (pkt. 5). */
.fg-guide-grunn .fg-guide-notat {
	margin-top: 32px;
	max-width: none;
	padding: 24px;
}

/* Pil-lenkene (kategorilenkene) på kortene — 1.8.27: vanlige bokstaver,
   Lato 700, 16 px, burgunder, uten understreking (versalene utgår).
   Etter at produktradene i hovedkortene er tatt ut, er dette veien videre. */
.fg-guide-pil-lenker {
	margin: 14px 0 0;
}

.fg-guide-pil-lenker a,
.breakdance .fg-guide .fg-guide-pil-lenker a,
.breakdance .fg-guide .fg-guide-pil-lenker a:visited {
	color: var(--fg-aksent);
	font-family: Lato, Arial, sans-serif;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	margin-right: 16px;
}

.fg-guide-pil-lenker a:hover,
.breakdance .fg-guide .fg-guide-pil-lenker a:hover {
	color: var(--fg-aksent-morkere);
	text-decoration: none;
}

/* Produktraden nederst på grunnstamme-kort (1.8.26, pkt. 3): en rolig rad —
   lite bilde 72 px, navn i Lato 700, varenummer og pris i én linje under,
   og en tekstlenke «Se kniven →» til høyre. Ingen knapp. */
.fg-guide-produkt {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	border-top: 1px solid #E5E7EB;
	margin-top: 18px;
	padding-top: 18px;
}

.fg-guide-produkt__bilde {
	flex: 0 0 72px;
}

.fg-guide-produkt__bilde img {
	display: block;
	width: 72px;
	height: auto;
}

.fg-guide-produkt__tekst {
	flex: 1 1 180px;
	min-width: 0;
}

.fg-guide-produkt__navn,
.breakdance .fg-guide .fg-guide-produkt a.fg-guide-produkt__navn,
.breakdance .fg-guide .fg-guide-produkt a.fg-guide-produkt__navn:visited {
	display: block;
	color: var(--fg-marine);
	font-family: Lato, Arial, sans-serif;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	line-height: 1.3;
}

.breakdance .fg-guide .fg-guide-produkt a.fg-guide-produkt__navn:hover {
	color: var(--fg-aksent);
}

.fg-guide-produkt__info {
	display: block;
	font-size: 14px;
	color: #3D5560;
	margin-top: 2px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.fg-guide-produkt__info del {
	color: #646970;
	font-weight: 400;
	margin-right: 4px;
}

.fg-guide-produkt__mva {
	font-size: 13px;
	color: #646970;
}

/* «Se kniven →» — tekstlenke i burgunder, uten understreking. */
.fg-guide-produkt__se,
.breakdance .fg-guide .fg-guide-produkt a.fg-guide-produkt__se,
.breakdance .fg-guide .fg-guide-produkt a.fg-guide-produkt__se:visited {
	margin-left: auto;
	color: var(--fg-aksent);
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
}

.breakdance .fg-guide .fg-guide-produkt a.fg-guide-produkt__se:hover {
	color: var(--fg-aksent-morkere);
	text-decoration: none;
}

/* «Etter kjøpet»: to spalter — tekst/knapp til venstre, nummererte rader. */
.fg-guide-etterkjop {
	padding: 44px 0 40px;
}

.fg-guide-etterkjop__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: 48px;
	align-items: start;
}

@media (max-width: 767px) {
	.fg-guide-etterkjop__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}
}

/* Knappen og pil-lenka står på samme linje (som i prototypen). */
.fg-guide-etterkjop__venstre .fg-guide-pil-lenker {
	display: inline-block;
	margin: 10px 0 0 18px;
	vertical-align: middle;
}

.fg-guide-etterkjop__rad {
	display: flex;
	gap: 16px;
	/* 1.8.35 (tillegg 4): litt mer luft rundt radene når siffer og
	   overskrift vokser (20/25 px) — brødteksten er uendret. */
	padding: 18px 0;
	border-top: 1px solid #E5E7EB;
}

/* 1.8.35 (tillegg 4): overskriftene i den nummererte lista på H3-trinnet
   (25 px) — vekten som før. Gjelder komponenten overalt i guidene. */
.fg-guide-etterkjop__rad .fg-guide-h3,
.breakdance .fg-guide .fg-guide-etterkjop__rad .fg-guide-h3 {
	font-size: 25px;
	line-height: 1.25;
}

.fg-guide-etterkjop__rad:first-child {
	border-top: 0;
	padding-top: 4px;
}

.fg-guide-etterkjop__nr {
	flex: 0 0 auto;
	font-family: "Source Sans 3", Lato, Arial, sans-serif;
	font-weight: 700;
	/* 1.8.35 (tillegg 4): sifrene opp fra 14 til 20 px — farge og vekt
	   som før; padding justert så tallet ligger på overskriftens linje. */
	font-size: 20px;
	letter-spacing: 0.1em;
	color: var(--fg-aksent);
	padding-top: 5px;
}

/* 1.8.26: H2-ene i «Etter kjøpet» og den marine avslutningen på 36 px som
   i prototypen (inngangene ligger på 39 px, pkt. 4). */
.fg-guide-etterkjop .fg-guide-h2,
.breakdance .fg-guide .fg-guide-etterkjop .fg-guide-h2,
.fg-guide--fast .fg-guide-avslutning .fg-guide-h2,
.breakdance .fg-guide--fast .fg-guide-avslutning .fg-guide-h2 {
	font-size: 36px;
	line-height: 1.15;
}

.fg-guide-etterkjop__rad p {
	margin: 0;
}


/* ==========================================================================
   1.8.30 — «Etter kjøpet» med bilde, og seriene som vekslende kort.
   ========================================================================== */

/* Etter kjøpet (1.8.32 — den godkjente layouten): venstre spalte har
   ingressen, bildet i full spaltebredde m/ 8 px radius, og knappen +
   lenka rett under bildet; høyre spalte har radene. Mobil: samme
   rekkefølge i én kolonne (basegridens 767-regel). */
img.fg-guide-etterkjop__foto,
.breakdance img.fg-guide-etterkjop__foto {
	display: block;
	width: 100% !important;
	height: auto !important;
	border-radius: 8px;
	margin: 6px 0 18px;
}

/* Seriene (klebrig layout) som vekslende kort: tynn ramme, 8 px radius,
   hvit flate uten skygge; tekst og bilde i hver sin spalte, bildet bytter
   side for annenhver serie; 24 px luft mellom kortene. */
/* 1.8.32 pkt. 9: kortgruppa per merke ligger i en felles ramme på lyseblå
   flate — kortene inni forblir hvite. */
.fg-guide-seriekortliste {
	display: grid;
	gap: 24px;
	background: #DFF3FA;
	border: 1px solid #DDE3E6;
	border-radius: 8px;
	padding: 32px;
	margin-top: 26px;
	margin-bottom: 34px;
}

@media (max-width: 767px) {
	.fg-guide-seriekortliste {
		padding: 16px;
	}
}

.fg-guide-seriekort {
	display: grid;
	background: #FFFFFF;
	border: 1px solid #DDE3E6;
	border-radius: 8px;
	overflow: hidden;
}

@media (min-width: 768px) {
	/* 1.8.33 pkt. 12: teksten 2/3 og bildet 1/3 av kortbredden. */
	.fg-guide-seriekort--bilde-hoyre,
	.fg-guide-seriekort--bilde-venstre {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
		align-items: stretch;
	}
	.fg-guide-seriekort--bilde-venstre {
		grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	}
	/* Bildet til høyre: tekstspalten først i DOM-rekkefølgen snus med order. */
	.fg-guide-seriekort--bilde-hoyre .fg-guide-seriekort__bilde {
		order: 2;
	}
	.fg-guide-seriekort--bilde-hoyre .fg-guide-seriekort__tekst {
		order: 1;
	}
}

/* 1.8.32: utklipp på hvit bakgrunn skal IKKE strekkes — contain m/ 24 px
   luft rundt, hvit flate, sentrert (zoom-feltet gjelder ikke her). Hele
   bildefeltet kan være en lenke til butikk-filteret; på hover løftes
   bildet 2 px. */
.fg-guide-seriekort__bilde {
	position: relative;
	min-height: 220px;
	display: block;
	background: #FFFFFF;
}

/* 1.8.33 pkt. 12: FOTO (standard) fyller feltet i full korthøyde med
   cover — miljøbildene tåler beskjæring. UTKLIPP beholder contain med
   24 px luft på hvit flate (pkt. 1 i 1.8.32). */
img.fg-guide-seriekort__foto,
.breakdance img.fg-guide-seriekort__foto {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	box-sizing: border-box;
	object-fit: cover;
	object-position: center;
	transition: transform 0.18s ease;
}

.fg-guide-seriekort--utklipp img.fg-guide-seriekort__foto,
.breakdance .fg-guide-seriekort--utklipp img.fg-guide-seriekort__foto {
	padding: 24px;
	object-fit: contain;
}

a.fg-guide-seriekort__bilde:hover img.fg-guide-seriekort__foto {
	transform: translateY(-2px);
}


.fg-guide-seriekort__tekst {
	padding: 40px;
}

.fg-guide-seriekort__tittel,
.breakdance .fg-guide .fg-guide-seriekort .fg-guide-h3 {
	font-family: Lato, Arial, sans-serif;
	font-size: 31px;
	font-weight: 700;
	line-height: 1.2;
	margin: 6px 0 10px;
}

.fg-guide-seriekort .fg-guide-tekst {
	font-size: 16px;
	line-height: 1.6;
	color: #3D5560;
}

@media (max-width: 767px) {
	/* Mobil: bildet øverst i hvert kort, uansett side. */
	.fg-guide-seriekort {
		grid-template-columns: minmax(0, 1fr);
	}
	.fg-guide-seriekort__bilde {
		order: 0;
		min-height: 0;
	}
	img.fg-guide-seriekort__foto,
	.breakdance img.fg-guide-seriekort__foto {
		position: static;
		height: 200px !important;
		object-fit: cover;
	}
	.fg-guide-seriekort--utklipp img.fg-guide-seriekort__foto,
	.breakdance .fg-guide-seriekort--utklipp img.fg-guide-seriekort__foto {
		padding: 16px;
		object-fit: contain;
	}
	.fg-guide-seriekort__tekst {
		order: 1;
		padding: 22px;
	}
}


/* 1.8.32: Rank Math-brødsmulene øverst i heroen. Hvit 80 % på den mørke
   heroen (fast/klebrig); dempet grå på de lyse heroene (hub/enkel). */
/* 1.8.36 sak 4: brødsmulene som NAVIGASJON — nav > ol > li, skilletegn
   «/» i CSS (ikke lenke, lavere kontrast enn lenkene), lenker m/
   understrek i hvile, siste ledd uten lenke i dempet farge. 14 px,
   strammere enn før. KONTRAST målt mot mørk flate #002A3A: lenker
   #FFFFFF 15,08:1, skilletegn #8AA1AC 5,58:1, siste ledd #B9C7CE
   8,71:1; mot lys flate #F9FAFB: lenker #3D5560 7,54:1, skilletegn
   #5E7078 4,94:1, siste ledd #55666E 5,72:1 — alle ≥ 4,5:1 (WCAG AA). */
.fg-guide-brodsmuler {
	margin: 0 0 10px;
	font-size: 14px;
	line-height: 1.4;
}

.fg-guide-brodsmuler ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
}

.fg-guide-brodsmuler li {
	letter-spacing: 0.01em;
}

.fg-guide-brodsmuler li + li::before {
	content: "/";
	margin: 0 8px;
}

.fg-guide-brodsmuler a,
.breakdance .fg-guide .fg-guide-brodsmuler a,
.breakdance .fg-guide .fg-guide-brodsmuler a:visited {
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

/* Mørk flate (fasthero — velg-riktig-kniv og seriene-forklart). */
.fg-guide-fasthero .fg-guide-brodsmuler li[aria-current="page"] {
	color: #B9C7CE;
}

.fg-guide-fasthero .fg-guide-brodsmuler li + li::before {
	color: #8AA1AC;
}

.fg-guide-fasthero .fg-guide-brodsmuler a,
.breakdance .fg-guide .fg-guide-fasthero .fg-guide-brodsmuler a,
.breakdance .fg-guide .fg-guide-fasthero .fg-guide-brodsmuler a:visited {
	color: #FFFFFF;
}

.fg-guide-fasthero .fg-guide-brodsmuler a:hover,
.breakdance .fg-guide .fg-guide-fasthero .fg-guide-brodsmuler a:hover {
	color: #FFFFFF;
	text-decoration-thickness: 2px;
}

/* Lys flate (hero — slipe-kniv og huben). */
.fg-guide-hero .fg-guide-brodsmuler li[aria-current="page"] {
	color: #55666E;
}

.fg-guide-hero .fg-guide-brodsmuler li + li::before {
	color: #5E7078;
}

.fg-guide-hero .fg-guide-brodsmuler a,
.breakdance .fg-guide .fg-guide-hero .fg-guide-brodsmuler a,
.breakdance .fg-guide .fg-guide-hero .fg-guide-brodsmuler a:visited {
	color: #3D5560;
}

.fg-guide-hero .fg-guide-brodsmuler a:hover,
.breakdance .fg-guide .fg-guide-hero .fg-guide-brodsmuler a:hover {
	color: var(--fg-aksent);
}

/* Mobil: stien skal stå på ÉN rad (1.8.38 sak 1). Marger alene rakk ikke
   — målt ved 324 px: leddene er 307 px + skilletegn mot 261 px tilgjengelig.
   Derfor: ingen linjebryting, og siste ledd (sidens eget navn, uten lenke)
   kortes med ellipse. Skriftstørrelsen står på 14 px, lenkene kortes aldri. */
@media (max-width: 767px) {
	.fg-guide-brodsmuler li + li::before {
		margin: 0 4px;
	}
	.fg-guide-brodsmuler ol {
		flex-wrap: nowrap;
		align-items: baseline;
	}
	.fg-guide-brodsmuler li {
		white-space: nowrap;
		flex: 0 0 auto;
	}
	.fg-guide-brodsmuler li[aria-current="page"] {
		flex: 0 1 auto;
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
	}
}


/* 1.8.32 pkt. 10: «Se også»-lenkene nederst — burgunder, Lato 700, uten
   understreking, med pil, som lenkene ellers i guidene. */
.fg-guide-lenkeliste a,
.breakdance .fg-guide .fg-guide-lenkeliste a,
.breakdance .fg-guide .fg-guide-lenkeliste a:visited {
	color: var(--fg-aksent);
	font-family: Lato, Arial, sans-serif;
	font-weight: 700;
	text-decoration: none;
}

.fg-guide-lenkeliste a::after {
	content: " \2192"; /* pil */
}

.fg-guide-lenkeliste a:hover,
.breakdance .fg-guide .fg-guide-lenkeliste a:hover {
	color: var(--fg-aksent-morkere);
	text-decoration: none;
}


/* 1.8.33 pkt. 11: uthevet ord i overskrifter — burgunder på lyse flater
   (målt 8,5-9,8:1). På mørke flater feiler både #7B2436 (1,5:1) og
   #B8475F (3,0:1) mot marineblå — målt — så der brukes #D4708A (4,66:1). */
.fg-guide-uthev {
	color: var(--fg-aksent);
}

.fg-guide-fasthero .fg-guide-uthev,
.fg-guide-baand__tekst .fg-guide-uthev,
.fg-guide-avslutning--marine .fg-guide-uthev,
.breakdance .fg-guide .fg-guide-fasthero .fg-guide-uthev,
.breakdance .fg-guide .fg-guide-baand__tekst .fg-guide-uthev,
.breakdance .fg-guide .fg-guide-avslutning--marine .fg-guide-uthev {
	color: #D4708A;
}

/* 1.8.35: seriene-forklart (klebrig-layouten) får svak grå sideflate
   utenfor den lyseblå ramma; ramma, kortene, heroen og bunnteksten har
   egne flater og er uendret. (1.8.33-regelen med marine HØYREkant på
   seriekortenes passer-plater er opphevet — se basisregelen.) */
.fg-guide--klebrig {
	background: var(--fg-sidegra);
}
