/* 1) Columna fija (aplícalo a la columna/contener con la clase "sticky-col") */
.sticky-col{
  position: -webkit-sticky;
  position: sticky;
  top: var(--sticky-top, 100px);   /* cambia 100px por lo que necesites */
  z-index: 3;
  height: fit-content;
  align-self: flex-start;          /* evita que se estire en vertical */
}

/* 2) Sección contenedora a pantalla completa (clase "section-viewport") */
.section-viewport{
  min-height: 85vh;
  overflow: visible;               /* por si algún addon pone hidden */
}

/* 3) Invertir columnas en el siguiente bloque (clase "alt-reverse") */
.alt-reverse{
  display: flex;
  flex-direction: row-reverse;     /* invierte el orden de las columnas */
}

/* 4) Ajuste si hay barra de administración de WP */
body.admin-bar .sticky-col{
  top: calc(var(--sticky-top, 100px) + 32px);
}

/* 5) Desactivar sticky en móvil/tablet si quieres */
@media (max-width: 1024px){
  .sticky-col{ position: static; } /* deja de ser sticky */
  .alt-reverse{ flex-direction: column; }
}

