/* About page: shell shared with the sourcing pages; layout mirrors the privacy page with a facts strip. */
.about-main { max-width: 1440px; margin-inline: auto; }
.about-heading { padding: clamp(38px, 5vw, 72px) clamp(24px, 6.8vw, 108px) clamp(30px, 4vw, 48px); }
.about-heading h1 { max-width: 900px; margin: 0; font: 700 clamp(2.4rem, 4.8vw, 4.6rem)/1.06 var(--hero-headline); letter-spacing: -.048em; text-wrap: balance; }
.about-lead { max-width: 760px; margin: 26px 0 0; color: var(--muted); font-size: clamp(1rem, 1.3vw, 1.15rem); line-height: 1.7; }
.about-facts { padding: 0 clamp(24px, 6.8vw, 108px) clamp(30px, 4vw, 48px); border-bottom: 1px solid var(--line); }
.about-facts dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1px; margin: 0; background: var(--line); border: 1px solid var(--line); }
.about-facts dl > div { padding: 22px 20px; background: var(--paper, #fff); }
.about-facts dt { margin: 0 0 8px; color: var(--signal); font: 700 .65rem/1.5 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.about-facts dd { margin: 0; font: 700 clamp(1.25rem, 2vw, 1.7rem)/1.15 var(--hero-headline); letter-spacing: -.03em; }
.about-facts dd span { display: block; margin-top: 6px; color: var(--muted); font: .78rem/1.5 var(--body, inherit); letter-spacing: 0; }
.about-layout { display: grid; grid-template-columns: minmax(190px, .65fr) minmax(0, 2fr); gap: clamp(36px, 6vw, 90px); padding: 48px clamp(24px, 6.8vw, 108px) 80px; }
.about-contents { position: sticky; top: 105px; align-self: start; }
.about-label { margin: 0 0 18px; color: var(--signal); font: 700 .65rem/1.5 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.about-contents a { display: flex; align-items: baseline; gap: 13px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: .85rem; line-height: 1.5; text-decoration: none; transition: color .18s ease; }
.about-contents a span { color: var(--muted); font: .65rem var(--mono); }
.about-contents a:hover { color: var(--signal); }
.about-sections { min-width: 0; }
.about-sections section { padding: 0 0 34px; margin: 0 0 34px; border-bottom: 1px solid var(--line); scroll-margin-top: 115px; }
.about-sections h2 { margin: 0 0 18px; font: 700 clamp(1.4rem, 2.2vw, 1.95rem)/1.22 var(--hero-headline); letter-spacing: -.03em; text-wrap: balance; }
.about-sections h3 { margin: 0 0 10px; font: 700 1rem/1.3 var(--hero-headline); letter-spacing: -.02em; }
.about-sections p:not(.about-label) { max-width: 74ch; margin: 0 0 16px; color: var(--muted); font-size: .96rem; line-height: 1.8; }
.about-sections p:last-child { margin-bottom: 0; }
.about-list { max-width: 74ch; margin: 0 0 16px; padding: 0 0 0 1.2em; color: var(--muted); font-size: .96rem; line-height: 1.8; }
.about-list li { margin: 0 0 10px; }
.about-list a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--signal); text-underline-offset: 3px; }
.about-sections .about-contact { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.about-contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 28px; margin: 0 0 20px; }
.about-email { display: flex; max-width: 100%; gap: 12px; margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--signal); color: var(--ink); font-size: clamp(.95rem, 1.5vw, 1.1rem); line-height: 1.5; text-decoration: none; overflow-wrap: anywhere; }
.about-email span { color: var(--signal); }
.about-sections .about-contact-note { font-size: .83rem; }
.about-contact-note a { color: var(--ink); }
@media (max-width: 760px) {
  .about-layout { grid-template-columns: minmax(0, 1fr); gap: 34px; padding-top: 30px; padding-bottom: 54px; }
  .about-contents { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
  .about-contents .about-label { grid-column: 1 / -1; margin-bottom: 2px; }
  .about-contents a { font-size: .78rem; gap: 8px; min-height: 48px; }
  .about-sections section { scroll-margin-top: 94px; }
}
@media (max-width: 380px) { .about-contents { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .about-contents a { transition: none; } }
