@font-face {
    font-family: CeraPro;
    font-weight: 300;
    src: url(/fonts/cerapro-300.woff2) format("woff2"),
        url(/fonts/cerapro-300.woff) format("woff")
}
@font-face {
    font-family: CeraPro;
    font-weight: 400;
    src: url(/fonts/cerapro-400.woff2) format("woff2"),
        url(/fonts/cerapro-400.woff) format("woff")
}
@font-face {
    font-family: CeraPro;
    font-weight: 500;
    src: url(/fonts/cerapro-500.woff2) format("woff2"),
        url(/fonts/cerapro-500.woff) format("woff")
}
@font-face {
    font-family: CeraPRO;
    font-weight: 700;
    src: url(/fonts/cerapro-700.woff2) format("woff2"),
        url(/fonts/cerapro-700.woff) format("woff")
}
:root {
    --fs--2: clamp(0.52rem, 0.6vw, 0.8rem);
    --fs--1: clamp(0.75rem, 0.579rem + 0.329vw, 0.98rem);
    --fs-0: clamp(0.9rem, 0.8482rem + 0.2857vw, 1.2rem);
    --fs-1: clamp(1.0625rem, 0.8393rem + 0.7143vw, 1.6rem);
    --fs-2: clamp(1.763rem, 0.7212rem + 2.6923vw, 3.75rem);
    --fs-3: clamp(1.575rem, 0.1923rem + 5.3846vw, 9rem);
    --fs-4: clamp(1.6875rem, 0.364rem + 8.0769vw, 11rem);
    --fs-5: clamp(1.9rem, 15.3vw - 0.2rem, 21rem);
    --content-size: min(100% - 2rem, 1100px);
    --view-outline: 4px;
    --foreground: #000;
    --background: #FFF;
}
body {
    font-family: CeraPRO, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: var(--fs-0);
    font-weight: 500;
    line-height: 160%;
    color: var(--foreground);
    background-color: var(--background);
    margin: 0;
    padding: 0;
    display: grid;
    grid-auto-columns: 1fr;
    min-block-size: 100dvh;
    scroll-behavior: smooth;
}
a {
    color: #454545;
    color: color-mix(in srgb, var(--foreground) 60%, var(--background));
    transition: 0.3s color linear;
    text-decoration: none;
}
a:hover {
    color: #676767;
    color: color-mix(in srgb, var(--foreground) 70%, var(--background));
}
h2,
p,
button,
.button {
	text-wrap: balance;
	text-transform: uppercase;
	line-height: 130%;
	margin-block: 0;
}
h1 {
	font-size: var(--fs-2);
	font-weight: 400;
	padding-block: clamp(0.3rem, 2vw + 2vh, 1.4rem);
}
h1,
p {
	position: relative;
	margin-block: 0;
}
input,
select,
textarea,
button {
	font-family: inherit;
	font-size: inherit;
}
main {
	display: grid;
	position: relative;
	text-align: center;
	justify-content: center;
	align-content: center;
	scroll-margin: 0;
}
main > :first-child {
	box-shadow: 0 0 0 var(--view-outline) var(--background) inset, 0 0 0 0 var(--foreground) inset;
	transition: 0.5s box-shadow ease-in-out 0.2s;
}
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	inline-size: 1px;
	word-wrap: normal;
}
.full {
	inline-size: 100vw;
}
.dark {
	--foreground: #FFF;
	--background: #000;
	color: var(--foreground);
	background-color: var(--background);
}
.countdown {
	font-size: var(--fs-5);
}
.countdown time {
	display: flex inline;
	flex-wrap: wrap;
	align-content: center;
	line-height: 100%;
	gap: 0.1ex;
}
.countdown time > span {
	display: grid;
	gap: 0.1lh 0;
}
.countdown time .digits:not(.days) {
	min-inline-size: 2ch;
}
.countdown time .digits .number {
	letter-spacing: -0.02ch;
}
.countdown .unit {
	display: none;
	font-size: var(--fs--2);
	font-weight: 700;
	text-transform: uppercase;
	line-height: 300%;
	letter-spacing: 0.01ch;
}
.countdown.units .unit {
	display: block;
}
.countdown .colon {
	font-size: 0.5em;
}
.countdown:has(video) {
	overflow: hidden;
}
.countdown video {
	position: absolute;
	inset: 0;
	translate: 0 -50%;
	pointer-events: none;
	filter: brightness(1%) opacity(1);
	z-index: -1;
}
.countdown.video video {
	filter: none;
}
@media (width >= 1000px) {
	.countdown .unit {
		font-size: var(--fs--1);
	}
}