:root{
  --stone:#F4F3EE; --stone2:#E9E7DE; --moss:#2F4B3A; --moss2:#233A2C; --leaf:#6E8F4E; --char:#22262A; --sand:#D8CBB3; --mu:#666B63; --line:#DCD9CE;
  --serif:'Spectral',Georgia,serif; --sans:'Figtree',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--stone);color:var(--char);line-height:1.7;font-size:16.5px;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{width:min(1260px,100% - 32px);margin-inline:auto}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;letter-spacing:-.015em}
h1 i,h2 i{color:var(--leaf)}
h2{font-size:clamp(34px,4.4vw,58px)}
.kk{display:block;font-size:12.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--leaf);margin-bottom:14px}
.mu{color:var(--mu)}
.lead{font-size:19px;color:var(--mu);max-width:620px}
.btn{display:inline-flex;align-items:center;gap:10px;font:600 15px var(--sans);padding:15px 26px;border:1px solid var(--char);background:transparent;cursor:pointer;transition:.2s;border-radius:2px}
.btn:hover{background:var(--char);color:var(--stone)}
.btn-m{background:var(--moss);border-color:var(--moss);color:#fff}
.btn-m:hover{background:var(--moss2);border-color:var(--moss2)}
.btn-w{border-color:#fff;color:#fff}
.btn-w:hover{background:#fff;color:var(--moss)}
section{padding:120px 0}
.s2{background:var(--stone2)}
.moss{background:var(--moss);color:#EDEFE6}
.moss .mu,.moss .lead{color:#BCC9BA}
.moss .kk{color:#C6D9A8}
.moss h2 i{color:#C6D9A8}
.shead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:50px}

header{position:absolute;top:0;left:0;right:0;z-index:60;color:#fff}
header.solid{position:sticky;background:var(--stone);color:var(--char);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:92px;gap:20px}
.logo{font-family:var(--serif);font-size:26px;line-height:1}
.logo small{display:block;font:600 10.5px var(--sans);letter-spacing:.3em;text-transform:uppercase;opacity:.75;margin-top:5px}
nav.mn{display:flex;gap:30px;font-weight:500;font-size:15px}
nav.mn a{opacity:.9}
nav.mn a:hover,nav.mn a.on{opacity:1;text-decoration:underline;text-underline-offset:6px}
header:not(.solid) .btn{border-color:#fff;color:#fff}
header:not(.solid) .btn:hover{background:#fff;color:var(--char)}
.hr{display:flex;gap:10px;align-items:center}
.burger{display:none;background:none;border:0;font-size:26px;cursor:pointer;color:inherit}

/* hero */
.hero{position:relative;height:100svh;min-height:640px;display:flex;align-items:flex-end;color:#fff;overflow:hidden;padding:0}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,0) 32%,rgba(0,0,0,.6))}
.hero .wrap{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:40px;padding-bottom:70px}
.hero h1{font-size:clamp(50px,7.4vw,112px);max-width:880px}
.hero h1 i{color:#D8E7BF}
.hero .card{background:var(--stone);color:var(--char);padding:26px;max-width:340px;flex-shrink:0}
.hero .card h3{font-size:24px;margin-bottom:6px}
.hero .card p{font-size:15px;color:var(--mu);margin-bottom:16px}

/* intro */
.intro{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--char);margin-top:40px}
.stats div{padding:22px 20px 0 0}
.stats b{display:block;font:300 54px var(--serif);line-height:1;color:var(--moss)}
.stats span{font-size:14px;color:var(--mu)}

/* zigzag services */
.zz{display:grid;gap:0}
.zr{display:grid;grid-template-columns:1.2fr 1fr;align-items:stretch;min-height:480px}
.zr:nth-child(even){grid-template-columns:1fr 1.2fr}
.zr:nth-child(even) .im{order:2}
.zr .im{position:relative;overflow:hidden}
.zr .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s}
.zr:hover .im img{transform:scale(1.03)}
.zr .t{padding:60px;display:flex;flex-direction:column;justify-content:center;background:var(--stone)}
.zr:nth-child(even) .t{background:var(--stone2)}
.zr .t .n{font:300 18px var(--serif);color:var(--leaf);margin-bottom:10px}
.zr h3{font-size:clamp(30px,3vw,42px);margin-bottom:12px}
.zr p{color:var(--mu);margin-bottom:22px;max-width:440px}
.zr .from{font-size:14px;font-weight:600;letter-spacing:.06em;margin-bottom:20px}

/* projects */
.fl{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.fl button{font:600 14px var(--sans);padding:10px 18px;border:1px solid var(--line);background:#fff;border-radius:999px;cursor:pointer;color:var(--char)}
.fl button.on{background:var(--moss);color:#fff;border-color:var(--moss)}
.projs{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pj img{width:100%;aspect-ratio:4/5;object-fit:cover;margin-bottom:14px}
.pj:nth-child(3n+2) img{aspect-ratio:1}
.pj small{font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--leaf)}
.pj h3{font-size:25px;margin:4px 0}
.pj p{color:var(--mu);font-size:15px}

/* calculator */
.calc{display:grid;grid-template-columns:1.3fr 1fr;gap:0;background:#fff;border:1px solid var(--line)}
.calc .in{padding:46px}
.calc .row{padding:20px 0;border-bottom:1px solid var(--line)}
.calc .row:first-child{padding-top:0}
.calc label{display:flex;justify-content:space-between;font-weight:600;margin-bottom:10px;gap:10px}
.calc label span{color:var(--leaf);white-space:nowrap}
.calc input[type=range]{width:100%;accent-color:var(--moss)}
.seg{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.seg button{font:600 13.5px var(--sans);padding:8px 14px;border:1px solid var(--line);background:var(--stone);cursor:pointer;border-radius:999px;color:var(--char)}
.seg button.on{background:var(--char);color:#fff;border-color:var(--char)}
.feats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.feats label{display:flex;gap:10px;align-items:center;font-weight:500;padding:10px 12px;border:1px solid var(--line);margin:0;cursor:pointer;justify-content:flex-start}
.feats label small{margin-left:auto;color:var(--mu)}
.feats input{accent-color:var(--moss);width:18px;height:18px}
.calc .out{background:var(--moss);color:#EDEFE6;padding:46px;display:flex;flex-direction:column;justify-content:space-between}
.calc .big{font:300 clamp(48px,5vw,72px) var(--serif);line-height:1;color:#fff}
.calc .out dl{display:grid;grid-template-columns:1fr auto;gap:10px;margin:26px 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.2);font-size:15px}
.calc .out dd{text-align:right;font-weight:600}
.weeks{display:flex;gap:4px;margin-top:8px}
.weeks span{flex:1;height:8px;background:rgba(255,255,255,.18)}
.weeks span.f{background:#C6D9A8}

/* process */
.proc{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;counter-reset:p}
.ps{border-top:1px solid rgba(255,255,255,.3);padding-top:24px}
.ps::before{counter-increment:p;content:"0" counter(p);font:300 46px var(--serif);color:#C6D9A8;display:block;line-height:1;margin-bottom:16px}
.ps h3{font-size:25px;margin-bottom:8px}
.ps p{color:#BCC9BA;font-size:15px}
.ps small{display:block;margin-top:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:12px;color:#C6D9A8}

/* materials */
.mats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.mat{background:#fff;border:1px solid var(--line);padding:26px}
.mat .sw{height:90px;margin-bottom:18px}
.mat h3{font-size:23px}
.mat dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;font-size:14px;margin-top:12px}
.mat dt{color:var(--mu)}
.mat dd{text-align:right;font-weight:600}
.dots{letter-spacing:2px;color:var(--leaf)}

/* reviews */
.rq{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.rq img{width:100%;aspect-ratio:4/5;object-fit:cover}
.rq p.q{font:300 clamp(26px,2.8vw,38px)/1.3 var(--serif)}
.rq cite{display:block;font-style:normal;margin-top:20px;font-weight:600}
.rq .s{color:#D49E3B;letter-spacing:3px;margin-bottom:14px}
.mini{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;border-top:1px solid var(--line);padding-top:26px}
.mini p{font-size:15px;color:var(--mu)}
.mini b{display:block;font-size:14px;margin-top:6px}

.acc{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;padding:34px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:400 18px var(--serif);color:var(--mu)}

.faq details{border-bottom:1px solid var(--line);padding:22px 0}
.faq summary{font:400 22px var(--serif);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::after{content:"+";color:var(--leaf);font-family:var(--sans)}
.faq details[open] summary::after{content:"−"}
.faq p{color:var(--mu);margin-top:10px}

.cta{position:relative;overflow:hidden;color:#fff;padding:140px 0;text-align:center}
.cta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.45)}
.cta .wrap{position:relative}
.cta h2{max-width:760px;margin:0 auto 18px}
.cta h2 i{color:#D8E7BF}
.cta p{color:#E6E9DF;font-size:19px;max-width:560px;margin:0 auto 30px}

/* inner */
.ph{position:relative;height:74vh;min-height:520px;display:flex;align-items:flex-end;color:#fff;overflow:hidden;padding:0}
.ph>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.4),rgba(0,0,0,.05) 35%,rgba(0,0,0,.6))}
.ph .wrap{position:relative;z-index:2;padding-bottom:70px}
.ph .kk{color:#D8E7BF}
.ph h1{font-size:clamp(46px,6.4vw,96px);max-width:900px}
.ph h1 i{color:#D8E7BF}
.ph p{font-size:19px;max-width:560px;margin-top:16px;color:#ECEFE6}
.crumbs{font-size:14px;margin-bottom:14px;opacity:.85}
.crumbs a{text-decoration:underline}
.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.split img{width:100%;aspect-ratio:4/5;object-fit:cover}
.incl{list-style:none;display:grid;gap:0;margin:22px 0;border-top:1px solid var(--line)}
.incl li{padding:14px 0;border-bottom:1px solid var(--line);display:flex;gap:14px}
.incl li::before{content:"—";color:var(--leaf)}
.pfacts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--char);border-bottom:1px solid var(--line)}
.pfacts div{padding:22px 20px 22px 0}
.pfacts small{display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mu)}
.pfacts b{font:400 22px var(--serif)}
.pgal{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:auto auto;gap:14px}
.pgal img{width:100%;height:100%;object-fit:cover}
.pgal img:first-child{grid-row:span 2;aspect-ratio:4/5}
.pgal img:not(:first-child){aspect-ratio:4/3}
.story{max-width:760px}
.story p{font-size:18.5px;color:#43483F;margin-bottom:18px}
.form{display:grid;gap:14px}
.form .r{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form input,.form select,.form textarea{font:inherit;font-size:16px;padding:15px 0;border:0;border-bottom:1px solid var(--char);background:transparent;color:var(--char);width:100%;border-radius:0}
.form textarea{min-height:100px}

footer{background:var(--char);color:#A5A9A1;padding:90px 0 30px;font-size:15px}
footer .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}
footer .logo{color:#fff}
footer h4{color:#fff;font:400 20px var(--serif);margin-bottom:14px}
footer ul{list-style:none;display:grid;gap:8px}
footer a:hover{color:#fff}
footer .legal{border-top:1px solid #383C40;margin-top:56px;padding-top:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px}
.note{font-size:12px;margin-top:14px;color:#6E726B}

@media (max-width:1100px){
  nav.mn{display:none}.burger{display:block}
  header.open{background:var(--stone);color:var(--char)}
  header.open nav.mn{display:flex;flex-direction:column;gap:14px;position:absolute;top:92px;left:0;right:0;background:var(--stone);padding:16px 16px 24px;border-bottom:1px solid var(--line)}
  .hero .wrap{flex-direction:column;align-items:flex-start}
  .intro,.calc,.rq,.split{grid-template-columns:1fr;gap:40px}
  .zr,.zr:nth-child(even){grid-template-columns:1fr}
  .zr:nth-child(even) .im{order:0}
  .zr .im{min-height:340px}
  .projs,.mats{grid-template-columns:1fr 1fr}
  .proc{grid-template-columns:1fr 1fr}
  .pfacts{grid-template-columns:1fr 1fr}
  footer .cols{grid-template-columns:1fr 1fr}
  section{padding:84px 0}
}
@media (max-width:640px){
  .hr .btn{display:none}
  .hero .card{max-width:none;width:100%}
  .zr .t,.calc .in,.calc .out{padding:30px 22px}
  .projs,.mats,.proc,.mini,.feats{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr 1fr}.stats b{font-size:38px}
  .pgal{grid-template-columns:1fr}.pgal img:first-child{grid-row:auto}
  .form .r{grid-template-columns:1fr}
  footer .cols{grid-template-columns:1fr}
}
[hidden]{display:none!important}
.wrap > *,.hero .wrap > *{min-width:0}

.lite-q{display:grid;grid-template-columns:1fr 1.3fr;gap:36px;align-items:start;padding:40px;border:1px solid rgba(128,128,128,.28);border-radius:18px;background:rgba(255,255,255,.04)}
.lite-q h3{font-size:clamp(26px,3vw,36px);margin-bottom:10px}.lite-q p{opacity:.8}
.lite-q form{display:grid;gap:12px}.lite-q .r2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lite-q input,.lite-q textarea{font:inherit;color:inherit;width:100%;padding:14px 16px;border-radius:10px;border:1px solid rgba(128,128,128,.4);background:transparent}
.lite-q textarea{min-height:110px}.lite-q label.ck{display:flex;gap:10px;align-items:center;font-size:14px}.lite-q label.ck input{width:auto}
.lite-q button{justify-self:start}.lite-wrap{padding:60px 0}
@media (max-width:800px){.lite-q{grid-template-columns:1fr;padding:24px}.lite-q .r2{grid-template-columns:1fr}}