/* Tudáshősök – a landing oldal, a belépés, a fiók és a jogi oldalak közös stílusa. A játék színei: éjkék-lila égbolt,
   arany és ibolya fény, vastag sötét körvonalú „rajzfilmes” gombok. Külső betűtípus nincs (adatvédelem, sebesség). */
:root {
  --ej: #0f0c24; --ej2: #1b1640; --lila: #7b5fd6; --ibolya: #b066ff; --arany: #ffb800; --arany2: #ffd451;
  --vonal: #1d2340; --papir: #fffaf0; --zold: #3fbf6a; --piros: #e2557a; --kek: #4f8ef7;
  --szoveg: #f3f0ff; --halvany: #b9b2e6; --uveg: rgba(255, 255, 255, .06); --uvegvonal: rgba(255, 255, 255, .13);
  --betu: 'Trebuchet MS', 'Segoe UI', 'Nunito', system-ui, -apple-system, sans-serif;
  --szel: 1160px;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  margin: 0; font-family: var(--betu); color: var(--szoveg); line-height: 1.55; font-size: 17px;
  background: var(--ej) radial-gradient(ellipse 120% 70% at 50% -10%, #43358c 0%, #1f1950 45%, var(--ej) 100%) no-repeat;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img, svg { max-width: 100%; }
a { color: var(--arany2); }
h1, h2, h3 { line-height: 1.12; margin: 0 0 .45em; letter-spacing: -.01em; }
h1 { font-size: clamp(2.2rem, 5.6vw, 4.1rem); font-weight: 900; }
h2 { font-size: clamp(1.7rem, 3.6vw, 2.6rem); font-weight: 900; }
h3 { font-size: 1.25rem; }
p { margin: 0 0 1em; }
.belso { max-width: var(--szel); margin: 0 auto; padding: 0 22px; }
.arany-szoveg { background: linear-gradient(100deg, #fff1a8, var(--arany) 45%, #ff8a3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ibolya-szoveg { color: #d6b8ff; }
.halvany { color: var(--halvany); }
.kicsi { font-size: .9rem; }

/* ---------- gombok (a játék stílusa) ---------- */
.gomb {
  display: inline-flex; align-items: center; justify-content: center; gap: .45em; font: inherit; font-weight: 900; cursor: pointer;
  border: 3px solid var(--vonal); border-radius: 16px; color: var(--vonal); background: #fff; padding: .7em 1.25em;
  box-shadow: 0 5px 0 var(--vonal); text-decoration: none; transition: transform .08s, box-shadow .08s, filter .15s; line-height: 1.15;
}
.gomb:hover { filter: brightness(1.06); }
.gomb:active { transform: translateY(4px); box-shadow: 0 1px 0 var(--vonal); }
.gomb.arany { background: linear-gradient(#ffe27a, #ffad0a); }
.gomb.nagy { font-size: 1.18rem; padding: .85em 1.5em; border-radius: 18px; }
.gomb.atlatszo { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); box-shadow: none; }
.gomb.atlatszo:hover { background: rgba(255, 255, 255, .08); }
.gomb.kicsi { font-size: .92rem; padding: .45em .9em; box-shadow: 0 3px 0 var(--vonal); border-width: 2.5px; }
.gomb.veszely { background: #ffd9d9; }
.gomb[disabled] { opacity: .55; cursor: default; }
.gomb.teljes { width: 100%; }

/* ---------- fejléc ---------- */
.fejlec { position: sticky; top: 0; z-index: 20; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); background: rgba(15, 12, 36, .72); border-bottom: 1px solid var(--uvegvonal); }
.fejlec .belso { display: flex; align-items: center; gap: 18px; min-height: 66px; }
.logo { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-weight: 900; font-size: 1.32rem; letter-spacing: .01em; }
.logo svg { width: 36px; height: 36px; flex: none; }
.logo b { color: var(--arany); }
.menu { display: flex; gap: 22px; margin-left: auto; }
.menu a { color: var(--halvany); text-decoration: none; font-weight: 700; }
.menu a:hover { color: #fff; }
.fejlec-gombok { display: flex; gap: 10px; align-items: center; }
.fejlec-gombok .belepes-link { color: #fff; font-weight: 800; text-decoration: none; padding: .4em .5em; }
@media (max-width: 900px) { .menu { display: none; } .fejlec-gombok { margin-left: auto; } }
@media (max-width: 420px) { .fejlec-gombok .gomb { padding: .45em .7em; font-size: .88rem; } .logo { font-size: 1.12rem; } }
@media (max-width: 380px) { .fejlec .belso { gap: 8px; padding: 0 12px; } .logo svg { width: 30px; height: 30px; } .fejlec-gombok { gap: 2px; } .fejlec-gombok .belepes-link { padding: .4em .3em; } }

/* ---------- nyitó rész ---------- */
.nyito { position: relative; padding: 64px 0 40px; overflow: hidden; }
.nyito .belso { display: grid; grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: center; }
.cimke-sor { display: inline-flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.cimke { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--uvegvonal); background: var(--uveg); border-radius: 999px; padding: 5px 12px; font-size: .88rem; font-weight: 700; color: #e7e1ff; }
.nyito .alcim { font-size: 1.18rem; color: #ddd6ff; max-width: 34em; }
.gombsor { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin: 26px 0 12px; }
.biztato { font-size: .92rem; color: var(--halvany); }
.biztato b { color: #fff; }
.csillagok { position: absolute; inset: 0; pointer-events: none; opacity: .7;
  background-image: radial-gradient(1.5px 1.5px at 10% 20%, #fff 50%, transparent 52%), radial-gradient(1px 1px at 80% 12%, #fff 50%, transparent 52%),
    radial-gradient(1.5px 1.5px at 65% 70%, #d6b8ff 50%, transparent 52%), radial-gradient(1px 1px at 30% 80%, #fff 50%, transparent 52%),
    radial-gradient(2px 2px at 92% 55%, #ffe27a 50%, transparent 52%), radial-gradient(1px 1px at 45% 35%, #fff 50%, transparent 52%); }

/* a harcjelenet: hős, lény, feladatkártya */
.jelenet { position: relative; aspect-ratio: 1 / .92; border-radius: 28px; overflow: hidden; border: 3px solid var(--vonal);
  background: linear-gradient(#5d7fd8 0%, #8fb4f0 45%, #7cc46b 46%, #4f9d4a 100%); box-shadow: 0 30px 80px rgba(0, 0, 0, .45), 0 0 0 1px rgba(255, 255, 255, .08), 0 0 90px rgba(176, 102, 255, .25); }
.jelenet .domb { position: absolute; left: -10%; right: -10%; bottom: -18%; height: 46%; border-radius: 50%; background: #3f8a3f; }
.jelenet .nap { position: absolute; top: 9%; right: 12%; width: 13%; aspect-ratio: 1; border-radius: 50%; background: #fff3b0; box-shadow: 0 0 40px #fff3b0; }
.jelenet .felho { position: absolute; background: #fff; border-radius: 999px; opacity: .9; }
.jelenet .felho.a { top: 12%; left: 8%; width: 22%; height: 7%; animation: felho 18s linear infinite; }
.jelenet .felho.b { top: 22%; left: 52%; width: 16%; height: 5%; animation: felho 24s linear infinite reverse; }
@keyframes felho { 50% { transform: translateX(30px); } }
.jelenet .hos { position: absolute; left: 4%; bottom: 7%; width: 44%; height: 58%; animation: lebeg 3.2s ease-in-out infinite; }
.jelenet .leny { position: absolute; right: 5%; bottom: 11%; width: 34%; height: 40%; animation: lebeg 2.6s ease-in-out infinite reverse; }
.jelenet .hos svg, .jelenet .leny svg { width: 100%; height: 100%; }
.jelenet .eletcsik { position: absolute; right: 7%; bottom: 52%; width: 30%; height: 12px; border: 2.5px solid var(--vonal); border-radius: 8px; background: #fff; overflow: hidden; }
.jelenet .eletcsik i { display: block; height: 100%; width: 35%; background: linear-gradient(#ff8aa5, var(--piros)); animation: elet 6s ease-in-out infinite; }
@keyframes elet { 0%, 40% { width: 70%; } 55%, 100% { width: 35%; } }
.jelenet .sebzes { position: absolute; right: 18%; bottom: 58%; font-weight: 900; font-size: clamp(1.2rem, 2.6vw, 1.9rem); color: #fff; -webkit-text-stroke: 2px var(--vonal); paint-order: stroke; opacity: 0; animation: sebzes 6s ease-out infinite; }
@keyframes sebzes { 0%, 44% { opacity: 0; transform: translateY(10px) scale(.6); } 50% { opacity: 1; transform: translateY(0) scale(1.15); } 70% { opacity: 1; transform: translateY(-16px) scale(1); } 80%, 100% { opacity: 0; transform: translateY(-26px); } }
.jelenet .kartya { position: absolute; left: 50%; top: 7%; transform: translateX(-50%); width: min(78%, 360px); background: var(--papir); color: var(--vonal); border: 3px solid var(--vonal); border-radius: 18px; padding: 12px 14px 14px; box-shadow: 0 6px 0 var(--vonal); text-align: center; }
.jelenet .kartya .kerdes { font-weight: 900; font-size: clamp(1.05rem, 2.2vw, 1.35rem); margin-bottom: 10px; }
.jelenet .kartya .valaszok { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.jelenet .kartya .valaszok span { border: 2.5px solid var(--vonal); border-radius: 12px; padding: 6px 0; font-weight: 900; font-size: 1.1rem; box-shadow: 0 3px 0 var(--vonal); background: #fff; }
.jelenet .kartya .valaszok span.jo { animation: jo 6s ease-in-out infinite; }
@keyframes jo { 0%, 30% { background: #fff; } 36%, 100% { background: #9be3a8; } }
@keyframes lebeg { 50% { transform: translateY(-7px); } }
.lebego-cimke { position: absolute; background: #fff; color: var(--vonal); font-weight: 900; border: 3px solid var(--vonal); border-radius: 14px; padding: 6px 12px; box-shadow: 0 4px 0 var(--vonal); font-size: .95rem; white-space: nowrap; }
.lebego-cimke.szint { left: -2%; top: 44%; transform: rotate(-6deg); animation: lebeg 3s ease-in-out infinite; }
.lebego-cimke.huhu { right: -2%; bottom: 3%; transform: rotate(4deg); background: #fff3c4; }
.jelenet-keret { position: relative; }

@media (max-width: 900px) {
  .nyito { padding-top: 34px; }
  .nyito .belso { grid-template-columns: 1fr; gap: 30px; }
  .jelenet-keret { max-width: 520px; margin: 0 auto 16px; width: 100%; }
  .lebego-cimke.szint { top: auto; bottom: -14px; left: 4%; font-size: .85rem; }
  .lebego-cimke.huhu { display: none; }
  .jelenet .sebzes { bottom: 50%; right: 6%; }
}

/* ---------- számok sávja ---------- */
.szamsav { padding: 18px 0 8px; }
.szamsav .belso { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.szam { text-align: center; background: var(--uveg); border: 1px solid var(--uvegvonal); border-radius: 18px; padding: 16px 8px; }
.szam b { display: block; font-size: clamp(1.6rem, 3.4vw, 2.3rem); font-weight: 900; color: #fff; }
.szam span { color: var(--halvany); font-size: .95rem; }
@media (max-width: 640px) { .szamsav .belso { grid-template-columns: repeat(2, 1fr); } }

/* ---------- szakaszok ---------- */
.szakasz { padding: 84px 0; position: relative; }
.szakasz.vilagos { background: linear-gradient(180deg, rgba(123, 95, 214, .1), rgba(123, 95, 214, .02)); border-top: 1px solid var(--uvegvonal); border-bottom: 1px solid var(--uvegvonal); }
.szakasz-fej { max-width: 760px; margin: 0 auto 44px; text-align: center; }
.szakasz-fej p { color: #d9d2ff; font-size: 1.12rem; }
.felcim { display: inline-block; text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; font-weight: 900; color: var(--arany); margin-bottom: 10px; }
.racs { display: grid; gap: 20px; }
.racs.harom { grid-template-columns: repeat(3, 1fr); }
.racs.ketto { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 900px) { .racs.harom, .racs.ketto { grid-template-columns: 1fr; } }
.lap { background: var(--uveg); border: 1px solid var(--uvegvonal); border-radius: 22px; padding: 24px; position: relative; }
.lap .ikon { width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; font-size: 1.8rem; background: rgba(255, 255, 255, .08); margin-bottom: 14px; }
.lap .ikon svg { width: 52px; height: 52px; }
.lap p:last-child { margin-bottom: 0; }
.lap .lepes { position: absolute; top: 18px; right: 20px; font-weight: 900; font-size: 2.6rem; color: rgba(255, 255, 255, .09); }
.lap ul { margin: 0; padding-left: 1.1em; color: #ddd6ff; }
.lap li { margin: .2em 0; }

/* tantárgyak */
.targy { border-radius: 22px; padding: 24px; border: 3px solid var(--vonal); color: var(--vonal); box-shadow: 0 6px 0 var(--vonal); }
.targy h3 { display: flex; align-items: center; gap: 10px; font-size: 1.35rem; }
.targy h3 span { font-size: 1.7rem; }
.targy p { color: #3a4060; }
.targy .temak { display: flex; flex-wrap: wrap; gap: 6px; }
.targy .temak span { background: rgba(255, 255, 255, .65); border: 2px solid rgba(29, 35, 64, .18); border-radius: 999px; padding: 2px 10px; font-size: .86rem; font-weight: 700; }
.targy.matek { background: linear-gradient(160deg, #fff3c4, #ffd451); }
.targy.magyar { background: linear-gradient(160deg, #e8e4ff, #c3b2ff); }
.targy.termeszet { background: linear-gradient(160deg, #dcf7e1, #9be3a8); }
.tananyag-pont { display: flex; gap: 14px; align-items: flex-start; margin: 18px 0; }
.tananyag-pont .pipa { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--zold); color: #fff; font-weight: 900; border: 2.5px solid var(--vonal); }
.tananyag-pont p { margin: 0; color: #ddd6ff; }
.tananyag-pont b { color: #fff; }

/* rangok sávja */
.rangsav { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; align-items: start; }
.rang { text-align: center; }
.rang .kep { height: 170px; display: flex; align-items: flex-end; justify-content: center; }
.rang .kep svg { height: 100%; width: auto; }
.rang b { display: block; margin-top: 6px; font-size: 1.02rem; }
.rang small { color: var(--halvany); }
@media (max-width: 760px) { .rangsav { grid-template-columns: repeat(3, 1fr); row-gap: 22px; } .rang .kep { height: 130px; } }

/* kihívások */
.kihivas-lap { display: flex; gap: 18px; align-items: center; }
.kihivas-lap .nagyikon { flex: none; width: 92px; height: 92px; border-radius: 22px; background: rgba(255, 255, 255, .08); display: grid; place-items: center; }
.kihivas-lap .nagyikon svg { width: 76px; height: 76px; }
@media (max-width: 520px) { .kihivas-lap { flex-direction: column; text-align: center; } }

/* szülőknek: levélminta */
.szulo-racs { display: grid; grid-template-columns: 1fr 1.05fr; gap: 40px; align-items: center; }
@media (max-width: 900px) { .szulo-racs { grid-template-columns: 1fr; } }
.levelminta { background: var(--papir); color: var(--vonal); border-radius: 22px; padding: 22px; border: 3px solid var(--vonal); box-shadow: 0 8px 0 var(--vonal), 0 30px 60px rgba(0, 0, 0, .35); transform: rotate(-1.2deg); }
.levelminta.feltunik.lathato { transform: rotate(-1.2deg); }
.levelminta .lfej { display: flex; justify-content: space-between; gap: 10px; font-size: .85rem; color: #5a6075; border-bottom: 2px dashed #ece4d3; padding-bottom: 10px; margin-bottom: 14px; }
.levelminta h4 { margin: 0 0 2px; font-size: 1.25rem; }
.levelminta .lszamok { display: grid; grid-template-columns: repeat(4, 1fr); background: #f4eee0; border-radius: 12px; margin: 12px 0; text-align: center; padding: 8px 0; }
.levelminta .lszamok b { display: block; font-size: 1.4rem; }
.levelminta .lszamok span { font-size: .78rem; color: #5a6075; }
.levelminta .sor { margin: 6px 0; font-size: .95rem; }
.jelvenyke { display: inline-block; color: #fff; border-radius: 8px; padding: 0 7px; font-size: .78rem; font-weight: 800; }
.jelvenyke.zold { background: #2f9d57; } .jelvenyke.piros { background: #d9534f; }
.pont-lista { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.pont-lista li { display: flex; gap: 14px; }
.pont-lista .p-ikon { flex: none; width: 44px; height: 44px; border-radius: 14px; background: rgba(255, 255, 255, .08); display: grid; place-items: center; font-size: 1.35rem; }
.pont-lista b { color: #fff; display: block; }
.pont-lista span { color: #d0c8f5; }

/* árak */
.arak { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; max-width: 1040px; margin: 0 auto; }
@media (max-width: 900px) { .arak { grid-template-columns: 1fr; max-width: 460px; } }
.ar { background: var(--uveg); border: 1px solid var(--uvegvonal); border-radius: 24px; padding: 26px 24px; display: flex; flex-direction: column; position: relative; }
.ar.kiemelt { background: linear-gradient(170deg, rgba(255, 184, 0, .16), rgba(176, 102, 255, .12)); border: 2px solid var(--arany); box-shadow: 0 0 60px rgba(255, 184, 0, .15); }
.ar .szalag { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); background: var(--arany); color: var(--vonal); font-weight: 900; font-size: .82rem; padding: 4px 14px; border-radius: 999px; border: 2.5px solid var(--vonal); white-space: nowrap; }
.ar h3 { font-size: 1.3rem; margin-bottom: 2px; }
.ar .leiras { color: var(--halvany); font-size: .95rem; min-height: 1.5em; }
.ar .osszeg { font-size: 2.6rem; font-weight: 900; margin: 10px 0 0; color: #fff; }
.ar .osszeg small { font-size: 1rem; color: var(--halvany); font-weight: 700; }
.ar .havonta { color: #ffe27a; font-weight: 800; font-size: .95rem; min-height: 1.5em; margin-bottom: 14px; }
.ar ul { list-style: none; padding: 0; margin: 0 0 22px; display: grid; gap: 8px; color: #e4defd; font-size: .97rem; }
.ar li::before { content: '✓'; color: var(--zold); font-weight: 900; margin-right: 8px; }
.ar .gomb { margin-top: auto; }
.ar-labjegy { text-align: center; margin-top: 26px; color: var(--halvany); font-size: .95rem; }

/* GYIK */
.gyik { max-width: 820px; margin: 0 auto; display: grid; gap: 12px; }
.gyik details { background: var(--uveg); border: 1px solid var(--uvegvonal); border-radius: 18px; padding: 4px 20px; }
.gyik summary { cursor: pointer; font-weight: 800; padding: 14px 0; list-style: none; display: flex; justify-content: space-between; gap: 14px; }
.gyik summary::-webkit-details-marker { display: none; }
.gyik summary::after { content: '+'; font-size: 1.4rem; line-height: 1; color: var(--arany); transition: transform .2s; }
.gyik details[open] summary::after { transform: rotate(45deg); }
.gyik details p { color: #d9d2ff; margin: 0 0 16px; }

/* záró felhívás */
.zaro { text-align: center; padding: 90px 0; }
.zaro .hosok { display: flex; justify-content: center; gap: 4px; margin-bottom: 18px; }
.zaro .hosok svg { width: 120px; height: 140px; }
@media (max-width: 520px) { .zaro .hosok svg { width: 92px; height: 110px; } }

/* lábléc */
.lablec { border-top: 1px solid var(--uvegvonal); padding: 34px 0 44px; color: var(--halvany); font-size: .92rem; }
.lablec .belso { display: flex; flex-wrap: wrap; gap: 14px 26px; align-items: center; justify-content: space-between; }
.lablec nav { display: flex; flex-wrap: wrap; gap: 18px; }
.lablec a { color: var(--halvany); text-decoration: none; }
.lablec a:hover { color: #fff; }

/* ---------- űrlapok (belépés, fiók) ---------- */
.egyszeru { min-height: 100vh; }
.kozep { max-width: 460px; margin: 0 auto; padding: 46px 18px 70px; }
.kozep.szeles { max-width: 860px; }
.doboz { background: var(--papir); color: var(--vonal); border: 3px solid var(--vonal); border-radius: 24px; box-shadow: 0 8px 0 var(--vonal); padding: 26px 24px; }
.doboz + .doboz { margin-top: 22px; }
.doboz h1 { font-size: 1.8rem; }
.doboz h2 { font-size: 1.35rem; }
.doboz .halvany, .doboz .halvany a { color: #5a6075; }
.doboz a { color: #6a4fd0; }
.fulek { display: grid; grid-template-columns: 1fr 1fr; background: #ece4d3; border-radius: 14px; padding: 4px; margin-bottom: 20px; }
.fulek button { font: inherit; font-weight: 900; border: 0; background: transparent; padding: 10px; border-radius: 11px; cursor: pointer; color: #5a6075; }
.fulek button.aktiv { background: #fff; color: var(--vonal); box-shadow: 0 2px 0 rgba(29, 35, 64, .25); }
.mezo { display: block; margin-bottom: 14px; }
.mezo span { display: block; font-weight: 800; font-size: .92rem; margin-bottom: 5px; }
.mezo input { width: 100%; font: inherit; font-size: 1.05rem; padding: 12px 14px; border: 2.5px solid #cfc6b3; border-radius: 12px; background: #fff; color: var(--vonal); }
.mezo input:focus { outline: none; border-color: var(--lila); box-shadow: 0 0 0 4px rgba(123, 95, 214, .18); }
.jelolo { display: flex; gap: 10px; align-items: flex-start; font-size: .92rem; margin: 6px 0 16px; }
.jelolo input { width: 20px; height: 20px; flex: none; margin-top: 2px; accent-color: var(--lila); }
.elvalaszto { display: flex; align-items: center; gap: 12px; color: #8a8fa3; font-size: .9rem; margin: 18px 0; }
.elvalaszto::before, .elvalaszto::after { content: ''; flex: 1; height: 2px; background: #ece4d3; }
.google { width: 100%; background: #fff; }
.google svg { width: 20px; height: 20px; }
.uzenet { border-radius: 12px; padding: 10px 14px; margin-bottom: 14px; font-weight: 700; font-size: .95rem; }
.uzenet.hiba { background: #ffe1e1; color: #8a1c1c; }
.uzenet.ok { background: #dcf7e1; color: #1f5f33; }
.uzenet.info { background: #e8e4ff; color: #3b2f86; }
.link-gomb { background: none; border: 0; font: inherit; color: #6a4fd0; text-decoration: underline; cursor: pointer; padding: 0; }
.kozep .logo { justify-content: center; margin-bottom: 24px; }

/* fiók */
.fiok-fej { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; flex-wrap: wrap; }
.fiok-fej .logo { margin: 0; }
.fiok-fej .gombsor { margin: 0 0 0 auto; }
.allapot-sav { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.allapot-sav .nagy { font-size: 1.5rem; font-weight: 900; }
.mini-arak { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 16px; }
@media (max-width: 640px) { .mini-arak { grid-template-columns: 1fr; } }
.mini-ar { border: 2.5px solid #e2d9c4; border-radius: 16px; padding: 14px; display: flex; flex-direction: column; gap: 4px; background: #fff; }
.mini-ar.kiemelt { border-color: var(--arany); background: #fff8e1; }
.mini-ar b { font-size: 1.1rem; }
.mini-ar .osszeg { font-size: 1.6rem; font-weight: 900; }
.mini-ar small { color: #5a6075; }
.mini-ar .gomb { margin-top: 8px; }
.gyerek-lista { display: grid; gap: 12px; }
.gyerek { display: flex; gap: 14px; align-items: center; border: 2.5px solid #ece4d3; border-radius: 16px; padding: 10px 14px; background: #fff; }
.gyerek .kep { width: 64px; height: 72px; flex: none; }
.gyerek .kep svg { width: 100%; height: 100%; }
.gyerek .adat { flex: 1; min-width: 0; }
.gyerek .adat b { font-size: 1.1rem; }
.gyerek .adat small { display: block; color: #5a6075; }
.gyerek .heti { display: flex; gap: 14px; text-align: center; }
.gyerek .heti span { font-size: .78rem; color: #5a6075; }
.gyerek .heti b { display: block; font-size: 1.15rem; }
@media (max-width: 560px) { .gyerek { flex-wrap: wrap; } .gyerek .heti { width: 100%; justify-content: space-around; } }
.kapcsolo-sor { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.kapcsolo { position: relative; width: 56px; height: 32px; flex: none; }
.kapcsolo input { opacity: 0; width: 0; height: 0; }
.kapcsolo i { position: absolute; inset: 0; background: #cfc6b3; border-radius: 999px; transition: .2s; cursor: pointer; border: 2.5px solid var(--vonal); }
.kapcsolo i::before { content: ''; position: absolute; width: 22px; height: 22px; left: 2px; top: 2px; background: #fff; border-radius: 50%; transition: .2s; border: 2px solid var(--vonal); }
.kapcsolo input:checked + i { background: var(--zold); }
.kapcsolo input:checked + i::before { transform: translateX(24px); }
.veszely-zona { border-color: #e3a3a3; }

/* mester oldal: tesztelők */
.mester-urlap { display: grid; grid-template-columns: 2fr 1fr 2fr auto; gap: 12px; align-items: end; }
.mester-urlap .mezo { margin: 0; }
.mester-szuro { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.mester-szuro .mezo { flex: 1; min-width: 220px; margin: 0; }
.mester-szuro label.pipa-mezo { display: flex; gap: 8px; align-items: center; font-weight: 700; cursor: pointer; }
.mester-lista { display: grid; gap: 10px; }
.mester-sor { display: flex; gap: 14px; align-items: center; border: 2.5px solid #ece4d3; border-radius: 16px; padding: 10px 14px; background: #fff; }
.mester-sor.tesztelo { border-color: #b9a6f5; background: #f7f4ff; }
.mester-sor .adat { flex: 1; min-width: 0; }
.mester-sor .adat b { overflow-wrap: anywhere; }
.mester-sor .adat small { display: block; color: #5a6075; }
.mester-sor .gombok { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.allapot-cimke { display: inline-block; border-radius: 999px; padding: 1px 10px; font-size: .8rem; font-weight: 800; margin-left: 6px; vertical-align: 2px; background: #ece4d3; color: var(--vonal); }
.allapot-cimke.tesztelo { background: #7b5fd6; color: #fff; }
.allapot-cimke.elofizeto { background: #2f9d57; color: #fff; }
.allapot-cimke.proba { background: #ffd56b; }
@media (max-width: 700px) {
  .mester-urlap { grid-template-columns: 1fr; }
  .mester-sor { flex-direction: column; align-items: stretch; }
  .mester-sor .gombok { justify-content: flex-start; }
}

/* jogi oldalak */
.jogi { max-width: 820px; margin: 0 auto; padding: 40px 22px 80px; }
.jogi h1 { font-size: 2.2rem; }
.jogi h2 { font-size: 1.3rem; margin-top: 1.6em; }
.jogi p, .jogi li { color: #ddd6ff; }
.minta-jelzes { background: #fff3c4; color: var(--vonal); border: 3px solid var(--vonal); border-radius: 16px; padding: 12px 16px; font-weight: 700; margin: 0 0 24px; }

/* megjelenés görgetéskor */
.feltunik { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.feltunik.lathato { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .feltunik { opacity: 1; transform: none; }
}