:root{
  --bg:#F2F5FF; --ink:#141A33; --muted:#56608A; --cobalt:#1F3BD6; --line:#C9D3FF;
  --heroBg:#1F3BD6; --heroInk:#F2F5FF; --heroMuted:#C9D3FF;
  --marker:#FFE45C; --markerInk:#141A33; --err:#FFD2CC; --errLight:#B3261E;
  --font:"Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  box-sizing:border-box;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0F1430; --ink:#E8ECFF; --muted:#9AA5D6; --cobalt:#8FA2FF; --line:#2C3670;
    --heroBg:#1A2FB0; --errLight:#FF8A80; }
}

*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:1.0625rem;line-height:1.55;-webkit-font-smoothing:antialiased}
.wrap{max-width:72rem;margin:0 auto;padding:0 1.5rem}
a{color:var(--cobalt)}
:focus-visible{outline:3px solid var(--marker);outline-offset:3px;border-radius:2px}
main :focus-visible{outline-color:var(--cobalt)}
.blue{background:var(--heroBg);color:var(--heroInk)}
.blue :focus-visible{outline-color:var(--marker)}

/* header */
.topbar{padding-top:env(safe-area-inset-top,0px)}
header{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.4rem 0}
.logo{font-weight:800;font-size:1.4rem;letter-spacing:-.02em;color:var(--heroInk);text-decoration:none}
.logo span{background:var(--marker);color:var(--markerInk);padding:0 .15em;margin-left:.05em}
.top-right{display:flex;align-items:center;gap:1.4rem}
.nav{display:flex;gap:1.3rem}
.nav a{color:var(--heroMuted);text-decoration:none;font-weight:600;font-size:.975rem;padding:.2rem 0;border-bottom:2px solid transparent}
.nav a:hover{color:var(--heroInk)}
.nav a[aria-current="page"]{color:var(--heroInk);border-bottom-color:var(--marker)}
.lang{display:flex;gap:.2rem;border:1.5px solid rgba(242,245,255,.35);border-radius:999px;padding:.2rem}
.lang button{font:600 .8125rem var(--font);border:0;background:none;color:var(--heroMuted);padding:.3rem .7rem;border-radius:999px;cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--heroInk);color:var(--heroBg)}

/* buttons */
.btn,.send{display:inline-block;font:700 1.0625rem var(--font);background:var(--marker);color:var(--markerInk);border:0;border-radius:.6rem;padding:.9rem 1.5rem;cursor:pointer;text-decoration:none}
.btn:hover,.send:hover{filter:brightness(1.05)}
.btn-sm{padding:.55rem 1rem;font-size:.9375rem}
.btn-ghost{display:inline-block;font:700 1.0625rem var(--font);color:var(--heroInk);border:2px solid rgba(242,245,255,.5);border-radius:.6rem;padding:.8rem 1.4rem;text-decoration:none}
.btn-ghost:hover{border-color:var(--heroInk)}
.send[disabled]{opacity:.6;cursor:progress}

/* home hero */
.hero-home{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center;padding:3.5rem 0 5.5rem}
.hero-home h1,.page-hero h1{font-size:clamp(2.6rem,6.2vw,5rem);font-weight:800;letter-spacing:-.04em;line-height:1.02;margin:0 0 1.5rem}
mark{background:var(--marker);color:var(--markerInk);padding:0 .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lead{color:var(--heroMuted);font-size:1.1875rem;max-width:36rem;margin:0 0 2rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:.9rem}
.collage{position:relative;aspect-ratio:1/0.9}
.collage .c{position:absolute;width:66%;aspect-ratio:400/260;border-radius:1rem;overflow:hidden;box-shadow:0 18px 40px rgba(8,14,60,.35)}
.collage .c svg{display:block;width:100%;height:100%}
.collage .c1{top:0;left:0;transform:rotate(-4deg)}
.collage .c2{top:30%;right:0;transform:rotate(3deg)}
.collage .c3{bottom:0;left:8%;transform:rotate(-1.5deg)}
.page-hero{padding:3rem 0 4.5rem}
.page-hero h1{max-width:52rem}

/* sections */
section.s{padding:5.5rem 0 0}
.eyebrow-free h2,.s h2.sec{font-size:clamp(1.9rem,4vw,3rem);font-weight:800;letter-spacing:-.035em;line-height:1.08;margin:0 0 1rem;max-width:44rem}
.sub{color:var(--muted);max-width:40rem;margin:0 0 2.5rem;font-size:1.125rem}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 2rem;margin-bottom:2.5rem}
.sec-head .sub{margin:0}
.more-link{font-weight:700;color:var(--cobalt);text-decoration:none;border-bottom:2px solid var(--marker);white-space:nowrap}

.industries{display:flex;flex-wrap:wrap;align-items:baseline;gap:.75rem 2.25rem;padding:2rem 0;border-bottom:1.5px solid var(--line)}
.industries .lbl{color:var(--muted);font-size:.9375rem;margin-right:.5rem}
.industries span.i{font-weight:800;font-size:clamp(1.1rem,2.2vw,1.5rem);letter-spacing:-.02em}

.services{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 2.5rem}
.services li{padding:1.75rem 0;border-top:1.5px solid var(--line)}
.services .ic{width:2.75rem;height:2.75rem;border-radius:.7rem;background:var(--cobalt);display:grid;place-items:center;margin-bottom:1rem}
.services .ic svg{width:1.4rem;height:1.4rem;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.services h3{font-size:1.25rem;letter-spacing:-.015em;margin:0 0 .4rem}
.services p{margin:0;color:var(--muted)}

.work{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem 2rem}
.thumb{display:block;aspect-ratio:400/260;border-radius:.9rem;overflow:hidden;margin-bottom:1rem;background:var(--line)}
.thumb svg,.thumb img{display:block;width:100%;height:100%;object-fit:cover}
.work h3{font-size:1.375rem;letter-spacing:-.02em;line-height:1.2;margin:0}
.meta{color:var(--muted);font-size:.9375rem;margin:.2rem 0 .5rem}
.work p.what{margin:0}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:5.5rem;padding:3rem 2.5rem;border-radius:1.25rem}
.stats .n{font-size:clamp(2.2rem,4.4vw,3.4rem);white-space:nowrap;font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--marker)}
.stats .l{color:var(--heroMuted);margin-top:.5rem;max-width:16rem}

.process{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;counter-reset:s}
.process li{counter-increment:s;border-top:3px solid var(--cobalt);padding-top:1.1rem}
.process li::before{content:"0" counter(s);display:block;font-weight:800;color:var(--cobalt);font-size:.9375rem;margin-bottom:.5rem}
.process h3{margin:0 0 .35rem;font-size:1.2rem;letter-spacing:-.015em}
.process p{margin:0;color:var(--muted)}

.quote{margin:5.5rem 0 0}
.quote blockquote{margin:0;font-size:clamp(1.7rem,4vw,3rem);font-weight:800;letter-spacing:-.03em;line-height:1.2;max-width:52rem}
.quote blockquote span{background:linear-gradient(transparent 10%,var(--marker) 10%,var(--marker) 94%,transparent 94%);color:var(--markerInk);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .1em}
.quote figcaption{color:var(--muted);margin-top:1rem}

/* contact */
.contact{margin-top:5.5rem;padding:4.5rem 0 4rem}
.contact h2{font-size:clamp(1.9rem,4vw,3rem);font-weight:800;letter-spacing:-.035em;line-height:1.08;margin:0 0 .75rem}
.contact .lead{margin-bottom:2.25rem}
form{margin:0}
.sentence{font-size:clamp(1.6rem,4.4vw,3.3rem);font-weight:700;letter-spacing:-.025em;line-height:1.45;margin:0}
.sentence p{margin:0 0 .35em}
.nb{white-space:nowrap}
.blank{font:inherit;letter-spacing:inherit;color:var(--heroInk);background:transparent;border:0;border-bottom:.08em solid var(--heroInk);
  padding:0 .1em;margin:0 .05em;border-radius:0;min-width:3ch;max-width:100%;
  background-image:linear-gradient(var(--marker),var(--marker));background-repeat:no-repeat;background-size:0% 100%;
  transition:background-size .35s ease, color .2s}
.blank::placeholder{color:var(--heroInk);opacity:.5}
.blank.filled{background-size:100% 100%;color:var(--markerInk);border-bottom-color:var(--marker)}
select.blank{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:.9em;
  background-image:linear-gradient(var(--marker),var(--marker)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23F2F5FF' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat,no-repeat;background-position:0 0,right .1em center;background-size:0% 100%,.45em}
select.blank.filled{background-image:linear-gradient(var(--marker),var(--marker)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23141A33' stroke-width='1.6'/%3E%3C/svg%3E");background-size:100% 100%,.45em}
select.blank option{color:#141A33;background:#fff;font-size:1rem}
textarea.blank{display:block;width:100%;resize:none;overflow:hidden;font-size:clamp(1.1rem,2.2vw,1.5rem);font-weight:500;
  letter-spacing:-.01em;line-height:1.5;margin:.2em 0 .6em;padding:.15em .2em;border-bottom-width:2px;min-height:2.4em}
textarea.blank.filled{background-size:0 0;color:var(--heroInk);border-bottom-color:var(--marker)}
.measure{position:absolute;visibility:hidden;white-space:pre;left:-9999px;top:0}
.hp{position:absolute;left:-9999px}

.actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin:1.75rem 0 .5rem}
.send{font:700 1.125rem var(--font);background:var(--marker);color:var(--markerInk);border:0;border-radius:.6rem;padding:.95rem 1.7rem;cursor:pointer}
.send:hover{filter:brightness(1.05)}
.send[disabled]{opacity:.6;cursor:progress}
.privacy{color:var(--heroMuted);font-size:.9375rem;margin:0}
.msg{min-height:1.5em;margin:.75rem 0 0;font-weight:500}
.msg.error{color:var(--err)}
.done{display:none;padding:1rem 0 0}
.done h2{font-size:clamp(1.6rem,4.4vw,3.3rem);letter-spacing:-.025em;line-height:1.2;margin:0 0 1rem}
.linkbtn{font:600 1rem var(--font);background:none;border:0;color:var(--heroInk);text-decoration:underline;cursor:pointer;padding:0}


/* case studies */
.cases{list-style:none;margin:0;padding:0}
.cases li{display:grid;grid-template-columns:1.05fr 1fr;gap:2.5rem;align-items:center;padding:3rem 0;border-bottom:1.5px solid var(--line)}
.cases li:first-child{padding-top:0}
.cases li:nth-child(even) .thumb{order:2}
.cases .thumb{margin:0}
.cases h2{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.03em;margin:0 0 .25rem}
.cases dl{margin:1.1rem 0 0}
.cases dt{font-weight:700;font-size:.9375rem;color:var(--cobalt);margin-top:.9rem}
.cases dd{margin:.15rem 0 0}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin:.75rem 0 0;padding:0}
.tags li,.chips li{border:1.5px solid var(--line);border-radius:999px;padding:.25rem .8rem;font-weight:500;font-size:.875rem}
.cases .tags li{display:block;padding:.25rem .8rem;border-bottom:1.5px solid var(--line)}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}

/* about */
.values{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem}
.values li{border-top:3px solid var(--marker);padding-top:1.1rem}
.values h3{margin:0 0 .4rem;font-size:1.25rem;letter-spacing:-.015em}
.values p{margin:0;color:var(--muted)}
.team{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
.person{display:flex;gap:1.25rem;align-items:flex-start}
.avatar{flex:0 0 auto;width:6rem;height:6rem;border-radius:50%;overflow:hidden;background:var(--marker);color:var(--markerInk);display:grid;place-items:center;font-weight:800;font-size:2rem;letter-spacing:-.03em}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.person h3{margin:0;font-size:1.3rem;letter-spacing:-.015em}
.person .role{color:var(--cobalt);font-weight:600;margin:.1rem 0 .5rem}
.person p{margin:0 0 .5rem}

.cta{margin-top:5.5rem;border-radius:1.25rem;padding:2.75rem;display:flex;flex-wrap:wrap;gap:1.25rem 2rem;align-items:center;justify-content:space-between}
.cta p{margin:0;font-size:clamp(1.5rem,3.2vw,2.2rem);font-weight:800;letter-spacing:-.03em;line-height:1.15;max-width:34rem}

footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem 1.5rem;color:var(--muted);font-size:.9375rem;padding:2.5rem 0;margin-top:4.5rem;border-top:1.5px solid var(--line)}
footer.onblue{margin-top:0;border-top-color:rgba(242,245,255,.2);color:var(--heroMuted)}
footer.onblue a{color:var(--heroInk)}
footer nav{display:flex;flex-wrap:wrap;gap:1.25rem}

@media (max-width:900px){
  .hero-home{grid-template-columns:1fr;gap:2.5rem;padding-bottom:4rem}
  .collage{max-width:30rem;width:100%}
  .services,.work{grid-template-columns:1fr 1fr}
  .process{grid-template-columns:1fr 1fr}
  .values{grid-template-columns:1fr}
  .team{grid-template-columns:1fr}
  .cases li{grid-template-columns:1fr;gap:1.5rem}
  .cases li:nth-child(even) .thumb{order:0}
}
@media (max-width:640px){
  header{flex-wrap:wrap}
  .top-right{width:100%;justify-content:space-between;gap:.75rem}
  .nav{gap:.4rem .9rem;flex-wrap:wrap}
  .nav a{font-size:.9rem}
  .top-right{flex-wrap:wrap}
  .lang{margin-left:auto}
  .top-right .btn-sm{display:none}
  .services,.work,.process,.stats{grid-template-columns:1fr}
  .stats{padding:2rem 1.5rem}
  .cta{padding:1.75rem}
}
@media (prefers-reduced-motion:reduce){ .blank{transition:none} html{scroll-behavior:auto} }
@media (max-width:420px){ .sentence{font-size:1.4rem} .contact .blank{max-width:calc(100vw - 4rem)} }
@media (max-width:360px){ .nb{white-space:normal} .hero-home h1,.page-hero h1{font-size:2.2rem;overflow-wrap:break-word} }
.thumb.shot img,.collage .c.shot img{object-position:top center;background:#fff}
.collage .c img{display:block;width:100%;height:100%;object-fit:cover}