/* Gépi összefűzés — ne ezt szerkeszd, hanem a forrásokat. */

/* ── assets/betu.css ── */
/* Source Sans 3 (OFL) — GÉPI, ne szerkeszd: kinyert/betu-beepit.py.
   Saját tárhelyről, nem a Google CDN-jéről: nulla külső kérés, és a
   látogató IP-je nem megy át harmadik félhez.
   Az `src` útvonala az összefűzött assets/oldal.css-hez képest relatív. */

@font-face {
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 200 900;
	font-display: swap;
	src: url('betu/source-sans-3-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 200 900;
	font-display: swap;
	src: url('betu/source-sans-3-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ── assets/jegyek.css ── */
/* Arculati jegyek — a színek a teszt/szinrendszer-teszt.py-ból jönnek,
   és mind a 17 szándékolt páros átmegy a WCAG AA-n. Ha itt színt írsz át,
   FUTTASD ÚJRA a tesztet, mert a rendszer azon áll vagy bukik.

   A betű- és térközlépték 360 és 1440 képpont között folyamatosan nő —
   nincsenek töréspont-ugrások. */

:root {
	/* felületek */
	--feher: #ffffff;
	--meleg-halvany: #faf7f2;
	--meleg-tomb: #f2ebe1;
	--sotet: #141210;

	/* tinta */
	--cim: #1a1714;
	--torzs: #4a443e;
	--halvany: #6b645c;

	/* márka — két szerep, egy színárnyalat */
	--marka-disz: #cd853f;   /* díszítő: nagy felület, ikon sötéten */
	--marka-tett: #955d27;   /* cselekvő: gomb, hivatkozás, szöveg */
	--marka-tett-ra: #825122;

	/* állapot */
	--nyitva: #2f6b45;
	--zarva: #5a5450;

	/* keret */
	--keret-diszito: #e2d9cc;  /* elválasztó vonal, nincs kontrasztkövetelmény */
	--keret-mezo: #9c8d78;     /* űrlapmező — WCAG 1.4.11, 3:1 */

	/* Sötét felület — az „A · Meleg" változat fejsávja. Külön színkészlet
	   kell hozzá: a --nyitva és a --zarva világos alapra készült, sötéten
	   egyik sem olvasható. A mostani drbodri.hu pontosan ezt a hibát követi el. */
	--fejsav-sotet: #241c15;    /* mély MELEG barna, nem semleges fekete */
	--nyitva-vilagos: #6cc08b;
	--zarva-vilagos: #b0a89f;
	--tinta-sotetben: #d2cdc8;

	/* Rajzolt térkép. A feliratai SZÖVEGEK, tehát a színrendszer-teszt
	   ugyanúgy méri őket, mint a lap többi szövegét. */
	--terkep-alap: #f2ebe1;
	--terkep-ut: #ffffff;
	--terkep-ut-fo: #ffffff;
	--terkep-keret: #ddd2c2;
	--terkep-felirat: #5f584f;
	--terkep-jelolo: #955d27;

	/* betűlépték */
	--betu: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
	--sz-xs: clamp(0.875rem, 0.864583rem + 0.0463vw, 0.90625rem);
	--sz-sm: clamp(0.96875rem, 0.958333rem + 0.0463vw, 1rem);
	--sz-alap: clamp(1.0625rem, 1.04167rem + 0.09259vw, 1.125rem);
	--sz-lead: clamp(1.21875rem, 1.1875rem + 0.1389vw, 1.3125rem);
	--sz-xl: clamp(1.4375rem, 1.375rem + 0.2778vw, 1.625rem);
	--sz-2xl: clamp(1.6875rem, 1.5625rem + 0.5556vw, 2.0625rem);
	--sz-3xl: clamp(2rem, 1.79167rem + 0.9259vw, 2.625rem);
	--sz-4xl: clamp(2.375rem, 2rem + 1.667vw, 3.5rem);

	/* térközlépték */
	--t-3xs: 0.25rem;
	--t-2xs: 0.5rem;
	--t-xs: 0.75rem;
	--t-sm: 1rem;
	--t-md: clamp(1.25rem, 1.16667rem + 0.3704vw, 1.5rem);
	--t-lg: clamp(1.75rem, 1.58333rem + 0.7407vw, 2.25rem);
	--t-xl: clamp(2.5rem, 2.16667rem + 1.481vw, 3.5rem);
	--t-2xl: clamp(3.5rem, 3rem + 2.222vw, 5rem);
	--t-3xl: clamp(4.5rem, 3.66667rem + 3.704vw, 7rem);
	--t-4xl: clamp(6rem, 4.66667rem + 5.926vw, 10rem);

	/* egyéb */
	--sor: 1.6;
	--sor-cim: 1.15;
	--ker: 10px;
	--ker-nagy: 18px;
	--arnyek: 0 1px 2px rgb(20 18 16 / 0.04), 0 8px 24px rgb(20 18 16 / 0.06);
	--atmenet: 180ms cubic-bezier(0.2, 0, 0, 1);
}

/* Mozgásérzékenység: nem csak illendőség, valódi panasz. Minden mozgás áll. */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Ikonok — a betűmérettel nőnek és a szövegszínt öröklik, tehát nem kell
   külön méretezni és színezni őket sehol. */
.ikon {
	width: 1em;
	height: 1em;
	display: inline-block;
	vertical-align: -0.125em;
	fill: currentColor;
	flex: none;
}
.ikon--nagy { width: 1.75em; height: 1.75em; }


/* ── assets/stilus.css ── */
/* Alapréteg — nem arculat, hanem infrastruktúra.
   A megjelenítés (elrendezés, sávok, kártyák) az arculat jóváhagyása után jön. */

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

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

body {
	margin: 0;
	font-family: var(--betu);
	font-size: var(--sz-alap);
	line-height: var(--sor);
	color: var(--torzs);
	background: var(--meleg-halvany);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
	color: var(--cim);
	line-height: var(--sor-cim);
	letter-spacing: -0.02em;
	margin: 0 0 var(--t-xs);
	text-wrap: balance;          /* ne maradjon árva szó a címsor végén */
}
h1 { font-size: var(--sz-3xl); font-weight: 700; }
h2 { font-size: var(--sz-2xl); font-weight: 650; }
h3 { font-size: var(--sz-xl);  font-weight: 600; }

p { margin: 0 0 var(--t-sm); max-width: 68ch; text-wrap: pretty; }

a { color: var(--marka-tett); text-underline-offset: 0.2em; }
a:hover { color: var(--marka-tett-ra); }

img, svg, video { max-width: 100%; height: auto; }

/* A böngésző `[hidden]` szabálya a HTML-névtérre korlátozódik, tehát az
   <svg hidden> NEM tűnik el magától. A rejtett ikon-sprite emiatt 150 pixel
   üres helyet foglalt a lap alján. */
svg[hidden] { display: none; }

/* Fókusz — látható, és nem csak egérrel navigálóknak.
   A `:focus-visible` billentyűnél mutat, kattintásnál nem. */
:focus-visible {
	outline: 3px solid var(--marka-tett);
	outline-offset: 3px;
	border-radius: 3px;
}

/* Ugrás a tartalomra — billentyűvel az első elem, egérrel láthatatlan. */
.ugras {
	position: absolute;
	left: var(--t-sm);
	top: var(--t-sm);
	z-index: 100;
	padding: 0.7em 1.2em;
	background: var(--cim);
	color: var(--feher);
	border-radius: var(--ker);
	text-decoration: none;
	transform: translateY(-200%);
}
.ugras:focus { transform: translateY(0); color: var(--feher); }

/* Csak képernyőolvasónak. */
.olvasonak {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* ─────────────────────────────────────────────────────────────────────────
   Alapréteg: fejléc, menü, ragadós sáv, lábléc.
   Szerkezet és viselkedés — az arculati finomítás a változatokban jön.
   ───────────────────────────────────────────────────────────────────────── */

.savon { max-width: 1180px; margin-inline: auto; padding-inline: var(--t-md); }

/* Gombok */
.gomb {
	display: inline-flex; align-items: center; gap: 0.55em;
	padding: 0.75em 1.35em; border-radius: var(--ker);
	font-weight: 600; text-decoration: none; line-height: 1.2;
	border: 2px solid transparent;
	transition: background var(--atmenet), border-color var(--atmenet);
}
.gomb--fo { background: var(--marka-tett); color: var(--feher); }
.gomb--fo:hover { background: var(--marka-tett-ra); color: var(--feher); }
.gomb--mellek { color: var(--marka-tett); border-color: var(--marka-tett); }
.gomb--mellek:hover { background: var(--marka-tett); color: var(--feher); }

/* Élő állapot */
.allapot { display: flex; align-items: baseline; gap: 0.5em; flex-wrap: wrap; margin: 0; }
.allapot strong { font-weight: 700; }
.allapot--nyitva strong { color: var(--nyitva); }
.allapot--zarva  strong { color: var(--zarva); }
.allapot span { color: var(--halvany); font-size: var(--sz-sm); }

/* ── Fejléc ── */
.fejlec {
	position: sticky; top: 0; z-index: 40;
	background: var(--feher);
	border-bottom: 1px solid var(--keret-diszito);
}
.fejlec__belso {
	max-width: 1180px; margin-inline: auto; padding: var(--t-2xs) var(--t-md);
	display: flex; align-items: center; gap: var(--t-sm);
}
.marka { text-decoration: none; font-weight: 700; color: var(--cim); line-height: 1.1; }
.marka__nev { font-size: var(--sz-sm); letter-spacing: -0.01em; }

.menu__lista { list-style: none; display: flex; gap: var(--t-2xs); margin: 0; padding: 0; }
.menu__elem { position: relative; display: flex; align-items: center; }
.menu__link {
	display: block; padding: 0.6em 0.7em; border-radius: var(--ker);
	text-decoration: none; color: var(--torzs); font-weight: 550; white-space: nowrap;
}
.menu__link:hover { background: var(--meleg-tomb); color: var(--cim); }
.menu__link[aria-current="page"] { color: var(--marka-tett); }
/* A legördítő gomb MÉRT mérete 20×24 px volt — a WCAG 2.5.8 (AA) 24×24-et
   kér. Kicsi számnak tűnik; a különbség az, hogy trackpaddel vagy remegő
   kézzel el lehet-e találni. A `min-width`/`min-height` a biztosíték, a
   negatív margó pedig visszaveszi a menüponttól a fölös helyet. */
.menu__nyito {
	background: none; border: 0; cursor: pointer; color: var(--halvany);
	padding: 0.4em; margin-left: -0.35em; border-radius: var(--ker); line-height: 0;
	min-width: 24px; min-height: 24px;
	display: inline-flex; align-items: center; justify-content: center;
}
.menu__nyito[aria-expanded="true"] { transform: rotate(180deg); }

.almenu {
	list-style: none; margin: 0; padding: var(--t-3xs);
	position: absolute; top: 100%; left: 0; min-width: 15rem;
	background: var(--feher); border: 1px solid var(--keret-diszito);
	border-radius: var(--ker); box-shadow: var(--arnyek); z-index: 50;
}
.almenu[hidden] { display: none; }
.almenu a {
	display: flex; align-items: center; gap: 0.6em;
	padding: 0.55em 0.7em; border-radius: var(--ker);
	text-decoration: none; color: var(--torzs); font-size: var(--sz-sm);
}
.almenu a:hover { background: var(--meleg-tomb); color: var(--cim); }

.hamburger { display: none; background: none; border: 0; cursor: pointer;
	color: var(--cim); font-size: var(--sz-xl); padding: 0.25em; line-height: 0; }
.hamburger__zar { display: none; }
.hamburger[aria-expanded="true"] .ikon--menu { display: none; }
.hamburger[aria-expanded="true"] .hamburger__zar { display: inline-block; }

.fomenu { display: contents; }
.fomenu__elerhetoseg, .fomenu__lablec { display: none; }
/* A fejléc gombja ne törjön két sorba: az angol „Book an appointment"
   hosszabb, mint az „Időpontfoglalás", és a fejléc magassága ugrott tőle. */
.fejlec__foglalas { margin-left: auto; white-space: nowrap; order: 2; }
.fejlec__foglalas-rovid { display: none; }
.menu { order: 1; }
.hamburger { order: 3; }

/* ── Ragadós cselekvő sáv ── */
.savsor {
	position: fixed; inset-inline: 0; bottom: 0; z-index: 45;
	display: flex; align-items: center; gap: var(--t-sm);
	padding: 0.6rem var(--t-md);
	background: var(--feher); border-top: 1px solid var(--keret-diszito);
	box-shadow: 0 -2px 16px rgb(20 18 16 / 0.06);
}
.savsor__bal { display: flex; flex-wrap: wrap; align-items: center; gap: var(--t-2xs) var(--t-lg); margin-right: auto; }
.savsor__allapot { margin: 0; display: flex; align-items: center; gap: 0.5em; }
.savsor__cim { display: inline-flex; align-items: center; gap: 0.4em; color: var(--torzs); text-decoration: none; font-size: var(--sz-sm); }
.savsor__cim .ikon { color: var(--marka-tett); }
.savsor__cim:hover { text-decoration: underline; color: var(--cim); }
.savsor .gomb { padding: 0.6em 1.1em; }
.savsor__hivas .savsor__szam { font-weight: 700; }
.savsor__hivas .savsor__hivas-cimke + .savsor__szam::before { content: "·"; margin: 0 0.35em 0 0; opacity: 0.7; }
/* A kezdőlapon a sáv csak görgetés után (Kristóf, 2026-09-10): amíg a fejsáv
   gombjai látszanak, ugyanazt mondaná kétszer. A `--figyel` osztályt a script
   adja; script nélkül a sáv mindig látszik. Csökkentett mozgásnál nincs átmenet. */
.savsor--figyel { transition: transform var(--atmenet), visibility var(--atmenet); }
.savsor--rejtett { transform: translateY(110%); visibility: hidden; }
@media (prefers-reduced-motion: reduce) { .savsor--figyel { transition: none; } }

/* A ragadós sáv helyét a LÁBLÉC adja, nem a body alsó paddingja: az utóbbi
   világos csíkot hagyott a sötét lábléc alatt. Így a sáv a lábléc saját
   színe fölött lebeg, és a lap alja egybefüggő marad. */
.lablec { padding-bottom: 5.5rem; }

/* ── Lábléc ── */
.lablec { background: var(--sotet); color: var(--feher); margin-top: var(--t-2xl); }
body:has(.sav--zaro) .lablec { margin-top: 0; }
.lablec__belso {
	max-width: 1180px; margin-inline: auto; padding: var(--t-xl) var(--t-md);
	display: grid; gap: var(--t-lg); grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}
.lablec p { margin: 0 0 0.4em; display: flex; align-items: center; gap: 0.5em; }
.lablec a { color: var(--feher); }
.lablec__nev { font-weight: 700; font-size: var(--sz-lead); color: var(--marka-disz); margin-bottom: 0; }
.lablec__nev a { color: inherit; text-decoration: none; }
.lablec__nev a:hover { text-decoration: underline; }
.lablec__jelmondat { margin-top: 0.1em; opacity: 0.85; }
.lablec .allapot span { color: rgb(255 255 255 / 0.65); }
.lablec .allapot--nyitva strong,
.lablec .allapot--zarva strong { color: var(--feher); }
.lablec__cim { margin: 0 0 var(--t-xs); font-size: var(--sz-alap); font-weight: 700; color: var(--feher); }
.lablec__menu ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--t-2xs); }
.lablec__menu a { color: rgb(255 255 255 / 0.85); text-decoration: none; }
.lablec__menu a:hover { color: var(--feher); text-decoration: underline; }
/* A heti rend a sötét láblécben — ugyanaz a részlet, más színek. */
.lablec .rend th, .lablec .rend td { padding: 0.35em 0.5em; font-size: var(--sz-sm); }
.lablec .rend th { color: rgb(255 255 255 / 0.72); }
.lablec .rend td { color: var(--feher); }
.lablec .rend__sor + .rend__sor { border-top-color: rgb(255 255 255 / 0.14); }
.lablec .rend__sor--ma { background: rgb(255 255 255 / 0.08); }
.lablec .rend__sor--ma th, .lablec .rend__sor--ma td { color: var(--feher); }
.lablec .rend__zarva { color: rgb(255 255 255 / 0.55); }
.lablec .allapot { margin-bottom: var(--t-xs); }

/* ── Mobil ── */
@media (max-width: 60rem) {
	.hamburger { display: block; margin-left: 0; }
	.fomenu {
		display: none; position: fixed; inset: 0; top: auto;
		height: calc(100dvh - var(--fejlec-magassag, 4rem));
		bottom: 0; overflow-y: auto;
		background: var(--feher); padding: var(--t-md);
		border-top: 1px solid var(--keret-diszito);
	}
	.fomenu--nyitva { display: block; }
	.fomenu__elerhetoseg, .fomenu__lablec { display: grid; gap: var(--t-2xs); }
	.fomenu__elerhetoseg { padding-bottom: var(--t-sm); border-bottom: 1px solid var(--keret-diszito); }
	.fomenu__elerhetoseg a, .fomenu__lablec a {
		display: flex; align-items: center; gap: 0.6em; text-decoration: none;
		color: var(--torzs); padding: 0.4em 0;
	}
	.fomenu__lablec { margin-top: var(--t-md); padding-top: var(--t-sm);
		border-top: 1px solid var(--keret-diszito); }
	.menu__lista { flex-direction: column; gap: 0; margin: var(--t-sm) 0; }
	.menu__elem { flex-wrap: wrap; }
	.menu__link { flex: 1; padding: 0.7em 0; font-size: var(--sz-lead); }
	.menu__nyito { margin-left: 0; padding: 0.7em; }
	.almenu { position: static; width: 100%; box-shadow: none; border: 0;
		border-left: 2px solid var(--keret-diszito); border-radius: 0;
		margin: 0 0 var(--t-2xs) 0.3em; padding-left: var(--t-sm); }
	/* A foglalás a fejléc sávjában marad, rövid felirattal (Kristóf, 2026-09-10:
	   egy helyen — a ragadós alsó sáv a hívásé és a címé). */
	.fejlec__foglalas { padding: 0.55em 0.8em; font-size: var(--sz-sm); }
	.fejlec__foglalas-hosszu { display: none; }
	.fejlec__foglalas-rovid { display: inline; }
	/* A ragadós sáv mobilon: balra az állapot és a cím két sorban, jobbra a
	   hívógomb a SZÁMMAL (a felirat rejtve) — a PPT sávja tömören. */
	.savsor { padding: 0.5rem var(--t-sm); gap: var(--t-2xs); }
	.savsor__bal { display: grid; gap: 0.1em; min-width: 0; }
	.savsor__reszlet, .savsor__hivas-cimke { display: none; }
	.savsor__hivas { padding: 0.65em 0.8em; font-size: var(--sz-sm); }
	.savsor__allapot { font-size: var(--sz-sm); }
	.savsor__cim { font-size: var(--sz-xs); }
	.savsor__cim span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* 26rem alatt (iPhone 14/15: 390 px) a márkanév és a gomb kisebb betűvel, hogy
   a fejléc egy sorban maradjon — mérve: 57 px. 24rem alatt (iPhone SE: 375) a
   gomb csak ikon; a nevét az `aria-label` viszi. */
@media (max-width: 26rem) {
	.fejlec__belso { gap: var(--t-2xs); }
	.marka__nev { font-size: 0.8125rem; }
	.fejlec__foglalas { padding: 0.5em 0.6em; font-size: 0.8125rem; }
}
@media (max-width: 24rem) {
	.fejlec__foglalas-rovid { display: none; }
	.fejlec__foglalas { padding: 0.55em 0.65em; }
	.fejlec__foglalas .ikon { font-size: 1.25em; }
}

/* ─────────────────────────────────────────────────────────────────────────
   A KEZDŐLAP ÖT SÁVJA

   A `docs/terv.md` 5. szakasza tételesen felsorolja, mit NE vegyünk át a
   tököli referenciából. Az itteni döntések annak a listának a másik oldala:

     • nincs hullámos szekcióhatár — a sávokat háttérszín választja el
     • nincs ikon színes körben — vonalas ikon, konténer nélkül
     • nincs kártyakeret + árnyék — keret nélküli kártya, egyenlő magassággal
     • nincs középre zárás — balra zárt, aszimmetrikus ritmus
     • nincs „Bővebben" — a hivatkozás a beszédes CÍMEN ül
   ───────────────────────────────────────────────────────────────────────── */

/* Hirdetménysáv — csak akkor van a lapon, ha van mit mondania. */
.hirdetmeny {
	margin: 0;
	padding: var(--t-2xs) var(--t-md);
	background: var(--sotet);
	color: var(--feher);
	font-size: var(--sz-sm);
	text-align: center;
	max-width: none;
}

/* Sávok — a ritmust a háttér adja, nem elválasztó grafika. */
.sav { padding-block: var(--t-2xl); }
.sav--velemenyek,
.sav--szolgaltatasok { background: var(--feher); }
.sav--zaro { background: var(--meleg-tomb); }
.sav h2 { margin-bottom: var(--t-lg); }

.sav__tovabb { margin: var(--t-lg) 0 0; font-weight: 600; }
.sav__tovabb a { display: inline-flex; align-items: center; gap: 0.4em; }

/* ── 1 · Fejsáv ─────────────────────────────────────────────────────── */

.fejsav {
	position: relative;
	padding-block: var(--t-3xl);
	background:
		radial-gradient(120% 100% at 85% 0%, #fff9f0 0%, transparent 60%),
		var(--meleg-tomb);
	overflow: hidden;
}

.fejsav__cim { font-size: var(--sz-4xl); max-width: 20ch; margin-bottom: var(--t-sm); }
.fejsav__bevezeto {
	font-size: var(--sz-lead);
	max-width: 54ch;
	margin-bottom: var(--t-xl);
}

/* Az élő állapot — egy kompakt, színtelen sor a címsor alatt (Kristóf,
   2026-09-09: „nem kell ekkorának lennie és zöldnek"). A zárva-ág a
   következő nyitást mondja: „Most zárva · hétfőn 12:00-kor nyitunk". A
   nyitva/zárva SZÍN a ragadós és a záró sávban marad — ott kicsi. */
.allapot-nagy {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.2em 0.5em;
	margin: 0 0 var(--t-lg);
	max-width: none;
	font-size: var(--sz-lead);
	line-height: 1.3;
}
.allapot-nagy .ikon { width: 1em; height: 1em; color: var(--halvany); }
/* Fajlagosság: a ragadós és a záró sáv általános `.allapot--nyitva strong`
   szabálya (0,1,1) különben itt is zöldre festené — mérve, a képen. */
.allapot-nagy.allapot--nyitva .allapot-nagy__cimke,
.allapot-nagy.allapot--zarva .allapot-nagy__cimke,
.allapot-nagy__cimke { font-weight: 700; color: var(--cim); }
.allapot-nagy__reszlet { color: var(--torzs); }

.fejsav__gombok { display: flex; flex-wrap: wrap; gap: var(--t-sm); }

/* A gombok alatti sor: a sürgős látogató harmadik útja balra, a
   Google-értékelés jelvénye mellette — halkan, a gombokkal nem versenyezve
   (kutatas-2026.md 5. elv: az első képernyő a sürgős látogatóé). */
.fejsav__melle {
	display: flex; flex-wrap: wrap; align-items: center; gap: var(--t-2xs) var(--t-lg);
	margin: var(--t-md) 0 0; max-width: none;
	font-size: var(--sz-sm);
}
.fejsav__surgos {
	display: inline-flex; align-items: center; gap: 0.4em;
	font-weight: 600; color: var(--marka-tett);
}
.fejsav__surgos .ikon { width: 1.15em; height: 1.15em; }
.fejsav--kepes .fejsav__surgos { color: var(--feher); }
.fejsav__ertekeles {
	display: inline-flex; align-items: center; gap: 0.4em;
	font-size: var(--sz-sm); font-weight: 600; color: var(--cim); text-decoration: none;
}
.fejsav__ertekeles:hover { text-decoration: underline; }
.fejsav__ertekeles .ikon { width: 1.1em; height: 1.1em; color: var(--marka-disz); }
.fejsav__ertekeles strong { font-size: var(--sz-alap); }
.fejsav__ertekeles span { color: var(--torzs); font-weight: 500; }
.fejsav--kepes .fejsav__ertekeles, .fejsav--kepes .fejsav__ertekeles span { color: var(--feher); }

/* A nagy gomb két sorosra nő: a felirat alatt maga a SZÁM. A mezőnyben
   senki nem teszi ki — pedig aki telefonál, annak épp az kell. */
.gomb--nagy { padding: 0.85em 1.6em; font-size: var(--sz-lead); }
.gomb--nagy .ikon { font-size: 1.4em; }
.gomb__szam {
	display: block;
	font-size: var(--sz-sm);
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	opacity: 0.92;
}

/* Váltakozó fejsávkép — csak akkor él, ha van kép a szövegkészletben. */
.fejsav--kepes { color: var(--feher); }
.fejsav__kepek { position: absolute; inset: 0; z-index: 0; background: var(--sotet); }
.fejsav__kep {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 1.2s ease-in-out;
}
.fejsav__kep--elso { opacity: 1; }
.fejsav--kepes .fejsav__belso { position: relative; z-index: 1; }
.fejsav--kepes .fejsav__cim,
.fejsav--kepes .allapot-nagy__cimke { color: var(--feher); }
.fejsav--kepes .fejsav__bevezeto,
.fejsav--kepes .allapot-nagy__reszlet { color: rgb(255 255 255 / 0.88); }

/* ── Szekció-fej — közös minta ──────────────────────────────────────
   Cím balra, a sáv cselekvése (összesítő, „mind a 14") jobbra; mobilon
   egymás alá esnek. A szerkezet egy helyen dől el, nem sávonként. */
.sav__fej {
	display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
	gap: var(--t-2xs) var(--t-lg);
	margin-bottom: var(--t-lg);
}
/* Erősebb szelektor, mint bármely változat `.sav h2` szabálya (a C-ben 56 px
   alsó margó tolta a linket a cím alá — mérve, 2026-09-09). */
.sav .sav__fej h2, .sav__fej h2 { margin-bottom: 0; }
.sav__fej-link { display: inline-flex; align-items: center; gap: 0.4em; font-weight: 600; }

/* ── 1b · A négy ikonos bizalmi elem a fejsáv alatt (PPT 1. dia) ────── */
.sav--bizalmi { padding-block: var(--t-md); background: var(--feher); border-bottom: 1px solid var(--keret-diszito); }
.bizalmi {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: var(--t-sm) var(--t-lg);
	grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 48rem) { .bizalmi { grid-template-columns: repeat(2, 1fr); } }
.bizalmi__elem { display: flex; align-items: center; gap: 0.5em; font-weight: 600; color: var(--cim); }
.bizalmi__elem .ikon { width: 1.35em; height: 1.35em; color: var(--marka-tett); flex-shrink: 0; }

/* ── 2 · Vélemények ─────────────────────────────────────────────────── */

/* Három idézet rácsban — lapozó és körhinta nélkül (Kristóf, 2026-09-09).
   A bizonyíték a hiteles szám (a fejben, a forrásra mutatva) és három igazi
   hang; a többi a Google-ön. */
.velemenyek__osszegzes {
	display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0.35em;
	font-weight: 600; color: var(--cim); text-decoration: none;
}
.velemenyek__osszegzes:hover { text-decoration: underline; }
.velemenyek__osszegzes .ikon--csillag { width: 1.1em; height: 1.1em; color: var(--marka-disz); }
.velemenyek__osszegzes .ikon--kifele { width: 0.9em; height: 0.9em; color: var(--halvany); }
.velemenyek__osszegzes strong { font-size: var(--sz-xl); line-height: 1; }
.velemenyek__osszegzes span { color: var(--torzs); font-weight: 500; }

/* Tizenöt kártya egy vízszintes, görgethető sávban (Kristóf, 2026-09-10):
   asztalon három, tableten kettő, mobilon egy látszik; scroll-snap a
   kártyák szélére; automatikus váltás NINCS (WCAG 2.2.2). A lapozó gombjai
   csak scripttel élnek — nélküle a sáv ujjal/érintőpaddal görgethető. */
.velemenyek {
	list-style: none; margin: 0; padding: 0 0 var(--t-2xs);
	display: grid; grid-auto-flow: column; gap: var(--t-xl);
	grid-auto-columns: calc((100% - 2 * var(--t-xl)) / 3);
	align-items: start;   /* a rövid vélemény nem nyúlik meg üresen a hosszú mellett */
	overflow-x: auto; overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;   /* Kristóf: csúszka ne, csak a nyilak — ujjal, érintőpaddal, billentyűvel attól még megy */
}
.velemenyek::-webkit-scrollbar { display: none; }
.velemenyek:focus-visible { outline-offset: 6px; }
.velemenyek__elem { scroll-snap-align: start; min-width: 0; }
@media (max-width: 60rem) { .velemenyek { grid-auto-columns: calc((100% - var(--t-xl)) / 2); } }
@media (max-width: 40rem) { .velemenyek { grid-auto-columns: 100%; gap: var(--t-lg); } }

.lapozo { display: flex; justify-content: flex-end; gap: var(--t-2xs); margin-top: var(--t-md); }
.lapozo__gomb {
	width: 2.75rem; height: 2.75rem; border-radius: 50%;
	border: 2px solid var(--marka-tett); background: var(--feher); color: var(--marka-tett);
	display: inline-flex; align-items: center; justify-content: center;
	cursor: pointer; font-size: 1.1rem; line-height: 0;
	transition: background var(--atmenet), color var(--atmenet), opacity var(--atmenet);
}
.lapozo__gomb:hover:not(:disabled) { background: var(--marka-tett); color: var(--feher); }
.lapozo__gomb:disabled { opacity: 0.35; cursor: default; }
.lapozo__gomb--elozo .ikon { transform: rotate(180deg); }

.sav__fej-sor { margin: var(--t-3xs) 0 0; color: var(--halvany); font-size: var(--sz-sm); }
.velemenyek__jelvenyek { display: flex; flex-wrap: wrap; gap: var(--t-2xs) var(--t-md); align-items: center; }

/* A kártya: KI mondja → HÁNY csillag → MIT mond → MIKOR, HONNAN. A
   `position: relative` nem dísz: a képernyőolvasónak szánt `.olvasonak`
   spanek abszolút pozíciójúak, és pozicionált ős nélkül egy külső ős
   koordinátáiban állnának (a lapozós változatban ez 1674 px-re szélesítette
   a dokumentumot — mérve). */
.velemeny { position: relative; }
.velemeny__fej { margin-bottom: var(--t-xs); }
.velemeny__nev { margin: 0 0 var(--t-3xs); font-weight: 600; color: var(--cim); }
.velemeny__nev a { color: inherit; }
/* A csillagsor EGY elem, CSS-maszkkal (a sprite csillagából): kártyánként öt
   <svg> 624 bájt volt, tizenöt kártyán 8 kB — mérve, 2026-09-10. A darabszám
   a `--csillag` változóból jön (a szűrő ötöt enged, de a küszöb lazítható). */
.velemeny__csillagok {
	display: block; margin: 0;
	width: calc(var(--csillag, 5) * 1.2em); height: 1.05em;
	background-color: var(--marka-disz);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M234.3,114.8l-45,38.8L203,211.8a16.4,16.4,0,0,1-24.5,17.8L128,198.5,77.5,229.6A16.4,16.4,0,0,1,53,211.8l13.8-58.1-45-38.8A16.5,16.5,0,0,1,31.1,86l59-4.8,22.8-55.1a16.4,16.4,0,0,1,30.3,0l22.8,55.1,59,4.8a16.5,16.5,0,0,1,9.4,28.9Z'/%3E%3C/svg%3E") 0 0 / 1.2em 1.05em repeat-x;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M234.3,114.8l-45,38.8L203,211.8a16.4,16.4,0,0,1-24.5,17.8L128,198.5,77.5,229.6A16.4,16.4,0,0,1,53,211.8l13.8-58.1-45-38.8A16.5,16.5,0,0,1,31.1,86l59-4.8,22.8-55.1a16.4,16.4,0,0,1,30.3,0l22.8,55.1,59,4.8a16.5,16.5,0,0,1,9.4,28.9Z'/%3E%3C/svg%3E") 0 0 / 1.2em 1.05em repeat-x;
}
.velemeny__szoveg {
	margin: 0 0 var(--t-xs);
	color: var(--torzs);
	line-height: 1.5;
	/* Tíz sornál hosszabb vélemény: a többi rejtve marad, de a szöveg TELJES
	   a HTML-ben — a séma és a képernyőolvasó ugyanazt kapja, amit a Google.
	   Csonkolt idézet nincs; aki a többit akarja, a Google-linken olvassa. */
	display: -webkit-box;
	-webkit-line-clamp: 10;
	line-clamp: 10;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.velemeny__lab { display: flex; flex-wrap: wrap; gap: 0 0.45em; margin: 0; font-size: var(--sz-sm); color: var(--halvany); }
.velemeny__lab > * + *::before { content: "·"; margin-right: 0.45em; }
.velemeny__forras { display: inline-flex; align-items: center; gap: 0.3em; }
.velemeny__forras .ikon { width: 1em; height: 1em; }

/* ── 3 · Gyors tények ───────────────────────────────────────────────── */

.tenyek {
	display: grid;
	gap: var(--t-xl) var(--t-2xl);
	grid-template-columns: 1.15fr 1fr;   /* aszimmetrikus, nem felezett */
	align-items: start;
}
.tenyek h2 { margin-bottom: var(--t-md); }
.tenyek h3 { margin-bottom: var(--t-sm); }

.tenyek__cim, .tenyek__sor {
	display: flex; align-items: flex-start; gap: 0.6em;
	margin-bottom: var(--t-xs);
}
.tenyek__cim { font-size: var(--sz-lead); color: var(--cim); }
.tenyek__cim .ikon, .tenyek__sor .ikon { color: var(--marka-tett); margin-top: 0.2em; }
.tenyek .gomb { margin-top: var(--t-sm); }

/* Nyitvatartási táblázat — a MAI nappal kezd, nem hétfővel. */
.rend { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.rend th, .rend td { padding: 0.55em 0.7em; text-align: left; font-weight: 400; }
.rend th { color: var(--torzs); }
.rend td { color: var(--cim); text-align: right; }
.rend__sor + .rend__sor { border-top: 1px solid var(--keret-diszito); }
.rend__sor--ma { background: var(--meleg-tomb); font-weight: 700; }
.rend__sor--ma th, .rend__sor--ma td { color: var(--cim); }
.rend__ma {
	margin-left: 0.5em; padding: 0.1em 0.5em;
	border-radius: 999px;
	background: var(--marka-tett); color: var(--feher);
	font-size: var(--sz-xs); font-weight: 600; vertical-align: 0.1em;
}
.rend__zarva { color: var(--halvany); }

/* ── 4 · Szolgáltatás-kártyák ───────────────────────────────────────── */

/* Három oszlop, nem „amennyi befér": hat kártya `auto-fit`-tel 4+2-re
   törik, ami befejezetlennek látszik. 3+3 zárt alakzat, 2+2+2 is az. */
.kartyak {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: var(--t-lg);
	grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 62rem) { .kartyak { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 40rem) { .kartyak { grid-template-columns: 1fr; } }
/* Mobilon a KEZDŐLAP hat kártyája két oszlopban, ikon + cím — a leírás az
   aloldalon. Berni „ne kelljen görgetni" kérése: a kezdőlap mobilon 12
   képernyő volt, ebből négy ez a sáv volt (docs/kovetkezo.md 3.). Csak a
   kezdőlapon: a Szolgáltatások lapon a leírás az egyetlen szöveg. */
@media (max-width: 40rem) {
	.kartyak--kezdolap { grid-template-columns: repeat(2, 1fr); gap: var(--t-sm); }
	.kartyak--kezdolap .kartya { padding: var(--t-sm); }
	.kartyak--kezdolap .kartya__cim { font-size: var(--sz-alap); margin-bottom: 0; }
	.kartyak--kezdolap .kartya__ikon { width: 1.5em; height: 1.5em; margin-bottom: var(--t-3xs); }
	.kartyak--kezdolap .kartya__leiras { display: none; }
}
.kartya {
	position: relative;
	display: flex; flex-direction: column;
	padding: var(--t-md);
	background: var(--meleg-halvany);
	border-radius: var(--ker-nagy);
	transition: background var(--atmenet);
}
.kartya:hover { background: var(--meleg-tomb); }
.kartya__ikon { width: 1.9em; height: 1.9em; color: var(--marka-tett); margin-bottom: var(--t-xs); }
.kartya__cim { font-size: var(--sz-xl); margin-bottom: var(--t-2xs); }
.kartya__link { color: var(--cim); text-decoration: none; }
.kartya__link:hover { color: var(--marka-tett); }
/* A teljes kártya kattintható — a fókusz viszont a valódi linken marad. */
.kartya__link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.kartya__leiras { margin: 0; font-size: var(--sz-sm); color: var(--torzs); }

/* ── 5 · Záró sáv ───────────────────────────────────────────────────── */

.zaro {
	display: grid; gap: var(--t-lg) var(--t-2xl);
	grid-template-columns: 1.2fr auto;
	align-items: center;
}
.zaro h2 { margin-bottom: var(--t-2xs); }
.zaro__gombok { display: flex; flex-direction: column; gap: var(--t-sm); }
.zaro__gombok .gomb { justify-content: center; }

/* ── Mobil ──────────────────────────────────────────────────────────── */

@media (max-width: 48rem) {
	.tenyek, .zaro { grid-template-columns: 1fr; }
	.fejsav { padding-block: var(--t-2xl); }
	.fejsav__gombok .gomb, .zaro__gombok .gomb { flex: 1 1 100%; justify-content: center; }
	.zaro__gombok { flex-direction: column; }
}

/* ── Váltósáv — csak a prototípusokban ─────────────────────────────────────
   Az élesített oldalon ez a blokk meg sem születik (lásd inc/valtozat.php),
   de a stílusa itt marad: egy fejlesztői segédeszköz nem érdemel külön
   stíluslapot, és egy kérést végképp nem. */

.valtosav {
	display: flex; align-items: center; gap: var(--t-2xs);
	padding: var(--t-2xs) var(--t-md);
	background: var(--sotet); color: var(--feher);
	font-size: var(--sz-xs);
}
.valtosav__cimke { color: rgb(255 255 255 / 0.6); text-transform: uppercase; letter-spacing: 0.08em; }
.valtosav__gomb {
	display: inline-flex; align-items: baseline; gap: 0.4em;
	padding: 0.35em 0.7em; border-radius: var(--ker);
	color: var(--feher); text-decoration: none;
	border: 1px solid rgb(255 255 255 / 0.25);
}
.valtosav__gomb:hover { background: rgb(255 255 255 / 0.12); color: var(--feher); }
.valtosav__gomb--aktiv { background: var(--marka-disz); border-color: var(--marka-disz); color: var(--sotet); }
.valtosav__gomb--aktiv:hover { background: var(--marka-disz); color: var(--sotet); }
.valtosav__gomb span { font-size: var(--sz-xs); }
.valtosav__sugo { margin-left: auto; color: rgb(255 255 255 / 0.55); }

@media (max-width: 40rem) {
	.valtosav__sugo, .valtosav__gomb span { display: none; }
}


/* ── Rajzolt térkép ───────────────────────────────────────────────────────
   Nem beágyazás: az sütizik, több száz kilobájt JavaScriptet tölt egyetlen
   álló képért — és MÉRVE van, hogy pontosan az törte el a régi oldal
   Kapcsolat lapját mobilon. A rajz ráadásul csak azt mutatja, ami számít.

   A feliratok a lap betűjével és a lap színeivel mennek: a térkép így a lap
   RÉSZE, nem egy idegen test benne. */

.terkep {
	display: block;
	width: 100%;
	border-radius: var(--ker-nagy);
	background: var(--terkep-alap);
}
.terkep__utcanev {
	font-size: 13px; font-weight: 600;
	fill: var(--terkep-felirat);
}
.terkep__utcanev--fo { font-size: 15px; font-weight: 700; }
.terkep__megallo { font-size: 12px; fill: var(--terkep-felirat); }
.terkep__jel { font-size: 12px; font-weight: 600; fill: var(--terkep-felirat); }

/* A jelölő lüktetése figyelemvezetés, nem dísz — de mozgásérzékenységnél
   a jegyek.css globálisan leállítja. */
.terkep__rendelo circle:first-child { animation: terkep-lukteto 2.6s ease-out infinite; }
@keyframes terkep-lukteto {
	0%   { transform: scale(0.8); opacity: 0.30; }
	70%  { transform: scale(1.5); opacity: 0; }
	100% { transform: scale(1.5); opacity: 0; }
}

/* A kezdőlapon a térkép a bal oszlop tetején ül. A magasságot a viewBox
   aránya adja — `max-height`-tal az SVG összenyomódna, mert az `object-fit`
   csak a REPLACED elemekre hat, egy inline SVG-re nem. */
.tenyek__terkep { margin-bottom: var(--t-md); max-width: 34rem; }
@media (max-width: 40rem) {
	.tenyek__terkep { max-width: 16rem; }      /* mobilon a cím és az útvonaltervező a lényeg, a rajz kisebb */
	.sav { padding-block: var(--t-xl); }        /* szűkebb sávritmus a kis képernyőn */
}

/* ─────────────────────────────────────────────────────────────────────────
   BELSŐ LAPOK

   A kezdőlap fejsávja külön él: ott az élő állapot és a két gomb a
   főszereplő. A belső lapokon a cím elég — a hívás és a foglalás úgyis
   kéznél van a ragadós sávban.
   ───────────────────────────────────────────────────────────────────────── */

.laptető { padding-block: var(--t-xl) var(--t-lg); background: var(--meleg-tomb); }
.laptető h1 { max-width: 24ch; }
.laptető__bevezeto { font-size: var(--sz-lead); max-width: 60ch; margin: 0; }
.laptető__ikon { margin: 0 0 var(--t-2xs); font-size: var(--sz-2xl); color: var(--marka-tett); line-height: 1; }

/* Kenyérmorzsa — hol járok, és hogyan jutok vissza. */
.morzsa ol {
	list-style: none; display: flex; flex-wrap: wrap; gap: 0.4em;
	margin: 0 0 var(--t-xs); padding: 0;
	font-size: var(--sz-sm); color: var(--halvany);
}
.morzsa li + li::before { content: "›"; margin-right: 0.4em; color: var(--halvany); }
.morzsa a { color: var(--halvany); }
.morzsa a:hover { color: var(--marka-tett); }
.morzsa [aria-current] { color: var(--torzs); }

/* Szövegtörzs — az olvasható sorhossz nem díszítés, hanem a lényeg.

   A korlátozás a TARTALMON van, nem a konténeren: a `.savon` közepre
   igazított sáv, és ha ugyanazon az elemen 68ch-re szűkítjük, az egész
   szöveg a lap KÖZEPÉRE csúszik. A terv balra zárást ír elő (`terv.md` 5.),
   és a középre húzott szövegoszlop pont a régi, 2010-es évekbeli minta. */
.szovegtorzs > * { max-width: 68ch; }
/* Kicker a laptetőn: a lap neve kicsiben a PPT-főcím fölött (Rólunk). */
.laptető__kicker {
	margin: 0 0 var(--t-2xs);
	font-size: var(--sz-sm); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--marka-tett);
}
.szovegtorzs__lead { font-size: var(--sz-lead); color: var(--cim); }
.szovegtorzs h2 { margin-top: var(--t-lg); }

/* Szolgáltatás-aloldal a PPT 11. diája szerint: pontok, árjelzés, CTA. */
.pontok { list-style: none; margin: var(--t-md) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--t-xs) var(--t-lg); }
.pontok li { display: flex; align-items: center; gap: 0.45em; font-weight: 600; color: var(--cim); }
.pontok .ikon { width: 1.2em; height: 1.2em; color: var(--marka-tett); }
.arjelzes {
	margin-top: var(--t-lg); padding: var(--t-md);
	background: var(--meleg-halvany); border-radius: var(--ker-nagy);
}
.arjelzes__cim { font-size: var(--sz-alap); margin: 0 0 var(--t-xs); }
.arjelzes__lista { margin: 0; }
.arjelzes__sor { display: flex; justify-content: space-between; gap: var(--t-md); padding: 0.4em 0; border-top: 1px solid var(--keret-diszito); }
.arjelzes__sor:first-child { border-top: 0; }
.arjelzes__sor dt { color: var(--torzs); }
.arjelzes__sor dt small { display: block; font-size: var(--sz-sm); color: var(--halvany); }
.arjelzes__sor dd { margin: 0; font-weight: 700; color: var(--cim); white-space: nowrap; font-variant-numeric: tabular-nums; }
.arjelzes__mind { margin: var(--t-xs) 0 0; font-size: var(--sz-sm); }
.arjelzes__mind a { display: inline-flex; align-items: center; gap: 0.35em; font-weight: 600; }
.szolgaltatas__cta { margin-top: var(--t-lg); }

/* „Ez a lap még készül" — nem üres kifogás, hanem működő átjáró. */
.keszul {
	padding: var(--t-lg);
	background: var(--meleg-tomb);
	border-radius: var(--ker-nagy);
}
.keszul__szoveg { font-size: var(--sz-lead); color: var(--cim); margin-bottom: var(--t-md); }

/* Négyes kártyarács a Rólunk értékajánlataihoz. */

/* Címkesor — a többi szolgáltatás egy szolgáltatás-lap alján. */
.cimkesor { list-style: none; display: flex; flex-wrap: wrap; gap: var(--t-2xs); margin: 0; padding: 0; }
.cimke {
	display: inline-flex; align-items: center; gap: 0.45em;
	padding: 0.5em 0.9em; border-radius: 999px;
	background: var(--meleg-halvany); color: var(--torzs);
	text-decoration: none; font-size: var(--sz-sm);
	transition: background var(--atmenet), color var(--atmenet);
}
.cimke:hover { background: var(--marka-tett); color: var(--feher); }
.sav--tovabbiak { background: var(--feher); }

/* Továbbvezető kártyák (Rólunk, Információk). */
.tovabbi-lapok { display: grid; gap: var(--t-md); grid-template-columns: repeat(2, 1fr); }
.tovabbi-lapok--racs { grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
.tovabbi-lap {
	display: flex; align-items: flex-start; gap: var(--t-sm);
	padding: var(--t-md); border-radius: var(--ker-nagy);
	background: var(--meleg-halvany); color: var(--torzs); text-decoration: none;
	transition: background var(--atmenet);
}
.tovabbi-lap:hover { background: var(--meleg-tomb); color: var(--torzs); }
.tovabbi-lap .ikon { font-size: var(--sz-xl); color: var(--marka-tett); margin-top: 0.1em; }
.tovabbi-lap strong { display: block; color: var(--cim); font-size: var(--sz-lead); }
.tovabbi-lap small { display: block; margin-top: 0.2em; font-size: var(--sz-sm); }

/* ── Számozott kártyák (PPT 2. és 15. dia: Rólunk bizalom-kártyák, „Mire számíthat?") ── */
/* Fehér sávon: a kártya meleg-halvány háttere a lap alapszínén nem látszott (képen mérve). */
.sav--bizalom { background: var(--feher); }
.szamozott {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: var(--t-lg);
	grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 48rem) { .szamozott { grid-template-columns: 1fr; } }
.szamozott__kartya {
	padding: var(--t-md);
	background: var(--meleg-halvany);
	border-radius: var(--ker-nagy);
}
.szamozott__szam {
	display: block; margin-bottom: var(--t-xs);
	font-size: var(--sz-xl); font-weight: 800; letter-spacing: -0.02em;
	color: var(--marka-disz); font-variant-numeric: tabular-nums;
}
.szamozott__cim { font-size: var(--sz-xl); margin-bottom: var(--t-2xs); }
.szamozott__leiras { margin: 0; color: var(--torzs); }
.szamozott--oszlop { grid-template-columns: 1fr; gap: var(--t-sm); }
.szamozott--oszlop .szamozott__kartya { padding: var(--t-sm) var(--t-md); }
.szamozott--oszlop .szamozott__szam { display: inline; margin: 0 0.5em 0 0; font-size: var(--sz-lead); }
.szamozott--oszlop .szamozott__cim { display: inline; font-size: var(--sz-lead); }

/* ── Időpontkérés (PPT 15. dia): űrlap balra, „Mire számíthat?" jobbra ── */
.idopont { display: grid; gap: var(--t-xl) var(--t-2xl); grid-template-columns: 1.4fr 1fr; align-items: start; }
@media (max-width: 60rem) { .idopont { grid-template-columns: 1fr; } }
.idopont__mellette h2 { margin-bottom: var(--t-xs); }
.idopont__jegyzet { color: var(--torzs); margin-bottom: var(--t-md); }
.idopont__elonyok { display: flex; align-items: center; gap: 0.45em; margin: var(--t-md) 0 0; font-size: var(--sz-sm); color: var(--torzs); }
.idopont__elonyok .ikon { color: var(--nyitva); }
.jelveny {
	display: inline-flex; align-items: center; gap: 0.4em;
	margin: 0 0 var(--t-md); padding: 0.3em 0.8em;
	border-radius: 999px; background: var(--meleg-tomb); color: var(--cim);
	font-size: var(--sz-sm); font-weight: 600;
}
.jelveny .ikon { width: 1.1em; height: 1.1em; color: var(--marka-tett); }
.urlap--idopont { max-width: none; }
.urlap__alcim { color: var(--torzs); margin-bottom: var(--t-md); }
.urlap__lepes { margin: 0 0 var(--t-md); padding: 0; border: 0; min-width: 0; }
.urlap__lepes > legend, .urlap__lepes > label { font-size: var(--sz-lead); font-weight: 700; color: var(--cim); padding: 0; margin-bottom: var(--t-2xs); }
.urlap__lepes .urlap__mezo { margin-bottom: var(--t-xs); }
.urlap__valaszto { display: flex; flex-wrap: wrap; gap: var(--t-xs) var(--t-md); margin: 0; padding: 0; border: 0; }
.urlap__radio { display: inline-flex; align-items: center; gap: 0.4em; font-weight: 500; color: var(--cim); cursor: pointer; }
.urlap__radio input { width: 1.1em; height: 1.1em; accent-color: var(--marka-tett); margin: 0; }
.urlap--idopont textarea::placeholder, .urlap--idopont input::placeholder { color: var(--halvany); }

/* ── Csapat — rács, nem körhinta; a PPT 7–9. diája szerint két oszlop,
   portré balra, szöveg jobbra, csoportonként ─────────────────────────── */
.sav--csapat + .sav--csapat { padding-top: 0; }
.sav--csapat h2 { margin-bottom: var(--t-md); }
.csapat {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: var(--t-lg) var(--t-xl);
	grid-template-columns: repeat(2, 1fr);
	align-items: start;
}
@media (max-width: 48rem) { .csapat { grid-template-columns: 1fr; } }
.tag { display: grid; grid-template-columns: 8.5rem 1fr; gap: var(--t-md); align-items: start; }
@media (max-width: 30rem) { .tag { grid-template-columns: 1fr; } .tag__kep { max-width: 12rem; } }
.tag__kep {
	display: block; width: 100%; aspect-ratio: 1; object-fit: cover;
	border-radius: var(--ker-nagy); background: var(--meleg-tomb);
}
.tag__kep--nincs { display: grid; place-items: center; color: var(--halvany); }
.tag__kep--nincs .ikon { width: 2.4rem; height: 2.4rem; }
.tag__nev { font-size: var(--sz-xl); margin: 0 0 var(--t-3xs); }
.tag__szerep { margin: 0 0 var(--t-xs); font-size: var(--sz-sm); color: var(--halvany); }
.tag__bemutatkozas p { margin: 0 0 var(--t-xs); font-size: var(--sz-sm); color: var(--torzs); }
.tag__bemutatkozas p:last-child { margin-bottom: 0; }

/* ── Felszereltség ────────────────────────────────────────────────────── */

.eszkozok {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: var(--t-sm);
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}
.eszkoz {
	display: flex; align-items: center; gap: 0.7em;
	padding: var(--t-sm) var(--t-md);
	background: var(--feher); border-radius: var(--ker);
	font-size: var(--sz-lead); color: var(--cim);
}
.eszkoz .ikon { font-size: var(--sz-xl); color: var(--marka-tett); }

/* ── Árlista ──────────────────────────────────────────────────────────── */

.arlista { width: 100%; border-collapse: collapse; max-width: 42rem; }
.arlista th, .arlista td { padding: var(--t-sm) 0; text-align: left; vertical-align: baseline; }
.arlista th { font-weight: 500; color: var(--cim); }
.arlista tr + tr { border-top: 1px solid var(--keret-diszito); }
.arlista__ar {
	text-align: right; white-space: nowrap;
	font-weight: 700; color: var(--cim);
	font-variant-numeric: tabular-nums;
}
.arlista__megjegyzes { display: block; color: var(--halvany); font-size: var(--sz-sm); font-weight: 400; }

/* ── Kapcsolat és megközelítés ────────────────────────────────────────── */

.kapcsolat {
	display: grid; gap: var(--t-xl) var(--t-2xl);
	grid-template-columns: 1fr 1fr;
	align-items: start;
}
.kapcsolat h2:not(:first-child) { margin-top: var(--t-lg); }
.sav--terkep .terkep { margin-bottom: var(--t-md); }
.kapcsolat__gombok { display: flex; flex-wrap: wrap; gap: var(--t-xs); margin-bottom: var(--t-lg); }

/* Megközelítés — a PPT 4. diája: térképblokk, útvonaltervezés, ikonpárok */
.terkepblokk { margin-bottom: var(--t-xl); }
.terkepblokk .terkep { margin-bottom: var(--t-md); }
.ikonparok {
	display: grid; gap: var(--t-lg) var(--t-xl);
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
	margin: 0;
}
.ikonparok__par { margin: 0; }
.ikonparok dt {
	display: flex; align-items: center; gap: 0.5em;
	margin-bottom: var(--t-2xs);
	font-size: var(--sz-lead); font-weight: 700; color: var(--cim);
}
.ikonparok dt .ikon { color: var(--marka-tett); }
.ikonparok dd { margin: 0; color: var(--torzs); }
.ikonparok__par--rend { grid-column: 1 / -1; max-width: 34rem; }

/* GYIK — a PPT 5. diája: kattintásra nyíló válaszok, script nélkül */
.gyik { border-top: 1px solid var(--keret-diszito); }
.gyik__elem { border-bottom: 1px solid var(--keret-diszito); }
.gyik__kerdes {
	display: flex; align-items: center; justify-content: space-between; gap: var(--t-sm);
	padding: var(--t-sm) 0;
	font-size: var(--sz-lead); font-weight: 600; color: var(--cim);
	cursor: pointer; list-style: none;
}
.gyik__kerdes::-webkit-details-marker { display: none; }
.gyik__nyil { flex: none; color: var(--marka-tett); transition: transform var(--atmenet); }
.gyik__elem[open] .gyik__nyil { transform: rotate(180deg); }
.gyik__valasz { padding: 0 0 var(--t-md); max-width: 60ch; }
.gyik__valasz p { margin: 0 0 var(--t-xs); }
.gyik__valasz p:last-child { margin-bottom: 0; }
.sav--gyik { padding-block: var(--t-xl); }   /* alap háttér: a fehér szolgáltatás-sáv és a meleg záró sáv között */

/* Tájékoztatók — a PPT 13. diája: PDF-kártyák, egy hivatkozás kártyánként */
.pdfek {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: var(--t-md);
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}
.pdfek__link {
	display: flex; flex-direction: column; gap: var(--t-2xs); height: 100%;
	padding: var(--t-md);
	border: 1px solid var(--keret-diszito); border-radius: var(--ker-nagy);
	background: var(--feher); color: var(--torzs); text-decoration: none;
	transition: border-color var(--atmenet);
}
.pdfek__link:hover { border-color: var(--marka-tett); color: var(--torzs); }
.pdfek__cimke {
	display: inline-flex; align-items: center; gap: 0.3em; align-self: flex-start;
	font-size: var(--sz-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
	color: var(--marka-tett);
}
.pdfek__cim { font-size: var(--sz-xl); color: var(--cim); }
.pdfek__alcim { color: var(--torzs); }
.pdfek__letoltes { margin-top: var(--t-sm); align-self: flex-start; }
.pdfek__link:hover .pdfek__letoltes { background: var(--marka-tett); color: var(--feher); }

/* ── Űrlap ────────────────────────────────────────────────────────────── */

.urlap { max-width: 34rem; }
.urlap__mezo { display: grid; gap: 0.35em; margin-bottom: var(--t-sm); max-width: none; }
.urlap label { font-weight: 600; color: var(--cim); font-size: var(--sz-sm); }
.urlap input, .urlap textarea {
	font: inherit; color: var(--cim);
	padding: 0.65em 0.8em;
	border: 1px solid var(--keret-mezo);      /* WCAG 1.4.11 — 3:1 */
	border-radius: var(--ker);
	background: var(--feher);
	width: 100%;
}
.urlap input:focus, .urlap textarea:focus { border-color: var(--marka-tett); }
.urlap textarea { resize: vertical; min-height: 8rem; }
.urlap__kotelezo { color: var(--marka-tett); }
.urlap__hiba { color: #a3312a; font-size: var(--sz-sm); }
.urlap__mezo--hibas input, .urlap__mezo--hibas textarea { border-color: #a3312a; border-width: 2px; }
.urlap__uzenet {
	display: flex; align-items: flex-start; gap: 0.6em;
	padding: var(--t-sm) var(--t-md); border-radius: var(--ker);
	background: var(--meleg-tomb); color: var(--cim); max-width: none;
}
.urlap__uzenet--siker { background: #e8f2ec; }
.urlap__uzenet .ikon { margin-top: 0.2em; }

/* A mézesbödön nem `display:none`: azt a fejlettebb robotok felismerik. */
.mezesbodon {
	position: absolute; left: -9999px;
	width: 1px; height: 1px; overflow: hidden;
}

@media (max-width: 48rem) {
	.kapcsolat, .tovabbi-lapok { grid-template-columns: 1fr; }
}

/* Jogi lapok és nyelvváltó a láblécben. A nyelvváltó SÜTIT NEM TESZ —
   a nyelvet kizárólag az URL hordozza (lásd inc/nyelv.php). */
.lablec__jogi {
	grid-column: 1 / -1;
	display: flex; flex-wrap: wrap; gap: var(--t-sm) var(--t-md);
	margin-top: var(--t-lg); padding-top: var(--t-sm);
	border-top: 1px solid rgb(255 255 255 / 0.14);
	font-size: var(--sz-sm);
}
.lablec__jogi a { color: rgb(255 255 255 / 0.75); }
.lablec__jogi a:hover { color: var(--feher); }
.lablec__nyelv { margin-left: auto; font-weight: 600; }

/* A homlokzat fotója a Megközelítés lapon — nem díszítés, hanem
   útbaigazítás: „ezt keresse". */
.homlokzat { margin: var(--t-lg) 0 0; max-width: 50rem; }
.homlokzat img { width: 100%; border-radius: var(--ker-nagy); display: block; }
.homlokzat figcaption {
	margin-top: var(--t-2xs);
	font-size: var(--sz-sm); color: var(--halvany);
}

/* Hibás szövegkészlet — csak a bejelentkezett szerkesztő látja. A vörös itt
   indokolt: ez nem állapot, hanem hiba, amit azonnal javítani kell. */
.hibasav {
	margin: 0; padding: var(--t-xs) var(--t-md);
	background: #a3312a; color: var(--feher);
	font-size: var(--sz-sm); text-align: center; max-width: none;
}
#wpadminbar .drbodri-hiba > .ab-item { color: #ff8a80 !important; font-weight: 700; }

/* Prototípus-jegyzet — csak a váltósávos módban létezik, élesben nem. */
.prototipus-jegyzet {
	padding: var(--t-md); border: 2px dashed var(--keret-mezo); border-radius: var(--ker-nagy);
	color: var(--torzs); max-width: 60ch;
}