@font-face {
  font-family: Fraunces;
  src: url("/assets/fraunces.woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: Franklin;
  src: url("/assets/franklin.woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --font-display: Fraunces, Georgia, serif;
  --font-body: Franklin, Arial, sans-serif;
  --cream: #f5eedf;
  --white: #fcfaf5;
  --ink: #272522;
  --navy: #223245;
  --red: #ab191f;
  --olive: #534f35;
  --gold: #a78c56;
  --stone: #d8d0c3;
  --gold-light: #d8c399;
  --rule-strong: #b4aa9a;
  --paper-cut: polygon(
    0 1%,
    38% 0,
    74% 0.8%,
    99% 0,
    100% 98%,
    58% 100%,
    1% 99%
  );
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.65;
}
button {
  -webkit-tap-highlight-color: transparent;
}
a {
  -webkit-tap-highlight-color: transparent;
}
button {
  font: inherit;
}
a {
  color: inherit;
  text-decoration: none;
}
a:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 6px;
}
button:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 6px;
}
h1 {
  margin: 0;
}
h2 {
  margin: 0;
}
h3 {
  margin: 0;
}
h2 {
  font-size: clamp(48px, 5.3vw, 76px);
}
p + p {
  margin-top: 18px;
}
.text-link {
  font-size: 15px;
  line-height: 1.5;
  font-weight: 600;
  display: inline-block;
  padding: 10px 0;
  border-bottom: 1px solid;
}
.text-link:after {
  content: "↗";
  margin-left: 17px;
  font-size: 18px;
}
.text-link:hover {
  color: var(--red);
}
.host-button {
  display: inline-block;
  position: relative;
  width: 176px;
  height: 50px;
  transform: rotate(-1deg);
  flex: none;
}
.host-button img {
  position: absolute;
  width: 188px;
  height: 69px;
  max-width: none;
  left: -6px;
  top: -3px;
}
.host-button:hover {
  filter: brightness(0.93);
}
.actions {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-top: 30px;
}
.photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 760px) {
  body {
    font-size: 16px;
  }
  h2 {
    font-size: 47px;
  }
}
main .text-link {
  font-size: 22px;
  line-height: 1.35;
  border-bottom-width: 2px;
}
main .text-link:after {
  font-size: 24px;
  margin-left: 20px;
}
main .host-button {
  width: 220px;
  height: 62.5px;
}
main .host-button img {
  width: 235px;
  height: 86.25px;
  left: -7.5px;
  top: -3.75px;
}
@media (max-width: 760px) {
  main .text-link {
    font-size: 20px;
    line-height: 1.35;
  }
  main .text-link:after {
    font-size: 22px;
    margin-left: 13px;
  }
  main .host-button {
    width: 220px;
    height: 62.5px;
  }
  main .host-button img {
    width: 235px;
    height: 86.25px;
    left: -7.5px;
    top: -3.75px;
  }
}
main .text-link {
  position: relative;
  isolation: isolate;
  transition: color 0.16s ease;
}
main .text-link:before {
  content: "";
  position: absolute;
  z-index: -1;
  background: var(--link-backer, var(--navy));
  transform: scaleX(0.92) rotate(-0.7deg);
  opacity: 0;
  transition:
    opacity 0.15s ease,
    transform 0.17s ease;
  pointer-events: none;
}
main a[data-treatment="primary"] {
  --link-backer: var(--red);
  --link-ink: var(--cream);
}
main a[data-treatment="participation"] {
  --link-backer: var(--olive);
  --link-ink: var(--cream);
}
main a[data-treatment="institutional"] {
  --link-backer: var(--navy);
  --link-ink: var(--cream);
}
main a[data-treatment="leadership"] {
  --link-backer: var(--gold);
  --link-ink: var(--ink);
}
main .text-link:hover {
  color: var(--link-ink, var(--cream));
  border-color: transparent;
}
main .text-link:focus-visible {
  color: var(--link-ink, var(--cream));
  border-color: transparent;
}
main .text-link:hover:before {
  opacity: 1;
  transform: scaleX(1) rotate(-0.7deg);
}
main .text-link:focus-visible:before {
  opacity: 1;
  transform: scaleX(1) rotate(-0.7deg);
}
main .host-button {
  transition:
    transform 0.18s ease,
    filter 0.18s ease;
}
main .host-button:hover {
  transform: rotate(1deg);
  filter: none;
}
main .host-button:focus-visible {
  transform: rotate(1deg);
  filter: none;
}
main .text-link {
  padding: 15px 28px;
  margin-left: -28px;
  border-bottom: 0;
  text-decoration: underline;
  text-underline-offset: 7px;
  max-width: 100%;
}
main .text-link:after {
  content: none;
}
main .text-link:before {
  inset: 0;
  clip-path: polygon(0 3%, 98% 0, 100% 96%, 1% 100%);
}
main .text-link:hover {
  text-decoration: none;
}
main .text-link:focus-visible {
  text-decoration: none;
}
.photo-face {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
a.photo-face {
  transition: filter 0.16s ease;
}
a.photo-face:focus-visible {
  outline-offset: 10px;
}
.host-button {
  filter: drop-shadow(0 3px 3px #27252218);
}
.photo-face {
  filter: drop-shadow(5px 12px 10px rgba(39, 37, 34, 0.32));
}
a.photo-face:hover {
  filter: drop-shadow(5px 14px 11px rgba(39, 37, 34, 0.38));
}
summary:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 6px;
}
p {
  margin: 0;
}
figure {
  margin: 0;
}

/* Keyboard entry stays out of the resting composition. */
.skip-link {
  position: fixed;
  inset: 12px auto auto 12px;
  z-index: 100;
  padding: 12px 18px;
  background: var(--cream);
  color: var(--navy);
  transform: translateY(-200%);
}
.skip-link:focus {
  transform: none;
}
#main-content:focus {
  outline: none;
}
.unavailable {
  min-height: 65vh;
  padding-block: 170px 90px;
}
.unavailable h1 {
  font-size: clamp(42px, 6vw, 76px);
  max-width: 18ch;
  margin-bottom: 30px;
}
.unavailable p {
  max-width: 55ch;
  margin-bottom: 20px;
}
/* Guests abroad supplies the display tone. Sizes/measure belong to each page.
   A common optical drawing avoids the hero's former high-contrast opsz=114. */
h1,
h2,
h3 {
  font-family: var(--font-display);
  font-weight: 750;
  font-optical-sizing: none;
  font-variation-settings:
    "wght" 750,
    "opsz" 76;
  letter-spacing: -0.035em;
  line-height: 1.05;
}
.wrap {
  width: calc(100% - clamp(48px, calc(14vw - 57.6px), 144px));
  max-width: 1296px;
  margin-inline: auto;
}
/* A two-color indicator remains legible on cream, ink and photography. */
:is(a, button, summary):focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 5px;
  box-shadow: 0 0 0 5px var(--white);
}
/* One motion policy for shared controls and every page. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
  :is(a, button):hover,
  :is(a, button):focus-visible,
  a::before {
    transform: none !important;
  }
}

/* Closing artwork scales from its own column, independently of viewport size.
   Page-specific variables preserve each headline's authored silhouette. */
.closing-art { container-type:inline-size; min-width:0; }
.closing-art > h2.closing-art-title { width:100%; max-width:none; margin:0; font-size:var(--closing-size,20cqw); min-height:3.5em; }
.closing-art .closing-art-title > img.closing-art-hand { left:auto; right:0; top:var(--closing-hand-top,.8em); width:var(--closing-hand-size,2.35em); }

/* Text-labelled counterpart to the supplied Host artwork; interaction is shared in shell.css. */
.host-material-action { display:inline-block; position:relative; isolation:isolate; transform:rotate(var(--action-tilt,-1deg)); color:var(--white); font-weight:700; text-decoration:none; filter:drop-shadow(0 3px 3px #27252218); }
.host-material-action::before { content:''; position:absolute; inset:0; z-index:-1; background:var(--red); clip-path:var(--paper-cut); }

/* Inline bars wrap with prose. Cloned backgrounds keep every line legible. */
.inline-link {
 text-decoration:underline; text-underline-offset:.2em; text-decoration-thickness:2px;
 padding:.04em .13em; margin-inline:-.13em; border-radius:2% 4% 3% 1%;
 -webkit-box-decoration-break:clone; box-decoration-break:clone;
 background-image:linear-gradient(178deg,transparent 6%,var(--link-backer,var(--navy)) 7% 92%,transparent 93%);
 background-size:0 100%; background-repeat:no-repeat;
 /* Both colors change together, avoiding low-contrast transition frames. */
}
.inline-link:is(:hover,:focus-visible) {
 text-decoration:none; color:var(--link-ink,var(--white)); background-color:transparent; background-size:100% 100%;
}
.inline-link[data-treatment='leadership'] { --link-backer:var(--gold-light); --link-ink:var(--ink); }

/* Live-text material buttons deepen their authored tilt, never crossing upright. */
button.host-material-action { border:0; background:transparent; cursor:pointer; }
.host-material-action:disabled { opacity:.65; cursor:wait; }
@media(prefers-reduced-motion:reduce) {
 .host-material-action:is(:hover,:focus-visible) { transform:rotate(var(--action-tilt,-1deg))!important; }
}

/* Shared Homepage provenance object; page styles own its placement. */
.foundation-mark {
  display: flex;
  align-items: center;
  gap: 26px;
  font-size: 22px;
  min-width: 0;
}
.foundation-mark span {
  white-space: nowrap;
}
.foundation-mark a {
  display: block;
  position: relative;
  isolation: isolate;
  width: 335px;
  max-width: 100%;
  padding: 18px 22px;
  transform: rotate(-0.5deg);
  transition: transform 0.18s ease;
  filter: drop-shadow(2px 5px 4px #27252225);
}
.foundation-mark a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--navy);
  clip-path: var(--paper-cut);
}
.foundation-mark a:hover,
.foundation-mark a:focus-visible {
  transform: rotate(1deg);
}
.foundation-mark img {
  display: block;
  width: 100%;
  height: auto;
}