/* Base layer: resets Salient chrome on KS-shell pages and applies SRS typography + layout. */

/* --- Salient chrome replaced by the KS header/footer --- */
body.ks-shell #header-outer,
body.ks-shell #header-space,
body.ks-shell #footer-outer,
body.ks-shell #slide-out-widget-area,
body.ks-shell #slide-out-widget-area-bg,
body.ks-shell #search-outer,
body.ks-shell #to-top {
	display: none !important;
}
body.ks-shell .container-wrap,
body.ks-shell .container-wrap.no-sidebar {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin-top: 0 !important;
	background: var(--color-surface) !important;
}
body.ks-shell .container-wrap > .container.main-content,
body.ks-shell .main-content > .row {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}
body.ks-shell #ajax-content-wrap { overflow: visible; }

/* --- Base --- */
body.ks-shell {
	background: var(--color-surface);
	color: var(--color-on-surface);
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	line-height: 1.6;
	font-feature-settings: "tnum" 0, "ss01" 0;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
.ks-scope, .ks-scope *, .ks-scope *::before, .ks-scope *::after { box-sizing: border-box; }
.ks-scope img, .ks-scope svg, .ks-scope video { max-width: 100%; height: auto; display: block; }
.ks-scope a { color: inherit; }
.ks-scope p { margin: 0 0 1em; padding: 0; }
.ks-scope h1, .ks-scope h2, .ks-scope h3, .ks-scope h4,
.ks-scope h5, .ks-scope h6 { color: inherit; margin: 0; padding: 0; letter-spacing: normal; }
.ks-scope ul, .ks-scope ol { margin: 0; padding: 0; }

/* Skip link — first focusable element on every page */
.ks-skip-link {
	position: absolute;
	left: var(--space-4);
	top: -100px;
	z-index: calc(var(--z-nav) + 1);
	background: var(--color-orange);
	color: var(--ks-black);
	padding: var(--space-3) var(--space-4);
	font: 600 var(--fs-button)/1 var(--font-sans);
	text-transform: uppercase;
	letter-spacing: .06em;
	text-decoration: none;
}
.ks-skip-link:focus { top: var(--space-4); }

/* Focus visibility (SCR-009): 2px ring, 2px offset; colour follows the surface. */
.ks-scope :focus-visible,
.ks-header :focus-visible,
.ks-footer :focus-visible {
	outline: 2px solid var(--color-focus);
	outline-offset: 2px;
}
html { scroll-padding-top: calc(var(--nav-height) + var(--space-4)); }

.ks-visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}

/* --- Typography scale (SRS 2.3) --- */
.ks-display-xl, .ks-display-l, .ks-display-m, .ks-h1, .ks-h2 {
	font-family: var(--font-display);
	font-weight: 400;
	text-wrap: balance;
}
.ks-display-xl { font-size: var(--fs-display-xl); line-height: .92; letter-spacing: -.03em; max-width: 12ch; }
.ks-display-l  { font-size: var(--fs-display-l);  line-height: .95; letter-spacing: -.025em; max-width: 16ch; }
.ks-display-m  { font-size: var(--fs-display-m);  line-height: 1;   letter-spacing: -.02em; max-width: 20ch; }
.ks-h1 { font-size: var(--fs-h1); line-height: 1.05; letter-spacing: -.015em; max-width: 22ch; }
.ks-h2 { font-size: var(--fs-h2); line-height: 1.1;  letter-spacing: -.01em;  max-width: 28ch; }
.ks-h3 { font: 500 var(--fs-h3)/1.2 var(--font-sans); letter-spacing: -.005em; max-width: 36ch; }
.ks-h4 { font: 600 var(--fs-h4)/1.25 var(--font-sans); max-width: 40ch; }
.ks-body-l { font: 400 var(--fs-body-l)/1.5 var(--font-sans); max-width: 58ch; }
.ks-body   { font: 400 var(--fs-body)/1.6 var(--font-sans); max-width: 68ch; }
.ks-body-s { font: 400 var(--fs-body-s)/1.5 var(--font-sans); letter-spacing: .005em; max-width: 62ch; }
.ks-caption { font: 400 var(--fs-caption)/1.4 var(--font-sans); letter-spacing: .01em; max-width: 52ch; color: var(--color-muted); }
.ks-eyebrow {
	display: block;
	font: 500 var(--fs-eyebrow)/1.2 var(--font-sans);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--color-muted);
	white-space: nowrap;
}
.ks-technical {
	font: 500 var(--fs-technical)/1.35 var(--font-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
	font-variant-numeric: tabular-nums;
}
.ks-display-xl, .ks-display-l, .ks-display-m { padding-bottom: .08em; }
.ks-display-xl em, .ks-display-l em, .ks-display-m em, .ks-h1 em, .ks-h2 em { font-style: italic; }
.ks-muted { color: var(--color-muted); }

@media (max-width: 767px) {
	.ks-display-xl, .ks-display-l, .ks-display-m { font-size: max(40px, var(--fs-display-m)); }
}

/* --- Layout (SRS 2.4) --- */
.ks-section {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	background: var(--color-surface);
	color: var(--color-on-surface);
	padding-block: var(--section-space);
}
.ks-section--flush { padding-block: 0; }
.ks-section--tight { padding-block: calc(var(--section-space) / 2); }
.ks-container {
	width: 100%;
	max-width: calc(var(--container-max) + 2 * var(--gutter));
	margin-inline: auto;
	padding-inline: var(--gutter);
}
.ks-grid {
	display: grid;
	grid-template-columns: repeat(var(--grid-cols), minmax(0, 1fr));
	column-gap: var(--col-gap);
	row-gap: var(--space-7);
}
.ks-col-full { grid-column: 1 / -1; }
.ks-col-half { grid-column: span 6; }
.ks-col-third { grid-column: span 4; }
.ks-col-two-thirds { grid-column: span 8; }
.ks-col-5 { grid-column: span 5; }
.ks-col-7 { grid-column: span 7; }
@media (max-width: 1199px) {
	.ks-col-half, .ks-col-5, .ks-col-7 { grid-column: span 4; }
	.ks-col-third { grid-column: span 4; }
	.ks-col-two-thirds { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
	.ks-col-half, .ks-col-third, .ks-col-two-thirds, .ks-col-5, .ks-col-7 { grid-column: 1 / -1; }
}

.ks-section-head {
	display: grid;
	grid-template-columns: repeat(var(--grid-cols), minmax(0, 1fr));
	column-gap: var(--col-gap);
	row-gap: var(--space-5);
	align-items: end;
	margin-bottom: var(--space-9);
	padding-bottom: var(--space-5);
	border-bottom: var(--hairline);
}
.ks-section-head__title { grid-column: 1 / span 7; }
.ks-section-head__aside { grid-column: 9 / -1; justify-self: end; text-align: right; }
.ks-section-head .ks-eyebrow { margin-bottom: var(--space-5); }
@media (max-width: 1199px) {
	.ks-section-head__title, .ks-section-head__aside { grid-column: 1 / -1; justify-self: start; text-align: left; }
}

.ks-stack > * + * { margin-top: var(--space-5); }
.ks-stack-l > * + * { margin-top: var(--space-7); }

/* Breadcrumbs (depth >= 2) */
.ks-breadcrumbs { background: transparent !important; color: var(--ks-cream); }
.ks-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; }
.ks-breadcrumbs li { display: flex; gap: var(--space-2); }
.ks-breadcrumbs li + li::before { content: "/"; color: var(--color-muted); }
.ks-breadcrumbs a { text-decoration: none; color: var(--color-muted); }
.ks-breadcrumbs a:hover { color: var(--color-on-surface); }

@media (prefers-reduced-motion: reduce) {
	.ks-scope *, .ks-header *, .ks-footer * {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Salient styles every list inside .main-content (bullets, decimals, left margins). KS components opt out. */
body.ks-shell :is(.ks-header, .ks-sheet, .ks-footer, .ks-scope) :is(ul, ol):not(.ks-prose ul, .ks-prose ol) {
	list-style: none !important;
	margin-left: 0;
	padding-left: 0;
}
body.ks-shell :is(.ks-header, .ks-sheet, .ks-footer, .ks-scope) :is(ul, ol):not(.ks-prose ul, .ks-prose ol) > li {
	list-style: none !important;
	margin-left: 0;
	padding-left: 0;
}
body.ks-shell :is(.ks-header, .ks-sheet, .ks-footer, .ks-scope) :is(ul, ol):not(.ks-prose ul, .ks-prose ol) > li::marker { content: none; }
body.ks-shell .ks-prose ul { list-style: disc; padding-left: 1.2em; }
body.ks-shell .ks-prose ol { list-style: decimal; padding-left: 1.2em; }

/* Salient sets overflow:hidden on <html>/<body>, which turns <body> into a non-scrolling clip container and
   breaks position:sticky (the pinned journey). `clip` hides horizontal overflow without creating a scroll container. */
html:has(body.ks-shell) { overflow: visible !important; overflow-x: clip !important; }
body.ks-shell { overflow: visible !important; overflow-x: clip !important; }
body.ks-shell.ks-sheet-open { overflow: hidden !important; }

/* Salient gives fieldsets, paragraphs and divs explicit display values that beat the [hidden] attribute. */
body.ks-shell :is(.ks-scope, .ks-header, .ks-sheet, .ks-footer, .ks-consent) [hidden],
body.ks-shell .ks-sheet[hidden], body.ks-shell .ks-consent[hidden] { display: none !important; }