/* =====================================================================
   B VÁLTOZAT – letisztultabb, Netflixesebb réteg (Bene, 2026-10-05).
   Csak az index-b.html tölti be (html.tema-b). Az A változat érintetlen.
   Elv: kevesebb díszítés, kisebb és nyugodtabb címek, egy akcentus (piros),
   Netflix-szerű gombok, csempék, lenyílók és szakaszhatárok.
   ===================================================================== */
.tema-b {
  --bg: #141414;
  --bg2: #1c1c1c;
  --bg3: #262626;
  --vonal: #2f2f2f;
  --szoveg: #ffffff;
  --halvany: #b3b3b3;
  --font-cim: "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --font-szoveg: "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
}
.tema-b body { background: var(--bg); }

/* --- Tipográfia: nincs csupa nagybetű, nyugodtabb méretek, a címek fehérek --- */
.tema-b .cim-nagy { text-transform: none; font-weight: 800; letter-spacing: -0.025em; line-height: 1.02; font-size: clamp(34px, 9vw, 78px); }
.tema-b .cim-szakasz { text-transform: none; font-weight: 700; letter-spacing: -0.015em; line-height: 1.12; font-size: clamp(26px, 6.4vw, 44px); }
.tema-b .cim-szakasz em { color: inherit; }
.tema-b .bevezeto { color: #d2d2d2; }
/* „N SOROZAT”-szerű címke: kis piros jel + ritkított felirat */
.tema-b .cimke { font-weight: 700; font-size: 11px; letter-spacing: .22em; color: #b3b3b3; }
.tema-b .cimke::before { width: 5px; height: 14px; border-radius: 1px; background: var(--piros); }

/* --- Gombok: Netflix-forma (4 px-es sarok, nincs ragyogás) --- */
.tema-b .gomb { border-radius: 4px; font-weight: 700; }
.tema-b .gomb-fo { box-shadow: none; }
.tema-b .gomb-masod { background: rgba(109, 109, 110, .7); border-color: transparent; }
.tema-b .gomb-masod:hover { background: rgba(109, 109, 110, .5); }

/* --- Szakaszhatárok: a Netflix nyitóoldalán megszokott vastag, sötétszürke elválasztó --- */
.tema-b .szakasz + .szakasz, .tema-b .szakasz + footer { border-top: 8px solid #232323; }

/* ---------------- FEJLÉC ---------------- */
.tema-b .fej { background: linear-gradient(to bottom, rgba(0, 0, 0, .72), rgba(0, 0, 0, 0)); }
.tema-b .fej.hatter { background: rgba(20, 20, 20, .97); }
.tema-b .fej-logo { color: var(--piros); font-weight: 900; font-size: 19px; letter-spacing: -.01em; }
.tema-b .fej-logo i { display: none; }
.tema-b .fej-mozgas { background: transparent; border-color: transparent; width: 34px; height: 34px; opacity: .75; }
.b-nav { display: none; }
@media (min-width: 900px) {
  .tema-b .fej { justify-content: flex-start; gap: 28px; }
  .tema-b .fej-jobb { margin-left: auto; }
  .b-nav { display: flex; gap: 20px; }
  .b-nav a { font: 500 14px/1 var(--font-szoveg); color: #e5e5e5; text-decoration: none; transition: color .2s; }
  .b-nav a:hover { color: #b3b3b3; }
}

/* ---------------- NYITÓKÉP ---------------- */
.tema-b .ny-sugo { display: none; }
.tema-b .ny-ki { display: inline-flex; align-items: center; gap: 8px; letter-spacing: .2em; font-size: 11px; color: #e5e5e5; }
.tema-b .ny-cim em { color: var(--piros); }
.tema-b .ny-lap { border-radius: 6px; border: 0; box-shadow: 0 24px 50px -14px rgba(0, 0, 0, .9); }
.tema-b .ny-lap.elol { box-shadow: 0 30px 70px -12px rgba(0, 0, 0, .95); }
.tema-b .ny-lap-cimke { left: 34px; top: 12px; background: none; padding: 0; font-size: 10px; letter-spacing: .16em; text-shadow: 0 1px 8px rgba(0, 0, 0, .85); }
.tema-b .ny-lap.elol::before { display: none; }
.tema-b .ny-lap::before { display: none; }
/* „TOP 10”-szerű jelvény a főcím alatt – csak valós adattal (5 év főállásban) */
.b-rang { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font: 700 15px/1.2 var(--font-szoveg); color: #fff; }
.b-rang b { display: grid; place-items: center; width: 30px; height: 34px; background: var(--piros); border-radius: 2px; font: 900 13px/0.9 var(--font-cim); text-align: center; color: #fff; }
.b-rang b small { display: block; font-size: 7px; letter-spacing: .08em; font-weight: 800; }
.tema-b .ny-al { color: #e5e5e5; font-size: clamp(15px, 4vw, 18px); }
.tema-b .ny-biza { color: #9a9a9a; }
.tema-b .ny-logosav-sor span { color: rgba(255, 255, 255, .34); font-weight: 700; }
/* Netflix-jel a csempék sarkában (a márka monogramja) */
.b-jel { position: absolute; z-index: 3; left: 8px; top: 8px; width: 18px; height: 22px; border-radius: 2px; background: var(--piros);
  display: grid; place-items: center; font: 900 9px/0.9 var(--font-cim); color: #fff; text-align: center; letter-spacing: -.02em; pointer-events: none; }

/* ---------------- IDŐVONAL ---------------- */
.tema-b .iv-monitor, .tema-b .iv-idovonal, .tema-b [class*="iv-sav"] { border-radius: 4px; }
.tema-b .iv-monitor-fej { opacity: .7; }

/* ---------------- VSL ---------------- */
.tema-b .vsl-lejatszo, .tema-b .vsl-media { border-radius: 6px; }
.tema-b .vsl-indit { box-shadow: none; }

/* ---------------- MUNKÁK: Netflix-csempék ---------------- */
.tema-b .mk-chip { border-radius: 4px; background: transparent; border: 1px solid rgba(255, 255, 255, .28); }
.tema-b .mk-kartya, .tema-b .mk-elol, .tema-b .mk-hatul, .tema-b .mk-media { border-radius: 6px; }
.tema-b .mk-elol, .tema-b .mk-hatul { border: 0; }
.tema-b .mk-fordit-jel { opacity: .6; }
.tema-b .mk-formatum { color: #b3b3b3; }
@media (hover: hover) {
  .tema-b .mk-elem { transition: transform .35s var(--be); }
  .tema-b .mk-elem:hover { transform: scale(1.04); z-index: 2; }
}

/* ---------------- LENYÍLÓK (szolgáltatások, GYIK): a Netflix GYIK-dobozai ---------------- */
.tema-b .lenyilo { background: #2d2d2d; border: 0; border-radius: 4px; }
.tema-b .lenyilo + .lenyilo { margin-top: 8px; }
.tema-b .lenyilo-fej { padding: 20px 22px; }
.tema-b .lenyilo-fej .jel { background: none; width: 30px; height: 30px; }
.tema-b .lenyilo-fej .jel::before { font-size: 30px; font-weight: 300; }
.tema-b .lenyilo:hover { background: #3a3a3a; }
.tema-b .lenyilo-tartalom { border-top: 1px solid #141414; padding-top: 18px; }

/* ---------------- AJÁNLAT: Netflix-szerű mezők ---------------- */
.tema-b .aj-doboz { border-radius: 6px; border: 0; background: rgba(28, 28, 28, .9); }
.tema-b .aj-bemenet, .tema-b #ajanlat input[type="text"], .tema-b #ajanlat input[type="email"], .tema-b #ajanlat input[type="tel"], .tema-b #ajanlat textarea {
  background: rgba(22, 22, 22, .7); border: 1px solid rgba(128, 128, 128, .7); border-radius: 4px; }
.tema-b .aj-chip { border-radius: 4px; }
.tema-b .aj-gyors > * { border-radius: 6px; }

/* ---------------- RAGADÓS SÁV ---------------- */
.tema-b .ra-fo { border-radius: 4px; box-shadow: none; }
.tema-b .ra-hivas { border-radius: 4px; }
.tema-b .ra-csik { height: 2px; }

/* ---------------- LÁBLÉC: szürke, nyugodt ---------------- */
.tema-b .lab { color: #808080; }

/* --- apró igazítások (képes ellenőrzés után) --- */
.tema-b .cim-szakasz { text-wrap: balance; }
.tema-b .iv-info-nev { text-transform: none; letter-spacing: -.01em; }
.tema-b .mk-chip[aria-pressed="true"] { background: #fff; border-color: #fff; color: #000; }
.tema-b .lab-logo { color: var(--piros); font-weight: 900; }
.tema-b .lab-logo i { display: none; }