/* Layout: página de descargas (documentación técnica). Portada corta, el catálogo destacado y, debajo, las fichas por
     serie y las de componentes, de descarga libre. El presupuesto, al final como en todas.
     (26/10/2026, Robert) Lo público es solo lo técnico, lo que sirve a un arquitecto, una constructora o un reformista, como
     hace el proveedor en su web. Las guías de uso, de postventa y del montador se quedan en «Material para clientes», interno. */







  .doc-hero { background: var(--blanco); }
  .doc-hero .ancho { padding-block: 28px 64px; display: grid; gap: 18px; }
  .doc-hero h1 { font-family: var(--f-disp); font-weight: 800; font-size: clamp(38px, 4.6vw, 68px); line-height: .98; letter-spacing: -.04em; margin: 8px 0 0; max-width: 18ch; }
  .doc-hero .sub { font-size: clamp(17px, 1.5vw, 20px); color: var(--azul-2); max-width: 54ch; }
  .catalogo-dest { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px; align-items: center; }
  .catalogo-dest img { width: 100%; height: auto; display: block; border: 1px solid var(--greige); box-shadow: 0 30px 60px -38px rgba(14, 17, 22, .4); }
  .catalogo-dest ul { margin: 18px 0 26px; }
  @media (max-width: 819px) { .catalogo-dest { grid-template-columns: minmax(0, 1fr); } }
  .descargas.cuatro { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  @media (max-width: 1023px) { .descargas, .descargas.cuatro { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 599px) { .descargas, .descargas.cuatro { grid-template-columns: minmax(0, 1fr); } }
  /* cada descarga, una tarjeta con la portada de su PDF en pequeño (Robert, 21/10) */
  .doc.con-mini { grid-template-columns: 92px minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 18px; align-items: start; }
  .doc.con-mini > b, .doc.con-mini > span:not(.mini), .doc.con-mini > i { grid-column: 2; }
  .doc.con-mini > i { align-self: end; margin-top: 6px; }
  .doc .mini { grid-column: 1; grid-row: 1 / span 3; display: block; aspect-ratio: 297 / 210; overflow: hidden; margin: 0; background: var(--blanco); border: 1px solid var(--greige); box-shadow: 0 14px 28px -22px rgba(14, 17, 22, .45); transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
  .doc .mini img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
  .doc:hover .mini, .doc:focus-visible .mini { transform: translateY(-3px); box-shadow: 0 22px 34px -22px rgba(14, 17, 22, .5); }
  #series .doc .mini { aspect-ratio: 210 / 297; }
