/* LBS Foundation 0.4.2. Made by bin/look-sync.sh: do not edit; this app's own rules are in css/booking.css. */

/* ── @font-face, from theme.json ── */
@font-face { font-family: DINish; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/DINish-Regular.woff2") format("woff2"); }
@font-face { font-family: DINish; font-style: italic; font-weight: 400; font-display: swap; src: url("fonts/DINish-Italic.woff2") format("woff2"); }
@font-face { font-family: DINish; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/DINish-Medium.woff2") format("woff2"); }
@font-face { font-family: DINish; font-style: italic; font-weight: 500; font-display: swap; src: url("fonts/DINish-MediumItalic.woff2") format("woff2"); }
@font-face { font-family: DINish; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/DINish-SemiBold.woff2") format("woff2"); }
@font-face { font-family: DINish; font-style: italic; font-weight: 600; font-display: swap; src: url("fonts/DINish-SemiBoldItalic.woff2") format("woff2"); }
@font-face { font-family: DINish; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/DINish-Bold.woff2") format("woff2"); }
@font-face { font-family: DINish; font-style: italic; font-weight: 700; font-display: swap; src: url("fonts/DINish-BoldItalic.woff2") format("woff2"); }

/* ── fonts.css ── */
/* Fallback fonts fitted to DINish.

   While DINish is loading, or if it never loads, the browser uses the next font in the theme's list
   (theme.json, fontFamilies): Roboto (Android, and anyone who has installed it), then Arial. Both are
   wider than DINish; these rules resize them to DINish's letter widths and give them its line metrics,
   so that lines break in the same places and the page does not jump when DINish arrives. They use fonts
   already on the visitor's device (local()); nothing is downloaded.

   The values are measurements of the font files, not design choices, which is why they live here and
   not in theme.json (WordPress's font-face output cannot write local() either). They are generated: run
   tools/font-fallback.js --write again whenever the DINish files change. Italics are slanted by the
   browser from these upright faces. */

/* BEGIN generated by tools/font-fallback.js */
@font-face {
	font-family: DINish-fallback-Roboto;
	src: local("Roboto"), local("Roboto Regular"), local("Roboto-Regular");
	font-weight: 400;
	size-adjust: 92.15%;
	ascent-override: 111.23%;
	descent-override: 26.26%;
	line-gap-override: 0%;
}
@font-face {
	font-family: DINish-fallback-Roboto;
	src: local("Roboto Medium"), local("Roboto-Medium");
	font-weight: 500;
	size-adjust: 92.00%;
	ascent-override: 111.42%;
	descent-override: 26.31%;
	line-gap-override: 0%;
}
@font-face {
	font-family: DINish-fallback-Roboto;
	src: local("Roboto Bold"), local("Roboto-Bold");
	font-weight: 700;
	size-adjust: 92.59%;
	ascent-override: 110.70%;
	descent-override: 26.14%;
	line-gap-override: 0%;
}
@font-face {
	font-family: DINish-fallback-Arial;
	src: local("Arial"), local("ArialMT"), local("Liberation Sans"), local("LiberationSans");
	font-weight: 400;
	size-adjust: 92.14%;
	ascent-override: 111.24%;
	descent-override: 26.26%;
	line-gap-override: 0%;
}
@font-face {
	font-family: DINish-fallback-Arial;
	src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"), local("LiberationSans-Bold");
	font-weight: 700;
	size-adjust: 87.29%;
	ascent-override: 117.42%;
	descent-override: 27.72%;
	line-gap-override: 0%;
}
/* END generated */


/* ── WordPress's values, wp_get_global_stylesheet() ── */
:root{--wp--preset--aspect-ratio--square: 1;--wp--preset--aspect-ratio--4-3: 4/3;--wp--preset--aspect-ratio--3-4: 3/4;--wp--preset--aspect-ratio--3-2: 3/2;--wp--preset--aspect-ratio--2-3: 2/3;--wp--preset--aspect-ratio--16-9: 16/9;--wp--preset--aspect-ratio--9-16: 9/16;--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--color--ink: #000000;--wp--preset--color--accent: #c2002d;--wp--preset--color--accent-dark: #9c0024;--wp--preset--color--muted: #4b4b4b;--wp--preset--color--panel: #f9f9f9;--wp--preset--color--hairline: #e2e2e2;--wp--preset--color--border-soft: #e2e2e2;--wp--preset--color--border-strong: #595959;--wp--preset--color--dark: #171717;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgb(6,147,227) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgb(252,185,0) 0%,rgb(255,105,0) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgb(255,105,0) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.682), 20px);--wp--preset--font-size--large: clamp(22.041px, 1.378rem + ((1vw - 3.2px) * 1.586), 36px);--wp--preset--font-size--x-large: clamp(25.014px, 1.563rem + ((1vw - 3.2px) * 1.93), 42px);--wp--preset--font-size--xs: 0.875rem;--wp--preset--font-size--sm: 1rem;--wp--preset--font-size--md: 1.125rem;--wp--preset--font-size--lg: clamp(1.25rem, 1.25rem + ((1vw - 0.2rem) * 0.227), 1.375rem);--wp--preset--font-size--xl: clamp(1.5rem, 1.5rem + ((1vw - 0.2rem) * 0.455), 1.75rem);--wp--preset--font-size--2-xl: clamp(1.875rem, 1.875rem + ((1vw - 0.2rem) * 1.136), 2.5rem);--wp--preset--font-size--3-xl: clamp(2.25rem, 2.25rem + ((1vw - 0.2rem) * 1.364), 3rem);--wp--preset--font-family--dinish: "DINish", DINish-fallback-Roboto, DINish-fallback-Arial, Arial, sans-serif;--wp--preset--spacing--20: 0.5rem;--wp--preset--spacing--30: 0.75rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2rem;--wp--preset--spacing--70: 3rem;--wp--preset--spacing--80: 4rem;--wp--preset--spacing--10: 0.25rem;--wp--preset--spacing--90: 5.5rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgb(255, 255, 255), 6px 6px rgb(0, 0, 0);--wp--preset--shadow--crisp: 6px 6px 0px rgb(0, 0, 0);--wp--custom--lbs--gutter: 24px;--wp--custom--lbs--gutter-compact: 16px;--wp--custom--lbs--content-doc: 47.5rem;--wp--custom--lbs--line-height--body: 1.5556;--wp--custom--lbs--line-height--heading: 1.2;--wp--custom--lbs--line-height--tight: 1.25;--wp--custom--lbs--line-height--lead: 1.45;--wp--custom--lbs--line-height--ui: 1.5;--wp--custom--lbs--rule--width: 37px;--wp--custom--lbs--rule--height: 3px;--wp--custom--lbs--nav-underline: 4px;--wp--custom--lbs--footer-bar: 28px;--wp--custom--lbs--focus-ring: 3px;--wp--custom--lbs--target--min: 44px;--wp--custom--lbs--target--small: 24px;--wp--custom--lbs--search-width: 690px;--wp--custom--lbs--transition: 0.15s ease;--wp--custom--lbs--radius--control: 6px;--wp--custom--lbs--radius--pill: 999px;--wp--custom--lbs--drawer: 25rem;--wp--custom--lbs--color--focus: #1a4d8f;--wp--custom--lbs--color--success: #146b3a;--wp--custom--lbs--color--success-surface: #edf5f0;--wp--custom--lbs--color--warning: #8a5700;--wp--custom--lbs--color--warning-surface: #fbf4e6;--wp--custom--lbs--color--error: #6b1e5b;--wp--custom--lbs--color--error-surface: #f8eef5;--wp--custom--lbs--color--disabled-text: #666666;--wp--custom--lbs--color--disabled-surface: #f2f2f2;--wp--custom--lbs--color--scrim: rgb(0 0 0 / 0.28);--wp--custom--lbs--icon--size: 1.9em;--wp--custom--lbs--logo--height: 5rem;}.wp-block-button{--wp--preset--dimension--25: 25%;--wp--preset--dimension--50: 50%;--wp--preset--dimension--75: 75%;--wp--preset--dimension--100: 100%;}:root { --wp--style--global--content-size: 37.65rem;--wp--style--global--wide-size: 1140px; }:where(body) { margin: 0; }.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }.wp-site-blocks > .alignright { float: right; margin-left: 2em; }.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }:where(.wp-site-blocks) > * { margin-block-start: var(--wp--preset--spacing--50); margin-block-end: 0; }:where(.wp-site-blocks) > :first-child { margin-block-start: 0; }:where(.wp-site-blocks) > :last-child { margin-block-end: 0; }:root { --wp--style--block-gap: var(--wp--preset--spacing--50); }:root :where(.is-layout-flow) > :first-child{margin-block-start: 0;}:root :where(.is-layout-flow) > :last-child{margin-block-end: 0;}:root :where(.is-layout-flow) > *{margin-block-start: var(--wp--preset--spacing--50);margin-block-end: 0;}:root :where(.is-layout-constrained) > :first-child{margin-block-start: 0;}:root :where(.is-layout-constrained) > :last-child{margin-block-end: 0;}:root :where(.is-layout-constrained) > *{margin-block-start: var(--wp--preset--spacing--50);margin-block-end: 0;}:root :where(.is-layout-flex){gap: var(--wp--preset--spacing--50);}:root :where(.is-layout-grid){gap: var(--wp--preset--spacing--50);}.is-layout-flow > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}.is-layout-flow > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}.is-layout-flow > .aligncenter{margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}.is-layout-constrained > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}.is-layout-constrained > .aligncenter{margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width: var(--wp--style--global--content-size);margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > .alignwide{max-width: var(--wp--style--global--wide-size);}body .is-layout-flex{display: flex;}.is-layout-flex{flex-wrap: wrap;align-items: center;}.is-layout-flex > :is(*, div){margin: 0;}body .is-layout-grid{display: grid;}.is-layout-grid > :is(*, div){margin: 0;}body{background-color: var(--wp--preset--color--white);color: var(--wp--preset--color--ink);font-family: var(--wp--preset--font-family--dinish);font-size: var(--wp--preset--font-size--md);line-height: 1.5556;padding-top: 0px;padding-right: 0px;padding-bottom: 0px;padding-left: 0px;}:root :where(.wp-element-button, .wp-block-button__link){background-color: var(--wp--preset--color--accent);border-radius: var(--wp--custom--lbs--radius--control);border-color: var(--wp--preset--color--accent);border-width: 2px;border-style: solid;color: var(--wp--preset--color--white);font-family: inherit;font-size: var(--wp--preset--font-size--sm);font-style: inherit;font-weight: 700;letter-spacing: inherit;line-height: var(--wp--custom--lbs--line-height--ui);padding-top: var(--wp--preset--spacing--20);padding-right: var(--wp--preset--spacing--40);padding-bottom: var(--wp--preset--spacing--20);padding-left: var(--wp--preset--spacing--40);text-decoration: none;text-transform: inherit;}:root :where(.wp-element-button:hover, .wp-block-button__link:hover){background-color: var(--wp--preset--color--accent-dark);border-color: var(--wp--preset--color--accent-dark);color: var(--wp--preset--color--white);}:root :where(.wp-element-button:focus, .wp-block-button__link:focus){background-color: var(--wp--preset--color--accent-dark);border-color: var(--wp--preset--color--accent-dark);color: var(--wp--preset--color--white);}:root :where(.wp-block-icon svg){color: var(--wp--preset--color--accent);width: var(--wp--custom--lbs--icon--size);}:root :where(.wp-block-pullquote){font-size: clamp(0.984em, 0.984rem + ((1vw - 0.2em) * 0.938), 1.5em);line-height: 1.6;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-ink-color{color: var(--wp--preset--color--ink) !important;}.has-accent-color{color: var(--wp--preset--color--accent) !important;}.has-accent-dark-color{color: var(--wp--preset--color--accent-dark) !important;}.has-muted-color{color: var(--wp--preset--color--muted) !important;}.has-panel-color{color: var(--wp--preset--color--panel) !important;}.has-hairline-color{color: var(--wp--preset--color--hairline) !important;}.has-border-soft-color{color: var(--wp--preset--color--border-soft) !important;}.has-border-strong-color{color: var(--wp--preset--color--border-strong) !important;}.has-dark-color{color: var(--wp--preset--color--dark) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-ink-background-color{background-color: var(--wp--preset--color--ink) !important;}.has-accent-background-color{background-color: var(--wp--preset--color--accent) !important;}.has-accent-dark-background-color{background-color: var(--wp--preset--color--accent-dark) !important;}.has-muted-background-color{background-color: var(--wp--preset--color--muted) !important;}.has-panel-background-color{background-color: var(--wp--preset--color--panel) !important;}.has-hairline-background-color{background-color: var(--wp--preset--color--hairline) !important;}.has-border-soft-background-color{background-color: var(--wp--preset--color--border-soft) !important;}.has-border-strong-background-color{background-color: var(--wp--preset--color--border-strong) !important;}.has-dark-background-color{background-color: var(--wp--preset--color--dark) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-ink-border-color{border-color: var(--wp--preset--color--ink) !important;}.has-accent-border-color{border-color: var(--wp--preset--color--accent) !important;}.has-accent-dark-border-color{border-color: var(--wp--preset--color--accent-dark) !important;}.has-muted-border-color{border-color: var(--wp--preset--color--muted) !important;}.has-panel-border-color{border-color: var(--wp--preset--color--panel) !important;}.has-hairline-border-color{border-color: var(--wp--preset--color--hairline) !important;}.has-border-soft-border-color{border-color: var(--wp--preset--color--border-soft) !important;}.has-border-strong-border-color{border-color: var(--wp--preset--color--border-strong) !important;}.has-dark-border-color{border-color: var(--wp--preset--color--dark) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;}.has-xs-font-size{font-size: var(--wp--preset--font-size--xs) !important;}.has-sm-font-size{font-size: var(--wp--preset--font-size--sm) !important;}.has-md-font-size{font-size: var(--wp--preset--font-size--md) !important;}.has-lg-font-size{font-size: var(--wp--preset--font-size--lg) !important;}.has-xl-font-size{font-size: var(--wp--preset--font-size--xl) !important;}.has-2-xl-font-size{font-size: var(--wp--preset--font-size--2-xl) !important;}.has-3-xl-font-size{font-size: var(--wp--preset--font-size--3-xl) !important;}.has-dinish-font-family{font-family: var(--wp--preset--font-family--dinish) !important;}

/* ── tokens.css ── */
/* ═══════════════════════════════════════════════════════════════════════════
   LBS design tokens: an ALIAS LAYER ONLY.

   The values live in theme.json (the single source of truth); WordPress turns them into
   --wp--preset--* and --wp--custom--* custom properties on every page and in the block editor.
   This file gives them short names. No literal value belongs here, and every other stylesheet
   uses only --lbs-* names.

   The --lbs-* namespace is reserved for the theme. Do not create Elementor (V4) variables whose
   label starts with "lbs-": Elementor turns a variable's label into a CSS property on :root.

   CANONICAL BREAKPOINTS: 576px · 768px · 992px · 1200px. Custom properties cannot be used in
   @media conditions, so these four literals (and their max-width forms 575.98 / 767.98 / 991.98 /
   1199.98) are the only widths allowed in media queries anywhere in the theme.
   ═══════════════════════════════════════════════════════════════════════════ */

:root,
.editor-styles-wrapper {
	/* Colour */
	/* The slugs "ink" and "hairline", not "text" and "border": WordPress marks every block with a picked text
	   or border colour with the classes has-text-color / has-border-color, the very classes a slug "text" or
	   "border" generates for its own colour, which then overrode every picked colour (KNOWN_ISSUES 3, fixed
	   2026-10-01). Never name a palette colour text, border or link. */
	--lbs-text: var(--wp--preset--color--ink);
	--lbs-red: var(--wp--preset--color--accent);
	--lbs-red-dark: var(--wp--preset--color--accent-dark);
	--lbs-muted: var(--wp--preset--color--muted);
	--lbs-panel: var(--wp--preset--color--panel);
	--lbs-border: var(--wp--preset--color--hairline);             /* hairlines, dividers */
	--lbs-border-soft: var(--wp--preset--color--border-soft);     /* decorative box borders */
	--lbs-border-strong: var(--wp--preset--color--border-strong); /* form controls: 3:1 on white */
	--lbs-dark: var(--wp--preset--color--dark);
	--lbs-white: var(--wp--preset--color--white);

	/* Type */
	--lbs-font: var(--wp--preset--font-family--dinish);
	--lbs-fs-xs: var(--wp--preset--font-size--xs);
	--lbs-fs-sm: var(--wp--preset--font-size--sm);
	--lbs-fs-md: var(--wp--preset--font-size--md);
	--lbs-fs-lg: var(--wp--preset--font-size--lg);
	--lbs-fs-xl: var(--wp--preset--font-size--xl);
	--lbs-fs-2xl: var(--wp--preset--font-size--2-xl);
	--lbs-fs-3xl: var(--wp--preset--font-size--3-xl);
	--lbs-lh-body: var(--wp--custom--lbs--line-height--body);
	--lbs-lh-heading: var(--wp--custom--lbs--line-height--heading);
	--lbs-lh-tight: var(--wp--custom--lbs--line-height--tight);
	--lbs-lh-lead: var(--wp--custom--lbs--line-height--lead);
	--lbs-lh-ui: var(--wp--custom--lbs--line-height--ui);   /* header, menus: 16px text on 24px lines */

	/* Space */
	--lbs-space-1: var(--wp--preset--spacing--10);
	--lbs-space-2: var(--wp--preset--spacing--20);
	--lbs-space-3: var(--wp--preset--spacing--30);
	--lbs-space-4: var(--wp--preset--spacing--40);
	--lbs-space-5: var(--wp--preset--spacing--50);
	--lbs-space-6: var(--wp--preset--spacing--60);
	--lbs-space-7: var(--wp--preset--spacing--70);
	--lbs-space-8: var(--wp--preset--spacing--80);
	--lbs-space-9: var(--wp--preset--spacing--90);

	/* Layout. The page grows with the window up to the wide width plus its side margins (layout.css);
	   the side margin drops to the compact value below 576px. */
	--lbs-gutter: var(--wp--custom--lbs--gutter);
	--lbs-gutter-compact: var(--wp--custom--lbs--gutter-compact);
	--lbs-content: var(--wp--style--global--content-size);
	--lbs-wide: var(--wp--style--global--wide-size);
	--lbs-search-width: var(--wp--custom--lbs--search-width);

	/* Brand details */
	--lbs-rule-w: var(--wp--custom--lbs--rule--width);
	--lbs-rule-h: var(--wp--custom--lbs--rule--height);
	--lbs-nav-underline: var(--wp--custom--lbs--nav-underline);
	--lbs-footer-bar: var(--wp--custom--lbs--footer-bar);
	--lbs-focus-ring: var(--wp--custom--lbs--focus-ring);
	--lbs-target: var(--wp--custom--lbs--target--min);          /* buttons, fields, menu items: 44 x 44 */
	--lbs-target-small: var(--wp--custom--lbs--target--small);  /* links in dense lists: 24px tall */
	--lbs-icon-size: var(--wp--custom--lbs--icon--size);
	--lbs-logo-height: var(--wp--custom--lbs--logo--height);  /* the "Logo" image style */
	--lbs-transition: var(--wp--custom--lbs--transition);

	/* Corners: square for content, rounded for what you operate (buttons, fields, drop-downs), fully
	   round only for the hero search box (signature picture, picture strip: forms.css; Kristinn, 2026-10-15). */
	--lbs-radius-control: var(--wp--custom--lbs--radius--control);
	--lbs-radius-pill: var(--wp--custom--lbs--radius--pill);

	/* Focus ring and states. Kept out of the editors' colour palette on purpose: they mean something. */
	--lbs-focus: var(--wp--custom--lbs--color--focus);
	--lbs-success: var(--wp--custom--lbs--color--success);
	--lbs-success-surface: var(--wp--custom--lbs--color--success-surface);
	--lbs-warning: var(--wp--custom--lbs--color--warning);
	--lbs-warning-surface: var(--wp--custom--lbs--color--warning-surface);
	--lbs-error: var(--wp--custom--lbs--color--error);
	--lbs-error-surface: var(--wp--custom--lbs--color--error-surface);
	--lbs-disabled-text: var(--wp--custom--lbs--color--disabled-text);
	--lbs-disabled-surface: var(--wp--custom--lbs--color--disabled-surface);
	--lbs-scrim: var(--wp--custom--lbs--color--scrim);              /* dims the page behind the open drawer */
	--lbs-drawer-width: var(--wp--custom--lbs--drawer);
}


/* ── base.css ── */
/* Base: reset and element typography.
   Everything here is a bare element selector (specificity 0,0,1) so that any class, including
   Elementor's and the block library's, wins without a fight. */

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

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-padding-top: var(--lbs-space-6);
}

body {
	margin: 0;
	font-family: var(--lbs-font);
	font-size: var(--lbs-fs-md);
	font-weight: 400;
	line-height: var(--lbs-lh-body);
	color: var(--lbs-text);
	background: var(--lbs-white);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-wrap: break-word;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 var(--lbs-space-2);
	font-weight: 700;
	line-height: var(--lbs-lh-heading);
	/* Icelandic compounds are long; lang="is" on <html> makes this work. */
	hyphens: auto;
	text-wrap: balance;
}
h1 { font-size: var(--lbs-fs-2xl); }
h2 { font-size: var(--lbs-fs-xl); }
h3 { font-size: var(--lbs-fs-lg); }
h4, h5, h6 { font-size: var(--lbs-fs-md); }
/* From 576px only words of 12 letters or more are split (5 letters before the hyphen, 4 after: "Handrita-safn"):
   with text-wrap: balance the browser would otherwise split a shorter word ("manu-script") to even out the lines,
   though it fits whole on the next line. Safari has only the older -webkit- pair, without the word length; 5 and 4
   keep "manuscript" whole there too. Phones keep full hyphenation: at 200% text an ordinary word ("Námsmenn") is
   wider than the column and would otherwise be broken at any letter, without a hyphen. */
@media (min-width: 576px) {
	h1, h2, h3, h4, h5, h6 {
		hyphenate-limit-chars: 12 5 4;
		-webkit-hyphenate-limit-before: 5;
		-webkit-hyphenate-limit-after: 4;
	}
}

p, ul, ol, dl, blockquote, pre, table, figure, address, details { margin: 0 0 var(--lbs-space-4); }
ul, ol { padding-left: var(--lbs-space-5); }
li > ul, li > ol { margin-bottom: 0; }
dt { font-weight: 700; }
dd { margin: 0 0 var(--lbs-space-2); }
address { font-style: normal; }

/* Links in the chrome are plain and turn red on hover (the house style). Links inside running
   text are underlined as well: see content.css. A link that WordPress draws as a button (the Button
   block, the File block's download button: class wp-element-button, or only wp-block-button__link in
   Button blocks saved before WordPress 6.1) is left to the button's own hover colours from theme.json,
   which WordPress writes as ":root :where(...)", lighter than "a:hover": this rule beat them and turned
   the text red on the dark red hover ground. :where keeps this rule's weight as it was. */
a {
	color: inherit;
	text-decoration: none;
	transition: color var(--lbs-transition);
}
a:where(:not(.wp-element-button, .wp-block-button__link)):hover { color: var(--lbs-red); }

b, strong { font-weight: 700; }
small { font-size: var(--lbs-fs-xs); }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
abbr[title] { text-decoration: underline dotted; cursor: help; }
mark { background: none; color: var(--lbs-red); font-weight: 700; }
hr { border: 0; border-top: 1px solid var(--lbs-border); margin: var(--lbs-space-6) 0; }

img, svg, video, canvas, iframe, embed, object { max-width: 100%; }
img, video { height: auto; }
img { vertical-align: middle; border-style: none; }
figure { margin-left: 0; margin-right: 0; }

code, kbd, samp, pre {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
	font-size: 0.9em;
}
pre {
	overflow: auto;
	padding: var(--lbs-space-4);
	background: var(--lbs-panel);
	border: 1px solid var(--lbs-border);
}

table { border-collapse: collapse; width: 100%; }
th { text-align: left; font-weight: 700; }

/* Without weight (":where"), so that any rule for a control, however light, outweighs it. */
:where(button, input, select, textarea) {
	font: inherit;
	color: inherit;
	margin: 0;
}
button, [type="button"], [type="submit"], [type="reset"] { cursor: pointer; }
[hidden] { display: none !important; }

/* Focus: always visible, never removed. Blue, so it never reads as a hover or "current page" mark
   (both red); white on red and dark surfaces, where blue would not show. */
:focus-visible {
	outline: var(--lbs-focus-ring) solid var(--lbs-focus);
	outline-offset: 2px;
}
:is(.has-accent-background-color, .has-accent-dark-background-color, .has-dark-background-color) :focus-visible { outline-color: var(--lbs-white); }

@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;
	}
}


/* ── layout.css ── */
/* Layout: the container and the page skeleton.
   Breakpoints (the only ones allowed): 576 · 768 · 992 · 1200. */

/* The container grows with the window up to the wide width (theme.json wideSize, 1140px) plus a side
   margin on each side; the margin is smaller on phones. */
@media (max-width: 575.98px) { :root { --lbs-gutter: var(--lbs-gutter-compact); } }
.lbs-container {
	width: 100%;
	max-width: calc(var(--lbs-wide) + 2 * var(--lbs-gutter));
	margin-inline: auto;
	padding-inline: var(--lbs-gutter);
}

/* The container's content width, for layouts that are not inside a .lbs-container but must line up
   with the header (the full-width template, the signature picture). "100%" is the width of whatever
   uses it, so it works anywhere that spans the screen. */
:root { --lbs-container-inner: min(var(--lbs-wide), 100% - 2 * var(--lbs-gutter)); }

/* Sticky footer: short pages still push the red bar to the bottom of the window. */
body {
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
}
.lbs-main { flex: 1 0 auto; padding-block: var(--lbs-space-7) 0; }
.lbs-footer { flex-shrink: 0; }
@media (max-width: 767.98px) { .lbs-main { padding-top: var(--lbs-space-5); } }

/* Full-width mains (Elementor's page templates, the theme's own full-width template): no padding,
   the page body decides everything. */
.lbs-main--full { padding-block: 0; }

.lbs-page-header { margin-bottom: var(--lbs-space-6); }
.lbs-page-title { margin-bottom: var(--lbs-space-5); }

/* The reading column. Width is set per child rather than on a wrapper, so that wide and full
   blocks (and Elementor's single root element) can use the whole container. lbs-core's feature band
   (a shortcode in a block page, as on hallgrimurpetursson.is) reaches the screen edges by itself. */
.entry-content > :where(:not(.alignwide, .alignfull, .alignleft, .alignright, .elementor, .lbs-feature-band)),
.lbs-entry__header,
.lbs-entry__thumbnail,
.lbs-entry__footer {
	max-width: var(--lbs-content);
	margin-inline: auto;
}
/* "Wide title" in the LBS layout box: the title spans the wide width, like a wide block. */
.lbs-entry--wide-title > .lbs-entry__header { max-width: var(--lbs-wide); }
/* Floated items start at the edge of the reading column, not of the wide container, so the text
   beside them wraps. That margin is measured from the container's edge only when nothing stands
   beside the item: a second narrow picture on the same side that fits next to the first would get
   it from the first and land outside the column (often on the far side). So each starts below the
   one before it on its side (the clear); a left and a right picture still stand level. Also covers
   the full-width template (.entry-content.lbs-full) below. */
.entry-content > .alignleft { margin-left: max(0px, calc((100% - var(--lbs-content)) / 2)); clear: left; }
.entry-content > .alignright { margin-right: max(0px, calc((100% - var(--lbs-content)) / 2)); clear: right; }
/* Rows of tiles, book tiles, banners, cards and posts are laid out across the whole container, like wide blocks. */
.entry-content > :is(.lbs-tiles, .lbs-tile-wide, .lbs-books, .lbs-banners, .lbs-card-list, .lbs-post-list) { max-width: var(--lbs-wide); }
.entry-content > .alignwide { max-width: var(--lbs-wide); margin-inline: auto; }
/* The full-width template has no container around the page body, so its blocks are held to the
   header's content width themselves and line up with the logo at every breakpoint, as in the normal
   template (full-width blocks and Elementor's root still reach the edges). */
.lbs-full > :where(:not(.alignwide, .alignfull, .alignleft, .alignright, .elementor, .lbs-feature-band)) { max-width: min(var(--lbs-content), var(--lbs-container-inner)); }
.lbs-full > :is(.alignwide, .lbs-tiles, .lbs-tile-wide, .lbs-books, .lbs-banners, .lbs-card-list, .lbs-post-list) { max-width: min(var(--lbs-wide), var(--lbs-container-inner)); }
.lbs-full > .alignleft { margin-left: max(0px, calc((100% - min(var(--lbs-content), var(--lbs-container-inner))) / 2)); }
.lbs-full > .alignright { margin-right: max(0px, calc((100% - min(var(--lbs-content), var(--lbs-container-inner))) / 2)); }
/* The feature band in a page body (Elementor places it with its own spacing): clear of the blocks above
   and below (blocks space themselves with bottom margins; the footer has its own space above it). */
.entry-content > .lbs-feature-band { margin-top: var(--lbs-space-8); }
.entry-content > .lbs-feature-band:not(:last-child) { margin-bottom: var(--lbs-space-8); }
.entry-content > .alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
}
/* 100vw includes a classic scrollbar (Windows, most Linux desktops), so an element breaking out to the
   screen edges is a few pixels wider than the page and would make it scroll sideways. Clip that on
   pages that have one; "clip" (not "hidden") leaves sticky elements working. */
html:has(.alignfull, .lbs-signature, .lbs-feature-band) { overflow-x: clip; }

/* Section menu beside the content: a sticky column at 992px and up, the tree above the content
   (as a closed disclosure) below it. The reading-column rules above keep working inside the main
   column unchanged. */
.lbs-with-section-menu__main { min-width: 0; }
/* Beside the section menu (992px and up) the main column is not centred on the screen, so the band's
   breakout (100vw from the column's middle) would sit off-centre: there it spans the main column (Fable). */
@media (min-width: 992px) {
	.lbs-with-section-menu__main .entry-content > .lbs-feature-band { width: auto; margin-inline: 0; }
}
@media (min-width: 992px) {
	.lbs-with-section-menu {
		display: grid;
		grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
		gap: var(--lbs-space-6);
		align-items: start;
	}
}


/* ── header.css ── */
/* The institutional header (Vefstaðall 7.1, Kristinn's choices of 2026-10-01).

   One row at every width: the brand on the left (as before, logos unchanged), then the tools: the
   optional search box, the language link and the menu button. All navigation is in the drawer the
   button opens. The row never wraps: when the tools run short of room the search box gives way, then
   the language link, then the button's word (container queries below); what gives way is in the drawer.

   z-index ledger: header 140 · language list 150. The drawer is a popover, above everything. */

.lbs-header {
	position: relative;
	z-index: 140;
	font-size: var(--lbs-fs-sm);
	line-height: var(--lbs-lh-ui);
	background: var(--lbs-white);
	border-bottom: 1px solid var(--lbs-border);
}
.lbs-header__inner {
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--lbs-space-4);
}

/* Brand ---------------------------------------------------------------- */
/* 20px above and below the 48px logos: an 88px row. The brand keeps its width and gives way only when
   even the menu button alone would not fit (the logo beside the wordmark then shrinks, as before). */
.lbs-brand { flex: 0 1 auto; min-width: 0; margin: 20px 0; }
.lbs-brand__link { display: flex; align-items: flex-end; gap: 9px; color: var(--lbs-text); }
.lbs-brand__link:hover { color: var(--lbs-text); }
.lbs-brand__mark { width: auto; height: 48px; color: var(--lbs-red); flex: none; }
.lbs-brand__name {
	font-size: 1.625rem;
	line-height: calc(40 / 26); /* 40px at 26px, as a proportion so it grows with the text */
	font-weight: 500;
	white-space: nowrap;
}
/* Customizer option for long names: two lines set like the library's own wordmark, the second line
   resting on the bottom of the mark's bar (8px above the tip of its tail). 2 x 22 + 4 = the mark's 48px. */
.lbs-brand__name--two-lines { font-size: 1.1875rem; line-height: calc(22 / 19); padding-bottom: 4px; }
.lbs-brand__line { display: block; }
.lbs-brand__wordmark,
.lbs-brand .custom-logo { display: block; width: auto; height: 48px; max-width: none; }
/* Wordmark + the site's own logo or its name, side by side with a hairline between them. */
.lbs-brand--wordmark-custom,
.lbs-brand--wordmark-name { display: flex; align-items: flex-end; }
.lbs-brand--wordmark-custom .custom-logo-link,
.lbs-brand--wordmark-name .lbs-brand__link { margin-left: var(--lbs-space-4); padding-left: var(--lbs-space-4); border-left: 1px solid var(--lbs-border-strong); }
.lbs-brand--wordmark-name .lbs-brand__org { flex: none; }
.lbs-brand--wordmark-name .lbs-brand__link { min-width: 0; min-height: 48px; }
@media (max-width: 575.98px) {
	:is(.lbs-brand--wordmark-custom, .lbs-brand--wordmark-name) :is(.lbs-brand__wordmark, .custom-logo) { height: 32px; }
	.lbs-brand--wordmark-custom .custom-logo-link,
	.lbs-brand--wordmark-name .lbs-brand__link { margin-left: var(--lbs-space-3); padding-left: var(--lbs-space-3); }
	/* The name shrinks with the wordmark, to two thirds. Two lines: 2 x 14.5 + 3 = 32px. */
	.lbs-brand--wordmark-name .lbs-brand__link { min-height: 32px; }
	.lbs-brand--wordmark-name .lbs-brand__name:not(.lbs-brand__name--two-lines) { font-size: 1.0625rem; line-height: calc(27 / 17); }
	.lbs-brand--wordmark-name .lbs-brand__name--two-lines { font-size: 0.8125rem; line-height: calc(14.5 / 13); padding-bottom: 3px; }
}
/* A wide uploaded logo (jh's signature, 5:1) shrinks to the room left beside the menu button instead of
   running under it; the wordmark keeps its size. Both constraints together keep the logo's proportions. */
@media (max-width: 991.98px) {
	.lbs-brand--wordmark-custom .lbs-brand__org { flex: none; }
	.lbs-brand--wordmark-custom .custom-logo-link { flex: 0 1 auto; min-width: 0; }
	.lbs-brand--wordmark-custom .custom-logo { height: auto; max-height: 48px; max-width: 100%; }
}
@media (max-width: 575.98px) {
	.lbs-brand--wordmark-custom .custom-logo { max-height: 32px; }
}

/* Tools: search, language, menu button --------------------------------
   The tools take the room the brand leaves (flex-basis 0) and are measured as a container, so their
   rules below see exactly that room. */
.lbs-header__tools {
	flex: 1 1 0;
	min-width: var(--lbs-target);
	container-type: inline-size;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--lbs-space-3);
}
/* The header's search box: field and button in one row, never stacked (it gives way instead, below).
   No room for its label above it: the label is read out, and the button's word names the field
   (WCAG technique G167). */
.lbs-header__tools .lbs-search-form { flex: none; width: 18rem; } /* control corners: the default since 2026-10-15 */
.lbs-header__tools .lbs-search { flex-direction: row; }
.lbs-header__tools .lbs-search__input { padding: 0 var(--lbs-space-3); }
.lbs-header__tools .lbs-search__label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Language: one link to the other language, its code visible and its name read out. */
.lbs-lang-link {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--lbs-target);
	min-height: var(--lbs-target);
	font-weight: 700;
	color: var(--lbs-text);
	text-decoration: none;
}
.lbs-lang-link:hover { color: var(--lbs-red); text-decoration: underline; text-underline-offset: 0.18em; }

/* Three or more languages: the current code opens a short list. */
.lbs-lang { position: relative; flex: none; }
.lbs-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--lbs-space-2);
	min-height: var(--lbs-target);
	padding: 0 var(--lbs-space-3);
	border: 1px solid var(--lbs-border-strong);
	border-radius: var(--lbs-radius-control);
	background: var(--lbs-white);
	color: var(--lbs-text);
	font-weight: 700;
}
.lbs-lang__caret { width: 12px; height: 7px; transition: transform var(--lbs-transition); }
.lbs-lang.is-open .lbs-lang__caret { transform: rotate(180deg); }
.lbs-lang__menu {
	position: absolute;
	z-index: 150;
	top: 100%;
	right: 0;
	min-width: 10rem;
	margin: 2px 0 0;
	padding: 0;
	list-style: none;
	background: var(--lbs-white);
	border: 1px solid var(--lbs-border);
	box-shadow: 0 4px 10px rgb(0 0 0 / 0.12);
	display: none;
}
.lbs-lang.is-open .lbs-lang__menu { display: block; }
.lbs-lang__menu a { display: flex; align-items: center; min-height: var(--lbs-target); padding: 0 var(--lbs-space-4); color: var(--lbs-text); }

/* The menu button: filled black, a 24px icon and its word (choice C). */
.lbs-menu-btn {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--lbs-space-2);
	min-width: var(--lbs-target);
	min-height: var(--lbs-target);
	padding: 0 var(--lbs-space-4);
	border: 1px solid var(--lbs-text);
	border-radius: var(--lbs-radius-control);
	background: var(--lbs-text);
	color: var(--lbs-white);
	font: inherit;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	transition: background-color var(--lbs-transition), color var(--lbs-transition);
}
.lbs-menu-btn .lbs-icon { flex: none; width: 24px; height: 24px; }
.lbs-menu-btn:hover,
.lbs-menu-btn--close { background: var(--lbs-white); color: var(--lbs-text); }
.lbs-menu-btn--close:hover { background: var(--lbs-text); color: var(--lbs-white); }

/* Giving way, in this order; the limits are the widths the items need (rem, so they follow the text
   size). The search box and the language link are in the drawer below 1200px. */
@container (width < 31.25rem) {
	.lbs-header__tools .lbs-search-form { display: none; }
}
@container (width < 12.5rem) {
	.lbs-header__tools :is(.lbs-lang-link, .lbs-lang) { display: none; }
}
@container (width < 8.25rem) {
	.lbs-header__tools .lbs-menu-btn { padding: 0; }
	.lbs-header__tools .lbs-menu-btn__label {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}
}
/* Browsers without container queries: the plain small-screen rule. */
@supports not (container-type: inline-size) {
	@media (max-width: 575.98px) {
		.lbs-header__tools :is(.lbs-search-form, .lbs-lang-link, .lbs-lang) { display: none; }
	}
}

/* Phones: 32px logos, the 44px button sets the row. */
@media (max-width: 575.98px) {
	.lbs-header__inner { padding-block: var(--lbs-space-3); }
	.lbs-brand { margin: 0; }
}
@media (max-width: 991.98px) {
	/* A long site name wraps inside the brand rather than pushing the tools out. */
	/* At very large text sizes a long word is hyphenated, or broken, rather than run under the tools. */
	.lbs-brand__name { white-space: normal; text-wrap: balance; hyphens: auto; overflow-wrap: anywhere; }
}
@media (max-width: 767.98px) {
	.lbs-brand__name:not(.lbs-brand__name--two-lines) { font-size: 1.5rem; line-height: calc(35 / 24); }
}

/* The drawer (template-parts/header/navigation.php) -------------------
   A popover the window's full height, coming out of the page's right-hand content line rather than the
   window's edge (Kristinn, 2026-10-01): its right edge is one side margin beyond the line where the
   header's menu button ends, so its own close button sits exactly where the menu button is (the header
   does not stay in view when the page is scrolled; at the top of the page the drawer reads as the
   header carrying on). Up to the full page width that line is the window's edge. The rest of the page
   is dimmed; site.js makes it inert while the drawer is open.
   --lbs-drawer-edge: the menu button's distance from the window's right edge, measured by site.js as
   the drawer opens and when the window is resized; the calculation is the fallback. */
:root { --lbs-header-row: 88px; }
@media (max-width: 575.98px) { :root { --lbs-header-row: 68px; } }

.lbs-drawer:popover-open {
	position: fixed;
	inset: var(--wp-admin--admin-bar--height, 0px) max(0px, var(--lbs-drawer-edge, max(var(--lbs-gutter), (100vw - var(--lbs-wide)) / 2)) - var(--lbs-gutter)) 0 auto;
	width: min(var(--lbs-drawer-width), 100%);
	height: auto;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 0 0 var(--lbs-space-6);
	overflow-y: auto;
	overscroll-behavior: contain;
	border: 0;
	border-left: 1px solid var(--lbs-border);
	background: var(--lbs-white);
	color: var(--lbs-text);
	box-shadow: -10px 0 28px rgb(0 0 0 / 0.14);
}
.lbs-drawer::backdrop { background: var(--lbs-scrim); }
/* The page does not scroll behind the open drawer. Where a scrollbar takes up room, site.js keeps that
   room while it is hidden (scrollbar-gutter), so nothing moves; elsewhere nothing needs keeping. */
html:has(.lbs-drawer:popover-open) { overflow: hidden; }
@media (max-width: 575.98px) {
	.lbs-drawer:popover-open { width: 100%; border-left: 0; box-shadow: none; }
}
/* It slides out from behind the content line: moved right by its width and cut off at the line, the two
   in step (the cut leaves room on the left for the shadow). */
@media (prefers-reduced-motion: no-preference) {
	.lbs-drawer:popover-open { clip-path: inset(0 0 0 -40px); }
	.lbs-drawer { transition: translate var(--lbs-transition), clip-path var(--lbs-transition), overlay var(--lbs-transition) allow-discrete, display var(--lbs-transition) allow-discrete; }
	.lbs-drawer:not(:popover-open) { translate: 100% 0; clip-path: inset(0 100% 0 -40px); }
	@starting-style {
		.lbs-drawer:popover-open { translate: 100% 0; clip-path: inset(0 100% 0 -40px); }
	}
}

/* Its first row: the close button where the menu button is (the header's right edge). */
.lbs-drawer__top {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: calc(var(--lbs-header-row) + 1px);
	padding: 0 var(--lbs-gutter) 0 var(--lbs-space-6);
	border-bottom: 1px solid var(--lbs-border);
}

/* The header's search box and language link, for when they have given way in the row. */
.lbs-drawer__tools { display: grid; gap: var(--lbs-space-3); padding: var(--lbs-space-5) var(--lbs-space-6) 0; }
.lbs-drawer__tools .lbs-search-form { max-width: none; }
.lbs-lang-list { margin: 0; padding: 0; list-style: none; }
.lbs-lang-list a { display: inline-flex; align-items: center; min-height: var(--lbs-target); font-weight: 700; color: var(--lbs-text); text-decoration: underline; text-underline-offset: 0.18em; }
@media (min-width: 1200px) {
	.lbs-drawer__tools { display: none; }
}

/* The links: main ones large, their sub-links listed beneath, all visible; the current page has the red
   bar. A site with the page tree instead of a menu lists the first level, and marks the branch. */
.lbs-drawer__nav,
.lbs-drawer__nav ul { margin: 0; padding: 0; list-style: none; }
.lbs-drawer__nav { padding: var(--lbs-space-5) var(--lbs-space-6) 0; }
.lbs-drawer__nav > li + li { margin-top: var(--lbs-space-1); }
.lbs-drawer__nav a {
	display: flex;
	align-items: center;
	padding-left: var(--lbs-space-3);
	border-left: var(--lbs-nav-underline) solid transparent;
	color: var(--lbs-text);
	text-decoration: none;
}
.lbs-drawer__nav > li > a { min-height: var(--lbs-target); font-size: var(--lbs-fs-lg); line-height: var(--lbs-lh-heading); font-weight: 500; }
.lbs-drawer__nav :is(.sub-menu, .children) { margin: 0 0 var(--lbs-space-3) var(--lbs-space-3); }
.lbs-drawer__nav :is(.sub-menu, .children) a { min-height: var(--lbs-space-6); font-size: var(--lbs-fs-sm); }
.lbs-drawer__nav a:hover { color: var(--lbs-red); text-decoration: underline; text-underline-offset: 0.18em; }
.lbs-drawer__nav :is(.current-menu-item, .current_page_item) > a,
.lbs-drawer__nav--top > .current_page_ancestor > a { border-left-color: var(--lbs-red); }
.lbs-drawer__nav :is(.sub-menu, .children) :is(.current-menu-item, .current_page_item) > a { font-weight: 500; }

/* Browsers without popovers (and so without the buttons' behaviour): the drawer's contents are a plain
   list under the header row. */
@supports not selector(:popover-open) {
	.lbs-menu-btn,
	.lbs-drawer__top { display: none; }
	.lbs-drawer { padding-bottom: var(--lbs-space-4); border-top: 1px solid var(--lbs-border); }
}

/* Sub-sites (lbs-core) ------------------------------------------------- */
/* A page marked as a sub-site root gives its descendants their own brand: the header keeps the site's
   variant, and the site's part (logo or name) is replaced by the sub-site's logo, as tall as the
   wordmark, or its name; after the wordmark it sits behind the same hairline as the site's own logo. */
.lbs-brand--subsite { display: flex; align-items: flex-end; }
.lbs-brand--subsite .lbs-brand__logo { display: block; width: auto; height: 48px; max-width: none; }
.lbs-brand--subsite .lbs-brand__org + .lbs-brand__site { margin-left: var(--lbs-space-4); padding-left: var(--lbs-space-4); border-left: 1px solid var(--lbs-border-strong); min-height: 48px; }
@media (max-width: 575.98px) {
	.lbs-brand--subsite .lbs-brand__logo { height: 32px; }
	.lbs-brand--subsite .lbs-brand__org + .lbs-brand__site { margin-left: var(--lbs-space-3); padding-left: var(--lbs-space-3); min-height: 32px; }
}
/* The breadcrumb line: a slim row at the foot of the header, above its hairline. */
.lbs-breadcrumb { font-size: var(--lbs-fs-sm); line-height: var(--lbs-lh-tight); border-top: 1px solid var(--lbs-border); }
.lbs-breadcrumb__list { display: flex; flex-wrap: wrap; gap: 0 var(--lbs-space-2); margin: 0 auto; padding-block: var(--lbs-space-2); list-style: none; }
/* Each item centres its separator, link or current page on one line: the links are 24px tall (target
   size), the current page is not a link, and its text sat 2px higher before. */
.lbs-breadcrumb__list li { display: flex; align-items: center; }
.lbs-breadcrumb__list li + li::before { content: '\203A'; margin-right: var(--lbs-space-2); color: var(--lbs-muted); }
.lbs-breadcrumb a { display: inline-flex; align-items: center; min-height: var(--lbs-target-small); color: var(--lbs-text); text-decoration: none; }
.lbs-breadcrumb a:hover { text-decoration: underline; }
.lbs-breadcrumb [aria-current] { color: var(--lbs-muted); }


/* ── footer.css ── */
/* The footer: the site's three ruled columns on a light panel, the strip that is the same on every LBS site, and
   the red bar across the bottom of every LBS page. Rules: docs/design-footer.md. */

.lbs-footer {
	margin-top: var(--lbs-space-9);
	background: var(--lbs-white);
	border-bottom: var(--lbs-footer-bar) solid var(--lbs-red);
	font-size: var(--lbs-fs-md);
	line-height: var(--lbs-lh-body);
}

.lbs-footer__site { padding: var(--lbs-space-6) 0; background: var(--lbs-panel); }
.lbs-footer__cols { display: grid; gap: var(--lbs-space-5) 20px; }
.lbs-footer__col { min-width: 0; }
.lbs-footer__col--empty { display: none; }

.lbs-footer__head {
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid var(--lbs-border-strong);
}
.lbs-footer__head > * { margin: 0; }
.lbs-footer__title { font-size: var(--lbs-fs-md); font-weight: 700; hyphens: manual; }
.lbs-footer__title--site { font-size: var(--lbs-fs-lg); }

/* Column 1: the site's own contact details, social media, free content (the widget area) and the about link. */
.lbs-footer__contact { margin: 0 0 9px; font-weight: 700; }
.lbs-footer__contact a[href^="tel:"] { white-space: nowrap; }
/* Social media icons: 24px drawings in 40px links (easy to hit), pulled left by the 8px of air so
   the first drawing lines up with the contact lines above. */
.lbs-footer__social {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	list-style: none;
	margin: var(--lbs-space-3) 0 0 -8px;
	padding: 0;
}
.lbs-footer__social a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; }
.lbs-footer__social .lbs-icon { width: 24px; height: 24px; }

/* The free area: a List shows as links like the other columns, a Paragraph as small text. Block widgets come
   wrapped in a Group, so the rules reach any depth. */
.lbs-footer__free { margin-top: var(--lbs-space-3); }
.lbs-footer__free p { margin: 0 0 10px; font-size: var(--lbs-fs-sm); }
.lbs-footer__free ul { list-style: none; margin: 0 0 10px; padding: 0; font-weight: 500; }
.lbs-footer__free li { margin-bottom: 6px; }
.lbs-footer__free :is(ul, p) a:not(:hover, :focus-visible) { color: inherit; }
.lbs-footer__free ul a { text-decoration: none; }
/* A link inside a sentence is underlined, as in running text everywhere (a licence line, a feedback address). */
.lbs-footer__free p a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.lbs-footer__free > .widget + .widget { margin-top: 10px; }
/* Headings are not designed for here; one that turns up stays below the site's name in size. */
.lbs-footer__free :is(.widget-title, h2, h3, h4) { margin: 0 0 6px; font-size: var(--lbs-fs-md); }

.lbs-footer__about { margin: var(--lbs-space-4) 0 0; font-weight: 700; }
.lbs-footer__about a { text-decoration: none; }

/* Columns 2 and 3: menus. */
.lbs-footer__nav { list-style: none; margin: 0 0 20px; padding: 0; font-weight: 500; }
.lbs-footer__nav li { margin-bottom: 6px; }
.lbs-footer__nav .current-menu-item > a { color: var(--lbs-red); }

/* A menu item with the CSS class "lbs-see-more" (Menus > Screen Options > CSS Classes) becomes the
   "+ Sjá fleiri" link. */
.lbs-footer__nav .lbs-see-more { font-size: var(--lbs-fs-md); }

/* Where a link leads, as in link cards (components.css, which defines the masks): the column headings end in an
   arrow (this site) or an arrow up to the right (other sites), the about link in an arrow, and a link to a PDF in an
   arrow onto a line (its words for screen readers come from inc/template-tags.php or the strip; only in the menus and
   the strip, where those words are there: a PDF link in the free area says "(PDF)" in its own words). Empty generated
   content, so screen readers meet none of them. Without masks (old browsers) no symbol at all. */
.lbs-footer__title--internal,
.lbs-footer__about a { --lbs-footer-symbol: var(--lbs-icon-link); }
.lbs-footer__title--external { --lbs-footer-symbol: var(--lbs-icon-link-external); }
:is(.lbs-footer__nav, .lbs-footer__policies) a[href]:is([href$=".pdf" i], [href*=".pdf?" i], [href*=".pdf#" i]) { --lbs-footer-symbol: var(--lbs-icon-link-pdf); }
@supports (mask-image: none) {
	:is(.lbs-footer__title--internal, .lbs-footer__title--external, .lbs-footer__about a)::after,
	:is(.lbs-footer__nav, .lbs-footer__policies) a[href]:is([href$=".pdf" i], [href*=".pdf?" i], [href*=".pdf#" i])::after {
		content: '';
		display: inline-block;
		width: 0.9em;
		height: 0.9em;
		margin-left: 0.3em;
		vertical-align: -0.12em;
		background-color: var(--lbs-red);
		mask: var(--lbs-footer-symbol) center / contain no-repeat;
	}
}

/* The shared strip. */
.lbs-footer__strip {
	padding: var(--lbs-space-5) 0 var(--lbs-space-6);
	border-top: 1px solid var(--lbs-border);
	font-size: var(--lbs-fs-sm);
	line-height: var(--lbs-lh-body);
}
.lbs-footer__strip-inner { display: grid; gap: var(--lbs-space-4); }
/* A long e-mail address breaks rather than widening the page (200% text on a phone). */
.lbs-footer__strip-inner > * { min-width: 0; }
.lbs-footer__contact { overflow-wrap: anywhere; }
.lbs-footer__logo { display: block; justify-self: start; }
.lbs-footer__logo img { display: block; width: auto; height: 48px; max-width: 100%; }
.lbs-footer__address { font-style: normal; margin: 0; }
.lbs-footer__strip .lbs-footer__contact { margin: 0; }
.lbs-footer__strip ul { list-style: none; margin: 0; padding: 0; }
.lbs-footer__strip-social { font-weight: 500; }
.lbs-footer__strip-social a { text-decoration: none; }
.lbs-footer__strip-social a:not(:hover, :focus-visible),
.lbs-footer__policies a:not(:hover, :focus-visible) { color: inherit; }

@media (max-width: 991.98px) { .lbs-footer { margin-top: var(--lbs-space-7); } }
@media (max-width: 767.98px) {
	.lbs-footer { margin-top: var(--lbs-space-5); }
	.lbs-footer__site { padding-bottom: var(--lbs-space-4); }
	.lbs-footer__col--wide-only { display: none; }
	/* Links at least 32px tall on phones. As flex boxes they would not break a long word, so at 200% text on a 320px
	   phone "Persónuverndarstefna" widened the page: a long word is hyphenated where the browser can, else broken. */
	.lbs-footer :is(.lbs-footer__nav, .lbs-footer__free ul, .lbs-footer__strip ul) a,
	.lbs-footer :is(.lbs-footer__contact, .lbs-footer__about) a { display: inline-flex; align-items: center; min-height: 32px; overflow-wrap: anywhere; hyphens: auto; }
	.lbs-footer a::after { flex: none; } /* the PDF or arrow symbol keeps its size beside a broken word */
	.lbs-footer__nav li,
	.lbs-footer__free li { margin-bottom: 2px; }
}
@media (min-width: 576px) and (max-width: 767.98px) {
	.lbs-footer__cols { grid-template-columns: 1fr 1fr; }
	/* With room for a word on the next line, split only long words (as headings, base.css), not "söfn-un". */
	.lbs-footer :is(.lbs-footer__nav, .lbs-footer__free ul, .lbs-footer__strip ul, .lbs-footer__contact, .lbs-footer__about) a {
		hyphenate-limit-chars: 12 5 4;
		-webkit-hyphenate-limit-before: 5;
		-webkit-hyphenate-limit-after: 4;
	}
	.lbs-footer__strip-inner { grid-template-columns: auto 1fr; column-gap: var(--lbs-space-6); }
	.lbs-footer__logo { grid-row: span 3; }
}
@media (min-width: 768px) {
	.lbs-footer__cols,
	.lbs-footer__strip-inner {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		column-gap: 56px;
		padding-inline: 20px;
	}
	/* An empty column keeps its place, so the others line up with every other LBS site. */
	.lbs-footer__col--empty { display: block; }
	/* The headings share one band, so the three rules line up; the rule reaches a little beyond the text on both
	   sides. */
	.lbs-footer__head {
		display: flex;
		align-items: flex-end;
		min-height: 64px;
		margin: 0 -22px 10px;
		padding: 0 22px 10px;
	}
	/* The strip: the logo, then the contact lines, the policy and the social media, side by side. */
	.lbs-footer__strip-inner { grid-template-columns: auto repeat(3, minmax(0, 1fr)); }
}
/* Three columns are tight between 768 and 991: close the gaps and step the contact lines down. */
@media (min-width: 768px) and (max-width: 991.98px) {
	.lbs-footer__cols,
	.lbs-footer__strip-inner { column-gap: 44px; padding-inline: 16px; }
	.lbs-footer__head { margin-inline: -16px; padding-inline: 16px; }
	.lbs-footer__contact { font-size: var(--lbs-fs-sm); }
	.lbs-footer__strip-inner { grid-template-columns: auto 1fr 1fr; }
	.lbs-footer__strip-social { grid-column: 3; }
}


/* ── content.css ── */
/* Content: everything WordPress and its editors put inside .entry-content.

   Prose rules are scoped with :where() so they add no specificity, and the flow rules use the child
   combinator so they stop at Elementor's single root element. The theme never styles .elementor-*. */

/* Vertical rhythm between top-level blocks */
.entry-content > * { margin-block: 0 var(--lbs-space-5); }
.entry-content > :last-child { margin-bottom: 0; }
.entry-content > :where(h2, h3, h4, h5, h6) { margin-top: var(--lbs-space-6); margin-bottom: var(--lbs-space-3); }
/* A section heading gets more room above it than the headings inside a section (Vefstaðall 5.4). */
.entry-content > :where(h2) { margin-top: var(--lbs-space-7); }
.entry-content > :where(h2, h3, h4, h5, h6):first-child { margin-top: 0; }

/* Links in running text: red and underlined, so they are never told apart by colour alone (WCAG 1.4.1);
   on hover and keyboard focus the red darkens and the line thickens (Vefstaðall 6.1, 6.3; Kristinn,
   2026-10-01, replacing the hover-only underline of 2026-09-22). Links with a class belong to a component,
   which styles them; the one exception is a protected e-mail address, which site.js turns into a link with the
   class "tpostur" and nothing else: in text (also a card's or a notice's text) it is an ordinary link (Kristinn,
   2026-10-13). Anywhere with its own link look (the footer, the staff list) that look wins, as :where() adds no
   weight. */
:where(.entry-content, .comment-content, .lbs-prose, .elementor-widget-text-editor) a:where(:not([class]), [class="tpostur"]) {
	color: var(--lbs-red);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}
:where(.entry-content, .comment-content, .lbs-prose, .elementor-widget-text-editor) a:where(:not([class]), [class="tpostur"]):is(:hover, :focus-visible) {
	color: var(--lbs-red-dark);
	text-decoration-thickness: 2px;
}
/* On red and dark surfaces links are white, and underlined like everywhere else. */
:where(.entry-content) :is(.has-accent-background-color, .has-accent-dark-background-color, .has-dark-background-color) a:where(:not([class]), [class="tpostur"]),
:where(.entry-content) :is(.has-accent-background-color, .has-accent-dark-background-color, .has-dark-background-color) a:where(:not([class]), [class="tpostur"]):is(:hover, :focus-visible) { color: var(--lbs-white); }
/* A list of page links is navigation, not running text: underline on hover and focus only. */
.entry-content .wp-block-page-list a { color: var(--lbs-red); text-decoration: none; }
.entry-content .wp-block-page-list a:is(:hover, :focus-visible) { color: var(--lbs-red-dark); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }

/* Justified text leaves uneven gaps between words; text is always set left (Vefstaðall 4.5). Editors'
   choices are inline styles from classic or imported content, hence !important. */
:where(.entry-content, .comment-content, .lbs-prose) :is(.has-text-align-justify, [style*="text-align: justify"], [style*="text-align:justify"]) { text-align: left !important; }

:where(.entry-content, .comment-content, .lbs-prose) :where(li) { margin-bottom: var(--lbs-space-1); }

/* Quotes: a red rule on the left, no italics. */
:where(.entry-content, .comment-content, .lbs-prose) blockquote,
.wp-block-quote,
.wp-block-pullquote {
	padding: var(--lbs-space-2) 0 var(--lbs-space-2) var(--lbs-space-5);
	border: 0;
	border-left: var(--lbs-rule-h) solid var(--lbs-red);
	font-size: var(--lbs-fs-md);
	text-align: left;
}
blockquote > :last-child { margin-bottom: 0; }
blockquote cite,
.wp-block-quote cite,
.wp-block-pullquote cite { display: block; margin-top: var(--lbs-space-2); color: var(--lbs-muted); font-size: var(--lbs-fs-xs); font-style: normal; }

/* Tables */
:where(.entry-content, .comment-content, .lbs-prose) :where(th, td) {
	padding: var(--lbs-space-2) var(--lbs-space-3);
	border-bottom: 1px solid var(--lbs-border);
	vertical-align: top;
}
:where(.entry-content, .comment-content, .lbs-prose) :where(thead th) { border-bottom: 2px solid var(--lbs-text); }
/* Digits of even width, so that numbers line up in their column (DINish's own digits vary in width). */
:where(.entry-content, .comment-content, .lbs-prose) :where(th, td) { font-variant-numeric: tabular-nums; }
/* A table wider than the column scrolls inside its own box. Table blocks have one (the figure); site.js
   wraps tables from classic or imported content in .lbs-table-scroll, and gives a box that actually
   scrolls a name and keyboard focus, so it can be scrolled without a mouse. */
.wp-block-table,
.lbs-table-scroll { overflow-x: auto; }
.lbs-table-scroll { margin-bottom: var(--lbs-space-4); }
.lbs-table-scroll > table { margin-bottom: 0; }
.wp-block-table td,
.wp-block-table th { border-width: 0 0 1px; border-color: var(--lbs-border); }
.wp-block-table thead { border-bottom: 2px solid var(--lbs-text); }

/* Images, captions, galleries */
/* Classic captions carry an inline width from WordPress; keep them inside the reading column. */
.wp-caption { max-width: 100%; }
.entry-content > .wp-caption:not(.alignwide, .alignfull) { max-width: min(100%, var(--lbs-content)); }
.wp-caption img { display: block; }
.wp-caption-text,
.wp-element-caption,
figcaption,
.gallery-caption { margin-top: var(--lbs-space-2); color: var(--lbs-muted); font-size: var(--lbs-fs-xs); line-height: var(--lbs-lh-tight); text-align: left; }

.alignleft { float: left; margin: 0.3em var(--lbs-space-5) var(--lbs-space-4) 0; max-width: 50%; }
.alignright { float: right; margin: 0.3em 0 var(--lbs-space-4) var(--lbs-space-5); max-width: 50%; }
/* The featured image as a portrait (Customize › LBS › Pages): its own size, at most half the column or 18rem. */
.lbs-entry__portrait { max-width: min(50%, 18rem); }
.lbs-entry__portrait img { display: block; }
/* A portrait whose caption holds one link is one link as a whole, as a link card: the link covers picture
   and caption; hovering anywhere gives it the running-text hover (darker red, thicker line). */
.lbs-entry__portrait--link { position: relative; }
.lbs-entry__portrait--link figcaption a::before { content: ''; position: absolute; inset: 0; }
.lbs-entry__portrait--link figcaption a:focus-visible { outline: none; }
.lbs-entry__portrait--link figcaption a:focus-visible::before { outline: var(--lbs-focus-ring) solid var(--lbs-focus); outline-offset: 2px; }
.lbs-entry__portrait--link:hover figcaption a { color: var(--lbs-red-dark); text-decoration-thickness: 2px; }
.aligncenter { display: block; margin-inline: auto; }
.entry-content::after { content: ''; display: table; clear: both; }
@media (max-width: 575.98px) {
	.alignleft,
	.alignright { float: none; margin: 0 0 var(--lbs-space-4); max-width: 100%; }
}

/* Gallery block, style "Square tiles": every picture cropped to a square that keeps its top (a document's
   heading, people's heads; the whole picture is in the enlarged view), its caption under it in the caption
   style above instead of over the picture, cut to three lines (the whole caption is in the enlarged view,
   and screen readers read it all), and a part-filled last row keeping the column width. WordPress's
   own rules use :not(#individual-image) and four classes, so these repeat both to weigh as much (and win by coming later). */
.wp-block-gallery.has-nested-images.is-style-lbs-squares { align-items: flex-start; }
.wp-block-gallery.has-nested-images.is-style-lbs-squares figure.wp-block-image:not(#individual-image) { flex-grow: 0; justify-content: flex-start; }
.wp-block-gallery.has-nested-images.is-style-lbs-squares figure.wp-block-image:not(#individual-image) :is(a, div, img) { flex: none; }
/* Fewer columns on narrower screens: one below 576px, three up to 992px when the gallery has more. */
@media (max-width: 575.98px) {
	.wp-block-gallery.has-nested-images.is-style-lbs-squares figure.wp-block-image:not(#individual-image) { width: 100%; }
}
@media (min-width: 576px) and (max-width: 991.98px) {
	.wp-block-gallery.has-nested-images.is-style-lbs-squares:is(.columns-4, .columns-5, .columns-6, .columns-7, .columns-8) figure.wp-block-image:not(#individual-image) { width: calc(33.33333% - var(--wp--style--unstable-gallery-gap, 16px) * 0.66667); }
}
.wp-block-gallery.has-nested-images.is-style-lbs-squares figure.wp-block-image:not(#individual-image) img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; object-position: 50% 0; }
.wp-block-gallery.has-nested-images.is-style-lbs-squares figure.wp-block-image:has(figcaption)::before { content: none; }
.wp-block-gallery.has-nested-images.is-style-lbs-squares figure.wp-block-image figcaption { position: static; max-height: none; overflow: hidden; scrollbar-gutter: auto; margin: var(--lbs-space-2) 0 0; padding: 0; background: none; text-shadow: none; color: var(--lbs-muted); font-size: var(--lbs-fs-xs); line-height: var(--lbs-lh-tight); text-align: left; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }

.gallery { display: grid; gap: var(--lbs-space-3); grid-template-columns: repeat(3, 1fr); }
.gallery-columns-1 { grid-template-columns: 1fr; }
.gallery-columns-2 { grid-template-columns: repeat(2, 1fr); }
.gallery-columns-4 { grid-template-columns: repeat(4, 1fr); }
.gallery-columns-5 { grid-template-columns: repeat(5, 1fr); }
.gallery-columns-6 { grid-template-columns: repeat(6, 1fr); }
.gallery-columns-7 { grid-template-columns: repeat(7, 1fr); }
.gallery-columns-8 { grid-template-columns: repeat(8, 1fr); }
.gallery-columns-9 { grid-template-columns: repeat(9, 1fr); }
.gallery-item { margin: 0; }
.gallery-item img { display: block; width: 100%; }
@media (max-width: 575.98px) { .gallery { grid-template-columns: repeat(2, 1fr); } }

/* Separator: a hairline */
.wp-block-separator { border: 0; border-top: 1px solid var(--lbs-border); opacity: 1; }
.wp-block-separator.is-style-lbs-rule { width: var(--lbs-rule-w); border-top: var(--lbs-rule-h) solid var(--lbs-red); margin-left: 0; padding: 0; }
/* As a top-level block it starts at the left edge of the reading column. */
.entry-content > .wp-block-separator.is-style-lbs-rule { margin-left: max(0px, calc((100% - var(--lbs-content)) / 2)); margin-right: auto; }
.wp-block-separator.is-style-lbs-rule::after { content: none; }

/* Post states WordPress expects a theme to handle */
.sticky .lbs-card__title::before { content: '★ '; color: var(--lbs-red); font-size: 0.7em; vertical-align: 0.2em; }
.bypostauthor > .comment-body .fn::after { content: ' ✓'; color: var(--lbs-red); }

/* Paginated posts, post navigation, pagination */
.page-links { clear: both; display: flex; flex-wrap: wrap; gap: var(--lbs-space-2); align-items: center; margin-top: var(--lbs-space-5); font-weight: 500; }
.page-links > :is(a, span),
.nav-links .page-numbers,
.wp-block-query-pagination .page-numbers,
.wp-block-query-pagination > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 var(--lbs-space-3);
	border: 1px solid var(--lbs-border-strong);
	border-radius: var(--lbs-radius-control);
	font-weight: 500;
	text-decoration: none;
}
.page-links > a:hover,
.nav-links a.page-numbers:hover,
.wp-block-query-pagination a:hover { border-color: var(--lbs-red); color: var(--lbs-red); }
.page-links > .current,
.nav-links .page-numbers.current,
.wp-block-query-pagination .page-numbers.current { background: var(--lbs-red); border-color: var(--lbs-red); color: var(--lbs-white); }
.nav-links .page-numbers.dots,
.wp-block-query-pagination .page-numbers.dots { border-color: transparent; min-width: 0; padding: 0; }
.pagination,
.comments-pagination { margin-top: var(--lbs-space-7); }
.pagination .nav-links,
.comments-pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--lbs-space-2); }
/* The Query Loop's page numbers (a page listing a whole category, e.g. landsbokasafn.is's Fréttasafn): the same
   boxes, centred under the list; WordPress's own margins on its three parts give way to the gap. */
.wp-block-query-pagination { gap: var(--lbs-space-2); margin-top: var(--lbs-space-7); }
.wp-block-query-pagination > :is(.wp-block-query-pagination-previous, .wp-block-query-pagination-numbers, .wp-block-query-pagination-next) { margin: 0; }
.wp-block-query-pagination-numbers { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--lbs-space-2); }

.post-navigation { max-width: var(--lbs-content); margin: var(--lbs-space-7) auto 0; padding-top: var(--lbs-space-5); border-top: 1px solid var(--lbs-border); }
.post-navigation .nav-links { display: grid; gap: var(--lbs-space-4); grid-template-columns: 1fr 1fr; }
.post-navigation .nav-next { grid-column: 2; text-align: right; }
.post-navigation .nav-subtitle { display: block; color: var(--lbs-muted); font-size: var(--lbs-fs-xs); }
.post-navigation .nav-title { font-weight: 500; overflow-wrap: anywhere; hyphens: auto; } /* long Icelandic compounds overflowed 320px */

/* Entry footer (categories, tags) */
.lbs-entry__footer { margin-top: var(--lbs-space-6); padding-top: var(--lbs-space-4); border-top: 1px solid var(--lbs-border); color: var(--lbs-muted); font-size: var(--lbs-fs-xs); }
.lbs-entry__footer a { text-decoration: underline; }
.lbs-entry__thumbnail { margin-bottom: var(--lbs-space-5); }
.lbs-entry__thumbnail img { display: block; width: 100%; }

/* Password form */
.post-password-form label { display: block; max-width: 320px; }


/* ── components.css: buttons, notices, band ── */
:root {
	--lbs-icon-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E");
	--lbs-icon-link-external: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E");
	--lbs-icon-link-pdf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M7 10l5 5 5-5M5 20h14'/%3E%3C/svg%3E");
}
/* Buttons (Vefstaðall 7.5). The main button is red with white text, 2px frame, 6px corners, 16px bold,
   44px tall, darker red on hover. The Button block (and the File block's button) take that look from
   theme.json (styles.elements.button); these rules give it to the theme's .lbs-button links, the search
   box's button and the submit buttons of plain forms in content (":is" so they outweigh base.css's reset of every button). */
.lbs-button,
.lbs-search__button,
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :is(input[type="submit"], button[type="submit"]:not([class])) {
	display: inline-block;
	padding: var(--lbs-space-2) var(--lbs-space-4);
	border: 2px solid var(--lbs-red);
	border-radius: var(--lbs-radius-control);
	background: var(--lbs-red);
	color: var(--lbs-white);
	font-family: inherit;
	font-size: var(--lbs-fs-sm);
	font-weight: 700;
	line-height: var(--lbs-lh-ui);
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--lbs-transition), color var(--lbs-transition), border-color var(--lbs-transition);
}
.lbs-button:is(:hover, :focus-visible),
.lbs-search__button:is(:hover, :focus-visible),
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :is(input[type="submit"], button[type="submit"]:not([class])):is(:hover, :focus-visible) {
	background: var(--lbs-red-dark);
	border-color: var(--lbs-red-dark);
	color: var(--lbs-white);
}
/* A button that cannot be used: grey, with a hairline frame (better, though, to let the visitor try and
   say what is missing). */
:is(.lbs-button, .lbs-search__button, .wp-block-button__link, :where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :is(input[type="submit"], button[type="submit"])):is(:disabled, [aria-disabled="true"]) {
	border-color: var(--lbs-border);
	background: var(--lbs-disabled-surface);
	color: var(--lbs-disabled-text);
	text-decoration: none;
	cursor: not-allowed;
}
/* The second button: white, red frame and red text; the Button block's "Outline" style. Colours an
   editor picked for the button itself win. */
.wp-block-button.is-style-outline > .wp-block-button__link,
.lbs-button--secondary { padding: var(--lbs-space-2) var(--lbs-space-4); border: 2px solid var(--lbs-red); }
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background),
.lbs-button--secondary { background: var(--lbs-white); }
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color),
.lbs-button--secondary { color: var(--lbs-red); }
.wp-block-button.is-style-outline > .wp-block-button__link:is(:hover, :focus-visible),
.lbs-button--secondary:is(:hover, :focus-visible) { border-color: var(--lbs-red-dark); text-decoration: underline; }
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background):is(:hover, :focus-visible),
.lbs-button--secondary:is(:hover, :focus-visible) { background: var(--lbs-white); }
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color):is(:hover, :focus-visible),
.lbs-button--secondary:is(:hover, :focus-visible) { color: var(--lbs-red-dark); }
/* On red and dark surfaces every button is white with black text (red on red would vanish). ":root"
   lets these outweigh the second-button rules above. */
:root :is(.has-accent-background-color, .has-accent-dark-background-color, .has-dark-background-color) :is(.wp-block-button__link:not(.has-background, .has-text-color), .lbs-button),
:root :is(.has-accent-background-color, .has-accent-dark-background-color, .has-dark-background-color) :is(.wp-block-button__link:not(.has-background, .has-text-color), .lbs-button):is(:hover, :focus-visible) {
	border-color: var(--lbs-white);
	background: var(--lbs-white);
	color: var(--lbs-text);
}
:root :is(.has-accent-background-color, .has-accent-dark-background-color, .has-dark-background-color) :is(.wp-block-button__link:not(.has-background, .has-text-color), .lbs-button):is(:hover, :focus-visible) { text-decoration: underline; }


/* The service answer (Vefstaðall 8.1): grey ground, 4px red line on the left, square corners. The Group
   style "Service answer" (slug lbs-notice, earlier "Notice (red edge)") and lbs-core's notice part
   without a kind. */
.lbs-notice,
.is-style-lbs-notice {
	padding: var(--lbs-space-4) var(--lbs-space-5);
	background: var(--lbs-panel);
	border-left: 4px solid var(--lbs-red);
}
/* Notices (7.7), four kinds: a pale ground, a 4px line on the left and an icon in the kind's colour; the
   text stays black, the corners square. The Group styles "Notice: information / success / warning /
   error" and lbs-core's notice part with a kind (lbs-notice--info ...). The patterns supply the bold
   first line that starts with the kind's word ("Upplýsingar:", "Tókst:", "Athugið:", "Villa:"): written
   in the content, so it follows the page's language. The icons are lbs-core's circle-i, circle-check,
   triangle-exclamation and octagon-cross (built outlines), copied here so that the theme does not depend
   on the plugin; they are masks, coloured by the line colour, and form errors use one too (forms.css). */
:root,
.editor-styles-wrapper {
	--lbs-icon-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.75 12A8.75 8.75 0 0 1 12 20.75A8.75 8.75 0 0 1 3.25 12A8.75 8.75 0 0 1 12 3.25A8.75 8.75 0 0 1 20.75 12ZM19.25 12A7.25 7.25 0 0 0 12 4.75A7.25 7.25 0 0 0 4.75 12A7.25 7.25 0 0 0 12 19.25A7.25 7.25 0 0 0 19.25 12ZM11.25 7.25L12.75 7.25L12.75 8.75L11.25 8.75ZM11.25 10.5L12.75 10.5L12.75 16.75L11.25 16.75Z'/%3E%3C/svg%3E");
	--lbs-icon-success: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.75 12A8.75 8.75 0 0 1 12 20.75A8.75 8.75 0 0 1 3.25 12A8.75 8.75 0 0 1 12 3.25A8.75 8.75 0 0 1 20.75 12ZM19.25 12A7.25 7.25 0 0 0 12 4.75A7.25 7.25 0 0 0 4.75 12A7.25 7.25 0 0 0 12 19.25A7.25 7.25 0 0 0 19.25 12ZM7.47 12.78L8.53 11.72L11.28 14.47L10.22 15.53ZM11.293 15.518L10.207 14.482L15.457 8.982L16.543 10.018ZM10.75 15L11.293 15.518L10.762 16.073L10.22 15.53Z'/%3E%3C/svg%3E");
	--lbs-icon-warning: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.224L22.035 20L1.965 20ZM12 5.276L4.535 18.5L19.465 18.5ZM11.25 9.25L12.75 9.25L12.75 14.25L11.25 14.25ZM11.25 15.75L12.75 15.75L12.75 17.25L11.25 17.25Z'/%3E%3C/svg%3E");
	--lbs-icon-error: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.439 3.25L15.561 3.25L20.75 8.439L20.75 15.561L15.561 20.75L8.439 20.75L3.25 15.561L3.25 8.439ZM9.061 4.75L4.75 9.061L4.75 14.939L9.061 19.25L14.939 19.25L19.25 14.939L19.25 9.061L14.939 4.75ZM8.97 10.03L10.03 8.97L15.03 13.97L13.97 15.03ZM13.97 8.97L15.03 10.03L10.03 15.03L8.97 13.97Z'/%3E%3C/svg%3E");
}
:is(.is-style-lbs-notice-info, .lbs-notice--info) {
	--lbs-notice-line: var(--lbs-border-strong);
	--lbs-notice-ground: var(--lbs-panel);
	--lbs-notice-icon: var(--lbs-icon-info);
}
:is(.is-style-lbs-notice-success, .lbs-notice--success) {
	--lbs-notice-line: var(--lbs-success);
	--lbs-notice-ground: var(--lbs-success-surface);
	--lbs-notice-icon: var(--lbs-icon-success);
}
:is(.is-style-lbs-notice-warning, .lbs-notice--warning) {
	--lbs-notice-line: var(--lbs-warning);
	--lbs-notice-ground: var(--lbs-warning-surface);
	--lbs-notice-icon: var(--lbs-icon-warning);
}
:is(.is-style-lbs-notice-error, .lbs-notice--error) {
	--lbs-notice-line: var(--lbs-error);
	--lbs-notice-ground: var(--lbs-error-surface);
	--lbs-notice-icon: var(--lbs-icon-error);
}
:is(.is-style-lbs-notice-info, .is-style-lbs-notice-success, .is-style-lbs-notice-warning, .is-style-lbs-notice-error, .lbs-notice--info, .lbs-notice--success, .lbs-notice--warning, .lbs-notice--error) {
	position: relative;
	padding: var(--lbs-space-4) var(--lbs-space-5) var(--lbs-space-4) calc(var(--lbs-space-5) + 24px + var(--lbs-space-3));
	border-left: 4px solid var(--lbs-notice-line);
	background: var(--lbs-notice-ground);
	color: var(--lbs-text);
}
:is(.is-style-lbs-notice-info, .is-style-lbs-notice-success, .is-style-lbs-notice-warning, .is-style-lbs-notice-error, .lbs-notice--info, .lbs-notice--success, .lbs-notice--warning, .lbs-notice--error)::before {
	content: "";
	position: absolute;
	top: calc(var(--lbs-space-4) + (var(--lbs-lh-body) * 1em - 24px) / 2);
	left: var(--lbs-space-5);
	width: 24px;
	height: 24px;
	background: var(--lbs-notice-line);
	mask: var(--lbs-notice-icon) center / 24px no-repeat;
}
:is(.lbs-notice, .is-style-lbs-notice, .is-style-lbs-notice-info, .is-style-lbs-notice-success, .is-style-lbs-notice-warning, .is-style-lbs-notice-error, .lbs-notice--info, .lbs-notice--success, .lbs-notice--warning, .lbs-notice--error) > * { margin-block: 0; }
/* The bold first line and the text under it read as one: a small step between the parts. */
:is(.lbs-notice, .is-style-lbs-notice, .is-style-lbs-notice-info, .is-style-lbs-notice-success, .is-style-lbs-notice-warning, .is-style-lbs-notice-error, .lbs-notice--info, .lbs-notice--success, .lbs-notice--warning, .lbs-notice--error) > :not(:first-child) { margin-top: var(--lbs-space-2); }


/* The red band under the header (lbs-core inc/announcements.php, printed at the theme's lbs_header_notices
   hook): the announcement on the left, today's opening hours on the right, even when alone. Below 768px the
   two stack, the announcement first, and the hours sit on the left. "has-accent-background-color" gives
   the white focus ring of red surfaces (base.css). The thin band is an every-page announcement. */
.lbs-band { background: var(--lbs-red); color: var(--lbs-white); font-size: var(--lbs-fs-sm); line-height: var(--lbs-lh-ui); }
.lbs-band__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--lbs-space-2) var(--lbs-space-6);
	padding-block: var(--lbs-space-3);
}
.lbs-band--thin .lbs-band__inner { padding-block: var(--lbs-space-2); }
.lbs-band .lbs-band__notice { flex: 1 1 24rem; margin: 0; }
.lbs-band .lbs-band__notice strong { font-weight: 700; }
.lbs-band .lbs-band__hours { flex: 0 1 auto; margin: 0; font-weight: 700; }
@media (min-width: 768px) {
	.lbs-band .lbs-band__hours { margin-left: auto; text-align: right; }
}
.lbs-band a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.lbs-band a:hover { color: inherit; text-decoration-thickness: 2px; }
.lbs-hours__link { white-space: nowrap; }



/* ── forms.css ── */
/* Forms. Control borders use --lbs-border-strong (3:1 against white, WCAG 1.4.11). */

/* The LBS search box (Vefstaðall 7.4): a label saying where the search looks, then the field and a
   button with the word "Leita" side by side; they stack when the form is narrower than 26rem (a
   container query, so it follows the room the box is given, not the window). Field and button have the
   corners of any other control (3.6), as in the header and the drawer; only the hero search box below is
   fully round (Kristinn, 2026-10-15; until then every main search box was): --lbs-search-r, the control
   corners when not set. The button is the main button (components.css). */
.lbs-search-form {
	container-type: inline-size;
	max-width: var(--lbs-search-width);
}
.lbs-search__label {
	display: block;
	margin-bottom: var(--lbs-space-1);
	font-weight: 700;
}
.lbs-search {
	display: flex;
	gap: var(--lbs-space-2);
}
.lbs-search__input {
	flex: 1 1 auto;
	min-width: 0;
	height: var(--lbs-target);
	padding: 0 var(--lbs-space-4);
	border: 1px solid var(--lbs-border-strong);
	border-radius: var(--lbs-search-r, var(--lbs-radius-control));
	background: var(--lbs-white);
	color: var(--lbs-text);
	font-size: var(--lbs-fs-sm);
	appearance: none;
}
.lbs-search__input::placeholder { color: var(--lbs-muted); opacity: 1; }
.lbs-search__button { flex: none; padding-inline: var(--lbs-space-5); border-radius: var(--lbs-search-r, var(--lbs-radius-control)); }
.lbs-search__button .lbs-icon { width: 24px; height: 24px; }
@container (width < 26rem) {
	.lbs-search { flex-direction: column; }
}

/* The search box in a page's opening picture (the signature picture, block or Elementor, and the picture strip):
   larger, with the button inside the round field, as on landsbokasafn.is's front page before the move (Kristinn,
   2026-10-15: every site's hero search; in-text search boxes, the search page, header and drawer keep the look
   above). The label stays above it. The frame is the box's: the field has none, and the button sits flush in its
   right end; one focus ring goes round the whole box when the field has focus (the button keeps its own). The
   theme's form and the core Search block alike. Below 18rem the button goes under the field, still inside the
   box, which then has a control's corners. The corners go through --lbs-search-r, which the field and button
   already read (also in compat-elementor.css, where the other differences are repeated at its weight). A core
   Search block set to "button only" keeps its own look: a box round a lone button would span the column.
   The house box stacks below 26rem; this rule outweighs that one, so the hero stays in a row down to 18rem. */
:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(.lbs-search, .wp-block-search:not(.wp-block-search__button-only) .wp-block-search__inside-wrapper) {
	--lbs-search-r: var(--lbs-radius-pill);
	flex-direction: row;
	gap: 0;
	padding: 0;
	border: 1px solid var(--lbs-border-strong);
	border-radius: var(--lbs-search-r);
	background: var(--lbs-white);
}
:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(.lbs-search__input, .wp-block-search__input) {
	height: calc(4rem - 2px);
	padding: 0 var(--lbs-space-5);
	border: 0;
	border-radius: var(--lbs-search-r);
	background: transparent;
	font-size: var(--lbs-fs-md);
}
/* The field's own ring gives way to the box's only where the browser can draw that one (:has). */
@supports selector(:has(a)) {
	:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(.lbs-search__input, .wp-block-search__input):focus-visible { outline: none; }
	:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(.lbs-search, .wp-block-search__inside-wrapper):has(:is(.lbs-search__input, .wp-block-search__input):focus-visible) {
		outline: var(--lbs-focus-ring) solid var(--lbs-focus);
		outline-offset: 2px;
	}
}
:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(.lbs-search__button, .wp-block-search__button) {
	height: calc(4rem - 2px);
	padding-inline: var(--lbs-space-6);
	border-radius: var(--lbs-search-r);
	font-size: var(--lbs-fs-md);
	text-transform: uppercase; /* "LEITA", as on dev1 (Kristinn, 2026-10-15): the hero's button only */
}
@container (width < 18rem) {
	:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(.lbs-search, .wp-block-search__inside-wrapper) { --lbs-search-r: var(--lbs-radius-control); flex-direction: column; }
	:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(.lbs-search__button, .wp-block-search__button) { --lbs-search-r: 0 0 calc(var(--lbs-radius-control) - 1px) calc(var(--lbs-radius-control) - 1px); }
}

/* Forms in content (Vefstaðall 7.6), written against plain HTML so that the output of any form tool can
   use it: within the page's text, comment forms, widgets, and anything marked class="lbs-form". All
   without weight (":where"), so that a form tool's own rules win where it has them.
   - Every field has a visible <label> (bold), above the field.
   - A hint (class "lbs-hint") sits between label and field, tied to the field with aria-describedby.
   - An error message (class "lbs-error-message") sits under the hint, starts with "Villa:" and says how
     to put it right; its field has aria-invalid="true" and gets a 2px frame in the error colour. A
     field the browser finds invalid after the visitor has used it (:user-invalid) gets the same frame.
   - Required fields say so in the label's text: "(nauðsynlegt)", or "(valfrjálst)" on the few that are
     not when most are. No asterisks.
   - Checkboxes and radio buttons are the browser's own, in the brand red; related ones are grouped in a
     <fieldset> with a <legend>.
   - class "lbs-field" on a wrapper stacks label, hint, error and field with small steps between. */
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="file"], [type="range"], [type="hidden"]), select, textarea) {
	width: 100%;
	max-width: 100%;
	min-height: var(--lbs-target);
	padding: var(--lbs-space-2) var(--lbs-space-3);
	border: 1px solid var(--lbs-border-strong);
	border-radius: var(--lbs-radius-control);
	background: var(--lbs-white);
	color: var(--lbs-text);
	font-size: var(--lbs-fs-sm);
	line-height: var(--lbs-lh-ui);
}
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(textarea) { min-height: calc(var(--lbs-target) * 3); }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(label, legend) { display: inline-block; margin-bottom: var(--lbs-space-1); font-weight: 700; }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(fieldset) { min-width: 0; margin: 0 0 var(--lbs-space-5); padding: 0; border: 0; }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(legend) { padding: 0; }
/* Choices: the label beside the box is ordinary text. */
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(input[type="checkbox"], input[type="radio"]) { width: 20px; height: 20px; margin: 0 var(--lbs-space-2) 0 0; vertical-align: -4px; accent-color: var(--lbs-red); }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(label:has(> input[type="checkbox"], > input[type="radio"]), input[type="checkbox"] + label, input[type="radio"] + label) { font-weight: 400; }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(.lbs-field) { display: grid; gap: var(--lbs-space-1); max-width: 32rem; margin: 0 0 var(--lbs-space-5); }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(.lbs-field) > :where(label) { margin: 0; }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(.lbs-hint) { display: block; color: var(--lbs-muted); font-size: var(--lbs-fs-sm); line-height: var(--lbs-lh-ui); }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(.lbs-error-message) { display: flex; align-items: flex-start; gap: var(--lbs-space-2); color: var(--lbs-error); font-weight: 700; line-height: var(--lbs-lh-ui); }
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(.lbs-error-message)::before {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	margin-top: 2px;
	background: currentColor;
	mask: var(--lbs-icon-error) center / 20px no-repeat;
}
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="file"], [type="range"], [type="hidden"]), select, textarea):where([aria-invalid="true"], :user-invalid) {
	padding: calc(var(--lbs-space-2) - 1px) calc(var(--lbs-space-3) - 1px);
	border: 2px solid var(--lbs-error);
}
:where(.entry-content, .comment-respond, .lbs-prose, .widget, .lbs-form) :where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="file"], [type="range"], [type="hidden"]), select, textarea):where(:disabled, [aria-disabled="true"]) {
	border-color: var(--lbs-border);
	background: var(--lbs-disabled-surface);
	color: var(--lbs-disabled-text);
	cursor: not-allowed;
}
/* Submit buttons in content look like the main button: components.css. */

/* LBS Core's request forms (lbs-core inc/forms.php: the block and Elementor widget "LBS form"). The rules above do
   the fields; these place the rest. The required mark "(nauðsynlegt)" in a label is plain weight; an error summary
   (an error notice listing links to the fields, focused after a sending with errors) and a notice that the request
   did not go through sit above the fields; a box and the sentence beside it wrap side by side; the send button gets
   room above it. The thank-you text is a notice in the service-answer look (components.css). */
.lbs-form__req { font-weight: 400; }
.lbs-form__summary { margin-bottom: var(--lbs-space-6); }
.lbs-form__summary ul { margin-bottom: 0; }
.lbs-form__choice {
	display: flex;
	align-items: flex-start;
	gap: var(--lbs-space-2);
}
.lbs-form .lbs-form__choice input[type="checkbox"] { flex: none; margin: 4px 0 0; }
.lbs-form__note { max-width: 32rem; margin: 0 0 var(--lbs-space-5); }
.lbs-form__note > :last-child { margin-bottom: 0; }
.lbs-form__actions { margin: var(--lbs-space-6) 0 0; }
.lbs-form-done { margin: var(--lbs-space-5) 0; }

/* The note LBS Core's forms.js puts over the page just before a form's time stamp runs out (a day after the page was
   made): the page behind it is dimmed and inert, the panel holds a heading, one sentence and the reload button, which
   has the focus. Above the header and its language list (header.css's ledger: 140 · 150); the drawer is a popover
   and cannot be open at that moment. */
.lbs-form-expired {
	position: fixed;
	inset: 0;
	z-index: 160;
	display: grid;
	place-items: center;
	padding: var(--lbs-gutter);
	background: var(--lbs-scrim);
}
.lbs-form-expired__panel {
	max-width: 32rem;
	padding: var(--lbs-space-5) var(--lbs-space-6);
	border: 1px solid var(--lbs-border-strong);
	border-top: 4px solid var(--lbs-red);
	background: var(--lbs-white);
	color: var(--lbs-text);
	box-shadow: 0 2px 12px color-mix(in srgb, var(--lbs-text) 22%, transparent);
}
.lbs-form-expired__panel h2 { margin: 0 0 var(--lbs-space-3); }
.lbs-form-expired__panel p { margin: 0 0 var(--lbs-space-5); }
html:has(.lbs-form-expired) { overflow: hidden; }


/* ── utilities.css ── */
/* Utilities */

/* Text for screen readers only. WordPress core prints this class in many places. */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
	word-wrap: normal !important;
}

/* The skip link becomes visible when it receives keyboard focus. */
.skip-link:focus {
	position: fixed !important;
	z-index: 100000;
	top: var(--lbs-space-2);
	left: var(--lbs-space-2);
	width: auto;
	height: auto;
	margin: 0;
	padding: var(--lbs-space-3) var(--lbs-space-5);
	clip-path: none;
	background: var(--lbs-white);
	color: var(--lbs-text);
	font-weight: 500;
	box-shadow: 0 2px 10px rgb(0 0 0 / 0.15);
}

/* #main receives focus from the skip link; it needs no ring of its own. */
#main:focus { outline: 0; }

.lbs-icon { display: inline-block; vertical-align: middle; }


/* ── print.css ── */
@media print {
/* Print: content only. */
.lbs-header__tools,
.lbs-drawer,
.lbs-section-menu,
.skip-link,
.lbs-footer__site,
.lbs-footer__policies,
.lbs-footer__strip-social,
.post-navigation,
.pagination,
.comment-respond { display: none !important; }

body { display: block; color: #000; }
/* The section menu's two columns (layout.css, from 992px) would otherwise still apply on wide paper (landscape A4),
   leaving the text in the menu's narrow column once the menu is hidden. */
.lbs-with-section-menu { display: block; }
.lbs-header { border: 0; }
.lbs-footer { margin-top: 2em; padding: 1em 0 0; background: none; border-top: 1px solid #000; border-bottom: 0; }
/* On paper the footer is the shared strip's logo and contact lines (the library's address, phone and e-mail). */
.lbs-footer__strip { padding: 0; border: 0; }
.lbs-footer *::after { display: none; }
.lbs-container { max-width: none; padding: 0; }
/* The symbol after a link card's or wide tile's title (components.css) is a mask on a coloured ground, which paper
   does not print: the text arrow instead, and the rule below gives a link to another address its address in its
   place, without the mask cutting it off. */
:is(.lbs-card--link .lbs-card__title, .lbs-tile-wide__title) a::after { content: '\00a0\2192'; padding-right: 0; background: none; mask: none; color: #000; }
.entry-content a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.85em; word-break: break-all; }

/* Query Loop "Timeline": no line or rings on paper, smaller pictures, an entry kept on one page. */
.wp-block-query.is-style-lbs-timeline .wp-block-post-template { padding-left: 0; }
.wp-block-query.is-style-lbs-timeline .wp-block-post-template::before,
.wp-block-query.is-style-lbs-timeline .wp-block-post-template > li::before { display: none; }
.wp-block-query.is-style-lbs-timeline .wp-block-post-template > li { break-inside: avoid; }
.wp-block-query.is-style-lbs-timeline .wp-block-post-featured-image img { max-height: 4cm; }

}