:root { --night:#101827; --night-soft:#1b2940; --paper:#f3f0e8; --paper-bright:#fffdf8; --warm:#dba858; --ink:#172238; --muted:#5c6675; --line:rgba(23,34,56,.18); --display:Georgia,"Times New Roman",serif; --body:"Avenir Next",Avenir,"Segoe UI",sans-serif; --utility:"SFMono-Regular",Consolas,monospace; --max:1320px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:clip; background:var(--paper); color:var(--ink); font-family:var(--body); line-height:1.58; }
img { display:block; max-width:100%; }
a { color:inherit; }
:focus-visible { outline:3px solid var(--warm); outline-offset:4px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; z-index:100; top:.75rem; left:.75rem; transform:translateY(-160%); padding:.7rem 1rem; background:var(--paper-bright); font-weight:800; }
.skip-link:focus { transform:translateY(0); }

.site-header { position:fixed; z-index:20; top:0; right:0; left:0; display:flex; align-items:center; justify-content:space-between; min-height:82px; padding:0 4vw; color:var(--paper-bright); transition:background 180ms ease,border-color 180ms ease; }
.site-header.is-scrolled { border-bottom:1px solid rgba(255,255,255,.14); background:rgba(16,24,39,.95); backdrop-filter:blur(12px); }
.brand { display:flex; align-items:baseline; gap:.65rem; text-decoration:none; }
.brand-word { font-family:var(--display); font-size:1.35rem; letter-spacing:.08em; }
.brand-company { font:.61rem var(--utility); letter-spacing:.12em; text-transform:uppercase; }
.site-nav { display:flex; align-items:center; gap:clamp(1.2rem,2.6vw,3rem); font-size:.78rem; font-weight:700; }
.site-nav a { text-decoration:none; }
.site-nav a:not(.nav-contact):hover { color:var(--warm); }
.nav-contact { padding-bottom:.25rem; border-bottom:1px solid var(--paper-bright); }
.nav-toggle { display:none; border:0; background:transparent; color:inherit; }

.hero { position:relative; width:100%; min-height:820px; overflow:hidden; background:var(--night); color:var(--paper-bright); }
.hero-image { position:absolute; inset:0 0 0 34%; margin:0; }
.hero-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--night) 0%,rgba(16,24,39,.66) 30%,rgba(16,24,39,.08) 70%); }
.hero-image img { width:100%; height:100%; object-fit:cover; object-position:57% center; }
.hero-copy { position:relative; z-index:2; width:min(780px,60vw); padding:180px 0 120px max(5vw,calc((100vw - var(--max))/2)); }
.location,.section-label { margin:0 0 1.5rem; font:.66rem var(--utility); font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.location::before,.section-label::before { content:""; display:inline-block; width:2.2rem; height:1px; margin:0 .7rem .2rem 0; background:var(--warm); }
.hero h1 { max-width:760px; margin:0; font-family:var(--display); font-size:clamp(4.1rem,7.4vw,7.7rem); font-weight:400; letter-spacing:-.055em; line-height:.88; }
.hero-intro { max-width:600px; margin:2rem 0 2.4rem; color:#d6dbe4; font-size:clamp(1rem,1.25vw,1.17rem); }
.primary-link { display:inline-flex; align-items:center; gap:1rem; padding-bottom:.4rem; border-bottom:1px solid var(--warm); font-size:.84rem; font-weight:800; text-decoration:none; }
.primary-link span { color:var(--warm); }
.hero-side-note { position:absolute; z-index:2; right:2rem; bottom:4rem; margin:0; color:rgba(255,255,255,.7); font:.58rem var(--utility); letter-spacing:.12em; text-transform:uppercase; transform:rotate(-90deg) translateX(100%); transform-origin:right bottom; }

.intro-panel { max-width:var(--max); margin:0 auto; padding:80px 8vw 20px 28vw; }
.intro-panel p { margin:0; font-family:var(--display); font-size:clamp(1.8rem,3.2vw,3.25rem); line-height:1.2; }
.services { max-width:var(--max); margin:0 auto; padding:120px 4vw 140px; }
.section-heading { display:grid; grid-template-columns:.6fr 1.4fr; gap:4rem; align-items:start; margin-bottom:5rem; }
.section-heading h2,.vertical-section h2,.contact h2 { margin:0; font-family:var(--display); font-size:clamp(3rem,5vw,5.1rem); font-weight:400; letter-spacing:-.05em; line-height:.96; }
.service-list { border-top:1px solid var(--ink); }
.service-list article { display:grid; grid-template-columns:minmax(200px,.55fr) 1fr; gap:3rem; padding:2rem 0; border-bottom:1px solid var(--line); }
.service-list h3 { margin:0; font-family:var(--display); font-size:1.8rem; font-weight:400; }
.service-list p { max-width:650px; margin:0; color:var(--muted); }
.service-notes { display:grid; grid-template-columns:.7fr 1fr; gap:3rem; margin-top:2rem; }
.scope-note,.automation-note { max-width:580px; margin:0; color:var(--muted); font-size:.82rem; }
.automation-note { padding-left:1.1rem; border-left:2px solid var(--warm); }

.vertical-section { display:grid; grid-template-columns:1.05fr .95fr; gap:8vw; padding:120px max(5vw,calc((100vw - var(--max))/2)); background:var(--night-soft); color:var(--paper-bright); }
.section-label-light { color:#cbd3df; }
.vertical-copy { align-self:end; }
.vertical-copy>p { margin:0 0 3rem; color:#c6cfdb; font-size:1.05rem; }
.vertical-copy dl { margin:0; border-top:1px solid rgba(255,255,255,.25); }
.vertical-copy dl div { display:grid; grid-template-columns:90px 1fr; gap:1.3rem; padding:1rem 0; border-bottom:1px solid rgba(255,255,255,.16); }
.vertical-copy dt { color:var(--warm); font:.68rem var(--utility); font-weight:800; text-transform:uppercase; }
.vertical-copy dd { margin:0; color:#d7dde5; font-size:.9rem; }

.contact { display:grid; grid-template-columns:1.15fr .85fr; gap:8vw; padding:120px max(5vw,calc((100vw - var(--max))/2)); background:var(--warm); }
.contact-action { align-self:end; }
.contact-action p { max-width:520px; margin:0 0 1.8rem; }
.contact-action a { display:inline-flex; gap:.75rem; align-items:center; padding-bottom:.35rem; border-bottom:2px solid var(--ink); font-weight:800; text-decoration:none; }
.site-footer { display:grid; grid-template-columns:1fr auto auto; gap:3rem; align-items:center; padding:2rem 4vw; background:var(--night); color:#aeb9c8; font:.62rem var(--utility); letter-spacing:.04em; }
.footer-left { display:flex; align-items:baseline; gap:1rem; }
.footer-left strong { color:var(--paper-bright); font-family:var(--display); font-size:1rem; letter-spacing:.08em; }
.footer-left span { text-transform:uppercase; }

@media (max-width:900px) {
  .nav-toggle { display:grid; place-content:center; gap:6px; width:44px; height:44px; cursor:pointer; }
  .nav-toggle span:not(.sr-only) { width:24px; height:2px; background:currentColor; }
  .site-nav { position:absolute; top:82px; right:0; left:0; display:none; align-items:stretch; padding:1rem 5vw 1.5rem; border-bottom:1px solid rgba(255,255,255,.15); background:var(--night); flex-direction:column; }
  .site-nav.is-open { display:flex; }.site-nav a { padding:.55rem 0; }.nav-contact { border:0; }
  .hero-image { left:20%; }.hero-copy { width:min(720px,82vw); }.intro-panel { padding-left:10vw; }
  .section-heading,.vertical-section,.contact { grid-template-columns:1fr; gap:3rem; }.site-footer { grid-template-columns:1fr; gap:.5rem; }
}
@media (max-width:620px) {
  .site-header { min-height:70px; }.site-nav { top:70px; }.hero { min-height:760px; }.hero-image { inset:0; opacity:.64; }
  .hero-image::after { background:linear-gradient(180deg,rgba(16,24,39,.35),var(--night) 88%); }.hero-image img { object-position:63% center; }
  .hero-copy { display:flex; justify-content:flex-end; width:100%; min-width:0; min-height:760px; padding:130px 6vw 70px; flex-direction:column; }
  .hero h1 { width:100%; max-width:100%; font-size:clamp(2.75rem,10.8vw,3.6rem); overflow-wrap:break-word; }.hero-intro { width:100%; max-width:100%; }.primary-link { align-self:flex-start; }.hero-side-note { display:none; }.intro-panel { padding:70px 6vw 0; }.services { padding:90px 6vw; }
  .section-heading { margin-bottom:3rem; }.service-list article,.service-notes { grid-template-columns:1fr; gap:.6rem; }.service-list h3 { font-size:1.55rem; }.automation-note { margin-top:1rem; }
  .vertical-section,.contact { padding:90px 6vw; }.contact-action a { font-size:.9rem; overflow-wrap:anywhere; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }
