.about-page {
    background: #f4f2eb;
    background-image: none;
    color: #0b1220;
}

.about-page main { overflow: hidden; }
.about-page h1,
.about-page h2,
.about-page h3 { color: #0b1220; }
.about-page h1 span,
.about-page h2 span { color: #087f78; }
.about-page .site-header,
.about-page .site-footer { color: #f8fafc; }
.about-page .nav-links a[aria-current="page"] { color: #67e8f9; }

.about-eyebrow {
    margin: 0 0 1.25rem;
    color: #087f78;
    font: 600 .69rem/1.2 var(--mono);
    letter-spacing: .13em;
    text-transform: uppercase;
}
.about-eyebrow--dark { color: #67e8f9; }

.about-hero {
    position: relative;
    isolation: isolate;
    padding: clamp(2.6rem, 5vw, 4.6rem) 0 clamp(3rem, 5.5vw, 5rem);
    border-bottom: 1px solid #d7dcd8;
    background: #f4f2eb;
}
.about-hero::before {
    position: absolute;
    z-index: -1;
    right: -18vw;
    top: -24vw;
    width: 62vw;
    height: 62vw;
    border: 1px solid rgba(8, 127, 120, .13);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(20, 184, 166, .11), transparent 68%);
    content: "";
}
.about-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(400px, .78fr);
    align-items: center;
    gap: clamp(2.5rem, 6vw, 6rem);
}
.about-hero__copy { max-width: 660px; }
.about-hero h1 {
    max-width: 700px;
    margin: 0 0 1.15rem;
    font: 600 clamp(2.75rem, 5vw, 4.85rem)/.95 var(--display);
    letter-spacing: -.065em;
}
.about-hero__lead { max-width: 620px; margin-bottom: 1.4rem; }
.about-hero__lead p { margin: 0 0 .72rem; color: #52606d; font-size: clamp(.92rem, 1.08vw, 1.02rem); line-height: 1.6; }
.about-hero__lead strong { color: #0b1220; }

.about-portrait { margin: 0; }
.about-portrait__frame {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 5;
    border: 1px solid #cdd4d0;
    border-radius: 24px;
    background: #dfe6df;
    box-shadow: 0 32px 80px rgba(11, 18, 32, .18);
}
.about-portrait__frame::after {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, .44);
    border-radius: inherit;
    content: "";
    pointer-events: none;
}
.about-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; }
.about-portrait figcaption { margin-top: .85rem; color: #65727b; font: 500 .7rem/1.5 var(--mono); }

.about-section { padding: clamp(5rem, 9vw, 9rem) 0; }
.about-section--paper { background: #f4f2eb; }
.about-section--white { border-top: 1px solid #e0e4e1; border-bottom: 1px solid #e0e4e1; background: #fff; }
.about-split {
    display: grid;
    grid-template-columns: minmax(180px, .38fr) minmax(0, 1fr);
    gap: clamp(2.5rem, 8vw, 8rem);
}
.about-index {
    margin: 2.8rem 0 0;
    color: rgba(8, 127, 120, .14);
    font: 600 clamp(4.5rem, 9vw, 8.5rem)/1 var(--display);
    letter-spacing: -.08em;
}
.about-prose { max-width: 790px; }
.about-prose--large { max-width: 840px; }
.about-prose h2,
.about-heading h2,
.about-paths h2,
.about-closing h2 {
    margin: 0 0 2rem;
    font: 600 clamp(2.5rem, 5vw, 5rem)/1.02 var(--display);
    letter-spacing: -.055em;
}
.about-prose p { margin: 0 0 1.25rem; color: #52606d; font-size: clamp(1rem, 1.35vw, 1.16rem); line-height: 1.75; }
.about-prose strong { color: #0b1220; }

.about-belief { padding: clamp(5rem, 9vw, 8rem) 0; background: #0b1220; color: #f8fafc; }
.about-belief__inner { max-width: 1020px; }
.about-belief blockquote {
    margin: 0;
    color: #f8fafc;
    font: 400 clamp(2.35rem, 5.3vw, 5.35rem)/1.08 var(--contrast);
    letter-spacing: -.055em;
}

.about-heading { display: grid; grid-template-columns: .38fr 1fr; gap: clamp(2.5rem, 8vw, 8rem); align-items: start; }
.about-heading h2 { max-width: 790px; }
.about-principles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin-top: 3.5rem;
    overflow: hidden;
    border: 1px solid #d7dcd8;
    border-radius: 18px;
    background: #d7dcd8;
}
.about-principles article { min-height: 315px; padding: clamp(1.6rem, 3.5vw, 3rem); background: #f9faf8; }
.about-principles article:nth-child(2),
.about-principles article:nth-child(3) { background: #f2f5f1; }
.about-principle__number { margin: 0 0 2.5rem; color: #087f78; font: 600 .7rem/1 var(--mono); letter-spacing: .12em; }
.about-principles h3 { max-width: 430px; margin: 0 0 1rem; font-size: clamp(1.35rem, 2.2vw, 2rem); line-height: 1.15; }
.about-principles article > p:last-child { max-width: 500px; margin: 0; color: #5e6a72; font-size: .95rem; line-height: 1.7; }

.about-paths { padding: clamp(5.5rem, 10vw, 9rem) 0; background: #dff5f1; }
.about-paths__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, .7fr); gap: clamp(3rem, 9vw, 9rem); }
.about-paths h2 { max-width: 680px; }
.about-paths__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem 1rem; max-width: 620px; margin-top: 2.3rem; }
.about-paths__list a { padding: .9rem 0; border-bottom: 1px solid rgba(8, 127, 120, .24); color: #0d6f69; font: 600 .8rem/1.3 var(--display); transition: color .2s ease, padding-left .2s ease; }
.about-paths__list a:hover { padding-left: .35rem; color: #123a63; }
.about-paths .button { margin-top: 1rem; }

.about-closing { padding: clamp(6rem, 11vw, 10rem) 0; background: #050a12; color: #f8fafc; }
.about-closing__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .72fr); gap: clamp(3rem, 9vw, 9rem); }
.about-closing h2 { max-width: 720px; color: #f8fafc; }
.about-closing h2 span { color: #67e8f9; }
.about-closing__copy p { margin: 0 0 1.2rem; color: #aeb8c4; font-size: clamp(1rem, 1.3vw, 1.12rem); line-height: 1.75; }
.about-closing__copy strong { color: #f8fafc; }
.about-closing__copy .about-closing__last { color: #67e8f9; font: 400 clamp(1.5rem, 2.5vw, 2.2rem)/1.2 var(--contrast); }
.about-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem; margin-top: 2rem; }
.about-text-link { display: inline-flex; align-items: center; gap: .45rem; border-bottom: 1px solid #67e8f9; padding-bottom: .2rem; color: #f8fafc; font: 600 .8rem/1.2 var(--display); }
.about-text-link span { color: #67e8f9; }
.about-text-link:hover { color: #67e8f9; }

@media (max-width: 980px) {
    .about-hero__grid,
    .about-closing__grid { grid-template-columns: 1fr; }
    .about-hero__copy { max-width: 760px; }
    .about-portrait { max-width: 650px; }
    .about-split,
    .about-heading,
    .about-paths__grid { grid-template-columns: 1fr; gap: 2rem; }
    .about-index { display: none; }
    .about-principles { margin-top: 2.25rem; }
    .about-closing__copy { max-width: 720px; }
}

@media (min-width: 981px) and (max-height: 800px) {
    .about-hero { padding-top: 2rem; padding-bottom: 2.5rem; }
    .about-portrait { width: 100%; max-width: 400px; justify-self: end; }
}

@media (max-width: 680px) {
    .about-hero { padding: 2.25rem 0 3.2rem; }
    .about-hero__grid { gap: 2rem; }
    .about-hero h1 { margin-bottom: .9rem; font-size: clamp(2.1rem, 10.5vw, 2.8rem); line-height: .98; }
    .about-hero__lead { margin-bottom: 1.2rem; }
    .about-hero__lead p { margin-bottom: .65rem; font-size: .88rem; line-height: 1.55; }
    .about-portrait__frame { border-radius: 16px; }
    .about-section { padding: 4.8rem 0; }
    .about-prose h2,
    .about-heading h2,
    .about-paths h2,
    .about-closing h2 { font-size: clamp(2.25rem, 11vw, 3.3rem); }
    .about-belief { padding: 4.8rem 0; }
    .about-belief blockquote { font-size: clamp(2rem, 10vw, 3rem); }
    .about-principles { grid-template-columns: 1fr; }
    .about-principles article { min-height: 0; padding: 1.6rem; }
    .about-principles article:nth-child(3) { background: #f9faf8; }
    .about-principles article:nth-child(even) { background: #f2f5f1; }
    .about-paths { padding: 4.8rem 0; }
    .about-paths__list { grid-template-columns: 1fr; }
    .about-closing { padding: 5.2rem 0; }
    .about-actions { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    .about-paths__list a { transition: none; }
}