/*-------------------------------------------------------------------------------------------------------

FONT FACES

-------------------------------------------------------------------------------------------------------*/

@font-face {
	font-family: "Montserrat"; 
	src: url("https://skatemolton.uk/fonts/montserrat.ttf") format("truetype"); 
	font-style: normal; 
    font-display: swap;
}

/*-------------------------------------------------------------------------------------------------------

KEYFRAMES

-------------------------------------------------------------------------------------------------------*/

@keyframes fade-animation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes half-fade-animation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 0.5;
    }
}

@keyframes quarter-fade-animation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 0.25;
    }
}

@keyframes pop-up-animation {
    0% {
        opacity: 0;
        transform: translateY(calc(var(--base-page-size) * 3.75));
    }
    100% {
        opacity: 1;
        transform: translateY(0vh);
    }
}

@keyframes pop-down-animation {
    0% {
        opacity: 0;
        transform: translateY(calc(var(--base-page-size) * -3.75));
    }
    100% {
        opacity: 1;
        transform: translateY(0vh);
    }
}

@keyframes slide-right-animation {
    0% {
        opacity: 0;
        transform: translateX(calc(var(--base-page-size) * 5));
    }
    100% {
        opacity: 1;
        transform: translateY(0vh);
    }
}

@keyframes slide-left-animation {
    0% {
        opacity: 0;
        transform: translateX(calc(var(--base-page-size) * -5));
    }
    100% {
        opacity: 1;
        transform: translateY(0vh);
    }
}

@keyframes track-loop {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(100%);
    }
}

/*-------------------------------------------------------------------------------------------------------

START

-------------------------------------------------------------------------------------------------------*/

:root {
    /* DEFAULT */
	--zoom-multiplier: 1;

	--font-family: "Montserrat";
	--active-color: 242, 156, 62;
	
	--font-weight-thin: 200;
	--font-weight-light: 300;
	--font-weight-regular: 400;
	--font-weight-medium: 500;
	--font-weight-bold: 600;
	--font-weight-black: 700;
	
	--transition-short: 50ms ease;
	--transition-medium: 200ms ease;
	--transition-long: 500ms ease;

	--optimal-aspect-ratio: 1.5;
	--default-aspect-ratio: calc(4 / 3);
	--mobile-aspect-ratio: calc(9 / 16);
	
	--absolute-pixel-size: calc(1px / var(--zoom-multiplier));

	--fixed-content-padding: min(calc(7.5vw * var(--mobile-aspect-ratio)), 7.5vh);
	--page-content-padding: max(calc((100vw - 100vh * var(--optimal-aspect-ratio) - var(--fixed-content-padding)) / 2), var(--fixed-content-padding));
	--base-page-size: calc(min(1vw / var(--optimal-aspect-ratio), 1vh) * var(--zoom-multiplier));
	
	--base-page-title-size: 3.75;
	--base-page-paragraph-size: 1.75;
	--base-page-letter-spacing: 0.0375;
	--base-page-radius: calc(var(--base-page-size) * 1.5);
	
	/* HEADER */
	--header-size: calc(10vh * var(--zoom-multiplier, 1));

	--header-logo-size: 0.615;
	--header-logo-glow: 0.1;
	--header-logo-filter: drop-shadow(0 0 calc(var(--header-size) * var(--header-logo-glow)) rgba(var(--active-color), 0.5));
	--header-logo-transform: rotate(5.5deg) scale(1.05);

	--header-link-size: 0.125;
	--header-error-area: 0.25;
	--header-underline-height: calc(2px / var(--zoom-multiplier));

	--header-button-width: 1.5;

	--header-letter-spacing: 0.125;
	
	/* FOOTER */
	--footer-size: calc(min(1vw / var(--default-aspect-ratio), 1vh) * var(--zoom-multiplier));

	--footer-form-padding: 6.25;

	--footer-form-title-size: 2;
	--footer-form-paragraph-size: 1.5;
	--footer-form-radius: 1.5;

	--footer-form-content-gap: 1.5;
	--footer-form-content-radius: 0.75;
	--footer-form-content-padding: 1.75;
	--footer-form-content-height: 5.25;
	--footer-form-content-size: 1.15;

	--footer-form-input-width: 30;
	--footer-form-button-width: 15;

	--footer-links-padding: 2.5;
	--footer-links-gap: 1.25;

	--footer-links-title-size: 1.5;
	--footer-links-link-size: 1.25;

	--footer-links-social-size: 2.95;
	--footer-links-social-radius: 25%;
	--footer-links-social-padding: 0.315;

	--footer-bottom-padding: 3.75;

	--footer-bottom-title-size: 1.75;
	--footer-bottom-legal-size: 1.25;
	--footer-bottom-circle-size: 0.25;

	--footer-letter-spacing: 0.05;
}

/*-------------------------------------------------------------------------------------------------------

MISCELLANEOUS

-------------------------------------------------------------------------------------------------------*/

/*
::selection,
::-moz-selection {
    color: rgb(255, 255, 255);
    background: rgb(0, 64, 192);
}
*/

*::-webkit-scrollbar,
*::-webkit-scrollbar-track,
*::-webkit-scrollbar-thumb {
	display: none;
}

*, *:before, *:after {
	-webkit-scrollbar: none;
    scrollbar-width: none;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	
	-webkit-tap-highlight-color: transparent;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

	overscroll-behavior: none;
	outline: none;

	margin: 0;
	padding: 0;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
	outline: none;
}

html, body {
	width: 100vw;
	height: 100vh;
	overflow: hidden;
}

html {
    text-rendering: optimizeSpeed;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "liga" 1;
	user-select: none;
}

body {
	overflow-y: scroll;
	overflow-anchor: none;
	scroll-behavior: smooth;
	background: rgb(255, 255, 255);
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}

input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

p, a, span, li, ul,
h1, h2, h3, h4, h5, h6,
label, input, textarea, button {
	font-family: var(--font-family);
	font-weight: var(--font-weight-regular);
	font-size: var(--base-page-size);
	font-style: normal;
	resize: none;
}

a, button,
input[type="button"], input[type="submit"], input[type="reset"],
input[type="checkbox"], input[type="radio"], input[type="file"],
select, [role="button"] {
    cursor: pointer;
	white-space: nowrap;
}

a {
	text-underline-offset: min(calc(0.45vw / var(--default-aspect-ratio)), 0.45vh);
	text-decoration-skip-ink: all;
	text-decoration: none;
}

svg,
img {
    -o-object-position: center;
	object-position: center;
	pointer-events: none;
    color: rgba(0, 0, 0, 0);
    font-weight: 0;
    font-size: 0;
}

svg.cover-object,
img.cover-object {
    -o-object-fit: cover;
	object-fit: cover;
}

svg.contain-object,
img.contain-object {
    -o-object-fit: contain;
	object-fit: contain;
}

/*-------------------------------------------------------------------------------------------------------

CONTENT

-------------------------------------------------------------------------------------------------------*/

/* TITLE GROUP */

.title-group {
    display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: flex-start;

	gap: calc(var(--base-page-size) * 1.5);
	padding-top: calc(calc(var(--fixed-content-padding) / 0.75) + var(--header-size));
	margin-top: calc(calc(var(--fixed-content-padding) / -0.75) + var(--header-size) * -1);
}

.title-group > h1 {
	color: rgb(0, 0, 0);
	font-weight: var(--font-weight-bold);
	font-size: calc(var(--base-page-size) * var(--base-page-title-size));
	letter-spacing: calc(var(--base-page-size) * var(--base-page-title-size) * var(--base-page-letter-spacing));
	line-height: calc(var(--base-page-size) * var(--base-page-title-size));;
	white-space: nowrap;
}

.title-group > p,
.title-group > div > p {
	color: rgb(0, 0, 0);
	font-weight: var(--font-weight-regular);
	font-size: calc(var(--base-page-size) * var(--base-page-paragraph-size));
	letter-spacing: calc(var(--base-page-size) * var(--base-page-paragraph-size) * var(--base-page-letter-spacing));
	line-height: calc(var(--base-page-size) * var(--base-page-paragraph-size) + var(--base-page-size) / 1.25);;
	white-space: normal;
}

.title-group > p > a,
.title-group > div > p > a {
    color: rgb(0, 0, 0);
    opacity: 0.15;
	font-weight: var(--font-weight-regular);
	font-size: calc(var(--base-page-size) * var(--base-page-paragraph-size));
	letter-spacing: calc(var(--base-page-size) * var(--base-page-paragraph-size) * var(--base-page-letter-spacing));
	line-height: calc(var(--base-page-size) * var(--base-page-paragraph-size) + var(--base-page-size) / 1.25);;
	white-space: nowrap;
	transition: opacity var(--transition-medium);
}

.title-group > div > p > a {
    margin-left: calc(var(--base-page-size) * var(--base-page-paragraph-size) / 2);
}

.title-group > p > a:hover,
.title-group > div > p > a:hover {
    opacity: 0.75;
}

/* SKELETON LOADING */

.skeleton-group {
    pointer-events: none !important;
}

.skeleton-object {
    color: rgba(0, 0, 0, 0) !important;
    background: rgb(250, 250, 250) !important;
    border-radius: calc(var(--base-page-radius) / 1.5) !important;
}

/* OBFUSCATION OBJECTS */
.phone-object::after {
    content: " " attr(data-end);
}

.phone-object::before {
    content: attr(data-begin);
}

.email-object::after {
    content: "@" attr(data-domain) attr(data-extension);
}

.email-object::before {
    content: attr(data-user);
}

/* CONTENT LAYOUT */

.page-group {
    display: flex;
    flex-direction: column;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: flex-start;
    
    overflow: hidden;
    background: rgb(255, 255, 255);

    width: 100vw;
    padding: calc(var(--fixed-content-padding) / 0.75) var(--page-content-padding);
}

/*-------------------------------------------------------------------------------------------------------

HEADER

-------------------------------------------------------------------------------------------------------*/

header {
    display: flex !important;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
    
	background: rgb(255, 255, 255);
	
	position: sticky;

	top: 0;
	left: 0;
	
	width: 100%;
	height: var(--header-size);
	padding: 0 var(--page-content-padding);
	
	border-bottom: var(--absolute-pixel-size) solid rgb(240, 240, 240);
	
	box-shadow: 0 0 calc(var(--header-size) / 2) rgba(0, 0, 0, 0.05);
	
	z-index: 4096;
}

header:has(.notification) {
    border-top: var(--absolute-pixel-size) solid rgb(240, 240, 240);
    margin-top: 3.5vh;
}

/* HEADER LOGO */

header > .notification {
    overflow: hidden;
    
    position: absolute;
    background: rgb(250, 250, 250);
    
    left: 0;
    bottom: calc(100% + var(--absolute-pixel-size));
    
    width: 100%;
    height: calc(3.5vh - var(--absolute-pixel-size));
}

header > .notification::after {
    content: "";
    position: absolute;
    
    background: linear-gradient(
        to right,
        rgba(250, 250, 250, 1) 0%,
        rgba(250, 250, 250, 0) 20%,
        rgba(250, 250, 250, 0) 80%,
        rgba(250, 250, 250, 1) 100%
    );
    
    top: 0;
    left: 0;
    
    width: 100%;
    height: 100%;
}

header > .notification > .notification-track {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    
    height: 100%;
    gap: 1.5vh;
    
    animation: track-loop 30s linear infinite;
}

header > .notification > .notification-track > span {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    
    color: rgb(0, 0, 0);
    opacity: 0.5;
    
    flex-shrink: 0;
    flex-grow: 0;
    
    font-weight: var(--font-weight-medium);
    font-size: 1.25vh;
    
    height: 100%;
    gap: 1.5vh;
}

header > .notification > .notification-track > span > img {
    width: 1.75vh;
    height: 1.75vh;
}

header > .header-brand {
    flex-shrink: 0;
    flex-grow: 0;
	width: calc(var(--header-size) * var(--header-logo-size));
	height: calc(var(--header-size) * var(--header-logo-size));
	will-change: transform;
	transition: -webkit-transform var(--transition-medium),
		-moz-transform var(--transition-medium),
		-o-transform var(--transition-medium),
		transform var(--transition-medium);
}

header > .header-brand:hover {
	-webkit-transform: var(--header-logo-transform);
	-moz-transform: var(--header-logo-transform);
	-o-transform: var(--header-logo-transform);
	transform: var(--header-logo-transform);
}

header > .header-brand > .foreground,
header > .header-brand > .background {
	position: absolute;
    pointer-events: none;
}

header > .header-brand > .foreground {
	top: 0;
	left: 0;
	
	width: 100%;
	height: 100%;

	z-index: 10;
}

header > .header-brand > .background {
    top: -17%;
	left: -17.5%;
	
	width: 130.5%;
	height: 130.5%;
	
	opacity: 0;
	
	-webkit-filter: var(--header-logo-filter);
    -moz-filter: var(--header-logo-filter);
    -o-filter: var(--header-logo-filter);
	filter: var(--header-logo-filter);

	transition: opacity var(--transition-medium);
	z-index: 5;
}

header > .header-brand:hover > .background {
	opacity: 1;
}

/* HEADER LINKS */
header > .header-links {
    --underline-width: 0;
	--underline-transform: 0;
	
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	
	position: relative;
	height: 52.5%;
}

header > .header-buttons {
    display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	
	width: auto;
	height: 50%;
	gap: calc(var(--header-size) * 0.1);
}

header > .header-links > .header-link > img {
    display: none;
    position: absolute;
    
    bottom: 50%;
	left: 50%;

	width: calc(var(--header-size) / 2.5);
	height: calc(var(--header-size) / 2.5);

	-webkit-transform: translate(-50%, 50%);
	-moz-transform: translate(-50%, 50%);
	-o-transform: translate(-50%, 50%);
	transform: translate(-50%, 50%);
}

header > .header-links > .header-link,
header > .header-buttons > .header-button {
	display: flex;
	justify-content: center;
	align-items: center;

	font-size: calc(var(--header-size) * var(--header-link-size));

	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: calc(var(--header-size) * var(--header-link-size) * var(--header-letter-spacing));
	
	position: relative;
	white-space: nowrap;
	
	height: 100%;
	padding: 0 calc(var(--header-size) * var(--header-error-area));
	z-index: 5;
}

header > .header-links > .header-link {
	color: rgb(0, 0, 0);
	opacity: 0.75;
	transition: opacity var(--transition-medium);
}

header > .header-links > .header-link:hover {
	opacity: 1;
}

/* MEMBERSHIP */

header > .header-buttons > .header-button {
    position: relative;
    
	color: rgb(255, 255, 255);
	background: rgb(0, 0, 0);
	
	border: none;
	border-radius: calc(var(--header-size) / 10);

	outline: calc(1px / var(--zoom-multiplier, 1)) solid rgba(0, 0, 0, 0);
	outline-offset: calc(var(--header-size) * 0.0475);

	transition: outline-color var(--transition-long);
}

header > .header-buttons > .header-button:hover {
	outline-color: rgba(0, 0, 0, 0.25);
	transition: outline-color var(--transition-medium);
}

header > .header-buttons > .header-button > .icon {
    position: absolute;
    filter: invert(1);
    
    top: 50%;
    left: 50%;
    
    width: 55%;
    height: 55%;
    
    transform: translate(-50%, -50%);
}

header > .header-buttons > .header-button > .hint {
    position: absolute;
    pointer-events: none;
    
    color: rgb(255, 255, 255);
    opacity: 0;
    
    font-weight: var(--font-weight-medium);
    font-size: calc(var(--header-size) / 10.5);
    
    background: rgb(0, 0, 0);
    border-radius: calc(var(--header-size) / 12.5);
    
    text-align: center;
    
    top: 100%;
    left: 50%;
    
    width: auto;
    height: auto;
    
    padding: calc(var(--header-size) / 12.5) calc(var(--header-size) / 10.5);
    padding-right: calc(var(--header-size) / 15);
    
    transform: translateX(-50%);
    transition: opacity var(--transition-medium), top var(--transition-long);
}

header > .header-buttons > .header-button:hover > .hint {
    opacity: 1;
    top: calc(100% + var(--header-size) / 10);
    transition: opacity var(--transition-medium), top var(--transition-medium);
}

/* SELECTION LINE */

header > .header-links::after {
	content: "";
	position: absolute;
	
	background: rgb(var(--active-color));
	border-radius: calc(var(--header-underline-height) / 2);

	width: var(--underline-width);
	height: var(--header-underline-height);
	margin: 0 calc(var(--header-size) * var(--header-error-area));
	
	left: 0;
	bottom: 0;

	-webkit-transform: var(--underline-transform);
	-moz-transform: var(--underline-transform);
	-o-transform: var(--underline-transform);
	transform: var(--underline-transform);

	pointer-events: none;
	transition: width var(--transition-medium),
		-webkit-transform var(--transition-medium),
		-moz-transform var(--transition-medium),
		-o-transform var(--transition-medium),
		transform var(--transition-medium);
}

/*-------------------------------------------------------------------------------------------------------

FOOTER

-------------------------------------------------------------------------------------------------------*/

footer {
	background-color: rgb(255, 255, 255);
	
	display: flex !important;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;

	border-top: calc(1px / var(--zoom-multiplier)) solid rgba(0, 0, 0, 0.05);
	
	gap: calc(var(--fixed-content-padding) / 0.75);
	padding: calc(var(--fixed-content-padding) / 0.75) var(--page-content-padding);
	padding-bottom: 0;
}

footer .row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
}

footer .column {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: flex-start;
}

/* FOOTER FORM */

footer > form {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	
	background-color: rgb(0, 0, 0);
	border-radius: var(--base-page-radius);

	width: 100%;
	padding: calc(var(--footer-size) * var(--footer-form-padding));
	gap: calc(var(--footer-size) * var(--footer-form-content-gap));
}

footer > form > div > h1 {
	color: rgb(255, 255, 255);
	
	font-size: calc(var(--footer-size) * var(--footer-form-title-size));
	font-weight: var(--font-weight-medium);

	white-space: nowrap;
	text-transform: uppercase;
	letter-spacing: calc(var(--footer-size) * var(--footer-form-title-size) * var(--footer-letter-spacing));
}

footer > form > div > p {
	color: rgb(255, 255, 255);
	opacity: 0.75;
	
	font-size: calc(var(--footer-size) * var(--footer-form-paragraph-size));
	font-weight: var(--font-weight-light);
	
	white-space: nowrap;
	letter-spacing: calc(var(--footer-size) * var(--footer-form-paragraph-size) * var(--footer-letter-spacing));
}

footer > form > .row {
	align-items: stretch;
	gap: calc(var(--footer-size) * var(--footer-form-content-gap));
	height: calc(var(--footer-size) * var(--footer-form-content-height));
}

footer > form > div > input,
footer > form > div > button {
	border: none;
	border-radius: calc(var(--footer-size) * var(--footer-form-content-radius));
	
	font-size: calc(var(--footer-size) * var(--footer-form-content-size));
	
	height: 100%;
	padding: 0 calc(var(--footer-size) * var(--footer-form-content-padding));
}

footer > form > div > input {
	color: rgb(255, 255, 255);
	background-color: rgb(0, 0, 0);
	border: calc(1px / var(--zoom-multiplier)) solid rgba(255, 255, 255, 0.5);
	
	opacity: 0.75;
	
	width: calc(var(--footer-size) * var(--footer-form-input-width));
	transition: opacity var(--transition-medium);
}

footer > form > div > input:hover,
footer > form > div > input:focus {
	opacity: 1;
}

footer > form > div > button {
	color: rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
	text-transform: uppercase;
	width: calc(var(--footer-size) * var(--footer-form-button-width));
	transition: background-color var(--transition-medium), box-shadow var(--transition-medium);
}

footer > form > div > button:hover {
	background-color: rgb(var(--active-color));
	box-shadow: 0 0 calc(var(--footer-size) * var(--footer-form-content-size)) rgba(var(--active-color), 0.25);
}

/* FOOTER LINKS */

footer > .footer-link-tabs {
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
}

footer > .footer-link-tabs > .footer-link-tab {
	width: 15%;
}

footer > .footer-link-tabs > .footer-link-tab > .footer-title {
	color: rgb(0, 0, 0);

	font-size: calc(var(--footer-size) * var(--footer-links-title-size));
	font-weight: var(--font-weight-bold);

	white-space: nowrap;
	text-transform: uppercase;
	
	width: 100%;
	padding-bottom: calc(var(--footer-size) * var(--footer-links-gap));
}

footer > .footer-link-tabs > .footer-link-tab > .footer-data,
footer > .footer-link-tabs > .footer-link-tab > .footer-links {
    --element-size: calc(var(--footer-size) * var(--footer-links-link-size));
    --element-padding: calc(var(--footer-size) * var(--footer-links-gap));
    
    justify-content: space-between;
    
	width: 100%;
	height: calc((var(--element-size) + var(--element-padding) * 2) * 4 + var(--element-padding));
}

footer > .footer-link-tabs > .footer-link-tab > .footer-data {
    padding: var(--element-padding, 0) 0;
}

footer > .footer-link-tabs > .footer-link-tab > .footer-data > .footer-link,
footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-link {
	color: rgb(0, 0, 0);
	opacity: 0.75;
	font-size: calc(var(--footer-size) * var(--footer-links-link-size));
	width: 100%;
	transition: opacity var(--transition-medium);
}

footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-link {
	padding: calc(var(--footer-size) * var(--footer-links-gap)) 0;
}

footer > .footer-link-tabs > .footer-link-tab > .footer-data > .footer-link {
    padding: 0;
}

footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-link:hover {
	opacity: 1;
}

/* FOOTER SOCIALS */

footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-socials {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;

	width: 100%;
	height: auto;
	gap: calc(var(--footer-size) * var(--footer-links-social-size) / 5);
}

footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-socials > .footer-social {
    width: auto;
	height: auto;
}

footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-socials > .footer-social > .footer-social-icon {
	-webkit-filter: brightness(0);
    -moz-filter: brightness(0);
    -o-filter: brightness(0);
	filter: brightness(0);
	opacity: 0.95;
	
	border-radius: var(--footer-links-social-radius);

	width: calc(var(--footer-size) * var(--footer-links-social-size));
	height: calc(var(--footer-size) * var(--footer-links-social-size));

	transition: opacity var(--transition-medium),
		-webkit-filter var(--transition-medium),
		-moz-filter var(--transition-medium),
		-o-filter var(--transition-medium),
		filter var(--transition-medium);
}

footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-socials > .footer-social:hover > .footer-social-icon {
	-webkit-filter: brightness(1);
    -moz-filter: brightness(1);
    -o-filter: brightness(1);
	filter: brightness(1);
	opacity: 1;
}

/* FOOTER BOTTOM */

footer > .footer-bottom {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;

	border-top: calc(1px / var(--zoom-multiplier)) solid rgba(0, 0, 0, 0.05);

	width: calc(100% + var(--page-content-padding) * 2);
	padding: 0 var(--page-content-padding);
}

footer > .footer-bottom > .footer-title {
	color: rgb(0, 0, 0);

	font-weight: var(--font-weight-black);
	font-size: calc(var(--footer-size) * var(--footer-bottom-title-size));
	line-height: calc(var(--footer-size) * var(--footer-bottom-title-size));

	white-space: nowrap;
}

footer > .footer-bottom > .right-divider {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
	align-items: center;

	width: 100%;
	height: 100%;
}

footer > .footer-bottom > .right-divider > a,
footer > .footer-bottom > .right-divider > p {
	color: rgb(0, 0, 0);

    font-weight: var(--font-weight-regular);
	font-size: calc(var(--footer-size) * var(--footer-bottom-legal-size));
    line-height: calc(var(--footer-size) * var(--footer-bottom-legal-size));

	white-space: nowrap;

	height: 100%;
}

footer > .footer-bottom > .right-divider > a,
footer > .footer-bottom > .right-divider > p {
	margin-left: calc(var(--footer-size) * var(--footer-bottom-legal-size) * 2);
}

footer > .footer-bottom > .right-divider > a {
	color: rgb(0, 0, 0);
	opacity: 0.75;

	position: relative;

	padding: calc(var(--footer-size) * var(--footer-bottom-legal-size) * 2);
	margin: 0;

	transition: opacity var(--transition-medium);
}

footer > .footer-bottom > .right-divider > a:hover {
	opacity: 1;
}

footer > .footer-bottom > .right-divider > a::after {
    content: "";
	position: absolute;
	pointer-events: none;

	border: calc(var(--footer-size) * var(--footer-bottom-circle-size)) solid rgb(0, 0, 0);
    border-radius: 50%;

	width: 0;
	height: 0;

	top: 50%;
    right: calc(var(--footer-size) * var(--footer-bottom-circle-size) * -1);

	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	
	opacity: 0.5;
}

/*-------------------------------------------------------------------------------------------------------

@MEDIA

-------------------------------------------------------------------------------------------------------*/

@media (max-width: 133.33vh) {
	/* HEADER */
	header > .header-brand {
		display: none;
	}

	header > .header-links {
		left: 0;
		margin-left: calc(min(2.5vw, 2.5vh) * -1);
	}

	header > .header-buttons {
		position: absolute;
		right: var(--page-content-padding);
	}
}

@media (max-width: 75vh) {
	:root {
	    /* DEFAULT */
		--base-page-title-size: 7.5;
		--base-page-paragraph-size: 3.5;
        --base-page-radius: calc(var(--base-page-size) * 3);
        
        /* FOOTER */
        --footer-form-padding: 12.5;

        --footer-form-title-size: 4;
        --footer-form-paragraph-size: 3;
        --footer-form-radius: 2;
        
        --footer-form-content-gap: 3;
    	--footer-form-content-radius: 1;
    	--footer-form-content-padding: 3.5;
    	--footer-form-content-height: 12.5;
    	--footer-form-content-size: 2.5;

    	--footer-form-input-width: 0;
    	--footer-form-button-width: 0;
    
    	--footer-links-padding: 5;
    	--footer-links-gap: 1.5;
    
    	--footer-links-title-size: 3.5;
    	--footer-links-link-size: 3;
    
    	--footer-links-social-size: 2.95;
    	--footer-links-social-radius: 25%;
    	--footer-links-social-padding: 0.315;
    
    	--footer-bottom-padding: 10;
    
    	--footer-bottom-title-size: 5;
    	--footer-bottom-legal-size: 3.25;
    	--footer-bottom-circle-size: 0.5;

    	--footer-letter-spacing: 0.05;
    }
    
    /* TITLE GROUP */
    .title-group > p > br,
    .title-group > div > p > br {
        display: none;
    }
    
    /* HEADER */
	header {
		border-bottom: none;
		border-top: var(--absolute-pixel-size) solid rgb(240, 240, 240);
		
		box-shadow: none;
		position: fixed;

		top: auto;
		bottom: 0;
		padding: 0;
	}
	
	header > .notification {
	    border-top: var(--absolute-pixel-size) solid rgb(240, 240, 240);
	}

	header > .header-links {
	    justify-content: space-between;
		left: calc(50% + var(--page-content-padding) / 2);
		transform: translateX(-50%);
		width: calc(100% + var(--page-content-padding) * 2 + min(2.5vw, 2.5vh) * 2);
		height: 100%;
	}

	header > .header-links::after {
		display: none;
	}

	header > .header-links > .header-link {		
		opacity: 0.5;

		font-size: calc(var(--header-size) * 0.075);
		
		width: 100%;
		padding: 0;
		padding-top: calc(var(--header-size) / 1.75);

		transition: color var(--transition-medium), opacity var(--transition-medium);
	}

    header > .header-links > .header-link:hover {
		color: rgb(0, 0, 0);
		opacity: 1;
	}
	
	header > .header-links > .header-link > img {
	    display: block;
	}

	header > .header-links > .header-link:nth-child(1) {
		order: 3;
	}

	header > .header-links > .header-link:nth-child(2) {
		order: 2;
	}

	header > .header-links > .header-link:nth-child(3) {
		order: 1;
	}

	header > .header-links > .header-link:nth-child(4) {
		order: 4;
	}

	header > .header-links > .header-link:nth-child(5) {
		order: 5;
	}
	
	header > .header-buttons {
	    position: absolute;
	    top: calc(-50% + 1.5vh * -2);
	}
	
	header:has(.notification) > .header-buttons {
	    top: calc(-50% + 1.5vh * -2 + -3vh);
	}
	
	header > .header-buttons > .header-button > .hint {
	    display: none;
	}
	
	header > .header-buttons::after {
	    content: "";
	    position: absolute;
	    
	    background: rgb(255, 255, 255);
	    border-radius: calc(var(--base-page-radius) * 1.5);
	    border: var(--absolute-pixel-size) solid rgb(240, 240, 240);
	    
	    top: 50%;
	    left: 50%;
	    
	    width: calc(100% + 1.5vh);
	    height: calc(100% + 1.5vh);
	    
	    transform: translate(-50%, -50%);
	    z-index: 0;
	}
	
	/* FOOTER */
	footer > form {
		flex-direction: column;
	}
	
	footer > form > div > .title,
	footer > form > div > .paragraph,
	footer > form > div {
		width: 100%;
	}
	
	footer > form > div > input {
		width: 66.66%;
	}

	footer > form > div > button {
		width: 33.33%;
	}
	
	footer > .footer-link-tabs {
		flex-direction: column;
	}

	footer > .footer-link-tabs > .footer-link-tab {
		border-top: calc(1px / var(--zoom-multiplier)) solid rgba(0, 0, 0, 0.1);

		width: 100%;
		padding: calc(var(--footer-size) * var(--footer-links-gap) * var(--footer-links-padding)) 0;
		padding-bottom: 0;

		overflow: hidden;
	}
	
	footer > .footer-link-tabs > .footer-link-tab:last-child {
		border-bottom: calc(1px / var(--zoom-multiplier)) solid rgba(0, 0, 0, 0.1);
	}
	
	footer > .footer-link-tabs > .footer-link-tab > .footer-title {
		justify-content: center;

		font-size: calc(var(--footer-size) * var(--footer-links-title-size));
		text-transform: capitalize;
		cursor: pointer;

		margin-bottom: calc(var(--footer-size) * var(--footer-links-gap) * var(--footer-links-padding));
		padding: calc(var(--footer-size) * var(--footer-links-gap) * var(--footer-links-padding)) 0;
		margin: calc(var(--footer-size) * var(--footer-links-gap) * var(--footer-links-padding) * -1) 0;

		position: relative;
	}

	footer > .footer-link-tabs > .footer-link-tab > .footer-title::after {
		content: "";
		display: inline-block;
		position: absolute;

		background-image: url('../../icons/arrow.svg');
		background-position: center;
		background-size: contain;

		width: calc(var(--footer-size) * var(--footer-links-title-size));
		height: calc(var(--footer-size) * var(--footer-links-title-size));

		vertical-align: middle;
		top: 50%;
		right: 0;
		
		-webkit-transform: translateY(-50%) rotate(90deg) scaleX(1);
		-moz-transform: translateY(-50%) rotate(90deg) scaleX(1);
		-o-transform: translateY(-50%) rotate(90deg) scaleX(1);
		-ms-transform: translateY(-50%) rotate(90deg) scaleX(1);
		transform: translateY(-50%) rotate(90deg) scaleX(1);

		transition: -webkit-transform var(--transition-medium),
			-moz-transform var(--transition-medium),
			-o-transform var(--transition-medium),
			-ms-transform var(--transition-medium),
			transform var(--transition-medium);
	}

	footer > .footer-link-tabs > .footer-link-tab.active > .footer-title::after {
		-webkit-transform: translateY(-50%) rotate(90deg) scaleX(-1);
		-moz-transform: translateY(-50%) rotate(90deg) scaleX(-1);
		-o-transform: translateY(-50%) rotate(90deg) scaleX(-1);
		-ms-transform: translateY(-50%) rotate(90deg) scaleX(-1);
		transform: translateY(-50%) rotate(90deg) scaleX(-1);
	}

    footer > .footer-link-tabs > .footer-link-tab > .footer-data,
	footer > .footer-link-tabs > .footer-link-tab > .footer-links {
	    --child-count: 0;
		--max-content-height: calc((var(--footer-size) * var(--footer-links-link-size) + var(--footer-size) * (var(--footer-links-link-size) + var(--footer-links-gap)) * 2) * var(--child-count, 0) + var(--footer-size) * var(--footer-links-gap) * var(--footer-links-padding) / 2);
		
		justify-content: flex-start;
		align-items: stretch;
		pointer-events: none;
		overflow: visible;

		width: 100%;

		opacity: 0;
		height: 0;
		margin-top: calc(var(--footer-size) * var(--footer-links-gap) * var(--footer-links-padding));
		margin-bottom: 0;

		transition: opacity var(--transition-medium), height var(--transition-medium), margin-bottom var(--transition-medium);
	}

    footer > .footer-link-tabs > .footer-link-tab.active > .footer-data,
	footer > .footer-link-tabs > .footer-link-tab.active > .footer-links {
		pointer-events: all;
		opacity: 1;
		height: var(--max-content-height);
		margin-bottom: calc(var(--footer-size) * var(--footer-links-gap) * var(--footer-links-padding));
	}
	
	footer > .footer-link-tabs > .footer-link-tab > .footer-data {
        padding: 0;
    }
    
    footer > .footer-link-tabs > .footer-link-tab > .footer-data > .footer-link {
        padding: calc(var(--footer-size) * (var(--footer-links-link-size) + var(--footer-links-gap))) 0;
    }

    footer > .footer-link-tabs > .footer-link-tab > .footer-data > .footer-link,
	footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-link {
		width: 100%;
		font-size: calc(var(--footer-size) * var(--footer-links-link-size));
		padding: calc(var(--footer-size) * (var(--footer-links-link-size) + var(--footer-links-gap))) 0;
	}


	footer > .footer-link-tabs > .footer-link-tab > .footer-links > .footer-socials {
		display: none;
	}

	footer > .footer-bottom {
		flex-direction: column;
		padding: calc(var(--footer-size) * var(--footer-bottom-padding)) 0;
	}

	footer > .footer-bottom > .footer-title {
		font-size: calc(var(--footer-size) * var(--footer-bottom-title-size));
	}

	footer > .footer-bottom > .right-divider {
		justify-content: center;
		flex-wrap: wrap;
	}

	footer > .footer-bottom > .right-divider > a:nth-child(3)::after {
		content: none;
	}

	footer > .footer-bottom > .right-divider > p {
		text-align: center;
		flex-shrink: 0;
		flex-grow: 0;
		width: 100%;
		margin: 0;
	}
	
	section.header-buffer-zone {
	    display: block !important;
	    
	    width: 100%;
	    height: calc(var(--header-size) * 2);
	}
}

/*-------------------------------------------------------------------------------------------------------

END

-------------------------------------------------------------------------------------------------------*/