/*
 * Smags Sansen: komponent-styling.
 * Farver, skrift og afstande kommer fra theme.json (CSS-variabler).
 */

:root {
	--ss-base: var(--wp--preset--color--base);
	--ss-surface: var(--wp--preset--color--surface);
	--ss-blush: var(--wp--preset--color--blush);
	--ss-line: var(--wp--preset--color--line);
	--ss-primary: var(--wp--preset--color--primary);
	--ss-primary-dark: var(--wp--preset--color--primary-dark);
	--ss-accent: var(--wp--preset--color--accent);
	--ss-paprika: var(--wp--preset--color--paprika);
	--ss-dild: var(--wp--preset--color--dild);
	--ss-blomme: var(--wp--preset--color--blomme, #6B2D4B);
	--ss-muted: var(--wp--preset--color--muted);
	--ss-ink: var(--wp--preset--color--contrast);
	--ss-serif: var(--wp--preset--font-family--heading);
	--ss-sans: var(--wp--preset--font-family--body);
	--ss-r-s: var(--wp--custom--radius--small, 6px);
	--ss-r-m: var(--wp--custom--radius--medium, 14px);
	--ss-r-l: var(--wp--custom--radius--large, 28px);
	--ss-ease: var(--wp--custom--transition, 180ms ease);
	--ss-overhang: clamp(5rem, 11vw, 11rem);
	--ss-icon-piskeris: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M24%2029C13%2023%2013%206%2024%203.5C35%206%2035%2023%2024%2029Z%22%2F%3E%3Cpath%20d%3D%22M24%2029C18.5%2023%2018.5%207%2024%203.5C29.5%207%2029.5%2023%2024%2029Z%22%2F%3E%3Cpath%20d%3D%22M24%2029V4%22%2F%3E%3Cpath%20d%3D%22M21.5%2029h5v13.5a2.5%202.5%200%200%201-5%200Z%22%2F%3E%3C%2Fsvg%3E");
	--ss-icon-shaker: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21.5%203.5h5a1%201%200%200%201%201%201V8h-7V4.5a1%201%200%200%201%201-1Z%22%2F%3E%3Cpath%20d%3D%22M18.5%208h11l1.8%208.5H16.7Z%22%2F%3E%3Cpath%20d%3D%22M15.5%2016.5h17l-2.3%2025a2.5%202.5%200%200%201-2.5%202.3h-7.4a2.5%202.5%200%200%201-2.5-2.3Z%22%2F%3E%3Cpath%20d%3D%22M16.2%2023h15.6%22%2F%3E%3C%2Fsvg%3E");
	--ss-icon-hvidloeg: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M24%209c-1%205-4%208-8.5%2011C9.5%2024%208%2030%2010%2035.5%2012%2041%2018%2044%2024%2044s12-3%2014-8.5c2-5.5.5-11.5-5.5-15.5C28%2017%2025%2014%2024%209Z%22%2F%3E%3Cpath%20d%3D%22M24%209V4.5%22%2F%3E%3Cpath%20d%3D%22M23.5%2017c-4.5%206-5.5%2016-2.5%2027%22%2F%3E%3Cpath%20d%3D%22M24.5%2017c4.5%206%205.5%2016%202.5%2027%22%2F%3E%3Cpath%20d%3D%22M17%2023c-3.5%205-4%2013-1%2019.5%22%2F%3E%3Cpath%20d%3D%22M31%2023c3.5%205%204%2013%201%2019.5%22%2F%3E%3C%2Fsvg%3E");
	--ss-icon-kvist: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M23%2045C23%2033%2025%2019%2031%204%22%2F%3E%3Cpath%20d%3D%22M23.5%2037c-6.5-.5-10.5-5-11.5-11%206%200%2010.5%204%2011.5%2011Z%22%2F%3E%3Cpath%20d%3D%22M24.5%2030c6-2%209.5-6.5%2010-12.5-5.5%201.5-9.5%206-10%2012.5Z%22%2F%3E%3Cpath%20d%3D%22M26%2022c-5.5-1-9-5-9.5-10.5%205%20.5%208.5%204.5%209.5%2010.5Z%22%2F%3E%3Cpath%20d%3D%22M28%2015c4.5-2%207-5.5%207.5-10-4.5%201-7%204.5-7.5%2010Z%22%2F%3E%3C%2Fsvg%3E");
	--ss-icon-anis: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20transform%3D%22rotate%280%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%280%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Cpath%20transform%3D%22rotate%2845%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%2845%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Cpath%20transform%3D%22rotate%2890%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%2890%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Cpath%20transform%3D%22rotate%28135%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%28135%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Cpath%20transform%3D%22rotate%28180%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%28180%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Cpath%20transform%3D%22rotate%28225%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%28225%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Cpath%20transform%3D%22rotate%28270%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%28270%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Cpath%20transform%3D%22rotate%28315%2024%2024%29%22%20d%3D%22M24%2021.5C20.5%2017%2020%209.5%2024%204c4%205.5%203.5%2013%200%2017.5Z%22%2F%3E%3Ccircle%20transform%3D%22rotate%28315%2024%2024%29%22%20cx%3D%2224%22%20cy%3D%2212.5%22%20r%3D%221.4%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Ccircle%20cx%3D%2224%22%20cy%3D%2224%22%20r%3D%222.6%22%2F%3E%3C%2Fsvg%3E");
}

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

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, .wp-block-post-title, .wp-block-query-title {
	font-variation-settings: "SOFT" 100, "WONK" 0;
	text-wrap: balance;
	hyphens: manual;
}

p {
	text-wrap: pretty;
}

::selection {
	background: var(--ss-accent);
	color: var(--ss-primary-dark);
}

:where(a, button, input, summary, .wp-element-button):focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
	border-radius: 4px;
}

a {
	text-underline-offset: 0.18em;
	text-decoration-thickness: 1px;
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

/* Ingen luft mellem header, farvede bånd og footer */
.wp-site-blocks > main,
main.wp-block-group > .alignfull {
	margin-block-start: 0 !important;
}

/*
 * Tekst på farvede flader følger altid fladens farve, også hvis et andet
 * plugin (fx Elementors globale kit) farver alle links og overskrifter.
 * "body" foran giver nok vægt til at slå den slags regler.
 */
body :is(.ss-hero, .ss-page-hero, .ss-recipe-hero, .ss-band, .ss-lex-hero) :is(h1, h2, h3, h4, h5, h6) {
	color: inherit;
}

body :is(.ss-hero, .ss-page-hero, .ss-recipe-hero, .ss-band, .ss-lex-hero) a:not(.wp-element-button) {
	color: inherit;
}

body .ss-header .wp-block-navigation a,
body .ss-header .ss-header__fallback-title a {
	color: var(--ss-primary-dark);
}

body .ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
	color: var(--ss-base);
}

body .ss-card .ss-card__title a {
	color: var(--ss-primary-dark);
}

/* Stor redaktionel overskrift */
.ss-display {
	font-size: clamp(2.5rem, 5.4vw, 5rem) !important;
	font-weight: 360 !important;
	line-height: 0.98 !important;
	letter-spacing: -0.03em;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
	margin: 0;
}

/* ------------------------------------------------------------------
 * Header
 * ------------------------------------------------------------------ */

/* WordPress lægger headeren i en <header class="wp-block-template-part">,
   der er præcis lige så høj som headeren. Derfor er det omslaget, der skal
   hænge fast, ellers har headeren ikke plads til at blive hængende. */
.wp-site-blocks > header.wp-block-template-part:has(> .ss-header) {
	position: sticky;
	top: 0;
	z-index: 50;
}

.admin-bar .wp-site-blocks > header.wp-block-template-part:has(> .ss-header) {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part:has(> .ss-header) {
		top: 0;
	}
}

.ss-header {
	position: sticky;
	top: 0;
	z-index: 50;
	border-bottom: 1px solid var(--ss-line);
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
}

/* Sløret baggrund på et pseudo-element. Lå den på selve headeren,
   ville mobilmenuen (position: fixed) blive fanget inde i headeren. */
.ss-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: color-mix(in srgb, var(--ss-base) 94%, transparent);
	backdrop-filter: saturate(140%) blur(10px);
	-webkit-backdrop-filter: saturate(140%) blur(10px);
	pointer-events: none;
}

.admin-bar .ss-header {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar .ss-header {
		top: 0;
	}
}

.ss-header__inner {
	gap: 1.5rem;
}

.ss-header__logo img {
	display: block;
	height: auto;
	max-height: 64px;
	width: auto;
}

.ss-header__fallback-title {
	white-space: nowrap;
	font-family: var(--ss-serif);
	font-size: 1.6rem;
	font-weight: 450;
	font-style: italic;
	margin: 0;
	line-height: 1;
	font-variation-settings: "SOFT" 100, "WONK" 1;
}

.ss-header__fallback-title a {
	color: var(--ss-primary-dark);
	text-decoration: none;
}

.ss-header__nav {
	gap: 1rem;
}

.ss-header .wp-block-navigation a {
	color: var(--ss-primary-dark);
	text-decoration: none;
	padding-block: 0.35rem;
	background: linear-gradient(var(--ss-paprika), var(--ss-paprika)) 0 100% / 0 2px no-repeat;
	transition: background-size var(--ss-ease);
}

.ss-header .wp-block-navigation a:hover,
.ss-header .wp-block-navigation .current-menu-item > a,
.ss-header .wp-block-navigation a[aria-current="page"] {
	background-size: 100% 2px;
}

.ss-header .wp-block-navigation__responsive-container-open {
	color: var(--ss-primary-dark);
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open,
.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	color: var(--ss-base);
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1.25rem clamp(1.25rem, 6vw, 2.5rem) 2.5rem !important;
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: 1.25rem;
	right: clamp(1.25rem, 6vw, 2.5rem);
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 4.5rem;
	align-items: flex-start !important;
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start !important;
	gap: 1rem !important;
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start !important;
	padding: 0 !important;
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
	font-family: var(--ss-serif);
	font-size: clamp(2rem, 9vw, 3rem);
	font-weight: 380;
	color: var(--ss-base);
	font-variation-settings: "SOFT" 100, "WONK" 1;
}

/* Undermenu (Leksikon) */
.ss-header .wp-block-navigation .wp-block-navigation-submenu__toggle {
	color: var(--ss-primary-dark);
}

.ss-header .wp-block-navigation .wp-block-navigation__submenu-container {
	min-width: 15.5rem !important;
	margin-top: 0.75rem;
	padding: 0.5rem !important;
	background: var(--ss-surface) !important;
	border: 1px solid var(--ss-line) !important;
	border-radius: 18px;
	box-shadow: 0 24px 48px -24px rgba(16, 48, 58, 0.38);
}

/* Usynlig bro, så menuen ikke lukker på vej ned med musen */
.ss-header .wp-block-navigation .wp-block-navigation__submenu-container::before {
	content: "";
	position: absolute;
	inset: -0.85rem 0 auto;
	height: 0.85rem;
}

body .ss-header .wp-block-navigation .wp-block-navigation__submenu-container a {
	display: block;
	width: 100%;
	padding: 0.6rem 0.85rem;
	border-radius: 11px;
	background: none;
	color: var(--ss-primary-dark);
	font-size: 0.9375rem;
	transition: background-color var(--ss-ease);
}

body .ss-header .wp-block-navigation .wp-block-navigation__submenu-container a:hover,
body .ss-header .wp-block-navigation .wp-block-navigation__submenu-container a:focus-visible {
	background: var(--ss-blush);
}

body .ss-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item:last-child {
	margin-top: 0.35rem;
	padding-top: 0.35rem;
	border-top: 1px solid var(--ss-line);
}

/* Undermenuen i mobilmenuen: åben liste i mindre skrift */
.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	margin: 0.5rem 0 0.75rem !important;
	padding: 0 0 0 0.25rem !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none;
	gap: 0.6rem !important;
}

.ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container::before {
	display: none;
}

body .ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container a {
	padding: 0.2rem 0 !important;
	font-family: var(--ss-sans);
	font-size: 1.125rem;
	font-weight: 400;
	color: color-mix(in srgb, var(--ss-base) 82%, transparent);
	background: none;
}

body .ss-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item:last-child {
	border-top: 0;
	margin-top: 0;
	padding-top: 0;
}

.ss-header__cta {
	margin: 0;
}

.wp-block-button.is-style-leksikon > .wp-block-button__link {
	background: var(--ss-primary-dark);
	color: var(--ss-base);
	padding: 0.55rem 1.05rem;
	font-size: 0.9375rem;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.wp-block-button.is-style-leksikon > .wp-block-button__link::before {
	content: "";
	width: 1.15rem;
	height: 1.15rem;
	background: var(--ss-accent);
	-webkit-mask: var(--ss-icon-anis) center / contain no-repeat;
	mask: var(--ss-icon-anis) center / contain no-repeat;
}

.wp-block-button.is-style-leksikon > .wp-block-button__link:hover {
	background: var(--ss-primary);
}

/* Søgeikon i header */
.ss-header__search .wp-block-search__button {
	background: transparent;
	color: var(--ss-primary-dark);
	border: 1px solid var(--ss-line);
	border-radius: 999px;
	width: 2.6rem;
	height: 2.6rem;
	padding: 0;
	display: grid;
	place-items: center;
	margin: 0;
}

.ss-header__search .wp-block-search__button:hover {
	background: var(--ss-surface);
}

.ss-header__search .wp-block-search__button svg {
	width: 1.3rem;
	height: 1.3rem;
	fill: currentColor;
}

.ss-header__search.wp-block-search__button-only:not(.wp-block-search__searchfield-hidden) .wp-block-search__input {
	border-radius: 999px;
	border: 1px solid var(--ss-line);
	padding-inline: 1rem;
	background: var(--ss-surface);
}

/* ------------------------------------------------------------------
 * Søgefelter
 * ------------------------------------------------------------------ */

.wp-block-search:not(.ss-header__search) .wp-block-search__inside-wrapper {
	background: var(--ss-surface);
	border: 1px solid var(--ss-line);
	border-radius: 999px;
	padding: 0.3rem;
	transition: border-color var(--ss-ease), box-shadow var(--ss-ease);
}

.wp-block-search:not(.ss-header__search) .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--ss-accent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--ss-accent) 35%, transparent);
}

.wp-block-search:not(.ss-header__search) .wp-block-search__input {
	border: 0;
	background: transparent;
	padding: 0.75rem 1.15rem;
	font: inherit;
	color: var(--ss-ink);
	min-width: 0;
}

.wp-block-search:not(.ss-header__search) .wp-block-search__input:focus {
	outline: none;
}

.wp-block-search:not(.ss-header__search) .wp-block-search__button {
	margin: 0;
	border-radius: 999px;
	border: 0;
	background: var(--ss-primary-dark);
	color: var(--ss-base);
	padding: 0.75rem 1.4rem;
	font-weight: 600;
	white-space: nowrap;
}

.wp-block-search:not(.ss-header__search) .wp-block-search__button:hover {
	background: var(--ss-paprika);
}

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

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--ss-primary-dark);
	border: 1px solid currentColor;
	padding: calc(0.85rem - 1px) calc(1.6rem - 1px);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--ss-primary-dark);
	border-color: var(--ss-primary-dark);
	color: var(--ss-base);
}

.wp-block-button.is-style-lys > .wp-block-button__link {
	background: var(--ss-base);
	color: var(--ss-primary-dark);
}

.wp-block-button.is-style-lys > .wp-block-button__link:hover {
	background: var(--ss-accent);
	color: var(--ss-primary-dark);
}

.wp-block-button.is-style-lys-kontur > .wp-block-button__link {
	background: transparent;
	color: var(--ss-base);
	border: 1px solid color-mix(in srgb, var(--ss-base) 55%, transparent);
	padding: calc(0.85rem - 1px) calc(1.6rem - 1px);
}

.wp-block-button.is-style-lys-kontur > .wp-block-button__link:hover {
	border-color: var(--ss-base);
	background: color-mix(in srgb, var(--ss-base) 10%, transparent);
	color: var(--ss-base);
}

/* ------------------------------------------------------------------
 * Tallerken: rundt billede med kant, som en tallerken set oppefra
 * ------------------------------------------------------------------ */

.is-style-tallerken {
	--ss-rim: clamp(8px, 1.3vw, 16px);
	--ss-rim-color: var(--ss-surface);
	--ss-rim-line: var(--ss-line);
	border-radius: 50%;
	overflow: visible;
}

.is-style-tallerken img,
.is-style-tallerken .wp-block-post-featured-image__overlay {
	border-radius: 50% !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.is-style-tallerken img {
	box-shadow:
		0 0 0 var(--ss-rim) var(--ss-rim-color),
		0 0 0 calc(var(--ss-rim) + 1px) var(--ss-rim-line),
		0 calc(var(--ss-rim) * 4) calc(var(--ss-rim) * 6) calc(var(--ss-rim) * -2) rgba(8, 28, 34, 0.45);
}

/* ------------------------------------------------------------------
 * Forside: hero
 * ------------------------------------------------------------------ */

.ss-hero {
	position: relative;
	padding-top: clamp(3rem, 7vw, 6.5rem);
	padding-bottom: clamp(3rem, 6vw, 5rem);
	isolation: isolate;
}

.ss-hero a:where(:not(.wp-element-button)) {
	color: inherit;
}

.ss-hero__cols {
	gap: clamp(2rem, 5vw, 5rem) !important;
	align-items: flex-start !important;
}

.ss-hero__title {
	font-size: clamp(3.1rem, 8.2vw, 8.75rem) !important;
	font-weight: 350 !important;
	line-height: 0.9 !important;
	letter-spacing: -0.04em;
	margin: 0;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
	max-width: 9.5ch;
}

.ss-hero__lead {
	max-width: 30em;
	margin-top: 2rem;
	font-size: var(--wp--preset--font-size--large);
	color: color-mix(in srgb, var(--ss-base) 82%, transparent);
}

.ss-hero__search {
	max-width: 33rem;
	margin-top: 2rem;
}

.ss-hero__search .wp-block-search__button {
	background: var(--ss-accent) !important;
	color: var(--ss-primary-dark) !important;
}

.ss-hero__search .wp-block-search__button:hover {
	background: var(--ss-paprika) !important;
	color: var(--ss-base) !important;
}

.ss-hero__buttons {
	margin-top: 1.25rem;
	gap: 0.6rem;
}

.ss-hero__plate {
	position: relative;
	z-index: 2;
}

.ss-hero__latest {
	position: relative;
	width: 100%;
	max-width: 500px;
	margin-inline: auto;
}

.ss-hero__latest .wp-block-post-template {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ss-hero__latest .wp-block-post-template > li {
	position: relative;
}

.ss-hero__image {
	--ss-rim-color: color-mix(in srgb, var(--ss-base) 10%, var(--ss-primary-dark));
	--ss-rim-line: color-mix(in srgb, var(--ss-base) 22%, transparent);
	margin: var(--ss-rim, 16px);
}

/* Stempel: "Nyt på bordet" */
body .ss-hero .ss-stamp,
.ss-stamp {
	position: absolute;
	z-index: 3;
	top: -0.5rem;
	left: -0.5rem;
	width: clamp(5.5rem, 9vw, 7.75rem);
	aspect-ratio: 1;
	margin: 0;
	display: grid;
	place-items: center;
	text-align: center;
	padding: 1rem;
	border-radius: 50%;
	background: var(--ss-accent);
	color: var(--ss-primary-dark);
	font-family: var(--ss-serif);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1rem, 1.5vw, 1.3rem);
	line-height: 1;
	transform: rotate(-14deg);
	box-shadow: 0 0 0 4px var(--ss-primary-dark), 0 0 0 5px var(--ss-accent);
	font-variation-settings: "SOFT" 100, "WONK" 1;
}

.ss-hero__caption {
	text-align: center;
	margin-top: 2.25rem;
}

.ss-hero__recipe {
	margin: 0 0 0.6rem;
	font-weight: 450;
	font-size: var(--wp--preset--font-size--large);
}

.ss-hero__recipe,
.ss-hero__recipe a {
	color: inherit;
	text-decoration: none;
}

.ss-hero__recipe a:hover {
	text-decoration: underline;
}

.ss-hero__info {
	justify-content: center;
}

/* Store skærme: tallerkenen står midt ud for teksten */
@media (min-width: 782px) {
	.ss-hero__plate {
		align-self: center !important;
	}

	/* Titel og tid som et lille lyst kort på tallerkenens nederste kant.
	   Tallerkenen hænger ud over det mørke felt, så teksten under den
	   ville ellers lande skiftevis på mørk og lys baggrund. */
	.ss-hero__caption {
		position: absolute;
		z-index: 3;
		right: -0.75rem;
		bottom: 7%;
		max-width: min(17.5rem, 70%);
		margin: 0;
		padding: 1rem 1.25rem 0.9rem;
		text-align: left;
		background: var(--ss-surface);
		color: var(--ss-ink);
		border-radius: 18px;
		box-shadow: 0 0 0 1px color-mix(in srgb, var(--ss-primary-dark) 8%, transparent), 0 22px 44px -20px rgba(4, 20, 26, 0.6);
	}

	body .ss-hero .ss-hero__caption .ss-hero__recipe,
	body .ss-hero .ss-hero__caption .ss-hero__recipe a {
		color: var(--ss-primary-dark);
	}

	.ss-hero__caption .ss-hero__recipe {
		margin: 0 0 0.4rem;
		font-size: clamp(1.1rem, 1.4vw, 1.3rem);
		line-height: 1.15;
	}

	.ss-hero__caption .ss-hero__info {
		justify-content: flex-start;
	}

	body .ss-hero .ss-hero__caption > * + * {
		margin-block-start: 0.5rem !important;
	}

	.ss-hero__caption .ss-info {
		color: var(--ss-muted);
	}

	.ss-hero__caption .ss-info svg {
		color: var(--ss-primary);
	}

	.ss-hero__caption .ss-info__stjerner {
		color: var(--ss-ink);
	}

}

@media (max-width: 781px) {
	.ss-hero__plate {
		order: -1;
	}

	.ss-hero__latest {
		max-width: 300px;
	}

	.ss-hero__title {
		max-width: none;
	}

	.ss-hero .ss-info,
	.ss-hero .ss-info__stjerner,
	.ss-hero .ss-info__antal,
	.ss-hero .ss-info svg {
		color: color-mix(in srgb, var(--ss-base) 85%, transparent);
	}
}

/* ------------------------------------------------------------------
 * Sektioner
 * ------------------------------------------------------------------ */

.ss-section {
	padding-top: var(--wp--preset--spacing--60);
	padding-bottom: var(--wp--preset--spacing--60);
}

.ss-section__head {
	margin-bottom: var(--wp--preset--spacing--50);
	gap: 1rem;
	padding-bottom: 1.25rem;
	border-bottom: 2px solid var(--ss-primary-dark);
}

.ss-more-link {
	margin: 0;
	font-weight: 700;
}

.ss-more-link a {
	color: var(--ss-primary-dark);
	text-decoration-color: var(--ss-paprika);
	text-decoration-thickness: 2px;
}

/* ------------------------------------------------------------------
 * Opskriftskort i oversigter
 * ------------------------------------------------------------------ */

.ss-grid .wp-block-post-template.is-layout-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(2rem, 3.5vw, 3.25rem) clamp(1.25rem, 2.5vw, 2rem);
}

@media (max-width: 960px) {
	.ss-grid .wp-block-post-template.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.ss-grid .wp-block-post-template.is-layout-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Redaktionelt gitter: første opskrift stor */
.ss-grid--featured .wp-block-post-template.is-layout-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	align-items: start;
}

.ss-grid--featured .wp-block-post-template > li:first-child {
	grid-column: span 2;
	grid-row: span 2;
}

.ss-grid--featured .wp-block-post-template > li:first-child .ss-card__title {
	font-size: clamp(1.9rem, 3vw, 2.75rem);
	font-weight: 380;
	line-height: 1.02;
	letter-spacing: -0.02em;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
}

.ss-grid--featured .wp-block-post-template > li:not(:first-child) .ss-card__excerpt {
	display: none;
}

@media (max-width: 960px) {
	.ss-grid--featured .wp-block-post-template.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ss-grid--featured .wp-block-post-template > li:first-child {
		grid-row: auto;
	}
}

@media (max-width: 560px) {
	.ss-grid--featured .wp-block-post-template.is-layout-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ss-grid--featured .wp-block-post-template > li:first-child {
		grid-column: auto;
	}
}

.ss-card {
	display: flex;
	flex-direction: column;
	gap: 0;
	height: 100%;
}

.ss-card__image {
	margin: 0 0 1rem;
	border-radius: 20px;
	overflow: hidden;
	background: var(--ss-blush);
}

.ss-card__image img {
	transition: transform 600ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.ss-card:hover .ss-card__image img {
	transform: scale(1.04);
}

.ss-card__terms {
	margin: 0 0 0.55rem;
}

.ss-card__title {
	margin: 0 0 0.6rem;
	font-weight: 450;
	font-size: 1.45rem;
	line-height: 1.15;
}

.ss-card__title a {
	text-decoration: none;
}

.ss-card__title a:hover {
	text-decoration: underline;
	text-decoration-color: var(--ss-paprika);
	text-decoration-thickness: 2px;
}

.ss-card__excerpt {
	color: var(--ss-muted);
	margin: 0 0 0.8rem;
	max-width: 36em;
}

.ss-card__excerpt p {
	margin: 0;
}

.ss-card__info {
	margin-top: auto;
}

/* Piller (kategorier) */
.wp-block-post-terms.is-style-pille {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1;
}

.wp-block-post-terms.is-style-pille a {
	display: inline-block;
	background: var(--ss-blush);
	color: var(--ss-primary-dark);
	padding: 0.42rem 0.8rem;
	border-radius: 999px;
	text-decoration: none;
	transition: background var(--ss-ease), color var(--ss-ease);
}

.wp-block-post-terms.is-style-pille a:hover {
	background: var(--ss-primary-dark);
	color: var(--ss-base);
}

.wp-block-post-terms.is-style-pille .wp-block-post-terms__separator {
	display: none;
}

/* Kategoriliste som piller */
.ss-pills.wp-block-categories,
.ss-pills .wp-block-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

.ss-pills .cat-item a {
	display: inline-block;
	border: 1px solid var(--ss-line);
	background: var(--ss-surface);
	color: var(--ss-primary-dark);
	padding: 0.55rem 1.05rem;
	border-radius: 999px;
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9375rem;
	transition: border-color var(--ss-ease), background var(--ss-ease), color var(--ss-ease);
}

.ss-pills .cat-item a:hover,
.ss-pills .current-cat a {
	border-color: var(--ss-primary-dark);
	background: var(--ss-primary-dark);
	color: var(--ss-base);
}

.ss-pills--dark .cat-item a {
	background: transparent;
	color: var(--ss-base);
	border-color: color-mix(in srgb, var(--ss-base) 35%, transparent);
}

body .ss-page-hero .ss-pills--dark .cat-item a:hover,
body .ss-page-hero .ss-pills--dark .current-cat a,
.ss-pills--dark .cat-item a:hover,
.ss-pills--dark .current-cat a {
	background: var(--ss-accent);
	border-color: var(--ss-accent);
	color: var(--ss-primary-dark);
}

/* Opskriftsinfo-blokken */
.ss-info {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 1.1rem;
	font-size: 0.9375rem;
	color: var(--ss-muted);
	line-height: 1.3;
}

.ss-info__item {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
}

.ss-info svg {
	flex: none;
	color: var(--ss-primary);
}

.ss-info__stjerner {
	color: var(--ss-ink);
	font-weight: 700;
}

.ss-info__stjerner svg {
	color: var(--ss-accent) !important;
}

.ss-info__antal {
	font-weight: 400;
	opacity: 0.8;
}

.ss-info.is-placeholder {
	opacity: 0.7;
}

/* Paginering */
.ss-pagination {
	margin-top: var(--wp--preset--spacing--50);
	gap: 0.4rem;
}

.ss-pagination a,
.ss-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: 2.75rem;
	height: 2.75rem;
	padding: 0 1rem;
	border-radius: 999px;
	border: 1px solid var(--ss-line);
	text-decoration: none;
	color: var(--ss-primary-dark);
}

.ss-pagination .page-numbers.current {
	background: var(--ss-primary-dark);
	border-color: var(--ss-primary-dark);
	color: var(--ss-base);
}

/* ------------------------------------------------------------------
 * Leksikon-sektion på forsiden
 * ------------------------------------------------------------------ */

.ss-lex-promo__head {
	align-items: flex-end !important;
	gap: clamp(1.5rem, 4vw, 4rem) !important;
	margin-bottom: var(--wp--preset--spacing--50);
	padding-bottom: 1.5rem;
	border-bottom: 2px solid var(--ss-primary-dark);
}

.ss-lex-promo__lead p {
	margin: 0;
	color: var(--ss-ink);
}

/* ------------------------------------------------------------------
 * Safranbånd
 * ------------------------------------------------------------------ */

.ss-band {
	padding-top: var(--wp--preset--spacing--70);
	padding-bottom: var(--wp--preset--spacing--70);
}

.ss-band a {
	color: inherit;
}

.ss-band__title {
	margin-bottom: var(--wp--preset--spacing--50) !important;
	max-width: 13ch;
	color: inherit;
}

.ss-band__cols {
	gap: clamp(1.5rem, 4vw, 3.5rem) !important;
}

.ss-band__cols > .wp-block-column {
	border-top: 2px solid var(--ss-primary-dark);
	padding-top: 1.5rem;
}

.ss-band h3 {
	margin: 0 0 0.75rem;
	font-weight: 450;
	color: inherit;
	font-size: 1.6rem;
}

.ss-band__cols p {
	margin: 0;
}

/* ------------------------------------------------------------------
 * Om-sektion
 * ------------------------------------------------------------------ */

.ss-about__cols {
	gap: clamp(2rem, 6vw, 6rem) !important;
}

.ss-about__quote {
	font-weight: 360;
	font-style: italic;
	line-height: 1.05;
	letter-spacing: -0.02em;
	margin: 0;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
}

.ss-about__cats-title {
	font-family: var(--ss-sans);
	font-weight: 700;
	margin-top: 2rem;
	margin-bottom: 0.85rem;
}

/* ------------------------------------------------------------------
 * Mørk sidetop (arkiver, søgning, 404)
 * ------------------------------------------------------------------ */

.ss-page-hero {
	padding-top: clamp(3rem, 7vw, 6rem);
	padding-bottom: clamp(3rem, 6vw, 5rem);
}

.ss-page-hero a:where(:not(.wp-element-button)) {
	color: inherit;
}

.ss-page-hero__inner > * + * {
	margin-top: 1.5rem;
}

.ss-page-hero__title {
	margin: 0;
	color: var(--ss-base);
	font-size: clamp(3rem, 8vw, 7.5rem) !important;
	font-weight: 350 !important;
	line-height: 0.92;
	letter-spacing: -0.04em;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
}

.ss-page-hero__lead {
	max-width: 34em;
	font-size: var(--wp--preset--font-size--large);
	color: color-mix(in srgb, var(--ss-base) 82%, transparent);
}

.ss-page-hero__lead p {
	margin: 0;
}

.ss-page-hero__search {
	max-width: 33rem;
}

.ss-page-hero .ss-pills {
	margin-top: 1.25rem !important;
}

.ss-archive {
	padding-bottom: var(--wp--preset--spacing--40);
}

/* ------------------------------------------------------------------
 * Enkelt opskrift
 * ------------------------------------------------------------------ */

.ss-recipe-hero {
	padding-top: clamp(2.5rem, 6vw, 5rem);
	padding-bottom: clamp(2.5rem, 5vw, 4rem);
}

.ss-recipe-hero a:where(:not(.wp-element-button)) {
	color: inherit;
}

.ss-recipe-hero__cols {
	gap: clamp(2rem, 5vw, 5rem) !important;
}

.ss-recipe-hero__text {
	align-self: center;
}

.ss-recipe-hero .wp-block-post-terms.is-style-pille a {
	background: var(--ss-accent);
	color: var(--ss-primary-dark);
}

.ss-recipe-hero .wp-block-post-terms.is-style-pille a:hover {
	background: var(--ss-base);
}

.ss-recipe-hero__title {
	font-weight: 350 !important;
	margin: 1.1rem 0 1.5rem;
	font-size: clamp(2.6rem, 6.2vw, 6.25rem) !important;
	line-height: 0.95;
	letter-spacing: -0.035em;
	color: var(--ss-base);
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
}

.ss-recipe-hero__meta {
	gap: 0.5rem 1.25rem;
	font-size: 0.9375rem;
	color: color-mix(in srgb, var(--ss-base) 80%, transparent);
}

.ss-recipe-hero__meta > * {
	margin: 0;
}

.ss-recipe-hero .wp-block-post-date {
	color: inherit;
}

.ss-recipe-hero .ss-info,
.ss-recipe-hero .ss-info__stjerner,
.ss-recipe-hero .ss-info svg {
	color: color-mix(in srgb, var(--ss-base) 88%, transparent);
}

.ss-byline::before {
	content: "Af ";
	font-weight: 400;
}

.ss-byline {
	color: var(--ss-base);
	font-weight: 700;
}

.ss-recipe-hero__image {
	--ss-rim-color: color-mix(in srgb, var(--ss-base) 10%, var(--ss-primary-dark));
	--ss-rim-line: color-mix(in srgb, var(--ss-base) 22%, transparent);
	max-width: 460px;
	margin: var(--ss-rim, 16px) auto;
}

@media (min-width: 782px) {
	.ss-recipe-hero__plate {
		align-self: flex-end !important;
		transform: translateY(var(--ss-overhang));
		position: relative;
		z-index: 2;
	}

	.ss-single .ss-content--recipe {
		padding-top: calc(var(--ss-overhang) + 2rem);
	}

	body.ss-uden-billede .ss-single .ss-content--recipe {
		padding-top: var(--wp--preset--spacing--50);
	}
}

/* Uden billede får titlen hele bredden i det mørke felt */
body.ss-uden-billede .ss-recipe-hero__plate {
	display: none;
}

body.ss-uden-billede .ss-recipe-hero__text {
	flex-basis: 100% !important;
}

@media (max-width: 781px) {
	.ss-recipe-hero__plate {
		order: -1;
	}

	.ss-recipe-hero__image {
		max-width: 280px;
	}
}

/* Brødtekst i indlæg */
.ss-content {
	padding-top: var(--wp--preset--spacing--50);
	padding-bottom: var(--wp--preset--spacing--50);
}

.ss-content > p:first-of-type,
.ss-content > .ss-intro {
	/* Indledningen er lidt større end brødteksten, men ikke så meget,
	   at et kort andet afsnit ser forkert ud ved siden af. */
	font-size: clamp(1.15rem, 1rem + 0.45vw, 1.3rem);
	line-height: 1.6;
	color: var(--ss-ink);
}

.ss-content h2 {
	margin-top: var(--wp--preset--spacing--50);
	font-weight: 450;
}

.ss-content img {
	border-radius: var(--ss-r-m);
}

/* Tip fra køkkenet */
.wp-block-group.is-style-tip {
	background: var(--ss-blush);
	border-radius: var(--ss-r-l);
	padding: clamp(1.5rem, 4vw, 2.5rem);
	position: relative;
	margin-block: var(--wp--preset--spacing--50);
}

.wp-block-group.is-style-tip > :first-child {
	margin-top: 0;
}

.wp-block-group.is-style-tip > :last-child {
	margin-bottom: 0;
}

.wp-block-group.is-style-tip h3,
.wp-block-group.is-style-tip h2 {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-style: italic;
	font-weight: 450;
	font-variation-settings: "SOFT" 100, "WONK" 1;
}

.wp-block-group.is-style-tip h3::before,
.wp-block-group.is-style-tip h2::before {
	content: "";
	flex: none;
	width: 1.7rem;
	height: 1.7rem;
	background: var(--ss-paprika);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-3.6 10.8c.6.5 1 1.2 1 2V16h5.2v-.2c0-.8.4-1.5 1-2A6 6 0 0 0 12 3z' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-3.6 10.8c.6.5 1 1.2 1 2V16h5.2v-.2c0-.8.4-1.5 1-2A6 6 0 0 0 12 3z' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Flueben-liste */
.wp-block-list.is-style-flueben {
	list-style: none;
	padding-left: 0;
}

.wp-block-list.is-style-flueben li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: 0.6rem;
}

.wp-block-list.is-style-flueben li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 1.3rem;
	height: 1.3rem;
	border-radius: 50%;
	background: var(--ss-primary-dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12.5l3.2 3L17 9' fill='none' stroke='%23EBA937' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 80% no-repeat;
}

/* ------------------------------------------------------------------
 * Spørgsmål og svar
 * Dækker både Akkordeon-blokken (WordPress 6.9+) og Detaljer-blokken,
 * så gamle og nye opskrifter ser ens ud. Selektorerne er skrappe nok
 * til at slå Elementor-kittets globale knapfarver.
 * ---------------------------------------------------------------- */
:root {
	--ss-faq-icon: linear-gradient(currentColor, currentColor) center / 0.75rem 1.5px no-repeat,
		linear-gradient(currentColor, currentColor) center / 1.5px 0.75rem no-repeat;
}

body .wp-block-accordion {
	border-top: 1px solid var(--ss-line);
	margin-block: var(--wp--preset--spacing--50, 2.5rem);
}

body .wp-block-accordion > .wp-block-accordion-item {
	margin: 0;
	border-bottom: 1px solid var(--ss-line);
}

body .wp-block-accordion .wp-block-accordion-heading {
	margin: 0;
	font-size: inherit;
	line-height: inherit;
}

body .wp-block-accordion button.wp-block-accordion-heading__toggle,
body .wp-block-details > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	width: 100%;
	margin: 0;
	padding: 1.35rem 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: var(--ss-primary-dark);
	font-family: var(--ss-serif);
	font-size: clamp(1.15rem, 1.05rem + 0.4vw, 1.375rem);
	font-weight: 450;
	font-variation-settings: "opsz" 36, "SOFT" 50;
	line-height: 1.3;
	letter-spacing: -0.005em;
	text-align: left;
	text-transform: none;
	cursor: pointer;
	list-style: none;
	transition: color var(--ss-ease);
}

body .wp-block-accordion button.wp-block-accordion-heading__toggle:hover,
body .wp-block-accordion button.wp-block-accordion-heading__toggle:focus,
body .wp-block-details > summary:hover {
	background: none;
	color: var(--ss-primary);
}

body .wp-block-accordion .wp-block-accordion-heading__toggle-title,
body .wp-block-accordion .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
	flex: 1;
	text-decoration: none;
	text-wrap: pretty;
}

/* Akkordeon og Detaljer blandet i samme indlæg: én samlet liste */
body .wp-block-accordion:has(+ .wp-block-details) {
	margin-bottom: 0;
}

body .wp-block-accordion + .wp-block-details,
body .wp-block-details + .wp-block-details {
	margin-block-start: 0 !important;
}

/* Fed tekst i spørgsmålet er altid for meget i Fraunces */
body .wp-block-accordion .wp-block-accordion-heading__toggle-title :is(strong, b),
body .wp-block-details > summary :is(strong, b) {
	font-weight: inherit;
}

body .wp-block-details > summary::-webkit-details-marker {
	display: none;
}

/* Ikonet: en rund knap med plus, der bliver til et kryds på safran */
body .wp-block-accordion .wp-block-accordion-heading__toggle-icon,
body .wp-block-details > summary::after {
	content: "";
	flex: none;
	display: block;
	width: 2.25rem;
	height: 2.25rem;
	margin: 0;
	border: 1.5px solid var(--ss-line);
	border-radius: 50%;
	background: var(--ss-faq-icon);
	color: var(--ss-paprika);
	font-size: 0;
	line-height: 0;
	transform: none;
	transition: transform 260ms cubic-bezier(.2, .7, .3, 1), background-color var(--ss-ease), border-color var(--ss-ease), color var(--ss-ease);
}

body .wp-block-accordion .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-icon,
body .wp-block-details > summary:hover::after {
	border-color: var(--ss-paprika);
}

body .wp-block-accordion .wp-block-accordion-heading__toggle[aria-expanded="true"] .wp-block-accordion-heading__toggle-icon,
body .wp-block-details[open] > summary::after {
	transform: rotate(45deg);
	background-color: var(--ss-accent);
	border-color: var(--ss-accent);
	color: var(--ss-primary-dark);
}

/* Svaret */
body .wp-block-accordion .wp-block-accordion-panel,
body .wp-block-details > :not(summary) {
	max-width: 62ch;
	margin: 0;
	padding: 0 3.75rem 1.5rem 0;
	color: var(--wp--preset--color--contrast);
	font-size: 1.0625rem;
	line-height: 1.7;
}

body .wp-block-accordion .wp-block-accordion-panel > * {
	margin-block: 0 0.85rem;
}

body .wp-block-accordion .wp-block-accordion-panel > :last-child {
	margin-bottom: 0;
}

body .wp-block-details {
	padding-block: 0;
}

body .wp-block-details > :not(summary) {
	margin-top: -0.35rem;
}

@media (prefers-reduced-motion: reduce) {
	body .wp-block-accordion .wp-block-accordion-heading__toggle-icon,
	body .wp-block-details > summary::after {
		transition: none;
	}
}

/* Efter indholdet: tags og kommentarer */
.ss-after {
	padding-bottom: var(--wp--preset--spacing--60);
}

.ss-tags {
	font-size: 0.9375rem;
	color: var(--ss-muted);
}

.ss-comments .wp-block-comments-title {
	margin-top: var(--wp--preset--spacing--50);
}

.ss-comment {
	padding-block: 1.5rem;
	border-bottom: 1px solid var(--ss-line);
}

.ss-comment__head {
	gap: 0.75rem;
}

.ss-comment__head > * {
	margin: 0;
}

.ss-comment .wp-block-comment-author-name {
	font-weight: 700;
}

.ss-comment .wp-block-comment-date {
	color: var(--ss-muted);
	font-size: 0.875rem;
}

.ss-comment .wp-block-comment-date a {
	color: inherit;
	text-decoration: none;
}

.ss-comment .wp-block-comment-reply-link a {
	font-weight: 600;
	font-size: 0.875rem;
}

.ss-comments .comment-reply-title {
	font-size: var(--wp--preset--font-size--x-large);
	margin-top: var(--wp--preset--spacing--50);
	font-weight: 400;
}

.ss-comments .comment-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.ss-comments .comment-form textarea {
	width: 100%;
	background: var(--ss-surface);
	border: 1px solid var(--ss-line);
	border-radius: var(--ss-r-s);
	padding: 0.75rem 0.9rem;
	font: inherit;
	color: var(--ss-ink);
}

.ss-comments .comment-form input:focus,
.ss-comments .comment-form textarea:focus {
	outline: none;
	border-color: var(--ss-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--ss-accent) 40%, transparent);
}

.ss-comments .comment-form label {
	display: block;
	font-weight: 600;
	font-size: 0.9375rem;
	margin-bottom: 0.35rem;
}

.ss-comments .comment-form .comment-form-cookies-consent label {
	display: inline;
	font-weight: 400;
}

.ss-comments .comment-form .submit {
	background: var(--ss-primary-dark);
	color: var(--ss-base);
	border: 0;
	border-radius: 999px;
	padding: 0.85rem 1.6rem;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.ss-comments .comment-form .submit:hover {
	background: var(--ss-paprika);
}

.ss-comments .comment-form-wprm-rating {
	--comment-rating-star-color: var(--ss-accent);
}

/* Relaterede */
.ss-related {
	background: var(--ss-surface);
	border-top: 1px solid var(--ss-line);
}

.ss-related > .ss-display {
	margin-bottom: var(--wp--preset--spacing--50) !important;
}

/* Sider */
.ss-page-head {
	padding-top: var(--wp--preset--spacing--60);
	padding-bottom: var(--wp--preset--spacing--40);
}

.ss-page-head .wp-block-post-title {
	font-weight: 360;
	margin: 0;
	font-size: clamp(2.75rem, 6vw, 5.5rem);
	line-height: 0.98;
	letter-spacing: -0.03em;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
}

.ss-page-image img {
	border-radius: var(--ss-r-l);
}

/* ------------------------------------------------------------------
 * Leksikon: sidetop farvet efter leksikon
 * ------------------------------------------------------------------ */

.ss-lex-hero {
	--lex-bg: var(--ss-primary-dark);
	--lex-fg: var(--ss-base);
	--lex-soft: color-mix(in srgb, var(--lex-fg) 80%, transparent);
	--lex-icon: var(--ss-icon-anis);
	background: var(--lex-bg);
	color: var(--lex-fg);
	padding-top: clamp(3rem, 7vw, 6rem);
	padding-bottom: clamp(3rem, 6vw, 5rem);
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.ssl-dict-safran .ss-lex-hero {
	--lex-bg: var(--ss-accent);
	--lex-fg: var(--ss-primary-dark);
	--lex-icon: var(--ss-icon-anis);
}

.ssl-dict-dild .ss-lex-hero {
	--lex-bg: var(--ss-dild);
	--lex-icon: var(--ss-icon-kvist);
}

.ssl-dict-paprika .ss-lex-hero {
	--lex-bg: var(--ss-paprika);
	--lex-icon: var(--ss-icon-hvidloeg);
}

.ssl-dict-petrol .ss-lex-hero {
	--lex-bg: var(--ss-primary);
	--lex-icon: var(--ss-icon-piskeris);
}

.ssl-dict-blomme .ss-lex-hero {
	--lex-bg: var(--ss-blomme);
	--lex-icon: var(--ss-icon-shaker);
}

/* Stort stregikon som vandmærke */
.ss-lex-hero::after {
	content: "";
	position: absolute;
	z-index: -1;
	right: max(-4rem, calc((100vw - 1240px) / 2 - 4rem));
	top: 50%;
	width: clamp(16rem, 38vw, 34rem);
	aspect-ratio: 1;
	transform: translateY(-50%) rotate(-10deg);
	background: var(--lex-fg);
	opacity: 0.16;
	-webkit-mask: var(--lex-icon) center / contain no-repeat;
	mask: var(--lex-icon) center / contain no-repeat;
}

.ss-lex-hero a {
	color: inherit;
}

.ss-lex-hero__inner > * + * {
	margin-top: 1.25rem;
}

.ss-lex-hero__title {
	margin: 0;
	color: inherit !important;
	font-size: clamp(3.25rem, 10vw, 10rem) !important;
	font-weight: 340 !important;
	line-height: 0.88;
	letter-spacing: -0.045em;
	font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144;
	max-width: 12ch;
}

.ss-lex-hero--entry .ss-lex-hero__title {
	font-size: clamp(3rem, 8.5vw, 8.5rem) !important;
}

.ss-lex-hero__lead,
.ss-lex-hero__lead p {
	max-width: 34em;
	font-size: var(--wp--preset--font-size--large);
	color: var(--lex-soft);
	margin-bottom: 0;
}

.ss-crumbs {
	gap: 0.4rem;
	font-size: 0.875rem;
	font-weight: 700;
	margin: 0;
}

.ss-crumbs > *,
.ss-crumbs p {
	margin: 0;
}

.ss-crumbs a {
	display: inline-block;
	text-decoration: none;
	border: 1px solid color-mix(in srgb, var(--lex-fg, currentColor) 40%, transparent);
	border-radius: 999px;
	padding: 0.35rem 0.8rem;
	transition: background var(--ss-ease);
}

.ss-crumbs a:hover {
	background: color-mix(in srgb, var(--lex-fg, currentColor) 12%, transparent);
}

.ss-crumbs .wp-block-post-terms__separator {
	display: none;
}

.ss-lex-types {
	padding-bottom: 0;
}

.ss-lex-types + .ss-lex-all {
	padding-top: var(--wp--preset--spacing--60);
}

.ss-lex-all > .ss-display,
.ss-lex-more > .ss-display {
	margin-bottom: var(--wp--preset--spacing--50) !important;
}

.ss-lex-more {
	background: var(--ss-surface);
	border-top: 1px solid var(--ss-line);
}

/* Opslag */
.ss-entry__cols {
	gap: clamp(2rem, 6vw, 6rem) !important;
	align-items: flex-start !important;
}

.ss-entry__content > p:first-child {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.55;
	margin-top: 0;
}

.ss-entry__content p {
	max-width: 38em;
}

@media (min-width: 782px) {
	.ss-entry__aside {
		position: sticky;
		top: 6.5rem;
	}
}

/* ------------------------------------------------------------------
 * Footer
 * Selektorerne starter med footer.ss-footer, så CSS fra andre plugins
 * (fx Elementors globale kit) ikke kan farve teksten mørk.
 * ------------------------------------------------------------------ */

footer.ss-footer {
	padding-top: clamp(3.5rem, 6vw, 5rem);
	padding-bottom: 1.5rem;
	margin-top: 0 !important;
	color: var(--ss-base);
	font-family: var(--ss-sans);
}

footer.ss-footer a {
	color: var(--ss-base);
	text-decoration: none;
	transition: color var(--ss-ease);
}

footer.ss-footer a:hover,
footer.ss-footer a:focus-visible {
	color: var(--ss-accent);
}

footer.ss-footer .ss-footer__cols {
	gap: clamp(2rem, 6vw, 6rem) !important;
	margin: 0;
}

footer.ss-footer .ss-footer__name {
	margin: 0 0 0.85rem;
	font-family: var(--ss-serif);
	font-size: 1.75rem;
	font-weight: 450;
	line-height: 1.1;
	letter-spacing: -0.015em;
	font-variation-settings: "opsz" 48, "SOFT" 60;
}

footer.ss-footer .ss-footer__name a {
	color: var(--ss-base);
}

footer.ss-footer .ss-footer__name a:hover {
	color: var(--ss-accent);
}

footer.ss-footer .ss-footer__lead {
	margin: 0 0 1.75rem;
	max-width: 32ch;
	font-size: 1rem;
	line-height: 1.6;
	color: color-mix(in srgb, var(--ss-base) 78%, transparent);
}

footer.ss-footer .ss-footer__search {
	max-width: 26rem;
}

footer.ss-footer .ss-footer__heading {
	margin: 0.5rem 0 1.15rem;
	font-family: var(--ss-sans);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.2;
	color: var(--ss-accent);
}

footer.ss-footer .ss-footer__nav,
footer.ss-footer .ss-footer__list {
	font-size: 1rem;
	font-weight: 400;
}

footer.ss-footer .ss-footer__nav a,
footer.ss-footer .ss-footer__list a {
	color: color-mix(in srgb, var(--ss-base) 88%, transparent);
}

footer.ss-footer .ss-footer__nav a:hover,
footer.ss-footer .ss-footer__list a:hover {
	color: var(--ss-accent);
}

footer.ss-footer .ss-footer__nav {
	margin: 0;
}

footer.ss-footer .ss-footer__nav a {
	padding: 0;
}

footer.ss-footer .ss-footer__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 0.6rem;
}

footer.ss-footer .ss-footer__list li {
	margin: 0;
}

footer.ss-footer .wp-block-search__inside-wrapper {
	background: color-mix(in srgb, var(--ss-base) 7%, transparent) !important;
	border-color: color-mix(in srgb, var(--ss-base) 22%, transparent) !important;
}

footer.ss-footer .wp-block-search__input {
	color: var(--ss-base) !important;
}

footer.ss-footer .wp-block-search__input::placeholder {
	color: color-mix(in srgb, var(--ss-base) 60%, transparent);
}

footer.ss-footer .wp-block-search__button {
	background: var(--ss-accent) !important;
	color: var(--ss-primary-dark) !important;
}

footer.ss-footer .wp-block-search__button:hover {
	background: var(--ss-base) !important;
}

footer.ss-footer .ss-footer__bottom {
	margin-top: clamp(3rem, 6vw, 4.5rem) !important;
	padding-top: 1.5rem;
	gap: 0.75rem 2rem;
	border-top: 1px solid color-mix(in srgb, var(--ss-base) 18%, transparent);
	font-size: 0.875rem;
	color: color-mix(in srgb, var(--ss-base) 72%, transparent);
}

footer.ss-footer .ss-footer__bottom p {
	margin: 0;
	color: inherit;
}

footer.ss-footer .ss-footer__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
}

footer.ss-footer .ss-footer__meta a {
	color: color-mix(in srgb, var(--ss-base) 85%, transparent);
}

footer.ss-footer .ss-footer__meta a:hover {
	color: var(--ss-accent);
	text-decoration-color: currentColor;
}

@media (max-width: 781px) {
	footer.ss-footer .ss-footer__cols {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		gap: 2.5rem 1.5rem !important;
	}

	footer.ss-footer .ss-footer__intro {
		grid-column: 1 / -1;
	}
}

.wp-site-blocks > footer,
.wp-site-blocks > .wp-block-template-part:last-child {
	margin-block-start: 0;
}

/* ------------------------------------------------------------------
 * WP Recipe Maker: placering og "Gå til opskrift"-knapper.
 * Selve opskriftskortet styles i wprm-templates/recipe/smagssansen.
 * ------------------------------------------------------------------ */

.ss-content > .wprm-recipe-container,
.ss-content > .wp-block-wp-recipe-maker-recipe {
	max-width: min(1120px, 100%) !important;
	margin-top: var(--wp--preset--spacing--60) !important;
	margin-bottom: var(--wp--preset--spacing--60) !important;
	scroll-margin-top: 6rem;
}

.ss-content > .wprm-recipe-snippet {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
}

.wprm-recipe-snippet .wprm-recipe-link {
	display: inline-flex !important;
	align-items: center;
	gap: 0.45rem;
	margin: 0 !important;
	background: var(--ss-surface) !important;
	color: var(--ss-primary-dark) !important;
	border: 1px solid var(--ss-line) !important;
	border-radius: 999px !important;
	padding: 0.6rem 1.15rem !important;
	font-weight: 700;
	font-size: 0.9375rem;
	text-decoration: none !important;
	transition: border-color var(--ss-ease), background var(--ss-ease);
}

.wprm-recipe-snippet .wprm-recipe-link:first-child {
	background: var(--ss-accent) !important;
	border-color: var(--ss-accent) !important;
}

.wprm-recipe-snippet .wprm-recipe-link:hover {
	border-color: var(--ss-primary-dark) !important;
}

.wprm-recipe-snippet .wprm-recipe-link svg,
.wprm-recipe-snippet .wprm-recipe-link svg * {
	fill: currentColor !important;
}

/* ------------------------------------------------------------------
 * Samtykkeboks
 * ------------------------------------------------------------------ */

.ss-consent {
	position: fixed;
	z-index: 100;
	left: 1rem;
	right: 1rem;
	bottom: 1rem;
	max-width: 27rem;
	background: var(--ss-primary-dark);
	color: var(--ss-base);
	border-radius: 22px;
	padding: 1.4rem 1.5rem 1.5rem;
	box-shadow: 0 30px 60px -20px rgba(8, 28, 34, 0.55);
}

.ss-consent[hidden] {
	display: none;
}

.ss-consent__title {
	font-family: var(--ss-serif);
	font-size: 1.5rem;
	font-style: italic;
	font-weight: 450;
	margin: 0 0 0.4rem;
	font-variation-settings: "SOFT" 100, "WONK" 1;
}

.ss-consent__text {
	font-size: 0.9375rem;
	line-height: 1.5;
	margin: 0 0 1.1rem;
	color: color-mix(in srgb, var(--ss-base) 85%, transparent);
}

.ss-consent__actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.5rem;
}

.ss-consent__btn {
	font: inherit;
	font-weight: 700;
	font-size: 0.9375rem;
	padding: 0.75rem 1rem;
	border-radius: 999px;
	border: 1px solid var(--ss-base);
	background: var(--ss-base);
	color: var(--ss-primary-dark);
	cursor: pointer;
}

.ss-consent__btn:hover {
	background: var(--ss-accent);
	border-color: var(--ss-accent);
}

/* ------------------------------------------------------------------
 * Mobil, bevægelse og print
 * ------------------------------------------------------------------ */

@media (max-width: 781px) {
	.ss-header__logo img {
		max-height: 52px;
	}

	.ss-header__cta {
		display: none !important;
	}

	.ss-section__head,
	.ss-lex-promo__head {
		border-bottom-width: 1px;
	}
}

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

	.ss-card:hover .ss-card__image img {
		transform: none;
	}
}

@media print {
	.ss-header,
	.ss-footer,
	.ss-related,
	.ss-comments,
	.ss-consent,
	.wprm-recipe-snippet {
		display: none !important;
	}
}

/* Uden billede: titlen må ikke løbe hele vejen over skærmen */
body.ss-uden-billede .ss-recipe-hero__title {
	max-width: 16ch;
}
