
:root{
  --ink:#151515;
  --muted:#69635d;
  --stone:#f4f0e8;
  --stone2:#ebe4d9;
  --paper:#fffdf9;
  --line:#d8d0c5;
  --green:#0d473a;
  --green2:#123a31;
  --cream:#faf7f1;
  --white:#fff;
  --red:#cf343b;
  --italy:#149352;
  --shadow:0 24px 64px rgba(29,24,18,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
button{cursor:pointer}
.wrap{width:min(1180px,90vw);margin:auto}
.serif{font-family:"Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:10px;font-weight:900;letter-spacing:2.7px;text-transform:uppercase;color:#625d57}
.flag{display:inline-grid;grid-template-columns:repeat(3,1fr);width:48px;height:4px;overflow:hidden}
.flag i:nth-child(1){background:var(--italy)}
.flag i:nth-child(2){background:#f5f5f3}
.flag i:nth-child(3){background:var(--red)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:15px 20px;border-radius:4px;border:1px solid transparent;font-size:13px;font-weight:800;transition:.18s ease}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--green);color:#fff;box-shadow:0 10px 22px rgba(13,71,58,.16)}
.btn-outline{background:#fff;border-color:#292929;color:#1a1a1a}
.btn-light{background:#fff;color:var(--green)}
.btn-outline-light{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}
.wa{width:18px;height:18px;border-radius:50%;background:#1ea561;color:#fff;display:inline-grid;place-items:center;font-size:10px;font-weight:900}
.desktop{display:block}

/* slim header */
header{
  position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(20,20,20,.08)
}
.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;flex-direction:column;line-height:.82}
.brand-main{font:700 31px/1 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;letter-spacing:-1.4px}
.brand-sub{font-size:8px;font-weight:900;letter-spacing:5px;margin-top:7px}
.nav-note{font-size:11px;color:#655f59;letter-spacing:.1px}
.nav-actions{display:flex;gap:9px}

/* hero */
.hero{background:var(--stone);border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.03fr .97fr;min-height:650px}
.hero-copy{padding:68px 48px 58px 0;display:flex;flex-direction:column;justify-content:center}
.hero h1{
  margin:16px 0 16px;
  font:700 clamp(56px,5.6vw,84px)/.93 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  letter-spacing:-4.2px;
  max-width:700px
}
.hero .lead{font-size:17px;line-height:1.56;color:#4f4943;max-width:620px;margin:0}
.hero .tension{margin-top:18px;padding-left:16px;border-left:3px solid var(--green);font-size:13px;line-height:1.5;color:#3f3b37;max-width:590px}
.hero-ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}
.micro{display:flex;gap:14px;flex-wrap:wrap;margin-top:13px;font-size:10px;color:#756e67}
.micro span{display:flex;align-items:center;gap:5px}
.micro b{font-weight:900;color:var(--green)}
.local{margin-top:22px;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:800;color:#4b4641}
.pin{width:27px;height:27px;border-radius:50%;border:1px solid #b7aea4;display:grid;place-items:center;font-size:10px}

/* hero tile visual */
.hero-art{position:relative;overflow:hidden;min-height:650px;background:#252423}
.ceiling{position:absolute;top:0;left:0;right:0;height:70px;background:#1f1f1e}
.track{position:absolute;top:28px;left:8%;width:58%;height:3px;background:#070707}
.track:after{content:"";position:absolute;top:-8px;left:10%;width:12px;height:19px;border-radius:3px;background:#050505;box-shadow:100px 0 #050505,200px 0 #050505,300px 0 #050505}
.slab-rack{position:absolute;left:4%;top:94px;width:62%;height:405px;display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.slab{border:7px solid #111;box-shadow:0 17px 34px rgba(0,0,0,.34)}
.sl1{background:linear-gradient(123deg,transparent 0 42%,rgba(188,158,114,.7) 43% 45%,transparent 46%),#e9dfd1}
.sl2{background:linear-gradient(124deg,transparent 0 36%,rgba(229,218,199,.8) 37% 39%,transparent 40%),#8c8377}
.sl3{background:linear-gradient(125deg,transparent 0 44%,rgba(225,211,190,.8) 45% 47%,transparent 48%),#302f2d}
.sl4{background:linear-gradient(123deg,transparent 0 51%,rgba(174,153,119,.68) 52% 54%,transparent 55%),#d2c6b6}
.sl5{background:linear-gradient(122deg,transparent 0 40%,rgba(210,193,167,.82) 41% 43%,transparent 44%),#777067}
.floor-grid{position:absolute;left:0;right:0;bottom:0;height:285px;background:
linear-gradient(90deg,transparent 0 24%,rgba(50,50,50,.14) 24.2% 24.5%,transparent 24.6% 49%,rgba(50,50,50,.14) 49.2% 49.5%,transparent 49.6% 74%,rgba(50,50,50,.14) 74.2% 74.5%,transparent 74.6%),
linear-gradient(0deg,transparent 0 32%,rgba(50,50,50,.13) 32.2% 32.6%,transparent 32.7% 65%,rgba(50,50,50,.13) 65.2% 65.6%,transparent 65.7%),
linear-gradient(135deg,#e6ded2,#bcb1a2)}
.sample-island{position:absolute;right:6%;bottom:80px;width:43%;height:145px;background:
linear-gradient(130deg,transparent 0 45%,rgba(195,163,117,.72) 46% 48%,transparent 49%),#242321;box-shadow:0 25px 44px rgba(0,0,0,.35)}
.sample-island:before{content:"";position:absolute;left:10%;right:10%;top:-27px;height:36px;background:#e8ded0;transform:skewX(-11deg);box-shadow:0 8px 14px rgba(0,0,0,.2)}
.hero-panel{position:absolute;right:0;top:70px;width:29%;height:320px;padding:40px 24px;color:#fff;background:
linear-gradient(125deg,transparent 0 42%,rgba(204,176,132,.47) 43% 45%,transparent 46%),#20201f}
.hero-panel strong{display:block;font:700 22px/1.17 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
.hero-panel p{font-size:12px;line-height:1.55;color:#ded7ce;margin-top:20px}
.hero-panel .flag{margin-top:16px}

/* thesis bar instead of generic trust */
.thesis{background:#fff;border-bottom:1px solid var(--line)}
.thesis-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.thesis-card{padding:28px 28px 30px;border-right:1px solid var(--line)}
.thesis-card:last-child{border-right:0}
.thesis-card .num{font-size:10px;font-weight:900;letter-spacing:2px;color:#8e857c}
.thesis-card h3{font:700 24px/1.05 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;margin:10px 0 8px;letter-spacing:-.8px}
.thesis-card p{font-size:12px;line-height:1.5;color:var(--muted);margin:0}

/* product value */
.value{padding:82px 0;background:#fff}
.value-grid{display:grid;grid-template-columns:.87fr 1.13fr;gap:70px;align-items:center}
.value h2,.selector h2,.proof h2,.showroom h2,.identity h2{
  margin:10px 0 16px;
  font:700 clamp(43px,4.2vw,62px)/.98 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  letter-spacing:-2.7px
}
.value p{font-size:16px;line-height:1.58;color:#5a544e;max-width:560px}
.value-quote{margin-top:22px;font:700 23px/1.18 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;color:#26342e}
.compare{height:490px;background:#d9d1c5;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.phone{position:absolute;left:7%;top:13%;width:31%;height:70%;border:10px solid #1a1a1a;border-radius:30px;background:#eee9e0;box-shadow:0 25px 45px rgba(0,0,0,.24)}
.phone:before{content:"";position:absolute;top:7px;left:34%;width:32%;height:6px;border-radius:8px;background:#111}
.phone-screen{position:absolute;left:10px;right:10px;top:27px;bottom:10px;background:linear-gradient(120deg,transparent 0 42%,rgba(162,132,91,.54) 43% 45%,transparent 46%),#d7cbbb}
.real{position:absolute;right:7%;top:7%;width:52%;height:84%;border:12px solid #171717;background:
linear-gradient(126deg,transparent 0 38%,rgba(231,217,193,.8) 39% 41%,transparent 42%),
linear-gradient(30deg,transparent 0 66%,rgba(187,154,109,.72) 67% 69%,transparent 70%),#33312f;box-shadow:0 27px 48px rgba(0,0,0,.29)}
.real:after{content:"REAL MATERIAL";position:absolute;right:14px;bottom:14px;color:#fff;background:rgba(0,0,0,.48);padding:8px 10px;font-size:9px;font-weight:900;letter-spacing:1.7px}

/* project selector */
.selector{padding:84px 0;background:var(--stone);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.selector-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:start}
.selector .intro{position:sticky;top:110px}
.selector .intro p{font-size:15px;line-height:1.58;color:#59534d}
.note-angle{margin-top:20px;background:#ece7df;padding:16px;border-left:3px solid var(--green);font-size:12px;line-height:1.5}
.form-card{background:#fff;border:1px solid var(--line);box-shadow:0 18px 48px rgba(35,28,19,.08);padding:28px}
.progress{height:4px;background:#ece8e0;margin-bottom:26px;overflow:hidden}
.progress span{display:block;height:100%;width:25%;background:var(--green);transition:.2s}
.step{display:none}
.step.active{display:block}
.step h3{font:700 29px/1.05 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;margin:0 0 7px}
.step p{font-size:12px;color:var(--muted);margin:0 0 20px}
.options{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.option{border:1px solid #ccc4b9;background:#fff;padding:16px;text-align:left;font-size:13px;font-weight:800;transition:.15s}
.option:hover,.option.selected{border-color:var(--green);background:#eef5f2;color:var(--green)}
.field{width:100%;padding:15px 14px;border:1px solid #ccc4b9;background:#fff}
.form-nav{display:flex;justify-content:space-between;gap:10px;margin-top:23px}
.back{border:0;background:none;color:#777;font-size:12px;visibility:hidden}
.back.visible{visibility:visible}
.summary{display:grid;gap:8px;margin:14px 0 20px}
.summary div{padding:10px 12px;background:#f7f4ef;border:1px solid #eee7dd;font-size:12px}
.summary b{color:var(--green)}
.prototype-note{font-size:10px;color:#817a72;line-height:1.4;margin-top:9px}

/* collections */
.collections{padding:78px 0;background:#fff}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:27px}
.section-head h2{margin:8px 0 0;font:700 clamp(39px,3.8vw,55px)/1 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;letter-spacing:-2px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{border:1px solid #e3ddd4;background:#fff;transition:.2s}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card-visual{height:240px}
.floor{background:
linear-gradient(90deg,transparent 0 33%,rgba(60,60,60,.15) 33.2% 33.5%,transparent 33.6% 66%,rgba(60,60,60,.15) 66.2% 66.5%,transparent 66.6%),
linear-gradient(0deg,transparent 0 48%,rgba(70,70,70,.12) 48.2% 48.6%,transparent 48.7%),
linear-gradient(135deg,#ded6ca,#f0e9df 48%,#c7bdaf)}
.marble{background:
linear-gradient(120deg,transparent 0 45%,rgba(238,227,210,.95) 46% 48%,transparent 49%),
linear-gradient(45deg,transparent 0 58%,rgba(198,158,108,.8) 59% 61%,transparent 62%),#262525}
.wall{background:repeating-linear-gradient(90deg,#e8e0d4 0 13px,#d1c6b7 13px 15px),linear-gradient(#eee,#ddd)}
.card-body{padding:19px}
.card h3{font:700 25px/1.05 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;margin:0 0 7px}
.card p{font-size:12px;line-height:1.5;color:var(--muted);min-height:53px}
.card a{font-size:12px;font-weight:900;color:var(--green)}

/* identity / replacement for FAQ */
.identity{padding:84px 0;background:var(--stone)}
.identity-grid{display:grid;grid-template-columns:.76fr 1.24fr;gap:60px}
.identity-intro p{font-size:15px;line-height:1.55;color:#59534d}
.identity-list{display:grid;gap:0;border-top:1px solid #cfc7bc}
.identity-item{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:24px 0;border-bottom:1px solid #cfc7bc}
.identity-item .n{font:700 18px "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;color:#8e8478}
.identity-item h3{margin:0 0 6px;font:700 23px/1.07 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
.identity-item p{margin:0;font-size:12px;line-height:1.55;color:var(--muted)}

/* marazzi proof */
.proof{padding:82px 0;background:#fff}
.proof-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:55px;align-items:center}
.proof p{font-size:15px;line-height:1.55;color:#59534d}
.marazzi-logo{font-size:58px;font-weight:900;letter-spacing:-4px;color:#153d70;margin-top:16px}
.proof-badges{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.badge{font-size:11px;font-weight:900;border:1px solid #cdc5bb;padding:10px 12px;background:#fff}
.proof-wall{height:470px;background:#252423;padding:30px;display:flex;align-items:flex-end;gap:13px;position:relative}
.proof-wall .slab{height:84%;flex:1}
.proof-cap{position:absolute;right:27px;top:25px;color:white;text-align:right;font-size:10px;letter-spacing:2px;line-height:1.6}

/* showroom */
.showroom{padding:82px 0;background:#fff}
.showroom-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:42px;align-items:center}
.showroom-art{height:485px;background:#222;position:relative;overflow:hidden}
.rack{position:absolute;top:8%;left:5%;bottom:14%;width:62%;display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.rack div{border:7px solid #111}
.rack div:nth-child(1){background:#e8dfd3}
.rack div:nth-child(2){background:linear-gradient(120deg,transparent 0 47%,#c4a97f 48% 50%,transparent 51%),#aaa092}
.rack div:nth-child(3){background:linear-gradient(120deg,transparent 0 47%,#e3d8c9 48% 50%,transparent 51%),#363432}
.rack div:nth-child(4){background:#d3c7b8}
.rack div:nth-child(5){background:linear-gradient(120deg,transparent 0 45%,#99784d 46% 48%,transparent 49%),#2a2927}
.counter{position:absolute;right:4%;bottom:8%;width:53%;height:105px;background:linear-gradient(130deg,transparent 0 45%,#c7a878 46% 48%,transparent 49%),#232220;box-shadow:0 20px 40px rgba(0,0,0,.35)}
.logo{position:absolute;right:7%;top:13%;color:white;text-align:right;font:700 23px/1.05 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
.showroom p{font-size:14px;line-height:1.58;color:#59534d}
.address{padding:18px 0 3px;display:grid;gap:6px;font-size:12px}
.address b{font-size:13px}
.showroom-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

/* final */
.final{padding:48px 0;color:white;background:
linear-gradient(120deg,transparent 0 38%,rgba(178,145,94,.2) 39% 41%,transparent 42%),
var(--green2)}
.final-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:25px;align-items:center}
.final small{font-size:10px;font-weight:900;letter-spacing:2.5px;text-transform:uppercase;color:#d8e2dd}
.final h2{margin:8px 0 0;font:700 clamp(36px,4vw,56px)/1 "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;letter-spacing:-2px}
.final-actions{display:flex;gap:9px;justify-content:flex-end;flex-wrap:wrap}

/* sticky */
.sticky{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:70;width:min(780px,92vw);background:#111;color:#fff;padding:11px 12px 11px 18px;display:flex;align-items:center;justify-content:space-between;gap:14px;box-shadow:0 18px 45px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.11);transition:.25s}
.sticky.hide{opacity:0;pointer-events:none;transform:translate(-50%,18px)}
.sticky-copy b{display:block;font:700 16px "Baskerville","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
.sticky-copy span{font-size:10px;color:#ccc5bd}
.sticky-actions{display:flex;gap:7px}
.sticky-actions .btn{padding:11px 14px;font-size:11px}

/* footer */
footer{padding:32px 0 96px;border-top:1px solid var(--line);background:#fff}
.footer{display:grid;grid-template-columns:1fr auto 1fr;gap:30px;align-items:center}
.footer-links{display:flex;gap:20px;font-size:10px;color:#514d48}
.footer-note{text-align:right;font-size:10px;color:#746e68}

@media(max-width:950px){
  .desktop,.nav-note{display:none}
  .hero-grid,.value-grid,.selector-grid,.identity-grid,.proof-grid,.showroom-grid,.final-grid{grid-template-columns:1fr}
  .hero-copy{padding:58px 0 42px}
  .hero-art{min-height:530px}
  .thesis-grid{grid-template-columns:1fr}
  .thesis-card{border-right:0;border-bottom:1px solid var(--line)}
  .selector .intro{position:static}
  .cards{grid-template-columns:1fr}
  .final-actions{justify-content:flex-start}
  .footer{grid-template-columns:1fr}
  .footer-note{text-align:left}
}
@media(max-width:620px){
  .wrap{width:92vw}
  .nav{height:66px}
  .brand-main{font-size:24px}.brand-sub{font-size:7px;letter-spacing:4px}
  .nav-actions .btn-outline{display:none}
  .hero h1{font-size:49px;letter-spacing:-3px}
  .hero-art{min-height:470px}
  .hero-panel{width:38%;padding:28px 17px}.hero-panel strong{font-size:17px}
  .slab-rack{width:66%;height:320px}
  .value,.selector,.collections,.identity,.proof,.showroom{padding:58px 0}
  .value h2,.selector h2,.proof h2,.showroom h2,.identity h2{font-size:43px}
  .options{grid-template-columns:1fr}
  .form-card{padding:20px}
  .sticky-copy{display:none}
  .sticky{justify-content:center}
  footer{padding-bottom:90px}
}

