/* Himeros — úvodná stránka: 4 celoobrazovkové bloky s fotkami (13.9.2026). Len body.home. */

/* --- šírka + scroll kontajner (Storefront má overflow na body/#page) --- */
body.home, body.home #page { overflow: visible; }
body.home .site-content .col-full { max-width: none !important; width: 100%; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
body.home .site-content #primary, body.home .site-content .content-area, body.home .site-content .site-main { width: 100% !important; float: none; margin: 0; padding: 0; }
body.home #content, body.home #primary, body.home #main { padding-top: 0; margin-top: 0; margin-bottom: 0; }
body.home .site-content { padding-top: 0; }
body.home .entry-header, body.home .storefront-breadcrumb { display: none; }

/* --- hlavička: nad hero skrytá, na blokoch 2–4 priesvitné sklo --- */
body.home .site-header {
	position: fixed; top: 0; left: 0; right: 0; z-index: 200;
	transform: translateY(-100%); pointer-events: none;
	background: rgba(22, 16, 26, .05) !important; border-bottom-color: transparent;
	transition: transform .4s ease, background .35s ease, box-shadow .35s ease;
}
body.home.himeros-past-hero .site-header {
	transform: none; pointer-events: auto;
	-webkit-backdrop-filter: blur(18px) saturate(1.15); backdrop-filter: blur(18px) saturate(1.15);
	box-shadow: inset 0 -1px 0 rgba(240, 233, 228, .12), 0 8px 30px rgba(0, 0, 0, .35);
}
body.home.admin-bar .site-header { top: 32px; }
/* na úvodke bez riadku menu (Domov/Obchod/…) – kategórie sú v čipoch a dlaždiciach; sklo je potom nízke */
body.home .storefront-primary-navigation, body.home .storefront-handheld-footer-bar { display: none; }
/* logo podsvietené medenou žiarou */
body.home .site-branding { position: relative; isolation: isolate; }
body.home .site-branding::before {
	content: ""; position: absolute; inset: -12px -24px; z-index: -1; border-radius: 999px;
	background: radial-gradient(60% 70% at 50% 55%, rgba(201, 139, 107, .40), rgba(201, 139, 107, .12) 55%, transparent 78%);
	filter: blur(8px); opacity: 0; transition: opacity .6s ease;
}
body.home.himeros-past-hero .site-branding::before { opacity: 1; animation: hm-breathe 4.5s ease-in-out infinite alternate; }
body.home .site-branding img { filter: drop-shadow(0 0 10px rgba(201, 139, 107, .5)); }
@keyframes hm-breathe { from { opacity: .65; transform: scale(.96); } to { opacity: 1; transform: scale(1.04); } }

/* --- spoločné --- */
.hm-sec {
	position: relative; isolation: isolate; overflow: hidden; width: 100%;
	min-height: 100vh; min-height: 100svh;
	display: flex; align-items: center; justify-content: center;
	padding: calc(var(--himeros-hh, 84px) + 1rem) 5vw clamp(1.5rem, 3vh, 2.5rem);
	background: var(--h-ground, #16101A); color: var(--h-bone, #F0E9E4);
}
.hm-sec > *:not(.hm-secbg):not(.hm-hero__cue) { position: relative; z-index: 1; }
.hm-secbg { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.hm-secbg img { width: 100%; height: 100%; object-fit: cover; object-position: var(--hm-bgpos, center); display: block; will-change: transform; }
.hm-secbg__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(22, 16, 26, .62), rgba(22, 16, 26, .5) 45%, rgba(22, 16, 26, .82)); }
.hm-secbg--hero img   { animation: hm-kb1 22s ease-in-out infinite alternate; }
.hm-secbg--coll img   { animation: hm-kb2 26s ease-in-out infinite alternate; }
.hm-secbg--feat img   { animation: hm-kb3 24s ease-in-out infinite alternate; }
.hm-secbg--footer img { animation: hm-kb4 28s ease-in-out infinite alternate; }
@keyframes hm-kb1 { from { transform: scale(1) translate(0,0); }        to { transform: scale(1.12) translate(-2%,-1.5%); } }
@keyframes hm-kb2 { from { transform: scale(1.12) translate(2%,1%); }   to { transform: scale(1) translate(0,0); } }
@keyframes hm-kb3 { from { transform: scale(1) translate(0,0); }        to { transform: scale(1.14) translate(2%,-2%); } }
@keyframes hm-kb4 { from { transform: scale(1.1) translate(-1.5%,1%); } to { transform: scale(1) translate(0,0); } }
.hm-hero { --hm-bgpos: center 45%; }
.hm-hero .hm-secbg__scrim {
	background:
		linear-gradient(90deg, rgba(22, 16, 26, .82) 0%, rgba(22, 16, 26, .55) 45%, rgba(22, 16, 26, .25) 100%),
		linear-gradient(0deg, rgba(22, 16, 26, .9) 5%, rgba(22, 16, 26, .2) 45%, transparent 70%);
}
.hm-coll { --hm-bgpos: center 50%; }
.hm-coll .hm-secbg__scrim { background: linear-gradient(180deg, rgba(22, 16, 26, .66), rgba(22, 16, 26, .5) 45%, rgba(22, 16, 26, .82)); }
.hm-feat { --hm-bgpos: center 40%; }
.hm-feat .hm-secbg__scrim { background: linear-gradient(180deg, rgba(22, 16, 26, .7), rgba(22, 16, 26, .58) 45%, rgba(22, 16, 26, .84)); }

.hm-inner { width: 100%; max-width: 1120px; margin: 0 auto; text-align: center; }
.hm-eyebrow, .hm-kicker {
	display: block; font-size: .74rem; letter-spacing: .32em; text-transform: uppercase;
	color: var(--h-copper, #C98B6B); margin: 0 0 1rem;
}
.hm-title, .hm-hero__title, .hm-fintro__title {
	font-family: var(--h-display, "Cardo", Palatino, "Palatino Linotype", Georgia, serif);
	font-weight: 400; color: var(--h-bone, #F0E9E4); margin: 0; text-wrap: balance;
	text-shadow: 0 2px 22px rgba(0, 0, 0, .45);
}
.hm-title { font-size: clamp(1.8rem, 3.6vw, 2.6rem); line-height: 1.06; margin-bottom: clamp(1rem, 2.5vh, 1.8rem); }

/* --- 1. hero --- */
.hm-hero { align-items: center; justify-content: flex-start; padding-top: clamp(4rem, 10vh, 7rem); }
.hm-hero__tx { max-width: 46rem; padding: 0 clamp(0px, 3vw, 3rem); text-align: left; }
.hm-hero__title { font-size: clamp(2.7rem, 6.5vw, 4.8rem); line-height: 1.04; margin-bottom: 1rem; }
.hm-hero__sub { max-width: 34rem; margin: 0 0 1.6rem; color: #d8ccd0; font-size: 1.08rem; line-height: 1.6; }
.hm-search { max-width: 36rem; margin: 0; text-align: left; position: relative; z-index: 3; }
.hm-search__row {
	display: flex; align-items: center; gap: .5em; padding: .4em .4em .4em 1em;
	background: rgba(240, 233, 228, .96); border: 1px solid rgba(255, 255, 255, .45); border-radius: 999px;
	box-shadow: 0 18px 48px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(201, 139, 107, .12);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	transition: box-shadow .2s ease, transform .2s ease;
}
.hm-search__row:focus-within { box-shadow: 0 20px 56px rgba(0, 0, 0, .55), 0 0 0 3px rgba(201, 139, 107, .35); transform: translateY(-1px); }
.hm-search__icon { flex: 0 0 auto; color: var(--h-copper, #C98B6B); }
.hm-search__input, body.home input.hm-search__input[type="search"] {
	flex: 1 1 auto; min-width: 0; margin: 0; padding: .55em .2em; width: 100%;
	font-size: 1.05rem; line-height: 1.3; color: #2a1b2e; background: transparent;
	border: 0; box-shadow: none; outline: none; -webkit-appearance: none; appearance: none;
}
.hm-search__input::placeholder { color: #7d6f7a; }
.hm-search__input::-webkit-search-cancel-button { -webkit-appearance: none; }
body.home .hm-search__btn {
	flex: 0 0 auto; margin: 0; padding: .7em 1.35em; border: 0; border-radius: 999px; cursor: pointer;
	font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 600;
	color: #1a1016; background: var(--h-copper, #C98B6B); transition: background .18s ease;
}
body.home .hm-search__btn:hover { background: var(--h-copper-hi, #E0A886); color: #1a1016; }
.hm-search .himeros-suggest { border-radius: 14px; overflow: hidden; max-height: min(60svh, 520px); margin-top: .4em; text-align: left; }
.hm-chips { display: flex; flex-wrap: wrap; gap: .5em; max-width: 36rem; margin: 1.1em 0 0; }
.hm-chip {
	display: inline-block; padding: .45em 1em; border-radius: 999px;
	font-size: .8rem; letter-spacing: .04em; color: var(--h-bone, #F0E9E4); text-decoration: none;
	background: rgba(240, 233, 228, .1); border: 1px solid rgba(240, 233, 228, .3);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	transition: background .18s ease, border-color .18s ease;
}
.hm-chip:hover, .hm-chip:focus-visible { color: #fff; background: rgba(201, 139, 107, .6); border-color: rgba(240, 233, 228, .6); }
.hm-chip--all { background: transparent; border-color: transparent; color: var(--h-copper, #C98B6B); text-decoration: underline; text-underline-offset: .25em; }
.hm-chip--all:hover { background: transparent; }
.hm-hero__cue {
	position: absolute; left: 50%; bottom: 26px; z-index: 3; transform: translateX(-50%);
	color: var(--h-bone, #F0E9E4); font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; opacity: .8;
	animation: hm-bob 1.9s ease-in-out infinite;
}
@keyframes hm-bob { 0%, 100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, 7px); } }

/* --- 2. podľa nálady --- */
.hm-coll-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 1040px; margin: 0 auto; }
.hm-coll-tile {
	position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden;
	background: var(--h-raise, #221826) center/cover no-repeat; border: 1px solid rgba(201, 139, 107, .28);
	box-shadow: 0 18px 44px rgba(0, 0, 0, .45); color: var(--h-bone, #F0E9E4); text-decoration: none;
	transition: transform .35s ease, box-shadow .35s ease, border-color .3s ease;
}
.hm-coll-tile__tg { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(22, 16, 26, 0) 40%, rgba(22, 16, 26, .35) 66%, rgba(22, 16, 26, .82)); transition: background .3s ease; }
.hm-coll-tile__mood {
	position: absolute; top: .8rem; right: .9rem; z-index: 2; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
	color: var(--h-copper, #C98B6B); padding: .3em .7em; border-radius: 999px;
	background: rgba(22, 16, 26, .45); border: 1px solid rgba(201, 139, 107, .35);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.hm-coll-tile__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px 18px; text-align: left; z-index: 2; }
.hm-coll-tile__n { display: block; font-family: var(--h-display, "Cardo", Palatino, Georgia, serif); font-size: 1.55rem; color: #fff; text-shadow: 0 1px 10px rgba(0, 0, 0, .55); }
.hm-coll-tile__c { display: block; font-size: .78rem; color: #e4d6d9; margin-top: 2px; letter-spacing: .03em; }
.hm-coll-tile:hover, .hm-coll-tile:focus-visible { transform: translateY(-3px); border-color: var(--h-copper, #C98B6B); box-shadow: 0 24px 52px rgba(0, 0, 0, .55), 0 0 0 1px rgba(201, 139, 107, .4); }
.hm-coll-tile:hover .hm-coll-tile__n { color: var(--h-copper-hi, #E0A886); }

/* --- 3. najobľúbenejšie (Woo mriežka z [products]) --- */
.hm-feat-wrap { max-width: 1120px; margin: 0 auto; }
.hm-feat .woocommerce ul.products, .hm-feat ul.products { margin: 0; }
.hm-feat ul.products li.product {
	background: var(--h-raise, #221826); border: 1px solid rgba(201, 139, 107, .22); border-radius: 14px;
	padding: 12px 12px 14px; box-shadow: 0 16px 40px rgba(0, 0, 0, .45); margin-bottom: 0;
}
.hm-feat ul.products li.product .woocommerce-loop-product__title { font-size: .92rem; line-height: 1.3; min-height: 2.6em; }
.hm-feat ul.products li.product .price { color: var(--h-copper, #C98B6B); }
.hm-feat__cta { margin-top: clamp(1rem, 2.5vh, 1.8rem); }
@media (min-width: 900px) {
	.hm-feat ul.products li.product:nth-child(n+5) { display: none; }   /* presne jedna obrazovka */
}

/* --- 4. pätka = 4. obrazovka (len home) --- */
body.home .site-footer {
	position: relative; isolation: isolate; overflow: hidden;
	min-height: 100vh; min-height: 100svh;
	display: flex; flex-direction: column; justify-content: center;
	--hm-bgpos: center 45%;
	padding-top: calc(var(--himeros-hh, 84px) + 1rem); padding-bottom: 2vh;
	border-top: 0;
}
body.home .site-footer > .col-full { position: static; }
body.home .site-footer .hm-fintro, body.home .site-footer .himeros-footer, body.home .site-footer .site-info { position: relative; z-index: 1; }
body.home .site-footer .hm-secbg__scrim { background: linear-gradient(180deg, rgba(22, 16, 26, .62), rgba(22, 16, 26, .52) 45%, rgba(22, 16, 26, .9)); }
.hm-fintro { width: 100%; max-width: 1120px; margin: 0 auto 1.5vh; padding: 0 1.4rem; text-align: center; }
.hm-fintro__title { font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.06; margin-bottom: .45em; }
.hm-fintro__sub { font-size: 1rem; color: #d8ccd0; max-width: 36em; margin: 0 auto 1.1em; line-height: 1.55; }
.hm-fusp { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; max-width: 1000px; margin: 0 auto; }
.hm-fintro { margin-bottom: 1vh; }
.hm-fusp__i {
	display: block; padding: .85em 1em .8em; text-align: center; text-decoration: none; color: var(--h-bone, #F0E9E4) !important;
	background: rgba(240, 233, 228, .07); border: 1px solid rgba(201, 139, 107, .3); border-radius: 14px;
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: background .2s ease, transform .2s ease;
}
.hm-fusp__i:hover { background: rgba(201, 139, 107, .35); transform: translateY(-2px); }
.hm-fusp__ico { display: block; width: 24px; height: 24px; margin: 0 auto .45em; color: var(--h-copper, #C98B6B); }
.hm-fusp__t { display: block; font-size: .92rem; font-weight: 600; letter-spacing: .02em; }
.hm-fusp__d { display: block; margin-top: .25em; font-size: .78rem; line-height: 1.4; color: #cbbfc4; }
body.home .site-footer .himeros-footer { padding-top: 1em; padding-bottom: .4em; }
body.home .site-footer .himeros-footer__bottom { margin-top: .8em; padding-top: .7em; }
body.home .site-footer .site-info { display: none; }   /* Himeros_Footer má vlastný © riadok – tento by bol duplicitný */
body.home .site-footer { padding-bottom: 1vh; }
body.home .site-footer .himeros-footer__col p, body.home .site-footer .himeros-footer__col li { font-size: .88rem; line-height: 1.45; }

/* --- scroll-snap (mobil natívne, desktop rieši himeros-home.js) --- */
html.himeros-snap, body.himeros-snap { scroll-snap-type: y proximity; }
@media (max-width: 899px) { html.himeros-snap, body.himeros-snap { scroll-snap-type: y mandatory; } }
html.himeros-snap .hm-sec, body.himeros-snap .hm-sec { scroll-snap-align: start; scroll-snap-stop: always; }
html.himeros-snap .site-footer, body.himeros-snap .site-footer { scroll-snap-align: start; }

/* --- responzívne --- */
@media (min-width: 900px) and (max-height: 840px) {
	.hm-title { font-size: clamp(1.6rem, 3vh + .8rem, 2.3rem); margin-bottom: 1rem; }
	.hm-coll-grid { max-width: min(1040px, calc((100svh - 20rem) * 1.6)); gap: 12px; }
	.hm-coll-tile { aspect-ratio: 16 / 10; }
	.hm-feat ul.products li.product { padding: 8px 8px 10px; }
	.hm-feat ul.products li.product img { aspect-ratio: 4 / 3 !important; }
	.hm-feat ul.products li.product .woocommerce-loop-product__title { font-size: .84rem; min-height: 0; }
	.hm-feat ul.products li.product .button { padding: .5em 1em; font-size: .8rem; }
	.hm-feat__cta { margin-top: .8rem; }
	.hm-fintro { margin-bottom: 1vh; }
	.hm-fintro__title { font-size: clamp(1.5rem, 2.6vw, 2.1rem); margin-bottom: .3em; }
	.hm-fintro__sub { font-size: .92rem; margin-bottom: .7em; }
	.hm-fusp__i { padding: .6em .9em .55em; }
	.hm-fusp__ico { width: 20px; height: 20px; margin-bottom: .3em; }
	.hm-fusp__t { font-size: .86rem; }
	.hm-fusp__d { font-size: .74rem; }
	body.home .site-footer .himeros-footer { padding-top: .8em; padding-bottom: .5em; }
	body.home .site-footer .himeros-footer__col p, body.home .site-footer .himeros-footer__col li { font-size: .82rem; line-height: 1.35; }
}
@media (max-width: 899px) {
	body.home .site-footer { min-height: 0; }
	.hm-fusp { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
	.hm-coll-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
	.hm-coll-tile { aspect-ratio: 1; }
	.hm-coll-tile__n { font-size: 1.15rem; }
	.hm-coll-tile__mood { display: none; }
}
@media (max-width: 600px) {
	.hm-hero__tx { padding: 0; }
	.hm-search__btn { padding: .7em .9em; font-size: .72rem; }
	.hm-search__input, body.home input.hm-search__input[type="search"] { font-size: 1rem; }
	.hm-fusp { grid-template-columns: 1fr; max-width: 420px; }
}
@media (prefers-reduced-motion: reduce) {
	.hm-secbg img, .hm-hero__cue, body.home.himeros-past-hero .site-branding::before { animation: none; }
	.hm-coll-tile, .hm-fusp__i, .hm-chip { transition: none; }
}

/* --- mobil / respo doladenie (13.9.2026 večer) --- */
@media (max-width: 899px) {
	/* „scrolluj“ sa bilo s cookie tlačidlom vľavo dole */
	.hm-hero__cue { display: none; }
	/* bloky 3 a 4 sú na mobile vyššie než obrazovka – tvrdé snapovanie by sekalo */
	html.himeros-snap, body.himeros-snap { scroll-snap-type: y proximity; }
	html.himeros-snap .hm-sec, body.himeros-snap .hm-sec { scroll-snap-stop: normal; }
	/* odkazy v pätke: väčšia dotyková plocha */
	body.home .site-footer .himeros-footer__col li a, body.home .site-footer .himeros-footer__col li { line-height: 1.9; }
}
@media (max-width: 600px) {
	/* „Najobľúbenejšie“ na telefóne len 4 (2×2) – rovnako ako desktop */
	.hm-feat ul.products li.product:nth-child(n+5) { display: none; }
}
