/* ==========================================================================
   Innoseis: inner pages
   The sections written by inc/pattern-kit.php (Technology, Products, Applications,
   About, Careers, Contact) and the news archive. Loaded after wordpress.css.
   ========================================================================== */

/* The grids' column count. (base.css gives grids an auto-fill default, which would
   otherwise override the column count WordPress writes for each grid.) */
.is-layout-grid.is-cols-1 { grid-template-columns: minmax(0, 1fr); }
.is-layout-grid.is-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.is-layout-grid.is-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.is-layout-grid.is-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* =========================================================================
   1. Page header: label, title and intro, then an optional photo band
   ========================================================================= */
.page-hero.is-style-section-paper { padding-top: calc(var(--wp--custom--header--height) + var(--wp--preset--spacing--70)); }
/* a page that starts straight with a section (no page header): that section clears the fixed site header */
.wp-block-post-content.home-sections > [class*="is-style-section-"]:first-child:not(.page-hero) { padding-top: calc(var(--wp--custom--header--height) + var(--wp--preset--spacing--70)) !important; }
.page-hero .section-head h1 { max-width: 14em; line-height: 1.04; letter-spacing: -0.035em; }
.page-hero .page-hero__intro { max-width: 32em; color: var(--wp--preset--color--slate); line-height: 1.6; }
.page-hero .section-head .wp-block-buttons { margin-block-start: var(--wp--preset--spacing--40); }
.page-hero .chapter-mark .is-style-eyebrow a { color: inherit; text-decoration: none; }
.page-hero .chapter-mark .is-style-eyebrow a:hover { text-decoration: underline; text-underline-offset: 0.25em; }
.page-hero.is-layout-constrained > .page-hero__photo { margin-block-start: var(--wp--preset--spacing--60); }
.page-hero .page-hero__photo img { height: clamp(14rem, 6rem + 22vw, 26rem); }
/* the photos sit inside the page margins with rounded corners, like the featured story on News (the
   corners on the photo itself, so the frame doesn't clip the waves behind it) */
.page-hero .page-hero__photo.is-style-photo-band { overflow: visible; }
.page-hero .page-hero__photo img, .page-hero__photos img { border-radius: var(--wp--custom--radius--large); }
/* "is-tall": a taller band for a group photo, so every head fits on wide screens too */
.page-hero .page-hero__photo.is-tall img { height: clamp(18rem, 8rem + 30vw, 40rem); object-position: 50% 50%; }
/* a row of photos instead of the one band (Careers: the field, the lab, the team) */
.page-hero.is-layout-constrained > .page-hero__photos { gap: var(--wp--preset--spacing--20); margin-block-start: var(--wp--preset--spacing--60); }
.page-hero__photos > .wp-block-image { margin: 0; }
.page-hero__photos img { display: block; width: 100%; height: clamp(14rem, 6rem + 22vw, 26rem); object-fit: cover; }
/* phones: the first photo across the full width, the others side by side below it */
@media (max-width: 600px) {
	.page-hero .page-hero__photos.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.page-hero__photos.is-cols-3 > .wp-block-image:first-child { grid-column: 1 / -1; }
	.page-hero__photos img { height: 12rem; }
}

/* =========================================================================
   2. Numbered cards, and the same cards as rows ("is-rows")
   ========================================================================= */
.feature-grid.is-layout-grid { gap: var(--wp--preset--spacing--30); }
.feature-card {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20);
	padding: var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--custom--line--light);
	border-radius: var(--wp--custom--radius--medium);
	background-color: var(--wp--preset--color--white);
}
:where(.is-style-section-white) .feature-card { background-color: var(--wp--preset--color--paper); }
.feature-card > * { margin-block: 0; }
.feature-card .wp-block-heading { line-height: 1.2; letter-spacing: -0.02em; }
.feature-card > p:not(.feature-card__num) { color: var(--wp--preset--color--slate); line-height: 1.6; }
.feature-card__num {
	margin-bottom: var(--wp--preset--spacing--20) !important;
	color: var(--wp--preset--color--navy);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
}

.feature-grid.is-rows.is-layout-grid { grid-template-columns: minmax(0, 1fr); gap: 0; border-top: 1px solid var(--wp--custom--line--light); }
.feature-grid.is-rows .feature-card {
	display: grid;
	grid-template-columns: 5rem minmax(0, 1fr) minmax(0, 1.5fr);
	align-items: baseline;
	gap: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--50) 0;
	border: 0;
	border-bottom: 1px solid var(--wp--custom--line--light);
	border-radius: 0;
	background: none;
}
.feature-grid.is-rows .feature-card__num { margin-bottom: 0 !important; }
.feature-grid.is-rows .feature-card > p:not(.feature-card__num) { font-size: var(--wp--preset--font-size--medium) !important; }

@media (max-width: 1023px) {
	.feature-grid.is-layout-grid:not(.is-rows) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 781px) {
	.feature-grid.is-rows .feature-card { grid-template-columns: 3rem minmax(0, 1fr); gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30); }
	.feature-grid.is-rows .feature-card > p:not(.feature-card__num) { grid-column: 2; }
}
@media (max-width: 599px) {
	.feature-grid.is-layout-grid:not(.is-rows) { grid-template-columns: minmax(0, 1fr); }
}

/* =========================================================================
   3. Heading on the left, running text on the right
   ========================================================================= */
.wp-block-columns.split-text { gap: var(--wp--preset--spacing--50); }
.split-text__head > * { margin-block: 0; }
.split-text__head > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.split-text__head .wp-block-heading { max-width: 12em; line-height: 1.08; letter-spacing: -0.03em; }
.split-text__body > * { margin-block: 0; }
.split-text__body > * + * { margin-block-start: var(--wp--preset--spacing--40); }
.split-text__body > p { max-width: 40em; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--medium); line-height: 1.65; }
.split-text__body > p strong { color: var(--wp--preset--color--ink); font-weight: 500; }
@media (min-width: 782px) {
	.split-text__head { position: sticky; top: calc(var(--wp--custom--header--height) + var(--wp--preset--spacing--50)); align-self: flex-start; }
}

/* A white panel over a photo: extra room for lists and buttons in the panel */
.overlap__panel > .wp-block-list,
.overlap__panel > .wp-block-buttons { margin-block-start: var(--wp--preset--spacing--40); }
.overlap__panel > p:not(.is-style-eyebrow) { color: var(--wp--preset--color--slate); }

/* =========================================================================
   4. List style "Check list": hairline rows with a small square marker
   ========================================================================= */
.wp-block-list.is-style-checks { margin-block-end: 0; padding: 0; list-style: none; border-top: 1px solid var(--wp--custom--line--light); }
.is-style-checks li {
	position: relative;
	padding: 0.75em 0 0.75em 1.5em;
	border-bottom: 1px solid var(--wp--custom--line--light);
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.5;
}
.is-style-checks li::before {
	content: "";
	position: absolute;
	top: 1.3em;
	left: 0.1em;
	width: 0.4em;
	height: 0.4em;
	background-color: var(--wp--preset--color--navy);
}
.is-style-checks li strong { font-weight: 500; }

/* =========================================================================
   5. Table style "Specifications"
   ========================================================================= */
.spec-table-wrap > * { margin-block: 0; }
.spec-table-wrap > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.wp-block-table.is-style-spec-table { overflow-x: auto; }
.wp-block-table.is-style-spec-table table { width: 100%; table-layout: auto; border-collapse: collapse; font-size: var(--wp--preset--font-size--small); }
.wp-block-table.is-style-spec-table th,
.wp-block-table.is-style-spec-table td {
	padding: 0.8em 1.25em 0.8em 0;
	border: 0;
	border-bottom: 1px solid var(--wp--custom--line--light);
	text-align: left;
	vertical-align: baseline;
}
.wp-block-table.is-style-spec-table thead { border-bottom: 0; }
.wp-block-table.is-style-spec-table thead th {
	border-bottom: 1px solid var(--wp--preset--color--navy);
	color: var(--wp--preset--color--navy);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.wp-block-table.is-style-spec-table td:first-child { width: 40%; color: var(--wp--preset--color--slate); }
.wp-block-table.is-style-spec-table td:not(:first-child) { color: var(--wp--preset--color--ink); font-family: var(--wp--preset--font-family--mono); font-size: 0.95em; font-variant-numeric: tabular-nums; }
.spec-table__note { color: var(--wp--preset--color--slate); }

/* =========================================================================
   6. Team
   ========================================================================= */
.team-grid.is-layout-grid { gap: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40); }
.team-card > * { margin-block: 0; }
.team-card .team-card__photo { margin-bottom: var(--wp--preset--spacing--30); }
.team-card .team-card__photo img { width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 30%; border-radius: var(--wp--custom--radius--medium); }
.team-card .wp-block-heading { letter-spacing: -0.01em; }
.team-card__role {
	margin-top: 0.3em !important;
	color: var(--wp--preset--color--slate);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
@media (max-width: 781px) {
	.team-grid.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30); }
}
/* Advisors and associated scientists: the same cards as the team, in a smaller row of their own
   with its own label, so they read as part of the team but from outside. A placeholder shows initials. */
.is-layout-constrained > .team-external__head { margin-block-start: var(--wp--preset--spacing--70); }
.team-grid--external.is-layout-grid { gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30); margin-block-start: var(--wp--preset--spacing--40); }
@media (min-width: 1100px) { .team-grid--external.is-layout-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.team-card__placeholder { display: grid; place-items: center; aspect-ratio: 1; margin-bottom: var(--wp--preset--spacing--30); border-radius: var(--wp--custom--radius--medium); background: color-mix(in srgb, var(--wp--preset--color--ice) 55%, var(--wp--preset--color--white)) url('../svg/contours-light.svg') center / cover no-repeat; }
.team-card__placeholder .team-card__initials { margin: 0; color: color-mix(in srgb, var(--wp--preset--color--navy) 45%, var(--wp--preset--color--ice)); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--xx-large); letter-spacing: 0.02em; }
@media (max-width: 1099px) and (min-width: 782px) { .team-grid--external.is-layout-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* =========================================================================
   7. Contact cards
   ========================================================================= */
.contact-grid.is-layout-grid { gap: var(--wp--preset--spacing--30); }
.contact-card {
	padding: var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--custom--line--light);
	border-radius: var(--wp--custom--radius--medium);
	background-color: var(--wp--preset--color--paper);
}
.contact-card > * { margin-block: 0; }
.contact-card__value { margin-top: var(--wp--preset--spacing--30) !important; color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--display); line-height: 1.4; overflow-wrap: break-word; }
.contact-card__value a { color: inherit; text-decoration: none; background-image: linear-gradient(currentColor, currentColor); background-position: 0 100%; background-repeat: no-repeat; background-size: 100% 1px; }
.contact-card__value a:hover { background-size: 0 1px; }
@media (max-width: 1023px) {
	.contact-grid.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
	.contact-grid.is-layout-grid { grid-template-columns: minmax(0, 1fr); }
}

/* =========================================================================
   8. Post lists: rows with date and title ("is-style-news-list")
   ========================================================================= */
.wp-block-post-template.is-style-news-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--wp--custom--line--light); }
.wp-block-post-template.is-style-news-list > li {
	display: grid;
	grid-template-columns: 8rem minmax(0, 1fr);
	align-items: baseline;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: var(--wp--preset--spacing--40) 0;
	border-bottom: 1px solid var(--wp--custom--line--light);
}
.is-style-news-list .wp-block-post-date { font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.06em; }
.is-style-news-list .wp-block-post-title { margin: 0; line-height: 1.3; }
.is-style-news-list .wp-block-post-title a::after { content: " →"; color: var(--wp--preset--color--navy); }
@media (max-width: 599px) {
	.wp-block-post-template.is-style-news-list > li { grid-template-columns: minmax(0, 1fr); gap: var(--wp--preset--spacing--20); }
}
.wp-block-query-no-results p { color: var(--wp--preset--color--slate); }

/* =========================================================================
   9. Milestones: a longer timeline wraps onto a second row
   ========================================================================= */
@media (min-width: 1024px) {
	.timeline-wrap.is-long .wp-block-list.is-style-timeline { row-gap: var(--wp--preset--spacing--50); border-top: 0; }
	.timeline-wrap.is-long .is-style-timeline li { border-top: 1px solid var(--line-strong); }
}

/* =========================================================================
   10. News index and archives: heading with category chips
   ========================================================================= */
.news-head > * { margin-block: 0; }
.news-head > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.page-body.is-layout-constrained > .news-head + .wp-block-query { margin-block-start: var(--wp--preset--spacing--60); }
.news-head .is-style-eyebrow a { color: inherit; text-decoration: none; }
.wp-block-categories.is-style-filter-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-block-start: var(--wp--preset--spacing--40) !important; padding: 0; list-style: none; }
.wp-block-categories.is-style-filter-chips li { margin: 0; }
.wp-block-categories.is-style-filter-chips a {
	display: inline-block;
	padding: 0.5em 1.1em;
	border: 1px solid var(--wp--custom--line--light);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--preset--color--navy);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.06em;
	text-decoration: none;
	text-transform: uppercase;
}
.wp-block-categories.is-style-filter-chips a:hover { border-color: var(--wp--preset--color--navy); }
.wp-block-categories.is-style-filter-chips .current-cat a { border-color: var(--wp--preset--color--navy); background-color: var(--wp--preset--color--navy); color: var(--wp--preset--color--white); }

/* =========================================================================
   11. News posts: the text of imported and new posts
   ========================================================================= */
.single .wp-block-post-content > p,
.single .wp-block-post-content > .wp-block-list { color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--medium); line-height: 1.7; }
.single .wp-block-post-content > .wp-block-heading { margin-block-start: var(--wp--preset--spacing--50); line-height: 1.2; letter-spacing: -0.02em; }
.single .wp-block-post-content > h2.wp-block-heading { font-size: var(--wp--preset--font-size--x-large); }
.single .wp-block-post-content > h3.wp-block-heading { font-size: var(--wp--preset--font-size--large); }
.single .wp-block-post-content :where(.wp-block-image, .wp-block-gallery, .wp-block-embed) { margin-block: var(--wp--preset--spacing--50); }
.single .wp-block-post-content .wp-block-image img { height: auto; border-radius: var(--wp--custom--radius--medium); }
.single .wp-block-post-content .wp-element-caption,
.single .wp-block-post-content .image-credit { color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--x-small); }
.single .wp-block-post-content .wp-block-quote { margin-inline: 0; padding-left: var(--wp--preset--spacing--40); border-left: 2px solid var(--wp--preset--color--navy); }
.single .wp-block-post-content .wp-block-quote p { color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--medium); line-height: 1.6; }
.single .wp-block-post-content .wp-block-quote cite { display: block; margin-top: var(--wp--preset--spacing--30); color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); font-style: normal; }
.single .wp-block-post-content .wp-block-embed iframe { border-radius: var(--wp--custom--radius--medium); }
.single .wp-block-post-content a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--navy); text-decoration-thickness: 1px; text-underline-offset: 0.2em; }

/* =========================================================================
   12. Text pages and news posts: the title lines up with the text column
   ========================================================================= */
.page-body.is-layout-constrained > .wp-block-post-title { max-width: var(--wp--style--global--content-size); line-height: 1.1; letter-spacing: -0.03em; }
/* the text keeps its column, but a wide block in it (the privacy policy's table) may use the wide width */
.page-body.is-layout-constrained > .wp-block-post-content { max-width: var(--wp--style--global--wide-size); }

/* =========================================================================
   13. Long words and addresses never make a phone screen scroll sideways
   ========================================================================= */
.wp-block-post-content :where(p, li, figcaption, td, th, cite) { overflow-wrap: break-word; }
@media (max-width: 600px) {
	/* long labels, e.g. "Applications / Scientific instrumentation", wrap instead */
	.chapter-mark .is-style-eyebrow { min-width: 0; white-space: normal; }
}

/* =========================================================================
   14. The design canvas: Home, About, News, Careers
   ========================================================================= */

/* Waves ("has-waves"): the contour lines, only where there is little to read, never behind
   paragraphs. On a section (a header with just a title) they fill it. On a group of cards, a photo
   or a testimonial inside a section they lie in a soft band behind it, out to the screen edges, so
   the section's heading and text stay on a plain background; inside a column, in a patch around it. */
.has-waves:where(.is-style-section-white, .is-style-section-paper, .is-style-section-ice) { background-image: url('../svg/contours-light.svg'); background-position: center; background-size: cover; }
.has-waves:where(.is-style-section-deep, .is-style-section-night, .is-style-section-brand) { background-image: url('../svg/contours-dark.svg'); background-position: center; background-size: cover; }
:where(.is-style-section-white, .is-style-section-paper, .is-style-section-ice, .is-style-section-deep, .is-style-section-night, .is-style-section-brand):has(.has-waves) { isolation: isolate; overflow-x: clip; }
:where(.is-style-section-white, .is-style-section-paper, .is-style-section-ice, .is-style-section-deep, .is-style-section-night, .is-style-section-brand) .has-waves { position: relative; }
:where(.is-style-section-white, .is-style-section-paper, .is-style-section-ice, .is-style-section-deep, .is-style-section-night, .is-style-section-brand) .has-waves::before {
	content: '';
	position: absolute;
	z-index: -1;
	inset: calc(-1 * var(--wp--preset--spacing--60)) calc(50% - 50vw);
	background: url('../svg/contours-light.svg') center / cover no-repeat;
	pointer-events: none;
	-webkit-mask-image: linear-gradient(to bottom, transparent, #000 var(--wp--preset--spacing--70), #000 calc(100% - var(--wp--preset--spacing--70)), transparent);
	mask-image: linear-gradient(to bottom, transparent, #000 var(--wp--preset--spacing--70), #000 calc(100% - var(--wp--preset--spacing--70)), transparent);
}
:where(.is-style-section-deep, .is-style-section-night, .is-style-section-brand) .has-waves::before { background-image: url('../svg/contours-dark.svg'); }
/* in a column: a halo around the group, full strength at its edge, fading out over the gap */
:where(.wp-block-column) > .has-waves::before {
	--halo: var(--wp--preset--spacing--60);
	inset: calc(-1 * var(--halo));
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--halo), #000 calc(100% - var(--halo)), transparent), linear-gradient(180deg, transparent, #000 var(--halo), #000 calc(100% - var(--halo)), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 var(--halo), #000 calc(100% - var(--halo)), transparent), linear-gradient(180deg, transparent, #000 var(--halo), #000 calc(100% - var(--halo)), transparent);
	-webkit-mask-composite: source-in;
	mask-composite: intersect;
}
/* stacked columns on phones: the halo starts at the group's top, clear of the text above it */
@media (max-width: 781px) { :where(.wp-block-column) > .has-waves::before { top: 0; } }
/* "waves-aside" on a section heading: the waves in the empty space beside a short heading, on
   wide screens only (below that the heading takes the full width) */
.section-head.has-waves.waves-aside::before {
	inset: calc(-1 * var(--wp--preset--spacing--40)) calc(50% - 50vw) calc(-1 * var(--wp--preset--spacing--40)) 58%;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 30%), linear-gradient(180deg, transparent, #000 25%, #000 70%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 30%), linear-gradient(180deg, transparent, #000 25%, #000 70%, transparent);
	-webkit-mask-composite: source-in;
	mask-composite: intersect;
}
@media (max-width: 1023px) { .section-head.has-waves.waves-aside::before { content: none; } }

/* Navy sections: the page's text components in their dark colours */
:where(.is-style-section-deep, .is-style-section-night) .split-text__body > p,
:where(.is-style-section-deep, .is-style-section-night) .section-head__intro { color: var(--wp--preset--color--mist); }
:where(.is-style-section-deep, .is-style-section-night) .split-text__body > p strong { color: var(--wp--preset--color--white); }
:where(.is-style-section-deep, .is-style-section-night) .wp-block-list.is-style-checks,
:where(.is-style-section-deep, .is-style-section-night) .is-style-checks li { border-color: var(--wp--custom--line--dark); color: var(--wp--preset--color--frost); }
:where(.is-style-section-deep, .is-style-section-night) .is-style-checks li::before { background-color: var(--wp--preset--color--frost); }

/* Key specifications (innoseis/stats): the comparison cards, each with a datasheet number */
.is-style-comparison.spec-cards > .wp-block-column .stat__value { color: var(--wp--preset--color--navy); }
.is-style-comparison.spec-cards > .wp-block-column .stat__label { color: var(--wp--preset--color--slate); }
.spec-cards .compare__glyph { margin-bottom: var(--wp--preset--spacing--30); }
.spec-cards > .wp-block-column > .stat__label + p { margin-top: var(--wp--preset--spacing--20); }
/* labels take two lines everywhere in a row, so the explanations start at one height */
@media (min-width: 782px) { .spec-cards .stat__label { min-height: 3em; } }
/* the waves end just below the cards, clear of the datasheet link */
.spec-cards.has-waves::before { bottom: calc(-1 * var(--wp--preset--spacing--30)); }
/* two cards per row until there is room for four, so the numbers never crowd */
@media (min-width: 782px) and (max-width: 1180px) {
	.wp-block-columns.spec-cards { flex-wrap: wrap !important; }
	.wp-block-columns.spec-cards > .wp-block-column { flex-basis: calc(50% - var(--wp--preset--spacing--30) / 2) !important; flex-grow: 0; }
}

/* Figures: a big number or word with one line of explanation */
.figures.is-layout-grid { gap: var(--wp--preset--spacing--40); }
@media (max-width: 1023px) { .figures.is-layout-grid.is-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 781px) { .figures.is-layout-grid.is-cols-3 { grid-template-columns: minmax(0, 1fr); } }
.figure > * { margin-block: 0; }
.figure { padding-top: var(--wp--preset--spacing--30); border-top: 1px solid var(--wp--custom--line--light); }
.figure__value { color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--display); font-weight: 300; line-height: 1; letter-spacing: -0.02em; }
.figure__label { margin-top: var(--wp--preset--spacing--30) !important; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
:where(.is-style-section-deep, .is-style-section-night) .figure { border-top-color: var(--line-strong); }
:where(.is-style-section-deep, .is-style-section-night) .figure__value { color: var(--wp--preset--color--white); }
:where(.is-style-section-deep, .is-style-section-night) .figure__label { color: var(--wp--preset--color--mist); }

/* Quote cards with a photo: a colleague's or a client's own words */
:where(.is-style-section-white) .wp-block-quote.is-style-quote-card { background-color: var(--wp--preset--color--paper); }
.story-card { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--wp--custom--radius--large); background-color: var(--wp--preset--color--white); box-shadow: var(--wp--preset--shadow--soft); }
.story-card > * { margin-block: 0; }
/* the 4:5 portraits in a 6:5 frame, from just above the hair to below the chin */
.story-card .story-card__photo img { width: 100%; aspect-ratio: 6 / 5; object-fit: cover; object-position: 50% 45%; }
/* "is-photo-top": a photo whose face sits at the top edge keeps its top in view */
.story-card.is-photo-top .story-card__photo img { object-position: 50% 0; }
.story-card .wp-block-quote.is-style-quote-card { flex: 1; margin: 0; border-radius: 0; box-shadow: none; background: none; }
.story-card.is-wide { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
.story-card.is-wide .story-card__photo { position: relative; min-height: 16rem; }
.story-card.is-wide .story-card__photo img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
.story-card.is-wide .wp-block-quote.is-style-quote-card { display: flex; flex-direction: column; justify-content: center; padding: var(--wp--preset--spacing--60); }
.story-card.is-wide .wp-block-quote.is-style-quote-card p { font-size: var(--wp--preset--font-size--large); line-height: 1.45; }
@media (max-width: 781px) { .story-card.is-wide { grid-template-columns: minmax(0, 1fr); } .story-card.is-wide .story-card__photo img { aspect-ratio: 16 / 9; } }

/* Applications: three sectors, made into tabs by theme.js (stacked without it and in the editor) */
.app-tabs > * { margin-block: 0; }
.app-tab { scroll-margin-top: calc(var(--wp--custom--header--height) + var(--wp--preset--spacing--50)); }
.app-tab + .app-tab { margin-top: var(--wp--preset--spacing--70); padding-top: var(--wp--preset--spacing--60); border-top: 1px solid var(--wp--custom--line--light); }
.app-tab__label { margin-bottom: var(--wp--preset--spacing--40) !important; color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.1em; text-transform: uppercase; }
.app-tabs.is-tabbed .app-tab + .app-tab { margin-top: 0; padding-top: 0; border-top: 0; }
.app-tabs.is-tabbed .app-tab:not(.is-active) { display: none; }
.app-tabs.is-tabbed .app-tab__label { display: none; }
.app-tabs__list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: var(--wp--preset--spacing--50); }
.app-tabs__tab {
	padding: 0.8em 1.3em;
	border: 1px solid var(--wp--custom--line--light);
	border-radius: var(--wp--custom--radius--pill);
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--slate);
	font: 500 var(--wp--preset--font-size--small) / 1.2 var(--wp--preset--font-family--body);
	cursor: pointer;
}
.app-tabs__tab:hover { border-color: var(--wp--preset--color--navy); color: var(--wp--preset--color--navy); }
.app-tabs__tab[aria-selected="true"] { border-color: var(--wp--preset--color--navy); background-color: var(--wp--preset--color--navy); color: var(--wp--preset--color--white); }
.app-tabs__tab:focus-visible { outline: 2px solid var(--wp--preset--color--navy); outline-offset: 2px; }
.wp-block-columns.app-tab__cols { gap: var(--wp--preset--spacing--60); }
.app-tab__text > * { margin-block: 0; }
.app-tab__text > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.app-tab__text .wp-block-heading { line-height: 1.1; letter-spacing: -0.025em; }
.app-tab__body { color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--medium); line-height: 1.6; }
.wp-block-list.app-tab__uses { margin-block-start: var(--wp--preset--spacing--40) !important; padding: 0; list-style: none; border-top: 1px solid var(--wp--custom--line--light); }
.app-tab__uses li { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: 0 var(--wp--preset--spacing--20); padding: 0.8em 0; border-bottom: 1px solid var(--wp--custom--line--light); color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); line-height: 1.5; }
.app-tab__uses li strong:first-child { grid-row: span 2; color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); font-weight: 500; line-height: 2; }
.app-tab__uses li strong:nth-child(2) { display: block; color: var(--wp--preset--color--ink); font-weight: 500; }
.app-tab__why { margin-block-start: var(--wp--preset--spacing--40) !important; padding: var(--wp--preset--spacing--40); border-radius: var(--wp--custom--radius--medium); background-color: var(--wp--preset--color--ice); }
.app-tab__why > * { margin-block: 0; }
.app-tab__why > * + * { margin-block-start: var(--wp--preset--spacing--20); }
.app-tab__why p:not(.is-style-eyebrow) { color: var(--wp--preset--color--ink); }
.app-tab__text > .wp-block-buttons { margin-block-start: var(--wp--preset--spacing--40); }
.app-tab__media > * { margin-block: 0; }
.app-tab__media .wp-block-image img { aspect-ratio: 4 / 5; }
.app-tab__contact { margin-top: var(--wp--preset--spacing--30) !important; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); }

/* Life at Innoseis: text beside a photo mosaic and a quote */
.wp-block-columns.life { gap: var(--wp--preset--spacing--60); }
.life__text > * { margin-block: 0; }
.life__text > * + * { margin-block-start: var(--wp--preset--spacing--40); }
.life__text > p:not(.is-style-eyebrow) { color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--medium); line-height: 1.6; }
.life__media > * { margin-block: 0; }
.life__media > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.photo-mosaic { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30); aspect-ratio: 16 / 10; }
.photo-mosaic > * { min-height: 0; margin: 0 !important; }
.photo-mosaic > :first-child { grid-row: 1 / span 2; }
.photo-mosaic .wp-block-image,
.photo-mosaic .wp-block-image img { width: 100%; height: 100%; }
.photo-mosaic .wp-block-image img { aspect-ratio: auto; object-fit: cover; }

/* Contact: the invitation and details beside the form, on navy */
.wp-block-columns.contact { gap: var(--wp--preset--spacing--60); }
.contact__text > * { margin-block: 0; }
.contact__text > * + * { margin-block-start: var(--wp--preset--spacing--40); }
.contact__intro { max-width: 30em; color: var(--wp--preset--color--mist); font-size: var(--wp--preset--font-size--medium); line-height: 1.6; }
.wp-block-list.contact__details { padding: 0; list-style: none; border-top: 1px solid var(--wp--custom--line--dark); }
.contact__details li { padding: 0.75em 0; border-bottom: 1px solid var(--wp--custom--line--dark); color: var(--wp--preset--color--frost); font-size: var(--wp--preset--font-size--small); }

/* The forms (inc/forms.php): light by default, dark on navy */
.innoseis-form { display: grid; gap: var(--wp--preset--spacing--30); }
.innoseis-form > * { margin: 0; }
.innoseis-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30); }
.innoseis-form__field { display: grid; gap: 0.4rem; margin: 0; }
.innoseis-form label { color: var(--wp--preset--color--slate); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; }
.innoseis-form :is(input, select, textarea) {
	width: 100%;
	box-sizing: border-box;
	padding: 0.8em 0.9em;
	border: 1px solid var(--wp--custom--line--light);
	border-radius: var(--wp--custom--radius--small);
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
}
.innoseis-form textarea { resize: vertical; }
.innoseis-form :is(input, select, textarea):focus { outline: 2px solid var(--wp--preset--color--navy); outline-offset: 1px; }
.innoseis-form__note { color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--x-small); }
.innoseis-form__submit { margin: 0; }
.innoseis-form__submit .wp-block-button__link { cursor: pointer; }
.innoseis-form__notice { padding: 0.8em 1em; border-radius: var(--wp--custom--radius--small); font-size: var(--wp--preset--font-size--small); }
.innoseis-form__notice.is-sent { background-color: color-mix(in srgb, var(--wp--preset--color--ice) 80%, transparent); color: var(--wp--preset--color--navy); }
.innoseis-form__notice.is-error { background-color: color-mix(in srgb, var(--wp--preset--color--signal) 14%, transparent); color: var(--wp--preset--color--signal-deep); }
.innoseis-form__trap { position: absolute !important; left: -9999px; }
.innoseis-form--newsletter,
.innoseis-form--job-alerts { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.innoseis-form--newsletter > :not(.innoseis-form__field):not(.innoseis-form__submit),
.innoseis-form--job-alerts > :not(.innoseis-form__field):not(.innoseis-form__submit) { grid-column: 1 / -1; }
/* On navy a form sits on its own card: a slightly lighter navy, so the waves can lie around it and
   never behind a label */
:where(.is-style-section-deep, .is-style-section-night) { --card-on-navy: color-mix(in srgb, var(--wp--preset--color--navy-800) 45%, var(--wp--preset--color--navy-900)); }
:where(.is-style-section-deep, .is-style-section-night) .innoseis-form { padding: var(--wp--preset--spacing--40); border: 1px solid var(--line-strong); border-radius: var(--wp--custom--radius--large); background-color: var(--card-on-navy); }
:where(.is-style-section-deep, .is-style-section-night) .innoseis-form label,
:where(.is-style-section-deep, .is-style-section-night) .innoseis-form__note { color: var(--wp--preset--color--mist); }
:where(.is-style-section-deep, .is-style-section-night) .innoseis-form :is(input, select, textarea) { border-color: var(--line-strong); background-color: color-mix(in srgb, var(--wp--preset--color--navy-950) 70%, transparent); color: var(--wp--preset--color--white); }
:where(.is-style-section-deep, .is-style-section-night) .innoseis-form :is(input, select, textarea):focus { outline-color: var(--wp--preset--color--frost); }
:where(.is-style-section-deep, .is-style-section-night) .innoseis-form__notice.is-sent { background-color: color-mix(in srgb, var(--wp--preset--color--frost) 16%, transparent); color: var(--wp--preset--color--white); }
@media (max-width: 599px) {
	.innoseis-form__row,
	.innoseis-form--newsletter,
	.innoseis-form--job-alerts { grid-template-columns: minmax(0, 1fr); }
}

/* Text in columns under small labels (About: our story) */
.text-cols.is-layout-grid { gap: var(--wp--preset--spacing--50); }
.text-col > * { margin-block: 0; }
.text-col > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.text-col__body { color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--medium); line-height: 1.65; }
.is-style-section-white.is-layout-constrained > .text-cols + .statement__mission { margin-block-start: var(--wp--preset--spacing--70); padding-top: var(--wp--preset--spacing--60); border-top: 1px solid var(--wp--custom--line--light); }

/* Founders */
.founders.is-layout-grid { gap: var(--wp--preset--spacing--40); }
.founder-card { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--wp--preset--spacing--40); padding: var(--wp--preset--spacing--40); border: 1px solid var(--wp--custom--line--light); border-radius: var(--wp--custom--radius--large); background-color: var(--wp--preset--color--white); }
.founder-card > * { margin: 0 !important; }
.founder-card__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 25%; border-radius: var(--wp--custom--radius--medium); }
.founder-card__body { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--20); }
.founder-card__body > * { margin: 0; }
.founder-card__role { color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; }
.founder-card__body > p:not([class]) { color: var(--wp--preset--color--slate); line-height: 1.6; }
.founder-card__link { margin-top: auto !important; font-weight: 500; }
.founder-card__link a { text-decoration: none; }
@media (max-width: 1023px) { .founders.is-layout-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 599px) { .founder-card { grid-template-columns: minmax(0, 1fr); } }

/* Team: the invitation card at the end of the grid */
.team-card.is-invite { display: flex; flex-direction: column; justify-content: flex-end; gap: var(--wp--preset--spacing--20); min-height: 16rem; padding: var(--wp--preset--spacing--40); border: 1px dashed color-mix(in srgb, var(--wp--preset--color--navy) 40%, transparent); border-radius: var(--wp--custom--radius--medium); }
.team-card.is-invite > * { margin: 0 !important; }

/* Partners and investors: names as tiles */
.name-wall.is-layout-grid { gap: var(--wp--preset--spacing--30); }
.name-tile { display: flex; align-items: center; justify-content: center; min-height: 6.5rem; margin: 0 !important; padding: var(--wp--preset--spacing--30); border: 1px solid var(--wp--custom--line--light); border-radius: var(--wp--custom--radius--medium); color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--medium); line-height: 1.3; text-align: center; }
.name-tile { background-color: var(--wp--preset--color--white); }
/* a logo tile: the logo at one height (wide logos at most 80% of the tile), an optional caption */
.name-tile.is-logo { flex-direction: column; gap: var(--wp--preset--spacing--20); }
.name-tile.is-logo img { width: auto; max-width: 80%; height: 2.25rem; object-fit: contain; }
.name-tile.is-logo.is-tall img { height: 4rem; }
/* "is-large": an upright logo with lettering of its own (the EU's Seal of Excellence), a little taller than "is-tall" */
.name-tile.is-logo.is-large img { height: 6.5rem; }
.name-tile.is-logo .wp-element-caption { margin: 0; color: var(--wp--preset--color--mist); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.06em; text-align: center; }
:where(.is-style-section-deep, .is-style-section-night) .name-tile { border-color: var(--line-strong); background-color: color-mix(in srgb, var(--wp--preset--color--navy-950) 40%, var(--wp--preset--color--navy-900)); color: var(--wp--preset--color--frost); }
.wp-block-columns.partners { gap: var(--wp--preset--spacing--60); }
.partners > .wp-block-column > * { margin-block: 0; }
.partners > .wp-block-column > * + * { margin-block-start: var(--wp--preset--spacing--40); }
.partners p:not(.is-style-eyebrow):not(.name-tile) { color: var(--wp--preset--color--mist); font-size: var(--wp--preset--font-size--medium); line-height: 1.6; }
@media (max-width: 599px) { .name-wall.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* News: meta line (category · date), cards and the featured article */
.post-meta { gap: 0.6em; color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; }
.post-meta > * { margin: 0; }
.post-meta > * + *::before { content: "·"; margin-right: 0.6em; }
.post-meta .wp-block-post-terms a { color: inherit; text-decoration: none; }
.post-meta .wp-block-post-date { color: inherit; }

.wp-block-post-template.is-style-news-cards.is-layout-grid { gap: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.is-style-news-cards > li { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--20); margin: 0; }
.is-style-news-cards > li > * { margin: 0; }
.is-style-news-cards .wp-block-post-featured-image { margin-bottom: var(--wp--preset--spacing--20); overflow: hidden; border-radius: var(--wp--custom--radius--medium); background-color: var(--wp--preset--color--ice); }
.is-style-news-cards .wp-block-post-featured-image img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform var(--wp--custom--motion--duration) var(--wp--custom--motion--ease); }
.is-style-news-cards > li:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.is-style-news-cards .wp-block-post-title { line-height: 1.25; letter-spacing: -0.01em; }
.is-style-news-cards .wp-block-post-title a { color: var(--wp--preset--color--ink); text-decoration: none; }
.wp-block-post-excerpt { margin: 0; }
.wp-block-post-excerpt__excerpt { margin: 0; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
.wp-block-post-excerpt__more-text { display: none; }
@media (max-width: 1023px) { .wp-block-post-template.is-style-news-cards.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .wp-block-post-template.is-style-news-cards.is-layout-grid { grid-template-columns: minmax(0, 1fr); } }
.is-layout-constrained > .filter-chips + .wp-block-query { margin-block-start: var(--wp--preset--spacing--50); }

.wp-block-post-template.is-style-news-featured { margin: 0; padding: 0; list-style: none; }
.featured-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); overflow: hidden; border-radius: var(--wp--custom--radius--large); background-color: var(--wp--preset--color--navy-900); color: var(--wp--preset--color--frost); box-shadow: var(--wp--preset--shadow--panel); }
.featured-card > * { margin: 0 !important; }
/* compact: the photo is as tall as the text beside it, at least 14rem and at most 20rem */
.featured-card .wp-block-post-featured-image { max-height: 20rem; }
.featured-card .wp-block-post-featured-image a { display: block; height: 100%; }
.featured-card .wp-block-post-featured-image img { width: 100%; height: 100%; min-height: 14rem; object-fit: cover; }
.featured-card__body { display: flex; flex-direction: column; justify-content: center; gap: var(--wp--preset--spacing--20); padding: var(--wp--preset--spacing--50); }
.featured-card__body > * { margin: 0; }
.featured-card .post-meta { color: var(--wp--preset--color--frost); }
.featured-card .wp-block-post-title { line-height: 1.15; letter-spacing: -0.02em; }
.featured-card .wp-block-post-title a { color: var(--wp--preset--color--white); text-decoration: none; }
.featured-card .wp-block-post-excerpt__excerpt { color: var(--wp--preset--color--mist); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
.featured-card .wp-block-read-more { align-self: flex-start; color: var(--wp--preset--color--white); font-weight: 500; text-decoration: none; border-bottom: 1px solid var(--line-strong); }
.featured-card .wp-block-read-more:hover { border-bottom-color: currentColor; }
@media (max-width: 781px) { .featured-card { grid-template-columns: minmax(0, 1fr); } .featured-card .wp-block-post-featured-image img { min-height: 0; aspect-ratio: 16 / 9; } .featured-card__body { padding: var(--wp--preset--spacing--40); } }

/* The category filter (Buttons "filter-chips"; inc/news.php marks the current one) */
.wp-block-buttons.filter-chips { gap: 0.5rem; }
.filter-chips .wp-block-button__link {
	padding: 0.6em 1.2em;
	border: 1px solid var(--wp--custom--line--light);
	border-radius: var(--wp--custom--radius--pill);
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
}
.filter-chips .wp-block-button__link:hover { border-color: var(--wp--preset--color--navy); background-color: var(--wp--preset--color--white); color: var(--wp--preset--color--navy); }
.filter-chips .wp-block-button__link.is-current { border-color: var(--wp--preset--color--navy); background-color: var(--wp--preset--color--navy); color: var(--wp--preset--color--white); }

/* Newsletter and press, on navy */
.wp-block-columns.newsletter { gap: var(--wp--preset--spacing--60); }
.newsletter > .wp-block-column > * { margin-block: 0; }
.newsletter > .wp-block-column > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.newsletter p:not([class*="innoseis-form"]) { color: var(--wp--preset--color--mist); }
.press-card { padding: var(--wp--preset--spacing--40); border: 1px solid var(--line-strong); border-radius: var(--wp--custom--radius--medium); background-color: var(--card-on-navy); }
.press-card > * { margin-block: 0; }
.press-card > * + * { margin-block-start: var(--wp--preset--spacing--20); }
.press-card p:not(.is-style-eyebrow) { color: var(--wp--preset--color--frost); }

/* Careers: stories grid and the job alerts band */
.stories.is-layout-grid { gap: var(--wp--preset--spacing--40); align-items: start; }
.stories > .wp-block-quote.is-style-quote-card { margin: 0; }
.wp-block-columns.alerts { gap: var(--wp--preset--spacing--60); }
.alerts > .wp-block-column > * { margin-block: 0; }
.alerts > .wp-block-column > * + * { margin-block-start: var(--wp--preset--spacing--20); }
.alerts p:not([class*="innoseis-form"]) { color: var(--wp--preset--color--mist); }
@media (max-width: 1023px) { .stories.is-layout-grid { grid-template-columns: minmax(0, 1fr); } }

/* Articles: a header on paper with the waves, the text on white, related articles below */
.article-head.is-style-section-paper { padding-top: calc(var(--wp--custom--header--height) + var(--wp--preset--spacing--70)); padding-bottom: var(--wp--preset--spacing--60); }
.article-head.is-layout-constrained > * + * { margin-block-start: var(--wp--preset--spacing--40); }
.article-crumbs { gap: 0.5em; }
.article-crumbs > * { margin: 0; }
.article-crumbs a { color: inherit; text-decoration: none; }
.article-crumbs a:hover { text-decoration: underline; text-underline-offset: 0.25em; }
.article-crumbs .wp-block-post-date::before { content: "·"; margin-right: 0.5em; }
.article-head > .wp-block-post-title { line-height: 1.08; letter-spacing: -0.03em; }
.article-head.is-layout-constrained > .wp-block-post-featured-image { margin-block-start: var(--wp--preset--spacing--50); overflow: hidden; border-radius: var(--wp--custom--radius--medium); }
/* the featured image shows whole (portraits of people too), in a fixed frame; WordPress writes object-fit inline */
/* a photo that doesn't fill the frame has the waves beside it, on the page's own paper */
.article-head > .wp-block-post-featured-image { background: url('../svg/contours-light.svg') center / cover no-repeat; }
.article-head > .wp-block-post-featured-image img { aspect-ratio: 16 / 9; object-fit: contain !important; }
.article-body.is-style-section-white { padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70); }
.article-body.is-layout-constrained > .wp-block-buttons { margin-block-start: var(--wp--preset--spacing--60); }
.article-related.is-layout-constrained > .section-label + .wp-block-query { margin-block-start: var(--wp--preset--spacing--50); }

/* "All Graviton specifications": a fold-out under the product cards */
.is-layout-constrained > .wp-block-details.spec-details { max-width: var(--wp--style--global--wide-size); margin-block-start: var(--wp--preset--spacing--40); border-top: 1px solid var(--wp--custom--line--light); border-bottom: 1px solid var(--wp--custom--line--light); }
.spec-details > summary { display: flex; align-items: center; justify-content: space-between; padding: 1.1em 0; color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--large); cursor: pointer; list-style: none; }
.spec-details > summary::-webkit-details-marker { display: none; }
.spec-details > summary::after { content: "+"; font-family: var(--wp--preset--font-family--mono); font-size: 1.2em; transition: transform 0.2s ease; }
.spec-details[open] > summary::after { transform: rotate(45deg); }
.spec-details > .wp-block-table { margin-block: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20); }
.spec-details > .spec-table__note { margin-block-end: var(--wp--preset--spacing--40); }

/* =========================================================================
   15. Technology, Products, Applications and the short homepage
       (the sections picked from mockups B and C, each scoped to its section)
   ========================================================================= */

/* Two-tone headings: the lighter part on its own line, as in mockup C */
:is(.gap-rows, .application-grid, .proof-strip, .product-lineup) .section-head h2 mark,
.track-record .timeline-intro h2 mark { display: block; }

/* The gap we close (innoseis/comparison): rows, the last one in navy */
.gap-rows .compare { margin-block-start: var(--wp--preset--spacing--60); }
.gap-rows .compare > * { margin-block: 0; }
.gap-rows .compare-row { gap: var(--wp--preset--spacing--50); margin: 0; padding: var(--wp--preset--spacing--40); border-top: 1px solid var(--wp--custom--line--light); }
.gap-rows .compare-row__label { display: flex; align-items: center; gap: var(--wp--preset--spacing--40); }
.gap-rows .compare-row__label > * { margin: 0; }
.gap-rows .compare-row__icon { flex: none; width: 4rem; }
.gap-rows .compare-row__icon img { width: 100%; height: auto; }
.gap-rows .compare-row h3 { color: var(--wp--preset--color--ink); font-weight: 300; }
.gap-rows .compare-row p { margin: 0; max-width: 40rem; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--large); line-height: 1.4; }
.gap-rows .compare-row.is-highlight { position: relative; margin-top: var(--wp--preset--spacing--30); padding-block: var(--wp--preset--spacing--50); border-top: 0; border-radius: var(--wp--custom--radius--large); background-color: var(--wp--preset--color--navy); box-shadow: 0 32px 64px -40px rgba(40, 56, 143, 0.7); }
.gap-rows .compare-row.is-highlight h3 { color: var(--wp--preset--color--white); }
.gap-rows .compare-row.is-highlight h3::after { content: ""; display: inline-block; width: 0.4rem; height: 0.4rem; margin-left: var(--wp--preset--spacing--20); border-radius: 50%; background-color: var(--wp--preset--color--signal-bright); vertical-align: 0.15em; }
.gap-rows .compare-row.is-highlight p { color: var(--wp--preset--color--frost); }
@media (max-width: 781px) {
	.gap-rows .compare-row { gap: var(--wp--preset--spacing--30); padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30); }
	.gap-rows .compare-row__icon { width: 3rem; }
}

/* How it works (innoseis/steps): the introduction stays in view beside three illustrated steps */
.tech-steps .steps__columns { gap: var(--wp--preset--spacing--60); }
/* side by side, the chips below follow the intro column's width; stacked on phones that would make
   the column measure itself at zero width, so there a media query takes over */
@media (min-width: 782px) { .tech-steps .steps__intro { container-type: inline-size; } }
.tech-steps .steps__intro > * { margin-block: 0; }
.tech-steps .steps__intro > * + * { margin-block-start: var(--wp--preset--spacing--40); }
.tech-steps .steps__intro .wp-block-buttons { margin-block-start: var(--wp--preset--spacing--50); }
@media (min-width: 782px) { .tech-steps .steps__intro { position: sticky; top: calc(var(--wp--custom--header--height) + var(--wp--preset--spacing--40)); align-self: flex-start; } }
/* the platform, MEMS core → read-out ASIC → module → application, as linked chips */
.tech-steps .platform-flow { --flow-gap: calc(var(--wp--preset--spacing--30) + 0.25rem); display: flex; flex-wrap: wrap; align-items: center; gap: var(--wp--preset--spacing--20) 0; margin-block-start: var(--wp--preset--spacing--50) !important; padding: 0; list-style: none; }
.tech-steps .platform-flow li { position: relative; display: inline-flex; align-items: center; min-height: 2.25rem; margin: 0; padding: 0 var(--wp--preset--spacing--20); border: 1px solid color-mix(in srgb, var(--wp--preset--color--navy) 30%, transparent); border-radius: var(--wp--custom--radius--small); background: var(--wp--preset--color--paper); color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); white-space: nowrap; }
.tech-steps .platform-flow li + li { margin-left: var(--flow-gap); }
.tech-steps .platform-flow li + li::before { content: ""; position: absolute; top: 50%; left: calc(var(--flow-gap) * -1); width: calc(var(--flow-gap) - 1px); height: 1px; background: var(--wp--preset--color--navy); }
.tech-steps .platform-flow li + li::after { content: ""; position: absolute; top: calc(50% - 0.2rem + 0.5px); left: -0.4rem; width: 0.4rem; height: 0.4rem; border-top: 1px solid var(--wp--preset--color--navy); border-right: 1px solid var(--wp--preset--color--navy); transform: rotate(45deg); }
.tech-steps .platform-flow li:last-child { border-color: var(--wp--preset--color--navy); background: var(--wp--preset--color--ice); font-weight: 500; }
@container (max-width: 27.5rem) {
	.tech-steps .platform-flow { gap: var(--wp--preset--spacing--20); }
	.tech-steps .platform-flow li + li { margin-left: 0; }
	.tech-steps .platform-flow li + li::before,
	.tech-steps .platform-flow li + li::after { content: none; }
}
@media (max-width: 480px) {
	.tech-steps .platform-flow { gap: var(--wp--preset--spacing--20); }
	.tech-steps .platform-flow li + li { margin-left: 0; }
	.tech-steps .platform-flow li + li::before,
	.tech-steps .platform-flow li + li::after { content: none; }
}
.tech-steps .steps__list > * { margin-block: 0; }
.tech-steps .tech-step { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: var(--wp--preset--spacing--50); padding-block: var(--wp--preset--spacing--50); border-top: 1px solid var(--wp--custom--line--light); }
.tech-steps .tech-step:first-child { padding-top: 0; border-top: 0; }
.tech-steps .step__text > * { margin-block: 0; }
.tech-steps .step__text > * + * { margin-block-start: var(--wp--preset--spacing--30); }
.tech-steps .step__text .is-style-index { display: flex; align-items: center; gap: 0.75rem; font-weight: 500; }
.tech-steps .step__text .is-style-index::after { content: ""; width: 2rem; height: 1px; background: currentColor; opacity: 0.4; }
.tech-steps .step__text p:not(.is-style-index) { color: var(--wp--preset--color--slate); }
.tech-steps .step__diagram { display: grid; place-items: center; aspect-ratio: 4 / 3; margin: 0; padding: var(--wp--preset--spacing--40); border-radius: var(--wp--custom--radius--large); background: var(--wp--preset--color--ice); }
.tech-steps .step__diagram .wp-block-image { width: 100%; max-width: 20rem; margin: 0; }
.tech-steps .step__diagram img { width: 100%; height: auto; }
@media (max-width: 1180px) {
	.tech-steps .tech-step { grid-template-columns: minmax(0, 1fr); }
	.tech-steps .step__diagram { aspect-ratio: 16 / 9; }
}

/* Products (innoseis/product-cards): three equal cards, their parts lined up across the row */
.product-lineup .product-grid.is-layout-grid { gap: var(--wp--preset--spacing--30); margin-block-start: var(--wp--preset--spacing--60); }
.product-lineup .product-card { display: flex; flex-direction: column; padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--20) var(--wp--preset--spacing--40); border: 1px solid var(--wp--custom--line--light); border-radius: var(--wp--custom--radius--large); background: var(--wp--preset--color--white); transition: box-shadow calc(var(--wp--custom--motion--duration) * 0.57) var(--wp--custom--motion--ease); }
.product-lineup .product-card:is(:hover, :focus-within) { box-shadow: 0 1px 2px rgba(14, 20, 51, 0.04), 0 18px 40px -24px rgba(14, 20, 51, 0.22); }
.product-lineup .product-card > * { margin-block: 0; }
.product-lineup .product-card > :not(.product-card__media) { margin-inline: var(--wp--preset--spacing--40); }
.product-lineup .product-card__media { aspect-ratio: 4 / 3; padding: var(--wp--preset--spacing--30); overflow: hidden; border-radius: calc(var(--wp--custom--radius--large) - var(--wp--preset--spacing--20)); background: var(--wp--preset--color--ice); }
.product-lineup .product-card__media img { width: 100%; height: 100%; object-fit: cover; border-radius: calc(var(--wp--custom--radius--large) - var(--wp--preset--spacing--30)); }
.product-lineup .product-card__media.is-contained img { padding: var(--wp--preset--spacing--20); border-radius: 0; object-fit: contain; filter: drop-shadow(0 18px 22px rgba(14, 20, 51, 0.22)); }
.product-lineup .product-card .is-style-status-chip { align-self: flex-start; justify-self: start; margin-block-start: var(--wp--preset--spacing--40); border-color: transparent; background-color: var(--wp--preset--color--ice); color: var(--wp--preset--color--navy); }
.product-lineup .product-card .is-style-status-chip::before { border-color: var(--wp--preset--color--navy); }
.product-lineup .product-card .is-style-status-chip.is-live::before { border-color: var(--wp--preset--color--navy); background-color: var(--wp--preset--color--navy); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--navy) 18%, transparent); }
.product-lineup .product-card h3 { margin-block-start: var(--wp--preset--spacing--30); }
.product-lineup .product-card h3 + p { margin-block-start: var(--wp--preset--spacing--30); color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
.product-lineup .spec-list { margin-block-start: var(--wp--preset--spacing--40) !important; padding: 0; list-style: none; }
.product-lineup .spec-list li { position: relative; padding-block: 0.75rem; padding-left: 1.2rem; border-top: 1px solid var(--wp--custom--line--light); color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.45; }
.product-lineup .spec-list li:last-child { border-bottom: 1px solid var(--wp--custom--line--light); }
.product-lineup .spec-list li::before { content: ""; position: absolute; top: calc(0.75rem + 0.725em); left: 0; width: 0.45rem; height: 1px; background: var(--wp--preset--color--navy); }
.product-lineup .product-card__cta { margin-block-start: auto !important; padding-top: var(--wp--preset--spacing--30); }
@media (min-width: 1024px) { .product-lineup .product-card { display: grid; grid-template-rows: subgrid; grid-row: span 6; row-gap: 0; } }
@media (max-width: 1023px) { .product-lineup .product-grid.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 699px) { .product-lineup .product-grid.is-layout-grid { grid-template-columns: minmax(0, 1fr); } }
.product-lineup .spec-details { margin-block-start: var(--wp--preset--spacing--50); }

/* Applications (innoseis/application-tiles): photo tiles with the text on a dark fade */
.application-grid .app-grid.is-layout-grid { gap: var(--wp--preset--spacing--30); margin-block-start: var(--wp--preset--spacing--60); }
.application-grid .app-tile { aspect-ratio: 3 / 4; height: 100%; min-height: 0; margin: 0; padding: var(--wp--preset--spacing--40); align-items: stretch; overflow: hidden; border-radius: var(--wp--custom--radius--large); background-color: var(--wp--preset--color--navy-900); color: var(--wp--preset--color--frost); }
.application-grid .app-tile .wp-block-cover__image-background { transition: transform var(--wp--custom--motion--duration) var(--wp--custom--motion--ease); }
.application-grid .app-tile:is(:hover, :focus-within) .wp-block-cover__image-background { transform: scale(1.04); }
.application-grid .app-tile .wp-block-cover__background { opacity: 1; background-image: linear-gradient(to bottom, rgba(10, 15, 51, 0.3) 0%, rgba(10, 15, 51, 0) 20%), linear-gradient(to top, rgba(10, 15, 51, 0.92) 0%, rgba(10, 15, 51, 0.8) 34%, rgba(10, 15, 51, 0.45) 58%, rgba(10, 15, 51, 0) 80%); }
.application-grid .app-tile .wp-block-cover__inner-container { display: flex; flex-direction: column; justify-content: flex-end; align-self: stretch; }
.application-grid .tile__index { display: inline-flex; align-items: center; gap: var(--wp--preset--spacing--20); width: fit-content; margin: 0 0 auto !important; padding: calc(var(--wp--preset--spacing--20) * 0.75) var(--wp--preset--spacing--30); border: 1px solid var(--wp--custom--line--dark); border-radius: var(--wp--custom--radius--pill); background-color: color-mix(in srgb, var(--wp--preset--color--navy-950) 50%, transparent); color: var(--wp--preset--color--frost); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.application-grid .tile__index::before { content: ""; flex: none; width: 0.45rem; height: 0.45rem; border-radius: 50%; background-color: var(--wp--preset--color--frost); }
.application-grid .tile__text { padding: 0; border: 0; background: none; box-shadow: none; }
.application-grid .tile__text > * { margin-block: 0; }
.application-grid .tile__text > * + * { margin-block-start: var(--wp--preset--spacing--20); }
.application-grid .tile__text h3 { min-height: calc(2 * 1.2em); color: var(--wp--preset--color--white); font-weight: 400; }
.application-grid .tile__text p { min-height: 0; color: var(--wp--preset--color--frost); line-height: 1.5; }
.application-grid .tile__text .wp-block-button.is-style-arrow > .wp-block-button__link { color: var(--wp--preset--color--white); }
@media (min-width: 1100px) { .application-grid .tile__text p { min-height: calc(3 * 1.5em); } }
@media (max-width: 1099px) { .application-grid .app-grid.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1023px) { .application-grid .app-tile { aspect-ratio: 4 / 5; } }
/* phones: the tiles become a row to swipe through */
@media (max-width: 781px) {
	.application-grid .app-grid.is-layout-grid { display: flex; gap: var(--wp--preset--spacing--30); margin-inline: calc(var(--wp--style--root--padding-left) * -1) !important; padding: 0 var(--wp--style--root--padding-right) var(--wp--preset--spacing--30) var(--wp--style--root--padding-left); overflow-x: auto; scroll-padding-inline: var(--wp--style--root--padding-left); scroll-snap-type: x mandatory; scrollbar-width: none; }
	.application-grid .app-grid.is-layout-grid::-webkit-scrollbar { display: none; }
	.application-grid .app-grid > * { flex: 0 0 min(20rem, 82%); scroll-snap-align: start; }
	.application-grid .app-tile { min-height: 22rem; }
}

/* Proof (innoseis/proof-cards): project cards on navy, in a row that scrolls sideways */
.proof-strip .field-scroller { --scroller-inset: calc(var(--wp--style--root--padding-left) + max(0px, (100% - var(--wp--style--global--wide-size)) / 2)); align-items: stretch; gap: var(--wp--preset--spacing--40); margin-block-start: var(--wp--preset--spacing--60); padding: 0 var(--scroller-inset) var(--wp--preset--spacing--40); overflow-x: auto; overscroll-behavior-x: contain; scroll-padding-inline: var(--scroller-inset); scroll-snap-type: x proximity; }
.proof-strip .field-scroller::-webkit-scrollbar { height: 6px; }
.proof-strip .field-scroller::-webkit-scrollbar-track { margin-inline: var(--scroller-inset); border-radius: var(--wp--custom--radius--pill); background-color: var(--wp--custom--line--dark); }
.proof-strip .field-scroller::-webkit-scrollbar-thumb { border-radius: var(--wp--custom--radius--pill); background-color: var(--wp--preset--color--mist); }
@supports not selector(::-webkit-scrollbar) { .proof-strip .field-scroller { scrollbar-width: thin; scrollbar-color: var(--wp--preset--color--mist) var(--wp--custom--line--dark); } }
.proof-strip .field-scroller:focus-visible { outline: 2px solid var(--wp--preset--color--frost); outline-offset: -4px; }
.proof-strip .field-card { display: flex; flex: 0 0 min(29rem, 84%); flex-direction: column; gap: var(--wp--preset--spacing--30); padding-bottom: var(--wp--preset--spacing--40); overflow: hidden; border: 1px solid var(--wp--custom--line--dark); border-radius: var(--wp--custom--radius--large); background-color: color-mix(in srgb, var(--wp--preset--color--navy-800) 70%, var(--wp--preset--color--navy-900)); scroll-snap-align: start; }
.proof-strip .field-card > * { margin: 0 !important; }
.proof-strip .field-card > :not(figure) { margin-inline: var(--wp--preset--spacing--40) !important; }
.proof-strip .field-card__media { aspect-ratio: 3 / 2; margin-bottom: var(--wp--preset--spacing--20) !important; overflow: hidden; }
.proof-strip .field-card__media img { width: 100%; height: 100%; object-fit: cover; }
.proof-strip .field-card__media.is-crop-detail { position: relative; isolation: isolate; }
.proof-strip .field-card__media.is-crop-detail img { transform: scale(2); transform-origin: 46% 45%; filter: grayscale(1) contrast(1.05); }
.proof-strip .field-card__media.is-crop-detail::after { content: ""; position: absolute; inset: 0; background-color: var(--wp--preset--color--navy); mix-blend-mode: color; opacity: 0.6; pointer-events: none; }
.proof-strip .field-card__label { display: inline-flex; align-items: center; gap: var(--wp--preset--spacing--20); width: fit-content; padding: calc(var(--wp--preset--spacing--20) * 0.75) var(--wp--preset--spacing--30); border: 1px solid var(--wp--custom--line--dark); border-radius: var(--wp--custom--radius--pill); color: var(--wp--preset--color--frost); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; }
.proof-strip .field-card__label::before { content: ""; flex: none; width: 0.45rem; height: 0.45rem; border-radius: 50%; background-color: var(--wp--preset--color--frost); }
.proof-strip .field-card h3 { color: var(--wp--preset--color--white); }
.proof-strip .field-card p:not(.field-card__label) { color: var(--wp--preset--color--mist); font-size: var(--wp--preset--font-size--small); line-height: 1.6; }

/* Track record (innoseis/timeline): story and photo beside a vertical timeline */
.track-record .timeline-cols { gap: var(--wp--preset--spacing--60); margin-block-start: var(--wp--preset--spacing--50); }
.track-record .timeline-intro > * { margin-block: 0; }
.track-record .timeline-intro > * + * { margin-block-start: var(--wp--preset--spacing--40); }
.track-record .timeline-intro > .wp-block-image { margin-block-start: var(--wp--preset--spacing--50); }
.track-record .timeline-intro img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.track-record .wp-block-list.is-style-timeline { position: relative; display: block; margin: 0; padding: 0; border: 0; list-style: none; }
.track-record .wp-block-list.is-style-timeline::before { content: ""; position: absolute; top: 2.4rem; bottom: 2.4rem; left: 0.3rem; border-left: 1px solid var(--wp--preset--color--mist); }
.track-record .is-style-timeline li { position: relative; display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: var(--wp--preset--spacing--30); margin: 0; padding: var(--wp--preset--spacing--40) 0 var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); border: 0; border-bottom: 1px solid var(--wp--custom--line--light); color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--medium); line-height: 1.45; }
.track-record .is-style-timeline li:first-child { border-top: 1px solid var(--wp--custom--line--light); }
.track-record .is-style-timeline li::before { top: calc(var(--wp--preset--spacing--40) + 0.45em); left: 0; width: 0.6rem; height: 0.6rem; border: 1.5px solid var(--wp--preset--color--navy); background-color: var(--wp--preset--color--white); box-shadow: none; }
.track-record .is-style-timeline li.is-now::before { border-color: var(--wp--preset--color--signal); background-color: var(--wp--preset--color--signal); box-shadow: none; }
.track-record .is-style-timeline strong { display: block; margin: 0; padding-top: 0.2em; color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--small); font-weight: 500; letter-spacing: 0.04em; }
/* the company film at the foot of the section: plays only when started */
.track-record .wp-block-video.company-film { margin-block-start: var(--wp--preset--spacing--70); }
.track-record .company-film video { display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--wp--custom--radius--medium); background-color: var(--wp--preset--color--navy-950); }
.track-record .company-film .wp-element-caption { margin-block-start: var(--wp--preset--spacing--20); color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--x-small); }
@media (max-width: 781px) {
	.track-record .timeline-cols { gap: var(--wp--preset--spacing--50); }
	.track-record .wp-block-list.is-style-timeline { margin: 0; border: 0; }
	.track-record .is-style-timeline li { grid-template-columns: minmax(0, 1fr); gap: calc(var(--wp--preset--spacing--20) / 2); padding: var(--wp--preset--spacing--40) 0 var(--wp--preset--spacing--40) var(--wp--preset--spacing--40); }
	.track-record .is-style-timeline li:last-child { padding-bottom: var(--wp--preset--spacing--40); }
	.track-record .is-style-timeline li::before { top: calc(var(--wp--preset--spacing--40) + 0.45em); left: 0; }
}

/* =========================================================================
   16. Home: the Graviton variants (G, S, N) and the datasheet button
   ========================================================================= */
.graviton-variants.is-layout-grid { gap: var(--wp--preset--spacing--30); margin-block-start: var(--wp--preset--spacing--30); }
.graviton-variant .product-card__body { padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); }
.wp-block-buttons.graviton-datasheet { margin-block-start: var(--wp--preset--spacing--50); }
.graviton-variant .product-card__body > .is-style-eyebrow { margin-block-start: calc(var(--wp--preset--spacing--20) * -0.5); }
@media (min-width: 782px) and (max-width: 1099px) { .graviton-variants.is-cols-3.is-layout-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 781px) {
	.graviton-variants.is-layout-grid { grid-template-columns: minmax(0, 1fr); }
	.graviton-variant .product-card__body { padding: var(--wp--preset--spacing--40); }
}

/* "is-placeholder" on an image: a photo still to be replaced (a dashed frame and a label, on the site
   and in the editor). Remove the class when the new photo is in. */
.wp-block-image.is-placeholder { position: relative; }
.wp-block-image.is-placeholder img { outline: 2px dashed rgb(255 255 255 / 0.85); outline-offset: calc(-1 * var(--wp--preset--spacing--30)); }
.wp-block-image.is-placeholder::after {
	content: "Photo to be replaced";
	position: absolute;
	top: calc(var(--wp--preset--spacing--30) * 2);
	left: calc(var(--wp--preset--spacing--30) * 2);
	padding: 0.5em 1em;
	border-radius: 999px;
	background-color: rgb(10 15 51 / 0.82);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	pointer-events: none;
}

/* Privacy policy: the table of what we collect (Table block, additional class "privacy-table"). On phones
   every row becomes a card, each cell with its column name above it. */
.wp-block-table.privacy-table table { table-layout: auto; font-size: var(--wp--preset--font-size--small); line-height: 1.5; }
.wp-block-table.privacy-table th,
.wp-block-table.privacy-table td { padding: 0.9em 1.25em 0.9em 0; border: 0; border-bottom: 1px solid var(--wp--custom--line--light); vertical-align: top; }
.wp-block-table.privacy-table thead { border-bottom: 0; }
.wp-block-table.privacy-table thead th { border-bottom: 1px solid var(--wp--preset--color--navy); color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
.wp-block-table.privacy-table td:first-child { color: var(--wp--preset--color--navy); font-weight: 500; }
@media (max-width: 781px) {
	.wp-block-table.privacy-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.wp-block-table.privacy-table :is(table, tbody, tr, td) { display: block; }
	.wp-block-table.privacy-table tr { padding-block: var(--wp--preset--spacing--30); border-bottom: 1px solid var(--wp--custom--line--light); }
	.wp-block-table.privacy-table td { padding: 0.35em 0; border: 0; }
	.wp-block-table.privacy-table td:first-child { font-size: var(--wp--preset--font-size--medium); }
	.wp-block-table.privacy-table td:not(:first-child)::before { display: block; color: var(--wp--preset--color--slate); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; }
	.wp-block-table.privacy-table td:nth-child(2)::before { content: "Data"; }
	.wp-block-table.privacy-table td:nth-child(3)::before { content: "Purpose"; }
	.wp-block-table.privacy-table td:nth-child(4)::before { content: "Legal basis"; }
	.wp-block-table.privacy-table td:nth-child(5)::before { content: "Retention"; }
}

/* Cookie banner (inc/consent.php): a card at the bottom left until the visitor chooses. "Accept" and
   "Necessary only" look the same: refusing is as easy as accepting. */
.cookie-banner {
	position: fixed;
	z-index: 1000;
	bottom: var(--wp--preset--spacing--30);
	left: var(--wp--preset--spacing--30);
	width: min(26rem, calc(100vw - 2 * var(--wp--preset--spacing--30)));
	padding: var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--custom--line--light);
	border-radius: var(--wp--custom--radius--large);
	background-color: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--panel);
	color: var(--wp--preset--color--ink);
}
.cookie-banner[hidden] { display: none; }
.cookie-banner__title { display: flex; align-items: center; gap: 0.6em; margin: 0; color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; }
.cookie-banner__title::before { content: ""; width: 0.5em; height: 0.5em; border-radius: 1px; background-color: var(--wp--preset--color--signal); }
.cookie-banner__text { margin: var(--wp--preset--spacing--20) 0 0; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
.cookie-banner__text a { color: var(--wp--preset--color--navy); text-underline-offset: 0.2em; }
.cookie-banner__buttons { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--30); }
.cookie-banner__button {
	flex: 1 1 8rem;
	min-height: var(--tap);
	padding: 0.6em 1.2em;
	border: 1px solid var(--wp--preset--color--navy);
	border-radius: 999px;
	background-color: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--white);
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	cursor: pointer;
}
.cookie-banner__button:hover { border-color: var(--wp--preset--color--navy-800); background-color: var(--wp--preset--color--navy-800); }
.cookie-banner__button:focus-visible { outline: 2px solid var(--wp--preset--color--navy); outline-offset: 3px; }

/* The datasheet popup (inc/datasheet.php): the form on a white card over the dimmed page. Opened with
   showModal() by assets/js/datasheet.js; without JavaScript through :target, with a shadow as backdrop. */
.datasheet-dialog {
	width: min(36rem, calc(100vw - 2 * var(--wp--preset--spacing--30)));
	max-height: calc(100dvh - 2 * var(--wp--preset--spacing--30));
	padding: 0;
	overflow: auto;
	border: 0;
	border-radius: var(--wp--custom--radius--large);
	background-color: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--panel);
	color: var(--wp--preset--color--ink);
}
.datasheet-dialog::backdrop { background-color: rgb(10 15 51 / 0.62); backdrop-filter: blur(3px); }
.datasheet-dialog:target:not([open]) { position: fixed; z-index: 1001; inset: 0; display: block; height: fit-content; margin: auto; box-shadow: 0 0 0 100vmax rgb(10 15 51 / 0.62); }
.datasheet-dialog__inner { position: relative; padding: var(--wp--preset--spacing--50); }
.datasheet-dialog__inner > * { margin-block: 0; }
.datasheet-dialog__inner > * + * { margin-block-start: var(--wp--preset--spacing--20); }
.datasheet-dialog__inner > .innoseis-form { margin-block-start: var(--wp--preset--spacing--40); }
.datasheet-dialog__title { padding-right: var(--tap); color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--x-large); font-weight: 400; line-height: 1.15; letter-spacing: -0.02em; }
.datasheet-dialog__intro { color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
.datasheet-dialog__close {
	position: absolute;
	top: var(--wp--preset--spacing--30);
	right: var(--wp--preset--spacing--30);
	display: grid;
	place-items: center;
	width: var(--tap);
	height: var(--tap);
	border-radius: 50%;
	color: var(--wp--preset--color--navy);
	font-size: 1.6rem;
	line-height: 1;
	text-decoration: none;
}
.datasheet-dialog__close:hover { background-color: var(--wp--preset--color--paper); }
.datasheet-dialog__close:focus-visible { outline: 2px solid var(--wp--preset--color--navy); outline-offset: 2px; }
.innoseis-form__download { margin: 0; }
@media (max-width: 599px) { .datasheet-dialog__inner { padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30); } }

/* In the media (inc/media.php): a card that opens an article elsewhere ends its title with ↗ */
.wp-block-post-title a.is-external::after { content: " ↗" / ""; color: var(--wp--preset--color--slate); font-size: 0.8em; }