/* Static homepage mosaic; all rules are local to this section. */
.home-page .home-gallery {
  width: var(--home-content-width);
  margin: 0 auto;
  padding-block: var(--home-section-space);
}
.home-page .home-gallery__header { margin-bottom: 28px; }
.home-page.home-page--type .home-gallery h2 {
  margin: 0;
  font-family: "DM Serif Display", serif;
  font-size: var(--section-h2-size);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: normal;
  color: var(--graphite);
}
.home-gallery__mosaic {
  display: grid;
  grid-template-columns: 4fr 3fr 2fr 3fr;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  grid-template-areas: "main wide wide side" "main roof glass cta";
  gap: 5px;
  aspect-ratio: 3;
}
.home-gallery__photo { min-width: 0; min-height: 0; margin: 0; overflow: hidden; }
.home-gallery__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.home-gallery__photo--main { grid-area: main; }
.home-gallery__photo--main img { object-position: 53% 65%; }
.home-gallery__photo--wide { grid-area: wide; }
.home-gallery__photo--wide img { object-position: 50% 53%; }
.home-gallery__photo--side { grid-area: side; }
.home-gallery__photo--side img { object-position: 50% 60%; }
.home-gallery__photo--roof { grid-area: roof; }
.home-gallery__photo--roof img { object-position: 50% 50%; }
.home-gallery__photo--glass { grid-area: glass; }
.home-gallery__photo--glass img { object-position: 53% 50%; }
.home-gallery__cta {
  grid-area: cta;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 14px;
  min-width: 0;
  padding: clamp(20px, 2.4vw, 36px);
  background: #d5dfd1;
  color: var(--graphite);
  font: 500 clamp(1rem, 1.35vw, 1.25rem)/1.4 "Inter", sans-serif;
  text-decoration: none;
  transition: background-color .18s ease;
}
.home-gallery__arrow { font-size: 1.6rem; line-height: 1; }
.home-gallery__cta:hover { background: var(--button-hover-background, #a8bb9f); }
.home-gallery__cta:focus-visible { outline: 2px solid var(--brand-green); outline-offset: -5px; }
@media (max-width: 1020px) {
  .home-page .home-gallery { width: var(--home-content-width-mobile); }
  .home-gallery__mosaic { aspect-ratio: 2.4; }
  .home-gallery__cta { padding: 18px; }
}
@media (max-width: 600px) {
  .home-gallery__mosaic {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto auto auto 84px;
    grid-template-areas: "main main" "wide side" "roof glass" "cta cta";
    aspect-ratio: auto;
  }
  .home-gallery__photo--main { aspect-ratio: 1.7; }
  .home-gallery__photo--main img { object-position: 50% 64%; }
  .home-gallery__photo:not(.home-gallery__photo--main) { aspect-ratio: 1.25; }
  .home-gallery__cta { flex-direction: row; align-items: center; justify-content: space-between; padding: 20px 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-gallery__cta { transition: none; }
}

/* Split gallery tile with the same quiet circular arrow as the reference. */
.home-gallery__cta {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 20px 18px;
}
.home-gallery__cta-title {
  font: 400 clamp(1.25rem, 1.9vw, 1.875rem)/1.12 "DM Serif Display", serif;
}
.home-gallery__cta-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  gap: 12px;
  border-left: 1px solid rgba(38,49,42,.18);
  padding-left: 14px;
  text-align: center;
}
.home-gallery__arrow {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(38,49,42,.35);
  border-radius: 50%;
  font: 400 26px/1 "Inter", sans-serif;
}
.home-gallery__cta-caption { color: var(--brand-green); font: 500 .75rem/1.4 "Inter", sans-serif; }
.home-gallery__cta-caption::after { content: ""; display: block; width: 46px; height: 1px; margin: 8px auto 0; background: currentColor; opacity: .4; }
@media (min-width: 601px) and (max-width: 1020px) {
  .home-gallery__cta { grid-template-columns: 1fr; gap: 8px; padding: 12px; }
  .home-gallery__cta-title { font-size: 1.125rem; }
  .home-gallery__cta-action { flex-direction: row; gap: 8px; border-left: 0; padding-left: 0; }
  .home-gallery__arrow { flex: 0 0 32px; width: 32px; height: 32px; font-size: 20px; }
  .home-gallery__cta-caption { font-size: .6875rem; }
}
@media (max-width: 600px) {
  .home-gallery__mosaic { grid-template-rows: auto auto auto 140px; }
  .home-gallery__cta { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); padding: 20px 24px; }
  .home-gallery__cta-title { font-size: 1.65rem; }
}

.home-gallery__photo-link { display: block; width: 100%; height: 100%; cursor: zoom-in; }
.home-gallery__photo-link:focus-visible { outline: 2px solid var(--brand-green); outline-offset: -4px; }