/* global */
@import url("_reset.css");
@import url("_normalize.css");
@import url("_fonts.css");
@import url("_vars.css");

/* blocks */
@import url("blocks/_header.css");
@import url("blocks/_logo.css");
@import url("blocks/_hero.css");
@import url("blocks/_news.css");
@import url("blocks/_schedule.css");
@import url("blocks/_mobile.css");
@import url("blocks/_beginner.css");
@import url("blocks/_gallery.css");
@import url("blocks/_documents.css");
@import url("blocks/_contacts.css");

/* styles */
section:not(:last-child) {
	margin-bottom: 2rem;
}

body {
	padding: 2rem 0;
	font-family: var(--font-family);
	color: var(--accent-text);
	background-color: var(--gray);
}

main {
    display: flex;
    flex-direction: column;
}

body.lock {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100%;
}

.container {
    margin: 0 auto;
    padding: 0 var(--container-offset);
	width: 100%;
    max-width: calc(var(--container-width) + (var(--container-offset) * 2));
}

.hero {
    order: 0;
}

#news-committee {
    order: 1;
}

#gallery {
    order: 2;
}

#documents {
    order: 3;
}

#news-group {
    order: 4;
}

#schedule {
    order: 5;
}

#mobile {
    order: 6;
}

#beginner {
    order: 7;
}

#contacts {
    order: 8;
}

.title {
	margin-bottom: 2rem;
	padding: 0.25rem;
	background-color: var(--white);
	border: 1px solid var(--accent-text);
	border-radius: 1rem;
	font-weight: 700;
	font-size: clamp(1.125rem, 2vw, 1.5rem);
	text-align: center;
	text-transform: uppercase;
	box-shadow: var(--box-shadow);
}

.btn {
	margin-top: auto;
    padding: 0.5rem;
    cursor: pointer;
	color: var(--accent-text);
	background-color: var(--white);
	border-radius: 1rem;
	border: 1px solid var(--accent-text);
	transition: var(--transition);
	box-shadow: var(--box-shadow);
}

.btn:hover {
	background-color: var(--light-text);
	color: var(--white);
}

/* Плавный скролл */
:target {
    scroll-margin-top: 147.4px;
}
/* Если нужно поддерживать старые браузеры */
@supports not (scroll-margin-top: 147.4px) {
    :target::before {
        content: "";
        display: block;
        height: 147.4px;
        margin: -147.4px 0 0;
    }
}