/* ==========================================================================
   Terapeutkatalogen — designsystem
   Rolig og klinisk. Fargebruken er sparsom med vilje: nar nesten alt er
   navtralt, blir de fa fargede elementene (autorisasjonsmerke, tittelmerknad,
   annonsemerke) lest som informasjon i stedet for dekor.
   Alle tekstfarger er kontrastsjekket mot WCAG 2.1 AA.
   ========================================================================== */

:root {
	/* Papiret er varmt, blekket er kjolig. Bakgrunnen var #f4f7f7 — en kald
	   blagra tone, og det var den enkeltdetaljen som fikk siden til a ligne en
	   offentlig portal mer enn noe annet valg pa den. */
	--tk-ink:          #182220;
	--tk-dempet:       #5f6a68;
	--tk-primar:       #0b6a63;
	--tk-primar-mork:  #085650;
	--tk-flate:        #ffffff;
	--tk-bg:           #f5f4f1;
	--tk-linje:        #e2ded7;
	--tk-linje-ui:     #8a8880;

	/* Én mettet farge pa hele nettstedet, og den betyr én ting: dette har vi
	   sjekket. Alt annet er navtralt.
	   Tidligere hadde vi tre selvstendige merkefarger — turkis for autorisert,
	   rav for alternativ behandling og blalilla for veiledning. Tre mettede
	   farger uten slektskap, som leseren matte laere seg utenat for a lese
	   siden. Na barer teksten i merket forskjellen mellom spor B og C, og
	   fargen barer bare det ene skillet som betyr noe: verifiserbart eller ikke. */
	--tk-merke-a-bg:   #e6f2f0;
	--tk-merke-a-ink:  #0a5a54;
	--tk-merke-b-bg:   #efece6;
	--tk-merke-b-ink:  #5d554a;
	--tk-annonse-bg:   #eae7e1;
	--tk-annonse-ink:  #4a4741;

	--tk-spor-a-ink:   #0a5a54;
	--tk-spor-a-bg:    #e6f2f0;
	--tk-spor-b-ink:   #5d554a;
	--tk-spor-b-bg:    #efece6;
	--tk-spor-c-ink:   #5d554a;
	--tk-spor-c-bg:    #efece6;

	--tk-radius:       10px;
	--tk-radius-liten: 6px;
	--tk-skygge:       0 1px 2px rgba(24,34,32,.06), 0 2px 8px rgba(24,34,32,.04);
	--tk-skygge-hev:   0 2px 4px rgba(24,34,32,.08), 0 8px 20px rgba(24,34,32,.08);

	--tk-maks:         68rem;
	--tk-luft:         clamp(1rem, 3vw, 2rem);
}

/* -- Grunnoppsett ---------------------------------------------------------- */

/* GeneratePress gjor .site-content til en flexboks. Uten flex-grow her blir
   <main> et flexelement som krymper til innholdsbredden, og landingssiden
   havner i en 550 piksler bred spalte midt i et 1200 piksler bredt omrade. */
.tk-landing,
.tk-enkelt {
	flex: 1 1 auto;
	min-width: 0;
	background: var(--tk-bg);
}

.tk-landing-inner,
.tk-enkelt-inner {
	max-width: var(--tk-maks);
	margin-inline: auto;
	padding: var(--tk-luft);
	padding-block-end: 4rem;
}

.tk-landing h1,
.tk-enkelt h1 {
	font-size: clamp(1.75rem, 1.2rem + 2vw, 2.5rem);
	line-height: 1.15;
	letter-spacing: -.015em;
	color: var(--tk-ink);
	margin-block: .25rem .5rem;
	text-wrap: balance;
}

.tk-landing-ingress {
	font-size: 1.05rem;
	line-height: 1.6;
	color: var(--tk-dempet);
	max-width: 62ch;
	margin-block-end: 1.5rem;
}

/* -- Hopp til innhold ------------------------------------------------------ */

.tk-hopp {
	position: absolute;
	inset-inline-start: -9999px;
	z-index: 999;
}
.tk-hopp:focus {
	inset-inline-start: 1rem;
	inset-block-start: 1rem;
	background: var(--tk-primar);
	color: #fff;
	padding: .75rem 1.25rem;
	border-radius: var(--tk-radius-liten);
}

/* -- Fokus ----------------------------------------------------------------- */

.tk-landing :focus-visible,
.tk-enkelt :focus-visible,
.tk-sokebar :focus-visible {
	outline: 3px solid var(--tk-primar);
	outline-offset: 2px;
	border-radius: 3px;
}

/* -- Brodsmuler ------------------------------------------------------------ */

.tk-brodsmuler {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	font-size: .85rem;
	color: var(--tk-dempet);
	margin-block-end: .75rem;
}
.tk-brodsmuler a { color: var(--tk-dempet); text-decoration: none; }
.tk-brodsmuler a:hover { color: var(--tk-primar); text-decoration: underline; }

/* -- Sokebar --------------------------------------------------------------- */

.tk-sokebar {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: .85rem;
	margin-block-end: 1.5rem;
	display: grid;
	gap: .65rem;
	grid-template-columns: 1fr 1fr auto;
	align-items: end;
	box-shadow: var(--tk-skygge);
}
@media (max-width: 40rem) {
	.tk-sokebar { grid-template-columns: 1fr; }
}
.tk-sokebar label {
	display: grid;
	gap: .3rem;
	font-size: .82rem;
	font-weight: 600;
	color: var(--tk-dempet);
}
.tk-sokebar select,
.tk-sok input,
.tk-sok select,
.tk-kravskjema input,
.tk-kravskjema textarea {
	font: inherit;
	color: var(--tk-ink);
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje-ui);
	border-radius: var(--tk-radius-liten);
	padding: .6rem .7rem;
	min-height: 44px;
	width: 100%;
}

/* -- Knapper --------------------------------------------------------------- */

.tk-knapp,
.tk-handling {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	min-height: 44px;
	padding: .6rem 1.1rem;
	border-radius: var(--tk-radius-liten);
	font-size: .95rem;
	font-weight: 600;
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
.tk-knapp,
.tk-handling--primar {
	background: var(--tk-primar);
	color: #fff;
}
.tk-knapp:hover,
.tk-handling--primar:hover { background: var(--tk-primar-mork); color: #fff; }

.tk-handling--sekundar {
	background: var(--tk-flate);
	color: var(--tk-primar);
	border-color: var(--tk-linje-ui);
}
.tk-handling--sekundar:hover { border-color: var(--tk-primar); background: var(--tk-merke-a-bg); }

/* -- Trefftelling ---------------------------------------------------------- */

.tk-trefflinje {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem;
	margin-block-end: .85rem;
}
.tk-treff { font-weight: 600; color: var(--tk-ink); margin: 0; }
.tk-rangering-lenke { margin: 0; font-size: .85rem; }
.tk-rangering-lenke a { color: var(--tk-dempet); }

/* -- Treffkort ------------------------------------------------------------- */

.tk-treffliste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .6rem;
	/* To spalter fra rundt 60rem. Ett treff per rad over hele skjermbredden
	   gir kort som er 1100 piksler brede og halvtomme — brukeren ma da
	   scrolle mye lenger for a se de samme fem valgene. */
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr));
}

.tk-kort {
	position: relative;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: .9rem 1rem;
	box-shadow: var(--tk-skygge);
	transition: box-shadow .15s ease, border-color .15s ease;
	display: grid;
	gap: .55rem;
}
.tk-kort:hover { box-shadow: var(--tk-skygge-hev); border-color: #c3d2d4; }

.tk-kort-topp {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .8rem;
	align-items: start;
}
.tk-kort-tekst { min-width: 0; display: grid; gap: .45rem; }

.tk-initialer {
	inline-size: 2.6rem;
	block-size: 2.6rem;
	border-radius: 10px;
	display: grid;
	place-items: center;
	font-size: .9rem;
	font-weight: 700;
	letter-spacing: .02em;
	background: var(--tk-annonse-bg);
	color: var(--tk-annonse-ink);
	flex: none;
}
.tk-spor-a .tk-initialer { background: var(--tk-spor-a-bg); color: var(--tk-spor-a-ink); }
.tk-spor-b .tk-initialer { background: var(--tk-spor-b-bg); color: var(--tk-spor-b-ink); }
.tk-spor-c .tk-initialer { background: var(--tk-spor-c-bg); color: var(--tk-spor-c-ink); }

/* En tynn stripe i sporfargen langs kanten. Nok til a se forskjell pa
   avstand, lite nok til at listen ikke blir stripete. */
.tk-kort { border-inline-start: 3px solid var(--tk-linje); }
.tk-spor-a { border-inline-start-color: var(--tk-spor-a-ink); }
.tk-spor-b { border-inline-start-color: #d6b656; }
.tk-spor-c { border-inline-start-color: var(--tk-spor-c-ink); }

.tk-yrkeord { font-weight: 600; color: var(--tk-ink); }
.tk-spor-a .tk-yrkeord { color: var(--tk-spor-a-ink); }
.tk-spor-b .tk-yrkeord { color: var(--tk-spor-b-ink); }
.tk-spor-c .tk-yrkeord { color: var(--tk-spor-c-ink); }

.tk-merke--noytral { background: var(--tk-annonse-bg); color: var(--tk-annonse-ink); }

.tk-kort-navn {
	font-size: 1.05rem;
	line-height: 1.3;
	margin: 0;
	font-weight: 650;
}
.tk-kort-navn a {
	color: var(--tk-ink);
	text-decoration: none;
}
/* Hele kortet er klikkbart, men bare navnet er en ekte lenke. Da far
   skjermlesere og tastaturbrukere ett mal per treff i stedet for fire. */
.tk-kort-navn a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--tk-radius);
}
.tk-kort-navn a:hover { color: var(--tk-primar); text-decoration: underline; }

.tk-kort-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem .6rem;
	font-size: .9rem;
	color: var(--tk-dempet);
	margin: 0;
}
.tk-kort-meta .tk-skille { color: var(--tk-linje-ui); }

/* -- Merker ---------------------------------------------------------------- */

.tk-merke {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	font-size: .78rem;
	font-weight: 600;
	line-height: 1;
	padding: .32rem .55rem;
	border-radius: 999px;
	white-space: nowrap;
}
.tk-merke--autorisert { background: var(--tk-merke-a-bg); color: var(--tk-merke-a-ink); }
.tk-merke--ubeskyttet { background: var(--tk-merke-b-bg); color: var(--tk-merke-b-ink); }
.tk-merke--annonse    { background: var(--tk-annonse-bg); color: var(--tk-annonse-ink); }

.tk-annonsemerke {
	margin: 0;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--tk-annonse-ink);
}
.tk-er-annonse { border-color: #cfd4d8; background: #fbfcfc; }

/* -- Handlinger i kortet --------------------------------------------------- */

.tk-kort-handlinger {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-block-start: .15rem;
}
/* Knappene ligger over ::after-flaten, slik at de kan klikkes selv om
   hele kortet ellers leder til profilen. */
.tk-kort-handlinger > * { position: relative; z-index: 1; }
.tk-kort-handlinger .tk-handling { font-size: .9rem; padding: .5rem .9rem; }

/* -- Tittelmerknad --------------------------------------------------------- */

.tk-tittelmerknad {
	background: var(--tk-merke-b-bg);
	border-inline-start: 3px solid #d6b656;
	border-radius: var(--tk-radius-liten);
	padding: .8rem 1rem;
	font-size: .92rem;
	line-height: 1.55;
	color: var(--tk-ink);
	max-width: 62ch;
	margin-block: 1rem;
}

.tk-verifisert {
	margin: 0;
	font-size: .85rem;
	color: var(--tk-merke-a-ink);
}

/* -- Tom tilstand ---------------------------------------------------------- */

.tk-tomt {
	background: var(--tk-flate);
	border: 1px dashed var(--tk-linje-ui);
	border-radius: var(--tk-radius);
	padding: 1.75rem;
	text-align: center;
	color: var(--tk-dempet);
}
.tk-tomt p { margin-block: .4rem; }
.tk-tomt strong { color: var(--tk-ink); font-size: 1.05rem; }
.tk-smaatekst { font-size: .88rem; }

/* -- Paginering ------------------------------------------------------------ */

.tk-paginering { margin-block-start: 1.75rem; }
.tk-paginering .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 .5rem;
	margin-inline-end: .3rem;
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius-liten);
	background: var(--tk-flate);
	color: var(--tk-primar);
	text-decoration: none;
}
.tk-paginering .page-numbers.current {
	background: var(--tk-primar);
	border-color: var(--tk-primar);
	color: #fff;
	font-weight: 600;
}

/* -- Guide og relaterte lenker --------------------------------------------- */

.tk-guide {
	margin-block: 2.5rem;
	max-width: 62ch;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.5rem;
}
.tk-guide h2 { font-size: 1.3rem; margin-block: 0 .75rem; color: var(--tk-ink); }
.tk-guide p { line-height: 1.7; color: #2e3d44; }
.tk-guide p:last-child { margin-block-end: 0; }
.tk-guide-lenke { margin-block: 1.75rem; }

.tk-relatert {
	margin-block-start: 3rem;
	padding-block-start: 1.75rem;
	border-block-start: 1px solid var(--tk-linje);
	display: grid;
	gap: 1.75rem;
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}
.tk-relatert h2 {
	font-size: .8rem;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--tk-dempet);
	margin-block: 0 .6rem;
}
.tk-relatert ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.tk-relatert a { color: var(--tk-primar); text-decoration: none; font-size: .95rem; }
.tk-relatert a:hover { text-decoration: underline; }

/* -- Profilside ------------------------------------------------------------ */

.tk-profil-topp {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.5rem;
	box-shadow: var(--tk-skygge);
	display: grid;
	gap: 1rem;
}
.tk-profil-merker { display: flex; flex-wrap: wrap; gap: .4rem; }
.tk-profil-kontakt { display: flex; flex-wrap: wrap; gap: .6rem; }

.tk-faktaliste {
	margin: 0;
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .5rem 1.25rem;
	font-size: .95rem;
}
.tk-faktaliste dt { color: var(--tk-dempet); }
.tk-faktaliste dd { margin: 0; color: var(--tk-ink); }

.tk-kilde {
	margin-block-start: 2rem;
	font-size: .85rem;
	color: var(--tk-dempet);
	border-block-start: 1px solid var(--tk-linje);
	padding-block-start: 1rem;
}

/* -- Skjema ---------------------------------------------------------------- */

.tk-sok {
	display: grid;
	gap: .85rem;
	grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
	align-items: end;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1rem;
	margin-block-end: 1.5rem;
}
.tk-felt { display: grid; gap: .3rem; font-size: .85rem; font-weight: 600; color: var(--tk-dempet); }
.tk-felt em { font-weight: 400; font-style: normal; }
.tk-avkryssing { display: flex; align-items: center; gap: .5rem; font-size: .92rem; min-height: 44px; }
.tk-avkryssing input { width: 1.15rem; height: 1.15rem; }

.tk-kravskjema { display: grid; gap: 1rem; max-width: 38rem; }
.tk-kravskjema fieldset { border: 1px solid var(--tk-linje); border-radius: var(--tk-radius); padding: 1rem; }
.tk-kravskjema legend { font-weight: 600; padding-inline: .4rem; }
.tk-kravskjema fieldset label { display: flex; align-items: center; gap: .5rem; min-height: 40px; }
.tk-kravskjema fieldset input { width: auto; min-height: auto; }
.tk-kvittering { background: var(--tk-merke-a-bg); color: var(--tk-merke-a-ink); padding: 1rem; border-radius: var(--tk-radius); }
.tk-feil { background: #fdecea; color: #8c1d18; padding: 1rem; border-radius: var(--tk-radius); }

/* -- Rangeringstabell ------------------------------------------------------ */

.tk-rangeringstabell { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tk-rangeringstabell caption { text-align: start; color: var(--tk-dempet); padding-block-end: .6rem; }
.tk-rangeringstabell th,
.tk-rangeringstabell td { text-align: start; padding: .7rem .6rem; border-block-end: 1px solid var(--tk-linje); vertical-align: top; }
.tk-rangeringstabell thead th { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--tk-dempet); }

/* -- Redusert bevegelse ---------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* -- Overskrifter inne i katalogsidene ------------------------------------- */

.tk-enkelt h2 {
	font-size: 1.2rem;
	margin-block: 2rem .75rem;
	color: var(--tk-ink);
}
.tk-enkelt .tk-guide h2 { margin-block-start: 0; }

/* Faktalisten stables pa smale skjermer, ellers blir verdikolonnen for smal. */
@media (max-width: 30rem) {
	.tk-faktaliste { grid-template-columns: 1fr; gap: .15rem; }
	.tk-faktaliste dd { margin-block-end: .6rem; }
}

/* Navnet i treffkortet skal vaere ink, ikke lenkefarge — ogsa nar kortet
   ligger inne i .entry-content pa sokesiden, der temaets lenkeregel ellers
   vinner pa spesifisitet. */
.tk-kort-lenke { color: var(--tk-ink); }
.tk-kort-lenke:hover { color: var(--tk-primar); }

/* Sokefeltet trenger mer plass enn de to nedtrekkslistene. */
.tk-sok { grid-template-columns: 1.6fr 1fr 1fr auto; }
@media (max-width: 52rem) { .tk-sok { grid-template-columns: 1fr 1fr; } }
@media (max-width: 32rem) { .tk-sok { grid-template-columns: 1fr; } }

/* -- Hovedsok med forslag -------------------------------------------------- */

.tk-hovedsok {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: .5rem;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: 12px;
	padding: .6rem;
	box-shadow: var(--tk-skygge);
}
.tk-hovedsok-felt { display: block; min-width: 0; }
.tk-hovedsok input[type="search"] {
	font: inherit;
	font-size: 1.02rem;
	inline-size: 100%;
	min-height: 48px;
	padding: .6rem .8rem;
	color: var(--tk-ink);
	background: transparent;
	border: 0;
	border-radius: var(--tk-radius-liten);
}
.tk-hovedsok input[type="search"]::placeholder { color: #7c8a90; }
.tk-hovedsok .tk-knapp { min-height: 48px; }

.tk-forslag {
	position: absolute;
	inset-block-start: calc(100% + .35rem);
	inset-inline: 0;
	z-index: 40;
	margin: 0;
	padding: .3rem;
	list-style: none;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: 12px;
	box-shadow: 0 8px 28px rgba(22,36,43,.14);
	max-block-size: 22rem;
	overflow-y: auto;
}
.tk-forslag-rad {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .6rem .7rem;
	border-radius: var(--tk-radius-liten);
	cursor: pointer;
	min-height: 44px;
}
.tk-forslag-rad.er-valgt,
.tk-forslag-rad:hover { background: var(--tk-merke-a-bg); }
.tk-forslag-tekst { font-weight: 600; color: var(--tk-ink); }
.tk-forslag-type { font-size: .8rem; color: var(--tk-dempet); white-space: nowrap; }

@media (max-width: 34rem) {
	.tk-hovedsok { grid-template-columns: 1fr; }
}

/* -- Konto og min side ----------------------------------------------------- */

.tk-innlogging,
.tk-minside { max-width: 44rem; display: grid; gap: 1rem; }
.tk-innlogging h2,
.tk-minside h2 { font-size: 1.25rem; margin-block: 1.5rem .25rem; }
.tk-innlogging h2:first-child { margin-block-start: 0; }

.tk-minside-hilsen {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: .75rem;
	padding: .7rem .9rem;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	margin: 0;
}

/* Vipps' egen farge. Knappen skal se ut som Vipps, ellers stusser folk pa
   om det virkelig er Vipps de sendes til. */
.tk-vipps-knapp { background: #ff5b24; border-color: #ff5b24; }
.tk-vipps-knapp:hover { background: #e14d1a; border-color: #e14d1a; }

.tk-minside .tk-kort { border-inline-start-color: var(--tk-linje); }
.tk-minside .tk-kort-tekst { display: grid; gap: .5rem; }

/* -- Temasider ------------------------------------------------------------- */

.tk-temakilde {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: .8rem 1rem;
	font-size: .9rem;
	line-height: 1.55;
	color: var(--tk-dempet);
	max-width: 64ch;
	margin-block: 0 1.25rem;
}

.tk-temalenker { margin-block-start: 2.5rem; }
.tk-temalenker h2 {
	font-size: .8rem;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--tk-dempet);
	margin-block: 0 .6rem;
}
.tk-temalenker .tk-brikker { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem; }
.tk-temalenker .tk-brikker a {
	display: inline-flex; align-items: center; gap: .45rem; min-height: 40px;
	padding: .4rem .5rem .4rem .8rem; border-radius: 999px;
	background: var(--tk-flate); border: 1px solid var(--tk-linje);
	color: var(--tk-ink); text-decoration: none; font-size: .92rem;
}
.tk-temalenker .tk-brikker a:hover { border-color: var(--tk-spor-a-ink); color: var(--tk-spor-a-ink); background: var(--tk-spor-a-bg); }
.tk-temalenker .tk-brikke-tall {
	font-size: .78rem; font-variant-numeric: tabular-nums;
	color: var(--tk-dempet); background: rgba(0,0,0,.045);
	padding: .12rem .45rem; border-radius: 999px;
}

/* -- Profilside: kontekst og naboer ---------------------------------------- */

.tk-yrkekontekst {
	max-width: 64ch;
	margin-block: 1.5rem 0;
	color: var(--tk-dempet);
	line-height: 1.6;
	font-size: .96rem;
}
.tk-yrkekontekst a { margin-inline-start: .35rem; white-space: nowrap; }

.tk-kartlenke { font-size: .92rem; }

.tk-naboer { margin-block-start: 2.5rem; }
.tk-naboer h2 { font-size: 1.15rem; margin-block-end: .9rem; }
.tk-naboer-alle { margin-block-start: 1rem; }

/* -- Filtre ---------------------------------------------------------------- */

.tk-filtre {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .45rem;
	margin-block-end: 1rem;
}
.tk-filtre-tittel {
	font-size: .85rem;
	color: var(--tk-dempet);
	margin-inline-end: .15rem;
}
.tk-filter {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: .35rem .8rem;
	border-radius: 999px;
	border: 1px solid var(--tk-linje);
	background: var(--tk-flate);
	color: var(--tk-ink);
	text-decoration: none;
	font-size: .9rem;
}
.tk-filter:hover { border-color: var(--tk-primar); color: var(--tk-primar); }
.tk-filter.er-pa {
	background: var(--tk-primar);
	border-color: var(--tk-primar);
	color: #fff;
	font-weight: 600;
}
.tk-filter.er-pa::before { content: "✓"; margin-inline-end: .35rem; }
.tk-filter-nullstill {
	font-size: .85rem;
	color: var(--tk-dempet);
	text-decoration: underline;
	padding-inline: .4rem;
	min-height: 38px;
	display: inline-flex;
	align-items: center;
}

/* --- Dekningskart -------------------------------------------------------
   Femten fylker, femten stolper. Et geografisk kart hadde vaert penere, men
   ikke lettere a lese: fylkene er sa ulike i areal at Finnmark ville dominert
   bildet med tre oppforinger. Stolpelengde er antall, og ingenting annet. */

.tk-dekning {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: clamp(1.25rem, 4vw, 2rem);
	margin-block: 2.5rem;
}
.tk-dekning__tittel {
	margin-block: 0 .35rem;
	font-size: clamp(1.3rem, 3vw, 1.6rem);
}
.tk-dekning__ingress {
	margin-block: 0 1.5rem;
	color: var(--tk-dempet);
	max-width: 46ch;
}
.tk-dekning__ingress strong { color: var(--tk-ink); }

.tk-dekning__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
	gap: 1.25rem 2rem;
}
.tk-dekning__rad { min-width: 0; }
.tk-dekning__rad--tom { opacity: .55; }

.tk-dekning__hode {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .75rem;
	margin-block-end: .35rem;
}
.tk-dekning__fylke { font-weight: 600; }
.tk-dekning__antall {
	font-variant-numeric: tabular-nums;
	color: var(--tk-dempet);
	font-size: .95rem;
}

.tk-dekning__spor {
	height: 8px;
	background: var(--tk-bg);
	border-radius: 999px;
	overflow: hidden;
}
.tk-dekning__stolpe {
	display: block;
	height: 100%;
	min-width: 3px;
	background: var(--tk-primar);
	border-radius: 999px;
}

.tk-dekning__steder {
	list-style: none;
	margin: .6rem 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .35rem .5rem;
}
.tk-dekning__steder a {
	display: inline-flex;
	align-items: baseline;
	gap: .35rem;
	padding: .2rem .55rem;
	border: 1px solid var(--tk-linje);
	border-radius: 999px;
	font-size: .85rem;
	color: var(--tk-ink);
	text-decoration: none;
	background: var(--tk-flate);
}
.tk-dekning__steder a:hover,
.tk-dekning__steder a:focus-visible {
	border-color: var(--tk-primar);
	color: var(--tk-primar);
}
.tk-dekning__stedantall {
	color: var(--tk-dempet);
	font-variant-numeric: tabular-nums;
	font-size: .78rem;
}
.tk-dekning__steder a:hover .tk-dekning__stedantall { color: inherit; }

.tk-dekning__note {
	margin-block: 1.5rem 0;
	font-size: .82rem;
	color: var(--tk-dempet);
	max-width: 60ch;
}

@media (prefers-reduced-motion: no-preference) {
	.tk-dekning__stolpe { transition: width .4s ease; }
}

/* --- Guidekort ----------------------------------------------------------
   Brukes pa forsiden og nederst pa profilsider. Hele kortet er klikkbart via
   lenken i overskriften; resten av flaten far pekeren, men ikke et ekstra
   tabstopp. */

.tk-guider {
	list-style: none;
	margin: 1rem 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	gap: 1rem;
}
.tk-guide {
	position: relative;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.1rem 1.25rem 1.25rem;
	min-width: 0;
}
.tk-guide:hover { box-shadow: var(--tk-skygge-hev); border-color: var(--tk-linje-ui); }
.tk-guide h3 {
	margin-block: 0 .4rem;
	font-size: 1.05rem;
	line-height: 1.35;
}
.tk-guide h3 a {
	color: var(--tk-ink);
	text-decoration: none;
}
.tk-guide h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}
.tk-guide h3 a:hover { color: var(--tk-primar); }
.tk-guide p {
	margin: 0;
	color: var(--tk-dempet);
	font-size: .92rem;
}

.tk-punkter {
	list-style: none;
	margin: 1rem 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	gap: 1rem 2rem;
}
.tk-punkter li { min-width: 0; }
.tk-punkter strong { display: block; margin-block-end: .2rem; }
.tk-punkter span { color: var(--tk-dempet); font-size: .92rem; }

/* Tallet pa filterknappen. Uten det er «Har nettside» et lofte brukeren ikke
   kan vurdere for etter klikket. */
.tk-filter-antall {
	color: var(--tk-dempet);
	font-variant-numeric: tabular-nums;
	font-size: .8rem;
	margin-inline-start: .1rem;
}
.tk-filter:hover .tk-filter-antall { color: inherit; }
.tk-filter.er-pa .tk-filter-antall { color: rgba(255, 255, 255, .8); }

/* --- Hjelpeområder ------------------------------------------------------
   Den nye inngangen: velg etter hva du trenger hjelp til, ikke etter om
   tittelen er beskyttet. Sporet folger med som en prikk pa hver brikke, sa
   den juridiske forskjellen mates i det oyeblikket den betyr noe for valget. */

.tk-omrader__tittel { margin-block: 0 .35rem; }
.tk-omrader__ingress {
	margin-block: 0 1.75rem;
	color: var(--tk-dempet);
	max-width: 48ch;
}

.tk-omrader__liste {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
	gap: 1.75rem 2.25rem;
}

.tk-omrade { min-width: 0; }
.tk-omrade__navn {
	margin-block: 0 .15rem;
	font-size: 1.05rem;
	line-height: 1.3;
}
.tk-omrade__sporsmal {
	margin-block: 0 .7rem;
	font-size: .88rem;
	color: var(--tk-dempet);
	max-width: 34ch;
}

.tk-omrade__yrker {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}

.tk-yrkebrikke {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .3rem .65rem .3rem .55rem;
	border: 1px solid var(--tk-linje);
	border-radius: 999px;
	background: var(--tk-flate);
	color: var(--tk-ink);
	text-decoration: none;
	font-size: .88rem;
	line-height: 1.4;
	min-height: 34px;
}
.tk-yrkebrikke:hover,
.tk-yrkebrikke:focus-visible {
	border-color: var(--tk-primar);
	color: var(--tk-primar);
}

/* Sporprikken. Fylt = beskyttet tittel, apen = ikke beskyttet. Formen barer
   forskjellen, ikke fargen — da trenger vi bare én mettet farge pa siden. */
.tk-yrkebrikke::before {
	content: "";
	inline-size: 7px;
	block-size: 7px;
	border-radius: 50%;
	flex: none;
	border: 1.5px solid var(--tk-linje-ui);
}
.tk-yrkebrikke--a::before {
	background: var(--tk-primar);
	border-color: var(--tk-primar);
}

.tk-yrkebrikke__tall {
	color: var(--tk-dempet);
	font-variant-numeric: tabular-nums;
	font-size: .78rem;
}
.tk-yrkebrikke:hover .tk-yrkebrikke__tall { color: inherit; }

.tk-omrader__note {
	margin-block: 1.75rem 0;
	font-size: .82rem;
	color: var(--tk-dempet);
	max-width: 62ch;
}

/* --- Pris, hull og sporsmal ---------------------------------------------
   De tre seksjonene som gjor en tom registeroppforing til en side som svarer
   pa noe. Ingen av dem trenger data om utoveren selv. */

.tk-pris,
.tk-mangler {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.25rem 1.4rem 1.4rem;
	margin-block: 2rem;
}
.tk-pris__tittel,
.tk-mangler__tittel,
.tk-faq__tittel {
	margin-block: 0 .5rem;
	font-size: 1.15rem;
	line-height: 1.3;
}
.tk-pris__tekst { margin: 0; max-width: 62ch; }
.tk-pris__note {
	margin-block: .9rem 0;
	font-size: .8rem;
	color: var(--tk-dempet);
	max-width: 62ch;
}

.tk-mangler { border-style: dashed; }
.tk-mangler__ingress { margin-block: 0 .9rem; color: var(--tk-dempet); max-width: 62ch; }
.tk-mangler__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}
.tk-mangler__liste li {
	font-size: .88rem;
	color: var(--tk-dempet);
	background: var(--tk-bg);
	border: 1px dashed var(--tk-linje);
	border-radius: var(--tk-radius-liten);
	padding: .3rem .6rem;
}
.tk-mangler__liste li::before {
	content: "—";
	margin-inline-end: .4rem;
	color: var(--tk-linje-ui);
}
.tk-mangler__handling {
	margin-block: 1.1rem 0;
	font-size: .92rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
	max-width: 64ch;
}

/* Sporsmalene som ekte <details>. Ingen JavaScript, virker med tastatur og
   skjermleser uten at vi gjor noe som helst. */
.tk-faq { margin-block: 2rem; }
.tk-faq__liste { border-block-start: 1px solid var(--tk-linje); }
.tk-faq__punkt { border-block-end: 1px solid var(--tk-linje); }
.tk-faq__punkt summary {
	cursor: pointer;
	padding: .8rem 2rem .8rem 0;
	font-weight: 500;
	list-style: none;
	position: relative;
	line-height: 1.45;
}
.tk-faq__punkt summary::-webkit-details-marker { display: none; }
.tk-faq__punkt summary::after {
	content: "";
	position: absolute;
	inset-inline-end: .4rem;
	inset-block-start: 1.25rem;
	inline-size: 9px;
	block-size: 9px;
	border-inline-end: 2px solid var(--tk-linje-ui);
	border-block-end: 2px solid var(--tk-linje-ui);
	transform: rotate(45deg);
	transform-origin: center;
}
.tk-faq__punkt[open] summary::after { transform: rotate(-135deg); inset-block-start: 1.45rem; }
.tk-faq__punkt summary:hover { color: var(--tk-primar); }
.tk-faq__punkt summary:hover::after { border-color: var(--tk-primar); }
.tk-faq__punkt summary:focus-visible { outline: 3px solid var(--tk-primar); outline-offset: 2px; border-radius: 3px; }
.tk-faq__svar { padding-block-end: 1rem; }
.tk-faq__svar p { margin: 0; max-width: 64ch; color: var(--tk-dempet); }

@media (prefers-reduced-motion: no-preference) {
	.tk-faq__punkt summary::after { transition: transform .18s ease; }
}

/* --- Person eller virksomhet -------------------------------------------
   Skillet baeres av formen, ikke av en farge til: en sirkel for mennesket,
   en avrundet firkant for foretaket. Det leses uten forklaring. */

.tk-kort--person .tk-initialer { border-radius: 50%; }
.tk-kort--virksomhet .tk-initialer { border-radius: var(--tk-radius-liten); }

.tk-merke--eier {
	background: var(--tk-merke-a-bg);
	color: var(--tk-merke-a-ink);
}
.tk-merke--eier::before {
	content: "✓";
	margin-inline-end: .3rem;
}

/* --- Temaside ------------------------------------------------------------ */

.tk-temaside .tk-ingress {
	font-size: 1.08rem;
	line-height: 1.6;
	max-width: 60ch;
	color: var(--tk-dempet);
}
.tk-temasteg, .tk-temayrker { margin-block: 2rem; }
.tk-temasteg h2, .tk-temayrker h2 { margin-block: 0 .6rem; font-size: 1.15rem; }
.tk-temasteg p { max-width: 64ch; margin: 0; }
.tk-temayrker__ingress {
	max-width: 62ch;
	margin-block: 0 .9rem;
	font-size: .88rem;
	color: var(--tk-dempet);
}

/* Krisemerknaden. Den eneste flaten pa nettstedet som har lov til a rope, og
   derfor den eneste som bruker en annen ramme enn resten. */
.tk-krise {
	border: 2px solid var(--tk-primar);
	border-radius: var(--tk-radius);
	background: var(--tk-merke-a-bg);
	padding: 1rem 1.2rem;
	margin-block: 1.5rem;
	max-width: 60ch;
	line-height: 1.6;
}
.tk-krise strong { display: block; margin-block-end: .2rem; }
.tk-krise a { color: var(--tk-primar-mork); font-weight: 600; }

/* --- Profilsiden: to spalter med sammendragskort ------------------------
   Strukturen folger et monster som virker i katalogsider: fakta og handling
   ligger fast i margen mens leseren blar gjennom detaljene. Forskjellen fra en
   produktkatalog er at kortet her oppsummerer YRKET, ikke utoveren — det er
   forskjellen mellom et faktum om en ordning og en pastand om en navngitt
   person. Notatet nederst i kortet sier det rett ut. */

.tk-profil-ingress {
	font-size: 1.05rem;
	line-height: 1.6;
	color: var(--tk-dempet);
	max-width: 58ch;
	margin-block: -.4rem 1.5rem;
}

.tk-profil-oppsett {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 19rem;
	gap: 2.5rem;
	align-items: start;
}
.tk-profil-hoved { min-width: 0; }

@media (max-width: 60rem) {
	.tk-profil-oppsett { grid-template-columns: 1fr; gap: 1.5rem; }
	/* Pa smal skjerm skal handlingen opp, ikke ned i bunnen av en lang side. */
	.tk-sammendrag { order: -1; }
}

.tk-sammendrag { min-width: 0; }
.tk-sammendrag__innhold {
	position: sticky;
	top: 1.5rem;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.2rem 1.3rem 1.3rem;
	box-shadow: var(--tk-skygge);
}
@media (max-width: 60rem) {
	.tk-sammendrag__innhold { position: static; }
}

.tk-sammendrag__stempel {
	margin-block: 0 .9rem;
	font-size: .68rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--tk-dempet);
	font-weight: 600;
}

.tk-sammendrag__liste { margin: 0; }
.tk-sammendrag__liste dt {
	font-size: .78rem;
	color: var(--tk-dempet);
	margin-block-start: .85rem;
}
.tk-sammendrag__liste dt:first-of-type { margin-block-start: 0; }
.tk-sammendrag__liste dd {
	margin: .1rem 0 0;
	font-size: .93rem;
	line-height: 1.45;
	padding-block-end: .85rem;
	border-block-end: 1px solid var(--tk-linje);
}
.tk-sammendrag__liste dd:last-of-type { border-block-end: 0; padding-block-end: 0; }
.tk-sammendrag__liste dd.tk-ukjent { color: var(--tk-dempet); font-style: italic; }
.tk-sammendrag__liste a { color: var(--tk-primar); }

.tk-sammendrag__knapp {
	display: block;
	margin-block-start: 1.1rem;
	padding: .7rem 1rem;
	text-align: center;
	background: var(--tk-primar);
	color: #fff;
	border-radius: var(--tk-radius-liten);
	text-decoration: none;
	font-weight: 600;
	min-height: 44px;
}
.tk-sammendrag__knapp:hover { background: var(--tk-primar-mork); color: #fff; }
.tk-sammendrag__knapp--sekundar {
	background: var(--tk-flate);
	color: var(--tk-primar);
	border: 1px solid var(--tk-linje-ui);
	margin-block-start: .5rem;
}
.tk-sammendrag__knapp--sekundar:hover { background: var(--tk-merke-a-bg); color: var(--tk-primar-mork); }

.tk-sammendrag__note {
	margin-block: .9rem 0;
	font-size: .76rem;
	line-height: 1.5;
	color: var(--tk-dempet);
}

/* --- Hoppelenker -------------------------------------------------------- */

.tk-hopplenker {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .45rem;
	padding: .9rem 1rem;
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	margin-block: 1.5rem;
}
.tk-hopplenker__tittel {
	font-size: .68rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--tk-dempet);
	font-weight: 600;
	margin-inline-end: .3rem;
}
.tk-hopplenker a {
	display: inline-flex;
	align-items: center;
	padding: .3rem .7rem;
	border: 1px solid var(--tk-linje);
	border-radius: 999px;
	font-size: .86rem;
	color: var(--tk-ink);
	text-decoration: none;
	background: var(--tk-bg);
	min-height: 32px;
}
.tk-hopplenker a:hover { border-color: var(--tk-primar); color: var(--tk-primar); }

/* Uten dette lander ankeret under den klebrige toppen pa noen oppsett. */
[id="passform"], [id="opplysninger"], [id="pris"],
[id="forbehold"], [id="mangler"], [id="faq"] { scroll-margin-top: 1.5rem; }

/* --- Passform ----------------------------------------------------------- */

.tk-passform {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
	gap: 1rem;
	margin-block: 1.5rem 2rem;
}
.tk-passform__boks {
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1rem 1.15rem 1.15rem;
	min-width: 0;
}
.tk-passform__boks h2 {
	margin-block: 0 .35rem;
	font-size: .95rem;
	line-height: 1.3;
}
.tk-passform__boks p { margin: 0; font-size: .93rem; line-height: 1.55; }
.tk-passform__boks--ja {
	background: var(--tk-merke-a-bg);
	border-color: color-mix(in srgb, var(--tk-primar) 25%, transparent);
}
.tk-passform__boks--ja h2 { color: var(--tk-merke-a-ink); }
.tk-passform__boks--nei { background: var(--tk-merke-b-bg); }
.tk-passform__boks--nei h2 { color: var(--tk-merke-b-ink); }

/* --- Verdt å vite ------------------------------------------------------- */

.tk-forbehold {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.25rem 1.4rem 1.4rem;
	margin-block: 2rem;
}
.tk-forbehold h2 { margin-block: 0 .7rem; font-size: 1.15rem; line-height: 1.3; }
.tk-forbehold ul {
	margin: 0;
	padding-inline-start: 1.15rem;
	display: flex;
	flex-direction: column;
	gap: .6rem;
}
.tk-forbehold li { max-width: 64ch; line-height: 1.55; color: var(--tk-dempet); }
.tk-forbehold li strong { color: var(--tk-ink); }

/* --- Utøverens egne ord -------------------------------------------------
   Virksomhetsbeskrivelsen fra Enhetsregisteret, ordrett. Den settes som et
   sitat og ikke som brodtekst, fordi det ER et sitat: teksten er skrevet av
   foretaket selv, ikke av oss. Kildelinjen under er ikke en formalitet — den
   er hele grunnen til at vi kan vise den. */

.tk-egenord {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.25rem 1.4rem 1.4rem;
	margin-block: 2rem;
}
.tk-egenord h2 { margin-block: 0 .8rem; font-size: 1.15rem; line-height: 1.3; }
.tk-egenord__sitat {
	margin: 0;
	padding-inline-start: 1rem;
	border-inline-start: 3px solid var(--tk-primar);
}
.tk-egenord__sitat p {
	margin: 0;
	font-size: 1.05rem;
	line-height: 1.6;
	max-width: 62ch;
}
.tk-egenord__kilde {
	margin-block: 1rem 0;
	font-size: .8rem;
	line-height: 1.5;
	color: var(--tk-dempet);
	max-width: 62ch;
}
[id="egenord"] { scroll-margin-top: 1.5rem; }

/* --- Omtaler ------------------------------------------------------------
   Terningkastene star som tall og ikke som stjerner. Fire stjerner av fem er
   et bilde man leser i et blunk og glemmer like fort; «Tillit 4» tvinger
   leseren til a se hva som faktisk ble vurdert. Og det holder oss unna a la
   et sammendragstall bli hele budskapet. */

.tk-omtaler {
	background: var(--tk-flate);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.25rem 1.4rem 1.4rem;
	margin-block: 2rem;
}
.tk-omtaler__topp {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem 1rem;
	margin-block-end: 1rem;
}
.tk-omtaler__topp h2 { margin: 0; font-size: 1.15rem; line-height: 1.3; }
.tk-omtaler__snitt { margin: 0; font-variant-numeric: tabular-nums; }
.tk-omtaler__snitt strong { font-size: 1.35rem; color: var(--tk-primar); }

.tk-omtaler__tom,
.tk-omtaler__forbehold {
	margin: 0 0 1rem;
	color: var(--tk-dempet);
	max-width: 62ch;
}
.tk-omtaler__forbehold {
	font-size: .88rem;
	padding: .7rem .9rem;
	background: var(--tk-bg);
	border-radius: var(--tk-radius-liten);
}

.tk-omtaleliste { list-style: none; margin: 0; padding: 0; }
.tk-omtale {
	padding-block: 1.1rem;
	border-block-start: 1px solid var(--tk-linje);
}
.tk-omtale:first-child { border-block-start: 0; padding-block-start: 0; }

.tk-omtale__hode {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .3rem 1rem;
}
.tk-omtale__hode h3 { margin: 0; font-size: 1rem; line-height: 1.35; }
.tk-omtale__hode time { font-size: .8rem; color: var(--tk-dempet); }

.tk-omtale__terning {
	list-style: none;
	margin: .5rem 0 .7rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .35rem .5rem;
}
.tk-omtale__terning li {
	display: inline-flex;
	align-items: baseline;
	gap: .35rem;
	font-size: .8rem;
	color: var(--tk-dempet);
	background: var(--tk-bg);
	border-radius: var(--tk-radius-liten);
	padding: .2rem .55rem;
}
.tk-omtale__terning strong {
	color: var(--tk-ink);
	font-variant-numeric: tabular-nums;
}

.tk-omtale__tekst p { margin: 0 0 .6rem; max-width: 64ch; line-height: 1.6; }
.tk-omtale__tekst p:last-child { margin-block-end: 0; }

/* Tilsvaret er utoverens svar, og skal se ut som et svar — ikke som enda en
   omtale. Innrykk og strek gjor hvem som snakker tydelig uten en etikett til. */
.tk-omtale__tilsvar {
	margin-block-start: .9rem;
	padding: .8rem 1rem;
	background: var(--tk-merke-a-bg);
	border-inline-start: 3px solid var(--tk-primar);
	border-radius: 0 var(--tk-radius-liten) var(--tk-radius-liten) 0;
}
.tk-omtale__tilsvar-hode {
	margin: 0 0 .3rem;
	font-size: .8rem;
	font-weight: 600;
	color: var(--tk-merke-a-ink);
}
.tk-omtale__tilsvar p { margin: 0 0 .5rem; font-size: .93rem; line-height: 1.55; max-width: 62ch; }
.tk-omtale__tilsvar p:last-child { margin-block-end: 0; }

.tk-omtale__meld { margin-block-start: .8rem; }
.tk-omtale__meld summary {
	cursor: pointer;
	font-size: .8rem;
	color: var(--tk-dempet);
	text-decoration: underline;
	text-underline-offset: .2em;
}
.tk-omtale__meld summary:hover { color: var(--tk-primar); }
.tk-omtale__meld form { margin-block-start: .7rem; max-width: 34rem; }

.tk-omtaler__handling { margin-block: 1.4rem .9rem; }
.tk-omtaler__vilkaar {
	margin: 0;
	font-size: .8rem;
	line-height: 1.6;
	color: var(--tk-dempet);
	max-width: 66ch;
	padding-block-start: 1rem;
	border-block-start: 1px solid var(--tk-linje);
}
[id="omtaler"] { scroll-margin-top: 1.5rem; }

/* --- Omtaleskjemaet ----------------------------------------------------- */

.tk-omtale-regler {
	background: var(--tk-bg);
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1.1rem 1.3rem 1.2rem;
	margin-block: 1.25rem 1.75rem;
}
.tk-omtale-regler h2 { margin-block: 0 .6rem; font-size: 1.05rem; }
.tk-omtale-regler ul {
	margin: 0;
	padding-inline-start: 1.15rem;
	display: flex;
	flex-direction: column;
	gap: .45rem;
}
.tk-omtale-regler li { max-width: 62ch; line-height: 1.55; }

.tk-stjernesett {
	border: 1px solid var(--tk-linje);
	border-radius: var(--tk-radius);
	padding: 1rem 1.2rem 1.2rem;
	margin-block: 1rem;
}
.tk-stjernesett legend { font-weight: 600; padding-inline: .4rem; }
.tk-stjernerad {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .5rem 1rem;
	padding-block: .7rem;
	border-block-end: 1px solid var(--tk-linje);
}
.tk-stjernerad:last-child { border-block-end: 0; padding-block-end: 0; }
.tk-stjernerad__navn { display: flex; flex-direction: column; gap: .1rem; font-weight: 500; }
.tk-stjernerad__valg { display: flex; gap: .3rem; }
.tk-stjernerad__valg label {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 40px;
	block-size: 40px;
	border: 1px solid var(--tk-linje-ui);
	border-radius: var(--tk-radius-liten);
	cursor: pointer;
	font-variant-numeric: tabular-nums;
}
.tk-stjernerad__valg input {
	position: absolute;
	opacity: 0;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
	margin: 0;
	cursor: pointer;
}
.tk-stjernerad__valg label:has(input:checked) {
	background: var(--tk-primar);
	border-color: var(--tk-primar);
	color: #fff;
	font-weight: 600;
}
.tk-stjernerad__valg label:has(input:focus-visible) {
	outline: 3px solid var(--tk-primar);
	outline-offset: 2px;
}

/* Invitasjonen pa en profil uten omtaler. Én linje, ikke et kort — se
   kommentaren i omtaler.php om hvorfor ni tusen tomme seksjoner er verre enn
   ingen seksjon. */
.tk-omtale-invitasjon {
	margin-block: 2rem 0;
	padding-block-start: 1.1rem;
	border-block-start: 1px solid var(--tk-linje);
	font-size: .92rem;
	color: var(--tk-dempet);
	max-width: 64ch;
}