/* =====================================================================
   Hinaus Lähdekorpi — landing page design system
   Scoped to .lk-page so it never leaks into other pages or site chrome.
   Built to dress native WordPress CORE blocks (group/columns/cover/
   buttons/list/image/heading/paragraph) — every element stays editable.
   ===================================================================== */

.lk-page {
	--lk-red: #e11a1a;
	--lk-red-dark: #b81212;
	--lk-red-tint: #fcebeb;
	--lk-ink: #121316;
	--lk-surface: #ffffff;
	--lk-neutral: #f4f4f3;
	--lk-neutral-2: #ececea;
	--lk-line: #e4e4e2;
	--lk-text: #121316;
	--lk-muted: #6a6e76;
	--lk-gold: #f5a623;
	--lk-radius: 12px;
	--lk-radius-sm: 8px;
	--lk-shadow-sm: 0 1px 2px rgba(18, 19, 22, 0.05);
	--lk-shadow: 0 1px 2px rgba(18, 19, 22, 0.05), 0 14px 34px -18px rgba(18, 19, 22, 0.22);
	--lk-shadow-lg: 0 1px 2px rgba(18, 19, 22, 0.06), 0 30px 60px -28px rgba(18, 19, 22, 0.34);
	--lk-gutter: clamp(20px, 5vw, 56px);
	--lk-section-y: clamp(60px, 8.5vw, 108px);
	--lk-phone-white: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.4c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.3 1L6.6 10.8z'/%3E%3C/svg%3E");
	--lk-phone-red: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23e11a1a' d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.4c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.3 1L6.6 10.8z'/%3E%3C/svg%3E");

	font-family: "Lato", system-ui, sans-serif;
	color: var(--lk-text);
	font-size: 17px;
	line-height: 1.6;
}

/* ---- This page only: drop the theme title + flush the hero to header ---- */
.page-id-118 .wp-block-post-title { display: none; }
.page-id-118 main { margin-top: 0 !important; }
.page-id-118 main > .wp-block-group {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* ---- Layout helpers ---- */
.lk-page * { box-sizing: border-box; }
.lk-section { padding-block: var(--lk-section-y); }

/* WordPress applies a global 1.2rem "Block spacing" (blockGap, inherited from
   Twenty Twenty-Five's theme.json) as a top margin between sibling blocks.
   Each section owns its own vertical rhythm via padding, so remove the gap
   between the top-level sections — the coloured bands sit flush. */
.lk-page.is-layout-constrained > * { margin-block-start: 0; margin-block-end: 0; }
.lk-container {
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: var(--lk-gutter);
	width: 100%;
}
.lk-measure { max-width: 720px; margin-inline: auto; }
.lk-center { text-align: center; }

/* ---- Section band colours (self-contained; independent of the WP palette) ---- */
.lk-page .lk-section--red,
.lk-page .lk-final-cta {
	background: var(--lk-red);
	color: #fff;
}
.lk-page .lk-services,
.lk-page .lk-valueprops,
.lk-page .lk-partners {
	background: var(--lk-neutral);
}
.lk-page .lk-section--red :where(h1, h2, h3, h4, h5, h6),
.lk-page .lk-final-cta :where(h1, h2, h3, h4, h5, h6) { color: #fff; }

/* ---- Type ---- */
.lk-page p { margin: 0 0 1em; line-height: 1.6; }
.lk-page p:last-child { margin-bottom: 0; }

.lk-eyebrow {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--lk-red);
	margin: 0 0 18px;
	display: flex;
	align-items: center;
	gap: 12px;
}
.lk-eyebrow::before {
	content: "";
	width: 26px;
	height: 2px;
	background: currentColor;
	display: inline-block;
	flex: 0 0 auto;
}
.lk-eyebrow--light { color: rgba(255, 255, 255, 0.85); }
.lk-eyebrow--center { justify-content: center; }
.lk-eyebrow--norule::before { display: none; }

.lk-page .lk-display {
	font-family: "Fugaz One", "Arial Narrow", sans-serif;
	font-weight: 400;
	line-height: 0.96;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	margin: 0 0 22px;
	font-size: clamp(44px, 7.4vw, 104px);
}
.lk-page .lk-h2 {
	font-family: "Fugaz One", "Arial Narrow", sans-serif;
	font-weight: 400;
	font-size: clamp(34px, 4.6vw, 60px);
	line-height: 1.06;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	margin: 0 0 22px;
}
.lk-lead {
	font-size: clamp(17px, 1.25vw, 19px);
	color: var(--lk-muted);
	line-height: 1.65;
}

/* ---- Buttons (core/button) ---- */
.lk-page .wp-block-buttons { gap: 14px; }
.lk-page .lk-btn .wp-block-button__link {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 15px;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 11px;
	padding: 16px 26px;
	border-radius: var(--lk-radius);
	border: 1.5px solid transparent;
	transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, color 0.15s ease, border-color 0.15s ease;
	white-space: nowrap;
}
.lk-btn-red .wp-block-button__link {
	background: var(--lk-red);
	color: #fff;
	box-shadow: 0 10px 22px -12px rgba(225, 26, 26, 0.85);
}
.lk-btn-red .wp-block-button__link:hover {
	background: var(--lk-red-dark);
	transform: translateY(-2px);
	box-shadow: 0 16px 30px -14px rgba(225, 26, 26, 0.9);
}
.lk-btn-outline .wp-block-button__link {
	background: transparent;
	color: var(--lk-ink);
	border-color: var(--lk-ink);
}
.lk-btn-outline .wp-block-button__link:hover {
	background: var(--lk-ink);
	color: #fff;
	transform: translateY(-2px);
}
.lk-btn-ghost .wp-block-button__link {
	background: transparent;
	color: #fff;
	border-color: rgba(255, 255, 255, 0.45);
}
.lk-btn-ghost .wp-block-button__link:hover {
	background: rgba(255, 255, 255, 0.12);
	border-color: #fff;
}
.lk-btn-lg .wp-block-button__link { padding: 20px 34px; font-size: 17px; }
/* phone glyph before call buttons */
.lk-btn-phone .wp-block-button__link::before {
	content: "";
	width: 18px;
	height: 18px;
	background: var(--lk-phone-white) center/contain no-repeat;
	flex: 0 0 auto;
}
/* arrow after "read more" outline buttons */
.lk-btn-arrow .wp-block-button__link::after {
	content: "";
	width: 16px;
	height: 16px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121316' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
	flex: 0 0 auto;
}
.lk-btn-arrow .wp-block-button__link:hover::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

/* call link (text link with phone glyph) */
.lk-page .lk-calllink a,
.lk-page a.lk-calllink {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 14px;
	color: var(--lk-red);
	display: inline-flex;
	align-items: center;
	gap: 9px;
	text-decoration: none;
}
.lk-page .lk-calllink a::before {
	content: "";
	width: 16px;
	height: 16px;
	background: var(--lk-phone-red) center/contain no-repeat;
	flex: 0 0 auto;
}

/* ---- Safety-tape chevron divider (CSS-only, rendered atop the intro band) ---- */
.lk-page .lk-intro { position: relative; }
.lk-page .lk-intro::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 10px;
	box-sizing: border-box;
	background: repeating-linear-gradient(135deg, var(--lk-red) 0 17px, #fff 17px 34px);
	border-bottom: 1px solid var(--lk-line);
}

/* ---- Star ratings ---- */
.lk-stars { color: var(--lk-gold); letter-spacing: 2px; font-size: 17px; line-height: 1; margin: 0 0 14px; }
.lk-stars--lg { font-size: 26px; }

/* =====================================================================
   HERO (core/cover)
   ===================================================================== */
.lk-page .lk-hero { min-height: clamp(540px, 78vh, 760px); color: #fff; }
.lk-page .lk-hero .wp-block-cover__inner-container { width: 100%; }
.lk-hero-inner { max-width: 720px; padding-block: clamp(48px, 7vw, 92px); }
.lk-page .lk-hero .lk-display { margin-bottom: 22px; line-height: 1.04; }
.lk-hero-sub {
	font-size: clamp(17px, 1.35vw, 20px);
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.9);
	max-width: 580px;
	margin-bottom: 30px !important;
}
.lk-hero-trust { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; }
.lk-trust-item { display: flex; align-items: center; gap: 10px; font-size: 14.5px; color: rgba(255, 255, 255, 0.92); }
.lk-trust-item .lk-stars { margin: 0; }
.lk-trust-item strong { font-family: "Oswald", sans-serif; font-weight: 600; letter-spacing: 0.02em; }
.lk-trust-badge {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: 12.5px;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	border: 1.5px solid rgba(255, 255, 255, 0.4);
	border-radius: 999px;
	padding: 7px 14px;
	margin: 0;
}

/* =====================================================================
   INTRO band
   ===================================================================== */
.lk-intro .lk-h2 { margin: 0 0 26px; }
.lk-intro p { color: var(--lk-muted); font-size: clamp(16px, 1.15vw, 18px); }
.lk-statrow { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 40px; }
.lk-stat {
	display: flex !important;
	align-items: center;
	gap: 12px;
	background: var(--lk-surface);
	border: 1px solid var(--lk-line);
	border-radius: 999px;
	padding: 11px 20px 11px 14px;
	box-shadow: var(--lk-shadow-sm);
	flex-direction: row !important;
}
.lk-stat .lk-stat-n { font-family: "Fugaz One", sans-serif; font-size: 24px; color: var(--lk-red); line-height: 1; margin: 0; }
.lk-stat .lk-stat-t { font-size: 14px; color: var(--lk-muted); text-align: left; line-height: 1.25; margin: 0; }

/* =====================================================================
   SERVICES grid
   ===================================================================== */
.lk-svc-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 44px; flex-wrap: wrap; }
.lk-svc-head .lk-h2 { max-width: 14ch; margin: 0; }
.lk-svc-head .lk-eyebrow { margin-bottom: 14px; }
.lk-page .lk-svc-grid { gap: 22px; }
.lk-svc-card {
	background: var(--lk-surface);
	border: 1px solid var(--lk-line);
	border-radius: var(--lk-radius);
	padding: 34px 30px 30px !important;
	box-shadow: var(--lk-shadow-sm);
	position: relative;
	overflow: hidden;
	height: 100%;
	display: flex;
	flex-direction: column;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.lk-svc-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: var(--lk-red);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s ease;
}
.lk-svc-card:hover { transform: translateY(-4px); box-shadow: var(--lk-shadow); border-color: transparent; }
.lk-svc-card:hover::before { transform: scaleX(1); }
.lk-svc-index { font-family: "Fugaz One", sans-serif; font-size: 40px; color: var(--lk-neutral-2); line-height: 1; margin: 0 0 18px; transition: color 0.2s ease; }
.lk-svc-card:hover .lk-svc-index { color: var(--lk-red); }
.lk-page .lk-h-card {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	line-height: 1.12;
	font-size: clamp(20px, 1.5vw, 24px);
	margin: 0 0 12px;
}
.lk-svc-card p { color: var(--lk-muted); font-size: 15.5px; margin-bottom: 22px; }
.lk-svc-card .lk-calllink { margin-top: auto; }

/* =====================================================================
   MEDIA + TEXT (area + pricing) — built from core/columns
   ===================================================================== */
.lk-page .lk-mediatext { gap: clamp(32px, 5vw, 76px); align-items: center; }
.lk-mediatext .lk-media-img,
.lk-mediatext .lk-media-img img {
	border-radius: var(--lk-radius);
	width: 100%;
	height: 100%;
	object-fit: cover;
	min-height: 380px;
}
.lk-mediatext .lk-media-img { margin: 0; overflow: hidden; }
.lk-mediatext .lk-h2 { margin-bottom: 22px; }
.lk-mediatext .lk-body p { color: var(--lk-muted); }
.lk-section--red .lk-mediatext .lk-body p,
.lk-section--red p { color: rgba(255, 255, 255, 0.9); }

.lk-area-list {
	list-style: none !important;
	padding: 0 !important;
	margin: 28px 0 0 !important;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 28px;
	max-width: 460px;
}
.lk-area-list li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	font-size: 18px;
	letter-spacing: 0.01em;
}
.lk-area-list li::before {
	content: "";
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.18);
	flex: 0 0 auto;
}

.lk-price-callout {
	display: inline-flex !important;
	flex-direction: row !important;
	align-items: center;
	gap: 16px;
	background: var(--lk-red-tint);
	border: 1px solid #f3cccc;
	border-radius: var(--lk-radius);
	padding: 16px 22px !important;
	margin-bottom: 26px;
	width: auto;
}
.lk-price-callout .lk-price-big { font-family: "Fugaz One", sans-serif; font-size: 34px; color: var(--lk-red); line-height: 0.9; margin: 0; }
.lk-price-callout .lk-price-lbl { font-size: 14px; color: var(--lk-text); line-height: 1.3; max-width: 22ch; margin: 0; }

/* =====================================================================
   VALUE PROPS
   ===================================================================== */
.lk-page .lk-vp-grid { gap: clamp(24px, 3vw, 46px); margin-top: 8px; }
.lk-vp { padding-top: 26px !important; border-top: 3px solid var(--lk-ink); }
.lk-vp .lk-vp-num {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.16em;
	color: var(--lk-red);
	text-transform: uppercase;
	margin: 0 0 14px;
	display: block;
}
.lk-page .lk-vp h3 {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	line-height: 1.2;
	font-size: 21px;
	margin: 0 0 14px;
}
.lk-vp p { color: var(--lk-muted); font-size: 15.5px; }

/* =====================================================================
   REVIEWS
   ===================================================================== */
.lk-rev-head { display: flex; align-items: center; gap: 28px; margin-bottom: 40px; flex-wrap: wrap; }
.lk-rev-score { display: flex !important; flex-direction: row !important; align-items: center; gap: 18px; }
.lk-rev-score .lk-rev-num { font-family: "Fugaz One", sans-serif; font-size: 68px; line-height: 0.8; color: var(--lk-ink); margin: 0; }
.lk-rev-score .lk-rev-meta { display: flex; flex-direction: column; gap: 5px; }
.lk-rev-score .lk-stars { margin: 0 0 3px; }
.lk-rev-score .lk-rev-cnt { font-family: "Oswald", sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; font-size: 15px; line-height: 1.1; margin: 0; }
.lk-rev-headcta { margin-left: auto; }
.lk-page .lk-rev-grid { gap: 18px; }
.lk-rev-card {
	background: var(--lk-surface);
	border: 1px solid var(--lk-line);
	border-radius: var(--lk-radius);
	padding: 24px 22px !important;
	display: flex;
	flex-direction: column;
	height: 100%;
	box-shadow: var(--lk-shadow-sm);
}
.lk-rev-card .lk-stars { margin-bottom: 14px; }
.lk-page .lk-rev-card h4 { font-family: "Oswald", sans-serif; font-weight: 600; font-size: 18px; margin: 0 0 10px; text-transform: none; letter-spacing: 0; }
.lk-rev-card .lk-rev-quote { color: var(--lk-muted); font-size: 14.5px; flex: 1; }
.lk-rev-card .lk-rev-by {
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid var(--lk-line);
	font-size: 13px;
	color: var(--lk-muted);
	display: flex;
	justify-content: space-between;
}
.lk-rev-card .lk-rev-by strong { color: var(--lk-text); font-weight: 600; }

/* =====================================================================
   PARTNERS
   ===================================================================== */
.lk-partners .lk-measure { margin-bottom: 46px; }
.lk-partners .lk-lead { margin-bottom: 26px; }
.lk-logo-strip {
	display: grid !important;
	grid-template-columns: repeat(8, 1fr);
	gap: 18px;
	align-items: center;
	border-block: 1px solid var(--lk-line);
	padding-block: 30px;
}
.lk-logo-strip .lk-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.02em;
	color: #9a9ea6;
	text-align: center;
	filter: grayscale(1);
	transition: color 0.2s ease;
	margin: 0;
}
.lk-logo-strip .lk-logo:hover { color: var(--lk-ink); }
.lk-logo-note { text-align: center; font-size: 12.5px; color: var(--lk-muted); margin-top: 16px; }

/* =====================================================================
   FINAL CTA
   ===================================================================== */
.lk-final-cta { text-align: center; }
.lk-page .lk-final-cta .lk-display { font-size: clamp(34px, 4.4vw, 60px); margin-bottom: 14px; }
.lk-final-cta p { color: rgba(255, 255, 255, 0.9); max-width: 52ch; margin: 0 auto 30px; font-size: 17px; }
.lk-page .lk-final-phone a,
.lk-page a.lk-final-phone {
	font-family: "Fugaz One", sans-serif;
	font-size: clamp(40px, 5.5vw, 72px);
	color: #fff;
	display: inline-flex;
	align-items: center;
	gap: 18px;
	letter-spacing: 0.01em;
	text-decoration: none;
	line-height: 1;
}
.lk-page .lk-final-phone a::before {
	content: "";
	width: 0.9em;
	height: 0.9em;
	background: var(--lk-phone-white) center/contain no-repeat;
	flex: 0 0 auto;
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 1024px) {
	.lk-page .lk-svc-grid { grid-template-columns: repeat(2, 1fr); }
	.lk-page .lk-rev-grid { grid-template-columns: repeat(2, 1fr); }
	.lk-logo-strip { grid-template-columns: repeat(4, 1fr); gap: 22px 18px; }
}
@media (max-width: 860px) {
	.lk-page .lk-vp-grid { gap: 0; }
	.lk-vp { padding-block: 24px; }
	.lk-area-list { max-width: none; }
}
@media (max-width: 600px) {
	.lk-page .lk-svc-grid { grid-template-columns: 1fr; }
	.lk-page .lk-rev-grid { grid-template-columns: 1fr; }
	.lk-logo-strip { grid-template-columns: repeat(2, 1fr); }
	.lk-rev-headcta { margin-left: 0; width: 100%; }
}

/* =====================================================================
   SITE FOOTER (template part) — matches the Lähdekorpi design.
   Site-wide chrome: NOT scoped to .lk-page. Loaded in editor + front end.
   ===================================================================== */
.lk-footer {
	background: #121316;
	color: rgba(255, 255, 255, 0.7);
	padding: clamp(56px, 7vw, 84px) 0 30px;
	font-family: "Lato", system-ui, sans-serif;
	font-size: 17px;
	line-height: 1.6;
}
.lk-footer * { box-sizing: border-box; }
/* neutralise WordPress blockGap inside the footer — spacing is explicit */
.lk-footer :where(.is-layout-flow) > *,
.lk-footer :where(.is-layout-constrained) > * { margin-block-start: 0; }
.lk-footer-inner {
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: clamp(20px, 5vw, 56px);
}
.lk-footer .lk-footer-top {
	gap: 40px !important;
	padding-bottom: 44px;
	margin-bottom: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	align-items: flex-start;
}
.lk-footer .lk-footer-logo { margin: 0 0 18px; }
.lk-footer .lk-footer-logo img { height: 48px; width: auto; max-width: none; }
.lk-footer-brand p { max-width: 42ch; font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, 0.7); margin: 0; }
.lk-footer .lk-footer-h {
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 13px;
	color: #fff;
	margin: 0 0 18px;
}
.lk-footer-col p { margin: 0 0 12px; font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, 0.7); }
.lk-footer-col a { color: rgba(255, 255, 255, 0.7); text-decoration: none; transition: color 0.15s ease; }
.lk-footer-col a:hover { color: #fff; }
.lk-footer-col .lk-footer-phone { margin-bottom: 16px; }
.lk-footer-col .lk-footer-phone a {
	font-family: "Fugaz One", sans-serif;
	font-size: 30px;
	color: #fff;
	letter-spacing: 0.01em;
	display: inline-block;
}
.lk-footer .lk-footer-bottom {
	padding-top: 26px;
	gap: 12px 20px;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.5);
}
.lk-footer .lk-footer-bottom p { margin: 0; font-size: 13px; color: rgba(255, 255, 255, 0.5); }
@media (max-width: 781px) {
	.lk-footer .lk-footer-top { gap: 32px !important; }
}

/* =====================================================================
   SHARED: real insurer-logo strip (used on the home + service pages)
   ===================================================================== */
.lk-page .lk-logos {
	gap: clamp(22px, 4vw, 48px) !important;
	align-items: center;
	justify-content: center;
	border-block: 1px solid var(--lk-line);
	padding-block: 30px;
	margin-top: 8px;
}
.lk-page .lk-logos .wp-block-image { margin: 0; }
.lk-page .lk-logos img {
	height: 34px;
	width: auto;
	max-width: 150px;
	object-fit: contain;
	display: block;
}

/* =====================================================================
   SERVICE PAGE (Hinauspalvelu) — reuses landing components + extras
   ===================================================================== */
/* hero heading: a touch smaller than the home display */
.lk-page .lk-svc-h1 { font-size: clamp(34px, 4.6vw, 60px); line-height: 1.04; margin-bottom: 20px; }
.lk-page .lk-svc-hero { padding-bottom: clamp(40px, 5vw, 64px); }

/* call band: safety-tape stripe sits flush at the hero's bottom edge, with
   the phone pill straddling the boundary (overlapping up into the hero). */
.lk-page .lk-callband {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	padding-block: 0;
}
.lk-page .lk-callband::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 10px;
	background: repeating-linear-gradient(135deg, var(--lk-red) 0 17px, #fff 17px 34px);
	border-block: 1px solid var(--lk-line);
	z-index: 0;
}
.lk-page .lk-callband .wp-block-buttons {
	position: relative;
	z-index: 1;
	margin: -30px 0 32px;
}
/* white ring so the pill separates cleanly from the safety-tape stripe */
.lk-page .lk-callband .wp-block-button__link {
	box-shadow: 0 0 0 5px #fff, 0 14px 28px -14px rgba(225, 26, 26, 0.85);
}
.lk-page .lk-btn-pill .wp-block-button__link { border-radius: 999px; }

/* dark info boxes */
.lk-page .lk-infobox-grid { gap: 22px; align-items: stretch; }
.lk-page .lk-darkbox {
	background: var(--lk-ink);
	color: rgba(255, 255, 255, 0.82);
	border-radius: var(--lk-radius);
	padding: clamp(28px, 4vw, 44px);
	height: 100%;
	box-shadow: var(--lk-shadow);
}
.lk-page .lk-darkbox .lk-box-h {
	font-family: "Fugaz One", "Arial Narrow", sans-serif;
	font-weight: 400;
	font-size: clamp(26px, 3vw, 36px);
	line-height: 1.08;
	text-transform: uppercase;
	letter-spacing: 0.01em;
	color: #fff;
	margin: 0 0 22px;
}
.lk-darkbox p { color: rgba(255, 255, 255, 0.82); }
.lk-darkbox a { color: #fff; }

/* city link list */
.lk-page .lk-citylist {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 24px;
}
.lk-citylist li { margin: 0; }
.lk-page .lk-citylist a {
	display: flex;
	align-items: center;
	gap: 11px;
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	font-size: 17px;
	letter-spacing: 0.01em;
	color: #fff;
	text-decoration: none;
	transition: color 0.15s ease, gap 0.15s ease;
}
.lk-citylist a::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--lk-red);
	flex: 0 0 auto;
}
.lk-citylist a:hover { color: var(--lk-red); gap: 15px; }
/* city list on a red band: white bullets, lighter hover */
.lk-page .lk-section--red .lk-citylist a { color: #fff; }
.lk-page .lk-section--red .lk-citylist a::before { background: #fff; }
.lk-page .lk-section--red .lk-citylist a:hover { color: rgba(255, 255, 255, 0.8); }

/* single, centered dark box (used on city pages) */
.lk-page .lk-darkbox--center { max-width: 820px; margin-inline: auto; }

/* "order a tow" steps list */
.lk-page .lk-steps { margin: 0 0 26px; padding-left: 1.15em; color: rgba(255, 255, 255, 0.82); }
.lk-page .lk-steps li { margin: 0 0 8px; }
.lk-page .lk-steps ul { margin: 8px 0 0; }
@media (max-width: 600px) {
	.lk-page .lk-citylist { grid-template-columns: 1fr; }
}

/* plain (non-link) city items inside lk-citylist — e.g. contact service-area list */
.lk-page .lk-citylist li:not(:has(a)) {
	display: flex;
	align-items: center;
	font-weight: 600;
	color: inherit;
}
.lk-page .lk-citylist li:not(:has(a))::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	margin-right: 12px;
	background: var(--lk-red);
	flex: 0 0 auto;
}
.lk-page .lk-section--red .lk-citylist li:not(:has(a))::before { background: #fff; }

/* ---- team / contact cards (Yhteystiedot) ---- */
.lk-page .lk-team {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px;
	margin-top: 8px;
	align-items: start;
}
/* neutralize WP blockGap margin that pushes cards 2..n down within their grid cell */
.lk-page .lk-team > * { margin-block-start: 0 !important; margin-top: 0 !important; }
.lk-page .lk-team-card {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}
.lk-page .lk-team-avatar { margin: 0 0 8px; width: 120px; }
.lk-page .lk-team-avatar img {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	object-fit: cover;
	background: #ececec;
}
.lk-page .lk-team-name { font-size: 1.1rem; margin: 0; }
.lk-page .lk-team-role { color: var(--lk-red); font-style: italic; margin: 0 0 4px; }
.lk-page .lk-team-contact { margin: 0; font-size: 0.95rem; line-height: 1.7; }
.lk-page .lk-team-contact a { color: inherit; text-decoration: none; word-break: break-word; }
.lk-page .lk-team-contact a:hover { color: var(--lk-red); text-decoration: underline; }
@media (max-width: 900px) { .lk-page .lk-team { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .lk-page .lk-team { grid-template-columns: 1fr; } }

/* =====================================================================
   LONG COMPOUND WORDS: never split mid-word
   ---------------------------------------------------------------------
   WP core sets `overflow-wrap:break-word; word-break:break-word` on
   .wp-block-column, and every heading inside a columns block inherits it.
   So a display heading that outgrows its column was being cut mid-word
   ("HINAUSKULJETU / S LÄHDEKORPI OY"). Headings must wrap between words
   only — never inside one.
   ===================================================================== */
.lk-page .lk-display,
.lk-page .lk-svc-h1,
.lk-page .lk-h2,
.lk-page .lk-box-h {
	word-break: normal;
	overflow-wrap: normal;
	hyphens: none;
}

/* The two-column service hero gives the text column ~508px at its widest,
   but the H1 capped at 60px needs ~539px for HINAUSKULJETUS. Cap the hero
   H1 so the longest word always fits the column with headroom to spare
   (also covers the flash before Fugaz One loads, where the fallback face
   is wider). */
.lk-page .lk-svc-hero .lk-mediatext .lk-svc-h1 {
	font-size: clamp(32px, 4.1vw, 52px);
}

/* =====================================================================
   MOBILE HEADING OVERFLOW (2026-09-01)
   ---------------------------------------------------------------------
   The block above stops headings splitting mid-word, but it does that
   with `overflow-wrap: normal`, which leaves a word that is wider than
   its container nowhere to go: it overflows the page instead of wrapping.
   Measured at a 390px viewport on the Swedish front page, the document
   ran 56px wider than the screen, because BÄRGNINGSTJÄNSTER needs 367px
   at the 34px clamp minimum while its column is only 350px wide.

   Fugaz One uppercase costs ~0.635em per character, so the longest word
   in the copy (17 chars) needs about 10.8em. Fitting that into a 280px
   container (a 320px viewport) caps the font at roughly 26px.

   Three changes, least invasive first:
     1. hyphens: manual  - honour the soft hyphens already in the copy
        (the hero reads BÄRGNINGS­TRANSPORT) rather than ignoring them.
     2. overflow-wrap: break-word - a last-resort net. Unlike word-break
        it only splits a word that cannot fit on a line by itself, so
        ordinary words still wrap at spaces and the original mid-word bug
        ("HINAUSKULJETU / S") does not come back.
     3. Lower the clamp MINIMUMS only. Desktop sizes are untouched; these
        minimums bind below ~740px, which is where the overflow occurred.
   ===================================================================== */
.lk-page .lk-display,
.lk-page .lk-svc-h1,
.lk-page .lk-h2,
.lk-page .lk-box-h {
	overflow-wrap: break-word;
	hyphens: manual;
}

.lk-page .lk-display { font-size: clamp(30px, 7.4vw, 104px); }
.lk-page .lk-h2 { font-size: clamp(25px, 4.6vw, 60px); }
.lk-page .lk-svc-h1 { font-size: clamp(26px, 4.6vw, 60px); }
.lk-page .lk-final-cta .lk-display { font-size: clamp(26px, 4.4vw, 60px); }
.lk-page .lk-darkbox .lk-box-h { font-size: clamp(20px, 3vw, 36px); }
.lk-page .lk-svc-hero .lk-mediatext .lk-svc-h1 { font-size: clamp(26px, 4.1vw, 52px); }

/* Long CTA labels ("Lue lisää vakuutushinauksesta") are clipped at 320px
   because the button rule above sets white-space: nowrap. That nowrap is
   there to keep phone numbers on one line, so keep it for the phone
   buttons and let every other label wrap on very narrow screens. */
@media (max-width: 400px) {
	.lk-page .lk-btn:not(.lk-btn-phone) .wp-block-button__link {
		white-space: normal;
		text-align: center;
	}
}

/* The two-column media+text rows give the text column ~508px at its widest,
   but .lk-h2 capped at 60px needs 648px for BÄRGNINGSTJÄNSTER. Before this
   the word overflowed its column; with the break-word net above it would
   instead split mid-word. Cap the font so the longest word fits the column,
   the same way .lk-svc-hero .lk-svc-h1 is already capped above.
   17 chars x 0.635em = 10.8em, so 508px / 10.8 = 47px is the ceiling; 44px
   leaves headroom for the wider fallback face before Fugaz One loads. */
.lk-page .lk-mediatext .lk-h2 {
	font-size: clamp(25px, 3.2vw, 44px);
}