.cpmx-press-latest {
  --cpmx-latest-navy: #06145f;
  --cpmx-latest-blue: #0758c9;
  --cpmx-latest-sky: #1595de;
  --cpmx-latest-line: rgba(125, 179, 232, .42);
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(10px, 1.4vw, 18px);
  border: 1px solid rgba(7, 88, 201, .1);
  border-radius: 28px;
  background:
    radial-gradient(circle at 4% 8%, rgba(21, 149, 222, .12), transparent 27%),
    radial-gradient(circle at 96% 94%, rgba(6, 20, 95, .1), transparent 28%),
    linear-gradient(145deg, #f9fcff, #ffffff 48%, #f3f8ff);
  color: #ffffff;
  font-family: inherit;
}

.cpmx-press-latest *,
.cpmx-press-latest *::before,
.cpmx-press-latest *::after {
  box-sizing: border-box;
}

.cpmx-press-latest__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(290px, .95fr);
  grid-template-rows: repeat(2, minmax(220px, 1fr));
  gap: clamp(12px, 1.4vw, 18px);
  width: 100%;
  min-height: clamp(500px, 48vw, 640px);
}

.cpmx-press-latest__card {
  position: relative;
  overflow: hidden;
  min-width: 0;
  min-height: 0;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 21px;
  background: var(--cpmx-latest-navy);
  box-shadow: 0 16px 38px rgba(6, 20, 95, .15);
  transform: translateY(0);
  transition: border-color .24s ease, box-shadow .24s ease, transform .24s ease;
}

.cpmx-press-latest__card--featured {
  grid-row: 1 / span 2;
}

.cpmx-press-latest__grid--count-1 {
  grid-template-columns: minmax(0, 1fr);
}

.cpmx-press-latest__grid--count-1 .cpmx-press-latest__card--featured {
  grid-column: 1;
}

.cpmx-press-latest__grid--count-2 .cpmx-press-latest__card--compact {
  grid-row: 1 / span 2;
}

.cpmx-press-latest__card:hover {
  border-color: rgba(85, 186, 255, .82);
  box-shadow: 0 22px 48px rgba(6, 20, 95, .22);
  transform: translateY(-3px);
}

.cpmx-press-latest__card-link {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  height: 100%;
  min-height: 100%;
  border-radius: inherit;
  color: #ffffff;
  text-decoration: none;
}

.cpmx-press-latest__card-link::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(180deg, rgba(2, 9, 38, .08) 5%, rgba(2, 10, 43, .22) 38%, rgba(2, 9, 35, .92) 100%),
    linear-gradient(90deg, rgba(1, 27, 114, .2), transparent 62%);
  content: "";
  pointer-events: none;
}

.cpmx-press-latest__card--compact .cpmx-press-latest__card-link::after {
  background:
    linear-gradient(180deg, rgba(2, 9, 38, .14), rgba(2, 10, 38, .34) 36%, rgba(2, 9, 35, .94) 100%),
    linear-gradient(90deg, rgba(1, 27, 114, .28), transparent 80%);
}

.cpmx-press-latest__media {
  position: absolute;
  z-index: 0;
  overflow: hidden;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: inherit;
  background: linear-gradient(145deg, #eaf5ff, #d8eafe);
  clip-path: inset(0 round 20px);
}

.cpmx-press-latest .cpmx-press-latest__image {
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100%;
  margin: 0 !important;
  border: 0;
  border-radius: inherit;
  filter: saturate(1) contrast(1);
  object-fit: cover !important;
  object-position: 50% 50% !important;
  transition: filter .3s ease;
}

.cpmx-press-latest__card:hover .cpmx-press-latest__image {
  filter: saturate(1.07) contrast(1.03);
}

.cpmx-press-latest .cpmx-press-latest__image--contain {
  padding: clamp(34px, 7vw, 92px);
  background: linear-gradient(145deg, #ffffff, #edf6ff);
  object-fit: contain !important;
}

.cpmx-press-latest__media.has-image-error {
  display: grid;
  background:
    radial-gradient(circle at 50% 50%, rgba(21, 149, 222, .26), transparent 32%),
    linear-gradient(145deg, #0b3a82, #06145f);
  place-items: center;
}

.cpmx-press-latest__media.has-image-error::after {
  max-width: 220px;
  color: rgba(255, 255, 255, .82);
  content: "COPARMEX CDMX";
  font-size: 13px;
  font-weight: 850;
  letter-spacing: .14em;
  text-align: center;
}

.cpmx-press-latest__content {
  position: absolute;
  z-index: 2;
  display: flex;
  flex-direction: column;
  inset: 0;
  min-width: 0;
  padding: clamp(24px, 3.4vw, 46px);
  pointer-events: none;
}

.cpmx-press-latest__card--compact .cpmx-press-latest__content {
  padding: clamp(19px, 2.1vw, 28px);
}

.cpmx-press-latest__badge {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  min-height: 29px;
  padding: 6px 13px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(6, 20, 95, .96), rgba(7, 88, 201, .95));
  box-shadow: 0 8px 20px rgba(0, 0, 0, .17);
  color: #ffffff;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .11em;
  line-height: 1;
  text-transform: uppercase;
}

.cpmx-press-latest__title {
  display: -webkit-box;
  overflow: hidden;
  max-width: 860px;
  margin: auto 0 0;
  color: #ffffff;
  font-size: clamp(28px, 3.5vw, 48px);
  font-weight: 850;
  letter-spacing: -.03em;
  line-height: 1.12;
  overflow-wrap: anywhere;
  text-shadow: 0 3px 16px rgba(0, 0, 0, .45);
  text-wrap: balance;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.cpmx-press-latest__card--compact .cpmx-press-latest__title {
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.18;
  -webkit-line-clamp: 3;
}

.cpmx-press-latest__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px 17px;
  margin-top: 16px;
  color: rgba(255, 255, 255, .9);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
}

.cpmx-press-latest__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.cpmx-press-latest__meta-item svg {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  fill: var(--cpmx-latest-sky);
}

.cpmx-press-latest__meta-item strong {
  color: #ffffff;
  font-weight: 750;
}

.cpmx-press-latest__arrow {
  position: absolute;
  z-index: 3;
  top: 24px;
  right: 24px;
  display: grid;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, .34);
  border-radius: 50%;
  background: rgba(255, 255, 255, .13);
  color: #ffffff;
  font-size: 20px;
  opacity: 0;
  place-items: center;
  transform: translateX(-5px);
  transition: background-color .2s ease, opacity .2s ease, transform .2s ease;
}

.cpmx-press-latest__card:hover .cpmx-press-latest__arrow,
.cpmx-press-latest__card-link:focus-visible .cpmx-press-latest__arrow {
  background: rgba(21, 149, 222, .82);
  opacity: 1;
  transform: translateX(0);
}

.cpmx-press-latest__card--compact .cpmx-press-latest__arrow {
  top: 18px;
  right: 18px;
  width: 36px;
  height: 36px;
  font-size: 17px;
}

.cpmx-press-latest__card-link:focus-visible {
  outline: 4px solid rgba(21, 149, 222, .72);
  outline-offset: -5px;
}

.cpmx-press-latest__empty {
  display: grid;
  width: 100%;
  min-height: 260px;
  padding: 42px 24px;
  border: 1px solid rgba(7, 88, 201, .18);
  border-radius: 21px;
  background: linear-gradient(145deg, #ffffff, #eef7ff);
  color: #5b6b80;
  place-content: center;
  text-align: center;
}

.cpmx-press-latest__empty strong {
  color: var(--cpmx-latest-navy);
  font-size: clamp(22px, 3vw, 31px);
}

.cpmx-press-latest__empty span {
  margin-top: 9px;
  line-height: 1.6;
}

.cpmx-press-latest__screen-reader {
  position: absolute !important;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Tableta */
@media (max-width: 1024px) {
  .cpmx-press-latest__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto auto;
    min-height: 0;
  }

  .cpmx-press-latest__card--featured {
    grid-column: 1 / -1;
    grid-row: auto;
    min-height: clamp(390px, 55vw, 520px);
  }

  .cpmx-press-latest__card--compact {
    grid-row: auto !important;
    min-height: clamp(270px, 36vw, 340px);
  }

  .cpmx-press-latest__grid--count-2 .cpmx-press-latest__card--compact {
    grid-column: 1 / -1;
  }
}

/* Celular */
@media (max-width: 680px) {
  .cpmx-press-latest {
    padding: 9px;
    border-radius: 20px;
  }

  .cpmx-press-latest__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 11px;
  }

  .cpmx-press-latest__card {
    grid-column: 1 !important;
    border-radius: 17px;
  }

  .cpmx-press-latest__card--featured {
    min-height: clamp(390px, 122vw, 520px);
  }

  .cpmx-press-latest__card--compact {
    min-height: clamp(265px, 76vw, 350px);
  }

  .cpmx-press-latest__media {
    clip-path: inset(0 round 16px);
  }

  .cpmx-press-latest__content,
  .cpmx-press-latest__card--compact .cpmx-press-latest__content {
    padding: 22px;
  }

  .cpmx-press-latest__title {
    font-size: clamp(26px, 8.4vw, 36px);
  }

  .cpmx-press-latest__card--compact .cpmx-press-latest__title {
    font-size: clamp(22px, 7vw, 29px);
  }

  .cpmx-press-latest__arrow {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cpmx-press-latest__card,
  .cpmx-press-latest__image,
  .cpmx-press-latest__arrow {
    transition-duration: .01ms !important;
  }
}
