:root{--paper:#f5f4ef;--ink:#171a1f;--muted:#666b70;--lime:#b9c7ae;--coral:#b96f5b;--blue:#1b2b46;--line:rgba(23,26,31,.16);--mono:"DM Mono",monospace;--sans:"Manrope",sans-serif;--pad:clamp(1.25rem,4vw,4.5rem);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit}button,input,textarea{font:inherit}.skip-link{position:fixed;z-index:1000;left:1rem;top:-5rem;background:var(--ink);color:white;padding:.8rem 1rem}.skip-link:focus{top:1rem}.site-header{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);position:fixed;inset:0 0 auto;z-index:100;border-bottom:1px solid transparent;transition:.3s}.site-header.is-scrolled{height:68px;background:rgba(242,240,233,.9);backdrop-filter:blur(14px);border-color:var(--line)}.logo{display:flex;align-items:center;gap:.65rem;text-decoration:none;font-weight:600;font-size:1.08rem;letter-spacing:-.03em}.logo svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.6}.site-nav{display:flex;align-items:center;gap:2rem}.site-nav a{text-decoration:none;font-size:.85rem;font-weight:600}.nav-cta{border:1px solid var(--ink);border-radius:100px;padding:.65rem 1rem}.nav-cta span,.text-link span,.submit-button span{display:inline-block;transition:transform .25s var(--ease)}.nav-cta:hover span,.submit-button:hover span{transform:translate(3px,-3px)}.nav-toggle{display:none;background:none;border:0}.hero{min-height:100svh;padding:calc(84px + 3rem) var(--pad) var(--pad);display:flex;flex-direction:column}.hero__eyebrow{display:flex;justify-content:space-between;font:500 .68rem var(--mono);text-transform:uppercase;letter-spacing:.08em;border-top:1px solid var(--ink);padding-top:.8rem}.hero__main{display:grid;grid-template-columns:1fr minmax(250px,28%);gap:4rem;align-items:end;padding:clamp(3rem,8vw,7rem) 0 2.5rem}.hero h1,.section h2,.contact h2{font-weight:500;letter-spacing:-.065em;line-height:.88;margin:0}.hero h1{font-size:clamp(4rem,10.5vw,10rem)}.hero h1 em{font-weight:400;color:var(--coral)}.hero__side p{font-size:clamp(1.05rem,1.4vw,1.3rem);letter-spacing:-.025em;margin:0 0 2.2rem}.text-link{font:500 .72rem var(--mono);text-transform:uppercase;text-decoration:none;border-bottom:1px solid;padding-bottom:.5rem;display:flex;justify-content:space-between}.hero__art{height:clamp(190px,27vh,330px);background:var(--blue);position:relative;overflow:hidden}.orb{position:absolute;border-radius:50%;filter:blur(2px);animation:float 9s ease-in-out infinite alternate}.orb--one{width:42vw;height:42vw;max-width:540px;max-height:540px;background:var(--coral);left:8%;top:25%}.orb--two{width:33vw;height:33vw;max-width:420px;max-height:420px;background:var(--lime);left:38%;top:-65%;animation-delay:-3s}.orb--three{width:25vw;height:25vw;max-width:320px;max-height:320px;background:#88b8ff;right:4%;bottom:-65%;animation-delay:-6s}.hero__art-label{position:absolute;right:1rem;bottom:1rem;color:white;font:400 .65rem var(--mono);text-transform:uppercase;letter-spacing:.1em}.section{padding:clamp(6rem,11vw,11rem) var(--pad)}.section-heading{display:grid;grid-template-columns:1fr 2fr 1fr;gap:3rem;align-items:start;margin-bottom:5rem}.kicker{font:500 .68rem var(--mono);text-transform:uppercase;letter-spacing:.08em;margin:0}.section h2,.contact h2{font-size:clamp(3.3rem,7vw,7rem)}.section-heading>p:last-child{color:var(--muted);max-width:25rem;margin:.4rem 0 0;font-size:1.05rem}.projects{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--pad)}.project{min-height:620px}.project:nth-child(3){grid-column:1/-1;width:calc(50% - var(--pad)/2);margin-left:auto}.project a{display:flex;flex-direction:column;height:100%;padding:1.25rem;color:white;text-decoration:none;overflow:hidden}.project--navy a{background:var(--blue)}.project--lime a{background:var(--lime);color:var(--ink)}.project--coral a{background:var(--coral);color:var(--ink)}.project__top{display:flex;justify-content:space-between;font:400 .65rem var(--mono);text-transform:uppercase;letter-spacing:.06em}.project__visual{flex:1;display:grid;place-items:center;transition:transform .6s var(--ease)}.project:hover .project__visual{transform:scale(1.05)}.northline-mark{font-size:clamp(7rem,17vw,14rem);font-weight:600;letter-spacing:-.1em}.northline-mark span{color:var(--coral)}.data-ring{width:min(23vw,270px);aspect-ratio:1;border:1px solid;display:grid;place-items:center;border-radius:50%;position:relative}.data-ring:before,.data-ring:after,.data-ring i{content:"";position:absolute;border:1px solid;border-radius:50%}.data-ring:before{inset:18%}.data-ring:after{inset:36%;background:var(--ink)}.data-ring i:nth-child(1){width:15px;height:15px;background:var(--coral);top:3%;left:36%}.data-ring i:nth-child(2){width:11px;height:11px;background:#fff;right:9%;bottom:25%}.field-type{font-size:clamp(4rem,10vw,9rem);font-weight:600;line-height:.7;letter-spacing:-.08em;text-align:center}.field-type em{font-family:serif;font-weight:400}.project__info{border-top:1px solid currentColor;padding-top:1.2rem;display:grid;grid-template-columns:1fr 1fr;gap:1rem}.project__info h3{font-size:clamp(1.6rem,2.7vw,2.7rem);line-height:1;letter-spacing:-.045em;margin:0}.project__info p{font-size:.8rem;margin:0;max-width:17rem}.approach{background:var(--ink);color:var(--paper)}.approach__intro{display:grid;grid-template-columns:1fr 3fr;margin-bottom:clamp(5rem,10vw,10rem)}.approach__body{display:grid;grid-template-columns:1fr 2fr;gap:8vw}.statement{font-size:clamp(1.35rem,2vw,2rem);line-height:1.25;letter-spacing:-.04em;margin:0}.principles{list-style:none;padding:0;margin:0}.principles li{display:grid;grid-template-columns:60px 1fr;border-top:1px solid rgba(255,255,255,.25);padding:1.5rem 0 2.5rem}.principles li>span{font:.7rem var(--mono)}.principles h3{font-size:1.4rem;margin:0 0 .5rem}.principles p{color:#aaa9a4;margin:0;max-width:32rem}.contact{padding:clamp(6rem,11vw,11rem) var(--pad);display:grid;grid-template-columns:1fr 1fr;gap:10vw;background:var(--lime)}.contact__lead>p:nth-of-type(2){max-width:28rem;font-size:1.1rem;margin:2rem 0}.contact__lead>a{font:500 .78rem var(--mono)}.larkspur-form{padding-top:1.5rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 1rem}.form-wide{grid-column:1/-1}.larkspur-form label span{display:block;font:500 .65rem var(--mono);text-transform:uppercase;letter-spacing:.07em;margin-bottom:.5rem}.larkspur-form input,.larkspur-form textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--ink);border-radius:0;padding:.7rem 0;color:var(--ink);outline:none}.larkspur-form textarea{resize:vertical}.larkspur-form input:focus,.larkspur-form textarea:focus{border-bottom-width:2px}.larkspur-form ::placeholder{color:rgba(22,22,22,.5)}.submit-button{margin-top:2rem;width:100%;display:flex;justify-content:space-between;background:var(--ink);color:white;border:0;padding:1rem 1.2rem;cursor:pointer}.form-note{font-size:.65rem;color:rgba(22,22,22,.65);margin:1rem 0 0}.site-footer{padding:2.5rem var(--pad);display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end;border-top:1px solid var(--line);font:400 .65rem var(--mono);text-transform:uppercase}.site-footer p:nth-child(2){text-align:center}.site-footer p:last-child{text-align:right}.footer-logo{font-family:var(--sans);font-size:1rem;text-transform:none}.reveal{opacity:0;transform:translateY(35px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.reveal.is-visible{opacity:1;transform:none}@keyframes float{to{transform:translate(8%,-6%) scale(1.08)}}
@media(max-width:760px){.site-header{height:68px}.nav-toggle{display:flex;align-items:center;gap:.7rem;font-size:.8rem}.nav-toggle i,.nav-toggle i:before{width:18px;height:1px;background:currentColor;display:block}.nav-toggle i{position:relative}.nav-toggle i:before{content:"";position:absolute;top:5px}.site-nav{position:fixed;inset:68px 0 auto;background:var(--paper);padding:2rem var(--pad);display:none;flex-direction:column;align-items:stretch;border-bottom:1px solid}.site-nav.is-open{display:flex}.site-nav a{font-size:1.3rem}.hero{padding-top:calc(68px + 2rem)}.hero__main{grid-template-columns:1fr;gap:2rem}.hero h1{font-size:clamp(3.8rem,19vw,6rem)}.hero__eyebrow span:last-child{display:none}.hero__side{max-width:25rem}.hero__art{height:210px}.section-heading,.approach__intro,.approach__body,.contact{grid-template-columns:1fr}.section-heading{gap:1.5rem}.projects{grid-template-columns:1fr}.project,.project:nth-child(3){width:100%;min-height:500px;grid-column:auto}.project__info{grid-template-columns:1fr}.data-ring{width:55vw}.approach__intro{gap:1.5rem}.contact{gap:4rem}.site-footer{grid-template-columns:1fr;gap:1rem}.site-footer p:nth-child(2),.site-footer p:last-child{text-align:left}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.orb{animation:none}.reveal{opacity:1;transform:none;transition:none}}

/* Refined studio finish */
.site-header.is-scrolled{background:rgba(245,244,239,.92)}
.nav-cta{border-radius:3px;transition:background .25s,color .25s}
.nav-cta:hover{background:var(--ink);color:#fff}
.hero__eyebrow{letter-spacing:.1em}
.hero h1,.section h2,.contact h2{letter-spacing:-.055em;line-height:.92}
.hero h1{font-size:clamp(4rem,10vw,9.5rem)}
.hero h1 em{font-style:normal;font-weight:500;color:var(--blue)}
.hero__art{background:linear-gradient(115deg,#17253d,#253d5a);border-radius:2px;box-shadow:0 18px 50px rgba(23,26,31,.1)}
.hero__art::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:48px 48px}
.orb{filter:blur(8px);opacity:.68;animation-duration:12s}
.orb--three{background:#7892ad}
.project{filter:drop-shadow(0 16px 28px rgba(23,26,31,.07))}
.project a{padding:1.4rem;border-radius:2px}
.approach{background:#171d25}
.contact{background:#dfe4dc;border-top:1px solid var(--line)}
.submit-button{transition:background .25s}
.submit-button:hover{background:var(--blue)}

/* White canvas with focused gradient accents */
:root{--paper:#fff;--gradient-primary:linear-gradient(120deg,#223b70 0%,#6656a8 52%,#b45f72 100%);--gradient-soft:linear-gradient(135deg,#edf3ff 0%,#f3efff 52%,#fff0ed 100%);--gradient-cool:linear-gradient(135deg,#172b4d 0%,#315b7f 55%,#6e759c 100%);--gradient-sage:linear-gradient(135deg,#dce9df 0%,#b9cdbf 50%,#9db4b0 100%);--gradient-clay:linear-gradient(135deg,#f2d6cd 0%,#d79583 55%,#a95e68 100%)}
body{background:#fff}
.site-header.is-scrolled{background:rgba(255,255,255,.92)}
.site-nav{background-color:transparent}
.nav-cta{border:0;background:var(--gradient-primary);color:#fff;box-shadow:0 7px 20px rgba(52,55,108,.16)}
.nav-cta:hover{background:var(--gradient-primary);box-shadow:0 10px 25px rgba(52,55,108,.24)}
.hero h1 em,.section-heading h2,.contact h2{background:var(--gradient-primary);background-clip:text;-webkit-background-clip:text;color:transparent}
.hero__art{background:var(--gradient-cool)}
.text-link{border-image:var(--gradient-primary) 1}
.project--navy a{background:var(--gradient-cool)}
.project--lime a{background:var(--gradient-sage)}
.project--coral a{background:var(--gradient-clay)}
.northline-mark span{background:linear-gradient(135deg,#ffaf99,#e77790);background-clip:text;-webkit-background-clip:text;color:transparent}
.approach{background:#fff;color:var(--ink);border-block:1px solid var(--line)}
.approach h2{background:var(--gradient-primary);background-clip:text;-webkit-background-clip:text;color:transparent}
.principles li{border-top-color:var(--line)}
.principles p{color:var(--muted)}
.contact{background:linear-gradient(135deg,#fff 0%,#fff 55%,#f7f4ff 100%)}
.larkspur-form{padding:clamp(1.5rem,3vw,2.5rem);background:#fff;border:1px solid var(--line);box-shadow:0 22px 60px rgba(27,43,70,.08)}
.submit-button{background:var(--gradient-primary);border-radius:3px;box-shadow:0 9px 24px rgba(52,55,108,.18)}
.submit-button:hover{background:var(--gradient-primary);box-shadow:0 12px 30px rgba(52,55,108,.27)}
@media(max-width:760px){.site-nav{background:#fff}}
.nav-login{border:1px solid var(--line);border-radius:100px;padding:.65rem 1.15rem;transition:border-color .25s,background .25s}
.nav-login:hover{border-color:var(--ink);background:var(--gradient-soft)}
@media(max-width:760px){.site-nav{gap:1.25rem}.nav-login{text-align:center;padding:.8rem 1.15rem}}
