/* About and its style-key examples only. Shared components and assets unchanged. */
.about-page .mainnav a[aria-current="page"], .about-page .mobile-menu a[aria-current="page"], .about-page .eyebrow { background:var(--sky); color:var(--teal); }
.ab-opening { padding-top:64px; padding-bottom:56px; }
.ab-opening-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:88px; align-items:center; margin-top:28px; }
.ab-opening h1 { font-size:clamp(46px,5.3vw,76px); line-height:1.04; letter-spacing:-.03em; }
.ab-operator { font-size:16px; line-height:1.55; color:var(--slate); margin-top:24px; max-width:30em; }
.ab-operator strong { font-weight:600; color:var(--teal); }
.ab-perspective { padding-top:56px; }
.ab-editorial-grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:88px; }
.ab-editorial-grid h2 { font-size:clamp(36px,3.7vw,50px); line-height:1.08; letter-spacing:-.025em; }
.ab-prose { max-width:36em; }
.ab-prose p + p { margin-top:22px; }
.ab-experience { padding-top:88px; }
.about-page .relationship-strip--about { border:0; padding:24px 0 0; }
.ab-approach { padding-top:80px; }
.ab-principles { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:88px; }
.ab-principles-intro h2 { font-size:clamp(36px,3.7vw,50px); line-height:1.08; letter-spacing:-.025em; }
.ab-principles-intro > p { margin-top:24px; max-width:28em; }
.ab-principles-intro .go { margin-top:24px; font-size:17px; }
.ab-values { list-style:none; margin:0; padding:0; }
.ab-values li { border-top:1px solid var(--line); padding:24px 0; }
.ab-values li:first-child { padding-top:0; border:0; }
.ab-values li:last-child { padding-bottom:0; }
.ab-values h3 { font-size:23px; line-height:1.3; letter-spacing:-.015em; }
.ab-values p { margin-top:12px; font-size:17px; line-height:1.55; }
.ab-policy { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:88px; margin-top:40px; padding:24px 32px; background:var(--cloud); border-radius:24px; align-items:center; }
.ab-policy h3 { font-size:23px; line-height:1.3; letter-spacing:-.015em; }
.ab-policy p { font-size:17px; line-height:1.55; }
.ab-closing { padding-top:80px; }
.ab-close { padding:56px; border-radius:40px; background:var(--teal); }
.ab-close h2 { color:var(--white); font-size:clamp(36px,3.7vw,50px); line-height:1.08; letter-spacing:-.025em; }
.ab-close > p { margin-top:20px; max-width:46em; color:var(--white); }
.ab-close .actions { margin-top:28px; }
.ab-close .ab-employer { background:var(--mint); border-color:var(--mint); color:var(--teal); }
.ab-close .ab-agency { background:var(--peach); border-color:var(--peach); color:var(--teal); }
.ab-close .btn:hover { background:var(--white); border-color:var(--white); }
.ab-close-note { font-size:15px; line-height:1.55; }
.about-page .site-footer { margin-top:80px; }
.ab-key-examples { margin-top:32px; }
@media(max-width:1100px) { .ab-opening-grid, .ab-editorial-grid, .ab-principles, .ab-policy { gap:48px; } }
@media(max-width:960px) { .ab-opening-grid, .ab-editorial-grid, .ab-principles { grid-template-columns:minmax(0,1fr); gap:32px; } }
@media(max-width:600px) {
 .ab-opening { padding-top:36px; padding-bottom:40px; }
 .ab-opening-grid { margin-top:22px; gap:24px; }
 .ab-opening h1 { font-size:46px; }
 .ab-operator { margin-top:20px; }
 .ab-perspective { padding-top:32px; }
 .ab-experience { padding-top:56px; }
 .ab-prose p + p { margin-top:20px; }
 .about-page .relationship-strip--about { padding-top:16px; }
 .ab-approach { padding-top:56px; }
 .ab-principles-intro h2 { font-size:36px; }
 .ab-principles-intro > p, .ab-principles-intro .go { margin-top:20px; }
 .ab-policy { grid-template-columns:minmax(0,1fr); gap:12px; margin-top:32px; padding:24px; }
 .ab-closing { padding-top:56px; }
 .ab-close { padding:32px 24px; border-radius:24px; }
 .ab-close h2 { font-size:36px; }
 .ab-close .btn { width:100%; font-size:16px; padding-left:12px; padding-right:12px; }
 .about-page .site-footer { margin-top:56px; }
}

/* About desktop: 21 experience marks in seven even rows of three. */
@media (min-width:761px) {
 .about-page .relationship-strip--about .marks { grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(7,104px); }
 .about-page .relationship-strip--about .marks li,
 .about-page .relationship-strip--about .marks li:nth-child(-n+3) { grid-column:auto; }
}