/*
 * Kazánmentő — szolgáltatási oldalak stíluslapja (első: /gazkazan-javitas/)
 *
 * A főoldal designnyelvét folytatja (alap.css tokenjei: --ink, --yellow,
 * --paper, --shadow; diagonális vágások, átfedő fehér sáv, lekerekített
 * képek, sárga akcentus). Új vizuális irányt nem vezet be.
 * Forrás: KAZANMENTO_GAZKAZAN_JAVITAS_FINAL/02_GAZKAZAN_JAVITAS_DESIGNSPEC.md
 */

.szolg-cim { margin: 0 0 28px; font-size: clamp(2rem, 3.4vw, 3.3rem); line-height: 1.02; letter-spacing: -.04em; }
/* Sárga kör-ikon (a főoldali .round-icon megfelelője; a fooldal.css itt nem töltődik be) */
.round-icon { flex: 0 0 52px; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.round-icon svg { width: 25px; height: 25px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 1. Hero ---------------------------------------------------------------- */
.szolg-hero { position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 72% 10%, #213a4f 0, transparent 27%), linear-gradient(112deg, #081725 0 50%, #102a41 50% 78%, #071421 78%); }
.szolg-hero::after { content: ""; position: absolute; z-index: 0; inset: auto -7% -80px 45%; height: 150px; background: var(--yellow); transform: skewY(-7deg); opacity: .92; }
.szolg-hero-inner { position: relative; z-index: 2; min-height: 600px; display: grid; grid-template-columns: 50% 50%; align-items: center; }
.szolg-hero-copy { position: relative; z-index: 3; padding: 70px 40px 130px 0; }
.szolg-hero h1 { margin: 0 0 16px; color: var(--yellow); font-size: clamp(2.8rem, 5vw, 5.2rem); line-height: .98; letter-spacing: -.05em; }
.szolg-hero-lead { margin: 0 0 12px; font-size: clamp(1.05rem, 1.35vw, 1.35rem); }
.szolg-hero-text { max-width: 640px; margin: 0; color: rgba(255,255,255,.78); font-size: clamp(.92rem, 1.02vw, 1.05rem); }
.szolg-hero-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.szolg-hero-buttons .button { min-height: 56px; }
.szolg-hero-buttons small, .szolg-zaro .final-actions small { display: block; margin-top: 3px; font-size: .66rem; opacity: .75; }
.szolg-hero-visual { position: relative; align-self: stretch; min-height: 520px; }
.szolg-hero-slice { position: absolute; top: -8%; bottom: -8%; left: 2%; width: 13%; background: linear-gradient(180deg, rgba(255,211,0,.92), rgba(255,183,0,.55)); transform: translate3d(var(--pointer-x-back, 0px), calc(var(--parallax-y) + var(--pointer-y-back, 0px)), 0) skewX(-12deg); transition: transform .2s ease-out; will-change: transform; }
.szolg-hero-photo { position: absolute; top: 48px; bottom: 90px; left: 9%; right: -20vw; overflow: hidden; border-radius: 22px 0 0 22px; clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%); box-shadow: 0 30px 60px rgba(0,0,0,.35); transform: translate3d(var(--pointer-x-front, 0px), calc(var(--parallax-y) + var(--pointer-y-front, 0px)), 0); transition: transform .2s ease-out; will-change: transform; }
/* Mélységhatás: a fotó a kereten belül ellentétes irányba csúszik (egérmozgásra);
   a 6%-os nagyítás miatt a kép széle soha nem látszik ki. */
.szolg-hero-photo img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 30% center; transform: translate3d(var(--pointer-x-back, 0px), var(--pointer-y-back, 0px), 0) scale(1.06); transition: transform .2s ease-out; will-change: transform; }
.szolg-hero-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(7,20,33,.45), transparent 35%); pointer-events: none; }

/* Átfedő fehér bizalmi sáv (a főoldali .trust rokona, kompaktabb) */
.szolg-bizalom { position: relative; z-index: 10; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: -64px; padding: 18px 22px; border-radius: 18px; background: rgba(255,255,255,.97); box-shadow: var(--shadow); }
.szolg-bizalom p { display: flex; align-items: center; gap: 12px; margin: 0; padding: 8px 16px; font-size: .9rem; font-weight: 800; line-height: 1.25; }
.szolg-bizalom p + p { border-left: 1px solid var(--line); }
.szolg-bizalom .round-icon { flex-basis: 44px; width: 44px; height: 44px; }
.szolg-bizalom .round-icon svg { width: 22px; height: 22px; }

/* 2. Hibajelenségek: 2 kiemelt + 4 kisebb ------------------------------- */
.szolg-hibak { padding: 96px 0 90px; }
.szolg-hibak-racs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.szolg-hiba { position: relative; display: flex; flex-direction: column; padding: 26px 24px 28px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 10px 26px rgba(13,37,55,.06); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.szolg-hiba:hover { transform: translateY(-5px); border-color: rgba(255,199,0,.7); box-shadow: 0 20px 40px rgba(13,37,55,.14); }
.szolg-hiba-kiemelt { grid-column: span 2; min-height: 250px; padding: 34px 36px; overflow: hidden; color: #fff; border-color: transparent; background: linear-gradient(155deg, #0b2940, #071b2b); clip-path: polygon(0 0, 100% 0, 100% 88%, 94% 100%, 0 100%); }
.szolg-hiba-kiemelt::before { content: ""; position: absolute; top: -40%; right: -12%; width: 38%; height: 180%; background: linear-gradient(180deg, rgba(255,199,0,.16), rgba(255,199,0,0)); transform: skewX(-14deg); pointer-events: none; }
.szolg-hiba-fej { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.szolg-hiba-ikon { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.szolg-hiba-ikon svg { width: 25px; height: 25px; }
.szolg-hiba-szam { color: #c9d4db; font-size: 2rem; font-weight: 900; letter-spacing: -.04em; line-height: 1; }
.szolg-hiba-kiemelt .szolg-hiba-szam { color: var(--yellow); font-size: 3rem; }
.szolg-hiba h3 { margin: 0 0 8px; font-size: 1.08rem; line-height: 1.2; }
.szolg-hiba-kiemelt h3 { font-size: clamp(1.4rem, 2vw, 1.9rem); line-height: 1.1; }
.szolg-hiba p { margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.5; }
.szolg-hiba-kiemelt p { max-width: 520px; color: rgba(255,255,255,.76); font-size: .95rem; }

/* 3. Kazántípusok: chip-rendszer + rendszerkép --------------------------- */
/* A díszítő háttérlapok (::before/::after) kilóghatnak a tartalomsávból:
   clip — vízszintes túlcsordulás nélkül, görgethető tároló létrehozása nélkül. */
.szolg-tipusok, .szolg-javitas { overflow-x: clip; }
.szolg-tipusok { padding: 20px 0 100px; background: var(--paper); }
.szolg-tipusok-inner { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: clamp(32px, 5vw, 80px); }
.szolg-tipusok-copy > p { max-width: 620px; margin: 0 0 12px; color: #425563; }
.szolg-chipek { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0 22px; padding: 0; list-style: none; }
.szolg-chipek li { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px 8px 12px; border: 1px solid #cfdbe3; border-radius: 999px; background: #fff; color: #0b2a42; font-size: .9rem; font-weight: 800; }
.szolg-chipek li svg { width: 20px; height: 20px; color: #c79400; }
.szolg-megjegyzes { padding-left: 16px; border-left: 3px solid var(--yellow); font-weight: 650; }
.szolg-tipusok-kep { position: relative; }
.szolg-tipusok-kep::before { content: ""; position: absolute; inset: 22px -16px -16px 22px; border-radius: 20px; background: linear-gradient(135deg, var(--yellow), #ffdb38); transform: rotate(2deg); }
.szolg-tipusok-kep img { position: relative; width: 100%; height: auto; border-radius: 20px; box-shadow: var(--shadow); }

/* 4. Mit jelent a javítás: aszimmetrikus kép + számozott technikai sáv --- */
.szolg-javitas { padding: 100px 0 120px; background: linear-gradient(180deg, #eaf0f3, #f7fafb); }
.szolg-javitas-inner { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(32px, 5vw, 76px); }
.szolg-javitas-kep { position: relative; align-self: stretch; min-height: 520px; }
.szolg-javitas-kep::after { content: ""; position: absolute; z-index: 0; right: -18px; bottom: -22px; width: 42%; height: 42%; border-radius: 18px; background: var(--ink); clip-path: polygon(22% 0, 100% 0, 100% 100%, 0 100%); }
.szolg-javitas-foto { position: absolute; z-index: 1; inset: 0; overflow: hidden; border-radius: 22px; box-shadow: 0 24px 50px rgba(13,37,55,.2); transform: translate3d(0, var(--parallax-y), 0); will-change: transform; }
.szolg-javitas-foto img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 40% center; }
.szolg-javitas-copy > p { margin: 0 0 12px; color: #425563; }
.szolg-sav { margin: 16px 0 24px; padding: 0; list-style: none; counter-reset: sav; border-left: 2px solid #cfdbe3; }
.szolg-sav li { position: relative; margin: 0; padding: 9px 0 9px 50px; counter-increment: sav; color: #0b2a42; font-size: .93rem; font-weight: 700; line-height: 1.35; }
.szolg-sav li::before { content: counter(sav, decimal-leading-zero); position: absolute; top: 50%; left: -15px; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); font-size: .68rem; font-weight: 900; transform: translateY(-50%); box-shadow: 0 0 0 5px #f1f5f7; }
.szolg-kiemeles { margin: 0; padding: 18px 22px; border-radius: 12px; color: #fff; background: var(--ink); font-size: 1rem; line-height: 1.45; }
.szolg-kiemeles strong { color: #fff; }

/* 5. Javítás először: sötét, diagonális, a kép a JOBB oldalon ------------- */
.szolg-eloszor { position: relative; overflow: hidden; color: #fff; background: linear-gradient(120deg, #071521, #0b2942); clip-path: polygon(0 5%, 100% 0, 100% 95%, 0 100%); margin: -40px 0 -30px; }
.szolg-eloszor-kep { position: absolute; top: 0; right: 0; bottom: 0; width: 46%; overflow: hidden; clip-path: polygon(16% 0, 100% 0, 100% 100%, 0 100%); transform: translate3d(0, var(--parallax-y), 0) scale(1.04); will-change: transform; }
.szolg-eloszor-kep img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 60% center; }
.szolg-eloszor-kep::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,20,33,.85), transparent 45%); pointer-events: none; }
.szolg-eloszor-inner { position: relative; z-index: 2; min-height: 520px; display: flex; align-items: center; padding-block: 90px 80px; }
.szolg-eloszor-copy { max-width: 620px; }
.szolg-eloszor h2 { margin: 0 0 20px; font-size: clamp(2.6rem, 5vw, 5rem); line-height: .98; letter-spacing: -.05em; }
.szolg-eloszor h2 mark { color: var(--yellow); background: none; }
.szolg-eloszor h2 span { display: inline-block; margin-top: 10px; font-size: .46em; letter-spacing: -.02em; }
.szolg-eloszor-copy > p { margin: 10px 0; color: rgba(255,255,255,.76); font-size: .96rem; }
.szolg-eloszor-ertekek { display: flex; flex-wrap: wrap; gap: 12px 26px; margin: 26px 0 0; padding: 0; list-style: none; }
.szolg-eloszor-ertekek li { display: flex; align-items: center; gap: 12px; font-size: .8rem; font-weight: 850; text-transform: uppercase; }
.szolg-eloszor-ertekek span { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }

/* 6. Folyamat: lépcsőzetes kártyasor sárga összekötővel ------------------ */
.szolg-folyamat { padding: 110px 0 80px; background: #fff; }
.szolg-folyamat-lista { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin: 0; padding: 0; list-style: none; }
.szolg-folyamat-lista::before { content: ""; position: absolute; top: 34px; left: 4%; right: 4%; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--yellow), #ffe16b); }
.szolg-folyamat-lista li { position: relative; padding: 0 6px; }
.szolg-folyamat-lista li:nth-child(even) { margin-top: 34px; }
.szolg-folyamat-szam { position: relative; z-index: 1; width: 68px; height: 68px; display: grid; place-items: center; border: 3px solid var(--yellow); border-radius: 50%; color: var(--ink); background: #fff; font-size: 1.6rem; font-weight: 900; }
.szolg-folyamat-ikon { position: absolute; top: 42px; left: 54px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--ink); }
.szolg-folyamat-ikon svg { width: 17px; height: 17px; }
.szolg-folyamat-lista h3 { margin: 18px 0 6px; font-size: 1.02rem; line-height: 1.25; }
.szolg-folyamat-lista p { margin: 0; color: #5b6e7b; font-size: .84rem; line-height: 1.45; }

/* 7. Márkafüggetlen: sötétkék sáv (a főoldali márkasáv rokona) ------------ */
.szolg-markak { color: #fff; background: linear-gradient(112deg, #0c304d, #071725); }
.szolg-markak-inner { min-height: 230px; display: grid; grid-template-columns: minmax(280px, .9fr) minmax(0, 1.6fr); align-items: center; gap: 55px; padding-block: 44px; }
.szolg-markak h2 { margin: 0 0 8px; font-size: clamp(1.7rem, 2.5vw, 2.6rem); line-height: 1.1; }
.szolg-markak p { margin: 0; color: rgba(255,255,255,.7); font-size: .92rem; }
.szolg-markak ul { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin: 0; padding: 0; list-style: none; }
.szolg-markak li { min-height: 58px; display: grid; place-items: center; padding: 8px; border-radius: 8px; color: #17334a; background: #fff; font-size: .82rem; font-weight: 900; text-align: center; text-transform: uppercase; box-shadow: inset 0 0 0 1px #d8e1e5; transition: transform .22s ease; }
.szolg-markak li:hover { transform: translateY(-4px); }
.szolg-markak li:last-child { color: var(--ink); background: var(--yellow); }

/* 8. Miért a Kazánmentő: Dávid-portré + értékrács -------------------------- */
.szolg-miert { padding: 100px 0; }
.szolg-miert-inner { display: grid; grid-template-columns: minmax(260px, .7fr) 1.3fr; align-items: center; gap: clamp(32px, 5vw, 80px); }
/* A keret a fotó saját arányát veszi fel (1086×1448), a kép felülre igazodik:
   a fej semmilyen szélességnél nem vágódhat le. */
.szolg-miert-portre { position: relative; overflow: hidden; aspect-ratio: 1086 / 1448; border-radius: 20px; background: linear-gradient(150deg, #dbe3e7, #8da0ac); }
.szolg-miert-portre::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(145deg, transparent 55%, rgba(255,199,0,.3)); pointer-events: none; }
.szolg-miert-portre img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.szolg-miert-racs { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 32px; }
.szolg-miert-racs article { display: flex; align-items: flex-start; gap: 14px; }
.szolg-miert-racs article:last-child { grid-column: 1 / -1; max-width: 560px; }
.szolg-miert-racs h3 { margin: 4px 0 4px; font-size: 1.02rem; line-height: 1.25; }
.szolg-miert-racs p { margin: 0; color: #526572; font-size: .88rem; line-height: 1.5; }

/* 9. Cirkó: rövid tartalmi modul ---------------------------------------- */
.szolg-cirko { padding: 0 0 90px; background: var(--paper); }
.szolg-cirko-doboz { display: flex; align-items: flex-start; gap: 22px; max-width: 980px; margin-inline: auto; padding: 30px 34px; border: 1px solid var(--line); border-left: 5px solid var(--yellow); border-radius: 14px; background: #fff; }
.szolg-cirko-ikon { flex: 0 0 52px; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 12px; color: var(--yellow); background: var(--ink); }
.szolg-cirko-ikon svg { width: 26px; height: 26px; }
.szolg-cirko h2 { margin: 0 0 8px; font-size: 1.5rem; line-height: 1.15; }
.szolg-cirko p { margin: 6px 0 0; color: #425563; font-size: .93rem; }

/* 10. Kapcsolódó szolgáltatások: eltolt, horizontális belépők ------------ */
.szolg-kapcsolodo { padding: 100px 0 110px; background: linear-gradient(180deg, #fff, #eef3f6); }
.szolg-kapcsolodo-sor { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: start; }
.szolg-kapcsolodo-elem { position: relative; display: block; min-height: 220px; padding: 30px 30px 80px; border-radius: 18px; color: var(--ink); background: #fff; box-shadow: 0 14px 30px rgba(13,37,55,.08); transition: transform .25s ease, box-shadow .25s ease; }
.szolg-kapcsolodo-elem:nth-child(2) { margin-top: 40px; color: #fff; background: linear-gradient(155deg, #0b2940, #071b2b); }
.szolg-kapcsolodo-elem:nth-child(3) { margin-top: 80px; }
.szolg-kapcsolodo-elem:hover { transform: translateY(-5px); box-shadow: 0 22px 44px rgba(13,37,55,.16); }
.szolg-kapcsolodo-elem h3 { margin: 0 0 10px; font-size: 1.35rem; line-height: 1.15; }
.szolg-kapcsolodo-elem p { margin: 0; color: #526572; font-size: .9rem; line-height: 1.5; }
.szolg-kapcsolodo-elem:nth-child(2) p { color: rgba(255,255,255,.74); }
.circle-link-jel { position: absolute; left: 30px; bottom: 26px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); transition: transform .2s ease; }
.szolg-kapcsolodo-elem:hover .circle-link-jel { transform: translateX(5px); }

/* 11. FAQ: billentyűzettel kezelhető accordion (natív <details>) ---------- */
.szolg-faq { padding: 100px 0 110px; }
.szolg-faq-lista { max-width: 980px; }
.szolg-faq-elem { border-bottom: 1px solid #d3dee5; }
.szolg-faq-elem:first-child { border-top: 1px solid #d3dee5; }
.szolg-faq-elem > summary { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 4px; cursor: pointer; list-style: none; }
.szolg-faq-elem > summary::-webkit-details-marker { display: none; }
.szolg-faq-elem > summary::after { content: "+"; flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); font-size: 1.4rem; font-weight: 700; line-height: 1; transition: transform .2s ease; }
.szolg-faq-elem[open] > summary::after { content: "−"; }
.szolg-faq-elem > summary:hover h3 { color: #0b3b5e; }
.szolg-faq-elem h3 { margin: 0; color: var(--ink); font-size: 1.05rem; line-height: 1.35; }
.szolg-faq-valasz { padding: 0 60px 22px 4px; color: #425563; font-size: .95rem; }
.szolg-faq-elem[open] > .szolg-faq-valasz { animation: szolg-faq-nyit .2s ease-out; }
.szolg-faq-valasz p { margin: 0 0 10px; }
.szolg-faq-valasz ul { margin: 0 0 10px; padding-left: 22px; }
.szolg-faq-valasz li { margin: 4px 0; }
@keyframes szolg-faq-nyit { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* 12. Záró CTA (a közös .final-cta kiegészítése) ------------------------- */
.szolg-zaro .szolg-zaro-szoveg { max-width: 640px; margin: 10px 0 0; font-size: 1rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.szolg-zaro .szolg-zaro-sor { margin: 14px 0 0; font-size: .75rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }

/* ======================================================================
   /gazkazan-karbantartas/ — tisztább, megelőzés-központú komponensek
   (a fenti szolgáltatásoldali elemek mellett; új designrendszert nem vezet be)
   ====================================================================== */

/* Hero-variáns: más kompozíció, ugyanaz a komponens */
/* A keret pontosan a képernyő jobb széléig fut (nem lóg ki): a kép fő
   témája (a kazán) a fotó jobb oldalán van, és így végig látható marad. */
.szolg-hero-karb .szolg-hero-photo { top: 36px; bottom: 100px; left: 12%; right: calc(100% - 50vw); border-radius: 26px 0 0 26px; clip-path: polygon(0 0, 100% 0, 100% 100%, 14% 100%); }
.szolg-hero-karb .szolg-hero-photo img { object-position: 72% center; }
.szolg-hero-karb .szolg-hero-slice { left: auto; right: 58%; width: 9%; }
.szolg-hero-karb .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }

/* Miért fontos: bevezető + előnydoboz */
.szolg-miert-fontos { padding: 96px 0 80px; }
.szolg-miert-fontos-inner { display: grid; grid-template-columns: 1.1fr .9fr; align-items: start; gap: clamp(32px, 5vw, 80px); }
.szolg-miert-fontos-inner p { color: #425563; }
.szolg-elonyok-doboz { padding: 30px 32px; border-top: 5px solid var(--yellow); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.szolg-elonyok-doboz h3 { margin: 0 0 16px; font-size: 1.2rem; line-height: 1.2; }
.szolg-elonyok { margin: 0; padding: 0; list-style: none; }
.szolg-elonyok li { display: flex; align-items: flex-start; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); color: #0b2a42; font-size: .93rem; font-weight: 650; line-height: 1.4; transition: transform .2s ease; }
.szolg-elonyok li:first-child { border-top: 0; }
.szolg-elonyok li:hover { transform: translateX(4px); }
.szolg-elonyok li span { flex: 0 0 26px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.szolg-elonyok li span svg { width: 15px; height: 15px; }
.szolg-miert-fontos-zaro { grid-column: 1 / -1; margin: 8px 0 0; }

/* Mit tartalmazhat: műveletsor horizontális sávokkal */
.szolg-karb-tartalom { background: linear-gradient(180deg, #f7fafb, #eaf0f3); }
.szolg-karb-tartalom .szolg-javitas-foto img { object-position: 45% center; }
.szolg-muveletek { margin-top: 10px; }
.szolg-muvelet { display: flex; align-items: flex-start; gap: 16px; padding: 14px 0; border-top: 1px solid #d3dee5; transition: transform .2s ease; }
.szolg-muvelet:last-child { border-bottom: 1px solid #d3dee5; }
.szolg-muvelet:hover { transform: translateX(4px); }
.szolg-muvelet-ikon { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: var(--yellow); background: var(--ink); }
.szolg-muvelet-ikon svg { width: 22px; height: 22px; }
.szolg-muvelet h3 { margin: 0 0 4px; font-size: 1rem; line-height: 1.25; }
.szolg-muvelet p { margin: 0; color: #526572; font-size: .87rem; line-height: 1.45; }

/* Karbantartás vagy javítás: két egymásba csúszó panel (nem táblázat) */
.szolg-vs { padding: 100px 0; background: #fff; }
.szolg-vs-racs { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; }
.szolg-vs-panel { position: relative; padding: 38px 40px 40px; }
.szolg-vs-panel h3 { margin: 16px 0 10px; font-size: 1.7rem; line-height: 1.1; letter-spacing: -.02em; }
.szolg-vs-panel p { margin: 0 0 10px; font-size: .95rem; }
.szolg-vs-panel ul { margin: 0 0 16px; padding: 0; list-style: none; }
.szolg-vs-panel li { position: relative; padding: 6px 0 6px 24px; font-size: .93rem; font-weight: 650; }
.szolg-vs-panel li::before { content: ""; position: absolute; left: 0; top: 13px; width: 10px; height: 10px; border-radius: 50%; background: var(--yellow); }
.szolg-vs-alcim { font-weight: 800; }
.szolg-vs-ikon { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.szolg-vs-ikon svg { width: 25px; height: 25px; }
.szolg-vs-karb { z-index: 1; border: 1px solid var(--line); border-radius: 20px 0 0 20px; color: var(--ink); background: linear-gradient(160deg, #fff, #f1f6f8); }
.szolg-vs-karb p { color: #425563; }
.szolg-vs-jav { z-index: 2; margin: 28px 0 -28px -30px; border-radius: 20px; color: #fff; background: linear-gradient(155deg, #0b2940, #071b2b); box-shadow: 0 24px 50px rgba(13,37,55,.24); clip-path: polygon(0 0, 100% 0, 100% 100%, 5% 100%, 0 92%); }
.szolg-vs-jav p { color: rgba(255,255,255,.8); }
.szolg-vs-jav a:not(.button) { color: var(--yellow); text-decoration: underline; text-underline-offset: 3px; }
.szolg-vs-jav .button { margin-top: 8px; }

/* Mikor érdemes: sárga szezonális tipográfiai blokk */
.szolg-idozites { position: relative; color: var(--ink); background: linear-gradient(100deg, var(--yellow), #ffd83d); clip-path: polygon(0 0, 100% 6%, 100% 100%, 0 94%); }
.szolg-idozites-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(32px, 5vw, 80px); padding-block: 100px 96px; }
.szolg-idozites h2 { margin: 0 0 16px; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.05; letter-spacing: -.035em; }
.szolg-idozites-fo p { margin: 0 0 12px; font-size: .98rem; }
.szolg-idozites-fo .szolg-idozites-nagy { margin-top: 18px; font-size: clamp(2rem, 3.6vw, 3.4rem); font-weight: 900; line-height: 1; letter-spacing: -.04em; }
.szolg-idozites-szempontok { padding: 30px 32px; border-radius: 18px; background: rgba(255,255,255,.55); }
.szolg-idozites-szempontok > p { margin: 0 0 10px; font-weight: 800; }
.szolg-idozites-szempontok ul { margin: 0 0 16px; padding: 0; list-style: none; }
.szolg-idozites-szempontok li { display: flex; align-items: center; gap: 12px; padding: 8px 0; font-size: .95rem; font-weight: 700; }
.szolg-idozites-szempontok li span { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; color: var(--yellow); background: var(--ink); }
.szolg-idozites-szempontok li span svg { width: 19px; height: 19px; }
.szolg-idozites-szempontok > .szolg-idozites-zaro { margin: 0; font-size: .9rem; font-weight: 600; }

/* Kazántípusok: a hero-kép másik kivágásban */
.szolg-tipusok-kep-vagott img { aspect-ratio: 4 / 3; object-fit: cover; object-position: 80% center; }

/* Ha hibát találunk: világos, sárga akcentusos blokk */
.szolg-talalat { padding: 100px 0; overflow-x: clip; }
.szolg-talalat-inner { display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: clamp(32px, 5vw, 76px); }
.szolg-talalat-kep { position: relative; }
.szolg-talalat-kep::before { content: ""; position: absolute; inset: -18px auto auto -18px; width: 46%; height: 60%; border-radius: 18px; background: var(--yellow); }
.szolg-talalat-kep img { position: relative; width: 100%; height: auto; border-radius: 20px; box-shadow: var(--shadow); }
.szolg-talalat-copy > p { margin: 0 0 10px; color: #425563; }
.szolg-talalat-copy > .szolg-talalat-kiemeles { margin: 18px 0; padding: 16px 20px; border-left: 5px solid var(--yellow); border-radius: 0 12px 12px 0; color: var(--ink); background: #fff; font-size: 1.02rem; }
.szolg-talalat-link a { color: #0b3b5e; font-weight: 800; text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 3px; }

.szolg-markak .szolg-markak-megj { margin-top: 10px; }

/* Biztonsági blokk: a sötét, diagonális technikai szekció (szolg-eloszor) variánsa */
.szolg-biztonsag h2 { font-size: clamp(2rem, 3.6vw, 3.4rem); line-height: 1.04; letter-spacing: -.035em; }
.szolg-biztonsag .szolg-eloszor-kep img { object-position: 40% center; }

/* Kapcsolódó: 4 belépő, eltolt, váltakozó világos/sötét */
.szolg-kapcsolodo-negy { grid-template-columns: repeat(4, 1fr); }
.szolg-kapcsolodo-negy .szolg-kapcsolodo-elem:nth-child(3) { margin-top: 0; }
.szolg-kapcsolodo-negy .szolg-kapcsolodo-elem:nth-child(4) { margin-top: 40px; color: #fff; background: linear-gradient(155deg, #10314d, #071b2b); }
.szolg-kapcsolodo-negy .szolg-kapcsolodo-elem:nth-child(4) p { color: rgba(255,255,255,.74); }

/* ======================================================================
   /gazkazan-csere/ — megfontolt, műszaki komponensek
   (a közös szolgáltatásoldali elemekre épül; új designrendszert nem vezet be)
   ====================================================================== */

/* Hero-variáns: régi → új készülék a fotón; a keret a képernyő széléig fut */
.szolg-hero-csere .szolg-hero-photo { top: 44px; bottom: 96px; left: 10%; right: calc(100% - 50vw); border-radius: 22px 0 0 22px; clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%); }
.szolg-hero-csere .szolg-hero-photo img { object-position: 62% center; }
.szolg-hero-csere .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }

/* Szekcióbevezető (H2 + rövid bekezdések) */
.szolg-bevezeto { max-width: 820px; margin-bottom: 30px; }
.szolg-bevezeto .szolg-cim { margin-bottom: 14px; }
.szolg-bevezeto p { margin: 0 0 8px; color: #425563; }
.szolg-bevezeto .szolg-bevezeto-kiemelt { color: var(--ink); font-size: 1.15rem; font-weight: 800; }

/* Javítás vagy csere: a sötét panel egyetlen nagy állítással */
.szolg-vs-kozep { display: flex; flex-direction: column; justify-content: center; }
.szolg-vs-jav .szolg-vs-nagy { margin: 18px 0 0; color: #fff; font-size: clamp(1.25rem, 2vw, 1.7rem); font-weight: 800; line-height: 1.3; letter-spacing: -.01em; }

/* Új kazán kiválasztása: kép + geometrikus, eltolt szempontrács */
.szolg-szempontok { padding: 100px 0 110px; overflow-x: clip; }
.szolg-szempontok-fej { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(32px, 5vw, 76px); margin-bottom: 40px; }
.szolg-szempontok-fej p { margin: 0 0 10px; color: #425563; }
.szolg-szempontok-kep { position: relative; }
.szolg-szempontok-kep::after { content: ""; position: absolute; right: -16px; bottom: -16px; width: 40%; height: 45%; border-radius: 18px; background: var(--ink); clip-path: polygon(24% 0, 100% 0, 100% 100%, 0 100%); }
.szolg-szempontok-kep img { position: relative; z-index: 1; width: 100%; height: auto; border-radius: 20px; box-shadow: var(--shadow); }
.szolg-szempontok-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.szolg-szempont { padding: 26px 26px 28px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 10px 26px rgba(13,37,55,.06); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.szolg-szempont:nth-child(3n + 2) { margin-top: 28px; }
.szolg-szempont:hover { transform: translateY(-5px); border-color: rgba(255,199,0,.7); box-shadow: 0 20px 40px rgba(13,37,55,.14); }
.szolg-szempont h3 { margin: 16px 0 6px; font-size: 1.05rem; line-height: 1.25; }
.szolg-szempont p { margin: 0; color: #526572; font-size: .88rem; line-height: 1.5; }

/* Kondenzációs blokk: a kazántípus-elrendezés, ellenőrzőlistával */
.szolg-kondenzacios { padding-top: 100px; }
.szolg-kondenzacios .szolg-elonyok { margin: 4px 0 20px; }

/* Mit tartalmazhat: szerelési sáv */
.szolg-csere-tartalom .szolg-javitas-foto img { object-position: 35% center; }

/* Scope: karakteres, tárgyilagos sötétkék blokk */
.szolg-scope { position: relative; color: #fff; background: linear-gradient(120deg, #0c304d, #071725); clip-path: polygon(0 4%, 100% 0, 100% 96%, 0 100%); margin: -30px 0 -20px; }
.szolg-scope-inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: 26px clamp(32px, 5vw, 76px); padding-block: 110px 100px; }
.szolg-scope h2 { margin: 0 0 16px; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.05; letter-spacing: -.035em; }
.szolg-scope p { margin: 0 0 10px; color: rgba(255,255,255,.8); font-size: .96rem; }
.szolg-scope-lista { align-self: center; padding: 26px 28px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; background: rgba(255,255,255,.05); }
.szolg-scope-lista .szolg-vs-alcim { color: var(--yellow); }
.szolg-scope-lista ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 0; padding: 0; list-style: none; }
.szolg-scope-lista li { padding: 8px 14px; border: 1px solid rgba(255,199,0,.45); border-radius: 999px; color: #fff; font-size: .88rem; font-weight: 700; }
.szolg-scope-zaro { grid-column: 1 / -1; max-width: 900px; padding-left: 18px; border-left: 4px solid var(--yellow); }

/* Kapcsolódó: 5 belépő, 3 oszlopban eltolva, váltakozó világos/sötét */
.szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(n) { margin-top: 0; }
.szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(3n + 2) { margin-top: 40px; }
.szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(4) { color: #fff; background: linear-gradient(155deg, #10314d, #071b2b); }
.szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(4) p { color: rgba(255,255,255,.74); }

/* ======================================================================
   /gazkeszulek-karbantartas/ — tágabb belépőoldal, készülékválasztóval
   ====================================================================== */

/* Hero-variáns: lekerekített, alul-jobbra levágott fotókeret */
.szolg-hero-keszulek .szolg-hero-photo { top: 52px; bottom: 88px; left: 8%; right: calc(100% - 50vw); border-radius: 26px 0 0 26px; clip-path: polygon(0 0, 100% 0, 100% 100%, 16% 100%, 0 82%); }
.szolg-hero-keszulek .szolg-hero-photo img { object-position: 38% center; }
.szolg-hero-keszulek .szolg-hero-slice { left: 0; width: 7%; }

/* KÉSZÜLÉKVÁLASZTÓ — az oldal egyedi eleme: 1 nagy + 3 eltérő arányú blokk + segítőpanel */
.kv { padding: 96px 0 100px; }
.kv-racs { display: grid; grid-template-columns: 1.3fr 1fr 1fr; grid-template-rows: auto auto; gap: 18px; }
.kv-elem { position: relative; display: flex; flex-direction: column; padding: 28px 28px 26px; border: 1px solid var(--line); border-radius: 18px; color: var(--ink); background: #fff; box-shadow: 0 12px 28px rgba(13,37,55,.07); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.kv-elem:hover { transform: translateY(-5px); border-color: rgba(255,199,0,.8); box-shadow: 0 22px 44px rgba(13,37,55,.16); }
.kv-elem h3 { margin: 16px 0 8px; font-size: 1.25rem; line-height: 1.15; letter-spacing: -.01em; }
.kv-elem p { margin: 0 0 18px; color: #526572; font-size: .9rem; line-height: 1.5; }
.kv-ikon { width: 60px; height: 60px; display: grid; place-items: center; border-radius: 16px; color: var(--ink); background: var(--yellow); }
.kv-ikon svg { width: 32px; height: 32px; stroke-width: 1.6; }
.kv-cel { display: inline-flex; align-items: center; gap: 10px; margin-top: auto; color: #0b3b5e; font-size: .88rem; font-weight: 850; }
.kv-nyil { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); transition: transform .2s ease; }
.kv-nyil svg { width: 17px; height: 17px; }
.kv-elem:hover .kv-nyil { transform: translateX(4px); }
/* 1: gázkazán — nagy, sötét, két sort átérő blokk diagonális levágással */
.kv-elem-1 { grid-column: 1; grid-row: 1 / 3; justify-content: flex-end; min-height: 460px; padding: 40px 38px 36px; overflow: hidden; color: #fff; border-color: transparent; background: linear-gradient(160deg, #0f3252, #071b2b 70%); clip-path: polygon(0 0, 100% 0, 100% 90%, 90% 100%, 0 100%); }
.kv-elem-1::before { content: ""; position: absolute; top: -20%; right: -18%; width: 60%; height: 140%; background: linear-gradient(180deg, rgba(255,199,0,.18), rgba(255,199,0,0)); transform: skewX(-14deg); pointer-events: none; }
.kv-elem-1 .kv-ikon { width: 84px; height: 84px; border-radius: 22px; }
.kv-elem-1 .kv-ikon svg { width: 46px; height: 46px; }
.kv-elem-1 h3 { font-size: clamp(1.8rem, 2.8vw, 2.6rem); line-height: 1; letter-spacing: -.035em; }
.kv-elem-1 p { max-width: 440px; color: rgba(255,255,255,.78); font-size: 1rem; }
.kv-elem-1 .kv-cel { color: var(--yellow); }
/* 2–4: eltérő arányú, eltérő tónusú kisebb blokkok */
.kv-elem-2 { grid-column: 2; grid-row: 1; }
.kv-elem-3 { grid-column: 3; grid-row: 1; margin-top: 34px; background: linear-gradient(160deg, #f1f6f9, #e3ecf1); }
.kv-elem-4 { grid-column: 2; grid-row: 2; border-left: 5px solid var(--yellow); }
.kv-segitseg { grid-column: 3; grid-row: 2; display: flex; flex-direction: column; padding: 26px 26px 24px; border-radius: 18px; color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); box-shadow: 0 16px 34px rgba(255,199,0,.25); transform: rotate(-1.2deg); }
.kv-segitseg h3 { margin: 0 0 8px; font-size: 1.12rem; line-height: 1.2; }
.kv-segitseg p { margin: 0 0 16px; font-size: .9rem; font-weight: 600; }
.kv-segitseg-gombok { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.kv-segitseg-gombok .button { min-height: 46px; padding: 10px 14px; font-size: .84rem; }

/* Karbantartás vagy javítás: kétirányú link a javítás / szivárgás oldalak felé */
.kv-vs-linkek { display: grid; gap: 14px; margin-top: 8px; }
.kv-vs-linkek h4 { margin: 0 0 8px; color: var(--yellow); font-size: .82rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }

/* Folyamat: a 2. lépés (beazonosítás) kiemelt */
.szolg-folyamat-lista li.kv-lepes-kiemelt .szolg-folyamat-szam { background: var(--yellow); box-shadow: 0 0 0 7px rgba(255,199,0,.22); }
.szolg-folyamat-lista li.kv-lepes-kiemelt h3 { color: #0b3b5e; }
.szolg-folyamat-lista li.kv-lepes-kiemelt p { color: var(--ink); font-weight: 600; }

/* Műszeres ellenőrzés: sötét technikai blokk (szolg-eloszor-variáns) */
.kv-muszeres h2 { font-size: clamp(2.2rem, 4vw, 3.8rem); }
.kv-muszeres .szolg-eloszor-kep img { object-position: 40% center; }

/* Ha hibát találunk: sárga blokk nagy tipográfiai állítással */
.kv-hiba { margin-top: 20px; }
.kv-hiba .kv-hiba-nagy { margin: 0; font-size: clamp(1.6rem, 2.8vw, 2.5rem); font-weight: 900; line-height: 1.08; letter-spacing: -.03em; }

/* Scope: háttérben a gépészeti kép, finoman */
.kv-scope { overflow: hidden; }
.kv-scope-kep { position: absolute; top: 0; right: 0; bottom: 0; width: 34%; opacity: .32; pointer-events: none; }
.kv-scope-kep img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.kv-scope-kep::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0c304d, transparent 70%); }
.kv-scope .szolg-scope-inner { position: relative; z-index: 1; }

/* Biztonsági blokk: rövid, karakteres */
.kv-biztonsag { padding-top: 90px; }
.kv-biztonsag .szolg-cirko-doboz h2 { font-size: 1.6rem; }
.kv-biztonsag-gomb { margin-top: 16px; }
.kv-biztonsag-gomb small { display: block; margin-top: 3px; font-size: .66rem; opacity: .75; }

/* ======================================================================
   /gazkonvektor-szerviz/ — lakótéri, klasszikus konvektoros karakter
   ====================================================================== */

/* Hero-variáns: nagy lekerekített, „otthonos" felső sarok, a keret a viewport széléig */
.szolg-hero-konv .szolg-hero-photo { top: 58px; bottom: 84px; left: 7%; right: calc(100% - 50vw); border-radius: 140px 0 0 22px; clip-path: none; }
.szolg-hero-konv .szolg-hero-photo img { object-position: 45% center; }
.szolg-hero-konv .szolg-hero-slice { top: auto; bottom: 40px; left: 0; width: 30%; height: 44%; border-radius: 0 0 0 26px; transform: translate3d(var(--pointer-x-back, 0px), calc(var(--parallax-y) + var(--pointer-y-back, 0px)), 0) skewX(-12deg); }

/* Hibajelenségek: 1 nagy (nem gyullad be) + 1 hangsúlyos (őrláng) + 4 kisebb */
.konv-hibak-racs { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 18px; }
.konv-hiba-1 { grid-column: 1; grid-row: 1 / 4; justify-content: flex-end; min-height: 440px; padding: 38px 36px; overflow: hidden; color: #fff; border-color: transparent; background: linear-gradient(165deg, #0f3252, #071b2b 72%); clip-path: polygon(0 0, 100% 0, 100% 92%, 88% 100%, 0 100%); }
.konv-hiba-1::before { content: ""; position: absolute; top: -18%; right: -20%; width: 62%; height: 140%; background: linear-gradient(180deg, rgba(255,199,0,.2), rgba(255,199,0,0)); transform: skewX(-14deg); pointer-events: none; }
.konv-hiba-1 .szolg-hiba-fej { position: absolute; top: 34px; left: 36px; right: 36px; }
.konv-hiba-1 .szolg-hiba-ikon { width: 78px; height: 78px; border-radius: 22px; }
.konv-hiba-1 .szolg-hiba-ikon svg { width: 42px; height: 42px; }
.konv-hiba-1 .szolg-hiba-szam { color: var(--yellow); font-size: 3.4rem; }
.konv-hiba-1 h3 { font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1; letter-spacing: -.035em; }
.konv-hiba-1 p { color: rgba(255,255,255,.78); font-size: .98rem; }
.konv-hiba-2 { grid-column: 2 / 4; grid-row: 1; padding: 30px 34px; border: 0; border-left: 6px solid var(--yellow); background: linear-gradient(120deg, #fff6d1, #fff 70%); }
.konv-hiba-2 .szolg-hiba-szam { color: #e0b100; font-size: 2.6rem; }
.konv-hiba-2 h3 { font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.1; }
.konv-hiba-2 p { color: #425563; font-size: .95rem; }
.konv-hiba-3, .konv-hiba-5 { grid-column: 2; }
.konv-hiba-4, .konv-hiba-6 { grid-column: 3; }
.konv-hiba-3 .szolg-hiba-ikon, .konv-hiba-4 .szolg-hiba-ikon, .konv-hiba-5 .szolg-hiba-ikon, .konv-hiba-6 .szolg-hiba-ikon { border-radius: 14px; color: var(--yellow); background: var(--ink); }
.konv-gazszag-sor { display: flex; align-items: center; gap: 16px; margin: 26px 0 0; padding: 16px 22px; border-radius: 14px; color: #fff; background: var(--ink); font-size: .98rem; line-height: 1.4; }
.konv-gazszag-ikon { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: var(--ink); background: var(--yellow); }
.konv-gazszag-ikon svg { width: 24px; height: 24px; }

/* Mit jelent nálunk: három összekapcsolódó irány (lánc) */
.konv-iranyok { padding: 100px 0 110px; overflow-x: clip; }
.konv-lanc { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 20px 0 0; padding: 0; list-style: none; }
.konv-lanc::before { content: ""; position: absolute; z-index: 0; top: 50%; left: 6%; right: 6%; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--yellow), #ffe16b); transform: translateY(-50%); }
.konv-lanc-elem { position: relative; z-index: 1; display: flex; flex-direction: column; min-height: 300px; margin: 0 14px; padding: 36px 34px 34px; border-radius: 22px; box-shadow: 0 18px 40px rgba(13,37,55,.12); transition: transform .25s ease, box-shadow .25s ease; }
.konv-lanc-elem:hover { transform: translateY(-5px); box-shadow: 0 26px 50px rgba(13,37,55,.18); }
.konv-lanc-elem-1 { margin-left: 0; color: #fff; background: linear-gradient(155deg, #0f3252, #071b2b); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.konv-lanc-elem-2 { margin-top: 36px; color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); }
.konv-lanc-elem-3 { margin-right: 0; margin-top: 72px; color: var(--ink); border: 1px solid var(--line); background: #fff; }
.konv-lanc-ikon { width: 70px; height: 70px; display: grid; place-items: center; margin-bottom: 22px; border-radius: 20px; color: var(--ink); background: var(--yellow); }
.konv-lanc-elem-2 .konv-lanc-ikon { color: var(--yellow); background: var(--ink); }
.konv-lanc-ikon svg { width: 36px; height: 36px; stroke-width: 1.6; }
.konv-lanc-elem h3 { margin: 0 0 10px; font-size: clamp(1.6rem, 2.4vw, 2.2rem); line-height: 1.05; letter-spacing: -.03em; }
.konv-lanc-elem p { margin: 0; font-size: .95rem; line-height: 1.5; }
.konv-lanc-elem-1 p { color: rgba(255,255,255,.78); }
.konv-lanc-elem-3 p { color: #425563; }
.konv-lanc-nyil { position: absolute; z-index: 2; top: 50%; right: -37px; width: 46px; height: 46px; display: grid; place-items: center; border: 4px solid #fff; border-radius: 50%; color: var(--ink); background: var(--yellow); transform: translateY(-50%); box-shadow: 0 8px 18px rgba(13,37,55,.2); }
.konv-lanc-elem-2 .konv-lanc-nyil { color: var(--yellow); background: var(--ink); }
.konv-lanc-nyil svg { width: 20px; height: 20px; }
.konv-iranyok-zaro { max-width: 900px; margin: 56px 0 0; padding-left: 18px; border-left: 5px solid var(--yellow); color: var(--ink); font-size: clamp(1.1rem, 1.6vw, 1.4rem); line-height: 1.35; }

/* Tisztítás: nagy technikai közelkép + számozott sáv */
.konv-tisztitas .szolg-javitas-inner { grid-template-columns: 1.2fr .8fr; }
.konv-tisztitas .szolg-javitas-foto { border-radius: 22px 22px 22px 90px; }
.konv-tisztitas .szolg-javitas-foto img { object-position: 50% center; }
.konv-tisztitas .szolg-megjegyzes { margin: 0; color: var(--ink); }

/* Gyújtás / őrláng / szabályozás: sötét blokk, a kép a BAL oldalon */
.konv-gyujtas .szolg-eloszor-kep { left: 0; right: auto; width: 50%; clip-path: polygon(0 0, 100% 0, 84% 100%, 0 100%); }
.konv-gyujtas .szolg-eloszor-kep img { object-position: 45% center; }
.konv-gyujtas .szolg-eloszor-kep::after { background: linear-gradient(270deg, rgba(7,20,33,.85), transparent 45%); }
.konv-gyujtas .szolg-eloszor-inner { justify-content: flex-end; }
.konv-gyujtas .szolg-eloszor-copy { max-width: 540px; }
.konv-gyujtas h2 { font-size: clamp(2.3rem, 4.2vw, 4rem); }
.konv-gyujtas-lista { margin: 24px 0 0; padding: 0; list-style: none; }
.konv-gyujtas-lista li { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.14); font-size: .98rem; font-weight: 700; line-height: 1.35; }
.konv-gyujtas-lista span { flex: 0 0 46px; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.konv-gyujtas-lista span svg { width: 23px; height: 23px; }

/* Régi konvektor ≠ automatikus csere: világos lakótéri fotó + sötét diagonális panel */
.konv-regi { position: relative; padding: 110px 0 100px; overflow-x: clip; }
.konv-regi-kep { position: absolute; top: 110px; bottom: 170px; left: 0; width: 62%; }
.konv-regi-foto { position: absolute; inset: 0; overflow: hidden; border-radius: 0 26px 26px 0; box-shadow: 0 24px 50px rgba(13,37,55,.18); transform: translate3d(0, var(--parallax-y), 0); will-change: transform; }
.konv-regi-foto img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 40% center; }
.konv-regi-inner { position: relative; z-index: 1; display: flex; justify-content: flex-end; padding-top: 70px; }
.konv-regi-panel { width: min(600px, 100%); padding: 48px 48px 44px 70px; color: #fff; background: linear-gradient(140deg, #0f3252, #071725); clip-path: polygon(9% 0, 100% 0, 100% 100%, 0 100%); border-radius: 0 22px 22px 0; box-shadow: 0 30px 60px rgba(0,0,0,.28); }
.konv-regi-panel h2 { margin: 0 0 18px; color: var(--yellow); font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.04; letter-spacing: -.035em; }
.konv-regi-panel > p { margin: 0 0 10px; color: rgba(255,255,255,.8); font-size: .95rem; }
.konv-regi-panel > .konv-regi-alcim { margin-top: 16px; color: var(--yellow); font-size: .82rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.konv-regi-lista { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; margin: 4px 0 18px; padding: 0; list-style: none; }
.konv-regi-lista li { display: flex; align-items: center; gap: 10px; font-size: .9rem; font-weight: 700; line-height: 1.3; }
.konv-regi-lista span { flex: 0 0 24px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.konv-regi-lista span svg { width: 13px; height: 13px; }
.konv-regi-panel > .konv-regi-fo { margin: 22px 0 0; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.16); color: #fff; font-size: clamp(1.5rem, 2.4vw, 2.1rem); line-height: 1.08; letter-spacing: -.03em; }
.konv-regi-fo span { display: block; color: var(--yellow); }

/* FÉG és más konvektorok: kompakt típusblokk */
.konv-feg { padding: 20px 0 110px; }
.konv-feg-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(32px, 5vw, 76px); }
.konv-feg-ikon { width: 64px; height: 64px; display: grid; place-items: center; margin-bottom: 20px; border-radius: 18px; color: var(--yellow); background: var(--ink); }
.konv-feg-ikon svg { width: 34px; height: 34px; }
.konv-feg h2 { margin: 0 0 14px; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.05; letter-spacing: -.035em; }
.konv-feg-copy p { margin: 0 0 10px; color: #425563; }
.konv-feg-kartya { position: relative; padding: 32px 34px; border: 1px solid var(--line); border-top: 5px solid var(--yellow); border-radius: 18px; background: #fff; box-shadow: var(--shadow); transform: rotate(.8deg); }
.konv-feg-kartya p { margin: 0 0 10px; color: #425563; font-size: .93rem; }
.konv-feg-kartya .konv-feg-alcim { color: var(--ink); font-weight: 800; }
.konv-feg-kartya ul { margin: 0 0 10px; padding: 0; list-style: none; }
.konv-feg-kartya li { position: relative; padding: 7px 0 7px 22px; color: #0b2a42; font-size: .93rem; font-weight: 700; }
.konv-feg-kartya li::before { content: ""; position: absolute; left: 0; top: 14px; width: 10px; height: 10px; border-radius: 50%; background: var(--yellow); }
.konv-feg-kartya .konv-feg-megj { margin: 14px 0 18px; padding: 12px 16px; border-radius: 10px; color: var(--ink); background: #f1f6f9; }

/* Szezon előtti karbantartás: a sárga időzítési blokk */
.konv-szezon .szolg-idozites-fo p { font-size: 1.05rem; }

/* Gázszag: tárgyilagos, brandelt figyelmeztető doboz (nem piros riasztás) */
.konv-gazszag { padding-top: 100px; }
.konv-gazszag .szolg-cirko-doboz { border-left-width: 6px; }
.konv-gazszag-link { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 16px !important; }
.konv-gazszag-link span { color: var(--ink); font-weight: 800; }
.konv-gazszag .konv-gazszag-zaro { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--ink); font-weight: 650; }

/* ======================================================================
   /gazszivargas-kereses-javitas/ — nyugodt, műszeres, biztonságközpontú
   (nincs piros, nincs villogás / pulzálás)
   ====================================================================== */

/* Hero-variáns: egyenes, technikai keret; a szerelő a kép jobb oldalán */
.szolg-hero-szivargas .szolg-hero-photo { top: 44px; bottom: 96px; left: 10%; right: calc(100% - 50vw); border-radius: 22px 0 0 22px; clip-path: polygon(0 0, 100% 0, 100% 100%, 12% 100%); }
.szolg-hero-szivargas .szolg-hero-photo img { object-position: 72% center; }
.szolg-hero-szivargas .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }
.szolg-hero-szivargas .szv-hero-hatar { padding-left: 14px; border-left: 3px solid var(--yellow); color: #fff; font-weight: 650; }
.szolg-hero-szivargas + .szv-biztonsag { margin-top: 0; }

/* Kiemelt biztonsági blokk — a hero utáni első tartalmi szekció */
.szv-biztonsag { position: relative; color: #fff; background: linear-gradient(135deg, #0e1c27, #0a2536 60%, #0d1f2c); border-top: 6px solid var(--yellow); }
.szv-biztonsag::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 10px; background: repeating-linear-gradient(-45deg, var(--yellow) 0 12px, #0e1c27 12px 24px); opacity: .9; }
.szv-biztonsag-inner { display: grid; grid-template-columns: 1.05fr .95fr; align-items: start; gap: clamp(32px, 5vw, 76px); padding-block: 84px 140px; }
.szv-biztonsag-ikon { width: 64px; height: 64px; display: grid; place-items: center; margin-bottom: 20px; border-radius: 18px; color: var(--ink); background: var(--yellow); }
.szv-biztonsag-ikon svg { width: 34px; height: 34px; }
.szv-biztonsag h2 { margin: 0 0 18px; color: var(--yellow); font-size: clamp(2rem, 3.6vw, 3.3rem); line-height: 1.02; letter-spacing: -.04em; }
.szv-biztonsag h2 span { display: block; margin-top: 8px; color: #fff; font-size: .56em; letter-spacing: -.02em; }
.szv-biztonsag-fo > p { margin: 0 0 12px; color: rgba(255,255,255,.82); font-size: 1rem; }
.szv-biztonsag-fo > .szv-biztonsag-kiemelt { margin: 20px 0; padding: 16px 20px; border: 2px solid var(--yellow); border-radius: 12px; color: #fff; background: rgba(255,199,0,.1); font-size: clamp(1.1rem, 1.6vw, 1.35rem); line-height: 1.3; }
.szv-mvm-gomb { margin-top: 8px; min-height: 54px; }
.szv-teendok { padding: 30px 32px; border-radius: 18px; color: var(--ink); background: #fff; box-shadow: 0 24px 50px rgba(0,0,0,.3); }
.szv-teendok h3 { margin: 0 0 14px; font-size: 1.3rem; line-height: 1.2; }
.szv-teendok ol { margin: 0; padding: 0; list-style: none; counter-reset: teendo; }
.szv-teendok li { position: relative; padding: 11px 0 11px 48px; border-top: 1px solid var(--line); counter-increment: teendo; color: #0b2a42; font-size: .98rem; font-weight: 700; line-height: 1.35; }
.szv-teendok li::before { content: counter(teendo); position: absolute; top: 50%; left: 0; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: var(--yellow); background: var(--ink); font-size: .85rem; font-weight: 900; transform: translateY(-50%); }
.szv-teendok li:last-child { color: var(--ink); font-weight: 850; }

/* Miben tud segíteni: világos scope + „készülék / közvetlen csatlakozás" ábra */
.szv-segitseg { padding: 110px 0 100px; }
.szv-segitseg-inner { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: clamp(32px, 5vw, 76px); }
.szv-segitseg-copy > p { margin: 0 0 10px; color: #425563; }
.szv-segitseg-copy > .szolg-vs-alcim { margin-top: 18px; color: var(--ink); }
.szv-segitseg .szolg-elonyok { margin: 6px 0 22px; }
.szv-segitseg .szolg-megjegyzes { color: var(--ink); }
.szv-abra { margin: 0; padding: 26px; border-radius: 24px; background: linear-gradient(160deg, #fff, #eef3f6); box-shadow: var(--shadow); }
.szv-abra svg { display: block; width: 100%; height: auto; }
.szv-abra-hatar { fill: rgba(255,199,0,.1); stroke: var(--yellow); stroke-width: 3; stroke-dasharray: 10 8; }
.szv-abra-keszulek { fill: #fff; stroke: var(--ink); stroke-width: 3; }
.szv-abra-kijelzo { fill: var(--ink); }
.szv-abra-pont { fill: none; stroke: #c9d4db; stroke-width: 3; }
.szv-abra-cso { fill: none; stroke: #b0793f; stroke-width: 9; stroke-linecap: round; }
.szv-abra-kotes { fill: #d9a441; stroke: var(--ink); stroke-width: 2.5; }
.szv-abra-kotes-fo { fill: var(--yellow); }
.szv-abra-gyuru { fill: none; stroke: var(--ink); stroke-width: 2.5; stroke-dasharray: 4 5; }
.szv-abra-halo { fill: none; stroke: #cfd8de; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 2 12; }
.szv-abra-cimke { fill: var(--ink); stroke: none; font-size: 15px; font-weight: 800; text-anchor: middle; }
.szv-abra-cimke-hatter { fill: var(--yellow); }

/* Mit nem vállalunk: a sötét scope-komponens, tiltás-ikonos chipekkel */
.szv-scope .szolg-scope-lista li { display: inline-flex; align-items: center; gap: 8px; }
.szv-scope .szolg-scope-lista li svg { width: 17px; height: 17px; flex: 0 0 17px; color: var(--yellow); }

/* Műszeres hibafeltárás: nagy technikai közelkép */
.szv-muszeres .szolg-javitas-inner { grid-template-columns: 1.15fr .85fr; }
.szv-muszeres .szolg-javitas-foto img { object-position: 45% center; }
.szv-muszeres .szv-muszeres-megj { margin-top: 22px; }

/* Javítás: aszimmetrikus világos blokk, a kép a jobb oldalon */
.szv-javitas { background: linear-gradient(180deg, #f7fafb, #fff); }
.szv-javitas .szolg-talalat-inner { grid-template-columns: 1fr 1fr; }
.szv-javitas .szolg-talalat-kep { margin-top: 40px; }
.szv-javitas .szolg-talalat-kep::before { inset: auto -18px -18px auto; width: 50%; height: 55%; }
.szv-javitas .szolg-vs-alcim { margin: 16px 0 0; color: var(--ink); }

/* Készüléktípusok: négy kompakt eszközblokk */
.szv-keszulekek { padding: 40px 0 100px; }
.szv-keszulek-sor { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 0; padding: 0; list-style: none; }
.szv-keszulek-sor li { display: flex; align-items: center; gap: 14px; min-height: 92px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: #fff; font-size: 1.02rem; font-weight: 800; line-height: 1.25; box-shadow: 0 10px 24px rgba(13,37,55,.06); transition: transform .25s ease, border-color .25s ease; }
.szv-keszulek-sor li:nth-child(even) { transform: translateY(14px); }
.szv-keszulek-sor li:hover { border-color: rgba(255,199,0,.8); }
.szv-keszulek-ikon { flex: 0 0 52px; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 14px; color: var(--ink); background: var(--yellow); }
.szv-keszulek-ikon svg { width: 28px; height: 28px; stroke-width: 1.6; }
.szv-keszulek-folyt { margin: 30px 0 12px; color: #425563; }

/* Folyamat: az első (Biztonság) lépés eltér a normál timeline-tól */
.szolg-folyamat-lista li.szv-lepes-biztonsag { padding: 0 18px 20px; border-radius: 16px; color: #fff; background: linear-gradient(160deg, #0f3252, #071b2b); box-shadow: 0 16px 34px rgba(13,37,55,.2); }
.szolg-folyamat-lista li.szv-lepes-biztonsag .szolg-folyamat-szam { border-color: var(--yellow); color: var(--yellow); background: var(--ink); }
.szolg-folyamat-lista li.szv-lepes-biztonsag .szolg-folyamat-ikon { left: 72px; color: var(--ink); background: var(--yellow); }
.szolg-folyamat-lista li.szv-lepes-biztonsag h3 { color: var(--yellow); }
.szolg-folyamat-lista li.szv-lepes-biztonsag p { color: rgba(255,255,255,.82); }

/* Miért nem elég a szag: diagnosztikai sötét blokk, halvány gépészeti háttér */
.szv-szag { position: relative; overflow: hidden; color: #fff; background: linear-gradient(120deg, #071521, #0b2942); clip-path: polygon(0 4%, 100% 0, 100% 100%, 0 100%); }
.szv-szag-kep { position: absolute; top: 0; right: 0; bottom: 0; width: 42%; opacity: .5; transform: translate3d(0, var(--parallax-y), 0) scale(1.06); will-change: transform; }
.szv-szag-kep img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center 40%; }
.szv-szag-kep::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0a2439, rgba(10,36,57,.2) 60%); }
.szv-szag-inner { position: relative; z-index: 1; padding-block: 120px 100px; }
.szv-szag-copy { max-width: 660px; }
.szv-szag h2 { margin: 0 0 20px; color: var(--yellow); font-size: clamp(2rem, 3.8vw, 3.5rem); line-height: 1.02; letter-spacing: -.04em; }
.szv-szag-copy > p { margin: 0 0 12px; color: rgba(255,255,255,.8); }
.szv-szag-lista { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 22px 0 0; padding: 0; list-style: none; }
.szv-szag-lista li { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; background: rgba(255,255,255,.05); font-size: .93rem; font-weight: 750; line-height: 1.3; }
.szv-szag-lista span { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.szv-szag-lista span svg { width: 20px; height: 20px; }

/* Márkasáv: a lista fölötti felirat */
.szolg-markak .szv-markak-cim { margin: 0 0 10px; color: var(--yellow); font-size: .8rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }

/* ======================================================================
   /gazbojler-javitas/ — tárolós melegvíz-készítő; „Vízmelegítők és bojlerek"
   ====================================================================== */

/* Hero-variáns: kapszula alakú sárga sáv (tartály-asszociáció), alul ferde vágás */
.szolg-hero-bojler .szolg-hero-photo { top: 40px; bottom: 92px; left: 12%; right: calc(100% - 50vw); border-radius: 22px 0 0 22px; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 88%); }
.szolg-hero-bojler .szolg-hero-photo img { object-position: 40% center; }
.szolg-hero-bojler .szolg-hero-slice { top: 14%; bottom: 10%; left: 3%; width: 9%; border-radius: 999px; }

/* Hibajelenségek: 1 széles sötét + 1 sárga + 3 eltolt + 1 vízszintes sáv */
.gb-hibak-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: start; }
.gb-hiba-1 { grid-column: span 2; flex-direction: row; align-items: center; gap: 30px; min-height: 230px; padding: 36px 38px; overflow: hidden; color: #fff; border-color: transparent; background: linear-gradient(135deg, #0f3252, #071b2b 75%); clip-path: polygon(0 0, 100% 0, 100% 86%, 95% 100%, 0 100%); }
.gb-hiba-1::before { content: ""; position: absolute; left: -10%; right: -10%; bottom: -60px; height: 120px; border-radius: 50%; background: rgba(255,199,0,.12); pointer-events: none; }
.gb-hiba-1 .szolg-hiba-fej { flex-direction: column; align-items: flex-start; gap: 14px; margin: 0; }
.gb-hiba-1 .szolg-hiba-ikon { width: 76px; height: 76px; border-radius: 22px; }
.gb-hiba-1 .szolg-hiba-ikon svg { width: 40px; height: 40px; }
.gb-hiba-1 .szolg-hiba-szam { color: var(--yellow); font-size: 3.2rem; }
.gb-hiba-1 h3 { font-size: clamp(1.8rem, 2.8vw, 2.6rem); line-height: 1; letter-spacing: -.035em; }
.gb-hiba-1 p { max-width: 460px; color: rgba(255,255,255,.78); font-size: .98rem; }
.gb-hiba-2 { min-height: 230px; border: 0; background: linear-gradient(145deg, var(--yellow), #ffd83d); }
.gb-hiba-2 .szolg-hiba-ikon { color: var(--yellow); background: var(--ink); }
.gb-hiba-2 .szolg-hiba-szam { color: rgba(7,20,33,.35); }
.gb-hiba-2 p { color: #2b3a44; }
.gb-hiba-4 { margin-top: 26px; }
.gb-hiba-5 { border-left: 5px solid var(--ink); }
.gb-hiba-3 .szolg-hiba-ikon, .gb-hiba-4 .szolg-hiba-ikon, .gb-hiba-5 .szolg-hiba-ikon { border-radius: 14px; }
.gb-hiba-6 { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 22px; border: 2px dashed rgba(255,199,0,.75); background: #fffdf3; }
.gb-hiba-6 .szolg-hiba-fej { margin: 0; gap: 14px; }
.gb-hiba-6 .szolg-hiba-ikon { color: var(--yellow); background: var(--ink); }
.gb-gazszag-sor { flex-wrap: wrap; }
.gb-gazszag-sor p { flex: 1 1 260px; margin: 0; }
.gb-gazszag-sor .button { min-height: 46px; padding: 10px 16px; font-size: .86rem; }

/* „Gázbojler vagy átfolyós?" — az oldal egyedi UX-eleme */
.gb-valaszto { padding: 100px 0 110px; overflow-x: clip; }
.gb-valaszto-racs { display: grid; grid-template-columns: 1.15fr .85fr; gap: 22px; align-items: start; }
.gb-panel { position: relative; display: flex; flex-direction: column; border-radius: 22px; }
.gb-panel h3 { margin: 18px 0 10px; font-size: clamp(1.6rem, 2.4vw, 2.2rem); line-height: 1.05; letter-spacing: -.03em; }
.gb-panel p { margin: 0 0 12px; font-size: .98rem; line-height: 1.5; }
.gb-panel-ikon { width: 78px; height: 78px; display: grid; place-items: center; border-radius: 22px; }
.gb-panel-ikon svg { width: 44px; height: 44px; stroke-width: 1.5; }
.gb-panel-sajat { min-height: 360px; padding: 42px 42px 38px; overflow: hidden; color: #fff; background: linear-gradient(160deg, #0f3252, #071b2b 70%); box-shadow: 0 26px 50px rgba(13,37,55,.25); clip-path: polygon(0 0, 100% 0, 100% 90%, 92% 100%, 0 100%); }
/* Díszítés: tartály (kapszula-gyűrű) vagy vízáramlás (szaggatott sáv) — panelszíntől függetlenül */
.gb-deko-tartaly::before { content: ""; position: absolute; top: -12%; right: -8%; width: 38%; height: 124%; border-radius: 999px; border: 3px solid rgba(255,199,0,.22); pointer-events: none; }
.gb-panel-masik.gb-deko-tartaly::before { border-color: rgba(11,59,94,.12); }
.gb-panel-sajat .gb-panel-ikon { color: var(--ink); background: var(--yellow); }
.gb-panel-sajat p { color: rgba(255,255,255,.8); }
.gb-panel-sajat .gb-panel-jelzes { display: flex; align-items: center; gap: 12px; margin-top: auto; padding: 14px 18px; border-radius: 12px; color: var(--ink); background: var(--yellow); }
.gb-panel-jelzes svg { flex: 0 0 22px; width: 22px; height: 22px; }
.gb-panel-masik { overflow: hidden; margin-top: 44px; padding: 34px 34px 32px; border: 1px solid var(--line); color: var(--ink); background: #fff; box-shadow: 0 14px 30px rgba(13,37,55,.08); }
.gb-deko-aramlas::after { content: ""; position: absolute; left: 34px; right: 34px; top: 118px; height: 12px; background: repeating-linear-gradient(90deg, rgba(11,59,94,.18) 0 16px, transparent 16px 26px); border-radius: 6px; pointer-events: none; }
.gb-panel-sajat.gb-deko-aramlas::after { left: 42px; right: 42px; top: 134px; background: repeating-linear-gradient(90deg, rgba(255,199,0,.45) 0 16px, transparent 16px 26px); }
.gb-panel-masik .gb-panel-ikon { color: var(--yellow); background: var(--ink); }
.gb-deko-aramlas h3 { margin-top: 34px; }
.gb-panel-masik p { color: #425563; }
.gb-panel-masik .gb-panel-link-szoveg { margin-top: 6px; color: var(--ink); font-weight: 700; }
.gb-panel-masik .button { align-self: flex-start; border-color: var(--ink); color: var(--ink); background: transparent; }
.gb-panel-masik .button:hover { background: var(--ink); color: #fff; }
.gb-nemtudod { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; margin-top: 30px; padding: 26px 30px; border-radius: 18px; color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); box-shadow: 0 16px 34px rgba(255,199,0,.25); transform: rotate(-.6deg); }
.gb-nemtudod-ikon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 16px; color: var(--yellow); background: var(--ink); }
.gb-nemtudod-ikon svg { width: 30px; height: 30px; }
.gb-nemtudod h3 { margin: 0 0 4px; font-size: 1.25rem; line-height: 1.2; }
.gb-nemtudod p { margin: 0; font-size: .95rem; font-weight: 600; }
.gb-nemtudod-gombok { display: flex; flex-wrap: wrap; gap: 8px; }
.gb-nemtudod-gombok .button { min-height: 48px; }

/* Mit jelent a javítás: technikai közelkép + kisebb inset kép */
.gb-javitas .szolg-javitas-foto img { object-position: 45% center; }
.gb-inset { position: absolute; z-index: 3; left: -16px; bottom: -40px; width: 40%; overflow: hidden; border: 6px solid #fff; border-radius: 16px; box-shadow: 0 18px 36px rgba(13,37,55,.25); }
.gb-inset img { display: block; width: 100%; height: auto; }
.gb-javitas .szolg-kiemeles { margin-top: 6px; }

/* Régebbi gázbojler: a világos fotó + sötét diagonális panel komponens */
.gb-regi .konv-regi-foto img { object-position: 62% center; }

/* Karbantartás: világos, kompakt blokk (nem külön landing) */
.gb-karb { padding: 20px 0 20px; }
.gb-karb-inner { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(28px, 4vw, 60px); padding: 40px 44px; border: 1px solid var(--line); border-top: 5px solid var(--yellow); border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.gb-karb-ikon { width: 58px; height: 58px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 16px; color: var(--yellow); background: var(--ink); }
.gb-karb-ikon svg { width: 30px; height: 30px; }
.gb-karb h2 { margin: 0 0 12px; font-size: clamp(1.7rem, 2.6vw, 2.4rem); line-height: 1.05; letter-spacing: -.035em; }
.gb-karb-inner > div > p { margin: 0 0 10px; color: #425563; }
.gb-karb .szolg-vs-alcim { margin: 0 0 4px; color: var(--ink); }
.gb-karb .szolg-elonyok { margin: 0 0 14px; }
.gb-karb .gb-karb-megj { margin: 0 0 16px; color: var(--ink); font-weight: 650; }

/* Márkafüggetlen: típus + fotó + típustábla hangsúly, teljes márkalista nélkül */
.gb-marka { color: var(--ink); background: linear-gradient(180deg, #f7fafb, #eaf0f3); }
.gb-marka-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(32px, 5vw, 76px); padding-block: 80px; }
.gb-marka h2 { margin: 0 0 14px; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.05; letter-spacing: -.035em; }
.gb-marka-inner > div > p { margin: 0 0 10px; color: #425563; }
.gb-marka .gb-marka-link-szoveg { margin-top: 18px; color: var(--ink); font-weight: 700; }
.gb-tipus { padding: 30px 32px; border-radius: 20px; color: #fff; background: linear-gradient(155deg, #0f3252, #071b2b); box-shadow: 0 24px 50px rgba(13,37,55,.25); transform: rotate(.8deg); }
.gb-tipus .gb-tipus-cim { margin: 0 0 12px; color: var(--yellow); font-size: 1.15rem; font-weight: 850; }
.gb-tipus ol { margin: 0; padding: 0; list-style: none; }
.gb-tipus li { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.14); color: #fff; font-size: .98rem; font-weight: 700; line-height: 1.35; }
.gb-tipus li span { flex: 0 0 48px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: var(--ink); background: var(--yellow); }
.gb-tipus li span svg { width: 24px; height: 24px; }
.gb-scope { margin-top: 0; }

/* ======================================================================
   /atfolyos-gaz-vizmelegito/ — átfolyós, tartály nélküli gázkészülék;
   saját karakter: vízáramlás, kompakt falra szerelt készülék
   ====================================================================== */

/* Hero-variáns: keskeny, magas keret, alul-balra ferde vágás; két párhuzamos „áramlás" sáv */
.szolg-hero-atfolyos .szolg-hero-photo { top: 36px; bottom: 96px; left: 14%; right: calc(100% - 50vw); border-radius: 22px 0 0 22px; clip-path: polygon(0 0, 100% 0, 100% 100%, 18% 100%, 0 80%); }
.szolg-hero-atfolyos .szolg-hero-photo img { object-position: 62% center; }
.szolg-hero-atfolyos .szolg-hero-slice { top: 8%; bottom: 8%; left: 2%; width: 4%; box-shadow: 34px 0 0 rgba(255,199,0,.45); }
.szolg-hero-atfolyos .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }

/* Hibajelenségek: 3 kiemelt fent (azonos súly, eltérő tónus), 3 kisebb lent */
.af-hibak-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.af-hiba-kiemelt { min-height: 270px; padding: 32px 30px; overflow: hidden; border: 0; }
.af-hiba-kiemelt h3 { font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.1; }
.af-hiba-kiemelt .szolg-hiba-ikon { width: 64px; height: 64px; border-radius: 18px; }
.af-hiba-kiemelt .szolg-hiba-ikon svg { width: 32px; height: 32px; }
.af-hiba-kiemelt .szolg-hiba-szam { font-size: 2.8rem; }
.af-hiba-1 { color: #fff; background: linear-gradient(160deg, #0f3252, #071b2b 75%); clip-path: polygon(0 0, 100% 0, 100% 88%, 90% 100%, 0 100%); }
.af-hiba-1 .szolg-hiba-szam { color: var(--yellow); }
.af-hiba-1 p { color: rgba(255,255,255,.78); }
.af-hiba-2 { margin-top: 26px; color: #fff; background: linear-gradient(160deg, #1b3a52, #0c2436 75%); }
.af-hiba-2::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 10px; background: repeating-linear-gradient(90deg, var(--yellow) 0 18px, transparent 18px 30px); opacity: .8; }
.af-hiba-2 .szolg-hiba-szam { color: var(--yellow); }
.af-hiba-2 p { color: rgba(255,255,255,.78); }
.af-hiba-3 { color: var(--ink); background: linear-gradient(145deg, var(--yellow), #ffd83d); }
.af-hiba-3 .szolg-hiba-ikon { color: var(--yellow); background: var(--ink); }
.af-hiba-3 .szolg-hiba-szam { color: rgba(7,20,33,.35); }
.af-hiba-3 p { color: #2b3a44; }
.af-hiba-4, .af-hiba-5, .af-hiba-6 { flex-direction: row; align-items: flex-start; gap: 18px; flex-wrap: wrap; }
.af-hiba-4 .szolg-hiba-fej, .af-hiba-5 .szolg-hiba-fej, .af-hiba-6 .szolg-hiba-fej { width: 100%; margin-bottom: 4px; }
.af-hiba-4 .szolg-hiba-ikon, .af-hiba-5 .szolg-hiba-ikon, .af-hiba-6 .szolg-hiba-ikon { border-radius: 14px; color: var(--yellow); background: var(--ink); }
.af-hiba-5 { border-top: 4px solid var(--yellow); }
.af-gazszag-sor h3 { margin: 0 0 4px; color: var(--yellow); font-size: 1.05rem; }
.af-gazszag-sor > div { flex: 1 1 260px; }
.af-gazszag-sor > div p { margin: 0; }

/* Mit vizsgálunk: ikonos területlista, két oszlopban */
.af-vizsgalat .szolg-javitas-foto img { object-position: 60% center; }
.af-teruletek { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 14px 0 20px; padding: 0; list-style: none; }
.af-teruletek li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #d3dee5; border-radius: 12px; color: #0b2a42; background: #fff; font-size: .9rem; font-weight: 700; line-height: 1.3; transition: transform .2s ease, border-color .2s ease; }
.af-teruletek li:hover { transform: translateY(-3px); border-color: rgba(255,199,0,.8); }
.af-teruletek li:last-child { grid-column: 1 / -1; }
.af-teruletek span { flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--yellow); background: var(--ink); }
.af-teruletek span svg { width: 19px; height: 19px; }
.af-vizsgalat .szolg-megjegyzes { color: var(--ink); }

/* Vízáramlás és hőmérséklet: az oldal saját szakmai blokkja */
.af-aramlas { position: relative; overflow: hidden; color: #fff; background: linear-gradient(120deg, #071521, #0b2942); clip-path: polygon(0 5%, 100% 0, 100% 95%, 0 100%); margin: -30px 0 -20px; }
.af-aramlas::before { content: ""; position: absolute; top: 0; bottom: 0; right: 8%; width: 30%; background: repeating-linear-gradient(180deg, rgba(255,199,0,.035) 0 22px, transparent 22px 44px); transform: skewX(-12deg); pointer-events: none; }
.af-aramlas-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1.2fr .8fr; align-items: center; gap: clamp(32px, 5vw, 76px); padding-block: 130px 120px; }
.af-aramlas h2 { margin: 0 0 18px; color: var(--yellow); font-size: clamp(2.2rem, 4.2vw, 4rem); line-height: 1; letter-spacing: -.045em; }
.af-aramlas-copy > p { margin: 0 0 12px; color: rgba(255,255,255,.8); }
.af-aramlas-copy > .af-aramlas-alcim { margin-top: 20px; color: #fff; font-weight: 800; }
.af-aramlas-lista { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 14px; padding: 0; list-style: none; }
.af-aramlas-lista li { position: relative; padding: 12px 14px 12px 38px; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; background: rgba(255,255,255,.05); font-size: .92rem; font-weight: 700; line-height: 1.3; }
.af-aramlas-lista li::before { content: ""; position: absolute; left: 14px; top: 50%; width: 12px; height: 12px; border-radius: 50% 50% 50% 0; background: var(--yellow); transform: translateY(-50%) rotate(-45deg); }
.af-aramlas-copy > .af-aramlas-folyt { color: #fff; font-weight: 700; }
.af-abra { display: flex; flex-direction: column; align-items: center; gap: 0; justify-self: center; }
.af-abra-csomopont { width: 84px; height: 84px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); box-shadow: 0 0 0 10px rgba(255,199,0,.12); }
.af-abra-csomopont svg { width: 40px; height: 40px; stroke-width: 1.6; }
.af-abra-keszulek { width: 132px; height: 132px; border-radius: 30px; color: var(--yellow); background: var(--ink); border: 3px solid var(--yellow); box-shadow: 0 20px 44px rgba(0,0,0,.35); }
.af-abra-keszulek svg { width: 64px; height: 64px; }
.af-abra-vonal { width: 4px; height: 54px; background: repeating-linear-gradient(180deg, var(--yellow) 0 8px, transparent 8px 14px); }

/* Vízkő / vízoldal: világos, tiszta blokk — nincs „vízkőtlenítés" sales-üzenet */
.af-vizko { padding: 130px 0 40px; }
.af-vizko-inner { display: grid; grid-template-columns: auto 1fr 1.1fr; align-items: start; gap: 26px clamp(28px, 4vw, 56px); }
.af-vizko-ikon { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 18px; color: var(--ink); background: var(--yellow); }
.af-vizko-ikon svg { width: 34px; height: 34px; }
.af-vizko h2 { margin: 0 0 12px; font-size: clamp(1.8rem, 2.8vw, 2.6rem); line-height: 1.05; letter-spacing: -.035em; }
.af-vizko p { margin: 0 0 12px; color: #425563; }
.af-vizko .af-vizko-kiemelt { padding: 16px 20px; border-left: 5px solid var(--yellow); border-radius: 0 12px 12px 0; color: var(--ink); background: #fff; font-weight: 650; box-shadow: 0 10px 24px rgba(13,37,55,.06); }

/* Régebbi készülék: a világos fotó + sötét diagonális panel komponens (rendszerkép, típus nélkül) */
.af-regi .konv-regi-foto img { object-position: 40% center; }

/* Karbantartás: kompakt blokk belső műszaki részlettel */
.af-karb { padding-top: 60px; }
.af-karb-kep { overflow: hidden; margin-bottom: 20px; border-radius: 16px; box-shadow: 0 14px 30px rgba(13,37,55,.14); }
.af-karb-kep img { display: block; width: 100%; height: auto; }
.af-karb-bal h2 { margin: 0 0 10px; font-size: clamp(1.7rem, 2.6vw, 2.4rem); line-height: 1.05; letter-spacing: -.035em; }
.af-karb-bal p { margin: 0; color: #425563; }

/* ======================================================================
   /atfolyos-elektromos-vizmelegito/ — az első elektromos oldal:
   víz + elektromosság kettős logika, világosabb technikai felületek, láng nélkül
   ====================================================================== */

/* Hero-variáns: világosabb technikai rács a háttérben, egyenes vágású keret */
.szolg-hero-elektromos { background: radial-gradient(circle at 72% 10%, #25445c 0, transparent 30%), linear-gradient(112deg, #0a1b2a 0 50%, #13324b 50% 78%, #0a1a29 78%); }
.szolg-hero-elektromos::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 38px 38px; pointer-events: none; }
.szolg-hero-elektromos .szolg-hero-photo { top: 44px; bottom: 92px; left: 11%; right: calc(100% - 50vw); border-radius: 18px 0 0 18px; clip-path: polygon(6% 0, 100% 0, 100% 100%, 0 100%); }
.szolg-hero-elektromos .szolg-hero-photo img { object-position: 42% center; }
.szolg-hero-elektromos .szolg-hero-slice { top: 22%; bottom: 22%; left: 2%; width: 10%; clip-path: polygon(55% 0, 20% 52%, 48% 52%, 30% 100%, 90% 40%, 58% 40%, 80% 0); transform: translate3d(var(--pointer-x-back, 0px), calc(var(--parallax-y) + var(--pointer-y-back, 0px)), 0); }
.szolg-hero-elektromos .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }

/* Hibajelenségek: 1 széles sötét, 5 világos, a leoldó védelem kiemelt széles panel */
.ae-hibak-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.ae-hibak-racs .szolg-hiba-ikon { border-radius: 14px; color: var(--yellow); background: var(--ink); }
.ae-hiba-1 { grid-column: span 2; flex-direction: row; align-items: center; gap: 28px; min-height: 210px; padding: 34px 36px; overflow: hidden; color: #fff; border-color: transparent; background: linear-gradient(135deg, #13324b, #081c2c 75%); }
.ae-hiba-1::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 26px 26px; pointer-events: none; }
.ae-hiba-1 .szolg-hiba-fej { flex-direction: column; align-items: flex-start; gap: 12px; margin: 0; }
.ae-hiba-1 .szolg-hiba-ikon { width: 72px; height: 72px; border-radius: 20px; color: var(--ink); background: var(--yellow); }
.ae-hiba-1 .szolg-hiba-ikon svg { width: 38px; height: 38px; }
.ae-hiba-1 .szolg-hiba-szam { color: var(--yellow); font-size: 3rem; }
.ae-hiba-1 h3 { font-size: clamp(1.7rem, 2.6vw, 2.4rem); line-height: 1.02; letter-spacing: -.035em; }
.ae-hiba-1 p { max-width: 460px; color: rgba(255,255,255,.78); font-size: .98rem; }
.ae-hiba-2 { border-top: 4px solid var(--yellow); }
.ae-hiba-4 { background: #f1f6f9; }
.ae-hiba-6 { grid-column: span 2; flex-direction: row; align-items: center; gap: 26px; padding: 30px 34px; overflow: hidden; color: #fff; border: 0; border-left: 8px solid var(--yellow); background: linear-gradient(120deg, #0f3252, #071b2b 70%); box-shadow: 0 20px 40px rgba(13,37,55,.2); }
.ae-hiba-6::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 14px; background: repeating-linear-gradient(-45deg, var(--yellow) 0 10px, #071b2b 10px 20px); opacity: .85; }
.ae-hiba-6 .szolg-hiba-fej { flex-direction: column; align-items: flex-start; gap: 10px; margin: 0; }
.ae-hiba-6 .szolg-hiba-ikon { width: 76px; height: 76px; border-radius: 20px; color: var(--ink); background: var(--yellow); }
.ae-hiba-6 .szolg-hiba-ikon svg { width: 40px; height: 40px; }
.ae-hiba-6 .szolg-hiba-szam { color: var(--yellow); }
.ae-hiba-6 h3 { color: var(--yellow); font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.1; }
.ae-hiba-6 p { max-width: 620px; color: rgba(255,255,255,.85); font-size: .96rem; }
.ae-hiba-7 { border: 2px dashed rgba(11,59,94,.28); background: #fff; }

/* Választó: listás panelek */
.ae-panel-lista { margin: 0 0 16px; padding: 0; list-style: none; }
.ae-panel-lista li { position: relative; padding: 6px 0 6px 22px; font-size: .96rem; line-height: 1.45; }
.ae-panel-lista li::before { content: ""; position: absolute; left: 0; top: 14px; width: 10px; height: 10px; border-radius: 50%; background: var(--yellow); }
.gb-panel-sajat .ae-panel-lista li { color: rgba(255,255,255,.85); }
.gb-panel-masik .ae-panel-lista li { color: #425563; }
.gb-panel-masik .ae-panel-lista li::before { background: var(--ink); }

/* Mit vizsgálunk: 8 terület, páros rács */
.ae-vizsgalat .szolg-javitas-foto img { object-position: 50% center; }
.ae-vizsgalat .af-teruletek li:last-child { grid-column: auto; }

/* Elektromos betáplálás: az oldal saját szakmai szekciója — kép + átfedő sötét panel */
.ae-betap { padding: 110px 0 100px; overflow-x: clip; }
.ae-betap-inner { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; }
.ae-betap-kep { position: relative; z-index: 0; }
.ae-betap-kep img { display: block; width: 100%; height: auto; border-radius: 22px; box-shadow: var(--shadow); }
.ae-betap-jel { position: absolute; top: 18px; left: 18px; width: 84px; height: 84px; display: grid; place-items: center; border-radius: 24px; color: var(--ink); background: var(--yellow); box-shadow: 0 16px 34px rgba(255,199,0,.3); }
.ae-betap-jel svg { width: 44px; height: 44px; }
.ae-betap-panel { position: relative; z-index: 1; margin-left: -80px; padding: 44px 44px 40px 56px; color: #fff; background: linear-gradient(145deg, #0f3252, #071725); clip-path: polygon(7% 0, 100% 0, 100% 100%, 0 100%); border-radius: 0 22px 22px 0; box-shadow: 0 30px 60px rgba(0,0,0,.28); }
.ae-betap-panel h2 { margin: 0 0 18px; color: var(--yellow); font-size: clamp(1.8rem, 2.8vw, 2.6rem); line-height: 1.05; letter-spacing: -.035em; }
.ae-betap-panel p { margin: 0 0 12px; color: rgba(255,255,255,.82); font-size: .96rem; }
.ae-betap-panel .ae-betap-kiemelt { margin: 18px 0 0; padding: 14px 18px; border: 1px solid rgba(255,199,0,.5); border-radius: 12px; color: #fff; background: rgba(255,199,0,.08); font-weight: 650; }

/* Vízáramlás: az áramlás-blokk elektromos változata */
.ae-aramlas .af-abra-keszulek { border-radius: 24px; }

/* Régebbi készülék */
.ae-regi .konv-regi-foto img { object-position: 45% center; }

/* Karbantartás: kompakt, a hibafeltárást nem ismétli */
.ae-karb { padding-top: 60px; }

/* Elektromos biztonsági blokk: sötétkék/sárga, nem piros vészdesign */
.ae-biztonsag { padding: 90px 0 110px; }
.ae-biztonsag-doboz { position: relative; display: flex; align-items: flex-start; gap: 26px; max-width: 1040px; margin-inline: auto; padding: 38px 42px; overflow: hidden; border-radius: 20px; color: #fff; background: linear-gradient(135deg, #0e1c27, #0a2536); border-top: 6px solid var(--yellow); box-shadow: 0 24px 50px rgba(13,37,55,.22); }
.ae-biztonsag-doboz::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 12px; background: repeating-linear-gradient(-45deg, var(--yellow) 0 10px, #0e1c27 10px 20px); opacity: .8; }
.ae-biztonsag-ikon { flex: 0 0 68px; width: 68px; height: 68px; display: grid; place-items: center; border-radius: 18px; color: var(--ink); background: var(--yellow); }
.ae-biztonsag-ikon svg { width: 36px; height: 36px; }
.ae-biztonsag h2 { margin: 0 0 14px; color: var(--yellow); font-size: clamp(1.6rem, 2.6vw, 2.3rem); line-height: 1.08; letter-spacing: -.03em; }
.ae-biztonsag p { margin: 0 0 10px; color: rgba(255,255,255,.82); font-size: .96rem; }
.ae-biztonsag .ae-biztonsag-kiemelt { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.16); color: #fff; font-weight: 700; }

/* ======================================================================
   /villanybojler/ — tárolós elektromos bojler: tartály + elektromos/víz nyelv,
   láng- és gázmotívum nélkül
   ====================================================================== */

/* Hero-variáns: elektromos rácsháttér + kapszula (tartály) alakú sárga sáv */
.szolg-hero-villanybojler { background: radial-gradient(circle at 72% 10%, #25445c 0, transparent 30%), linear-gradient(112deg, #0a1b2a 0 50%, #13324b 50% 78%, #0a1a29 78%); }
.szolg-hero-villanybojler::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 38px 38px; pointer-events: none; }
.szolg-hero-villanybojler .szolg-hero-photo { top: 40px; bottom: 92px; left: 12%; right: calc(100% - 50vw); border-radius: 60px 0 0 22px; clip-path: none; }
.szolg-hero-villanybojler .szolg-hero-photo img { object-position: 48% center; }
.szolg-hero-villanybojler .szolg-hero-slice { top: 16%; bottom: 12%; left: 3%; width: 8%; border-radius: 999px; }
.szolg-hero-villanybojler .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }

/* Hibajelenségek: a meglévő elektromos tünetrács; a 6. széles, vízszintes blokk */
.vb-hiba-szeles { grid-column: span 2; flex-direction: row; align-items: center; gap: 22px; }
.vb-hiba-szeles .szolg-hiba-fej { margin: 0; gap: 14px; }

/* Javítás: 7 terület ikonos rácsa */
.vb-javitas .szolg-javitas-foto img { object-position: 62% center; }
.vb-javitas .szolg-kiemeles { margin-top: 6px; }

/* Fűtőegység és szabályozás: sötét technikai blokk, a kép a bal oldalon */
.vb-futes .szolg-eloszor-kep img { object-position: 30% center; }
.vb-futes h2 { font-size: clamp(2rem, 3.6vw, 3.4rem); }
.vb-futes .szolg-eloszor-copy > .vb-futes-alcim { margin: 18px 0 0; color: #fff; font-weight: 800; }
.vb-futes .konv-gyujtas-lista { margin-top: 6px; }
.vb-futes .szolg-eloszor-copy > .vb-futes-folyt { margin-top: 12px; color: #fff; font-weight: 700; }
.vb-futes .szolg-eloszor-copy > .vb-futes-kiemelt { margin-top: 16px; padding: 14px 18px; border: 1px solid rgba(255,199,0,.5); border-radius: 12px; color: #fff; background: rgba(255,199,0,.08); }

/* Vízkő és lerakódás: az oldal saját blokkja stilizált tartálymetszettel */
.vb-vizko { padding: 130px 0 90px; overflow-x: clip; }
.vb-vizko-inner { display: grid; grid-template-columns: .7fr 1.3fr; align-items: center; gap: clamp(32px, 6vw, 96px); }
.vb-tartaly { position: relative; margin: 0; padding: 30px; border-radius: 28px; background: linear-gradient(160deg, #fff, #eef3f6); box-shadow: var(--shadow); }
.vb-tartaly::before { content: ""; position: absolute; right: -16px; bottom: -16px; width: 45%; height: 40%; border-radius: 20px; background: var(--yellow); z-index: -1; }
.vb-tartaly svg { display: block; width: 100%; max-width: 280px; height: auto; margin-inline: auto; }
.vb-tartaly-kulso { fill: #fff; stroke: var(--ink); stroke-width: 5; }
.vb-reteg { stroke: none; }
.vb-reteg-1 { fill: #d9c79a; }
.vb-reteg-2 { fill: #c3ad78; }
.vb-reteg-3 { fill: #a8925f; }
.vb-buborek { fill: none; stroke: #0b3b5e; stroke-width: 2; opacity: .45; }
.vb-tartaly-cso { fill: none; stroke: #9aa8b2; stroke-width: 9; stroke-linecap: round; }
.vb-csepp { fill: var(--yellow); stroke: var(--ink); stroke-width: 2.5; }
.vb-vizko-copy > p { margin: 0 0 10px; color: #425563; }
.vb-vizko-copy > .szolg-vs-alcim { margin-top: 16px; color: var(--ink); }
.vb-tenyezok { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 20px; padding: 0; list-style: none; }
.vb-tenyezok li { padding: 9px 16px; border: 1px solid #cfdbe3; border-radius: 999px; color: #0b2a42; background: #fff; font-size: .9rem; font-weight: 700; }
.vb-vizko-copy > .vb-vizko-kiemelt { margin: 0 0 14px; }

/* Vízszivárgás: sárga blokk, víz + elektromosság figyelmeztetés */
.vb-szivargas .szolg-idozites-fo p { font-size: 1rem; }
.vb-szivargas-kartya { padding: 30px 32px; border-radius: 18px; color: #fff; background: linear-gradient(145deg, #0f3252, #071725); box-shadow: 0 20px 44px rgba(7,20,33,.25); }
.vb-szivargas-ikonok { display: flex; gap: 10px; margin-bottom: 16px; }
.vb-szivargas-ikonok span { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 14px; color: var(--ink); background: var(--yellow); }
.vb-szivargas-ikonok svg { width: 26px; height: 26px; }
.vb-szivargas-kartya p { margin: 0 0 10px; color: rgba(255,255,255,.8); font-size: .95rem; }
.vb-szivargas-kartya .vb-szivargas-fo { color: #fff; font-size: clamp(1.05rem, 1.5vw, 1.25rem); line-height: 1.35; }

/* Karbantartás és vízkőtlenítés */
.vb-karb { padding-top: 60px; }

/* Régebbi villanybojler: a hero képének tartályra fókuszáló kivágása */
.vb-regi .konv-regi-foto img { object-position: 78% center; }

/* Elektromos biztonság: lista a sötét dobozban */
.ae-biztonsag .vb-bizt-alcim { margin: 14px 0 4px; color: #fff; font-weight: 800; }
.vb-bizt-lista { margin: 0; padding: 0; list-style: none; }
.vb-bizt-lista li { position: relative; padding: 6px 0 6px 22px; color: rgba(255,255,255,.88); font-size: .95rem; font-weight: 650; }
.vb-bizt-lista li::before { content: ""; position: absolute; left: 0; top: 14px; width: 10px; height: 10px; border-radius: 50%; background: var(--yellow); }
.ae-biztonsag .vb-bizt-zaro { margin-top: 12px; }

/* ======================================================================
   /futesszereles-kivitelezes/ — rendszerszerelési / kivitelezési karakter:
   radiátor, csőhálózat, szerelvények, projektjellegű folyamat
   ====================================================================== */

/* Hero-variáns: radiátorbordákat idéző sárga sáv, széles lakótéri keret */
.szolg-hero-futes .szolg-hero-photo { top: 48px; bottom: 88px; left: 10%; right: calc(100% - 50vw); border-radius: 22px 0 0 22px; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.szolg-hero-futes .szolg-hero-photo img { object-position: 45% center; }
.szolg-hero-futes .szolg-hero-slice { top: 18%; bottom: 18%; left: 1%; width: 12%; border-radius: 8px; background: repeating-linear-gradient(90deg, rgba(255,211,0,.95) 0 9px, transparent 9px 15px); }
.szolg-hero-futes .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }

/* Miben segítünk: 1 széles sötét + sárga + 3 eltérő tónusú + 1 teljes szélességű */
.fsz-blokk-vilagos { border-left: 5px solid var(--ink); }
.fsz-blokk-teljes { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 22px; border: 2px dashed rgba(255,199,0,.75); background: #fffdf3; }
.fsz-blokk-teljes .szolg-hiba-fej { margin: 0; gap: 14px; }
.fsz-segitseg .gb-hiba-2 { min-height: 210px; }

/* Új vs. meglévő rendszer: az oldal fő UX-eleme — két nagy, eltérő panel */
.fsz-rendszer { padding-bottom: 100px; }
.fsz-rendszer .szolg-vs-panel { min-height: 420px; }
.fsz-rendszer .szolg-vs-panel h3 { font-size: clamp(1.8rem, 2.8vw, 2.6rem); line-height: 1; letter-spacing: -.035em; }
.fsz-rendszer .szolg-vs-ikon { width: 70px; height: 70px; border-radius: 20px; }
.fsz-rendszer .szolg-vs-ikon svg { width: 36px; height: 36px; }
.fsz-rendszer-zaro { margin-top: 44px; }

/* Radiátor és szelep: világos blokk, a kép a jobb oldalon */
.fsz-radiator { background: linear-gradient(180deg, #f7fafb, #eef3f6); }
.fsz-radiator .szolg-talalat-inner { grid-template-columns: 1fr 1fr; }
.fsz-radiator .szolg-talalat-kep::before { inset: auto -18px -18px auto; width: 48%; height: 55%; }
.fsz-radiator .szolg-vs-alcim { margin: 16px 0 0; color: var(--ink); }

/* Rendszerkapcsolatok / gépészet: sötét technikai blokk */
.fsz-gepeszet h2 { font-size: clamp(2rem, 3.8vw, 3.5rem); }
.fsz-gepeszet .szolg-eloszor-kep img { object-position: 55% center; }
.fsz-gepeszet .szolg-eloszor-copy > .fsz-gepeszet-alcim { margin: 18px 0 0; color: #fff; font-weight: 800; }
.fsz-gepeszet .szolg-eloszor-copy > .fsz-gepeszet-kiemelt { margin-top: 18px; padding: 14px 18px; border: 1px solid rgba(255,199,0,.5); border-radius: 12px; color: #fff; background: rgba(255,199,0,.08); }

/* Rendszertisztítás / átmosás: világos, kompakt — „először állapotfelmérés" */
.fsz-tisztitas { padding-top: 100px; }
.fsz-tisztitas .fsz-tisztitas-fo { padding: 14px 18px; border-left: 5px solid var(--yellow); border-radius: 0 12px 12px 0; background: #fffdf3; }

/* Kivitelezési folyamat: projektjellegű fázissor haladásjelzővel */
.fsz-projekt { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin: 10px 0 0; padding: 0; list-style: none; counter-reset: none; }
.fsz-projekt li { position: relative; display: flex; flex-direction: column; padding: 22px 20px 24px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 10px 24px rgba(13,37,55,.06); transition: transform .25s ease, box-shadow .25s ease; }
.fsz-projekt li:hover { transform: translateY(-4px); box-shadow: 0 18px 36px rgba(13,37,55,.12); }
.fsz-projekt li:last-child { color: #fff; border-color: transparent; background: linear-gradient(160deg, #0f3252, #071b2b); }
.fsz-projekt-fej { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.fsz-projekt-szam { color: #c9d4db; font-size: 2.2rem; font-weight: 900; line-height: 1; letter-spacing: -.04em; }
.fsz-projekt li:last-child .fsz-projekt-szam { color: var(--yellow); }
.fsz-projekt-ikon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: var(--yellow); background: var(--ink); }
.fsz-projekt li:last-child .fsz-projekt-ikon { color: var(--ink); background: var(--yellow); }
.fsz-projekt-ikon svg { width: 22px; height: 22px; }
.fsz-projekt-sav { display: block; height: 6px; margin-bottom: 16px; overflow: hidden; border-radius: 6px; background: #e3eaef; }
.fsz-projekt li:last-child .fsz-projekt-sav { background: rgba(255,255,255,.14); }
.fsz-projekt-sav span { display: block; width: calc(var(--fsz-lepes, 1) * 20%); height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--yellow), #ffd83d); }
.fsz-projekt h3 { margin: 0 0 8px; font-size: 1.02rem; line-height: 1.25; }
.fsz-projekt p { margin: 0; color: #526572; font-size: .87rem; line-height: 1.5; }
.fsz-projekt li:last-child p { color: rgba(255,255,255,.78); }

/* Kazán és fűtési rendszer együtt: aszimmetrikus belső linkblokk */
.fsz-kazan { padding: 110px 0 100px; overflow-x: clip; }
.fsz-kazan-inner { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(32px, 5vw, 76px); }
.fsz-kazan h2 { margin: 0 0 16px; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.05; letter-spacing: -.035em; }
.fsz-kazan-copy > p { margin: 0 0 10px; color: #425563; }
.fsz-kazan-copy > .fsz-kazan-hatar { margin-top: 18px; padding: 16px 20px; border-left: 5px solid var(--yellow); border-radius: 0 12px 12px 0; color: var(--ink); background: #fff; font-weight: 650; box-shadow: 0 10px 24px rgba(13,37,55,.06); }
.fsz-kazan-linkek { display: flex; flex-direction: column; gap: 12px; }
.fsz-kazan-cim { margin: 0 0 4px; color: var(--ink); font-weight: 800; }
.fsz-kazan-link { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: #fff; font-size: 1.1rem; font-weight: 850; box-shadow: 0 10px 24px rgba(13,37,55,.07); transition: transform .25s ease, box-shadow .25s ease; }
.fsz-kazan-link:hover { transform: translateX(6px); box-shadow: 0 18px 36px rgba(13,37,55,.14); }
.fsz-kazan-link .kv-nyil { margin-left: auto; }
.fsz-kazan-link-1 { color: #fff; border-color: transparent; background: linear-gradient(135deg, #0f3252, #071b2b); }
.fsz-kazan-link-2 { margin-left: 36px; border: 0; background: linear-gradient(135deg, var(--yellow), #ffd83d); }
.fsz-kazan-link-2 .kv-nyil { color: var(--yellow); background: var(--ink); }
.fsz-kazan-link-3 { margin-left: 72px; }
.fsz-kazan-link-ikon { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: var(--yellow); background: var(--ink); }
.fsz-kazan-link-1 .fsz-kazan-link-ikon { color: var(--ink); background: var(--yellow); }
.fsz-kazan-link-ikon svg { width: 22px; height: 22px; }

/* Termosztát: rövid kapcsolódó blokk */
.fsz-termosztat { padding-top: 20px; }

/* Kész rendszer: nagy, nyugodt lakótéri fotósáv */
.fsz-kesz { position: relative; height: clamp(300px, 38vw, 540px); overflow: hidden; clip-path: polygon(0 8%, 100% 0, 100% 92%, 0 100%); margin: -30px 0 -20px; }
.fsz-kesz-foto { position: absolute; inset: -40px 0; transform: translate3d(0, var(--parallax-y), 0); will-change: transform; }
.fsz-kesz-foto img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center 55%; }

/* ======================================================================
   /termosztatcsere-bekotes/ — fűtésszabályozás: termosztát, vezérlés,
   kazán–rendszer kapcsolat (nem radiátorszerelési oldal)
   ====================================================================== */

/* Hero-variáns: kerek „tárcsa" sárga elem, a termosztát a kép jobb oldalán */
.szolg-hero-termosztat .szolg-hero-photo { top: 46px; bottom: 90px; left: 12%; right: calc(100% - 50vw); border-radius: 22px 0 0 22px; clip-path: polygon(0 0, 100% 0, 100% 100%, 8% 100%); }
.szolg-hero-termosztat .szolg-hero-photo img { object-position: 38% center; }
.szolg-hero-termosztat .szolg-hero-slice { top: 30%; bottom: auto; left: 0; width: 170px; height: 170px; border-radius: 50%; background: radial-gradient(circle, transparent 0 46px, rgba(255,211,0,.95) 47px 60px, transparent 61px 72px, rgba(255,211,0,.55) 73px 80px, transparent 81px); transform: translate3d(var(--pointer-x-back, 0px), calc(var(--parallax-y) + var(--pointer-y-back, 0px)), 0); }
.szolg-hero-termosztat .szolg-hero-text + .szolg-hero-text { margin-top: 10px; }

/* Tünetek: a 6. (új termosztátra váltás) teljes szélességű sárga sáv */
.tsz-valtas { grid-column: 1 / -1; min-height: 0 !important; flex-direction: row; align-items: center; gap: 22px; }
.tsz-valtas .szolg-hiba-fej { margin: 0; gap: 14px; }
.tsz-tunetek .konv-iranyok-zaro { margin-top: 34px; }

/* Nem minden hiba termosztáthiba: sötétkék diagnosztikai blokk + kapcsolati lánc */
.tsz-diagnozis .af-abra-csomopont { width: 72px; height: 72px; }
.tsz-diagnozis .af-abra-csomopont svg { width: 34px; height: 34px; }
.tsz-diagnozis .af-abra-keszulek { width: 104px; height: 104px; }
.tsz-diagnozis .af-abra-keszulek svg { width: 50px; height: 50px; }
.tsz-diagnozis .af-abra-vonal { height: 40px; }
.tsz-link-sor { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 20px !important; }
.tsz-link-sor span { color: #fff; font-weight: 700; }

/* Vezetékes vs. vevőegységes: csatlakozási logika két panelen */
.tsz-kapcsolat { padding-bottom: 100px; }
.tsz-kapcsolat .szolg-vs-panel p { margin: 0; font-size: 1rem; line-height: 1.55; }
.tsz-kapcsolat .szolg-vs-panel h3 { font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.1; }
.tsz-kapcsolat .szolg-vs-karb p { color: #425563; }
.tsz-kapcsolat .szolg-vs-jav p { color: rgba(255,255,255,.82); }
.tsz-kivalasztas { max-width: 980px; margin-top: 34px; padding: 26px 30px; border: 1px solid var(--line); border-top: 5px solid var(--yellow); border-radius: 16px; background: #fff; box-shadow: 0 10px 24px rgba(13,37,55,.06); }
.tsz-kivalasztas .szolg-vs-alcim { margin: 0 0 8px; color: var(--ink); }
.tsz-kivalasztas .vb-tenyezok { margin-bottom: 0; }

/* Régi → új termosztát: világos, erős üzenet */
.tsz-regi-uj { background: linear-gradient(180deg, #fff, #f1f6f9); }
.tsz-regi-uj .szolg-talalat-inner { grid-template-columns: 1.05fr .95fr; }
.tsz-regi-uj .szolg-vs-alcim { margin: 14px 0 0; color: var(--ink); }
.tsz-regi-uj .szolg-elonyok { margin: 6px 0 18px; }
.tsz-regi-uj .szolg-talalat-copy > .tsz-kompatibilis { margin: 0 0 6px; padding: 18px 22px; border-radius: 14px; color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); font-size: clamp(1.25rem, 2vw, 1.7rem); font-weight: 900; line-height: 1.15; letter-spacing: -.02em; box-shadow: 0 14px 30px rgba(255,199,0,.25); }

/* Termosztát és kazán: mini kapcsolati ábra + belső linkek */
.tsz-mini-abra { display: flex; align-items: center; gap: 0; margin-bottom: 22px; }
.tsz-mini-abra span { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; color: var(--yellow); background: var(--ink); }
.tsz-mini-abra span:first-child { color: var(--ink); background: var(--yellow); }
.tsz-mini-abra svg { width: 28px; height: 28px; }
.tsz-mini-abra i { width: 44px; height: 4px; background: repeating-linear-gradient(90deg, var(--yellow) 0 8px, transparent 8px 14px); }
.tsz-kazan .tsz-kazan-cim { margin-top: 12px; font-weight: 650; color: #425563; }
.tsz-kazan .fsz-kazan-link-2 { margin-left: 36px; }

/* Termosztát és fűtési rendszer */
.tsz-rendszer { padding-top: 40px; }

/* Termosztát vs. radiátorszelep: díszítés nélküli, egyszerű összehasonlítás */
.tsz-valaszto .gb-panel-sajat { min-height: 300px; }

/* Ne kösd be találomra */
.tsz-talalomra { padding-top: 70px; }

/* ======================================================================
   /markafuggetlen-szerviz/ — márka-/szervizpozicionáló oldal:
   Dávid-portré + gépészeti réteg, márkarendszer, készülékkategóriák
   ====================================================================== */

/* Hero: halvány gépészeti háttérréteg, előtte Dávid lekerekített portréja */
.mf-hero-visual { overflow: visible; }
.mf-hero-racs { position: absolute; top: 40px; bottom: 90px; left: 20%; right: calc(100% - 50vw); overflow: hidden; border-radius: 22px 0 0 22px; opacity: .35; transform: translate3d(var(--pointer-x-back, 0px), calc(var(--parallax-y) + var(--pointer-y-back, 0px)), 0); transition: transform .2s ease-out; }
.mf-hero-racs img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.mf-hero-racs::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0b2033, rgba(11,32,51,.3) 60%); }
.mf-hero .szolg-hero-slice { top: 14%; bottom: 20%; left: 8%; width: 11%; }
.mf-portre { position: absolute; z-index: 2; top: 34px; bottom: 90px; left: 24%; aspect-ratio: 721 / 884; overflow: hidden; border: 6px solid rgba(255,255,255,.95); border-radius: 26px; box-shadow: 0 30px 60px rgba(0,0,0,.4); transform: translate3d(var(--pointer-x-front, 0px), calc(var(--parallax-y) + var(--pointer-y-front, 0px)), 0); transition: transform .2s ease-out; }
.mf-portre img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center top; }

/* Mit jelent: szöveg + ellenőrzőlista, alatta az öttagú döntési lánc */
.mf-jelentes { padding: 110px 0 100px; }
.mf-jelentes-racs { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: clamp(32px, 5vw, 76px); }
.mf-jelentes-racs > div > p { margin: 0 0 10px; color: #425563; }
.mf-jelentes .szolg-elonyok-doboz h3 { margin: 0 0 8px; font-size: 1.1rem; }
.mf-lanc { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; margin: 50px 0 0; padding: 0; list-style: none; }
.mf-lanc-elem { position: relative; display: flex; flex-direction: column; align-items: center; gap: 12px; color: var(--ink); font-size: 1rem; font-weight: 850; text-align: center; }
.mf-lanc-elem::after { content: ""; position: absolute; top: 34px; left: calc(50% + 40px); right: calc(-50% + 40px); height: 4px; background: repeating-linear-gradient(90deg, var(--yellow) 0 10px, transparent 10px 16px); }
.mf-lanc-utolso::after { display: none; }
.mf-lanc-ikon { width: 70px; height: 70px; display: grid; place-items: center; border-radius: 20px; color: var(--yellow); background: var(--ink); box-shadow: 0 12px 26px rgba(13,37,55,.18); }
.mf-lanc-utolso .mf-lanc-ikon { color: var(--ink); background: var(--yellow); }
.mf-lanc-ikon svg { width: 34px; height: 34px; }
.mf-jelentes .konv-iranyok-zaro { margin-top: 48px; }

/* Márkasáv: 9 jóváhagyott márka, szövegesen, „hivatalos" badge nélkül */
.mf-markak .szolg-markak-inner { padding-block: 64px 56px; }
.mf-markak ul { grid-template-columns: repeat(3, 1fr); gap: 10px; }
.mf-markak li { min-height: 72px; font-size: .95rem; }
.mf-markak li:last-child { color: #17334a; background: #fff; }
.mf-markak li:hover { color: var(--ink); background: var(--yellow); }
.mf-markak-fontos { grid-column: 1 / -1; margin: 0 !important; padding: 14px 18px; border: 1px solid rgba(255,199,0,.5); border-radius: 12px; color: #fff !important; background: rgba(255,199,0,.08); font-size: .95rem !important; }
.mf-markak-fontos strong { color: var(--yellow); }

/* Készülékkategóriák: három nagy, eltérő blokk belső navigációval */
.mf-kategoriak { padding: 110px 0 100px; }
.mf-kat-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: start; }
.mf-kat { display: flex; flex-direction: column; padding: 34px 32px 30px; border-radius: 22px; box-shadow: 0 16px 34px rgba(13,37,55,.1); }
.mf-kat h3 { margin: 18px 0 10px; font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.05; letter-spacing: -.03em; }
.mf-kat p { margin: 0 0 16px; font-size: .95rem; line-height: 1.5; }
.mf-kat-ikon { width: 68px; height: 68px; display: grid; place-items: center; border-radius: 20px; }
.mf-kat-ikon svg { width: 36px; height: 36px; stroke-width: 1.6; }
.mf-kat-1 { color: #fff; background: linear-gradient(160deg, #0f3252, #071b2b); }
.mf-kat-1 .mf-kat-ikon { color: var(--ink); background: var(--yellow); }
.mf-kat-1 p { color: rgba(255,255,255,.8); }
.mf-kat-2 { margin-top: 36px; color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); }
.mf-kat-2 .mf-kat-ikon { color: var(--yellow); background: var(--ink); }
.mf-kat-3 { margin-top: 72px; color: var(--ink); border: 1px solid var(--line); background: #fff; }
.mf-kat-3 .mf-kat-ikon { color: var(--yellow); background: var(--ink); }
.mf-kat-3 p { color: #425563; }
.mf-kat .mf-kat-cim { margin: 4px 0 8px; font-size: .78rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; opacity: .8; }
.mf-kat-linkek { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.mf-kat-linkek a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border-radius: 12px; color: inherit; background: rgba(255,255,255,.1); font-size: .92rem; font-weight: 800; transition: transform .2s ease, background .2s ease; }
.mf-kat-2 .mf-kat-linkek a, .mf-kat-3 .mf-kat-linkek a { background: rgba(7,20,33,.07); }
.mf-kat-linkek a:hover { transform: translateX(4px); background: rgba(255,255,255,.2); }
.mf-kat-2 .mf-kat-linkek a:hover, .mf-kat-3 .mf-kat-linkek a:hover { background: rgba(7,20,33,.14); }
.mf-kat-linkek svg { flex: 0 0 18px; width: 18px; height: 18px; }

/* Vállalhatóság: 5 szempont + a javítás-először mondat hatodik cellában */
.mf-szempontok { background: linear-gradient(180deg, #f7fafb, #eef3f6); }
.mf-szempontok .szolg-szempont h3 { margin-top: 14px; }
.mf-szempont-fo { display: flex; align-items: center; margin: 0; padding: 26px 28px; border-radius: 16px; color: #fff; background: linear-gradient(145deg, #0f3252, #071725); font-size: clamp(1.3rem, 2vw, 1.7rem); line-height: 1.1; letter-spacing: -.02em; }
.mf-szempont-fo span { display: block; color: var(--yellow); }
.mf-szempont-racs .mf-szempont-fo { margin-top: 28px; }

/* Régi készülék: sárga blokk fotófeltöltési CTA-val */
.mf-regi .mf-regi-alcim { margin-top: 18px; font-weight: 800; }
.mf-regi-lista { margin: 0; padding: 0; list-style: none; }
.mf-regi-lista li { position: relative; padding: 6px 0 6px 22px; font-weight: 700; }
.mf-regi-lista li::before { content: ""; position: absolute; left: 0; top: 14px; width: 10px; height: 10px; border-radius: 50%; background: var(--ink); }
.mf-regi .gb-nemtudod-gombok { margin-top: 14px; }

/* Márkafüggetlen vs. hivatalos: tiszta, egyenrangú fogalomtisztázás */
.mf-vs { padding-bottom: 100px; }
.mf-vs-racs .szolg-vs-panel p { margin: 0; color: #425563; font-size: 1rem; line-height: 1.55; }
.mf-vs-hivatalos { border: 1px solid var(--line); border-radius: 0 20px 20px 0; color: var(--ink); background: #fff; }
.mf-vs-hivatalos .szolg-vs-ikon { color: var(--yellow); background: var(--ink); }
.mf-vs-kiemelt { max-width: 900px; margin: 36px 0 10px; padding: 18px 22px; border-radius: 14px; color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); font-size: clamp(1.1rem, 1.6vw, 1.35rem); line-height: 1.35; }
.mf-vs-zaro { max-width: 900px; margin: 0; color: #425563; }

/* Alkatrész és hibafeltárás: sötét technikai blokk */
.mf-hiba h2 { font-size: clamp(2.2rem, 4vw, 3.8rem); }
.mf-hiba .szolg-eloszor-kep img { object-position: 40% center; }
.mf-kerdesek { margin: 8px 0 16px; padding-left: 22px; color: #fff; font-size: 1.05rem; font-weight: 800; }
.mf-kerdesek li { padding: 4px 0; }
.mf-hiba .szolg-eloszor-copy > .mf-sorrend-cim { margin-top: 16px; color: var(--yellow); font-weight: 850; }
.mf-sorrend { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 0; padding: 0; list-style: none; counter-reset: mf; }
.mf-sorrend li { counter-increment: mf; display: flex; align-items: center; gap: 8px; padding: 8px 14px 8px 8px; border: 1px solid rgba(255,199,0,.45); border-radius: 999px; font-size: .88rem; font-weight: 700; }
.mf-sorrend li::before { content: counter(mf); width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--yellow); font-size: .75rem; font-weight: 900; }

/* Javításorientált szemlélet: gépészeti háttér + nagy brand statement */
.mf-javitas { position: relative; overflow: hidden; color: #fff; background: #071725; clip-path: polygon(0 5%, 100% 0, 100% 95%, 0 100%); margin: -20px 0 -20px; }
.mf-javitas-kep { position: absolute; inset: -40px 0; opacity: .32; transform: translate3d(0, var(--parallax-y), 0); will-change: transform; }
.mf-javitas-kep img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.mf-javitas-kep::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #071725 20%, rgba(7,23,37,.4)); }
.mf-javitas-inner { position: relative; z-index: 1; padding-block: 140px 130px; }
.mf-javitas h2 { max-width: 760px; margin: 0 0 18px; color: var(--yellow); font-size: clamp(2.2rem, 4.4vw, 4.2rem); line-height: 1; letter-spacing: -.045em; }
.mf-javitas-inner > p { max-width: 720px; margin: 0 0 12px; color: rgba(255,255,255,.82); }
.mf-javitas-inner > .mf-javitas-alcim { margin-top: 18px; color: #fff; font-weight: 800; }
.mf-javitas .af-aramlas-lista { max-width: 760px; }
.mf-javitas-inner > .mf-javitas-folyt { color: #fff; font-weight: 700; }

/* Kapcsolódó: öt belépő, csak címmel */
.mf-kapcsolodo .szolg-kapcsolodo-elem { min-height: 160px; }

/* ======================================================================
   /kapcsolat/ — telefon-first kapcsolatoldal (nincs általános űrlap)
   ====================================================================== */

/* Hero: a márkafüggetlen oldal Dávid-portré kompozíciója; sötét Munkafelvétel-gomb */
.kp-hero .kp-hero-mf { border: 1px solid rgba(255,255,255,.28); }

/* Három kapcsolati út: nagy, domináns telefon + két eltérő másodlagos blokk */
.kp-utak { padding: 110px 0 100px; }
.kp-utak-racs { display: grid; grid-template-columns: 1.15fr .85fr; gap: 20px; align-items: stretch; }
.kp-utak-oszlop { display: grid; gap: 20px; }
.kp-ut { position: relative; display: flex; flex-direction: column; padding: 34px 34px 32px; overflow: hidden; border-radius: 22px; }
.kp-ut h3 { margin: 16px 0 6px; font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.05; letter-spacing: -.03em; }
.kp-ut p { margin: 0 0 10px; font-size: .95rem; line-height: 1.5; }
.kp-ut-ikon { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 18px; }
.kp-ut-ikon svg { width: 32px; height: 32px; }
.kp-ut-adat { display: inline-block; margin: 0 0 14px; font-size: clamp(1.4rem, 2.4vw, 2.1rem); font-weight: 900; letter-spacing: -.02em; }
.kp-ut-telefon { color: #fff; background: linear-gradient(155deg, #0f3252, #071b2b 70%); box-shadow: 0 26px 50px rgba(13,37,55,.25); clip-path: polygon(0 0, 100% 0, 100% 92%, 94% 100%, 0 100%); }
.kp-ut-telefon::before { content: ""; position: absolute; top: -30%; right: -12%; width: 46%; height: 160%; background: linear-gradient(180deg, rgba(255,199,0,.18), rgba(255,199,0,0)); transform: skewX(-14deg); pointer-events: none; }
.kp-ut-telefon .kp-ut-ikon { width: 84px; height: 84px; border-radius: 22px; color: var(--ink); background: var(--yellow); }
.kp-ut-telefon .kp-ut-ikon svg { width: 44px; height: 44px; }
.kp-ut-telefon h3 { font-size: clamp(2rem, 3.2vw, 2.8rem); }
.kp-ut-telefon .kp-ut-adat { color: var(--yellow); font-size: clamp(2rem, 3.6vw, 3.2rem); }
.kp-ut-telefon .kp-ut-alcim { color: #fff; font-weight: 800; }
.kp-ut-telefon ul { margin: 0 0 22px; padding: 0; list-style: none; }
.kp-ut-telefon li { position: relative; padding: 6px 0 6px 22px; color: rgba(255,255,255,.85); font-size: .96rem; }
.kp-ut-telefon li::before { content: ""; position: absolute; left: 0; top: 14px; width: 10px; height: 10px; border-radius: 50%; background: var(--yellow); }
.kp-ut-gomb { align-self: flex-start; min-height: 60px; margin-top: auto; }
.kp-ut-gomb small, .kp-vs .button small { display: block; margin-top: 3px; font-size: .66rem; opacity: .75; }
.kp-ut-mf { color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); box-shadow: 0 16px 34px rgba(255,199,0,.25); }
.kp-ut-mf .kp-ut-ikon { color: var(--yellow); background: var(--ink); }
.kp-ut-mf p { color: #2b3a44; }
.kp-ut-mf .button { align-self: flex-start; margin-top: 6px; }
.kp-ut-email { border: 1px solid var(--line); color: var(--ink); background: #fff; }
.kp-ut-email .kp-ut-ikon { width: 52px; height: 52px; border-radius: 14px; color: var(--yellow); background: var(--ink); }
.kp-ut-email .kp-ut-ikon svg { width: 26px; height: 26px; }
.kp-ut-email h3 { font-size: 1.4rem; }
.kp-ut-email .kp-ut-adat { color: #0b3b5e; font-size: 1.3rem; text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.kp-ut-email p { color: #425563; }
.kp-ut-email .kp-ut-megj { margin: 4px 0 0; padding-left: 12px; border-left: 3px solid var(--yellow); font-size: .88rem; }

/* Telefon vagy Munkafelvétel: UX-döntési segítség; a telefon a sötét, domináns panel */
.kp-vs { padding-bottom: 100px; }
.kp-vs .szolg-vs-racs { direction: ltr; }
.kp-vs .szolg-vs-panel h3 { font-size: clamp(1.4rem, 2.1vw, 1.9rem); line-height: 1.1; }
.kp-vs .szolg-vs-panel .button { align-self: flex-start; margin-top: 16px; }
.kp-vs .szolg-vs-jav { border-radius: 20px 0 0 20px; }
.kp-vs .szolg-vs-karb { border-radius: 0 20px 20px 0; }
.kp-vs .konv-iranyok-zaro { margin-top: 44px; }

/* Mit készíts elő: 6 ikonos információs elem */
.kp-elokeszites { background: linear-gradient(180deg, #f7fafb, #eef3f6); }
.kp-elokeszites .szolg-szempont h3 { margin-top: 14px; }

/* Nem tudod, melyik szolgáltatás kell: kompakt navigátor */
.kp-navigator { padding: 110px 0 100px; }
.kp-navigator-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: clamp(32px, 5vw, 76px); }
.kp-navigator-inner > div > p { margin: 0 0 10px; color: #425563; }
.kp-navigator .kp-navigator-fo { color: var(--ink); font-size: 1.25rem; font-weight: 850; }
.kp-navigator .vb-tenyezok { margin: 6px 0 10px; }
.kp-navigator .kp-navigator-kiemelt { margin-top: 16px; padding: 16px 20px; border-left: 5px solid var(--yellow); border-radius: 0 12px 12px 0; color: var(--ink); background: #fff; font-weight: 650; box-shadow: 0 10px 24px rgba(13,37,55,.06); }
.kp-belepok { padding: 28px 28px 24px; border-radius: 20px; color: #fff; background: linear-gradient(155deg, #0f3252, #071b2b); box-shadow: 0 24px 50px rgba(13,37,55,.22); }
.kp-belepok h3 { margin: 0 0 14px; color: var(--yellow); font-size: .82rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.kp-belepok ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.kp-belepok a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border-radius: 12px; color: #fff; background: rgba(255,255,255,.06); font-size: .95rem; font-weight: 750; transition: transform .2s ease, background .2s ease, color .2s ease; }
.kp-belepok a:hover { transform: translateX(4px); color: var(--ink); background: var(--yellow); }
.kp-belepok a svg { flex: 0 0 18px; width: 18px; height: 18px; }
.kp-belepo-csoport { padding: 10px 12px; border: 1px dashed rgba(255,199,0,.45); border-radius: 14px; }
.kp-belepo-csoport-nev { display: block; margin: 0 0 6px 2px; color: var(--yellow); font-size: .8rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.kp-belepo-csoport a { padding: 9px 12px; font-size: .9rem; }

/* Működési terület: a jóváhagyott térképgrafika + pontos publikus mondat */
.kp-terulet { position: relative; color: #fff; background: linear-gradient(120deg, #0c304d, #071725); clip-path: polygon(0 4%, 100% 0, 100% 96%, 0 100%); margin: -20px 0 -20px; }
.kp-terulet-inner { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(32px, 5vw, 76px); padding-block: 120px 110px; }
.kp-terulet h2 { margin: 0 0 18px; color: var(--yellow); font-size: clamp(2rem, 3.6vw, 3.3rem); line-height: 1.02; letter-spacing: -.04em; }
.kp-terulet-copy > p { margin: 0 0 12px; color: rgba(255,255,255,.8); }
.kp-terulet-copy > .kp-terulet-fo { color: #fff; font-size: clamp(1.15rem, 1.7vw, 1.4rem); line-height: 1.35; }
.kp-terulet .gb-nemtudod-gombok { margin-top: 20px; }
.kp-terulet-kep img { display: block; width: 100%; height: auto; border-radius: 22px; box-shadow: 0 30px 60px rgba(0,0,0,.35); }

/* Gázszag: kompakt, sötét/sárga figyelmeztetés */
.kp-gazszag { padding-top: 110px; }

/* Cégadatok: tiszta, világos blokk (csak cégadat, nincs ügyfélfogadás) */
.kp-cegadatok { padding: 90px 0; }
.kp-ceg { max-width: 980px; margin-inline: auto; padding: 36px 40px; border: 1px solid var(--line); border-top: 5px solid var(--yellow); border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.kp-ceg h2 { margin: 0 0 20px; font-size: clamp(1.6rem, 2.4vw, 2.2rem); line-height: 1.1; letter-spacing: -.03em; }
.kp-ceg-lista { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px 34px; margin: 0; }
.kp-ceg-lista > div { padding-top: 12px; border-top: 1px solid var(--line); }
.kp-ceg-lista dt { margin: 0 0 4px; color: #6a7c88; font-size: .78rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.kp-ceg-lista dd { margin: 0; color: var(--ink); font-size: 1.08rem; font-weight: 800; }
.kp-ceg-lista dd a { color: #0b3b5e; text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.kp-ceg-lista .kp-ceg-nev { grid-column: 1 / -1; padding-top: 0; border-top: 0; }
.kp-ceg-lista .kp-ceg-nev dd { font-size: 1.4rem; font-weight: 900; }

/* ======================================================================
   /arak/ — négy irányadó díjtétel mint vizuális központ (nem pricing-card sor)
   ====================================================================== */

.ar-hero-afa { display: inline-flex; align-items: center; gap: 10px; margin: 18px 0 0; padding: 10px 16px; border: 1px solid rgba(255,199,0,.55); border-radius: 12px; color: #fff; background: rgba(255,199,0,.08); font-size: .95rem; }
.ar-hero-afa svg { flex: 0 0 20px; width: 20px; height: 20px; color: var(--yellow); }
.ar-hero-afa strong { color: var(--yellow); }

/* Összeg: szám + „+ ÁFA" egyben, soha nem törik félreérthetően */
.ar-osszeg { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.ar-szam { white-space: nowrap; font-weight: 900; letter-spacing: -.035em; }
.ar-afa { display: inline-block; padding: 4px 10px; border-radius: 8px; white-space: nowrap; font-size: .42em; font-weight: 900; letter-spacing: .02em; line-height: 1.2; vertical-align: middle; }

/* A négy díjblokk: eltérő méret és tónus */
.ar-dijak { padding: 100px 0 100px; }
.ar-racs { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; }
.ar-blokk { position: relative; display: flex; flex-direction: column; padding: 34px 36px 32px; overflow: hidden; border-radius: 22px; }
.ar-fej { display: flex; align-items: center; gap: 14px; }
.ar-fej h3 { margin: 0; font-size: 1.25rem; line-height: 1.15; }
.ar-ikon { flex: 0 0 52px; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 14px; }
.ar-ikon svg { width: 26px; height: 26px; }
.ar-ertek { margin: 22px 0 14px; font-size: clamp(2.2rem, 4.2vw, 3.8rem); line-height: 1; }
.ar-leiras { margin: 0 0 8px; font-size: .95rem; line-height: 1.5; }
/* Kiszállás: nagy sötét panel */
.ar-kiszallas { grid-column: 1; grid-row: 1; min-height: 300px; color: #fff; background: linear-gradient(155deg, #0f3252, #071b2b 70%); box-shadow: 0 26px 50px rgba(13,37,55,.25); clip-path: polygon(0 0, 100% 0, 100% 90%, 94% 100%, 0 100%); }
.ar-kiszallas::before { content: ""; position: absolute; top: -30%; right: -12%; width: 44%; height: 160%; background: linear-gradient(180deg, rgba(255,199,0,.18), rgba(255,199,0,0)); transform: skewX(-14deg); pointer-events: none; }
.ar-kiszallas .ar-ikon { color: var(--ink); background: var(--yellow); }
.ar-kiszallas .ar-szam { color: var(--yellow); }
.ar-kiszallas .ar-afa { color: var(--ink); background: var(--yellow); }
.ar-kiszallas .ar-leiras { color: rgba(255,255,255,.8); }
/* Karbantartás: nagy sárga panel */
.ar-karbantartas { grid-column: 2; grid-row: 1; color: var(--ink); background: linear-gradient(145deg, var(--yellow), #ffd83d); box-shadow: 0 20px 44px rgba(255,199,0,.28); }
.ar-karbantartas .ar-ikon { color: var(--yellow); background: var(--ink); }
.ar-karbantartas .ar-ertek { font-size: clamp(2.2rem, 4vw, 3.6rem); }
.ar-karbantartas .ar-afa { color: var(--yellow); background: var(--ink); }
.ar-karbantartas .ar-leiras { color: #2b3a44; }
/* Alsó sor: keskenyebb kontrasztos felár + technikai munkadíj */
.ar-also { display: contents; }
.ar-felar { grid-column: 1; grid-row: 2; }
.ar-racs .ar-felar, .ar-racs .ar-munkadij { padding: 28px 30px; }
.ar-racs .ar-felar .ar-ertek, .ar-racs .ar-munkadij .ar-ertek { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.ar-felar { color: #fff; background: #0b1e2d; border-left: 8px solid var(--yellow); }
.ar-felar::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 12px; background: repeating-linear-gradient(-45deg, var(--yellow) 0 10px, #0b1e2d 10px 20px); opacity: .8; }
.ar-felar .ar-ikon { color: var(--ink); background: var(--yellow); }
.ar-felar .ar-szam { color: #fff; }
.ar-felar .ar-afa { color: var(--ink); background: var(--yellow); }
.ar-felar .ar-leiras { max-width: 560px; color: rgba(255,255,255,.8); }
.ar-felar .ar-leiras strong { color: var(--yellow); }
.ar-munkadij { grid-column: 2; grid-row: 2; border: 1px solid var(--line); color: var(--ink); background: #fff; background-image: linear-gradient(rgba(11,59,94,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(11,59,94,.04) 1px, transparent 1px); background-size: 24px 24px; }
.ar-munkadij .ar-leiras { color: #425563; }
.ar-munkadij .ar-ikon { color: var(--yellow); background: var(--ink); }
.ar-munkadij .ar-afa { color: #fff; background: var(--ink); }

/* Miért nem fix ár: sötét technikai blokk */
.ar-miert h2 { font-size: clamp(2rem, 3.6vw, 3.3rem); }
.ar-miert .szolg-eloszor-copy > .ar-miert-fo { color: var(--yellow); font-size: clamp(1.15rem, 1.6vw, 1.35rem); font-weight: 800; }
.ar-tunetek { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 12px; padding: 0; list-style: none; }
.ar-tunetek li { padding: 7px 13px; border: 1px solid rgba(255,199,0,.45); border-radius: 999px; font-size: .88rem; font-weight: 700; }
.ar-miert .szolg-eloszor-copy > .ar-miert-alcim { margin-top: 18px; color: #fff; font-weight: 800; }
.ar-befolyas li { padding: 9px 0; }
.ar-miert .szolg-eloszor-copy > .ar-miert-kiemelt { margin-top: 16px; padding: 14px 18px; border: 1px solid rgba(255,199,0,.5); border-radius: 12px; color: #fff; background: rgba(255,199,0,.08); }

/* További hiba + alkatrész: két összekapcsolódó világos blokk */
.ar-tovabbi { padding: 120px 0 90px; }
.ar-tovabbi-racs { position: relative; display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 0; }
.ar-tovabbi-blokk { padding: 34px 34px 30px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 14px 30px rgba(13,37,55,.07); }
.ar-alkatresz { margin-top: 40px; border-top: 5px solid var(--yellow); }
.ar-tovabbi-blokk h2 { margin: 16px 0 12px; font-size: clamp(1.4rem, 2vw, 1.8rem); line-height: 1.15; letter-spacing: -.02em; }
.ar-tovabbi-blokk > p { margin: 0 0 10px; color: #425563; font-size: .95rem; }
.ar-tovabbi-blokk .szolg-elonyok { margin: 4px 0 14px; }
.ar-tovabbi-blokk > .ar-tovabbi-megj { margin: 12px 0 0; padding: 12px 16px; border-left: 4px solid var(--yellow); border-radius: 0 10px 10px 0; color: var(--ink); background: #fffdf3; font-weight: 650; }
.ar-tovabbi-ikon { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 16px; color: var(--yellow); background: var(--ink); }
.ar-tovabbi-ikon svg { width: 28px; height: 28px; }
.ar-tovabbi-kapocs { align-self: center; z-index: 1; width: 52px; height: 52px; display: grid; place-items: center; margin: 0 -14px; border: 5px solid #f4f7f9; border-radius: 50%; color: var(--ink); background: var(--yellow); }
.ar-tovabbi-kapocs svg { width: 22px; height: 22px; }

/* Karbantartás: sárga kompakt blokk a díjtartománnyal */
.ar-karb .ar-karb-osszeg { margin: 14px 0 16px !important; font-size: clamp(2.2rem, 4vw, 3.4rem) !important; line-height: 1; }
.ar-karb .ar-afa { color: var(--yellow); background: var(--ink); }

/* Fizetés: három vizuális elem, kártyalogók nélkül */
.ar-fizetes { padding: 100px 0 90px; }
.ar-fiz-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.ar-fiz { display: flex; flex-direction: column; padding: 28px 28px 24px; border-radius: 18px; }
.ar-fiz h3 { margin: 16px 0 6px; font-size: 1.3rem; }
.ar-fiz p { margin: 0; font-size: .95rem; }
.ar-fiz-jel { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; }
.ar-fiz-jel svg { width: 24px; height: 24px; }
.ar-fiz-igen { border: 1px solid var(--line); color: var(--ink); background: #fff; box-shadow: 0 10px 24px rgba(13,37,55,.06); }
.ar-fiz-igen .ar-fiz-jel { color: var(--ink); background: var(--yellow); }
.ar-fiz-igen p { color: #425563; }
.ar-fiz-nem { color: #fff; background: linear-gradient(155deg, #0f3252, #071b2b); }
.ar-fiz-nem .ar-fiz-jel { color: var(--yellow); background: rgba(255,255,255,.1); }
.ar-fiz-nem p { color: rgba(255,255,255,.85); }
.ar-szamla { display: flex; align-items: center; gap: 12px; margin: 22px 0 0; padding: 16px 20px; border-radius: 14px; color: var(--ink); background: linear-gradient(135deg, var(--yellow), #ffd83d); font-size: 1.05rem; }
.ar-szamla svg { flex: 0 0 24px; width: 24px; height: 24px; }
/* Régi árlista: rövid, kis hangsúlyú információs megjegyzés */
.ar-regi { max-width: 900px; margin: 30px 0 0; padding: 14px 18px; border: 1px dashed #c9d4db; border-radius: 12px; color: #526572; font-size: .86rem; line-height: 1.5; }
.ar-regi-cim { display: block; margin-bottom: 4px; color: var(--ink); font-size: .78rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }

/* Kedvezmény (config/kedvezmeny.php): sárga kártya, a hero aljára átfedve */
.ar-kedvezmeny { position: relative; z-index: 3; padding: 0; background: var(--paper); }
.ar-kedv-kartya { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px 40px; margin-top: -96px; padding: 34px 44px; overflow: hidden; border-radius: 24px; color: var(--ink); background: linear-gradient(145deg, var(--yellow), #ffd83d); clip-path: polygon(0 0, 100% 0, 100% 86%, 97% 100%, 0 100%); }
.ar-kedvezmeny .shell { filter: drop-shadow(0 26px 34px rgba(8,25,39,.26)); }
.ar-kedv-kartya::before { content: ""; position: absolute; top: -40%; left: 18%; width: 26%; height: 180%; background: linear-gradient(180deg, rgba(255,255,255,.32), rgba(255,255,255,0)); transform: skewX(-16deg); pointer-events: none; }
.ar-kedv-kartya > * { position: relative; }
.ar-kedv-mertek { margin: 0; }
.ar-kedv-mertek span { display: inline-block; padding: 16px 26px 18px; border-radius: 18px; color: var(--yellow); background: var(--ink); box-shadow: 0 18px 36px rgba(7,20,33,.32); font-size: clamp(2.6rem, 5vw, 4.4rem); font-weight: 900; letter-spacing: -.045em; line-height: 1; white-space: nowrap; transform: rotate(-3deg); }
.ar-kedv-szoveg h2 { margin: 0 0 12px; font-size: clamp(1.4rem, 2.3vw, 2rem); font-weight: 900; line-height: 1.12; letter-spacing: -.02em; }
.ar-kedv-szoveg p { margin: 0; color: #2b3a44; font-size: 1rem; line-height: 1.5; }
.ar-kedv-csoportok { display: flex; flex-wrap: wrap; gap: 8px 10px; margin: 0 0 12px; padding: 0; list-style: none; }
.ar-kedv-csoportok li { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; border-radius: 999px; background: rgba(7,20,33,.08); font-weight: 850; }
.ar-kedv-csoportok li span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: var(--yellow); background: var(--ink); }
.ar-kedv-csoportok svg { width: 15px; height: 15px; }
.ar-kedv-gomb { min-height: 58px; }
.ar-kedv-gomb svg { width: 20px; height: 20px; color: var(--yellow); }
.ar-kedv-gomb small { display: block; margin-top: 3px; font-size: .66rem; opacity: .75; }
.ar-kedvezmeny + .ar-dijak { padding-top: 70px; }
.ar-kedvezmeny :focus-visible { outline-color: var(--ink); }

@media (max-width: 1100px) {
  .ar-kedv-kartya { grid-template-columns: auto 1fr; padding: 30px 32px; }
  .ar-kedv-gomb { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 820px) {
  .ar-kedv-kartya { grid-template-columns: 1fr; gap: 18px; margin-top: -60px; padding: 28px 22px 32px; clip-path: polygon(0 0, 100% 0, 100% 94%, 93% 100%, 0 100%); }
  .ar-kedv-gomb { justify-self: stretch; }
  .ar-kedvezmeny + .ar-dijak { padding-top: 56px; }
}

/* Kapcsolódó navigátor: a kapcsolat oldal komponense */
.ar-navigator { padding-top: 100px; }
.ar-zaro-megj { font-size: .88rem !important; text-transform: none !important; letter-spacing: 0 !important; font-weight: 600 !important; }

/* Reszponzív ------------------------------------------------------------ */
@media (max-width: 1100px) {
  .szolg-hero-inner { grid-template-columns: 55% 45%; min-height: 560px; }
  .szolg-bizalom { grid-template-columns: repeat(2, 1fr); row-gap: 8px; }
  .szolg-bizalom p:nth-child(3) { border-left: 0; }
  .szolg-hibak-racs { grid-template-columns: repeat(2, 1fr); }
  .szolg-hiba-kiemelt { grid-column: span 1; }
  .szolg-folyamat-lista { grid-template-columns: repeat(3, 1fr); row-gap: 40px; }
  .szolg-folyamat-lista::before { display: none; }
  .szolg-folyamat-lista li:nth-child(even) { margin-top: 0; }
  .szolg-markak-inner { grid-template-columns: 1fr; gap: 26px; }
  .szolg-miert-racs { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .szolg-hero { background: radial-gradient(circle at 70% 70%, #233e52, transparent 34%), linear-gradient(155deg, #081725 0 62%, #102b43 62%); }
  .szolg-hero-inner { display: block; min-height: 0; }
  .szolg-hero-copy { padding: 54px 0 34px; }
  .szolg-hero-visual { min-height: 300px; margin-inline: -16px; }
  .szolg-hero-slice { left: 6%; width: 18%; }
  .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero::after { inset: auto -10% -70px 20%; height: 130px; }
  .szolg-bizalom { margin-top: -54px; }
  .szolg-tipusok-inner, .szolg-javitas-inner, .szolg-miert-inner { grid-template-columns: 1fr; }
  .szolg-javitas-kep { min-height: 340px; }
  .szolg-eloszor { clip-path: polygon(0 3%, 100% 0, 100% 97%, 0 100%); }
  .szolg-eloszor-kep { position: relative; width: 100%; height: 260px; clip-path: polygon(0 12%, 100% 0, 100% 100%, 0 100%); }
  .szolg-eloszor-kep::after { background: linear-gradient(0deg, rgba(7,20,33,.9), transparent 55%); }
  .szolg-eloszor-inner { min-height: 0; padding-block: 30px 80px; }
  .szolg-markak ul { grid-template-columns: repeat(3, 1fr); }
  .szolg-miert-portre { width: 100%; max-width: 420px; }
  .szolg-kapcsolodo-sor { grid-template-columns: 1fr; }
  .szolg-kapcsolodo-elem:nth-child(n) { margin-top: 0; min-height: 0; }
  .szolg-kapcsolodo-elem:nth-child(2) { margin-left: 24px; }
  .szolg-kapcsolodo-elem:nth-child(3) { margin-left: 48px; }
}

@media (max-width: 560px) {
  .szolg-cim { font-size: 2.05rem; }
  .szolg-hero h1 { font-size: clamp(2.5rem, 13vw, 3.3rem); }
  .szolg-hero-buttons { gap: 8px; }
  .szolg-hero-buttons .button { flex: 1; padding-inline: 12px; font-size: .86rem; }
  .szolg-hero-buttons .button-yellow { flex-basis: 100%; min-height: 60px; font-size: 1rem; }
  .szolg-hero-visual { min-height: 230px; margin-inline: -14px; }
  .szolg-bizalom { grid-template-columns: 1fr; margin-top: -44px; padding: 12px 14px; }
  .szolg-bizalom p { padding: 10px 6px; }
  .szolg-bizalom p + p { border-left: 0; border-top: 1px solid var(--line); }
  .szolg-hibak { padding: 70px 0; }
  .szolg-hibak-racs { grid-template-columns: 1fr; }
  .szolg-hiba-kiemelt { min-height: 0; padding: 28px 24px 34px; }
  .szolg-tipusok { padding-bottom: 80px; }
  .szolg-javitas { padding: 80px 0 90px; }
  .szolg-javitas-kep { min-height: 250px; }
  .szolg-javitas-kep::after { right: -8px; bottom: -12px; }
  .szolg-eloszor h2 { font-size: 2.6rem; }
  .szolg-eloszor-ertekek { flex-direction: column; }
  .szolg-folyamat { padding: 90px 0 70px; }
  .szolg-folyamat-lista { grid-template-columns: 1fr; row-gap: 26px; }
  .szolg-folyamat-lista li { display: grid; grid-template-columns: 68px 1fr; column-gap: 16px; }
  .szolg-folyamat-szam { grid-row: 1 / 3; }
  .szolg-folyamat-ikon { top: 40px; left: 40px; }
  .szolg-folyamat-lista h3 { margin-top: 6px; }
  .szolg-markak ul { grid-template-columns: 1fr 1fr; }
  .szolg-miert { padding: 80px 0; }
  .szolg-cirko-doboz { flex-direction: column; padding: 24px 22px; }
  .szolg-kapcsolodo { padding: 80px 0; }
  .szolg-kapcsolodo-elem:nth-child(2), .szolg-kapcsolodo-elem:nth-child(3) { margin-left: 0; }
  .szolg-faq { padding: 80px 0; }
  .szolg-faq-valasz { padding-right: 4px; }
}

@media (prefers-reduced-motion: reduce) {
  .szolg-hero-photo, .szolg-javitas-foto { transform: none !important; }
  .szolg-hero-photo img { transform: scale(1.06) !important; }
  .szolg-hero-slice { transform: skewX(-12deg) !important; }
  .szolg-eloszor-kep { transform: scale(1.02) !important; }
}

/* /gazkazan-karbantartas/ — reszponzív */
@media (max-width: 1100px) {
  .szolg-kapcsolodo-negy { grid-template-columns: 1fr 1fr; }
  .szolg-kapcsolodo-negy .szolg-kapcsolodo-elem:nth-child(n) { margin-top: 0; }
  .szolg-kapcsolodo-negy .szolg-kapcsolodo-elem:nth-child(even) { margin-top: 30px; }
}

@media (max-width: 820px) {
  .szolg-hero-karb .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-karb .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-karb .szolg-hero-slice { left: 6%; right: auto; width: 18%; }
  .szolg-miert-fontos-inner, .szolg-idozites-inner, .szolg-talalat-inner { grid-template-columns: 1fr; }
  .szolg-vs-racs { grid-template-columns: 1fr; }
  .szolg-vs-karb { border-radius: 20px 20px 0 0; }
  .szolg-vs-jav { margin: -16px 0 0 18px; }
  .szolg-idozites { clip-path: polygon(0 0, 100% 3%, 100% 100%, 0 97%); }
  .szolg-kapcsolodo-negy .szolg-kapcsolodo-elem:nth-child(n) { margin-left: 0; }
}

@media (max-width: 560px) {
  .szolg-hero-karb .szolg-hero-visual { min-height: 320px; }
  .szolg-miert-fontos, .szolg-vs, .szolg-talalat { padding: 76px 0; }
  .szolg-elonyok-doboz, .szolg-idozites-szempontok { padding: 24px 20px; }
  .szolg-vs-panel { padding: 30px 22px 32px; }
  .szolg-vs-jav { margin-left: 10px; }
  .szolg-idozites-inner { padding-block: 80px 76px; }
  .szolg-kapcsolodo-negy { grid-template-columns: 1fr; }
  .szolg-kapcsolodo-negy .szolg-kapcsolodo-elem:nth-child(even) { margin-top: 0; }
}

/* /gazkazan-csere/ — reszponzív */
@media (max-width: 1100px) {
  .szolg-szempontok-racs { grid-template-columns: 1fr 1fr; }
  .szolg-szempont:nth-child(n) { margin-top: 0; }
  .szolg-szempont:nth-child(even) { margin-top: 24px; }
  .szolg-kapcsolodo-ot { grid-template-columns: 1fr 1fr; }
  .szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(n) { margin-top: 0; }
  .szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(even) { margin-top: 30px; }
}

@media (max-width: 820px) {
  .szolg-hero-csere .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-csere .szolg-hero-visual { min-height: 380px; }
  .szolg-szempontok-fej, .szolg-scope-inner { grid-template-columns: 1fr; }
  .szolg-scope { clip-path: polygon(0 2%, 100% 0, 100% 98%, 0 100%); }
  .szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(n) { margin-left: 0; }
}

@media (max-width: 560px) {
  .szolg-hero-csere .szolg-hero-visual { min-height: 320px; }
  .szolg-szempontok, .szolg-kondenzacios { padding: 76px 0; }
  .szolg-szempontok-racs { grid-template-columns: 1fr; }
  .szolg-szempont:nth-child(even) { margin-top: 0; }
  .szolg-scope-inner { padding-block: 80px 76px; }
  .szolg-scope-lista { padding: 22px 18px; }
  .szolg-kapcsolodo-ot { grid-template-columns: 1fr; }
  .szolg-kapcsolodo-ot .szolg-kapcsolodo-elem:nth-child(even) { margin-top: 0; }
}

/* /gazkeszulek-karbantartas/ — reszponzív */
@media (max-width: 1100px) {
  .kv-racs { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
  .kv-elem-1 { grid-column: 1 / -1; grid-row: auto; min-height: 320px; }
  .kv-elem-2, .kv-elem-3, .kv-elem-4, .kv-segitseg { grid-column: auto; grid-row: auto; }
  .kv-elem-3 { margin-top: 0; }
  .kv-scope-kep { width: 45%; }
}

@media (max-width: 820px) {
  .szolg-hero-keszulek .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-keszulek .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-keszulek .szolg-hero-slice { left: 4%; width: 14%; }
  .kv-scope-kep { display: none; }
}

@media (max-width: 560px) {
  .szolg-hero-keszulek .szolg-hero-visual { min-height: 320px; }
  .kv { padding: 76px 0; }
  .kv-racs { grid-template-columns: 1fr; }
  .kv-elem-1 { min-height: 0; padding: 30px 24px 32px; }
  .kv-segitseg { transform: none; }
  .kv-biztonsag { padding-top: 70px; }
}

/* /gazkonvektor-szerviz/ — reszponzív */
@media (max-width: 1100px) {
  .konv-hibak-racs { grid-template-columns: 1fr 1fr; }
  .konv-hiba-1 { grid-column: 1 / -1; grid-row: auto; min-height: 320px; }
  .konv-hiba-2 { grid-column: 1 / -1; grid-row: auto; }
  .konv-hiba-3, .konv-hiba-4, .konv-hiba-5, .konv-hiba-6 { grid-column: auto; }
  .konv-regi-kep { width: 70%; }
}

@media (max-width: 900px) {
  .konv-lanc { grid-template-columns: 1fr; row-gap: 34px; }
  .konv-lanc::before { top: 4%; bottom: 4%; left: 50px; right: auto; width: 4px; height: auto; transform: none; }
  .konv-lanc-elem { min-height: 0; margin: 0 !important; }
  .konv-lanc-elem-2 { margin-left: 24px !important; }
  .konv-lanc-elem-3 { margin-left: 48px !important; }
  .konv-lanc-nyil { top: auto; right: auto; bottom: -38px; left: 30px; transform: rotate(90deg); }
}

@media (max-width: 820px) {
  .szolg-hero-konv .szolg-hero-photo { top: 20px; bottom: 90px; left: 10%; right: 0; border-radius: 90px 0 0 18px; }
  .szolg-hero-konv .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-konv .szolg-hero-slice { left: 2%; width: 40%; }
  .konv-tisztitas .szolg-javitas-inner { grid-template-columns: 1fr; }
  .konv-gyujtas .szolg-eloszor-kep { width: 100%; clip-path: polygon(0 0, 100% 12%, 100% 100%, 0 100%); }
  .konv-gyujtas .szolg-eloszor-kep::after { background: linear-gradient(0deg, rgba(7,20,33,.9), transparent 55%); }
  .konv-regi { padding: 80px 0; }
  .konv-regi-kep { position: relative; top: auto; bottom: auto; width: auto; height: 320px; margin-right: 16px; }
  .konv-regi-inner { margin-top: -70px; padding-top: 0; }
  .konv-regi-panel { padding: 70px 30px 36px; clip-path: polygon(0 7%, 100% 0, 100% 100%, 0 100%); border-radius: 0 0 18px 18px; }
  .konv-feg-inner { grid-template-columns: 1fr; }
  .konv-feg-kartya { transform: none; }
}

@media (max-width: 560px) {
  .szolg-hero-konv .szolg-hero-visual { min-height: 320px; }
  .konv-hibak-racs { grid-template-columns: 1fr; }
  .konv-hiba-1 { min-height: 0; padding: 120px 24px 32px; }
  .konv-hiba-1 .szolg-hiba-fej { top: 28px; left: 24px; right: 24px; }
  .konv-hiba-2 { padding: 26px 24px; }
  .konv-gazszag-sor { align-items: flex-start; padding: 16px; font-size: .92rem; }
  .konv-iranyok { padding: 76px 0 80px; }
  .konv-lanc-elem { padding: 28px 24px; }
  .konv-lanc-elem-2 { margin-left: 12px !important; }
  .konv-lanc-elem-3 { margin-left: 24px !important; }
  .konv-regi-kep { height: 240px; }
  .konv-regi-panel { padding: 60px 22px 30px; }
  .konv-regi-lista { grid-template-columns: 1fr; }
  .konv-feg { padding-bottom: 80px; }
  .konv-gazszag { padding-top: 70px; }
}

/* /gazszivargas-kereses-javitas/ — reszponzív */
@media (max-width: 1100px) {
  .szv-keszulek-sor { grid-template-columns: 1fr 1fr; }
  .szolg-folyamat-lista li.szv-lepes-biztonsag { padding-top: 16px; }
}

@media (max-width: 820px) {
  .szolg-hero-szivargas .szolg-hero-photo { top: 20px; bottom: 90px; left: 10%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-szivargas .szolg-hero-visual { min-height: 380px; }
  .szv-biztonsag-inner, .szv-segitseg-inner, .szv-javitas .szolg-talalat-inner { grid-template-columns: 1fr; }
  .szv-biztonsag-inner { padding-block: 64px 120px; }
  .szv-abra { max-width: 460px; }
  .szv-muszeres .szolg-javitas-inner { grid-template-columns: 1fr; }
  .szv-javitas .szolg-talalat-kep { margin-top: 0; }
  .szv-szag-kep { width: 100%; opacity: .22; }
  .szv-szag-kep::after { background: rgba(10,36,57,.4); }
}

@media (max-width: 560px) {
  .szolg-hero-szivargas .szolg-hero-visual { min-height: 320px; }
  .szv-biztonsag-inner { padding-block: 54px 110px; }
  .szv-teendok { padding: 24px 20px; }
  .szv-segitseg { padding: 80px 0 70px; }
  .szv-abra { padding: 16px; }
  .szv-keszulek-sor { grid-template-columns: 1fr; }
  .szv-keszulek-sor li:nth-child(even) { transform: none; }
  .szv-keszulekek { padding-bottom: 80px; }
  .szv-szag-inner { padding-block: 90px 80px; }
  .szv-szag-lista { grid-template-columns: 1fr; }
}

/* /gazbojler-javitas/ — reszponzív */
@media (max-width: 1100px) {
  .gb-hibak-racs { grid-template-columns: 1fr 1fr; }
  .gb-hiba-1, .gb-hiba-6 { grid-column: 1 / -1; }
  .gb-hiba-4 { margin-top: 0; }
  .gb-nemtudod { grid-template-columns: auto 1fr; }
  .gb-nemtudod-gombok { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .szolg-hero-bojler .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-bojler .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-bojler .szolg-hero-slice { left: 2%; width: 12%; }
  .gb-valaszto-racs, .gb-marka-inner, .gb-karb-inner { grid-template-columns: 1fr; }
  .gb-panel-masik { margin-top: 0; }
  .gb-panel-sajat { min-height: 0; }
  .gb-inset { display: none; }
  .gb-tipus { transform: none; }
}

@media (max-width: 560px) {
  .szolg-hero-bojler .szolg-hero-visual { min-height: 320px; }
  .gb-hibak-racs { grid-template-columns: 1fr; }
  .gb-hiba-1, .gb-hiba-6 { flex-direction: column; align-items: flex-start; gap: 16px; }
  .gb-hiba-1 { min-height: 0; padding: 28px 24px 34px; }
  .gb-hiba-1 .szolg-hiba-fej { flex-direction: row; justify-content: space-between; width: 100%; }
  .gb-hiba-2 { min-height: 0; }
  .gb-valaszto { padding: 76px 0 80px; }
  .gb-panel-sajat { padding: 30px 24px; }
  .gb-panel-masik { padding: 28px 24px; }
  .gb-deko-aramlas::after { left: 24px !important; right: 24px !important; top: 112px !important; }
  .gb-panel-sajat.gb-deko-aramlas::after { top: 116px !important; }
  .gb-nemtudod { grid-template-columns: 1fr; padding: 22px 20px; transform: none; }
  .gb-karb-inner { padding: 28px 22px; }
  .gb-marka-inner { padding-block: 64px; }
  .gb-tipus { padding: 24px 20px; }
}

/* /atfolyos-gaz-vizmelegito/ — reszponzív */
@media (max-width: 1100px) {
  .af-hibak-racs { grid-template-columns: 1fr 1fr; }
  .af-hiba-2 { margin-top: 0; }
  .af-hiba-3 { grid-column: 1 / -1; min-height: 0; }
  .af-vizko-inner { grid-template-columns: auto 1fr; }
  .af-vizko-inner > div:last-child { grid-column: 2; }
}

@media (max-width: 820px) {
  .szolg-hero-atfolyos .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-atfolyos .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-atfolyos .szolg-hero-slice { left: 3%; width: 5%; }
  .af-aramlas-inner { grid-template-columns: 1fr; padding-block: 100px 90px; }
  .gb-panel-masik.gb-deko-tartaly::before { display: none; }
  .af-abra { flex-direction: row; justify-self: start; }
  .af-abra-vonal { width: 44px; height: 4px; background: repeating-linear-gradient(90deg, var(--yellow) 0 8px, transparent 8px 14px); }
  .af-abra-csomopont { width: 64px; height: 64px; }
  .af-abra-csomopont svg { width: 30px; height: 30px; }
  .af-abra-keszulek { width: 96px; height: 96px; }
  .af-abra-keszulek svg { width: 46px; height: 46px; }
}

@media (max-width: 560px) {
  .szolg-hero-atfolyos .szolg-hero-visual { min-height: 320px; }
  .af-hibak-racs { grid-template-columns: 1fr; }
  .af-hiba-kiemelt { min-height: 0; padding: 26px 24px 30px; }
  .af-teruletek, .af-aramlas-lista { grid-template-columns: 1fr; }
  .af-teruletek li:last-child { grid-column: auto; }
  .af-abra-vonal { width: 22px; }
  .af-abra-csomopont { width: 54px; height: 54px; }
  .af-abra-keszulek { width: 80px; height: 80px; }
  .af-vizko { padding-top: 100px; }
  .af-vizko-inner { grid-template-columns: 1fr; }
  .af-vizko-inner > div:last-child { grid-column: auto; }
}

/* /atfolyos-elektromos-vizmelegito/ — reszponzív */
@media (max-width: 1100px) {
  .ae-hibak-racs { grid-template-columns: 1fr 1fr; }
  .ae-hiba-1, .ae-hiba-6 { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .szolg-hero-elektromos .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-elektromos .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-elektromos .szolg-hero-slice { left: 1%; width: 12%; }
  .ae-betap-inner { grid-template-columns: 1fr; }
  .ae-betap-panel { margin: -50px 0 0; padding: 60px 28px 32px; clip-path: polygon(0 6%, 100% 0, 100% 100%, 0 100%); border-radius: 0 0 18px 18px; }
  .ae-betap-jel { top: 12px; left: 12px; width: 60px; height: 60px; }
  .ae-betap-jel svg { width: 32px; height: 32px; }
}

@media (max-width: 560px) {
  .szolg-hero-elektromos .szolg-hero-visual { min-height: 320px; }
  .ae-hibak-racs { grid-template-columns: 1fr; }
  .ae-hiba-1, .ae-hiba-6 { flex-direction: column; align-items: flex-start; gap: 14px; padding: 28px 24px 30px; }
  .ae-hiba-1 .szolg-hiba-fej, .ae-hiba-6 .szolg-hiba-fej { flex-direction: row; justify-content: space-between; width: 100%; }
  .ae-betap { padding: 80px 0 70px; }
  .ae-betap-panel { padding: 56px 22px 28px; }
  .ae-biztonsag { padding: 70px 0 80px; }
  .ae-biztonsag-doboz { flex-direction: column; gap: 16px; padding: 28px 24px; }
}

/* /villanybojler/ — reszponzív */
@media (max-width: 1100px) {
  .vb-hiba-szeles { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .szolg-hero-villanybojler .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 40px 0 0 18px; }
  .szolg-hero-villanybojler .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-villanybojler .szolg-hero-slice { left: 2%; width: 9%; }
  .vb-vizko-inner { grid-template-columns: 1fr; }
  .vb-tartaly { max-width: 320px; }
}

@media (max-width: 560px) {
  .szolg-hero-villanybojler .szolg-hero-visual { min-height: 320px; }
  .vb-hiba-szeles { grid-column: auto; flex-direction: column; align-items: flex-start; gap: 14px; }
  .vb-hiba-szeles .szolg-hiba-fej { width: 100%; justify-content: space-between; }
  .vb-vizko { padding: 100px 0 70px; }
  .vb-tartaly { padding: 20px; }
  .vb-szivargas-kartya { padding: 24px 20px; }
}

/* /futesszereles-kivitelezes/ — reszponzív */
@media (max-width: 1100px) {
  .fsz-projekt { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 820px) {
  .szolg-hero-futes .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-futes .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-futes .szolg-hero-slice { left: 1%; width: 14%; }
  .fsz-rendszer .szolg-vs-panel { min-height: 0; }
  .fsz-radiator .szolg-talalat-inner, .fsz-kazan-inner { grid-template-columns: 1fr; }
  .fsz-projekt { grid-template-columns: 1fr 1fr; }
  .fsz-kazan-link-2 { margin-left: 18px; }
  .fsz-kazan-link-3 { margin-left: 36px; }
}

@media (max-width: 560px) {
  .szolg-hero-futes .szolg-hero-visual { min-height: 320px; }
  .fsz-blokk-teljes { flex-direction: column; align-items: flex-start; gap: 14px; }
  .fsz-blokk-teljes .szolg-hiba-fej { width: 100%; justify-content: space-between; }
  .fsz-projekt { grid-template-columns: 1fr; }
  .fsz-kazan { padding: 80px 0 70px; }
  .fsz-kazan-link { font-size: 1rem; }
  .fsz-kazan-link-2 { margin-left: 10px; }
  .fsz-kazan-link-3 { margin-left: 20px; }
}

/* /termosztatcsere-bekotes/ — reszponzív */
@media (max-width: 820px) {
  .szolg-hero-termosztat .szolg-hero-photo { top: 20px; bottom: 90px; left: 12%; right: 0; border-radius: 18px 0 0 18px; }
  .szolg-hero-termosztat .szolg-hero-visual { min-height: 380px; }
  .szolg-hero-termosztat .szolg-hero-slice { top: 34%; left: -30px; width: 130px; height: 130px; }
  .tsz-regi-uj .szolg-talalat-inner { grid-template-columns: 1fr; }
  .tsz-diagnozis .af-abra-csomopont { width: 52px; height: 52px; }
  .tsz-diagnozis .af-abra-csomopont svg { width: 26px; height: 26px; }
  .tsz-diagnozis .af-abra-keszulek { width: 72px; height: 72px; }
  .tsz-diagnozis .af-abra-keszulek svg { width: 36px; height: 36px; }
  .tsz-diagnozis .af-abra-vonal { width: 26px; height: 4px; }
  .tsz-kazan .fsz-kazan-link-2 { margin-left: 18px; }
}

@media (max-width: 560px) {
  .szolg-hero-termosztat .szolg-hero-visual { min-height: 320px; }
  .tsz-valtas { flex-direction: column; align-items: flex-start; gap: 14px; }
  .tsz-valtas .szolg-hiba-fej { width: 100%; justify-content: space-between; }
  .tsz-diagnozis .af-abra-csomopont { width: 44px; height: 44px; }
  .tsz-diagnozis .af-abra-keszulek { width: 60px; height: 60px; }
  .tsz-diagnozis .af-abra-vonal { width: 14px; }
  .tsz-kivalasztas { padding: 22px 20px; }
  .tsz-kazan .fsz-kazan-link-2 { margin-left: 10px; }
}

/* /markafuggetlen-szerviz/ — reszponzív */
@media (max-width: 1100px) {
  .mf-kat-racs { grid-template-columns: 1fr 1fr; }
  .mf-kat-2 { margin-top: 0; }
  .mf-kat-3 { grid-column: 1 / -1; margin-top: 0; }
  .mf-markak ul { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 820px) {
  .mf-hero-visual { min-height: 440px; }
  .mf-hero-racs { top: 20px; bottom: 60px; left: 0; right: 0; border-radius: 18px; }
  .mf-portre { top: 20px; bottom: 60px; left: 50%; transform: translate3d(-50%, var(--parallax-y), 0); }
  .mf-jelentes-racs { grid-template-columns: 1fr; }
  .mf-lanc { grid-template-columns: repeat(5, 1fr); }
  .mf-lanc-ikon { width: 52px; height: 52px; border-radius: 14px; }
  .mf-lanc-ikon svg { width: 26px; height: 26px; }
  .mf-lanc-elem { font-size: .78rem; }
  .mf-lanc-elem::after { top: 25px; left: calc(50% + 30px); right: calc(-50% + 30px); }
  .mf-kat-racs { grid-template-columns: 1fr; }
  .mf-kat-3 { grid-column: auto; }
}

@media (max-width: 560px) {
  .mf-hero-visual { min-height: 380px; }
  .mf-jelentes { padding: 76px 0 70px; }
  .mf-lanc { grid-template-columns: 1fr; gap: 10px; }
  .mf-lanc-elem { flex-direction: row; font-size: .95rem; }
  .mf-lanc-elem::after { display: none; }
  .mf-markak ul { grid-template-columns: 1fr 1fr; }
  .mf-kategoriak { padding: 76px 0 70px; }
  .mf-kat { padding: 28px 22px; }
  .mf-javitas-inner { padding-block: 100px 90px; }
}

/* /kapcsolat/ — reszponzív */
@media (max-width: 1100px) {
  .kp-utak-racs { grid-template-columns: 1fr; }
  .kp-utak-oszlop { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 820px) {
  .kp-navigator-inner, .kp-terulet-inner { grid-template-columns: 1fr; }
  .kp-utak-oszlop { grid-template-columns: 1fr; }
  .kp-vs .szolg-vs-jav, .kp-vs .szolg-vs-karb { border-radius: 20px; }
}

@media (max-width: 560px) {
  .kp-utak { padding: 76px 0 70px; }
  .kp-ut { padding: 28px 22px; }
  .kp-ut-gomb { align-self: stretch; }
  .kp-navigator { padding: 76px 0 70px; }
  .kp-belepok { padding: 22px 16px; }
  .kp-terulet-inner { padding-block: 90px 80px; }
  .kp-ceg { padding: 28px 22px; }
  .kp-ceg-lista { grid-template-columns: 1fr; }
}

/* /arak/ — reszponzív */
@media (max-width: 1100px) {
  .ar-racs { grid-template-columns: 1fr 1fr; }
  .ar-kiszallas, .ar-karbantartas, .ar-felar { grid-column: auto; grid-row: auto; }
  .ar-munkadij { grid-column: auto; grid-row: auto; }
}

@media (max-width: 820px) {
  .ar-racs { grid-template-columns: 1fr; }
  .ar-tovabbi-racs { grid-template-columns: 1fr; gap: 0; }
  .ar-tovabbi-kapocs { justify-self: center; margin: -12px 0; transform: rotate(90deg); }
  .ar-alkatresz { margin-top: 0; }
  .ar-fiz-racs { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .ar-dijak { padding: 76px 0 70px; }
  .ar-blokk, .ar-racs .ar-felar, .ar-racs .ar-munkadij { padding: 26px 22px; }
  .ar-ertek, .ar-karbantartas .ar-ertek { font-size: 2.3rem; }
  .ar-racs .ar-felar .ar-ertek, .ar-racs .ar-munkadij .ar-ertek { font-size: 2rem; }
  .ar-afa { font-size: .5em; }
  .ar-hero-afa { display: flex; }
  .ar-tovabbi { padding: 90px 0 70px; }
  .ar-tovabbi-blokk { padding: 26px 22px; }
  .ar-karb .ar-karb-osszeg { font-size: 2.2rem !important; }
}