.portfolio-page{--portfolio-ink:#23384a;--portfolio-muted:#4b6070}.portfolio-page p{color:var(--portfolio-muted);line-height:1.8}.portfolio-page a:focus-visible{outline-offset:5px;border-radius:6px;outline:3px solid #5a19be}.portfolio-hero{isolation:isolate;background:linear-gradient(#b3c3da,#93a5be);border-radius:20px;max-width:1440px;margin:16px auto 0;padding:132px 0 56px;position:relative;overflow:hidden}.portfolio-hero-pattern{z-index:-1;object-fit:cover;opacity:.45;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.portfolio-breadcrumbs{color:#2c4155;margin-bottom:40px;font-size:13px}.portfolio-breadcrumbs ol{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.portfolio-breadcrumbs li+li:before{content:"/";opacity:.55;padding-right:10px}.portfolio-breadcrumbs a:hover{text-underline-offset:4px;text-decoration:underline}.portfolio-intro{grid-template-columns:1.2fr 1fr;align-items:center;gap:64px;display:grid}.portfolio-intro h1{letter-spacing:-.045em;margin-top:24px;font-size:clamp(36px,4.7vw,64px)}.portfolio-title-soft{color:#344f68}.portfolio-intro-copy{max-width:475px}.portfolio-intro-copy p{color:#2c4155;margin-bottom:20px}.portfolio-intro-copy .btn{margin-top:8px}.portfolio-project-nav{border-top:1px solid #ffffff70;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:56px;display:grid}.portfolio-project-nav a{padding:25px 24px;transition:background .25s}.portfolio-project-nav a:first-child{padding-left:0}.portfolio-project-nav a+a{border-left:1px solid #ffffff70}.portfolio-project-nav a:nth-child(3n+1){border-left:0;padding-left:0}.portfolio-project-nav a:nth-child(n+4){border-top:1px solid #ffffff70}.portfolio-project-nav a:last-child:nth-child(3n+1){grid-column:1/-1}.portfolio-project-nav a:hover{background:#ffffff25}.portfolio-project-nav strong{justify-content:space-between;gap:16px;margin-top:12px;font-size:20px;font-weight:550;display:flex}.portfolio-project-nav .project-eyebrow{color:#2c4155}.portfolio-section{padding-top:100px;padding-bottom:100px}.portfolio-section-heading{justify-content:space-between;align-items:end;gap:40px;margin-bottom:44px;display:flex}.portfolio-section-heading h2{letter-spacing:-.035em;max-width:760px;margin-top:20px}.portfolio-section-heading>p{max-width:350px}.project-list{gap:32px;display:grid}.project-card{border:1px solid var(--color-stroke-1);background:#fff;border-radius:30px;grid-template-columns:1fr 1fr;display:grid;overflow:hidden}.project-card-copy{align-self:center;padding:clamp(28px,3.5vw,52px)}.project-card-heading{justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;display:flex}.project-eyebrow{text-transform:uppercase;letter-spacing:.1em;color:#4d6477;font-size:11px;font-weight:650;line-height:1.6}.project-index{color:#8ba0af;font-size:22px;font-weight:500}.project-card h3{letter-spacing:-.035em;font-size:clamp(28px,3vw,38px);line-height:1.2}.project-card .project-role{color:#334e63;margin:12px 0 20px;font-size:13px;font-weight:600}.project-tags{flex-wrap:wrap;gap:8px;display:flex}.project-card .project-tags{margin:24px 0 28px}.project-visual{background:linear-gradient(135deg,#e4f7f3,#9fcfd6 60%,#7daebe);flex-direction:column;min-width:0;display:flex}.project-visual--enterprise{background:linear-gradient(135deg,#f5e6f9,#c9c6ef 60%,#a2c6e2)}.project-visual--network{background:linear-gradient(135deg,#e5f0ff,#bfd8e5 55%,#99b2d6)}.project-art{isolation:isolate;flex:1;place-items:center;min-height:360px;padding:44px 28px 30px;display:grid;position:relative;overflow:hidden}.project-abstract{z-index:-1;object-fit:contain;opacity:.55;pointer-events:none;width:115%;height:115%;position:absolute;top:-10%;right:-20%}.project-device{background:#ffffffed;border:1px solid #fff;border-radius:20px;width:100%;max-width:410px;transition:transform .4s,box-shadow .4s;transform:rotate(-3deg);box-shadow:0 22px 60px #23455c35}.project-card:hover .project-device,.project-card:focus-within .project-device{transform:rotate(-1deg)translateY(-4px);box-shadow:0 26px 65px #23455c45}.project-device-bar{border-bottom:1px solid #d8e3eb;align-items:center;gap:5px;padding:14px 18px;display:flex}.project-device-bar>span{background:#adc0cf;border-radius:50%;width:6px;height:6px}.project-device-bar small{color:#536e82;margin-left:auto;font:10px ui-monospace,monospace}.project-device-content{padding:24px}.project-device-content .project-eyebrow{letter-spacing:.07em;font-size:9px}.project-device-title{color:#213443;letter-spacing:-.04em;margin:8px 0 22px;font-size:25px;font-weight:600;line-height:1.2;display:block}.project-layers{gap:10px;display:grid}.project-layer{background:#eaf3f5;border-radius:12px;align-items:center;gap:13px;padding:13px 12px;display:flex}.project-layer:nth-child(2){background:#e9edf8}.project-layer:nth-child(3){background:#f5efe9}.project-layer-number{color:#5e7485;font:11px ui-monospace,monospace}.project-layer div{min-width:0}.project-layer strong,.project-layer div>span{display:block}.project-layer strong{color:#2a4355;font-size:12px;font-weight:650}.project-layer div>span{color:#4b6374;margin-top:3px;font-size:11px}.project-visual figcaption{color:#304d62;text-align:center;padding:0 24px 22px;font-size:11px}.portfolio-credit{text-align:center;max-width:850px;margin:28px auto 0;font-size:13px}.portfolio-context{background:var(--color-background-3);padding:80px 0}.portfolio-context-inner{grid-template-columns:1fr 1fr;align-items:center;gap:80px;display:grid}.portfolio-context h2{letter-spacing:-.035em;margin-top:22px}.portfolio-context p+p{margin-top:18px}.portfolio-text-link{color:var(--portfolio-ink);text-underline-offset:6px;align-items:center;gap:10px;font-size:14px;font-weight:600;text-decoration:underline #8fa6b7;display:inline-flex}.portfolio-context .portfolio-text-link{margin-top:24px}.case-study-intro{grid-template-columns:1.1fr 1fr;align-items:center;gap:64px;display:grid}.case-study-heading h1{letter-spacing:-.04em;margin-top:24px;font-size:clamp(38px,5.1vw,70px)}.case-study-heading .case-study-headline{color:#213443;letter-spacing:-.025em;margin:20px 0;font-size:clamp(21px,2.3vw,29px);line-height:1.35}.case-study-heading>p{color:#2c4155}.case-study-heading .btn{margin-top:28px}.case-study-intro .project-visual{background:#ffffff24;border-radius:24px}.case-study-intro .project-imagery{border-radius:24px;box-shadow:0 20px 50px #23384a20}.case-study-facts{border-bottom:1px solid var(--color-stroke-1);grid-template-columns:1fr 1fr 1fr;gap:24px;padding:32px 0;display:grid}.case-study-facts dt{text-transform:uppercase;letter-spacing:.1em;color:#4d6477;margin-bottom:10px;font-size:11px}.case-study-facts dd{font-size:16px;font-weight:550;line-height:1.5}.case-study-body{grid-template-columns:245px minmax(0,1fr);gap:80px;padding:80px 0 100px;display:grid}.case-study-toc{position:sticky;top:128px}.case-study-toc ol{margin:20px 0 28px}.case-study-toc li a{border-bottom:1px solid var(--color-stroke-1);color:#334e63;gap:14px;padding:12px 0;font-size:14px;transition:color .2s;display:flex}.case-study-toc li a:hover{color:var(--color-primary-700)}.case-study-toc li a>span{color:#688195;align-self:center;font-size:11px}.case-study-content{min-width:0;max-width:850px}.case-study-content>section+section{margin-top:64px}.case-study-content h2{letter-spacing:-.035em;margin:16px 0 24px;font-size:clamp(28px,3vw,39px);line-height:1.2}.case-study-content h3{letter-spacing:-.02em;margin-bottom:12px;font-size:21px;line-height:1.35}.case-study-content p+p{margin-top:18px}.case-study-screenshots{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:32px;display:grid}.case-study-screenshots figure{min-width:0}.case-study-screenshots img{border:5px solid #233e56;border-radius:18px;width:100%;height:auto;box-shadow:0 16px 30px -22px #1c426e80}.case-study-screenshots figcaption{color:#4b6070;margin-top:12px;font-size:11px;line-height:1.6}@media (width<=480px){.case-study-screenshots{grid-template-columns:1fr;gap:28px}.case-study-screenshots figure{width:min(100%,260px);margin-inline:auto}}.case-study-challenge{background:var(--color-background-3);border:1px solid var(--color-stroke-1);border-radius:24px;padding:36px}.case-study-approach{gap:30px;display:grid}.case-study-step{border-top:1px solid var(--color-stroke-1);grid-template-columns:44px minmax(0,1fr);gap:22px;padding-top:26px;display:grid}.case-study-step-number{color:#3b556e;background:#e6edf5;border-radius:50%;place-items:center;width:44px;height:44px;font-size:13px;display:grid}.case-study-contributions{gap:12px;display:grid}.case-study-contributions li{border:1px solid var(--color-stroke-1);background:#fff;border-radius:18px;gap:20px;padding:26px;display:flex}.case-study-check{color:#3c7078;font-size:22px}.case-study-stack{gap:22px;display:grid}.case-study-stack>div{border-bottom:1px solid var(--color-stroke-1);padding-bottom:22px}.case-study-stack dt{margin-bottom:14px;font-size:14px;font-weight:600}.case-study-stack .pill{font-size:12px}.case-study-credits{border-top:1px solid var(--color-stroke-1);padding:30px 0 0}.case-study-credits h2{font-size:25px}.case-study-credits p{font-size:14px}.portfolio-related{background:var(--color-background-3);padding:80px 0}.portfolio-related-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}.portfolio-related-card{border:1px solid var(--color-stroke-1);background:#fff;border-radius:24px;flex-direction:column;align-items:start;padding:36px;transition:transform .3s,box-shadow .3s;display:flex}.portfolio-related-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px #23455c12}.portfolio-related-card--commerce{background:linear-gradient(145deg,#fff 45%,#e4f7f3)}.portfolio-related-card--enterprise{background:linear-gradient(145deg,#fff 45%,#eeeafa)}.portfolio-related-card--network{background:linear-gradient(145deg,#fff 45%,#e5f0ff)}.portfolio-related-card--mobile{background:linear-gradient(145deg,#fff 45%,#dcebf8)}.portfolio-related-card h3{letter-spacing:-.03em;margin:20px 0 16px;font-size:30px}.portfolio-related-card p{margin-bottom:24px}.portfolio-related-card .portfolio-text-link{margin-top:auto}.portfolio-enter{animation:.6s ease-out both portfolio-enter}@keyframes portfolio-enter{0%{opacity:.6;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (width>=1024px){.portfolio-hero{margin-top:32px;padding-top:130px}}@media (width<=1100px){.portfolio-intro,.case-study-intro{gap:32px}.portfolio-project-nav a{padding:24px 16px}.portfolio-project-nav strong{font-size:18px}.case-study-body{grid-template-columns:200px minmax(0,1fr);gap:40px}.project-device-content{padding:20px}}@media (width<=767px){.portfolio-hero{padding-top:112px;padding-bottom:36px}.portfolio-breadcrumbs{margin-bottom:28px}.portfolio-intro,.case-study-intro,.portfolio-context-inner{grid-template-columns:1fr;gap:32px}.portfolio-intro-copy{max-width:none}.portfolio-project-nav{grid-template-columns:1fr;margin-top:32px}.portfolio-project-nav a,.portfolio-project-nav a:first-child{padding:20px 0}.portfolio-project-nav a+a{border-top:1px solid #ffffff70;border-left:0}.portfolio-project-nav strong{margin-top:5px}.portfolio-section{padding-top:64px;padding-bottom:64px}.portfolio-section-heading{flex-direction:column;align-items:start;gap:20px;margin-bottom:30px}.portfolio-section-heading>p{max-width:none}.project-card{border-radius:24px;grid-template-columns:1fr}.project-card-copy{padding:28px}.project-art{min-height:330px;padding:30px 24px 26px}.project-device-title{font-size:23px}.project-card-heading{gap:12px}.portfolio-context,.portfolio-related{padding:60px 0}.case-study-facts{grid-template-columns:1fr;gap:20px;padding:28px 0}.case-study-facts dt{margin-bottom:4px}.case-study-body{grid-template-columns:1fr;gap:40px;padding-top:36px;padding-bottom:64px}.case-study-toc{position:static}.case-study-toc ol{grid-template-columns:1fr 1fr;gap:0 20px;margin-bottom:20px;display:grid}.case-study-toc li a{gap:8px;height:100%;font-size:12px}.case-study-content>section+section{margin-top:44px}.case-study-challenge{padding:26px}.case-study-step{grid-template-columns:32px minmax(0,1fr);gap:14px}.case-study-step-number{width:32px;height:32px;font-size:11px}.case-study-contributions li{gap:14px;padding:22px}.portfolio-related-grid{grid-template-columns:1fr}.portfolio-related-card{padding:28px}}
