.opening {
  position: relative;
  height: clamp(650px,calc(100svh - 128px),1100px);
  min-height: 0;
  display: block;
}

.opening-content {
  position: absolute;
  inset: var(--inset);
  width: auto;
  padding: 0;
}

.opening h1 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  max-width: none;
  font-size: clamp(52px,7.1vw,136px);
  line-height: 1.03;
  transform: translate(var(--move-x,0px),var(--move-y,0px));
}

.opening p {
  position: absolute;
  right: 0;
  top: 0;
  bottom: auto;
  left: auto;
  width: 40%;
  max-width: 580px;
  margin: 0;
  font-size: clamp(18px,1.7vw,26px);
  transform: translate(var(--move-x,0px),var(--move-y,0px));
}

body[data-lines=two] .opening h1 span {
  display: block;
  white-space: nowrap;
}

.panel {
  position: relative;
}

@media (max-width:800px) and (min-width:701px) {
  .opening {
    height: 690px;
  }

  .opening p {
    width: 48%;
  }
}

@media (max-width:700px) {
  .opening {
    height: auto;
    min-height: max(620px,calc(100svh - 102px));
    display: flex;
    align-items: end;
  }

  .opening-content {
    position: static;
    width: 100%;
    padding-top: 90px;
  }

  .opening h1 {
    position: static;
    font-size: clamp(43px,11.5vw,66px) !important;
    line-height: 1.04;
    max-width: 18ch;
    transform: none !important;
  }

  body[data-lines=two] .opening h1 span {
    display: inline;
    white-space: normal;
  }

  .opening p {
    position: static;
    width: 100%;
    max-width: 420px;
    font-size: 18px;
    line-height: 1.4;
    margin: 28px 0 0;
    transform: none !important;
  }
}

.narrative {
  display: contents;
}

body[data-grouping=combined] .narrative {
  display: block;
  background: var(--ink);
  color: #eef0f0;
  border-radius: var(--radius);
  overflow: hidden;
}

body[data-grouping=combined] .narrative>.panel {
  background: transparent;
  border-radius: 0;
  overflow: visible;
}

body[data-grouping=combined] .mission {
  padding-bottom: 0;
}

body[data-grouping=combined] .mission .section-label {
  margin-bottom: 56px;
}

body[data-grouping=combined] .agenda {
  padding-top: clamp(100px,12vw,200px);
  padding-bottom: 0;
}

body[data-grouping=combined] .agenda-intro {
  display: block;
  margin-bottom: 56px;
}

body[data-grouping=combined] .agenda-intro>p {
  margin-top: 22px;
  font-size: clamp(22px,2.1vw,32px);
  line-height: 1.25;
  letter-spacing: -.025em;
  max-width: 30ch;
  color: #a7abad;
}

body[data-grouping=combined] .agenda-items {
  gap: clamp(24px,3vw,60px);
}

body[data-grouping=combined] .agenda-item h3 {
  font-size: clamp(21px,1.85vw,29px);
  line-height: 1.2;
  letter-spacing: -.025em;
}

body[data-grouping=combined] .agenda-item p {
  font-size: clamp(17px,1.45vw,21px);
  line-height: 1.45;
  color: #a7abad;
  margin-top: 14px;
  max-width: 30ch;
}

body[data-grouping=combined] .offerings {
  padding-top: clamp(100px,12vw,200px);
  padding-bottom: 20px;
}

@media (max-width:700px) {
  body[data-grouping=combined] .agenda-items {
    display: block;
  }

  body[data-grouping=combined] .agenda-item {
    display: block;
  }

  body[data-grouping=combined] .agenda-item+.agenda-item {
    margin-top: 50px;
  }

  body[data-grouping=combined] .agenda-item h3 {
    font-size: 24px;
  }

  body[data-grouping=combined] .agenda-item p {
    font-size: 18px;
    max-width: 36ch;
  }

  body[data-grouping=combined] .mission .section-label {
    margin-bottom: 38px;
  }

  body[data-grouping=combined] .agenda-intro {
    margin-bottom: 36px;
  }
}

body .agenda .agenda-intro {
  display: block;
  margin-bottom: 30px;
}

.research-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

body .agenda .section-label,
.research-link {
  font-size: 15px;
  line-height: 1.35;
  letter-spacing: -.015em;
}

.research-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
  color: #c6cacc;
}

.research-link>span:last-child {
  text-decoration: underline;
  text-decoration-color: #62686a;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}

.research-link:hover {
  color: white;
}

.triangle {
  display: block;
  width: 0;
  height: 0;
  border-left: 7px solid #878d90;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  transition: transform 180ms ease;
}

.research-link:hover .triangle {
  transform: translateX(2px);
}

body .agenda .agenda-intro>p {
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: -.015em;
  max-width: none;
  margin-top: 14px;
  color: #a7abad;
}

body .agenda .agenda-items {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 14px;
}

body .agenda .agenda-item {
  display: block;
  margin: 0;
  min-width: 0;
}

body .agenda .agenda-item h3,
body .agenda .agenda-item p {
  font-size: clamp(15px,1.35vw,19px);
  line-height: 1.35;
  letter-spacing: -.015em;
  font-weight: 400;
}

body .agenda .agenda-item h3 {
  color: #e3e6e7;
}

body .agenda .agenda-item p {
  color: #a7abad;
  margin-top: 4px;
  max-width: 32ch;
  padding-right: 12px;
}

.research-diagram {
  display: none;
}

@media (max-width:700px) {
  body .agenda .agenda-items {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  body .agenda .agenda-item h3,
  body .agenda .agenda-item p {
    font-size: 16px;
    line-height: 1.4;
  }

  body .agenda .agenda-item p {
    max-width: 38ch;
    padding: 0;
  }

  body .agenda .agenda-intro>p {
    font-size: 16px;
    max-width: 32ch;
    margin-top: 18px;
  }

  body .agenda .agenda-intro {
    margin-bottom: 28px;
  }

  .research-heading {
    gap: 12px;
  }

  body .agenda .section-label,
  .research-link {
    font-size: 14px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .triangle {
    transition: none;
  }
}

body[data-research=broad] .refined-broad {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2/1;
  margin: 24px 0 22px;
}

.refined-broad .broad-base {
  fill: #242a2c;
}

.refined-broad .light-top {
  stop-color: #929b9e;
}

.refined-broad .light-middle {
  stop-color: #6c787d;
}

.refined-broad .light-bottom {
  stop-color: #3f4b50;
}

@media (max-width:700px) {
  body[data-research=broad] .refined-broad {
    max-width: 440px;
    margin-top: 8px;
  }
}

body .mission .section-label {
  color: #eef0f0;
  font-size: 15px;
  line-height: 1.35;
  letter-spacing: -.015em;
}

@media (max-width:700px) {
  body .mission .section-label {
    font-size: 14px;
  }
}

body:not([data-offerings=original]) .offerings {
  padding-bottom: var(--inset);
}

.offering-study {
  --cell: #202324;
  --cell-hover: #25292a;
  --heading: #eef0f0;
  --copy: #a7abad;
  --link: #c6cacc;
}

.offering-study>.section-label {
  font-size: 15px;
  line-height: 1.35;
  letter-spacing: -.015em;
  color: var(--heading);
  margin-bottom: 28px;
}

.offering-grid {
  display: grid;
  gap: 2px;
}

.offering-entry {
  display: grid;
  grid-template-columns: minmax(140px,1fr) minmax(0,2fr) minmax(160px,1fr);
  gap: 28px;
  align-items: start;
  padding: 26px 24px 30px;
  background: var(--cell);
  min-height: 132px;
}

.offering-entry h3,
.offering-entry p {
  font-size: clamp(15px,1.35vw,19px);
  line-height: 1.4;
  letter-spacing: -.015em;
  font-weight: 400;
}

.offering-entry h3 {
  color: var(--heading);
}

body .offerings .offering-entry p {
  font-size: clamp(15px,1.35vw,19px);
  line-height: 1.4;
  color: var(--copy);
  max-width: 44ch;
  margin: 0;
}

.offering-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  justify-self: end;
  white-space: nowrap;
  color: var(--link);
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  font: inherit;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: -.015em;
  min-height: 24px;
  cursor: pointer;
  text-align: left;
}

.offering-link>span:last-child {
  text-decoration: underline;
  text-decoration-color: #62686a;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}

.offering-link:hover {
  color: var(--heading);
}

.offering-link:hover .triangle {
  transform: translateX(2px);
}

.offering-entry:focus-within {
  background: var(--cell-hover);
}

#offerings {
  scroll-margin-top: 24px;
}

@media (min-width:701px) and (max-width:900px) {
  .offering-entry {
    grid-template-columns: 1fr 2fr;
    gap: 20px 28px;
  }

  .offering-link {
    grid-column: 2;
    justify-self: start;
  }
}

@media (max-width:700px) {
  .offering-study>.section-label {
    font-size: 14px;
    margin-bottom: 24px;
  }

  .offering-entry {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    min-height: 0;
    gap: 14px;
    padding: 24px 20px 28px;
  }

  .offering-entry h3,
  body .offerings .offering-entry p {
    font-size: 16px;
    line-height: 1.4;
  }

  .offering-link {
    font-size: 14px;
    justify-self: start;
    margin-top: 12px;
    min-height: 36px;
  }
}

.offering-intro {
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: -.015em;
  color: var(--copy);
  margin: 14px 0 30px;
  max-width: 64ch;
}

body[data-preface=minimal] .offering-intro {
  display: none;
}

.offering-note {
  width: calc(50% - 7px);
  max-width: 52ch;
  margin: 28px 0 24px auto;
  font-size: clamp(15px,1.35vw,19px);
  line-height: 1.4;
  letter-spacing: -.015em;
  color: var(--copy);
}

@media (max-width:700px) {
  .offering-intro {
    margin: 18px 0 28px;
    font-size: 16px;
    max-width: 34ch;
  }

  .offering-note {
    width: 100%;
    margin: 24px 0 12px;
    font-size: 16px;
    max-width: 38ch;
  }
}
