/* =========================================================
   DUDI — HOME BLOG
   Presne podľa finálnej verzie Design 04.
   Iba CSS. PHP override, /blog/, Príbehy ani index.php sa nemenia.
   ========================================================= */

.dudi-blog-home{
  width:100%;
  color:#20201e;
}

/* section-head z Design 04 */
.dudi-blog-home__head{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:clamp(40px,7vw,110px);
  align-items:end;
  margin-bottom:48px;
}

.dudi-blog-home__eyebrow,
.dudi-blog-home__category{
  font-family:"Inter",Arial,sans-serif;
  font-size:10px;
  font-weight:600;
  line-height:1.4;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#85817c;
}

.dudi-blog-home__head h2{
  margin:8px 0 0;
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(34px,3.8vw,56px);
  font-weight:400;
  line-height:1.04;
  letter-spacing:-.015em;
}

.dudi-blog-home__intro{
  max-width:720px;
  color:#74716d;
  font-size:14px;
  line-height:1.7;
}

.dudi-blog-home__intro p{
  margin:0;
}

/* ===== FINÁLNY BLOG RYTMUS Z DESIGN 04 ===== */
.dudi-blog-home__layout{
  display:block;
  border:0;
}

/* hlavný článok: FOTO | TEXT */
.dudi-blog-home__main{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
  gap:54px;
  align-items:center;
  padding:0 0 56px;
  border:0;
  border-bottom:1px solid #eceeef;
  background:transparent;
  color:inherit;
  text-decoration:none;
  overflow:visible;
}

.dudi-blog-home__main-image{
  height:390px;
  aspect-ratio:auto;
  overflow:hidden;
  background:#f1f1ef;
}

.dudi-blog-home__main-copy{
  padding:0;
  max-width:520px;
}

.dudi-blog-home__main h3{
  margin:8px 0 12px;
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(30px,2.8vw,42px);
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.015em;
  color:#20201e;
}

.dudi-blog-home__main p{
  max-width:500px;
  margin:0 0 18px;
  color:#74716d;
  font-size:13px;
  line-height:1.7;
}

/* dve menšie položky pod hlavným */
.dudi-blog-home__side{
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:none;
  gap:0;
  min-width:0;
}

.dudi-blog-home__card{
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  gap:38px;
  align-items:center;
  min-height:0;
  padding:42px 0;
  border:0;
  border-bottom:1px solid #eceeef;
  background:transparent;
  color:inherit;
  text-decoration:none;
  overflow:visible;
}

.dudi-blog-home__card-image{
  height:180px;
  min-height:0;
  overflow:hidden;
  background:#f1f1ef;
}

.dudi-blog-home__card-copy{
  padding:0;
  display:block;
  max-width:560px;
  min-width:0;
}

.dudi-blog-home__card h3{
  margin:7px 0 9px;
  font-family:"Newsreader",Georgia,serif;
  font-size:27px;
  font-weight:400;
  line-height:1.08;
  letter-spacing:-.015em;
  color:#20201e;
}

.dudi-blog-home__card p{
  margin:0;
  color:#74716d;
  font-size:13px;
  line-height:1.65;
}

.dudi-blog-home__main-image img,
.dudi-blog-home__card-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.9) contrast(.98);
  transition:transform .45s ease;
}

.dudi-blog-home__main:hover img,
.dudi-blog-home__card:hover img{
  transform:scale(1.015);
}

/* CTA hlavného článku */
.dudi-blog-home__cta{
  display:inline-flex;
  align-items:center;
  gap:13px;
  margin-top:2px;
  font-family:"Inter",Arial,sans-serif;
  font-size:10px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.dudi-blog-home__cta-box{
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#222;
  color:#fff;
  font-size:15px;
  line-height:1;
  transition:transform .22s ease,background .22s ease;
}

.dudi-blog-home__main:hover .dudi-blog-home__cta-box{
  transform:scale(1.08);
  background:#111;
}

/* ===== RESPONSIVE podľa Design 04 ===== */
@media(max-width:900px){
  .dudi-blog-home__head{
    grid-template-columns:1fr;
  }

  .dudi-blog-home__main{
    grid-template-columns:1fr;
    gap:24px;
  }

  .dudi-blog-home__main-image{
    height:340px;
  }

  .dudi-blog-home__main-copy{
    max-width:none;
  }

  .dudi-blog-home__card{
    grid-template-columns:220px 1fr;
    gap:28px;
  }
}

@media(max-width:720px){
  .dudi-blog-home__head{
    grid-template-columns:1fr;
    gap:22px;
    margin-bottom:34px;
  }

  .dudi-blog-home__main{
    padding-bottom:42px;
  }

  .dudi-blog-home__main-image{
    height:270px;
  }

  .dudi-blog-home__main-copy{
    padding:0;
  }

  .dudi-blog-home__card{
    grid-template-columns:1fr;
    gap:18px;
    padding:34px 0;
  }

  .dudi-blog-home__card-image{
    height:220px;
  }

  .dudi-blog-home__card-copy{
    padding:0;
    max-width:none;
  }

  .dudi-blog-home__card h3{
    font-size:24px;
  }
}


/* =========================================================
   WIDTH FIX — same content width as all Design 04 rail sections
   Design 04 final system:
   desktop content max-width: 1040px
   medium desktop: 980px
   <=900px: full available width
   ========================================================= */

@media(min-width:1181px){
  .dudi-blog-home{
    width:100%;
    max-width:1040px;
    margin:0;
  }
}

@media(min-width:901px) and (max-width:1180px){
  .dudi-blog-home{
    width:100%;
    max-width:980px;
    margin:0;
  }
}

@media(max-width:900px){
  .dudi-blog-home{
    width:100%;
    max-width:none;
    margin:0;
  }
}