/* ==========================================================
   K2 Cooling – main stylesheet
   ========================================================== */

:root {
	/* Colour */
	--k2-ink: #15232e;      /* deep cold slate: text, footer */
	--k2-steel: #24394a;    /* plant-room steel: hero, CTA */
	--k2-frost: #eaf1f4;    /* pale frost: alt sections */
	--k2-ice: #a9cfdc;      /* ice blue: accents on dark */
	--k2-coolant: #0b6e79;  /* coolant teal: links, main buttons */
	--k2-amber: #f2b01e;    /* site-safety amber: breakdown/urgent only */
	--k2-line: #c9d6dd;
	--k2-white: #fff;

	/* Type */
	--k2-font: "Open Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

	/* Space and layout */
	--k2-gutter: clamp(1.25rem, 4vw, 2.5rem);
	--k2-space: clamp(3.5rem, 8vw, 7rem);
	--k2-max: 76rem;
	--k2-measure: 62ch;
	--k2-radius: 2px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: var(--k2-font);
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--k2-ink);
	background: var(--k2-white);
}
img { display: block; max-width: 100%; height: auto; }
figure { margin: 0; }
a { color: var(--k2-coolant); text-underline-offset: 0.2em; }
a:hover { color: var(--k2-ink); }
:focus-visible { outline: 3px solid var(--k2-amber); outline-offset: 2px; }

h1, h2, h3 {
	margin: 0 0 0.5em;
	font-stretch: 75%;
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.01em;
	text-wrap: balance;
}
h1 { font-size: clamp(2.5rem, 4.5vw + 1rem, 4.75rem); }
h2 { font-size: clamp(1.9rem, 2.6vw + 0.8rem, 3rem); }
h3 { font-size: 1.375rem; font-weight: 700; line-height: 1.2; }
p { margin: 0 0 1em; max-width: var(--k2-measure); }
address { font-style: normal; }

.k2-container { width: min(100% - 2 * var(--k2-gutter), var(--k2-max)); margin-inline: auto; }
.k2-section { padding-block: var(--k2-space); }
.k2-lead { font-size: 1.1875rem; }
.k2-meta { font-size: 0.9375rem; color: var(--k2-steel); margin-bottom: 0.5rem; }
.k2-prose > :last-child { margin-bottom: 0; }
.k2-prose ul, .k2-prose ol { max-width: var(--k2-measure); padding-left: 1.25em; }

.k2-skip {
	position: absolute; left: 1rem; top: -4rem; z-index: 100;
	padding: 0.75rem 1rem; background: var(--k2-ink); color: var(--k2-white);
}
.k2-skip:focus { top: 1rem; }

/* ---------- Buttons ---------- */
.k2-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 2rem; }
.k2-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 3rem; padding: 0.75em 1.4em;
	font-weight: 700; line-height: 1.2; text-decoration: none;
	border: 2px solid transparent; border-radius: var(--k2-radius);
}
.k2-btn--primary { background: var(--k2-coolant); border-color: var(--k2-coolant); color: var(--k2-white); }
.k2-btn--primary:hover { background: var(--k2-ink); border-color: var(--k2-ink); color: var(--k2-white); }
.k2-btn--ghost { border-color: currentColor; color: inherit; }
.k2-btn--ghost:hover { background: var(--k2-white); border-color: var(--k2-white); color: var(--k2-ink); }
.k2-btn--light { background: var(--k2-white); color: var(--k2-ink); }
.k2-btn--light:hover { background: var(--k2-frost); color: var(--k2-ink); }
.k2-btn--urgent { background: var(--k2-amber); border-color: var(--k2-amber); color: var(--k2-ink); }
.k2-btn--urgent:hover { background: var(--k2-white); border-color: var(--k2-white); color: var(--k2-ink); }

/* ---------- Header ---------- */
.k2-header { background: var(--k2-white); border-bottom: 1px solid var(--k2-line); }
.k2-header__inner {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: 0.75rem 1.5rem; padding-top: 0.875rem;
}
.k2-brand { margin-right: auto; }
.k2-brand img { max-height: 3.25rem; width: auto; }
.k2-brand__name { font-size: 1.625rem; font-weight: 800; font-stretch: 75%; color: var(--k2-ink); text-decoration: none; }

.k2-header__actions { display: flex; align-items: stretch; gap: 0.75rem; }
.k2-header__call {
	display: grid; align-content: center; padding: 0.4rem 1rem;
	background: var(--k2-amber); color: var(--k2-ink);
	border-radius: var(--k2-radius); text-decoration: none; line-height: 1.2;
}
.k2-header__call:hover { background: var(--k2-ink); color: var(--k2-white); }
.k2-header__call-label { font-size: 0.8125rem; font-weight: 600; }
.k2-header__call-number { font-size: 1.125rem; font-weight: 800; font-stretch: 87.5%; }

.k2-nav { flex-basis: 100%; }
.k2-nav__list { margin: 0; padding: 0; list-style: none; }
.k2-nav__list a { display: block; font-weight: 600; color: var(--k2-ink); text-decoration: none; }
.k2-nav__list a:hover,
.k2-nav__list .current-menu-item > a,
.k2-nav__list .current-menu-ancestor > a { color: var(--k2-coolant); }
.k2-nav__list .sub-menu { margin: 0; padding: 0; list-style: none; }

.k2-nav-toggle {
	display: none; min-height: 2.75rem; padding: 0.5rem 1rem;
	font: inherit; font-weight: 700; color: var(--k2-ink);
	background: none; border: 2px solid var(--k2-ink); border-radius: var(--k2-radius); cursor: pointer;
}

@media (max-width: 959px) {
	.k2-header__inner { padding-bottom: 0.875rem; }
	.js .k2-nav-toggle { display: block; }
	.k2-header__actions { flex-basis: 100%; order: 3; }
	.k2-header__actions > * { flex: 1; text-align: center; }
	.k2-nav { order: 4; }
	.js .k2-nav { display: none; }
	.js .k2-nav.is-open { display: block; }
	.k2-nav__list a { padding: 0.8rem 0; border-top: 1px solid var(--k2-line); }
	.k2-nav__list .sub-menu a { padding-left: 1.25rem; font-weight: 400; }
}

@media (min-width: 960px) {
	.k2-header { position: sticky; top: 0; z-index: 50; }
	.admin-bar .k2-header { top: 32px; }
	.k2-nav { margin-top: 0.25rem; border-top: 1px solid var(--k2-line); }
	.k2-nav__list { display: flex; gap: 0 2rem; }
	.k2-nav__list > li { position: relative; }
	.k2-nav__list > li > a { padding-block: 0.9rem; border-bottom: 3px solid transparent; }
	.k2-nav__list > li.current-menu-item > a,
	.k2-nav__list > li.current-menu-ancestor > a { border-bottom-color: var(--k2-coolant); }
	.k2-nav__list > .menu-item-has-children > a::after {
		content: ""; display: inline-block; width: 0.4em; height: 0.4em; margin-left: 0.45em;
		border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
		transform: translateY(-0.2em) rotate(45deg);
	}
	.k2-nav__list .sub-menu {
		display: none; position: absolute; top: 100%; left: -1rem; z-index: 60;
		min-width: 17rem; padding: 0.5rem 0;
		background: var(--k2-white); border: 1px solid var(--k2-line); border-top: 3px solid var(--k2-coolant);
	}
	.k2-nav__list li:hover > .sub-menu,
	.k2-nav__list li:focus-within > .sub-menu { display: block; }
	.k2-nav__list .sub-menu a { padding: 0.6rem 1rem; font-weight: 500; }
	.k2-nav__list .sub-menu a:hover { background: var(--k2-frost); }
}

/* ---------- Hero ---------- */
.k2-hero {
	position: relative; isolation: isolate; overflow: hidden;
	--k2-def-pad: clamp(4.5rem, 12vw, 9rem);
	background: var(--k2-steel); color: var(--k2-white);
}
.k2-hero__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.k2-hero--image::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(90deg, rgba(21, 35, 46, 0.92) 0%, rgba(21, 35, 46, 0.75) 55%, rgba(21, 35, 46, 0.35) 100%);
}
.k2-hero__title { max-width: 14ch; font-size: clamp(2.75rem, 6vw + 1rem, 5.75rem); line-height: 0.98; }
.k2-hero__intro { font-size: clamp(1.125rem, 0.5vw + 1rem, 1.3125rem); color: var(--k2-frost); max-width: 52ch; }
.k2-hero__emergency { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(169, 207, 220, 0.35); color: var(--k2-ice); }
.k2-hero__call { color: var(--k2-amber); font-weight: 800; white-space: nowrap; }
.k2-hero__call:hover { color: var(--k2-white); }

.k2-hero--compact { --k2-def-pad: clamp(3rem, 7vw, 5rem); }
.k2-hero--compact .k2-hero__title { max-width: 22ch; font-size: clamp(2.25rem, 3.5vw + 1rem, 3.75rem); }
.k2-hero--compact .k2-actions { margin-top: 1.5rem; }
.k2-hero--compact .k2-hero__emergency { margin-top: 1.75rem; }

/* ---------- Text and image ---------- */
.k2-text-media__inner { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 860px) {
	.k2-text-media__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2.5rem, 6vw, 5rem); }
	.k2-text-media--left .k2-text-media__media { order: -1; }
}
.k2-text-media__media img { width: 100%; border-radius: var(--k2-radius); }

/* ---------- Services list ---------- */
.k2-services { background: var(--k2-frost); }
.k2-services__list { margin: 2.5rem 0 0; padding: 0; list-style: none; border-top: 3px solid var(--k2-ink); }
.k2-services__item { display: grid; gap: 0.5rem; padding-block: 1.5rem; border-bottom: 1px solid var(--k2-line); }
.k2-services__title { margin: 0; }
.k2-services__summary { margin: 0; }
.k2-services__link { font-weight: 700; justify-self: start; }
@media (min-width: 860px) {
	.k2-services__item {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr) auto;
		gap: 2.5rem; align-items: baseline;
	}
}

/* ---------- CTA band ---------- */
.k2-cta { background: var(--k2-steel); color: var(--k2-white); }
.k2-cta p { color: var(--k2-frost); }
.k2-cta__inner { display: grid; gap: 1.5rem; align-items: center; }
.k2-cta__inner .k2-actions { margin-top: 0; }
@media (min-width: 860px) {
	.k2-cta__inner { grid-template-columns: minmax(0, 1.4fr) auto; }
	.k2-cta h2 { margin-bottom: 0.25em; }
	.k2-cta p { margin-bottom: 0; }
}

/* ---------- Tones ---------- */
.k2-tone--frost { background: var(--k2-frost); }

/* ---------- Key points ---------- */
.k2-features__list {
	display: grid; gap: 2rem 2.5rem; margin: 2.5rem 0 0; padding: 0; list-style: none;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}
.k2-features__item { padding-top: 1.25rem; border-top: 3px solid var(--k2-ink); }
.k2-features__item h3 { margin-bottom: 0.4em; }
.k2-features__item p { margin: 0; }

/* ---------- Service cards ---------- */
.k2-cards__list {
	display: grid; gap: 1.5rem; margin: 2.5rem 0 0; padding: 0; list-style: none;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr));
}
.k2-card { position: relative; display: flex; flex-direction: column; border: 1px solid var(--k2-line); border-radius: var(--k2-radius); background: var(--k2-white); }
.k2-card__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.k2-card__body { padding: 1.5rem; border-top: 4px solid var(--k2-coolant); }
.k2-card__title { margin-bottom: 0.4em; }
.k2-card__title a { color: var(--k2-ink); text-decoration: none; }
.k2-card__title a::after { content: ""; position: absolute; inset: 0; }
.k2-card:hover { border-color: var(--k2-coolant); }
.k2-card:hover .k2-card__title a { color: var(--k2-coolant); text-decoration: underline; }
.k2-card:focus-within { outline: 3px solid var(--k2-amber); outline-offset: 2px; }
.k2-card__title a:focus-visible { outline: none; }
.k2-card__body p { margin: 0; }

/* ---------- FAQs ---------- */
.k2-faqs__inner { display: grid; gap: 1.5rem 4rem; }
@media (min-width: 860px) { .k2-faqs__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); align-items: start; } }
.k2-faqs__list { border-top: 3px solid var(--k2-ink); }
.k2-faq { border-bottom: 1px solid var(--k2-line); }
.k2-faq__q {
	display: flex; justify-content: space-between; gap: 1rem;
	padding-block: 1.25rem; font-weight: 700; font-size: 1.125rem; cursor: pointer; list-style: none;
}
.k2-faq__q::-webkit-details-marker { display: none; }
.k2-faq__q::after { content: "+"; flex: none; font-size: 1.5rem; line-height: 1; color: var(--k2-coolant); }
.k2-faq[open] .k2-faq__q::after { content: "\2212"; }
.k2-faq__a { padding-bottom: 1.25rem; }

/* ---------- Contact ---------- */
.k2-contact__inner { display: grid; gap: 3rem; }
@media (min-width: 860px) { .k2-contact--form .k2-contact__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); } }
.k2-contact__list { margin: 2rem 0 0; border-top: 3px solid var(--k2-ink); }
.k2-contact__list > div { display: grid; gap: 0.25rem 1.5rem; padding-block: 1rem; border-bottom: 1px solid var(--k2-line); }
@media (min-width: 600px) { .k2-contact__list > div { grid-template-columns: 11rem 1fr; } }
.k2-contact__list dt { font-weight: 700; }
.k2-contact__list dd { margin: 0; }
.k2-contact__urgent a { font-size: 1.375rem; font-weight: 800; font-stretch: 87.5%; color: var(--k2-ink); background: var(--k2-amber); padding: 0.1em 0.4em; text-decoration: none; }

/* ---------- Posts ---------- */
.k2-article { max-width: 46rem; }
.k2-article__image { margin-block: 2rem; }
.k2-post-list { margin: 2rem 0; padding: 0; list-style: none; border-top: 3px solid var(--k2-ink); }
.k2-post-list li { padding-block: 1.5rem; border-bottom: 1px solid var(--k2-line); }
.k2-post-list__title { font-size: 1.75rem; }
.k2-post-list__title a { color: var(--k2-ink); text-decoration: none; }
.k2-post-list__title a:hover { color: var(--k2-coolant); text-decoration: underline; }

/* ---------- Footer ---------- */
.k2-footer { background: var(--k2-ink); color: var(--k2-frost); padding-top: clamp(3rem, 6vw, 5rem); }
.k2-footer a { color: var(--k2-white); }
.k2-footer a:hover { color: var(--k2-amber); }
.k2-footer__inner { display: grid; gap: 2.5rem; padding-bottom: 3rem; }
@media (min-width: 860px) { .k2-footer__inner { grid-template-columns: 1.4fr 1fr 1fr; } }
.k2-footer__name { font-size: 1.5rem; font-weight: 800; font-stretch: 75%; color: var(--k2-white); }
.k2-footer__heading { font-size: 1.125rem; font-stretch: 100%; font-weight: 700; color: var(--k2-white); }
.k2-footer__contact p { margin-bottom: 0.5rem; }
.k2-footer__list { margin: 0; padding: 0; list-style: none; }
.k2-footer__list a { display: inline-block; padding-block: 0.35rem; }
.k2-footer__base {
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem;
	padding-block: 1.5rem; border-top: 1px solid rgba(169, 207, 220, 0.25); font-size: 0.875rem;
}
.k2-footer__base p { margin: 0; }

/* ==========================================================
   Style tab (shared). Breakpoints: mobile < 768, tablet 768–1024, desktop 1025+.
   Inline vars from the editor win; sections can set --k2-def-* defaults.
   ========================================================== */
.k2-styled {
	margin-top: var(--k2-mt, 0);
	margin-bottom: var(--k2-mb, 0);
	padding-top: var(--k2-pt-m, var(--k2-def-pt-m, var(--k2-def-pad, var(--k2-space))));
	padding-bottom: var(--k2-pb-m, var(--k2-def-pt-m, var(--k2-def-pad, var(--k2-space))));
}
@media (min-width: 768px) {
	.k2-styled {
		padding-top: var(--k2-pt-t, var(--k2-def-pt-t, var(--k2-def-pad, var(--k2-space))));
		padding-bottom: var(--k2-pb-t, var(--k2-def-pt-t, var(--k2-def-pad, var(--k2-space))));
	}
}
@media (min-width: 1025px) {
	.k2-styled {
		padding-top: var(--k2-pt, var(--k2-def-pt, var(--k2-def-pad, var(--k2-space))));
		padding-bottom: var(--k2-pb, var(--k2-def-pt, var(--k2-def-pad, var(--k2-space))));
	}
}
/* Colours only apply when set, so each section keeps its own defaults. */
.k2-styled.has-bg { background: var(--k2-bg); }
.k2-styled.has-text,
.k2-styled.has-text :is(p, li, dt, dd, summary, address) { color: var(--k2-text); }
.k2-styled.has-heading :is(h1, h2, h3, h3 a) { color: var(--k2-heading); }
.k2-tagline { margin-bottom: 0.75rem; font-weight: 700; color: var(--k2-accent, var(--k2-coolant)); }
.k2-align--center { text-align: center; }
.k2-align--center :is(p, h1, h2) { margin-inline: auto; }
.k2-align--center .k2-actions { justify-content: center; }
.k2-align--center .k2-features__list,
.k2-align--center .k2-cards__list { text-align: left; }

/* ---------- Logo block ---------- */
.k2-logo-block {
	--k2-def-pt: 112px;
	--k2-def-pt-t: 96px;
	--k2-def-pt-m: 64px;
	--k2-per-now: var(--k2-per-m, 2);
	--k2-gap-now: var(--k2-gap-m, 8px);
	--k2-tile-h-now: calc(var(--k2-tile-h, 176px) * 0.6);
	--k2-logo-w-now: calc(var(--k2-logo-w, 164px) * 0.85);
	background: var(--k2-white);
	overflow: hidden;
}
@media (min-width: 768px) {
	.k2-logo-block {
		--k2-per-now: var(--k2-per-t, 3);
		--k2-gap-now: var(--k2-gap, 16px);
		--k2-tile-h-now: calc(var(--k2-tile-h, 176px) * 0.8);
		--k2-logo-w-now: var(--k2-logo-w, 164px);
	}
}
@media (min-width: 1025px) {
	.k2-logo-block { --k2-per-now: var(--k2-per, 4); --k2-tile-h-now: var(--k2-tile-h, 176px); }
}
.k2-logo-block__heading { margin-bottom: 0.3em; }
.k2-logo-block__text { margin-bottom: 0; font-size: 1.125rem; color: var(--k2-text, var(--k2-steel)); }
.k2-logo-block__intro + .k2-logo-carousel { margin-top: calc(var(--k2-intro-gap, 64px) * 0.6); }
@media (min-width: 768px) { .k2-logo-block__intro + .k2-logo-carousel { margin-top: var(--k2-intro-gap, 64px); } }

.k2-logo-carousel { position: relative; }
.k2-logo-carousel__track {
	display: flex; flex-wrap: wrap; justify-content: center;
	gap: var(--k2-gap-now); margin: 0; padding: 0; list-style: none;
}
.k2-logo-carousel.is-running .k2-logo-carousel__track { flex-wrap: nowrap; justify-content: flex-start; will-change: transform; }
.k2-logo-carousel__slide {
	flex: 0 0 calc((100% - (var(--k2-per-now) - 1) * var(--k2-gap-now)) / var(--k2-per-now));
	display: flex; align-items: center; justify-content: center;
	min-height: var(--k2-tile-h-now);
	padding: 16px;
	background: var(--k2-tile-bg, #f5f8fa);
	border-radius: var(--k2-radius);
}
@media (min-width: 768px) { .k2-logo-carousel__slide { padding: 24px; } }
.has-tile-shadow .k2-logo-carousel__track { padding-block: 6px 14px; }
.has-tile-shadow .k2-logo-carousel__slide {
	box-shadow: 0 1px 2px rgba(21, 35, 46, 0.06), 0 6px 16px -4px rgba(21, 35, 46, 0.12);
	transition: box-shadow 0.2s ease;
}
.has-tile-shadow .k2-logo-carousel__slide:hover {
	box-shadow: 0 2px 4px rgba(21, 35, 46, 0.08), 0 10px 24px -6px rgba(21, 35, 46, 0.18);
}
.k2-logo-carousel__slide a { display: block; }
.k2-logo-carousel__slide img { width: var(--k2-logo-w-now); max-width: 100%; height: auto; max-height: calc(var(--k2-tile-h-now) - 32px); object-fit: contain; }
.is-greyscale .k2-logo-carousel__slide img { filter: grayscale(1); opacity: 0.7; transition: filter 0.2s, opacity 0.2s; }
.is-greyscale .k2-logo-carousel__slide:hover img,
.is-greyscale .k2-logo-carousel__slide a:focus-visible img { filter: none; opacity: 1; }

.k2-logo-carousel__toggle {
	display: block; margin: 1rem 0 0 auto; padding: 0.25rem 0;
	font: inherit; font-size: 0.875rem; font-weight: 600; color: var(--k2-text, var(--k2-steel));
	background: none; border: 0; text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer;
}
.k2-logo-carousel__toggle[hidden] { display: none; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
