/* ==================================================================
   Blog a články — úprava nadpisové struktury (bod T-01 auditu)

   Původně byl H1 na všech devíti stránkách stejný: dekorativní SVG
   „Blogové články“ s textem schovaným přes display:none. Název článku
   byl až v H2. Pro vyhledávač tedy měly všechny články identický —
   a navíc prázdný — hlavní nadpis.

   Nově:
   – dekorativní SVG je obyčejný .sectionMark, ne nadpis
   – název článku je H1
   – na výpisu blogu zůstává H1 s SVG, ale text v něm je skrytý
     technikou, která ho ponechá čitelný pro vyhledávače i čtečky

   Vzhled se nemění. Selektory jsou přespecifikované, protože
   pravidla webu mají specificitu 0-2-2.
   ================================================================== */

/* Skrytí, které nechá text dostupný vyhledávačům a odečítačům
   obrazovky — na rozdíl od display:none. */
.visuallyHidden{
  position:absolute !important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/* ---------- detail článku ---------- */

/* Dekorativní SVG přebírá vzhled původního H1 */
section.blogDetail.blogPost .container .sectionMark{
  text-align:center;
  margin:0 0 2rem;
  line-height:0;
}
section.blogDetail.blogPost .container .sectionMark svg,
section.blogDetail.blogPost .container .sectionMark img{
  width:40rem;
  height:9rem;
  max-width:100%;
}

/* Název článku přebírá vzhled původního H2 */
section.blogDetail.blogPost .container h1{
  font:400 2.4rem/4rem 'Montserrat', sans-serif;
  color:#8F8F8F;
  text-transform:uppercase;
  letter-spacing:3px;
  text-align:center;
  max-width:90rem;
  margin:0 auto 4rem;
}

@media (max-width:639px){
  section.blogDetail.blogPost .container h1{
    font-size:2rem;
    line-height:3rem;
  }
}
@media (max-width:479px){
  section.blogDetail.blogPost .container h1{
    font-size:1.8rem;
  }
}

/* ---------- výpis blogu ---------- */
section.blogExtract.blogList .container h1 svg,
section.blogExtract.blogList .container h1 img{
  width:40rem;
  height:9rem;
  max-width:100%;
}