@charset "utf-8";

/* ====================================================================================================
	@font-face
==================================================================================================== */

/* Martian Mono
================================================================================ */
@font-face{font-family:"Martian Mono";src:url("../fonts/martian-mono/300-martian-mono-light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:"Martian Mono";src:url("../fonts/martian-mono/400-martian-mono-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:"Martian Mono";src:url("../fonts/martian-mono/500-martian-mono-medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:"Martian Mono";src:url("../fonts/martian-mono/600-martian-mono-semibold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:"Martian Mono";src:url("../fonts/martian-mono/700-martian-mono-bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:"Martian Mono";src:url("../fonts/martian-mono/800-martian-mono-extrabold.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}


/* ====================================================================================================
	reset styles
==================================================================================================== */
*,*::before,*::after{box-sizing:border-box;-webkit-overflow-scrolling:touch;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}html{height:100%;scrollbar-gutter:stable}body{min-height:100%;margin:0;-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}:where(blockquote,figure){margin:0}:where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,p,table,address,pre,iframe,form){margin-block:0}:where(ul,ol){padding-left:0;list-style:none}:where(dd){margin-left:0}:where(sub),:where(sup){position:relative;vertical-align:baseline;font-size:75%;line-height:0}:where(sub){bottom:-.25rem}:where(sup){top:.5rem}:where(a){background-color:transparent;user-select:none;color:inherit;text-decoration:none}:where(address){font-style:normal}:where(pre),:where(code),:where(kbd),:where(samp){font-family:monospace}:where(abbr[title]){border-bottom:none;text-decoration:underline;text-decoration:underline dotted}:where(img){display:block;width:100%;max-width:100%;border-style:none}:where(table){width:100%;border-collapse:collapse;border-spacing:0}:where(fieldset){margin-left:0;padding:0;border:none}input,textarea,select,button{font:inherit}:where(label[for]){cursor:pointer}:where(button),:where([type="button"]),:where([type="reset"]),:where([type="submit"]){border-color:var(--border-color);user-select:none;-webkit-appearance:none;appearance:none;cursor:pointer}:where([type="number"]::-webkit-inner-spin-button),:where([type="number"]::-webkit-outer-spin-button){height:auto}:where([type="search"]){-webkit-appearance:textfield;appearance:textfield;outline-offset:-2px}:where(textarea){resize:vertical}svg *[fill]{fill:currentColor}svg *[stroke]{stroke:currentColor}svg *{transition-property:fill,stroke}:where(iframe){border:0}:where([hidden]){display:none!important}@media (prefers-reduced-motion:no-preference){html,:has(:target){scroll-behavior:smooth}}@media (prefers-reduced-motion:reduce){*,::before,::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}


/* ====================================================================================================
	variables
==================================================================================================== */
:root {
	--white-color: hsl(0 0% 100%);
	--black-color: hsl(30 100% 6%);

	--text-color: hsl(0 0% 20%);
	--main-color: hsl(44 20% 81%);
	--second-color: hsl(180 9% 55%);
	--green-color: hsl(149 100% 33%);

	--main-font: "Martian Mono";

	--border-color: hsl(44 20% 81%);
	--container-center-padding-inline: .875rem;
	--container-center-padding-block-index: 2.5rem;
}


/* ====================================================================================================
	layouts
==================================================================================================== */
body {
	min-width: 320px;
	color: var(--text-color);
	font: normal normal 300 1.125rem/1.2 var(--main-font), sans-serif;
}

/* если использую rdn-nav */
@media (max-width: 1199.98px) {

	body {
		padding: 3.5rem 0 0;
	}

}
/* /если использую rdn-nav */

.wrapper {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	overflow: hidden;
}

.container-center {
	width: 100%;
	max-width: 1320px;
	margin-inline: auto;
	padding-inline: var(--container-center-padding-inline);
}

/* @media desktop-first
================================================================================ */
@media (max-width: 1399.98px) {

	.container-center {
		max-width: 1140px;
	}

}

@media (max-width: 1199.98px) {

	.container-center {
		max-width: 960px;
	}

}

@media (max-width: 991.98px) {

	.container-center {
		max-width: none;
	}

}

/* container-flex
================================================================================ */
.container-flex {
	display: flex;
	flex-wrap: wrap;
}

.container-flex > * {
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: auto;
	width: auto;
	align-self: auto;
	order: 0;
}

/* main, content + sidebar
================================================================================ */
.main {
	flex-grow: 1;

	/* background: #FFCCFF; */
}

.main.container-center {
	padding: 3.75rem var(--container-center-padding-inline) 5rem;

	/* background: salmon; */
}


/* ====================================================================================================
	common elements and effects
==================================================================================================== */

/* up-page
================================================================================ */
.up-page {
	display: block;
	position: fixed;
	right: 1.875rem;
	bottom: 6.25rem;
	z-index: 200;
	width: 3.75rem;
	height: 3.75rem;
	border: .063rem solid hsl(0 0% 100% / .75);
	border-radius: var(--border-radius);
	background: var(--main-color) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='hsl(0 0% 100%)'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z'/%3E%3C/svg%3E") no-repeat center / auto 1.875rem;
	visibility: hidden;
	opacity: 0;
	transition: visibility .2s linear .02s,
				opacity .2s linear .02s,
				background-color .2s linear .02s;
	cursor: pointer;
}

@media (max-width: 1199.98px) {

	.up-page {
		display: none;
	}

}

@media (hover: hover) and (pointer: fine) {

	.up-page:hover {
		background-color: var(--second-color);
	}

}

/* typography
================================================================================ */
/* h1 - h6
============================================================ */
.main h1:not([class]),
.main .h1 {
	margin-bottom: 2.5rem;
	color: var(--black-color);
	font-weight: 400;
	font-size: clamp(1.5rem, 1.34rem + 0.8vw, 2rem);
	line-height: 1.4;
	text-transform: uppercase;
	text-align: center;
}


.main h2:not([class]),
.main .h2 {
	margin: 2.5rem 0 1.875rem;
	color: var(--black-color);
	font-weight: 400;
	font-size: clamp(1.375rem, 1.255rem + 0.6vw, 1.75rem);
	line-height: 1.4;
	text-transform: uppercase;
	text-align: center;
}


.main h3:not([class]),
.main .h3 {
	margin: 2.5rem 0 1.875rem;
	color: var(--black-color);
	font-weight: 400;
	font-size: clamp(1.25rem, 1.21rem + 0.2vw, 1.375rem);
	line-height: 1.4;
	text-transform: uppercase;
	text-align: center;
}


.main h4:not([class]),
.main .h4 {
	margin: 2.5rem 0 1.25rem;
	color: var(--black-color);
	font-weight: 500;
	font-size: 1.125rem;
	line-height: 1.4;
	text-transform: uppercase;
}

/* text elements
============================================================ */
.main p {
	margin: 0 0 1rem;
	line-height: 1.5;
}

.main p a {
	color: var(--second-color);
	text-decoration: underline;
}

@media (hover: hover) and (pointer: fine) {

	.main p a:hover {
		text-decoration: none;
	}

}

.bold-500 {
	font-weight: 500;
}

.bold-600 {
	font-weight: 600;
}

strong,
.bold-700 {
	font-weight: 700;
}

.bold-800 {
	font-weight: 800;
}

.center {
	text-align: center;
}

.uppercase {
	text-transform: uppercase;
}

mark {
	padding: 0 .25rem;
	background: hsl(50, 81%, 94%);
}

small {
	font-size: 80%;
}

sub,
sup {
	position: relative;
	vertical-align: baseline;
	font-size: 75%;
	line-height: 0;
}

sub {
	bottom: -.25rem;
}

sup {
	top: -.5rem;
}

/* btn
============================================================ */
.btn {
	display: flex;
	flex-wrap: wrap;
	margin-block: 1.875rem;
}

/* a-btn
======================================== */
.a-btn {
	position: relative;
	z-index: 1;
	margin: 0 .625rem .625rem 0;
	padding: 1rem 1.5rem;
	background: var(--main-color);
	color: var(--white-color);
	font-weight: 400;
	font-size: clamp(0.875rem, 0.795rem + 0.4vw, 1.125rem);
	text-transform: uppercase;
	transition: background .2s linear .02s;
}



@media (hover: hover) and (pointer: fine) {

	.a-btn:hover {
		background: var(--second-color);
	}

}

.a-btn:active {
	background: var(--second-color);
}

/* img
================================================================================ */
.main :where(figure) {
	margin-block: 2.5rem;
}

.main :where(figure) img {
	border-radius: var(--border-radius);

	/* border: 1px solid red; */
}

/* .img-fluid img {
} */


:where(.img-center) {
	max-width: 60rem;
	margin-inline: auto;
}

:where(.img-center) img:not(:last-child) {
	margin-bottom: 1.875rem;
}


:where(.img-several) {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

:where(.img-several) a {
	flex-basis: 33.3333%;
	width: 33.3333%;
	padding-inline: clamp(0.313rem, 0.2132rem + 0.4992vw, 0.625rem);
}


.main :where(figcaption) {
	flex-basis: 100%;
	width: 100%;
	margin: .625rem 0 0;
	color: var(--grey-color);
	text-align: right;

	/* background: powderblue; */
}

.img-center :where(figcaption) {
	text-align: center;
}

/* img-hover
============================================================ */
.img-hover {
	position: relative;
	cursor: pointer;
	

	/* border: 3px solid red; */
}

.img-hover::before {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 3.125rem;
	height: 3.125rem;
	background: hsl(0 0% 100% / .8) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='hsl(180 9% 55%)'%3E%3Cpath d='M800-600v-95.38q0-9.24-7.69-16.93-7.69-7.69-16.93-7.69H680v-40h95.38q27.62 0 46.12 18.5Q840-723 840-695.38V-600h-40Zm-680 0v-95.38q0-27.62 18.5-46.12Q157-760 184.62-760H280v40h-95.38q-9.24 0-16.93 7.69-7.69 7.69-7.69 16.93V-600h-40Zm560 400v-40h95.38q9.24 0 16.93-7.69 7.69-7.69 7.69-16.93V-360h40v95.38q0 27.62-18.5 46.12Q803-200 775.38-200H680Zm-495.38 0q-27.62 0-46.12-18.5Q120-237 120-264.62V-360h40v95.38q0 9.24 7.69 16.93 7.69 7.69 16.93 7.69H280v40h-95.38Zm89.23-153.85v-252.3h412.3v252.3h-412.3Zm40-40h332.3v-172.3h-332.3v172.3Zm0 0v-172.3 172.3Z'/%3E%3C/svg%3E") no-repeat center / auto 100%;
	visibility: hidden;
	opacity: 0;
	transition: all .2s linear .02s;
}

@media (hover: hover) and (pointer: fine) {

	.img-hover:hover::before {
		visibility: visible;
		opacity: 1;
	}

}

/* video
================================================================================ */
.video-wrapper {
	max-width: 60rem;
	margin: 2.5rem auto;
}

.video {
	position: relative;
	padding-bottom: 56.25%; /* задаёт высоту контейнера для 16:9 (если 4:3 — поставьте 75%) */
	height: 0;
	overflow: hidden;
	border-radius: var(--border-radius);

	/* background: red; */
}

.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* grid-a-btns
================================================================================ */
.grid-a-btns {
	display: flex;
	max-width: 60rem;
	margin-inline: auto;
	flex-wrap: wrap;

	/* background: #08C; */
}


.cell-a-btns {
	flex-basis: 50%;
	width: 50%;
	padding: clamp(.625rem, 0.025rem + 3vw, 2.5rem);
	padding-left: clamp(1.5rem, -0.02rem + 7.6vw, 6.25rem);
	color: var(--second-color);
	font-size: clamp(1rem, 0.92rem + 0.4vw, 1.25rem);
	line-height: 1.4;
	transition: color .2s linear .02s;

	/* background: palevioletred; */
}

@media (hover: hover) and (pointer: fine) {

	.cell-a-btns:hover {
		color: var(--text-color);
	}

}

.cell-a-btns:active {
	color: var(--text-color);
}

/* portfolio-grid
================================================================================ */
.portfolio-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

@media (max-width: 767.98px) {

	.portfolio-grid {
		justify-content: center;
	}

}


.portfolio-cell {
	flex-basis: 25%;
	width: 25%;
	/* padding: .313rem; */
}

@media (max-width: 767.98px) {

	.portfolio-cell {
		flex-basis: 33.3333%;
		width: 33.3333%;
	}

}

@media (max-width: 575.98px) {

	.portfolio-cell {
		flex-basis: 50%;
		width: 50%;
	}

}


/* ====================================================================================================
	header
==================================================================================================== */
/* .header {
	background: #FFCC00;
} */

/* rd-navbar - common
==================================================================== */
.rd-navbar-static.rd-navbar--is-clone,
.rd-navbar-static .rd-navbar-dropdown,
.rd-navbar-static .rd-navbar-megamenu,
.rd-navbar-fixed .rdn-nav,
.rd-navbar-fixed .rd-navbar-submenu,
.rd-navbar-fixed .rd-navbar-submenu-toggle,
.rdn-cart,
.rd-navbar-static .rdn-cart-buy,
.rd-navbar-fixed .rdn-cart-floating,
.rd-navbar-fixed .rdn-cart-floating::before,
.rd-navbar-fixed .rdn-cart-floating .rdn-cart-buy,
.rd-navbar-fixed .rd-navbar-search .form-group {

/* еще один выпадающий блок */
/* .rd-navbar-fixed .rd-navbar-collapse,
.rd-navbar-fixed .rd-navbar-collapse::before { */
	transition: all 0.3s cubic-bezier(.785, .135, .15, .86);
}

.rd-navbar,
.rd-navbar.rd-navbar--is-clone {
	display: none;
}

.rd-navbar-fixed,
.rd-navbar-static,
.rd-navbar-fullwidth,
.rd-navbar-sidebar {
	display: block;
}

.rd-navbar--no-transition,
.rd-navbar--no-transition * {
	transition: none !important;
}

.rd-navbar-static {
	background: var(--white-color);
}

.rd-navbar-static.rd-navbar--is-clone {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 20;
	transform: translateY(-105%);

	/* display: none !important;
	background: red; */
}

.rd-navbar-static.rd-navbar--is-clone.rd-navbar--is-stuck {
	transform: translateY(0);
}

.rd-navbar-static.rd-navbar--is-stuck {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	z-index: 20;
}


	.rd-navbar-fixed .rdn-fixed-panel {
		position: fixed;
		left: 0;
		top: 0;
		z-index: 16;
		width: 100%;
		height: 3.5rem;
		box-shadow: 0 .063rem .125rem 0 rgb(0 0 0 / .3);
		background: var(--main-color);
	}

/* rdn-nav-toggle
================================================ */
.rdn-nav-toggle {
	display: none;
}

	.rd-navbar-fixed .rdn-nav-toggle {
		display: block;
		position: fixed;
		top: .25rem;
		right: .875rem;
		z-index: 17;
		width: 2.25rem;
		height: 3rem;
		padding: 0;
		border: none;
		background: transparent;
		cursor: pointer;

		/* background: red; */
	}

	.rd-navbar-fixed .rdn-nav-toggle span {
		display: block;
		position: relative;
		width: 100%;
		height: .063rem;
		margin: auto;
		background: var(--black-color);
		backface-visibility: hidden;
		transition: all .3s ease;
		transform: rotate(180deg);
	}

	.rd-navbar-fixed .rdn-nav-toggle span::before,
	.rd-navbar-fixed .rdn-nav-toggle span::after {
		content: "";
		position: absolute;
		top: .625rem;
		left: 0;
		width: 100%;
		height: .063rem;
		background: var(--black-color);
		backface-visibility: hidden;
		transition: all .3s ease;
		transform-origin: .1071rem center;
	}

	.rd-navbar-fixed .rdn-nav-toggle span::after {
		top: -.625rem;
	}


	.rd-navbar-fixed .rdn-nav-toggle.active span {
		transform: rotate(360deg);
	}

	.rd-navbar-fixed .rdn-nav-toggle.active span::before,
	.rd-navbar-fixed .rdn-nav-toggle.active span::after {
		top: -.063rem;
		left: 0;
		width: .875rem;
	}

	.rd-navbar-fixed .rdn-nav-toggle.active span::before {
		transform: rotate3d(0, 0, 1, -40deg);
	}

	.rd-navbar-fixed .rdn-nav-toggle.active span::after {
		top: .063rem;
		left: 0;
		background: var(--black-color);
		transform: rotate3d(0, 0, 1, 40deg);
	}

/* rdn-top-panel
==================================================================== */
.rdn-top-panel {
	border-bottom: .125rem solid var(--main-color);
}

	.rd-navbar-fixed .rdn-top-panel {
		display: none;
	}

.rdn-top-panel .container-center {
	max-width: 1588px;
	padding-block: .625rem;
}

.rdn-top-panel .container-flex {
	align-items: center;
}

/* contacts-rdn-top
================================================ */
.contacts-rdn-top {
	display: flex;
	align-items: center;
}


.phone-rdn-top {
	margin-right: 1.25rem;
	font-weight: 400;
	transition: color .2s linear .02s;
}

@media (hover: hover) and (pointer: fine) {

	.phone-rdn-top:hover {
		color: var(--second-color);
	}

}


.a-link-rgn-tp {
	padding-bottom: .125rem;
	border-bottom: .063rem solid var(--text-color);
	text-transform: lowercase;
	transition: all .2s linear .02s;
}

@media (hover: hover) and (pointer: fine) {

	.a-link-rgn-tp:hover {
		border-bottom-color: transparent;
		color: var(--second-color);
	}

}

/* rdn-social
================================================ */
.rdn-social {
	margin: 0 0 0 auto;
	display: flex;
	align-items: center;

	/* background: #777; */
}

.rdn-social a {
	flex-basis: 2rem;
	width: 2rem;
	height: 2rem;
	margin: 0 .25rem;
	transition: all .2s linear .02s;
}


.rdn-social a.rdn-lang {
	flex-basis: auto;
	width: auto;
	height: auto;
	margin: 0 .75rem 0 0;
	padding-bottom: .125rem;
	border-bottom: .063rem solid var(--text-color);
	transition: all .2s linear .02s;
}

@media (hover: hover) and (pointer: fine) {

	.rdn-social a.rdn-lang:hover {
		border-bottom-color: transparent;
		color: var(--second-color);
	}

}


.rdn-social .wa {
	background: var(--green-color) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='hsl(0 0% 100%)' viewBox='0 0 16 16'%3E%3Cpath d='M13.601 2.326A7.854 7.854 0 0 0 7.994 0C3.627 0 .068 3.558.064 7.926c0 1.399.366 2.76 1.057 3.965L0 16l4.204-1.102a7.933 7.933 0 0 0 3.79.965h.004c4.368 0 7.926-3.558 7.93-7.93A7.898 7.898 0 0 0 13.6 2.326zM7.994 14.521a6.573 6.573 0 0 1-3.356-.92l-.24-.144-2.494.654.666-2.433-.156-.251a6.56 6.56 0 0 1-1.007-3.505c0-3.626 2.957-6.584 6.591-6.584a6.56 6.56 0 0 1 4.66 1.931 6.557 6.557 0 0 1 1.928 4.66c-.004 3.639-2.961 6.592-6.592 6.592zm3.615-4.934c-.197-.099-1.17-.578-1.353-.646-.182-.065-.315-.099-.445.099-.133.197-.513.646-.627.775-.114.133-.232.148-.43.05-.197-.1-.836-.308-1.592-.985-.59-.525-.985-1.175-1.103-1.372-.114-.198-.011-.304.088-.403.087-.088.197-.232.296-.346.1-.114.133-.198.198-.33.065-.134.034-.248-.015-.347-.05-.099-.445-1.076-.612-1.47-.16-.389-.323-.335-.445-.34-.114-.007-.247-.007-.38-.007a.729.729 0 0 0-.529.247c-.182.198-.691.677-.691 1.654 0 .977.71 1.916.81 2.049.098.133 1.394 2.132 3.383 2.992.47.205.84.326 1.129.418.475.152.904.129 1.246.08.38-.058 1.171-.48 1.338-.943.164-.464.164-.86.114-.943-.049-.084-.182-.133-.38-.232z'/%3E%3C/svg%3E") no-repeat center / auto 1.063rem;
}

@media (hover: hover) and (pointer: fine) {

	.rdn-social .wa:hover {
		background-color: hsl(142 70% 49%);
	}

}

.rdn-social .wa:active {
	background-color: var(--second-color);
}


.rdn-social .tg {
	background: var(--green-color) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='hsl(0 0% 100%)' viewBox='0 0 543.001 450'%3E%3Cpath d='M37.329 193.722c145.76-63.505 242.957-105.372 291.59-125.6C467.774 10.367 496.626.335 515.432.004c4.137-.073 13.385.952 19.375 5.813 5.059 4.104 6.45 9.649 7.117 13.54.666 3.892 1.495 12.757.836 19.684-7.525 79.06-40.084 270.924-56.648 359.474-7.01 37.47-20.81 50.033-34.17 51.262-29.036 2.672-51.085-19.19-79.208-37.624-44.006-28.847-68.867-46.804-111.583-74.953-49.366-32.531-17.364-50.411 10.77-79.631 7.36-7.65 135.294-124.013 137.77-134.57.31-1.32.597-6.24-2.326-8.84-2.924-2.597-7.24-1.71-10.353-1.002-4.413 1.002-74.714 47.468-210.902 139.4-19.955 13.702-38.03 20.378-54.223 20.028-17.853-.386-52.194-10.094-77.723-18.393-31.313-10.178-56.2-15.56-54.032-32.846 1.128-9.003 13.527-18.211 37.196-27.624z'/%3E%3C/svg%3E") no-repeat center / auto .75rem;
}

@media (hover: hover) and (pointer: fine) {

	.rdn-social .tg:hover {
		background-color: hsl(200 74% 51%);
	}

}

.rdn-social .tg:active {
	background-color: var(--second-color);
}


.rdn-social .vk {
	background: var(--green-color) url("data:image/svg+xml,%3Csvg viewBox='0 0 38.462463 24' fill='hsl(0 0% 100%)' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.949 24C7.808 24 .312 14.991 0 0h6.583c.216 11.003 5.069 15.664 8.912 16.625V0h6.199v9.49C25.49 9.08 29.477 4.756 30.822 0h6.199c-1.033 5.862-5.358 10.186-8.433 11.964 3.075 1.441 8 5.213 9.874 12.036H31.64c-1.465-4.565-5.116-8.096-9.945-8.577V24Z' fill='hsl(0 0% 100%)' style='stroke-width:1.2012'/%3E%3C/svg%3E") no-repeat center / 1.063rem auto;
}

@media (hover: hover) and (pointer: fine) {

	.rdn-social .vk:hover {
		background-color: hsl(212 100% 50%);
	}

}

.rdn-social .vk:active {
	background-color: var(--second-color);
}

/* rdn-main-panel
==================================================================== */
/* .rdn-main-panel {
	background: #ccc;
} */

.rdn-main-panel .container-center {
	padding-block: 2.5rem;
}

@media (max-width: 1199.98px) {

	.rdn-main-panel .container-center {
		padding-block: 0;
	}

}

.rdn-main-panel .container-flex {
	justify-content: center;
	align-items: center;
}

/* rdn-logo
================================================ */
.rd-navbar-static .rdn-logo {
	flex-basis: 18.75rem;
	width: 18.75rem;

	/* background: red; */
}

	.rd-navbar-fixed .rdn-logo {
		display: block;
		position: fixed;
		top: 1rem;
		left: .875rem;
		right: 3.5rem;
		/* right: 7rem; */
		z-index: 17;

		/* background: #00bfa5; */
	}

	.rd-navbar-fixed .rdn-logo img {
		width: auto;
		max-width: none;
		height: 1.375rem;
	}

/* rdn-main-panel rdn-lang
================================================ */
.rdn-main-panel .rdn-lang {
	display: none;
}

@media (max-width: 1199.98px) {

	.rdn-main-panel .rdn-lang {
		display: block;
		position: fixed;
		top: .5rem;
		right: 3.75rem;
		z-index: 17;
		padding: .625rem;

		/* background: palegoldenrod; */
	}

	.rdn-main-panel .rdn-lang:active {
		background: var(--second-color);
	}

}

/* rdn-main-nav
==================================================================== */
.rdn-main-nav {
	background: var(--main-color);
}

.rdn-main-nav .container-center {
	padding-block: 1rem;
}

/* .rdn-nav {
} */

/* nav-rdn-nav
================================================ */
/* .nav-rdn-nav {
} */

.rd-navbar-static .ul-rdn-nav {
	display: flex;
	justify-content: center;
}

.rd-navbar-static .ul-rdn-nav > li:not(:last-child) {
	margin: 0 2.5rem 0 0;
}

.rd-navbar-static .ul-rdn-nav > li > a {
	display: inline-block;
	position: relative;
	padding: .5rem 0 .375rem;
	color: var(--black-color);
	font-weight: 400;
	font-size: 1.375rem;
	text-transform: uppercase;
	transition: all .3s .02s ease;

	/* background: #ccc; */
}

.rd-navbar-static .ul-rdn-nav > li.parent > a {
	margin-right: .875rem;
}

.rd-navbar-static .ul-rdn-nav > li > a::after {
	content: "";
	display: block;
	position: absolute;
	bottom: -.625rem;
	left: 0;
	visibility: hidden;
	opacity: 0;
	width: 100%;
	height: .063rem;
	border-bottom: .063rem solid transparent;
	transition: all .2s .02s linear;
}

.rd-navbar-static .ul-rdn-nav > li.active > a,
.rd-navbar-static .ul-rdn-nav > li.opened > a,
.rd-navbar-static .ul-rdn-nav > li.focus > a,
.rd-navbar-static .ul-rdn-nav > li > a:hover {
	color: var(--second-color);
}

.rd-navbar-static .ul-rdn-nav > li.active > a::after,
.rd-navbar-static .ul-rdn-nav > li.opened > a::after,
.rd-navbar-static .ul-rdn-nav > li.focus > a::after,
.rd-navbar-static .ul-rdn-nav > li > a:hover::after {
	bottom: 0;
	visibility: visible;
	opacity: 1;
	border-bottom-color: var(--second-color);
}

/* ======= arrows inside the menu ======= */
.rd-navbar-static .rd-navbar-submenu-toggle {
	display: inline-block;
	position: absolute;
	top: 50%;
	right: -.125rem;
	transform: translateY(-50%);
	z-index: 1;
	width: .875rem;
	height: .875rem;

	/* background: red; */
}

.rd-navbar-static .rd-navbar-submenu-toggle::after {
	content: "";
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='hsl(30 100% 6%)'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E") no-repeat center;
	background-size: auto 100%;
	transition: all .3s .02s linear;

	/* background: palegreen; */
}

.rd-navbar-static .ul-rdn-nav > li.focus > .rd-navbar-submenu-toggle::after,
.rd-navbar-static .ul-rdn-nav > li.opened > .rd-navbar-submenu-toggle::after,
.rd-navbar-static .ul-rdn-nav > li > a:hover + .rd-navbar-submenu-toggle::after {
	transform: rotate(180deg);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='hsl(180 9% 55%)'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E") no-repeat center;
}

/* ======= rd-navbar-static rd-navbar-dropdown ======= */
.rd-navbar-static .rd-navbar-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 2;
	width: 20rem;
	padding: .875rem 0 0;
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	transform: translateY(1.875rem);
	transition: all .3s ease;
}

.rd-navbar-static .parent:last-of-type .rd-navbar-dropdown {
	left: auto;
	right: 0;

	/* border: 1px solid red; */
}

.rd-navbar-static .rd-navbar-dropdown li a {
	display: block;
	padding: 1rem 1rem 1rem 1.25rem;
	background: var(--main-color);
	color: var(--black-color);
	transition: all .2s .02s ease;
	font-weight: 400;
	font-size: 1.125rem;
	line-height: 1.2;

	/* background: pink; */
}

.rd-navbar-static .rd-navbar-dropdown li:last-child a {
	border-bottom: transparent;
}

@media (hover: hover) and (pointer: fine) {

	.rd-navbar-static .rd-navbar-dropdown li a:hover {
		padding-left: 2rem;
		color: var(--second-color);
	}

}

.rd-navbar-static .rd-navbar-dropdown li.focus a,
.rd-navbar-static .rd-navbar-dropdown li.opened a,
.rd-navbar-static .rd-navbar-dropdown a:hover {
	color: var(--second-color);
}

.rd-navbar-static .ul-rdn-nav li.rd-navbar--has-dropdown {
	position: relative;
}

.rd-navbar-static .ul-rdn-nav li.focus > .rd-navbar-dropdown,
.rd-navbar-static .ul-rdn-nav li.opened > .rd-navbar-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}


	.rd-navbar-fixed .rdn-nav {
		display: flex;
		flex-direction: column;
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		z-index: 15;
		width: 100%;
		padding: 6.25rem 0 6.25rem 1.25rem;
		box-shadow: .125rem 1.25rem .125rem hsl(30 100% 6% / .2);
		overflow-y: auto;
		background: var(--white-color);
		transform: translateX(-105%);
		transition: all .3s ease;

		/* background: #ccc; */
	}

	.rd-navbar-fixed .rdn-nav nav {
		order: -1;
		margin: 0 0 2.5rem;

		/* background: #4caf50; */
	}

	.rd-navbar-fixed .rdn-nav.active {
		transform: translateX(0)
	}

	.rd-navbar-fixed .ul-rdn-nav {
		overflow: auto;

		/* background: pink; */
	}

	.rd-navbar-fixed .ul-rdn-nav li > a {
		display: block;
		padding: 1rem;
		color: var(--black-color);
		font-weight: 400;
		font-size: 1.375rem;
		line-height: 1.2;
		text-transform: uppercase;
		transition: all .2s .02s ease;

		/* background: cadetblue; */
	}

	.rd-navbar-fixed .ul-rdn-nav li a:active {
		background: var(--main-color);
	}


	.rd-navbar-fixed .rd-navbar-dropdown {
		display: none;
	}


	.rd-navbar-fixed .rd-navbar-submenu {
		position: relative;
	}

	.rd-navbar-fixed .rd-navbar-submenu li > a {
		padding: 1.125rem 3.125rem 1.125rem 1.125rem;
		font-weight: 400;
		font-size: 1.125rem;
		text-transform: none;

		/* background: pink; */
	}

	.rd-navbar-fixed .rd-navbar-submenu.opened > .rd-navbar-dropdown {
		display: block
	}

/* ======= arrows inside the menu ======= */
	.rd-navbar-fixed .rd-navbar-submenu-toggle {
		display: block;
		position: absolute;
		top: .750rem;
		right: .625rem;
		z-index: 100;
		width: 2.250rem;
		height: 2.250rem;
		overflow: hidden;
		border: .063rem solid var(--black-color);
		cursor: pointer;
		transition: all .2s .02s linear;

		/* background: #26A69A; */
	}

	.rd-navbar-fixed .rd-navbar-submenu-toggle::before {
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='hsl(30 100% 6%)'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E") no-repeat center;
		background-size: auto 1.375rem;
		transition: all .3s ease
	}

	/* .rd-navbar-fixed .ul-rdn-nav li.opened .rd-navbar-submenu-toggle {
		background: red;
	} */

	/* .rd-navbar-fixed .ul-rdn-nav li > a:hover + .rd-navbar-submenu-toggle,
	.rd-navbar-fixed .ul-rdn-nav li > a:active + .rd-navbar-submenu-toggle,
	.rd-navbar-fixed .ul-rdn-nav li > a:focus + .rd-navbar-submenu-toggle {
		border-color: blue;
	} */

	.rd-navbar-fixed .ul-rdn-nav li > a:active,
	.rd-navbar-fixed .ul-rdn-nav li > a:focus {
		background: var(--main-color);
		color: var(--text-color);
	} 

	.rd-navbar-fixed .ul-rdn-nav li > a:active + .rd-navbar-submenu-toggle::before,
	.rd-navbar-fixed .ul-rdn-nav li > a:focus + .rd-navbar-submenu-toggle::before {
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='hsl(30 100% 6%)'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E") no-repeat center;
		background-size: auto 1.375rem;
	}

	.rd-navbar-fixed .ul-rdn-nav li.opened > a {
		background: var(--main-color);
		color: var(--text-color);
	}

	.rd-navbar-fixed .ul-rdn-nav li.opened > .rd-navbar-submenu-toggle::before {
		transform: rotate(180deg);
	}


/* nav-rdn-nav
================================================ */
.rd-navbar-static .rdn-mobile-contacts {
	display: none;
}

	.rd-navbar-fixed .rdn-mobile-contacts {
		margin-left: 1.125rem;
		padding: clamp(1.25rem, 0.7955rem + 2.2727vw, 2.5rem);
		background: var(--main-color);
	}


	.rdn-phone-mobile-contacts {
		display: block;
		margin-bottom: 1.25rem;
		font-weight: 400;
		font-size: 1.25rem;
		transition: color .2s linear .02s;
	}

	.rdn-phone-mobile-contacts:active {
		color: var(--main-color);
	}


	.rdn-mail-mobile-contacts {
		display: block;
		margin-bottom: 1.25rem;
		font-weight: 400;
	}

	.rdn-mail-mobile-contacts:active {
		color: var(--main-color);
	}


	.rdn-social-mobile a {
		flex-basis: 2.5rem;
		width: 2.5rem;
		height: 2.5rem;
	}

	.rdn-social-mobile .wa {
		background-size: 1.375rem;
	}

	.rdn-social-mobile .wa:active {
		background-size: 1.375rem;
	}

	.rdn-social-mobile .tg {
		background-size: 1.25rem;
	}

	.rdn-social-mobile .tg:active {
		background-size: 1.25rem;
	}

	.rdn-social-mobile .vk {
		background-size: 1.375rem;
	}

	.rdn-social-mobile .vk:active {
		background-size: 1.375rem;
	}




/* ====================================================================================================
	title-page-bread-crumbs
==================================================================================================== */
.title-page-bread-crumbs {
	background: url(../images/title-page-bg.jpg) no-repeat center / cover;

	/* background: #FF99CC; */
}

.title-page-bread-crumbs .container-center {
	padding: clamp(2.5rem, 0.9rem + 8vw, 7.5rem) var(--container-center-padding-inline) clamp(1.25rem, 0.85rem + 2vw, 2.5rem);
}

/* title-page
================================================================================ */
.title-page {
	margin-bottom: clamp(2.5rem, 0.9rem + 8vw, 7.5rem);
	color: var(--text-color);
	font-weight: 600;
	font-size: clamp(2rem, 1.72rem + 1.4vw, 2.875rem);
	line-height: 1.1;

	/* background: #08C; */
}

/* bread-crumbs
================================================================================ */
/* .bread-crumbs {
	background: #1bbc9b;
} */

.bread-crumbs ul {
	display: flex;
	padding-bottom: .625rem;
	align-items: center;
	overflow: auto clip;

	/* background: #1bbc9b; */
}

.bread-crumbs ul::-webkit-scrollbar {
		-webkit-appearance: none;
	height: .063rem;
}

.bread-crumbs ul::-webkit-scrollbar-track {
	border-radius: .25rem;
	background-color: #ccc;
}

.bread-crumbs ul::-webkit-scrollbar-thumb {
	border-radius: .25rem;
	background-color: #999;
}


.bread-crumbs li {
	display: flex;
	align-items: center;
	font-size: .875rem;
	white-space: nowrap;
}

.bread-crumbs li::after {
	content: "/";
	margin-inline: .625rem;
	font-size: .75rem;
}

.bread-crumbs li:last-child:after {
	display: none;
}

.bread-crumbs li a {
	color: blue;
	font-size: .875rem;
	white-space: nowrap;
	transition: all .2s linear .02s;
}

@media (hover: hover) and (pointer: fine) {

	.bread-crumbs li a:hover {
		color: red;
	}

}

.home-bread-crumbs {
	width: .875rem;
	height: .875rem;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='blue'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/%3E%3C/svg%3E") no-repeat center / auto 100%;
}

@media (hover: hover) and (pointer: fine) {

	.home-bread-crumbs:hover {
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='red'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/%3E%3C/svg%3E") no-repeat center / auto 100%;
	}

}


/* ====================================================================================================
	footer
==================================================================================================== */
.footer {
	background: var(--main-color);
}

.footer .container-center {
	padding-block-start: 5rem;
	padding-block-end: 2.5rem;
}

/* inner-footer
================================================================================ */
.inner-footer {
	max-width: 60rem;
	margin: 0 auto 2.5rem;
	text-align: center;
}


.inner-footer img {
	width: clamp(13.75rem, 12.15rem + 8vw, 18.75rem);
	margin: 0 auto 2.5rem;
}


.phone-footer {
	display: block;
	margin-bottom: .938rem;
	font-weight: 400;
	font-size: 1.5rem;
	transition: color .2s linear .02s;
}

@media (hover: hover) and (pointer: fine) {

	.phone-footer:hover {
		color: var(--second-color);
	}

}


.mail-footer {
	display: block;
	margin-bottom: 1.5rem;
	font-weight: 400;
	transition: color .2s linear .02s;
}

@media (hover: hover) and (pointer: fine) {

	.mail-footer:hover {
		color: var(--second-color);
	}

}


.social-footer {
	justify-content: center;
}

.social-footer a {
	flex-basis: 2.875rem;
	width: 2.875rem;
	height: 2.875rem;
}


.social-footer .wa {
	background-color: var(--green-color);
	background-size: 1.5rem;
}

@media (hover: hover) and (pointer: fine) {

	.social-footer .wa:hover {
		background-size: 1.5rem;
	}

}

.social-footer .wa:active {
	background-size: 1.5rem;
}


.social-footer .tg {
	background-color: var(--green-color);
	background-size: 1.25rem;
}

@media (hover: hover) and (pointer: fine) {

	.social-footer .tg:hover {
		background-size: 1.25rem;
	}

}

.social-footer .tg:active {
	background-size: 1.25rem;
}


.social-footer .vk {
	background-color: var(--green-color);
	background-size: 1.375rem;
}

@media (hover: hover) and (pointer: fine) {

	.social-footer .vk:hover {
		background-size: 1.375rem;
	}

}

.social-footer .vk:active {
	background-size: 1.375rem;
}

/* legality-footer
================================================================================ */
.legality-footer {
	display: flex;
	align-items: center;
	flex-wrap: wrap;

	/* background: #1bbc9b; */
}

@media (max-width: 575.98px) {

	.legality-footer {
		text-align: center;
	}

}


.copyright {
	margin-right: auto;
}

@media (max-width: 575.98px) {

	.copyright {
		flex-basis: 100%;
		margin-bottom: 1.5rem;
	}

}


.fl-152 {
	margin-left: auto;
}

@media (max-width: 575.98px) {

	.fl-152 {
		flex-basis: 100%;
	}

}

.fl-152 a {
	display: inline-block;
	text-decoration: underline;
	transition: all .2s linear .02s;
}

.fl-152 a:first-child {
	margin-bottom: .25rem;
}

@media (max-width: 575.98px) {

	.fl-152 a:first-child {
		margin-bottom: 1.938rem;
	}

}

@media (hover: hover) and (pointer: fine) {

	.fl-152 a:hover {
		color: var(--second-color);
		text-decoration: none;
	}

}



/* PAGES */



/* ====================================================================================================
	clothing-patterns
==================================================================================================== */
.clothing-patterns {
	text-align: center;
}

.clothing-patterns p:nth-child(2) {
	margin-bottom: 5rem;
}

.clothing-patterns ul li {
	margin-bottom: .875rem;
}






/* ====================================================================================================
	index
==================================================================================================== */
.main-index .container-center {
	padding-block: var(--container-center-padding-block-index);
}

.main-index h2:not([class]) {
	margin-top: 0;
	font-size: clamp(1.5rem, 1.34rem + 0.8vw, 2rem);

	/* background: #ccc; */
}

/* hero
================================================================================ */
.hero {
	background: url(../images/hero-img.jpg) no-repeat center / cover;
}

.hero .container-center {
	padding-block-start: clamp(5rem, 2.6rem + 12vw, 12.5rem);
	padding-block-end: 1.25rem
}

.hero-inner {
	width: 80vw;
	max-width: 56.25rem;
	margin-inline: auto;
	margin-bottom: clamp(9.25rem, 7.81rem + 7.2vw, 13.75rem);
	padding: clamp(1.25rem, 0.65rem + 3vw, 3.125rem);
	background: var(--main-color);
}

@media (max-width: 575.98px) {

	.hero-inner {
		width: 100%;
	}

}

.hero-inner img {
	margin-bottom: clamp(1.25rem, 0.85rem + 2vw, 2.5rem);
}

.hero-inner span {
	display: block;
	color: var(--white-color);
	font-weight: 300;
	font-size: clamp(1.125rem, 0.485rem + 3.2vw, 3.125rem);
	line-height: 1.4;
	text-transform: uppercase;
	text-align: center;
}

@media (min-width: 767.98px) {

	.hero-inner span br {
		display: none;
	}

}

html[lang="en"] .hero-inner span {
	font-size: clamp(1.125rem, 0.685rem + 2.2vw, 2.5rem);
}


.hero .btn {
	margin-block: 0;
	justify-content: center;
}

.hero .btn .a-btn {
	background: var(--green-color);
}

@media (hover: hover) and (pointer: fine) {

	.hero .btn .a-btn:hover {
		background: var(--second-color);
	}

}

.hero .btn .a-btn:active {
	background: var(--second-color);
}

/* about-index
================================================================================ */
/* .about-index {
} */

.about-index .container-center {
	padding-bottom: 2.5rem;
	font-size: clamp(1rem, 0.92rem + 0.4vw, 1.25rem);
	text-align: center;

	/* background: #08C; */
}

/* main-title-index
================================================================================ */
/* .main-title-index {
} */

.main-title-index .container-center {
	padding-top: 2.5rem;
	padding-bottom: 1.25rem;

	/* background: #CCFFFF; */
}

@media (max-width: 767.98px) {

	.main-title-index p br {
		display: none;
	}

}

/* services-index
================================================================================ */
/* .services-index {
} */

.services-index .container-center {
	padding-block: 1.25rem;

	/* background: palegoldenrod; */
}


.grid-services {
	display: flex;
	max-width: 60rem;
	margin-inline: auto;
	flex-wrap: wrap;

	/* background: #08C; */
}


.cell-services {
	flex-basis: 33.3333%;
	width: 33.3333%;
	padding: clamp(.625rem, 0.025rem + 3vw, 2.5rem);
	padding-left: clamp(1.5rem, -0.02rem + 7.6vw, 6.25rem);
	font-size: clamp(1rem, 0.92rem + 0.4vw, 1.25rem);
	line-height: 1.4;

	/* background: palevioletred; */
}

@media (max-width: 767.98px) {

	.cell-services {
		flex-basis: 50%;
		width: 50%;
	}

}

@media (max-width: 575.98px) {

	.cell-services {
		flex-basis: 100%;
		width: 100%;
		padding-left: 30vw;

		/* background: #08C; */
	}

	/* .cell-services br {
		display: none;
	} */

}

/* .cell-services:nth-child(2n) {
	background: #1bbc9b;
} */

/* portfolio-index
================================================================================ */
/* .portfolio-index {
} */

.portfolio-index .container-center {
	padding-block-end: 0;

	/* background: #CCFFFF; */
}

.portfolio-index h2:not([class]) {
	margin-bottom: 3.75rem;
}