/* Supplied introduction design. Its content rails match the existing hero header. */
@font-face {
  font-family: 'SPI Bodoni';
  src: url('../fonts/library/itc-bodoni-seventytwo/itc-bodoni-seventytwo-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SPI Baskerville';
  src: url('../fonts/library/baskerville/baskerville-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
.spi {
  --spi-rail: calc((100vw - min(100vw, 1900px)) / 2 + 170px);
  --spi-navy: #073b57;
  --spi-sand: #a18162;
  position: relative;
  isolation: isolate;
  height: 800px;
  padding: 150px 0 28px;
  overflow: hidden;
  background: #faf6ef;
  color: var(--spi-navy);
}
.spi .spi__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .44fr) minmax(0, .56fr);
  align-items: center;
  column-gap: clamp(22px, 2.5vw, 48px);
  width: calc(100% - 2 * var(--spi-rail));
  height: 100%;
  margin-inline: auto;
}
.spi .spi__copy { position: relative; z-index: 1; min-width: 0; }
.spi .spi__kicker {
  display: flex;
  align-items: center;
  gap: 17px;
  margin: 0 0 28px;
  font: 400 clamp(9px, .72vw, 12px)/1.5 'ABS Park Label', Arial, sans-serif;
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--spi-sand);
}
.spi .spi__kicker::before { content: ''; flex: 0 0 43px; height: 1px; background: currentColor; }
.spi .spi__title {
  margin: 0;
  font: 400 clamp(68px, 6.7vw, 110px)/.94 'SPI Bodoni', 'Bauer Bodoni', Georgia, serif;
  letter-spacing: -.035em;
  color: var(--spi-navy);
  text-wrap: initial;
}
.spi .spi__title span, .spi .spi__title em { display: block; }
.spi .spi__title span { white-space: nowrap; }
.spi .spi__title em { font: inherit; font-style: normal; color: var(--spi-sand); }
.spi .spi__rule { display: block; width: 43px; height: 1px; margin: 23px 0 24px; background: var(--spi-sand); }
.spi .spi__body {
  max-width: 44ch;
  margin: 0;
  font: 400 clamp(18px, 1.44vw, 23px)/1.5 'SPI Baskerville', Georgia, serif;
  letter-spacing: -.01em;
  color: #164b6e;
}
.spi .spi__link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  min-height: 45px;
  margin-top: 26px;
  padding: 0 0 8px;
  border-bottom: 1px solid var(--spi-sand);
  color: var(--spi-navy);
  font: 400 clamp(11px, .9vw, 15px)/1.4 'ABS Park Label', Arial, sans-serif;
  letter-spacing: .21em;
  text-transform: uppercase;
  text-decoration: none;
}
.spi .spi__link svg { width: 30px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.2; transition: transform .2s ease; }
.spi .spi__link:hover svg { transform: translateX(5px); }
.spi .spi__link:focus-visible { outline: 2px solid var(--spi-navy); outline-offset: 6px; }
.spi .spi__visual { display: flex; align-items: center; align-self: start; justify-content: flex-end; height: 100%; min-height: 0; min-width: 0; margin: 0; }
.spi .spi__art { display: block; width: auto; height: 100%; max-width: 100%; object-fit: contain; object-position: right center; mask-image: linear-gradient(to right, transparent, #000 9%, #000 91%, transparent), linear-gradient(to bottom, transparent, #000 6%, #000 94%, transparent); mask-composite: intersect; }
/* Fill the artwork column and extend toward the copy while retaining the right rail. */
@media (min-width: 801px) {
  .spi .spi__art { width: calc(100% + 32px); max-width: none; flex-shrink: 0; object-fit: fill; }
}
@media (max-width: 1450px) {
  .spi { --spi-rail: clamp(80px, 8.947vw, 170px); }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .spi .spi__inner { grid-template-columns: minmax(0, .46fr) minmax(0, .54fr); column-gap: 20px; }
  .spi .spi__title { font-size: clamp(60px, 6.5vw, 72px); }
  .spi .spi__kicker { gap: 12px; font-size: 9px; letter-spacing: .1em; }
  .spi .spi__kicker::before { flex-basis: 28px; }
  .spi .spi__body { font-size: 18px; }
}
@media (max-width: 900px) {
  .spi { --spi-rail: 24px; }
}
@media (min-width: 801px) and (max-width: 900px) {
  .spi .spi__title { font-size: 64px; }
  .spi .spi__kicker { gap: 10px; letter-spacing: .1em; font-size: 9px; }
  .spi .spi__kicker::before { flex-basis: 24px; }
  .spi .spi__body { font-size: 18px; }
}
@media (max-width: 800px) {
  .spi { height: auto; padding: 150px 0 42px; }
  .spi .spi__inner { grid-template-columns: minmax(0, 1fr); row-gap: 28px; height: auto; }
  .spi .spi__kicker { gap: 12px; margin-bottom: 26px; font-size: 10px; letter-spacing: .12em; }
  .spi .spi__kicker::before { flex-basis: 28px; }
  .spi .spi__title { font-size: clamp(64px, 12vw, 90px); }
  .spi .spi__body { max-width: 48ch; font-size: 20px; line-height: 1.5; }
  .spi .spi__link { min-height: 48px; margin-top: 24px; font-size: 12px; }
  .spi .spi__visual { width: 100%; height: auto; margin: 0; }
  .spi .spi__art { width: 100%; height: auto; max-height: 620px; }
}
@media (max-width: 380px) {
  .spi .spi__kicker { font-size: 9px; letter-spacing: .08em; }
  .spi .spi__title { font-size: 58px; }
  .spi .spi__body { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) { .spi .spi__link svg { transition: none; } }

/* Give the history section more separation from the introduction. */
body.about-page #introduction + #history { margin-top: 80px; }

/* Keep the revised introduction heading on a single line. */
.spi .spi__title { font-size: clamp(48px, 4.6vw, 76px); }
@media (min-width: 801px) and (max-width: 1100px) {
  .spi .spi__title { font-size: clamp(38px, 4.5vw, 50px); }
}
@media (max-width: 800px) {
  .spi .spi__title { font-size: clamp(32px, 8.4vw, 66px); }
}

/* Match the live About Us hero's display, body, and label typography. */
.spi .spi__copy { container-type: inline-size; }
.spi .spi__title {
  width: max-content;
  max-width: none;
  font: 400 clamp(68px, 5.789vw, 110px)/.93 'Gulf Preview Bodoni', Georgia, serif;
  letter-spacing: -.012em;
  word-spacing: 0;
}
.spi .spi__body {
  font: 400 clamp(21px, 1.544vw, 29.3px)/1.3 'Gulf Preview Newsreader', Georgia, serif;
  letter-spacing: -.008em;
}
.spi .spi__kicker, .spi .spi__link {
  font: 400 clamp(14px, .9526vw, 18.1px)/1.4 'Univers Next', Arial, sans-serif;
  letter-spacing: .2em;
}
/* Fit the one-line heading to the narrower tablet column. */
@media (min-width: 901px) and (max-width: 1100px) {
  .spi .spi__title { font-size: min(68px, 15.2cqw); }
}
@media (max-width: 900px) {
  .spi .spi__title {
    font-size: min(clamp(60px, 13.1vw, 106px), 16cqw);
    font-weight: 700;
    line-height: .96;
    letter-spacing: -.045em;
  }
  .spi .spi__body { font-size: clamp(21px, 3.2vw, 26px); }
  .spi .spi__kicker, .spi .spi__link { font-size: clamp(10px, 1.65vw, 13px); letter-spacing: .17em; }
}
@media (max-width: 540px) {
  .spi .spi__title { font-size: min(clamp(52px, 13.9vw, 72px), 16.1cqw); letter-spacing: -.05em; }
  .spi .spi__body { font-size: 21px; line-height: 1.35; }
  .spi .spi__kicker, .spi .spi__link { font-size: 10px; letter-spacing: .14em; }
}
@media (max-width: 360px) {
  .spi .spi__title { font-size: min(47px, 16.1cqw); }
  .spi .spi__body { font-size: 19px; }
  .spi .spi__kicker, .spi .spi__link { font-size: 9px; letter-spacing: .1em; }
}

.spi .spi__title .spi__horizon { display: inline; color: #a18162; }