/* ================================================================
   LO BÁSICO DE LA PÁGINA
   ================================================================
   Reset, fondo y el armazón de la vitrina: las cuatro reglas que
   valen igual en los dos sitios (la tienda del taller y el
   programa). Vivían sueltas en un <style> adentro del <head> de
   index.html, junto con 480 líneas de la portada y una docena del
   panel interno — o sea, cada visitante del catálogo se bajaba
   también el CSS de una pantalla que no iba a ver nunca.

   Al separarse las dos páginas (ver construir.mjs) ese bloque se
   partió en tres: esto, tienda/css/portada-taller.css y
   pos/css/programa-shell.css.
   ================================================================ */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: var(--vb); }
#vitrina-root { display: flex; flex-direction: column; min-height: 100vh; background: var(--vb); }
 
/* ── Navbar en flujo normal (scrollea con la página, como antes) ── */

/* ── Layout ─────────────────────────────────── */
.vit-layout { align-items: flex-start; }
 
/* ── Sidebar sticky (CLAVE: align-self) ─────── */
 
/* ── Separador sidebar / grilla ──────────────── */
.vit-main {
  border-left: none;
}
 
/* ── Color al seleccionar en sidebar ───────────
   El texto (color y negrita) lo pone .sb-opcion:has(input:checked) en
   utilidades.css, junto a .sb-opcion.activo, para que una opción
   elegida se vea igual con casilla o sin ella. Acá queda solo el
   fondo, que es propio del catálogo. */
.sb-opcion:has(input:checked) {
  background: rgba(255,255,255,0.06);
  border-radius: 6px;
}

#vit-pagina-home.oculto { display: none; }
