/* ==========================================================================
   Vuku Auto — project layer on top of Styrk Theme + Styrk Blocks.
   Matches the "Vuku Bilsenter 2.0" design: graphite + concrete, Vuku red only
   on actions, Eurostile, one button family, emergency help always in reach.
   ========================================================================== */

/* Fallback sized to Eurostile (about 7% narrower than Helvetica Neue / Arial),
   so text barely reflows when the Adobe font swaps in (job page CLS was 0.117). */
@font-face { font-family: "vuku-fallback"; src: local("Helvetica Neue"), local("HelveticaNeue"), local("Arial"), local("ArialMT"); size-adjust: 93%; }

:root {
	--vuku-ink: #1C1E20;
	--vuku-ink-2: #26292C;
	--vuku-line-dark: #3A3E42;
	--vuku-paper: #EDEEEC;
	--vuku-paper-2: #E1E3E2;
	--vuku-card: #F7F7F6;
	--vuku-line: #C6CACB;
	--vuku-text-2: #35383B;
	--vuku-muted: #55595D;
	--vuku-red: #E00A14;
	--vuku-section-y: clamp(64px, 9vw, 128px);
	--vuku-gutter: clamp(16px, 5vw, 72px);
}

body { background: var(--vuku-paper); color: var(--vuku-ink); }

/* The Adobe kit only has Eurostile Regular, so every 600/700 was a browser
   fake bold, smeared and blurry. Render the real cut instead. */
html { font-synthesis-weight: none; }

/* --- Typography ----------------------------------------------------------
   Eurostile Extended is very wide: at 400 the word gaps disappear. Section
   headings use the 500 cut with extra word spacing; the page title uses 900. */
h1, h2, h3, h4 {
	font-family: eurostile-extended, eurostile, 'Arial Black', sans-serif;
	letter-spacing: 0.005em;
	word-spacing: 0.25em;
	text-wrap: balance;
}
h1 { font-weight: 900 !important; }
h2, h3, h4 { font-weight: 500 !important; }
h2 { font-size: clamp(26px, 2.9vw, 40px) !important; line-height: 1.15 !important; }
h3 { font-size: clamp(19px, 1.6vw, 23px) !important; line-height: 1.25 !important; }

/* --- Buttons: one family for every block --------------------------------- */
.cb-cta-btn,
.vuku-btn .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 0 24px !important;
	border: 2px solid transparent;
	border-radius: 3px !important;
	box-sizing: border-box;
	font-family: eurostile, vuku-fallback, 'Helvetica Neue', sans-serif;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	white-space: nowrap;
	text-decoration: none;
	transition: background-color .15s ease-out, color .15s ease-out, border-color .15s ease-out, filter .15s ease-out;
}
.cb-cta-btn svg { display: none; }
.cb-cta-btn:hover { filter: brightness(.92); }

/* Secondary = second button in a row: outlined in the section's text colour. */
.cb-cta-btn + .cb-cta-btn {
	background-color: transparent !important;
	border-color: currentColor;
	filter: none;
}
.cb-cta-btn + .cb-cta-btn:hover {
	background-color: color-mix(in srgb, currentColor 12%, transparent) !important;
}

/* Core buttons used in the help strip, reviews and contact sections. */
.vuku-btn--primary .wp-block-button__link { background: var(--vuku-red) !important; color: #FFFFFF !important; }
.vuku-btn--primary .wp-block-button__link:hover { filter: brightness(.92); }
.vuku-btn--dark .wp-block-button__link { background: var(--vuku-ink) !important; color: #FFFFFF !important; }
.vuku-btn--dark .wp-block-button__link:hover { background: var(--vuku-line-dark) !important; }
.vuku-btn--outline .wp-block-button__link { background: transparent !important; color: currentColor !important; border-color: currentColor; }
.vuku-btn--outline .wp-block-button__link:hover { background: color-mix(in srgb, currentColor 12%, transparent) !important; }
.vuku-btn--phone .wp-block-button__link::before,
.rh-cta::before {
	content: "";
	width: 20px;
	height: 20px;
	flex: none;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.vuku-btn--pin .wp-block-button__link::before {
	content: "";
	width: 20px;
	height: 20px;
	flex: none;
	background: var(--vuku-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wp-block-buttons.vuku-btns { gap: 12px; }

.cb-cta-btn:focus-visible,
.wp-block-button__link:focus-visible,
a:focus-visible {
	outline: 3px solid #2F80ED;
	outline-offset: 3px;
}

/* --- Header -------------------------------------------------------------- */
.rh-search-trigger { display: none !important; }
.rh-cta { display: inline-flex !important; align-items: center; gap: 10px; min-height: 48px; padding: 0 22px !important; border-radius: 3px !important; font-weight: 600; }

/* --- Side labels: vertical captions on section edges (signature move carried
   over from the old site). The anchors are set on the blocks. */
.wp-block-styrk-blocks-hero,
#verksted, #bilberging, #stasjon, #bobil { position: relative; }
.vuku-hero-home::after,
#verksted::after, #bilberging::after, #stasjon::after, #bobil::after {
	position: absolute;
	top: 50%;
	writing-mode: vertical-rl;
	transform: translateY(-50%) rotate(180deg);
	font: 500 13px/1 eurostile, sans-serif;
	letter-spacing: .18em;
	text-transform: uppercase;
	pointer-events: none;
	z-index: 3;
}
.vuku-hero-home::after { content: "Godkjent for alle bilmerker"; right: 28px; color: #C6CACB; }
#verksted::after { content: "Autoexperten-verksted"; left: 28px; color: var(--vuku-muted); }
#bilberging::after { content: "EU-kontroll til 7 500 kg"; right: 28px; color: #9EA3A7; }
#bobil::after { content: "Bobil til 7 500 kg"; right: 28px; color: var(--vuku-muted); }
#stasjon::after { content: "Godkjent elbilverksted"; left: 28px; color: var(--vuku-muted); }

/* --- Front-page hero: content low-left; help strip stays above the fold --- */
.vuku-hero-home {
	--hero-minh: calc(100svh - 100px - 96px) !important;
	min-height: calc(100svh - 100px - 96px) !important;
}
.wp-block-styrk-blocks-hero h1 { font-size: clamp(32px, 4.6vw, 64px) !important; line-height: 1.08 !important; }

/* --- Help strip directly under the hero ---------------------------------- */
.vuku-help-strip {
	background: var(--vuku-ink) !important;
	color: #FFFFFF;
	border-top: 1px solid var(--vuku-line-dark);
	padding: 20px var(--vuku-gutter) !important;
	margin: 0 !important;
}
.vuku-help-strip > .wp-block-columns { max-width: 1296px; margin: 0 auto !important; align-items: center !important; gap: 16px 32px; }
.vuku-help-strip h2 { font-size: 20px !important; margin: 0 !important; color: #FFFFFF; }
.vuku-help-strip p { margin: 4px 0 0 !important; color: #C6CACB; }
.vuku-help-strip .wp-block-buttons { justify-content: flex-end; }

/* --- Split sections ------------------------------------------------------ */
.cb-block-split { padding-top: var(--vuku-section-y) !important; padding-bottom: var(--vuku-section-y) !important; }
.cb-split-image-wrap, .cb-split-image-wrap img, .cb-split-image {
	border-radius: 3px !important;
	box-shadow: none !important;
}
.cb-split-image { aspect-ratio: 5 / 4; object-fit: cover; }
.cb-block-split ul {
	list-style: none;
	padding: 0 !important;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 24px;
	font-weight: 500;
}
.cb-block-split ul li { position: relative; padding-left: 30px; margin: 0 !important; }
.cb-block-split ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .2em;
	width: 20px;
	height: 20px;
	background: var(--vuku-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.vuku-list-1col ul, ul.vuku-list-1col { grid-template-columns: 1fr; }
.vuku-bignum { margin: 4px 0 !important; }
/* A big number: a phone link, or plain text such as a price. */
.vuku-bignum a, .vuku-bignum:not(:has(a)) {
	font: 500 clamp(34px, 4vw, 54px)/1.1 eurostile-extended, eurostile, sans-serif;
	color: #FFFFFF !important;
	text-decoration: none;
	word-spacing: .1em;
}

/* --- Trust row: flat, left-aligned, no cards ----------------------------- */
.wp-block-styrk-blocks-stats-row { padding-top: clamp(40px, 5vw, 64px) !important; padding-bottom: clamp(40px, 5vw, 64px) !important; border-bottom: 1px solid var(--vuku-line); }
.cb-stats-grid { gap: 28px !important; }
.cb-stat {
	align-items: flex-start !important;
	text-align: left !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	gap: 4px !important;
}
.cb-stat-value { font: 500 28px/1.15 eurostile-extended, eurostile, sans-serif !important; color: var(--vuku-ink) !important; }
.cb-stat-label { font-size: 16px !important; font-weight: 400 !important; color: var(--vuku-muted) !important; }

/* --- Process: compact horizontal steps ----------------------------------- */
.cb-process { padding-top: var(--vuku-section-y) !important; padding-bottom: var(--vuku-section-y) !important; }
.cb-process__list {
	display: grid !important;
	grid-template-columns: repeat(var(--vuku-steps, 4), 1fr);
	gap: 32px !important;
	border: 0 !important;
}
.cb-process__step {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	padding: 0 !important;
	border: 0 !important;
}
.cb-process__step-marker { width: auto !important; min-width: 0 !important; }
.cb-process__step-number {
	font: 500 28px/1 eurostile-extended, eurostile, sans-serif !important;
	color: var(--vuku-red) !important;
}
.cb-process__step-title { font: 600 19px/1.3 eurostile, sans-serif !important; word-spacing: 0; margin: 0 !important; }
.cb-process__step-text { color: var(--vuku-text-2); font-size: 16px; }
.vuku-steps-3 { --vuku-steps: 3; }

/* --- Reviews (core blocks) ----------------------------------------------- */
.vuku-reviews { background: var(--vuku-ink-2) !important; color: #FFFFFF; padding: var(--vuku-section-y) var(--vuku-gutter) !important; margin: 0 !important; }
.vuku-reviews > * { max-width: 1296px; margin-left: auto !important; margin-right: auto !important; }
.vuku-reviews h2 { color: #FFFFFF; margin: 0 0 40px !important; }
.vuku-reviews .vuku-quote p:first-child { font-size: 22px; line-height: 1.4; font-weight: 600; margin: 0 0 14px; }
.vuku-reviews .vuku-quote p:last-child { color: #C6CACB; margin: 0; }
.vuku-reviews a { color: #FFFFFF; font-weight: 600; }

/* --- Team ---------------------------------------------------------------- */
.wp-block-styrk-blocks-employee-grid { padding-top: var(--vuku-section-y) !important; padding-bottom: var(--vuku-section-y) !important; }
.wp-block-styrk-blocks-employee-grid img { border-radius: 3px !important; }

/* --- Contact (core blocks) ----------------------------------------------- */
.vuku-contact { background: var(--vuku-paper-2) !important; padding: var(--vuku-section-y) var(--vuku-gutter) !important; margin: 0 !important; }
.vuku-contact > .wp-block-columns { max-width: 1296px; margin: 0 auto !important; gap: 40px; }
.vuku-contact h3 { font: 700 17px/1.4 eurostile, sans-serif !important; word-spacing: 0; margin: 0 !important; }
.vuku-contact p { margin: 0 0 14px !important; }
.vuku-contact a[href^="tel:"] { display: inline-block; padding: 10px 0; font-weight: 600; }
.vuku-contact .vuku-muted { color: var(--vuku-muted); font-size: 15px; }

/* --- Footer: one quiet graphite band ------------------------------------- */
.site-footer {
	background: var(--vuku-ink) !important;
	background-image: none !important;
	color: #C6CACB;
}
.site-footer::before, .site-footer::after { display: none !important; }
.site-footer a { color: #FFFFFF; }

/* --- Mobile bottom bar (printed by the theme on every page) -------------- */
.vuku-mbar { display: none; }

/* --- Bilberging page ----------------------------------------------------- */
.vuku-service-hero {
	--hero-bg: var(--vuku-ink) !important;
	--hero-minh: auto !important;
	min-height: 0 !important;
	background: var(--vuku-ink) !important;
}
.vuku-service-hero .cb-hero__breadcrumb,
.vuku-service-hero .cb-hero__breadcrumb a { color: #C6CACB !important; }
.vuku-service-hero .cb-hero-aside { align-self: stretch; border-left: 0 !important; padding: 0 !important; }
.vuku-service-hero .cb-hero-aside__img {
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	max-height: 440px;
	object-fit: cover;
	border-radius: 3px;
}
.vuku-service-hero h1 { font-size: clamp(28px, 3.6vw, 50px) !important; }

/* "Mens du venter": plain columns, no cards, no tinted icon boxes. */
.vuku-wait { padding-top: clamp(48px, 6vw, 80px) !important; padding-bottom: clamp(48px, 6vw, 80px) !important; }
.vuku-wait [class*="card"] { background: transparent !important; box-shadow: none !important; border: 0 !important; padding: 0 !important; }
.vuku-wait [class*="icon"] { background: transparent !important; color: var(--vuku-red) !important; padding: 0 !important; }
.vuku-wait h2 { text-align: left !important; }

/* --- Responsive ---------------------------------------------------------- */
@media (max-width: 900px) {
	.vuku-hero-home::after,
	#verksted::after, #bilberging::after, #stasjon::after, #bobil::after { display: none; }
	.cb-process__list { grid-template-columns: 1fr 1fr; }
	.vuku-help-strip .wp-block-buttons { justify-content: flex-start; }
}
@media (max-width: 640px) {
	:root { --vuku-gutter: 16px; }
	.cb-cta-btn,
	.vuku-btn,
	.vuku-btn .wp-block-button__link { width: 100% !important; }
	.wp-block-buttons.vuku-btns { flex-direction: column; align-items: stretch; }
	.cb-cta-btn + .cb-cta-btn { margin-left: 0 !important; }
	.cb-block-split ul { grid-template-columns: 1fr; }
	.cb-process__list { grid-template-columns: 1fr; }
	.cb-stats-grid { grid-template-columns: 1fr 1fr !important; }
	.vuku-mbar {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9990;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
		background: var(--vuku-ink);
		box-shadow: 0 -8px 24px rgba(0, 0, 0, .35);
	}
	.vuku-mbar a {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 52px;
		border-radius: 3px;
		border: 2px solid #FFFFFF;
		color: #FFFFFF;
		font-weight: 600;
		text-decoration: none;
	}
	.vuku-mbar a:first-child { background: var(--vuku-red); border-color: var(--vuku-red); }
	body:has(.vuku-mbar) { padding-bottom: 76px; }
}

/* --- Alignment: core-block sections share the Styrk content width ---------- */
.vuku-reviews > *,
.vuku-contact > .wp-block-columns,
.vuku-help-strip > .wp-block-columns {
	max-width: 1180px !important;
}

/* Trust row: the grid itself carries a card background in Styrk — drop it. */
.cb-stats-grid { background: transparent !important; box-shadow: none !important; border: 0 !important; }
.cb-stats-grid > * { background: transparent !important; }

/* Team cards: name + role as plain text, no pills or contact chips. */
.cb-employee-card { background: transparent !important; box-shadow: none !important; border: 0 !important; }
.cb-employee-photo, .cb-employee-photo img { border-radius: 3px !important; aspect-ratio: 4 / 5; object-fit: cover; }
.cb-employee-card__role {
	background: transparent !important;
	color: var(--vuku-muted) !important;
	border: 0 !important;
	padding: 0 !important;
	font-size: 15px !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}
.cb-employee-card__foot { display: none !important; }
.cb-employee-card h3, .cb-employee-identity h3 { font: 700 17px/1.3 eurostile, sans-serif !important; word-spacing: 0; }

/* Footer headings stay small labels, not section headings. */
.site-footer h2, .site-footer h3, .site-footer .site-footer__col-heading {
	font: 700 13px/1.4 eurostile, sans-serif !important;
	letter-spacing: .08em !important;
	word-spacing: 0 !important;
	text-transform: uppercase;
	color: #FFFFFF;
}

@media (max-width: 640px) {
	.cb-stat-value { font-size: 20px !important; overflow-wrap: anywhere; }
	.wp-block-styrk-blocks-employee-grid [class*="grid"] { grid-template-columns: 1fr !important; gap: 32px !important; } /* HiveMind: one card per row on phones */
	.vuku-wait [class*="grid"] { grid-template-columns: 1fr 1fr !important; }
}
.vuku-wait [class*="icon"] { border: 0 !important; box-shadow: none !important; }

/* Mobile gutter convention: 16px left/right in every Styrk block container. */
@media (max-width: 640px) {
	.px-13, .max-w-site-md { padding-left: 16px !important; padding-right: 16px !important; }
}
@media (max-width: 640px) {
	.cb-process__inner { padding-left: 0 !important; padding-right: 0 !important; }
}
@media (max-width: 640px) {
	.cb-process { padding-left: 0 !important; padding-right: 0 !important; }
}

/* ==========================================================================
   v2 components (research pass: Polestar tiles + action list, Fixter reviews)
   ========================================================================== */

/* --- Header: original-colour logo large enough to read; on phones the call
   button is icon-only because the bottom bar already carries the full CTA. */
.rh-logo { height: 64px !important; width: auto !important; max-height: none !important; }
@media (max-width: 900px) {
	.rh-logo { height: 52px !important; }
	.rh-cta { width: 48px; height: 48px; min-height: 48px; padding: 0 !important; justify-content: center; font-size: 0 !important; gap: 0; }
	.rh-cta::before { width: 22px; height: 22px; }
	.rh-mobile-toggle { width: 48px !important; height: 48px !important; border-radius: 3px !important; }
}

/* --- Employee modal: same 3px corner language as everything else. */
.cb-employee-modal__panel, .cb-employee-modal__panel img { border-radius: 3px !important; }

/* --- Section header row: heading left, action right. */
.vuku-section-head { align-items: flex-end !important; margin-bottom: clamp(32px, 4vw, 56px) !important; }
.vuku-section-head .wp-block-buttons { justify-content: flex-end; }
.vuku-section-head h2 { margin: 0 !important; }

/* Shared container for core-block sections. */
.vuku-usp, .vuku-steps, .vuku-reviews2, .vuku-actions {
	padding-left: var(--vuku-gutter) !important;
	padding-right: var(--vuku-gutter) !important;
	margin: 0 !important;
}
.vuku-usp > *, .vuku-steps > *, .vuku-reviews2 > *, .vuku-actions > * {
	max-width: 1180px;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* --- Icons (mask so they take currentColor / red) ------------------------ */
.vuku-ico { width: 40px; height: 40px; margin: 0 0 28px !important; background: var(--vuku-red);
	-webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
.vuku-ico--star   { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M12 2.8l2.8 5.9 6.4.8-4.7 4.4 1.2 6.4L12 17.1l-5.7 3.2 1.2-6.4L2.8 9.5l6.4-.8z'/%3E%3C/svg%3E"); }
.vuku-ico--shield { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M12 3l8 3v6c0 4.5-3.4 8.3-8 9-4.6-.7-8-4.5-8-9V6z'/%3E%3Cpath d='M8.5 12l2.5 2.5 4.5-5'/%3E%3C/svg%3E"); }
.vuku-ico--wrench { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0 5 5L21 12.6a6 6 0 0 1-7.7 1.6L6 21.5 2.5 18l7.3-7.3A6 6 0 0 1 11.4 3z'/%3E%3C/svg%3E"); }
.vuku-ico--truck  { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M2 16V6h11v10M13 9h4l4 4v3h-8'/%3E%3Ccircle cx='6.5' cy='17.5' r='2'/%3E%3Ccircle cx='17.5' cy='17.5' r='2'/%3E%3C/svg%3E"); }

/* --- USP tiles: hairline grid, generous height ---------------------------- */
.vuku-usp { background: var(--vuku-paper) !important; padding-top: 0 !important; padding-bottom: 0 !important; }
.vuku-usp__grid {
	gap: 0 !important;
	border-top: 1px solid var(--vuku-line);
	border-bottom: 1px solid var(--vuku-line);
}
.vuku-usp__grid > .wp-block-column {
	padding: clamp(32px, 4vw, 56px) clamp(20px, 2.4vw, 36px) !important;
	border-left: 1px solid var(--vuku-line);
	transition: background-color .2s ease-out;
}
.vuku-usp__grid > .wp-block-column:first-child { border-left: 0; padding-left: 0 !important; }
.vuku-usp__value { font-size: clamp(20px, 1.8vw, 26px) !important; margin: 0 0 10px !important; }
.vuku-usp__label { color: var(--vuku-muted); margin: 0 !important; font-size: 16px; line-height: 1.5; }

/* --- Steps: oversized outline numerals ----------------------------------- */
.vuku-steps { padding-top: var(--vuku-section-y) !important; padding-bottom: var(--vuku-section-y) !important; }
.vuku-steps__grid { gap: 0 !important; }
.vuku-steps__grid > .wp-block-column { padding: 0 clamp(16px, 2vw, 32px) !important; border-left: 1px solid var(--vuku-line); }
.vuku-steps__grid > .wp-block-column:first-child { padding-left: 0 !important; border-left: 0; }
.vuku-step__num {
	font: 900 clamp(72px, 8vw, 120px)/.9 eurostile-extended, eurostile, sans-serif !important;
	color: var(--vuku-red) !important;
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: 1.5px var(--vuku-ink);
	margin: 0 0 28px !important;
}
.vuku-steps__grid > .wp-block-column:hover .vuku-step__num { -webkit-text-stroke-color: var(--vuku-red); }
.vuku-step__title { font: 500 20px/1.25 eurostile-extended, eurostile, sans-serif !important; word-spacing: .2em; margin: 0 0 10px !important; }
.vuku-steps p:not(.vuku-step__num) { color: var(--vuku-text-2); margin: 0; }

/* --- Reviews: score summary + roomy review list -------------------------- */
.vuku-reviews2 { background: var(--vuku-ink-2) !important; color: #FFFFFF; padding-top: var(--vuku-section-y) !important; padding-bottom: var(--vuku-section-y) !important; }
.vuku-reviews2 h2 { color: #FFFFFF; margin: 0 0 32px !important; }
.vuku-reviews__grid { gap: clamp(40px, 6vw, 96px) !important; }
.vuku-reviews__summary { flex-basis: 34% !important; flex-grow: 0 !important; }
.vuku-score { font: 900 clamp(80px, 9vw, 128px)/.9 eurostile-extended, eurostile, sans-serif !important; margin: 0 0 12px !important; }
.vuku-score__label { color: #C6CACB; margin: 8px 0 28px !important; }
.vuku-stars { display: inline-block; width: 120px; height: 22px; background: var(--vuku-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 22'%3E%3Cg%3E%3Cpath d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(24 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(48 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(72 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(96 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3C/g%3E%3C/svg%3E") left center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 22'%3E%3Cg%3E%3Cpath d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(24 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(48 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(72 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3Cpath transform='translate(96 0)' d='M11 1l3 6.2 6.8.8-5 4.7 1.3 6.8L11 16.1l-6.1 3.4 1.3-6.8-5-4.7 6.8-.8z'/%3E%3C/g%3E%3C/svg%3E") left center / contain no-repeat; }
.vuku-reviews__list { flex-direction: column !important; gap: 0 !important; }
.vuku-review { padding: 32px 0 !important; border-top: 1px solid var(--vuku-line-dark); }
.vuku-review:first-child { border-top: 0; padding-top: 0 !important; }
.vuku-review p { margin: 0; }
.vuku-review .vuku-stars { width: 90px; height: 16px; margin-bottom: 14px; }
.vuku-review__title { font: 500 20px/1.3 eurostile-extended, eurostile, sans-serif !important; color: #FFFFFF; margin: 0 0 10px !important; word-spacing: .2em; }
.vuku-review__text { font-size: 19px; line-height: 1.6; color: #E4E6E7; }
.vuku-review__name { margin-top: 14px !important; color: #9EA3A7; font-size: 15px; }

/* --- Bensinstasjon: photo runs to the viewport edge, hours as a table ---- */
.vuku-station .cb-split-image, .vuku-station .cb-split-image-wrap { border-radius: 0 !important; aspect-ratio: auto; }
.vuku-hours { border-collapse: collapse; width: 100%; max-width: 420px; margin: 4px 0 8px; }
.vuku-hours th, .vuku-hours td { text-align: left; padding: 12px 0; border-bottom: 1px solid var(--vuku-line); font-weight: 400; }
.vuku-hours td { text-align: right; font-variant-numeric: tabular-nums; }
.vuku-hours tr.is-today th, .vuku-hours tr.is-today td { font-weight: 700; color: var(--vuku-ink); }
.vuku-open-status { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; margin: 0 !important; }
.vuku-open-status::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #2E9E5B; }
.vuku-open-status.is-closed::before { background: var(--vuku-muted); }

/* --- Action list before the footer: oversized typographic links ---------- */
.vuku-actions { background: var(--vuku-paper) !important; padding-top: clamp(56px, 7vw, 104px) !important; padding-bottom: clamp(56px, 7vw, 104px) !important; }
.vuku-action { margin: 0 !important; border-bottom: 1px solid var(--vuku-line); }
.vuku-action:first-child { border-top: 1px solid var(--vuku-line); }
.vuku-action a {
	display: grid;
	grid-template-columns: 1fr auto 48px;
	align-items: center;
	gap: 24px;
	padding: clamp(18px, 2.4vw, 32px) 0;
	color: var(--vuku-ink) !important;
	text-decoration: none;
}
.vuku-action a::after {
	content: "";
	width: 32px;
	height: 32px;
	justify-self: end;
	background: var(--vuku-ink);
	transition: transform .2s ease-out, background-color .2s ease-out;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.vuku-action a:hover::after { transform: translateX(6px); background: var(--vuku-red); }
.vuku-action__label { font: 500 clamp(28px, 4.4vw, 64px)/1.05 eurostile-extended, eurostile, sans-serif; word-spacing: .2em; }
.vuku-action__sub { color: var(--vuku-muted); font-size: 16px; text-align: right; }

/* --- Footer v2 ------------------------------------------------------------ */
.vuku-footer { padding: clamp(56px, 7vw, 96px) var(--vuku-gutter) 0 !important; }
.vuku-footer > * { max-width: 1180px; margin-left: auto !important; margin-right: auto !important; }
.vuku-footer__cols { gap: clamp(32px, 4vw, 64px) !important; padding-bottom: clamp(40px, 5vw, 64px); }
/* White-only logo, big enough that the small slogan under the wordmark reads. */
.vuku-footer .site-footer__logo-img { height: 120px !important; width: auto !important; max-width: none !important; filter: none !important; }
.vuku-footer .site-footer__logo { margin: 0 0 20px !important; }
.vuku-footer__brand p, .vuku-footer__brand { color: #C6CACB; max-width: 320px; }
.vuku-footer__heading { margin: 0 0 18px !important; }
.vuku-footer__links { list-style: none; padding: 0 !important; margin: 0 !important; display: grid; gap: 4px; }
.vuku-footer__links a, .vuku-footer__contact a { display: inline-block; padding: 8px 0; color: #FFFFFF; text-decoration: none; }
.vuku-footer__links a:hover, .vuku-footer__contact a:hover { color: #FFFFFF; text-decoration: underline; text-underline-offset: 4px; }
.vuku-footer p { margin: 0 0 14px; color: #C6CACB; }
.vuku-footer__bar {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 28px;
	align-items: center;
	padding: 22px 0 !important;
	border-top: 1px solid var(--vuku-line-dark);
	font-size: 14px;
	color: #9EA3A7;
}
.vuku-footer__bar > :last-child { margin-left: auto; }

/* --- Responsive for v2 ---------------------------------------------------- */
@media (max-width: 900px) {
	.vuku-usp__grid { display: grid !important; grid-template-columns: 1fr 1fr; }
	.vuku-usp__grid > .wp-block-column { border-left: 0; border-top: 1px solid var(--vuku-line); padding-left: 0 !important; }
	.vuku-usp__grid > .wp-block-column:nth-child(-n+2) { border-top: 0; }
	.vuku-steps__grid { display: grid !important; grid-template-columns: 1fr 1fr; gap: 40px 0 !important; }
	.vuku-steps__grid > .wp-block-column:nth-child(3) { padding-left: 0 !important; border-left: 0; }
	.vuku-action a { grid-template-columns: 1fr 40px; }
	.vuku-action__sub { display: none; }
	.vuku-footer__cols { display: grid !important; grid-template-columns: 1fr 1fr; }
	.vuku-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
	.vuku-usp__grid { grid-template-columns: 1fr; }
	.vuku-usp__grid > .wp-block-column:nth-child(2) { border-top: 1px solid var(--vuku-line); }
	.vuku-steps__grid { grid-template-columns: 1fr; }
	.vuku-steps__grid > .wp-block-column { padding-left: 0 !important; border-left: 0; }
	.vuku-step__num { font-size: 72px !important; margin-bottom: 16px !important; }
	.vuku-section-head .wp-block-buttons { justify-content: flex-start; }
	.vuku-footer__cols { grid-template-columns: 1fr; }
	.vuku-footer .site-footer__logo-img { height: 96px !important; }
	.vuku-footer__bar > :last-child { margin-left: 0; }
}
.vuku-footer__links a, .vuku-footer__contact a { padding: 11px 0; }
.cb-hero__breadcrumb a { display: inline-block; padding: 10px 0; }
.vuku-action { max-width: 1180px; margin-left: auto !important; margin-right: auto !important; }
#stasjon::after { display: none; }
@media (max-width: 900px) {
	.rh-cta { margin-left: auto !important; }
	.rh-mobile-toggle { border: 1px solid var(--vuku-line-dark) !important; }
}
/* Same-background neighbours: don't stack two section paddings. */
.vuku-steps + .cb-block-split { padding-top: 0 !important; }

/* ==========================================================================
   v3 — QA pass: one interaction model for every button, hover affordances,
   footer hierarchy, readable hours, structured contact.
   ========================================================================== */

/* --- Buttons: identical states everywhere --------------------------------
   Primary   (red):      hover = deeper red, text stays pure white.
   Secondary (outline):  hover = fills with the ink colour of its context and
                         the text inverts (light section: ink fill/white text;
                         dark section: white fill/ink text).
   Focus:    3px blue ring, 3px offset, on every button. No underlines, no
             brightness filters (they grey the label). */
:root { --vuku-red-hover: #B30811; }
.cb-cta-btn, .vuku-btn .wp-block-button__link, .rh-cta, .vuku-mbar a {
	text-decoration: none !important;
	filter: none !important;
	transition: background-color .15s ease-out, color .15s ease-out, border-color .15s ease-out !important;
}
/* primary */
.cb-cta-btn:first-child:hover,
.vuku-btn--primary .wp-block-button__link:hover,
.rh-cta:hover,
.vuku-mbar a:first-child:hover {
	background-color: var(--vuku-red-hover) !important;
	border-color: var(--vuku-red-hover) !important;
	color: #FFFFFF !important;
}
/* the dark-filled single buttons (Veibeskrivelse, Ring Gøran, Ring 74…) */
.vuku-btn--dark .wp-block-button__link:hover,
.cb-cta-btn[style*="#1C1E20"]:first-child:hover {
	background-color: #3A3E42 !important;
	border-color: #3A3E42 !important;
	color: #FFFFFF !important;
}
/* secondary — light context */
.cb-cta-btn + .cb-cta-btn,
.vuku-btn--outline .wp-block-button__link {
	background-color: transparent !important;
	border: 2px solid var(--vuku-ink) !important;
	color: var(--vuku-ink) !important;
}
.cb-cta-btn + .cb-cta-btn:hover,
.vuku-btn--outline .wp-block-button__link:hover {
	background-color: var(--vuku-ink) !important;
	color: #FFFFFF !important;
}
/* secondary — dark context */
.wp-block-styrk-blocks-hero .cb-cta-btn + .cb-cta-btn,
#bilberging .cb-cta-btn + .cb-cta-btn,
.vuku-help-strip .vuku-btn--outline .wp-block-button__link,
.vuku-reviews2 .vuku-btn--outline .wp-block-button__link,
.vuku-mbar a + a {
	border-color: #FFFFFF !important;
	color: #FFFFFF !important;
}
.wp-block-styrk-blocks-hero .cb-cta-btn + .cb-cta-btn:hover,
#bilberging .cb-cta-btn + .cb-cta-btn:hover,
.vuku-help-strip .vuku-btn--outline .wp-block-button__link:hover,
.vuku-reviews2 .vuku-btn--outline .wp-block-button__link:hover,
.vuku-mbar a + a:hover {
	background-color: #FFFFFF !important;
	color: var(--vuku-ink) !important;
}
.vuku-btn--pin .wp-block-button__link:hover::before { background: var(--vuku-red); }
/* focus */
.cb-cta-btn:focus-visible, .wp-block-button__link:focus-visible, .rh-cta:focus-visible, .vuku-mbar a:focus-visible {
	outline: 3px solid #2F80ED !important;
	outline-offset: 3px !important;
}

/* --- Mobile header call button: icon dead-centre (inline gap removed) ---- */
@media (max-width: 900px) {
	.rh-cta { gap: 0 !important; }
	.rh-cta::before { margin: 0 !important; }
}

/* --- USP tiles: subtle hover lift ---------------------------------------- */
.vuku-usp__grid > .wp-block-column { transition: background-color .2s ease-out; }
.vuku-usp__grid > .wp-block-column:hover { background-color: #F4F5F3; }
.vuku-usp__grid > .wp-block-column .vuku-ico { transition: transform .2s ease-out; }
.vuku-usp__grid > .wp-block-column:hover .vuku-ico { transform: translateY(-3px); }

/* --- Team cards: show they open a profile --------------------------------- */
.cb-employee-card { cursor: pointer; }
.cb-employee-photo { overflow: hidden; border-radius: 3px; }
.cb-employee-photo img { transition: transform .35s ease-out, filter .35s ease-out; }
.cb-employee-card:hover .cb-employee-photo img,
.cb-employee-card:focus-within .cb-employee-photo img { transform: scale(1.04); }
.cb-employee-card h3, .cb-employee-identity h3 { transition: color .15s ease-out; }
.cb-employee-card:hover h3 { color: var(--vuku-red) !important; text-decoration: underline; text-underline-offset: 4px; }
.cb-employee-card__trigger:focus-visible { outline: 3px solid #2F80ED; outline-offset: 3px; }

/* --- Footer: category headings clearly above their links ----------------- */
.vuku-footer__heading {
	color: #FFFFFF !important;
	font: 700 14px/1.3 eurostile, sans-serif !important;
	letter-spacing: .1em !important;
	padding-bottom: 14px !important;
	margin: 0 0 18px !important;
	border-bottom: 1px solid var(--vuku-line-dark);
}
.vuku-footer__links a { color: #C6CACB !important; font-size: 16px; }
.vuku-footer__links a:hover { color: #FFFFFF !important; }
.vuku-footer p { line-height: 1.5; }
.vuku-footer__hours p, .vuku-footer__contact p { margin: 0 0 20px !important; }
.vuku-footer .vuku-label {
	display: block;
	color: #9EA3A7;
	font-size: 13px;
	letter-spacing: .04em;
	margin-bottom: 4px;
}

/* --- Contact section: one card per department ---------------------------- */
.vuku-contact h2 { margin: 0 0 8px !important; }
.vuku-contact .vuku-btns { margin-top: 24px; }
.vuku-contact__cards { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 0 !important; border-top: 1px solid var(--vuku-line); }
.vuku-contact__card { padding: 28px clamp(16px, 2vw, 28px) !important; border-left: 1px solid var(--vuku-line); }
.vuku-contact__card:first-child { border-left: 0; padding-left: 0 !important; }
.vuku-contact__dept { font: 700 13px/1.3 eurostile, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--vuku-muted); margin: 0 0 14px !important; }
.vuku-contact__name { font-size: 17px; margin: 0 0 4px !important; }
.vuku-contact__phone { margin: 0 !important; }
.vuku-contact__phone a {
	display: inline-block;
	padding: 6px 0;
	font: 500 clamp(22px, 2vw, 28px)/1.2 eurostile-extended, eurostile, sans-serif;
	word-spacing: .05em;
	color: var(--vuku-ink) !important;
	text-decoration: none !important;
	border-bottom: 2px solid transparent;
	transition: border-color .15s ease-out, color .15s ease-out;
}
.vuku-contact__phone a:hover { color: var(--vuku-red) !important; border-bottom-color: currentColor; }
.vuku-contact__phone + .vuku-contact__phone { margin-top: 4px !important; }
.vuku-contact .vuku-hours { margin-top: 8px; max-width: none; }

/* --- Section head: room between heading and its action ------------------- */
.vuku-section-head { gap: 20px !important; }

@media (max-width: 900px) {
	.vuku-contact__cards { grid-template-columns: 1fr; }
	.vuku-contact__card { border-left: 0; border-bottom: 1px solid var(--vuku-line); padding-left: 0 !important; padding-right: 0 !important; }
}
.vuku-contact > * { max-width: 1180px; margin-left: auto !important; margin-right: auto !important; }
.vuku-contact__hours { margin-top: clamp(32px, 4vw, 48px) !important; }
.vuku-contact__hours .vuku-hours { max-width: 560px; }
.vuku-contact__addr { color: var(--vuku-text-2); }
.vuku-contact__addr a { color: var(--vuku-ink); }
/* Styrk's default button hover adds an underline; Vuku buttons change fill
   instead, so the underline is removed (higher specificity than the plugin). */

.vuku-contact p.vuku-contact__phone { margin: 0 !important; }
.vuku-contact p.vuku-contact__name { margin: 0 0 6px !important; }
.vuku-contact__phone a { font-size: clamp(22px, 1.9vw, 26px); }
/* Team: name and role flush with the photo edge. */
.cb-employee-card, .cb-employee-card [class*="body"], .cb-employee-identity { padding-left: 0 !important; padding-right: 0 !important; }
.cb-employee-card__trigger > .p-6 { padding: 18px 0 0 !important; }

/* ==========================================================================
   v4 — header, Bilberging hero, wait cards, step tiles
   ========================================================================== */

/* Header: logo variant without the slogan (slogan lives in the footer),
   so the wordmark itself is large; CTA label at body size, not a caption. */
.rh-logo { height: 52px !important; }
.rh-cta {
	min-height: 52px !important;
	padding: 0 26px !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	gap: 10px !important;
}
.rh-cta::before { width: 22px !important; height: 22px !important; }
@media (max-width: 900px) {
	.rh-logo { height: 42px !important; }
	.rh-cta { width: 52px; height: 52px; padding: 0 !important; font-size: 0 !important; gap: 0 !important; }
	.rh-mobile-toggle { width: 52px !important; height: 52px !important; }
}

/* Bilberging hero: photo runs edge to edge on the right half at full hero
   height (no floating thumbnail), text gets the left half. */
.vuku-service-hero { position: relative; overflow: hidden; }
@media (min-width: 1024px) {
	/* A sub-page hero fills the screen under the header, so the page opens on
	   one complete picture at every desktop size (incl. XXL). */
	.vuku-service-hero { min-height: max(560px, calc(100svh - var(--cb-header-h, 100px))) !important; display: flex; align-items: center; }
	.vuku-service-hero .cb-hero-content { max-width: 52%; }
	.vuku-service-hero .cb-hero-aside {
		position: absolute !important;
		top: 0;
		right: 0;
		bottom: 0;
		width: 42vw;
		max-height: none;
		margin: 0 !important;
	}
	.vuku-service-hero .cb-hero-aside__img {
		width: 100% !important;
		height: 100% !important;
		max-height: none !important;
		border-radius: 0 !important;
		object-fit: cover;
	}
}
@media (max-width: 1023px) {
	.vuku-service-hero .cb-hero-aside__img { border-radius: 0 !important; aspect-ratio: 16 / 10; height: auto !important; }
	.vuku-service-hero .cb-hero-aside { margin-left: calc(-1 * var(--vuku-gutter)) !important; margin-right: calc(-1 * var(--vuku-gutter)) !important; }
}
/* Supporting facts under the buttons: readable size, real icons. */
.vuku-service-hero .cb-hero__details { gap: 12px 32px !important; margin-top: 28px !important; }
.vuku-service-hero .cb-hero__detail { font-size: 17px !important; line-height: 1.4; color: #E4E6E7 !important; gap: 12px !important; }
.vuku-service-hero .cb-hero__detail-icon, .vuku-service-hero .cb-hero__detail-icon svg { width: 22px !important; height: 22px !important; }

/* "Mens du venter": information, not links — no hover effect at all. */
.vuku-wait .cb-feature-card,
.vuku-wait .cb-feature-card:hover { transform: none !important; box-shadow: none !important; background: transparent !important; }
.vuku-wait .cb-feature-card::before,
.vuku-wait .cb-feature-card::after,
.vuku-wait .cb-feature-card:hover::after,
.vuku-wait .cb-block-features::before { display: none !important; content: none !important; }
.vuku-wait .cb-feature-card [class*="icon"] svg { width: 32px !important; height: 32px !important; }

/* Step tiles: each step is a tile, the row fills the section width. */
.vuku-steps__grid { gap: 16px !important; }
.vuku-steps__grid > .wp-block-column,
.vuku-steps__grid > .wp-block-column:first-child {
	flex: 1 1 0 !important;
	background: var(--vuku-card);
	border: 0 !important;
	border-radius: 3px;
	padding: clamp(28px, 3vw, 44px) !important;
	display: flex;
	flex-direction: column;
}
.vuku-step__num { -webkit-text-stroke: 1.5px var(--vuku-red); margin-bottom: clamp(32px, 4vw, 56px) !important; }
.vuku-steps__grid > .wp-block-column:hover .vuku-step__num { -webkit-text-fill-color: currentColor; -webkit-text-stroke-color: var(--vuku-red); }
.vuku-steps p:not(.vuku-step__num) { max-width: 36ch; }
@media (max-width: 900px) {
	.vuku-steps__grid { gap: 12px !important; }
}
@media (min-width: 1024px) {
	/* The aside is positioned inside the content rail; push it out to the
	   viewport edge so the photo truly bleeds. */
	.vuku-service-hero .cb-hero-aside { right: calc((100% - 100vw) / 2) !important; }
}
/* One label size for every button. */
.cb-cta-btn, .vuku-btn .wp-block-button__link, .vuku-mbar a { font-size: 17px !important; }
@media (max-width: 1023px) {
	.vuku-service-hero .cb-hero-aside {
		width: 100vw !important;
		max-width: none !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: 0 !important;
	}
	.vuku-service-hero .cb-hero-aside__img { width: 100% !important; }
	.vuku-service-hero { padding-top: 32px !important; }
	.vuku-service-hero .cb-hero-split { padding-top: 0 !important; }
}
/* Bilberging hero on phones: the plugin's 140px top padding is for an
   overlay header; this hero sits under a solid header. */
@media (max-width: 1023px) {
	.vuku-service-hero .cb-hero__main { padding-top: 32px !important; }
}
/* Contact head: buttons centred on the heading + address block, with clear
   space above the department cards' rule. */
.vuku-contact > .vuku-section-head {
	align-items: center !important;
	margin-bottom: clamp(32px, 4vw, 48px) !important;
}
.vuku-contact .vuku-section-head .vuku-btns { margin-top: 0 !important; }
.vuku-contact .vuku-section-head .wp-block-column { align-self: center !important; }

/* --- Header CTA in capitals -------------------------------------------- */
.rh-cta { text-transform: uppercase !important; letter-spacing: .06em !important; font-size: 15px !important; }

/* --- Bensinstasjon: true split. Photo fills its half edge-to-edge and the
   full section height; the text half is vertically centred with air. ------- */
#stasjon.vuku-station { padding: 0 !important; }
#stasjon .cb-split-cols {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	align-items: stretch !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	gap: 0 !important;
}
#stasjon .cb-split-image-wrap {
	width: 100% !important;
	height: 100%;
	min-height: clamp(460px, 44vw, 680px);
	margin: 0 !important;
}
#stasjon .cb-split-zoom, #stasjon .cb-split-image {
	display: block;
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: auto !important;
	object-fit: cover;
	border-radius: 0 !important;
}
#stasjon .cb-split-cols > div:last-child {
	width: 100% !important;
	align-self: center;
	padding: clamp(56px, 7vw, 112px) var(--vuku-gutter) clamp(56px, 7vw, 112px) clamp(32px, 6vw, 112px) !important;
	box-sizing: border-box;
	max-width: 720px;
}
#stasjon .vuku-hours { max-width: none; }
@media (max-width: 1023px) {
	#stasjon .cb-split-cols { grid-template-columns: 1fr; }
	#stasjon .cb-split-image-wrap { min-height: 0; aspect-ratio: 4 / 3; }
	#stasjon .cb-split-cols > div:last-child { padding: 48px var(--vuku-gutter) 64px !important; max-width: none; }
}
@media (max-width: 900px) {
	.rh-cta { font-size: 0 !important; letter-spacing: 0 !important; gap: 0 !important; padding: 0 !important; }
}

/* Step tiles: hover fills the numeral red and lifts the tile with a soft shadow. */
.vuku-steps__grid > .wp-block-column {
	transition: box-shadow .2s ease-out, transform .2s ease-out;
}
.vuku-step__num { transition: -webkit-text-fill-color .2s ease-out; }
.vuku-steps__grid > .wp-block-column:hover {
	box-shadow: 0 10px 28px -14px rgba(20, 24, 28, .28);
}
.vuku-steps__grid > .wp-block-column:hover .vuku-step__num {
	-webkit-text-fill-color: currentColor;
	-webkit-text-stroke-color: var(--vuku-red);
}
@media (prefers-reduced-motion: reduce) {
	.vuku-steps__grid > .wp-block-column, .vuku-step__num { transition: none; }
}

/* Contact: subtle divider between the people and the opening hours. */
.vuku-contact__cards { border-bottom: 1px solid var(--vuku-line); }
.vuku-contact__hours { padding-top: clamp(32px, 4vw, 48px); margin-top: 0 !important; }
/* Burger / close toggle: icon centred in its own box (the plugin left it at
   flex-start with 6px padding, which put it 3px up-left). */
.rh-mobile-toggle {
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}
.rh-mobile-toggle svg { width: 28px !important; height: 28px !important; flex: none; display: block; }
/* Official logo, unaltered (incl. slogan). Shown as large as the header
   allows so the slogan stays as legible as possible. */
.rh-logo { height: 72px !important; }
@media (max-width: 900px) { .rh-logo { height: 56px !important; } }

/* Buttons: hover = colour change (above) + label underline, on every CTA. */
.cb-cta-btn:hover, a.cb-cta-btn:hover,
.vuku-btn .wp-block-button__link:hover,
.rh-cta:hover,
.vuku-mbar a:hover {
	text-decoration: underline !important;
	text-decoration-thickness: 1.5px !important;
	text-underline-offset: 4px !important;
}

/* --- Keyboard focus: one themed ring on everything (Tab only, via
   :focus-visible). Vuku red, 3px, offset 3px so it stays visible around red
   buttons too; no blue browser/plugin rings. -------------------------------- */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible,
.cb-cta-btn:focus-visible,
.wp-block-button__link:focus-visible,
.rh-cta:focus-visible,
.rh-mobile-toggle:focus-visible,
.cb-employee-card__trigger:focus-visible,
.vuku-mbar a:focus-visible,
.vuku-action a:focus-visible {
	outline: 3px solid var(--vuku-red) !important;
	outline-offset: 3px !important;
	box-shadow: none !important;
	border-radius: 3px;
}
:where(a, button):focus:not(:focus-visible) { outline: none !important; }

/* --- "Hopp til innhold" skip link in the theme ---------------------------- */
.skip-link.screen-reader-text:focus,
.skip-link:focus {
	position: fixed !important;
	top: 12px !important;
	left: 12px !important;
	z-index: 100000 !important;
	width: auto !important;
	height: auto !important;
	clip: auto !important;
	clip-path: none !important;
	display: inline-flex !important;
	align-items: center;
	min-height: 52px;
	padding: 0 24px !important;
	background: var(--vuku-ink) !important;
	color: #FFFFFF !important;
	font: 600 17px/1 eurostile, vuku-fallback, 'Helvetica Neue', sans-serif !important;
	text-decoration: underline !important;
	text-underline-offset: 4px;
	border-radius: 3px !important;
	outline: 3px solid #FFFFFF !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 2px #1C1E20, 0 0 0 8px #1C1E20 !important;
}
/* The header script injects a global 2px "secondary" focus ring with
   !important after all stylesheets; these selectors are more specific, so the
   Vuku ring wins on keyboard focus and mouse clicks show no ring. */
html body .wp-site-blocks *:focus-visible:not(.cb-stretched-link),
html body .site-header-react *:focus-visible,
html body .rh-mobile-menu *:focus-visible,
html body .site-footer *:focus-visible,
html body .vuku-mbar a:focus-visible {
	outline: 3px solid var(--vuku-red) !important;
	outline-offset: 3px !important;
	box-shadow: none !important;
}
html body .wp-site-blocks *:focus:not(:focus-visible),
html body .site-header-react *:focus:not(:focus-visible),
html body .rh-mobile-menu *:focus:not(:focus-visible),
html body .site-footer *:focus:not(:focus-visible) {
	outline: none !important;
}
/* Mobile menu: full viewport width (no strip of page showing on the right),
   and menu items keep normal word spacing. */
.rh-megamenu, .rh-megamenu * { word-spacing: normal !important; }
/* Cookie banner (third-party plugin) uses the same keyboard focus ring. */
html body .moove-gdpr-info-bar-container *:focus-visible,
html body .moove-gdpr-info-bar-container .mgbutton:focus-visible,
html body .moove-gdpr-cookie-notice a:focus-visible,
html body #moove_gdpr_cookie_modal *:focus-visible {
	outline: 3px solid var(--vuku-red) !important;
	outline-offset: 3px !important;
	box-shadow: none !important;
}
html body .moove-gdpr-info-bar-container .mgbutton,
html body .moove-gdpr-info-bar-container a { transition: background-color .3s, color .3s, border-color .3s !important; }
html body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container a { transition: color .3s !important; }
html body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container a:focus-visible { outline: 3px solid var(--vuku-red) !important; outline-offset: 3px !important; }

/* ==========================================================================
   v5 — accessible focus ring (WCAG technique C40: two-tone), team cards,
   footer hours spacing.
   A dark 2px band, a white 3px ring and a dark 3px band: visible on light,
   dark and red backgrounds alike and independent of colour vision.
   ========================================================================== */
html body .wp-site-blocks *:focus-visible:not(.cb-stretched-link):not(.cb-employee-card__trigger),
html body .site-header-react *:focus-visible,
html body .rh-mobile-menu *:focus-visible,
html body .rh-megamenu *:focus-visible,
html body .site-footer *:focus-visible,
html body .vuku-mbar a:focus-visible,
html body .skip-link:focus,
html body .moove-gdpr-info-bar-container *:focus-visible,
html body #moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content a:focus-visible,
html body #moove_gdpr_cookie_modal *:focus-visible {
	outline: 3px solid #FFFFFF !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 2px #1C1E20, 0 0 0 8px #1C1E20 !important;
	border-radius: 3px;
	transition: none !important;
}
html body #moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content a { transition: color .3s !important; }

/* Team cards: a quiet card surface + soft shadow on hover, and the same ring
   around the WHOLE card on keyboard focus (the plugin's ring on the inner
   button was clipped to a bottom line). */
.cb-employee-card {
	position: relative;
	padding: 12px 12px 18px !important;
	margin: -12px -12px -18px !important;
	border-radius: 3px;
	transition: background-color .2s ease-out, box-shadow .2s ease-out;
}
.cb-employee-card:hover {
	background-color: var(--vuku-card) !important;
	box-shadow: 0 14px 32px -18px rgba(20, 24, 28, .35) !important;
}
.cb-employee-card:hover h3 { text-decoration: none; }
html body .cb-employee-card .cb-employee-card__trigger:focus-visible { outline: none !important; box-shadow: none !important; border: 0 !important; }
.cb-employee-card:has(.cb-employee-card__trigger:focus-visible) {
	transition: none !important;
	background-color: var(--vuku-card) !important;
	outline: 3px solid #FFFFFF;
	outline-offset: 2px;
	box-shadow: 0 0 0 2px #1C1E20, 0 0 0 8px #1C1E20 !important;
}
.cb-employee-card:has(.cb-employee-card__trigger:focus-visible) h3 { color: var(--vuku-red) !important; }

/* Footer hours/contact: more air between lines, most of all on phones. */
.vuku-footer__hours p, .vuku-footer__contact p { line-height: 1.75 !important; }
@media (max-width: 640px) {
	.vuku-footer__hours p, .vuku-footer__contact p { line-height: 2 !important; margin-bottom: 24px !important; }
}
html body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .mgbutton:focus-visible,
html body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container button:focus-visible {
	outline: 3px solid #FFFFFF !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 2px #1C1E20, 0 0 0 8px #1C1E20 !important;
	transition: none !important;
}
/* USP band: breathing room before the next (dark) section so the tiles
   don't read as hanging into it. */
.vuku-usp { padding-bottom: clamp(56px, 7vw, 104px) !important; }

/* --- USP v2: graphite tiles that pop off the concrete band (no hairlines) */
.vuku-usp__grid {
	border: 0 !important;
	gap: 16px !important;
}
.vuku-usp__grid > .wp-block-column,
.vuku-usp__grid > .wp-block-column:first-child {
	flex: 1 1 0 !important;
	border: 0 !important;
	border-radius: 3px;
	background: var(--vuku-ink) !important;
	color: #FFFFFF;
	padding: clamp(28px, 2.6vw, 40px) !important;
	box-shadow: 0 18px 40px -24px rgba(20, 24, 28, .55);
	transition: transform .25s ease-out, box-shadow .25s ease-out, background-color .25s ease-out;
}
.vuku-usp__grid > .wp-block-column:hover {
	background: var(--vuku-ink-2) !important;
	transform: translateY(-4px);
	box-shadow: 0 26px 48px -24px rgba(20, 24, 28, .65);
}
.vuku-usp .vuku-ico {
	width: 56px;
	height: 56px;
	margin: 0 0 32px !important;
	border-radius: 50%;
	background: none;
	-webkit-mask: none;
	mask: none;
	box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .18);
	position: relative;
}
.vuku-usp .vuku-ico::after {
	content: "";
	position: absolute;
	inset: 14px;
	background: var(--vuku-red);
	-webkit-mask: var(--i) center / contain no-repeat;
	        mask: var(--i) center / contain no-repeat;
}
.vuku-usp__grid > .wp-block-column:hover .vuku-ico { transform: none; box-shadow: inset 0 0 0 1.5px var(--vuku-red); }
.vuku-usp__value { color: #FFFFFF !important; font-size: clamp(20px, 1.7vw, 25px) !important; }
.vuku-usp__label { color: #C6CACB !important; }
@media (prefers-reduced-motion: reduce) {
	.vuku-usp__grid > .wp-block-column { transition: none; }
	.vuku-usp__grid > .wp-block-column:hover { transform: none; }
}
@media (max-width: 900px) {
	.vuku-usp__grid { display: grid !important; grid-template-columns: 1fr 1fr; }
	.vuku-usp__grid > .wp-block-column { border-top: 0 !important; padding-left: clamp(24px, 4vw, 32px) !important; }
}
@media (max-width: 640px) {
	.vuku-usp__grid { grid-template-columns: 1fr; gap: 12px !important; }
}
@media (max-width: 640px) {
	.vuku-usp__grid > .wp-block-column,
	.vuku-usp__grid > .wp-block-column:first-child {
		display: grid !important;
		grid-template-columns: 48px 1fr;
		grid-template-rows: auto auto;
		column-gap: 18px;
		align-items: start;
		padding: 22px 20px !important;
	}
	.vuku-usp .vuku-ico { grid-row: 1 / span 2; width: 48px; height: 48px; margin: 2px 0 0 !important; }
	.vuku-usp .vuku-ico::after { inset: 12px; }
	.vuku-usp__value { margin: 0 0 4px !important; font-size: 20px !important; }
}

/* --- USP v3: the tiles bridge the light Verksted section and the dark
   Bilberging section (band split 50/50 behind them), so they belong to the
   page flow instead of floating in their own strip. ----------------------- */
@media (min-width: 641px) {
	.vuku-usp {
		background: linear-gradient(to bottom, var(--vuku-paper) 0 50%, var(--vuku-ink) 50% 100%) !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		margin-top: calc(var(--vuku-section-y) * -0.5) !important;
		position: relative;
		z-index: 2;
	}
	.vuku-usp + #bilberging,
	.vuku-usp + .cb-block-split { padding-top: clamp(56px, 6vw, 88px) !important; }
}
.vuku-usp__grid > .wp-block-column,
.vuku-usp__grid > .wp-block-column:first-child {
	background: var(--vuku-ink-2) !important;
	box-shadow: inset 0 0 0 1px var(--vuku-line-dark), 0 22px 44px -26px rgba(10, 12, 14, .7);
}
.vuku-usp__grid > .wp-block-column:hover {
	background: #2C3034 !important;
	box-shadow: inset 0 0 0 1px #4A4F54, 0 28px 52px -26px rgba(10, 12, 14, .8);
}
.vuku-usp__grid > .wp-block-column,
.vuku-usp__grid > .wp-block-column:first-child { box-shadow: inset 0 0 0 1px var(--vuku-line-dark), 0 10px 18px -12px rgba(0, 0, 0, .55) !important; }
.vuku-usp__grid > .wp-block-column:hover { box-shadow: inset 0 0 0 1px #4A4F54, 0 16px 26px -14px rgba(0, 0, 0, .6) !important; }
/* Styrk draws a 1px decorative rule at the top of split sections; under the
   bridging tiles it reads as a stray line. */
.vuku-usp + .cb-block-split::before { display: none !important; content: none !important; }

/* --- USP v4 (research: Scania/Polestar mosaics): full-bleed photo tiles,
   edge to edge, no gutters, text set on the image. Replaces the cards. ---- */
.vuku-usp {
	background: var(--vuku-ink) !important;
	margin: 0 !important;
	padding: 0 !important;
}
.vuku-usp > .vuku-usp__grid { max-width: none !important; }
.vuku-usp + .cb-block-split { padding-top: var(--vuku-section-y) !important; }
.vuku-usp__grid {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 0 !important;
	margin: 0 !important;
	border: 0 !important;
}
.vuku-usp__grid > .wp-block-column,
.vuku-usp__grid > .wp-block-column:first-child {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: clamp(360px, 30vw, 480px);
	display: flex !important;
	flex-direction: column;
	justify-content: flex-end;
	padding: clamp(28px, 2.6vw, 44px) !important;
	margin: 0 !important;
	border: 0 !important;
	border-left: 1px solid rgba(255, 255, 255, .12) !important;
	border-radius: 0 !important;
	background: var(--vuku-ink) !important;
	box-shadow: none !important;
	transform: none !important;
}
.vuku-usp__grid > .wp-block-column:first-child { border-left: 0 !important; }
/* photo layer + legibility gradient */
.vuku-usp__grid > .wp-block-column::before,
.vuku-usp__grid > .wp-block-column::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
}
.vuku-usp__grid > .wp-block-column::before {
	background: var(--bg) center / cover no-repeat;
	transition: transform .6s cubic-bezier(.2, .7, .2, 1);
}
.vuku-usp__grid > .wp-block-column::after {
	background: linear-gradient(to top, rgba(14, 15, 17, .92) 0%, rgba(14, 15, 17, .55) 45%, rgba(14, 15, 17, .15) 100%);
}
.vuku-usp__grid > .wp-block-column:hover { background: var(--vuku-ink) !important; transform: none !important; box-shadow: none !important; }
.vuku-usp__grid > .wp-block-column:hover::before { transform: scale(1.05); }
.vuku-usp .vuku-ico {
	position: absolute !important;
	top: clamp(28px, 2.6vw, 44px);
	left: clamp(28px, 2.6vw, 44px);
	width: 28px !important;
	height: 28px !important;
	margin: 0 !important;
	box-shadow: none !important;
	border-radius: 0;
	background: var(--vuku-red);
	-webkit-mask: var(--i) center / contain no-repeat;
	        mask: var(--i) center / contain no-repeat;
}
.vuku-usp .vuku-ico::after { display: none; }
.vuku-usp__value { color: #FFFFFF !important; font-size: clamp(22px, 2vw, 30px) !important; margin: 0 0 10px !important; }
.vuku-usp__label { color: #D7DADB !important; max-width: 30ch; }
@media (prefers-reduced-motion: reduce) { .vuku-usp__grid > .wp-block-column::before { transition: none; } .vuku-usp__grid > .wp-block-column:hover::before { transform: none; } }
@media (max-width: 1023px) {
	.vuku-usp__grid { grid-template-columns: 1fr 1fr; }
	.vuku-usp__grid > .wp-block-column:nth-child(3) { border-left: 0 !important; }
	.vuku-usp__grid > .wp-block-column:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .12) !important; }
}
@media (max-width: 640px) {
	.vuku-usp__grid > .wp-block-column,
	.vuku-usp__grid > .wp-block-column:first-child {
		display: flex !important;
		min-height: 220px;
		padding: 18px 16px !important;
	}
	.vuku-usp .vuku-ico { top: 16px; left: 16px; width: 24px !important; height: 24px !important; grid-row: auto; }
	.vuku-usp__value { font-size: 18px !important; margin-bottom: 6px !important; }
	.vuku-usp__label { font-size: 14px; line-height: 1.4; }
}
/* Titles share a two-line slot so labels line up across tiles. */
.vuku-usp__value { min-height: 2.3em; display: flex; align-items: flex-end; line-height: 1.15 !important; }
.vuku-usp__label { min-height: 3em; }
/* Tiles: all photos in greyscale (matching the portrait), titles on one line
   scaled to the tile width so wrapping never breaks the row's rhythm. */
.vuku-usp__grid > .wp-block-column::before { filter: grayscale(1) contrast(1.05); }
.vuku-usp__grid > .wp-block-column { container-type: inline-size; }
.vuku-usp__value {
	white-space: nowrap;
	min-height: 0 !important;
	font-size: clamp(16px, 7.2cqi, 30px) !important;
}
/* Reserve room for up to three label lines so titles share one baseline. */
.vuku-usp__label { min-height: calc(1.5em * 3); line-height: 1.5; }
@media (max-width: 640px) {
	.vuku-usp__grid { grid-template-columns: 1fr !important; }
	.vuku-usp__grid > .wp-block-column { border-left: 0 !important; border-top: 1px solid rgba(255, 255, 255, .12) !important; min-height: 200px; }
	.vuku-usp__value { font-size: clamp(16px, 6cqi, 26px) !important; }
	.vuku-usp__label { min-height: 0; }
}
/* Action list: the title slides in slightly on hover so the effect is
   noticeable, not just the small arrow. */
.vuku-action__label { transition: transform .25s cubic-bezier(.2, .7, .2, 1), color .2s ease-out; }
.vuku-action a:hover .vuku-action__label,
.vuku-action a:focus-visible .vuku-action__label { transform: translateX(16px); }
@media (prefers-reduced-motion: reduce) { .vuku-action__label { transition: none; } }

/* Contact cards: one big primary number per card; a second number becomes a
   quiet "eller …" line so every card keeps the same rhythm. */
.vuku-contact p.vuku-contact__alt { margin: 6px 0 0 !important; color: var(--vuku-text-2); font-size: 16px; }
.vuku-contact__alt a { display: inline-block; padding: 8px 0; font-weight: 600; color: var(--vuku-ink) !important; }
.vuku-contact__alt a:hover { color: var(--vuku-red) !important; }
.vuku-contact p.vuku-contact__alt { margin: -2px 0 0 !important; font-size: 17px; line-height: 1.4; }
.vuku-contact__alt a { padding: 4px 0 !important; text-decoration: none !important; border-bottom: 1px solid currentColor; }
/* Contact numbers: every number the same size; extra numbers stack tightly
   under the first (the earlier gap came from the link's tap padding plus
   paragraph line-height). Tap height is kept via a pseudo hit area. */
.vuku-contact p.vuku-contact__phone { margin: 0 !important; line-height: 1.15 !important; }
.vuku-contact p.vuku-contact__phone + p.vuku-contact__phone { margin-top: 6px !important; }
.vuku-contact__phone a { position: relative; padding: 0 !important; border-bottom: 0 !important; }
.vuku-contact__phone a::after { content: ""; position: absolute; left: 0; right: 0; top: -8px; bottom: -8px; }
.vuku-contact__phone a:hover { text-decoration: underline !important; text-decoration-thickness: 2px !important; text-underline-offset: 5px; }
.vuku-contact p.vuku-contact__name { margin: 0 0 10px !important; }

/* --- Photo-background splits: taller on desktop (one idea per screen), and
   the stacked layout starts where Styrk stacks the columns (<1024px). ----- */
@media (min-width: 1024px) {
	#verksted, #bilberging {
		min-height: clamp(600px, 78vh, 820px);
		display: flex !important;
		align-items: center;
	}
	#verksted > *, #bilberging > * { width: 100%; }
}
@media (max-width: 1023px) {
	#verksted .cb-split-cols { justify-content: flex-start !important; padding-top: clamp(260px, 42vw, 420px) !important; }
	html body #verksted::before {
		width: 100% !important;
		bottom: auto !important;
		height: clamp(320px, 52vw, 520px) !important;
		-webkit-mask-image: linear-gradient(to bottom, #000 45%, transparent 100%) !important;
		        mask-image: linear-gradient(to bottom, #000 45%, transparent 100%) !important;
	}
	html body #bilberging::before {
		width: 100% !important;
		opacity: .28 !important;
		-webkit-mask-image: linear-gradient(to top, #000 0%, transparent 70%) !important;
		        mask-image: linear-gradient(to top, #000 0%, transparent 70%) !important;
	}
	#bilberging .cb-split-cols > div:last-child, #verksted .cb-split-cols > div:last-child { max-width: 640px; }
}

/* --- Header between phone and desktop nav: CTA sits right, next to the burger */
@media (max-width: 1279px) {
	.rh-cta { margin-left: auto !important; }
}
/* Burger keeps its boxed button style everywhere it shows (<1280px). */
@media (max-width: 1279px) {
	.rh-mobile-toggle {
		width: 52px !important;
		height: 52px !important;
		border-radius: 3px !important;
		border: 1px solid var(--vuku-line-dark) !important;
		background: var(--vuku-ink-2) !important;
	}
}
/* Help strip on tablets: text on top, both buttons in one row below. */
@media (min-width: 641px) and (max-width: 1023px) {
	.vuku-help-strip > .wp-block-columns { flex-direction: column !important; align-items: flex-start !important; }
	.vuku-help-strip > .wp-block-columns > .wp-block-column { flex-basis: auto !important; width: 100%; }
	.vuku-help-strip .wp-block-buttons { justify-content: flex-start !important; flex-wrap: nowrap; }
}
/* Lighter top on the tile gradient: text stays legible at the bottom, faces
   and photos stay alive at the top. */
.vuku-usp__grid > .wp-block-column::after {
	background: linear-gradient(to top, rgba(14, 15, 17, .92) 0%, rgba(14, 15, 17, .55) 32%, rgba(14, 15, 17, 0) 62%) !important;
}
.vuku-usp__grid > .wp-block-column::after {
	background: linear-gradient(to top, rgba(14, 15, 17, .92) 0%, rgba(14, 15, 17, .55) 32%, rgba(14, 15, 17, .18) 62%, rgba(14, 15, 17, .3) 100%) !important;
}

/* ==========================================================================
   Photo-background split (editor-driven). Add the class "vuku-photo-bg" plus
   "--left" or "--right" to a Split Section: the image chosen IN THE BLOCK
   becomes a full-height background on that side, fading into the section.
   Replaces the earlier hard-coded ::before backgrounds.
   ========================================================================== */
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg { position: relative; overflow: hidden; isolation: isolate; }
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-image-wrap {
	display: block !important;
	position: absolute !important;
	top: 0;
	bottom: 0;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	z-index: -1;
	border-radius: 0 !important;
	box-shadow: none !important;
	min-height: 0 !important;
	aspect-ratio: auto !important;
}
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-zoom,
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-image {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	aspect-ratio: auto !important;
	object-fit: cover;
	border-radius: 0 !important;
	pointer-events: none;
}
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-cols {
	display: flex !important;
	grid-template-columns: none !important;
	max-width: 1180px !important;
	margin: 0 auto !important;
	padding: 0 var(--vuku-gutter) !important;
	gap: 0 !important;
}
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-cols > div:last-child:not(.cb-split-image-wrap),
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--right .cb-split-cols > div:first-child:not(.cb-split-image-wrap) {
	width: 100% !important;
	max-width: 520px !important;
	padding: 0 !important;
	align-self: center;
}
@media (min-width: 1024px) {
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg {
		min-height: clamp(600px, 78vh, 820px);
		display: flex !important;
		align-items: center;
	}
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg > * { width: 100%; }
	/* image left, text right */
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--left .cb-split-image-wrap {
		left: 0; right: auto; width: 50% !important;
		-webkit-mask-image: linear-gradient(to left, transparent 0%, rgba(0,0,0,.4) 22%, #000 50%);
		        mask-image: linear-gradient(to left, transparent 0%, rgba(0,0,0,.4) 22%, #000 50%);
	}
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--left .cb-split-cols { justify-content: flex-end !important; }
	/* image right, text left */
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--right .cb-split-image-wrap {
		right: 0; left: auto; width: 62% !important;
		-webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.12) 18%, rgba(0,0,0,.4) 36%, rgba(0,0,0,.75) 54%, #000 72%);
		        mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.12) 18%, rgba(0,0,0,.4) 36%, rgba(0,0,0,.75) 54%, #000 72%);
	}
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--right .cb-split-cols { justify-content: flex-start !important; }
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--dark .cb-split-image { opacity: .65; object-position: 70% center; }
}
@media (max-width: 1023px) {
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-image-wrap {
		left: 0; right: 0; width: 100% !important;
		bottom: auto;
		height: clamp(300px, 52vw, 520px) !important;
		-webkit-mask-image: linear-gradient(to bottom, #000 45%, transparent 100%);
		        mask-image: linear-gradient(to bottom, #000 45%, transparent 100%);
	}
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-cols { padding-top: clamp(240px, 42vw, 420px) !important; }
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--dark .cb-split-image { opacity: .45; }
}
/* The image wrap positions against the section, not the column row. */
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-cols { position: static !important; }
@media (min-width: 1024px) {
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--left .cb-split-cols > div:not(.cb-split-image-wrap) { margin-left: auto !important; margin-right: 0 !important; }
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--right .cb-split-cols > div:not(.cb-split-image-wrap) { margin-right: auto !important; margin-left: 0 !important; }
}
html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-cols > .cb-split-image-wrap { max-width: none !important; align-self: auto; }
@media (min-width: 1024px) {
	/* Text column on the same 1180px rail as the header (no inner gutter). */
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-cols { padding: 0 !important; width: calc(100% - 2 * var(--vuku-gutter)) !important; }
	html body :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--right .cb-split-image-wrap { bottom: 0 !important; height: auto !important; }
}
/* Restore Bilberging exactly: photo fills full section height on the right. */
@media (min-width: 1024px) {
	html body #bilberging.vuku-photo-bg .cb-split-cols > .cb-split-image-wrap {
		position: absolute !important;
		top: 0 !important;
		bottom: 0 !important;
		right: 0 !important;
		left: auto !important;
		width: 62% !important;
		height: 100% !important;
		max-height: none !important;
		align-self: stretch !important;
		margin: 0 !important;
	}
}
@media (min-width: 1024px) {
	html body #bilberging.vuku-photo-bg .cb-split-cols > .cb-split-image-wrap { max-width: none !important; width: 62% !important; }
}
@media (min-width: 1024px) {
	html body #stasjon.vuku-photo-bg { padding: 0 !important; }
	html body #stasjon.vuku-photo-bg .cb-split-cols { align-items: center !important; align-self: center !important; }
	html body #stasjon.vuku-photo-bg .cb-split-cols > div:not(.cb-split-image-wrap) { padding: 64px 0 !important; }
}

/* Bilberging hero: the hero's own "side image" (set in the block) becomes a
   faded background on the right, like the front-page Bilberging section. */
@media (min-width: 1024px) {
	html body .vuku-service-hero .cb-hero-aside {
		width: 62vw !important;
		-webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.12) 18%, rgba(0,0,0,.4) 36%, rgba(0,0,0,.75) 54%, #000 72%);
		        mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.12) 18%, rgba(0,0,0,.4) 36%, rgba(0,0,0,.75) 54%, #000 72%);
		z-index: 0;
	}
	html body .vuku-service-hero .cb-hero-aside__img { opacity: .65; object-position: 70% center; }
	html body .vuku-service-hero .cb-hero-content { position: relative; z-index: 2; }
}
@media (max-width: 1023px) {
	html body .vuku-service-hero .cb-hero-aside__img { opacity: .8; }
	html body .vuku-service-hero .cb-hero-aside {
		-webkit-mask-image: linear-gradient(to top, transparent 0%, #000 35%);
		        mask-image: linear-gradient(to top, transparent 0%, #000 35%);
	}
}

/* Step text links (phone numbers) */
.vuku-steps p a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.vuku-steps p a:hover { color: var(--vuku-red); }

/* "Mens du venter": each tip is its own bordered step, numbered with a
   running counter, so it reads as a checklist to work through. */
.vuku-wait [class*="grid"] { counter-reset: vukuwait; gap: 16px !important; }
.vuku-wait .cb-feature-card {
	counter-increment: vukuwait;
	position: relative;
	background: var(--vuku-card) !important;
	border: 1px solid var(--vuku-line) !important;
	border-radius: 3px !important;
	padding: 28px 24px 24px !important;
}
.vuku-wait .cb-feature-card::after {
	content: counter(vukuwait) !important;
	display: block !important;
	position: absolute;
	top: 22px;
	right: 22px;
	font: 500 15px/1 eurostile-extended, eurostile, sans-serif;
	color: var(--vuku-muted);
}
html body .vuku-wait .cb-feature-card::after,
html body .vuku-wait .cb-feature-card:hover::after {
	content: counter(vukuwait) !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: absolute !important;
	inset: 20px 20px auto auto !important;
	width: 32px !important;
	height: 32px !important;
	border-radius: 50%;
	background: var(--vuku-ink) !important;
	color: #FFFFFF !important;
	font: 500 14px/1 eurostile-extended, eurostile, sans-serif !important;
	opacity: 1 !important;
	transform: none !important;
}
/* Wait cards: no numbering (cards keep their own border). */
html body .vuku-wait .cb-feature-card::after,
html body .vuku-wait .cb-feature-card:hover::after { content: none !important; display: none !important; }

/* --- "Dette berger vi": photo-bg split + services as large typographic rows */
html body .vuku-berger.cb-block-split ul {
	display: block !important;
	list-style: none;
	padding: 0 !important;
	margin: 8px 0 28px !important;
	border-top: 1px solid var(--vuku-line);
}
html body .vuku-berger.cb-block-split ul li {
	padding: 18px 0 !important;
	border-bottom: 1px solid var(--vuku-line);
	display: flex;
	flex-direction: column;
	gap: 4px;
	transition: padding-left .25s cubic-bezier(.2,.7,.2,1);
}
html body .vuku-berger.cb-block-split ul li::before { display: none !important; }
html body .vuku-berger.cb-block-split ul li:hover { padding-left: 12px !important; }
html body .vuku-berger.cb-block-split ul li strong {
	font: 500 clamp(20px, 1.9vw, 26px)/1.2 eurostile-extended, eurostile, sans-serif;
	word-spacing: .2em;
	color: var(--vuku-ink);
}
html body .vuku-berger.cb-block-split ul li span { color: var(--vuku-muted); font-size: 16px; }
html body .vuku-berger.cb-block-split ul li br { display: none; }
@media (min-width: 1024px) {
	html body #berger.vuku-photo-bg { padding: 0 !important; min-height: clamp(600px, 78vh, 820px); display: flex !important; align-items: center; }
	html body #berger.vuku-photo-bg .cb-split-cols { align-items: center !important; align-self: center !important; }
	html body #berger.vuku-photo-bg .cb-split-cols > div:not(.cb-split-image-wrap) { padding: 72px 0 !important; }
}
/* "Dette berger vi": clear hierarchy — big section heading, smaller row titles, more air. */
html body .vuku-berger h2 { font-size: clamp(32px, 3.6vw, 48px) !important; margin-bottom: clamp(28px, 3vw, 40px) !important; }
html body .vuku-berger.cb-block-split ul li strong { font-size: clamp(17px, 1.35vw, 20px) !important; }
html body .vuku-berger.cb-block-split ul li { padding: 20px 0 !important; gap: 6px; }
html body .vuku-berger.cb-block-split ul { margin-bottom: 36px !important; }
html body .vuku-berger.cb-block-split .text-section-heading { font-size: clamp(30px, 3.6vw, 48px) !important; line-height: 1.1 !important; margin-bottom: clamp(24px, 3vw, 36px) !important; }
html body .vuku-berger.cb-block-split .cb-cta-btn:first-child { margin-top: 0; }
html body .vuku-berger.cb-block-split div:has(> .cb-cta-btn) { margin-top: 16px !important; }
/* Header logo: larger so the slogan line ("BILBERGING ✕ VERKSTED") gets
   enough pixel height to stay crisp and legible. */
.rh-logo { height: 96px !important; }
@media (max-width: 1279px) { .rh-logo { height: 80px !important; } }
@media (max-width: 640px)  { .rh-logo { height: 64px !important; } }
/* Desktop header 120px tall so the 96px logo has air above and below. */
@media (min-width: 1280px) {
	:root { --cb-header-h: 120px; }
	.site-header-react > div { height: 120px !important; min-height: 120px !important; }
	.vuku-hero-home {
		--hero-minh: calc(100svh - 120px - 96px) !important;
		min-height: calc(100svh - 120px - 96px) !important;
	}
}
@media (min-width: 1280px) {
	header.wp-block-template-part,
	.react-header-live-wrapper,
	.site-header-react { height: 120px !important; min-height: 120px !important; }
}
/* Step tiles: identical inner padding on every tile at every width (an older
   rule zeroed the 3rd column's left padding on tablets/phones). */
html body .vuku-steps__grid > .wp-block-column:nth-child(n) {
	padding: clamp(24px, 3vw, 44px) !important;
	border-left: 0 !important;
}
/* "Mens du venter" hover: subtle scale instead of a grey card fill. */
html body .vuku-wait .cb-feature-card {
	transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s ease-out !important;
	will-change: transform;
}
html body .vuku-wait .cb-feature-card:hover {
	background: var(--vuku-card) !important;
	transform: scale(1.03) !important;
	box-shadow: 0 14px 30px -18px rgba(20, 24, 28, .35) !important;
	z-index: 1;
}
@media (prefers-reduced-motion: reduce) {
	html body .vuku-wait .cb-feature-card:hover { transform: none !important; }
}

/* --- Mobile pass: one card per row, smaller action list, more air --------- */
@media (max-width: 640px) {
	/* "Mens du venter": one card per row (2 columns overflowed the screen). */
	html body .vuku-wait [class*="grid"] { grid-template-columns: 1fr !important; display: grid !important; }
	html body .vuku-wait .cb-feature-card { width: auto !important; min-width: 0 !important; }
	html body .vuku-wait .cb-feature-card:hover { transform: none !important; }
	/* Action list titles scaled down on phones. */
	.vuku-action__label { font-size: 22px !important; line-height: 1.2 !important; }
	.vuku-action a { padding: 18px 0 !important; grid-template-columns: 1fr 28px !important; }
	.vuku-action a::after { width: 24px; height: 24px; }
}

/* Heading → lead → buttons: more breathing room and comfortable line-height
   everywhere (heroes and section headers). */
.wp-block-styrk-blocks-hero h1 { margin-bottom: clamp(16px, 2vw, 24px) !important; }
.wp-block-styrk-blocks-hero h1 + p,
.wp-block-styrk-blocks-hero [class*="subtext"] { line-height: 1.6 !important; }
.wp-block-styrk-blocks-hero .cb-cta-btn { margin-top: 8px; }
main p { line-height: 1.65; }
main h2 + p, main h2 + div > p:first-child { margin-top: 0; }
.cb-block-split .text-section-heading { margin-bottom: clamp(20px, 2.4vw, 28px) !important; }
@media (max-width: 640px) {
	.wp-block-styrk-blocks-hero h1 { font-size: 30px !important; line-height: 1.15 !important; }
	.wp-block-styrk-blocks-hero .cb-hero__details { margin-top: 32px !important; gap: 14px !important; }
}
/* The first step's numeral (or the first year) is solid red at every width,
   marking where the sequence starts; the rest fill red on hover. */
.vuku-steps__grid > .wp-block-column:first-child .vuku-step__num { -webkit-text-fill-color: currentColor; -webkit-text-stroke-color: var(--vuku-red); }
/* Hovering another step hands the solid fill over: the first one empties again. */
.vuku-steps__grid:has(> .wp-block-column:not(:first-child):hover) > .wp-block-column:first-child .vuku-step__num { -webkit-text-fill-color: transparent; }

/* USP tiles: the photo is an image block inside each tile (editable in the
   editor), laid out as the tile background. */
.vuku-usp__grid > .wp-block-column::before { content: none !important; }
.vuku-usp__grid .vuku-usp__bg { position: absolute !important; inset: 0; margin: 0 !important; z-index: -2; overflow: hidden; }
.vuku-usp__grid .vuku-usp__bg img { width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; filter: grayscale(1) contrast(1.05); transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.vuku-usp__grid > .wp-block-column:first-child .vuku-usp__bg img { filter: grayscale(.72) contrast(1.04); object-position: 55% center; }
.vuku-usp__grid > .wp-block-column:hover .vuku-usp__bg img { transform: scale(1.05); }
@media (prefers-reduced-motion: reduce) { .vuku-usp__grid > .wp-block-column:hover .vuku-usp__bg img { transform: none; } }

/* --- More icons --------------------------------------------------------- */
.vuku-ico--tool    { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M3 21l7-7M14 4l6 6-3 3-6-6zM8.5 9.5l6 6M5 13l6 6'/%3E%3C/svg%3E"); }
.vuku-ico--map-pin { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E"); }

/* --- Page header (plugin title ignores the section text colour) ---------- */
html body .cb-page-header.styrk-dark .cb-page-header__title,
html body .cb-page-header.styrk-dark .cb-page-header__crumb-current { color: #FFFFFF !important; }
html body .cb-page-header.styrk-dark .cb-page-header__crumb-link { color: #C6CACB !important; }
html body .cb-page-header .cb-page-header__title { font-size: clamp(28px, 3.6vw, 50px) !important; line-height: 1.1 !important; }
html body .cb-page-header .cb-page-header__rule { display: none; }

/* --- Long-form text (privacy) -------------------------------------------- */
.vuku-prose { padding: var(--vuku-section-y) var(--vuku-gutter) !important; margin: 0 !important; font-size: 17px; line-height: 1.7; color: var(--vuku-text-2); }
.vuku-prose > * { max-width: 720px; margin-left: auto !important; margin-right: auto !important; }
.vuku-prose h2, .vuku-prose h3, .vuku-prose h4 { color: var(--vuku-ink); margin-top: 48px !important; margin-bottom: 12px !important; font-size: clamp(19px, 1.6vw, 23px) !important; }
.vuku-prose p, .vuku-prose ul { margin-top: 0 !important; margin-bottom: 16px !important; }
.vuku-prose > p:first-child { font-size: 14px; color: var(--vuku-muted); }
.vuku-prose a { color: var(--vuku-ink); text-underline-offset: 3px; }

/* --- Job ad ---------------------------------------------------------------- */
.vuku-job { padding: var(--vuku-section-y) var(--vuku-gutter) !important; margin: 0 !important; }
.vuku-job > * { max-width: 1180px; margin-left: auto !important; margin-right: auto !important; }
.vuku-job > h2 { margin-bottom: 40px !important; }
.vuku-job__grid { gap: 24px !important; margin-bottom: 0 !important; }
.vuku-job__card { background: var(--vuku-card); border-radius: 3px; padding: 32px !important; }
.vuku-job__card h3 { margin: 0 0 20px !important; }
.vuku-job__card ul { list-style: none; margin: 0; padding: 0; }
.vuku-job__card li { position: relative; padding: 10px 0 10px 22px; border-top: 1px solid var(--vuku-line); line-height: 1.5; }
.vuku-job__card li:first-child { border-top: 0; }
.vuku-job__card li::before { content: ""; position: absolute; left: 0; top: 18px; width: 8px; height: 8px; background: var(--vuku-red); border-radius: 1px; }
.vuku-job--apply { background: var(--vuku-paper-2); }
.vuku-job__apply { gap: clamp(32px, 5vw, 80px) !important; align-items: flex-start !important; }
.vuku-job__apply > .wp-block-column:first-child { flex-basis: 38% !important; }
.vuku-job__apply p { font-size: 17px; line-height: 1.7; }
.vuku-job__apply a { color: var(--vuku-ink); font-weight: 600; text-underline-offset: 3px; }

/* --- Forms (Forminator + CF7) in the one button / input system ------------- */
/* .vuku-form: add to any block that embeds a Forminator form (e.g. contact-section). */
:is(.vuku-job, .vuku-form) .forminator-ui, .vuku-contact__form { background: var(--vuku-card) !important; border-radius: 3px; padding: clamp(24px, 3vw, 40px) !important; }
.vuku-contact__form { margin-top: 48px !important; }
.vuku-contact__form .wpcf7 { max-width: 640px; }
.vuku-contact__form h3 { margin: 0 0 24px !important; }
html body .vuku-contact__form .wpcf7 label { display: block; font-size: 14px; font-weight: 600; color: var(--vuku-ink); }
html body :is(.vuku-contact__form, .vuku-job, .vuku-form) :is(input[type="text"], input[type="email"], input[type="tel"], textarea, .forminator-input, .forminator-textarea) {
	width: 100% !important; box-sizing: border-box; margin-top: 6px; padding: 12px 14px !important; min-height: 48px;
	font: 400 16px/1.4 eurostile, vuku-fallback, 'Helvetica Neue', Arial, sans-serif !important; color: var(--vuku-ink) !important;
	background: #FFFFFF !important; border: 1px solid var(--vuku-line) !important; border-radius: 3px !important;
}
/* Inputs with a leading icon (Forminator date picker) keep room for it. */
html body :is(.vuku-job, .vuku-form, .vuku-contact__form) .forminator-input-with-icon .forminator-input { padding-left: 42px !important; }
html body :is(.vuku-contact__form, .vuku-job, .vuku-form) :is(input, textarea):focus-visible { outline: 3px solid #FFFFFF !important; box-shadow: 0 0 0 5px var(--vuku-ink) !important; border-color: var(--vuku-ink) !important; }
html body .vuku-contact__form .wpcf7 p { margin: 0 0 20px !important; }
html body :is(.vuku-contact__form .wpcf7-submit, :is(.vuku-job, .vuku-form, .vuku-contact__form) .forminator-button-submit) {
	min-height: 48px !important; display: inline-flex !important; align-items: center; justify-content: center; padding: 0 28px !important; border: 0 !important; border-radius: 3px !important; cursor: pointer;
	background: var(--vuku-ink) !important; color: #FFFFFF !important; font: 500 15px/1 eurostile, vuku-fallback, 'Helvetica Neue', Arial, sans-serif !important;
}
html body :is(.vuku-contact__form .wpcf7-submit, :is(.vuku-job, .vuku-form, .vuku-contact__form) .forminator-button-submit):hover { background: var(--vuku-line-dark) !important; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 640px) {
	.vuku-job__card { padding: 24px !important; }
	html body :is(.vuku-contact__form .wpcf7-submit, :is(.vuku-job, .vuku-form, .vuku-contact__form) .forminator-button-submit) { width: 100%; }
}

/* --- Header with the full prod menu (8 links) -------------------------------
   Labels never wrap; services sit in one "Tjenester" dropdown. */
html body .rh-desktop-link { white-space: nowrap !important; }
html body .rh-desktop-nav { gap: clamp(16px, 1.1vw, 18px) !important; }

/* Department phone numbers are the main tap target on Kontakt. */
.vuku-contact__phone a { display: inline-flex; align-items: center; min-height: 44px; }
html body .vuku-job__apply > .wp-block-column { flex: 1 1 0 !important; min-width: 0; }
html body .vuku-job__apply > .wp-block-column:first-child { flex: 0 1 38% !important; }
html body .vuku-job__apply p { font-size: 17px !important; line-height: 1.7 !important; }
html body .vuku-contact__form > h3 { font: 500 clamp(19px, 1.6vw, 23px)/1.25 eurostile-extended, eurostile, sans-serif !important; color: var(--vuku-ink) !important; }
html body .vuku-job__apply h2 + p { margin-top: 20px !important; }

/* Tjenester dropdown: the plugin styles it inline (12px radius, own grey);
   bring it into the one-radius, graphite system with a clear hover. */
html body .site-header-react div:has(> a[role="menuitem"]) {
	border-radius: 3px !important; background: var(--vuku-ink) !important;
	border: 1px solid var(--vuku-line-dark) !important; padding: 6px !important; min-width: 240px !important;
}
html body .site-header-react a[role="menuitem"] { border-radius: 2px !important; color: #E4E6E7 !important; font-size: 16px !important; padding: 12px 16px !important; }
html body .site-header-react a[role="menuitem"]:hover { background: var(--vuku-line-dark) !important; color: #FFFFFF !important; text-decoration: underline; text-underline-offset: 4px; }

/* The side photo is anchored to the whole hero (not its inner content box),
   so it runs from the header to the next section at any hero height. */
@media (min-width: 1024px) {
	html body .vuku-service-hero .cb-hero__main { position: static !important; }
	html body .vuku-service-hero .cb-hero-aside { top: 0 !important; bottom: 0 !important; right: 0 !important; height: auto !important; }
}

/* Every hero's text starts on the header logo's edge: the hero rail follows
   the header/footer rail (Settings → Header → width) instead of its own. */
@media (min-width: 1024px) {
	html body .cb-hero .cb-hero__main {
		max-width: var(--cb-header-max-width, 1600px) !important;
		padding-left: var(--cb-header-side-pad, 52px) !important;
		padding-right: var(--cb-header-side-pad, 52px) !important;
		margin-left: auto !important; margin-right: auto !important;
	}
	html body .cb-page-header { padding-left: 0 !important; padding-right: 0 !important; }
	html body .cb-page-header .cb-page-header__inner {
		max-width: var(--cb-header-max-width, 1600px) !important; box-sizing: border-box;
		padding-left: var(--cb-header-side-pad, 52px) !important; padding-right: var(--cb-header-side-pad, 52px) !important;
		margin-left: auto !important; margin-right: auto !important;
	}
}
/* Under 1101px the header bar uses a 16px gutter; the footer matches. */
@media (max-width: 1100px) {
	html body .site-footer.vuku-footer { padding-left: 16px !important; padding-right: 16px !important; }
}

/* --- History as hanging banners (Om oss) -------------------------------------
   Each year is a tall dimmed greyscale photo banner (the photo is an image
   block inside the column, so it is swapped in the editor). */
.vuku-steps--banners .vuku-steps__grid { gap: 12px !important; }
html body .vuku-steps--banners .vuku-steps__grid > .wp-block-column {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-direction: column; min-height: clamp(460px, 42vw, 620px);
	padding: clamp(28px, 2.6vw, 40px) clamp(22px, 2vw, 32px) !important;
	background: var(--vuku-ink) !important; border: 0 !important; border-radius: 3px; color: #FFFFFF;
}
.vuku-steps--banners .vuku-step__bg { position: absolute !important; inset: 0; margin: 0 !important; z-index: -2; }
.vuku-steps--banners .vuku-step__bg img {
	width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important;
	filter: grayscale(1) contrast(1.05); opacity: .55; transition: transform .6s cubic-bezier(.2,.7,.2,1), opacity .3s ease-out;
}
.vuku-steps--banners .vuku-steps__grid > .wp-block-column::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: linear-gradient(180deg, rgba(28,30,32,.35) 0%, rgba(28,30,32,.2) 40%, rgba(28,30,32,.92) 100%);
}
.vuku-steps--banners .vuku-step__num { -webkit-text-stroke: 1.5px rgba(255,255,255,.85) !important; }
.vuku-steps--banners .vuku-step__title { color: #FFFFFF !important; margin-top: auto !important; }
html body .vuku-steps--banners p:not(.vuku-step__num) { color: #E4E6E7 !important; }
.vuku-steps--banners .vuku-steps__grid > .wp-block-column:hover .vuku-step__bg img { transform: scale(1.05); opacity: .7; }
@media (prefers-reduced-motion: reduce) { .vuku-steps--banners .vuku-step__bg img { transition: none; } .vuku-steps--banners .vuku-steps__grid > .wp-block-column:hover .vuku-step__bg img { transform: none; } }
@media (max-width: 781px) {
	html body .vuku-steps--banners .vuku-steps__grid > .wp-block-column { min-height: 420px; }
}
/* Years keep their stacked one-digit-per-line look inside the banners. */
.vuku-steps--banners .vuku-step__num { word-break: break-all; max-width: 1.05em; }
/* Banners share rows, so titles and texts line up across all four even when
   one title wraps. */
@media (min-width: 782px) {
	@supports (grid-template-rows: subgrid) {
		html body .vuku-steps--banners .vuku-steps__grid { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); grid-template-rows: auto 1fr auto auto; }
		html body .vuku-steps--banners .vuku-steps__grid > .wp-block-column { display: grid; grid-row: 1 / span 4; grid-template-rows: subgrid; row-gap: 0; }
		.vuku-steps--banners .vuku-step__num { grid-row: 1; }
		.vuku-steps--banners .vuku-step__title { grid-row: 3; align-self: end; margin-top: 0 !important; }
		html body .vuku-steps--banners .vuku-steps__grid > .wp-block-column > p:last-child { grid-row: 4; }
	}
}
/* The banners hang in a dark room: the section is graphite, so the photos
   carry the colour and the light grey no longer flattens them. */
html body .vuku-steps--banners { background: var(--vuku-ink) !important; }
html body .vuku-steps--banners .vuku-section-head h2 { color: #FFFFFF !important; }
html body .vuku-steps--banners .vuku-steps__grid > .wp-block-column { background: var(--vuku-ink-2) !important; }
/* Focal point helpers for cropped background photos (add in the block's
   "Additional CSS class"): keep the subject in a narrow banner. */
.vuku-bg-right img { object-position: 75% center !important; }
.vuku-bg-left img { object-position: 25% center !important; }

/* Footer nav mirrors the header: "Tjenester" is a parent (link + chevron) with
   its services indented on a rule below; "Vuku Bilsenter" starts a new group. */
.vuku-footer__heading a { color: inherit !important; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.vuku-footer__heading a::after {
	content: ""; width: 10px; height: 10px; background: currentColor; transform: translateY(-1px);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center / contain no-repeat;
}
.vuku-footer__heading a:hover { text-decoration: underline; text-underline-offset: 4px; }
html body .vuku-footer__links--sub { padding-left: 16px !important; border-left: 1px solid var(--vuku-line-dark); }
html body .vuku-footer__heading--next { margin-top: 40px !important; }
/* Footer follows the header/footer width setting (Settings → Header): its
   columns and bottom bar share the header's rail, so the logos line up. */
@media (min-width: 1101px) {
	html body .site-footer.vuku-footer { padding-left: 0 !important; padding-right: 0 !important; }
	html body .vuku-footer > .vuku-footer__cols,
	html body .vuku-footer > .vuku-footer__bar {
		box-sizing: border-box; max-width: var(--cb-header-max-width, 1600px) !important;
		padding-left: var(--cb-header-side-pad, 52px) !important; padding-right: var(--cb-header-side-pad, 52px) !important;
		margin-left: auto !important; margin-right: auto !important;
	}
}
/* Under 1101px the header bar uses a 16px gutter; the footer matches. */
@media (max-width: 1100px) {
	html body .site-footer.vuku-footer { padding-left: 16px !important; padding-right: 16px !important; }
	html body .vuku-footer > .vuku-footer__cols, html body .vuku-footer > .vuku-footer__bar { max-width: none !important; }
}
/* Mid widths (laptop/tablet): four footer columns get too narrow and break
   the e-mail and hours mid-word. The brand gets its own row; the rest share 3. */
@media (min-width: 901px) and (max-width: 1199px) {
	html body .vuku-footer__cols { display: grid !important; grid-template-columns: repeat(3, 1fr); }
	html body .vuku-footer__brand { grid-column: 1 / -1; max-width: none !important; }
}
html body .vuku-footer__contact a[href^="mailto:"] { white-space: nowrap; }
/* Application form inside the contact block: the block already has the
   heading, so the form's own title/subtitle go; one radius. */
html body .wp-block-styrk-blocks-contact-section .forminator-ui .forminator-title,
html body .wp-block-styrk-blocks-contact-section .forminator-ui .forminator-subtitle { display: none !important; }
html body .wp-block-styrk-blocks-contact-section .forminator-ui { border-radius: 3px !important; }
html body .wp-block-styrk-blocks-contact-section .contact-form-col { padding-left: 0 !important; padding-right: 0 !important; padding-top: 0 !important; }
html body .wp-block-styrk-blocks-contact-section .forminator-row:has(.forminator-title, .forminator-subtitle) { display: none !important; }
html body .wp-block-styrk-blocks-contact-section .forminator-ui { padding: clamp(24px, 3vw, 40px) !important; }
/* Mobile menu: the service sub-pages read as real links, not footnotes. */
html body .rh-megamenu__links a { font-size: 20px !important; line-height: 1.3; padding-top: 6px !important; padding-bottom: 6px !important; }
/* Contact block: company first, then the people, split by one rule. */
html body .contact-info__people { margin-top: 0 !important; padding-top: 32px !important; border-top: 1px solid var(--vuku-line) !important; }

/* Footer "Tjenester" is a collapsed group (core Details block): the summary
   looks like the other footer headings, with a chevron that turns when open. */
html body .vuku-footer__group { margin: 0 !important; }
html body .vuku-footer__group > summary {
	list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between;
	color: #FFFFFF; font: 700 14px/1.3 eurostile, sans-serif; letter-spacing: .1em; text-transform: uppercase;
	padding: 0 0 14px; margin: 0 0 18px; border-bottom: 1px solid var(--vuku-line-dark); min-height: 44px; box-sizing: border-box;
}
html body .vuku-footer__group > summary::-webkit-details-marker { display: none; }
html body .vuku-footer__group > summary::after {
	content: ""; width: 12px; height: 12px; background: currentColor; transition: transform .2s ease-out;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center / contain no-repeat;
}
html body .vuku-footer__group[open] > summary::after { transform: rotate(180deg); }
html body .vuku-footer__group > summary:hover { text-decoration: underline; text-underline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { html body .vuku-footer__group > summary::after { transition: none; } }
html body .vuku-footer__group > summary:focus-visible { outline: 3px solid #FFFFFF !important; outline-offset: 2px; box-shadow: 0 0 0 5px var(--vuku-ink) !important; }
/* Tjenester now sits inside the Vuku Bilsenter list: its summary reads as a
   link row (same size/colour as its siblings) with the chevron after it. */
html body .vuku-footer__links .vuku-footer__group > summary {
	justify-content: flex-start; gap: 10px; margin: 0; border: 0; text-transform: none; letter-spacing: 0;
	font: 400 16px/1.4 eurostile, vuku-fallback, 'Helvetica Neue', Arial, sans-serif; color: #C6CACB; padding: 11px 0; min-height: 44px;
}
html body .vuku-footer__links .vuku-footer__group > summary:hover { color: #FFFFFF; }
html body .vuku-footer__links .vuku-footer__group[open] > summary { color: #FFFFFF; }
html body .vuku-footer__links .vuku-footer__links--sub { margin: 4px 0 8px 2px !important; }
/* Team cards: department badges in the one radius (2px), and pinned to the
   card bottom so every card in a row has its badge on the same line. */
html body .cb-dept-badge { border-radius: 2px !important; opacity: 1 !important; }
/* Stretch (not height:100%) so the -12/-18px bleed margins add to the box: with height:100% the dept badges overflowed the overflow:hidden card. */
html body .cb-employee-card { display: flex !important; flex-direction: column; height: auto !important; align-self: stretch; }
html body .cb-employee-card__trigger { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; }
html body .cb-employee-card__trigger > .p-6 { flex: 1 1 auto !important; }
html body .cb-employee-identity { flex: 1 1 auto !important; }
html body .cb-employee-identity > .flex-wrap:last-child { margin-top: auto !important; padding-top: 8px; }
/* Contact block info column starts on the form's top edge. The items keep
   their own gap: stretching them to the form's height spread them apart. */
@media (min-width: 768px) {
	html body .contact-info-col { padding-top: 0 !important; padding-bottom: 0 !important; }
}
@media (min-width: 768px) {
	html body .contact-info { gap: 20px !important; }
	html body .contact-info > .contact-info__people { padding-top: 24px !important; }
}
@media (min-width: 768px) {
	html body .wp-block-styrk-blocks-contact-section .contact-form-col { padding-bottom: 0 !important; }
}
/* History banners run on the header rail: first banner on the logo's edge,
   last on the CTA's edge. */
@media (min-width: 1101px) {
	html body .vuku-steps--banners { padding-left: 0 !important; padding-right: 0 !important; }
	html body .vuku-steps--banners > * {
		box-sizing: border-box; max-width: var(--cb-header-max-width, 1600px) !important;
		padding-left: var(--cb-header-side-pad, 52px) !important; padding-right: var(--cb-header-side-pad, 52px) !important;
	}
}
@media (max-width: 1100px) {
	html body .vuku-steps--banners { padding-left: 16px !important; padding-right: 16px !important; }
}

/* --- Action list as a dark closing band -------------------------------------
   Graphite (one step lighter than the footer), white labels, red arrows; on
   hover/focus a red fill sweeps in behind the row. Runs on the header rail. */
html body .vuku-actions { background: var(--vuku-ink-2) !important; }
html body .vuku-action { border-color: var(--vuku-line-dark) !important; }
html body .vuku-action a { position: relative; isolation: isolate; color: #FFFFFF !important; padding-left: 0; padding-right: 0; transition: padding .25s cubic-bezier(.2,.7,.2,1); }
html body .vuku-action a::before {
	content: ""; position: absolute; inset: 0; z-index: -1; background: var(--vuku-red);
	transform: scaleX(0); transform-origin: left center; transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
html body .vuku-action a:hover::before, html body .vuku-action a:focus-visible::before { transform: scaleX(1); }
html body .vuku-action a:hover, html body .vuku-action a:focus-visible { padding-left: 24px; padding-right: 24px; }
html body .vuku-action a:hover .vuku-action__label, html body .vuku-action a:focus-visible .vuku-action__label { transform: none; }
html body .vuku-action__sub { color: #A9AEB2 !important; transition: color .2s ease-out; }
html body .vuku-action a:hover .vuku-action__sub, html body .vuku-action a:focus-visible .vuku-action__sub { color: #FFFFFF !important; }
html body .vuku-action a::after { background: var(--vuku-red) !important; }
html body .vuku-action a:hover::after, html body .vuku-action a:focus-visible::after { background: #FFFFFF !important; }
@media (prefers-reduced-motion: reduce) { html body .vuku-action a, html body .vuku-action a::before { transition: none; } }
@media (min-width: 1101px) {
	html body .vuku-actions { padding-left: 0 !important; padding-right: 0 !important; }
	html body .vuku-actions > .vuku-action {
		box-sizing: border-box; max-width: calc(var(--cb-header-max-width, 1600px) - 2 * var(--cb-header-side-pad, 52px)) !important;
		margin-left: max(var(--cb-header-side-pad, 52px), calc((100% - var(--cb-header-max-width, 1600px)) / 2 + var(--cb-header-side-pad, 52px))) !important;
		margin-right: max(var(--cb-header-side-pad, 52px), calc((100% - var(--cb-header-max-width, 1600px)) / 2 + var(--cb-header-side-pad, 52px))) !important;
	}
}
@media (max-width: 1100px) { html body .vuku-actions { padding-left: 16px !important; padding-right: 16px !important; } }
/* Forminator's admin-only "Edit form" link must not add height to the form
   column (it pushed the info column's end past the form card for admins). */
html body .contact-form-col { position: relative; }
html body .contact-form-col .forminator-edit-module { position: absolute; left: 0; top: 100%; margin-top: 12px; }
html body .contact-form-col > .forminator-ui { margin-bottom: 0 !important; }
/* "Ring bilberging" is urgent: its row is red by default. Hovering another
   row hands the red over (like the first year on Om oss). */
html body .vuku-action a[href^="tel:40415700"]::before { transform: scaleX(1); }
html body .vuku-action a[href^="tel:40415700"] { padding-left: 24px; padding-right: 24px; }
html body .vuku-action a[href^="tel:40415700"] .vuku-action__sub { color: #FFFFFF !important; }
html body .vuku-action a[href^="tel:40415700"]::after { background: #FFFFFF !important; }
html body .vuku-actions:has(.vuku-action a:not([href^="tel:40415700"]):is(:hover, :focus-visible)) a[href^="tel:40415700"]::before { transform: scaleX(0); }
html body .vuku-actions:has(.vuku-action a:not([href^="tel:40415700"]):is(:hover, :focus-visible)) a[href^="tel:40415700"] { padding-left: 0; padding-right: 0; }
html body .vuku-actions:has(.vuku-action a:not([href^="tel:40415700"]):is(:hover, :focus-visible)) a[href^="tel:40415700"] .vuku-action__sub { color: #A9AEB2 !important; }
html body .vuku-actions:has(.vuku-action a:not([href^="tel:40415700"]):is(:hover, :focus-visible)) a[href^="tel:40415700"]::after { background: var(--vuku-red) !important; }

/* "Står du fast?" strip: more air, on the header rail, and always fully in
   view under the home hero at desktop sizes (hero = viewport − header − strip). */
:root { --vuku-strip-h: 133px; }
html body .vuku-help-strip { padding-top: 36px !important; padding-bottom: 36px !important; }
@media (min-width: 1101px) {
	html body .vuku-help-strip { padding-left: 0 !important; padding-right: 0 !important; }
	html body .vuku-help-strip > .wp-block-columns {
		box-sizing: border-box; max-width: var(--cb-header-max-width, 1600px) !important;
		padding-left: var(--cb-header-side-pad, 52px) !important; padding-right: var(--cb-header-side-pad, 52px) !important;
	}
	html body .vuku-hero-home {
		--hero-minh: calc(100svh - var(--cb-header-h, 100px) - var(--vuku-strip-h)) !important;
		min-height: calc(100svh - var(--cb-header-h, 100px) - var(--vuku-strip-h)) !important;
	}
}

/* Phones/tablets: the hero photo sits BEHIND the text (dimmed) instead of
   stacking under it — otherwise it reads as two photos in a row with the
   next section's image. */
@media (max-width: 1023px) {
	html body .vuku-service-hero { position: relative; isolation: isolate; }
	html body .vuku-service-hero .cb-hero__main { position: static !important; }
	html body .vuku-service-hero .cb-hero-aside {
		position: absolute !important; inset: 0 !important; width: auto !important; height: auto !important;
		margin: 0 !important; max-width: none !important; z-index: 0;
		-webkit-mask-image: none !important; mask-image: none !important;
	}
	html body .vuku-service-hero .cb-hero-aside__img {
		width: 100% !important; height: 100% !important; max-height: none !important; aspect-ratio: auto !important; object-fit: cover; opacity: .32 !important;
	}
	html body .vuku-service-hero .cb-hero-content, html body .vuku-service-hero .cb-hero-split > *:not(.cb-hero-aside) { position: relative; z-index: 2; }
	html body .vuku-service-hero { padding-bottom: 48px !important; }
}

/* Cookie modal tab titles: plugin red #E70303 on #F1F1F1 is 4.21:1 — darken to pass AA */
html body #moove_gdpr_cookie_modal .gdpr-nav-tab-title { color: #B5070F !important; }

/* --- Video section: heading + list above a full-width embed --------------- */
.vuku-video { padding: var(--vuku-section-y) var(--vuku-gutter) !important; margin: 0 !important; }
.vuku-video > * { max-width: 1180px; margin-left: auto !important; margin-right: auto !important; }
.vuku-video .wp-block-embed { margin-top: 32px !important; }

/* --- Contact v2: label/value list beside the opening hours --------------- */
.vuku-contact__grid { gap: clamp(32px, 6vw, 96px) !important; margin-top: 8px !important; align-items: start; }
.vuku-contact__grid > .wp-block-column { flex: 1 1 0 !important; }
html body .vuku-contact p.vuku-contact__row {
	display: grid; grid-template-columns: 130px 1fr; gap: 16px; align-items: baseline;
	margin: 0 !important; padding: 18px 0; border-top: 1px solid var(--vuku-line); font-size: 17px; line-height: 1.5;
}
html body .vuku-contact p.vuku-contact__row:last-child { border-bottom: 1px solid var(--vuku-line); }
.vuku-contact__label { font: 700 12px/1.6 eurostile, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--vuku-muted); }
html body .vuku-contact__value a { padding: 0 !important; min-height: 0 !important; display: inline !important; }
.vuku-contact__value a { color: var(--vuku-ink) !important; font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.vuku-contact__value a:hover { color: var(--vuku-red) !important; }
.vuku-contact__hours { border-top: 1px solid var(--vuku-line); padding-top: 18px !important; }
.vuku-contact__hours .vuku-contact__dept { margin: 0 0 10px !important; }
.vuku-contact__lead { margin: -12px 0 24px !important; color: var(--vuku-text-2); }
.vuku-contact__form .forminator-ui, .vuku-contact__form .wpcf7, .vuku-contact__lead { max-width: 820px; }
@media (max-width: 781px) {
	html body .vuku-contact p.vuku-contact__row { grid-template-columns: 1fr; gap: 2px; }
}

/* Forminator checkbox groups as a compact chip cloud instead of a stretched
   two-column list: each checkbox row flows inline next to the previous one. */
html body .vuku-contact__form .forminator-row:has(> .forminator-field-checkbox) { display: inline-flex !important; flex-wrap: wrap; gap: 8px; margin: 0 4px 8px 0 !important; vertical-align: top; }
html body .vuku-contact__form .forminator-row:has(> .forminator-field-checkbox) > .forminator-col { flex: none !important; width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
html body .vuku-contact__form label.forminator-checkbox {
	display: inline-flex !important; align-items: center; margin: 0 !important; padding: 9px 16px !important; min-height: 40px; box-sizing: border-box;
	border: 1px solid var(--vuku-line); border-radius: 2px; background: #FFFFFF; cursor: pointer; transition: background-color .15s, color .15s, border-color .15s;
}
html body .vuku-contact__form label.forminator-checkbox .forminator-checkbox-box { display: none !important; }
html body .vuku-contact__form label.forminator-checkbox .forminator-checkbox-label { margin: 0 !important; padding: 0 !important; font-size: 15px !important; color: inherit !important; }
html body .vuku-contact__form label.forminator-checkbox:hover { border-color: var(--vuku-ink); }
html body .vuku-contact__form label.forminator-checkbox:has(input:checked) { background: var(--vuku-ink); border-color: var(--vuku-ink); color: #FFFFFF; }
html body .vuku-contact__form label.forminator-checkbox:has(input:focus-visible) { outline: 3px solid var(--vuku-ink); outline-offset: 2px; }

/* Service picker (project.js): the chips fold into a select-style toggle. */
.vuku-svc { position: relative; margin: 0 0 24px; }
.vuku-svc__label { display: block; margin: 0 0 6px !important; }
html body .vuku-svc__toggle {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; box-sizing: border-box;
	padding: 12px 14px; font: 400 16px/1.4 eurostile, vuku-fallback, 'Helvetica Neue', Arial, sans-serif; color: var(--vuku-muted); text-align: left;
	background: #FFFFFF; border: 1px solid var(--vuku-line); border-radius: 3px; cursor: pointer;
}
.vuku-svc__toggle.has-value { color: var(--vuku-ink); }
.vuku-svc__text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vuku-svc__toggle::after {
	content: ""; flex: none; width: 8px; height: 8px; margin: -4px 4px 0 0;
	border-right: 2px solid var(--vuku-ink); border-bottom: 2px solid var(--vuku-ink); transform: rotate(45deg); transition: transform .15s;
}
.vuku-svc__toggle[aria-expanded="true"]::after { transform: rotate(-135deg); margin-top: 4px; }
.vuku-svc__toggle:hover { border-color: var(--vuku-ink); }
html body .vuku-svc__toggle:focus-visible { outline: 3px solid #FFFFFF; box-shadow: 0 0 0 5px var(--vuku-ink); border-color: var(--vuku-ink); }
.vuku-svc__panel { margin-top: 8px; padding: 16px 16px 8px; background: #FFFFFF; border: 1px solid var(--vuku-line); border-radius: 3px; }
.vuku-svc__panel[hidden] { display: none !important; }
html body .vuku-svc__panel label.forminator-checkbox { background: var(--vuku-paper-2, #F1F1EF); border-color: transparent; }
html body .vuku-svc__panel label.forminator-checkbox:hover { border-color: var(--vuku-ink); }
html body .vuku-svc__panel label.forminator-checkbox:has(input:checked) { background: var(--vuku-ink); color: #FFFFFF; }

/* Cookie bar sits above the phone bottom bar (.vuku-mbar, z 9990): otherwise
   its consent buttons are covered and cannot be tapped. */
html body #moove_gdpr_cookie_info_bar { z-index: 10000 !important; }

/* Forminator's grey #777771 labels are 4.2:1 on the card; use the muted token (AA). */
html body .forminator-ui .forminator-label, html body .forminator-ui .forminator-description { color: var(--vuku-muted) !important; }
html body .forminator-ui .forminator-field-html small { font-size: 16px !important; }

/* Footer logo: Vuku Auto's logo is wide (3:1), so the shared 120px height made
   it 363px wide, past its 320px column and into the gap. Size it by width
   instead, capped at the column, so it carries the same weight as Bilsenter's. */
html body .vuku-footer .site-footer__logo-img { height: auto !important; width: 260px !important; max-width: 100% !important; }
@media (max-width: 781px) {
	html body .vuku-footer .site-footer__logo-img { width: 220px !important; }
}

/* Hero breadcrumb: a permanent underline under "Hjem" made it read lower than
   "• Elbil". Plain text like the rest of the trail; underline on hover/focus. */
html body .cb-hero__breadcrumb a { text-decoration: none !important; }
html body .cb-hero__breadcrumb a:hover, html body .cb-hero__breadcrumb a:focus-visible { text-decoration: underline !important; text-underline-offset: 4px; }

/* --- Sister-site QA 2026-10-07 ------------------------------------------- */
/* Tablet footer: 2 columns left "Åpningstider" alone on its own row. Brand on
   its own row, then nav / contact / hours side by side (as 901–1199px). */
@media (min-width: 641px) and (max-width: 900px) {
	html body .vuku-footer__cols { grid-template-columns: repeat(3, 1fr) !important; column-gap: 24px !important; }
}
/* Opening-hours table fills its column like the divider lines above it. */
html body .vuku-contact__hours .vuku-hours { max-width: none !important; }
/* Phones: the action rows lost their inset, so a filled (hover / emergency)
   row had text touching the red edge; long titles also wrapped to 2 lines. */
@media (max-width: 640px) {
	html body .vuku-action a:is(:hover, :focus-visible, [href^="tel:40415700"]) { padding-left: 16px !important; padding-right: 16px !important; }
	html body .vuku-actions:has(.vuku-action a:not([href^="tel:40415700"]):is(:hover, :focus-visible)) a[href^="tel:40415700"] { padding-left: 0 !important; padding-right: 0 !important; }
	html body .vuku-action__label { font-size: clamp(18px, 5.4vw, 22px) !important; word-spacing: .1em; }
}
/* Long one-word titles (e.g. "Personvernerklæring") wrap instead of running off a phone screen. */
html body h1 { overflow-wrap: break-word; hyphens: auto; }
/* Elbil: the BilXtra badge sits top-right in the photo; anchor the crop right so it is never cut. */
html body img[src*="vuku-auto-elbil-godkjent"] { object-position: right center !important; }
/* styrk-blocks draws a faint gradient hairline at the top of every section.
   Vuku separates sections by background instead, so the line only floated
   between buttons and stats. Off everywhere (was hidden case by case). */
html body :is(.cb-block-features, .cb-block-stats, .cb-block-rich-text, .cb-block-split, .cb-block-testimonial)::before { display: none !important; content: none !important; }
/* Footer logo link hugs the logo, so its focus ring sits evenly around it. */
html body .vuku-footer .site-footer__logo-link { width: fit-content !important; min-width: 0 !important; max-width: 100%; }

/* Editor: the block's image panel lives inside the absolutely positioned
   photo column, so it hung below the photo, faded with it and was clipped at
   the section edge. Stack photo + panel in that column and fade only the photo. */
html body.editor-styles-wrapper :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-image-wrap:has(> .cb-ed-panel) { display: flex !important; flex-direction: column; -webkit-mask-image: none !important; mask-image: none !important; }
html body.editor-styles-wrapper :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-image-wrap:has(> .cb-ed-panel) > :not(.cb-ed-panel, .cb-split-col-drag, .cb-split-col-type) { flex: 1 1 0; min-height: 160px; }
html body.editor-styles-wrapper :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--left .cb-split-image-wrap > :not(.cb-ed-panel, .cb-split-col-drag, .cb-split-col-type) { -webkit-mask-image: linear-gradient(to left, transparent 0%, rgba(0,0,0,.4) 22%, #000 50%); mask-image: linear-gradient(to left, transparent 0%, rgba(0,0,0,.4) 22%, #000 50%); }
html body.editor-styles-wrapper :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg--right .cb-split-image-wrap > :not(.cb-ed-panel, .cb-split-col-drag, .cb-split-col-type) { -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.4) 36%, #000 72%); mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.4) 36%, #000 72%); }
html body.editor-styles-wrapper :is(#verksted, #bilberging, #stasjon, .vuku-photo-bg).vuku-photo-bg .cb-split-image-wrap > .cb-ed-panel { flex: none; position: relative; z-index: 2; background: #fff; }

/* Editor: the theme zeroes the card body's side padding, so the contact
   fields (shown only in the editor) must follow the same rail, with air
   below the department badge. */
html body.editor-styles-wrapper .cb-employee-card > .p-6.pt-0 { padding: 14px 0 0 !important; }
html body.editor-styles-wrapper .cb-employee-card .cb-employee-actions { margin: 0 !important; }

/* One button style everywhere: header call button, block buttons, contact
   buttons and form submit. Same weight and size, never all capitals. */
html body .rh-cta,
html body .cb-cta-btn,
html body .contact-cta,
html body .vuku-btn .wp-block-button__link,
html body .forminator-ui .forminator-button-submit {
	font-family: eurostile, sans-serif !important;
	font-weight: 600 !important;
	font-size: 17px !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}
@media (max-width: 900px) {
	/* The header call button is an icon on small screens: keep its label hidden. */
	html body .rh-cta { font-size: 0 !important; }
}

/* Form text big enough to read: labels 16px, typed text 18px, help and
   error text never below 16px. Forminator styles by form id, so these match
   at id strength. */
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-label {
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
}
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-input,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-textarea,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui select,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .select2-selection__rendered,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .select2-results__option,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-input::placeholder,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-textarea::placeholder {
	font-size: 18px !important;
}
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-description,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-error-message,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-file-upload,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-file-upload *,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-multi-upload-message p,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-checkbox-label,
html body .forminator-ui:is(#_, [id]).forminator-ui.forminator-ui .forminator-radio-label {
	font-size: 16px !important;
}

/* Contact info: the 20px gap is the only space between items. Paragraph and
   list margins on top of it doubled every gap. */
html body .contact-info > *:not(.contact-info__people) {
	margin: 0 !important;
	padding-top: 0 !important;
}
html body .contact-info > .contact-info__people {
	margin: 0 !important;
}
html body .contact-info__list,
html body .contact-info__people {
	padding-left: 0 !important;
	list-style: none !important;
}
html body .contact-info__person-role,
html body .contact-info__person-phone,
html body .contact-info__person-email {
	font-size: 16px !important;
}

/* Footer bottom bar: company and org.nr. left, privacy and cookie links
   centred, credits right. On narrow screens everything stacks, centred.
   The cookie links open the consent settings, so the floating gear (which
   covered the copyright line) is hidden. */
html body .vuku-footer__bar {
	position: relative;
}
html body .vuku-footer__bar p {
	margin: 0;
}
html body .vuku-footer__bar .site-footer__legal {
	display: flex;
	gap: 24px;
	font-size: 14px;
}
html body .vuku-footer__bar .site-footer__legal a {
	color: #C6CACB;
	text-decoration: none;
	padding: 11px 0;
}
html body .vuku-footer__bar .site-footer__legal a:hover,
html body .vuku-footer__bar .site-footer__legal a:focus-visible {
	color: #FFFFFF;
	text-decoration: underline;
	text-underline-offset: 4px;
}
@media (min-width: 1101px) {
	html body .vuku-footer__bar .site-footer__legal {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
}
@media (max-width: 1100px) {
	html body .vuku-footer__bar {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 4px;
	}
	html body .vuku-footer__bar > :last-child { margin-left: 0; }
	html body .vuku-footer__bar .site-footer__legal { order: -1; }
}
html body #moove_gdpr_save_popup_settings_button { display: none !important; }

/* Roles are plain text here, so print the separator the editor typed
   between them ("Japanske biler, veteranbiler"). */
html body .cb-employee-card__role[data-sep]::after {
	content: attr(data-sep);
}