/* reholiving — site styles. Palette unchanged; minimalist layout & type (uppercase tracked display, hairline rules, flat tiles). */
:root{color-scheme:light;--brand:#7a573a;--tile:transparent;--lift:drop-shadow(0 16px 16px rgba(31,27,22,.11));
  --bg:#f7f3ee;--card:#fff;--ink:#1f1b16;--ink-2:#3b342c;--muted:#6f665c;--accent:#9a6a3a;--accent-2:#d4b083;
  --green:#1f4d3a;--green-2:#173b2c;--line:#e6ddd2;--sand:#ece4d9;--bar:#efe9e1;--red:#b3261e;
  --display:Jost,"Century Gothic",Futura,sans-serif;--sans:"Nunito Sans","Segoe UI",system-ui,sans-serif;--serif:var(--display);
  --track:.16em;--r:0px
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink-2);font-family:var(--sans);line-height:1.7;font-size:15px;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
ul{list-style:none}
:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
.wrap{max-width:1280px;margin:0 auto;padding:0 32px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:400;line-height:1.2;color:var(--ink);text-wrap:balance}
h1{font-size:clamp(30px,3.6vw,46px);font-weight:300;text-transform:uppercase;letter-spacing:.14em}
h2{font-size:clamp(22px,2.4vw,30px);font-weight:300;text-transform:uppercase;letter-spacing:.14em}
h3{font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:.14em}
.eyebrow{font-family:var(--display);text-transform:uppercase;letter-spacing:.28em;font-size:11px;color:var(--muted);font-weight:500}
.lead{color:var(--muted);font-size:15px;max-width:540px}
.muted{color:var(--muted)}
.num{font-family:var(--display);font-size:12px;color:var(--accent);letter-spacing:.2em;font-weight:500}

/* ---------- buttons & links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 32px;font-family:var(--display);font-weight:500;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;transition:background .25s,color .25s,border-color .25s;border:1px solid transparent;white-space:nowrap}
.btn svg{width:15px;height:15px}
.btn-dark,.btn-cream{background:var(--ink);color:#fff}
.btn-dark:hover,.btn-cream:hover{background:var(--brand)}
.btn-line,.btn-ghost{border-color:var(--ink);color:var(--ink)}
.btn-line:hover,.btn-ghost:hover{background:var(--ink);color:#fff}
.sec-green .btn-cream{background:#efe7da;color:var(--green)}
.sec-green .btn-cream:hover{background:#fff}
.sec-green .btn-ghost,.banner .btn-ghost{border-color:rgba(239,231,218,.6);color:#efe7da}
.sec-green .btn-ghost:hover,.banner .btn-ghost:hover{background:#efe7da;color:var(--green)}
.banner .btn-cream{background:#efe7da;color:var(--green)}
.btn-sm{padding:11px 22px;font-size:10.5px}
.link{font-family:var(--display);font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid currentColor;padding-bottom:3px;transition:color .2s}
.link:hover{color:var(--accent)}

/* ---------- header ---------- */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--bg);border-bottom:1px solid var(--line)}
.hdr{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-top:16px;padding-bottom:6px}
.hdr .logo img{height:58px;width:auto}
.hdr-l,.hdr-r{display:flex;align-items:center;gap:26px}
.hdr-r{justify-content:flex-end}
.util{font-family:var(--display);font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:color .2s;display:inline-flex;align-items:center;gap:6px}
.util:hover{color:var(--ink)}
.icon-btn{display:inline-flex;align-items:center;padding:6px;position:relative}
.icon-btn svg,.util svg{width:20px;height:20px}
.ic-wrap{position:relative}
.badge{position:absolute;top:-6px;right:-9px;min-width:17px;height:17px;border-radius:9px;background:var(--brand);color:#fff;font-size:10px;font-weight:600;display:grid;place-items:center;padding:0 4px;letter-spacing:0;font-family:var(--sans)}
.badge[data-n="0"]{display:none}
.burger,.show-m{display:none}
.navbar .menu{display:flex;justify-content:center;gap:44px}
.menu>li{position:relative}
.menu>li>a{display:block;padding:12px 0 16px;font-family:var(--display);font-size:11.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);position:relative}
.menu>li>a:after{content:"";position:absolute;left:0;right:0;bottom:11px;height:1px;background:currentColor;transform:scaleX(0);transition:transform .3s;transform-origin:left}
.menu>li:hover>a:after,.menu>li.active>a:after,.menu>li:focus-within>a:after{transform:scaleX(1)}
.menu>li.active>a{color:var(--ink)}
.menu .bespoke{color:var(--brand)}
.dd{position:absolute;left:50%;top:100%;transform:translate(-50%,6px);min-width:420px;background:var(--bg);border:1px solid var(--line);padding:26px 30px 24px;opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;z-index:60}
.menu>li:hover .dd,.menu>li:focus-within .dd{opacity:1;visibility:visible;transform:translate(-50%,0)}
.dd-h{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding-bottom:14px;margin-bottom:10px;border-bottom:1px solid var(--line)}
.dd-h span{font-family:var(--display);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink)}
.dd-h a{font-family:var(--display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.dd-h a:hover{color:var(--ink)}
.dd ul{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.dd ul.one{grid-template-columns:1fr}
.dd ul a{display:block;padding:7px 0;font-size:14px;color:var(--muted);transition:color .2s}
.dd ul a:hover{color:var(--ink)}

/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:100;visibility:hidden}
.drawer.open{visibility:visible}
.drawer .scrim{position:absolute;inset:0;background:rgba(31,27,22,.4);opacity:0;transition:.25s}
.drawer.open .scrim{opacity:1}
.drawer .panel{position:absolute;left:0;top:0;bottom:0;width:min(360px,88vw);background:var(--bg);transform:translateX(-100%);transition:.3s;overflow:auto;padding:20px max(24px,env(safe-area-inset-left,0px)) 24px}
.drawer.open .panel{transform:none}
.drawer .panel-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.drawer .panel-h img{height:46px;width:auto}
.m-nav details{border-bottom:1px solid var(--line)}
.m-nav summary,.m-nav>a{display:flex;justify-content:space-between;padding:15px 0;font-family:var(--display);font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;list-style:none;cursor:pointer;border-bottom:1px solid var(--line)}
.m-nav details summary{border:0}
.m-nav summary::-webkit-details-marker{display:none}
.m-nav details[open] summary span{transform:rotate(45deg)}
.m-nav summary span{transition:.2s;font-size:18px;line-height:1}
.m-nav details a{display:block;padding:7px 0 7px 12px;font-size:14px;color:var(--muted)}
.m-nav .bespoke{color:var(--brand)}

/* search overlay */
.search-ov{position:fixed;inset:0;z-index:110;background:rgba(247,243,238,.98);display:none;align-items:flex-start;justify-content:center;padding:14vh 24px 24px}
.search-ov.open{display:flex}
.search-ov form{width:min(760px,100%)}
.search-ov input{width:100%;font-family:var(--display);font-weight:300;font-size:clamp(24px,4vw,38px);letter-spacing:.08em;background:none;border:0;border-bottom:1px solid var(--ink);padding:10px 0;outline:none}
.search-ov .close{position:absolute;top:24px;right:24px;font-size:30px;font-weight:300}
.search-ov .hint{margin-top:14px;color:var(--muted);font-size:13px}
.search-ov .sugg{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.search-ov .results{margin-top:22px;display:grid;gap:2px}
.search-ov .results a{display:flex;gap:14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.search-ov .results img,.search-ov .results .ill{width:52px;height:52px;object-fit:cover;flex:none;background:var(--tile)}

/* ---------- inner page banner ---------- */
.page-hero{background:var(--bar);position:relative;overflow:hidden;border-bottom:1px solid var(--line);padding:0}
.ph-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding-top:44px;padding-bottom:56px;position:relative}
.ph-copy{min-width:0}
/* compact (default): title left, intro right, one line of breadcrumb above */
.page-hero.compact{background:var(--bg)}
.page-hero.compact .ph-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:20px 64px;padding-top:36px;padding-bottom:44px}
.page-hero.compact .crumbs{grid-column:1/-1;margin-bottom:6px}
.page-hero.compact h1{margin:12px 0 0}
.page-hero.compact .ph-side{min-width:0;padding-bottom:6px}
.page-hero.compact .ph-meta{margin-top:16px}
/* drawing (Bespoke): one dimensioned piece on a drafting grid */
.page-hero.art-drawing{background-color:var(--bar);background-image:linear-gradient(rgba(122,87,58,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(122,87,58,.08) 1px,transparent 1px);background-size:32px 32px;background-position:-1px -1px}
/* single piece (blog posts) */
.art-drawing .ph-media,.art-single .ph-media{display:flex;justify-content:center;align-items:flex-end}
.art-drawing .ph-media>img,.art-single .ph-media>img{height:118%;width:auto;max-width:none;aspect-ratio:1;object-fit:contain;filter:var(--lift);margin-bottom:-6%}
.crumbs{display:flex;gap:10px;flex-wrap:wrap;font-family:var(--display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:34px}
.crumbs a:hover{color:var(--ink)}
.crumbs b{color:var(--ink);font-weight:500}
.page-hero h1{margin:14px 0 18px}
.page-hero .sub{color:var(--muted);font-size:15px;max-width:500px}
.ph-meta{display:flex;flex-wrap:wrap;margin-top:26px;font-family:var(--display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.ph-meta span+span:before{content:"·";margin:0 14px;color:var(--accent)}
.ph-media{position:relative;z-index:0;height:350px}
.arch{position:absolute;margin:0;background:var(--tile)}
.arch .ill{width:100%;height:100%}
.arch img{position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:100%;width:auto;max-width:none;aspect-ratio:1;object-fit:contain}
.arch .ill em{display:none}
.arch.a1{right:4%;top:40px;width:46%;height:310px}
.arch.a2{right:46%;bottom:0;width:31%;height:205px}
.ph-lamp{position:absolute;right:calc(4% + 23% - 14px);top:-80px;width:28px;height:116px;color:var(--brand)}
.ph-lamp svg{width:100%;height:100%;overflow:visible}
.ph-lamp:after{content:"";position:absolute;left:50%;top:80px;width:200px;height:150px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(244,206,140,.5),rgba(244,206,140,0));pointer-events:none;z-index:-1}

/* ---------- sections ---------- */
section{padding:96px 0}
.sec-sand{background:var(--sand)}
.sec-white{background:var(--card)}
.sec-green{background:var(--green);color:#d9e2dc}
.sec-green h1,.sec-green h2,.sec-green h3{color:#fff}
.sec-green .eyebrow{color:var(--accent-2)}
.sec-green .lead,.sec-green .muted{color:#cfd9d2}
.rule{border-top:1px solid var(--line)}
.head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px;flex-wrap:wrap}
.head h2{margin-top:12px}
.head.center{justify-content:center;text-align:center;flex-direction:column;align-items:center}
.head .lead{margin-top:14px}
.more{text-align:center;margin-top:52px}

/* ---------- home ---------- */
/* hero: full-bleed swipeable banner carousel. Product cutouts are white-backed, so multiply blends them into each band. */
.hs{position:relative;border-bottom:1px solid var(--line)}
.hs-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab}
.hs-track::-webkit-scrollbar{display:none}
.hs-track.drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
.hs-slide{flex:0 0 100%;scroll-snap-align:start;position:relative;overflow:hidden;height:clamp(520px,74vh,700px);background:var(--sand);
  --wl:max(32px,calc((100vw - 1280px) / 2 + 32px));--cw:min(430px,34vw)}
.hs-slide.t-bar{background:var(--bar)}
.hs-slide.t-line{background:var(--line)}
/* the stage starts where the copy column ends, so furniture can never run under the headline */
.hs-stage{position:absolute;top:0;bottom:0;right:0;left:calc(var(--wl) + var(--cw) + 24px);pointer-events:none;container-type:size;display:flex;align-items:flex-end;justify-content:center}
.hs-stage img{position:absolute;bottom:0;aspect-ratio:1;width:auto;object-fit:contain;filter:drop-shadow(0 22px 20px rgba(31,27,22,.13));-webkit-user-drag:none;user-select:none}
.hs-copy{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:center}
.hs-copy>div{max-width:var(--cw)}
.hs-copy h1,.hs-copy h2{font-size:clamp(26px,2.9vw,46px);font-weight:300;letter-spacing:.14em;line-height:1.14;margin:18px 0 20px}
.hs-copy p{color:var(--ink-2);max-width:360px;margin-bottom:32px}
.hs-copy .actions{display:flex;gap:12px;flex-wrap:wrap}
/* slide compositions: positions are % of the stage */
/* two-piece slides: the pair stays together and is centred in the stage; one unit = 1% of stage height, shrunk if the stage is narrow */
.s1>.hs-stage>img,.s3>.hs-stage>img{position:static;flex:none;--u:min(1cqh,.78cqw)}
.s1 .i1{height:calc(92*var(--u))}
.s1 .i2{height:calc(62*var(--u));margin:0 0 calc(7.6*var(--u)) calc(-20*var(--u))}
.s2 .row{position:absolute;left:-2%;right:3%;bottom:3%;height:70%;display:flex;align-items:flex-end}
.s2 .row img{position:static;flex:0 0 40%;width:40%;min-width:0;height:100%;aspect-ratio:auto;object-position:bottom;margin-left:-10%}
.s2 .row img:first-child{margin-left:0}
.s3 .i1{height:calc(94*var(--u))}
.s3 .i2{height:calc(58*var(--u));margin:0 0 calc(7*var(--u)) calc(-16*var(--u))}
.hs-ui{position:absolute;left:0;right:0;bottom:26px;z-index:2;display:flex;align-items:center;gap:22px;pointer-events:none}
.hs-ui>*{pointer-events:auto}
.hs-count{font-family:var(--display);font-size:10.5px;letter-spacing:.22em;color:var(--ink);font-variant-numeric:tabular-nums}
.hs-dots{display:flex;gap:6px}
.hs-dots button{width:26px;height:2px;background:var(--ink);opacity:.22;transition:opacity .3s,width .3s}
.hs-dots button.on{opacity:1;width:44px}
.hs-arrows{margin-left:auto;display:flex;gap:8px}
.hs-arrows button{width:42px;height:42px;border:1px solid rgba(31,27,22,.35);display:grid;place-items:center;color:var(--ink);transition:background .2s,color .2s}
.hs-arrows button:hover{background:var(--ink);color:#fff}
.hs-arrows svg{width:16px;height:16px}

.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:44px 22px}
.cat{display:block}
.cat .ph{aspect-ratio:6/5;overflow:hidden;background:var(--tile);border-radius:14px}
.cat .ph img,.cat .ph .ill{width:100%;height:100%;object-fit:cover;object-position:50% 60%;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.cat:hover .ph img{transform:scale(1.04)}
.cat .meta{padding-top:18px;text-align:center}
.cat .meta span{display:block;font-family:var(--display);font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--ink)}
.cat .meta small{display:block;margin-top:4px;font-size:12.5px;color:var(--muted)}

.statement{text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:84px 0}
.statement h2{max-width:900px;margin:14px auto 0;line-height:1.5;font-size:clamp(18px,2vw,24px)}

.imgtext{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.imgtext .pic{aspect-ratio:1}
.imgtext .pic img{width:100%;height:100%;object-fit:cover}
.imgtext .txt h2{margin:14px 0 20px}
.imgtext .txt p{color:var(--muted);max-width:440px;margin-bottom:32px}
.imgtext .txt .actions{display:flex;gap:26px;align-items:center;flex-wrap:wrap}

.overlap{position:relative;height:520px}
.overlap figure{position:absolute;margin:0}
.overlap figure img{width:100%;height:100%;object-fit:contain;object-position:bottom}
.overlap .o1{right:0;top:0;width:62%;height:76%}
.overlap .o2{left:0;bottom:0;width:48%;height:58%}
.mini-stats{display:flex;gap:40px;margin:8px 0 36px;flex-wrap:wrap}
.mini-stats b{display:block;font-family:var(--display);font-weight:300;font-size:34px;color:#fff;line-height:1.1;letter-spacing:.04em}
.mini-stats span{font-family:var(--display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:#cfd9d2}

.pick{display:grid;grid-template-columns:1.1fr 1fr;gap:72px;align-items:start}
.pick .gal-main{aspect-ratio:1}
.pick .gal-main img{width:100%;height:100%;object-fit:cover}
.pick .dots{display:flex;gap:10px;justify-content:center;margin-top:18px}
.pick .dots button{width:7px;height:7px;border-radius:50%;border:1px solid var(--ink);opacity:.45}
.pick .dots button.on{background:var(--ink);opacity:1}
.pick h3{font-size:clamp(18px,1.8vw,22px);font-weight:400;letter-spacing:.14em;margin:14px 0 10px}
.pick .spec{font-family:var(--display);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:22px}
.pick p{color:var(--muted);margin-bottom:24px}
.pick .opt{font-size:13px;margin-bottom:10px}
.pick .opt b{font-weight:600;color:var(--ink)}

.values{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;text-align:center}
.values svg{width:26px;height:26px;margin:0 auto 16px;color:var(--ink)}
.values h3{font-size:12px;letter-spacing:.24em;margin-bottom:8px}
.values p{color:var(--muted);font-size:13.5px;max-width:240px;margin:0 auto}

/* cut-out furniture gets a soft grounding shadow wherever it sits */
.prod .ph>img,.cat .ph img,.gal .main img,.imgtext .pic img,.pick .gal-main img,.overlap img,.collage img,.arch img,.proj img,.post .ph img,.banner .media img{filter:var(--lift)}

/* rails (related products) */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3*22px)/4);gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start}
.rail.cols-5{grid-auto-columns:calc((100% - 4*22px)/5)}
.rail-nav{display:flex;gap:8px}
.rail-nav button{width:40px;height:40px;border:1px solid var(--line);display:grid;place-items:center;transition:.2s;color:var(--ink)}
.rail-nav button:hover{border-color:var(--ink)}
.rail-nav svg{width:16px;height:16px}

/* illustration placeholder (no photo for this product type) */
.ill{background:var(--tile);color:#8a7f72;display:grid;place-items:center;position:relative;width:100%;height:100%}
.ill svg{width:56%;height:56%}
.ill em{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-style:normal;font-family:var(--display);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:#a39684}

/* product card */
.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:44px 22px}
.prod{display:flex;flex-direction:column}
.prod .ph{position:relative;aspect-ratio:1;overflow:hidden;display:block;background:var(--tile)}
.prod .ph>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s,transform 1s cubic-bezier(.2,.7,.2,1)}
.prod .ph>img+img{opacity:0}
.prod:hover .ph>img+img{opacity:1}
.prod:hover .ph>img:first-child:not(:last-child){opacity:0} /* transparent cutouts: swap, never stack */
.prod .ph .ill{position:absolute;inset:0}
.prod .info{padding-top:18px;text-align:center;display:flex;flex-direction:column;align-items:center;flex:1}
.prod .pc{font-family:var(--display);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.prod h3{font-family:var(--display);font-size:14.5px;font-weight:400;letter-spacing:.03em;text-transform:none;line-height:1.4;margin:6px 0 14px;max-width:30ch}
.prod h3 a:hover{color:var(--accent)}
.prod small{color:var(--muted);font-size:12.5px;display:block;margin:-10px 0 14px}
.prod .qlink{margin-top:auto;font-family:var(--display);font-size:10.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:3px;transition:border-color .2s,color .2s}
.prod .qlink:hover{border-color:var(--ink)}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:30px;flex-wrap:wrap}
.tabs button{font-family:var(--display);font-size:11.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);padding:4px 0 7px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.tabs button:hover{color:var(--ink)}
.tabs button.on{color:var(--ink);border-color:var(--ink)}
.tabs.lg{justify-content:center;gap:44px;margin-bottom:48px}
.tabs.lg button{font-size:clamp(15px,1.7vw,21px);font-weight:300;letter-spacing:.16em;padding-bottom:8px}

/* ---------- shared inner components ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.split.rev>:first-child{order:2}
.collage{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.collage img{background:var(--tile);width:100%;aspect-ratio:1;object-fit:contain}
.collage img:first-child{grid-row:span 2;height:100%;aspect-ratio:auto}
.feats{display:grid;grid-template-columns:1fr 1fr;gap:30px 36px;margin:36px 0}
.feat{border-top:1px solid var(--line);padding-top:18px}
.feat h3{margin-bottom:8px}
.feat p{color:var(--muted);font-size:14px}
.sec-green .feat{border-color:rgba(239,231,218,.25)}
.sec-green .feat p{color:#cfd9d2}

.stats{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(239,231,218,.2);border-bottom:1px solid rgba(239,231,218,.2)}
.stats>div{padding:36px 12px;text-align:center;border-right:1px solid rgba(239,231,218,.2)}
.stats>div:last-child{border:0}
.stats b{display:block;font-family:var(--display);font-size:clamp(32px,3.4vw,44px);font-weight:300;line-height:1;color:#fff;letter-spacing:.04em}
.stats span{font-family:var(--display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:#cfd9d2;display:block;margin-top:12px}

.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;counter-reset:s}
.step{position:relative;padding-top:52px}
.step:before{counter-increment:s;content:"0" counter(s);position:absolute;top:0;left:0;font-family:var(--display);font-size:28px;font-weight:300;color:var(--accent);line-height:1;letter-spacing:.06em}
.step:after{content:"";position:absolute;top:15px;left:52px;right:-12px;height:1px;background:var(--line)}
.step:last-child:after{display:none}
.step h3{margin-bottom:8px}
.step p{color:var(--muted);font-size:14px}
.sec-green .step:before{color:var(--accent-2)}
.sec-green .step p{color:#cfd9d2}
.sec-green .step:after{background:rgba(239,231,218,.22)}

.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px}
.timeline div{border-top:1px solid var(--line);padding-top:18px}
.timeline b{font-family:var(--display);font-weight:300;font-size:34px;line-height:1;display:block;margin-bottom:10px;color:var(--accent);letter-spacing:.06em}
.timeline p{color:var(--muted);font-size:14px}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.cards.c4{grid-template-columns:repeat(4,1fr)}
.cards.c5{grid-template-columns:repeat(5,1fr)}
.card{border-top:1px solid var(--line);padding-top:22px}
.card .ic{margin-bottom:16px;color:var(--brand)}
.card .ic svg{width:24px;height:24px}
.card h3{margin-bottom:8px}
.card p{color:var(--muted);font-size:14px}
.sec-green .card{border-color:rgba(239,231,218,.25)}
.sec-green .card p{color:#cfd9d2}
.sec-green .card .ic{color:var(--accent-2)}

.banner{display:grid;grid-template-columns:1fr 1fr;background:var(--green);color:#d9e2dc}
.banner h2,.banner h3{color:#fff}
.banner .txt{padding:64px 56px;align-self:center}
.banner .txt p{color:#cfd9d2;margin:18px 0 30px;max-width:440px}
.banner .media{display:grid;grid-template-columns:1fr 1fr;gap:0}
.banner .media img{width:100%;height:100%;object-fit:contain;padding:8%}
.banner.ink{background:var(--ink)}

.projects{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.proj{position:relative;overflow:hidden;background:var(--tile);cursor:zoom-in;aspect-ratio:1;margin:0}
.proj.tall{grid-row:span 2;aspect-ratio:auto}
.proj img{width:100%;height:100%;object-fit:contain;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.proj:hover img{transform:scale(1.04)}
.proj .cap{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;background:rgba(247,243,238,.94);font-family:var(--display);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);transform:translateY(100%);transition:transform .35s}
.proj:hover .cap{transform:none}
.proj .cap small{display:block;font-size:9.5px;letter-spacing:.24em;color:var(--accent);margin-bottom:2px}
.proj[hidden]{display:none}

.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
.post{display:flex;flex-direction:column}
.post .ph{aspect-ratio:4/3;overflow:hidden;background:var(--tile);position:relative}
.post .ph img{width:100%;height:100%;object-fit:contain;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.post:hover .ph img{transform:scale(1.04)}
.post .date{position:absolute;left:0;top:0;background:var(--bg);text-align:center;padding:8px 12px;line-height:1.1;font-family:var(--display);font-weight:300;font-size:20px;color:var(--ink)}
.post .date small{display:block;font-size:9.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.post .meta{font-family:var(--display);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:18px 0 10px;display:flex;gap:14px}
.post .meta .cat-l{color:var(--accent)}
.post h3{font-size:16px;letter-spacing:.08em;line-height:1.45;margin-bottom:10px}
.post h3 a:hover{color:var(--accent)}
.post p{color:var(--muted);font-size:14px;margin-bottom:16px}
.post .link{align-self:flex-start}

/* forms */
.form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form .full{grid-column:1/-1}
.field label{display:block;font-family:var(--display);font-size:10.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;margin-bottom:8px;color:var(--ink-2)}
.field label i{color:var(--red);font-style:normal}
.field input,.field select,.field textarea{width:100%;background:var(--card);border:1px solid var(--line);padding:13px 14px;font-size:14px;outline:none;transition:border .2s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--ink)}
.field textarea{min-height:130px;resize:vertical}
.form .note{font-size:12.5px;color:var(--muted)}
.form .check{display:flex;gap:10px;align-items:center;font-size:14px;color:var(--ink-2);cursor:pointer}
.form .check input{width:16px;height:16px;accent-color:var(--ink);flex:none;cursor:pointer}
.form-ok{display:none;border:1px solid #bcd3c4;background:#eef3ef;color:var(--green);padding:16px 18px;font-size:14px}
.form-ok.show{display:block}
.contact-card{border:1px solid var(--line);padding:44px;background:var(--bg)}
.sec-sand .contact-card,.sec-white .contact-card{background:var(--card)}
.contact-card h2{font-size:clamp(20px,2vw,26px)}
.get-in-touch{display:grid;grid-template-columns:1fr 1.2fr;gap:72px;align-items:start}
.info-list{display:grid;gap:22px;margin-top:32px}
.info-list div{display:flex;gap:16px}
.info-list .ic{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;color:var(--brand);display:grid;place-items:center;flex:none}
.info-list .ic svg{width:18px;height:18px}
.info-list b{display:block;font-family:var(--display);font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);margin-bottom:2px}
.info-list span,.info-list a{color:var(--muted);font-size:14px}
.socials{display:flex;gap:18px;margin-top:22px}
.socials a{opacity:.75;transition:opacity .2s;display:inline-flex}
.socials a:hover{opacity:1}
.socials svg{width:17px;height:17px}

.cta{text-align:center;border-top:1px solid var(--line)}
.cta h2{margin-top:12px}
.cta p{color:var(--muted);margin:16px auto 32px;max-width:520px}
.cta .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---------- shop ---------- */
.shop{display:grid;grid-template-columns:240px 1fr;gap:56px;padding:56px 0 96px}
.shop>div{min-width:0}
.side h4{font-family:var(--display);font-size:10.5px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;margin:0 0 14px;color:var(--ink)}
.side .blk{padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.side .s-search{display:flex;border-bottom:1px solid var(--ink)}
.side .s-search input{flex:1;border:0;padding:8px 0;outline:none;min-width:0;background:none;font-size:14px}
.side .s-search button{padding:0 4px}
.side .s-search svg{width:17px;height:17px}
.side .clist a{display:flex;justify-content:space-between;padding:5px 0;font-size:14px;color:var(--muted)}
.side .clist a:hover,.side .clist a.on{color:var(--ink)}
.side .clist a.on{font-weight:600}
.side .clist a span{font-size:12px;opacity:.8}
.side .promo{border:1px solid var(--line);padding:24px}
.side .promo .eyebrow{color:var(--brand)!important}
.side .promo h3{margin:10px 0 10px}
.side .promo p{font-size:13.5px;color:var(--muted);margin-bottom:18px}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:32px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--line)}
.toolbar .count{color:var(--muted);font-size:13px}
.toolbar select{padding:9px 38px 9px 12px;border:1px solid var(--line);background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%231f1b16' stroke-width='1.5'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center;-webkit-appearance:none;appearance:none;font-size:13px;cursor:pointer}
main.is-loading .shop>div:last-child{opacity:.45;transition:opacity .15s;pointer-events:none}
.toolbar .filt-btn{display:none}
.subchips{display:flex;gap:10px 26px;flex-wrap:wrap;margin-bottom:28px}
.subchips a{font-family:var(--display);font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);padding-bottom:5px;border-bottom:1px solid transparent}
.subchips a:hover{color:var(--ink)}
.subchips a.on{color:var(--ink);border-color:var(--ink)}
.subchips a .muted{font-size:10px}
.cat-intro{display:none}
.shop .products{grid-template-columns:repeat(4,1fr)}
@media(max-width:1180px){.shop .products{grid-template-columns:repeat(3,1fr)}}
@media(max-width:960px){.shop .products{grid-template-columns:repeat(2,1fr)}}
.load-more{text-align:center;margin-top:56px}
.empty{border:1px dashed #c9bfb2;padding:72px 24px;text-align:center}
.empty svg{width:90px;height:90px;margin:0 auto 18px;color:var(--ink)}
.empty h3{margin-bottom:10px}
.empty p{color:var(--muted);margin-bottom:26px}
.empty .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---------- product ---------- */
.pd-top{display:flex;justify-content:space-between;align-items:center;padding:26px 0;font-family:var(--display);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);gap:12px;flex-wrap:wrap}
.pd-top a:hover{color:var(--ink)}
.pd-top .pn{display:flex;gap:22px}
.pd{display:grid;grid-template-columns:1.1fr 1fr;gap:72px;padding-bottom:80px}
.pd>div{min-width:0}
.gal{display:grid;grid-template-columns:76px 1fr;gap:14px;align-self:start;position:sticky;top:150px}
.gal .thumbs{display:grid;gap:10px;align-content:start}
.gal .thumbs button{border:1px solid transparent;overflow:hidden;background:var(--tile);aspect-ratio:1}
.gal .thumbs button.on{border-color:var(--ink)}
.gal .thumbs img,.gal .thumbs .ill{width:100%;height:100%;object-fit:cover}
.gal .main{background:var(--tile);overflow:hidden;aspect-ratio:1;position:relative;cursor:zoom-in}
.gal .main img,.gal .main .ill{width:100%;height:100%;object-fit:cover}
.gal .main .zoom{position:absolute;right:16px;top:14px;font-family:var(--display);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.pd h1{font-size:clamp(22px,2.4vw,30px);font-weight:400;letter-spacing:.12em;margin:14px 0 16px;line-height:1.35}
.pd .tags{display:flex;gap:6px 16px;flex-wrap:wrap}
.pd .tags a{font-family:var(--display);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
.pd .tags a:hover{color:var(--ink)}
.pd .short{color:var(--muted);margin-bottom:8px}
.dims{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;margin:24px 0 28px}
.dims h4{font-family:var(--display);font-size:10.5px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--ink);margin-bottom:14px}
.dims dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:14px}
.dims dt{font-size:12px;color:var(--muted)}
.dims dd{font-family:var(--display);font-size:20px;font-weight:300;letter-spacing:.04em;color:var(--ink)}
.buy{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
.qty{display:flex;border:1px solid var(--line);background:var(--card)}
.qty button{width:40px;font-size:16px}
.qty input{width:44px;text-align:center;border:0;outline:none;background:none;font-size:14px}
.buy .btn{flex:1}
.pd .ok{font-size:13px;color:var(--green);margin-top:12px;display:none}
.pd .ok.show{display:block}
.pd .ok a{text-decoration:underline}
.assure{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;margin-top:28px;font-size:13px;color:var(--muted)}
.assure div{display:flex;gap:10px;align-items:center}
.assure div:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);flex:none}
.share{display:flex;gap:16px;align-items:center;font-family:var(--display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.share a{display:inline-flex;opacity:.75}
.share a:hover{opacity:1;color:var(--ink)}
.share svg{width:15px;height:15px}
.ptabs{border-top:1px solid var(--line);padding-top:14px}
.ptabs .tabs{margin:24px 0 28px}
.ptabs .pane{display:none;max-width:820px;color:var(--ink-2)}
.ptabs .pane.on{display:block}
.ptabs .pane p{margin-bottom:14px}
.ptabs .pane ul{display:grid;gap:8px}
.ptabs .pane li{padding-left:18px;position:relative}
.ptabs .pane li:before{content:"";position:absolute;left:0;top:12px;width:8px;height:1px;background:var(--accent)}
.swatches{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 20px}
.swatch{width:30px;height:30px;border-radius:50%;border:2px solid var(--bg);box-shadow:0 0 0 1px var(--line)}

/* ---------- quote cart ---------- */
.qlist{border-top:1px solid var(--line)}
.qrow{display:grid;grid-template-columns:84px 1fr auto auto;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.qrow .th{width:84px;height:84px;overflow:hidden;background:var(--tile)}
.qrow .th img,.qrow .th .ill{width:100%;height:100%;object-fit:cover}
.qrow h3{font-size:14.5px;letter-spacing:.04em;text-transform:none;font-weight:400}
.qrow small{font-family:var(--display);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.qrow .rm{color:var(--muted);font-size:20px;padding:6px 10px}
.qrow .rm:hover{color:var(--red)}
.quote-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start}
.quote-grid>div{min-width:0}

/* ---------- materials ---------- */
.mat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:28px 20px}
.mat .sw{aspect-ratio:1;position:relative}
.mat .sw:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(100deg,rgba(255,255,255,.06) 0 2px,transparent 2px 9px);mix-blend-mode:overlay}
.mat .sw.cane-p:after{background:radial-gradient(circle,transparent 3px,rgba(0,0,0,.25) 3.5px,transparent 4.5px) 0 0/14px 14px,linear-gradient(45deg,transparent 46%,rgba(90,60,20,.35) 47% 53%,transparent 54%) 0 0/14px 14px,linear-gradient(-45deg,transparent 46%,rgba(90,60,20,.35) 47% 53%,transparent 54%) 0 0/14px 14px;mix-blend-mode:normal}
.mat .sw.marble:after{background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.45) 32%,transparent 36%),linear-gradient(35deg,transparent 60%,rgba(255,255,255,.3) 61%,transparent 64%),linear-gradient(160deg,transparent 45%,rgba(0,0,0,.15) 46%,transparent 48%);mix-blend-mode:normal}
.mat .sw.rope:after{background:repeating-linear-gradient(60deg,rgba(0,0,0,.18) 0 3px,transparent 3px 8px),repeating-linear-gradient(-60deg,rgba(255,255,255,.15) 0 3px,transparent 3px 8px);mix-blend-mode:normal}
.mat .sw.fab:after{background:repeating-linear-gradient(0deg,rgba(0,0,0,.06) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(0,0,0,.06) 0 1px,transparent 1px 3px);mix-blend-mode:normal}
.mat .sw.met:after{background:linear-gradient(135deg,rgba(255,255,255,.35),transparent 40%,rgba(255,255,255,.2) 60%,transparent);mix-blend-mode:normal}
.mat b{display:block;padding-top:12px;font-family:var(--display);font-size:11.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink)}
.mat small{display:block;color:var(--muted);font-size:12.5px}

/* ---------- article ---------- */
.article{max-width:740px;margin:0 auto;padding:72px 24px 96px}
.article h2{font-size:18px;letter-spacing:.16em;margin:40px 0 14px}
.article p{margin-bottom:18px;color:var(--ink-2);font-size:16px;line-height:1.85}
.article ul{margin:0 0 20px;display:grid;gap:8px}
.article li{padding-left:20px;position:relative;color:var(--ink-2)}
.article li:before{content:"";position:absolute;left:0;top:13px;width:9px;height:1px;background:var(--accent)}
.article blockquote{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;margin:34px 0;font-family:var(--display);font-weight:300;font-size:21px;letter-spacing:.06em;line-height:1.5;text-align:center;color:var(--ink)}
.prose{max-width:780px;margin:0 auto;padding:64px 24px 96px}
.prose h2{font-size:17px;letter-spacing:.16em;margin:36px 0 12px}
.prose p,.prose li{color:var(--ink-2);margin-bottom:12px}
.prose ul{padding-left:18px;list-style:disc;margin-bottom:12px}
.prose .updated{color:var(--muted);font-size:13px;margin-bottom:24px}

/* lightbox */
.lb{position:fixed;inset:0;z-index:120;background:rgba(20,18,15,.92);display:none;align-items:center;justify-content:center;padding:40px}
.lb.open{display:flex}
.lb img{max-height:84vh;max-width:min(900px,100%);background:var(--bg)}
.lb .cap{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#efe7da;font-family:var(--display);font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.lb button{position:absolute;color:#fff;font-size:32px;font-weight:300;width:56px;height:56px}
.lb .x{top:16px;right:16px}.lb .pv{left:12px;top:50%;transform:translateY(-50%)}.lb .nx{right:12px;top:50%;transform:translateY(-50%)}

/* ---------- footer ---------- */
footer.site{background:var(--ink);color:#a99f92;padding:80px 0 30px;font-size:13.5px;line-height:1.8}
.f-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr 1.4fr;gap:40px;margin-bottom:56px}
.f-top h4{color:#fff;margin-bottom:18px;font-family:var(--display);font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;font-weight:500}
.f-top li{margin-bottom:6px}
.f-top a:hover{color:#fff}
.f-top p{max-width:300px}
.f-top>div{min-width:0}
.f-contact{display:grid;gap:12px}
.f-contact b{display:block;color:#d8cfc3;font-weight:600;font-size:12.5px}
.f-news{display:flex;margin-top:16px;border-bottom:1px solid #4a4239}
.f-news input{flex:1;background:none;border:0;padding:10px 0;color:#fff;outline:none;min-width:0}
.f-news input::placeholder{color:#857b6f}
.f-news button{font-family:var(--display);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:#fff;font-weight:500}
footer .socials{margin-top:26px}
.f-bot{border-top:1px solid #3a342d;padding-top:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--display);font-size:10px;letter-spacing:.22em;text-transform:uppercase}
.f-bot nav{display:flex;gap:22px}
.f-bot a:hover{color:#fff}

/* float + toast */
.wa{position:fixed;left:calc(22px + env(safe-area-inset-left,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:80;width:48px;height:48px;border-radius:50%;background:#5bb974;color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.15);transition:transform .2s}
.wa:hover{transform:scale(1.06)}
.wa svg{width:24px;height:24px}
.to-top{position:fixed;right:calc(22px + env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:80;width:42px;height:42px;background:var(--ink);color:#fff;display:grid;place-items:center;opacity:0;visibility:hidden;transition:.25s}
.to-top.show{opacity:1;visibility:visible}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:14px 20px;font-size:13.5px;z-index:130;opacity:0;visibility:hidden;transition:.3s;display:flex;gap:16px;align-items:center;max-width:calc(100% - 32px)}
.toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}
.toast a{color:#e3c9a2;font-family:var(--display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}

/* reveal: visible at rest, gentle settle when scrolled in */
.rv{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.rv:not(.in){transform:translateY(10px)}
@media (prefers-reduced-motion:reduce){.rv:not(.in){transform:none}*{transition:none!important}}

/* ---------- responsive ---------- */
@media(max-width:1180px){
  .navbar .menu{gap:30px}
  .rail{grid-auto-columns:calc((100% - 2*22px)/3)}
  .f-top{grid-template-columns:1fr 1fr 1fr}
  .f-top>div:first-child{grid-column:1/-1}
  .cards.c5{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(3,1fr);row-gap:40px}
  .step:nth-child(3):after{display:none}
}
@media(max-width:960px){
  .wrap{padding:0 24px}
  .navbar,.hide-m{display:none}
  .burger,.show-m{display:inline-flex}
  .hdr{padding-top:12px;padding-bottom:12px}
  .hdr .logo img{height:46px}
  .hdr-l,.hdr-r{gap:14px}
  .split,.get-in-touch,.quote-grid,.banner,.pd,.imgtext,.pick,.ph-grid{grid-template-columns:1fr}
  .hs-slide{height:700px}
  .hs-copy{justify-content:flex-start;padding-top:44px}
  .hs-copy p{margin-bottom:24px}
  .hs-slide{--cw:100%}
  .hs-stage{left:0;top:auto;height:56%}
  .hs-stage .i2,.s2 .row img:not(:nth-child(2)){display:none}
  .s1 .i1,.s3 .i1{height:min(92cqh,92cqw)}
  .s2 .row{left:0;right:0;bottom:2%;height:min(92%,92vw);justify-content:center}
  .s2 .row img{flex:0 0 auto;width:auto;height:100%;aspect-ratio:1;margin:0}
  .hs-ui{bottom:16px;justify-content:flex-end}
  .hs-arrows{display:none}
  .imgtext,.pick{gap:40px}
  .split.rev>:first-child{order:0}
  .grid4{grid-template-columns:repeat(2,1fr);gap:32px 16px}
  .values{grid-template-columns:1fr 1fr;row-gap:44px}
  .stats{grid-template-columns:repeat(3,1fr)}
  .stats>div:nth-child(3){border-right:0}
  .stats>div:nth-child(n+4){border-top:1px solid rgba(239,231,218,.2)}
  .projects{grid-template-columns:repeat(2,1fr)}
  .posts,.cards,.cards.c4{grid-template-columns:1fr 1fr}
  .shop{grid-template-columns:1fr}
  .side{display:none}
  .side.open{display:block}
  .toolbar .filt-btn{display:inline-flex}
  .gal{position:static;grid-template-columns:1fr}
  .gal .thumbs{grid-auto-flow:column;grid-auto-columns:68px;order:2}
  .timeline{grid-template-columns:1fr}
  .banner .txt{padding:44px 28px}
  .overlap{height:420px}
  .ph-grid{gap:28px;padding-bottom:40px}
  .ph-media{height:250px;max-width:460px;margin-top:84px}
  .page-hero.compact .ph-grid{grid-template-columns:1fr;gap:10px}
  .art-drawing .ph-media,.art-single .ph-media{margin-top:0;max-width:none}
  .arch.a1{height:220px;top:30px}.arch.a2{height:150px}
  .ph-lamp{top:-86px}
  section{padding:72px 0}
  .statement{padding:64px 0}
}
@media(max-width:640px){
  .wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .rail,.rail.cols-5{grid-auto-columns:78%}
  .stats{grid-template-columns:1fr 1fr}
  .stats>div{border-right:0!important;border-top:1px solid rgba(239,231,218,.2)}
  .stats>div:last-child{grid-column:1/-1}
  .feats,.form,.posts,.cards,.cards.c4,.cards.c5,.steps{grid-template-columns:1fr}
  .step:after{display:none}
  .f-top{grid-template-columns:1fr 1fr}
  .f-top>div:last-child{grid-column:1/-1}
  .products{grid-template-columns:1fr 1fr;gap:32px 14px}
  .prod h3{font-size:13.5px}
  .prod small{display:none}
  .tabs.lg{gap:22px}
  .contact-card{padding:26px 20px}
  .qrow{grid-template-columns:64px 1fr auto;gap:12px}
  .qrow .th{width:64px;height:64px}
  .qrow .qty{grid-column:2}
  .assure{grid-template-columns:1fr}
  .mini-stats{gap:26px}
  .overlap{height:340px}
  .values{grid-template-columns:1fr}
  section{padding:60px 0}
}

/* ===== classic: sections carried over from the earlier design (homepage from "Our Impact" down, and the footer).
   Generated from that design's stylesheet; classes are k- prefixed and only apply inside .classic. ===== */
.classic{--serif:"Cormorant Garamond",Georgia,serif;--sans:Inter,system-ui,sans-serif;--r:4px;--shadow:0 14px 34px rgba(31,27,22,.08);font-family:var(--sans);line-height:1.6;font-size:15px;color:var(--ink)}
.classic h1,.classic h2,.classic h3,.classic h4{font-family:var(--serif);font-weight:600;line-height:1.1;color:inherit;text-transform:none;letter-spacing:normal}
.classic h2{font-size:clamp(32px,4vw,48px)}
.classic h3{font-size:24px}
.classic section{padding:88px 0}
@media(max-width:900px){.classic section{padding:72px 0}}
@media(max-width:640px){.classic section{padding:60px 0}}
.classic .k-eyebrow{text-transform:uppercase;letter-spacing:3px;font-size:12px;color:var(--accent);font-weight:600}
.classic .k-lead{color:var(--muted);font-size:16px;max-width:560px}
.classic .k-muted{color:var(--muted)}
.classic .k-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 28px;border-radius:2px;font-weight:500;font-size:14px;letter-spacing:.5px;transition:.2s;border:1px solid transparent;white-space:nowrap}
.classic .k-btn-dark{background:var(--ink);color:#fff}
.classic .k-btn-dark:hover{background:var(--accent)}
.classic .k-btn-line{border-color:var(--ink)}
.classic .k-btn-line:hover{background:var(--ink);color:#fff}
.classic .k-btn-cream{background:#efe7da;color:var(--green)}
.classic .k-btn-cream:hover{background:#fff}
.classic .k-btn-ghost{border-color:rgba(255,255,255,.5);color:#fff}
.classic .k-btn-ghost:hover{background:#fff;color:var(--ink)}
.classic .k-btn-sm{padding:9px 18px;font-size:13px}
.classic .k-link{color:var(--accent);font-weight:600;font-size:14px}
.classic .k-link:hover{text-decoration:underline}
.classic .k-sec-sand{background:var(--sand)}
.classic .k-sec-white{background:#fff}
.classic .k-sec-green{background:var(--green);color:#efe7da}
.classic .k-sec-green .k-eyebrow{color:var(--accent-2)}
.classic .k-sec-green .k-lead,.classic .k-sec-green .k-muted{color:#cfd9d2}
.classic .k-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:40px;flex-wrap:wrap}
.classic .k-head h2{margin-top:8px}
.classic .k-head.k-center{justify-content:center;text-align:center;flex-direction:column;align-items:center}
.classic .k-head .k-lead{margin-top:12px}
.classic .k-ill{background:#efe8de;color:#7b6f62;display:grid;place-items:center;position:relative;width:100%;height:100%}
.classic .k-ill svg{width:62%;height:62%}
.classic .k-ill em{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-style:normal;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#a39684}
.classic .k-stats{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(239,231,218,.2);border-bottom:1px solid rgba(239,231,218,.2)}
.classic .k-stats>div{padding:34px 12px;text-align:center;border-right:1px solid rgba(239,231,218,.2)}
.classic .k-stats>div:last-child{border:0}
.classic .k-stats b{display:block;font-family:var(--serif);font-size:clamp(40px,4.4vw,58px);font-weight:600;line-height:1;color:#fff}
.classic .k-stats span{font-size:13px;color:#cfd9d2;display:block;margin-top:10px}
.classic .k-solutions{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.classic .k-sol{border-radius:var(--r);overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:.3s}
.classic .k-sol:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.classic .k-sol>img,.classic .k-sol>.k-ill{aspect-ratio:1;width:100%;object-fit:cover;transition:transform .6s}
.classic .k-sol:hover>img{transform:scale(1.04)}
.classic .k-sol .k-cap{flex:1;padding:16px 18px 18px;background:var(--green);color:#efe7da;position:relative;z-index:1}
.classic .k-sol .k-cap b{font-family:var(--serif);font-size:22px;line-height:1.1;display:block;color:#fff;margin-top:4px}
.classic .k-sol .k-cap span{font-size:11px;color:var(--accent-2);letter-spacing:1.5px;text-transform:uppercase}
.classic .k-tabs{display:flex;gap:6px;flex-wrap:wrap}
.classic .k-tabs button{padding:9px 20px;border:1px solid var(--line);background:#fff;border-radius:40px;font-size:14px;transition:.2s}
.classic .k-tabs button:hover{border-color:var(--ink)}
.classic .k-tabs button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.classic .k-projects{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.classic .k-proj{position:relative;border-radius:var(--r);overflow:hidden;background:#fff;cursor:zoom-in;aspect-ratio:1}
.classic .k-proj.k-tall{grid-row:span 2;aspect-ratio:auto}
.classic .k-proj img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.classic .k-proj:hover img{transform:scale(1.05)}
.classic .k-proj .k-cap{position:absolute;inset:auto 0 0 0;padding:40px 16px 14px;background:linear-gradient(transparent,rgba(20,18,15,.75));color:#fff;font-size:14px;opacity:0;transition:.3s}
.classic .k-proj:hover .k-cap{opacity:1}
.classic .k-proj .k-cap small{display:block;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--accent-2)}
.classic .k-proj[hidden]{display:none}
.classic .k-banner{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r);overflow:hidden;background:var(--green);color:#efe7da}
.classic .k-banner .k-txt{padding:56px}
.classic .k-banner .k-txt p{color:#cfd9d2;margin:16px 0 28px}
.classic .k-banner .k-media{display:grid;grid-template-columns:1fr 1fr;background:#fff}
.classic .k-banner .k-media img{width:100%;height:100%;object-fit:cover}
.classic .k-banner.k-ink{background:var(--ink)}
.classic .k-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.classic .k-post{display:flex;flex-direction:column}
.classic .k-post .k-ph{aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;background:#fff;position:relative}
.classic .k-post .k-ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.classic .k-post:hover .k-ph img{transform:scale(1.04)}
.classic .k-post .k-date{position:absolute;left:14px;top:14px;background:#fff;text-align:center;padding:6px 12px;line-height:1.1;font-family:var(--serif);font-weight:600;font-size:22px}
.classic .k-post .k-date small{display:block;font-family:var(--sans);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.classic .k-post .k-meta{font-size:12px;color:var(--muted);margin:16px 0 8px;display:flex;gap:12px}
.classic .k-post .k-meta .k-cat-l{color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:2px}
.classic .k-post h3{font-size:25px;margin-bottom:10px}
.classic .k-post h3 a:hover{color:var(--accent)}
.classic .k-post p{color:var(--muted);font-size:14px;margin-bottom:14px}
.classic .k-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.classic .k-form .k-full{grid-column:1/-1}
.classic .k-field label{display:block;font-size:13px;font-weight:500;margin-bottom:6px}
.classic .k-field label i{color:var(--red);font-style:normal}
.classic .k-field input,.classic .k-field select,.classic .k-field textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:2px;padding:13px 14px;font-size:14px;outline:none;transition:border .2s}
.classic .k-field input:focus,.classic .k-field select:focus,.classic .k-field textarea:focus{border-color:var(--ink)}
.classic .k-field textarea{min-height:130px;resize:vertical}
.classic .k-form .k-note{font-size:12px;color:var(--muted)}
.classic .form-ok{display:none;background:#e7efe9;border:1px solid #bcd3c4;color:var(--green);padding:16px 18px;border-radius:2px;font-size:14px}
.classic .form-ok.show{display:block}
.classic .k-contact-card{background:#fff;padding:44px;border-radius:var(--r)}
.classic .k-get-in-touch{display:grid;grid-template-columns:1fr 1.25fr;gap:56px;align-items:start}
.classic .k-info-list{display:grid;gap:22px;margin-top:28px}
.classic .k-info-list div{display:flex;gap:16px}
.classic .k-info-list .k-ic{width:46px;height:46px;border-radius:50%;background:var(--green);color:#efe7da;display:grid;place-items:center;flex:none}
.classic .k-info-list .k-ic svg{width:20px;height:20px}
.classic .k-info-list b{display:block;font-family:var(--serif);font-size:20px}
.classic .k-info-list span,.classic .k-info-list a{color:var(--muted);font-size:14px}
.classic .k-socials{display:flex;gap:10px;margin-top:20px}
.classic .k-socials a{width:40px;height:40px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;opacity:.8;transition:.2s}
.classic .k-socials a:hover{opacity:1;background:var(--accent);border-color:var(--accent);color:#fff}
.classic .k-socials svg{width:16px;height:16px}
.classic footer.k-site{background:var(--ink);color:#bdb3a6;padding:72px 0 28px;font-size:14px}
.classic .k-f-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:36px;margin-bottom:48px}
.classic .k-f-top h4{color:#fff;margin-bottom:16px;font-family:var(--sans);font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:600}
.classic .k-f-top li{margin-bottom:9px}
.classic .k-f-top a:hover{color:#fff}
.classic .k-f-brand img{height:96px;width:auto;background:#fbf9f5;padding:10px 16px;border-radius:6px}
.classic .k-f-brand p{margin:18px 0;max-width:320px}
.classic .k-f-contact{display:grid;gap:10px}
.classic .k-f-contact div{display:flex;gap:10px}
.classic .k-f-contact svg{width:16px;height:16px;flex:none;margin-top:3px;color:var(--accent-2)}
.classic .k-f-bot{border-top:1px solid #3a342d;padding-top:22px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px}
.classic .k-f-bot nav{display:flex;gap:18px}
.classic .k-f-bot a:hover{color:#fff}
@media(max-width:1100px){
  .classic .k-solutions{grid-template-columns:repeat(3,1fr)}
  .classic .k-f-top{grid-template-columns:1fr 1fr 1fr}
  .classic .k-f-brand{grid-column:1/-1}
}
@media(max-width:900px){
  .classic .k-get-in-touch,.classic .k-banner{grid-template-columns:1fr}
  .classic .k-stats{grid-template-columns:repeat(3,1fr)}
  .classic .k-stats>div:nth-child(3){border-right:0}
  .classic .k-stats>div:nth-child(n+4){border-top:1px solid rgba(239,231,218,.2)}
  .classic .k-projects{grid-template-columns:repeat(2,1fr)}
  .classic .k-posts{grid-template-columns:1fr 1fr}
  .classic .k-banner .k-txt{padding:36px 28px}
}
@media(max-width:640px){
  .classic .k-solutions{grid-template-columns:1fr 1fr}
  .classic .k-stats{grid-template-columns:1fr 1fr}
  .classic .k-stats>div{border-right:0!important;border-top:1px solid rgba(239,231,218,.2)}
  .classic .k-stats>div:last-child{grid-column:1/-1}
  .classic .k-form,.classic .k-posts{grid-template-columns:1fr}
  .classic .k-f-top{grid-template-columns:1fr 1fr}
  .classic .k-contact-card{padding:24px}
}
/* ===== end classic ===== */

/* classic additions: homepage "Shop by space" as a text index (no second picture grid; the header menu covers the same routes) */
.classic .k-spaces{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.classic .k-space{display:flex;flex-direction:column;gap:12px;padding:30px 24px 28px;border-left:1px solid var(--line);transition:background .25s}
.classic .k-space:first-child{border-left:0}
.classic .k-space:hover{background:#fff}
.classic .k-space .k-n{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent);font-weight:600}
.classic .k-space b{font-family:var(--serif);font-size:26px;line-height:1.1;font-weight:600;color:var(--ink)}
.classic .k-space p{font-size:13.5px;color:var(--muted);flex:1}
.classic .k-space .k-go{font-size:13px;font-weight:600;color:var(--green);transition:transform .25s}
.classic .k-space:hover .k-go{transform:translateX(4px)}
@media(max-width:1100px){
  .classic .k-spaces{grid-template-columns:1fr}
  .classic .k-space{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) auto;grid-template-areas:"b p go" "n p go";align-items:center;gap:4px 32px;padding:22px 0;border-left:0;border-top:1px solid var(--line)}
  .classic .k-space:first-child{border-top:0}
  .classic .k-space:hover{background:none}
  .classic .k-space b{grid-area:b}.classic .k-space .k-n{grid-area:n}.classic .k-space p{grid-area:p}.classic .k-space .k-go{grid-area:go}
}
@media(max-width:640px){
  .classic .k-space{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n go" "b go" "p p";gap:6px 16px}
  .classic .k-space b{font-size:23px}
}