/* Útőr Autómentő, stíluslap
   Alap: sötét változat. Világos változat: html[data-theme="light"]. */

:root,
html[data-theme="dark"] {
  /* 2026-11-05 (Magdolna): szemkímélőbb, hogy ne vibráljon: világosabb grafit háttér, tompább tört fehér szöveg */
  --hatter: #232425;
  --szoveg: #BDB8AF;
  --cim: #DEDAD2;
  --fejlec-hatter: #1E1F20;
  --fejlec-vonal: #303233;
  --logo-2: #BDB8AF;
  --tema-hatter: #1E1F20;
  --tema-keret: #5E5C58;
  --tema-ikon: #DEDAD2;
  --sarga: #E8B931;
  --gomb-szoveg: #151616;
  --cimke-keret: #3E4041;
  --kiemelt: #EBC350;
  --csempe-hatter: #2D2F30;
  --csempe-keret: #383A3B;
  --szines-hatter: #282A2B;
  --halvany-cimke: #313334;
  --vonal: #383A3B;
  --zaro-hatter: #2A2C2D;
  --lablec-hatter: #1E1F20;
  --lablec-vonal: #303233;
  --copy: #A29E97;
  --hero-gomb-arnyek: 0 0 0 4px rgba(232, 185, 49, 0.14);
  --zaro-gomb-arnyek: none;
  color-scheme: dark;
}

html[data-theme="light"] {
  --hatter: #F5F5F5;
  --szoveg: #474747;
  --cim: #111111;
  --fejlec-hatter: #FFFFFF;
  --fejlec-vonal: #E0E0E0;
  --logo-2: #474747;
  --tema-hatter: #FFFFFF;
  --tema-keret: #757575;
  --tema-ikon: #111111;
  --gomb-szoveg: #111111;
  --cimke-keret: #E0E0E0;
  --kiemelt: #5C4A00;
  --csempe-hatter: #FFFFFF;
  --csempe-keret: #FFFFFF;
  --szines-hatter: #FFFCEB;
  --halvany-cimke: #FFF9DB;
  --vonal: #E0E0E0;
  --zaro-hatter: #FFF9DB;
  --lablec-hatter: #FFFFFF;
  --lablec-vonal: #E0E0E0;
  --copy: #595959;
  --hero-gomb-arnyek: 0 0 0 5px rgba(255, 212, 0, 0.22), 0 10px 24px rgba(0, 0, 0, 0.5);
  --zaro-gomb-arnyek: 0 10px 22px rgba(0, 0, 0, 0.3);
  color-scheme: light;
}

/* ---------- Alapok ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

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

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--hatter);
  color: var(--szoveg);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: -0.01em;
  text-align: left;
  hyphens: none;
  transition: background-color .2s ease, color .2s ease;
}

main { flex: 1 0 auto; }

h1, h2, h3, p, figure, blockquote, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
strong { font-weight: 700; }
.egyben { white-space: nowrap; }
a { color: var(--cim); text-decoration: none; }

:focus-visible {
  outline: 3px solid var(--sarga);
  outline-offset: 3px;
  border-radius: 4px;
}

h1, h2, h3 { text-wrap: balance; color: var(--cim); }
p, blockquote { max-width: min(700px, 58ch); line-height: 1.5; }

/* Tartalom-szélesség: mobilon 24 px a lap szélétől, nagy képernyőn 1200 px-es középső sáv */
.fejlec,
.hero,
.szakasz,
.zaro,
.lablec {
  padding-left: max(24px, calc((100% - 1200px) / 2));
  padding-right: max(24px, calc((100% - 1200px) / 2));
}

/* ---------- Fejléc ---------- */
.fejlec {
  position: sticky;
  top: 0;
  z-index: 5;
  padding-top: 24px;
  padding-bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: var(--fejlec-hatter);
  border-bottom: 1px solid var(--fejlec-vonal);
}

.logo { display: flex; flex-direction: column; line-height: 1; }
.logo-1,
.logo-2 { font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; }
.logo-1 { font-weight: 800; font-size: 18px; letter-spacing: 0.1em; color: var(--cim); }
.logo-2 { font-weight: 700; font-size: 16px; letter-spacing: 3.5px; color: var(--logo-2); }

.fejlec-jobb { display: flex; align-items: center; gap: 8px; }

.tema-gomb {
  width: 44px;
  height: 44px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--tema-hatter);
  border: 2px solid var(--tema-keret);
  border-radius: 6px;
  color: var(--tema-ikon);
  cursor: pointer;
}
.tema-gomb svg { stroke: var(--tema-ikon); }
.tema-gomb .ikon-hold { display: none; }
html[data-theme="light"] .tema-gomb .ikon-nap { display: none; }
html[data-theme="light"] .tema-gomb .ikon-hold { display: block; }

.gomb-kicsi {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 16px;
  background: var(--sarga);
  border: 2px solid var(--sarga);
  border-radius: 6px;
  color: var(--gomb-szoveg);
  font-weight: 800;
  font-size: 18px;
  letter-spacing: 0.1em;
}
.gomb-kicsi svg { stroke: var(--gomb-szoveg); }
.gomb-kicsi:hover,
.gomb-nagy:hover { filter: brightness(1.05); }

/* ---------- Nyitó rész (hero) ---------- */
.hero {
  padding-top: 32px;
  padding-bottom: 48px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.hero-szoveg { display: flex; flex-direction: column; gap: 24px; }

.cimke {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border: 2px solid var(--cimke-keret);
  border-radius: 4px;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.1em;
  color: var(--szoveg);
}

.hero h1 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 700;
  font-size: 52px;
  line-height: 1.1;
  letter-spacing: -0.02em;
}
.kiemelt { color: var(--kiemelt); }

.bevezeto { margin-top: 0; font-size: 24px; color: var(--szoveg); }

.hivas-csoport { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; }

.gomb-nagy {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  height: 76px;
  padding: 0 24px;
  background: var(--sarga);
  color: var(--gomb-szoveg);
  border-radius: 8px;
  font-weight: 800;
  font-size: 24px;
  letter-spacing: 0.1em;
  box-shadow: var(--hero-gomb-arnyek);
}
.gomb-nagy svg { stroke: var(--gomb-szoveg); flex: 0 0 auto; }

.hero-szam {
  align-self: center;
  font-weight: 700;
  font-size: 24px;
  letter-spacing: 1px;
  color: var(--cim);
}

.csempek {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.csempe {
  padding: 24px;
  background: var(--csempe-hatter);
  border: 1px solid var(--csempe-keret);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.csempe svg { stroke: var(--cim); }
.csempe span { line-height: 1.5; font-weight: 700; font-size: 18px; color: var(--cim); }

/* ---------- Általános szakasz ---------- */
.szakasz {
  padding-top: 48px;
  padding-bottom: 48px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.szakasz-szines { background: var(--szines-hatter); }

.szakasz-cim {
  padding: 16px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: 1.1;
  letter-spacing: -0.02em;
}
.kozepre { text-align: center; }

.szakasz h3 { margin: 0 0 8px; font-size: 24px; font-weight: 700; line-height: 1.1; }

/* ---------- Lépések ---------- */
.lepeslista { display: flex; flex-direction: column; gap: 24px; }
.lepes { display: flex; gap: 8px; padding: 16px; align-items: baseline; }
.lepes-szam {
  flex: 0 0 auto;
  width: 20px;
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: 0.9;
  color: var(--cim);
}

/* ---------- Vélemények ---------- */
.velemenyek { gap: 24px; }
.velemenyek-fej { display: flex; flex-direction: column; margin-bottom: 0; }
.cimke-halvany {
  align-self: flex-start;
  margin-left: 16px;
  padding: 8px 16px;
  background: var(--halvany-cimke);
  border-radius: 4px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--szoveg);
}
.nagybetus { letter-spacing: 0.1em; }

.velemeny-racs { display: flex; flex-direction: column; gap: 24px; }
.velemeny {
  padding: 24px;
  background: var(--csempe-hatter);
  border: 1px solid var(--csempe-keret);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
}
.velemeny blockquote { font-size: 18px; color: var(--szoveg); }
.velemeny figcaption { font-weight: 700; font-size: 16px; color: var(--cim); }

/* ---------- Gyors válaszok ---------- */
.gyik { gap: 0; }
.gyik .szakasz-cim { margin-bottom: 32px; }
.gyik-racs { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 24px; }
.kerdes { padding: 24px; border-top: 1px solid var(--vonal); }
.kerdes:last-child { border-bottom: 1px solid var(--vonal); }

/* ---------- Záró sáv ---------- */
.zaro {
  padding-top: 32px;
  padding-bottom: 32px;
  background: var(--zaro-hatter);
  color: var(--cim);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 24px;
  text-align: center;
}
.zaro h2 {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: 1.1;
  color: var(--cim);
}
.zaro p { margin: -8px auto 0; font-size: 18px; color: var(--szoveg); }
.gomb-zaro { margin-top: 8px; box-shadow: var(--zaro-gomb-arnyek); }

/* ---------- Lábléc ---------- */
.lablec {
  padding-top: 32px;
  padding-bottom: 32px;
  background: var(--lablec-hatter);
  border-top: 1px solid var(--lablec-vonal);
  display: flex;
  flex-direction: column;
  gap: 24px;
  font-size: 18px;
  color: var(--szoveg);
}
.lablec-sorok { display: flex; flex-direction: column; gap: 24px; }
.lablec-sorok span,
.lablec-sorok a { line-height: 1.5; }
.lablec-nev {
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 800;
  font-size: 18px;
  letter-spacing: 0.1em;
  color: var(--cim);
}
.lablec-szam { font-weight: 700; color: var(--cim); }
.lablec-mail { color: var(--szoveg); }
.lablec-mail:hover { color: var(--cim); }
.lablec-copy { margin-top: 16px; font-size: 16px; color: var(--copy); }

/* ---------- Tablet (768 px felett), a 834 px-es terv alapján ---------- */
@media (min-width: 768px) {
  .hero { gap: 48px; }
  .hivas-csoport { align-self: flex-start; width: min(100%, 480px); }
  .csempek { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  .lepeslista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }

  .velemenyek-fej .cimke-halvany { align-self: center; margin-left: 0; }
  .velemeny-racs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }

  .gyik-racs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kerdes:last-child { border-bottom: 0; }
  .kerdes:nth-last-child(-n+2) { border-bottom: 1px solid var(--vonal); }

  .zaro { align-items: center; }
  .gomb-zaro { width: 480px; }

  .lablec-sorok { display: grid; grid-template-columns: 1fr auto; column-gap: 24px; }
  .lablec-sorok > * { grid-column: 1; }
  .lablec-sorok .lablec-szam { grid-column: 2; grid-row: 1; justify-self: end; }
  .lablec-sorok .lablec-mail { grid-column: 2; grid-row: 2; justify-self: end; }
}

/* ---------- Asztali (1100 px felett), az 1440 px-es terv alapján ---------- */
@media (min-width: 1100px) {
  .hero {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 48px;
    align-items: center;
    padding-bottom: 64px;
  }
  .csempek { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .lepeslista { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  .gyik-racs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kerdes:nth-last-child(-n+2) { border-bottom: 0; }
  .kerdes:nth-last-child(-n+3) { border-bottom: 1px solid var(--vonal); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body { transition: none; }
}

/* ---------- Portfólió-sáv (minden oldal tetején) ---------- */
.gyakorlo {
  max-width: none;
  margin: 0;
  padding: 8px 24px;
  background: #2D2F30;
  border-bottom: 1px solid #383A3B;
  color: #BDB8AF;
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
}
.gyakorlo a {
  display: inline-block;
  margin-right: 8px;
  padding: 0 16px;
  border-radius: 999px;
  background: #E8B931;
  color: #151616;
  font-weight: 700;
}
.gyakorlo a:hover { background: #F2C94C; }

/* ---------- Kiegészítések a főoldalon ---------- */
.cimke-vonal { width: 2px; height: 16px; background: var(--cimke-keret); }
.hero-vissza,
.zaro-vissza a,
.lepes a,
.kerdes a,
.szoveg-link {
  color: var(--kiemelt);
  font-weight: 700;
  text-decoration: none;
}
.hero-vissza { align-self: center; font-size: 18px; font-weight: 700; text-align: center; }
.zaro-vissza { margin: 0 auto; text-wrap: balance; font-size: 18px; color: var(--szoveg); }
.lablec-linkek { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.lablec-linkek a { color: var(--szoveg); font-weight: 700; text-decoration: none; }
.lablec-linkek a:hover { color: var(--cim); }

/* ---------- Aloldalak ---------- */
.aloldal { padding-top: 48px; padding-bottom: 64px; }
.aloldal-fej { display: flex; flex-direction: column; gap: 16px; }
.aloldal h1 {
  font-weight: 800;
  font-size: 36px;
  line-height: 1.1;
  letter-spacing: -0.02em;
}
.aloldal-fej p { font-size: 24px; line-height: 1.5; }
.ket-oszlop { display: flex; flex-direction: column; gap: 32px; }
.kep {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid var(--csempe-keret);
}
.kep-felirat { margin-top: 8px; font-size: 16px; color: var(--copy); }
.lap { display: flex; flex-direction: column; gap: 16px; max-width: 760px; }
.lap h2 { margin-top: 16px; font-size: 24px; font-weight: 700; line-height: 1.1; }
.lap ul { padding-left: 24px; list-style: disc; display: flex; flex-direction: column; gap: 8px; }
.kiemelt-doboz {
  padding: 24px;
  background: var(--szines-hatter);
  border: 1px solid var(--vonal);
  border-left: 4px solid var(--sarga);
  border-radius: 8px;
}
.gomb-sor { display: flex; flex-direction: column; gap: 16px; }
.gomb-masodik {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 56px;
  padding: 0 24px;
  border: 2px solid var(--tema-keret);
  border-radius: 8px;
  color: var(--cim);
  font-weight: 700;
  font-size: 18px;
}
.gomb-masodik svg { stroke: var(--cim); flex: 0 0 auto; }
.gomb-masodik:hover { border-color: var(--sarga); }

/* ---------- Űrlap ---------- */
.urlap {
  padding: 24px;
  background: var(--csempe-hatter);
  border: 1px solid var(--csempe-keret);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
html[data-theme="light"] .urlap { border-color: var(--vonal); }
.mezo { display: flex; flex-direction: column; gap: 8px; border: 0; margin: 0; padding: 0; min-width: 0; }
.mezo > label,
.mezo legend { padding: 0; font-weight: 700; color: var(--cim); }
.mezo .nem-kotelezo { font-weight: 400; color: var(--copy); }
.sugo { font-size: 16px; color: var(--copy); }
.mezo input[type="text"],
.mezo input[type="tel"],
.mezo input[type="email"],
.mezo textarea {
  width: 100%;
  min-height: 56px;
  padding: 16px;
  background: var(--hatter);
  border: 2px solid var(--tema-keret);
  border-radius: 6px;
  color: var(--cim);
  font-family: inherit;
  font-size: 18px;
  line-height: 1.4;
}
.mezo textarea { min-height: 112px; resize: vertical; }
.mezo input::placeholder,
.mezo textarea::placeholder { color: var(--copy); opacity: 1; }
.mezo input:focus,
.mezo textarea:focus { outline: 3px solid var(--sarga); outline-offset: 0; border-color: var(--sarga); }
.valasztok { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.valaszto { position: relative; }
.valaszto input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; padding: 0; }
.valaszto span {
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 8px 16px;
  background: var(--hatter);
  border: 2px solid var(--tema-keret);
  border-radius: 6px;
  color: var(--cim);
  font-weight: 700;
  cursor: pointer;
}
.valaszto input:checked + span { background: var(--sarga); border-color: var(--sarga); color: var(--gomb-szoveg); }
.valaszto input:focus-visible + span { outline: 3px solid var(--sarga); outline-offset: 3px; }
.hozzajarulas { display: flex; align-items: flex-start; gap: 16px; cursor: pointer; }
.hozzajarulas input { flex: 0 0 auto; width: 24px; height: 24px; margin: 2px 0 0; accent-color: var(--sarga); cursor: pointer; }
.hozzajarulas input { margin: 0; }
.hozzajarulas a { color: var(--kiemelt); font-weight: 700; text-decoration: none; }
.hiba-uzenet { font-size: 16px; font-weight: 700; color: var(--hiba); }
.mezo [aria-invalid="true"],
.valasztok[aria-invalid="true"] .valaszto span { border-color: var(--hiba); }
.hozzajarulas input[aria-invalid="true"] { outline: 2px solid var(--hiba); outline-offset: 2px; }
.urlap button.gomb-nagy { width: 100%; border: 0; font-family: inherit; cursor: pointer; }
.urlap button.gomb-nagy:disabled { opacity: .7; cursor: wait; }
.csali input { padding: 0; margin: 0; }
.csali { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
[hidden] { display: none !important; }

:root,
html[data-theme="dark"] { --hiba: #FF8A80; }
html[data-theme="light"] { --hiba: #B42318; }

@media (min-width: 768px) {
  .gomb-sor { flex-direction: row; flex-wrap: wrap; }
  .gomb-sor .gomb-nagy { width: min(100%, 480px); }
  .valasztok { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .urlap { padding: 32px; }
}
@media (min-width: 1100px) {
  .ket-oszlop { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 48px; align-items: start; }
  .ket-oszlop .oldalso { position: sticky; top: 120px; }
}
a.szoveg-link[href^="tel:"] { white-space: nowrap; }

/* ---------- Betűskála és szövegoszlop (Magdolna szabályai, 2026-11-04 este) ----------
   5 méret nézetenként: főcím / szakaszcím / kártyacím / alapszöveg és gombok / kis felirat
   telefon 56/36/29/19/14, tablet 67/48/30/21/17, gép 78/60/30/22/20 */
:root { --fs1: 56px; --fs2: 36px; --fs3: 29px; --fs4: 19px; --fs5: 14px; }
@media (min-width: 768px) { :root { --fs1: 67px; --fs2: 48px; --fs3: 30px; --fs4: 21px; --fs5: 17px; } }
@media (min-width: 1280px) { :root { --fs1: 78px; --fs2: 60px; --fs3: 30px; --fs4: 22px; --fs5: 20px; } }
body, .gomb-kicsi, .logo-1, .csempe span, .velemeny blockquote, .zaro p, .zaro-vissza, .lablec, .lablec-nev,
.mezo input[type="text"], .mezo input[type="tel"], .mezo input[type="email"], .mezo textarea,
.gomb-masodik, .hero-vissza, .gomb-nagy { font-size: var(--fs4); }
.hero h1, .aloldal h1 { font-size: var(--fs1); line-height: 1.1; }
.szakasz-cim, .zaro h2, .lepes-szam { font-size: var(--fs2); }
.szakasz h3, .lap h2, .bevezeto, .aloldal-fej p, .hero-szam { font-size: var(--fs3); }
.bevezeto, .aloldal-fej p { line-height: 1.5; }
.cimke, .logo-2, .cimke-halvany, .velemeny figcaption, .lablec-copy, .kep-felirat, .sugo, .hiba-uzenet, .gyakorlo { font-size: var(--fs5); }
h1, h2, h3 { line-height: 1.1; overflow-wrap: break-word; }
p, blockquote { max-width: min(850px, 31em); }
.lepes-szam { width: auto; min-width: 32px; }
/* fő gomb: nagy, a telefonszámmal együtt (webvezer.hu méretei) */
.gomb-nagy { height: auto; min-height: 64px; padding: 24px 48px; letter-spacing: 0; line-height: 1.2; text-align: center; }
@media (max-width: 599px) { .gomb-nagy { padding: 24px; gap: 8px; } }
/* lábléc: felül 48, alul 32 px, az elemek között 16-24 px */
.lablec { padding-top: 48px; padding-bottom: 32px; gap: 24px; }
.lablec-sorok { gap: 16px; }
.lablec-copy { margin-top: 0; }
/* Sorhossz és középre igazítás (2026-11-04 este): teli sor 60-75 karakter (31em), a címek középen,
   az egyoszlopos aloldalak (adatkezelés, impresszum, 404) szövege balra zárva, de középre tett oszlopban */
@media (min-width: 768px) {
  .szakasz-cim { text-align: center; margin-left: auto; margin-right: auto; text-wrap: balance; }
  .aloldal-fej { align-items: center; text-align: center; }
  .aloldal-fej p { margin-left: auto; margin-right: auto; }
  .aloldal > .lap { max-width: min(100%, 31em); margin-left: auto; margin-right: auto; }
  .aloldal > .lap > h1 { text-align: center; text-wrap: balance; }
  .aloldal > .lap > .gomb-sor { justify-content: center; }
}
/* gépen a 4 lépés és a 6 kérdés két oszlopban, hogy a sorok ne legyenek nagyon rövidek */
@media (min-width: 1100px) {
  .lepeslista { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; }
  .gyik-racs { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; }
}

/* ---------- 2026-11-05 (Magdolna): sehol nincs aláhúzás, nincs szóelválasztás, a ragadós fejléc nem takar ---------- */
html { scroll-padding-top: 128px; }
*, *::before, *::after { -webkit-hyphens: none; hyphens: none; }
h1, h2, h3 { overflow-wrap: normal; word-break: normal; }
a, a:hover, a:focus, abbr, ins, u { text-decoration: none !important; }
.lablec-szam { color: var(--kiemelt); }
.lepes a:hover, .kerdes a:hover, .szoveg-link:hover, .hozzajarulas a:hover, .lablec-linkek a:hover { color: var(--cim); }
/* a fejléc alatt több hely, hogy a felső sor teljesen látszódjon */
.hero { padding-top: 48px; }
.aloldal { padding-top: 64px; }
/* fejléc hívógombja: ikon és telefonszám */
.gomb-kicsi { letter-spacing: 0; white-space: nowrap; }
@media (max-width: 599px) { .gomb-kicsi { padding: 0 12px; gap: 6px; font-size: var(--fs5); } .fejlec-jobb { gap: 8px; } }
/* Portfólió-sáv: vissza a portfólióhoz és a WebRendbe főoldalra, telefonon rövid felirattal, egy sorban */
.gyakorlo { display: flex; align-items: center; justify-content: center; gap: 16px; padding: 8px 16px; white-space: nowrap; }
.gyakorlo a.gy-link { display: inline-flex; align-items: center; gap: 4px; margin: 0; padding: 0 12px; flex: none; color: #151616; }
.gyakorlo .gy-szoveg { display: block; min-width: 0; max-width: none; overflow: hidden; text-overflow: ellipsis; }
.gyakorlo .gy-hosszu { display: none; }
.gyakorlo .gy-rovid { display: inline; }
@media (min-width: 768px) { .gyakorlo a .gy-hosszu { display: inline; } .gyakorlo a .gy-rovid { display: none; } .gyakorlo .gy-szoveg .gy-hosszu { display: inline; } .gyakorlo .gy-szoveg .gy-rovid { display: none; } }
/* 2026-11-05: rövid kötőjeles szavak egyben, nincs árva szó a bekezdések végén */
.nowrap{white-space:nowrap}
p,li,blockquote,dd,figcaption,summary,label{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}
/* 2026-11-05 (Magdolna): a „Hívj, megyünk.” telefonon is egy sorban, ne lógjon ki */
/* a főcím-méret (--fs1) telefonon mindenhol ugyanannyival kisebb, hogy ne legyen több betűméret az oldalon */
@media (max-width: 767px) { :root { --fs1: min(56px, 13.3vw); } }