/* =====================================================================
   Havilap – lapszám-olvasó (/havilap/{seourl}/{cikk?}, Lapszám/Folyamat entitás)
   Az /ellenorzo-lista fejezet-olvasó dizájnjára építve: a konténer `ellk-wrap elf-wrap hl-wrap`, így a közös elemek
   a kitöltő CSS-éből (ellenorzolista-kitolto.css: a-layout, sötét összegző-panel, ell-btn, ell-login-cta, ell-zaro),
   a fejezet-olvasóéból (ellenorzo-lista.css: elf-intro, elf-fejezet-fej, elf-chip, elf-tovabb, elf-fejnav) és az
   intezkedeskartya-detail.css-ből (pv-guide, pv-who-box, pv-widget--dark, pv-prose) jönnek.
   Ebben a fájlban CSAK a havilap saját elemei vannak (borító, tartalomjegyzék, cikktörzs, előfizetői kapu,
   lapszám-navigáció), `.hl-wrap` / `.hl-fejlec` alá szkópozva. JS-hookok: havilap.js (data-hl-* attribútumok).
   ===================================================================== */

/* hosszú lapszámcím a fejlécben (a címek 170 karakterig is tartanak) */
.hl-fejlec .tj-page-title.hl-hosszu-cim{font-size:clamp(28px,3.2vw,46px);line-height:1.18;max-width:1000px;margin-left:auto;margin-right:auto}
@media(max-width:575px){.hl-fejlec .tj-page-title{font-size:30px;line-height:1.2}.hl-fejlec .tj-page-title.hl-hosszu-cim{font-size:25px}}

.hl-wrap .hl-demo-note{background:#f3f8ef;border-color:#cfe3c4;border-left-color:var(--zold);color:var(--zold-sot)}
.hl-wrap .hl-demo-note i{margin-right:6px}

/* ---- BEVEZETŐ: téma + tartalomjegyzék + borító ---- */
.hl-wrap .hl-intro{grid-template-columns:minmax(0,1fr) 250px;gap:36px;align-items:start}
.hl-wrap .hl-intro-lead{font-size:16px;line-height:1.65;color:var(--szoveg);margin:0 0 18px}
.hl-wrap .hl-tj{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:none}
.hl-wrap .hl-tj li{margin:0}
.hl-wrap .hl-tj-elem{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font:inherit;cursor:pointer;color:var(--sotet);
  background:rgba(255,255,255,.78);border:1px solid rgba(46,125,50,.18);border-radius:12px;padding:10px 14px 10px 10px;transition:.15s}
.hl-wrap .hl-tj-elem:hover{background:#fff;border-color:rgba(46,125,50,.45);transform:translateX(3px);box-shadow:0 8px 20px rgba(27,42,30,.08)}
.hl-wrap .hl-tj-elem:focus-visible{outline:2px solid var(--zold);outline-offset:2px}
.hl-wrap .hl-tj-num{flex:0 0 30px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:13.5px;font-weight:800;
  background:var(--zold);color:#fff;transition:.15s}
.hl-wrap .hl-tj-cim{flex:1 1 auto;min-width:0;font-size:15px;font-weight:600;line-height:1.35}
.hl-wrap .hl-tj-meta{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--halvany);white-space:nowrap}
.hl-wrap .hl-tj-meta .bi-lock{color:#8aa0ad}
.hl-wrap .hl-tj-minta{display:inline-flex;align-items:center;gap:5px;font-weight:700;color:var(--zold-sot);background:var(--ok-bg);border:1px solid #bfe3c4;border-radius:999px;padding:2px 9px}
.hl-wrap .hl-tj-elem.is-zarolt .hl-tj-num{background:#eef2f0;color:var(--zold-sot);border:1px solid #cfdcd2}
.hl-wrap .hl-tj-elem.is-aktiv{background:#fff;border-color:var(--zold);box-shadow:0 0 0 3px rgba(46,125,50,.12)}
.hl-wrap .hl-tj-elem.is-olvasott .hl-tj-num{background:var(--ok-bg);color:var(--ok);border:1px solid #bfe3c4;font-size:15px}
.hl-wrap .hl-intro .elf-intro-gombok{margin-top:22px}
.hl-wrap .ell-btn.ghost[data-hl-pdf] i{color:#c0392b}

/* borító: a lapszám címlapja (A4, álló) enyhén elforgatva, „asztalon fekvő” árnyékkal */
.hl-wrap .hl-borito{position:relative;z-index:2;margin:6px 0 0;text-align:center}
.hl-wrap .hl-borito img{display:block;width:100%;aspect-ratio:2480/3508;object-fit:cover;object-position:top;border-radius:6px;background:#dfe9e0;
  box-shadow:0 22px 44px rgba(27,42,30,.28),0 2px 6px rgba(27,42,30,.18);transform:rotate(2deg);transition:transform .35s ease}
.hl-wrap .hl-borito:hover img{transform:rotate(0) translateY(-3px)}
.hl-wrap .hl-borito figcaption{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:12.5px;font-weight:600;color:var(--halvany);
  background:#fff;border:1px solid rgba(46,125,50,.22);border-radius:999px;padding:5px 12px}
.hl-wrap .hl-borito figcaption b{color:var(--zold-sot)}
@media(max-width:991px){
  .hl-wrap .hl-intro{grid-template-columns:minmax(0,1fr);gap:22px}
  .hl-wrap .hl-borito{order:-1;width:170px;margin:0 auto}
}
@media(max-width:575px){
  .hl-wrap .hl-tj-elem{padding:9px 10px 9px 8px;gap:10px}
  .hl-wrap .hl-tj-cim{font-size:14.5px}
  .hl-wrap .hl-tj-meta > span:not(.hl-tj-minta){display:none}
}

/* ---- CIKK: fejléc + bevezető ---- */
.hl-wrap .hl-cikk-fej{margin-bottom:18px}
.hl-wrap .hl-cikk-fej h2{font-size:25px;line-height:1.28}
.hl-wrap .elf-chip.is-minta{background:var(--ok-bg);border-color:#bfe3c4;color:var(--zold-sot)}
.hl-wrap .elf-chip.is-zar{background:#eef2f0;border-color:#cfdcd2;color:var(--zold-sot)}
.hl-wrap .elf-chip.is-zar i{color:var(--zold-sot)}
.hl-wrap .elf-chip[hidden]{display:none}
.hl-wrap .hl-cikk-bevezeto{position:relative;z-index:2;margin:16px 0 0;padding:14px 0 0 68px;border-top:1px dashed rgba(46,125,50,.28);
  font-size:15.5px;line-height:1.65;color:#4a564d;font-style:italic}
@media(max-width:575px){.hl-wrap .hl-cikk-bevezeto{padding-left:0}.hl-wrap .hl-cikk-fej h2{font-size:21px}}

/* ---- CIKKTÖRZS: olvasóbarát hasáb (a CMS-HTML-hez igazítva: közcím = rövid félkövér bekezdés) ---- */
.hl-wrap .hl-cikk-test{position:relative;background:var(--lap);border:1px solid rgba(46,125,50,.16);border-radius:14px;padding:34px 40px 26px;
  box-shadow:0 6px 24px rgba(27,42,30,.06)}
.hl-wrap .hl-cikk-test .pv-prose{font-size:16.5px;line-height:1.8;color:#34403a;overflow-wrap:anywhere}
.hl-wrap .hl-cikk-test .pv-prose p{margin:0 0 16px}
.hl-wrap .hl-cikk-test .pv-prose p > br:first-child{display:none}
.hl-wrap .hl-cikk-test .pv-prose .hl-lead{font-size:17.5px;line-height:1.7;margin:0 0 24px;padding:0 0 22px;border-bottom:1px solid var(--keret)}
.hl-wrap .hl-cikk-test .pv-prose .hl-lead strong{font-weight:600;color:var(--sotet)}
.hl-wrap .hl-cikk-test .pv-prose .hl-alcim{position:relative;margin:30px 0 12px;padding-left:16px;font-size:19px;line-height:1.35}
.hl-wrap .hl-cikk-test .pv-prose .hl-alcim::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:4px;border-radius:4px;background:linear-gradient(180deg,var(--zold),#4caf50)}
.hl-wrap .hl-cikk-test .pv-prose .hl-alcim strong{color:var(--sotet);font-weight:700}
.hl-wrap .hl-cikk-test .pv-prose .hl-lead + .hl-alcim{margin-top:6px}
.hl-wrap .hl-cikk-test .pv-prose ul,.hl-wrap .hl-cikk-test .pv-prose ol{margin:0 0 16px;padding-left:24px}
.hl-wrap .hl-cikk-test .pv-prose li{margin-bottom:8px}
.hl-wrap .hl-cikk-test .pv-prose li::marker{color:var(--zold)}
.hl-wrap .hl-cikk-test .pv-prose img{max-width:100%;height:auto !important;border-radius:10px;margin:6px 0}
.hl-wrap .hl-cikk-test .pv-prose table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;margin:8px 0 18px;font-size:15px;line-height:1.6}
.hl-wrap .hl-cikk-test .pv-prose td,.hl-wrap .hl-cikk-test .pv-prose th{padding:10px 12px}
.hl-wrap .hl-cikk-test .pv-prose td p:last-child{margin-bottom:0}
.hl-wrap .hl-cikk-test .pv-prose a{overflow-wrap:anywhere}
.hl-wrap .hl-cikk-test > .ell-note{margin:8px 0 0}
.hl-wrap .hl-cikk-vege{height:1px}
.hl-wrap .hl-cikk-lab{margin-top:14px}
.hl-wrap .hl-cikk-lab .elf-lecke-lab-t[hidden]{display:none}
.hl-wrap .hl-lab-minta{margin-right:auto;font-size:12.5px;color:var(--zold-sot);font-weight:600;display:inline-flex;align-items:center;gap:6px}
@media(max-width:767px){.hl-wrap .hl-cikk-test{padding:24px 20px 20px}.hl-wrap .hl-cikk-test .pv-prose{font-size:16px;line-height:1.75}}
@media(max-width:575px){.hl-wrap .hl-cikk-test{padding:20px 16px 18px;border-radius:12px}.hl-wrap .hl-cikk-lab .ell-btn{width:100%;justify-content:center}}

/* ---- ELŐFIZETŐI KAPU (nem olvasható cikk): elmosott „szöveg” + zárt doboz ---- */
.hl-wrap .hl-zar{position:relative;border-radius:14px;overflow:hidden;background:var(--lap);border:1px solid rgba(46,125,50,.16);box-shadow:0 6px 24px rgba(27,42,30,.06)}
.hl-wrap .hl-zar-elonezet{padding:30px 40px 0;display:grid;gap:14px;filter:blur(1.5px);opacity:.75}
.hl-wrap .hl-zar-elonezet span{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,#e6ece7,#f1f4f1)}
.hl-wrap .hl-zar-elonezet span:nth-child(2){width:94%}
.hl-wrap .hl-zar-elonezet span:nth-child(3){width:97%}
.hl-wrap .hl-zar-elonezet span:nth-child(4){width:88%}
.hl-wrap .hl-zar-elonezet span:nth-child(5){width:62%}
.hl-wrap .hl-zar-doboz{position:relative;margin-top:-34px;padding:60px 40px 34px;text-align:center;
  background:linear-gradient(180deg,rgba(255,255,255,0) 0%,#fff 38%)}
.hl-wrap .hl-zar-ic{display:inline-grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--zold);color:#fff;font-size:24px;
  box-shadow:0 0 0 8px rgba(46,125,50,.12);margin-bottom:16px}
.hl-wrap .hl-zar-doboz h3{font-size:21px;font-weight:700;margin:0 0 8px}
.hl-wrap .hl-zar-doboz p{max-width:560px;margin:0 auto 18px;font-size:14.5px;line-height:1.6;color:var(--szoveg)}
.hl-wrap .hl-zar-gombok{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
.hl-wrap .hl-zar-doboz p.hl-zar-minta{margin:20px auto 0;font-size:13.5px;color:var(--halvany)}
.hl-wrap .hl-zar-minta i{color:var(--zold);margin-right:4px}
.hl-wrap .hl-zar-minta a{font-weight:700;cursor:pointer}
@media(max-width:575px){.hl-wrap .hl-zar-elonezet{padding:24px 18px 0}.hl-wrap .hl-zar-doboz{padding:54px 18px 26px}.hl-wrap .hl-zar-gombok .ell-btn{flex:1 1 auto;justify-content:center}}

/* ---- ZÁRÓ DOBOZ: lapszám-navigáció ---- */
.hl-wrap .hl-zaro .ell-btn.ghost{background:transparent;border-color:rgba(255,255,255,.42);color:#fff}
.hl-wrap .hl-zaro .ell-btn.ghost:hover{background:rgba(255,255,255,.1);border-color:#fff}
.hl-wrap .hl-zaro .ell-btn.ghost[data-hl-pdf] i{color:#ffb4a8}
.hl-wrap .hl-zaro-lapok{position:relative;z-index:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:22px;padding-top:20px;border-top:1px dashed rgba(255,255,255,.16)}
.hl-wrap .hl-zaro-lap{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:12px;padding:12px 14px;transition:.15s}
.hl-wrap .hl-zaro-lap:hover{background:rgba(255,255,255,.12);border-color:rgba(127,212,147,.6);color:#fff}
.hl-wrap .hl-zaro-lap--ujabb{justify-content:flex-end;text-align:right}
.hl-wrap .hl-zaro-lap-ic{flex:0 0 36px;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:rgba(127,212,147,.16);color:#7fd493}
.hl-wrap .hl-zaro-lap-t{min-width:0;display:flex;flex-direction:column}
.hl-wrap .hl-zaro-lap-t small{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#7fd493}
.hl-wrap .hl-zaro-lap-t b{font-size:13.5px;line-height:1.35;font-weight:600;color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---- OLDALSÁV ---- */
.hl-wrap .ell-osszegzo .ell-oss-sub span{min-width:0}
.hl-wrap .elf-fejnav-btn.is-zarolt .elf-fejnav-num i{font-size:12px}
.hl-wrap .elf-fejnav-btn.is-zarolt.is-aktiv{border-style:solid;border-color:#7fd493;background:rgba(127,212,147,.10)}
.hl-wrap .elf-fejnav-btn.is-zarolt.is-aktiv .elf-fejnav-jel{display:inline-block}
.hl-wrap .hl-oss-pdf{position:relative;z-index:2;margin-top:18px}
.hl-wrap .hl-oss-pdf .ell-btn{width:100%;justify-content:center;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3)}
.hl-wrap .hl-oss-pdf .ell-btn:hover{background:rgba(255,255,255,.16);border-color:#fff}
.hl-wrap .hl-oss-pdf .ell-btn i{color:#ffb4a8}
.hl-wrap .hl-oss-lapok{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16)}
.hl-wrap .hl-oss-lapok a{flex:1 1 130px;display:flex;align-items:center;gap:8px;text-decoration:none;color:#fff;font-size:12.5px;font-weight:600;line-height:1.3;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:8px 10px;transition:.15s}
.hl-wrap .hl-oss-lapok a:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#fff}
.hl-wrap .hl-oss-lapok a i{color:#7fd493;flex:0 0 auto}
.hl-wrap .hl-oss-lapok a span{display:flex;flex-direction:column;min-width:0}
.hl-wrap .hl-oss-lapok small{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:rgba(255,255,255,.55)}
.hl-wrap .hl-oss-lapok .hl-oss-ujabb{justify-content:flex-end;text-align:right}
.hl-wrap .hl-oss-lapok .hl-oss-mind{flex-basis:100%;justify-content:center;color:rgba(255,255,255,.8)}

/* PDF-letöltés közben */
.hl-wrap [data-hl-pdf].is-tolt{pointer-events:none;opacity:.7}
.hl-wrap [data-hl-pdf].is-tolt i{animation:hlForog 1s linear infinite}
.hl-wrap [data-hl-pdf].is-tolt i::before{content:"\f130"}
@keyframes hlForog{to{transform:rotate(360deg)}}