@charset "utf-8";
/* ═══════════════════════════════════════════════════════════════════════
   poradna.css — výpis poradny NemovitostNaLeasing.cz
   Konsolidace listingu do jednoho souboru (nahrazuje poradna.css +
   poradna-dynamic.css + poradna-plus.css ze vzoru).
   Staví výhradně na tokenech z global style.css (--accent #0e6f45, --navy,
   --warm, --sh-card …). Prefix blg- — nekoliduje s globálními styly.
   Bez Bootstrapu. Mobile-first. 3 / 2 / 1 sloupce. Bez horizontálního scrollu.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Sekční rytmus + hlavičky ──────────────────────────────────────── */
.blg-sec{padding:clamp(3rem,6vw,5rem) 0}
.blg-sec--warm{background:var(--warm)}
.blg-hd{max-width:760px;margin:0 0 clamp(1.8rem,3.5vw,2.6rem)}
.blg-hd--c{text-align:center;margin-inline:auto}
.blg-k{display:inline-flex;align-items:center;gap:.45rem;margin-bottom:.7rem;color:var(--accent);font-size:.68rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.blg-k svg{stroke:var(--accent)}
.blg-t{font-size:clamp(1.5rem,3.2vw,2.2rem);color:var(--ink);letter-spacing:-.035em;line-height:1.14;margin:0 0 .6rem;max-width:24ch}
.blg-hd--c .blg-t{margin-inline:auto}
.blg-d{font-size:1.02rem;line-height:1.7;color:var(--muted);max-width:60ch;margin:0}
.blg-hd--c .blg-d{margin-inline:auto}

/* ═══════════════ HERO (tmavý) ═══════════════
   Hero Poradny běží na GLOBÁLNÍM systému homepage ze style.css:
   .hero + .hero__ov + .hero__inner--vis + .hero__text + .hero__vis.vsn-deal--tri.
   Zde zůstávají POUZE lokální odchylky Poradny — žádná paralelní kopie
   .hero-* / .vsn-deal-* komponent. Starý blok (vlastní padding, vlastní
   background, overflow:hidden, .blg-hero__ov) byl odstraněn: overflow:hidden
   ořezával plovoucí karty (--pay sedí na right:-2%) a vlastní padding se
   tloukl s .hero__inner. HTML nyní používá .hero__ov, .blg-hero__ov zanikl.

   .blg-hero  = zůstává kvůli JS (IntersectionObserver → sticky header).
   .blg-hero--poradna       = lokální odchylky hero Poradny.
   .blg-hero--has-trust     = jen hlavní strana (dole je tmavý pruh). */

/* POZADÍ: žádný lokální override. Poradna dědí PŘESNĚ stejný stack jako homepage:
     .hero          → background:var(--navy)
     .hero::before  → zelená zář (radial 84% 8% + 4% 92%)
     .hero::after   → tečkovaná textura s radial maskou
     .hero__ov      → tmavý směrový gradient (102deg)
   Dřívější override .blg-hero--poradna .hero__ov (radialy + --navy-2) tenhle
   stack přebíjel → Poradna měla JINÉ pozadí než homepage. Odstraněno. */

/* VERTIKÁLNÍ ZAROVNÁNÍ — sjednoceno se stránkou „Jak probíhá výkup" (.jpv-banner).
   Globální .hero__inner má align-items:center → oba sloupce se centrují proti
   vyššímu pravému sloupci a drobečková navigace tím klesá níž (Poradna měla
   breadcrumb hlouběji než JPV / O nás).
   JPV to řeší tak, že OBA sloupce připne k hornímu okraji:
     .jpv-banner__text  { align-self:start }
     .jpv-banner__media { align-self:start }
   Přebíráme identicky → breadcrumb startuje přesně na hraně horního paddingu
   (clamp(132px,14vw,168px)), tedy ve stejné výšce jako u JPV. */
.blg-hero--poradna .hero__text{align-self:start}
.blg-hero--poradna .hero__vis{align-self:start}

/* Stejná výška hero jako .jpv-banner / .hero (600px), ať sedí i celkový rytmus. */
.blg-hero--poradna{min-height:600px}

/* Foto: výřez tak, aby zůstaly vidět dokumenty a ruce (zdroj je na výšku 560×620,
   CSS ho ořízne do 4:3 — bez object-position by se ořez usadil doprostřed). */
.blg-hero--poradna .vsn-deal__photo img{object-position:50% 42%}

/* Vertikální rytmus: na hlavní straně následuje UVNITŘ hero tmavý pruh,
   takže spodní padding dvousloupcové části zkracujeme (jinak by mezi
   vizuálem a linkou pruhu vznikla velká prázdná plocha). Kategorie /
   stránkování / hledání pruh nemají → ponechávají globální padding. */
.blg-hero--has-trust .hero__inner{padding-bottom:clamp(40px,4vw,54px)}

/* ── Spodní informační pruh (tmavý, uvnitř hero, plná šířka .wrap) ──
   Bez bílého pozadí, bez karet, bez stínu, bez negativního marginu.
   Desktop 4 × 1, tablet 2 × 2, mobil 2 × 2 → 1 × 4 (viz níže). */
.blg-hero__trust-wrap{
  position:relative;z-index:2;
  padding-bottom:clamp(34px,4vw,46px)}
.blg-hero--poradna .blg-trust{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.9rem 1.6rem;margin:0;padding:1.4rem 0 0;list-style:none;
  border-top:1px solid rgba(255,255,255,.12)}
.blg-trust__item{
  display:flex;align-items:flex-start;gap:.55rem;min-width:0;
  font-size:.9rem;line-height:1.45;color:rgba(255,255,255,.82);
  text-wrap:pretty}
.blg-trust__item svg{flex:none;margin-top:.12em;stroke:var(--accent-glow)}

.blg-bc{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0 0 1.4rem;padding:0;list-style:none;
  font-size:.82rem;color:rgba(255,255,255,.6)}
.blg-bc a{color:rgba(255,255,255,.72);transition:color .2s}
.blg-bc a:hover{color:#fff}
.blg-bc .sep{color:rgba(255,255,255,.34)}
.blg-bc [aria-current="page"]{color:rgba(255,255,255,.92);font-weight:600}
/* Pozn.: .blg-hero__k (kicker „PORADNA") odstraněn — v HTML už není.
   Detail článku má vlastní .blg-art-hero__k, ten zůstává nedotčen. */
/* H1: velikost přebíráme z globální .hero h1 (stejný clamp jako homepage).
   POZOR na specificitu — .hero h1 = (0,1,1), samotné .blg-hero__title = (0,1,0)
   → prohrálo by o margin, max-width, line-height, weight i letter-spacing.
   Proto scopujeme přes .blg-hero (0,2,0). Bez !important. */
.blg-hero .blg-hero__title{font-weight:680;letter-spacing:-.04em;line-height:1.08;
  color:#fff;margin:0 0 1rem;max-width:18ch}
.blg-hl{color:var(--accent-glow)}
.blg-hero__lead{font-size:clamp(1rem,1.5vw,1.12rem);line-height:1.7;color:rgba(255,255,255,.8);
  max-width:56ch;margin:0}

/* ═══════════════ „CO ZDE NAJDETE" ═══════════════ */
.blg-quick{position:relative;background:var(--white);border:1px solid var(--line);
  border-left:4px solid var(--accent);border-radius:var(--rl);box-shadow:var(--sh-card);
  padding:clamp(1.4rem,2.6vw,1.9rem) clamp(1.4rem,2.6vw,2.1rem);margin:0 0 clamp(1.6rem,3vw,2.2rem)}
.blg-quick__k{display:inline-flex;align-items:center;gap:.45rem;margin-bottom:.7rem;
  color:var(--accent);font-size:.7rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.blg-quick p{margin:0 0 .7rem;color:var(--text);line-height:1.72}
.blg-quick p:last-child{margin-bottom:0}
.blg-quick__fine{font-size:.92rem;color:var(--muted)}

/* ═══════════════ FEATURED (doporučený) ═══════════════ */
.blg-featured{display:grid;grid-template-columns:1fr;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;box-shadow:var(--sh-card);color:inherit;
  transition:box-shadow var(--trans),transform var(--trans),border-color var(--trans)}
.blg-featured:hover{box-shadow:var(--sh-lift);border-color:rgba(14,111,69,.18)}
.blg-featured__img{position:relative;background:var(--warm-2);aspect-ratio:16/10;overflow:hidden}
.blg-featured__img picture,.blg-featured__img img{width:100%;height:100%;object-fit:cover;display:block}
.blg-featured__body{padding:clamp(1.5rem,3vw,2.3rem);display:flex;flex-direction:column;align-items:flex-start}
.blg-featured__badge{display:inline-flex;align-items:center;gap:.4rem;margin-bottom:.9rem;
  padding:.34rem .7rem;border-radius:999px;background:var(--accent);color:#fff;
  font-size:.66rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.blg-featured__meta,.blg-card__meta{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  color:var(--light);font-size:.82rem;font-weight:600;margin-bottom:.7rem}
.blg-featured__meta .dot,.blg-card__meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.6}
.blg-featured__body h2{font-size:clamp(1.4rem,2.6vw,1.95rem);line-height:1.16;letter-spacing:-.03em;
  color:var(--ink);margin:0 0 .7rem}
.blg-featured__body p{color:var(--muted);line-height:1.7;margin:0 0 1.2rem;max-width:54ch}
.blg-featured__link,.blg-card__link{display:inline-flex;align-items:center;gap:.4rem;
  color:var(--accent);font-weight:700;font-size:.95rem;margin-top:auto}
.blg-featured__link svg,.blg-card__link svg{width:15px;height:15px;transition:transform .25s}
.blg-featured:hover .blg-featured__link svg,.blg-card:hover .blg-card__link svg{transform:translate(2px,-2px)}
@media(min-width:760px){
  .blg-featured{grid-template-columns:minmax(0,1.02fr) minmax(0,1fr)}
  .blg-featured__img{aspect-ratio:auto;min-height:100%}
}

/* ═══════════════ ROZCESTNÍK PODLE SITUACE ═══════════════ */
.blg-sit-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:600px){.blg-sit-grid{grid-template-columns:1fr 1fr;gap:16px}}
@media(min-width:980px){.blg-sit-grid{grid-template-columns:repeat(3,1fr);gap:18px}}
.blg-sit{position:relative;display:flex;gap:.95rem;align-items:flex-start;background:var(--white);
  border:1px solid var(--line);border-radius:var(--rl);padding:1.25rem 1.3rem;box-shadow:var(--sh);
  color:inherit;transition:box-shadow var(--trans),transform var(--trans),border-color var(--trans)}
.blg-sit:hover{box-shadow:var(--sh-lift);border-color:rgba(14,111,69,.2)}
.blg-sit__ic{flex:none;width:42px;height:42px;border-radius:11px;display:grid;place-items:center;
  background:var(--accent-s);color:var(--accent)}
.blg-sit__ic svg{stroke:var(--accent)}
.blg-sit__h{display:block;font-weight:700;color:var(--ink);font-size:1.02rem;line-height:1.25;margin-bottom:.25rem}
.blg-sit__p{display:block;color:var(--muted);font-size:.9rem;line-height:1.55}
.blg-sit__tx{flex:1;min-width:0}

/* ═══════════════ VYHLEDÁVÁNÍ ═══════════════ */
.blg-search{display:flex;align-items:stretch;gap:.6rem;margin:0 0 1.2rem}
.blg-search__field{position:relative;display:flex;align-items:center;flex:1 1 auto;min-width:0;background:var(--white);
  border:1px solid var(--line-s);border-radius:var(--rl);box-shadow:var(--sh);transition:border-color .18s,box-shadow .18s}
.blg-search__field:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-s)}
.blg-search__ic{position:absolute;left:1rem;color:var(--light);pointer-events:none}
.blg-search__field input{flex:1;width:100%;border:0;outline:0;background:transparent;font-family:inherit;
  font-size:15px;color:var(--ink);padding:.9rem 2.75rem .9rem 3rem;border-radius:var(--rl)}
.blg-search__field input::placeholder{color:var(--light)}
.blg-search__field input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.blg-search__clear{position:absolute;right:.6rem;display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border:0;border-radius:50%;background:var(--warm-2);color:var(--muted);cursor:pointer;
  text-decoration:none;transition:background .15s,color .15s}
.blg-search__clear:hover{background:var(--accent-s);color:var(--accent)}
.blg-search__clear[hidden]{display:none}
.blg-search__submit{flex:0 0 auto;border:0;border-radius:var(--rl);background:var(--accent);color:#fff;
  font-family:inherit;font-size:.95rem;font-weight:700;padding:0 1.25rem;cursor:pointer;
  transition:background .15s}
.blg-search__submit:hover{background:var(--accent-h)}

/* ═══════════════ FILTRY ═══════════════ */
.blg-filters{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;margin:0 0 1.6rem}
.blg-filters__label{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--light);margin-right:.2rem}
.blg-filter{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .85rem;border-radius:999px;
  background:var(--white);border:1px solid var(--line-s);color:var(--text);font-size:.88rem;font-weight:600;
  transition:all .18s}
.blg-filter:hover{border-color:var(--accent);color:var(--accent)}
.blg-filter.is-active{background:var(--accent);border-color:var(--accent);color:#fff}
.blg-filter__count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 .35rem;
  border-radius:999px;background:var(--warm-2);color:var(--muted);font-size:.72rem;font-weight:700;line-height:1}
.blg-filter.is-active .blg-filter__count{background:rgba(255,255,255,.22);color:#fff}

/* úvod kategorie (mimo homepage) */
.blg-cat-intro{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;margin:0 0 1.6rem;
  padding:.95rem 1.15rem;border-radius:var(--rl);background:var(--accent-s);border:1px solid rgba(14,111,69,.16)}
.blg-cat-intro span{color:var(--text);font-size:.95rem;line-height:1.5}
.blg-cat-intro a{font-weight:700;white-space:nowrap}

/* ═══════════════ GRID ČLÁNKŮ ═══════════════ */
.blg-grid{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:600px){.blg-grid{grid-template-columns:1fr 1fr;gap:20px}}
@media(min-width:980px){.blg-grid{grid-template-columns:repeat(3,1fr);gap:22px}}
.blg-card{position:relative;display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;box-shadow:var(--sh-card);color:inherit;
  transition:box-shadow var(--trans),transform var(--trans),border-color var(--trans)}
.blg-card:hover{box-shadow:var(--sh-lift);border-color:rgba(14,111,69,.18)}
.blg-card__img{position:relative;aspect-ratio:16/10;background:var(--warm-2);overflow:hidden}
.blg-card__img picture,.blg-card__img img{width:100%;height:100%;object-fit:cover;display:block}
.blg-card__badge{position:absolute;left:.7rem;top:.7rem;padding:.3rem .6rem;border-radius:8px;
  background:rgba(6,16,24,.78);color:#fff;font-size:.68rem;font-weight:700;letter-spacing:.02em;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.blg-card__body{display:flex;flex-direction:column;flex:1;padding:1.15rem 1.2rem 1.3rem}
.blg-card__body h3{font-size:1.12rem;line-height:1.28;letter-spacing:-.02em;color:var(--ink);margin:0 0 .5rem}
.blg-card__excerpt{color:var(--muted);font-size:.93rem;line-height:1.6;margin:0 0 1rem}
.blg-card__link{font-size:.9rem;margin-top:auto}

/* placeholder obrázku (když foto chybí) */
.blg-img-ph,.blg-card__img--ph .blg-img-ph{width:100%;height:100%;min-height:170px;
  background:
    linear-gradient(135deg,var(--warm-2),#fff),
    radial-gradient(420px 200px at 70% -20%,var(--accent-s),transparent 70%);
  background-blend-mode:multiply}
.blg-img-ph::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(135deg,rgba(14,111,69,.06),transparent 55%),
    repeating-linear-gradient(45deg,rgba(10,19,31,.018) 0 12px,transparent 12px 24px)}
.blg-img-ph--feat{min-height:260px}

/* inline CTA mezi kartami */
.blg-cta-inline{grid-column:1/-1;display:flex;flex-direction:column;align-items:flex-start;gap:.4rem;
  background:linear-gradient(135deg,var(--navy-2),var(--navy));color:#fff;border-radius:var(--r);
  padding:clamp(1.5rem,3vw,2.1rem)}
.blg-cta-inline h3{color:#fff;font-size:clamp(1.2rem,2.2vw,1.5rem);margin:0;letter-spacing:-.02em}
.blg-cta-inline p{color:rgba(255,255,255,.78);margin:.2rem 0 1rem;max-width:60ch;line-height:1.6}

/* prázdný stav / žádné výsledky */
.blg-empty{grid-column:1/-1;margin:0;padding:1.4rem 0;color:var(--muted);font-size:1rem}
.blg-empty a{font-weight:700}
.blg-empty__reset{border:0;background:transparent;color:var(--accent);font:inherit;font-weight:700;
  text-decoration:underline;text-underline-offset:2px;cursor:pointer;padding:0}
.blg-empty__reset:hover{color:var(--accent-h)}

/* ═══════════════ STRÁNKOVÁNÍ ═══════════════ */
.blg-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem;
  margin-top:clamp(2rem,4vw,3rem)}
.blg-pagination__link{padding:.55rem 1rem;border-radius:var(--rl);border:1px solid var(--line-s);
  background:var(--white);color:var(--text);font-weight:600;font-size:.9rem;transition:all .18s}
.blg-pagination__link:hover{border-color:var(--accent);color:var(--accent)}
.blg-pagination__pages{display:flex;flex-wrap:wrap;gap:.35rem}
.blg-pagination__page{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 .5rem;
  border-radius:10px;border:1px solid var(--line-s);background:var(--white);color:var(--text);
  font-weight:600;font-size:.9rem;transition:all .18s}
.blg-pagination__page:hover{border-color:var(--accent);color:var(--accent)}
.blg-pagination__page.is-active{background:var(--accent);border-color:var(--accent);color:#fff}

/* ═══════════════ DOPORUČENÉ ČLÁNKY ═══════════════ */
.blg-pop-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:720px){.blg-pop-grid{grid-template-columns:1fr 1fr;gap:16px}}
.blg-pop{display:flex;align-items:stretch;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);color:inherit;
  transition:box-shadow var(--trans),transform var(--trans),border-color var(--trans)}
.blg-pop:hover{box-shadow:var(--sh-card);border-color:rgba(14,111,69,.18)}
.blg-pop__img{position:relative;flex:0 0 34%;max-width:172px;background:var(--warm-2);overflow:hidden}
.blg-pop__img picture,.blg-pop__img img{width:100%;height:100%;object-fit:cover;display:block}
.blg-pop__img .blg-img-ph{min-height:100%}
.blg-pop__b{display:flex;flex-direction:column;gap:.28rem;padding:.8rem .95rem;min-width:0;flex:1}
.blg-pop__meta{color:var(--light);font-size:.76rem;font-weight:600}
.blg-pop__title{font-weight:700;color:var(--ink);font-size:.97rem;line-height:1.3;letter-spacing:-.01em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blg-pop__ex{color:var(--muted);font-size:.83rem;line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blg-pop__go{display:inline-flex;align-items:center;gap:.3rem;color:var(--accent);font-size:.8rem;font-weight:700;margin-top:auto;padding-top:.4rem}
.blg-pop__go svg{width:14px;height:14px;transition:transform .25s}
.blg-pop:hover .blg-pop__go svg{transform:translate(2px,-2px)}

/* ═══════════════ E-E-A-T (kompaktní informační pruh) ═══════════════ */
.blg-note{display:flex;gap:.9rem;align-items:flex-start;max-width:820px;margin-inline:auto;
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:var(--rl);box-shadow:var(--sh-card);padding:1.05rem 1.3rem}
.blg-note__ic{flex:none;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;
  background:var(--accent-s);color:var(--accent)}
.blg-note__ic svg{width:18px;height:18px}
.blg-note p{margin:0;color:var(--text);font-size:.93rem;line-height:1.62}
.blg-note strong{color:var(--ink)}
.blg-note__meta{margin-top:.5rem!important;color:var(--light);font-size:.82rem;line-height:1.5}

/* ═══════════════ FAQ (navazuje na globální .faq) ═══════════════ */
.blg-faq{max-width:820px;margin-inline:auto}
.blg-faq .faq-item{background:var(--white);border:1px solid var(--line);border-radius:var(--rl);
  margin-bottom:.7rem;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.blg-faq .faq-item.open{border-color:rgba(14,111,69,.22);box-shadow:var(--sh-card)}
.blg-faq .faq-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.1rem 1.3rem;background:none;border:0;cursor:pointer;text-align:left;font-family:inherit;
  font-size:1.03rem;font-weight:680;color:var(--ink);line-height:1.4;transition:color .2s}
.blg-faq .faq-btn:hover{color:var(--accent)}
.blg-faq .faq-btn__plus{position:relative;flex:none;width:28px;height:28px;border-radius:8px;
  background:var(--bg);border:1.5px solid var(--line-s);transition:all .3s}
.blg-faq .faq-btn__plus::before,.blg-faq .faq-btn__plus::after{content:"";position:absolute;top:50%;left:50%;
  background:var(--ink);border-radius:1px;transition:all .3s}
.blg-faq .faq-btn__plus::before{width:12px;height:2px;transform:translate(-50%,-50%)}
.blg-faq .faq-btn__plus::after{width:2px;height:12px;transform:translate(-50%,-50%)}
.blg-faq .faq-btn[aria-expanded="true"] .faq-btn__plus{background:var(--accent-s);border-color:var(--accent);
  transform:rotate(45deg)}
.blg-faq .faq-btn[aria-expanded="true"] .faq-btn__plus::before,
.blg-faq .faq-btn[aria-expanded="true"] .faq-btn__plus::after{background:var(--accent)}
.blg-faq .faq-body{height:0;overflow:hidden;transition:height .26s cubic-bezier(.4,0,.2,1);will-change:height}
.blg-faq .faq-body__inner{padding:0 1.3rem 1.2rem}
.blg-faq .faq-body__inner p{margin:0;color:var(--muted);line-height:1.72}
/* fallback bez JS: položka „open" je rozbalená */
.no-js .blg-faq .faq-body{height:auto}

/* ═══════════════ FINÁLNÍ CTA (tmavý) ═══════════════ */
.blg-cta-sec{padding-bottom:clamp(3.5rem,7vw,6rem)}
.blg-cta{position:relative;isolation:isolate;overflow:hidden;background:var(--navy);color:#fff;
  border-radius:var(--rxl);padding:clamp(2.2rem,5vw,3.6rem) clamp(1.6rem,4vw,3.2rem);text-align:center}
.blg-cta__glow{position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(680px 320px at 50% -30%,rgba(52,211,153,.22),transparent 60%),
    linear-gradient(180deg,var(--navy-2),var(--navy))}
.blg-cta__t{font-size:clamp(1.5rem,3.2vw,2.1rem);color:#fff;letter-spacing:-.03em;margin:0 0 .8rem}
.blg-cta__d{color:rgba(255,255,255,.8);line-height:1.7;max-width:60ch;margin:0 auto 1.6rem}
.blg-cta__btns{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;align-items:center}
.blg-cta__tel{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.4rem;border-radius:999px;
  border:1px solid rgba(255,255,255,.28);color:#fff;font-weight:700;font-size:.98rem;transition:all .2s}
.blg-cta__tel:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5);color:#fff}
.blg-cta__tel svg{stroke:var(--accent-glow)}

/* ═══════════════ REVEAL (volitelné, navazuje na .rv ze style.css) ═══════════════ */
.blg-sec .blg-quick,.blg-sec .blg-featured,.blg-sit,.blg-card,.blg-pop{will-change:auto}

/* ═══════════════ RESPONSIVE DOLADĚNÍ ═══════════════ */

/* ── HERO PORADNY ──
   Navazuje na globální breakpointy style.css:
   ≤1120px  .hero__inner → 1 sloupec, ale .hero__inner--vis (později v souboru,
            stejná specificita) dvousloupcový grid DRŽÍ → tady ho musíme zúžit,
            jinak by pravý sloupec byl příliš úzký a karty by lezly na text.
   ≤991.98px .vsn-deal → max 380px, centrovaný (globálně).
   ≤840px   .hero__inner → display:block (globálně) → text nad vizuálem.
   ≤575.98px .vsn-deal → max 300px (globálně). */

/* 992–1120 px: dvousloupcový hero zůstává, jen se zklidní poměr a mezera. */
@media(max-width:1120px){
  .blg-hero--poradna .hero__inner--vis{
    grid-template-columns:minmax(0,1fr) minmax(300px,360px);
    gap:clamp(28px,4vw,48px)}
}

/* ≤991.98 px: jeden sloupec — text PŘED vizuálem, vizuál vycentrovaný.
   .hero__inner--vis je stále grid (globální display:block přijde až na 840px),
   proto ho tady explicitně srovnáme na 1 sloupec. */
@media(max-width:991.98px){
  .blg-hero--poradna .hero__inner--vis{
    grid-template-columns:minmax(0,1fr);
    max-width:620px;margin-inline:auto}
  .blg-hero--poradna .hero__text{max-width:none}
  /* globální margin 5rem auto 2.25rem je počítaný na hero s tlačítky — zde zkrátíme */
  .blg-hero--poradna .hero__vis.vsn-deal{margin:2.6rem auto 1.4rem}
  /* Pruh 2 × 2 */
  .blg-hero--poradna .blg-trust{grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem 1.4rem}
}

/* ≤840 px: .hero__inner je globálně display:block → vizuál se centruje sám.
   min-height MUSÍME vynulovat explicitně: globální reset .hero{min-height:auto}
   (style.css, ≤840px) má stejnou specificitu (0,1,0) jako naše
   .blg-hero--poradna{min-height:600px}, ale poradna.css se načítá POZDĚJI
   → bez tohohle resetu by na mobilu zůstalo 600px a vzniklo mrtvé místo.
   Stejně to řeší i .jpv-banner (min-height:auto od 860px). */
@media(max-width:840px){
  .blg-hero--poradna{min-height:auto}
  .blg-hero--poradna .hero__vis.vsn-deal{margin:2.4rem auto 1.2rem}
}

/* Mobil: text vlevo, pruh čitelný, žádný horizontální scroll.
   .vsn-deal je uvnitř .wrap (padding 22px / 16px), karty --tri sedí na
   right:0 / left:0 → při max 300px šířce vizuálu zůstávají uvnitř wrapu. */
@media(max-width:575.98px){
  .blg-hero--poradna .hero__text{text-align:left}
  .blg-hero--poradna .blg-trust{padding-top:1.2rem;gap:.75rem 1.1rem}
  .blg-hero--poradna .blg-trust__item{font-size:.86rem;line-height:1.4}
}

/* Úzký mobil (390 / 360 px): 2 × 2 by lámalo text do 3 řádků → 1 × 4. */
@media(max-width:430px){
  .blg-hero--poradna .blg-trust{grid-template-columns:minmax(0,1fr);gap:.7rem}
  .blg-hero--poradna .blg-trust__item{font-size:.88rem}
}

@media(max-width:600px){
  .blg-search__field input{font-size:16px;padding:.85rem 2.6rem .85rem 2.8rem} /* iOS bez zoomu */
  .blg-filters{gap:.45rem}
  .blg-filter{padding:.45rem .75rem;font-size:.84rem}
}
@media(max-width:380px){
  /* Velikost H1 řídí globální .hero h1 (clamp) — přebít ji smí jen selektor
     se stejnou nebo vyšší specificitou; .blg-hero__title samo o sobě
     (0,1,0) by prohrálo s .hero h1 (0,1,1). Proto scope přes .blg-hero. */
  .blg-hero .blg-hero__title{font-size:1.85rem}
  .blg-cta__btns .btn-a,.blg-cta__tel{width:100%;justify-content:center}
}

/* ═══════════════════════════════════════════════════════════════════════
   DETAIL ČLÁNKU — /poradna/clanky/<slug>.php
   Prefix blg-art- . Staví na tokenech style.css. Čtecí sloupec max 760 px.
   Mobile-first, bez horizontálního scrollu, tabulky responzivní.
   ═══════════════════════════════════════════════════════════════════════ */

.blg-art-page{display:block}

/* ── Hero článku (tmavý, navazuje na .blg-hero) ── */
.blg-art-hero{position:relative;isolation:isolate;background:var(--navy);color:#fff;
  padding:calc(86px + clamp(2.2rem,4.5vw,3.2rem)) 0 clamp(2.2rem,4.5vw,3rem);overflow:hidden}
.blg-art-hero__ov{position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(1100px 480px at 80% -10%,rgba(52,211,153,.15),transparent 60%),
    radial-gradient(720px 400px at 0% 120%,rgba(14,111,69,.28),transparent 60%),
    linear-gradient(180deg,var(--navy),var(--navy-2))}
.blg-art-hero .blg-bc{margin-bottom:1.3rem}
.blg-art-hero__k{display:inline-block;margin-bottom:.8rem;padding:.32rem .7rem;border-radius:999px;
  background:rgba(52,211,153,.14);border:1px solid rgba(52,211,153,.28);
  color:var(--accent-glow);font-size:.66rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.blg-art-hero__title{font-size:clamp(1.7rem,4.2vw,2.65rem);font-weight:680;letter-spacing:-.035em;
  line-height:1.12;color:#fff;margin:0 0 1rem;max-width:22ch}
.blg-art-hero__meta{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;
  color:rgba(255,255,255,.66);font-size:.86rem;font-weight:600;margin:0 0 1.2rem}
.blg-art-hero__meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.6}
.blg-art-hero__rt{display:inline-flex;align-items:center;gap:.4rem}
.blg-art-hero__rt svg{stroke:var(--accent-glow)}
.blg-art-hero__lead{font-size:clamp(1.02rem,1.5vw,1.16rem);line-height:1.65;color:rgba(255,255,255,.82);
  max-width:62ch;margin:0;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.12)}

/* ── Tělo: čtecí sloupec ── */
.blg-art-body{padding-top:clamp(2.2rem,4.5vw,3.2rem)}
.blg-art{max-width:760px;margin-inline:auto}
.blg-art > h2{font-size:clamp(1.35rem,2.6vw,1.7rem);color:var(--ink);letter-spacing:-.03em;line-height:1.2;
  margin:2.6rem 0 .9rem;scroll-margin-top:90px}
.blg-art > h2:first-child{margin-top:0}
.blg-art > h3{font-size:clamp(1.08rem,1.9vw,1.25rem);color:var(--ink);letter-spacing:-.02em;line-height:1.3;
  margin:1.8rem 0 .7rem;scroll-margin-top:90px}
.blg-art p{font-size:1.05rem;line-height:1.82;color:var(--text);margin:0 0 1.1rem}
.blg-art a{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:2px;
  text-decoration-thickness:1px;text-decoration-color:rgba(14,111,69,.34)}
.blg-art a:hover{color:var(--accent-h);text-decoration-color:var(--accent-h)}
.blg-art strong{color:var(--ink);font-weight:700}
.blg-art ul,.blg-art ol{margin:0 0 1.2rem;padding-left:1.3rem}
.blg-art li{font-size:1.04rem;line-height:1.72;color:var(--text);margin-bottom:.5rem}
.blg-art li::marker{color:var(--accent)}

/* ── „Stručně" — citovatelný GEO/AI blok ── */
.blg-art-tldr{position:relative;background:var(--accent-s);border:1px solid rgba(14,111,69,.18);
  border-left:4px solid var(--accent);border-radius:var(--rl);
  padding:clamp(1.2rem,2.4vw,1.6rem) clamp(1.3rem,2.6vw,1.8rem);margin:0 0 1.8rem}
.blg-art-tldr__k{display:inline-flex;align-items:center;gap:.42rem;margin-bottom:.7rem;
  color:var(--accent);font-size:.7rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.blg-art-tldr__k svg{fill:none;stroke:var(--accent)}
.blg-art-tldr p{font-size:1.02rem;line-height:1.72;color:var(--text);margin:0 0 .55rem}
.blg-art-tldr p:last-child{margin-bottom:0}

/* ── Obsah „V článku" ── */
.blg-art-toc{background:var(--white);border:1px solid var(--line);border-radius:var(--rl);
  box-shadow:var(--sh);padding:1.1rem 1.3rem 1.2rem;margin:0 0 2.2rem}
.blg-art-toc__k{display:block;margin-bottom:.6rem;color:var(--light);font-size:.7rem;font-weight:850;
  letter-spacing:.12em;text-transform:uppercase}
.blg-art-toc ol{margin:0;padding:0;list-style:none;counter-reset:toc;
  display:grid;gap:.4rem}
.blg-art-toc li{counter-increment:toc;margin:0;font-size:.97rem;line-height:1.4}
.blg-art-toc li::marker{content:none}
.blg-art-toc a{display:inline-flex;gap:.6rem;color:var(--text);font-weight:600;text-decoration:none}
.blg-art-toc a::before{content:counter(toc,decimal-leading-zero);color:var(--accent);font-variant-numeric:tabular-nums;
  font-weight:800;flex:none}
.blg-art-toc a:hover{color:var(--accent)}

/* ── Checklist ── */
.blg-art-check{list-style:none!important;margin:1.4rem 0 1.6rem!important;padding:0!important;
  display:grid;gap:.7rem}
.blg-art-check li{position:relative;padding:.85rem 1rem .85rem 2.9rem;margin:0!important;
  background:var(--white);border:1px solid var(--line);border-radius:var(--rl);
  font-size:1rem;line-height:1.55;color:var(--text)}
.blg-art-check li::before{content:"";position:absolute;left:.85rem;top:.95rem;width:20px;height:20px;
  border-radius:50%;background:var(--accent-s);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230e6f45' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center}

/* ── Srovnávací / datová tabulka (responzivní, bez horiz. scrollu na webu) ── */
.blg-art-tablewrap{margin:1.5rem 0 1.7rem;overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}
.blg-tbl{width:100%;border-collapse:collapse;background:var(--white);font-size:.97rem;min-width:520px}
.blg-tbl caption{caption-side:bottom;padding:.7rem 1rem;color:var(--light);font-size:.82rem;text-align:left}
.blg-tbl th,.blg-tbl td{padding:.85rem 1rem;text-align:left;vertical-align:top;line-height:1.5;
  border-bottom:1px solid var(--line)}
.blg-tbl thead th{background:var(--navy);color:#fff;font-size:.82rem;font-weight:700;letter-spacing:.01em;
  border-bottom:0;position:sticky;top:0}
.blg-tbl tbody th{color:var(--ink);font-weight:700;background:var(--warm)}
.blg-tbl tbody tr:last-child th,.blg-tbl tbody tr:last-child td{border-bottom:0}
.blg-tbl tbody tr:hover td,.blg-tbl tbody tr:hover th{background:var(--accent-s)}

/* ── Rizikový / upozorňovací box ── */
.blg-art-risk{position:relative;background:#fff;border:1px solid var(--line);
  border-left:4px solid var(--amber);border-radius:var(--rl);
  padding:1.2rem 1.4rem;margin:1.6rem 0}
.blg-art-risk__k{display:inline-flex;align-items:center;gap:.42rem;margin-bottom:.5rem;
  color:var(--amber);font-size:.7rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.blg-art-risk__k svg{stroke:var(--amber)}
.blg-art-risk p{font-size:1rem;line-height:1.7;color:var(--text);margin:0 0 .6rem}
.blg-art-risk p:last-child{margin-bottom:0}

/* ── Definiční / informační box ── */
.blg-art-def{background:var(--warm);border:1px solid var(--line);border-radius:var(--rl);
  padding:1.15rem 1.4rem;margin:1.5rem 0}
.blg-art-def__t{display:block;font-weight:700;color:var(--ink);margin-bottom:.35rem;font-size:1.02rem}
.blg-art-def p{font-size:1rem;line-height:1.7;margin:0}

/* ── Související služba ── */
.blg-art-service-sec{padding-top:clamp(2.4rem,4.5vw,3.4rem)}
.blg-art-service{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem;
  background:linear-gradient(135deg,var(--navy-2),var(--navy));color:#fff;
  border-radius:var(--r);padding:clamp(1.6rem,3.2vw,2.4rem)}
.blg-art-service__k{display:inline-block;margin-bottom:.55rem;color:var(--accent-glow);
  font-size:.68rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.blg-art-service h2{color:#fff;font-size:clamp(1.3rem,2.4vw,1.7rem);letter-spacing:-.025em;margin:0 0 .6rem}
.blg-art-service p{color:rgba(255,255,255,.8);line-height:1.7;margin:0;max-width:62ch}
.blg-art-service__tx{flex:1;min-width:0}
@media(min-width:760px){
  .blg-art-service{flex-direction:row;align-items:center;justify-content:space-between;gap:2rem}
  .blg-art-service .btn-a{flex:none}
}

/* ── Související články (3 / 1 — bez 2-up kvůli orphanu) ── */
.blg-rel-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:880px){.blg-rel-grid{grid-template-columns:repeat(3,1fr);gap:18px}}
.blg-rel{display:flex;flex-direction:column;gap:.5rem;background:var(--white);border:1px solid var(--line);
  border-radius:var(--rl);padding:1.3rem 1.35rem;box-shadow:var(--sh-card);color:inherit;
  transition:box-shadow var(--trans),transform var(--trans),border-color var(--trans)}
.blg-rel:hover{box-shadow:var(--sh-lift);transform:translateY(-3px);border-color:rgba(14,111,69,.18)}
.blg-rel__cat{color:var(--accent);font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.blg-rel__title{font-size:1.06rem;font-weight:680;line-height:1.32;letter-spacing:-.02em;color:var(--ink)}
.blg-rel__more{display:inline-flex;align-items:center;gap:.4rem;margin-top:auto;padding-top:.5rem;
  color:var(--accent);font-weight:700;font-size:.9rem}
.blg-rel__more svg{width:14px;height:14px;transition:transform .25s}
.blg-rel:hover .blg-rel__more svg{transform:translate(2px,-2px)}

/* ── YMYL + odpovědnost za obsah ── */
.blg-art-note{display:grid;grid-template-columns:1fr;gap:18px;max-width:980px;margin-inline:auto}
@media(min-width:880px){.blg-art-note{grid-template-columns:1.4fr 1fr;gap:22px;align-items:start}}
.blg-art-note__ymyl{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--accent);
  border-radius:var(--rl);box-shadow:var(--sh-card);padding:clamp(1.3rem,2.6vw,1.8rem)}
.blg-art-note__k{display:inline-flex;align-items:center;gap:.42rem;margin-bottom:.6rem;color:var(--accent);
  font-size:.7rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.blg-art-note__k svg{fill:none;stroke:var(--accent)}
.blg-art-note__ymyl p{font-size:1rem;line-height:1.72;color:var(--text);margin:0 0 .8rem}
.blg-art-note__ymyl p:last-child{margin-bottom:0}
.blg-art-note__fine{font-size:.9rem!important;color:var(--muted)!important}
.blg-art-note__author{background:var(--white);border:1px solid var(--line);border-radius:var(--rl);
  box-shadow:var(--sh-card);padding:clamp(1.3rem,2.6vw,1.8rem)}
.blg-art-note__authorh{font-size:1.05rem;color:var(--ink);letter-spacing:-.02em;margin:0 0 .8rem}
.blg-art-note__author ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.blg-art-note__author li{font-size:.92rem;line-height:1.5;color:var(--muted)}
.blg-art-note__author strong{color:var(--ink);font-weight:680}

/* ── Responsivní doladění detailu ── */
@media(max-width:600px){
  .blg-art p,.blg-art li{font-size:1rem}
  .blg-art-hero__title{font-size:1.55rem}
  .blg-tbl{font-size:.9rem}
  .blg-tbl th,.blg-tbl td{padding:.7rem .8rem}
}