/* Abruzzo follows the same editorial panels and scroll reveals as Molise and Ischia. */
.abruzzo-page {
  --schedule-peach: #f5e0c6;
  --sage: #c8c29f;
}

.abruzzo-page .site-header,
.abruzzo-page .site-header.is-scrolled { color: #8a432f; }
.abruzzo-page .brand,
.abruzzo-page .site-header.is-scrolled .brand { background: #8a432f; }
.abruzzo-page .mobile-nav .nav-link,
.abruzzo-page .site-header.is-scrolled .mobile-nav .nav-link { color: #8a432f; }
.abruzzo-page .abruzzo-hero > img { object-position: 50% 18%; }
.abruzzo-page .abruzzo-title { background: #546548; }
.abruzzo-page .abruzzo-title h1 {
  font-size: clamp(2.2rem, 4vw, 4.4rem);
}
.abruzzo-title .abruzzo-castellar { width: 7.0897em; max-width: 100%; height: auto; min-width: 0; align-self: center; }
.abruzzo-page .journey-intro h2 { max-width: 13ch; font-size: clamp(3rem, 5.3vw, 5.4rem); text-wrap: balance; }

/* Pasta and architecture above; the coast and ferratelle below. */
.abruzzo-photo-grid { grid-auto-rows: clamp(320px, 43vw, 640px); }
.abruzzo-photo--chitarra, .abruzzo-photo--ferratelle { grid-column: span 2; }
.abruzzo-photo--church, .abruzzo-photo--trabocco { grid-column: span 3; }
.abruzzo-photo--church { --photo-position: 50% 24%; }
.abruzzo-photo--trabocco { --photo-position: 50% 65%; }
.abruzzo-photo--chitarra { --photo-position: 50% 50%; }
.abruzzo-photo--ferratelle { --photo-position: 50% 48%; }

.abruzzo-page main > .abruzzo-photo-interlude {
  display: flex;
  justify-content: center;
  width: min(1500px, calc(100% - var(--panel-gutter) - var(--panel-gutter)));
  margin: var(--panel-gap) auto 0;
  padding: clamp(24px, 5vw, 80px);
}
.abruzzo-photo-interlude figure { width: min(100%, 760px); margin: 0; }
.abruzzo-photo-interlude img { display: block; width: 100%; height: auto; }
.abruzzo-photo-interlude.molise-reveal { transition-duration: 1s; }

@media (max-width: 760px) {
  .abruzzo-page .abruzzo-hero > img { object-position: 55% 50%; }
  .abruzzo-page .abruzzo-title h1 { font-size: clamp(1.7rem, 5.1vw, 3rem); }
  .abruzzo-photo-grid { grid-auto-rows: clamp(225px, 50vw, 360px); }
  .abruzzo-photo-grid .molise-photo { grid-column: span 1; }
  .abruzzo-photo--trabocco { --photo-position: 50% 54%; }
}

.abruzzo-title .abruzzo-castellar { display:block; aspect-ratio:3318 / 468; background:var(--title-butter); -webkit-mask:url("../assets/abruzzo-castellar-butter.png") center / contain no-repeat; mask:url("../assets/abruzzo-castellar-butter.png") center / contain no-repeat; }