:root {
  --about-blush: #b7838d;
  --about-mauve: #95636d;
  --about-soft-blush: #dcc1c7;
  --about-paper: #f5ece8;
  --about-ivory: #fcf8f5;
  --about-white: #fffdfb;
  --about-espresso: #2b2420;
  --about-stone: #7e706a;
  --about-line: rgba(149, 99, 109, 0.18);
  --about-dark: #352b2c;
}

.about-page { background: var(--about-ivory); color: var(--about-espresso); }
.about-kicker { margin-bottom: 1.2rem; color: var(--about-mauve); font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.about-kicker--light { color: rgba(255,255,255,.65); }
.about-section { padding-block: clamp(5.5rem,10vw,9rem); border-top: 1px solid var(--about-line); }

.about-hero { padding-block: clamp(5rem,9vw,8rem); background: radial-gradient(circle at 82% 20%, rgba(220,193,199,.38), transparent 28%), var(--about-paper); }
.about-hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.7fr); align-items:center; gap:clamp(3rem,8vw,8rem); }
.about-hero h1 { max-width:12ch; margin-bottom:2rem; color:var(--about-espresso); font-size:clamp(4rem,7.5vw,7.5rem); }
.about-hero-lede { max-width:43rem; margin-bottom:0; color:var(--about-stone); font-family:var(--serif-body); font-size:clamp(1.15rem,2vw,1.5rem); line-height:1.8; }
.about-hero-image { aspect-ratio:4/5; overflow:hidden; background:var(--about-soft-blush); box-shadow:0 28px 60px rgba(87,57,63,.13); }
.about-hero-image img { width:100%; height:100%; object-fit:cover; }

.about-letter { background:var(--about-white); }
.about-letter-grid,.beliefs-grid,.through-line-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(3rem,9vw,9rem); }
.about-letter-copy { color:var(--about-stone); font-family:var(--serif-body); font-size:clamp(1.06rem,1.7vw,1.25rem); line-height:1.95; }
.about-letter-copy blockquote { margin:2.5rem 0; padding-left:1.5rem; border-left:2px solid var(--about-blush); color:var(--about-espresso); font-family:var(--serif-display); font-size:clamp(1.8rem,3vw,2.8rem); font-style:italic; line-height:1.3; }
.about-signature { margin-top:2.5rem; color:var(--about-espresso); font-family:var(--serif-display); font-size:2.3rem; font-style:italic; }

.about-section-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.55fr); align-items:end; gap:3rem; margin-bottom:3.5rem; }
.about-section-heading>p { color:var(--about-stone); }

.about-work { background:var(--about-ivory); }
.work-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--about-line); border-left:1px solid var(--about-line); }
.work-card { min-height:400px; display:flex; flex-direction:column; padding:clamp(2rem,4vw,3.5rem); border-right:1px solid var(--about-line); border-bottom:1px solid var(--about-line); background:var(--about-white); }
.work-card--accent { background:var(--about-blush); color:var(--about-white); }
.work-number { margin-bottom:4rem; color:var(--about-mauve); font-size:.7rem; font-weight:600; letter-spacing:.14em; }
.work-card--accent .work-number { color:rgba(255,255,255,.72); }
.work-card h3 { color:var(--about-espresso); font-size:clamp(2.3rem,4vw,4rem); }
.work-card--accent h3 { color:var(--about-white); }
.work-card>p:not(.work-number) { color:var(--about-stone); }
.work-card--accent>p:not(.work-number) { color:rgba(255,255,255,.82); }
.about-text-link { position:relative; width:fit-content; margin-top:auto; padding-top:2rem; color:var(--about-mauve); font-size:.78rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.about-text-link::after { display:block; width:100%; height:1px; margin-top:.35rem; background:currentColor; content:""; transform-origin:left; transition:transform 180ms ease; }
.about-text-link:hover::after,.about-text-link:focus-visible::after { transform:scaleX(.58); }
.about-text-link--light { color:var(--about-white); }

.about-beliefs { background:var(--about-paper); }
.belief-list { border-top:1px solid var(--about-line); }
.belief-list article { display:grid; grid-template-columns:70px minmax(0,1fr); gap:1.5rem; padding-block:1.5rem; border-bottom:1px solid var(--about-line); }
.belief-list span { color:var(--about-mauve); font-size:.72rem; letter-spacing:.14em; }
.belief-list p { margin-bottom:0; color:var(--about-espresso); font-family:var(--serif-display); font-size:clamp(1.6rem,2.8vw,2.5rem); line-height:1.2; }

.about-through-line { background:var(--about-white); }
.through-line-lede { color:var(--about-espresso); font-family:var(--serif-body); font-size:clamp(1.2rem,2vw,1.55rem); line-height:1.8; }
.through-line-grid>div:last-child>p:last-child { color:var(--about-stone); line-height:1.8; }

.about-timeline { background:var(--about-ivory); }
.timeline-list { margin:0; padding:0; list-style:none; border-top:1px solid var(--about-line); }
.timeline-list li { display:grid; grid-template-columns:160px minmax(0,1fr); gap:clamp(2rem,6vw,6rem); padding-block:2.5rem; border-bottom:1px solid var(--about-line); }
.timeline-year { color:var(--about-mauve); font-size:.75rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.timeline-list h3 { margin-bottom:.7rem; color:var(--about-espresso); }
.timeline-list li div p { margin-bottom:0; color:var(--about-stone); }

.about-closing { padding-block:clamp(5.5rem,9vw,8rem); background:var(--about-dark); color:var(--about-white); }
.about-closing-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.65fr); align-items:end; gap:clamp(3rem,8vw,8rem); }
.about-closing h2 { color:var(--about-white); }
.about-closing p { color:rgba(255,255,255,.74); }
.about-actions { display:flex; flex-wrap:wrap; align-items:center; gap:1.25rem 1.75rem; margin-top:2rem; }
.about-button-light { background:var(--about-white); color:var(--about-dark); }

@media (max-width:950px) {
  .about-hero-grid,.about-letter-grid,.about-section-heading,.beliefs-grid,.through-line-grid,.about-closing-grid { grid-template-columns:1fr; }
  .work-grid { grid-template-columns:1fr; }
  .about-hero-image { max-width:620px; }
}

@media (max-width:650px) {
  .about-hero { padding-block:4rem; }
  .about-hero h1 { font-size:clamp(3.2rem,15vw,5rem); }
  .timeline-list li { grid-template-columns:1fr; gap:.75rem; }
  .belief-list article { grid-template-columns:42px minmax(0,1fr); gap:1rem; }
  .about-actions { display:grid; }
  .about-actions .button { width:100%; }
}