/* narrow screen and mobile devices*/
@media (max-aspect-ratio: 1.6/1) or (((max-width: 1024px) or (max-height: 1024px)) and (pointer: coarse)) {
	:root {
		--contentSize: 100vmin;
	}

	.section.about .sticky {
		display: none;
	}

	.section.work .subSection,
	.section.schools .subSection {
		flex-direction: column;
	}

	.section.schools,
	.section.contacts {
		height: auto;
		padding: var(--containerGap);
	}
}

/* portrait */
@media (orientation: portrait) {
	.section.home {
		background-position: bottom;
	}

	.section.home .container {
		width: var(--sContentSize);
		height: 38vmax;
		bottom: 18vmax;
	}

	.section.home .container .buttonsContainer {
		margin-top: var(--containerGap);
	}

	.section.contacts .contactSubSection {
		padding: var(--containerGap);
	}
}

@media (orientation: portrait) or (((max-width: 1024px) or (max-height: 1024px)) and (pointer: coarse)) {
	:root {
		--contentSize: auto;
	}

	.tag {
		white-space: nowrap;
	}

	header {
		z-index: 100;
	}

	header .headerSection {
		z-index: 101;
	}

	header .navigation {
		z-index: 99;
	}

	header .logoText::after {
		bottom: -.5vmin;
	}

	header .headerSection .navigationButtonContainer {
		display: flex;
	}

	header {
		justify-content: center;
		flex-direction: column;
		gap: 0;
	}

	header .headerSection {
		height: 100%;
		align-items: center;
		justify-content: space-between;
	}

	header .headerSection button {
		width: max-content;
	}

	header .navigation {
		position: fixed;
		width: 100%;
		top: var(--headerHeight);
		left: 0;
		z-index: -1;
		transform: translateY(-100vh);
	}

	header .navigation.open {
		transform: translateY(0);
	}

	header .navigation ul {
		width: 100%;
		flex-direction: column;
		padding: 0;
		gap: 0;
	}

	header .navigation ul li a {
		display: flex;
		height: 12vmin;
		align-items: center;
		padding-left: 10vmin;
		border-bottom: .1vmin solid var(--s3);
		margin: 0;
	}

	.section.contacts .contactSubSection {
		padding: var(--containerGap);
	}
}

/* portrait*/
@media (orientation: portrait) {
	.tag {
		white-space: nowrap;
	}

	.section.home {
		background-position: bottom;
	}

	.section.home .container {
		width: var(--sContentSize);
		height: 38vmax;
		bottom: 18vmax;
	}

	.section.home .container .buttonsContainer {
		margin-top: var(--containerGap);
	}
}

@media ((max-width: 1024px) or (max-height: 1024px)) and (pointer: coarse) {
	:root {
		--contentSize: 70vw;
		--buttonWidth: 35vmin;
		--menuTextSize: 3vmin;
		--xbTextSize: 6vmin;
		--bTextSize: 4.7vmin;
		--mTextSize: 4vmin;
		--textSize: 3.5vmin;
		--textHeight: 6vmin;
		--compressed: 5vmin;
		--sTextSize: 3vmin;
		--xsTextSize: 2.5vmin;
	}

	.section .container {
		text-align: left;
	}

	.section.home .message,
	.section.home .scroll {
		display: none;
	}

	.section.about {
		height: auto;
		padding: var(--containerGap);
	}

	.section.home .buttonsContainer {
		margin-top: var(--containerGap);
	}

	.section.about .subSection {
		padding: var(--containerGap);
	}

	.section.about .subSection,
	.section.about .header {
		width: var(--contentSize);
	}

	.section.skills .rowSection {
		flex-direction: column;
	}

	.section.contacts {
		justify-content: start;
	}

	.section.contacts .container {
		height: 30vmin;
	}

	.section.contacts .container .value,
	.section.contacts .container .copy {
		font-size: var(--sTextSize);
	}

	@media (orientation: portrait) {
		:root {
			--contentSize: auto;
			--headerHeight: 6vh;
			--buttonWidth: 40vmin;
			--menuTextSize: 3vmin;
			--xbTextSize: 6vmin;
			--bTextSize: 4.7vmin;
			--bTextHeight: 6vmin;
			--bCompressed: 6vmin;
			--mTextSize: 4vmin;
			--mTextHeight: 5vmin;
			--mCompressed: 5vmin;
			--textSize: 3.5vmin;
			--textHeight: 6vmin;
			--compressed: 5vmin;
			--sTextSize: 3vmin;
			--xsTextSize: 2.5vmin;
		}

		.section.home .container {
			height: 30vh;
		}

		.section.home .container .buttonsContainer {
			flex-direction: column;
			gap: 0;
		}
	}
}