/*  Landing sections, in board order. */

/* =========================================================================
   01 — Hero.  Board: 1440 × 760, body padding 140/120/76, gap 26.
   ====================================================================== */

/*  Board height is 760. Reduced on the client's request to tighten the gap
	between the header and the headline. Note the lever: the body is pinned to
	the bottom of the hero, so trimming its padding-top only grows the empty
	space above it — the height is what actually moves the content. */
.ek-hero {
	position: relative;
	/* The board draws a fixed 760 band with the content bottom-aligned. On a
	   real screen that left a lot of dead sky above the eyebrow, so the band is
	   trimmed to 700 and the body's top padding with it — a deliberate
	   departure from the board, agreed with the client. */
	min-height: 700px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	background: var(--ek-bg-deep);
	overflow: hidden;
	isolation: isolate;
}

.ek-hero__media {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.ek-hero__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/*  Board gradient: #070B09 at 50% → 80% at the midpoint → 96% at the bottom.
	Kept as a pseudo-element so the photo can be swapped in the admin without
	the overlay having to be re-authored. */
.ek-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(
		to bottom,
		rgba(7, 11, 9, 0.50) 0%,
		rgba(7, 11, 9, 0.80) 50%,
		rgba(7, 11, 9, 0.96) 100%
	);
}

.ek-hero__body {
	max-width: calc(var(--ek-container) + var(--ek-gutter) * 2);
	width: 100%;
	margin-inline: auto;
	padding: 96px var(--ek-gutter) 76px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 26px;
}

.ek-hero__eyebrow {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: var(--ek-eyebrow);
	font-weight: 600;
	letter-spacing: var(--ek-eyebrow-ls);
	text-transform: uppercase;
	color: var(--ek-accent-eyebrow);
	line-height: 1.2;
}

.ek-hero__dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--ek-accent-dot);
	flex: none;
}

.ek-hero__title {
	font-size: var(--ek-h1);
	line-height: var(--ek-h1-lh);
	letter-spacing: var(--ek-h1-ls);
	color: var(--ek-white);
	/* Board 26:27 is 1040 wide, which is what makes the headline break into two
	   lines instead of four. */
	max-width: 1040px;
}

.ek-hero__text {
	font-size: 19px;
	line-height: 1.62;
	letter-spacing: -0.002em;
	color: var(--ek-text-onDeep-soft);
	max-width: 760px;   /* board 26:28 */
}

.ek-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	padding-top: 12px;
}

/* KPI strip — board: 4 cells, 28/30 vertical padding, 36 inner, white/14 rules */

.ek-hero__kpi {
	background: rgba(7, 11, 9, 0.55);
	border-top: 1px solid var(--ek-line-onDark-14);
}

.ek-hero__kpi-grid {
	display: flex;
	max-width: calc(var(--ek-container) + var(--ek-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--ek-gutter);
}

.ek-hero__kpi-cell {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 28px 36px 30px 36px;
	border-left: 1px solid var(--ek-line-onDark-14);
}

.ek-hero__kpi-cell:first-child {
	padding-left: 0;
	border-left: 0;
}

.ek-hero__kpi-value {
	font-size: 26px;
	font-weight: 600;
	letter-spacing: -0.012em;
	line-height: 1.2;
	color: var(--ek-white);
}

/*  1.2, not 1.4: this node has no explicit line height on the board, and
	Figma's automatic line height for Inter is ~1.21. Anywhere the board leaves
	line height on AUTO, 1.2 is the value to use. */
.ek-hero__kpi-label {
	margin: 0;
	font-size: var(--ek-micro);
	line-height: 1.2;
	color: var(--ek-text-kpi-label);
}

/* =========================================================================
   02 — About & Operations.  Board: padding 120/120, intro gap 100,
   headline max 560, copy column max 460, quote 440, ops head 96/34,
   steps row gap 28 with a 2px rule on top of each card.
   ====================================================================== */

/* This section is the one with 120 padding on the board; the others are 118,
   which is what .ek-section carries. */
.ek-about {
	padding-block: 120px;
}

.ek-about .ek-container {
	display: flex;
	flex-direction: column;
}

.ek-about__intro {
	display: flex;
	align-items: flex-start;
	gap: 100px;
}

.ek-about__head,
.ek-about__copy {
	flex: 1 1 0;
	min-width: 0;
}

.ek-about__head {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.ek-about__title {
	max-width: 560px;
}

.ek-about__copy {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-top: 8px;
}

.ek-about__p {
	max-width: 460px;
}

.ek-about__p--soft {
	color: var(--ek-text-soft);
}

.ek-about__quote {
	margin: 0;
	padding: 4px 0 4px 20px;
	border-left: 2px solid var(--ek-accent);
	max-width: 440px;
	font-size: var(--ek-body-m);
	font-weight: 500;
	line-height: 1.58;
	letter-spacing: -0.002em;
	color: var(--ek-text);
}

.ek-about__ops-head {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 96px;
	padding-bottom: 34px;
}

.ek-steps {
	display: flex;
	gap: 28px;
	align-items: flex-start;
	counter-reset: none;
}

.ek-steps__item {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-top: 26px;
	padding-bottom: 8px;
	border-top: 2px solid var(--ek-line-strong);
}

.ek-steps__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.ek-steps__number {
	font-size: var(--ek-eyebrow);
	font-weight: 600;
	letter-spacing: var(--ek-eyebrow-ls);
	line-height: 1.2;
	color: var(--ek-accent-text);
}

.ek-steps__icon {
	color: var(--ek-line-strong);
	flex: none;
}

.ek-steps__text {
	font-size: var(--ek-body-s);
	line-height: 1.6;
	color: var(--ek-text-soft);
}

/* =========================================================================
   03 — Production & Technology.  Board: deep surface, columns 520 + fill at
   88 gap, equipment rows 20/20 on a white/12 rule, gallery 386 + pair 196/14.
   ====================================================================== */

.ek-prod__grid {
	display: flex;
	align-items: flex-start;
	gap: 88px;
}

.ek-prod__copy {
	width: 520px;
	flex: none;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.ek-prod__title {
	font-size: var(--ek-h2-alt);
	line-height: var(--ek-h2-lh);
	letter-spacing: var(--ek-h2-alt-ls);
	color: var(--ek-white);
}

.ek-prod__text {
	font-size: var(--ek-body-m);
	line-height: 1.68;
	letter-spacing: -0.001em;
	color: var(--ek-text-onDeep);
}

.ek-specs {
	margin-top: 20px;
}

.ek-specs__row {
	display: flex;
	align-items: center;
	gap: 18px;
	padding-block: 20px;
	border-top: 1px solid var(--ek-line-onDark);
}

.ek-specs__row:last-child {
	border-bottom: 1px solid var(--ek-line-onDark);
}

.ek-specs__icon {
	color: var(--ek-accent-icon);
	flex: none;
}

.ek-specs__body {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.ek-specs__title {
	font-size: var(--ek-body-m);
	font-weight: 500;
	letter-spacing: -0.002em;
	line-height: 1.2;
	color: var(--ek-white);
}

.ek-specs__meta {
	font-size: var(--ek-micro);
	line-height: 1.2;
	color: var(--ek-text-muted);
}

.ek-prod__gallery {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.ek-prod__photo {
	margin: 0;
	border-radius: var(--ek-radius);
	overflow: hidden;
}

.ek-prod__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ek-prod__photo--main {
	height: 386px;
}

.ek-prod__pair {
	display: flex;
	gap: 14px;
}

.ek-prod__pair .ek-prod__photo {
	flex: 1 1 0;
	min-width: 0;
	height: 196px;
}

.ek-prod__caption {
	padding-top: 4px;
	font-size: var(--ek-nano);
	line-height: 1.2;
	color: var(--ek-text-dim);
}

/* =========================================================================
   04 — Product Specification.  Board: mid surface, head 46 below, table +
   360 card at 40 gap, rows 26/17, header row on the deep surface.
   ====================================================================== */

.ek-prd__head {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-bottom: 46px;
}

/* The board leaves this node's line height on AUTO, so it is 1.2 here even
   though .ek-lead is 1.68 — that class is shared with paragraphs the board
   does set to 168%. */
.ek-prd__sub {
	line-height: 1.2;
	color: var(--ek-text-soft);
}

.ek-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding-top: 6px;
}

.ek-chip {
	padding: 7px 12px;
	background: var(--ek-bg-card);
	border: 1px solid var(--ek-line);
	border-radius: var(--ek-radius);
	font-size: var(--ek-nano);
	font-weight: 500;
	letter-spacing: 0.02em;
	line-height: 1.2;
	color: var(--ek-text-body);
}

.ek-prd__cols {
	display: flex;
	align-items: flex-start;
	gap: 40px;
}

.ek-prd__table-wrap {
	flex: 1 1 0;
	min-width: 0;
	background: var(--ek-bg-card);
	border: 1px solid var(--ek-line);
	border-radius: var(--ek-radius);
	overflow: hidden;
}

.ek-table th,
.ek-table td {
	text-align: left;
	vertical-align: middle;
}

.ek-table thead th {
	padding: 15px 26px;
	background: var(--ek-bg-deep);
	font-size: var(--ek-label);
	font-weight: 600;
	letter-spacing: var(--ek-label-ls);
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--ek-accent-eyebrow);
}

.ek-table tbody th,
.ek-table tbody td {
	padding: 17px 26px;
	border-top: 1px solid var(--ek-line);
	line-height: 1.2;
}

.ek-table tbody th {
	width: 300px;
	font-size: var(--ek-body-s);
	font-weight: 400;
	color: var(--ek-text-body);
}

.ek-table__value {
	width: 250px;
	font-size: var(--ek-body-s);
	font-weight: 600;
	letter-spacing: -0.002em;
	color: var(--ek-text);
}

.ek-table__method {
	width: 170px;
	font-size: var(--ek-micro);
	color: var(--ek-text-muted);
}

.ek-table__footnote {
	padding: 16px 26px 18px;
	background: var(--ek-bg-mid);
	border-top: 1px solid var(--ek-line);
	font-size: var(--ek-micro);
	line-height: 1.55;
	color: var(--ek-text-soft);
}

.ek-tds {
	width: 360px;
	flex: none;
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 32px 30px;
	background: var(--ek-bg-deep);
	border-radius: var(--ek-radius);
}

.ek-tds__doc {
	position: relative;
	display: block;
	width: 44px;
	height: 56px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: var(--ek-radius);
}

.ek-tds__doc-line {
	position: absolute;
	left: 10px;
	height: 2px;
	background: rgba(255, 255, 255, 0.22);
}

.ek-tds__doc-line:nth-child(1) { top: 14px; width: 24px; background: rgba(255, 255, 255, 0.35); }
.ek-tds__doc-line:nth-child(2) { top: 21px; width: 18px; }
.ek-tds__doc-line:nth-child(3) { top: 28px; width: 21px; }

.ek-tds__doc-badge {
	position: absolute;
	left: 9px;
	top: 36px;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.08em;
	color: var(--ek-accent-eyebrow);
}

.ek-tds__title {
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -0.008em;
	line-height: 1.2;
	color: var(--ek-white);
}

.ek-tds__text {
	font-size: var(--ek-body-s);
	line-height: 1.6;
	color: var(--ek-text-onDeep);
}

.ek-tds__divider {
	display: block;
	height: 1px;
	background: var(--ek-line-onDark);
}

.ek-tds__apps {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ek-tds__apps-label {
	font-size: var(--ek-label);
	font-weight: 600;
	letter-spacing: var(--ek-label-ls);
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--ek-text-muted);
}

.ek-tds__apps-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	line-height: 1.2;
}

.ek-tds__apps-list li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--ek-body-xs);
	line-height: 1.2;
	color: var(--ek-text-onDeep);
}

.ek-tds__dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--ek-accent-dot);
	flex: none;
}

/* =========================================================================
   05 — Logistics & Compliance.  Board: head 100 gap / 48 below, three cards
   at 28 with a 216 photo, note strip 32/26 at 56 gap on the mid surface.
   ====================================================================== */

.ek-log__head {
	display: flex;
	align-items: flex-start;
	gap: 100px;
	padding-bottom: 48px;
}

.ek-log__head-left {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.ek-log__title {
	max-width: 560px;
}

.ek-log__text {
	flex: 1 1 0;
	min-width: 0;
	max-width: 460px;
	padding-top: 10px;
	color: var(--ek-text-soft);
}

.ek-log__cards {
	display: flex;
	align-items: stretch;
	gap: 28px;
}

.ek-log__card {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	background: var(--ek-bg-card);
	border: 1px solid var(--ek-line);
	border-radius: var(--ek-radius);
	overflow: hidden;
}

.ek-log__photo {
	height: 216px;
}

.ek-log__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ek-log__body {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 26px 28px;
}

.ek-log__card-text {
	font-size: var(--ek-body-s);
	line-height: 1.62;
	color: var(--ek-text-soft);
}

.ek-log__strip {
	display: flex;
	gap: 56px;
	margin-top: 40px;
	padding: 26px 32px;
	background: var(--ek-bg-mid);
	border-radius: var(--ek-radius);
}

.ek-log__strip-cell {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.ek-log__strip-label {
	font-size: var(--ek-label);
	font-weight: 600;
	letter-spacing: var(--ek-label-ls);
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--ek-text-muted);
}

.ek-log__strip-value {
	font-size: var(--ek-body-s);
	font-weight: 500;
	letter-spacing: -0.002em;
	line-height: 1.2;
	color: var(--ek-text);
}

/* =========================================================================
   06 — Contacts & Compliance.  Board: deep surface, copy + 500 form card at
   88 gap, legal rows 15/15 on white/12, form padding 40 with an 18 gap.
   ====================================================================== */

.ek-con__grid {
	display: flex;
	align-items: flex-start;
	gap: 88px;
}

.ek-con__copy {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.ek-con__title {
	font-size: var(--ek-h2);
	line-height: var(--ek-h2-lh);
	letter-spacing: var(--ek-h2-ls);
	color: var(--ek-white);
}

.ek-con__text {
	font-size: var(--ek-body-l);
	line-height: var(--ek-body-l-lh);
	letter-spacing: var(--ek-body-l-ls);
	color: var(--ek-text-onDeep);
}

.ek-legal {
	margin-top: 18px;
}

.ek-legal__row {
	display: flex;
	align-items: center;
	gap: 0;
	padding-block: 15px;
	border-top: 1px solid var(--ek-line-onDark);
}

.ek-legal__row:last-child {
	border-bottom: 1px solid var(--ek-line-onDark);
}

.ek-legal__key {
	width: 190px;
	flex: none;
	font-size: var(--ek-body-xs);
	line-height: 1.2;
	color: var(--ek-text-muted);
}

.ek-legal__value {
	flex: 1 1 0;
	min-width: 0;
	font-size: var(--ek-body-s);
	font-weight: 500;
	letter-spacing: -0.002em;
	line-height: 1.2;
	color: var(--ek-white);
}

.ek-legal__value.is-pending {
	font-weight: 500;
	color: var(--ek-text-pending);
}

.ek-legal__value a:hover {
	color: var(--ek-accent-eyebrow);
}

/* ---- Form card ---- */

.ek-form-card {
	width: 500px;
	flex: none;
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 40px;
	background: var(--ek-bg-card);
	border-radius: var(--ek-radius);
}

.ek-form-card__title {
	font-size: var(--ek-h5);
	font-weight: 600;
	letter-spacing: var(--ek-h5-ls);
	line-height: 1.2;
	color: var(--ek-text);
}

.ek-form-card__notice {
	padding: 12px 14px;
	border-radius: var(--ek-radius);
	font-size: var(--ek-micro);
	line-height: 1.5;
}

.ek-form-card__notice.is-ok {
	background: rgba(34, 162, 104, 0.12);
	border: 1px solid var(--ek-accent);
	color: var(--ek-text);
}

.ek-form-card__notice.is-error {
	background: var(--ek-danger-bg);
	border: 1px solid var(--ek-danger-line);
	color: var(--ek-text-body);
}

/* The notice is a live region the script writes into, so it needs to be
   reachable when focus is sent to it after a send. */
.ek-form-card__notice:focus {
	outline: 2px solid var(--ek-accent);
	outline-offset: 2px;
}

.ek-form {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

/* Off-screen rather than display:none — some bots skip hidden inputs. */
.ek-form__trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* 18 down the form, 14 between the two half-width fields — the board uses
   different spacing on each axis. */
.ek-form__grid {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 14px;
}

.ek-form__field {
	flex: 1 1 100%;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.ek-form__field.is-half {
	flex: 1 1 calc(50% - 7px);
	min-width: 0;
}

.ek-form__label {
	font-size: var(--ek-label);
	font-weight: 600;
	letter-spacing: var(--ek-label-ls);
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--ek-text-soft);
}

.ek-form__input {
	width: 100%;
	padding: 15px 16px;
	background: var(--ek-bg-input);
	border: 1px solid var(--ek-line);
	border-radius: var(--ek-radius);
	font-size: var(--ek-body-s);
	/* Figma reports this text node as 16px tall, a browser line box at 1.2
	   would be 18 — with the board's 15px padding that is a 2px taller field.
	   Pinning the line box keeps the padding honest and the height exact. */
	line-height: 16px;
	color: var(--ek-text);
}

.ek-form__input::placeholder {
	color: var(--ek-text-placeholder);
}

.ek-form__input:focus {
	border-color: var(--ek-accent);
	outline: none;
}

/* Colour alone would leave this invisible to the ~8% of men who cannot separate
   red from grey-green, so the outline thickens as well. */
.ek-form__input.is-invalid {
	border-color: var(--ek-danger);
	box-shadow: 0 0 0 1px var(--ek-danger);
}

.ek-form__input.is-invalid:focus {
	border-color: var(--ek-danger);
}

.ek-form__consent input.is-invalid {
	outline: 2px solid var(--ek-danger);
	outline-offset: 1px;
}

.ek-form__error {
	display: block;
	margin-top: 6px;
	color: var(--ek-danger);
	font-size: var(--ek-micro);
	line-height: 1.4;
}

.ek-form__error[hidden] {
	display: none;
}

.ek-form__field--consent {
	display: block;
}

/* The button says "Sending…" while the request is out; without this the label
   change is the only feedback and a slow connection looks like a dead click. */
.ek-form button[disabled] {
	opacity: 0.6;
	cursor: progress;
}

.ek-form__input--area {
	/* Board: 15 top padding, a two-line placeholder and 74 below it. */
	min-height: 125px;
	resize: vertical;
}

.ek-form__consent {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: var(--ek-micro);
	line-height: 1.52;
	color: var(--ek-text-soft);
	cursor: pointer;
}

.ek-form__consent input {
	appearance: none;
	width: 18px;
	height: 18px;
	flex: none;
	margin-top: 1px;
	background: var(--ek-bg-card);
	border: 1px solid var(--ek-line-check);
	border-radius: var(--ek-radius);
	cursor: pointer;
}

.ek-form__consent input:checked {
	background: var(--ek-accent);
	border-color: var(--ek-accent);
}

.ek-form__note {
	font-size: var(--ek-micro);
	line-height: 1.5;
	color: var(--ek-text-muted);
}

/* =========================================================================
   Legal pages.  Board node 51:2 — title band 87→360, contents column 260 at
   88 from the top, article at 468 with 852 of measure, sections 30/30.
   ====================================================================== */

.ek-legalpage__band {
	background: var(--ek-bg-deep);
	/* Board: 86 above, 72 below, a uniform 14 between the three lines. */
	padding-block: 86px 72px;
}

.ek-legalpage__title {
	margin-block: 14px 14px;
	font-size: 48px;
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: var(--ek-white);
}

.ek-legalpage__meta {
	font-size: var(--ek-body-s);
	line-height: 1.2;
	color: var(--ek-text-muted);
}

.ek-legalpage {
	padding-block: 88px 104px;
}

.ek-legalpage__grid {
	display: flex;
	align-items: flex-start;
	gap: 88px;
}

.ek-legalpage__toc {
	width: 260px;
	flex: none;
	position: sticky;
	top: 111px; /* header 87 + 24 breathing room */
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.ek-legalpage__toc-title {
	font-size: var(--ek-label);
	font-weight: 600;
	letter-spacing: var(--ek-label-ls);
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--ek-text-muted);
}

.ek-legalpage__toc-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
	font-size: var(--ek-micro);
	line-height: 1.5;
}

.ek-legalpage__toc-list li {
	display: flex;
	gap: 10px;
}

.ek-legalpage__toc-num {
	color: var(--ek-text-muted);
	flex: none;
}

.ek-legalpage__toc-list a {
	color: var(--ek-text-body);
	font-weight: 500;
}

.ek-legalpage__toc-list a:hover {
	color: var(--ek-text);
}

.ek-legalpage__article {
	flex: 1 1 0;
	min-width: 0;
	max-width: 852px;
}

.ek-legalpage__lead {
	/* 18/165 on the board, not the 17/168 the shared .ek-lead carries. */
	font-size: 18px;
	line-height: 1.65;
	letter-spacing: -0.002em;
	color: var(--ek-text-body);
	padding-bottom: 40px;
}

.ek-legalpage__section {
	padding-block: 30px;
	border-top: 1px solid var(--ek-line);
}

.ek-legalpage__section-head {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 14px;
	font-size: var(--ek-h5);
	letter-spacing: -0.01em;
	line-height: 1.2;
	color: var(--ek-text);
}

.ek-legalpage__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	flex: none;
	background: var(--ek-accent);
	border-radius: var(--ek-radius);
	font-size: var(--ek-nano);
	font-weight: 600;
	color: var(--ek-white);
}

.ek-legalpage__body {
	font-size: var(--ek-body-m);
	line-height: 1.72;
	letter-spacing: -0.001em;
	color: var(--ek-text-soft);
}

.ek-legalpage__section:last-of-type {
	border-bottom: 1px solid var(--ek-line);
}

.ek-legalpage__note {
	margin-top: 36px;
	padding: 22px 24px 24px;
	background: var(--ek-bg-mid);
	border-left: 2px solid var(--ek-accent);
}

.ek-legalpage__note-title {
	font-size: var(--ek-body-xs);
	font-weight: 600;
	letter-spacing: -0.002em;
	line-height: 1.2;
	color: var(--ek-text);
	margin-bottom: 8px;
}

.ek-legalpage__note-text {
	font-size: var(--ek-body-xs);
	line-height: 1.58;
	color: var(--ek-text-soft);
}

/* =========================================================================
   404 and search — not on the board, assembled from the same tokens.
   ====================================================================== */

.ek-service {
	background: var(--ek-bg-deep);
	padding-block: 140px 160px;
	min-height: 60vh;
}

.ek-service__inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	max-width: 720px;
}

.ek-service__title {
	font-size: var(--ek-h2);
	line-height: var(--ek-h2-lh);
	letter-spacing: var(--ek-h2-ls);
	color: var(--ek-white);
}

.ek-service__text {
	font-size: var(--ek-body-l);
	line-height: var(--ek-body-l-lh);
	color: var(--ek-text-onDeep);
}

.ek-searchform {
	display: flex;
	gap: 10px;
	width: 100%;
	max-width: 520px;
	margin-top: 8px;
}

.ek-searchform__input {
	flex: 1 1 auto;
}

.ek-results {
	display: flex;
	flex-direction: column;
	gap: 0;
	width: 100%;
	margin-top: 16px;
}

.ek-results__item {
	padding-block: 22px;
	border-top: 1px solid var(--ek-line-onDark);
}

.ek-results__item:last-child {
	border-bottom: 1px solid var(--ek-line-onDark);
}

.ek-results__link {
	font-size: var(--ek-h4);
	font-weight: 600;
	letter-spacing: var(--ek-h4-ls);
	color: var(--ek-white);
}

.ek-results__link:hover {
	color: var(--ek-accent-eyebrow);
}

.ek-results__excerpt {
	margin-top: 6px;
	font-size: var(--ek-body-s);
	line-height: 1.6;
	color: var(--ek-text-onDeep);
}

/*  Certification marker in the contacts block. Sits above the legal rows, on
	the accent rule the board uses for the pull quote — it is the same kind of
	statement: a claim the reader is meant to weigh. */
.ek-con__iscc {
	display: flex;
	gap: 14px;
	margin-top: 4px;
	padding: 16px 18px;
	background: rgba(34, 162, 104, 0.07);
	border-left: 2px solid var(--ek-accent);
	border-radius: 0 var(--ek-radius) var(--ek-radius) 0;
	font-size: var(--ek-body-s);
	line-height: 1.6;
	color: var(--ek-text-onDeep);
}

.ek-con__iscc-mark {
	width: 6px;
	height: 6px;
	margin-top: 8px;
	flex: none;
	border-radius: 50%;
	background: var(--ek-accent-dot);
}

/*  Registration status: shown instead of the address / KVK / VAT rows while
	those are still placeholders. Deliberately styled as a note, not as data —
	it is a statement about the company, not a value to be verified. */
.ek-legal__status {
	margin-top: 16px;
	padding: 14px 16px;
	background: rgba(255, 255, 255, 0.04);
	border-left: 2px solid var(--ek-line-onDark-16);
	font-size: var(--ek-body-xs);
	line-height: 1.6;
	color: var(--ek-text-muted);
}

/* =========================================================================
   Sections added in the August 2026 revision.
   Measurements taken from the board (05 · Dark theme, node 26:3), not by eye:
   section padding 118px, container 1200px, four columns of 279px with 28px
   gutters, eyebrow 12/12%, section heading 28px, body 17px/168%.
   ========================================================================= */

/* --- 02 More Than Trading ---------------------------------------------- */

.ek-mtt__title { max-width: 760px; margin-top: 14px; }

.ek-mtt__text {
	max-width: 760px;
	margin-top: 14px;
	font-size: var(--ek-body-l);
	line-height: var(--ek-body-l-lh);
	color: var(--ek-text-body);
}

.ek-mtt__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 34px 28px;
	margin: 64px 0 0;
	padding: 0;
	list-style: none;
}

.ek-mtt__item {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-top: 18px;
	border-top: 1px solid var(--ek-line-onDark-14);
}

.ek-mtt__num {
	font-size: var(--ek-micro);
	font-weight: 600;
	letter-spacing: 0.12em;
	color: var(--ek-accent);
}

.ek-mtt__label {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.006em;
	color: var(--ek-text);
}

.ek-mtt__band {
	margin: 64px 0 0;
	padding: 26px 28px;
	border-left: 2px solid var(--ek-accent);
	background: rgba(63, 190, 133, 0.08);
	font-size: 24px;
	font-weight: 600;
	letter-spacing: -0.008em;
	color: var(--ek-text);
}

/* --- 04 Ukrainian Industrial Origin ------------------------------------ */

.ek-org__title,
.ek-org__ce-title { max-width: 820px; margin-top: 14px; }

.ek-org__text {
	max-width: 820px;
	margin-top: 14px;
	font-size: var(--ek-body-l);
	line-height: var(--ek-body-l-lh);
	color: var(--ek-text-body);
}

.ek-org__chain {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	align-items: stretch;
	margin: 64px 0 0;
	padding: 0;
	list-style: none;
}

.ek-org__link {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 26px;
	background: rgba(255, 255, 255, 0.04);
}

/* The arrow belongs to the layout, not to the copy: on a phone the row becomes
   a column and it has to point down instead of right. */
.ek-org__link + .ek-org__link::before {
	content: "→";
	position: absolute;
	top: 50%;
	left: -20px;
	width: 20px;
	transform: translate(-50%, -50%);
	text-align: center;
	font-size: 20px;
	line-height: 1;
	color: var(--ek-accent);
}

.ek-org__link-title {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.004em;
	color: var(--ek-text);
}

.ek-org__link.is-highlight .ek-org__link-title { color: var(--ek-accent); }

.ek-org__link-sub {
	font-size: var(--ek-micro);
	line-height: 1.5;
	color: var(--ek-text-muted);
}

.ek-org__ce { margin-top: 90px; }

.ek-org__terms {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 26px 0 0;
	padding: 0;
	list-style: none;
}

/* --- 07 Business Model & Quality --------------------------------------- */

.ek-bm__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 80px;
	align-items: start;
}

.ek-bm__title { margin-top: 14px; font-size: 26px; letter-spacing: -0.011em; }

.ek-bm__text {
	margin-top: 14px;
	font-size: var(--ek-body-m);
	line-height: var(--ek-body-m-lh);
	color: var(--ek-text-body);
}

/* --- 09 Sustainability & Compliance ------------------------------------ */

.ek-cmp__title { max-width: 820px; margin-top: 14px; }

.ek-cmp__text {
	max-width: 820px;
	margin-top: 14px;
	font-size: var(--ek-body-l);
	line-height: var(--ek-body-l-lh);
	color: var(--ek-text-body);
}

.ek-cmp__panel {
	margin-top: 40px;
	padding: 28px;
	border-left: 2px solid var(--ek-accent);
	background: rgba(63, 190, 133, 0.07);
}

.ek-cmp__panel-title {
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.008em;
	color: var(--ek-text);
}

.ek-cmp__panel-text {
	margin-top: 10px;
	font-size: var(--ek-body-m);
	line-height: 1.65;
	color: var(--ek-text-body);
}

/* --- 10 Development Roadmap -------------------------------------------- */

.ek-rm__title { max-width: 820px; margin-top: 14px; }

.ek-rm__text {
	max-width: 820px;
	margin-top: 14px;
	font-size: var(--ek-body-l);
	line-height: var(--ek-body-l-lh);
	color: var(--ek-text-body);
}

.ek-rm__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px;
	margin: 56px 0 0;
	padding: 0;
	list-style: none;
}

.ek-rm__phase {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding-top: 16px;
	border-top: 2px solid rgba(63, 190, 133, 0.55);
}

.ek-rm__num {
	font-size: var(--ek-micro);
	font-weight: 600;
	letter-spacing: 0.12em;
	color: var(--ek-accent);
}

.ek-rm__phase-title {
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.006em;
	color: var(--ek-text);
}

.ek-rm__phase-text {
	font-size: var(--ek-body-xs);
	line-height: 1.6;
	color: var(--ek-text-muted);
}

/* --- Product: facts strip, classification note, applications intro ------ */

.ek-prd__facts {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px;
	margin: 26px 0 0;
}

.ek-prd__fact {
	padding-top: 8px;
	border-top: 1px solid var(--ek-line-onDark-14);
}

.ek-prd__fact dt {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ek-text-muted);
}

.ek-prd__fact dd {
	margin-top: 8px;
	font-size: var(--ek-body-s);
	font-weight: 500;
	line-height: 1.45;
	color: var(--ek-text);
}

.ek-prd__class {
	margin-top: 26px;
	font-size: var(--ek-micro);
	line-height: 1.5;
	color: var(--ek-text-muted);
}

.ek-tds__apps-intro {
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.5;
	color: var(--ek-text-body);
}

.ek-tds__apps-note {
	margin-top: 12px;
	font-size: 11px;
	line-height: 1.45;
	color: var(--ek-text-muted);
}