.site-main {
    background-color: var(--c-bg);
}
.about-hero-pinned {
    position: relative;
    height: 885vh;
    background-color: var(--c-bg);
}

.about-hero-sticky-frame {
    position: sticky;
    top: 0;
    height: 100vh;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    background-color: var(--c-bg);
}
.about-hero-grain {
    position: absolute;
    inset: -80px;
    width: calc(100% + 160px);
    height: calc(100% + 160px);
    background-image: url('/assets/images/map-grain.webp');
    background-repeat: repeat;
    background-size: 160px 160px;
    pointer-events: none;
    z-index: 6;
    mix-blend-mode: multiply;
    opacity: 1;
    animation: heroGrainJitter var(--dur-base) steps(5) infinite;
    will-change: transform, opacity;
}

@keyframes heroGrainJitter {
    0%   { transform: translate3d(0, 0, 0); }
    20%  { transform: translate3d(-25px, -15px, 0); }
    40%  { transform: translate3d(20px, 25px, 0); }
    60%  { transform: translate3d(-15px, 30px, 0); }
    80%  { transform: translate3d(30px, -20px, 0); }
    100% { transform: translate3d(-20px, 10px, 0); }
}
.about-flight-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    z-index: 3;
    transition: opacity var(--dur-mid) var(--ease-editorial);
}

.about-flight-shadow {
    position: absolute;
    top: 0;
    left: 0;
    width: clamp(200px, 22vw, 320px);
    height: clamp(200px, 22vw, 320px);
    transform-origin: center center;
    filter: blur(4px);
    opacity: 0.18;
    mix-blend-mode: multiply;
    will-change: transform, opacity, filter;
    pointer-events: none;
    z-index: 3;
}

.about-flight-shadow__body {
    width: 100%;
    height: 100%;
    transform-origin: center center;
    animation: shadowContinuousBreathing 4.2s ease-in-out infinite;
}

.about-flight-plane {
    position: absolute;
    top: 0;
    left: 0;
    width: clamp(72px, 8vw, 110px);
    height: clamp(72px, 8vw, 110px);
    transform-origin: center center;
    will-change: transform, opacity;
    pointer-events: none;
    z-index: 4;
    filter: drop-shadow(2px 8px 18px rgb(var(--rgb-ink) / 0.16));
}

.about-flight-plane__body {
    width: 100%;
    height: 100%;
    transform-origin: center center;
    animation: paperPlaneContinuousBreathing 4.2s ease-in-out infinite;
}
@keyframes paperPlaneContinuousBreathing {
    0%, 100% {
        transform: translate3d(0, 0, 0) rotate(0deg);
    }
    50% {
        transform: translate3d(-3px, -8px, 0) rotate(-2deg);
    }
}

@keyframes shadowContinuousBreathing {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.18;
    }
    50% {
        transform: translate3d(4px, 6px, 0) scale(1.05);
        opacity: 0.14;
    }
}
body:has(#site-preloader:not(.is-loaded)) .about-flight-layer {
    opacity: 0 !important;
}

.about-hero-center-stage {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: var(--container-wide);
    padding: 0 var(--container-padding);
    display: grid;
    place-items: center;
    text-align: center;
    min-height: 480px;
}
.about-hero-quote-block {
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
    will-change: opacity, filter, transform;
}

.about-quote-mark {
    margin-bottom: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    filter: none;
    transform: none;
}

.about-quote-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.about-blur-line {
    font-family: var(--font-display);
    font-size: clamp(2rem, 4.4vw, 3.6rem);
    text-transform: uppercase;
    font-weight: var(--fw-medium);
    line-height: var(--lh-title);
    letter-spacing: var(--tracking-body);
    color: var(--c-red);
    opacity: 1;
    filter: none;
    transform: none;
}
body:has(#site-preloader:not(.is-loaded)) .about-hero-quote-block,
body:has(#site-preloader:not(.is-loaded)) .about-quote-mark,
body:has(#site-preloader:not(.is-loaded)) .about-blur-line,
.about-hero-quote-block:not(.is-ready) .about-quote-mark,
.about-hero-quote-block:not(.is-ready) .about-blur-line {
    opacity: 0 !important;
    filter: blur(20px) !important;
    transform: translateY(24px) !important;
}
.about-hero-story-block {
    grid-area: 1 / 1;
    position: relative;
    width: 100%;
    max-width: var(--container-wide);
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    opacity: 0;
    filter: blur(14px);
    pointer-events: none;
    will-change: opacity, filter, transform;
}
.about-story-statement,
.about-timeline-headline {
    font-family: var(--font-display);
    font-size: var(--fs-quote);
    text-transform: uppercase;
    line-height: var(--lh-quote);
    letter-spacing: var(--tracking-body);
    font-weight: var(--fw-medium);
    color: var(--c-dark);
}

.about-story-statement {
    margin: 0 auto clamp(24px, 3.5vh, 36px);
    max-width: 1080px;
    text-wrap: balance;
    text-wrap: pretty;
}

.about-story-statement span {
    display: inline-block;
    transition: color var(--dur-base) ease;
}

.about-story-statement .text-red {
    color: var(--c-red);
}

.about-story-desc {
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: clamp(0.98rem, 1.25vw, 1.08rem);
    line-height: var(--lh-copy);
    color: var(--c-text-muted);
    letter-spacing: var(--tracking-caption);
    max-width: 720px;
    margin: 0 auto;
    opacity: 0;
    filter: blur(8px);
    transform: translateY(14px);
    will-change: opacity, filter, transform;
}
.about-story-desc p + p {
    margin-top: var(--space-4);
}
.about-sky-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 12;
    pointer-events: none;
    overflow: hidden;
    opacity: 0;
    will-change: opacity;
}

.about-cloud {
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    will-change: transform, opacity;
    opacity: 0;
}
.about-cloud--fg {
    z-index: 4;
}

.about-cloud.cloud-fg-tl {
    top: -14vh;
    left: -14vw;
    width: clamp(480px, 62vw, 1080px);
    height: clamp(280px, 42vh, 660px);
    background-image: url('/assets/images/cloud-1.webp');
    background-position: top left;
}

.about-cloud.cloud-fg-tr {
    top: -12vh;
    right: -14vw;
    width: clamp(460px, 58vw, 1020px);
    height: clamp(270px, 40vh, 640px);
    background-image: url('/assets/images/cloud-2.webp');
    background-position: top right;
}

.about-cloud.cloud-fg-bl {
    bottom: -16vh;
    left: -12vw;
    width: clamp(500px, 66vw, 1140px);
    height: clamp(300px, 44vh, 700px);
    background-image: url('/assets/images/cloud-3.webp');
    background-position: bottom left;
}

.about-cloud.cloud-fg-br {
    bottom: -14vh;
    right: -16vw;
    width: clamp(480px, 62vw, 1080px);
    height: clamp(290px, 42vh, 680px);
    background-image: url('/assets/images/cloud-4.webp');
    background-position: bottom right;
}
.about-cloud--mg {
    z-index: 3;
}

.about-cloud.cloud-mg-l {
    top: 20vh;
    left: -6vw;
    width: clamp(380px, 48vw, 840px);
    height: clamp(240px, 34vh, 520px);
    background-image: url('/assets/images/cloud-2.webp');
    background-position: center;
}

.about-cloud.cloud-mg-r {
    top: 32vh;
    right: -8vw;
    width: clamp(400px, 50vw, 880px);
    height: clamp(250px, 36vh, 540px);
    background-image: url('/assets/images/cloud-4.webp');
    background-position: center;
}

.about-cloud.cloud-mg-c {
    bottom: -6vh;
    left: 24vw;
    width: clamp(420px, 54vw, 920px);
    height: clamp(260px, 38vh, 580px);
    background-image: url('/assets/images/cloud-1.webp');
    background-position: bottom center;
}

.about-cloud.cloud-mg-tc {
    top: -6vh;
    left: 28vw;
    width: clamp(360px, 46vw, 800px);
    height: clamp(220px, 32vh, 480px);
    background-image: url('/assets/images/cloud-3.webp');
    background-position: top center;
}
.about-cloud--bg {
    z-index: 2;
}

.about-cloud.cloud-bg-top {
    top: 10vh;
    left: 16vw;
    width: clamp(320px, 40vw, 700px);
    height: clamp(200px, 28vh, 440px);
    background-image: url('/assets/images/cloud-3.webp');
    background-position: center;
}

.about-cloud.cloud-bg-btm {
    bottom: 12vh;
    right: 18vw;
    width: clamp(340px, 42vw, 740px);
    height: clamp(210px, 30vh, 460px);
    background-image: url('/assets/images/cloud-1.webp');
    background-position: center;
}
.about-timeline-curtain {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: var(--c-white);
    z-index: 25;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: clamp(24px, 4vh, 44px) 0 clamp(20px, 3.5vh, 36px);
    text-align: center;
    clip-path: polygon(100% 0px, 100% 0px, 100% 100%, 100% 100%, 100% 50%);
    will-change: clip-path;
    pointer-events: none;

    box-sizing: border-box;
    overflow: hidden;
}

.about-timeline-curtain.is-active {
    pointer-events: auto;
    clip-path: none;
}
.about-plane-flyby-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 35;
    pointer-events: none;
    overflow: hidden;
}
.about-plane-shadow {
    position: absolute;
    top: 50%;
    left: 0;
    height: 120vh;
    width: auto;
    transform: translate3d(120vw, -50%, 0);
    will-change: transform, opacity;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 34;
}

.about-plane-shadow__img {
    height: 120vh;
    width: auto;
    display: block;
    user-select: none;
    -webkit-user-drag: none;
    filter: brightness(0) blur(24px);
    opacity: 0.34;
    mix-blend-mode: multiply;
    transform: translate3d(-35px, 42px, 0) scale(0.96);
}

.about-plane-flyby {
    position: absolute;
    top: 50%;
    left: 0;
    height: 120vh;
    width: auto;
    transform: translate3d(120vw, -50%, 0);
    will-change: transform, opacity;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 36;
}

.about-plane-img {
    height: 120vh;
    width: auto;
    display: block;
    user-select: none;
    -webkit-user-drag: none;
    filter: drop-shadow(-8px 12px 14px rgb(var(--rgb-ink) / 0.16));
}

.about-timeline-stage {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-height: 0;
    width: 100%;
    max-width: var(--container-wide);
    padding-left: var(--container-padding);
    padding-right: var(--container-padding);
    margin: auto 0;
}

.about-timeline-giant-year {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: baseline;
    font-family: var(--font-display);
    font-size: clamp(6rem, 16vw, 15rem);
    color: var(--c-red);
    font-weight: var(--fw-medium);
    line-height: 0.85;
    letter-spacing: -3px;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    user-select: none;
    margin: 0 auto clamp(20px, 3.2vh, 38px);
    will-change: transform, opacity;
    transition: color var(--dur-mid) ease;
    width: 100%;
}

.giant-year-prefix {
    justify-self: end;
    display: inline-flex;
    align-items: baseline;
    line-height: inherit;
    letter-spacing: inherit;
    user-select: none;
}

.giant-year-suffix {
    justify-self: start;
    display: inline-flex;
    align-items: baseline;
    line-height: inherit;
    letter-spacing: inherit;
    user-select: none;
}

.timeline-digit-col {
    display: inline-block;
    position: relative;
    overflow: hidden;
    height: 0.88em;
    height: 1lh;
    line-height: inherit;
    vertical-align: baseline;
    flex-shrink: 0;
}

.timeline-digit-track {
    display: flex;
    flex-direction: column;
    will-change: transform;
}

.timeline-digit-item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 0.88em;
    height: 1lh;
    line-height: inherit;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    user-select: none;
    color: inherit;
}
.about-timeline-stage.is-gold .about-timeline-giant-year {
    color: var(--c-gold);
}

.about-timeline-stage.is-gold .about-timeline-bullet .bullet-dot {
    background-color: var(--c-gold);
}

.about-timeline-headline {
    margin: 0 0 clamp(10px, 1.6vh, 16px);
    will-change: transform, opacity, filter;
}
.about-timeline-lead {
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: var(--fs-lead);
    line-height: var(--lh-copy);
    color: var(--c-text-dark);
    letter-spacing: var(--tracking-lead);
    font-weight: var(--fw-regular);
    max-width: 760px;
    min-height: 3em;
    margin: 0 auto var(--space-block-sm);
    text-wrap: balance;
    text-wrap: pretty;
    will-change: transform, opacity, filter;
}

.about-timeline-bullets-wrapper {
    width: 100%;
    max-width: var(--container-wide);
    min-height: 5.2em;
}

.about-timeline-bullets-group {
    display: none;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(18px, 2.8vw, 40px);
    text-align: left;
    align-items: start;
    justify-content: center;
}

.about-timeline-bullets-group.active {
    display: grid;
}

.about-timeline-bullet {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    will-change: transform, opacity, filter;
}

.about-timeline-bullet .bullet-dot {
    width: 6px;
    height: 6px;
    border-radius: var(--radius-round);
    background-color: var(--c-red);
    flex-shrink: 0;
    margin-top: 8px;
}

.about-timeline-bullet p {
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: clamp(0.95rem, 1.15vw, 1.05rem);
    line-height: var(--lh-copy);
    color: var(--c-text-muted);
    letter-spacing: var(--tracking-body);
    margin: 0;
}
.about-timeline-ruler-wrap {
    width: 100%;
    max-width: var(--container-wide);
    margin: 0 auto;
    padding-top: 16px;
    padding-left: var(--container-padding);
    padding-right: var(--container-padding);
    user-select: none;
    position: relative;
}

.about-ruler-years {
    position: relative;
    width: 100%;
    height: 24px;
    margin-bottom: 4px;
}

.about-ruler-year-btn {
    position: absolute;
    bottom: 0;
    transform: translateX(-50%);
    background: none;
    border: none;
    outline: none;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent;
    font-family: var(--font-display);
    font-size: clamp(1.05rem, 1.45vw, 1.35rem);
    color: rgb(var(--rgb-ink) / 0.35);
    cursor: pointer;
    transition: color var(--dur-base) ease, transform var(--dur-base) ease;
    padding: 0 2px;
    line-height: var(--lh-none);
    white-space: nowrap;
}

.about-ruler-year-btn:focus,
.about-ruler-year-btn:focus-visible,
.about-ruler-year-btn:active {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

.about-ruler-year-btn:hover {
    color: var(--c-dark);
}

.about-ruler-year-btn.active {
    color: var(--c-red);
}

.about-ruler-year-btn.is-vision.active {
    color: var(--c-gold) !important;
}

.about-ruler-year-btn.is-vision .ruler-vision-star {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    font-family: var(--font-primary);
    font-size: var(--fs-body-sm);
    font-weight: var(--fw-bold);
    line-height: var(--lh-none);
    color: rgb(var(--rgb-ink) / 0.35);
    transition: color var(--dur-base) ease;
    pointer-events: none;
}

.about-ruler-year-btn.is-vision:hover .ruler-vision-star {
    color: var(--c-dark);
}

.about-ruler-year-btn.is-vision.active .ruler-vision-star {
    color: var(--c-gold) !important;
}
.about-quote-gloss {
    margin: 18px 0 0;
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: var(--fs-body-sm);
    line-height: var(--lh-copy);
    letter-spacing: var(--tracking-body);
    text-align: center;
    color: var(--c-text-light);
}
.about-ruler-note {
    margin: 10px 0 0;
    text-align: right;
    color: var(--c-text-light);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-eyebrow);
}

.about-ruler-note span {
    color: var(--c-gold);
    font-weight: var(--fw-bold);
}

.about-ruler-track {
    position: relative;
    width: 100%;
    height: 42px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    cursor: pointer;
    padding: 0 4px;
    border-bottom: none;
}

.ruler-tick {
    flex-shrink: 0;
    width: 1px;
    height: 14px;
    background-color: var(--c-dark);
    opacity: 0.14;
    border-radius: 1px 1px 0 0;
    transition: height 0.08s ease-out, opacity 0.1s ease;
    pointer-events: none;
}

@keyframes timelineFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.about-values-pinned {
    position: relative;
    height: 420vh;
    background-color: var(--c-bg);
    border-top: none;
}

.about-values-sticky-frame {
    position: sticky;
    top: 0;
    height: 100vh;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    background-color: var(--c-bg);
    z-index: 10;
}

.about-values-stage {
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: clamp(48px, 6vw, 100px);
    align-items: center;
    width: 100%;
    max-width: var(--container-wide);
    margin: 0 auto;
}

.about-values-left {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    gap: clamp(16px, 2.2vw, 32px);
}
.about-values-fixed-indicator {
    display: inline-flex;
    align-items: center;
    gap: clamp(10px, 1.2vw, 16px);
    flex-shrink: 0;
    user-select: none;
    pointer-events: none;
}

.about-values-fixed-indicator .indicator-eyebrow {
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: clamp(0.72rem, 0.85vw, 0.82rem);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--c-red);
    white-space: nowrap;
    line-height: var(--lh-none);
}

.about-values-fixed-indicator .indicator-line {
    width: clamp(20px, 2.4vw, 32px);
    height: 2px;
    background-color: var(--c-red);
    flex-shrink: 0;
}

.about-values-nav-viewport {
    position: relative;
    height: clamp(380px, 52vh, 480px);
    flex: 1;
    min-width: 0;
    overflow: hidden;
    mask-image: linear-gradient(to bottom, transparent 0%, black 16%, black 84%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 16%, black 84%, transparent 100%);
    display: flex;
    align-items: center;
}

.about-values-nav-track {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    gap: clamp(18px, 3vh, 32px);
    transition: transform 0.7s var(--ease-editorial);
    will-change: transform;
}

.about-values-nav-item {
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent;
    padding: 6px 0;
    margin: 0;
    cursor: pointer;
    text-align: left;
    display: flex;
    align-items: center;
    width: 100%;
    opacity: 0.18;
    transition: opacity var(--dur-mid) var(--ease-editorial);
    user-select: none;
}

.about-values-nav-item:focus,
.about-values-nav-item:focus-visible,
.about-values-nav-item:active {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

.about-values-nav-item:hover {
    opacity: 0.45;
}

.about-values-nav-item.active {
    opacity: 1;
}

.about-values-nav-item .nav-item-text {
    font-family: var(--font-display);
    font-size: clamp(2.4rem, 4.8vw, 4.2rem);
    text-transform: uppercase;
    font-weight: var(--fw-medium);
    line-height: var(--lh-title);
    letter-spacing: var(--tracking-display);
    color: var(--c-dark);
    white-space: nowrap;
}
.about-values-right {
    position: relative;
    min-height: 240px;
    display: flex;
    align-items: center;
}

.about-values-panels-wrapper {
    position: relative;
    width: 100%;
    min-height: 200px;
}

.about-values-panel {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(calc(-50% + 14px));
    width: 100%;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.45s ease, transform 0.45s var(--ease-editorial);
}

.about-values-panel.active {
    opacity: 1;
    transform: translateY(-50%);
    pointer-events: auto;
}

.about-values-panel__desc {
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: clamp(1.12rem, 1.55vw, 1.35rem);
    line-height: var(--lh-copy);
    color: var(--c-text-muted);
    letter-spacing: var(--tracking-caption);
    max-width: 600px;
    margin: 0;
}
.about-lead-learn {
    position: relative;
    background-color: var(--c-dark-deep);
    color: var(--c-white);
    overflow: hidden;
    padding-top: clamp(140px, 16vh, 220px);
    padding-bottom: clamp(160px, 18vh, 240px);
}

.about-lead-learn__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.about-lead-learn__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    filter: contrast(1.3) saturate(1.3);
    pointer-events: none;
}

.about-lead-learn__overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(10, 10, 12, 0.85);
    mix-blend-mode: hard-light;
    pointer-events: none;
    z-index: 1;
}

@media (prefers-reduced-motion: reduce) {
    .about-lead-learn__video {
        display: none;
    }
}

.about-lead-learn__inner {
    width: 100%;
    max-width: var(--container-wide);
    margin: 0 auto;
    padding-left: var(--container-padding);
    padding-right: var(--container-padding);
    position: relative;
    z-index: 2;
}

.about-lead-learn__grid {
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    gap: clamp(40px, 6vw, 110px);
    align-items: center;
    justify-content: center;
}
.about-lead-learn__outro {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-top: clamp(220px, 30vh, 400px);
    margin-bottom: var(--space-block);
}

.about-lead-learn__quote-wrap {
    max-width: 1080px;
    margin: 0 auto clamp(36px, 5vh, 52px);
}

.about-lead-learn__quote {
    font-family: var(--font-display);
    font-size: var(--fs-quote);
    text-transform: uppercase;
    line-height: var(--lh-quote);
    letter-spacing: var(--tracking-body);
    font-weight: var(--fw-medium);
    margin: 0;
    padding: 0;
    text-wrap: balance;
    text-wrap: pretty;
}

.about-lead-learn__quote span {
    display: inline-block;
    transition: color var(--dur-fast) ease;
}
.about-lead-learn__quote .quote-char {
    display: inline;
    color: rgb(var(--rgb-white) / 0.14);
    will-change: color;
}
.about-lead-learn__links {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: clamp(28px, 4.5vw, 64px);
    flex-wrap: wrap;
    opacity: 0;
    transform: translateY(16px);
    will-change: opacity, transform;
    transition: opacity var(--dur-mid) var(--ease-editorial), transform var(--dur-mid) var(--ease-editorial);
}

.about-lead-learn__col-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.about-lead-learn__title-stage {
    position: relative;
    display: grid;
    place-items: center;
    width: clamp(200px, 18vw, 280px);
    margin: 0 auto;
}

.about-lead-learn__logo-wrap {
    grid-area: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(172px, 15.5vw, 230px);
    height: auto;
    pointer-events: none;
    user-select: none;
    will-change: transform, opacity, filter;
    z-index: 1;
}

.about-lead-learn__logo-svg {
    width: 100%;
    height: auto;
    display: block;
}

.section-title.about-lead-learn__title,
.about-lead-learn__title {
    grid-area: 1 / 1;
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-family: var(--font-display);
    font-size: var(--fs-hero-page);
    text-transform: uppercase;
    line-height: var(--lh-none);
    letter-spacing: var(--tracking-display);
    font-weight: var(--fw-medium);
    font-optical-sizing: auto;
    color: var(--c-white);
    margin: 0;
    user-select: none;
    will-change: transform, opacity, filter;
    opacity: 0;
    filter: blur(16px);
}

.about-lead-learn__title .title-line {
    display: block;
}

.about-lead-learn__title .title-line--dimmed {
    color: rgb(var(--rgb-white) / 0.22);
    font-weight: var(--fw-medium);
}

.about-lead-learn__col-content {
    max-width: 680px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.about-lead-learn__lead {
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: var(--fs-lead);
    line-height: var(--lh-copy);
    color: var(--c-white);
    letter-spacing: var(--tracking-display);
    margin: 0 0 20px;
    font-weight: var(--fw-regular);
    text-wrap: balance;
    text-wrap: pretty;
    will-change: transform, opacity, filter;
    opacity: 0;
    filter: blur(12px);
    transform: translateY(14px);
}

.about-lead-learn__desc {
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: clamp(0.95rem, 1.15vw, 1.05rem);
    line-height: var(--lh-copy);
    color: rgb(var(--rgb-white) / 0.68);
    letter-spacing: var(--tracking-caption);
    margin: 0;
    will-change: transform, opacity, filter;
    opacity: 0;
    filter: blur(10px);
    transform: translateY(12px);
}

.about-lead-learn__desc p {
    margin: 0;
    line-height: var(--lh-copy);
}

.about-lead-learn__action {
    display: flex;
    align-items: center;
    will-change: transform, opacity;
    opacity: 0;
    transform: translateY(10px);
}
.about-lead-learn .text-link,
.text-link--light {
    position: relative;
    display: inline-flex;
    align-items: center;
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    text-transform: uppercase;
    letter-spacing: var(--tracking-caption);
    font-size: var(--fs-link);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-title);
    color: var(--c-white) !important;
    text-decoration: none !important;
    padding-bottom: 2px;
    transition: color var(--dur-base) ease;
    cursor: pointer;
}

.about-lead-learn .text-link::before,
.text-link--light::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: rgb(var(--rgb-white) / 0.7) !important;
    transform-origin: left center;
    transition: width var(--dur-base) var(--ease-out), background-color var(--dur-base) ease;
}

.about-lead-learn .text-link::after,
.text-link--light::after {
    content: '';
    position: absolute;
    bottom: -2px;
    right: 0;
    width: 4px;
    height: 4px;
    border-top: 1px solid var(--c-white) !important;
    border-right: 1px solid var(--c-white) !important;
    transform: rotate(45deg) scale(0);
    transform-origin: center;
    opacity: 0;
    transition: transform var(--dur-base) var(--ease-out), right var(--dur-base) var(--ease-out), opacity var(--dur-base) ease;
    pointer-events: none;
}

.about-lead-learn .text-link:hover,
.text-link--light:hover {
    color: var(--c-white) !important;
}

.about-lead-learn .text-link:hover::before,
.text-link--light:hover::before {
    width: calc(100% + 12px) !important;
    background-color: var(--c-white) !important;
}

.about-lead-learn .text-link:hover::after,
.text-link--light:hover::after {
    right: -12px !important;
    transform: rotate(45deg) scale(1) !important;
    opacity: 1 !important;
}
@media (max-width: 1024px) {
    .about-timeline-sticky-frame {
        min-height: 100vh;
        min-height: 100dvh;
        height: 100dvh;
        padding: clamp(24px, 4vh, 48px) 0 clamp(20px, 3vh, 36px);
    }

    .about-timeline-stage {
        max-width: 920px;
        padding: 0 clamp(20px, 4vw, 36px);
    }

    .about-timeline-giant-year {
        font-size: clamp(4.5rem, 12vw, 8rem);
        margin: 0 0 clamp(16px, 2.5vh, 28px);
    }

    .about-timeline-headline {
        font-size: clamp(1.4rem, 3vw, 2rem);
        margin: 0 0 clamp(8px, 1.5vh, 14px);
    }

    .about-timeline-lead {
        font-size: clamp(1.18rem, 2.2vw, 1.35rem);
        margin: 0 auto clamp(20px, 3vh, 28px);
        max-width: none;
    }

    .about-timeline-bullets-group {
        gap: clamp(14px, 2.2vw, 24px);
    }

    .about-timeline-bullet p {
        font-size: clamp(0.95rem, 1.4vw, 1.02rem);
    }

    .about-values-stage {
        grid-template-columns: 1.15fr 1fr;
        gap: 36px;
    }

    .about-values-left {
        gap: clamp(12px, 1.8vw, 24px);
    }

    .about-values-fixed-indicator {
        gap: clamp(8px, 1vw, 12px);
    }

    .about-values-fixed-indicator .indicator-line {
        width: clamp(16px, 2vw, 24px);
    }

    .about-values-nav-item .nav-item-text {
        font-size: clamp(2rem, 3.8vw, 3rem);
    }
}

@media (max-width: 768px) {
    .about-hero-pinned,
    .about-values-pinned {
        max-width: 100vw;
        overflow: visible;
    }

    .about-lead-learn {
        max-width: 100vw;
        overflow-x: clip;
    }
    .about-hero-pinned {
        position: relative;
        height: 795vh;
    }

    .about-hero-sticky-frame {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        height: 100vh;
        height: 100dvh;
        min-height: 100dvh;
        width: 100%;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        box-sizing: border-box;
        background-color: var(--c-bg);
    }

    .about-hero-center-stage {
        position: relative;
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
        padding: 0 var(--container-padding);
        box-sizing: border-box;
        margin: 0 auto;
    }

    .about-hero-quote-block {
        grid-area: 1 / 1;
        position: relative;
        z-index: 3;
        width: 100%;
        max-width: 440px;
        margin: 0 auto;
        text-align: center;
        opacity: 1;
        filter: none;
        transform: none;
        pointer-events: auto;
    }

    .about-quote-mark {
        margin-bottom: 14px;
    }

    .about-quote-mark svg {
        width: 24px;
        height: 18px;
    }

    .about-blur-line {
        font-family: var(--font-display);
        font-size: var(--fs-title-m);
        line-height: var(--lh-title);
        letter-spacing: var(--tracking-body);
        color: var(--c-red);
    }

    .about-hero-story-block {
        grid-area: 1 / 1;
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        width: 100%;
        max-width: 480px;
        padding: 0 var(--container-padding);
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        opacity: 0;
        filter: blur(14px);
        pointer-events: none;
    }

    .about-story-statement {
        font-family: var(--font-display);
        font-size: clamp(1.25rem, 4.8vw, 1.6rem);
        line-height: var(--lh-quote);
        letter-spacing: var(--tracking-body);
        margin: 0 auto clamp(18px, 3vh, 26px);
        max-width: 100%;
        text-wrap: balance;
    }

    .about-story-desc {
        font-family: var(--font-primary);
        font-stretch: 112.5%;
        font-size: var(--fs-body-m);
        line-height: var(--lh-copy);
        color: var(--c-text-muted);
        letter-spacing: var(--tracking-caption);
        max-width: 100%;
        margin: 0 auto;
        opacity: 0;
        transform: translateY(10px);
        transition: opacity var(--dur-mid) ease, transform var(--dur-mid) ease;
    }

    .about-story-desc.is-visible {
        opacity: 1;
        transform: translateY(0);
    }
    .about-timeline-scroll-container {
        position: relative;
        height: 500vh;
    }

    .about-timeline-sticky-frame {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        height: 100vh;
        height: 100dvh;
        min-height: 100dvh;
        width: 100%;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        padding: clamp(20px, 3.5vh, 32px) 0 clamp(16px, 2.5vh, 24px);
        box-sizing: border-box;
    }
    .about-timeline-stage {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        width: 100%;
        max-width: 500px;
        margin: auto;
        padding: 0 clamp(16px, 4.5vw, 28px);
        box-sizing: border-box;
        gap: 0;
    }

    .about-timeline-giant-year {
        font-family: var(--font-display);
        font-size: clamp(4.4rem, 16vw, 6.2rem);
        line-height: 0.90;
        letter-spacing: -2px;
        color: var(--c-red);
        font-weight: var(--fw-medium);
        margin: 0 0 clamp(10px, 1.8vh, 18px);
        user-select: none;
        will-change: transform, opacity, filter;
    }

    .about-timeline-headline {
        font-family: var(--font-display);
        text-transform: uppercase;
        font-size: clamp(1.6rem, 5vw, 2.1rem);
        font-weight: var(--fw-medium);
        line-height: var(--lh-title);
        letter-spacing: var(--tracking-body);
        color: var(--c-dark);
        margin: 0 0 clamp(8px, 1.2vh, 12px);
        padding: 0 4px;
        text-wrap: balance;
        text-wrap: pretty;
        will-change: transform, opacity, filter;
    }

    .about-timeline-lead {
        font-family: var(--font-primary);
        font-stretch: 112.5%;
        font-size: clamp(1.05rem, 3.4vw, 1.18rem);
        line-height: 1.45;
        color: var(--c-text-dark);
        letter-spacing: -0.4px;
        font-weight: var(--fw-regular);
        min-height: 4.4em;
        margin: 0 auto clamp(14px, 2.2vh, 22px);
        max-width: none;
        padding: 0 4px;
        text-wrap: balance;
        text-wrap: pretty;
        will-change: transform, opacity, filter;
    }

    .about-timeline-bullets-wrapper {
        width: 100%;
        max-width: 480px;
        min-height: clamp(120px, 18vh, 155px);
        display: flex;
        align-items: flex-start;
        justify-content: center;
    }

    .about-timeline-bullets-group {
        display: none;
        width: 100%;
        flex-direction: column;
        gap: clamp(8px, 1.4vh, 12px);
        padding: 0;
    }

    .about-timeline-bullets-group.active {
        display: flex;
    }

    .about-timeline-bullet {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        text-align: left;
        will-change: transform, opacity, filter;
    }

    .about-timeline-bullet .bullet-dot {
        width: 4px;
        height: 4px;
        border-radius: var(--radius-round);
        background-color: var(--c-red);
        margin-top: 7px;
        flex-shrink: 0;
    }

    .about-timeline-bullet p {
        font-family: var(--font-primary);
        font-stretch: 112.5%;
        font-size: clamp(0.92rem, 3vw, 1rem);
        line-height: var(--lh-copy);
        color: var(--c-text-muted);
        margin: 0;
        letter-spacing: var(--tracking-caption);
    }
    .about-timeline-ruler-wrap {
        width: 100%;
        max-width: var(--container-wide);
        padding: 0 clamp(24px, 7vw, 36px) 6px;
        overflow: visible;
        box-sizing: border-box;
    }

    .about-ruler-years {
        position: relative;
        height: 18px;
        width: 100%;
        margin-bottom: 2px;
    }

    .about-ruler-year-btn {
        position: absolute;
        bottom: 0;
        transform: translateX(-50%);
        background: none;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        -webkit-tap-highlight-color: transparent;
        user-select: none;
        cursor: pointer;
        font-family: var(--font-display);
        font-size: clamp(0.72rem, 2.4vw, 0.82rem);
        letter-spacing: var(--tracking-caption);
        color: rgb(var(--rgb-ink) / 0.35);
        padding: 0;
        line-height: var(--lh-none);
        white-space: nowrap;
        transition: color var(--dur-base) ease;
    }

    .about-ruler-year-btn:focus,
    .about-ruler-year-btn:focus-visible,
    .about-ruler-year-btn:active {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    .about-ruler-year-btn.active {
        color: var(--c-red);
    }

    .about-ruler-year-btn.is-vision .ruler-vision-star {
        position: absolute;
        top: -9px;
        left: 50%;
        transform: translateX(-50%);
        font-size: var(--fs-caption);
    }

    .about-ruler-track {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        height: 28px;
        width: 100%;
        padding: 0;
        cursor: pointer;
    }

    .ruler-tick {
        width: 1px;
        height: 10px;
        transition: none;
    }
    .about-values-pinned {
        position: relative;
        height: 420vh;
        background-color: var(--c-bg);
    }

    .about-values-sticky-frame {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        height: 100vh;
        height: 100dvh;
        min-height: 100dvh;
        width: 100%;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        box-sizing: border-box;
        background-color: var(--c-bg);
    }

    .about-values-stage {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        width: 100%;
        max-width: 480px;
        height: 100%;
        padding: clamp(24px, 4vh, 44px) clamp(24px, 6vw, 36px);
        gap: clamp(34px, 5.2vh, 52px);
        box-sizing: border-box;
    }

    .about-values-left {
        width: 100%;
        display: flex;
        align-items: center;
        gap: clamp(8px, 2.2vw, 14px);
    }

    .about-values-fixed-indicator {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        flex-shrink: 0;
    }

    .about-values-fixed-indicator .indicator-eyebrow {
        font-size: var(--fs-label);
        letter-spacing: var(--tracking-wide);
    }

    .about-values-fixed-indicator .indicator-line {
        width: 12px;
        height: 1.5px;
    }

    .about-values-nav-viewport {
        position: relative;
        height: clamp(160px, 22vh, 185px);
        flex: 1;
        min-width: 0;
        overflow: hidden;
        mask-image: linear-gradient(to bottom, transparent 0%, black 20%, black 80%, transparent 100%);
        -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 20%, black 80%, transparent 100%);
        display: flex;
        align-items: center;
    }

    .about-values-nav-track {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: clamp(14px, 2.2vh, 20px);
        transition: transform var(--dur-mid) var(--ease-editorial);
        will-change: transform;
    }

    .about-values-nav-item {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        height: 46px;
        padding: 0;
        background: transparent;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        -webkit-tap-highlight-color: transparent;
        text-align: left;
        cursor: pointer;
        opacity: 0.18;
        transition: opacity var(--dur-mid) ease;
        user-select: none;
        width: 100%;
    }

    .about-values-nav-item:focus,
    .about-values-nav-item:focus-visible,
    .about-values-nav-item:active {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    .about-values-nav-item.active {
        opacity: 1;
    }

    .about-values-nav-item .nav-item-text {
        font-family: var(--font-display);
        font-size: clamp(1.6rem, 5vw, 2.1rem);
        line-height: 1.12;
        letter-spacing: var(--tracking-body);
        text-transform: uppercase;
        color: var(--c-dark);
        font-weight: var(--fw-medium);
        white-space: nowrap;
    }

    .about-values-right {
        position: relative;
        width: 100%;
        min-height: 145px;
    }

    .about-values-panels-wrapper {
        position: relative;
        width: 100%;
        min-height: 145px;
    }

    .about-values-panel {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        opacity: 0;
        transform: translateY(8px);
        pointer-events: none;
        transition: opacity var(--dur-mid) ease, transform var(--dur-mid) var(--ease-editorial);
    }

    .about-values-panel.active {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

    .about-values-panel__desc {
        font-family: var(--font-primary);
        font-stretch: 112.5%;
        font-size: var(--fs-body-m);
        line-height: var(--lh-copy);
        color: var(--c-text-muted);
        letter-spacing: var(--tracking-caption);
        margin: 0;
    }
    .about-hero-connector {
        top: 0;
        transform: translate(-50%, -50%);
        height: clamp(120px, 16.8vh, 192px);
    }
    .about-lead-learn {
        height: auto;
        min-height: auto;
        padding: clamp(90px, 12vh, 140px) 0;
    }

    .about-lead-learn__inner {
        padding-left: var(--container-padding);
        padding-right: var(--container-padding);
    }

    .about-lead-learn__outro {
        margin-top: clamp(90px, 12vh, 140px);
        margin-bottom: var(--space-block-sm);
    }

    .about-lead-learn__quote-wrap {
        margin-bottom: 24px;
    }

    .about-lead-learn__quote {
        font-size: clamp(1.25rem, 4.8vw, 1.6rem);
        line-height: var(--lh-quote);
        letter-spacing: var(--tracking-body);
    }

    .about-lead-learn__links {
        flex-direction: row;
        justify-content: center;
        width: 100%;
        gap: clamp(24px, 6vw, 40px);
    }

    .about-lead-learn__grid {
        grid-template-columns: 1fr;
        gap: clamp(20px, 3.5vh, 32px);
        align-items: center;
    }

    .about-lead-learn__col-title {
        align-items: center;
    }

    .about-lead-learn__title-stage {
        width: 100%;
        max-width: 260px;
        min-height: 120px;
    }

    .about-lead-learn__logo-wrap {
        width: clamp(140px, 38vw, 180px);
    }

    .section-title.about-lead-learn__title,
    .about-lead-learn__title {
        font-size: var(--fs-title-m);
        line-height: var(--lh-none);
    }

    .about-lead-learn__col-content {
        max-width: 100%;
        text-align: center;
    }

    .about-lead-learn__lead {
        font-size: clamp(1.12rem, 3.8vw, 1.28rem);
        line-height: var(--lh-copy);
        letter-spacing: var(--tracking-body);
        margin-bottom: 14px;
        text-align: center;
    }

    .about-lead-learn__desc,
    .about-lead-learn__desc p {
        font-size: var(--fs-body-m);
        line-height: var(--lh-copy);
        letter-spacing: var(--tracking-caption);
        margin-bottom: 24px;
        text-align: center;
    }
}
.about-values-sticky-frame {
    background-color: var(--c-dark);
}

.about-values-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    background-color: var(--c-dark);
}

.about-values-bg__layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 103%;
    opacity: 0;
    transition: opacity 1.1s var(--ease-standard);
    will-change: opacity, transform;
    transform: translate3d(0, calc(var(--values-drift, 0) * -3%), 0);
}

.about-values-bg__layer.active {
    opacity: 1;
}

.about-values-bg__layer img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.about-values-bg__scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgb(var(--rgb-ink) / 0.18) 0%, rgb(var(--rgb-ink) / 0) 22%, rgb(var(--rgb-ink) / 0) 78%, rgb(var(--rgb-ink) / 0.18) 100%);
}

.about-values-stage {
    position: relative;
    z-index: 1;
}
.about-values-nav-item .nav-item-text {
    color: var(--c-bg);
}

.about-values-panel__desc {
    color: var(--c-white);
    opacity: 1;
}

.about-values-panel.active .about-values-panel__desc {
    color: var(--c-white);
    opacity: 1;
}

.about-values-fixed-indicator .indicator-eyebrow {
    color: var(--c-red);
}

.about-values-fixed-indicator .indicator-line {
    background-color: var(--c-red);
}

@media (prefers-reduced-motion: reduce) {
    .about-values-bg__layer {
        transform: none;
    }
}

.about-team {
    position: relative;
    background-color: var(--c-white);
    overflow-x: clip;
    padding-top: var(--space-section);
    padding-bottom: var(--space-section);
}

.about-team__inner {
    display: grid;
    grid-template-columns: minmax(190px, 0.9fr) minmax(0, 3.1fr);
    grid-template-areas:
        ". head" "count stage" "bio info";
    column-gap: clamp(32px, 5vw, 90px);
    padding-left: var(--container-padding);
    padding-right: var(--container-padding);
}

.about-team__head { grid-area: head; }
.about-team__count { grid-area: count; }
.about-team__stage { grid-area: stage; }
.about-team__info { grid-area: info; }
.about-team__bio { grid-area: bio; }

.about-team__title {
    margin-bottom: clamp(14px, 1.6vw, 22px);
}

.about-team__lead {
    max-width: 640px;
    margin: 0;
    text-wrap: balance;
    text-wrap: pretty;
}

.about-team__count {
    align-self: start;
    margin: clamp(28px, 4vh, 48px) 0 0;
    font-family: var(--font-primary);
    font-stretch: 112.5%;
    font-size: var(--fs-caption);
    letter-spacing: var(--tracking-caps);
    color: var(--c-text-light);
    font-variant-numeric: tabular-nums;
}

.about-team__count-now {
    color: var(--c-red);
}

.about-team__stage {
    margin-top: clamp(28px, 4vh, 48px);
    min-width: 0;
}

.about-team__viewport {
    position: relative;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right, var(--c-black) 0, var(--c-black) 56%, transparent 100%);
    mask-image: linear-gradient(to right, var(--c-black) 0, var(--c-black) 56%, transparent 100%);
    touch-action: pan-y;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    outline: none;
}

.about-team__viewport.is-dragging {
    cursor: grabbing;
}

.about-team__viewport:focus-visible {
    outline: 2px solid var(--c-red);
    outline-offset: 8px;
}

.about-team.is-solo .about-team__viewport {
    cursor: default;
    -webkit-mask-image: none;
    mask-image: none;
}

.about-team.is-solo .about-team__count {
    visibility: hidden;
}

.about-team__track {
    position: relative;
    height: var(--team-h, 420px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.about-team__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: var(--team-wa, 300px);
    will-change: transform;
}

.about-team__card {
    position: relative;
    display: block;
    width: 100%;
    height: var(--team-h, 420px);
    padding: 0;
    border: 0;
    background: none;
    overflow: hidden;
    cursor: inherit;
    -webkit-tap-highlight-color: transparent;
}

.about-team__card:focus-visible {
    outline: 2px solid var(--c-red);
    outline-offset: 4px;
}

.about-team__sketch,
.about-team__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 16%;
    pointer-events: none;
}

.about-team__photo {
    opacity: 0;
}

.about-team__card.is-active .about-team__photo {
    opacity: 1;
}

.about-team__info,
.about-team__bio {
    display: grid;
    margin-top: clamp(24px, 3.4vh, 40px);
}

.about-team__person,
.about-team__bio-item {
    grid-area: 1 / 1;
}

.about-team__name {
    margin: 0 0 0.45rem;
}

.about-team__role {
    margin: 0;
    color: var(--c-text-muted);
}

.about-team__bio-item {
    margin: 0;
    max-width: 340px;
    color: var(--c-text-muted);
    text-wrap: pretty;
}

@media (min-width: 900px) {
    .about-team__bio {
        position: relative;
        contain: size;
        align-self: stretch;
    }

    .about-team__bio-item {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
    }
}

.about-team.is-js .about-team__person,
.about-team.is-js .about-team__bio-item {
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity var(--dur-mid) ease, transform var(--dur-mid) var(--ease-editorial), visibility 0s linear var(--dur-mid);
}

.about-team.is-js .about-team__person.is-active,
.about-team.is-js .about-team__bio-item.is-active {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition-delay: 0.12s, 0.12s, 0s;
}

.about-team.is-js .about-team__head,
.about-team.is-js .about-team__stage,
.about-team.is-js .about-team__count {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.9s ease, transform 1s var(--ease-editorial);
}

.about-team.is-js .about-team__stage { transition-delay: 0.12s; }

.about-team.is-js.is-in .about-team__head,
.about-team.is-js.is-in .about-team__stage,
.about-team.is-js.is-in .about-team__count {
    opacity: 1;
    transform: none;
}

@media (max-width: 899px) {
    .about-team__inner {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "head" "count" "stage" "info" "bio";
    }

    .about-team__head { text-align: right; }
    .about-team__lead { margin-left: auto; }
    .about-team__count { margin-top: 28px; }
    .about-team__stage { margin-top: 18px; }
    .about-team__bio-item { max-width: 520px; }
}

@media (prefers-reduced-motion: reduce) {
    .about-team.is-js .about-team__head,
    .about-team.is-js .about-team__stage,
    .about-team.is-js .about-team__count,
    .about-team.is-js .about-team__person,
    .about-team.is-js .about-team__bio-item {
        transition: none;
    }
}

@media (max-width: 768px) {
    .about-story-statement,
    .about-lead-learn__quote {
        font-size: var(--fs-subtitle-sm-m);
    }

    .about-values-bg__scrim {
        background: linear-gradient(180deg, rgb(var(--rgb-ink) / 0.3) 0%, rgb(var(--rgb-ink) / 0.2) 28%, rgb(var(--rgb-ink) / 0.66) 50%, rgb(var(--rgb-ink) / 0.66) 80%, rgb(var(--rgb-ink) / 0.4) 100%);
    }

    .about-values-panel__desc,
    .about-values-nav-item .nav-item-text {
        text-shadow: 0 1px 14px rgb(var(--rgb-ink) / 0.6);
    }
}