/* Source for the static yearbook page; build.py publishes this stylesheet. */
body:has(.yb-page) { background: #f7f3ec; }
.yb-page { --yb-wine: #842b40; --yb-muted: #74736f; --yb-line: #ded6ca; background: #f7f3ec; overflow: clip; }
.yb-page .serif { font-family: var(--serif); }
.yb-hero h1, .yb-section-head h2, .yb-contact h2 { overflow-wrap: anywhere; }
.yb-contact h2, .yb-social-head > p { white-space: pre-line; }
.yb-eyebrow { color: var(--yb-wine); font-size: 10px; font-weight: 700; letter-spacing: .22em; line-height: 1.7; }
.yb-hero { max-width: 1600px; margin: auto; display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; padding: 112px var(--gutter) 85px; gap: 24px; }
.yb-hero-copy { position: relative; z-index: 2; padding-block: 34px; }
.yb-hero h1 { margin-top: 30px; font-size: clamp(46px, 5.4vw, 82px); line-height: 1.08; letter-spacing: -.065em; font-weight: 900; }
.yb-hero h1 .serif { display: block; color: var(--yb-wine); font-size: .78em; line-height: 1.25; letter-spacing: -.055em; margin-top: 6px; }
.yb-intro { max-width: 34ch; margin-top: 24px; font-size: clamp(14px, 1.25vw, 18px); line-height: 1.8; color: var(--yb-muted); }
.yb-actions { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; margin-top: 30px; }
.yb-actions .social-pill { background: var(--yb-wine); color: #fff; border: 0; padding: 14px 24px; }
.yb-actions .social-pill svg path:first-child { fill: #fff; }
.yb-actions .social-pill svg path:last-child { fill: var(--yb-wine); }
.yb-link-icon { display: block; width: 18px; height: 18px; flex: 0 0 18px; }
.yb-text-link { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; text-decoration: none; padding-block: 10px; border-bottom: 1px solid var(--yb-wine); }
.yb-note { display: flex; align-items: center; justify-content: space-between; padding-right: 40px; margin-top: 62px; gap: 20px; }
.yb-edition { font-size: 9px; letter-spacing: .18em; color: var(--yb-muted); border-left: 32px solid var(--yb-wine); padding-left: 12px; }
.yb-note .serif { color: #ae6572; font-size: 25px; line-height: 1.2; transform: rotate(-8deg); }
.yb-collage { position: relative; min-width: 0; padding-bottom: 36px; }
.yb-collage figure { margin: 0; }
.yb-cover { background: #fffdf7; padding: 10px 10px 0; box-shadow: 0 14px 35px #5c422b12; transform: rotate(2deg); }
.yb-cover img { width: 100%; height: clamp(340px, 34vw, 510px); object-fit: cover; }
.yb-cover figcaption { padding: 12px; text-align: right; font-size: 8px; letter-spacing: .22em; color: var(--yb-muted); }
.yb-print { position: absolute; bottom: -24px; left: -38px; width: 38%; padding: 9px 9px 0; background: #fffdf7; box-shadow: 0 8px 22px #3d302528; transform: rotate(-9deg); }
.yb-print::before { content: ''; position: absolute; width: 70px; height: 23px; background: #daceb3a6; top: -12px; left: calc(50% - 35px); transform: rotate(4deg); }
.yb-print img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }
.yb-print figcaption { padding: 10px 0; font-size: clamp(10px, 1.1vw, 17px); text-align: center; color: var(--yb-wine); }
.yb-stories { max-width: 1600px; margin: auto; padding: 48px var(--gutter) 64px; border-top: 1px solid var(--yb-line); scroll-margin-top: 140px; }
.yb-section-head { display: grid; grid-template-columns: 1.1fr 1fr auto; align-items: end; gap: 40px; margin-bottom: 32px; }
.yb-section-head h2 { font-size: clamp(35px, 4vw, 58px); font-weight: 900; letter-spacing: -.055em; line-height: 1.05; }
.yb-section-head h2 .serif { display: block; color: var(--yb-wine); line-height: 1.2; }
.yb-section-head > p { font-size: 12px; color: var(--yb-muted); line-height: 1.9; max-width: 44ch; }
.yb-section-head > .yb-eyebrow { font-size: 8px; margin-bottom: 6px; }
.yb-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 22px; }
.yb-grid figure { margin: 0; min-width: 0; }
.yb-grid figure[hidden] { display: none; }
.yb-grid img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 7px; background: #e9e2d7; }
.yb-more { display: block; margin: 22px auto 0; border: 1px solid var(--yb-line); border-radius: 999px; padding: 13px 24px; color: var(--yb-wine); background: transparent; font: 600 12px var(--display); cursor: pointer; }
.yb-more[hidden] { display: none; }
.yb-contact { position: relative; display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: 56px; padding: 65px max(var(--gutter), calc((100vw - 1320px) / 2)); background: var(--yb-wine); color: #fff7eb; overflow: hidden; }
.yb-contact h2 { font-size: clamp(30px, 3.5vw, 50px); line-height: 1.35; font-weight: 400; position: relative; }
.yb-contact > div { border-left: 1px solid #ffffff40; padding-left: 45px; position: relative; }
.yb-contact p { font-size: 12px; max-width: 38ch; line-height: 1.9; }
.yb-contact-link { display: inline-flex; align-items: center; gap: 16px; margin-top: 24px; padding: 14px 23px; background: #fff7eb; color: var(--yb-wine); border-radius: 999px; font-size: 12px; font-weight: 700; text-decoration: none; }
.yb-flower { position: absolute; left: -35px; bottom: -45px; width: 240px; height: 240px; color: #ffffff12; pointer-events: none; }
.yb-signature { position: absolute; bottom: 20px; right: var(--gutter); opacity: .6; font-size: 20px; transform: rotate(-8deg); }
.yb-social { padding-block: 36px 20px; }
.yb-social-head { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 0 var(--gutter) 24px; max-width: 1600px; margin: auto; }
.yb-page .yb-social-head .social-pill.ghost { padding: 8px 0; background: transparent; border: 0; color: var(--ink); font-size: 19px; }
.yb-social-head > p { color: var(--yb-muted); font-size: 11px; line-height: 1.8; text-align: right; }
.yb-social .row-move { gap: 12px; }
.yb-social .row-move figure { height: clamp(130px, 13vw, 190px); border-radius: 5px; }
.yb-page a:focus-visible, .yb-page button:focus-visible { outline: 3px solid #b65f77; outline-offset: 5px; }
.yb-page a:hover, .yb-more:hover { filter: brightness(.9); }
@media (min-width: 1600px) { .yb-hero { padding-top: 140px; padding-bottom: 110px; } }
@media (max-width: 1000px) {
  .yb-hero { padding-top: 145px; gap: 18px; }
  .yb-hero h1 { font-size: 52px; }
  .yb-note { margin-top: 40px; padding-right: 0; }
  .yb-edition { max-width: 155px; font-size: 8px; border-left-width: 20px; }
  .yb-print { left: -16px; }
  .yb-section-head { grid-template-columns: 1fr 1fr; gap: 24px; }
  .yb-section-head > .yb-eyebrow { display: none; }
  .yb-contact { gap: 28px; }
}
@media (max-width: 680px) {
  .yb-hero { grid-template-columns: 1fr; padding-top: 140px; padding-bottom: 56px; gap: 30px; }
  .yb-hero-copy { padding: 10px 0 0; }
  .yb-hero h1 { font-size: clamp(42px, 10vw, 62px); margin-top: 20px; }
  .yb-hero h1 .serif { max-width: 18ch; }
  .yb-intro { margin-top: 18px; max-width: 38ch; }
  .yb-actions { gap: 22px; margin-top: 22px; }
  .yb-note { display: none; }
  .yb-collage { margin: 0 8px 20px 22px; padding-bottom: 24px; }
  .yb-cover img { height: auto; aspect-ratio: 1.25; }
  .yb-print { width: 35%; left: -22px; bottom: -18px; padding: 6px 6px 0; }
  .yb-print img { aspect-ratio: 1.2; }
  .yb-print figcaption { font-size: 10px; padding: 7px 0; }
  .yb-stories { padding-top: 32px; padding-bottom: 38px; }
  .yb-section-head { grid-template-columns: 1fr; gap: 18px; margin-bottom: 24px; }
  .yb-section-head > p { max-width: 50ch; }
  .yb-grid { grid-template-columns: 1fr; gap: 20px; }
  .yb-contact { grid-template-columns: 1fr; padding-block: 38px 46px; gap: 24px; }
  .yb-contact > div { padding-left: 0; border-left: 0; }
  .yb-contact h2 { font-size: clamp(27px, 7vw, 40px); }
  .yb-signature { font-size: 16px; bottom: 12px; }
  .yb-social-head { align-items: start; }
  .yb-social-head > p { display: none; }
  .yb-social-head .social-pill { font-size: 17px; }
}