/* Árnyék-AI lelet. One typeface family, hairline rules, no cards.
   The only ornament is the shadow bar, which is the finding itself. */

:root {
	--ink: #14161a;
	--halvany: #5d6470;
	--vonal: #d7dae0;
	--lap: #ffffff;
	--jelzo: #b4361f;      /* the shadow, the thing the leader does not know about */
	--rendben: #1f5c46;
	--sav: 2.4rem;
}

* { box-sizing: border-box; }

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

body {
	margin: 0;
	background: var(--lap);
	color: var(--ink);
	font-family: "Archivo", ui-sans-serif, system-ui, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 17px;
	line-height: 1.55;
	font-variant-numeric: tabular-nums;
}

main {
	max-width: 62rem;
	margin: 0 auto;
	padding: 1.6rem 1.1rem 4rem;
}

h1 {
	font-size: clamp(1.7rem, 6vw, 2.6rem);
	line-height: 1.12;
	letter-spacing: -0.02em;
	font-weight: 700;
	margin: 0.2rem 0 0.9rem;
}

h2 {
	font-size: 1.02rem;
	letter-spacing: 0.01em;
	font-weight: 700;
	margin: 0 0 0.7rem;
	padding-bottom: 0.35rem;
	border-bottom: 2px solid var(--ink);
}

p { margin: 0 0 0.8rem; }

a { color: var(--ink); }

.uzem {
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--halvany);
	margin: 0 0 0.5rem;
	/* 2026-08-14 (Kai): korabban csak a fejlec-fo hordozta a logot, flex nelkul
	   a sima .fejlec-es lapokon a kep meg a szoveg egymas alatt torodott volna.
	   Additiv: a mar meglevo .fejlec-fo .uzem szabaly ugyanezt mondja, itt csak
	   altalanos lett, hogy minden lap fejlece hordozhassa a logot. */
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.uzem span {
	border-left: 1px solid var(--vonal);
	padding-left: 0.7rem;
	letter-spacing: 0.04em;
}

.halvany { color: var(--halvany); }

.fejlec {
	border-bottom: 3px solid var(--ink);
	padding-bottom: 1.1rem;
	margin-bottom: 1.6rem;
}

.bevezeto { max-width: 40rem; color: var(--halvany); }

.blokk { margin: 0 0 2.2rem; }

/* --- forms --- */

.urlap label {
	display: block;
	font-weight: 600;
	margin: 0 0 1rem;
}

.urlap input[type="text"],
.urlap input[type="number"],
.urlap input[type="email"] {
	display: block;
	width: 100%;
	margin-top: 0.35rem;
	padding: 0.65rem 0.7rem;
	font: inherit;
	color: inherit;
	background: var(--lap);
	border: 1px solid var(--vonal);
	border-bottom-width: 2px;
	border-radius: 0;
}

.urlap input:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }

button {
	font: inherit;
	font-weight: 700;
	color: var(--lap);
	background: var(--ink);
	border: 0;
	border-radius: 0;
	padding: 0.75rem 1.5rem;
	cursor: pointer;
	min-height: 2.9rem;
}

button:hover { background: #000; }

.soros { margin-top: 1.2rem; }

.kerdoiv { counter-reset: kerdes; }

.kerdes {
	border: 0;
	border-top: 1px solid var(--vonal);
	margin: 0 0 1.4rem;
	padding: 1rem 0 0;
	/* A hidden fieldset generates no box, so it does not take a number either:
	   the visible questions stay 1, 2, 3 without a gap. */
	counter-increment: kerdes;
}

.kerdes legend {
	font-weight: 700;
	padding: 0;
	margin-bottom: 0.5rem;
}

.kerdes legend::before {
	content: counter(kerdes) ".";
	display: inline-block;
	min-width: 1.6rem;
	color: var(--halvany);
	font-weight: 600;
}

.segito { font-size: 0.9rem; color: var(--halvany); margin: -0.2rem 0 0.7rem; }

.urlap label.opcio {
	display: flex;
	gap: 0.6rem;
	align-items: flex-start;
	font-weight: 400;
	margin: 0 0 0.45rem;
	padding: 0.35rem 0;
	cursor: pointer;
}

.opcio input { margin-top: 0.35rem; width: 1.05rem; height: 1.05rem; flex: none; }

/* Selector has to out-weigh .urlap input[type="text"] above, otherwise the
   indented field is 100% wide and pushes the page sideways on a phone. */
.urlap input.szabad { display: block; width: calc(100% - 1.65rem); margin: 0.2rem 0 0.7rem 1.65rem; max-width: 22rem;
	padding: 0.5rem; font: inherit; border: 1px solid var(--vonal); border-radius: 0; }

.hiba {
	border-left: 4px solid var(--jelzo);
	background: #fdf3f1;
	padding: 0.7rem 0.9rem;
	margin: 0 0 1.2rem;
	font-weight: 600;
}

/* Nevtelenseg-doboz (2026-08-14, Kai, Zoltan TG 25003/25012). Ugyanaz a
   hairline-bal-sav nyelvtan, mint a .hiba-e, csak --rendben zoldben: ez nem
   figyelmeztetes, hanem igeret. Csak a csapatos agon jelenik meg, a kerdoiv
   tetejen plusz a bekuldes gomb folott, szo szerint ugyanazzal a harom
   mondattal -- l. nevtelensegDoboz() a html.js-ben. */
.doboz-nevtelenseg {
	border: 1px solid var(--rendben);
	border-left: 4px solid var(--rendben);
	background: #eef6f2;
	padding: 0.85rem 1rem;
	margin: 1rem 0 1.4rem;
}

.doboz-cim {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 700;
	color: var(--rendben);
	font-size: 0.92rem;
	letter-spacing: 0.02em;
	margin: 0 0 0.5rem;
}

.doboz-ikon { flex: none; color: var(--rendben); }

.doboz-lista { list-style: none; margin: 0; padding: 0; }

.doboz-lista li {
	position: relative;
	padding-left: 1.15rem;
	margin-bottom: 0.35rem;
	font-size: 0.92rem;
	color: var(--ink);
}

.doboz-lista li:last-child { margin-bottom: 0; }

.doboz-lista li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--rendben);
	font-weight: 700;
	font-size: 0.85rem;
}

/* A bekuldes gomb folotti, egysoros ismetles (Zoltan, TG 25012: "rovidebb
   alakban, egy sorban"). Ugyanaz a doboz, csak <p>-kent, ikon plusz szoveg
   egy sorban -- nem uj igeret, a fenti negybol az elso harom tomoritve. */
.doboz-nevtelenseg-tomor {
	display: flex;
	align-items: flex-start;
	gap: 0.55rem;
	font-size: 0.92rem;
	line-height: 1.4;
	color: var(--ink);
}
.doboz-nevtelenseg-tomor .doboz-ikon { margin-top: 0.15rem; }
.doboz-nevtelenseg-tomor strong { color: var(--rendben); }

.ok { color: var(--rendben); font-weight: 700; }

.link-doboz {
	border: 1px solid var(--vonal);
	border-left: 4px solid var(--ink);
	padding: 0.7rem 0.8rem;
	word-break: break-all;
	font-size: 0.95rem;
}

/* --- the shadow bar --- */

.sav {
	display: flex;
	height: var(--sav);
	border: 1px solid var(--ink);
	overflow: hidden;
	margin: 0 0 0.6rem;
}

.sav span { display: block; height: 100%; }
.sav-jova { background: var(--ink); }
.sav-arnyek {
	background: repeating-linear-gradient(135deg, var(--jelzo) 0 6px, #f2c9c0 6px 12px);
}
.sav-nem { background: var(--lap); }
/* Hianyzo valasz, nem kockazat -- semleges szurke, nem piros. Csak csapatos
   agon jelenik meg, es csak ha van ilyen kitolto. Robi 2026-08-14. */
.sav-nyilatkozatlan { background: var(--vonal); }

.sav-jelmagyarazat {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.2rem;
	padding: 0;
	margin: 0 0 1.1rem;
	font-size: 0.88rem;
	color: var(--halvany);
}

.sav-jelmagyarazat i {
	display: inline-block;
	width: 0.85rem;
	height: 0.85rem;
	margin-right: 0.4rem;
	vertical-align: -1px;
	border: 1px solid var(--ink);
}

.j-jova { background: var(--ink); }
.j-arnyek { background: repeating-linear-gradient(135deg, var(--jelzo) 0 3px, #f2c9c0 3px 6px); }
.j-nem { background: var(--lap); }
.j-nyilatkozatlan { background: var(--vonal); }

/* --- numbers with their provenance --- */

.szamlista { list-style: none; padding: 0; margin: 0 0 1rem; }

.szamlista li {
	border-top: 1px solid var(--vonal);
	padding: 0.6rem 0;
}

.szamlista strong, .kiemelt strong, .nagy-szam {
	font-weight: 700;
	font-size: 1.35rem;
	letter-spacing: -0.01em;
	margin-right: 0.35rem;
}

.nagy-szam { font-size: clamp(2.4rem, 12vw, 4rem); display: block; margin: 0 0 0.6rem; }

/* Az onertekelo fo-szam "N / letszam fo" alakja: az egyseg-resz ne orokolje a
   nagy-szam oriasi meretet, maradjon alarendelt reszlet. Robi 2026-08-14. */
.fo-egyseg { font-size: 1.1rem; font-weight: 400; opacity: 0.7; }

.honnan {
	display: block;
	font-size: 0.78rem;
	color: var(--halvany);
	margin-top: 0.2rem;
}

.kiemelt {
	border-left: 4px solid var(--jelzo);
	padding: 0.6rem 0 0.6rem 0.8rem;
	margin: 1rem 0;
}

.kuszob { border-left: 4px solid var(--ink); padding-left: 1rem; }

/* --- inventory table --- */

.tabla-gorgo { overflow-x: auto; margin: 0 0 0.8rem; }

table { border-collapse: collapse; width: 100%; min-width: 48rem; font-size: 0.9rem; }

th, td {
	text-align: left;
	vertical-align: top;
	padding: 0.6rem 0.7rem 0.6rem 0;
	border-bottom: 1px solid var(--vonal);
}

thead th { border-bottom: 2px solid var(--ink); font-size: 0.8rem; }

/* On a narrow screen the seven columns stack instead of scrolling off the edge:
   a cut-off table reads as broken, and the numbers are the whole point here. */
@media (max-width: 45.99rem) {
	table, tbody, tr, td { display: block; width: 100%; }
	thead { display: none; }
	table { min-width: 0; }
	.tabla-gorgo { overflow-x: visible; }
	tr { border-bottom: 2px solid var(--ink); padding: 0.8rem 0 0.6rem; }
	td { border: 0; padding: 0.15rem 0 0.5rem; }
	td::before {
		content: attr(data-cimke);
		display: block;
		font-size: 0.72rem;
		font-weight: 700;
		color: var(--halvany);
	}
	td.eszkoz-nev { font-size: 1.1rem; font-weight: 700; }
}

.besorolas { font-weight: 700; }
.besorolas.b-minimális { color: var(--rendben); }
.besorolas.b-korlátozott { color: #8a5a00; }
.besorolas.b-magas { color: var(--jelzo); }

.zaro { border-top: 3px solid var(--ink); padding-top: 1.2rem; }

.lablec {
	border-top: 1px solid var(--vonal);
	margin-top: 2.4rem;
	padding-top: 1.2rem;
	font-size: 0.92rem;
	color: var(--halvany);
}

@media (min-width: 46rem) {
	main { padding: 2.4rem 2rem 5rem; }
	.urlap input[type="text"],
	.urlap input[type="number"],
	.urlap input[type="email"] { max-width: 26rem; }
}

/* ============================================================
   Az indito lap latvany-retege (2026-08-01). Additiv: a tobbi
   lap valtozatlan marad, csak ez a lap kap uj elemeket.
   ============================================================ */

.fejlec-fo .uzem { display: flex; align-items: center; gap: 0.7rem; }
.kk-logo { display: block; width: 106px; height: auto; }
.fejlec-fo .uzem span {
	border-left: 1px solid var(--vonal);
	padding-left: 0.7rem;
	letter-spacing: 0.04em;
}

.ket-oszlop { display: grid; grid-template-columns: 1fr; gap: 2.4rem; }
@media (min-width: 62rem) {
	.ket-oszlop { grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr); gap: 3.4rem; align-items: start; }
}

/* --- a negy lepes abraja --- */
.abra { margin: 0; }
.abra svg { display: block; width: 100%; max-width: 30rem; height: auto; }
.abra figcaption {
	max-width: 30rem;
	margin-top: 0.9rem;
	font-size: 0.86rem;
	color: var(--halvany);
}
/* A 12 pixeles SVG-felirat sotetebb, mint a lap tobbi halvany szovege: ekkora
   meretben nincs teljesen fedett glif-pixel, tehat a fedettseg-alapu meres
   4,12-t latott az 5,96 helyett. 8,78-cal az elsimitott pixel is atmegy. */
.a-cimke { font-size: 12px; fill: #434B5A; }
.a-lepes { fill: var(--ink); font-weight: 700; }
.a-halk { font-size: 11px; fill: #434B5A; }
.a-te { fill: var(--ink); }
.a-kor { fill: none; stroke: var(--halvany); stroke-width: 1.4; }
.a-nevtelen { fill: var(--halvany); }
.a-ut { stroke: #b9bfc9; stroke-width: 1.2; fill: none; }
.a-kereszt { stroke: var(--halvany); }
.a-kapocs { stroke: var(--vonal); stroke-width: 1.2; fill: none; }
/* A sav halvany, mert az aranyokat a valodi valaszok adjak. Kitalált szam
   nem kerul a lapra, tehat a sav forma, nem adat. */
.a-sav-keret { fill: none; stroke: var(--halvany); stroke-width: 1.2; }
.a-oszto { stroke: var(--halvany); stroke-width: 1; stroke-dasharray: 3 3; }
.a-torzs { stroke: var(--halvany); }
.a-kulcs-jova { fill: var(--rendben); }
.a-kulcs-arnyek { fill: var(--jelzo); }
.a-kulcs-nem { fill: var(--halvany); }

/* --- az ot valasz kapuja (a szamlalo ma a csapatos ag-rajzban all) --- */
.k-jel { fill: none; stroke: var(--vonal); stroke-width: 1.6; }
.k-jel-ot { fill: var(--rendben); stroke: var(--rendben); }

/* ============================================================
   A hosszu csali-lap. A hos alatti szakaszok egy ritmusra allnak:
   hajszalvonal, cim, szoveg, abra. Kartya csak ott van, ahol ket
   dolgot kell egymas MELLE tenni (a ket ag), mert ott a doboz maga
   az allitas: ez ket kulon ut, nem egy folytonos szoveg.
   ============================================================ */

.szakasz {
	border-top: 1px solid var(--vonal);
	padding-top: 1.9rem;
	margin: 0 0 3rem;
}

.szakasz > h2 {
	font-size: clamp(1.3rem, 3.6vw, 1.75rem);
	line-height: 1.18;
	letter-spacing: -0.015em;
	border-bottom: 0;
	padding-bottom: 0;
	margin: 0 0 0.9rem;
}

.szakasz p { max-width: 44rem; }

/* A vezermondat a szakasz egy allitasa. Arany hajszal all elotte, mert a
   KK-arany szovegszinnek keves (1,91:1), jelnek viszont pontosan jo. */
.vezer {
	font-size: clamp(1.06rem, 2.3vw, 1.28rem);
	line-height: 1.4;
	font-weight: 600;
	color: var(--ink);
	border-left: 3px solid var(--kk-arany);
	padding-left: 1rem;
	margin: 1.2rem 0 1.2rem;
}

.zaro-mondat {
	border-top: 1px solid var(--vonal);
	padding-top: 0.9rem;
	margin-top: 1.4rem;
	color: var(--halvany);
}

.urlap-labjegyzet {
	font-size: 0.88rem;
	color: var(--halvany);
	margin-top: 0.9rem;
	max-width: 26rem;
}

/* --- szamozott tetel-racs (a negy helyzet, a nyolc lelet-tetel, a negy jogi pont) --- */

.tetel-racs {
	list-style: none;
	counter-reset: tetel;
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.2rem 2.6rem;
	margin: 1.5rem 0 0;
	padding: 0;
}

@media (min-width: 46rem) {
	.tetel-racs { grid-template-columns: 1fr 1fr; }
}

.tetel-racs li {
	counter-increment: tetel;
	border-top: 2px solid var(--ink);
	padding-top: 0.75rem;
	position: relative;
}

.tetel-racs li::before {
	content: counter(tetel, decimal-leading-zero);
	display: block;
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--halvany);
	margin-bottom: 0.25rem;
}

.tetel-racs b { font-weight: 700; }
.tetel-racs-suru { gap: 1rem 2.6rem; font-size: 0.96rem; }
.tetel-racs-suru li { border-top-width: 1px; border-top-color: var(--vonal); }

/* --- a ket ag egymas mellett --- */

.ag-racs {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.4rem;
	margin: 1.6rem 0 0;
}

@media (min-width: 46rem) {
	.ag-racs { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

.ag {
	margin: 0;
	border: 1px solid var(--vonal);
	border-left: 3px solid var(--ink);
	padding: 1.3rem 1.3rem 1rem;
	background: #fbfcfd;
}

.ag-onertekelo { border-left-color: var(--rendben); }

.ag-cimke {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--halvany);
	margin: 0 0 0.25rem;
}

.ag h3 { font-size: 1.08rem; margin: 0; letter-spacing: -0.01em; }
.ag p { font-size: 0.95rem; margin: 0; }

.ag-rajz {
	display: block;
	width: 100%;
	max-width: 19rem;
	height: auto;
	margin: 1rem auto 1.1rem;
}

/* Az ag-rajzok kozos elemei. A lelet-lap mind a ket agon UGYANAZ a rajz:
   a kulonbseg az uthoz tartozik, nem a vegeredmenyhez. */
.ag-lap { fill: #fff; stroke: var(--halvany); stroke-width: 1.3; }
.ag-sor { stroke: #b9bfc9; stroke-width: 1.3; }
.ag-pont { fill: none; stroke: var(--halvany); stroke-width: 1.2; }
.ag-sav-jova { fill: var(--ink); }
.ag-sav-keret { fill: none; stroke: var(--ink); stroke-width: 1.2; }
.ag-azonnal { font-size: 12px; font-weight: 700; fill: var(--rendben); }

/* --- teljes szelessegu abrak (szivargas, ido) --- */

.abra-teljes { margin: 1.6rem 0 0; }
.abra-teljes svg { display: block; width: 100%; height: auto; }
.abra-teljes .mob { display: none; }
.abra-teljes figcaption {
	max-width: 44rem;
	margin-top: 0.9rem;
	font-size: 0.86rem;
	color: var(--halvany);
}

@media (max-width: 45.99rem) {
	.abra-teljes .asztal { display: none; }
	.abra-teljes .mob { display: block; max-width: 21rem; }
}

.abra-szivargas svg { max-width: 58rem; }
.abra-ido svg { max-width: 32rem; }
.abra-lekepezes svg { max-width: 50rem; }

.lk-kerdes { font-size: 14px; fill: #434B5A; }
.lk-tetel { font-size: 14px; font-weight: 700; fill: var(--ink); }
.lk-ut { stroke: var(--halvany); stroke-width: 1.2; }
.lk-hegy { fill: var(--halvany); }
.lk-jelolo { stroke: var(--kk-arany); stroke-width: 2; }

.sz-fejcim { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; fill: #434B5A; }
.sz-cim { font-size: 15px; font-weight: 700; fill: var(--ink); }
.sz-kerdes { font-size: 15px; fill: var(--ink); }
.sz-lap { fill: #fff; stroke: var(--ink); stroke-width: 1.4; }
.sz-nyil { stroke: var(--jelzo); stroke-width: 1.6; fill: none; }
.sz-hegy { fill: var(--jelzo); }
.sz-hatar { stroke: var(--halvany); stroke-width: 1.2; stroke-dasharray: 5 5; }
.sz-doboz { fill: #fbf5f3; stroke: var(--jelzo); stroke-width: 1.4; }

.i-sav-te { fill: var(--ink); }
/* A kollega-sav vilagosabb, de NEM keretes: kerettel ures beviteli mezonek
   latszott. Az osztasok fel percenkent allnak, tehat a negyszeres hossz
   leolvashato, nem csak sejtheto. */
.i-sav-kollega { fill: #9aa1ad; }
.i-osztas { stroke: #fff; stroke-width: 2; }
.i-ido { font-size: 15px; font-weight: 700; fill: var(--ink); }

/* A zaro urlap ugyanaz a ket mezo, csak a lap aljan: aki vegigolvasta, ne
   gorgesson vissza a tetejere. */
.zaro-inditas { border-top: 3px solid var(--ink); padding-top: 1.9rem; }
.zaro-inditas .urlap { margin-top: 1.2rem; }

/* --- belepo mozgas. A rejtett kiindulast CSAK a szkript kapcsolja be,
       tehat JS nelkul semmi nem tunik el. --- */
@keyframes beuszik { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes utrajzol { from { stroke-dashoffset: 420; } to { stroke-dashoffset: 0; } }
.mozgas [data-anim] { opacity: 0; }
.mozgas [data-anim].lat { animation: beuszik 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) forwards; }
.mozgas .abra .a-ut { stroke-dasharray: 420; stroke-dashoffset: 420; }
.mozgas .abra.lat .a-ut { animation: utrajzol 1.1s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
button { transition: background 0.15s, transform 0.08s; }
button:hover { background: #2a2f38; }
button:active { transform: translateY(1px); }

@media (prefers-reduced-motion: reduce) {
	.mozgas [data-anim], .mozgas [data-anim].lat { opacity: 1; animation: none; }
	.mozgas .abra .a-ut, .mozgas .abra.lat .a-ut { stroke-dashoffset: 0; animation: none; }
	button { transition: none; }
}



/* A ket rajz sosem latszik egyszerre. A telefonos valtozat keskenyebb, tehat a
   felirat 1:1 kozeleben skalazodik, nem log ki. */
.abra .mob { display: none; }
@media (max-width: 61.99rem) {
	.abra .asztal { display: none; }
	.abra .mob { display: block; max-width: 22rem; }
	.a-cimke { font-size: 12px; }
	.a-halk { font-size: 11px; }
	/* Telefonon az abra ELOBB jon, mint az urlap: eloszor ertsd meg, mi tortenik. */
	.ket-oszlop .abra { order: -1; }
}

/* A lepesek szavai telefonon HTML-listaban allnak, nem a rajzon: ott a betu
   vegig eles, plusz nem utkozik a vonalakkal. */
.lepes-lista { display: none; }
@media (max-width: 61.99rem) {
	.lepes-lista {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0.35rem 1.2rem;
		list-style: none;
		margin: 0.9rem 0 0;
		padding: 0;
		max-width: 22rem;
		font-size: 0.86rem;
		color: var(--halvany);
	}
	.lepes-lista b { color: var(--ink); margin-right: 0.35rem; }
}

/* KK arany. NEM szovegszin: feher alapon 1,91:1, a szoveghez 4,5 kellene.
   Ezert csak jelkent all a lapon, informaciot nem hordoz. */
:root { --kk-arany: #D8B871; }
.fejlec-fo { position: relative; }
.fejlec-fo::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -3px;
	width: 84px;
	height: 3px;
	background: var(--kk-arany);
}
.a-jel { fill: var(--kk-arany); }

/* A lelet e-mail-kapuja: a fo szam all egyedul, korulotte semmi.
   Ugyanaz a bal savos forma, mint a kuszob-blokke, mert ugyanaz a mondat:
   ennyit latsz, a tobbihez kell meg valami. */
.kapu-fo {
	border-left: 4px solid var(--ink);
	padding-left: 1rem;
}
.kapu-fo .nagy-szam { line-height: 1; }
.kapu-fo .bevezeto { margin-top: 0; }

/* Foglalo. A magassag fix, kulonben a naptar betoltese elott nulla magas,
   utana ugrik egyet: a lap alja igy allna ossze a szem elott. */
.foglalo-keret {
	border: 0;
	width: 100%;
	min-height: 640px;
	margin: 1.2rem 0 0.6rem;
	background: #fff;
}
@media (max-width: 640px) {
	.foglalo-keret { min-height: 760px; }
}

/* Nagy elsodleges gomb (kis ceges ag: "Kitoltom most", "Megnezem a leletet").
   Ugyanaz a forma, mint az urlap-gomboke, csak onalloan all a lapon. */
.nagy-gomb {
	display: inline-block;
	background: var(--ink);
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	padding: 0.9rem 1.6rem;
	border: 0;
	font-size: 1.05rem;
}
.nagy-gomb:hover, .nagy-gomb:focus { opacity: 0.88; }

/* --- Foglalo-lap ---------------------------------------------------------- */
/* A savok radiogombok, gomb-kinezettel: egy erintessel valaszthatok telefonon,
   viszont urlap-mezok maradnak, tehat JS nelkul is mukodik a lap. */
.foglalo-gomb {
	display: inline-block; background: var(--ink); color: #fff; text-decoration: none;
	padding: 0.75rem 1.4rem; border-radius: 6px; font-weight: 600;
}
.foglalo-gomb:hover { background: #000; }
.foglalo-urlap .nap { border: 0; border-top: 1px solid var(--vonal, #d8dbe0); padding: 0.9rem 0 0.2rem; margin: 0 0 0.9rem; }
.foglalo-urlap .nap legend { font-weight: 600; padding: 0 0.4rem 0 0; }
.res-racs { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.res input { position: absolute; opacity: 0; width: 0; height: 0; }
.res span {
	display: inline-block; min-width: 4.2rem; text-align: center;
	padding: 0.55rem 0.6rem; border: 1px solid var(--vonal, #d8dbe0); border-radius: 6px;
	cursor: pointer; font-variant-numeric: tabular-nums;
}
.res input:checked + span { background: var(--ink); color: #fff; border-color: var(--ink); }
.res input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 2px; }
.foglalas-idopont { font-size: 1.35rem; font-weight: 700; margin: 0 0 0.6rem; }
.meet-link { word-break: break-all; }
@media (max-width: 480px) {
	/* Telefonon harom sav fer el egy sorban, tapadas nelkul: a 44 keppontos
	   erintesi meret alatt nem megyunk. */
	.res span { min-width: 0; flex: 1 1 4.6rem; padding: 0.7rem 0.3rem; }
}

/* =============================================================================
   A LELET ABRAI (2026-08-14, Kai, Zoltan TG a leletrol). Sajat SVG-mentes
   sav/oszlop-rajzolas, tisztan CSS-bol, ugyanaz a nyelvtan mint a .sav-e
   (arnyeksav): tomor csik = jo/semleges, csikozott piros = arnyek/hiany.
   ============================================================================= */

.msav {
	display: block;
	width: 100%;
	height: 1.6rem;
	border: 1px solid var(--ink);
	margin: 0 0 0.6rem;
}
.msav-jo { fill: var(--rendben); }
.msav-semleges { fill: var(--ink); }
.msav-semleges2 { fill: var(--halvany); }
.msav-rossz { fill: var(--jelzo); }
/* Vilagosabb piros, nem csikozott minta: SVG-ben ket kulon inline <svg>
   kozott nem biztonsagos azonos <pattern> id-t megosztani egy oldalon. */
.msav-rossz2 { fill: #d98a76; }
.msav-halvany { fill: var(--lap); }

.msav-jelmagyarazat {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.2rem;
	padding: 0;
	margin: 0 0 1.1rem;
	font-size: 0.88rem;
	color: var(--halvany);
}
.msav-jelmagyarazat i {
	display: inline-block;
	width: 0.85rem;
	height: 0.85rem;
	margin-right: 0.4rem;
	vertical-align: -1px;
	border: 1px solid var(--ink);
}
.mj-jo { background: var(--rendben); }
.mj-semleges { background: var(--ink); }
.mj-semleges2 { background: var(--halvany); }
.mj-rossz { background: var(--jelzo); }
.mj-rossz2 { background: repeating-linear-gradient(135deg, var(--jelzo) 0 3px, #f2c9c0 3px 6px); }
.mj-halvany { background: var(--lap); }

/* Tobbszoros valasztasu kerdes: fuggetlen savok, nem szazalekra osztott egy
   csik. Az erzekeny sorok pirosak plusz felkovertek. */
.aranyoszlopok { list-style: none; margin: 0 0 1rem; padding: 0; }
.aosz-sor {
	display: grid;
	grid-template-columns: 12rem 1fr 2.4rem;
	align-items: center;
	gap: 0.7rem;
	padding: 0.45rem 0;
	border-top: 1px solid var(--vonal);
	font-size: 0.9rem;
}
.aosz-cimke { color: var(--ink); }
.aosz-sav { display: block; width: 100%; height: 0.7rem; }
.aosz-track { fill: var(--vonal); }
.aosz-fill { fill: var(--ink); }
.aosz-erzekeny .aosz-fill { fill: var(--jelzo); }
.aosz-erzekeny .aosz-cimke { font-weight: 700; color: var(--jelzo); }
.aosz-szam { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
@media (max-width: 32rem) {
	.aosz-sor { grid-template-columns: 1fr auto; grid-template-areas: "cimke szam" "sav sav"; row-gap: 0.3rem; }
	.aosz-cimke { grid-area: cimke; }
	.aosz-szam { grid-area: szam; }
	.aosz-savhely { grid-area: sav; }
}

/* A vezetoi osszegzes: harom nagy szam, egy mondat. Ez a lelet elso dolga,
   amit a cegvezeto lat, tehat sajat, vastag keretet kap. */
.osszegzes { border: 2px solid var(--ink); padding: 1.2rem 1.3rem 1.4rem; }
.osszegzes-racs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
	gap: 1rem 1.6rem;
	margin: 0.6rem 0 1.1rem;
}
.oszam { border-top: 3px solid var(--ink); padding-top: 0.5rem; }
.oszam-ertek { font-size: clamp(2rem, 8vw, 2.7rem); font-weight: 700; line-height: 1; margin: 0 0 0.25rem; font-variant-numeric: tabular-nums; }
.oszam-cimke { font-size: 0.85rem; color: var(--halvany); margin: 0; }
.oszam-arnyek, .oszam-erzekeny { border-top-color: var(--jelzo); }
.oszam-arnyek .oszam-ertek, .oszam-erzekeny .oszam-ertek { color: var(--jelzo); }
.osszegzes-mondat { font-weight: 600; margin: 0; }

/* Ertekajanlat plusz zaro hivas: ugyanaz a vastag keret, mint az osszegzese,
   igy a lelet elso meg utolso, vezetoinek szant blokkja vizualisan osszetartozik. */
.ertekajanlat { }
.hivas-szakasz { border: 2px solid var(--ink); padding: 1.2rem 1.3rem 1.4rem; }
.hivas-lista { list-style: none; padding: 0; margin: 0.8rem 0 1.2rem; }
.hivas-lista li { padding: 0.35rem 0 0.35rem 1.4rem; position: relative; }
.hivas-lista li::before { content: "\2192"; position: absolute; left: 0; color: var(--rendben); font-weight: 700; }

/* Nyomtatashoz: egyetlen abra vagy blokk se szakadjon ketfele oldaltoresnel,
   plusz a linkek alahuzva is latszodjanak papiron. */
@media print {
	.blokk, .msav, .aranyoszlopok, .osszegzes, .hivas-szakasz, .ertekajanlat, table tr {
		break-inside: avoid;
		page-break-inside: avoid;
	}
	a { color: var(--ink); text-decoration: underline; }
	.nagy-gomb { border: 1px solid var(--ink); }
}

/* --- SVG label floor (card 57c8415a, 2026-10-24) ---
   A viewBox scales its labels together with the drawing: a 12 px label in a
   500-unit drawing shown 441 px wide reads 10.6 px, the same label in the
   900-unit leak drawing at 676 px reads 9 px. Font size inside an SVG is in
   user units, so every figure is a size container and below each width step
   the labels get a floor in user units (--fm):
       floor = 11.4 * viewBox width / lower edge of the step
   so that floor * (drawn width / viewBox width) >= 11.4 real px (the
   lap-atvetel gate fails below 11). The text classes take max(own size,
   floor), so a 15 px heading is left alone where 15 already reads.
   Assumption: drawn width = min(container width, the svg max-width); measured
   2026-10-24 at 300-1440 px viewport in 10 px steps, container widths 219-928.
   Desktop text sizes stay as they were wherever they already read. */
.abra, .ag, .abra-teljes { container-type: inline-size; }

.a-cimke { font-size: max(12px, var(--fm, 0px)); }
.a-halk { font-size: max(11px, var(--fm, 0px)); }
.ag-azonnal { font-size: max(12px, var(--fm, 0px)); }
.sz-fejcim { font-size: max(12px, var(--fm, 0px)); }
.sz-cim, .sz-kerdes, .i-ido { font-size: max(15px, var(--fm, 0px)); }
.lk-kerdes, .lk-tetel { font-size: max(14px, var(--fm, 0px)); }

/* Four-step drawing, desktop (viewBox 500, max 480 px; container 441 px from
   992 px viewport up). */
.abra .asztal { --fm: 11.9px; }
@container (max-width: 479.98px) { .abra .asztal { --fm: 13px; } }
@container (max-width: 439.98px) { .abra .asztal { --fm: 14.3px; } }

/* Narrow drawings with a 320-unit viewBox (four steps max 352 px, leak and
   mapping max 336 px). Steps at 340/310/280/250 px. */
@container (max-width: 340px) { .abra .mob, .abra-teljes .mob { --fm: 11.8px; } }
@container (max-width: 310px) { .abra .mob, .abra-teljes .mob { --fm: 13.1px; } }
@container (max-width: 280px) { .abra .mob, .abra-teljes .mob { --fm: 14.6px; } }
@container (max-width: 250px) { .abra .mob, .abra-teljes .mob { --fm: 16.6px; } }

/* The time drawing's narrow variant has a 300-unit viewBox, so it needs less. */
@container (max-width: 340px) { .abra-ido .mob { --fm: 11.1px; } }
@container (max-width: 310px) { .abra-ido .mob { --fm: 12.3px; } }
@container (max-width: 280px) { .abra-ido .mob { --fm: 13.7px; } }
@container (max-width: 250px) { .abra-ido .mob { --fm: 15.6px; } }

/* Branch drawings (viewBox 300, max 304 px). The two-column grid from 736 px
   squeezes the card to 276 px, phones to 219-309 px. */
@container (max-width: 310px) { .ag-rajz { --fm: 12.3px; } }
@container (max-width: 280px) { .ag-rajz { --fm: 13.7px; } }
@container (max-width: 250px) { .ag-rajz { --fm: 15.6px; } }
@container (max-width: 220px) { .ag-rajz { --fm: 17.1px; } }

/* Leak drawing, desktop (viewBox 900, max 928 px, shown from 736 px viewport,
   container 676 px there). */
.abra-szivargas .asztal { --fm: 11.1px; }
@container (max-width: 927.98px) { .abra-szivargas .asztal { --fm: 11.9px; } }
@container (max-width: 860px) { .abra-szivargas .asztal { --fm: 12.9px; } }
@container (max-width: 800px) { .abra-szivargas .asztal { --fm: 13.9px; } }
@container (max-width: 740px) { .abra-szivargas .asztal { --fm: 15.3px; } }
@container (max-width: 670px) { .abra-szivargas .asztal { --fm: 16.6px; } }

/* Mapping drawing, desktop (viewBox 680, max 800 px): 12 px headings read
   from 646 px up, one safety step below. */
@container (max-width: 700px) { .abra-lekepezes .asztal { --fm: 12.2px; } }

/* Branch drawings: at the label floor "nev nelkul erkeznek" sits on the funnel
   lines, a halo in the card background keeps it readable (card 57c8415a). */
.ag-rajz .a-cimke {
	paint-order: stroke;
	stroke: #fbfcfd;
	stroke-width: 8px;
	stroke-linejoin: round;
}