:root{--ink:#0a1a40;--navy:#0b2f70;--blue:#4878d0;--sky:#88b0e0;--mist:#c4d8ee;--bg:#eef2f8;--stripe:repeating-linear-gradient(135deg, #dde7f4 0 10px, #e9eff8 10px 20px);--pad:120px}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,sans-serif}a{color:inherit;text-decoration:none}h2{margin:0}p{text-wrap:pretty;margin:0}.page{min-height:100vh;overflow:hidden}.eyebrow{letter-spacing:.02em;color:var(--navy);font-size:13px;font-weight:500}.sec-title{letter-spacing:-.03em;font-size:56px;font-weight:800;line-height:1}.sec-title span{font-weight:300}.link-u{color:var(--navy);border-bottom:1.5px solid var(--blue);padding-bottom:2px;font-size:15px;font-weight:600}.ph{background:var(--stripe);letter-spacing:.02em;color:var(--navy);justify-content:center;align-items:center;font-size:12px;font-weight:500;display:flex}.hero{padding-bottom:96px;position:relative;overflow:hidden}.hero-bg{background:var(--mist);border-radius:50%;height:1400px;position:absolute;top:40px;left:-30%;right:-30%}.nav{padding:32px var(--pad);justify-content:space-between;align-items:center;display:flex;position:relative}.nav-brand{letter-spacing:.02em;font-size:14px;font-weight:500}.nav-links{align-items:center;gap:8px;font-size:15px;display:flex}.nav-links a{border-radius:999px;padding:9px 18px;transition:background .2s}.nav-links a.active{background:var(--ink);color:#fff}.hero-grid{padding:140px var(--pad) 0;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:48px;display:grid;position:relative}.hero-text{flex-direction:column;gap:28px;display:flex}.tag{align-items:center;gap:8px;display:flex}.tag b{letter-spacing:-.02em;color:var(--navy);font-size:18px;font-weight:700;line-height:1}.tag i{background:var(--navy);width:28px;height:1.5px}.tag span{background:#fff;border-radius:999px;padding:5px 12px 6px;font-size:16px;font-weight:500;line-height:1;box-shadow:0 8px 18px #0b2f701f}.hero h1{letter-spacing:-.035em;margin:0;font-size:88px;font-weight:900;line-height:.95}.hero h1 span{color:var(--navy);font-weight:300}.hero-lead{max-width:440px;color:var(--navy);font-size:18px;line-height:1.55}.hero-cta{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.pill-white{background:#fff;border-radius:999px;padding:16px 28px;font-size:15px;box-shadow:0 12px 28px #0b2f7026}.services{background:var(--ink);color:#fff;padding:120px var(--pad);flex-direction:column;gap:48px;display:flex}.services .eyebrow{color:var(--sky)}.two{grid-template-columns:1fr 1fr;align-items:end;gap:48px;display:grid}.head{flex-direction:column;gap:14px;display:flex}.services .two>p{color:var(--mist);font-size:20px;line-height:1.6}.rows{border-top:1px solid var(--navy)}.row{border-bottom:1px solid var(--navy);grid-template-columns:80px minmax(0,1fr) minmax(0,1.2fr);align-items:baseline;gap:24px;padding:32px 0;display:grid}.row .n{letter-spacing:.02em;color:var(--sky);font-size:14px;font-weight:500}.row .t{letter-spacing:-.02em;font-size:30px;font-weight:700}.row .d{color:var(--mist);font-size:19px;line-height:1.55}.works{padding:120px var(--pad);flex-direction:column;gap:40px;display:flex}.works-head{justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.grid3{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.proj{cursor:pointer;background:#fff;border-radius:20px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 12px 28px #0b2f701a}.proj .ph{background:linear-gradient(120deg,#0db8d3 0%,#1b7fdc 35%,#065b98 70%,#193546 100%);border-radius:0;height:280px;position:relative;overflow:hidden}.ph-cta{background:var(--ink);color:#fff;border-radius:999px;flex:none;margin-left:auto;padding:9px 16px;font-size:14px;font-weight:500;transition:background .25s}.proj b{letter-spacing:-.02em;font-size:26px;font-weight:700;line-height:1.1}.proj-info{align-items:center;gap:18px;padding:22px 28px 26px;display:flex}.proj-logo{flex:none;width:41px;height:44px}.proj-text{flex-direction:column;gap:6px;display:flex}.proj small{letter-spacing:.02em;color:var(--navy);font-size:13px;font-weight:500}.testi{background:var(--mist);border-radius:24px;flex-direction:column;gap:40px;margin:0 72px;padding:96px 48px;display:flex}.testi .two{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}.testi-side{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.testi-side p{color:var(--navy);font-size:17px;line-height:1.6}.arrows{flex:none;gap:10px;display:flex}.arrows button{width:48px;height:48px;color:var(--ink);cursor:pointer;font:inherit;background:#fff;border:0;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:transform .25s,background .25s,color .25s;display:flex;box-shadow:0 8px 18px #0b2f701f}.arrows button:hover{background:var(--ink);color:#fff}.track{scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;gap:20px;margin:-8px -4px -24px;padding:8px 4px 24px;scroll-padding-inline:4px;display:flex;overflow-x:auto}.track::-webkit-scrollbar{display:none}.track .quote{scroll-snap-align:start;flex:0 0 calc(33.3333% - 13.3333px)}.quote{background:#fff;border-radius:20px;flex-direction:column;justify-content:space-between;gap:40px;min-height:380px;padding:36px 32px;display:flex;box-shadow:0 20px 40px #0b2f701f}.quote.hl{background:var(--blue);color:#fff;box-shadow:0 20px 40px #0b2f7033}.quote p{letter-spacing:-.01em;font-size:20px;line-height:1.5}.who{align-items:center;gap:14px;display:flex}.who .avatar{background:var(--ink);color:#fff;border-radius:50%;flex:none;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;font-weight:700;display:flex}.hl .who .avatar{color:var(--blue);background:#fff}.who div{flex-direction:column;gap:2px;display:flex}.who b{font-size:15px}.who span{color:var(--navy);font-size:13px}.hl .who span{color:#fff}.skills{padding:120px var(--pad) 96px;flex-direction:column;gap:40px;display:flex}.skill-rows{border-top:1px solid var(--mist)}.skill-row{border-bottom:1px solid var(--mist);grid-template-columns:240px minmax(0,1fr);align-items:start;gap:32px;padding:36px 0;display:grid}.skill-row h3{letter-spacing:-.02em;margin:0;padding-top:8px;font-size:22px;font-weight:700}.chips{flex-wrap:wrap;gap:10px;display:flex}.chip{background:var(--mist);color:var(--ink);border-radius:999px;padding:12px 22px;font-size:16px;font-weight:500}.chip.dark{background:var(--ink);color:#fff}.foot{color:#fff;background:linear-gradient(100deg,#0a1a40 0%,#0b2f70 42%,#4878d0 68%,#88b0e0 100%);border-radius:24px;justify-content:space-between;align-items:flex-end;gap:32px;margin:0 72px 48px;padding:80px 48px;display:flex}.foot h2{letter-spacing:-.035em;font-size:72px;font-weight:900;line-height:.98}.foot h2 span{font-weight:300}.foot-r{flex-direction:column;align-items:flex-end;gap:14px;display:flex}.foot-r .mail{color:var(--ink);background:#fff;border-radius:999px;padding:16px 28px;font-size:15px;font-weight:600}.foot-r nav{gap:24px;font-size:14px;display:flex}.foot-r nav a:hover{text-decoration:underline}.nav-links a,.pill-white,.row,.proj,.quote,.chip,.foot-r .mail{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,background .25s,color .25s}.nav-links a:hover{background:#fff}.nav-links a.active:hover{background:var(--ink)}.pill-white:hover{transform:translateY(-2px);box-shadow:0 16px 32px #0b2f7038}.row:hover{transform:translate(8px)}.proj{cursor:pointer}.proj:hover{transform:translateY(-6px);box-shadow:0 24px 44px #0b2f702e}.quote:hover{transform:translateY(-6px)}.chip:hover{background:var(--sky);transform:translateY(-2px)}.chip.dark:hover{background:var(--navy)}.foot-r .mail:hover{background:var(--bg);transform:translateY(-2px)}@media (hover:none){.row:hover,.quote:hover,.chip:hover{transform:none}}.quote-text{flex-direction:column;gap:14px;display:flex}.quote p{font-size:17px;line-height:1.55}.quote{min-height:0}.grid3 .quote{align-self:stretch}.modal{z-index:50;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a1a408c;justify-content:center;align-items:center;padding:40px;display:flex;position:fixed;inset:0}.modal-box{background:var(--bg);width:100%;max-width:1080px;max-height:calc(100vh - 80px);color:var(--ink);border-radius:28px;flex-direction:column;gap:28px;padding:40px;display:flex;overflow:auto;box-shadow:0 40px 80px #0a1a4059}.modal-box>*{flex-shrink:0}.modal-head{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.modal-head>div{flex-direction:column;gap:10px;display:flex}.modal-head h3{letter-spacing:-.03em;margin:0;font-size:44px;font-weight:800;line-height:1}.modal-x,.stage-nav{width:48px;height:48px;color:var(--ink);cursor:pointer;font:inherit;background:#fff;border:0;border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:20px;transition:background .25s,color .25s;display:flex}.modal-x:hover{background:var(--ink);color:#fff}.stage{aspect-ratio:16/9;background:repeating-linear-gradient(135deg,#dde7f4 0 10px,#e9eff8 10px 20px);border-radius:20px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.play{background:var(--ink);color:#fff;box-sizing:border-box;border-radius:50%;justify-content:center;align-items:center;width:84px;height:84px;padding-left:6px;font-size:28px;display:flex}.stage-label,.stage-count{border-radius:999px;padding:7px 14px;font-size:13px;font-weight:500;position:absolute;bottom:18px}.stage-label{background:#fff;left:20px}.stage-count{background:var(--ink);color:#fff;right:20px}.stage-nav{margin-top:-24px;position:absolute;top:50%}.stage-nav.l{left:16px}.stage-nav.r{right:16px}.thumbs{scrollbar-width:none;gap:12px;padding:2px;display:flex;overflow-x:auto}.thumb{cursor:pointer;height:80px;font:inherit;color:var(--navy);outline-offset:2px;background:repeating-linear-gradient(135deg,#dde7f4 0 8px,#e9eff8 8px 16px);border:0;border-radius:12px;outline:2px solid #0000;flex:0 0 132px;font-size:12px;font-weight:500;transition:outline-color .2s}.thumb.on{outline-color:var(--blue)}.modal-body{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:start;gap:40px;display:grid}.desc{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.desc-clip{max-height:84px;transition:max-height .5s cubic-bezier(.2,.7,.2,1);overflow:hidden;-webkit-mask-image:linear-gradient(#000 30%,#0000);mask-image:linear-gradient(#000 30%,#0000)}.desc-clip.open{max-height:900px;-webkit-mask-image:none;mask-image:none}.desc-clip p{text-align:justify;-webkit-hyphens:auto;hyphens:auto;color:var(--navy);white-space:pre-line;font-size:17px;line-height:1.65}.desc-toggle{font:inherit;cursor:pointer;color:var(--blue);background:0 0;border:0;align-items:center;gap:8px;padding:6px 0;font-size:14px;font-weight:600;display:flex}.desc-toggle span{background:var(--mist);width:26px;height:26px;color:var(--ink);border-radius:50%;justify-content:center;align-items:center;font-size:12px;transition:transform .35s;display:flex}.desc-toggle span.up{transform:rotate(180deg)}.meta{flex-direction:column;gap:14px;padding-top:4px;display:flex}.meta div{border-bottom:1px solid var(--mist);justify-content:space-between;gap:16px;padding-bottom:12px;font-size:15px;display:flex}.meta span{color:var(--navy)}.meta b{font-weight:600}.stage img,.stage video{object-fit:contain;background:var(--ink);width:100%;height:100%;position:absolute;inset:0}.stage video{padding-bottom:0}.stage-label,.stage-count,.stage-nav{z-index:2}:is(.stage:has(video) .stage-label,.stage:has(video) .stage-count){top:18px;bottom:auto}.thumb{background-position:50%;background-size:cover;position:relative;overflow:hidden}.thumb span{color:#fff;background:#0a1a40c7;border-radius:8px;padding:3px 6px;position:absolute;inset:auto 6px 6px}.grid3>.proj:only-child{grid-column:1/-1}.proj:hover .ph-cta{background:var(--navy)}:root{--pad:clamp(20px, 7vw, 120px)}.hero{padding-bottom:clamp(56px,8vw,96px)}.nav{padding:24px var(--pad);flex-wrap:wrap;gap:16px}.nav-links{flex-wrap:wrap;gap:4px}.nav-links a{padding:8px 14px}.hero h1{font-size:clamp(46px,7vw,88px)}.hero-cta{gap:16px 24px}.sec-title{font-size:clamp(34px,5vw,56px)}.services{padding:clamp(72px, 9vw, 120px) var(--pad)}.two,.testi .two{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:20px 48px}.services .two>p{font-size:clamp(17px,1.7vw,20px)}.row{flex-wrap:wrap;gap:10px 24px;padding:clamp(22px,3vw,32px) 0;display:flex}.row .n{flex:0 0 56px}.row .t{flex:240px;font-size:clamp(22px,2.6vw,30px)}.row .d{flex:320px;font-size:clamp(16px,1.6vw,19px)}.works{padding:clamp(72px, 9vw, 120px) var(--pad)}.works-head{flex-wrap:wrap;gap:16px 24px}.grid3{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:28px 20px}.proj .ph{height:clamp(200px,22vw,280px)}.grid3>.proj:only-child .ph{height:clamp(220px,28vw,360px)}.proj-info{flex-wrap:wrap;padding:clamp(18px,2vw,22px) clamp(20px,2.4vw,28px) clamp(20px,2.2vw,26px)}.proj b{font-size:clamp(22px,2.4vw,26px)}.testi{margin:0 clamp(12px,4vw,72px);padding:clamp(48px,7vw,96px) clamp(20px,4vw,48px)}.track .quote{flex:0 0 clamp(260px,33.3333% - 13.3333px,440px);padding:clamp(26px,3vw,36px) clamp(22px,2.6vw,32px)}.skills{padding:clamp(72px, 9vw, 120px) var(--pad) clamp(56px, 7vw, 96px)}.skill-row{flex-wrap:wrap;gap:16px 32px;padding:clamp(24px,3vw,36px) 0;display:flex}.skill-row h3{flex:0 0 220px}.chips{flex:320px}.chip{padding:clamp(9px,1vw,12px) clamp(16px,1.8vw,22px);font-size:clamp(14px,1.2vw,16px)}.foot{flex-wrap:wrap;margin:0 clamp(12px,4vw,72px) clamp(12px,3vw,48px);padding:clamp(48px,7vw,80px) clamp(24px,4vw,48px)}.foot h2{font-size:clamp(40px,6vw,72px)}.foot-r{align-items:flex-start}.foot-r .mail{overflow-wrap:anywhere;max-width:100%}.foot-r nav{flex-wrap:wrap}.modal{padding:clamp(10px,3vw,40px)}.modal-box{border-radius:clamp(20px,2.5vw,28px);max-height:calc(100vh - 20px);padding:clamp(20px,3.5vw,40px)}.modal-head h3{font-size:clamp(28px,4vw,44px)}.modal-body{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px 40px}.thumb{flex:0 0 clamp(96px,12vw,132px);height:clamp(60px,7vw,80px)}.quote p.clamp{-webkit-line-clamp:8;line-clamp:8;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.more{font:inherit;color:var(--blue);cursor:pointer;background:0 0;border:0;align-self:flex-start;align-items:center;gap:6px;padding:6px 0 0;font-size:14px;font-weight:600;display:flex}.quote.hl .more{color:#fff}.more:hover span{transform:translate(3px)}.more span{transition:transform .25s;display:inline-block}.quote-modal{max-width:640px}.quote-modal .who .avatar{background:var(--ink);color:#fff}.quote-full{flex-direction:column;gap:14px;display:flex}.quote-full p{color:var(--navy);font-size:17px;line-height:1.65}@media (width<=700px){.track .quote{flex-basis:86%;gap:18px;padding:18px}.quote p{font-size:15px;line-height:1.5}.quote p.clamp{-webkit-line-clamp:5;line-clamp:5}.quote-full p{font-size:15px}}.track{scroll-snap-type:none;scroll-behavior:auto}.track .quote{scroll-snap-align:none}.hero-grid{padding:clamp(24px, 4vw, 40px) var(--pad) 0;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:64px}.hero-photo{justify-content:center;display:flex;position:relative}.photo-wrap{width:min(480px,100% - 24px);margin:20px 0 0 24px;position:relative}.photo{aspect-ratio:480/620;background:var(--stripe);border-radius:32px;width:100%;position:relative;overflow:hidden;box-shadow:0 40px 80px #0b2f7038}.photo img{object-fit:cover;object-position:50% 42%;width:100%;height:100%;position:absolute;inset:0}.photo-loc{color:var(--ink);background:#fff;border-radius:999px;align-items:center;gap:8px;padding:10px 16px;font-size:15px;font-weight:500;display:flex;position:absolute;top:20px;right:20px}.badges{flex-direction:column;align-items:flex-start;gap:10px;display:flex;position:absolute;bottom:56px;left:-36px}.badge{color:var(--ink);white-space:nowrap;background:#fff;border-radius:999px;align-items:center;gap:8px;padding:11px 18px;font-size:15px;font-weight:500;animation:6s ease-in-out infinite float;display:flex;box-shadow:0 14px 28px #0b2f7038}.badge i{background:var(--mist);border-radius:50%;width:7px;height:7px}.b1{background:var(--blue);color:#fff;transform:rotate(-3deg)}.b2{background:var(--ink);color:#fff;margin-left:40px;animation-duration:7.5s;animation-delay:1.2s;transform:rotate(2deg)}.b3{margin-left:12px;animation-duration:6.5s;animation-delay:.6s;transform:rotate(-2deg)}@keyframes float{0%,to{translate:0}50%{translate:0 -8px}}@media (prefers-reduced-motion:reduce){.badge{animation:none}}@media (width<=520px){.badges{left:-8px}}
