/* ===== Magazine Layout (mod_articles override) ===== */

.magazine-layout .mag-link{
  text-decoration:none;
  display:block;
}

/* TOP: 1 groß + 4 klein */
.magazine-layout .mag-top{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  grid-template-areas:
    "hero a b"
    "hero c d";
  gap:24px;
  align-items:start;
}

.magazine-layout .mag-top .mag-item:nth-child(1){ grid-area: hero; }
.magazine-layout .mag-top .mag-item:nth-child(2){ grid-area: a; }
.magazine-layout .mag-top .mag-item:nth-child(3){ grid-area: b; }
.magazine-layout .mag-top .mag-item:nth-child(4){ grid-area: c; }
.magazine-layout .mag-top .mag-item:nth-child(5){ grid-area: d; }

/* Bild stabil (auch wenn manche Artikel kein Bild hätten) */
.magazine-layout .mag-image{
  width:100%;
  overflow:hidden;
  border-radius:12px;
  background:#f2f2f2;
  aspect-ratio:16/9;
}

.magazine-layout .mag-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Titel */
.magazine-layout .mag-title{
  margin:10px 0 0 0;
  line-height:1.2;
  font-size:clamp(1rem, 0.9rem + 0.6vw, 1.35rem);
}

.magazine-layout .mag-hero .mag-title{
  font-size:clamp(1.6rem, 1.2rem + 1.6vw, 2.6rem);
  line-height:1.08;
}

/* Meta-Zeile */
.magazine-layout .mag-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
  font-size:0.9rem;
  opacity:0.85;
}

.magazine-layout .mag-avatar{
  width:28px;
  height:28px;
  border-radius:50%;
  object-fit:cover;
}

.magazine-layout .mag-author{
  font-weight:600;
}

.magazine-layout .mag-category{
  color:#1e5bb8;
}

.magazine-layout .mag-sep{
  opacity:0.5;
}

.magazine-layout .mag-date,
.magazine-layout .mag-reading{
  white-space:nowrap;
}

/* Introtext nur beim Hero, kleiner */
.magazine-layout .mag-intro{
  margin-top:10px;
  font-size:0.95rem;
  line-height:1.45;
  max-width:48ch;
}

/* Unteres Grid: 3 Spalten */
.magazine-layout .mag-grid{
  margin-top:28px;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}

/* ===== Responsive ===== */
@media (max-width: 992px){
  .magazine-layout .mag-top{
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "hero hero"
      "a b"
      "c d";
  }
  .magazine-layout .mag-grid{
    grid-template-columns:repeat(2, 1fr);
  }
  .magazine-layout .mag-hero .mag-title{
    font-size:clamp(1.4rem, 1.1rem + 1.2vw, 2rem);
  }
}

@media (max-width: 576px){
  .magazine-layout .mag-top{
    grid-template-columns:1fr;
    grid-template-areas:
      "hero"
      "a"
      "b"
      "c"
      "d";
  }
  .magazine-layout .mag-grid{
    grid-template-columns:1fr;
  }
  .magazine-layout .mag-title{
    font-size:1.1rem;
    line-height:1.25;
  }
  .magazine-layout .mag-hero .mag-title{
    font-size:1.6rem;
    line-height:1.15;
  }
}

/* Mobile-Reduktion der Meta: nur Datum + Lesezeit */
@media (max-width: 600px){
  .magazine-layout .mag-avatar,
  .magazine-layout .mag-author,
  .magazine-layout .mag-category{
    display:none;
  }
}