/* /remont-myagkoy-mebeli/ — ремонт мягкой мебели (08.10.2026). Сборщик tools/build-remont-page.py, макет design-mockups/remont-mock.html */
:root{--cu:#C8763C}
.rm .ui-wrap{max-width:1400px}
.k{font:12px Onest;letter-spacing:.3em;text-transform:uppercase;color:var(--cu)}
.h2{font:200 clamp(34px,4.6vw,72px)/1.05 Unbounded!important;letter-spacing:-.03em;color:var(--ui-strong);margin:18px 0 0;max-width:1150px}
.h2 em{font-style:normal;font-weight:300;color:var(--cu)}
.lead2{max-width:760px;margin-top:22px;font:300 18px/1.65 Onest;color:var(--ui-nav)}
.lead2 a,.rm-note a{color:var(--cu);border-bottom:1px solid rgba(200,118,60,.4)}
.sec{padding-top:140px}
.dk{--ui-page:#0F0A08;--ui-card:#17100C;--ui-strong:#F5ECE2;--ui-text:#E9DFD3;--ui-nav:#CFC3B4;--ui-muted:#A08E7C;--ui-line:rgba(200,118,60,.18);--ui-field:rgba(255,240,225,.06);color:var(--ui-text)}

/* 1. первый экран: настоящий цех */
.rh{position:relative;min-height:min(100vh,900px);display:flex;align-items:flex-end;overflow:hidden;background:#0b0705}
.rh>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.rh::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,7,5,.92) 0%,rgba(11,7,5,.7) 42%,rgba(11,7,5,.15) 100%),linear-gradient(0deg,rgba(11,7,5,.85) 0%,rgba(11,7,5,0) 45%)}
.rh .ui-wrap{position:relative;z-index:1;width:100%;padding-top:150px;padding-bottom:64px}
.h1{font:200 clamp(42px,6vw,100px)/.98 Unbounded!important;letter-spacing:-.04em;color:#F5ECE2;margin:20px 0 0;max-width:1100px}
.h1 em{display:block;font-style:normal;font-weight:300;color:var(--cu)}
.h1 small{display:block;margin-top:22px;font:300 clamp(16px,1.4vw,20px)/1.45 Onest;letter-spacing:0;color:#E3D7C9;max-width:680px}
.rh p.ld{max-width:620px;margin:22px 0 0;font:300 17px/1.65 Onest;color:#CFC3B4}
.rh .ui-actions{margin-top:30px}
.ticks{display:flex;gap:22px;flex-wrap:wrap;margin-top:26px;font:14px Onest;color:#F5ECE2}
.ticks span::before{content:"✓";color:var(--cu);margin-right:8px}
.rh figcaption{position:absolute;right:28px;bottom:26px;z-index:1;font:12px Onest;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,236,226,.7)}

/* 2. что ремонтируем */
.rcs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:50px}
.rc{position:relative;display:flex;flex-direction:column;border-radius:26px;background:var(--ui-card);border:1px solid var(--ui-line);overflow:hidden}
.rc-t{padding:28px 28px 30px;display:flex;flex-direction:column;flex:1}
.rc-t i{font:13px Onest;font-style:normal;color:var(--cu)}
.rc-t b{display:block;padding-top:14px;font:300 22px/1.25 Unbounded;color:var(--ui-strong)}
.rc-t p{margin:12px 0 0;font:300 15px/1.6 Onest;color:var(--ui-nav)}
.rc figure{margin:0;height:220px;overflow:hidden}
.rc figure img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s}
.rc:hover figure img{transform:scale(1.04)}
.rc-mech{position:relative;height:220px;background:#F7F2EA}
.rc-mech img{position:absolute;inset:10px;width:calc(100% - 20px);height:calc(100% - 20px);object-fit:contain;opacity:0;transition:opacity .6s}
.rc-mech img.on{opacity:1}
.rc.is-ph .rc-t b,.rc.is-mech .rc-t b{padding-top:6px}
.rc:not(.is-ph):not(.is-mech){border-top:2px solid rgba(200,118,60,.55)}

/* 3. цены */
.rp{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:50px}
.rp>div{border-radius:26px;padding:34px 32px;background:var(--ui-card);border:1px solid var(--ui-line);display:flex;flex-direction:column}
.rp>div:first-child{background:linear-gradient(150deg,rgba(200,118,60,.2),var(--ui-card) 62%)}
.rp i{font:12px Onest;font-style:normal;letter-spacing:.2em;text-transform:uppercase;color:var(--cu)}
.rp b{display:block;margin-top:26px;font:200 clamp(44px,4.4vw,72px)/1 Unbounded;letter-spacing:-.04em;color:var(--ui-strong);white-space:nowrap}
.rp b small{font:300 16px Onest;letter-spacing:0;color:var(--ui-nav);margin-right:8px}
.rp span{margin-top:14px;font:15px/1.55 Onest;color:var(--ui-nav)}
.rt{margin-top:16px;border-radius:24px;border:1px solid var(--ui-line);overflow:hidden;background:var(--ui-card)}
.rt table{width:100%;border-collapse:collapse;font:15px/1.5 Onest}
.rt th{text-align:left;padding:18px 24px;font:12px Onest;letter-spacing:.14em;text-transform:uppercase;color:var(--cu);border-bottom:1px solid var(--ui-line)}
.rt td{padding:16px 24px;border-bottom:1px solid var(--ui-line);color:var(--ui-text)}
.rt tr:last-child td{border-bottom:0}
.rt td+td{white-space:nowrap;color:var(--ui-strong)}
.rm-note{margin:22px 0 0;max-width:860px;font:300 16px/1.65 Onest;color:var(--ui-nav)}
.calc-cta{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:24px;padding:24px 28px;border-radius:22px;border:1px dashed rgba(200,118,60,.5)}
.calc-cta p{margin:0;font:300 16px/1.55 Onest;color:var(--ui-nav);max-width:640px}

/* 4. ремонт или перетяжка */
.ch3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:50px}
.ch3>div{border-radius:26px;padding:32px 30px;background:var(--ui-card);border:1px solid var(--ui-line)}
.ch3>div:nth-child(2){border-color:rgba(200,118,60,.55);background:linear-gradient(160deg,rgba(200,118,60,.14),var(--ui-card) 60%)}
.ch3 i{font:12px Onest;font-style:normal;letter-spacing:.2em;text-transform:uppercase;color:var(--cu)}
.ch3 b{display:block;margin-top:16px;font:300 24px/1.2 Unbounded;color:var(--ui-strong)}
.ch3 p{margin:14px 0 0;font:300 15px/1.65 Onest;color:var(--ui-nav)}
.ch3 p a{color:var(--cu);border-bottom:1px solid rgba(200,118,60,.4)}

/* 5. до / после */
.ba{position:relative;aspect-ratio:21/9;margin-top:46px;border-radius:28px;overflow:hidden;cursor:ew-resize;touch-action:pan-y;user-select:none;background:#0b0705}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 62%;pointer-events:none}
.ba .aft{clip-path:inset(0 0 0 50%)}
.bar{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#F5ECE2;pointer-events:none}
.bar::after{content:"⟷";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:var(--cu);color:#fff;display:grid;place-items:center;font:20px Onest;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.tag{position:absolute;top:22px;padding:8px 16px;border-radius:999px;background:rgba(15,10,8,.75);font:12px Onest;letter-spacing:.25em;text-transform:uppercase;color:#F5ECE2}
.tag.l{left:22px}.tag.r{right:22px}

/* 6. почему на фабрике */
.why{display:grid;grid-template-columns:1fr 1fr;margin-top:50px;border-radius:28px;overflow:hidden;border:1px solid var(--ui-line)}
.why figure{margin:0;position:relative;min-height:460px}
.why figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.why .tx{padding:52px 48px;background:var(--ui-card);display:flex;flex-direction:column;justify-content:center}
.why .tx b{display:block;font:200 clamp(30px,2.6vw,42px)/1.1 Unbounded;letter-spacing:-.02em;color:var(--ui-strong)}
.why .tx b em{font-style:normal;color:var(--cu)}
.why .tx p{margin:20px 0 0;font:300 16px/1.75 Onest;color:var(--ui-nav)}

/* 7. шаги */
.proc{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:60px}
.proc::before{content:"";position:absolute;left:0;right:0;top:26px;height:2px;background:var(--ui-line)}
.proc::after{content:"";position:absolute;left:0;top:26px;height:2px;width:var(--p,0%);background:var(--cu);transition:width .2s linear}
.st{position:relative}
.st i{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--ui-page);border:2px solid var(--ui-line);font:300 15px Unbounded;font-style:normal;color:var(--ui-muted);position:relative;z-index:1;transition:all .3s}
.st.on i{border-color:var(--cu);background:var(--cu);color:#fff}
.st b{display:block;font:300 18px/1.25 Unbounded;color:var(--ui-strong);margin:22px 0 8px}
.st p{font:300 14px/1.6 Onest;color:var(--ui-nav);margin:0}

/* 8. текст и вопросы */
.rm-prose{padding-top:140px}
.rm-faq{padding-top:120px}

/* финал */
.fin{position:relative;overflow:hidden;background:#0b0705;margin-top:140px}
.fin>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.fin .ui-wrap{position:relative;padding:130px 20px;text-align:center}
.fin .h2{margin:18px auto 0}
.fin p{margin:20px auto 0;max-width:560px;font:300 18px/1.6 Onest;color:#CFC3B4}
.fin .ui-actions{justify-content:center;margin-top:32px}
.fin small{display:block;margin-top:22px;font:13px Onest;letter-spacing:.2em;text-transform:uppercase;color:var(--cu)}

/* светлая тема */
html[data-theme="light"] .rc,html[data-theme="light"] .rp>div,html[data-theme="light"] .ch3>div,html[data-theme="light"] .why .tx,html[data-theme="light"] .rt{box-shadow:0 10px 30px rgba(60,35,20,.06)}
html[data-theme="light"] .st i{background:var(--ui-page)}
html[data-theme="light"] .st.on i{background:var(--cu);color:#fff}

@media(max-width:900px){
 .rh{min-height:0}.rh .ui-wrap{padding-top:110px;padding-bottom:40px}.rh figcaption{display:none}
 .rcs,.rp,.ch3,.why{grid-template-columns:1fr}.why figure{min-height:260px}.why .tx{padding:32px 26px}
 .ba{aspect-ratio:4/3}.rt{overflow-x:auto}.rt table{min-width:560px}
 .proc{grid-template-columns:1fr;gap:24px}.proc::before,.proc::after{display:none}
 .sec,.rm-prose{padding-top:96px}.rm-faq{padding-top:80px}
 .rp b{font-size:44px}
}
@media(max-width:600px){.h2{font-size:30px!important;overflow-wrap:anywhere}.h1{font-size:40px!important}}