:root{
  --paper:#F1EFEA;
  --paper-2:#E9E6DF;
  --ink:#1C1B19;
  --ink-2:#4B473F;
  --stone:#8C887E;
  --line:#D8D4CB;
  --bronze:#8A6A3B;
  --bronze-soft:#A98B5B;
  --veins-dark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='560'%3E%3Cfilter id='v'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.014 0.028' numOctaves='5' seed='9'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 2.5 -1.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23v)'/%3E%3C/svg%3E");
  --veins-light:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='560'%3E%3Cfilter id='v'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.013 0.027' numOctaves='5' seed='14'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 2.4 -1.25'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23v)'/%3E%3C/svg%3E");
  --cloud:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='760' height='760'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.006' numOctaves='3' seed='4'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 -0.12'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");
  --speckle-d:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='6'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.9 -0.42'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E");
  --speckle-l:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' seed='12'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.8 -0.46'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E");
  --sheen:linear-gradient(118deg,rgba(255,255,255,.30),rgba(255,255,255,0) 34%,rgba(255,255,255,0) 66%,rgba(255,255,255,.12));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Hanken Grotesk",system-ui,Arial,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;font-weight:500;letter-spacing:-.01em;margin:0}
h1{font-size:clamp(40px,5.6vw,72px);line-height:1.03}
h2{font-size:clamp(28px,3.6vw,42px);line-height:1.08}
.lead{font-size:clamp(17px,1.8vw,20px);color:var(--ink-2);max-width:48ch}
.eyebrow{font-size:13px;letter-spacing:.14em;color:var(--bronze);text-transform:uppercase}

header{position:sticky;top:0;z-index:40;background:rgba(241,239,234,.82);backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:28px;height:72px}
.brand{font-family:"Fraunces",serif;font-size:25px;font-weight:600;letter-spacing:.02em}
.brand span{color:var(--bronze)}
nav.main{display:flex;gap:26px;margin-left:14px}
nav.main a{font-size:15px;color:var(--ink-2);position:relative;padding:4px 0}
nav.main a::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1.5px;background:var(--bronze);transition:width .25s ease}
nav.main a:hover,nav.main a.is-active{color:var(--ink)}
nav.main a:hover::after,nav.main a.is-active::after{width:100%}
.bar .spacer{flex:1}
.phone{font-size:15px;color:var(--ink);white-space:nowrap}
.phone small{display:block;color:var(--stone);font-size:11.5px;letter-spacing:.06em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-size:15px;font-weight:500;cursor:pointer;padding:11px 20px;border-radius:2px;border:1px solid transparent;background:var(--ink);color:var(--paper);transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:#000}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--ink)}
.btn.small{padding:9px 16px;font-size:14px}
.burger{display:none;width:42px;height:42px;border:1px solid var(--line);background:transparent;border-radius:2px;cursor:pointer;align-items:center;justify-content:center}
.burger span,.burger span::before,.burger span::after{content:"";display:block;width:18px;height:1.5px;background:var(--ink);position:relative}
.burger span::before{position:absolute;top:-6px}
.burger span::after{position:absolute;top:6px}

.stone{position:relative;background-color:var(--base);background-image:var(--sheen),var(--vein,var(--veins-dark)),var(--cloud);background-size:cover,var(--vs,180%),var(--cs,150%);background-position:center,var(--vp,center),var(--cp,center);background-blend-mode:var(--b1,soft-light),var(--b2,multiply),var(--b3,multiply);isolation:isolate}
.stone::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 70px rgba(0,0,0,.08);pointer-events:none}
.m-carrara{--base:#E9E7E1;--vein:var(--veins-dark);--vs:170%;--vp:20% 30%}
.m-calacatta{--base:#F2F0E9;--vein:var(--veins-dark);--vs:220%;--vp:70% 40%;--cp:30% 60%}
.m-statuario{--base:#EAE8E2;--vein:var(--veins-dark);--vs:150%;--vp:40% 70%}
.m-crema{--base:#DEC9A6;--vein:var(--veins-dark);--b2:soft-light;--vs:200%;--vp:60% 20%}
.m-rosso{--base:#5A2A2C;--vein:var(--veins-light);--b1:overlay;--b2:screen;--b3:multiply;--vs:180%;--vp:30% 50%}
.m-nero{--base:#15140F;--vein:var(--veins-light);--b1:overlay;--b2:screen;--b3:soft-light;--vs:150%;--vp:55% 25%}
.m-emperador{--base:#5B4738;--vein:var(--veins-light);--b1:overlay;--b2:screen;--b3:multiply;--vs:160%;--vp:35% 55%}
.m-verde{--base:#2D3A32;--vein:var(--veins-light);--b1:overlay;--b2:screen;--b3:soft-light;--vs:190%;--vp:60% 65%}
.m-absblack{--base:#101011;--vein:var(--speckle-d);--cloud:var(--speckle-l);--b1:overlay;--b2:multiply;--b3:screen;--vs:180px;--cs:200px}
.m-imperial{--base:#7a3b3f;--vein:var(--speckle-d);--cloud:var(--speckle-l);--b1:overlay;--b2:multiply;--b3:screen;--vs:170px;--cs:190px}
.m-baltic{--base:#5a4636;--vein:var(--speckle-d);--cloud:var(--speckle-l);--b1:overlay;--b2:multiply;--b3:screen;--vs:160px;--cs:180px}
.m-onyx-miele{--base:#d49a47;background-image:linear-gradient(104deg,rgba(255,241,214,.55),rgba(150,92,32,.4) 38%,rgba(255,236,200,.5) 66%,rgba(120,70,22,.45)),var(--veins-light),var(--cloud);background-size:cover,210%,170%;background-blend-mode:overlay,soft-light,multiply}
.m-onyx-verde{--base:#5e7d5c;background-image:linear-gradient(104deg,rgba(226,245,220,.5),rgba(40,70,40,.45) 40%,rgba(210,240,205,.45) 70%,rgba(30,55,32,.5)),var(--veins-light),var(--cloud);background-size:cover,210%,170%;background-blend-mode:overlay,soft-light,multiply}

.reveal{opacity:0;transform:translateY(16px);animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards}
.d1{animation-delay:.05s}.d2{animation-delay:.14s}.d3{animation-delay:.23s}.d4{animation-delay:.32s}
@keyframes rise{to{opacity:1;transform:none}}

.hero{border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;min-height:min(78vh,680px)}
.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:72px 56px 72px 0}
.hero-copy h1{margin:22px 0}
.hero-copy .lead{margin-bottom:34px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:46px}
.stats{display:flex;border-top:1px solid var(--line)}
.stats div{padding:20px 26px 0 0;margin-right:26px;border-right:1px solid var(--line)}
.stats div:last-child{border-right:0}
.stats b{font-family:"Fraunces",serif;font-weight:500;font-size:30px;display:block;line-height:1}
.stats small{color:var(--stone);font-size:13.5px}
.hero-stone{position:relative}

section{padding:88px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:44px}
.sec-head p{color:var(--ink-2);max-width:42ch;margin:10px 0 0}
.link{color:var(--bronze);font-weight:500;font-size:15px;border-bottom:1px solid transparent;padding-bottom:2px;transition:border-color .2s}
.link:hover{border-color:var(--bronze)}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.card{display:flex;flex-direction:column}
.card .swatch{aspect-ratio:4/5;border:1px solid var(--line);border-radius:2px}
.card .meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:16px 2px 14px;border-bottom:1px solid var(--line);margin-bottom:12px}
.card h3{font-size:21px}
.card .origin{color:var(--stone);font-size:13.5px}
.card .price{color:var(--ink);font-size:14px}
.card .price b{font-weight:600}

.page-head{border-bottom:1px solid var(--line);padding:38px 0 46px}
.crumbs{font-size:13.5px;color:var(--stone);margin-bottom:26px}
.crumbs a:hover{color:var(--ink)}
.crumbs span{margin:0 8px;color:var(--line)}
.page-head h1{max-width:16ch;margin-bottom:18px}
.page-head .lead{margin:0}
.head-strip{height:6px;border-radius:2px;margin-top:34px}

.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:40px}
.filters button{font:inherit;font-size:14.5px;padding:9px 18px;border:1px solid var(--line);background:transparent;border-radius:2px;color:var(--ink-2);cursor:pointer;transition:all .18s}
.filters button:hover{border-color:var(--ink)}
.filters button.is-active{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.card.hide{display:none}

.band{background:var(--ink);color:#EDEAE2}
.band-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.band h2{color:#F4F1EA}
.band .lead{color:#B9B3A6}
.prods{list-style:none;margin:28px 0 0;padding:0}
.prods li{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:18px 0;border-top:1px solid rgba(255,255,255,.13)}
.prods li:last-child{border-bottom:1px solid rgba(255,255,255,.13)}
.prods .name{font-family:"Fraunces",serif;font-size:22px;color:#F4F1EA}
.prods .desc{color:#9b958a;font-size:14.5px;text-align:right;max-width:30ch}
.band-stone{aspect-ratio:1/1;border-radius:2px;box-shadow:0 30px 60px rgba(0,0,0,.35)}

.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:26px;counter-reset:st}
.step{border-top:2px solid var(--ink);padding-top:16px}
.step::before{counter-increment:st;content:counter(st,decimal-leading-zero);font-family:"Fraunces",serif;font-size:15px;color:var(--bronze);display:block;margin-bottom:12px}
.step h3{font-size:19px;margin-bottom:6px}
.step p{margin:0;color:var(--ink-2);font-size:14px}

.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.proj{border-top:2px solid var(--ink);padding-top:18px}
.proj .yr{color:var(--bronze);font-size:13px;letter-spacing:.08em}
.proj h3{font-size:22px;margin:8px 0 6px}
.proj p{margin:0;color:var(--ink-2);font-size:14.5px}
.proj .swatch{aspect-ratio:16/10;border:1px solid var(--line);border-radius:2px;margin-bottom:16px}

.contacts-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.info h3{font-size:22px;margin:0 0 4px}
.info .block{padding:22px 0;border-bottom:1px solid var(--line)}
.info .block:first-child{padding-top:0}
.info .label{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--stone);margin-bottom:6px}
.info a,.info p{margin:0;color:var(--ink);font-size:17px}
.info a:hover{color:var(--bronze)}
.map{aspect-ratio:3/2;border-radius:2px;position:relative;overflow:hidden}
.map .pin{position:absolute;left:50%;top:48%;width:16px;height:16px;border-radius:50%;background:var(--bronze);box-shadow:0 0 0 6px rgba(138,106,59,.25),0 0 0 1px #fff;transform:translate(-50%,-50%)}
.map .tag{position:absolute;left:24px;bottom:24px;background:var(--paper);padding:14px 18px;border-radius:2px;box-shadow:0 10px 30px rgba(0,0,0,.18);font-size:14px;max-width:62%}
.map .tag b{font-family:"Fraunces",serif;font-weight:500;font-size:16px;display:block}
.inline-form{margin-top:12px}
.inline-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.cta{text-align:center;background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cta h2{margin-bottom:14px}
.cta p{color:var(--ink-2);max-width:52ch;margin:0 auto 28px}

footer{padding:64px 0 40px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid var(--line)}
.foot-grid h4{font-size:13px;letter-spacing:.1em;color:var(--stone);text-transform:uppercase;margin:0 0 16px;font-weight:600}
.foot-grid a,.foot-grid p{display:block;color:var(--ink-2);font-size:14.5px;margin:0 0 9px}
.foot-grid a:hover{color:var(--ink)}
.foot-brand .brand{font-size:28px;margin-bottom:14px}
.foot-brand p{max-width:30ch}
.legal{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:24px;color:var(--stone);font-size:13px}

.overlay{position:fixed;inset:0;z-index:60;background:rgba(20,19,17,.55);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:24px}
.overlay.open{display:flex}
.modal{background:var(--paper);width:100%;max-width:420px;border-radius:3px;padding:34px 32px;box-shadow:0 30px 80px rgba(0,0,0,.3);position:relative;animation:pop .22s ease}
@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.modal h3{font-size:26px;margin-bottom:6px}
.modal .sub{color:var(--stone);font-size:14.5px;margin-bottom:22px}
.field{margin-bottom:14px}
.field label{display:block;font-size:13px;color:var(--ink-2);margin-bottom:6px}
.field input,.field textarea{width:100%;font:inherit;font-size:15px;padding:11px 13px;border:1px solid var(--line);border-radius:2px;background:#fff;color:var(--ink)}
.field textarea{min-height:92px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--bronze)}
.modal .btn,.inline-form .btn{width:100%;margin-top:8px}
.modal .row{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:13.5px;color:var(--stone)}
.modal .row a{color:var(--bronze)}
.close{position:absolute;top:14px;right:16px;border:none;background:none;font-size:24px;line-height:1;color:var(--stone);cursor:pointer}
.status{min-height:18px;font-size:13.5px;color:#9a3b2f;margin-top:10px}
.status.ok{color:#3a6b45}

:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}

.drawer{position:fixed;inset:0;z-index:55;background:var(--paper);transform:translateX(100%);transition:transform .3s ease;display:flex;flex-direction:column;padding:26px}
.drawer.open{transform:none}
.drawer .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}
.drawer nav{display:flex;flex-direction:column;gap:4px}
.drawer nav a{font-family:"Fraunces",serif;font-size:28px;padding:12px 0;border-bottom:1px solid var(--line)}
.drawer .btn{margin-top:26px}

@media(max-width:980px){
  nav.main,.phone{display:none}
  .burger{display:inline-flex}
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{padding:48px 0 54px}
  .hero-stone{min-height:46vh;order:-1}
  .band-grid,.foot-grid,.contacts-grid{grid-template-columns:1fr 1fr}
  .grid,.projects{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .band-stone{display:none}
}
@media(max-width:620px){
  .wrap{padding:0 20px}
  section{padding:60px 0}
  .grid,.projects,.foot-grid,.contacts-grid,.steps{grid-template-columns:1fr}
  .inline-form .row2{grid-template-columns:1fr}
  .stats{flex-wrap:wrap}
  .stats div{border-right:0;padding-right:0;margin-right:22px}
  .prods .desc{display:none}
  .sec-head{flex-direction:column;align-items:flex-start;gap:10px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
