@font-face {
  font-family: 'days';
  src: url('/src/fonts/Days.woff2') format('woff2'),
       url('/src/fonts/Days.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Для улучшения скорости отрисовки */
}

@font-face {
  font-family: 'Myriad Pro';
  src: url('/src/fonts/Myriad_Pro.woff2') format('woff2'),
       url('/src/fonts/Myriad_Pro.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Для улучшения скорости отрисовки */
}

html, body {
    font-family: "Myriad Pro", "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
    font-size: 16px;
    line-height: 1.07143;
    font-weight: 400;
    /*letter-spacing: -.005em;*/
	background-color: #fff;
	min-width: 320px;
}

html {
	width: 100%;
	height: 100%;
	display: grid;
}

body {
        width: 100%;
        height: 100%;
        padding-top: 85px;
        box-sizing: border-box;
}

a {
	/*color: #b43084;*/
	color: #90b932;
	transition: all 0.2s;
}

a:hover {
	color: #b43084;
}

.smoothly {
    opacity: 0;
    transform: translateY(1em);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.smoothly.slow {
	transition: opacity 1.2s ease, transform 1.2s ease;
}

.smoothly.show {
    opacity: 1;
    transform: translateY(0);
}

.loadout.loading:before {
	background-color: var(--color-two) !important;
}

.list-items {
	margin: 1.5em 0;
}

.list_inn {
	display: block;
	box-sizing: border-box;
	padding: 20px 100px 20px 50px;
	background-color: #fff;
	border-bottom: 1px solid #f7f8fa;
	position: relative;
	font-weight: 500;
}

	.list_inn {
		border-radius: 3px;
	}

	.list_inn a {
		color: #333;
	}

	.list_inn.nodisplay a {
		color: #888;
	}

	.list_item.nodisplay, .list_inn.nodisplay {
		/*background-color: #edeff3;*/
		color: #888;
		font-weight: 400;
	}

		.list_inn a:hover, .list_inn.nodisplay a:hover {
			color: #4394ff;
		}

		.list_inn .unit {
			color: #ccc;
			font-size: 14px;
			padding-left: 15px;
			display: inline-block;
		}

			.list_inn .unit.hidden {
				display: none;
			}

		.social-link {
			color: #888;
			margin-top: .5em;
			font-weight: 400;
		}

	.show_unit {
		margin-top: 20px;
	}

	ol {
		padding: 0;
	}

	ol li {
		list-style: none;
	}

	ol li ol {
		padding-left: 30px;
		position: relative;
	}

		ol li ol:before {
			position: absolute;
			left: 15px;
			top: 1px;
			bottom: 1px;
			content: '';
			display: block;
			border-left: 1px dashed #e1e4ef;
		}

	.ui-sortable-helper {
		border-radius: 3px;
		box-shadow: 0 2px 30px 0 rgba(0,0,0,.15);
	}

	.sortitems-cat, .sortitems-cat > li {
		list-style: none;
	}
	.sortable-placeholder {
		box-sizing: border-box;
		background-color: #e9f6ff;
	}

		.sortable-placeholder:after {
			display: block;
			content: '';
			width: 100%;
			height: 100%;
			border: 1px dashed #4394ff;
			border-radius: 3px;
			box-sizing: border-box;
		}

	.sortitems-cat {
		background-color: transparent;
	}

	.sortitems-cat li, .sortitems li, .prodselected li {
		list-style: none;
		margin: 5px 0 !important;
		box-sizing: border-box;
	}

	.no-val {
		/*background-color: #e5e5e5;*/
		border: 1px dashed #e5e5e5;
		min-height: 57px;
		border-radius: 3px;
		margin-top: 10px;
	}

	.actions {
		position: absolute;
		right: 20px;
		top: 12px;
		width: 85px;
		/*background-color: red;*/
		text-align: right;
	}

		.actions span {
			display: inline-block;
			width: 30px;
			height: 30px;
			border-radius: 30px;
		}

		.actions .act {
			background-color: #fff;
			margin-left: 5px;
			/*border: 1px solid #edeff3;*/
			box-sizing: border-box;
			cursor: pointer;
		}

			.act.edit {
				opacity: .35;
				background: #fff url("data:image/svg+xml,%3Csvg width='14px' height='14px' fill='%234394ff' viewBox='0 0 492.49284 492' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m304.140625 82.472656-270.976563 270.996094c-1.363281 1.367188-2.347656 3.09375-2.816406 4.949219l-30.035156 120.554687c-.898438 3.628906.167969 7.488282 2.816406 10.136719 2.003906 2.003906 4.734375 3.113281 7.527344 3.113281.855469 0 1.730469-.105468 2.582031-.320312l120.554688-30.039063c1.878906-.46875 3.585937-1.449219 4.949219-2.8125l271-270.976562zm0 0'/%3E%3Cpath d='m476.875 45.523438-30.164062-30.164063c-20.160157-20.160156-55.296876-20.140625-75.433594 0l-36.949219 36.949219 105.597656 105.597656 36.949219-36.949219c10.070312-10.066406 15.617188-23.464843 15.617188-37.714843s-5.546876-27.648438-15.617188-37.71875zm0 0'/%3E%3C/svg%3E") center no-repeat;
			}

				.act.edit:hover {
					opacity: 1;
				}

			.actions span.hidden {
				background: transparent url("data:image/svg+xml,%0A%3Csvg width='14px' height='14px' fill='%23df3437' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 511.997 511.997'%3E%3Cpath d='M508.872,478.706L33.292,3.124c-4.167-4.165-10.919-4.165-15.086,0L3.125,18.206c-4.167,4.165-4.167,10.919,0,15.085 l88.207,88.208c-42.116,33.328-73.954,78.762-90.823,131.24c-0.677,2.115-0.677,4.406,0,6.521 c36.281,112.896,138.958,188.74,255.49,188.74c45.581,0,89.41-11.549,128.546-33.288l94.161,94.161 c4.167,4.165,10.919,4.165,15.086,0l15.081-15.082C513.039,489.626,513.039,482.872,508.872,478.706z M255.999,405.333 c-82.344,0-149.333-66.99-149.333-149.333c0-32.414,10.659-63.681,29.859-89.309l46.375,46.376 c-7.676,12.887-12.234,27.445-12.234,42.932c0,47.052,38.281,85.333,85.333,85.333c15.487,0,30.046-4.559,42.932-12.234 l46.375,46.375C319.678,394.674,288.413,405.333,255.999,405.333z'/%3E%3Cpath d='M246.999,177.281c-1.677,3.99-0.771,8.615,2.292,11.677l73.75,73.75c2.042,2.042,4.771,3.125,7.542,3.125 c1.396,0,2.802-0.271,4.135-0.833c4-1.688,6.583-5.615,6.531-9.958c-0.531-46.74-37.552-83.76-84.292-84.292 C252.707,171.208,248.686,173.281,246.999,177.281z'/%3E%3Cpath d='M179.613,119.281c3.198,3.208,8.083,4.021,12.146,2.083c20.375-9.75,41.99-14.698,64.24-14.698 c82.344,0,149.333,66.99,149.333,149.333c0,22.25-4.948,43.865-14.698,64.24c-1.948,4.083-1.115,8.948,2.083,12.146 l36.969,36.969c2,2,4.708,3.125,7.542,3.125c0.01,0,0.021,0,0.021,0c2.844-0.01,5.563-1.146,7.563-3.156 c30.313-30.615,53.375-68.677,66.677-110.063c0.677-2.115,0.677-4.406,0-6.521c-36.281-112.896-138.958-188.74-255.49-188.74 c-31.979,0-63.406,5.687-93.417,16.917c-3.396,1.271-5.917,4.177-6.688,7.729c-0.771,3.542,0.323,7.24,2.885,9.802 L179.613,119.281z'/%3E%3C/svg%3E%0A") center no-repeat;
			}

.handle {
	cursor: move;
	position: absolute;
	top: 5px;
	left: 5px;
	bottom: 5px;
	width: 20px;
	border-radius: 2px;
	background: #fff url("data:image/svg+xml,%0A%3Csvg width='10px' height='10px' fill='%23888' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 282.502 458.379' %3E%3Ccircle cx='53.792' cy='53.311' r='53.311'/%3E%3Ccircle cx='229.35' cy='53.311' r='53.311'/%3E%3Ccircle cx='53.472' cy='229.19' r='53.312'/%3E%3Ccircle cx='229.03' cy='229.19' r='53.312'/%3E%3Ccircle cx='53.472' cy='405.068' r='53.311'/%3E%3Ccircle cx='229.03' cy='405.068' r='53.311'/%3E%3C/svg%3E%0A") center no-repeat;
}

	.handle:hover {
		background: #fff url("data:image/svg+xml,%0A%3Csvg width='14px' height='14px' fill='%232982f7' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 282.502 458.379' %3E%3Ccircle cx='53.792' cy='53.311' r='53.311'/%3E%3Ccircle cx='229.35' cy='53.311' r='53.311'/%3E%3Ccircle cx='53.472' cy='229.19' r='53.312'/%3E%3Ccircle cx='229.03' cy='229.19' r='53.312'/%3E%3Ccircle cx='53.472' cy='405.068' r='53.311'/%3E%3Ccircle cx='229.03' cy='405.068' r='53.311'/%3E%3C/svg%3E%0A") center no-repeat;
	}

.container, .footer-container {
	max-width: 1416px;
	width: 100%;
	margin: 0 auto;
	padding-right: 2em;
	padding-left: 2em;
	box-sizing: border-box;
}

.header {
	z-index: 100;
	height: 85px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    color: #383838;
    display: flex;
    align-items: center;   
    transition: all 1s ease;
}

	.header.shadow {
		box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1)
	}

.header .container {
	display: flex;
	gap: 2em;
	align-items: center;
	justify-content: space-between;
}

.head-left, .head-right {
	/*flex: 1; */
}

.head-left {
	display: flex;
	gap: 4em;
	align-items: center;
}

.head-menu {
	display: flex;
	gap: 2em;
}

.head-phone {
	font-weight: 500 !important;
}

.header a, .header .head-menu span, .head-profile .cart-menu {
	position: relative;
	color: #5c4232;
	text-transform: uppercase;
	font-weight: 600;
	cursor: pointer;
	font-size: 18px;
}

.fav_count, .cart_count {
    position: absolute;
    top: -9px;
    right: -10px;
    background-color: #b53384;
    color: #fff;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 5px;
    display: none;
}

.cart_count {
	top: -6px;
	right: -7px;
}

.fav_count.active, .cart_count.active {
	display: inline-block;
}

.logo img {
	max-height: 50px;
}

/*.footer {
	background-color: #383838;
	color: #F9EFE6;
	padding: 4em 0 2em 0;
}

.footer .container {
}

.foot-bottom {
	display: flex;
	justify-content: space-between;
	border-top: 1px solid #555352;
	margin-top: 1.5em;
	padding-top: 1.5em;
	font-size: .85em;
}

	.foot-bottom .social, .foot-bottom .terms {
		display: inline-flex;
		gap: 1.5em;
	}

	.foot-bottom .created {
		color: #95908b;
	}

.fb-left {
	display: flex;
	gap: 1em;
	align-items: center;
}

.menu-foot {
	display: flex;
	gap: 2em;
	margin-bottom: 3em;
}

.menu-foot-col {
	width: 20%;
	display: flex;
	flex-direction: column;
	gap: .65em;
	    justify-content: center;
}

	.menu-foot-col.subscribe {
		width: 40%;
	}

.footer a {
	color: #F9EFE6;
}

	.footer a:hover {
		color: #F4CC75;
	}

.foot-logo {
	text-align: center;
	margin-bottom: 3em;
}

	.foot-logo img {
		width: 100%;
		max-width: 300px;
	}
*/
.head-right {
	display: flex;
	align-items: center;
	gap: 2em;
	justify-content: flex-end;
}

.head-profile {
	display: flex;
	align-items: center;
	gap: 2em;
}

.profile_ico {
	cursor: pointer;
	display: block;
	width: 22px;
	height: 22px;
	background-image: url("data:image/svg+xml,%3Csvg width='22' height='22' fill='%23000000' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M437.02 330.98c-27.883-27.882-61.071-48.523-97.281-61.018C378.521 243.251 404 198.548 404 148 404 66.393 337.607 0 256 0S108 66.393 108 148c0 50.548 25.479 95.251 64.262 121.962-36.21 12.495-69.398 33.136-97.281 61.018C26.629 379.333 0 443.62 0 512h40c0-119.103 96.897-216 216-216s216 96.897 216 216h40c0-68.38-26.629-132.667-74.98-181.02zM256 256c-59.551 0-108-48.448-108-108S196.449 40 256 40s108 48.448 108 108-48.449 108-108 108z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.fav_ico {
	display: block;
	width: 22px;
	height: 22px;
	background-image: url("data:image/svg+xml,%3Csvg width='22' height='22' fill='%23000000' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 682.667 682.667' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cdefs%3E%3CclipPath id='a' clipPathUnits='userSpaceOnUse'%3E%3Cpath d='M0 512h512V0H0Z' fill='%23000000' opacity='1' data-original='%23000000'%3E%3C/path%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' transform='matrix(1.33333 0 0 -1.33333 0 682.667)'%3E%3Cpath d='M0 0s28.801 100 120 100c71.04 0 116-57.332 116-125.252C236-119.187 142.336-181.387 0-300-142.335-181.387-236-119.187-236-25.252-236 42.668-191.04 100-120 100-28.8 100 0 0 0 0Z' style='stroke-width:40;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1' transform='translate(255.975 356.036)' fill='none' stroke='%23000000' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-dasharray='none' stroke-opacity='' data-original='%23000000'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.cart_ico {
	display: block;
	width: 26px;
	height: 26px;
	background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' fill='%23000000' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 24 24' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M15.25 7.25V7c0-.86-.34-1.69-.95-2.3s-1.44-.95-2.3-.95-1.69.34-2.3.95-.95 1.44-.95 2.3v.25zm-8 4.75V8.75h-.41c-.65 0-1.19.5-1.25 1.15l-.66 8c-.06.72.51 1.35 1.24 1.35h11.66c.73 0 1.3-.63 1.24-1.35l-.66-8a1.26 1.26 0 0 0-1.25-1.15h-.41V12c0 .41-.34.75-.75.75s-.75-.34-.75-.75V8.75h-6.5V12c0 .41-.34.75-.75.75s-.75-.34-.75-.75zm0-5c0-1.26.5-2.47 1.39-3.36A4.753 4.753 0 0 1 16.75 7v.25h.41c1.43 0 2.62 1.1 2.74 2.52l.67 8c.13 1.6-1.13 2.98-2.74 2.98H6.17c-1.61 0-2.87-1.38-2.74-2.98l.67-8a2.753 2.753 0 0 1 2.74-2.52h.41z' %3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(0);
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}

#header.hidden {
    transform: translateY(-100%);
}

.empty_photo {
	display: block;
}

.empty_photo:before {
			position: absolute;
			display: block;
			content: '';
			width: 100%;
			height: 100%;
			background: #f7f8fa url("data:image/svg+xml,%3Csvg width='60px' height='60px' fill='%23e1e4ef' viewBox='0 0 384 384' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m336 0h-288c-26.472656 0-48 21.527344-48 48v288c0 26.472656 21.527344 48 48 48h288c26.472656 0 48-21.527344 48-48v-288c0-26.472656-21.527344-48-48-48zm-288 32h288c8.824219 0 16 7.175781 16 16v113.375l-52.6875-52.6875c-6.25-6.246094-16.375-6.246094-22.625 0l-112.6875 112.6875-40.6875-40.6875c-6.25-6.246094-16.375-6.246094-22.625 0l-68.6875 68.6875v-201.375c0-8.824219 7.175781-16 16-16zm288 320h-288c-8.824219 0-16-7.175781-16-16v-41.375l80-80 92.6875 92.679688c3.128906 3.136718 7.214844 4.695312 11.3125 4.695312s8.183594-1.558594 11.3125-4.6875c6.246094-6.25 6.246094-16.375 0-22.625l-40.6875-40.6875 101.375-101.367188 64 64v129.367188c0 8.824219-7.175781 16-16 16zm0 0'/%3E%3Cpath d='m128 96c0 17.671875-14.328125 32-32 32s-32-14.328125-32-32 14.328125-32 32-32 32 14.328125 32 32zm0 0'/%3E%3C/svg%3E") center no-repeat;
		}


.wl-desc {
	font-size: 17px;
	max-width: 600px;
	margin-bottom: 4em;
	line-height: 1.25;
	/*font-weight: 500;*/
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 998;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.auth-panel {
    position: fixed;
    top: 0;
    right: -400px;
    width: 350px;
    height: 100%;
    background-color: white;
    z-index: 999;
    padding: 20px;
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
    transition: right 0.3s ease;
    overflow-y: auto;
}

.close-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
}

.auth-back-btn {
    position: absolute;
    top: 15px;
    left: 15px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
}

/* Когда панель открыта */
.auth-panel.active {
    right: 0;
}

.overlay.active {
    opacity: 1;
    visibility: visible;
}

input#phone {
	width: 100%;
	box-sizing: border-box;
	font-size: 22px;
	/*border: 1px solid #d3d3d3;*/
	background: #f5f5f5;
	padding: 23px;
	border: 0;
	border-radius: 12px;
	/*padding: 10px 15px;*/
}

	input#phone:focus {
		border-color: var(--color-two);
	}

.iti {
	width: 100%;
}

.iti__selected-dial-code {
	font-size: 21px;
	font-family: Arial;
}

.iti__selected-country-primary {
	padding: 15px;
}

.auth-title {
	font-size: 21px;
	font-weight: 600;
	margin-bottom: 1em;
	margin-top: 3em;
}

.sendcode {
	width: 100%;
	border-radius: 4px;
	font-size: 16px;
	font-weight: 500;
	padding: .85em;
}

.auth-btn {
	margin-top: 1em;
}

.auth-docs {
	margin: 1em 0;
	color: #555;
	font-size: 13px;
}

.auth-info {
	margin-bottom: 1em;
	line-height: 1.25;
}

#authcode {
	font-size: 30px;
	text-align: center;
}

  .modern-input-container {
    padding: 15px;
    background: #f5f5f5;
    border-radius: 12px;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }
  
  #authcode {
    font-size: 24px;
    width: 100px;
    text-align: center;
    border: none;
    background: transparent;
    letter-spacing: 5px;
    /*color: #2c3e50;*/
  }
  
  #authcode::placeholder {
    color: #bdc3c7;
    letter-spacing: 5px;
  }
  
  #authcode:focus {
    outline: none;
  }

  #authcode:disabled {
  	color: #888;
  }

input#authcode::-webkit-outer-spin-button,
input#authcode::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.call_type {
    color: #888;
    margin: 1em 0;
}

.last4 {
    border: 1px solid #b50000;
    border-radius: 5px;
    padding: .15em;
}

.auth-result, .auth-step2 {
	display: none;
}

.btn {
	background-color: var(--color-two) !important;
}

	.btn:hover {
		background-color: var(--color-four);
	}

.auth-panel .btn {
	border-radius: 12px;
	padding: 1em;
	font-size: 17px;
}

.sub-info {
	font-size: .8em;
	color: #95908b;
	margin-top: .5em;
	box-sizing: border-box;
	display: block;
}

  .subscribe-form input {
    width: 100%;
    padding: 12px;
    margin-bottom: 10px;
    border: 1px solid #555352;
    border-radius: 5px;
    font-size: 16px;
    background-color: var(--color-four);
    color: var(--color-one);
  }
  .subscribe-form button {
    width: 100%;
    padding: 12px;
    background-color: var(--color-four);
    border: 1px solid #555352;
    color: var(--color-one);
    border-radius: 5px;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s;
  }
  .subscribe-form button:hover {
    background: var(--color-two);
    border-color: var(--color-two);
    color: var(--color-one);
  }

  /* Стили подменю */
.submenu {

  /* Сначала скрываем */
  /*visibility: hidden;*/
  /*opacity: 0;*/
  transform: translateY(-10px);
  
  /* Настройки анимации */
  transition: 
    visibility 0.3s,
    opacity 0.3s,
    transform 0.3s;

  position: absolute;
  top: 100%;
  left: 0;
  background: #444;
  min-width: 200px;
  list-style: none;
  padding: 20px;
  margin: 0;
  background-color: rgba(0,0,0,0.9);

  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: .75em;
}

.submenu li {
	white-space: nowrap;
}

.submenu ol {
	margin-left: 10px;
	display: flex;
	flex-direction: column;
	gap: .75em;
	margin-top: .75em;
}

.header .submenu a {
	color: #F9EFE6;
}

	.header .submenu a:hover {
		color: #F4CC75;
	}

.has-submenu {
	position: relative;
}

.submenu {
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.45s, transform 0.45s;
}

/* Показываем подменю при наведении */
.has-submenu:hover > .submenu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto; /* Возвращаем взаимодействие */
}

.breadcrumbs, .breadcrumbs a {
	font-size: 14px;
	color: #555;
}

.breadcrumbs {
	margin-bottom: 2em;
}

/* выбор валюты */

        /* Стили для выпадающего списка валют */
        .currency-selector {
            position: relative;
            display: inline-block;
			padding: 0 25px 0 5px;
			font-weight: 600;
			font-size: 14px;
			cursor: pointer;
        }
        
        .currency-dropdown {
            position: absolute;
            background-color: rgba(0,0,0,.9);
            padding: 10px 0;
            color: #f9efe6;
            z-index: 1000;
            min-width: 180px;
            
            /* Начальное состояние - скрыто */
            visibility: hidden;
            opacity: 0;
            transform: translateY(-10px);
            transition: all 0.3s ease;
            pointer-events: none;
        }
        
        /* Состояние при наведении */
        .currency-selector:hover .currency-dropdown:not(.force-hidden) {
            visibility: visible;
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }
        
        .force-hidden {
            visibility: hidden !important;
            opacity: 0 !important;
            transform: translateY(-10px) !important;
            pointer-events: none !important;
        }
        
        /* Классы для разных направлений */
        .dropdown-bottom-right {
            top: 100%;
            left: 0;
            /*margin-top: 5px;*/
        }
        
        .dropdown-bottom-left {
            top: 100%;
            right: 0;
            /*margin-top: 5px;*/
        }
        
        .dropdown-top-right {
            bottom: 100%;
            left: 0;
            /*margin-bottom: 5px;*/
        }
        
        .dropdown-top-left {
            bottom: 100%;
            right: 0;
            /*margin-bottom: 5px;*/
        }
        
        .currency-option {
            padding: 10px 20px;
            cursor: pointer;
            display: flex;
            align-items: center;
            transition: background-color 0.2s;
        }
        
        .currency-option:hover {
            /*background-color: #f5f5f5;*/
            color: #F4CC75;
        }
        
        .currency-info {
            display: flex;
            flex-direction: column;
        }
        
        .currency-name {
            font-size: 12px;
            /*color: #666;*/
            margin-top: 2px;
        }
        
        .arrow-down {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            width: 0; 
            height: 0; 
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-top: 5px solid #333;
            transition: transform 0.3s;
        }
        
        /* Анимация стрелки при открытии */
        .currency-selector:hover .arrow-down {
            transform: translateY(-50%) rotate(180deg);
        }



.breadcrumbs {
    padding-bottom: .5em;
	font-size: 13px;
    color: #555;
}

.breadcrumbs__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

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

.breadcrumbs__item:not(:last-child)::after {
    content: '/';
    margin: 0 8px;
    /*color: #999;*/
}

.breadcrumbs__link {
    /*color: #3498db;*/
    text-decoration: none;
    transition: color 0.2s;
}

.breadcrumbs__link:hover {

}

.breadcrumbs__current {

}

        .hero-section {
            position: relative;
            height: calc(100vh - 85px);
            width: 100%;
            overflow: hidden;
            display: flex;
            color: #fff;
        }

        .background-video {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 0;
        }

        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.35);
            z-index: 1;
        }

        .hero-content {
            max-width: 800px;
            padding: 3em;
            z-index: 2;
        }

        .hero-title {
            font-size: 3rem;
        }

.catalog, .wishlist {
	margin-bottom: 3em;
}

.catalog h1 {
    font-weight: 600;
    font-size: 30px;
    margin: 0;
}

.catalog-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 2em;
}

.catalog .items, .wishlist .items {
	display: grid;
	grid-template-columns: repeat(5, minmax(195px, 1fr));
	row-gap: 3em;
	column-gap: 2em;
	width: 100%;
}

.wishlist .items {
	/*text-align: center;*/
}

.product-card {
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.product-card > * {
  flex: 0 0 auto; /* Запрещаем растягивание элементов */
}

.product-card .product-info {
  flex: 1; /* Разрешаем растягиваться только контенту */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.product-card .product-info h3 {
	margin-bottom: .5em;
}

.product-card .add_fav {
	position: absolute;
	top: .5em;
	right: .5em;
	z-index: 10;
	width: 30px;
	height: 30px;
	border: 0;
	background: transparent url("data:image/svg+xml,%3Csvg width='20' height='20' fill='%23beada7' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 682.667 682.667' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cdefs%3E%3CclipPath id='a' clipPathUnits='userSpaceOnUse'%3E%3Cpath d='M0 512h512V0H0Z' fill='%23beada7' opacity='1' data-original='%23beada7'%3E%3C/path%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' transform='matrix(1.33333 0 0 -1.33333 0 682.667)'%3E%3Cpath d='M0 0s28.801 100 120 100c71.04 0 116-57.332 116-125.252C236-119.187 142.336-181.387 0-300-142.335-181.387-236-119.187-236-25.252-236 42.668-191.04 100-120 100-28.8 100 0 0 0 0Z' style='stroke-width:40;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1' transform='translate(255.975 356.036)' fill='none' stroke='%23beada7' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-dasharray='none' stroke-opacity='' data-original='%23000000'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;
}

	.product-card .add_fav:hover {
		background-color: transparent !important;
		border-color: transparent !important;
		background: var(--color-two) url("data:image/svg+xml,%3Csvg width='20' height='20' fill='%23fff' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 682.667 682.667' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cdefs%3E%3CclipPath id='a' clipPathUnits='userSpaceOnUse'%3E%3Cpath d='M0 512h512V0H0Z' fill='%23000000' opacity='1' data-original='%23000000'%3E%3C/path%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' transform='matrix(1.33333 0 0 -1.33333 0 682.667)'%3E%3Cpath d='M0 0s28.801 100 120 100c71.04 0 116-57.332 116-125.252C236-119.187 142.336-181.387 0-300-142.335-181.387-236-119.187-236-25.252-236 42.668-191.04 100-120 100-28.8 100 0 0 0 0Z' style='stroke-width:40;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1' transform='translate(255.975 356.036)' fill='%23beada7' stroke='%23beada7' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-dasharray='none' stroke-opacity='' %3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;
	}

	.product-card .add_fav.active {
		background-color: transparent !important;
		border-color: transparent !important;
		background: var(--color-two) url("data:image/svg+xml,%3Csvg width='20' height='20' fill='%23fff' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 682.667 682.667' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cdefs%3E%3CclipPath id='a' clipPathUnits='userSpaceOnUse'%3E%3Cpath d='M0 512h512V0H0Z' fill='%23000000' opacity='1' data-original='%23000000'%3E%3C/path%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' transform='matrix(1.33333 0 0 -1.33333 0 682.667)'%3E%3Cpath d='M0 0s28.801 100 120 100c71.04 0 116-57.332 116-125.252C236-119.187 142.336-181.387 0-300-142.335-181.387-236-119.187-236-25.252-236 42.668-191.04 100-120 100-28.8 100 0 0 0 0Z' style='stroke-width:40;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1' transform='translate(255.975 356.036)' fill='%23f80e4b' stroke='%23f80e4b' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-dasharray='none' stroke-opacity='' %3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;
	}

/* Средние экраны - 3 колонки */
@media (max-width: 1023px) {
  .catalog .items, .wishlist .items {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Мобильные - 2 колонки */
@media (max-width: 767px) {
  .catalog .items, .wishlist .items {
    grid-template-columns: repeat(2, 1fr);
  }

  .product-second {
  	padding: 0 20px;
  }

  .hero-title {
  	font-size: 2em;
  }

  .hero-content {
  	padding: 2em;
  }

}

.mc-image {
	min-height: 400px;
	background-position: center;
	background-size: cover;
}

.product-image {
	position: relative;
	width: 100%;
	padding-top: 100%;
}

	.product-image.v135 {
		padding-top: 135%;
	}

.slider-dots {
	position: absolute;
	bottom: 10px;
	right: 10px;
	display: flex;
	gap: 4px;
	z-index: 10;
}

.dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.3);
	cursor: pointer;
	transition: all 0.3s ease;
}

.dot.active {
	background: var(--color-two);
	transform: scale(1.2);
}

.product-image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	border-radius: 15px;
}

.product-image .main-image {
	opacity: 1;
}

.product-info, .product-info h3 {
	font-size: 15px;
	font-weight: 400;
}

.catalog .product-info {
	/*text-align: center;*/
}

.catalog .product-info .price {
	font-weight: 500;
}

.prod-list .price, .items .price {
	display: inline-flex;
	width: fit-content;
	background-color: #f5f5f5;
	border-radius: 30px;
	padding: 5px 30px 5px 15px;
	font-size: 14px;
	font-weight: 600;
	background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' fill='%23888' xmlns='http://www.w3.org/2000/svg' viewBox='1 4.012295246124268 21.999786376953125 15.999992370605469'%3E%3Cg%3E%3Cpath d='m22.707 11.293-7-7a1 1 0 0 0-1.414 1.414L19.586 11H2a1 1 0 0 0 0 2h17.586l-5.293 5.293a1 1 0 1 0 1.414 1.414l7-7a1 1 0 0 0 0-1.414z' %3E%3C/path%3E%3C/g%3E%3C/svg%3E");
	background-position: center right 10px;
	background-repeat: no-repeat;
	cursor: pointer;
}

.main-collection {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 3em 0;
	min-height: 400px;
	color: #fff;
	display: flex;
}

.main-collection a {
	border: 1px solid #fff;
	padding: 1em 2em;
	font-size: 1.15em;
	color: #fff;
	box-sizing: border-box;
	display: inline-flex;
	border-radius: 5px;
	transition: all 0.3s ease;
	font-weight: 500;
}

	.main-collection a:hover {
		color: #fff;
		background-color: var(--color-two);
		border-color: var(--color-two);
	}

.main-collection .col-info {
	display: flex;
	flex-direction: column;
	gap: 1em;
}

.main-collection h2 {
	font-size: 5em;
	font-weight: 500;
	margin-bottom: .15em;
	text-transform: uppercase;
	text-shadow: 2px 2px 25px rgba(64,64,64,.35);
}

.sup-title {
	font-size: 1.25em;
	text-shadow: 1px 1px 15px rgba(64,64,64,.35);
}

.sub-title {
	font-weight: 500;
	font-size: 1.5em;
	text-shadow: 1px 1px 15px rgba(64,64,64,.35);
}

.main-collection .container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.main-cats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3vw;
    padding: 5vw;
}

.mci-image {
	background-position: center;
	background-size: cover;
	padding-top: 100%;
	transform: translateY(0);
	transition: transform 0.25s ease;
}

	.mci-image:hover {
		transform: translateY(-.5em);
	}

.mci-name {
	margin-top: 1em;
}

.sense {
	background-color: #383838;
	color: #fff;
	padding: 5vw 3vw;
}

.sense .container, .main-custom .container {
	display: flex;
	gap: 6vw;
	/*align-items: center;*/
}

.sense-title, .mc-title {
	font-size: 2em;
	width: 39%;
}

.sense-text, .mc-text {
	width: 61%;
	line-height: 1.5;
	font-size: 1.15em;
}

.main-custom .container {
	padding: 5vw 3vw;
}






.notifications-container {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 9999;
  max-width: 300px;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.notification {
  position: relative;
  padding: 15px 20px;
  border-radius: 8px;
  color: white;
  font-size: 14px;
  opacity: 0;
  transform: translateX(120%);
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  display: flex;
  align-items: center;
  gap: 12px;
}

.notification.show {
  opacity: 1;
  transform: translateX(0);
}

.notification::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 4px;
  background: rgba(255,255,255,0.3);
  width: 100%;
  border-radius: 0 0 8px 8px;
}

.notification.success {
  background: #4CAF50;
}

.notification.error {
  background: #F44336;
}

.notification.warning {
  background: #FF9800;
}

.notification.info {
  background: #2196F3;
}

.notification-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.notification-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 16px;
  height: 16px;
  opacity: 0.7;
  cursor: pointer;
  transition: opacity 0.2s;
}

.notification-close:hover {
  opacity: 1;
}

.notification-close::before,
.notification-close::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 2px;
  background: white;
  top: 50%;
  left: 0;
}

.notification-close::before {
  transform: rotate(45deg);
}

.notification-close::after {
  transform: rotate(-45deg);
}

.title-price {
	display: flex;
	justify-content: space-between;
	margin-top: 1.5em;
	margin-bottom: 1em;
	/*font-size: 1.45em;*/
	font-weight: 500;
}

.title-price h1 {
	font-size: 1.55em;
	margin: 0;
	padding: 0;
	font-weight: 600;
}

.pi-container .price {
	font-size: 2em;
	font-weight: 700;
	margin-bottom: .75em;
}

.product-info .sku {
	color: #888;
	margin-bottom: 1em;
}

.cart_btn {
	margin-bottom: 1em;
	display: flex;
	gap: 1em;
}

.add_fav {
	width: 60px;
	display: block;
	border-radius: 18px;
	border: 1px solid #e0e0e0;
	background: transparent url("data:image/svg+xml,%3Csvg width='20' height='20' fill='%23000000' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 682.667 682.667' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cdefs%3E%3CclipPath id='a' clipPathUnits='userSpaceOnUse'%3E%3Cpath d='M0 512h512V0H0Z' fill='%23000000' opacity='1' data-original='%23000000'%3E%3C/path%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' transform='matrix(1.33333 0 0 -1.33333 0 682.667)'%3E%3Cpath d='M0 0s28.801 100 120 100c71.04 0 116-57.332 116-125.252C236-119.187 142.336-181.387 0-300-142.335-181.387-236-119.187-236-25.252-236 42.668-191.04 100-120 100-28.8 100 0 0 0 0Z' style='stroke-width:40;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1' transform='translate(255.975 356.036)' fill='none' stroke='%23000000' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-dasharray='none' stroke-opacity='' data-original='%23000000'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;
	transition: all 0.3s;
	cursor: pointer;
}

	.add_fav:hover {
		background-color: #ffb300;
		border-color: #ffb300;
		background: #ffb300 url("data:image/svg+xml,%3Csvg width='20' height='20' fill='%23fff' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 682.667 682.667' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cdefs%3E%3CclipPath id='a' clipPathUnits='userSpaceOnUse'%3E%3Cpath d='M0 512h512V0H0Z' fill='%23000000' opacity='1' data-original='%23000000'%3E%3C/path%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' transform='matrix(1.33333 0 0 -1.33333 0 682.667)'%3E%3Cpath d='M0 0s28.801 100 120 100c71.04 0 116-57.332 116-125.252C236-119.187 142.336-181.387 0-300-142.335-181.387-236-119.187-236-25.252-236 42.668-191.04 100-120 100-28.8 100 0 0 0 0Z' style='stroke-width:40;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1' transform='translate(255.975 356.036)' fill='none' stroke='%23fff' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-dasharray='none' stroke-opacity='' %3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;
	}

    .add_fav.active {
        background-color: #b43084;
        border-color: #b43084;
        background: #b43084 url("data:image/svg+xml,%3Csvg width='20' height='20' fill='%23fff' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 682.667 682.667' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cdefs%3E%3CclipPath id='a' clipPathUnits='userSpaceOnUse'%3E%3Cpath d='M0 512h512V0H0Z' fill='%23000000' opacity='1' data-original='%23000000'%3E%3C/path%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' transform='matrix(1.33333 0 0 -1.33333 0 682.667)'%3E%3Cpath d='M0 0s28.801 100 120 100c71.04 0 116-57.332 116-125.252C236-119.187 142.336-181.387 0-300-142.335-181.387-236-119.187-236-25.252-236 42.668-191.04 100-120 100-28.8 100 0 0 0 0Z'  transform='translate(255.975 356.036)' fill='%23fff' stroke='%23fff' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-dasharray='none' stroke-opacity='' %3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;
    }

.cart_add_cart {
	display: block;
    width: 100%;
    padding: 16px;
    background-color: var(--color-four);
    color: #fff;
    border-radius: 18px;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s;
    text-align: center;
	box-sizing: border-box;
	font-weight: 500;
	user-select: none;
}

	.cart_add_cart:hover {
		background: #b43084;
	}

.add_cart_ico {
	display: inline;
	background: transparent url("data:image/svg+xml,%3Csvg width='20' height='20' fill='%23fff' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 24 24' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M15.25 7.25V7c0-.86-.34-1.69-.95-2.3s-1.44-.95-2.3-.95-1.69.34-2.3.95-.95 1.44-.95 2.3v.25zm-8 4.75V8.75h-.41c-.65 0-1.19.5-1.25 1.15l-.66 8c-.06.72.51 1.35 1.24 1.35h11.66c.73 0 1.3-.63 1.24-1.35l-.66-8a1.26 1.26 0 0 0-1.25-1.15h-.41V12c0 .41-.34.75-.75.75s-.75-.34-.75-.75V8.75h-6.5V12c0 .41-.34.75-.75.75s-.75-.34-.75-.75zm0-5c0-1.26.5-2.47 1.39-3.36A4.753 4.753 0 0 1 16.75 7v.25h.41c1.43 0 2.62 1.1 2.74 2.52l.67 8c.13 1.6-1.13 2.98-2.74 2.98H6.17c-1.61 0-2.87-1.38-2.74-2.98l.67-8a2.753 2.753 0 0 1 2.74-2.52h.41z' %3E%3C/path%3E%3C/g%3E%3C/svg%3E") no-repeat center left;
	padding-left: 30px;
}

.variant-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 15px 0;
}

.variant-selector input[type="radio"] {
    display: none;
}

.variant-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
    font-weight: 600;
    font-size: 1.15em;
}

.variant-selector input[type="radio"]:checked + .variant-label {
    background-color: #90b932;
    border-color: #90b932;
    color: #fff;
}

.variant-label:hover {
    border-color: #90b932;
}

.product-item {
	margin-bottom: 4em;
}

.product-main {
	display: flex;
	gap: 2em;
}

.product-images, .product-info {
	flex: 1 0 100px; /* flex-grow: 1, flex-shrink: 0, flex-basis: 100px */
}

.product-images img {
	max-width: 100%;
}

.product-info {
	line-height: 1.5;
	/*font-size: 1.1em;*/
	/*padding: 0 2em;*/
	box-sizing: border-box;
}

.product-info a {
	color: #444;
}

.product-info a:hover {
	color: #000;
}

.pi-container {
	max-width: 550px;
	margin: 0 auto;
}

.product-info h2 {
	font-weight: 600;
	font-size: 1.15em;
}


        /* Контейнер сортировки */
        .sort-wrapper {
            position: relative;
            display: inline-flex;
            flex-direction: column;
        }
        
        /* Кнопка выбора сортировки */
        .sort-trigger {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 10px 16px;
            /*background: #ffffff;*/
            /*border: 1px solid #d2d2d7;*/
            border-radius: 8px;
            cursor: pointer;
            transition: all 0.2s ease;
            /*box-shadow: 0 1px 2px rgba(0,0,0,0.05);*/
            white-space: nowrap;

            border: 0;
            background-color: transparent;
        }
        
        .sort-trigger:hover {
            background: #f8f8f8;
            /*border-color: #a2a2a7;*/
        }
        
        .sort-trigger.active {
            border-color: var(--color-two);
            /*box-shadow: 0 0 0 3px rgba(0, 125, 250, 0.1);*/
        }
        
        .sort-label {
            font-size: 18px;
            font-weight: 500;
        }
        
        .sort-icon {
            width: 16px;
            height: 16px;
            transition: transform 0.2s ease;
            color: #636366;
        }
        
        /* Выпадающий список - базовые стили */
        .sort-dropdown {
            position: absolute;
            min-width: 220px;
            background: #ffffff;
            border-radius: 8px;
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
            opacity: 0;
            visibility: hidden;
            transform: translateY(-8px);
            transition: all 0.2s ease;
            z-index: 100;
            /*border: 1px solid #e5e5ea;*/
            padding: 6px 0;
        }
        
        /* Варианты позиционирования */
        .sort-dropdown.dropdown-bottom-right {
            top: calc(100% + 6px);
            left: 0;
        }
        
        .sort-dropdown.dropdown-bottom-left {
            top: calc(100% + 6px);
            right: 0;
        }
        
        .sort-dropdown.dropdown-top-right {
            bottom: calc(100% + 6px);
            left: 0;
        }
        
        .sort-dropdown.dropdown-top-left {
            bottom: calc(100% + 6px);
            right: 0;
        }
        
        .sort-trigger.active + .sort-dropdown {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }
        
        /* Элементы списка */
        .sort-option {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 10px 16px;
            cursor: pointer;
            transition: all 0.1s ease;
            white-space: nowrap;
        }
        
        .sort-option:hover {
            background: #f5f5f7;
        }
        
        .sort-option.active {
            background: #f0f0f5;
        }
        
        .sort-option.active .option-icon,
        .sort-option.active .option-label {
            color: var(--color-two);
            font-weight: 500;
        }
        
        .option-icon {
            width: 16px;
            height: 16px;
            color: #636366;
            flex-shrink: 0;
        }
        
        .option-label {
            font-size: 14px;
            /*color: #1d1d1f;*/
        }
        
        /* Анимация выбора */
        @keyframes option-selected {
            0% { background-color: transparent; }
            50% { background-color: rgba(0, 125, 250, 0.1); }
            100% { background-color: transparent; }
        }
        
        .sort-option.selected {
            animation: option-selected 0.4s ease;
        }

/* Базовые стили контейнера */
.form-container {
  position: relative;
  overflow: hidden;
  transition: height 0.5s ease;
}

/* Общие стили для формы и сообщения */
.subscribe-form form,
.subscribe-success {
  transition: all 0.5s ease;
}

/* Анимация исчезновения формы */
.subscribe-form form.hiding, .sub-info.hiding {
  opacity: 0;
  /*height: 0;*/
  /*transform: translateY(-10px) scale(0.98);*/
}
.sub-info.hiding {
	/*height: 0;*/
	opacity: 0;
	overflow: hidden;
}

/* Стили сообщения */
.subscribe-success {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  opacity: 0;
  transform: translateY(15px);
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.subscribe-success p {
	line-height: 1.5;
}

/* Анимация появления сообщения */
.subscribe-success.showing {
  opacity: 1;
  transform: translateY(0);
}

/* Иконка успеха */
.success-icon {
  width: 32px;
  height: 32px;
  margin: 0 auto;
  color: #4CAF50;
  animation: bounceIn 0.6s;
}

@keyframes bounceIn {
  0% { transform: scale(0); opacity: 0; }
  60% { transform: scale(1.1); opacity: 1; }
  100% { transform: scale(1); }
}








:root {
  --primary-color: #4a6bff;
  --primary-hover: #3a5bef;
  --error-color: #ff4444;
  --success-color: #00c851;
  --text-color: #333;
  --text-light: #666;
  --border-color: #e0e0e0;
  --bg-light: #f9f9f9;
  --shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  --transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  --color-one: #F9EFE6;
  --color-two: #A57664;
  --color-three: #F4CC75;
  --color-four: #383838;
  --color-five: #5F4441;
  /* Custom viewport height for mobile Safari */
  --vh: 1vh;
}

/* Анимации */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideIn {
  from { transform: translateX(20px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

/* Основные стили */
.cart-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: var(--transition);
}

.cart-overlay.active {
  opacity: 1;
  pointer-events: auto;
  animation: fadeIn 0.3s ease;
}

.cart-panel {
  position: fixed;
  top: 0;
  right: -400px;
  width: 100%;
  max-width: 380px;
  height: calc(var(--vh, 1vh) * 100);
  background: #fff;
  box-shadow: var(--shadow);
  transition: right 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  z-index: 1000;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.cart-panel.active {
  right: 0;
}

.cart-header {
  padding: 20px;
  border-bottom: 1px solid var(--border-color);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--bg-light);
  height: 85px;
	box-sizing: border-box;
}

.cart-header h3 {
  margin: 0;
  font-size: 1.2rem;
  color: var(--text-color);
  display: flex;
  align-items: center;
  gap: 8px;
}

/*.items-count {
  font-size: 0.9rem;
  color: var(--text-light);
  font-weight: normal;
}*/

.close-cart {
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--text-light);
  transition: var(--transition);
  padding: 5px;
  line-height: 1;
}

.close-cart:hover {
  color: var(--error-color);
  transform: scale(1.1);
}

.cart-body {
  flex: 1;
  overflow-y: auto;
  padding: 0 20px;
  background: #fff;
}

.empty-cart-message {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  text-align: center;
  padding: 20px;
  animation: fadeIn 0.5s ease;
  box-sizing: border-box;
}

.empty-cart-message svg {
  margin-bottom: 20px;
}

.empty-cart-message p {
  color: var(--text-light);
  margin-bottom: 20px;
  font-size: 1.1rem;
}

.continue-shopping {
  background: var(--primary-color);
  color: white;
  border: none;
  padding: 12px 24px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 500;
  transition: var(--transition);
}

.continue-shopping:hover {
  background: var(--primary-hover);
  transform: translateY(-2px);
}

.cart-items {
  /*display: none;*/
  padding: 10px 0;
}

.cart-item {
  display: flex;
  margin-bottom: 15px;
  padding: 15px 0;
  border-bottom: 1px solid var(--border-color);
  /*animation: slideIn 0.3s ease forwards;*/
  position: relative;
}

.cart-item:last-child {
  border-bottom: none;
}

.cart-item .item-price {
	display: none;
}

.item-image {
  width: 80px;
  height: 80px;
  margin-right: 15px;
  flex-shrink: 0;
  border-radius: 8px;
  overflow: hidden;
  background: var(--bg-light);
}

.item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.item-details {
  flex-grow: 1;
  min-width: 0;
}

.item-details h4 {
  margin: 0 0 5px 0;
  font-size: 0.95rem;
  color: var(--text-color);
  /*white-space: nowrap;*/
  /*overflow: hidden;*/
  /*text-overflow: ellipsis;*/
}

.item-price, .item-total {
  font-size: 0.85rem;
  color: var(--text-light);
}

.item-total {
  font-weight: 600;
  color: var(--text-color);
  margin-top: 5px;
}

.item-controls {
  display: flex;
  align-items: center;
  margin-top: 10px;
}

.item-controls button {
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--border-color);
  background: #fff;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  /*transition: var(--transition);*/
}

.item-controls button:hover {
  background: var(--bg-light);
}

.item-controls button:active {
  transform: scale(0.95);
}

.item-controls input {
  width: 40px;
  height: 28px;
  text-align: center;
  border: 1px solid var(--border-color);
  margin: 0 5px;
  border-radius: 4px;
  font-size: 0.9rem;
}

.remove-item {
  margin-left: 10px;
  color: var(--error-color);
  background: none !important;
  border: none !important;
  width: auto !important;
}

.remove-item svg {
  transition: var(--transition);
}

.remove-item:hover svg {
  transform: scale(1.1);
}

.cart-footer {
  padding: 20px;
  border-top: 1px solid var(--border-color);
  background: var(--bg-light);
}

.cart-summary {
  margin-bottom: 15px;
}

.cart-total {
  font-weight: 600;
  font-size: 1.1rem;
  display: flex;
  justify-content: space-between;
}

.checkout-btn {
  width: 100%;
  padding: 14px;
  background: var(--color-four);
  color: white;
  border: none;
  border-radius: 6px;
  font-weight: 500;
  font-size: 1rem;
  cursor: pointer;
  transition: var(--transition);
  margin-bottom: 15px;
}

.checkout-btn:hover {
  background: var(--color-two);
}

.checkout-btn:active {
  transform: translateY(0);
}

.item-params {
    font-size: .85em;
    font-weight: 500;
    margin-top: .5em;
    color: #888;
}

.bonus-spent {
	text-align: right;
	color: green;
	margin-top: .5em;
}

#delivery-address {
	text-align: right;
}

/* Адаптивность */
@media (max-width: 480px) {
  .cart-panel {
    max-width: 100%;
  }
  
  .item-image {
    width: 70px;
    height: 70px;
  }
  
  .item-controls {
    flex-wrap: wrap;
  }
  
  .remove-item {
/*    margin-left: 0;
    margin-top: 8px;
    width: 100% !important;
    justify-content: flex-start;*/
  }
}

/* Микро-взаимодействия */
.cart-item {
  /*transition: var(--transition);*/
}

.cart-item.removing {
  /*transform: translateX(100%);*/
  opacity: 0;
}

/* Убираем стрелки у input[type=number] */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

.page-item {
	margin-bottom: 3em;
	font-size: 1.1em;
}

.page-item h1 {
	font-weight: 600;
	font-size: 1.75em;
	line-height: 1.25;
}

.page-item .container {
        max-width: 900px;
}

.page-img {
        margin: 1em 0;
        text-align: center;
}

.page-img img {
        max-width: 100%;
        border-radius: 20px;
}

.p_block {
	margin: 1em;
	line-height: 1.5;
}

.p_image img {
	max-width: 100%;
}

.container.streched {
	max-width: 100%;
	padding-right: 0;
	padding-left: 0;
}

.p_caption {
	opacity: .8;
	margin-top: .5em;
	text-align: center;
}

.p_header h2 {
	font-weight: 500;
	margin-top: 1em;
}

.journal .container {
    max-width: 900px;
    margin-bottom: 5em;
    margin-top: 2em;
}

.journal h1 {
    font-weight: 600;
    font-size: 30px;
    line-height: 1.25;
    text-align: center;
}

.j-img, .j-info {
	flex: 1; /* Равная ширина */
	min-width: 0; /* Для корректного переноса текста */
}

.j-img {
	flex: 0 0 33%;
}

.j-info {
	flex: 1;
}

.j-img img {
	/*width: 100%;*/
	max-width: 100%;
	border-radius: 20px;
}

.journal .items {
	display: flex;
	flex-direction: column;
	gap: 5em;
}

.journal-list a {
	display: flex;
	flex-direction: row;
	gap: 3em;
	color: #333;
}

.journal-list h2 {
	font-weight: 600;
	line-height: 1.35;
}

.journal-list .j-desc {
	line-height: 1.5;
}


.profile-container {
    max-width: 800px;
}

.profile-header {
    text-align: center;
    padding: 20px 0;
    border-bottom: 1px solid #eee;
}

.username {
    margin: 5px 0;
    font-size: 24px;
}

.user-email, .user-phone {
    margin: 5px 0;
    /*color: #666;*/
    font-weight: 500;
}

.edit-btn {
	display: inline-block;
    cursor: pointer;
    margin-top: 10px;
}

.edit-btn:hover {

}

/* Секции профиля */
.profile-section {
    padding: 20px 0;
    background-color: #fff;
    padding: 2em;
    border-radius: 4px;
    margin-bottom: 3em;
}

.profile-section h2 {
    margin-top: 0;
    font-size: 20px;
    font-weight: 600;
}

.orders-list, .wishlist-empty {
    text-align: center;
}

.orders-list {
	display: flex;
	flex-direction: column;
	gap: 2em;
}

.empty-orders {
    color: #888;
}

.catalog-link {
    display: inline-block;
    margin-top: 10px;
    text-decoration: none;
}

.catalog-link:hover {
}

/* Футер */
.profile-footer {
    text-align: center;
    padding: 20px 0 0;
    margin-bottom: 3em;
}

.logout-btn {
    /*background: #dc3545;*/
    /*color: white;*/
    /*border: none;*/
    /*padding: 8px 16px;*/
    /*border-radius: 5px;*/
    cursor: pointer;
}

.logout-btn:hover {
    /*background: #c82333;*/
}

/**/

/* Стили для карточек заказов */
.order-card {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 15px;
    /*margin-bottom: 20px;*/
    background: #fff;
}

.order-card .product-info {
	text-align: left;
}

.order-card .order-details {
	background-color: #f5f5f5;
	border-radius: 5px;
	padding: 10px;
	display: flex;
	flex-direction: column;
}

.order-details .detail-row {
	display: flex;
	flex-direction: row;
	gap: 1em;
    width: 100%;
    justify-content: space-between;
}

.order-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    flex-wrap: wrap;
    gap: 10px;
}

.order-id {
    font-weight: bold;
}

.order-date {
    color: #666;
}

.order-status {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 14px;
}

.order-status.completed {
    background: #d4edda;
    color: #155724;
}

.order-status.cancelled {
    background: #f8d7da;
    color: #721c24;
}

.payment-status {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 14px;
    background: #f5f5f5;
    color: #555;
}

.payment-status.succeeded {
    background: #4CAF50;
    color: #fff;
}

.order-products {
    margin-bottom: 15px;
}

.product {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 10px 0;
    border-bottom: 1px solid #f5f5f5;
}

.product:last-child {
    border-bottom: none;
}

.product .product-image {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 4px;
    padding-top: 0;
}

.product-name {
    margin: 0;
    font-size: 16px;
}

.product-price {
    margin: 5px 0 0;
    color: #666;
}

.order-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}

.order-total-profile {
    /*font-weight: bold;*/
    font-size: 16px;
    font-weight: 600;
}

.order-repeat {
    background: #f8f9fa;
    border: 1px solid #ddd;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
}

.order-repeat:hover {
    background: #e2e6ea;
}

/* Стили для избранного */
.wishlist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 20px;
}

.wishlist-item {
    position: relative;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 15px;
    text-align: center;
    background: #fff;
}

.wishlist-image {
    width: 100%;
    height: 150px;
    object-fit: contain;
    margin-bottom: 10px;
}

.wishlist-name {
    margin: 10px 0;
    font-size: 16px;
}

.wishlist-price {
    font-weight: bold;
    margin: 10px 0;
}

.wishlist-add-to-cart {
    width: 100%;
    background: #007bff;
    color: white;
    border: none;
    padding: 8px;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
}

.wishlist-add-to-cart:hover {
    background: #0056b3;
}

.wishlist-remove {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #f8f9fa;
    border: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 12px;
}

.wishlist-remove:hover {
    background: #dc3545;
    color: white;
}

.page-item, .cl-desc {
	font-weight: normal;
}

.company {
    display: flex;
    flex-direction: row;
    gap: 3em;
    margin-bottom: 1.5em;
    line-height: 1.5;
}

.markets, .phones {
    background-color: #f5f5f5;
    border-radius: 30px;
    padding: 2em;
    flex: 1;
}

.mainphone {
    font-size: 25px;
    font-weight: 500;
    display: inline-flex;
}

.marketlinks {
    margin-top: 1em;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 2em;
    /*margin-bottom: 1.5em;*/
}

	.marketlinks a:hover {
		transform: translateY(-5px);
	}

.wb_link img {
    max-width: 120px;
}

.ozon_link img {
    width: 100%;
    max-width: 75px;
}

.ym_link img {
    width: 100%;
    max-width: 120px;
    transform: translateY(3px);
}

.ali_link img {
    width: 100%;
    max-width: 80px;
}

.terms {
    /*margin-top: 1em;*/
    /*font-size: .85em;*/
    display: flex;
    flex-direction: row;
    gap: 1.5em;
}

.terms a {
    color: #888;
}

    .terms a:hover {
        color: #555;
    }

.phones-top {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.phones-top img {
    width: 30px;
}

.social {
    display: inline-flex;
    flex-direction: row;
    gap: 1em;
}

.social a {
    display: inline-flex;
}

.phones {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1em;
}

.foot-bottom {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: 2em;
	font-size: 14px;
	color: #888;
	padding: 0 30px;
}

.foot-bottom a {
	color: #888;
}

.foot-bottom a:hover {
	color: #b43084;
}

.fb-left, .fb-right {
	display: inline-flex;
	flex-direction: column;
	/*justify-content: flex-end;*/
	gap: 1em;
}

.fb-right {
	text-align: right;
}

.vk_link {
	position: relative;
}

	.vk_link:after {
		content: '*';
		position: absolute;
		top: -5px;
		right: -5px;
		color: #444;
	}

		.tooltip-link {
            position: relative;
            cursor: pointer;
        }

        .tooltip-text {
            visibility: hidden;
            width: 140px;
            background-color: #444;
            color: #fff;
            text-align: center;
            border-radius: 4px;
            padding: 6px;
            position: absolute;
            z-index: 10;
            bottom: 125%;
            left: 50%;
            transform: translateX(-50%);
            opacity: 0;
            transition: opacity 0.3s, visibility 0.3s;
            font-size: 11px;
        }

        .tooltip-text::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #444 transparent transparent transparent;
        }

        .tooltip-link:hover .tooltip-text {
            visibility: visible;
            opacity: 1;
        }

        .tooltip-link.active .tooltip-text {
            visibility: visible;
            opacity: 1;
        }

/* Стили модального окна */
.modal-profile {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    justify-content: center;
    align-items: center;
}

.modal-content {
    background: white;
    padding: 20px;
    border-radius: 8px;
    width: 90%;
    max-width: 500px;
    position: relative;
}

.close-btn {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 24px;
    cursor: pointer;
}

.form-group {
    margin-bottom: 15px;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.form-group input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 16px;
}

.save-btn {
    background: #007bff;
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    font-size: 16px;
}

.save-btn:hover {
    background: #0056b3;
}

/* Адаптивность модалки */
@media (max-width: 600px) {
    .modal-content {
        width: 95%;
        padding: 15px;
    }
}

        .success-container {
            max-width: 1000px;
            /*margin: 40px auto;*/
            /*padding: 30px;*/
            /*background: white;*/
            /*border-radius: 8px;*/
            /*box-shadow: 0 2px 10px rgba(0,0,0,0.1);*/
        }
        
        .success-header {
            text-align: center;
            margin-bottom: 30px;
        }
        
        .success-icon {
            color: var(--primary-color);
            font-size: 60px;
            margin-bottom: 20px;
        }
        
        .success-container h1 {
            margin: 2em 0 10px;
            font-size: 28px;
            font-weight: 600;
        }
                
        .success-order-section h2 {
            font-size: 18px;
            margin-bottom: 0;
            padding-bottom: 8px;
            border-bottom: 1px solid var(--border-color);
            font-weight: 600;
        }

.order-summary {
  display: flex;
  flex-direction: row;
  align-items: flex-start; /* важно — чтобы не растягивались по высоте */
  gap: 3em;
  margin-bottom: 3em;
}

.success-order-section {
  width: 50%; /* или 48% если есть gap */
  box-sizing: border-box;
  padding: 20px;
  background: #f5f5f5;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
}

.success-detail-row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}



.payment_status {
	border: 2px solid #65c168;
	color: #4CAF50;
	padding: 10px 20px;
	border-radius: 10px;
	font-weight: 600;
	font-size: 18px;
	text-transform: uppercase;
	user-select: none;
	display: none;
}

	.payment_status.succeeded {
		display: inline-flex;
	}


.order-details {
	display: flex;
	gap: .5em;
}

.detail-row {
    display: contents; /* Дочерние элементы становятся частью grid */
}

.detail-label {
    font-weight: bold;
    white-space: nowrap; /* Предотвращает перенос текста */
}
        
        .order-items {
            margin-top: 20px;
        }
        
        .order-item {
            display: flex;
            justify-content: space-between;
            padding: 10px 0;
            /*border-bottom: 1px solid var(--border-color);*/
        }
        
        .item-name {
            flex: 2;
        }
        
        .item-qty {
            flex: 1;
            text-align: center;
        }
        
        .item-price {
            flex: 1;
            text-align: right;
        }
        
        .order-total {
            margin-top: 20px;
            padding-top: 15px;
            border-top: 2px solid var(--border-color);
            font-size: 18px;
            font-weight: bold;
            text-align: right;
        }
        
        .actions {
            display: flex;
            justify-content: center;
            gap: 15px;
            margin-top: 30px;
            flex-wrap: wrap;
        }
        
        .btn {
            padding: 12px 24px;
            border-radius: 4px;
            text-decoration: none;
            font-weight: 500;
            transition: all 0.3s;
        }
        
        .btn-primary {
            background-color: var(--primary-color);
            color: white;
        }
        
        .btn-primary:hover {
            background-color: var(--secondary-color);
        }
        
        .btn-secondary {
            background-color: white;
            color: var(--primary-color);
            border: 1px solid var(--primary-color);
        }
        
        .btn-secondary:hover {
            background-color: var(--light-gray);
        }
        
        .status-timeline {
            margin-top: 30px;
            padding-top: 20px;
            border-top: 1px solid var(--border-color);
        }
        
        .timeline-item {
            display: flex;
            margin-bottom: 15px;
        }
        
        .timeline-icon {
            width: 24px;
            height: 24px;
            background-color: var(--primary-color);
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 15px;
        }
        
        .timeline-content {
            flex: 1;
        }
        
        .timeline-date {
            font-size: 12px;
            color: #666;
            margin-top: 3px;
        }
        
        @media (max-width: 600px) {
            .success-container {
                /*padding: 20px;*/
                /*margin: 20px 10px;*/
            }
            
            .order-section {
                min-width: 100%;
            }
            
            .actions {
                flex-direction: column;
            }
            
            .btn {
                width: 100%;
                text-align: center;
            }
        }



.products-header {
    font-weight: 800;
    text-align: center;
    font-size: 40px;
}

.products {
    display: flex;
    gap: 2em;
    padding: 2em 0 3em;
}

.categories {
    width: 260px;
    position: relative;
    font-weight: 500;
}

.categories ul {
    position: sticky;
    top: 1em;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.categories ul li ol {
    padding-left: 1.5em;
    margin-top: 1em;
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.categories ul li ol li {
    position: relative;
}

.categories ul li ol li:before {
    content: '·';
    position: absolute;
    left: -15px;
    top: -10px;
    font-size: 2em;
    color: #eee;
}

.categories ul li.list_item_cat:has(a.active) > a:first-child {
  font-weight: 600;
  /*color: #b43084;*/
    color: #fff !important;
    background-color: #90b932;
    border-radius: 12px;
}

.categories a {
    font-size: 18px;
    padding: 5px 10px;
    background-color: #f5f5f5;
    border-radius: 12px;
    color: #444;
    white-space: nowrap;
}

.categories a:hover {
    color: #b43084;
}

.categories a.active {
    /*color: #b43084;*/
    color: #fff !important;
    background-color: #b43084 !important;
    border-radius: 12px;
    font-weight: 600;
    position: relative;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%23fff' x='0' y='0' viewBox='0 0 24 24' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M24 12c0-2.3-.1-4.4-.5-5.6-.4-1.4-.9-2.7-2.1-3.9C19.9 1.1 18.6.7 16.6.3 15.2.1 13.5 0 12.5 0h-.9c-1.1 0-2.7.1-4.2.3-2 .4-3.4.9-4.8 2.2C1.3 3.7.9 5 .5 6.4.1 7.6 0 9.7 0 12s.1 4.4.5 5.6c.4 1.4.9 2.7 2.1 3.9 1.5 1.4 2.8 1.8 4.8 2.2C9 24 11 24 12 24c1 0 3 0 4.7-.3 1.9-.4 3.3-.8 4.8-2.2 1.2-1.1 1.7-2.4 2.1-3.9.3-1.2.4-3.3.4-5.6z' opacity='1' data-original='%23379df1'%3E%3C/path%3E%3Cpath fill='%23b43084' d='M9 6.7c-.4.4-.4 1 0 1.4l3.9 3.9L9 15.9c-.4.4-.4 1 0 1.4s1 .4 1.4 0l4.6-4.6c.4-.4.4-1 0-1.4l-4.6-4.6c-.4-.4-1-.4-1.4 0z' opacity='1' data-original='%23b43084'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
    background-position: center right 5px;
    background-repeat: no-repeat;
    padding-right: 35px;
}



.prod-list {
    width: 100%;
    position: relative;
    display: grid;
    /*grid-template-columns: repeat(5, 1fr);*/
    grid-template-columns: repeat(5, minmax(195px, 1fr));
    row-gap: 3em;
    column-gap: 2em;
    height: auto; /* Изначально auto, будет меняться через JS */
    overflow: hidden; /* Скрываем контент, выходящий за пределы */
    transition: max-height 1s ease; /* Плавный переход для max-height */
}

.prod-list:before {
    content: ' ';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.85);
    background-image: url("data:image/svg+xml,%3Csvg class='text-secondary' fill='%23b53384' width='64' height='64' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='5' y='16' width='2' height='2' rx='2'%3E%3Canimate attributeName='x' dur='1360ms' values='6;10;10;16;16' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='y' dur='1360ms' values='16;5;5;16;16' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='height' dur='680ms' values='2;4;4;2;2' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='width' dur='680ms' values='2;4;4;2;2' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3C/rect%3E%3Crect x='11' y='6' width='2' height='2' rx='2'%3E%3Canimate attributeName='x' dur='1360ms' values='11;16;16;6;6' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='y' dur='1360ms' values='7;15;15;16;16' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='height' dur='680ms' values='2;4;4;2;2' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='width' dur='680ms' values='2;4;4;2;2' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3C/rect%3E%3Crect x='17' y='16' width='2' height='2' rx='2'%3E%3Canimate attributeName='x' dur='1360ms' values='16;4;4;11;11' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1; 0 0.8 0.8 1; 0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='y' dur='1360ms' values='16;15;15;7;7' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1; 0 0.8 0.8 1; 0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='height' dur='680ms' values='2;4;4;2;2' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3Canimate attributeName='width' dur='680ms' values='2;4;4;2;2' keyTimes='0;0.25;0.5;0.75;1' repeatCount='indefinite' keySplines='0 0.8 0.8 1'%3E%3C/animate%3E%3C/rect%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    z-index: 1;
    opacity: 0; /* Изначально прозрачный */
    transition: opacity 0.3s ease; /* Плавный переход для opacity */
    pointer-events: none;
}

.prod-list.loading:before {
    opacity: 1; /* Полная видимость при добавлении класса loading */
}

@media (max-width: 1020px) {

	.success-container h1 {
		font-size: 20px;
	}

	.order-section {
		box-sizing: border-box;
	}

	.cart-panel {
		max-width: 100%;
		right: -100%; /* Теперь панель полностью скрывается */
	}
  
	.cart-panel.active {
		right: 0;
	}

	.head-right, .head-menu {
		display: none;
	}

	.menu-foot {
		flex-wrap: wrap;
	}

	.menu-foot-col {
		width: 30%;
	}

	.menu-foot-col.subscribe {
		width: 100%;
	}

	.main-collection h2 {
		font-size: 3em;
	}

	.sub-title {
		font-size: 1.25em;
	}

	.main-collection a {
		padding: .65em .85em;
		font-size: 1em;
	}

	.foot-bottom, .foot-bottom .social, .foot-bottom .terms {
		flex-direction: column;
	}

	.foot-bottom .social {
		margin-bottom: 2em;
	}

	.foot-bottom .terms {
		margin-bottom: 0;
	}

	.fb-left {
		align-items: flex-start;
		margin-bottom: 2em;
	}

	.sense {
		padding: 2em 0;
	}

	.main-custom .container {
		padding: 2em;
	}

	.sense .container, .main-custom .container {
		flex-direction: column;
	}

	.sense-title, .mc-title, .sense-text, .mc-text {
		width: 100%;
	}

	.sense-text, .mc-text {
		font-size: 1em;
	}

	.main-custom .container .mc-title, .foot-bottom .social {
		order: 0;
	}

	.sense-text, .mc-text, .foot-bottom .terms {
		order: 1;
	}

	.sense-title, .mc-title {
		font-size: 1.5em;
	}

	.foot-logo {
		padding: 0 70px;
	}

	.page-item h1 {
		font-size: 1.25em;
	}

	.p_block {
		margin-left: 0;
		margin-right: 0;
	}

	.page-item, .cl-desc {
		font-size: 1em;
		font-weight: normal;
	}

	.p_header h2 {
		font-size: 1.1em;
		font-weight: 500;
	}

       .catalog h1, .wishlist h1 {
               font-size: 1.25em;
       }

	.sort-label {
		font-size: 14px;
	}

	.col-list h2 {
		font-size: 1.25em;
	}

	.col-title h2 {
		font-size: 1.25em;
		margin-bottom: 1em;
	}

}


@media (max-width: 660px) {

	.menu-foot-col {
		width: 100%;
	}

	.main-cats {
		grid-template-columns: repeat(2, 1fr);
	}

    .main-collection h2 {
        font-size: 2.3em;
    }

    .sub-title {
        font-size: 1.15em;
    }

    .journal-list a {
    	flex-direction: column;
    	gap: 1em;
    }

    .journal-list h2 {
    	font-size: 1.25em;
    }

    .j-desc {
    	font-size: 1em;
    }

    .col-list {
    	flex-direction: column;
    	gap: 1em;
    	margin-bottom: 4em;
    }

    .cl-photo {
    	width: 100%;
    }

	.order-details {
		grid-template-columns: auto;
	}

	.detail-row {
		display: block;
	}

}









.head-left, .head-right {
    display: flex;
    align-items: center;
}

.head-profile {
    display: flex;
    align-items: center;
}

.head-profile > * {
    /*margin: 0 10px;*/
}

.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 30px;
    height: 21px;
    /*margin-left: 20px;*/
    cursor: pointer;
}

.mobile-menu-toggle span {
    display: block;
    height: 3px;
    width: 100%;
    background: #000;
    transition: all 0.3s ease;
}

body.menu-open {
    overflow: hidden;
    position: relative;
    height: 100%;
}

.mob-menu {
    position: fixed;
    top: 80px; /* Высота вашего хедера */
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    background: #fff;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    overflow-y: auto; /* Разрешаем скролл внутри меню */
    -webkit-overflow-scrolling: touch; /* Плавный скролл на iOS */
}

.mob-menu.active {
    transform: translateX(0);
}

/* Стили для мобильных устройств */
@media (max-width: 992px) {

    body.menu-open::before {
        display: block;
    }
    
    .mob-menu {
        position: static;
        transform: none;
        overflow-y: visible;
    }

	.logo {
		display: none;
	}

    .mobile-menu-toggle {
        display: flex;
    }
    
    .mob-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff;
        flex-direction: column;
        margin: 0;
        z-index: 1000;
    }
    
    .mob-menu.active {
        display: flex;
         gap: .5em; 
        overflow-y: scroll;
        z-index: 1000;
        position: fixed;
        top: 85px;
        bottom: 0;
        left: 0;
        right: 0;
        padding-bottom: 2em;
    }
    
    .mob-menu > * {
        /*margin: 10px 0;*/
        padding: .5em 1.5em;
        font-weight: 500;
    }
    
    .mob-menu .has-submenu .submenu {
        display: block;
        position: relative;
        opacity: 1;
		transform: translateY(0);
		top: auto;
		left: auto;
		background-color: transparent;
		padding: 0;
		margin-top: .5em;
    }

    .mob-menu .submenu ol, .mob-menu .has-submenu .submenu {
	    margin-left: 10px;
	    display: flex;
	    flex-direction: column;
	    gap: .75em;
	    margin-top: .75em;
    }
    
    .mob-menu .head-right {
        margin-left: auto;
    }
}

@media (max-width: 576px) {
    .logo img {
        max-height: 30px;
    }
    
    .head-profile > * {
        margin: 0 5px;
    }
    
.langs img {
        width: 25px;
        height: auto;
    }
}

.hidden-img {
    position: absolute;
    left: -9999px;
}

.prod-info-answer.visible {
    display: block;
}

.kbzhu {
    background-color: #f5f5f5;
    border-radius: 12px;
    padding: 1.5em;
    margin-top: 1em;
    max-width: 350px;
}

.kbzhu-title {
    margin-bottom: .5em;
    color: #888;
}

.kbzhu-table {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 1em;
}

.kbzhu-table > div {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.kbzhu-num {
    font-size: 1.25em;
    font-weight: 600;
}

.specs-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.specs-item {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
}

.specs-item:last-child {
  border-bottom: none;
}

.specs-name {
  /*color: #666;*/
  /*font-weight: 500;*/
}

.specs-value {
  /*color: #333;*/
  /*font-weight: 500;*/
}

.prod-info-item {
    border-bottom: 1px solid #eee;
}

.prod-info-item:last-child {
	border-bottom: 0;
}

.prod-info-container {
    max-width: 800px;
    margin: 0 auto;
    font-family: Arial, sans-serif;
    will-change: transform; /* Подсказка браузеру для оптимизации */
}

.prod-info-question {
    padding: 15px 20px 15px 0;
    cursor: pointer;
    position: relative;
    font-weight: 600;
    font-size: 18px;
    backface-visibility: hidden; /* Улучшаем рендеринг анимаций */
}

.prod-info-question::after {
    content: '+';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 26px;
    font-weight: 500;
    transition: transform 0.15s ease; /* Укороченная анимация */
}

.prod-info-item.active .prod-info-question::after {
    content: '–';
}

.prod-info-answer {
    display: none;
    padding: 0 0 20px 0;
    transform: translateZ(0); /* Аппаратное ускорение */
}

/* Добавляем в конец CSS */
.faq-item:first-child .faq-answer {
    display: block;
}
.faq-item:first-child .faq-question::after {
    content: '–';
}

.product-second {
    margin: 4em 0;
    /*padding-right: 2em;*/
    /*padding-left: 2em;*/
}

.product-second h2 {
    font-weight: 600;
}

.product-slider-container {
    display: flex;
    gap: 15px;
    width: 100%;
    position: relative;
}

.thumbnails-container {
	overflow-y: scroll;
	scroll-behavior: smooth;
}


/* Скрыть scrollbar для миниатюр */
.thumbnails-container::-webkit-scrollbar {
    display: none;
}
.thumbnails-container {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

@media (max-width: 768px) {

	.product-main {
		flex-direction: column;
	}

	.product-item .container {
		padding: 0;
	}

}






.main-slider .slide, .main-slider img {
    pointer-events: auto;
}

        .product-slider-container {
            display: flex;
            height: auto;
        }

        .main-slider {
            width: 85%;
            height: auto;
            overflow: hidden;
            position: relative;
            user-select: none;
            transition: height 0.3s ease; /* Плавное изменение высоты */
        }

        .slider-wrapper {
            display: flex;
            flex-direction: column;
            width: 100%;
            height: auto;
            transition: transform 0.3s ease;
        }

        .slide {
            width: 100%;
            height: auto;
            flex-shrink: 0;
        }

        .slide img {
            width: 100%;
            height: auto;
            object-fit: contain;
            display: block;
            max-height: 70vw;
            border-radius: 5px;
        }

        .thumbnails-container {
            width: 15%;
            height: auto;
            /*max-height: 500px;*/
            overflow-y: auto;
            position: relative;
            scrollbar-width: none;
        }

        .thumbnails-container::-webkit-scrollbar {
            display: none;
        }

        .thumbnails {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 1em;
        }

        .thumb-item {
            width: 100%;
            /*height: 100px;*/
            /*margin-bottom: 10px;*/
            cursor: pointer;
            opacity: 0.6;
            border-radius: 5px;
            overflow: hidden;
        }

        .thumb-item.active {
            opacity: 1;
            /*border: 2px solid #000;*/
        }

        .thumb-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }


        .lightbox {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: white;
            z-index: 1000;
            flex-direction: column;
            align-items: center;
        }

        .lightbox.active {
            display: flex;
        }

        .lightbox-img-container {
            width: 100%;
            flex-grow: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
            max-height: calc(100vh - 80px);
            overflow: hidden;
        }

        .lightbox-img-wrapper {
            display: flex;
            flex-direction: row;
            width: 100%;
            height: 100%;
            transition: transform 0.3s ease;
        }

        .lightbox-img-slide {
            width: 100%;
            flex-shrink: 0;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .lightbox img {
            width: 100%;
            max-height: calc(100vh - 80px);
            object-fit: contain;
            transition: transform 0.3s ease;
            cursor: default;
        }

        .lightbox img:hover {
            cursor: zoom-in;
        }

        .lightbox img.zoomed {
            transform: scale(1.5);
            cursor: zoom-out;
        }

        .lightbox img.zoomed:hover {
            cursor: zoom-out;
        }

        .lightbox img.zoomed {
            transition: none; /* Отключаем transition для зума при перетаскивании */
            transform: scale(2);
            cursor: move;
        }

        .lightbox img.zoomed:hover {
            cursor: move;
        }

        .lightbox-close {
            position: absolute;
            top: 20px;
            right: 20px;
            color: black;
            font-size: 30px;
            cursor: pointer;
            z-index: 1001;
        }

        .lightbox-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            color: black;
            font-size: 40px;
            cursor: pointer;
            user-select: none;
            z-index: 1001;
        }

        .lightbox-nav.prev {
            left: 20px;
        }

        .lightbox-nav.next {
            right: 20px;
        }

        .lightbox-thumbnails {
            display: flex;
            justify-content: center;
            padding: 10px;
            background: white;
            width: 100%;
            position: absolute;
            bottom: 0;
            z-index: 1001;
            box-sizing: border-box;
        }

        .lightbox-thumbnails .thumb-item {
            width: 60px;
            height: 60px;
            margin: 0 5px;
        }

        body.no-scroll {
            overflow: hidden;
        }

        @media (max-width: 768px) {
            .product-slider-container {
                flex-direction: column;
                height: auto;
            }

            .main-slider {
                width: 100%;
                height: auto;
            }

            .slider-wrapper {
                flex-direction: row;
                max-height: 70vw;
            }

            .slide {
                width: 100%;
                height: auto;
            }

            .slide img {
                border-radius: 0;
            }

            .thumbnails-container {
                width: 100%;
                height: auto;
                max-height: none;
                display: flex;
                justify-content: center;
                /*padding: 10px 0;*/
                overflow-y: visible;
            }

            .thumbnails {
                display: flex;
                position: static;
                width: auto;
                flex-direction: row;
                gap: 0;
            }

            .thumb-item {
                width: 7px;
                height: 7px;
                border-radius: 50%;
                background: #ccc;
                margin: 0 5px;
                opacity: 1;
            }

            .thumb-item img {
                display: none;
            }

            .thumb-item.active {
                background: #000;
                border: none;
            }

            .title-price {
                margin-top: 0;
            }

            .breadcrumbs {
                margin-bottom: 1em;
            }

            .lightbox-thumbnails .thumb-item {
                width: 7px;
                height: 7px;
            }

            .lightbox-img-container {
                /*max-height: calc(100vh - 60px);*/
                max-height: 100vh;
            }

            .lightbox img {
                /*max-height: calc(100vh - 60px);*/
                max-height: 100vh;
            }

        }

.profile-inner {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 3em;
}

.profile-left, .profile-right {
    flex: 1;
}

.profile-left {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1em;
}

.discount-card {
  width: 340px; /* примерная длина */
  aspect-ratio: 1.586; /* реальные пропорции кредитки */
  border-radius: 16px;
  background: linear-gradient(135deg, #111, #333);
  color: #fff;
  padding: 20px;
  /*box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);*/
  font-family: 'Segoe UI', sans-serif;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /*align-items: center;*/
  /*justify-content: center;*/
  box-sizing: border-box;
  transition: transform 0.3s;
}
.discount-card:hover {
  /*transform: scale(1.03);*/
}
.card-content {
  width: 100%;
}
.card-title {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 14px;
  color: #bbb;
  margin-bottom: 10px;
}
.user-name {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 6px;
}
.user-balance {
  font-size: 16px;
  margin-bottom: 10px;
}
.user-email,
.user-phone {
  font-size: 14px;
  color: #ccc;
  line-height: 1.4;
}

.team {
	background-color: #f5f5f5;
	border-radius: 30px;
	padding: 2.5em;
	display: flex;
	margin-bottom: 3em;
    height: 100%;
    box-sizing: border-box;
    flex-direction: column;
    gap: 2em;
    justify-content: center;
}

.team-ava {
	background-position: center;
	background-size: cover;
	border: 4px solid #fff;
	border-radius: 100px;
	width: 70px;
	height: 70px;
	background-color: #f5f5f5;
}

.team-list {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.team-item {
	width: 70px;
	height: 70px;
	position: relative;
	margin-left: -10px;
	z-index: 3;
	transition: all 0.2s;
}

	.team-item:hover {
		transform: translateY(-15px);
	}

.team-title {
    font-family: 'Days';
	font-weight: 800;
	font-size: 32px;
}

.green {
	color: #90b932;
}

.violet {
	color: #b43084;
}

.team-caption {
	display: flex;
	flex-direction: column;
	gap: .5em;
	height: 50px;
	font-size: 19px;
	font-weight: 500;
}

.team-job {
	color: #888;
	font-weight: 400;
}

.team-caption {
    transition: opacity 0.3s ease;
    opacity: 0;
    min-height: 30px; /* Чтобы избежать скачков при появлении текста */
}

.team-caption.active {
    opacity: 1;
}

.about {
	display: flex;
	margin-bottom: 3em;
	gap: 3em;
}

.facts-container, .production {
	flex-basis: 50%;
}

.facts-container {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 1.5em;
}

.fact {
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 30px;
	padding: 2em;
	transition: all 0.3s;
}

	.fact:hover {
		transform: translateY(-5px);
		background-color: #90b932;
		border-color: #90b932;
		color: #fff;
	}

	.fact:hover .fact__value {
		color: #fff;
	}

	.fact p {
		margin: 0;
	}

.fact__value {
    font-family: 'Days';
	font-size: 38px;
	font-weight: 800;
	color: #b43084;
	margin-bottom: .35em !important;
	transition: all 0.3s;
}

.fact__description {
	font-size: 19px;
	font-weight: 500;
}

.facts-container, .production {
            flex-basis: 50%; /* Одинаковая ширина */
            flex-grow: 1; /* Позволяет растягиваться */
            box-sizing: border-box;
            min-height: 100%; /* Гарантирует, что блоки растянутся по высоте */
        }
        /* Стили для слайдера */
        .banner-slider {
            max-width: 1416px;
            margin: 0 auto;
            padding: 0 2.5em ;
        }

        .swiper-slide img {
            width: 100%;
            height: auto;
            object-fit: cover;
            border-radius: 30px;
        }

        /* Стили для пагинации */
        .swiper-pagination-bullet {
            background: #fff;
            opacity: 0.7;
        }

        .swiper-pagination-bullet-active {
            background: #007bff;
            opacity: 1;
        }

        /* Стили для кнопок навигации */
        .swiper-button-next,
        .swiper-button-prev {
            color: #fff;
            background: rgba(0, 0, 0, 0.5);
            border-radius: 50%;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .swiper-button-next:after,
        .swiper-button-prev:after {
            font-size: 20px;
        }

        /* Адаптивность */
        @media (max-width: 768px) {
            .banner-slider {
                padding: 10px;
            }

            .swiper-slide img {
                border-radius: 5px;
            }

            .swiper-button-next,
            .swiper-button-prev {
                width: 30px;
                height: 30px;
            }

            .swiper-button-next:after,
            .swiper-button-prev:after {
                font-size: 16px;
            }
        }

.reviews {
    /*background-color: #f5f5f5;*/
    background-color: #333;
    color: #fff;
    padding: 3em 0 0;
    /*margin-bottom: 3em;*/
    border-radius: 50px 50px 0 0;
    position: relative;
}

.reviews:after {
    content: ' ';
    display: block;
    width: 100%;
    height: 50px;
    border-radius: 50px 50px 0 0;
    background-color: #fff;
    margin-top: 3em;
}

.reviews .container {
    display: flex;
    gap: 3em;
}

.rev-title, .rev-list {
    flex-basis: 50%;
}

.rev-title {
    font-weight: 800;
    font-size: 36px;
    position: relative;
    font-family: 'Days';
}

.rev-sticky {
    position: sticky;
    top: 50%;
    margin-bottom: 150px;
}

.blue {
    color: #11b5d7;
}

.yellow {
    color: #ffb300;
}

.red {
    color: #e80c0c;
}

/*.rev-list {
    display: flex;
    flex-direction: column;
    gap: 2em;
    width: calc(50% - 1.5em);
}

.review-item {
    display: flex;
    gap: 1em;
    background: #444;
    padding: 1em;
    border-radius: 20px;
}

.review-ava {
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
}

.review-author {
    font-weight: bold;
}

.review-author span {
    font-weight: normal;
    color: #ccc;
    margin-left: 5px;
}*/

.rev-list {
  column-count: 2;
  column-gap: 30px;
  padding: 10px;
  color: #333;
  font-size: 14px;
}

.review-item {
  display: inline-block;
  width: 100%;
  margin-bottom: 30px;
  background: #f9f9f9;
  border-radius: 30px;
  padding: 25px;
  box-sizing: border-box;
  break-inside: avoid;
}

.review-info {
  overflow: hidden;
}

.review-info .mp img {
    max-height: 14px;
}

    .review-info .mp img.wildberries {
        max-height: 25px;
    }

    .review-info .mp img.yandexmarket {
        max-height: 22px;
    }

    .review-info .mp img.aliexpress {
        max-height: 20px;
    }

.review-author {
  font-weight: 600;
  font-size: 16px;
  margin: 10px 0 15px;
}

.review-author span {
  font-size: 0.9em;
  /*color: #888;*/
  margin-left: 8px;
}

.review-text {
  font-size: 14px;
  line-height: 1.5;
  /*color: #333;*/
}

/* Один столбец на мобильных */
@media (max-width: 768px) {
  .rev-list {
    column-count: 1;
  }
}

.blog {
    margin-bottom: 3em;
    display: flex;
    flex-direction: row;
    gap: 3em;
}

.blog-list {
    flex: 1;
    transition: all 0.3s;
}

    .blog-list:hover {
        transform: translateY(-5px);
    }

.blog-header {
    font-family: 'Days';
    font-weight: 800;
    font-size: 36px;
    position: relative;
    text-align: center;
    margin-bottom: 1em;
}

.blog-img {
    width: 100%;
    padding-top: 75%;
    background-size: cover;
    border-radius: 20px;
}

.blog-title {
    font-weight: 500;
    margin: 1em 0;
}

.blog-desc {
    font-weight: 400;
}

@media (max-width: 767px) {

    .container {
        padding-left: 1em;
        padding-right: 1em;
    }

    .categories {
        display: none;
    }

    .prod-list {
        row-gap: 2em;
        column-gap: 1em;
        grid-template-columns: repeat(2, minmax(135px, 1fr));
    }

    .product-info {
        padding: 0;
    }

    .about {
        flex-direction: column;
        gap: 2em !important;
        margin-bottom: 0 !important;
    }

    .team {
        margin-bottom: 0em;
    }

    .team-list {
        /*display: none !important;*/
    }

    .reviews .container {
        flex-direction: column;
    }

    .rev-sticky {
        margin-bottom: 0 !important;
    }

    .rev-title {
        font-size: 38px;
        padding: 0 1em;
    }

    .reviews:after {
        margin-top: 0;
    }

    .blog-header {
        font-size: 30px;
    }

    .blog {
        flex-direction: column;
    }

    .company {
        flex-direction: column;
        gap: 1em;
    }

    .fb-left, .fb-right {
        align-items: flex-start;
    }

    .fb-left {
        margin-bottom: 1.5em;
    }

    .phones-top {
        display: flex;
        justify-content: center;
        gap: 1em;
        flex-direction: column;
        flex-direction: column-reverse;
    }

    .footer-container {
    	padding: 0;
    }

    .product-item {
    	margin-bottom: 0;
    }

    .product-second {
    	margin: 2em 0;
    }

    .product-info {
    	padding-left: 1em;
    	padding-right: 1em;
    }

    .product-second .product-info {
    	padding: 0;
    }

    .title-price h1 {
    	font-size: 1.25em;
    }

    .variant-label {
		padding: 6px 14px;
		font-size: 1em;
    }

	.pi-container .price {
	    font-size: 1.5em;
	    font-weight: 700;
	    margin-bottom: .5em;
	}

	.catalog-top {
		justify-content: flex-start;
		gap: 1em;
	}

	.profile-inner {
		flex-direction: column;
		gap: 2em;
	}

	.profile-left {
		align-items: center;
	}

	.success-container .order-summary {
		flex-direction: column;
		gap: 1em;
		margin-bottom: 2em;
	}

	.success-order-section {
		width: 100%;
	}

	.marketlinks {
		flex-direction: column;
		align-items: flex-start;
	}

}