/* HR MAGAZIN — címlap arculat.
 * Szín: sötét tengerészkék sávok (#0E1E3A), kiemelő kék az oldal saját kékje
 * (#2563d9, --anchor-blue), törtfehér háttér (#F7F5F0). Cím: Newsreader (talpas),
 * felület: IBM Plex Sans. Vékony vonalas rovatelválasztók, emoji nélkül.
 * Mobilon minden érintési felület >= 44px. */

:root{
  --navy:#0E1E3A;
  --navy-2:#132747;
  --blue:#2563d9;
  --blue-dark:#1e4fbf;
  --cream:#F7F5F0;
  --paper:#ffffff;
  --ink:#16233a;
  --muted:#5b6675;
  --line:rgba(14,30,58,.14);
  --line-strong:rgba(14,30,58,.28);
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.hrmag{
  margin:0;background:var(--cream);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.hrmag a{color:var(--blue);text-decoration:none}
.hrmag a:hover{color:var(--blue-dark)}
.hrmag img{max-width:100%;display:block}
.hm-wrap{max-width:1200px;margin:0 auto;padding:0 20px}

/* ---- Fejléc ---- */
.hm-header{background:var(--navy);color:#fff}
.hm-header-inner{
  max-width:1200px;margin:0 auto;padding:16px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.hm-brand{display:flex;align-items:baseline;gap:12px;min-height:44px;color:#fff}
.hm-brand .hm-logo{font-family:var(--serif);font-weight:600;font-size:26px;letter-spacing:.3px;color:#fff;line-height:1.1}
.hm-brand .hm-kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#9fb3d6}
.hm-header-nav{display:flex;align-items:center;gap:6px}
.hm-header-nav a{
  color:#dbe4f2;padding:10px 12px;border-radius:8px;font-size:15px;
  display:inline-flex;align-items:center;min-height:44px;
}
.hm-header-nav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.hm-cta-btn{
  background:var(--blue);color:#fff;font-weight:600;
  padding:11px 18px;border-radius:10px;min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;
}
.hm-cta-btn:hover{background:var(--blue-dark);color:#fff}

/* ---- Rovatsáv ---- */
.hm-rovatsav{background:var(--paper);border-bottom:1px solid var(--line)}
.hm-rovatsav-inner{
  max-width:1200px;margin:0 auto;padding:0 20px;
  display:flex;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch;
}
.hm-rovatsav a{
  color:var(--navy);font-weight:500;font-size:14.5px;white-space:nowrap;
  padding:14px 14px;min-height:44px;display:inline-flex;align-items:center;
  border-bottom:2px solid transparent;
}
.hm-rovatsav a:hover{color:var(--blue);border-bottom-color:var(--blue)}
/* Aktív rovat: legyen egyértelmű, MELYIK rovatban vagy (félkövér + kék + kitöltött
   pill-háttér + vastagabb kék aláhúzás). */
.hm-rovatsav a.is-active{color:var(--blue);font-weight:600;background:rgba(37,99,217,.10);border-bottom:3px solid var(--blue);border-radius:8px 8px 0 0}

/* ---- Címlap-masthead: EGY h1 az oldalnak (SEO + címhierarchia) ---- */
.hm-masthead{padding:28px 0 4px}
.hm-masthead-title{font-family:var(--serif);font-weight:600;font-size:36px;line-height:1.08;color:var(--navy);margin:0}
.hm-masthead-sub{font-size:16px;line-height:1.5;color:var(--muted);margin:10px 0 0;max-width:680px}
@media (max-width:760px){
  .hm-masthead{padding:22px 0 2px}
  .hm-masthead-title{font-size:28px}
  .hm-masthead-sub{font-size:15px}
}

/* ---- Morzsamenü (rovatoldal) ---- */
.hm-crumb{font-size:13px;color:var(--muted);margin:0 0 14px}
.hm-crumb a{color:var(--blue)}
.hm-crumb span{color:var(--navy)}

/* ---- Szekció-fejléc ---- */
.hm-section{padding:38px 0}
.hm-section + .hm-section{border-top:1px solid var(--line)}
.hm-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 22px}
.hm-section-title{
  font-family:var(--serif);font-weight:600;font-size:26px;color:var(--navy);margin:0;
  position:relative;padding-bottom:10px;
}
.hm-section-title::after{content:"";position:absolute;left:0;bottom:0;width:52px;height:2px;background:var(--blue)}
.hm-section-more{font-size:14px;color:var(--muted)}

/* ---- Hero (vezércikk 3/4 + 2 kiemelt oszlop 1/4) — Gábor 2026-09-24: 3/4–1/4 arány ---- */
.hm-hero{display:grid;grid-template-columns:3fr 1fr;gap:28px;align-items:start}
.hm-lead{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.hm-lead-fig{aspect-ratio:1200/628;overflow:hidden;background:#e9edf3}
.hm-lead-fig img{width:100%;height:100%;object-fit:cover}
.hm-lead-body{padding:22px 24px 26px}
.hm-rovat-cimke{
  display:inline-block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue);font-weight:600;margin-bottom:10px;
}
.hm-lead-title{font-family:var(--serif);font-weight:600;font-size:32px;line-height:1.18;color:var(--navy);margin:0}
.hm-lead a,.hm-side a,.hm-card a{color:inherit;display:block}
.hm-lead a:hover .hm-lead-title{color:var(--blue)}

/* Kiemeltek: nagy (kb. 3×) kép a kártya teljes szélességében, 1200×628 arány, cím alatta */
.hm-side{display:flex;flex-direction:column;gap:26px}
.hm-side-item{display:flex;flex-direction:column;gap:10px;padding:0}
.hm-side-item:not(:last-child){border-bottom:1px solid var(--line);padding-bottom:26px}
.hm-side-link{display:block}
.hm-side-fig{width:100%;aspect-ratio:1200/628;border-radius:10px;overflow:hidden;background:#e9edf3;margin-bottom:12px}
.hm-side-fig img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.hm-side a:hover .hm-side-fig img{transform:scale(1.03)}
.hm-side-title{font-family:var(--serif);font-weight:600;font-size:21px;line-height:1.26;color:var(--navy);margin:2px 0 0}
.hm-side a:hover .hm-side-title{color:var(--blue)}

/* ---- Hangos cikkek (sötét sáv) ---- */
.hm-hangos{background:var(--navy);color:#fff}
.hm-hangos .hm-section-title{color:#fff}
.hm-hangos .hm-section-title::after{background:var(--blue)}
/* Gábor 2026-09-25 (2): „Hallgasd meg útközben" = EGY vízszintes, lapozható sor.
   A track saját overflow-x-e görget (nincs LAP-szintű vízszintes görgetés); a kártyák
   fix szélesek → nem törnek több sorba 1280-on és 375-ön sem. */
.hm-carousel{position:relative;display:flex;align-items:stretch;gap:8px}
.hm-carousel-track{display:flex;gap:20px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;flex:1 1 auto;min-width:0;padding:4px 2px 14px}
.hm-carousel-track::-webkit-scrollbar{height:8px}
.hm-carousel-track::-webkit-scrollbar-thumb{background:rgba(255,255,255,.28);border-radius:8px}
.hm-carousel-track:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:8px}
.hm-carousel .hm-hangos-item{flex:0 0 300px;max-width:82vw;scroll-snap-align:start}
.hm-carousel-nav{flex:0 0 auto;align-self:center;width:44px;height:44px;min-width:44px;border-radius:50%;border:1px solid var(--blue);background:#2a3a53;color:#eef3fc;font-size:22px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.hm-carousel-nav:hover{background:#3a4f72;color:#fff}
.hm-carousel-nav[disabled]{opacity:.35;cursor:default}
.hm-carousel-nav[hidden]{display:none}
.hm-hangos-item{background:var(--navy-2);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:10px}
.hm-hangos-item .hm-side-title{color:#fff}
.hm-hangos-play{display:inline-flex;align-items:center;gap:8px;color:#9fb3d6;font-size:13px;margin-top:8px}
/* Gábor 2026-09-25 (1): kék hátterű blokkban a gomb ALAP állapota a korábbi hover-kép
   (kék keret + sötétszürke háttér + világos betű) — a fehér-hátterű, világosszürke írású
   gomb OLVASHATATLAN volt. A hover ennél VILÁGOSABB háttér → megkülönböztethető marad. */
.hm-hangos .hm-listbtn{background:#2a3a53;border-color:var(--blue);color:#eef3fc}
.hm-hangos .hm-listbtn:hover{background:#3a4f72;border-color:var(--blue);color:#fff}
.hm-hangos .hm-listbtn[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}

/* ---- Rovatblokkok / kártyarács ---- */
.hm-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hm-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
/* Gábor 2026-09-25: a kártya-borítókép a banner 1200×628 arányában (a designolt
   Lea-bannerek pont ilyenek) → object-fit:cover mellett NINCS jobb-oldali levágás,
   a logó/cím teljes egészében látszik. */
.hm-card-fig{aspect-ratio:1200/628;overflow:hidden;background:#e9edf3}
.hm-card-fig img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.hm-card a:hover .hm-card-fig img{transform:scale(1.03)}
.hm-card-body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:8px}
.hm-card-title{font-family:var(--serif);font-weight:600;font-size:19px;line-height:1.3;color:var(--navy);margin:0}
.hm-card a:hover .hm-card-title{color:var(--blue)}
.hm-rovat-link{margin-top:14px}
.hm-rovat-link a{display:inline-flex;align-items:center;min-height:44px;color:var(--blue);font-weight:600;font-size:15px}

/* ---- Legfrissebb + Szerkesztői (lista) ---- */
.hm-two{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.hm-list{list-style:none;margin:0;padding:0}
.hm-list li{border-bottom:1px solid var(--line)}
.hm-list li:last-child{border-bottom:0}
.hm-list a{display:flex;gap:14px;align-items:baseline;padding:14px 0;min-height:44px;color:var(--navy)}
.hm-list a:hover{color:var(--blue)}
.hm-list .hm-idx{font-family:var(--serif);font-size:18px;color:var(--blue);font-weight:600;min-width:26px}
.hm-list .hm-li-title{font-size:16.5px;line-height:1.35}
.hm-list .hm-li-rovat{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}

/* ---- Hírlevél ---- */
.hm-hirlevel{background:var(--navy);color:#fff}
.hm-hirlevel-box{max-width:720px;margin:0 auto;text-align:center;padding:8px 0}
.hm-hirlevel h2{font-family:var(--serif);font-weight:600;font-size:28px;margin:0 0 8px;color:#fff}
.hm-hirlevel p{color:#c3d0e6;margin:0 auto 20px;max-width:560px}
.hm-hirlevel-form{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:520px;margin:0 auto}
.hm-hirlevel-row{display:flex;gap:10px;width:100%;flex-wrap:wrap;justify-content:center}
.hm-hirlevel-form input[type=email]{
  flex:1 1 240px;min-height:48px;border:1px solid rgba(255,255,255,.24);border-radius:10px;
  padding:12px 14px;background:rgba(255,255,255,.06);color:#fff;font:inherit;
}
.hm-hirlevel-form input[type=email].hm-invalid{border-color:#f2a3a3;background:rgba(242,163,163,.1)}
.hm-hirlevel-form input::placeholder{color:#8ea1c2}
.hm-hirlevel-form button{
  min-height:48px;padding:12px 22px;border:0;border-radius:10px;background:var(--blue);
  color:#fff;font:inherit;font-weight:600;cursor:pointer;flex:0 0 auto;
}
.hm-hirlevel-form button:hover{background:var(--blue-dark)}
.hm-hirlevel-form button:disabled{opacity:.6;cursor:default}
.hm-hirlevel-consent{display:flex;align-items:flex-start;gap:10px;text-align:left;max-width:520px;font-size:13px;color:#c3d0e6;cursor:pointer}
.hm-hirlevel-consent input[type=checkbox]{flex:0 0 auto;width:20px;height:20px;min-width:20px;margin-top:1px;accent-color:var(--blue);cursor:pointer}
.hm-hirlevel-consent a{color:#fff;text-decoration:underline}
.hm-hirlevel-consent.hm-invalid span{color:#f2a3a3}
.hm-hirlevel-ok{margin-top:14px;color:#bfe6c6;font-weight:600;display:none}
.hm-hirlevel-hiba{margin-top:12px;color:#f2a3a3;font-weight:600;display:none}

/* ---- Ajánlatkérő beágyazás igazítás ---- */
.hm-ajanlat{background:var(--cream)}
.hm-ajanlat .cta-modul{padding:0}

/* ---- Rovat-cím link + „Mind a listára" a fejlécben ---- */
.hm-section-title a{color:inherit}
.hm-section-title a:hover{color:var(--blue)}
.hm-section-head-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}

/* ---- „Listához adom" / „Mind a listára" gombok (működés a 2/2-ben) ---- */
.hm-card{display:flex;flex-direction:column}
.hm-card > a{flex:1 1 auto}
/* Gábor 2026-09-24: a „Meghallgatom" / „Listában" gomb a modul JOBB ALSÓ sarkában. */
.hm-card-actions{padding:0 18px 16px;display:flex;justify-content:flex-end}
.hm-side-item .hm-card-actions,.hm-lead .hm-card-actions{padding:0}
.hm-lead .hm-card-actions{padding:0 24px 20px}
.hm-listbtn{
  -webkit-appearance:none;appearance:none;cursor:pointer;font:inherit;font-size:14px;font-weight:600;
  min-height:44px;padding:10px 16px;border:1px solid var(--line-strong);border-radius:9px;
  background:var(--paper);color:var(--navy);display:inline-flex;align-items:center;gap:8px;line-height:1;
}
.hm-listbtn:hover{border-color:var(--blue);color:var(--blue)}
.hm-listbtn[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.hm-listbtn-all{min-height:44px;padding:10px 14px;font-size:13.5px}

/* ---- Reszponzív ---- */
@media (max-width:900px){
  .hm-hero{grid-template-columns:1fr;gap:22px}
  .hm-cards{grid-template-columns:1fr 1fr}
  .hm-two{grid-template-columns:1fr;gap:28px}
  .hm-lead-title{font-size:27px}
}
@media (max-width:600px){
  body.hrmag{font-size:16px}
  .hm-header-inner{flex-wrap:wrap}
  .hm-header-nav{width:100%;justify-content:flex-start;flex-wrap:wrap}
  .hm-cards{grid-template-columns:1fr}
  .hm-lead-title{font-size:24px}
  .hm-section{padding:30px 0}
  .hm-section-title{font-size:23px}
}

/* ================= CIKKOLDAL (HR Magazin) ================= */

/* Olvasási folyamatcsík (felül, vékony) */
.hm-progress{position:fixed;top:0;left:0;right:0;height:3px;background:transparent;z-index:60;pointer-events:none}
.hm-progress-bar{display:block;height:100%;width:0;background:var(--blue);transition:width .1s linear}

/* Gábor 2026-09-24: a főcím (H1) legyen TELJES tartalom-szélességű, mint a vezető kép
   (ne a keskeny 760-as hasáb). A .hm-wrap 1200-as korlátja marad, ÍGY a fejléc-blokk
   pontosan a hero kép szélességét kapja. A törzs olvashatósági szélessége külön (.hm-cikk-main). */
.hm-cikk-head{max-width:1200px}
.hm-cikk .hm-rovat-cimke{margin-bottom:14px}
a.hm-rovat-cimke:hover{color:var(--blue-dark)}
.hm-cikk-title{font-family:var(--serif);font-weight:600;font-size:40px;line-height:1.15;color:var(--navy);margin:0 0 16px}
.hm-cikk-lead{font-size:20px;line-height:1.5;color:var(--muted);margin:0 0 24px}

/* Szerzői sor + megosztás — Gábor 2026-09-24: szerző + FB + LinkedIn EGY sorban,
   sokkal szolidabban (kis, halvány szöveges linkek, nem nagy keretes gombok);
   375-ön is egy sorba fér (nincs sortörés). */
.hm-cikk-byline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:nowrap;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hm-byline-who{display:flex;align-items:center;gap:10px;min-width:0}
.hm-byline-avatar{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;font-weight:600;display:flex;align-items:center;justify-content:center;font-size:15px;flex:0 0 auto}
.hm-byline-txt{min-width:0;overflow:hidden}
.hm-byline-name{display:block;font-weight:600;color:var(--navy);font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-byline-date{display:block;color:var(--muted);font-size:12.5px;white-space:nowrap}
.hm-share{display:flex;align-items:center;gap:2px;flex-wrap:nowrap;flex:0 0 auto}
.hm-share-btn{-webkit-appearance:none;appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:500;min-height:36px;padding:6px 8px;border:0;border-radius:8px;background:transparent;color:var(--muted);display:inline-flex;align-items:center;line-height:1;text-decoration:none}
.hm-share-btn:hover{color:var(--blue);background:rgba(37,99,217,.07)}

/* Lejátszó (inline, a szerzői sor alatt) */
.hm-player{margin:22px 0 4px;background:var(--navy);color:#fff;border-radius:14px;padding:16px 18px}
.hm-player-skeleton{display:flex;align-items:center;gap:10px;min-height:44px}
.hm-player-vera{color:#9fb3d6;font-size:13px}
/* Gábor 2026-09-25: EGY sor — minden vezérlő + Vera + lista-gomb egyetlen, nem-törő
   flex-sorban; a tekerősáv (flex:1) nő, a Vera + lista-gomb a jobb szélre kerül. */
.hm-player-row{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;min-width:0}
/* a tekerősáv (flex:1) nyeli a szabad helyet → a sebesség + Vera + lista-gomb a jobb
   szélre kerül; a Vera-nak NINCS auto-margója (az elszívná a helyet a tekerősáv elől). */
.hm-player-row .hm-player-vera{white-space:nowrap;font-size:13px;flex:0 0 auto}
.hm-player-row .hm-player-time{flex:0 0 auto}
.hm-player-row .hm-listbtn{flex:0 0 auto;white-space:nowrap}
/* Gábor 2026-09-25 (4): tekerő-csoport [⟲ vissza | tekerősáv | előre ⟳]. A csoport nyeli
   a szabad helyet (flex:1), a tekerősáv nő benne, a ⟲/⟳ végig 44px tap-célpont marad. */
.hm-player-transport{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0}
.hm-player-transport .hm-seek{flex:1 1 120px}
.hm-player-transport .hm-pbtn{flex:0 0 auto}
.hm-pbtn{-webkit-appearance:none;appearance:none;cursor:pointer;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;border-radius:10px;min-width:44px;min-height:44px;padding:0 12px;font:inherit;font-weight:600;font-size:14px;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.hm-pbtn:hover{background:rgba(255,255,255,.16)}
.hm-pbtn-play{background:var(--blue);border-color:var(--blue);min-width:52px}
.hm-pbtn-play:hover{background:var(--blue-dark)}
.hm-player-time{font-variant-numeric:tabular-nums;font-size:13px;color:#cdd8ec;min-width:96px;text-align:center}
.hm-seek{-webkit-appearance:none;appearance:none;flex:1 1 160px;height:6px;border-radius:6px;background:rgba(255,255,255,.2);outline:none;cursor:pointer;min-width:120px}
.hm-seek::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--blue);cursor:pointer}
.hm-seek::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--blue);cursor:pointer}
.hm-player-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;flex-wrap:wrap}
.hm-player-meta .hm-player-vera{color:#9fb3d6}
/* Gábor 2026-09-25 (1): mint fent — kék keret + sötétszürke háttér + világos betű. */
.hm-player .hm-listbtn{background:#2a3a53;border-color:var(--blue);color:#eef3fc}
.hm-player .hm-listbtn:hover{background:#3a4f72;border-color:var(--blue);color:#fff}
.hm-player .hm-listbtn[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}

/* Vezető kép + képaláírás */
.hm-cikk-hero{margin:26px 0 6px}
.hm-cikk-hero img{width:100%;border-radius:14px;background:#e9edf3;aspect-ratio:1200/628;object-fit:cover}
.hm-cikk-caption{font-size:13px;color:var(--muted);margin:10px 2px 0;font-style:italic}

/* Középső hasáb + jobb mellékoszlop (tartalomjegyzék + konzultációs kártya) */
.hm-cikk-cols{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:44px;align-items:start;padding-top:26px}
.hm-cikk-main{min-width:0;max-width:760px}
/* A jobb hasáb sticky konténer: benne a TJ (ha van alcím) és a konzultációs kártya.
   Így a hasáb SOSEM marad üres (a rövid, alcím nélküli cikkeknél is a kártya tölti ki). */
.hm-cikk-rail{position:sticky;top:20px;display:flex;flex-direction:column;gap:16px;min-width:0}
.hm-toc{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
/* Konzultációs kártya (spec: a jobb hasábban) */
.hm-consult{background:var(--navy);color:#fff;border-radius:12px;padding:18px 18px 20px}
.hm-consult-cim{font-family:var(--serif);font-weight:600;font-size:18px;line-height:1.25;margin:0 0 8px;color:#fff}
.hm-consult-txt{font-size:13.5px;line-height:1.5;color:#cdd8ec;margin:0 0 14px}
/* magasabb specificitás (.hm-consult ...), hogy a globális .hrmag a{color:kék}
   NE festse kékre a fehér gombszöveget (kék-a-kéken láthatatlan lenne) */
.hm-consult .hm-consult-btn{display:block;text-align:center;background:var(--blue);color:#fff;font-weight:600;font-size:14.5px;padding:12px 14px;border-radius:9px;min-height:44px;box-sizing:border-box;line-height:1.4}
.hm-consult .hm-consult-btn:hover{background:var(--blue-dark);color:#fff}
.hm-consult-note{display:block;text-align:center;font-size:11.5px;color:#9fb3d6;margin-top:9px}
.hm-toc-cim{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:0 0 10px}
.hm-toc-list{list-style:none;margin:0;padding:0}
.hm-toc-list li{margin:0}
.hm-toc-list a{display:flex;align-items:center;min-height:44px;padding:7px 0 7px 10px;font-size:14px;line-height:1.35;color:var(--navy);border-left:2px solid transparent;margin-left:-12px}
.hm-toc-list a:hover{color:var(--blue)}
.hm-toc-list a.is-active{color:var(--blue);border-left-color:var(--blue)}
.hm-toc-list .lvl-3 a{padding-left:22px;font-size:13px;color:var(--muted)}

/* Cikk-törzs tipográfia */
.hm-article-body{font-size:18px;line-height:1.7;color:var(--ink)}
.hm-article-body p{margin:0 0 1.15em}
.hm-article-body h2{font-family:var(--serif);font-weight:600;font-size:27px;line-height:1.25;color:var(--navy);margin:1.7em 0 .5em;scroll-margin-top:80px}
.hm-article-body h3{font-family:var(--serif);font-weight:600;font-size:22px;line-height:1.3;color:var(--navy);margin:1.4em 0 .4em;scroll-margin-top:80px}
.hm-article-body ul,.hm-article-body ol{margin:0 0 1.15em;padding-left:1.4em}
.hm-article-body li{margin:.3em 0}
.hm-article-body a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.hm-article-body img{border-radius:10px;margin:1.4em 0;height:auto}
.hm-article-body figure{margin:1.6em 0}
.hm-article-body blockquote{margin:1.4em 0;padding:.4em 0 .4em 1.1em;border-left:3px solid var(--blue);color:var(--muted);font-style:italic}
.hm-article-body table{max-width:100%}

/* CTA-kártyák a cikk végén */
.hm-cta-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:36px 0 8px}
.hm-cta-card{display:flex;flex-direction:column;gap:6px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:18px 18px;min-height:44px;color:var(--navy);transition:border-color .15s ease,transform .1s ease}
.hm-cta-card:hover{border-color:var(--blue);transform:translateY(-2px)}
.hm-cta-card-h{font-family:var(--serif);font-weight:600;font-size:18px;color:var(--navy)}
.hm-cta-card-p{font-size:14px;color:var(--muted);line-height:1.4}

/* Címkék + szerzői doboz */
.hm-cikk-tags{display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 0}
.hm-tag{display:inline-flex;align-items:center;min-height:36px;padding:6px 12px;border-radius:999px;background:rgba(37,99,217,.08);color:var(--blue);font-size:13.5px;font-weight:600}
a.hm-tag:hover{background:rgba(37,99,217,.16)}
.hm-tag-audio{background:rgba(14,30,58,.08);color:var(--navy)}
.hm-author-box{display:flex;gap:14px;align-items:flex-start;margin:28px 0 0;padding:18px;background:var(--paper);border:1px solid var(--line);border-radius:12px}
.hm-author-avatar{width:48px;height:48px;border-radius:50%;background:var(--navy);color:#fff;font-weight:600;display:flex;align-items:center;justify-content:center;font-size:20px;flex:0 0 auto}
.hm-author-name{margin:0 0 4px;font-weight:600;color:var(--navy)}
.hm-author-bio{margin:0;font-size:14.5px;color:var(--muted);line-height:1.5}
.hm-cikk-related{border-top:1px solid var(--line);margin-top:20px}

/* ===== Alul tapadó mini lejátszó + lejátszási lista (minden magazin-oldalon) ===== */
.hm-mini{position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--navy);color:#fff;box-shadow:0 -6px 24px rgba(0,0,0,.25);transform:translateY(120%);transition:transform .25s ease;padding:10px 0}
/* amíg a lebegő lejátszó látszik, a body alsó térközt kap → nem takarja a láblécet */
body.hm-mini-active{padding-bottom:96px}
.hm-mini.is-open{transform:translateY(0)}
.hm-mini-inner{max-width:1200px;margin:0 auto;padding:0 16px;display:flex;align-items:center;gap:12px}
.hm-mini-title{flex:1 1 auto;min-width:0;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-mini-vera{display:block;font-weight:400;font-size:12px;color:#9fb3d6}
.hm-mini .hm-pbtn{min-width:44px;min-height:44px}
.hm-mini .hm-seek{flex:2 1 160px}
/* Gábor 2026-09-25 (4): tekerő-csoport a lebegő sávban is [⟲ | tekerősáv | ⟳]. */
.hm-mini-transport{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0}
.hm-mini-transport .hm-pbtn{flex:0 0 auto}
.hm-mini-time{font-variant-numeric:tabular-nums;font-size:12px;color:#cdd8ec;min-width:88px;text-align:center}
.hm-mini-count{font-size:12px;color:#9fb3d6}
.hm-mini-close{background:transparent;border:0;color:#9fb3d6;cursor:pointer;font-size:22px;line-height:1;min-width:44px;min-height:44px;border-radius:8px}
.hm-mini-close:hover{color:#fff;background:rgba(255,255,255,.1)}

/* Lejátszási lista panel (a mini lejátszó modulban nyílik le) */
.hm-plpanel{max-width:1200px;margin:0 auto;padding:0 16px;max-height:0;overflow:hidden;transition:max-height .25s ease}
.hm-plpanel.is-open{max-height:46vh;overflow:auto}
.hm-pl-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0 6px;border-bottom:1px solid rgba(255,255,255,.14)}
.hm-pl-head h3{margin:0;font-size:14px;font-weight:600;color:#fff}
.hm-pl-clear{background:transparent;border:0;color:#9fb3d6;cursor:pointer;font-size:13px;min-height:44px}
.hm-pl-clear:hover{color:#fff}
.hm-pl-list{list-style:none;margin:0;padding:6px 0 10px}
.hm-pl-item{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:8px}
.hm-pl-item.is-playing{background:rgba(37,99,217,.25)}
.hm-pl-play{flex:1 1 auto;min-width:0;text-align:left;background:transparent;border:0;color:#dbe4f2;cursor:pointer;font:inherit;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:44px}
.hm-pl-play:hover{color:#fff}
.hm-pl-remove{background:transparent;border:0;color:#9fb3d6;cursor:pointer;font-size:18px;min-width:44px;min-height:44px;border-radius:8px}
.hm-pl-remove:hover{color:#fff;background:rgba(255,255,255,.1)}
.hm-pl-empty{color:#9fb3d6;font-size:13px;padding:12px 6px}

/* nincs-hang jelzés a listagombon */
.hm-listbtn.is-nohang{opacity:.5;cursor:not-allowed}

@media (max-width:1000px){
  .hm-cikk-cols{grid-template-columns:1fr;gap:0}
  .hm-cikk-rail{position:static}
  .hm-toc{margin:26px 0 0}
  /* Mobilon a mellékoszlop a törzs ALÁ kerül; a konzultációs kártya redundáns lenne a
     közvetlenül alatta jövő teljes ajánlatkérő szekcióval → csak asztali nézetben. */
  .hm-consult{display:none}
}
@media (max-width:760px){
  .hm-cikk-title{font-size:30px}
  .hm-cikk-lead{font-size:18px}
  .hm-cta-cards{grid-template-columns:1fr}
  .hm-article-body{font-size:17px}
  .hm-article-body h2{font-size:23px}
  /* mobil: a morzsamenü-linkek érintési felülete legyen legalább 44px */
  .hm-crumb{line-height:1.2}
  .hm-crumb a{display:inline-flex;align-items:center;min-height:44px}
  /* Gábor 2026-09-24/25: teljes szélességű ALSÓ SÁV, ami 375-ön is EGY sorban fér el
     (nincs sortörés, nincs vízszintes görgetés). A ▶ play a JOBB szélen. 375-ön is
     látszik: cím + tekerő-csoport [⟲ vissza | tekerősáv | előre ⟳] + lista + play,
     mind ≥44px (Gábor (3) cím, (4) vissza/előre az idősáv előtt-után). Rejtve az idő-
     kijelző és a sebesség (helyszűke) — a sebesség a cikkoldali lejátszóból elérhető. */
  .hm-mini{left:0;right:0;bottom:0;border-radius:0;padding:8px 0}
  .hm-mini-inner{flex-wrap:nowrap;padding:0 8px;gap:6px;overflow:hidden}
  .hm-mini-title{flex:1 1 44px;min-width:0}
  .hm-mini-vera{display:none}
  .hm-mini-transport{flex:1 1 auto;min-width:0;gap:6px}
  .hm-mini .hm-seek{flex:1 1 40px;min-width:40px}
  .hm-mini .hm-pbtn{min-width:44px;padding:0 8px}
  .hm-mini .hm-mini-time,.hm-mini .hm-mini-speed{display:none}
  .hm-plpanel{padding:0 12px}
  /* Az alsó térközt JS állítja a sáv valós magasságához; ez csak JS előtti tartalék. */
  body.hm-mini-active{padding-bottom:84px}

  /* Cikk-oldali lejátszó: EGY sorban 375-ön is. Marad: ▶ play + [⟲ vissza | tekerősáv |
     előre ⟳] — a vissza az idősáv ELŐTT, az előre UTÁN, mind ≥44px (Gábor (4)). Rejtve:
     idő, sebesség, lista-gomb (a listázás a kártyákról és az alsó sávból elérhető). */
  .hm-player-row{flex-wrap:nowrap;gap:6px}
  .hm-player-row .hm-player-time{display:none}
  .hm-player-row .hm-player-speed{display:none}
  .hm-player-row .hm-listbtn{display:none}
  .hm-player-transport{gap:6px}
  .hm-player-transport .hm-seek{min-width:40px;flex:1 1 40px}
  .hm-player-row .hm-pbtn{min-width:44px;padding:0 8px}

  /* Gábor 2026-09-25: a rovatsáv 375-ön NE lógjon ki (vízszintes görgetés 0). A hosszú
     rovatnevek nem férnek egy sorba → tördeljünk (belső görgetés helyett), így 0 h-scroll. */
  .hm-rovatsav-inner{flex-wrap:wrap;overflow-x:visible}

  /* Szerzői sor: dátum + „Link másolása" mobilon rejtve, hogy egy sorba férjen */
  .hm-byline-date{display:none}
  .hm-share-copy{display:none}
}