/* About: editorial rhythm using the homepage's typography and colour system. */
.about-page { --ab-gap:clamp(24px,2.8vw,44px); }
.about-page .ab-hero { padding-top:154px; }
.about-page .ab-hero-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:var(--ab-gap); margin-bottom:48px; }
.about-page .ab-hero-heading .sp-label { margin-bottom:28px; }
.about-page .ab-hero h1 { font-size:clamp(80px,8.9vw,150px); line-height:.99; letter-spacing:-.055em; }
.about-page .ab-hero h1 .sp-mark svg { bottom:-.08em; height:.14em; }
.about-page .ab-hero-intro { max-width:600px; padding-bottom:5px; }
.about-page .ab-hero-intro>p:not(.ab-lead) { font-size:clamp(17px,1.32vw,21px); line-height:1.6; color:var(--sp-copy); margin-top:24px; }
.about-page .ab-lead { font-size:clamp(25px,2.22vw,36px); line-height:1.3; letter-spacing:-.025em; color:var(--ink); }
.about-page .ab-hero-intro .sp-text-link { margin-top:26px; }
.about-page .ab-hero-image { position:relative; border-radius:24px; overflow:hidden; background:#242826; }
.about-page .ab-hero-image>img { width:100%; height:clamp(280px,28vw,460px); object-fit:cover; object-position:45% center; display:block; }
.about-page .ab-hero-image figcaption { position:absolute; inset:auto 28px 24px; display:flex; justify-content:space-between; gap:24px; color:white; font-size:13px; line-height:1.4; }
.about-page .ab-hero-image figcaption span:last-child { color:#e1e5e2; }
.about-page .ab-hero .sp-section-nav { margin-top:36px; }
.about-page .ab-heading { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:var(--ab-gap); margin-bottom:48px; }
.about-page .ab-heading h2,.about-page .ab-values h2 { font-size:clamp(36px,3.55vw,62px); line-height:1.12; }
.about-page .ab-body { font-size:clamp(17px,1.25vw,20px); line-height:1.65; color:var(--sp-copy); }
.about-page .ab-heading>.ab-body { padding-top:5px; max-width:640px; }
.about-page .ab-body p+p { margin-top:20px; }
.about-page .ab-career-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.about-page .ab-career-card { display:grid; grid-template-rows:subgrid; grid-row:span 4; gap:14px; padding:clamp(28px,3vw,46px); border:1px solid #fff; border-radius:24px; background:rgba(255,255,255,.54); }
.about-page .ab-card-top { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:16px; }
.about-page .ab-small { font-size:11px; line-height:1.5; font-weight:500; text-transform:uppercase; letter-spacing:.07em; color:var(--sp-copy); }
.about-page .ab-index { font-size:13px; line-height:1.5; color:var(--sp-copy); font-variant-numeric:tabular-nums; }
.about-page .ab-career-card h3 { font-size:clamp(25px,2.1vw,34px); line-height:1.16; font-weight:500; letter-spacing:-.035em; }
.about-page .ab-career-card>p { font-size:17px; line-height:1.6; color:var(--sp-copy); max-width:60ch; }
.about-page .ab-career-card .ab-role { color:#137966; font-size:14px; line-height:1.5; }
.about-page .ab-numbers { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; margin-top:64px; }
.about-page .ab-numbers>div { padding:0 26px; border-left:1px solid var(--sp-border); }
.about-page .ab-numbers>div:first-child { border-left:0; padding-left:0; }
.about-page .ab-numbers>div:last-child { padding-right:0; }
.about-page .ab-numbers strong { font-size:clamp(42px,4.2vw,70px); line-height:1; font-weight:400; letter-spacing:-.05em; }
.about-page .ab-numbers strong span { color:#008d76; }
.about-page .ab-numbers p { margin-top:13px; font-size:15px; line-height:1.45; color:var(--sp-copy); }
.about-page .ab-metric-note { font-size:12px; line-height:1.6; color:var(--sp-copy); margin-top:24px; }
.about-page .ab-principles { border-top:1px solid var(--sp-border); }
.about-page .ab-principles article { display:grid; grid-template-columns:48px minmax(0,1fr) minmax(0,calc((100% - var(--ab-gap))/2)); gap:var(--ab-gap); align-items:start; border-bottom:1px solid var(--sp-border); padding:32px 0; }
.about-page .ab-principles .ab-index { padding-top:7px; }
.about-page .ab-principles h3 { font-size:clamp(26px,2.4vw,39px); line-height:1.17; font-weight:400; letter-spacing:-.035em; }
.about-page .ab-principles p { font-size:17px; line-height:1.65; color:var(--sp-copy); max-width:610px; }
.about-page .ab-honesty { display:grid; grid-template-columns:1fr 2fr; gap:var(--ab-gap); margin-top:32px; }
.about-page .ab-honesty>p:last-child { color:var(--sp-copy); font-size:16px; line-height:1.65; max-width:720px; }
.about-page .ab-honesty .ab-small { padding-top:4px; }
.about-page .ab-ai-panel { display:grid; grid-template-columns:1fr 2fr; gap:var(--ab-gap); background:var(--ink); color:white; border-radius:26px; padding:clamp(36px,4.4vw,68px); margin-top:64px; }
.about-page .ab-ai-symbol { color:var(--accent); font-size:clamp(100px,14vw,220px); line-height:1; align-self:center; text-align:center; }
.about-page .ab-ai-panel .ab-small { color:var(--accent); margin-bottom:24px; }
.about-page .ab-ai-panel h3 { font-size:clamp(27px,2.55vw,42px); line-height:1.18; font-weight:400; letter-spacing:-.035em; }
.about-page .ab-ai-panel h3+p { font-size:17px; line-height:1.65; color:#bac3bd; margin-top:24px; max-width:660px; }
.about-page .ab-ai-panel .sp-text-link { color:white; margin-top:28px; }
.about-page .ab-ai-panel .sp-text-link:hover { color:var(--accent); }
.about-page .ab-values-layout { display:grid; grid-template-columns:1fr 1fr; gap:var(--ab-gap); }
.about-page .ab-values .sp-label { margin-bottom:30px; }
.about-page .ab-values-copy { padding-top:44px; max-width:640px; }
.about-page .ab-values-copy .ab-lead { margin-bottom:28px; }
.about-page .ab-projects { display:grid; grid-template-columns:1fr 1fr; gap:var(--ab-gap); }
.about-page .ab-project:only-child { grid-column:1 / -1; }
.about-page .ab-project:only-child .ab-project-media { aspect-ratio:2.3; }
.about-page .ab-project-media { overflow:hidden; border-radius:20px; background:#dce2df; aspect-ratio:1.28; }
.about-page .ab-project-media img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.22,1,.36,1); }
.about-page .ab-project:hover .ab-project-media img { transform:scale(1.035); }
.about-page .ab-project-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:25px; }
.about-page .ab-project h3 { font-size:clamp(27px,2.65vw,43px); line-height:1.16; font-weight:400; letter-spacing:-.035em; }
.about-page .ab-project-arrow { display:grid; place-items:center; flex-shrink:0; width:48px; height:48px; border:1px solid #cbd3ce; border-radius:50%; font-size:25px; transition:background .25s; }
.about-page .ab-project:hover .ab-project-arrow { background:var(--accent); border-color:var(--accent); }
.about-page .ab-project>p { font-size:17px; line-height:1.55; color:var(--sp-copy); margin-top:15px; max-width:400px; }
.about-page .ab-projects-action { margin-top:40px; }
.about-page .ab-rating { justify-self:end; align-self:center; display:grid; grid-template-columns:auto auto; align-items:center; gap:10px 22px; }
.about-page .ab-stars { font-size:25px; color:#008d76; letter-spacing:2px; }
.about-page .ab-rating p { font-size:18px; color:var(--sp-copy); }
.about-page .ab-rating p strong { color:var(--ink); font-size:34px; font-weight:500; }
.about-page .ab-rating>span:last-child { grid-column:1/-1; font-size:13px; color:var(--sp-copy); }
.about-page .ab-quotes { display:grid; grid-template-columns:1fr 1fr; gap:var(--ab-gap); }
.about-page .ab-quotes figure { display:flex; flex-direction:column; justify-content:space-between; padding:clamp(28px,3vw,46px); border:1px solid white; border-radius:24px; background:#ffffff89; }
.about-page .ab-quotes blockquote { font-size:clamp(25px,2.15vw,35px); line-height:1.3; letter-spacing:-.025em; }
.about-page .ab-quotes figcaption { margin-top:40px; font-size:15px; line-height:1.5; }
.about-page .ab-quotes figcaption strong { display:block; font-weight:500; }
.about-page .ab-quotes figcaption span { color:var(--sp-copy); font-size:13px; }
.about-page .sp-contact-copy h2 { max-width:none; font-size:clamp(40px,4.05vw,66px); }
@media(min-width:1700px) { .about-page .ab-hero { padding-top:172px; } }
/* Keep the desktop columns and reading sizes consistent across every section. */
@media(min-width:901px) {
  .about-page { --ab-body-size:clamp(17px,1.25vw,20px); }
  .about-page .ab-career-grid { gap:var(--ab-gap); }
  .about-page .ab-honesty { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .about-page .ab-hero-intro>p:not(.ab-lead),
  .about-page .ab-career-card>p:not(.ab-role),
  .about-page .ab-principles p,
  .about-page .ab-ai-panel h3+p,
  .about-page .ab-project>p { font-size:var(--ab-body-size); line-height:1.65; }
  .about-page .ab-project h3 { font-size:clamp(26px,2.4vw,39px); line-height:1.17; }
  .about-page .ab-project>p { max-width:44ch; }
  .about-page .ab-values-copy { padding-top:calc(11px * 1.4 + 30px); }
}
@media(min-width:901px) and (max-width:1120px) {
  .about-page .ab-numbers>div { padding:0 18px; }
  .about-page .ab-principles article { grid-template-columns:26px minmax(0,1fr) minmax(0,calc((100% - var(--ab-gap))/2)); }
}
@media(prefers-reduced-motion:reduce) { .about-page .ab-project-media img { transition:none; } }

@media(max-width:900px) {
  .about-page .ab-hero { padding-top:112px; }
  .about-page .ab-hero-heading,
  .about-page .ab-heading,
  .about-page .ab-values-layout,
  .about-page .ab-honesty { grid-template-columns:minmax(0,1fr); gap:28px; }
  .about-page .ab-hero-heading { margin-bottom:34px; }
  .about-page .ab-hero h1 { font-size:clamp(64px,12vw,104px); }
  .about-page .ab-hero-intro { max-width:650px; }
  .about-page .ab-heading { margin-bottom:32px; }
  .about-page .ab-heading>.ab-body { padding-top:0; }
  .about-page .ab-lead { font-size:26px; }
  .about-page .ab-hero-image { border-radius:20px; }
  .about-page .ab-hero-image>img { height:clamp(280px,44vw,380px); }
  .about-page .ab-hero-image figcaption { inset:auto 20px 20px; flex-wrap:wrap; gap:8px 20px; font-size:12px; }
  .about-page .ab-career-grid { gap:20px; }
  .about-page .ab-career-card { min-width:0; padding:26px; }
  .about-page .ab-career-card>p,.about-page .ab-body { font-size:16px; }
  .about-page .ab-numbers { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 20px; margin-top:40px; }
  .about-page .ab-numbers>div { padding:20px 0 0; border-left:0; border-top:1px solid var(--sp-border); }
  .about-page .ab-numbers strong { font-size:48px; }
  .about-page .ab-numbers p { font-size:14px; }
  .about-page .ab-principles article { grid-template-columns:28px minmax(0,1fr); gap:14px 18px; padding:26px 0; }
  .about-page .ab-principles p { grid-column:2; font-size:16px; }
  .about-page .ab-honesty { gap:14px; }
  .about-page .ab-ai-panel { grid-template-columns:minmax(0,1fr); gap:24px; padding:30px; margin-top:40px; }
  .about-page .ab-ai-symbol { text-align:left; font-size:64px; }
  .about-page .ab-ai-panel h3+p { font-size:16px; }
  .about-page .ab-values-copy { padding-top:0; }
  .about-page .ab-values-copy .ab-lead { margin-bottom:20px; }
  .about-page .ab-rating { justify-self:start; }
  .about-page .ab-quotes { gap:20px; }
  .about-page .ab-quotes figure { padding:26px; min-width:0; }
  .about-page .sp-contact-copy h2 { font-size:clamp(32px,5.5vw,46px); }
}
@media(max-width:600px) {
  .about-page .ab-hero h1 { font-size:clamp(60px,17vw,90px); }
  .about-page .ab-hero-heading .sp-label { font-size:10px; }
  .about-page .ab-career-grid,
  .about-page .ab-quotes,
  .about-page .ab-projects { grid-template-columns:minmax(0,1fr); }
  .about-page .ab-career-card { grid-row:auto; grid-template-rows:auto; padding:24px 22px; gap:14px; }
  .about-page .ab-card-top { margin-bottom:4px; }
  .about-page .ab-numbers { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .about-page .ab-numbers strong { font-size:44px; }
  .about-page .ab-principles article { column-gap:12px; }
  .about-page .ab-ai-panel,.about-page .ab-quotes figure { padding:26px 22px; }
  .about-page .ab-hero-image figcaption { position:static; padding:16px 20px; }
  .about-page .ab-quotes figcaption { margin-top:28px; }
}