/* ═══════════════════════════════════════════════════════════════
   Casa 59 / Cerro El Boldo — ajustes propios de ESTA ficha.
   Se carga DESPUÉS de css/proyecto.css (la plantilla compartida).
   Usar solo para retoques puntuales de esta ficha (p. ej. si alguna
   imagen no queda bien con el estilo general). Normalmente vacío.
   ═══════════════════════════════════════════════════════════════ */

/* Sello ArchDaily Building of the Year (Top 100) junto al título —
   única en esta ficha. El <h1> se envuelve en esta fila en vez de
   tocar css/proyecto.css (afectaría a las otras 38 fichas); el margen
   y el padding-inline que tenía el título se mueven acá, al wrapper,
   para que "volver→título" y "título→metadatos" midan exactamente
   igual que antes. */
.proyecto__title-row {
  order: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(1rem, 3vw, 2rem);
  padding-inline: var(--gutter);
  margin: clamp(1.5rem, 3vh, 2.25rem) 0 clamp(1.5rem, 3vh, 2rem);
}

.proyecto__title-row .proyecto__title {
  /* El order:3 de css/proyecto.css es para cuando el título es hijo
     directo de .proyecto__head-inner (sistema de reordenamiento
     compartido) — acá adentro es hijo de este wrapper, así que ese
     order lo pondría después del sello en vez de antes. */
  order: 0;
  margin: 0;
  padding-inline: 0;
}

.proyecto__award-badge {
  flex-shrink: 0;
  width: clamp(5.5rem, 8vw, 8.1rem);
  height: auto;
  display: block;
}

/* Segunda copia del mismo sello (mismo archivo, se sirve de caché),
   junto a "Ubicación" — es la que se ve en mobile (ver @media). En
   desktop no ocupa lugar ni carga antes de tiempo: display:none. */
.proyecto__award-badge--meta {
  display: none;
}

/* El label+valor de "Ubicación" quedan en un <div> propio (en vez de
   sueltos directo en .proyecto__meta-item) porque ese ítem ahora
   también contiene el sello como segundo hijo — este wrapper repite el
   flex-column+gap que .proyecto__meta-item ya les daba, para que se
   sigan viendo apilados (label arriba, valor abajo) igual que el resto. */
.proyecto__meta-item-inner {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-width: 0;
}

@media (max-width: 600px) {
  /* Angosto: el título ("Casa 59 / Cerro El Boldo") ocupa casi todo el
     ancho — no entra al lado sin achicarse. En vez de agregarle una
     fila propia (más alto de página), se lo pasa a la fila de
     "Ubicación": mismo alto que ya existía, sin sumar nada nuevo. El
     de junto al título se oculta acá. */
  .proyecto__title-row .proyecto__award-badge {
    display: none;
  }

  .proyecto__meta-item--ubicacion {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
  }

  .proyecto__award-badge--meta {
    display: block;
    flex-shrink: 0;
    width: clamp(4.5rem, 16vw, 5.5rem);
  }
}

/* ─── Ver más: proporción de cada fila (generado) ───────────── */
/* --r define ancho (flex) Y alto (aspect-ratio) a la vez: si no
   coincide con la proporción real del archivo, la fila queda
   despareja. Solo se emparejan imágenes de la MISMA proporción;
   la que no tiene par va sola a ancho completo. */
.proyecto-more__row:nth-child(1) > :nth-child(1) { --r: 1.5005; }
.proyecto-more__row:nth-child(1) > :nth-child(2) { --r: 1.5005; }
.proyecto-more__row:nth-child(2) > :nth-child(1) { --r: 1.5005; }
.proyecto-more__row:nth-child(2) > :nth-child(2) { --r: 1.5005; }
.proyecto-more__row:nth-child(3) > :nth-child(1) { --r: 1.5005; }
.proyecto-more__row:nth-child(3) > :nth-child(2) { --r: 1.5005; }
.proyecto-more__row:nth-child(4) > :nth-child(1) { --r: 1.5005; }
.proyecto-more__row:nth-child(4) > :nth-child(2) { --r: 1.5005; }
.proyecto-more__row:nth-child(5) > :nth-child(1) { --r: 1.5005; }
.proyecto-more__row:nth-child(5) > :nth-child(2) { --r: 1.5005; }
/* ─── fin Ver más ─────────────────────────────────────────── */
