/* ═══ TOKENS ═══ */
:root {
  --paper: #EFE8DC;
  --paper-2: #E6DDCB;
  --paper-soft: #F4ECDD;
  --ink: #1A1612;
  --ink-soft: #4A4138;
  --ink-mute: #7A6E5F;
  --rule: #C9BFAB;
  --rule-soft: #DDD3BD;
  --accent: #7A1F22;
  --accent-warm: #B6862A;
  --max: 1280px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: "Inter Tight", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  background-image:
    radial-gradient(rgba(26,22,18,0.025) 1px, transparent 1px),
    radial-gradient(rgba(26,22,18,0.018) 1px, transparent 1px);
  background-size: 3px 3px, 7px 7px;
  background-position: 0 0, 1px 2px;
}

img { max-width: 100%; display: block; }
a { color: inherit; }

.wrap {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 32px;
}

.serif { font-family: "Playfair Display", "Times New Roman", serif; font-weight: 400; }
.italic { font-style: italic; }
.accent { color: var(--accent); }
.muted { color: var(--ink-mute); }

.eyebrow,
.section-bar .label {
  font-family: "Inter Tight", sans-serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--accent);
}

/* ═══ HEADER ═══ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(239, 232, 220, 0.92);
  backdrop-filter: saturate(140%) blur(8px);
  -webkit-backdrop-filter: saturate(140%) blur(8px);
  border-bottom: 1px solid var(--rule-soft);
}
.site-header .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
}
.brand {
  font-family: "Playfair Display", serif;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -.01em;
  text-decoration: none;
  color: var(--ink);
}
.brand-italic { font-style: italic; font-weight: 400; }
.brand .dot { color: var(--accent); }
.nav { display: flex; gap: 28px; }
.nav a {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-soft);
  text-decoration: none;
  transition: color .2s ease;
}
.nav a:hover { color: var(--accent); }

/* ═══ HERO ═══ */
.hero {
  min-height: calc(100vh - 64px);
  display: flex;
  align-items: center;
  padding: 80px 0;
  position: relative;
}
.hero::before, .hero::after {
  content: ""; position: absolute; left: 32px; right: 32px;
  height: 1px; background: var(--rule); pointer-events: none;
}
.hero::before { top: 64px; }
.hero::after  { bottom: 32px; }
.hero-frame {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 32px;
  width: 100%;
}
.hero-frame .eyebrow {
  margin-bottom: 36px;
  color: var(--accent);
}
.hero-title {
  font-family: "Playfair Display", serif;
  font-size: clamp(80px, 16vw, 240px);
  line-height: .9;
  letter-spacing: -.045em;
  font-weight: 500;
  margin: 0 0 56px;
  color: var(--ink);
}
.hero-title .italic { font-style: italic; font-weight: 400; }
.hero-title .accent { color: var(--accent); }
.hero-meta {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0 64px;
  align-items: end;
  padding-top: 40px;
  border-top: 1px solid var(--rule);
}
.hero-dates {
  font-family: "Playfair Display", serif;
  font-size: clamp(40px, 7vw, 96px);
  line-height: .92;
  letter-spacing: -.02em;
  font-weight: 400;
}
.hero-dates .accent { color: var(--accent); font-weight: 500; }
.hero-dates .italic { font-style: italic; }
.hero-tag {
  font-size: 18px;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 520px;
  padding-bottom: 8px;
}
.hero-rule { display: none; }
.hero-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 44px;
  padding-top: 22px;
  border-top: 1px solid var(--rule-soft);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--ink-mute);
  gap: 16px;
}
.hero-foot .middle { color: var(--accent); text-align: center; }

/* ═══ SECTION BAR ═══ */
.section-bar {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-bottom: 56px;
  color: var(--ink-mute);
}
.section-bar .num {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 28px;
  color: var(--accent);
  line-height: 1;
}
.section-bar .rule { flex: 1; height: 1px; background: var(--rule); }

/* ═══ THE CASE ═══ */
.case { padding: 120px 0; }
.case-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 80px;
  align-items: center;
  margin-bottom: 96px;
}
.case-headline h2 {
  font-size: clamp(48px, 7vw, 96px);
  line-height: 1.02;
  letter-spacing: -.02em;
  font-weight: 500;
}
.case-body {
  border-left: 1px solid var(--rule);
  padding-left: 56px;
}
.case-body .lead {
  font-family: "Playfair Display", serif;
  font-size: 24px;
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0 0 24px;
  font-weight: 400;
}
.case-body .lead.emphasis { color: var(--ink); font-weight: 500; margin-bottom: 0; }
.quote {
  margin: 0;
  padding: 56px 0 0;
  border-top: 1px solid var(--rule);
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 56px;
  align-items: stretch;
}
.quote-photo {
  background: #2a221c;
  overflow: hidden;
  aspect-ratio: 0.7;
  border: 1px solid rgba(122, 31, 34, .12);
}
.quote-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
  filter: grayscale(.55) contrast(1.05) sepia(.22) saturate(.85);
}
.quote-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.quote blockquote {
  font-size: clamp(26px, 3.6vw, 46px);
  line-height: 1.28;
  letter-spacing: -.005em;
  font-style: italic;
  color: var(--ink-soft);
  max-width: 900px;
  margin: 0;
}
.quote figcaption {
  margin-top: 44px;
  display: flex;
  align-items: flex-end;
  gap: 28px;
  flex-wrap: wrap;
  padding-top: 28px;
  border-top: 1px solid var(--rule);
}
.quote .name {
  font-size: clamp(48px, 7vw, 84px);
  line-height: .9;
  letter-spacing: -.025em;
  font-weight: 500;
  color: var(--ink);
}
.quote .dates {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ink-mute);
  padding-bottom: 14px;
}

/* ═══ LINEUP ═══ */
.lineup { padding: 120px 0; background: var(--paper-2); }
.lineup-intro {
  font-family: "Playfair Display", serif;
  font-size: clamp(22px, 3vw, 32px);
  line-height: 1.4;
  color: var(--ink);
  max-width: 880px;
  margin: 0 0 72px;
}
.acts {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.act {
  display: flex;
  background: var(--paper);
  border: 1px solid rgba(122, 31, 34, .10);
  overflow: hidden;
  transition: transform .25s ease, border-color .25s ease;
}
.act:hover {
  transform: translateY(-2px);
  border-color: rgba(122, 31, 34, .25);
}
.act-photo {
  flex-shrink: 0;
  width: 38%;
  position: relative;
  background: #2a221c;
  overflow: hidden;
}
.act-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  filter: grayscale(.55) contrast(1.05) sepia(.22) saturate(.85);
  transition: transform .4s ease, filter .4s ease;
}
.act:hover .act-photo img {
  transform: scale(1.03);
  filter: grayscale(.3) contrast(1.05) sepia(.18) saturate(.95);
}
.act-body {
  flex: 1;
  padding: 24px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.act-date {
  font-family: "Inter Tight", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 12px;
}
.act-date.warm { color: var(--accent-warm); }
.act h3 {
  font-size: clamp(26px, 2.6vw, 36px);
  line-height: 1.0;
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 12px;
  letter-spacing: -.01em;
}
.act h3 .italic { font-style: italic; }
.act h3 .muted { color: var(--ink-mute); font-style: italic; font-size: .68em; }
.act p {
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--ink-soft);
}

/* Closing card — accent treatment */
.act.closing { border-color: var(--accent); }
.act.closing .act-body { background: var(--accent); color: var(--paper-soft); }
.act.closing h3 { color: var(--paper-soft); }
.act.closing p { color: rgba(244, 236, 221, .9); }

/* ═══ BOOKENDS ═══ */
.bookends { padding: 120px 0; }
.bookends-headline {
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.18;
  letter-spacing: -.015em;
  font-weight: 500;
  margin-bottom: 64px;
  max-width: 1100px;
}
.bookends-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.bookend {
  display: flex;
  background: var(--paper);
  border: 1px solid rgba(122, 31, 34, .12);
  overflow: hidden;
  transition: transform .25s ease, border-color .25s ease;
}
.bookend:hover { transform: translateY(-2px); border-color: rgba(122, 31, 34, .28); }
.bookend-photo {
  flex-shrink: 0;
  width: 50%;
  background: #2a221c;
  overflow: hidden;
}
.bookend-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 22%;
  filter: grayscale(.55) contrast(1.05) sepia(.22) saturate(.85);
  transition: transform .4s ease;
}
.bookend:hover .bookend-photo img { transform: scale(1.03); }
.bookend-body {
  flex: 1;
  padding: 28px 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.bookend-body .eyebrow {
  font-size: 13px;
  letter-spacing: .28em;
  margin-bottom: 14px;
}
.bookend-body h3 {
  font-size: clamp(26px, 2.6vw, 36px);
  line-height: 1.05;
  font-weight: 500;
  letter-spacing: -.01em;
  margin-bottom: 14px;
}
.bookend-body h3 .italic { font-style: italic; }
.bookend-body h3 .muted { color: var(--ink-mute); font-style: italic; font-size: .8em; }
.bookend-body p {
  font-size: 15.5px;
  line-height: 1.55;
  color: var(--ink-soft);
}

/* ═══ FINANCES ═══ */
.finances { padding: 120px 0; background: var(--paper-2); }
.finances-grid {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  grid-template-rows: 1fr auto;
  column-gap: 80px;
  row-gap: 32px;
  align-items: stretch;
}
.finances-headline { grid-column: 1; grid-row: 1; }
.finances-table    { grid-column: 2; grid-row: 1 / span 2; }
.in-return-cue     { grid-column: 1; grid-row: 2; }
.finances-headline {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.eyebrow.small { font-size: 11px; }
.finances-headline .eyebrow {
  margin-bottom: 24px;
}
.big-number {
  font-family: "Playfair Display", serif;
  font-size: clamp(120px, 18vw, 260px);
  line-height: 1;
  letter-spacing: -.045em;
  color: var(--accent);
  font-weight: 500;
}
.big-number .italic { font-style: italic; font-weight: 400; }
.finances-sub {
  font-size: clamp(20px, 2.2vw, 28px);
  line-height: 1.35;
  margin-top: 28px;
  color: var(--ink);
  max-width: 480px;
}
.finances-table {
  border-left: 1px solid var(--rule);
  padding-left: 56px;
  display: flex;
  flex-direction: column;
}
.table-eyebrow {
  font-family: "Inter Tight", sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 24px;
}
.table-headline {
  font-size: 32px;
  line-height: 1.05;
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 24px;
}
@keyframes inReturnFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-5px); }
}
@keyframes inReturnChev {
  0%   { transform: translateY(-6px); opacity: 0; }
  25%  { opacity: 1; }
  70%  { opacity: 1; }
  100% { transform: translateY(16px); opacity: 0; }
}
.in-return-cue {
  justify-self: start;
  align-self: end;
  padding-top: 60px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 20px;
  letter-spacing: .04em;
  color: var(--ink-mute);
  text-decoration: none;
  animation: inReturnFloat 4.5s ease-in-out infinite;
  transition: color .25s ease;
}
.in-return-cue:hover { color: var(--accent); }
.in-return-cue .label { white-space: nowrap; }
.in-return-cue .chev-stack {
  position: relative;
  width: 26px;
  height: 24px;
  display: block;
}
.in-return-cue .chev-stack svg {
  position: absolute;
  left: 0;
  top: 0;
  width: 26px;
  height: 13px;
  fill: none;
  stroke: var(--accent);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.in-return-cue:hover .chev-stack svg { stroke: var(--accent); }
.in-return-cue .chev-stack .c1 { animation: inReturnChev 2.6s ease-in-out infinite; }
.in-return-cue .chev-stack .c2 { animation: inReturnChev 2.6s ease-in-out infinite; animation-delay: 1.3s; }
@media print {
  .in-return-cue { display: none !important; }
}
.small-italic { font-size: 18px; }
.cost-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.cost-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 24px;
  padding: 10px 0;
  border-bottom: 1px solid var(--rule-soft);
  font-size: 15px;
  color: var(--ink-soft);
}
.cost-list li .amt {
  font-family: "Playfair Display", serif;
  color: var(--ink);
  font-weight: 500;
  white-space: nowrap;
}
.totals {
  margin-top: 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.total-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-family: "Inter Tight", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  padding: 6px 0;
}
.total-row .amt { font-family: "Playfair Display", serif; font-weight: 500; color: var(--ink-soft); text-transform: none; font-size: 15px; letter-spacing: 0; }
.total-row.final {
  border-top: 1px solid var(--ink);
  padding-top: 16px;
  margin-top: 8px;
  font-weight: 700;
  color: var(--ink);
  font-size: 13px;
}
.total-row.final .amt {
  color: var(--accent);
  font-weight: 700;
  font-size: 18px;
}

/* ═══ IN RETURN ═══ */
.in-return { padding: 120px 0; }
.return-headline {
  font-size: clamp(30px, 3.8vw, 46px);
  line-height: 1.2;
  letter-spacing: -.015em;
  font-weight: 500;
  margin-bottom: 56px;
  max-width: 1100px;
}
.pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.pillar {
  padding: 40px 36px;
  border-right: 1px solid var(--rule);
  display: flex;
  flex-direction: column;
}
.pillar:last-child { border-right: 0; }
.pillar:first-child { padding-left: 0; }
.pillar:last-child { padding-right: 0; }
.pillar .roman {
  font-size: clamp(72px, 7vw, 96px);
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--accent);
  font-style: italic;
  font-weight: 400;
}
.pillar .eyebrow {
  color: var(--ink);
  margin: 28px 0 14px;
  font-size: 14px;
  letter-spacing: .3em;
}
.pillar p {
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink-soft);
}

/* ═══ VENUE ═══ */
.venue { padding: 120px 0; }
.venue-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 80px;
  align-items: stretch;
}
.venue-grid h2 {
  font-size: clamp(56px, 7vw, 104px);
  line-height: 1.0;
  letter-spacing: -.025em;
  font-weight: 500;
  margin-bottom: 32px;
}
.venue-grid h2 .italic { font-style: italic; color: var(--accent); }
.venue-grid .lead {
  font-family: "Playfair Display", serif;
  font-size: 22px;
  line-height: 1.5;
  color: var(--ink-soft);
  margin-bottom: 28px;
  max-width: 640px;
}
.venue-grid .address {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  line-height: 1.7;
}
.venue-card {
  border-left: 1px solid var(--rule);
  padding-left: 56px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.venue-card-eyebrow {
  font-family: "Inter Tight", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 18px;
}
.venue-card p {
  font-size: 19px;
  line-height: 1.6;
  color: var(--ink-soft);
}

/* ═══ SIGN-OFF ═══ */
.signoff { padding: 140px 0; background: var(--paper); border-top: 1px solid var(--rule); }
.signoff .eyebrow.small { font-size: 11px; }
.signoff .eyebrow:first-child { margin-bottom: 36px; }
.signoff-headline {
  font-size: clamp(64px, 11vw, 168px);
  line-height: .92;
  letter-spacing: -.035em;
  font-weight: 500;
  margin-bottom: 72px;
}
.signoff-meta {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 64px;
  align-items: end;
  padding-top: 44px;
  border-top: 1px solid var(--rule);
}
.signoff-meta .eyebrow { margin-bottom: 14px; }
.signature {
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1;
  letter-spacing: -.02em;
  font-weight: 400;
  color: var(--ink);
}
.signature .italic { font-style: italic; }
.signature-sub {
  font-family: "Inter Tight", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 18px;
}
.signoff-for { padding-left: 56px; border-left: 1px solid var(--rule-soft); align-self: stretch; padding-top: 6px; }
.foundation-name {
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.15;
  font-weight: 500;
  color: var(--ink);
}
.foundation-name .italic { font-style: italic; }

/* ═══ CONTACT ═══ */
.contact { padding: 120px 0; background: var(--paper-2); }
.contact-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 80px;
  align-items: center;
}
.contact-grid h2 {
  font-size: clamp(48px, 6.5vw, 88px);
  line-height: 1.05;
  letter-spacing: -.02em;
  font-weight: 500;
  margin-bottom: 24px;
}
.contact-grid h2 .italic { font-style: italic; }
.contact-grid .lead {
  font-family: "Playfair Display", serif;
  font-size: 22px;
  line-height: 1.5;
  color: var(--ink-soft);
}
.contact-card {
  background: var(--paper);
  border: 1px solid rgba(122, 31, 34, .14);
  padding: 36px 40px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.contact-card .line {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 24px;
  align-items: baseline;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rule-soft);
}
.contact-card .line:last-child { border-bottom: 0; padding-bottom: 0; }
.contact-card .key {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.contact-card a {
  text-decoration: none;
  color: var(--ink);
  transition: color .2s ease;
}
.contact-card a:hover { color: var(--accent); }

/* ═══ FOOTER ═══ */
.site-footer {
  padding: 36px 0;
  border-top: 1px solid var(--rule);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.footer-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}
.footer-line .middle { color: var(--accent); }

/* ═══ RESPONSIVE ═══ */
@media (max-width: 880px) {
  .nav { display: none; }
  .hero::before, .hero::after { display: none; }
  .hero-meta { grid-template-columns: 1fr; gap: 24px; }
  .case-grid, .venue-grid, .contact-grid, .finances-grid, .signoff-meta { grid-template-columns: 1fr; gap: 32px; }
  .case-body, .venue-card, .finances-table, .signoff-for { border-left: 0; padding-left: 0; padding-top: 32px; border-top: 1px solid var(--rule); }
  .finances-grid { grid-template-rows: auto auto auto; }
  .finances-headline { grid-column: 1; grid-row: 1; }
  .finances-table    { grid-column: 1; grid-row: 2; }
  .in-return-cue     { grid-column: 1; grid-row: 3; justify-self: center; align-self: start; padding-top: 24px; }
  .hero-foot { flex-direction: column; gap: 12px; text-align: center; }
  .hero-foot .middle { order: -1; }
  .quote { grid-template-columns: 1fr; gap: 32px; }
  .quote-photo { aspect-ratio: 4/3; max-height: 420px; }
  .acts { grid-template-columns: 1fr; }
  .bookends-grid { grid-template-columns: 1fr; gap: 20px; }
  .bookends-grid .bookend:nth-child(1) { order: 2; }
  .bookends-grid .bookend:nth-child(2) { order: 1; }
  .pillars { grid-template-columns: 1fr; }
  .pillar { border-right: 0; border-bottom: 1px solid var(--rule); padding: 32px 0 !important; }
  .pillar:last-child { border-bottom: 0; }
  .footer-line { flex-direction: column; gap: 8px; text-align: center; }
}

@media (max-width: 560px) {
  .wrap { padding: 0 20px; }
  body { font-size: 16px; }
  .case, .lineup, .venue, .contact, .bookends, .finances, .in-return, .signoff { padding: 72px 0; }
  .hero { padding: 56px 0; }
  .hero-frame { padding: 0 20px; }
  .hero::before, .hero::after { display: none; }
  .act { flex-direction: column; }
  .act-photo { width: 100%; aspect-ratio: 4/3; }
  .act-body { padding: 20px 22px; }
  .bookend { flex-direction: column; }
  .bookend-photo { width: 100%; aspect-ratio: 4/3; }
  .bookend-body { padding: 20px 22px; }
  .cost-list li { font-size: 14px; gap: 16px; }
  .contact-card { padding: 24px 24px; }
  .contact-card .line { grid-template-columns: 1fr; gap: 6px; padding-bottom: 14px; }
}