/*
Theme Name: VK Apartmanok (gyermektéma)
Template: twentytwentyfive
Description: Vadvirág & Kéki Apartmanok – nyugodt balatoni editorial arculat: világos törtfehér, mély tókék és türkiz, kevés napsárga akcentus; Playfair Display címek, Manrope szöveg (helyi, OFL); festett balatoni táj (saját illusztráció). Az oldalszerkezetet ez a stíluslap, a komponenseket a vk-apartmanok plugin adja.
Version: 0.4.4
Requires at least: 6.5
Text Domain: vk-apartmanok-child
*/

/* =====================================================================
 * 0.4.0 – teljes áttervezés (14334). Elvek: világos alap, sok levegő, vékony vonalak, változatos kéthasábos blokkok,
 * kevés kártya, nincs sötétített fotó-hero és nincs ismétlődő hullámsáv. Mobilon 16 px+ szöveg, 44 px+ célterület.
 * ===================================================================== */
:root {
	--vk-tinta: var(--wp--preset--color--mely-kek, #0d3550);
	--vk-to: var(--wp--preset--color--to, #1c6280);
	--vk-turkiz: var(--wp--preset--color--turkiz, #2a9d98);
	--vk-turkiz-h: var(--wp--preset--color--turkiz-halvany, #e3f1ef);
	--vk-nap: var(--wp--preset--color--nap, #e6ad35);
	--vk-homok: var(--wp--preset--color--homok, #efe7d8);
	--vk-hatter: var(--wp--preset--color--tortfeher, #faf7f1);
	--vk-akcentus: var(--wp--preset--color--zold, #17706c);
	--vk-szoveg: var(--wp--preset--color--szoveg, #1b2830);
	--vk-halvany: var(--wp--preset--color--halvany, #55626b);
	--vk-vonal: rgb(13 53 80 / .14);
	--vk-vonal-eros: rgb(13 53 80 / .28);
	--vk-szel: 1200px;
	--vk-margo: clamp(1rem, 4vw, 2.5rem);
	--vk-oldalsav: max(var(--vk-margo), calc((100% - var(--vk-szel)) / 2));
	--vk-cim: var(--wp--preset--font-family--playfair, Georgia, serif);
	--vk-betu: var(--wp--preset--font-family--manrope, system-ui, sans-serif);
	--vk-fejlec-m: 4.25rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--vk-fejlec-m) + 1rem); }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
:where(.wp-site-blocks) :focus-visible { outline: 3px solid var(--vk-nap); outline-offset: 3px; border-radius: 4px; }
img { max-width: 100%; height: auto; }
p { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }
h1 em, h2 em { font-style: italic; color: var(--vk-akcentus); font-weight: 400; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Felirat (eyebrow): kis, ritkított, türkiz vonallal */
.vk-felirat { display: flex; flex-wrap: wrap; align-items: center; gap: 0; white-space: pre-wrap; font-size: .875rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--vk-akcentus); margin: 0 0 1rem; }
.vk-felirat::before { content: ""; width: 2rem; height: 1px; flex: none; background: currentColor; margin-right: .65rem; }
.vk-felirat a { color: inherit; text-decoration: none; }
/* 0.4.3: a „ · ” elválasztós felirat csoportjai egyben maradnak; a csoportközi szóköz asztalon (flex) is látszik. */
.vk-felirat__csoport { white-space: nowrap; }
.vk-felirat__koz { white-space: pre; }
.vk-felirat a:hover { text-decoration: underline; }

/* ---------- Fejléc ---------- */
/* Nincs backdrop-filter: az a mobilmenü fix overlayének befoglaló dobozává válna (0.2.0-ban mérve). */
.vk-fejlec { position: sticky; top: 0; z-index: 40; background: rgb(250 247 241 / .97); border-bottom: 1px solid var(--vk-vonal); }
.admin-bar .vk-fejlec { top: var(--wp-admin--admin-bar--height, 32px); }
.vk-fejlec__sor { gap: 1.25rem; align-items: center; min-width: 0; }
.vk-marka { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; color: var(--vk-tinta); min-width: 0; flex: 0 1 auto; }
.vk-marka__jel { flex: none; display: block; }
.vk-marka__szoveg { display: inline-flex; flex-direction: column; line-height: 1; min-width: 0; }
.vk-marka__nev { font-family: var(--vk-cim); font-size: clamp(1.2rem, 1.05rem + .6vw, 1.5rem); font-weight: 600; letter-spacing: -.01em; white-space: nowrap; }
.vk-marka__es { font-style: italic; font-weight: 400; color: var(--vk-akcentus); padding: 0 .05em; }
.vk-marka__hely { font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--vk-halvany); margin-top: .35rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vk-marka:hover .vk-marka__nev { color: var(--vk-to); }
.vk-fejlec__jobb { display: flex; align-items: center; gap: clamp(.5rem, 2vw, 1.75rem); flex: none; }
.vk-fejlec__cta { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .55rem 1.15rem; border-radius: 999px; background: var(--vk-tinta); color: #fff !important; font-weight: 700; font-size: .95rem; text-decoration: none; white-space: nowrap; border: 1.5px solid var(--vk-tinta); }
.vk-fejlec__cta:hover, .vk-fejlec__cta:focus-visible { background: var(--vk-to); border-color: var(--vk-to); }
.vk-fejlec__cta-rovid { display: none; }

.vk-menu { flex: none; }
.vk-menu .wp-block-navigation-item__content { color: var(--vk-tinta); text-decoration: none; padding: .55rem .15rem; }
.vk-menu .wp-block-navigation-item__content:hover { color: var(--vk-akcentus); }
.vk-menu .wp-block-navigation__container { gap: 1.6rem; align-items: center; }
.vk-menu .wp-block-navigation__submenu-container { background: #fff !important; border: 1px solid var(--vk-vonal) !important; border-radius: 10px; padding: .4rem !important; box-shadow: 0 16px 36px rgb(13 53 80 / .12); min-width: 14rem !important; }
.vk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: .6rem .8rem; border-radius: 6px; }
.vk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--vk-turkiz-h); }
.vk-menu .wp-block-navigation__responsive-container-open, .vk-menu .wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; align-items: center; justify-content: center; color: var(--vk-tinta); }
.vk-menu .wp-block-navigation__responsive-container.is-menu-open { background: var(--vk-hatter) !important; padding: 1.25rem 1.25rem 2rem; --navigation-layout-justification-setting: flex-start; --navigation-layout-justify: flex-start; --navigation-layout-align: flex-start; text-align: left; }
.vk-menu .is-menu-open .wp-block-navigation__responsive-container-content, .vk-menu .is-menu-open .wp-block-navigation__container, .vk-menu .is-menu-open .wp-block-navigation-item, .vk-menu .is-menu-open .wp-block-navigation__submenu-container { align-items: flex-start !important; justify-content: flex-start !important; }
.vk-menu .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3rem; }
.vk-menu .is-menu-open .wp-block-navigation__container { gap: .25rem; }
.vk-menu .is-menu-open .wp-block-navigation-item__content { font-family: var(--vk-cim); font-size: 1.6rem; padding: .45rem 0; }
.vk-menu .is-menu-open .wp-block-navigation__submenu-container { border: 0 !important; box-shadow: none; background: transparent !important; padding: 0 0 0 1rem !important; }
.vk-menu .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: 1.1rem; font-family: var(--vk-betu); }
/* A mag 600 px-es hamburger-váltópontja helyett 900 px (0.3.2-ben mérve: alatta a menü nem fér ki). */
@media (max-width: 899.98px) {
	.vk-menu .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.vk-menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
	.vk-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close { display: flex; }
	.vk-menu .is-menu-open .wp-block-navigation__submenu-container { position: static; opacity: 1; visibility: visible; width: auto; height: auto; min-width: 0 !important; }
}
@media (max-width: 600px) {
	:root { --vk-fejlec-m: 3.75rem; }
	.vk-fejlec { padding-top: .5rem !important; padding-bottom: .5rem !important; }
	.vk-fejlec__sor { gap: .6rem; }
	.vk-marka { gap: .5rem; }
	.vk-marka__jel { width: 32px; height: 32px; }
	.vk-marka__nev { font-size: 1.12rem; }
	.vk-marka__hely { display: none; }
	.vk-fejlec__jobb { gap: .35rem; }
	.vk-fejlec__cta { padding: .5rem .9rem; font-size: .9rem; }
	.vk-fejlec__cta-hosszu { display: none; }
	.vk-fejlec__cta-rovid { display: inline; }
}
@media (max-width: 340px) {
	.vk-marka__jel { display: none; }
}

/* ---------- Szakaszok (kezdőlap) ---------- */
.vk-fooldal .wp-block-post-content > * { margin-block: 0; }
.vk-szakasz { padding: clamp(3.5rem, 8vw, 6.5rem) var(--vk-oldalsav); }
.vk-szakasz + .vk-szakasz { border-top: 1px solid var(--vk-vonal); }
.vk-szakasz--feher { background: #fff; }
/* A záró sáv színe = a lábléc festett tájának ege, így a kettő egybeolvad. */
.vk-szakasz--vilagos { background: #fbf6e9; }
.vk-szakasz__fej { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .75rem clamp(2rem, 6vw, 5rem); align-items: end; margin: 0 0 clamp(2rem, 4vw, 3rem); }
.vk-szakasz__fej .vk-felirat { grid-column: 1 / -1; margin: 0; }
.vk-szakasz__fej h2 { margin: 0; font-size: clamp(2rem, 1.4rem + 2.2vw, 3rem); }
.vk-szakasz__fej p { margin: 0; color: #34434d; max-width: 54ch; }
.vk-ketoszlop { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.vk-ketoszlop h2 { margin: 0 0 1rem; font-size: clamp(2rem, 1.4rem + 2.2vw, 3rem); }
.vk-ketoszlop p { color: #34434d; }

/* Füredi rövid editorial: ikonos lista vékony vonalakkal */
.vk-tipplista { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--vk-vonal); }
.vk-tipplista li { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 1rem; padding: 1.15rem 0; border-bottom: 1px solid var(--vk-vonal); align-items: start; }
.vk-tipplista .vk-ikon-kor { width: 3rem; height: 3rem; }
.vk-tipplista strong { display: block; font-family: var(--vk-cim); font-weight: 500; font-size: 1.3rem; color: var(--vk-tinta); line-height: 1.25; margin-bottom: .2rem; }
.vk-tipplista span { color: #34434d; }

/* ---------- Belső oldalak ---------- */
.vk-lapfej { padding-block: clamp(2.25rem, 5vw, 4rem) clamp(1.5rem, 3vw, 2.25rem); border-bottom: 1px solid var(--vk-vonal); margin-bottom: clamp(2rem, 4vw, 3rem); }
.vk-lapfej__cim { margin: 0; font-size: clamp(2.2rem, 1.5rem + 2.8vw, 3.6rem); }
.vk-lap__tartalom { padding-bottom: clamp(3.5rem, 8vw, 6.5rem); }
.vk-lap__tartalom > h2 { margin-top: clamp(2.5rem, 5vw, 3.5rem); font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.3rem); }
.vk-lap__tartalom .vk-bevezeto { font-size: clamp(1.12rem, 1.05rem + .3vw, 1.3rem); color: #26353f; line-height: 1.6; }
.vk-lap__tartalom ol.vk-lepesek { padding-left: 1.25rem; }
.vk-lap__tartalom ol.vk-lepesek li { margin-bottom: .6rem; }
.vk-lap__tartalom .vk-illusztracio-szeles { margin-block: 1.5rem clamp(2rem, 4vw, 3rem) !important; }
.vk-lap__tartalom .vk-illusztracio-szeles img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 1.25; object-fit: cover; object-position: 60% 50%; border-radius: 4px; }

/* ---------- Apartmanoldal ---------- */
.vk-apartman { padding-bottom: clamp(3.5rem, 8vw, 6.5rem); }
.vk-apartman__fej { padding-block: clamp(1.5rem, 3.5vw, 2.5rem) clamp(1rem, 2vw, 1.5rem); }
.vk-apartman__cim { margin: 0; font-size: clamp(2.3rem, 1.6rem + 2.6vw, 3.6rem); }
.vk-apartman__racs { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(2rem, 5vw, 5rem); align-items: start; margin-top: clamp(2rem, 4vw, 3rem) !important; }
.vk-apartman__fo .wp-block-post-content > * + * { margin-block-start: 1.1rem; }
.vk-apartman__fo .wp-block-post-content > h2 { margin-block-start: clamp(2.75rem, 5vw, 3.75rem); padding-top: clamp(1.5rem, 3vw, 2rem); border-top: 1px solid var(--vk-vonal); font-size: clamp(1.7rem, 1.3rem + 1.2vw, 2.25rem); }
.vk-apartman__fo .wp-block-post-content > h3 { margin-block-start: 1.75rem; font-size: 1.1rem; font-family: var(--vk-betu); font-weight: 800; letter-spacing: 0; color: var(--vk-tinta); }
.vk-apartman__fo .wp-block-post-content > p { max-width: 68ch; }
.vk-apartman__oldal { position: sticky; top: calc(var(--vk-fejlec-m) + 1.5rem); }
#kepek, #video { scroll-margin-top: calc(var(--vk-fejlec-m) + 1rem); }

/* ---------- Lábléc: a festett balatoni táj marad (13357), forrás- és kreditsor nélkül ---------- */
.vk-lablec { margin-top: 0 !important; font-size: 1rem; background: var(--vk-tinta); color: #eaf4f3; padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0px)); position: relative; }
.vk-lablec .vk-illusztracio { display: block; width: calc(100% + 2 * var(--wp--style--root--padding-left, 1rem)); max-width: none !important; margin: 0 calc(-1 * var(--wp--style--root--padding-left, 1rem)) clamp(2rem, 4vw, 3rem) !important; background: #fbf6e9; }
.vk-lablec .vk-illusztracio img { display: block; width: 100%; height: auto; aspect-ratio: 2172 / 724; object-fit: cover; }
@media (max-width: 781px) { .vk-lablec .vk-illusztracio img { aspect-ratio: 2 / 1; object-position: 35% 60%; } }
.vk-lablec a { color: #fff; text-decoration: none; }
.vk-lablec a:hover { text-decoration: underline; }
.vk-lablec__marka { font-family: var(--vk-cim); font-size: 1.9rem; color: #fff; margin: 0 0 .75rem; }
.vk-lablec__marka em { color: var(--vk-nap); font-weight: 400; }
.vk-lablec__cim { font-size: .78rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #8fd3cb; margin: 0 0 .85rem; }
.vk-lablec__lista { list-style: none; padding: 0; margin: 0; }
.vk-lablec__lista li { margin: 0 0 .7rem; }
.vk-lablec__lista a { display: inline-block; padding-block: .2rem; }
.vk-lablec__ntak { display: block; font-size: .9rem; color: rgb(234 244 243 / .72); }
.vk-lablec .vk-kapcsolat { margin-top: 1.25rem; }
.vk-lablec .vk-kapcsolat-link { color: #fff; }
.vk-lablec .vk-kapcsolat-link .vk-ikon { color: var(--vk-nap); }
.vk-lablec p { color: rgb(234 244 243 / .86); }
.vk-lablec__also { border-top: 1px solid rgb(255 255 255 / .16); margin-top: 2.5rem !important; padding-top: 1.25rem; font-size: .85rem; color: rgb(234 244 243 / .7) !important; }

/* ---------- Tördelés ---------- */
@media (max-width: 1100px) {
	.vk-apartman__racs { grid-template-columns: minmax(0, 1fr) 320px; }
}
@media (max-width: 960px) {
	.vk-apartman__racs { grid-template-columns: minmax(0, 1fr); }
	.vk-apartman__oldal { position: static; }
	.vk-ketoszlop { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; }
}
@media (max-width: 781px) {
	/* 0.4.2: keskeny nézetben a felirat nem törik flex-elemenként (vonal külön sorban, „· Balatonfüred” a vonal alá csúszva):
	   a vonal a felirat első sora elé kerül, a második sor a szöveg elejéhez igazodik. */
	.vk-felirat { display: block; position: relative; padding-left: 2.65rem; }
	.vk-felirat::before { position: absolute; left: 0; top: .8em; top: calc(.5lh - .5px); width: 2rem; margin: 0; }
	.vk-felirat__koz { white-space: normal; } /* 0.4.3: itt törhet a sor: a pont az első csoport végén marad */
	.vk-szakasz__fej { grid-template-columns: minmax(0, 1fr); }
	.vk-lablec__oszlopok { gap: 1.75rem; }
	/* A mobil foglalási sáv (kb. 4,75rem) a lábléc alját sem takarja: annyi térköz kerül a lábléc aljára. */
	body.vk-van-mobilsav .vk-lablec { padding-bottom: calc(6rem + env(safe-area-inset-bottom, 0px)); }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition-duration: 0s !important; animation-duration: 0s !important; }
}

/* Forrásmegjelölés (szöveges tippek) és oldalon belüli záró foglalási blokk */
.vk-forras { font-size: .95rem; color: var(--vk-halvany); margin-top: 1.75rem !important; }
.vk-lap__tartalom .vk-zaro { margin-top: clamp(3rem, 6vw, 4.5rem) !important; padding: clamp(2rem, 5vw, 3rem) clamp(1rem, 4vw, 2.5rem); background: var(--vk-turkiz-h); border-radius: 6px; }
.vk-lap__tartalom .vk-hazigazda { margin-block: 2rem; }