/* Editorial redesign: deliberate 5-image compositions, no broken desktop rows. */
:root { --gallery-gap: clamp(9px, 1.2vw, 17px); }

/* Taller, portrait-friendly first image, with a clean editorial text overlay. */
.hero {
  height: auto !important;
  min-height: 112vh !important;
  min-height: 112svh !important;
  max-height: none !important;
  background: #0b1215;
}
.hero .hero-image {
  inset: 0 0 0 auto !important;
  width: 80% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 48% !important;
}
.hero .hero-shade {
  background: linear-gradient(90deg,
    #0b1215 0%, rgba(11,18,21,.99) 14%,
    rgba(11,18,21,.83) 30%, rgba(11,18,21,.36) 53%,
    rgba(11,18,21,.04) 78%, transparent 100%) !important;
}
.hero-copy { z-index: 2; }
.hero-scroll { z-index: 2; }

/* Balanced group rhythm. Each large tile is exactly 2x2 small tiles. */
.new-gallery-grid,
.work-section .gallery {
  display: flex !important;
  flex-direction: column;
  gap: clamp(18px, 2.6vw, 38px);
  columns: unset !important;
}
.editorial-group {
  display: grid;
  width: 100%;
  aspect-ratio: 4 / 3;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: var(--gallery-gap);
  min-height: 0;
}
.editorial-group > .new-photo,
.editorial-group > .photo {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  min-width: 0;
  margin: 0;
  padding: 0;
  aspect-ratio: auto !important;
  grid-column: auto;
  grid-row: auto;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #d6dbd1;
}
.editorial-group > :first-child {
  grid-column: 1 / span 2 !important;
  grid-row: 1 / span 2 !important;
}
.editorial-group--reverse > :first-child {
  grid-column: 3 / span 2 !important;
  grid-row: 1 / span 2 !important;
}
.editorial-group img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 550ms ease, filter 350ms ease;
}
.editorial-group button:hover img { transform: scale(1.025); }
.editorial-group--quartet {
  aspect-ratio: 8 / 3;
  grid-template-rows: minmax(0, 1fr);
}
.editorial-group--quartet > :first-child {
  grid-column: auto !important;
  grid-row: auto !important;
}
/* Keep wide original landscape photographs visible rather than slicing into portrait tiles. */
.editorial-group .photo--landscape { background: #dce1d9; }
.editorial-group .photo--landscape img { object-fit: contain; }
.work-section .gallery > .photo--wide {
  width: 100%;
  height: auto;
  aspect-ratio: 2.25 / 1 !important;
  margin: 0;
  grid-column: auto;
}
.work-section .gallery > .photo--wide img { width: 100%; height: 100%; object-fit: cover; }
.new-gallery-block { margin-bottom: clamp(72px, 9vw, 130px); }
.archive-heading { margin-bottom: clamp(25px, 3vw, 44px); }

@media (max-width: 700px) {
  .hero { min-height: 100svh !important; }
  .hero .hero-image { width: 100% !important; object-position: center 46% !important; opacity: 1 !important; }
  .hero .hero-shade {
    background: linear-gradient(180deg, rgba(6,12,15,.45), rgba(6,12,15,.04) 32%, rgba(6,12,15,.20) 52%, rgba(6,12,15,.84) 100%) !important;
  }
  .hero-copy { bottom: 8rem; }
  .editorial-group,
  .editorial-group--quartet {
    aspect-ratio: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 9px;
  }
  .editorial-group > .new-photo,
  .editorial-group > .photo {
    height: auto;
    aspect-ratio: 2 / 3 !important;
  }
  .editorial-group:not(.editorial-group--quartet) > :first-child,
  .editorial-group--reverse:not(.editorial-group--quartet) > :first-child {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
    aspect-ratio: 2 / 3 !important;
  }
  .editorial-group--quartet > :first-child { grid-column: auto !important; grid-row: auto !important; }
  .new-gallery-grid, .work-section .gallery { gap: 22px; }
  .work-section .gallery > .photo--wide { aspect-ratio: 1.6 / 1 !important; }
}
@media (prefers-reduced-motion: reduce) {
  .editorial-group img { transition: none; }
}

/* Color-only update based on the supplied Editorial design preview.
   Layout, dimensions, image order, type scale, interactions and spacing remain unchanged. */
:root {
  color-scheme: light;
  --paper: #f2efe8;
  --ink: #20251f;
  --ink-soft: #e3e8df;
  --muted: #777d72;
  --blue: #6e8067;
  --blue-pale: #e3e8df;
  --olive: #6e8067;
  --line: rgba(32,37,31,.16);
  --accent: #6e8067;
  --panel: #e3e8df;
  --contact: #24352d;
}
html, body { background-color: var(--paper); }
.hero { background-color: #24352d !important; }
.hero .hero-shade {
  background: linear-gradient(90deg,
    #17231d 0%, rgba(23,35,29,.99) 14%,
    rgba(23,35,29,.83) 30%, rgba(23,35,29,.36) 53%,
    rgba(23,35,29,.04) 78%, transparent 100%) !important;
}
.brand-mark { background-color: #6e8067; color: #fff; box-shadow: 0 0 0 1px rgba(32,37,31,.2); }
.hero-copy p { color: #e3e8df; }
.work-section { background-color: var(--paper); color: var(--ink); }
.work-section .eyebrow, .section-heading .eyebrow,
.new-gallery-kicker, .about-section .eyebrow { color: #6e8067; }
.work-section .section-heading > p:last-child,
.new-gallery-heading p, footer { color: #777d72; }
.new-gallery-heading, .archive-heading { border-top-color: rgba(32,37,31,.16); }
.new-photo, .editorial-group > .new-photo,
.editorial-group > .photo { background-color: #e3e8df; }
.editorial-group .photo--landscape { background-color: #e3e8df; }
.about-section { background-color: #e3e8df; color: #20251f; border-top-color: rgba(32,37,31,.16); }
.contact-section { background: #24352d; color: #f5f4ee; }
.contact-section > .eyebrow { color: #c3cdbb; }
.contact-heading h2, .contact-link strong { color: #f5f4ee; }
.contact-link > span:first-child { color: #b6c1b2; }
footer { background-color: #f2efe8; }
.lightbox, .lightbox::backdrop, .new-photo-viewer, .new-photo-viewer::backdrop {
  background-color: rgba(7,13,13,.97);
}
@media (max-width: 700px) {
  .hero .hero-shade {
    background: linear-gradient(180deg,
      rgba(8,17,13,.45), rgba(8,17,13,.04) 32%,
      rgba(8,17,13,.20) 52%, rgba(8,17,13,.84) 100%) !important;
  }
}

/* Unified gallery: no archive divider or separated Singapore block. */
.work-section .gallery { margin-top: 0; }
.gallery .editorial-group { width: 100%; }
.gallery .editorial-group > .photo,
.gallery .editorial-group > .new-photo { aspect-ratio: auto !important; }
/* Avoid empty pale bars around landscape photos: fill the editorial frames. */
.gallery .editorial-group img,
.gallery .editorial-group .photo--landscape img { object-fit: cover !important; }
.gallery > .photo--wide { display:block; width:100%; aspect-ratio: 2.25 / 1 !important; }
.gallery > .photo--wide img { display:block; width:100%; height:100%; object-fit:cover; }
@media (max-width: 700px) {
  .gallery .editorial-group > .photo,
  .gallery .editorial-group > .new-photo { aspect-ratio: 2 / 3 !important; }
  .gallery .editorial-group:not(.editorial-group--quartet) > :first-child {
    aspect-ratio: 2 / 3 !important;
  }
}