@import url('fonts.css');
:root{--ink:#0b0e14;--paper:#f1f0ec;--blue:#a0b5ff;--muted:#a6aab4;--line:rgba(255,255,255,.17)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:5.625rem}body{margin:0;background:var(--ink);color:var(--paper);font-family:'DM Sans',sans-serif;font-size:1rem;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:0.1875rem solid #7fa5ff;outline-offset:0.375rem}.skip{position:absolute;top:-5rem;left:1.25rem;background:var(--paper);color:var(--ink);padding:0.75rem;z-index:99}.skip:focus{top:0.9375rem}.header{position:absolute;top:0;left:0;width:100%;z-index:10;padding:1.8125rem 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:0.0625rem solid var(--line)}.brand{font-family:'Space Grotesk',sans-serif;font-size:1.375rem;font-weight:700;letter-spacing:-0.0625rem;white-space:nowrap}.brand>span{color:var(--blue)}.brand .brand-dot{color:#ffae70;margin-left:0.1875rem}nav{display:flex;gap:2.125rem;align-items:center;font-size:0.875rem}nav a:hover{color:var(--blue)}.nav-contact{border-left:0.0625rem solid var(--line);padding-left:2rem}.nav-contact span{margin-left:1.25rem}.hero{min-height:45rem;height:90svh;max-height:52.5rem;position:relative;overflow:hidden;isolation:isolate;background:#090c12}.hero.has-art{background-image:url('hero.webp');background-size:auto 85%;background-position:right center;background-repeat:no-repeat}.hero-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(9,12,18,.72),rgba(9,12,18,.14) 60%,transparent),linear-gradient(0deg,#090c12,transparent 22%)}.hero-copy{position:relative;z-index:2;padding:8rem 0 6.25rem 5%;width:50%;max-width:50rem;text-align:left}.eyebrow{font-size:0.75rem;font-weight:600;letter-spacing:0.125rem;line-height:1.5;margin:0 0 1.625rem}.hero .eyebrow{display:flex;align-items:center;gap:0.75rem}.hero .eyebrow>span{width:0.375rem;height:0.375rem;background:var(--blue);border-radius:50%}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:'Space Grotesk',sans-serif;font-weight:500;letter-spacing:-.055em;line-height:1.07}h1{font-size:clamp(3.125rem,5.2vw,5.25rem);line-height:1.1;margin-bottom:1.5rem}em{font-style:normal;color:var(--blue)}.hero-intro{font-size:1.0625rem;line-height:1.65;color:#c7cbd4;margin-bottom:1.75rem}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:2.1875rem;padding:0.875rem 1.4375rem;font-size:0.875rem;font-weight:600;border-radius:0.1875rem;transition:transform .2s,background .2s}.button:hover{transform:translateY(-0.1875rem)}.button-light{background:var(--paper);color:var(--ink)}.button-light:hover{background:#fff}.button-outline{border:0.0625rem solid #737986;background:transparent}.button-outline:hover{background:#202635}.hero-bottom{position:absolute;z-index:2;bottom:1.75rem;left:5%;right:5%;display:flex;justify-content:space-between;align-items:end;font-size:0.75rem;border-top:0.0625rem solid var(--line);padding-top:1.375rem}.hero-bottom p{margin:0;font-size:0.6875rem;letter-spacing:0.0625rem;line-height:1.8}.hero-bottom p span{color:var(--muted);letter-spacing:0;font-size:0.75rem}.hero-bottom a span{padding-left:1.875rem}.hero-bottom button{background:none;color:var(--muted);border:0;font-size:0.75rem;cursor:pointer;padding:0}.hero-bottom button span{padding-left:0.625rem}.light-section{background:var(--paper);color:var(--ink);padding:6.875rem 5%}.section-heading{display:grid;grid-template-columns:1.5fr 1fr;column-gap:8%;position:relative}.section-heading .eyebrow{grid-column:1/-1;grid-row:1}.section-heading h2{grid-column:1;grid-row:2;font-size:clamp(2.5rem,4.2vw,4.1875rem);margin-bottom:1.875rem}.section-heading h2 span{color:#747981}.section-heading>p:last-child{grid-column:2;grid-row:2;align-self:end;max-width:32.5rem;color:#5f636b;margin-bottom:0}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:2.625rem;margin-top:4.375rem}.service{border-top:0.0625rem solid #b9bbc0;padding-top:1.25rem;display:flex;flex-direction:column}.service-meta{display:flex;justify-content:space-between;gap:0.625rem;font-size:0.625rem;font-weight:600;letter-spacing:0.0625rem;margin-bottom:2.375rem}.service-meta>span:first-child{font-size:0.875rem;color:#6c7483}.service h3{font-size:clamp(1.6875rem,2.6vw,2.4375rem);margin-bottom:1.5rem}.service>p{color:#5f636b;font-size:0.9375rem;max-width:22.1875rem;flex:1}.tags{display:flex;flex-wrap:wrap;gap:0.5rem;list-style:none;padding:0;margin:1.25rem 0 2.25rem}.tags li{border:0.0625rem solid #cccdd0;padding:0.1875rem 0.625rem;border-radius:0.125rem;font-size:0.6875rem}.service>a{font-size:0.875rem;font-weight:600;border-top:0.0625rem solid #d3d4d7;padding-top:1.0625rem;display:flex;justify-content:space-between}.service>a:hover{color:#305dc5}.dark-section{padding:6.875rem 5%}.dark-section .section-heading>p:last-child{color:var(--muted)}.product{display:grid;grid-template-columns:1.4fr 1fr;margin-top:4.0625rem;border:0.0625rem solid var(--line);background:#10141e}.product-title{padding:3rem}.status{display:flex;align-items:center;gap:0.5625rem;font-size:0.6875rem;letter-spacing:0.09375rem;color:#b8c2dd}.status i{width:0.3125rem;height:0.3125rem;border-radius:50%;background:#c2a37e}.product h3{font-size:clamp(2.8125rem,5vw,4.75rem);margin:1.625rem 0 1.375rem;display:flex;gap:4.0625rem}.product h3 span{font-size:2.375rem;color:var(--blue)}.product-title p{max-width:29.375rem;color:var(--muted);font-size:0.9375rem;margin-bottom:1.875rem}.product-note{padding:3rem;border-left:0.0625rem solid var(--line);display:flex;justify-content:space-between;flex-direction:column}.large-number{font-family:'Space Grotesk',sans-serif;font-size:8.75rem;letter-spacing:-0.75rem;line-height:1;color:#292f3e}.product-note p{font-size:1.5rem;line-height:1.3;margin:0}.product-note p span{color:var(--muted)}.approach{display:grid;grid-template-columns:1fr 1fr;gap:12%}.approach h2{font-size:clamp(2.625rem,4vw,4.0625rem);margin-bottom:1.875rem}.personal{font-size:1rem;color:#5f636b;max-width:26.875rem}.steps{padding:0;list-style:none;margin:0}.steps li{display:flex;gap:1.875rem;border-top:0.0625rem solid #bdc0c5;padding:1.5625rem 0}.steps li>span{font-size:0.75rem;color:#747981;padding-top:0.25rem}.steps h3{font-size:1.4375rem;letter-spacing:-.03em;margin-bottom:0.625rem}.steps p{font-size:0.9375rem;color:#5f636b;margin-bottom:0}.contact{position:relative;text-align:center;background:#121722;padding-top:6.25rem;padding-bottom:6.875rem}.contact h2{font-size:clamp(3.625rem,6.5vw,6.25rem);margin-bottom:2.25rem}.email{font-size:clamp(1.1875rem,2.5vw,2.125rem);border-bottom:0.0625rem solid #687897;padding-bottom:0.625rem;display:inline-block;line-height:1.3;word-break:break-word}.email span{margin-left:1.875rem;color:var(--blue)}.contact>p:not(.eyebrow){color:var(--muted);margin:1.625rem 0}footer{padding:2.1875rem 5%;display:flex;gap:1.5625rem;align-items:center;justify-content:space-between;color:var(--muted);font-size:0.75rem}footer .brand{color:var(--paper);font-size:1.125rem}footer p{margin:0}.reveal{opacity:0;transform:translateY(1.25rem);transition:opacity .7s,transform .7s}.reveal.visible{opacity:1;transform:translateY(0)}.hero.has-art{animation:art-drift 16s ease-in-out infinite alternate}@keyframes art-drift{from{background-position:48% center}to{background-position:52% center}}body.motion-off *,body.motion-off *:before,body.motion-off *:after{animation:none!important;transition:none!important}body.motion-off .reveal{opacity:1;transform:none}@media(min-width:1600px){.header,.hero-copy,.light-section,.dark-section,footer{padding-left:max(5%,calc((100vw - 90rem)/2));padding-right:max(5%,calc((100vw - 90rem)/2))}}@media(max-width:900px){.header{padding:1.375rem 5%}.brand{font-size:1.1875rem}nav{gap:1.1875rem}nav>a:not(.nav-contact){display:none}.nav-contact{padding-left:0;border:0;font-size:0.75rem}.hero{min-height:45rem;max-height:52.5rem}.hero-copy{padding-top:8.125rem;width:64%}.hero.has-art{background-position:65% center}.hero-shade{background:linear-gradient(90deg,rgba(9,12,18,.87),rgba(9,12,18,.45)),linear-gradient(0deg,#090c12,transparent 35%)}h1{font-size:clamp(2.75rem,6.5vw,3.875rem)}.hero-bottom{font-size:0.6875rem}.hero-bottom>a{display:none}.section-heading{display:block}.section-heading .eyebrow{margin-bottom:1.875rem}.section-heading h2{font-size:3rem}.services{gap:1.5625rem}.service-meta{font-size:0.5625rem}.service h3{font-size:1.75rem}.light-section,.dark-section{padding-top:5rem;padding-bottom:5rem}.product-title,.product-note{padding:2rem}.approach{gap:7%}footer{flex-wrap:wrap}}@media(max-width:640px){.hero{min-height:45.625rem;height:48.75rem;max-height:48.75rem}.header .brand{font-size:1.125rem}.nav-contact{max-width:9.375rem;text-align:right;line-height:1.4}.nav-contact span{margin-left:0.4375rem}.hero-copy{padding:7.5rem 6% 7.8125rem;width:100%;max-width:none}h1{font-size:clamp(2.125rem,9.6vw,3.375rem)}.hero-intro{font-size:1rem}.hero-bottom{bottom:1.375rem;gap:1.25rem}.hero-bottom button{max-width:8.4375rem;text-align:right;line-height:1.6}.hero-bottom p{font-size:0.625rem}.hero.has-art{background-size:auto 61%;background-position:71% bottom 4.0625rem;animation:none}.light-section,.dark-section{padding:4.0625rem 6%}.section-heading h2{font-size:2.4375rem}.services{grid-template-columns:1fr;margin-top:2.8125rem;gap:2.8125rem}.service-meta{font-size:0.6875rem;margin-bottom:1.5rem}.service h3{font-size:2.25rem}.service>p{font-size:1rem;max-width:none}.tags{margin:0.625rem 0 1.4375rem}.tags li{font-size:0.75rem}.product{grid-template-columns:1fr;margin-top:2.1875rem}.product-title{padding:1.6875rem}.product h3{font-size:3.25rem;justify-content:space-between;gap:0.625rem}.product-note{padding:1.4375rem 1.6875rem;border-left:0;border-top:0.0625rem solid var(--line);flex-direction:row;align-items:center;gap:1.5625rem}.large-number{font-size:5rem;letter-spacing:-0.375rem}.product-note p{font-size:1.125rem}.approach{display:block}.steps{margin-top:2.1875rem}.steps h3{font-size:1.4375rem}.contact h2{font-size:3.4375rem}.email{font-size:1.3125rem}.email span{margin-left:0.4375rem}footer{display:grid;grid-template-columns:1fr auto;padding:1.75rem 6%;gap:1rem}footer .brand{font-size:1.0625rem}footer p{grid-row:2}footer>span{grid-column:1/-1;font-size:0.6875rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
.header{background:transparent;min-height:5.25rem}
@media(min-width:1600px){.hero-copy{padding-right:0;width:50%;max-width:none}}
@media(max-width:640px){.header{min-height:4.5rem}.hero-shade{background:linear-gradient(180deg,#090c12 0%,rgba(9,12,18,.85) 39%,rgba(9,12,18,.08) 70%,#090c12 96%)}.hero-intro{font-size:0.9375rem}.hero-bottom button{max-width:8.75rem}.section-heading>p:last-child{margin-top:1.25rem}.contact h2{font-size:clamp(2.4375rem,11vw,3.4375rem)}}
@media(max-width:360px){.header .brand{font-size:1rem}.nav-contact{font-size:0.6875rem;max-width:8.125rem}.hero-bottom p{font-size:0.5625rem}.hero-bottom button{font-size:0.6875rem}h1{font-size:2.125rem}}

.hero.has-art{animation:none}
@media(min-width:901px){.hero.has-art{background-size:110% auto;background-position:right calc(50% + 2.625rem)}.hero-shade{background:linear-gradient(90deg,rgba(9,12,18,.82) 0%,rgba(9,12,18,.48) 41%,transparent 66%),linear-gradient(0deg,#090c12,transparent 25%)}}


/* Wide-screen layout uses the same page margins as the hero footer. */
.hero.has-art{background-image:none}
.hero-art{position:absolute;z-index:0;top:6.5rem;bottom:5.625rem;left:0;right:0;background:url(hero.webp) no-repeat right center;background-size:100% auto;overflow:hidden}
@media(min-width:1600px){.header,.light-section,.dark-section,footer{padding-left:5%;padding-right:5%}.hero-copy{padding-left:5%;padding-right:0;width:50%}}
@media(max-width:900px){.hero-art{background-size:auto 100%;background-position:65% center}}
@media(max-width:640px){.hero-art{top:11.25rem;bottom:5.9375rem;background-size:auto 100%;background-position:71% center}}


/* Keep the entire artwork visible at every screen size. */
.hero-art{background-size:contain;background-position:right center}
@media(max-width:900px){.hero-art{background-size:contain;background-position:right center}}
@media(max-width:640px){.hero-art{background-size:contain;background-position:center bottom}}

.hero-art video{display:block;width:100%;height:100%;object-fit:contain;object-position:right center}
@media(max-width:640px){.hero-art video{object-position:center bottom}}

/* One proportional desktop composition from Full HD through 4K. */
@media(min-width:901px){
 html{font-size:calc(100vw / 120)}
 .hero{height:calc(100vw / 3 + 12.125rem);min-height:0;max-height:none}
 .hero-art{top:6.5rem;bottom:auto;height:calc(100vw / 3);background-size:100% 100%;background-position:center}
 .hero-copy{max-width:none;width:50%;padding:8rem 0 6.25rem 5%}
 .header,.light-section,.dark-section,footer{padding-left:5%;padding-right:5%}
}
@media(min-width:901px){.hero-art{height:auto;aspect-ratio:3 / 1;background-size:100% auto;background-position:top center}}

.legal-header{display:flex;align-items:center;justify-content:space-between;padding:2rem 5%;border-bottom:1px solid var(--line)}.legal-header>a:last-child{font-size:.875rem}.legal-content{width:90%;max-width:65rem;margin:4rem auto 6rem}.legal-content h1{font-size:3.5rem}.legal-content h2{font-size:1.7rem;margin:2.5rem 0 1rem;letter-spacing:-.03em}.legal-content p{color:#c7cbd4;font-size:1rem;line-height:1.8}.legal-content a{text-decoration:underline;text-underline-offset:.2em}.legal-content .legal-date{font-size:.875rem;color:var(--muted)}footer{flex-wrap:wrap}@media(max-width:640px){.legal-content h1{font-size:2.5rem}.legal-header .brand{font-size:1rem}}
/* Mobile: the artwork follows the copy, with its rings centered at full size. */
@media(max-width:640px){
 .hero{height:auto;min-height:0;max-height:none}
 .hero-copy{padding-bottom:2rem}
 .hero-art{position:relative;top:auto;bottom:auto;left:auto;right:auto;width:200%;height:auto;aspect-ratio:3 / 1;margin-left:-100%;background-size:100% auto;background-position:center}
 .hero-shade{display:none}
 .hero-bottom{position:relative;left:auto;right:auto;bottom:auto;margin:0 6%;padding:1.375rem 0;align-items:center}
}
@media(max-width:640px){.hero{display:flex;flex-direction:column}.hero-copy{order:1}.hero-art{order:2;width:170%;margin-left:-70%}.hero-bottom{order:3}}
