/*
  VAŽNO: Ovaj CSS se koristi ZAJEDNO s post-grid.css (koji mora biti
  učitan i za magazine widget, jer sve .cepg-* klase - kartica, badge,
  excerpt, paginacija sa spiralom - dolaze odatle).

  Ovdje su samo dodaci specifični za magazine: naslov sekcije, gumb
  i pravilo koje prvoj (featured) kartici daje širinu od 2 kolone.
*/

/* --- NASLOV SEKCIJE --- */
.magazine-heading {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 25px;
    color: #1B4B7C;
    text-transform: uppercase;
}

/* --- FEATURED KARTICA (širina 2 kolone) --- */
.cepg-grid .cepg-featured {
    grid-column: span 2;
}

/* Veća slika kod featured kartice radi boljeg omjera */
.cepg-grid .cepg-featured .cepg-img {
    height: 320px;
}

/* --- GUMB ISPOD GRIDA --- */
.magazine-footer {
    text-align: center;
    margin-top: 40px;
}

.magazine-button {
    display: inline-block;
    padding: 12px 28px;
    background: #005b99;
    color: #fff !important;
    text-decoration: none;
    font-weight: 700;
    border-radius: 6px;
    transition: background 0.3s ease;
}

.magazine-button:hover {
    background: #1B4B7C;
}

/* --- RESPONZIVNOST --- */
/* Na 2 kolone (tablet) featured ostaje pun red, izgleda skladno */
@media (max-width: 1024px) {
    .cepg-grid .cepg-featured {
        grid-column: span 2;
    }
}

/* Na mobitelu je grid 1 kolona - featured se svodi na normalnu širinu */
@media (max-width: 600px) {
    .cepg-grid .cepg-featured {
        grid-column: span 1;
    }
    .cepg-grid .cepg-featured .cepg-img {
        height: 230px;
    }
}