/* ==========================================================================
   Kini Consulting. Brick red, charcoal and white, set in Montserrat as in the company profile.
   The site reads like a well-kept bill of quantities: ruled rows, aligned figures, nothing rounded.
   The one flourish is the angled cut of the K in the logo, used on photographs and bands.
   ========================================================================== */

:root {
	--ink: var(--wp--preset--color--ink, #28282a);
	--charcoal: var(--wp--preset--color--charcoal, #3c3c3e);
	--paper: var(--wp--preset--color--paper, #fcfcfd);
	--tint: var(--wp--preset--color--tint, #eeeff2);
	--line: var(--wp--preset--color--line, #d3d5db);
	--line-dark: #58585c;
	--muted: var(--wp--preset--color--muted, #55565c);
	--muted-dark: #c9cad0;
	--red: var(--wp--preset--color--red, #9d1f14);
	--red-deep: var(--wp--preset--color--red-deep, #7a160d);
	--red-soft: var(--wp--preset--color--red-soft, #f6e4e1);
	--on-red: #f8dcd8;
	--error: #9d1f14;

	--body: var(--wp--preset--font-family--body);
	--heading: var(--wp--preset--font-family--heading);

	--gutter: clamp(1.25rem, 5vw, 4.5rem);
	--wide: 96rem; /* content grows with the screen, about 5% margin each side, capped at 1536px */
	--measure: 46rem;
	--section-y: clamp(3rem, 5.5vw, 5rem);
	--header-h: 4.25rem;
	--slant: 5.5rem; /* horizontal run of the angled cut, taken from the K in the logo */

	--ease-out: cubic-bezier(0.23, 1, 0.32, 1);
	--ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
	--t-press: 160ms;
	--t-base: 220ms;

	--focus: var(--ink);
	/* Layers: sticky header 50. Nothing else is stacked. */
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: calc(var(--header-h) + 1rem); -webkit-text-size-adjust: 100%; scrollbar-color: var(--charcoal) var(--tint); }
body { margin: 0; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; caret-color: var(--red); overflow-x: clip; }
::selection { background: var(--red); color: #fff; }
[hidden] { display: none !important; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 { text-wrap: balance; margin: 0; }
p { margin: 0; text-wrap: pretty; }
ul, ol { margin: 0; }
a { text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.kn-footer, .kn-band { --focus: #fff; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.kn-icon { flex: none; width: 1.25em; height: 1.25em; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block: 0; }
:where(.kn-main, .kn-footer, .kn-header) :where(.is-layout-flow) > * { margin-block-start: 0; }
.kn-lead { font-size: var(--wp--preset--font-size--large); line-height: 1.55; letter-spacing: -0.01em; font-weight: 500; }
.kn-measure { max-width: var(--measure); }

/* ==========================================================================
   Buttons
   ========================================================================== */
.kn-btn, .wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.55rem; min-height: 2.875rem; padding: 0.65rem 1.35rem;
	background: var(--red); color: #fff; border: 1.5px solid var(--red); border-radius: 0;
	font: 600 0.9375rem/1.2 var(--body); text-decoration: none; white-space: nowrap; cursor: pointer;
	transition: transform var(--t-press) var(--ease-out), background-color var(--t-press) ease, color var(--t-press) ease, border-color var(--t-press) ease;
}
.kn-btn .kn-icon { transition: transform var(--t-base) var(--ease-out); }
.kn-btn:active, .wp-block-button__link:active { transform: scale(0.97); }
.kn-btn--line, .wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--ink); border-color: var(--ink); }
.kn-btn-light .wp-block-button__link { background: #fff; color: var(--ink); border-color: #fff; }
.kn-btn[disabled] { opacity: 0.6; cursor: progress; }
@media (hover: hover) and (pointer: fine) {
	.kn-btn:hover, .wp-block-button__link:hover { background: var(--red-deep); border-color: var(--red-deep); color: #fff; }
	.kn-btn:hover .kn-icon { transform: translateX(3px); }
	.kn-btn--line:hover, .wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
	.kn-btn-light .wp-block-button__link:hover { background: var(--red); border-color: var(--red); color: #fff; }
}

/* ==========================================================================
   Header
   ========================================================================== */
/* The header's template-part wrapper is what must stick: the header itself is as tall as its parent. */
.wp-site-blocks > .wp-block-template-part:first-child { position: sticky; top: 0; z-index: 50; }
.kn-header { background: var(--paper); color: var(--ink); padding-inline: var(--gutter); border-bottom: 1px solid var(--line); }
.kn-header__bar { max-width: var(--wide); margin-inline: auto; min-height: var(--header-h); gap: 1.5rem; }
.kn-logo-link { flex: none; margin: 0; }
.kn-logo-link img { width: auto; height: 3.25rem; max-width: none; }
.kn-nav { margin-inline-start: auto; }
.kn-nav .wp-block-navigation__container { gap: clamp(1.1rem, 2.2vw, 2.25rem); }
.kn-nav .wp-block-navigation-item__content {
	padding: 0.45rem 0; color: var(--ink); font-weight: 500; font-size: 0.9375rem; text-decoration: none; white-space: nowrap;
	background: linear-gradient(var(--red), var(--red)) 0 100% / 0 2px no-repeat; transition: background-size var(--t-base) var(--ease-out), color var(--t-press) ease;
}
.kn-nav .wp-block-navigation-item__content[aria-current="page"] { background-size: 100% 2px; color: var(--red); font-weight: 600; }
.kn-header .wp-block-buttons { flex: none; margin: 0; }
.kn-header .wp-block-button__link { min-height: 2.5rem; padding: 0.5rem 1.1rem; }
@media (pointer: coarse), (max-width: 959px) { .kn-header .wp-block-button__link { min-height: 2.75rem; } }
@media (hover: hover) and (pointer: fine) { .kn-nav .wp-block-navigation-item__content:hover { background-size: 100% 2px; } }

.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close { color: var(--ink); min-width: 2.75rem; min-height: 2.75rem; align-items: center; justify-content: center; }
@media (max-width: 959px) {
	.kn-header__bar { gap: 0.75rem; }
	.kn-nav { order: 3; margin-inline-start: 0; }
	.kn-header .wp-block-buttons { margin-inline-start: auto; }
	.kn-nav .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
	.kn-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
}
.kn-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--paper); color: var(--ink); padding: 1rem var(--gutter) 2rem; }
.kn-nav .is-menu-open .wp-block-navigation__container { gap: 0; align-items: flex-start; }
.kn-nav .is-menu-open .wp-block-navigation-item__content { font: 700 1.625rem/1.15 var(--heading); letter-spacing: -0.02em; padding: 0.6rem 0; background-image: none; }
@media (max-width: 420px) { .kn-logo-link img { height: 2.75rem; } .kn-header .wp-block-button__link { padding-inline: 0.9rem; } }

/* ==========================================================================
   Home hero: copy on the left, the photograph cut at the angle of the K on the right
   ========================================================================== */
.kn-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); align-items: stretch; min-height: clamp(27rem, 74vh, 41rem); background: var(--paper); overflow: hidden; }
.kn-hero__copy { align-self: center; padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 3vw, 3rem) clamp(2.5rem, 5vw, 4.5rem) max(var(--gutter), calc((100vw - var(--wide)) / 2)); }
.kn-hero__title { max-width: 15em; }
.kn-hero__text { margin-top: 1.25rem; max-width: 34rem; font-size: var(--wp--preset--font-size--large); line-height: 1.55; color: var(--muted); }
.kn-hero__actions { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 0.75rem; }
.kn-hero__media { position: relative; min-height: 18rem; }
.kn-hero__frame, .kn-hero__blade { position: absolute; inset: 0; clip-path: polygon(var(--slant) 0, 100% 0, 100% 100%, 0 100%); }
.kn-hero__frame { left: 1.75rem; background: var(--charcoal); }
.kn-hero__blade { background: var(--red); right: auto; width: calc(var(--slant) + 6rem); clip-path: polygon(var(--slant) 0, 100% 0, calc(100% - var(--slant)) 100%, 0 100%); }
.kn-hero__img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
@media (max-width: 899px) {
	.kn-hero { grid-template-columns: 1fr; min-height: 0; }
	.kn-hero__copy { padding: 2.5rem var(--gutter) 2.25rem; }
	.kn-hero__media { aspect-ratio: 16 / 10; min-height: 0; --slant: 2.75rem; }
	.kn-hero__frame { left: 0; top: 0.6rem; clip-path: polygon(0 var(--slant), 100% 0, 100% 100%, 0 100%); }
	.kn-hero__blade { width: 100%; height: 5rem; clip-path: polygon(0 var(--slant), 100% 0, 100% 1rem, 0 calc(var(--slant) + 1rem)); }
}

/* The register in four figures: one ruled row, the way a bill carries its totals. */
.kn-figures { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 auto; padding: 0 var(--gutter); max-width: calc(var(--wide) + 2 * var(--gutter)); }
.kn-figures__cell { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 0.35rem; padding: 1.5rem 1.5rem 1.6rem 0; border-top: 2px solid var(--ink); }
.kn-figures__cell + .kn-figures__cell { padding-left: 1.5rem; border-left: 1px solid var(--line); }
.kn-figures dd { margin: 0; font: 700 clamp(2rem, 1.5rem + 2vw, 2.875rem) / 1 var(--heading); letter-spacing: -0.03em; font-variant-numeric: tabular-nums lining-nums; color: var(--red); }
.kn-figures dt { color: var(--muted); font-size: 0.9375rem; line-height: 1.4; max-width: 17rem; }
@media (max-width: 899px) {
	.kn-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kn-figures__cell:nth-child(odd) { padding-left: 0; border-left: 0; }
	.kn-figures__cell { padding-block: 1.1rem 1.2rem; }
}

/* ==========================================================================
   Sections and shared pieces
   ========================================================================== */
.kn-section { padding: var(--section-y) var(--gutter); }
.kn-section > * { max-width: var(--wide); margin-inline: auto; }
.kn-section--tint { background: var(--tint); }
.kn-section--flush { padding-top: 0; }
.kn-section > h2 + *, .kn-section__lead + * { margin-top: 1.75rem; }
.kn-section > .kn-section__lead { margin-top: 0.85rem; color: var(--muted); font-size: var(--wp--preset--font-size--large); line-height: 1.55; }
.kn-section > .kn-section__lead, .kn-section > h2 { padding-right: max(0px, calc(100% - 52rem)); }
.kn-section > .wp-block-buttons { margin-top: 2rem; }

.kn-split { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 2.5rem clamp(2rem, 6vw, 6rem); align-items: center; }
.kn-split__text > * + * { margin-top: 1.1rem; }
.kn-split__text > .wp-block-buttons { margin-top: 1.75rem; }
.kn-split__text { max-width: 44rem; }
.kn-art { margin: 0; }
.kn-art img { width: 100%; max-width: 34rem; margin-inline: auto; mix-blend-mode: multiply; }
@media (max-width: 899px) { .kn-split { grid-template-columns: 1fr; } .kn-art img { max-width: 22rem; } }

/* Ruled lists: item on the left, description on the right, as in a bill of quantities. */
.kn-ledger { list-style: none; padding: 0; }
.kn-ledger li { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 0.25rem 2rem; padding: 0.95rem 0; border-top: 1px solid var(--line); color: var(--muted); }
.kn-ledger li strong { color: var(--ink); font-weight: 600; }
.kn-ledger--stack li { grid-template-columns: 1fr; }
@media (max-width: 699px) { .kn-ledger li { grid-template-columns: 1fr; } }
.kn-plain { list-style: none; padding: 0; display: grid; gap: 0.6rem; }

/* Home services: stacked groups without JavaScript, tabs with it. */
.kn-tabs { display: grid; gap: 2.5rem; }
.kn-svc > h3 { font-size: 1.375rem; }
.kn-svc__summary { margin-top: 0.4rem; color: var(--muted); }
.kn-svc .kn-ledger { margin-top: 1rem; }
.kn-tabs.is-tabs { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 2rem clamp(2rem, 5vw, 5rem); align-items: start; }
.kn-tablist { display: grid; border-bottom: 1px solid var(--line); }
.kn-tab {
	position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; min-height: 3.75rem; padding: 0.9rem 1rem 0.9rem 0;
	background: none; border: 0; border-top: 1px solid var(--line); color: var(--muted); font: 600 1.125rem/1.25 var(--heading); letter-spacing: -0.01em; text-align: left; cursor: pointer;
	transition: color var(--t-press) ease, padding-left var(--t-base) var(--ease-out);
}
.kn-tab::before { content: ""; position: absolute; inset: -1px 0; background: var(--ink); z-index: -1; clip-path: inset(0 100% 0 0); transition: clip-path 320ms var(--ease-out); }
.kn-tablist { position: relative; z-index: 0; }
.kn-tab .kn-icon { opacity: 0; transform: translateX(-6px); transition: opacity var(--t-base) ease, transform var(--t-base) var(--ease-out); }
.kn-tab[aria-selected="true"] { color: #fff; padding-left: 1rem; }
.kn-tab[aria-selected="true"]::before { clip-path: inset(0); }
.kn-tab[aria-selected="true"] .kn-icon { opacity: 1; transform: none; }
.kn-tab:focus-visible { outline-offset: -3px; }
.kn-tab[aria-selected="true"]:focus-visible { outline-color: #fff; }
@media (hover: hover) and (pointer: fine) { .kn-tab:not([aria-selected="true"]):hover { color: var(--ink); } }
.is-tabs .kn-svc > h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.is-tabs .kn-svc__summary { margin-top: 0; font-size: var(--wp--preset--font-size--large); color: var(--ink); font-weight: 500; }
.is-tabs .kn-svc .kn-ledger { margin-top: 1.25rem; }
.is-tabs .kn-svc:focus-visible { outline-offset: 6px; }
@media (max-width: 899px) {
	.kn-tabs.is-tabs { grid-template-columns: 1fr; }
	.kn-tablist { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; border-bottom: 1px solid var(--line); scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
	.kn-tab { border-top: 0; padding: 0.75rem 1rem; min-height: 3rem; font-size: 1rem; white-space: nowrap; }
	.kn-tab .kn-icon { display: none; }
}

/* Home sectors: each row fills with red from the left under the pointer. */
.kn-sectors { list-style: none; padding: 0; border-bottom: 1px solid var(--line); }
.kn-sectors__link {
	position: relative; z-index: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 1rem 2rem; padding: 1.15rem 1rem 1.15rem 0;
	border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; transition: color var(--t-base) ease, padding-left var(--t-base) var(--ease-out);
}
.kn-sectors__link::before { content: ""; position: absolute; inset: -1px 0; z-index: -1; background: var(--red); clip-path: inset(0 100% 0 0); transition: clip-path 380ms var(--ease-out); }
.kn-sectors__name { font: 700 clamp(1.25rem, 1rem + 1.1vw, 1.75rem) / 1.15 var(--heading); letter-spacing: -0.02em; }
.kn-sectors__count { color: var(--muted); font-variant-numeric: tabular-nums; transition: color var(--t-base) ease; }
.kn-sectors__link .kn-icon { transition: transform var(--t-base) var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
	.kn-sectors__link:hover { color: #fff; padding-left: 1rem; }
	.kn-sectors__link:hover::before { clip-path: inset(0); }
	.kn-sectors__link:hover .kn-sectors__count { color: var(--on-red); }
	.kn-sectors__link:hover .kn-icon { transform: translateX(4px); }
}
@media (max-width: 519px) { .kn-sectors__link { grid-template-columns: minmax(0, 1fr) auto; } .kn-sectors__count { grid-column: 1; grid-row: 2; margin-top: -0.75rem; } .kn-sectors__link .kn-icon { grid-row: 1 / span 2; grid-column: 2; } }

/* Red band: the statement, vision and mission. An angled blade closes its right edge. */
.kn-band { position: relative; background: var(--red); color: #fff; padding: var(--section-y) var(--gutter); overflow: hidden; }
.kn-band::after { content: ""; position: absolute; inset: 0 0 0 auto; width: clamp(5rem, 16vw, 15rem); background: var(--red-deep); clip-path: polygon(var(--slant) 0, 100% 0, 100% 100%, 0 100%); }
.kn-band__inner { position: relative; z-index: 1; max-width: var(--wide); margin-inline: auto; padding-right: clamp(0rem, 14vw, 13rem); }
.kn-band__statement { max-width: 22em; font: 600 clamp(1.375rem, 1rem + 1.6vw, 2.125rem) / 1.25 var(--heading); letter-spacing: -0.02em; }
.kn-band__cols { margin-top: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem clamp(2rem, 5vw, 5rem); padding-top: 1.75rem; border-top: 1px solid rgb(255 255 255 / 0.35); }
.kn-band__col h2 { font-size: 1.1875rem; letter-spacing: -0.01em; }
.kn-band__col p { margin-top: 0.6rem; color: var(--on-red); max-width: 34rem; }
@media (max-width: 699px) { .kn-band__cols { grid-template-columns: 1fr; } .kn-band::after { opacity: 0.6; } }

/* ==========================================================================
   Page head and inner pages
   ========================================================================== */
.kn-pagehead { position: relative; background: var(--tint); padding: clamp(2.25rem, 5vw, 4rem) var(--gutter); overflow: hidden; }
.kn-pagehead::before, .kn-pagehead::after { content: ""; position: absolute; top: 0; bottom: 0; clip-path: polygon(var(--slant) 0, 100% 0, calc(100% - var(--slant)) 100%, 0 100%); }
.kn-pagehead::before { right: clamp(-2rem, 6vw, 7rem); width: calc(var(--slant) + clamp(1.5rem, 5vw, 5rem)); background: var(--red); }
.kn-pagehead::after { right: calc(clamp(-2rem, 6vw, 7rem) - var(--slant) - clamp(1.5rem, 5vw, 5rem) + 1.25rem); width: calc(var(--slant) + clamp(1.5rem, 5vw, 5rem)); background: var(--charcoal); }
.kn-pagehead__inner { position: relative; z-index: 1; max-width: var(--wide); margin-inline: auto; padding-right: clamp(4rem, 26vw, 24rem); }
.kn-pagehead__lead { margin-top: 0.9rem; max-width: 38rem; font-size: var(--wp--preset--font-size--large); line-height: 1.5; color: var(--muted); }
@media (max-width: 599px) { .kn-pagehead::before, .kn-pagehead::after { opacity: 0.9; --slant: 2rem; } .kn-pagehead__inner { padding-right: 3.5rem; } }

.kn-content { padding: var(--section-y) var(--gutter); }
.kn-content > .wp-block-post-content > *, .kn-content--plain > * { max-width: var(--wide); margin-inline: auto; }
.kn-content > .wp-block-post-content > * + * { margin-top: var(--section-y); }
.kn-content--plain > * + * { margin-top: 1.5rem; }
.kn-content > .wp-block-post-content > .kn-band { max-width: none; margin-inline: calc(var(--gutter) * -1); }
.kn-content a:not(.wp-block-button__link):not(.kn-btn) { color: var(--red); font-weight: 500; }
.kn-prose { max-width: var(--measure); margin-inline: auto 0; }
.kn-content > .wp-block-post-content > .kn-prose { margin-inline: auto; max-width: var(--wide); }
.kn-prose > * { max-width: var(--measure); }
.kn-prose > * + * { margin-top: 1rem; }
.kn-prose > h2 { margin-top: 2.25rem; font-size: 1.375rem; }
.kn-note { padding-top: 1.5rem; border-top: 1px solid var(--line); color: var(--muted); }
.kn-empty { padding: 1.5rem; background: var(--tint); }

/* About */
.kn-cols { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 2rem clamp(2rem, 6vw, 6rem); }
.kn-cols__lead .kn-lead { font-size: clamp(1.25rem, 1rem + 1.1vw, 1.75rem); line-height: 1.35; font-weight: 600; letter-spacing: -0.02em; }
.kn-cols__body > * + * { margin-top: 1.1rem; }
.kn-welcome { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 1.5rem clamp(2rem, 6vw, 6rem); padding-top: var(--section-y); border-top: 2px solid var(--ink); }
.kn-welcome__body > * + * { margin-top: 1.1rem; }
.kn-sign { padding-top: 1.1rem; border-top: 1px solid var(--line); }
.kn-footprint > h2 + * { margin-top: 1.75rem; }
.kn-split--map { align-items: start; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
.kn-map { margin: 0; }
.kn-map img { width: 100%; max-width: 924px; }
.kn-regions { margin-top: 2rem !important; display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 1.5rem 2rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.kn-regions h3 { font-size: 1rem; color: var(--red); }
.kn-regions ul { margin-top: 0.6rem; padding: 0; list-style: none; display: grid; gap: 0.3rem; color: var(--muted); }
@media (max-width: 899px) { .kn-cols, .kn-welcome, .kn-split--map { grid-template-columns: 1fr; } }
@media (max-width: 519px) { .kn-regions { grid-template-columns: 1fr 1fr; } }

/* Services */
.kn-services-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; align-items: center; }
.kn-jump { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.kn-jump a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0.5rem 1rem; border: 1px solid var(--line); color: var(--ink) !important; text-decoration: none; font-weight: 600 !important; transition: background-color var(--t-press) ease, color var(--t-press) ease, border-color var(--t-press) ease; }
@media (hover: hover) and (pointer: fine) { .kn-jump a:hover { background: var(--ink); border-color: var(--ink); color: #fff !important; } }
.kn-art--model img { width: 13rem; max-width: 100%; }
.kn-svc-block { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 1.5rem clamp(2rem, 5vw, 5rem); padding-top: 2rem; border-top: 2px solid var(--ink); }
.kn-content > .wp-block-post-content > .kn-svc-block + .kn-svc-block { margin-top: clamp(2.5rem, 5vw, 4rem); }
.kn-svc-block__head { position: sticky; top: calc(var(--header-h) + 1.5rem); align-self: start; }
.kn-svc-block__head p { margin-top: 0.75rem; color: var(--muted); }
.kn-svc-block .kn-ledger li:first-child { border-top: 0; padding-top: 0.2rem; }
@media (max-width: 899px) { .kn-svc-block { grid-template-columns: 1fr; } .kn-svc-block__head { position: static; } .kn-services-top { grid-template-columns: 1fr; } .kn-art--model { display: none; } }

/* ==========================================================================
   The project register
   ========================================================================== */
.kn-filter { display: flex; flex-wrap: wrap; align-items: end; gap: 1.25rem 2.5rem; padding: 1.25rem 0; border-block: 1px solid var(--line); }
.kn-filter__group { border: 0; margin: 0; padding: 0; min-width: 0; }
.kn-filter__group legend { padding: 0; margin-bottom: 0.5rem; font-weight: 600; font-size: 0.875rem; color: var(--muted); }
.kn-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.kn-chip { position: relative; cursor: pointer; }
.kn-chip input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.kn-chip span { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0.4rem 0.95rem; border: 1px solid var(--line); background: var(--paper); font-weight: 500; font-size: 0.9375rem; transition: background-color var(--t-press) ease, color var(--t-press) ease, border-color var(--t-press) ease, transform var(--t-press) var(--ease-out); }
.kn-chip input:checked + span { background: var(--ink); border-color: var(--ink); color: #fff; }
.kn-chip input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 3px; }
.kn-chip:active span { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) { .kn-chip input:not(:checked) + span:hover { border-color: var(--ink); } }
.kn-filter__count { margin-left: auto; color: var(--muted); font-variant-numeric: tabular-nums; min-height: 2.75rem; display: flex; align-items: center; }

.kn-sector { padding-top: var(--section-y); scroll-margin-top: var(--header-h); }
.kn-sector + .kn-sector { margin-top: var(--section-y); border-top: 2px solid var(--ink); }
.kn-sector__head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 2rem clamp(2rem, 6vw, 6rem); align-items: center; }
.kn-sector__intro > * + * { margin-top: 1rem; }
.kn-sector__intro p { color: var(--muted); max-width: 44rem; }
.kn-sector__intro p:first-of-type { color: var(--ink); }
.kn-sector__figure { margin: 0; }
.kn-cut { clip-path: polygon(var(--slant) 0, 100% 0, 100% 100%, 0 100%); --slant: 3.5rem; background: var(--tint); }
.kn-cut img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
@media (max-width: 899px) { .kn-sector__head { grid-template-columns: 1fr; } .kn-sector__figure { order: -1; } .kn-cut { --slant: 2.25rem; } .kn-cut img { aspect-ratio: 16 / 9; } }

.kn-phases { margin-top: 2.5rem; }
.kn-phases__title { font-size: 1.1875rem; }
.kn-phases__list { list-style: none; margin-top: 1.25rem; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.kn-phases__item { position: relative; padding: 1.1rem 1.25rem 1.3rem; background: var(--tint); }
.kn-phases__item::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--red); }
.kn-phases__item h4 { font-size: 1rem; }
.kn-phases__item ul { margin-top: 0.7rem; padding-left: 1.1rem; display: grid; gap: 0.35rem; color: var(--muted); font-size: 0.9375rem; }
.kn-phases__item ::marker { color: var(--red); }
@media (max-width: 799px) { .kn-phases__list { grid-template-columns: 1fr; gap: 0.75rem; } }

.kn-table-wrap { margin-top: 2.25rem; }
.kn-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; line-height: 1.45; }
.kn-table__caption { caption-side: top; text-align: left; padding-bottom: 0.75rem; font: 700 1.125rem/1.3 var(--heading); letter-spacing: -0.01em; color: var(--ink); }
.kn-table th, .kn-table td { padding: 0.85rem 1rem 0.85rem 0; text-align: left; vertical-align: top; border-top: 1px solid var(--line); font-weight: 400; }
.kn-table thead th { border-top: 2px solid var(--ink); padding-block: 0.6rem; font-weight: 600; font-size: 0.8125rem; color: var(--muted); white-space: nowrap; }
.kn-table__project { font-weight: 600 !important; color: var(--ink); }
.kn-table__client { width: 24%; color: var(--muted); }
.kn-table .kn-table__num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums lining-nums; font-weight: 600; padding-right: 2rem; }
.kn-table td:last-child, .kn-table th:last-child { padding-right: 0; width: 8.5rem; }
.kn-table abbr { text-decoration: none; font-weight: 500; color: var(--muted); }
.kn-status { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 500; white-space: nowrap; color: var(--muted); }
.kn-status .kn-icon { width: 1.05em; height: 1.05em; }
.kn-status--current { color: var(--red); font-weight: 600; }
.kn-status__live { width: 0.5rem; height: 0.5rem; margin: 0 0.25rem 0 0.2rem; border-radius: 50%; background: currentColor; }
@media (hover: hover) and (pointer: fine) { .kn-table tbody tr { transition: background-color var(--t-press) ease; } .kn-table tbody tr:hover { background: var(--tint); } }
/* On a phone each project becomes its own block: name first, then client, then value and status side by side. */
@media (max-width: 699px) {
	.kn-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
	.kn-table, .kn-table tbody, .kn-table caption { display: block; }
	.kn-table tr { display: grid; grid-template-columns: 1fr auto; gap: 0.2rem 1rem; padding: 0.9rem 0; border-top: 1px solid var(--line); }
	.kn-table th, .kn-table td { display: block; padding: 0; border: 0; width: auto !important; }
	.kn-table__project { grid-column: 1 / -1; grid-row: 1; }
	.kn-table__client { grid-column: 1 / -1; }
	.kn-table td[data-label="Sector"] { grid-column: 1 / -1; color: var(--muted); }
	.kn-table .kn-table__num { text-align: left; padding-right: 0; margin-top: 0.3rem; }
	.kn-table td:last-child { margin-top: 0.3rem; }
	.kn-table tbody tr:first-child { border-top: 2px solid var(--ink); }
}

/* ==========================================================================
   Leadership
   ========================================================================== */
.kn-leader { display: grid; grid-template-columns: minmax(0, 17rem) minmax(0, 1fr); gap: 2rem clamp(2rem, 5vw, 5rem); align-items: start; }
.kn-portrait { margin: 0; background: var(--tint); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 2.5rem), calc(100% - 2.5rem) 100%, 0 100%); }
.kn-portrait img { width: 100%; mix-blend-mode: multiply; }
.kn-leader__body { max-width: 50rem; }
.kn-leader__body > * + * { margin-top: 1.1rem; }
.kn-leader__role { margin-top: 0.4rem !important; color: var(--red); font-weight: 600; }
.kn-cv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem clamp(2rem, 4vw, 4rem); padding-top: 2rem; border-top: 2px solid var(--ink); }
.kn-cv__col > h3 + * { margin-top: 0.9rem; }
.kn-cv__col .kn-ledger li:first-child { border-top: 0; padding-top: 0; }
.kn-plain li { color: var(--muted); }
.kn-career, .kn-cvprojects { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 1.25rem clamp(2rem, 5vw, 5rem); padding-top: 2rem; border-top: 2px solid var(--ink); }
.kn-career .kn-ledger li:first-child { border-top: 0; padding-top: 0.2rem; }
.kn-cvprojects { grid-template-columns: 1fr; }
.kn-cvprojects > p { color: var(--muted); }
.kn-cvtable { margin: 0.75rem 0 0; }
.kn-cvtable table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; line-height: 1.45; }
.kn-cvtable th, .kn-cvtable td { padding: 0.85rem 1.25rem 0.85rem 0; text-align: left; vertical-align: top; border: 0; border-top: 1px solid var(--line); }
.kn-cvtable thead th { border-top: 2px solid var(--ink); border-bottom: 0; font-weight: 600; font-size: 0.8125rem; color: var(--muted); }
.kn-cvtable td:nth-child(1) { font-weight: 600; width: 26%; }
.kn-cvtable td:nth-child(2) { width: 15%; color: var(--muted); }
.kn-cvtable td:nth-child(3) { color: var(--muted); }
.kn-cvtable td:nth-child(4) { white-space: nowrap; font-weight: 600; font-variant-numeric: tabular-nums lining-nums; }
.kn-cvtable td:nth-child(5) { font-variant-numeric: tabular-nums lining-nums; padding-right: 0; }
@media (max-width: 899px) { .kn-cv { grid-template-columns: 1fr; } .kn-career { grid-template-columns: 1fr; } }
@media (max-width: 699px) {
	.kn-leader { grid-template-columns: 1fr; } .kn-portrait { max-width: 13rem; }
	.kn-cvtable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
	.kn-cvtable table, .kn-cvtable tbody { display: block; }
	.kn-cvtable tr { display: grid; grid-template-columns: 1fr auto; gap: 0.2rem 1rem; padding: 0.9rem 0; border-top: 1px solid var(--line); }
	.kn-cvtable td { display: block; padding: 0 !important; border: 0 !important; width: auto !important; }
	.kn-cvtable td:nth-child(1), .kn-cvtable td:nth-child(2), .kn-cvtable td:nth-child(3) { grid-column: 1 / -1; }
	.kn-cvtable td:nth-child(3) { font-size: 0.875rem; }
	.kn-cvtable td:nth-child(4), .kn-cvtable td:nth-child(5) { margin-top: 0.3rem; }
}

/* ==========================================================================
   Contact
   ========================================================================== */
.kn-contact { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 3rem clamp(2rem, 6vw, 6rem); align-items: start; }
.kn-contact__col > h2 + * { margin-top: 1.5rem; }
.kn-details { list-style: none; padding: 0; display: grid; }
.kn-details li { display: flex; gap: 0.9rem; padding: 1.1rem 0; border-top: 1px solid var(--line); }
.kn-details .kn-icon { width: 1.5rem; height: 1.5rem; margin-top: 0.15rem; color: var(--red); }
.kn-details__label { display: block; font-weight: 600; }
.kn-details a { display: inline-block; padding-block: 0.3rem; font-variant-numeric: tabular-nums; }
.kn-form-wrap { padding: clamp(1.25rem, 3vw, 2.25rem); background: var(--tint); }
.kn-form { display: grid; gap: 1.25rem; }
.kn-form__note { color: var(--muted); font-size: 0.9375rem; }
.kn-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.kn-field { display: grid; gap: 0.4rem; }
.kn-field label { font-weight: 600; font-size: 0.9375rem; }
.kn-field input, .kn-field textarea { width: 100%; min-height: 2.875rem; padding: 0.6rem 0.8rem; font: inherit; line-height: 1.4; color: var(--ink); background: #fff; border: 1.5px solid var(--muted); border-radius: 0; transition: border-color var(--t-press) ease; }
.kn-field textarea { resize: vertical; min-height: 8rem; }
.kn-field input:focus-visible, .kn-field textarea:focus-visible { outline-offset: 1px; border-color: var(--ink); }
.kn-field [aria-invalid="true"] { border-color: var(--error); }
.kn-error { color: var(--error); font-weight: 600; font-size: 0.9375rem; }
.kn-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.kn-form__foot { display: flex; align-items: center; gap: 1rem 1.5rem; flex-wrap: wrap; }
.kn-form__privacy { color: var(--muted); font-size: 0.9375rem; max-width: 24rem; }
.kn-form__status:focus { outline: none; }
.kn-form__done { padding: 1.5rem; border: 1.5px solid var(--ink); background: #fff; }
.kn-form__done h3 { margin-bottom: 0.5rem; }
.kn-form__alert { margin-bottom: 1.25rem; padding: 0.9rem 1rem; border: 1.5px solid var(--error); color: var(--error); font-weight: 600; background: #fff; }
@media (max-width: 899px) { .kn-contact { grid-template-columns: 1fr; } }
@media (max-width: 519px) { .kn-field-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   Footer
   ========================================================================== */
.kn-footer { background: var(--ink); color: #fff; padding-inline: var(--gutter); }
.kn-footer > * { max-width: var(--wide); margin-inline: auto; }
.kn-footer__cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem; padding-block: clamp(2.25rem, 4.5vw, 3.5rem); border-bottom: 1px solid var(--line-dark); }
.kn-footer__cta-title { max-width: 22em; font-size: clamp(1.375rem, 1rem + 1.5vw, 2rem); line-height: 1.2; }
.kn-footer__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 3fr) minmax(0, 3fr); gap: 2.5rem clamp(2rem, 5vw, 5rem); padding-block: clamp(2.25rem, 4.5vw, 3.25rem); }
.kn-foot-brand__logo { display: inline-block; }
.kn-foot-brand__logo img { width: 9.375rem; height: auto; }
.kn-footer__title { font: 600 1rem/1.2 var(--heading); letter-spacing: 0; color: #fff; }
.kn-footer__col > * + * { margin-top: 0.9rem; }
.kn-foot-details { margin-top: 1.25rem; display: grid; gap: 0.3rem; justify-items: start; font-style: normal; color: var(--muted-dark); max-width: 27rem; font-size: 0.9375rem; }
.kn-foot-details b { color: #fff; font-weight: 600; }
.kn-foot-details span { padding-block: 0.25rem; }
.kn-foot-details a, .kn-flinks a, .kn-legal a, .kn-credit a { color: var(--muted-dark); text-decoration: none; }
.kn-foot-details a { padding-block: 0.25rem; font-variant-numeric: tabular-nums; }
.kn-flinks { list-style: none; padding: 0; display: grid; gap: 0.1rem; font-size: 0.9375rem; }
.kn-flinks a { display: inline-block; padding: 0.35rem 0; }
.kn-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 0.25rem 2rem; border-top: 1px solid var(--line-dark); padding-block: 1.25rem; font-size: 0.875rem; }
.kn-legal, .kn-credit { color: var(--muted-dark); line-height: 2; }
.kn-legal__sep { margin-inline: 0.5rem; color: var(--line-dark); }
.kn-legal a, .kn-credit a { text-decoration: underline; text-decoration-color: var(--line-dark); }
@media (hover: hover) and (pointer: fine) { .kn-foot-details a:hover, .kn-flinks a:hover, .kn-legal a:hover, .kn-credit a:hover { color: #fff; text-decoration: underline; text-decoration-color: #fff; } }
@media (max-width: 899px) { .kn-footer__grid { grid-template-columns: 1fr 1fr; } .kn-foot-brand { grid-column: 1 / -1; } }
@media (pointer: coarse), (max-width: 899px) {
	.kn-flinks a, .kn-foot-details a, .kn-legal a, .kn-credit a, .kn-details a { display: inline-flex; align-items: center; min-height: 2.75rem; padding-block: 0; }
}

/* Grid and flex children must not inherit WordPress's flow spacing. */
.wp-site-blocks :is(.kn-split, .kn-tabs, .kn-band__cols, .kn-cols, .kn-welcome, .kn-regions, .kn-services-top, .kn-svc-block, .kn-leader, .kn-cv, .kn-career, .kn-contact, .kn-footer__grid, .kn-footer__cta, .kn-header__bar) > * { margin-block-start: 0; }
.kn-welcome > h2, .kn-career > h2 { max-width: 16em; }

/* ==========================================================================
   Motion. Everything is visible by default; these only run when motion is welcome.
   ========================================================================== */
@view-transition { navigation: auto; }
@keyframes kn-fade { from { opacity: 0; } }
@keyframes kn-rise { from { opacity: 0; transform: translateY(14px); } }
@keyframes kn-settle { from { transform: scale(1.07); } }
@keyframes kn-cut-in { from { clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%); } }
@keyframes kn-blade-in { from { opacity: 0; transform: translateX(5rem); } }
@keyframes kn-live { 50% { opacity: 0.35; } }

@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
	/* The hero is the one authored moment: the photograph is cut in along the angle of the K, the red blade follows. */
	.kn-hero__frame { animation: kn-cut-in 1100ms var(--ease-out) both; }
	.kn-hero__img { animation: kn-settle 1800ms var(--ease-out) both; }
	.kn-hero__blade { animation: kn-blade-in 900ms var(--ease-out) 250ms both; }
	.kn-hero__title { animation: kn-rise 700ms var(--ease-out) 60ms both; }
	.kn-hero__text { animation: kn-rise 700ms var(--ease-out) 150ms both; }
	.kn-hero__actions { animation: kn-rise 700ms var(--ease-out) 230ms both; }
	.kn-pagehead h1, .kn-pagehead__lead { animation: kn-rise 600ms var(--ease-out) both; }
	.kn-pagehead__lead { animation-delay: 80ms; }
	.kn-pagehead::before { animation: kn-blade-in 800ms var(--ease-out) 100ms both; }
	.kn-pagehead::after { animation: kn-blade-in 800ms var(--ease-out) both; }
	.kn-status__live { animation: kn-live 2.4s ease-in-out infinite; }
	.kn-nav .wp-block-navigation__responsive-container.is-menu-open { animation: kn-fade var(--t-base) var(--ease-out); }

	/* Rows and photographs arrive as they scroll into view. Only when JavaScript has opted in. */
	.js .kn-reveal { clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%); transition: clip-path 900ms var(--ease-out); }
	.js .kn-reveal.is-in { clip-path: polygon(var(--slant) 0, 100% 0, 100% 100%, 0 100%); }
	.js [data-kn-reveal] { opacity: 0; transform: translateY(10px); transition: opacity 450ms ease, transform 550ms var(--ease-out); transition-delay: calc(var(--i, 0) * 45ms); }
	.js [data-kn-reveal].is-in { opacity: 1; transform: none; }
	.is-tabs .kn-svc.is-entering { animation: kn-rise 380ms var(--ease-out) both; }
	.kn-sector.is-entering { animation: kn-fade 320ms ease both; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { scroll-behavior: auto !important; }
	::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}

@media print {
	.kn-header, .kn-footer__cta, .kn-filter, .wp-block-buttons { display: none !important; }
	.wp-site-blocks > .wp-block-template-part:first-child { position: static; }
}