@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400&family=Inter:wght@300;400;500&family=Instrument+Serif:ital@0;1&display=swap');

:root { --paper:#f2f2f0; --ink:#383a3c; --graphite:#343638; --brand-gray:#77797b; --muted:var(--brand-gray); --line:rgba(56,58,60,.22); --brand-orange:#f58200; --hero-progress:0; font-family:Inter,Arial,sans-serif; color:var(--ink); background:var(--paper); font-synthesis:none; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--paper); }
body { margin:0; min-width:320px; background:var(--paper); color:var(--ink); overflow-x:hidden; }
body.menu-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button,input,textarea { font:inherit; color:inherit; }
img { display:block; max-width:100%; }
::selection { color:var(--paper); background:var(--ink); }
.skip-link { position:fixed; z-index:100; left:1rem; top:-4rem; background:var(--ink); color:white; padding:.8rem 1rem; }
.skip-link:focus { top:1rem; }
.site-header { position:fixed; inset:0 0 auto 0; z-index:30; display:flex; justify-content:space-between; align-items:flex-start; padding:1rem 1.2rem; pointer-events:none; }
.site-header > * { pointer-events:auto; }
.brand { width:116px; height:42px; display:flex; align-items:center; }
.brand img { width:100%; height:auto; }
.desktop-nav { display:flex; flex-direction:column; align-items:flex-end; gap:1px; font:400 .64rem/1.38 DM Mono,monospace; text-transform:lowercase; }
.desktop-nav a { min-height:20px; padding:1px 0 1px 20px; transition:color .2s ease; }
.desktop-nav a:hover,.desktop-nav a:focus-visible { color:var(--brand-orange); }
.desktop-nav a span { display:inline-block; transition:transform .2s ease; }
.desktop-nav a:hover span,.desktop-nav a:focus-visible span { transform:translate(3px,-2px); }
.menu-toggle { display:none; border:0; background:none; padding:.6rem; text-transform:uppercase; font:400 .65rem DM Mono,monospace; }
.menu-toggle i { display:inline-block; width:1.3rem; height:1px; background:currentColor; margin:0 0 3px 7px; }
.mobile-menu { display:none; }
.hero-scroll { height:300svh; }
.hero-sticky { position:sticky; top:0; height:100svh; min-height:0; overflow:hidden; background:var(--paper); border:9px solid #d8d9d8; border-radius:20px; }
.frame-line { position:absolute; inset:0; border:1px solid rgba(255,255,255,.7); border-radius:12px; pointer-events:none; }
#filament { position:absolute; inset:0; width:100%; height:100%; }
.hero-copy { position:absolute; z-index:2; left:1rem; bottom:1.5rem; max-width:31rem; }
.hero-copy h1,.hero-copy h2 { margin:.65rem 0; font-size:clamp(2.25rem,4.2vw,5.7rem); line-height:.82; letter-spacing:-.07em; font-weight:400; text-transform:uppercase; }
.hero-copy em { font-family:Instrument Serif,Georgia,serif; font-weight:400; text-transform:none; }
.hero-copy i { font:300 .82em DM Mono,monospace; letter-spacing:-.1em; }
.hero-a { opacity:calc(1 - var(--hero-progress) * 2.2); transform:translateX(calc(var(--hero-progress) * -40px)); }
.hero-b { opacity:clamp(0,calc((var(--hero-progress) - .46) * 3.4),1); transform:translateX(calc((1 - var(--hero-progress)) * -35px)); bottom:16vh; }
.hero-b h2 { font-size:clamp(2.1rem,3.7vw,4.7rem); line-height:.86; }
.hero-b p { max-width:310px; margin:2rem 0 0; font-size:.68rem; line-height:1.5; }
.micro,.kicker,.hero-meta { font:400 .58rem/1.45 DM Mono,monospace; letter-spacing:.01em; text-transform:uppercase; }
.micro,.kicker { color:var(--brand-orange); }
.hero-meta { position:absolute; z-index:2; top:4.2rem; }
.meta-left { left:1rem; }
.meta-right { right:20.5%; top:50%; display:grid; grid-template-columns:auto 9vw auto; gap:12px; align-items:center; }
.meta-right i { height:1px; background:var(--line); }
.hero-cta { position:absolute; z-index:3; bottom:1.2rem; left:50%; transform:translateX(-50%); }
.outline-button { display:inline-flex; justify-content:center; align-items:center; min-height:36px; padding:0 1.5rem; border:1px solid rgba(23,23,21,.38); border-radius:100px; background:transparent; font:400 .62rem DM Mono,monospace; letter-spacing:.03em; text-transform:uppercase; transition:.25s ease; cursor:pointer; }
.outline-button:hover,.outline-button:focus-visible { color:var(--paper); background:var(--ink); outline:none; }
.scroll-mark { position:absolute; bottom:1.1rem; left:1rem; font:.7rem DM Mono,monospace; }
.manifest { min-height:100vh; padding:12vh 6vw 8vh; display:grid; grid-template-columns:15% 1fr 28%; align-items:center; border-bottom:1px solid var(--line); }
.manifest > span { font:.65rem DM Mono,monospace; }
.manifest h2 { margin:0; font-size:clamp(3rem,7.7vw,9rem); line-height:.78; letter-spacing:-.075em; font-weight:300; }
.manifest h2 em { display:inline-block; font-family:Instrument Serif,serif; font-weight:400; }
.manifest p { max-width:260px; align-self:end; font-size:.78rem; line-height:1.6; }
.industries { padding:12vh 1.2rem; min-height:120vh; }
.industries.compact { padding-top:5vh; }
.industries header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:12vh; }
.industries h2,.services-section h2,.process-section h2,.about-teaser h2 { margin:0; font-weight:300; font-size:clamp(2.7rem,6vw,7rem); line-height:.84; letter-spacing:-.065em; }
.industries h2 em,.services-section h2 em,.process-section h2 em,.about-teaser h2 em { font-family:Instrument Serif,serif; font-weight:400; }
.industry-stage { display:grid; grid-template-columns:39% 1fr; gap:4vw; min-height:70vh; align-items:center; }
.industry-preview { position:sticky; top:17vh; height:59vh; overflow:hidden; background:#dedfdf; }
.industry-preview::after { content:''; position:absolute; inset:0; background:linear-gradient(100deg,rgba(10,10,9,.15),transparent 60%); }
.industry-preview img { width:100%; height:100%; object-fit:cover; filter:saturate(.7); transition:opacity .25s ease,transform .6s cubic-bezier(.2,.8,.2,1); }
.industry-preview span { position:absolute; z-index:2; right:1rem; bottom:1rem; width:8px; height:8px; background:var(--brand-orange); border-radius:50%; box-shadow:0 0 18px rgba(245,130,0,.7); }
.industry-list { border-top:1px solid var(--line); }
.industry-row { display:grid; grid-template-columns:3rem 1fr minmax(140px,230px) auto; gap:1rem; align-items:center; min-height:9.2rem; border-bottom:1px solid var(--line); transition:padding .3s ease,opacity .3s ease; }
.industry-list:hover .industry-row:not(:hover) { opacity:.34; }
.industry-row:hover,.industry-row:focus-visible { padding-left:1rem; outline:none; }
.industry-row > span,.industry-row small,.industry-row b { font:400 .58rem/1.45 DM Mono,monospace; }
.industry-row strong { font-weight:300; font-size:clamp(2.2rem,5vw,6rem); letter-spacing:-.06em; }
.industry-row b { opacity:0; transform:translateX(-7px); transition:.25s ease; }
.industry-row:hover b,.industry-row:focus-visible b { opacity:1; transform:none; }
.selected-work { padding:14vh 1.2rem 4vh; background:var(--graphite); color:var(--paper); }
.selected-work > .kicker { margin-bottom:13vh; }
.project-strip { min-height:100vh; display:grid; grid-template-columns:42% 58%; align-items:center; border-top:1px solid rgba(255,255,255,.22); }
.project-copy { padding:3rem 5vw 3rem 0; }
.project-copy > span { font:.6rem DM Mono,monospace; }
.project-copy h2 { margin:6rem 0 2rem; font-size:clamp(2.8rem,5.4vw,6.2rem); line-height:.83; letter-spacing:-.065em; font-weight:300; }
.project-copy h2 em { font-family:Instrument Serif,serif; font-weight:400; }
.project-copy p { max-width:340px; color:#c0c1c2; font-size:.83rem; line-height:1.6; }
.project-copy a { display:inline-block; margin-top:3rem; padding-bottom:.35rem; border-bottom:1px solid; font:.65rem DM Mono,monospace; }
.project-image { position:relative; height:74vh; overflow:hidden; background:#282a2c; }
.project-image > img:first-child { width:100%; height:100%; object-fit:cover; filter:saturate(.72); transition:transform 1.2s cubic-bezier(.2,.75,.2,1),filter .4s; }
.project-image:hover > img:first-child { transform:scale(1.035); filter:saturate(.95); }
.project-logo { position:absolute; left:2rem; bottom:2rem; width:125px; max-height:42px; object-fit:contain; object-position:left; filter:none; }
.services-section { padding:14vh 1.2rem; }
.services-section header { display:grid; grid-template-columns:25% 1fr; margin-bottom:12vh; }
.service-list { border-top:1px solid var(--line); }
.service-row { width:100%; min-height:8rem; display:grid; grid-template-columns:5rem 1fr 32% 2rem; gap:1rem; align-items:center; border:0; border-bottom:1px solid var(--line); background:none; text-align:left; cursor:pointer; }
.service-row span,.service-row b { font:.62rem DM Mono,monospace; }
.service-row strong { font-size:clamp(1.4rem,3.2vw,3.5rem); font-weight:300; letter-spacing:-.045em; }
.service-row em { opacity:0; transform:translateY(8px); font:400 1rem Instrument Serif,serif; transition:.25s; }
.service-row[aria-expanded="true"] em { opacity:1; transform:none; }
.process-section { min-height:100vh; padding:14vh 1.2rem; background:#e2e3e2; display:grid; align-content:space-between; }
.process-section > h2 { justify-self:end; width:74%; }
.process-line { display:grid; grid-template-columns:repeat(5,1fr); margin-top:15vh; }
.process-line div { display:grid; grid-template-columns:auto 1fr; grid-template-rows:1fr auto; gap:1.4rem .6rem; align-items:center; }
.process-line span { font:.6rem DM Mono,monospace; }
.process-line i { display:block; height:1px; background:var(--ink); }
.process-line strong { grid-column:1/3; font-size:clamp(.75rem,1.1vw,1rem); font-weight:400; }
.about-teaser { padding:18vh 1.2rem; display:grid; grid-template-columns:25% 1fr; min-height:90vh; }
.about-teaser > div { max-width:1000px; }
.about-teaser p:not(.kicker) { max-width:470px; margin:4rem 0; line-height:1.7; }
.about-teaser a { font:.65rem DM Mono,monospace; border-bottom:1px solid; padding-bottom:.35rem; }
.contact-section { min-height:100vh; background:var(--brand-orange); padding:11vh 1.2rem 5vh; display:grid; grid-template-columns:1fr 36%; align-items:end; }
.contact-section > .kicker { position:absolute; align-self:start; }
.contact-section h2 { margin:0; font-weight:300; font-size:clamp(4rem,10vw,12rem); line-height:.72; letter-spacing:-.08em; }
.contact-section h2 em { font-family:Instrument Serif,serif; font-weight:400; }
.contact-form { align-self:end; display:grid; gap:1.5rem; }
.contact-form label { display:grid; gap:.5rem; border-bottom:1px solid rgba(23,23,21,.5); padding-bottom:.5rem; font:.58rem DM Mono,monospace; }
.contact-form input,.contact-form textarea { width:100%; border:0; outline:0; resize:none; background:transparent; font:400 1rem/1.4 Inter,sans-serif; }
.contact-form .outline-button { justify-self:start; }
.form-status { min-height:1.3rem; margin:0; font-size:.72rem; }
.site-footer { padding:4rem 1.2rem 1rem; background:var(--graphite); color:var(--paper); }
.footer-top,.footer-bottom { display:flex; justify-content:space-between; align-items:center; }
.footer-top { border-bottom:1px solid rgba(255,255,255,.25); padding-bottom:3rem; }
.footer-top img { width:130px; }
.footer-top a,.footer-bottom { font:.6rem DM Mono,monospace; }
.footer-word { overflow:hidden; font-size:clamp(5.7rem,17vw,20rem); line-height:.9; letter-spacing:-.09em; font-weight:500; }
.footer-bottom { padding-top:1rem; }
.page-hero { position:relative; min-height:85vh; padding:16vh 1.2rem 8vh; display:grid; grid-template-columns:25% 1fr; align-content:end; overflow:hidden; border-bottom:1px solid var(--line); }
.page-hero h1 { position:relative; z-index:1; margin:0; font-weight:300; font-size:clamp(4rem,10vw,11rem); line-height:.73; letter-spacing:-.08em; }
.page-hero h1 em { font-family:Instrument Serif,serif; font-weight:400; }
.page-hero > p:last-of-type { grid-column:2; max-width:420px; line-height:1.6; }
.orb-mini { position:absolute; width:38vw; aspect-ratio:1; border-radius:50%; right:-8vw; top:-10vw; opacity:.52; background:repeating-conic-gradient(from 20deg,var(--brand-orange) 0 .45deg,transparent .55deg 2.2deg); -webkit-mask:radial-gradient(circle,transparent 0 27%,#000 28% 65%,transparent 66%); mask:radial-gradient(circle,transparent 0 27%,#000 28% 65%,transparent 66%); }
.industry-detail { min-height:100vh; padding:12vh 1.2rem; display:grid; grid-template-columns:42% 1fr; gap:6vw; align-items:center; }
.industry-detail h2 { font-size:clamp(2.5rem,5vw,6rem); font-weight:300; letter-spacing:-.06em; }
.industry-detail p { max-width:420px; line-height:1.7; }
.industry-detail ul { list-style:none; padding:0; margin:3rem 0; border-top:1px solid var(--line); }
.industry-detail li { padding:1rem 0; border-bottom:1px solid var(--line); font:.72rem DM Mono,monospace; }
.industry-detail figure { position:relative; margin:0; height:72vh; overflow:hidden; background:#dedfdf; }
.industry-detail figure > img:first-child { width:100%; height:100%; object-fit:cover; }
.detail-logo { position:absolute; left:2rem; bottom:2rem; width:140px; max-height:50px; object-fit:contain; object-position:left; }
.about-page { padding:10vh 1.2rem 15vh; }
.about-page article { display:grid; grid-template-columns:6rem 32% 1fr; gap:2rem; align-items:baseline; min-height:10rem; padding:2rem 0; border-bottom:1px solid var(--line); }
.about-page article > span { font:.6rem DM Mono,monospace; }
.about-page h2 { font-size:clamp(1.8rem,3.4vw,4rem); font-weight:300; }
.about-page p { max-width:420px; line-height:1.6; }

@media (max-width: 800px) {
  .site-header { padding:.65rem .8rem; }
  .brand { width:100px; }
  .desktop-nav { display:none; }
  .menu-toggle { display:block; }
  .mobile-menu { position:fixed; z-index:20; inset:0; display:flex; flex-direction:column; justify-content:center; padding:6rem 1rem 2rem; background:var(--paper); visibility:hidden; opacity:0; transition:.3s; }
  .mobile-menu[aria-hidden="false"] { visibility:visible; opacity:1; }
  .mobile-menu nav { border-top:1px solid var(--line); }
  .mobile-menu nav a { display:grid; grid-template-columns:3rem 1fr; padding:.75rem 0; border-bottom:1px solid var(--line); font-size:clamp(2rem,10vw,4rem); letter-spacing:-.055em; }
  .mobile-menu nav small { font:.55rem DM Mono,monospace; }
  .mobile-menu > div { display:flex; gap:1rem; flex-wrap:wrap; margin-top:auto; font:.55rem DM Mono,monospace; }
  .hero-sticky { border-width:6px; border-radius:15px; }
  .hero-copy { left:.75rem; bottom:8.5rem; }
  .hero-copy h1,.hero-copy h2 { font-size:clamp(2.6rem,12vw,4rem); }
  .hero-b { bottom:13vh; }
  .hero-b p { max-width:230px; }
  .hero-meta { top:4rem; }
  .meta-left { left:.75rem; }
  .meta-right { right:.8rem; top:55%; grid-template-columns:auto 3rem auto; }
  .hero-cta { bottom:1rem; }
  .manifest { grid-template-columns:1fr; align-content:center; gap:4rem; padding:12vh 1rem; }
  .manifest h2 { font-size:clamp(3rem,15vw,6rem); }
  .manifest p { justify-self:end; }
  .industries { padding:10vh 1rem; }
  .industries header { display:block; margin-bottom:7vh; }
  .industries .kicker { margin-bottom:2rem; }
  .industry-stage { display:block; }
  .industry-preview { position:relative; top:auto; height:43vh; margin-bottom:2rem; }
  .industry-row { grid-template-columns:2.4rem 1fr auto; min-height:6.7rem; }
  .industry-row small { display:none; }
  .industry-row b { opacity:1; transform:none; font-size:.5rem; }
  .project-strip { display:block; min-height:0; padding:8vh 0; }
  .project-copy { padding:0 0 2.5rem; }
  .project-copy h2 { margin:4rem 0 1.5rem; }
  .project-image { height:60vh; }
  .services-section header,.about-teaser { display:block; }
  .services-section header .kicker,.about-teaser > .kicker { margin-bottom:2rem; }
  .service-row { grid-template-columns:2.7rem 1fr 1.5rem; min-height:6.5rem; }
  .service-row em { grid-column:2/4; display:none; padding-bottom:1rem; }
  .service-row[aria-expanded="true"] em { display:block; }
  .service-row b { grid-column:3; grid-row:1; }
  .process-section > h2 { justify-self:start; width:100%; }
  .process-line { grid-template-columns:1fr; gap:1.8rem; }
  .process-line div { grid-template-columns:2.5rem 1fr; }
  .contact-section { display:block; padding:11vh 1rem 8vh; }
  .contact-section h2 { margin:14vh 0 12vh; }
  .footer-bottom { gap:1rem; flex-wrap:wrap; }
  .page-hero { min-height:75vh; display:block; padding:20vh 1rem 7vh; }
  .page-hero h1 { margin:16vh 0 2rem; font-size:clamp(4rem,19vw,7rem); }
  .page-hero > p:last-of-type { margin-left:20%; }
  .orb-mini { width:80vw; right:-35vw; }
  .industry-detail { display:block; padding:10vh 1rem; }
  .industry-detail figure { height:60vh; margin-top:4rem; }
  .about-page article { grid-template-columns:3rem 1fr; gap:1rem; }
  .about-page article p { grid-column:2; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
  .hero-a { opacity:0; }
  .hero-b { opacity:1; transform:none; }
}

/* A machined alignment instrument: five parts, one shared direction. */
.alignment-hero { height:230svh; }
.alignment-hero .hero-sticky { border:0; border-radius:0; display:grid; grid-template-columns:1fr 1.05fr; gap:3vw; align-items:center; padding:125px 7vw 32px 4vw; background:#f2f2ee; }
.alignment-intro .kicker { font-size:.59rem; letter-spacing:.07em; margin:0 0 35px; }
.alignment-intro h1 { font-size:clamp(2.8rem,4.7vw,6rem); line-height:.96; letter-spacing:-.065em; font-weight:400; margin:0; }
.alignment-intro h1 em { font-family:Instrument Serif,Georgia,serif; font-weight:400; }
.alignment-lead { font-size:.88rem; line-height:1.7; margin:28px 0; color:#686d63; }
.alignment-intro .outline-button { min-height:46px; padding:0 20px; }
.alignment-scroll { font:.55rem/1.5 DM Mono,monospace; margin:38px 0 0; color:#73796e; letter-spacing:.04em; }
.alignment-object { width:100%; max-width:670px; justify-self:center; }
.object-caption { display:flex; justify-content:space-between; gap:12px; color:#747c6d; font:.52rem/1.4 DM Mono,monospace; letter-spacing:.07em; }
.instrument { position:relative; max-width:53vh; margin:0 auto; perspective:1000px; }
.instrument::after { content:''; position:absolute; width:65%; height:9%; left:19%; bottom:5%; background:#273420; opacity:.18; filter:blur(18px); border-radius:50%; pointer-events:none; }
.instrument svg { display:block; position:relative; z-index:1; width:100%; overflow:visible; transform:rotateX(19deg) rotateZ(-12deg); filter:drop-shadow(9px 18px 8px #29332024); }
.alignment-ring { cursor:pointer; outline:none; }
.alignment-ring circle { transition:stroke-opacity .25s; }
.alignment-ring:hover .ring-marker,.alignment-ring:focus .ring-marker { stroke:#ffae38; stroke-width:8; }
.alignment-ring:focus-visible circle:first-child { stroke:#ed7900; }
.alignment-readout { min-height:105px; padding:8px 10px 16px; text-align:center; }
.readout-index { font:.5rem DM Mono,monospace; letter-spacing:.12em; color:#a15e22; }
.alignment-readout h2 { font:italic 1.8rem/1.2 Instrument Serif,Georgia,serif; margin:8px 0; font-weight:400; }
.alignment-readout p { font-size:.72rem; line-height:1.5; color:#73796e; margin:0 auto; max-width:330px; }
.object-foot { padding-top:14px; border-top:1px solid #cdd1c7; font-size:.47rem; }
@media (max-width:800px), (max-height:650px) {
 .alignment-hero { height:auto; }
 .alignment-hero .hero-sticky { position:relative; height:auto; min-height:100svh; padding:115px 24px 45px; gap:45px; }
 .instrument { max-width:430px; }
}
@media (max-width:800px) {
 .alignment-hero .hero-sticky { grid-template-columns:1fr; }
 .alignment-intro h1 { font-size:clamp(2.7rem,9vw,4.5rem); }
 .alignment-intro .kicker { margin-bottom:25px; }
 .alignment-scroll { margin-top:28px; }
 .alignment-object { max-width:500px; }
}
@media (prefers-reduced-motion:reduce) {
 .alignment-hero { height:auto; }
 .alignment-hero .hero-sticky { position:relative; height:auto; min-height:100svh; }
}
