/* Intrinsic sizing also follows the Customizer iframe viewport. */
.project-carousel { position: relative; }
.project-carousel .project-track {
	display: grid;
	grid-template-columns: none;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 72px) / 4);
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: contain;
	padding-block: 6px 18px;
	scrollbar-width: thin;
}
.project-track > .project-card { min-width: 0; scroll-snap-align: start; }
.project-track .project-image { height: auto; aspect-ratio: 4 / 3; }
.project-arrow {
	position: absolute;
	top: 90px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--votan-border);
	border-radius: 50%;
	background: var(--votan-white);
	color: var(--votan-primary);
	font-size: 30px;
	line-height: 1;
}
.project-previous { left: -20px; }
.project-next { right: -20px; }
.project-arrow:disabled { opacity: .45; cursor: default; }
.project-arrow:not(:disabled):hover { background: var(--votan-primary); color: var(--votan-white); }
@media (max-width: 1100px) {
	.project-carousel .project-track { grid-auto-columns: calc((100% - 24px) / 2); }
	.project-previous { left: 0; }
	.project-next { right: 0; }
}
@media (max-width: 767px) {
	.project-carousel .project-track { grid-auto-columns: 100%; }
}
/* Decorative marker stays close to the text rather than the padded link edge. */
:where(.site-header, #main) a:not(.button):not(.wordmark):not(.custom-logo-link):not(.project-image):not(.skip-link) {
	background-image:
		linear-gradient(90deg, transparent, var(--votan-accent) 12%, var(--votan-accent) 88%, transparent),
		linear-gradient(color-mix(in srgb, var(--votan-accent) 35%, transparent), color-mix(in srgb, var(--votan-accent) 35%, transparent));
	background-repeat: no-repeat;
	background-position: center calc(50% + .95em), center calc(50% + .8em);
	background-size: 0 4px, 0 2px;
	transition: background-size .18s ease, color .18s ease;
}
:where(.site-header, #main) a:not(.button):not(.wordmark):not(.custom-logo-link):not(.project-image):not(.skip-link):is(:hover, :focus-visible),
.site-header .menu .current-menu-item > a {
	background-size: min(36px, 40%) 4px, min(84px, 100%) 2px;
	text-decoration: none;
}
/* Footer links can wrap and include icons: anchor the marker below the text. */
.site-footer a:not(.button):not(.wordmark):not(.custom-logo-link) {
	position: relative;
	width: fit-content;
	max-width: 100%;
}
.site-footer a:not(.button):not(.wordmark):not(.custom-logo-link)::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -3px;
	width: min(84px, 100%);
	height: 5px;
	background:
		linear-gradient(90deg, transparent, var(--votan-accent) 12%, var(--votan-accent) 88%, transparent) center bottom / 40% 3px no-repeat,
		linear-gradient(color-mix(in srgb, var(--votan-accent) 35%, transparent), color-mix(in srgb, var(--votan-accent) 35%, transparent)) left top / 100% 2px no-repeat;
	opacity: 0;
	transition: opacity .18s ease;
	pointer-events: none;
}
.site-footer a:not(.button):not(.wordmark):not(.custom-logo-link):is(:hover, :focus-visible) {
	text-decoration: none;
}
.site-footer a:not(.button):not(.wordmark):not(.custom-logo-link):is(:hover, :focus-visible)::after { opacity: 1; }
.site-footer a.contact-item:not(.button):not(.wordmark):not(.custom-logo-link)::after {
	left: 30px;
	width: min(84px, calc(100% - 30px));
}
.site-footer .footer-grid .contact-details .contact-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 12px;
}
.contact-item > span { min-width: 0; overflow-wrap: anywhere; }
.contact-item .contact-icon { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 1px; }
.footer-bottom { flex-wrap: wrap; }
.footer-bottom a { overflow-wrap: anywhere; }
.hero-bottom { align-items: center; gap: 16px; }
.hero-bottom-text { min-width: 0; overflow-wrap: anywhere; }
.hero-discover {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	min-height: 44px;
	min-width: 44px;
	max-width: 45%;
	margin-left: auto;
	overflow-wrap: anywhere;
}
.hero-discover:hover { color: var(--votan-white); }
.about-has-image { position: relative; }
.about-has-image .about-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0;
}
.about-has-image .about-copy { padding-right: 35px; }
.about-has-image .about-visual {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 50%;
	height: 100%;
	min-height: 0;
	margin: 0;
}
.about-has-image .about-visual .about-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	border-radius: 0;
	object-fit: cover;
	object-position: center;
	/* Fade into the section background automatically for any uploaded image. */
	-webkit-mask-image: linear-gradient(to right, transparent, var(--votan-mask-opaque) 30%);
	mask-image: linear-gradient(to right, transparent, var(--votan-mask-opaque) 30%);
}
@media (max-width: 767px) {
	.about-has-image .about-grid { width: 100%; grid-template-columns: minmax(0, 1fr); }
	.about-has-image .about-copy { padding: 45px 18px 30px; }
	.about-has-image .about-visual {
		position: relative;
		width: 100%;
		height: clamp(240px, 55vw, 420px);
	}
	.about-has-image .about-visual .about-image {
		-webkit-mask-image: linear-gradient(to bottom, transparent, var(--votan-mask-opaque) 25%);
		mask-image: linear-gradient(to bottom, transparent, var(--votan-mask-opaque) 25%);
	}
}
@media (min-width: 1101px) {
	.project-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.brand-card .sector-icon { width: 78px; height: 78px; }
.brand-card .mini-wordmark { font-size: 30px; }
.brand-card .brand-logo {
	width: 100%;
	height: 170px;
	object-fit: contain;
	margin-bottom: 18px;
}
.project-image .project-custom-image {
	object-fit: contain;
	padding: 18px;
}
@media (max-width: 1100px) {
	.brand-card .brand-logo { height: 200px; }
}
@media (max-width: 767px) {
	.brand-card .brand-logo { height: 220px; max-width: 320px; }
}
img, video, svg { max-width: 100%; height: auto; }
.container { max-width: var(--max); min-width: 0; }
.hero-content { max-width: 920px; flex: 0 1 920px; min-width: 0; }
.header-inner > *, .about-grid > *, .footer-grid > *, .news-layout > *,
.news-card > *, .heading-row > *, .footer-cta > * { min-width: 0; }
.button { max-width: 100%; text-align: center; overflow-wrap: anywhere; }
.button span { flex-shrink: 0; }
.brand-card, .project-card, .news-card, .footer-grid { overflow-wrap: anywhere; }
.hero-image { height: 100%; }
.sector-icon { height: 58px; }
.project-image .sector-icon { height: 84px; }
.text-link:hover, .entry-content a:hover, .comment-content a:hover { color: var(--votan-accent); }
.primary-navigation { min-width: 0; }
.mobile-contact { display: none; }

@media (max-width: 1100px) {
	.header-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 14px; }
	.header-inner > .custom-logo-link, .header-inner > .wordmark { justify-self: start; max-width: 100%; }
	.header-inner .custom-logo { max-width: min(200px, 100%); }
	.menu-toggle:not([hidden]), .header-contact { margin-left: 0; }
	.header-contact { grid-column: 3; grid-row: 1; }
	.menu-toggle { grid-column: 2; grid-row: 1; }
	.primary-navigation { grid-column: 1 / -1; width: 100%; }
	.js-menu.menu-open .primary-navigation { max-height: 65vh; max-height: 65svh; overflow-y: auto; }
	.menu { align-items: stretch; }
	.menu .sub-menu { overflow-wrap: anywhere; }
	.hero-content { flex-basis: auto; width: calc(100% - 48px); padding-block: 100px 85px; }
	.hero h1 { font-size: clamp(32px, 5.3vw, 54px); }
	.project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.footer-grid > div + div { border: 0; padding-left: 0; }
}

@media (max-width: 767px) {
	.container { width: calc(100% - 36px); }
	.header-inner { grid-template-columns: minmax(0, 1fr) auto; min-height: 72px; gap: 12px; }
	.header-inner .custom-logo { max-width: min(160px, 100%); max-height: 48px; }
	.header-contact { display: none; }
	.mobile-contact { display: inline-flex; margin-block: 12px; }
	.menu { display: block; }
	.menu a { padding: 12px 8px; }
	.hero { min-height: 0; }
	.hero-content { width: calc(100% - 36px); padding: clamp(64px, 14vw, 100px) 0 72px; }
	.hero h1 { font-size: clamp(28px, 7.5vw, 44px); overflow-wrap: anywhere; }
	.hero-description { font-size: 14px; max-width: 540px; }
	.hero-eyebrow { font-size: 9px; letter-spacing: .1em; }
	.button-row { flex-direction: column; align-items: center; gap: 12px; }
	.button-row .button { width: min(100%, 340px); min-width: 0; }
	.hero-bottom { gap: 12px; font-size: 7px; letter-spacing: .07em; }
	.section { padding-block: 48px; }
	.brand-grid, .project-grid, .news-grid, .post-grid, .about-grid, .news-layout { grid-template-columns: minmax(0, 1fr); }
	.brand-card { padding: 28px 24px; }
	.brand-card p { font-size: 13px; }
	.project-image { height: auto; aspect-ratio: 16 / 10; }
	.project-image .sector-icon { width: 65px; height: 65px; }
	.heading-row, .footer-cta { display: block; }
	.heading-row .button, .footer-cta .button { margin-top: 20px; }
	.about-visual { min-width: 0; }
	.statement-wordmark { font-size: clamp(54px, 15vw, 90px); }
	.footer-bottom { flex-wrap: wrap; }
}

@media (max-width: 380px) {
	.footer-grid { grid-template-columns: minmax(0, 1fr); }
	.footer-brand, .contact-details { grid-column: auto; }
	.menu-toggle { gap: 6px; padding: 9px; }
}
