/*
Theme Name: Bäst i testet
Description: Barntema till Twenty Twenty-Five för Bäst i testet. Topplistor som en datadriven jämförelsesajt: vit sida, nästan svart text, numrerade listor och tabeller med poäng. Limegrönt bara som liten markering för plats 1 och i fokusringen.
Author: Bäst i testet
Template: twentytwentyfive
Version: 2.0.0
Text Domain: bp-pengar
*/

/* ================================================================ Tokens */
/* Avstånd i steg om 4, 8, 12, 16, 24, 32, 48, 64 och 96 px. Innehåll högst 1200 px, textkolumn 680 px. */

:root {
	--t: #141715;
	--t2: #4A524D;
	--linje: #DADFDC;
	--yta: #F4F6F5;
	--lank: #3B5000;
	--lime: #C6F432;
	--rubrik: 'Wix Madefor Display', 'Helvetica Neue', Arial, sans-serif;
	--brod: Mulish, 'Helvetica Neue', Arial, sans-serif;
	--textkolumn: 680px;

	--bit-accent: #3B5000;
	--bit-pa-accent: #FFFFFF;
	--bit-yta: #F4F6F5;
	--bit-bakgrund: #FFFFFF;
	--bit-text: #141715;
	--bit-text-svag: #4A524D;
	--bit-kant: #DADFDC;
	--bit-radie: 4px;
	--bit-font-rubrik: 'Wix Madefor Display', 'Helvetica Neue', Arial, sans-serif;
	--bit-vinnare: #141715;
	--bit-pa-vinnare: #FFFFFF;
	--bit-plus: #2E6A1F;
	--bit-minus: #A3271F;
	--bit-mellanrum: 1.5rem;
}

/* ================================================================ Grund */

html { scroll-padding-top: 1rem; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #FFFFFF; color: var(--t); font-family: var(--brod); font-size: clamp(1.0625rem, 1rem + .3vw, 1.1875rem); line-height: 1.62; }
img { max-width: 100%; height: auto; }
a { color: var(--lank); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--t); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--t); outline-offset: 2px; box-shadow: 0 0 0 8px var(--lime); border-radius: 2px; }
h1, h2, h3, h4 { font-family: var(--rubrik); font-weight: 700; color: var(--t); letter-spacing: -.01em; text-wrap: balance; }
strong { font-weight: 700; }
.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; }
.skip-link.screen-reader-text:focus { clip: auto; width: auto; height: auto; margin: 0; z-index: 1000; left: 1rem; top: 1rem; padding: .75rem 1rem; background: #FFFFFF; color: var(--t); font-weight: 700; }
main { padding-bottom: 4rem; }

/* ================================================================ Sidhuvud och navigation */

.bt-header { background: #FFFFFF; border-bottom: 1px solid var(--linje); }
.bt-header-in { min-height: 72px; gap: 1.5rem; }
.bt-ordbild { font: 700 1.5rem/1 var(--rubrik); letter-spacing: -.015em; color: var(--t); text-decoration: none; white-space: nowrap; padding: .5rem 0; }
.bt-ordbild:hover { color: var(--t); text-decoration: underline; text-decoration-thickness: 2px; }
.bt-nav .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; padding: .25rem .75rem; color: var(--t); text-decoration: none; }
.bt-nav .wp-block-navigation-item__content:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .3em; }
.bt-nav .wp-block-navigation-item__content[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .3em; }
.bt-nav .wp-block-navigation__submenu-container { background: #FFFFFF !important; border: 1px solid var(--linje) !important; border-radius: 4px; padding: .5rem 0 !important; min-width: 14rem !important; }
.bt-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { width: 100%; padding: .5rem 1rem; font-weight: 400; }
.bt-nav .wp-block-navigation__submenu-icon { color: var(--t); }
.bt-nav-sok .wp-block-navigation-item__content::before { content: ""; width: .95rem; height: .95rem; margin-right: .4rem; border: 2px solid currentColor; border-radius: 50%; box-sizing: border-box; }
.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close { min-width: 48px; min-height: 48px; display: inline-grid; place-items: center; color: var(--t) !important; }
.wp-block-navigation__responsive-container.is-menu-open { background: #FFFFFF !important; color: var(--t) !important; padding: 1rem clamp(1rem, 5vw, 2rem) !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { align-items: flex-start !important; text-align: left; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { width: 100%; min-height: 48px; padding: .5rem 0; font-size: 1.0625rem; border-bottom: 1px solid var(--linje); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container { border: 0 !important; padding: 0 0 0 1rem !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-weight: 400; }

/* Listraden: snabb växling mellan topplistorna. */
.bt-listbar { background: var(--yta); border-bottom: 1px solid var(--linje); }
.bt-listbar__in { max-width: 1200px; margin: 0 auto; padding: 0 clamp(1rem, 4vw, 2rem); display: flex; align-items: center; gap: .25rem 1rem; overflow-x: auto; scrollbar-width: thin; }
.bt-listbar__t { margin: 0; font-size: .9375rem; font-weight: 700; color: var(--t); white-space: nowrap; }
.bt-listbar__lista { list-style: none; margin: 0; padding: 0; display: flex; }
.bt-listbar__lista a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .75rem; font-size: .9375rem; color: var(--t); text-decoration: none; white-space: nowrap; }
.bt-listbar__lista a:hover { text-decoration: underline; }
.bt-listbar__lista a[aria-current] { font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .35em; }

/* ================================================================ Gemensamma delar */

.bt-sidhuvud { padding: 2rem 0 1.5rem; margin-bottom: 2rem; border-bottom: 1px solid var(--linje); }
.bt-sidhuvud h1, .bt-start-huvud h1, .bit-arkiv__titel { margin: 0; max-width: 26ch; font: 700 clamp(2rem, 1.5rem + 2vw, 2.75rem)/1.15 var(--rubrik); letter-spacing: -.015em; }
.bt-ingress { margin: 1rem 0 0; max-width: var(--textkolumn); font-size: clamp(1.125rem, 1.05rem + .35vw, 1.3125rem); line-height: 1.55; color: var(--t); }
.bt-ingress p { margin: 0; }
.bt-ingress p + p { margin-top: .75em; }
.bt-meta { margin: .75rem 0 0; font-size: .9375rem; line-height: 1.5; color: var(--t2); }
.bt-overrad { margin: 0 0 .75rem; font-size: .9375rem; font-weight: 600; color: var(--t2); }
.bt-overrad a { color: var(--t2); }
.bt-underlag { margin: 1rem 0 0; max-width: var(--textkolumn); font-size: 1rem; line-height: 1.55; color: var(--t2); }
.bt-not { margin: 0 0 1rem; max-width: var(--textkolumn); font-size: .9375rem; line-height: 1.55; color: var(--t2); }
.bt-lankrad { margin: 1rem 0 0; font-size: 1rem; }
.bt-byline { margin: 1rem 0 0; font-size: .9375rem; color: var(--t2); }

.bt-smulor { margin: 0 0 1rem; font-size: .875rem; }
.bt-smulor ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem; }
.bt-smulor li + li::before { content: "/"; margin-right: .25rem; color: var(--t2); }
.bt-smulor a { color: var(--t2); display: inline-flex; align-items: center; min-height: 24px; }
.bt-smulor a[aria-current] { text-decoration: none; }

.bt-rubrik { margin: 0 0 1rem; font: 700 clamp(1.5rem, 1.3rem + .8vw, 1.875rem)/1.2 var(--rubrik); }
.bt-rubrik.is-liten { font-size: 1.1875rem; margin-bottom: .75rem; }
.bt-del { margin-top: 4rem; }
.bt-sektion { margin: 3rem 0 0; }

/* Utmärkelse: lugn etikett. Bara Bäst i test får limegrönt. */
.bt-utm { display: inline-block; margin: 0 0 .5rem; padding: .125rem .5rem; font-size: .875rem; font-weight: 700; line-height: 1.5; color: var(--t); border: 1px solid var(--t); border-radius: 2px; }
.bt-utm--bast-i-test, .bt-utm--bast-i-test-och-for-pengarna { background: var(--lime); }
.bt-plats { display: inline-grid; place-items: center; min-width: 1.75rem; height: 1.75rem; padding: 0 .25rem; font-weight: 700; font-variant-numeric: tabular-nums; border-radius: 2px; }
.bt-plats.is-etta { background: var(--lime); }

/* Knappar */
.bt-knapp, a.bit-knapp { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: .5rem 1.125rem; background: var(--t); color: #FFFFFF; font: 700 1rem/1.25 var(--brod); text-decoration: none; border: 1.5px solid var(--t); border-radius: 4px; }
.bt-knapp:hover, a.bit-knapp:hover { background: #2C312E; color: #FFFFFF; text-decoration: none; }
.bt-knapp.is-sekundar { background: #FFFFFF; color: var(--t); }
.bt-knapp.is-sekundar:hover { background: var(--yta); color: var(--t); }
.bt-knapp__etikett { font-weight: 400; font-size: .875rem; }

/* Tabeller: rubrikrad, hårlinjer och högerställda tal. */
.bt-tabellram { max-width: 100%; overflow-x: auto; }
.bt-tabell { width: 100%; border-collapse: collapse; font-size: 1rem; line-height: 1.45; font-variant-numeric: tabular-nums; }
.bt-tabell thead th { padding: .5rem .75rem .5rem 0; text-align: left; font-size: .9375rem; font-weight: 700; color: var(--t); border-bottom: 2px solid var(--t); white-space: nowrap; }
.bt-tabell tbody th, .bt-tabell tbody td { padding: .75rem .75rem .75rem 0; text-align: left; vertical-align: top; border-bottom: 1px solid var(--linje); }
.bt-tabell tbody th { font-weight: 600; }
.bt-tabell th:last-child, .bt-tabell td:last-child { padding-right: 0; }
.bt-tabell .is-tal { text-align: right; white-space: nowrap; }
.bt-tabell a { color: var(--t); }
.bt-tabell a:hover { color: var(--lank); }
.bt-tabell.is-smal { font-size: .9375rem; }
.bt-tabell.is-fakta tbody th { width: 40%; font-weight: 600; }
.bt-tabell .is-tal + td, .bt-tabell .is-tal + th { padding-left: 1.25rem; }
.bt-smal-extra { display: none; margin-top: .125rem; font-size: .875rem; font-weight: 400; color: var(--t2); }
@media (max-width: 560px) {
	.bt-tabell .is-bred { display: none; }
	.bt-smal-extra { display: block; }
}
.bt-snabb td:nth-child(3) { color: var(--t2); }
.bt-runt tr.is-aktiv th, .bt-runt tr.is-aktiv td { background: var(--yta); font-weight: 700; }
.bt-runt__du { font-weight: 400; color: var(--t2); font-size: .875rem; }

/* Poäng och stapel */
.bt-stapel { display: block; height: 6px; background: #E2E6E3; border-radius: 3px; overflow: hidden; }
.bt-stapel > span { display: block; height: 100%; background: var(--t); border-radius: 3px; }
.bt-poang { font-variant-numeric: tabular-nums; }
.bt-poang__text { margin: 0; line-height: 1.1; }
.bt-poang__etikett { display: block; margin-bottom: .25rem; font-size: .9375rem; font-weight: 600; color: var(--t2); }
.bt-poang__tal { font: 700 1.5rem/1 var(--rubrik); }
.bt-poang__enhet { font-size: .9375rem; color: var(--t2); }
.bt-poang .bt-stapel { max-width: 12rem; margin-top: .5rem; }
.bt-poang--stor .bt-poang__tal { font-size: 2.75rem; }
.bt-poang--stor .bt-stapel { height: 8px; }
.bt-poang--rad { text-align: right; }
.bt-poang--rad .bt-poang__tal { font-size: 1.75rem; }
.bt-poang--rad .bt-stapel { width: 7rem; margin-left: auto; }
.bt-poang.is-saknas .bt-poang__text { font-size: .9375rem; color: var(--t2); }

/* Poäng per kriterium */
.bt-delpoang tbody th { font-weight: 600; }
.bt-delpoang__k { display: block; margin-top: .25rem; font-weight: 400; font-size: .9375rem; line-height: 1.5; color: var(--t2); }
.bt-delpoang td .bt-delpoang__p { font-weight: 700; }
.bt-delpoang td .bt-stapel { width: 5rem; margin: .4rem 0 0 auto; }
@media (max-width: 480px) { .bt-delpoang td .bt-stapel { display: none; } }

/* Det här är bra och mindre bra */
.bt-pm { display: grid; gap: 1rem 2rem; margin: 1rem 0; }
@media (min-width: 640px) { .bt-pm { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bt-pm__t { margin: 0 0 .5rem; font: 700 1.0625rem/1.3 var(--rubrik); }
.bt-pm ul { list-style: none; margin: 0; padding: 0; }
.bt-pm li { position: relative; padding: .2rem 0 .2rem 1.5rem; line-height: 1.5; }
.bt-pm .is-plus li::before, .bt-pm .is-minus li::before { position: absolute; left: 0; top: .2rem; width: 1rem; text-align: center; font-weight: 800; }
.bt-pm .is-plus li::before { content: "+"; content: "+" / ""; color: #2E6A1F; }
.bt-pm .is-minus li::before { content: "−"; content: "−" / ""; color: #A3271F; }
.bt-pm.is-kompakt { font-size: 1rem; margin: .5rem 0 .75rem; }
.bt-pm.is-kompakt .bt-pm__t { font-size: .9375rem; margin-bottom: .25rem; }

/* ================================================================ Startsidan */

.bt-start-huvud { padding: 2.5rem 0 2rem; }
.bt-tavla { display: grid; gap: 2.5rem 3rem; }
@media (min-width: 900px) { .bt-tavla { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bt-tavla__lista { border-top: 2px solid var(--t); padding-top: 1rem; }
.bt-tavla__t { margin: 0; font: 700 1.375rem/1.25 var(--rubrik); }
.bt-tavla__t a { color: var(--t); text-decoration: none; }
.bt-tavla__t a:hover { text-decoration: underline; }
.bt-tavla__meta { margin: .25rem 0 .5rem; font-size: .9375rem; color: var(--t2); }
.bt-tavla__rader { list-style: none; margin: 0; padding: 0; font-variant-numeric: tabular-nums; }
.bt-tavla__rader li { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) auto; column-gap: .75rem; align-items: start; padding: .625rem 0; border-bottom: 1px solid var(--linje); }
.bt-tavla__plats { display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; font-weight: 700; border-radius: 2px; }
.bt-tavla__rader li.is-etta .bt-tavla__plats { background: var(--lime); }
.bt-tavla__namn { display: flex; flex-direction: column; min-width: 0; padding-top: .1rem; }
.bt-tavla__namn a { color: var(--t); font-weight: 600; text-decoration: none; line-height: 1.4; }
.bt-tavla__namn a:hover { text-decoration: underline; }
.bt-tavla__utm { font-size: .875rem; color: var(--t2); }
.bt-tavla__p { font: 700 1.125rem/1.75rem var(--rubrik); text-align: right; }
.bt-tavla__marke { grid-column: 3; grid-row: 2; justify-self: end; margin-top: .25rem; line-height: 0; }
.bt-tavla__rader li.is-etta .bt-tavla__namn { grid-row: span 2; }
.bt-tavla__mer { margin: .75rem 0 0; font-size: 1rem; }

.bt-tre { display: grid; gap: 1.5rem 2.5rem; }
@media (min-width: 800px) { .bt-tre { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.bt-tre h3 { margin: 0 0 .5rem; font-size: 1.125rem; line-height: 1.3; }
.bt-tre p { margin: 0; font-size: 1rem; line-height: 1.6; }
.bt-tva { display: grid; gap: 2rem 3rem; }
@media (min-width: 800px) { .bt-tva { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bt-tva__t { margin: 0 0 .25rem; font-size: 1.25rem; padding-bottom: .5rem; border-bottom: 2px solid var(--t); }
.bt-textlista { list-style: none; margin: 0; padding: 0; }
.bt-textrad { padding: 1rem 0; border-bottom: 1px solid var(--linje); }
.bt-textrad__t { margin: 0; font-size: 1.125rem; line-height: 1.35; }
.bt-textrad__t a { color: var(--t); text-decoration: none; }
.bt-textrad__t a:hover { text-decoration: underline; }
.bt-textrad__e { margin: .25rem 0 0; font-size: 1rem; line-height: 1.55; color: var(--t2); }
.bt-textrad__d { margin: .25rem 0 0; font-size: .875rem; color: var(--t2); }

/* Kompakta produktkort (senaste och alla produkter) */
.bit-rutnat { gap: 2rem 1.5rem !important; }
.bt-kort { display: flex; flex-direction: column; height: 100%; padding-top: 1rem; border-top: 2px solid var(--t); }
.bt-kort__huvud { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.bt-kort__huvud-txt { flex: 1 1 auto; min-width: 0; }
.bt-kort__over { margin: 0 0 .25rem; font-size: .875rem; color: var(--t2); }
.bt-kort__namn { margin: 0 0 .5rem; font: 700 1.25rem/1.25 var(--rubrik); }
.bt-kort__namn a { color: var(--t); text-decoration: none; }
.bt-kort__namn a:hover { text-decoration: underline; }
.bt-kort .bt-poang { margin: .25rem 0 .75rem; }
.bt-kort__passar { margin: 0 0 .5rem; font-size: 1rem; line-height: 1.55; }
.bt-kort__typ { margin: 0 0 .5rem; font-size: .875rem; color: var(--t2); }
.bt-kort__mer { margin: auto 0 0; font-size: 1rem; }
.bt-kort__mer a { display: inline-flex; align-items: center; min-height: 44px; }

/* ================================================================ Rader (topplista och kategori) */

.bt-rader { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--t); }
.bt-rad { display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; gap: .5rem 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--linje); scroll-margin-top: 1rem; }
.bt-rad__nr { margin: 0; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; font: 700 1.5rem/1 var(--rubrik); font-variant-numeric: tabular-nums; border-radius: 2px; }
.bt-rad.is-etta .bt-rad__nr { background: var(--lime); }
.bt-rad__kropp { min-width: 0; }
.bt-rad__namn { margin: 0 0 .5rem; font: 700 1.25rem/1.3 var(--rubrik); }
.bt-rad__namn a { color: var(--t); text-decoration: none; }
.bt-rad__namn a:hover { text-decoration: underline; }
.bt-rad__passar { margin: 0 0 .5rem; max-width: var(--textkolumn); font-size: 1rem; line-height: 1.55; }
.bt-rad__atg { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; margin: .5rem 0 0; }
.bt-rad__mer { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.bt-rad__poang { display: flex; flex-direction: column; align-items: flex-end; gap: .75rem; min-width: 7rem; }
.bt-rad.is-kort { grid-template-columns: 2.5rem minmax(0, 1fr) auto; padding: .75rem 0; }
.bt-rad.is-kort .bt-rad__namn { font-size: 1.0625rem; margin: 0; }
@media (max-width: 640px) {
	.bt-rad { grid-template-columns: 2.5rem minmax(0, 1fr); column-gap: 1rem; }
	.bt-rad__nr { width: 2.25rem; height: 2.25rem; font-size: 1.25rem; }
	.bt-rad__poang { grid-column: 2; grid-row: 1; flex-direction: row; align-items: center; justify-content: space-between; min-width: 0; }
	.bt-poang--rad { text-align: left; }
	.bt-poang--rad .bt-stapel { margin-left: 0; }
	.bt-rad__kropp { grid-column: 2; }
}

/* ================================================================ Topplistan */

.bt-vartval { margin: 3rem 0 0; padding: clamp(1.25rem, 3vw, 2rem); background: var(--yta); border-radius: 4px; scroll-margin-top: 1rem; }
.bt-vartval__huvud { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.5rem; }
.bt-vartval__over { margin: 0 0 .5rem; font-size: .9375rem; font-weight: 700; color: var(--t2); }
.bt-vartval__t { margin: 0 0 .75rem; font: 700 clamp(1.5rem, 1.3rem + .8vw, 2rem)/1.2 var(--rubrik); }
.bt-vartval__t a { color: var(--t); text-decoration: none; }
.bt-vartval__t a:hover { text-decoration: underline; }
.bt-vartval .bt-poang { margin-top: .5rem; }
.bt-vartval__varfor { margin: 1.25rem 0 1.5rem; max-width: var(--textkolumn); font-size: 1.125rem; line-height: 1.55; }
.bt-vartval .bt-delpoang { max-width: var(--textkolumn); }
.bt-vartval .bt-tabell tbody th, .bt-vartval .bt-tabell tbody td { border-bottom-color: #D2D8D4; }
.bt-vartval .bt-stapel { background: #D9DEDB; }
.bt-lista-sida__bild { margin: 3rem 0 0; }
.bt-lista-sida__bild img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; }

.bt-listbyte { display: grid; gap: 1rem 2rem; margin: 4rem 0 0; border-top: 1px solid var(--linje); padding-top: 1.5rem; }
@media (min-width: 700px) { .bt-listbyte { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bt-listbyte .is-nasta { text-align: right; } }
.bt-listbyte a { display: block; color: var(--t); font-weight: 600; text-decoration: none; line-height: 1.4; }
.bt-listbyte a:hover { text-decoration: underline; }
.bt-listbyte__l { display: block; margin-bottom: .25rem; font-size: .875rem; font-weight: 400; color: var(--t2); }

/* Tilläggets jämförelsetabell och reklamupplysning */
.bit-tabellomrade { margin: 0; }
.bit-tabell { border: 1px solid var(--linje) !important; border-radius: 4px !important; }
.bit-tabell__tabell { font-size: .9375rem !important; font-variant-numeric: tabular-nums; }
.bit-tabell__caption { font: 700 1rem/1.3 var(--rubrik); }
.bit-tabell th, .bit-tabell td { border-top: 1px solid var(--linje) !important; }
.bit-tabell thead th { background: var(--yta) !important; }
.bit-tabell thead th a { color: var(--t); }
.bit-tabell__betyg { font-weight: 700; }
.bit-tabell__tips { font-size: .875rem; color: var(--t2); }
.bit-reklamupplysning { margin: 1rem 0 0 !important; padding: 0 0 .75rem !important; background: none !important; border: 0 !important; border-bottom: 1px solid var(--linje) !important; border-radius: 0 !important; font-size: .875rem !important; color: var(--t2) !important; }
.bit-reklamupplysning a { color: var(--lank) !important; }
.bit-metodruta { padding: 1.25rem 1.5rem; background: var(--yta); border-radius: 4px; }

/* ================================================================ Produktsidan */

.bt-produkt__grid { display: grid; gap: 2rem 3rem; }
@media (min-width: 1000px) {
	.bt-produkt__grid { grid-template-columns: minmax(0, 1fr) 22rem; align-items: start; }
	.bt-placering { grid-column: 2; grid-row: 1; position: sticky; top: 1rem; }
	.bt-produkt__text { grid-column: 1; grid-row: 1; }
}
.bt-produkt__text { max-width: var(--textkolumn); }
.bt-produkt__text > .bt-sektion:first-child { margin-top: 0; }
.bt-placering { padding: 1.5rem; border: 1px solid var(--linje); border-radius: 4px; background: #FFFFFF; }
.bt-placering__topp { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; }
.bt-placering__topp > a { flex: 0 0 auto; line-height: 0; }
.bt-placering__t { margin: 0; font: 700 1.5rem/1.2 var(--rubrik); }
.bt-placering__i { margin: .25rem 0 .75rem; font-size: .9375rem; line-height: 1.45; }
.bt-pfakta { margin: 1.25rem 0; }
.bt-pfakta > div { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: .75rem; padding: .5rem 0; border-top: 1px solid var(--linje); font-size: .9375rem; }
.bt-pfakta dt { font-weight: 600; color: var(--t2); }
.bt-pfakta dd { margin: 0; }
.bt-placering__knapp { margin: 1rem 0; }
.bt-placering__typ { margin: 0; font-size: .875rem; line-height: 1.5; color: var(--t2); }
.bt-passar { margin: 0; font-size: 1.125rem; line-height: 1.55; }
.bt-kallor { margin: 0; padding-left: 1.5rem; font-size: .9375rem; line-height: 1.55; }
.bt-kallor li { margin-bottom: .5rem; }
.bt-kallor a { word-break: break-word; }

/* ================================================================ Kategorisidan */

.bt-kat__grid { display: grid; gap: 3rem; }
@media (min-width: 1000px) { .bt-kat__grid { grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; } .bt-kat__sida { position: sticky; top: 1rem; } }
.bt-kat__sida > * + * { margin-top: 2rem; }
.bt-enkel { list-style: none; margin: 0; padding: 0; }
.bt-enkel li { padding: .5rem 0; border-bottom: 1px solid var(--linje); }

/* ================================================================ Arkiv (tillägget) */

.bit-arkiv__huvud { padding: 2rem 0 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--linje); }
.bit-arkiv__ingress { margin: 1rem 0 0 !important; max-width: var(--textkolumn) !important; font-size: clamp(1.125rem, 1.05rem + .35vw, 1.3125rem) !important; color: var(--t); }
.bit-kategorinav__lista { gap: .25rem 1.5rem !important; margin: 0 0 2rem !important; }
a.bit-kategorinav__lank { min-height: 44px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; color: var(--lank) !important; text-decoration: underline !important; }
a.bit-kategorinav__lank:hover { color: var(--t) !important; background: none !important; }
.bt-listkort { height: 100%; padding-top: 1rem; border-top: 2px solid var(--t); }
.bt-listkort__t { margin: 0; font: 700 1.25rem/1.3 var(--rubrik); }
.bt-listkort__t a { color: var(--t); text-decoration: none; }
.bt-listkort__t a:hover { text-decoration: underline; }
.bt-listkort__meta { margin: .25rem 0 .75rem; font-size: .9375rem; color: var(--t2); }
.bt-listkort__topp { list-style: none; margin: 0; padding: 0; font-variant-numeric: tabular-nums; }
.bt-listkort__topp li { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) auto; column-gap: .75rem; align-items: start; padding: .5rem 0; border-bottom: 1px solid var(--linje); font-size: 1rem; }
.bt-listkort__plats { display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; font-weight: 700; border-radius: 2px; }
.bt-listkort__topp li.is-etta .bt-listkort__plats { background: var(--lime); }
.bt-listkort__topp li.is-etta .bt-listkort__namn { grid-row: span 2; }
.bt-listkort__namn { padding-top: .15rem; }
.bt-listkort__p { font-weight: 700; line-height: 1.75rem; }
.bt-listkort__marke { grid-column: 3; grid-row: 2; justify-self: end; margin-top: .25rem; line-height: 0; }

/* ================================================================ Artiklar och sidor */

.bt-artikel .bt-sidhuvud { border-bottom: 0; margin-bottom: 0; }
.bt-huvudbild { margin: 0 0 2.5rem; }
.bt-huvudbild img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; }
.bt-las { padding-top: .5rem; }
.bt-las.has-toc { display: grid; gap: 2rem; }
@media (min-width: 1000px) { .bt-las.has-toc:has(.bt-toc) { grid-template-columns: 14rem minmax(0, var(--textkolumn)); gap: 4rem; } .bt-toc { position: sticky; top: 1rem; align-self: start; } }
.bt-toc { font-size: .9375rem; padding-bottom: 1rem; border-bottom: 1px solid var(--linje); }
@media (min-width: 1000px) { .bt-toc { border-bottom: 0; } }
.bt-toc__t { margin: 0 0 .5rem; font-weight: 700; }
.bt-toc ol { margin: 0; padding-left: 1.25rem; }
.bt-toc li { margin-bottom: .4rem; line-height: 1.4; }
.bt-toc a { color: var(--t2); }
.bt-toc a:hover { color: var(--t); }

.bt-body { max-width: var(--textkolumn); }
.bt-body > * { margin-top: 0; margin-bottom: 1.1em; }
.bt-body h2 { margin: 2.5rem 0 .75rem; font: 700 clamp(1.4rem, 1.25rem + .6vw, 1.75rem)/1.25 var(--rubrik); }
.bt-body h3 { margin: 2rem 0 .5rem; font: 700 1.25rem/1.3 var(--rubrik); }
.bt-body ul, .bt-body ol { padding-left: 1.4rem; }
.bt-body li { margin-bottom: .4em; }
.bt-body blockquote { margin-left: 0; padding-left: 1rem; border-left: 3px solid var(--linje); color: var(--t2); }
.bt-body table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.bt-body th, .bt-body td { padding: .5rem .75rem .5rem 0; text-align: left; border-bottom: 1px solid var(--linje); }
.bt-body figure { margin: 2rem 0; }
.bt-body figcaption { margin-top: .5rem; font-size: .9375rem; color: var(--t2); }
.bt-fakta, .bt-ruta { margin: 2rem 0; padding: 1.25rem 1.5rem; background: var(--yta); border-radius: 4px; font-size: 1rem; }
.bt-fakta-t, .bt-ruta__t { margin: 0 0 .5rem; font: 700 1.0625rem/1.3 var(--rubrik); }
.bt-fakta ul, .bt-fakta ol { margin: 0; padding-left: 1.25rem; }
.bt-fakta p:last-child, .bt-ruta p:last-child { margin-bottom: 0; }
.bt-skribent { max-width: var(--textkolumn); margin: 2rem 0 0; padding-top: 1rem; border-top: 1px solid var(--linje); font-size: .9375rem; line-height: 1.55; color: var(--t2); }
.bt-skribent strong { color: var(--t); }
.bt-efter > * { margin-top: 4rem; }
.bt-mer .bt-rubrik, .bt-lankade .bt-rubrik { padding-bottom: .5rem; border-bottom: 2px solid var(--t); }
.bt-lankade .bt-tabell { max-width: 900px; }

.bt-kortrutnat { display: grid; gap: 2.5rem 2rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
.bt-artikelkort__bild { display: block; margin-bottom: .75rem; }
.bt-artikelkort__bild img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 4px; }
.bt-artikelkort.is-utan-bild { padding-top: 1rem; border-top: 2px solid var(--t); }
.bt-artikelkort__kat { margin: 0 0 .25rem; font-size: .875rem; font-weight: 600; color: var(--t2); }
.bt-artikelkort__t { margin: 0 0 .5rem; font: 700 1.1875rem/1.3 var(--rubrik); }
.bt-artikelkort__t a { color: var(--t); text-decoration: none; }
.bt-artikelkort__t a:hover { text-decoration: underline; }
.bt-artikelkort__e { margin: 0 0 .5rem; font-size: 1rem; line-height: 1.55; color: var(--t2); }
.bt-artikelkort__d { margin: 0; font-size: .875rem; color: var(--t2); }
.bt-amnen { margin: 0 0 2rem; }
.bt-amnen ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; }
.bt-amnen a { display: inline-flex; align-items: center; min-height: 44px; }
.bt-amnen span { color: var(--t2); }

/* ================================================================ Sök och arkiv */

.bt-sok { max-width: 36rem; margin-top: 1.5rem; }
.bt-sok label { display: block; margin-bottom: .5rem; font-weight: 600; font-size: 1rem; }
.bt-sok__rad { display: flex; }
.bt-sok input { flex: 1 1 auto; min-width: 0; min-height: 48px; padding: .5rem .75rem; font: inherit; font-size: 1rem; color: var(--t); background: #FFFFFF; border: 1px solid #6B736E; border-right: 0; border-radius: 4px 0 0 4px; }
.bt-sok input::placeholder { color: #5E6661; }
.bt-sok button { min-height: 48px; padding: 0 1.25rem; font: 700 1rem/1 var(--brod); color: #FFFFFF; background: var(--t); border: 1px solid var(--t); border-radius: 0 4px 4px 0; cursor: pointer; }
.bt-sok button:hover { background: #2C312E; }
.bt-antal { margin: 1rem 0 0; font-size: .9375rem; color: var(--t2); }
.bt-traffar { list-style: none; margin: 0; padding: 0; max-width: 820px; border-top: 2px solid var(--t); }
.bt-traffar li { padding: 1.25rem 0; border-bottom: 1px solid var(--linje); }
.bt-traffar__typ { margin: 0 0 .25rem; font-size: .875rem; font-weight: 600; color: var(--t2); }
.bt-traffar__t { margin: 0 0 .25rem; font-size: 1.25rem; line-height: 1.3; }
.bt-traffar__t a { color: var(--t); text-decoration: none; }
.bt-traffar__t a:hover { text-decoration: underline; }
.bt-traffar__e { margin: 0; font-size: 1rem; line-height: 1.55; color: var(--t2); }
.bt-sidor ul { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 2rem 0 0; }
.bt-sidor a, .bt-sidor span { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 .75rem; border: 1px solid var(--linje); border-radius: 4px; color: var(--t); text-decoration: none; }
.bt-sidor .current { background: var(--t); color: #FFFFFF; border-color: var(--t); }

/* ================================================================ Märket för plats 1 */
/* Tilläggets stämpel, oförändrad och rak. */

.bt-marke { display: block; max-width: 100%; height: auto; }
.bt-marke--placering, .bt-marke--vartval { width: clamp(5rem, 20vw, 7.5rem); }
.bt-marke--rad { width: 4.5rem; }
.bt-marke--kort { width: 4rem; flex: 0 0 auto; }
.bt-marke--tavla, .bt-marke--listkort { width: 3.5rem; }
.bt-marke--sida { width: clamp(11rem, 45vw, 18rem); }
@media (max-width: 640px) { .bt-marke--rad { width: 3.75rem; } }

.bt-marke-sida__huvud { display: grid; gap: 2rem 3rem; align-items: center; }
@media (min-width: 800px) { .bt-marke-sida__huvud { grid-template-columns: minmax(0, 1fr) auto; } }
.bt-marke-sida__bild { justify-self: start; }
.bt-marke-fakta { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); margin: 1.5rem 0 0; max-width: var(--textkolumn); border-top: 1px solid var(--linje); }
.bt-marke-fakta > div { padding: .75rem 1rem .75rem 0; border-bottom: 1px solid var(--linje); }
.bt-marke-fakta dt { font-size: .875rem; font-weight: 600; color: var(--t2); }
.bt-marke-fakta dd { margin: .125rem 0 0; font-weight: 700; }
.bt-marke-filer, .bt-marke-ettor { list-style: none; padding: 0 !important; border-top: 2px solid var(--t); font-variant-numeric: tabular-nums; }
.bt-marke-filer li, .bt-marke-ettor li { display: grid; grid-template-columns: 2rem minmax(0, 1fr) auto; gap: .75rem; padding: .5rem 0; margin: 0 !important; border-bottom: 1px solid var(--linje); }
.bt-marke-filer li { align-items: center; }
.bt-marke-ettor li { align-items: baseline; padding: .75rem 0; }
.bt-marke-filer__nr, .bt-marke-ettor__nr { font-weight: 700; color: var(--t2); }
.bt-marke-filer__a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.bt-marke-filer__kb { font-size: .875rem; color: var(--t2); white-space: nowrap; }
.bt-marke-ettor__txt { min-width: 0; }
.bt-marke-ettor__namn { font: 700 1.125rem/1.35 var(--rubrik); color: var(--t); text-decoration: none; }
.bt-marke-ettor__namn:hover { text-decoration: underline; }
.bt-marke-ettor__i { margin: .25rem 0 0 !important; font-size: .9375rem; line-height: 1.5; color: var(--t2); }
.bt-marke-ettor__p { font-weight: 700; }

/* ================================================================ Sidfot */

.bt-footer { margin-top: 0; background: var(--yta); border-top: 1px solid var(--linje); padding: 3rem 0 2rem; font-size: 1rem; }
.bt-footer-grid { display: grid; gap: 2rem 3rem; }
@media (min-width: 900px) { .bt-footer-grid { grid-template-columns: 1.6fr 1fr 1fr 1fr; } }
.bt-footer-t { margin: 0 0 .75rem; font: 700 1.0625rem/1.3 var(--rubrik); }
.bt-footer-om p { margin: 0 0 .75rem; max-width: 30rem; line-height: 1.6; color: var(--t2); }
.bt-footer ul { list-style: none; margin: 0; padding: 0; }
.bt-footer li a { display: inline-flex; align-items: center; min-height: 32px; color: var(--t); text-decoration: none; }
.bt-footer li a:hover { text-decoration: underline; }
.bt-footer-copy { margin: 2.5rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--linje); font-size: .875rem; color: var(--t2); }

/* ================================================================ Små skärmar */

@media (max-width: 600px) {
	.bt-ordbild { font-size: 1.3125rem; }
	.bt-vartval__huvud { flex-direction: row; }
	.bt-placering { padding: 1.25rem; }
	.bt-del { margin-top: 3rem; }
}

/* Brödtextens vikt: föräldratemat sätter 300, som är för tunt för läsning. */
body, p, li, dd, dt, td, figcaption, blockquote, .wp-block-post-excerpt__excerpt { font-weight: 400; }