/* Over Ensemblo: dezelfde Inter, porselein en kobalt als de homepage. */
.about-page { margin:0; background:#edeff3; color:var(--ink); font-family:var(--font-sans); font-size:18px; line-height:1.7; -webkit-font-smoothing:antialiased; }
.about-page *, .about-page *::before, .about-page *::after { box-sizing:border-box; }
.about-page h1, .about-page h2, .about-page p, .about-page figure { margin:0; }
.about-page a { color:inherit; text-decoration:none; }
.about-page button { font:inherit; }
.about-page :focus-visible { outline:3px solid var(--brand); outline-offset:5px; }
.about-page [hidden] { display:none!important; }
.about-page .about-wrap { max-width:1320px; padding-inline:48px; margin-inline:auto; }
.about-page .skip { position:fixed; top:8px; left:8px; padding:12px 16px; background:var(--panel); z-index:100; transform:translateY(-200%); }
.about-page .skip:focus { transform:none; }
.about-page .about-hero { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr); align-items:center; gap:88px; padding-block:64px 80px; }
.about-page .about-hero h1 { font-size:clamp(42px,4.1vw,60px); font-weight:650; line-height:1.09; letter-spacing:-.035em; text-wrap:balance; }
.about-page .about-hero h1 span { color:var(--brand); }
.about-page .about-intro { margin-top:28px; color:var(--muted); font-size:19px; line-height:1.7; max-width:58ch; }
.about-page .about-intro p+p { margin-top:18px; color:var(--ink); font-weight:550; }
.about-page .founder-photo img { display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; border-radius:18px; }
.about-page .founder-photo figcaption { display:flex; flex-wrap:wrap; gap:4px 14px; align-items:baseline; margin-top:14px; line-height:1.5; }
.about-page .founder-photo strong { font-size:16px; font-weight:650; }
.about-page .founder-photo figcaption span { color:var(--muted); font-size:13px; }
.about-page .about-section { padding-block:60px; border-top:1px solid var(--line); }
.about-page .about-section h2 { font-size:clamp(29px,2.8vw,39px); font-weight:650; line-height:1.14; letter-spacing:-.03em; text-wrap:balance; max-width:26ch; }
.about-page .about-prose { max-width:70ch; }
.about-page .about-prose p { margin-top:20px; color:var(--muted); }
.about-page .about-prose h2+p { margin-top:25px; }
.about-page .about-approach { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr); gap:80px; align-items:start; }
.about-page .about-contact { padding:30px; border-radius:16px; background:var(--brand-soft); }
.about-page .about-contact h2 { font-size:32px; color:var(--brand); max-width:14ch; }
.about-page .about-contact p { margin-top:20px; font-size:16px; line-height:1.7; }
.about-page .about-contact .contact-author { font-size:13px; line-height:1.5; font-weight:600; }
.about-page .about-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:50px; padding:13px 20px; margin-top:25px; border-radius:10px; font-size:14px; font-weight:650; line-height:1.5; text-align:center; color:var(--brand-ink); background:var(--brand); }
.about-page .about-button:hover { background:var(--brand-pressed); }
.about-page .about-contact .about-button { width:100%; padding-inline:14px; }
.about-page .about-link { display:inline-flex; align-items:center; min-height:48px; margin-top:16px; color:var(--brand); font-size:16px; font-weight:600; text-decoration:underline; text-underline-offset:5px; }
.about-page .about-link:hover { color:var(--brand-pressed); }
.about-page .about-final { margin-block:28px 64px; padding:48px; background:var(--brand-soft); border-radius:18px; }
.about-page .about-final h2 { font-size:clamp(30px,3.4vw,44px); line-height:1.14; letter-spacing:-.03em; font-weight:650; }
.about-page .about-final p { margin-top:18px; max-width:55ch; color:var(--muted); }
.about-page .site-footer { max-width:1320px; margin-inline:auto; padding:32px 48px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; align-items:center; gap:16px 28px; justify-content:space-between; font-size:12px; }
.about-page .site-footer .brand { display:flex; align-items:center; gap:6px; font-size:21px; line-height:1; font-weight:750; letter-spacing:-.035em; }
.about-page .site-footer .brand svg { width:27px; height:27px; color:var(--brand); }
.about-page .site-footer p { color:var(--muted); }
.about-page .site-footer>div { display:flex; flex-wrap:wrap; gap:0 20px; }
.about-page .site-footer>div a { min-height:44px; display:inline-flex; align-items:center; }
.about-page .site-footer a:hover { color:var(--brand); }
@media (max-width:1179px) {
  .about-page .about-wrap { padding-inline:32px; }
  .about-page .about-hero { gap:48px; }
  .about-page .about-approach { grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:40px; }
  .about-page .about-contact { padding:26px; }
}
@media (max-width:799px) {
  .about-page { font-size:17px; }
  .about-page .about-wrap { padding-inline:24px; }
  .about-page .about-hero { grid-template-columns:1fr; gap:28px; padding-block:40px 44px; }
  .about-page .about-hero h1 { font-size:clamp(35px,7vw,48px); max-width:18ch; }
  .about-page .about-intro { font-size:17px; margin-top:22px; }
  .about-page .founder-photo { width:min(100%,450px); }
  .about-page .founder-photo img { max-height:440px; object-position:center 43%; }
  .about-page .about-section { padding-block:40px; }
  .about-page .about-approach { grid-template-columns:1fr; gap:32px; }
  .about-page .about-contact { padding:25px; }
  .about-page .about-contact h2 { max-width:none; }
  .about-page .about-prose p { margin-top:18px; }
  .about-page .about-final { padding:28px; margin-block:8px 40px; }
  .about-page .site-footer { padding:28px 24px; }
}
@media (max-width:359px) {
  .about-page .about-wrap { padding-inline:20px; }
  .about-page .about-hero h1 { font-size:34px; }
  .about-page .about-contact, .about-page .about-final { padding:22px; }
  .about-page .about-contact h2 { font-size:29px; }
}
@media print {
  .about-page { background:white; }
  .about-page .site-header, .about-page .site-footer, .about-page .skip { display:none; }
  .about-page .about-wrap { padding-inline:0; }
  .about-page .about-hero { padding-block:20px; }
  .about-page .about-section { break-inside:avoid; padding-block:20px; }
}