/* MRO Location Section: styles for the acf/mro-location block. */

.mro-location .mro-location__top {
  display: grid;
  grid-template-columns: 5fr 7fr;
  align-items: center;
  gap: calc(var(--wp--custom--layout--grid-gap) * 1.5);
}
.mro-location .mro-location__facts { margin-top: var(--wp--preset--spacing--70); }

.mro-location .mro-location__photo { position: relative; }
.mro-location .mro-location__photo img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--wp--custom--radius--lg);
  box-shadow: var(--wp--preset--shadow--md);
}
.mro-location .mro-location__photo figcaption {
  position: absolute;
  left: var(--wp--preset--spacing--50);
  bottom: var(--wp--preset--spacing--50);
  display: inline-flex;
  align-items: center;
  gap: var(--wp--preset--spacing--20);
  margin: 0;
  padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
  border-radius: var(--wp--custom--radius--full);
  background: var(--wp--preset--color--base);
  box-shadow: var(--wp--preset--shadow--md);
  font-size: var(--wp--preset--font-size--sm);
  font-weight: 600;
  color: var(--wp--preset--color--contrast);
}
.mro-location .mro-location__photo figcaption .mro-icon { color: var(--wp--preset--color--accent-deep); }

.mro-location .mro-location__subtitle {
  margin: var(--wp--preset--spacing--110) 0 var(--wp--preset--spacing--60);
  font-family: var(--wp--preset--font-family--display);
  font-size: var(--wp--preset--font-size--xxl);
  font-weight: 400;
  letter-spacing: var(--wp--custom--tracking--display);
  text-transform: uppercase;
}

.mro-location .mro-bento {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: calc(var(--wp--preset--spacing--120) * 2.5);
  gap: var(--wp--preset--spacing--40);
}
.mro-location .mro-bento__tile {
  position: relative;
  overflow: hidden;
  border-radius: var(--wp--custom--radius--lg);
  background: var(--wp--preset--color--contrast);
}
.mro-location .mro-bento__tile--feature { grid-column: span 2; grid-row: span 2; }
.mro-location .mro-bento__tile img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  transition: transform var(--wp--custom--duration--base) var(--wp--custom--ease--standard);
}
.mro-location .mro-bento__tile:hover img { transform: scale(1.04); }
.mro-location .mro-bento__caption {
  position: absolute;
  inset: auto 0 0 0;
  padding: var(--wp--preset--spacing--90) var(--wp--preset--spacing--50) var(--wp--preset--spacing--50);
  background: linear-gradient(180deg, transparent 0%, var(--wp--custom--color--overlay) 70%);
  color: var(--wp--preset--color--base);
}
.mro-location .mro-bento__title {
  margin: 0 0 var(--wp--preset--spacing--10);
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--lg);
  font-weight: 700;
  color: inherit;
}
.mro-location .mro-bento__tile--feature .mro-bento__title {
  font-family: var(--wp--preset--font-family--display);
  font-size: var(--wp--preset--font-size--xxxl);
  font-weight: 400;
  letter-spacing: var(--wp--custom--tracking--display);
  line-height: var(--wp--custom--leading--display);
  text-transform: uppercase;
}
.mro-location .mro-bento__meta {
  display: flex;
  align-items: center;
  gap: var(--wp--preset--spacing--20);
  margin: 0;
  font-size: var(--wp--preset--font-size--sm);
  color: var(--wp--preset--color--base);
  line-height: var(--wp--custom--leading--tight);
}
.mro-location .mro-bento__meta .mro-icon { color: var(--wp--preset--color--mint); }

@media (max-width: 1023.98px) {
  .mro-location .mro-location__top { grid-template-columns: minmax(0, 1fr); }
  .mro-location .mro-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 479.98px) {
  .mro-location .mro-bento { grid-template-columns: minmax(0, 1fr); grid-auto-rows: calc(var(--wp--preset--spacing--120) * 2.25); }
  .mro-location .mro-bento__tile--feature { grid-column: auto; grid-row: span 1; }
}
@media (prefers-reduced-motion: reduce) {
  .mro-location .mro-bento__tile img { transition: none; }
}
