/*
Theme Name: Rókahegyi út 34.
Description: Egyedi, Elementor-mentes téma a rokahegyiut34.hu oldalhoz. A korábbi Elementor + Hello Elementor felállás megjelenését reprodukálja, oldalépítő nélkül. A tartalom sima HTML-ként él az oldalak tartalmában.
Author: Karner Kristóf e.v.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 8.0
Text Domain: rokahegyiut34
*/

/* ─────────────────────────── Alapok / reset ─────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: "Plus Jakarta Sans", Sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: #7A7A7A;
	background-color: #fff;
	-webkit-font-smoothing: antialiased;
}

img, svg, video, iframe { max-width: 100%; }
img, video { height: auto; }
img { border: 0; vertical-align: middle; }

a { color: #CC3266; text-decoration: none; }
a:hover { color: #CC3266A1; }

p { margin: 0 0 14.4px; }


ul, ol { margin: 0; padding-left: 40px; }
li { margin: 0; }

figure { margin: 0; }

/* A címsorok az Elementor/Hello felállás méreteit tartják.
   A line-height szándékosan 1.2 — az oldalcímek (.page-title) 1.0-t kapnak lentebb. */
h1, h2, h3, h4, h5, h6 { margin: 8px 0 16px; color: #54595F; font-weight: 500; line-height: 1.2; }
h1 { font-size: 40px; font-weight: 500; }
h2 { font-size: 32px; font-weight: 400; }
h3 { font-size: 28px; font-weight: 500; color: #7A7A7A; }
h4 { font-size: 24px; font-weight: 500; color: #7A7A7A; }
h5 { font-size: 20px; font-weight: 500; color: #7A7A7A; }
h6 { font-size: 16px; font-weight: 500; color: #7A7A7A; }

strong, b { font-weight: 700; }

/* Képernyőolvasóknak: „Tartalomra ugrás” link (a korábbi Skip to content megfelelője) */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
	white-space: nowrap; border: 0;
}
.screen-reader-text:focus {
	position: fixed !important;
	top: 8px; left: 8px;
	width: auto; height: auto;
	clip: auto; clip-path: none;
	padding: 12px 20px;
	background: #fff; color: #CC3266;
	z-index: 100000;
	box-shadow: 0 2px 8px rgba(0,0,0,.2);
}

/* ─────────────────────────── Konténer ───────────────────────────
   Az Elementor „boxed" konténerét reprodukálja: 1140 px tartalomszélesség,
   10 px oldalpadding — content-box, hogy 1440 px-en a tartalom pontosan
   150 px-nél kezdődjön, mobilon pedig 10 px-nél. */
.container {
	max-width: 1140px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 10px;
	padding-right: 10px;
	box-sizing: content-box;
}

/* ─────────────────────────── Fejléc ─────────────────────────── */
.site-header { padding-top: 5px; padding-bottom: 8px; }

.site-header__bar {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
}

.site-title {
	margin: 16px 0 0;
	font-size: 40px;
	font-weight: 500;
	line-height: 1;
}
.site-title a { color: #CC3266; font-weight: 400; }
.site-title a:hover { color: #CC3266BF; }

/* Vízszintes (asztali) menü */
.nav-desktop ul {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0;
	margin: 0; padding: 0;
	list-style: none;
}
.nav-desktop a {
	display: block;
	padding: 13px 20px;
	font-size: 18px;
	font-weight: 600;
	line-height: 20px;
	color: #CC3266;
}
.nav-desktop { margin-top: 16px; margin-right: -20px; }
.nav-desktop a:hover { color: #CC3266A1; }

/* Függőleges (mobil/tablet) menü — nincs hamburger, ahogy eddig sem volt */
.nav-mobile { display: none; }
.nav-mobile ul { margin: 0; padding: 0; list-style: none; }
.nav-mobile a {
	display: block;
	padding: 13px 20px;
	font-size: 16px;
	font-weight: 500;
	line-height: 20px;
	color: #54595F;
}
.nav-mobile a:hover { color: #CC3266; }

/* Elválasztó vonalak (az Elementor divider widget megfelelői) */
.rule {
	border: 0;
	border-top: 1px solid #7A7A7A;
	margin: 15px 0;
}
/* A fejléc alatti vonal 3 px vastag (a fejlécen belüli mobil-vonalak 1 px-esek).
   A margók összege változatlan, hogy a tartalom ne mozduljon. */
.rule--desktop { border-top-width: 3px; margin-top: 26px; margin-bottom: 2px; }

/* ─────────────────────────── Tartalom ─────────────────────────── */
.site-main { padding-top: 0; padding-bottom: 10px; }

/* Az oldalcímek (korábban Elementor heading widget) tömör sorköze */
.page-title a { color: inherit; }
.page-title a:hover { color: inherit; }
.page-title { font-size: 32px; font-weight: 400; line-height: 1; color: #54595F; margin: 10px 0 20px; }

.entry-content > *:last-child { margin-bottom: 0; }

/* A szövegblokk az eddigi konténer-térközöket tartja */
/* flow-root: e nélkül a blokk első címsorának felső margója „kilógna” (margin collapse),
   és a szöveg 8 px-szel feljebb kezdődne, mint eddig. */
.text-block { display: flow-root; }

/* Leírás oldal: tömörebb bekezdés-térköz (kérésre) */
.page-id-24 .text-block p { margin-bottom: 8px; }
.text-block h5 { margin-bottom: 16px; }

/* ── Címsor-szintek ──
   Minden oldal címe H1 lett (korábban egyetlen oldalon sem volt H1 — a kereső és a
   képernyőolvasó számára is ez jelöli, miről szól a lap). A MEGJELENÉS nem változik:
   az alábbi két szabály visszaadja a H1-nek azt a méretet, amit korábban H2-ként kapott.
   A galéria-oldalak címe .wp-block-heading, a többié .page-title — a .page-title
   fentebbi szabálya osztály-szintű, ezért a h1 elem-szabályát magától felülírja. */
h1.wp-block-heading { font-size: 32px; font-weight: 400; }

/* A hosszú tájékoztatókban a szakaszcímek H2-re kerültek (H1 → H2 → H3 sorrend).
   Méretük a korábbi H3, illetve H4 méretét veszi át, hogy a lapok ugyanúgy nézzenek ki. */
.text-block h2 { font-size: 28px; font-weight: 500; color: #7A7A7A; }
.text-block h3 { font-size: 24px; }

/* ── Jogi dokumentumok: összefoglaló és keltezés ──
   A hosszú tájékoztatók elejére kerülő rövid kivonat. Nem díszítés: ez az a szövegrész,
   amit a keresőmotor kiemelt találatként, a válaszmotor idézetként, a türelmetlen olvasó
   pedig egyedüliként olvas el. A keltezés jogi dokumentumnál bizalmi jelzés is. */
.doc-summary { border-left: 3px solid #CC3266; padding: 2px 0 2px 20px; margin: 0 0 18px; }
.doc-summary-title { color: #54595F; margin-bottom: 10px; }
.doc-summary ul { padding-left: 20px; margin: 0 0 10px; }
.doc-summary li { margin-bottom: 6px; }
.doc-summary li strong { color: #54595F; }
.doc-note { font-size: 14px; margin: 0; }
.doc-updated { font-size: 14px; margin: 0 0 24px; }
/* Külön osztály, nem általános `ul` szabály: a Leírás oldal listáinak beállított
   térközeit így biztosan nem mozdítja el. */
.doc-list { margin-bottom: 14.4px; }

/* ── Süti-sáv ──
   Nem takarja el az oldalt és nem kényszerít döntésre: amíg nincs válasz, egyetlen
   mérési süti sem keletkezik, tehát a látogató nyugodtan olvashat tovább. A két gomb
   azonos méretű és egy kattintás — az elutasítás nem nehezebb az elfogadásnál.
   A [hidden] KELL: a `display: flex` egyébként felülírná a böngésző rejtését. */
.suti-sav {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
	display: flex; align-items: center; justify-content: center;
	flex-wrap: wrap; gap: 14px 24px;
	padding: 16px 20px;
	background: #fff; border-top: 1px solid #7A7A7A;
}
.suti-sav[hidden] { display: none; }
.suti-sav p { margin: 0; max-width: 680px; font-size: 14px; }
.suti-sav__gombok { display: flex; gap: 10px; flex-shrink: 0; }
.suti-sav button {
	font: inherit; font-size: 14px; line-height: 1;
	padding: 11px 20px; cursor: pointer;
	border: 1px solid #CC3266; border-radius: 2px;
	background: #fff; color: #CC3266;
}
.suti-sav button[data-suti="elfogadva"] { background: #CC3266; color: #fff; }
.suti-sav button:hover { opacity: .85; }

@media (max-width: 767px) {
	.suti-sav { flex-direction: column; align-items: stretch; text-align: center; }
	.suti-sav__gombok { justify-content: center; }
}

/* ─────────────────────────── Galéria ─────────────────────────── */
.hero-image { margin: 0; }
.hero-image img { width: 100%; }

/* A galéria-rács térköze 24 px — a WordPress alapértelmezett 16 px-e helyett.
   A .has-nested-images kell a szelektorba, különben a core szabálya erősebb. */
.wp-block-gallery { margin: 0 0 16px; }
/* A WordPress a galériához saját inline szabályt ír, aminek az alapértéke 0.5em (8 px).
   Nem felülírni kell, hanem a var()-láncába beállni: így a core saját számítása is
   24 px-szel dolgozik — ennyi volt a térköz eddig is. */
.wp-block-gallery { --gallery-block--gutter-size: 24px; }
.wp-element-caption, .wp-block-image figcaption {
	font-size: 13px;
	line-height: 1.4;
	text-align: center;
}
.wp-block-gallery figcaption { margin-top: 0; }

/* ─────────────────────────── Kontakt-lista ─────────────────────────── */
.contact-row { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.icon-block { margin-bottom: 5px; }
.icon-block svg { width: 1em; height: 1em; fill: #CC3266; font-size: 50px; }

.contact-list { margin: 5px 0 0; padding: 0; list-style: none; }
.contact-list li { display: flex; align-items: center; gap: .5em; padding-bottom: 2.5px; margin-top: 2.5px; }
.contact-list li:first-child { margin-top: 0; }
.contact-list li:last-child { padding-bottom: 0; }
.contact-list .icon { display: inline-flex; width: 14px; height: 14px; }
.contact-list .icon svg { width: 14px; height: 14px; fill: #CC3266; }
.contact-list .text { color: #54595F; font-size: 16px; font-weight: 400; }
.contact-list a { color: #54595F; }
.contact-list a:hover { color: #CC3266; }

/* ─────────────────────────── Videó-beágyazás ─────────────────────────── */
.video-embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; margin-bottom: 20px; }
.video-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* ─────────────────────────── Lábléc ─────────────────────────── */
.site-footer { padding-top: 78px; padding-bottom: 20px; }
.site-footer__bar { display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
.site-footer__copy { flex: 1 1 calc(50% - 15px); }
.site-footer__copy p {
	margin: 0;
	font-family: "Inter", Sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 1;
	color: #54595F;
}
/* A -2 px a két betűtípus eltérő függőleges metrikáját egyenlíti ki: a szerzői sor
   Inter, a linkek Plus Jakarta Sans — e nélkül a linkek 2 px-szel lejjebb ülnének. */
.site-footer__links {
	margin-top: -2px;
	flex: 1 1 50%;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	gap: 20px 40px;
}
.site-footer__links p { margin: 0; line-height: 1; }
.site-footer__links a {
	font-family: "Plus Jakarta Sans", Sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: #CC3266;
}

/* ─────────────────────────── Reszponzív ───────────────────────────
   Töréspontok az eddigi Elementor-beállítás szerint: tablet ≤1024, mobil ≤767. */
@media (max-width: 1024px) {
	.nav-desktop { display: none; }
	.nav-mobile { display: block; }
	.site-header__bar { flex-direction: column; align-items: stretch; }
	.rule--desktop { display: none; }
	/* Mobilon az oldalcím lejjebb ül, a menüsávok pedig a konténeren túlnyúlnak —
	   pontosan úgy, ahogy az eddigi elrendezésben. */
	.site-title { margin-top: 31px; }
	.nav-mobile { margin-left: -20px; margin-right: 20px; }
	.site-main { padding-top: 8px; }
}

@media (min-width: 1025px) {
	.rule--mobile { display: none; }
}

@media (max-width: 767px) {
	.home .page-title { font-size: 21px; }
	.site-footer__bar { flex-direction: column; align-items: center; }
	.site-footer__links { flex-direction: column; gap: 20px 0; order: -1; margin-bottom: 20px; }
	/* A lábléc-linkek mobilon fordított sorrendben jelentek meg (Süti Tájékoztató elöl) */
	.site-footer__links p:last-child { order: -1; }
	.site-footer__copy { flex-basis: 100%; width: 100%; text-align: center; }
}