.about-page main { background: white; }
.about-wrap { width: min(var(--content), calc(100% - var(--gutter) * 2)); margin-inline: auto; }
.about-hero { position: relative; display: flex; align-items: center; min-height: min(480px, calc(100svh - 220px)); background: #F7F5EF; }
.about-hero > img, .about-hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.about-hero > img { object-fit: cover; object-position: center 55%; }
.about-hero-shade { background: linear-gradient(90deg, rgba(247,245,239,.92), rgba(247,245,239,.84) 30%, rgba(247,245,239,.28) 58%, rgba(247,245,239,.03)); }
.about-hero-copy { position: relative; padding-block: 64px; }
.about-hero h1 { font-size: 64px; line-height: 1.06; font-weight: 600; max-width: 580px; margin-bottom: 22px; letter-spacing: 0; }
.about-hero-copy > p { max-width: 510px; font-size: 20px; line-height: 1.5; color: #303C33; margin: 0; }
.about-kicker { color: #526E5B; font-size: 12px; font-weight: 600; margin-bottom: 14px; }
.about-page main h2 { font-size: 34px; line-height: 1.2; font-weight: 600; letter-spacing: 0; text-wrap: wrap; }
.about-origin { max-width: 1040px; padding-block: 48px; }
.about-story-heading { max-width: 680px; margin-bottom: 28px; }
.about-origin .about-kicker { margin-bottom: 12px; font-size: 13px; }
.about-page .about-origin h2 { font-size: 36px; line-height: 1.18; text-wrap: wrap; }
.about-story-layout { display: grid; grid-template-columns: minmax(0, 650px) minmax(0, 290px); gap: 70px; align-items: start; }
.about-story-narrative p { font-size: 16px; line-height: 1.75; color: #535E56; margin: 0 0 18px; }
.about-story-narrative .about-story-lead { font-size: 21px; line-height: 1.5; color: var(--ink); margin-bottom: 18px; }
.about-experience { margin-top: 28px; }
.about-experience h3 { font-size: 21px; line-height: 1.4; font-weight: 600; margin-bottom: 12px; }
.about-story-narrative p:last-child { margin-bottom: 0; }
.about-direction { border-left: 1px solid #D5DAD3; padding-left: 28px; }
.about-direction section + section { margin-top: 30px; padding-top: 24px; border-top: 1px solid #D5DAD3; }
.about-direction h3 { color: #42614C; font-size: 15px; font-weight: 600; margin-bottom: 10px; }
.about-direction p { font-size: 14px; line-height: 1.75; color: #535E56; margin: 0; }
.about-philosophy { max-width: 820px; border-left: 3px solid #829D89; padding-left: 24px; margin: 32px 0 0; font-size: 24px; line-height: 1.45; font-weight: 500; color: #42614C; }
.about-standards { background: #222E28; color: #FAFBF9; padding-block: 38px 42px; }
.about-standards-heading { margin-bottom: 24px; }
.about-standards-heading > p { max-width: 700px; color: #D9E1DA; font-size: 15px; line-height: 1.7; margin: 12px 0 0; }
.about-standards .about-kicker { color: #B6C9B8; margin: 0 0 10px; }
.about-page .about-standards h2 { font-size: 28px; text-wrap: initial; }
.about-standards-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 44px; }
.about-standards-grid article { border-top: 1px solid #526158; padding-top: 18px; }
.about-standards-grid article > span { display: block; color: #B6C9B8; font-size: 11px; margin-bottom: 16px; }
.about-standards h3 { font-size: 20px; line-height: 1.35; font-weight: 600; margin: 0 0 12px; }
.about-standards-grid p { font-size: 14px; line-height: 1.75; color: #D9E1DA; margin: 0; }
.about-values { padding-block: 34px; border-bottom: 1px solid #D5DAD3; }
.about-page .about-values h2 { font-size: 28px; margin-bottom: 24px; }
.about-values-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.about-values-grid svg { width: 28px; height: 28px; display: block; color: #526E5B; margin-bottom: 14px; }
.about-values h3 { font-size: 18px; font-weight: 600; line-height: 1.4; margin-bottom: 9px; }
.about-values p { font-size: 14px; line-height: 1.7; color: #535E56; margin: 0; }
.about-team { padding-block: 34px 12px; }
.about-page .about-team h2 { font-size: 28px; text-wrap: initial; }
.about-section-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; margin-bottom: 28px; }
.about-team-lead { max-width: 420px; font-size: 17px; line-height: 1.6; color: #42614C; margin: 14px 0 0; }
.about-team-intro p { font-size: 15px; line-height: 1.7; color: #535E56; margin: 0 0 12px; }
.about-team-intro p:last-child { margin: 0; }
.about-team-group { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 36px; padding-block: 28px 32px; }
.about-group-label { font-size: 13px; font-weight: 600; color: #526E5B; line-height: 1.5; margin: 3px 0 0; }
.about-team-grid { display: grid; gap: 36px; }
.about-leaders { grid-template-columns: 1fr 1fr; }
.about-managers { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.about-person { min-width: 0; }
.about-person-heading { display: flex; align-items: center; justify-content: flex-start; gap: 16px; min-height: 84px; margin-bottom: 18px; }
.about-person-heading h4 { font-size: 26px; line-height: 1.2; font-weight: 600; margin: 0 0 7px; }
.about-person-heading p { font-size: 12px; line-height: 1.5; color: #526E5B; margin: 0; }
.about-person-heading img { width: 84px; height: 84px; flex-shrink: 0; border-radius: 50%; object-fit: cover; object-position: center 16%; }
.about-person > p { font-size: 14px; line-height: 1.75; color: #535E56; margin: 0; }
.about-managers .about-person-heading { min-height: 64px; }
.about-managers .about-person-heading h4 { font-size: 23px; }
.about-managers .about-person-heading img { width: 64px; height: 64px; }
.about-closing { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; padding-block: 30px 40px; border-top: 1px solid #D5DAD3; }
.about-page .about-closing h2 { font-size: 26px; margin-bottom: 10px; }
.about-closing p { max-width: 580px; font-size: 15px; line-height: 1.7; color: #535E56; margin: 0; }
.about-closing .about-closing-note { margin-top: 14px; font-weight: 600; color: var(--ink); }
.about-closing-links { display: flex; }
@media (max-width: 1000px) {
  .about-story-layout { gap: 36px; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); }
  .about-team-group { grid-template-columns: 1fr; gap: 20px; }
  .about-team-grid, .about-standards-grid { gap: 28px; }
  .about-values-grid { grid-template-columns: 1fr 1fr; gap: 26px 36px; }
}
@media (max-width: 760px) {
  .about-hero { min-height: 360px; }
  .about-hero-shade { background: rgba(247,245,239,.8); }
  .about-hero-copy { padding-block: 44px; }
  .about-origin { padding-block: 32px; }
  .about-story-heading { margin-bottom: 22px; }
  .about-story-layout { grid-template-columns: 1fr; gap: 28px; }
  .about-story-narrative .about-story-lead { font-size: 20px; }
  .about-direction { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; border-left: 0; border-top: 1px solid #D5DAD3; padding: 24px 0 0; }
  .about-direction section + section { margin: 0; padding: 0; border: 0; }
  .about-philosophy { font-size: 21px; margin-top: 28px; padding-left: 18px; }
  .about-standards-grid { grid-template-columns: 1fr; gap: 24px; }
  .about-standards-grid article { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px 16px; padding-top: 18px; }
  .about-standards-grid article > span { grid-row: span 2; margin: 4px 0 0; }
  .about-standards-grid h3 { margin: 0; }
  .about-section-heading { grid-template-columns: 1fr; gap: 14px; margin-bottom: 24px; }
  .about-team { padding-top: 34px; }
}
@media (max-width: 680px) {
  .about-hero > img { object-position: 65% center; }
  .about-hero h1 { font-size: 38px; }
  .about-hero-copy > p { font-size: 17px; }
  .about-page main h2 { font-size: 28px; }
  .about-page .about-origin h2, .about-page .about-standards h2, .about-page .about-values h2, .about-page .about-team h2 { font-size: 26px; }
  .about-leaders, .about-managers { grid-template-columns: 1fr; gap: 24px; }
  .about-person + .about-person { border-top: 1px solid #E4E8E2; padding-top: 24px; }
  .about-person-heading { min-height: 64px; margin-bottom: 14px; }
  .about-person-heading img { width: 64px; height: 64px; }
  .about-person-heading h4 { font-size: 24px; }
  .about-team-group { padding-block: 24px; }
  .about-standards { padding-block: 30px; }
}
@media (max-width: 420px) {
  .about-direction { grid-template-columns: 1fr; }
  .about-values-grid { grid-template-columns: 1fr; gap: 22px; }
  .about-values-grid article { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 6px 16px; }
  .about-values-grid svg { grid-row: span 2; margin: 0; }
  .about-values h3 { margin: 0; }
}
