/* Layout: sidebar izquierda + contenido derecha */
  .kp-layout{
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 12px 18px;
  }

  /* Sidebar: ancho fijo */
  .kp-aside{
    flex: 0 0 260px;   /* ancho fijo */
    width: 260px;
  }

  /* Sticky: se queda visible al hacer scroll
     IMPORTANTE: top debe considerar tu header fijo */
  .kp-aside{
    position: sticky;
    top: 88px;         /* AJUSTA: altura de tu top navbar */
    align-self: flex-start;
  }

  /* Contenido: ocupa todo el espacio restante */
  .kp-main{
    flex: 1 1 auto;
    min-width: 0;     /* evita overflow raro en flex */
  }

  /* Si la pantalla es chica, colapsa a 1 columna */
  @media (max-width: 992px){
    .kp-layout{ flex-direction: column; }
    .kp-aside{
      position: static;
      width: 100%;
      flex: 1 1 auto;
    }
  }