/* ============================================================
   BISTRO AOKI — page-gallery.css（ギャラリーページ専用）
   ============================================================ */

.gallery-hero__sub { margin-top: 1.2em; }

/* ---------- 章見出し ---------- */
.g-chapter__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 2rem;
  margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}
.g-chapter__head .display-lg { margin-top: .15em; }

/* ---------- コラージュ共通 ---------- */
.g-collage {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(.9rem, 1.8vw, 1.75rem);
}
.g-collage__item { position: relative; overflow: hidden; margin: 0; cursor: pointer; }
.g-collage__item img { width: 100%; height: auto; object-fit: cover; }
.g-collage__item figcaption { margin-top: .8em; }

/* Piatti（7点）: 大小・オフセットのリズム */
.gl-1 { grid-column: 1 / 7; }
.gl-1 img { aspect-ratio: 4 / 5; }
.gl-2 { grid-column: 8 / 13; margin-top: clamp(2.5rem, 7vw, 6rem); }
.gl-2 img { aspect-ratio: 1 / 1; }
.gl-3 { grid-column: 2 / 6; margin-top: clamp(1.5rem, 4vw, 3.5rem); }
.gl-3 img { aspect-ratio: 1 / 1; }
.gl-4 { grid-column: 7 / 11; margin-top: clamp(-4rem, -5vw, -2rem); }
.gl-4 img { aspect-ratio: 3 / 4; }
.gl-5 { grid-column: 1 / 5; margin-top: clamp(1.5rem, 4vw, 3rem); }
.gl-5 img { aspect-ratio: 3 / 4; }
.gl-6 { grid-column: 6 / 13; margin-top: clamp(1rem, 3vw, 2.5rem); }
.gl-6 img { aspect-ratio: 16 / 9; }
.gl-7 { grid-column: 3 / 9; margin-top: clamp(1.5rem, 4vw, 3.5rem); }
.gl-7 img { aspect-ratio: 16 / 10; }

/* Spazio（5点・明帯）: 空間写真は横長主体 */
.gs-1 { grid-column: 1 / 8; }
.gs-1 img { aspect-ratio: 16 / 10; }
.gs-2 { grid-column: 9 / 13; margin-top: clamp(2rem, 6vw, 5rem); }
.gs-2 img { aspect-ratio: 3 / 4; }
.gs-3 { grid-column: 1 / 5; margin-top: clamp(1.5rem, 4vw, 3rem); }
.gs-3 img { aspect-ratio: 1 / 1; }
/* 負マージンはgs-2キャプションを覆わない範囲まで（-2vw上限） */
.gs-4 { grid-column: 6 / 11; margin-top: clamp(-1.75rem, -2vw, -1rem); }
.gs-4 img { aspect-ratio: 4 / 3; }
.gs-5 { grid-column: 4 / 10; margin-top: clamp(1.5rem, 4vw, 3.5rem); }
.gs-5 img { aspect-ratio: 16 / 9; }

/* ---------- レスポンシブ ---------- */
@media (max-width: 767px) {
  .g-chapter__head { flex-direction: column; align-items: flex-start; }
  .g-collage { grid-template-columns: 1fr 1fr; gap: .9rem; }
  .g-collage__item { grid-column: auto !important; margin-top: 0 !important; }
  .gl-1, .gl-6, .gl-7, .gs-1, .gs-5 { grid-column: 1 / 3 !important; }
  .gl-1 img, .gl-6 img, .gl-7 img, .gs-1 img, .gs-5 img { aspect-ratio: 16 / 10; }
  .gl-2 img, .gl-3 img, .gl-4 img, .gl-5 img, .gs-2 img, .gs-3 img, .gs-4 img { aspect-ratio: 1 / 1; }
}