/* V2 – FoglalGo márkavilág, élőbben.
   Gerinc: a szaggatott röppálya, rajta a papírrepülő (app.js rajzolja görgetésre).
   Anyagok: papír alap, oldalszéles erdő-, terra- és mustármezők, kerek pecsétek,
   perforált beszállókártyák és képeslapok. Betű: Archivo, a címek 125%-os szélességgel. */

:root {
  --papir: #FBF5E9;
  --homok: #EFE4CB;
  --kartya: #FFFDF8;
  --tinta: #26241F;
  --tinta-2: #4A463D;
  --tinta-3: #5A554B;
  --terra: #D5583B;          /* csak dísz és nagy felirat */
  --terra-mely: #B33F26;     /* szöveget hordozó terra: gomb, link, mező */
  --terra-sotet: #9E3720;
  --mustar: #DFA43D;
  --mustar-halvany: #F7E7C4;
  --erdo: #17453A;
  --erdo-szoveg: #C6E2CD;
  --erdo-halvany: #E4EEE8;
  --vonal: rgb(38 36 31 / .14);
  --vonal-eros: rgb(38 36 31 / .3);
  --mezo-keret: #8C8473;

  /* környezetfüggő szerepek – a sötét mezők felülírják */
  --halk: var(--tinta-2);
  --link: var(--terra-mely);
  --pipa: var(--erdo);
  --kiemel: var(--terra-mely);
  --szaggat: var(--vonal-eros);
  --palya-szin: var(--terra);
  --fokusz: var(--erdo);
  --tep-hatter: var(--papir);
  --gk: var(--tinta);
  --gk-inv: var(--papir);

  --r1: 10px;
  --r2: 18px;
  --r3: 26px;
  --arnyek: 0 18px 40px -18px rgb(38 36 31 / .35), 0 2px 6px rgb(38 36 31 / .08);
  --arnyek-kicsi: 0 10px 24px -14px rgb(38 36 31 / .3), 0 1px 3px rgb(38 36 31 / .08);
  --ease-ki: cubic-bezier(.16, 1, .3, 1);
  --fejlec-mag: 68px;
  --gutter: clamp(16px, 4vw, 40px);
  --szakasz-tav: clamp(72px, 9vw, 136px);
  --csonk: clamp(290px, 24vw, 330px);   /* a beszállókártya csonkja; a röppálya gerince ehhez igazodik */
  --tep-pont: rgb(38 36 31 / .24);
  --font: 'Archivo', 'Helvetica Neue', Arial, sans-serif;

  accent-color: var(--terra-mely);
  caret-color: var(--terra-mely);
  scrollbar-color: #8C8473 var(--homok);
}
@media (min-width: 768px) { :root { --fejlec-mag: 76px; } }

/* sötét és színes mezők szerepei */
.szakasz-erdo, .lapfej-erdo, .doboz-erdo, .jegy-kiemelt .jegy-csonk, .kepeslap-nagy, .menu, .utvalaszto .mi {
  --halk: var(--erdo-szoveg); --link: var(--mustar); --pipa: var(--mustar); --kiemel: var(--mustar);
  --szaggat: rgb(251 245 233 / .3); --palya-szin: var(--mustar); --fokusz: var(--mustar);
  --tep-hatter: var(--erdo); --gk: var(--papir); --gk-inv: var(--erdo);
}
.szakasz-terra, .lapfej-terra, .zaro, .doboz-terra, .cikk-cta {
  --halk: var(--papir); --link: var(--papir); --pipa: var(--papir); --kiemel: var(--papir);
  --szaggat: rgb(251 245 233 / .4); --palya-szin: var(--papir); --fokusz: var(--papir);
  --tep-hatter: var(--terra-mely); --gk: var(--papir); --gk-inv: var(--terra-mely);
  --gt-hatter: var(--papir); --gt-szoveg: var(--terra-mely); --gt-hover: #FFFFFF;
}
.szakasz-homok, .lapfej-homok { --tep-hatter: var(--homok); --palya-szin: var(--terra-mely); }
/* világos kártya sötét vagy terra mezőben: visszakapja a világos szerepeket (a lyukasztás színe marad a mezőé) */
.foglalo, .jegy, .urlapkartya, .kepeslap:not(.kepeslap-nagy), .doboz:not(.doboz-erdo, .doboz-terra) {
  --halk: var(--tinta-2); --link: var(--terra-mely); --pipa: var(--erdo); --kiemel: var(--terra-mely);
  --szaggat: var(--vonal-eros); --fokusz: var(--erdo); --gk: var(--tinta); --gk-inv: var(--papir);
  --gt-hatter: var(--terra-mely); --gt-szoveg: var(--papir); --gt-hover: var(--terra-sotet);
}
.lablec { --halk: #C8C0AE; --link: var(--mustar); --fokusz: var(--mustar); --szaggat: rgb(251 245 233 / .18); }

/* ---- alap ------------------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--fejlec-mag) + 24px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--papir);
  color: var(--tinta);
  font-family: var(--font);
  font-size: 1.0625rem;
  line-height: 1.6;
  font-stretch: 100%;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
main { position: relative; overflow-x: clip; }
main:focus { outline: none; }
h1, h2, h3, h4 { margin: 0; font-stretch: 125%; font-weight: 800; line-height: 1.06; letter-spacing: -.02em; text-wrap: balance; overflow-wrap: break-word; }
h1 { font-weight: 900; }
h2 { font-size: clamp(1.85rem, 1.3rem + 2.2vw, 3.1rem); letter-spacing: -.028em; }
h3 { font-size: clamp(1.1875rem, 1.1rem + .4vw, 1.4375rem); line-height: 1.2; letter-spacing: -.014em; }
p { margin: 0; text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }
ul[class], ol[class], nav ul, nav ol, .lablec-oszlopok ul { list-style: none; }
img, video { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1.5px; text-underline-offset: .18em; }
button { font: inherit; color: inherit; }
a, button, summary, label, input, select, textarea { touch-action: manipulation; }
b, strong { font-weight: 700; }
dl, dd { margin: 0; }
figure { margin: 0; }
::selection { background: var(--mustar); color: var(--tinta); }
:focus-visible { outline: 3px solid var(--fokusz); outline-offset: 3px; }
time, table, .foglalo-idok, .foglalo-napok, .csomag-ar { font-variant-numeric: tabular-nums; }

.sr {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.egyben { white-space: nowrap; }
.tarto { width: min(calc(100% - 2 * var(--gutter)), 1240px); margin-inline: auto; }
.ikon { display: inline-block; flex-shrink: 0; width: 1.25em; height: 1.25em; vertical-align: -.25em; }

.ugro {
  position: absolute; left: 16px; top: -120px; z-index: 100;
  padding: 12px 18px; border-radius: 12px;
  background: var(--tinta); color: var(--papir); font-weight: 700; text-decoration: none;
}
.ugro:focus { top: 12px; }

/* ---- gombok, linkek, címkék --------------------------------------------------------------- */
.gombsor { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; }
.gomb {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 0 24px; border: 2px solid transparent; border-radius: 999px;
  font: 700 1rem/1.15 var(--font); font-stretch: 108%; letter-spacing: -.005em;
  text-decoration: none; text-align: center; cursor: pointer;
  transition: transform .25s var(--ease-ki), background-color .2s, color .2s, border-color .2s, box-shadow .25s;
}
.gomb .ikon { width: 20px; height: 20px; }
.gomb:active { transform: translateY(1px) scale(.98); }
.gomb-terra {
  background: var(--gt-hatter, var(--terra-mely)); color: var(--gt-szoveg, var(--papir));
  box-shadow: 0 12px 24px -14px rgb(158 55 32 / .75), 0 2px 4px rgb(38 36 31 / .1);
}
.gomb-terra:hover { background: var(--gt-hover, var(--terra-sotet)); transform: translateY(-2px); }
.gomb-terra .ikon-repulo { transition: transform .35s var(--ease-ki); }
.gomb-terra:hover .ikon-repulo { transform: translate(3px, -3px); }
.gomb-tinta { background: var(--tinta); color: var(--papir); }
.gomb-tinta:hover { background: #3B3830; transform: translateY(-2px); }
.gomb-korvonal { border-color: var(--gk); color: var(--gk); background: transparent; }
.gomb-korvonal:hover { background: var(--gk); color: var(--gk-inv); }
.gomb-vilagos-korvonal { border-color: var(--papir); color: var(--papir); background: transparent; }
.gomb-vilagos-korvonal:hover { background: var(--papir); color: var(--tinta); }
.gomb-kicsi { min-height: 44px; padding: 0 18px; font-size: .9375rem; }
.gomb-teljes { width: 100%; }
.gomb[disabled], .gomb[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }
.gomb.tolt { cursor: progress; opacity: .9; }
.gomb.tolt .ikon-repulo { animation: felszall 1s var(--ease-ki) infinite; }
@keyframes felszall {
  0% { transform: translate(0, 0); opacity: 1; }
  65% { transform: translate(12px, -12px); opacity: 0; }
  66% { transform: translate(-10px, 10px); opacity: 0; }
  100% { transform: translate(0, 0); opacity: 1; }
}

.szovegnyil {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px;
  color: var(--link); font-weight: 700; text-decoration: underline; text-decoration-color: transparent;
  transition: text-decoration-color .2s;
}
.szovegnyil:hover { text-decoration-color: currentColor; }
.szovegnyil .ikon-nyil { width: 20px; height: 20px; transition: transform .3s var(--ease-ki); }
.szovegnyil:hover .ikon-nyil { transform: translateX(4px); }

.cimke {
  display: inline-flex; align-items: center; min-height: 26px; padding: 2px 11px; border-radius: 999px;
  font-size: .875rem; font-weight: 700; font-stretch: 100%; letter-spacing: 0; line-height: 1.2;
  white-space: nowrap; vertical-align: middle;
}
.cimke-pro { background: var(--erdo); color: var(--papir); }
.szakasz-erdo .cimke-pro, .doboz-erdo .cimke-pro, .jegy-kiemelt .cimke-pro, .utvalaszto .mi .cimke-pro { background: var(--mustar); color: var(--tinta); }
.cimke-hamarosan { box-shadow: inset 0 0 0 1.5px currentColor; color: var(--kiemel); background: transparent; }
.cimke-semleges { background: var(--homok); color: var(--tinta); }
.cimke-minta { background: var(--mustar); color: var(--tinta); }

mark.folt {
  padding: 0 .1em; margin: 0 -.03em; color: var(--tinta);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 60' preserveAspectRatio='none'%3E%3Cpath fill='%23DFA43D' d='M3 16C30 7 82 4 128 5c27 1 51 3 68 8l-3 37c-27 6-71 9-112 8C49 57 21 54 6 49z'/%3E%3C/svg%3E") center 58% / 100% 82% no-repeat;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* ---- röppálya és pecsét ------------------------------------------------------------------ */
.palya { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 0; }
.palya-vonal { fill: none; stroke: var(--palya-szin); stroke-width: 2.5; stroke-dasharray: 8 9; stroke-linecap: round; }
.palya-maszk { fill: none; stroke: #fff; stroke-width: 14; stroke-linecap: round; }
.palya-gep { opacity: 0; transition: opacity .3s; }
.palya-gep.lathato { opacity: 1; }
.palya-gep path:first-child { fill: var(--papir); stroke: var(--tinta); stroke-width: 1.4; stroke-linejoin: round; }
.palya-gep path:last-child { fill: none; stroke: var(--tinta); stroke-width: 1.2; stroke-linecap: round; }
/* a főoldal gerince (szakmaváltó, pult, árak) csak ott fut, ahol középen helye van */
.palya-gerinc { display: none; }
@media (min-width: 1024px) { .palya-gerinc { display: block; } }

.pecset { color: var(--terra-mely); }
.pecset svg { display: block; width: 100%; height: auto; overflow: visible; }
.pecset-gyuru { fill: none; stroke: currentColor; stroke-width: 3.5; }
.pecset-belso { fill: currentColor; }
.pecset text { fill: currentColor; font-family: var(--font); font-size: 16.5px; font-weight: 800; font-stretch: 125%; letter-spacing: .06em; }
.pecset-gep { fill: var(--papir); }
.pecset-gep-vonal { fill: none; stroke: currentColor; stroke-width: .9; stroke-linecap: round; }

/* ---- fejléc és menü --------------------------------------------------------------------- */
.fejlec { position: sticky; top: 0; z-index: 50; background: var(--papir); transition: box-shadow .25s; }
.fejlec.gorgetve { box-shadow: 0 1px 0 var(--vonal), 0 14px 28px -24px rgb(38 36 31 / .55); }
/* a fejléc gombjának árnyéka nem lóghat ki a fejléc alá */
.fejlec .gomb-terra { box-shadow: 0 6px 14px -8px rgb(158 55 32 / .7), 0 1px 2px rgb(38 36 31 / .1); }
.fejlec-sor { display: flex; align-items: center; gap: 14px; min-height: var(--fejlec-mag); }
.marka { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-right: auto; color: var(--tinta); text-decoration: none; }
.marka img { width: 44px; height: 44px; }
.marka-nev { font-size: 1.375rem; font-weight: 900; font-stretch: 125%; letter-spacing: -.035em; }
.marka-nev span { color: var(--terra); }
.fonav { display: none; }
.fonav ul { display: flex; gap: 2px; }
.fonav a {
  position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 999px;
  color: var(--tinta-2); font-weight: 600; font-size: .96875rem; text-decoration: none; transition: color .2s, background-color .2s;
}
.fonav a:hover { color: var(--tinta); background: var(--homok); }
.fonav a[aria-current="page"], .fonav a.aktiv { color: var(--tinta); }
.fonav a[aria-current="page"]::after, .fonav a.aktiv::after {
  content: ''; position: absolute; left: 14px; right: 14px; bottom: 5px; height: 2px;
  background: linear-gradient(90deg, var(--terra-mely) 55%, transparent 0) 0 0 / 7px 2px repeat-x;
}
.fejlec-jobb { display: flex; align-items: center; gap: 8px; }
.belepes { display: none; }
.fejlec-cta { display: none; }
.menugomb {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px 0 14px;
  border: 1.5px solid var(--tinta); border-radius: 999px; background: transparent; color: var(--tinta);
  font-weight: 700; font-size: .9375rem; cursor: pointer; transition: background-color .2s, color .2s;
}
.menugomb:hover { background: var(--tinta); color: var(--papir); }
.menugomb-jel { position: relative; width: 18px; height: 12px; }
.menugomb-jel i { position: absolute; left: 0; right: 0; top: 5px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .3s var(--ease-ki); }
.menugomb-jel i:first-child { transform: translateY(-4px); }
.menugomb-jel i:last-child { transform: translateY(4px); }
.menugomb[aria-expanded="true"] .menugomb-jel i:first-child { transform: rotate(45deg); }
.menugomb[aria-expanded="true"] .menugomb-jel i:last-child { transform: rotate(-45deg); }
@media (min-width: 560px) { .fejlec-cta { display: inline-flex; } }
@media (min-width: 768px) {
  .belepes {
    display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px;
    color: var(--tinta-2); font-weight: 600; text-decoration: underline; text-decoration-color: transparent;
  }
  .belepes:hover { color: var(--tinta); text-decoration-color: currentColor; }
}
@media (min-width: 1100px) {
  .fonav { display: block; margin-right: auto; }
  .marka { margin-right: 12px; }
}

.menu {
  position: fixed; inset: var(--fejlec-mag) 0 0 0; z-index: 49; overflow-y: auto; overscroll-behavior: contain;
  background: var(--erdo); color: var(--papir);
}
.menu:not([hidden]) { animation: menu-be .34s var(--ease-ki); }
@keyframes menu-be { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
.menu-belso { display: grid; gap: 36px; padding-block: 20px 56px; }
.menu-lista { display: grid; gap: 0 56px; }
.menu-lista a {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 10px 0;
  border-bottom: 1.5px dashed rgb(251 245 233 / .25); color: var(--papir); text-decoration: none;
  font-size: clamp(1.375rem, 1.1rem + 1.2vw, 2rem); font-weight: 800; font-stretch: 125%; letter-spacing: -.025em;
}
.menu-lista .ikon-nyil { width: 26px; height: 26px; color: var(--mustar); transition: transform .3s var(--ease-ki); }
.menu-lista a:hover, .menu-lista a[aria-current="page"] { color: var(--mustar); }
.menu-lista a:hover .ikon-nyil { transform: translateX(6px); }
.menu-lab { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
.menu-masod { display: inline-flex; align-items: center; min-height: 44px; color: var(--papir); font-weight: 600; }
.menu-masod:hover { color: var(--mustar); }
body.menu-nyitva { overflow: hidden; }
@media (min-width: 768px) { .menu-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---- szakaszok -------------------------------------------------------------------------- */
.szakasz { position: relative; padding-block: var(--szakasz-tav); }
.kis-szakasz { padding-block: clamp(52px, 6vw, 84px); }
.szakasz-homok { background: var(--homok); }
.szakasz-erdo { background: var(--erdo); color: var(--papir); }
.szakasz-terra { background: var(--terra-mely); color: var(--papir); }
.szakasz-vonal { border-top: 1.5px dashed var(--vonal-eros); }
.szakasz-fej { max-width: 780px; margin-bottom: clamp(32px, 4vw, 56px); }
.szakasz-fej p { margin-top: 18px; max-width: 62ch; font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem); color: var(--halk); }
.szakasz-fej p a { color: var(--link); }
.szakasz-fej.sor { max-width: none; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px 48px; }
.szakasz-fej.sor > div { max-width: 760px; }
.tovabb-sor { margin-top: 28px; }
.tovabb-sor a:not(.szovegnyil) { color: var(--link); font-weight: 700; }
.megj { font-size: .9375rem; color: var(--halk); }
.apro { font-size: .9375rem; }

.pipalista { display: grid; gap: 10px; }
.pipalista li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: start; }
.pipalista .ikon { width: 22px; height: 22px; margin-top: 2px; color: var(--pipa); }
.pipalista .cimke { margin-left: 4px; }
.pipalista a { color: var(--link); }
.xlista { display: grid; gap: 14px; }
.xlista li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 14px; align-items: start; }
.xlista .ikon { width: 30px; height: 30px; padding: 6px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px currentColor; color: var(--halk); }

.ikon-pecset {
  --ip-hatter: #F8E1D8; --ip-szin: var(--terra-mely);
  display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
  background: var(--ip-hatter); color: var(--ip-szin);
  box-shadow: inset 0 0 0 2px var(--ip-szin), inset 0 0 0 5px var(--ip-hatter), inset 0 0 0 6.5px var(--ip-szin);
}
.ikon-pecset .ikon { width: 46%; height: 46%; }
.ikon-pecset-erdo { --ip-hatter: var(--erdo-halvany); --ip-szin: var(--erdo); }
.ikon-pecset-mustar { --ip-hatter: var(--mustar-halvany); --ip-szin: #8A5D12; }
.szakasz-erdo .ikon-pecset { --ip-hatter: rgb(251 245 233 / .08); --ip-szin: var(--mustar); }

.chipsor { display: flex; flex-wrap: wrap; gap: 10px; }
.chipsor a {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px;
  background: var(--kartya); box-shadow: inset 0 0 0 1.5px var(--vonal-eros);
  font-weight: 600; font-size: .9375rem; text-decoration: none; transition: box-shadow .2s, color .2s;
}
.chipsor a .ikon { width: 20px; height: 20px; color: var(--terra-mely); }
.chipsor a:hover { color: var(--terra-mely); box-shadow: inset 0 0 0 1.5px var(--terra-mely); }

/* ---- hero ------------------------------------------------------------------------------ */
.hero { position: relative; isolation: isolate; overflow-x: clip; }
.hero-video { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.hero-video video { width: 100%; height: 100%; object-fit: cover; object-position: 80% 45%; opacity: .34; }
.hero-video::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(0deg, var(--papir) 3%, rgb(251 245 233 / 0) 30%),
    linear-gradient(90deg, rgb(251 245 233 / .86) 0%, rgb(251 245 233 / .8) 60%, rgb(251 245 233 / .66) 100%);
}
.hero-racs { position: relative; z-index: 1; display: grid; gap: 22px; padding-block: clamp(28px, 6vw, 96px) clamp(96px, 11vw, 168px); }
.hero-szoveg h1 { font-size: clamp(2.75rem, 1.6rem + 5.2vw, 6rem); line-height: .95; letter-spacing: -.035em; max-width: 11.5ch; }
.hero-lead { margin-top: 28px; max-width: 40rem; font-size: clamp(1.125rem, 1.04rem + .4vw, 1.3125rem); line-height: 1.55; color: var(--tinta-2); }
.hero-lead strong { color: var(--tinta); }
.hero .gombsor { width: fit-content; max-width: 100%; margin-top: 30px; }
.hero-bizalom { display: flex; flex-wrap: wrap; gap: 8px 22px; max-width: 34rem; margin-top: 26px; font-size: .9375rem; font-weight: 600; color: var(--tinta-2); }
.hero-bizalom li { display: inline-flex; align-items: center; gap: 6px; }
.hero-bizalom .ikon { width: 20px; height: 20px; color: var(--erdo); }
.hero-pecset { order: -1; justify-self: end; width: 104px; transform: rotate(-10deg); }
.video-kapcsolo {
  position: absolute; right: var(--gutter); bottom: 20px; z-index: 2;
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px 0 12px;
  border: 1.5px solid var(--vonal-eros); border-radius: 999px; background: rgb(251 245 233 / .94);
  color: var(--tinta-2); font-size: .875rem; font-weight: 600; cursor: pointer; transition: border-color .2s, color .2s;
}
.video-kapcsolo:hover { border-color: var(--tinta); color: var(--tinta); }
.video-kapcsolo .ikon { width: 18px; height: 18px; }
.video-kapcsolo[data-allapot="megy"] .i-lejatszas, .video-kapcsolo[data-allapot="all"] .i-szunet { display: none; }
/* telefonon a videó a hero felső részét tölti ki és lefelé elhalványul: látszik, a szöveg mégis olvasható */
@media (max-width: 767.98px) {
  .hero-video { bottom: auto; height: min(440px, 100%); -webkit-mask-image: linear-gradient(#000 52%, transparent); mask-image: linear-gradient(#000 52%, transparent); }
  .hero-video video { opacity: .56; object-position: 82% 40%; }
  .hero-video::after { background: linear-gradient(90deg, rgb(251 245 233 / .72) 0%, rgb(251 245 233 / .5) 55%, rgb(251 245 233 / .3) 100%); }
}
@media (min-width: 768px) {
  .hero-video video { opacity: .38; }
  .hero-video::after {
    background:
      linear-gradient(0deg, var(--papir) 3%, rgb(251 245 233 / 0) 30%),
      linear-gradient(90deg, var(--papir) 0%, rgb(251 245 233 / .93) 34%, rgb(251 245 233 / .45) 64%, rgb(251 245 233 / .12) 100%);
  }
}
@media (min-width: 1024px) {
  .hero { min-height: min(56rem, calc(100svh - var(--fejlec-mag))); display: grid; align-content: center; }
  .hero-racs { grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 40px; }
  .hero-pecset { order: 0; width: clamp(150px, 13vw, 196px); margin-top: 8px; }
}

/* ---- négy megálló (főoldal) -------------------------------------------------------------- */
.ut { position: relative; overflow-x: clip; padding-block: clamp(24px, 4vw, 48px) var(--szakasz-tav); }
.ut .tarto { position: relative; z-index: 1; }
/* keskeny képernyőn a bal sáv a röppályáé: a cím a megállók szövegével egy vonalban indul */
.ut-fej { display: grid; gap: 16px; max-width: none; margin-bottom: clamp(56px, 7vw, 104px); padding-left: 72px; }
.ut-fej p { margin-top: 0; }
.megallok { display: grid; gap: clamp(72px, 9vw, 128px); }
.megallo { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 16px; row-gap: 32px; }
.megallo-jel { grid-column: 1; grid-row: 1; position: relative; z-index: 2; width: 56px; height: 56px; border-radius: 50%; background: var(--papir); box-shadow: 0 0 0 10px var(--papir); }
.megallo-jel .ikon-pecset { width: 100%; height: 100%; }
.megallo-szoveg { grid-column: 2; max-width: 36rem; }
.megallo-szoveg h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 16px; font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); letter-spacing: -.028em; }
.megallo-szoveg > p { color: var(--tinta-2); }
.megallo-szoveg > * + * { margin-top: 14px; }
.megallo-szoveg > p b { color: var(--tinta); }
.megallo-szoveg .pipalista { margin-top: 18px; }
.megallo-kep { grid-column: 2; }
.megallo-csatorna { font-weight: 700; font-size: .9375rem; }
.cimkesor { display: flex; flex-wrap: wrap; gap: 8px; }
.cimkesor li { padding: 5px 12px; border-radius: 999px; background: var(--homok); font-size: .875rem; font-weight: 600; }
.megallo-tervezett .ikon-pecset { background: var(--papir); box-shadow: none; outline: 2px dashed var(--terra-mely); outline-offset: -2px; }
.apro-doboz { padding: 24px 26px; border: 2px dashed var(--szaggat); border-radius: var(--r2); color: var(--tinta-2); font-size: .9375rem; max-width: 30rem; }
@media (min-width: 1024px) {
  .ut-fej { grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr); align-items: end; padding-left: 0; }
  .ut-fej h2 { grid-column: 1; }
  .ut-fej p { grid-column: 3; }
  .megallo { grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr); align-items: center; column-gap: 0; }
  .megallo-jel { grid-column: 2; justify-self: center; width: 76px; height: 76px; }
  .megallo-szoveg { grid-column: 1; grid-row: 1; justify-self: end; }
  .megallo-kep { grid-column: 3; grid-row: 1; }
  .megallo:nth-child(even) .megallo-szoveg { grid-column: 3; justify-self: start; }
  .megallo:nth-child(even) .megallo-kep { grid-column: 1; }
}

/* telefon, link-kártya, QR */
.foglalo-kompozicio { position: relative; display: grid; justify-items: center; padding-block: 18px; }
.telefon {
  width: min(250px, 74%); padding: 9px; border-radius: 38px; background: var(--tinta);
  box-shadow: 0 34px 50px -30px rgb(38 36 31 / .6), inset 0 0 0 1.5px #3B3830;
}
.telefon img { width: 100%; border-radius: 30px; aspect-ratio: 780 / 1467; }
.linkpill, .qr-cimke {
  position: absolute; display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 999px;
  font-size: .8125rem; font-weight: 700; white-space: nowrap; box-shadow: var(--arnyek);
}
.linkpill { left: 0; top: 16%; background: var(--kartya); color: var(--tinta); transform: rotate(-4deg); }
.linkpill .ikon { width: 18px; height: 18px; color: var(--terra-mely); }
.qr-cimke { right: 0; bottom: 12%; border-radius: 12px; background: var(--tinta); color: var(--papir); transform: rotate(5deg); }
.qr-cimke .ikon { width: 20px; height: 20px; color: var(--mustar); }
@media (min-width: 768px) {
  .telefon { width: 280px; }
  .linkpill, .qr-cimke { font-size: .875rem; padding: 11px 16px; }
}

/* képernyőkép keretben, poggyászcímkével */
.keret { position: relative; }
.keret img { width: 100%; aspect-ratio: 1600 / 867; border-radius: 14px; background: #fff; box-shadow: var(--arnyek); outline: 1px solid var(--vonal); outline-offset: -1px; }
.keret-cimke {
  position: absolute; left: 18px; bottom: -16px; display: inline-flex; align-items: center;
  padding: 8px 16px 8px 30px; background: var(--mustar); color: var(--tinta);
  font-size: .875rem; font-weight: 700; line-height: 1.3;
  clip-path: polygon(14px 0, 100% 0, 100% 100%, 14px 100%, 0 50%); transform: rotate(-3deg);
}
.keret-cimke::before { content: ''; position: absolute; left: 15px; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--papir); }
.keret-masodik { width: 82%; margin: -14% 0 0 auto; z-index: 1; }
/* a hátsó kép címkéje felülre kerül, különben a ráhúzott második kép eltakarja */
.keret:has(+ .keret-masodik) > .keret-cimke { left: auto; right: 18px; top: -16px; bottom: auto; transform: rotate(3deg); }

/* légipostás boríték és levél */
.legiposta { position: relative; max-width: 520px; margin-inline: auto; padding-top: 12px; }
.boritek {
  position: absolute; top: 0; left: 7%; right: 0; height: 64%;
  padding: 10px; border-radius: 10px; transform: rotate(4deg);
  background: repeating-linear-gradient(135deg, var(--terra) 0 16px, var(--papir) 16px 26px, var(--erdo) 26px 42px, var(--papir) 42px 52px);
  box-shadow: var(--arnyek-kicsi);
}
.boritek-belso { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; height: 100%; padding: 14px 16px; border-radius: 4px; background: var(--kartya); }
.boritek-cim { font-size: .8125rem; line-height: 1.45; color: var(--tinta-3); }
.boritek-belyeg {
  display: grid; place-items: center; width: 50px; height: 58px; padding: 4px; background: var(--homok);
  -webkit-mask: radial-gradient(circle, #0000 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) content-box;
  mask: radial-gradient(circle, #0000 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) content-box;
}
.boritek-belyeg img { width: 34px; height: 34px; }
.level { position: relative; z-index: 1; width: 90%; margin-top: 92px; padding: 22px 22px 20px; border-radius: 14px; background: #fff; box-shadow: var(--arnyek); transform: rotate(-1.5deg); }
.level-fej { display: grid; gap: 4px; padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1px solid var(--vonal); }
.level-fej span { font-size: .8125rem; color: var(--tinta-3); }
.level-fej b { font-size: 1.0625rem; font-weight: 800; }
.level > p { font-size: .9375rem; color: var(--tinta-2); }
.level-adat { display: grid; gap: 8px; margin: 14px 0 16px; padding: 14px 16px; border-radius: 10px; background: var(--papir); }
.level-adat div { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 8px; font-size: .875rem; }
.level-adat dt { color: var(--tinta-3); }
.level-adat dd { font-weight: 700; }
.level-gomb { display: inline-flex; align-items: center; min-height: 34px; padding: 0 14px; border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--terra-mely); color: var(--terra-mely); font-size: .875rem; font-weight: 700; }
.kep-megj { margin-top: 20px; font-size: .8125rem; color: var(--tinta-3); text-align: center; }

/* ---- szakmaváltó és mintafoglaló ------------------------------------------------------------ */
.valto-racs { display: grid; gap: 48px; align-items: start; }
.valto-lead { margin-top: 18px; max-width: 46ch; font-size: 1.125rem; color: var(--halk); }
.valto-sugo { margin-top: 28px; font-size: .9375rem; color: var(--halk); max-width: 46ch; }
.valto-lista { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.valto-lista button {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px 0 12px;
  border: 1.5px solid rgb(251 245 233 / .35); border-radius: 999px; background: transparent; color: var(--papir);
  font-weight: 600; font-size: .9375rem; cursor: pointer; transition: border-color .2s, background-color .2s, color .2s;
}
.valto-lista .ikon { width: 20px; height: 20px; color: var(--mustar); }
.valto-lista button:hover { border-color: var(--papir); }
.valto-lista button[aria-pressed="true"] { background: var(--mustar); border-color: var(--mustar); color: var(--tinta); }
.valto-lista button[aria-pressed="true"] .ikon { color: var(--tinta); }
.valto-tovabb { display: flex; flex-wrap: wrap; gap: 4px 28px; margin-top: 24px; }
.valto-megj { margin-top: 18px; text-align: center; font-size: .875rem; color: var(--halk); }
.valto-megj a { color: var(--link); }
.valto .tarto { position: relative; z-index: 1; }
@media (min-width: 1024px) {
  /* középen 120 px-es sáv marad a röppálya gerincének */
  .valto-racs { grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr); gap: 0; }
  .valto-jobb { grid-column: 3; }
  .valto-megj { max-width: 500px; margin-inline: auto; }
}

.foglalo {
  position: relative; width: 100%; max-width: 500px; margin-inline: auto;
  border-radius: 24px; background: var(--kartya); color: var(--tinta); text-align: left;
  box-shadow: 0 32px 60px -32px rgb(20 18 14 / .6), 0 2px 6px rgb(20 18 14 / .14);
}
.foglalo-fej { display: flex; align-items: center; gap: 12px; padding: 20px 24px 14px; }
.foglalo-fej img { width: 36px; height: 36px; }
.foglalo-fej p { display: grid; margin-right: auto; line-height: 1.25; }
.foglalo-fej b { font-weight: 800; font-size: 1.0625rem; }
.foglalo-fej p span { font-size: .875rem; color: var(--tinta-3); }
.foglalo-lepesek { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 0 24px 14px; }
.foglalo-lepesek li { position: relative; padding-top: 14px; font-size: .8125rem; font-weight: 600; color: var(--tinta-3); }
.foglalo-lepesek li::before { content: ''; position: absolute; top: 2px; left: 0; right: 0; height: 4px; border-radius: 2px; background: var(--homok); }
.foglalo-lepesek li.kesz::before, .foglalo-lepesek li[aria-current="step"]::before { background: var(--terra-mely); }
.foglalo-lepesek li[aria-current="step"] { color: var(--tinta); font-weight: 800; }
.foglalo-panel { min-height: 318px; padding: 6px 24px 24px; outline: none; }
.foglalo-kerdes { margin-bottom: 12px; font-weight: 800; font-size: 1.0625rem; }
.foglalo-szolg { display: grid; gap: 8px; }
.foglalo-szolg button {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 54px; padding: 10px 16px;
  border: 1.5px solid var(--vonal-eros); border-radius: 14px; background: #fff; color: var(--tinta);
  font-weight: 600; font-size: 1rem; text-align: left; cursor: pointer; transition: border-color .2s, background-color .2s;
}
.foglalo-szolg small { flex-shrink: 0; color: var(--tinta-3); font-size: .875rem; font-weight: 500; }
.foglalo-szolg button:hover { border-color: var(--terra-mely); background: #FFF8F3; }
.foglalo-valasztott { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; margin-bottom: 14px; padding: 10px 14px; border-radius: 12px; background: var(--papir); font-size: .9375rem; }
.foglalo-valasztott span { color: var(--tinta-3); }
.foglalo-vissza {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 6px; margin-right: -6px;
  border: 0; background: none; color: var(--terra-mely); font-weight: 700; font-size: .9375rem; cursor: pointer;
}
.foglalo-vissza .ikon { width: 18px; height: 18px; }
.foglalo-vissza:hover { text-decoration: underline; }
.foglalo-napok { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 16px; }
.foglalo-napok button {
  display: grid; justify-items: center; gap: 2px; width: 100%; min-height: 62px; padding: 8px 4px;
  border: 1.5px solid var(--vonal-eros); border-radius: 14px; background: #fff; cursor: pointer; transition: border-color .2s, background-color .2s;
}
.foglalo-napok span { font-size: .8125rem; color: var(--tinta-3); }
.foglalo-napok b { font-size: 1.25rem; font-weight: 800; font-stretch: 125%; line-height: 1.1; }
.foglalo-napok button:hover { border-color: var(--tinta-2); }
.foglalo-napok button[aria-pressed="true"] { background: var(--tinta); border-color: var(--tinta); color: var(--papir); }
.foglalo-napok button[aria-pressed="true"] span { color: #D8D0BE; }
.foglalo-idok { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 8px; }
.foglalo-idok button {
  min-height: 44px; border: 1.5px solid var(--vonal-eros); border-radius: 12px; background: #fff;
  font-weight: 700; font-size: .9375rem; cursor: pointer; transition: border-color .2s, background-color .2s, color .2s;
}
.foglalo-idok button:hover { border-color: var(--terra-mely); color: var(--terra-mely); background: #FFF8F3; }
.foglalo-kesz { display: grid; gap: 14px; justify-items: start; }
.foglalo-pecset {
  display: inline-block; padding: 6px 14px; border: 3px double var(--terra-mely); border-radius: 8px;
  color: var(--terra-mely); font-weight: 900; font-stretch: 125%; letter-spacing: .14em; text-transform: uppercase; transform: rotate(-6deg);
  animation: pecsetel .42s var(--ease-ki) both;
}
@keyframes pecsetel { from { transform: rotate(-6deg) scale(1.6); opacity: 0; } to { transform: rotate(-6deg) scale(1); opacity: 1; } }
.foglalo-osszegzes { display: grid; gap: 6px; width: 100%; padding: 14px 16px; border-radius: 12px; background: var(--papir); }
.foglalo-osszegzes div { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 8px; font-size: .9375rem; }
.foglalo-osszegzes dt { color: var(--tinta-3); }
.foglalo-osszegzes dd { font-weight: 700; }
.foglalo-kesz > p { font-size: .875rem; color: var(--tinta-3); }
.foglalo-tep { position: relative; height: 2px; margin: 0 22px; background: linear-gradient(90deg, var(--vonal-eros) 55%, transparent 0) 0 0 / 12px 2px repeat-x; }
.foglalo-tep::before, .foglalo-tep::after { content: ''; position: absolute; top: -13px; width: 28px; height: 28px; border-radius: 50%; background: var(--tep-hatter); }
.foglalo-tep::before { left: -36px; }
.foglalo-tep::after { right: -36px; }
.foglalo-csonk { display: flex; align-items: center; gap: 14px; padding: 18px 24px 22px; }
.foglalo-csonk .ikon { width: 40px; height: 40px; color: var(--tinta); }
.foglalo-csonk p { display: grid; line-height: 1.35; min-width: 0; }
.foglalo-csonk p > span { font-size: .8125rem; color: var(--tinta-3); }
.foglalo-csonk b { font-size: .9375rem; overflow-wrap: anywhere; }
.foglalo-csonk b span { color: var(--terra-mely); }
.foglalo-alatt { margin-top: 16px; text-align: center; font-size: .875rem; color: var(--halk); }

/* ---- pult (terra mező) ------------------------------------------------------------------ */
.pult .tarto { position: relative; z-index: 1; }
.pult-racs { display: grid; gap: 48px; align-items: center; }
.pult-szoveg > p { margin-top: 18px; max-width: 52ch; font-size: 1.125rem; }
.pult .keret img { box-shadow: 0 30px 60px -30px rgb(20 18 14 / .7); outline: 0; }
.tenyek { display: grid; gap: 24px; margin-top: 40px; padding-top: 36px; border-top: 1.5px dashed var(--szaggat); }
.tenyek li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 16px; align-items: start; }
.teny-pecset {
  display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%;
  box-shadow: inset 0 0 0 2px var(--papir), inset 0 0 0 6px var(--terra-mely), inset 0 0 0 7.5px var(--papir);
}
.teny-pecset .ikon { width: 26px; height: 26px; }
.tenyek b { display: block; font-size: 1.125rem; font-weight: 800; font-stretch: 112%; line-height: 1.25; }
.tenyek p span { display: block; margin-top: 6px; font-size: .96875rem; }
@media (min-width: 1024px) {
  .pult-racs { grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr); gap: 0; align-items: start; }
  .pult-kep { grid-column: 3; }
}

/* ---- így indulsz ------------------------------------------------------------------------ */
.indulas { overflow-x: clip; }
.indulas .tarto { position: relative; z-index: 1; }
.lepesek { display: grid; gap: 32px; margin-block: 8px 44px; }
.lepes { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 18px; row-gap: 8px; }
.lepes-jel {
  grid-row: span 2; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
  background: var(--terra-mely); color: var(--papir); box-shadow: 0 0 0 10px var(--papir), 0 16px 26px -14px rgb(158 55 32 / .8);
}
.lepes-jel .ikon { width: 26px; height: 26px; }
.lepes h3 { align-self: end; font-size: 1.375rem; }
.lepes p { color: var(--tinta-2); max-width: 36ch; }
.lepes p a { color: var(--link); }
@media (min-width: 768px) {
  .lepesek { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 4vw, 56px); }
  .lepes { grid-template-columns: 1fr; row-gap: 10px; }
  .lepes-jel { grid-row: auto; width: 76px; height: 76px; margin-bottom: 14px; }
  .lepes-jel .ikon { width: 32px; height: 32px; }
}

/* ---- beszállókártya-árak ------------------------------------------------------------------ */
.fizetes { display: inline-flex; gap: 4px; margin: 0; padding: 5px; border: 0; border-radius: 999px; background: var(--kartya); box-shadow: inset 0 0 0 1.5px var(--vonal-eros); }
.fizetes label { position: relative; cursor: pointer; }
.fizetes input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.fizetes span { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: 999px; font-weight: 700; font-size: .9375rem; white-space: nowrap; transition: background-color .2s, color .2s; }
.fizetes small { padding: 3px 9px; border-radius: 999px; background: var(--mustar-halvany); color: var(--tinta); font-size: .8125rem; font-weight: 700; }
.fizetes input:checked + span { background: var(--tinta); color: var(--papir); }
.fizetes input:checked + span small { background: var(--mustar); }
.fizetes input:focus-visible + span { outline: 3px solid var(--fokusz); outline-offset: 2px; }

/* A jegy: színes fejsáv, fő rész (név, keret, pontok), perforáció, csonk (ár, gomb, vonalkód).
   Telefonon álló jegy; 768 px-től fekvő: a csonk jobbra kerül, a perforáció függőleges. */
.jegyek { display: grid; gap: 28px; }
.jegy { position: relative; display: flex; flex-direction: column; border-radius: 20px; background: var(--kartya); color: var(--tinta); box-shadow: var(--arnyek); }
.jegy-sav {
  display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 22px;
  border-radius: 20px 20px 0 0; background: var(--terra-mely); color: var(--papir);
  font-size: .9375rem; font-weight: 800; font-stretch: 112%; line-height: 1.2;
}
.jegy-pro .jegy-sav { background: var(--erdo); }
.jegy-business .jegy-sav { background: var(--tinta); }
.lapfej-terra .jegy-sav { background: var(--erdo); }
.jegy-sav img { width: 28px; height: 28px; border-radius: 50%; background: var(--papir); box-shadow: 0 0 0 2px var(--papir); }
.jegy-sav-fajta { margin-left: auto; font-weight: 600; font-stretch: 100%; }
.jegy-fo { position: relative; display: grid; gap: 18px; align-content: start; padding: 24px 22px 22px; }
.jegy-nev { font-size: clamp(2rem, 1.6rem + 1.2vw, 2.5rem); font-weight: 900; letter-spacing: -.035em; line-height: 1; }
.jegy-kinek { margin-top: 10px; max-width: 46ch; color: var(--halk); }
.jegy-adatok { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-block: 1.5px dashed var(--vonal-eros); }
.jegy-adatok > div { display: grid; gap: 2px; align-content: start; padding: 10px 10px 12px; }
.jegy-adatok > div:first-child { padding-left: 0; }
.jegy-adatok > div + div { border-left: 1.5px dashed var(--vonal-eros); }
.jegy-adatok dt { font-size: .8125rem; font-weight: 600; line-height: 1.3; color: var(--tinta-3); }
.jegy-adatok dd { font-size: clamp(.9375rem, .85rem + .3vw, 1.0625rem); font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.jegy-pontok { display: grid; gap: 10px; align-content: start; font-size: 1rem; }
.jegy-pontok li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; }
.jegy-pontok .ikon { width: 22px; height: 22px; margin-top: 1px; color: var(--pipa); }
/* perforáció: pöttysor, a két végén kerek kivágás a mező színében */
.jegy-tep { position: relative; height: 4px; margin: 0 20px; background: radial-gradient(circle, var(--tep-pont) 0 1.5px, transparent 2px) 0 50% / 10px 4px repeat-x; }
.jegy-tep::before, .jegy-tep::after { content: ''; position: absolute; top: -12px; width: 28px; height: 28px; border-radius: 50%; background: var(--tep-hatter); }
.jegy-tep::before { left: -34px; }
.jegy-tep::after { right: -34px; }
.jegy-csonk { display: flex; flex-direction: column; gap: 8px; padding: 22px 22px 24px; border-radius: 0 0 20px 20px; }
.jegy-kiemelt .jegy-csonk { background: var(--erdo); color: var(--papir); }
.jegy-ar { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 4px; }
.jegy-szam { font-size: clamp(2.5rem, 2rem + 1.4vw, 3.25rem); font-weight: 900; font-stretch: 125%; letter-spacing: -.035em; line-height: 1; }
.jegy-egyseg { font-weight: 700; color: var(--halk); }
.jegy-mellek { min-height: 3.1em; font-size: .9375rem; color: var(--halk); }
.jegy-csonk .gomb { margin-top: auto; }
.jegy-vonalkod { display: block; width: 100%; height: 32px; margin-top: 8px; fill: var(--tinta-2); }
.jegy-kiemelt .jegy-vonalkod { fill: var(--papir); }
/* Pro: aranypecsét saját zöld korongon a fő rész jobb felső sarkában; a szöveg kihagyja a helyét */
.jegy-pecset { position: absolute; top: 14px; right: 14px; z-index: 2; width: 84px; transform: rotate(12deg); color: var(--mustar); }
.jegy-pecset svg { border-radius: 50%; background: var(--erdo); box-shadow: var(--arnyek-kicsi); }
.jegy-pecset .pecset-gep { fill: var(--erdo); }
.jegy-kiemelt .jegy-fej { padding-right: 92px; }
.ar-labjegyzet { margin-top: 28px; max-width: 68ch; font-size: .9375rem; color: var(--halk); }
.ar-labjegyzet a { color: var(--link); }
.egy-jegy { max-width: 420px; margin-inline: auto; }
.arak-sav .tarto { position: relative; z-index: 1; }
.arak-sav .palya { z-index: 2; }
@media (max-width: 767.98px) {
  .jegyek { max-width: 520px; margin-inline: auto; }
}
@media (min-width: 768px) {
  .jegyek .jegy { display: grid; grid-template-columns: minmax(0, 1fr) var(--csonk); grid-template-rows: auto 1fr; }
  .jegyek .jegy-sav { grid-column: 1 / -1; padding-inline: 28px; }
  .jegyek .jegy-fo { grid-column: 1; grid-row: 2; padding: 26px 32px 26px 28px; }
  .jegyek .jegy-csonk { grid-column: 2; grid-row: 2; padding: 24px 28px 26px; border-radius: 0 0 20px 0; }
  .jegyek .jegy-tep {
    position: absolute; top: 0; bottom: 0; right: calc(var(--csonk) - 2px); width: 4px; height: auto; margin: 0;
    background: radial-gradient(circle, var(--tep-pont) 0 1.5px, transparent 2px) 50% 0 / 4px 10px repeat-y;
  }
  .jegyek .jegy-tep::before { top: -14px; left: -12px; }
  .jegyek .jegy-tep::after { top: auto; bottom: -14px; left: -12px; right: auto; }
  .jegyek .jegy-pecset { top: 16px; right: 20px; width: 96px; }
  .jegyek .jegy-kiemelt .jegy-fej { padding-right: 108px; }
}
@media (min-width: 1024px) {
  /* a fejléc a jegy osztását követi: a szöveg balra, a csonk fölötti sávban fut le a röppálya */
  .gerinc .szakasz-fej.sor { display: grid; grid-template-columns: minmax(0, 1fr) var(--csonk); align-items: end; gap: 28px 0; }
  .gerinc .szakasz-fej.sor > div { grid-column: 1; padding-right: 48px; }
  .gerinc .fizetes { grid-column: 1; justify-self: start; }
}
@media (min-width: 1200px) {
  .jegyek .jegy-fo { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); grid-template-areas: "fej pontok" "adatok adatok"; gap: 22px 40px; }
  .jegyek .jegy-fej { grid-area: fej; }
  .jegyek .jegy-pontok { grid-area: pontok; padding-top: 4px; }
  .jegyek .jegy-adatok { grid-area: adatok; }
  .jegyek .jegy-kiemelt .jegy-fej { padding-right: 0; }
  .jegyek .jegy-kiemelt .jegy-pontok { padding-right: 112px; }
}

/* ---- összevetések ---------------------------------------------------------------------- */
.vs-lista { border-bottom: 1.5px dashed var(--szaggat); }
.vs-sor { position: relative; display: grid; gap: 8px 40px; padding: 26px 64px 26px 0; border-top: 1.5px dashed var(--szaggat); }
.vs-sor h3 { font-size: clamp(1.375rem, 1.12rem + 1vw, 2rem); letter-spacing: -.03em; }
.vs-sor h3 a { text-decoration: none; }
.vs-sor h3 a::after { content: ''; position: absolute; inset: 0; border-radius: 12px; }
.vs-sor h3 a:focus-visible { outline: none; }
.vs-sor h3 a:focus-visible::after { outline: 3px solid var(--fokusz); outline-offset: 4px; }
.vs-vagy { font-stretch: 70%; font-weight: 400; color: var(--halk); }
.vs-o { color: var(--kiemel); }
.vs-sor p { max-width: 54ch; color: var(--halk); font-size: 1rem; }
.vs-nyil {
  position: absolute; right: 0; top: 50%; display: grid; place-items: center; width: 52px; height: 52px; margin-top: -26px;
  border-radius: 50%; box-shadow: inset 0 0 0 1.5px currentColor; transition: background-color .25s, color .25s, transform .35s var(--ease-ki);
}
.vs-nyil .ikon { width: 22px; height: 22px; }
.vs-sor:hover .vs-nyil { background: var(--kiemel); color: var(--gk-inv); box-shadow: none; transform: translateX(4px); }
.vs-sor:hover .vs-o { text-decoration: underline; text-decoration-thickness: 2px; }
@media (min-width: 900px) { .vs-sor { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: center; padding-right: 92px; } }

/* ---- képeslap-cikkek ----------------------------------------------------------------------- */
.kepeslapok { display: grid; gap: 24px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.kepeslapok.negy { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.kepeslap {
  position: relative; display: flex; flex-direction: column; gap: 18px; min-height: 270px; padding: 22px 24px;
  border-radius: 16px; background: var(--kartya); color: var(--tinta); box-shadow: var(--arnyek-kicsi);
  transition: transform .35s var(--ease-ki), box-shadow .35s var(--ease-ki);
}
.kepeslap:hover { transform: translateY(-4px) rotate(-.5deg); box-shadow: var(--arnyek); }
.kepeslap-szoveg { display: flow-root; }
/* a bélyeg a jobb felső sarokban úszik: a cím körbefolyja, nem kell neki fenntartott sáv */
.kepeslap-belyeg {
  float: right; display: grid; place-content: center; justify-items: center; width: 60px; height: 72px; margin: -4px -6px 12px 16px; padding: 4px;
  background: var(--mustar); color: var(--tinta); text-align: center; transform: rotate(3deg);
  -webkit-mask: radial-gradient(circle, #0000 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) content-box;
  mask: radial-gradient(circle, #0000 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) content-box;
}
.kepeslap-belyeg b { font-size: 1.5rem; font-weight: 900; font-stretch: 125%; line-height: 1; }
.kepeslap-belyeg span { font-size: .8125rem; font-weight: 700; }
.kepeslap h3, .kepeslap h2 { font-size: 1.3125rem; line-height: 1.22; }
.kepeslap h3 a, .kepeslap h2 a { text-decoration: none; }
.kepeslap h3 a::after, .kepeslap h2 a::after { content: ''; position: absolute; inset: 0; border-radius: 16px; }
.kepeslap a:focus-visible { outline: none; }
.kepeslap a:focus-visible::after { outline: 3px solid var(--erdo); outline-offset: 3px; }
.kepeslap-ido { margin-top: 10px; font-size: .875rem; font-weight: 600; color: var(--halk); }
.kepeslap-kivonat { margin-top: 12px; font-size: .96875rem; color: var(--halk); }
.kepeslap-nyil { display: grid; place-items: center; align-self: flex-end; width: 44px; height: 44px; margin-top: auto; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--vonal-eros); color: var(--terra-mely); transition: transform .35s var(--ease-ki), background-color .25s, color .25s; }
.kepeslap-nyil .ikon { width: 20px; height: 20px; }
.kepeslap:hover .kepeslap-nyil { background: var(--terra-mely); color: var(--papir); box-shadow: none; transform: translateX(3px); }
.kepeslap-nagy { background: var(--erdo); color: var(--papir); }
.kepeslap-nagy h3, .kepeslap-nagy h2 { font-size: clamp(1.625rem, 1.3rem + 1.2vw, 2.375rem); line-height: 1.08; letter-spacing: -.03em; }
.kepeslap-nagy .kepeslap-belyeg { width: 68px; height: 80px; }
.kepeslap-nagy .kepeslap-kivonat { font-size: 1.0625rem; max-width: 46ch; }
/* a nagy lap alja: a cikkben szereplő rendszerek, a FoglalGo kiemelve */
.kepeslap-rendszerek { padding-top: 18px; border-top: 1.5px dashed rgb(251 245 233 / .3); }
.kepeslap-rendszerek p { font-size: .875rem; font-weight: 700; }
.kepeslap-rendszerek ul { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; padding: 0; list-style: none; }
.kepeslap-rendszerek li { padding: 5px 12px; border-radius: 999px; box-shadow: inset 0 0 0 1.5px rgb(251 245 233 / .35); font-size: .875rem; font-weight: 600; }
.kepeslap-rendszerek li:first-child { background: var(--mustar); color: var(--tinta); box-shadow: none; }
.kepeslap-nagy .kepeslap-nyil { color: var(--mustar); box-shadow: inset 0 0 0 1.5px rgb(251 245 233 / .4); }
.kepeslap-nagy:hover .kepeslap-nyil { background: var(--mustar); color: var(--tinta); }
@media (min-width: 640px) {
  .tudastar .kepeslap-nagy, .blog-racs .kepeslap-nagy { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
  .tudastar .kepeslapok { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
  .tudastar .kepeslap-nagy { grid-column: auto; grid-row: span 2; padding: 32px; }
  .blog-racs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .blog-racs .kepeslap-nagy { grid-column: span 2; padding: 32px; }
  .kepeslapok.harom { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kepeslapok.ketto { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- GYIK ------------------------------------------------------------------------------- */
/* légipostás levél: csíkos borítékszegély, bélyeg és bélyegzés a cím mellett, a végén utóirat */
.legilevel {
  max-width: 920px; margin-inline: auto; padding: 10px; border-radius: 14px; box-shadow: var(--arnyek);
  background: repeating-linear-gradient(135deg, var(--terra) 0 16px, var(--kartya) 16px 26px, var(--erdo) 26px 42px, var(--kartya) 42px 52px);
}
.legilevel-lap { padding: clamp(24px, 4vw, 52px); border-radius: 6px; background: var(--kartya); }
.legilevel-fej { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: clamp(20px, 3vw, 32px); }
.legilevel-belyeg { position: relative; flex: 0 0 auto; width: 118px; height: 84px; }
.legilevel-belyegzes { position: absolute; left: 0; top: 20px; z-index: 1; width: 84px; height: 30px; overflow: visible; fill: none; stroke: var(--tinta-3); stroke-width: 3; stroke-linecap: round; }
.legilevel-belyegkep {
  position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 64px; height: 76px; padding: 4px;
  background: var(--homok); transform: rotate(4deg);
  -webkit-mask: radial-gradient(circle, #0000 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) content-box;
  mask: radial-gradient(circle, #0000 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) content-box;
}
.legilevel-belyegkep img { width: 40px; height: 40px; }
.legilevel-ui { margin-top: 28px; max-width: 62ch; color: var(--halk); }
.legilevel-ui a { color: var(--link); }
@media (max-width: 559.98px) {
  .legilevel { padding: 8px; }
  /* keskeny lapon a bélyeg a jobb felső sarokba kerül, a cím alatta kapja a teljes szélességet */
  .legilevel-fej { flex-direction: column-reverse; gap: 6px; }
  .legilevel-belyeg { align-self: flex-end; margin-top: -8px; margin-right: -10px; }
  .legilevel-belyeg { width: 88px; height: 66px; }
  .legilevel-belyegzes { top: 14px; width: 62px; height: 24px; }
  .legilevel-belyegkep { width: 52px; height: 62px; }
  .legilevel-belyegkep img { width: 32px; height: 32px; }
}
.gyik details { border-top: 1.5px dashed var(--vonal-eros); }
.gyik details:last-child { border-bottom: 1.5px dashed var(--vonal-eros); }
.gyik summary {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 64px; padding: 16px 0;
  font-weight: 700; font-size: 1.125rem; line-height: 1.35; cursor: pointer; list-style: none;
}
.gyik summary::-webkit-details-marker { display: none; }
.gyik summary:focus-visible { outline-offset: 4px; border-radius: 6px; }
.gyik-jel { position: relative; flex: 0 0 36px; height: 36px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--vonal-eros); transition: background-color .2s, color .2s, box-shadow .2s; }
.gyik-jel::before, .gyik-jel::after { content: ''; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; margin: -1px 0 0 -7px; border-radius: 2px; background: currentColor; transition: transform .3s var(--ease-ki); }
.gyik-jel::after { transform: rotate(90deg); }
.gyik summary:hover .gyik-jel { box-shadow: inset 0 0 0 1.5px var(--terra-mely); color: var(--terra-mely); }
.gyik details[open] .gyik-jel { background: var(--tinta); color: var(--papir); box-shadow: none; }
.gyik details[open] .gyik-jel::after { transform: rotate(0deg); }
.gyik-valasz { max-width: 70ch; padding: 0 56px 24px 0; color: var(--tinta-2); }
.gyik-valasz > * + * { margin-top: .8em; }
.gyik-valasz a { color: var(--terra-mely); }
.gyik-valasz ul, .gyik-valasz ol { padding-left: 1.25em; }
.gyik-valasz ul { list-style: disc; }

/* ---- záró sáv ----------------------------------------------------------------------------- */
.zaro { position: relative; overflow-x: clip; padding-block: clamp(80px, 10vw, 148px); background: var(--terra-mely); color: var(--papir); }
.zaro-racs { position: relative; z-index: 1; display: grid; gap: 44px; align-items: center; }
.zaro h2 { max-width: 14ch; font-size: clamp(2.25rem, 1.5rem + 3vw, 4.25rem); line-height: 1; letter-spacing: -.035em; }
.zaro p { margin-top: 20px; max-width: 46ch; font-size: 1.1875rem; }
.zaro .gombsor { width: fit-content; max-width: 100%; margin-top: 34px; }
.zaro-pecset { width: clamp(150px, 20vw, 260px); justify-self: center; transform: rotate(-8deg); filter: drop-shadow(0 20px 26px rgb(38 36 31 / .35)); }
.palya-zaro { display: none; }
@media (min-width: 900px) {
  .zaro-racs { grid-template-columns: minmax(0, 1fr) auto; }
  .zaro-pecset { margin-right: clamp(0px, 4vw, 64px); }
  .palya-zaro { display: block; }
}

/* ---- lábléc ------------------------------------------------------------------------------- */
.lablec { padding-block: clamp(64px, 8vw, 112px) 40px; background: var(--tinta); color: #C8C0AE; }
.lablec-fej { display: grid; gap: 28px; align-items: center; padding-bottom: 48px; border-bottom: 1.5px dashed var(--szaggat); }
.lablec-pecset { width: 112px; height: 112px; transform: rotate(-8deg); }
.lablec-jelmondat { color: var(--papir); font-size: clamp(2.25rem, 1.5rem + 2.8vw, 3.75rem); font-weight: 900; font-stretch: 125%; line-height: 1; letter-spacing: -.04em; }
.lablec-cta { display: grid; gap: 14px; justify-items: start; max-width: 22rem; }
.lablec-cta p { font-size: .9375rem; }
.lablec-oszlopok { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; padding-block: 48px; }
.lablec h2 { margin-bottom: 6px; color: var(--mustar); font-size: 1rem; font-stretch: 112%; letter-spacing: 0; }
.lablec-oszlopok a { display: inline-flex; align-items: center; min-height: 44px; color: #C8C0AE; font-size: .9375rem; text-decoration: none; overflow-wrap: anywhere; }
.lablec-oszlopok a:hover { color: var(--papir); text-decoration: underline; }
.lablec-also { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 28px; padding-top: 20px; border-top: 1.5px dashed var(--szaggat); font-size: .875rem; }
.lablec-also ul { display: flex; flex-wrap: wrap; gap: 0 18px; }
.lablec-also a { display: inline-flex; align-items: center; min-height: 44px; color: #C8C0AE; }
.lablec-also a:hover { color: var(--papir); }
.lablec-also p { margin-left: auto; }
.proto-megj { margin-top: 16px; max-width: 86ch; font-size: .875rem; }
.proto-megj a { color: var(--mustar); }
@media (min-width: 900px) {
  .lablec-fej { grid-template-columns: auto minmax(0, 1fr) auto; gap: 44px; }
  .lablec-oszlopok { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---- aloldal-fej ---------------------------------------------------------------------------- */
.lapfej { position: relative; overflow: clip; padding: 6px 0 clamp(104px, 11vw, 148px); }
.lapfej .tarto { position: relative; z-index: 1; }
.lapfej-papir { background: var(--papir); }
.lapfej-homok { background: var(--homok); }
.lapfej-erdo { background: var(--erdo); color: var(--papir); }
.lapfej-terra { background: var(--terra-mely); color: var(--papir); }
.lapfej-racs { display: grid; gap: 44px; margin-top: clamp(16px, 3vw, 40px); }
.lapfej h1 { max-width: 20ch; font-size: clamp(2.1rem, 1.4rem + 2.8vw, 3.7rem); line-height: 1.03; letter-spacing: -.032em; }
.lapfej .lead { margin-top: 22px; max-width: 60ch; font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); color: var(--halk); }
.lapfej .lead a { color: var(--link); }
.lapfej .gombsor { margin-top: 30px; }
.lapfej-meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 26px; font-size: .9375rem; color: var(--halk); }
.lapfej-meta li { display: inline-flex; align-items: center; gap: 8px; }
.lapfej-meta .ikon { width: 20px; height: 20px; color: var(--pipa); }
.lapfej-meta a { color: var(--link); }
.lapfej-pecsetkep { width: min(100%, 340px); margin-inline: auto; transform: rotate(-7deg); filter: drop-shadow(0 22px 30px rgb(20 18 14 / .35)); }
@media (min-width: 1024px) {
  .lapfej.van-kep .lapfej-racs { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; gap: 64px; }
  .lapfej.van-kep .lapfej-racs:has(.foglalo) { align-items: start; }
}

.utvonal ol { display: flex; flex-wrap: wrap; align-items: center; }
.utvonal li { display: flex; align-items: center; font-size: .9375rem; }
.utvonal li + li::before { content: ''; width: 22px; height: 2px; margin: 0 8px; background: linear-gradient(90deg, currentColor 50%, transparent 0) 0 0 / 6px 2px repeat-x; opacity: .5; }
.utvonal a { display: inline-flex; align-items: center; min-height: 44px; color: var(--halk); text-decoration: underline; text-decoration-color: rgb(127 120 106 / .45); }
.utvonal a:hover { text-decoration-color: currentColor; }
.utvonal [aria-current] { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

/* ---- funkciók --------------------------------------------------------------------------- */
.alnav { position: relative; z-index: 30; background: var(--papir); border-bottom: 1px solid var(--vonal); }
.alnav ul { display: flex; flex-wrap: wrap; gap: 8px; padding-block: 12px; }
.alnav a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px;
  color: var(--tinta-2); font-weight: 600; font-size: .9375rem; text-decoration: none; box-shadow: inset 0 0 0 1.5px var(--vonal-eros); transition: background-color .2s, color .2s, box-shadow .2s;
}
.alnav a:hover { color: var(--tinta); box-shadow: inset 0 0 0 1.5px var(--tinta); }
.alnav a.aktiv { background: var(--tinta); color: var(--papir); box-shadow: none; }
@media (min-width: 768px) { .alnav { position: sticky; top: var(--fejlec-mag); } .alnav ul { flex-wrap: nowrap; } }
.fcs-racs { display: grid; gap: 40px 72px; }
.fcs-fej p { margin-top: 16px; max-width: 46ch; font-size: 1.125rem; color: var(--halk); }
.fcs-kep { margin-top: 40px; }
.fcs-kep .foglalo-kompozicio.kicsi .telefon { width: min(230px, 64%); }
.funkciolista li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 18px; padding: 26px 0; border-top: 1.5px dashed var(--vonal-eros); }
.funkciolista li:last-child { border-bottom: 1.5px dashed var(--vonal-eros); }
.funkciolista h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 1.25rem; }
.funkciolista p { margin-top: 8px; color: var(--halk); }
.funkciolista p a { color: var(--link); }
.funkciolista .cimke-pro { margin-top: 10px; }
.funkcio-megj { font-size: .9375rem; }
@media (min-width: 1024px) {
  .fcs-racs { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: start; }
}
@media (min-width: 1024px) and (min-height: 780px) {
  .fcs-fej { position: sticky; top: calc(var(--fejlec-mag) + 100px); }
}
.oszinte-racs { display: grid; gap: 32px 72px; align-items: start; }
.oszinte-racs p { margin-top: 16px; max-width: 48ch; color: var(--halk); }
@media (min-width: 1024px) { .oszinte-racs { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }

/* ---- táblázatok és próza ----------------------------------------------------------------------- */
.tabla, .proza .table-wrap { position: relative; overflow-x: auto; border-radius: var(--r2); background: var(--kartya); box-shadow: var(--arnyek-kicsi); }
.tabla table, .proza table { width: 100%; min-width: 600px; border-collapse: collapse; font-size: .9375rem; line-height: 1.5; color: var(--tinta-2); }
.tabla th, .tabla td, .proza th, .proza td { padding: 13px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--vonal); }
.tabla thead th, .proza thead th { background: var(--tinta); color: var(--papir); font-size: .875rem; font-weight: 700; white-space: nowrap; }
.tabla tbody th, .proza tbody th { color: var(--tinta); font-weight: 650; }
.tabla tr:last-child > *, .proza tr:last-child > * { border-bottom: 0; }
.menetrend td { text-align: center; vertical-align: middle; }
.menetrend thead th:not(:first-child) { text-align: center; }
.kiemelt-oszlop, .proza .us { background: var(--erdo-halvany); color: var(--erdo); font-weight: 650; }
thead .kiemelt-oszlop, .proza thead .us { background: var(--erdo); color: var(--papir); }
.ikon-igen { width: 22px; height: 22px; color: var(--erdo); }
.ikon-nem { width: 20px; height: 20px; color: var(--tinta-3); }
.proza .yes { color: var(--erdo); font-weight: 650; }
.proza .no { color: var(--tinta-3); }
.tabla-megj { margin-top: 16px; max-width: 80ch; font-size: .9375rem; color: var(--halk); }
.tabla-megj a { color: var(--link); }
.forras, .proza .source { max-width: 64ch; margin-top: 14px; font-size: .875rem; color: var(--tinta-3); }
.forraslista { display: grid; gap: 8px; margin-top: 22px; font-size: .875rem; color: var(--tinta-3); }
.forraslista a { color: var(--terra-mely); }

.proza { font-size: 1.09375rem; line-height: 1.72; color: var(--tinta-2); max-width: 60ch; }
.proza.szeles { max-width: none; }
.proza.hasab { max-width: 60ch; }
.proza > * + * { margin-top: 1.05em; }
.proza > :first-child { margin-top: 0; }
.proza h2 { margin-top: 2.2em; color: var(--tinta); font-size: clamp(1.5rem, 1.25rem + .8vw, 2rem); letter-spacing: -.028em; }
.proza h3 { margin-top: 1.8em; color: var(--tinta); font-size: 1.25rem; }
.proza h2 + *, .proza h3 + * { margin-top: .7em; }
.proza a { color: var(--terra-mely); }
.proza a:hover { text-decoration-thickness: 2px; }
.proza strong { color: var(--tinta); }
.proza ul, .proza ol { padding-left: 1.3em; }
.proza ul { list-style: disc; }
.proza ol { list-style: decimal; }
.proza li + li { margin-top: .45em; }
.proza li::marker { color: var(--terra-mely); font-weight: 700; }
.proza code { padding: .1em .38em; border-radius: 6px; background: var(--homok); font-size: .9em; }
.proza .note { padding: 16px 20px; border-radius: 14px; background: var(--mustar-halvany); color: var(--tinta); }
.szakasz-erdo .proza { color: var(--erdo-szoveg); }
.szakasz-erdo .proza a { color: var(--mustar); }
.szakasz-erdo .proza strong { color: var(--papir); }
.szakasz-homok .proza code { background: var(--kartya); }

/* ---- dobozok, kétoszlopos blokkok ------------------------------------------------------------- */
.ketoszlop { display: grid; gap: 24px; }
@media (min-width: 900px) { .ketoszlop { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; } }
.doboz { padding: clamp(26px, 3.4vw, 44px); border-radius: var(--r3); background: var(--kartya); color: var(--tinta); box-shadow: var(--arnyek-kicsi); }
.doboz h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 18px; font-size: clamp(1.375rem, 1.2rem + .8vw, 1.875rem); }
.doboz > * + * { margin-top: 14px; }
.doboz h2 + * { margin-top: 0; }
.doboz p { color: var(--halk); }
.doboz a { color: var(--link); }
.doboz ul:not([class]) { padding-left: 1.2em; list-style: disc; color: var(--halk); }
.doboz-erdo { background: var(--erdo); color: var(--papir); }
.doboz-homok { background: var(--homok); box-shadow: none; }
.szakasz-homok .doboz-homok { background: var(--kartya); }
.doboz-terra { background: var(--terra-mely); color: var(--papir); box-shadow: none; }
.nincs-szakma { margin-top: 40px; }
.nincs-szakma h2 { font-size: clamp(1.5rem, 1.25rem + 1vw, 2.125rem); }

.utvalaszto { border-bottom: 1.5px dashed var(--vonal-eros); }
.utvalaszto li { display: grid; gap: 10px 32px; padding: 26px 20px; border-top: 1.5px dashed var(--vonal-eros); }
.utvalaszto h3 { font-size: 1.375rem; }
.utvalaszto-ido { display: inline-flex; align-items: center; gap: 8px; justify-self: start; padding: 6px 14px; border-radius: 999px; background: var(--kartya); font-weight: 700; font-size: .9375rem; white-space: nowrap; }
.utvalaszto-ido .ikon { width: 20px; height: 20px; color: var(--terra-mely); }
.utvalaszto p { color: var(--halk); }
.utvalaszto li.mi { border-radius: var(--r2); border-top-color: transparent; background: var(--erdo); color: var(--papir); }
.utvalaszto li.mi + li { border-top-color: transparent; }
.utvalaszto .mi .utvalaszto-ido { background: var(--mustar); color: var(--tinta); }
.utvalaszto .mi .utvalaszto-ido .ikon { color: var(--tinta); }
@media (min-width: 900px) { .utvalaszto li { grid-template-columns: minmax(0, 1fr) 190px minmax(0, 1.7fr); align-items: center; } }

/* ---- szakmák ------------------------------------------------------------------------------ */
.szakmalista { border-bottom: 1.5px dashed var(--vonal-eros); }
.szakmasor { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) 44px; gap: 14px 18px; align-items: center; padding: 22px 6px; border-top: 1.5px dashed var(--vonal-eros); transition: background-color .25s; }
.szakmasor-ikon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--homok); color: var(--erdo); }
.szakmasor-ikon .ikon { width: 26px; height: 26px; }
.szakmasor h3 { font-size: clamp(1.375rem, 1.2rem + .8vw, 1.875rem); letter-spacing: -.028em; }
.szakmasor h3 a { text-decoration: none; }
.szakmasor h3 a::after { content: ''; position: absolute; inset: 0; }
.szakmasor h3 a:focus-visible { outline: none; }
.szakmasor h3 a:focus-visible::after { outline: 3px solid var(--fokusz); outline-offset: -3px; border-radius: 12px; }
.szakmasor-fo p { margin-top: 6px; color: var(--tinta-2); font-size: 1rem; }
.szakmasor-pelda { grid-column: 2 / 4; display: flex; flex-wrap: wrap; gap: 8px; }
.szakmasor-pelda li { padding: 5px 12px; border-radius: 999px; background: var(--homok); font-size: .875rem; font-weight: 600; }
.szakmasor-pelda span { color: var(--tinta-3); font-weight: 500; }
.szakmasor-nyil { grid-column: 3; grid-row: 1; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--vonal-eros); color: var(--terra-mely); transition: transform .35s var(--ease-ki), background-color .25s, color .25s; }
.szakmasor-nyil .ikon { width: 20px; height: 20px; }
.szakmasor:hover { background: rgb(239 228 203 / .5); }
.szakmasor:hover .szakmasor-nyil { background: var(--terra-mely); color: var(--papir); box-shadow: none; transform: translateX(4px); }
@media (min-width: 1024px) {
  .szakmasor { grid-template-columns: 60px minmax(0, 1.05fr) minmax(0, 1fr) 52px; gap: 12px 28px; padding: 26px 12px; }
  .szakmasor-ikon { width: 60px; height: 60px; }
  .szakmasor-pelda { grid-column: 3; grid-row: 1; }
  .szakmasor-nyil { grid-column: 4; width: 52px; height: 52px; }
}
.pontsor { display: grid; gap: 0 48px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.pontsor li { padding: 28px 0; border-top: 1.5px dashed var(--szaggat); }
.pontsor h3 { display: flex; align-items: center; gap: 14px; font-size: 1.3125rem; }
.pontsor h3 .ikon { width: 30px; height: 30px; color: var(--kiemel); }
.pontsor p { margin-top: 12px; color: var(--halk); }
.pontsor p a { color: var(--link); }

/* útmutató és tartalomjegyzékek: megállós útvonal */
.utmutato-racs, .cikk-racs, .gyik-oldal-racs { display: grid; gap: 40px 72px; }
.utmutato-nav h2, .tj-cim { margin-bottom: 12px; font-size: 1.0625rem; font-weight: 800; font-stretch: 125%; letter-spacing: 0; }
.utmutato-nav ol, .tartalomjegyzek ol, .gyik-temak ol { position: relative; display: grid; gap: 2px; }
.utmutato-nav ol::before, .tartalomjegyzek ol::before, .gyik-temak ol::before {
  content: ''; position: absolute; left: 9px; top: 16px; bottom: 16px; width: 2px;
  background: linear-gradient(var(--vonal-eros) 55%, transparent 0) 0 0 / 2px 10px repeat-y;
}
.utmutato-nav a, .tartalomjegyzek a, .gyik-temak ol a {
  position: relative; display: flex; align-items: center; min-height: 44px; padding: 8px 0 8px 34px;
  color: var(--tinta-2); font-size: .9375rem; line-height: 1.35; text-decoration: none;
}
.utmutato-nav a::before, .tartalomjegyzek a::before, .gyik-temak ol a::before {
  content: ''; position: absolute; left: 3px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%;
  background: var(--papir); box-shadow: inset 0 0 0 2px var(--vonal-eros); transition: background-color .2s, box-shadow .2s;
}
.utmutato-nav a:hover, .tartalomjegyzek a:hover, .gyik-temak ol a:hover { color: var(--tinta); text-decoration: underline; }
.utmutato-nav a:hover::before, .tartalomjegyzek a:hover::before, .gyik-temak ol a:hover::before { box-shadow: inset 0 0 0 2px var(--terra-mely); }
.utmutato-nav a.aktiv, .tartalomjegyzek a.aktiv, .gyik-temak ol a.aktiv { color: var(--tinta); font-weight: 700; }
.utmutato-nav a.aktiv::before, .tartalomjegyzek a.aktiv::before, .gyik-temak ol a.aktiv::before { background: var(--terra-mely); box-shadow: 0 0 0 3px var(--papir); }
.utmutato-blokk { padding-block: 0 44px; }
.utmutato-blokk + .utmutato-blokk { padding-top: 44px; border-top: 1.5px dashed var(--vonal-eros); }
.utmutato-blokk h3 { margin-bottom: 14px; font-size: clamp(1.375rem, 1.2rem + .7vw, 1.75rem); }
.utmutato-blokk p { max-width: 60ch; color: var(--tinta-2); }
.utmutato-blokk p + p { margin-top: 12px; }
.utmutato-blokk a { color: var(--terra-mely); }
.utmutato-nav, .tartalomjegyzek, .gyik-temak { align-self: start; padding: 20px 20px 12px; border-radius: var(--r2); background: var(--kartya); box-shadow: var(--arnyek-kicsi); }
@media (min-width: 1024px) {
  .utmutato-racs { grid-template-columns: 280px minmax(0, 1fr); }
  .cikk-racs { grid-template-columns: 260px minmax(0, 1fr); }
  .gyik-oldal-racs { grid-template-columns: 270px minmax(0, 1fr); }
  .utmutato-nav, .tartalomjegyzek, .gyik-temak { position: sticky; top: calc(var(--fejlec-mag) + 36px); padding: 0; background: none; box-shadow: none; border-radius: 0; }
  .tartalomjegyzek { max-height: calc(100vh - var(--fejlec-mag) - 72px); overflow-y: auto; }
}
.kapcsolodo { display: grid; gap: 28px; align-items: start; }
@media (min-width: 900px) { .kapcsolodo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

.atallas { display: grid; max-width: 820px; counter-reset: lepes; }
.atallas li { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 20px; padding-bottom: 28px; counter-increment: lepes; }
.atallas li::before {
  content: counter(lepes); position: relative; z-index: 1; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
  background: var(--tinta); color: var(--papir); font-weight: 800; font-stretch: 125%;
}
.atallas li:not(:last-child)::after { content: ''; position: absolute; left: 23px; top: 54px; bottom: 4px; width: 2px; background: linear-gradient(var(--vonal-eros) 55%, transparent 0) 0 0 / 2px 10px repeat-y; }
.atallas li > span { padding-top: 10px; color: var(--tinta-2); }
.atallas a { color: var(--terra-mely); }

/* ---- cikk ------------------------------------------------------------------------------ */
.repules-csik {
  position: fixed; left: 0; right: 0; top: var(--fejlec-mag); z-index: 48; height: 3px; pointer-events: none;
  background: linear-gradient(90deg, rgb(38 36 31 / .16) 55%, transparent 0) 0 0 / 12px 3px repeat-x;
}
.repules-csik::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--terra-mely) 55%, transparent 0) 0 0 / 12px 3px repeat-x;
  clip-path: inset(0 calc((1 - var(--p, 0)) * 100%) 0 0);
}
.repules-gep { position: absolute; top: -10px; left: 0; display: block; width: 22px; height: 22px; color: var(--terra-mely); transform: translateX(calc(var(--p, 0) * (100vw - 26px))); }
.repules-gep .ikon { width: 22px; height: 22px; transform: rotate(40deg); fill: var(--papir); }
.cikk-fej { padding-bottom: clamp(36px, 4vw, 60px); border-bottom: 1px solid var(--vonal); }
.cikk-fej h1 { max-width: 24ch; margin-top: clamp(16px, 3vw, 36px); }
.cikk-racs { padding-block: clamp(36px, 5vw, 72px) clamp(72px, 8vw, 112px); }
.cikk-torzs { min-width: 0; max-width: 46rem; }
.cikk-torzs > * + * { margin-top: 52px; }
.roviden { max-width: 38rem; padding: 26px 28px; border-radius: 20px; background: var(--mustar-halvany); color: var(--tinta); }
.roviden h2 { margin-bottom: 12px; font-size: 1.25rem; }
.roviden ul { padding-left: 1.2em; list-style: disc; }
.roviden li + li { margin-top: 6px; }
.roviden p + p { margin-top: 10px; }
.roviden a { color: var(--terra-mely); }
.cikk-lista h2, .forrasok h2 { font-size: 1.25rem; margin-bottom: 14px; }
.cikk-gyik h2 { margin-bottom: 12px; font-size: clamp(1.5rem, 1.25rem + .8vw, 2rem); }
.forrasok { padding-top: 32px; border-top: 1.5px dashed var(--vonal-eros); }
.forrasok ol { display: grid; gap: 10px; padding-left: 1.3em; list-style: decimal; font-size: .9375rem; color: var(--tinta-2); }
.forrasok a { color: var(--terra-mely); }
.forrasok span { color: var(--tinta-3); }
.cikk-cta { display: grid; gap: 20px; padding: clamp(26px, 3.5vw, 40px); border-radius: var(--r3); background: var(--terra-mely); color: var(--papir); }
.cikk-cta img { width: 88px; height: 88px; transform: rotate(-8deg); }
.cikk-cta h2 { font-size: clamp(1.5rem, 1.3rem + .8vw, 2rem); }
.cikk-cta p { margin-top: 10px; }
@media (min-width: 640px) {
  .cikk-cta { grid-template-columns: 88px minmax(0, 1fr); align-items: center; column-gap: 24px; }
  .cikk-cta .gombsor { grid-column: 2; }
}

/* ---- GYIK oldal, rólunk, miért -------------------------------------------------------------- */
.gyik-temak .gomb { margin: 16px 0 8px; }
.gyik-csoport + .gyik-csoport { margin-top: 64px; }
.gyik-csoport h2 { margin-bottom: 18px; font-size: clamp(1.625rem, 1.3rem + 1.2vw, 2.25rem); }
.naplo-resz { display: grid; gap: 16px 64px; padding-block: 44px; border-top: 1.5px dashed var(--vonal-eros); }
.naplo-resz:first-child { padding-top: 0; border-top: 0; }
.naplo-resz h2 { font-size: clamp(1.5rem, 1.25rem + 1vw, 2.125rem); }
@media (min-width: 1024px) { .naplo-resz { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); } }
.irj { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 48px; }
.irj h2 { font-size: clamp(1.625rem, 1.3rem + 1.2vw, 2.375rem); }
.irj p { margin-top: 10px; max-width: 52ch; color: var(--tinta-2); }
.okok { display: grid; gap: 0 64px; }
.okok li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 20px; padding-block: 32px; border-top: 1.5px dashed var(--vonal-eros); }
.okok .ikon-pecset { width: 64px; height: 64px; }
.okok h2 { margin-bottom: 12px; font-size: clamp(1.375rem, 1.2rem + .7vw, 1.75rem); }
.okok .proza { font-size: 1.0625rem; }
@media (min-width: 1024px) { .okok { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fogalmak { display: grid; gap: 8px 40px; margin-top: 48px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.fogalmak div { padding-top: 20px; border-top: 1.5px dashed var(--szaggat); }
.fogalmak dt { color: var(--kiemel); font-size: 1.125rem; font-weight: 800; font-stretch: 112%; }
.fogalmak dd { margin-top: 8px; color: var(--halk); }
.fogalmak dd a { color: var(--link); }
.masik-lista { display: grid; gap: 0 48px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.masik-lista li { padding-block: 26px; border-top: 1.5px dashed var(--vonal-eros); }
.masik-lista h3 { font-size: 1.3125rem; }
.masik-lista p { margin-block: 8px 6px; color: var(--tinta-2); }

/* ---- űrlapok (beszállókártya) --------------------------------------------------------------- */
.urlap-racs { display: grid; gap: 44px; margin-top: clamp(16px, 3vw, 40px); }
.urlap-bal h1 { max-width: 16ch; font-size: clamp(2.1rem, 1.4rem + 2.8vw, 3.5rem); line-height: 1.03; letter-spacing: -.032em; }
.urlap-bal .lead { margin-top: 20px; max-width: 46ch; font-size: 1.1875rem; color: var(--tinta-2); }
.kapcsolat-info { display: grid; gap: 24px; margin-top: 32px; }
.kapcsolat-info a:not(.chipsor a) { color: var(--terra-mely); }
.lepes-lista { display: grid; gap: 18px; margin-top: 32px; }
.lepes-lista li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; align-items: start; }
.lepes-lista-jel { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--homok); color: var(--terra-mely); }
.lepes-lista-jel .ikon { width: 22px; height: 22px; }
.lepes-lista p { padding-top: 10px; color: var(--tinta-2); }
.lepes-lista b { color: var(--tinta); }
.lepes-lista a { color: var(--terra-mely); }
@media (min-width: 1024px) { .urlap-racs { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 72px; align-items: start; } }

.urlapkartya { position: relative; border-radius: var(--r3); background: var(--kartya); color: var(--tinta); box-shadow: var(--arnyek); }
.urlap-fej { padding: 30px 30px 6px; }
.urlap-fej h2 { font-size: 1.625rem; }
.urlap-bevezeto { margin-top: 8px; font-size: .9375rem; color: var(--tinta-3); }
.urlap-mezok { display: grid; gap: 20px; padding: 22px 30px 30px; }
.mezo { display: grid; gap: 8px; }
.mezo > label { font-weight: 700; font-size: .9375rem; }
.kotelezo { color: var(--terra-mely); }
.opc { font-weight: 500; color: var(--tinta-3); }
.urlap input[type="text"], .urlap input[type="email"], .urlap select, .urlap textarea {
  width: 100%; min-height: 52px; padding: 12px 16px; border: 1.5px solid var(--mezo-keret); border-radius: 12px;
  background: #fff; color: var(--tinta); font: 400 1rem/1.4 var(--font); transition: border-color .2s, box-shadow .2s;
}
.urlap textarea { min-height: 136px; resize: vertical; }
.urlap select {
  -webkit-appearance: none; appearance: none; padding-right: 46px; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2326241F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 14px center / 18px no-repeat;
}
.urlap input:hover, .urlap select:hover, .urlap textarea:hover { border-color: var(--tinta-2); }
.urlap input:focus-visible, .urlap select:focus-visible, .urlap textarea:focus-visible { border-color: var(--erdo); outline: 3px solid var(--erdo); outline-offset: 1px; }
.urlap ::placeholder { color: #7A7466; opacity: 1; }
.urlap :is(input, select, textarea)[aria-invalid="true"] { border: 2px solid var(--terra-mely); background-color: #FFF6F2; }
.mezo-sugo { font-size: .875rem; color: var(--tinta-3); }
.mezo-hiba { display: flex; align-items: flex-start; gap: 8px; color: var(--terra-sotet); font-size: .875rem; font-weight: 600; line-height: 1.4; }
.mezo-hiba svg { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 1px; }
.mezo-hiba[hidden] { display: none; }
.csomagvalaszto { min-width: 0; margin: 0; padding: 0; border: 0; }
.csomagvalaszto legend { margin-bottom: 8px; padding: 0; font-weight: 700; font-size: .9375rem; }
.csomagok-v { display: grid; gap: 10px; }
.csomag-opcio { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 60px; padding: 12px 16px; border: 1.5px solid var(--vonal-eros); border-radius: 14px; cursor: pointer; transition: border-color .2s, background-color .2s; }
.csomag-opcio:hover { border-color: var(--tinta-2); }
.csomag-opcio:has(:checked) { border-color: var(--tinta); background: var(--mustar-halvany); box-shadow: inset 0 0 0 1px var(--tinta); }
.csomag-opcio input { width: 20px; height: 20px; margin: 0; }
.csomag-opcio input:focus-visible { outline: 3px solid var(--erdo); outline-offset: 3px; }
.csomag-nev { display: grid; line-height: 1.3; }
.csomag-nev b { font-weight: 800; }
.csomag-nev small { font-size: .8125rem; color: var(--tinta-3); }
.csomag-ar { font-weight: 800; white-space: nowrap; }
.jelolo { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; font-size: 1rem; cursor: pointer; }
.jelolo input { flex: 0 0 22px; width: 22px; height: 22px; margin: 1px 0 0; }
.jelolo a { color: var(--terra-mely); }
.urlap-jogi { font-size: .875rem; color: var(--tinta-3); }
.urlap-jogi a { color: var(--terra-mely); }
.urlap-tep { position: relative; height: 2px; margin: 0 24px; background: linear-gradient(90deg, var(--vonal-eros) 55%, transparent 0) 0 0 / 12px 2px repeat-x; }
.urlap-tep::before, .urlap-tep::after { content: ''; position: absolute; top: -13px; width: 28px; height: 28px; border-radius: 50%; background: var(--tep-hatter); }
.urlap-tep::before { left: -38px; }
.urlap-tep::after { right: -38px; }
.urlap-csonk { display: grid; gap: 14px; padding: 24px 30px 30px; }
.proto-jelzes { display: flex; align-items: flex-start; gap: 10px; font-size: .875rem; color: var(--tinta-3); }
.proto-jelzes .ikon { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 2px; color: var(--erdo); }
.proto-jelzes a { color: var(--terra-mely); }
.siker { display: grid; gap: 14px; justify-items: start; padding: 34px 30px; outline: none; }
.siker[hidden] { display: none; }
.siker-jel { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: var(--erdo); color: var(--papir); }
.siker-jel .ikon { width: 30px; height: 30px; }
.siker h2 { font-size: 1.625rem; }
.siker p { color: var(--tinta-2); }
.siker p a { color: var(--terra-mely); }
.siker .gombsor { margin-top: 8px; }

/* ---- 404 ------------------------------------------------------------------------------- */
.hiba404 { position: relative; overflow: clip; padding-block: clamp(64px, 9vw, 128px) clamp(120px, 14vw, 200px); }
.hiba404 .tarto { position: relative; z-index: 1; }
.hiba404 .hiba-kod { margin-top: 0; max-width: none; color: var(--terra); font-size: clamp(4.5rem, 3rem + 6vw, 6rem); font-weight: 900; font-stretch: 125%; line-height: .9; letter-spacing: -.04em; }
.hiba404 h1 { margin-top: 18px; max-width: 16ch; font-size: clamp(2.1rem, 1.4rem + 2.8vw, 3.5rem); }
.hiba404 p { margin-top: 18px; max-width: 52ch; font-size: 1.125rem; color: var(--tinta-2); }
.hiba404 .gombsor { margin-top: 32px; }

/* ---- csökkentett mozgás ----------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .kepeslap:hover, .gomb-terra:hover, .gomb-tinta:hover { transform: none; }
}
