/* Font setup */

@font-face {
	font-family: "kepler-std-regular";
	font-display: auto;
	font-style: normal;
	font-stretch: normal;
	font-weight: 400;
	src:
		url("fonts/kepler_std_regular.60d48112a941.woff") format("woff2"),
		url("fonts/kepler_std_regular.60d48112a941.woff") format("woff"),
		url("fonts/kepler_std_regular.ba089ae82631.otf") format("opentype");
}

@font-face {
	font-family: "kepler-std-semibold";
	font-display: auto;
	font-style: normal;
	font-stretch: normal;
	font-weight: 600;
	src:
		url("fonts/kepler_std_semibold.3e83d74f31de.woff2") format("woff2"),
		url("fonts/kepler_std_semibold.3e83d74f31de.woff2") format("woff"),
		url("fonts/kepler_std_semibold.2dbce90fd309.otf") format("opentype");
}

@font-face {
	font-family: "kepler-std-semibold-condensed-display";
	font-display: auto;
	font-style: normal;
	font-stretch: normal;
	font-weight: 600;
	src:
		url("fonts/kepler_std_semibold_condensed_display.7c47b954dccc.woff2") format("woff2"),
		url("fonts/kepler_std_semibold_condensed_display.35985fa6e179.woff") format("woff"),
		url("fonts/kepler_std_semibold_condensed_display.0402cd4ad3a9.otf") format("opentype");
}

@font-face {
	font-family: "kepler-std-condensed-display";
	font-display: auto;
	font-style: normal;
	font-stretch: normal;
	font-weight: 600;
	src:
		url("fonts/kepler_std_condensed_display.5383ed9599d5.woff2") format("woff2"),
		url("fonts/kepler_std_condensed_display.49e1bf2fb0b5.woff") format("woff"),
		url("fonts/kepler_std_condensed_display.ada98d6e4bc2.otf") format("opentype");
}

@font-face {
	font-family: "kepler-std-medium-condensed-display";
	font-display: auto;
	font-style: normal;
	font-stretch: normal;
	font-weight: 600;
	src:
		url("fonts/kepler_std_medium_condensed_display.14e6af360c76.woff2") format("woff2"),
		url("fonts/kepler_std_medium_condensed_display.184893c5a457.woff") format("woff"),
		url("fonts/kepler_std_medium_condensed_display.efcbaa6187e7.otf") format("opentype");
}

@font-face {
	font-family: "krul";
	font-display: auto;
	font-style: normal;
	font-stretch: normal;
	font-weight: 400;
	src:
		url("fonts/krull.f59523208a84.woff2") format("woff2"),
		url("fonts/krull.758ed6270721.woff") format("woff"),
		url("fonts/krull.553d2788e650.otf") format("opentype");
}

/* Global theme setup */

:root {
	--scale-factor: 1;
	--theme-color-beige: #fff1d3;
	--theme-color-purple: #543649;
	--theme-color-pink: #cb448b;
	--theme-color-blue: #168bc0;
	--theme-color-red: #bd3033;
	--theme-color-dark: #1f1f1f;

	--pico-block-spacing-vertical: 1rem;
	--pico-line-height: 1.2;
	--pico-form-element-spacing-vertical: 0.5rem;

	--pico-font-family: "kepler-std-regular", serif;
	font-family: "kepler-std-regular", serif;

	--pico-font-size: 120%;

	--pico-color: var(--theme-color-beige);
	color: var(--theme-color-beige);
}

/* Support for wide color gamut displays */
@media (color-gamut: p3) {
	:root {
		--theme-color-dark: color(display-p3 0.135 0.135 0.135);
	}
}

/* Sticky footer */

* {
	box-sizing: inherit;
}

html {
	height: 100%;
	box-sizing: border-box;
}

body {
	height: 100%;
}

.page-wrapper {
	min-height: 100vh;
	display: grid;
	grid-template-rows: auto 1fr auto;
}

/* Override pico font size: increase by 20% */
@media (min-width: 576px) {
	:root,
	:host {
		--pico-font-size: 126.25%;
	}
}
@media (min-width: 768px) {
	:root,
	:host {
		--pico-font-size: 132.5%;
	}
}
@media (min-width: 1024px) {
	:root,
	:host {
		--pico-font-size: 138.75%;
	}
}
@media (min-width: 1280px) {
	:root,
	:host {
		--pico-font-size: 145%;
	}
}
@media (min-width: 1536px) {
	:root,
	:host {
		--pico-font-size: 151.25%;
	}
}

/* Mobile responsive scale system */
@media (max-width: 1280px) {
	:root {
		--scale-factor: 0.9;
	}
}

@media (max-width: 768px) {
	:root {
		--scale-factor: 0.5;
	}
}

@media (max-width: 480px) {
	:root {
		--scale-factor: 0.35;
	}
}

/* For dark theme, only one used */
[data-theme="dark"],
:root:not([data-theme="light"]),
:host(:not([data-theme="light"])) {
	background-color: var(--theme-color-dark);
	--pico-primary-background: var(--theme-color-purple);
	--pico-primary-hover-background: var(--theme-color-pink);
	--pico-primary-focus: var(--theme-color-pink);
}

/* Helpers */

.text-center {
	text-align: center;
}

/* Default header */

.headers-names-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 4.959rem;
}
.header-names-logo {
	width: 10.165rem;
	margin-bottom: 5.95rem;
}

/* Footer */

.page-footer {
	color: var(--theme-color-beige);
	text-transform: uppercase;
	font-size: 0.826rem;
	text-align: center;
	margin-top: 0.413rem;
	margin-bottom: 0.413rem;
	font-family: "kepler-std-semibold", serif;
}

.page-footer-elevator {
	cursor: pointer;
}

.page-footer-cat {
	cursor: pointer;
}

/* HTTP error pages */

.http-error-container {
	text-align: center;
	color: var(--theme-color-beige);
}

.http-error-container > h1 {
	color: var(--theme-color-blue);
}