@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@font-face {
    font-family: 'Built Titling Rg';
    src: url('../fonts/BuiltTitlingRg-Regular.eot');
    src: url('../fonts/BuiltTitlingRg-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BuiltTitlingRg-Regular.woff2') format('woff2'),
        url('../fonts/BuiltTitlingRg-Regular.woff') format('woff'),
        url('../fonts/BuiltTitlingRg-Regular.ttf') format('truetype'),
        url('../fonts/BuiltTitlingRg-Regular.svg#BuiltTitlingRg-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Briem Hand';
    src: url('../fonts/BriemHand-Medium.eot');
    src: url('../fonts/BriemHand-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BriemHand-Medium.woff2') format('woff2'),
        url('../fonts/BriemHand-Medium.woff') format('woff'),
        url('../fonts/BriemHand-Medium.ttf') format('truetype'),
        url('../fonts/BriemHand-Medium.svg#BriemHand-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}


:root {
	--container: 1525px;
    --font-inter: "Inter", sans-serif;
    --font-built: 'Built Titling Rg', sans-serif;
    --font-briem: 'Briem Hand', sans-serif;
    --white: #fff;
    --black: #000;
    --page-bg: #F5F5F5;
    --text: #484848;
    --light-text: #686868;
    --yellow: #FFCF23;
    --yellow-hover: #d2a609;
    --grey: #D8D8D8;
    --grey-text: #cccccc;
    --grey-border: #eee;
    --light-grey: #A4A4A4;

    --all-in: all 0.25s ease-in;
	--all-out: all 0.25s ease-out;
	--all-inout: all 0.25s ease-in-out;
}

html, body {
	padding: 0px;
	margin: 0px;
	line-height: 1.5;
	position: relative;
	font-family: var(--font-inter);
    background: var(--page-bg);
}

body {
	color: var(--text);
	padding-top: 0px;
}

*, ::before, ::after {
	box-sizing: border-box;
}

input, textarea, select, button, option {
	outline: none;
	font-family: var(--font-inter);
}

textarea {
	resize: none;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	padding: 0px;
	margin: 0px;
	position: relative;
	z-index: 2;
	font-weight: 600;
	font-family: var(--font-inter);
	line-height: 1.2;
}

h1, .h1 {
	font-size: 30px;
}

h2, .h2 {
	font-size: 28px;
}

h3, .h3 {
	font-size: 26px;
}

h4, .h4 {
	font-size: 24px;
}

h5, .h5 {
	font-size: 20px;
}

h6, .h6 {
	font-size: 18px;
}

p {
	margin: 0px;
	line-height: 1.5;
	font-weight: 400;
}

ul, ol {
	margin: 0px;
}

strong {
	font-weight: 600;
}

img {
	max-width: 100%;
	height: auto;
}

.medium {
	font-weight: 500;
}

.semi {
	font-weight: 600;
}

.bold {
	font-weight: bold;
}

.uppercase {
	text-transform: uppercase;
}

.flex-col {
	display: flex;
	flex-direction: column;
}

.flex-wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.grid {
	display: grid;
}

.grid-2 {
	grid-template-columns: 1fr 1fr;
}

.grid-3 {
	grid-template-columns: repeat(3, 1fr);
}

.grid-4 {
	grid-template-columns: repeat(4, 1fr);
}

.grid-5 {
	grid-template-columns: repeat(5, 1fr);
}

.grid-6 {
	grid-template-columns: repeat(6, 1fr);
}

.container {
	width: 100%;
	max-width: var(--container);
	margin-left: auto;
	margin-right: auto;
	position: relative;
	box-sizing: border-box;
	padding-left: 15px;
	padding-right: 15px;
}

.full-container {
	width: 100%;
	max-width: 100%;
	position: relative;
	box-sizing: border-box;
	padding-left: 0px;
	padding-right: 0px;
}

.img-cover {
	overflow: hidden;
}

.img-cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	vertical-align: top;
}

.img-contain img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	vertical-align: top;
}

a, button, input[type="submit"], input[type="button"] {
	transition: var(--all-out);
	outline: none;
	cursor: pointer;
}

a:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover {
	transition: var(--all-in);
}

.clear {
	width: 0px;
	height: 0px;
	float: none !important;
	clear: both !important;
}

.clearfix:after {
	content: '';
	display: block;
	clear: both;
}

.mobile {
	display: none !important;
}

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

/**/

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    transition: var(--all-inout);
    background: transparent;
}

header.scrolled {
    background: var(--white);
}

header.inner.scrolled {
    background: var(--white);
}

header .top {
    padding: 18px;
    position: relative;
}

header .top::after {
    width: 100%;
    height: 1px;
    content: "";
    bottom: 0;
    left: 0;
    position: absolute;
    background: linear-gradient(280deg, #FFF 2.06%, rgba(209, 209, 209, 0.00) 137.15%);
    transition: var(--all-inout);
    opacity: 1;
}

header.scrolled .top::after {
    opacity: 0;
    height: 0;
}

header .top .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

header .top .container .logo img {
    max-height: 100%;
    vertical-align: top;
}

header.inner .top .container .logo img {
    filter: brightness(0);
}

header.scrolled .top .container .logo img {
  filter: brightness(0);
}

header .top .container .lang {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 50px;
    padding: 0 16px;
    border-radius: 25px;
    border: 1px solid var(--yellow);
}

header.inner .top .container .lang {
    border-color: var(--text);
}

header.scrolled .top .container .lang {
    border-color: var(--yellow);
}

header .top .container .lang > span {
    color: var(--white);
}

header.inner .top .container .lang > span,
header.scrolled .top .container .lang > span {
    color: var(--grey);
}

header .top .container .lang a,
header .top .container .lang button {
    color: var(--white);
    text-decoration: none;
    text-transform: uppercase;
    font-size: 16px;
    background: none;
    padding: 0;
    border: 0;
    cursor: pointer;
}

header.inner .top .container .lang a,
header.inner .top .container .lang button {
    color: var(--grey);
}

header.scrolled .top .container .lang a,
header.scrolled .top .container .lang button {
    color: var(--grey);
}

header .top .container .lang a:hover,
header .top .container .lang a.active,
header .top .container .lang button:hover,
header .top .container .lang button.active {
    color: var(--yellow);
}

header.inner .top .container .lang a:hover,
header.inner .top .container .lang a.active,
header.inner .top .container .lang button:hover,
header.inner .top .container .lang button.active {
    color: var(--text);
}

header.scrolled .top .container .lang a:hover,
header.scrolled .top .container .lang a.active,
header.scrolled .top .container .lang button:hover,
header.scrolled .top .container .lang button.active {
    color: var(--yellow);
}

header .top .container .menu {
    padding: 0 9px;
    border-radius: 75px;
    border: 1px solid var(--grey);
    background: var(--white);
}

header .top .container .menu > ul {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    list-style: none;
}

header .top .container .menu > ul > li {
    position: relative;
    padding: 9px 0;
}

header .top .container .menu > ul > li > a {
    display: flex;
    padding: 0 24px;
    height: 45px;
    text-decoration: none;
    color: #484848;
    font-size: 13px;
    font-weight: 700;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border-radius: 60px;
}

header .top .container .menu > ul > li > a:hover {
    background: var(--yellow);
    color: var(--white);
}

header .top .container .menu > ul > li.children > a::after {
    width: 11px;
    height: 9px;
    content: "";
    display: flex;
    background: url('../images/menu-arrow.svg') center center no-repeat;
    transition: var(--all-inout);
}

header .top .container .menu > ul > li.children > a:hover::after {
    filter: brightness(0) invert(1);
}

header .top .container .menu .sub-menu {
    max-height: 0;
    opacity: 0;
    transition: var(--all-inout);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 0 20px;
    background: var(--yellow);
    border-radius: 0 0 30px 30px;
    position: absolute;
    left: 0;
    top: 100%;
    width: 250px;
    list-style: none;
    z-index: 2;
}

header .top .container .menu .sub-menu > li:first-child {
    padding-top: 18px;
}

header .top .container .menu .sub-menu > li:last-child {
    padding-bottom: 18px;
}

header .top .container .menu li.children:hover .sub-menu {
    max-height: 300px;
    opacity: 1;
}

header .top .container .menu li.children .sub-menu li a {
    font-size: 14px;
    color:var(--text);
    line-height: 30px;
    text-decoration: none;
}

header .top .container .menu li.children .sub-menu li a:hover {
    color: var(--white);
}

header .bottom {
    padding-top: 30px;
    transition: var(--all-inout);
    opacity: 1;
}

header.scrolled .bottom {
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    overflow: hidden;
}

header .bottom .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

header .shop {
    width: 100%;
    max-width: 230px;
    position: relative;
}

header .top .shop {
    max-width: 50px;
    transition: var(--all-inout);
    opacity: 0;
}

header.scrolled .top .shop {
    opacity: 1;
}

header .shop button {
    height: 56px;
    width: 100%;
    border-radius: 28px;
    padding: 0 45px 0 20px;
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    text-transform: uppercase;
    background: var(--white);
    border: 1px solid var(--grey-border);
    z-index: 2;
}

header .top .shop button {
    border-color: var(--grey);
}

header .shop button .burger {
    width: 24px;
    height: 24px;
    display: flex;
    position: relative;
    display: flex;
}

header .shop button .burger span {
    position: absolute;
    left: calc(50% - 9px);
    top: calc(50% - 1px);
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: var(--text);
    display: flex;
    transition: var(--all-inout);
}

header .shop button .burger span:first-child {
    transform: translateY(-5px);
}

header .shop button .burger span:last-child {
    transform: translateY(5px);
}

header .shop button.open .burger span:nth-child(2) {
    opacity: 0;
}

header .shop button.open .burger span:nth-child(1) {
    transform: translate(0px, 0px) rotate(45deg);
}

header .shop button.open .burger span:nth-child(3) {
    transform: translate(0px, 0px) rotate(-45deg);
}

header .shop button::after {
    position: absolute;
    right: 7px;
    top: calc(50% - 19px);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: url('../images/shop-menu-arrow-top.svg') center center no-repeat, var(--yellow);
    display: flex;
    content: "";
    transition: var(--all-inout);
}

header .top .shop button::after {
    display: none;
}

header .shop button.open::after {
    rotate: 180deg;
}

header .shop .shop-menu {
    padding: 0 20px;
    list-style: none;
    display: flex;
    flex-direction: column;
    background: var(--yellow);
    max-height: 0px;
    position: absolute;
    z-index: 1;
    top: 28px;
    left: 0;
    width: 100%;
    border-radius: 0 0 30px 30px;
    overflow: hidden;
    gap: 16px;
    opacity: 0;
    transition: var(--all-inout);
    width: 230px;
}

header .top .shop .shop-menu {
    border-radius: 0 30px 30px 30px;
}

header .shop .shop-menu.open {
    opacity: 1;
    max-height: 300px;
}

header .shop .shop-menu.open {
    max-height: 300px;
    opacity: 1;
}

header .shop .shop-menu li:first-child {
    padding-top: 40px;
}

header .shop .shop-menu li:last-child {
    padding-bottom: 20px;
}

header .shop .shop-menu li a {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: var(--text);
    text-decoration: none;
}

header .shop .shop-menu li a:hover {
    color: var(--white);
    font-weight: 700;
}

header .shop .shop-menu li a .icon {
    display: flex;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    position: relative;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    background: var(--white);
}

header .shop .shop-menu li a .icon::before {
    width: 18px;
    height: 18px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: var(--yellow);
    z-index: 1;
    content: "";
    opacity: 0;
    transition: var(--all-inout);
    border-radius: 50%;
}

header .shop .shop-menu li a:hover .icon::before {
    opacity: 1;
}

header .shop .shop-menu li a .icon img {
    max-width: 14px;
    max-height: 14px;
    position: relative;
    z-index: 2;
}

header .shop-controls {
    display: flex;
    align-items: center;
    gap: 6px;
}

header .top .shop-controls {
    transition: var(--all-inout);
    opacity: 0;
}

header.scrolled .top .shop-controls {
    opacity: 1;
}

header .shop-controls button,
header .shop-controls a {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--white);
    position: relative;
    padding: 0;
    border: 0;
}

header .top .shop-controls button,
header .top .shop-controls a {
    border: 1px solid var(--grey);
}

header .top .shop-controls button,
header .top .shop-controls a {
    width: 50px;
    height: 50px;
}

header .shop-controls button:hover,
header .shop-controls a:hover {
    background: var(--yellow);
}

header .shop-controls button::before,
header .shop-controls a::before {
    width: 22px;
    height: 22px;
    display: flex;
    content: "";
    background: var(--text);
    transition: var(--all-inout);
}

header .shop-controls button.search::before {
    mask: url('../images/search-icon.svg') center center no-repeat;
}

header .shop-controls button.favorites::before {
    mask: url('../images/favorites-icon.svg') center center no-repeat;
}

header .shop-controls button.cart::before,
header .shop-controls a.cart::before {
    mask: url('../images/cart-icon.svg') center center no-repeat;
}

header .shop-controls button.cart span,
header .shop-controls a.cart span {
    position: absolute;
    top: -4px;
    right: 4px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--yellow);
    color: var(--white);
    text-align: center;
    font-size: 9px;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
}

header .top .shop button {
    height: 50px;
    width: 50px;
    padding: 0;
    justify-content: center;
}

header .header-search {
    max-height: 0;
    overflow: hidden;
    position: fixed;
    left: 0;
    top: 119px;
    width: 100%;
    background: var(--white);
    opacity: 0;
    height: 90px;
    transition: var(--all-inout);
}

header .header-search.open {
    max-height: 90px;
    opacity: 1;
    z-index: 2;
}

header .header-search .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    gap: 60px;
}

header .header-search .container .close button {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--white);
    position: relative;
    padding: 0;
    border: 0;
    border: 1px solid var(--grey);
    flex-shrink: 0;
}

header .header-search .container .close button span {
    height: 2px;
    width: 32px;
    position: absolute;
    left: calc(50% - 16px);
    top: calc(50% - 1px);
    border-radius: 2px;
    background: var(--text);
}

header .header-search .container .close button span:first-child {
    rotate: 45deg;
}

header .header-search .container .close button span:last-child {
    rotate: -45deg;
}

header .header-search #search {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    position: relative;
}

header .header-search #search input[type="text"] {
    width: 100%;
    height: 54px;
    border-radius: 40px;
    padding: 0 30px;
    font-size: 14px;
    font-weight: 500;
    color: var(--light-text);
    border: 1px solid var(--grey);
    background: var(--white);
}

header .header-search #search .input-group-btn {
    width: 54px;
    height: 54px;
    position: absolute;
    top: 0;
    right: 0;
}

header .header-search #search .input-group-btn button {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 1px solid var(--grey);
    display: flex;
    align-items: center;
    justify-content: center;
}

header .header-search #search .input-group-btn button::before {
    width: 22px;
    height: 22px;
    display: flex;
    content: "";
    background: var(--text);
    transition: var(--all-inout);
}

header .header-search #search .input-group-btn button::before {
    mask: url('../images/search-icon.svg') center center no-repeat;
}

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

/**/

.home-banner {
    width: 100%;
    height: 1080px;
    position: relative;
    border-radius: 0 0 40px 40px;
    overflow: hidden;
}

.home-banner.delivery-banner {
    height: initial;
}

.home-banner .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.home-banner .bg::before {
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%);
    mix-blend-mode: luminosity;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
}

.home-banner .bg::after {
    border-radius: 664.861px;
    background: #FEDE87;
    mix-blend-mode: plus-lighter;
    filter: blur(400px);
    position: absolute;
    left: calc(50% - 230px);
    top: 50%;
    content: "";
    width: 665px;
    height: 550px;
    transform: rotate(-16deg);
    flex-shrink: 0;
    opacity: 0.6;
}

.home-banner .bg img {
    object-position: bottom right;
}

.home-banner.delivery-banner .bg img {
    object-position: center center;
}

.home-banner.wholsale-banner .bg img {
    object-position: center center;
}

.home-banner .img {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.home-banner .img::before {
    width: 100%;
    height: 100px;
    background: url('../images/banner-bottom.svg') center bottom no-repeat;
    bottom: 0;
    z-index: 2;
    left: 0;
    content: "";
    position: absolute;
}

.home-banner .img img {
    object-position: bottom right;
    transform: translateY(0px);
}

.home-banner .container {
    padding-top: 320px;
    position: static;
}

.home-banner .container h1,
.home-banner .container .h1 {
    font-family: var(--font-built);
    font-size: 310px;
    line-height: 85%;
    background: linear-gradient(87deg, rgba(255, 250, 217, 0.49) -0.26%, rgba(255, 255, 255, 0.50) 102.81%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    mix-blend-mode: plus-lighter;
    position: relative;
}

.home-banner .container > p,
.home-banner .container .text > p {
    font-family: var(--font-inter);
    color: rgba(254, 222, 135, 0.86);
    font-size: 32px;
    font-weight: 500;
    line-height: 1;
    position: relative;
}

.home-banner .home-spaecials-list {
    position: relative;
    margin-top: 80px;
}

.home-banner .home-spaecials-list .item {
    padding: 30px;
    width: 100%;
    max-width: 460px;
    border-radius: 30px;
    background: lightgray;
    display: flex;
    gap: 18px;
    flex-direction: row-reverse;
}

.home-banner .home-spaecials-list .item .image {
    width: 100%;
    max-width: 210px;
    height: 180px;
}

.home-banner .home-spaecials-list .item .image a {
    display: flex;
    border-radius: 20px;
    width: 100%;
    height: 100%;    
}

.home-banner .home-spaecials-list .item .text {
    gap: 6px;
}

.home-banner .home-spaecials-list .item .text .title {
    font-size: 24px;
    font-weight: 600;
    line-height: 100%;
    width: 50%;
}

.home-banner .home-spaecials-list .item .text p,
.home-banner .home-spaecials-list .item .text p a {
    color: var(--light-grey);
    font-size: 14px;
    line-height: normal;
    text-decoration: none;
}

.home-banner .home-spaecials-list .item .text p a:hover {
    color: var(--text);
}

.home-banner .home-spaecials-list .item .text .but {
    margin-top: auto;
}

.yellow-button {
    padding: 0 24px;
    height: 50px;
    border-radius: 25px;
    background: var(--yellow);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    border: 0;
}

.yellow-button:hover {
    background: var(--yellow-hover);
}

.arrow-after::after {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    display: flex;
    content: "";
    rotate: 90deg;
    background: url('../images/shop-menu-arrow-top.svg') center center no-repeat;
    transform: translateX(0px);
    transition: var(--all-inout);
}

.download-after::after {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    display: flex;
    content: "";
    background: url('../images/book.svg') center center no-repeat;
    transform: translateX(0px);
    transition: var(--all-inout);
}

.arrow-after:hover::after {
    transform: translateY(-5px);
}

.home-banner .shop-link {
    position: absolute;
    z-index: 5;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
}

.home-banner .shop-link a {
    display: flex;
    flex-direction: column;
    gap: 50px;
    align-items: center;
    color: var(--yellow);
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    line-height: 80%;
    text-transform: uppercase;
    text-decoration: none;
}

.home-banner .shop-link a .icon {
    width: 116px;
    height: 116px;
    border-radius: 50%;
    background: url('../images/catalog-icon.svg') center center no-repeat, var(--white);
    box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, 0.10);
    animation: pulse-animation 2s infinite;
    position: relative
}

.home-banner .shop-link a .icon::before {
    width: 58px;
    height: 58%;
    top: -110px;
    left: 50%;
    transform: translateX(50%);
    content: "";
    background: url('../images/shop-menu-arrow-top.svg') center center / 28px auto no-repeat;
    display: flex;
    position: absolute;
    rotate: 180deg;
}

@keyframes pulse-animation {
    0% {
        box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.8);
    }
    100% {
        box-shadow: 0 0 0 64px rgba(255, 255, 255, 0);
    }
}

.home-banner.wholsale-banner .container {
    padding-top: 260px;
}

.home-banner.delivery-banner .container {
    padding-top: 260px;
    padding-bottom: 170px;
}

.home-banner.wholsale-banner .box {
    display: flex;
    justify-content: space-between;
    gap: 32px 150px;
    position: relative;
}

.home-banner.delivery-banner .box {
    display: flex;
    justify-content: space-between;
    gap: 50px;
    position: relative;
}

.home-banner.wholsale-banner .breadcrumbs,
.home-banner.delivery-banner .breadcrumbs {
    position: relative;
    z-index: 5;
}

.home-banner.wholsale-banner .breadcrumbs + .box,
.home-banner.delivery-banner .breadcrumbs + .box {
    margin-top: 24px;
}

.home-banner.wholsale-banner .box .wholsale-advantages,
.home-banner.delivery-banner .box .delivery-advantages {
    display: grid;
    grid-template-columns:  1fr 1fr;
    gap: 20px;
    width: 100%;
    max-width: 580px;
    flex-shrink: 0;
}

.home-banner.wholsale-banner .box .wholsale-advantages .item,
.home-banner.delivery-banner .box .delivery-advantages .item {
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(18.25px);
    border-radius: 20px;
    width: 100%;
    max-width: 280px;
}

.home-banner.wholsale-banner .box .wholsale-advantages .item:last-child,
.home-banner.delivery-banner .box .delivery-advantages .item:first-child {
    grid-column-start: 1;
    grid-column-end: 3;
    max-width: 100%;
}

.home-banner.wholsale-banner .box .wholsale-advantages .item p,
.home-banner.delivery-banner .box .delivery-advantages .item p {
    color: var(--white);
    font-size: 32px;
    font-weight: 600;
    line-height: 80%;
    text-transform: uppercase;
}

.home-banner.wholsale-banner .box .wholsale-advantages .item div,
.home-banner.delivery-banner .box .delivery-advantages .item div {
    position: relative;
}

.home-banner.wholsale-banner .box .wholsale-advantages .item div span:first-child,
.home-banner.delivery-banner .box .delivery-advantages .item div span:first-child {
    font-family: var(--font-built);
    font-size: 180px;
    line-height: 150px;
    background: linear-gradient(198deg, #FFF 28.7%, rgba(209, 209, 209, 0.00) 121.2%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: flex;
    align-items: baseline;
}

.home-banner.wholsale-banner .box .wholsale-advantages .item div span:last-child,
.home-banner.delivery-banner .box .delivery-advantages .item div span:last-child {
    color: var(--grey);
    font-size: 24px;
    font-weight: 300;
    line-height: normal;
    position: absolute;
    right: 0;
    bottom: 4px;
    width: 90px;
}

.home-banner.delivery-banner .box .delivery-advantages .item:last-child div span:last-child,
.home-banner.wholsale-banner .box .wholsale-advantages .item:last-child div span:last-child {
    width: 235px;
}

.home-banner.delivery-banner .box .text {
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(17.5px);
    border-radius: 20px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.home-banner.delivery-banner .box .text h1 {
    font-size: 70px;
    line-height: normal;
    text-transform: uppercase;
    background: linear-gradient(203deg, #FFF 51.7%, rgba(209, 209, 209, 0.00) 121.29%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


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

/**/

.home-products-tabs {
    padding: 60px 0;
}

.home-products-tabs .categories-tabs {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 24px;
}

.home-products-tabs .categories-tabs button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    font-size: 24px;
    background: none;
    color: var(--text);
    filter: drop-shadow(0 5px 20px rgba(0, 0, 0, 0.05));
}

/*.home-products-tabs .categories-tabs button:hover {
    color: var(--yellow);
}*/

.home-products-tabs .categories-tabs button .icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--white);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-products-tabs .categories-tabs button .icon::before {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    content: "";
    position: absolute;
    left: calc(50% - 15px);
    top: calc(50% - 15px);
    background: var(--white);
    z-index: 1;
    transition: var(--all-inout);
}

.home-products-tabs .categories-tabs button .icon img {
    width: 100%;
    max-width: 22px;
    max-height: 22px;
    transition: var(--all-inout);
    z-index: 2;
    position: relative;
}

.home-products-tabs .categories-tabs button.active .icon::before, 
.home-products-tabs .categories-tabs button:hover .icon::before {
    background: var(--yellow);
}

.home-products-tabs .categories-tabs button:hover .icon img, 
.home-products-tabs .categories-tabs button.active .icon img {
    filter: brightness(0) invert(1);
}

.home-products-tabs .categories-tabs + .categories-tabs-content {
    margin-top: 40px;
}

.categories-tabs-content .list {
    gap: 12px;
}

.product-item {
    padding: 30px;
    border-radius: 30px;
    background: var(--white);
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.product-item .img {
    height: 235px;
    width: 100%;
    border-radius: 20px;
    position: relative;
}

.product-item .img a {
    border-radius: 20px;
    display: flex;
    width: 100%;
    height: 100%;
}

.product-item .img img {
    vertical-align: top;
    scale: 1;
    transition: var(--all-inout);
}

.product-item:hover .img img {
    scale: 1.05;
}

.product-item .img .flags {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 8px;
    z-index: 2;
}

.product-item .img .flags .flag {
    height: 40px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 0 0 16px 16px;
    color: var(--white);
    font-size: 13px;
    font-weight: 700;
    line-height: normal;
}

.product-item .img .flags .flag.special {
    background: #E90101;
}

.product-item .img .flags .flag.special::before {
    content: "";
    display: flex;
    width: 24px;
    height: 24px;
    background: url('../images/tag-pr.svg') center center no-repeat;
}

.product-item .info {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.product-item .info .text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.product-item.special .info .text {
    padding-top: 20px;
}

.product-item .info .text .title, 
.product-item .info .text .title a {
    color: var(--text);
    font-size: 24px;
    font-weight: 600;
    line-height: 100%;
    text-decoration: none;
}

.product-item .info .text .title a:hover {
    color: var(--yellow);
}

.product-item .info .text p {
    color: var(--light-grey);
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
}

.product-item .info .price {
    display: flex;
    flex-direction: column;
    gap: 4px;
    color: var(--text);
    text-align: right;
    font-size: 13px;
    line-height: normal;
    align-items: flex-end;
}

.product-item .info .price span {
    display: flex;
    text-align: right;
    font-size: 24px;
    font-weight: 600;
    line-height: 100%;
}

.product-item .info .price .old-price-info {
    display: flex;
    align-items: center;
    gap: 8px;
}

.product-item .info .price .old-price-info span {
    color: #E90101;
    text-align: right;
    font-size: 16px;
    font-weight: 600;
    line-height: 16px;
}

.product-item .info .price .old-price-info span:first-child {
    text-decoration-line: line-through;
}

.product-item .controls {
    margin-top: auto;
    padding-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.product-item .controls .cart-after {
    width: 100%;
}

.product-item .controls .favorites {
    display: none;
}

.cart-after {
    padding: 0 48px;
}

.cart-after::after {
    width: 22px;
    height: 22px;
    display: flex;
    content: "";
    background: url('../images/bag-white.svg') center center no-repeat;
}

.categories-tabs-content .tabcontent {
    animation: fadeEffect 1s;
}

.categories-tabs-content .tabcontent:not(:first-child) {
    display: none;
}

@keyframes fadeEffect {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


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

/**/

.our-advantages {
    padding: 60px 0;
    position: relative;
}

.our-advantages h2 {
    line-height: 30px;
}

.our-advantages h2 + .slider-wr {
    margin-top: 40px;
}

.our-advantages .slider-wr {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.our-advantages .slider-wr .slider {
    width: 100%;
    max-width: 365px;
    border-radius: 50px;
    background: var(--white);
    min-height: 800px;
    position: relative;
    padding-bottom: 82px;
}

.our-advantages .slider-wr .slider .item {
    padding: 30px;
}

.our-advantages .slider-wr .slider .item .text {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.our-advantages .slider-wr .slider .item .text .thumb {
    width: 100%;
    height: 290px;
    border-radius: 20px;
    margin-bottom: 24px;
}

.our-advantages .slider-wr .slider .item .text .title {
    color: var(--text);
    font-size: 24px;
    font-weight: 600;
    line-height: 100%;
}

.our-advantages .slider-wr .slider .item .text p {
    color: var(--text);
    font-size: 16px;
    line-height: 150%;
}

.slick-arrow {
    z-index: 2;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    font-size: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: none;
    cursor: pointer;
}

.our-advantages .slider-wr .slider .slick-arrow {
    position: absolute;
    bottom: 40px;
    left: 50%;
}

.our-advantages .slider-wr .slider .slick-arrow.slick-prev {
    transform: translateX(-60px);
}

.our-advantages .slider-wr .slider .slick-arrow.slick-next {
    transform: translateX(20px);
}

.slick-arrow::before {
    width: 40px;
    height: 40px;
    display: flex;
    content: "";
    background: url('../images/slider-arr.svg') center center no-repeat;
    filter: grayscale(1);
    transition: var(--all-inout);
}

.slick-arrow.slick-prev::before {
    rotate: 180deg;
}

.slick-arrow:hover::before {
    filter: grayscale(0);
}

.our-advantages > .image-wr {
    top: 130px;
    left: 0;
    position: absolute;
    width: 100%;
    max-width: calc((100vw / 2) + ((var(--container) / 2) - 393px));
    height: 880px;
    border-radius: 0 50px 50px 0;
    background: linear-gradient(251deg, #FFE16B -7.3%, #EDB900 92.06%);
    overflow: hidden;
}

.our-advantages > .image-wr > .img {
    margin-right: 455px;
    height: 100%;
}

.our-advantages > .image-wr > .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
}

.our-advantages > .image-wr > .title {
    position: absolute;
    bottom: 0;
    right: 100px;
    width: 680px;
    height: 800px;
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
    justify-content: center;

    text-shadow: 21.553px 5.071px 50.713px rgba(0, 0, 0, 0.05);
    font-family: var(--font-built);
    font-size: 274px;
    line-height: 80%;

    opacity: 0.8;
    background: linear-gradient(77deg, rgba(255, 255, 255, 0.70) -1.83%, rgba(255, 246, 190, 0.70) 106.42%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    mix-blend-mode: plus-lighter;
}

.our-advantages > .slider-navigation {
    padding: 30px;
    width: 100%;
    max-width: 340px;
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(18.25px);
    display: flex;
    flex-direction: column;
    gap: 40px;
    position: absolute;
    top: 240px;
    left: calc((100vw - var(--container)) / 2 + 15px);
}

.our-advantages > .slider-navigation::before {
    width: 2px;
    height: calc(100% - 60px);
    content: "";
    top: 30px;
    left: 32px;
    position: absolute;
    background: rgba(255, 255, 255, 0.20);
    border-radius: 2px;
}

.our-advantages > .slider-navigation .button {
    padding-left: 72px;
    position: relative;
    min-height: 40px;
    display: flex;
    align-items: center;
    color: var(--white);
    font-size: 18px;
    cursor: pointer;
}

.our-advantages > .slider-navigation .button::before {
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    border-radius: 2px;
    background: var(--white);
    opacity: 0;
    transition: var(--all-inout);
}

.our-advantages > .slider-navigation .button.active::before {
    opacity: 1;
}

.our-advantages > .slider-navigation .button .icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--white);
    position: absolute;
    left: 24px;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 5px solid var(--white);
    color: var(--text);
    font-size: 16px;
    transition: var(--all-inout);
}

.our-advantages > .slider-navigation .button:hover .icon,
.our-advantages > .slider-navigation .button.active .icon {
    background: var(--yellow);
}

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

/**/

.home-product-packs {
    padding: 60px 0;
}

.home-product-packs h2 + .box {
    margin-top: 40px;
}

.home-product-packs .box.slick-slider .slick-list {
    margin-left: -6px;
    margin-right: -6px;
}

.home-product-packs .box.slick-slider .product-item {
    margin: 0 6px;
    display: flex !important;
}

.home-product-packs .box:not(.slick-slider) {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.home-product-packs .box.slider .slick-arrow.slick-prev {
    position: absolute;
    left: -58px;
    top: calc(50% - 20px);
}

.home-product-packs .box.slider .slick-arrow.slick-next {
    position: absolute;
    right: -58px;
    top: calc(50% - 20px);
}

.slick-dots {
    padding: 0;
    margin-top: 50px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    list-style: none;
}

.slick-dots li button {
    font-size: 0;
    padding: 0;
    background: #E7E7E7;
    width: 40px;
    height: 2px;
    display: flex;
    border: 0;
    transition: var(--all-inout);
}

.slick-dots li button:hover {
    background: var(--yellow);
}

.slick-dots li.slick-active button {
    border-radius: 2px;
    height: 4px;
    background: var(--yellow);
}

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

/**/

.clients-block {
	padding: 60px 0 90px;
}

.clients-block h2 + .box {
	margin-top: 40px;
    padding: 0px 36px;
    border-radius: 40px;
    background: var(--white);
}

.clients-block .box:not(.slick-slider) {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.clients-block .box .item {
    padding: 0 40px;
    height: 130px;
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.clients-block .box .item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.clients-block .box.slider .slick-arrow.slick-prev {
    position: absolute;
    left: -58px;
    top: calc(50% - 20px);
}

.clients-block .box.slider .slick-arrow.slick-next {
    position: absolute;
    right: -58px;
    top: calc(50% - 20px);
}

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

/**/

.delivery-payment-block {
    padding: 90px 0;
}

.delivery-payment-block h2 + .box {
    margin-top: 40px;
}

.delivery-payment-block .box {
    gap: 40px;
}

.delivery-payment-block .box .tabs-buttons {
    width: 100%;
    height: 105px;
    border-radius: 75px;
    border: 2px solid var(--grey);
    background: var(--white);
    display: flex;
    justify-content: space-between;
    padding: 20px;
}

.delivery-payment-block .box .tabs-buttons button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 48px;
    height: 100%;
    color: var(--text);
    font-size: 18px;
    font-weight: 700;
    background: var(--white);
    border: 0;
    border-radius: 60px;
}

.delivery-payment-block .box .tabs-buttons button.active,
.delivery-payment-block .box .tabs-buttons button:hover {
    color: var(--white);
    background: var(--yellow);
}

.delivery-payment-block .box .tabcontent {
    animation: fadeEffect 1s;
}

.delivery-payment-block .box .tabcontent:not(:first-child) {
    display: none;
}

.delivery-payment-block .box .tabcontent .inner {
    display: grid;
    grid-template-columns: auto 365px;
    gap: 12px;
}

.delivery-payment-block .box .tabcontent .inner > * {
    border-radius: 30px;
    background: var(--white);
    padding: 30px;
}

.delivery-payment-block .box .tabcontent .inner .dop {
    padding-bottom: 0;
}

.text-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.text-content ul,
.text-content ol {
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.text-content ul {
    list-style: none;
    padding: 0;
    gap: 16px;
}

.text-content ul li {
    padding-left: 36px;
    position: relative;
}

.text-content ul li::before {
    width: 24px;
    height: 24px;
    border: 6px solid var(--white);
    background: var(--yellow);
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    border-radius: 50%;
}

.text-content ol {
    list-style: none;
    padding-left: 0;
    counter-reset: ol;
}

.text-content ol li {
    border-radius: 40px;
    padding: 24px 50px;
    background: var(--white);
    position: relative;
}

.text-content ol li::before {
    counter-increment: ol;
    content: counter(ol)". ";
    font-weight: bold;
}

.text-content a {
    color: var(--text);
}

.text-content a:hover {
    color: var(--yellow);
}

.delivery-payment-block .box .tabcontent .inner .text-content ul li::before {
    width: 6px;
    height: 6px;
    border: 0px solid var(--white);
    background: var(--text);
    left: 16px;
    top: 9px;
}

.delivery-payment-block .box .tabcontent .inner .dop {
    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: space-between;
}

.delivery-payment-block .box .tabcontent .inner .dop .image {
    width: 100%;
    height: 290px;
    text-align: center;
}

.delivery-payment-block .box .tabcontent .inner .dop .image img {
    vertical-align: top;
    max-height: 100%;
    max-width: 100%;
    filter: drop-shadow(59px 0 24px rgba(0, 0, 0, 0.01)) drop-shadow(33px 0 20px rgba(0, 0, 0, 0.04)) drop-shadow(15px 0 15px rgba(0, 0, 0, 0.06)) drop-shadow(4px 0 8px rgba(0, 0, 0, 0.07));
}

.text-content p,
.text-content ul,
.text-content ol {
    font-size: 16px;
}

.text-content table {
    border-collapse: collapse;
    border-radius: 4px;
    width: 100%;
}

.text-content table th, 
.text-content table td {
    border: 1px solid var(--grey-text);
    padding: 4px 16px;
}

.delivery-payment-block .box .tabcontent .inner .dop .text-content strong {
    color: var(--yellow);
    font-weight: 600;
}

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

/**/

.text-block-section {
    padding: 90px 0;
}

.text-block-section h1 + .box {
    margin-top: 80px;
}

.text-block-section .text-wr {
    max-height: 180px;
    overflow: hidden;
    position: relative;
}

.text-block-section .text-wr::after {
    width: 100%;
    height: 40px;
    display: flex;
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    background: #F5F5F5;
    background: -webkit-linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    background: -moz-linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    background: linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#F5F5F5", endColorstr="#F5F5F5", GradientType=0);
    transition: var(--all-inout)
}

.text-block-section .text-wr.open::after {
    opacity: 0;
}

.text-block-section .text-wr + .more {
    margin-top: 24px;
}

.text-block-section .text-wr.open + .more {
    display: none;
}

.text-block-section .text-content {
    gap: 32px;
}

.text-block-section.information-text-page .text-content {
    gap: 16px;
}

.text-block-section .text-content ul li {
    position: relative;
}

.text-block-section .text-content ul li::before {
    width: 6px;
    height: 6px;
    border: 0px solid var(--white);
    background: var(--text);
    left: 16px;
    top: 9px;
}

.more button {
    color: var(--text);
    font-size: 14px;
    text-decoration: underline;
    padding: 0;
    background: none;
    border: 0;
}

.more button:hover {
    color: var(--yellow);
}

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

/**/

.wholesale-block {
    padding: 80px 0;
    position: relative;
}

.wholesale-block::after {
    width: 100%;
    height: 150px;
    content: "";
    left: 0;
    top: 0;
    display: flex;
    position: absolute;
    background: #454545;
    background: -webkit-linear-gradient(180deg, rgba(69, 69, 69, 1) 16%, rgba(69, 69, 69, 0) 100%);
    background: -moz-linear-gradient(180deg, rgba(69, 69, 69, 1) 16%, rgba(69, 69, 69, 0) 100%);
    background: linear-gradient(180deg, rgba(69, 69, 69, 1) 16%, rgba(69, 69, 69, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#454545", endColorstr="#454545", GradientType=0);
}

.wholesale-block h2 {
    text-align: center;
    color: var(--white);
    font-size: 32px;
    text-transform: uppercase;
}

.wholesale-block h2 + .box {
    margin-top: 80px;
}

.wholesale-block .img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.wholesale-block .container {
    background: transparent;
}

.wholesale-block .box {
    display: grid;
    grid-template-columns: 745px auto;
    gap: 40px;
}

.wholesale-block .box .big-title {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: right;
    text-shadow: 27.753px 6.53px 65.302px rgba(0, 0, 0, 0.05);
    font-family: var(--font-built);
    font-size: 352px;
    line-height: 80%;
    opacity: 0.7;
    background: linear-gradient(77deg, rgba(255, 255, 255, 0.70) -1.83%, rgba(255, 246, 190, 0.70) 106.42%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    mix-blend-mode: plus-lighter;
}

.wholesale-block .box .form-block {
    width: 100%;
    border-radius: 30px;
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 50px;
    position: relative;
    background: rgba(55, 55, 55, 0.02);
    backdrop-filter: blur(20px);
}

.wholesale-block .box .form-block .text {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.wholesale-block .box .form-block .text.text-content ul li::before {
    width: 6px;
    height: 6px;
    border: 0px solid var(--white);
    background: var(--white);
    left: 16px;
    top: 9px;
}

.wholesale-block .box .form-block > * {
    position: relative;
}

.wholesale-block .box .form-block .text > * {
    color: var(--white);
}

.wholesale-block .box .form-block .text strong {
    font-weight: 600;
    color: var(--yellow);
}

.wholesale-block .box .form-block .form-box form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.wholesale-block .box .form-block .form-box form input[type="text"],
.wholesale-block .box .form-block .form-box form input[type="tel"],
.wholesale-block .box .form-block .form-box form input[type="email"] {
    width: 100%;
    height: 80px;
    border-radius: 40px;
    padding: 0 30px;
    font-size: 14px;
    font-weight: 500;
    color: var(--light-text);
    border: 1px solid var(--white);
    background: var(--white);
}

.wholesale-block .box .form-block .form-box form input[type="submit"] {
    width: 100%;
    font-size: 14px;
    height: 80px;
    border-radius: 40px;
}


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

/**/

footer {
    padding: 100px 0 70px;
    background: var(--text);
}

footer .box + .additional-links {
    margin-top: 80px;
}

footer .copyright {
    text-align: center;
    color: var(--white);
    font-size: 14px;
    line-height: 18px;
}

footer .additional-links ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px 24px;
    flex-wrap: wrap;
    margin-bottom: 12px;
    padding: 0;
}

footer .additional-links ul a {
    color: var(--white);
    font-size: 13px;
    line-height: 18px;
    opacity: 0.5;
}

footer .additional-links ul a:hover {
    opacity: 1;
}

footer .box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

footer .box .map-box {
    width: 100%;
    max-width: 540px;
    display: flex;
    flex-direction: column;
    gap: 45px;
}

footer .box .map-box .cities-list-select {
    height: 65px;
    position: relative;
}

footer .box .map-box .cities-list-select select {
    height: 65px;
    width: 100%;
    border-radius: 35px;
    background: var(--yellow);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    padding: 0 55px;
}

footer .box .map-box .map-title {
    height: 65px;
    width: 100%;
    border-radius: 35px;
    background: var(--yellow);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    padding: 0 55px;
}

footer .box .map-box .map-title::after, 
footer .box .map-box .cities-list-select::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 20px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: url('../images/map-arrow.svg') center center no-repeat, var(--white);
}

footer .box .map-box .tabcontent {
    animation: fadeEffect 1s;
}

footer .box .map-box .tabcontent:not(:first-child) {
    display: none;
}

footer .box .map-box .map {
    height: 540px;
    border-radius: 40px;
    overflow: hidden;
}

footer .box .map-box .map iframe {
    vertical-align: top;
    width: 100% !important;
    height: 100% !important;
}

footer .box .map-box .map-tabcontent .inner {
    width: 100%;
}

footer .box .map-box .map-tabcontent .inner iframe {
    width: 100%;
}

footer .box .info-box {
    width: 100%;
    max-width: 640px;
    display: flex;
    flex-direction: column;
    gap: 60px;
}

footer .box .info-box .logo img {
    max-height: 100px;
}

footer .box .info-box .menus {
    display: flex;
    gap: 130px;
}

footer .box .info-box .menus .item {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

footer .box .info-box .item-title {
    color: var(--yellow);
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
}

footer .box .info-box .menus .item ul {
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
    list-style: none;
}

footer .box .info-box .menus .item ul a {
    color: var(--white);
    font-size: 16px;
    line-height: normal;
    text-decoration: none;
}

footer .box .info-box .menus .item ul a:hover {
    color: var(--yellow);
}

footer .box .info-box .contacts {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

footer .box .info-box .contacts .contacts-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

footer .box .info-box .contacts .contacts-list > div {
    display: flex;
    align-items: center;
    gap: 12px;
}

footer .box .info-box .contacts .contacts-list span,
footer .box .info-box .contacts .contacts-list a {
    color: var(--white);
    font-size: 16px;
    line-height: normal;
    text-decoration: none;
}

footer .box .info-box .contacts .contacts-list a:hover {
    color: var(--yellow);
}

footer .box .info-box .contacts .contacts-list div::before {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    display: flex;
    content: "";
    background-color: var(--white);
    background-position: center center;
    background-repeat: no-repeat;
    transition: var(--all-inout);
}

footer .box .info-box .contacts .contacts-list div:hover::before {
    background-color: var(--yellow);
}

footer .box .info-box .contacts .contacts-list div.phone::before {
    background-image: url('../images/call-calling.svg');
}

footer .box .info-box .contacts .contacts-list div.email::before {
    background-image: url('../images/sms.svg');
}

footer .box .info-box .contacts .contacts-list div.addr::before {
    background-image: url('../images/location.svg');
}

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

/**/

.first-block {
    padding-top: 260px;
}

.breadcrumbs-block {
    padding-bottom: 34px;
}

.breadcrumbs > span:not(:last-child)::after {
    content: "/";
    margin-left: 12px;
    margin-right: 12px;
    color: var(--light-grey);
}

.breadcrumbs > span {
    color: var(--light-grey);
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
}

.home-banner .breadcrumbs > span {
    color: var(--white);
}

.breadcrumbs a {
    color: var(--light-grey);
    text-decoration: none;
}

.home-banner .breadcrumbs a {
    color: var(--white);
}

.breadcrumbs a:hover {
    color: var(--text);
}

.wholsale-banner .breadcrumbs a:hover,
.home-banner .breadcrumbs a:hover {
    color: var(--yellow);
}

.breadcrumbs + .alert {
    margin-top: 24px;
}


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

/**/

.category-block {
    padding: 0 0 50px;
}

.category-block .container > .box {
    display: grid;
    grid-template-columns: 270px calc(100% - 320px);
    gap: 60px;
}

.category-block .box .sidebar {
    width: 100%;
    max-width: 260px;
    flex-shrink: 0;
    order: 1;
}

.category-block .box .category-box {
    width: 100%;
    order: 2;
}

.category-block .box .category-box h1 {
    color: var(--yellow);
    font-size: 40px;
    font-weight: 700;
    line-height: 80%;
    text-transform: uppercase;
}

.category-block .box .category-box .subcats-box {
    border-radius: 40px;
    background: linear-gradient(253deg, #FFE16B -7.53%, #FFCF23 97.07%);
    padding: 27px 30px;
    margin-top: 26px;
}

.category-block .box .category-box .subcats-box .slider:not(.slick-slider) {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

.category-block .box .category-box .subcats-box .slider .item .img {
    width: 100%;
    height: 150px;
    border-radius: 20px;
    overflow: hidden;
}

.category-block .box .category-box .subcats-box .slider .item .img img {
    vertical-align: top;
    scale: 1;
    transition: var(--all-inout);
}

.category-block .box .category-box .subcats-box .slider .item:hover .img img {
    scale: 1.05;
}

.category-block .box .category-box .subcats-box .slider .item .name {
    margin-top: 12px;
}

.category-block .box .category-box .subcats-box .slider .item .name,
.category-block .box .category-box .subcats-box .slider .item .name a {
    text-align: center;
    color: var(--text);
    font-size: 18px;
    font-weight: 600;
    line-height: 100%;
    text-decoration: none;
}

.category-block .box .category-box .subcats-box .slider .item:hover .name a {
    color: var(--white);
}

.category-block .box .category-box .subcats-box .slider.slick-slider .item {
    margin: 0 10px;
}

.category-block .box .category-box .subcats-box .slider.slick-slider .slick-list {
    margin-left: -10px;
    margin-right: -10px;
}

.category-block .box .category-box .subcats-box .slider .slick-arrow {
    position: absolute;
    top: 50%;
    margin-top: -20px;
}

.category-block .box .category-box .subcats-box .slider .slick-arrow.slick-prev {
    left: -80px;
}

.category-block .box .category-box .subcats-box .slider .slick-arrow.slick-next {
    right: -80px;
}

.category-block .box .category-products-list {
    margin-top: 60px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.pagination {
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0;
    list-style: none;
}

.pagination span,
.pagination a {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: var(--white);
    color: var(--text);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.pagination span,
.pagination a:hover {
    color: var(--white);
    background: var(--yellow);
}

.category-block .box .category-text {
    margin-top: 80px;
}

.category-block .box .category-text .text-wr + .more {
    margin-top: 24px;
}

.category-block .box .category-text .text-wr.open + .more {
    display: none;
}

.category-block .box .category-text .text-wr {
    max-height: 180px;
    overflow: hidden;
    position: relative;
}

.category-block .box .category-text .text-wr::after {
    width: 100%;
    height: 40px;
    display: flex;
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    background: #F5F5F5;
    background: -webkit-linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    background: -moz-linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    background: linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#F5F5F5", endColorstr="#F5F5F5", GradientType=0);
    transition: var(--all-inout)
}

.category-block .box .category-text .text-wr.open::after {
    opacity: 0;
}

.category-block .search-box {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 32px;
}

.category-block .search-box label {
    font-size: 20px;
    line-height: 120%;
}

.category-block .search-box .search-line {
    position: relative;
}

.category-block .search-box .search-line input[type="text"] {
    width: 100%;
    height: 54px;
    border-radius: 40px;
    padding: 0 30px;
    font-size: 14px;
    font-weight: 500;
    color: var(--light-text);
    border: 1px solid var(--grey);
    background: var(--white);
}

.category-block .search-box .search-line button#button-search-page {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 1px solid var(--grey);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
}

.category-block .search-box .search-line button#button-search-page::before {
    width: 22px;
    height: 22px;
    display: flex;
    content: "";
    background: var(--text);
    transition: var(--all-inout);
}

.category-block .search-box .search-line button#button-search-page::before {
    mask: url('../images/search-icon.svg') center center no-repeat;
}


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

/**/

.product-block {
    padding-bottom: 50px;
}

.product-block .container {
    display: flex;
    gap: 60px;
}

.product-block .container .product-info {
    max-width: 670px;
    width: 100%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.product-gallery {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.product-gallery .gallery-slider .item {
    border-radius: 40px;
    overflow: hidden;
    height: 500px;
}

.product-gallery .gallery-slider .item img {
    vertical-align: top;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-gallery .gallery-thumbs:not(.slick-slider) {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}

.product-gallery .gallery-thumbs.slick-slider .slick-list {
    margin-left: -6px;
    margin-right: -6px;;
}

.product-gallery .gallery-thumbs .item {
    height: 156px;
    border-radius: 20px;
    overflow: hidden;
}

.product-gallery .gallery-thumbs.slick-slider .item {
    margin: 0 6px;
}

.product-gallery .gallery-thumbs .item img {
    vertical-align: top;
}

.product-gallery .gallery-slider .slick-arrow {
    z-index: 2;
    position: absolute;
    top: calc(50% - 20px);
}

.product-gallery .gallery-slider .slick-arrow.slick-prev {
    left: 20px;
}

.product-gallery .gallery-slider .slick-arrow.slick-next {
    right: 20px;
}

.product-about .text-wr {
    max-height: 180px;
    overflow: hidden;
    position: relative;
}

.product-about .text-wr::after {
    width: 100%;
    height: 40px;
    display: flex;
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    background: #F5F5F5;
    background: -webkit-linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    background: -moz-linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    background: linear-gradient(0deg, rgba(245, 245, 245, 1) 35%, rgba(245, 245, 245, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#F5F5F5", endColorstr="#F5F5F5", GradientType=0);
    transition: var(--all-inout)
}

.product-about .text-wr.open::after {
    opacity: 0;
}

.product-about .text-wr + .more {
    margin-top: 24px;
}

.product-about .text-wr.open + .more {
    display: none;
}

.product-data {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}

.product-data .data {
    width: 100%;
    border-radius: 40px;
    background: var(--white);
    padding: 32px;
}

.product-data .data h1 {
    color: var(--yellow);
    font-size: 40px;
    font-weight: 700;
    line-height: normal;    
    text-transform: uppercase;
}

.product-data .manufacturer {
    margin-top: 16px;
    font-size: 14px;
    font-weight: 700;
    line-height: normal;
}

.product-data .product-rating {
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.product-data .product-rating .rating {
    display: flex;
    align-items: center;
    gap: 2px;
}

.product-data .product-rating .rating span {
    display: flex;
    width: 16px;
    height: 16px;
    background: url('../images/star-stroked.svg') center center no-repeat;
}

.product-data .product-rating .rating span.star {
    background: url('../images/star.svg') center center no-repeat;
}

.product-data .product-rating .review-link a {
    color: var(--text);
    font-size: 14px;
    text-transform: lowercase;
}

.product-data .product-rating .review-link a:hover {
    color: var(--yellow);
}

.product-data .avilability {
    margin-top: 24px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    display: flex;
    align-items: center;
    gap: 4px;
}

.product-data .avilability::before {
    width: 24px;
    height: 24px;
    display: flex;
    content: "";
}

.product-data .avilability.in-stock {
    color: var(--yellow);
}

.product-data .avilability.in-stock::before {
    background: url('../images/tick-circle.svg') center center no-repeat;
}

.product-data .avilability.out-of-stock {
    color: var(--light-grey);
}

.product-data .avilability.out-of-stock::before {
    background: url('../images/tick-circle-out.svg') center center no-repeat;
}

.product-data .options-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-top: 40px;
}

.product-data .options-list .option-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.product-data .options-list .option-group .option-title {
    font-size: 18px;
    font-weight: 700;
}

.product-data .options-list .option-group .option-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.product-data .options-list .option-group .option-row label.radio {
    display: flex;
    cursor: pointer; 
}

.product-data .options-list .option-group .option-row label.radio input[type="radio"] {
    display: none;
}

.product-data .options-list .option-group .option-row label.radio span {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    padding: 0 24px;
    border-radius: 25px;
    border: 1px solid var(--light-grey);
    color: var(--text);
    font-size: 16px;
    transition: var(--all-inout)
}

.product-data .options-list .option-group .option-row label.radio:hover span {
    border-color: var(--text);
}

.product-data .options-list .option-group .option-row label.radio input:checked + span {
    border-color: var(--yellow);
    background: var(--yellow);
}

.product-data .controls {
    margin-top: 40px;
    display: flex;
    align-items: center;
    gap: 60px;
}

.product-count {
    display: flex;
    align-items: center;
    border-bottom: 2px solid var(--grey);
    padding: 6px 0;
    gap: 12px;
}

.product-count button {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    padding: 0;
    background: transparent;
    border: 1px solid var(--text);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--text);
    font-size: 20px;
}

.product-count button.decrease::before {
    content: "-";
    line-height: 20px;
}

.product-count button.increase::before {
    content: "+";
    line-height: 20px;
}

.product-count button:hover {
    color: var(--yellow);
    border-color: var(--yellow);
}

.product-count input[type="number"],
.product-count input[type="text"] {
    width: 70px;
    height: 24px;
    border: 0;
	appearance: textfield;
	-moz-appearance: textfield;
	-webkit-appearance: textfield;
	-ms-progress-appearance: textfield;
	font-size: 20px;
    font-weight: 600;
    color: var(--text);
    text-align: center;
}

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

.product-data .controls .price {
    display: flex;
    align-items: baseline;
    gap: 24px;
}

.product-data .controls .price .old-price {
    text-decoration: line-through;
    color: var(--light-grey);
    font-size: 18px;
}

.product-data .controls .price .current-price {
    color: var(--text);
    font-size: 40px;
    font-weight: 700;
}

.product-data .but {
    margin-top: 40px;
}

.product-data .but button {
    height: 70px;
    padding: 0 70px;
    border-radius: 35px;
}

.product-data .tabs {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.product-data .tabs .tabs-buts {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    border-bottom: 2px solid var(--grey);
}

.product-data .tabs .tabs-buts button {
    padding: 0 0 24px 0;
    border: 0;
    background: 0;
    font-size: 24px;
    line-height: 80%;
    position: relative;
    color: var(--black) !important;
}

.product-data .tabs .tabs-buts button::after {
    width: 100%;
    height: 4px;
    border-radius: 2px;
    display: flex;
    background: var(--yellow);
    position: absolute;
    bottom: -2px;
    left: 0;
    opacity: 0;
    z-index: 2;
    transition: var(--all-inout);
    content: "";
}

.product-data .tabs .tabs-buts button.active {
    font-weight: 700;
}

.product-data .tabs .tabs-buts button:hover::after,
.product-data .tabs .tabs-buts button.active::after {
    opacity: 1;
}

.product-data .tabs .tabs-content .tabcontent:not(:first-child) {
    display: none;
}

.product-data .tabs .tabs-content .tabcontent {
    animation: fadeEffect 1s;
}

.product-data .receipes-list {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.product-data .receipes-list .list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
}

.product-data .receipes-list .list .item .img {
    width: 100%;
    height: 110px;
    border-radius: 20px;
}

.product-data .receipes-list .list .item .img img {
    scale: 1;
    transition: var(--all-inout);
    vertical-align: top;
}

.product-data .receipes-list .list .item:hover .img img {
    scale: 1.05;
}

.product-data .receipes-list .list .item .name {
    margin-top: 12px;
}

.product-data .receipes-list .list .item .name a {
    color: var(--light-grey);
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    line-height: 120%;
    text-decoration: none;
    display: block;
}

.product-data .receipes-list .list .item:hover .name a {
    color: var(--text);
}

.review-inner {
    width: 100%;
}

#review .review-item {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#review .review-item .info {
    background: var(--white);
    padding: 8px 16px;
    border-radius: 12px;
    display: flex;
    justify-content: space-between;
    gap: 24px;
}

#review .review-item .info .date {
    margin-left: auto;
    font-size: 14px;
    color: var(--light-grey);
}

#review .review-item .info .name {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
}

#review .review-item .info .rating {
    display: flex;
    align-items: center;
    gap: 2px;
}

#review .review-item .info .rating span {
    display: flex;
    width: 16px;
    height: 16px;
    background: url('../images/star-stroked.svg') center center no-repeat;
}

#review .review-item .info .rating span.star {
    background: url('../images/star.svg') center center no-repeat;
}

#review .review-item .text {
    padding: 0 16px 16px 16px;
    border-bottom: 1px solid var(--grey-text);
}

#form-review .h4 {
    margin-top: 24px;
    margin-bottom: 24px;
}

#form-review .form-group > div {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#form-review .form-group > div > label {
    color: var(--light-grey);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
}

#form-review .fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#form-review .form-group > div input[type="text"],
#form-review .form-group > div input[type="tel"],
#form-review .form-group > div input[type="email"],
#form-review .form-group > div textarea {
    width: 100%;
    padding: 0 20px;
    border-radius: 16px;
    border: 1px solid var(--grey);
    background: var(--white);
    height: 56px;
    color: var(--text);
    font-size: 16px;
}

#form-review .form-group > div textarea {
    height: 120px;
    padding: 20px;
}

#form-review .form-group > div .help-block {
    font-size: 12px;
}

#form-review .form-group .radio-list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 4px;
}

#form-review .form-group .radio-list label input[type="radio"] {
    display: none;
}

#form-review .form-group .radio-list label {
    position: relative;
    display: block;
    cursor: pointer;
}

#form-review .form-group .radio-list label > span {
    color: var(--text);
    font-size: 16px;
    line-height: 28px;
    display: block;
    padding-left: 36px;
    position: relative;
}

#form-review .form-group .radio-list label > span span {
    display: block;
    color: var(--light-grey);
    font-size: 14px;
    font-weight: 600;
    line-height: 120%;
}

#form-review .form-group .radio-list label > span::before {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #fff;
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    display: flex;
}

#form-review .form-group .radio-list label > span::after {
    transition: var(--all-inout);
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--yellow);
    position: absolute;
    left: 12px;
    top: 14px;
    transform: translate(-50%, -50%);
    opacity: 0;
    scale: 0;
}

#form-review .form-group .radio-list label input:checked + span::after {
    scale: 1;
    opacity: 1;
}

#form-review .buttons {
    margin-top: 24px;  
}

#form-review .buttons button {
    width: fit-content;
}

#form-review .alert {
    margin-top: 24px;
}

.alert {
    padding: 16px 40px 16px 16px;
    position: relative;
}

.alert + .box {
    margin-top: 32px;
}

.alert.alert-danger {
    border-radius: 12px;
    padding: 16px;
    background: rgba(255, 0, 0, 0.05);
    color: #E90101;
    font-size: 14px;
    transition: var(--all-inout);
}

.alert.alert-danger a {
    color: #E90101;
}

.alert.alert-success {
    border-radius: 12px;
    padding: 16px;
    background: rgba(0, 255, 85, 0.1);
    color: #00a811;
    font-size: 14px;
    transition: var(--all-inout);
}

.alert.alert-success a {
    color: #00a811;
}

.alert .close {
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    border: 1px solid var(--text);
    background: var(--white);
    position: absolute;
    top: calc(50% - 12px);
    right: 16px;
}


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

/**/

.cart-block {
    padding-bottom: 80px;
}

.cart-block h1 {
    color: var(--yellow);
    font-size: 40px;
    font-weight: 700;
    line-height: 80%;
    text-transform: uppercase;
}

.cart-block h1 + .box {
    margin-top: 32px;
}

.cart-block .box > .but {
    margin-top: 24px;
    display: flex;
}

.cart-block .box > .but a {
    width: fit-content;
}

.cart-block .cart-block-table {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.cart-block .cart-block-table .title-row {
    height: 65px;
    width: 100%;
    border-radius: 40px;
    border: 1px solid var(--grey);
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cart-block .cart-block-table .title-row > div {
    color: var(--text);
    font-size: 13px;
    font-weight: 700;
    line-height: normal;
}

.cart-block .cart-block-table .title-row .image {
    text-align: center;
    width: 182px;
    margin-left: 20px;
}

.cart-block .cart-block-table .title-row .name {
    width: 280px;
}

.cart-block .cart-block-table .title-row .count {
    width: 142px;
}

.cart-block .cart-block-table .title-row .price,
.cart-block .cart-block-table .title-row .total {
    width: 140px;
}

.cart-block .cart-block-table .title-row .remove {
    width: 110px;
}

.cart-block .cart-block-table .products-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cart-block .cart-block-table .products-list .product-row {
    width: 100%;
    border-radius: 40px;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cart-block .cart-block-table .products-list .product-row .image {
    width: 182px;
    height: 140px;
    margin: 20px 0 20px 20px;
    border-radius: 20px;
}

.cart-block .cart-block-table .products-list .product-row .image img {
    scale: 1;
    transition: var(--all-inout);
}

.cart-block .cart-block-table .products-list .product-row:hover .image img {
    scale: 1.05;
}

.cart-block .cart-block-table .products-list .product-row .name {
    width: 280px;
}

.cart-block .cart-block-table .products-list .product-row .name a {
    color: var(--text);
    font-size: 18px;
    line-height: 110%;
    text-decoration: none;
}

.cart-block .cart-block-table .products-list .product-row .name a:hover {
    color: var(--yellow);
}

.cart-block .cart-block-table .products-list .product-row .name .options {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 12px;
}

.cart-block .cart-block-table .products-list .product-row .name .options p {
    font-size: 14px;
    color: var(--light-grey);
}

.cart-block .cart-block-table .products-list .product-row .count {
    width: 142px;
}

.cart-block .cart-block-table .products-list .product-row .price,
.cart-block .cart-block-table .products-list .product-row .total {
    width: 160px;
    color: var(--text);
    font-size: 18px;
    line-height: 1;
}

.cart-block .cart-block-table .products-list .product-row .total {
    font-weight: 700;
}

.cart-block .cart-block-table .products-list .product-row .remove {
    width: 110px;
    height: 180px;
}

.cart-block .cart-block-table .products-list .product-row .remove button {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 0 40px 40px 0;
    background: url('../images/trash.svg') center center / 32px auto no-repeat;
    padding: 0;
    border: 0;
    cursor: pointer;
}

.cart-block .cart-block-table .products-list .product-row .remove button::after {
    z-index: 2;
    position: absolute;
    left: 110%;
    top: 0;
    opacity: 0;
    background: url('../images/close-circle.svg') center center / 32px auto no-repeat, var(--yellow);
    width: 100%;
    height: 100%;
    transition: var(--all-inout);
    content: "";
}

.cart-block .cart-block-table .products-list .product-row .remove button:hover::after {
    left: 0;
    opacity: 1;
}

.cart-block .cart-total-info {
    margin-top: 24px;
    display: flex;
    align-items: center;
    gap: 32px;
    justify-content: flex-end;
}

.cart-block .cart-total-info .total {
    color: var(--light-grey);
    font-size: 24px;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
}

.cart-block .cart-total-info .total span {
    color: var(--text);    
    margin-left: 8px;
}

.cart-block .cart-total-info .but a {
    height: 70px;
    padding: 0 70px;
    border-radius: 35px;
}

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

/**/

.contacts-block h1 {
    color: var(--yellow);
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 32px;
}

.contacts-block .contacts-box {
    background: var(--yellow);
    position: relative;
    overflow: hidden;
    border-radius: 40px;
    padding: 80px 60px;
    display: flex;
    justify-content: space-between;
    gap: 120px;
}

.contacts-block .contacts-box::before {
    width: 420px;
    height: 420px;
    border-radius: 420px;
    background: rgba(255, 255, 255, 0.60);
    filter: blur(210px);
    content: "";
    position: absolute;
    z-index: 1;
    left: -73px;
    bottom: 120px;
    opacity: 0.7;
}

.contacts-block .contacts-box::after {
    width: 420px;
    height: 420px;
    border-radius: 420px;
    background: rgba(255, 255, 255, 0.60);
    filter: blur(210px);
    content: "";
    position: absolute;
    z-index: 1;
    right: -55px;
    top: -110px;
    opacity: 0.7;
}

.contacts-block .contacts-box .info-box {
    display: flex;
    flex-direction: column;
    gap: 24px;
    position: relative;
    z-index: 2;
}

.contacts-block .contacts-box .info-box .item-title {
    color: var(--text);
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
}

.contacts-block .contacts-box .info-box .contacts {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.contacts-block .contacts-box .info-box .contacts .contacts-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.contacts-block .contacts-box .info-box .contacts .contacts-list > div {
    display: flex;
    align-items: center;
    gap: 12px;
}

.contacts-block .contacts-box .info-box .contacts .contacts-list span,
.contacts-block .contacts-box .info-box .contacts .contacts-list a {
    color: var(--text);
    font-size: 16px;
    line-height: normal;
    text-decoration: none;
}

.contacts-block .contacts-box .info-box .contacts .contacts-list a:hover {
    text-decoration: underline;
}

.contacts-block .contacts-box .info-box .contacts .contacts-list div::before {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    display: flex;
    content: "";
    background-color: var(--white);
    background-position: center center;
    background-repeat: no-repeat;
    transition: var(--all-inout);
}

.contacts-block .contacts-box .info-box .contacts .contacts-list div.phone::before {
    background-image: url('../images/call-calling.svg');
}

.contacts-block .contacts-box .info-box .contacts .contacts-list div.email::before {
    background-image: url('../images/sms.svg');
}

.contacts-block .contacts-box .info-box .contacts .contacts-list div.addr::before {
    background-image: url('../images/location.svg');
}

.contacts-block .contacts-box .cities-list {
    padding: 32px 24px;
    background: var(--white);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    gap: 36px;
    margin-top: auto;
}

.contacts-block .contacts-box .cities-list .title {
    color: var(--text);
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
}

.contacts-block .contacts-box .cities-list .list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 12px;
    align-items: center;
}

.contacts-block .contacts-box .cities-list .list button {
    height: 50px;
    border-radius: 25px;
    border: 1px solid var(--text);
    padding: 0 25px;
    color: var(--text);
    font-size: 16px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
}

.contacts-block .contacts-box .cities-list .list button:hover,
.contacts-block .contacts-box .cities-list .list button.active {
    color: var(--yellow);
    border-color: var(--yellow);
}

.contacts-block .contacts-box .map-box {
    width: 100%;
    max-width: 615px;
    position: relative;
    z-index: 2;
}

.contacts-block .contacts-box .map-box .tabcontent {
    animation: fadeEffect 1s;
}

.contacts-block .contacts-box .map-box .tabcontent:not(:first-child) {
    display: none;
}

.contacts-block .contacts-box .map-box .map-title,
.cities-list-select select {
    height: 65px;
    width: 100%;
    border-radius: 35px;
    background: var(--white);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    color: var(--text);
    font-size: 16px;
    font-weight: 700;
    padding: 0 55px;
}

.cities-list-select select {
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.contacts-block .contacts-box .map-box .map-title::after,
.cities-list-select::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 10px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: url('../images/map-arrow.svg') center center no-repeat, var(--text);
}

.contacts-block .contacts-box .map-box .map {
    height: 540px;
    border-radius: 40px;
    overflow: hidden;
    margin-top: 45px;
}

.contacts-block .contacts-box .map-box .map iframe {
    vertical-align: top;
    width: 100% !important;
    height: 100% !important;
}

.contacts-block .contacts-box .map-box .tabcontent .inner {
    width: 100%;
}

.contacts-block .contacts-box .info-box .social {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.contacts-block .contacts-box .info-box .social .social-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.contacts-block .contacts-box .info-box .social .social-list a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: var(--white);
}

.contacts-block .contacts-box .info-box .social .social-list a img {
    transition: var(--all-inout);
}

.contacts-block .contacts-box .info-box .social .social-list a:hover {
    background: var(--text);
}

.contacts-block .contacts-box .info-box .social .social-list a:hover img {
    filter: brightness(0) invert(1);
}


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

/**/

.info-page {
    position: relative;
    background: url('../images/87769bdded62b302982a7eb2f8cf54332deb00c2.png') center center / cover no-repeat;
    padding-bottom: 200px;
}

.info-page::before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    background: linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0.10) 100%);
    backdrop-filter: blur(5px);
    z-index: 1;
}

.info-page .container {
    z-index: 2;
}

.info-page .box {
    display: flex;
    flex-direction: column;
    gap: 40px;
    text-align: center;
    align-items: center;
}

.info-page .box h1 {
    color: var(--text);
    font-size: 40px;
    font-weight: 700;
    line-height: 150%;
    text-transform: uppercase;
}

.info-page .box .code {
    position: relative;
    color: var(--text);
    text-align: center;
    font-size: 356px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.info-page .box .code img {
    position: absolute;
    bottom: -15px;
    left: calc(50% - 40px);
    z-index: 2;
    max-width: 196px;
}

.info-page .box .but a {
    height: 70px;
    border-radius: 35px;
    padding: 0 40px;
}

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

/**/

.sertificates-block {
    padding: 60px 0 80px;
}

.sertificates-block h2 + .text {
    margin-top: 40px;
    max-width: 50%;
}

.sertificates-block h2 + .box,
.sertificates-block .text + .box {
    margin-top: 40px;
}

.sertificates-block .box {
    border-radius: 40px;
    background: var(--white);
    padding: 40px 32px;
}

.sertificates-block .box .slider:not(.slick-slider) {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 20px;
}

.sertificates-block .box .slider.slick-slider .slick-list {
    margin-left: -10px;
    margin-right: -10px;
}

.sertificates-block .box .slider.slick-slider .img {
    margin: 0 10px;
}

.sertificates-block .box .slider.slick-slider .slick-arrow {
    position: absolute;
    top: calc(50% - 20px);
}

.sertificates-block .box .slider.slick-slider .slick-arrow.slick-prev {
    left: -90px;
}

.sertificates-block .box .slider.slick-slider .slick-arrow.slick-next {
    right: -90px;
}

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

/**/

.chess-text-blocks {
    padding: 90px 0;
}

.chess-text-blocks .box {
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.chess-text-blocks .box .item {
    display: grid;
    grid-template-columns: auto 740px;
    gap: 80px;
}

.chess-text-blocks .box .item .text {
    justify-content: center;
    gap: 32px;
}

.chess-text-blocks .box .item .text ul li {
    position: relative;
}

.chess-text-blocks .box .item .text ul li::before {
    width: 6px;
    height: 6px;
    border: 0px solid var(--white);
    background: var(--text);
    left: 16px;
    top: 9px;
}

.chess-text-blocks .box .item:nth-child(2n) {
    grid-template-columns: 740px auto;
}

.chess-text-blocks .box .item:nth-child(2n) .image {
    order: 2;
}

.chess-text-blocks .box .item:nth-child(2n) .text {
    order: 1;
}

.home-banner.delivery-banner + .delivery-payment-block + .clients-block + .chess-text-blocks .box .item:nth-child(2n+1),
.home-banner.delivery-banner + .delivery-payment-block + .chess-text-blocks .box .item:nth-child(2n+1),
.home-banner.delivery-banner + .chess-text-blocks .box .item:nth-child(2n+1) {
    grid-template-columns: 740px auto;
}

.home-banner.delivery-banner + .delivery-payment-block + .clients-block + .chess-text-blocks .box .item:nth-child(2n+1) .image,
.home-banner.delivery-banner + .delivery-payment-block + .chess-text-blocks .box .item:nth-child(2n+1) .image,
.home-banner.delivery-banner + .chess-text-blocks .box .item:nth-child(2n+1) .image {
    order: 2;
}

.home-banner.delivery-banner + .delivery-payment-block + .clients-block + .chess-text-blocks .box .item:nth-child(2n+1) .text,
.home-banner.delivery-banner + .delivery-payment-block + .chess-text-blocks .box .item:nth-child(2n+1) .text,
.home-banner.delivery-banner + .chess-text-blocks .box .item:nth-child(2n+1) .text {
    order: 1;
}

.chess-text-blocks .box .item .image {
    position: relative;
    min-height: 680px;
}

.chess-text-blocks .box .item .image .img-inner {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}

.chess-text-blocks .box .item .image img {
    max-height: 100%;
    border-radius: 40px;
    max-width: 100%;
}

.chess-text-blocks .text-content .h1 {
    font-size: 40px;
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 32px;
}

.chess-text-blocks .text-content .h1 strong {
    color: var(--yellow);
}

.chess-text-blocks .box .item .image .but {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 0;
    bottom: 10px;
    z-index: 2;
}

.chess-text-blocks .box .item .image .but a {
    height: 70px;
    padding: 0 40px;
    border-radius: 70px;
}

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

/**/

.articles-list-block {
    padding-bottom: 80px;
}

.articles-list-block h1 {
    text-align: center;
    text-transform: uppercase;
}

.articles-list-block h1 + .categories-list {
    margin-top: 60px;
}

.articles-list-block h1 + .box,
.articles-list-block .categories-list + .box {
    margin-top: 60px;
}

.articles-list-block .categories-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.articles-list-block .categories-list a {
    height: 50px;
    padding: 0 20px;
    border: 1px solid var(--text);
    color: var(--text);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    text-transform: uppercase;
    text-decoration: none;
    background: var(--white);
    border-radius: 25px;
}

.articles-list-block .categories-list a.active,
.articles-list-block .categories-list a:hover {
    color: var(--yellow);
    border-color: var(--yellow);
}

.articles-list-block .box {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.articles-list-block .box .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 160px;
}

.articles-list-block .box .item .image {
    width: 100%;
    max-width: 590px;
    height: 590px;
    position: relative;
    z-index: 2;
}

.articles-list-block .box .item .image .img-inner {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden;
}

.articles-list-block .box .item .image .img-inner img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.articles-list-block .box .item .image .logo {
    width: 190px;
    height: 190px;
    padding: 30px;
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(18.25px);
    border-radius: 30px;
    position: absolute;
    left: calc(50% - 95px);
    top: calc(50% - 95px);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.articles-list-block .box .item .image .logo img {
    max-width: 100px;
    max-height: 75px;
    filter: brightness(0);
}

.articles-list-block .box .item .image .logo p {
    color: var(--black);
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    text-transform: lowercase;
}

.articles-list-block .box .item .info {
    min-height: 396px;
    padding: 65px 125px 65px 0;
    border-radius: 0 50px 50px 0;
    background: var(--white);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 46px;
    position: relative;
    width: 100%;
}

.articles-list-block .box .item .info::before {
    width: 50%;
    height: 100%;
    right: 100%;
    top: 0;
    position: absolute;
    content: "";
    background: var(--white);
}

.articles-list-block .box .item .info .title a {
    color: var(--yellow);
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
}

.articles-list-block .box .item .info .title a:hover {
    color: var(--text);
}

.articles-list-block .box .item .info .data {
    display: flex;
    align-items: center;
    gap: 50px;
}

.articles-list-block .box .item .info .data .tags {
    display: flex;
    align-items: center;
    gap: 12px;
}

.articles-list-block .box .item .info .data .tags a,
.articles-list-block .box .item .info .data .tags span {
    height: 50px;
    background: var(--white);
    padding: 0 24px;
    color: var(--text);
    font-size: 16px;
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--light-grey);
    border-radius: 25px;
}



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

/**/

.article-block {
    padding-bottom: 80px;
}

.article-block .box .preview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 160px;
}

.article-block .box .preview .image {
    width: 100%;
    max-width: 590px;
    height: 590px;
    position: relative;
    z-index: 2;
}

.article-block .box .preview .image .img-inner {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--yellow);
    overflow: hidden;
}

.article-block .box .preview .image .img-inner img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-block .box .preview .image .logo {
    width: 190px;
    height: 190px;
    padding: 30px;
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(18.25px);
    border-radius: 30px;
    position: absolute;
    left: calc(50% - 95px);
    top: calc(50% - 95px);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.article-block .box .preview .image .logo img {
    max-width: 100px;
    max-height: 75px;
    filter: brightness(0);
}

.article-block .box .preview .image .logo p {
    color: var(--black);
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    text-transform: lowercase;
}

.article-block .box .preview .image .logo {
    width: 190px;
    height: 190px;
    padding: 30px;
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(18.25px);
    border-radius: 30px;
    position: absolute;
    left: calc(50% - 95px);
    top: calc(50% - 95px);
}

.article-block .box .preview .info {
    min-height: 396px;
    padding: 65px 125px 65px 0;
    border-radius: 0 50px 50px 0;
    background: var(--white);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 46px;
    position: relative;
}

.article-block .box .preview .info::before {
    width: 50%;
    height: 100%;
    right: 100%;
    top: 0;
    position: absolute;
    content: "";
    background: var(--white);
}

.article-block .box .preview .info h1 {
    color: var(--yellow);
    font-size: 40px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    text-decoration: none;
}

.article-block .box .preview .info .data {
    display: flex;
    align-items: center;
    gap: 50px;
}

.article-block .box .preview .info .data .tags {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap; 
}

.article-block .box .preview .info .data .tags a,
.article-block .box .preview .info .data .tags span {
    height: 50px;
    background: var(--white);
    padding: 0 24px;
    color: var(--text);
    font-size: 16px;
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--light-grey);
    border-radius: 25px;
}

.article-block .box .article-cols {
    display: grid;
    grid-template-columns: 400px auto;
    gap: 240px;
    margin-top: 40px;
}

.article-block .text-content h2 {
    color: var(--yellow);
    text-transform: uppercase;
    font-size: 36px;
}

.article-block .box > .text {
    margin-top: 60px;
    gap: 24px;
}

.article-block .box > .text table {
    margin-top: 32px;
    border: 0;
}

.article-block .box > .text table td {
    vertical-align: top;
    border: 0;
}

.article-block .box > .text table td > *:not(:first-child) {
    margin-top: 32px;
}

.article-block .box > .text table td:first-child {
    width: 500px;
}

.article-block .box .chess-text-boxes {
    display: flex;
    flex-direction: column;
    gap: 32px;
    margin-top: 60px;
}

.article-block .box .chess-text-boxes .item {
    display: grid;
    grid-template-columns: 370px auto;
    gap: 16px;
}

.article-block .box .chess-text-boxes .item:nth-child(2n) {
    grid-template-columns: auto 370px;
}

.article-block .box .chess-text-boxes .item .img {
    position: relative;
}

.article-block .box .chess-text-boxes .item:nth-child(2n) .img {
    order: 2;
}

.article-block .box .chess-text-boxes .item .img .img-inner {
    border-radius: 30px;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.article-block .box .chess-text-boxes .item .text {
    padding: 40px;
    background: var(--white);
    border-radius: 30px;
}

.article-block .box .chess-text-boxes .item:nth-child(2n) .text {
    order: 1;
}


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

/**/

.other-articles {
    padding: 60px 0 80px;
}

.other-articles h2 + .box {
    margin-top: 40px;
}

.other-articles .box .slider:not(.slick-slider) {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.other-articles .box .slider.slick-slider .slick-list {
    margin-left: -6px;
    margin-right: -6px;
}

.other-articles .box .slider.slick-slider .slick-list .item {
    margin: 0 6px;
}

.other-articles .box .item {
    padding: 30px;
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    background: var(--all-inout);
    background: var(--white);
}

.other-articles .box .item .image {
    width: 100%;
    height: 234px;
    border-radius: 20px;
    overflow: hidden;
}

.other-articles .box .item .image img {
    scale: 1;
    transition: var(--all-inout);
}

.other-articles .box .item:hover .image img {
    scale: 1.05;
}

.other-articles .box .item .name {
    margin-top: 24px;
}

.other-articles .box .item .name a {
    text-decoration: none;
    color: var(--text);
    font-size: 24px;
    font-weight: 600;
    line-height: 100%;
}

.other-articles .box .item .name a:hover {
    color: var(--yellow);
}

.other-articles .box .item > p {
    margin-top: 4px;
    color: var(--light-grey);
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
}

.other-articles .box .slider .slick-arrow.slick-prev {
    position: absolute;
    left: -58px;
    top: calc(50% - 20px);
}

.other-articles .box .slider .slick-arrow.slick-next {
    position: absolute;
    right: -58px;
    top: calc(50% - 20px);
}

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

/**/

.checkout-block {
    padding: 0 0 80px;
}

.checkout-block h1 + .box {
    margin-top: 40px;
}

.checkout-block h1 {
    font-size: 40px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--yellow);
}

.checkout-block .box {
    display: grid;
    grid-template-columns: auto 400px;
    gap: 80px;
}

.checkout-block .box .form-box {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.checkout-block .box .form-box .form-part {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.checkout-block .box .form-box .form-part .title {
    color: var(--yellow);
    font-size: 32px;
    font-weight: 700;
    line-height: 80%;
    text-transform: uppercase;
}

.checkout-block .box .form-box .form-part .fields {
    width: 100%;
    padding: 40px;
    border-radius: 40px;
    background: var(--white);
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.checkout-block .box .form-box .form-part .fields > .row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
}

.checkout-block .box .form-box .form-part .fields .form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.checkout-block .box .form-box .form-part .fields .form-group > label {
    color: var(--light-grey);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
}

.checkout-block .box .form-box .form-part .fields .form-group input[type="text"],
.checkout-block .box .form-box .form-part .fields .form-group input[type="tel"],
.checkout-block .box .form-box .form-part .fields .form-group input[type="email"] {
    width: 100%;
    padding: 0 20px;
    border-radius: 16px;
    border: 1px solid var(--grey);
    background: var(--white);
    height: 56px;
    color: var(--text);
    font-size: 16px;
}

.checkout-block .box .form-box .form-part .fields .form-group input[type="text"].error,
.checkout-block .box .form-box .form-part .fields .form-group input[type="tel"].error,
.checkout-block .box .form-box .form-part .fields .form-group input[type="email"].error {
    border-color: red;
}

.checkout-block .box .form-box .form-part .fields .form-group .field-title {
    color: var(--yellow);
    font-size: 24px;
    font-weight: 700;
    line-height: 120%;
    text-transform: uppercase;
}

.checkout-block .box .form-box .form-part .fields .form-group > p {
    color: var(--light-grey);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list {
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
    margin-top: 24px;
}

.checkout-block .box .form-box .form-part.form-part-shipping .fields .form-group .radio-list,
.checkout-block .box .form-box .form-part.form-part-payment .fields .form-group .radio-list {
    gap: 24px;
    flex-direction: column;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label input[type="radio"] {
    display: none;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label {
    position: relative;
    display: block;
    cursor: pointer;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label > span {
    color: var(--text);
    font-size: 20px;
    line-height: 28px;
    display: block;
    padding-left: 36px;
    position: relative;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label > span span {
    display: block;
    color: var(--light-grey);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label > span::before {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #EEE;
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    display: flex;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label > span::after {
    transition: var(--all-inout);
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--yellow);
    position: absolute;
    left: 12px;
    top: 14px;
    transform: translate(-50%, -50%);
    opacity: 0;
    scale: 0;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label input:checked + span::after {
    scale: 1;
    opacity: 1;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label .additional-address-fields[style="display: block;"] {
    margin-top: 24px;
}

.checkout-block .box .form-box .form-part .fields .form-group .radio-list label .additional-address-fields .form-group:not(:first-child) {
    margin-top: 16px;
}

.checkout-block .box .form-box .form-part .fields .form-group.select select {
    margin-top: 16px;
    width: 100%;
    padding: 0 20px;
    border-radius: 16px;
    border: 1px solid var(--grey);
    background: url('../images/Frame48096834.svg') calc(100% - 20px) 50% no-repeat, var(--white);
    height: 56px;
    color: var(--text);
    font-size: 16px;
    padding-right: 58px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.checkout-block .box .form-box .form-part .fields .form-group textarea {
    width: 100%;
    padding: 20px;
    border-radius: 16px;
    border: 1px solid var(--grey);
    height: 150px;
    color: var(--text);
    font-size: 16px;
}

.checkout-block .box .cart-box {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.checkout-block .box .cart-box .cart-title {
    color: var(--yellow);
    font-size: 32px;
    font-weight: 700;
    line-height: 80%;
    text-transform: uppercase;
}

.checkout-block .box .cart-box .cart-list {
    border-radius: 40px;
    background: var(--white);
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 32px 24px;
}

.checkout-block .box .cart-box .cart-list .cart-list-wr {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.checkout-block .box .cart-box .cart-list .cart-item {
    display: grid;
    grid-template-columns: 100px auto;
    gap: 12px;
    position: relative;
}

.checkout-block .box .cart-box .cart-list .cart-item .image {
    border-radius: 20px;
}

.checkout-block .box .cart-box .cart-list .cart-item .image img {
    vertical-align: top;
}

.checkout-block .box .cart-box .cart-list .cart-item .info {
    display: flex;
    flex-direction: column;
}

.checkout-block .box .cart-box .cart-list .cart-item .info .name a {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
    text-decoration: none;
}

.checkout-block .box .cart-box .cart-list .cart-item .info .name a:hover {
    color: var(--yellow);
}

.checkout-block .box .cart-box .cart-list .cart-item .info .name .options {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 12px;
}

.checkout-block .box .cart-box .cart-list .cart-item .info .name .options p {
    font-size: 14px;
    color: var(--light-grey);
}

.checkout-block .box .cart-box .cart-list .cart-item .info .cost {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 16px;
    gap: 8px 0;
}

.checkout-block .box .cart-box .cart-list .cart-item .info .cost .price {
    width: 100%;
    color: var(--light-grey);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
}

.checkout-block .box .cart-box .cart-list .cart-item .product-count input[type="number"], 
.checkout-block .box .cart-box .cart-list .cart-item .product-count input[type="text"] {
    width: 46px;
    font-size: 16px;
}

.checkout-block .box .cart-box .cart-list .cart-item .info .cost .total {
    color: var(--text);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
}

.checkout-block .box .cart-box .cart-list .cart-item .remove {
    position: absolute;
    z-index: 2;
    width: 24px;
    height: 24px;
    top: 0px;
    right: 0px;
}

.checkout-block .box .cart-box .cart-list .cart-item .remove button {
    width: 24px;
    height: 24px;
    border: 0;
    padding: 0;
    cursor: pointer;
    mask: url('../images/close-circle.svg') center center / 23px auto no-repeat;
    background: #E90101;
}

.checkout-block .box .cart-box .total-block-wr {
    border-radius: 40px;
    background: var(--white);
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.checkout-block .box .cart-box .total-block .total-info-wr {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.checkout-block .box .cart-box .total-block .total-info {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.checkout-block .box .cart-box .total-block .total-info:not(last-child) > div {
    font-size: 16px;
    color: var(--light-grey);
}

.checkout-block .box .cart-box .total-block .total-info:last-child > div {
    font-size: 20px;
    color: var(--light-grey);
}

.checkout-block .box .cart-box .total-block .total-info div.cost-num {
    color: var(--text);
    font-weight: 700;
    min-width: 140px;
    text-align: right;
}

.checkout-block .box .cart-box .total-block .codes-block {
    padding-top: 24px;
    border-top: 1px solid var(--grey);
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.checkout-block .box .cart-box .total-block .codes-block .item {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.checkout-block .box .cart-box .total-block .codes-block .item > p {
    color: var(--light-grey);
    font-size: 16px;
    font-weight: 600;
    line-height: 120%;
}

.checkout-block .box .cart-box .total-block .codes-block .item .form-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.checkout-block .box .cart-box .total-block .codes-block .item .form-group button {
    padding: 0 16px;
    font-size: 14px;
    flex-shrink: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.checkout-block .box .cart-box .total-block .codes-block .item .form-group input[type="text"] {
    width: 100%;
    padding: 0 20px;
    border-radius: 16px 0 0 16px;
    border: 1px solid var(--grey);
    background: var(--white);
    height: 50px;
    color: var(--text);
    font-size: 16px;
}

.checkout-block .box .cart-box .checkout-but button {
    width: 100%;
    height: 70px;
    border-radius: 35px;
}

.checkout-block .box .cart-box .total-block .applied-codes {
    padding-top: 24px;
    border-top: 1px solid var(--grey);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.checkout-block .box .cart-box .total-block .applied-codes .item {
    display: flex;
    justify-content: space-between;
    gap: 24px;
}

.checkout-block .box .cart-box .total-block .applied-codes .item p {
    color: var(--light-grey);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.checkout-block .box .cart-box .total-block .applied-codes .item p span {
    color: var(--black);
    font-weight: 600;
}

.checkout-block .box .cart-box .total-block .applied-codes .item .action button {
    background: none;
    padding: 0;
    height: 20px;
    border: 0;
    font-size: 14px;
    color: #f00;
    cursor: pointer;
}

.checkout-block .box .cart-box .total-block .applied-codes .item .action button:hover {
    text-decoration: underline;
}

.additional-address-fields {
    margin-top: 16px;
}

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

/**/

#common-maintenance {
    padding: 240px 0 200px;
}

.categories-widget {
    display: flex;
    flex-direction: column;
    gap: 32px;
    margin-bottom: 40px;
}

.categories-widget-title {
    font-size: 26px;
    font-weight: 600;
    font-family: var(--font-inter);
    line-height: 1.2;
}

.categories-widget-list > ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.categories-widget-list > ul > li > a {
    display: flex;
    align-items: center;
    gap: 8px;
    color: text;
    font-size: 18px;
    font-weight: 400;
    color: var(--text);
    text-decoration: none;
}

.categories-widget-list > ul > li > a:hover {
    color: var(--yellow);
    font-weight: 600;
}

.categories-widget-list > ul > li > a > span.icon {
    width: 40px;
    height: 40px;
    background: var(--yellow);
    border: 5px solid var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.categories-widget-list > ul > li > a > span.icon img {
    width: 100%;
    max-width: 22px;
    height: auto;
}

.categories-widget-list > ul > li > ul {
    padding: 0 0 0 48px;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.categories-widget-list > ul > li > ul a {
    color: var(--text);
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
}

.categories-widget-list > ul > li > ul a:hover {
    color: var(--yellow);
}



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

/**/

.buttons-section {
    padding: 90px 0 60px;
}

.buttons-section .box {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.buttons-section .box a {
    width: 100%;
    height: 80px;
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    background: var(--white);
    border: 1px solid var(--yellow);
    text-decoration: none;
    color: var(--text);
    font-size: 24px;
    text-transform: uppercase;
}

.buttons-section .box a:hover {
    color: var(--white);
    background: var(--yellow);    
}

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

/**/

.form-section {
    padding: 60px 0 120px;
}

.form-section .box {
    position: relative;
    margin-top: 210px;
    display: flex;
    align-items: center;
    gap: 60px;
    justify-content: flex-end;
    padding-right: 124px;
    border-radius: 50px;
    background: var(--yellow);
}

.form-section .box .image {
    position: absolute;
    left: 100px;
    bottom: 0;
}

.form-section .box .image img {
    vertical-align: top;
    max-height: 450px;
}

.form-section .box .text {
    display: flex;
    flex-direction: column;
    gap: 32px;
    max-width: 410px;
    width: 100%;
}

.form-section .box .text .title {
    color: var(--white);
    font-size: 32px;
    font-weight: 300;
    line-height: 120%;
    text-transform: uppercase;
}

.form-section .box .text .title b,
.form-section .box .text .title strong {
    font-weight: 600;
}

.form-section .box .text p {
    color: var(--text);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
}

.form-section .box .form {
    width: 100%;
    max-width: 373px;
    padding: 45px 0;
}

.form-section .box .form form {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-section .box .form form .form-group.but {
    margin-top: 8px;
}

.form-section .box .form form .form-group.message p {
    font-size: 13px;
}

.form-section .box .form form input[type="text"],
.form-section .box .form form input[type="tel"],
.form-section .box .form form input[type="email"] {
    width: 100%;
    padding: 0 32px;
    border-radius: 12px;
    border: 1px solid var(--white);
    background: rgba(255, 255, 255, 0.50);
    color: var(--text);
    font-size: 14px;
    font-weight: 300;
    transition: var(--all-inout);
    height: 42px;
}

.form-section .box .form form input[type="text"].error,
.form-section .box .form form input[type="tel"].error,
.form-section .box .form form input[type="email"].error {
    border-color: red;
}

.form-section .box .form form input[type="submit"] {
    width: 100%;
    cursor: pointer;
    height: 44px;
    border-radius: 25px;
    background: var(--white);
    border: 1px solid var(--white);
    color: var(--text);
    font-size: 16px;
    font-weight: 600;
}

.form-section .box .form form input[type="submit"]:hover {
    background: var(--yellow);
}

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

/**/

.catalog-filter-button {
    margin-top: 40px;
}

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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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

/**/



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