/* Aktuality — detail článku. Zložené 23. 9. 2026 z 10 vrstiev štýlov, ktoré predtým
   vkladal blog-detail-renderer.js cez JavaScript, v presnom poradí z DOM živého webu. Obsah článku
   teraz skladá server (server/sekcie/clanok.js). Vrstvy: v170-blog-detail-style, v170-blog-detail-final-style, v170-video-detail-poster-style, v170-article-media-final-style, v171-article-image-natural-fit-style, v172-article-natural-image-style, v173-article-reasonable-image-style, v175-native-video-style, v227-article-gallery-style, v181-article-sidebar-style (od 8. 11. 2026 bez bočného panela). */

/* --- v170-blog-detail-style --- */
.breadcrumbs strong.v170-current-crumb{color:var(--muted)!important}
.article-main-pro{background:#fff!important;border:1px solid #eee!important;border-radius:var(--r-md)!important;box-shadow:var(--shadow-md)!important;padding:clamp(26px,4vw,52px)!important}
.article-main-pro h1{font-size:var(--fs-display)!important;line-height:1.06!important;margin:0 0 18px!important;color:var(--black)!important;letter-spacing:-.03em!important}
.article-lead-pro{font-size:var(--fs-xl)!important;line-height:1.62!important;color:var(--muted)!important;max-width:820px!important;margin:0 0 28px!important}
.blog-meta{color:var(--orange-text)!important;font-weight:var(--fw-heavy)!important;margin-bottom:16px!important}
.article-media-pro{display:grid!important;grid-template-columns:1fr!important;gap:22px!important;margin:30px auto 38px!important;width:min(100%,860px)!important}
.article-media-card,
.article-block-image{width:100%!important;aspect-ratio:16/9!important;background:#fff!important;border:1px solid #ecece3!important;border-radius:var(--r-md)!important;overflow:hidden!important;box-shadow:var(--shadow-md)!important;display:grid!important;place-items:center!important;margin:0 auto!important}
.article-image-card img,.article-block-image img{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center center!important;background:#fff!important;padding:24px!important;box-sizing:border-box!important;display:block!important;margin:auto!important}
.article-video-card{background:#111!important}
.article-video-card iframe,
.article-video-card video{width:100%!important;height:100%!important;border:0!important;display:block!important}
.article-text-pro{max-width:800px!important;font-size:var(--fs-lg)!important;line-height:1.78!important;color:var(--text)!important;text-wrap:pretty!important}
.article-text-pro p{margin:0 0 20px!important}
.article-blocks-pro{max-width:860px!important;display:grid!important;gap:24px!important;margin:26px auto 34px!important}
.article-block-heading{font-size:var(--fs-h2)!important;color:var(--green)!important;margin:18px 0 0!important}
.article-block-caption{font-size:var(--fs-sm)!important;color:var(--muted)!important;margin-top:8px!important;text-align:center!important}
@media(max-width:760px){.article-main-pro{padding:24px!important}.article-media-pro,.article-blocks-pro{max-width:100%!important}.article-text-pro{font-size:var(--fs-lg)!important}}

/* --- v170-blog-detail-final-style --- */
    #dynamic-article-root .article-main-pro{background:#fff!important;border:1px solid #eee!important;border-radius:var(--r-md)!important;box-shadow:var(--shadow-md)!important;padding:clamp(26px,4vw,52px)!important}
    #dynamic-article-root .blog-meta,#dynamic-article-root h1,#dynamic-article-root .article-lead-pro,#dynamic-article-root .article-text-pro,#dynamic-article-root .tags,#dynamic-article-root .article-main-pro > p{
      width:min(100%,860px)!important;max-width:860px!important;margin-left:auto!important;margin-right:auto!important
    }
    #dynamic-article-root h1{font-size:var(--fs-display)!important;line-height:1.06!important;margin-top:0!important;margin-bottom:18px!important;color:var(--black)!important;letter-spacing:-.03em!important}
    #dynamic-article-root .article-lead-pro{font-size:var(--fs-xl)!important;line-height:1.62!important;color:var(--muted)!important;margin-bottom:28px!important}
    #dynamic-article-root .blog-meta{color:var(--orange-text)!important;font-weight:var(--fw-heavy)!important;margin-bottom:16px!important}
    #dynamic-article-root .article-media-pro,#dynamic-article-root .article-blocks-pro{width:min(100%,860px)!important;max-width:860px!important;margin:30px auto 38px!important;display:grid!important;grid-template-columns:1fr!important;gap:24px!important}
    #dynamic-article-root .article-media-pro figure,#dynamic-article-root .article-blocks-pro figure{width:100%!important;margin:0!important}
    #dynamic-article-root .article-media-card,
#dynamic-article-root .article-video-card,
#dynamic-article-root .article-block-image{
      width:100%!important;max-width:860px!important;aspect-ratio:16/9!important;height:auto!important;background:#fff!important;border:1px solid #ecece3!important;border-radius:var(--r-md)!important;overflow:hidden!important;box-shadow:var(--shadow-md)!important;display:grid!important;place-items:center!important;margin:0 auto!important
    }
    
    #dynamic-article-root .article-image-card img,#dynamic-article-root .article-block-image img{
      width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center center!important;background:#fff!important;padding:24px!important;box-sizing:border-box!important;display:block!important;margin:0!important
    }
    #dynamic-article-root .article-video-card iframe,
#dynamic-article-root .article-video-card video{width:100%!important;height:100%!important;border:0!important;display:block!important}
                    #dynamic-article-root .article-text-pro{max-width:860px!important;font-size:var(--fs-lg)!important;line-height:1.78!important;color:var(--text)!important;text-wrap:pretty!important}
    #dynamic-article-root .article-text-pro p{margin:0 0 20px!important;text-align:left!important}   /* nie do bloku: na mobile diery medzi slovami (audit 1. 10. 2026) */
    #dynamic-article-root .article-block-heading{width:min(100%,860px)!important;margin:18px auto 0!important;font-size:var(--fs-h2)!important;color:var(--green)!important}
    #dynamic-article-root .article-block-caption{font-size:var(--fs-sm)!important;color:var(--muted)!important;margin-top:8px!important;text-align:center!important}
    @media(max-width:760px){#dynamic-article-root .article-main-pro{padding:24px!important}#dynamic-article-root .article-text-pro{font-size:var(--fs-lg)!important}#dynamic-article-root .article-image-card img,#dynamic-article-root .article-block-image img{padding:14px!important}}

/* --- v170-video-detail-poster-style --- */
#dynamic-article-root .article-video-card{
        overflow:hidden!important;
      }
            
/* --- v170-article-media-final-style --- */
      #dynamic-article-root .article-media-card,
#dynamic-article-root .article-image-card,
#dynamic-article-root .article-block-image,
#dynamic-article-root .article-video-card{
        width:100%!important;
        max-width:860px!important;
        aspect-ratio:16/9!important;
        height:auto!important;
        border-radius:var(--r-md)!important;
        overflow:hidden!important;
        display:grid!important;
        place-items:center!important;
        margin:0 auto!important;
      }
      #dynamic-article-root .article-image-card,
      #dynamic-article-root .article-block-image{
        background:#fff!important;
      }
      #dynamic-article-root .article-image-card img,
      #dynamic-article-root .article-block-image img,
      #dynamic-article-root .v170-fit-image{
        width:100%!important;
        height:100%!important;
        max-width:100%!important;
        max-height:100%!important;
        object-fit:contain!important;
        object-position:center center!important;
        padding:32px!important;
        box-sizing:border-box!important;
        background:#fff!important;
        display:block!important;
        margin:0!important;
      }
      #dynamic-article-root .article-video-card{
        background:#111!important;
        display:block!important;
      }
                              @media(max-width:760px){
        #dynamic-article-root .article-image-card img,
        #dynamic-article-root .article-block-image img,
        #dynamic-article-root .v170-fit-image{padding:18px!important}
              }

/* --- v171-article-image-natural-fit-style --- */
#dynamic-article-root .article-media-pro,
      #dynamic-article-root .article-blocks-pro{
        width:min(100%,860px)!important;
        max-width:860px!important;
        margin-left:auto!important;
        margin-right:auto!important;
      }
      
      
      #dynamic-article-root .article-image-card.fit-contain img,
      #dynamic-article-root .article-block-image img{object-fit:contain!important}
      #dynamic-article-root .article-image-card.fit-scale-down img{object-fit:scale-down!important}
      
      
      @media(max-width:760px){
        #dynamic-article-root .article-image-card.fit-contain img,
        #dynamic-article-root .article-image-card.fit-scale-down img,
        #dynamic-article-root .article-block-image img{max-height:72vh!important}
      }

/* --- v172-article-natural-image-style --- */
#dynamic-article-root .article-image-card.fit-contain,
        #dynamic-article-root .article-image-card.fit-scale-down{
          aspect-ratio:auto!important;
          height:auto!important;
          min-height:0!important;
          max-height:none!important;
          overflow:visible!important;
          display:block!important;
          background:#fff!important;
          border-radius:var(--r-md)!important;
        }
        #dynamic-article-root .article-image-card.fit-contain img,
        #dynamic-article-root .article-image-card.fit-scale-down img,
        #dynamic-article-root .article-image-card.fit-contain .v170-fit-image,
        #dynamic-article-root .article-image-card.fit-scale-down .v170-fit-image{
          width:100%!important;
          height:auto!important;
          max-width:100%!important;
          max-height:none!important;
          min-height:0!important;
          object-position:center center!important;
          padding:0!important;
          margin:0 auto!important;
          background:#fff!important;
          display:block!important;
          box-sizing:border-box!important;
        }
        #dynamic-article-root .article-image-card.fit-contain img,
        #dynamic-article-root .article-image-card.fit-contain .v170-fit-image{object-fit:contain!important}
        
        
        

/* --- v173-article-reasonable-image-style --- */
#dynamic-article-root .article-media-pro{
        width:min(100%,760px)!important;
        max-width:760px!important;
        margin:28px auto 34px!important;
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:24px!important;
      }
      #dynamic-article-root .article-media-pro figure{
        width:100%!important;
        margin:0!important;
      }
      #dynamic-article-root .article-image-card.fit-contain,
      #dynamic-article-root .article-image-card.fit-scale-down,
      #dynamic-article-root .article-block-image{
        width:100%!important;
        max-width:760px!important;
        height:clamp(360px,58vh,620px)!important;
        max-height:620px!important;
        min-height:280px!important;
        aspect-ratio:auto!important;
        overflow:hidden!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        padding:16px!important;
        box-sizing:border-box!important;
        background:#fff!important;
        border:1px solid #ecece3!important;
        border-radius:var(--r-md)!important;
        box-shadow:var(--shadow-md)!important;
        margin:0 auto!important;
      }
      #dynamic-article-root .article-image-card.fit-contain img,
      #dynamic-article-root .article-image-card.fit-scale-down img,
      #dynamic-article-root .article-block-image img,
      #dynamic-article-root .article-image-card.fit-contain .v170-fit-image,
      #dynamic-article-root .article-image-card.fit-scale-down .v170-fit-image,
      #dynamic-article-root .article-block-image .v170-fit-image{
        width:100%!important;
        height:100%!important;
        max-width:100%!important;
        max-height:100%!important;
        object-fit:contain!important;
        object-position:center center!important;
        padding:0!important;
        margin:0!important;
        display:block!important;
        background:#fff!important;
        box-sizing:border-box!important;
        transform:none!important;
      }
      #dynamic-article-root .article-image-card.fit-scale-down img,
      #dynamic-article-root .article-image-card.fit-scale-down .v170-fit-image{object-fit:scale-down!important}
      #dynamic-article-root .article-image-card.fit-cover{
        width:100%!important;
        max-width:860px!important;
        aspect-ratio:16/9!important;
        height:auto!important;
        overflow:hidden!important;
        display:grid!important;
        place-items:center!important;
      }
      #dynamic-article-root .article-image-card.fit-cover img{
        width:100%!important;
        height:100%!important;
        max-width:100%!important;
        max-height:100%!important;
        object-fit:cover!important;
        object-position:center center!important;
        padding:0!important;
        margin:0!important;
      }
      #dynamic-article-root .article-video-card{
        width:100%!important;
        max-width:860px!important;
        aspect-ratio:16/9!important;
        height:auto!important;
        margin:0 auto!important;
      }
      @media(max-width:760px){
        #dynamic-article-root .article-media-pro{width:100%!important;max-width:100%!important;margin:22px auto 28px!important}
        #dynamic-article-root .article-image-card.fit-contain,
        #dynamic-article-root .article-image-card.fit-scale-down,
        #dynamic-article-root .article-block-image{
          height:clamp(260px,56vh,480px)!important;
          min-height:220px!important;
          padding:12px!important;
        }
      }

/* --- v175-native-video-style --- */
#dynamic-article-root .article-video-native,
      #dynamic-article-root .article-video-card.article-video-native{
        width:100%!important;
        max-width:860px!important;
        aspect-ratio:16/9!important;
        height:auto!important;
        min-height:0!important;
        background:#111!important;
        overflow:hidden!important;
        display:block!important;
        padding:0!important;
        margin:0 auto!important;
      }
      #dynamic-article-root .article-video-native iframe,
      #dynamic-article-root .article-video-native video{
        width:100%!important;
        height:100%!important;
        min-height:0!important;
        border:0!important;
        display:block!important;
        background:#111!important;
      }

/* --- v227-article-gallery-style --- */
#dynamic-article-root .article-gallery-pro{width:min(100%,960px);margin:34px auto 38px;padding-top:18px;border-top:1px solid #eee}#dynamic-article-root .article-gallery-pro h2{font-size:var(--fs-h2);color:var(--green);margin:0 0 18px}#dynamic-article-root .article-gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}#dynamic-article-root .article-gallery-grid figure{margin:0;background:#fff;border:1px solid #ecece3;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-md)}#dynamic-article-root .article-gallery-grid a{display:grid;place-items:center;aspect-ratio:4/3;background:#fff}#dynamic-article-root .article-gallery-grid img{width:100%;height:100%;object-fit:contain;padding:14px;box-sizing:border-box;display:block}#dynamic-article-root .article-gallery-grid figcaption{font-size:var(--fs-sm);color:var(--muted);text-align:center;padding:9px 12px;border-top:1px solid #f0f0ea}@media(max-width:700px){#dynamic-article-root .article-gallery-grid{grid-template-columns:1fr}}

/* --- v181-article-sidebar-style --- */
#dynamic-article-root{margin:0 auto!important} /* šírka ako ostatné stránky (predtým 1220 px) */
      /* jeden stĺpec bez bočného panela (8. 11. 2026); pod článkom výzva a 3 ďalšie články v tej istej šírke */
      #dynamic-article-root .article-detail-layout-v181{display:block!important;width:100%!important;max-width:880px!important;margin:0 auto!important}
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro{min-width:0!important;padding:clamp(24px,3.2vw,42px)!important}
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .blog-meta,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro h1,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .article-lead-pro,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .article-text-pro,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .tags,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .clanok-vyzva,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .zdielanie,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .article-gallery-pro,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro .clanok-referencie,
      #dynamic-article-root .article-detail-layout-v181 .article-main-pro > p{width:100%!important;max-width:720px!important;margin-left:auto!important;margin-right:auto!important}
      #dynamic-article-root .article-detail-layout-v181 .article-media-pro,
      #dynamic-article-root .article-detail-layout-v181 .article-blocks-pro{width:100%!important;max-width:720px!important;margin-left:auto!important;margin-right:auto!important}
      #dynamic-article-root .article-detail-layout-v181 .article-media-card,
#dynamic-article-root .article-detail-layout-v181 .article-image-card,
#dynamic-article-root .article-detail-layout-v181 .article-block-image,
#dynamic-article-root .article-detail-layout-v181 .article-video-card{max-width:720px!important}
      #dynamic-article-root .article-detail-layout-v181 h1{font-size:var(--fs-display)!important}
      @media(max-width:760px){
        #dynamic-article-root .article-detail-layout-v181 .article-main-pro{padding:22px!important}
      }

/* --- výsledok JS úprav obrázkov (applyV172NaturalImageFix, potom applyV173ArticleReasonableImageFix;
       pri zhode vyhráva v173). Predtým element.style s MutationObserverom, teraz CSS. --- */
html body #dynamic-article-root .article-image-card.fit-contain,
html body #dynamic-article-root .article-image-card.fit-scale-down,
html body #dynamic-article-root .article-block-image{
  width:100%!important;max-width:760px!important;height:clamp(360px,58vh,620px)!important;max-height:620px!important;min-height:280px!important;
  aspect-ratio:auto!important;overflow:hidden!important;display:flex!important;align-items:center!important;justify-content:center!important;
  padding:16px!important;box-sizing:border-box!important;background:#fff!important}
html body #dynamic-article-root .article-image-card.fit-contain img,
html body #dynamic-article-root .article-image-card.fit-scale-down img,
html body #dynamic-article-root .article-block-image img{
  width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;min-height:0!important;
  object-fit:contain!important;object-position:center center!important;padding:0!important;margin:0!important;display:block!important;
  transform:none!important;box-sizing:border-box!important}
html body #dynamic-article-root .article-image-card.fit-scale-down img{object-fit:scale-down!important}
/* Rám 16:9 obrázka s fit-cover nemal danú šírku — na 360 px sa roztiahol na 391 px
   a článok presahoval obrazovku (429 px; zmerané 14. 10. 2026 pri prvých článkoch s cover). Šírka vedie, výška z pomeru. */
html body #dynamic-article-root .article-image-card.fit-cover{width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:16/9!important;overflow:hidden!important}
html body #dynamic-article-root .article-image-card.fit-cover img{width:100%!important;height:100%!important;object-fit:cover!important;padding:0!important;margin:0!important}

/* Hlavný nadpis a úvodný odsek článku ako na ostatných stránkach (Ivan 14. 10. 2026: „po rozkliknutí článku sa mi zdá písmo textu
   iné ako inde na webe"). Písmo je rovnaké (Manrope / Inter), ale H1 mal 52 px čierny (--fs-display — veľkosť úvodného slajdu)
   namiesto 40 px zeleného ako H1 každej stránky (.nadpis-stranky), úvodný odsek 20 px namiesto 18 px. Veľkosť podľa roly. */
html body #dynamic-article-root .article-detail-layout-v181 .article-main-pro h1{font-size:var(--fs-h1)!important;line-height:1.2!important;color:var(--green)!important;letter-spacing:-.04em!important}
html body #dynamic-article-root .article-detail-layout-v181 .article-main-pro .article-lead-pro{font-size:var(--fs-lg)!important;line-height:1.65!important}

/* Celý obrázok (contain, scale-down) v ráme 16 : 9 ako pri cover: obrázok celý v strede, zvyšok rámu ten istý obrázok zväčšený
   a rozmazaný (Ivan 14. 10. 2026; predtým rám 360–620 px vysoký s bielym okrajom 16 px — výška podľa okna, nie podľa obrázka). */
html body #dynamic-article-root .article-media-pro .article-image-card.fit-contain,
html body #dynamic-article-root .article-media-pro .article-image-card.fit-scale-down{width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:16/9!important;padding:0!important;border:0!important;box-shadow:none!important;position:relative!important;overflow:hidden!important;background:#e9ebe4!important}
html body #dynamic-article-root .article-media-pro .article-image-card img.obr-pozadie{position:absolute!important;inset:-6%!important;width:112%!important;height:112%!important;max-width:none!important;max-height:none!important;object-fit:cover!important;filter:blur(28px) saturate(1.15) brightness(.9);z-index:0}
html body #dynamic-article-root .article-media-pro .article-image-card img.v170-fit-image{position:relative!important;z-index:1;border:0!important;box-shadow:none!important;background:transparent!important}

/* Skúsenosť zákazníka v článku o projekte (5. 11. 2026, server/referencie-clanky.js) — citát referencie, ktorá na článok ukazuje. */
#dynamic-article-root .clanok-referencie{width:min(100%,960px);margin:34px auto 0;padding-top:18px;border-top:1px solid #eee}#dynamic-article-root .clanok-referencie h2{font-size:var(--fs-h2);color:var(--green);margin:0 0 18px}#dynamic-article-root .clanok-referencia{margin:0 0 16px;padding:22px 26px;background:#fafaf7;border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:var(--r-md)}#dynamic-article-root .clanok-referencia blockquote{margin:0;font-size:var(--fs-lg);line-height:1.6;color:var(--text)}#dynamic-article-root .clanok-referencia figcaption{margin-top:12px;display:flex;flex-direction:column;gap:2px}#dynamic-article-root .clanok-referencia figcaption span{color:var(--muted);font-size:var(--fs-sm)}
/* Fotka v galérii článku je klikateľná (zväčší sa) — pod myšou a pri fokuse sa nadvihne ako karta produktu (5. 11. 2026: prvé
   články s galériou, skusky/tlacidla.mjs „pod myšou sa nezmení"). */
#dynamic-article-root .article-gallery-grid figure{transition:transform .15s ease,border-color .15s ease}#dynamic-article-root .article-gallery-grid figure:hover,#dynamic-article-root .article-gallery-grid figure:focus-within{border-color:var(--orange);transform:translateY(-2px)}
/* Galéria: každá fotka v rovnakom ráme 4:3 (na výšku aj na šírku), riadok sa nenaťahuje podľa najvyššej fotky — predtým fotka
   na výšku natiahla celý riadok a fotky na šírku mali pod sebou prázdno (5. 11. 2026, článok Heger). */
#dynamic-article-root .article-gallery-grid{align-items:start}#dynamic-article-root .article-gallery-grid a{position:relative;overflow:hidden}#dynamic-article-root .article-gallery-grid a img{position:absolute;inset:0}
