/*
 * SISU Consulting (Concept 7) – supplementary styles.
 *
 * Colours, fonts, sizes and spacing come from theme.json (Global Styles),
 * so they can be changed in Appearance > Editor > Styles. This file only
 * covers the block styles listed in the editor's "Styles" panel and a few
 * layout details theme.json can't express. Every colour below is a palette
 * variable, so changing a palette colour in Global Styles flows through.
 */

:root {
	--sisu-ease: var(--wp--custom--ease, cubic-bezier(.2, .6, .2, 1));
	--sisu-radius-sm: var(--wp--custom--radius--sm, 6px);
	--sisu-radius-md: var(--wp--custom--radius--md, 10px);
	--sisu-radius-lg: var(--wp--custom--radius--lg, 12px);
	--sisu-nav-h: var(--wp--custom--nav-height, 72px);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 {
	text-wrap: balance;
}
p {
	text-wrap: pretty;
}
img {
	max-width: 100%;
	height: auto;
}
html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--sisu-nav-h) + 16px + var(--wp-admin--admin-bar--height, 0px));
}

/* One visible focus system, recoloured on dark and orange backgrounds. */
:where(.wp-site-blocks) :where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--steel);
	outline-offset: 3px;
}
:where(.has-steel-background-color) :focus-visible {
	outline-color: var(--wp--preset--color--gold) !important;
}
:where(.has-coral-background-color) :focus-visible {
	outline-color: var(--wp--preset--color--black) !important;
}

/* Visually hidden text for screen readers (standard WordPress rule). */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}
.screen-reader-text:focus {
	background-color: var(--wp--preset--color--white);
	clip-path: none;
	color: var(--wp--preset--color--black);
	display: block;
	font-size: 1rem;
	height: auto;
	left: 8px;
	padding: 12px 20px;
	top: 8px;
	width: auto;
	z-index: 100000;
}

/* ---------- Page structure ---------- */
/* Full-width coloured sections sit flush against each other. */
.wp-site-blocks > * + *,
.wp-block-post-content > .alignfull,
main > .alignfull + .alignfull {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* ---------- Header ---------- */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .wp-site-blocks > header.wp-block-template-part {
	top: var(--wp-admin--admin-bar--height, 0px);
}
.sisu-header {
	background: var(--wp--preset--color--white);
	border-bottom: 1px solid var(--wp--preset--color--powder);
	min-height: var(--sisu-nav-h);
}
.sisu-header .wp-block-site-logo img {
	height: 30px;
	width: auto;
}
.sisu-header .wp-block-navigation-item__content {
	position: relative;
	padding: 8px 0;
	text-decoration: none;
	transition: color .2s var(--sisu-ease);
}
.sisu-header .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 2px;
	height: 2px;
	background: var(--wp--preset--color--coral);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s var(--sisu-ease);
}
.sisu-header .wp-block-navigation-item__content:hover::after,
.sisu-header .wp-block-navigation-item__content:focus-visible::after,
.sisu-header .wp-block-navigation-item__content[aria-current]::after {
	transform: scaleX(1);
}
.sisu-header .wp-block-navigation-item__content[aria-current] {
	color: var(--wp--preset--color--black);
}
.sisu-header .wp-block-button__link {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	padding-top: 0;
	padding-bottom: 0;
}
@media (max-width: 640px) {
	.sisu-header .sisu-header__row {
		flex-wrap: wrap !important;
		row-gap: 0 !important;
	}
	.sisu-header .sisu-header__menu {
		order: 3;
		width: 100%;
		flex-direction: row-reverse;
		justify-content: space-between !important;
	}
	.sisu-header .sisu-header__menu .wp-block-buttons {
		position: absolute;
		top: 12px;
		right: clamp(20px, 4vw, 48px);
	}
	.sisu-header .wp-block-navigation {
		width: 100%;
		margin-top: 8px;
		border-top: 1px solid var(--wp--preset--color--powder);
	}
	.sisu-header .wp-block-navigation__container {
		width: 100%;
		justify-content: space-between;
		gap: 8px !important;
	}
	.sisu-header .wp-block-navigation-item__content {
		font-size: var(--wp--preset--font-size--x-small);
		padding: 12px 0;
	}
	.sisu-header {
		position: relative;
	}
	html {
		scroll-padding-top: calc(120px + var(--wp-admin--admin-bar--height, 0px));
	}
}

/* ---------- Buttons ---------- */
.wp-block-button__link {
	min-height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color .2s var(--sisu-ease), border-color .2s var(--sisu-ease), color .2s var(--sisu-ease);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--steel);
	border-color: var(--wp--preset--color--steel);
	color: var(--wp--preset--color--white);
}
/* On Dark Blue, the solid button hovers to white rather than black. */
.has-steel-background-color .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--black);
}

/* ---------- Paragraph styles ---------- */
.is-style-eyebrow {
	display: flex;
	align-items: center;
	gap: 12px;
	font-weight: 800;
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.14em;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--wp--preset--color--steel);
}
.is-style-eyebrow::before {
	content: "";
	width: 24px;
	height: 2px;
	background: var(--wp--preset--color--coral);
	flex-shrink: 0;
}
/* On Orange, the eyebrow and its dash go black. */
.has-coral-background-color .is-style-eyebrow:not(.has-text-color) {
	color: var(--wp--preset--color--black);
}
.has-coral-background-color .is-style-eyebrow::before,
.is-style-eyebrow.has-black-color::before {
	background: var(--wp--preset--color--black);
}

.is-style-subhead {
	font-weight: 800;
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.12em;
	line-height: 1.4;
	text-transform: uppercase;
}
.is-style-rule-label {
	padding-top: 16px;
	padding-bottom: 12px;
	border-top: 3px solid var(--sisu-rule, var(--wp--preset--color--steel));
	font-weight: 800;
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.12em;
	line-height: 1.4;
	text-transform: uppercase;
}
.is-style-lede {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.65;
	max-width: 62ch;
}
.is-style-statement {
	color: var(--wp--preset--color--coral);
	font-weight: 800;
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.3;
	letter-spacing: -0.012em;
}
.is-style-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--wp--preset--color--coral);
	color: var(--wp--preset--color--black);
	font-weight: 800;
	font-size: 0.8125rem;
	letter-spacing: 0.02em;
	line-height: 1;
	margin-top: -6px !important;
}

/* ---------- Heading styles ---------- */
.wp-block-heading.is-style-accent-rule {
	position: relative;
	padding-top: 16px;
}
.wp-block-heading.is-style-accent-rule::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 24px;
	height: 3px;
	background: var(--wp--preset--color--coral);
}
.wp-block-heading em {
	font-style: italic;
}

/* Links take the colour of text that has been given a colour. */
p.has-text-color a,
.wp-block-heading.has-text-color a {
	color: inherit;
}

/* ---------- Hero: illustration stands on the strip below ---------- */
.wp-block-image.is-style-sits-on-strip {
	margin-bottom: -1px !important;
	line-height: 0;
}
.wp-block-image.is-style-sits-on-strip img {
	display: block;
}
.sisu-hero-text {
	padding-bottom: clamp(56px, 6.5vw, 104px);
}
.sisu-hero-illus {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}
@media (max-width: 781px) {
	.sisu-hero-text {
		padding-bottom: 0;
	}
	.sisu-hero .wp-block-image.is-style-sits-on-strip {
		max-width: 260px;
		margin-top: 8px;
	}
}

/* ---------- Group styles ---------- */

/* Case study card: thin Light Blue outline with an orange tab that grows. */
.wp-block-group.is-style-case-card {
	position: relative;
	height: 100%;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--powder);
	border-radius: var(--sisu-radius-md);
	padding: 32px;
	transition: border-color .2s var(--sisu-ease);
}
.wp-block-group.is-style-case-card::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 32px;
	width: 32px;
	height: 3px;
	background: var(--wp--preset--color--coral);
	transition: width .3s var(--sisu-ease);
}
.wp-block-group.is-style-case-card:hover {
	border-color: var(--wp--preset--color--cornflower);
}
.wp-block-group.is-style-case-card:hover::before,
.wp-block-group.is-style-case-card:focus-within::before {
	width: 64px;
}
@media (max-width: 640px) {
	.wp-block-group.is-style-case-card {
		padding: 24px;
	}
	.wp-block-group.is-style-case-card::before {
		left: 24px;
	}
}

/* Feature card ("pathway"). The last link makes the whole card clickable. */
.wp-block-group.is-style-pathway {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	border-radius: var(--sisu-radius-lg);
	padding: clamp(32px, 3.6vw, 48px);
	transition: transform .25s var(--sisu-ease);
}
.wp-block-group.is-style-pathway:hover {
	transform: translateY(-2px);
}
.wp-block-group.is-style-pathway > * {
	max-width: 54ch;
}
.wp-block-group.is-style-pathway .wp-block-heading {
	max-width: 18ch;
	color: inherit;
}
.wp-block-group.is-style-pathway > p:nth-last-child(2) {
	margin-bottom: auto;
}
.wp-block-group.is-style-pathway > p:last-child {
	margin-top: 32px;
}
.wp-block-group.is-style-pathway > p:last-child a {
	color: inherit;
	text-decoration: none;
	border-bottom: 2px solid currentColor;
	padding-bottom: 4px;
	font-weight: 800;
	transition: border-color .2s var(--sisu-ease);
}
.wp-block-group.is-style-pathway.has-steel-background-color > p:last-child a {
	border-bottom-color: var(--wp--preset--color--powder);
}
.wp-block-group.is-style-pathway.has-steel-background-color:hover > p:last-child a {
	border-bottom-color: var(--wp--preset--color--white);
}
.wp-block-group.is-style-pathway > p:last-child a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}
.wp-block-group.is-style-pathway > .wp-block-image:first-child {
	position: absolute;
	top: clamp(28px, 3.4vw, 44px);
	right: clamp(28px, 3.4vw, 44px);
	width: 60px;
	margin: 0;
}
.wp-block-group.is-style-pathway > .wp-block-image:first-child + * {
	margin-block-start: 0;
}
@media (max-width: 640px) {
	.wp-block-group.is-style-pathway > .wp-block-image:first-child {
		width: 48px;
	}
	.wp-block-group.is-style-pathway:has(> .wp-block-image:first-child) .wp-block-heading {
		padding-right: 56px;
	}
}
.wp-block-column > .wp-block-group.is-style-pathway:only-child {
	height: 100%;
}

/* Team member card: photo on top, turns black and white on hover. */
.wp-block-group.is-style-leader-card {
	height: 100%;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--white);
	border-radius: var(--sisu-radius-md);
	overflow: hidden;
}
.wp-block-group.is-style-leader-card > .wp-block-image {
	margin: 0;
	overflow: hidden;
}
.wp-block-group.is-style-leader-card > .wp-block-image img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center top;
	transition: filter .35s var(--sisu-ease);
}
.wp-block-group.is-style-leader-card:hover > .wp-block-image img {
	filter: grayscale(1);
}
.wp-block-group.is-style-leader-card > .wp-block-group {
	padding: 24px 24px 32px;
	margin-block-start: 0;
}
.sisu-leader-tag {
	position: relative;
	padding-bottom: 16px;
}
.sisu-leader-tag::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 24px;
	height: 2px;
	background: var(--wp--preset--color--coral);
}
@media (max-width: 781px) {
	.wp-block-group.is-style-leader-card {
		display: grid;
		grid-template-columns: 168px minmax(0, 1fr);
		align-items: start;
	}
	.wp-block-group.is-style-leader-card > .wp-block-group {
		padding: 24px;
	}
}
@media (max-width: 640px) {
	.wp-block-group.is-style-leader-card {
		grid-template-columns: 112px minmax(0, 1fr);
	}
	.wp-block-group.is-style-leader-card > .wp-block-group {
		padding: 16px 16px 24px;
	}
}
@media (max-width: 400px) {
	.wp-block-group.is-style-leader-card {
		grid-template-columns: 96px minmax(0, 1fr);
	}
}

/* Divided rows (Why SISU list). */
.wp-block-group.is-style-divided > * {
	border-top: 1px solid var(--sisu-divider, var(--wp--preset--color--cornflower));
	padding-block: 24px;
	margin-block-start: 0 !important;
}
.wp-block-group.is-style-divided > *:last-child {
	border-bottom: 1px solid var(--sisu-divider, var(--wp--preset--color--cornflower));
}

/* White details card (contact details). */
.wp-block-group.is-style-detail-card {
	background: var(--wp--preset--color--white);
	border-radius: var(--sisu-radius-md);
	padding: 8px 24px;
}
.wp-block-group.is-style-detail-card > * {
	padding-block: 16px;
	margin-block-start: 0 !important;
}
.wp-block-group.is-style-detail-card > * + * {
	border-top: 1px solid var(--wp--preset--color--powder);
}

/* Orange accents: switches rules and accordion arrows inside a group to Orange. */
.wp-block-group.is-style-accent-coral {
	--sisu-rule: var(--wp--preset--color--coral);
	--sisu-chevron: var(--wp--preset--color--coral);
}

/* ---------- Columns ---------- */
/* Joined link tiles (contact paths): white cells with hairline gaps. */
.wp-block-columns.is-style-contact-paths {
	gap: 1px !important;
	background: var(--wp--preset--color--powder);
	border-radius: var(--sisu-radius-md);
	overflow: hidden;
}
.wp-block-columns.is-style-contact-paths > .wp-block-column {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 12px;
	background: var(--wp--preset--color--white);
	padding: 24px;
	transition: background-color .2s var(--sisu-ease);
}
.wp-block-columns.is-style-contact-paths > .wp-block-column > * {
	margin: 0;
}
.wp-block-columns.is-style-contact-paths > .wp-block-column:hover {
	background: var(--wp--preset--color--powder);
}
.wp-block-columns.is-style-contact-paths a {
	color: inherit;
	text-decoration: none;
}
.wp-block-columns.is-style-contact-paths > .wp-block-column:hover a {
	text-decoration: underline;
	text-underline-offset: 3px;
}
.wp-block-columns.is-style-contact-paths > .wp-block-column p:last-child a::after {
	content: "";
	position: absolute;
	inset: 0;
}

@media (min-width: 782px) {
	.wp-block-column.is-style-sticky {
		position: sticky;
		top: calc(var(--sisu-nav-h) + 32px + var(--wp-admin--admin-bar--height, 0px));
	}
}

/* ---------- Images ---------- */
.wp-block-image.is-style-on-dark img {
	filter: brightness(0) invert(1);
}

/* ---------- Lists ---------- */
.wp-block-list li::marker {
	color: var(--wp--preset--color--coral);
}

/* Tile mosaic (industries): Light Blue tiles with an orange marker. */
.wp-block-list.is-style-tiles {
	list-style: none;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 3px;
	border-radius: var(--sisu-radius-md);
	overflow: hidden;
}
.wp-block-list.is-style-tiles > li {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 112px;
	margin: 0;
	padding: 32px 24px 24px;
	background: var(--wp--preset--color--powder);
	color: var(--wp--preset--color--steel);
	font-weight: 800;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.35;
	letter-spacing: -0.005em;
}
.wp-block-list.is-style-tiles > li::before {
	content: "";
	position: absolute;
	top: 24px;
	left: 24px;
	width: 16px;
	height: 3px;
	background: var(--wp--preset--color--coral);
}
@media (max-width: 1100px) {
	.wp-block-list.is-style-tiles > li {
		min-height: 104px;
		padding: 32px 16px 16px;
	}
	.wp-block-list.is-style-tiles > li::before {
		left: 16px;
	}
}
@media (max-width: 900px) {
	.wp-block-list.is-style-tiles {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.wp-block-list.is-style-tiles > li {
		min-height: 88px;
	}
}
@media (max-width: 640px) {
	.wp-block-list.is-style-tiles > li {
		min-height: 84px;
		font-size: var(--wp--preset--font-size--x-small);
	}
}

/* Link grid with icons (procurement panels). */
.wp-block-list.is-style-panel-links {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px 32px;
}
.wp-block-list.is-style-panel-links > li {
	position: relative;
	margin: 0;
	padding-left: 22px;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	line-height: 1.45;
}
.wp-block-list.is-style-panel-links > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 3px;
	width: 14px;
	height: 14px;
	background: var(--wp--preset--color--powder);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10l9-5 9 5'/%3E%3Cpath d='M5 10v8'/%3E%3Cpath d='M9 10v8'/%3E%3Cpath d='M15 10v8'/%3E%3Cpath d='M19 10v8'/%3E%3Cpath d='M3 21h18'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10l9-5 9 5'/%3E%3Cpath d='M5 10v8'/%3E%3Cpath d='M9 10v8'/%3E%3Cpath d='M15 10v8'/%3E%3Cpath d='M19 10v8'/%3E%3Cpath d='M3 21h18'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wp-block-list.is-style-panel-links a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color .2s var(--sisu-ease);
}
.wp-block-list.is-style-panel-links a:hover {
	border-bottom-color: var(--wp--preset--color--gold);
}
@media (max-width: 1100px) {
	.wp-block-list.is-style-panel-links {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (max-width: 640px) {
	.wp-block-list.is-style-panel-links {
		grid-template-columns: 1fr;
	}
}
.sisu-panels-row {
	display: grid !important;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 16px 48px !important;
	align-items: start;
}
.sisu-panels-row > * {
	margin: 0 !important;
}
.sisu-panels-row > p {
	padding-top: 3px;
	white-space: nowrap;
}
@media (max-width: 1024px) {
	.sisu-panels-row {
		grid-template-columns: 1fr;
	}
}

/* Inline word list (footer) and inline list with dots. */
.wp-block-list.is-style-word-cloud,
.wp-block-list.is-style-inline-dots {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
}
.wp-block-list.is-style-word-cloud {
	gap: 8px 16px;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.01em;
}
.wp-block-list.is-style-word-cloud li:nth-child(even) {
	color: var(--wp--preset--color--powder);
}
.wp-block-list.is-style-inline-dots {
	gap: 8px 0;
}
.wp-block-list.is-style-inline-dots li:not(:last-child)::after {
	content: "\00b7";
	margin: 0 10px;
	opacity: 0.6;
}
.wp-block-list.is-style-inline-dots a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.wp-block-list.is-style-inline-dots a:hover {
	border-bottom-color: var(--wp--preset--color--coral);
}

/* ---------- Details (accordion) ---------- */
.wp-block-details {
	border-bottom: 1px solid var(--wp--preset--color--powder);
	margin-block-start: 0 !important;
}
.wp-block-details summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 16px;
	padding-block: 16px;
	font-weight: 700;
	font-size: 1.0625rem;
	line-height: 1.4;
	border-radius: 4px;
	transition: color .2s var(--sisu-ease);
}
.wp-block-details summary:hover {
	color: var(--wp--preset--color--steel);
}
.wp-block-details summary::-webkit-details-marker {
	display: none;
}
.wp-block-details summary::after {
	content: "";
	margin-left: auto;
	margin-right: 4px;
	width: 9px;
	height: 9px;
	flex-shrink: 0;
	border-right: 2px solid var(--sisu-chevron, var(--wp--preset--color--steel));
	border-bottom: 2px solid var(--sisu-chevron, var(--wp--preset--color--steel));
	transform: translateY(-2px) rotate(45deg);
	transition: transform .25s var(--sisu-ease);
}
.wp-block-details[open] summary::after {
	transform: translateY(2px) rotate(-135deg);
}
.wp-block-details > :not(summary) {
	margin-top: 0;
}
.wp-block-details > :last-child:not(summary) {
	padding-bottom: 24px;
}
.wp-block-details > p:not(summary) {
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	margin-bottom: 8px;
}
.wp-block-details .wp-block-list {
	margin: 0;
	padding-left: 20px;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.6;
}
.wp-block-details .wp-block-list li {
	margin-bottom: 4px;
	padding-left: 2px;
}

/* ---------- Case studies (query loop) ---------- */
.sisu-case-tag {
	font-size: var(--wp--preset--font-size--label);
	font-weight: 800;
	line-height: 1.5;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--steel);
}
.sisu-case-tag a {
	color: inherit;
	text-decoration: none;
}
.is-style-case-card .wp-block-post-title a {
	text-decoration: none;
}
.is-style-case-card .wp-block-post-title a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}
.is-style-case-card .wp-block-post-title a:hover {
	color: var(--wp--preset--color--steel);
}
.is-style-case-card .wp-block-post-excerpt {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}
.is-style-case-card .wp-block-post-excerpt__excerpt {
	margin: 0;
}
.is-style-case-card .wp-block-post-excerpt__more-text {
	margin-top: auto;
	padding-top: 16px;
}
.wp-block-post-excerpt__more-link {
	position: relative;
	z-index: 1;
	font-weight: 800;
	color: var(--wp--preset--color--steel);
}
/* Card grid (case studies and post lists): three across, two on tablets,
 * one on phones, as in the concept. Set by the theme so the grid holds even
 * if WordPress's generated layout styles are changed, cached or stripped.
 * To use the editor's own column settings instead, remove the
 * "sisu-card-grid" class under Advanced > Additional CSS class(es). */
.wp-block-post-template.sisu-card-grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: var(--wp--preset--spacing--40, 24px) !important;
	list-style: none;
	margin-left: 0;
	margin-right: 0;
	padding: 0;
}
.wp-block-post-template.sisu-card-grid > li {
	display: flex;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}
.wp-block-post-template.sisu-card-grid > li > .wp-block-group {
	flex: 1;
}
@media (max-width: 1024px) {
	.wp-block-post-template.sisu-card-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 760px) {
	.wp-block-post-template.sisu-card-grid {
		grid-template-columns: 1fr !important;
	}
}
.wp-block-post-template.is-layout-grid > li {
	display: flex;
}
.wp-block-post-template.is-layout-grid > li > .wp-block-group {
	flex: 1;
}
.sisu-case-body p strong:first-child {
	color: var(--wp--preset--color--steel);
}
.sisu-case-body h2 {
	font-size: var(--wp--preset--font-size--x-large);
	margin-top: 2.25rem;
}
.sisu-case-body h2:first-child {
	margin-top: 0;
}

/* ---------- Contact ---------- */
.wp-block-social-links .wp-block-social-link {
	transition: background-color .2s var(--sisu-ease), color .2s var(--sisu-ease);
}
.wp-block-social-links.has-icon-background-color .wp-block-social-link:hover {
	background-color: var(--wp--preset--color--black) !important;
	color: var(--wp--preset--color--white) !important;
}
.wp-block-social-links.has-icon-background-color .wp-block-social-link:hover svg {
	fill: currentColor;
}

/* Contact Form 7, laid out like the concept. */
.sisu-form-card .wpcf7 form > p,
.sisu-form-card .wpcf7 form > label,
.sisu-form-card .sisu-cf7-grid > p,
.sisu-form-card .sisu-cf7-grid > label {
	margin: 0 0 16px;
}
.sisu-cf7-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 16px;
}
@media (max-width: 640px) {
	.sisu-cf7-grid {
		grid-template-columns: 1fr;
	}
}
.sisu-form-card .wpcf7 label {
	display: block;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--black);
}
.sisu-form-card .wpcf7 label br {
	display: none;
}
.sisu-form-card .wpcf7-form-control-wrap {
	display: block;
	margin-top: 8px;
}
.sisu-form-card .wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.sisu-form-card .wpcf7 select,
.sisu-form-card .wpcf7 textarea {
	width: 100%;
	min-height: 48px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 400;
	color: var(--wp--preset--color--black);
	padding: 12px 14px;
	border: 1px solid var(--wp--preset--color--grey);
	border-radius: var(--sisu-radius-sm);
	background: var(--wp--preset--color--white);
	transition: border-color .2s var(--sisu-ease), box-shadow .2s var(--sisu-ease);
}
.sisu-form-card .wpcf7 input:hover,
.sisu-form-card .wpcf7 select:hover,
.sisu-form-card .wpcf7 textarea:hover {
	border-color: var(--wp--preset--color--steel);
}
.sisu-form-card .wpcf7 input:focus,
.sisu-form-card .wpcf7 select:focus,
.sisu-form-card .wpcf7 textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--steel);
	box-shadow: 0 0 0 2px var(--wp--preset--color--steel);
}
.sisu-form-card .wpcf7 textarea {
	resize: vertical;
	min-height: 140px;
}
.sisu-form-card .wpcf7 input[type="submit"] {
	width: 100%;
	min-height: 48px;
	margin-top: 8px;
	font-family: inherit;
	font-weight: 800;
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.01em;
	color: var(--wp--preset--color--black);
	background: var(--wp--preset--color--coral);
	border: 2px solid var(--wp--preset--color--coral);
	border-radius: var(--sisu-radius-sm);
	cursor: pointer;
	transition: background-color .2s var(--sisu-ease), border-color .2s var(--sisu-ease), color .2s var(--sisu-ease);
}
.sisu-form-card .wpcf7 input[type="submit"]:hover {
	background: var(--wp--preset--color--black);
	border-color: var(--wp--preset--color--black);
	color: var(--wp--preset--color--white);
}
.sisu-form-card .wpcf7 form p:has(> .wpcf7-submit) {
	position: relative;
	margin-bottom: 0;
}
.sisu-form-card .wpcf7-spinner {
	position: absolute;
	right: 12px;
	top: calc(50% + 4px);
	margin: 0;
	transform: translateY(-50%);
}
.sisu-form-card .wpcf7-not-valid-tip {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	margin-top: 6px;
	color: #B3261E;
}
.sisu-form-card .wpcf7 form .wpcf7-response-output {
	margin: 16px 0 0;
	padding: 12px 16px;
	border-radius: var(--sisu-radius-sm);
	font-size: var(--wp--preset--font-size--small);
}
.sisu-form-fallback {
	font-weight: 700;
}
.sisu-form-fallback--admin {
	margin-top: 12px;
	padding: 12px 16px;
	border: 1px dashed var(--wp--preset--color--grey);
	border-radius: var(--sisu-radius-sm);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
}

/* ---------- Footer ---------- */
.sisu-footer a {
	color: inherit;
}
.sisu-footer .wp-block-image img {
	width: 28px;
	height: 28px;
	border-radius: 50%;
}

/* ---------- Helpers ---------- */
.sisu-measure {
	max-width: 44ch;
}
.sisu-measure-wide {
	max-width: 60ch;
}
.sisu-measure-narrow {
	max-width: 28ch;
}
.sisu-measure-heading {
	max-width: 19ch;
}

/* ---------- Mobile helpers ---------- */
@media (max-width: 781px) {
	.sisu-hide-mobile {
		display: none !important;
	}
}

/* ---------- Motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
	*, *::before, *::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
	}
	.wp-block-group.is-style-pathway:hover {
		transform: none;
	}
}

/* ---------- Content made with the earlier SISU theme ----------
 * Pages built with the first SISU theme used a few colour names this theme
 * doesn't have. These rules map them to the nearest Concept 7 colour so that
 * existing content still looks right after switching themes.
 */
.has-grey-text-color,
.has-grey-text-powder-color {
	color: var(--wp--preset--color--black) !important;
}
.has-coral-deep-color {
	color: var(--wp--preset--color--coral) !important;
}
.has-coral-deep-background-color {
	background-color: var(--wp--preset--color--coral) !important;
	color: var(--wp--preset--color--black);
}
.has-steel-deep-color {
	color: var(--wp--preset--color--steel) !important;
}
.has-steel-deep-background-color {
	background-color: var(--wp--preset--color--steel) !important;
}
.is-style-label {
	font-weight: 800;
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}