/* =============================================================================
   Event Pills Restyle — FASE 1: sistema copertine (cornice automatica).
   Tutto scoped a .ep-cover: sicuro da caricare globalmente, non tocca il resto.
   Handoff §"Sistema copertine".
   ============================================================================= */

/* Cornice — identica per tutte e tre le famiglie */
.ep-cover {
  position: relative;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--pr-ink);
  overflow: hidden;
  margin: 0;
  background: var(--pr-cream-2);           /* famiglia A di default */
  border-radius: 0;                        /* restyling deliberatamente squadrato */
}
.ep-cover__media { position: absolute; inset: 0; }
.ep-cover__media img,
.ep-cover__media picture,
.ep-cover__media a {
  display: block;
  width: 100%;
  height: 100%;
}
.ep-cover__media img {
  object-fit: cover;
  object-position: center;
}

/* Banda redazionale nera in basso a sinistra: "[hub] · №[numero]" */
.ep-cover__band {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
  background: var(--pr-ink);
  color: #fff;
  padding: 6px 11px;                       /* cover grande / apertura / articolo */
  font-family: var(--font-display);
  font-weight: 900;
  font-size: max(0.875rem, 14px);
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .14em;
  pointer-events: none;
}

/* Famiglia C · foto duotone (navy + overlay arancio in multiply) */
.ep-cover--C { background: var(--ep-navy); }
.ep-cover--C .ep-cover__media img {
  filter: grayscale(1) contrast(1.05);     /* base per far leggere il duotone */
}
.ep-cover--C .ep-cover__duotone {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--pr-orange);
  mix-blend-mode: multiply;
  opacity: .28;
  pointer-events: none;
}

/* Scala banda nelle griglie/card (font 9px, padding ridotto) */
.ast-article-post .ep-cover__band,
.ep-card .ep-cover__band,
[class*="ast-grid"] .ep-cover__band {
  font-size: max(0.875rem, 14px);
  padding: 5px 9px;
}

/* Miniature molto piccole: banda omessa (handoff: 110x62 -> nessuna banda) */
.ep-cover.is-thumb .ep-cover__band { display: none; }

/* Hover card: sollevamento + ombra (solo dove la cover è dentro un link/card) */
@media (hover: hover) {
  a:hover > .ep-cover,
  .ep-card:hover .ep-cover {
    box-shadow: var(--sh-card-hover);
  }
}

/* =============================================================================
   Full-bleed dei template restyle: la testata (renderizzata a wp_body_open) e'
   a tutta larghezza, ma il contenuto sta dentro .ast-container che su MOBILE ha
   20px di gutter laterale -> le fasce scure (es. banda "DOSSIER") risultavano
   rientrate ai lati. Annullo il gutter per i soli contenitori restyle.
   ============================================================================= */
.ast-container:has(> .epr-home),
.ast-container:has(> .epr-pillar),
.ast-container:has(> .epr-single),
.ast-container:has(> .epr-archive),
.ast-container:has(> .epr-hub-wrap) {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
}