/* Kolormánia rendelő – a blokk stílusa.
   Minden szín és távolság CSS-változó, amit az Elementor widget Stílus füle állít. */

.kolormania {
	--km-dark:     #1f5976;
	--km-teal:     #358b8e;
	--km-yellow:   var(--e-global-color-accent, #f4c64d);
	--km-text:     #1f5976;
	--km-cream:    #fbf3dd;
	--km-teal-bg:  #84cacb;
	--km-card-bg:  #ffffff;
	--km-line:     #cfe3e6;
	--km-check:    #fcd54d;
	--km-card-line:#bcd4dc;

	--km-col-gap:  28px;
	--km-title-gap: 56px;
	--km-card-gap: 20px;
	--km-card-pad: 24px;
	--km-col-pad:  30px;
	--km-row-gap:  13px;
	--km-radius:   0;

	--km-title-font: "Marcellus", Georgia, serif;
	--km-text-font:  var(--e-global-typography-text-font-family, inherit);

	font-family: var(--km-text-font);
	color: var(--km-text);
	line-height: 1.55;
}

.kolormania *,
.kolormania *::before,
.kolormania *::after { box-sizing: border-box; }

/* ---- Fő elrendezés ---- */
.km-order {
	display: grid;
	grid-template-columns: minmax(210px, 1fr) minmax(0, 2.95fr);
	gap: var(--km-col-gap);
	align-items: start;
}
.km-col-title {
	font-family: var(--km-title-font);
	color: var(--km-dark);
	text-transform: uppercase;
	letter-spacing: .06em;
	text-align: center;
	font-weight: 600;
	margin: 0 0 var(--km-title-gap);
	font-size: clamp(1.25rem, 2.2vw, 1.85rem);
}

/* ---- Kártya alap ---- */
.km-card {
	background: var(--km-card-bg);
	border-radius: var(--km-radius);
	padding: var(--km-card-pad);
	border: 1px solid var(--km-card-line);
}
.km-card-title {
	font-family: var(--km-title-font);
	color: var(--km-dark);
	text-transform: uppercase;
	letter-spacing: .04em;
	font-weight: 600;
	margin: 0;
	font-size: 1.05rem;
}
.km-lead { font-size: .9rem; margin: 0; }

/* ---- Dinamikus kártya ---- */
.km-single {
	background: var(--km-cream);
	border-radius: var(--km-radius);
	padding: var(--km-col-pad);
}
.km-single-card {
	display: flex;
	flex-direction: column;
	gap: var(--km-row-gap);
}
.km-single-media { margin: 0; }
.km-single-image {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--km-radius);
	display: block;
	background: #fff;
}
.km-image-placeholder {
	background: repeating-linear-gradient(45deg, #efe9dc 0 12px, #e6ded0 12px 24px);
}
.km-single-form { display: flex; flex-direction: column; gap: var(--km-row-gap); }
.km-single-detail { margin: 0; }
.km-detail-line { margin: 2px 0; font-size: .9rem; }
.km-detail-subtitle { color: var(--km-dark); }

/* ---- Mezők ---- */
.kolormania .km-field-label {
	display: block;
	font-size: .82rem;
	font-weight: 600;
	color: var(--km-dark);
	margin: 0 0 4px;
	/* Az ékezetek és a lelógó szárak (g, y, j) ne vágódjanak le */
	line-height: 1.45;
	padding-bottom: 2px;
	overflow: visible;
}
.kolormania .km-select {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--km-line);
	border-radius: 0;
	background: #fff;
	font: inherit;
	color: var(--km-text);
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23205f72' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	/* Az ékezetek és a lelógó szárak (g, y, j) ne vágódjanak le */
	line-height: 1.5;
	height: auto;
	min-height: 44px;
}
.kolormania .km-select:focus { outline: 2px solid var(--km-teal); outline-offset: 1px; }

/* ---- Ár ---- */
.km-price {
	font-family: var(--km-title-font);
	color: var(--km-dark);
	font-size: 1.55rem;
	font-weight: 700;
	margin: 0;
	text-align: center;
}
.km-price del { font-size: .7em; opacity: .6; font-weight: 400; }

/* ---- Gomb ---- */
.kolormania .km-btn {
	display: block;
	width: 100%;
	border: 1px solid var(--km-dark);
	border-radius: 0;
	background: var(--km-yellow);
	color: var(--km-dark);
	font-family: var(--km-title-font);
	text-transform: uppercase;
	letter-spacing: .05em;
	font-weight: 700;
	font-size: .95rem;
	padding: 13px 16px;
	cursor: pointer;
	transition: filter .15s ease, transform .05s ease;
}
.kolormania .km-btn:hover { filter: brightness(.96); }
.kolormania .km-btn:active { transform: translateY(1px); }

/* ---- Statikus kártyák ---- */
.km-packages {
	background: var(--km-teal-bg);
	border-radius: var(--km-radius);
	padding: var(--km-col-pad);
}
.km-package-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1fr);
	grid-template-rows: auto auto auto auto 1fr auto auto auto auto;
	gap: 0 var(--km-card-gap);
	align-items: start;
}
.km-package-card {
	display: grid;
	grid-row: 1 / -1;
	grid-template-rows: subgrid;
	gap: 0;
	position: relative;
	align-content: start;
}
.km-package-card > * { margin-top: var(--km-row-gap); margin-bottom: 0; }
.km-package-card > .km-badge-row { margin-top: 0; }
.km-package-image {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--km-radius);
	display: block;
	background: #fff;
}
.km-contents-title { font-weight: 600; color: var(--km-dark); font-size: .9rem; }
.kolormania .km-contents { list-style: none; padding: 0; margin: 0; }
.kolormania .km-contents li {
	position: relative;
	padding-left: 21px;
	margin: 4px 0;
	font-size: .88rem;
	list-style: none;
}
.kolormania .km-contents li::before {
	content: "✓";
	position: absolute;
	left: 0;
		color: var(--km-check);
	font-weight: 700;
}

/* Badge sor mindig helyet foglal, hogy a címek egy vonalban legyenek */
.km-badge-row { min-height: 18px; text-align: center; position: static; }
.km-badge {
	position: absolute;
	top: -16px;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	min-width: 64%;
	background: var(--km-dark);
	color: #fff;
	font-family: var(--km-title-font);
	font-size: .8rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	padding: 6px 18px;
	border-radius: 0;
	white-space: nowrap;
}

/* Kiemelt kártya: nagyobb háttérkeret, hogy a belső sorok igazítása maradjon */
.km-featured::before {
	content: "";
	position: absolute;
	left: -8px;
	right: -8px;
	top: -16px;
	bottom: -16px;
	background: var(--km-card-bg);
	border: 2px solid var(--km-yellow);
	border-radius: var(--km-radius);
	overflow: visible;
	z-index: 0;
}
.km-featured > * { position: relative; z-index: 1; }
/* a szalag a KÁRTYÁHOZ igazodjon, ne a saját sorához */
.km-featured > .km-badge-row { position: static; }

/* A paraméter-címke azonos magasságot foglaljon minden kártyán */
.kolormania .km-package-field .km-field-label {
	min-height: 3em;
	display: flex;
	align-items: flex-end;
	padding-bottom: 4px;
	overflow: visible;
}
.km-package-btn { align-self: end; }

/* ---- Lábjegyzet / megjegyzés ---- */
.km-footnotes { margin-top: var(--km-col-gap); }
.km-footnotes p { font-size: .78rem; color: #6a7a7f; margin: 3px 0; }
.km-note {
	max-width: 900px;
	margin: var(--km-col-gap) auto 0;
	text-align: center;
	font-size: .9rem;
	color: #55666b;
}

/* ---- Reszponzív ---- */
@media (max-width: 900px) {
	.km-order { grid-template-columns: 1fr; }
	.km-package-grid {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		gap: var(--km-card-gap);
	}
	.km-package-card {
		grid-row: auto;
		grid-template-rows: none;
		display: flex;
		flex-direction: column;
	}
	.km-featured::before { top: -8px; bottom: -8px; }
	.km-featured { margin: 8px 0; }
}



/* ---- Egységes kártyaszerkezet (kép, cím, szöveg, mezők, lista, ár, gomb, *) ---- */
.km-fields { display: flex; flex-direction: column; }
.km-contents-block { min-height: 0; }
.km-card-note {
	font-size: .72rem;
	line-height: 1.45;
	color: var(--km-text);
	opacity: .75;
	text-align: center;
	margin: 0;
}
.km-card-note:empty { display: none; }

/* Az egyedi kártya ugyanazt a ritmust kapja, mint a csomagok */
.km-single-contents { margin: 0; }
.km-single-card .km-card-title,
.km-package-card .km-card-title { text-align: center; }
.km-single-card .km-lead,
.km-package-card .km-lead { text-align: center; }

/* Ár fölé vékony vonal, ahogy a terven */
.km-price {
	border-top: 1px solid var(--km-line);
	padding-top: 10px;
}

/* A türkiz dobozon a lábjegyzet fehér, középre */
.km-packages .km-footnotes p {
	color: #fff;
	text-align: center;
	font-size: .82rem;
	line-height: 1.55;
}

/* =========================================================
   SZÍNKÁRTYA
   ========================================================= */
.kmsz {
	--kmsz-bg: #fbf3dd;
	--kmsz-gap: 32px;
	--kmsz-pad: 24px;
	--kmsz-swatch: 58px;
	--kmsz-outer: 32px;
	padding: var(--kmsz-outer);
}
@media (max-width: 600px) {
	.kmsz { --kmsz-outer: 16px; }
}
.kmsz-grid {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: var(--kmsz-gap);
	align-items: center;
}
.kmsz-heading {
	font-family: var(--km-title-font);
	color: var(--km-dark);
	font-size: 1.5rem;
	margin: 0 0 12px;
}
.kmsz-lead { margin: 0 0 12px; font-size: .95rem; }
.kmsz-highlight { color: var(--km-dark); font-weight: 600; margin: 0 0 16px; font-size: .95rem; }
.kmsz-photos { display: flex; flex-wrap: wrap; gap: 12px; }
.kmsz-photos img {
	max-width: 100%;
	flex: 1 1 320px;
	border-radius: var(--km-radius);
	display: block;
	box-shadow: 0 6px 22px rgba(32, 95, 114, .12);
}

/* --- a rendelő kártya --- */
.kmsz-card {
	background: var(--kmsz-bg);
	border-radius: var(--km-radius);
	padding: var(--kmsz-pad);
}
.kmsz-card-title {
	font-family: var(--km-title-font);
	color: var(--km-dark);
	text-transform: uppercase;
	letter-spacing: .04em;
	font-size: 1.1rem;
	margin: 0 0 14px;
}
.kmsz-form { display: flex; flex-direction: column; gap: 7px; }
.kmsz-colors-label { margin-top: 10px; }
.kmsz-hint {
	margin: 0 0 6px;
	font-size: .82rem;
	color: #6a7a7f;
	display: flex;
	justify-content: space-between;
	gap: 10px;
}
.kmsz-counter { font-weight: 700; color: var(--km-dark); }

/* --- évszak szűrő --- */
.kmsz-filter { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.kmsz-tab {
	border: 1px solid var(--km-line);
	background: #fff;
	color: var(--km-dark);
	border-radius: 999px;
	padding: 6px 14px;
	font: inherit;
	font-size: .82rem;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.kmsz-tab:hover { background: #f1f7f8; }
.kmsz-tab.is-active { background: var(--km-dark); color: #fff; border-color: var(--km-dark); }

/* --- szövetminták --- */
.kmsz-swatches {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(var(--kmsz-swatch), 1fr));
	gap: 7px;
	max-height: 250px;
	overflow-y: auto;
	padding: 6px;
	background: #fff;
	border: 1px solid var(--km-line);
	border-radius: 10px;
}
.kmsz-swatch { display: block; cursor: pointer; text-align: center; position: relative; }
.kmsz-swatch input { position: absolute; opacity: 0; width: 0; height: 0; }
.kmsz-thumb {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 8px;
	overflow: hidden;
	border: 3px solid transparent;
	transition: border-color .15s ease, transform .1s ease;
}
.kmsz-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kmsz-swatch:hover .kmsz-thumb { transform: translateY(-1px); }
.kmsz-swatch input:checked + .kmsz-thumb { border-color: var(--km-dark); }
.kmsz-swatch input:focus-visible + .kmsz-thumb { outline: 2px solid var(--km-teal); outline-offset: 2px; }
.kmsz-swatch input:checked + .kmsz-thumb::after {
	content: "✓";
	position: absolute;
	top: 4px; right: 6px;
	color: #fff;
	font-weight: 700;
	text-shadow: 0 1px 3px rgba(0,0,0,.6);
}
.kmsz-name {
	display: block;
	font-size: .62rem;
	line-height: 1.3;
	margin-top: 4px;
	color: var(--km-text);
}
.kmsz-swatch.is-hidden,
.kmpal-item.is-hidden { display: none; }
.kmsz-swatch.is-disabled { opacity: .35; pointer-events: none; }

.kmsz-selected {
	font-size: .85rem;
	color: var(--km-dark);
	min-height: 1.2em;
	margin-top: 4px;
}
.kmsz-selected strong { font-weight: 700; }
.kmsz-price { margin-top: 6px; }
.kmsz-note { font-size: .78rem; color: #6a7a7f; margin: 0 0 4px; text-align: center; }
.kmsz-warning { color: #b32d2e; font-weight: 600; margin: 0; }

@media (max-width: 900px) {
	.kmsz-grid { grid-template-columns: 1fr; }
}

/* ---- Színpaletta (ALAPSZÍNEK galéria) ---- */
.kmpal { --kmpal-tile: 160px; --kmpal-gap: 14px; }
.kmpal-intro { text-align: center; color: var(--km-dark); font-weight: 600; margin: 0 0 12px; }
.kmpal-filter { justify-content: center; margin-bottom: 18px; }
.kmpal-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(var(--kmpal-tile), 1fr));
	gap: var(--kmpal-gap);
}
.kmpal-item { margin: 0; text-align: center; }
.kmpal-thumb {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 4px 14px rgba(32, 95, 114, .10);
}
.kmpal-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kmpal-name { font-size: .85rem; color: var(--km-dark); margin-top: 6px; font-weight: 600; }
.kmpal-seasons { font-size: .72rem; color: #6a7a7f; font-style: italic; }
.kmpal-hint { font-size: .7rem; color: #7d8c91; font-style: italic; line-height: 1.35; margin-top: 2px; }
.kmpal-note { font-size: .8rem; color: #6a7a7f; margin-top: 18px; text-align: center; }


/* =========================================================
   Oldalcímek sárga léniával (Elementor heading, km-title-lines osztály)
   ========================================================= */
.km-title-lines .elementor-heading-title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 22px;
}
.km-title-lines .elementor-heading-title::before,
.km-title-lines .elementor-heading-title::after {
	content: "";
	flex: 1 1 0;
	max-width: 150px;
	height: 1px;
	background: #f4c64d;
}

/* A piktogramos sáv */
.km-hint-band { border: 1px solid #e6e6e2; }
.km-hint-band .elementor-widget-text-editor { font-size: 15px; }

/* =========================================================
   01–04 folyamatábra – azonos magasságú kártyák
   ========================================================= */
.km-steps { align-items: stretch !important; }

.km-step { align-self: stretch; }
.km-step > .e-con,
.km-step > .e-child { flex-grow: 1; }

/* a szám középre, a kártya tetejére ülve */
.km-step-num {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-bottom: -6px !important;
	position: relative;
	z-index: 2;
}

/* a szöveg töltse ki a maradék helyet, hogy a kártyák egyforma magasak legyenek */
.km-step-card { justify-content: flex-start; }

@media (max-width: 767px) {
	.km-step-num { margin-bottom: 0 !important; }
}

/* =========================================================
   Webshop nyitóoldal
   ========================================================= */

/* A kategóriakártyák egyforma magasak, a képek azonos képarányúak.
   A forrásképek eltérő arányúak (álló/fekvő), ezért itt vágjuk egységesre. */
/* Az Elementor „boxed” konténernél a kártyák a .e-con-inner gyerekei,
   ezért oda kell célozni – és align-self kell a height:100% helyett. */
.km-ws-card { align-self: stretch; }
.km-ws-card img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
}

/* Az évszak-képeken a színpaletta bele van égetve – ezeket NEM vágjuk. */
.km-ws-season img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	display: block;
}

/* A sorozat-minták viszont vághatók fekvőre, ahogy a terven. */
.km-ws-serie img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
}

/* A második kategóriasor (2 kártya) a felső sorral azonos kártyaszélességet
   kapjon, középre igazítva – ne nyúljon szét fél oldalasra. */
.km-ws-row2 .e-con-inner { justify-content: center; }
.km-ws-row2 .e-con-inner > .e-con {
	flex: 0 0 calc((100% - 44px) / 3);
	max-width: calc((100% - 44px) / 3);
}

@media (max-width: 767px) {
	.km-ws-row2 .e-con-inner > .e-con {
		flex: 1 1 100%;
		max-width: 100%;
	}
}

/* =========================================================
   Webshop fejléc – türkiz kategóriasáv
   ========================================================= */
.km-shopbar__in {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: 16px;
}
.km-shopbar__list {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 0;
}
.km-shopbar__item { position: relative; list-style: none; margin: 0; }
.km-shopbar__item a {
	display: flex;
	align-items: center;
	height: 100%;
	padding: 14px 16px;
	color: #ffffff;
	text-decoration: none;
	font-size: 13.5px;
	letter-spacing: .04em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background .15s ease;
}
.km-shopbar__item a:hover { background: rgba(255,255,255,.14); }

/* Az aktív kategória fehér alapon, ahogy a terven. */
.km-shopbar__item--active a {
	background: #ffffff;
	color: #1f5976;
	font-weight: 600;
}

/* Almenü: színtípus / kollekciók / sorozatok */
.km-shopbar__sub {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: #ffffff;
	border: 1px solid #cfe3e6;
	list-style: none;
	margin: 0;
	padding: 6px 0;
	display: none;
	z-index: 60;
	box-shadow: 0 10px 26px rgba(31,89,118,.16);
}
.km-shopbar__has-sub:hover .km-shopbar__sub,
.km-shopbar__has-sub:focus-within .km-shopbar__sub { display: block; }
.km-shopbar__sub li { list-style: none; margin: 0; }
.km-shopbar__sub a {
	color: #1f5976;
	text-transform: none;
	letter-spacing: 0;
	padding: 9px 16px;
	font-size: 14px;
}
.km-shopbar__sub a:hover { background: #f2f8f9; }

/* Jobb szélső blokk – világosabb türkiz. */
.km-shopbar__cta {
	display: flex;
	align-items: center;
	padding: 14px 22px;
	background: #7cb8b9;
	color: #ffffff;
	text-decoration: none;
	font-size: 13.5px;
	letter-spacing: .04em;
	text-transform: uppercase;
	white-space: nowrap;
}
.km-shopbar__cta:hover { background: #6aa9aa; color: #fff; }

/* A felső sor mezői */
.km-shophead__phone p { margin: 0; font-size: 14px; }
.km-shophead__phone a { color: #1f5976; text-decoration: none; font-weight: 600; }
.km-shophead__search { max-width: 320px; width: 100%; }

@media (max-width: 900px) {
	.km-shopbar__in { flex-direction: column; padding: 0; }
	.km-shopbar__list { justify-content: center; }
	.km-shopbar__cta { justify-content: center; }
	.km-shopbar__sub { position: static; display: block; box-shadow: none; border: 0; background: transparent; }
	.km-shopbar__sub a { color: #eaf6f7; padding-left: 34px; }
}

/* A kollekció-bannerek: a szöveg a képre kerül, a bal oldali világos sávra. */
.km-ws-koll { position: relative; }
.km-ws-koll__text p { font-size: 13px; line-height: 1.5; margin: 0 0 6px; }
.km-ws-koll .elementor-button { padding: 9px 18px; }


/* =========================================================
   Webshop segéd navigáció – az oldal tartalmában
   ========================================================= */

/* A sáv törjön ki a tartalom-konténerből, és érjen ki a képernyő széléig. */
/* A negatív margós kitörés a szülő belső margóját nem hozza le, ezért a
   sávot a nézetablak közepére pozicionáljuk – így a szülő paddingja
   nem számít. */
/* Teljes szélességű HÁTTÉR görgetősáv-biztosan.
   A 100vw a gördítősáv miatt vízszintes görgetést okozna, ezért a sávot a
   tartalom szélességében hagyjuk, és a hátteret box-shadow-val terítjük ki.
   A clip-path megakadályozza, hogy az árnyék görgetést okozzon. */
.km-ws-nav {
	box-shadow: 0 0 0 100vmax #358b8e;
	clip-path: inset(0 -100vmax);
}

/* Egy sorba férjen a 7 menüpont + a jobb szélső blokk. */
.km-ws-nav .km-shopbar__list { flex-wrap: nowrap; }
.km-ws-nav .km-shopbar__item a { padding: 13px 12px; font-size: 12.5px; letter-spacing: .02em; }
.km-ws-nav .km-shopbar__cta { padding: 13px 18px; font-size: 12.5px; letter-spacing: .02em; }

@media (max-width: 1100px) {
	.km-ws-nav .km-shopbar__item a { padding: 12px 9px; font-size: 11.5px; }
	.km-ws-nav .km-shopbar__cta { padding: 12px 14px; font-size: 11.5px; }
}
@media (max-width: 900px) {
	.km-ws-nav .km-shopbar__list { flex-wrap: wrap; }
}

/* =========================================================
   Kollekció-bannerek – olvasható szöveg a fotón
   ========================================================= */

/* Világos fátyol a bal oldalon, hogy a szöveg elváljon a képtől. */
.km-ws-koll::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 70%;
	background: linear-gradient( to right, rgba(255,255,255,.96) 0%, rgba(255,255,255,.94) 52%, rgba(255,255,255,.75) 66%, rgba(255,255,255,0) 100% );
	pointer-events: none;
}
.km-ws-koll > * { position: relative; z-index: 1; }

/* A kollekció neve a terven kisbetűs, nem verzál. */
.km-ws-koll .elementor-heading-title { text-transform: none; }

@media (max-width: 767px) {
	.km-ws-koll::before { width: 100%; background: rgba(255,255,255,.9); }
}

/* =========================================================
   Utazonagykoveteim oldal
   ========================================================= */
.km-nk-alcim { font-size: 1.05rem; font-style: italic; color: var(--km-teal); margin: 0; }
.km-nk-apro { font-size: .82rem; color: #6a7a7f; font-style: italic; margin: 0; }

/* --- interaktiv terkep --- */
/* A szinek itt SZANDEKOSAN tartalek-ertekkel szerepelnek: a terkep egy
   Elementor HTML-widget, ami nem feltetlenul van a .kolormania hatokoreben,
   ahol a --km-* tokenek definialva vannak. */
.km-map { position: relative; display: block; max-width: 100%; margin: 0 auto; line-height: 0; }
.km-map__img { display: block; width: 100%; height: auto; }

.km-map__pin {
	position: absolute;
	transform: translate(-50%, -100%);
	transform-origin: 50% 100%;
	width: 22px;
	height: 31px;
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent !important;   /* a téma gomb-háttere ne jelenjen meg */
	border: 0 !important;
	box-shadow: none !important;
	cursor: pointer;
	line-height: 0;
	z-index: 2;
	-webkit-appearance: none;
	appearance: none;
}
.km-map__pin svg {
	width: 100%;
	height: 100%;
	display: block;
	fill: var(--km-teal, #358b8e);
	transition: fill .16s ease;
}
/* hoverre csak a szín változik – nincs nagyítás, nincs keret */
.km-map__pin:hover,
.km-map__pin:focus,
.km-map__pin:focus-visible,
.km-map__pin.is-active {
	background: transparent !important;
	outline: none !important;
	z-index: 5;
}
.km-map__pin:hover svg,
.km-map__pin:focus-visible svg,
.km-map__pin.is-active svg { fill: var(--km-check, #fcd54d); }

/* A felirat kis feher kartya a tu FOLOTT. Minden orokolheto tipografiai
   tulajdonsagot kiirunk, hogy a tema stilusa ne szivarogjon bele. */
.km-map__label {
	position: absolute;
	bottom: calc(100% + 7px);
	left: 50%;
	transform: translateX(-50%) translateY(3px);
	display: block;
	white-space: nowrap;
	text-align: center;
	background: #fff;
	border: 1px solid #cfe3e6;
	border-radius: 3px;
	box-shadow: 0 6px 18px rgba(31, 89, 118, .18);
	padding: 6px 11px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .16s ease, transform .16s ease;
	pointer-events: none;
}
.km-map__pin:hover .km-map__label,
.km-map__pin:focus-visible .km-map__label,
.km-map__pin.is-active .km-map__label {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}
/* nyilacska a kartya aljan */
.km-map__label::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border: 5px solid transparent;
	border-top-color: #fff;
	filter: drop-shadow(0 1px 0 #cfe3e6);
}
.km-map__label strong,
.km-map__label em {
	display: block;
	font-family: inherit;
	font-style: normal;
	text-transform: none;
	letter-spacing: 0;
	line-height: 1.25;
	margin: 0;
}
.km-map__label strong { font-size: 13px; font-weight: 600; color: var(--km-dark, #1f5976); }
.km-map__label em { font-size: 11px; font-weight: 400; color: #7d949e; margin-top: 1px; }

@media (max-width: 640px) {
	.km-map__pin { width: 17px; height: 24px; }
	.km-map__label { padding: 5px 9px; }
	.km-map__label strong { font-size: 11px; }
	.km-map__label em { font-size: 10px; }
}

/* --- felhivas doboz --- */
.km-nk-felhivas > .e-con-inner { align-items: center; }

/* --- galeria --- */
.km-nk-galeria > .e-con-inner {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: center;
}
.km-nk-galeria > .e-con-inner > .e-con {
	flex: 0 0 calc((100% - 60px) / 4);
	max-width: calc((100% - 60px) / 4);
}
.km-nk-foto img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	display: block;
}
.km-nk-foto-cim p {
	margin: 0;
	font-size: .82rem;
	font-style: italic;
	color: #6a7a7f;
}
@media (max-width: 1024px) {
	.km-nk-galeria > .e-con-inner > .e-con {
		flex: 0 0 calc((100% - 20px) / 2);
		max-width: calc((100% - 20px) / 2);
	}
}
@media (max-width: 560px) {
	.km-nk-galeria > .e-con-inner > .e-con { flex: 0 0 100%; max-width: 100%; }
}

/* Aktiv szuro sav a bolt-archivumon */
.km-aktiv-szuro {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	background: #eaf5f5;
	border-left: 3px solid #358b8e;
	padding: 10px 16px;
	margin: 0 0 20px;
	font-size: .9rem;
	color: #1f5976;
}
.km-aktiv-szuro a { color: #358b8e; text-decoration: underline; }

/* km-shopbar – betűtípus: ugyanaz, mint a fejléc főmenüjében (Marcellus, nagybetűs); egy sorban marad */
.km-shopbar .km-shopbar__list { flex-wrap: nowrap; }
.km-shopbar .km-shopbar__list a,
.km-shopbar .km-shopbar__cta {
	font-family: var(--km-title-font, "Marcellus", Georgia, serif);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: .2px;
	text-transform: uppercase;
	white-space: nowrap;
}
.km-shopbar .km-shopbar__list a { padding: 13px 11px; }
.km-shopbar .km-shopbar__cta { padding: 13px 16px; }
@media (max-width: 1100px) { .km-shopbar .km-shopbar__list { flex-wrap: wrap; } }
.km-shopbar .km-shopbar__sub a {
	font-family: var(--km-title-font, "Marcellus", Georgia, serif);
	font-size: 13px;
	letter-spacing: .2px;
	text-transform: none;
}

/* km-ws-koll – a szöveg ne fusson rá a háttérkép jobb oldalán lévő táskára/motívumra.
   Az Elementor a widget szélességét a --container-widget-width változóból veszi,
   és a saját szabálya erősebb a sima max-width-nél – ezért a változót is állítjuk,
   magasabb specificitással. A fehér ::before átmenet 62% széles, a szöveg 56%-ban marad. */
.e-con.km-ws-koll > .elementor-element.elementor-widget,
.e-con.km-ws-koll > .e-con-inner > .elementor-element.elementor-widget {
	--container-widget-width: 56%;
	max-width: 56%;
}
@media (max-width: 767px) {
	.e-con.km-ws-koll > .elementor-element.elementor-widget,
	.e-con.km-ws-koll > .e-con-inner > .elementor-element.elementor-widget {
		--container-widget-width: 100%;
		max-width: 100%;
	}
}

/* =========================================================
   Évszak-fülek a mintaterv szerint (Alapszínek / Színspiráció galéria)
   Halványtürkiz sáv, benne 5 egyforma fehér doboz, az aktív sárga.
   Az Elementor Pro galéria „Összes” füle natívan mindig az első –
   a terv szerint utolsó, ezért order-rel tesszük hátra.
   Csak a két színkalauz-oldalra szól (page-id), hogy más galériát ne érintsen.
   ========================================================= */
.page-id-811 .elementor-widget-gallery .elementor-gallery__titles-container,
.page-id-1249 .elementor-widget-gallery .elementor-gallery__titles-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px;
	width: 100%;
	max-width: 100%;
	margin: 0 0 26px;
	padding: 12px 14px;
	background: #bfe0e0;
	box-sizing: border-box;
}
.page-id-811 .elementor-widget-gallery .elementor-gallery-title,
.page-id-1249 .elementor-widget-gallery .elementor-gallery-title {
	flex: 1 1 0;
	min-width: 120px;
	margin: 0;
	padding: 11px 10px;
	text-align: center;
	background: #ffffff;
	border: 1px solid #8fc4c5;
	border-radius: 0;
	font-family: var(--km-title-font, "Marcellus", Georgia, serif);
	font-size: 15px;
	font-weight: 400;
	letter-spacing: .6px;
	text-transform: uppercase;
	color: #1f5976;
	transition: background .15s ease, border-color .15s ease;
}
.page-id-811 .elementor-widget-gallery .elementor-gallery-title:first-child,
.page-id-1249 .elementor-widget-gallery .elementor-gallery-title:first-child { order: 10; }
.page-id-811 .elementor-widget-gallery .elementor-gallery-title:hover,
.page-id-1249 .elementor-widget-gallery .elementor-gallery-title:hover { background: #fff7d6; border-color: #fcd54d; color: #1f5976; }
.page-id-811 .elementor-widget-gallery .elementor-gallery-title.elementor-item-active,
.page-id-1249 .elementor-widget-gallery .elementor-gallery-title.elementor-item-active { background: #fcd54d; border-color: #fcd54d; color: #1f5976; }
.page-id-811 .elementor-widget-gallery .elementor-gallery-title::before,
.page-id-1249 .elementor-widget-gallery .elementor-gallery-title::before,
.page-id-811 .elementor-widget-gallery .elementor-gallery-title::after,
.page-id-1249 .elementor-widget-gallery .elementor-gallery-title::after { display: none !important; content: none !important; }
@media (max-width: 640px) {
	.page-id-811 .elementor-widget-gallery .elementor-gallery-title,
.page-id-1249 .elementor-widget-gallery .elementor-gallery-title { flex: 1 1 calc(50% - 14px); min-width: 0; font-size: 13px; padding: 9px 6px; }
}

/* =========================================================
   Kategóriaoldal (bolt / termékkategória) – 03-WEBSHOP terv
   ========================================================= */
.km-kat .woocommerce-products-header__title,
.km-kat h1.page-title {
	font-family: var(--km-title-font, "Marcellus", Georgia, serif);
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #1f5976;
	text-align: center;
	font-weight: 400;
}
.km-kat .woocommerce-products-header { text-align: center; }
.km-kat .term-description,
.km-kat .woocommerce-products-header .term-description p { color: #1f5976; max-width: 760px; margin-left: auto; margin-right: auto; text-align: center; }

/* két oszlop: bal a szűrő, jobb minden más */
@media (min-width: 922px) {
	.km-kat .ast-woocommerce-container {
		display: grid;
		grid-template-columns: 290px minmax(0, 1fr);
		column-gap: 34px;
		align-items: start;
	}
	.km-kat .ast-woocommerce-container > * { grid-column: 2; }
	.km-kat .ast-woocommerce-container > .km-f { grid-column: 1; grid-row: 1 / span 30; }
	.km-kat ul.products,
	.km-kat ul.products.columns-4,
	.km-kat ul.products.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
.km-kat .woocommerce-result-count { display: none; }

/* --- szűrőpanel --- */
.km-f { background: #eaf5f5; padding: 18px 18px 8px; font-size: .9rem; color: #1f5976; }
.km-f__group { border-bottom: 1px solid #bcd4dc; padding: 12px 0; }
.km-f__group:last-child { border-bottom: 0; }
.km-f__title {
	display: flex; justify-content: space-between; align-items: center; width: 100%;
	background: none; border: 0; padding: 0; margin: 0 0 8px; cursor: pointer;
	font-family: inherit; font-size: .82rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #1f5976; text-align: left;
}
.km-f__title--static { cursor: default; }
.km-f__plus::before { content: "\2013"; font-weight: 400; font-size: 1rem; line-height: 1; }
.km-f__group.is-closed .km-f__plus::before { content: "+"; }
.km-f__group.is-closed .km-f__body { display: none; }
.km-f__opt { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; cursor: pointer; font-weight: 400; }
.km-f__opt input { margin: 0; width: 15px; height: 15px; accent-color: #358b8e; }
.km-f__chip {
	display: inline-flex; align-items: center; gap: 6px; margin: 0 6px 6px 0; padding: 4px 9px;
	background: #fff; border: 1px solid #bcd4dc; border-radius: 3px; color: #1f5976; font-size: .8rem; text-decoration: none;
}
.km-f__chip b { font-weight: 700; color: #1f5976; }
.km-f__chip:hover { border-color: #358b8e; }
.km-f__clear { display: inline-block; margin-top: 2px; font-size: .8rem; text-decoration: underline; color: #1f5976; }
.km-f__paletta { display: flex; flex-wrap: wrap; gap: 7px; }
.km-f__paletta.is-short .km-f__sw--extra { display: none; }
.km-f__paletta.is-open .km-f__sw--extra { display: inline-block; }
.km-f__sw { position: relative; width: 24px; height: 24px; cursor: pointer; margin: 0; }
.km-f__sw input { position: absolute; opacity: 0; width: 0; height: 0; }
.km-f__sw span { display: block; width: 24px; height: 24px; border: 1px solid rgba(31,89,118,.25); box-sizing: border-box; }
.km-f__sw.is-on span, .km-f__sw input:checked + span { outline: 2px solid #fcd54d; outline-offset: 1px; border-color: #1f5976; }
.km-f__more { background: none; border: 0; padding: 8px 0 0; font-size: .8rem; color: #1f5976; text-decoration: underline; cursor: pointer; font-family: inherit; }

/* --- kártyák --- */
.km-kat ul.products li.product {
	border: 1px solid #8fc4c5; background: #fff; padding: 10px 10px 16px; text-align: center; box-sizing: border-box;
}
.km-kat ul.products li.product .ast-on-card-button,
.km-kat ul.products li.product .ast-woo-product-category { display: none !important; }
.km-kat ul.products li.product .woocommerce-loop-product__title,
.km-termek .km-ajanlo .woocommerce-loop-product__title { font-size: .95rem; color: #1f5976; font-weight: 600; margin: 8px 0 2px; }
.km-stock { display: block; font-size: .8rem; margin: 0 0 4px; }
.km-stock--keszleten { color: #1a7f37; }
.km-stock--rendelheto { color: #c47a12; }
.km-stock--elfogyott { color: #b32d2e; }
.km-kat ul.products li.product .price { color: #1f5976; font-weight: 700; display: block; margin: 0 0 10px; }
.km-kat ul.products li.product .button {
	background: #fcd54d !important; color: #1f5976 !important; border: 0 !important; border-radius: 0 !important;
	font-family: var(--km-title-font, "Marcellus", Georgia, serif); text-transform: uppercase; letter-spacing: .5px; padding: 9px 22px !important;
}
.km-kat ul.products li.product .button:hover { background: #f4c64d !important; }

/* --- rács alatti szöveg, legutóbb megnézett --- */
.km-kat-alatt { margin: 40px 0 10px; color: #1f5976; max-width: 900px; }
.km-kat-alatt h3 { font-family: var(--km-title-font, "Marcellus", Georgia, serif); font-weight: 400; letter-spacing: 1px; color: #1f5976; margin: 26px 0 8px; font-size: 1.25rem; }
.km-kat-alatt h3:first-child { text-transform: uppercase; font-size: 1.4rem; }
.km-legutobb { margin: 36px 0 10px; padding: 18px 20px; background: #f4f9f9; }
.km-legutobb h3 { font-size: .85rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #1f5976; margin: 0 0 12px; }
.km-legutobb__row { display: flex; flex-wrap: wrap; gap: 14px; }
.km-legutobb__row a { width: 110px; border: 1px solid #dde9ec; background: #fff; padding: 4px; }
.km-legutobb__row img { width: 100%; height: auto; display: block; }

/* =========================================================
   Termékoldal – 03-WEBSHOP terv
   ========================================================= */
.km-termek .product_title { font-family: var(--km-title-font, "Marcellus", Georgia, serif); text-transform: uppercase; letter-spacing: 1.5px; color: #1f5976; font-weight: 400; }
.km-termek .single-product-category { display: none; }
.km-termek .summary .price { font-family: var(--km-title-font, "Marcellus", Georgia, serif); font-size: 1.8rem; color: #1f5976; }
.km-pm { margin: 6px 0 16px; color: #1f5976; font-size: .95rem; line-height: 1.5; }
.km-pm__meret { font-weight: 700; margin-bottom: 4px; }
.km-pm__stock { font-weight: 700; text-transform: uppercase; font-size: .85rem; margin-bottom: 4px; }
.km-pm__row span { display: inline-block; min-width: 92px; }
.km-pm__row em { font-style: normal; color: #358b8e; font-weight: 700; }
.km-ps {
	display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 14px 0 22px; padding: 14px 0;
	border-top: 1px solid #f4c64d; border-bottom: 1px solid #f4c64d; color: #1f5976; font-size: .9rem; line-height: 1.5;
}
.km-ps__col strong { display: block; font-size: .8rem; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 4px; }
.km-ps__col small { display: block; margin-top: 6px; color: #6a8b97; font-size: .78rem; }
@media (max-width: 560px) { .km-ps { grid-template-columns: 1fr; } }
.km-termek .single_add_to_cart_button {
	background: #fcd54d !important; color: #1f5976 !important; border: 0 !important; border-radius: 0 !important;
	font-family: var(--km-title-font, "Marcellus", Georgia, serif); text-transform: uppercase; letter-spacing: 1px; font-size: 1.05rem; padding: 14px 36px !important;
}
.km-termek .woocommerce-tabs ul.tabs li a { text-transform: uppercase; letter-spacing: .5px; color: #1f5976; font-size: .9rem; }
.km-termek .woocommerce-tabs ul.tabs li.active a { font-weight: 700; }
.km-ajanlo { margin: 44px 0 10px; }
.km-ajanlo__cim { text-align: center; font-size: 1rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #1f5976; margin: 0 0 22px; }
.km-ajanlo ul.products li.product { text-align: center; }
.km-ajanlo ul.products li.product .ast-on-card-button, .km-ajanlo ul.products li.product .ast-woo-product-category { display: none !important; }
.km-ajanlo ul.products li.product .price { font-family: var(--km-title-font, "Marcellus", Georgia, serif); color: #1f5976; }
.km-ajanlo ul.products li.product .button { background: #fff !important; color: #1f5976 !important; border: 1px solid #8fc4c5 !important; border-radius: 0 !important; font-size: .7rem; letter-spacing: 1px; text-transform: uppercase; padding: 6px 18px !important; }

/* Termékoldal: az Astra a saját sorrendjében írja ki az összefoglalót, ezért a sorrendet
   flex order-rel állítjuk a terv szerint: cím · ár · méret/készlet/szín · rövid leírás ·
   gyártás+szállítás · kosár. A cikkszám/kategória sor és a cím feletti kategória-link nem kell. */
.km-termek .summary { display: flex; flex-direction: column; }
.km-termek .summary > * { order: 50; }
.km-termek .summary > .woocommerce-breadcrumb, .km-termek .summary > .ast-breadcrumbs { order: 1; }
.km-termek .summary > .product_title { order: 2; }
.km-termek .summary > .woocommerce-product-rating { order: 3; }
.km-termek .summary > .price { order: 4; margin-bottom: 6px; }
.km-termek .summary > .km-pm { order: 5; }
.km-termek .summary > .woocommerce-product-details__short-description { order: 6; }
.km-termek .summary > .km-ps { order: 7; }
.km-termek .summary > form.cart { order: 8; }
.km-termek .summary > .product_meta,
.km-termek .summary > .single-product-category,
.km-termek .summary .single-product-category { display: none !important; }

/* webshop-fejléc felső sor: a telefon ne vágódjon le, a kereső ne nyúljon szét */
.km-shophead .km-shophead__phone { flex: 0 0 auto; width: auto !important; max-width: none !important; }
.km-shophead__phone p { white-space: nowrap; margin: 0; }
.km-shophead .km-shophead__search { flex: 1 1 auto; max-width: 460px; }

/* Színkártya: „már a kosárban van” visszajelzés */
.kmsz-inCart { background: #eaf5ea; border-left: 3px solid #1a7f37; color: #1f5976; padding: 10px 14px; margin: 0 0 14px; font-size: .9rem; line-height: 1.5; }
.kmsz-inCart a { color: #358b8e; text-decoration: underline; white-space: nowrap; }
.km-notices .woocommerce-error { margin-bottom: 14px; }

/* Szállítási módok listája (kosár, pénztár): rádiógomb + név egy sorban, CSAK a díj megy új sorba alá */
.woocommerce-shipping-methods li { display: flex !important; align-items: flex-start; gap: 8px; text-indent: 0 !important; padding-left: 0 !important; margin: 0 0 10px !important; }
.woocommerce-shipping-methods li label { text-indent: 0 !important; padding-left: 0 !important; position: static !important; }
.woocommerce-shipping-methods li input.shipping_method { margin: 4px 0 0 !important; flex: 0 0 auto; }
.woocommerce-shipping-methods li label { display: block !important; flex: 1 1 auto; line-height: 1.4; margin: 0; }
.woocommerce-shipping-methods .km-ship-name { display: inline; }
.woocommerce-shipping-methods .km-ship-cost { display: block; font-weight: 600; color: #1f5976; }
.woocommerce-shipping-methods .vp-woo-pont-shipping-method-icons { display: block; margin-top: 4px; }
.woocommerce-cart .woocommerce-shipping-methods li label,
.woocommerce-cart .woocommerce-shipping-methods li { text-align: left; }

/* Nincs szűrőpanel (kevés termék): a rács egy oszlopban, teljes szélességben */
@media (min-width: 922px) {
	.km-kat.km-kat-noszuro .ast-woocommerce-container { display: block; }
}