@font-face { font-family: 'Pinyon Script'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/pinyon-script-regular.ttf') format('truetype'); }
.about-hero { color: var(--ink); background: var(--paper); }
.about-hero-inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--layout-gap); padding-block: var(--section-space); }
.about-hero .eyebrow { color: var(--muted); }
.about-hero h1 { font-size: clamp(3rem, 4.4vw, 4.75rem); line-height: 1.1; }
.about-hero h1 span { color: var(--blue); }
.about-intro { max-width: 36rem; margin-top: 24px; color: var(--muted); font-size: 1.1875rem; line-height: 1.75; }
.about-photo { margin: 0; min-width: 0; }
.about-photo img { width: 100%; aspect-ratio: 1.25; height: auto; object-fit: cover; object-position: center 48%; border-radius: 6px; }
.about-photo figcaption { margin-top: 12px; color: var(--muted); font-size: .9375rem; }
.about-story { border-top: 1px solid var(--line); }
.about-story-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: var(--layout-gap); }
.about-story-heading h2 { max-width: 16ch; }
.about-byline { margin-top: 24px; color: var(--muted); font-size: 1rem; }
.about-byline strong { display: block; color: var(--ink); font-size: 1.25rem; }
.about-letter { max-width: 43rem; font-size: 1.1875rem; line-height: 1.8; }
.about-letter p + p { margin-top: 24px; }
.about-letter .about-opening { font-size: 1.375rem; font-weight: 500; line-height: 1.65; }
.about-signature { padding-top: 8px; color: var(--blue); font-family: 'Pinyon Script', cursive; font-size: clamp(2.75rem, 4vw, 3.25rem); font-weight: 400; font-style: normal; font-synthesis: none; line-height: 1.25; letter-spacing: 0; }
.about-promise { padding-block: var(--section-space); background: var(--ink); color: var(--paper); }
.about-promise-inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--layout-gap); align-items: center; }
.about-promise .eyebrow { color: var(--accent); }
.about-promise h2 { font-size: clamp(2.5rem, 3.8vw, 3.5rem); }
.about-promise-copy { max-width: 39rem; }
.about-promise-copy > p { color: var(--on-dark); font-size: 1.125rem; }
.about-promise-copy > p + p { margin-top: 14px; color: var(--on-dark-muted); font-size: 1rem; }
.about-promise-copy a { margin-top: 18px; }
.about-promise a:focus-visible { outline-color: var(--accent); }
@media (max-width: 50rem) {
  .about-hero-inner { padding-block: 44px 52px; }
  .about-hero-inner, .about-story-layout, .about-promise-inner { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .about-hero h1 { font-size: clamp(2.85rem, 9vw, 4.5rem); }
  .about-intro, .about-letter, .about-promise-copy { max-width: 100%; }
  .about-photo img { aspect-ratio: 1.7; }
  .about-story-heading h2 { max-width: 18ch; }
  .about-byline { margin-top: 18px; }
}
@media (max-width: 37.5rem) {
  .about-hero-inner { padding-block: 36px 40px; }
  .about-hero h1 { font-size: clamp(2.25rem, 10.5vw, 3.8rem); }
  .about-intro, .about-letter { font-size: 1.125rem; }
  .about-letter .about-opening { font-size: 1.25rem; }
  .about-photo img { aspect-ratio: 1.35; }
  .about-promise { padding-block: 44px; }
}