@font-face{font-family:"Space Grotesk";src:url("/assets/fonts/space-grotesk.ttf") format("truetype");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"DM Sans";src:url("/assets/fonts/dm-sans.ttf") format("truetype");font-weight:100 1000;font-style:normal;font-display:swap}
@font-face{font-family:"Space Mono";src:url("/assets/fonts/space-mono.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}

:root{--paper:#fff;--ink:#1b3029;--quiet:#52645b;--line:#d8dfda;--accent:#c24d2c;color-scheme:light;font-family:"DM Sans",Arial,sans-serif;background:var(--paper);color:var(--ink);font-synthesis:none}
:root[data-theme="dark"]{--paper:#101e19;--ink:#f5f7f2;--quiet:#b5c2ba;--line:#3c5147;--accent:#ee8f69;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;min-width:280px;background:var(--paper);color:var(--ink);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,p,figure{margin:0}
a{color:inherit}
.page-shell{width:min(100%,1440px);min-height:100svh;margin-inline:auto;padding:clamp(24px,3.5vw,60px) clamp(24px,5vw,88px);display:flex;flex-direction:column;gap:clamp(28px,4vw,56px)}
.mono{font-family:"Space Mono",monospace;font-weight:400;font-size:clamp(11px,.78vw,12px);line-height:1.7;letter-spacing:.015em}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;min-height:48px;flex-shrink:0}
.wordmark{font-family:"Space Grotesk",sans-serif;font-weight:500;font-size:clamp(40px,3.5vw,52px);line-height:1;letter-spacing:-.065em}
.period{color:var(--accent)}
.brand-mark,.assembly-mark{display:block;background:currentColor;mask:url("/assets/brand/cog-master.svg") center/contain no-repeat;-webkit-mask:url("/assets/brand/cog-master.svg") center/contain no-repeat}
.brand-mark{width:clamp(30px,2.8vw,38px);height:clamp(30px,2.8vw,38px);mask-image:url("/assets/brand/cog-compact.svg");-webkit-mask-image:url("/assets/brand/cog-compact.svg")}
.brand:focus-visible{outline:2px solid var(--accent);outline-offset:7px;border-radius:2px}
.status{display:flex;align-items:center;gap:9px;text-transform:uppercase;white-space:nowrap}
.status-dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--accent)}
.main-content{flex:1;display:flex;flex-direction:column;justify-content:center;gap:clamp(24px,3.5vw,40px);padding-block:clamp(24px,2.8vw,40px)}
.eyebrow{text-transform:uppercase;color:var(--quiet)}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,24%);align-items:center;gap:clamp(28px,4vw,68px)}
.hero-copy{display:flex;flex-direction:column;gap:clamp(24px,3vw,36px);min-width:0}
h1{font-family:"Space Grotesk",sans-serif;font-weight:500;font-size:clamp(48px,6.1vw,96px);line-height:1.03;letter-spacing:-.055em;max-width:13ch}
.introduction{max-width:38ch;font-size:clamp(16px,1.3vw,19px);line-height:1.65;color:var(--quiet);text-wrap:pretty}
.assembly{display:flex;flex-direction:column;align-items:center;gap:clamp(18px,2vw,26px);min-width:0}
.assembly-drawing{position:relative;width:100%;max-width:248px;aspect-ratio:1/1.15;display:grid;place-items:center}
.assembly-drawing::before,.assembly-drawing::after{content:"";position:absolute;background:var(--line)}
.assembly-drawing::before{height:1px;width:100%}
.assembly-drawing::after{width:1px;height:100%}
.assembly-mark{position:relative;width:91%;aspect-ratio:1;z-index:1}
.assembly-dot{position:absolute;width:clamp(8px,.85vw,12px);aspect-ratio:1;border-radius:50%;background:var(--accent);right:0;top:50%;transform:translateY(-50%);z-index:2}
.assembly figcaption{color:var(--quiet);text-align:center;max-width:18ch}
.page-bottom{display:flex;flex-direction:column;gap:clamp(26px,3vw,38px)}
.services{display:flex;gap:12px clamp(22px,3vw,38px);flex-wrap:wrap;list-style:none;padding:23px 0 0;margin:0;border-top:1px solid var(--line);text-transform:uppercase}
.services li{display:flex;align-items:center;gap:9px}
.services li::before{content:"+";color:var(--accent)}
.site-footer{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:18px 28px;color:var(--quiet);border-top:1px solid var(--line);padding-top:23px}
.domain{color:var(--ink)}

@media(min-width:1600px){.page-shell{max-width:1600px;padding-inline:100px}}
@media(max-width:760px){.hero{grid-template-columns:minmax(0,1fr) minmax(126px,23%);gap:24px}h1{font-size:clamp(42px,7.5vw,58px)}.page-shell{gap:36px}.main-content{padding-block:38px}.assembly figcaption{max-width:15ch}}
@media(max-width:580px){.page-shell{padding:24px;gap:38px;min-height:max(100svh,860px)}.hero{grid-template-columns:minmax(0,1fr);gap:38px}.main-content{gap:26px;padding-block:12px}h1{font-size:clamp(43px,10vw,60px)}.hero-copy{gap:24px}.assembly{align-items:flex-start;gap:9px}.assembly-drawing{width:132px;max-width:none;aspect-ratio:1/1.12}.assembly figcaption{text-align:left;max-width:none}.introduction{max-width:34ch}.page-bottom{gap:26px}.brand{gap:9px}.wordmark{font-size:40px}.brand-mark{width:30px;height:30px}.services{gap:10px 20px}.site-footer{align-items:flex-start}}
@media(max-width:360px){.page-shell{padding:22px;min-height:max(100svh,900px)}.site-header{gap:18px}.status{font-size:11px}.wordmark{font-size:37px}.brand-mark{width:28px;height:28px}.services{column-gap:17px}}
@media(prefers-reduced-motion:no-preference){body{transition:background-color .35s ease,color .35s ease}}
@media print{:root,:root[data-theme="dark"]{--paper:#fff;--ink:#1b3029;--quiet:#52645b;--line:#d8dfda;--accent:#c24d2c;color-scheme:light}.page-shell{min-height:auto;padding:24px}.main-content{padding-block:50px}}
