/* ============================================================
   Zsebinfo – Települések böngésző + adatlap  (.zst- prefix)
   A zsebinfo-home.css palettájára/shelljére épül.
   ============================================================ */

/* ── Böngésző: település-kártyák ─────────────────────────── */
.zst-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.zst-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; box-shadow: var(--shadow); transition: transform .15s, box-shadow .15s; }
.zst-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.zst-card__img { height: 124px; background-size: cover; background-position: center; position: relative; }
.zst-card__crest { position: absolute; bottom: -22px; left: 18px; width: 54px; height: 54px; border-radius: 12px; border: 3px solid #fff; background: var(--orange-soft); color: var(--orange); display: flex; align-items: center; justify-content: center; font-size: 22px; box-shadow: var(--shadow); }
.zst-card__body { padding: 28px 18px 16px; }
.zst-card__name { font-size: 17px; font-weight: 800; color: var(--ink); }
.zst-card__meta { font-size: 12px; color: var(--muted); margin-top: 2px; }
.zst-card__stats { display: flex; gap: 16px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line-light); font-size: 11.5px; color: var(--muted); }
.zst-card__stats b { color: var(--ink); font-weight: 800; }

/* ── Adatlap: hero ───────────────────────────────────────── */
.zst-hero { position: relative; border-radius: 14px; overflow: hidden; box-shadow: var(--shadow); margin-top: 14px; min-height: 250px; display: flex; align-items: flex-end; background: var(--navy-800); }
.zst-hero__bg { position: absolute; inset: 0; }
.zst-hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.zst-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(20,30,24,.88) 0%, rgba(20,30,24,.3) 55%, rgba(20,30,24,.1) 100%); }
.zst-hero__body { position: relative; z-index: 1; padding: 24px; color: #fff; display: flex; align-items: flex-end; gap: 20px; width: 100%; }
.zst-hero__crest { width: 84px; height: 84px; border-radius: 16px; border: 3px solid rgba(255,255,255,.85); background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; font-size: 36px; flex-shrink: 0; }
.zst-hero__main { flex: 1; min-width: 0; }
.zst-hero__name { font-size: 30px; font-weight: 800; letter-spacing: -.01em; }
.zst-hero__sub { font-size: 13px; opacity: .9; margin-top: 4px; display: flex; align-items: center; gap: 8px; }
.zst-hero__stats { display: flex; gap: 26px; margin-top: 14px; flex-wrap: wrap; }
.zst-hero__stat b { font-size: 19px; font-weight: 800; display: block; line-height: 1.1; }
.zst-hero__stat span { font-size: 11px; opacity: .82; }

/* ── Test ────────────────────────────────────────────────── */
.zst-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; margin-top: 22px; }
.zst-main { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.zst-side { display: flex; flex-direction: column; gap: 18px; position: sticky; top: 16px; }
.zst-about { font-size: 13.5px; line-height: 1.7; color: var(--ink); }
.zst-about p + p { margin-top: 10px; }
.zst-note { margin-top: 12px; padding: 12px 14px; background: var(--orange-soft); border-radius: 8px; font-size: 12.5px; color: var(--orange-dark); display: flex; gap: 10px; align-items: flex-start; }
.zst-note i { margin-top: 2px; }

/* Galéria */
.zst-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.zst-gallery a { aspect-ratio: 4 / 3; border-radius: 8px; background-size: cover; background-position: center; transition: .15s; }
.zst-gallery a:hover { transform: scale(1.02); box-shadow: var(--shadow-lg); }

/* Helyi hír sorok */
.zst-newsrow { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line-light); }
.zst-newsrow:first-of-type { border-top: none; padding-top: 0; }
.zst-newsrow__img { flex: 0 0 70px; width: 70px; height: 52px; border-radius: 7px; background-size: cover; background-position: center; }
.zst-newsrow__title { font-size: 13px; font-weight: 700; color: var(--ink); line-height: 1.35; }
.zst-newsrow__title:hover { color: var(--orange); }
.zst-newsrow__meta { font-size: 11px; color: var(--muted); margin-top: 2px; }

/* ── Sidebar ─────────────────────────────────────────────── */
.zst-facts { display: flex; flex-direction: column; gap: 9px; }
.zst-fact { display: flex; justify-content: space-between; gap: 12px; font-size: 12.5px; }
.zst-fact__k { color: var(--muted); }
.zst-fact__v { color: var(--ink); font-weight: 600; text-align: right; }

.zst-contact { display: flex; flex-direction: column; }
.zst-contact a { display: flex; align-items: center; gap: 11px; padding: 8px 0; font-size: 12.5px; color: var(--ink); font-weight: 600; }
.zst-contact a:hover { color: var(--orange); }
.zst-contact a > i { width: 32px; height: 32px; border-radius: 8px; background: var(--teal-soft); color: var(--teal-dark); display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; }
.zst-contact__hours { font-size: 11.5px; color: var(--muted); margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--line-light); }
.zst-contact__hours b { color: var(--ink); }

.zst-map { height: 170px; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); margin-top: 4px; }
.zst-map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* Mini időjárás */
.zst-wx { display: flex; align-items: center; gap: 14px; }
.zst-wx__icon { font-size: 34px; line-height: 1; }
.zst-wx__temp { font-size: 26px; font-weight: 800; color: var(--ink); line-height: 1; }
.zst-wx__desc { font-size: 12px; color: var(--muted); margin-top: 2px; }

/* ── Reszponzív ──────────────────────────────────────────── */
@media (max-width: 980px) { .zst-grid { grid-template-columns: 1fr 1fr; } .zst-gallery { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 920px) { .zst-layout { grid-template-columns: 1fr; } .zst-side { position: static; } }
@media (max-width: 560px) {
  .zst-grid { grid-template-columns: 1fr; }
  .zst-gallery { grid-template-columns: 1fr 1fr; }
  .zst-hero__body { flex-direction: column; align-items: flex-start; gap: 14px; }
  .zst-hero__name { font-size: 24px; }
}

/* ============================================================
   TELEPÜLÉS ADATLAP – tematikus blokkok (.zsti-)
   ============================================================ */
.zsti-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:20px 0 4px}
.zsti-townsel{display:flex;align-items:center;gap:10px;font:700 14px/1 'Inter',sans-serif;color:var(--ink)}
.zsti-townsel select{font:700 14px/1 'Inter',sans-serif;color:var(--orange-dark);border:1.5px solid #DFE2CC;border-radius:10px;padding:11px 14px;background:#fff;cursor:pointer}
.zsti-bar__hint{font:500 13px/1.4 'Inter',sans-serif;color:var(--muted)}

.zsti-nav{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 4px}
.zsti-nav a{display:inline-flex;align-items:center;gap:7px;font:600 13px/1 'Inter',sans-serif;color:var(--ink);background:#fff;border:1px solid #E6E4D6;border-radius:999px;padding:9px 14px;text-decoration:none;transition:.15s}
.zsti-nav a:hover{border-color:var(--teal);color:var(--orange-dark);background:var(--orange-soft)}
.zsti-nav a i{color:var(--teal)}

.zsti-block{margin-top:34px;scroll-margin-top:18px}
.zsti-bhead{display:flex;align-items:center;gap:13px;margin-bottom:16px;padding-bottom:13px;border-bottom:2px solid #F2F1E6}
.zsti-bhead__num{width:34px;height:34px;border-radius:9px;background:var(--orange);color:#fff;display:flex;align-items:center;justify-content:center;font:800 15px/1 'Inter',sans-serif;flex-shrink:0}
.zsti-bhead__title{font:800 20px/1.2 'Inter',sans-serif;color:var(--ink)}

.zsti-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media(max-width:900px){.zsti-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.zsti-grid{grid-template-columns:1fr}}

.zsti-card{display:flex;flex-direction:column;background:#fff;border:1px solid #EEE6DA;border-radius:14px;padding:16px 17px;box-shadow:0 1px 2px rgba(52,62,38,.04)}
.zsti-card__top{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}
.zsti-card__ico{width:42px;height:42px;border-radius:11px;background:var(--orange-soft);color:var(--orange);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.zsti-card__name{font:700 15.5px/1.25 'Inter',sans-serif;color:var(--ink)}
.zsti-card__type{font:600 12.5px/1.3 'Inter',sans-serif;color:var(--teal);margin-top:3px}
.zsti-card__badge{margin-left:auto;font:800 10px/1 'Inter',sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#7A4A26;background:rgba(193,147,109,.18);border:1px solid rgba(193,147,109,.42);padding:5px 8px;border-radius:6px;flex-shrink:0}
.zsti-card__rows{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.zsti-card__row{display:flex;align-items:flex-start;gap:10px;font:500 13.5px/1.4 'Inter',sans-serif;color:#3c4a40}
.zsti-card__row i{width:15px;color:var(--teal);margin-top:2px;flex-shrink:0}
.zsti-card__foot{margin-top:auto;display:flex;gap:8px}
.zsti-card__btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;font:700 13px/1 'Inter',sans-serif;padding:10px;border-radius:9px;transition:.15s}
.zsti-card__btn--call{background:var(--orange);color:#fff}
.zsti-card__btn--call:hover{background:var(--orange-dark)}
.zsti-card__btn--ghost{background:#fff;color:var(--orange-dark);border:1.5px solid #DFE2CC}
.zsti-card__btn--ghost:hover{background:#F6F5EC}

/* Segélyhívó kiemelt sáv */
.zsti-emerg{display:flex;flex-wrap:wrap;gap:14px;background:#fbeae8;border:1px solid #f3cfca;border-radius:14px;padding:16px 20px;margin-bottom:16px}
.zsti-emerg__item{display:flex;align-items:center;gap:12px;flex:1;min-width:160px}
.zsti-emerg__item i{font-size:20px;color:#c0392b}
.zsti-emerg__num{font:800 21px/1 'Inter',sans-serif;color:#c0392b}
.zsti-emerg__lbl{font:600 12.5px/1.3 'Inter',sans-serif;color:var(--ink);margin-top:3px}

/* ============================================================
   TELEPÜLÉS – 3 OSZLOPOS, BAL MENÜS VÁLTOZAT (.zstm-)
   ============================================================ */
.zstm-layout{display:grid;grid-template-columns:240px minmax(0,1fr) 300px;gap:24px;align-items:start;margin-top:22px}
.zstm-left{position:sticky;top:14px}
.zstm-navtitle{font:800 11.5px/1 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px 8px}
.zstm-nav{display:flex;flex-direction:column;gap:3px;background:#fff;border:1px solid #EEE6DA;border-radius:14px;padding:8px;box-shadow:0 1px 2px rgba(52,62,38,.04)}
.zstm-nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;font:600 13.5px/1.25 'Inter',sans-serif;color:var(--ink);text-decoration:none;transition:.12s;cursor:pointer}
.zstm-nav a:hover{background:#F6F5EC}
.zstm-nav a.is-active{background:var(--orange);color:#fff}
.zstm-nav a i{width:18px;text-align:center;color:var(--teal);font-size:14px;flex-shrink:0}
.zstm-nav a.is-active i{color:#fff}
.zstm-nav a .zstm-num{margin-left:auto;font:700 11px/1 'Inter',sans-serif;color:var(--muted);flex-shrink:0}
.zstm-nav a.is-active .zstm-num{color:rgba(255,255,255,.82)}

.zstm-center{min-width:0}
.zstm-panel{display:none}
.zstm-panel.is-active{display:block;animation:zstmfade .22s ease}
@keyframes zstmfade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.zstm-center .zsti-block{margin-top:0}
.zstm-center .zsti-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

.zstm-right{display:flex;flex-direction:column;gap:18px;position:sticky;top:14px}

@media(max-width:1080px){
  .zstm-layout{grid-template-columns:1fr}
  .zstm-left,.zstm-right{position:static}
  .zstm-nav{flex-direction:row;flex-wrap:wrap}
  .zstm-nav a .zstm-num{display:none}
}
@media(max-width:600px){.zstm-center .zsti-grid{grid-template-columns:1fr}}

/* Bal menü – kibontható (accordion) almenükkel */
.zstm-group{display:flex;flex-direction:column}
.zstm-top{display:flex;align-items:center;gap:11px;width:100%;padding:11px 12px;border:0;background:none;border-radius:10px;font:600 13.5px/1.25 'Inter',sans-serif;color:var(--ink);cursor:pointer;text-align:left;transition:.12s}
.zstm-top:hover{background:#F6F5EC}
.zstm-top.is-active{background:var(--orange);color:#fff}
.zstm-top>i:first-child{width:18px;text-align:center;color:var(--teal);font-size:14px;flex-shrink:0}
.zstm-top.is-active>i{color:#fff}
.zstm-top__lbl{flex:1}
.zstm-chev{font-size:11px;opacity:.7;transition:transform .2s;flex-shrink:0}
.zstm-group.is-open .zstm-chev{transform:rotate(180deg)}
.zstm-sub{display:none;flex-direction:column;gap:1px;padding:2px 0 7px 41px}
.zstm-group.is-open .zstm-sub{display:flex}
.zstm-sub a{display:block;padding:7px 10px;border-radius:7px;font:600 13px/1.3 'Inter',sans-serif;color:#5c6a5f;text-decoration:none;cursor:pointer;transition:.12s}
.zstm-sub a:hover{background:#F6F5EC;color:var(--ink)}
.zstm-sub a.is-active{color:var(--orange-dark);background:var(--orange-soft);font-weight:700}

/* Középső sáv: kártyák helyett ADAT-SOROS lista (.zstm-center) */
.zstm-center .zsti-grid{display:flex;flex-direction:column;gap:0}
.zstm-center .zsti-card{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 14px;
  background:transparent;border:0;border-bottom:1px solid #EEE6DA;border-radius:0;box-shadow:none;padding:15px 6px}
.zstm-center .zsti-card:last-child{border-bottom:0}
.zstm-center .zsti-card:hover{background:#fafbf9}
.zstm-center .zsti-card__top{order:1;flex:1 1 auto;margin:0;align-items:center}
.zstm-center .zsti-card__ico{width:36px;height:36px;font-size:14px;border-radius:9px}
.zstm-center .zsti-card__name{font-size:15px}
.zstm-center .zsti-card__foot{order:2;flex:0 0 auto;margin:0;width:auto;gap:8px}
.zstm-center .zsti-card__btn{flex:0 0 auto;padding:9px 15px}
.zstm-center .zsti-card__rows{order:3;flex:1 1 100%;flex-direction:row;flex-wrap:wrap;gap:4px 20px;margin:9px 0 0;padding-left:50px}
.zstm-center .zsti-card__row{font-size:13px}
@media(max-width:600px){
  .zstm-center .zsti-card__rows{padding-left:0}
  .zstm-center .zsti-card__foot{flex-basis:100%;order:3}
  .zstm-center .zsti-card__btn{flex:1}
}

/* Település bal-menüs nézet: a középső adat-listában NINCS akció-gomb (csak adatok) */
.zstm-center .zsti-card__foot{display:none}
.zstm-center .zsti-card__rows{padding-left:50px;margin-top:2px}
@media(max-width:600px){.zstm-center .zsti-card__rows{padding-left:0}}