/* ==========================================================================
   Kiegészítő CSS.
   Az eredeti export `style-hover` attribútuma (saját runtime-juk szintaxisa)
   sima HTML/CSS-ben nem működik — az alábbi :hover szabályok pótolják,
   ugyanazokkal az értékekkel, mint a forrásban.
   A .vz-collections-index / .vz-brand-page / .vz-about-* / .vz-contact-*
   szekciók MÉG NEM verbatim-portoltak (ld. chat) — ezek egyelőre a saját,
   egyszerűsített class-rendszeremet használják.
   ========================================================================== */

:root {
	--vz-bg: #FFFEF5;
	--vz-text: #4A4545;
	--vz-dark: #2C2626;
	--vz-accent: #B5082D;
	--vz-pad-x: clamp(20px, 3vw, 40px);
}

/* ---------- Fejléc / navigáció hover + reszponzív alapállapot ---------- */
header a:hover { color: #B5082D !important; }
.vz-submenu-js a:hover { color: #B5082D !important; }
.vz-lang-toggle-js:hover { color: #B5082D; }
.vz-totop-js:hover { color: #B5082D; border-color: #B5082D; }
.vz-flyrow-js:hover { color: #B5082D !important; }
.vz-copy-email-js:hover { color: #B5082D; }
.vz-fav-prev-js:hover, .vz-fav-next-js:hover { color: #B5082D; }

/* Cookie-csík hover */
.vz-cookie-accept-js:hover { background: #FFFEF5; color: #2C2626; }

/* Biztonsági háló: a preloader elrendezése valódi CSS-osztályból is jöjjön,
   ne csak inline style-ból — egyes cache/minifikáló bővítmények (pl.
   SpeedyCache) HTML-tömörítés közben megcsonkíthatják az inline style="" -t,
   ami a flex-középre-igazítást töri el (a tartalom ilyenkor a bal-felső
   sarokba "esik"). Ez a szabály !important-tal felülír mindent. */
.vz-preloader-js {
	position: fixed !important;
	inset: 0 !important;
	z-index: 120 !important;
	background: #FFFEF5 !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 26px !important;
}
.vz-repeat-visit .vz-preloader-js { display: none !important; }
.vz-repeat-visit .vz-intro-navdown { animation-delay: 0s !important; }
.vz-repeat-visit .vz-intro-lang { animation-delay: 0s !important; }

/* Flyout-menü sorok: hover-re a chevron becsúszik, a felirat jobbra tolódik. */
.vz-flyrow-item-js:hover { color: #B5082D !important; }
.vz-flyrow-item-js:hover .vz-flychev { opacity: 1 !important; transform: translate(0, -50%) !important; }
.vz-flyrow-item-js:hover .vz-flylabel { transform: translateX(22px) !important; }
/* A panel saját bélyegképe csak akkor látszik, ha a fejléc már összement
   (a hero eddig ugyanazt a képet full-bleed mutatja, felesleges duplikálni). */
.vz-fly-panel-thumb-js { display: none; }
.vz-scrolled .vz-fly-panel-thumb-js { display: block !important; }

/* A fejléc három szakasza (hamburger/trigger — logó — nav) sosem érhet össze:
   explicit gap a header-en, és a nav-elemek nem zsugorodhatnak egymásba. */
header { gap: 16px; }
.vz-nav-js > * { flex-shrink: 0; }
.vz-header-logo-link { flex-shrink: 0; }
@media (max-width: 1000px) {
	.vz-header-logo-link { width: 140px !important; }
}

.vz-hamburger-js { display: none; }
.vz-nav-js { display: flex; }
.vz-submenu-js { display: none; }
@media (max-width: 760px) {
	.vz-hamburger-js { display: flex; }
	.vz-nav-js { display: none !important; }
	.vz-submenu-trigger-js { display: none !important; }
}

/* ---------- Hover-nagyítás azokon a képeken, ahol nincs saját .vz-mask (originál) osztály ---------- */
.vz-hoverzoom { overflow: hidden; position: relative; display: block; }
.vz-hoverzoom img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s cubic-bezier(.22,.61,.36,1); }
.vz-hoverzoom:hover img { transform: scale(1.045); }

/* ---------- Kedvenc-karusszel elemek ---------- */
.vz-fav-item img { transition: opacity .3s; }

/* ---------- Mobil slide-in menü kezdőállapota (JS finomítja) ---------- */
.vz-mobile-menu-js a:hover { color: #B5082D; }

/* ==========================================================================
   Még nem verbatim-portolt oldalak — saját elrendezés-CSS
   ========================================================================== */

.vz-page-title { padding: clamp(80px, 12vw, 160px) var(--vz-pad-x) clamp(40px, 5vw, 64px); }
.vz-page-title h1 { font-family: Cinzel, serif; font-weight: 400; font-size: clamp(26px, 3.4vw, 40px); text-transform: lowercase; margin: 0; }
.vz-placeholder-copy { max-width: 700px; margin: 0 auto; padding: 0 var(--vz-pad-x) clamp(56px, 9vw, 120px); font-weight: 300; }

/* ---------- Kollekciók index ---------- */
.vz-collections-index { padding: clamp(60px, 9vw, 141px) var(--vz-pad-x) 0; }
.vz-brand-tabs { border-top: .5px solid var(--vz-accent); padding-top: 8px; display: flex; flex-wrap: wrap; gap: clamp(14px, 2.4vw, 32px); justify-content: space-between; align-items: center; }
.vz-brand-tabs-list { display: flex; flex-wrap: wrap; gap: clamp(14px, 2.6vw, 40px); }
.vz-brand-tabs-list a { font-family: Cinzel, serif; font-size: 16px; text-transform: lowercase; color: var(--vz-dark); }
.vz-brand-tabs-list a:hover { color: var(--vz-accent); }
.vz-brand-blocks { padding: clamp(56px, 8vw, 103px) 0; display: flex; flex-direction: column; gap: clamp(56px, 8vw, 102px); }
.vz-brand-block-head { display: flex; flex-wrap: wrap; gap: clamp(32px, 10vw, 148px); align-items: flex-start; margin-bottom: clamp(40px, 7vw, 60px); }
.vz-brand-logo { width: clamp(140px, 14vw, 171px); height: auto; object-fit: contain; }
.vz-brand-block-head p { flex: 1 1 340px; max-width: 500px; font-weight: 300; }
.vz-brand-block-image { position: relative; display: block; width: 100%; height: clamp(360px, 62vw, 803px); overflow: hidden; background: #F0EEEE; }
.vz-brand-block-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s; }
.vz-brand-block-image:hover img { transform: scale(1.04); }
.vz-brand-script { position: absolute; left: clamp(16px, 2.4vw, 32px); top: clamp(16px, 2.4vw, 32px); font-family: 'Great Vibes', cursive; font-size: clamp(30px, 5vw, 64px); color: var(--vz-bg); }

/* ---------- Márka aloldal ---------- */
.vz-brand-page { padding: clamp(60px, 9vw, 141px) var(--vz-pad-x) 0; }
.vz-brand-page-head { display: flex; flex-wrap: wrap; gap: clamp(32px, 8vw, 100px); align-items: flex-start; margin-bottom: clamp(48px, 6vw, 80px); }
.vz-brand-logo--large { width: clamp(160px, 16vw, 220px); }
.vz-brand-page-head p { flex: 1 1 340px; max-width: 560px; font-weight: 300; }
.vz-brand-model-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; padding-bottom: clamp(56px, 9vw, 120px); }
@media (min-width: 761px) { .vz-brand-model-grid { grid-template-columns: repeat(3, 1fr); } }
.vz-brand-model { border: 0; padding: 0; background: none; cursor: pointer; text-align: left; }
.vz-brand-model--full { grid-column: 1 / -1; }
.vz-brand-model img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.vz-brand-model span { display: block; margin-top: 8px; font-family: Cinzel, serif; font-size: 13px; text-transform: uppercase; }

/* ---------- Rólunk ---------- */
.vz-about-hero { text-align: center; padding: clamp(48px, 7vw, 95px) var(--vz-pad-x) 0; }
.vz-about-hero img { margin: 0 auto 24px; width: 58px; }
.vz-about-hero h1 { font-family: Cinzel, serif; font-weight: 400; font-size: clamp(26px, 3.4vw, 40px); max-width: 620px; margin: 0 auto; text-transform: lowercase; }
.vz-about-since { display: flex; align-items: center; justify-content: center; gap: 10px; padding: clamp(32px, 4vw, 48px) 0; font-family: Cinzel, serif; }
.vz-since-year { color: var(--vz-accent); font-size: clamp(20px, 2.6vw, 28px); }
.vz-founder { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 0 var(--vz-pad-x) clamp(48px, 6vw, 72px); }
.vz-founder-photo { width: clamp(120px, 16vw, 160px); aspect-ratio: 160/242; border-radius: 999px; overflow: hidden; background: #EFEDE6; }
.vz-founder-photo img { width: 100%; height: 100%; object-fit: cover; }
.vz-founder-name { font-family: 'Great Vibes', cursive; font-size: 22px; }
.vz-founder-role { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.vz-about-copy { max-width: 700px; margin: 0 auto; padding: clamp(40px, 5vw, 56px) var(--vz-pad-x); text-align: center; }
.vz-about-copy h2 { font-family: Cinzel, serif; font-weight: 400; font-size: 20px; margin-bottom: 16px; text-transform: lowercase; }
.vz-about-copy p { font-weight: 300; }
.vz-sponsor-credit { max-width: 900px; margin: 0 auto; padding: clamp(24px, 4vw, 40px) var(--vz-pad-x); display: flex; flex-wrap: wrap; gap: 32px; align-items: center; justify-content: space-between; }
.vz-sponsor-logos { display: flex; align-items: center; gap: 40px; }
.vz-sponsor-logos img { height: 56px; width: auto; }

/* ---------- Kapcsolat ---------- */
.vz-contact-grid { display: grid; grid-template-columns: 1fr; gap: 48px; padding: 0 var(--vz-pad-x) clamp(56px, 9vw, 120px); }
@media (min-width: 900px) { .vz-contact-grid { grid-template-columns: 1fr 1fr; } }
.vz-footer-heading { font-family: Commissioner, sans-serif; font-weight: 600; font-size: 12px; letter-spacing: .04em; color: var(--vz-accent); text-transform: uppercase; }
.vz-footer-lines { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; font-size: 12px; color: var(--vz-text); text-transform: uppercase; }
.vz-hours { margin-top: 28px; }
.vz-hours p { white-space: pre-line; font-weight: 300; }
.vz-map { margin-top: 28px; aspect-ratio: 4/3; }
.vz-map iframe { width: 100%; height: 100%; border: 0; filter: grayscale(1) contrast(.96); }

.vz-contact-form-wrap h2 { font-family: Cinzel, serif; font-weight: 400; font-size: clamp(20px, 2.4vw, 26px); margin-bottom: 28px; text-transform: lowercase; }
.venezia-form { display: flex; flex-direction: column; gap: 16px; }
.venezia-form-row { display: flex; flex-direction: column; gap: 6px; }
.venezia-form-row label { font-family: Cinzel, serif; font-size: 15px; text-transform: lowercase; }
.venezia-form-row input, .venezia-form-row textarea {
	width: 100%; padding: 0 12px; border: 1px solid var(--vz-accent); background: var(--vz-bg);
	font-family: Commissioner, sans-serif; font-size: 15px; color: var(--vz-text);
}
.venezia-form-row input { height: 44px; }
.venezia-form-row textarea { padding: 10px 12px; resize: vertical; }
.venezia-form-error { color: var(--vz-accent); font-size: 12px; min-height: 16px; }
.venezia-btn { align-self: flex-start; font-family: Cinzel, serif; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; padding: 14px 32px; border: 1px solid var(--vz-accent); background: var(--vz-accent); color: var(--vz-bg); cursor: pointer; transition: opacity .25s; }
.venezia-btn:hover { opacity: .85; }
.venezia-form-success { color: var(--vz-accent); font-weight: 600; }
.venezia-form.is-sent .venezia-form-row, .venezia-form.is-sent .venezia-btn { display: none; }
.venezia-form.is-sent .venezia-form-success { display: block; }