/* === 01-layout.css === */
/* ============================================
Layout — змінні, сброси, сітка, утиліти
============================================ */

:root {
	--black: #000000;
	--white: #ffffff;
	--overlay: #000000;
	--overlay-scrim: #00000029;
	--light-gray: #f3f2ed;
	--gray: #bebebe;
	--gray-text: #5c5c5c;
	--gray-text-filter: invert(34%) sepia(29%) saturate(2%) hue-rotate(250deg) brightness(94%) contrast(87%);
	--dark-gray: #5b5b5b;
	--dark: #151515;
	--shadow-soft: #8e8e8e33;
	--shadow-hairline: #1a1a1a14;
	--red: #ff0000;
	--red-filter: invert(24%) sepia(100%) saturate(7449%) hue-rotate(1deg) brightness(92%) contrast(125%);
	--red-hover: #dd1212;
	--gold: #feba26;
	--green: #27ae60; 
	--blue: #3498db; 
	--status-success: var(--green);
	--status-success-bg: #d4edda;
	--status-success-text: #155724;
	--status-success-border: #c3e6cb;
	--status-warning: #f39c12;
	--status-warning-bg: #fff3cd;
	--status-warning-text: #856404;
	--status-danger: #e74c3c;
	--status-danger-bg: #f8d7da;
	--status-danger-text: #721c24;
	--status-danger-border: #f5c6cb;
	--status-info: var(--blue);
	--status-info-bg: #cfe2ff;
	--status-info-text: #084298;
	--status-neutral-bg: #e2e3e5;
	--status-neutral-text: #383d41;
	--primary: #4c4b2f;
	--primary-filter: invert(20%) sepia(69%) saturate(100%) hue-rotate(20deg) brightness(157%) contrast(154%);
	--primary-match: #ffffff;
	--primary-filter-match: brightness(0%) invert(100%);
	--primary-hover: #3c3b24;
	--accent: #4c4b2f;
	--accent-filter: invert(20%) sepia(69%) saturate(100%) hue-rotate(20deg) brightness(157%) contrast(154%);
	--accent-match: #ffffff;
	--border: #e6e6e6;
	--border-strong: #c2c2c2;

	--header-height: 80px;
	--top-bar-height: 0px;
	--container-indent: 40px;
	--blocks-indent: 24px;
	--min-col: 100px;
	--products-in-col: 4;
	--products-indent-h: 40px;
	--products-indent-w: 20px;
	--full-width: 100vw;
	--scroll-bar: 0px;
	/* Нижній край екрана: три плаваючі штуки — липучка покупки, банер cookie і кнопка
	   «нагору». Кожен компонент сам виставляє свою висоту в ці змінні, а ті, що вище в стопці,
	   додають їх до свого bottom — інакше вони лягають одна на одну (#2243) */
	--bottom-bar: 0px;
	--bottom-notice: 0px;
	--side-bar: 0px;
	--blocks-indent-category: 0px;

	--font-family-1: "Manrope";
	--font-family-2: "Cormorant";

	--btn-height: 56px;
	--btn-height-small: 48px;
	--btn-padding: 0 24px;

	--radius-tiny: 0px; 
	--radius-small: 0px;
	--radius-mid: 0px;
	--radius-medium: 0px;
	--radius-large: 0px;
	--radius-max: 100%;
	--radius-pill: 100px;

	--icon-base: 24px;
	--icon-small: 24px;
	--icon-medium: 32px;
	--icon-large: 40px;
	--icon-multiplier: 2.35;
}

@media (min-width: 1921px) {
	:root {
		--full-width: 1920px;
	}
}
@media (max-width: 1680px) {
	:root {
		--header-height: 72px;
		--btn-height: 48px;
		--blocks-indent: 20px;
	}
}
@media (max-width: 1279px) {
	:root {
		--header-height: 48px;
		--top-bar-height: 0px;
		--container-indent: 20px;
		--blocks-indent: 12px;
		--btn-height: 48px;
		--products-in-col: 4;
	}
}
@media (max-width: 1024px) {
	:root {
		--products-in-col: 3;
	}
}
@media (max-width: 768px) {
	:root {
		--products-indent-h: 20px;
		--products-indent-w: 10px;
		--products-in-col: 2;
	}
}

/* @font-face — генерується динамічно через OP_TA_Fonts (wp_head) */

/* Scrollbar - Start */
@media (pointer: fine) {
	:root {
		--scroll-bar: 6px;
	}
	::-webkit-scrollbar {
		width: var(--scroll-bar);
	}
	::-webkit-scrollbar-track {
		background-color: var(--white);
	}
	::-webkit-scrollbar-thumb {
		background: var(--primary);
		border-radius: var(--radius-large);
		border: 0px;
		transition: scrollbar-color 0.5s ease-out;
	}
	::-webkit-scrollbar-thumb:hover {
		background: var(--primary);
	}
	body *::-webkit-scrollbar {
		height: 3px;
		width: 3px;
	}
}
/* Scrollbar - End */

/* Reset - Start */
*,
*:after,
*:before {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html {
	scrollbar-gutter: stable;
}
body {
	position: relative;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: var(--light-gray);
	color: var(--black);
	font-family: var(--font-family-1);
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	box-sizing: border-box;
	-webkit-text-size-adjust: none !important;
	-webkit-tap-highlight-color: transparent;
	cursor: default;
}
main {
	position: relative;
	margin-top: var(--header-height);
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 1920px;
	margin-left: auto;
	margin-right: auto;
	z-index: 1;
}
section {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 0;
	overflow-x: clip;
}
a,
a p {
	color: inherit;
	text-decoration: none;
	cursor: pointer;
	transition: all 0.3s ease;
}
.link {
	transition: all 0.3s ease;
}
.link:hover {
	color: var(--black);
}
.hover-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.underline {
	text-decoration: underline;
}
del {
	color: var(--dark-gray);
}
ins {
	text-decoration: none;
}
strong {
	font-weight: 600;
}
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
figure.wp-block-image {
	max-width: 100%;
}
img {
	display: block;
	max-width: 100%;
	object-fit: cover;
	height: auto;
}
img.icon {
	object-fit: contain;
}
iframe {
	max-width: 100%;
}
/* Reset - End */

/* Container - Start */
.container {
	position: relative;
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: var(--blocks-indent);
	max-width: calc(100% - var(--container-indent));
	width: calc(100% - var(--container-indent));
	margin: 0 auto;
}
.container-full {
	max-width: calc(100% - 0px);
	width: calc(100% - 0px);
	margin: 0 0;
}
.container:where(:not(.container-sidebar)) > *:where(:not([class^="col-"], [class*=" col-"])) {
	grid-column: 1 / -1; 
}
/* Контейнер с сайдбаром - Start */
.container-sidebar {
	grid-template-columns: var(--side-bar) 1fr;
}

/* Вариант с правым сайдбаром */
.container-sidebar:where(.sidebar-right) {
	grid-template-columns: 1fr var(--side-bar, 300px);
}
/* Предустановленные размеры сайдбара */
.container-sidebar[data-sidebar="200"] { --side-bar: 200px; }
.container-sidebar[data-sidebar="250"] { --side-bar: 250px; }
.container-sidebar[data-sidebar="300"] { --side-bar: 300px; }
.container-sidebar[data-sidebar="350"] { --side-bar: 350px; }
.container-sidebar[data-sidebar="400"] { --side-bar: 400px; }

/* Закрепленый сайдбар*/
.container-sidebar .sticky-sidebar {
	position: sticky;
	top: calc(var(--header-height) + 20px);
	max-height: calc(100vh - var(--header-height) - 40px);
	overflow-y: auto;
}
@media (max-width: 1279px) {
	.container-sidebar,
	.container-sidebar.sidebar-right {
		grid-template-columns: 1fr; /* Сайдбар уходит вниз */
	}
}
/* Контейнер с сайдбаром - End */

/* Работа с колонками - Start */
[class^="col-"], [class*=" col-"] {
	display: flex;
	flex-direction: column;
	gap: var(--blocks-indent);
}
.col-90 { grid-column: span 11; }
.col-80 { grid-column: span 10; } 
.col-75 { grid-column: span 9; } 
.col-70 { grid-column: span 8; }  
.col-66 { grid-column: span 8; }
.col-60 { grid-column: span 7; }   
.col-50 { grid-column: span 6; }   
.col-40 { grid-column: span 5; }  
.col-33 { grid-column: span 4; }   
.col-30 { grid-column: span 4; }   
.col-25 { grid-column: span 3; }  
.col-20 { grid-column: span 2; }  
.col-1 { grid-column: span 1; }
.col-2 { grid-column: span 2; }
.col-3 { grid-column: span 3; }
.col-4 { grid-column: span 4; }
.col-5 { grid-column: span 5; }
.col-6 { grid-column: span 6; }
.col-7 { grid-column: span 7; }
.col-8 { grid-column: span 8; }
.col-9 { grid-column: span 9; }
.col-10 { grid-column: span 10; }
.col-11 { grid-column: span 11; }
.col-12 { grid-column: span 12; }

/* Адаптивность */
@media (max-width: 1279px) {
	[class^="col-"], [class*=" col-"] {
		grid-column: span 12;
	}
	.col-90-mob { grid-column: span 11; } 
	.col-80-mob { grid-column: span 10; } 
	.col-75-mob { grid-column: span 9; }  
	.col-70-mob { grid-column: span 8; }  
	.col-66-mob { grid-column: span 8; }   
	.col-60-mob { grid-column: span 7; }  
	.col-50-mob { grid-column: span 6; }   
	.col-40-mob { grid-column: span 5; } 
	.col-33-mob { grid-column: span 4; } 
	.col-30-mob { grid-column: span 4; }
	.col-25-mob { grid-column: span 3; }
	.col-20-mob { grid-column: span 2; } 
	.col-1-mob { grid-column: span 1; }
	.col-2-mob { grid-column: span 2; }
	.col-3-mob { grid-column: span 3; }
	.col-4-mob { grid-column: span 4; }
	.col-5-mob { grid-column: span 5; }
	.col-6-mob { grid-column: span 6; }
	.col-7-mob { grid-column: span 7; }
	.col-8-mob { grid-column: span 8; }
	.col-9-mob { grid-column: span 9; }
	.col-10-mob { grid-column: span 10; }
	.col-11-mob { grid-column: span 11; }
	.col-12-mob { grid-column: span 12; }
}
/* Работа с колонками - End */

.block-with-cols {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--blocks-indent);
	grid-column: 1 / -1;
}
.auto-cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(var(--min-col, 200px), 1fr));
	gap: var(--blocks-indent);
	grid-column: 1 / -1;
}
.auto-cols:where(.no-wrap) {
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	grid-template-columns: none;
}

/* Предустановленные минимальные размеры для .auto-cols */
.auto-cols[data-min="150"] { --min-col: 150px; }
.auto-cols[data-min="200"] { --min-col: 200px; }
.auto-cols[data-min="250"] { --min-col: 250px; }
.auto-cols[data-min="300"] { --min-col: 300px; }
.auto-cols[data-min="350"] { --min-col: 350px; }
.auto-cols[data-min="400"] { --min-col: 400px; }

@media (max-width: 1279px) {
	.auto-cols[data-min="350"] { --min-col: 100%; }
	.auto-cols[data-min="400"] { --min-col: 100%; }	
}

.auto-cols[data-cols="1"] { grid-template-columns: repeat(1, 1fr); }
.auto-cols[data-cols="2"] { grid-template-columns: repeat(2, 1fr); }
.auto-cols[data-cols="3"] { grid-template-columns: repeat(3, 1fr); }
.auto-cols[data-cols="4"] { grid-template-columns: repeat(4, 1fr); }
.auto-cols[data-cols="5"] { grid-template-columns: repeat(5, 1fr); }
.auto-cols[data-cols="6"] { grid-template-columns: repeat(6, 1fr); }

@media (max-width: 1680px) {
	.auto-cols[data-cols-1680="1"] { grid-template-columns: repeat(1, 1fr); }
	.auto-cols[data-cols-1680="2"] { grid-template-columns: repeat(2, 1fr); }
	.auto-cols[data-cols-1680="3"] { grid-template-columns: repeat(3, 1fr); }
	.auto-cols[data-cols-1680="4"] { grid-template-columns: repeat(4, 1fr); }
	.auto-cols[data-cols-1680="5"] { grid-template-columns: repeat(5, 1fr); }
	.auto-cols[data-cols-1680="6"] { grid-template-columns: repeat(6, 1fr); }
}
@media (max-width: 1279px) {
	.auto-cols[data-cols-1279="1"] { grid-template-columns: repeat(1, 1fr); }
	.auto-cols[data-cols-1279="2"] { grid-template-columns: repeat(2, 1fr); }
	.auto-cols[data-cols-1279="3"] { grid-template-columns: repeat(3, 1fr); }
	.auto-cols[data-cols-1279="4"] { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 768px) {
	.auto-cols[data-cols-768="1"] { grid-template-columns: repeat(1, 1fr); }
	.auto-cols[data-cols-768="2"] { grid-template-columns: repeat(2, 1fr); }
	.auto-cols[data-cols-768="3"] { grid-template-columns: repeat(3, 1fr); }
}

.one-column {
	grid-column: 1 / -1;
	display: flex;
	flex-direction: column;
	gap: var(--blocks-indent);
	width: 100%;
	margin: 0 auto;
}
/* Container - End */

/* Gap - Start */
.gap-0 { gap: 0 !important; }
.gap-5 { gap: 5px !important; }
.gap-10 { gap: 10px !important; }
.gap-15 { gap: 15px !important; }
.gap-20 { gap: 20px !important; }
.gap-25 { gap: 25px !important; }
.gap-30 { gap: 30px !important; }
.gap-35 { gap: 35px !important; }
.gap-40 { gap: 40px !important; }
.cols-flush { gap: 0 !important; }

@media (max-width: 1279px) {
	.gap-0-mob { gap: 0 !important; }
	.gap-5-mob { gap: 5px !important; }
	.gap-10-mob { gap: 10px !important; }
	.gap-15-mob { gap: 15px !important; }
	.gap-20-mob { gap: 20px !important; }
	.gap-25-mob { gap: 25px !important; }
	.gap-30-mob { gap: 30px !important; }
	.gap-35-mob { gap: 35px !important; }
	.gap-40-mob { gap: 40px !important; }
}
/* Gap - End */

/* Alignment - Start */
.v-center { align-items: center; }
.v-start { align-items: flex-start; }
.v-end { align-items: flex-end; }
.h-center { justify-content: center; }
.h-start { justify-content: flex-start; }
.h-end { justify-content: flex-end; }

:where(.column, [class^="col-"], [class*=" col-"], .one-column).v-center { justify-content: center; }
:where(.column, [class^="col-"], [class*=" col-"], .one-column).v-start { justify-content: flex-start; }
:where(.column, [class^="col-"], [class*=" col-"], .one-column).v-end { justify-content: flex-end; }
:where(.column, [class^="col-"], [class*=" col-"], .one-column).h-center { align-items: center; }
:where(.column, [class^="col-"], [class*=" col-"], .one-column).h-start { align-items: flex-start; }
:where(.column, [class^="col-"], [class*=" col-"], .one-column).h-end { align-items: flex-end; }

@media (max-width: 1279px) {
	.v-center-mob { align-items: center; }
	.v-start-mob { align-items: flex-start; }
	.v-end-mob { align-items: flex-end; }
	.h-center-mob { justify-content: center; }
	.h-start-mob { justify-content: flex-start; }
	.h-end-mob { justify-content: flex-end; }

	:where(.column, [class^="col-"], [class*=" col-"], .one-column).v-center-mob { justify-content: center; }
	:where(.column, [class^="col-"], [class*=" col-"], .one-column).v-start-mob { justify-content: flex-start; }
	:where(.column, [class^="col-"], [class*=" col-"], .one-column).v-end-mob { justify-content: flex-end; }
	:where(.column, [class^="col-"], [class*=" col-"], .one-column).h-center-mob { align-items: center; }
	:where(.column, [class^="col-"], [class*=" col-"], .one-column).h-start-mob { align-items: flex-start; }
	:where(.column, [class^="col-"], [class*=" col-"], .one-column).h-end-mob { align-items: flex-end; }
}
/* Alignment - End */

/* Utilities - Start */
.items-group {
	display: flex;
	gap: var(--blocks-indent);
}
.wrap {
	flex-wrap: wrap !important;
}
.no-wrap {
	flex-wrap: nowrap !important;
}
.column {
	flex-direction: column !important;
}
.row {
	flex-direction: row !important;
}
.center {
	margin-left: auto !important;
	margin-right: auto !important;
}
.center-text {
	text-align: center;
}
.upp {
	text-transform: uppercase;
}
.relative {
	position: relative!important;
}
.hidden {
	display: none !important;
}
@media (max-width: 1279px) {
	.column-mob {
		flex-direction: column !important;
	}
	.row-mob {
		flex-direction: row !important;
	}
	.wrap-mob {
		flex-wrap: wrap !important;
	}
	.no-wrap-mob {
		flex-wrap: nowrap !important;
	}
	.center-mob {
		margin-left: auto !important;
		margin-right: auto !important;
	}
}
/* Utilities - End */

/* Icon Elements - Start */
.icon-element {
	display: flex;
	justify-content: center;
	align-items: center;
	width: fit-content;
	transition: all 0.3s ease;
}
.icon-element :is(img, .icon-mask) {
	min-width: var(--icon-base); 
	width: var(--icon-base); 
	height: var(--icon-base); 
	object-fit: contain;
	transition: all 0.3s ease;
}
.icon-element:where(.r-small, .r-medium, .r-large, .r-max) {
	min-width: var(--icon-box, calc(var(--icon-base) * var(--icon-multiplier)));
	width: var(--icon-box, calc(var(--icon-base) * var(--icon-multiplier)));
	height: var(--icon-box, calc(var(--icon-base) * var(--icon-multiplier)));	
}
:where(.icon-element, .icon-mask):where(.icon-small) { 
	--icon-base: var(--icon-small);
}
:where(.icon-element, .icon-mask):where(.icon-medium) { 
	--icon-base: var(--icon-medium);
}
:where(.icon-element, .icon-mask):where(.icon-large) { 
	--icon-base: var(--icon-large);
}
.icon-mask {
	display: inline-block;
	flex-shrink: 0;
	width: var(--icon-base);
	height: var(--icon-base);
	background-color: currentColor;
	-webkit-mask: var(--icon) no-repeat center / contain;
	mask: var(--icon) no-repeat center / contain;
	object-position: -9999px -9999px;
	transition: background-color 0.3s ease;
}
.icon-group {
	display: flex;
	align-items: center;
	gap: var(--blocks-indent);
}
.icon-group-content {
	display: flex;
	flex-direction: column;
}
.icon-group-label {
	color: var(--gray);
}
.icon-group-text {
	color: var(--black);
}
/* Icon Elements - End */

/* Border Radius - Start */
.r-tiny {
	border-radius: var(--radius-tiny);
}
.r-small {
	border-radius: var(--radius-small);
}
.r-mid {
	border-radius: var(--radius-mid);
}
.r-medium {
	border-radius: var(--radius-medium);
}
.r-large {
	border-radius: var(--radius-large);
}
.r-max {
	border-radius: var(--radius-max);
}
/* Border Radius - End */

/* Gutenberg - Start */
.wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 0;
}
/* Gutenberg - End */

/* Overlay & Pseudo - Start */
.overlay:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 0;
}
.overlay > * {
	z-index: 1;
}
.overlay:where(.overlay-dark):before {
	background: rgb(0 0 0 / 20%);
}
.before,
.after {
	position: relative;
}
.before::before,
.after::after {
	content: "";
	background: var(--this-background);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/* Overlay & Pseudo - End */

/* Colors - Start */
.primary {
	color: var(--primary);
}
.bg-primary {
	background: var(--primary);
}
.primary-filter {
	filter: var(--primary-filter);
}
.accent {
	color: var(--accent);
}
.bg-accent {
	background: var(--accent);
}
.accent-filter {
	filter: var(--accent-filter);
}
.gray {
	color: var(--gray);
}
.bg-gray {
	background: var(--gray);
}
.light-gray {
	color: var(--light-gray);
}
.bg-light-gray {
	background: var(--light-gray);
}
.dark-gray {
	color: var(--dark-gray);
}
.bg-dark-gray {
	background: var(--dark-gray);
}
.black {
	color: var(--black);
}
.bg-black {
	background: var(--black);
}
.white {
	color: var(--white);
}
.bg-white {
	background: var(--white);
}
.bg-image {
	background: var(--this-background);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
}
/* Colors - End */

/* Visibility - Start */
@media (min-width: 1280px) {
	.mob {
		display: none !important;
	}
}
@media (max-width: 1279px) {
	.pc {
		display: none !important;
	}
}
/* Visibility - End */

/* Accessibility - Start */
:focus:not(:focus-visible) {
	outline: none;
}
:focus-visible {
	outline: 2px solid currentColor !important;
	outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
	html {
		scroll-behavior: auto !important;
	}
}
/* Accessibility - End */

/* Scroll Lock - Start */
body.scroll-lock {
	overflow: hidden !important;
	position: fixed;
	width: 100%;
	top: var(--scroll-position, 0)!important;
}
/* Scroll Lock - End */

/* === 02-text.css === */
/* ============================================
   Text — типографіка, шрифти, списки, меню
   ============================================ */

/* Typography - Start */
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
.wp-block-heading {
	font-family: var(--font-family-2);
	font-weight: 500;
	margin: 0;
}
h1,
.h1,
h2,
.h2 {
	font-size: 56px;
	line-height: 56px;
}
h3,
.h3 {
	font-size: 32px;
	line-height: 32px;
}
h4,
.h4 {
	font-size: 24px;
	line-height: 30px;
}
h5,
.h5 {
	font-size: 20px;
	line-height: 26px;
}
p {
	font-size: 16px;
	line-height: 22px;
	font-weight: 400;
	margin: 0;
}
p.text-up-1 {
	font-size: 18px;
	line-height: 25px;
}
p.text-up-2 {
	font-size: 24px;
	line-height: 36px;
}
p.text-down-1 {
	font-size: 14px;
	line-height: 20px;
}
p.text-down-2 {
	font-size: 12px;
	line-height: 17px;
}
p a {
	word-break: break-all;
}
small {
	font-size: 14px;
	line-height: 20px;
}

@media (max-width: 1680px) {
	h1,
	.h1,
	h2,
	.h2 {
		font-size: 44px;
		line-height: 44px;
	}
	h3,
	.h3 {
		font-size: 24px;
		line-height: 24px;
	}
	p {
		font-size: 14px;
		line-height: 20px;
	}
	p.text-up-1 {
		font-size: 14px;
		line-height: 20px;
	}
	p.text-down-1,
	small {
		font-size: 12px;
		line-height: 17px;
	}
}
@media (max-width: 1279px) {
	h1,
	.h1,
	h2,
	.h2 {
		font-size: 32px;
		line-height: 32px;
	}
	h3,
	.h3 {
		font-size: 24px;
		line-height: 26px;
	}
	p.text-up-2 {
		font-size: 20px;
		line-height: 28px;
	}
}
/* Typography - End */

/* Menu - Start */
:where(ul).menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 16px;
	line-height: 24px;
}
ul.menu#top-bar-menu {
	font-size: 14px;
	line-height: 17px;
}
:where(.menu) > .menu-item {
	display: inline-flex;
	align-items: center;
	padding: 8px 12px;
}
.menu:where(.menu-vertical) {
	flex-direction: column;
	align-items: stretch;
}
:where(.menu.menu-vertical) > .menu-item {
	display: block;
	padding: 8px 0;
}
/* Menu - End */

/* Text Box Lists - Start */
:where(.text-box) ul li,
:where(.text-box) ol li {
	position: relative;
	padding-left: 25px;
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
}

:where(.text-box) ul,
:where(.text-box) ol {
	list-style: none;
	padding: 0;
	margin: 0;
}
:where(.text-box) ol {
	counter-reset: item;
}
:where(.text-box) ul > li:before {
	content: "";
	position: absolute;
	top: 8px;
	left: 10px;
	background: var(--primary);
	width: 6px;
	height: 6px;
	border-radius: var(--radius-max);
	display: flex;
	align-items: center;
	justify-content: center;
}
:where(.text-box) ol > li:before {
	counter-increment: item;
	content: counter(item) ".";
	position: absolute;
	left: 7px;
	top: 0;
	color: var(--primary);
	font-weight: 600;
}
:where(.text-box) ol > li:nth-child(1):before {
	left: 8px;
}
:where(.text-box) ol > li:nth-child(n + 10):before {
	left: -8px;
}
:where(.text-box) :is(p, .h2, .h3, .h4, .h5, h2, h3, h4, h5) + :is(ul, ol) {
	margin-top: calc(var(--blocks-indent) / -4 * 3);
}

:where(.text-box) :is(.h2, .h3, .h4, .h5, h2, h3, h4, h5) + p {
	margin-top: calc(var(--blocks-indent) / -2);
}

@media (max-width: 1680px) {
	:where(.text-box) ul li,
	:where(.text-box) ol li {
		font-size: 14px;
		line-height: 22px;
	}
}
/* Text Box Lists - End */

/* === 03-buttons.css === */
.btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: var(--btn-height);
	width: fit-content;
	min-width: fit-content;
	max-width: 100%;
	margin: 0;
	padding: var(--btn-pad, 0);
	border: var(--btn-border-width, 0) solid var(--btn-border-color, transparent);
	background: var(--btn-bg, transparent);
	font-size: 16px;
	line-height: 22px;
	font-weight: 400;
	transition: all 0.3s ease;
	border-radius: var(--radius-small);
	cursor: pointer;
	user-select: none;
}
.btn span {
	font-family: var(--font-family-1);
	font-weight: 400;
	height: 22px;
	color: var(--btn-color, inherit);
	transition: all 0.3s ease;
}
.btn img {
	height: 24px;
	width: auto;
	object-fit: contain;
	filter: var(--btn-img-filter, none);
	transition: filter 0.3s;
}
.btn:is(:hover, .active) {
	background: var(--btn-hover-bg, var(--btn-bg, transparent));
	border-color: var(--btn-hover-border-color, var(--btn-border-color, transparent));
}
.btn:is(:hover, .active) span {
	color: var(--btn-hover-color, var(--btn-color, inherit));
}
.btn:is(:hover, .active) img {
	filter: var(--btn-hover-img-filter, var(--btn-img-filter, none));
}

/* ================================ */
/* Variants — тільки змінні         */
/* ================================ */

.btn.btn-primary {
	--btn-pad: var(--btn-padding);
	--btn-bg: var(--primary);
	--btn-color: var(--primary-match);
	--btn-hover-bg: var(--primary-hover);
	--btn-hover-color: var(--primary-match);
	--btn-img-filter: var(--primary-filter-match);
}

.btn.btn-accent {
	--btn-pad: var(--btn-padding);
	--btn-bg: var(--accent);
	--btn-color: var(--white);
	--btn-hover-bg: var(--primary-hover);
	--btn-hover-color: var(--primary-match);
	--btn-hover-img-filter: brightness(0) invert(1);
}

.btn.btn-dark {
	--btn-pad: var(--btn-padding);
	--btn-bg: var(--black);
	--btn-color: var(--white);
	--btn-hover-bg: var(--white);
	--btn-hover-color: var(--black);
	--btn-img-filter: brightness(0) invert(1);
	--btn-hover-img-filter: none;
}

.btn.btn-white {
	--btn-pad: var(--btn-padding);
	--btn-bg: var(--white);
	--btn-color: var(--black);
	--btn-hover-bg: var(--black);
	--btn-hover-color: var(--white);
	--btn-hover-img-filter: brightness(0) invert(1);
}

.btn.btn-gray {
	--btn-pad: var(--btn-padding);
	--btn-bg: var(--gray);
	--btn-color: var(--black);
	--btn-hover-bg: var(--primary);
	--btn-hover-color: var(--primary-match);
}

.btn.btn-red {
	--btn-pad: var(--btn-padding);
	--btn-bg: var(--red);
	--btn-color: var(--white);
	--btn-hover-bg: var(--red-hover);
	--btn-hover-color: var(--white);
	--btn-img-filter: brightness(0) invert(1);
}

/* Border Variant */
.btn.btn-border {
	--btn-pad: var(--btn-padding);
	--btn-border-width: 1px;
	--btn-border-color: var(--border-strong);
	--btn-color: var(--black);
	--btn-hover-bg: var(--border);
	--btn-hover-border-color: var(--border-strong);
	--btn-hover-color: var(--black);
}

/* Світла кнопка на фоні light-gray */
.btn.btn-light {
	--btn-pad: var(--btn-padding);
	--btn-bg: var(--light-gray);
	--btn-color: var(--black);
	--btn-hover-bg: var(--border);
	--btn-hover-color: var(--black);
}

/* Border + Primary */
.btn.btn-border.primary {
	--btn-border-color: var(--primary);
	--btn-hover-img-filter: brightness(0);
}

/* Border + Red */
.btn.btn-border.red {
	--btn-border-color: var(--red);
	--btn-color: var(--red);
	--btn-hover-bg: var(--red);
	--btn-hover-border-color: var(--red);
	--btn-hover-color: var(--white);
	--btn-hover-img-filter: var(--red-filter);
}

/* ================================ */
/* Special                          */
/* ================================ */

.btn.btn-circle {
	--btn-border-width: 1px;
	--btn-border-color: var(--border);
	height: 38px;
	width: 38px;
	padding: 9px;
	border-radius: var(--radius-max);
}
.btn:is(.btn-catalog, .btn-sale) {
	font-size: 16px;
	line-height: 16px;
	font-weight: 400;
}
.btn.btn-small {
	height: var(--btn-height-small);
}
.btn.btn-full {
	width: 100%;
	--btn-pad: 0;
}
.btn.btn-50 {
	width: 50%;
	--btn-pad: 0;
}

/* Стани */
.btn.disabled {
	--btn-hover-bg: var(--btn-bg, transparent);
	opacity: 0.4;
	pointer-events: none;
}
.disabled {
	background: var(--gray);
}

@media (max-width: 1680px) {
	.btn {
		font-size: 14px;
		line-height: 20px;
	}
	.btn span {
		height: 20px;
	}
}

/* === 04-helpers.css === */
/* ============================================
   Helpers — cookie, message screen, breadcrumb, no-select
   ============================================ */

/* Cookie - Start */
#cookie-consent {
	position: fixed;
	/* Над липучкою покупки, якщо вона видна */
	transition: bottom 0.3s ease;
	bottom: calc(var(--container-indent) / 3 + var(--bottom-bar));
	right: calc(var(--container-indent) / 2);
	display: flex;
	flex-direction: column;
	gap: var(--blocks-indent);
	width: 500px;
	max-width: calc(100% - var(--container-indent));
	padding: 20px;
	background: var(--white);
	border: 1px solid var(--border);
	border-radius: var(--radius-large);
	box-shadow: 0px 0px 15px 0px var(--shadow-soft);
	z-index: 1000;
}
#cookie-consent a {
	word-break: break-word;	
}
@media (max-width: 1279px) {
	#cookie-consent {
		gap: 10px;
		padding: 12px;
		font-size: 12px;
		line-height: 17px;
	}
	#cookie-consent p {
		font-size: 12px;
		line-height: 17px;
	}
	#cookie-consent .items-group {
		flex-direction: row;
		gap: 8px;
	}
	#cookie-consent .btn {
		flex: 1 1 0;
		height: 40px;
		padding: 0 12px;
		font-size: 12px;
	}
}
/* Cookie - End */

/* Message Screen - Start */
.login-required {
	padding: 120px 0 180px;
}
.message-screen {
	display: flex;
	align-items: center;
}
.message-screen .one-column {
	gap: 32px;
	text-align: center;
}
.message-screen__media {
	width: 224px;
	height: 256px;
	margin-bottom: 16px;
	object-fit: cover;
}
.message-screen__title {
	max-width: 930px;
}
.message-screen__text {
	max-width: 930px;
	font-size: 18px;
	line-height: 25px;
	color: var(--black);
}
.message-screen .items-group {
	gap: 8px;
	margin-top: 8px;
}
.message-screen .items-group .btn {
	width: 360px;
}

@media (min-width: 1280px) and (max-width: 1680px) {
	.message-screen .one-column {
		gap: 24px;
	}
	.message-screen__media {
		width: 174px;
		height: 196px;
		margin-bottom: 24px;
	}
	.message-screen__text {
		font-size: 16px;
		line-height: 22px;
	}
	.message-screen .items-group .btn {
		width: 272px;
	}
}

@media (max-width: 1279px) {
	.login-required {
		padding: 80px 0;
	}
	.message-screen .one-column {
		gap: 24px;
	}
	.message-screen__media {
		width: 132px;
		height: 150px;
	}
	.message-screen__text {
		font-size: 14px;
		line-height: 20px;
	}
	.message-screen .items-group {
		flex-direction: column;
		align-items: center;
		gap: 10px;
		margin-top: 0;
		width: 100%;
	}
	.message-screen .items-group .btn {
		width: 100%;
		max-width: 360px;
	}
}
/* Message Screen - End */

/* Breadcrumb - Start */
.woocommerce-breadcrumb {
	display: flex;
	align-items: center;
	gap: 0;
	font-size: 16px !important;
	line-height: 22px !important;
	padding: 24px calc(var(--container-indent) / 2) 24px calc(var(--container-indent) / 2) !important;
	margin: 0 !important;
	color: var(--gray-text) !important;
	overflow-x: auto;
}
.woocommerce .woocommerce-breadcrumb:before {
	display: none !important;
}
.woocommerce-breadcrumb a {
	color: var(--gray-text) !important;
	white-space: nowrap;
	transition: all 0.3s ease;
}
.woocommerce-breadcrumb a:hover {
	color: var(--black) !important;
	white-space: nowrap;
	transition: all 0.3s ease;
}
.woocommerce-breadcrumb span {
	color: var(--gray-text) !important;
	white-space: nowrap;
}
.woocommerce-breadcrumb svg {
	transform: translateY(0px);
}
.woocommerce-breadcrumb .bread-sep {
	margin: 0 4px;
}
@media (min-width: 1280px) {
	.woocommerce-breadcrumb {
		overflow-x: clip;
	}
}
@media (max-width: 1680px) {
	.woocommerce-breadcrumb {
		font-size: 14px !important;
		line-height: 20px !important;
	}
}
/* Breadcrumb - End */

/* No Select - Start */
.no-select,
.quantity-btn,
.dropdown-simple,
.dropdown-wrapper > :first-child,
.faq-question,
.tab-btn,
.category-tabs a {
	user-select: none;
}
/* No Select - End */

:where(.menu .menu-item-has-children:not(.has-submenu)) > .sub-menu li a {
	font-family: var(--font-family-1);
	font-size: 14px;
	line-height: 18px;
	font-weight: 400;
	text-decoration: none;
	transition: all 0.2s ease;
}

:where(.menu:not(.menu-vertical)) > .menu-item-has-children:where(:not(.has-submenu)) {
	flex-wrap: wrap;
}

:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu {
	display: none;
	list-style: none;
	margin: 0;
	padding: 0;
}
:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu li {
	list-style: none;
}
:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu li a:hover {
	color: var(--primary);
}

:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .submenu-toggle {
	width: 16px;
	height: 16px;
	min-width: 16px;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: transform 0.3s ease;
}
:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)).expanded > .submenu-toggle {
	transform: rotate(180deg);
}
:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .submenu-toggle .submenu-arrow {
	display: block;
	width: 12px;
	height: 12px;
	background: url('/wp-content/themes/shop/img/icons/dropdown.svg') no-repeat center / contain;
}

:where(.menu:not(.menu-vertical)) .submenu-open-parent > a {
	color: var(--primary) !important;
	font-weight: 500;
}
:where(.menu:not(.menu-vertical)) .submenu-open-parent {
	border-bottom: 1px solid var(--border);
	padding-bottom: 6px;
	margin-bottom: 4px;
}

@media (max-width: 1279px) {
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > a {
		min-width: 0;
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu {
		display: flex;
		flex-direction: column;
		flex-basis: 100%;
		width: 100%;
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		gap: 0;
		padding-left: 15px;
		margin-top: 0;
		border-left: 2px solid var(--border);
		transition: max-height 0.35s ease, opacity 0.25s ease, gap 0.25s ease, margin-top 0.25s ease, padding-top 0.25s ease, padding-bottom 0.25s ease;
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)).expanded > .sub-menu {
		max-height: 800px;
		opacity: 1;
		gap: 8px;
		margin-top: 10px;
		padding-top: 8px;
		padding-bottom: 4px;
	}
}

@media (min-width: 1280px) {
	:where(.menu:not(.menu-vertical)) .menu-item-has-children:where(:not(.has-submenu)) {
		position: relative;
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > a::after {
		content: '';
		display: inline-block;
		width: 9px;
		height: 9px;
		margin-left: 6px;
		background: url('/wp-content/themes/shop/img/icons/dropdown.svg') no-repeat center / contain;
		opacity: 0.8;
		transition: transform 0.2s ease;
	}
	.top-bar-menu :where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > a::after {
		filter: brightness(0) invert(1);
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)):hover > a::after,
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)):focus-within > a::after {
		transform: rotate(180deg);
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 1000;
		padding: 8px 0;
		min-width: 220px;
		background: var(--white);
		border: 1px solid var(--border);
		border-radius: var(--radius-small);
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-5px);
		transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)):hover > .sub-menu,
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)):focus-within > .sub-menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu li {
		display: block;
		width: 100%;
		margin: 0;
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu li a {
		display: block;
		padding: 8px 16px;
		white-space: nowrap;
		color: var(--black);
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu li a:hover {
		background: var(--light-gray);
		color: var(--primary);
	}
	:where(.menu:not(.menu-vertical)) :where(.menu-item-has-children:not(.has-submenu)) > .submenu-toggle {
		display: none;
	}
	:where(.menu:not(.menu-vertical)) .submenu-open-parent {
		display: none !important;
	}
}

:where(.menu.menu-vertical) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu {
	list-style: none;
	margin: 6px 0 0;
	padding: 0 0 0 15px;
}
:where(.menu.menu-vertical) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu li {
	list-style: none;
}
:where(.menu.menu-vertical) :where(.menu-item-has-children:not(.has-submenu)) > .sub-menu li a {
	padding: 4px 0;
}

/* === 05-cls-reserves.css === */
.swiper {
	overflow: hidden;
}
.swiper-wrapper {
	display: flex;
}
.swiper-slide {
	flex-shrink: 0;
}
.product-list {
	display: grid;
	grid-template-columns: repeat(var(--products-in-col), 1fr);
	gap: var(--products-indent-h) var(--products-indent-w);
}
.product-card .product-image-wrapper {
	position: relative;
}
.product-card .product-image-wrapper img {
	aspect-ratio: 1 / 1;
	width: 100%;
	height: auto;
	object-fit: contain;
}
.product-card .product-image-wrapper .product-image-second {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
}
input,
textarea,
select.op-select,
.op-select-toggle {
	width: 100%;
	padding: 12px 30px 12px 12px;
	border: none;
	font-family: var(--font-family-1);
	font-size: 14px;
	line-height: 17px;
}
.informer-wrapper:not(.ready),
.form-lightbox-wrapper:not(.ready) {
	position: fixed;
	visibility: hidden;
	z-index: -1;
}
.mega-menu {
	display: flex;
	align-items: center;
	gap: 5px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.mega-menu > li {
	padding-left: 20px;
}
:where(.mega-menu) > li > .sub-menu:where(.level-1) {
	position: absolute;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
.dropdown-simple .dropdown-box,
.dropdown-wrapper > .dropdown-box {
	position: absolute;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
.option-block {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.option-head {
	width: 100%;
	font-size: 14px;
	line-height: 14px;
}
.option-block span.option-value {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 30px;
	padding: 0 9px;
	font-size: 14px;
	line-height: 14px;
}
.color-option {
	position: relative;
	display: flex;
	width: 45px;
	height: 45px;
	border: 2px solid var(--border);
	border-radius: var(--radius-max);
}
.color-option .color-name {
	position: absolute;
}
.review-card .review-meta {
	display: flex;
	align-items: flex-start;
	flex-direction: column-reverse;
	width: 100%;
	gap: 5px;
}
.review-card .review-author {
	display: block;
	font-size: 18px;
	line-height: 22px;
}
.review-card .star-rating {
	display: flex;
	gap: 3px;
	font-size: 20px;
	line-height: 20px;
}
.review-card-slider .star-rating {
	font-size: 28px;
	line-height: 25px;
}
.review-card .review-date {
	position: absolute;
	bottom: 20px;
	right: 20px;
}
.review-card .review-text {
	margin-bottom: 10px;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.review-card .read-more-review {
	display: inline-block;
	font-size: 14px;
	line-height: 20px;
	margin-bottom: 10px;
}