/* ZaZita - alap elrendezés és stílus.
   Színek a stratégiából: fő #84A3A0, gomb #4E6B68, mustár kiemelés #D9A441.
   Szabály: mustáron és a világos fő színen mindig sötét szöveg. */

/* ---- Betűk: a téma saját szerveréről ---- */
/* A Google Fonts helyett: csak a latin és a latin-ext (ő, ű) készlet, 10 fájl
   az assets/fonts mappában. A Google-féle CSS 58 szabályából 14 maradt. */
/* A téma betűi helyben (Google Fonts, csak latin + latin-ext), generálva: fonts_letolt.py */
/* Open Sans italic 400 latin-ext */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-400-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Open Sans italic 400 latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-400-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Open Sans normal 400 latin-ext */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-var-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Open Sans normal 400 latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-var-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Open Sans normal 600 latin-ext */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-var-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Open Sans normal 600 latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-var-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Open Sans normal 700 latin-ext */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-var-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Open Sans normal 700 latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/open-sans-var-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Ubuntu normal 400 latin-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/ubuntu-400-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Ubuntu normal 400 latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/ubuntu-400-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Ubuntu normal 500 latin-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/ubuntu-500-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Ubuntu normal 500 latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/ubuntu-500-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Ubuntu normal 700 latin-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/ubuntu-700-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Ubuntu normal 700 latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/ubuntu-700-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root {
	--zz-brand: #84A3A0;
	--zz-brand-light: #eef3f2;
	--zz-brand-dark: #4E6B68;
	--zz-brand-darker: #44605D;
	--zz-accent: #D9A441;
	--zz-accent-light: #E8C15A;
	--zz-text: #23282a;
	--zz-muted: #6b7280;
	--zz-bg: #fff;
	--zz-bg-soft: #faf9f7;
	--zz-line: #e6e4e0;
	--zz-radius: 8px;
	--zz-max: 1240px;
	--zz-gap: 1.5rem;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	color: var(--zz-text);
	background: var(--zz-bg);
	font-size: 16px;                 /* mobilon is minimum 16 px */
	line-height: 1.6;
	font-family: "Open Sans", Helvetica, Arial, sans-serif;   /* az éles oldal törzsbetűje */
}

img { max-width: 100%; height: auto; }

a { color: var(--zz-brand-dark); }
a:hover { color: var(--zz-brand-darker); }

h1, h2, h3, h4 { line-height: 1.25; margin: 0 0 .6em; font-weight: 600; font-family: "Open Sans", Helvetica, Arial, sans-serif; }
h1 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem); }
h2 { font-size: clamp(1.3rem, 1.1rem + 1vw, 1.8rem); }
h3 { font-size: 1.15rem; }

p { margin: 0 0 1rem; }

.container { width: 100%; max-width: var(--zz-max); margin: 0 auto; padding: 0 1.25rem; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip-path: inset(50%);
	white-space: nowrap;
}

.skip-link { position: absolute; left: -9999px; }
.skip-link:focus {
	left: 1rem; top: 1rem; z-index: 1000;
	background: #fff; padding: .6rem 1rem; border-radius: var(--zz-radius);
	box-shadow: 0 2px 12px rgba(0,0,0,.15);
}

:focus-visible { outline: 2px solid var(--zz-brand-dark); outline-offset: 2px; }

/* -------------------------------------------------- Fejléc */

.site-header {
	position: sticky; top: 0; z-index: 100;
	background: #fff;
	border-bottom: 1px solid var(--zz-line);
}

.site-header__inner {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-height: 76px;
}

.site-branding { flex: 0 0 auto; }
.site-branding img, .custom-logo { max-height: 52px; width: auto; }
.site-title { font-size: 1.3rem; font-weight: 700; text-decoration: none; color: var(--zz-text); }

.site-nav { margin-left: auto; }

.site-nav__list {
	display: flex;
	align-items: center;
	gap: 1.4rem;
	list-style: none;
	margin: 0; padding: 0;
}

.site-nav__list > li { position: relative; }

.site-nav__list a {
	display: block;
	padding: .5rem 0;
	text-decoration: none;
	color: var(--zz-text);
	font-size: .95rem;
}

.site-nav__list > li > a:hover { color: var(--zz-brand-dark); }

.site-nav__list .menu-item-has-children > a::after {
	content: "";
	display: inline-block;
	margin-left: .4em;
	border: .3em solid transparent;
	border-top-color: currentColor;
	transform: translateY(.15em);
}

/* Lenyíló almenü - a 45 elemes menü így nem terül szét */
.site-nav__list .sub-menu {
	position: absolute;
	top: 100%; left: 0;
	min-width: 230px;
	background: #fff;
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	box-shadow: 0 8px 24px rgba(0,0,0,.08);
	list-style: none;
	margin: 0; padding: .4rem 0;
	opacity: 0; visibility: hidden;
	transition: opacity .15s;
}

.site-nav__list > li:hover > .sub-menu,
.site-nav__list > li:focus-within > .sub-menu { opacity: 1; visibility: visible; }

.site-nav__list .sub-menu a { padding: .45rem 1rem; font-size: .92rem; }
.site-nav__list .sub-menu a:hover { background: var(--zz-brand-light); }
.site-nav__list .sub-menu .sub-menu { position: static; border: 0; box-shadow: none; opacity: 1; visibility: visible; padding: 0 0 0 .8rem; }

.site-actions { display: flex; align-items: center; gap: .35rem; }

.icon-btn {
	position: relative;
	display: inline-flex; align-items: center; justify-content: center;
	width: 42px; height: 42px;
	background: transparent; border: 0; border-radius: 50%;
	font-size: 1.15rem; line-height: 1; cursor: pointer;
	text-decoration: none; color: var(--zz-text);
}
.icon-btn:hover { background: var(--zz-brand-light); }

.cart-count {
	position: absolute; top: 2px; right: 0;
	min-width: 19px; height: 19px; padding: 0 4px;
	background: var(--zz-brand-dark); color: #fff;
	border-radius: 999px;
	font-size: .72rem; font-weight: 700; line-height: 19px;
	text-align: center;
}
.cart-count.is-empty { display: none; }

.nav-toggle {
	display: none;
	width: 42px; height: 42px;
	background: transparent; border: 0; cursor: pointer;
}
.nav-toggle__bars, .nav-toggle__bars::before, .nav-toggle__bars::after {
	display: block; width: 22px; height: 2px; background: var(--zz-text); border-radius: 2px;
}
.nav-toggle__bars { position: relative; margin: 0 auto; }
.nav-toggle__bars::before, .nav-toggle__bars::after { content: ""; position: absolute; }
.nav-toggle__bars::before { top: -7px; }
.nav-toggle__bars::after { top: 7px; }

/* Kereső */
.site-search { border-top: 1px solid var(--zz-line); background: var(--zz-bg-soft); padding: 1rem 0; }
.site-search form { display: flex; gap: .5rem; align-items: stretch; }
/* A mezőt a kereső szkriptje egy .search-wrap dobozba teszi (ez tartja a
   találati listát), ezért a nyúlás a dobozra kell - nem a mezőre. */
.site-search .search-wrap { flex: 1; min-width: 0; position: relative; }
.site-search .search-wrap input[type="search"],
.site-search .search-wrap input[type="text"] { width: 100%; }
.site-search input[type="search"], .site-search input[type="text"] { flex: 1; }

/* -------------------------------------------------- Morzsamenü */

.breadcrumb {
	background: var(--zz-bg-soft);
	border-bottom: 1px solid var(--zz-line);
	font-size: .875rem;
	padding: .7rem 0;
	color: var(--zz-muted);
}
.breadcrumb a { color: var(--zz-muted); text-decoration: none; }
.breadcrumb a:hover { color: var(--zz-brand-dark); text-decoration: underline; }
.breadcrumb__sep { margin: 0 .5rem; opacity: .5; }

/* -------------------------------------------------- Tartalom */

/* A fő tartalom nem kap saját keretet: így a teljes szélességű sávok (fejrész,
   oldalfejléc, szakaszok) hézag nélkül simulnak a menü, illetve a lábléc alá.
   A térközt az kapja, ami tényleg konténerben ül. */
.site-main { padding: 0; min-height: 50vh; }
.site-main > .container:first-child { padding-top: 2.5rem; }
.site-main > .container:last-child { padding-bottom: 4rem; }

/* Az utolsó szakasz háttere a lábléchez ér - ne lökje el tőle egy alsó margó. */
.site-main > .section:last-child,
.site-main > .hero:last-child { margin-bottom: 0; }

/* Űrlapmezők */
input[type="text"], input[type="email"], input[type="tel"], input[type="search"],
input[type="password"], input[type="number"], select, textarea {
	width: 100%;
	max-width: 100%;
	padding: .6rem .75rem;
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	font: inherit;
	background: #fff;
	color: var(--zz-text);
}

/* Gombok - fehér felirat csak a sötétített árnyalaton */
.button, button, input[type="submit"],
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt {
	display: inline-block;
	background: var(--zz-brand-dark);
	color: #fff;
	border: 0;
	border-radius: var(--zz-radius);
	padding: .75rem 1.4rem;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}
.button:hover, button:hover, input[type="submit"]:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover {
	background: var(--zz-brand-darker);
	color: #fff;
}

.nav-toggle:hover, .icon-btn:hover { background: var(--zz-brand-light); }

.badge {
	display: inline-block;
	background: var(--zz-accent);
	color: var(--zz-text);          /* mustáron sötét szöveg */
	padding: .2em .6em;
	border-radius: 4px;
	font-size: .8rem;
	font-weight: 600;
}

/* -------------------------------------------------- Kezdőlap */

.hero {
	background: var(--zz-brand-light);
	padding: 3rem 0;
	margin-bottom: 2.5rem;
}
.hero__inner { max-width: 640px; }
.hero p { font-size: 1.05rem; color: #45504f; }
.hero .button { margin-top: .5rem; }

.section { margin-bottom: 3rem; }
.section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.section__head h2 { margin: 0; }

.cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: var(--zz-gap);
}

.cat-card {
	display: block;
	text-decoration: none;
	color: inherit;
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	overflow: hidden;
	background: #fff;
}
.cat-card:hover { border-color: var(--zz-brand); }
.cat-card__img { aspect-ratio: 4/3; background: var(--zz-bg-soft); display: block; overflow: hidden; }
.cat-card__img img { width: 100%; height: 100%; object-fit: cover; }
.cat-card__body { padding: .85rem 1rem; }
.cat-card__name { font-weight: 600; display: block; }
.cat-card__count { color: var(--zz-muted); font-size: .85rem; }

/* -------------------------------------------------- Termékrács */

.woocommerce ul.products, ul.products {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(258px, 1fr));
	gap: var(--zz-gap);
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
}

.woocommerce ul.products li.product, ul.products li.product {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	overflow: hidden;
	background: #fff;
	display: flex;
	flex-direction: column;
	text-align: left;
}

.woocommerce ul.products li.product:hover { border-color: var(--zz-brand); }

.woocommerce ul.products li.product a img {
	margin: 0;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	display: block;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 1rem !important;
	font-weight: 600;
	padding: .85rem 1rem .25rem !important;
	margin: 0;
}

.woocommerce ul.products li.product .price {
	display: block;
	padding: 0 1rem;
	color: var(--zz-text) !important;
	font-size: 1rem;
	font-weight: 600;
}

.woocommerce ul.products li.product .button {
	margin: .85rem 1rem 1rem;
	align-self: flex-start;
}

.woocommerce span.onsale, span.onsale {
	background: var(--zz-accent) !important;
	color: var(--zz-text) !important;   /* mustáron sötét szöveg */
	border-radius: 999px;
	padding: .25em .8em;
	min-height: 0; min-width: 0;
	line-height: 1.6;
	top: .6rem; left: .6rem; right: auto;
	margin: 0;
}

.woocommerce .woocommerce-result-count { color: var(--zz-muted); }
.woocommerce .woocommerce-ordering { margin-bottom: 1.5rem; }

/* -------------------------------------------------- Termékoldal */

.woocommerce div.product {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 2.5rem;
	align-items: start;
}

/* A WooCommerce lebegtetett elrendezését semlegesítjük, de az alsó térközt
   meghagyjuk: a galéria alatt kell egy kis levegő. */
.woocommerce div.product .woocommerce-product-gallery { width: 100% !important; float: none !important; margin: 0 0 2rem !important; }
.woocommerce div.product .entry-summary { width: 100% !important; float: none !important; margin: 0 !important; }

.woocommerce div.product .product_title { margin-bottom: .5rem; }

.woocommerce div.product p.price, .woocommerce div.product span.price {
	color: var(--zz-text);
	font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: 1rem;
}

.woocommerce div.product form.cart { margin-bottom: 1.5rem; }
.woocommerce div.product form.cart div.quantity { margin-right: .75rem; }
/* Egyedi darabnál (1 db) a mennyiségmező rejtett - a helyét se foglalja. */
.woocommerce div.product form.cart div.quantity:has(input[type="hidden"]) { display: none; }

.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product .related,
.woocommerce div.product .up-sells {
	grid-column: 1 / -1;
	margin-top: 1rem;
}

/* Termékfülek (Leírás / Vélemények).
   A WooCommerce gyári füle "felpöndörödő lap" hatású, kerek sarkokkal és
   pszeudoelemekkel - az a régi sablonokhoz készült, ide nem illik. Helyette
   sima, aláhúzott fülek, a márka színeivel. */
.woocommerce div.product .woocommerce-tabs {
	margin-top: clamp(2.5rem, 1.5rem + 3vw, 4rem);
	padding-top: clamp(2rem, 1.25rem + 2vw, 3rem);
	border-top: 1px solid var(--zz-line);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem;
	list-style: none;
	padding: 0;
	margin: 0;
	border-bottom: 1px solid var(--zz-line);
}

/* A gyári "pöndörödés" kikapcsolása. */
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: none;
	border: 0;
	border-radius: 0;
	margin: 0;
	padding: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: .8rem 1.15rem;
	font-weight: 600;
	font-size: .98rem;
	color: var(--zz-muted);
	text-decoration: none;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--zz-text); }

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--zz-brand-dark);
	border-bottom-color: var(--zz-brand-dark);
}

.woocommerce div.product .woocommerce-tabs .panel {
	padding-top: clamp(1.5rem, 1rem + 1.5vw, 2.25rem);
	margin-bottom: 0;
}

/* A panel saját címsora ugyanazt írja ki, mint a fül - felesleges. */
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child { display: none; }

.woocommerce div.product .woocommerce-tabs .panel p { margin: 0 0 1.1rem; }
.woocommerce div.product .woocommerce-tabs .panel > *:last-child { margin-bottom: 0; }

/* -------------------------------------------------- Kosár, pénztár */

.woocommerce table.shop_table {
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	border-collapse: separate;
}
.woocommerce table.shop_table th { background: var(--zz-bg-soft); }
.woocommerce .cart-collaterals .cart_totals { width: 100%; }

.woocommerce-message, .woocommerce-info, .woocommerce-error {
	border-top-color: var(--zz-brand) !important;
	background: var(--zz-bg-soft);
	border-radius: var(--zz-radius);
}
.woocommerce-error { border-top-color: #b32d2e !important; }

/* -------------------------------------------------- Lábléc */

.site-footer {
	background: var(--zz-bg-soft);
	border-top: 1px solid var(--zz-line);
	margin-top: 0;
	padding: 3.5rem 0 2rem;
	color: #4b5250;
}

/* Viki: az oszlopok ne egyforma szélesek legyenek, hanem a saját tartalmukhoz
   igazodjanak, és a köztük lévő távolság legyen egyenlő (2026-10-11). */
.site-footer__cols {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: clamp(1.75rem, 1rem + 2.5vw, 3.5rem);
}

.site-footer__col {
	flex: 0 1 auto;
	min-width: 0;
}

/* A Kapcsolat oszlop záró mondata ne nyújtsa szét az oszlopot. */
.site-footer__col .site-footer__note { max-width: 16rem; }

/* Keskeny képernyőn a szétfeszítés csúnya közöket hagyna az utolsó sorban. */
@media (max-width: 760px) {
	.site-footer__cols {
		justify-content: flex-start;
		gap: 1.75rem 2.5rem;
	}
}

/* Viki: az oszlopcímek egybeolvadtak a linkekkel, ezért nagyobbak és
   levegősebbek, a linkek pedig egy hajszállal kisebbek (2026-10-10). */
.site-footer__title { font-size: 1.15rem; font-weight: 600; letter-spacing: .01em; margin-bottom: 1rem; }

.footer-nav__list { list-style: none; margin: 0; padding: 0; }
.footer-nav__list li { margin-bottom: .35rem; font-size: .95rem; }
.footer-nav__list a { text-decoration: none; }
.footer-nav__list a:hover { text-decoration: underline; }

.site-footer__bottom {
	border-top: 1px solid var(--zz-line);
	margin-top: 2rem;
	padding-top: 1rem;
	font-size: .875rem;
	color: var(--zz-muted);
}
.site-footer__bottom p { margin: 0; }

/* -------------------------------------------------- Mobil */

@media (max-width: 899px) {
	.nav-toggle { display: block; order: -1; }

	.site-nav {
		position: absolute;
		top: 100%; left: 0; right: 0;
		background: #fff;
		border-bottom: 1px solid var(--zz-line);
		box-shadow: 0 10px 24px rgba(0,0,0,.08);
		max-height: 75vh;
		overflow-y: auto;
		display: none;
		margin: 0;
	}
	.site-nav.is-open { display: block; }

	.site-nav__list { flex-direction: column; align-items: stretch; gap: 0; padding: .5rem 1.25rem 1rem; }
	.site-nav__list > li { border-bottom: 1px solid var(--zz-line); }
	.site-nav__list a { padding: .75rem 0; }

	.site-nav__list .sub-menu {
		position: static;
		opacity: 1; visibility: visible;
		display: none;
		border: 0; box-shadow: none;
		padding: 0 0 .5rem .9rem;
		min-width: 0;
	}
	.site-nav__list li.is-open > .sub-menu { display: block; }

	.site-header__inner { position: relative; min-height: 64px; }
	.site-actions { margin-left: auto; }

	.woocommerce div.product { grid-template-columns: 1fr; gap: 1.5rem; }
	.hero { padding: 2rem 0; }
}

@media (max-width: 520px) {
	.woocommerce ul.products, ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: .92rem !important; padding: .7rem .75rem .2rem !important; }
	.woocommerce ul.products li.product .price { padding: 0 .75rem; font-size: .92rem; }
	.woocommerce ul.products li.product .button { margin: .6rem .75rem .85rem; padding: .6rem 1rem; font-size: .9rem; }
}

/* -------------------------------------------------- Eredeti arculat: Ubuntu a menüben és gombokon */

.site-nav__list a,
.site-title,
.button, button, input[type="submit"],
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt {
	font-family: "Ubuntu", "Open Sans", Helvetica, Arial, sans-serif;
}

/* Az éles oldal gombjai nagybetűsek voltak (Divi: all_buttons_font_style = uppercase) */
.button, button.button, input[type="submit"],
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
	text-transform: uppercase;
	letter-spacing: .02em;
	font-size: .92rem;
}

/* Az ikongombokra és a konfigurátor apró gombjaira ez ne vonatkozzon */
.icon-btn, .nav-toggle, .zz-filter__btn, .zazita-swatch-control .button {
	text-transform: none;
	letter-spacing: 0;
}

/* -------------------------------------------------- Élő kereső */

.search-wrap { position: relative; }

/* Csak a kereső dobozán belül! A WordPress a keresési oldal <body>-jára is
   „search-results” osztályt tesz: a puszta .search-results szabálytól az egész
   oldal 520 px-es, a képernyő alá tolt dobozba került, és üresnek látszott. */
.search-wrap > .search-results {
	position: absolute;
	top: calc(100% + .5rem);
	left: 0;
	right: 0;
	/* Keskeny mezőnél is olvasható marad a lista, de nem lóg ki a képernyőből. */
	min-width: min(380px, calc(100vw - 2.5rem));
	background: #fff;
	border: 1px solid var(--zz-line);
	border-radius: 14px;
	box-shadow: 0 18px 40px rgba(38, 54, 52, .16);
	max-height: min(70vh, 520px);
	overflow-y: auto;
	/* Enélkül vízszintes gördítősáv jelent meg a hosszú terméknevek miatt. */
	overflow-x: hidden;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	z-index: 200;
	padding: .4rem;
}

.search-wrap > .search-results:empty { display: none; }

.search-result {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	align-items: center;
	gap: .7rem;
	padding: .45rem .6rem;
	border-radius: 10px;
	text-decoration: none;
	color: var(--zz-text);
}

.search-result + .search-result { border-top: 1px solid var(--zz-bg-soft); }

.search-result:hover,
.search-result:focus-visible { background: var(--zz-brand-light); outline: none; }

.search-result img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 8px;
	display: block;
}

/* A szövegoszlop nem nőhet a rács fölé, különben a hosszú név kitolja a listát. */
.search-result__body { min-width: 0; }

.search-result__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: .95rem;
	line-height: 1.3;
	font-weight: 600;
}

.search-result__price {
	display: block;
	margin-top: .15rem;
	font-size: .85rem;
	font-weight: 600;
	color: var(--zz-brand-dark);
	/* A "13 500 Ft-tól" egyben maradjon. */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.search-results__all {
	display: block;
	text-align: center;
	margin: .35rem .1rem .1rem;
	padding: .7rem;
	font-size: .9rem;
	font-weight: 600;
	color: var(--zz-brand-dark);
	border-top: 1px solid var(--zz-line);
	text-decoration: none;
}

.search-results__all:hover,
.search-results__all:focus-visible { background: var(--zz-brand-light); border-radius: 10px; outline: none; }

.search-results__empty { margin: 0; padding: 1rem; color: var(--zz-muted); font-size: .92rem; text-align: center; }

/* -------------------------------------------------- Méretezési segédlet */

.zz-size-guide {
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	padding: .75rem 1rem;
	margin-bottom: 1.5rem;
	background: var(--zz-bg-soft);
}
.zz-size-guide summary { cursor: pointer; font-weight: 600; }
.zz-size-guide__body { padding-top: .6rem; }
.zz-size-guide__body p:last-child { margin-bottom: 0; }

/* Ár, ha egyeztetés után dől el */
.price--custom { font-weight: 600; color: var(--zz-muted) !important; font-size: 1.05rem; }

/* Hosszú termékleírás: 1,6-os sorköz (stratégia 5.4) */
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel { line-height: 1.6; }

/* -------------------------------------------------- Készlet-jelvény és szűrő */

.zz-badge {
	display: inline-block;
	padding: .18em .6em;
	border-radius: 999px;
	font-size: .75rem;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: .01em;
}

.zz-badge--stock { background: var(--zz-brand); color: var(--zz-text); }   /* világos fő szín, sötét szöveg */
.zz-badge--mto   { background: var(--zz-accent); color: var(--zz-text); }  /* mustár, sötét szöveg */

.woocommerce ul.products li.product .zz-badge { margin: .85rem 1rem 0; }

.zz-badge-row { display: flex; align-items: center; gap: .6rem; margin-bottom: .75rem; }
.zz-badge-note { color: var(--zz-muted); font-size: .9rem; }

.zz-filterbar { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1.5rem; }

.zz-filterbar__btn {
	border: 1px solid var(--zz-line);
	border-radius: 999px;
	padding: .4rem .95rem;
	font-size: .9rem;
	text-decoration: none;
	color: var(--zz-text);
}
.zz-filterbar__btn:hover { border-color: var(--zz-brand); color: var(--zz-text); }
.zz-filterbar__btn.is-active {
	background: var(--zz-brand);
	border-color: var(--zz-brand);
	color: var(--zz-text);
	font-weight: 600;
}

/* -------------------------------------------------- Kiegészítő sáv */

.utility-bar {
	background: var(--zz-brand-dark);
	color: #fff;
	font-size: .82rem;
}

.utility-bar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 36px;
}

.utility-bar__promise { margin: 0; }

.utility-nav__list {
	display: flex;
	gap: 1.1rem;
	list-style: none;
	margin: 0; padding: 0;
}
.utility-nav__list a { color: #fff; text-decoration: none; opacity: .92; }
.utility-nav__list a:hover { opacity: 1; text-decoration: underline; color: #fff; }

/* A fejléc a kiegészítő sáv alatt ragad meg */
.site-header { top: 0; }

/* A kiegészítő linkek mobilon a menübe csúsznak */
.site-nav__utility { display: none; }
.site-nav__utility-list { list-style: none; margin: 0; padding: .5rem 0 0; }
.site-nav__utility-list a { display: block; padding: .6rem 0; color: var(--zz-muted); text-decoration: none; }

/* -------------------------------------------------- Lábléc oszlopok */

.site-footer__note { font-size: .9rem; color: var(--zz-muted); }

@media (max-width: 899px) {
	.utility-bar__inner { min-height: 34px; }
	.utility-nav { display: none; }              /* mobilon a menüben van */
	.site-nav__utility { display: block; padding: 0 1.25rem 1rem; }
}

/* -------------------------------------------------- Tartalomkeret és címsorok */

/* Minden fő nézet keretben ül, a hero és a sávok kivételével. */
.site-main > .container { padding-top: .5rem; }

.page-title,
.woocommerce-products-header__title,
.woocommerce div.product .product_title { margin-bottom: 1rem; }

.woocommerce-products-header { margin-bottom: .5rem; }

/* A rendezés és a találatszám egy sorban, a rácstól elválasztva */
.woocommerce .woocommerce-result-count { margin: 0 0 1.25rem; font-size: .92rem; }
.woocommerce .woocommerce-ordering { margin: 0 0 1.5rem; }
.woocommerce .woocommerce-ordering select { width: auto; min-width: 220px; }

@media (min-width: 768px) {
	.woocommerce-notices-wrapper + .zz-filterbar,
	.zz-filterbar { margin-bottom: 1.25rem; }

	.woocommerce .woocommerce-result-count { float: left; }
	.woocommerce .woocommerce-ordering { float: right; }
	.woocommerce ul.products { clear: both; }
}


/* Az aloldalak tartalma a konténer teljes szélességét kitölti - nincs külön
   szűk szövegoszlop. A hosszú szövegeknél a bekezdések így is olvashatók
   maradnak, mert a konténer maga korlátozott (--zz-max).*/
.entry-content { max-width: none; }
.entry-content img { border-radius: var(--zz-radius); }

/* Kéthasábos elrendezés oldalon belül (pl. Kapcsolat: űrlap + elérhetőségek).
   A tartalom kitölti a konténert, de nem egyetlen, túl széles oszlopban. */
.entry-content .zz-cols {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 3vw, 3.25rem);
	align-items: start;
}

.entry-content .zz-cols__side {
	background: var(--zz-brand-light);
	border-radius: 14px;
	padding: 1.5rem 1.5rem .25rem;
}
.entry-content .zz-cols__side > h2:first-child { margin-top: 0; }
.entry-content .zz-cols > * > *:last-child { margin-bottom: 1.25rem; }

/* Az oldalsáv címei kisebbek, mint a fő hasáb címei - különben egyenrangúnak
   látszanak, pedig kiegészítő információk. */
.entry-content .zz-cols__side h2 { font-size: 1.05rem; margin: 1.75rem 0 .5rem; }
.entry-content .zz-cols__side p,
.entry-content .zz-cols__side li { font-size: .95rem; }

@media (max-width: 860px) {
	.entry-content .zz-cols { grid-template-columns: 1fr; }
}

/* Aloldal fejrésze: halvány sáv a cím alatt, hogy a tartalom ne közvetlenül a
   menü alatt kezdődjön. Ugyanez fut a keresésen, az archívumon és a 404-en is. */
.page-head {
	background: linear-gradient(180deg, var(--zz-brand-light) 0%, #f6f2ec 100%);
	padding: clamp(2.25rem, 1.25rem + 3vw, 3.75rem) 0;
	margin-bottom: clamp(2.25rem, 1.25rem + 2.5vw, 3.5rem);
}

.page-head__title {
	font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem);
	line-height: 1.2;
	margin: 0;
}

.page-head__lead {
	font-size: clamp(1rem, .96rem + .25vw, 1.12rem);
	color: #44504e;
	max-width: none;
	margin: .75rem 0 0;
}

.page-head__actions { display: flex; gap: .75rem; flex-wrap: wrap; margin: 1.5rem 0; }

/* Keresési találatok csoportcímei (Termékek / Oldalak). */
.search-group__title { font-size: 1.15rem; margin: 0 0 1rem; }
.search-group__title + .woocommerce { margin-bottom: 2.5rem; }
article.entry + article.entry { margin-top: 1.75rem; padding-top: 1.75rem; border-top: 1px solid var(--zz-line); }

/* Szövegoldalak tipográfiája: legyen levegő a bekezdések és a címek körül. */
.entry-content > h2 { font-size: 1.35rem; margin: 2.25rem 0 .75rem; }
.entry-content > h3 { font-size: 1.12rem; margin: 1.75rem 0 .5rem; }
.entry-content > h2:first-child,
.entry-content > h3:first-child { margin-top: 0; }
.entry-content p { margin: 0 0 1.1rem; }
.entry-content ul, .entry-content ol { margin: 0 0 1.25rem; padding-left: 1.25rem; }
.entry-content li { margin-bottom: .4rem; }
.entry-content li::marker { color: var(--zz-brand-dark); }
.entry-content > *:last-child { margin-bottom: 0; }

/* Portré a szöveg mellett (Rólam oldal). Keskeny képernyőn a szöveg fölé kerül. */
.entry-content img.zz-portrait {
	float: right;
	width: min(260px, 40%);
	margin: 0 0 1.25rem 1.75rem;
	border-radius: 14px;
	box-shadow: 0 10px 26px rgba(38, 54, 52, .16);
}

@media (max-width: 640px) {
	.entry-content img.zz-portrait { float: none; width: 100%; margin: 0 0 1.5rem; }
}

/* Lapozó */
.woocommerce nav.woocommerce-pagination ul,
.pagination .nav-links { margin-top: 1.5rem; }

/* -------------------------------------------------- WooCommerce rács-javítások */

/* A WooCommerce clearfix pszeudo-elemei rácsban önálló cellát foglalnának el,
   ezért csúszott el az első termék. */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
ul.products::before,
ul.products::after { content: none !important; display: none !important; }

/* A WooCommerce a találatszámot és a rendezést úsztatja - mobilon ez elrontja a sort. */
@media (max-width: 767px) {
	.woocommerce .woocommerce-result-count,
	.woocommerce .woocommerce-ordering { float: none !important; width: 100%; }
	.woocommerce .woocommerce-ordering select { width: 100%; min-width: 0; }
}

/* Termékkártya: a jelvény, a cím és az ár egy tengelyen álljon */
ul.products li.product {
	padding-bottom: .25rem;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .zz-badge { align-self: flex-start; }

.woocommerce ul.products li.product .price {
	margin: .1rem 0 0;
	padding: 0 1rem .25rem;
}

/* -------------------------------------------------- Termékkártya: egységes belső margó */

:root { --zz-card-pad: 1rem; }

.woocommerce ul.products li.product .zz-badge,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .button {
	margin-left: var(--zz-card-pad) !important;
	margin-right: var(--zz-card-pad) !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.woocommerce ul.products li.product .zz-badge { margin-top: .8rem !important; margin-bottom: .4rem !important; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { margin-bottom: .15rem !important; padding-top: 0 !important; }
.woocommerce ul.products li.product .price { margin-bottom: .75rem !important; }
.woocommerce ul.products li.product .button { margin-top: auto !important; margin-bottom: var(--zz-card-pad) !important; }

.woocommerce ul.products li.product .price--custom { font-size: .95rem; }

@media (max-width: 520px) {
	:root { --zz-card-pad: .75rem; }

	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: .9rem !important; }
	.woocommerce ul.products li.product .price,
	.woocommerce ul.products li.product .price--custom { font-size: .85rem !important; }
	.woocommerce ul.products li.product .button { font-size: .8rem; padding: .55rem .7rem; text-align: center; }
	.zz-badge { font-size: .68rem; }
}

/* A WooCommerce a kártya tartalmát középre igazítja - nálunk balra áll. */
.woocommerce ul.products li.product,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price--custom,
.woocommerce ul.products li.product .zz-badge { text-align: left !important; }

/* Egymásba ágyazott ár-elem ne kapjon még egy margót. */
.woocommerce ul.products li.product .price .price,
.woocommerce ul.products li.product .price .price--custom { margin-left: 0 !important; margin-right: 0 !important; }

/* -------------------------------------------------- Termékgaléria */

/* A galéria doboza nem lóghat ki, a BELSŐ sáv (__wrapper) viszont igen:
   a flexslider inline szélességet ad neki (képek száma x egy kép szélessége),
   és azon csúsztatja a képeket. Egy max-width: 100% itt visszanyomná a sávot a
   látható szélességre, a képek egymásra torlódnának, és a bélyegképre kattintva
   nem jönne be a következő kép. */
.woocommerce div.product .woocommerce-product-gallery {
	max-width: 100%;
}

.woocommerce div.product .woocommerce-product-gallery__image {
	position: relative;
	overflow: hidden;
	border-radius: var(--zz-radius);
}

.woocommerce div.product .woocommerce-product-gallery__image img { width: 100%; height: auto; display: block; }
.woocommerce div.product .woocommerce-product-gallery img.zoomImg { max-width: none; }

/* Bélyegképek sora.
   A kijelölőbe bele kell venni a div.images-t is: a WooCommerce saját
   `div.product div.images .flex-control-thumbs { margin: 0 }` szabálya
   egyébként erősebb, és a főkép alá tapasztaná a bélyegképeket. */
.woocommerce div.product div.images .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
	gap: .7rem;
	margin: 1.25rem 0 0 !important;
	padding: 0;
	list-style: none;
}
.woocommerce div.product div.images .flex-control-thumbs li { width: auto !important; margin: 0 !important; float: none !important; }
.woocommerce div.product div.images .flex-control-thumbs img {
	width: 100%; aspect-ratio: 1; object-fit: cover;
	border-radius: 6px; border: 1px solid var(--zz-line); opacity: .75;
}
.woocommerce div.product div.images .flex-control-thumbs img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs img:hover { opacity: 1; border-color: var(--zz-brand); }

/* Nagyítás gomb */
.woocommerce div.product .woocommerce-product-gallery__trigger { z-index: 5; }

/* -------------------------------------------------- Variációs választó */

.woocommerce div.product form.cart .variations {
	width: 100%;
	margin-bottom: 1rem;
	border-collapse: separate;
	border-spacing: 0 .5rem;
}
.woocommerce div.product form.cart .variations th.label {
	text-align: left;
	padding-right: .75rem;
	vertical-align: middle;
	font-weight: 600;
	width: 35%;
}
.woocommerce div.product form.cart .variations td.value select { width: 100%; }
.woocommerce div.product form.cart .reset_variations { display: inline-block; margin-top: .35rem; font-size: .9rem; }
.woocommerce div.product form.cart .single_variation_wrap .woocommerce-variation-price { margin-bottom: .75rem; }

/* Mennyiség és kosárgomb egy sorban */
.woocommerce div.product form.cart { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem; }
.woocommerce div.product form.cart > * { flex: 0 0 auto; }
.woocommerce div.product form.cart .variations,
.woocommerce div.product form.cart .zz-config,
.woocommerce div.product form.cart .zz-size-guide,
.woocommerce div.product form.cart .single_variation_wrap { flex: 1 0 100%; }
/* Ajándékutalvány: az összegválasztó és az utalvány-űrlap saját, teljes sort kap.
   A flex alapértelmezett min-width: auto értéke miatt mobilon kiszélesítették a lapot. */
.woocommerce div.product form.cart > .nyp,
.woocommerce div.product form.cart > .woocommerce_gc_giftcard_form { flex: 1 1 100%; min-width: 0; max-width: 100%; }
.woocommerce div.product form.cart div.quantity input { width: 5rem; text-align: center; }

/* -------------------------------------------------- Kosár */

.woocommerce-cart .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 2rem;
	align-items: start;
}

.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper,
.woocommerce-cart .woocommerce > .woocommerce-message,
.woocommerce-cart .woocommerce > .woocommerce-error { grid-column: 1 / -1; }

.woocommerce-cart form.woocommerce-cart-form { min-width: 0; }

.woocommerce-cart .cart-collaterals,
.woocommerce-cart .cart-collaterals .cart_totals {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
}

.woocommerce-cart .cart-collaterals .cart_totals {
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	padding: 1.25rem;
	background: var(--zz-bg-soft);
}
.woocommerce-cart .cart-collaterals .cart_totals h2 { font-size: 1.1rem; margin-bottom: .75rem; }
.woocommerce-cart .cart-collaterals .cart_totals table { border: 0; }
.woocommerce-cart .cart-collaterals .cart_totals table th { background: transparent; padding-left: 0; }
.woocommerce-cart .checkout-button { display: block; text-align: center; margin-top: .75rem; }

.woocommerce table.shop_table td,
.woocommerce table.shop_table th { padding: .85rem .75rem; }
.woocommerce table.shop_table img { width: 64px; height: 64px; object-fit: cover; border-radius: 6px; }
.woocommerce table.shop_table .product-name a { font-weight: 600; text-decoration: none; }
.woocommerce table.shop_table dl.variation { margin: .35rem 0 0; font-size: .88rem; color: var(--zz-muted); }
.woocommerce table.shop_table dl.variation dt { font-weight: 600; float: left; clear: left; margin-right: .35rem; }
.woocommerce table.shop_table dl.variation dd { margin: 0; }
.woocommerce table.shop_table dl.variation dd p { margin: 0; }

.woocommerce .cart .actions .coupon { display: flex; gap: .5rem; flex-wrap: wrap; }
.woocommerce .cart .actions .coupon input { width: auto; flex: 1 1 200px; }

/* Pénztár */
.woocommerce-checkout .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 2rem; align-items: start; }
.woocommerce-checkout .woocommerce > .woocommerce-notices-wrapper,
.woocommerce-checkout form.checkout_coupon,
.woocommerce-checkout .woocommerce-form-login-toggle,
.woocommerce-checkout .woocommerce-form-coupon-toggle { grid-column: 1 / -1; }
.woocommerce-checkout form.checkout { display: contents; }
.woocommerce-checkout #customer_details { min-width: 0; }
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review { grid-column: 2; }
.woocommerce-checkout #order_review {
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	padding: 1.25rem;
	background: var(--zz-bg-soft);
}
.woocommerce-checkout .form-row { margin-bottom: 1rem; }
.woocommerce-checkout .form-row label { display: block; font-weight: 600; margin-bottom: .3rem; font-size: .92rem; }

@media (max-width: 899px) {
	.woocommerce-cart .woocommerce,
	.woocommerce-checkout .woocommerce { grid-template-columns: 1fr; }
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review { grid-column: 1; }
}

/* A kosár és a pénztár oszlophelyei legyenek egyértelműek, ne a DOM-sorrend döntsön. */
.woocommerce-cart .woocommerce > * { grid-column: 1 / -1; }
.woocommerce-cart .woocommerce > form.woocommerce-cart-form { grid-column: 1; grid-row: 2; }
.woocommerce-cart .woocommerce > .cart-collaterals { grid-column: 2; grid-row: 2; }

@media (max-width: 899px) {
	.woocommerce-cart .woocommerce > form.woocommerce-cart-form,
	.woocommerce-cart .woocommerce > .cart-collaterals { grid-column: 1; grid-row: auto; }
}

/* A kényelmes olvasási szélesség a szöveges oldalakra való, a bolti nézetekre nem. */
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content,
.woocommerce-account .entry-content,
.woocommerce-page .entry-content { max-width: none; }

/* Pénztár: bal oldalon az adatok, jobb oldalon a rendelés összegzése. */
.woocommerce-checkout .woocommerce > *:not(form.checkout) { grid-column: 1 / -1; }
.woocommerce-checkout #customer_details { grid-column: 1; grid-row: 2 / span 2; }
.woocommerce-checkout #order_review_heading { grid-column: 2; grid-row: 2; margin-top: 0; }
.woocommerce-checkout #order_review { grid-column: 2; grid-row: 3; }

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 { width: 100%; float: none; }
.woocommerce-checkout #customer_details .col2-set { display: grid; gap: 1.5rem; }

@media (max-width: 899px) {
	.woocommerce-checkout #customer_details,
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review { grid-column: 1; grid-row: auto; }
}

/* -------------------------------------------------- Jelvény és gomb belső margója
   A kártyák bal széléhez igazításnál korábban kinulláztam a vízszintes paddinget,
   ami a jelvény és a gomb saját belső margóját is elvitte. Itt visszakapják. */

.woocommerce ul.products li.product .zz-badge {
	padding: .3em .7em !important;
	line-height: 1.45;
}

.woocommerce ul.products li.product .button {
	padding: .7rem 1.25rem !important;
	line-height: 1.25;
}

/* A termékoldali jelvény is kapja meg ugyanezt. */
.zz-badge { padding: .3em .7em; }

@media (max-width: 520px) {
	.woocommerce ul.products li.product .zz-badge { padding: .28em .6em !important; }
	.woocommerce ul.products li.product .button { padding: .6rem .9rem !important; }
}

/* Elfogyott: se nem készleten, se nem rendelésre készül. */
.zz-badge--out { background: #efeceb; color: #6b6560; }
.woocommerce ul.products li.product.outofstock a img { opacity: .82; }

/* -------------------------------------------------- Két út a termékoldalon */

.zz-ways { margin: 0 0 1.5rem; }

.zz-ways__switch {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .6rem;
	margin-bottom: 1.1rem;
}

.zz-way {
	display: block;
	text-align: left;
	background: #fff;
	color: var(--zz-text);
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	padding: .7rem .9rem;
	cursor: pointer;
	font: inherit;
}
.zz-way:hover { border-color: var(--zz-brand); background: #fff; color: var(--zz-text); }
.zz-way.is-active {
	border-color: var(--zz-brand-dark);
	background: var(--zz-brand-light);
	box-shadow: inset 0 0 0 1px var(--zz-brand-dark);
}
.zz-way__title { display: block; font-weight: 600; }
.zz-way__note { display: block; font-size: .85rem; color: var(--zz-muted); margin-top: .1rem; }

/* Kész darabok */
.zz-pieces { display: grid; gap: .5rem; }

.zz-piece {
	display: flex;
	align-items: center;
	gap: .8rem;
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	padding: .5rem .7rem;
}
.zz-piece.is-out { opacity: .62; }

.zz-piece__img { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 6px; overflow: hidden; display: block; }
.zz-piece__img img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; }

.zz-piece__body { flex: 1 1 auto; min-width: 0; }
.zz-piece__name { display: block; font-weight: 600; text-decoration: none; color: var(--zz-text); }
.zz-piece__name:hover { color: var(--zz-brand-dark); }
.zz-piece__price { font-size: .93rem; }
.zz-piece__price .price--custom { font-size: .93rem; }

.zz-piece__buy { flex: 0 0 auto; padding: .5rem 1rem !important; font-size: .9rem; }
.zz-piece__out { flex: 0 0 auto; font-size: .88rem; color: var(--zz-muted); }

.zz-pieces__hint { margin: .4rem 0 0; font-size: .92rem; color: var(--zz-muted); }

.zz-link {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	color: var(--zz-brand-dark);
	text-decoration: underline;
	cursor: pointer;
}

.zz-piece-back {
	background: var(--zz-brand-light);
	border-radius: var(--zz-radius);
	padding: .6rem .8rem;
	font-size: .93rem;
	margin-bottom: 1rem;
}

@media (max-width: 560px) {
	.zz-ways__switch { grid-template-columns: 1fr; }
}

/* Ár nélküli, még be nem állított rendelésre készülő termék */
.zz-unpriced {
	background: var(--zz-bg-soft);
	border: 1px dashed var(--zz-line);
	border-radius: var(--zz-radius);
	padding: 1rem 1.1rem;
	margin: 0 0 1.25rem;
}
.zz-unpriced p:last-child { margin-bottom: 0; }

/* Bolti szűrők */
.zz-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: .75rem;
	margin: 0 0 1.5rem;
	padding: .9rem 1rem;
	background: var(--zz-bg-soft);
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
}
.zz-filters__field { display: flex; flex-direction: column; gap: .25rem; font-size: .88rem; }
.zz-filters__field > span:first-child { font-weight: 600; }
.zz-filters__field select { width: auto; min-width: 160px; }
.zz-filters__range { display: flex; gap: .35rem; }
.zz-filters__range input { width: 100px; }
.zz-filters__submit { padding: .55rem 1.1rem !important; }
.zz-filters__reset { align-self: center; font-size: .88rem; }

@media (max-width: 560px) {
	.zz-filters { flex-direction: column; align-items: stretch; }
	.zz-filters__field select, .zz-filters__range input { width: 100%; }
}

/* ==================================================================
   Kezdőlap
   ================================================================== */

.hero {
	background: linear-gradient(180deg, #fff 0%, var(--zz-brand-light) 100%);
	padding: clamp(3rem, 1.5rem + 6vw, 6rem) 0;
	margin-bottom: 0;
	text-align: center;
}

.hero__inner { max-width: 760px; }

.hero__eyebrow {
	text-transform: uppercase;
	letter-spacing: .12em;
	font-size: .78rem;
	font-weight: 600;
	color: var(--zz-brand-dark);
	margin: 0 0 .9rem;
}

.hero__title {
	font-size: clamp(2rem, 1.2rem + 3.4vw, 3.6rem);
	line-height: 1.1;
	letter-spacing: -.01em;
	margin: 0 0 1.15rem;
}

.hero__text {
	font-size: clamp(1rem, .95rem + .4vw, 1.2rem);
	color: #44504e;
	max-width: 34em;
	margin: 0 auto 1.75rem;
}

.hero__actions { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin: 0; }

/* Kétoszlopos fejrész, ha a tulaj beállított képet a Testreszabóban.
   Kép nélkül a fenti, középre zárt változat marad érvényben.

   A kép nem dobozban ül, hanem kifut a képernyő jobb széléig, és maszkkal
   olvad bele a háttérbe - ettől lesz a fejrész látványos, nem "képecske
   szöveg mellett". */
.hero--split {
	position: relative;
	overflow: hidden;
	text-align: left;
	min-height: clamp(400px, 60vh, 620px);
	display: flex;
	align-items: center;
}

/* A belső konténer NEM lehet pozicionált: a képet a szakaszhoz képest
   helyezzük el, hogy kifuthasson a képernyő széléig. Ha ide kerülne a
   position: relative, a kép a konténer jobb szélénél megállna. */
.hero--split .hero__inner {
	max-width: var(--zz-max);
	width: 100%;
}

.hero--split .hero__text-col {
	max-width: min(560px, 50%);
	position: relative;
	z-index: 1;
}
.hero--split .hero__text { margin-left: 0; margin-right: 0; }
.hero--split .hero__actions { justify-content: flex-start; }

/* Mustársárga vonalka a felső felirat előtt - egy pici márkajel. */
.hero--split .hero__eyebrow { display: flex; align-items: center; gap: .7rem; }
.hero--split .hero__eyebrow::before {
	content: "";
	width: 34px;
	height: 2px;
	background: var(--zz-accent);
	flex: none;
}

.hero--split .hero__media {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(54%, 980px);
	margin: 0;
	/* Bal széle lágyan elfogy, így nincs kemény vágás a szöveg felé. */
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 22%);
	mask-image: linear-gradient(90deg, transparent 0, #000 22%);
}

.hero--split .hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 45%;
	border-radius: 0;
	box-shadow: none;
}

/* -----------------------------------------------------------------
   Fejrész harmonikával: elmosott háttérkép + kinyíló termékkártyák
   ----------------------------------------------------------------- */


/* Fátyol a kép fölött, fehérből zsályazöldbe: a szöveg alatt szinte tiszta
   fehér (enélkül nem lenne olvasható), jobbra a márka zöldje. */
.hero--cards::after {
	content: "";
	position: absolute;
	inset: 0;
	/* A fátyol csak a szöveg mögött erős, jobbra teljesen elfogy: ott a fotó
	   a saját színeiben látszik. */
	background: linear-gradient(100deg,
		rgba(255, 255, 255, .96) 0 24%,
		rgba(255, 255, 255, .82) 36%,
		rgba(238, 243, 242, .35) 50%,
		rgba(238, 243, 242, 0) 64%);
	z-index: 0;
}

/* A képernyő szélétől mért belső margó: ettől indul a szöveg. */
.hero--cards { --zz-hero-edge: clamp(1.25rem, 6vw, 7rem); }

/* Asztali nézetben a fejléccel és a menüvel együtt pont kitölti a képernyőt
   (Regina kérése, 2026-09-18): a magasság a képernyő mínusz a hero feletti
   rész (a --zz-hero-top-ot a site.js méri), a szöveg függőlegesen középen. */
@media (min-width: 861px) {
	.hero--cards {
		min-height: 0;
		height: calc(100vh - var(--zz-hero-top, 210px));
		height: calc(100svh - var(--zz-hero-top, 210px));
		min-height: 420px;
		padding-block: clamp(1.25rem, 3.5vh, 2.75rem);
	}
	.hero--cards .hero__title { font-size: clamp(2rem, 1.2rem + 2.5vw, 3.1rem); margin-bottom: .85rem; }
	.hero--cards .hero__text { margin-bottom: 1.25rem; }
	.hero--cards .hero__badge { width: clamp(96px, 8vw, 128px); bottom: clamp(1.25rem, 4vh, 2.5rem); }
}

/* Kisebb asztali szélességen (laptop, álló tablet) a szöveg több helyet kap,
   a cím pedig kisebb - különben öt sorra törne. */
@media (min-width: 861px) and (max-width: 1279px) {
	.hero--cards .hero__title { font-size: clamp(2rem, 3.4vw, 2.7rem); }
	.hero--cards .hero__text-col { max-width: min(560px, 58vw); }
}

/* A szalag nem a rács jobb hasábjában ül, hanem a szövegoszlop szélétől a
   képernyő jobb pereméig fut - így a kártyák tényleg a képernyő széléről
   jönnek be, nem egy hasáb közepéről bukkannak elő.
   A belső konténer ezért NEM lehet pozicionált (különben ahhoz igazodna).

   A szöveg sem a középső, 1240 px-es konténerben ül, hanem a képernyő bal
   szélétől indul, és kitölti a bal oldalt egészen a szalagig. */
.hero--cards .hero__inner {
	display: block;
	z-index: 1;
	max-width: none;
	padding-left: var(--zz-hero-edge);
	padding-right: 0;
}

.hero--cards .hero__text-col {
	/* A háttér most végig fotó: a szöveg sávja szűkebb, így a fehér fátyol
	   mögött marad, és nem fut bele a képbe. */
	max-width: min(620px, 52vw);
	position: relative;
	z-index: 2;
}

/* A fejrész háttere: termékfotók váltakoznak.

   Öt kép, egyenként hat másodpercig, körben - ezért a képkockák 20 százalékos
   szakaszokra épülnek, és minden réteg a sorszámával késleltetve indul (a
   késleltetés a sablonban, rétegenként). Ha öt fotónál kevesebb van, a sablon
   ismétli a listát, különben üres szakasz maradna a körben. */
.hero__slides {
	position: absolute;
	inset: 0;
	overflow: hidden;
	z-index: 0;
	/* Alátét (a sablon az első fotót teszi ide): két kép áttűnése közben
	   mindkét réteg félig átlátszó, enélkül ott kivilágosodna a háttér. */
	background-size: cover;
	background-position: center 45%;
}

.hero__slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center 45%;
	opacity: 0;
	will-change: opacity, transform;
	animation: zz-hero-fade 30s linear infinite, zz-hero-drift 30s ease-in-out infinite;
}

@keyframes zz-hero-fade {
	0%   { opacity: 0; }
	3%   { opacity: 1; }
	18%  { opacity: 1; }
	21%  { opacity: 0; }
	100% { opacity: 0; }
}

/* Az első kép rögtön látszik (nem úszik be): ez a képernyő legnagyobb eleme,
   a beúszással a böngésző (és a PageSpeed LCP-mérése) 3 mp-et várt rá. A kör
   végén ugyanúgy visszaúszik, mint a többi kép. */
.hero__slide:first-child {
	opacity: 1;
	animation-name: zz-hero-fade-first, zz-hero-drift;
}

@keyframes zz-hero-fade-first {
	0%   { opacity: 1; }
	18%  { opacity: 1; }
	21%  { opacity: 0; }
	97%  { opacity: 0; }
	100% { opacity: 1; }
}

/* Nagyon lassú ráközelítés: ettől él a kép, de nem vonja el a figyelmet. */
@keyframes zz-hero-drift {
	0%   { transform: scale(1.04); }
	21%  { transform: scale(1.1); }
	100% { transform: scale(1.04); }
}

/* A képek a sablonból CSS-változóként jönnek, két méretben: nagy képernyőre
   az 1024 px-es, mobilra a 768 px-es. A 2-5. kép csak az oldal betöltése után
   kap hátteret (hero--loaded), így nem versenyez az első képpel. */
.hero__slides,
.hero__slide { background-image: var(--zz-bg-l); }

.hero:not(.hero--loaded) .hero__slide:not(:first-child) { background-image: none; }

@media (max-width: 860px) {
	.hero__slides,
	.hero__slide { background-image: var(--zz-bg-s); }
	.hero:not(.hero--loaded) .hero__slide:not(:first-child) { background-image: none; }
}

@media (prefers-reduced-motion: reduce) {
	/* Mozgás nélkül az első fotó marad állóképként. */
	.hero__slide { animation: none; opacity: 0; }
	.hero__slide:first-child { animation: none; opacity: 1; }
}

@media (max-width: 860px) {
	.hero--cards .hero__inner { grid-template-columns: 1fr; padding-right: var(--zz-hero-edge); }
	/* Mobilon a fotó a szöveg mögött van, ezért erősebb a fátyol (lásd alább). */
	.hero.hero--cards { padding-bottom: 3rem; min-height: 70vh; }
	.hero__slide { background-position: center 40%; }
	.hero--cards::after {
		background: linear-gradient(180deg, rgba(255, 255, 255, .95) 0 45%, rgba(132, 163, 160, .6) 100%);
	}

}

@media (max-width: 860px) {
	.hero--split {
		display: block;
		min-height: 0;
		text-align: center;
		padding-bottom: 0;
	}
	.hero--split .hero__text-col { max-width: none; }
	.hero--split .hero__text { margin-left: auto; margin-right: auto; }
	.hero--split .hero__actions { justify-content: center; }
	.hero--split .hero__eyebrow { justify-content: center; }

	/* Mobilon a kép a szöveg alá kerül, teljes szélességben. */
	.hero--split .hero__media {
		position: static;
		width: auto;
		margin: 2rem -1.25rem 0;
		-webkit-mask-image: none;
		mask-image: none;
	}
	.hero--split .hero__media img { height: clamp(240px, 52vw, 340px); }
}

.button--ghost {
	background: transparent !important;
	color: var(--zz-brand-dark) !important;
	box-shadow: inset 0 0 0 1px var(--zz-brand-dark);
}
.button--ghost:hover { background: rgba(78, 107, 104, .08) !important; color: var(--zz-brand-darker) !important; }

/* Szakaszok */
.section { padding: clamp(3rem, 1.5rem + 5vw, 5.5rem) 0; margin: 0; }
.section--soft { background: var(--zz-bg-soft); }
.section__title { text-align: center; margin: 0 0 3rem; }
.section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 3rem; }
.section__head .section__title { text-align: left; margin: 0; }

/* Szakasz alcíme a fejléc alatt (pl. a rendelésre készülő blokknál). */
.section__lead {
	margin: -.75rem 0 1.5rem;
	max-width: 46em;
	color: #44504e;
}

/* A két út */
.ways { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--zz-gap); }

.way {
	background: #fff;
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	padding: 2rem 1.9rem;
}
.way .zz-badge { margin-bottom: .75rem; }
.way__title { font-size: 1.2rem; margin: 0 0 .5rem; }
.way p { color: #4b5250; }
.way__link { font-weight: 600; text-decoration: none; }
.way__link:hover { text-decoration: underline; }

/* Folyamat - kártyák, a számokat összekötő vonallal */
.steps {
	/* A sorszámok 20 px-rel kilógnak a kártyák tetejéből, ezért a rács külön
	   felső levegőt kap - különben a szakasz címe a körökre tapad.
	   Padding és nem margó: a margó összeolvadna a címsor alsó margójával. */
	padding-top: 1.5rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 2.25rem 1.5rem;
	list-style: none;
	margin: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}

.step {
	position: relative;
	background: #fff;
	border: 1px solid rgba(78, 107, 104, .16);
	border-radius: 14px;
	padding: 2.75rem 1.85rem 2rem;
	box-shadow: 0 2px 10px rgba(38, 54, 52, .05);
}

.step__num {
	position: absolute;
	top: -20px;
	left: 1.5rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: var(--zz-brand-dark);
	color: #fff;
	font-weight: 700;
	font-size: 1.05rem;
	/* A fehér gyűrű kitakarja mögötte az összekötő vonalat. */
	box-shadow: 0 0 0 6px #fff;
}


.step__title { font-size: 1.05rem; margin: 0 0 .4rem; }
.step__text { color: #4b5250; margin: 0; }

/* Miért mi - ikonos kártyák */
.usps {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1.5rem;
}

.usp {
	background: #fff;
	border: 1px solid rgba(78, 107, 104, .14);
	border-radius: 14px;
	padding: 2rem 1.85rem;
	box-shadow: 0 2px 10px rgba(38, 54, 52, .05);
}

.usp__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px; height: 46px;
	border-radius: 12px;
	background: var(--zz-brand-light);
	color: var(--zz-brand-dark);
	margin-bottom: 1rem;
}
.usp__icon svg { width: 24px; height: 24px; display: block; }

.usp__title {
	font-size: 1.05rem;
	margin: 0 0 .4rem;
	/* A korábbi mustársárga bal szegély helyett az ikon adja a hangsúlyt. */
	padding-left: 0;
	border-left: 0;
}
.usp__text { color: #4b5250; margin: 0; }

/* Bemutatkozás */
.about--split {
	display: grid;
	grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 3vw, 3.25rem);
	align-items: center;
	/* A blokk maga keskenyebb a konténernél és középre kerül: így a szöveg
	   sorhossza olvasható marad, és mégsem marad "elfogyott" üres sáv a
	   jobb szélén. */
	max-width: 1040px;
	margin: 0 auto;
}

.about__eyebrow {
	text-transform: uppercase;
	letter-spacing: .12em;
	font-size: .76rem;
	font-weight: 600;
	color: var(--zz-brand-dark);
	margin: 0 0 .6rem;
}

.about__sign {
	margin: 1.25rem 0 0;
	font-style: italic;
	color: #55605e;
}

.about__media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: center 20%;
	border-radius: 14px;
	box-shadow: 0 12px 30px rgba(38, 54, 52, .16);
}

.about__title { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2.1rem); margin: 0 0 1rem; }

.about__body p {
	color: #44504e;
	font-size: clamp(1rem, .97rem + .2vw, 1.08rem);
	line-height: 1.65;
	margin: 0 0 1rem;
	/* Nincs külön szűkítés: a hasáb szélessége adja a sorhosszt. */
	max-width: none;
}

.about__actions { margin: 1.5rem 0 0; }

@media (max-width: 860px) {
	.about--split { grid-template-columns: 1fr; }
	/* Mobilon a fotó a szöveg fölé kerül, de ne foglalja el a fél képernyőt. */
	.about__media img { max-width: 260px; margin: 0 auto; }
}

/* Vélemények */
.reviews { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--zz-gap); }

.review {
	margin: 0;
	background: #fff;
	border: 1px solid var(--zz-line);
	border-radius: var(--zz-radius);
	padding: 1.9rem 1.9rem;
	display: flex;
	flex-direction: column;
}

.review__text {
	margin: 0 0 1rem;
	font-style: italic;
	color: #3c4442;
	quotes: "\201E" "\201D";
	flex: 1;
}
.review__text::before { content: open-quote; }
.review__text::after { content: close-quote; }

.review__name { font-weight: 600; font-size: .92rem; }

/* Záró rész */
.section--cta { background: var(--zz-brand-light); }
.cta { text-align: center; max-width: 620px; }
.cta__title { margin: 0 0 .6rem; }
.cta__text { color: #44504e; margin: 0 0 1.5rem; }

/* A kezdőlapon nincs felső tartalom-margó */
.home .site-main { padding-top: 0; padding-bottom: 0; }

/* A kategória-doboz szövegrésze blokk legyen, különben a belső margó nem érvényesül. */
.cat-card__body {
	display: block;
	padding: 1.1rem 1.15rem 1.25rem;
}
.cat-card__name { margin-bottom: .15rem; }

/* Kezdőlapi termékrács: négy oszlop, a bolti kártyákkal azonos megjelenés. */
.section .woocommerce ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 0; }
/* Négy kártya: vagy egy sorban, vagy 2×2 - soha nem 3+1, egy árva kártyával. */
@media (max-width: 1023px) {
	.section .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ==================================================================
   Termékkártya: jelvény a képen, ár és gomb egy sorban
   ================================================================== */

.woocommerce ul.products li.product,
ul.products li.product { position: relative; }

/* Jelvény a kép jobb felső sarkában */
.zz-badge-wrap {
	position: absolute;
	top: .6rem;
	right: .6rem;
	z-index: 3;
	pointer-events: none;
}

.woocommerce ul.products li.product .zz-badge-wrap .zz-badge {
	margin: 0 !important;
	box-shadow: 0 1px 6px rgba(0, 0, 0, .18);
}

/* Az akció-jelölés a bal felső sarokban marad, hogy ne ütközzenek. */
.woocommerce span.onsale, span.onsale { right: auto; left: .6rem; z-index: 3; }

/* A kártya alsó sora: ár balra, gomb jobbra */
.zz-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .6rem;
	margin: auto var(--zz-card-pad) var(--zz-card-pad) !important;
	padding: 0 !important;
}

.woocommerce ul.products li.product .zz-card__foot .price,
.woocommerce ul.products li.product .zz-card__foot .price--custom,
.zz-card__foot .price {
	margin: 0 !important;
	padding: 0 !important;
	flex: 1 1 auto;
	min-width: 0;
	font-size: 1rem;
	font-weight: 600;
}

.woocommerce ul.products li.product .zz-card__foot .button,
.zz-card__foot .button {
	margin: 0 !important;
	flex: 0 0 auto;
	white-space: nowrap;
	font-size: .85rem;
	padding: .55rem .95rem !important;
}

/* A cím kapjon levegőt, mert az ár már nem alatta van */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	margin-bottom: .75rem !important;
	padding-top: .9rem !important;
}

/* Keskeny kártyán az ár és a gomb egymás alá kerül */
@media (max-width: 640px) {
	.zz-card__foot { flex-direction: column; align-items: stretch; gap: .5rem; }
	.zz-card__foot .button { text-align: center; width: 100%; }
}

/* Az ár ne törjön két sorba a kártya alsó sorában. */
.zz-card__foot .price,
.zz-card__foot .price--custom { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Gyűjtő termék: az ide tartozó termékek listája */
.zz-pieces__title { font-size: 1.15rem; margin: 0 0 .75rem; }
.zz-piece__buy { min-width: 104px; text-align: center; }

/* ==================================================================
   Sütisáv (Compliance / Cookie Notice plugin)
   ------------------------------------------------------------------
   A plugin MARAD: a hozzájárulás előtti szkriptblokkolás és a WP Consent
   API kapcsolat jogi funkció, azt nem váltjuk ki saját kóddal. Itt csak a
   megjelenést hangoljuk a sablon arculatához: a gyári sáv sötétszürke,
   türkiz gombbal, ami kilóg a márkából.
   ================================================================== */

#cookie-notice {
	background: #f6f2ec !important;
	color: #2e3a38 !important;
	border-top: 1px solid rgba(78, 107, 104, .22);
	box-shadow: 0 -6px 24px rgba(38, 54, 52, .10);
	font-family: inherit;
}

#cookie-notice .cookie-notice-container {
	max-width: var(--zz-max);
	margin: 0 auto;
	padding: 1rem 1.25rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: .75rem 1.25rem;
}

#cookie-notice #cn-notice-text {
	color: #2e3a38;
	font-size: .92rem;
	line-height: 1.5;
	text-align: left;
	max-width: 62ch;
}

#cookie-notice .cn-button {
	font-family: inherit;
	font-size: .84rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	border-radius: 6px;
	padding: .6rem 1.15rem;
	margin: 0;
	text-shadow: none;
	box-shadow: none;
	border: 0;
}

/* Elfogadom */
#cookie-notice #cn-accept-cookie {
	background: var(--zz-brand-dark) !important;
	color: #fff !important;
}
#cookie-notice #cn-accept-cookie:hover { background: var(--zz-brand-darker) !important; }

/* Elutasítom - másodlagos, keretes gomb */
#cookie-notice #cn-refuse-cookie {
	background: transparent !important;
	color: var(--zz-brand-dark) !important;
	box-shadow: inset 0 0 0 1px var(--zz-brand-dark);
}
#cookie-notice #cn-refuse-cookie:hover { background: rgba(78, 107, 104, .08) !important; }

#cookie-notice #cn-more-info {
	background: transparent !important;
	color: #44504e !important;
	text-decoration: underline;
	padding-left: .4rem;
	padding-right: .4rem;
}

/* A visszavonó fül (Sütibeállítások módosítása).
   A plugin a KONTÉNERRE teszi rá a szövegszínt inline stílusként, amit a gomb
   is örököl - így lett sötét felirat a sötétzöld gombon. Ezért kell a gombra
   külön, felülíró szabály. */
.cookie-revoke-container { color: #2e3a38 !important; }

.cookie-revoke-container #cn-revoke-cookie,
#cn-revoke-cookie.cn-revoke-cookie {
	background: var(--zz-brand-dark) !important;
	color: #fff !important;
	font-family: inherit;
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .04em;
	border: 0;
	border-radius: 6px;
	padding: .5rem 1rem;
	text-shadow: none;
}
.cookie-revoke-container #cn-revoke-cookie:hover { background: var(--zz-brand-darker) !important; }

@media (max-width: 640px) {
	#cookie-notice .cookie-notice-container { flex-direction: column; align-items: stretch; }
	#cookie-notice #cn-notice-text { text-align: center; }
	#cookie-notice .cn-button { width: 100%; }
}

/* ==================================================================
   Fluent Forms - a kapcsolati űrlap a sablon arculatához igazítva.
   A plugin saját alapszíne kék; a mezők és a gomb a márkaszíneket kapják.
   ================================================================== */

.fluentform { --fluentform-primary: #4E6B68; --fluentform-secondary: #84A3A0; }

.fluentform .ff-el-group { margin-bottom: 1.1rem; }

.fluentform .ff-el-input--label label {
	font-weight: 600;
	font-size: .92rem;
	color: var(--zz-text);
	margin-bottom: .35rem;
}

.fluentform .ff-el-form-control {
	font-family: inherit;
	font-size: 1rem;
	padding: .7rem .85rem;
	border: 1px solid var(--zz-line);
	border-radius: 8px;
	background: #fff;
	color: var(--zz-text);
	width: 100%;
}
.fluentform .ff-el-form-control:focus {
	border-color: var(--zz-brand-dark);
	outline: 2px solid rgba(78, 107, 104, .18);
	outline-offset: 1px;
}

.fluentform textarea.ff-el-form-control { min-height: 8rem; }

.fluentform .ff-btn-submit {
	background: var(--zz-brand-dark) !important;
	color: #fff !important;
	font-family: inherit;
	font-size: .86rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	border: 0;
	border-radius: 6px;
	padding: .8rem 1.6rem;
}
.fluentform .ff-btn-submit:hover { background: var(--zz-brand-darker) !important; }

/* Kötelező mező csillaga és hibaüzenet */
.fluentform .ff-el-is-required.asterisk-right label:after { color: #b3261e; }
.fluentform .error.text-danger { color: #b3261e; font-size: .88rem; margin-top: .3rem; }

/* Sikeres beküldés visszajelzése */
.fluentform .ff-message-success,
.ff-message-success {
	background: var(--zz-brand-light);
	border: 1px solid rgba(78, 107, 104, .25);
	border-radius: 10px;
	padding: 1rem 1.15rem;
	color: var(--zz-text);
}

/* ==================================================================
   Öltésmotívum
   ------------------------------------------------------------------
   A "Hogyan készül" szakasz szaggatott összekötője adta az ötletet: a
   szaggatott vonal varrásra hasonlít. Ez a motívum végigvezetve textiljelleget
   ad az egész oldalnak. Két helyen jelenik meg:
     - öltéssor a szakaszcímek alatt (aláhúzás helyett),
     - "tűzés" a dekoratív kártyák belső szélén, mint a szegett ruhán.

   A gömbölyű öltésvégeket SVG adja: a CSS `dashed` négyszögletes szakaszokat
   rajzol, ami keményebb, gépiesebb hatású.
   ================================================================== */

:root {
	--zz-stitch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='4'%3E%3Cline x1='2' y1='2' x2='13' y2='2' stroke='%234E6B68' stroke-width='2' stroke-linecap='round' stroke-opacity='.45'/%3E%3C/svg%3E");
	/* Ugyanaz állítva: a vízszintes mintát elforgatni nem lehet, nyújtani pedig
	   eltorzítaná az öltéseket. */
	--zz-stitch-v: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='22'%3E%3Cline x1='2' y1='2' x2='2' y2='13' stroke='%234E6B68' stroke-width='2' stroke-linecap='round' stroke-opacity='.45'/%3E%3C/svg%3E");
}

/* Öltéssor a szakaszcím alatt. */
.section__title { position: relative; }

.section__title::after {
	content: "";
	display: block;
	width: 92px;
	height: 22px;
	margin: .7rem auto 0;
	background: url("../img/deco/firka-alahuzas.svg") no-repeat center / contain;
}

/* A bal oldalra igazított fejlécben (cím + "Mind" link) balra kerül. */
.section__head .section__title::after { margin-left: 0; margin-right: 0; }

/* Tűzés a dekoratív kártyák belső szélén. A termékkártyákra szándékosan NEM
   kerül: azokat a vásárló összehasonlítja, ott a nyugodt felület a jobb. */
.way,
.usp,
.review { position: relative; }

.way::after,
.usp::after,
.review::after {
	content: "";
	position: absolute;
	inset: 7px;
	border-radius: 9px;
	pointer-events: none;
	background:
		var(--zz-stitch) repeat-x top left,
		var(--zz-stitch) repeat-x bottom left;
}

/* Az oldalsó tűzés függőleges öltéssel. */
.way::before,
.usp::before,
.review::before {
	content: "";
	position: absolute;
	inset: 7px;
	border-radius: 9px;
	pointer-events: none;
	background:
		var(--zz-stitch-v) repeat-y top left,
		var(--zz-stitch-v) repeat-y top right;
}



/* ==================================================================
   Kézműves díszítés (Recraft AI elemek, 2026-09-14)
   ==================================================================
   Az elemek az assets/img/deco mappában vannak, a márkaszínekre színezve.
   Csak díszek: a tartalom nélkülük is teljes, a felolvasók nem látják őket. */

/* Az oldalcímek alatt is ugyanaz a kézírásos aláhúzás. */
.page-title::after,
.woocommerce-products-header__title::after {
	content: "";
	display: block;
	width: 84px;
	height: 20px;
	margin: .5rem 0 0;
	background: url("../img/deco/firka-alahuzas.svg") no-repeat left center / contain;
}

/* Aloldalak fejsávja: aláhúzás a cím alatt, halvány minta a háttérben. */
.page-head { position: relative; isolation: isolate; overflow: hidden; }
.page-head::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: url("../img/deco/minta-vilagos.svg") repeat center / 520px;
	opacity: .1;
	pointer-events: none;
}
.page-head__title::after {
	content: "";
	display: block;
	width: 84px;
	height: 20px;
	margin: .45rem 0 0;
	background: url("../img/deco/firka-alahuzas.svg") no-repeat left center / contain;
}
.page-head--art .container { position: relative; }
.page-head__art {
	position: absolute;
	right: var(--zz-gap);
	top: 50%;
	width: clamp(90px, 12vw, 150px);
	transform: translateY(-50%) rotate(-5deg);
}
.page-head__art img { width: 100%; height: auto; display: block; }
.page-head--art .page-head__title,
.page-head--art .page-head__lead { padding-right: clamp(100px, 14vw, 170px); }

/* Viki: keskenyebb fejlécsáv, benne a morzsamenüvel (2026-09-18). */
.page-head { padding: clamp(1rem, .6rem + 1.4vw, 1.75rem) 0 clamp(1.1rem, .7rem + 1.4vw, 1.9rem); margin-bottom: clamp(1.5rem, 1rem + 1.6vw, 2.5rem); }
.page-head__title { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); }
.page-head__title::after { height: 16px; margin-top: .3rem; }
.page-head__lead { margin-top: .5rem; }
.page-head__art { width: clamp(70px, 9vw, 112px); }
.page-head--art .page-head__title,
.page-head--art .page-head__lead { padding-right: clamp(80px, 11vw, 130px); }
/* Viki: a kategóriaoldalakon ne legyen firka-aláhúzás a cím alatt - így a
   fejlécsáv keskenyebb, a termékek hamarabb látszanak (2026-10-08). */
body.tax-product_cat .page-head__title::after { content: none; }

.breadcrumb--head { background: none; border: 0; padding: 0 0 .55rem; font-size: .82rem; }
.breadcrumb--head a, .breadcrumb--head span { color: #5b6664; }
/* Termékoldal: nincs fejlécsáv, a morzsamenü ugyanabban a mintás háttérben, keskenyen. */
.breadcrumb { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(180deg, var(--zz-brand-light) 0%, #f6f2ec 100%); border-bottom: 0; padding: .6rem 0; }
.breadcrumb::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../img/deco/minta-vilagos.svg") repeat center / 520px; opacity: .1; pointer-events: none; }
.breadcrumb--head::before { content: none; }
.breadcrumb--head { overflow: visible; }

/* Viki: a Tudnivalók oldalon kisebb betű, kevesebb görgetés. */
body.zz-page-tudnivalok .site-main { font-size: .94rem; }
body.zz-page-tudnivalok .site-main h2 { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.55rem); margin-top: 2rem; }
body.zz-page-tudnivalok .site-main h3 { font-size: 1.05rem; margin-top: 1.25rem; }
body.zz-page-tudnivalok .site-main p, body.zz-page-tudnivalok .site-main li { line-height: 1.6; }

/* Textilfüzér a hero alatti szakasz tetején - mintha a hero aljáról lógna. */
.section--ways { position: relative; }
.section--ways::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	/* Regina (2026-09-18): a bizalmi sáv alatt soknak hatott - kisebb és halványabb. */
	height: clamp(14px, .6rem + .5vw, 20px);
	background: url("../img/deco/fuzer.svg") repeat-x left top / auto 100%;
	opacity: .4;
	pointer-events: none;
}

/* Miért mi: a rajzolt ikon nagyobb, nem kell mögé doboz. */
.usp__icon {
	width: 64px;
	height: 64px;
	background: none;
	border-radius: 0;
	margin-bottom: .6rem;
}
.usp__icon img { width: 64px; height: 64px; display: block; object-fit: contain; }
.usp:hover .usp__icon img { transform: rotate(-6deg); }
.usp__icon img { transition: transform .3s ease; }

/* Lépések: ikon a kártya jobb felső sarkában. */
.step__icon {
	position: absolute;
	top: 1rem;
	right: 1.1rem;
	width: 48px;
	height: 48px;
	opacity: .9;
}
.step__icon img { width: 100%; height: 100%; object-fit: contain; display: block; }
.step__title { padding-right: 3rem; }

/* Kategóriakártya: kézzel rajzolt matrica a kép sarkában. */
.cat-card { position: relative; }
.cat-card__sticker {
	position: absolute;
	right: .5rem;
	top: .5rem;
	width: clamp(64px, 22%, 104px);
	aspect-ratio: 1;
	background: rgba(255, 255, 255, .92);
	border-radius: 50%;
	padding: .45rem;
	box-shadow: 0 4px 14px rgba(38, 54, 52, .14);
	transform: rotate(-6deg);
	transition: transform .3s ease;
	pointer-events: none;
}
.cat-card__sticker img { width: 100%; height: 100%; object-fit: contain; display: block; }
.cat-card:hover .cat-card__sticker { transform: rotate(4deg) scale(1.06); }

/* Bemutatkozás: csillanás a cím mellett. */
.about__title { position: relative; }
.about__title::after {
	content: "";
	display: inline-block;
	width: 1.3em;
	height: 1.3em;
	margin-left: .3em;
	vertical-align: -.15em;
	background: url("../img/deco/firka-csillanas.svg") no-repeat center / contain;
}

/* Vélemények: halvány, varrós minta a háttérben. */
.section--pattern { position: relative; isolation: isolate; }
.section--pattern::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: url("../img/deco/minta-vilagos.svg") repeat center / 520px;
	opacity: .05;
	pointer-events: none;
}
.review { background: #fff; }
.review__name::before {
	content: "";
	display: inline-block;
	width: .9em;
	height: .9em;
	margin-right: .4em;
	vertical-align: -.1em;
	background: url("../img/deco/firka-sziv.svg") no-repeat center / contain;
}

/* Záró rész: alvó hold illusztráció. */
.section--cta { position: relative; overflow: hidden; }
.cta__art {
	display: block;
	width: min(280px, 70%);
	height: auto;
	margin: 0 auto 1.25rem;
}

/* 404 */
.zz-deco-art { display: block; width: min(320px, 80%); height: auto; margin: 0 0 1.5rem; }

/* Lábléc: sötét zsálya, finom varrós mintával. */
.site-footer {
	position: relative;
	isolation: isolate;
	background: var(--zz-brand-dark);
	border-top: 0;
	color: #e6eeec;
}
.site-footer::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: url("../img/deco/minta-sotet.svg") repeat center / 460px;
	opacity: .18;
	pointer-events: none;
}
.site-footer a,
.site-footer .site-footer__title { color: #fff; }
.site-footer__note,
.site-footer p { color: #dce6e4; }
.site-footer__bottom { border-top-color: rgba(255, 255, 255, .18); }

@media (prefers-reduced-motion: reduce) {
	.usp__icon img,
	.cat-card__sticker { transition: none; }
}

/* ==================================================================
   Élő fejrész: hímzett kiemelés, lebegő díszek, forgó jelvény, beúszás
   ================================================================== */

/* A cím kiemelt része alá betöltéskor „rávarródik” a cérna. */
.hero__mark {
	position: relative;
	display: inline-block;
	white-space: nowrap;
	color: var(--zz-brand-dark);
}
.hero__mark-line {
	position: absolute;
	left: -2%;
	width: 104%;
	bottom: -.28em;
	height: .42em;
	overflow: visible;
	pointer-events: none;
}
.hero__mark-thread,
.hero__mark-stitch { fill: none; stroke-linecap: round; }
.hero__mark-thread {
	stroke: var(--zz-accent);
	stroke-width: 5;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation: zz-draw 1.1s cubic-bezier(.6, .1, .3, 1) 1s forwards;
}
.hero__mark-stitch {
	stroke: var(--zz-brand);
	stroke-width: 2;
	stroke-dasharray: .025 .02;
	opacity: 0;
	animation: zz-fade-in .6s ease 2s forwards;
}
@keyframes zz-draw { to { stroke-dashoffset: 0; } }
@keyframes zz-fade-in { to { opacity: 1; } }

/* Beúszás betöltéskor, sorban. */
.hero--cards .hero__eyebrow,
.hero--cards .hero__title,
.hero--cards .hero__text,
.hero--cards .hero__actions {
	animation: zz-hero-in .8s cubic-bezier(.2, .7, .2, 1) both;
}
.hero--cards .hero__title { animation-delay: .12s; }
.hero--cards .hero__text { animation-delay: .28s; }
.hero--cards .hero__actions { animation-delay: .42s; }
@keyframes zz-hero-in {
	from { opacity: 0; transform: translateY(22px); }
	to { opacity: 1; transform: none; }
}

/* Lebegő díszek. A szöveg fölöttük marad (z-index 2). */
.hero__floats {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
}
.hero__float {
	position: absolute;
	display: block;
	opacity: 0;
	animation: zz-fade-in 1s ease forwards, zz-float 7s ease-in-out infinite;
}
.hero__float img { display: block; width: 100%; height: auto; }
.hero__float--sparkle { width: 58px; top: 17%; left: 44vw; animation-delay: .9s, 0s; }
.hero__float--button  { width: 46px; bottom: 17%; left: 41vw; animation-delay: 1.1s, -2s; animation-duration: 1s, 8.5s; }
.hero__float--heart   { width: 24px; top: 27%; left: 2.6vw; animation-delay: 1.3s, -4s; animation-duration: 1s, 6s; }
.hero__float--needle  { width: 128px; bottom: 7%; left: 7vw; animation-delay: 1.5s, -1s; animation-duration: 1s, 9s; }
.hero__float--cloud   { width: 84px; top: 11%; right: 26%; animation-delay: 1.7s, -3s; animation-duration: 1s, 10s; }

@keyframes zz-float {
	0%, 100% { transform: translateY(0) rotate(-4deg); }
	50% { transform: translateY(-14px) rotate(5deg); }
}

/* Forgó jelvény a jobb alsó sarokban. */
.hero__badge {
	position: absolute;
	z-index: 2;
	right: clamp(1.25rem, 5vw, 5rem);
	bottom: clamp(2.5rem, 7vh, 5rem);
	width: clamp(110px, 11vw, 160px);
	aspect-ratio: 1;
	filter: drop-shadow(0 8px 18px rgba(38, 54, 52, .18));
	opacity: 0;
	animation: zz-badge-in .9s cubic-bezier(.2, .9, .3, 1.3) 1.2s forwards;
	pointer-events: none;
}
.hero__badge-ring { width: 100%; height: 100%; display: block; overflow: visible; }
.hero__badge-bg { fill: #FAF7F2; }
.hero__badge-stitch { fill: none; stroke: var(--zz-brand); stroke-width: 1.6; stroke-dasharray: 5 4; stroke-linecap: round; }
.hero__badge-spin { transform-origin: 100px 100px; } /* Viki kérésére nem forog */
.hero__badge text {
	font-family: "Ubuntu", "Open Sans", sans-serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .08em;
	fill: var(--zz-brand-dark);
}
.hero__badge-icon {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 34%;
	height: auto;
	transform: translate(-50%, -50%);
}
@keyframes zz-spin { to { transform: rotate(360deg); } }
@keyframes zz-badge-in {
	from { opacity: 0; transform: scale(.6) rotate(-30deg); }
	to { opacity: 1; transform: none; }
}

@media (max-width: 1100px) {
	.hero__float--cloud { display: none; }
	.hero__float--sparkle { left: auto; right: 8vw; }
	.hero__float--button { left: auto; right: 14vw; bottom: 30%; }
}

@media (max-width: 860px) {
	.hero__float--heart,
	.hero__float--needle { display: none; }
	.hero__float--sparkle { top: 6%; right: 6vw; width: 42px; }
	.hero__float--button { width: 34px; left: 5vw; right: auto; top: 8%; bottom: auto; }
	.hero__badge { width: 96px; bottom: 1.25rem; right: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
	.hero__mark-thread { animation: none; stroke-dashoffset: 0; }
	.hero__mark-stitch { animation: none; opacity: 1; }
	.hero--cards .hero__eyebrow,
	.hero--cards .hero__title,
	.hero--cards .hero__text,
	.hero--cards .hero__actions { animation: none; }
	.hero__float { animation: none; opacity: 1; }
	.hero__badge { animation: none; opacity: 1; }
	.hero__badge-spin { animation: none; }
}

/* ==================================================================
   Karuszelek („Mit keresel?”, „Készleten, azonnal vihető”)
   ==================================================================
   Görgethető sáv (érintésre húzható, egérrel a nyilakkal), a kártyák a
   szélekre pattannak. A sáv a konténer jobb szélén túl a képernyő széléig
   fut, így látszik, hogy van még tovább. */
.section--carousel .section__head { align-items: flex-end; }
.zz-carousel__nav { display: flex; align-items: center; gap: .5rem; }
.zz-carousel__nav a { margin-right: .75rem; }
.zz-carousel__btn {
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border-radius: 50%;
	background: #fff;
	color: var(--zz-brand-dark);
	border: 1.5px dashed var(--zz-brand);
	font-size: 1.15rem;
	line-height: 1;
	transition: background-color .2s ease, color .2s ease, opacity .2s ease;
}
.zz-carousel__btn:hover { background: var(--zz-brand-dark); color: #fff; border-color: var(--zz-brand-dark); }
.zz-carousel__btn:disabled { opacity: .35; cursor: default; background: #fff; color: var(--zz-brand-dark); }

.zz-carousel { margin-right: calc(50% - 50vw); }
/* A körhinta a 100vw miatt a görgetősáv szélességével túlnyúlt (Windows: vízszintes görgetés);
   a szakasz a saját szélénél levágja, függőlegesen semmi nem változik. */
.section--carousel,
.section:has(.zz-carousel) { overflow-x: clip; }
.zz-carousel__track,
.section .woocommerce ul.products.zz-carousel__track {
	list-style: none;
	margin: 0;
	padding: .5rem calc(50vw - 50%) 1.25rem 0;
	display: grid;
	grid-template-columns: none;
	grid-auto-flow: column;
	grid-auto-columns: clamp(170px, 20vw, 235px);
	gap: 1.1rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	overscroll-behavior-x: contain;
}
.section .woocommerce ul.products.zz-carousel__track { grid-auto-columns: clamp(230px, 23vw, 290px); gap: 1.25rem; }
.zz-carousel__track::-webkit-scrollbar { display: none; }
.zz-carousel__track:focus-visible { outline: 2px solid var(--zz-accent); outline-offset: 4px; border-radius: var(--zz-radius); }
.zz-carousel__item,
.zz-carousel__track > li.product { scroll-snap-align: start; }
.zz-carousel__item { display: flex; }
.zz-carousel__item .cat-card { width: 100%; }
/* A .woocommerce kártyarács ::before/::after "clearfix" eleme ne foglaljon oszlopot. */
.woocommerce ul.products.zz-carousel__track::before,
.woocommerce ul.products.zz-carousel__track::after { display: none; }

.cat-card__img { position: relative; }
.cat-card__img img { transition: transform .5s ease; }
.cat-card:hover .cat-card__img img:not(.cat-card__fallback) { transform: scale(1.06); }
.cat-card__img .cat-card__fallback { object-fit: contain; padding: 12%; }
.cat-card__parent {
	display: block;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	/* Az arany (accent) fehér alapon 2,25:1 – kis betűnél olvashatatlan.
	   Ugyanennek a sötétebb árnyalata 5:1. */
	color: #8a6a2f;
	margin-bottom: .15rem;
}

@media (max-width: 700px) {
	.zz-carousel__btn { display: none; }
	.zz-carousel__track { grid-auto-columns: 62vw; }
	.section .woocommerce ul.products.zz-carousel__track { grid-auto-columns: 72vw; }
}


/* Záró szakasz: textilfüzér felül lelógva, alul megfordítva. */
.section--cta::before,
.section--cta::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: clamp(30px, 2rem + 1.5vw, 52px);
	background: url("../img/deco/fuzer.svg") repeat-x left top / auto 100%;
	pointer-events: none;
}
.section--cta::before { top: 0; }
.section--cta::after { bottom: 0; transform: rotate(180deg); }
.section.section--cta { padding-top: clamp(4.5rem, 3rem + 5vw, 7rem); padding-bottom: clamp(4.5rem, 3rem + 5vw, 7rem); }

/* ==================================================================
   Ajándékkártya: összegválasztó a márka színeiben
   ================================================================== */
.gift-cards_form .ywgc_select_amount_title {
	font-size: 1.05rem;
	margin: 1.25rem 0 .15rem;
	flex-basis: 100%;
	color: var(--zz-brand-dark);
}
.gift-cards_form .gift-cards-list { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.25rem; }
.gift-cards_form .ywgc-predefined-amount-button,
.gift-cards_form button.ywgc-amount-buttons {
	background: #fff !important;
	color: var(--zz-brand-dark) !important;
	border: 1.5px dashed var(--zz-brand) !important;
	border-radius: 999px !important;
	padding: .6rem 1.15rem !important;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	outline: 0;
	box-shadow: none !important;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.gift-cards_form .ywgc-predefined-amount-button:hover,
.gift-cards_form button.ywgc-amount-buttons:hover { border-color: var(--zz-brand-dark) !important; }
.gift-cards_form .ywgc-predefined-amount-button.selected_button,
.gift-cards_form button.ywgc-amount-buttons.selected_button {
	background: var(--zz-brand-dark) !important;
	color: #fff !important;
	border-style: solid !important;
	border-color: var(--zz-brand-dark) !important;
}
.gift-cards_form .ywgc-manual-amount-container {
	display: inline-flex;
	align-items: stretch;
	border: 1.5px dashed var(--zz-brand);
	border-radius: 999px;
	overflow: hidden;
	background: #fff;
}
.gift-cards_form .ywgc-manual-amount-container:focus-within { border-style: solid; border-color: var(--zz-brand-dark); }
.gift-cards_form input.ywgc-manual-amount {
	border: 0 !important;
	box-shadow: none !important;
	padding: .6rem 1rem !important;
	min-width: 13rem;
	font: inherit;
	background: transparent;
}
.gift-cards_form .ywgc-manual-currency-symbol { display: flex; align-items: center; padding: 0 1rem 0 0; color: var(--zz-muted); background: transparent !important; }
.gift-cards_form .ywgc-manual-currency-symbol.left { display: none; }

/* ==================================================================
   Kapcsolat oldal
   ==================================================================
   Visszafogott: az űrlap varrott szélű kártyán, a sarkából kikandikál az
   alvó hold; az oldalsáv címei elé egy-egy kis rajzolt ikon kerül.
   A szöveg a szerkesztőben marad, a díszek csak CSS-ből jönnek. */
.page-kapcsolat .entry-content > p:first-child {
	font-size: clamp(1.05rem, 1rem + .3vw, 1.2rem);
	color: #44504e;
	max-width: 44em;
	margin-bottom: clamp(1.75rem, 1rem + 2vw, 2.75rem);
}

.page-kapcsolat .zz-cols__main {
	position: relative;
	background: #fff;
	border: 1px solid rgba(78, 107, 104, .14);
	border-radius: 16px;
	padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
	box-shadow: 0 6px 24px rgba(38, 54, 52, .07);
}
/* tűzés a kártya belső szélén */
.page-kapcsolat .zz-cols__main::before {
	content: "";
	position: absolute;
	inset: 8px;
	border: 1.5px dashed rgba(78, 107, 104, .22);
	border-radius: 11px;
	pointer-events: none;
}
/* alvó hold a jobb felső sarokban */
.page-kapcsolat .zz-cols__main::after {
	content: "";
	position: absolute;
	top: clamp(-3.5rem, -2rem - 2vw, -2.25rem);
	right: clamp(-1rem, -.5rem - 1vw, -.5rem);
	width: clamp(120px, 12vw, 170px);
	aspect-ratio: 1633 / 1158;
	background: url("../img/deco/hold-illusztracio.svg") no-repeat center / contain;
	transform: rotate(6deg);
	pointer-events: none;
}
.page-kapcsolat .zz-cols__main > h2:first-child { margin-top: 0; padding-right: 7rem; }
.page-kapcsolat .zz-cols__main > h2:first-child::after {
	content: "";
	display: block;
	width: 84px;
	height: 20px;
	margin-top: .35rem;
	background: url("../img/deco/firka-alahuzas.svg") no-repeat left center / contain;
}

/* Oldalsáv: ikon a címek előtt */
.page-kapcsolat .zz-cols__side {
	position: relative;
	padding: 1.75rem 1.75rem .5rem;
}
.page-kapcsolat .zz-cols__side::before {
	content: "";
	position: absolute;
	inset: 8px;
	border: 1.5px dashed rgba(78, 107, 104, .2);
	border-radius: 10px;
	pointer-events: none;
}
.page-kapcsolat .zz-cols__side h2 {
	display: flex;
	align-items: center;
	gap: .65rem;
}
.page-kapcsolat .zz-cols__side h2::before {
	content: "";
	flex: none;
	width: 34px;
	height: 34px;
	background: no-repeat center / contain;
}
.page-kapcsolat .zz-cols__side h2:nth-of-type(1)::before { background-image: url("../img/deco/ikon-meroszalag.svg"); }
.page-kapcsolat .zz-cols__side h2:nth-of-type(2)::before { background-image: url("../img/deco/ikon-gomb.svg"); }
.page-kapcsolat .zz-cols__side h2:nth-of-type(3)::before { background-image: url("../img/deco/ikon-sziv.svg"); }
.page-kapcsolat .zz-cols__side h2:nth-of-type(4)::before { background-image: url("../img/deco/ikon-csomag.svg"); }
.page-kapcsolat .zz-cols__side h2:nth-of-type(n+5)::before { background-image: url("../img/deco/ikon-cerna.svg"); }
.page-kapcsolat .zz-cols__side p,
.page-kapcsolat .zz-cols__side ul { padding-left: calc(34px + .65rem); }
.page-kapcsolat .zz-cols__side ul { list-style: none; }
.page-kapcsolat .zz-cols__side li { position: relative; margin-bottom: .3rem; }
.page-kapcsolat .zz-cols__side li::before {
	content: "×";
	position: absolute;
	left: -1.1rem;
	color: var(--zz-accent);
	font-weight: 700;
}

@media (max-width: 860px) {
	.page-kapcsolat .zz-cols__main { margin-top: 2.5rem; }
	.page-kapcsolat .zz-cols__main > h2:first-child { padding-right: 5.5rem; }
}

/* ==================================================================
   Fiókom: belépés, regisztráció, fiók menü
   ==================================================================
   Ugyanaz a nyelv, mint a Kapcsolat oldalon: varrott szélű fehér kártyák,
   rajzolt ikon a címek előtt, egy masni a regisztráció sarkán. */
.woocommerce-account #customer_login {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.5rem, 1rem + 3vw, 3.25rem);
	align-items: start;
}
.woocommerce-account #customer_login::before,
.woocommerce-account #customer_login::after { display: none; }
.woocommerce-account #customer_login > .u-column1,
.woocommerce-account #customer_login > .u-column2 { width: auto; float: none; }

.woocommerce-account #customer_login h2 {
	display: flex;
	align-items: center;
	gap: .7rem;
	margin: 0 0 1rem;
}
.woocommerce-account #customer_login h2::before {
	content: "";
	flex: none;
	width: 42px;
	height: 42px;
	background: no-repeat center / contain;
}
.woocommerce-account #customer_login .u-column1 h2::before { background-image: url("../img/deco/ikon-maci.svg"); }
.woocommerce-account #customer_login .u-column2 h2::before { background-image: url("../img/deco/ikon-ajandek.svg"); }

.woocommerce-account .woocommerce form.login,
.woocommerce-account .woocommerce form.register {
	position: relative;
	margin: 0;
	background: #fff;
	border: 1px solid rgba(78, 107, 104, .14);
	border-radius: 16px;
	padding: clamp(1.5rem, 1rem + 1.5vw, 2.25rem);
	box-shadow: 0 6px 24px rgba(38, 54, 52, .07);
}
.woocommerce-account .woocommerce form.login::before,
.woocommerce-account .woocommerce form.register::before {
	content: "";
	position: absolute;
	inset: 8px;
	border: 1.5px dashed rgba(78, 107, 104, .22);
	border-radius: 11px;
	pointer-events: none;
}
/* masni a regisztrációs kártya sarkán */
.woocommerce-account .woocommerce form.register::after {
	content: "";
	position: absolute;
	top: -1.9rem;
	right: 1.25rem;
	width: 78px;
	height: 66px;
	background: url("../img/deco/firka-masni.svg") no-repeat center / contain;
	transform: rotate(8deg);
	pointer-events: none;
}

.woocommerce-account .woocommerce form .form-row label { font-weight: 600; font-size: .92rem; margin-bottom: .35rem; }
.woocommerce-account .woocommerce form .form-row .input-text {
	padding: .7rem .85rem;
	border: 1px solid var(--zz-line);
	border-radius: 8px;
	background: #fff;
}
.woocommerce-account .woocommerce form .form-row .input-text:focus {
	border-color: var(--zz-brand-dark);
	outline: 2px solid rgba(78, 107, 104, .18);
	outline-offset: 1px;
}
.woocommerce-account .woocommerce form .form-row .required { color: #b3261e; text-decoration: none; }
.woocommerce-account .woocommerce form.login .form-row:has(.woocommerce-form-login__submit) {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .75rem 1.25rem;
	margin-top: 1.25rem;
}
/* A WooCommerce clearfix-pszeudoelemei flexben üres elemként eltolnák a sort. */
.woocommerce-account .woocommerce form.login .form-row:has(.woocommerce-form-login__submit)::before,
.woocommerce-account .woocommerce form.login .form-row:has(.woocommerce-form-login__submit)::after { display: none; }
.woocommerce-account .woocommerce form.login .woocommerce-form-login__submit { order: 2; margin: 0; }
.woocommerce-account .woocommerce form.login .woocommerce-form-login__rememberme { order: 1; margin: 0; }
.woocommerce-account .woocommerce form .form-row input[type="checkbox"] { accent-color: var(--zz-brand-dark); }
.woocommerce-account .woocommerce-privacy-policy-text p { font-size: .9rem; color: #55605e; }
.woocommerce-account .woocommerce form.register .woocommerce-form-register__submit { margin-top: .5rem; }

/* Belépett vevő: fiók menü varrott kártyán */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: .6rem;
	background: #fff;
	border: 1px solid rgba(78, 107, 104, .14);
	border-radius: 16px;
	box-shadow: 0 6px 24px rgba(38, 54, 52, .07);
}
.woocommerce-account .woocommerce-MyAccount-navigation li + li { border-top: 1.5px dashed rgba(78, 107, 104, .16); }
.woocommerce-account .woocommerce-MyAccount-navigation a {
	display: block;
	padding: .7rem .9rem;
	border-radius: 10px;
	text-decoration: none;
	color: var(--zz-text);
	font-weight: 600;
	transition: background-color .2s ease, color .2s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation a:hover { background: var(--zz-brand-light); color: var(--zz-brand-dark); }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a {
	background: var(--zz-brand-dark);
	color: #fff;
}

@media (max-width: 760px) {
	.woocommerce-account #customer_login { grid-template-columns: 1fr; }
	.woocommerce-account #customer_login .u-column2 { margin-top: 1rem; }
}

/* ==================================================================
   Anyagkatalógus
   ================================================================== */
.zz-catalog { margin-top: .5rem; }

/* Szűrősáv: görgetéskor a fejléc alatt marad */
.zz-catalog__bar {
	position: sticky;
	top: var(--zz-sticky-top, 0px);
	z-index: 5;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .75rem 1.25rem;
	padding: .9rem 0;
	margin-bottom: 1.5rem;
	background: rgba(255, 255, 255, .94);
	backdrop-filter: blur(6px);
	border-bottom: 1.5px dashed rgba(78, 107, 104, .2);
}
.zz-catalog__filters { display: flex; flex-wrap: wrap; gap: .5rem; }
.zz-catalog__pill {
	background: #fff;
	color: var(--zz-brand-dark);
	border: 1.5px dashed var(--zz-brand);
	border-radius: 999px;
	padding: .5rem 1rem;
	font-size: .92rem;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	outline: 0;
	transition: background-color .2s ease, color .2s ease;
}
.zz-catalog__pill span { font-weight: 400; opacity: .75; }
.zz-catalog__pill:hover { background: var(--zz-brand-light); color: var(--zz-brand-dark); }
.zz-catalog__pill.is-active { background: var(--zz-brand-dark); border-style: solid; border-color: var(--zz-brand-dark); color: #fff; }
.zz-catalog__pill:focus-visible { outline: 2px solid var(--zz-accent); outline-offset: 2px; }

.zz-catalog__search { flex: 0 1 340px; }
.zz-catalog__search input {
	border-radius: 999px;
	border: 1.5px dashed var(--zz-brand);
	padding: .55rem 1.1rem .55rem 2.4rem;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%234E6B68' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='5.5'/%3E%3Cpath d='m12.5 12.5 4 4'/%3E%3C/svg%3E") no-repeat .9rem center;
}
.zz-catalog__search input:focus { border-style: solid; border-color: var(--zz-brand-dark); outline: 0; }

.zz-catalog__group { margin: 0 0 clamp(2.5rem, 2rem + 2vw, 3.75rem); scroll-margin-top: 7rem; }
.zz-catalog__head { margin-bottom: 1.25rem; }
.zz-catalog__title {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: .35rem .75rem;
	margin: 0 0 .35rem;
	font-size: clamp(1.35rem, 1.15rem + .8vw, 1.8rem);
}
.zz-catalog__title::after {
	content: "";
	flex-basis: 100%;
	height: 18px;
	max-width: 80px;
	background: url("../img/deco/firka-alahuzas.svg") no-repeat left center / contain;
}
.zz-catalog__count { font-size: .9rem; font-weight: 400; color: var(--zz-muted); }
.zz-catalog__lead { margin: 0; color: #4b5250; max-width: 46em; }

.zz-catalog__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(clamp(120px, 14vw, 160px), 1fr));
	gap: clamp(.75rem, .5rem + 1vw, 1.25rem);
}
.zz-catalog__card {
	display: block;
	width: 100%;
	padding: 0;
	background: none !important;
	border: 0;
	outline: 0 !important;
	color: inherit !important;
	text-align: left;
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
	cursor: zoom-in;
}
.zz-catalog__img {
	position: relative;
	display: block;
	aspect-ratio: 1;
	border-radius: 50%;
	overflow: hidden;
	background: var(--zz-bg-soft);
	box-shadow: 0 0 0 4px #fff, 0 0 0 5.5px rgba(78, 107, 104, .18), 0 6px 16px rgba(38, 54, 52, .1);
	transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .3s ease;
}
.zz-catalog__img img,
.zz-catalog__placeholder { display: block; width: 100%; height: 100%; object-fit: cover; }
.zz-catalog__card:hover .zz-catalog__img,
.zz-catalog__card:focus-visible .zz-catalog__img {
	transform: translateY(-4px) rotate(-3deg);
	box-shadow: 0 0 0 4px #fff, 0 0 0 5.5px var(--zz-accent), 0 12px 24px rgba(38, 54, 52, .16);
}
.zz-catalog__name {
	display: block;
	margin-top: .7rem;
	font-size: .9rem;
	line-height: 1.35;
	text-align: center;
}
.zz-catalog__item.is-out .zz-catalog__img img { filter: grayscale(.7); opacity: .55; }
.zz-catalog__badge {
	position: absolute;
	left: 50%;
	bottom: 14%;
	transform: translateX(-50%);
	background: #fff;
	color: #7a3b2e;
	font-size: .72rem;
	font-weight: 600;
	padding: .15rem .55rem;
	border-radius: 999px;
	white-space: nowrap;
}

.zz-catalog__empty,
.zz-catalog__note { color: #55605e; font-size: .92rem; }
.zz-catalog__note { border-top: 1.5px dashed rgba(78, 107, 104, .2); padding-top: 1.25rem; margin-top: 1rem; }

/* Nagyítás */
.zz-catalog__dialog {
	border: 0;
	padding: 1rem;
	border-radius: 18px;
	max-width: min(560px, 92vw);
	width: 100%;
	box-shadow: 0 30px 80px rgba(20, 30, 30, .35);
}
.zz-catalog__dialog::backdrop { background: rgba(40, 58, 56, .55); backdrop-filter: blur(3px); }
.zz-catalog__dialog img { display: block; width: 100%; height: auto; max-height: 70vh; object-fit: contain; border-radius: 12px; }
.zz-catalog__dialog-caption { margin: .8rem .25rem .1rem; }
.zz-catalog__dialog-caption span { color: var(--zz-muted); margin-left: .35rem; }
.zz-catalog__close {
	position: absolute;
	top: .5rem;
	right: .5rem;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border-radius: 50%;
	background: #fff !important;
	color: var(--zz-brand-dark) !important;
	font-size: 1.6rem;
	line-height: 1;
	outline: 0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}

@media (max-width: 700px) {
	.zz-catalog__bar { position: static; }
	.zz-catalog__filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -1.25rem; padding: 0 1.25rem; }
	.zz-catalog__pill { white-space: nowrap; }
	.zz-catalog__search { flex-basis: 100%; }
	.zz-catalog__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.zz-catalog__name { font-size: .8rem; }
}

@media (prefers-reduced-motion: reduce) {
	.zz-catalog__img { transition: none; }
	.zz-catalog__card:hover .zz-catalog__img { transform: none; }
}

/* ==================================================================
   Bolt: szűrőpanel a lista mellett
   ================================================================== */
.zz-shop {
	display: grid;
	grid-template-columns: 270px minmax(0, 1fr);
	gap: clamp(1.5rem, 1rem + 2vw, 2.75rem);
	align-items: start;
}
.zz-shop__main { min-width: 0; }
.zz-shop .woocommerce ul.products,
.zz-shop ul.products { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important; }

.zz-panel {
	position: sticky;
	top: calc(var(--zz-header-h, 72px) + 1rem);
	max-height: calc(100vh - var(--zz-header-h, 72px) - 2rem);
	overflow-y: auto;
	scrollbar-width: thin;
	background: #fff;
	border: 1px solid rgba(78, 107, 104, .14);
	border-radius: 16px;
	box-shadow: 0 6px 24px rgba(38, 54, 52, .06);
}
.zz-panel__form { padding: .5rem 1.25rem 1.25rem; }
.zz-panel__top { display: flex; align-items: center; justify-content: space-between; padding: .75rem 0 .5rem; }
.zz-panel__heading { margin: 0; font-family: "Ubuntu", "Open Sans", sans-serif; font-weight: 600; font-size: 1.15rem; }
.zz-panel__close { display: none; }

.zz-panel__section { border-top: 1.5px dashed rgba(78, 107, 104, .18); padding: .35rem 0 .75rem; }
.zz-panel__section summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .65rem 0 .5rem;
	font-weight: 600;
	color: var(--zz-brand-dark);
}
.zz-panel__section summary::-webkit-details-marker { display: none; }
.zz-panel__section summary::after {
	content: "";
	width: .55rem;
	height: .55rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform .2s ease;
}
.zz-panel__section[open] summary::after { transform: rotate(-135deg) translateY(-2px); }

/* jelölőnégyzet és rádió */
.zz-check {
	position: relative;
	display: flex;
	align-items: center;
	gap: .6rem;
	padding: .32rem 0;
	cursor: pointer;
	font-size: .94rem;
}
.zz-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.zz-check__box {
	flex: none;
	width: 1.1rem;
	height: 1.1rem;
	border: 1.5px solid var(--zz-brand);
	border-radius: 5px;
	background: #fff;
	transition: background-color .15s ease, border-color .15s ease;
}
.zz-check--radio .zz-check__box { border-radius: 50%; }
.zz-check input:checked + .zz-check__box {
	background: var(--zz-brand-dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3.5 8.5 3 3 6-6.5'/%3E%3C/svg%3E") no-repeat center / 80%;
	border-color: var(--zz-brand-dark);
}
.zz-check--radio input:checked + .zz-check__box { background: #fff; box-shadow: inset 0 0 0 4px var(--zz-brand-dark); }
.zz-check input:indeterminate + .zz-check__box { background: var(--zz-brand-light); box-shadow: inset 0 0 0 4px #fff; border-color: var(--zz-brand-dark); }
.zz-check input:focus-visible + .zz-check__box { outline: 2px solid var(--zz-accent); outline-offset: 2px; }
.zz-check__label { flex: 1; }
.zz-check__count { font-size: .8rem; color: var(--zz-muted); background: var(--zz-bg-soft); border-radius: 999px; padding: .05rem .5rem; }
.zz-check:hover .zz-check__box { border-color: var(--zz-brand-dark); }

.zz-cattree, .zz-cattree__children { list-style: none; margin: 0; padding: 0; }
.zz-cattree__row { display: flex; align-items: center; gap: .25rem; }
.zz-cattree__row .zz-check { flex: 1; font-weight: 600; }
.zz-cattree__toggle {
	flex: none;
	width: 2rem;
	height: 2rem;
	padding: 0;
	background: none !important;
	border: 0;
	outline: 0 !important;
	color: var(--zz-brand-dark) !important;
	position: relative;
}
.zz-cattree__toggle::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: .45rem;
	height: .45rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translate(-50%, -70%) rotate(45deg);
	transition: transform .2s ease;
}
.zz-cattree__toggle[aria-expanded="true"]::before { transform: translate(-50%, -30%) rotate(-135deg); }
.zz-cattree__children { margin: .1rem 0 .4rem .55rem; padding-left: .95rem; border-left: 1.5px dashed rgba(78, 107, 104, .22); }
.zz-cattree__children .zz-check { font-size: .9rem; }

/* árcsúszka */
.zz-price { padding: .35rem 0 .25rem; }
.zz-price__slider { position: relative; height: 1.75rem; }
.zz-price__slider::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	height: 4px;
	transform: translateY(-50%);
	border-radius: 4px;
	background: linear-gradient(90deg, var(--zz-line) var(--from, 0%), var(--zz-brand-dark) var(--from, 0%), var(--zz-brand-dark) var(--to, 100%), var(--zz-line) var(--to, 100%));
}
.zz-price__slider input[type="range"] {
	position: absolute;
	inset: 0;
	width: 100%;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	pointer-events: none;
	-webkit-appearance: none;
	appearance: none;
}
.zz-price__slider input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	pointer-events: auto;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
	background: #fff;
	border: 2px solid var(--zz-brand-dark);
	box-shadow: 0 2px 6px rgba(38, 54, 52, .2);
	cursor: grab;
}
.zz-price__slider input[type="range"]::-moz-range-thumb {
	pointer-events: auto;
	width: 1.1rem;
	height: 1.1rem;
	border-radius: 50%;
	background: #fff;
	border: 2px solid var(--zz-brand-dark);
	cursor: grab;
}
.zz-price__slider input[type="range"]::-moz-range-track { background: none; }
.zz-price__inputs { display: flex; align-items: center; gap: .4rem; margin-top: .6rem; }
.zz-price__inputs label { flex: 1; }
.zz-price__inputs input { padding: .45rem .55rem; font-size: .9rem; border-radius: 8px; }
.zz-price__unit { color: var(--zz-muted); font-size: .9rem; }

.zz-panel__actions { border-top: 1.5px dashed rgba(78, 107, 104, .18); padding-top: 1rem; display: grid; gap: .6rem; justify-items: center; }
.zz-panel__apply { width: 100%; }
.zz-js .zz-panel__apply { display: none; }
.zz-panel__reset { font-size: .9rem; }

/* lista feletti sáv: mobil gomb + aktív szűrők */
.zz-shopbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: 0 0 1.25rem; }
.zz-shopbar:not(:has(.zz-chips)) { margin: 0; }
.zz-shopbar__toggle {
	display: none;
	align-items: center;
	gap: .5rem;
	background: #fff !important;
	color: var(--zz-brand-dark) !important;
	border: 1.5px dashed var(--zz-brand) !important;
	border-radius: 999px !important;
	padding: .55rem 1.1rem !important;
	outline: 0 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}
.zz-shopbar__count { background: var(--zz-brand-dark); color: #fff; border-radius: 999px; font-size: .78rem; padding: .05rem .5rem; }
.zz-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.zz-chip {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	padding: .35rem .8rem;
	border-radius: 999px;
	background: var(--zz-brand-light);
	color: var(--zz-brand-dark);
	text-decoration: none;
	font-size: .88rem;
	font-weight: 600;
}
.zz-chip span[aria-hidden] { font-size: 1.05rem; line-height: 1; opacity: .7; }
.zz-chip:hover { background: var(--zz-brand-dark); color: #fff; }
.zz-chips__reset { font-size: .88rem; margin-left: .25rem; }

@media (max-width: 900px) {
	.zz-shop { grid-template-columns: 1fr; }
	.zz-shopbar__toggle { display: inline-flex; }
	.zz-panel {
		position: fixed;
		inset: 0 auto 0 0;
		z-index: 1000;
		width: min(360px, 88vw);
		max-height: none;
		border-radius: 0 18px 18px 0;
		transform: translateX(-105%);
		transition: transform .3s cubic-bezier(.3, .7, .2, 1);
		box-shadow: 0 0 60px rgba(20, 30, 30, .3);
	}
	.zz-panel.is-open { transform: none; }
	.zz-panel__close {
		display: block;
		width: 2.5rem;
		height: 2.5rem;
		padding: 0;
		border-radius: 50%;
		background: var(--zz-bg-soft) !important;
		color: var(--zz-brand-dark) !important;
		font-size: 1.5rem;
		line-height: 1;
		outline: 0 !important;
	}
	.zz-panel__actions { position: sticky; bottom: 0; background: #fff; padding-bottom: 1rem; }
	.zz-js .zz-panel__apply { display: inline-block; }
	body.zz-panel-open { overflow: hidden; }
	body.zz-panel-open::after { content: ""; position: fixed; inset: 0; z-index: 999; background: rgba(40, 58, 56, .45); }
}

/* ==================================================================
   Termékkártya: kép, kosár sáv, név, ár + Részletek
   ================================================================== */
ul.products li.product.zz-card {
	padding: 0 !important;
	border: 1px solid rgba(78, 107, 104, .14);
	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 4px 18px rgba(38, 54, 52, .06);
}
ul.products li.product.zz-card .zz-card__media { position: relative; }
ul.products li.product.zz-card .zz-card__image { display: block; position: relative; }
ul.products li.product.zz-card .zz-card__image img { margin: 0 !important; aspect-ratio: 1; object-fit: cover; width: 100%; display: block; transition: transform .6s ease; }
ul.products li.product.zz-card:hover .zz-card__image img { transform: scale(1.04); }
ul.products li.product.zz-card .zz-card__media { overflow: hidden; }
ul.products li.product.zz-card .zz-badge { position: absolute; top: .75rem; right: .75rem; margin: 0 !important; z-index: 2; white-space: nowrap; }

ul.products li.product.zz-card .zz-card__cta a.button,
ul.products li.product.zz-card .zz-card__cta .button {
	display: block;
	width: 100%;
	margin: 0 !important;
	border-radius: 0 !important;
	padding: .8rem 1rem !important;
	text-align: center;
	background: var(--zz-brand-dark) !important;
	color: #fff !important;
	outline: 0 !important;
	box-shadow: inset 0 0 0 1000px transparent;
	font-size: .92rem !important;
	transition: background-color .2s ease;
}
ul.products li.product.zz-card .zz-card__cta .button:hover { background: var(--zz-brand-darker) !important; }
ul.products li.product.zz-card .zz-card__cta .added_to_cart {
	display: block;
	text-align: center;
	padding: .35rem;
	font-size: .85rem;
	background: var(--zz-brand-light);
}

ul.products li.product.zz-card .zz-card__body { padding: .95rem 1.1rem 1.05rem; display: flex; flex-direction: column; flex: 1; }
ul.products li.product.zz-card .zz-card__title {
	margin: 0 0 .7rem !important;
	padding: 0 !important;
	font-size: 1rem !important;
	font-weight: 600;
	line-height: 1.35;
}
ul.products li.product.zz-card .zz-card__title a { color: var(--zz-brand-dark); text-decoration: none; }
ul.products li.product.zz-card .zz-card__title a:hover { color: var(--zz-brand-darker); text-decoration: underline; }
ul.products li.product.zz-card .zz-card__row {
	margin-top: auto;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem;
}
ul.products li.product.zz-card .zz-card__row .price {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 1.1rem !important;
	font-weight: 700;
	color: var(--zz-text) !important;
}
ul.products li.product.zz-card .zz-card__more {
	flex: none;
	font-size: .88rem;
	color: var(--zz-brand-dark);
	text-decoration: none;
	white-space: nowrap;
}
ul.products li.product.zz-card .zz-card__more span { display: inline-block; transition: transform .2s ease; }
ul.products li.product.zz-card:hover .zz-card__more span { transform: translateX(3px); }

/* Bemutatkozás: halvány, kékes háttér, hogy elváljon a körülötte lévő szakaszoktól. */
.section--about {
	--zz-about-bg: #e6eff3;
	position: relative;
	background: var(--zz-about-bg);
}
.section--about .about__media img { box-shadow: 0 14px 34px rgba(40, 70, 85, .18); }
.section--about .about__eyebrow { color: #3f6475; }

/* Termékoldal: a képgaléria a konfigurátor mellett végig látszik (ragadós),
   így hosszú testreszabásnál sem marad üres a bal oldal. Csak asztalon. */
@media (min-width: 861px) {
	.woocommerce div.product div.images.woocommerce-product-gallery {
		position: sticky !important;
		top: calc(var(--zz-header-h, 72px) + 1.25rem);
		align-self: start;
		z-index: 1;
	}
	/* A kép + a bélyegképek férjenek be a képernyőbe, különben a ragadós galéria alja
	   (a bélyegképek) nem lenne elérhető. */
	.woocommerce div.product div.images .woocommerce-product-gallery__image img {
		max-height: calc(100vh - var(--zz-header-h, 72px) - 9.5rem);
		object-fit: cover;
	}
}

/* ==================================================================
   Kártyák animációja
   ==================================================================
   Görgetésre a kártyák finoman beúsznak (sorban, kis késleltetéssel),
   rámutatáskor megemelkednek. A `zz-anim` osztályt a <head> teszi ki, így
   nincs villanás; ha a szkript nem fut le, 3 mp után minden látszik.
   Csökkentett mozgás beállításnál semmi sem mozog. */
.step,
.usp,
.way,
.review,
.cat-card,
ul.products li.product {
	transition:
		opacity .6s ease,
		transform .6s cubic-bezier(.2, .7, .2, 1),
		box-shadow .3s ease,
		border-color .3s ease;
}

.zz-anim :is(.step, .usp, .way, .review, .cat-card, ul.products li.product):not(.is-visible) {
	opacity: 0;
	transform: translateY(28px);
}

:is(.step, .usp, .way, .review, .cat-card, ul.products li.product).is-visible:hover {
	transform: translateY(-5px);
	box-shadow: 0 14px 30px rgba(38, 54, 52, .12);
}

.step__icon img { transition: transform .35s ease; }
.step:hover .step__icon img { transform: rotate(-10deg) scale(1.1); }
.review:hover .review__name::before { animation: zz-heartbeat .8s ease; }

@keyframes zz-heartbeat {
	0%, 100% { transform: scale(1); }
	30% { transform: scale(1.35); }
	60% { transform: scale(.95); }
}

@media (prefers-reduced-motion: reduce) {
	.step, .usp, .way, .review, .cat-card,
	ul.products li.product,
	.step__icon img { transition: none; }
	:is(.step, .usp, .way, .review, .cat-card, ul.products li.product):hover { transform: none; }
	.review:hover .review__name::before { animation: none; }
}

/* ==================================================================
   Varrott gombok
   ==================================================================
   A gomb belső szélén szaggatott „tűzés”, mint a szegett textilen. Körvonal
   (outline) adja, mert az input[type=submit]-nek nincs ::after eleme, és a
   körvonal követi a lekerekítést. Rámutatáskor a cérna mustársárgára vált.
   Az ikongombok (menü, kereső, kosár) és a szűrő-címkék kimaradnak. */
.button,
input[type="submit"],
button[type="submit"]:not(.icon-btn):not(.search-toggle),
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.wp-element-button {
	outline: 1.5px dashed rgba(255, 255, 255, .6);
	outline-offset: -5px;
	padding: .85rem 1.55rem;
	transition: background-color .25s ease, outline-color .25s ease, outline-offset .25s ease, transform .2s ease;
}

.button:hover,
input[type="submit"]:hover,
button[type="submit"]:not(.icon-btn):not(.search-toggle):hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wp-element-button:hover {
	outline-color: var(--zz-accent-light);
	outline-offset: -4px;
}

.button:active,
input[type="submit"]:active,
.woocommerce a.button:active,
.woocommerce button.button:active { transform: translateY(1px); }

/* Az átlátszó gombon a cérna sötét zsálya, a keret helyett is ez látszik. */
.button--ghost {
	box-shadow: inset 0 0 0 1px rgba(78, 107, 104, .35);
	outline-color: var(--zz-brand-dark);
}
.button--ghost:hover { outline-color: var(--zz-accent); }

/* Billentyűzetes fókusz: jól látható, folytonos mustár gyűrű a gombon kívül. */
.button:focus-visible,
input[type="submit"]:focus-visible,
button[type="submit"]:focus-visible,
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.wp-element-button:focus-visible {
	outline: 2px solid var(--zz-accent);
	outline-offset: 2px;
}

/* A letiltott kosárgomb ne tűnjön kattinthatónak. */
.woocommerce button.button:disabled,
.woocommerce button.button.disabled { outline-color: rgba(255, 255, 255, .3); }

@media (prefers-reduced-motion: reduce) {
	.button, input[type="submit"], .woocommerce a.button, .woocommerce button.button { transition: none; }
}

/* ==================================================================
   Sütibeállítások gomb a hozzájárulás után
   ==================================================================
   A Cookie Notice a döntés után egy teljes szélességű, 62 px magas sávot
   hagyott az oldal alján, ami minden oldalon eltakarta a tartalom alját.
   A visszavonás lehetősége kötelező, ezért nem tüntetjük el - csak kis
   gombbá tesszük a bal alsó sarokban. */
#cookie-notice.cookie-revoke-visible {
	left: 1rem !important;
	right: auto !important;
	bottom: 1rem !important;
	width: auto !important;
	min-width: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}
#cookie-notice.cookie-revoke-visible .cookie-revoke-container {
	padding: 0 !important;
	background: transparent !important;
}
/* A "Sütibeállítások módosítása" felirat a felolvasóknak megmarad. */
#cookie-notice.cookie-revoke-visible #cn-revoke-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
#cookie-notice.cookie-revoke-visible #cn-revoke-cookie {
	margin: 0 !important;
	padding: .5rem .95rem !important;
	font-size: .8rem !important;
	border-radius: 999px !important;
	box-shadow: 0 4px 14px rgba(38, 54, 52, .25);
}

/* Lapozó: az oldalszámok kényelmesen eltalálhatók legyenek ujjal is
   (eddig a "2" mindössze 9 px széles volt). */
.nav-links .page-numbers,
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0 .6rem;
}

/* ==================================================================
   Ugrópontok az összevont Tudnivalók oldal tetején
   ================================================================== */

.zz-jump { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 2.5rem; }

.zz-jump a {
	display: inline-block;
	padding: .45rem .95rem;
	border: 1px solid var(--zz-line);
	border-radius: 999px;
	background: #fff;
	font-size: .9rem;
	font-weight: 600;
	color: var(--zz-brand-dark);
	text-decoration: none;
}

.zz-jump a:hover,
.zz-jump a:focus-visible { background: var(--zz-brand-light); border-color: var(--zz-brand); }

/* Horgonyra ugráskor a szakasz címe ne csússzon a ragadós fejléc alá. */
.entry-content h2[id] { scroll-margin-top: 6rem; }

/* Az ajándékutalvány képe fekvő grafika, nem termékfotó: a négyzetes
   vágás levágta a szélét. Nála a teljes kép látszik, fehér háttéren. */
.woocommerce ul.products li.product.product-type-gift-card a img,
.woocommerce div.product.product-type-gift-card div.images img {
	object-fit: contain !important;
	background: #fff;
}

/* -------------------------------------------------- Felső futó szalag */
.utility-bar__inner { overflow: hidden; }
.zz-ticker {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.zz-ticker__track { display: flex; width: max-content; animation: zz-ticker 48s linear infinite; }
.zz-ticker:hover .zz-ticker__track { animation-play-state: paused; }
.zz-ticker__run { display: flex; margin: 0; padding: 0; list-style: none; }
.zz-ticker__run li {
	display: flex;
	align-items: center;
	white-space: nowrap;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.zz-ticker__run li::after { content: "\2726"; margin: 0 1.1rem; color: var(--zz-accent, #D9A441); font-size: .8em; }
@keyframes zz-ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
	.zz-ticker__track { animation-duration: 160s; }
}

/* -------------------------------------------------- Bizalmi sáv a hero alatt */
.trustbar { background: #fff; padding: 1.1rem 0; position: relative; z-index: 1; }
.trustbar__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.trustbar__item { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.trustbar__item + .trustbar__item { border-left: 1px dashed rgba(78, 107, 104, .25); padding-left: 1rem; }
.trustbar__icon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #f4efe4;
}
.trustbar__icon img { width: 36px; height: 36px; object-fit: contain; transition: transform .3s ease; }
.trustbar__item:hover .trustbar__icon img { transform: rotate(-8deg) scale(1.06); }
.trustbar__body { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.trustbar__title { color: var(--zz-brand-dark, #4E6B68); font-size: .95rem; }
.trustbar__text { color: #5f6664; font-size: .84rem; }
@media (max-width: 900px) {
	.trustbar__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1rem; }
	.trustbar__item + .trustbar__item { border-left: 0; padding-left: 0; }
}
@media (max-width: 480px) {
	.trustbar__icon { width: 46px; height: 46px; }
	.trustbar__icon img { width: 30px; height: 30px; }
	.trustbar__title { font-size: .88rem; }
	.trustbar__text { font-size: .78rem; }
}

/* -------------------------------------------------- Automatikus betöltés */
.zz-loadmore { display: flex; justify-content: center; margin: 2rem 0 1rem; min-height: 3rem; }
.zz-loadmore.is-loading .zz-loadmore__btn { opacity: .6; pointer-events: none; }
.zz-loadmore__end { margin: 0; color: #6b7270; font-size: .9rem; }

/* -------------------------------------------------- Fejléc: logó középen */
/* Felső sor: kiegészítő linkek | logó | keresés, kosár. Alatta a fő menü. */
.site-header__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	grid-template-areas: "util brand actions" "nav nav nav";
	column-gap: 1rem;
	row-gap: 0;
}
.header-utility { grid-area: util; justify-self: start; }
.site-branding { grid-area: brand; justify-self: center; padding: .55rem 0 .2rem; }
.site-actions { grid-area: actions; justify-self: end; margin-left: 0; }
.site-nav { grid-area: nav; justify-self: center; margin-left: 0; padding-bottom: .55rem; }
.nav-toggle { grid-area: util; justify-self: start; }
.header-utility__list { display: flex; gap: 1.2rem; margin: 0; padding: 0; list-style: none; }
.header-utility__list a { color: var(--zz-brand-dark, #4E6B68); font-size: .9rem; font-weight: 600; text-decoration: none; }
.header-utility__list a:hover { color: var(--zz-accent, #D9A441); }
.utility-bar .zz-ticker { flex-basis: 100%; }

@media (max-width: 899px) {
	.site-header__inner { grid-template-areas: "util brand actions"; }
	.header-utility { display: none; }
	.site-branding { padding: .35rem 0; }
	.site-nav { padding-bottom: 0; justify-self: stretch; }
	.site-actions { margin-left: 0; }
}

/* -------------------------------------------------- Kereső a fejlécben */
.site-actions { gap: .5rem; }
.header-search { position: relative; display: flex; align-items: center; margin: 0; }
.site-search .search-wrap { flex: 1 1 auto; }
.header-search input[type="search"] {
	width: 230px;
	height: 42px;
	padding: 0 2.9rem 0 1.1rem;
	border: 1.5px dashed rgba(78, 107, 104, .45);
	border-radius: 999px;
	background: #faf7f1;
	color: var(--zz-text);
	font-size: .9rem;
	transition: border-color .2s ease, background-color .2s ease, width .25s ease;
	-webkit-appearance: none;
	appearance: none;
}
.header-search input[type="search"]::placeholder { color: #7d8583; }
.header-search input[type="search"]::-webkit-search-cancel-button { display: none; }
.header-search input[type="search"]:focus {
	outline: none;
	width: 280px;
	border-style: solid;
	border-color: var(--zz-brand, #84A3A0);
	background: #fff;
	box-shadow: 0 0 0 3px rgba(217, 164, 65, .25);
}
.header-search__btn {
	position: absolute;
	top: 50%;
	right: 4px;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border: 0;
	border-radius: 50%;
	background: var(--zz-brand-dark, #4E6B68);
	color: #fff;
	cursor: pointer;
	z-index: 2;
	transition: background-color .2s ease, transform .2s ease;
}
.header-search__btn:hover { background: var(--zz-accent, #D9A441); transform: translateY(-50%) rotate(-8deg); }
.header-search__btn .zz-search-icon { width: 17px; height: 17px; }
.search-toggle { color: var(--zz-brand-dark, #4E6B68); }
.search-toggle .zz-search-icon { width: 22px; height: 22px; }
.site-search .search-results { left: auto; right: 0; }

@media (min-width: 900px) {
	.site-search, .site-search[hidden] { display: block; border: 0; background: none; padding: 0; }
	.search-toggle { display: none; }
}
@media (max-width: 899px) {
	.site-search {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		padding: .75rem 1.25rem;
		background: #fff;
		border-top: 1px solid var(--zz-line);
		box-shadow: 0 10px 24px rgba(0, 0, 0, .08);
		z-index: 60;
	}
	.site-search[hidden] { display: none; }
	.header-search input[type="search"], .header-search input[type="search"]:focus { width: 100%; }
	.site-search .search-results { left: 0; right: 0; min-width: 0; }
}
/* A globális gombstílus belső margója ne nyomja össze az ikonokat. */
.site-actions .icon-btn { padding: 0; }
.zz-search-icon { flex: 0 0 auto; display: block; }
.site-search .header-search button.header-search__btn[type="submit"] {
	width: 34px;
	height: 34px;
	padding: 0;
	outline: 1.5px dashed rgba(255, 255, 255, .55);
	outline-offset: -4px;
	border-radius: 50%;
}
.cart-link { color: var(--zz-brand-dark, #4E6B68); }
.cart-link:hover { color: var(--zz-brand-dark, #4E6B68); }
.zz-cart-icon { flex: 0 0 auto; display: block; }
.cart-link .cart-count { background: var(--zz-accent, #D9A441); color: #23282a; top: 0; right: -2px; }

/* ==================================================================
   Galéria: vásárlói szettek referenciaként
   ================================================================== */
.page-galeria .entry-content { max-width: 1080px; margin: 0 auto; counter-reset: zzref; }
.page-galeria .entry-content > * { max-width: none; }
.zz-gallery-intro { max-width: 46rem; margin: 0 auto 1rem; text-align: center; font-size: 1.05rem; line-height: 1.7; color: #4b5250; }
.zz-gallery-note {
	max-width: 46rem;
	margin: 0 auto 3.5rem;
	padding: .9rem 1.2rem .9rem 3.2rem;
	position: relative;
	border: 1.5px dashed rgba(217, 164, 65, .7);
	border-radius: 14px;
	background: #fffaf0;
	font-size: .9rem;
	line-height: 1.6;
	color: #5a5f5d;
}
.zz-gallery-note::before {
	content: "i";
	position: absolute;
	left: 1rem;
	top: .95rem;
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	background: var(--zz-accent, #D9A441);
	color: #23282a;
	font: 700 .85rem/1.5rem Georgia, serif;
	text-align: center;
}

.zz-ref {
	counter-increment: zzref;
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: center;
	margin: 0 0 clamp(3rem, 7vw, 5.5rem);
}
.zz-ref:nth-of-type(even) .zz-ref__photo { order: 2; }
.page-galeria .zz-ref > * { margin: 0 !important; max-width: none !important; }

.zz-ref__photo { position: relative; margin: 0; }
.zz-ref__photo a {
	display: block;
	position: relative;
	padding: 12px;
	background: #fff;
	border-radius: 22px;
	box-shadow: 0 18px 40px rgba(38, 54, 52, .14);
	transform: rotate(-1.5deg);
	transition: transform .35s ease, box-shadow .35s ease;
	cursor: zoom-in;
}
.zz-ref:nth-of-type(even) .zz-ref__photo a { transform: rotate(1.5deg); }
.zz-ref__photo a::after {
	content: "";
	position: absolute;
	inset: 5px;
	border: 1.5px dashed rgba(78, 107, 104, .35);
	border-radius: 18px;
	pointer-events: none;
}
.zz-ref__photo a:hover,
.zz-ref:nth-of-type(even) .zz-ref__photo a:hover { transform: rotate(0) scale(1.015); box-shadow: 0 24px 50px rgba(38, 54, 52, .2); }
.page-galeria .zz-ref__photo img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 14px; }
.zz-ref__photo::before {
	content: counter(zzref, decimal-leading-zero);
	position: absolute;
	z-index: 2;
	top: -18px;
	left: -14px;
	display: grid;
	place-items: center;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: var(--zz-accent, #D9A441);
	color: #23282a;
	font: 700 1.05rem/1 "Ubuntu", sans-serif;
	box-shadow: 0 6px 14px rgba(0, 0, 0, .12);
	outline: 1.5px dashed rgba(255, 255, 255, .8);
	outline-offset: -6px;
}
.zz-ref:nth-of-type(even) .zz-ref__photo::before { left: auto; right: -14px; }

.zz-ref__body > * { margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; }
.zz-ref__tag {
	display: inline-block;
	margin: 0 0 .6rem !important;
	padding: .3rem .8rem;
	border-radius: 999px;
	background: #e6eff3;
	color: var(--zz-brand-dark, #4E6B68);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.zz-ref__title { margin: 0 0 1.1rem !important; font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem); line-height: 1.15; color: var(--zz-brand-dark, #4E6B68); }
.zz-ref__items { list-style: none; margin: 0 0 1.4rem !important; padding: 0 !important; }
.zz-ref__items li {
	position: relative;
	padding: .65rem 0 .65rem 1.9rem;
	border-bottom: 1px dashed rgba(78, 107, 104, .22);
	line-height: 1.5;
	color: #4b5250;
	font-size: .96rem;
}
.zz-ref__items li:last-child { border-bottom: 0; }
.zz-ref__items li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 1.05rem;
	width: 11px;
	height: 11px;
	border-radius: 50%;
	border: 2px solid var(--zz-accent, #D9A441);
	background: #fff;
}
.zz-ref__items li a { color: var(--zz-brand-dark, #4E6B68); text-decoration: none; margin-right: .3rem; }
.zz-ref__items li a strong { border-bottom: 1.5px solid rgba(217, 164, 65, .55); transition: border-color .2s ease; }
.zz-ref__items li a:hover strong { border-color: var(--zz-accent, #D9A441); }
.zz-ref__cta { margin: 0 !important; }
.zz-ref__cta a {
	display: inline-block;
	padding: .8rem 1.5rem;
	border-radius: 999px;
	background: var(--zz-brand-dark, #4E6B68);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
	outline: 1.5px dashed rgba(255, 255, 255, .6);
	outline-offset: -5px;
	transition: background-color .25s ease, outline-color .25s ease;
}
.zz-ref__cta a:hover { background: var(--zz-brand-darker, #3d5553); outline-color: var(--zz-accent-light, #ecc77f); color: #fff; }

.zz-gallery-outro {
	max-width: 46rem;
	margin: 0 auto 2rem;
	padding: 1.6rem 1.8rem;
	border-radius: 22px;
	background: #e6eff3;
	text-align: center;
	line-height: 1.7;
	color: #4b5250;
}
.zz-gallery-outro a { font-weight: 700; color: var(--zz-brand-dark, #4E6B68); }

@media (max-width: 760px) {
	.zz-ref { grid-template-columns: 1fr; gap: 1.6rem; }
	.zz-ref:nth-of-type(even) .zz-ref__photo { order: 0; }
	.page-galeria .zz-ref__photo { max-width: 420px; margin: 0 auto !important; width: 100%; }
	.zz-ref__photo::before, .zz-ref:nth-of-type(even) .zz-ref__photo::before { left: -6px; right: auto; width: 50px; height: 50px; }
}

/* Nagyított kép */
.zz-lightbox { border: 0; padding: 0; background: transparent; max-width: min(92vw, 900px); max-height: 92vh; overflow: visible; }
.zz-lightbox::backdrop { background: rgba(28, 38, 37, .82); }
.zz-lightbox img { display: block; max-width: min(92vw, 900px); max-height: 84vh; width: auto; height: auto; border-radius: 16px; box-shadow: 0 20px 60px rgba(0, 0, 0, .4); }
.zz-lightbox .zz-lightbox__close {
	position: absolute;
	top: -14px;
	right: -14px;
	width: 42px;
	height: 42px;
	padding: 0;
	border-radius: 50%;
	background: #fff;
	color: #23282a;
	font-size: 1.4rem;
	line-height: 42px;
	outline: 0;
	box-shadow: 0 6px 16px rgba(0, 0, 0, .25);
}
.zz-lightbox__caption { margin: .7rem 0 0; text-align: center; color: #fff; font-weight: 600; }

/* A klasszikus sablon a csoport tartalmát belső dobozba teszi: a rács azon él. */
.zz-ref { display: block; }
.zz-ref > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: center;
}
.page-galeria .zz-ref > .wp-block-group__inner-container > * { margin: 0 !important; max-width: none !important; }
.zz-ref__body > .wp-block-group__inner-container > * { margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; }
@media (max-width: 760px) {
	.zz-ref > .wp-block-group__inner-container { grid-template-columns: 1fr; gap: 1.6rem; }
	.page-galeria .zz-ref > .wp-block-group__inner-container > .zz-ref__photo { max-width: 420px; margin: 0 auto !important; width: 100%; }
}

/* Logó kicsit nagyobb */
.site-branding img, .custom-logo { max-height: 84px; }
@media (max-width: 899px) {
	.site-branding img, .custom-logo { max-height: 56px; }
}

/* A termékkategória-sáv halvány zsálya háttérrel elválik a logós sortól */
@media (min-width: 900px) {
	.site-nav {
		justify-self: stretch;
		display: flex;
		justify-content: center;
		margin-top: .35rem;
		padding: .15rem 0;
		background: #eef4f2;
		box-shadow: 0 0 0 100vmax #eef4f2;
		clip-path: inset(0 -100vmax);
		border-top: 1px solid rgba(78, 107, 104, .12);
	}
	.site-nav__list > li > a { padding-top: .7rem; padding-bottom: .7rem; }
}

/* ==================================================================
   Keretezett fotó (mint a galéria szettjeinél): fehér paszpartu,
   belső szaggatott tűzés, enyhe döntés. Rólam oldal + főoldal.
   ================================================================== */
.zz-framed,
.section--about .about__media {
	position: relative;
	padding: 12px;
	background: #fff;
	border-radius: 22px;
	box-shadow: 0 18px 40px rgba(38, 54, 52, .14);
	transform: rotate(-1.8deg);
	transition: transform .35s ease, box-shadow .35s ease;
}
.zz-framed::after,
.section--about .about__media::after {
	content: "";
	position: absolute;
	inset: 5px;
	border: 1.5px dashed rgba(78, 107, 104, .35);
	border-radius: 18px;
	pointer-events: none;
}
.zz-framed:hover,
.section--about .about__media:hover { transform: rotate(0) scale(1.015); box-shadow: 0 24px 50px rgba(38, 54, 52, .2); }
.zz-framed img,
.section--about .about__media img { display: block; width: 100%; border-radius: 14px !important; box-shadow: none !important; }
.section--about .about__media::before,
.zz-about-intro__photo::before {
	content: "♥";
	position: absolute;
	z-index: 2;
	top: -16px;
	left: -14px;
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--zz-accent, #D9A441);
	color: #fff;
	font-size: 1.35rem;
	line-height: 1;
	box-shadow: 0 6px 14px rgba(0, 0, 0, .12);
	outline: 1.5px dashed rgba(255, 255, 255, .85);
	outline-offset: -6px;
}

/* ==================================================================
   Rólam oldal
   ================================================================== */
.page-rolam .entry-content { max-width: 1080px; margin: 0 auto; }
.page-rolam .wp-block-group__inner-container > * { max-width: none; }

.zz-about-intro > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(1.8rem, 5vw, 4rem);
	align-items: center;
	margin-bottom: clamp(2.5rem, 6vw, 4.5rem);
}
.page-rolam .zz-about-intro .wp-block-group__inner-container > * { margin-left: 0; margin-right: 0; }
.zz-about-intro__photo { margin: 0 !important; }
.zz-about-intro__photo img { aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; }
.zz-eyebrow {
	margin: 0 0 .5rem !important;
	color: #3f6475;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
}
.zz-about-intro__title { margin: 0 0 1.1rem !important; font-size: clamp(1.7rem, 1.2rem + 1.7vw, 2.6rem); line-height: 1.15; color: var(--zz-brand-dark, #4E6B68); }
.zz-about-intro__body p:not(.zz-eyebrow),
.zz-about-closing__body p { font-size: clamp(1rem, .97rem + .2vw, 1.08rem); line-height: 1.75; color: #44504e; }

.zz-about-quote {
	position: relative;
	max-width: 50rem !important;
	margin: 0 auto clamp(2.5rem, 6vw, 4.5rem) !important;
	padding: 2.2rem 2rem 1.8rem !important;
	border: 0 !important;
	border-radius: 24px;
	background: #e6eff3;
	text-align: center;
}
.zz-about-quote::before {
	content: "“";
	position: absolute;
	top: -.35em;
	left: 50%;
	transform: translateX(-50%);
	color: var(--zz-accent, #D9A441);
	font: 700 5rem/1 Georgia, serif;
}
.zz-about-quote p {
	margin: 0 !important;
	font-family: "Ubuntu", sans-serif;
	font-size: clamp(1.25rem, 1rem + 1vw, 1.7rem);
	font-weight: 500;
	line-height: 1.45;
	color: var(--zz-brand-dark, #4E6B68);
}

.zz-about-facts > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.2rem;
	margin-bottom: clamp(3rem, 7vw, 5rem);
}
.zz-about-fact { margin: 0 !important; }
.zz-about-fact > .wp-block-group__inner-container {
	height: 100%;
	padding: 1.5rem 1.3rem 1.3rem;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(38, 54, 52, .08);
	outline: 1.5px dashed rgba(78, 107, 104, .25);
	outline-offset: -7px;
	transition: transform .25s ease, box-shadow .25s ease;
}
.zz-about-fact:hover > .wp-block-group__inner-container { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(38, 54, 52, .12); }
.zz-about-fact__num {
	margin: 0 0 .35rem !important;
	font-family: "Ubuntu", sans-serif;
	font-size: 1.7rem;
	font-weight: 700;
	line-height: 1.1;
	color: var(--zz-accent, #D9A441);
	hyphens: manual;
}
.zz-about-fact__title { margin: 0 0 .45rem !important; font-size: 1.05rem; color: var(--zz-brand-dark, #4E6B68); }
.zz-about-fact p:not(.zz-about-fact__num) { margin: 0; font-size: .92rem; line-height: 1.6; color: #5a5f5d; }

.zz-about-closing > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: clamp(1.8rem, 5vw, 4rem);
	align-items: center;
	margin-bottom: clamp(3rem, 7vw, 5rem);
}
.page-rolam .zz-about-closing .wp-block-group__inner-container > * { margin-left: 0; margin-right: 0; }
.zz-about-closing__photo { margin: 0 !important; transform: rotate(1.8deg); }
.zz-about-closing__photo img { aspect-ratio: 4 / 5; object-fit: cover; }
.zz-about-closing__title { margin: 0 0 1rem !important; font-size: clamp(1.5rem, 1.1rem + 1.3vw, 2.2rem); color: var(--zz-brand-dark, #4E6B68); }
.zz-about-sign { font-family: "Ubuntu", sans-serif; }
.zz-about-sign strong { font-size: 1.25rem; color: var(--zz-brand-dark, #4E6B68); }
.zz-about-buttons { gap: .7rem; margin-top: 1.4rem; }
.zz-about-buttons .wp-block-button__link {
	padding: .85rem 1.55rem;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none;
	outline-offset: -5px;
}
.zz-btn-solid .wp-block-button__link { background: var(--zz-brand-dark, #4E6B68); color: #fff; outline: 1.5px dashed rgba(255, 255, 255, .6); }
.zz-btn-ghost .wp-block-button__link { background: transparent; color: var(--zz-brand-dark, #4E6B68); box-shadow: inset 0 0 0 1px rgba(78, 107, 104, .35); outline: 1.5px dashed var(--zz-brand-dark, #4E6B68); }
.zz-about-buttons .wp-block-button__link:hover { outline-color: var(--zz-accent, #D9A441); }

.zz-about-contact > .wp-block-group__inner-container {
	max-width: 50rem;
	margin: 0 auto 2rem;
	padding: 2rem 1.8rem;
	border-radius: 24px;
	background: var(--zz-brand-dark, #4E6B68);
	color: #fff;
	text-align: center;
	outline: 1.5px dashed rgba(255, 255, 255, .45);
	outline-offset: -9px;
}
.zz-about-contact__title { margin: 0 0 .5rem !important; color: #fff; }
.zz-about-contact p { color: rgba(255, 255, 255, .9); }
.zz-about-contact__links { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; }
.zz-about-contact__links a {
	display: inline-block;
	padding: .5rem 1rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	transition: background-color .2s ease;
}
.zz-about-contact__links a:hover { background: rgba(255, 255, 255, .24); color: #fff; }
.zz-about-contact__cta { margin-bottom: 0 !important; }
.zz-about-contact__cta a {
	display: inline-block;
	padding: .8rem 1.6rem;
	border-radius: 999px;
	background: var(--zz-accent, #D9A441);
	color: #23282a;
	font-weight: 700;
	text-decoration: none;
}
.zz-about-contact__cta a:hover { background: #e8b95e; color: #23282a; }

@media (max-width: 900px) {
	.zz-about-facts > .wp-block-group__inner-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.zz-about-intro > .wp-block-group__inner-container,
	.zz-about-closing > .wp-block-group__inner-container { grid-template-columns: 1fr; }
	.zz-about-intro__photo, .zz-about-closing__photo { max-width: 360px; width: 100%; margin: 0 auto !important; }
	.zz-about-closing__photo { order: -1; }
	.zz-about-intro__body, .zz-about-closing__body { text-align: left; }
}
@media (max-width: 480px) {
	.zz-about-facts > .wp-block-group__inner-container { grid-template-columns: 1fr; }
}

/* A kategóriasáv háttere álelemen: a clip-path levágta a lenyíló menüt. */
@media (min-width: 900px) {
	.site-header { overflow-x: clip; }
	.site-nav {
		position: relative;
		z-index: 5;
		background: none;
		box-shadow: none;
		clip-path: none;
		border-top: 0;
	}
	.site-nav::before {
		content: "";
		position: absolute;
		z-index: -1;
		top: 0;
		bottom: 0;
		left: 50%;
		width: 100vw;
		transform: translateX(-50%);
		background: #eef4f2;
		border-top: 1px solid rgba(78, 107, 104, .12);
		pointer-events: none;
	}
}

/* Ajándékutalvány egyenlege linkek */
.zz-gift-balance-row { margin: 1rem 0 0; font-size: .92rem; color: #5a5f5d; }
.zz-gift-balance { color: var(--zz-brand-dark, #4E6B68); font-weight: 600; text-decoration: underline; text-decoration-color: rgba(217, 164, 65, .7); text-underline-offset: 3px; }
.zz-gift-balance:hover { text-decoration-color: var(--zz-accent, #D9A441); }
.zz-gift-balance--cart { display: inline-block; margin-left: .75rem; font-size: .88rem; }

/* ==================================================================
   Ajándékutalvány egyenlege
   ================================================================== */
.page-ajandekutalvany-egyenleg .entry-content { max-width: 980px; margin: 0 auto; }
.zz-balance { display: flex; justify-content: center; margin: .5rem 0 3rem; }
.zz-balance__card {
	position: relative;
	width: 100%;
	max-width: 600px;
	padding: 3.2rem 2.4rem 2.2rem;
	border-radius: 26px;
	background: #fff;
	box-shadow: 0 20px 50px rgba(38, 54, 52, .12);
	text-align: center;
	outline: 1.5px dashed rgba(78, 107, 104, .28);
	outline-offset: -10px;
}
.zz-balance__card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 10px;
	border-radius: 26px 26px 0 0;
	background: repeating-linear-gradient(90deg, #4E6B68 0 38px, #84A3A0 38px 76px, #D9A441 76px 114px);
}
.zz-balance__icon {
	position: absolute;
	top: -38px;
	left: 50%;
	transform: translateX(-50%);
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: #fffaf0;
	box-shadow: 0 8px 20px rgba(38, 54, 52, .12);
	outline: 1.5px dashed rgba(217, 164, 65, .8);
	outline-offset: -7px;
}
.zz-balance__icon img { width: 50px; height: 50px; }
.zz-balance__title { margin: .6rem 0 .45rem; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); color: var(--zz-brand-dark, #4E6B68); }
.zz-balance__lead { margin: 0 auto 1.6rem; max-width: 26rem; color: #5a5f5d; }
.zz-balance__form { margin: 0; text-align: left; }
.zz-balance__label { display: block; margin: 0 0 .45rem; font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #3f6475; }
.zz-balance__row { display: flex; gap: .6rem; }
.zz-balance__row input[type="text"] {
	flex: 1 1 auto;
	min-width: 0;
	height: 54px;
	padding: 0 1.1rem;
	border: 1.5px dashed rgba(78, 107, 104, .45);
	border-radius: 14px;
	background: #faf7f1;
	font: 600 1.05rem/1 ui-monospace, "SFMono-Regular", Consolas, monospace;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--zz-text);
}
.zz-balance__row input[type="text"]::placeholder { color: #a7aeac; letter-spacing: .12em; }
.zz-balance__row input[type="text"]:focus { outline: none; border-style: solid; border-color: var(--zz-brand, #84A3A0); background: #fff; box-shadow: 0 0 0 3px rgba(217, 164, 65, .25); }
.zz-balance__row .zz-balance__submit { flex: 0 0 auto; height: 54px; border-radius: 14px; padding: 0 1.5rem; }

.zz-balance__result {
	margin-top: 1.4rem;
	padding: 1.2rem 1.2rem 1.3rem;
	border-radius: 18px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .3rem;
	animation: zz-balance-in .35s ease;
}
@keyframes zz-balance-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.zz-balance__result--ok { background: #eef4f2; }
.zz-balance__result--expired { background: #fff4e0; }
.zz-balance__result--missing { background: #fdecea; }
.zz-balance__result-label { color: #4b5250; font-size: .95rem; }
.zz-balance__amount { font: 700 clamp(1.9rem, 1.5rem + 1.5vw, 2.6rem)/1.1 "Ubuntu", sans-serif; color: var(--zz-brand-dark, #4E6B68); }
.zz-balance__result--expired .zz-balance__amount { color: #9a6a12; }
.zz-balance__shop { margin-top: .3rem; font-weight: 700; color: var(--zz-brand-dark, #4E6B68); }

/* Segítség kártyák az űrlap alatt */
.zz-balance-help > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.1rem;
	margin-bottom: 2.5rem;
}
.zz-balance-help__item { margin: 0 !important; }
.zz-balance-help__item > .wp-block-group__inner-container {
	height: 100%;
	padding: 1.4rem 1.3rem 1.2rem;
	border-radius: 20px;
	background: #e6eff3;
}
.zz-balance-help__item h3 { margin: 0 0 .45rem; font-size: 1.02rem; color: var(--zz-brand-dark, #4E6B68); }
.zz-balance-help__item p { margin: 0; font-size: .92rem; line-height: 1.6; color: #4b5250; }
.zz-balance-help__item a { font-weight: 700; color: var(--zz-brand-dark, #4E6B68); }
@media (max-width: 760px) {
	.zz-balance__card { padding: 3rem 1.3rem 1.6rem; }
	.zz-balance__row { flex-direction: column; }
	.zz-balance__row .zz-balance__submit { width: 100%; }
	.zz-balance-help > .wp-block-group__inner-container { grid-template-columns: 1fr; }
}
.zz-balance__card .zz-balance__lead { margin-left: auto !important; margin-right: auto !important; }

/* Kosár: egy mező a kuponnak és az utalványnak, alatta rövid magyarázat */
.woocommerce-cart table.cart td.actions .coupon { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.woocommerce-cart table.cart td.actions .coupon #coupon_code { min-width: 15rem; }
.zz-coupon-help { flex-basis: 100%; margin: .15rem 0 0; font-size: .85rem; color: #5a5f5d; text-align: left; }
.zz-coupon-help .zz-gift-balance { margin-left: .25rem; }


/* ==================================================================
   Ajándékutalvány termékoldal (WooCommerce Gift Cards + Name Your Price)
   ================================================================== */
.woocommerce div.product form.cart .nyp { margin: 0 0 1.4rem; }
.zz-gift-amounts__title { margin: 0 0 .55rem; font-weight: 700; color: var(--zz-brand-dark, #4E6B68); }
.zz-gift-amounts { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.woocommerce div.product form.cart .zz-gift-amount {
	padding: .6rem 1.15rem;
	border-radius: 999px;
	background: #fff;
	color: var(--zz-brand-dark, #4E6B68);
	box-shadow: inset 0 0 0 1.5px rgba(78, 107, 104, .35);
	outline: 1.5px dashed transparent;
	outline-offset: -5px;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	transition: background-color .2s ease, color .2s ease;
}
.woocommerce div.product form.cart .zz-gift-amount:hover { background: #eef4f2; color: var(--zz-brand-dark, #4E6B68); }
.woocommerce div.product form.cart .zz-gift-amount.is-active { background: var(--zz-brand-dark, #4E6B68); color: #fff; outline-color: rgba(255, 255, 255, .6); box-shadow: none; }
.woocommerce div.product form.cart .nyp label { display: block; margin: 0 0 .35rem; font-size: .9rem; font-weight: 600; color: #4b5250; }
.woocommerce div.product form.cart .nyp-input {
	width: 12rem;
	max-width: 100%;
	height: 48px;
	padding: 0 1rem;
	border: 1.5px dashed rgba(78, 107, 104, .45);
	border-radius: 12px;
	background: #faf7f1;
	font-size: 1.05rem;
	font-weight: 700;
}
.woocommerce div.product form.cart .nyp-input:focus { outline: none; border-style: solid; border-color: var(--zz-brand, #84A3A0); background: #fff; box-shadow: 0 0 0 3px rgba(217, 164, 65, .25); }
.woocommerce div.product form.cart .nyp .minimum-price { margin: .35rem 0 0; font-size: .85rem; color: #6b7270; }
.woocommerce div.product form.cart .woocommerce-nyp-message { margin-top: .4rem; color: #b3261e; font-size: .88rem; }

.woocommerce_gc_giftcard_form {
	margin: 0 0 1.4rem;
	padding: 1.2rem 1.2rem .4rem;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(38, 54, 52, .07);
	outline: 1.5px dashed rgba(78, 107, 104, .22);
	outline-offset: -7px;
}
.woocommerce_gc_giftcard_form .wc_gc_field { margin: 0 0 1rem; padding: 0; }
.woocommerce_gc_giftcard_form label { display: block; margin: 0 0 .35rem; font-weight: 600; font-size: .92rem; color: #2f3a38; }
.woocommerce_gc_giftcard_form .required { color: #b3261e; text-decoration: none; border: 0; }
.woocommerce_gc_giftcard_form .input-text { width: 100%; padding: .65rem .85rem; border-radius: 10px; }
.woocommerce_gc_giftcard_form .description { display: block; margin-top: .3rem; font-size: .82rem; color: #6b7270; }
.woocommerce_gc_giftcard_form .reset_delivery_date { margin-left: .5rem; font-size: .85rem; color: var(--zz-brand-dark, #4E6B68); }


/* Lábléc: közösségi ikonok */
.footer-social { display: flex; gap: .5rem; margin: .8rem 0 0; padding: 0; list-style: none; }
.footer-social__link {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	outline: 1.5px dashed rgba(255, 255, 255, .35);
	outline-offset: -5px;
	transition: background-color .2s ease, transform .2s ease;
}
.footer-social__link:hover { background: var(--zz-accent, #D9A441); color: #23282a; transform: translateY(-2px); }


/* ==================================================================
   Gyakori kérdések (harmonika) és Méretek
   ================================================================== */
.page-gyik .entry-content, .page-meretek .entry-content { max-width: 880px; margin: 0 auto; }
.zz-faq-intro, .zz-sizes-intro { max-width: 42rem; margin: 0 auto 2rem; text-align: center; font-size: 1.05rem; line-height: 1.7; color: #4b5250; }
.zz-faq-group { margin: 2.4rem 0 .9rem; font-size: clamp(1.25rem, 1rem + .8vw, 1.6rem); color: var(--zz-brand-dark, #4E6B68); }
.zz-faq { margin: 0 0 .6rem; border-radius: 16px; background: #fff; box-shadow: 0 6px 18px rgba(38, 54, 52, .06); outline: 1.5px dashed rgba(78, 107, 104, .2); outline-offset: -6px; overflow: hidden; }
.zz-faq summary {
	position: relative;
	padding: 1rem 3.2rem 1rem 1.3rem;
	font-weight: 700;
	color: #2f3a38;
	cursor: pointer;
	list-style: none;
}
.zz-faq summary::-webkit-details-marker { display: none; }
.zz-faq summary::after {
	content: "+";
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #eef4f2;
	color: var(--zz-brand-dark, #4E6B68);
	font-size: 1.2rem;
	line-height: 1;
	transition: transform .25s ease, background-color .25s ease;
}
.zz-faq[open] summary::after { content: "–"; background: var(--zz-accent, #D9A441); color: #23282a; }
.zz-faq summary:hover { color: var(--zz-brand-dark, #4E6B68); }
.zz-faq > p { margin: 0; padding: 0 1.3rem 1.1rem; color: #4b5250; line-height: 1.7; }
.zz-faq-outro { margin: 2.5rem auto 1rem; padding: 1.3rem 1.5rem; border-radius: 18px; background: #e6eff3; text-align: center; }

.zz-sizes__group { margin: 0 0 2.4rem; }
.zz-sizes__title { margin: 0 0 .8rem; font-size: clamp(1.25rem, 1rem + .8vw, 1.6rem); color: var(--zz-brand-dark, #4E6B68); }
.zz-sizes__table-wrap { overflow-x: auto; border-radius: 16px; box-shadow: 0 6px 18px rgba(38, 54, 52, .06); }
.zz-sizes__table { width: 100%; border-collapse: collapse; background: #fff; min-width: 520px; }
.zz-sizes__table th, .zz-sizes__table td { padding: .8rem 1rem; border-bottom: 1px dashed rgba(78, 107, 104, .2); text-align: left; vertical-align: top; }
.zz-sizes__table thead th { background: #eef4f2; color: var(--zz-brand-dark, #4E6B68); font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; }
.zz-sizes__table tbody th { width: 34%; font-weight: 700; }
.zz-sizes__table tbody th a { color: #2f3a38; text-decoration: none; }
.zz-sizes__table tbody th a:hover { color: var(--zz-brand-dark, #4E6B68); text-decoration: underline; }
.zz-sizes__row { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
.zz-sizes__row + .zz-sizes__row { margin-top: .5rem; }
.zz-sizes__variant { margin-right: .3rem; font-size: .9rem; color: #5a5f5d; }
.zz-sizes__chip { display: inline-block; padding: .2rem .6rem; border-radius: 999px; background: #faf7f1; box-shadow: inset 0 0 0 1px rgba(78, 107, 104, .25); font-size: .85rem; color: #2f3a38; white-space: nowrap; }
.zz-faq-intro, .zz-sizes-intro, .zz-faq-outro { margin-left: auto !important; margin-right: auto !important; }


/* ==================================================================
   Egységes űrlapmezők (pénztár, fiók, kapcsolat, linkgyűjtemény)
   ================================================================== */
.woocommerce-checkout .form-row .input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea,
.woocommerce-account .woocommerce form .input-text,
.woocommerce-account .woocommerce form select,
.woocommerce-cart .cart .actions .coupon input,
.fluentform .ff-el-form-control {
	min-height: 48px;
	padding: .7rem 1rem;
	border: 1.5px dashed rgba(78, 107, 104, .38);
	border-radius: 12px;
	background: #faf7f1;
	color: var(--zz-text);
	font-size: 1rem;
	box-shadow: none;
	transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.woocommerce-checkout .form-row textarea,
.fluentform textarea.ff-el-form-control { min-height: 7rem; }
.woocommerce-checkout .form-row .input-text:hover,
.woocommerce-checkout .form-row select:hover,
.woocommerce-account .woocommerce form .input-text:hover,
.fluentform .ff-el-form-control:hover { border-color: rgba(78, 107, 104, .6); }
.woocommerce-checkout .form-row .input-text:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-account .woocommerce form .input-text:focus,
.woocommerce-cart .cart .actions .coupon input:focus,
.fluentform .ff-el-form-control:focus {
	outline: none;
	border-style: solid;
	border-color: var(--zz-brand, #84A3A0);
	background: #fff;
	box-shadow: 0 0 0 3px rgba(217, 164, 65, .25);
}
.woocommerce-checkout .form-row.woocommerce-invalid .input-text,
.woocommerce-checkout .form-row.woocommerce-invalid select { border-color: #c0392b; border-style: solid; background: #fff7f6; }
.woocommerce-checkout .form-row.woocommerce-validated .input-text { border-color: rgba(78, 107, 104, .55); }
.woocommerce-checkout .form-row label,
.fluentform .ff-el-input--label label { font-weight: 700; font-size: .88rem; color: #2f3a38; margin-bottom: .35rem; }
.woocommerce-checkout .form-row .required { color: var(--zz-accent-dark, #b9822a); text-decoration: none; border: 0; }

/* országválasztó (select2 / selectWoo) */
.woocommerce-checkout .select2-container .select2-selection--single {
	height: 48px;
	border: 1.5px dashed rgba(78, 107, 104, .38);
	border-radius: 12px;
	background: #faf7f1;
}
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered { line-height: 45px; padding-left: 1rem; color: var(--zz-text); }
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow { height: 45px; right: 8px; }
.woocommerce-checkout .select2-container--open .select2-selection--single { border-style: solid; border-color: var(--zz-brand, #84A3A0); background: #fff; }
.select2-dropdown { border: 1.5px solid var(--zz-brand, #84A3A0); border-radius: 12px; overflow: hidden; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--zz-brand-dark, #4E6B68); }

/* jelölőnégyzetek */
.woocommerce-checkout input[type="checkbox"],
.fluentform input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--zz-brand-dark, #4E6B68); vertical-align: -3px; margin-right: .45rem; }
.woocommerce-checkout #ship-to-different-address label { font-size: 1rem; font-weight: 700; }

/* szakaszcímek és dobozok */
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading { font-size: 1.2rem; color: var(--zz-brand-dark, #4E6B68); }
.woocommerce-checkout #customer_details .woocommerce-billing-fields,
.woocommerce-checkout #customer_details .woocommerce-shipping-fields,
.woocommerce-checkout #customer_details .woocommerce-additional-fields {
	padding: 1.4rem 1.4rem .6rem;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(38, 54, 52, .06);
	outline: 1.5px dashed rgba(78, 107, 104, .18);
	outline-offset: -8px;
}
.woocommerce-checkout #customer_details .woocommerce-billing-fields h3,
.woocommerce-checkout #customer_details .woocommerce-additional-fields h3 { margin-top: 0; }
.woocommerce-checkout #order_review {
	border: 0;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(38, 54, 52, .06);
	outline: 1.5px dashed rgba(78, 107, 104, .18);
	outline-offset: -8px;
	padding: 1.4rem;
}
.woocommerce-checkout #order_review table.shop_table { border: 0; border-radius: 14px; overflow: hidden; background: #faf7f1; }
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td { border-color: rgba(78, 107, 104, .12); }
.woocommerce-checkout #order_review .order-total th,
.woocommerce-checkout #order_review .order-total td { background: #eef4f2; color: var(--zz-brand-dark, #4E6B68); font-size: 1.1rem; }
.woocommerce-checkout #payment { border-radius: 16px; background: #faf7f1; }
.woocommerce-checkout #payment div.payment_box { border-radius: 12px; background: #eef4f2; color: #2f3a38; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #eef4f2; }
.woocommerce-checkout #place_order { width: 100%; min-height: 54px; border-radius: 999px; font-size: 1rem; }
.woocommerce-checkout .variation dt, .woocommerce-checkout .variation dd { font-size: .85rem; }

.fluentform .ff-btn-submit { border-radius: 999px !important; padding: .9rem 1.8rem; outline: 1.5px dashed rgba(255, 255, 255, .6); outline-offset: -5px; }
.fluentform .ff_gdpr_field + span, .fluentform .ff-el-form-check-label { font-size: .88rem; line-height: 1.5; color: #4b5250; }

/* ==================================================================
   Linkgyűjtemény doboz és felugró ablak
   ================================================================== */
.zz-linkbox {
	display: flex;
	gap: 1.4rem;
	align-items: flex-start;
	max-width: 980px;
	margin: 2.5rem auto;
	padding: 1.8rem 2rem;
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(38, 54, 52, .07);
	outline: 1.5px dashed rgba(78, 107, 104, .22);
	outline-offset: -9px;
}
.zz-linkbox--product { clear: both; }
.zz-linkbox__icon { flex: 0 0 auto; display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: #fffaf0; outline: 1.5px dashed rgba(217, 164, 65, .7); outline-offset: -6px; }
.zz-linkbox__icon img { width: 44px; height: 44px; }
.zz-linkbox__title { margin: .1rem 0 .6rem; font-size: clamp(1.2rem, 1rem + .7vw, 1.55rem); color: var(--zz-brand-dark, #4E6B68); }
.zz-linkbox__body p { margin: 0 0 1rem; color: #4b5250; line-height: 1.65; font-size: .95rem; }
.zz-linkbox__button { border-radius: 999px; }
@media (max-width: 640px) {
	.zz-linkbox { flex-direction: column; padding: 1.4rem 1.2rem; }
}

.zz-linkdialog {
	width: min(92vw, 520px);
	max-height: 90vh;
	padding: 2rem 1.8rem 1.4rem;
	border: 0;
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .25);
	outline: 1.5px dashed rgba(78, 107, 104, .25);
	outline-offset: -10px;
}
.zz-linkdialog::backdrop { background: rgba(28, 38, 37, .6); }
.zz-linkdialog__title { margin: 0 0 .4rem; font-size: 1.35rem; color: var(--zz-brand-dark, #4E6B68); }
.zz-linkdialog__lead { margin: 0 0 1.2rem; color: #5a5f5d; font-size: .95rem; }
.zz-linkdialog .zz-linkdialog__close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 38px;
	height: 38px;
	padding: 0;
	border-radius: 50%;
	background: #eef4f2;
	color: var(--zz-brand-dark, #4E6B68);
	font-size: 1.4rem;
	line-height: 38px;
	outline: 0;
}
.zz-linkdialog .zz-linkdialog__close:hover { background: var(--zz-accent, #D9A441); color: #23282a; }
.zz-linkdialog .ff-message-success { border: 0; border-radius: 14px; background: #eef4f2; color: #2f3a38; box-shadow: none; padding: 1rem 1.2rem; }

/* A WooCommerce saját mezőstílusa (.woocommerce form .form-row .input-text) erősebb volt: itt felülírjuk. */
body.woocommerce-checkout form .form-row .input-text,
body.woocommerce-checkout form .form-row select,
body.woocommerce-checkout form .form-row textarea,
body.woocommerce-account form .form-row .input-text,
body.woocommerce-account form .form-row select {
	border: 1.5px dashed rgba(78, 107, 104, .38);
	border-radius: 12px;
	background-color: #faf7f1;
	padding: .7rem 1rem;
}
body.woocommerce-checkout form .form-row .input-text:focus,
body.woocommerce-checkout form .form-row select:focus,
body.woocommerce-checkout form .form-row textarea:focus,
body.woocommerce-account form .form-row .input-text:focus {
	border-style: solid;
	border-color: var(--zz-brand, #84A3A0);
	background-color: #fff;
	box-shadow: 0 0 0 3px rgba(217, 164, 65, .25);
	outline: none;
}
body.woocommerce-checkout form .form-row.woocommerce-invalid .input-text,
body.woocommerce-checkout form .form-row.woocommerce-invalid select { border-color: #c0392b; border-style: solid; background-color: #fff7f6; }
body .fluentform .ff-el-form-control { border: 1.5px dashed rgba(78, 107, 104, .38); border-radius: 12px; background-color: #faf7f1; }
body .fluentform .ff-el-form-control:focus { border-style: solid; border-color: var(--zz-brand, #84A3A0); background-color: #fff; box-shadow: 0 0 0 3px rgba(217, 164, 65, .25); }

/*
 * Csomagkedvezmény a végösszegnél: áthúzott eredeti ár, az új ár, és alatta a
 * magyarázó sor.
 *
 * A sor keskeny oszlopban is törjön szépen: a felirat balra, az árak jobbra
 * kerülnek, és ha nem férnek el egymás mellett, egész elemként esnek a
 * következő sorba. Az ár számjegyei sosem tördelődnek szét.
 */
.zz-set__total {
	flex-wrap: wrap;
	row-gap: .2rem;
}

.zz-total__old,
.zz-set__total .zz-total__value {
	white-space: nowrap;
}

/* A két ár (áthúzott és új) együtt marad: egy sorban, jobbra rendezve. */
.zz-total__sum {
	display: flex;
	flex: 1 1 10rem;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: flex-end;
	gap: 0 .6rem;
	margin-left: auto;
}

.zz-total__old {
	color: var(--muted, #8a8178);
	font-weight: 400;
	text-decoration: line-through;
}

.zz-set__total .zz-total__value.is-empty {
	white-space: normal;
	text-align: right;
}

.zz-total__note {
	flex: 1 0 100%;
	color: var(--muted, #8a8178);
	font-size: .9rem;
	text-align: right;
}

/* Csomagpont-tilalom magyarázata a kosárban és a pénztárban. */
.zz-pickup-note td {
	padding-top: .25rem;
	color: var(--muted, #8a8178);
	font-size: .9rem;
	line-height: 1.45;
}

/* Csomagkedvezmény: jelvény, áthúzott eredeti ár. */
.zz-badge--discount {
	background: var(--zz-brand-darker);
	color: #fff;
}

.zz-badge-wrap--left {
	right: auto;
	left: .6rem;
}

.zz-price--bundle {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1.25;
}

.zz-price__old {
	color: var(--zz-muted);
	font-size: .85em;
	font-weight: 400;
	text-decoration: line-through;
}

/* A termékoldalon az ár nagy, ott a két ár egy sorban álljon. */
.single-product div.product .zz-price--bundle {
	flex-direction: row;
	align-items: baseline;
	gap: .6rem;
}

/* A listában a jelvény a kerete mellé van rögzítve (jobbról 12 px). A bal oldali
   példánynak balról kell indulnia, különben kilóg a kártyából. */
.woocommerce ul.products li.product .zz-badge-wrap--left .zz-badge {
	right: auto !important;
	left: 12px !important;
}

/* Készletértesítő (Back In Stock Notifier) – elfogyott terméknél.
   A bővítmény Bootstrapját a shop-fixes.php leveszi; itt a ZaZita kártyastílusa. */
.cwginstock-subscribe-form {
	margin: 1rem 0 1.25rem;
	padding: 1.1rem 1.25rem 1.25rem;
	background: var(--zz-bg-soft);
	border: 1.5px dashed rgba(78, 107, 104, .22);
	border-radius: 14px;
}
.cwginstock-subscribe-form .cwginstock-panel-heading h4 {
	margin: 0 0 .85rem;
	color: var(--zz-brand-dark);
	font-size: 1.05rem;
	line-height: 1.35;
	text-align: left !important;
}
.cwginstock-subscribe-form .row,
.cwginstock-subscribe-form [class*="col-"] { margin: 0; padding: 0; }
.cwginstock-subscribe-form .form-group { margin: 0 0 .65rem; }
.cwginstock-subscribe-form .cwgstock_email { text-align: left !important; }
.cwginstock-subscribe-form .cwgstock_button {
	width: 100%;
	padding: .75rem 1rem;
	border: 0;
	border-radius: var(--zz-radius);
	background: var(--zz-brand-dark);
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .02em;
}
.cwginstock-subscribe-form .cwgstock_button:hover,
.cwginstock-subscribe-form .cwgstock_button:focus-visible { background: var(--zz-brand-darker); }
.cwginstock-subscribe-form .cwginstocksuccess,
.cwginstock-subscribe-form .cwginstockerror { margin-top: .5rem; font-size: .92rem; }
.cwginstock-subscribe-form .cwginstocksuccess { color: var(--zz-brand-dark) !important; }
.cwginstock-subscribe-form .cwginstockerror { color: #a33 !important; }
