/* Casa Almares / Lago Ranco — ajustes de ESTA ficha (tras css/proyecto.css). */

/* Portada reemplazada por la foto definitiva del cliente (mejor calidad,
   casa completa con vista al lago). Mismo alto fijo (82/68/58vh) que el
   resto de las fichas — así se asoma el título justo debajo, como en
   todas las demás. La foto tiene mucho cielo arriba y la casa recién
   empieza a la mitad: el cover por defecto (centrado) recortaba parejo
   arriba/abajo y dejaba la base de la casa muy al borde. Ancla abajo
   para que el recorte salga todo del cielo sobrante, no de la casa. */
.proyecto__hero img { object-position: center bottom; }

/* Galería principal = 4 interiores verticales, en cuatro columnas, a su
   proporción real (3:4) para que object-fit cover no recorte. */
.proyecto__gallery--quad {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.proyecto__gallery--quad .proyecto__figure {
  aspect-ratio: 3 / 4;
}
@media (max-width: 768px) {
  .proyecto__gallery--quad {
    grid-template-columns: 1fr;
  }
}

/* ─── Ver más: proporción de cada fila (generado) ───────────── */
/* Van acá y no inline porque el CSP del sitio (style-src 'self')
   bloquea el atributo style. Orden: fotos, luego planos, luego
   renders (si hay de los dos). Nunca se mezclan categorías en
   una misma fila: la que sobra de un grupo queda sola, grande. */
.proyecto-more__row:nth-child(1) > :nth-child(1) { --r: 0.7502; }
.proyecto-more__row:nth-child(1) > :nth-child(2) { --r: 0.7502; }
.proyecto-more__row:nth-child(2) > :nth-child(1) { --r: 0.7502; }
.proyecto-more__row:nth-child(2) > :nth-child(2) { --r: 0.7502; }
.proyecto-more__row:nth-child(3) > :nth-child(1) { --r: 0.7502; }
.proyecto-more__row:nth-child(3) > :nth-child(2) { --r: 0.7502; }
.proyecto-more__row:nth-child(4) > :nth-child(1) { --r: 1.3333; }
.proyecto-more__row:nth-child(4) > :nth-child(2) { --r: 1.3333; }
/* ─── fin Ver más ─────────────────────────────────────────── */

/* Planos nuevos del cliente, según el sketch: 2 columnas. Fila 1 =
   2 planos lado a lado (planta + elevación 1). Fila 2 = a la izquierda,
   elevación 2 + corte apiladas (.proyecto__drawings-pair); a la
   derecha, la axonométrica vertical.

   El alto de la axonométrica y el de las 2 apiladas NO se hacen calzar
   a mano (dependía de que su proporción real fuera ~1.414/~0.707
   exacta — fràgil: cualquier recorte lo rompía). En vez de eso, la
   axo (con su alto natural, `.proyecto__drawing--natural` de siempre)
   define el alto de toda la fila 2, y `.proyecto__drawings-pair` —
   sin alto propio, `align-self: stretch` por default de grid — se
   estira a ese mismo alto y reparte EXACTAMENTE la mitad a cada una
   de las 2 imágenes (flex, object-fit:contain así no se deforman ni
   se recortan si su proporción real no da justo la mitad). */
.proyecto__drawings--tall-axo {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto auto;
}

.proyecto__drawings--tall-axo > :nth-child(1) { grid-column: 1; grid-row: 1; }
.proyecto__drawings--tall-axo > :nth-child(2) { grid-column: 2; grid-row: 1; }
.proyecto__drawings--tall-axo .proyecto__drawings-pair { grid-column: 1; grid-row: 2; }
.proyecto__drawings--tall-axo .proyecto__drawing--axo { grid-column: 2; grid-row: 2; }

.proyecto__drawings-pair {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.6rem);
  min-height: 0;
}

.proyecto__drawings-pair .proyecto__drawing {
  flex: 1 1 0;
  min-height: 0;
  /* object-fit:contain dentro de una celda que no calza exacto con la
     proporción real de la imagen deja asomar el fondo de la figura
     (--c-bg, gris #151515) en los bordes — se ve como un marco gris
     sobre el plano, que es negro puro. Fondo negro acá para que esa
     franja (si la hay) sea invisible. */
  background: #000;
}

.proyecto__drawings-pair .proyecto__drawing img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 768px) {
  .proyecto__drawings--tall-axo {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  .proyecto__drawings--tall-axo > :nth-child(1),
  .proyecto__drawings--tall-axo > :nth-child(2),
  .proyecto__drawings--tall-axo .proyecto__drawings-pair,
  .proyecto__drawings--tall-axo .proyecto__drawing--axo {
    grid-column: 1;
    grid-row: auto;
  }
  .proyecto__drawings-pair {
    gap: clamp(1rem, 2vw, 1.6rem);
  }
  .proyecto__drawings-pair .proyecto__drawing {
    flex: initial;
  }
  .proyecto__drawings-pair .proyecto__drawing img {
    height: auto;
  }
}