:root {
	--cl-black: #000000;
	--cl-white: #ffffff;
	--cl-gray: #f2f2f2;
	--cl-darker-gray: #dddddd;
	--cl-dark-gray: #787878;
	--cl-green: #e1f80b;
}

/* CONTENT-GRID */

.content-grid {
	--padding-inline: 20px;
	--content-max-width: 1160px;
	--breakout-max-width: 1800px;

	--breakout-size: calc(
		(var(--breakout-max-width) - var(--content-max-width)) / 2
	);

	--content-width: min(
		100% - (var(--padding-inline) * 2),
		var(--content-max-width)
	);

	display: grid;
	grid-template-columns:
		[full-width-start] minmax(var(--padding-inline), 1fr)
		[breakout-start] minmax(0, var(--breakout-size))
		[content-start] var(--content-width) [content-end]
		minmax(0, var(--breakout-size)) [breakout-end]
		minmax(var(--padding-inline), 1fr) [full-width-end];
}

.content-grid > :not(.breakout, .full-width),
.full-width > :not(.breakout, .full-width) {
	grid-column: content;
}

.content-grid > .breakout {
	grid-column: breakout;
}

.content-grid > .full-width {
	grid-column: full-width;

	display: grid;
	grid-template-columns: inherit;
}

img.full-width {
	width: 100%;
	max-height: 45vh;
	object-fit: cover;
}

@media (max-width: 600px) {
	.content-grid {
		--padding-inline: 10px;
	}
}

@media (max-width: 400px) {
	.content-grid {
		--padding-inline: 5px;
	}
}

/* CONTENT-GRID END */

@font-face {
	font-family: "VelaSans";
	src: url("/assets/fonts/VelaSans-GX.ttf");
	font-weight: 400;
	line-height: normal;
}

body {
	font-family: "VelaSans", Arial, sans-serif;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 200 800;
}

ul {
	margin: 0;
	padding: 0;
}

strong {
	/* font-variation-settings: 'wght' 600; */
}

.btn {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 7px 16px;
	border-radius: 1000px;
	text-transform: uppercase;
	font-variation-settings: "wght" 800;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
}

.btn-green {
	background-color: var(--cl-green);
}

@media (max-width: 620px) {
	.btn.btn-green {
		font-size: 12px;
	}
}

.btn-transparent {
	background-color: transparent;
	color: var(--cl-black);
	border: 2px solid var(--cl-black);
}

.btn-black {
	background-color: var(--cl-black);
	color: white;
	position: relative;
	overflow-x: hidden;
	transition: all 0.3s ease;
}

.btn-black:hover {
	background-color: #292929;
}

.btn > img {
	height: 100%;
	max-height: 24px;
}

.btn-black {
	color: var(--cl-white);
	background-color: var(--cl-black);
}

.btn.small-size {
	padding: 11px 20px;
	font-size: 20px;
	gap: 14px;
}

.btn.medium-size {
	font-size: 20px;
	padding: 20px 30px;
	gap: 20px;
}

.btn.large-size {
	font-size: 40px;
	padding: 17px 30px;
	gap: 20px;
}

.btn.small-size > img {
	max-height: 18px;
}

.btn.large-size > img {
	max-height: 35px;
}

@media (max-width: 900px) {
	.btn.large-size {
		font-size: 30px;
		padding: 16px 30px;
		gap: 20px;
	}

	.btn.large-size > img {
		max-height: 26px;
	}
}

@media (max-width: 490px) {
	.btn.medium-size {
		font-size: 18px;
		padding: 15px 20px;
	}

	.btn.hide-arrow > img {
		display: none;
	}

	.btn.large-size {
		font-size: 22px;
		padding: 13px 30px;
		gap: 12px;
	}

	.btn.large-size > img {
		max-height: 18px;
	}
}

@media (max-width: 375px) {
	.btn.medium-size {
		font-size: 16px;
		padding: 15px 20px;
	}
}

.header-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0px 20px;
	height: 73px;
	background-color: var(--cl-gray);
}

.header-wrapper.no-breadcrumbs {
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
}

.header-wrapper .main-logo {
	max-width: 96px;
}

.mobile-menu-btn {
	display: none;
}

.header-menu-desktop {
	display: flex;
	align-items: center;
}

@media (max-width: 1200px) {
	.header-menu-desktop,
	.header-wrapper > .btn-green {
		display: none;
	}

	.mobile-menu-btn {
		display: block;
	}
}

@media (max-width: 600px) {
	.header-wrapper {
		padding: 9px 16px 11px;
		height: 52px;
	}

	.header-wrapper.no-breadcrumbs {
		border-bottom-left-radius: 20px;
		border-bottom-right-radius: 20px;
	}

	.header-wrapper .main-logo {
		max-width: 66px;
	}
}

.header-menu-desktop > .item {
	display: flex;
	position: relative;
	cursor: pointer;
	align-items: center;
	gap: 5px;
	color: var(--cl-black);
	text-decoration: none;
	padding: 13px;
	font-weight: 600;
}

.header-menu-desktop a {
	color: var(--cl-black);
	text-decoration: none;
}

.header-menu-desktop > .item.first-child {
	padding-left: 0;
}

.header-menu-desktop > .item:last-child {
	padding-right: 0;
}

.header-menu-desktop > .line {
	height: 22px;
	width: 1px;
	background-color: var(--cl-black);
}

.header-menu-desktop .submenu-wrapper {
	position: absolute;
	flex-direction: column;
	display: none;
	top: 37px;
	left: 0px;
	background-color: var(--cl-darker-gray);
	padding: 13px;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	z-index: 20;
	width: max-content;
	max-width: 400px;
}

.header-menu-desktop .submenu-wrapper > .item {
	padding: 5px 0px;
	color: var(--cl-black);
	text-decoration: none;
	font-weight: 300;
}

.header-menu-desktop .submenu-wrapper > .item:hover {
	text-decoration: underline;
}

.header-menu-desktop .submenu-wrapper > .item:first-child {
	padding-top: 0px;
}

.header-menu-desktop .submenu-wrapper > .item:last-child {
	padding-bottom: 0px;
}

.header-menu-desktop .parent:hover {
	background-color: var(--cl-darker-gray);
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
}

.header-menu-desktop .parent:hover > img {
	transform: rotate(180deg);
}

.header-menu-desktop .parent:hover .submenu-wrapper {
	display: flex;
}

.breadcrumbs-wrapper {
	display: flex;
	gap: 8px;
	justify-content: center;
	align-items: center;
	background-color: var(--cl-gray);
	padding: 20px;
	margin-top: 3px;
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
}

.breadcrumbs-wrapper > img {
	transform: rotate(-90deg);
}

.breadcrumbs-wrapper .item {
	font-weight: 600;
	text-decoration: none;
	color: var(--cl-black);
}

.breadcrumbs-wrapper a.item {
	cursor: pointer;
	opacity: 0.5;
}

@media (max-width: 620px) {
	.breadcrumbs-wrapper {
		background-color: var(--cl-white);
		flex-wrap: wrap;
		justify-content: flex-start;
		padding: 15px 2px 5px;
		font-size: 12px;
		gap: 6px;
	}
}

.success-modal {
	display: flex;
	flex-direction: column;
	padding: 66px 138px;
	text-align: center;
}
.success-modal__img {
	width: 68px;
	height: 68px;
	margin: 0 auto;
}

.success-modal__title {
	margin-top: 8px;
	margin-bottom: 12px;
}

.footer-wrapper {
	display: grid;
	grid-template-columns: repeat(4, auto);
	gap: 20px;
	background-color: var(--cl-black);
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	padding: 40px 55px;
	line-height: 1.4;
	margin-top: 12px;
}

@media (max-width: 620px) {
	.footer-wrapper {
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
	}
}

.footer-wrapper .main-logo {
	margin-bottom: 32px;
}

.footer-wrapper .btn {
	width: max-content;
}

.footer-wrapper .btn.mobile {
	width: max-content;
	margin-top: 15px;
}

.footer-item {
	display: flex;
	gap: 4px;
	color: white;
	cursor: pointer;
	text-decoration: none;
	margin-top: 6px;
}

.footer-section-title {
	color: white;
	opacity: 0.5;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 25px;
}

.footer-icons-wrapper {
	display: flex;
	gap: 9px;
	margin-top: 12px;
}

.footer-icons-wrapper img {
	width: 32px;
	height: 32px;
}

.footer-section .flex-wrapper {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

@media (max-width: 1030px) {
	.footer-wrapper {
		grid-template-columns: auto auto;
		row-gap: 50px;
	}
}

@media (max-width: 680px) {
	.footer-wrapper {
		padding: 25px 33px;
	}
	.footer-section-title {
		font-size: 20px;
	}

	.footer-item {
		font-size: 16px;
	}
}

.footer-wrapper .mobile {
	display: none;
}

.footer-wrapper .requisites.mobile {
	opacity: 0.5;
	margin-top: 34px;
}

@media (max-width: 500px) {
	.footer-wrapper {
		grid-template-columns: auto;
		row-gap: 25px;
	}

	.footer-wrapper .main-logo {
		margin-bottom: 0px;
	}

	.footer-wrapper .desktop {
		display: none;
	}

	.footer-wrapper .mobile {
		display: flex;
	}
}

.content-section {
	background-color: var(--cl-gray);
	border-radius: 30px;
	padding: 25px;
	margin: 20px 0;
}

.section-title {
	font-size: 80px;
	text-transform: uppercase;
	line-height: 1.1;
	margin-bottom: 18px;
	font-variation-settings: "wght" 500;
}

@media (max-width: 620px) {
	.content-section {
		padding: 0px;
		background-color: var(--cl-white);
	}

	.section-title {
		font-size: 40px;
	}
}

@media (max-width: 382px) {
	.section-title {
		font-size: 34px;
	}
}

.main-banner-section {
	display: grid;
	grid-template-columns: repeat(3, 1fr) 415px;
	grid-template-rows: 132px;
	grid-template-areas:
		"pl-logo  pl-logo  pl-logo  banner"
		"desc    desc    desc        banner"
		"benefit benefit benefit banner"
		"cards   cards   cards   banner";
}

.main-banner-section .pl-logo {
	grid-area: pl-logo;
	background-color: var(--cl-white);
	padding: 32px 32px 0px;
	border-top-left-radius: 27px;
	border-top-right-radius: 27px;
}

.main-banner-section .pl-logo img {
	width: 100%;
}

.main-banner-section .p-logo {
	display: none;
	grid-area: p-logo;
	background-color: var(--cl-white);
	padding-top: 30px;
	padding-left: 32px;
	padding-right: 20px;
	border-top-left-radius: 27px;
	height: 132px;
}

.main-banner-section .p-logo > img {
	/* width: 100%; */
}

.main-banner-section .l-logo {
	display: none;
	grid-area: l-logo;
	background-color: var(--cl-white);
	padding-top: 32px;
	padding-right: 32px;
	border-top-right-radius: 27px;
	height: 132px;
}

.main-banner-section .l-logo > img {
	/* width: 100%; */
}

.main-banner-section .banner {
	grid-area: banner;
	padding-left: 15px;
}

.main-banner-section .banner .img {
	background-image: url("/assets/img/three-generations-of.jpg");
	background-position: 41.671% 0%;
	background-size: 256.2%;
	background-repeat: no-repeat;
	border-radius: 30px;
	width: 100%;
	height: 100%;
}

.main-banner-section .desc {
	position: relative;
	grid-area: desc;
	background-color: var(--cl-white);
	padding: 22px 32px;
	font-size: 19px;
	width: 100%;
}

@media (max-width: 700px) {
	.main-banner-section .desc {
		padding-bottom: 0;
	}
}

.main-banner-section .desc .text {
	background-color: var(--cl-green);
	padding: 5px 15px;
	border-radius: 90px;
	font-size: 18px;
	max-width: 492px;
	width: fit-content;
}

.main-banner-section .desc .arrow {
	display: none;
}

.main-banner-section .cards {
	grid-area: cards;
	display: grid;
	grid-template-columns: 1fr;
	gap: 5px;
	background-color: var(--cl-white);
	padding: 22px 32px 32px;
	border-bottom-left-radius: 27px;
	border-bottom-right-radius: 27px;
}

.main-banner-section .card {
	position: relative;
	font-size: 15px;
	padding: 13px 49px 13px 13px;
	border-radius: 18px;
	background-color: var(--cl-gray);
	line-height: 1.4;
}

.main-banner-section .card .card-title {
	text-transform: uppercase;
	font-variation-settings: "wght" 700;
	font-size: 16px;
	margin-bottom: 4px;
}

.main-banner-section .card .number {
	position: absolute;
	opacity: 0.5;
	font-size: 14px;
	bottom: 13px;
	right: 19px;
}

.main-banner-section .card.green {
	background-color: var(--cl-green);
}

.main-banner-section .benefit {
	grid-area: benefit;
}

.main-banner-section .benefit-wrapper {
	background-color: var(--cl-white);
	padding: 0px 32px;
	height: 100%;
}

@media (max-width: 1020px) {
	.main-banner-section .benefit-wrapper {
		padding: 32px;
	}
}

.benefit-title {
	text-transform: uppercase;
	font-variation-settings: "wght" 700;
	font-size: 25px;
	margin-bottom: 12px;
}

.benefit-item {
	display: flex;
	gap: 7px;
	font-size: 18px;
	margin-bottom: 6px;
}

.benefit-item > img {
	width: 13px;
}

.benefit-text {
	/* font-weight: 00; */
	font-variation-settings: "wght" 700;
	margin-top: 20px;
	font-size: 15px;
}

@media (max-width: 1160px) {
	.main-banner-section {
		grid-template-rows: auto;
	}

	.main-banner-section .cards {
		grid-template-columns: 1fr;
	}

	.main-banner-section .card {
		padding: 53px 34px 22px 22px;
	}

	.main-banner-section .card .number {
		bottom: auto;
		right: auto;
		top: 18px;
		left: 22px;
	}

	.main-banner-section .banner .img {
		background-size: 298%;
	}
}

@media (max-width: 1020px) {
	.main-banner-section {
		grid-template-columns: 55% 45%;
		grid-template-areas:
			"pl-logo banner"
			"desc    banner"
			"cards   banner"
			"cards   benefit";
	}

	.main-banner-section .banner {
		padding-bottom: 15px;
	}

	.main-banner-section .banner .img {
		background-size: 65vw;
		background-position: 41.671% 37%;
	}

	.main-banner-section .benefit {
		padding-left: 15px;
	}

	.main-banner-section .benefit-wrapper {
		border-radius: 27px;
	}

	.main-banner-section .cards {
		padding-bottom: 25px;
		border-bottom-left-radius: 27px;
		border-bottom-right-radius: 27px;
	}
}

@media (max-width: 900px) {
	.main-banner-section .banner .img {
		background-size: 82vw;
	}
}

@media (max-width: 750px) {
	.main-banner-section {
		grid-template-columns: 50% 50%;
	}

	.main-banner-section .banner .img {
		background-size: 110vw;
	}
}

@media (max-width: 700px) {
	.main-banner-section {
		grid-template-columns: 1fr auto;
		grid-template-areas:
			"pl-logo  pl-logo"
			"desc    desc"
			"benefit benefit"
			"banner  banner"
			"cards   cards";
	}

	.main-banner-section .banner .img {
		background-size: 155%;
	}

	.main-banner-section .banner {
		background-color: var(--cl-white);
		padding: 0px 27px 15px;
		height: 250px;
	}

	.main-banner-section .desc {
		padding-top: 24px;
		padding-right: 0px;
	}

	.main-banner-section .desc .arrow {
		display: block;
		position: absolute;
		top: 15px;
		right: 20px;
		width: 55px;
		transform: rotate(180deg);
	}

	.main-banner-section .benefit {
		padding-left: 0px;
	}

	.main-banner-section .benefit-wrapper {
		border-radius: 0px;
	}
}

@media (max-width: 620px) {
	.main-banner-section .p-logo,
	.main-banner-section .l-logo,
	.main-banner-section .desc,
	.main-banner-section .benefit {
		padding-left: 12px;
		padding-right: 12px;
		height: auto;
	}

	.main-banner-section .pl-logo {
		padding: 10px 12px 0;
	}

	.main-banner-section .benefit {
		padding: 0 12px;
	}

	.main-banner-section .banner {
		padding: 0;
	}

	.main-banner-section .benefit-wrapper {
		padding: 18px 0 20px;

	}

	.main-banner-section .cards {
		padding-right: 0px;
		padding-left: 0px;
		padding-bottom: 0px;
	}

	.main-banner-section .card {
		padding: 14px 43px 14px 14px;
	}

	.main-banner-section .card .number {
		top: auto;
		left: auto;
		right: 13px;
		bottom: 14px;
	}
}

@media (max-width: 500px) {
	.main-banner-section {
		/* grid-template-columns: 1fr;
        grid-template-areas: 
            'p-logo'
            'l-logo'
            'desc  '
            'banner'
            'cards  '
            'benefit'; */
	}

	.main-banner-section .banner {
		/* padding-right: 0px; */
	}

	.main-banner-section .banner .img {
		background-size: 175%;
		/* height: 140vw; */
	}

	.main-banner-section .desc .text {
		max-width: none;
		font-size: 4.8vw;
	}
}

@media (max-width: 448px) {
	.main-banner-section .p-logo,
	.main-banner-section .l-logo,
	.main-banner-section .banner {
		padding: 0;
	}

	.main-banner-section .p-logo img {
		height: 22.1vw;
	}

	.main-banner-section .l-logo img {
		height: 21.21vw;
	}
}

@media (max-width: 420px) {
	.main-banner-section .desc {
		font-size: 17px;
	}

	.main-banner-section .card,
	.main-banner-section .benefit-item {
		font-size: 14px;
	}
}

@media (max-width: 380px) {
	.main-banner-section .desc {
		padding-top: 20px;
	}

	.main-banner-section .desc .arrow {
		width: 40px;
		top: 14px;
		right: 10px;
	}
}

.how-we-work-section .cards {
	display: grid;
	grid-template-columns: repeat(46, 1fr);
	margin-bottom: 25px;
	gap: 8px;
}

.how-we-work-section .card {
	position: relative;
	padding: 24px 22px;
	padding-right: 35px;
	background-color: var(--cl-white);
	border-radius: 17px;
	font-size: 18px;
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 10px;
}

.how-we-work-section .card .title {
	font-size: 25px;
	text-transform: uppercase;
	font-variation-settings: "wght" 700;
	max-width: calc(100% - 40px);
}

.how-we-work-section .card .text {
	display: flex;
	gap: 30px;
}

.how-we-work-section .card.green {
	background-color: var(--cl-green);
}

.how-we-work-section .number {
	position: absolute;
	right: 22px;
	top: 24px;
	font-size: 25px;
	opacity: 0.5;
}

.how-we-work-section .card.img {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.how-we-work-section .card1 {
	grid-column: 1 / 18;
}

.how-we-work-section .card2 {
	grid-column: 18 / 36;
}

.how-we-work-section .img1 {
	grid-column: 36 / 49;
	background-image: url("/assets/img/how-we-work1.jpg");
}

.how-we-work-section .card3 {
	grid-column: 1 / 22;
}

.how-we-work-section .card4 {
	grid-column: 22 / 49;
}

.how-we-work-section .img2 {
	grid-column: 1 / 19;
	background-image: url("/assets/img/how-we-work2.jpg");
}

.how-we-work-section .img3 {
	display: none;
	background-image: url("/assets/img/how-we-work2.jpg");
}

.how-we-work-section .card5 {
	grid-column: 19 / 49;
	padding-right: 75px;
}

.how-we-work-section .card5 .text div {
	width: 50%;
}

.how-we-work-section .card6 {
	grid-column: 35 / 49;
}

.how-we-work-section .card7 {
	grid-column: 8 / 22;
}

.how-we-work-section .card8 {
	grid-column: 22 / 33;
}

.how-we-work-section .card9 {
	grid-column: 33 / 49;
}

@media (max-width: 1050px) {
	.how-we-work-section .card {
		font-size: 16px;
	}
}

@media (max-width: 960px) {
	.how-we-work-section .cards {
		grid-template-columns: 1fr 1fr;
	}

	.how-we-work-section .card.img {
		display: none;
	}

	.how-we-work-section .card {
		padding-right: 30px;
	}

	.how-we-work-section .card .text {
		flex-direction: column;
		gap: 10px;
	}

	.how-we-work-section .card .text div {
		width: 100%;
	}

	.how-we-work-section .card1 {
		grid-column: auto;
	}

	.how-we-work-section .card2 {
		grid-column: auto;
	}

	.how-we-work-section .card3 {
		grid-column: auto;
	}

	.how-we-work-section .card4 {
		grid-column: auto;
	}

	.how-we-work-section .card5 {
		grid-column: auto;
		padding-right: 30px;
		background-color: var(--cl-green);
	}

	.how-we-work-section .card.img3 {
		display: block;
	}

	.how-we-work-section .card6 {
		grid-column: 32 / 49;
	}

	.how-we-work-section .card7 {
		grid-column: 1 / 14;
	}

	.how-we-work-section .card8 {
		grid-column: 14 / 28;
	}

	.how-we-work-section .card9 {
		grid-column: 28 / 49;
	}
}

@media (max-width: 845px) {
	.how-we-work-section .section-title {
		font-size: 9lvw;
	}
}

@media (max-width: 700px) {
	.how-we-work-section {
		background-color: white;
		padding: 0;
		margin-top: 40px;
		margin-bottom: 40px;
	}

	.how-we-work-section .section-title {
		font-size: 9.8lvw;
	}

	.how-we-work-section .cards {
		grid-template-columns: 1fr;
	}

	.how-we-work-section .card {
	}

	.how-we-work-section .card,
	.how-we-work-section .card.green {
		grid-column: auto;
		background: var(--cl-gray);
		padding: 15px 25px 15px 20px;
	}

	.how-we-work-section .card.green {
	}

	.how-we-work-section .card .number {
		right: 20px;
		top: 15px;
		font-size: 18px;
	}

	.how-we-work-section .card > * {
		border-radius: 10px;
	}

	.how-we-work-section .cards > div:nth-of-type(even) {
		background: var(--cl-green);
	}

	.how-we-work-section .card .number {
		display: flex;
		align-items: center;
	}

	.how-we-work-section .card .text {
		width: 100%;
	}

	.how-we-work-section .card .title {
		font-size: 18px;
	}

	.how-we-work-section .card.img3 {
		display: none;
	}
}

@media (max-width: 620px) {
	.how-we-work-section .cards > div:nth-of-type(odd) > * {
		background-color: var(--cl-gray);
	}

	.how-we-work-section .card {
		font-size: 14px;
	}

	.how-we-work-section .card .number {
		font-size: 18px;
	}
}

@media (max-width: 406px) {
	.how-we-work-section .section-title {
		font-size: 10lvw;
	}
}

.service-item {
	display: grid;
	margin-top: 40px;
	grid-template-columns: 68% 32%;
	grid-template-areas:
		"title   img"
		"content img"
		"btn     img";
	gap: 9px;
}

.service-item.left-img {
	grid-template-columns: 32% 68%;
	grid-template-areas:
		"img title"
		"img content"
		"img btn";
}

.service-item:nth-child(2) {
	margin-top: 0;
}

.service-item .title {
	grid-area: title;
	text-transform: uppercase;
	font-size: 25px;
	font-variation-settings: "wght" 700;
	background-color: var(--cl-green);
	padding: 23px 28px;
	border-radius: 20px;
}

.service-item .title > span {
	color: var(--cl-dark-gray);
}

.service-item .img {
	grid-area: img;
	border-radius: 20px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.service-item .img1 {
	background-image: url("/assets/img/megan-ruth.jpg");
}

.service-item .img2 {
	background-image: url("/assets/img/pills.jpg");
}

.service-item .img3 {
	background-image: url("/assets/img/girls.jpg");
}

.service-item .content {
	grid-area: content;
	background-color: var(--cl-white);
	border-radius: 20px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 23px 28px;
	font-size: 18px;
}

.service-item .btn {
	grid-area: btn;
}

.service-item .lists-wrapper {
	display: grid;
	grid-template-columns: 1fr;
	column-gap: 35px;
	row-gap: 7px;
}

@media (max-width: 600px) {
	.service-item .lists-wrapper {
		grid-template-columns: 1fr;
	}
}

/* .service-item .list {
    display: flex;
    flex-direction: column;
    gap: 7px;
} */

.service-item .list-item {
	display: flex;
	align-items: center;
	gap: 5px;
	color: var(--cl-black);
	text-decoration: none;
	/* align-items: start; */
}

.service-item .list-item > img {
	width: 20px;
	/* align-self: start; */
}

@media (max-width: 950px) {
	.service-item .content {
		font-size: 16px;
	}
}

@media (max-width: 860px) {
	.service-item,
	.service-item.left-img {
		grid-template-columns: 1fr 81px;
		grid-template-areas:
			"title   img"
			"content content"
			"btn     btn";
	}
}

@media (max-width: 620px) {
	.service-item {
		margin-top: 30px;
	}

	.service-item,
	.service-item.left-img {
		grid-template-columns: 1fr 76px;
	}

	.service-item .title {
		font-size: 20px;
		padding: 10px 16px;
		height: 76px;
		display: flex;
		align-items: center;
	}

	.service-item .title,
	.service-item .img,
	.service-item .content {
		border-radius: 10px;
	}

	.service-item .lists-wrapper {
		flex-direction: column;
		gap: 0px;
		row-gap: 10px;
	}

	.service-item .content {
		background-color: var(--cl-gray);
		font-size: 14px;
		padding: 14px 16px;
	}
}

@media (max-width: 340px) {
	.service-item .title {
		font-size: 18px;
	}
}

.specialist-slide {
	display: grid;
	grid-template-columns: 40% 60%;
	grid-template-areas:
		"title title"
		"name  name"
		"img   desc";
	gap: 8px;
}

.specialist-slide .section-title {
	grid-area: title;
	margin-bottom: 4px;
}

.specialist-slide .name-block {
	grid-area: name;
	display: flex;
	gap: 35px;
	width: 100%;
	background-color: var(--cl-green);
	justify-content: center;
	align-items: center;
	border-radius: 20px;
	padding: 20px;
}

.specialist-slide .name-wrapper {
	text-align: center;
	min-width: 488px;
}

.specialist-slide .name {
	text-transform: uppercase;
	font-size: 25px;
	font-variation-settings: "wght" 700;
}

.specialist-slide .arrow {
	height: 40px;
	cursor: pointer;
}

.specialist-slide .arrow.right {
	transform: rotate(180deg);
}

.specialist-slide .img {
	grid-area: img;
	border-radius: 20px;
	width: 100%;
	object-fit: cover;
}

.specialist-slide .desc {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	grid-area: desc;
	border-radius: 20px;
	background-color: var(--cl-white);
	padding: 30px 25px;
}

.specialist-slide .desc *:first-child {
	margin-top: 0px;
}

.specialist-slide .desc *:last-child {
	margin-bottom: 0px;
}

.specialist-slide .desc li {
	display: flex;
	list-style-type: none;
	padding-left: 0px;
	gap: 7px;
	margin: 7px 0px 10px;
}

.specialist-slide .desc li::before {
	content: " ";
	width: 20px;
	height: 20px;
	background-image: url("/assets/img/icons/leaf.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	flex-shrink: 0;
}

.specialist-slide .slider-btns-wrapper {
	grid-area: btns;
	display: none;
	gap: 10px;
	width: 100%;
	justify-content: center;
	margin-bottom: 10px;
}

@media (max-width: 800px) {
	.specialist-slide .arrow.desktop {
		display: none;
	}

	.specialist-slide .slider-btns-wrapper {
		display: flex;
	}
}

@media (max-width: 750px) {
	.specialist-slide {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"btns"
			"name"
			"img"
			"desc";
	}
}

@media (max-width: 620px) {
	.specialist-slide .name-block {
		padding: 15px 20px;
	}

	.specialist-slide .name-wrapper {
		min-width: auto;
	}

	.specialist-slide .name-wrapper .text {
		font-size: 14px;
	}

	.specialist-slide .name {
		font-size: 20px;
		margin-bottom: 2px;
	}

	.specialist-slide .desc {
		font-size: 16px;
		background-color: var(--cl-gray);
		padding: 20px;
	}
}

.reviews-section {
	margin-bottom: 0;
}

.reviews-section .section-title {
	margin-bottom: 0;
}

.reviews-widget {
	margin-bottom: 50px;
}

.partners-section .section-title {
	margin-bottom: 0px;
}

@media (max-width: 620px) {
	.partners-section .section-title {
		margin-bottom: 20px;
	}
}

.partners-section > .wrapper {
	display: flex;
	gap: 15px;
}

.partners-section .content {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.partners-section .img {
	border-radius: 20px;
	width: 100%;
	max-width: 420px;
	object-fit: cover;
	flex-shrink: 1;
}

.partners-section .subtitle {
	font-size: 25px;
	background-color: var(--cl-green);
	border-radius: 20px;
	font-variation-settings: "wght" 700;
	padding: 25px;
	text-transform: uppercase;
}

.partners-section .block {
	background-color: var(--cl-white);
	padding: 25px;
	border-radius: 20px;
}

.partners-section .partners {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 30px;
}

.partners-section .partners > img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	max-width: 153px;
	max-height: 59px;
}

.partners-section .block > .wrapper {
	display: flex;
	gap: 35px;
}

.partners-section .block .lab-img {
	max-width: 240px;
	object-fit: contain;
	height: fit-content;
}

.partners-section .text.small {
	font-size: 14px;
}

.partners-section .promo {
	width: 100%;
	max-width: 196px;
	background-color: var(--cl-green);
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 5px 15px;
	border-radius: 90px;
	margin-top: 20px;
}

.partners-section .promo > span {
	font-variation-settings: "wght" 700;
}

@media (max-width: 1100px) {
	.partners-section .content {
		width: 100%;
	}

	.partners-section .img {
		display: none;
	}
}

@media (max-width: 620px) {
	.partners-section .block {
		background-color: var(--cl-gray);
	}
}

@media (max-width: 520px) {
	.partners-section .subtitle {
		font-size: 20px;
		padding: 20px;
	}

	.partners-section .block > .wrapper {
		flex-direction: column;
		gap: 20px;
	}

	.partners-section .partners {
		gap: 5px;
	}

	.partners-section .partners > img {
		width: 26vw;
	}
}

.cta-section {
	display: flex;
	gap: 8px;
	margin: 20px 0px 40px;
}

.cta-section .title-block {
	border-radius: 30px;
	background-color: var(--cl-green);
	text-transform: uppercase;
	padding: 25px;
	max-width: 514px;
}

.cta-section .title {
	font-size: 53px;
	font-variation-settings: "wght" 700;
	line-height: 1.1;
	margin-bottom: 50px;
}

.cta-section .subtitle {
	margin-top: 15px;
	font-size: 23px;
	max-width: 330px;
}

.cta-section .text {
	font-size: 23px;
	font-variation-settings: "wght" 700;
	opacity: 0.5;
}

.cta-section form {
	background-color: var(--cl-gray);
	border-radius: 30px;
	padding: 35px 25px;
}

.cta-section .btn {
	margin-top: 20px;
}

@media (max-width: 900px) {
	.cta-section {
		flex-direction: column;
	}

	.cta-section .title-block {
		max-width: none;
	}
}

@media (max-width: 450px) {
	.cta-section .title {
		font-size: 30px;
		margin-bottom: 30px;
	}

	.cta-section .text {
		font-size: 18px;
	}
}

.seo-text-section {
	display: flex;
	flex-direction: column;
	gap: 22px;
	margin-bottom: 40px;
}

.seo-text-section .item > * {
	padding: 25px 30px;
	border-radius: 20px;
}

.seo-text-section .title {
	font-size: 25px;
	text-transform: uppercase;
	background-color: var(--cl-green);
	margin-bottom: 10px;
	font-variation-settings: "wght" 700;
}

.seo-text-section .text {
	background-color: var(--cl-gray);
	font-size: 18px;
}

@media (max-width: 620px) {
	.seo-text-section .item > * {
		padding: 15px 20px;
		border-radius: 10px;
	}

	.seo-text-section .title {
		font-size: 20px;
	}

	.seo-text-section .text {
		font-size: 16px;
	}
}

.faq-section {
	margin-top: 70px;
	margin-bottom: 90px;
}

.faq-section .section-title {
	font-size: 42px;
	width: 100%;
	text-align: center;
	font-variation-settings: "wght" 700;
	margin-bottom: 50px;
	text-transform: none;
}

.faq-section .item {
	padding: 20px 0;
	border-bottom: 1px solid var(--cl-green);
}

.faq-section .item:first-child {
	border-top: 1px solid var(--cl-green);
}

.faq-section .question {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 22px;
	font-variation-settings: "wght" 700;
	cursor: pointer;
}

.faq-section .question > img {
	background-color: var(--cl-green);
	padding: 8px;
	border-radius: 90px;
	transition-duration: 300ms;
	transform: rotate(0deg);
}

.faq-section .question > img.active {
	transform: rotate(45deg);
}

.faq-section .question:hover > img {
	background-color: var(--cl-gray);
}

.faq-section .answer {
	max-width: 1100px;
}

.faq-section .answer a {
	color: var(--cl-black);
}

.faq-section .answer > .spacer {
	height: 20px;
}

.faq-section .answer p:first-child {
	margin-top: 0px;
}

.faq-section .answer p:last-child {
	margin-bottom: 0px;
}

.js-dropdown-item .js-dropdown-content {
	transition-duration: 300ms;
	overflow: hidden;
	max-height: 0px;
}

.programs-head-section {
	display: flex;
	gap: 25px;
}

.programs-head-section .section-title {
	line-height: 1.1;
	font-weight: 500;
	margin-bottom: 0px;
}

.programs-head-section .content {
	display: grid;
	gap: 30px;
	grid-template-columns: 1fr;
	border-radius: 27px;
	background-color: var(--cl-white);
	padding: 30px 25px;
}

.programs-head-section > img {
	border-radius: 27px;
	max-width: 387px;
	width: 100%;
	object-fit: cover;
}

.programs-head-section .text {
	font-size: 18px;
	max-width: 560px;
	padding: 6px 12px;
	border-left: 8px solid var(--cl-green);
	height: fit-content;
}

.programs-head-section .categories {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.programs-head-section .categories > .item {
	display: flex;
	align-items: center;
	padding: 10px 25px;
	border-radius: 90px;
	background-color: var(--cl-green);
	line-height: normal;
	font-size: 18px;
}

.programs-head-section .categories > a.item {
	text-decoration: none;
	color: var(--cl-white);
	background-color: var(--cl-black);
}

.programs-head-section .mobile {
	display: none;
}

@media (max-width: 1000px) {
	.programs-head-section > img {
		display: none;
	}
}

@media (max-width: 820px) {
	.programs-head-section .section-title {
		font-size: 50px;
	}
}

@media (max-width: 620px) {
	.programs-head-section .section-title {
		font-size: 40px;
	}

	.programs-head-section .content {
		padding: 0px;
		gap: 17px;
	}

	.programs-head-section .text {
		display: flex;
		gap: 10px;
		font-size: 14px;
		padding: 0px;
		border: none;
		padding-right: 5px;
	}

	.programs-head-section .text > img {
		width: 36%;
		flex-shrink: 0;
		max-height: 100px;
		border-radius: 10px;
		object-fit: cover;
	}

	.programs-head-section .categories .item {
		font-size: 14px;
		padding: 8px 15px;
	}

	.programs-head-section .categories {
		gap: 7px;
	}

	.programs-head-section .mobile {
		display: block;
	}
}

@media (max-width: 345px) {
	.programs-head-section .section-title {
		font-size: 30px;
	}
}

.program-item {
	display: grid;
	grid-template-columns: 40% 60%;
	grid-template-rows: auto 1fr auto;
	grid-template-areas:
		"img title"
		"img text"
		"img btn";
	gap: 10px;
}

.program-item > img {
	grid-area: img;
	border-radius: 20px;
	object-fit: cover;
	width: 100%;
}

.program-item .title {
	grid-area: title;
	border-radius: 20px;
	background-color: var(--cl-green);
	text-transform: uppercase;
	font-size: 25px;
	font-variation-settings: "wght" 700;
	padding: 30px;
}

.program-item .text {
	grid-area: text;
	border-radius: 20px;
	background-color: var(--cl-white);
	font-size: 18px;
	display: flex;
	flex-direction: column;
	gap: 25px;
	padding: 30px;
}

.program-item .text .price {
	font-variation-settings: "wght" 700;
}

.program-item .btn {
	grid-area: btn;
}

@media (max-width: 700px) {
	.program-item {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"img"
			"text"
			"btn";
	}

	.program-item > img {
		max-height: 350px;
	}
}

@media (max-width: 620px) {
	.program-item {
		margin-bottom: 60px;
	}

	.program-item .title {
		padding: 20px;
		font-size: 20px;
		border-radius: 10px;
	}

	.program-item .text {
		padding: 20px;
		font-size: 14px;
		border-radius: 10px;
		background-color: var(--cl-gray);
	}

	.program-item > img {
		border-radius: 10px;
		max-height: 280px;
	}
}

.program-top-section {
	display: grid;
	grid-template-columns: 65% 1fr;
	grid-template-areas:
		"content img"
		"btn     img";
	gap: 15px;
}

.program-top-section .content {
	grid-area: content;
	border-radius: 20px;
	background-color: var(--cl-white);
	padding: 30px;
}

.program-top-section > img {
	grid-area: img;
	border-radius: 20px;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.program-top-section .btn {
	grid-area: btn;
}

.program-top-section .section-title {
	line-height: 1.1;
	font-size: 50px;
}

.program-top-section .content .wrapper {
	display: flex;
	gap: 8px;
}

.program-top-section .price {
	display: flex;
	align-items: end;
	font-size: 25px;
	background-color: var(--cl-gray);
	border-radius: 17px;
	min-width: 155px;
	padding: 20px;
}

.program-top-section .blocks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.program-top-section .blocks .item {
	border-radius: 17px;
	background-color: var(--cl-gray);
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 20px;
	font-size: 14px;
	justify-content: space-between;
}

.program-top-section .blocks .price {
	justify-content: end;
}

.program-top-section .blocks .number {
	font-size: 25px;
	align-self: end;
	opacity: 0.5;
}

.program-top-section .blocks .item:first-child,
.program-top-section .blocks .item:nth-child(4) {
	background-color: var(--cl-green);
}

.program-top-section .mobile {
	display: none;
}

.program-top-section .content > img {
	border-radius: 17px;
	max-height: 400px;
	object-fit: cover;
	width: 100%;
	margin: 15px 0;
}

@media (max-width: 1100px) {
	.program-top-section {
		grid-template-columns: 1fr;
		grid-template-areas:
			"content"
			"img"
			"btn";
	}

	.program-top-section .mobile {
		display: block;
	}

	.program-top-section .desktop {
		display: none;
	}
}

@media (max-width: 700px) {
	.program-top-section .wrapper {
		flex-direction: column;
	}

	.program-top-section .price {
		justify-content: end;
	}
}

@media (max-width: 620px) {
	.program-top-section .content {
		padding: 0;
	}
}

@media (max-width: 480px) {
	.program-top-section .blocks {
		grid-template-columns: 1fr;
	}

	.program-top-section .section-title {
		font-size: 38px;
	}

	.program-top-section .blocks .item {
		flex-direction: column-reverse;
		gap: 10px;
	}

	.program-top-section .blocks .item .number {
		align-self: flex-start;
		font-size: 22px;
	}

	.program-top-section .content > img {
		max-height: 60vw;
	}
}

.program-advantages .blocks {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}

.program-advantages .item {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 10px;
	background-color: var(--cl-white);
	border-radius: 20px;
	padding: 25px;
}

.program-advantages .item:nth-child(even) {
	background-color: var(--cl-green);
}

.program-advantages .blocks .number {
	font-size: 25px;
	align-self: end;
	opacity: 0.5;
}

@media (max-width: 900px) {
	.program-advantages .blocks {
		grid-template-columns: repeat(2, 1fr);
	}

	.program-advantages .blocks .item:nth-child(even) {
		background-color: var(--cl-white);
	}

	.program-advantages .blocks .item:nth-child(3n + 1) {
		background-color: var(--cl-green);
	}
}

@media (max-width: 620px) {
	.program-advantages {
		margin-top: 40px;
	}

	.program-advantages .blocks {
		grid-template-columns: 1fr;
	}

	.program-advantages .blocks .item {
		background-color: var(--cl-gray);
	}

	.program-advantages .blocks .item:nth-child(3n + 1) {
		background-color: var(--cl-gray);
	}

	.program-advantages .blocks .item:nth-child(even) {
		background-color: var(--cl-green);
	}

	.program-advantages .blocks .item {
		flex-direction: column-reverse;
		font-size: 14px;
		gap: 5px;
		padding: 20px;
	}

	.program-advantages .blocks .item .number {
		align-self: flex-start;
		font-size: 22px;
	}
}

.program-steps .wrapper {
	display: flex;
	gap: 20px;
}

.program-steps .wrapper > img {
	object-fit: cover;
	width: 35%;
	border-radius: 20px;
	flex-shrink: 0;
}

.program-steps .blocks {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 20px;
}

.program-steps .blocks .item {
	padding: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
	font-size: 18px;
	border-radius: 20px;
	background-color: var(--cl-white);
}

.program-steps .blocks .item .number {
	font-size: 25px;
	opacity: 0.5;
}

.program-steps .blocks .item:nth-child(even) {
	background-color: var(--cl-green);
}

.program-steps .blocks .item:last-child {
	background-color: var(--cl-white);
	opacity: 0.6;
}

.program-steps .blocks .item:last-child .number {
	display: none;
}

@media (max-width: 1000px) {
	.program-steps .blocks .item {
		font-size: 16px;
	}
}

@media (max-width: 800px) {
	.program-steps .wrapper {
		flex-direction: column-reverse;
	}

	.program-steps .wrapper > img {
		width: 100%;
		max-height: 50vw;
	}
}

@media (max-width: 620px) {
	.program-steps .blocks .item {
		background-color: var(--cl-gray);
		padding: 20px;
		font-size: 14px;
		gap: 20px;
	}

	.program-steps .blocks .item:last-child {
		padding-top: 10px;
		padding-bottom: 10px;
	}
}

.program-text {
	margin: 50px 0px;
}

.program-text > div,
.program-text > p,
.program-text > ul {
	padding: 25px;
	background-color: var(--cl-gray);
	margin: 8px 0px;
	border-radius: 20px;
}

.program-text > h1,
.program-text > h2,
.program-text > h3,
.program-text > h4,
.program-text > h5,
.program-text > h6,
.program-text > h7,
.program-text > h8 {
	padding: 25px;
	background-color: var(--cl-green);
	margin: 8px 0px;
	border-radius: 20px;
	text-transform: uppercase;
}

.program-text li {
	margin-left: 20px;
	margin-bottom: 5px;
}

@media (max-width: 620px) {
	.program-text > div,
	.program-text > p,
	.program-text > ul {
		padding: 20px;
		font-size: 14px;
	}

	.program-text > h1,
	.program-text > h2,
	.program-text > h3,
	.program-text > h4,
	.program-text > h5,
	.program-text > h6,
	.program-text > h7,
	.program-text > h8 {
		padding: 20px;
		font-size: 20px;
	}
}

.vitamins-top-section {
	display: flex;
	gap: 15px;
}

.vitamins-top-section .content {
	background-color: var(--cl-white);
	border-radius: 27px;
	padding: 25px;
}

.vitamins-top-section > img {
	border-radius: 27px;
	object-fit: cover;
	width: 35%;
	flex-shrink: 0;
	max-height: 402px;
}

.vitamins-top-section .blocks {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}

.vitamins-top-section .blocks .item {
	border-radius: 18px;
	padding: 20px;
	font-size: 14px;
	position: relative;
	background-color: var(--cl-gray);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 5px;
}

.vitamins-top-section .blocks .item:nth-child(2) {
	background-color: var(--cl-green);
}

.vitamins-top-section .blocks .number {
	font-size: 25px;
	opacity: 0.5;
	align-self: flex-end;
}

.vitamins-top-section .mobile {
	display: none;
}

@media (max-width: 1100px) {
	.vitamins-top-section .desktop {
		display: none;
	}
}

@media (max-width: 700px) {
	.vitamins-top-section .mobile {
		display: flex;
	}

	.vitamins-top-section .content > img {
		border-radius: 27px;
		max-height: 250px;
		width: 100%;
		object-fit: cover;
		margin-top: 20px;
	}

	.vitamins-top-section .section-title {
		font-size: 50px;
	}

	.vitamins-top-section .blocks {
		grid-template-columns: 1fr;
	}

	.vitamins-top-section .blocks .item {
		flex-direction: column-reverse;
	}

	.vitamins-top-section .blocks .number {
		align-self: flex-start;
	}
}

@media (max-width: 620px) {
	.vitamins-top-section .content {
		padding: 0;
	}

	.vitamins-top-section .section-title {
		font-size: 40px;
	}

	.vitamins-top-section .content > img {
		max-height: 50vw;
		margin-top: 8px;
	}
}

.vitamins-categories {
	margin: 40px 0px;
	display: flex;
	gap: 20px;
	justify-content: center;
	flex-wrap: wrap;
}

.vitamins-categories > * {
	display: block;
	color: var(--cl-black);
	text-decoration: none;
	font-variation-settings: "wght" 700;
	font-size: 18px;
}

.vitamins-categories > div {
	opacity: 0.5;
}

.vitamins-categories > a {
	cursor: pointer;
}

.vitamins-catalog {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

.vitamins-catalog .item {
	border-radius: 30px;
	border: 1px solid var(--cl-gray);
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.vitamins-catalog .item .img-block {
	display: block;
	width: 100%;
	height: 400px;
	flex-shrink: 0;
	cursor: pointer;
}

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

.vitamins-catalog .item .img-block img.second {
	display: none;
}

.vitamins-catalog .item .img-block:hover img.first {
	display: none;
}

.vitamins-catalog .item .img-block:hover img.second {
	display: block;
}

.vitamins-catalog .item .content {
	padding: 30px;
	background-color: var(--cl-gray);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	gap: 30px;
}

.vitamins-catalog .item .title {
	font-size: 18px;
	font-variation-settings: "wght" 700;
	text-transform: uppercase;
	margin-bottom: 20px;
	cursor: pointer;
	font-weight: 400;
	margin-top: 0;
}

.vitamins-catalog .item .price {
	font-size: 18px;
	font-variation-settings: "wght" 700;
	margin-top: 20px;
}

.vitamins-catalog .btns-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.vitamins-catalog .btn.small-size {
	font-size: 18px;
	padding: 10px;
}

@media (max-width: 1100px) {
	.vitamins-catalog {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 730px) {
	.vitamins-catalog {
		grid-template-columns: 1fr;
	}

	.vitamins-catalog .item .content {
		padding: 20px;
	}

	.vitamins-catalog .title {
		font-size: 16px;
	}

	.vitamins-catalog .text {
		font-size: 14px;
	}

	.vitamins-catalog .btn.small-size {
		font-size: 16px;
		padding: 10px;
	}
}

.pagination {
	width: 100%;
	display: flex;
	justify-content: center;
	gap: 15px;
	margin: 30px auto 40px;
}

.pagination > li {
	display: block;
	flex-shrink: 0;
}

.pagination > li:first-child,
.pagination > li:nth-child(2),
.pagination > li:nth-last-child(2),
.pagination > li:last-child {
	display: none;
}

.pagination .page-link {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 45px;
	height: 45px;
	color: var(--cl-black);
	text-decoration: none;
	padding: 10px;
	border-radius: 90px;
	border: 1px solid var(--cl-gray);
	cursor: pointer;
}

.pagination .active .page-link {
	opacity: 0.5;
	border: none;
}

.blog-title {
	padding: 50px;
	font-size: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	background-color: var(--cl-green);
	border-radius: 30px;
	margin: 15px 0px;
	font-variation-settings: "wght" 700;
	text-transform: uppercase;
}

.blog-title.article {
	font-size: 45px;
}

.blog-head-img {
	border-radius: 30px;
	margin-bottom: 20px;
	width: 100%;
	max-height: 760px;
	object-fit: cover;
}

@media (max-width: 620px) {
	.blog-title,
	.blog-title.article {
		padding: 20px;
		font-size: 30px;
		border-radius: 10px;
	}

	.blog-head-img {
		border-radius: 10px;
	}
}

.articles-list .item {
	display: flex;
	border: 1px solid var(--cl-gray);
	border-bottom: none;
	height: fit-content;
	color: var(--cl-black);
	text-decoration: none;
}

.articles-list .item:last-child {
	border-bottom: 1px solid var(--cl-gray);
}

.articles-list .content {
	padding: 30px;
}

.articles-list .title {
	text-transform: uppercase;
	font-weight: 400;
	font-size: 30px;
	margin-bottom: 30px;
}

.articles-list .item > img {
	width: 50%;
	object-fit: cover;
	flex-shrink: 0;
	height: 420px;
}

@media (max-width: 950px) {
	.articles-list .item > img {
		width: 40%;
	}
}

@media (max-width: 820px) {
	.articles-list .item {
		flex-direction: column;
	}

	.articles-list .item > img {
		width: 100%;
		height: 70vw;
		max-height: 400px;
	}
}

@media (max-width: 520px) {
	.articles-list .content {
		padding: 15px;
	}

	.articles-list .title {
		font-size: 20px;
		margin-bottom: 20px;
	}

	.articles-list .text {
		font-size: 14px;
	}
}

.article-text > div,
.article-text > p,
.article-text > ul {
	padding: 25px;
	background-color: var(--cl-gray);
	margin: 8px 0px;
	border-radius: 20px;
}

.article-text > h1,
.article-text > h2,
.article-text > h3,
.article-text > h4,
.article-text > h5,
.article-text > h6,
.article-text > h7,
.article-text > h8 {
	padding: 25px;
	background-color: var(--cl-green);
	margin: 8px 0px;
	border-radius: 20px;
	text-transform: uppercase;
}

.article-text li {
	margin-left: 20px;
	margin-bottom: 5px;
}

.article-text img {
	width: 100%;
	object-fit: cover;
}

@media (max-width: 620px) {
	.article-text > div,
	.article-text > p,
	.article-text > ul {
		padding: 20px;
		font-size: 14px;
	}

	.article-text > h1,
	.article-text > h2,
	.article-text > h3,
	.article-text > h4,
	.article-text > h5,
	.article-text > h6,
	.article-text > h7,
	.article-text > h8 {
		padding: 20px;
		font-size: 20px;
	}
}

.prodli-box-header {
	display: flex;
	gap: 15px;
}

.prodli-box-header .mobile {
	display: none;
}

.prodli-box-header > .img {
	background-image: url("/assets/img/girls.jpg");
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 30px;
	width: 35%;
	flex-shrink: 0;
}

.prodli-box-header .content {
	border-radius: 30px;
	background-color: var(--cl-white);
	padding: 25px;
}

.prodli-box-header .logo {
	width: 100%;
}

.prodli-box-header .subtitle {
	font-size: 20px;
	margin: 15px 0 25px;
}

.prodli-box-header .block {
	padding: 25px;
	background-color: var(--cl-gray);
	border-radius: 20px;
}

.prodli-box-header .block.green {
	padding: 30px;
	background-color: var(--cl-green);
	font-variation-settings: "wght" 700;
	margin-top: 12px;
}

@media (max-width: 780px) {
	.prodli-box-header .desktop {
		display: none;
	}

	.prodli-box-header .mobile {
		display: block;
	}

	.prodli-box-header .content > .img {
		width: 100%;
		height: 65vw;
		max-height: 400px;
		border-radius: 20px;
		background-image: url("/assets/img/girls.jpg");
		background-position: center 35%;
		background-size: 110%;
		background-repeat: no-repeat;
		margin-bottom: 12px;
	}
}

@media (max-width: 620px) {
	.prodli-box-header .content {
		padding: 0;
	}

	.prodli-box-header .subtitle {
		font-size: 16px;
		margin: 10px 0 15px;
	}

	.prodli-box-header .content > .img {
		margin-bottom: 8px;
		border-radius: 10px;
	}

	.prodli-box-header .block {
		padding: 15px;
		font-size: 14px;
		border-radius: 10px;
	}

	.prodli-box-header .block.green {
		padding: 18px;
		margin-top: 8px;
	}
}

.prodli-box-content {
	margin-bottom: 40px;
}

.prodli-box-content .block-title {
	border-radius: 20px;
	background-color: var(--cl-green);
	padding: 30px;
	text-transform: uppercase;
	font-size: 25px;
	font-variation-settings: "wght" 700;
	margin-bottom: 8px;
}

.prodli-box-content .block-content {
	border-radius: 20px;
	background-color: var(--cl-white);
	padding: 30px;
	margin-bottom: 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.prodli-box-content .wrapper {
	display: flex;
	gap: 8px;
}

.prodli-box-content .wrapper > div {
	padding: 30px;
	border-radius: 20px;
	background-color: var(--cl-white);
}

.prodli-box-content .wrapper > div:first-child {
	background-color: var(--cl-green);
	text-transform: uppercase;
	font-size: 25px;
	font-variation-settings: "wght" 700;
	width: 55%;
	flex-shrink: 0;
}

.prodli-box-content .wrapper span {
	display: block;
	margin-top: 30px;
	font-variation-settings: "wght" 700;
}

.prodli-box-content .list-item {
	display: flex;
	gap: 5px;
}

.prodli-box-content .list-item span {
	font-variation-settings: "wght" 700;
}

.prodli-box-content .list-item > img {
	width: 20px;
	height: 20px;
	margin-top: 1px;
}

@media (max-width: 950px) {
	.prodli-box-content .wrapper {
		flex-direction: column;
	}

	.prodli-box-content .wrapper > div:first-child {
		width: 100%;
	}
}

@media (max-width: 620px) {
	.prodli-box-content {
		margin-top: 50px;
	}

	.prodli-box-content .block-title {
		border-radius: 10px;
		padding: 15px;
		font-size: 20px;
	}

	.prodli-box-content .block-content {
		border-radius: 10px;
		padding: 15px;
		background-color: var(--cl-gray);
	}

	.prodli-box-content .wrapper > div:first-child {
		font-size: 22px;
	}

	.prodli-box-content .wrapper > div {
		padding: 20px;
		border-radius: 10px;
		background-color: var(--cl-gray);
	}
}

.contacts-section .wrapper {
	display: flex;
	gap: 20px;
	width: 100%;
}

.contacts-section .block {
	width: 100%;
}

.contacts-section .title {
	font-size: 25px;
	font-variation-settings: "wght" 700;
	padding: 25px;
	border-radius: 20px;
	background-color: var(--cl-green);
	text-transform: uppercase;
}

.contacts-section .item {
	min-height: 100px;
	display: flex;
	gap: 8px;
	margin-top: 8px;
}

.contacts-section .item .subtitle {
	font-variation-settings: "wght" 700;
}

.contacts-section .item a {
	color: var(--cl-black);
}

.contacts-section .messengers-block {
	display: flex;
	gap: 12px;
}

.contacts-section .item .icon {
	width: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--cl-white);
	flex-shrink: 0;
	border-radius: 20px;
}

.contacts-section .item .content {
	background-color: var(--cl-white);
	border-radius: 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: 8px;
	padding: 20px;
	width: 100%;
}

@media (max-width: 1100px) {
	.contacts-section .item .content .flex {
		display: flex;
		flex-direction: column;
		gap: 4px;
	}
}

@media (max-width: 850px) {
	.contacts-section .wrapper {
		flex-direction: column;
	}
}

@media (max-width: 620px) {
	.contacts-section .block .title {
		border-radius: 10px;
		padding: 18px;
	}

	.contacts-section .item {
		min-height: 70px;
	}

	.contacts-section .item .icon {
		width: 70px;
		border-radius: 10px;
		background-color: var(--cl-gray);
	}

	.contacts-section .item .content {
		border-radius: 10px;
		background-color: var(--cl-gray);
		font-size: 14px;
		padding: 12px;
	}
}

.contact-map {
	border-radius: 20px;
	overflow: hidden;
	height: 50vw;
	max-height: 560px;
}

.contact-map div {
	height: 100%;
}

.contact-map iframe {
	width: 100%;
	height: 100%;
}

.map-section {
	margin-top: 0px;
	margin-bottom: 50px;
}

@media (max-width: 620px) {
	.contact-map {
		border-radius: 10px;
	}
	.map-section {
		margin-top: -10px;
	}
}

.delivery-section .top-flex {
	display: flex;
	gap: 8px;
	margin-bottom: 30px;
}

.delivery-section .top-flex > div {
	flex-shrink: 0;
}

.delivery-section .title {
	font-size: 25px;
	font-variation-settings: "wght" 700;
	background-color: var(--cl-green);
	border-radius: 20px;
	padding: 25px;
	text-transform: uppercase;
}

.delivery-section .deliveries-flex {
	margin-top: 8px;
	display: flex;
	gap: 8px;
}

.delivery-section .deliveries-flex > div {
	height: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 20px;
	background-color: var(--cl-white);
	padding: 10px 30px;
}

.delivery-section .top-flex > img {
	height: 193px;
	width: 100%;
	object-fit: cover;
	border-radius: 20px;
}

.delivery-section .stage {
	display: block;
	background-color: var(--cl-white);
	border-radius: 20px;
	padding: 25px;
	display: flex;
	gap: 30px;
	align-items: center;
	justify-content: space-between;
	margin-top: 8px;
}

.delivery-section .stage .number {
	font-size: 25px;
	opacity: 0.5;
}

.delivery-section .bottom-flex {
	margin-top: 35px;
	display: flex;
	gap: 20px;
}

.delivery-section .stage span {
	font-variation-settings: "wght" 700;
}

@media (max-width: 800px) {
	.delivery-section .top-flex > img {
		display: none;
	}

	.delivery-section .bottom-flex {
		flex-direction: column;
	}
}

.about-us-advantages {
	margin: 40px 0px 20px;
}

.about-us-advantages .wrapper {
	display: flex;
	gap: 8px;
	margin-bottom: 8px;
}

.about-us-advantages .block {
	border-radius: 20px;
	padding: 30px;
	background-color: var(--cl-white);
	width: 100%;
	display: flex;
	align-items: center;
}

.about-us-advantages .block .subtitle {
	text-transform: uppercase;
	font-variation-settings: "wght" 700;
	font-size: 20px;
	margin-bottom: 10px;
}

.about-us-advantages .block li {
	margin-left: 15px;
}

.about-us-advantages .block.title {
	background-color: var(--cl-green);
	text-transform: uppercase;
	font-size: 25px;
	font-variation-settings: "wght" 700;
}

.about-us-advantages .block.green {
	background-color: var(--cl-green);
}

.about-us-service .wrapper {
	display: flex;
	gap: 8px;
}

.about-us-service .block {
	border-radius: 20px;
	padding: 30px;
	background-color: var(--cl-white);
	width: 100%;
	display: flex;
	align-items: center;
}

.about-us-service .block.title {
	background-color: var(--cl-green);
	text-transform: uppercase;
	font-size: 22px;
	font-variation-settings: "wght" 700;
	justify-content: center;
	margin-bottom: 8px;
}

@media (max-width: 1200px) {
	.about-us-service .wrapper {
		flex-direction: column;
		gap: 20px;
	}
}

@media (max-width: 850px) {
	.about-us-advantages .wrapper {
		flex-direction: column;
	}

	.about-us-advantages .block.green {
		background-color: var(--cl-white);
	}
}

@media (max-width: 620px) {
	.about-us-advantages .block {
		border-radius: 10px;
		padding: 20px;
		background-color: var(--cl-gray);
	}

	.about-us-advantages .block.title {
		font-size: 22px;
	}

	.about-us-service .block {
		border-radius: 10px;
		padding: 20px;
		background-color: var(--cl-gray);
		font-size: 14px;
	}

	.about-us-service .block.title {
		font-size: 22px;
	}

	.about-us-advantages .block.green {
		background-color: var(--cl-gray);
	}

	.delivery-section .title {
		border-radius: 10px;
		padding: 20px;
	}

	.delivery-section .stage {
		background-color: var(--cl-gray);
		border-radius: 10px;
		padding: 20px;
		flex-direction: column-reverse;
		align-items: flex-start;
		gap: 5px;
		font-size: 14px;
	}

	.delivery-section .stage .number {
		font-size: 22px;
	}

	.delivery-section .top-flex > div {
		flex-shrink: 1;
	}

	.delivery-section .deliveries-flex > div {
		background-color: var(--cl-gray);
		border-radius: 10px;
		padding: 20px;
	}

	.delivery-section .deliveries-flex > div > img {
		width: 100%;
	}
}

.certificates-slider .swiper {
	margin-top: 20px;
}

.certificates-slider .swiper-slide {
	height: 680px;
}

.certificates-slider .swiper-slide img {
	height: 100%;
	max-width: 100%;
	object-fit: contain;
	display: block;
	margin: 0 auto;
}

.certificates-slider .arrow {
	position: absolute;
	top: calc(50% - 20px);
	background-color: var(--cl-black);
	border-radius: 90px;
	height: 45px;
	width: 45px;
	cursor: pointer;
	z-index: 5;
}

.certificates-slider .arrow.left {
	left: 0px;
	transform: rotate(180deg);
}

.certificates-slider .arrow.right {
	right: 0px;
}

@media (max-width: 700px) {
	.certificates-slider .section-title {
		font-size: 45px;
	}
}

@media (max-width: 480px) {
	.certificates-slider .swiper-slide {
		height: 140vw;
	}
}

.politics-text {
	line-height: 1.5;
}

.not-found-title {
	margin-top: 20px;
	padding: 70px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-variation-settings: "wght" 700;
	align-items: center;
	background-color: var(--cl-green);
	border-radius: 30px;
	text-align: center;
}

.not-found-title .text {
	font-size: 50px;
}

.not-found-title .number {
	font-size: 102px;
}

.not-found-page .btn {
	width: fit-content;
	margin: 50px auto;
	padding: 15px 40px;
}

@media (max-width: 800px) {
	.not-found-title {
		padding: 40px;
	}

	.not-found-title .text {
		font-size: 40px;
	}

	.not-found-title .number {
		font-size: 80px;
	}
}

@media (max-width: 500px) {
	.not-found-title {
		padding: 30px;
	}

	.not-found-title .text {
		font-size: 30px;
	}

	.not-found-title .number {
		font-size: 60px;
	}

	.not-found-page .btn {
		margin: 30px auto;
	}
}

.basket-btn {
	width: 60px;
	height: 60px;
	z-index: 200;
	position: fixed;
	top: 100px;
	right: 65px;
	cursor: pointer;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
	border-radius: 90px;
	transition-duration: 300ms;
	display: flex;
	justify-content: center;
	align-items: center;
}

.basket-btn.hide {
	display: none;
}

.basket-btn > img {
	width: 100%;
	height: 100%;
}

.basket-btn .sum-box {
	position: absolute;
	right: 70px;
	top: 14px;
	padding: 8px 12px;
	border-radius: 5px;
	font-size: 14px;
	background-color: var(--cl-black);
	color: white;
	width: max-content;
	pointer-events: none;
	opacity: 0;
	transition-duration: 200ms;
}

.basket-btn:hover .sum-box {
	opacity: 1;
}

.basket-btn .sum-box.show {
	opacity: 1;
}

.socials-btn {
	width: 60px;
	height: 60px;
	z-index: 200;
	position: fixed;
	bottom: 50px;
	right: 65px;
	cursor: pointer;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
	border-radius: 90px;
	transition-duration: 300ms;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: white;
}

.socials-btn img {
	width: 100%;
	height: 100%;
}

.socials-btn .close {
	display: none;
	transform: rotate(45deg);
	width: 25px;
	height: 25px;
}

.socials-btn.opened .open {
	display: none;
}

.socials-btn.opened .close {
	display: block;
}

.socials-btn.telegram {
	z-index: 190;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
}

.socials-btn.whatsapp {
	z-index: 190;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
}

.socials-btn.telegram.opened {
	transform: translateY(-270%);
}

.socials-btn.whatsapp.opened {
	transform: translateY(-145%);
}

.socials-btn.small {
	height: 50px;
	width: 50px;
	bottom: 55px;
	right: 70px;
}

.socials-btn.whatsapp {
	height: 48px;
	width: 48px;
	bottom: 56px;
	right: 70px;
}

.modal-wrapper.basket {
	padding: 30px;
	width: fit-content;
	max-width: 560px;
	border-radius: 30px;
}

.basket div.title {
	text-align: left;
	font-size: 25px;
	font-variation-settings: "wght" 700;
}

.basket .products {
	margin: 20px 0px;
	padding: 5px 0px;
	border-top: 1px solid var(--cl-dark-gray);
	border-bottom: 1px solid var(--cl-dark-gray);
}

.basket .total {
	font-variation-settings: "wght" 700;
	margin-bottom: 20px;
	text-align: end;
}

.basket .text-bottom {
	margin-top: 10px;
	font-size: 13px;
}

.basket .text {
	margin-top: 20px;
	margin-bottom: 30px;
}

.basket li {
	margin-left: 15px;
}

.basket .text-bottom li {
	margin-left: 12px;
}

.basket .btn {
	margin: 20px 0px;
}

.basket .text-bottom > p {
	margin-bottom: 10px;
}

.basket input.input-field {
	display: flex;
	height: 56px;
	align-items: center;
	border-radius: 10px;
	background-color: var(--cl-gray);
	padding: 0 20px;
	font-size: 16px;
	margin-top: 6px;
}

@media (max-width: 900px) {
	.basket-btn {
		right: 10px;
		top: 80px;
	}

	.socials-btn {
		bottom: 10px;
		right: 10px;
	}

	.socials-btn.small {
		bottom: 15px;
		right: 15px;
	}
}

.modal-wrapper.cta {
	max-width: 1160px;
	border-radius: 30px;
	padding: 46px;
}

.modal-wrapper.cta .title {
	text-align: left;
}

.modal-wrapper.cta .cta-section {
	margin: 0;
}

.modal-wrapper.cta .cta-section .title-block {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

@media (max-width: 768px) {
	.modal-wrapper.cta {
		padding: 60px 20px 20px;
	}
}

@media (max-width: 450px) {
	.modal-wrapper.cta {
		padding: 60px 10px 20px;
		width: 95%;
		margin: 10px auto;
	}
}

.mobile-menu-btn .close {
	display: none;
}

.mobile-menu-opened .mobile-menu-btn .close {
	display: flex;
}

.mobile-menu-opened .mobile-menu-btn .open {
	display: none;
}

.header-wrapper {
	z-index: 40;
}

.mobile-menu-opened .header-wrapper {
	border-radius: 0;
}

.header-menu-mobile {
	opacity: 0;
	display: flex;
	background-color: var(--cl-gray);
	position: absolute;
	top: 73px;
	left: 0px;
	width: 100%;
	flex-direction: column;
	gap: 30px;
	z-index: 30;
	transition-duration: 300ms;
	transform: translateY(-100%);
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
	padding: 0px 5px 25px 5px;
}

.header-menu-mobile a {
	display: block;
	color: var(--cl-black);
	text-decoration: none;
}

.header-menu-mobile .item {
	padding: 4px 11px 4px 11px;
	position: relative;
	font-size: 18px;
}

.header-menu-mobile .parent {
	display: flex;
	gap: 8px;
}

.header-menu-mobile .parent.opened {
	background-color: var(--cl-darker-gray);
	width: fit-content;
	border-top-left-radius: 17px;
	border-top-right-radius: 17px;
}

.header-menu-mobile .parent.opened > img {
	transform: rotate(180deg);
}

.header-menu-mobile .btn {
	font-size: 16px;
	padding: 12px 20px;
	margin: 0px 11px;
}

.header-menu-mobile .item .top-decoration {
	display: none;
	position: absolute;
	top: -4px;
	left: 0px;
	width: 100%;
	height: 34px;
	border-radius: 17px;
	background-color: var(--cl-darker-gray);
	z-index: -1;
}

.header-menu-mobile .item.opened .top-decoration {
	display: block;
}

.header-menu-mobile .title {
	opacity: 0.5;
	font-variation-settings: "wght" 700;
	font-size: 20px;
	margin-bottom: 4px;
	text-transform: uppercase;
	padding-left: 11px;
}

.header-menu-mobile .wrapper {
	display: flex;
	gap: 10px;
	justify-content: space-between;
}

.header-menu-mobile .wrapper .icons {
	display: flex;
	gap: 6px;
	margin-right: 11px;
}

.header-menu-mobile .item .submenu-wrapper {
	display: none;
	position: absolute;
	top: 27px;
	left: 0px;
	flex-direction: column;
	background-color: var(--cl-darker-gray);
	z-index: 10;
	padding: 12px 11px 18px;
	border-top-right-radius: 17px;
	border-bottom-left-radius: 17px;
	border-bottom-right-radius: 17px;
	width: calc(100vw - 50px);
}

@media (max-width: 600px) {
	.header-menu-mobile .item .submenu-wrapper {
		width: calc(100vw - 30px);
	}
}

@media (max-width: 400px) {
	.header-menu-mobile .item .submenu-wrapper {
		width: calc(100vw - 20px);
	}
}

.header-menu-mobile .item .submenu-wrapper > .item {
	padding: 4px 0;
	font-size: 16px;
}

.header-menu-mobile .item .submenu-wrapper > .item.strong {
	font-variation-settings: "wght" 700;
}

.header-menu-mobile .item.opened .submenu-wrapper {
	display: flex;
}

@media (max-width: 600px) {
	.header-menu-mobile {
		top: 52px;
	}
}

.mobile-menu-opened .header-menu-mobile {
	transform: translateY(0%);
	opacity: 1;
}

.header-menu-mobile .submenu-wrapper {
	display: flex;
}

.modal-wrapper.product {
	max-width: 90vw;
	padding: 30px;
	border-radius: 30px;
	width: fit-content;
}

@media (max-width: 650px) {
	.modal-wrapper.product {
		margin-top: 10px;
	}
}

@media (max-width: 450px) {
	.modal-wrapper.product {
		margin: 0px;
		width: 100%;
		max-width: 100%;
		padding: 20px;
		border-radius: 0px;
	}
}

.product-item {
	display: flex;
	gap: 30px;
}

.product-item .gallery {
	flex-shrink: 0;
	max-width: 360px;
}

.product-item .swiper-slide > img {
	width: 100%;
	max-width: 360px;
}

.product-item .content {
	margin-top: 30px;
}

.product-item div.title {
	font-size: 22px;
	font-variation-settings: "wght" 700;
	text-transform: uppercase;
	text-align: left;
	margin-bottom: 15px;
}

@media (max-width: 450px) {
	.product-item {
		align-items: center;
		gap: 20px;
		min-height: 100lvh;
	}

	.product-item .content {
		margin-top: 0px;
	}

	.product-item div.title {
		font-size: 18px;
	}
}

.product-item .price {
	font-size: 18px;
	font-variation-settings: "wght" 700;
	margin-bottom: 20px;
}

.product-item .btn {
	border: 2px solid var(--cl-black);
	background-color: var(--cl-gray);
	width: fit-content;
	font-size: 14px;
	padding: 9px 32px;
	margin-bottom: 20px;
}

.product-item .text {
	max-width: 600px;
	margin-right: 30px;
	margin-top: 30px;
	font-size: 14px;
}

.product-item .arrow {
	position: absolute;
	top: calc(50% - 15px);
	background-color: var(--cl-black);
	border-radius: 90px;
	height: 30px;
	width: 30px;
	cursor: pointer;
	z-index: 5;
}

.product-item .arrow.left {
	left: 0px;
	transform: rotate(180deg);
}

.product-item .arrow.right {
	right: 0px;
}

@media (max-width: 800px) {
	.product-item {
		flex-direction: column;
	}
}

.total-quantity {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: -8px;
	bottom: -6px;
	padding: 5px;
	border-radius: 90px;
	background-color: var(--cl-black);
	color: var(--cl-white);
	font-size: 12px;
	width: 26px;
	height: 26px;
}

.basket-item {
	padding: 15px 0;
	display: grid;
	grid-template-areas: "img name quant price remove";
	align-items: center;
	grid-template-columns: auto 1fr 85px 68px auto;
	gap: 22px;
	font-size: 14px;
}

.basket-item > img {
	grid-area: img;
	width: 70px;
	height: 70px;
}

.basket-item .name {
	grid-area: name;
}

.basket-item .quantity-block {
	grid-area: quant;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 7px;
}

.basket-item .item-btn {
	font-size: 18px;
	border-radius: 90px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid var(--cl-dark-gray);
	cursor: pointer;
}

.basket-item .remove-btn {
	grid-area: remove;
}

.basket-item .remove-btn > img {
	width: 9px;
	height: 9px;
}

@media (max-width: 520px) {
	.basket-item {
		grid-template-areas:
			"img name  name  remove"
			"img quant price remove";
		grid-template-columns: auto 1fr 1fr auto;
		align-items: start;
		gap: 9px;
	}

	.basket-item .quantity-block {
		justify-content: flex-start;
	}
}

@media (max-width: 350px) {
	.basket-item {
		grid-template-areas:
			"img name  remove"
			"img quant remove"
			"img price remove";
		grid-template-columns: auto 1fr auto;
	}
}

.toastify {
	font-size: 14px;
	border-radius: 10px;
	max-width: 350px;
}

.test-options {
	margin-top: 50px;
}

.test-options .blocks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 30px;
	row-gap: 40px;
	margin-top: 40px;
}

.test-options .item {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.test-options .item .title {
	padding: 30px;
	border-radius: 20px;
	background-color: var(--cl-green);
	font-size: 25px;
	font-variation-settings: "wght" 700;
	text-transform: uppercase;
}

.test-options .item .text {
	padding: 30px;
	border-radius: 20px;
	background-color: var(--cl-white);
	margin: 10px 0px;
	font-size: 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	flex-grow: 1;
}

.test-options .item .text .price {
	font-size: 22px;
	font-variation-settings: "wght" 700;
}

@media (max-width: 800px) {
	.test-options .blocks {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 620px) {
	.test-options .item .text {
		background-color: var(--cl-gray);
	}
}

@media (max-width: 450px) {
	.test-options .item .title,
	.test-options .item .text {
		border-radius: 10px;
		padding: 15px;
	}

	.test-options .item .text {
		font-size: 16px;
	}
}

.genetic-partners {
	margin: 50px 0px;
}

.genetic-partners .content {
	display: flex;
	gap: 20px;
}

.genetic-partners .flex-wrapper {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: calc(50% - 10px);
}

.genetic-partners .text {
	border-radius: 20px;
	padding: 25px;
	font-size: 18px;
	background-color: var(--cl-green);
}

.genetic-partners .certificate {
	border-radius: 20px;
	width: calc(50% - 10px);
	object-fit: contain;
	flex-shrink: 0;
}

.genetic-partners .img {
	border-radius: 20px;
	background-image: url("/assets/img/dna.jpg");
	width: 100%;
	flex-grow: 1;
	background-size: cover;
	background-position: center;
}

@media (max-width: 900px) {
	.genetic-partners .content {
		flex-direction: column;
	}

	.genetic-partners .flex-wrapper {
		flex-direction: row;
		width: 100%;
	}

	.genetic-partners .certificate {
		width: 100%;
	}
}

@media (max-width: 620px) {
	.genetic-partners .content {
		gap: 10px;
	}

	.genetic-partners .flex-wrapper {
		gap: 10px;
	}

	.genetic-partners .img {
		border-radius: 10px;
		width: 30%;
		flex-shrink: 0;
	}

	.genetic-partners .text {
		border-radius: 10px;
		font-size: 16px;
		padding: 15px;
	}

	.genetic-partners .certificate {
		box-shadow: 0px 0px 2px 0px rgba(34, 60, 80, 0.2);
		border-radius: 10px;
	}
}

.gbtn:not(.disabled) {
	width: 45px;
	height: 45px;
	background-color: var(--cl-green);
	border-radius: 90px;
}

.gbtn:not(.disabled) svg g path {
	fill: black !important;
}

.glightbox-clean .gprev:not(.disabled),
.glightbox-clean .gnext:not(.disabled) {
	top: 45% !important;
}

.go-to-top-btn {
	background: url(/assets/img/icons/black-round-arrow-left.svg) no-repeat center;
	width: 60px;
	height: 60px;
	cursor: pointer;
	position: fixed;
	bottom: 132px;
	right: 65px;
	background-size: 100%;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.5);
	border-radius: 1000px;
	z-index: 1000;
	transform: rotate(90deg);
}

.go-to-top-btn:hover {
	opacity: 1;
}

@media (max-width: 900px) {
	.go-to-top-btn {
		right: 10px;
		bottom: 87px;
	}
}

.bottom-title {
	font-size: 14px;
	opacity: 0.5;
	margin: 0;
}

/* COOKIE */

.cookie-note {
	position: sticky;
	background-color: white;
	color: var(--color-delivery);
	bottom: 0px;
	display: none;
	gap: 20px;
	padding: 10px;
	font-size: 14px;
	border: 1px solid var(--color-slider);
	width: 100%;
	justify-content: center;
	border: 1px solid rgba(7, 21, 49, 0.1);
	z-index: 10;
}

.cookie-note.show {
	display: flex !important;
}

.cookie-note__text {
	align-self: center;
	padding-left: 10px;
}

.cookie-note__btn:hover {
	background-color: var(--color-sub);
}

@media (max-width: 650px) {
	.cookie-note {
		flex-direction: column;
		gap: 10px;
	}

	.cookie-note__btn {
		align-self: center;
	}
}

.seo-text {
	margin-bottom: 30px;
}

.seo-text p {
	font-size: 15px;
}

.seo-text li {
	margin-left: 15px;
}

.relative {
	position: relative;
}

.js-hidden {
	display: none;
}

.js-invisible {
	visibility: hidden;
}

.flare {
	position: absolute;
	top: 0;
	height: 100%;
	width: 45px;
	transform: skewX(-45deg);
	animation: flareAnimation;
	left: -150%;
	background: linear-gradient(
		90deg,
		rgba(255, 255, 255, 0.1),
		rgba(255, 255, 255, 0.4)
	);
	animation: flareAnimation 3s infinite linear;
}

@keyframes flareAnimation {
	0% {
		left: -150%;
	}
	100% {
		left: 150%;
	}
}

.article-banner {
	position: relative;
	background-color: var(--cl-green);
	border-radius: 20px;
	padding: 53px 57px;
	overflow: hidden;
	cursor: pointer;
}

.article-banner .main-title {
	font-size: 45px;
	font-variation-settings: "wght" 700;
	text-transform: uppercase;
	max-width: 575px;
	line-height: 1.2;
}

.article-banner .text {
	font-size: 20px;
	margin-top: 16px;
	max-width: 376px;
}

.article-banner .float-title {
	position: absolute;
	left: 520px;
	bottom: 17%;
	background-color: var(--cl-black);
	color: #ffffff;
	text-transform: uppercase;
	font-size: 16px;
	padding: 10px 15px;
	border-radius: 90px;
	max-width: 330px;
	transform: rotate(-2deg);
	text-align: center;
	font-variation-settings: "wght" 700;
}

.text-banner .float-title {
	left: 540px;
}

.article-banner .float-arrow {
	position: absolute;
	left: 555px;
	top: 0%;
}

.article-banner.text-banner .float-arrow.desktop {
	position: absolute;
	left: 397px;
	top: -15%;
	transform: rotate(5.77deg);
}

.article-banner .float-arrow.mobile {
	display: none;
}

.article-banner .bg-img {
	position: absolute;
	bottom: 0%;
	right: 0px;
}

.article-banner .bg-img.mobile {
	display: none;
}

@media (max-width: 1160px) {
	.article-banner .bg-img.desktop {
		display: none;
	}
}

@media (max-width: 925px) {
	.article-banner .main-title {
		font-size: 30px;
		max-width: 400px;
	}

	.article-banner .text {
		font-size: 16px;
		max-width: 350px;
	}

	.article-banner .float-arrow {
		left: 400px;
		top: -35px;
	}

	.article-banner .float-title {
		left: 430px;
		font-size: 15px;
	}

	.article-banner.text-banner .float-arrow.desktop {
		left: 296px;
		top: -24%;
	}
}

@media (max-width: 800px) {
	.article-banner .text {
		margin-bottom: 120px;
	}

	.article-banner .float-arrow.desktop {
		display: none;
	}

	.article-banner .float-arrow.mobile {
		display: block;
		top: auto;
		bottom: 105px;
		left: 110px;
	}

	.article-banner .bg-img.mobile {
		display: block;
		left: 190px;
		right: auto;
	}

	.article-banner .float-title {
		transform: rotate(0deg);
		right: auto;
		left: 53px;
		bottom: 50px;
	}
}

@media (max-width: 568px) {
	.article-banner {
		padding: 20px;
	}

	.article-banner .main-title {
		font-size: 18px;
		max-width: 300px;
	}

	.article-banner .text {
		font-size: 12px;
		max-width: 160px;
		margin-bottom: 145px;
	}

	.article-banner.text-banner .text {
		margin-top: 6px;
		margin-bottom: 110px;
	}

	.article-banner .float-title {
		font-size: 14px;
		max-width: 210px;
		padding: 10px 17px;
		left: 10px;
		bottom: 20px;
	}

	.article-banner .float-arrow.mobile {
		left: 87px;
		bottom: 97px;
	}

	.article-banner.text-banner .float-arrow.mobile {
		left: 98px;
		bottom: 75px;
	}

	.article-banner .bg-img.mobile {
		left: 35px;
	}
}

@media (max-width: 370px) {
	.article-banner .bg-img.mobile {
		left: 0px;
	}
}

.article-text table {
	border-spacing: 12px 0px;
}

.article-text table tr td {
	border-bottom: 1px solid var(--cl-white);
}

.article-text table tr:last-child td {
	border-bottom: 0px solid var(--cl-white);
}

.article-text table tr:last-child td p {
	margin-bottom: 0px;
}

.article-text table tr:first-child td p {
	margin-top: 0px;
	font-weight: 600;
}

.sitemap-row a {
	color: black;
	display: block;
	text-decoration: none;
}

.sitemap-level1 {
	margin-top: 7px;
}

.sitemap-inner {
	margin-top: 8px;
	margin-bottom: 16px;
}

.sitemap-level2 {
	font-size: 14px;
	margin-left: 14px;
	margin-bottom: 8px;
}

.sitemap-section {
	margin-bottom: 40px;
	padding-left: 16px;
}

.prodli-box-header .logo {
	font-size: clamp(14px, 6.1vw, 78px);
	font-weight: 600;
}

.prodli-box-header .logo .strong {
	color: var(--cl-green);
}

@media (max-width: 890px) {
	.prodli-box-header .logo {
		font-size: 5.8vw;
	}
}

@media (max-width: 780px) {
	.prodli-box-header .logo {
		font-size: 9.2vw;
	}
}

@media (max-width: 610px) {
	.prodli-box-header .logo {
		font-size: 11.4vw;
	}
}

.blog-author-section {
	margin-bottom: 20px;
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	color: #5c5c5c;
	padding: 0px 20px;
	font-weight: 600;
}

@media (max-width: 800px) {
	.blog-author-section {
		flex-direction: column;
		gap: 6px;
	}
}

@media (max-width: 500px) {
	.blog-author-section {
		margin: -10px 0px 10px;
	}
}

.article-index {
	margin: 20px 0px 0px;
	padding: 25px;
	background-color: var(--cl-green);
	border-radius: 20px;
	text-transform: uppercase;
}

.article-index-title {
	margin-top: 0px;
	font-variation-settings: "wght" 700;
}

.article-index .index-item > a {
	display: flex;
	gap: 9px;
	margin-bottom: 11px;
	font-size: 18px;
	text-decoration: none;
	color: #383838;
	font-weight: 600;
}

.article-index .index-item > a:hover {
	color: var(--cl-black);
}

.article-index .index-item > a > span {
	/* text-decoration: underline; */
}

.article-text > p:last-child {
	display: none;
}

@media (max-width: 600px) {
	.article-index {
		padding: 20px;
		margin: 8px 0px 0px;
	}

	.article-index-title {
		font-size: 18px;
	}

	.article-index .index-item > a {
		font-size: 14px;
	}
}

.footer-copyright {
	color: var(--cl-white);
	font-size: 14px;
}

.article-table-wrapper {
	border-radius: 20px;
	background-color: var(--cl-gray);
	padding: 20px;
	width: 100%;
	max-width: calc(100vw - 10px);
	overflow: scroll;
}
