/* Contenedor 1280px centrado */
.landing-noticias {
  max-width: 1280px;
  margin: 0 auto;
  padding: 1rem 1rem;
  position: relative;
  /* referencia para posicionar flechas */
}

/* Asegura que las flechas puedan sobresalir del carrusel */
.glide--noticias {
  overflow: visible;
}

/* importante */
.glide--noticias .glide__track {
  overflow: hidden;
}



/* sin paginación */

/* FLECHAS: fuera del carrusel, centradas verticalmente */
.glide--noticias .glide__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  width: 36px;
  /* ajusta tamaño del icono */
  height: 36px;
  padding: 0;
  z-index: 10;
  /* por si algún contenedor superpone */
  line-height: 0;
}

.glide--noticias .glide__arrow--left {
  left: -20px;
}

/* fuera del bloque */
.glide--noticias .glide__arrow--right {
  right: -48px;
}

/* fuera del bloque */

.glide--noticias .glide__arrow img {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  /* el click lo recibe el botón */
}

/* Slides/cajas más compactas, sin fondo */

/* El slide lo maneja Glide. Solo padding para aire. */
.glide--noticias .glide__slide {
  padding: 6px;
}

/* Limita la tarjeta dentro del slide a 600px y céntrala */
.noticia-card {
  max-width: 600px;
  width: 100%;
  margin-inline: auto;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 12px;
}

.noticia-card__content {
    padding: 10px 12px;
    display: grid;
    grid-template-rows: auto auto auto;
    gap: 10px;
}

.noticia-card__title {
  font-size: 1rem;
  margin: 0 0 4px;
}

.noticia-card__meta {
  font-size: .85rem;
  opacity: .6;
  margin-bottom: 6px;
  color: #B3B3B3;
}

.noticia-card__img {
  aspect-ratio: 16/9;
  object-fit: cover;
  background: none !important;
}

.noticia-card__img--empty {
  aspect-ratio: 16/9;
  background: none !important;
}

p.noticia-card__excerpt {
    font-size: 16px;
    color: var(--texto);
}

/* <= 1360px: flechas un poco más pequeñas y más cerca del track */
@media (max-width: 1360px) {
  .glide--noticias {
    --arrow-w: 32px;
    --outer-gap: 6px;
  }
}

/* <= 1024px: compactar un poco la UI */
@media (max-width: 1024px) {
  .landing-noticias {
    padding: .75rem .75rem;
  }

  .glide--noticias {
    --arrow-w: 28px;
    --outer-gap: 6px;
    --slide-gap: 12px;
  }

  .glide--noticias .glide__slide {
    padding: 5px;
  }

  .noticia-card__content {
    padding: 9px 10px;
  }

  .noticia-card__title {
    font-size: .95rem;
  }

  .noticia-card__meta {
    font-size: .8rem;
  }
}

/* <= 820px: aún más compacto, manteniendo 2 por slide */
@media (max-width: 820px) {
  .glide--noticias {
    --arrow-w: 26px;
    --outer-gap: 6px;
    --slide-gap: 10px;
  }

  .glide--noticias .glide__slide {
    padding: 4px;
  }
}

/* <= 680px: flechas pequeñas y menos gap entre slides */
@media (max-width: 680px) {
  .glide--noticias {
    --arrow-w: 24px;
    --outer-gap: 4px;
    --slide-gap: 8px;
  }

  .noticia-card__content {
    padding: 8px 9px;
  }

  .noticia-card__title {
    font-size: .92rem;
  }

  .noticia-card__meta {
    font-size: .78rem;
  }
}

/* <= 480px: mínimo espacio pero sin superponer contenido */
@media (max-width: 480px) {
  .glide--noticias {
    --arrow-w: 22px;
    --outer-gap: 4px;
    --slide-gap: 6px;
  }

  .glide--noticias .glide__slide {
    padding: 3px;
  }

  .noticia-card__content {
    padding: 7px 8px;
  }

  .noticia-card__title {
    font-size: .9rem;
  }

  .noticia-card__meta {
    font-size: .76rem;
  }
}

/* Asegura el contexto de posicionamiento en el propio carrusel */
.glide--noticias {
  position: relative;
  overflow: visible;
}

.glide--noticias .glide__track {
  overflow: hidden;
}

/* Offset de flechas como variable para ajustar por breakpoint */
.glide--noticias {
  --arrow-offset: 28px;
  --arrow-size: 36px;
}

.glide--noticias .glide__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  width: var(--arrow-size);
  height: var(--arrow-size);
  padding: 0;
  z-index: 10;
  line-height: 0;
}

.glide--noticias .glide__arrow--left {
  left: calc(-1 * var(--arrow-offset));
}

.glide--noticias .glide__arrow--right {
  right: calc(-1 * var(--arrow-offset));
}

.glide--noticias .glide__arrow img {
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
}

/* Breakpoints: ajusta tamaño/offset de flechas si quieres */
@media (max-width: 1360px) {
  .glide--noticias {
    --arrow-offset: 20px;
    --arrow-size: 32px;
  }
}

@media (max-width: 980px) {
  .glide--noticias {
    --arrow-offset: 12px;
    --arrow-size: 28px;
  }
}

@media (max-width: 680px) {
  .glide--noticias {
    --arrow-offset: 8px;
    --arrow-size: 24px;
  }
}