/*
Theme Name: Kons Home V2 Child
Description: Editable structural sections using the Kons Home V2 layout.
Template: kons
Version: 1.0.0
Text Domain: kons-child
*/

body.home section[id],
body.home #ideas,
body.kn-landing section[id] {
	scroll-margin-top: 120px;
}

.kn-structure-content {
	float: left;
	width: 100%;
	padding: 95px 100px 90px;
}

.kn-structure-content .kn-title h3 {
	margin-left: 0;
}

.kn-structure-body {
	clear: both;
}

.kn-structure-content p {
	margin-bottom: 25px;
}

.kn-structure-content .kn-enquiry-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px 30px;
}

.kn-structure-content .kn-field-wide {
	grid-column: 1 / -1;
}

.kn-structure-content form label {
	display: block;
	margin-bottom: 0;
	font: inherit;
	color: inherit;
}

.kn-structure-content .gf-form-control-wrap {
	display: block;
	margin-top: 8px;
}

.kn-structure-content form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.kn-structure-content form select,
.kn-structure-content form textarea {
	box-sizing: border-box;
	width: 100%;
	min-height: 42px;
	padding: 10px 15px;
	border: 1px solid #cecfd0;
	background: transparent;
	font: inherit;
	color: inherit;
}

.kn-structure-content form textarea {
	min-height: 168px;
	resize: vertical;
}

.kn-structure-content form input:focus-visible,
.kn-structure-content form select:focus-visible,
.kn-structure-content form textarea:focus-visible,
.kn-structure-content form button:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

.kn-structure-content .kn-form-action {
	margin: 35px 0 0;
}

.kn-structure-content form input[type="submit"],
.kn-structure-content form button[type="submit"] {
	padding: 15px 35px;
	border: 0;
	background: #ffa800;
	color: #000;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

@media (max-width: 1200px) {
	.kn-structure-content {
		padding: 85px 20px;
	}
}

@media (max-width: 991px) {
	.kn-structure-content {
		padding: 95px 100px 70px;
	}
}

@media (max-width: 767px) {
	.kn-structure-content {
		padding: 70px 20px;
	}

	.kn-structure-content .kn-enquiry-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.kn-structure-content .kn-enquiry-grid > p {
	margin: 0;
}

/* London borough map */
.kn-london-map {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
	gap: 50px;
	align-items: center;
	margin-top: 10px;
}

.kn-london-map__canvas {
	position: relative;
}

.kn-london-map__svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

/* Areas we work in are black; the rest of the map (.is-outside) is light grey and not clickable */
.kn-london-map__svg path {
	fill: #000;
	stroke: #fff;
	stroke-width: 2;
	stroke-linejoin: round;
	cursor: pointer;
	transition: fill 0.2s;
}

.kn-london-map__svg path:hover {
	fill: #ffd27a;
}

.kn-london-map__svg path.is-active {
	fill: #ffa800;
}

.kn-london-map__svg path:focus {
	outline: none;
}

.kn-london-map__svg path:focus-visible {
	fill: #ffd27a;
	stroke: #ffa800;
}

.kn-london-map__svg path.is-outside {
	fill: #ececec;
	cursor: default;
}

/* Outside areas only show their name on hover */
.kn-london-map__svg path.is-outside:hover {
	fill: #dcdcdc;
}

/* London / Hertfordshire switch above the maps */
.kn-area-maps__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 10px 0 30px;
}

.kn-area-maps__tab {
	display: inline-block;
	padding: 14px 30px;
	border: 2px solid #000;
	background: transparent;
	color: #000;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.kn-area-maps__tab,
.kn-area-maps__tab:hover,
.kn-area-maps__tab:focus {
	text-decoration: none;
}

.kn-area-maps__tab:hover {
	border-color: #ffa800;
	color: #000;
}

.kn-area-maps__tab[aria-selected="true"] {
	border-color: #ffa800;
	background: #ffa800;
	color: #000;
}

.kn-area-maps__tab:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

.kn-area-maps__panel[hidden] {
	display: none;
}

.kn-london-map__tip {
	position: absolute;
	z-index: 2;
	min-width: 190px;
	padding: 14px 18px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
	transform: translate(-50%, calc(-100% - 14px));
	text-align: center;
}

.kn-london-map__tip[hidden] {
	display: none;
}

.kn-london-map__tip::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -8px;
	margin-left: -8px;
	border: 8px solid transparent;
	border-bottom: 0;
	border-top-color: #fff;
}

/* Touch screens: the tip sits under the map, not over it, so the next tap always lands on the
   district the finger is on instead of on the tip's link */
@media (hover: none) {
	.kn-london-map__tip {
		position: static;
		margin-top: 12px;
		transform: none;
	}

	.kn-london-map__tip::after {
		display: none;
	}
}

.kn-london-map__hover {
	position: absolute;
	z-index: 3;
	padding: 4px 10px;
	background: #000;
	color: #fff;
	font-size: 13px;
	line-height: 1.4;
	white-space: nowrap;
	pointer-events: none;
	transform: translate(-50%, calc(-100% - 12px));
}

.kn-london-map__hover[hidden] {
	display: none;
}

.kn-london-map__tip-name {
	display: block;
	margin-bottom: 6px;
	color: #000;
	font-size: 16px;
}

.kn-london-map__tip-link {
	color: #ffa800;
	font-size: 14px;
	font-weight: 600;
}

.kn-london-map__panel h4 {
	margin: 0 0 15px;
}

.kn-london-map__select {
	box-sizing: border-box;
	width: 100%;
	min-height: 52px;
	margin: 10px 0 20px;
	padding: 10px 15px;
	border: 1px solid #cecfd0;
	background: #fff;
	font: inherit;
	color: inherit;
}

.kn-london-map__button {
	display: block;
	padding: 15px 35px;
	background: #ffa800;
	color: #000;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
}

.kn-london-map__button:hover,
.kn-london-map__button:focus {
	background: #000;
	color: #fff;
}

.kn-london-map__select:focus-visible,
.kn-london-map__button:focus-visible,
.kn-london-map__tip-link:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

@media (max-width: 991px) {
	.kn-london-map {
		grid-template-columns: minmax(0, 1fr);
		gap: 30px;
	}
}

/* Gords logo: 4x source images, shown at the original 25px logo height */
img.logoheader[src*="gords-logo"],
.footer-logo img[src*="gords-logo"],
.footer-logoo img[src*="gords-logo"] {
	width: auto;
	height: 25px;
}

/* Project gallery reveal (gallery-reveal.js sets data-reveal) */
.pro-gallery {
	overflow-x: clip;
}

.pro-gallery .gallery-img[data-reveal] {
	opacity: 0;
	transition: opacity 0.9s ease, transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

.pro-gallery .gallery-img[data-reveal="left"] { transform: translateX(-120px); }
.pro-gallery .gallery-img[data-reveal="right"] { transform: translateX(120px); }
.pro-gallery .gallery-img[data-reveal="bottom"] { transform: translateY(120px); }
.pro-gallery .gallery-img[data-reveal="top"] { transform: translateY(-120px); }

.pro-gallery .gallery-img[data-reveal].is-revealed {
	opacity: 1;
	transform: none;
}

/* Section rhythm on the homepage */
#services .our-services.style2,
#approach .our-services.style2 {
	padding-top: 100px;
}

/* No third-party rating yet: show only the promise in the trust column */
#reviews .rating-star {
	display: none;
}

#reviews .trust-text {
	margin-top: 60px;
}

/* Footer call to action */
.footer-text h2 a {
	color: inherit;
	transition: color 0.2s;
}

.footer-text h2 a:hover,
.footer-text h2 a:focus {
	color: #ffa800;
}

/* The parent theme treats a footer without social links as "no footer" and clips it to 191px. */
body.home.no-footer footer#contact-details,
body.kn-landing.no-footer footer#contact-details {
	height: auto !important;
}

body.home.no-footer .wrapper,
body.kn-landing.no-footer .wrapper {
	margin-bottom: 0 !important;
}

/* Borough picker (london-map.js replaces the native select) */
.kn-picker {
	position: relative;
	margin: 10px 0 20px;
	font-family: inherit;
}

.kn-picker svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.kn-picker__trigger {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	min-height: 64px;
	padding: 10px 18px 10px 12px;
	border: 1px solid #e3e5e8;
	border-radius: 0;
	background: #fff;
	box-shadow: 0 4px 14px rgba(20, 30, 45, 0.06);
	color: #000;
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.kn-picker__trigger:hover {
	border-color: #ffa800;
	box-shadow: 0 8px 24px rgba(20, 30, 45, 0.1);
}

.kn-picker__trigger:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

.kn-picker.is-open .kn-picker__trigger {
	border-color: #ffa800;
	box-shadow: 0 10px 30px rgba(20, 30, 45, 0.12);
}

.kn-picker__pin {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	background: #fff4de;
	color: #ffa800;
	transition: background 0.25s, color 0.25s;
}

.kn-picker.has-value .kn-picker__pin {
	background: #ffa800;
	color: #000;
}

.kn-picker__text {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
}

.kn-picker__caption {
	max-height: 0;
	overflow: hidden;
	color: #8a8f96;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 1.5px;
	line-height: 16px;
	text-transform: uppercase;
	opacity: 0;
	transition: max-height 0.25s, opacity 0.25s;
}

.kn-picker.has-value .kn-picker__caption {
	max-height: 16px;
	opacity: 1;
}

.kn-picker__value {
	overflow: hidden;
	color: #8a8f96;
	font-size: 15px;
	line-height: 22px;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.kn-picker.has-value .kn-picker__value {
	color: #000;
	font-size: 17px;
	font-weight: 600;
}

.kn-picker__chevron {
	display: flex;
	color: #000;
	transition: transform 0.25s;
}

.kn-picker.is-open .kn-picker__chevron {
	transform: rotate(180deg);
}

.kn-picker.is-pulse .kn-picker__pin {
	animation: kn-picker-pulse 0.5s ease;
}

@keyframes kn-picker-pulse {
	0% { transform: scale(1); }
	40% { transform: scale(1.15); }
	100% { transform: scale(1); }
}

.kn-picker__panel {
	position: absolute;
	z-index: 20;
	top: calc(100% + 8px);
	left: 0;
	right: 0;
	border: 1px solid #e3e5e8;
	background: #fff;
	box-shadow: 0 18px 45px rgba(20, 30, 45, 0.16);
	animation: kn-picker-open 0.2s ease-out;
}

.kn-picker__panel[hidden] {
	display: none;
}

@keyframes kn-picker-open {
	from { opacity: 0; transform: translateY(-6px); }
	to { opacity: 1; transform: none; }
}

.kn-picker__search {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0 16px;
	border-bottom: 1px solid #eef0f2;
	color: #8a8f96;
	font: inherit;
}

.kn-picker__search input {
	flex: 1 1 auto;
	min-width: 0;
	height: 50px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #000;
	font: inherit;
	font-size: 15px;
	outline: none;
}

.kn-picker__list {
	max-height: 280px;
	margin: 0;
	padding: 6px 0;
	overflow-y: auto;
	list-style: none;
	overscroll-behavior: contain;
}

.kn-picker__option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin: 0;
	padding: 11px 18px;
	border-left: 3px solid transparent;
	color: #333;
	font-size: 15px;
	line-height: 22px;
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s;
}

.kn-picker__option::before {
	display: none !important;
}

.kn-picker__option[hidden] {
	display: none;
}

.kn-picker__option.is-highlighted {
	border-left-color: #ffa800;
	background: #fff8ea;
}

.kn-picker__option svg {
	flex: 0 0 auto;
	color: #ffa800;
	stroke-width: 2.4;
	opacity: 0;
	transform: scale(0.6);
	transition: opacity 0.2s, transform 0.2s;
}

.kn-picker__option[aria-selected="true"] {
	color: #000;
	font-weight: 600;
}

.kn-picker__option[aria-selected="true"] svg {
	opacity: 1;
	transform: none;
}

.kn-picker__empty {
	margin: 0;
	padding: 18px;
	color: #8a8f96;
	font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
	.kn-picker *,
	.kn-picker__panel {
		animation: none !important;
		transition: none !important;
	}
}

/* Background blueprints: entrance on load, then pointer/scroll drift (blueprint-motion.js) */
.ms-overlay {
	background-color: #eef2f5; /* Same tone as the drawing image, so fading it in shows no white flash. */
}

.ms-overlay::before {
	transform-origin: top right;
	translate: var(--kn-bp-x, 0px) var(--kn-bp-y, 0px);
}

/* Hidden until the page (and the theme preloader) has finished, then played once. */
.ms-overlay.kn-bp-waiting::before {
	opacity: 0;
}

.ms-overlay.kn-bp-ready::before {
	animation: kn-blueprint-in 2.6s cubic-bezier(0.22, 1, 0.36, 1) 0.35s both;
}

@keyframes kn-blueprint-in {
	from {
		opacity: 0;
		scale: 1.07;
		rotate: -1.2deg;
	}
	to {
		opacity: 1;
		scale: 1;
		rotate: 0deg;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ms-overlay::before {
		animation: none;
		translate: none;
	}
}

/* Services: editorial intro + numbered cards */
.kn-services {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 70px;
	float: left;
	width: 100%;
	padding: 110px 100px 100px;
}

.kn-services__intro {
	align-self: start;
	position: sticky;
	top: 140px;
}

.kn-services__eyebrow {
	margin: 0 0 22px;
	color: #ffa800;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 3px;
	line-height: 1;
	text-transform: uppercase;
}

.kn-services__eyebrow::before {
	content: "";
	display: inline-block;
	width: 34px;
	height: 2px;
	margin-right: 14px;
	background: currentColor;
	vertical-align: middle;
}

.kn-services__heading {
	margin: 0 0 26px;
	color: #000;
	font-size: 44px;
	font-weight: 700;
	letter-spacing: -1px;
	line-height: 1.12;
}

.kn-services__heading span {
	display: block;
	color: #ffa800;
}

.kn-services__lead {
	margin: 0 0 36px;
	color: #666;
	font-size: 16px;
	line-height: 28px;
}

.kn-services__button {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 17px 30px;
	background: #000;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.5px;
	transition: background 0.25s, color 0.25s;
}

.kn-services__button span {
	transition: transform 0.25s;
}

.kn-services__button:hover,
.kn-services__button:focus {
	background: #ffa800;
	color: #000;
}

.kn-services__button:hover span {
	transform: translateX(5px);
}

.kn-services__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-service {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 34px 32px 30px;
	background: #fff;
	border: 1px solid #e8ebee;
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s, border-color 0.35s;
}

.kn-service::before {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	width: 0;
	height: 3px;
	background: #ffa800;
	transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.kn-service:hover,
.kn-service:focus-within {
	border-color: transparent;
	box-shadow: 0 22px 50px rgba(20, 30, 45, 0.12);
	transform: translateY(-6px);
}

.kn-service:hover::before,
.kn-service:focus-within::before {
	width: calc(100% + 2px);
}

.kn-service__media {
	margin: -34px -32px 28px;
	overflow: hidden;
	aspect-ratio: 16 / 10;
}

.kn-service__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.kn-service:hover .kn-service__image {
	transform: scale(1.06);
}

.kn-service__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 30px;
}

.kn-service__number {
	color: transparent;
	font-size: 46px;
	font-weight: 700;
	line-height: 1;
	-webkit-text-stroke: 1px #c9ced4;
	transition: color 0.35s, -webkit-text-stroke-color 0.35s;
}

.kn-service:hover .kn-service__number,
.kn-service:focus-within .kn-service__number {
	color: #ffa800;
	-webkit-text-stroke-color: #ffa800;
}

.kn-service__icon {
	color: #000;
	font-size: 30px;
	transition: transform 0.35s;
}

.kn-service:hover .kn-service__icon {
	transform: rotate(-8deg) scale(1.08);
}

.kn-service__title {
	margin: 0 0 14px;
	color: #000;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.3;
}

.kn-service__text {
	flex: 1 1 auto;
	margin: 0 0 26px;
	color: #666;
	font-size: 14px;
	line-height: 24px;
}

.kn-service__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	align-self: flex-start;
	color: #000;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

/* The whole card is clickable through its link. */
.kn-service__link::after {
	content: "";
	position: absolute;
	inset: 0;
}

.kn-service__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 1px solid #e0e3e7;
	border-radius: 50%;
	font-size: 14px;
	letter-spacing: 0;
	transition: background 0.3s, border-color 0.3s, transform 0.3s;
}

.kn-service:hover .kn-service__arrow,
.kn-service:focus-within .kn-service__arrow {
	border-color: #ffa800;
	background: #ffa800;
	transform: translateX(6px);
}

.kn-service__link:focus-visible {
	outline: none;
}

.kn-service:focus-within {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

/* Reveal on scroll (services.js adds .is-animated) */
.kn-services.is-animated .kn-service,
.kn-services.is-animated .kn-services__intro {
	opacity: 0;
	transform: translateY(40px);
	transition-property: opacity, transform, box-shadow, border-color;
	transition-duration: 0.8s, 0.8s, 0.35s, 0.35s;
	transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
	transition-delay: var(--kn-delay, 0s);
}

.kn-services.is-animated .kn-service.is-visible,
.kn-services.is-animated .kn-services__intro.is-visible {
	opacity: 1;
	transform: none;
}

.kn-services.is-animated .kn-service.is-visible:hover,
.kn-services.is-animated .kn-service.is-visible:focus-within {
	transform: translateY(-6px);
}

@media (max-width: 1200px) {
	.kn-services {
		padding: 90px 20px;
		gap: 50px;
	}
}

@media (max-width: 991px) {
	.kn-services {
		grid-template-columns: minmax(0, 1fr);
		padding: 80px 60px;
	}

	.kn-services__intro {
		position: static;
	}
}

@media (max-width: 767px) {
	.kn-services {
		padding: 70px 20px;
	}

	.kn-services__heading {
		font-size: 34px;
	}

	.kn-services__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
	}

	.kn-service {
		padding: 28px 24px 24px;
	}

	.kn-service__media {
		margin: -28px -24px 24px;
	}
}

.kn-service__link:hover,
.kn-service__link:focus {
	color: #000;
}

/* Services, "steps" layout: heading row above four connected cards */
.kn-services--steps {
	grid-template-columns: minmax(0, 1fr);
	gap: 60px;
}

.kn-services--steps .kn-services__intro {
	position: static;
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	column-gap: 70px;
	align-items: end;
}

.kn-services--steps .kn-services__eyebrow,
.kn-services--steps .kn-services__heading {
	grid-column: 1;
}

.kn-services--steps .kn-services__heading {
	margin-bottom: 0;
}

.kn-services--steps .kn-services__lead {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: end;
	margin-bottom: 0;
}

.kn-services--steps .kn-services__button {
	grid-column: 2;
	justify-self: start;
	margin-top: 30px;
}

.kn-services--steps .kn-services__grid {
	position: relative;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	padding-top: 46px;
}

/* Track and its orange progress, drawn left to right when the steps come into view. */
.kn-services--steps .kn-services__grid::before,
.kn-services--steps .kn-services__grid::after {
	content: "";
	position: absolute;
	top: 6px;
	left: 32px;
	right: 32px;
	height: 2px;
	background: #e3e6ea;
}

.kn-services--steps .kn-services__grid::after {
	background: #ffa800;
	transform-origin: left;
	transition: transform 1.6s cubic-bezier(0.65, 0, 0.35, 1) 0.3s;
}

.kn-services--steps.is-animated .kn-services__grid::after {
	transform: scaleX(0);
}

.kn-services--steps.is-animated .kn-services__grid.is-visible::after {
	transform: scaleX(1);
}

.kn-services--steps.is-animated .kn-services__grid {
	opacity: 1;
	transform: none;
}

/* Dot on the track above each step. */
.kn-services--steps .kn-service::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: -46px;
	left: 26px;
	width: 14px;
	height: 14px;
	border: 2px solid #ffa800;
	border-radius: 50%;
	background: #fff;
	transition: background 0.3s, transform 0.3s;
}

.kn-services--steps .kn-service:hover::after,
.kn-services--steps .kn-service:focus-within::after {
	background: #ffa800;
	transform: translateY(6px) scale(1.25); /* Stay on the track while the card lifts 6px. */
}

.kn-services--steps .kn-service {
	padding: 30px 26px 28px;
}

.kn-services--steps .kn-service__head {
	margin-bottom: 24px;
}

.kn-services--steps .kn-service__title {
	font-size: 19px;
}

.kn-services--steps .kn-service__text {
	margin-bottom: 0;
}

@media (max-width: 1200px) {
	.kn-services--steps .kn-services__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding-top: 0;
	}

	.kn-services--steps .kn-services__grid::before,
	.kn-services--steps .kn-services__grid::after,
	.kn-services--steps .kn-service::after {
		display: none;
	}
}

@media (max-width: 991px) {
	.kn-services--steps .kn-services__intro {
		grid-template-columns: minmax(0, 1fr);
	}

	.kn-services--steps .kn-services__lead,
	.kn-services--steps .kn-services__button {
		grid-column: 1;
		grid-row: auto;
	}

	.kn-services--steps .kn-services__lead {
		margin-top: 24px;
	}
}

@media (max-width: 767px) {
	.kn-services--steps .kn-services__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Reveal for plain items inside editorial sections */
.kn-services.is-animated .kn-reveal {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
	transition-delay: var(--kn-delay, 0s);
}

.kn-services.is-animated .kn-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* Why choose us */
.kn-why__quote {
	position: relative;
	margin: 10px 0 0;
	padding: 62px 0 0 0;
	border: 0;
	border-top: 1px solid #e8ebee;
}

.kn-why__quote::before {
	content: "\201C";
	position: absolute;
	top: 18px;
	left: -6px;
	color: #ffa800;
	font-family: 'Libre Baskerville', serif;
	font-size: 90px;
	line-height: 1;
	opacity: 0.25;
}

.kn-why__quote p {
	position: relative;
	margin: 0 0 18px;
	color: #000;
	font-family: 'Libre Baskerville', serif;
	font-size: 24px;
	line-height: 1.5;
}

.kn-why__quote cite {
	color: #8a8f96;
	font-size: 13px;
	font-style: normal;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.kn-why__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 50px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-why__item {
	display: flex;
	gap: 20px;
	margin: 0;
	padding: 34px 0;
	border-bottom: 1px solid #e8ebee;
}

.kn-why__item:nth-child(-n + 2) {
	padding-top: 6px;
}

.kn-why__item::before {
	display: none !important;
}

.kn-why__check {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #fff4de;
	color: #ffa800;
	transition: background 0.3s, color 0.3s, transform 0.3s;
}

.kn-why__check svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.kn-why__item:hover .kn-why__check {
	background: #ffa800;
	color: #000;
	transform: rotate(-10deg) scale(1.08);
}

.kn-why__title {
	margin: 8px 0 10px;
	color: #000;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
}

.kn-why__text {
	margin: 0;
	color: #666;
	font-size: 14px;
	line-height: 24px;
}

/* Ideas & advice */
.kn-services--ideas {
	grid-template-columns: minmax(0, 1fr);
	gap: 56px;
}

.kn-services--ideas .kn-services__intro {
	position: static;
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	column-gap: 70px;
	align-items: end;
}

.kn-services--ideas .kn-services__eyebrow,
.kn-services--ideas .kn-services__heading {
	grid-column: 1;
}

.kn-services--ideas .kn-services__heading {
	margin-bottom: 0;
}

.kn-services--ideas .kn-services__lead {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: end;
	margin-bottom: 0;
}

.kn-services--ideas .kn-services__button {
	grid-column: 2;
	justify-self: start;
	margin-top: 30px;
}

.kn-services__button--ghost {
	border: 1px solid #000;
	background: transparent;
	color: #000;
}

.kn-services__button--ghost:hover,
.kn-services__button--ghost:focus {
	border-color: #ffa800;
}

.kn-ideas {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-idea {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	background: #fff;
	border: 1px solid #e8ebee;
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s, border-color 0.35s;
}

.kn-idea::before {
	display: none !important;
}

.kn-idea:hover,
.kn-idea:focus-within {
	border-color: transparent;
	box-shadow: 0 22px 50px rgba(20, 30, 45, 0.12);
	transform: translateY(-6px);
}

.kn-services.is-animated .kn-idea.is-visible:hover,
.kn-services.is-animated .kn-idea.is-visible:focus-within {
	transform: translateY(-6px);
}

.kn-idea__media {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	background: #eef2f5;
}

.kn-idea__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.kn-idea:hover .kn-idea__image {
	transform: scale(1.06);
}

.kn-idea__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 26px 28px 28px;
}

.kn-idea__meta {
	margin: 0 0 12px;
	color: #ffa800;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.kn-idea__title {
	margin: 0 0 12px;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.35;
}

.kn-idea__title a {
	color: #000;
}

/* The whole card opens the article. */
.kn-idea__title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.kn-idea__title a:focus-visible {
	outline: none;
}

.kn-idea:focus-within {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

.kn-idea__excerpt {
	flex: 1 1 auto;
	margin: 0 0 22px;
	color: #666;
	font-size: 14px;
	line-height: 24px;
}

.kn-idea__more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: #000;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.kn-idea:hover .kn-service__arrow,
.kn-idea:focus-within .kn-service__arrow {
	border-color: #ffa800;
	background: #ffa800;
	transform: translateX(6px);
}

@media (max-width: 1200px) {
	.kn-ideas {
		gap: 18px;
	}

	.kn-idea__body {
		padding: 22px 22px 24px;
	}
}

@media (max-width: 991px) {
	.kn-why__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.kn-why__item:nth-child(2) {
		padding-top: 34px;
	}

	.kn-services--ideas .kn-services__intro {
		grid-template-columns: minmax(0, 1fr);
	}

	.kn-services--ideas .kn-services__lead,
	.kn-services--ideas .kn-services__button {
		grid-column: 1;
		grid-row: auto;
	}

	.kn-services--ideas .kn-services__lead {
		margin-top: 24px;
	}
}

@media (max-width: 767px) {
	.kn-ideas {
		grid-template-columns: minmax(0, 1fr);
	}

	.kn-why__quote p {
		font-size: 20px;
	}
}

/* Enquiry section */
.kn-field--name .kn-field__icon::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22/%3E%3Cpath%20d%3D%22M4%2020c1.5-4%204.5-6%208-6s6.5%202%208%206%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22/%3E%3Cpath%20d%3D%22M4%2020c1.5-4%204.5-6%208-6s6.5%202%208%206%22/%3E%3C/svg%3E"); }
.kn-field--email .kn-field__icon::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%221.5%22/%3E%3Cpath%20d%3D%22M3.5%206l8.5%207%208.5-7%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%221.5%22/%3E%3Cpath%20d%3D%22M3.5%206l8.5%207%208.5-7%22/%3E%3C/svg%3E"); }
.kn-field--phone .kn-field__icon::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6.5%203.5h3l1.5%204-2%201.5a11%2011%200%200%200%206%206l1.5-2%204%201.5v3a2%202%200%200%201-2%202A16.5%2016.5%200%200%201%204.5%205.5a2%202%200%200%201%202-2z%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6.5%203.5h3l1.5%204-2%201.5a11%2011%200%200%200%206%206l1.5-2%204%201.5v3a2%202%200%200%201-2%202A16.5%2016.5%200%200%201%204.5%205.5a2%202%200%200%201%202-2z%22/%3E%3C/svg%3E"); }
.kn-field--location .kn-field__icon::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2021s-7-6.2-7-11.5A7%207%200%200%201%2019%209.5C19%2014.8%2012%2021%2012%2021z%22/%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%229.5%22%20r%3D%222.5%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2021s-7-6.2-7-11.5A7%207%200%200%201%2019%209.5C19%2014.8%2012%2021%2012%2021z%22/%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%229.5%22%20r%3D%222.5%22/%3E%3C/svg%3E"); }
.kn-field--message .kn-field__icon::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%205h16v11H9l-5%204z%22/%3E%3Cpath%20d%3D%22M8%209.5h8M8%2012.5h5%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%205h16v11H9l-5%204z%22/%3E%3Cpath%20d%3D%22M8%209.5h8M8%2012.5h5%22/%3E%3C/svg%3E"); }

.kn-next {
	margin-top: 44px;
	padding-top: 34px;
	border-top: 1px solid #e8ebee;
}

.kn-next__title {
	margin: 0 0 22px;
	color: #000;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.kn-next__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-next__item {
	display: flex;
	gap: 18px;
	margin: 0 0 20px;
}

.kn-next__item::before {
	display: none !important;
}

.kn-next__number {
	flex: 0 0 auto;
	width: 36px;
	color: #ffa800;
	font-size: 15px;
	font-weight: 700;
	line-height: 22px;
}

.kn-next__item strong {
	display: block;
	color: #000;
	font-size: 15px;
	line-height: 22px;
}

.kn-next__item span:not(.kn-next__number) {
	display: block;
	color: #666;
	font-size: 14px;
	line-height: 22px;
}

.kn-enquiry-card {
	align-self: start;
	padding: 44px;
	background: #f4f6f8;
}

.kn-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.kn-field {
	min-width: 0;
}

.kn-field--wide {
	grid-column: 1 / -1;
}

.kn-field__box {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	min-height: 64px;
	margin: 0;
	padding: 10px 18px 10px 12px;
	border: 1px solid #e3e5e8;
	background: #fff;
	box-shadow: 0 4px 14px rgba(20, 30, 45, 0.06);
	font: inherit;
	cursor: text;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.kn-field__box:hover {
	border-color: #ffa800;
}

.kn-field__box:focus-within {
	border-color: #ffa800;
	box-shadow: 0 10px 30px rgba(20, 30, 45, 0.12);
}

.kn-field--message .kn-field__box {
	align-items: flex-start;
}

.kn-field__icon {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	background: #fff4de;
	transition: background 0.25s;
}

.kn-field__icon::before {
	content: "";
	width: 20px;
	height: 20px;
	background: #ffa800;
	-webkit-mask: no-repeat center / contain;
	mask: no-repeat center / contain;
	transition: background 0.25s;
}

.kn-field__box:focus-within .kn-field__icon {
	background: #ffa800;
}

.kn-field__box:focus-within .kn-field__icon::before {
	background: #000;
}

.kn-field__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
}

.kn-field__caption {
	color: #8a8f96;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 1.5px;
	line-height: 16px;
	text-transform: uppercase;
}

.kn-form .gf-form-control-wrap {
	display: block;
	margin: 0;
}

.kn-form .kn-field__box input,
.kn-form .kn-field__box textarea {
	display: block;
	width: 100%;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 2px 0 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: #000;
	font: inherit;
	font-size: 16px;
	line-height: 24px;
	outline: none;
}

.kn-form .kn-field__box textarea {
	min-height: 110px;
	resize: vertical;
}

.kn-form .kn-field__box input::placeholder,
.kn-form .kn-field__box textarea::placeholder {
	color: #b3b8be;
	opacity: 1;
}

/* Service picker inside the form */
.kn-field__plain {
	display: block;
	margin: 0;
	font: inherit;
}

.kn-field--service.has-picker .kn-field__plain > .kn-field__caption {
	display: none;
}

.kn-field--service select:not([hidden]) {
	width: 100%;
	min-height: 56px;
	margin-top: 6px;
	padding: 10px 15px;
	border: 1px solid #e3e5e8;
	background: #fff;
	font: inherit;
}

.kn-form .kn-picker {
	margin: 0;
}

.kn-form .kn-picker__caption {
	max-height: 16px;
	opacity: 1;
}

.kn-form .kn-picker__value {
	color: #b3b8be;
	font-size: 16px;
	font-weight: 400;
}

.kn-form .kn-picker.has-value .kn-picker__value {
	color: #000;
	font-size: 16px;
	font-weight: 400;
}

.kn-form .kn-picker__trigger {
	cursor: pointer;
}

.kn-form .kn-picker__list:focus {
	outline: none;
}

/* Validation */
.kn-form .gf-not-valid-tip {
	margin-top: 4px;
	color: #d93025;
	font-size: 12px;
	line-height: 18px;
}

.kn-field__box:has(.gf-not-valid),
.kn-field--service:has(.gf-not-valid) .kn-picker__trigger {
	border-color: #d93025;
}

.kn-field--service .gf-not-valid-tip {
	margin-top: 8px;
}

/* Submit and response */
.kn-form-action {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-top: 28px;
}

.kn-enquiry-card input[type="submit"] {
	padding: 19px 36px;
	border: 0;
	background: #000;
	color: #fff;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.5px;
	cursor: pointer;
	transition: background 0.25s, color 0.25s;
}

.kn-enquiry-card input[type="submit"]:hover,
.kn-enquiry-card input[type="submit"]:focus-visible {
	background: #ffa800;
	color: #000;
}

.kn-enquiry-card input[type="submit"]:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

.kn-enquiry-card .gf-spinner {
	margin: 0;
}

.kn-enquiry-card .gf form .gf-response-output {
	margin: 24px 0 0;
	padding: 16px 20px;
	border: 0;
	border-left: 3px solid #ffa800;
	background: #fff;
	color: #000;
	font-size: 14px;
	line-height: 22px;
}

.kn-enquiry-card .gf form.invalid .gf-response-output,
.kn-enquiry-card .gf form.failed .gf-response-output,
.kn-enquiry-card .gf form.spam .gf-response-output {
	border-left-color: #d93025;
}

.kn-enquiry-card .gf form.sent .gf-response-output {
	border-left-color: #2e9d57;
}

@media (max-width: 767px) {
	.kn-enquiry-card {
		margin: 0 -20px;
		padding: 24px 20px;
	}

	.kn-form {
		grid-template-columns: minmax(0, 1fr);
	}

	.kn-enquiry-card input[type="submit"] {
		width: 100%;
	}
}

/* About slider */
.kn-hero {
	--kn-hero-ease: cubic-bezier(0.77, 0, 0.18, 1);
	position: relative;
	float: left;
	width: 100%;
	height: 760px;
	overflow: hidden;
	background: #111;
	color: #fff;
}

.kn-hero__slides {
	position: absolute;
	inset: 0;
	touch-action: pan-y;
}

.kn-hero__slide {
	position: absolute;
	inset: 0;
	overflow: hidden;
	transition: transform 1.2s var(--kn-hero-ease);
}

.kn-hero__media {
	position: absolute;
	inset: 0;
	transition: transform 1.2s var(--kn-hero-ease);
}

.kn-hero__slide.no-transition,
.kn-hero__slide.no-transition .kn-hero__media {
	transition: none;
}

.kn-hero__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.08);
	transition: transform calc(var(--kn-hero-interval, 6s) + 1.5s) linear;
}

/* Slow push-in on the photo that is showing. */
.kn-hero__slide.is-active .kn-hero__image {
	transform: scale(1);
}

.kn-hero__shade {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(10, 12, 16, 0.72) 0%, rgba(10, 12, 16, 0.4) 45%, rgba(10, 12, 16, 0) 78%),
		linear-gradient(0deg, rgba(10, 12, 16, 0.65) 0%, rgba(10, 12, 16, 0) 38%);
	pointer-events: none;
}

.kn-hero__content {
	position: absolute;
	top: 50%;
	left: 100px;
	max-width: 640px;
	transform: translateY(-62%);
}

.kn-hero__eyebrow {
	margin: 0 0 22px;
	color: #ffa800;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 3px;
	line-height: 1;
	text-transform: uppercase;
}

.kn-hero__eyebrow::before {
	content: "";
	display: inline-block;
	width: 34px;
	height: 2px;
	margin-right: 14px;
	background: currentColor;
	vertical-align: middle;
}

.kn-hero__heading {
	margin: 0 0 24px;
	color: #fff;
	font-size: 62px;
	font-weight: 700;
	letter-spacing: -1.5px;
	line-height: 1.06;
}

.kn-hero__heading span {
	display: block;
	color: #ffa800;
}

.kn-hero__lead {
	max-width: 520px;
	margin: 0 0 34px;
	color: rgba(255, 255, 255, 0.85);
	font-size: 17px;
	line-height: 28px;
}

.kn-hero__button {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 18px 32px;
	background: #ffa800;
	color: #000;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.5px;
	transition: background 0.25s, color 0.25s;
}

.kn-hero__button span {
	transition: transform 0.25s;
}

.kn-hero__button:hover,
.kn-hero__button:focus {
	background: #fff;
	color: #000;
}

.kn-hero__button:hover span {
	transform: translateX(5px);
}

/* Content rises in the first time the slider is seen. */
.kn-hero__content > * {
	transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1), transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Hidden only once the script is running, so the text never stays invisible without it. */
.kn-hero.is-ready:not(.is-inview) .kn-hero__content > * {
	opacity: 0;
	transform: translateY(30px);
}

.kn-hero.is-inview .kn-hero__content > :nth-child(2) { transition-delay: 0.1s; }
.kn-hero.is-inview .kn-hero__content > :nth-child(3) { transition-delay: 0.2s; }
.kn-hero.is-inview .kn-hero__content > :nth-child(4) { transition-delay: 0.3s; }

/* Bottom bar: progress ring, labelled tabs, arrows */
.kn-hero__bar {
	position: absolute;
	right: 100px;
	bottom: 44px;
	left: 100px;
	display: flex;
	align-items: flex-end;
	gap: 40px;
}

.kn-hero__counter {
	position: relative;
	flex: 0 0 auto;
	width: 56px;
	height: 56px;
}

.kn-hero__counter svg {
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
}

.kn-hero__counter circle {
	fill: none;
	stroke-width: 2;
}

.kn-hero__ring-track {
	stroke: rgba(255, 255, 255, 0.3);
}

.kn-hero__ring {
	stroke: #ffa800;
	stroke-dasharray: 100;
	stroke-dashoffset: 100;
}

.kn-hero__current {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	font-weight: 700;
}

.kn-hero__nav {
	display: flex;
	flex: 1 1 auto;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-hero__nav li {
	flex: 0 1 220px;
	margin: 0;
	padding: 0;
	border-left: 1px solid rgba(255, 255, 255, 0.25);
}

.kn-hero__nav li::before {
	display: none !important;
}

.kn-hero__tab {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 4px 22px 16px;
	border: 0;
	background: none;
	color: rgba(255, 255, 255, 0.7);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: color 0.3s;
}

.kn-hero__tab:hover,
.kn-hero__tab.is-active {
	color: #fff;
}

.kn-hero__tab:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 2px;
}

.kn-hero__kicker {
	margin-bottom: 6px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	opacity: 0.8;
}

.kn-hero__title {
	font-size: 15px;
	font-weight: 600;
	line-height: 22px;
}

.kn-hero__line {
	position: absolute;
	right: 22px;
	bottom: 0;
	left: 22px;
	height: 2px;
	background: rgba(255, 255, 255, 0.2);
	overflow: hidden;
}

.kn-hero__line i {
	display: block;
	width: 100%;
	height: 100%;
	background: #ffa800;
	transform: scaleX(0);
	transform-origin: left;
}

.kn-hero.is-running .kn-hero__tab.is-active .kn-hero__line i {
	animation: kn-hero-progress var(--kn-hero-interval, 6s) linear forwards;
}

.kn-hero.is-running .kn-hero__ring {
	animation: kn-hero-ring var(--kn-hero-interval, 6s) linear forwards;
}

.kn-hero.is-paused .kn-hero__tab.is-active .kn-hero__line i,
.kn-hero.is-paused .kn-hero__ring {
	animation-play-state: paused;
}

@keyframes kn-hero-progress {
	to { transform: scaleX(1); }
}

@keyframes kn-hero-ring {
	to { stroke-dashoffset: 0; }
}

.kn-hero__arrows {
	display: flex;
	gap: 10px;
	margin-left: auto;
}

.kn-hero__arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border: 1px solid rgba(255, 255, 255, 0.45);
	border-radius: 50%;
	background: transparent;
	color: #fff;
	font-size: 18px;
	cursor: pointer;
	transition: background 0.25s, border-color 0.25s, color 0.25s;
}

.kn-hero__arrow:hover,
.kn-hero__arrow:focus-visible {
	border-color: #ffa800;
	background: #ffa800;
	color: #000;
	outline: none;
}

@media (max-width: 1200px) {
	.kn-hero__content {
		left: 40px;
		right: 40px;
	}

	.kn-hero__bar {
		right: 40px;
		left: 40px;
	}
}

@media (max-width: 767px) {
	.kn-hero {
		height: 640px;
	}

	.kn-hero__content {
		top: 70px;
		right: 20px;
		left: 20px;
		transform: none;
	}

	.kn-hero__heading {
		font-size: 38px;
		letter-spacing: -0.5px;
	}

	.kn-hero__lead {
		font-size: 15px;
		line-height: 25px;
	}

	.kn-hero__shade {
		background: linear-gradient(180deg, rgba(10, 12, 16, 0.7) 0%, rgba(10, 12, 16, 0.35) 55%, rgba(10, 12, 16, 0.75) 100%);
	}

	.kn-hero__bar {
		right: 20px;
		bottom: 24px;
		left: 20px;
		gap: 16px;
		align-items: center;
	}

	.kn-hero__nav li {
		display: none;
		flex-basis: auto;
		border-left: 0;
	}

	.kn-hero__nav li:has(.is-active) {
		display: block;
	}

	.kn-hero__tab {
		padding: 0 0 12px;
	}

	.kn-hero__line {
		right: 0;
		left: 0;
	}

	.kn-hero__arrow {
		width: 44px;
		height: 44px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.kn-hero__slide,
	.kn-hero__media,
	.kn-hero__image,
	.kn-hero__content > * {
		transition: none !important;
	}

	.kn-hero__image {
		transform: none;
	}
}

/* Footer: stacked logo and understated developer credit */
.footer-logo img[src*="gords-logo-stacked"] {
	width: auto;
	height: 160px;
}

.bottom-strip .row {
	align-items: center;
}

.copyright-text .kn-credit,
.copyright-text .kn-credit:hover,
.copyright-text .kn-credit:focus {
	color: inherit;
	text-decoration: none;
}

/* Header "Enquire now": periodic sheen, fill-up on hover */
.get-quote a {
	position: relative;
	z-index: 0;
	overflow: hidden;
	isolation: isolate;
	transition: color 0.35s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s;
}

.get-quote a::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	background: #000;
	transform: scaleY(0);
	transform-origin: bottom;
	transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.get-quote a::after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: 0;
	left: -60%;
	width: 40%;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.55) 50%, rgba(255, 255, 255, 0) 100%);
	transform: skewX(-20deg);
	animation: kn-quote-sheen 5s ease-in-out 2s infinite;
}

@keyframes kn-quote-sheen {
	0% { left: -60%; }
	22%, 100% { left: 130%; }
}

.get-quote a:hover,
.get-quote a:focus-visible {
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.get-quote a:hover::before,
.get-quote a:focus-visible::before {
	transform: scaleY(1);
}

.get-quote a:hover::after,
.get-quote a:focus-visible::after {
	animation: none;
	opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
	.get-quote a::after {
		animation: none;
		display: none;
	}
}

/* Sticky header: always stays at the top while scrolling (no slide-in, no hiding) */
header.stick.sticky {
	animation: none !important; /* No theme slideInDown: the bar just stays put. */
	box-shadow: 0 6px 24px rgba(20, 30, 45, 0.08);
}

@media (prefers-reduced-motion: reduce) {
	header.stick.sticky {
		transition: none;
	}
}

/* =====================================================================
   Phone & tablet optimisation
   ===================================================================== */

/* Project gallery: the whole tile opens the project, with a readable caption. */
.pro-gallery .gallery-text h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.pro-gallery .gallery-img::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 55%;
	background: linear-gradient(0deg, rgba(10, 12, 16, 0.7), rgba(10, 12, 16, 0));
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.4s;
}

.pro-gallery .gallery-img:hover::after {
	opacity: 1;
}

.pro-gallery .gallery-text {
	z-index: 1;
}

/* Tablet landscape and below: editorial sections stack, heading first. */
@media (max-width: 1199px) {
	.kn-services--grid,
	.kn-services--why,
	.kn-services--enquiry {
		grid-template-columns: minmax(0, 1fr);
		gap: 50px;
	}

	.kn-services__intro {
		position: static;
	}

	.kn-services--grid .kn-services__intro,
	.kn-services--why .kn-services__intro,
	.kn-services--enquiry .kn-services__intro {
		max-width: 720px;
	}

	.kn-services__heading {
		font-size: 38px;
	}

	.kn-hero__heading {
		font-size: 52px;
	}
}

/* Tablet portrait and below */
@media (max-width: 991px) {
	/* Projects become a swipeable row with captions always visible. */
	.pro-gallery > .row {
		display: flex;
		flex-wrap: nowrap;
		gap: 12px;
		margin: 0;
		padding: 0 60px 6px;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 60px;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.pro-gallery > .row::-webkit-scrollbar {
		display: none;
	}

	.pro-gallery > .row > [class*="col-"],
	.pro-gallery .row.no-margin,
	.pro-gallery .row.no-margin > [class*="col-"] {
		display: contents;
	}

	.pro-gallery .gallery-img {
		float: none;
		flex: 0 0 72%;
		width: auto;
		height: 440px;
		margin: 0;
		scroll-snap-align: start;
	}

	.pro-gallery .gallery-img img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.pro-gallery .gallery-img::after {
		opacity: 1;
	}

	.pro-gallery .gallery-text,
	.pro-gallery .gallery-text.left-more {
		right: 20px;
		bottom: 22px;
		left: 22px;
		transform: none;
	}

	.pro-gallery .gallery-text h5 {
		margin-bottom: 6px;
		font-size: 12px;
		letter-spacing: 1.5px;
		text-transform: uppercase;
	}

	.pro-gallery .gallery-text h3 {
		font-size: 20px;
		line-height: 26px;
	}

	/* Slide-in directions suit a grid, not a swipe row: fade only. */
	.pro-gallery .gallery-img[data-reveal] {
		transform: none;
	}

	/* Articles swipe sideways instead of leaving an orphan card. */
	.kn-ideas {
		display: flex;
		gap: 16px;
		margin: 0 -60px;
		padding: 0 60px 6px;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 60px;
		scrollbar-width: none;
	}

	.kn-ideas::-webkit-scrollbar {
		display: none;
	}

	.kn-idea {
		flex: 0 0 min(70%, 340px);
		scroll-snap-align: start;
	}

	/* Slider nav: only the current label, so nothing wraps. */
	.kn-hero__nav li {
		display: none;
		flex-basis: auto;
		border-left: 0;
	}

	.kn-hero__nav li:has(.is-active) {
		display: block;
	}

	.kn-hero__tab {
		padding: 0 0 12px;
	}

	.kn-hero__line {
		right: 0;
		left: 0;
	}

	.kn-hero__bar {
		align-items: center;
		gap: 20px;
	}

	.kn-hero {
		height: 680px;
	}

	/* Lighter background drawing (29 KB instead of 484 KB). */
	.ms-overlay::before {
		background-image: url(images/blueprint-bg-mobile.jpg);
	}

	/* Bigger, easier targets */
	.project-gallery .kn-title .view-all-project {
		display: inline-block;
		padding: 12px 0;
	}

	.kn-structure-link {
		display: inline-block;
		padding: 10px 0;
	}
}

/* Phones */
@media (max-width: 767px) {
	.pro-gallery > .row {
		padding: 0 20px 6px;
		scroll-padding: 0 20px;
	}

	.pro-gallery .gallery-img {
		flex-basis: 84%;
		height: 360px;
	}

	.kn-ideas {
		margin: 0 -20px;
		padding: 0 20px 6px;
		scroll-padding: 0 20px;
	}

	.kn-idea {
		flex-basis: 84%;
	}

	.kn-services__heading {
		font-size: 32px;
	}

	.kn-hero {
		height: 620px;
	}

	.kn-hero__heading {
		font-size: 36px;
	}

	.kn-services {
		padding: 64px 20px;
	}

	.kn-structure-content {
		padding: 64px 20px;
	}
}

/* Touch screens */
.mobile-menu-btn a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
}

a,
button,
[role="button"],
input,
select,
textarea {
	-webkit-tap-highlight-color: rgba(255, 168, 0, 0.18);
}

@media (hover: none) {
	/* Hover lifts would "stick" after a tap; give press feedback instead. */
	.kn-service:hover,
	.kn-idea:hover,
	.kn-services.is-animated .kn-service.is-visible:hover,
	.kn-services.is-animated .kn-idea.is-visible:hover {
		border-color: #e8ebee;
		box-shadow: none;
		transform: none;
	}

	.kn-service:hover::before {
		width: 0;
	}

	.kn-service:hover .kn-service__number {
		color: transparent;
		-webkit-text-stroke-color: #c9ced4;
	}

	.kn-service:hover .kn-service__arrow,
	.kn-idea:hover .kn-service__arrow {
		border-color: #e0e3e7;
		background: transparent;
		transform: none;
	}

	.kn-idea:hover .kn-idea__image {
		transform: none;
	}

	.kn-service:active,
	.kn-idea:active,
	.pro-gallery .gallery-img:active {
		transform: scale(0.98);
		transition-duration: 0.15s;
	}

	.kn-field__caption,
	.kn-picker__caption,
	.kn-hero__kicker {
		font-size: 12px;
	}

	.get-quote a::after {
		animation-duration: 7s;
	}
}

/* Tablet landscape with touch: taller menu targets */
@media (pointer: coarse) and (min-width: 992px) {
	.nav-desctop-list > li > a {
		display: inline-block;
		padding-top: 12px;
		padding-bottom: 12px;
	}
}

@media (pointer: coarse) {
	.project-gallery .kn-title .view-all-project,
	.kn-structure-link {
		display: inline-block;
		padding-top: 12px;
		padding-bottom: 12px;
	}
}

/* Touch screens have no hover: keep project captions visible. */
@media (hover: none) {
	.pro-gallery .gallery-img::after {
		opacity: 1;
	}

	.pro-gallery .gallery-text {
		transform: none;
	}
}

/* Preloader fail-safe fade (see kons_child_preloader_failsafe) */
.page-loading.kn-loaded {
	opacity: 0 !important;
	pointer-events: none;
	transition: opacity 0.4s ease;
}

/* =====================================================================
   Mobile menu (mobile-menu.js adds .kn-mmenu and the extra parts)
   ===================================================================== */
html.kn-menu-open,
html.kn-menu-open body {
	overflow: hidden;
}

.responsive-mobile-menu.kn-mmenu {
	display: flex;
	flex-direction: column;
	padding: 0 24px 28px;
	background: #eef2f5 url(images/blueprint-bg-mobile.jpg) no-repeat right -140px top -60px / 620px auto;
}

.kn-mmenu__top {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: space-between;
	height: 76px;
	margin-bottom: 18px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.kn-mmenu__logo img {
	display: block;
	width: auto;
	height: 25px;
}

.responsive-mobile-menu.kn-mmenu .close-menu {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	margin: 0;
	padding: 0;
	float: none;
	border: 1px solid #000;
	border-radius: 50%;
	color: #000;
	font-size: 20px;
	transition: background 0.25s, color 0.25s, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.responsive-mobile-menu.kn-mmenu .close-menu:hover,
.responsive-mobile-menu.kn-mmenu .close-menu:focus-visible {
	border-color: #ffa800;
	background: #ffa800;
	transform: rotate(90deg);
	outline: none;
}

.kn-mmenu__eyebrow {
	margin: 14px 0 6px;
	color: #ffa800;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 3px;
	line-height: 1;
	text-transform: uppercase;
}

.kn-mmenu__eyebrow::before {
	content: "";
	display: inline-block;
	width: 30px;
	height: 2px;
	margin-right: 12px;
	background: currentColor;
	vertical-align: middle;
}

.responsive-mobile-menu.kn-mmenu > ul {
	counter-reset: kn-menu;
	margin: 0;
	padding: 0;
}

.responsive-mobile-menu.kn-mmenu > ul > li {
	counter-increment: kn-menu;
	float: none;
	margin: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* Top-level links: number + large label */
.responsive-mobile-menu.kn-mmenu > ul > li > a,
.responsive-mobile-menu.kn-mmenu > ul > li.active > a {
	position: relative;
	display: flex;
	align-items: baseline;
	gap: 16px;
	float: none;
	width: 100%;
	margin: 0;
	padding: 20px 60px 20px 0;
	color: #000;
	font-size: 28px;
	font-weight: 700;
	letter-spacing: -0.5px;
	line-height: 1.15;
	transition: color 0.25s;
}

.responsive-mobile-menu.kn-mmenu > ul > li > a::before,
.responsive-mobile-menu.kn-mmenu > ul > li.menu-has-items > a::before,
.responsive-mobile-menu.kn-mmenu > ul > li.menu-has-items.active > a::before {
	content: counter(kn-menu, decimal-leading-zero);
	position: static;
	flex: 0 0 26px;
	color: #ffa800;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1px;
	transform: none;
}

.responsive-mobile-menu.kn-mmenu > ul > li > a:hover,
.responsive-mobile-menu.kn-mmenu > ul > li > a:focus-visible,
.responsive-mobile-menu.kn-mmenu > ul > li.active > a {
	color: #ffa800;
	outline: none;
}

/* Sub-menu toggle: chevron in a circle */
.responsive-mobile-menu.kn-mmenu > ul > li.menu-has-items > a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 50%;
	background:
		linear-gradient(45deg, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%) no-repeat 13px 15px / 8px 8px,
		linear-gradient(-45deg, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%) no-repeat 19px 15px / 8px 8px;
	color: #000;
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.25s, border-color 0.25s;
}

.responsive-mobile-menu.kn-mmenu > ul > li.menu-has-items.active > a::after {
	border-color: #ffa800;
	background-color: #ffa800;
	transform: rotate(180deg);
}

/* Sub-menu */
.responsive-mobile-menu.kn-mmenu ul ul {
	float: none;
	margin: 0;
	padding: 0 0 16px 42px;
}

.responsive-mobile-menu.kn-mmenu ul ul li {
	margin: 0;
	border: 0;
}

.responsive-mobile-menu.kn-mmenu ul ul li a {
	display: flex;
	align-items: center;
	gap: 12px;
	float: none;
	margin: 0;
	padding: 11px 0;
	color: #555;
	font-size: 17px;
	font-weight: 500;
	transition: color 0.2s;
}

.responsive-mobile-menu.kn-mmenu ul ul li a::before {
	content: "";
	display: block;
	flex: 0 0 auto;
	width: 12px;
	height: 2px;
	background: #ffa800;
	transition: width 0.25s;
}

.responsive-mobile-menu.kn-mmenu ul ul li a:hover,
.responsive-mobile-menu.kn-mmenu ul ul li a:focus-visible {
	color: #000;
	outline: none;
}

.responsive-mobile-menu.kn-mmenu ul ul li a:hover::before {
	width: 22px;
}

/* Footer CTA */
.kn-mmenu__foot {
	margin-top: auto;
	padding-top: 36px;
}

.kn-mmenu__cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 24px;
	background: #ffa800;
	color: #000;
	font-size: 16px;
	font-weight: 700;
	transition: background 0.25s, color 0.25s;
}

.kn-mmenu__cta:hover,
.kn-mmenu__cta:focus {
	background: #000;
	color: #fff;
}

.kn-mmenu__note {
	margin: 14px 0 0;
	color: #666;
	font-size: 14px;
	text-align: center;
}

/* Items rise in one after another when the panel opens. */
.responsive-mobile-menu.kn-mmenu.active > ul > li,
.responsive-mobile-menu.kn-mmenu.active .kn-mmenu__foot {
	animation: kn-mmenu-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
	animation-delay: calc(0.15s + var(--i, 0) * 0.06s);
}

@keyframes kn-mmenu-in {
	from {
		opacity: 0;
		transform: translateY(24px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.responsive-mobile-menu.kn-mmenu.active > ul > li,
	.responsive-mobile-menu.kn-mmenu.active .kn-mmenu__foot {
		animation: none;
	}
}

/* =====================================================================
   No motion on phones (html.kn-no-motion is set in <head>, see functions.php)
   ===================================================================== */
html.kn-no-motion,
html.kn-no-motion body {
	scroll-behavior: auto !important;
}

html.kn-no-motion *,
html.kn-no-motion *::before,
html.kn-no-motion *::after {
	animation: none !important;
	transition: none !important;
}

/* Static end states instead of animated ones */
html.kn-no-motion .kn-hero__image,
html.kn-no-motion .kn-service:active,
html.kn-no-motion .kn-idea:active,
html.kn-no-motion .pro-gallery .gallery-img:active {
	transform: none !important;
}

html.kn-no-motion .kn-hero__tab.is-active .kn-hero__line i {
	transform: scaleX(1);
}

html.kn-no-motion .kn-hero__ring {
	stroke-dashoffset: 0;
}

html.kn-no-motion .kn-services--steps .kn-services__grid::after {
	transform: scaleX(1);
}

html.kn-no-motion .get-quote a::after {
	display: none;
}

/* Phones: projects stacked one under another instead of a swipe row */
@media (max-width: 767px) {
	.pro-gallery > .row {
		flex-direction: column;
		gap: 12px;
		padding: 0 20px;
		overflow: visible;
		scroll-snap-type: none;
	}

	.pro-gallery .gallery-img {
		flex: 0 0 auto;
		width: 100%;
		height: 260px;
	}
}

/* Phones: stacked projects rise in one after another as they scroll into view. */
@media (max-width: 767px) {
	.pro-gallery .gallery-img[data-reveal] {
		transform: translateY(40px);
	}

	.pro-gallery .gallery-img[data-reveal].is-revealed {
		transform: none;
	}
}

/* =====================================================================
   Full-bleed on approach (bleed.js) – desktop only
   ===================================================================== */
@media (min-width: 992px) {
	/* Keep the slider's text and controls on the content grid while the photo widens. */
	.kn-hero.kn-bleed .kn-hero__content {
		left: calc(var(--kn-hero-pad, 100px) + var(--kn-bleed-l, 0px));
	}

	.kn-hero.kn-bleed .kn-hero__bar {
		right: calc(var(--kn-hero-pad, 100px) + var(--kn-bleed-r, 0px));
		left: calc(var(--kn-hero-pad, 100px) + var(--kn-bleed-l, 0px));
	}

	/* Fixed tile heights so widening the gallery never changes the page height. */
	.pro-gallery > .row > .col-lg-6:first-child .gallery-img {
		height: 680px;
	}

	.pro-gallery .row.no-margin > .gallery-img,
	.pro-gallery .row.no-margin > .col-lg-6 .gallery-img {
		height: 340px;
	}

	.pro-gallery .gallery-img img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.pro-gallery.kn-bleed {
		overflow: visible;
	}
}

@media (min-width: 992px) and (max-width: 1200px) {
	.kn-hero {
		--kn-hero-pad: 40px;
	}
}

/* Full-width blocks: keep inner content aligned with the rest of the page at every size. */
.kn-hero {
	--kn-hero-pad: 100px;
}

.kn-hero.kn-bleed .kn-hero__content {
	left: calc(var(--kn-hero-pad) + var(--kn-bleed-l, 0px));
}

.kn-hero.kn-bleed .kn-hero__bar {
	right: calc(var(--kn-hero-pad) + var(--kn-bleed-r, 0px));
	left: calc(var(--kn-hero-pad) + var(--kn-bleed-l, 0px));
}

@media (max-width: 1200px) {
	.kn-hero {
		--kn-hero-pad: 40px;
	}
}

@media (max-width: 991px) {
	.pro-gallery.kn-bleed > .row {
		padding-right: calc(60px + var(--kn-bleed-r, 0px));
		padding-left: calc(60px + var(--kn-bleed-l, 0px));
		scroll-padding-left: calc(60px + var(--kn-bleed-l, 0px));
	}
}

@media (max-width: 767px) {
	.kn-hero {
		--kn-hero-pad: 20px;
	}

	.kn-hero.kn-bleed .kn-hero__content {
		right: calc(var(--kn-hero-pad) + var(--kn-bleed-r, 0px));
	}

	/* Stacked projects run edge to edge across the phone screen. */
	.pro-gallery.kn-bleed > .row {
		padding-right: 0;
		padding-left: 0;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.kn-hero {
		--kn-hero-pad: 60px;
	}
}

@media (min-width: 992px) {
	.pro-gallery.kn-bleed > .row {
		margin-right: 0;
		margin-left: 0;
	}
}

/* =====================================================================
   Header logo animation: crown and wordmark drawn over the (invisible) logo image
   ===================================================================== */
header .logo a:has(img.logoheader[src*="gords-logo"]) {
	position: relative;
	display: inline-block;
	line-height: 0;
}

header .logo img.logoheader[src*="gords-logo"] {
	opacity: 0; /* Keeps size, alt text and link; the parts below are what you see. */
}

header .logo a:has(img.logoheader[src*="gords-logo"])::before,
header .logo a:has(img.logoheader[src*="gords-logo"])::after {
	content: "";
	position: absolute;
	background: no-repeat left center / contain;
	pointer-events: none;
}

/* Crown: 42.75 × 25 of the 117 × 25 logo */
header .logo a:has(img.logoheader[src*="gords-logo"])::before {
	top: 0;
	left: 0;
	width: 36.6%;
	height: 100%;
	background-image: url(images/logo-crown.png);
	transform-origin: 50% 90%;
	transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.3s;
}

/* Wordmark: 64.25 × 20, bottom-aligned */
header .logo a:has(img.logoheader[src*="gords-logo"])::after {
	top: 20%;
	left: 45.1%;
	width: 54.9%;
	height: 80%;
	background-image: url(images/logo-word.png);
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Entrance once the page is ready: crown drops in with a bounce, then the word wipes in. */
html:not(.kn-no-motion):not(.kn-page-ready) header .logo a:has(img.logoheader[src*="gords-logo"])::before {
	opacity: 0;
}

html:not(.kn-no-motion):not(.kn-page-ready) header .logo a:has(img.logoheader[src*="gords-logo"])::after {
	clip-path: inset(0 100% 0 0);
}

html.kn-page-ready:not(.kn-no-motion) header .logo a:has(img.logoheader[src*="gords-logo"])::before {
	animation:
		kn-crown-drop 0.9s cubic-bezier(0.34, 1.56, 0.64, 1) 0.1s both,
		kn-crown-idle 7s ease-in-out 3s infinite;
}

html.kn-page-ready:not(.kn-no-motion) header .logo a:has(img.logoheader[src*="gords-logo"])::after {
	animation: kn-word-wipe 0.8s cubic-bezier(0.65, 0, 0.35, 1) 0.55s both;
}

/* Entrance and idle animate translate/rotate; hover uses transform, so they combine instead of fighting. */
@keyframes kn-crown-drop {
	0% { opacity: 0; translate: 0 -140%; rotate: -25deg; }
	55% { opacity: 1; translate: 0 8%; rotate: 6deg; }
	75% { translate: 0 -4%; rotate: -3deg; }
	100% { opacity: 1; translate: 0 0; rotate: 0deg; }
}

@keyframes kn-word-wipe {
	from { clip-path: inset(0 100% 0 0); translate: -6px 0; }
	to { clip-path: inset(0 0 0 0); translate: 0 0; }
}

/* Every few seconds the crown gives a small tilt and a glint. */
@keyframes kn-crown-idle {
	0%, 84%, 100% { rotate: 0deg; translate: 0 0; filter: none; }
	88% { rotate: -9deg; translate: 0 -6%; filter: brightness(1.25) drop-shadow(0 0 4px rgba(255, 168, 0, 0.6)); }
	92% { rotate: 6deg; translate: 0 0; filter: brightness(1.15); }
	96% { rotate: -2deg; filter: none; }
}

/* Hover: the crown lifts and tips its hat, the word leans in. */
@media (hover: hover) {
	header .logo a:has(img.logoheader[src*="gords-logo"]):hover::before {
		transform: translateY(-12%) rotate(-12deg) scale(1.06);
		filter: drop-shadow(0 3px 6px rgba(255, 168, 0, 0.45));
	}

	header .logo a:has(img.logoheader[src*="gords-logo"]):hover::after {
		transform: translateX(3px);
	}
}

header .logo a:has(img.logoheader[src*="gords-logo"]):focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 6px;
}

/* =====================================================================
   New stacked crown logo (gords-logo-dark.png). The image stays invisible and
   only sets the size; the header logo animation above draws it in two white
   parts: crown (images/logo-v2-crown.png) and wordmark (images/logo-v2-text.png)
   ===================================================================== */
header .logo img.logoheader[src*="gords-logo-dark"] {
	width: auto;
	height: 120px;
}

/* Logo on the left, vertically centred with the menu and "Enquire now" */
header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) {
	display: flex;
	align-items: center;
}

header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) .logo {
	float: none;
	flex: none;
	order: 1;
	margin-right: auto;
	padding: 10px 0;
}

header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) nav {
	flex: 1;
	order: 2;
}

header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) .get-quote {
	float: none;
	flex: none;
	order: 3;
}

header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) .mobile-menu-btn {
	float: none;
	order: 4;
}

@media (max-width: 991px) {
	header .logo img.logoheader[src*="gords-logo-dark"] {
		height: 85px;
	}

	header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) .logo {
		padding: 0;
	}
}

header .logo a:has(img.logoheader[src*="gords-logo-dark"])::before,
header .logo a:has(img.logoheader[src*="gords-logo-dark"])::after {
	left: 0;
	width: 100%;
	background-size: 100% 100%;
}

/* Crown: top 48% of the logo */
header .logo a:has(img.logoheader[src*="gords-logo-dark"])::before {
	top: 0;
	height: 48%;
	background-image: url(images/logo-v2-crown.png);
}

/* GORDS + line + DESIGN & BUILD: bottom 47.3% */
header .logo a:has(img.logoheader[src*="gords-logo-dark"])::after {
	top: 52.7%;
	height: 47.3%;
	background-image: url(images/logo-v2-text.png);
}

/* =====================================================================
   Blue navigation bar
   ===================================================================== */
header.stick,
header.stick .hd_bar,
header.stick .header-bar {
	background-color: #0033cc;
}

header.stick nav > ul > li > a,
header.stick .mobile-menu-btn a {
	color: #fff;
}

header.stick nav ul ul li {
	background-color: #0029a3;
}

header.stick nav ul ul li a {
	color: #fff;
}

header.stick nav ul li a:hover,
header.stick nav > ul > .active > a {
	color: #ffa800;
}

/* "Enquire now" hover fill: white instead of black, which would vanish on the bar */
header.stick .get-quote a::before {
	background: #fff;
}

header.stick .get-quote a:hover,
header.stick .get-quote a:focus-visible {
	color: #000;
}

/* =====================================================================
   Black bottom strip (footer logo + copyright)
   ===================================================================== */
.bottom-strip,
footer.no-fix .bottom-strip {
	background-color: #000;
}

/* Black stacked logo turned white so it shows on the black strip */
.bottom-strip .footer-logo img[src*="gords-logo-stacked"] {
	filter: invert(1);
}

.bottom-strip .copyright-text.white p {
	color: #fff;
}

/* =====================================================================
   Page loader: crown logo drawn in, then filled (images/loader-logo.webp, 3.6 s,
   plays once). The parent's cube spinner is hidden. The parent's jQuery fadeOut
   is held back so kons_child_preloader_failsafe decides when the loader goes.
   ===================================================================== */
.page-loading {
	background: #000 url(images/loader-logo.webp) center / min(550px, 90vw) auto no-repeat;
}

.page-loading:not(.kn-loaded) {
	display: block !important;
	opacity: 1 !important;
}

.page-loading > .thecube {
	display: none;
}

/* Loader and logo entrance only when entering through the homepage (kons_child_intro_once_flag). */
html.kn-no-intro .page-loading,
html.kn-no-intro .page-loading:not(.kn-loaded) {
	display: none !important;
}

html.kn-no-intro:not(.kn-no-motion) header .logo a:has(img.logoheader[src*="gords-logo"])::before {
	animation: kn-crown-idle 7s ease-in-out 3s infinite;
}

html.kn-no-intro:not(.kn-no-motion) header .logo a:has(img.logoheader[src*="gords-logo"])::after {
	animation: none;
}

/* Area landing pages: the hero headline is the page's H1, styled like the homepage headline */
.kons-construct h1 {
	margin: 0;
	color: #21211e;
	font-size: 72px;
	font-weight: 700;
	line-height: 1.1;
}

@media (max-width: 991px) {
	.kons-construct h1 {
		font-size: 42px;
	}
}

@media (max-width: 767px) {
	.kons-construct h1 {
		font-size: 34px;
	}
}

@media (max-width: 576px) {
	.kons-construct h1 {
		font-size: 28px;
		line-height: 35px;
	}
}

/* Privacy policy: readable legal text inside the structure panel */
#privacy .kn-structure-body {
	max-width: 780px;
}

#privacy .kn-structure-body h4 {
	margin: 40px 0 15px;
	color: #000;
	font-size: 20px;
	font-weight: 600;
}

#privacy .kn-structure-body ul {
	margin: 0 0 25px;
	padding-left: 20px;
	list-style: disc;
}

#privacy .kn-structure-body li {
	margin-bottom: 10px;
	list-style: disc;
}

#privacy .kn-structure-body a {
	color: #000;
	text-decoration: underline;
	text-decoration-color: #ffa800;
	text-underline-offset: 3px;
}

/* Footer privacy link and the note under the enquiry form */
.copyright-text .kn-privacy-link {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.copyright-text .kn-privacy-link:hover,
.copyright-text .kn-privacy-link:focus {
	color: #ffa800;
}

.kn-form-privacy {
	margin: 18px 0 0;
	color: #777;
	font-size: 13px;
	line-height: 1.5;
}

.kn-form-privacy a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.kn-form-privacy a:hover,
.kn-form-privacy a:focus {
	color: #ffa800;
}

/* Portfolio grid (Our Works): tiles sit side by side even before Isotope lays them out */
.portfolio-grid .masonary {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

/* Site-wide footer: logo, navigation and contact columns in the black bottom strip, copyright below */
.kn-site-footer .bottom-strip {
	padding: 70px 0 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: 14px;
	line-height: 1.6;
}

.kn-footer-grid {
	display: grid;
	grid-template-columns: 1.1fr repeat(3, minmax(0, 1fr));
	gap: 40px;
	padding-bottom: 50px;
}

.kn-site-footer .footer-logo {
	float: none;
	margin: 0;
}

.kn-site-footer .footer-logo img {
	width: auto;
	max-width: 150px;
	height: auto;
}

.kn-footer-grid__title {
	margin: 0 0 18px;
	color: #ffa800;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.kn-footer-grid ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-footer-grid li {
	margin: 0 0 10px;
	list-style: none;
}

.kn-footer-grid a {
	color: #fff;
	text-decoration: none;
	transition: color 0.2s;
}

.kn-footer-grid a:hover,
.kn-footer-grid a:focus-visible {
	color: #ffa800;
}

.kn-footer-grid a:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

.kn-footer-grid address {
	margin: 0;
	font-style: normal;
}

.kn-footer-grid .kn-footer-grid__cta {
	display: inline-block;
	margin-top: 6px;
	color: #ffa800;
	font-weight: 600;
}

.kn-footer-grid .kn-footer-grid__cta:hover,
.kn-footer-grid .kn-footer-grid__cta:focus-visible {
	color: #fff;
}

.kn-site-footer .copyright-text {
	float: none;
	width: 100%;
	padding: 24px 0;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	text-align: center;
}

.kn-site-footer .copyright-text p {
	margin: 0;
}

@media (max-width: 991px) {
	.kn-footer-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.kn-footer-grid__brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 767px) {
	.kn-site-footer .bottom-strip {
		padding-top: 50px;
	}

	.kn-footer-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 30px 20px;
		padding-bottom: 30px;
	}

	.kn-footer-grid__col:last-child {
		grid-column: 1 / -1;
	}
}

/* Compact footer: smaller "Start your project" band, tighter columns and copyright */
.kn-site-footer .footer-style2 {
	padding: 48px 0 44px;
}

.kn-site-footer .footer-text h5 {
	margin-bottom: 12px;
	font-size: 12px;
}

.kn-site-footer .footer-text h2 {
	margin-bottom: 8px;
	font-size: 32px;
}

.kn-site-footer .footer-text span {
	margin-bottom: 0;
	font-size: 15px;
}

.kn-site-footer .bottom-strip {
	padding-top: 40px;
	font-size: 13px;
}

.kn-footer-grid {
	gap: 30px;
	padding-bottom: 28px;
}

.kn-footer-grid li {
	margin-bottom: 6px;
}

.kn-footer-grid__title {
	margin-bottom: 12px;
	font-size: 11px;
}

.kn-site-footer .footer-logo img,
.kn-site-footer .footer-logo img[src*="gords-logo"] {
	width: auto;
	max-width: none;
	height: 80px;
}

.kn-site-footer .copyright-text {
	padding: 14px 0;
}

.kn-site-footer .copyright-text p {
	font-size: 12px;
}

@media (max-width: 767px) {
	.kn-site-footer .footer-style2 {
		padding: 36px 0 32px;
	}

	.kn-site-footer .footer-text h2 {
		font-size: 24px;
	}

	.kn-site-footer .bottom-strip {
		padding-top: 30px;
	}

	.kn-footer-grid {
		gap: 20px;
		padding-bottom: 20px;
	}

	.kn-site-footer .footer-logo {
		text-align: left;
		margin-bottom: 0;
	}
}

/* Footer columns, compact: links run in wrapped rows instead of tall lists */
.kn-site-footer .bottom-strip {
	padding-top: 24px;
	font-size: 12px;
	line-height: 1.5;
}

.kn-footer-grid {
	grid-template-columns: auto repeat(3, minmax(0, 1fr));
	align-items: start;
	gap: 16px 32px;
	padding-bottom: 18px;
}

.kn-footer-grid__title {
	margin-bottom: 6px;
	font-size: 10px;
}

.kn-footer-grid ul {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 14px;
}

.kn-footer-grid li {
	margin: 0;
}

.kn-footer-grid .kn-footer-grid__cta {
	margin-top: 0;
}

.kn-site-footer .footer-logo img,
.kn-site-footer .footer-logo img[src*="gords-logo"] {
	height: 48px;
}

.kn-site-footer .copyright-text {
	padding: 10px 0;
}

.kn-site-footer .copyright-text p {
	font-size: 11px;
}

@media (max-width: 991px) {
	.kn-footer-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.kn-site-footer .bottom-strip {
		padding-top: 20px;
	}

	.kn-footer-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
		padding-bottom: 14px;
	}

	.kn-footer-grid__col:last-child {
		grid-column: auto;
	}
}

/* Footer link rows: tight line height and spacing */
.kn-footer-grid li,
.kn-footer-grid a {
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
}

.kn-footer-grid ul {
	gap: 0 12px;
}

/* Footer logo: the header's stacked logo at the header's size, turned white for the black strip */
.kn-footer-logo {
	display: inline-block;
	line-height: 0;
}

.kn-footer-logo img {
	display: block;
	width: auto;
	max-width: none;
	height: 120px;
	filter: invert(1);
}

.kn-footer-logo:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 4px;
}

@media (max-width: 991px) {
	.kn-footer-logo img {
		height: 85px;
	}
}

/* Footer columns centred vertically against the tall logo (the logo itself keeps its size and place) */
.kn-footer-grid {
	align-items: center;
}

/* Services grid with an odd number of cards: the last one spans the full width */
.kn-services--grid .kn-service:last-child:nth-child(odd) {
	grid-column: 1 / -1;
}

/* Service pages: "What is included" checklist */
.kn-structure-content .kn-included {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 30px;
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
}

.kn-structure-content .kn-included li {
	position: relative;
	margin: 0;
	padding-left: 30px;
	color: #000;
	font-weight: 500;
	list-style: none;
}

.kn-structure-content .kn-included li::before {
	content: "";
	position: absolute;
	top: 0.35em;
	left: 0;
	width: 16px;
	height: 9px;
	border-bottom: 2px solid #ffa800;
	border-left: 2px solid #ffa800;
	transform: rotate(-45deg);
}

@media (max-width: 767px) {
	.kn-structure-content .kn-included {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* =====================================================================
   Service page building blocks (Garden Rooms brief): hero sub-headline and
   buttons, feature lists, scope table, fit-out list, FAQ
   ===================================================================== */
.kons-construct h1.kn-h1-long {
	max-width: 900px;
	font-size: 56px;
}

.kons-construct .kn-hero-sub {
	max-width: 680px;
	margin: 24px 0 0;
	color: #333;
	font-size: 18px;
	line-height: 1.6;
}

.kn-hero-actions,
.kn-cta-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 32px;
}

.kn-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 16px 28px;
	border: 2px solid #000;
	background: #000;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.3px;
	text-decoration: none;
	transition: background 0.25s, border-color 0.25s, color 0.25s;
}

.kn-btn:hover,
.kn-btn:focus-visible {
	border-color: #ffa800;
	background: #ffa800;
	color: #000;
	text-decoration: none;
}

.kn-btn--ghost {
	background: transparent;
	color: #000;
}

.kn-btn:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 3px;
}

.kn-structure-content .kn-features {
	margin: 10px 0 25px;
	padding: 0;
	list-style: none;
}

.kn-structure-content .kn-features li {
	position: relative;
	margin: 0 0 14px;
	padding-left: 28px;
	list-style: none;
}

.kn-structure-content .kn-features li::before {
	content: "";
	position: absolute;
	top: 0.55em;
	left: 0;
	width: 12px;
	height: 2px;
	background: #ffa800;
}

.kn-structure-content .kn-features strong {
	color: #000;
}

.kn-table-wrap {
	overflow-x: auto;
	margin: 10px 0 25px;
	-webkit-overflow-scrolling: touch;
}

.kn-scope {
	width: 100%;
	min-width: 720px;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.5;
}

.kn-scope th,
.kn-scope td {
	padding: 14px 16px;
	border-bottom: 1px solid #e6e6e6;
	text-align: left;
	vertical-align: top;
}

.kn-scope thead th {
	border-bottom: 2px solid #000;
	color: #000;
	font-size: 15px;
	font-weight: 700;
}

.kn-scope tbody th {
	width: 20%;
	color: #000;
	font-weight: 600;
}

.kn-scope .kn-scope__price td {
	color: #000;
	font-weight: 700;
}

.kn-structure-content .kn-fitout {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px;
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
	counter-reset: kn-fitout;
}

.kn-structure-content .kn-fitout li {
	margin: 0;
	padding-top: 18px;
	border-top: 2px solid #000;
	list-style: none;
	counter-increment: kn-fitout;
}

.kn-structure-content .kn-fitout li::before {
	content: counter(kn-fitout, decimal-leading-zero);
	display: block;
	margin-bottom: 10px;
	color: #ffa800;
	font-size: 13px;
	font-weight: 700;
}

.kn-structure-content .kn-fitout h4 {
	margin: 0 0 10px;
	color: #000;
	font-size: 18px;
	font-weight: 700;
}

.kn-structure-content .kn-fitout p {
	margin: 0;
}

.kn-faq__item {
	border-bottom: 1px solid #e6e6e6;
}

.kn-faq__question {
	position: relative;
	padding: 20px 40px 20px 0;
	color: #000;
	font-size: 17px;
	font-weight: 600;
	list-style: none;
	cursor: pointer;
}

.kn-faq__question::-webkit-details-marker {
	display: none;
}

.kn-faq__question::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 4px;
	color: #ffa800;
	font-size: 26px;
	font-weight: 400;
	line-height: 1;
	transform: translateY(-50%);
	transition: transform 0.25s;
}

.kn-faq__item[open] .kn-faq__question::after {
	transform: translateY(-50%) rotate(45deg);
}

.kn-faq__question:focus-visible {
	outline: 2px solid #ffa800;
	outline-offset: 2px;
}

.kn-structure-content .kn-faq__answer {
	max-width: 760px;
	margin: 0 0 22px;
}

@media (max-width: 991px) {
	.kons-construct h1.kn-h1-long {
		font-size: 40px;
	}

	.kn-structure-content .kn-fitout {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
	}
}

@media (max-width: 576px) {
	.kons-construct h1.kn-h1-long {
		font-size: 30px;
		line-height: 1.2;
	}

	.kons-construct .kn-hero-sub {
		font-size: 16px;
	}

	.kn-btn {
		justify-content: center;
		width: 100%;
	}
}

/* Footer band with a page's own call to action ([kons_footer_cta]) */
.kn-site-footer.has-page-cta .footer-text h2 {
	max-width: 820px;
	margin-right: auto;
	margin-left: auto;
}

.kn-site-footer.has-page-cta .footer-text > span {
	max-width: 640px;
	margin: 0 auto;
	font-weight: 400;
	line-height: 1.6;
}

.kn-site-footer .footer-text .kn-cta-actions {
	justify-content: center;
	margin-top: 24px;
}

.kn-site-footer .footer-text .kn-btn span {
	display: inline;
	margin: 0;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
}

.kn-cta-phones {
	margin: 20px 0 0;
	color: #000;
	font-size: 14px;
}

.kn-cta-phones a {
	color: #000;
	text-decoration: none;
}

.kn-cta-phones a:hover,
.kn-cta-phones a:focus-visible {
	color: #ffa800;
}

.kn-site-footer .footer-text .kn-cta-phones span {
	display: inline;
	margin: 0 8px;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
}

/* =====================================================================
   Header fixed at the top on every page, from the first pixel. The parent theme
   only switches it to fixed from a scroll script that jQuery 3 often never runs,
   so the header could scroll away; CSS alone keeps it in place.
   ===================================================================== */
header.stick {
	position: fixed !important;
	top: 0;
	left: 0;
	width: 100%;
	margin: 0;
	padding: 0;
	z-index: 9999;
	animation: none !important;
	box-shadow: 0 6px 24px rgba(20, 30, 45, 0.08);
}





/* Anchor targets stop below the fixed header */
section[id],
#ideas {
	scroll-margin-top: 150px;
}

@media (max-width: 991px) {
	section[id],
	#ideas {
		scroll-margin-top: 110px;
	}
}

/* =====================================================================
   Review pass (2026-09-27): compact white header, black headings, one yellow
   accent for actions, even section spacing and one size per heading level.
   Placed last so it overrides the earlier blocks above.
   ===================================================================== */
:root {
	--kn-accent: #ffa800;
	--kn-ink: #111;
	--kn-muted: #555;
	--kn-line: #e3e5e8;
	--kn-section-y: 72px;
	--kn-section-x: 100px;
	--kn-h2: 40px;
	--kn-header-h: 76px;
}

/* Header: white bar, black links, logo and menu on one compact row */
header.stick,
header.stick .hd_bar,
header.stick .header-bar {
	background-color: #fff;
}

header.stick {
	border-bottom: 1px solid var(--kn-line);
	box-shadow: none;
}

header.stick .header-bar {
	min-height: var(--kn-header-h);
}

header .logo img.logoheader[src*="gords-logo-dark"] {
	height: 60px;
}

header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) .logo {
	padding: 8px 0;
}

/* The logo is drawn by pseudo-element images; black copies for the white bar.
   (Not a CSS filter: the crown's idle animation sets its own filter and would reset it.) */
header .logo a:has(img.logoheader[src*="gords-logo-dark"])::before {
	background-image: url(images/logo-v2-crown-dark.png);
}

header .logo a:has(img.logoheader[src*="gords-logo-dark"])::after {
	background-image: url(images/logo-v2-text-dark.png);
}

header.stick nav > ul > li > a,
header.stick .mobile-menu-btn a {
	color: var(--kn-ink);
}

header.stick nav > ul > li > a {
	padding-top: 28px;
	padding-bottom: 28px;
}

header.stick nav ul ul li {
	background-color: #fff;
}

header.stick nav ul ul {
	border: 1px solid var(--kn-line);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

header.stick nav ul ul li a {
	color: var(--kn-ink);
}

header.stick nav ul li a:hover,
header.stick nav > ul > .active > a,
header.stick nav ul ul li a:hover {
	color: var(--kn-ink);
	text-decoration: underline;
	text-decoration-color: var(--kn-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}

header .get-quote {
	width: auto;
}

header.stick .get-quote a {
	padding: 14px 22px;
	font-size: 14px;
	line-height: 1;
	white-space: nowrap;
}

header.stick .get-quote a::after {
	animation: none;
	display: none;
}

header.stick .get-quote a::before {
	background: var(--kn-ink);
}

header.stick .get-quote a:hover,
header.stick .get-quote a:focus-visible {
	color: #fff;
}

section[id],
#ideas,
body.kn-landing section[id] {
	scroll-margin-top: calc(var(--kn-header-h) + 16px);
}

@media (max-width: 991px) {
	:root {
		--kn-header-h: 64px;
	}

	header .logo img.logoheader[src*="gords-logo-dark"] {
		height: 48px;
	}

	/* Phones and tablets keep the header CTA beside the menu button. */
	header .get-quote {
		display: block !important;
		margin-left: auto;
		margin-right: 14px;
	}

	header.stick .get-quote a {
		padding: 11px 14px;
		font-size: 13px;
	}

	header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) .logo {
		margin-right: 0;
	}
}

/* Links in content: black with a yellow underline instead of blue or orange text */
.kn-landing .kn-structure-body a:not(.kn-btn):not(.kn-area-maps a):not(.kn-london-map a),
.kn-landing .kn-faq a,
.kn-landing .kn-structure-link {
	color: var(--kn-ink);
	text-decoration: underline;
	text-decoration-color: var(--kn-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.kn-landing .kn-structure-body a:not(.kn-btn):not(.kn-area-maps a):not(.kn-london-map a):hover {
	text-decoration-color: var(--kn-ink);
}

/* One vertical rhythm for every section */
.kn-structure-content,
.kn-services {
	padding: var(--kn-section-y) var(--kn-section-x);
}

.kn-services--steps,
.kn-services--ideas,
.kn-services--why,
.kn-services--enquiry {
	padding-top: var(--kn-section-y);
	padding-bottom: var(--kn-section-y);
}

/* Section headings: one size for all h2-level headings, with or without the yellow bar */
.kn-services__heading,
.kn-structure-content .kn-title h3 {
	font-size: var(--kn-h2);
	line-height: 1.12;
	letter-spacing: -0.5px;
	color: var(--kn-ink);
}

.kn-structure-content .kn-title h3 {
	margin: 0 0 28px;
	padding-left: 0;
	float: none;
}

.kn-structure-content .kn-title h3::before {
	display: none;
}

.kn-structure-body > p:first-child {
	font-size: 17px;
	color: var(--kn-muted);
}

/* Hero: headline, one line of offer and the CTA, all visible in the first screen */
.kons-construct .kn-hero-sub {
	max-width: 620px;
}

.kons-construct .kn-hero-actions {
	margin-top: 28px;
}

@media (max-width: 991px) {
	:root {
		--kn-section-y: 56px;
		--kn-section-x: 40px;
		--kn-h2: 32px;
	}
}

@media (max-width: 576px) {
	:root {
		--kn-section-y: 44px;
		--kn-section-x: 20px;
		--kn-h2: 28px;
	}

	.kons-construct .kn-hero-actions .kn-btn {
		width: 100%;
		justify-content: center;
	}
}

/* Editor-only slots for content the client still has to supply */
.kn-slot {
	display: grid;
	gap: 6px;
	width: 100%;
	margin: 12px 0;
	padding: 22px 24px;
	border: 2px dashed var(--kn-accent);
	background: #fffaf0;
	color: var(--kn-ink);
	font-size: 14px;
	line-height: 1.5;
}

.kn-slot em {
	color: var(--kn-muted);
	font-size: 12px;
}

.kn-services--cases,
.kn-services--trust {
	display: block;
}

.kn-services--cases .kn-services__intro,
.kn-services--trust .kn-services__intro {
	margin-bottom: 32px;
}

/* Case studies */
.kn-cases {
	display: grid;
	gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-case {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: 32px;
	align-items: start;
}

.kn-case__photos {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}

.kn-case__photos img {
	width: 100%;
	height: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.kn-case__photos img:first-child {
	grid-column: 1 / -1;
	aspect-ratio: 16 / 9;
}

.kn-case__meta {
	margin: 0 0 6px;
	color: var(--kn-muted);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.kn-case__title {
	margin: 0 0 18px;
	font-size: 24px;
}

.kn-case__facts dt {
	margin-top: 14px;
	font-weight: 700;
}

.kn-case__facts dd {
	margin: 4px 0 0;
	color: var(--kn-muted);
}

/* Reviews, team and guarantees */
.kn-trust {
	display: grid;
	gap: 32px;
}

.kn-reviews {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-review {
	padding: 28px;
	border: 1px solid var(--kn-line);
	background: #fff;
}

.kn-review blockquote {
	margin: 0 0 18px;
	padding: 0;
	border: 0;
	font-size: 16px;
}

.kn-review__by span {
	display: block;
	color: var(--kn-muted);
	font-size: 13px;
}

.kn-guarantees {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-guarantees li {
	display: grid;
	gap: 4px;
	padding: 18px 20px;
	border-left: 3px solid var(--kn-accent);
	background: #fafafa;
}

/* Service page photos */
.kn-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-gallery figure {
	margin: 0;
}

.kn-gallery img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.kn-gallery figcaption {
	margin-top: 6px;
	color: var(--kn-muted);
	font-size: 13px;
}

/* Garden room options: one card per type instead of a wide table */
.kn-options {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin: 8px 0 28px;
	padding: 0;
	list-style: none;
}

.kn-option {
	display: flex;
	flex-direction: column;
	padding: 26px 24px;
	border: 1px solid var(--kn-line);
	background: #fff;
}

.kn-option h4 {
	margin: 0 0 8px;
	font-size: 20px;
}

.kn-option__price {
	margin: 0 0 10px !important;
	font-size: 22px;
	font-weight: 700;
	color: var(--kn-ink);
}

.kn-option__price small {
	display: block;
	color: var(--kn-muted);
	font-size: 12px;
	font-weight: 500;
}

.kn-option__facts {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 8px 14px;
	margin: 6px 0 16px;
	font-size: 14px;
}

.kn-option__facts dt {
	font-weight: 700;
}

.kn-option__facts dd {
	margin: 0;
	color: var(--kn-muted);
}

.kn-option .kn-more {
	margin-top: auto;
}

/* "Show more" panels for technical detail */
.kn-more {
	margin: 16px 0 0;
	border-top: 1px solid var(--kn-line);
}

.kn-more summary {
	padding: 14px 0;
	font-weight: 700;
	cursor: pointer;
	list-style: none;
}

.kn-more summary::-webkit-details-marker {
	display: none;
}

.kn-more summary::after {
	content: "+";
	float: right;
	color: var(--kn-ink);
	font-weight: 700;
}

.kn-more[open] summary::after {
	content: "–";
}

.kn-more summary:focus-visible {
	outline: 2px solid var(--kn-accent);
	outline-offset: 3px;
}

@media (max-width: 991px) {
	.kn-options,
	.kn-case {
		grid-template-columns: 1fr;
	}
}

/* Brief geography on the homepage */
.kn-areas-brief {
	display: grid;
	gap: 10px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
	font-size: 17px;
}

.kn-areas-brief strong {
	display: inline-block;
	min-width: 150px;
}

/* Contact details beside the form on the Contact page */
.kn-contact-list {
	margin-top: 32px;
}

.kn-contact-list ul {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 17px;
}

.kn-contact-list a {
	color: var(--kn-ink);
	font-weight: 600;
}

.kn-contact-list span {
	display: inline-block;
	min-width: 84px;
	color: var(--kn-muted);
}

.kn-contact-list address {
	margin: 0;
	font-style: normal;
}

/* Area picker in the form: same treatment as the service picker */
.kn-field--area.has-picker .kn-field__plain > .kn-field__caption {
	display: none;
}

.kn-field--area select:not([hidden]) {
	width: 100%;
	min-height: 56px;
	margin-top: 6px;
	padding: 10px 15px;
	border: 1px solid var(--kn-line);
	background: #fff;
	font: inherit;
}

.kn-field--area:has(.gf-not-valid) .kn-picker__trigger {
	border-color: #d93025;
}

/* White page instead of the grey drawing board; the drawings stay as faint lines. */
.ms-overlay,
body.kn-landing {
	background-color: #fff;
}

/* Hero sits right under the compact header */
.kons-construct {
	margin-top: calc(var(--kn-header-h) - 20px);
}

/* Black headings: the second heading line is no longer yellow */
.kn-services__heading span,
.kn-hero__heading span {
	color: var(--kn-ink);
}

.kn-services__eyebrow {
	color: var(--kn-muted);
}

.kons-construct h4 span {
	color: var(--kn-ink);
	font-weight: 700;
}

/* Yellow is kept for the main actions: every primary button is yellow with black text */
.kn-btn:not(.kn-btn--ghost),
.kn-services__button:not(.kn-services__button--ghost),
.kn-enquiry-card input[type="submit"] {
	border-color: var(--kn-accent);
	background: var(--kn-accent);
	color: #000;
}

.kn-btn:not(.kn-btn--ghost):hover,
.kn-btn:not(.kn-btn--ghost):focus-visible,
.kn-services__button:not(.kn-services__button--ghost):hover,
.kn-services__button:not(.kn-services__button--ghost):focus,
.kn-enquiry-card input[type="submit"]:hover,
.kn-enquiry-card input[type="submit"]:focus-visible {
	border-color: #000;
	background: #000;
	color: #fff;
}

/* The drawing image carries the old grey tone; lift it to white and keep the lines faint. */
.ms-overlay::before {
	filter: brightness(1.065);
}

/* Less empty space under the first screen */
section:has(> .block > .container > .kons-construct) > .block {
	padding-top: 40px;
	padding-bottom: 64px;
}

/* Both area maps in one row ([kons_area_maps layout="row"]): each map above its own picker */
.kn-area-maps--row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 48px;
	max-width: 900px;
	margin: 8px 0 24px;
}

.kn-area-maps--row .kn-london-map {
	grid-template-columns: 1fr;
	gap: 18px;
	margin-top: 0;
}

/* Same map area height for both, so the pickers and buttons line up. */
.kn-area-maps--row .kn-london-map__canvas {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 300px;
}

.kn-area-maps--row .kn-london-map__svg {
	width: auto;
	max-width: 100%;
	height: 100%;
}

.kn-area-maps__title {
	margin: 0 0 14px;
	font-size: 20px;
	font-weight: 700;
}

.kn-landing .kn-area-maps__title a {
	color: var(--kn-ink);
	text-decoration: none;
}

.kn-area-maps--row .kn-london-map__button {
	display: block;
	width: 100%;
}

@media (max-width: 767px) {
	.kn-area-maps--row {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.kn-area-maps--row .kn-london-map__canvas {
		height: 240px;
	}
}

/* London and Hertfordshire as one map ([kons_area_maps layout="combined"]) */
.kn-london-map--combined {
	grid-template-columns: minmax(0, 440px) minmax(0, 360px);
	gap: 56px;
	margin: 8px 0 24px;
}

/* Hertfordshire is scaled into London's coordinates; keep its lines as thin as London's. */
.kn-london-map--combined path {
	vector-effect: non-scaling-stroke;
}

@media (max-width: 767px) {
	.kn-london-map--combined {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.kn-london-map--combined .kn-london-map__canvas {
		max-width: 340px;
		margin: 0 auto;
	}
}

/* Home hero: headline and CTA on the left, the area map (map only, picker hidden) on the right */
.kons-construct.kn-hero--map {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
	gap: 48px;
	align-items: center;
}

.kn-hero-map .kn-london-map--combined {
	grid-template-columns: minmax(0, 1fr);
	margin: 0;
}

@media (max-width: 991px) {
	.kons-construct.kn-hero--map {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.kn-hero-map .kn-london-map__canvas {
		max-width: 380px;
		margin: 0 auto;
	}
}

/* Header: 60% transparent white with a light frosted blur over the page scrolling underneath */
header.stick {
	background-color: rgba(255, 255, 255, 0.4);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

header.stick .hd_bar,
header.stick .header-bar {
	background-color: transparent;
}

/* Section panels without their white background: the page background shows through */
.main-construct-sec {
	background-color: rgba(255, 255, 255, 0);
}

/* Garden room cards: opening one card's specification must not stretch the others in the row */
.kn-options {
	align-items: start;
}

.kn-option .kn-more {
	margin-top: 0;
}

/* Small section labels: sentence case, larger and darker so they read as text; yellow lead-in line */
.kn-services__eyebrow {
	color: #333;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.3;
	text-transform: none;
}

.kn-services__eyebrow::before {
	width: 28px;
	margin-right: 12px;
	background: var(--kn-accent);
}

/* Mobile menu: every sub-menu is shown, so there is no toggle chevron to tap */
.responsive-mobile-menu.kn-mmenu ul ul {
	display: block !important;
	height: auto !important;
}

.responsive-mobile-menu.kn-mmenu > ul > li.menu-has-items > a::after {
	display: none;
}

.responsive-mobile-menu.kn-mmenu > ul > li.menu-has-items > a {
	padding-right: 0;
	padding-bottom: 8px;
}

/* Header desk phones (in place of the "Get a quote" button): two stacked lines, label muted, number bold */
header .get-quote .kn-header-phones {
	display: grid;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: right;
}

header .get-quote .kn-header-phones li {
	margin: 0;
	padding: 0;
	line-height: 1.25;
}

header .get-quote .kn-header-phones .kn-header-phones__item {
	display: inline-block;
	padding: 0;
	background: none;
	box-shadow: none;
	transform: none;
	overflow: visible;
	color: var(--kn-ink);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.25;
	text-transform: none;
	white-space: nowrap;
	text-decoration: none;
	animation: none;
}

header .get-quote .kn-header-phones .kn-header-phones__item::before,
header .get-quote .kn-header-phones .kn-header-phones__item::after {
	display: none;
}

header .get-quote .kn-header-phones__label {
	color: var(--kn-muted);
	font-size: 13px;
}

header .get-quote .kn-header-phones__number {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

header .get-quote .kn-header-phones a.kn-header-phones__item:hover,
header .get-quote .kn-header-phones a.kn-header-phones__item:focus-visible {
	color: var(--kn-ink);
	transform: none;
	box-shadow: none;
}

header .get-quote .kn-header-phones a:hover .kn-header-phones__number,
header .get-quote .kn-header-phones a:focus-visible .kn-header-phones__number {
	text-decoration: underline;
	text-decoration-color: var(--kn-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

@media (max-width: 991px) {
	header .get-quote .kn-header-phones .kn-header-phones__item {
		font-size: 13px;
	}

	header .get-quote .kn-header-phones__label {
		font-size: 12px;
	}

	header .get-quote .kn-header-phones__desk {
		display: none;
	}
}

@media (max-width: 400px) {
	header .get-quote .kn-header-phones__label {
		display: none;
	}
}

/* =====================================================================
   Contrast bands: each main block sits on its own full-width colour,
   so the page reads as distinct sections (grey, white, dark, white, grey, white, yellow).
   ===================================================================== */
:root {
	--kn-band: #edf0f3; /* Cool grey, the same family as the blueprint drawings. */
	--kn-dark: #1c2026;
	--kn-dark-text: #b9c0c8;
	--kn-dark-line: rgba(255, 255, 255, 0.12);
}

.kn-services-section:has(.kn-services--grid),
.kn-services-section:has(.kn-services--enquiry) {
	background: var(--kn-band);
}

/* Service pages: "What is included" breaks up the long white run between the intro and the process. */
.kn-structure-section#included {
	background: var(--kn-band);
}

.kn-services-section:has(.kn-services--why) {
	background: var(--kn-dark);
}

/* Services: solid white cards lifted off the grey band, numbers visible before hover */
.kn-services--grid .kn-service {
	border-color: transparent;
	box-shadow: 0 1px 2px rgba(20, 30, 45, 0.06), 0 10px 30px rgba(20, 30, 45, 0.06);
}

.kn-services--grid .kn-service__number,
.kn-services--steps .kn-service__number {
	-webkit-text-stroke-color: var(--kn-accent);
}

/* How we work: filled step blocks on the white band */
.kn-services--steps .kn-service {
	border-color: transparent;
	background: var(--kn-band);
}

.kn-services--steps .kn-service:hover,
.kn-services--steps .kn-service:focus-within {
	background: #fff;
}

/* Why Gords: dark band */
.kn-services--why .kn-services__eyebrow,
.kn-services--why .kn-services__heading,
.kn-services--why .kn-services__heading span,
.kn-services--why .kn-why__title {
	color: #fff;
}

.kn-services--why .kn-services__lead,
.kn-services--why .kn-why__text {
	color: var(--kn-dark-text);
}

.kn-services--why .kn-why__item {
	border-bottom-color: var(--kn-dark-line);
}

.kn-services--why .kn-why__check {
	background: var(--kn-accent);
	color: #000;
}

.kn-services--why .kn-why__quote,
.kn-services--why .kn-why__quote p,
.kn-services--why .kn-why__quote cite {
	color: #fff;
}

/* Enquiry: the form becomes a white card on the grey band */
.kn-services--enquiry .kn-enquiry-card {
	background: #fff;
	box-shadow: 0 1px 2px rgba(20, 30, 45, 0.06), 0 20px 50px rgba(20, 30, 45, 0.08);
}

/* Ideas: cards get a firm edge on white */
.kn-services--ideas .kn-idea {
	border-color: #d9dee3;
}

/* Footer call to action: the one yellow band, with a black button */
.kn-site-footer .footer-style2 {
	background: var(--kn-accent);
}

.kn-site-footer .footer-style2 .footer-text h2,
.kn-site-footer .footer-style2 .footer-text h5,
.kn-site-footer .footer-style2 .footer-text > span {
	color: #000;
}

.kn-site-footer .footer-style2 .kn-btn:not(.kn-btn--ghost) {
	border-color: #000;
	background: #000;
	color: #fff;
}

.kn-site-footer .footer-style2 .kn-btn:not(.kn-btn--ghost):hover,
.kn-site-footer .footer-style2 .kn-btn:not(.kn-btn--ghost):focus-visible {
	border-color: #fff;
	background: #fff;
	color: #000;
}

.kn-site-footer .footer-style2 .kn-btn:focus-visible {
	outline-color: #000;
}

.kn-site-footer .footer-style2 .kn-cta-phones a:hover,
.kn-site-footer .footer-style2 .kn-cta-phones a:focus-visible {
	color: #000;
	text-decoration: underline;
}

/* =====================================================================
   Offer band and service photo cards ([kons_ranges])
   ===================================================================== */
.kn-ranges {
	padding: var(--kn-section-y) var(--kn-section-x);
}

.kn-offer {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 32px 64px;
	align-items: center;
	padding-bottom: 56px;
	border-bottom: 1px solid var(--kn-line);
}

.kn-offer__heading {
	max-width: 640px;
	margin: 0 0 14px;
	color: var(--kn-ink);
	font-size: 30px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.3px;
}

.kn-offer__text {
	max-width: 620px;
	margin: 0;
	color: var(--kn-muted);
	font-size: 16px;
	line-height: 1.65;
}

.kn-ranges__heading {
	margin: 56px 0 32px;
	color: var(--kn-ink);
	font-size: var(--kn-h2);
	line-height: 1.12;
	letter-spacing: -0.5px;
}

.kn-ranges__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kn-range {
	position: relative;
	margin: 0;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	background: var(--kn-dark);
}

.kn-range__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Dark at the top for the title and at the bottom for the button, clear in the middle for the photo. */
.kn-range::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.35) 35%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.4) 100%);
	pointer-events: none;
}

.kn-range__body {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 34px 32px;
}

.kn-range__title {
	margin: 0 0 6px;
	color: #fff;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.15;
}

.kn-range__title,
.kn-range__line {
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.35);
}

.kn-range__line {
	margin: 0;
	color: #fff;
	font-size: 15px;
	line-height: 1.5;
}

.kn-range__link {
	margin-top: auto;
	padding: 15px 22px;
	background: #fff;
	color: #000;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.3px;
	text-decoration: none;
	transition: background 0.25s, color 0.25s;
}

/* The whole card is the link target. */
.kn-range__link::before {
	content: "";
	position: absolute;
	inset: 0;
}

.kn-range:hover .kn-range__link,
.kn-range__link:focus-visible {
	background: var(--kn-accent);
	color: #000;
	text-decoration: none;
}

.kn-range__link:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

.kn-range:hover .kn-range__image,
.kn-range:focus-within .kn-range__image {
	transform: scale(1.05);
}

html.kn-no-motion .kn-range__image {
	transition: none;
}

@media (max-width: 991px) {
	.kn-offer {
		grid-template-columns: 1fr;
	}

	.kn-offer__heading {
		font-size: 26px;
	}

	.kn-ranges__grid {
		grid-template-columns: 1fr;
	}

	.kn-range {
		aspect-ratio: 16 / 10;
	}
}

@media (max-width: 576px) {
	.kn-range {
		aspect-ratio: 4 / 5;
	}

	.kn-range__body {
		padding: 26px 22px;
	}

	.kn-range__title {
		font-size: 26px;
	}

	.kn-offer__button {
		width: 100%;
		justify-content: center;
	}
}

/* =====================================================================
   Garden room build animation ([kons_build_story])
   ===================================================================== */
.kn-build-section {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 660px;
	overflow: hidden;
	background: #e7ece8; /* The animation's own backdrop, so the frame has no visible edge. */
}

.kn-build__animation {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

/* The layout wrappers span the whole band; only the copy may catch clicks, so the animation's pause button stays usable. */
.kn-build-section > .block {
	position: relative;
	z-index: 1;
	width: 100%;
	pointer-events: none;
}

.kn-build {
	max-width: calc(440px + 2 * var(--kn-section-x));
	padding: var(--kn-section-y) var(--kn-section-x);
	pointer-events: auto;
}

.kn-build__heading {
	margin: 0 0 18px;
	color: var(--kn-ink);
	font-weight: 700;
	font-size: var(--kn-h2);
	line-height: 1.12;
	letter-spacing: -0.5px;
}

.kn-build__text {
	margin: 0 0 28px;
	color: #44514a;
	font-size: 16px;
	line-height: 1.65;
}

.kn-build__text:last-child {
	margin-bottom: 0;
}

/* Mirrored band: model on the left, copy on the right. A hairline separates it from a band of the same tone above. */
.kn-build-section--flip .kn-build {
	margin-left: auto;
}

.kn-build-section + .kn-build-section {
	border-top: 1px solid #cfd8d2;
}

@media (max-width: 991px) {
	.kn-build-section {
		flex-direction: column;
		align-items: stretch;
		min-height: 0;
	}

	.kn-build__animation {
		position: relative;
		order: 2;
		height: 420px;
	}

	.kn-build {
		max-width: none;
		padding-bottom: 0;
	}
}

@media (max-width: 576px) {
	.kn-build__animation {
		height: 320px;
	}
}

/* When the animation band sits above the services, the bands shift by one so neighbours never share a tone:
   animation (green-grey) → services (white) → how we work (grey, white steps). */
.kn-build-section:not(.kn-build-section--story):not(.kn-build-section--model) ~ .kn-services-section:has(.kn-services--grid) {
	background: transparent;
}

.kn-build-section:not(.kn-build-section--story):not(.kn-build-section--model) ~ .kn-services-section:has(.kn-services--grid) .kn-service {
	box-shadow: none;
	border-color: #d9dee3;
}

.kn-build-section:not(.kn-build-section--story):not(.kn-build-section--model) ~ .kn-services-section:has(.kn-services--steps) {
	background: var(--kn-band);
}

.kn-build-section:not(.kn-build-section--story):not(.kn-build-section--model) ~ .kn-services-section:has(.kn-services--steps) .kn-service {
	background: #fff;
}

/* Full story version: the page inside fills the frame (story at the frame height minus its 56px footer). */
.kn-build-section--story {
	display: block;
	min-height: 0;
}

.kn-build-section--story .kn-build__animation {
	position: relative;
	height: 800px;
}

@media (max-width: 700px) {
	/* Below 700px the story stacks its text above the model and needs about 950px. */
	.kn-build-section--story .kn-build__animation {
		height: 950px;
	}
}

/* 3D model only: a band of the model's backdrop, rotate with the mouse or a sideways swipe. */
.kn-build-section--model {
	display: block;
	min-height: 0;
}

.kn-build-section--model .kn-build__animation {
	position: relative;
	height: 560px;
}

@media (max-width: 576px) {
	/* The control bar wraps to two rows on phones, so the frame grows to keep the model its room. */
	.kn-build-section--model .kn-build__animation {
		height: 440px;
	}
}

/* =====================================================================
   Contrast pass: lines you can see, secondary text you can read, and no
   yellow text on light backgrounds. Yellow stays for fills, markers and
   dark sections; on white the accent becomes black text with a yellow mark.
   ===================================================================== */
:root {
	--kn-line: #aeb5bd;        /* cards, dividers, header rule (was #e3e5e8) */
	--kn-field-line: #7d848c;  /* form field outlines, 3:1 on white */
	--kn-text-soft: #5f656c;   /* captions, placeholders, meta, 5.9:1 on white */
	--kn-dark-line: rgba(255, 255, 255, 0.24);
}

/* Lines: cards and dividers */
.kn-service,
.kn-idea,
.kn-services--ideas .kn-idea,
.kn-build-section:not(.kn-build-section--story):not(.kn-build-section--model) ~ .kn-services-section:has(.kn-services--grid) .kn-service,
.kn-service__arrow,
.kn-why__quote,
.kn-why__item,
.kn-next,
.kn-faq__item,
.kn-scope th,
.kn-scope td,
.kn-picker__search {
	border-color: var(--kn-line);
}

.kn-mmenu__top,
.responsive-mobile-menu.kn-mmenu > ul > li {
	border-bottom-color: rgba(0, 0, 0, 0.22);
}

.kn-service__number {
	-webkit-text-stroke-color: #9aa1a9;
}

/* Lines: form fields */
.kn-structure-content form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.kn-structure-content form select,
.kn-structure-content form textarea,
.kn-london-map__select,
.kn-picker__trigger,
.kn-picker__panel,
.kn-field__box,
.kn-field--service select:not([hidden]),
.kn-field--area select:not([hidden]) {
	border-color: var(--kn-field-line);
}

.kn-field__box:focus-within,
.kn-picker__trigger:focus-visible,
.kn-picker.is-open .kn-picker__trigger {
	border-color: var(--kn-ink);
}

/* Highlight: hovered cards get a firm black edge under the yellow bar (mouse only; taps would leave it stuck) */
.kn-service:focus-within,
.kn-idea:focus-within {
	border-color: var(--kn-ink);
}

@media (hover: hover) {
	.kn-service:hover,
	.kn-idea:hover,
	.kn-build-section:not(.kn-build-section--story):not(.kn-build-section--model) ~ .kn-services-section:has(.kn-services--grid) .kn-service:hover {
		border-color: var(--kn-ink);
	}

	.kn-service:hover .kn-service__arrow,
	.kn-idea:hover .kn-service__arrow {
		border-color: var(--kn-ink);
	}
}

/* Secondary text */
.kn-field__caption,
.kn-picker__caption,
.kn-picker__value,
.kn-form-privacy,
.kn-form-privacy a,
.kn-next__item span:not(.kn-next__number),
.pager-details ul li span {
	color: var(--kn-text-soft);
}

/* Placeholders: readable, but a step lighter than typed text so an empty field still looks empty */
.kn-form .kn-field__box input::placeholder,
.kn-form .kn-field__box textarea::placeholder,
.kn-form .kn-picker__value {
	color: #6b7178;
}

.kn-picker.has-value .kn-picker__value,
.kn-form .kn-picker.has-value .kn-picker__value {
	color: var(--kn-ink);
}

/* Accent on light backgrounds: black text, yellow mark */
.kn-next__number {
	color: var(--kn-ink);
	text-decoration: underline;
	text-decoration-color: var(--kn-accent);
	text-decoration-thickness: 3px;
	text-underline-offset: 5px;
}

.kn-idea__meta {
	color: var(--kn-text-soft);
}

.single-post-data a:not(.kn-btn),
.kn-structure-content p a:not(.kn-btn),
.kn-form-privacy a {
	color: var(--kn-ink);
	text-decoration: underline;
	text-decoration-color: var(--kn-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.single-post-data a:not(.kn-btn):hover,
.kn-structure-content p a:not(.kn-btn):hover,
.kn-form-privacy a:hover,
.kn-form-privacy a:focus {
	color: var(--kn-ink);
	text-decoration: underline;
	text-decoration-color: var(--kn-ink);
}

.options ul li a.selected {
	color: var(--kn-ink);
	text-decoration: underline;
	text-decoration-color: var(--kn-accent);
	text-decoration-thickness: 3px;
	text-underline-offset: 6px;
}

/* Bullets and FAQ toggles are small marks: a deeper orange reads on white */
.kn-structure-content .kn-fitout li::before,
.kn-faq__question::after {
	color: #c46a00;
}

/* Outline numbers on service cards: a heavier, deeper-orange outline instead of a hairline of yellow */
.kn-services--grid .kn-service__number,
.kn-services--steps .kn-service__number {
	-webkit-text-stroke-width: 1.5px;
	-webkit-text-stroke-color: #f28c00;
}

/* Form field icons: deep orange on the pale yellow tile */
.kn-field__icon::before {
	background: #b86200;
}

.kn-field__box:focus-within .kn-field__icon::before {
	background: #000;
}

/* The area map keeps its original look; the contrast pass above does not apply to it */
.kn-london-map .kn-picker__trigger,
.kn-london-map .kn-picker__panel {
	border-color: #e3e5e8;
}

.kn-london-map .kn-london-map__select {
	border-color: #cecfd0;
}

.kn-london-map .kn-picker__search {
	border-bottom-color: #eef0f2;
}

.kn-london-map .kn-picker__caption,
.kn-london-map .kn-picker__value {
	color: #8a8f96;
}

.kn-london-map .kn-picker.has-value .kn-picker__value {
	color: #000;
}

/* =====================================================================
   Rich pass: real-world imagery and a light → photo → dark → yellow rhythm.
   Photos are CC0 placeholders in images/stock (see its README).
   ===================================================================== */

/* Display type: tighter tracking as headings grow, body text left alone */
.kons-construct h1,
.kn-services__heading,
.kn-offer__heading,
.kn-ranges__heading,
.kn-site-footer .footer-text h2 {
	letter-spacing: -0.02em;
}

/* Header: frosted glass over the page instead of a flat white bar */
header.stick {
	background-color: rgba(255, 255, 255, 0.72);
	-webkit-backdrop-filter: blur(16px) saturate(180%);
	backdrop-filter: blur(16px) saturate(180%);
}

@media (prefers-reduced-transparency: reduce) {
	header.stick {
		background-color: #fff;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
}

/* Press feedback on pointer-down for everything you can tap */
.kn-btn,
.kn-service,
.kn-idea,
.kn-range {
	transition-property: transform, box-shadow, border-color, background-color, color;
}

.kn-btn:active,
.kn-range:active {
	transform: scale(0.98);
	transition-duration: 0.1s;
}

/* ---------- Service cards with a photo on top ---------- */
.kn-services--grid .kn-service.has-image {
	padding-top: 0;
	overflow: hidden;
}

.kn-services--grid .kn-service.has-image .kn-service__media {
	margin: 0 -32px 26px;
	aspect-ratio: 16 / 10;
}

.kn-service__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (hover: hover) {
	.kn-service.has-image:hover .kn-service__image {
		transform: scale(1.04);
	}
}

/* ---------- Steps: bigger numbers, a heavier process line ---------- */
.kn-services--steps .kn-service__number {
	font-size: 64px;
	-webkit-text-stroke-width: 2px;
}

.kn-services--steps .kn-services__grid::before,
.kn-services--steps .kn-services__grid::after {
	top: 5px;
	height: 4px;
}

.kn-services--steps .kn-services__grid::before {
	background: #d3d8de;
}

.kn-services--steps .kn-service::after {
	width: 16px;
	height: 16px;
	border-width: 3px;
}

/* ---------- Why Gords: a photo under the intro on the dark panel ---------- */
.kn-why__figure {
	position: relative;
	display: flow-root;
	max-width: 420px;
	margin: 36px 0 0;
}

.kn-why__photo {
	display: block;
	float: none;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

/* Yellow corner tick: ties the photo to the brand without a frame */
.kn-why__figure::after {
	content: "";
	position: absolute;
	left: -12px;
	bottom: -12px;
	width: 72px;
	height: 72px;
	border-left: 4px solid var(--kn-accent);
	border-bottom: 4px solid var(--kn-accent);
	pointer-events: none;
}

@media (max-width: 991px) {
	.kn-why__figure {
		max-width: none;
		margin: 28px 12px 12px;
	}

	.kn-why__photo {
		aspect-ratio: 16 / 10;
	}
}

/* ---------- Offer: a yellow band with the price as the headline ---------- */
.kn-offer {
	padding: 48px 56px;
	border-bottom: 0;
	background: var(--kn-accent);
}

.kn-offer__heading {
	color: #000;
	font-size: 38px;
	font-weight: 700;
	line-height: 1.15;
}

.kn-offer__text {
	color: #1a1a1a;
}

.kn-offer .kn-offer__button {
	border-color: #000;
	background: #000;
	color: #fff;
}

.kn-offer .kn-offer__button:hover,
.kn-offer .kn-offer__button:focus-visible {
	border-color: #fff;
	background: #fff;
	color: #000;
}

.kn-offer .kn-offer__button:focus-visible {
	outline: 3px solid #000;
	outline-offset: 3px;
}

.kn-ranges__heading {
	margin-top: 64px;
}

@media (max-width: 767px) {
	.kn-offer {
		padding: 32px 24px;
	}

	.kn-offer__heading {
		font-size: 28px;
	}
}

/* ---------- Footer call to action: a dusk photo under a dark shade ---------- */
.kn-site-footer .footer-style2 {
	padding: 96px 0 92px;
	background:
		linear-gradient(rgba(14, 16, 20, 0.74), rgba(14, 16, 20, 0.84)),
		url(images/stock/house-dusk.webp) center 60% / cover no-repeat,
		#14171c;
}

.kn-site-footer .footer-style2 .footer-text h2,
.kn-site-footer .footer-style2 .footer-text h5 {
	color: #fff;
}

.kn-site-footer .footer-style2 .footer-text h2 {
	font-size: 40px;
}

.kn-site-footer .footer-style2 .footer-text > span {
	color: #d9dde2;
}

.kn-site-footer .footer-style2 .kn-btn:not(.kn-btn--ghost) {
	border-color: var(--kn-accent);
	background: var(--kn-accent);
	color: #000;
}

.kn-site-footer .footer-style2 .kn-btn:not(.kn-btn--ghost):hover,
.kn-site-footer .footer-style2 .kn-btn:not(.kn-btn--ghost):focus-visible {
	border-color: #fff;
	background: #fff;
	color: #000;
}

.kn-site-footer .footer-style2 .kn-btn:focus-visible {
	outline-color: var(--kn-accent);
}

.kn-site-footer .footer-style2 .kn-cta-phones,
.kn-site-footer .footer-style2 .kn-cta-phones a {
	color: #fff;
}

.kn-site-footer .footer-style2 .kn-cta-phones a:hover,
.kn-site-footer .footer-style2 .kn-cta-phones a:focus-visible {
	color: var(--kn-accent);
}

@media (max-width: 767px) {
	.kn-site-footer .footer-style2 {
		padding: 64px 0 60px;
	}

	.kn-site-footer .footer-style2 .footer-text h2 {
		font-size: 28px;
	}
}

/* Reduced motion: no zooms or slides, colour changes only */
@media (prefers-reduced-motion: reduce) {
	.kn-service__image {
		transition: none;
	}

	.kn-service.has-image:hover .kn-service__image,
	.kn-btn:active,
	.kn-range:active {
		transform: none;
	}
}

/* =====================================================================
   Dark header: graphite with faint blueprint lines (images/header-blueprint.webp),
   white logo and menu, desk phones and the one yellow call to action, a yellow rule underneath.
   ===================================================================== */
header.stick {
	background: #15181d url(images/header-blueprint.webp) center / cover no-repeat;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	border-bottom: 3px solid var(--kn-accent);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

header.stick .hd_bar,
header.stick .header-bar {
	background: transparent;
}

/* White logo artwork (the crown keeps its own animation, so swap images rather than filter) */
header .logo a:has(img.logoheader[src*="gords-logo-dark"])::before {
	background-image: url(images/logo-v2-crown.png);
}

header .logo a:has(img.logoheader[src*="gords-logo-dark"])::after {
	background-image: url(images/logo-v2-text.png);
}

header.stick nav > ul > li > a,
header.stick .mobile-menu-btn a {
	color: #fff;
}

header.stick nav > ul > li > a:hover,
header.stick nav > ul > .active > a {
	color: #fff;
	text-decoration-color: var(--kn-accent);
}

/* Dropdowns stay white panels with dark text */
header.stick nav ul ul li a,
header.stick nav ul ul li a:hover {
	color: var(--kn-ink);
}

header.stick nav > ul > li > a:focus-visible,
header.stick .mobile-menu-btn a:focus-visible {
	outline: 2px solid var(--kn-accent);
	outline-offset: 4px;
}

/* Phones + button side by side */
header .get-quote {
	display: flex;
	align-items: center;
	gap: 24px;
}

header .get-quote .kn-header-phones .kn-header-phones__item,
header .get-quote .kn-header-phones a.kn-header-phones__item:hover,
header .get-quote .kn-header-phones a.kn-header-phones__item:focus-visible {
	color: #fff;
}

header .get-quote .kn-header-phones__label {
	color: #a3acb6;
}

header.stick .get-quote a.kn-header-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 13px 20px;
	background: var(--kn-accent);
	color: #000;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0;
	text-decoration: none;
	text-transform: none;
	white-space: nowrap;
	transition: background-color 0.2s, color 0.2s, transform 0.1s;
}

header.stick .get-quote a.kn-header-cta::before,
header.stick .get-quote a.kn-header-cta::after {
	display: none;
}

header.stick .get-quote a.kn-header-cta:hover,
header.stick .get-quote a.kn-header-cta:focus-visible {
	background: #fff;
	color: #000;
}

header.stick .get-quote a.kn-header-cta:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

header.stick .get-quote a.kn-header-cta:active {
	transform: scale(0.97);
}

.kn-header-cta__short {
	display: none;
}

/* Small laptops: numbers without their desk labels, so the menu keeps one line */
@media (min-width: 992px) and (max-width: 1199px) {
	header .get-quote {
		gap: 16px;
	}

	header .get-quote .kn-header-phones__label {
		display: none;
	}
}

/* Phones and tablets: numbers and button in one row beside the menu button */
@media (max-width: 991px) {
	header .get-quote {
		display: flex !important;
		gap: 14px;
	}
}

@media (max-width: 767px) {
	header .get-quote {
		gap: 10px;
	}

	header.stick .get-quote a.kn-header-cta {
		padding: 10px 12px;
		font-size: 13px;
	}

	.kn-header-cta__long,
	.kn-header-cta__arrow {
		display: none;
	}

	.kn-header-cta__short {
		display: inline;
	}
}

/* Narrow phones: a little air between the logo and the numbers */
@media (max-width: 389px) {
	header .header-bar:has(img.logoheader[src*="gords-logo-dark"]) .logo {
		margin-right: 10px;
	}

	header .get-quote {
		gap: 8px;
	}

	header .get-quote .kn-header-phones .kn-header-phones__item {
		font-size: 12px;
	}

	header.stick .get-quote a.kn-header-cta {
		padding: 9px 10px;
	}
}

@media (max-width: 339px) {
	header.stick .get-quote a.kn-header-cta {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	header.stick .get-quote a.kn-header-cta:active {
		transform: none;
	}
}

/* Map outline: a darker grey outer edge so the map stands off the page (london-map.js draws it under the areas) */
.kn-london-map__svg .kn-london-map__outline path {
	fill: none;
	stroke: #7d848c;
	stroke-width: 5;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
	pointer-events: none;
	cursor: default;
}

/* Contact line under the enquiry heading: dark underlined links (no yellow text on light backgrounds). */
.kn-contact-line a {
	color: var(--kn-ink, #111);
	text-decoration: underline;
	text-decoration-color: var(--kn-accent, #ffa800);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
	white-space: nowrap;
}