/* An editorial close: fixed contrast, dimensional artwork, one action. */
.site-close {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: 100px;
  background: linear-gradient(115deg, #091d33 25%, #17454c 100%);
  color: #fff;
}
.site-close__art {
  position: absolute;
  z-index: -2;
  inset: 0 0 0 32%;
  overflow: hidden;
  mix-blend-mode: screen;
}
.site-close__art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 60%;
}
.site-close::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, #091d33 0%, #091d33 32%, #091d33e8 43%, #091d3366 60%, #091d3300 78%);
  pointer-events: none;
}
.site-close__inner {
  display: flex;
  align-items: center;
  min-height: 400px;
  padding-block: 80px;
}
.site-close__copy { max-width: 53%; }
.site-close h2 {
  margin: 0;
  color: #fff;
  font-family: var(--sans);
  font-size: clamp(36px, 4.1vw, 58px);
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 1.1;
  text-wrap: balance;
}
.site-close p {
  margin: 20px 0 0;
  color: #d7e3ed;
  font-size: 18px;
  line-height: 1.6;
  max-width: 38ch;
}
.site-close__button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  min-height: 50px;
  margin-top: 30px;
  padding: 14px 22px;
  background: #f2c997;
  color: #152537;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  text-decoration: none;
  box-shadow: inset 0 1px 0 #ffffff55, 0 8px 24px #04132233;
  transition: background-color 160ms ease;
}
.site-close__button:hover { background: #ffddb0; }
.site-close__button:focus-visible { outline: 2px solid #fff; outline-offset: 5px; }
.site-close__button svg { width: 20px; height: 20px; transition: transform 160ms ease; }
.site-close__button:hover svg { transform: translateX(3px); }
@media (max-width: 760px) {
  .site-close { margin-top: 64px; }
  .site-close__inner { min-height: 560px; padding-block: 48px 290px; align-items: flex-start; }
  .site-close__copy { max-width: 100%; }
  .site-close h2 { font-size: clamp(34px, 7vw, 48px); }
  .site-close p { font-size: 16px; margin-top: 16px; }
  .site-close__button { margin-top: 24px; }
  .site-close__art { inset: 180px 0 0; }
  .site-close__art img { object-position: 58% 62%; }
  .site-close::before { background: linear-gradient(180deg, #091d33 0%, #091d33 32%, #091d33cc 46%, #091d3300 68%); }
}
@media (prefers-reduced-motion: reduce) {
  .site-close__button, .site-close__button svg { transition: none; }
}