:root {
	--bg: #000000;
	--text: #ffffff;
}

* {
	box-sizing: border-box;
}

html,
body {
	height: 100%;
	margin: 0;
}

body {
	background: var(--bg);
	color: var(--text);
	font-family: sans-serif;
}

.hero {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	padding: 2rem 1rem;
}

.main-logo {
	width: min(85vw, 560px);
	height: auto;
	display: block;
	filter: brightness(0) invert(1);
}

.partner-logos {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.partner-logos a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.partner-logos img {
	width: min(36vw, 210px);
	height: auto;
	display: block;
	filter: brightness(0) invert(1);
	opacity: 0.95;
	transition: opacity 0.2s ease, filter 0.2s ease, transform 0.2s ease;
}

.partner-logos a:hover img,
.partner-logos a:focus-visible img {
	opacity: 1;
	filter: brightness(0) invert(1) drop-shadow(0 0 8px rgba(255, 255, 255, 0.55));
	transform: translateY(-1px);
}