/*
 * Toarps MK – huvudstil
 *
 * Struktur (cascade layers, lägst till högst prioritet):
 *   tokens      Alla designvariabler. Ändra här eller via Toarps MK Suite > Utseende.
 *   base        Grundelement (body, rubriker, länkar, formulär).
 *   layout      Container, sektioner, rutnät.
 *   components  Sidhuvud, meny, knappar, kort, sponsorband, Min sida m.m.
 *   utilities   Hjälpklasser.
 *
 * Varje komponent har egna variabler (t.ex. --btn-bg) som utgår från tokens,
 * så en enskild komponent kan justeras utan att röra resten.
 * Brytpunkt för desktopmeny: 1100px.
 */

@layer tokens, base, layout, components, utilities;

/* ===================================================================== */
@layer tokens {
	:root {
		/* Färger */
		--tmk-color-paper: #F7F2E7;
		--tmk-color-sand: #EBE1CB;
		--tmk-color-ink: #1A1916;
		--tmk-color-red: #C32A26;
		--tmk-color-yellow: #FAE343;
		--tmk-color-white: #FFFFFF;
		--tmk-color-muted: color-mix(in srgb, var(--tmk-color-ink) 78%, var(--tmk-color-paper));
		--tmk-color-line: color-mix(in srgb, var(--tmk-color-ink) 22%, var(--tmk-color-sand));
		--tmk-color-on-red: #FFFFFF;
		--tmk-color-on-ink: var(--tmk-color-paper);

		/* Typsnitt */
		--tmk-font-body: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
		--tmk-font-display: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
		--tmk-font-scale: 1;

		/* Textstorlekar (skalas av --tmk-font-scale) */
		--tmk-text-sm: calc(1rem * var(--tmk-font-scale));
		--tmk-text-base: calc(1.125rem * var(--tmk-font-scale));
		--tmk-text-lg: calc(1.25rem * var(--tmk-font-scale));
		--tmk-text-xl: calc(1.5rem * var(--tmk-font-scale));
		--tmk-text-h3: calc(clamp(1.5rem, 1.3rem + 0.8vw, 1.875rem) * var(--tmk-font-scale));
		--tmk-text-h2: calc(clamp(1.875rem, 1.5rem + 1.4vw, 2.5rem) * var(--tmk-font-scale));
		--tmk-text-h1: calc(clamp(2.5rem, 1.6rem + 3.6vw, 4.5rem) * var(--tmk-font-scale));
		--tmk-line-height: 1.55;

		/* Mått */
		--tmk-container: 1320px;
		--tmk-prose: 760px;
		--tmk-gutter: clamp(16px, 4vw, 32px);
		--tmk-space-xs: 8px;
		--tmk-space-sm: 12px;
		--tmk-space-md: 20px;
		--tmk-space-lg: 32px;
		--tmk-space-xl: clamp(40px, 6vw, 72px);
		--tmk-radius: 12px;
		--tmk-radius-sm: calc(var(--tmk-radius) * 0.6);
		--tmk-border: 2px;
		--tmk-shadow-offset: 5px;
		--tmk-shadow: var(--tmk-shadow-offset) var(--tmk-shadow-offset) 0 var(--tmk-color-ink);
		--tmk-tap: 48px;
		--tmk-focus: 3px solid var(--tmk-color-red);

		/* Ränder */
		--tmk-hazard: repeating-linear-gradient(135deg, var(--tmk-color-yellow) 0 12px, var(--tmk-color-ink) 12px 24px);
		--tmk-hazard-height: 8px;

		/* Rörelse */
		--tmk-speed: 160ms;
		--tmk-marquee-duration: 45s;
	}
}

/* ===================================================================== */
@layer base {
	*, *::before, *::after { box-sizing: border-box; }

	html { -webkit-text-size-adjust: 100%; scroll-padding-top: 16px; }

	body {
		margin: 0;
		background: var(--tmk-color-paper);
		color: var(--tmk-color-ink);
		font-family: var(--tmk-font-body);
		font-size: var(--tmk-text-base);
		line-height: var(--tmk-line-height);
		-webkit-font-smoothing: antialiased;
	}

	body.tmk-menu-is-open { overflow: hidden; }

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

	h1, h2, h3, h4 { line-height: 1.1; margin: 0 0 0.5em; }
	h1 { font-size: var(--tmk-text-h1); }
	h2 { font-size: var(--tmk-text-h2); }
	h3 { font-size: var(--tmk-text-h3); }

	p { margin: 0 0 1em; }

	a { color: inherit; text-decoration-thickness: 2px; text-underline-offset: 3px; }
	a:hover { color: var(--tmk-color-red); }

	:focus-visible { outline: var(--tmk-focus); outline-offset: 3px; }

	mark { background: none; color: inherit; }

	input, select, textarea, button { font: inherit; }

	table { border-collapse: collapse; width: 100%; }

	@media (prefers-reduced-motion: reduce) {
		*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
	}
}

/* ===================================================================== */
@layer layout {
	.tmk-container {
		width: 100%;
		max-width: var(--tmk-container);
		margin-inline: auto;
		padding-inline: var(--tmk-gutter);
	}

	.tmk-main { display: block; outline: none; }

	.tmk-section { padding-block: var(--tmk-space-xl); }

	.tmk-prose { max-width: var(--tmk-prose); }
	.tmk-prose > * + * { margin-top: 1em; }
	.tmk-prose h2 { font-family: var(--tmk-font-display); text-transform: uppercase; margin-top: 1.4em; }
	.tmk-prose a { color: var(--tmk-color-red); font-weight: 600; }
	.tmk-prose ul, .tmk-prose ol { padding-left: 1.3em; }

	.tmk-post-grid {
		display: grid;
		gap: var(--tmk-space-md);
		grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	}
}

/* ===================================================================== */
@layer components {

	/* ---------- Tillgänglighet ---------- */
	.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;
	}
	.tmk-skip-link:focus {
		position: fixed !important; top: 12px; left: 12px; z-index: 1000;
		width: auto; height: auto; clip: auto; padding: 12px 18px; margin: 0;
		background: var(--tmk-color-yellow); color: var(--tmk-color-ink);
		border: var(--tmk-border) solid var(--tmk-color-ink); font-weight: 700;
	}

	/* ---------- Ikoner ---------- */
	.tmk-icon { flex: 0 0 auto; display: inline-block; vertical-align: middle; }

	/* ---------- Ränder ---------- */
	.tmk-hazard { display: block; height: var(--tmk-hazard-height); background: var(--tmk-hazard); }

	/* ---------- SS-märke ---------- */
	.tmk-ss {
		--ss-bg: var(--tmk-color-red);
		--ss-fg: var(--tmk-color-on-red);
		display: inline-flex; align-items: center; justify-content: center;
		height: 1.4em; padding: 0 0.4em; border-radius: 5px;
		background: var(--ss-bg); color: var(--ss-fg);
		font-family: var(--tmk-font-display); font-weight: 700; font-size: 0.75em; letter-spacing: 0.04em; line-height: 1;
		transform: skewX(-8deg); flex: 0 0 auto;
	}
	.tmk-ss--dark { --ss-bg: var(--tmk-color-ink); --ss-fg: var(--tmk-color-yellow); }

	.tmk-kicker {
		display: inline-flex; align-items: center; height: 28px; padding: 0 8px; border-radius: 6px;
		background: var(--tmk-color-ink); color: var(--tmk-color-yellow);
		font-family: var(--tmk-font-display); font-weight: 700; font-size: 1rem; transform: skewX(-8deg);
		margin-bottom: var(--tmk-space-sm);
	}

	.tmk-tag {
		display: inline-block; padding: 2px 8px; border-radius: 4px;
		background: var(--tmk-color-red); color: var(--tmk-color-on-red);
		font-family: var(--tmk-font-display); font-weight: 700; font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.06em;
	}

	/* ---------- Knappar ---------- */
	.tmk-btn {
		--btn-bg: transparent;
		--btn-fg: var(--tmk-color-ink);
		--btn-border: var(--tmk-color-ink);
		--btn-height: var(--tmk-tap);
		display: inline-flex; align-items: center; justify-content: center; gap: 10px;
		min-height: var(--btn-height); padding: 0 20px;
		border: var(--tmk-border) solid var(--btn-border); border-radius: calc(var(--tmk-radius) * 0.85);
		background: var(--btn-bg); color: var(--btn-fg);
		font-family: var(--tmk-font-body); font-weight: 700; font-size: var(--tmk-text-base); line-height: 1.1;
		text-decoration: none; cursor: pointer; text-align: center;
		transition: transform var(--tmk-speed), box-shadow var(--tmk-speed);
	}
	.tmk-btn:hover { color: var(--btn-fg); transform: translate(-2px, -2px); box-shadow: 3px 3px 0 var(--tmk-color-ink); }
	.tmk-btn:active { transform: none; box-shadow: none; }
	.tmk-btn--yellow { --btn-bg: var(--tmk-color-yellow); }
	.tmk-btn--red { --btn-bg: var(--tmk-color-red); --btn-fg: var(--tmk-color-on-red); }
	.tmk-btn--ink { --btn-bg: var(--tmk-color-ink); --btn-fg: var(--tmk-color-on-ink); }
	.tmk-btn--outline { --btn-bg: transparent; }
	.tmk-btn--ghost-light { --btn-bg: transparent; --btn-fg: var(--tmk-color-on-ink); --btn-border: var(--tmk-color-on-ink); }
	.tmk-btn--lg { --btn-height: 56px; padding: 0 24px; font-size: var(--tmk-text-lg); }
	.tmk-btn--block { width: 100%; }

	.tmk-cta { display: flex; flex-wrap: wrap; gap: var(--tmk-space-sm); }

	.tmk-iconbtn {
		display: inline-flex; align-items: center; justify-content: center;
		width: 52px; height: 52px; border: var(--tmk-border) solid var(--tmk-color-ink); border-radius: var(--tmk-radius);
		color: var(--tmk-color-ink);
	}

	/* ---------- Kort ---------- */
	.tmk-card {
		--card-bg: var(--tmk-color-white);
		--card-border: var(--tmk-color-ink);
		display: block; background: var(--card-bg); color: var(--tmk-color-ink);
		border: var(--tmk-border) solid var(--card-border); border-radius: calc(var(--tmk-radius) * 1.2);
		padding: var(--tmk-space-md); text-decoration: none;
	}
	.tmk-card--shadow { box-shadow: var(--tmk-shadow); }
	a.tmk-card { transition: transform var(--tmk-speed), box-shadow var(--tmk-speed); }
	a.tmk-card:hover { color: var(--tmk-color-ink); transform: translate(-2px, -2px); box-shadow: calc(var(--tmk-shadow-offset) + 2px) calc(var(--tmk-shadow-offset) + 2px) 0 var(--tmk-color-ink); }

	.tmk-section-title {
		font-family: var(--tmk-font-display); font-weight: 800; text-transform: uppercase;
		font-size: var(--tmk-text-h3); margin: 0 0 var(--tmk-space-md);
	}
	* + .tmk-section-title { margin-top: var(--tmk-space-lg); }

	.tmk-empty { color: var(--tmk-color-muted); }

	/* ---------- Svart remsa ---------- */
	.tmk-strip { background: var(--tmk-color-ink); color: var(--tmk-color-on-ink); font-size: var(--tmk-text-sm); }
	.tmk-strip a { color: var(--tmk-color-on-ink); }
	.tmk-strip a:hover { color: var(--tmk-color-yellow); }
	.tmk-strip__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 24px; min-height: 44px; padding-block: 6px; }
	.tmk-strip__next { margin: 0; display: flex; flex-wrap: wrap; gap: 0 10px; }
	.tmk-strip__label { font-weight: 700; color: var(--tmk-color-yellow); }
	.tmk-strip__event { text-decoration: underline; }
	.tmk-strip__nav { display: flex; align-items: center; gap: 24px; }
	.tmk-strip__menu { display: none; list-style: none; margin: 0; padding: 0; gap: 24px; }
	.tmk-strip__menu a { text-decoration: none; }
	.tmk-strip__member { display: none; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; }

	/* ---------- Sidhuvud ---------- */
	.tmk-header { background: var(--tmk-color-paper); position: relative; z-index: 50; }
	.tmk-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; padding-block: 12px; }
	.tmk-header__mobile { display: flex; align-items: center; gap: 8px; }
	.tmk-header .tmk-cta--header { display: none; }

	.tmk-logo { display: inline-flex; align-items: center; text-decoration: none; flex: 0 0 auto; }
	.tmk-logo__img { display: block; width: auto; height: auto; max-height: 56px; mix-blend-mode: multiply; }
	.tmk-logo--header .tmk-logo__img { max-height: clamp(52px, 6vw, 72px); }
	.tmk-logo__text { font-family: var(--tmk-font-display); font-weight: 800; font-size: 1.6rem; text-transform: uppercase; }

	/* ---------- Huvudmeny (desktop) ---------- */
	.tmk-nav--desktop { display: none; }
	.tmk-menu { list-style: none; margin: 0; padding: 0; }
	.tmk-menu__row { display: flex; align-items: center; }
	.tmk-menu__link { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
	.tmk-menu__text { display: flex; flex-direction: column; }
	.tmk-menu__toggle {
		display: inline-flex; align-items: center; justify-content: center;
		width: 40px; height: 40px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: inherit; cursor: pointer;
	}
	.tmk-menu__toggle .tmk-icon { transition: transform var(--tmk-speed); }
	.tmk-menu__toggle[aria-expanded="true"] .tmk-icon { transform: rotate(180deg); }

	.tmk-menu--desktop { display: flex; flex-wrap: wrap; gap: 2px; }
	.tmk-menu--desktop > .tmk-menu__item { position: relative; }
	.tmk-menu--desktop > .tmk-menu__item > .tmk-menu__row > .tmk-menu__link {
		min-height: var(--tmk-tap); padding: 0 6px 0 10px; font-weight: 600; font-size: calc(1.1875rem * var(--tmk-font-scale));
	}
	.tmk-menu--desktop > .tmk-menu__item:not(.tmk-menu__item--parent) > .tmk-menu__row > .tmk-menu__link { padding-right: 10px; }
	.tmk-menu--desktop > .tmk-menu__item.is-current > .tmk-menu__row { box-shadow: inset 0 -3px 0 var(--tmk-color-red); color: var(--tmk-color-red); }

	.tmk-menu--desktop .tmk-submenu {
		position: absolute; top: calc(100% + 8px); left: 0; z-index: 60;
		min-width: 280px; margin: 0; padding: 8px; list-style: none;
		background: var(--tmk-color-white); border: var(--tmk-border) solid var(--tmk-color-ink);
		border-radius: var(--tmk-radius); box-shadow: var(--tmk-shadow);
		visibility: hidden; opacity: 0; transform: translateY(-4px);
		transition: opacity var(--tmk-speed), transform var(--tmk-speed), visibility 0s linear var(--tmk-speed);
	}
	.tmk-menu--desktop .tmk-submenu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
	.tmk-menu--desktop .tmk-menu__item--parent.is-open > .tmk-submenu,
	.tmk-menu--desktop .tmk-menu__item--parent:focus-within > .tmk-submenu {
		visibility: visible; opacity: 1; transform: none; transition-delay: 0s;
	}
	@media (hover: hover) {
		.tmk-menu--desktop .tmk-menu__item--parent:hover > .tmk-submenu { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
	}
	.tmk-submenu .tmk-menu__link { display: block; padding: 12px 14px; border-radius: 8px; font-size: var(--tmk-text-base); font-weight: 500; }
	.tmk-submenu .tmk-menu__link:hover { background: var(--tmk-color-paper); }
	.tmk-submenu .is-current > .tmk-menu__row > .tmk-menu__link { color: var(--tmk-color-red); font-weight: 700; }

	/* ---------- Mobilmeny ---------- */
	.tmk-menu-open { --btn-height: 52px; padding: 0 16px; }
	.tmk-mobile-menu {
		position: fixed; inset: 0; z-index: 1000;
		display: flex; flex-direction: column;
		background: var(--tmk-color-paper); overflow-y: auto; overscroll-behavior: contain;
	}
	.tmk-mobile-menu[hidden] { display: none; }
	.tmk-mobile-menu__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px var(--tmk-gutter); }
	.tmk-mobile-menu__head .tmk-btn { --btn-height: 52px; }
	.tmk-nav--mobile { flex: 1 1 auto; padding: 4px var(--tmk-gutter) var(--tmk-space-md); }
	.tmk-menu--mobile > .tmk-menu__item { border-bottom: 1.5px solid var(--tmk-color-line); }
	.tmk-menu--mobile > .tmk-menu__item:last-child { border-bottom: 0; }
	.tmk-menu--mobile > .tmk-menu__item > .tmk-menu__row { min-height: 72px; gap: 8px; }
	.tmk-menu--mobile > .tmk-menu__item > .tmk-menu__row > .tmk-menu__link { flex: 1 1 auto; gap: 14px; padding-block: 10px; }
	.tmk-menu--mobile .tmk-menu__label { font-size: calc(1.4375rem * var(--tmk-font-scale)); font-weight: 700; line-height: 1.2; }
	.tmk-menu--mobile .tmk-menu__desc { font-size: var(--tmk-text-sm); color: var(--tmk-color-muted); }
	.tmk-menu--mobile .tmk-ss { font-size: 0.95rem; }
	.tmk-menu--mobile .tmk-menu__toggle { width: var(--tmk-tap); height: var(--tmk-tap); border: var(--tmk-border) solid var(--tmk-color-ink); }
	.tmk-menu--mobile .tmk-submenu { list-style: none; margin: 0; padding: 0 0 14px 44px; }
	.tmk-menu--mobile .tmk-submenu[hidden] { display: none; }
	.tmk-menu--mobile .tmk-submenu .tmk-menu__link { display: flex; min-height: 44px; align-items: center; font-size: var(--tmk-text-base); font-weight: 600; }
	.tmk-menu--mobile .is-current > .tmk-menu__row > .tmk-menu__link .tmk-menu__label { color: var(--tmk-color-red); }
	.tmk-mobile-menu__foot {
		display: grid; gap: 10px; padding: var(--tmk-space-md) var(--tmk-gutter) calc(var(--tmk-space-lg) + env(safe-area-inset-bottom, 0px));
		background: var(--tmk-color-sand); border-top: var(--tmk-border) solid var(--tmk-color-ink);
	}
	.tmk-mobile-menu__foot .tmk-btn { --btn-height: 56px; }
	.tmk-cta--mobile { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

	/* ---------- Hjälteyta ---------- */
	.tmk-hero { padding-block: var(--tmk-space-xl); }
	.tmk-hero__inner { display: grid; gap: var(--tmk-space-lg); align-items: center; }
	.tmk-hero__title {
		font-family: var(--tmk-font-display); font-weight: 800; font-style: italic; text-transform: uppercase;
		font-size: var(--tmk-text-h1); line-height: 0.95; margin: 0 0 var(--tmk-space-md);
	}
	.tmk-highlight { background: var(--tmk-color-yellow); color: var(--tmk-color-ink); padding: 0 0.12em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
	.tmk-hero__lead { font-size: var(--tmk-text-lg); color: var(--tmk-color-muted); max-width: 34ch; }
	.tmk-hero__buttons { display: flex; flex-wrap: wrap; gap: var(--tmk-space-sm); margin-top: var(--tmk-space-md); }
	.tmk-hero__side { display: grid; gap: var(--tmk-space-md); }
	.tmk-hero__media { border-radius: calc(var(--tmk-radius) * 1.4); overflow: hidden; border: var(--tmk-border) solid var(--tmk-color-ink); aspect-ratio: 3 / 2; background: var(--tmk-color-sand); }
	.tmk-hero__img { display: block; width: 100%; height: 100%; object-fit: cover; }
	.tmk-hero__placeholder { display: block; width: 100%; height: 100%; opacity: 0.18; }

	/* ---------- Nästa tävling ---------- */
	.tmk-next-event { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
	.tmk-next-event__body { display: flex; flex-direction: column; gap: 4px; }
	.tmk-next-event__kicker { font-size: var(--tmk-text-sm); font-weight: 700; color: var(--tmk-color-red); }
	.tmk-next-event__title { font-family: var(--tmk-font-display); font-weight: 800; font-size: calc(1.875rem * var(--tmk-font-scale)); line-height: 1.05; text-transform: uppercase; }
	.tmk-next-event__meta { color: var(--tmk-color-muted); }

	/* ---------- Tävlingslista ---------- */
	.tmk-event-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--tmk-space-md); grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
	.tmk-event-list__link { display: flex; flex-direction: column; gap: 6px; height: 100%; }
	.tmk-event-list__link .tmk-tag { align-self: flex-start; }
	.tmk-event-list__title { font-family: var(--tmk-font-display); font-weight: 800; font-size: var(--tmk-text-xl); text-transform: uppercase; line-height: 1.1; }
	.tmk-event-list__meta { color: var(--tmk-color-muted); }

	/* ---------- Tävlingssida ---------- */
	.tmk-event { display: grid; gap: var(--tmk-space-lg); }
	.tmk-event__side { display: grid; gap: var(--tmk-space-md); align-content: start; }
	.tmk-facts { margin: 0; }
	.tmk-facts__row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1.5px solid var(--tmk-color-line); }
	.tmk-facts__row:last-child { border-bottom: 0; }
	.tmk-facts dt { font-weight: 700; }
	.tmk-facts dd { margin: 0; text-align: right; }
	.tmk-event__links { display: grid; gap: 10px; }
	.tmk-callout { background: var(--tmk-color-yellow); border: var(--tmk-border) solid var(--tmk-color-ink); border-radius: var(--tmk-radius); padding: var(--tmk-space-md); }
	.tmk-callout__title { font-family: var(--tmk-font-display); text-transform: uppercase; font-size: var(--tmk-text-xl); margin-bottom: 6px; }
	.tmk-callout p { margin: 0; }
	.tmk-featured { margin: 0 0 var(--tmk-space-md); border-radius: var(--tmk-radius); overflow: hidden; border: var(--tmk-border) solid var(--tmk-color-ink); }
	.tmk-featured img { display: block; width: 100%; }

	/* ---------- Sidhuvud för sidor ---------- */
	.tmk-page-header { padding-block: var(--tmk-space-xl) 0; }
	.tmk-page-header__title { font-family: var(--tmk-font-display); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: var(--tmk-text-h1); line-height: 0.95; margin: 0; }
	.tmk-page-header__lead { font-size: var(--tmk-text-lg); color: var(--tmk-color-muted); max-width: 52ch; margin: var(--tmk-space-sm) 0 0; }

	/* ---------- Nyheter ---------- */
	.tmk-post-card { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
	.tmk-post-card__media img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-bottom: var(--tmk-border) solid var(--tmk-color-ink); }
	.tmk-post-card__body { padding: var(--tmk-space-md); }
	.tmk-post-card__date { font-size: var(--tmk-text-sm); color: var(--tmk-color-red); font-weight: 700; }
	.tmk-post-card__title { font-size: var(--tmk-text-xl); margin: 4px 0 8px; }
	.tmk-post-card__title a { text-decoration: none; }
	.tmk-post-card__excerpt p { margin: 0; color: var(--tmk-color-muted); }
	.tmk-pagination, .tmk-postnav { margin-top: var(--tmk-space-lg); }
	.tmk-pagination .nav-links, .tmk-postnav .nav-links { display: flex; flex-wrap: wrap; gap: 10px; }
	.tmk-pagination .page-numbers { display: inline-flex; min-width: var(--tmk-tap); min-height: var(--tmk-tap); align-items: center; justify-content: center; padding: 0 12px; border: var(--tmk-border) solid var(--tmk-color-ink); border-radius: var(--tmk-radius-sm); text-decoration: none; font-weight: 700; }
	.tmk-pagination .page-numbers.current { background: var(--tmk-color-yellow); }
	.tmk-postnav__label { display: block; font-size: var(--tmk-text-sm); color: var(--tmk-color-muted); }

	/* ---------- Sök och formulär ---------- */
	.tmk-search { display: grid; gap: 6px; max-width: 520px; margin-bottom: var(--tmk-space-md); }
	.tmk-search__label { font-weight: 700; }
	.tmk-search__row { display: flex; gap: 8px; }
	.tmk-input,
	.tmk-login input[type="text"],
	.tmk-login input[type="password"] {
		width: 100%; min-height: var(--tmk-tap); padding: 0 14px;
		border: var(--tmk-border) solid var(--tmk-color-ink); border-radius: var(--tmk-radius-sm);
		background: var(--tmk-color-white); color: var(--tmk-color-ink); font-size: var(--tmk-text-base);
	}

	/* ---------- Sponsorband ---------- */
	.tmk-sponsor-band { background: var(--tmk-color-sand); border-block: var(--tmk-border) solid var(--tmk-color-ink); padding-block: var(--tmk-space-lg); }
	.tmk-sponsor-band__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; margin-bottom: var(--tmk-space-md); }
	.tmk-sponsor-band__title { display: flex; align-items: center; gap: 12px; margin: 0; font-family: var(--tmk-font-display); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: var(--tmk-text-h3); }
	.tmk-sponsor-band__title .tmk-ss { font-style: normal; font-size: 0.55em; }
	.tmk-sponsor-band__all { font-weight: 700; }
	.tmk-marquee { overflow: hidden; }
	.tmk-marquee__track { display: flex; width: max-content; animation: tmk-roll var(--tmk-marquee-duration) linear infinite; }
	.tmk-marquee:hover .tmk-marquee__track,
	.tmk-marquee:focus-within .tmk-marquee__track { animation-play-state: paused; }
	.tmk-marquee__group { display: flex; gap: var(--tmk-space-md); margin: 0; padding: 0 0 0 var(--tmk-space-md); list-style: none; }
	.tmk-logo-tile {
		display: flex; align-items: center; justify-content: center;
		width: clamp(140px, 18vw, 200px); height: clamp(68px, 8vw, 96px); padding: 12px 16px;
		background: var(--tmk-color-white); border: var(--tmk-border) solid var(--tmk-color-ink); border-radius: var(--tmk-radius);
		text-decoration: none;
	}
	a.tmk-logo-tile:hover { border-color: var(--tmk-color-red); }
	.tmk-logo-tile__img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
	.tmk-logo-tile__name { font-family: var(--tmk-font-display); font-weight: 800; font-size: var(--tmk-text-lg); color: var(--tmk-color-muted); text-align: center; }
	@keyframes tmk-roll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
	@media (prefers-reduced-motion: reduce) {
		.tmk-marquee { overflow-x: auto; }
		.tmk-marquee__track { animation: none; }
		.tmk-marquee__group[aria-hidden="true"] { display: none; }
	}

	/* ---------- Sponsorsida ---------- */
	.tmk-sponsors__group + .tmk-sponsors__group { margin-top: var(--tmk-space-xl); }
	.tmk-sponsors__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--tmk-space-md); grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
	.tmk-sponsors__group--huvud .tmk-sponsors__grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
	.tmk-sponsor-card { padding: 0; overflow: hidden; display: flex; flex-direction: column; height: 100%; }
	.tmk-sponsor-card__logo { display: flex; align-items: center; justify-content: center; height: 130px; padding: 18px; border-bottom: var(--tmk-border) solid var(--tmk-color-ink); }
	.tmk-sponsors__group--huvud .tmk-sponsor-card__logo { height: 170px; }
	.tmk-sponsor-card__img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
	.tmk-sponsor-card__name-logo { font-family: var(--tmk-font-display); font-weight: 800; font-size: var(--tmk-text-xl); color: var(--tmk-color-muted); }
	.tmk-sponsor-card__body { display: flex; flex-direction: column; gap: 4px; padding: var(--tmk-space-md); }
	.tmk-sponsor-card__name { font-size: var(--tmk-text-xl); font-weight: 700; }
	.tmk-sponsor-card__tagline { color: var(--tmk-color-muted); }
	.tmk-sponsor-card__link { margin-top: 6px; font-weight: 700; color: var(--tmk-color-red); }

	.tmk-packages { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--tmk-space-md); grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
	.tmk-package { display: flex; flex-direction: column; gap: 8px; padding: 22px; border-radius: var(--tmk-radius); background: var(--tmk-color-ink); color: var(--tmk-color-on-ink); border: var(--tmk-border) solid color-mix(in srgb, var(--tmk-color-on-ink) 30%, var(--tmk-color-ink)); }
	.tmk-package--highlight { border-color: var(--tmk-color-yellow); }
	.tmk-package__name { font-size: var(--tmk-text-xl); font-weight: 700; }
	.tmk-package__text { opacity: 0.9; }
	.tmk-package__price { margin-top: auto; font-weight: 700; color: var(--tmk-color-yellow); }

	/* ---------- Historiktabell ---------- */
	.tmk-table-wrap { overflow-x: auto; border: var(--tmk-border) solid var(--tmk-color-ink); border-radius: var(--tmk-radius); background: var(--tmk-color-white); }
	.tmk-table th, .tmk-table td { padding: 12px 14px; text-align: left; border-bottom: 1.5px solid var(--tmk-color-line); white-space: nowrap; }
	.tmk-table thead th { background: var(--tmk-color-ink); color: var(--tmk-color-on-ink); font-family: var(--tmk-font-display); text-transform: uppercase; letter-spacing: 0.04em; }
	.tmk-table tbody tr:nth-child(even) { background: color-mix(in srgb, var(--tmk-color-sand) 40%, var(--tmk-color-white)); }

	/* ---------- Inloggning ---------- */
	.tmk-login { max-width: 520px; }
	.tmk-login__title { font-family: var(--tmk-font-display); text-transform: uppercase; font-size: var(--tmk-text-h3); }
	.tmk-login form p { margin: 0 0 14px; }
	.tmk-login label { display: block; font-weight: 700; margin-bottom: 4px; }
	.tmk-login .login-remember label { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; }
	.tmk-login .login-remember input { width: 22px; height: 22px; }
	.tmk-login input[type="submit"] {
		min-height: 56px; width: 100%; border: var(--tmk-border) solid var(--tmk-color-ink); border-radius: var(--tmk-radius);
		background: var(--tmk-color-red); color: var(--tmk-color-on-red); font-weight: 700; font-size: var(--tmk-text-lg); cursor: pointer;
	}
	.tmk-login__help { margin: var(--tmk-space-sm) 0 0; }
	.tmk-notice { max-width: 620px; }

	/* ---------- Min sida ---------- */
	.tmk-member { display: grid; gap: var(--tmk-space-lg); }
	.tmk-member__hello { font-family: var(--tmk-font-display); font-weight: 800; text-transform: uppercase; font-size: var(--tmk-text-h2); margin: 0; }
	.tmk-member__lead { margin: 4px 0 0; font-size: var(--tmk-text-lg); color: var(--tmk-color-muted); }
	.tmk-member__grid { display: grid; gap: var(--tmk-space-md); grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
	.tmk-member__foot { margin: 0; }

	.tmk-member-card {
		position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 14px;
		padding: calc(var(--tmk-space-md) + 8px) var(--tmk-space-md) var(--tmk-space-md);
		background: var(--tmk-color-white); border: 3px solid var(--tmk-color-ink); border-radius: calc(var(--tmk-radius) * 1.4); box-shadow: var(--tmk-shadow);
	}
	.tmk-member-card__stripe { position: absolute; inset: 0 0 auto 0; height: 10px; }
	.tmk-member-card__top, .tmk-member-card__bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
	.tmk-member-card__bottom { align-items: flex-end; }
	.tmk-member-card__logo img { display: block; max-height: 56px; width: auto; mix-blend-mode: multiply; }
	.tmk-member-card__who { display: flex; flex-direction: column; gap: 2px; }
	.tmk-member-card__label { font-size: var(--tmk-text-sm); color: var(--tmk-color-muted); }
	.tmk-member-card__name { font-size: var(--tmk-text-xl); font-weight: 700; }
	.tmk-member-card__valid { color: var(--tmk-color-muted); }
	.tmk-plate { display: flex; flex-direction: column; align-items: center; padding: 6px 14px 4px; border: 3px solid var(--tmk-color-ink); border-radius: var(--tmk-radius-sm); background: var(--tmk-color-yellow); }
	.tmk-plate__label { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
	.tmk-plate__number { font-family: var(--tmk-font-display); font-weight: 800; font-style: italic; font-size: 2.6rem; line-height: 1; }

	.tmk-status { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-weight: 700; font-size: var(--tmk-text-sm); }
	.tmk-status--ok { background: var(--tmk-color-ink); color: var(--tmk-color-yellow); }
	.tmk-status--warn { background: var(--tmk-color-red); color: var(--tmk-color-on-red); }

	.tmk-member-meeting { display: flex; flex-direction: column; gap: 10px; padding: var(--tmk-space-md); border-radius: calc(var(--tmk-radius) * 1.4); background: var(--tmk-color-ink); color: var(--tmk-color-on-ink); }
	.tmk-member-meeting__kicker { font-size: var(--tmk-text-sm); font-weight: 700; color: var(--tmk-color-yellow); text-transform: uppercase; letter-spacing: 0.08em; }
	.tmk-member-meeting__title { font-family: var(--tmk-font-display); font-weight: 800; font-size: var(--tmk-text-h3); line-height: 1.05; text-transform: uppercase; }
	.tmk-member-meeting__meta { opacity: 0.92; }
	.tmk-member-meeting__actions { margin-top: auto; }

	.tmk-offers { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--tmk-space-md); grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
	.tmk-offer { display: flex; flex-direction: column; gap: 8px; }
	.tmk-offer__from { font-size: var(--tmk-text-sm); color: var(--tmk-color-muted); }
	.tmk-offer__headline { font-family: var(--tmk-font-display); font-weight: 800; font-size: calc(2rem * var(--tmk-font-scale)); line-height: 1; color: var(--tmk-color-red); }
	.tmk-offer__terms, .tmk-offer__until { color: var(--tmk-color-muted); font-size: var(--tmk-text-sm); }
	.tmk-offer__code { margin-top: auto; }
	.tmk-offer__code > summary { list-style: none; width: 100%; }
	.tmk-offer__code > summary::-webkit-details-marker { display: none; }
	.tmk-offer__code[open] > summary { display: none; }
	.tmk-offer__code-value { display: block; padding: 12px; text-align: center; border: var(--tmk-border) dashed var(--tmk-color-ink); border-radius: var(--tmk-radius-sm); font-family: var(--tmk-font-display); font-weight: 800; font-size: var(--tmk-text-xl); letter-spacing: 0.08em; user-select: all; }

	.tmk-rows { list-style: none; margin: 0; padding: 0; }
	.tmk-rows__item + .tmk-rows__item { border-top: 1.5px solid var(--tmk-color-line); }
	.tmk-rows__link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 8px; text-decoration: none; border-radius: 8px; }
	a.tmk-rows__link:hover { background: var(--tmk-color-paper); }
	.tmk-rows__text { display: flex; flex-direction: column; }
	.tmk-rows__title { font-weight: 700; }
	.tmk-rows__meta { font-size: var(--tmk-text-sm); color: var(--tmk-color-muted); }
	.tmk-rows__action { font-size: var(--tmk-text-sm); font-weight: 700; color: var(--tmk-color-red); white-space: nowrap; }

	/* ---------- Sidfot ---------- */
	.tmk-footer { background: var(--tmk-color-ink); color: var(--tmk-color-on-ink); padding-top: var(--tmk-space-xl); }
	.tmk-footer a { color: var(--tmk-color-on-ink); }
	.tmk-footer a:hover { color: var(--tmk-color-yellow); }
	.tmk-footer__inner { display: grid; gap: var(--tmk-space-lg); grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
	.tmk-footer .tmk-logo__img { mix-blend-mode: normal; background: var(--tmk-color-paper); border-radius: var(--tmk-radius-sm); padding: 6px; max-height: 72px; }
	.tmk-footer__text { margin-top: var(--tmk-space-sm); opacity: 0.9; max-width: 36ch; }
	.tmk-footer__heading { font-family: var(--tmk-font-display); text-transform: uppercase; font-size: var(--tmk-text-xl); color: var(--tmk-color-yellow); }
	.tmk-footer__menu { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
	.tmk-footer__bottom { margin-top: var(--tmk-space-lg); padding-block: var(--tmk-space-md); border-top: 1px solid color-mix(in srgb, var(--tmk-color-on-ink) 25%, var(--tmk-color-ink)); font-size: var(--tmk-text-sm); opacity: 0.85; }
	.tmk-footer__bottom p { margin: 0; }

	/* ---------- Brytpunkter ---------- */
	@media (min-width: 760px) {
		.tmk-strip__menu { display: flex; }
		.tmk-strip__member { display: inline-flex; }
		.tmk-hero__inner { grid-template-columns: 1.05fr 1fr; }
		.tmk-event { grid-template-columns: minmax(0, 1fr) minmax(280px, 380px); }
	}

	@media (min-width: 1100px) {
		.tmk-nav--desktop { display: block; flex: 1 1 auto; }
		.tmk-nav--desktop .tmk-menu--desktop { justify-content: center; }
		.tmk-header .tmk-cta--header { display: flex; flex: 0 0 auto; }
		.tmk-header__mobile { display: none; }
		.tmk-mobile-menu { display: none !important; }
	}
}

/* ===================================================================== */
@layer utilities {
	.tmk-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
	.alignwide { max-width: calc(var(--tmk-prose) + 240px); }
	.alignfull { width: 100vw; margin-left: calc(50% - 50vw); }
	.wp-caption-text, figcaption { font-size: var(--tmk-text-sm); color: var(--tmk-color-muted); }
}

/* Utan JavaScript: visa huvudmenyn direkt och dölj Meny-knappen. */
@layer components {
	html:not(.tmk-js) .tmk-menu-open { display: none; }
	html:not(.tmk-js) .tmk-nav--desktop { display: block; flex-basis: 100%; order: 3; }
	html:not(.tmk-js) .tmk-menu--desktop .tmk-submenu { position: static; visibility: visible; opacity: 1; transform: none; box-shadow: none; }
}

/* Sidfoten ligger alltid längst ner, även på korta sidor (v1.0.1). */
@layer base {
	body {
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		min-height: 100dvh;
	}
	body.admin-bar { min-height: calc(100dvh - 32px); }
	@media screen and (max-width: 782px) {
		body.admin-bar { min-height: calc(100dvh - 46px); }
	}
	body > * { min-width: 0; }
	.tmk-main { flex: 1 0 auto; }
	.tmk-sponsor-band,
	.tmk-footer { flex-shrink: 0; }
}
