.body-scroll::-webkit-scrollbar {
  display: none;
  /* Chrome, Safari y Opera */
}

.archivo-cuerpo-fondo {
  background: linear-gradient(90deg,
      rgba(237, 237, 237, 1) 9%,
      rgba(237, 237, 237, 1) 74%,
      rgba(157, 255, 0, 1) 89%,
      rgba(89, 255, 0, 1) 100%);
}

.archivo-cuerpo-acomodo {
  padding: 10% 2% 5% 2%;
}

h1.archivo-cabezal-titular {
  font-family: "Authentic";
  font-size: 1.2em;
  margin-block-start: 0em;
  margin-block-end: 0em;
}

.archivo-cabezal-seccion {
  font-family: "SerialB";
  font-weight: 700;
  margin-block-start: 0em;
  margin-block-end: 0em;
  text-transform: uppercase;
  font-size: 40px;
  transform: translate(-10px, 20px);
  z-index: 99999;
  position: relative;
}

p {
  font-family: "Authentic";
  font-size: 1.2em;
  line-height: 1.1em;
  margin-block-start: 0em;
  margin-block-end: 0em;
}

.revista-encabezado-season-p,
.revista-encabezado-titular-p,
.archivo-blog-informacion-lugar-p,
.archivo-blog-informacion-nombre-p,
.archivo-postal-informacion-lugar-p,
.archivo-postal-informacion-nombre-p {
  font-family: "Authentic";
  font-stretch: expanded;
  font-size: 1em;
  line-height: 1.1em;
  margin-block-start: 0em;
  margin-block-end: 0em;
}

a {
  text-decoration: none;
  /* Elimina el subrayado */
  color: inherit;
  /* Hereda el color del elemento padre */
}

.container {
  padding: 0em;
  display: grid;
  grid-template-columns: repeat(12, 1);
  width: 100vw;
}

section.archivo-seccion-horizontal-scroll {
  min-height: 90vh;
}

@media (max-width: 768px) {
  section.archivo-seccion-horizontal-scroll {
    min-height: auto;
  }
}

/*LIBRITO*/

.archivo-contenedor-portada-revista {
  display: flex;
  justify-content: left;
  align-items: center;
  transform-style: preserve-3d;
  perspective: 1000px;
}

.archivo-contenedor-portada-revista .portada-revista {
  position: relative;
  width: 183px;
  /* Ancho fijo */
  height: 307px;
  transform-style: preserve-3d;
  transition: 0.5s;
  transform: rotateX(5deg) rotateY(10deg) rotateZ(0deg);
}

.archivo-contenedor-portada-revista .portada-revista:hover {
  transform: rotateX(15deg) rotateY(35deg) rotateZ(-5deg);
  /* Ajusta los valores según tus necesidades */
}

.archivo-contenedor-portada-revista .portada-revista:before {
  content: "";
  position: absolute;
  width: 10px;
  height: 300px;
  left: 0px;
  /* Posiciona el lomo al borde izquierdo del libro */
  transform-origin: left;
  background: #6c6c6c;
  background-position: center;
  transform: rotateY(100deg);
}

.archivo-contenedor-portada-revista .portada-revista::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 20px;
  /* Altura de la tapa inferior */
  background: #6c6c6c;
  bottom: 20px;
  /* Posiciona la tapa al fondo del libro */
  left: 0;
  transform-origin: bottom;
  transform: rotateX(90deg);
  /* Rota la tapa en el eje X */
}

/*CUBO*/

/* contenedor de la barra de menú*/

/* seccion con las notas */

.archivo-seccion-horizontal-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  /* Asegura que solo haya scroll horizontal */

  position: relative;
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  /* IE y Edge */
}

.archivo-seccion-horizontal-scroll::-webkit-scrollbar {
  display: none;
  /* Chrome, Safari y Opera */
}

/* ======= ✅ AJUSTE: 4 por “pantalla” (máximo 4 items) ======= */
.archivo-seccion-horizontal-content {
  display: grid;
  grid-auto-flow: column;
  width: 100% !important;
  /* 4 columnas visibles por viewport (si hay 2/3 también se reparten parejo) */
  grid-auto-columns: 25%;

  /* separación entre items */
  /* column-gap: 24px; */

  /* clave para scroll horizontal con grid */
  width: max-content;

  align-items: start;
  padding-right: 2%;
}

/* REVISTA: pisa tu width:20vw para que calce 4 por pantalla */
.archivo-item {
  display: grid;
  overflow: hidden;
  /* Oculta las partes de la imagen que sobresalen del contenedor */
  position: relative;

  width: auto;
  /* ✅ antes 20vw */
  min-width: 0;

  padding: 5% 0 0 0;
  /* ✅ sin ensanchar */
  height: auto;
  background-color: #cccccc00;
  text-align: center;
  font-size: 20px;
  transition: transform 0.5s ease, filter 0.5s ease;
}

/* BLOG/POSTAL: pisa el padding que podía “inflar” */
.archivo-blog-gallery {
  /*flex: 0 0 600px; /* Ancho fijo para cada ítem */
  /*display: flex;*/
  padding: 0 0 200px 0;
  /* ✅ antes: 0 4px 200px 0 */
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  scroll-snap-align: start;
  /* Cada ítem se alinea al inicio del contenedor */

  width: auto;
  /* ✅ */
  min-width: 0;
  /* ✅ */
}

/* IMPORTANTE: no forzar min-width 400px (rompía el 4-up) */
.archivo-seccion-horizontal-scroll img {
  max-width: 100%;
  min-width: 0;
  /* ✅ antes 400px */
  max-height: 400px;
}

/* ======= fin ajuste 4 por pantalla ======= */

.archivo-contenedor-portada-revista img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-width: 200px;
}

.archivo-item img {
  max-height: 300px;
  object-fit: cover;
  /* Hace que la imagen cubra todo el contenedor */
  object-position: center;
  /* Centra la imagen dentro del contenedor */
  transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
  transform-origin: center;
}

.archivo-item img.visible {
  opacity: 1;
  transform: perspective(1000px) rotateX(-5deg) rotateY(60deg) rotateZ(-5deg);
}

.overlay {
  font-family: "Space Mono", monospace;
  font-size: 1em;
  line-height: 1em;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 255, 42, 0.726);
  color: rgb(0, 0, 0);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.archivo-revista-nota-content {
  display: block;
  justify-content: left;
  align-items: left;
  text-align: left;
}

.shrink {
  transform: scale(0.99);
}

/* INFO ABAJO DE LAS NOTAS*/

.info-seccion {
  padding-top: 3%;
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(12, 1fr);
  gap: 5px;
  height: 70vh;
  background-image: linear-gradient(to bottom,
      rgb(255, 255, 255),
      white,
      chartreuse,
      white,
      white);
}

.titulo {
  font-family: "Space Mono", monospace;
  font-weight: 400;
  font-size: 2em;
  background-color: #dbdbdb00;
  grid-column: 2 / span 3;
}

.bullet {
  font-weight: 300;
  font-size: 1.2em;
  background-color: #ffffff00;
  grid-column: 5 / span 6;
}

/* BLOG*/

.archivo-blog-gallery img {
  width: 100%;
  height: auto;
  /* Ajuste proporcional */
  object-fit: cover;
  /* Ajusta cómo se muestra la imagen si es más grande */
}

.info-line {
  margin-top: 10px;
  text-align: left;
}



/* Swiper plumbing (no define cuántas slides se ven) */
.archivo-seccion-horizontal-scroll.swiper {
  overflow: hidden;
}

.archivo-seccion-horizontal-scroll .swiper-wrapper {
  display: flex;
}

.archivo-seccion-horizontal-scroll .swiper-slide {
  flex: 0 0 auto;
}

@media (max-width: 768px) {
  .archivo-item {
    width: auto;
  }

  .archivo-cuerpo-acomodo {
    padding: 15% 18px;
  }

  .archivo-seccion-horizontal-content {
    grid-auto-columns: 50%;
    width: 100%;
    column-gap: 12px;
  }

  .archivo-blog-gallery {
    padding: 0 0 40px 0;
  }

  .archivo-seccion-horizontal-scroll .swiper-slide {
    width: calc((100% - 12px) / 2) !important;
  }

  .archivo-seccion-horizontal-scroll img {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
  }

  .archivo-cabezal-seccion {
    transform: translate(8px, 38px);
    font-size: 38px;
    z-index: 2;
  }
}
@media (max-width: 768px) {

  /* SOLO REVISTAS */
  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .archivo-item {
    overflow: visible;
  }

  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .archivo-contenedor-portada-revista {
    justify-content: center;
    align-items: center;
    overflow: visible;
    perspective: 1400px;
  }

  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .portada-revista {
    position: relative;
    width: min(34vw, 155px); /* mas chicas */
    aspect-ratio: 183 / 307;
    height: auto;
    overflow: visible;
    transform-style: preserve-3d;
    transition: transform .25s ease;
  }

  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .portada-revista img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 2;
  }

  /* lomo un poco mas visible */
  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .portada-revista::before {
    content: "";
    position: absolute;
    top: 1px;
    left: -6px;
    width: 6px;
    height: calc(100% - 2px);
    background: #7b7b7b;
    transform-origin: right center;
    transform: rotateY(90deg);
    z-index: 1;
  }

  /* base un poco mas visible */
  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .portada-revista::after {
    content: "";
    position: absolute;
    left: 1px;
    bottom: -6px;
    width: calc(100% - 2px);
    height: 6px;
    background: #7b7b7b;
    transform-origin: top center;
    transform: rotateX(90deg);
    z-index: 1;
  }

  /* mas efecto 3D pero sin deformarse tanto */
  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .archivo-item:nth-child(odd) .portada-revista {
    transform: rotateX(10deg) rotateY(22deg) rotateZ(-7deg);
  }

  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .archivo-item:nth-child(even) .portada-revista {
    transform: rotateX(10deg) rotateY(-22deg) rotateZ(7deg);
  }

  /* texto abajo prolijo */
  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .archivo-item .image-info,
  .archivo-cuerpo-acomodo>.archivo-seccion-horizontal-scroll:first-of-type .archivo-item .image-info-arriba {
    text-align: left;
  }
}