:root{--lime:#b6b64d;--olive:#4b552e;--graphite:#505150;--ink:#2e302e;--paper:#f8f8f5;--line:#dcded8}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 Montserrat,Arial,sans-serif}
a{color:inherit;text-decoration:none}
.nav{height:102px;position:fixed;z-index:20;top:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:0 4vw;background:rgba(248,248,245,.94);border-bottom:1px solid rgba(80,81,80,.13);backdrop-filter:blur(12px)}
.nav nav{display:flex;gap:2rem;align-items:center;margin-left:auto;font-size:.78rem;text-transform:uppercase;letter-spacing:.09em}
.phone{border:1px solid var(--lime);padding:.7rem 1rem;white-space:nowrap}
.logo{display:flex;align-items:center;justify-content:flex-start}
.logo img{display:block;width:190px;height:auto}
.hero{min-height:850px;height:100vh;position:relative;display:flex;align-items:flex-end;padding:150px 7vw 7vh;overflow:hidden;background:var(--graphite);color:#fff}
.hero-photo{position:absolute;inset:102px 0 0;background:url('hero-v4.png') 68% center/cover no-repeat;transform:scale(1.002)}
.hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,31,27,.92) 0%,rgba(35,38,33,.74) 39%,rgba(35,38,33,.1) 72%),linear-gradient(0deg,rgba(24,26,23,.54) 0%,transparent 44%)}
.hero-copy{position:relative;max-width:930px;z-index:2;padding-left:1.35rem;border-left:3px solid var(--lime)}
.kicker{text-transform:uppercase;letter-spacing:.18em;font-size:.7rem;font-weight:600;color:var(--lime);margin:0 0 1.7rem}
.kicker.dark{color:#80822f}
.hero h1,.statement h2,.section-title h2,.value-copy h2,.contact h2{font-weight:300;font-size:clamp(3.8rem,7vw,7.6rem);line-height:.9;letter-spacing:-.055em;margin:0}
.hero h1{font-size:clamp(3.35rem,6.4vw,7rem);line-height:.9;max-width:900px;text-wrap:balance}
.hero h1 span,.statement em,.value-copy em,.contact em{font-family:Montserrat,Arial,sans-serif;color:var(--olive);font-style:normal;font-weight:500;letter-spacing:-.055em}
.hero h1 span{display:inline-block;white-space:nowrap;color:#d1d25f}
.hero-intro{max-width:640px;margin:1.8rem 0 0;font-size:1.05rem;color:rgba(255,255,255,.86)}
.hero-actions{display:flex;align-items:center;gap:2rem;margin-top:2rem}
.hero-services{display:flex;flex-wrap:wrap;gap:.55rem 1.2rem;margin:0;color:rgba(255,255,255,.72);font-size:.69rem;text-transform:uppercase;letter-spacing:.11em}
.hero-services span+span:before{content:"/";margin-right:1.2rem;color:var(--lime)}
.button{background:var(--olive);color:white;display:inline-flex;gap:3rem;align-items:center;padding:1rem 1.3rem;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem}
.button b{transition:.2s}
.button:hover b{transform:translate(4px,-4px)}
.scroll{position:absolute;right:4vw;bottom:3rem;z-index:3;display:grid;text-align:center;gap:.5rem;text-transform:uppercase;font-size:.62rem;letter-spacing:.15em}
.scroll span{color:var(--lime);font-size:1rem}
.statement{padding:9rem 7vw;text-align:center}
.statement-mark{display:block;width:clamp(112px,10vw,156px);height:auto;margin:0 auto 2rem}
.statement>p{text-transform:uppercase;letter-spacing:.15em;color:#8b8c88;font-size:.7rem}
.statement h2{font-size:clamp(2.7rem,5vw,5.7rem);line-height:1.05}
.services{padding:8rem 7vw;background:#fff}
.section-title{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:5rem}
.section-title h2{font-size:clamp(3rem,5vw,5.6rem)}
.cards{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.card{position:relative;isolation:isolate;overflow:hidden;padding:3rem;min-height:310px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background-color .35s,transform .35s}
.card:before{content:"";position:absolute;inset:0;z-index:-1;background:url('watercolor.png') center 43%/145% auto no-repeat;opacity:0;transition:opacity .35s}
.card:hover{background:#f4f4ec;transform:translateY(-6px)}
.card:hover:before{opacity:.8}
.card>span{font-size:.68rem;color:#888}
.card h3{font-weight:400;font-size:1.7rem;margin:3.5rem 0 1rem}
.card p{color:#70736e;max-width:500px}
.card:hover p{color:#34362f}
.card a{display:inline-block;margin-top:1.2rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid}
.values{min-height:750px;display:grid;grid-template-columns:1fr 1fr;background:var(--graphite);color:white}
.value-photo{background:url('interior.png') 68% center/cover}
.value-copy{padding:8vw 7vw;align-self:center}
.value-copy h2{font-size:clamp(3rem,5vw,5.5rem)}
.value-copy em{color:#fff}
.value-copy>p:not(.kicker){color:#dedfd9;max-width:570px;margin:2rem 0}
.facts{border-top:1px solid #737571;margin-top:3rem}
.facts div{display:flex;justify-content:space-between;padding:1rem 0;border-bottom:1px solid #737571}
.facts strong{font-weight:500}
.facts span{font-size:.75rem;color:#c4c5c0}
.contact{padding:10rem 7vw;position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:8vw;overflow:hidden}
.contact-wash{position:absolute;width:50%;height:130%;object-fit:cover;right:-10%;top:-15%;opacity:.8;mix-blend-mode:multiply;z-index:-1}
.contact h2{font-size:clamp(3rem,5.5vw,6.4rem)}
.contact-copy>p:not(.kicker){max-width:500px;color:#6d706b}
.contact-box{background:white;padding:clamp(2rem,4vw,4rem);box-shadow:0 20px 70px rgba(63,70,35,.1);display:grid;gap:1.6rem}
.contact-box a:not(.button),.contact-box address{font-size:1.1rem;font-style:normal}
.contact-box small{display:block;font-size:.65rem;text-transform:uppercase;letter-spacing:.13em;color:#85877f}
.dark-button{justify-content:space-between;margin-top:1rem}
footer{background:#292b29;color:white;padding:3rem 5vw;display:flex;align-items:center;gap:3rem}
footer img{width:220px}
footer p{margin-left:auto;color:#a9aaa6;font-size:.72rem}
.reveal{opacity:0;transform:translateY(25px);transition:opacity .8s,transform .8s}
.reveal.visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}
.reveal{opacity:1;transform:none;transition:none}
}
@media(max-width:820px){.nav{height:82px;padding:0 1.2rem;display:flex;justify-content:space-between;gap:1rem}
.nav nav{display:flex;margin-left:auto}
.nav nav>a:not(.phone){display:none}
.phone{font-size:.62rem;padding:.55rem}
.logo img{width:150px}
.hero{min-height:760px;padding:120px 1.4rem 3rem;align-items:flex-end}
.hero-photo{inset:82px 0 0;background-position:72% center}
.hero-photo:after{background:linear-gradient(0deg,rgba(24,27,23,.96) 0%,rgba(24,27,23,.72) 52%,rgba(24,27,23,.12) 100%)}
.hero-copy{padding-left:1rem}
.hero h1{font-size:clamp(2.6rem,12vw,4.35rem)}
.hero-intro{font-size:.94rem;line-height:1.65;margin-top:1.4rem}
.hero-actions{align-items:flex-start;flex-direction:column;gap:1.3rem;margin-top:1.5rem}
.hero-services{gap:.4rem .75rem;font-size:.6rem}
.hero-services span+span:before{margin-right:.75rem}
.scroll{display:none}
.statement,.services,.contact{padding:6rem 1.4rem}
.section-title{display:block}
.section-title h2{font-size:3rem}
.cards{grid-template-columns:1fr}
.card{padding:2rem;min-height:260px}
.values{grid-template-columns:1fr}
.value-photo{min-height:420px}
.value-copy{padding:6rem 1.4rem}
.contact{grid-template-columns:1fr}
.contact-wash{width:100%;right:-45%}
footer{flex-direction:column;align-items:flex-start}
footer p{margin:0}
}