.about-section { background: var(--color-background); overflow: hidden; }
.about-grid {
  display: grid;
  grid-template-columns: minmax(0, 560px) minmax(0, 300px);
  justify-content: center;
  align-items: center;
  gap: 32px;
  width: min(1120px, 100%);
  min-height: 100svh;
  padding: var(--anchor-offset) 40px 48px;
}
.about-copy { min-width: 0; max-width: 580px; padding: 0; }
.about-copy h2 { font-size: clamp(40px, 3.8vw, 54px); line-height: 1.12; letter-spacing: 0; margin-bottom: 24px; }
.about-lead { font-size: 22px; line-height: 1.5; font-weight: 500; margin-bottom: 20px; text-wrap: pretty; }
.about-lead span { display: block; }
.about-copy > p:not(.about-lead) { color: var(--color-textmuted); font-size: 15px; line-height: 1.75; margin-bottom: 16px; text-wrap: pretty; }
.about-bottom { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 28px; }
.about-facts { display: flex; gap: 24px; }
.about-facts > div { display: flex; flex-direction: column; gap: 6px; }
.about-facts strong { color: var(--color-accent); font-size: 30px; font-weight: 500; line-height: 36px; letter-spacing: 0; }
.about-facts > div + div strong { font-size: 23px; }
.about-facts span { font-size: 11px; color: var(--color-textmuted); white-space: nowrap; }
.about-cta { min-height: 54px; min-width: 0; padding: 16px 20px; font-size: 13px; line-height: 20px; white-space: nowrap; }
.about-visual { width: 100%; max-width: 300px; justify-self: start; min-width: 0; }
.about-portrait { position: relative; min-height: 0; width: 100%; height: min(56svh, 490px); }
.about-portrait > img { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (min-width: 768px) and (max-width: 1023px) {
  .about-grid { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 28px; }
  .about-copy h2 { font-size: 42px; }
  .about-lead { font-size: 20px; }
  .about-lead span { display: inline; }
  .about-copy > p:not(.about-lead) { font-size: 14px; }
  .about-bottom { gap: 20px; margin-top: 24px; }
}
@media (min-width: 768px) and (max-height: 800px) {
  .about-copy h2 { margin-bottom: 20px; }
  .about-lead { margin-bottom: 16px; }
  .about-bottom { margin-top: 24px; }
}
@media (max-width: 767px) {
  .about-grid { grid-template-columns: minmax(0, 1fr); gap: 0; align-content: center; padding: var(--anchor-offset) var(--page-gutter) 24px; text-align: center; }
  .about-copy { display: contents; }
  .about-copy.reveal { opacity: 1; transform: none; }
  .about-copy > p { max-width: 520px; margin-inline: auto; }
  .about-copy h2 { font-size: 36px; letter-spacing: 0; margin-bottom: 16px; }
  .about-lead { font-size: 18px; line-height: 1.5; margin-bottom: 12px; }
  .about-lead span { display: inline; }
  .about-copy > p:not(.about-lead) { font-size: 14px; line-height: 1.6; margin-bottom: 12px; }
  .about-bottom { flex-direction: column; flex-wrap: nowrap; gap: 24px; margin-top: 12px; }
  .about-facts { justify-content: center; gap: 32px; }
  .about-facts strong { font-size: 30px; line-height: 36px; }
  .about-facts > div + div strong { font-size: 23px; line-height: 36px; }
  .about-facts span { font-size: 11px; }
  .about-cta { width: 100%; max-width: 360px; padding-inline: 16px; }
  .about-visual { justify-self: center; max-width: 300px; margin-top: 28px; }
  .about-portrait { height: clamp(340px, 110vw, 440px); }
}
@media (max-width: 359px) {
  .about-facts > div + div strong { font-size: 22px; }
  .about-facts span { font-size: 10px; }
}
