@font-face{font-family:PoppinsLocal;src:url('/fonts/Poppins-SemiBold.ttf') format('truetype');font-display:swap;font-weight:600}
@font-face{font-family:InterLocal;src:url('/fonts/Inter-Variable.ttf') format('truetype');font-display:swap;font-weight:100 900}
:root{--blue:#0b57d0;--paper:#f6f5f0;--ink:#111;--rule:#c9c9c4;--white:#fff;--gutter:clamp(1.25rem,4vw,3.25rem);--display:PoppinsLocal,sans-serif;--body:InterLocal,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;width:100%;height:100%;object-fit:cover}.skip{position:fixed;left:1rem;top:-5rem;z-index:300;background:#fff;padding:.75rem}.skip:focus{top:1rem}.nav{height:74px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.4);position:absolute;inset:0 0 auto;z-index:10;color:#fff}.brand{font-family:var(--display);font-size:1.1rem;letter-spacing:-.03em}.brand span{font-family:var(--body);font-weight:400}.nav nav{display:flex;align-items:center;gap:2rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}.nav button{color:inherit;background:none;border:0;text-transform:uppercase;font-size:.78rem;letter-spacing:.08em}.menu-toggle,.menu-close{display:none}.review-link{border-bottom:1px solid currentColor!important;padding:.35rem 0}.hero{height:100vh;height:100svh;min-height:720px;background:var(--blue);color:#fff;position:relative;overflow:hidden;padding:clamp(7rem,13vh,9rem) var(--gutter) 0}.hero-name h1{font-family:var(--display);font-size:clamp(5rem,14vw,12.5rem);line-height:.78;letter-spacing:-.075em;margin:0;text-transform:none}.hero-copy{position:absolute;left:var(--gutter);bottom:clamp(2rem,5vh,4rem);width:min(28rem,33vw);z-index:2}.hero-copy p{margin:0 0 1.2rem}.hero-copy a{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid;padding-bottom:.3rem}.hero-image{position:absolute;width:70%;height:49%;right:0;bottom:0;margin:0;overflow:hidden}.hero-image:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,87,208,.8),transparent 35%);z-index:1}.hero-image figcaption{position:absolute;right:1rem;bottom:1rem;z-index:2;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}.section{padding:clamp(5rem,9vw,8rem) var(--gutter)}.section-title{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:clamp(2rem,8vw,9rem);margin-bottom:4rem}.section-title>p,.work-head>p,.process-heading>p,.about>div>p:first-child,.contact>p{text-transform:uppercase;letter-spacing:.12em;font-size:.72rem}.section h2,.contact h2{font-family:var(--display);font-size:clamp(2.5rem,5vw,4.8rem);line-height:1.02;letter-spacing:-.055em;margin:0}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule);border-left:1px solid var(--rule)}.service-grid article{min-height:360px;padding:2rem;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);display:flex;flex-direction:column}.service-grid span{font-size:.75rem}.service-grid h3{font-family:var(--display);font-size:2rem;margin:auto 0 1rem;letter-spacing:-.04em}.service-grid p{max-width:22rem;margin:0}.work{background:#fff}.work-head{display:grid;grid-template-columns:.55fr 1.15fr .7fr;gap:clamp(1.5rem,6vw,7rem);align-items:end;margin-bottom:7rem}.work-head h2{font-size:clamp(2.8rem,5.5vw,5.3rem)}.work-head>p:last-child{margin:0}.project{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,.65fr);gap:clamp(2rem,5vw,6rem);align-items:end;margin-bottom:8rem}.project figure{height:min(64vw,720px);margin:0}.project>div{padding-bottom:1rem}.project span{text-transform:uppercase;letter-spacing:.12em;font-size:.7rem}.project h3{font-family:var(--display);font-size:clamp(2rem,4vw,3.6rem);line-height:1.05;letter-spacing:-.05em;margin:.8rem 0}.project.offset{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);margin-left:13vw}.project.offset figure{order:2;height:min(52vw,620px)}.project.reverse figure{order:2}.process{background:#151515;color:#fff}.process-heading{display:grid;grid-template-columns:.6fr 1.4fr;margin-bottom:5rem}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #555;border-left:1px solid #555}.steps article{min-height:330px;padding:2rem;border-right:1px solid #555;border-bottom:1px solid #555;display:flex;flex-direction:column}.steps b{font-size:.8rem}.steps h3{font-family:var(--display);font-size:2.4rem;margin:auto 0 .75rem}.steps p{color:#c9c9c9;margin:0}.about{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(3rem,8vw,9rem);align-items:center}.about figure{height:min(60vw,680px);margin:0}.about h2{margin:.5rem 0 2rem}.about div p{max-width:35rem}.contact{background:var(--blue);color:#fff;padding:clamp(6rem,12vw,11rem) var(--gutter);text-align:center}.contact h2{font-size:clamp(3rem,8vw,7.5rem)}.contact button{margin:2.5rem auto 1rem;background:#fff;color:#111;border:1px solid #fff;padding:1rem 1.5rem;text-transform:uppercase;letter-spacing:.1em;font-size:.75rem}.contact small{display:block;opacity:.75}footer{padding:2rem var(--gutter);display:grid;grid-template-columns:1fr auto auto;gap:2rem;border-top:1px solid var(--rule);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}dialog{max-width:34rem;border:0;padding:3rem;background:#fff;box-shadow:0 20px 80px #0004}dialog::backdrop{background:#000b}dialog button{float:right;background:none;border:1px solid #111;padding:.6rem 1rem}dialog h2{font-family:var(--display);font-size:2.4rem;line-height:1.05}

/* Altuz reference spine: matching frame proportions and section geometry. */
.nav .review-link{background:#fff;color:#111;border:1px solid #fff!important;border-radius:999px;padding:.8rem 1.25rem}
.intro{background:#fff;min-height:1336px;padding:76px 52px 70px}
.intro .section-title{display:block;margin-bottom:52px}
.intro .section-title>p{display:none}
.intro .section-title h2{max-width:620px;font-family:var(--body);font-weight:400;font-size:clamp(2.75rem,4.25vw,3.75rem);line-height:1.08;letter-spacing:-.045em}
.service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;border:0}
.service-grid article{min-height:440px;padding:20px;border:1px solid #b8d3ff;border-radius:16px;position:relative}
.service-grid span{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#111;color:#fff;font-weight:600}
.service-grid h3{font-family:var(--body);font-size:1.55rem;font-weight:400;letter-spacing:-.03em;margin:22px 0 0}
.service-grid p{margin-top:auto;color:#666;max-width:33rem}
.service-footer{display:flex;align-items:center;justify-content:space-between;gap:3rem;margin-top:50px;color:#666}
.service-footer p{margin:0;max-width:60rem}
.service-footer button{border:0;border-radius:999px;background:#111;color:#fff;padding:1rem 1.4rem;white-space:nowrap}
.work{min-height:1764px;padding:76px 52px}
.work-head{grid-template-columns:.62fr 1.38fr;align-items:start;gap:3rem;margin-bottom:86px}
.work-head h2{font-family:var(--body);font-weight:400;font-size:clamp(2.5rem,3.4vw,3.6rem);line-height:1.12;letter-spacing:-.045em;max-width:710px}
.work-head>p:last-child{display:none}
.project-grid{display:grid;grid-template-columns:320px minmax(0,1fr);column-gap:180px;row-gap:108px;align-items:start}
.project-grid .project{display:block;margin:0}
.project-grid .project figure{margin:0 0 25px;border-radius:16px;overflow:hidden}
.project-grid .project-small figure{height:320px}
.project-grid .project-large figure{height:500px}
.project-grid .project:nth-child(3){grid-column:1;width:676px}
.project-grid .project:nth-child(4){grid-column:2;width:320px;justify-self:end}
.project-grid .project:nth-child(3) figure{height:500px}
.project-grid .project h3{font-family:var(--body);font-size:1.45rem;font-weight:400;letter-spacing:-.035em;margin:.5rem 0}
.project-grid .project p{margin:0;color:#666}
.process{background:#fff;color:#111;padding:76px 52px 80px}
.process-heading{display:block;margin-bottom:52px}
.process-heading>p{display:none}
.process-heading h2{font-family:var(--body);font-size:clamp(2.75rem,4.25vw,3.75rem);font-weight:400;letter-spacing:-.045em}
.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:52px;border:0}
.steps article{min-height:170px;padding:0;border:0;display:block}
.steps b{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#111;color:#fff;margin-bottom:22px}
.steps h3{font-family:var(--body);font-size:1.55rem;font-weight:400;margin:0 0 .4rem}
.steps p{color:#666;margin:0;max-width:22rem}
@media(max-width:768px){.nav{height:64px}.menu-toggle{display:block}.nav nav{position:fixed;inset:0;background:#111;color:#fff;display:flex;flex-direction:column;align-items:flex-start;padding:6rem 1.5rem 2rem;font-size:1.3rem;transform:translateX(100%);transition:transform .3s;z-index:30}.nav nav.open{transform:none}.nav nav .menu-close{display:block;position:absolute;right:1.5rem;top:1.5rem}.hero{height:100vh;height:100svh;min-height:680px;padding-top:6.5rem}.hero-name h1{font-size:clamp(4.15rem,21vw,7rem);line-height:.82}.hero-copy{width:calc(100% - 2.5rem);bottom:2rem}.hero-image{width:100%;height:46%;opacity:.8}.hero-image:before{background:linear-gradient(180deg,var(--blue),transparent 40%,rgba(0,0,0,.15))}.hero-image figcaption{display:none}.section-title,.work-head,.process-heading{grid-template-columns:1fr;gap:1.25rem}.service-grid,.steps{grid-template-columns:1fr}.service-grid article,.steps article{min-height:240px}.project,.project.offset{grid-template-columns:1fr;margin-left:0;margin-bottom:5rem}.project figure,.project.offset figure{order:0;height:65vw}.project.reverse figure{order:0}.about{grid-template-columns:1fr}.about figure{height:100vw}footer{grid-template-columns:1fr;gap:.5rem}}

@media(max-width:768px){
  .nav{padding-inline:1.25rem}
  .nav .brand{max-width:12rem}
  .nav .review-link{background:#fff;color:#111;border-color:#fff!important;padding:.8rem 1rem}
  .hero{padding:6.5rem 1.25rem 0}
  .hero-name h1{font-size:clamp(3.7rem,17vw,7rem);line-height:.84;letter-spacing:-.07em}
  .hero-copy{left:1.25rem;width:calc(100% - 2.5rem);bottom:1.7rem}
  .intro{min-height:auto;padding:64px 20px}
  .intro .section-title{margin-bottom:40px}
  .intro .section-title h2{font-size:clamp(2.4rem,10vw,4rem)}
  .service-grid{grid-template-columns:1fr;gap:16px}
  .service-grid article{min-height:280px;padding:20px}
  .service-footer{align-items:flex-start;flex-direction:column;margin-top:32px;gap:1.25rem}
  .work{min-height:auto;padding:64px 20px}
  .work-head{grid-template-columns:1fr;gap:1rem;margin-bottom:52px}
  .work-head h2{font-size:clamp(2.4rem,10vw,4rem)}
  .project-grid{grid-template-columns:1fr;gap:60px}
  .project-grid .project,.project-grid .project:nth-child(3),.project-grid .project:nth-child(4){grid-column:auto;width:auto;justify-self:stretch}
  .project-grid .project-small figure,.project-grid .project-large figure,.project-grid .project:nth-child(3) figure{height:78vw;max-height:620px}
  .process{padding:64px 20px}
  .process-heading{margin-bottom:40px}
  .process-heading h2{font-size:clamp(2.4rem,10vw,4rem)}
  .steps{grid-template-columns:1fr;gap:42px}
  .steps article{min-height:auto;border-top:1px solid #dedede;padding-top:20px}
}

@media(max-width:420px){
  .nav .brand{font-size:.95rem}
  .hero-name h1{font-size:16.2vw}
  .hero-image{height:45%}
  .hero-copy p{max-width:20rem;font-size:.96rem}
  .section h2,.contact h2{letter-spacing:-.045em}
}

.brand,.nav nav a,.nav nav button,.hero-copy a{display:inline-flex;align-items:center;min-height:44px}
.error a{display:inline-flex;align-items:center;min-height:44px}
.menu-toggle,.contact a{align-items:center;min-height:44px}
.contact a{display:inline-flex;justify-content:center}
.nav nav .menu-close{display:none}
@media(max-width:768px){.menu-toggle,.nav nav .menu-close{display:inline-flex}}
