/* V3 – letépős naptár.
   Erdőzöld filctábla, rajta papírtárgyak: a naptártömb, a múlt hét letépett lapjai, az árcédulák, a lap hátoldala.
   Betűk: Big Shoulders Display (számok, címek), Schibsted Grotesk (szöveg).
   Felület-tokenek: a táblán --fg = papír, a papíron --fg = tinta; minden összetevő ezekből színez. */

:root {
  --tabla: #17453A;
  --tabla-mely: #113A30;
  --tabla-sotet: #0C2F26;
  --papir: #EFEDE6;
  --papir-feher: #F7F6F1;
  --papir-lap: #F6F4EE;
  --papir-hat: #E7E3D8;
  --papir-ful: #DEDACD;
  --karton: #1E2420;
  --tinta: #1A1C1A;
  --tinta-2: #45514A;
  --piros: #C2301B;
  --piros-mely: #A12512;
  --zsalya: #B2D2C3;
  --sarga: #F3D36B;
  --vonal: #6E7A72;
  --zold-tinta: #1E5A49;
  --cetli: #F1E5B5;
  --zsineg: #D6C9A8;

  --betu-cim: 'Big Shoulders Display', 'Arial Narrow', 'Roboto Condensed', sans-serif;
  --betu: 'Schibsted Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --szeles: 76rem;
  --oldalt: clamp(1rem, 4vw, 2.5rem);
  --szakasz: clamp(4rem, 8vw, 7.5rem);
  --r: 5px;
  --arnyek-lap: 0 1px 1px rgb(6 22 17 / .2), 0 12px 24px -8px rgb(6 22 17 / .5), 0 36px 64px -28px rgb(6 22 17 / .55);
  --arnyek-kicsi: 0 1px 1px rgb(6 22 17 / .18), 0 6px 14px -6px rgb(6 22 17 / .45);
  --gyors: 160ms;
  --kozepes: 260ms;
  --kimenet: cubic-bezier(.2, .8, .2, 1);

  --fg: var(--papir);
  --fg-2: var(--zsalya);
  --hatar: rgb(178 210 195 / .3);
  --fokusz: var(--sarga);
  --jel: var(--papir);

  /* Tépett papírszél: 160×12-es, vízszintesen hézagmentesen ismételhető csempe, mindenhol ugyanazzal a vonallal.
     A --szel-fent és a --szel-lent maszk (a vonal alatt, illetve felett fed). A --szel-papir és a --szel-csonk ugyanez
     --papir-lap színnel, háttérképnek: ott kell, ahol a szél árnyékot is vet, mert a maszk az árnyékot is levágná. */
  --szel-fent: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='12' viewBox='0 0 160 12'%3E%3Cpath d='M0 3.8L2 3.3L4 4.1L6 4.2L8 4.6L10 5.6L12 5.3L14 5.5L16 5.0L18 5.5L20 6.1L22 5.2L24 4.8L26 4.5L28 4.4L30 4.9L32 5.1L34 6.2L36 6.0L38 6.7L40 6.1L42 7.4L44 8.0L46 9.0L48 8.1L50 8.2L52 6.6L54 6.9L56 7.0L58 7.4L60 6.7L62 5.5L64 5.5L66 5.5L68 5.6L70 6.7L72 7.0L74 5.6L76 5.6L78 4.8L80 6.2L82 6.5L84 5.0L86 4.8L88 3.1L90 3.6L92 3.3L94 3.6L96 4.7L98 4.4L100 3.5L102 4.7L104 5.6L106 6.0L108 7.4L110 6.6L112 7.4L114 7.3L116 6.2L118 7.5L120 6.8L122 6.3L124 6.6L126 6.6L128 5.7L130 6.9L132 7.7L134 8.3L136 7.7L138 7.7L140 7.0L142 8.4L144 7.4L146 7.3L148 7.0L150 5.5L152 5.0L154 5.2L156 4.3L158 4.4L160 3.8L160 12L0 12Z'/%3E%3C/svg%3E");
  --szel-lent: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='12' viewBox='0 0 160 12'%3E%3Cpath d='M0 0L160 0L160 3.8L158 4.4L156 4.3L154 5.2L152 5.0L150 5.5L148 7.0L146 7.3L144 7.4L142 8.4L140 7.0L138 7.7L136 7.7L134 8.3L132 7.7L130 6.9L128 5.7L126 6.6L124 6.6L122 6.3L120 6.8L118 7.5L116 6.2L114 7.3L112 7.4L110 6.6L108 7.4L106 6.0L104 5.6L102 4.7L100 3.5L98 4.4L96 4.7L94 3.6L92 3.3L90 3.6L88 3.1L86 4.8L84 5.0L82 6.5L80 6.2L78 4.8L76 5.6L74 5.6L72 7.0L70 6.7L68 5.6L66 5.5L64 5.5L62 5.5L60 6.7L58 7.4L56 7.0L54 6.9L52 6.6L50 8.2L48 8.1L46 9.0L44 8.0L42 7.4L40 6.1L38 6.7L36 6.0L34 6.2L32 5.1L30 4.9L28 4.4L26 4.5L24 4.8L22 5.2L20 6.1L18 5.5L16 5.0L14 5.5L12 5.3L10 5.6L8 4.6L6 4.2L4 4.1L2 3.3L0 3.8Z'/%3E%3C/svg%3E");
  --szel-papir: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='12' viewBox='0 0 160 12'%3E%3Cpath fill='%23F6F4EE' d='M0 3.8L2 3.3L4 4.1L6 4.2L8 4.6L10 5.6L12 5.3L14 5.5L16 5.0L18 5.5L20 6.1L22 5.2L24 4.8L26 4.5L28 4.4L30 4.9L32 5.1L34 6.2L36 6.0L38 6.7L40 6.1L42 7.4L44 8.0L46 9.0L48 8.1L50 8.2L52 6.6L54 6.9L56 7.0L58 7.4L60 6.7L62 5.5L64 5.5L66 5.5L68 5.6L70 6.7L72 7.0L74 5.6L76 5.6L78 4.8L80 6.2L82 6.5L84 5.0L86 4.8L88 3.1L90 3.6L92 3.3L94 3.6L96 4.7L98 4.4L100 3.5L102 4.7L104 5.6L106 6.0L108 7.4L110 6.6L112 7.4L114 7.3L116 6.2L118 7.5L120 6.8L122 6.3L124 6.6L126 6.6L128 5.7L130 6.9L132 7.7L134 8.3L136 7.7L138 7.7L140 7.0L142 8.4L144 7.4L146 7.3L148 7.0L150 5.5L152 5.0L154 5.2L156 4.3L158 4.4L160 3.8L160 12L0 12Z'/%3E%3C/svg%3E");
  --szel-csonk: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='12' viewBox='0 0 160 12'%3E%3Cpath fill='%23F6F4EE' d='M0 0L160 0L160 3.8L158 4.4L156 4.3L154 5.2L152 5.0L150 5.5L148 7.0L146 7.3L144 7.4L142 8.4L140 7.0L138 7.7L136 7.7L134 8.3L132 7.7L130 6.9L128 5.7L126 6.6L124 6.6L122 6.3L120 6.8L118 7.5L116 6.2L114 7.3L112 7.4L110 6.6L108 7.4L106 6.0L104 5.6L102 4.7L100 3.5L98 4.4L96 4.7L94 3.6L92 3.3L90 3.6L88 3.1L86 4.8L84 5.0L82 6.5L80 6.2L78 4.8L76 5.6L74 5.6L72 7.0L70 6.7L68 5.6L66 5.5L64 5.5L62 5.5L60 6.7L58 7.4L56 7.0L54 6.9L52 6.6L50 8.2L48 8.1L46 9.0L44 8.0L42 7.4L40 6.1L38 6.7L36 6.0L34 6.2L32 5.1L30 4.9L28 4.4L26 4.5L24 4.8L22 5.2L20 6.1L18 5.5L16 5.0L14 5.5L12 5.3L10 5.6L8 4.6L6 4.2L4 4.1L2 3.3L0 3.8Z'/%3E%3C/svg%3E");
}

/* A papír felületek: itt tinta a szöveg, és a fókuszgyűrű is tinta. */
.iv, .hatlap, .napterv, .lap, .datumlap, .urlaplap, .menu, .temakartya, .nevjegy, .cedula-lap, .fizetes,
.tepett-lap, .falra-csik, .levelminta-lap, .lablec-honap, .cetli, .hianyzo-karton {
  --fg: var(--tinta);
  --fg-2: var(--tinta-2);
  --hatar: rgb(26 28 26 / .17);
  --fokusz: var(--tinta);
  --jel: var(--zold-tinta);
  color: var(--fg);
}

/* ---- Alapok ------------------------------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 5.5rem;
  background: var(--tabla);
  color-scheme: light;
}
body {
  min-height: 100vh;
  font-family: var(--betu);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--fg);
  background-color: var(--tabla);
  /* Filc: finom szálas zaj, és egy lámpafény a bal felső sarokból. */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .2 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
    radial-gradient(120% 70% at 12% 0%, rgb(255 255 255 / .06), transparent 60%);
  background-attachment: scroll;
  overflow-x: clip;
  font-variant-numeric: lining-nums;
  -webkit-font-smoothing: antialiased;
}
@media (min-width: 1024px) { body { font-size: 1.0625rem; } }
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
ul[class], ol[class], nav ul, nav ol, .lablec ul, .temakartya ol { list-style: none; padding: 0; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { text-decoration-thickness: 2px; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--fokusz); outline-offset: 3px; border-radius: 2px; }
::selection { background: var(--sarga); color: var(--tinta); }

h1, h2, h3 {
  font-family: var(--betu-cim);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
  text-wrap: balance;
  overflow-wrap: break-word;
  hyphens: manual;
}
h1 { font-size: clamp(2.6rem, 1.8rem + 3.4vw, 4.6rem); line-height: .95; }
h2 { font-size: clamp(2.1rem, 1.6rem + 2.1vw, 3.4rem); line-height: 1.02; }
h3 { font-size: 1.5rem; font-weight: 700; line-height: 1.08; }
p, li, dd, dt { text-wrap: pretty; }

.sr {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}
.egyben { white-space: nowrap; }
.tarto { width: 100%; max-width: var(--szeles); margin-inline: auto; padding-inline: var(--oldalt); }
.apro { font-size: .875rem; color: var(--fg-2); max-width: 56ch; }
.tovabb { margin-top: 1.5rem; }

.ugro {
  position: absolute; left: 1rem; top: -4rem; z-index: 100;
  padding: .75rem 1rem; background: var(--sarga); color: var(--tinta);
  font-weight: 700; border-radius: var(--r); text-decoration: none;
}
.ugro:focus { top: 1rem; }
main:focus { outline: none; }

.ikon { width: 1.25rem; height: 1.25rem; flex: none; }

/* ---- Gombok --------------------------------------------------------------------------------------------- */
.gombsor { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.gomb {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  min-height: 48px; padding: .7rem 1.3rem;
  font-family: var(--betu); font-weight: 700; font-size: 1rem; line-height: 1.2;
  text-decoration: none; text-align: center;
  border: 1.5px solid transparent; border-radius: var(--r);
  transition: background-color var(--gyors), color var(--gyors), border-color var(--gyors), transform var(--gyors) var(--kimenet), box-shadow var(--gyors);
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.gomb:hover { text-decoration: none; transform: translateY(-1px); }
.gomb:active { transform: translateY(1px); }
.gomb .ikon { width: 1.1rem; height: 1.1rem; }
.gomb .ikon-nyil { transition: transform var(--gyors) var(--kimenet); }
.gomb:hover .ikon-nyil { transform: translateX(3px); }
.gomb-papir { background: var(--papir); color: var(--tinta); box-shadow: 0 1px 2px rgb(6 22 17 / .25), 0 6px 14px -6px rgb(6 22 17 / .45); }
.gomb-papir:hover { background: #FFFFFF; }
.gomb-vonal { background: transparent; color: var(--fg); border-color: currentColor; }
.gomb-vonal:hover { background: rgb(239 237 230 / .1); }
.iv .gomb-vonal:hover, .urlaplap .gomb-vonal:hover { background: rgb(26 28 26 / .06); }
.gomb-tinta { background: var(--tinta); color: var(--papir-lap); }
.gomb-tinta:hover { background: #000000; }
.gomb-piros { background: var(--piros); color: var(--papir-lap); box-shadow: 0 1px 2px rgb(80 14 6 / .3), 0 8px 16px -8px rgb(120 20 8 / .55); }
.gomb-piros:hover { background: var(--piros-mely); }
.gomb-kicsi { min-height: 44px; padding: .5rem 1rem; font-size: .9375rem; }
.gomb-teljes { width: 100%; }
.gomb[disabled] { opacity: .45; cursor: not-allowed; transform: none; }
.gomb.tolt { position: relative; color: transparent !important; }
.gomb.tolt::after {
  content: ''; position: absolute; width: 1.25rem; height: 1.25rem;
  border: 2.5px solid var(--papir-lap); border-right-color: transparent; border-radius: 50%;
  animation: forog 700ms linear infinite;
}
@keyframes forog { to { transform: rotate(360deg); } }

.szovegnyil {
  display: inline-block; min-height: 44px; padding-block: .7rem; line-height: 1.4;
  font-weight: 700; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
}
.szovegnyil .ikon { display: inline-block; vertical-align: -.18em; margin-left: .4rem; width: 1.05rem; height: 1.05rem; transition: transform var(--gyors) var(--kimenet); }
.szovegnyil:hover .ikon { transform: translateX(3px); }

/* ---- Címkék ------------------------------------------------------------------------------------------------ */
.cimke {
  display: inline-flex; align-items: center; vertical-align: middle;
  padding: .12rem .5rem .14rem; border-radius: 3px;
  font-family: var(--betu); font-size: .75rem; font-weight: 700; line-height: 1.3;
  letter-spacing: .02em; white-space: nowrap;
  border: 1px solid currentColor;
}
.cimke-minta { color: var(--fg-2); border-style: dashed; }
.cimke-pro { background: var(--zold-tinta); border-color: var(--zold-tinta); color: var(--papir-lap); }
.cimke-piros { background: var(--piros); border-color: var(--piros); color: var(--papir-lap); }
.cimke-hamarosan { color: var(--piros-mely); border-style: dashed; }
.cimke-semleges { color: var(--fg-2); }

/* ---- Listák -------------------------------------------------------------------------------------------------- */
.pipalista, .xlista { display: grid; gap: .55rem; margin-top: 1rem; }
.pipalista li, .xlista li { display: flex; gap: .65rem; align-items: flex-start; }
.pipalista .ikon, .xlista .ikon { margin-top: .2rem; width: 1.15rem; height: 1.15rem; }
.pipalista .ikon { color: var(--jel); }
.xlista .ikon { color: var(--piros); }

/* ---- Rajzszög (a tömb akasztója) és a táblára tett, megdöntött tárgyak ----------------------------------- */
.szog {
  position: absolute; z-index: 3; top: -.55rem; left: 50%;
  width: 1.15rem; height: 1.15rem; margin-left: -.575rem; border-radius: 50%;
  background: radial-gradient(circle at 35% 32%, #F08A73 0 14%, var(--piros) 38%, #7E1B0D 100%);
  box-shadow: 0 2px 2px rgb(0 0 0 / .35), 2px 5px 6px -1px rgb(0 0 0 / .3);
}
.tuzott {
  position: relative;
  transform: rotate(var(--dont, 0deg));
  filter: drop-shadow(0 1px 1px rgb(6 22 17 / .25)) drop-shadow(0 14px 18px rgb(6 22 17 / .35));
}

/* ---- Fejléc ------------------------------------------------------------------------------------------------- */
.fejlec {
  position: sticky; top: 0; z-index: 60;
  background: var(--tabla-mely);
  border-bottom: 1px solid rgb(178 210 195 / .16);
  transition: box-shadow var(--kozepes);
}
.fejlec.gorgetve { box-shadow: 0 10px 24px -14px rgb(0 0 0 / .7); }
.fejlec-sor { display: flex; align-items: center; gap: 1.25rem; min-height: 4rem; }
.marka {
  display: inline-flex; align-items: center; gap: .55rem;
  text-decoration: none; color: var(--papir); min-height: 44px;
}
.marka img { width: 2.25rem; height: 2.25rem; }
.marka-nev { font-family: var(--betu-cim); font-weight: 800; font-size: 1.6rem; line-height: 1; letter-spacing: .01em; }
.fonav { display: none; margin-left: 1rem; }
.fonav ul { display: flex; gap: .25rem; }
.fonav a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 .75rem;
  font-weight: 600; font-size: .9375rem; text-decoration: none; color: var(--papir);
  border-radius: var(--r);
}
.fonav a:hover { background: rgb(239 237 230 / .08); }
.fonav a[aria-current="page"], .fonav a.aktiv {
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .5em;
}
.fonav a.aktiv { text-decoration-style: dotted; }
.fejlec-jobb { margin-left: auto; display: flex; align-items: center; gap: .75rem; }
.belepes {
  display: none; align-items: center; min-height: 44px; padding: 0 .4rem;
  font-weight: 600; font-size: .9375rem; color: var(--zsalya); text-decoration: none;
}
.belepes:hover { color: var(--papir); text-decoration: underline; }
.menugomb {
  display: inline-flex; align-items: center; gap: .5rem;
  min-height: 44px; min-width: 44px; padding: 0 .75rem;
  background: transparent; color: var(--papir);
  border: 1.5px solid rgb(239 237 230 / .45); border-radius: var(--r);
  font-weight: 600; font-size: .9375rem;
}
.menugomb:hover { border-color: var(--papir); }
.menugomb-jel { display: grid; gap: 4px; width: 1.1rem; }
.menugomb-jel i { display: block; height: 2px; background: currentColor; border-radius: 1px; transition: transform var(--kozepes) var(--kimenet), opacity var(--gyors); }
.menugomb[aria-expanded="true"] .menugomb-jel i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menugomb[aria-expanded="true"] .menugomb-jel i:nth-child(2) { opacity: 0; }
.menugomb[aria-expanded="true"] .menugomb-jel i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
@media (max-width: 479.98px) {
  .menugomb { padding: 0; justify-content: center; }
  .menugomb-szoveg { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fejlec-sor { gap: .75rem; }
  .fejlec-jobb { gap: .5rem; }
  .fejlec-cta { padding-inline: .8rem; }
}
@media (min-width: 720px) { .belepes { display: inline-flex; } }
@media (min-width: 1100px) { .fonav { display: block; } }

/* Menü: a tábla elé lehúzott papírlap */
.menu {
  position: fixed; inset: 4rem 0 0; z-index: 55;
  overflow-y: auto; overscroll-behavior: contain;
  background: var(--papir);
  box-shadow: 0 20px 40px rgb(0 0 0 / .4);
}
.menu-belso { padding-block: clamp(1.5rem, 4vw, 3rem) 3rem; display: grid; gap: 2rem; }
.menu-lista { display: grid; gap: 0; }
.menu-lista a {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  min-height: 3.5rem; padding: .35rem 0;
  font-family: var(--betu-cim); font-weight: 800; font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem); line-height: 1.05;
  text-decoration: none; border-bottom: 1px solid var(--hatar);
}
.menu-lista a:hover { color: var(--piros); }
.menu-lista a[aria-current="page"] { color: var(--piros); }
.menu-lista .ikon { width: 1.5rem; height: 1.5rem; }
.menu-lab { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; }
.menu-masod { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
@media (min-width: 900px) {
  .menu-lista { grid-template-columns: 1fr 1fr; column-gap: 3rem; }
}
body.menu-nyitva { overflow: hidden; }

/* ---- Szakaszok a táblán ------------------------------------------------------------------------------ */
.szakasz { padding-block: var(--szakasz); position: relative; }
.szakasz > .tarto > h2, .tobbi h2 { margin-bottom: 1.5rem; }

/* ================================================================================================
   Kezdőlap – hero: a mondat, a naptártömb és egy gomb. Mobilon ebben a sorrendben, asztalin a tömb jobbra kerül.
   ================================================================================================ */
.hero { position: relative; padding-block: clamp(.75rem, 1.4vw, 1.25rem) clamp(3rem, 5vw, 4.5rem); overflow-x: clip; }
.hero-racs { display: grid; gap: 1rem; }
.hero h1 { font-size: clamp(2.5rem, 1rem + 3.6vw, 4.25rem); line-height: .97; max-width: 15ch; }
/* Kétszintű cím: a mai állapot a kisebb előzmény, a holnapi ígéret a nagy sor. */
.hero-ma { display: block; font-size: .5em; line-height: 1.1; color: var(--zsalya); font-weight: 600; }
.hero-holnap { display: block; color: var(--papir); font-weight: 850; margin-top: .22em; }
.hero-tett { display: grid; gap: 1rem; margin-top: .75rem; }
.hero-sugo { display: flex; gap: .8rem; align-items: center; max-width: 31rem; font-size: .9375rem; line-height: 1.45; color: var(--zsalya); }
.hero-sugo b { color: var(--papir); font-weight: 700; }
.hero-sugo-nyil {
  flex: none; display: grid; place-items: center; width: 2.5rem; height: 2.5rem;
  border: 1.5px dashed rgb(178 210 195 / .7); border-radius: 50%; color: var(--papir);
}
/* Mobilon a tömb a gomb fölött van, ezért a nyíl felfelé mutat; asztalin jobbra. */
.hero-sugo-nyil .ikon { width: 1.1rem; height: 1.1rem; transform: rotate(-90deg); }
html:not(.js) .hero-sugo { display: none; }
@media (min-width: 1024px) {
  .hero-racs {
    grid-template-columns: minmax(0, 1fr) minmax(0, 32rem); grid-template-rows: 1fr auto auto 1fr;
    column-gap: clamp(3rem, 6vw, 6rem); row-gap: 2rem;
  }
  .hero h1 { grid-column: 1; grid-row: 2; }
  .hero-tett { grid-column: 1; grid-row: 3; margin-top: 0; }
  .hero .tomb { grid-column: 2; grid-row: 1 / -1; }
  .hero-sugo-nyil .ikon { transform: none; }
}
@media (min-width: 1280px) { .hero-racs { grid-template-columns: minmax(0, 1fr) 36rem; } }

/* ---- A naptártömb -------------------------------------------------------------------------------------- */
.tomb { position: relative; width: min(100%, 36rem); margin-inline: auto; padding-top: 2rem; }
.tomb-akaszto { position: absolute; inset: 0 0 auto; height: 2rem; pointer-events: none; z-index: 2; }
.tomb-akaszto .szog { top: .2rem; }
.tomb-akaszto::before, .tomb-akaszto::after { content: ''; position: absolute; top: .8rem; bottom: -.55rem; width: 37%; }
.tomb-akaszto::before {
  right: 50%;
  background: linear-gradient(to bottom right, transparent calc(50% - 1.2px), var(--zsineg) calc(50% - .6px), var(--zsineg) calc(50% + .6px), transparent calc(50% + 1.2px));
}
.tomb-akaszto::after {
  left: 50%;
  background: linear-gradient(to bottom left, transparent calc(50% - 1.2px), var(--zsineg) calc(50% - .6px), var(--zsineg) calc(50% + .6px), transparent calc(50% + 1.2px));
}
.tomb-karton {
  position: relative;
  background: var(--karton);
  padding: 1rem .7rem 1.2rem;
  border-radius: 3px;
  box-shadow: var(--arnyek-lap);
}
/* Két fűzőlyuk a karton tetején, ide fut a zsineg. */
.tomb-karton::before, .tomb-karton::after {
  content: ''; position: absolute; top: .3rem; width: .5rem; height: .5rem; border-radius: 50%;
  background: var(--tabla-sotet); box-shadow: inset 0 1px 1px rgb(0 0 0 / .6), 0 0 0 1.5px #8C8F86;
}
.tomb-karton::before { left: calc(13% - .25rem); }
.tomb-karton::after { right: calc(13% - .25rem); }
/* A fejkép a plakát felső része: a templomtorony, a teljes nap és a papírrepülő a csíkjával.
   Egy hasábban teljes szélességű csík; asztalon keretezett kép középen, a felirat két oldalt (lent). */
.tomb-fej img { width: 100%; height: auto; aspect-ratio: 3.4; max-height: 8.5rem; object-fit: cover; object-position: 50% 0; border-radius: 1px; }
.tomb-felirat {
  display: flex; justify-content: space-between; gap: .5rem;
  padding: .5rem .1rem .6rem;
  font-family: var(--betu-cim); font-weight: 700; font-size: .8125rem; line-height: 1;
  letter-spacing: .16em; text-transform: uppercase; color: var(--papir);
}
@media (min-width: 1024px) {
  .tomb-fej { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-rows: 1fr 1fr; column-gap: .9rem; padding-bottom: .55rem; }
  .tomb-fej img { grid-column: 2; grid-row: 1 / -1; width: auto; height: clamp(4.5rem, 11vh, 6.5rem); max-height: none; }
  .tomb-felirat { display: contents; }
  .tomb-felirat span:nth-child(1) { grid-column: 1; grid-row: 1; align-self: end; }
  .tomb-felirat span:nth-child(2) { grid-column: 1; grid-row: 2; align-self: start; margin-top: .45rem; font-size: .6875rem; line-height: 1.25; color: var(--zsalya); }
  .tomb-felirat span:nth-child(3) { grid-column: 3; grid-row: 1 / -1; align-self: center; justify-self: end; font-size: 1.75rem; letter-spacing: .06em; }
}
/* A piros kötéscsík, rajta két drótkarika; a karika a legfelső lap lyukán fut át (kepek/karika.svg). */
.tomb-kotes {
  position: relative; z-index: 9; height: .95rem;
  background: var(--piros);
  box-shadow: 0 2px 3px rgb(0 0 0 / .35), inset 0 -1px 1px rgb(0 0 0 / .25);
}
.karika { position: absolute; top: .06875rem; left: 25%; width: 1.5rem; height: 1.875rem; max-width: none; translate: -50% 0; }
.karika + .karika { left: 75%; }
.tomb-lapok { position: relative; --maradek: 7; }
/* A tömb vastagsága: annyi papírél, ahány lap maradt. */
.tomb-lapok::after {
  content: ''; position: absolute; left: 1px; right: 1px; top: 100%;
  height: calc(var(--maradek) * 2px);
  background: repeating-linear-gradient(#EFECE3 0 1px, #C5C0B1 1px 2px);
  transition: height var(--kozepes);
}
/* A letépett lap csonkja: a kötés alatt marad, alsó széle ugyanaz a tépésvonal, mint a letépett lap teteje.
   Háttérkép és nem maszk, hogy a szél árnyékot vessen a következő lapra. Húzás közben is látszik. */
.tomb-csonk {
  position: absolute; z-index: 8; inset: 0 0 auto; height: calc(.95rem + 6px);
  background: linear-gradient(var(--papir-lap) 0 0) 0 0 / 100% calc(.95rem - 5px) no-repeat, var(--szel-csonk) 0 100% / 160px 12px repeat-x;
  filter: drop-shadow(0 1px 1px rgb(26 28 26 / .28));
  display: none;
}
.van-csonk .tomb-csonk, .huz .tomb-csonk { display: block; }
.lapok { display: grid; margin: 0; position: relative; }
.lap {
  grid-area: 1 / 1;
  position: relative;
  display: flex; flex-direction: column;
  padding: 1.35rem 1.15rem 1.2rem;
  background: var(--papir-lap);
  background-image: linear-gradient(rgb(26 28 26 / .03), transparent 30%);
  container-type: inline-size;
  transform-origin: 0 0;
  box-shadow: 0 1px 1px rgb(0 0 0 / .1);
}
.lap:nth-child(1) { z-index: 7; }
.lap:nth-child(2) { z-index: 6; }
.lap:nth-child(3) { z-index: 5; }
.lap:nth-child(4) { z-index: 4; }
.lap:nth-child(5) { z-index: 3; }
.lap:nth-child(6) { z-index: 2; }
.lap:nth-child(7) { z-index: 1; }
.lap.letepve { visibility: hidden; }
/* Nyugalomban csak a legfelső lap látszik. Húzás és lapmozgás közben (.huz, .mozog) a közvetlenül alatta lévő is,
   mert a mozgó lap mögül kilátszik; a mélyebbek soha. */
.lap:not(.letepve):not(.tep) ~ .lap ~ .lap,
.tomb:not(.huz):not(.mozog) .lap:not(.letepve):not(.tep) ~ .lap { visibility: hidden; }
.lap:last-child .lap-ful { display: none; }
/* Húzás és tépés közben a lap a perforáció mentén szakad: a felső csík a kötésben marad (.tomb-csonk).
   A szél itt is háttérkép, mert a maszk a lap árnyékát is levágná. */
.lap.tep, .lap.huzott {
  z-index: 20;
  background:
    var(--szel-papir) 0 calc(.95rem - 6px) / 160px 12px repeat-x,
    linear-gradient(rgb(26 28 26 / .03), transparent 30%) 0 calc(.95rem + 5px) / 100% 100% no-repeat,
    linear-gradient(var(--papir-lap) 0 0) 0 calc(.95rem + 5px) / 100% 100% no-repeat;
  box-shadow: 0 18px 30px -10px rgb(0 0 0 / .45);
}
.lap.tep::before, .lap.huzott::before { display: none; }
/* Perforáció a lap tetején */
.lap::before {
  content: ''; position: absolute; left: 0; right: 0; top: .95rem;
  border-top: 2px dotted rgb(26 28 26 / .2);
}
.lap-fej {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: .35rem 0 .4rem; border-bottom: 1.5px solid currentColor;
  font-family: var(--betu-cim); font-weight: 800; font-size: 1.125rem; line-height: 1;
  letter-spacing: .14em; text-transform: uppercase;
}
.lap-szam {
  margin: .55rem 0 .15rem;
  font-family: var(--betu-cim); font-weight: 900;
  font-size: clamp(6rem, min(62cqi, 33vh), 23rem); line-height: .8; letter-spacing: -.02em;
  text-align: center; font-variant-numeric: lining-nums;
}
.lap-nap {
  display: flex; flex-direction: column; align-items: center; gap: .25rem;
  font-family: var(--betu-cim); font-weight: 800; font-size: 1.7rem; line-height: 1;
  letter-spacing: .12em; text-transform: uppercase; text-align: center;
}
.lap-unnep { font-size: .95rem; letter-spacing: .1em; }
.piros .lap-fej, .piros .lap-szam, .piros .lap-nap { color: var(--piros); }
.lap-apro {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .1rem .85rem;
  margin-top: .6rem; font-size: .8125rem; line-height: 1.4; color: var(--tinta-2);
}
.lap-also { margin-top: .8rem; padding-top: .75rem; border-top: 1px dashed rgb(26 28 26 / .32); }
.lap-cim { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; font-weight: 700; font-size: 1.0625rem; line-height: 1.3; }
.lap-szoveg { margin-top: .35rem; font-size: .9375rem; line-height: 1.5; color: var(--tinta-2); }
.lap-vege .gombsor { margin-top: .85rem; }
/* Öt sáv egy sorban, mobilon is. */
.savok { display: flex; gap: .4rem; margin-top: .65rem; }
.savok li { flex: 1 1 0; min-width: 0; }
.sav {
  width: 100%; min-height: 44px; padding: .35rem .2rem;
  font-family: var(--betu); font-weight: 700; font-size: 1rem; line-height: 1;
  background: var(--papir-feher); color: var(--tinta);
  border: 1.5px solid var(--tinta); border-radius: 4px;
  transition: background-color var(--gyors), color var(--gyors), transform var(--gyors) var(--kimenet);
  touch-action: manipulation;
}
.sav:hover { background: #FFFFFF; transform: translateY(-1px); }
.sav[aria-pressed="true"] { background: var(--tinta); color: var(--papir-lap); }
.lap-sugo { margin-top: .6rem; min-height: 2.9em; font-size: .875rem; line-height: 1.45; color: var(--tinta-2); }
.pecset {
  position: absolute; z-index: 2; right: 6%; top: 24cqi;
  display: grid; justify-items: center; gap: .1rem;
  padding: .35rem .7rem .4rem;
  border: 3px solid var(--piros); border-radius: 6px;
  color: var(--piros); background: rgb(246 244 238 / .72);
  font-family: var(--betu-cim); text-transform: uppercase; line-height: 1;
  transform: rotate(-11deg);
  pointer-events: none;
}
.pecset span { font-weight: 800; font-size: 1.05rem; letter-spacing: .16em; }
.pecset b { font-weight: 900; font-size: 2.1rem; letter-spacing: .02em; }
.pecset.uj { animation: pecsetel 240ms var(--kimenet) both; }
@keyframes pecsetel {
  from { opacity: 0; transform: rotate(-11deg) scale(1.55); }
  to { opacity: 1; transform: rotate(-11deg) scale(1); }
}
/* Szamárfül: innen húzva tépődik le a lap */
.lap-ful { display: none; position: absolute; right: 0; bottom: 0; width: 3.25rem; height: 3.25rem; cursor: grab; touch-action: none; z-index: 3; }
.js .lap-ful { display: block; }
.lap-ful::before {
  content: ''; position: absolute; right: 0; bottom: 0; width: 1.5rem; height: 1.5rem;
  background: linear-gradient(to top left, #CFCABB 0 calc(50% - .6px), rgb(26 28 26 / .28) 50%, var(--papir-ful) calc(50% + .6px));
  box-shadow: -2px -2px 3px rgb(0 0 0 / .1);
  transition: width var(--gyors) var(--kimenet), height var(--gyors) var(--kimenet);
}
.lap-ful:hover::before, .huz .lap-ful::before { width: 2.1rem; height: 2.1rem; }
.huz .lap-ful { cursor: grabbing; }
.tomb-vezerlo { display: none; flex-wrap: wrap; align-items: center; gap: .65rem; margin-top: 1.3rem; }
.js .tomb-vezerlo { display: flex; }
.tomb-vezerlo .gomb { min-height: 46px; }
.tomb-szamlalo { margin-left: auto; font-family: var(--betu-cim); font-weight: 700; font-size: 1.25rem; color: var(--zsalya); font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.tomb-szamlalo b { color: var(--papir); font-weight: 800; }
@media (max-width: 479.98px) {
  .tomb-karton { padding-inline: .5rem; }
  .lap { padding-inline: .9rem; }
  .lap-apro { font-size: .75rem; }
  .lap-apro > span:first-child { display: none; }
  .tomb-felirat span:nth-child(2) { display: none; }
  .tomb-vezerlo { margin-top: 1rem; }
  .tomb-vezerlo .gomb { flex: 1 1 auto; }
  .tomb-szamlalo { margin-left: 0; }
}
/* Egy hasábban a szám a látható képernyőmagasságból számol (svh: mobilon a böngészősávok nélküli rész). */
@media (max-width: 1023.98px) {

  .lap-szam { font-size: clamp(5rem, min(78cqi, 24svh), 16rem); }
}
/* Alacsony asztali képernyőn is látszódjon egyszerre a szám, a sávok és a gombok. */
@media (min-width: 1024px) and (max-height: 820px) {
  .tomb-fej img { height: 10vh; }
  .lap-szam { font-size: clamp(6rem, min(62cqi, 25vh), 23rem); }
  .tomb-vezerlo { margin-top: .75rem; }
}

/* ================================================================================================
   A múlt hét: hét letépett lap a táblán, mindegyiken egy pillanat, amikor a FoglalGo dolgozott
   ================================================================================================ */
.multhet-fej { max-width: 46rem; }
.multhet-fej p { margin-top: .75rem; max-width: 62ch; color: var(--zsalya); }
.multhet-fej .multhet-lead { margin-top: 1.25rem; font-size: 1.125rem; color: var(--papir); }
.multhet-lapok { display: grid; gap: 2.75rem 2rem; align-items: start; margin-top: clamp(2.5rem, 5vw, 3.5rem); }
@media (min-width: 700px) { .multhet-lapok { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Széles képernyőn nem rács, hanem tábla: eltérő szélességű lapok, elcsúsztatva, ahogy kézzel feltették őket. */
@media (min-width: 1100px) {
  .multhet-lapok { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3rem 1.75rem; }
  .tepett:nth-child(1) { grid-column: 1 / span 4; grid-row: 1; }
  .tepett:nth-child(2) { grid-column: 5 / span 3; grid-row: 1; margin-top: 2.5rem; }
  .tepett:nth-child(3) { grid-column: 8 / span 5; grid-row: 1; margin-top: .75rem; }
  .tepett:nth-child(4) { grid-column: 1 / span 3; grid-row: 2 / span 2; margin-top: 1rem; }
  .tepett:nth-child(5) { grid-column: 4 / span 5; grid-row: 2 / span 2; }
  .tepett:nth-child(6) { grid-column: 9 / span 4; grid-row: 2; margin-top: 1.75rem; }
  .tepett:nth-child(7) { grid-column: 9 / span 4; grid-row: 3; }
}
/* A letépett lap: a teteje a tömbön maradt csonk párja (ugyanaz a vonal, lapról lapra eltolva). */
.tepett {
  transform: rotate(var(--dont, 0deg));
  filter: drop-shadow(0 1px 1px rgb(6 22 17 / .25)) drop-shadow(0 14px 18px rgb(6 22 17 / .35));
}
.tepett-lap {
  position: relative; padding: 1.6rem 1.25rem 1.4rem;
  background: var(--papir-lap);
  -webkit-mask: var(--szel-fent) var(--szel-x, 0) 0 / 160px 12px repeat-x, linear-gradient(#000 0 0) 0 11px / 100% 100% no-repeat;
  mask: var(--szel-fent) var(--szel-x, 0) 0 / 160px 12px repeat-x, linear-gradient(#000 0 0) 0 11px / 100% 100% no-repeat;
}
.tepett-fej {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-bottom: .35rem; border-bottom: 1.5px solid currentColor;
  font-family: var(--betu-cim); font-weight: 800; font-size: .95rem; line-height: 1;
  letter-spacing: .14em; text-transform: uppercase;
}
.tepett-szam {
  margin-top: .45rem; text-align: center;
  font-family: var(--betu-cim); font-weight: 900; font-size: clamp(4.5rem, 3.5rem + 3vw, 6rem); line-height: .82; letter-spacing: -.02em;
}
.tepett-nap {
  display: flex; flex-direction: column; align-items: center; gap: .35rem; margin-top: .35rem;
  font-family: var(--betu-cim); font-weight: 800; font-size: 1.15rem; line-height: 1;
  letter-spacing: .12em; text-transform: uppercase; text-align: center;
}
.tepett-ido { font-family: var(--betu); font-weight: 700; font-size: .875rem; letter-spacing: .02em; text-transform: none; color: var(--tinta-2); }
.tepett-unnep { margin-top: .3rem; text-align: center; font-family: var(--betu-cim); font-weight: 800; font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; }
.tepett.piros .tepett-fej, .tepett.piros .tepett-szam, .tepett.piros .tepett-nap, .tepett.piros .tepett-unnep { color: var(--piros); }
.tepett-lap h3 {
  margin-top: 1rem; padding-top: .9rem; border-top: 1px dashed rgb(26 28 26 / .32);
  font-size: clamp(1.45rem, 1.3rem + .5vw, 1.75rem); line-height: 1.05;
}
.tepett-lap h3 .cimke { margin-left: .35rem; }
.tepett-szoveg { margin-top: .6rem; font-size: .9375rem; line-height: 1.55; color: var(--tinta-2); }
.tepett-szoveg > * + * { margin-top: .6rem; }
.tepett-szoveg p { max-width: 62ch; }
.tepett-szoveg .pipalista { gap: .4rem; color: var(--tinta); }
.tepett-szoveg .apro { font-size: .8125rem; }

/* Rajzok a lapokon: tintakontúr kitöltés nélkül, mintha tollal vázolták volna a képernyőt. */
.rajz { margin-top: 1.1rem; font-size: .875rem; line-height: 1.35; }
.rajz figcaption {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem;
  margin-top: .6rem; font-size: .8125rem; line-height: 1.4; color: var(--tinta-2);
}
/* Foglalás három lépésben */
.rajz-lepesek ol { display: grid; gap: .45rem; list-style: none; padding: 0; counter-reset: rl; }
.rajz-lepesek li {
  counter-increment: rl;
  display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); column-gap: .6rem; align-items: center;
  padding: .45rem .6rem .45rem .45rem; border: 1.5px solid var(--tinta); border-radius: 4px;
}
.rajz-lepesek li::before {
  content: counter(rl); grid-row: 1 / span 2;
  display: grid; place-items: center; width: 1.75rem; height: 1.75rem;
  border: 1.5px solid var(--tinta); border-radius: 50%;
  font-family: var(--betu-cim); font-weight: 800; font-size: 1rem; line-height: 1;
}
.rajz-lepesek b { font-weight: 700; }
.rajz-lepesek span { color: var(--tinta-2); }
/* Az irányítópult: pontozott vezetővonal a címke és az érték között */
.rajz-pult dl { display: grid; padding: .35rem .75rem .45rem; border: 1.5px solid var(--tinta); border-radius: 4px; }
.rajz-pult dl div { display: flex; align-items: baseline; gap: .5rem; padding-block: .35rem; }
.rajz-pult dt { display: flex; flex: 1; align-items: baseline; gap: .5rem; color: var(--tinta-2); }
.rajz-pult dt::after { content: ''; flex: 1 1 1.5rem; border-bottom: 1.5px dotted rgb(26 28 26 / .4); }
.rajz-pult dd { font-family: var(--betu-cim); font-weight: 800; font-size: 1.35rem; line-height: 1; white-space: nowrap; }
/* Telefonos foglalás: a bejegyzés és a foglalóoldal sávjai */
.rajz-bejegyzes { display: grid; gap: .1rem; padding: .55rem .75rem; border: 1.5px solid var(--tinta); border-radius: 4px; }
.rajz-bejegyzes span:last-child { font-size: .8125rem; color: var(--tinta-2); }
.rajz-savok { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }
.rajz-savok li { padding: .3rem .65rem; border: 1.5px solid var(--tinta); border-radius: 4px; font-weight: 700; }
.rajz-savok .elkelt { border-style: dashed; border-color: rgb(26 28 26 / .45); color: var(--tinta-2); }
.rajz-savok s { text-decoration-color: var(--piros); text-decoration-thickness: 2px; }
/* Visszaigazoló levél */
.rajz-targy { padding-bottom: .45rem; border-bottom: 1.5px solid var(--tinta); font-weight: 700; }
.rajz-targy span { font-weight: 500; color: var(--tinta-2); }
.rajz-level dl { display: grid; gap: .3rem; margin-top: .55rem; }
.rajz-level dl div { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: .5rem; }
.rajz-level dt { color: var(--tinta-2); }
.rajz-level dd { font-weight: 600; }
.rajz-lemond {
  display: inline-block; margin-top: .75rem; padding: .3rem .7rem;
  border: 1.5px solid var(--piros); border-radius: 4px;
  color: var(--piros); font-weight: 700; font-size: .8125rem;
}
/* Napi nézet: negyedórás sorok, munkatársanként egy oszlop */
.naptarracs {
  display: grid; grid-template-columns: 2.6rem repeat(3, minmax(0, 1fr)); grid-template-rows: 1.5rem repeat(16, 1.25rem);
  padding: .2rem .35rem .35rem 0; border: 1.5px solid var(--tinta); border-radius: 4px;
  font-size: .75rem; line-height: 1.05;
}
.nr-fej { grid-row: 1; align-self: center; padding-left: .35rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nr-oszlop { grid-row: 2 / -1; border-left: 1px solid var(--hatar); }
.nr-ido { grid-column: 1 / -1; padding: .15rem 0 0 .4rem; border-top: 1px dashed var(--hatar); color: var(--tinta-2); }
.nr-zarva { grid-column: 2 / -1; background: rgb(26 28 26 / .07); }
.nr-blokk {
  position: relative; margin: 1px 2px; padding: .3rem .5rem; overflow: hidden;
  background: var(--papir-feher); border: 1.5px solid var(--tinta); border-radius: 3px; font-weight: 600;
}
.nr-zarolt { border-style: dashed; color: var(--tinta-2); background: var(--papir-hat); }

/* A hét alatt: ami minden lapra igaz */
.multhet-lab { margin-top: clamp(3rem, 6vw, 4.5rem); padding-top: 2rem; border-top: 1px solid var(--hatar); }
.tenyek { display: grid; gap: 1.5rem 2.5rem; }
.tenyek li { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); column-gap: .85rem; row-gap: .2rem; }
.tenyek .ikon { grid-row: 1 / span 2; width: 1.6rem; height: 1.6rem; margin-top: .1rem; color: var(--papir); }
.tenyek b { font-weight: 700; font-size: 1.0625rem; line-height: 1.35; color: var(--papir); }
.tenyek span { font-size: .9375rem; color: var(--zsalya); }
@media (min-width: 900px) { .tenyek { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.multhet-lab .apro { margin-top: 1.75rem; }
.multhet-lab .gombsor { margin-top: 1.25rem; column-gap: 1.75rem; }

/* ================================================================================================
   Kinek a falára való: a szakmák egy letépett papírcsíkon
   ================================================================================================ */
.falra-fej { max-width: 46rem; }
.falra-fej p { margin-top: 1rem; max-width: 62ch; color: var(--zsalya); }
.falra-lap {
  margin-top: clamp(2rem, 4vw, 3rem);
  transform: rotate(-.6deg);
  filter: drop-shadow(0 1px 1px rgb(6 22 17 / .25)) drop-shadow(0 14px 18px rgb(6 22 17 / .35));
}
.falra-csik {
  display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: center; column-gap: .5rem;
  padding: 1.15rem clamp(.75rem, 3vw, 2rem);
  background: var(--papir-lap);
  -webkit-mask: var(--szel-fent) -53px 0 / 160px 12px repeat-x, linear-gradient(#000 0 0) 0 11px / 100% calc(100% - 22px) no-repeat, var(--szel-lent) -101px 100% / 160px 12px repeat-x;
  mask: var(--szel-fent) -53px 0 / 160px 12px repeat-x, linear-gradient(#000 0 0) 0 11px / 100% calc(100% - 22px) no-repeat, var(--szel-lent) -101px 100% / 160px 12px repeat-x;
}
.falra-csik li { display: flex; align-items: center; }
.falra-csik li::before { content: ''; flex: none; width: .45rem; height: .45rem; border-radius: 50%; background: var(--piros); }
.falra-csik a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 .75rem 0 .55rem;
  font-family: var(--betu-cim); font-weight: 800; font-size: clamp(1.1rem, .85rem + 1.2vw, 1.9rem); line-height: 1;
  letter-spacing: .06em; text-transform: uppercase; text-decoration: none;
}
.falra-csik a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .15em; }
.falra-tovabb { margin-top: 1.5rem; }

/* ================================================================================================
   Az aloldalak tárgyai: kinyomtatott képernyőkép, telefon, levél, napi beosztás
   ================================================================================================ */
.kepernyo { background: #FFFFFF; padding: .5rem .5rem .1rem; border-radius: 2px; }
.kepernyo img { width: 100%; border-radius: 1px; outline: 1px solid rgb(26 28 26 / .08); }
.kepernyo figcaption { padding: .4rem .15rem .35rem; font-size: .8125rem; color: var(--tinta-2); }
.telefon { width: min(100%, 14.5rem); margin-inline: auto; padding: .45rem; background: var(--tinta); border-radius: 2rem; }
.telefon img { border-radius: 1.6rem; }
.levelminta { width: min(100%, 23rem); margin-inline: auto; }
.levelminta-lap { background: #FFFFFF; padding: 1.1rem 1.15rem 1.2rem; font-size: .875rem; line-height: 1.5; }
.levelminta-fej { display: grid; gap: .1rem; padding-bottom: .65rem; margin-bottom: .7rem; border-bottom: 1px solid var(--hatar); color: var(--tinta-2); font-size: .8125rem; }
.levelminta-fej b { color: var(--tinta); font-size: 1rem; margin-top: .3rem; }
.levelminta-adat { display: grid; gap: .3rem; margin-top: .75rem; }
.levelminta-adat div { display: grid; grid-template-columns: 6.5rem 1fr; gap: .5rem; }
.levelminta-adat dt { color: var(--tinta-2); }
.levelminta-adat dd { font-weight: 600; }
.levelminta-gomb { display: inline-block; margin-top: .9rem; padding: .35rem .7rem; border: 1.5px solid var(--piros); color: var(--piros); border-radius: 4px; font-weight: 700; font-size: .8125rem; }
.levelminta figcaption { margin-top: .5rem; font-size: .8125rem; color: var(--zsalya); text-align: center; }
.iv .levelminta figcaption { color: var(--tinta-2); }

/* Napi beosztás egy szakma példáján (a szakmaoldalak fejében) */
.napterv { background: var(--papir-feher); padding: 1.1rem 1.15rem 1rem; border-radius: 2px; }
.napterv-fej { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding-bottom: .65rem; border-bottom: 2px solid var(--tinta); }
.napterv-cim { font-family: var(--betu-cim); font-weight: 800; font-size: 1.4rem; line-height: 1.05; }
.napterv-sorok { display: grid; gap: 3px; margin-top: .65rem; }
.nb {
  display: grid; grid-template-columns: 3.1rem minmax(0, 1fr); grid-template-rows: auto 1fr;
  column-gap: .6rem;
  min-height: max(2.9rem, calc(var(--perc) * .062rem));
  font-size: .875rem; line-height: 1.3;
}
.nb-ido { grid-row: 1 / span 2; padding-top: .3rem; font-weight: 700; color: var(--tinta-2); font-size: .8125rem; }
.nb-nev, .nb-meta { grid-column: 2; padding-inline: .6rem; }
.nb-nev { padding-top: .42rem; padding-bottom: .25rem; font-weight: 700; }
.nb-meta { padding-bottom: .42rem; color: var(--tinta-2); font-size: .8125rem; }
.nb-foglalas .nb-nev, .nb-foglalas .nb-meta { background: #E2EBE5; }
.nb-foglalas .nb-nev { border-radius: 3px 3px 0 0; }
.nb-foglalas .nb-meta { border-radius: 0 0 3px 3px; }
.nb-szabad .nb-nev, .nb-szabad .nb-meta { outline: 0; }
.nb-szabad .nb-nev { border: 1.5px dashed var(--vonal); border-bottom: 0; border-radius: 3px 3px 0 0; font-weight: 600; color: var(--tinta-2); }
.nb-szabad .nb-meta { border: 1.5px dashed var(--vonal); border-top: 0; border-radius: 0 0 3px 3px; }
.nb-zarolt .nb-nev, .nb-zarolt .nb-meta { background: var(--papir-hat); color: var(--tinta-2); }
.nb-zarolt .nb-nev { border-radius: 3px 3px 0 0; font-weight: 600; }
.nb-zarolt .nb-meta { border-radius: 0 0 3px 3px; }
.napterv-lab { margin-top: .8rem; font-size: .8125rem; color: var(--tinta-2); line-height: 1.45; }

/* ================================================================================================
   Díjszabás: három árcédula zsinegen, a táblára akasztva
   ================================================================================================ */
.dijak-aloldal { padding-top: clamp(1rem, 2vw, 2rem); }
.dijak-fej { display: grid; gap: 1.25rem 2rem; align-items: end; }
.dijak-fej p { margin-top: 1rem; max-width: 44rem; color: var(--zsalya); }
.dijak-fej p a, .dijak-lab a { color: var(--papir); }
@media (min-width: 900px) { .dijak-fej { grid-template-columns: minmax(0, 1fr) auto; } }
/* Fizetési mód: papírcsík két füllel a táblán */
.fizetes {
  display: inline-flex; justify-self: start; gap: 3px; min-width: 0; padding: 3px;
  border: 0; border-radius: var(--r); background: var(--papir-lap); box-shadow: var(--arnyek-kicsi);
}
.fizetes label { position: relative; display: block; cursor: pointer; }
.fizetes input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.fizetes span { display: flex; align-items: center; min-height: 44px; padding: 0 .95rem; border-radius: 3px; font-weight: 700; font-size: .9375rem; white-space: nowrap; transition: background-color var(--gyors), color var(--gyors); }
.fizetes input:checked + span { background: var(--tinta); color: var(--papir-lap); }
.fizetes input:focus-visible + span { outline: 3px solid var(--fokusz); outline-offset: 2px; }
.fizetes label:hover input:not(:checked) + span { background: rgb(26 28 26 / .07); }
/* Minden cédula a saját zsinórján lóg, a zsinór a cédula lyukáig ér. A cédula és a zsinórja ugyanannyit dől,
   ugyanabból a pontból: ahol a zsinór a táblán futó zsinegről indul. */
.dijszabas { position: relative; display: grid; gap: 2.25rem; margin-top: clamp(2.5rem, 5vw, 4rem); }
.cedula {
  position: relative; display: flex; flex-direction: column; padding-top: var(--zsinor, 2.5rem);
  filter: drop-shadow(0 2px 2px rgb(0 0 0 / .25)) drop-shadow(0 14px 18px rgb(0 0 0 / .3));
}
.cedula::before {
  content: ''; position: absolute; z-index: 1; left: 50%; top: 0; width: 2px; margin-left: -1px;
  height: calc(var(--zsinor, 2.5rem) + 1.4rem); background: var(--zsineg);
  rotate: calc(var(--dont, 0deg) * var(--billen, 1)); transform-origin: 50% 0;
}
.cedula::after { content: ''; position: absolute; left: -1rem; right: -1rem; top: 0; height: 2px; background: var(--zsineg); }
.cedula-lap {
  position: relative; display: flex; flex-direction: column; flex: 1;
  padding: 2.8rem 1.4rem 1.5rem;
  background: var(--papir-lap);
  rotate: calc(var(--dont, 0deg) * var(--billen, 1)); transform-origin: 50% calc(var(--zsinor, 2.5rem) * -1);
  clip-path: polygon(1.6rem 0, calc(100% - 1.6rem) 0, 100% 1.6rem, 100% 100%, 0 100%, 0 1.6rem);
  -webkit-mask: radial-gradient(circle at 50% 1.4rem, transparent .45rem, #000 calc(.45rem + .5px));
  mask: radial-gradient(circle at 50% 1.4rem, transparent .45rem, #000 calc(.45rem + .5px));
}
.cedula-lyuk {
  position: absolute; left: 50%; top: 1.4rem; width: 1.5rem; height: 1.5rem; translate: -50% -50%;
  border: .3rem solid #D9D3C3; border-radius: 50%;
}
/* Egy hasábban a teljes dőléssel a cédula alsó sarka a képernyő széléig érne. */
@media (max-width: 899.98px) { .cedula { --billen: .45; } }
.dij-nev { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; font-family: var(--betu-cim); font-weight: 800; font-size: 2.1rem; line-height: 1; }
.dij-kinek { margin-top: .5rem; color: var(--tinta-2); font-size: .9375rem; }
.dij-ar { display: flex; align-items: baseline; gap: .35rem; margin-top: 1rem; }
.dij-szam { font-family: var(--betu-cim); font-weight: 900; font-size: 4.25rem; line-height: .85; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.dij-egyseg { font-weight: 600; color: var(--tinta-2); font-size: .9375rem; }
.dij-mellek { margin-top: .5rem; font-size: .875rem; color: var(--tinta-2); min-height: 1.6em; }
.dij-pontok { display: grid; gap: .5rem; margin: 1.25rem 0 1.5rem; font-size: .9375rem; }
.dij-pontok li { display: flex; gap: .55rem; align-items: flex-start; }
.dij-pontok .ikon { width: 1.1rem; height: 1.1rem; margin-top: .18rem; color: var(--zold-tinta); }
.dij .gomb { margin-top: auto; }
.dij-kiemelt .dij-szam { color: var(--piros); }
@media (min-width: 900px) {
  .dijszabas { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1.5rem, 3vw, 2.5rem); align-items: start; }
  /* Asztali nézetben egyetlen zsineg fut végig, a cédulák erről lógnak. */
  .dijszabas::before { content: ''; position: absolute; inset: 0 -1rem auto; height: 2px; background: var(--zsineg); box-shadow: 0 2px 3px rgb(6 22 17 / .35); }
  .cedula::after { display: none; }
}
/* Egyetlen cédula (az ingyenes csomag oldalán): a zsinór hurokként fut át a lyukon. */
.dijszabas-egy::before, .dijszabas-egy .cedula::after { display: none; }
.dijszabas-egy .cedula::before {
  top: -1.6rem; width: 1.6rem; height: 3rem; margin-left: -.8rem;
  background: none; border: 2px solid var(--zsineg); border-radius: 50% / 60% 60% 40% 40%; rotate: none;
}
.dijak-lab { margin-top: 2.5rem; max-width: 60ch; font-size: .875rem; color: var(--zsalya); }
.dijak .tovabb { margin-top: 1rem; }

/* Összehasonlító sorok (az összehasonlító oldalakon) */
.vs-lista { display: grid; border-top: 1px solid var(--hatar); }
.vs-sor { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem 1.5rem; padding: 1.35rem 0; border-bottom: 1px solid var(--hatar); }
.vs-sor h3 { font-size: clamp(1.6rem, 1.35rem + .8vw, 2.1rem); grid-column: 1; }
.vs-sor h3 a { text-decoration: none; }
.vs-sor h3 a::after { content: ''; position: absolute; inset: 0; }
.vs-sor p { grid-column: 1; color: var(--fg-2); font-size: .9375rem; max-width: 60ch; }
.vs-nyil { grid-column: 2; grid-row: 1 / span 2; align-self: center; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border: 1.5px solid var(--hatar); border-radius: 50%; transition: transform var(--gyors) var(--kimenet), background-color var(--gyors), border-color var(--gyors); }
.vs-sor:hover .vs-nyil { transform: translateX(4px); border-color: var(--fg); }
.vs-sor:hover h3 a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .15em; }
.vs-sor:focus-within .vs-nyil { border-color: var(--fg); }

/* ================================================================================================
   Dátumlap: egy letépett naptárlap (ellenőrzés napja, cikk frissítése, holnap)
   ================================================================================================ */
.datumlap {
  position: relative;
  background: var(--papir-lap);
  padding: .95rem 1rem 1rem;
  text-align: center;
  container-type: inline-size;
}
.datumlap::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 12px; background: var(--papir-lap); -webkit-mask: var(--szel-fent) 0 0 / 160px 12px repeat-x; mask: var(--szel-fent) 0 0 / 160px 12px repeat-x; transform: translateY(-99%); }
.datumlap-fej { display: flex; justify-content: space-between; padding-bottom: .3rem; border-bottom: 1.5px solid currentColor; font-family: var(--betu-cim); font-weight: 800; font-size: .95rem; letter-spacing: .14em; text-transform: uppercase; line-height: 1; }
.datumlap-szam { font-family: var(--betu-cim); font-weight: 900; font-size: clamp(4.5rem, 52cqi, 7.5rem); line-height: .82; margin-top: .45rem; letter-spacing: -.02em; }
.datumlap-nap { display: flex; flex-direction: column; gap: .2rem; margin-top: .25rem; font-family: var(--betu-cim); font-weight: 800; font-size: 1.15rem; letter-spacing: .12em; text-transform: uppercase; line-height: 1; }
.datumlap-unnep { font-size: .78rem; letter-spacing: .08em; }
.datumlap.piros .datumlap-fej, .datumlap.piros .datumlap-szam, .datumlap.piros .datumlap-nap { color: var(--piros); }
.datumlap-felirat { margin-top: .7rem; padding-top: .55rem; border-top: 1px dashed rgb(26 28 26 / .3); font-size: .875rem; font-style: italic; line-height: 1.35; color: var(--tinta-2); }

/* ================================================================================================
   A lap hátoldala: tippek, alatta a kérdések nyomtatott hasábokban, átütő tükörszámmal
   ================================================================================================ */
.hatlap {
  position: relative; overflow: hidden;
  background: var(--papir-hat);
  padding: clamp(2rem, 5vw, 4rem) clamp(1.25rem, 4.5vw, 4rem);
  box-shadow: var(--arnyek-lap);
  border-radius: 2px;
}
.atutes {
  position: absolute; z-index: 0; right: -1.5rem; top: -2rem;
  font-family: var(--betu-cim); font-weight: 900; font-size: clamp(14rem, 34vw, 26rem); line-height: .8;
  color: var(--tinta); opacity: .055; transform: scaleX(-1);
  pointer-events: none; user-select: none;
}
.hatlap > :not(.atutes) { position: relative; z-index: 1; }
.hatlap-fej { max-width: 44rem; }
.hatlap-fej p { margin-top: .9rem; color: var(--tinta-2); }
.hatlap-fej p + p { margin-top: .4rem; }
.tippek { display: grid; gap: 1.75rem 2rem; margin-top: 2.25rem; padding-bottom: 2rem; border-bottom: 2px solid var(--tinta); }
.tipp h3 { font-family: var(--betu); font-weight: 700; font-size: 1.125rem; line-height: 1.35; }
.tipp h3 a { text-decoration: none; }
.tipp h3 a:hover { text-decoration: underline; }
.tipp-szo { font-family: var(--betu-cim); font-weight: 900; font-size: 1.35rem; color: var(--piros); letter-spacing: .02em; }
.tipp > p { margin-top: .5rem; font-size: .9375rem; color: var(--tinta-2); }
.tipp > .tipp-meta { font-size: .8125rem; }
/* Az utolsó hasáb az összehasonlító oldalaké: „Másik naptárból jössz?” */
.vs-mini { margin-top: .35rem; }
.vs-mini a { display: flex; align-items: center; min-height: 44px; font-weight: 600; font-size: .9375rem; }
@media (min-width: 700px) { .tippek { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) {
  .tippek { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
  .tipp { padding-inline: 1.5rem; border-left: 1px solid var(--hatar); }
  .tipp:first-child { padding-left: 0; border-left: 0; }
  .tipp:last-child { padding-right: 0; }
}
/* A kérdések nyomtatott hasábokban, mint egy naptárlap hátoldalán: nincs lenyitás, minden válasz látszik. */
.nyomtatott-cim { margin-top: 2.25rem; font-size: clamp(1.6rem, 1.4rem + .8vw, 2.1rem); }
.nyomtatott { margin-top: 1.25rem; columns: 3 16rem; column-gap: 2.5rem; column-rule: 1px solid var(--hatar); }
.hatlap-fej + .nyomtatott { margin-top: 2rem; }
.kv { break-inside: avoid; padding-bottom: 1.25rem; }
.kv h3, .kv h4 { font-family: var(--betu); font-weight: 700; font-size: 1.0625rem; line-height: 1.35; letter-spacing: 0; }
.kv p { margin-top: .4rem; font-size: .9375rem; color: var(--tinta-2); }
.kv a { color: var(--tinta); font-weight: 600; }
.gyik details { border-bottom: 1px solid var(--hatar); }
.gyik summary {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem;
  min-height: 44px; padding: 1.05rem 0;
  font-weight: 700; font-size: 1.0625rem; line-height: 1.4;
  cursor: pointer; list-style: none;
}
.gyik summary::-webkit-details-marker { display: none; }
.gyik summary:hover span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.gyik-jel { position: relative; flex: none; width: 1.6rem; height: 1.6rem; margin-top: -.05rem; border: 1.5px solid currentColor; border-radius: 50%; }
.gyik-jel::before, .gyik-jel::after { content: ''; position: absolute; left: 50%; top: 50%; width: .65rem; height: 2px; margin: -1px 0 0 -.325rem; background: currentColor; transition: transform var(--kozepes) var(--kimenet); }
.gyik-jel::after { transform: rotate(90deg); }
.gyik details[open] .gyik-jel::after { transform: rotate(0deg); }
.gyik details[open] .gyik-jel { background: var(--tinta); color: var(--papir-hat); border-color: var(--tinta); }
.gyik-valasz { padding: 0 0 1.25rem; max-width: 64ch; color: var(--tinta-2); }
.gyik-valasz p + p, .gyik-valasz ul, .gyik-valasz ol { margin-top: .6rem; }
.gyik-valasz ul, .gyik-valasz ol { padding-left: 1.2rem; }
.gyik-valasz a { color: var(--tinta); font-weight: 600; }

/* ================================================================================================
   Záró: a holnapi lap
   ================================================================================================ */
.zaro { padding-bottom: calc(var(--szakasz) + 1rem); }
.zaro-racs { display: grid; gap: 3rem; align-items: center; }
.zaro-szoveg h2 { font-size: clamp(2.6rem, 1.8rem + 3.2vw, 4.5rem); max-width: 14ch; }
.zaro-szoveg p { margin-top: 1.1rem; max-width: 36rem; font-size: 1.125rem; }
.zaro-szoveg .gombsor { margin-top: 2rem; }
.zaro-lap { width: 15rem; justify-self: center; }
@media (min-width: 900px) {
  .zaro-racs { grid-template-columns: minmax(0, 1fr) 17rem; column-gap: 5rem; }
  .zaro-lap { width: 16.5rem; }
}

/* ================================================================================================
   Aloldalak: lapfej a táblán, alatta a táblára tett ív
   ================================================================================================ */
.utvonal ol { display: flex; flex-wrap: wrap; gap: .25rem .5rem; font-size: .875rem; color: var(--zsalya); }
.utvonal li { display: flex; align-items: center; gap: .5rem; }
.utvonal li:not(:last-child)::after { content: '/'; opacity: .7; }
.utvonal a { display: inline-flex; align-items: center; min-height: 44px; color: var(--zsalya); }
.utvonal a:hover { color: var(--papir); }
.utvonal [aria-current] { color: var(--papir); }
.lapfej { padding-block: clamp(.75rem, 2vw, 1.5rem) clamp(3rem, 6vw, 5rem); }
.lapfej-racs { display: grid; gap: 2.75rem; align-items: center; margin-top: clamp(1rem, 3vw, 2rem); }
.lapfej h1 { max-width: 17ch; }
/* Hosszú (55 karakternél hosszabb) lapcím: kisebb méret, szélesebb sor, hogy ne nyelje el a képernyőt. A cikkfejnek saját mérete van. */
.lapfej:not(.cikk-fej) h1.hosszu { font-size: clamp(2.3rem, 1.6rem + 2.3vw, 3.6rem); max-width: 21ch; }
.lapfej .lead { margin-top: 1.25rem; max-width: 40rem; font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); line-height: 1.55; }
.lapfej .gombsor { margin-top: 1.9rem; }
.lapfej-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 1.6rem; font-size: .9375rem; color: var(--zsalya); }
.lapfej-meta li { display: flex; align-items: center; gap: .45rem; }
.lapfej-meta .ikon { width: 1.05rem; height: 1.05rem; color: var(--papir); }
.lapfej-meta a { color: var(--papir); }
.lapfej-kep { display: grid; justify-items: center; }
.lapfej-kep .tuzott { width: min(100%, 28rem); }
.lapfej-kep .tuzott-datum { width: 14rem; }
.lapfej-kep .tuzott-napterv { width: min(100%, 27rem); }
@media (min-width: 1024px) {
  .lapfej.van-kep .lapfej-racs { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: 4rem; }
  .lapfej-kep .tuzott-datum { width: 15.5rem; }
}

.iv-keret { padding-bottom: var(--szakasz); }
.iv-keret.van-ful { padding-top: 2.6rem; }
.iv {
  position: relative;
  background: var(--papir);
  padding: clamp(1.75rem, 5vw, 4.5rem) clamp(1.25rem, 5vw, 4.5rem);
  box-shadow: var(--arnyek-lap);
  border-radius: 2px;
}
/* Regiszterfülek az ív tetején */
.fulek { position: relative; z-index: 1; margin-bottom: -1px; }
.fulek ul { display: flex; flex-wrap: wrap; gap: .3rem; padding-inline: clamp(.5rem, 3vw, 2.5rem); }
.fulek a {
  display: inline-flex; align-items: center; min-height: 44px; padding: .4rem 1rem;
  background: var(--papir-ful); color: var(--tinta);
  border-radius: 6px 6px 0 0;
  font-weight: 700; font-size: .9375rem; text-decoration: none;
  box-shadow: inset 0 -6px 8px -6px rgb(26 28 26 / .25);
}
.fulek a:hover { background: var(--papir-feher); }
.fulek a.aktiv { background: var(--papir); box-shadow: none; }
.fulek a:focus-visible { outline-color: var(--sarga); }

.resz { display: grid; gap: 1.25rem 3rem; padding-block: clamp(2rem, 4vw, 3rem); border-top: 2px solid var(--tinta); }
.resz:first-child { border-top: 0; padding-top: 0; }
.resz-fej h2 { font-size: clamp(1.9rem, 1.5rem + 1.6vw, 2.9rem); }
.resz-fej > p { margin-top: .85rem; color: var(--tinta-2); max-width: 44rem; }
.resz-kep { margin-top: 2rem; width: min(100%, 22rem); }
.resz-tartalom { min-width: 0; }
.resz-tartalom > * + * { margin-top: 1.25rem; }
.resz-oszinte .resz-fej h2 { text-decoration: underline; text-decoration-color: var(--piros); text-decoration-thickness: 3px; text-underline-offset: .18em; }
@media (min-width: 1024px) {
  .resz:not(.resz-szeles) { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); }
  .resz:not(.resz-szeles) .resz-fej { position: sticky; top: 6rem; align-self: start; }
}

/* Jegyzék: funkciók listája papíron */
.jegyzek { display: grid; }
.jegyzek > div { display: grid; gap: .35rem 2rem; padding: 1.15rem 0; border-bottom: 1px dashed rgb(26 28 26 / .28); }
.jegyzek > div:first-child { padding-top: 0; }
.jegyzek dt { font-weight: 700; font-size: 1.0625rem; line-height: 1.35; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.jegyzek dd p { color: var(--tinta-2); max-width: 62ch; }
.jegyzek dd .cimke { margin-top: .5rem; }
.jegyzek-megj { margin-top: .35rem; font-size: .875rem; font-style: italic; }
.jegyzek-ikonos dt .ikon { width: 1.4rem; height: 1.4rem; color: var(--zold-tinta); }
@media (min-width: 1200px) { .jegyzek > div { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); } }

/* Táblázatok */
.tabla, .table-wrap {
  position: relative; overflow-x: auto; border-top: 2px solid var(--tinta);
  /* Görgetési árnyék: ha a táblázat kilóg, a takart oldalon halvány árnyék jelzi, hogy oldalra húzható. */
  background:
    linear-gradient(to right, var(--papir) 40%, rgb(239 237 230 / 0)) left / 2.5rem 100% no-repeat local,
    linear-gradient(to left, var(--papir) 40%, rgb(239 237 230 / 0)) right / 2.5rem 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgb(26 28 26 / .2), rgb(26 28 26 / 0)) left / .85rem 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgb(26 28 26 / .2), rgb(26 28 26 / 0)) right / .85rem 100% no-repeat scroll;
}
.tabla:focus-visible, .table-wrap:focus-visible { outline-offset: 4px; }
table { width: 100%; border-collapse: collapse; font-size: .9375rem; line-height: 1.45; min-width: 34rem; }
th, td { padding: .75rem .9rem .75rem 0; text-align: left; vertical-align: top; border-bottom: 1px solid var(--hatar); }
thead th { font-family: var(--betu-cim); font-weight: 800; font-size: 1.15rem; letter-spacing: .02em; padding-top: .9rem; border-bottom: 1.5px solid var(--tinta); }
tbody th { font-weight: 700; }
td { color: var(--tinta-2); }
.kiemelt-oszlop { background: rgb(30 90 73 / .07); padding-left: .9rem; color: var(--tinta); }
thead .kiemelt-oszlop { box-shadow: inset 0 3px 0 var(--zold-tinta); }
tr.us th, tr.us td { background: rgb(30 90 73 / .07); color: var(--tinta); font-weight: 700; }
tr.us th { padding-left: .6rem; }
.ikon-igen { color: var(--zold-tinta); width: 1.2rem; height: 1.2rem; }
.ikon-nem { color: var(--tinta-2); font-weight: 700; }
.tabla-megj, .forras { margin-top: .9rem; font-size: .875rem; color: var(--tinta-2); max-width: 56ch; }
.forraslista { margin-top: 1rem; display: grid; gap: .4rem; font-size: .875rem; color: var(--tinta-2); }
.forraslista a, .forras a, .tabla-megj a { color: var(--tinta); }

.ketoszlop { display: grid; gap: 2rem 3.5rem; }
.ketoszlop h2 { font-size: clamp(1.75rem, 1.45rem + 1.1vw, 2.4rem); }
.ketoszlop p { margin-top: .75rem; color: var(--tinta-2); }
.ketoszlop h2 .cimke { margin-left: .35rem; }
@media (min-width: 900px) { .ketoszlop { grid-template-columns: 1fr 1fr; } }
.mikor > div { padding-top: 1rem; border-top: 4px solid var(--tinta); }
.mikor > div:last-child { border-top-color: var(--zold-tinta); }

.tipusok { display: grid; border-top: 2px solid var(--tinta); }
.tipusok li { display: grid; gap: .25rem 1.5rem; padding: 1rem 0; border-bottom: 1px solid var(--hatar); }
.tipusok h3 { font-family: var(--betu); font-size: 1.0625rem; font-weight: 700; }
.tipusok p { color: var(--tinta-2); font-size: .9375rem; }
.tipusok-ido { font-weight: 700; color: var(--tinta) !important; }
.tipusok li.mi { background: rgb(30 90 73 / .08); padding-inline: .9rem; }
@media (min-width: 900px) { .tipusok li { grid-template-columns: 13rem 11rem minmax(0, 1fr); } }

.cetli { padding: 1.25rem 1.4rem 1.4rem; background: var(--cetli); }
.cetli h2, .cetli h3 { font-size: 1.5rem; }
/* Az ív alsó szélére, a táblára tűzött cetli: nem az íven belüli doboz. */
.iv-utana { position: relative; z-index: 2; display: flex; justify-content: flex-end; margin-top: calc(-1 * clamp(1.1rem, 3.5vw, 3rem)); padding-inline: clamp(.75rem, 4vw, 3.5rem); }
.tuzott-cetli { width: min(100%, 27rem); }
.cetli p { margin-top: .5rem; color: var(--tinta-2); }

/* Szakmalista */
.szakmalista { display: grid; border-top: 2px solid var(--tinta); }
.szakmasor { position: relative; display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: .5rem 1.1rem; padding: 1.15rem 0; border-bottom: 1px solid var(--hatar); }
.szakmasor-ikon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border: 1.5px solid var(--tinta); border-radius: 50%; }
.szakmasor-ikon .ikon { width: 1.35rem; height: 1.35rem; }
.szakmasor h3 { font-size: 1.6rem; }
.szakmasor h3 a { text-decoration: none; }
.szakmasor h3 a::after { content: ''; position: absolute; inset: 0; }
.szakmasor:hover h3 a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; }
.szakmasor-fo p { margin-top: .3rem; color: var(--tinta-2); font-size: .9375rem; }
.szakmasor-pelda { grid-column: 2; display: grid; gap: .2rem; font-size: .875rem; }
.szakmasor-pelda li { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dotted rgb(26 28 26 / .3); padding-bottom: .15rem; }
.szakmasor-pelda b { font-weight: 600; color: var(--tinta-2); white-space: nowrap; }
@media (min-width: 900px) {
  .szakmasor { grid-template-columns: 2.75rem minmax(0, 1fr) minmax(0, 19rem); column-gap: 1.5rem; align-items: start; }
  .szakmasor-pelda { grid-column: 3; }
}

/* Útmutató és tartalomjegyzék */
.utmutato { display: grid; gap: 2rem 3.5rem; }
.tartalomjegyzek ol { display: grid; gap: .1rem; counter-reset: tj; border-left: 1px solid var(--hatar); }
.tartalomjegyzek li { counter-increment: tj; }
.tartalomjegyzek a {
  display: grid; grid-template-columns: 1.6rem 1fr; gap: .35rem; align-items: baseline;
  min-height: 44px; padding: .55rem 0 .55rem .9rem; margin-left: -1px;
  border-left: 1px solid transparent;
  font-size: .9375rem; line-height: 1.35; text-decoration: none; color: var(--tinta-2);
}
.tartalomjegyzek a::before { content: counter(tj) '.'; font-family: var(--betu-cim); font-weight: 800; font-size: 1.05rem; color: var(--tinta-2); }
.tartalomjegyzek a:hover { color: var(--tinta); }
.tartalomjegyzek a.aktiv { border-left-color: var(--piros); color: var(--tinta); font-weight: 700; }
.tartalomjegyzek a.aktiv::before { color: var(--piros); }
@media (min-width: 1024px) {
  .utmutato { grid-template-columns: 16rem minmax(0, 1fr); }
  .utmutato .tartalomjegyzek { position: sticky; top: 6rem; align-self: start; }
}

.proza { max-width: 56ch; }
.proza > * + * { margin-top: 1rem; }
.proza h2 { font-size: clamp(1.8rem, 1.5rem + 1.2vw, 2.5rem); margin-top: 2.6rem; }
.proza h3 { font-family: var(--betu); font-weight: 700; font-size: 1.25rem; line-height: 1.3; margin-top: 2rem; }
.proza h2 + *, .proza h3 + * { margin-top: .75rem; }
.proza > :first-child { margin-top: 0; }
.proza ul, .proza ol { padding-left: 1.3rem; }
.proza li + li { margin-top: .4rem; }
.proza li::marker { color: var(--piros); }
.proza a { font-weight: 600; }
.proza blockquote { padding-left: 1rem; border-left: 1px solid var(--tinta); font-style: italic; }
.proza .table-wrap, .proza .tabla { margin-block: 1.5rem; }
.proza strong, .proza b { font-weight: 700; }

/* Naplósor: cikk a dátumával */
.naplo { display: grid; border-top: 2px solid var(--tinta); }
.naplosor { position: relative; display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 1.25rem; padding: 1.25rem 0; border-bottom: 1px solid var(--hatar); }
/* A dátum naptárlap-fejlécként, doboz nélkül: vastag felső vonal, alatta a nap, a hónap és a hét napja. */
.naplo-datum {
  display: grid; justify-items: center; align-content: start; align-self: start;
  padding-top: .5rem; border-top: 3px solid currentColor; color: var(--fg);
  text-align: center; line-height: 1;
}
.naplo-datum b { font-family: var(--betu-cim); font-weight: 900; font-size: 2.3rem; line-height: .85; }
.naplo-datum span { margin-top: .3rem; font-family: var(--betu-cim); font-weight: 800; font-size: .85rem; letter-spacing: .1em; text-transform: uppercase; }
.naplo-datum small { margin-top: .25rem; font-size: .75rem; color: var(--fg-2); }
.naplo-datum.piros { border-top-color: var(--piros); }
.naplo-datum.piros b, .naplo-datum.piros span { color: var(--piros); }
.naplo-tablan .naplo-datum.piros { border-top-color: #F3A491; }
.naplo-tablan .naplo-datum.piros b, .naplo-tablan .naplo-datum.piros span { color: #F3A491; }
.naplo-fo h3 { font-family: var(--betu); font-weight: 700; font-size: 1.1875rem; line-height: 1.3; }
.naplo-fo h3 a { text-decoration: none; }
.naplo-fo h3 a::after { content: ''; position: absolute; inset: 0; }
.naplosor:hover h3 a { text-decoration: underline; }
.naplo-fo p { margin-top: .35rem; color: var(--fg-2); font-size: .9375rem; }
.naplo-fo .naplo-meta { font-size: .8125rem; }
.naplo-tablan { border-top-color: var(--papir); }
.naplo-tablan .naplosor { border-bottom-color: var(--hatar); }
@media (min-width: 900px) { .naplosor { grid-template-columns: 5rem minmax(0, 1fr); gap: 1.75rem; } }

/* Csipeszsor: linkek kis papírcímkéken */
.chipsor { display: flex; flex-wrap: wrap; gap: .5rem; }
.chipsor a {
  display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: .45rem .9rem;
  border: 1.5px solid var(--hatar); border-radius: var(--r);
  font-weight: 600; font-size: .9375rem; text-decoration: none;
  transition: border-color var(--gyors), background-color var(--gyors);
}
.chipsor a:hover { border-color: var(--fg); }
.chipsor .ikon { width: 1.1rem; height: 1.1rem; }
.tobbi { padding-block: 0 var(--szakasz); }
.tobbi h2 { font-size: clamp(1.9rem, 1.5rem + 1.6vw, 2.75rem); }
.tobbi .chipsor a { border-color: rgb(178 210 195 / .5); }
.tobbi .chipsor a:hover { border-color: var(--papir); background: rgb(239 237 230 / .06); }

/* Átállás lépései: nagy piros sorszámokkal, mert itt a sorrend számít */
.atallas { display: grid; counter-reset: lepes; border-top: 2px solid var(--tinta); }
.atallas li { counter-increment: lepes; display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: 1rem; align-items: baseline; padding: 1rem 0; border-bottom: 1px solid var(--hatar); }
.atallas li::before { content: counter(lepes); font-family: var(--betu-cim); font-weight: 900; font-size: 2.75rem; line-height: .8; color: var(--piros); }
/* A hat ok: sorszám nélkül, mert nincs köztük sorrend */
.okok { display: grid; }
.okok > li { display: grid; gap: .75rem 3rem; padding: 1.75rem 0; border-top: 2px solid var(--tinta); }
.okok > li:first-child { border-top: 0; padding-top: 0; }
.okok h2 { font-size: clamp(1.75rem, 1.45rem + 1.2vw, 2.5rem); }
.okok .proza { color: var(--tinta-2); }
@media (min-width: 900px) { .okok > li { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; } }
.fogalmak { display: grid; gap: 1rem; margin-top: 2rem; }
.fogalmak > div { padding: 1rem 0; border-top: 1px solid var(--hatar); }
.fogalmak dt { font-weight: 700; }
.fogalmak dd { margin-top: .3rem; color: var(--tinta-2); }
@media (min-width: 900px) { .fogalmak { grid-template-columns: 1fr 1fr; column-gap: 2.5rem; } }
.masik-lista { display: grid; border-top: 2px solid var(--tinta); }
.masik-lista li { display: grid; gap: .3rem 2rem; padding: 1.15rem 0; border-bottom: 1px solid var(--hatar); }
.masik-lista h3 { font-size: 1.6rem; }
.masik-lista p { color: var(--tinta-2); font-size: .9375rem; max-width: 62ch; }
@media (min-width: 1024px) { .masik-lista li { grid-template-columns: 12rem minmax(0, 1fr) auto; align-items: baseline; } }

/* Tárgyak az aloldalak fejében */
.startlap { width: min(100%, 22rem); margin-inline: auto; padding-top: 2rem; }
.startlap .dijszabas { margin-top: 0; grid-template-columns: minmax(0, 1fr); }
.temakartya {
  width: min(100%, 22rem); margin-inline: auto; padding: 1.25rem 1.4rem 1.1rem;
  background: var(--papir-feher);
}
.temakartya-cim { font-family: var(--betu-cim); font-weight: 800; font-size: 1.5rem; line-height: 1; padding-bottom: .8rem; border-bottom: 1px solid rgb(194 48 27 / .55); }
.temakartya ol { counter-reset: tk; }
.temakartya li { counter-increment: tk; border-bottom: 1px solid rgb(30 90 73 / .16); }
.temakartya a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 2.75rem; text-decoration: none; font-weight: 600; }
.temakartya a span::before { content: counter(tk) '. '; font-family: var(--betu-cim); font-weight: 800; color: var(--piros); }
.temakartya a b { font-weight: 500; font-size: .8125rem; color: var(--tinta-2); white-space: nowrap; }
.temakartya a:hover span { text-decoration: underline; }
.nevjegy {
  width: min(100%, 22rem); margin-inline: auto; padding: 1.5rem 1.6rem;
  background: #FBFAF6; display: grid; gap: .1rem;
  border-radius: 3px;
}
.nevjegy img { width: 3.5rem; height: 3.5rem; margin-bottom: .7rem; }
.nevjegy-nev { font-family: var(--betu-cim); font-weight: 800; font-size: 2rem; line-height: 1; }
.nevjegy-szerep { color: var(--tinta-2); font-size: .9375rem; }
.nevjegy-ceg { margin-top: .7rem; padding-top: .6rem; border-top: 1px solid var(--hatar); font-weight: 600; font-size: .9375rem; }
.nevjegy a { font-size: .9375rem; display: inline-flex; min-height: 44px; align-items: center; }
.pecsetkep { width: min(16rem, 70vw); height: auto; border-radius: 50%; }
.tuzott-pecset { width: auto !important; }

/* ================================================================================================
   Cikk
   ================================================================================================ */
.cikk-fej h1 { max-width: 20ch; font-size: clamp(2.4rem, 1.7rem + 2.9vw, 4.1rem); }
.cikk-racs { display: grid; gap: 2.5rem 4rem; }
.tj-cikk { align-self: start; }
.tj-cim { font-family: var(--betu-cim); font-weight: 800; font-size: 1.35rem; margin-bottom: .6rem; }
@media (min-width: 1100px) {
  .cikk-racs { grid-template-columns: 15.5rem minmax(0, 1fr); }
  .tj-cikk { position: sticky; top: 6rem; }
}
.cikk-torzs { min-width: 0; max-width: 46rem; }
.roviden { padding: 1.25rem 1.4rem 1.35rem; background: var(--papir-feher); border-top: 4px solid var(--tinta); }
.roviden h2 { font-size: 1.6rem; }
.roviden p, .roviden ul { margin-top: .6rem; }
.roviden ul { padding-left: 1.2rem; }
.cikk-lista { margin-top: 2rem; }
.cikk-lista h2 { font-size: 1.5rem; margin-bottom: .85rem; }
.cikk-proza { margin-top: 2.5rem; }
.forrasok, .cikk-gyik { margin-top: 3rem; padding-top: 1.5rem; border-top: 2px solid var(--tinta); }
.forrasok h2, .cikk-gyik h2 { font-size: 1.9rem; }
.forrasok ol { margin-top: 1rem; padding-left: 1.3rem; display: grid; gap: .45rem; font-size: .9375rem; }
.forrasok ol span { color: var(--tinta-2); }
.cikk-gyik .gyik { margin-top: .5rem; }
.cikk-cta {
  display: grid; gap: 1.25rem; align-items: center;
  margin-top: 3rem; padding: 1.75rem;
  background: var(--tabla); color: var(--papir);
  --fg: var(--papir); --fg-2: var(--zsalya); --fokusz: var(--sarga);
  border-radius: 3px;
}
.cikk-cta img { width: 4.5rem; height: 4.5rem; border-radius: 50%; background: var(--papir-lap); }
.cikk-cta h2 { font-size: 2rem; }
.cikk-cta p { margin-top: .5rem; color: var(--zsalya); }
@media (min-width: 720px) { .cikk-cta { grid-template-columns: auto minmax(0, 1fr) auto; } }
.tovabbi { padding-block: 0 var(--szakasz); }
.tovabbi h2 { margin-bottom: 1.25rem; }

/* ================================================================================================
   Űrlapok (prototípus)
   ================================================================================================ */
.urlap-racs { display: grid; gap: 3rem; align-items: start; margin-top: clamp(1rem, 3vw, 2rem); }
.urlap-bal .lead { margin-top: 1.25rem; max-width: 34rem; font-size: 1.125rem; }
@media (min-width: 1024px) { .urlap-racs { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 4.5rem; } }
.urlaplap {
  position: relative;
  background: var(--papir);
  padding: clamp(1.75rem, 4vw, 2.75rem);
  box-shadow: var(--arnyek-lap);
  border-radius: 2px;
}
.urlap-fej h2 { font-size: clamp(1.9rem, 1.6rem + 1.1vw, 2.5rem); }
.urlap-fej p { margin-top: .6rem; color: var(--tinta-2); }
.urlap { display: grid; gap: 1.25rem; margin-top: 1.75rem; }
.mezo { display: grid; gap: .4rem; }
.mezo > label { font-weight: 700; }
.kotelezo { color: var(--piros); }
.opc { font-weight: 400; color: var(--tinta-2); }
.mezo input:not([type="checkbox"]):not([type="radio"]), .mezo select, .mezo textarea {
  width: 100%; min-height: 48px; padding: .7rem .85rem;
  background: var(--papir-feher); color: var(--tinta);
  border: 1.5px solid var(--vonal); border-radius: var(--r);
  font-size: 1rem; line-height: 1.4;
  transition: border-color var(--gyors), box-shadow var(--gyors);
}
.mezo textarea { resize: vertical; min-height: 7.5rem; }
.mezo input:hover, .mezo select:hover, .mezo textarea:hover { border-color: var(--tinta); }
.mezo input:focus-visible, .mezo select:focus-visible, .mezo textarea:focus-visible { outline: 3px solid var(--tinta); outline-offset: 1px; border-color: var(--tinta); }
.mezo [aria-invalid="true"] { border-color: var(--piros) !important; border-width: 2px !important; }
.mezo ::placeholder { color: #5E6A63; opacity: 1; }
.mezo-sugo { font-size: .875rem; color: var(--tinta-2); }
.mezo-hiba { display: flex; gap: .45rem; align-items: flex-start; font-size: .875rem; font-weight: 600; color: var(--piros); }
.mezo-hiba .ikon { width: 1.05rem; height: 1.05rem; margin-top: .12rem; }
.jelolo { display: flex; gap: .7rem; align-items: flex-start; padding-block: .6rem; font-weight: 500; cursor: pointer; }
.jelolo input { width: 1.35rem; height: 1.35rem; margin-top: .12rem; accent-color: var(--tinta); flex: none; }
.csomagvalaszto { border: 0; padding: 0; display: grid; gap: .5rem; min-width: 0; }
.csomagvalaszto legend { font-weight: 700; margin-bottom: .45rem; }
.csomag-opcio {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .8rem; align-items: center;
  min-height: 56px; padding: .65rem .9rem;
  background: var(--papir-feher); border: 1.5px solid var(--vonal); border-radius: var(--r);
  cursor: pointer; transition: border-color var(--gyors), background-color var(--gyors);
}
.csomag-opcio input { width: 1.2rem; height: 1.2rem; accent-color: var(--tinta); margin: 0; }
.csomag-opcio:hover { border-color: var(--tinta); }
.csomag-opcio:has(input:checked) { border-color: var(--tinta); border-width: 2px; background: #FFFFFF; }
.csomag-nev { display: grid; line-height: 1.3; }
.csomag-nev small { color: var(--tinta-2); font-size: .8125rem; }
.csomag-ar { font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.urlap-jogi { font-size: .875rem; color: var(--tinta-2); }
.urlap-jogi a { color: var(--tinta); }
.proto-jelzes { display: flex; gap: .55rem; align-items: flex-start; padding: .75rem .9rem; background: rgb(30 90 73 / .08); border-radius: var(--r); font-size: .875rem; color: var(--tinta-2); }
.proto-jelzes .ikon { width: 1.1rem; height: 1.1rem; margin-top: .12rem; color: var(--zold-tinta); }
.siker { display: grid; gap: .75rem; justify-items: start; padding-top: .5rem; }
.siker:focus { outline: none; }
.siker h2 { font-size: clamp(1.9rem, 1.6rem + 1.1vw, 2.5rem); }
.siker p { color: var(--tinta-2); }
.siker-pecset {
  display: inline-block; padding: .3rem .8rem .35rem;
  border: 3px solid var(--piros); border-radius: 6px; color: var(--piros);
  font-family: var(--betu-cim); font-weight: 900; font-size: 1.6rem; letter-spacing: .12em; text-transform: uppercase; line-height: 1;
  transform: rotate(-6deg); margin-bottom: .5rem;
  animation: pecsetel-siker 260ms var(--kimenet) both;
}
@keyframes pecsetel-siker { from { opacity: 0; transform: rotate(-6deg) scale(1.5); } to { opacity: 1; transform: rotate(-6deg) scale(1); } }
.kapcsolat-info { margin-top: 2rem; display: grid; gap: 1.5rem; }
.kapcsolat-info .pipalista { margin-top: 0; }
.kapcsolat-info .pipalista .ikon { color: var(--papir); }
.kapcsolat-info .pipalista a { color: var(--papir); font-weight: 600; }
.kapcsolat-info .chipsor a { border-color: rgb(178 210 195 / .5); }
.kapcsolat-info .chipsor a:hover { border-color: var(--papir); }
.harom-nap { display: grid; gap: 0; margin-top: 2rem; border-top: 1px solid var(--hatar); }
.harom-nap li { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--hatar); }
.harom-nap-nap { font-family: var(--betu-cim); font-weight: 800; font-size: 1.35rem; line-height: 1.1; color: var(--papir); }
.harom-nap li p:last-child { color: var(--zsalya); }
.harom-nap b { color: var(--papir); }
.harom-nap a { color: var(--papir); }

/* ================================================================================================
   Lábléc
   ================================================================================================ */
.lablec { background: var(--tabla-sotet); color: var(--papir); padding-block: clamp(3rem, 6vw, 5rem) 2rem; border-top: 1px solid rgb(178 210 195 / .14); }
.lablec-fej { display: grid; gap: 2.5rem; align-items: start; padding-bottom: 2.5rem; border-bottom: 1px solid var(--hatar); }
.lablec-nev { font-family: var(--betu-cim); font-weight: 900; font-size: clamp(3rem, 2.3rem + 3vw, 4.75rem); line-height: .9; }
.lablec-jelmondat { margin-top: .8rem; max-width: 30rem; color: var(--zsalya); }
.lablec-marka .gomb { margin-top: 1.5rem; }
.lablec-honap { justify-self: start; width: 17.5rem; max-width: 100%; padding: 1rem 1.1rem 1.05rem; background: var(--papir-lap); transform: rotate(1.2deg); box-shadow: var(--arnyek-kicsi); }
.minihonap-cim { font-family: var(--betu-cim); font-weight: 800; font-size: 1.15rem; letter-spacing: .1em; text-transform: uppercase; text-align: center; padding-bottom: .4rem; border-bottom: 1.5px solid var(--tinta); }
.minihonap { width: 100%; min-width: 0; margin-top: .45rem; font-size: .8125rem; font-variant-numeric: tabular-nums; }
.minihonap th, .minihonap td { padding: .22rem 0; text-align: center; border: 0; color: var(--tinta); }
.minihonap th { font-family: var(--betu); font-weight: 700; font-size: .75rem; color: var(--tinta-2); letter-spacing: 0; }
.minihonap th:last-child, .minihonap td.vas { color: var(--piros); }
.minihonap td.ma { position: relative; font-weight: 800; color: var(--piros); }
.minihonap td.ma::after { content: ''; position: absolute; left: 50%; top: 50%; width: 1.75rem; height: 1.6rem; margin: -.8rem 0 0 -.875rem; border: 2px solid var(--piros); border-radius: 50%; transform: rotate(-8deg); }
.lablec-oszlopok { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.5rem; padding-block: 2.5rem; }
.lablec-oszlopok h2 { font-size: 1.35rem; letter-spacing: .02em; margin-bottom: .6rem; }
.lablec-oszlopok ul { display: grid; gap: 0; }
.lablec-oszlopok a { display: inline-flex; align-items: center; min-height: 44px; color: var(--zsalya); text-decoration: none; font-size: .9375rem; }
.lablec-oszlopok a:hover { color: var(--papir); text-decoration: underline; }
.lablec-also { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; padding-top: 1.5rem; border-top: 1px solid var(--hatar); font-size: .875rem; color: var(--zsalya); }
.lablec-also ul { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; }
.lablec-also a { display: inline-flex; align-items: center; min-height: 44px; color: var(--zsalya); }
.lablec-also a:hover { color: var(--papir); }
.lablec-also p { margin-left: auto; }
.proto-megj { margin-top: 1.5rem; font-size: .8125rem; color: var(--zsalya); max-width: 80ch; }
.proto-megj a { color: var(--papir); }
@media (min-width: 720px) {
  .lablec-fej { grid-template-columns: minmax(0, 1fr) auto; }
  .lablec-honap { justify-self: end; }
}
@media (min-width: 1024px) { .lablec-oszlopok { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 719.98px) { .lablec-also p { margin-left: 0; } }

/* ================================================================================================
   404
   ================================================================================================ */
.hiba404 { padding-block: clamp(2.5rem, 6vw, 5rem) var(--szakasz); }
.hiba404-racs { display: grid; gap: 3rem; align-items: center; }
.hiba404 h1 { max-width: 14ch; }
.hiba404-szoveg p { margin-top: 1.25rem; max-width: 36rem; font-size: 1.125rem; }
.hiba404 .gombsor { margin-top: 2rem; }
.hianyzo { justify-self: center; width: min(100%, 20rem); }
.hianyzo-karton { position: relative; background: var(--karton); padding: 1rem .7rem 3rem; box-shadow: var(--arnyek-lap); border-radius: 3px; }
.hianyzo-karton .tomb-csonk { display: block; position: relative; height: calc(.95rem + 6px); }
.hianyzo-karton::before { content: ''; display: block; height: .95rem; background: var(--piros); }
.hianyzo-karton p { margin-top: 1.5rem; text-align: center; font-family: var(--betu-cim); font-weight: 900; font-size: 7rem; line-height: .8; color: rgb(178 210 195 / .6); }
@media (min-width: 900px) { .hiba404-racs { grid-template-columns: minmax(0, 1fr) 20rem; column-gap: 5rem; } }

/* ---- Mozgás csak annak, aki kéri ------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
  .gomb:hover, .sav:hover { transform: none; }
}
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

@media print {
  .fejlec, .menu, .lablec, .tomb-vezerlo, .lap-ful { display: none !important; }
  body { background: #FFFFFF; color: #000000; }
}