.about-page-v2{background:var(--color-paper-warm);overflow:clip}
.about-page-v2 .mission-hero{position:relative;isolation:isolate;max-width:none;min-height:620px;margin:0;padding:clamp(72px,8vw,112px) max(5%,calc((100% - 1296px)/2)) clamp(90px,9vw,130px);gap:7%;background:var(--color-sky) url('/assets/home/painted-sky.webp') center 55%/cover no-repeat;color:var(--color-ivory)}
.about-page-v2 .mission-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,color-mix(in srgb, var(--color-navy) 87%, transparent) 0%,color-mix(in srgb, var(--color-navy) 64%, transparent) 52%,color-mix(in srgb, var(--color-navy) 33%, transparent) 100%)}
.about-page-v2 .mission-hero h1{color:var(--color-ivory);font-size:var(--type-page);letter-spacing:-.03em}
.about-page-v2 .mission-hero .eyebrow{color:var(--color-ivory)}
.about-page-v2 .mission-copy{color:var(--color-ivory);max-width:670px;font-size:var(--type-lead);line-height:1.56}
.about-page-v2 .family-note{background:var(--color-pale-sky);color:var(--color-ink);border-radius:16px;padding:42px 36px 38px;transform:rotate(1deg);box-shadow:0 24px 40px -26px color-mix(in srgb, var(--color-navy) 50%, transparent)}
.about-page-v2 .family-note h2{color:var(--color-navy);font-size:var(--type-subheading)}
.about-page-v2 .family-note .eyebrow{color:var(--color-azure-deep)}
.about-page-v2 .why-section{border:0;padding-top:clamp(70px,7vw,105px);padding-bottom:clamp(70px,7vw,105px)}
.about-page-v2 .why-section h2{color:var(--color-navy);font-weight:var(--weight-medium)}
.about-page-v2 .why-section .eyebrow{color:var(--color-azure-deep)}
.about-page-v2 .why-copy{color:var(--color-ink)}
.about-page-v2 .why-section blockquote{color:var(--color-navy);border-color:var(--color-border-sky)}
.about-page-v2 .values-section{background:var(--color-navy)}
.about-page-v2 .values-heading h2{font-weight:var(--weight-medium)}
.about-page-v2 .values-book{gap:24px}
.about-page-v2 .value-page{box-shadow:0 22px 40px -29px color-mix(in srgb, var(--color-navy) 40%, transparent)}
.about-page-v2 .parent-promise{max-width:none;margin:0;padding:clamp(70px,7vw,105px) max(5%,calc((100% - 1296px)/2));border-radius:0;background:var(--color-pale-sky);color:var(--color-navy)}
.about-page-v2 .parent-promise h2{font-size:var(--type-section);font-weight:var(--weight-medium)}
.about-page-v2 .parent-promise>div>p:not(.eyebrow),.about-page-v2 .promise-list span{color:var(--color-ink)}
.about-page-v2 .parent-promise .eyebrow{color:var(--color-azure-deep)}
.about-page-v2 .promise-list li,.about-page-v2 .promise-list li:last-child{border-color:var(--color-border-sky)}
.about-page-v2 .parent-promise .button{background:var(--color-orange-action);color:var(--color-on-orange-action);max-width:100%}
.about-page-v2 .parent-promise .button:hover{background:var(--color-orange-action-hover);color:var(--color-on-orange-action)}
@media(max-width:900px){.about-page-v2 .mission-hero{min-height:0;gap:70px}.about-page-v2 .family-note{max-width:650px}}
@media(max-width:650px){
  .about-page-v2 .mission-hero{padding:64px 6% 76px;gap:62px;background-position:60% center}
  .about-page-v2 .mission-hero::before{background:linear-gradient(90deg,color-mix(in srgb, var(--color-navy) 91%, transparent),color-mix(in srgb, var(--color-navy) 66%, transparent))}
  .about-page-v2 .mission-hero h1{font-size:var(--type-page)}
  .about-page-v2 .mission-copy{font-size:var(--type-lead)}
  .about-page-v2 .family-note{transform:none;padding:36px 28px 30px}
  .about-page-v2 .why-section{padding:65px 6%}
  .about-page-v2 .parent-promise{padding:65px 6% 72px}
}

/* The values book. about.js stacks the pages on a phone (each sticks and the next slides over it,
   the one beneath settling back and dimming) and adds .is-live; without it, or with reduced motion,
   the pages simply scroll. overflow:clip on the page, rather than hidden, is what lets them stick. */
.about-page-v2.is-live .value-page{transform-origin:50% 0}
.about-page-v2.is-live .value-page::before{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;background:var(--color-navy);opacity:var(--dim,0)}
.about-page-v2 .values-book.is-stacked .value-page{position:sticky;top:calc(var(--stack-top,24px) + var(--i,0) * 10px);will-change:transform}