/* ============================================================================
   LOOVUS — Galería de trabajos dentro de cada página de servicio
   La escribe _galerias/armar_galerias.py. Usa las variables de styles.css.
   Fotos completas (sin recortar), en columnas: 3 en computadora, 2 en celular.
   ========================================================================== */
.trabajos-servicio{padding:96px 0;border-top:1px solid var(--line)}
.trabajos-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 32px;margin-bottom:40px}
.trabajos-cab h2{margin-bottom:0;font-size:clamp(2.2rem,4vw,3.8rem)}
.trabajos-mas{padding:10px 14px;border:1px solid var(--line);color:var(--white-soft);font-size:.78rem;font-weight:800;white-space:nowrap}
.trabajos-mas:hover,.trabajos-mas:focus-visible{border-color:var(--red);color:var(--white)}
.trabajos-grid{columns:3;column-gap:18px}
.trabajo{display:inline-block;width:100%;margin:0 0 18px;break-inside:avoid;border:1px solid var(--line);background:var(--black-2)}
.trabajo img{display:block;width:100%;height:auto;background:var(--card)}
.trabajo figcaption{display:grid;gap:6px;padding:14px 16px 18px}
.trabajo small{color:var(--red);font-size:.63rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.trabajo strong{color:var(--white);font-size:1.02rem;font-weight:800;letter-spacing:-.02em;line-height:1.25}
.trabajo-desc{color:var(--muted);font-size:.82rem;line-height:1.55}
@media(max-width:1050px){.trabajos-grid{columns:2}}
@media(max-width:760px){
  .trabajos-servicio{padding:72px 0}
  .trabajos-cab{margin-bottom:28px}
  .trabajos-grid{column-gap:10px}
  .trabajo{margin-bottom:10px}
  .trabajo figcaption{padding:10px 10px 12px;gap:4px}
  .trabajo small{font-size:.56rem;letter-spacing:.08em}
  .trabajo strong{font-size:.86rem}
  .trabajo-desc{display:none}
}