/* About page */

.ab-blobs .b1{position:absolute;width:60vw;height:60vw;left:-20vw;bottom:-25vw;border-radius:50%;background:radial-gradient(circle,#12363e 0%,transparent 65%);filter:blur(70px);animation:flowA 15s ease-in-out infinite}
.ab-blobs .b2{position:absolute;width:50vw;height:50vw;right:-15vw;top:-18vw;border-radius:50%;background:radial-gradient(circle,#0f3038 0%,transparent 65%);filter:blur(80px);animation:flowB 19s ease-in-out infinite}

.ab-hero{position:relative;z-index:1;padding:22vh 44px 80px;max-width:1400px;margin:0 auto;box-sizing:border-box}
.ab-hero h1{font-size:clamp(40px,5.2vw,84px);font-weight:800;letter-spacing:-.02em;line-height:1.04;margin:0;max-width:1100px;text-wrap:pretty}

.studio-grid{position:relative;z-index:1;padding:0 44px 100px;max-width:1400px;margin:0 auto;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:60px}
.studio-photo{position:relative;min-height:540px;min-width:0;overflow:hidden}
.studio-copy{display:flex;flex-direction:column;gap:36px;justify-content:center}
.studio-copy p{font-size:19px;line-height:1.7;font-weight:300;color:rgba(238,243,242,.8);margin:0;text-wrap:pretty}
.studio-stats{display:flex;gap:48px;border-top:1px solid rgba(238,243,242,.15);padding-top:32px}
.studio-stats .n{font-size:44px;font-weight:800}
.studio-stats .n .plus{color:#8fd0cf}
.studio-stats .l{font-family:Jost,sans-serif;font-size:11px;letter-spacing:.28em;color:rgba(238,243,242,.5);margin-top:6px}

.pad{position:relative;z-index:1;padding:0 44px 120px;max-width:1400px;margin:0 auto;box-sizing:border-box}
.section-kicker{font-family:Jost,sans-serif;font-size:12px;letter-spacing:.4em;color:#8fd0cf;margin:0 0 48px}

.vals{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid rgba(238,243,242,.14)}
.vals > div{padding:40px 36px;border-right:1px solid rgba(238,243,242,.14)}
.vals > div:last-child{border-right:none}
.vals .num{font-family:Jost,sans-serif;font-size:11px;letter-spacing:.3em;color:rgba(238,243,242,.45)}
.vals h3{font-size:22px;font-weight:700;margin:18px 0 14px}
.vals p{font-size:14px;line-height:1.65;font-weight:300;color:rgba(238,243,242,.6);margin:0}

.cols2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px}
.lead{display:flex;gap:32px;border:1px solid rgba(238,243,242,.14);padding:40px;min-width:0}
.lead .photo{width:120px;height:120px;flex:none;border-radius:50%;overflow:hidden}
.lead h3{font-size:24px;font-weight:700;margin:0}
.lead .role{font-family:Jost,sans-serif;font-size:11px;letter-spacing:.28em;color:#8fd0cf;margin:8px 0 16px}
.lead .bio{font-size:14px;line-height:1.65;font-weight:300;color:rgba(238,243,242,.65);margin:0}

.phases{border-top:1px solid rgba(238,243,242,.14)}
.phase{border-bottom:1px solid rgba(238,243,242,.14)}
.phase-head{display:flex;align-items:baseline;gap:36px;padding:34px 0;cursor:pointer;background:none;border:none;width:100%;text-align:left;color:inherit}
.phase-head .num{font-family:Jost,sans-serif;font-size:13px;letter-spacing:.2em;color:rgba(238,243,242,.4);flex:none;width:44px;transition:color .4s}
.phase-head h3{font-size:clamp(30px,4vw,60px);font-weight:800;letter-spacing:-.02em;line-height:1;margin:0;flex:1;color:rgba(238,243,242,.45);transition:color .4s}
.phase-head .icon{font-size:26px;font-weight:300;color:#8fd0cf;flex:none;transition:transform .4s}
.phase-body{overflow:hidden;max-height:0;opacity:0;transition:max-height .5s cubic-bezier(.16,1,.3,1),opacity .5s}
.phase-body p{font-size:17px;line-height:1.7;font-weight:300;color:rgba(238,243,242,.7);margin:0;padding:0 0 40px 80px;max-width:720px;text-wrap:pretty}
.phase.open .phase-head .num{color:#8fd0cf}
.phase.open .phase-head h3{color:#eef3f2}
.phase.open .phase-head .icon{transform:rotate(45deg)}
.phase.open .phase-body{max-height:340px;opacity:1}

.ventures > div{border:1px solid rgba(238,243,242,.14);padding:48px 44px}
.ventures .wordmark{font-family:Jost,sans-serif;font-size:20px;letter-spacing:.3em;font-weight:400}
.ventures .wordmark i{font-style:italic;font-weight:200;text-transform:lowercase;letter-spacing:.05em}
.ventures .wordmark small{font-weight:200;font-size:12px;letter-spacing:.34em;color:rgba(238,243,242,.55)}
.ventures p{font-size:15px;line-height:1.65;font-weight:300;color:rgba(238,243,242,.6);margin:22px 0 0;max-width:420px}

.client-marquee{position:relative;z-index:1;border-top:1px solid rgba(238,243,242,.12);border-bottom:1px solid rgba(238,243,242,.12);overflow:hidden;padding:26px 0}
.client-marquee .track{display:flex;width:max-content;animation:marq 45s linear infinite;white-space:nowrap;font-family:Jost,sans-serif;font-weight:200;font-size:16px;letter-spacing:.3em;color:rgba(238,243,242,.45)}

.big-cta{position:relative;z-index:1;padding:140px 44px;text-align:center}
.big-cta a{display:inline-block;font-size:clamp(40px,6vw,96px);font-weight:800;letter-spacing:-.02em;line-height:1.05}
.big-cta a:hover{color:#8fd0cf}

@media (max-width:1024px){.vals{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  .studio-grid,.cols2{grid-template-columns:1fr!important;gap:36px!important}
  .vals{grid-template-columns:1fr!important}
  .lead{flex-direction:column;text-align:center;align-items:center}
  .studio-stats{gap:28px;flex-wrap:wrap}
  .pad{padding-left:24px;padding-right:24px}
}
