*{box-sizing:border-box}
html,body{margin:0;background:#070D17;color:#ffffff;font-family:Montserrat,system-ui,sans-serif;-webkit-text-size-adjust:100%}
img{max-width:100%}

body{margin:0}
a{color:#ffffff}a:hover{color:#A8CFF0}
.wrap{max-width:1280px;margin:0 auto;padding:0 80px;box-sizing:border-box;width:100%}
.nav-links{display:flex}
.burger{display:none}
.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.wide{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.irow{grid-template-columns:72px minmax(0,1.6fr) minmax(0,1.1fr) 90px 120px 220px}
.irow{transition:background .3s}
.irow:hover{background:rgba(168,207,240,.06)}
.irow img,.zoom img{transition:transform .8s cubic-bezier(0,0,.2,1)}
.irow:hover img,.zoom:hover img{transform:scale(1.06)}
.strip{grid-auto-columns:minmax(460px,1fr)}
.mosaic{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:300px}
.big2{grid-column:span 2;grid-row:span 2}
.dgrid{grid-template-columns:repeat(26,minmax(0,1fr))}
a,.bp,.bg,.nl,.fl{transition:color .25s,background .25s,border-color .25s,transform .25s,background-size .35s}
.bp svg,.bg svg,.nxt svg{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.bp:hover{background:#ffffff !important;transform:translateY(-2px)}
.bp:hover svg,.bg:hover svg{transform:translateX(5px)}
.bg:hover{border-color:#A8CFF0 !important;color:#A8CFF0 !important}
.nl{background-image:linear-gradient(#A8CFF0,#A8CFF0);background-repeat:no-repeat;background-position:0 100%;background-size:0 1.5px}
.nl:hover{background-size:100% 1.5px;color:#A8CFF0 !important}
.fl:hover{color:#A8CFF0 !important;padding-left:4px}
.irow strong,.mrow strong,.drow strong{transition:color .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.irow:hover strong{color:#A8CFF0;transform:translateX(10px)}
.mrow{transition:background .3s,padding .4s cubic-bezier(.2,.8,.2,1)}
.mrow:hover{background:rgba(168,207,240,.06);padding-left:16px !important;padding-right:16px !important}
.mrow:hover strong{color:#A8CFF0}
.mrow span[aria-hidden]{transition:border-color .3s}
.mrow:hover span[aria-hidden]{border-color:#A8CFF0 !important}
.drow{transition:background .3s}
.drow:hover{background:rgba(168,207,240,.05)}
.drow:hover strong{color:#A8CFF0;transform:translateX(8px)}
.gray img{filter:grayscale(1) brightness(.85);transition:filter .6s,transform .8s cubic-bezier(0,0,.2,1)}
.gray:hover img{filter:none;transform:scale(1.02)}
.tcard{transition:border-color .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.tcard img{transition:filter .6s}
.tcard:hover{border-color:#A8CFF0 !important;transform:translateY(-4px)}
.tcard:hover img{filter:none !important}
.bigcta{transition:letter-spacing .5s cubic-bezier(.2,.8,.2,1),color .3s}
.bigcta:hover{letter-spacing:.012em}
.ccard{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.ccard:hover{transform:translateY(-6px);box-shadow:0 40px 80px rgba(0,0,0,.55) !important}
.fq summary{transition:color .25s}
.fq summary:hover{color:#A8CFF0 !important}
.fq summary svg{transition:transform .3s}
.fq[open] summary svg{transform:rotate(45deg)}
.pill{transition:border-color .25s,background .25s,color .25s}
.pill:hover{border-color:#A8CFF0 !important}
.pill:has(input:checked){background:#A8CFF0;color:#070D17 !important;border-color:#A8CFF0 !important}
.nxt{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.zoom:hover .nxt{transform:scale(1.12) rotate(-45deg)}
.rise{animation:rise 1s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(40px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0)}}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}
.ddp{opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .25s,transform .25s,visibility .25s}
.dd:hover .ddp,.dd:focus-within .ddp{opacity:1;visibility:visible;transform:none}
.ddi{transition:background .25s,border-color .25s}
.ddi:hover{background:rgba(168,207,240,.08);border-left-color:#A8CFF0 !important}
.ddi:hover strong{color:#A8CFF0 !important}
details summary{list-style:none;cursor:pointer}
details summary::-webkit-details-marker{display:none}
@media (max-width:760px){
.wrap{padding:0 24px}
.nav-links{display:none}
.burger{display:flex}
.c2,.c3,.c4,.split,.wide{grid-template-columns:minmax(0,1fr)}
.irow{grid-template-columns:40px minmax(0,1fr)}
.hm{display:none}
.strip{grid-auto-columns:84%}
.mosaic{grid-template-columns:minmax(0,1fr);grid-auto-rows:240px}
.big2{grid-column:auto;grid-row:auto}
.dgrid{grid-template-columns:repeat(13,minmax(0,1fr))}
.dhide{display:none}
}



@media (max-width:760px){header.mopen .nav-links{display:flex !important;position:absolute;top:88px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:20px;padding:24px;background:#0B1A2E;border-bottom:1px solid rgba(168,207,240,.25);z-index:10}}

.sw{opacity:.1;transition:opacity .25s linear}
@media (prefers-reduced-motion:reduce),(hover:none){.sw{opacity:1 !important}}
/* ===== 80% rule: on phones and tablets every section fits in 80% of the screen height ===== */
@media (max-width:1180px){
  /* lists become swipe rows: one card in view, the next one peeking */
  .swipe{display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;gap:16px !important;margin-left:-24px !important;margin-right:-24px !important;padding:0 24px 6px !important;scroll-padding-left:24px;scrollbar-width:none;border:0 !important;grid-template-columns:none !important}
  .swipe::-webkit-scrollbar{display:none}
  .swipe > *{flex:0 0 46%;min-width:0;scroll-snap-align:start}
  /* project index cards */
  .sw-ix > .irow{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:10px !important;padding:0 !important;border:0 !important}
  .sw-ix > .irow > .hm{display:none !important}
  .sw-ix > .irow > .hm:last-child{display:block !important;order:-1;height:min(34vh,300px) !important;width:100%}
  .sw-ix > .irow > span:first-child{order:-2;display:none}
  .sw-ix > .irow strong{font-size:clamp(26px,3.4vw,34px) !important}
  /* services hub, projects page: image on top, text under it */
  .sw-sv > .split,.sw-pj > .wide{display:flex !important;flex-direction:column !important;gap:18px !important;padding:0 !important;border:0 !important;align-items:stretch !important}
  .sw-sv .zoom,.sw-pj .zoom{height:min(30vh,280px) !important;order:-1}
  .sw-sv .zoom img,.sw-pj .zoom img{height:100% !important}
  .sw-sv ul{display:none !important}
  .sw-pj [style*="padding: 12px 0; border-top"]{padding:7px 0 !important}
  /* team: photo on top, compact */
  .sw-tm > .tcard{display:flex !important;flex-direction:column !important}
  .sw-tm > .tcard > img{min-height:0 !important;height:min(22vh,220px) !important;aspect-ratio:auto !important;object-position:50% 8%}
  .sw-tm > .tcard > div{padding:20px !important;gap:10px !important}
  .sw-tm > .tcard h3{font-size:36px !important}
  /* gallery */
  .sw-gal > figure{height:min(52vh,420px) !important;grid-column:auto !important;grid-row:auto !important}
  .sw-gal > figure img{height:100% !important}
  /* tighter sections */
  section[style*="padding: 112px 0"]{padding-top:56px !important;padding-bottom:56px !important}
  section[style*="overflow: hidden; background"][style^="position: relative; height:"]{height:44vh !important}
  section[style^="position: relative; height: 820px"]{height:72vh !important}
  div:has(> .cmp-top){height:46vh !important}
  .drow{padding:12px 0 !important}
  .drow strong{font-size:clamp(22px,3vw,30px) !important}
  .mrow{padding:12px 0 !important}
  .mrow strong{font-size:clamp(24px,3.2vw,32px) !important}
  .gbox{height:min(20vh,200px) !important}
  div:has(> .cmp-top){height:40vh !important}
  .sw-pj .zoom{height:min(20vh,220px) !important}
  .sw-pj [style*="padding: 12px 0; border-top"]{padding:5px 0 !important;font-size:13px}
  .sw-gal > figure{height:min(44vh,380px) !important}
  [style*="grid-template-columns: 60px minmax(0, 1fr) auto minmax(0, 1fr)"]{padding:12px 0 !important}
  [style*="grid-template-columns: 72px minmax(0, 1.4fr) minmax(0, 1fr)"]{padding:16px 0 !important}
  [style*="grid-template-columns: 72px minmax(0, 1.4fr) minmax(0, 1fr)"] strong{font-size:clamp(30px,4vw,44px) !important}
  footer{padding-top:44px !important}
  footer > .wrap{gap:28px !important}
  footer > .wrap > div:first-child{padding-bottom:28px !important}
  footer [aria-hidden="true"][style*="15.5vw"]{padding-top:8px !important;font-size:13vw !important}
  /* long bios (studio page): clamp with a Read more toggle */
  .sw-tm .tcard p.clamp{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
  .sw-tm .tcard.open p.clamp{display:block}
  .tmore{display:inline-flex !important}
  section h2{font-size:clamp(32px,4.2vw,44px) !important}
  .sw-tm > .tcard > div{padding:16px 18px !important}
  .sw-tm .tcard [style*="flex-wrap: wrap; gap: 8px; margin-top: auto"]{display:none !important}
  .sw-pj [style*="padding: 12px 0; border-top"]:nth-child(n+4){display:none !important}
  [style*="grid-template-columns: 60px minmax(0, 1fr) auto minmax(0, 1fr)"] > span[aria-hidden]{display:none !important}
  .gbox{height:min(16vh,170px) !important}
}
.tmore{display:none;align-self:flex-start;background:none;border:0;padding:0;color:#A8CFF0;font:600 14px Montserrat,sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
@media (max-width:760px){
  .swipe > *{flex-basis:84%}
  .sw-st > li{flex-basis:74%}
  section[style*="padding: 112px 0"]{padding-top:48px !important;padding-bottom:48px !important}
  .drow > :nth-child(3){font-size:13.5px !important;line-height:1.45 !important}
  .sw-st > li p{font-size:14px !important}
  section h2{font-size:clamp(30px,9vw,36px) !important}
  .gbox,.gbox + div,.gxy{display:none !important}
  .mrow > span:nth-child(2) > span{display:none !important}
  .mrow strong{font-size:26px !important}
  [style*="grid-template-columns: 60px minmax(0, 1fr) auto minmax(0, 1fr)"] > span:nth-child(2){font-size:16px !important}
  div:has(> .drow){display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
  div:has(> .drow) > .drow{display:flex !important;flex-direction:column;gap:6px !important}
  div:has(> .drow) > .drow strong{font-size:22px !important}
  footer > .wrap > div:first-child > a,footer > .wrap > div:first-child > div:last-child:not(:first-child){display:none !important}
  .sw-tm > .tcard > img{height:min(15vh,150px) !important}
  .sw-tm .tcard p{font-size:14px !important}
  footer{padding-top:40px !important}
  footer > .wrap{gap:24px !important}
  footer > .wrap > div:first-child{padding-bottom:20px !important;gap:16px !important}
  footer > .wrap > div:first-child p{font-size:14px !important}
  footer .c4 > div{padding:12px 0 !important}
  footer [aria-hidden="true"][style*="15.5vw"]{padding-top:12px !important}
}
/* phones: proof figures in one row */
@media (max-width:760px){
  section[aria-label] > .c3{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:12px !important}
  section[aria-label] > .c3 > div{padding:16px 0 !important;gap:6px !important}
  section[aria-label] > .c3 > div > :first-child{font-size:clamp(24px,7.5vw,34px) !important}
  section[aria-label] > .c3 > div > :last-child{font-size:12px !important;line-height:1.4 !important}
  .split{gap:24px !important}
}
/* short phones (about 740px tall or less) */
@media (max-width:760px) and (max-height:780px){
  section[style*="padding: 112px 0"]{padding-top:36px !important;padding-bottom:36px !important}
  section[style*="padding: 72px 0 64px"]{padding-top:40px !important;padding-bottom:32px !important}
  section h2{font-size:30px !important}
  h1{font-size:min(11.5vw,56px) !important}
  footer{padding-top:32px !important}
  footer [aria-hidden="true"][style*="15.5vw"]{display:none !important}
  footer > .wrap{gap:20px !important;padding-bottom:28px}
  .sw-tm > .tcard > img{height:13vh !important}
  .sw-pj .zoom{height:18vh !important}
  .c3 > div[style*="padding: 8px 32px"]{padding:6px 0 !important;gap:8px !important}
  [style*="grid-template-columns: 60px minmax(0, 1fr) auto minmax(0, 1fr)"]{padding:10px 0 !important}
  [style*="grid-template-columns: 60px minmax(0, 1fr) auto minmax(0, 1fr)"] > span:nth-child(2){font-size:15px !important}
  .stagewrap,.slides{height:27vh !important;min-height:170px !important}
  footer > .wrap > div:first-child p{display:none !important}
  footer .c4 > div{padding:10px 0 !important}
  .sw-tm .tcard h3{font-size:30px !important}
  .sw-tm > .tcard > div{padding:14px 16px !important;gap:8px !important}
  section[style*="padding: 72px 0 64px"] p{font-size:15px !important}
  .sw-pj .zoom{height:16vh !important}
  .hero .eyebrow{display:none !important}
  .sw-tm > .tcard > img{height:11vh !important}
}
@media (min-width:901px) and (max-width:1180px){
  .sw-tm > .tcard{flex-direction:row !important}
  .sw-tm > .tcard > img{width:38% !important;height:auto !important;min-height:100% !important;flex:none;object-position:50% 12%}
  .sw-tm > .tcard > div{flex:1;min-width:0}
}
@media (min-width:1181px){ .sw-st{display:grid !important;overflow:visible;margin:0 !important;padding:0 !important;gap:28px !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important} .sw-st > li{flex:none} }
@media (min-width:761px) and (max-width:1180px){ .sw-st > li{flex-basis:31%} }

.grecaptcha-badge{visibility:hidden !important}
.lsw{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:12px;letter-spacing:.06em;white-space:nowrap}
.lsw b{font-weight:600}
.lsw a{color:inherit;opacity:.65;text-decoration:none;transition:opacity .2s}
.lsw a:hover,.lsw a:focus-visible{opacity:1}
footer .lsw{font-size:13px}
/* tablets */
@media (max-width:1000px){
  .wide{grid-template-columns:minmax(0,1fr) !important}
  [style*="grid-template-columns: minmax(0, 300px) minmax(0, 1fr)"]{grid-template-columns:minmax(0,1fr) !important;gap:32px !important}
  p,li,a{overflow-wrap:anywhere}
  .c3{grid-template-columns:minmax(0,1fr) !important}
  .c4{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .c4 > .hm{display:none !important}
  .irow{grid-template-columns:48px minmax(0,1fr) !important}
  .irow > .hm{display:none !important}
  .irow > .hm:last-child{display:block !important;grid-column:1/-1;height:260px !important}
}
@media (max-width:900px){
  .split{grid-template-columns:minmax(0,1fr) !important}
}
/* paired team cards (home) stack their photo on top until there is room for both side by side */
@media (min-width:1181px) and (max-width:1280px){
  .c2 > .tcard{grid-template-columns:minmax(0,1fr) !important}
  .c2 > .tcard > img{min-height:0 !important;height:auto !important;aspect-ratio:4/3}
}
/* menu button up to 1000px (tablets included), services list inside the open menu */
@media (max-width:1000px){
  .nav-links{display:none !important}
  .burger{display:flex !important}
  header.mopen .nav-links{display:flex !important;position:absolute !important;top:88px !important;left:0 !important;right:0 !important;flex-direction:column !important;align-items:stretch !important;gap:0 !important;padding:8px 24px 24px !important;background:#0B1A2E !important;border-bottom:1px solid rgba(168,207,240,.25) !important;z-index:40 !important}
  header.mopen .nav-links > a,header.mopen .nav-links > .dd > a{display:flex !important;justify-content:space-between !important;align-items:center !important;padding:16px 0 !important;border-bottom:1px solid rgba(168,207,240,.18) !important;font-size:18px !important;overflow-wrap:normal !important}
  header.mopen .nav-links > .lsw{padding:18px 0 !important;font-size:13px !important}
  header.mopen .dd .ddp{display:none !important;position:static !important;opacity:1 !important;visibility:visible !important;transform:none !important;padding:0 0 8px !important}
  header.mopen .dd.open .ddp{display:block !important}
  header.mopen .dd .ddp > div{width:auto !important;box-shadow:none !important;border:0 !important;background:transparent !important}
  header.mopen .dd.open > a svg{transform:rotate(180deg) !important}
  .hero header{position:absolute !important;z-index:40 !important}
  .hero nav > :not(.cta){display:none !important}
  .hero header .burger{display:flex !important;margin-left:12px !important}
  .hero header > nav{margin-left:auto !important}
  .hero header.mopen nav{position:absolute !important;top:100% !important;left:0 !important;right:0 !important;flex-direction:column !important;align-items:stretch !important;gap:0 !important;padding:8px 24px 24px !important;background:#0B1A2E !important;border-bottom:1px solid rgba(168,207,240,.25) !important}
  .hero header.mopen nav > *{display:flex !important}
  .hero header.mopen nav > a,.hero header.mopen nav > .dd > a{justify-content:space-between !important;padding:16px 0 !important;border-bottom:1px solid rgba(168,207,240,.18) !important;font-size:18px !important}
  .hero header.mopen nav > .dd{flex-direction:column !important}
  .hero header.mopen nav > .dd > a{display:flex !important}
  .hero header.mopen nav .ddp a[style*="display: grid"]{display:grid !important}
  .hero header.mopen nav .ddp a[style*="display: flex"]{display:flex !important}
  .hero header.mopen nav > .lsw{padding:18px 0 !important}
  .hero header.mopen nav .lsw a{display:inline !important}
  .hero header.mopen nav > a.cta{border-bottom:0 !important;color:#A8CFF0 !important}
  .nav-links a,.lsw,.hero nav a{overflow-wrap:normal !important}
}
/* phones */
@media (max-width:760px){
  [style*="grid-template-columns: 60px minmax(0, 1fr) auto minmax(0, 1fr)"]{grid-template-columns:minmax(0,1fr) !important;gap:10px !important}
  [style*="grid-template-columns: 60px minmax(0, 1fr) auto minmax(0, 1fr)"] > svg{display:none}
  [style*="grid-template-columns: 72px minmax(0, 1.4fr) minmax(0, 1fr)"]{grid-template-columns:48px minmax(0,1fr) !important;gap:8px 16px !important}
  [style*="grid-template-columns: 72px minmax(0, 1.4fr) minmax(0, 1fr)"] > :nth-child(3){grid-column:2}
  [style*="grid-template-columns: minmax(0, 300px) minmax(0, 1fr)"]{grid-template-columns:minmax(0,1fr) !important;gap:32px !important}
  h1{font-size:min(12.5vw,64px) !important;overflow-wrap:break-word}
  p,li,a{overflow-wrap:anywhere}
  footer .c4{gap:0 !important;grid-template-columns:minmax(0,1fr) !important}
  footer .c4 > div{padding:16px 0;border-top:1px solid rgba(168,207,240,.18)}
  footer .c4 > div.fold > span{display:flex;justify-content:space-between;align-items:center;cursor:pointer;min-height:28px}
  footer .c4 > div.fold > span::after{content:'+';font-size:16px;color:#A8CFF0}
  footer .c4 > div.fold.open > span::after{content:'2'}
  footer .c4 > div.fold > a{display:none}
  footer .c4 > div.fold.open > a{display:block}
  aside [style*="justify-content: space-between; gap: 16px; padding: 14px 0"]{flex-direction:column;gap:4px !important}
  aside [style*="justify-content: space-between; gap: 16px; padding: 14px 0"] > span:last-child{text-align:left !important}
  .irow > .hm{display:none !important}
  .irow > .hm:last-child{display:block !important;grid-column:1/-1;height:210px !important}
  .drow{grid-template-columns:40px minmax(0,1fr) !important;gap:8px 12px !important}
  .drow > :nth-child(3){grid-column:2;display:block !important}
  .tcard{grid-template-columns:minmax(0,1fr) !important}
  .tcard > img{min-height:0 !important;height:auto !important;aspect-ratio:4/3}
  .mrow > span:first-child,.drow > span:first-child{flex:none;min-width:24px}
  .mrow strong,.drow strong{font-size:30px !important}
}
