/* ЛАД — креслярський шар поверх базових стилів */
:root{--ff-h:'Fira Sans Extra Condensed','Arial Narrow',Impact,sans-serif;--ff-m:'IBM Plex Mono',ui-monospace,Consolas,monospace;--ff-d:'Spectral',Georgia,serif}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(139,94,60,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(139,94,60,.07) 1px,transparent 1px);background-size:64px 64px}
body>main,body>footer,body>header{position:relative;z-index:1}
body>header.hd{position:fixed}
h1,.h2{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;line-height:.92;letter-spacing:.004em}
.h2{font-size:clamp(42px,6.6vw,96px)}
.h2 em,h1 em{font-family:var(--ff-d);font-style:italic;font-weight:500;text-transform:none;color:var(--wood);letter-spacing:-.02em;font-size:.9em}
.eyebrow{font:500 12px/1 var(--ff-m);letter-spacing:.14em;text-transform:uppercase;color:var(--wood);gap:10px}
.eyebrow::before{content:"+";width:auto;height:auto;background:none;font-size:18px;line-height:1;color:var(--wood);transform:translateY(-1px)}
.mat .eyebrow::before,.calc .eyebrow::before{color:var(--accent)}
.btn{border-radius:4px;font-family:var(--ff-h);font-weight:700;font-size:17px;letter-spacing:.06em;text-transform:uppercase;padding:16px 26px}
.chip{border-radius:4px}
.seg,.seg button{border-radius:4px}
.seg{padding:3px}
.sw button{border-radius:4px}
.sw button.on::after{border-radius:2px}
.fld input,.fld textarea,.fld select{border-radius:4px}
.md-p,.lb .md-p{border-radius:8px}
.st,.it,.sum,.cfg-v,.mat-ph,.map,.rc,.cta-b{border-radius:8px}
.cfg-tag,.glass{border-radius:6px}

/* ---- курсор: хрестик + рамка виміру ---- */
.cur{position:fixed;left:0;top:0;z-index:9999;pointer-events:none;width:0;height:0;will-change:transform}
.cur i{position:absolute;display:block}
.cur .h{left:-16px;top:-.5px;width:32px;height:1px;background:linear-gradient(90deg,#2B2B2B 0 12px,transparent 12px 20px,#2B2B2B 20px);box-shadow:0 0 0 1px rgba(255,255,255,.75)}
.cur .v{top:-16px;left:-.5px;height:32px;width:1px;background:linear-gradient(180deg,#2B2B2B 0 12px,transparent 12px 20px,#2B2B2B 20px);box-shadow:0 0 0 1px rgba(255,255,255,.75)}
.cur b{position:absolute;left:14px;top:12px;font:500 10px var(--ff-m);letter-spacing:.06em;color:#2B2B2B;white-space:nowrap;text-shadow:0 0 3px #fff,0 0 3px #fff}
.cur.hide{opacity:0}.cur.dn .h,.cur.dn .v{transform:scale(.6)}
.cur.hov i,.cur.hov b{opacity:0}
.frm{position:fixed;left:0;top:0;z-index:9998;pointer-events:none;opacity:0;width:20px;height:20px;transition:opacity .2s,transform .4s var(--ease),width .4s var(--ease),height .4s var(--ease);
  background:linear-gradient(var(--wood),var(--wood)) 0 0/12px 2px no-repeat,linear-gradient(var(--wood),var(--wood)) 0 0/2px 12px no-repeat,
  linear-gradient(var(--wood),var(--wood)) 100% 0/12px 2px no-repeat,linear-gradient(var(--wood),var(--wood)) 100% 0/2px 12px no-repeat,
  linear-gradient(var(--wood),var(--wood)) 0 100%/12px 2px no-repeat,linear-gradient(var(--wood),var(--wood)) 0 100%/2px 12px no-repeat,
  linear-gradient(var(--wood),var(--wood)) 100% 100%/12px 2px no-repeat,linear-gradient(var(--wood),var(--wood)) 100% 100%/2px 12px no-repeat}
.frm.on{opacity:1}
.frm span{position:absolute;right:-1px;top:-22px;padding:2px 6px;background:var(--wood);color:#fff;font:500 10px var(--ff-m);letter-spacing:.06em;white-space:nowrap}
@media(hover:none),(pointer:coarse){.cur,.frm{display:none}}
@media (hover:hover) and (pointer:fine){html.hascur,html.hascur *{cursor:none!important}}

/* ---- прелоадер: дошки ---- */
.pre{background:transparent;display:block}
.pre-p{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,1fr)}
.pre-p i{background:#2B2B2B;border-right:1px solid #333;transform-origin:50% 0}
.pre-p i:nth-child(odd){background:#262626}
.pre-c{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:22px;z-index:2;color:var(--bg)}
.pre-c svg{width:min(62vw,360px);height:auto;overflow:visible}
.pre-c svg path{fill:none;stroke:var(--bg);stroke-width:12;stroke-dasharray:1;stroke-dashoffset:1}
.pre-c svg .sh{stroke:var(--accent)}
.pre-c b{font:500 14px var(--ff-m);letter-spacing:.2em;color:var(--accent);font-variant-numeric:tabular-nums}
.pre-c small{font:400 11px var(--ff-m);letter-spacing:.3em;text-transform:uppercase;color:#8d8a84}
.pre-bar{width:min(62vw,360px);height:2px;background:rgba(255,255,255,.14)}
.pre-bar i{display:block;height:100%;width:0;background:var(--accent)}

/* ---- header ---- */
.logo{font-family:var(--ff-h);letter-spacing:0;gap:12px}
.logo svg{width:auto;height:30px;color:var(--dark)}
.logo span{display:grid;line-height:1.05;font:500 10.5px var(--ff-m);letter-spacing:.14em;color:var(--wood);text-transform:uppercase}
.ft .logo svg{color:var(--bg)}
.nav{font-family:var(--ff-m);font-size:12.5px;text-transform:uppercase;letter-spacing:.1em}
.hd.stk{box-shadow:0 1px 0 var(--dark)}
.burger{border-radius:4px}
.drw-l a{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;font-size:clamp(44px,9vw,72px);line-height:1}
.drw-l a small{font-family:var(--ff-m)}

/* ---- hero ---- */
.hero{padding:clamp(96px,12vh,128px) 0 0;display:flex;flex-direction:column;align-items:stretch;min-height:100svh;background:radial-gradient(900px 560px at 78% 42%,rgba(201,162,126,.28),transparent 62%)}
.hero::after{display:none}
.hero-bgt{position:absolute;right:-3vw;top:6vh;font:800 clamp(280px,46vw,720px)/.8 var(--ff-h);color:transparent;-webkit-text-stroke:1.5px rgba(139,94,60,.22);z-index:0;pointer-events:none;user-select:none;letter-spacing:-.02em;white-space:nowrap}
.hero .wrap.hg{flex:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(8px,2vw,32px);align-items:center;position:relative;z-index:2}
.hero h1{font-size:clamp(50px,8vw,128px);font-weight:800;line-height:.86;margin:20px 0 0}
.hero h1 .l{display:block;overflow:hidden;padding:.04em 0 .02em}
.hero h1 .l.o>span{color:transparent;-webkit-text-stroke:max(1.5px,.018em) var(--dark)}
.hero h1 .l.o>span em{display:none}
.hero .eyebrow{font-size:12px}
.hero-sub{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;margin:26px 0 30px;max-width:560px}
.hero-sub::before{content:"";width:48px;height:2px;background:var(--wood);margin-top:.8em}
.hero-sub p{font-size:clamp(16px,1.4vw,18.5px);color:#4a4a4a}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.badge{position:relative;width:124px;height:124px;flex:none;display:grid;place-items:center;border:0;background:none;padding:0;margin-left:6px}
.badge svg.ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 16s linear infinite}
.badge text{font:500 11.5px var(--ff-m);letter-spacing:.22em;fill:var(--dark);text-transform:uppercase}
.badge .ar{position:relative;width:44px;height:44px;border-radius:50%;background:var(--wood);color:#fff;display:grid;place-items:center;transition:transform .4s var(--ease)}
.badge:hover .ar{transform:scale(1.18) rotate(-45deg)}
.badge .ar svg{width:20px}
@keyframes spin{to{transform:rotate(360deg)}}
.stage{position:relative;height:min(74vh,700px);min-height:420px}
#bg3d{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;cursor:grab}
.dim{position:absolute;pointer-events:none;color:var(--wood);font:500 11px var(--ff-m);letter-spacing:.1em}
.dim.v{right:5%;top:8%;bottom:10%;width:14px;border-left:1.5px solid var(--wood);transform-origin:50% 0;transform:scaleY(0)}
.dim.v::before,.dim.v::after{content:"";position:absolute;left:-8px;width:16px;border-top:1.5px solid var(--wood)}
.dim.v::before{top:0}.dim.v::after{bottom:0}
.dim.v span{position:absolute;left:8px;top:50%;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);white-space:nowrap}
.dim.hz{left:16%;right:20%;bottom:3%;height:14px;border-bottom:1.5px solid var(--wood);transform-origin:0 50%;transform:scaleX(0)}
.dim.hz::before,.dim.hz::after{content:"";position:absolute;bottom:-8px;height:16px;border-left:1.5px solid var(--wood)}
.dim.hz::before{left:0}.dim.hz::after{right:0}
.dim.hz span{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);white-space:nowrap}
.reg{position:absolute;font:400 16px var(--ff-m);color:var(--wood);opacity:.7}
.reg.a{left:0;top:0}.reg.b{right:0;top:0}.reg.c{left:0;bottom:0}.reg.d{right:0;bottom:0}
.hint{position:absolute;left:0;bottom:8px;font:400 11px var(--ff-m);letter-spacing:.1em;text-transform:uppercase;color:#7c7368;display:flex;gap:8px;align-items:center}
.hint::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--wood);animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.2}}
@media(max-width:900px){
  .hero{min-height:auto;padding-top:96px}
  .hero .wrap.hg{grid-template-columns:1fr;gap:10px}
  .stage{height:min(88vw,460px);min-height:340px;order:2}
  .hero-bgt{font-size:92vw;top:30vh;right:-14vw}
  .badge{width:104px;height:104px}
}

/* ---- кінетичні рядки ---- */
.kin{background:var(--dark);overflow:hidden;border-block:1px solid #000;padding:10px 0;position:relative;z-index:2}
.kin-r{transform:skewX(var(--sk,0deg));will-change:transform}
.kin-t{display:flex;width:max-content;animation:kin 46s linear infinite}
.kin-r.rev .kin-t{animation-direction:reverse;animation-duration:58s}
.kin span{font:800 clamp(44px,7.4vw,108px)/1 var(--ff-h);text-transform:uppercase;color:var(--bg);padding-inline:.35em;display:flex;align-items:center;gap:.7em;white-space:nowrap}
.kin span.o{color:transparent;-webkit-text-stroke:1.5px var(--accent)}
.kin span::after{content:"";width:.28em;height:.28em;background:var(--wood);transform:rotate(45deg)}
@keyframes kin{to{transform:translateX(-50%)}}

/* ---- паспорт ---- */
.pass{padding-block:clamp(56px,8vw,96px)}
.pass-h{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.pp{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);border:2px solid var(--dark);background:rgba(247,243,238,.8);position:relative}
.pp>*{border:0}
.pp-draw{grid-row:span 2;position:relative;border-right:1px solid var(--dark);padding:clamp(14px,2.4vw,32px);background:repeating-linear-gradient(0deg,transparent 0 23px,rgba(139,94,60,.09) 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,rgba(139,94,60,.09) 23px 24px)}
.pp-draw .tagm{position:absolute;left:14px;top:12px;font:500 11px var(--ff-m);letter-spacing:.12em;color:var(--wood);text-transform:uppercase}
.pp-draw svg{width:100%;height:auto;display:block;margin-top:14px;overflow:visible}
.dr path,.dr line,.dr rect.s,.dr circle{fill:none;stroke:var(--dark);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.dr .dm{stroke:var(--wood);stroke-width:1.2}
.dr text{font:500 11px var(--ff-m);fill:var(--wood);letter-spacing:.08em}
.dr .fl{fill:var(--wood);fill-opacity:0;stroke:none;transition:fill-opacity .8s}
.dr .fl.g{fill:var(--dark)}.dr .fl.a{fill:var(--accent)}
.dr.done .fl{fill-opacity:.9}.dr.done .fl.l{fill-opacity:.35}
.pp-rows{border-bottom:1px solid var(--dark)}
.pr{display:grid;grid-template-columns:130px 1fr;gap:12px;padding:14px 20px;border-top:1px solid rgba(43,43,43,.25);position:relative;overflow:hidden;font-size:15px;transition:color .4s}
.pr:first-child{border-top:0}
.pr::before{content:"";position:absolute;inset:0;background:var(--dark);transform:translateX(-101%);transition:transform .5s var(--ease);z-index:-1}
.pr:hover{color:var(--bg)}.pr:hover::before{transform:none}
.pr{isolation:isolate}
.pr b{font:500 11.5px var(--ff-m);letter-spacing:.1em;text-transform:uppercase;color:var(--wood);padding-top:3px}
.pr:hover b{color:var(--accent)}
.pp-num{display:grid;grid-template-columns:repeat(3,1fr)}
.pp-num div{padding:18px 20px 16px;border-left:1px solid var(--dark)}
.pp-num div:first-child{border-left:0}
.pp-num b{font:800 clamp(40px,5vw,68px)/.9 var(--ff-h);color:var(--dark);display:block}
.pp-num span{font-size:13px;display:block;margin-top:6px}
.pp-stamp{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--dark);font:400 11px var(--ff-m);letter-spacing:.08em;text-transform:uppercase}
.pp-stamp div{padding:10px 16px;border-left:1px solid var(--dark)}
.pp-stamp div:first-child{border-left:0}
.pp-stamp small{display:block;font-size:9.5px;color:#8a8178;margin-bottom:3px}
@media(max-width:860px){.pp{grid-template-columns:1fr}.pp-draw{grid-row:auto;border-right:0;border-bottom:1px solid var(--dark)}.pr{grid-template-columns:104px 1fr}.pp-stamp{grid-template-columns:1fr 1fr}.pp-stamp div:nth-child(3){border-left:0;border-top:1px solid var(--dark)}.pp-stamp div:nth-child(4){border-top:1px solid var(--dark)}}

/* ---- вироби: акордеон ---- */
.svc{background:var(--bg2);overflow:visible}
.ax{margin-top:34px;border-bottom:2px solid var(--dark)}
.ax-i{border-top:2px solid var(--dark)}
.ax-h{width:100%;display:grid;grid-template-columns:clamp(44px,6vw,84px) minmax(0,1fr) auto;gap:14px;align-items:center;padding:clamp(12px,1.6vw,22px) 0;text-align:left;position:relative}
.ax-h .n{font:500 13px var(--ff-m);color:var(--wood);letter-spacing:.1em}
.ax-h h3{font:800 clamp(44px,9.4vw,148px)/.9 var(--ff-h);text-transform:uppercase;color:var(--dark);transition:color .4s,transform .6s var(--ease),-webkit-text-stroke-color .4s;letter-spacing:.002em}
.ax-h:hover h3{transform:translateX(18px);color:var(--wood)}
.ax-i.open .ax-h h3{color:var(--wood);transform:translateX(18px)}
.ax-h .pl{width:clamp(40px,4.6vw,64px);height:clamp(40px,4.6vw,64px);border:2px solid var(--dark);position:relative;transition:transform .6s var(--ease),background .3s;flex:none}
.ax-h .pl::before,.ax-h .pl::after{content:"";position:absolute;left:50%;top:50%;width:40%;height:2px;background:var(--dark);transform:translate(-50%,-50%);transition:.4s}
.ax-h .pl::after{transform:translate(-50%,-50%) rotate(90deg)}
.ax-i.open .pl{background:var(--dark);transform:rotate(180deg)}
.ax-i.open .pl::before,.ax-i.open .pl::after{background:var(--bg)}
.ax-i.open .pl::after{transform:translate(-50%,-50%) rotate(0)}
.ax-p{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s var(--ease)}
.ax-i.open .ax-p{grid-template-rows:1fr}
.ax-p>div{overflow:hidden;min-height:0}
.ax-b{display:grid;grid-template-columns:clamp(44px,6vw,84px) minmax(0,.9fr) minmax(0,1.1fr);gap:14px clamp(16px,3vw,48px);padding:6px 0 28px}
.ax-ph{grid-column:2;height:clamp(260px,34vw,440px);overflow:hidden;border-radius:6px;position:relative;clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease) .1s}
.ax-i.open .ax-ph{clip-path:inset(0 0 0 0)}
.ax-ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.18);transition:transform 1.4s var(--ease) .1s}
.ax-i.open .ax-ph img{transform:scale(1)}
.ax-tx{grid-column:3;display:flex;flex-direction:column;gap:18px;justify-content:flex-end;opacity:0;transform:translateY(24px);transition:opacity .6s .25s,transform .8s var(--ease) .25s}
.ax-i.open .ax-tx{opacity:1;transform:none}
.ax-tx p{font-size:clamp(16px,1.5vw,19px);max-width:46ch}
.ax-tx ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ax-tx li{padding:7px 12px;border:1px solid var(--dark);font:500 12px var(--ff-m);letter-spacing:.06em;text-transform:uppercase;border-radius:3px}
.ax-tx .row{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.ax-tx .pr2{font:800 34px var(--ff-h);color:var(--wood);text-transform:uppercase}
@media(max-width:760px){.ax-b{grid-template-columns:1fr}.ax-ph,.ax-tx{grid-column:1}.ax-h{grid-template-columns:34px 1fr auto}}

/* ---- розділи: заголовки ---- */
#configurator .h2,#storage .h2,#materials .h2,#calc .h2,#process .h2{max-width:14ch}
.cfg-p h3,.mat-t h3{font-family:var(--ff-h);text-transform:uppercase;font-weight:700}
.mat-t h3{font-size:clamp(38px,5vw,64px)}
.st-b h3{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;font-size:30px}
.rs h3{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;font-size:clamp(30px,3.6vw,46px)}
.rs-n{border-radius:4px;font-family:var(--ff-m)}
.rs-t{border-radius:3px;font-family:var(--ff-m)}
.rail::before,.rail-f{border-radius:0}
.fq button{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;font-size:clamp(22px,2.6vw,32px);letter-spacing:.01em}
.fq button i{border-radius:4px}
.cta-b h2{font-family:var(--ff-h);text-transform:uppercase;font-weight:800;font-size:clamp(38px,6vw,84px);line-height:.92;max-width:16ch}
.cta-b::before{background:repeating-linear-gradient(135deg,rgba(255,255,255,.07) 0 14px,transparent 14px 28px);animation:stripes 6s linear infinite;background-size:40px 40px}
@keyframes stripes{to{background-position:40px 0}}
.sum-t b,.pp-num b{font-family:var(--ff-h);font-weight:800}
.sum-t b{font-size:clamp(44px,6vw,76px)}
.calc-m b{font-family:var(--ff-h);font-weight:700}
.rate b{font-family:var(--ff-h);font-weight:800}
.mat-pr b{font-family:var(--ff-h)}
.ft .logo{color:var(--bg)}
.ft .logo span{color:var(--accent)}

/* ---- галерея: горизонтальна, закріплена ---- */
.gal{background:var(--dark);color:#fff;position:relative;overflow:hidden;padding:0}
.gal-in{height:100svh;display:flex;flex-direction:column;justify-content:center;position:relative}
.gal-top{position:absolute;left:var(--pad);right:var(--pad);top:clamp(70px,9vh,100px);display:flex;justify-content:space-between;align-items:flex-start;z-index:3;gap:16px;pointer-events:none}
.gal-top .h2{color:var(--bg);font-size:clamp(40px,5.6vw,84px);pointer-events:none}
.gal-top .h2 em{color:var(--accent)}
.gal-cnt{font:800 clamp(44px,6vw,92px)/1 var(--ff-h);color:var(--accent);font-variant-numeric:tabular-nums;text-align:right}
.gal-cnt small{display:block;font:400 11px var(--ff-m);letter-spacing:.16em;color:#9a948b;text-transform:uppercase}
.gal-tr{display:flex;gap:clamp(16px,2vw,32px);align-items:flex-end;padding:0 var(--pad);margin-top:clamp(110px,16vh,170px);will-change:transform}
.gal-s{position:relative;height:min(62svh,640px);flex:none;aspect-ratio:var(--ar,.75);overflow:hidden;border-radius:4px;background:#1b1b1b}
.gal-s img{position:absolute;left:-8%;top:0;width:116%;height:100%;object-fit:cover;will-change:transform}
.gal-s figcaption{position:absolute;left:0;bottom:0;right:0;padding:40px 16px 14px;background:linear-gradient(transparent,rgba(0,0,0,.78));font:500 12px var(--ff-m);letter-spacing:.1em;text-transform:uppercase;display:flex;justify-content:space-between;gap:10px}
.gal-s figcaption b{color:var(--accent);font-weight:500}
.gal-s.end{aspect-ratio:auto;width:min(60vw,420px);display:grid;place-content:center;gap:18px;background:var(--wood);padding:30px}
.gal-s.end h3{color:#fff;font:800 clamp(38px,4.6vw,64px)/.95 var(--ff-h);text-transform:uppercase}
.gal-bar{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(22px,4vh,40px);height:2px;background:rgba(255,255,255,.16)}
.gal-bar i{display:block;height:100%;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:0 50%}
@media(max-width:900px){
  .gal-in{height:auto;padding:70px 0 40px}
  .gal-top{position:static;padding:0 var(--pad);margin-bottom:22px}
  .gal-tr{margin-top:0;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:18px}
  .gal-s{height:min(66svh,460px);scroll-snap-align:center}
  .gal-bar{display:none}
}

/* ---- відгуки/карта/контакти ---- */
.rc{border-radius:8px}
.map{border:2px solid var(--dark);border-radius:4px;padding:0}
.map iframe{filter:grayscale(1) sepia(.4) contrast(1.05) brightness(.96)}
.map::after{background:linear-gradient(135deg,rgba(139,94,60,.28),rgba(43,43,43,.14));mix-blend-mode:multiply}
.map-pin{position:absolute;left:50%;top:50%;width:90px;height:90px;margin:-45px 0 0 -45px;z-index:2;pointer-events:none}
.map-pin::before,.map-pin::after{content:"";position:absolute;inset:0;border:2px solid var(--wood);border-radius:50%;animation:ping 2.6s infinite}
.map-pin::after{animation-delay:1.3s}
@keyframes ping{0%{transform:scale(.2);opacity:1}100%{transform:scale(1);opacity:0}}
.map .reg{z-index:3}
.map-c{border-radius:4px}
.ct-r i{border-radius:4px}
.pg-h h1{font-size:clamp(46px,8vw,120px)}
.flt-r>b{font-family:var(--ff-m)}
.it-b h3{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;font-size:25px}
.lb-t h3{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;font-size:clamp(34px,4vw,52px)}
.md-s h3{font-family:var(--ff-h);text-transform:uppercase;font-weight:700;font-size:clamp(34px,4vw,50px);line-height:.95}
.md-s .eyebrow::before{color:var(--accent)}
.js [data-r]{transition-property:opacity,transform}
.hd .btn{padding:12px 20px;font-size:15px}

/* fixes */
.hd.stk{background:rgba(247,243,238,.96);}
.gal-s img{max-width:none}
.gal-top .h2{max-width:none}
.mat-b>*,.cfg-g>*,.calc-g>*,.ct-g>*,.rv-g>*,.hero .hg>*{min-width:0}
.mat-ph{width:100%}
.mat-ph img{max-width:none}
@media(max-width:900px){.stage{margin-inline:-8px}}
.st-v>img,.st-v>svg,.it-i>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-v,.it-i{overflow:hidden}
.flt{position:static}

/* галерея: заголовок не заходить на фото */
.gal-in{justify-content:flex-end;padding-bottom:clamp(54px,8vh,80px)}
.gal-top{top:clamp(74px,9vh,96px)}
.gal-top .h2{font-size:clamp(34px,4.2vw,64px);white-space:nowrap}
.gal-tr{margin-top:0}
.gal-s{height:clamp(300px,calc(100svh - 300px),660px)}
@media(max-width:900px){.gal-top .h2{white-space:normal}.gal-s{height:min(66svh,460px)}}

/* конструктор */
.cfg-v{aspect-ratio:auto;display:grid;place-items:center;background:var(--bg2);height:clamp(420px,76vh,760px);position:relative;overflow:hidden}
.cfg-v canvas{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;cursor:crosshair;display:block}
.cfg-ph{position:absolute;left:14px;right:14px;bottom:14px;padding:9px 14px;font:500 11.5px var(--ff-m);letter-spacing:.04em;background:rgba(43,43,43,.84);color:#fff;border-radius:4px;pointer-events:none}
.th-row{display:flex;gap:8px;overflow-x:auto;padding:3px 3px 10px;scrollbar-width:thin}
.th{flex:none;width:62px;height:62px;border-radius:4px;overflow:hidden;border:2px solid transparent;position:relative;background:var(--bg2);padding:0}
.th img{width:100%;height:100%;object-fit:cover}
.th.on{border-color:var(--wood);box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--wood)}
.th.up{display:grid;place-items:center;border:1.5px dashed var(--dark);font:500 10px/1.2 var(--ff-m);text-align:center;cursor:pointer;color:var(--dark)}
.lay{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;min-height:34px;align-items:center}
.lay button{display:inline-flex;gap:8px;align-items:center;padding:7px 10px;border:1.5px solid var(--line);border-radius:4px;font:500 12px var(--ff-m);background:#fff}
.lay button.on{border-color:var(--dark);background:var(--dark);color:var(--bg)}
.lay i{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.35)}
.lay .x{opacity:.65;padding-left:4px;font-size:15px;line-height:1}
.lay .x:hover{opacity:1}
.tol{display:grid;gap:10px;font:500 11.5px var(--ff-m);letter-spacing:.08em;text-transform:uppercase;color:#6b6b6b}
.sw{grid-template-columns:repeat(auto-fill,minmax(36px,1fr));gap:9px}
.sw button,.sw label.cc{aspect-ratio:1;border-radius:4px}
.sw label.cc{background:conic-gradient(#e44,#ec4,#5c5,#4cd,#46e,#c4c,#e44);position:relative;cursor:pointer;border:3px solid var(--bg);box-shadow:0 0 0 1px var(--line)}
.sw label.cc input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
@media(max-width:900px){.cfg-v{height:min(78vw,520px);min-height:340px}}

/* каталог: компактно на телефоні, без горизонтального скролу */
.flt .wrap>*,.flt-r>div{min-width:0}
.flt-sc{max-width:100%}
@media(max-width:700px){
  .pg-h{padding:92px 0 18px}
  .pg-h h1{font-size:clamp(38px,12vw,56px)}
  .pg-h .lead{font-size:15px;margin-top:12px}
  .flt{padding:10px 0}
  .flt .wrap{gap:6px}
  .flt-r{flex-direction:column;align-items:stretch;gap:3px;flex-wrap:nowrap}
  .flt-r>b{min-width:0;font-size:9.5px;letter-spacing:.16em}
  .flt-sc{gap:6px;padding:1px 1px 3px}
  .chip{padding:6px 12px;font-size:13px}
  .flt-t{gap:8px;margin-top:2px}
  .flt-t>div{width:100%;display:grid!important;grid-template-columns:1fr auto auto;gap:8px}
  .flt-t input[type=search]{min-width:0;width:100%;padding:9px 14px;font-size:13px}
  .flt-t select{min-width:0;padding:9px 12px;font-size:13px;max-width:140px}
  .flt-t .chip{padding:9px 12px}
  .cnt{font-size:12.5px}
  .cat-g{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
  .it-i span{left:8px;top:8px;padding:4px 9px;font-size:11px}
  .it-b{padding:10px 12px 12px;gap:2px}
  .it-b h3{font-size:18px;line-height:1}
  .it-b p{font-size:11.5px}
  .it-b b{font-size:14px;margin-top:4px}
  .cta-b{padding:24px 20px}
  .lb .md-p{max-height:calc(100svh - 24px)}
}
@media(max-width:700px){
  .flt-t>div{grid-template-columns:1fr auto}
  .flt-t input[type=search]{grid-column:1/-1}
  .flt-t select{max-width:none;width:100%}
}
.tol .rng{background:rgba(43,43,43,.2)}
.dim.hz{bottom:9%}

/* перегляд картки каталогу: стан «відкрито» */
.lb .md-p{transform:translateY(40px) scale(.96);opacity:0;transition:transform .6s var(--ease),opacity .4s}
.lb.open .md-bg{opacity:1}
.lb.open .md-p{transform:none;opacity:1}
.lb .md-bg{position:absolute;inset:0;background:rgba(30,30,30,.72);opacity:0;transition:opacity .45s}
.lb-i{position:relative;min-height:320px}
.lb-i img{width:100%;height:100%;max-height:calc(100svh - 32px);object-fit:contain}

/* модалки: кнопка закриття завжди на місці */
.md-p,.lb .md-p{overflow:hidden}
.md-m{overflow:auto;max-height:calc(100svh - 32px);overscroll-behavior:contain}
.lb-t{overflow:auto;max-height:calc(100svh - 32px)}
.md-s{overflow:hidden}
.md-x{position:absolute;right:12px;top:12px;z-index:5;width:46px;height:46px;border-radius:4px;background:var(--dark);color:#fff;border:0;font-size:26px;line-height:1;display:grid;place-items:center;transition:background .2s,transform .2s}
.md-x:hover{background:var(--wood);transform:rotate(90deg)}
.md.closing,.lb.closing{visibility:hidden}
.cfg-v{grid-template-columns:100%;grid-template-rows:100%}
.cfg-v canvas{justify-self:center;align-self:center}
.cfg-v{display:block}
.cfg-v canvas{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:none;max-height:none}

/* 3D-конструктор */
.c3-g{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);align-items:start}
.c3-g .cfg-v{height:clamp(440px,82vh,780px);position:sticky;top:76px}
.cfg-v #c3d{position:absolute;left:0;top:0;width:100%;height:100%;transform:none;max-width:none;max-height:none;touch-action:pan-y;cursor:grab}
.c3-bar{position:absolute;right:12px;top:12px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end;max-width:60%}
.c3-bar button{padding:9px 14px;border-radius:4px;background:var(--dark);color:var(--bg);font:500 12px var(--ff-m);transition:background .25s}
.c3-bar button:hover{background:var(--wood)}
.c3-dim{padding:9px 12px;border-radius:4px;background:rgba(247,243,238,.92);font:500 12px var(--ff-m);color:var(--wood)}
.c3-g .cfg-p{gap:18px;justify-content:flex-start}
.c3-g .cfg-p h3{font-size:20px;margin-bottom:8px}
.c3-var{margin-top:8px}
.seg button{white-space:nowrap}
.c3-sl{display:grid;gap:12px}
.c3-s{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:baseline;font-size:14px}
.c3-s b{font:500 13px var(--ff-m);color:var(--wood)}
.c3-s .rng{grid-column:1/-1;background:rgba(43,43,43,.2)}
.c3-chk button{padding:8px 12px;border:1.5px solid var(--line);border-radius:4px;font-size:13.5px;background:#fff}
.c3-chk button.on{background:var(--dark);color:var(--bg);border-color:var(--dark)}
#c3Sw button{border:3px solid var(--bg);box-shadow:0 0 0 1px var(--line)}
#c3Sw button.on{box-shadow:0 0 0 2.5px var(--wood)}
#c3Parts button{background:#fff}
#c3Parts button.on{background:var(--dark);color:var(--bg)}
.c3-pre{flex-wrap:wrap;overflow:visible}
@media(max-width:900px){
  .c3-g{grid-template-columns:1fr}
  .c3-g .cfg-v{position:relative;top:0;height:min(100vw,560px);min-height:360px}
  .c3-bar{max-width:100%;top:60px;right:8px}
  .c3-g .cfg-ph{font-size:10.5px;padding:7px 10px;left:8px;right:8px;bottom:8px}
}
#c3Type,#c3Var,#c3Mat,#c3Hs{display:flex;width:fit-content;max-width:100%;flex-wrap:wrap}