/* ====== UTIL ====== */
.screen-reader-text{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

/* ====== HERO ====== */
.brief-hero{padding:clamp(16px,4vw,40px) 0}
.brief-hero__inner{width:min(1200px,92vw);margin-inline:auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,32px);align-items:start}
.brief-hero__media-link{display:block;border-radius:16px;overflow:hidden}
.brief-hero__image{display:block;width:100%;height:auto;object-fit:cover;aspect-ratio:4/3}
.brief-hero__placeholder{width:100%;aspect-ratio:4/3;background:#f3f4f6;border-radius:16px}
.brief-hero__title{margin:0 0 8px;font-size:clamp(1.8rem,4vw,2.4rem);text-align: center; line-height:1.1; color: #001344;}
.brief-hero__subtitle{margin:0 0 16px;font-size:clamp(2rem,3.2vw,3rem);font-weight: 800;color:#001344; text-align: center;}
.brief-hero__tags{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-wrap:wrap;justify-content: center; gap:8px 12px}
.brief-hero__tag{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;background:#f9fafb;border:1px solid #e5e7eb;padding:6px 10px;border-radius:999px}
.brief-hero__tag-ico{width:8px;height:8px;border-radius:12px;background:currentColor;display:inline-block}
.brief-hero__cta{display:flex; justify-content: center; margin:0 0 14px;padding:12px 18px;border-radius:12px;text-transform: uppercase; background-color: #002990; font-weight:700;border:1px solid;color:#fff}
.brief-hero__cta:hover, .brief-hero__cta:focus{background-color: #fff; color: #001344; border-color: #001344;}
.brief-hero__desc{margin:0;font-size:16px;line-height:1.6;color:#1f2937}

/* ====== GRID ====== */
.brief-grid{padding:clamp(16px,4vw,40px) 0}
.brief-grid__inner{width:min(1200px,92vw);margin-inline:auto}
.brief-grid__list{list-style:none;padding:0;margin:0;display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.brief-grid__list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.brief-grid__list{grid-template-columns:repeat(5,minmax(0,1fr))}} /* 5 columnas en desktop */

.brief-card{position:relative}
.brief-card__link{display:block;text-decoration:none;color:inherit;border-radius:14px;overflow:hidden}
.brief-card__figure{position:relative;margin:0}
.brief-card__img,.brief-card__ph{display:block;width:100%;height:auto;object-fit:cover;aspect-ratio:5/7;transition:filter .3s ease,transform .3s ease}
.brief-card__ph{background:#e5e7eb}
.brief-card__overlay{position:absolute;inset:0;display:grid;place-items:center;padding:12px;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.55) 85%);color:#fff;opacity:0;transition:opacity .3s ease}
.brief-card__title{margin:0;font-size:clamp(14px,1.6vw,18px);line-height:1.25;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.brief-card__link:hover .brief-card__img,.brief-card__link:focus .brief-card__img{filter:brightness(.55) blur(1px);transform:scale(1.02)}
.brief-card__link:hover .brief-card__overlay,.brief-card__link:focus .brief-card__overlay{opacity:1}

/* Loading state */
#brief-grid.is-loading .brief-card__img{filter:grayscale(1) opacity(.7)}
#brief-grid.is-loading .brief-grid__list{pointer-events:none}

/* Paginación (usa output nativo de paginate_links con <ul class="page-numbers">) */
.page-numbers {margin: 0px;}
.brief-pagination{margin-top:20px;display:flex;justify-content:center}
.brief-pagination .page-numbers{display:flex;gap:8px;align-items:center}
.brief-pagination .page-numbers li{list-style:none}
.brief-pagination a.page-numbers,
.brief-pagination span.page-numbers{display:inline-block;padding:8px 12px;border:1px solid #e5e7eb;border-radius:10px;text-decoration:none;color:#111827;font-weight:600;font-size:14px}
.brief-pagination .page-numbers.current{background:#111827;color:#fff;border-color:#111827}
.brief-pagination a.page-numbers:hover{background:#f3f4f6}

/* Motion/accessibility */
@media (prefers-reduced-motion:reduce){
  .brief-card__img,.brief-card__overlay{transition:none}
}
@media (max-width:900px){
  .brief-hero__inner{grid-template-columns:1fr}
  .brief-hero__image{aspect-ratio:16/9}
}
