/*!
Theme Name: healthy
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: healthy
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

test is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/* Fonts (local, assets/fonts)
--------------------------------------------- */
@font-face {
	font-family: "Stolzl";
	src: url("assets/fonts/stolzl_book.otf") format("opentype");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Stolzl";
	src: url("assets/fonts/stolzl_regular.otf") format("opentype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Stolzl";
	src: url("assets/fonts/stolzl_medium.otf") format("opentype");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "MissIssippi";
	src: url("assets/fonts/MissIssippi.ttf") format("truetype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}


:root {
	--color-mint: #B2E1E0;
	--color-mint-rgb: 178 225 224;

	--color-brown: #491700;
	--color-brown-rgb: 73 23 0;

	--color-light-mint: #CFEDE5;
	--color-light-mint-rgb: 207 237 229;


	--color-lime: #E3E872;
	--color-lime-rgb: 227 232 114;

	--color-lavender: #DBCBF2;
	--color-lavender-rgb: 219 203 242;

	--color-pink: #FFAFC8;
	--color-pink-rgb: 255 175 200;

	--color-yellow: #FCF276;
	--color-yellow-rgb: 252 242 118;

	/* Drawer: offset from viewport top (set by js/drawer-menu.js from .announcement-marquee). */
	--drawer-top: 0px;
}

/* Contact Form 7 states
--------------------------------------------- */
.wpcf7 form.submitting .wpcf7-submit {
	pointer-events: none;
	cursor: wait;
	transform: none;
}

.wpcf7 form.submitting .btn-with-icon > span,
.wpcf7 form.submitting .hc-delivery-form__submit-icon {
	position: relative;
	flex-shrink: 0;
	background-color: var(--color-brown);
	background-image: none;
}

.wpcf7 form.submitting .btn-with-icon > span svg {
	visibility: hidden;
}

.wpcf7 form.submitting .btn-with-icon > span::after,
.wpcf7 form.submitting .hc-delivery-form__submit-icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	box-sizing: border-box;
	width: 18px;
	height: 18px;
	border: 2px solid rgb(255 255 255 / 38%);
	border-top-color: #fff;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	transform-origin: center;
	animation: healthy-cf7-submit-spinner .7s linear infinite;
}

@keyframes healthy-cf7-submit-spinner {
	to {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wpcf7 form.submitting .btn-with-icon > span::after,
	.wpcf7 form.submitting .hc-delivery-form__submit-icon::after {
		animation: none;
	}
}

.wpcf7 .wpcf7-spinner {
	display: none;
}

.wpcf7 .wpcf7-not-valid-tip {
	display: block;
	margin-top: 4px;
	font: 400 12px / 1.25 "Stolzl", sans-serif;
	color: #b3261e;
	letter-spacing: 0;
}

.wpcf7 .wpcf7-not-valid {
	border-color: #b3261e !important;
}

.wpcf7 form .wpcf7-response-output {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 56px;
	margin: 0;
	padding: 14px 18px 14px 54px;
	border: 1px solid rgb(var(--color-brown-rgb) / 18%);
	border-radius: 10px;
	background: rgb(var(--color-mint-rgb) / 22%);
	font: 400 14px / 1.45 "Stolzl", sans-serif;
	color: var(--color-brown);
	letter-spacing: 0;
}

.wpcf7 form .wpcf7-response-output::before {
	content: "i";
	position: absolute;
	left: 16px;
	top: 50%;
	display: grid;
	place-items: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-brown);
	font-size: 14px;
	font-weight: 500;
	font-style: normal;
	line-height: 1;
	color: #fff;
	transform: translateY(-50%);
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: var(--color-mint);
	background: rgb(var(--color-mint-rgb) / 28%);
}

.wpcf7 form.sent .wpcf7-response-output::before {
	content: "\2713";
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
	border-color: rgb(var(--color-pink-rgb) / 85%);
	background: rgb(var(--color-pink-rgb) / 18%);
	color: #8d251e;
}

.wpcf7 form.invalid .wpcf7-response-output::before,
.wpcf7 form.failed .wpcf7-response-output::before,
.wpcf7 form.spam .wpcf7-response-output::before,
.wpcf7 form.aborted .wpcf7-response-output::before,
.wpcf7 form.unaccepted .wpcf7-response-output::before {
	content: "!";
	background: #b3261e;
}

.wpcf7 form .wpcf7-response-output:empty {
	display: none;
}

/* WooCommerce AJAX loader
--------------------------------------------- */
body.woocommerce .blockUI.blockOverlay,
body.woocommerce-page .blockUI.blockOverlay {
	background: rgb(255 255 255 / 72%) !important;
	opacity: 1 !important;
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

body.woocommerce .blockUI.blockOverlay::before,
body.woocommerce-page .blockUI.blockOverlay::before,
body.woocommerce .loader::before,
body.woocommerce-page .loader::before {
	content: "" !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	display: block !important;
	box-sizing: border-box;
	width: 46px !important;
	height: 46px !important;
	margin: -23px 0 0 -23px !important;
	border: 4px solid rgb(var(--color-mint-rgb) / 72%);
	border-top-color: var(--color-brown);
	border-right-color: var(--color-pink);
	border-bottom-color: var(--color-lavender);
	border-radius: 50%;
	background: none !important;
	box-shadow:
		0 0 0 7px rgb(255 255 255 / 68%),
		0 10px 32px rgb(var(--color-brown-rgb) / 16%);
	animation: healthy-woocommerce-loader .72s linear infinite !important;
}

@keyframes healthy-woocommerce-loader {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.woocommerce .blockUI.blockOverlay::before,
	body.woocommerce-page .blockUI.blockOverlay::before,
	body.woocommerce .loader::before,
	body.woocommerce-page .loader::before {
		animation-duration: 1.4s !important;
	}
}

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

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

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

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

.margin-v {
	margin: 120px auto;
}

.section {
	padding: 0 30px;
	width: 100%;
}

@media(max-width: 1023px) {
	.section {
		padding: 0 16px;
	}
}

.section__title {
	font-size: 60px;
	line-height: 100%;
	font-weight: 400;
	letter-spacing: 9.6px;
}

/*
 * MissIssippi lacks lowercase Ukrainian а, б and ґ. Decorative headings keep
 * the approved font and draw only those missing glyphs without editing the
 * font file or the source text stored in WordPress.
 */
.hc-decorative-title {
	font-family: "MissIssippi", "Stolzl", sans-serif;
}

.hc-decorative-glyph {
	display: inline-block;
	position: relative;
	font: inherit;
}

.hc-decorative-glyph--a {
	width: 0.58em;
	height: 1em;
	margin-inline: 0.01em;
	vertical-align: -0.18em;
}

.hc-decorative-glyph--be {
	width: 0.62em;
	height: 1em;
	margin-inline: 0.015em;
	vertical-align: -0.18em;
}

.hc-decorative-glyph--a svg,
.hc-decorative-glyph--be svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.hc-decorative-glyph--a path,
.hc-decorative-glyph--be path {
	fill: none;
	stroke: currentColor;
	stroke-width: 4.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.hc-decorative-glyph--ghe-upturn::after {
	content: "";
	position: absolute;
	right: -0.02em;
	top: 0.02em;
	width: 0.27em;
	border-top: 0.055em solid currentColor;
	border-radius: 999px;
}

@media (max-width: 767px) {
	.section__title {
		font-size: 40px;
	}
}

.section__title2 {
	font-family: 'Stolzl', sans-serif;
	font-weight: 400;
	font-size: 43px;
	line-height: 100%;
	color: #491700;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	font-family: "Stolzl", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 18px;
	font-weight: 300;
	line-height: 30px;
}

body {
	color: var(--color-brown);
}

.site-title,
.site-title a {
	font-family: "MissIssippi", "Stolzl", sans-serif;
	font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-family: "MissIssippi", "Stolzl", sans-serif;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
	padding-top: 42px;
}

@media(max-width: 1023px) {
	body {
		padding-top: 30px;
	}
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

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

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: #4169e1;
}

a:hover,
a:focus,
a:active {
	color: #000000;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Announcement marquee
--------------------------------------------- */
.announcement-marquee {
	overflow: hidden;
	/*background: rgb(var(--color-lavender-rgb) / 50%);*/
	background: #EDE5F9;
	padding: 10px 0;
	position: fixed;
	top: 0;
	z-index: 100;
}

.announcement-marquee__track {
	display: flex;
	width: max-content;
	animation: announcement-marquee-scroll 35s linear infinite;
	will-change: transform;
}

.announcement-marquee__group {
	display: flex;
	align-items: center;
	gap: 20px;
	padding-right: 20px;
	font-family: "Stolzl", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
	font-size: 14px;
	line-height: 1.7;
	color: #000000;
	white-space: nowrap;
}


@keyframes announcement-marquee-scroll {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.announcement-marquee__track {
		animation: none;
		justify-content: center;
		width: 100%;
	}

	.announcement-marquee__group:last-child {
		display: none;
	}
}

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
	margin: 0 0 7px;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
		gap: 20px;
		align-items: center;
	}
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
	width: 175px;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

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

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

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

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

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

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

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

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

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}


#page.site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
	/* на мобильных — без «прыжка» из‑за адресной строки */
}

.site-footer,
#colophon {
	margin-top: auto;
}

/*--------------------------------------------------------------
# Product categories (front page)
--------------------------------------------------------------*/
.products__categories {
	margin-top: 56px;
	overflow: hidden;
}

.archive .products__categories {
	margin-top: 0;
}

.products__categories-swiper {
	overflow: visible;
}

.products__categories-swiper .swiper-wrapper {
	align-items: stretch;
}

.products__categories-swiper .products__categories-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: auto;
	height: 203px;
	padding: 30px 0;
	box-sizing: border-box;
	border-radius: 10px;
	text-decoration: none;
	color: var(--color-brown);
	font: 300 20px / 1.5 "Stolzl", system-ui, sans-serif;
	text-align: center;
	text-transform: lowercase;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	cursor: pointer;
}

.products__categories-item:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgb(var(--color-brown-rgb) / 12%);
}

.products__categories-swiper .products__categories-item__img {
	display: block;
	width: 67%;
	max-width: 67%;
	height: 103px;
	max-height: 103px;
	margin: 0 auto;
	flex: 0 0 103px;
	object-fit: contain;
	object-position: center;
}

.products__categories-swiper .products__categories-item__label {
	display: block;
	margin-top: auto;
}

.products__categories-swiper .products__categories-item--without-image {
	justify-content: center;
	padding-inline: 24px;
}

.products__categories-swiper .products__categories-item--without-image .products__categories-item__label {
	margin-top: 0;
}

@media (max-width: 767px) {
	.products__categories-swiper .products__categories-item {
		height: 175px;
		padding: 18px 0;
	}
	.products__categories-swiper .products__categories-item__img {
		width: 51%;
		max-width: 51%;
		height: 86px;
		max-height: 86px;
		flex-basis: 86px;
	}
}

/*PRODUCTS*/
.products_inner {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	align-items: stretch;
	padding: 0;
	margin: 0;
}

.hc-product-card,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	border: 1px solid rgb(var(--color-brown-rgb) / 10%);
	border-radius: 10px;
	padding: 20px;
	list-style: none;
	margin: 0;
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.hc-product-card__badge {
	position: absolute;
	left: 20px;
	top: 19px;
	z-index: 2;
	background: #F14C21;
	line-height: 100%;
	color: #fff;
	font-size: 16px;
	padding: 8px 14px;
	border-radius: 5px;
	font-weight: 400;
}

/* Product badge system. */
.hc-product-badges {
	position: absolute;
	top: 19px;
	z-index: 4;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	pointer-events: none;
}
.hc-product-badges--left { left: 20px; }
.hc-product-badges--right { right: 20px; align-items: flex-end; }
.hc-product-badge {
	display: inline-flex;
	align-items: center;
	min-height: 31px;
	padding: 5px 11px;
	border-radius: 5px;
	background: #f14c21;
	color: #fff;
	font: 400 14px / 1.15 "Stolzl", system-ui, sans-serif;
	box-sizing: border-box;
}
.hc-product-badge--promotion { background: #8b5cf6; }
.hc-product-badge--soldout { background: var(--color-brown); }
.hc-product-badge--preorder { background: #d49300; }
.hc-product-badge--custom { background: #39735d; }

@media (max-width: 767px) {
	.hc-product-badges { top: 15px; gap: 4px; }
	.hc-product-badges--left { left: 15px; }
	.hc-product-badges--right { right: 15px; }
	.hc-product-badge { min-height: 27px; padding: 5px 9px; font-size: 12px; }
}

.hc-product-card__media {
	display: block;
	position: relative;
	overflow: hidden;
	aspect-ratio: 1;
	background: #eeeeee8c;
}

.hc-product-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	background: transparent;
}
.hc-product-card__image {
	transition: opacity .28s ease, transform .38s ease;
}
.hc-product-card__image--hover {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
}
@media (hover: hover) {
	.hc-product-card__media.has-hover-image:hover .hc-product-card__image--primary,
	.hc-product-card__media.has-hover-image:focus-visible .hc-product-card__image--primary { opacity: 0; }
	.hc-product-card__media.has-hover-image:hover .hc-product-card__image--hover,
	.hc-product-card__media.has-hover-image:focus-visible .hc-product-card__image--hover { opacity: 1; transform: scale(1.025); }
}

.hc-product-card__body {
	display: flex;
	flex-direction: column;
	gap: 13px;
	margin-top: 43px;
	flex: 1 1 auto;
}


.hc-product-card__title {
	font: 300 20px/20px 'Stolzl', sans-serif;
	color: var(--color-brown);
	letter-spacing: -0.22px;
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hc-product-card__meta {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	gap: 8px;
}

.hc-product-card__weight {
	font-size: 18px;
	line-height: 20px;
	color: rgb(var(--color-brown-rgb) / 80%);
	white-space: nowrap;
	flex-shrink: 0;
}

.hc-product-card__price {
	display: flex;
	align-items: center;
	gap: 8px;
	padding-top: 6px;
	margin-bottom: 20px;
}

.hc-product-card__price-old {
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	opacity: .7;
	text-decoration: line-through;
}

.hc-product-card__price-new {
	font-size: 24px;
	font-weight: 500;
	line-height: 24px;
}

.hc-product-card__actions {
	margin-top: auto;
	display: flex;
	gap: 20px;
	align-items: center;
}

.hc-qty {
	display: grid;
	grid-template-columns: 44px 1fr 44px;
	border: 1px solid rgb(var(--color-brown-rgb) / 30%);
	border-radius: 3px;
	overflow: hidden;
	height: 50px;
	background: #fff;
	max-width: 124px;
}

.hc-qty__btn {
	border: 0;
	background: transparent;
	cursor: pointer;
	color: var(--color-brown);
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hc-qty__btn svg {
	width: 24px;
	height: 24px;
	stroke: var(--color-brown);
}

input.hc-qty__input {
	border-left: 1px solid rgb(var(--color-brown-rgb) / 30%);
	border-right: 1px solid rgb(var(--color-brown-rgb) / 30%);
	border-top: unset;
	border-bottom: unset;
	border-radius: unset;
	outline: none;
	text-align: center;
	font-size: 20px;
	font-weight: 400;
	color: var(--color-brown);
	width: 100%;
	-moz-appearance: textfield;
	padding: 0;
}

.hc-qty__input::-webkit-outer-spin-button,
.hc-qty__input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.hc-product-card__buy.button,
.woocommerce .products .product .button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 50px;
	padding: 0 14px;
	border-radius: 10px;
	background: var(--color-brown);
	color: #fff;
	text-decoration: none;
	border: 0;
	font-weight: 300;
	transition: all .2s linear;
	width: calc(100% - 144px);
	margin: 0;
}

.hc-product-card__buy.button:hover,
.woocommerce .products .product .button:hover {
	border: 1px solid var(--color-brown);
	color: var(--color-brown);
	background: rgb(var(--color-brown-rgb) / 30%);
}

.hc-product-card__buy.button.added,
.woocommerce .products .product .button.added {
	border: 1px solid var(--color-brown);
	color: var(--color-brown);
	background: rgb(var(--color-brown-rgb) / 30%);
}

.hc-product-card__buy.button.added svg,
.woocommerce .products .product .button.added svg {
	display: none;
}

.hc-product-card__buy.button.added:after,
.woocommerce .products .product .button.added:after {
	background-image: url("data:image/svg+xml,%3Csvg focusable='false' width='13' height='9' viewBox='0 0 13 9' fill='none' aria-hidden='true' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.5 0.5L4.5 8.5L0.5 4.50018' stroke='%23000' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	width: 24px;
	height: 24px;
	content: '' !important;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.hc-product-card__buy.button svg {
	width: 24px;
	height: 24px;
	stroke: white;
	transition: all .2s linear;
}

.hc-product-card__buy.button:hover svg {
	stroke: var(--color-brown);
}

.woocommerce .products .product .hc-product-card__buy--choose.button,
.hc-product-card .hc-product-card__actions > .hc-product-card__buy--choose.button {
	width: 100%;
	flex: 1 1 100%;
}

.hc-product-card__buy--out-of-stock {
	flex-direction: row;
	width: 100% !important;
	background: rgb(var(--color-brown-rgb) / 20%) !important;
	color: var(--color-brown) !important;
	border: 1px solid rgb(var(--color-brown-rgb) / 30%) !important;
}

.hc-product-card__buy--out-of-stock:hover {
	background: rgb(var(--color-brown-rgb) / 30%);
	color: var(--color-brown);
}

.hc-product-card__buy-label {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1.2;
	text-align: left;
}

.hc-product-card__buy-status {
	font-size: 11px;
	font-weight: 400;
	opacity: 0.75;
}

.hc-product-card__buy-action {
	font-size: 16px;
	font-weight: 500;
}

.hc-product-card__buy--out-of-stock svg {
	width: 20px;
	height: 20px;
	stroke: currentColor !important;
	flex-shrink: 0;
}

.hc-product-card.outofstock .hc-product-card__actions {
	justify-content: flex-end;
}

.hc-product-card.outofstock .hc-qty {
	display: none;
}

.drag-info {
	display: none;
}

@media (max-width: 1300px) {
	.hc-product-card__buy-text {
		display: none;
	}

	.hc-product-card__title {
		font: 300 18px / 20px 'Stolzl', sans-serif;
	}
}

@media (max-width: 1023px) {
	.products_carousel.flickity-enabled {
		display: block;
	}

	.products_carousel.flickity-enabled .flickity-viewport {
		overflow: visible;
	}

	.products_carousel.flickity-enabled .product {
		height: auto;
		width: 345px;
	}

	.products_carousel .flickity-page-dots {
		display: none;
	}

	.products-progress {
		max-width: 400px;
		margin: 20px auto 0;
		box-sizing: content-box;
        position: relative;
        z-index: 1;
	}

	.products-progress__track {
		position: relative;
		height: 4px;
		background: rgb(var(--color-brown-rgb) / 18%);
		border-radius: 999px;
	}

	.products-progress__thumb {
		position: absolute;
		left: 0;
		top: 50%;
		width: 77px;
		height: 10px;
		border-radius: 2px;
		background-color: var(--color-brown);
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='4' viewBox='0 0 15 4' fill='none'%3E%3Crect width='1' height='4' rx='0.5' fill='%23fff'/%3E%3Crect x='7' width='1' height='4' rx='0.5' fill='%23fff'/%3E%3Crect x='14' width='1' height='4' rx='0.5' fill='%23fff'/%3E%3C/svg%3E");
		background-position: center;
		background-repeat: no-repeat;
		background-size: 15px 4px;
		transform: translate(0, -50%);
		will-change: transform;
		cursor: grab;
		touch-action: none;
		user-select: none;
		-webkit-user-select: none;
	}

	.drag-info {
		display: flex;
		gap: 10px;
		color: #737872;
		font-size: 12px;
		line-height: 13px;
		margin-top: 10px;
		text-transform: lowercase;
		font-weight: 300;
		align-items: center;
	}

	.drag-info svg {
		min-width: 18px;
		width: 18px;
		height: 21px;
	}

	.drag-info span {
		max-width: 210px;
	}
}

@media (min-width: 1024px) {
	.products-progress {
		display: none;
	}
}

@media (max-width: 520px) {
	.products_carousel.flickity-enabled .product {
		height: auto;
		width: 257px;
	}

	.hc-product-card__actions {
		grid-template-columns: 1fr;
	}
}

.btn-with-icon {
	text-decoration: none;
	text-align: center;
	align-items: center;
	border: 1px solid var(--color-brown);
	outline: none;
	border-radius: 10px;
	color: var(--color-brown);
	display: flex;
	gap: 16px;
	padding: 0 6px 0 16px;
	height: 58px;
	justify-content: space-between;
	transition: all .2s linear;
	cursor: pointer;
}

.btn-with-icon:hover {
	background: var(--color-brown);
	color: white
}
.btn-with-icon span {
	background: var(--color-brown);
	border-radius: 5px;
	width: 36px;
	height: 45px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	transition: all .2s linear;
}
.btn-with-icon span svg {
	color: #fff;
	transition: all .2s linear;
	stroke: currentColor;
}
.btn-with-icon:hover span {
	background: white;
}

.btn-with-icon:hover span svg {
	color: var(--color-brown);
}

.btn-with-icon:hover span svg path {
	stroke: currentColor;
}

@media (max-width: 767px) {
	.margin-v {
		margin: 80px 0;
	}
}

/* -------------------------------------------------------------------------
   Site footer
   ------------------------------------------------------------------------- */

footer {
	background: rgb(var(--color-mint-rgb) / 40%);
	border-top: 1px solid rgb(var(--color-brown-rgb) / 20%);
}

footer a {
	color: inherit;
	text-decoration: none;
}

footer a:hover,
footer a:focus-visible {
	font-weight: 400;
	color: inherit;
}

.footer__main {
	display: grid;
	grid-template-areas:
		'primary brand legal';
	align-items: start;
	grid-template-columns: 330px calc(100% - 660px) 330px;
}

.footer__brand {
	grid-area: brand;
	text-align: center;
	margin: 0 auto;
	height: 100%;
	padding: 103px 20px 103px;
}

.footer__nav--primary {
	grid-area: primary;
	justify-self: start;
	padding-top: 104px;
	height: 100%;
	min-width: 330px;
	border-right: 1px solid rgb(var(--color-brown-rgb) / 20%);
}

.footer__nav--legal {
	grid-area: legal;
	justify-self: end;
	text-align: right;
	padding-top: 105px;
	min-width: 330px;
	height: 100%;
	border-left: 1px solid rgb(var(--color-brown-rgb) / 20%);
}

.footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
	line-height: 23px;
}

.footer__nav--legal .footer__list {
	align-items: flex-end;
}

.footer__logo img {
	width: 448px;
	height: auto;
}

.footer__logo:hover,
.footer__logo:focus-visible {
	text-decoration: none;
}

.footer__tagline {
	margin: 7px 0 20px;
	font: 300 20px/130% 'MissIssippi', 'Stolzl', sans-serif !important;
	font-size: clamp(15px, 2.2vw, 18px);
	color: rgb(var(--color-brown-rgb) / 80%);
	letter-spacing: 2.5px;
}

.footer__contacts {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	margin-bottom: 17px;
}

.footer__contact {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.footer__contact span {
	color: rgb(var(--color-brown-rgb) / 80%);
}

.footer__contact-icon {
	stroke: var(--color-brown);
}

.footer__social {
	display: flex;
	gap: 19px;
	margin-top: 18px;
	justify-content: center;
}

.footer__social a {
	height: 40px;
	border-radius: 20px;
	padding: 0 16px;
	align-items: center;
	display: flex;
	white-space: nowrap;
	text-decoration: none;
	gap: 10px;
	background: var(--color-mint);
	transition: all .2s linear;
}

.footer__social a svg {
	width: 28px;
	height: 28px;
}

.footer__social a:hover {
	background: rgb(var(--color-mint-rgb) / 70%);
	text-decoration: none;
}

.footer__bottom {
	border-top: 1px solid rgb(var(--color-brown-rgb) / 20%);
	margin-left: -30px;
	margin-right: -30px;
}

.footer__bottom .container {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px 30px;
	gap: 16px 24px;
}

.footer__copy {
	font-size: 16px;
	margin: 0;
	color: rgb(var(--color-brown-rgb) / 80%)
}

.footer__payments {
	display: flex;
	align-items: center;
	gap: 22px;
	position: absolute;
	right: 1px;
	top: 19px;
}

@media (max-width: 1200px) {
	.footer__logo img {
		width: 330px;
	}

	.footer__nav--primary,
	.footer__nav--legal {
		min-width: 300px;
	}

	.footer__main {
		grid-template-columns: 300px calc(100% - 600px) 300px;
	}

	.footer__payments {
		right: 30px;
	}
}

@media (max-width: 1023px) {
	.footer {
		padding: 40px 0 24px;
	}

	.footer__main {
		grid-template-columns: 1fr;
		grid-template-areas:
			'brand'
			'primary'
			'legal';
		justify-items: center;
		gap: 26px;
	}

	.footer__logo img {
		width: 290px;
	}

	.footer__brand {
		padding: 50px 20px 10px;
	}

	.footer__nav--primary {
		justify-self: stretch;
		width: calc(100% + 32px);
		max-width: none;
		margin: 0 -16px;
		border-top: 1px solid rgb(var(--color-brown-rgb) / 20%);
		border-bottom: 1px solid rgb(var(--color-brown-rgb) / 20%);
		border-right: 0;
		padding: 0;
	}

	.footer__list--primary {
		display: grid;
		grid-template-columns: 1fr 1fr;
		width: 100%;
		gap: 0;
		padding: 0 16px;
	}

	.footer__list--primary li {
		padding: 10px 0;
		display: flex;
	}

	.footer__list--primary li a {
		max-width: 240px;
		width: -webkit-fill-available;
		display: block;
		font-size: 16px;
	}

	.footer__list--primary .footer__item--home {
		display: none;
	}

	.footer__item--cat,
	.footer__item--about,
	.footer__item--contact {
		grid-column: 1;
		justify-content: flex-end;
	}

	.footer__item--where,
	.footer__item--b2b,
	.footer__item--faq {
		grid-column: 2;
		text-align: end;
		border-left: 1px solid rgb(var(--color-brown-rgb) / 20%);
	}

	.footer__item--cat,
	.footer__item--where {
		grid-row: 2;
	}

	.footer__item--about,
	.footer__item--b2b {
		grid-row: 3;
	}

	.footer__item--contact,
	.footer__item--faq {
		grid-row: 4;
	}

	.footer__nav--legal {
		width: 100%;
		border: none;
		padding-top: 0;
	}

	.footer__nav--legal .footer__list {
		align-items: center;
		text-align: center;
	}

	.footer__bottom {
		margin-top: 28px;
		margin-left: -16px;
		margin-right: -16px;
	}

	.footer__bottom .container {
		justify-content: flex-start;
		padding: 20px 16px;
	}

	.footer__copy {
		width: calc(100% - 170px);
		font-size: 12px;
		line-height: 17px;
	}
}


/* ── Breadcrumbs (universal) ── */
body #page .woocommerce-breadcrumb,
.hc-zerna__breadcrumbs {
	margin: 20px 0 40px;
	font-size: 14px;
	line-height: 24px;
	color: var(--color-brown);
}

.hc-zerna__breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

body .woocommerce-breadcrumb .woocommerce-breadcrumb__item:last-child,
.hc-zerna__breadcrumb-current {
	color: var(--color-brown);
}

body .woocommerce-breadcrumb a,
.hc-zerna__breadcrumb-link {
	text-decoration: none;
	color: rgb(var(--color-brown-rgb) / 70%);
}

body .woocommerce-breadcrumb a:hover,
.hc-zerna__breadcrumb-link:hover {
	color: var(--color-brown);
}

@media (max-width: 767px) {

	body #page .woocommerce-breadcrumb,
	.hc-zerna__breadcrumbs {
		margin: 6px 0 32px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
}
/* Healthy Choice WooCommerce notices */
body .woocommerce-notices-wrapper:empty {
	display: none;
}

body .hc-wc-notice,
body ul.woocommerce-error li.hc-wc-notice {
	position: relative;
	display: flex;
	align-items: center;
	gap: 16px;
	box-sizing: border-box;
	width: 100%;
	min-height: 76px;
	margin: 0 0 12px;
	padding: 14px 16px;
	padding-left: 16px !important;
	overflow: hidden;
	border: 1px solid rgb(var(--color-brown-rgb) / 12%);
	border-radius: 12px;
	background: #fff;
	color: var(--color-brown);
	font: 300 15px / 1.45 "Stolzl", system-ui, sans-serif;
	box-shadow: none;
	transition: opacity .18s ease, transform .18s ease, max-height .2s ease, margin .2s ease, padding .2s ease;
}

body .hc-wc-notice--success {
	border-color: rgb(var(--color-mint-rgb) / 65%);
	background: rgb(var(--color-mint-rgb) / 18%);
}

body .hc-wc-notice--info {
	border-color: rgb(var(--color-lavender-rgb) / 65%);
	background: rgb(var(--color-lavender-rgb) / 18%);
}

body ul.woocommerce-error li.hc-wc-notice--error {
	border-color: rgb(var(--color-pink-rgb) / 65%);
	background: rgb(var(--color-pink-rgb) / 18%);
}

body .hc-wc-notice::before,
body ul.woocommerce-error.hc-wc-notice-list::before {
	content: none;
}

body ul.woocommerce-error.hc-wc-notice-list {
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	list-style: none;
}

body ul.woocommerce-error.hc-wc-notice-list:focus {
	outline: none;
}

body .hc-wc-notice__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	color: var(--color-brown);
	box-shadow: none;
}

body .hc-wc-notice__icon::before {
	content: "!";
	font: 500 18px / 1 "Stolzl", system-ui, sans-serif;
}

body .hc-wc-notice--success .hc-wc-notice__icon::before {
	content: "✓";
	font-size: 17px;
}

body .hc-wc-notice__content {
	display: flex;
	align-items: center;
	gap: 20px;
	flex: 1 1 auto;
	min-width: 0;
}

body .hc-wc-notice__content a:not(.button) {
	color: inherit;
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: 3px;
}

body .hc-wc-notice__content .button,
body .hc-wc-notice a.button.wc-forward {
	float: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	min-height: 46px;
	margin: 0 0 0 auto;
	padding: 12px 20px;
	border: 1px solid var(--color-brown);
	border-radius: 10px;
	background: var(--color-brown);
	color: #fff;
	font: 500 14px / 20px "Stolzl", system-ui, sans-serif;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .18s ease, color .18s ease;
}

body .hc-wc-notice__content .button:hover,
body .hc-wc-notice__content .button:focus-visible,
body .hc-wc-notice a.button.wc-forward:hover,
body .hc-wc-notice a.button.wc-forward:focus-visible {
	background: transparent;
	color: var(--color-brown);
}

body .hc-wc-notice__close {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	flex: 0 0 32px;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0 !important;
	border-radius: 50%;
	background: transparent !important;
	color: rgb(var(--color-brown-rgb) / 65%);
	font-size: 0;
	line-height: 0;
	box-shadow: none !important;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

body .hc-wc-notice__close::before,
body .hc-wc-notice__close::after {
	content: "";
	position: absolute;
	width: 14px;
	height: 1.5px;
	border-radius: 2px;
	background: currentColor;
}

body .hc-wc-notice__close::before {
	transform: rotate(45deg);
}

body .hc-wc-notice__close::after {
	transform: rotate(-45deg);
}

body .hc-wc-notice__close:hover,
body .hc-wc-notice__close:focus-visible {
	background: rgb(var(--color-brown-rgb) / 8%) !important;
	color: var(--color-brown);
}

body .hc-wc-notice.is-hiding,
body ul.woocommerce-error li.hc-wc-notice.is-hiding {
	max-height: 0;
	margin: 0;
	padding-top: 0;
	padding-bottom: 0;
	opacity: 0;
	transform: translateY(-7px);
}

@media (max-width: 767px) {
	body .hc-wc-notice,
	body ul.woocommerce-error li.hc-wc-notice {
		align-items: flex-start;
		gap: 12px;
		min-height: 0;
		padding: 16px;
		border-radius: 12px;
		font-size: 14px;
	}

	body .hc-wc-notice__icon {
		flex-basis: 36px;
		width: 36px;
		height: 36px;
	}

	body .hc-wc-notice__content {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}

	body .hc-wc-notice__content .button,
	body .hc-wc-notice a.button.wc-forward {
		display: flex;
		width: 100%;
		margin: 0;
	}

	body .hc-wc-notice__close {
		align-self: flex-start;
		flex-basis: 28px;
		width: 28px;
		height: 28px;
	}
}

/* WooCommerce Blocks use different notice markup. Keep it visually aligned
 * with the classic templates used throughout the theme. */
body .wc-block-components-notice-banner {
	box-sizing: border-box;
	min-height: 76px;
	padding: 14px 16px !important;
	border: 1px solid rgb(var(--color-lavender-rgb) / 65%) !important;
	border-radius: 12px !important;
	background: rgb(var(--color-lavender-rgb) / 18%) !important;
	color: var(--color-brown) !important;
	font: 300 15px / 1.45 "Stolzl", system-ui, sans-serif !important;
	box-shadow: none;
}

body .wc-block-components-notice-banner.is-success {
	border-color: rgb(var(--color-mint-rgb) / 65%) !important;
	background: rgb(var(--color-mint-rgb) / 18%) !important;
}

body .wc-block-components-notice-banner.is-error {
	border-color: rgb(var(--color-pink-rgb) / 65%) !important;
	background: rgb(var(--color-pink-rgb) / 18%) !important;
}

body .wc-block-components-notice-banner > svg {
	box-sizing: border-box;
	width: 40px;
	height: 40px;
	padding: 11px;
	border-radius: 50%;
	background: #fff !important;
	fill: var(--color-brown) !important;
}

body .wc-block-components-notice-banner__content a,
body .wc-block-components-notice-banner__content button {
	color: var(--color-brown) !important;
	font-weight: 500;
	text-underline-offset: 3px;
}