/* megfagyok.hu – két betűtípus: Fraunces (címek), Inter (szöveg); minimum 18 px.
   Az évszakot a <html data-evszak="..."> adja meg, csak a színek változnak. */
:root {
  --papir: #ffffff; --tinta: #1f2a33; --halvany: #4a5a68;
  --sugar: 20px; --arny: 0 18px 44px rgba(20, 40, 70, .13);
  /* ŐSZ */
  --hatter: #fbf4e9; --hatter2: #f3e3cc; --kiemelt: #c2410c; --kiemelt-s: #9a3412; --disz: #e9b872;
}
:root[data-evszak="tel"]  { --hatter: #eef4fb; --hatter2: #dbe8f6; --kiemelt: #1d4ed8; --kiemelt-s: #1e3a8a; --disz: #9ec8ef; --tinta: #16263b; --halvany: #43566e; }
:root[data-evszak="fagy"] { --hatter: #e9eff7; --hatter2: #cfdcec; --kiemelt: #0e7490; --kiemelt-s: #155e75; --disz: #bcd8ea; --tinta: #0f1f2e; --halvany: #3b5166; }
:root[data-evszak="nyar"] { --hatter: #f6f7f4; --hatter2: #e7ece3; --kiemelt: #15803d; --kiemelt-s: #166534; --disz: #bcd9bf; }

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 18px; scroll-behavior: smooth; scroll-padding-top: 86px; }
body { margin: 0; font-family: Inter, system-ui, sans-serif; font-size: 1rem; line-height: 1.7; color: var(--tinta);
  background: linear-gradient(180deg, var(--hatter) 0%, var(--hatter2) 100%); background-attachment: fixed; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--kiemelt); }
h1, h2, h3, .lablec-cim { font-family: Fraunces, Georgia, serif; font-weight: 700; line-height: 1.18; margin: 0 0 .55em; }
h1 { font-size: clamp(2.1rem, 4.4vw, 3.2rem); }
h2 { font-size: clamp(1.6rem, 3.1vw, 2.35rem); }
h3 { font-size: 1.18rem; }
h1 em, h2 em { font-style: italic; color: var(--kiemelt); }
p { margin: 0 0 1em; }
svg { width: 1em; height: 1em; }
.wrap { max-width: 1140px; margin: 0 auto; padding: 0 24px; position: relative; z-index: 2; }
section { padding: 80px 0; }
.kozep { text-align: center; }
h2.kozep, p.kozep { max-width: 860px; margin-left: auto; margin-right: auto; }
.alcim { color: var(--halvany); margin-bottom: 40px; }
.apro { color: var(--halvany); font-size: 1rem; }
.lead { font-size: 1.1rem; color: var(--halvany); max-width: 34em; }

/* hulló levelek / hópelyhek */
#hullas { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
@media (prefers-reduced-motion: reduce) { #hullas { display: none; } }

/* gombok */
.btn { display: inline-flex; align-items: center; gap: .5em; min-height: 52px; padding: .65em 1.5em; border-radius: 999px;
  background: var(--kiemelt); color: #fff; font: 700 1rem/1.3 Inter, sans-serif; text-decoration: none; border: 2px solid var(--kiemelt);
  cursor: pointer; box-shadow: 0 10px 24px rgba(0, 0, 0, .14); transition: background .2s, transform .2s; }
.btn:hover { background: var(--kiemelt-s); border-color: var(--kiemelt-s); transform: translateY(-1px); }
.btn-vonal { background: var(--papir); color: var(--kiemelt); box-shadow: none; }
.btn-vonal:hover { background: #fff; color: var(--kiemelt-s); }
.btn-kicsi { min-height: 46px; padding: .5em 1.2em; font-size: 1rem; }
.btn-jegyzet { margin-top: .8em; color: var(--halvany); font-size: 1rem; }

/* fejléc */
.fejlec { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .92); backdrop-filter: blur(6px); box-shadow: 0 2px 14px rgba(0, 0, 0, .06); }
.fejlec-be { display: flex; align-items: center; justify-content: space-between; min-height: 70px; gap: 16px; }
.logo { font-family: Fraunces, Georgia, serif; font-weight: 700; font-size: 1.35rem; color: var(--kiemelt); text-decoration: none; }
.logo span { color: var(--tinta); }
.fejlec-info { display: inline-flex; align-items: center; gap: .45em; color: var(--halvany); font-size: 1rem; white-space: nowrap; }

/* hero */
.hero { padding-top: 56px; }
.hero-racs { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; }
.kiemelo { text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: 1rem; color: var(--kiemelt); margin-bottom: .6em; }

/* képek és képhelyek */
.kep { display: block; }
.kep img { border-radius: var(--sugar); box-shadow: var(--arny); width: 100%; object-fit: cover; }
.kerek img { border-radius: 50%; box-shadow: none; }
.kephely { width: 100%; border-radius: var(--sugar); border: 2px dashed color-mix(in srgb, var(--kiemelt) 45%, #fff);
  background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--disz) 35%, #fff) 0 16px, color-mix(in srgb, var(--disz) 18%, #fff) 16px 32px);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 24px; }
.kephely-cimke { font-weight: 700; color: var(--kiemelt); text-transform: uppercase; letter-spacing: .1em; }
.kephely-leiras { color: var(--tinta); max-width: 28em; }
.kephely-arany { color: var(--halvany); font-size: 1rem; font-family: ui-monospace, monospace; }
.kerek { border-radius: 50%; }

/* tünetek */
.harom { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 44px; }
.kartya { background: var(--papir); border-radius: var(--sugar); padding: 28px; box-shadow: 0 10px 26px rgba(20, 40, 70, .08); }
.kartya p { margin: 0; color: var(--halvany); }
.jo-hir { text-align: center; max-width: 760px; margin: 44px auto 0; font-size: 1.08rem; }
.jo-hir strong { font-family: Fraunces, serif; color: var(--kiemelt); }

/* termékek */
.termekek { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 28px; }
.termek { background: var(--papir); border-radius: var(--sugar); padding: 22px; box-shadow: 0 10px 26px rgba(20, 40, 70, .08); display: flex; flex-direction: column; }
.termek .kep img, .termek .kephely { margin-bottom: 16px; }
.termek h3 { margin-bottom: .3em; }
.termek p { color: var(--halvany); font-size: 1rem; }
.cimke { align-self: flex-start; background: color-mix(in srgb, var(--kiemelt) 12%, #fff); color: var(--kiemelt);
  border-radius: 999px; padding: 3px 12px; font-size: 1rem; font-weight: 700; margin-bottom: 10px; }
.ar { font-family: Fraunces, serif; font-weight: 700; font-size: 1.35rem; color: var(--tinta); margin: auto 0 .6em; }
.keszlet { font-family: Inter, sans-serif; font-size: 1rem; font-weight: 600; border-radius: 999px; padding: 3px 10px; margin-left: 8px; vertical-align: middle; }
.keszlet.van { background: #e7f6e7; color: #1e6b1e; }
.keszlet.nincs { background: #fdf0e3; color: #9a3412; }

/* hőcserélő */
.ketto { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; }
.hocs-lista { display: grid; gap: 14px; margin-top: 24px; }
.hocs-sor { background: var(--papir); border-radius: 16px; padding: 18px 20px; display: flex; flex-wrap: wrap; gap: 14px;
  align-items: center; justify-content: space-between; box-shadow: 0 8px 22px rgba(20, 40, 70, .07); }
.hocs-sor strong { display: block; font-size: 1.05rem; }
.hocs-sor span { color: var(--halvany); font-size: 1rem; }
.hocs-ar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.hocs-ar .ar { margin: 0; font-size: 1.15rem; }

/* lépések */
.lepes-lista { list-style: none; padding: 0; margin: 44px 0 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.lepes-lista li { position: relative; background: var(--papir); border-radius: var(--sugar); padding: 26px 26px 22px 92px; box-shadow: 0 10px 26px rgba(20, 40, 70, .07); }
.lepes-lista .szam { position: absolute; left: 26px; top: 26px; width: 48px; height: 48px; display: grid; place-items: center;
  border-radius: 50%; background: var(--kiemelt); color: #fff; font: 700 1.3rem/1 Fraunces, serif; }
.lepes-lista h3 { margin-bottom: .25em; }
.lepes-lista p { margin: 0; color: var(--halvany); }

/* mérnöki segítség */
.segitseg .kephely, .segitseg .kep img { max-width: 420px; margin-inline: auto; }
.reveal-btn[hidden], .reveal-box[hidden] { display: none; }
.reveal-box { display: flex; flex-wrap: wrap; gap: 14px 20px; align-items: center; margin-bottom: 1em; }
.mail-link { display: inline-flex; align-items: center; gap: .5em; font-weight: 600; }

/* GYIK */
.gyik-racs { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; margin-top: 40px; align-items: start; }
details { background: var(--papir); border-radius: 16px; box-shadow: 0 8px 22px rgba(20, 40, 70, .07); }
summary { cursor: pointer; list-style: none; padding: 20px 56px 20px 22px; font-weight: 700; position: relative; }
summary::-webkit-details-marker { display: none; }
summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px;
  border-radius: 50%; border: 2px solid var(--kiemelt); color: var(--kiemelt); display: grid; place-items: center; font: 700 1.2rem/1 Inter, sans-serif; }
details[open] summary::after { content: "–"; }
details p { padding: 0 22px 20px; margin: 0; color: var(--halvany); }

/* záró */
.zaro-gombok { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-top: 28px; }

/* lábléc */
.lablec { background: #1f2a33; color: #e8eef4; padding: 52px 0 0; position: relative; z-index: 2; }
.lablec a { color: #fff; }
.lablec-racs { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; padding-bottom: 36px; }
.lablec-cim { color: #fff; font-size: 1.3rem; }
.jogi { background: #16202a; margin: 0; padding: 14px 24px; text-align: center; font-size: 15px; line-height: 1.5; color: #b9c6d2; }

/* süti-sáv */
.cookie-sav { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 100; max-width: 640px; margin: 0 auto;
  background: #fff; color: var(--tinta); border-radius: 20px; padding: 24px; box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
  max-height: calc(100vh - 32px); overflow: auto; }
.cookie-sav h2 { font-size: 1.35rem; }
.cookie-gombok { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.cookie-link { background: none; border: 0; color: var(--kiemelt); text-decoration: underline; font: 1rem Inter, sans-serif; cursor: pointer; min-height: 44px; }
.cookie-reszletek { margin-bottom: 16px; }
.cc-sor { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 10px; }
.cc-sor input { width: 20px; height: 20px; margin-top: 5px; flex: none; }

/* reszponzív */
@media (max-width: 960px) {
  section { padding: 60px 0; }
  .hero-racs, .ketto, .termekek, .harom, .lepes-lista, .gyik-racs, .lablec-racs { grid-template-columns: 1fr; }
  .ketto .kephely, .ketto .kep { order: -1; }
  .segitseg .kephely, .segitseg .kep img { max-width: 320px; }
}
@media (max-width: 720px) {
  .wrap { padding: 0 16px; }
  .fejlec-info { display: none; }
  .lepes-lista li { padding: 86px 22px 22px; }
  .hocs-sor { flex-direction: column; align-items: flex-start; }
}

/* széles képhelyek (tünetek, záró) */
.szeles-kep { margin: 36px auto 0; max-width: 820px; }
.zaro .szeles-kep { margin-bottom: 8px; }

/* szezonsáv: nyáron a megsulok.hu-ra mutat */
.szezonsav { background: var(--kiemelt); color: #fff; position: relative; z-index: 3; }
.szezonsav .wrap { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; justify-content: center; padding-top: 12px; padding-bottom: 12px; text-align: center; }
.szezonsav p { margin: 0; }
.szezonsav a { color: #fff; font-weight: 700; text-decoration: underline; }