.authors-page {
  --authors-wide: min(1120px, calc(100vw - 64px));
  --paper: var(--losp-paper);
  --cream: var(--losp-cream);
  --gold: var(--losp-gold);
  --gold-light: var(--losp-gold-light);
  --red: var(--losp-red);
  --blue-950: var(--losp-blue-950);
  --hairline: var(--losp-hairline);
  --serif: var(--losp-font-heading);
  background: var(--paper);
}
.authors-page .page-width { width: var(--authors-wide); margin-inline: auto; }

.authors-page .site-header { position: relative; }

.authors-page a:focus-visible {
  outline: 3px solid rgba(118, 43, 46, .36);
  outline-offset: 5px;
}

.authors-page .eyebrow {
  margin-bottom: 18px;
  color: var(--gold);
  font-family: "Cormorant SC", var(--serif);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.authors-hero {
  width: var(--authors-wide);
  min-height: 550px;
  margin: 0 auto;
  padding: 70px 0 64px;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr);
  align-items: center;
  gap: clamp(64px, 9vw, 120px);
}

.authors-hero > div:first-child { max-width: 700px; }

.authors-hero h1 {
  color: var(--red);
  font-size: clamp(72px, 8vw, 108px);
  line-height: .9;
}

.authors-deck {
  margin: 28px 0 20px;
  color: var(--blue-950);
  font: 500 clamp(25px, 2.5vw, 32px)/1.36 var(--serif);
}

.authors-hero > div:first-child > p:not(.eyebrow):not(.authors-deck) {
  margin: 0 0 .95em;
  color: #3e403a;
  font-size: 19px;
  line-height: 1.7;
}

.authors-text-link,
.secondary-author-link,
.institution-link,
.light-text-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--red);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
}

.authors-text-link {
  margin-top: 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(118, 43, 46, .34);
}

.authors-hero-portrait {
  width: min(390px, 100%);
  margin: 0;
  justify-self: center;
  position: relative;
}

.authors-hero-portrait::before,
.authors-hero-portrait::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(185, 149, 75, .24);
  border-radius: 50%;
  pointer-events: none;
}

.authors-hero-portrait::before { width: 390px; height: 390px; inset: 30px auto auto -42px; }
.authors-hero-portrait::after { width: 300px; height: 300px; inset: 74px auto auto 4px; }

.authors-portrait-frame {
  width: 330px;
  height: 410px;
  margin-left: auto;
  display: block;
  overflow: hidden;
  border-radius: 48% 48% 6px 6px;
  background: var(--cream);
  box-shadow: 0 24px 48px rgba(7, 31, 58, .18);
  position: relative;
  z-index: 1;
}

.authors-portrait-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 24%;
}

.authors-hero-portrait figcaption {
  margin: 18px 0 0 60px;
  display: grid;
  position: relative;
  z-index: 2;
}

.authors-hero-portrait figcaption strong {
  color: var(--blue-950);
  font: 500 23px/1.1 var(--serif);
}

.authors-hero-portrait figcaption span {
  margin-top: 4px;
  color: var(--gold);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.authors-rule {
  width: var(--authors-wide);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 16px;
  color: var(--gold);
}

.authors-rule::before,
.authors-rule::after { content: ""; height: 1px; background: var(--hairline); }

.principal-author {
  padding: 84px 0 88px;
  display: grid;
  grid-template-columns: minmax(390px, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(62px, 8vw, 108px);
}

.principal-books {
  height: 490px;
  min-width: 430px;
  padding: 26px 42px;
  display: grid;
  grid-template-columns: repeat(2, 150px);
  grid-auto-rows: 214px;
  justify-content: center;
  align-content: center;
  gap: 18px 24px;
  position: relative;
}

.principal-books::before,
.principal-books::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(185, 149, 75, .2);
  border-radius: 50%;
}

.principal-books::before { width: 410px; height: 410px; inset: 40px auto auto 10px; }
.principal-books::after { width: 315px; height: 315px; inset: 88px auto auto 58px; }

.principal-book {
  width: 150px;
  position: relative;
  z-index: 2;
  box-shadow: 0 20px 38px rgba(7, 31, 58, .2);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.principal-book img { width: 100%; height: auto; }
.principal-book:hover { z-index: 5; box-shadow: 0 25px 48px rgba(7, 31, 58, .28); }
.principal-book--1 { transform: rotate(-2deg) translateY(4px); }
.principal-book--2 { transform: rotate(2deg) translateY(-6px); }
.principal-book--3 { transform: rotate(2deg) translateY(2px); }
.principal-book--4 { transform: rotate(-2deg) translateY(-8px); }
.principal-book--1:hover { transform: rotate(0) translateY(-8px); }
.principal-book--2:hover { transform: rotate(-4deg) translateY(-8px); }
.principal-book--3:hover { transform: rotate(4deg) translateY(-8px); }
.principal-book--4:hover { transform: rotate(0) translateY(-8px); }

.authors-page h2 {
  margin: 0;
  color: var(--red);
  font-size: clamp(43px, 4.6vw, 61px);
  line-height: 1.02;
}

.authors-page .footer-grid h2 {
  margin: 0 0 10px;
  color: var(--gold-light);
  font: 500 25px/1.1 var(--serif);
  letter-spacing: -0.03em;
}

.author-alternate-name,
.author-work {
  margin: 10px 0 21px;
  color: #2f5b5c;
  font: italic 20px/1.35 var(--serif);
}

.principal-copy > p:not(.eyebrow):not(.author-alternate-name),
.individual-grid > div:last-child > p:not(.eyebrow):not(.author-work) {
  margin: 0 0 .95em;
  color: #3e403a;
  font-size: 19px;
  line-height: 1.7;
}

.principal-copy .principal-lead { color: var(--blue-950) !important; font-weight: 500; }

.author-actions {
  margin-top: 26px;
  display: flex;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
}

.primary-button {
  min-height: 44px;
  padding: 12px 19px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--red);
  border: 1px solid var(--red);
  color: white;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}

.individual-author {
  padding: 78px 0 82px;
  background: var(--cream);
  border-block: 1px solid rgba(185, 149, 75, .23);
}

.individual-grid {
  display: grid;
  grid-template-columns: 300px minmax(0, 650px);
  justify-content: center;
  align-items: center;
  gap: clamp(62px, 9vw, 120px);
}

.author-portrait {
  width: 280px;
  aspect-ratio: 4 / 5;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(185, 149, 75, .38);
  border-radius: 48% 48% 5px 5px;
  background: var(--blue-950);
  box-shadow: 0 20px 38px rgba(7, 31, 58, .18), inset 0 0 0 9px var(--cream);
}

.author-portrait img {
  width: 100%;
  height: 100%;
  padding: 10px;
  object-fit: cover;
  object-position: center top;
  border-radius: inherit;
}

.institutional-section {
  padding: 84px 0 72px;
  background: var(--paper);
  border-bottom: 1px solid rgba(185, 149, 75, .28);
}

.authors-source-note {
	background: var(--paper);
	border-bottom: 1px solid rgba(185, 149, 75, .28);
	padding: 74px 0 82px;
}
.authors-source-note .page-width { max-width: 780px; }
.authors-source-note p:last-child { color: #4a4c46; font-size: 18px; line-height: 1.68; }

.authors-section-heading { max-width: 760px; margin-bottom: 46px; }
.authors-section-heading > p:last-child {
  margin: 18px 0 0;
  color: #4a4c46;
  font-size: 18px;
  line-height: 1.68;
}

.authors-section-heading > p:not(.eyebrow) {
  margin: 18px 0 0;
  color: #4a4c46;
  font-size: 18px;
  line-height: 1.68;
}

.institutional-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.institution-card {
  padding: 28px;
  display: grid;
  grid-template-columns: 155px minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  border: 1px solid rgba(185, 149, 75, .25);
  background: #fffefb;
}

.institution-cover { display: block; }
.institution-cover img {
  width: 100%;
  height: auto;
  box-shadow: 0 15px 28px rgba(7, 31, 58, .17);
}

.institution-role {
  margin: 0 0 9px;
  color: var(--gold);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.institution-card h3 {
  margin: 0 0 12px;
  color: var(--blue-950);
  font: 500 29px/1.08 var(--serif);
}

.institution-card > div > p:not(.institution-role) {
  margin: 0 0 17px;
  color: #55574f;
  font-size: 14px;
  line-height: 1.62;
}

.institution-link { line-height: 1.5; }
.institution-link em { font: inherit; }

.institutional-closing {
  margin-top: 48px;
  padding-top: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  border-top: 1px solid var(--hairline);
}

.institutional-closing img { width: 34px; height: 34px; opacity: .72; }

@media (max-width: 1020px) {
  .authors-hero { grid-template-columns: 1fr 330px; gap: 48px; }
  .principal-author { grid-template-columns: 370px minmax(0, 1fr); gap: 48px; }
  .principal-books { min-width: 370px; transform: scale(.86); transform-origin: center; }
  .institutional-grid { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .authors-page { --authors-wide: min(100% - 44px, 720px); }
  .authors-hero { min-height: 0; padding: 58px 0; grid-template-columns: 1fr; }
  .authors-hero-portrait { width: min(390px, 88vw); justify-self: start; }
  .principal-author { grid-template-columns: 1fr; gap: 30px; }
  .principal-books { width: 430px; margin: 0 auto; transform: scale(.92); }
  .individual-grid { grid-template-columns: 220px 1fr; gap: 46px; }
  .author-portrait { width: 220px; }
}

@media (max-width: 620px) {
  .authors-page { --authors-wide: calc(100% - 36px); }
  .authors-hero { padding: 46px 0 48px; }
  .authors-hero h1 { font-size: clamp(62px, 20vw, 86px); }
  .authors-deck { font-size: 23px; }
  .authors-hero > div:first-child > p:not(.eyebrow):not(.authors-deck),
  .principal-copy > p:not(.eyebrow):not(.author-alternate-name),
  .individual-grid > div:last-child > p:not(.eyebrow):not(.author-work) { font-size: 18px; }
  .principal-author { padding: 56px 0 62px; }
  .principal-books { width: 360px; min-width: 360px; height: 430px; transform: scale(.78); transform-origin: top left; margin-bottom: -78px; }
  .individual-author { padding: 58px 0 62px; }
  .individual-grid { grid-template-columns: 1fr; gap: 34px; }
  .authors-hero-portrait { justify-self: center; }
  .authors-portrait-frame { width: 280px; height: 350px; margin-inline: auto; }
  .authors-hero-portrait::before { width: 320px; height: 320px; left: 0; }
  .authors-hero-portrait::after { width: 245px; height: 245px; left: 38px; }
  .authors-hero-portrait figcaption { margin-left: 32px; }
  .author-portrait { width: 210px; margin-inline: auto; }
  .institutional-section { padding: 60px 0 66px; }
  .institution-card { padding: 22px; grid-template-columns: 110px minmax(0, 1fr); gap: 20px; align-items: start; }
  .institution-card h3 { font-size: 24px; }
  .institutional-closing { align-items: flex-start; }
}

@media (max-width: 430px) {
  .principal-books { transform: scale(.68); margin-bottom: -130px; }
  .institution-card { grid-template-columns: 88px minmax(0, 1fr); gap: 16px; }
  .institution-card > div > p:not(.institution-role) { display: none; }
}
