:root{
  --ink:#141613;
  --paper:#f3f0e9;
  --paper-2:#e9e4da;
  --stone:#a79b87;
  --line:rgba(20,22,19,.14);
  --white:#fff;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
}
img{display:block;width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
.site-header{
  position:absolute;
  z-index:20;
  top:0;left:0;right:0;
  display:flex;align-items:center;justify-content:space-between;
  width:min(calc(100% - 48px),var(--max));
  margin:0 auto;
  padding:24px 0;
  color:white;
}
.brand{display:inline-flex;align-items:center;gap:13px}

.logo-brand{
  display:inline-flex;
  align-items:center;
}
.logo-brand img{
  display:block;
  width:100%;
  height:auto;
}
.site-header .logo-brand{
  width:min(220px,24vw);
}
.footer-brand{
  width:min(280px,50vw);
}

.brand-mark{position:relative;width:31px;height:31px;display:inline-block}
.brand-mark:before,.brand-mark:after,.brand-mark span:before,.brand-mark span:after{
  content:"";position:absolute;background:currentColor;
}
.brand-mark:before{width:6px;height:31px;left:12px;top:0}
.brand-mark:after{width:25px;height:6px;left:2px;top:9px}
.brand-mark span:before{
  width:14px;height:6px;left:0;bottom:0;transform:skewY(-27deg);transform-origin:right center
}
.brand-mark span:after{
  width:14px;height:6px;right:1px;bottom:0;transform:skewY(27deg);transform-origin:left center
}
.brand-type{display:flex;flex-direction:column;line-height:1}
.brand-type strong{letter-spacing:.16em;font-size:.9rem}
.brand-type small{letter-spacing:.27em;font-size:.48rem;margin-top:6px}
.nav{display:flex;align-items:center;gap:30px;font-size:.9rem}
.nav a{opacity:.92}
.nav a:hover{opacity:1}
.nav-cta{border:1px solid rgba(255,255,255,.6);padding:11px 16px}
.menu-toggle{display:none;background:none;border:0;color:white}
.hero{min-height:92vh;position:relative;color:#fff;display:grid;align-items:end}
.hero-bg{
  position:absolute;inset:0;
  background:url("assets/photo-12.jpg") center 56% / cover no-repeat;
}
.hero-shade{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.2) 58%,rgba(0,0,0,.14) 100%),
             linear-gradient(0deg,rgba(0,0,0,.35),transparent 50%);
}
.hero-content{
  position:relative;z-index:2;
  width:min(calc(100% - 48px),var(--max));
  margin:0 auto;
  padding:190px 0 110px;
}
.eyebrow{
  margin:0 0 18px;
  letter-spacing:.2em;
  font-weight:600;
  font-size:.72rem;
}
.eyebrow.dark{color:#6c665b}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;font-weight:500;line-height:1.06;margin:0}
h1{font-size:clamp(3.6rem,7.7vw,7.8rem);max-width:1000px;letter-spacing:-.035em}
.hero-copy{max-width:600px;font-size:1.12rem;margin:26px 0 0;color:rgba(255,255,255,.88)}
.hero-actions{display:flex;gap:12px;margin-top:34px;flex-wrap:wrap}
.button{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 21px;border:1px solid transparent;
  font-weight:600;font-size:.9rem;cursor:pointer;
}
.button-light{background:white;color:var(--ink)}
.button-outline{border-color:rgba(255,255,255,.68);color:white;background:rgba(255,255,255,.04)}
.scroll-cue{
  position:absolute;z-index:2;right:clamp(24px,5vw,72px);bottom:34px;
  writing-mode:vertical-rl;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;opacity:.7
}
.section{width:min(calc(100% - 48px),var(--max));margin:0 auto;padding:120px 0}
.intro{display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;align-items:center}
.intro h2,.section-heading h2,.about h2{font-size:clamp(2.5rem,5vw,5rem);letter-spacing:-.03em}
.intro p:not(.eyebrow),.about-copy p{max-width:620px;color:#4d4c47;font-size:1.05rem}
.feature-image{margin:0}
.feature-image img{aspect-ratio:4/5;object-fit:cover}
.section-heading{max-width:900px;margin-bottom:50px}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.service-card{background:#eae5dc}
.service-card img{aspect-ratio:4/3;object-fit:cover}
.service-body{padding:28px}
.service-body span{font-size:.72rem;letter-spacing:.18em;color:#766f63}
.service-body h3{font-size:2rem;margin:12px 0 12px}
.service-body p{margin:0;color:#52504a}
.builder-strip{
  background:#171915;color:white;
  display:grid;grid-template-columns:1.5fr .7fr;gap:8vw;
  padding:100px max(24px,calc((100vw - var(--max))/2));
}
.builder-strip h2{font-size:clamp(2.3rem,4.2vw,4.7rem);max-width:900px}
.builder-points{align-self:end;border-left:1px solid rgba(255,255,255,.22);padding-left:30px}
.builder-points p{margin:0 0 10px;color:rgba(255,255,255,.78)}
.portfolio-heading{display:grid;grid-template-columns:1.25fr .75fr;gap:7vw;max-width:none;align-items:end}
.portfolio-heading>p{color:#57564f;margin:0 0 10px}
.gallery{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:180px;
  gap:12px;
}
.gallery-item{
  padding:0;border:0;background:none;cursor:zoom-in;overflow:hidden;
  grid-column:span 4;grid-row:span 2;
}
.gallery-item.wide{grid-column:span 8}
.gallery-item.tall{grid-column:span 4;grid-row:span 4}
.gallery-item img{height:100%;object-fit:cover;transition:transform .5s ease}
.gallery-item:hover img{transform:scale(1.02)}
.about{display:grid;grid-template-columns:1.1fr .9fr;gap:8vw;align-items:center}
.about-image img{aspect-ratio:4/5;object-fit:cover}
.contact{position:relative;color:white;min-height:820px;display:grid;align-items:center}
.contact-bg{position:absolute;inset:0;background:url("assets/photo-21.jpg") center 47%/cover no-repeat}
.contact-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.74),rgba(0,0,0,.28))}
.contact-inner{position:relative;z-index:2;width:min(calc(100% - 48px),var(--max));margin:0 auto;padding:110px 0}
.contact h2{font-size:clamp(3rem,6vw,6.6rem);letter-spacing:-.035em}
.contact-inner>p:not(.eyebrow){max-width:670px;color:rgba(255,255,255,.83)}
.contact-form{max-width:760px;margin-top:42px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form label{display:flex;flex-direction:column;gap:7px;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.contact-form input,.contact-form textarea{
  width:100%;border:1px solid rgba(255,255,255,.34);background:rgba(12,14,12,.42);
  color:white;padding:13px 14px;outline:none;border-radius:0;
}
.contact-form input:focus,.contact-form textarea:focus{border-color:white}
.form-note{font-size:.76rem!important;margin-top:12px!important;opacity:.75}
.footer{
  background:#10120f;color:white;
  padding:48px max(24px,calc((100vw - var(--max))/2));
  display:grid;grid-template-columns:1.2fr 1fr auto;gap:24px;align-items:center
}
.footer-brand{grid-row:span 2}
.footer p{margin:0;color:rgba(255,255,255,.64)}
.footer-links{display:flex;gap:20px;justify-self:end}
.footer>small{grid-column:2/-1;justify-self:end;color:rgba(255,255,255,.45)}
.lightbox{
  border:0;padding:0;background:rgba(0,0,0,.94);width:100vw;height:100vh;max-width:none;max-height:none
}
.lightbox::backdrop{background:rgba(0,0,0,.94)}
.lightbox img{width:100%;height:100%;object-fit:contain;padding:42px}
.lightbox-close{
  position:fixed;right:18px;top:12px;z-index:5;border:0;background:transparent;color:white;font-size:2.2rem;cursor:pointer
}
@media (max-width:900px){
  .nav{display:none;position:absolute;top:78px;right:0;left:0;background:rgba(15,17,15,.96);padding:24px;flex-direction:column;align-items:flex-start}
  .nav.open{display:flex}
  .menu-toggle{display:block}
  .intro,.about,.builder-strip,.portfolio-heading{grid-template-columns:1fr}
  .service-grid{grid-template-columns:1fr}
  .builder-points{border-left:0;border-top:1px solid rgba(255,255,255,.2);padding:24px 0 0}
  .gallery-item,.gallery-item.wide{grid-column:span 6}
  .gallery-item.tall{grid-column:span 6}
  .footer{grid-template-columns:1fr}
  .footer-brand{grid-row:auto}
  .footer-links,.footer>small{justify-self:start;grid-column:auto}
}
@media (max-width:640px){
  .site-header,.hero-content,.section,.contact-inner{width:min(calc(100% - 32px),var(--max))}
  .site-header{padding-top:18px}
  .site-header .logo-brand{width:min(170px,52vw)}
  .footer-brand{width:min(230px,70vw)}
  .hero{min-height:86vh}
  .hero-content{padding-bottom:74px}
  h1{font-size:clamp(3rem,15vw,5.2rem)}
  .section{padding:82px 0}
  .gallery{grid-auto-rows:150px}
  .gallery-item,.gallery-item.wide,.gallery-item.tall{grid-column:span 12}
  .gallery-item.tall{grid-row:span 3}
  .form-grid{grid-template-columns:1fr}
  .contact{min-height:900px}
  .contact-bg{background-position:58% 50%}
  .footer-links{flex-wrap:wrap}
}


.direct-email{
  margin-top:18px!important;
  font-size:.92rem!important;
}
.direct-email a,
.footer-email a{
  text-decoration:underline;
  text-underline-offset:4px;
}
.footer-email{
  margin:0;
  color:rgba(255,255,255,.72);
  font-size:.88rem;
}

.honeypot{
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
}