/* Legacy Restoration - grand editorial system */
:root{
  --gold:#d9bc7e; --gold-deep:#c2a35f; --gold-soft:#e6d3a6;
  --taupe:#8a7d70; --taupe-deep:#6f6357;
  --charcoal:#1a1714; --ink:#2a2521; --ink-soft:#4a423b;
  --ivory:#f6f1e7; --cream:#efe6d4; --paper:#faf6ee;
  --line:rgba(42,37,33,.14); --line-gold:rgba(217,188,126,.42);
  --serif:'EB Garamond', Georgia, 'Times New Roman', serif;
  --sans:'Hanken Grotesk', system-ui, -apple-system, Segoe UI, sans-serif;
  --wrap:1240px; --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;padding:0}
body{
  font-family:var(--sans); color:var(--ink); background:var(--paper);
  font-size:17px; line-height:1.65; font-weight:400;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4{font-family:var(--serif); font-weight:500; line-height:1.06; margin:0; letter-spacing:.005em}
p{margin:0 0 1.1em}
::selection{background:var(--gold); color:var(--charcoal)}

.wrap{max-width:var(--wrap); margin:0 auto; padding:0 clamp(20px,5vw,56px)}
.eyebrow{
  font-family:var(--sans); font-size:.82rem; font-weight:600; letter-spacing:.34em;
  text-transform:uppercase; color:var(--gold-deep); margin:0 0 1.4em; display:inline-block;
}
.eyebrow.on-dark{color:var(--gold)}
.lede{font-size:clamp(1.15rem,1.9vw,1.45rem); line-height:1.62; color:var(--ink-soft)}
.serif-accent{font-family:var(--serif); font-style:italic}

/* buttons */
.btn{
  display:inline-flex; align-items:center; gap:.6em; cursor:pointer;
  font-family:var(--sans); font-size:.94rem; font-weight:600; letter-spacing:.02em;
  padding:1.02em 1.9em; border-radius:2px; border:1px solid transparent;
  transition:.4s var(--ease); text-transform:uppercase; letter-spacing:.12em;
}
.btn svg{width:16px;height:16px}
.btn-gold{background:var(--gold); color:var(--charcoal)}
.btn-gold:hover{background:var(--gold-soft); transform:translateY(-2px)}
.btn-ghost{background:transparent; color:var(--ivory); border-color:rgba(246,241,231,.5)}
.btn-ghost:hover{border-color:var(--gold); color:var(--gold)}
.btn-dark{background:var(--charcoal); color:var(--ivory)}
.btn-dark:hover{background:var(--ink); transform:translateY(-2px)}

/* ---------- header ---------- */
.site-head{
  position:fixed; top:0; left:0; right:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:clamp(16px,2.4vw,26px) clamp(20px,5vw,56px);
  transition:background .5s var(--ease), padding .5s var(--ease), box-shadow .5s var(--ease);
}
.site-head.solid{background:rgba(20,17,14,.94); backdrop-filter:blur(10px); padding-top:14px; padding-bottom:14px; box-shadow:0 1px 0 rgba(217,188,126,.16)}
.brand{display:flex; align-items:center; gap:14px; color:var(--ivory)}
.brand img{width:46px; height:46px; object-fit:contain}
.brand-txt{display:flex; flex-direction:column; line-height:1}
.brand-txt b{font-family:var(--serif); font-size:1.24rem; font-weight:600; letter-spacing:.02em}
.brand-txt span{font-size:.62rem; letter-spacing:.32em; text-transform:uppercase; color:var(--gold); margin-top:5px}
.nav{display:flex; align-items:center; gap:clamp(20px,2.6vw,40px)}
.nav a{color:var(--ivory); font-size:.92rem; font-weight:500; letter-spacing:.02em; position:relative; opacity:.9; white-space:nowrap}
.nav a:not(.btn)::after{content:''; position:absolute; left:0; bottom:-6px; width:0; height:1px; background:var(--gold); transition:width .4s var(--ease)}
.nav a:not(.btn):hover{opacity:1}
.nav a:not(.btn):hover::after{width:100%}
.nav .btn{padding:.72em 1.35em; font-size:.78rem}
.nav-tel{display:inline-flex; align-items:center; gap:.5em}
.burger{display:none; background:none; border:0; cursor:pointer; padding:8px; flex-direction:column; gap:5px}
.burger span{width:26px; height:2px; background:var(--ivory); display:block; transition:.3s}
/* legibility for the transparent (home) header over bright hero areas */
.site-head:not(.solid) .brand,
.site-head:not(.solid) .nav > a{text-shadow:0 1px 14px rgba(0,0,0,.5)}
.site-head:not(.solid) .burger span{box-shadow:0 1px 8px rgba(0,0,0,.55)}

/* ---------- hero ---------- */
.hero{position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; background:var(--charcoal)}
.hero-media{position:absolute; inset:0; z-index:0; overflow:hidden}
.hero-media img{width:100%; height:120%; object-fit:cover; will-change:transform; transform:scale(1.08); animation:kenburns 22s ease-in-out infinite alternate}
@keyframes kenburns{from{transform:scale(1.08) translate3d(0,0,0)}to{transform:scale(1.18) translate3d(-2%,-2%,0)}}
.hero-scrim{position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(20,17,14,.55) 0%,rgba(20,17,14,.15) 32%,rgba(20,17,14,.22) 55%,rgba(20,17,14,.86) 100%);}
.hero-scrim.side{background:linear-gradient(180deg,rgba(20,17,14,.62),rgba(20,17,14,.2) 40%,rgba(20,17,14,.9)),radial-gradient(120% 90% at 15% 90%,rgba(20,17,14,.7),transparent 55%)}
.hero-inner{position:relative; z-index:2; width:100%; padding-bottom:clamp(56px,9vh,120px); padding-top:140px}
.hero h1{color:var(--ivory); font-size:clamp(2.7rem,6.6vw,6.4rem); font-weight:500; max-width:15ch; letter-spacing:-.01em}
.hero h1 .em{color:var(--gold); font-style:italic}
.hero-sub{display:flex; align-items:center; gap:22px; margin-top:32px; flex-wrap:wrap}
.hero-ethos{color:var(--gold); font-size:.9rem; font-weight:600; letter-spacing:.32em; text-transform:uppercase}
.hero-ctas{display:flex; gap:16px; margin-top:38px; flex-wrap:wrap}
.hero-word{overflow:hidden; display:block}
.scroll-cue{position:absolute; right:clamp(20px,5vw,56px); bottom:38px; z-index:3; color:var(--ivory); display:flex; flex-direction:column; align-items:center; gap:10px; font-size:.66rem; letter-spacing:.28em; text-transform:uppercase; opacity:.8}
.scroll-cue .line{width:1px; height:52px; background:linear-gradient(var(--gold),transparent); animation:cue 2.4s ease-in-out infinite}
@keyframes cue{0%,100%{transform:scaleY(.4);transform-origin:top;opacity:.4}50%{transform:scaleY(1);opacity:1}}

/* ---------- sections ---------- */
section{position:relative}
.pad{padding:clamp(80px,12vh,150px) 0}
.pad-sm{padding:clamp(56px,8vh,100px) 0}
.bg-ivory{background:var(--ivory)}
.bg-cream{background:var(--cream)}
.bg-dark{background:var(--charcoal); color:var(--ivory)}
.bg-ink{background:var(--ink); color:var(--ivory)}
.sec-head{max-width:760px}
.sec-head.center{margin:0 auto; text-align:center}
.sec-title{font-size:clamp(2rem,4.4vw,3.7rem); letter-spacing:-.01em}
.bg-dark .sec-title,.bg-ink .sec-title{color:var(--ivory)}
.rule{width:64px; height:2px; background:var(--gold); margin:0 0 30px}
.center .rule{margin-left:auto;margin-right:auto}

/* intro / ethos */
.ethos-grid{display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(40px,6vw,90px); align-items:center}
.ethos-words{display:flex; gap:10px; flex-wrap:wrap; margin-top:6px}
.ethos-words span{font-family:var(--serif); font-size:clamp(1.5rem,3vw,2.4rem); font-style:italic; color:var(--gold-deep)}
.ethos-words span+span::before{content:'·'; color:var(--taupe); margin-right:14px; font-style:normal}
.figure-frame{position:relative}
.figure-frame img{border-radius:2px; box-shadow:0 30px 70px -30px rgba(26,23,20,.5)}
.figure-frame::after{content:''; position:absolute; inset:16px -16px -16px 16px; border:1px solid var(--line-gold); z-index:-1; border-radius:2px}
.stat-row{display:flex; gap:clamp(30px,5vw,64px); margin-top:44px; flex-wrap:wrap}
.stat b{display:block; font-family:var(--serif); font-size:clamp(2rem,3.4vw,2.9rem); color:var(--gold-deep); line-height:1}
.stat span{font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--taupe-deep); margin-top:8px; display:block}

/* services cards */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:64px}
.svc{padding:clamp(30px,3vw,44px); background:var(--paper); border:1px solid var(--line); border-radius:3px; transition:.5s var(--ease); position:relative; overflow:hidden}
.bg-dark .svc,.bg-ink .svc{background:rgba(246,241,231,.035); border-color:rgba(217,188,126,.18)}
.svc::before{content:''; position:absolute; left:0; top:0; height:3px; width:0; background:var(--gold); transition:width .55s var(--ease)}
.svc:hover{transform:translateY(-6px); box-shadow:0 34px 60px -34px rgba(26,23,20,.4); border-color:var(--line-gold)}
.svc:hover::before{width:100%}
.svc-ico{width:56px; height:56px; color:var(--gold-deep); margin-bottom:26px}
.bg-dark .svc-ico{color:var(--gold)}
.svc-ico svg{width:100%;height:100%;stroke-width:1.1}
.svc h3{font-size:1.7rem; margin-bottom:14px}
.bg-dark .svc h3{color:var(--ivory)}
.svc p{color:var(--taupe-deep); margin:0; font-size:1rem}
.bg-dark .svc p{color:rgba(246,241,231,.7)}
.svc .more{margin-top:22px; font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--gold-deep); display:inline-flex; gap:.5em; align-items:center}

/* projects editorial */
.projects{display:flex; flex-direction:column; gap:clamp(80px,11vh,150px); margin-top:80px}
.proj{display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,5vw,80px); align-items:center}
.proj.flip .proj-media{order:2}
.proj-media{position:relative; overflow:hidden; border-radius:2px}
.proj-media img{width:100%; aspect-ratio:4/3.05; object-fit:cover; will-change:transform; transform:scale(1.06)}
.proj-media.draw{background:var(--paper); border:1px solid var(--line)}
.proj-media.draw img{object-fit:contain; aspect-ratio:4/3.05; transform:none; padding:26px; mix-blend-mode:multiply}
.proj-media .tag{position:absolute; left:0; bottom:0; background:var(--charcoal); color:var(--gold); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; padding:11px 18px}
.proj-yr{font-family:var(--serif); font-size:clamp(3rem,6vw,5rem); color:var(--gold); line-height:.9; opacity:.9; font-style:italic}
.proj-body h3{font-size:clamp(1.9rem,3.4vw,3rem); margin:14px 0 8px}
.proj-loc{font-size:.82rem; letter-spacing:.2em; text-transform:uppercase; color:var(--taupe-deep); margin-bottom:22px}
.proj-body p{color:var(--ink-soft); font-size:1.08rem; max-width:52ch}
.proj.text-only{grid-template-columns:1fr; text-align:left; max-width:none}
.proj.text-only .proj-body{display:grid; grid-template-columns:auto 1fr; gap:clamp(28px,5vw,70px); align-items:start; border-top:1px solid var(--line-gold); padding-top:44px}
.proj.text-only p{font-size:1.15rem; max-width:60ch}

/* full-bleed atmospheric photo band */
.photo-sec{position:relative; overflow:hidden; background:var(--charcoal); isolation:isolate}
.photo-bg{position:absolute; inset:-14% 0; z-index:0; background-size:cover; background-position:center; will-change:transform}
.photo-ov{position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(20,17,14,.72),rgba(20,17,14,.58) 45%,rgba(20,17,14,.82));}
.photo-sec .wrap{position:relative; z-index:2}

/* quote / statement band */
.statement{text-align:center; max-width:22ch; margin:0 auto; font-size:clamp(2rem,5vw,4rem); color:var(--ivory); font-weight:500; line-height:1.12}
.statement .g{color:var(--gold); font-style:italic}

/* CTA */
.cta-band{text-align:center}
.cta-band h2{font-size:clamp(2.2rem,5vw,4rem); color:var(--ivory); max-width:16ch; margin:0 auto .5em}
.cta-band .g{color:var(--gold); font-style:italic}
.cta-tel{display:inline-flex; align-items:center; gap:12px; margin-top:14px; font-family:var(--serif); font-size:clamp(1.6rem,3vw,2.4rem); color:var(--gold)}

/* service page hero band */
.page-hero{position:relative; min-height:62vh; display:flex; align-items:flex-end; background:var(--charcoal); overflow:hidden}
.page-hero .hero-media img{animation:kenburns 26s ease-in-out infinite alternate}
.page-hero .hero-inner{padding-top:170px; padding-bottom:clamp(48px,7vh,86px)}
.page-hero h1{color:var(--ivory); font-size:clamp(2.4rem,5.6vw,5rem); max-width:16ch}
.crumb{color:var(--gold); font-size:.8rem; letter-spacing:.24em; text-transform:uppercase; margin-bottom:22px}
.crumb a{opacity:.8} .crumb a:hover{opacity:1}

/* prose two-col */
.svc-body{display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(40px,7vw,110px); align-items:start}
.svc-body .lede{font-family:var(--serif); font-size:clamp(1.5rem,2.6vw,2.1rem); line-height:1.4; color:var(--ink); font-style:italic}
.incl{list-style:none; padding:0; margin:34px 0 0; display:grid; gap:2px}
.incl li{display:flex; gap:18px; align-items:flex-start; padding:20px 0; border-top:1px solid var(--line)}
.incl li:last-child{border-bottom:1px solid var(--line)}
.incl svg{width:22px;height:22px;color:var(--gold-deep);flex:none;margin-top:3px;stroke-width:1.4}
.incl b{font-family:var(--serif); font-size:1.28rem; font-weight:500; display:block; margin-bottom:3px}
.incl p{margin:0; color:var(--taupe-deep); font-size:.98rem}

/* contact */
.contact-grid{display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(40px,6vw,90px); align-items:start}
.info-list{list-style:none; padding:0; margin:30px 0 0}
.info-list li{display:flex; gap:18px; padding:22px 0; border-top:1px solid var(--line-gold); align-items:flex-start}
.info-list svg{width:24px;height:24px;color:var(--gold-deep);flex:none;stroke-width:1.4;margin-top:2px}
.info-list b{display:block; font-size:.76rem; letter-spacing:.2em; text-transform:uppercase; color:var(--taupe-deep); margin-bottom:6px; font-family:var(--sans); font-weight:600}
.info-list a,.info-list span{font-family:var(--serif); font-size:1.5rem; color:var(--ink)}
.info-list a:hover{color:var(--gold-deep)}
.form-card{background:var(--paper); border:1px solid var(--line-gold); padding:clamp(30px,4vw,52px); border-radius:3px; box-shadow:0 40px 90px -50px rgba(26,23,20,.45)}
.field{margin-bottom:22px}
.field label{display:block; font-size:.76rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--taupe-deep); margin-bottom:9px}
.field input,.field select,.field textarea{
  width:100%; font-family:var(--sans); font-size:1rem; color:var(--ink);
  padding:14px 16px; border:1px solid var(--line); background:#fff; border-radius:2px; transition:.3s;
}
.field textarea{resize:vertical; min-height:130px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--gold-deep); box-shadow:0 0 0 3px rgba(217,188,126,.18)}
.field.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.two{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.form-note{font-size:.86rem; color:var(--taupe-deep); margin-top:6px}
.form-msg{margin-top:16px; font-size:.95rem; display:none}
.form-msg.show{display:block}
.form-msg.ok{color:#2f6b46} .form-msg.err{color:#a2432f}
.cf-turnstile{margin:6px 0 20px}

/* footer */
.site-foot{background:var(--charcoal); color:rgba(246,241,231,.72); padding:clamp(64px,9vh,110px) 0 40px}
.foot-top{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:44px; padding-bottom:56px; border-bottom:1px solid rgba(217,188,126,.16)}
.foot-brand img{width:64px;height:64px;object-fit:contain;margin-bottom:20px}
.foot-brand p{max-width:34ch; font-size:.98rem}
.foot-tag{font-family:var(--serif); font-style:italic; color:var(--gold); font-size:1.3rem; margin-bottom:16px}
.foot-col h4{font-family:var(--sans); font-size:.76rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:20px; font-weight:600}
.foot-col a,.foot-col p{display:block; color:rgba(246,241,231,.72); margin-bottom:12px; font-size:.98rem}
.foot-col a:hover{color:var(--gold)}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:28px; flex-wrap:wrap; gap:14px; font-size:.82rem; color:rgba(246,241,231,.5)}
.foot-bottom .ethos{letter-spacing:.28em; text-transform:uppercase; color:var(--gold); font-size:.72rem}

/* reveal */
.reveal{opacity:0; transform:translateY(34px)}
.reveal.in{opacity:1; transform:none; transition:opacity 1s var(--ease), transform 1s var(--ease)}
.reveal.d1{transition-delay:.09s}.reveal.d2{transition-delay:.18s}.reveal.d3{transition-delay:.27s}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .site-head:not(.solid){background:linear-gradient(180deg,rgba(20,17,14,.62),rgba(20,17,14,0))}
  .burger span{background:#fff}
  .nav .lnk{display:none}
  .burger{display:flex}
  .nav.open .lnk{display:flex}
  .nav.open{position:fixed; inset:0; background:rgba(20,17,14,.98); flex-direction:column; justify-content:center; gap:30px; z-index:70}
  .nav.open .lnk{font-size:1.4rem}
  .nav.open .burger{position:absolute; top:26px; right:26px}
  .ethos-grid,.svc-grid,.proj,.proj.flip .proj-media,.svc-body,.contact-grid,.foot-top,.proj.text-only .proj-body{grid-template-columns:1fr}
  .proj.flip .proj-media{order:0}
  .svc-grid{gap:18px}
  .two{grid-template-columns:1fr}
  .foot-top{gap:36px}
  .hero-media img{animation-duration:30s}
}
@media(max-width:560px){
  body{font-size:16px}
  .hero h1{font-size:clamp(2.3rem,10vw,3.2rem)}
  .brand-txt span{display:none}
  .stat-row{gap:26px}
  .eyebrow{letter-spacing:.2em; font-size:.72rem; white-space:normal; overflow-wrap:break-word}
  .hero-inner .eyebrow{max-width:100%}
  .crumb{letter-spacing:.16em}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important; transition:none!important}
  .reveal{opacity:1; transform:none}
  .hero-media img{transform:scale(1.05)}
}
