/* ==========================================================================
   Kreditkortsidan 1.0.5
   Marinblått och guld, Merriweather i rubrikerna och Source Sans Pro i texten.
   1.  Typsnitt
   2.  Färger och mått
   3.  Grund
   4.  Sidhuvud och meny
   5.  Mobilmenyn
   6.  Startsidans topp
   7.  Titelyta på sidor och inlägg
   8.  Innehållets typografi
   9.  Innehållets rutor, listor och tabeller (tidigare Ytterligare CSS i Glades)
   10. Staplar och illustrationer i texterna
   11. Kortlistor, kortsidor och skribentsidor från pluginen
   12. Artikelkort, arkiv och sök
   13. Sidfot
   14. Formulär, knappar och övrigt
   ========================================================================== */

/* 1. Typsnitt ------------------------------------------------------------ */

@font-face {
	font-family: "Source Sans Pro";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/source-sans-pro-latin-400-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Source Sans Pro";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/source-sans-pro-latin-400-italic.woff2") format("woff2");
}
@font-face {
	font-family: "Source Sans Pro";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/source-sans-pro-latin-600-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Source Sans Pro";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/source-sans-pro-latin-700-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/merriweather-latin-400-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/merriweather-latin-700-normal.woff2") format("woff2");
}

/* 2. Färger och mått ----------------------------------------------------- */

:root {
	--kkt-navy: #1e3a5f;
	--kkt-navy-2: #17324f;
	--kkt-navy-dark: #0b1f36;
	--kkt-ink: #0f2a4a;
	--kkt-text: #1a1f2e;
	--kkt-soft: #5a6275;
	--kkt-gold: #c89e2e;
	--kkt-gold-dark: #8f6d14;
	--kkt-gold-light: #fdf6e7;
	--kkt-paper: #f5f7fb;
	--kkt-blue-light: #eef2f8;
	--kkt-line: #dce3ed;
	--kkt-line-strong: #a8b3c5;
	--kkt-green: #0d7d4f;
	--kkt-green-dark: #086148;
	--kkt-green-light: #e7f3ec;
	--kkt-amber: #b45309;
	--kkt-amber-dark: #92400e;
	--kkt-red: #b91c1c;
	--kkt-red-dark: #991b1b;
	--kkt-radius: 8px;
	--kkt-radius-lg: 14px;
	--kkt-skugga: 0 1px 2px rgba(15, 42, 74, .05), 0 8px 24px rgba(15, 42, 74, .06);
	--kkt-bredd: 840px;
	--kkt-ram: 1200px;
	--kkt-sans: "Source Sans Pro", Arial, Helvetica, sans-serif;
	--kkt-serif: "Merriweather", Georgia, "Times New Roman", serif;

	/* Samma namn som i den gamla Ytterligare CSS, så att rutor i texterna och
	   kalkylatorerna hittar sina färger. */
	--kks-primary: #1e3a5f;
	--kks-primary-dark: #0a1f38;
	--kks-primary-light: #eef2f8;
	--kks-primary-border: #c5d3e3;
	--kks-accent: #c89e2e;
	--kks-accent-dark: #a07d1f;
	--kks-accent-light: #fdf6e7;
	--kks-green: #0d7d4f;
	--kks-green-dark: #086148;
	--kks-green-light: #e7f3ec;
	--kks-amber: #b45309;
	--kks-amber-dark: #92400e;
	--kks-amber-light: #fdf6e7;
	--kks-red: #b91c1c;
	--kks-red-dark: #991b1b;
	--kks-red-light: #fdecec;
	--kks-bg: #ffffff;
	--kks-bg-soft: #f7f9fc;
	--kks-bg-warm: #eef2f8;
	--kks-border: #dce3ed;
	--kks-border-strong: #a8b3c5;
	--kks-text: #1a1f2e;
	--kks-text-soft: #5a6275;
	--kks-text-strong: #0f2a4a;
	--kks-radius: 8px;
	--kks-radius-lg: 12px;
	--kks-shadow-sm: 0 1px 2px rgba(15, 42, 74, .04);
	--kks-shadow: 0 1px 3px rgba(15, 42, 74, .08), 0 1px 2px rgba(15, 42, 74, .04);
}

/* 3. Grund --------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	margin: 0;
	background: #fff;
	color: var(--kkt-text);
	font-family: var(--kkt-sans);
	font-size: 18px;
	line-height: 1.7;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
}

/* clip skapar ingen egen scrollyta, så att det klistrade sidhuvudet följer med
   när sidan scrollas och hamnar rätt under adminfältet för inloggade. */
@supports (overflow-x: clip) {
	body {
		overflow-x: clip;
	}
}

html.kkt-las,
html.kkt-las body {
	overflow: hidden;
}

img,
svg,
video,
iframe {
	max-width: 100%;
}

img {
	height: auto;
}

a {
	color: var(--kkt-navy);
}

a:hover {
	color: var(--kkt-gold-dark);
}

:focus-visible {
	outline: 3px solid var(--kkt-gold);
	outline-offset: 2px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.kkt-hoppa {
	position: absolute;
	left: 12px;
	top: -60px;
	z-index: 1000;
	background: var(--kkt-gold);
	color: var(--kkt-navy-dark);
	font-weight: 700;
	padding: 10px 16px;
	border-radius: var(--kkt-radius);
	text-decoration: none;
}

.kkt-hoppa:focus {
	top: 12px;
}

.kkt-ram {
	width: 100%;
	max-width: var(--kkt-ram);
	margin: 0 auto;
	padding: 0 24px;
}

.kkt-smal {
	width: 100%;
	max-width: calc(var(--kkt-bredd) + 48px);
	margin: 0 auto;
	padding: 0 24px;
}

.kkt-sida:focus {
	outline: none;
}

.kkt-ikon {
	display: block;
	flex: 0 0 auto;
}

/* 4. Sidhuvud och meny ---------------------------------------------------- */

.kkt-topp {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--kkt-navy);
	border-bottom: 3px solid var(--kkt-gold);
	transition: box-shadow .2s ease;
}

body.admin-bar .kkt-topp {
	top: 32px;
}

html.kkt-skrollad .kkt-topp {
	box-shadow: 0 6px 20px rgba(4, 16, 31, .28);
}

.kkt-topp__rad {
	display: flex;
	align-items: center;
	gap: 24px;
	min-height: 78px;
}

.kkt-logga {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	text-decoration: none;
	line-height: 0;
}

.kkt-logga__bild {
	width: 232px;
	height: auto;
}

.kkt-nav {
	margin-left: auto;
}

.kkt-nav__lista {
	display: flex;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kkt-nav__lista > li {
	position: relative;
}

.kkt-nav__lista > li > a {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 10px 14px;
	border-radius: 6px;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	position: relative;
}

.kkt-nav__lista > li > a::after {
	content: "";
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 4px;
	height: 2px;
	background: var(--kkt-gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .2s ease;
}

.kkt-nav__lista > li:hover > a::after,
.kkt-nav__lista > li:focus-within > a::after,
.kkt-nav__lista > .current-menu-item > a::after,
.kkt-nav__lista > .current-menu-ancestor > a::after,
.kkt-nav__lista > .current-menu-parent > a::after {
	transform: scaleX(1);
}

.kkt-nav__lista > .menu-item-has-children > a {
	padding-right: 30px;
}

.kkt-nav__lista > .menu-item-has-children > a::before {
	content: "";
	position: absolute;
	right: 14px;
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	opacity: .8;
}

.kkt-nav .sub-menu {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	z-index: 20;
	min-width: 270px;
	margin: 0;
	padding: 10px;
	list-style: none;
	background: #fff;
	border: 1px solid var(--kkt-line);
	border-top: 3px solid var(--kkt-gold);
	border-radius: 0 0 var(--kkt-radius) var(--kkt-radius);
	box-shadow: 0 18px 40px rgba(4, 16, 31, .22);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .16s ease, transform .16s ease, visibility 0s linear .16s;
}

/* Bryggan gör att menyn inte stängs när muspekaren går från länken till listan. */
.kkt-nav .sub-menu::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -12px;
	height: 12px;
}

.kkt-nav__lista > li:last-child > .sub-menu,
.kkt-nav__lista > li:nth-last-child(2) > .sub-menu {
	left: auto;
	right: 0;
}

.kkt-nav li:hover > .sub-menu,
.kkt-nav li:focus-within > .sub-menu,
.kkt-nav li.ar-oppen > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity .16s ease, transform .16s ease;
}

.kkt-nav .sub-menu a {
	display: block;
	padding: 8px 12px;
	border-radius: 6px;
	color: var(--kkt-ink);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
	text-decoration: none;
}

.kkt-nav .sub-menu a:hover,
.kkt-nav .sub-menu a:focus-visible,
.kkt-nav .sub-menu .current-menu-item > a {
	background: var(--kkt-blue-light);
	color: var(--kkt-navy);
}

.kkt-topp__verktyg {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-left: 4px;
}

.kkt-sokknapp,
.kkt-menyknapp {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 44px;
	min-width: 44px;
	padding: 0 12px;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 999px;
	background: transparent;
	color: #fff;
	font: 600 16px/1 var(--kkt-sans);
	cursor: pointer;
}

.kkt-sokknapp:hover,
.kkt-menyknapp:hover,
.kkt-sokknapp[aria-expanded="true"] {
	background: rgba(255, 255, 255, .1);
	border-color: var(--kkt-gold);
}

.kkt-menyknapp {
	display: none;
}

.kkt-sokruta {
	background: var(--kkt-navy-2);
	border-top: 1px solid rgba(255, 255, 255, .1);
	padding: 14px 0;
}

.kkt-sokruta .kkt-sok {
	max-width: 640px;
	margin-left: auto;
}

/* Sökfältet används i sidhuvudet, mobilmenyn, söksidan och 404. */
.kkt-sok {
	display: flex;
	align-items: stretch;
	gap: 8px;
	width: 100%;
}

.kkt-sok__falt {
	flex: 1 1 auto;
	min-width: 0;
	height: 48px;
	padding: 0 16px;
	border: 1px solid var(--kkt-line-strong);
	border-radius: var(--kkt-radius);
	background: #fff;
	color: var(--kkt-text);
	font: 400 17px var(--kkt-sans);
}

.kkt-sok__falt:focus {
	outline: none;
	border-color: var(--kkt-gold);
	box-shadow: 0 0 0 3px rgba(200, 158, 46, .3);
}

.kkt-sok__knapp {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 0 20px;
	border: 0;
	border-radius: var(--kkt-radius);
	background: var(--kkt-gold);
	color: var(--kkt-navy-dark);
	font: 700 17px var(--kkt-sans);
	cursor: pointer;
}

.kkt-sok__knapp:hover {
	background: #d8b14a;
}

.kkt-sok__knapp--ikon {
	width: 48px;
	padding: 0;
}

/* 5. Mobilmenyn ------------------------------------------------------------ */

.kkt-lada {
	position: fixed;
	inset: 0;
	z-index: 200;
}

.kkt-lada[hidden] {
	display: none;
}

.kkt-lada__bakgrund {
	position: absolute;
	inset: 0;
	background: rgba(4, 16, 31, .55);
	opacity: 0;
	transition: opacity .2s ease;
}

.kkt-lada__panel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(420px, 100%);
	overflow-y: auto;
	overscroll-behavior: contain;
	background: #fff;
	padding: 0 20px 32px;
	transform: translateX(100%);
	transition: transform .22s ease;
}

.kkt-lada.ar-oppen .kkt-lada__bakgrund {
	opacity: 1;
}

.kkt-lada.ar-oppen .kkt-lada__panel {
	transform: none;
}

.kkt-lada__topp {
	position: sticky;
	top: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 -20px 16px;
	padding: 14px 20px;
	background: var(--kkt-navy);
	border-bottom: 3px solid var(--kkt-gold);
	color: #fff;
}

.kkt-lada__titel {
	font: 700 18px var(--kkt-serif);
}

.kkt-lada__stang {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(255, 255, 255, .3);
	border-radius: 999px;
	background: transparent;
	color: #fff;
	cursor: pointer;
}

.kkt-sok--lada {
	margin-bottom: 18px;
}

.kkt-lada__lista,
.kkt-lada__lista .sub-menu,
.kkt-lada__smalista {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kkt-lada__lista > li {
	border-bottom: 1px solid var(--kkt-line);
	position: relative;
}

.kkt-lada__lista > li > a {
	display: block;
	padding: 14px 52px 14px 2px;
	color: var(--kkt-ink);
	font-size: 18px;
	font-weight: 700;
	text-decoration: none;
}

.kkt-lada__vaxla {
	position: absolute;
	top: 6px;
	right: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 999px;
	background: var(--kkt-blue-light);
	color: var(--kkt-navy);
	cursor: pointer;
}

.kkt-lada__vaxla .kkt-ikon {
	transition: transform .2s ease;
}

.kkt-lada__vaxla[aria-expanded="true"] .kkt-ikon {
	transform: rotate(180deg);
}

.kkt-lada__lista .sub-menu {
	padding: 0 0 10px 12px;
	border-left: 2px solid var(--kkt-gold);
	margin: 0 0 12px 2px;
}

.kkt-lada__lista .sub-menu[hidden] {
	display: none;
}

.kkt-lada__lista .sub-menu a {
	display: block;
	padding: 9px 8px;
	color: var(--kkt-text);
	font-size: 17px;
	text-decoration: none;
}

.kkt-lada__lista a:hover,
.kkt-lada__lista .current-menu-item > a {
	color: var(--kkt-gold-dark);
}

.kkt-lada__info {
	margin-top: 22px;
	padding-top: 16px;
}

.kkt-lada__smalista {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
}

.kkt-lada__smalista a {
	color: var(--kkt-soft);
	font-size: 15px;
}

@media (max-width: 1099px) {
	.kkt-nav {
		display: none;
	}

	.kkt-menyknapp {
		display: inline-flex;
	}

	.kkt-topp__verktyg {
		margin-left: auto;
	}
}

@media (max-width: 782px) {
	body.admin-bar .kkt-topp {
		top: 46px;
	}
}

@media (max-width: 600px) {
	body.admin-bar .kkt-topp {
		top: 0;
	}

	.kkt-topp__rad {
		min-height: 64px;
		gap: 12px;
	}

	.kkt-logga__bild {
		width: 178px;
	}

	.kkt-ram,
	.kkt-smal {
		padding: 0 16px;
	}

	.kkt-menyknapp span {
		display: none;
	}

	.kkt-menyknapp {
		padding: 0;
		width: 44px;
	}
}

/* 6. Startsidans topp -------------------------------------------------------- */

.kkt-hero {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(1100px 420px at 85% 0%, rgba(200, 158, 46, .16), transparent 60%),
		linear-gradient(135deg, #0d2442 0%, #1e3a5f 58%, #24486f 100%);
	color: #fff;
}

.kkt-hero::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: rgba(255, 255, 255, .12);
}

.kkt-hero__inre {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 420px;
	gap: 40px;
	align-items: center;
	padding-top: 56px;
	padding-bottom: 56px;
}

.kkt-hero__rubrik {
	text-wrap: balance;
	margin: 0 0 18px;
	font: 700 clamp(30px, 4.2vw, 48px)/1.18 var(--kkt-serif);
	letter-spacing: -.01em;
	color: #fff;
}

.kkt-hero__rubrik::after {
	content: "";
	display: block;
	width: 64px;
	height: 3px;
	margin-top: 20px;
	border-radius: 2px;
	background: var(--kkt-gold);
}

.kkt-hero__ingress {
	max-width: 620px;
	margin: 0 0 26px;
	color: #d7e1ee;
	font-size: 20px;
	line-height: 1.6;
}

.kkt-genvagar__rubrik {
	margin: 0 0 10px;
	color: #e9cf86;
	font-size: 15px;
	font-weight: 600;
}

.kkt-genvagar ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kkt-genvagar a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 7px 16px;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 999px;
	background: rgba(255, 255, 255, .06);
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.kkt-genvagar a:hover,
.kkt-genvagar a:focus-visible {
	background: var(--kkt-gold);
	border-color: var(--kkt-gold);
	color: var(--kkt-navy-dark);
}

.kkt-hero__bild {
	display: flex;
	justify-content: center;
}

.kkt-hero__svg {
	width: 100%;
	height: auto;
	max-width: 420px;
}

@media (max-width: 960px) {
	.kkt-hero__inre {
		grid-template-columns: minmax(0, 1fr);
		padding-top: 36px;
		padding-bottom: 36px;
	}

	.kkt-hero__bild {
		display: none;
	}

	.kkt-hero__ingress {
		font-size: 18px;
	}
}

/* 7. Titelyta på sidor och inlägg ------------------------------------------- */

.kkt-titelyta {
	position: relative;
	overflow: hidden;
	background: var(--kkt-paper);
	border-bottom: 1px solid var(--kkt-line);
	margin-bottom: 36px;
}

/* Ett svagt kort i hörnet, sajtens kännetecken. Visas bara när det finns
   plats bredvid textspalten, så att det aldrig hamnar bakom rubriken. */
.kkt-titelyta::after {
	content: "";
	position: absolute;
	right: max(28px, calc((100vw - var(--kkt-ram)) / 2 + 24px));
	top: 50%;
	width: 150px;
	height: 95px;
	margin-top: -47px;
	border: 2px solid rgba(30, 58, 95, .12);
	border-radius: 11px;
	background:
		linear-gradient(rgba(30, 58, 95, .08), rgba(30, 58, 95, .08)) 0 20px / 100% 14px no-repeat,
		linear-gradient(rgba(200, 158, 46, .35), rgba(200, 158, 46, .35)) 16px 50px / 25px 19px no-repeat;
	transform: rotate(-8deg);
	pointer-events: none;
}

.kkt-titelyta__inre {
	position: relative;
	z-index: 1;
	max-width: calc(var(--kkt-bredd) + 48px);
	margin: 0 auto;
	padding: 26px 24px 30px;
}

.kkt-titelyta--bred .kkt-titelyta__inre {
	max-width: var(--kkt-ram);
}

.kkt-titelyta__rubrik {
	margin: 6px 0 0;
	color: var(--kkt-ink);
	font: 700 clamp(28px, 3.4vw, 40px)/1.22 var(--kkt-serif);
	letter-spacing: -.01em;
}

.kkt-titelyta__text {
	max-width: 760px;
	margin-top: 10px;
	color: var(--kkt-soft);
}

.kkt-titelyta__sok {
	max-width: 640px;
	margin-top: 18px;
}

.kkt-smulor {
	color: var(--kkt-soft);
	font-size: 15px;
	line-height: 1.5;
}

.kkt-smulor a {
	color: var(--kkt-soft);
	text-decoration: none;
}

.kkt-smulor a:hover {
	color: var(--kkt-navy);
	text-decoration: underline;
}

.kkt-smulor__sep {
	margin: 0 4px;
	color: var(--kkt-gold);
}

.kkt-etikett {
	display: inline-block;
	margin-top: 10px;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--kkt-gold-light);
	border: 1px solid #ecd9a6;
	color: var(--kkt-gold-dark);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	text-decoration: none;
}

a.kkt-etikett:hover {
	background: var(--kkt-gold);
	color: var(--kkt-navy-dark);
}

.kkt-etikett--ljus {
	background: var(--kkt-blue-light);
	border-color: var(--kkt-line);
	color: var(--kkt-navy);
}

.kkt-toppbild {
	margin: 0 0 32px;
}

.kkt-toppbild__bild {
	display: block;
	width: 100%;
	border-radius: var(--kkt-radius-lg);
}

.kkt-toppbild__text {
	margin-top: 8px;
	color: var(--kkt-soft);
	font-size: 15px;
	line-height: 1.5;
}

@media (max-width: 1239px) {
	.kkt-titelyta::after {
		display: none;
	}
}

.kkt-titelyta--bred::after {
	display: none;
}

@media (max-width: 600px) {
	.kkt-titelyta {
		margin-bottom: 26px;
	}

	.kkt-titelyta__inre {
		padding: 18px 16px 22px;
	}
}

/* 8. Innehållets typografi ---------------------------------------------------- */

.kkt-main {
	padding-bottom: 64px;
}

.kkt-main--start {
	padding-top: 40px;
}

.kkt-main--start .kkt-artikel {
	width: 100%;
	max-width: calc(var(--kkt-bredd) + 48px);
	margin: 0 auto;
	padding: 0 24px;
}

.kkt-innehall {
	color: var(--kkt-text);
	font-size: 18px;
	line-height: 1.7;
	overflow-wrap: break-word;
}

.kkt-innehall > *:first-child {
	margin-top: 0;
}

.entry-content p {
	margin: 0 0 1.2em;
}

.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5 {
	color: var(--kkt-ink);
	font-family: var(--kkt-serif);
	font-weight: 700;
	letter-spacing: -.005em;
	scroll-margin-top: 110px;
}

.entry-content h2 {
	margin: 2.3em 0 .75em;
	font-size: 28px;
	line-height: 1.3;
}

.entry-content h2::before {
	content: "";
	display: block;
	width: 44px;
	height: 3px;
	margin-bottom: 14px;
	border-radius: 2px;
	background: var(--kkt-gold);
}

.entry-content h3 {
	margin: 1.9em 0 .55em;
	font-size: 22px;
	line-height: 1.35;
	color: var(--kkt-navy);
}

.entry-content h4 {
	margin: 1.6em 0 .45em;
	font-family: var(--kkt-sans);
	font-size: 19px;
	line-height: 1.4;
}

.entry-content h5 {
	margin: 1.4em 0 .4em;
	font-family: var(--kkt-sans);
	font-size: 17px;
}

.entry-content a {
	color: var(--kkt-navy);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	text-decoration-color: rgba(30, 58, 95, .45);
	transition: color .15s, text-decoration-color .15s;
}

.entry-content a:hover {
	color: var(--kkt-gold-dark);
	text-decoration-color: var(--kkt-gold);
}

.entry-content strong {
	color: var(--kkt-ink);
}

.entry-content img {
	border-radius: var(--kkt-radius);
	height: auto;
	max-width: 100%;
}

.entry-content img.kkt-liten {
	border-radius: 0;
}

.entry-content .alignright {
	float: right;
	margin: .3em 0 1em 1.4em;
	max-width: 45%;
}

.entry-content .alignleft {
	float: left;
	margin: .3em 1.4em 1em 0;
	max-width: 45%;
}

.entry-content .aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.entry-content figure {
	margin: 1.6em 0;
}

.entry-content .wp-caption,
.entry-content figure {
	max-width: 100%;
}

.entry-content figcaption,
.entry-content .wp-caption-text {
	margin-top: .5em;
	color: var(--kkt-soft);
	font-size: 15px;
	line-height: 1.5;
}

.entry-content ul,
.entry-content ol {
	margin: 0 0 1.4em;
	padding-left: 1.6em;
}

.entry-content li {
	margin-bottom: .5em;
}

.entry-content li:last-child {
	margin-bottom: 0;
}

.entry-content ul:not([class]) > li::marker {
	color: var(--kkt-gold-dark);
}

.entry-content blockquote {
	background: var(--kkt-blue-light);
	border-left: 4px solid var(--kkt-gold);
	padding: 1.3em 1.5em;
	margin: 2em 0;
	border-radius: 0 var(--kkt-radius) var(--kkt-radius) 0;
	font-size: 1.05em;
	font-style: italic;
	color: var(--kkt-ink);
}

.entry-content blockquote p:last-child {
	margin-bottom: 0;
}

.entry-content code {
	background: var(--kkt-blue-light);
	border: 1px solid var(--kkt-line);
	padding: .15em .4em;
	border-radius: 4px;
	font-size: .9em;
	color: var(--kks-primary-dark);
}

.entry-content hr {
	border: none;
	border-top: 1px solid var(--kkt-line);
	margin: 2.4em 0;
}

.entry-content iframe {
	display: block;
	max-width: 100%;
	border: 0;
}

@media (max-width: 600px) {
	body,
	.kkt-innehall {
		font-size: 17px;
	}

	.entry-content h2 {
		font-size: 23px;
	}

	.entry-content h3 {
		font-size: 20px;
	}

	.entry-content h4 {
		font-size: 18px;
	}

	.entry-content .alignright,
	.entry-content .alignleft {
		float: none;
		display: block;
		max-width: 100%;
		margin: 1em auto;
	}
}

/* 9. Innehållets rutor, listor och tabeller ------------------------------------ */

.entry-content .kks-info,
.entry-content .kks-tips,
.entry-content .kks-warning,
.entry-content .kks-fakta {
	padding: 1.2em 1.4em;
	margin: 1.8em 0;
	border-radius: 0 var(--kkt-radius) var(--kkt-radius) 0;
	border-left: 4px solid;
}

.entry-content .kks-info {
	background: var(--kks-primary-light);
	border-left-color: var(--kks-primary);
}

.entry-content .kks-tips {
	background: var(--kks-green-light);
	border-left-color: var(--kks-green);
}

.entry-content .kks-warning {
	background: var(--kks-amber-light);
	border-left-color: var(--kks-amber);
}

.entry-content .kks-fakta {
	background: var(--kks-accent-light);
	border-left-color: var(--kks-accent);
}

.entry-content .kks-info p:last-child,
.entry-content .kks-tips p:last-child,
.entry-content .kks-warning p:last-child,
.entry-content .kks-fakta p:last-child {
	margin-bottom: 0;
}

.entry-content .kks-info-rubrik,
.entry-content .kks-tips-rubrik,
.entry-content .kks-warning-rubrik,
.entry-content .kks-fakta-rubrik,
.entry-content p.kks-info > strong:first-child,
.entry-content p.kks-tips > strong:first-child,
.entry-content p.kks-warning > strong:first-child,
.entry-content p.kks-fakta > strong:first-child {
	display: block;
	margin: 0 0 .5em;
	font-family: var(--kkt-serif);
	font-size: 1.02em;
	font-weight: 700;
	line-height: 1.4;
}

.entry-content .kks-info-rubrik,
.entry-content p.kks-info > strong:first-child { color: var(--kks-primary-dark); }
.entry-content .kks-tips-rubrik,
.entry-content p.kks-tips > strong:first-child { color: var(--kks-green-dark); }
.entry-content .kks-warning-rubrik,
.entry-content p.kks-warning > strong:first-child { color: var(--kks-amber-dark); }
.entry-content .kks-fakta-rubrik,
.entry-content p.kks-fakta > strong:first-child { color: var(--kks-accent-dark); }

.entry-content ul.kks-fordelar,
.entry-content ul.kks-nackdelar {
	list-style: none;
	padding-left: 0;
}

.entry-content ul.kks-fordelar li,
.entry-content ul.kks-nackdelar li {
	position: relative;
	padding-left: 2em;
	margin-bottom: .7em;
}

.entry-content ul.kks-fordelar li::before,
.entry-content ul.kks-nackdelar li::before {
	position: absolute;
	left: 0;
	top: .2em;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.35em;
	height: 1.35em;
	border-radius: 50%;
	color: #fff;
	font-weight: 700;
	line-height: 1;
}

.entry-content ul.kks-fordelar li::before {
	content: "\2713";
	background: var(--kks-green);
	font-size: .8em;
}

.entry-content ul.kks-nackdelar li::before {
	content: "\00d7";
	background: var(--kks-red);
	font-size: 1em;
	top: .1em;
}

.entry-content ol.kks-steg {
	list-style: none;
	counter-reset: kks-steg;
	padding-left: 0;
}

.entry-content ol.kks-steg li {
	position: relative;
	padding-left: 2.6em;
	margin-bottom: 1em;
	counter-increment: kks-steg;
}

.entry-content ol.kks-steg li::before {
	content: counter(kks-steg);
	position: absolute;
	left: 0;
	top: -.05em;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.8em;
	height: 1.8em;
	border-radius: 50%;
	background: var(--kks-primary);
	box-shadow: 0 0 0 3px var(--kkt-gold-light), 0 0 0 4px rgba(200, 158, 46, .5);
	color: #fff;
	font-weight: 700;
	font-size: .92em;
}

.entry-content .kks-proscons {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 1.4em;
	margin: 2em 0;
}

.entry-content .kks-pros,
.entry-content .kks-cons {
	background: #fff;
	border: 1px solid var(--kkt-line);
	border-radius: var(--kkt-radius);
	padding: 1.3em 1.4em;
	box-shadow: var(--kks-shadow-sm);
	min-width: 0;
}

.entry-content .kks-pros { border-top: 4px solid var(--kks-green); }
.entry-content .kks-cons { border-top: 4px solid var(--kks-red); }

.entry-content .kks-pros h3,
.entry-content .kks-pros h4,
.entry-content .kks-cons h3,
.entry-content .kks-cons h4 {
	margin: 0 0 .8em;
	padding: 0;
	border: none;
	font-size: 1.1em;
}

.entry-content .kks-pros h3,
.entry-content .kks-pros h4 { color: var(--kks-green-dark); }
.entry-content .kks-cons h3,
.entry-content .kks-cons h4 { color: var(--kks-red-dark); }

.entry-content .kks-pros ul,
.entry-content .kks-cons ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.entry-content .kks-pros li,
.entry-content .kks-cons li {
	position: relative;
	padding-left: 1.6em;
	margin-bottom: .5em;
}

.entry-content .kks-pros li::before,
.entry-content .kks-cons li::before {
	position: absolute;
	left: 0;
	font-weight: 700;
}

.entry-content .kks-pros li::before {
	content: "\2713";
	top: 0;
	color: var(--kks-green);
}

.entry-content .kks-cons li::before {
	content: "\00d7";
	top: -.1em;
	color: var(--kks-red);
	font-size: 1.2em;
}

@media (max-width: 640px) {
	.entry-content .kks-proscons {
		grid-template-columns: 1fr;
	}
}

/* Tabeller. Tabeller med tre eller fler kolumner blir kort i mobilen. */
.entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.6em 0;
	background: #fff;
	border: 1px solid var(--kkt-line);
	border-radius: var(--kkt-radius);
	overflow: hidden;
	box-shadow: var(--kks-shadow-sm);
	font-size: .95em;
	line-height: 1.55;
}

.entry-content table th,
.entry-content table td {
	padding: .85em 1em;
	text-align: left;
	border-bottom: 1px solid var(--kkt-line);
	vertical-align: top;
}

.entry-content table th {
	background: var(--kks-primary);
	color: #fff;
	font-weight: 700;
	font-size: .94em;
	border-bottom: none;
}

.entry-content table tbody tr:nth-child(even) {
	background: var(--kks-bg-soft);
}

.entry-content table tbody tr:last-child td {
	border-bottom: none;
}

.entry-content table tbody tr:hover {
	background: var(--kks-bg-warm);
}

.entry-content table.kks-snabbfakta th,
.entry-content table.kks-snabbfakta td:first-child {
	background: var(--kks-bg-warm);
	color: var(--kkt-ink);
	width: 42%;
	font-weight: 600;
}

.entry-content table.kks-snabbfakta td {
	background: #fff;
}

.entry-content table.kkt-rulla {
	display: block;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

@media (max-width: 700px) {
	.entry-content table {
		font-size: .92em;
	}

	.entry-content table th,
	.entry-content table td {
		padding: .65em .75em;
	}

	.entry-content table.kkt-stapla,
	.entry-content table.kkt-stapla thead,
	.entry-content table.kkt-stapla tbody,
	.entry-content table.kkt-stapla tr,
	.entry-content table.kkt-stapla th,
	.entry-content table.kkt-stapla td {
		display: block;
		width: 100%;
	}

	.entry-content table.kkt-stapla {
		border: none;
		box-shadow: none;
		background: transparent;
		overflow: visible;
	}

	.entry-content table.kkt-stapla thead,
	.entry-content table.kkt-stapla .kkt-stapla__huvud {
		position: absolute;
		left: -9999px;
		top: -9999px;
	}

	.entry-content table.kkt-stapla tr {
		background: #fff;
		border: 1px solid var(--kkt-line);
		border-radius: var(--kkt-radius);
		margin-bottom: 1em;
		padding: .4em 0;
		box-shadow: var(--kks-shadow-sm);
	}

	.entry-content table.kkt-stapla tbody tr:nth-child(even),
	.entry-content table.kkt-stapla tbody tr:hover {
		background: #fff;
	}

	.entry-content table.kkt-stapla td {
		border: none;
		border-bottom: 1px solid var(--kkt-line);
		padding: .75em 1em;
	}

	.entry-content table.kkt-stapla td::before {
		content: attr(data-label);
		display: block;
		margin-bottom: .25em;
		color: var(--kkt-ink);
		font-weight: 700;
		text-transform: none;
		letter-spacing: 0;
	}

	.entry-content table.kkt-stapla td:first-child {
		background: var(--kks-bg-soft);
		color: var(--kkt-ink);
		font-weight: 700;
		font-size: 1.05em;
	}

	.entry-content table.kkt-stapla td:first-child::before {
		display: none;
	}

	.entry-content table.kkt-stapla td:last-child {
		border-bottom: none;
	}
}

.entry-content .kks-internlankar {
	background: var(--kks-primary-light);
	border: 1px solid var(--kks-primary-border);
	border-radius: var(--kkt-radius);
	padding: 1.4em 1.6em;
	margin: 2.2em 0;
}

.entry-content .kks-internlankar h2,
.entry-content .kks-internlankar h3 {
	margin: 0 0 .7em;
	padding: 0;
	border: none;
	color: var(--kks-primary-dark);
	font-size: 1.15em;
}

.entry-content .kks-internlankar h2::before {
	display: none;
}

.entry-content .kks-internlankar ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
	columns: 2 260px;
	column-gap: 2em;
}

.entry-content .kks-internlankar li {
	position: relative;
	padding-left: 1.5em;
	margin-bottom: .45em;
	break-inside: avoid;
}

.entry-content .kks-internlankar li::before {
	content: "\2192";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--kks-accent);
	font-weight: 700;
}

.entry-content .kks-faq h3 {
	background: var(--kks-bg-soft);
	border-left: 3px solid var(--kks-accent);
	padding: .7em 1em;
	margin: 1.2em 0 .5em;
	border-radius: 0 var(--kkt-radius) var(--kkt-radius) 0;
	font-size: 1.05em;
	color: var(--kkt-ink);
}

.entry-content .kks-faq h3 + p {
	padding: 0 1em;
	margin-bottom: .5em;
}

.entry-content a.kks-btn {
	display: inline-block;
	background: var(--kks-primary);
	color: #fff;
	padding: .8em 1.6em;
	border-radius: var(--kkt-radius);
	text-decoration: none;
	font-weight: 700;
	border: 2px solid var(--kks-primary);
	transition: all .15s;
	margin: .2em .3em .2em 0;
}

.entry-content a.kks-btn:hover {
	background: var(--kks-primary-dark);
	border-color: var(--kks-primary-dark);
	color: #fff;
}

.entry-content a.kks-btn-outline {
	background: transparent;
	color: var(--kks-primary);
}

.entry-content a.kks-btn-outline:hover {
	background: var(--kks-primary);
	color: #fff;
}

.entry-content a.kks-btn-gold {
	background: var(--kks-accent);
	border-color: var(--kks-accent);
	color: #fff;
}

.entry-content a.kks-btn-gold:hover {
	background: var(--kks-accent-dark);
	border-color: var(--kks-accent-dark);
}

.entry-content .kks-kortrad {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 1.2em;
	align-items: center;
	background: #fff;
	border: 1px solid var(--kkt-line);
	border-radius: var(--kkt-radius);
	padding: 1.4em 1.6em;
	margin: 1.2em 0;
	box-shadow: var(--kks-shadow);
}

.entry-content .kks-kortrad h3 {
	margin: 0 0 .4em;
	border: none;
	padding: 0;
	font-size: 1.15em;
}

.entry-content .kks-kortrad p {
	margin: 0;
	font-size: .95em;
}

@media (max-width: 600px) {
	.entry-content .kks-kortrad {
		grid-template-columns: 1fr;
	}
}

/* Lagstadgad kreditvarning (KOVFS 2025:1): svart text på vit bakgrund. */
.entry-content .kks-lagvarning {
	display: flex;
	align-items: flex-start;
	gap: 1.2em;
	padding: 1.2em 1.4em;
	margin: 1.8em 0;
	background: #fff;
	border: 1px solid var(--kkt-line);
	border-left: 4px solid var(--kks-red);
	border-radius: 0 var(--kkt-radius) var(--kkt-radius) 0;
}

.entry-content .kks-lagvarning::before {
	content: "";
	flex: 0 0 auto;
	width: 56px;
	height: 56px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 90'%3E%3Cpath d='M50 5 L97 87 L3 87 Z' fill='none' stroke='%23b91c1c' stroke-width='7' stroke-linejoin='round'/%3E%3Crect x='45.5' y='32' width='9' height='30' rx='4' fill='%23b91c1c'/%3E%3Ccircle cx='50' cy='74' r='5.5' fill='%23b91c1c'/%3E%3C/svg%3E") no-repeat center / contain;
}

.entry-content .kks-lagvarning > div,
.entry-content .kks-lagvarning p {
	min-width: 0;
}

.entry-content .kks-lagvarning p {
	margin: 0;
	color: #000;
}

.entry-content .kks-lagvarning-rubrik {
	font-weight: 700;
	margin: 0 0 .4em;
	color: #000;
}

@media (max-width: 700px) {
	.entry-content .kks-lagvarning {
		flex-direction: column;
		gap: .8em;
	}
}

/* 10. Staplar och illustrationer i texterna ------------------------------------
   Staplarna har all sin stil inline i texten. Temat lägger bara till rörelse:
   staplarna växer fram när de syns och raden markeras när man pekar på den. */

.entry-content .kks-diagram,
.entry-content .kks-illustration {
	max-width: 100%;
}

.entry-content .kks-diagram svg,
.entry-content .kks-illustration svg {
	display: block;
	max-width: 100%;
	height: auto;
}

.entry-content .kks-stapel {
	transition: background-color .15s ease, box-shadow .15s ease;
	border-radius: 8px;
}

.entry-content .kks-stapel:hover,
.entry-content .kks-stapel:focus-within {
	background-color: #f3f6fb;
	box-shadow: 0 0 0 6px #f3f6fb;
}

.entry-content .kks-stapel:hover .kks-stapel-fyll {
	filter: brightness(1.08) saturate(1.1);
}

html.kkt-js .entry-content .kks-stapel-fyll {
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 1s cubic-bezier(.22, .61, .36, 1), filter .15s ease;
}

html.kkt-js .entry-content .kks-stapel.ar-synlig .kks-stapel-fyll {
	transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
	html.kkt-js .entry-content .kks-stapel-fyll {
		transform: none;
		transition: none;
	}
}

/* 11. Kortlistor, kortsidor och skribentsidor från pluginen ---------------------- */

.kksc-single-main {
	width: 100%;
	max-width: calc(var(--kkt-bredd) + 48px);
	margin: 0 auto;
	padding: 36px 24px 64px;
}

.kksc-single-main .kksc-single-title {
	color: var(--kkt-ink);
	font-family: var(--kkt-serif);
	font-weight: 700;
	line-height: 1.22;
}

.kksc-single-content {
	font-size: 18px;
	line-height: 1.7;
}

.kksc-related h2 {
	font-family: var(--kkt-serif);
	color: var(--kkt-ink);
}

.entry-content .kksc-cards,
.kksc-single-main .kksc-cards {
	padding-left: 0;
}

.kks-eeat-author-main {
	width: 100%;
	max-width: calc(var(--kkt-bredd) + 48px);
	margin: 0 auto;
	padding: 36px 24px 64px;
}

.kks-eeat-author-main h1,
.kks-eeat-author-main h2 {
	font-family: var(--kkt-serif);
	color: var(--kkt-ink);
}

@media (max-width: 600px) {
	.kksc-single-main,
	.kks-eeat-author-main {
		padding: 24px 16px 48px;
	}

	.kksc-single-content {
		font-size: 17px;
	}
}

/* 12. Artikelkort, arkiv och sök ---------------------------------------------------- */

.kkt-listyta {
	padding-bottom: 20px;
}

.kkt-rutnat {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
}

.kkt-kort {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--kkt-line);
	border-radius: var(--kkt-radius-lg);
	box-shadow: var(--kkt-skugga);
	transition: transform .18s ease, box-shadow .18s ease;
}

.kkt-kort:hover {
	transform: translateY(-3px);
	box-shadow: 0 2px 4px rgba(15, 42, 74, .06), 0 16px 34px rgba(15, 42, 74, .12);
}

.kkt-kort__media {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--kkt-blue-light);
}

.kkt-kort__bild {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.kkt-kort__media--tom {
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--kkt-navy), #2b5283);
	color: var(--kkt-gold);
}

.kkt-kort__media--tom .kkt-ikon {
	width: 54px;
	height: 54px;
}

.kkt-kort__text {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 18px 20px 20px;
	flex: 1 1 auto;
}

.kkt-kort__text .kkt-etikett {
	align-self: flex-start;
	margin-top: 0;
}

.kkt-kort__rubrik {
	margin: 0;
	font: 700 19px/1.35 var(--kkt-serif);
}

.kkt-kort__rubrik a {
	color: var(--kkt-ink);
	text-decoration: none;
}

.kkt-kort__rubrik a:hover {
	color: var(--kkt-gold-dark);
}

.kkt-kort__utdrag {
	margin: 0;
	color: var(--kkt-soft);
	font-size: 16px;
	line-height: 1.55;
}

.kkt-kort__datum {
	margin-top: auto;
	color: var(--kkt-soft);
	font-size: 14px;
}

.kkt-rad {
	padding: 52px 0 60px;
	background: var(--kkt-paper);
	border-top: 1px solid var(--kkt-line);
}

.kkt-rad__huvud {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px 20px;
	margin-bottom: 22px;
}

.kkt-rad__rubrik {
	margin: 0;
	color: var(--kkt-ink);
	font: 700 26px/1.3 var(--kkt-serif);
}

.kkt-rad__alla {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--kkt-navy);
	font-weight: 700;
	text-decoration: none;
}

.kkt-rad__alla:hover {
	color: var(--kkt-gold-dark);
}

.kkt-sidor {
	margin-top: 36px;
}

.kkt-sidor .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.kkt-sidor .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 44px;
	padding: 0 14px;
	border: 1px solid var(--kkt-line);
	border-radius: 999px;
	color: var(--kkt-navy);
	font-weight: 700;
	text-decoration: none;
}

.kkt-sidor .page-numbers.current,
.kkt-sidor a.page-numbers:hover {
	background: var(--kkt-navy);
	border-color: var(--kkt-navy);
	color: #fff;
}

.kkt-tomt h2 {
	margin-top: 0;
	font-family: var(--kkt-serif);
	color: var(--kkt-ink);
}

.kkt-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 20px 0;
	padding: 0;
	list-style: none;
}

.kkt-chips a {
	display: inline-block;
	padding: 7px 14px;
	border: 1px solid var(--kkt-line);
	border-radius: 999px;
	background: var(--kkt-blue-light);
	color: var(--kkt-navy);
	font-weight: 600;
	text-decoration: none;
}

.kkt-chips a:hover {
	background: var(--kkt-gold);
	border-color: var(--kkt-gold);
	color: var(--kkt-navy-dark);
}

.kkt-taggar {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 28px 0 0;
}

/* 13. Sidfot ------------------------------------------------------------------------ */

.kkt-fot {
	background: var(--kkt-navy-dark);
	border-top: 3px solid var(--kkt-gold);
	color: #c6d2e1;
	font-size: 16px;
	line-height: 1.6;
}

.kkt-fot a {
	color: #e3eaf3;
	text-decoration: none;
}

.kkt-fot a:hover {
	color: #e9cf86;
	text-decoration: underline;
}

.kkt-fot__rutnat {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) repeat(4, minmax(0, 1fr));
	gap: 32px;
	padding-top: 52px;
	padding-bottom: 40px;
}

.kkt-fot__om p {
	margin: 18px 0 0;
	max-width: 340px;
}

.kkt-logga--fot .kkt-logga__bild {
	width: 210px;
}

.kkt-widget__rubrik {
	margin: 0 0 12px;
	color: #fff;
	font: 700 16px/1.4 var(--kkt-serif);
}

.kkt-fot .kkt-widget ul,
.kkt-fot .menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kkt-fot .kkt-widget li {
	margin: 0 0 8px;
	line-height: 1.4;
}

.kkt-fot__botten {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 28px;
	padding-top: 22px;
	padding-bottom: 28px;
	border-top: 1px solid rgba(255, 255, 255, .12);
}

.kkt-fot__bolag {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 18px;
	margin: 0;
	font-size: 15px;
}

.kkt-fot__drivs strong {
	color: #fff;
}

.kkt-fot__bolag span + span::before {
	content: "";
	display: inline-block;
	width: 5px;
	height: 5px;
	margin: 0 12px 2px 0;
	border-radius: 50%;
	background: var(--kkt-gold);
	vertical-align: middle;
}

.kkt-fot__slut {
	display: flex;
	align-items: center;
	gap: 16px;
}

.kkt-fot__copy {
	margin: 0;
	font-size: 15px;
}

.kkt-fot__dmca img {
	display: block;
	width: 100px;
	height: 20px;
	overflow: hidden;
	color: transparent;
	font-size: 0;
}

@media (max-width: 1100px) {
	.kkt-fot__rutnat {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.kkt-fot__om {
		grid-column: 1 / -1;
	}
}

@media (max-width: 560px) {
	.kkt-fot__rutnat {
		grid-template-columns: minmax(0, 1fr);
		gap: 26px;
		padding-top: 40px;
	}

	.kkt-fot__bolag {
		flex-direction: column;
	}

	.kkt-fot__bolag span + span::before {
		display: none;
	}
}

/* 14. Formulär, knappar och övrigt ----------------------------------------------------- */

.kkt-knapp,
.entry-content input[type="submit"],
.wpcf7-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 22px;
	border: 0;
	border-radius: var(--kkt-radius);
	background: var(--kkt-navy);
	color: #fff;
	font: 700 17px var(--kkt-sans);
	text-decoration: none;
	cursor: pointer;
}

.kkt-knapp:hover,
.entry-content input[type="submit"]:hover,
.wpcf7-submit:hover {
	background: var(--kkt-navy-dark);
	color: #fff;
}

.entry-content input[type="text"],
.entry-content input[type="email"],
.entry-content input[type="tel"],
.entry-content input[type="url"],
.entry-content input[type="number"],
.entry-content textarea,
.entry-content select,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	max-width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--kkt-line-strong);
	border-radius: var(--kkt-radius);
	background: #fff;
	color: var(--kkt-text);
	font: 400 17px var(--kkt-sans);
}

.entry-content input:focus,
.entry-content textarea:focus,
.entry-content select:focus {
	outline: none;
	border-color: var(--kkt-gold);
	box-shadow: 0 0 0 3px rgba(200, 158, 46, .3);
}

.kkt-kommentarer {
	margin-top: 40px;
	padding-top: 24px;
	border-top: 1px solid var(--kkt-line);
}

.kkt-delsidor {
	margin: 24px 0;
	font-weight: 700;
}

@media print {
	.kkt-topp,
	.kkt-lada,
	.kkt-fot,
	.kkt-rad,
	.kkt-hero__bild {
		display: none !important;
	}
}