body[data-page="about"]{background:#0e0f11;color:#91939d;padding-top:0}body[data-page="about"] main{padding:72px 0 0;max-width:none;margin:0}.about-surface{background:#0e0f11;position:relative;z-index:1;display:flow-root}.about-container{width:calc(100% - 48px);max-width:960px;margin:0 auto;display:grid;grid-template-columns:380px minmax(0,500px);gap:80px;font-family:Inter,sans-serif}.about-intro{padding:64px 0 96px}.about-person{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}.about-person p{font-size:14px;line-height:21px;margin:0 0 24px}.about-person span,.about-person a{color:#e3e5f1;text-decoration:none}.about-person img{width:120px;height:120px;border-radius:50%;object-fit:cover}.about-bio h1{font-size:24px;line-height:28px;font-weight:500;letter-spacing:-.48px;color:#e3e5f1;margin:0 0 20px;text-transform:none}.about-bio p,.job-description p{font-size:14px;line-height:20px;letter-spacing:.16px;margin:0 0 20px}.about-bio p:last-child,.job-description p:last-child{margin-bottom:0}.about-experience{border-top:1px solid #34363c;padding:64px 0 80px}.about-experience h2{font-size:14px;line-height:21px;font-weight:400;margin:0}.about-jobs{display:flex;flex-direction:column;gap:80px}.job-logo,.job-logo img,.okx-mark{width:48px;height:48px}.job-logo{border-radius:8px;overflow:hidden;margin-bottom:16px}.job-logo.ender{background:#56e3ff}.job-logo:not(.hawl):not(.ender){background:#fff}.job-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}.job-heading h3{font-size:16px;line-height:26px;font-weight:500;margin:0;color:#91939d}.job-heading p{font-size:14px;line-height:21px;color:#e3e5f1;margin:0}.job-heading time{font-size:14px;line-height:21px;white-space:nowrap}.job-description{padding-top:24px}.okx-mark{position:relative}.okx-mark i{position:absolute;width:10px;height:10px;background:#000}.about-shared{padding-top:40px}.about-shared .wrap{max-width:960px}.about-shared .collaboration{padding-bottom:96px} @media(max-width:1008px){.about-container{grid-template-columns:minmax(180px,380px) minmax(0,500px);gap:40px}}@media(max-width:650px){.about-container{grid-template-columns:1fr;gap:40px;width:calc(100% - 40px)}.about-intro{padding:48px 0 64px}.about-person{flex-direction:row;gap:20px}.about-person img{width:96px;height:96px}.about-experience{padding:40px 0 64px}.about-jobs{gap:48px}.job-heading{align-items:flex-start;flex-wrap:wrap}.about-bio h1{font-size:24px;line-height:28px}}
.about-brands{display:flex;gap:32px;overflow:hidden;align-items:center;justify-content:center;padding:32px 0}.about-brands img{width:96px;height:40px;object-fit:contain;flex-shrink:0;opacity:.65}.about-principles .fit-heading h2{font-size:40px;line-height:44px;letter-spacing:-.4px}.about-principles .fit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}.about-principles .fit-card h3{font-size:16px;line-height:24px;letter-spacing:-.54px}.about-principles .fit-category-icon{width:24px;height:24px}.about-principles .fit-card p,.about-principles .fit-heading>p{font-size:14px;line-height:21px}.about-principles{padding-bottom:80px!important}.about-shared .client-reviews{padding-top:64px}
/* Match the Figma palette explicitly instead of inheriting legacy page colors. */
.about-person p,.about-bio p,.job-description p,.about-experience h2,.job-heading time{color:#91939d}.about-person span,.about-person a,.about-bio h1,.job-heading p{color:#e3e5f1}.about-experience{align-items:start;overflow:visible}.about-experience>h2{position:sticky;top:112px;align-self:start}.about-brands{display:block;max-width:none;width:100%;padding:0;opacity:1}.about-shared{padding-top:0}.about-shared .wrap{width:calc(100% - 64px);margin-inline:auto}.about-shared .client-reviews{padding:96px 0;color:#e3e5f1}.about-shared .reviews-heading h2{color:#e3e5f1}.about-shared .reviews-heading em{color:rgba(255,255,255,.5)}.about-person,.about-bio,.about-experience{font-feature-settings:'calt' 0,'liga' 0}.about-principles .fit-social-proof p{color:#91939d}@media(max-width:680px){.about-shared .wrap{width:calc(100% - 40px)}.about-shared .client-reviews{padding:64px 0}.about-experience>h2{z-index:2;background:#0e0f11;padding:12px 0;top:88px;grid-row:1}.about-experience{display:block}.about-jobs{margin-top:28px}}
/* About principles, Figma 598:30736. */
.updated-hawl .about-principles{display:grid;grid-template-columns:minmax(0,500px) minmax(0,380px);gap:80px;padding:96px 0!important;border-top:1px solid #36363c;align-items:start;}
.updated-hawl .about-principles .fit-heading{grid-column:2;grid-row:1;}
.updated-hawl .about-principles .fit-grid{grid-column:1;grid-row:1;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px;}
.updated-hawl .about-principles .fit-heading h2{font:500 40px/44px Inter,Arial,sans-serif;letter-spacing:-.4px;color:#e3e5f1;}
.updated-hawl .about-principles .fit-heading h2 span{color:rgba(227,229,241,.5);}
.updated-hawl .about-principles .fit-heading>p{padding:0;margin:20px 0 0;font:400 14px/21px Inter,Arial,sans-serif;color:#91939d;max-width:none;}
.updated-hawl .about-principles .fit-card{display:flex;flex-direction:column;gap:8px;}
.updated-hawl .about-principles .fit-card>.fit-category-icon{width:24px;height:24px;margin:0;filter:none;}
.updated-hawl .about-principles .fit-card h3{font:500 16px/24px Inter,Arial,sans-serif;letter-spacing:-.54px;color:#e3e5f1;margin:0;}
.updated-hawl .about-principles .fit-card p{font:400 14px/21px Inter,Arial,sans-serif;color:#91939d;margin:0;letter-spacing:0;}
.updated-hawl .about-principles .fit-social-proof{margin:32px 0 0;padding:0;gap:16px;align-items:start;}
.updated-hawl .about-principles .fit-customer-photos img{width:24px;height:24px;flex:0 0 24px;border:3px solid #0e0f11;border-radius:50%;box-sizing:border-box;object-fit:cover;margin:0 -2px 0 0;}
.updated-hawl .about-principles .fit-social-proof p{font:400 14px/21px Inter,Arial,sans-serif;margin:0;color:#91939d;white-space:nowrap;}
@media(max-width:1000px){.updated-hawl .about-principles{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;}}
@media(max-width:760px){.updated-hawl .about-principles{grid-template-columns:1fr;padding:64px 0!important;gap:40px;}.updated-hawl .about-principles .fit-heading{grid-column:1;grid-row:1;}.updated-hawl .about-principles .fit-grid{grid-column:1;grid-row:2;}}
@media(max-width:440px){.updated-hawl .about-principles .fit-grid{grid-template-columns:1fr;}}
.updated-hawl .about-principles .fit-heading{gap:0;}
.updated-hawl .about-principles .fit-customer-photos{display:flex;gap:0;align-items:flex-start;}
.updated-hawl .about-principles .about-avatar{position:relative;display:block;flex:0 0 24px;width:24px;height:24px;border:3px solid #0e0f11;border-radius:50%;margin-right:-2px;background:#ffc0c5;overflow:hidden;}
.updated-hawl .about-principles .about-avatar:last-child{margin-right:0;}
.updated-hawl .about-principles .fit-customer-photos .about-avatar img{position:absolute;inset:0;width:18px;height:18px;max-width:none;margin:0;border:0;border-radius:50%;object-fit:cover;}
.updated-hawl .about-principles .fit-customer-photos .about-avatar:first-child img{width:143.33%;height:215%;left:-18.72%;top:-16.15%;object-fit:fill;border-radius:0;}

.about-bio h1{color:#e3e5f1!important}.about-bio h1 span{color:rgba(227,229,241,.5)}

.about-job .job-logo.metafy{background:#000;border-radius:8px}

/* Match the homepage customer photos exactly. */
.updated-hawl .about-principles .fit-customer-photos{display:flex;align-items:center;gap:0;opacity:1;filter:none;isolation:isolate;}
.updated-hawl .about-principles .fit-customer-photos img{position:static;width:30px;height:30px;flex:0 0 30px;max-width:none;margin:0;border:0;border-radius:50%;object-fit:cover;box-shadow:none;opacity:1;filter:none;}
.updated-hawl .about-principles .fit-customer-photos img+img{margin-left:-8px;}
.updated-hawl .about-principles .fit-social-proof{align-items:center;gap:16px;}

body[data-page="about"] .updated-hawl .editorial-start:hover,body[data-page="about"] .updated-hawl .editorial-start:focus-visible{color:#0e0f11;}
/* Scroll-driven portrait with the supplied photographs as exact endpoints. */
.about-scroll-portrait{position:relative;width:120px;height:120px;flex:none;border-radius:50%;overflow:hidden;isolation:isolate;background:#f32b00;--eye-glow:0;}
.about-person .about-scroll-portrait .portrait-original,.about-person .about-scroll-portrait .portrait-final{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:0;}
.portrait-turn-frame:first-of-type{opacity:1;background-position:0% 0%;}
.portrait-final{z-index:2;opacity:0;pointer-events:none;}
.portrait-turn-frame{position:absolute;inset:0;background-image:url('/assets/figma/about/portrait-turn-atlas-v2.png');background-repeat:no-repeat;background-size:400% 400%;opacity:0;pointer-events:none;will-change:opacity;}
.portrait-eye-glow{position:absolute;z-index:3;inset:0;opacity:var(--eye-glow);pointer-events:none;}
.portrait-eye-glow i{position:absolute;top:46%;width:3.3%;height:1.5%;border-radius:50%;background:#fff;box-shadow:0 0 1px 1px #fff,0 0 4px 1.5px #ffffffbd,0 0 8px 3px #ffffff52;transform:translate(-50%,-50%);}
.portrait-eye-glow i:first-child{left:41%;}.portrait-eye-glow i:last-child{left:60.6%;}
@media(max-width:650px){.about-scroll-portrait{width:96px;height:96px;}}
@media(prefers-reduced-motion:reduce){.portrait-turn-frame:nth-of-type(2),.portrait-eye-glow,.about-person .about-scroll-portrait .portrait-final{display:none;}.portrait-turn-frame:first-of-type{opacity:1!important;background-position:0% 0%!important;}}

@media(max-width:680px){
 .about-experience>h2{position:static;top:auto;z-index:auto;padding:0;background:transparent;}
}

/* About phone layout, Figma 615:32908. */
@media(max-width:680px){
 body[data-page="about"] main{padding-top:0;}
 .about-container{width:calc(100% - 48px);grid-template-columns:1fr;}
 .about-intro{padding:40px 0;gap:80px;}
 .about-person{flex-direction:row;gap:20px;}
 .about-scroll-portrait{width:96px;height:96px;}
 .about-person p:last-child{margin-bottom:0;}
 .about-experience{padding:40px 0;display:block;}
 .about-jobs{margin-top:40px;gap:40px;}
 .about-shared .about-principles.wrap{width:calc(100% - 48px);padding:40px 0!important;}
}