:root{
  --bone:#F1ECE2;
  --bone-deep:#E7E0D2;
  --ink:#1B1815;
  --ink-soft:#4A4540;
  --moss:#4B5A40;
  --moss-deep:#333F2C;
  --moss-bright:#6B7F5B;
  --brass:#A6813C;
  --brass-light:#CDA85F;
  --line: rgba(27,24,21,0.14);
  --line-soft: rgba(27,24,21,0.08);
  --max: 1180px;
  --ease: cubic-bezier(.22,.68,.32,1);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bone);
  color:var(--ink);
  font-family:'Public Sans', sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
::selection{background:var(--moss); color:var(--bone);}

h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  font-weight:500;
  line-height:1.08;
  margin:0;
  letter-spacing:-0.01em;
}
em{font-style:italic; font-weight:400;}

.eyebrow{
  font-family:'Space Mono', monospace;
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--moss-deep);
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}
.eyebrow::before{
  content:"";
  width:28px;
  height:1px;
  background:linear-gradient(90deg, var(--brass), var(--brass-light));
  display:inline-block;
}

.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}

/* NAV */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(241,236,226,0.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-soft);
  transition:box-shadow .3s var(--ease), background .3s var(--ease);
}
header.scrolled{
  background:rgba(241,236,226,0.96);
  box-shadow:0 12px 30px -18px rgba(27,24,21,0.25);
}
nav{
  max-width:var(--max); margin:0 auto; padding:20px 32px;
  display:flex; align-items:center; justify-content:space-between;
}
.logo{
  font-family:'Fraunces', serif;
  font-size:20px;
  letter-spacing:0.02em;
  font-weight:500;
  position:relative;
  transition:letter-spacing .3s var(--ease), color .3s var(--ease);
}
.logo:hover{letter-spacing:0.04em;}
.logo span{
  background:linear-gradient(90deg, var(--moss) 0%, var(--moss-bright) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.navlinks{display:flex; gap:36px; font-size:14px; letter-spacing:0.03em;}
.navlinks a{position:relative; padding-bottom:4px; color:var(--ink-soft); transition:color .3s var(--ease);}
.navlinks a:hover, .navlinks a.active{color:var(--ink);}
.navlinks a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:linear-gradient(90deg, var(--brass), var(--moss)); transition:width .35s var(--ease);
}
.navlinks a:hover::after, .navlinks a.active::after{width:100%;}
.navcta{
  position:relative; overflow:hidden;
  font-family:'Space Mono', monospace; font-size:11px; letter-spacing:0.12em; text-transform:uppercase;
  border:1px solid var(--ink); padding:10px 18px; transition:color .4s var(--ease), border-color .4s var(--ease);
  z-index:1;
}
.navcta::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(120deg, var(--ink), var(--moss-deep));
  transform:translateX(-101%);
  transition:transform .45s var(--ease);
}
.navcta:hover{color:var(--bone); border-color:var(--moss-deep);}
.navcta:hover::before{transform:translateX(0);}
.burger{display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:8px;}
.burger span{width:22px; height:1px; background:var(--ink); display:block; transition:transform .3s var(--ease), opacity .3s var(--ease);}

.mobile-menu{
  position:fixed; inset:0; background:var(--bone); z-index:99;
  display:none; flex-direction:column; align-items:center; justify-content:center; gap:32px;
  font-family:'Fraunces',serif; font-size:28px;
}
.mobile-menu.open{display:flex;}
.mobile-menu a{position:relative; transition:color .3s var(--ease);}
.mobile-menu a:hover{color:var(--moss);}

/* HERO (home) */
.hero{
  position:relative;
  min-height:100vh;
  display:flex; align-items:flex-end;
  overflow:hidden;
  margin-top: 80px;
}
.hero-bg{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(27,24,21,0.10) 0%, rgba(27,24,21,0.35) 55%, rgba(27,24,21,0.72) 100%),
    linear-gradient(115deg, rgba(75,90,64,0.35) 0%, rgba(27,24,21,0.05) 40%),
    url('https://assets.zyrosite.com/cdn-cgi/image/format=auto,w=1920,fit=crop/BxFaxobzyJzpGBk9/64a16e7a-c180-4947-a56e-b8066f855c10-tcY9Pdp6fYdLKufS.png') center/cover no-repeat;
  background-blend-mode:normal, multiply, normal;
  transform:scale(1.08);
  transition:transform 6s var(--ease);
}
.hero.loaded .hero-bg{transform:scale(1);}
.hero::after{
  content:"";
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(120% 60% at 50% 100%, rgba(166,129,60,0.10), transparent 60%);
}
.hero-content{
  position:relative; z-index:2; color:var(--bone);
  max-width:var(--max); margin:0 auto; width:100%;
  padding:0 32px 80px;
}
.hero .eyebrow{color:#D8CFAE;}
.hero .eyebrow::before{background:linear-gradient(90deg, var(--brass-light), var(--brass));}
.hero h1{
  font-size:clamp(40px, 6.4vw, 92px);
  max-width:14ch;
  color:var(--bone);
  background:linear-gradient(100deg, #FBF8F1 0%, var(--bone) 40%, #E3D9C2 100%);
  -webkit-background-clip:text; background-clip:text;
}
.stats{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:24px; margin-top:64px;
  border-top:1px solid rgba(241,236,226,0.25);
  padding-top:28px;
  max-width:800px;
}
.stats > div{transition:transform .4s var(--ease);}
.stats > div:hover{transform:translateY(-4px);}
.stat-num{
  font-family:'Fraunces', serif; font-size:clamp(28px,3vw,40px); font-weight:500;
  background:linear-gradient(90deg, var(--bone), var(--brass-light));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat-label{font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; opacity:0.75; margin-top:6px;}

/* PAGE HERO (interior pages) */
.page-hero{
  padding:190px 0 90px;
  position:relative;
}
.page-hero .split{align-items:center;}
.page-hero-plain{
  padding:190px 0 30px; text-align:left;
  position:relative;
}
.page-hero-plain::before{
  content:"";
  position:absolute; top:0; right:-10%; width:60%; height:520px;
  /* background:radial-gradient(closest-side, rgba(166,129,60,0.10), transparent 70%); */
  pointer-events:none; z-index:-1;
}
.page-hero-plain .eyebrow{justify-content:flex-start;}
.page-hero-plain h1{font-size:clamp(34px,5.2vw,64px); max-width:20ch;}
.page-hero-plain p{color:var(--ink-soft); font-size:16px; line-height:1.8; max-width:60ch; margin-top:22px;}
.page-hero-cta{display:flex; gap:16px; margin-top:32px; flex-wrap:wrap;}

section{padding:120px 0;}
.section-head{
  display:grid; grid-template-columns:1fr 1.3fr; gap:60px;
  margin-bottom:72px; align-items:end;
}
.section-head h2{font-size:clamp(30px,3.6vw,48px);}
.section-head p{color:var(--ink-soft); font-size:16px; line-height:1.7; max-width:46ch;}

/* CARDS */
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);}
.card{
  background:var(--bone); padding:44px 36px; position:relative; overflow:hidden;
  transition:background .4s var(--ease), transform .4s var(--ease), box-shadow .4s var(--ease);
}
.card::before{
  content:""; position:absolute; left:0; top:0; width:3px; height:0;
  background:linear-gradient(180deg, var(--brass), var(--moss));
  transition:height .45s var(--ease);
}
.card:hover{
  background:#FBF8F1;
  transform:translateY(-6px);
  box-shadow:0 24px 44px -30px rgba(27,24,21,0.35);
  z-index:2;
}
.card:hover::before{height:100%;}
.card-img-wrap{overflow:hidden; margin-bottom:28px; position:relative; border-radius:2px;}
.card-img{
  width:100%; aspect-ratio:1/1; object-fit:cover; margin-bottom:0;
  filter:grayscale(35%) contrast(1.02);
  transform:scale(1.001);
  transition:transform .6s var(--ease), filter .6s var(--ease);
}
.card:hover .card-img{transform:scale(1.08); filter:grayscale(0%) contrast(1.05);}
.card h3{font-size:24px; margin-bottom:14px; transition:color .3s var(--ease);}
.card:hover h3{color:var(--moss-deep);}
.card p{color:var(--ink-soft); font-size:14.5px; line-height:1.7;}

/* PROCESS / BLUEPRINT LINE */
.process{
  background:linear-gradient(160deg, var(--ink) 0%, #221E19 60%, var(--ink) 100%);
  color:var(--bone);
  position:relative;
}
.process .eyebrow{color:#B8AE94;}
.process .eyebrow::before{background:linear-gradient(90deg, var(--brass-light), var(--brass));}
.process .section-head h2{color:var(--bone);}
.process .section-head p{color:#B7B1A6;}
.steps{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:40px;}
.steps::before{
  content:""; position:absolute; top:28px; left:0; right:0; height:1px;
  background:rgba(241,236,226,0.16);
}
.steps-line{
  position:absolute; top:28px; left:0; height:1px;
  background:linear-gradient(90deg, var(--brass), var(--brass-light), var(--moss-bright));
  width:0%; transition:width 1.4s var(--ease);
}
.step{position:relative; padding-top:64px; transition:transform .4s var(--ease);}
.step:hover{transform:translateY(-4px);}
.step-num{
  position:absolute; top:0; left:0;
  width:56px; height:56px; border-radius:50%;
  border:1px solid rgba(241,236,226,0.3);
  display:flex; align-items:center; justify-content:center;
  font-family:'Space Mono',monospace; font-size:13px;
  background:var(--ink);
  transition:border-color .4s var(--ease), background .4s var(--ease), color .4s var(--ease), transform .4s var(--ease);
}
.step:hover .step-num{
  border-color:var(--brass);
  background:linear-gradient(135deg, var(--brass), var(--moss-deep));
  transform:rotate(-8deg) scale(1.06);
}
.step h4{font-size:20px; margin-bottom:12px; font-weight:400; font-style:italic; transition:color .3s var(--ease);}
.step:hover h4{color:var(--brass-light);}
.step p{font-size:14px; color:#B7B1A6; line-height:1.7;}

/* CTA BAND */
.cta-band{
  text-align:center; padding:100px 32px;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  position:relative; overflow:hidden;
}
.cta-band::before{
  content:""; position:absolute; left:50%; top:50%; width:900px; height:900px;
  background:radial-gradient(closest-side, rgba(75,90,64,0.08), transparent 70%);
  transform:translate(-50%,-50%); pointer-events:none;
}
.cta-band h2{font-size:clamp(30px,4vw,48px); max-width:18ch; margin:0 auto 28px; position:relative;}
.cta-band p{color:var(--ink-soft); margin-bottom:36px; max-width:52ch; margin-left:auto; margin-right:auto; position:relative;}
.btn{
  position:relative; overflow:hidden; z-index:1;
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Space Mono',monospace; font-size:12px; letter-spacing:0.1em; text-transform:uppercase;
  background:var(--ink); color:var(--bone); padding:16px 30px;
  transition:letter-spacing .35s var(--ease), color .35s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(120deg, var(--moss-deep), var(--brass));
  transform:translateX(-102%);
  transition:transform .5s var(--ease);
}
.btn:hover{letter-spacing:0.16em; box-shadow:0 14px 28px -14px rgba(27,24,21,0.45); transform:translateY(-2px);}
.btn:hover::before{transform:translateX(0);}
.btn:active{transform:translateY(0) scale(.98);}
.btn-outline{background:transparent; color:var(--ink); border:1px solid var(--ink);}
.btn-outline::before{background:linear-gradient(120deg, var(--ink), var(--moss-deep));}
.btn-outline:hover{color:var(--bone); border-color:var(--moss-deep);}

/* SPLIT */
.split{display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;}
.split img{width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .6s var(--ease), filter .6s var(--ease);}
.split img:hover{transform:scale(1.02); filter:saturate(1.08);}
.split-text .eyebrow{margin-bottom:22px;}
.split-text h2{font-size:clamp(30px,4vw,52px); margin-bottom:24px;}
.split-text p{color:var(--ink-soft); line-height:1.8; font-size:16px; margin-bottom:18px;}
.reverse .split{grid-template-columns:1fr 1fr;}
.reverse .split > .split-text{order:2;}
.reverse .split > img{order:1;}

.principle{
  max-width:760px; margin:0px auto 0; text-align:center;
  padding-top:70px; border-top:1px solid var(--line);
  position:relative;
}
.principle::before{
  content:"“"; position:absolute; top:8px; left:50%; transform:translateX(-50%);
  font-family:'Fraunces', serif; font-size:80px; font-style:italic; line-height:1;
  color:var(--brass); opacity:0.35;
}
.principle h2{font-size:clamp(28px,4vw,44px); font-style:italic; font-weight:400; line-height:1.3;}
.principle p{color:var(--ink-soft); margin-top:24px; font-size:16px; line-height:1.8;}

/* SERVICES LIST */
.service-list{border-top:1px solid var(--line);}
.service-row{
  display:grid; grid-template-columns:0.5fr 2fr 3fr; gap:40px;
  padding:44px 24px; border-bottom:1px solid var(--line);
  align-items:baseline;
  margin:0 -24px;
  position:relative;
  transition:background .35s var(--ease), padding-left .35s var(--ease);
}
.service-row:hover{
  background:linear-gradient(90deg, rgba(166,129,60,0.07), transparent 70%);
  padding-left:36px;
}
.service-row .num{font-family:'Space Mono',monospace; font-size:13px; color:var(--brass); transition:transform .35s var(--ease);}
.service-row:hover .num{transform:translateX(4px);}
.service-row h3{font-size:26px; font-weight:500; transition:color .3s var(--ease);}
.service-row:hover h3{color:var(--moss-deep);}
.service-row p{color:var(--ink-soft); font-size:15px; line-height:1.7; max-width:48ch;}

/* PORTFOLIO GRID */
.gallery{
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
}
.gallery-item{
  position:relative; overflow:hidden; display:block;
  aspect-ratio:1/1;
}
.gallery-item img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .7s var(--ease), filter .7s var(--ease);
  filter:saturate(0.92);
}
.gallery-item::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(200deg, rgba(27,24,21,0) 40%, rgba(27,24,21,0.75) 100%);
  opacity:0; transition:opacity .45s var(--ease);
}
.gallery-item .gallery-caption{
  position:absolute; left:20px; right:20px; bottom:18px; z-index:2;
  color:var(--bone);
  font-family:'Space Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase;
  display:flex; align-items:center; justify-content:space-between;
  opacity:0; transform:translateY(10px);
  transition:opacity .45s var(--ease), transform .45s var(--ease);
}
.gallery-item:hover img{transform:scale(1.1); filter:saturate(1.05);}
.gallery-item:hover::after{opacity:1;}
.gallery-item:hover .gallery-caption{opacity:1; transform:translateY(0);}
.gallery-caption .plus{
  width:26px; height:26px; border:1px solid rgba(241,236,226,0.5); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:14px;
}

.quote{
  max-width:820px; margin:100px auto 0; text-align:center;
}
.quote blockquote{
  font-family:'Fraunces', serif; font-style:italic; font-weight:400;
  font-size:clamp(22px,3vw,32px); line-height:1.5; margin:0 0 24px;
}
.quote cite{font-family:'Space Mono',monospace; font-size:12px; letter-spacing:0.06em; font-style:normal; color:var(--ink-soft);}

/* CONTACT */
.contact-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:80px;}
.form-field{margin-bottom:26px; position:relative;}
.form-field label{
  display:block; font-family:'Space Mono',monospace; font-size:11px;
  letter-spacing:0.1em; text-transform:uppercase; margin-bottom:10px; color:var(--ink-soft);
  transition:color .3s var(--ease);
}
.form-field input, .form-field textarea{
  width:100%; border:none; border-bottom:1px solid var(--line);
  background:transparent; padding:12px 0; font-family:'Public Sans',sans-serif;
  font-size:16px; color:var(--ink); outline:none; transition:border-color .3s var(--ease);
}
.form-field::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:linear-gradient(90deg, var(--brass), var(--moss));
  transition:width .4s var(--ease);
}
.form-field:focus-within::after{width:100%;}
.form-field:focus-within label{color:var(--moss-deep);}
.form-field textarea{resize:vertical; min-height:110px;}
.contact-side{
  background:linear-gradient(165deg, var(--ink) 0%, #241F1A 100%);
  color:var(--bone); padding:48px 40px;
  height:fit-content;
}
.contact-side .eyebrow{color:#B8AE94;}
.contact-side .eyebrow::before{background:linear-gradient(90deg, var(--brass-light), var(--brass));}
.contact-side h3{font-size:26px; margin-bottom:18px; font-weight:400; font-style:italic;}
.contact-side p{color:#B7B1A6; font-size:14.5px; line-height:1.7; margin-bottom:28px;}
.contact-detail{border-top:1px solid rgba(241,236,226,0.16); padding-top:20px; margin-top:20px; transition:padding-left .3s var(--ease);}
.contact-detail:hover{padding-left:6px;}
.contact-detail div{font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.05em; text-transform:uppercase; color:#8F897C; margin-bottom:6px;}
.contact-detail a{font-size:15px; transition:color .3s var(--ease);}
.contact-detail a:hover{color:var(--brass-light);}

/* FOOTER */
footer{background:linear-gradient(180deg, var(--ink) 0%, #16130F 100%); color:var(--bone); padding:90px 0 30px;}
.footer-grid{
  display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:60px;
  padding-bottom:60px; border-bottom:1px solid rgba(241,236,226,0.14);
}
footer .logo{color:var(--bone); font-size:24px; margin-bottom:16px;}
footer .logo span{
  background:linear-gradient(90deg, var(--brass-light), var(--brass));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
footer .foot-desc{color:#B7B1A6; font-size:14.5px; line-height:1.7; max-width:34ch;}
.foot-col div.eyebrow{color:#8F897C; margin-bottom:20px;}
.foot-col .eyebrow::before{background:linear-gradient(90deg, var(--brass-light), var(--brass));}
.foot-col a, .foot-col p{display:block; color:#D8D3C6; font-size:14.5px; margin-bottom:12px; transition:color .3s var(--ease), transform .3s var(--ease); width:fit-content;}
.foot-col a:hover{color:var(--brass-light); transform:translateX(4px);}
.foot-bottom{
  display:flex; justify-content:space-between; padding-top:28px;
  font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.04em; color:#8F897C;
  flex-wrap:wrap; gap:12px;
}

.reveal{opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}

@media (max-width: 900px){
  .navlinks, .navcta{display:none;}
  .burger{display:flex;}
  .stats{grid-template-columns:1fr; gap:18px;}
  .section-head{grid-template-columns:1fr; gap:20px;}
  .cards{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr; gap:56px;}
  .steps::before, .steps-line{display:none;}
  .split, .reverse .split{grid-template-columns:1fr; gap:36px;}
  .reverse .split > .split-text, .reverse .split > img{order:0;}
  .service-row{grid-template-columns:1fr; gap:12px; margin:0;}
  .service-row:hover{padding-left:24px;}
  .gallery{grid-template-columns:repeat(2,1fr);}
  .contact-grid{grid-template-columns:1fr; gap:50px;}
  .footer-grid{grid-template-columns:1fr; gap:36px;}
  section{padding:80px 0;}
  .page-hero-plain{padding:150px 0 20px;}
}
