*{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#1c1b18;
  --paper:#eeeae1;
  --warm:#d9c9ad;
  --line:rgba(28,27,24,.18);
  --muted:#6c685f;
  --accent:#9a7951;
}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:Manrope,Arial,sans-serif;
  overflow-x:hidden;
}
body:before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");
}
a{color:inherit;text-decoration:none}
.site-shell{max-width:1500px;margin:auto;padding:0 5vw}
.nav{
  min-height:92px;display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;border-bottom:1px solid var(--line);gap:30px;
}
.brand{display:flex;align-items:center;gap:12px;width:max-content}
.brand-mark{
  width:38px;height:38px;border:1px solid var(--ink);display:grid;place-items:center;
  font:500 12px "DM Mono",monospace;letter-spacing:-.08em
}
.brand strong,.brand small{display:block;letter-spacing:.14em}
.brand strong{font-size:13px;font-weight:700}.brand small{font:10px "DM Mono",monospace;margin-top:2px}
.nav-status{font:10px "DM Mono",monospace;letter-spacing:.1em;display:flex;align-items:center;gap:9px}
.status-dot{width:7px;height:7px;border-radius:50%;background:#6e7958;box-shadow:0 0 0 5px rgba(110,121,88,.12)}
.nav-link{justify-self:end;font:11px "DM Mono",monospace;letter-spacing:.05em;border-bottom:1px solid var(--ink);padding-bottom:4px}
.nav-link span{margin-left:8px}

.hero{
  min-height:calc(100vh - 92px);display:grid;grid-template-columns:.88fr 1.12fr;
  gap:6vw;align-items:center;padding:7vh 0 10vh;
}
.eyebrow{font:10px "DM Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:28px}
.eyebrow span{color:var(--accent);margin-right:12px}
h1,h2{font-family:"Playfair Display",Georgia,serif;font-weight:500;letter-spacing:-.045em;line-height:.92}
h1{font-size:clamp(58px,7vw,112px);max-width:720px}
h1 em,h2 em{font-style:italic;color:#75614a}
.intro{max-width:510px;font-size:15px;line-height:1.8;color:#59564f;margin:34px 0 38px}
.progress-wrap{max-width:510px;margin-bottom:32px}
.progress-meta{display:flex;justify-content:space-between;font:9px "DM Mono",monospace;letter-spacing:.08em;margin-bottom:10px}
.progress-track{height:2px;background:rgba(28,27,24,.16);overflow:hidden}
.progress-track span{display:block;width:0;height:100%;background:var(--ink);transition:width 1.8s cubic-bezier(.2,.8,.2,1)}
.primary-cta{
  display:inline-flex;align-items:center;gap:28px;padding:15px 18px;border:1px solid var(--ink);
  font-size:11px;font-weight:700;letter-spacing:.04em;transition:.3s ease
}
.primary-cta:hover{background:var(--ink);color:var(--paper)}
.cta-arrow{font-size:17px}

.hero-visual{
  min-height:650px;position:relative;overflow:hidden;background:#d0c3ae;
  border:1px solid rgba(28,27,24,.22);box-shadow:14px 14px 0 rgba(28,27,24,.07);
}
.hero-visual:before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(255,255,255,.45),transparent 45%),linear-gradient(0deg,rgba(49,39,27,.13),transparent 55%);
}
.visual-label{position:absolute;z-index:5;font:9px "DM Mono",monospace;letter-spacing:.1em}
.label-top{top:22px;left:24px}.label-bottom{right:24px;bottom:20px}
.workbench{
  position:absolute;inset:12% 6% 9%;transform:rotate(-2deg);
  background:linear-gradient(150deg,#b89468,#9d7a50 55%,#765b3d);
  box-shadow:20px 25px 30px rgba(43,32,21,.23);
  overflow:hidden;
}
.workbench:before{
  content:"";position:absolute;inset:0;opacity:.25;
  background:repeating-linear-gradient(90deg,transparent 0 42px,rgba(54,36,20,.3) 43px,transparent 44px 80px)
}
.plywood-sheet{position:absolute;background:#c9aa7c;box-shadow:8px 10px 14px rgba(40,28,17,.22)}
.sheet-back{width:70%;height:50%;right:-7%;top:-4%;transform:rotate(9deg);background:#b38e62}
.sheet-main{width:72%;height:55%;left:8%;top:17%;transform:rotate(-4deg)}
.sheet-edge{position:absolute;left:0;bottom:0;width:100%;height:11px;background:#a17d53}
.pencil-mark{position:absolute;height:1px;background:rgba(62,45,28,.65);transform:rotate(2deg)}
.mark-one{width:56%;left:15%;top:44%}.mark-two{width:32%;left:15%;top:49%}
.measurement{position:absolute;right:12%;top:40%;font:11px "DM Mono",monospace;letter-spacing:.1em;color:#55412b}
.laminate{position:absolute;width:42%;height:30%;right:5%;bottom:8%;background:#d7d1c4;transform:rotate(8deg);box-shadow:8px 12px 17px rgba(40,28,17,.25)}
.laminate:after{content:"";position:absolute;inset:12px;border:1px solid rgba(54,46,37,.18)}
.laminate span{position:absolute;right:16px;bottom:12px;font:9px "DM Mono",monospace;color:#625c52}
.laminate-small{width:29%;height:20%;right:20%;bottom:35%;transform:rotate(-7deg);background:#ad9675}
.tape-measure{position:absolute;right:11%;top:10%;transform:rotate(18deg)}
.tape-body{width:68px;height:68px;border-radius:50%;background:#c5a34e;border:6px solid #9b7c37;box-shadow:5px 8px 10px #49351f66}
.tape-strip{position:absolute;width:135px;height:10px;background:#e7dfbd;right:-105px;top:30px;box-shadow:0 2px 4px #49351f44}
.carpenter-tool{position:absolute;left:15%;bottom:9%;transform:rotate(12deg)}
.tool-handle{width:120px;height:16px;background:#3b2b1d;border-radius:8px}
.tool-head{position:absolute;left:-17px;top:-10px;width:30px;height:36px;background:#6d675d;border-radius:3px}
.cut-line{position:absolute;width:65%;height:2px;background:#2f251b;left:11%;top:67%;transform:rotate(-4deg);opacity:.65}
.cut-caption{position:absolute;left:12%;top:70%;font:8px "DM Mono",monospace;letter-spacing:.1em}
.sawdust{position:absolute;width:7px;height:4px;background:#e2cfac;transform:rotate(25deg);opacity:.8}
.dust-one{left:57%;top:76%}.dust-two{left:61%;top:72%;width:11px}.dust-three{left:64%;top:78%;width:5px}
.work-in-progress{
  position:absolute;z-index:6;left:8%;bottom:8%;width:180px;padding:15px 16px;
  background:rgba(239,234,225,.94);backdrop-filter:blur(5px)
}
.wip-top{display:flex;justify-content:space-between;font:8px "DM Mono",monospace;letter-spacing:.08em;border-bottom:1px solid var(--line);padding-bottom:10px}
.work-in-progress p{font-family:"Playfair Display",serif;font-size:24px;line-height:.95;margin-top:13px}

.process{padding:13vh 0 10vh;border-top:1px solid var(--line)}
.section-heading h2{font-size:clamp(45px,6vw,82px)}
.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:70px;border:1px solid var(--line)}
.process-grid article{background:var(--paper);padding:36px;min-height:310px;position:relative}
.process-number{font:10px "DM Mono",monospace;color:var(--accent)}
.process-grid h3{font:500 28px "Playfair Display",serif;margin:42px 0 13px}
.process-grid p{font-size:13px;line-height:1.75;color:var(--muted);max-width:320px}
.process-icon{height:45px;margin-top:24px;position:relative}
.icon-drawing{border:1px solid #817968;width:58px;height:42px}
.icon-drawing i{display:block;width:30px;height:1px;background:#817968;margin:10px 12px}
.icon-cut:before{content:"";position:absolute;left:0;top:19px;width:58px;height:1px;background:#817968}
.icon-cut i{position:absolute;width:10px;height:10px;border:1px solid #817968;border-radius:50%;top:14px}
.icon-cut i:first-child{left:5px}.icon-cut i:last-child{left:43px}
.icon-install i{position:absolute;width:45px;height:28px;border:1px solid #817968;bottom:0}
.icon-install i:first-child{left:0}.icon-install i:nth-child(2){left:18px;bottom:9px}.icon-install i:nth-child(3){left:36px;bottom:18px}

.material-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:20px;padding:23px 0;overflow:auto;white-space:nowrap}
.material-item{display:flex;align-items:center;gap:13px;color:#7b766d}
.material-item span{font:8px "DM Mono",monospace}.material-item strong{font-size:10px;letter-spacing:.08em;font-weight:600}
.material-item.active{color:var(--ink)}.material-line{height:1px;width:55px;background:var(--line);flex:0 0 55px}

.contact{display:grid;grid-template-columns:1fr .7fr;gap:10vw;padding:15vh 0}
.contact h2{font-size:clamp(58px,7vw,100px)}
.contact-copy{padding-top:60px}.contact-copy>p{font-size:15px;line-height:1.8;color:var(--muted);max-width:390px}
.contact-actions{display:flex;gap:30px;margin-top:38px}
.contact-actions a{font:11px "DM Mono",monospace;border-bottom:1px solid var(--ink);padding-bottom:6px}
.contact-actions span{margin-left:12px}

footer{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr 1fr;padding:25px 0;font:9px "DM Mono",monospace;color:var(--muted);letter-spacing:.04em}
.footer-brand{color:var(--ink)}footer div:last-child{text-align:right}
.cursor-glow{position:fixed;width:280px;height:280px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(156,126,85,.1),transparent 65%);transform:translate(-50%,-50%);z-index:0}

@media(max-width:900px){
  .site-shell{padding:0 6vw}.nav{grid-template-columns:1fr auto}.nav-status{display:none}.nav-link{display:none}
  .hero{grid-template-columns:1fr;gap:55px;padding-top:8vh}.hero-visual{min-height:560px}
  .process-grid{grid-template-columns:1fr}.process-grid article{min-height:270px}
  .contact{grid-template-columns:1fr;gap:20px}.contact-copy{padding-top:0}
  footer{grid-template-columns:1fr 1fr;gap:15px}footer div:nth-child(2){display:none}
}
@media(max-width:520px){
  h1{font-size:57px}.hero{padding-bottom:8vh}.hero-visual{min-height:430px}.workbench{inset:17% 4% 8%}
  .work-in-progress{left:5%;bottom:5%;width:155px}.work-in-progress p{font-size:21px}
  .label-bottom{display:none}.intro{font-size:14px}.process{padding-top:10vh}
  .process-grid{margin-top:45px}.process-grid article{padding:28px}
  .contact{padding:11vh 0}.contact-actions{flex-direction:column;gap:20px;width:max-content}
  footer{font-size:8px}
}