/* ==========================================================================
   Komponensek — a főoldalon és az aloldalakon egyaránt használt elemek.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Virág (a Luther-rózsa szirmai) és a lebegő díszek
   -------------------------------------------------------------------------- */
.virag { width: 28px; height: 28px; flex: none; }
.dekor { position: absolute; pointer-events: none; z-index: 0; }
.lebeg { animation: psa-lebeg var(--t, 7s) ease-in-out infinite; animation-delay: var(--d, 0s); }
/* A tartalmi keret MELLETT (a margóban) ülő díszek: 1320 px alatt nincs
   margó, ott a szövegre lógnának (mérve 1200 px-en a nyitókép címére). */
@media (max-width: 1320px) { .dekor--szel { display: none; } }
/* Keskeny képernyőn a szöveg a teljes szélességet kitölti: nincs olyan hely,
   ahol a dísz ne takarna (mérve 390 px-en címsorra lógott). */
@media (max-width: 760px) { .dekor { display: none; } }
@keyframes psa-lebeg {
	0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); }
	50%      { transform: translateY(-12px) rotate(calc(var(--r, 0deg) + 14deg)); }
}

/* --------------------------------------------------------------------------
   Szekciófej: kézírásos címke + nagy cím + leírás + opcionális gomb
   -------------------------------------------------------------------------- */
.cimke {
	display: inline-flex; align-items: center; gap: 8px; margin-bottom: 6px;
	font-family: var(--betu-kezi); font-weight: 700; font-size: 27px; line-height: 1; color: var(--piros);
}
.cimke .virag { width: 22px; height: 22px; }
.szekciofej { position: relative; z-index: 1; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 34px; }
.szekciofej .szekciofej-cim { font-size: clamp(34px, 4.2vw, 50px); color: var(--sotetkek); }
.szekciofej p { color: var(--tinta-70); font-size: 17px; margin-top: 8px; max-width: 54ch; }
.szekciofej--kozep { flex-direction: column; align-items: center; text-align: center; gap: 18px; }
.szekciofej--kozep p { margin-inline: auto; }

.hullam {
	text-decoration: underline wavy var(--arany);
	text-decoration-thickness: .075em;
	text-underline-offset: .16em;
	text-decoration-skip-ink: none;
}

/* --------------------------------------------------------------------------
   Gombok — „benyomható”, vastag alsó árnyékkal
   -------------------------------------------------------------------------- */
.gomb {
	--bg: var(--kek); --fg: #fff; --sh: var(--sotetkek);
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 13px 26px 11px; border-radius: 999px; border: 0; cursor: pointer;
	background: var(--bg); color: var(--fg); text-decoration: none;
	font-family: var(--betu-cim); font-weight: 700; font-size: 18px; line-height: 1.2; text-align: center;
	box-shadow: 0 5px 0 var(--sh); transform: translateY(0);
	transition: transform .12s ease, box-shadow .12s ease;
}
.gomb:hover { color: var(--fg); transform: translateY(-2px); box-shadow: 0 7px 0 var(--sh); }
.gomb:active { transform: translateY(4px); box-shadow: 0 1px 0 var(--sh); }
.gomb svg { width: 18px; height: 18px; flex: none; }
.gomb--arany { --bg: var(--arany); --fg: var(--tinta); --sh: var(--arany-mely); }
.gomb--feher { --bg: #fff; --fg: var(--kek); --sh: var(--kek-100); }
.gomb--zold { --bg: var(--zold); --fg: #fff; --sh: var(--zold-mely); }
.gomb--korvonal { --bg: transparent; --fg: #fff; --sh: rgba(255, 255, 255, .35); border: 2.5px solid #fff; }
.gomb--kicsi { padding: 9px 18px 7px; font-size: 16px; }

/* --------------------------------------------------------------------------
   Matrica — ferdén felragasztott címke
   -------------------------------------------------------------------------- */
.matrica {
	display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px 5px;
	border-radius: 999px; border: 3px solid #fff; box-shadow: 0 4px 12px rgba(21, 32, 74, .16);
	font-family: var(--betu-cim); font-weight: 700; font-size: 14.5px; line-height: 1.2;
	background: var(--fill, var(--kek)); color: var(--on, #fff); transform: rotate(var(--r, -3deg));
}
.matrica--feher { background: #fff; color: var(--kek); border-color: var(--kek-100); }
.matrica svg { width: 16px; height: 16px; flex: none; }
.matrica .ikon-sziv { fill: currentColor; }
.matrica--kicsi { font-size: 13px; padding: 4px 11px 3px; border-width: 2px; }
.matrica--nagy { font-size: 17px; padding: 8px 18px 7px; }
.matrica--nagy svg { width: 19px; height: 19px; }
a.matrica { text-decoration: none; transition: transform .15s ease; }
a.matrica:hover { color: var(--on, #fff); transform: rotate(0deg) scale(1.05); }
a.matrica--feher:hover { color: var(--kek); }

/* --------------------------------------------------------------------------
   Hírkártya
   -------------------------------------------------------------------------- */
.hir {
	position: relative; display: flex; flex-direction: column; background: #fff; color: var(--tinta);
	border-radius: var(--r-l); padding: 10px; box-shadow: var(--arnyek); text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease;
}
.hir:hover { color: var(--tinta); transform: translateY(-6px) rotate(-.8deg); box-shadow: var(--arnyek-l); }
.hir:nth-child(even):hover { transform: translateY(-6px) rotate(.8deg); }
.hir-kep { position: relative; border-radius: 20px; overflow: hidden; aspect-ratio: 16 / 10; background: var(--h, var(--kek-50)); }
.hir-kep img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.hir:hover .hir-kep img { transform: scale(1.06); }
.hir-kep--ures { display: grid; place-items: center; }
.hir-kep--ures .virag { width: 64px; height: 64px; opacity: .55; }
.hir > .matrica { position: absolute; left: 18px; top: -15px; z-index: 2; }
/* NEM position:relative — a cím linkjének ::after-je az egész kártyát fedje le */
.hir-test { padding: 22px 14px 12px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.hir-datum { font-size: 13.5px; font-weight: 800; color: var(--c, var(--kek)); letter-spacing: .02em; }
.hir-cim { font-size: 23px; line-height: 1.12; color: var(--sotetkek); }
.hir-link { color: inherit; text-decoration: none; }
.hir-link:hover { color: inherit; }
/* a cím linkje kiterjed az egész kártyára */
.hir-link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: var(--r-l); }
.hir-link:focus-visible { outline: none; }
.hir-link:focus-visible::after { outline: 3px solid var(--arany); outline-offset: 4px; }
.hir:hover .hir-cim { text-decoration: underline; text-decoration-color: var(--arany); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.hir p { font-size: 15.5px; color: var(--tinta-70); line-height: 1.55; }
.tovabb { margin-top: auto; padding-top: 6px; font-family: var(--betu-cim); font-weight: 700; font-size: 16px; color: var(--c, var(--kek)); }
.tovabb::after { content: "→"; display: inline-block; margin-left: .35em; transition: transform .2s; }
.hir:hover .tovabb::after { transform: translateX(5px); }

.lejatszas {
	position: absolute; inset: 0; margin: auto; width: 66px; height: 66px; border-radius: 50%;
	background: var(--piros); display: grid; place-items: center; box-shadow: 0 0 0 7px rgba(255, 255, 255, .55);
}
.lejatszas svg { width: 26px; height: 26px; fill: #fff; margin-left: 4px; }

/* hírrács (archívum, kapcsolódó hírek) */
.hir-lista { display: grid; grid-template-columns: repeat(var(--oszlop, 3), 1fr); gap: 34px 24px; padding-top: 16px; }

/* --------------------------------------------------------------------------
   Programkártya
   -------------------------------------------------------------------------- */
.prog {
	position: relative; display: block; height: 100%; padding: 28px 26px 26px; border-radius: var(--r-l);
	background: #fff; color: var(--tinta); box-shadow: var(--arnyek);
	transition: transform .2s ease, box-shadow .2s ease; overflow: hidden;
	isolation: isolate; /* a sarokfolt (z-index:-1) így a tartalom mögé, de a kártya fölé kerül */
}
.prog::before {
	content: ""; position: absolute; z-index: -1; right: -44px; top: -44px; width: 150px; height: 150px; border-radius: 50%;
	background: var(--h); transition: transform .35s ease;
}
.prog-link { color: inherit; text-decoration: none; }
.prog-link:hover { color: inherit; }
.prog-link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: var(--r-l); }
.prog-link:focus-visible { outline: none; }
.prog-link:focus-visible::after { outline: 3px solid var(--arany); outline-offset: 4px; }
.prog:has(.prog-link):hover { transform: translateY(-6px) rotate(-1deg); box-shadow: var(--arnyek-l); }
.prog:has(.prog-link):hover::before { transform: scale(1.35); }
.prog:has(.prog-link):hover .prog-cim { text-decoration: underline; text-decoration-color: var(--arany); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.prog-ikon {
	width: 62px; height: 62px; border-radius: 20px; background: var(--fill); color: var(--on);
	display: grid; place-items: center; margin-bottom: 18px; transform: rotate(-6deg); box-shadow: 0 4px 0 rgba(21, 32, 74, .18);
}
.prog-ikon svg { width: 32px; height: 32px; stroke-width: 2; }
.prog-cim { font-size: 23px; line-height: 1.12; color: var(--sotetkek); margin-bottom: 9px; }
.prog p { font-size: 15.5px; color: var(--tinta-70); line-height: 1.55; }
.buborek {
	position: absolute; right: 20px; top: 24px; padding: 6px 13px 4px; border-radius: 16px 16px 16px 4px;
	background: var(--fill); color: var(--on); font-family: var(--betu-kezi); font-weight: 700; font-size: 22px; line-height: 1;
	transform: rotate(6deg);
}

/* --------------------------------------------------------------------------
   Polaroid
   -------------------------------------------------------------------------- */
.polaroid {
	position: relative; display: block; background: #fff; padding: 12px 12px 0; text-decoration: none; color: var(--tinta);
	box-shadow: 0 3px 6px rgba(21, 32, 74, .1), 0 14px 30px rgba(21, 32, 74, .12);
	transform: rotate(var(--r, -2deg)); transition: transform .25s ease, box-shadow .25s ease;
}
.polaroidok > li:nth-child(6n+1) { --r: -3deg; }   .polaroidok > li:nth-child(6n+2) { --r: 2deg; }
.polaroidok > li:nth-child(6n+3) { --r: -1.5deg; } .polaroidok > li:nth-child(6n+4) { --r: 2.5deg; }
.polaroidok > li:nth-child(6n+5) { --r: -2deg; }   .polaroidok > li:nth-child(6n+6) { --r: 1.5deg; }
a.polaroid:hover { color: var(--tinta); transform: rotate(0) scale(1.04); z-index: 3; box-shadow: var(--arnyek-l); }
.polaroid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--kek-100); }
.polaroid-felirat { display: block; padding: 10px 4px 14px; text-align: center; font-family: var(--betu-kezi); font-weight: 700; font-size: 25px; line-height: 1.1; }
.polaroid::before { /* ragasztószalag */
	content: ""; position: absolute; top: -13px; left: 50%; width: 96px; height: 28px; margin-left: -48px; z-index: 1;
	background: var(--szalag, rgba(223, 205, 104, .78)); transform: rotate(calc(var(--r, 0deg) * -2 - 3deg));
	box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}
.polaroidok > li:nth-child(4n+2) { --szalag: rgba(33, 102, 207, .5); }
.polaroidok > li:nth-child(4n+3) { --szalag: rgba(188, 30, 26, .45); }
.polaroidok > li:nth-child(4n+4) { --szalag: rgba(35, 113, 42, .45); }

/* --------------------------------------------------------------------------
   Füzet (hetirend)
   -------------------------------------------------------------------------- */
.naplo { position: relative; background: #fff; border-radius: var(--r-l); box-shadow: var(--arnyek-l); padding-top: 28px; }
.naplo::before { /* spirálkötés */
	content: ""; position: absolute; top: -12px; left: 30px; right: 30px; height: 26px;
	background: radial-gradient(circle at 12px 13px, transparent 6px, var(--sotetkek) 6.5px, var(--sotetkek) 9px, transparent 9.5px) 0 0 / 34px 26px repeat-x;
}
.naplo-fej { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; padding: 6px 28px 14px; }
.naplo-fej .naplo-cim { font-size: 26px; color: var(--sotetkek); }
.naplo-fej span { font-family: var(--betu-kezi); font-size: 24px; font-weight: 700; color: var(--piros); }
.napok { padding: 6px 28px 26px; list-style: none; }
.nap { display: grid; grid-template-columns: 124px 1fr; gap: 16px; align-items: start; padding: 12px 0; }
.nap + .nap { border-top: 2px dashed var(--kek-100); }
.nap-nev {
	display: inline-flex; align-items: center; gap: 8px; justify-self: start;
	padding: 4px 13px 3px; border-radius: 999px; background: var(--fill); color: var(--on);
	font-family: var(--betu-cim); font-weight: 700; font-size: 15.5px; white-space: nowrap;
}
.nap-nev small { font-family: var(--betu-szoveg); font-weight: 700; font-size: 12.5px; opacity: .9; }
.nap-esemenyek { list-style: none; display: grid; gap: 4px; padding-top: 3px; }
.nap-esemenyek li { font-size: 16px; font-weight: 600; line-height: 1.45; }
.nap-esemenyek b { font-weight: 800; }
.nap-esemenyek a { color: inherit; }
.nap-esemenyek .ido { color: var(--tinta-70); font-weight: 700; }
/* nem dőlt: egyetlen dőlt sor miatt külön 41 KB-os betűfájl töltődne le */
.nap-ures { color: var(--tinta-70); font-weight: 600; padding-top: 3px; }
.nap--ma { background: var(--arany-50); margin-inline: -14px; padding-inline: 14px; border-radius: 16px; }
.nap--ma + .nap { border-top-color: transparent; }
.ma-jel { font-family: var(--betu-kezi); font-weight: 700; font-size: 22px; color: var(--piros); margin-left: 6px; font-style: normal; }
.naplo-lab { padding: 0 28px 26px; }

/* --------------------------------------------------------------------------
   Hetirend oldal: heti lapozó, „Hamarosan” lista
   -------------------------------------------------------------------------- */
.hetirend-sav { background: var(--zold-50); padding-block: 12px clamp(48px, 6vw, 80px); }
.het-lapozo { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px 20px; margin-bottom: 40px; }
.het-lapozo__elozo { justify-self: start; }
.het-lapozo__kov { justify-self: end; }
.het-lapozo__elozo svg { transform: rotate(180deg); }
.het-lapozo__vissza { justify-self: center; font-weight: 800; font-size: 15.5px; }

.hamarosan { padding-block: clamp(48px, 6vw, 80px) 0; }
.esemeny-lista { list-style: none; display: grid; gap: 14px; max-width: 860px; }
.esemeny-sor {
	display: grid; grid-template-columns: 68px 1fr; gap: 18px; align-items: center;
	background: #fff; border-radius: var(--r-m); padding: 12px 20px 12px 12px; box-shadow: var(--arnyek);
}
.esemeny-sor__datum {
	display: flex; flex-direction: column; align-items: center; justify-content: center; width: 68px; height: 68px;
	border-radius: 18px; background: var(--fill); color: var(--on); font-family: var(--betu-cim); line-height: 1;
}
.esemeny-sor__datum b { font-size: 28px; font-weight: 800; }
.esemeny-sor__datum span { font-size: 13.5px; font-weight: 700; margin-top: 2px; }
.esemeny-sor__cim { font-size: 20px; line-height: 1.15; color: var(--sotetkek); }
.esemeny-sor__cim a { color: inherit; }
.esemeny-sor__reszlet { margin-top: 3px; font-size: 14.5px; font-weight: 700; color: var(--tinta-70); }
.hetirend-tartalom { padding-block: clamp(40px, 5vw, 64px) 0; }
.hetirend-tartalom .tartalom { margin-inline: 0; }
/* a zöld sáv közvetlenül a fejléc hulláma alatt kezdődik */
.fotartalom.hetirend { padding-top: 0; }

/* --------------------------------------------------------------------------
   Kapcsolatfelvételi űrlap ([psa_kapcsolat] és az Elementor-widget)
   -------------------------------------------------------------------------- */
.urlap-doboz { max-width: 760px; background: #fff; border-radius: var(--r-l); box-shadow: var(--arnyek); padding: clamp(22px, 4vw, 40px); margin-block: 24px; }
.psa-w .urlap-doboz { margin-block: 0; }
.urlap { display: grid; gap: 18px; }
.urlap-sor { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.urlap-mezo { display: grid; gap: 6px; margin: 0; }
.urlap-mezo label { font-family: var(--betu-cim); font-weight: 700; font-size: 17px; line-height: 1.3; color: var(--sotetkek); }
.kotelezo { color: var(--piros); }
.urlap input[type="text"], .urlap input[type="email"], .urlap textarea {
	width: 100%; font: inherit; font-size: 17px; line-height: 1.5; color: var(--tinta); background: var(--papir);
	border: 2.5px solid var(--kek-100); border-radius: 16px; padding: 11px 16px; transition: border-color .15s, box-shadow .15s;
}
.urlap textarea { resize: vertical; min-height: 170px; }
.urlap input:focus, .urlap textarea:focus { outline: none; border-color: var(--kek); box-shadow: 0 0 0 4px var(--kek-100); background: #fff; }
.urlap [aria-invalid="true"] { border-color: var(--piros); }
.urlap-hiba { color: var(--piros); font-weight: 700; font-size: 14.5px; }
.urlap-mezo--jelolo { grid-template-columns: auto 1fr; align-items: start; gap: 4px 12px; }
.urlap-mezo--jelolo input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--kek); }
.urlap-mezo--jelolo label { font-family: var(--betu-szoveg); font-weight: 600; font-size: 15.5px; line-height: 1.5; color: var(--tinta); }
.urlap-mezo--jelolo label a { text-decoration: underline; }
.urlap-mezo--jelolo .urlap-hiba { grid-column: 2; }
.urlap-kuldes { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 4px 0 0; }
.urlap-labjegyzet { font-size: 14px; color: var(--tinta-70); }
.urlap-mezesbodon { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.urlap-uzenet { display: flex; gap: 14px; align-items: flex-start; padding: 16px 20px; border-radius: var(--r-m); margin-bottom: 18px; font-weight: 600; color: var(--tinta); }
.urlap-uzenet > svg { width: 28px; height: 28px; flex: none; }
.urlap-uzenet strong { display: block; font-family: var(--betu-cim); font-size: 21px; line-height: 1.2; color: var(--sotetkek); }
.urlap-uzenet p { margin: 6px 0 0; }
.urlap-uzenet--siker { background: var(--zold-50); }
.urlap-uzenet--siker > svg { color: var(--piros); fill: currentColor; }
.urlap-uzenet--hiba { background: var(--piros-50); }
.urlap-uzenet--hiba > svg { color: var(--piros); }

/* A füzet, mellette a kiemelt esemény (főoldal, hetirend-oldal, widget) */
.het-racs { display: grid; grid-template-columns: 1.2fr .8fr; gap: 34px; align-items: start; }
.het-racs--egy { grid-template-columns: 1fr; max-width: 860px; }

/* --------------------------------------------------------------------------
   Kiemelt esemény kártya
   -------------------------------------------------------------------------- */
.esemeny-kartya {
	position: relative; background: var(--arany); color: var(--tinta); border-radius: var(--r-l);
	padding: 30px 28px 28px; box-shadow: var(--arnyek-l); transform: rotate(1.5deg); overflow: hidden;
}
.esemeny-kartya::after { /* célszalag-csík */
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 12px;
	background: repeating-linear-gradient(90deg, var(--tinta) 0 12px, #fff 12px 24px); opacity: .9;
}
.esemeny-kartya .matrica { --r: -4deg; margin-bottom: 14px; }
.esemeny-kartya h3 { font-size: clamp(30px, 3vw, 38px); line-height: 1; color: var(--sotetkek); padding-right: 92px; }
.esemeny-kartya h3 a { color: inherit; text-decoration: none; }
.esemeny-kartya h3 a:hover { text-decoration: underline; }
.esemeny-alcim { margin-top: 6px; font-weight: 800; font-size: 15.5px; }
.esemeny-rajz { position: absolute; right: 14px; top: 18px; width: 92px; height: 92px; color: var(--sotetkek); opacity: .9; transform: rotate(-6deg); }
.esemeny-rajz svg { width: 100%; height: 100%; stroke-width: 1.7; }
.menetrend { margin-top: 18px; display: grid; gap: 4px; list-style: none; }
.menetrend li { display: grid; grid-template-columns: 62px 1fr; gap: 10px; font-size: 15.5px; font-weight: 700; line-height: 1.35; padding: 5px 0; border-bottom: 2px dotted rgba(21, 32, 74, .18); }
.menetrend time {
	align-self: start; justify-self: start; padding: 1px 7px 0; border-radius: 8px;
	background: var(--piros); color: #fff; font-family: var(--betu-cim); font-weight: 800; font-size: 14.5px;
}
.esemeny-megj { margin-top: 14px; margin-bottom: 12px; font-size: 14.5px; font-weight: 700; }
.esemeny-megj b, .esemeny-megj strong { background: #fff; padding: 1px 7px; border-radius: 6px; }

/* --------------------------------------------------------------------------
   Számozott lépések (beiskolázás)
   -------------------------------------------------------------------------- */
.lepesek { display: grid; gap: 16px; counter-reset: lepes; list-style: none; }
.lepes {
	position: relative; display: grid; grid-template-columns: 52px 1fr; gap: 14px; align-items: center;
	background: #fff; color: var(--tinta); border-radius: var(--r-m); padding: 16px 18px;
	box-shadow: 0 5px 0 rgba(0, 0, 0, .14); transform: rotate(var(--r, 0deg));
}
.lepes:nth-child(3n+1) { --r: -1.5deg; --kor: var(--arany); }
.lepes:nth-child(3n+2) { --r: 1deg; margin-left: 22px; --kor: var(--kek-100); }
.lepes:nth-child(3n+3) { --r: -.8deg; --kor: var(--piros-50); }
.lepes::before {
	counter-increment: lepes; content: counter(lepes);
	width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center;
	background: var(--kor); color: var(--tinta); font-family: var(--betu-cim); font-weight: 800; font-size: 26px;
}
.lepes b { display: block; font-family: var(--betu-cim); font-weight: 800; font-size: 19px; line-height: 1.15; color: var(--sotetkek); }
.lepes span { display: block; font-size: 14.5px; font-weight: 600; color: var(--tinta-70); line-height: 1.4; margin-top: 2px; }

/* --------------------------------------------------------------------------
   Jegy (adószám)
   -------------------------------------------------------------------------- */
.jegy {
	position: relative; background: var(--piros); color: #fff; border-radius: 16px; padding: 14px 26px; text-align: center;
	-webkit-mask: radial-gradient(circle at 0 50%, transparent 11px, #000 11.5px) left / 51% 100% no-repeat,
	              radial-gradient(circle at 100% 50%, transparent 11px, #000 11.5px) right / 51% 100% no-repeat;
	        mask: radial-gradient(circle at 0 50%, transparent 11px, #000 11.5px) left / 51% 100% no-repeat,
	              radial-gradient(circle at 100% 50%, transparent 11px, #000 11.5px) right / 51% 100% no-repeat;
}
.jegy small { display: block; font-family: var(--betu-kezi); font-size: 21px; font-weight: 700; color: var(--arany); line-height: 1; }
.jegy b { display: block; font-family: var(--betu-cim); font-weight: 800; font-size: 25px; letter-spacing: .02em; margin-top: 2px; }

/* --------------------------------------------------------------------------
   Szöveges tartalom (oldalak, bejegyzések)
   -------------------------------------------------------------------------- */
.tartalom { max-width: var(--hasab); margin-inline: auto; font-size: 18px; line-height: 1.7; }
.tartalom > * + * { margin-top: 1.1em; }
.tartalom h2 { font-size: clamp(28px, 3vw, 36px); margin-top: 1.6em; }
.tartalom h3 { font-size: clamp(23px, 2.4vw, 28px); margin-top: 1.4em; }
.tartalom h4 { font-size: 21px; margin-top: 1.3em; }
.tartalom h2 + *, .tartalom h3 + *, .tartalom h4 + * { margin-top: .6em; }
.tartalom ul, .tartalom ol { padding-left: 1.4em; }
.tartalom li + li { margin-top: .35em; }
.tartalom ul li::marker { color: var(--piros); }
.tartalom ol li::marker { color: var(--kek); font-family: var(--betu-cim); font-weight: 800; }
.tartalom a { font-weight: 700; overflow-wrap: anywhere; } /* a hosszú nyers URL (pl. Google Drive-link) se lógjon ki mobilon */
.tartalom :is(p, li, dd, figcaption) { overflow-wrap: break-word; }
.tartalom img { border-radius: var(--r-m); }
.tartalom blockquote {
	margin-inline: 0; padding: 18px 24px; background: var(--kek-50); border-radius: var(--r-m);
	border-left: 6px solid var(--kek); font-family: var(--betu-cim); font-weight: 700; font-size: 21px; line-height: 1.4; color: var(--sotetkek);
}
.tartalom blockquote cite { display: block; margin-top: 8px; font-family: var(--betu-kezi); font-size: 22px; color: var(--piros); font-style: normal; }
.tartalom table { width: 100%; border-collapse: collapse; font-size: 16px; }
.tartalom th, .tartalom td { padding: 10px 12px; border-bottom: 2px solid var(--kek-50); text-align: left; vertical-align: top; }
.tartalom th { font-family: var(--betu-cim); color: var(--sotetkek); }
.tartalom hr { border: 0; height: 12px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 12'%3E%3Cpath d='M0 6 Q7.5 0 15 6 T30 6 T45 6 T60 6' fill='none' stroke='%23DFCD68' stroke-width='3'/%3E%3C/svg%3E") center / 60px 12px repeat-x; }
.tartalom .wp-block-button__link, .tartalom .wp-element-button {
	border-radius: 999px; background: var(--kek); color: #fff; font-family: var(--betu-cim); font-weight: 700;
	box-shadow: 0 5px 0 var(--sotetkek); padding: 12px 24px 10px; text-decoration: none;
}
.tartalom .alignwide { max-width: min(1100px, 92vw); margin-inline: calc(50% - min(550px, 46vw)); }
.tartalom .alignfull { max-width: 100vw; margin-inline: calc(50% - 50vw); }
.tartalom iframe, .tartalom embed, .tartalom video { max-width: 100%; }
.tartalom .wp-block-embed iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border-radius: var(--r-m); }
.tartalom::after { content: ""; display: table; clear: both; }

/* --------------------------------------------------------------------------
   Dokumentumlinkek (inc/dokumentumok.php): típusjelölés a szöveg után;
   az egyetlen dokumentumlinkből álló listaelem letöltőkártya lesz —
   CSS :has()-szal, a tartalom HTML-jéhez nem nyúlunk. Ahol a :has() nem
   támogatott, a link egyszerűen a szövegközi formáját kapja.
   Kontraszt (típusjelölés): PDF 5,53 · DOC 4,90 · XLS 5,38 · PPT 5,43 · ZIP 8,85 :1
   -------------------------------------------------------------------------- */
.dokumentum-link { --dok-c: var(--kek); --dok-h: var(--kek-50); }
.dokumentum-link--pdf { --dok-c: var(--piros); --dok-h: var(--piros-50); }
.dokumentum-link--xls { --dok-c: var(--zold); --dok-h: var(--zold-50); }
.dokumentum-link--ppt { --dok-c: var(--arany-szoveg); --dok-h: var(--arany-50); }
.dokumentum-link--zip { --dok-c: var(--sotetkek); --dok-h: var(--kek-100); }
.dokumentum-link__tipus {
	display: inline-block; margin-left: .5em; padding: 1px 9px 0; border-radius: 999px;
	background: var(--dok-h); color: var(--dok-c); text-decoration: none; white-space: nowrap; vertical-align: .12em;
	font-family: var(--betu-cim); font-weight: 700; font-size: 13px; line-height: 1.6; letter-spacing: .03em;
}
.tartalom :is(ul, ol):has(> li > .dokumentum-link:only-child) { padding-left: 0; list-style: none; display: grid; gap: 12px; }
.tartalom li:has(> .dokumentum-link:only-child) { list-style: none; margin-top: 0; }
.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link {
	display: flex; align-items: center; gap: 14px; padding: 12px 18px 12px 12px;
	background: #fff; border-radius: var(--r-m); box-shadow: var(--arnyek); color: var(--sotetkek); text-decoration: none;
	font-family: var(--betu-cim); font-size: 17.5px; line-height: 1.3; transition: transform .15s ease, box-shadow .15s ease;
}
.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link:hover { color: var(--sotetkek); transform: translateY(-2px) rotate(-.4deg); box-shadow: var(--arnyek-l); }
.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link::before { /* színes csempe, fehér dokumentumikon */
	content: ""; flex: none; width: 44px; height: 44px; border-radius: 14px;
	background: var(--dok-c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8l-5-5Z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h4'/%3E%3C/svg%3E") center / 22px no-repeat;
}
.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link .dokumentum-link__tipus { margin-left: auto; }

/* A kiemelt kép sosem nagyobb a saját méreténél; az álló (plakát) kép
   magassága korlátozott, és teljes méretben megnyitható (psa_kiemelt_kep()). */
.kiemelt-kep { max-width: 980px; margin: 0 auto 38px; }
.kiemelt-kep img { display: block; width: var(--kep-szel, 100%); max-width: 100%; margin-inline: auto; border-radius: var(--r-l); box-shadow: var(--arnyek-l); border: 8px solid #fff; }
.kiemelt-kep-nagyit { position: relative; display: block; width: fit-content; max-width: 100%; margin-inline: auto; border-radius: var(--r-l); cursor: zoom-in; }
.kiemelt-kep-jel {
	position: absolute; right: 18px; bottom: 18px; width: 44px; height: 44px; border-radius: 50%;
	display: grid; place-items: center; background: #fff; color: var(--kek); box-shadow: var(--arnyek);
	transition: transform .15s ease;
}
.kiemelt-kep-jel svg { width: 21px; height: 21px; stroke-width: 2.4; }
.kiemelt-kep-nagyit:hover .kiemelt-kep-jel, .kiemelt-kep-nagyit:focus-visible .kiemelt-kep-jel { transform: scale(1.1) rotate(-8deg); }

.cimkek { max-width: var(--hasab); margin: 32px auto 0; display: flex; flex-wrap: wrap; gap: 8px; list-style: none; }
.cimkek a { display: inline-block; padding: 4px 14px; border-radius: 999px; background: var(--kek-50); font-weight: 800; font-size: 14px; text-decoration: none; }

/* --------------------------------------------------------------------------
   Aloldal-csempék (ha az oldalnak vannak gyerekoldalai)
   -------------------------------------------------------------------------- */
.aloldalak { max-width: 980px; margin: 48px auto 0; }
.aloldalak h2 { font-size: 26px; margin-bottom: 16px; }
.aloldal-racs { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; list-style: none; }
.aloldal-racs a {
	display: flex; align-items: center; gap: 12px; height: 100%; padding: 16px 18px; border-radius: var(--r-m);
	background: #fff; box-shadow: var(--arnyek); border-bottom: 5px solid var(--fill);
	font-family: var(--betu-cim); font-weight: 700; font-size: 18px; line-height: 1.2; color: var(--tinta); text-decoration: none;
	transition: transform .18s ease;
}
.aloldal-racs a:hover { transform: translateY(-4px) rotate(-1deg); color: var(--c); }
.aloldal-racs .virag { width: 24px; height: 24px; }

/* --------------------------------------------------------------------------
   Bejegyzés-navigáció és lapozó
   -------------------------------------------------------------------------- */
.bejegyzes-nav { max-width: var(--hasab); margin: 44px auto 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bejegyzes-nav a {
	display: block; height: 100%; padding: 14px 18px; border-radius: var(--r-m); background: var(--kek-50);
	text-decoration: none; color: var(--tinta); font-family: var(--betu-cim); font-weight: 700; line-height: 1.25;
}
.bejegyzes-nav a:hover { background: var(--kek-100); }
.bejegyzes-nav small { display: block; font-family: var(--betu-kezi); font-size: 20px; color: var(--piros); }
.bejegyzes-nav .kovetkezo { text-align: right; }

.lapozo { margin-top: 48px; }
.lapozo .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.lapozo .page-numbers {
	min-width: 46px; height: 46px; padding: 0 14px; border-radius: 999px; display: inline-grid; place-items: center;
	background: #fff; box-shadow: 0 3px 0 var(--kek-100); color: var(--tinta); text-decoration: none;
	font-family: var(--betu-cim); font-weight: 800; font-size: 17px;
}
.lapozo .page-numbers.current { background: var(--kek); color: #fff; box-shadow: 0 3px 0 var(--sotetkek); }
.lapozo a.page-numbers:hover { background: var(--kek-50); }
.lapozo .dots { background: transparent; box-shadow: none; }

/* kategóriaszűrő pirulák az archívum tetején */
.szuro { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; list-style: none; }
.szuro a {
	display: inline-block; padding: 7px 16px 6px; border-radius: 999px; background: #fff; border: 2.5px solid var(--h);
	font-weight: 800; font-size: 15px; color: var(--c); text-decoration: none;
}
.szuro a:hover, .szuro .aktiv a { background: var(--fill); border-color: var(--fill); color: var(--on); }

/* --------------------------------------------------------------------------
   Keresési találat, üres állapot, 404
   -------------------------------------------------------------------------- */
.talalatok { max-width: 860px; margin-inline: auto; display: grid; gap: 16px; list-style: none; }
.talalat { background: #fff; border-radius: var(--r-m); padding: 20px 24px; box-shadow: var(--arnyek); }
.talalat-tipus { font-family: var(--betu-kezi); font-weight: 700; font-size: 20px; color: var(--piros); }
.talalat h2 { font-size: 23px; margin: 2px 0 6px; }
.talalat h2 a { color: var(--sotetkek); text-decoration: none; }
.talalat h2 a:hover { color: var(--kek); text-decoration: underline; }
.talalat p { color: var(--tinta-70); font-size: 16px; }

.ures-allapot { max-width: 640px; margin-inline: auto; text-align: center; display: grid; gap: 18px; justify-items: center; }
.ures-allapot .virag { width: 72px; height: 72px; }
.ures-allapot .keresourlap { width: 100%; }

/* --------------------------------------------------------------------------
   Hozzászólások (az iskolai oldal alapból zárja őket, de legyen rendes kinézetük)
   -------------------------------------------------------------------------- */
.hozzaszolasok { max-width: var(--hasab); margin: 56px auto 0; }
.hozzaszolasok h2 { font-size: 26px; margin-bottom: 16px; }
.comment-list { list-style: none; display: grid; gap: 14px; }
.comment-list .children { list-style: none; margin: 14px 0 0 24px; display: grid; gap: 14px; }
.comment-body { background: #fff; border-radius: var(--r-m); padding: 16px 20px; box-shadow: var(--arnyek); }
.comment-meta { font-size: 14px; color: var(--tinta-70); margin-bottom: 6px; }
.comment-author .fn { font-weight: 800; color: var(--tinta); }
.comment-form { display: grid; gap: 14px; }
.comment-form .submit {
	justify-self: start; border: 0; border-radius: 999px; padding: 12px 24px 10px; background: var(--kek); color: #fff;
	font-family: var(--betu-cim); font-weight: 700; font-size: 17px; box-shadow: 0 5px 0 var(--sotetkek);
}

/* Oldalszintű tipográfia — az ablakszélességre */
@media (max-width: 760px) {
	.cimke { font-size: 24px; }
	.tartalom { font-size: 17px; }
	.bejegyzes-nav { grid-template-columns: 1fr; }
	.bejegyzes-nav .kovetkezo { text-align: left; }
	.het-lapozo { grid-template-columns: 1fr 1fr; }
	.het-lapozo__vissza { grid-column: 1 / -1; grid-row: 1; }
	.het-lapozo .gomb { justify-self: stretch; }
	.het-lapozo__hely { display: none; }
	/* A „rögzített oszlopszélességű” táblázat (a régi Tantestület-oldalé is)
	   mobilon három egyforma, keskeny oszlopra esett, és a WordPress a szavak
	   közepén törte („közművelődé-s”, „Bache-sz”). Itt a tartalomhoz igazodó
	   oszlopok kellenek, szóközepi törés nélkül (a Chrome táblázatcellában a
	   break-word-del is a szó közepén törne); ami így sem fér el, a táblázat
	   dobozában vízszintesen görgethető. */
	.tartalom .wp-block-table .has-fixed-layout { table-layout: auto; }
	.tartalom .wp-block-table table :is(td, th) { word-break: normal; overflow-wrap: normal; padding: 8px 9px; }
	.tartalom table { font-size: 15px; }
}

/* Komponensek — a saját dobozuk szélességére (lásd front.css fejléce) */
@container (max-width: 1036px) {
	.hir-lista { grid-template-columns: repeat(2, 1fr); }
	.esemeny-kartya { transform: rotate(.8deg); }
	.het-racs { grid-template-columns: 1fr; }
}
@container (max-width: 560px) {
	.urlap-sor { grid-template-columns: 1fr; }
	.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link { flex-wrap: wrap; font-size: 16.5px; }
	.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link .dokumentum-link__tipus { margin-left: 58px; }
}
@container (max-width: 700px) {
	.szekciofej { flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 26px; }
	.szekciofej--kozep { align-items: center; }
	.hir-lista { grid-template-columns: 1fr; gap: 30px; }
	.nap { grid-template-columns: 1fr; gap: 6px; }
	.nap--ma { margin-inline: -8px; padding-inline: 8px; }
	.naplo-fej, .napok, .naplo-lab { padding-inline: 18px; }
	.esemeny-kartya { padding: 26px 20px; transform: none; }
	.esemeny-kartya h3 { padding-right: 70px; }
	.esemeny-rajz { width: 66px; height: 66px; }
	.menetrend li { font-size: 14.5px; grid-template-columns: 56px 1fr; }
	.lepes:nth-child(3n+2) { margin-left: 0; }
	.polaroid { padding: 8px 8px 0; }
	.polaroid-felirat { font-size: 20px; padding: 8px 2px 10px; }
	.polaroid::before { width: 64px; margin-left: -32px; height: 22px; top: -10px; }
}

/* === TARTALÉK: konténerlekérdezés nélkül (generált, lásd lent) === */
/* A Safari 15 és a régebbi böngészők (iOS 15-ön ragadt iPhone 6s/7, iPad Air 2,
   iPad mini 4) nem ismerik a @container lekérdezést: nélküle a komponensek
   mobilon is asztali elrendezésben maradnának. Nekik ugyanezek a szabályok az
   ABLAK szélességéhez kötve (1036 px-es keret ≈ 1100 px-es ablak, 700 ≈ 760,
   560 ≈ 620). A fenti @container blokkok betűre egyező másolata: ha azokat
   módosítod, ezt is ugyanúgy frissíteni kell. */
@supports not (container-type: inline-size) {
	@media (max-width: 1100px) {
		.hir-lista { grid-template-columns: repeat(2, 1fr); }
		.esemeny-kartya { transform: rotate(.8deg); }
		.het-racs { grid-template-columns: 1fr; }
	}
	@media (max-width: 620px) {
		.urlap-sor { grid-template-columns: 1fr; }
		.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link { flex-wrap: wrap; font-size: 16.5px; }
		.tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link .dokumentum-link__tipus { margin-left: 58px; }
	}
	@media (max-width: 760px) {
		.szekciofej { flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 26px; }
		.szekciofej--kozep { align-items: center; }
		.hir-lista { grid-template-columns: 1fr; gap: 30px; }
		.nap { grid-template-columns: 1fr; gap: 6px; }
		.nap--ma { margin-inline: -8px; padding-inline: 8px; }
		.naplo-fej, .napok, .naplo-lab { padding-inline: 18px; }
		.esemeny-kartya { padding: 26px 20px; transform: none; }
		.esemeny-kartya h3 { padding-right: 70px; }
		.esemeny-rajz { width: 66px; height: 66px; }
		.menetrend li { font-size: 14.5px; grid-template-columns: 56px 1fr; }
		.lepes:nth-child(3n+2) { margin-left: 0; }
		.polaroid { padding: 8px 8px 0; }
		.polaroid-felirat { font-size: 20px; padding: 8px 2px 10px; }
		.polaroid::before { width: 64px; margin-left: -32px; height: 22px; top: -10px; }
	}

	/* Ugyanezek a DOBOZ valódi szélességéhez kötve: a psa-kt-* osztályt a
	   kontener.js teszi a konténerekre (keskeny Elementor-hasáb is). A :where()
	   miatt a fajlagosság ugyanaz, mint a @container szabályoké, a sorrend pedig
	   azonos — így a végeredmény is. :where() nélküli böngésző (Safari 13) ezt a
	   részt kihagyja, neki a fenti ablakszélességes változat marad. */
	/* @container (max-width: 1036px) */
		:where(.psa-kt-1036) .hir-lista { grid-template-columns: repeat(2, 1fr); }
		:where(.psa-kt-1036) .esemeny-kartya { transform: rotate(.8deg); }
		:where(.psa-kt-1036) .het-racs { grid-template-columns: 1fr; }
	/* @container (max-width: 560px) */
		:where(.psa-kt-560) .urlap-sor { grid-template-columns: 1fr; }
		:where(.psa-kt-560) .tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link { flex-wrap: wrap; font-size: 16.5px; }
		:where(.psa-kt-560) .tartalom li:has(> .dokumentum-link:only-child) > .dokumentum-link .dokumentum-link__tipus { margin-left: 58px; }
	/* @container (max-width: 700px) */
		:where(.psa-kt-700) .szekciofej { flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 26px; }
		:where(.psa-kt-700) .szekciofej--kozep { align-items: center; }
		:where(.psa-kt-700) .hir-lista { grid-template-columns: 1fr; gap: 30px; }
		:where(.psa-kt-700) .nap { grid-template-columns: 1fr; gap: 6px; }
		:where(.psa-kt-700) .nap--ma { margin-inline: -8px; padding-inline: 8px; }
		:where(.psa-kt-700) .naplo-fej, :where(.psa-kt-700) .napok, :where(.psa-kt-700) .naplo-lab { padding-inline: 18px; }
		:where(.psa-kt-700) .esemeny-kartya { padding: 26px 20px; transform: none; }
		:where(.psa-kt-700) .esemeny-kartya h3 { padding-right: 70px; }
		:where(.psa-kt-700) .esemeny-rajz { width: 66px; height: 66px; }
		:where(.psa-kt-700) .menetrend li { font-size: 14.5px; grid-template-columns: 56px 1fr; }
		:where(.psa-kt-700) .lepes:nth-child(3n+2) { margin-left: 0; }
		:where(.psa-kt-700) .polaroid { padding: 8px 8px 0; }
		:where(.psa-kt-700) .polaroid-felirat { font-size: 20px; padding: 8px 2px 10px; }
		:where(.psa-kt-700) .polaroid::before { width: 64px; margin-left: -32px; height: 22px; top: -10px; }
}