:root{
  --bg:#ffffff; --text:#333333; --muted:#666666; --line:#e2e2e2;
  --bar:#4b4b49; --active:#b3b3b3; --accent:#3d7fc1; --red:#8b1a1a;
  --side:#ffffff; --soft:#f4f4f4;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#1b1b1b; --text:#e4e4e4; --muted:#a8a8a8; --line:#333; --bar:#3a3a38; --active:#555;
  --accent:#6aa6e0; --red:#e07070; --side:#222; --soft:#2a2a2a; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#1b1b1b; --text:#e4e4e4; --muted:#a8a8a8; --line:#333; --bar:#3a3a38; --active:#555;
  --accent:#6aa6e0; --red:#e07070; --side:#222; --soft:#2a2a2a; color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;font-size:16px;line-height:1.65}
a{color:var(--accent)}
img{max-width:100%;height:auto}

/* ---- elrendezés: bal oldali sáv + tartalom ---- */
.oldal{display:grid;grid-template-columns:290px minmax(0,1fr);min-height:100vh}
.bal{background:var(--side);border-right:1px solid var(--line);position:sticky;top:0;height:100vh;overflow-y:auto;align-self:start}

.menu ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.menu li{border-bottom:1px solid var(--line)}
.menu a{display:block;padding:11px 26px 11px 32px;font-size:13px;text-transform:uppercase;color:var(--text);text-decoration:none;letter-spacing:.2px}
.menu a:hover{background:var(--soft)}
.menu a.aktiv{background:var(--active);color:#fff;box-shadow:inset -8px 0 0 var(--accent)}
.menu a.ujdonsag{display:inline-block;margin:0 0 0 32px;padding:8px 26px;background:linear-gradient(#8cc4ef,#5d9fd8);color:#16306b;font-weight:700;letter-spacing:4px;border-radius:2px}
.menu a.ujdonsag.aktiv{box-shadow:inset 0 -3px 0 #16306b}
.menu li.ujdonsag-sor{padding:3px 0}
.menu a.piros{color:var(--red);font-weight:700}
.menu a.english::before{content:"";display:inline-block;width:14px;height:10px;margin-right:6px;vertical-align:-1px;
  background:linear-gradient(90deg,transparent 42%,#c8102e 42% 58%,transparent 58%),linear-gradient(transparent 38%,#c8102e 38% 62%,transparent 62%),linear-gradient(90deg,transparent 36%,#fff 36% 64%,transparent 64%),linear-gradient(transparent 30%,#fff 30% 70%,transparent 70%),#012169}
.menu a.english,.menu a.magyar{text-transform:none}
.menu a.magyar::before{content:"";display:inline-block;width:14px;height:10px;margin-right:6px;vertical-align:-1px;background:linear-gradient(#ce2939 33.3%,#fff 33.3% 66.6%,#477050 66.6%)}

.elerhetoseg{padding:40px 32px 30px;font-size:15px;line-height:1.5}
.elerhetoseg h3{margin:0 0 16px;font-size:15px;text-transform:uppercase;letter-spacing:.3px}
.elerhetoseg p{margin:0 0 12px;display:flex;gap:8px;align-items:flex-start}
.elerhetoseg a{color:var(--text);text-decoration:none}
.elerhetoseg a:hover{color:var(--accent)}
.ikon{flex:none;width:15px;height:15px;margin-top:2px;fill:currentColor}

.jobb{min-width:0;display:flex;flex-direction:column}
/* fejléc: a logó szürke sávja (26–76. képpontsor, #4F504C) folytatódik a teljes szélességen */
.fejlec{position:relative;background:#fff;height:138px;border-bottom:1px solid var(--line)}
.fejlec .logo{position:absolute;left:30px;top:20px;display:block;padding:0;line-height:0;z-index:2}
.fejlec .logo img{display:block;width:287px;height:98px;max-width:none}
.fejlec .sav{position:absolute;left:315px;right:0;top:46px;height:50px;background:#4f504c;color:#fff;display:flex;align-items:center;justify-content:center;padding:0 20px;z-index:1}
.fejlec .sav h1{margin:0;font-size:19px;font-weight:400;text-transform:uppercase;letter-spacing:.3px;text-align:center;line-height:1.2}
.mobil-cim{display:none}


/* ---- csúszó képsor ---- */
.slider{position:relative;overflow:hidden;background:#222;aspect-ratio:4/1}
.slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
.slider img.lathato{opacity:1}
.slider .pottyok{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:8px}
.slider .pottyok button{width:11px;height:11px;border-radius:50%;border:1px solid #fff;background:rgba(255,255,255,.35);padding:0;cursor:pointer}
.slider .pottyok button.aktiv{background:#fff}
.slider .nyil{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.35);color:#fff;border:0;width:40px;height:56px;font-size:26px;cursor:pointer}
.slider .nyil:hover{background:rgba(0,0,0,.6)}
.slider .bal-nyil{left:0}.slider .jobb-nyil{right:0}
@media (prefers-reduced-motion:reduce){.slider img{transition:none}}

/* ---- tartalom ---- */
.tartalom{max-width:1100px;width:100%;margin:0 auto;padding:30px 40px 60px}
.tartalom h2{font-size:20px;line-height:1.35;margin:30px 0 10px}
.tartalom h3{font-size:17px;margin:24px 0 8px}
.tartalom p{margin:0 0 16px}
.tartalom ul{margin:0 0 16px;padding-left:22px}
.alcim{font-weight:700;color:var(--muted);margin-bottom:20px!important}
.idezet{text-align:center;font-weight:700;margin:0 0 26px}
.kiemel{font-weight:700}

.kepek{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin:10px 0 24px}
figure{margin:0}
figure img{display:block;width:100%}
figcaption{font-size:14px;color:var(--muted);line-height:1.45;margin-top:6px}
figure.hianyzik img{display:none}
figure.hianyzik::before{content:attr(data-fajl);display:flex;align-items:flex-end;aspect-ratio:4/3;padding:10px;font:12px/1.3 Consolas,monospace;color:var(--muted);word-break:break-all;background:repeating-linear-gradient(135deg,var(--soft) 0 10px,var(--bg) 10px 20px);border:1px dashed var(--line)}

.csomag{border:1px solid var(--line);padding:18px 22px;margin:0 0 18px}
.csomag h2{margin-top:0}
.ar{font-weight:700;font-size:18px;margin:4px 0 0!important}

.lista{list-style:none!important;padding:0!important;border-top:1px solid var(--line)}
.lista li{border-bottom:1px solid var(--line);padding:10px 0}
.lista small{display:block;color:var(--muted);font-size:14px}

/* videók: 2 oszlop, mint a régi oldalon */
.videok{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 44px;margin:0 0 30px}
@media (max-width:700px){.videok{grid-template-columns:minmax(0,1fr)}}
.yt{position:relative;display:block;aspect-ratio:16/9;background:#111 center/cover no-repeat;color:#fff;text-decoration:none;overflow:hidden;cursor:pointer;border:0;padding:0;width:100%;font:inherit;text-align:left}
.yt::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.65),rgba(0,0,0,0) 35%)}
.yt .cim{position:absolute;left:16px;right:16px;top:12px;font-weight:700;font-size:17px;line-height:1.3}
.yt .cim small{display:block;font-weight:400;font-size:13px;opacity:.85}
.yt .lejatszas{position:absolute;left:50%;top:50%;width:68px;height:48px;transform:translate(-50%,-50%);background:#f00;border-radius:12px}
.yt .lejatszas::after{content:"";position:absolute;left:27px;top:14px;border-left:18px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.cikkek{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:24px;margin:0 0 30px}
.cikk{display:flex;flex-direction:column;gap:6px;color:var(--text);text-decoration:none}
.cikk figure img{aspect-ratio:4/3;object-fit:cover;border:1px solid var(--line)}
.cikk b{line-height:1.35}.cikk:hover b{color:var(--accent)}
.cikk small{color:var(--muted);font-size:14px}
.poszterek{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px}
.poszterek a{text-decoration:none;color:var(--text)}
.poszterek h2{font-size:16px;margin:10px 0 6px}
.poszterek p{font-size:14px;color:var(--muted)}

.lablec{margin-top:auto;border-top:1px solid var(--line);padding:18px 40px;font-size:13px;color:var(--muted);text-align:center}
.lablec a{color:var(--muted)}

/* ---- mobil ---- */
.menu-gomb,.menu-cimke{display:none}
@media (max-width:900px){
  .oldal{grid-template-columns:minmax(0,1fr)}
  .bal{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line)}
  .fejlec{height:112px}
  .fejlec .logo{left:12px;top:7px}
  .fejlec .sav{left:297px;top:33px}
  .fejlec .sav h1{display:none}
  .mobil-cim{display:block;font-size:22px;text-transform:uppercase;margin:0 0 16px}
  .menu-cimke{display:block;margin:0;padding:8px 12px;border:1px solid var(--line);font-weight:700;font-size:14px;cursor:pointer;text-transform:uppercase}
  .bal{position:relative}
  .menu ul{display:none}
  .menu-gomb:checked ~ ul{display:block}
  .menu a{padding:11px 16px;font-size:15px}
  .menu a.ujdonsag{margin-left:16px}
  .elerhetoseg{display:none}
  .tartalom{padding:24px 16px 40px}
}
a:focus-visible,button:focus-visible,label:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
