/* ============ ТОКЕНЫ ============ */
:root{
  --paper:#F3F2EF;
  --paper-2:#EDEBE7;
  --ink:#131110;
  --muted:#6E6862;
  --muted-2:#8B857E;
  --line:#DBD7D0;
  --dark:#17130F;
  --dark-2:#221D18;
  --accent:#C8A177;

  --wrap: min(1760px, calc(100% - clamp(24px, 5vw, 80px)));
  --gap: clamp(16px, 1.6vw, 28px);
  --sec-pad: clamp(48px, 6vw, 104px);
  --ease: cubic-bezier(.22,.61,.36,1);
}

.sprite{ position:absolute; width:0; height:0; overflow:hidden; }

/* ============ ПРЕЛОАДЕР ============ */
.pre{
  position:fixed; inset:0; z-index:100;
  background:var(--paper); color:var(--ink);
  display:grid; place-items:center;
  transition:transform 1s cubic-bezier(.76,0,.24,1);
}
.pre.is-done{ transform:translateY(-101%); }
.pre__in{ width:min(1100px, calc(100% - 48px)); }
.pre__word{ position:relative; font-family:'Jost',sans-serif; font-weight:300; font-size:clamp(56px,11vw,160px); line-height:1; letter-spacing:-0.01em; }
.pre__base{ color:rgba(19,17,16,.13); }
.pre__fill{
  position:absolute; inset:0; color:var(--ink);
  clip-path:inset(0 100% 0 0);
  transition:clip-path .25s linear;
}
.pre__meta{
  display:flex; align-items:baseline; justify-content:space-between; gap:20px;
  margin-top:clamp(18px,2.2vw,30px);
  font-size:clamp(10px,0.78vw,12.5px); letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
}
.pre__num{ font-variant-numeric:tabular-nums; color:var(--ink); letter-spacing:.04em; }
.pre__bar{ margin-top:14px; height:1px; background:var(--line); overflow:hidden; }
.pre__bar i{ display:block; height:100%; width:0; background:var(--ink); transition:width .25s linear; }

/* до конца загрузки первый экран ждёт */
body:not(.is-ready) .wordmark__text span,
body:not(.is-ready) .hero__img,
body:not(.is-ready) .hero__title,
body:not(.is-ready) .hero__bottom{ animation-play-state:paused; }
body.is-loading{ overflow:hidden; }

/* ============ БАЗА ============ */
*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none !important; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:clamp(14px,0.95vw,16px);
  line-height:1.5;
  font-weight:400;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; height:auto; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,p,dl,dd,figure,ol{ margin:0; }
ol{ list-style:none; padding:0; }
em{ font-family:'Playfair Display',Georgia,serif; font-style:italic; font-weight:400; font-variant-numeric:lining-nums; }
:focus-visible{ outline:2px solid var(--ink); outline-offset:3px; }
.wrap{ width:var(--wrap); margin-inline:auto; }
.skip{ position:absolute; left:-9999px; }
.skip:focus{ left:16px; top:16px; z-index:100; background:var(--ink); color:#fff; padding:10px 16px; }

/* ============ КНОПКИ / СТРЕЛКИ ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:clamp(12px,1vw,16px) clamp(20px,1.8vw,30px);
  font-size:clamp(12px,0.85vw,14px); font-weight:500;
  letter-spacing:.01em; border-radius:2px;
  transition:background .35s var(--ease), color .35s var(--ease), transform .35s var(--ease);
}
.btn--dark{ background:var(--ink); color:#fff; }
.btn--dark:hover{ background:var(--dark-2); }
.btn--dark:active{ transform:translateY(1px); }
.btn--wide{ width:100%; }

.arrow-link{
  --arw: clamp(38px,3.4vw,54px);
  display:inline-flex; align-items:center;
  width:var(--arw); height:22px; position:relative;
  cursor:pointer; color:var(--ink);
}
.arrow-link__line{ display:block; width:100%; height:1px; background:currentColor; transform-origin:left center; transition:transform .45s var(--ease); }
.arrow-link::after{
  content:''; position:absolute; right:0; top:50%;
  width:8px; height:8px; border-top:1px solid currentColor; border-right:1px solid currentColor;
  transform:translateY(-50%) rotate(45deg); transition:transform .45s var(--ease);
}
.arrow-link:hover .arrow-link__line{ transform:scaleX(1.22); }
.arrow-link:hover::after{ transform:translate(6px,-50%) rotate(45deg); }
.arrow-link--light{ color:#fff; }
.arrow-link--sm{ --arw:26px; height:16px; }
.arrow-link--sm::after{ width:6px; height:6px; }

/* ============ ХЕДЕР ============ */
.hdr{
  position:sticky; top:0; z-index:40;
  background:var(--paper);
  border-bottom:1px solid transparent;
  transition:border-color .4s var(--ease), background .4s var(--ease);
}
.hdr.is-stuck{ border-bottom-color:var(--line); background:rgba(243,242,239,.92); backdrop-filter:blur(10px); }
.hdr__in{
  width:var(--wrap); margin-inline:auto;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:clamp(8px,0.7vw,12px) 0;
}
.hdr__cta{ padding:clamp(9px,0.72vw,12px) clamp(16px,1.35vw,24px); }
.hdr__nav{ display:flex; gap:clamp(18px,2.2vw,38px); font-size:clamp(12px,0.9vw,14px); }
.hdr__nav a{ position:relative; padding-bottom:2px; color:var(--ink); }
.hdr__nav a::after{
  content:''; position:absolute; left:0; bottom:0; width:100%; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:right center;
  transition:transform .4s var(--ease);
}
.hdr__nav a:hover::after{ transform:scaleX(1); transform-origin:left center; }

.burger{ display:none; width:32px; height:24px; position:relative; }
.burger span{ position:absolute; left:4px; right:4px; height:1px; background:var(--ink); transition:transform .35s var(--ease), opacity .25s; }
.burger span:nth-child(1){ top:8px; }
.burger span:nth-child(2){ top:15px; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(3.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ transform:translateY(-3.5px) rotate(-45deg); }

.mobnav{
  position:fixed; inset:var(--hdr-h,50px) 0 0; z-index:39;
  background:var(--paper); padding:32px clamp(24px,6vw,40px);
  display:flex; flex-direction:column; gap:28px;
  animation:fade .3s var(--ease);
}
.mobnav nav{ display:flex; flex-direction:column; gap:20px; font-size:22px; }
@keyframes fade{ from{opacity:0} to{opacity:1} }

/* ============ ЛОГОТИП ============ */
.wordmark{ padding:0 0 clamp(10px,1.4vw,22px); }
.wordmark__text{
  width:var(--wrap); margin-inline:auto;
  font-family:'Jost',system-ui,sans-serif; font-weight:300;
  font-size:min(32.4vw,505px); line-height:.79;
  letter-spacing:-0.004em;
  display:block; white-space:nowrap;
  padding-top:.06em; /* компенсируем сжатый line-height, иначе верх «F» уходит под хедер */
  /* точная ширина под контейнер выставляется в main.js (fitWordmark) */
}
.wordmark__text span{
  display:inline-block;
  opacity:0; transform:translateY(.14em);
  animation:wmIn .95s var(--ease) forwards;
}
.wordmark__text span:nth-child(1){ animation-delay:.05s }
.wordmark__text span:nth-child(2){ animation-delay:.12s }
.wordmark__text span:nth-child(3){ animation-delay:.19s }
.wordmark__text span:nth-child(4){ animation-delay:.26s }
.wordmark__text span:nth-child(5){ animation-delay:.33s }
@keyframes wmIn{ to{ opacity:1; transform:none; } }

/* ============ HERO ============ */
.hero{
  position:relative; overflow:hidden;
  height:clamp(380px,45vw,720px);
  background:var(--dark);
}
.hero__img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; object-position:center 62%;
  animation:heroIn 1.6s var(--ease) both;
}
@keyframes heroIn{ from{ transform:scale(1.06); opacity:.4 } to{ transform:none; opacity:1 } }
.hero__grad{
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(10,8,6,.72) 0%, rgba(10,8,6,.28) 34%, rgba(10,8,6,0) 62%);
}
.hero__in{
  position:absolute; inset:auto 0 0 0;
  width:var(--wrap); margin-inline:auto;
  padding-bottom:clamp(18px,2vw,34px);
  display:flex; flex-direction:column; gap:clamp(14px,1.6vw,26px);
}
.hero__title{
  color:#fff; font-weight:400;
  font-size:clamp(22px,2.45vw,40px); line-height:1.22; letter-spacing:-0.015em;
  animation:up 1s var(--ease) .35s both;
}
.hero__title em{ font-size:1.06em; }
.hero__bottom{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; animation:up 1s var(--ease) .5s both; }
.hero__note{ color:rgba(255,255,255,.82); font-size:clamp(10px,0.78vw,12.5px); line-height:1.4; text-align:right; }
@keyframes up{ from{ opacity:0; transform:translateY(18px) } to{ opacity:1; transform:none } }

/* ============ СЕКЦИИ ============ */
.sec{ padding:var(--sec-pad) 0; border-top:1px solid var(--line); }
.hero + .sec{ border-top:0; }
.label{
  font-size:clamp(9px,0.68vw,11px); letter-spacing:.16em; text-transform:uppercase;
  color:var(--muted); margin-bottom:clamp(26px,3vw,52px);
}
.label span{ color:var(--ink); }
.label--light{ color:rgba(255,255,255,.5); }
.label--light span{ color:#fff; }

/* ---- 01 манифесто ---- */
.manifest__grid{ display:grid; grid-template-columns:1.55fr .85fr; gap:clamp(28px,5vw,90px); align-items:start; }
.manifest__title{
  font-weight:400; font-size:clamp(28px,3.65vw,60px); line-height:1.16; letter-spacing:-0.02em;
}
.manifest__title em{ font-size:1.03em; }
.manifest__aside{ display:flex; flex-direction:column; gap:clamp(20px,2.4vw,38px); padding-top:.5em; }
.manifest__aside p{ color:var(--muted); font-size:clamp(12px,0.92vw,14.5px); line-height:1.62; max-width:34ch; }

/* ---- 02 проекты ---- */
.projects__grid{ display:grid; grid-template-columns:.9fr 2.05fr; gap:clamp(24px,3.4vw,60px); align-items:start; }
.projects__name{ font-weight:400; font-size:clamp(19px,1.63vw,27px); line-height:1.25; letter-spacing:-0.015em; }
.projects__sub{ margin-top:10px; color:var(--muted); font-size:clamp(11px,0.82vw,13px); }
.projects__info > .arrow-link{ margin-top:clamp(16px,1.7vw,26px); }
.spec{ margin-top:clamp(26px,3vw,48px); border-top:1px solid var(--line); }
.spec__row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:clamp(10px,.95vw,15px) 0; border-bottom:1px solid var(--line); }
.spec dt{ color:var(--muted); font-size:clamp(10px,0.76vw,12px); }
.spec dd{ margin:0; font-size:clamp(10px,0.76vw,12px); line-height:1.45; }
.projects__media{ display:block; overflow:hidden; background:var(--dark); padding:0; }
.projects__media img{ width:100%; aspect-ratio:16/9; object-fit:cover; transition:transform 1.1s var(--ease); }
.projects__media:hover img{ transform:scale(1.035); }

/* ---- 03 опыт ---- */
.stats__grid{ display:grid; grid-template-columns:repeat(3,1fr); }
.stat{ text-align:center; padding:clamp(6px,1vw,18px) 12px; }
.stat + .stat{ border-left:1px solid var(--line); }
.stat__ico{
  width:clamp(26px,2.1vw,34px); height:clamp(26px,2.1vw,34px);
  margin:0 auto clamp(12px,1.2vw,20px); display:block;
  fill:currentColor; color:var(--muted);
  transition:color .5s var(--ease), transform .5s var(--ease);
}
.stat.is-in .stat__ico{ color:var(--ink); }
.stat:hover .stat__ico{ transform:translateY(-3px); }
.stat__num{ font-weight:300; font-size:clamp(38px,4.55vw,76px); line-height:1; letter-spacing:-0.03em; font-variant-numeric:tabular-nums; }
.stat__cap{ margin-top:clamp(8px,.8vw,14px); color:var(--muted); font-size:clamp(10px,0.76vw,12.5px); }

/* ---- 04 комнаты ---- */
.rooms__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap); }
.room{ display:block; text-align:left; padding:0; }
.room__media{ display:block; overflow:hidden; background:var(--dark); }
.room__media img{ width:100%; aspect-ratio:4/3.05; object-fit:cover; transition:transform 1.1s var(--ease); }
.room:hover .room__media img{ transform:scale(1.05); }
.room__foot{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding-top:clamp(12px,1.1vw,18px); margin-top:clamp(12px,1.1vw,18px);
  border-top:1px solid var(--line);
}
.room__name{ font-size:clamp(12px,0.95vw,15px); }
.room:hover .arrow-link__line{ transform:scaleX(1.22); }
.room:hover .arrow-link::after{ transform:translate(5px,-50%) rotate(45deg); }

/* ---- 05 материалы ---- */
.materials__grid{ display:grid; grid-template-columns:repeat(5,1fr) 1.05fr; gap:var(--gap); align-items:start; }
.mat{ display:block; padding:0; text-align:left; }
.mat img{ width:100%; aspect-ratio:1; object-fit:cover; transition:transform .9s var(--ease), filter .5s var(--ease); }
.mat:hover img{ transform:scale(1.05); filter:brightness(1.08); }
.mat__name{
  display:block; margin-top:10px; font-size:clamp(9.5px,0.72vw,11.5px);
  color:var(--muted); letter-spacing:.04em;
  opacity:0; transform:translateY(-4px); transition:opacity .4s var(--ease), transform .4s var(--ease);
}
.mat:hover .mat__name, .mat:focus-visible .mat__name{ opacity:1; transform:none; }
.materials__aside{ display:flex; flex-direction:column; gap:clamp(16px,1.8vw,28px); }
.materials__aside p{ color:var(--muted); font-size:clamp(11px,0.82vw,13px); line-height:1.6; }

/* ---- 06 процесс ---- */
.process{ background:var(--dark); color:#fff; padding:clamp(40px,4.6vw,78px) 0; }
.process__grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:clamp(16px,2vw,34px); }
.step{ position:relative; padding-right:clamp(14px,1.6vw,28px); }
.step:not(:last-child)::after{
  content:''; position:absolute; top:.55em; right:clamp(2px,.6vw,10px);
  width:clamp(14px,1.5vw,26px); height:1px; background:rgba(255,255,255,.34);
}
.step:not(:last-child)::before{
  content:''; position:absolute; top:.55em; right:clamp(2px,.6vw,10px);
  width:5px; height:5px; border-top:1px solid rgba(255,255,255,.34); border-right:1px solid rgba(255,255,255,.34);
  transform:translateY(-2px) rotate(45deg);
}
.step__num{ font-weight:300; font-size:clamp(20px,1.85vw,31px); line-height:1; letter-spacing:-0.02em; }
.step__name{ margin-top:clamp(12px,1.2vw,20px); font-weight:500; font-size:clamp(12px,0.92vw,14.5px); display:flex; align-items:center; gap:9px; }
.step__ico{ width:clamp(18px,1.35vw,22px); height:clamp(18px,1.35vw,22px); flex:none; fill:currentColor; color:var(--accent); }
.step__text{ margin-top:6px; color:rgba(255,255,255,.55); font-size:clamp(10px,0.75vw,12px); line-height:1.5; max-width:22ch; }

/* ---- 07 КАЛЬКУЛЯТОР ---- */
.calc__lay{ display:grid; grid-template-columns:1fr .92fr; gap:clamp(28px,4.5vw,84px); align-items:center; }
.calc__title{ font-weight:400; font-size:clamp(30px,3.35vw,56px); line-height:1.14; letter-spacing:-0.022em; }
.calc__title em{ font-size:1.03em; }
.calc__lead{ margin-top:clamp(16px,1.6vw,26px); color:var(--muted); font-size:clamp(13px,1vw,16px); line-height:1.6; max-width:42ch; }
.calc__facts{ margin-top:clamp(22px,2.4vw,38px); display:grid; gap:14px; }
.calc__facts li{
  display:flex; align-items:center; gap:12px;
  font-size:clamp(12px,0.9vw,14.5px); color:var(--ink);
  padding-bottom:14px; border-bottom:1px solid var(--line);
}
.calc__facts svg{ width:20px; height:20px; flex:none; fill:currentColor; color:var(--muted); }

.calc__card{
  background:var(--paper-2); border:1px solid var(--line); border-radius:3px;
  padding:clamp(24px,2.6vw,44px);
  display:grid; gap:clamp(14px,1.3vw,20px);
}
.calc__card-top{
  display:flex; align-items:center; gap:12px;
  padding-bottom:clamp(14px,1.4vw,22px); margin-bottom:4px; border-bottom:1px solid var(--line);
  font-size:clamp(11px,0.82vw,13px); letter-spacing:.12em; text-transform:uppercase; color:var(--muted);
}
.calc__ico{ width:26px; height:26px; fill:currentColor; color:var(--ink); }

/* ---- 08 ЗАЯВКА (тёмный блок) ---- */
.lead{ position:relative; overflow:hidden; background:var(--dark); color:#fff; padding:clamp(56px,6.4vw,110px) 0; }
.lead__bg{
  position:absolute; inset:0;
  background-image:url("/assets/mat-oak.webp");
  background-size:clamp(360px,32vw,560px) auto; background-repeat:repeat;
  opacity:.15; filter:grayscale(.35); pointer-events:none;
}
.lead::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(23,19,15,.97) 42%, rgba(23,19,15,.72) 100%);
}
.lead__lay{ position:relative; z-index:1; display:grid; grid-template-columns:1fr .82fr; gap:clamp(32px,5vw,90px); align-items:center; }
.lead__title{ margin-top:clamp(14px,1.4vw,22px); font-weight:400; font-size:clamp(30px,3.35vw,56px); line-height:1.14; letter-spacing:-0.022em; }
.lead__title em{ font-size:1.03em; }
.lead__text{ margin-top:clamp(16px,1.6vw,26px); color:rgba(255,255,255,.62); font-size:clamp(13px,1vw,16px); line-height:1.6; max-width:44ch; }
.lead__contacts{ margin-top:clamp(26px,2.8vw,44px); display:grid; gap:16px; }
.lead__contacts a, .lead__contacts p{
  display:flex; align-items:center; gap:12px;
  font-size:clamp(12px,0.95vw,15px); color:#fff;
  transition:color .3s var(--ease);
}
.lead__contacts p{ color:rgba(255,255,255,.62); }
.lead__contacts a:hover{ color:var(--accent); }
.lead__contacts svg{ width:20px; height:20px; flex:none; fill:currentColor; color:rgba(255,255,255,.45); }

.lead__card{
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.14); border-radius:3px;
  padding:clamp(24px,2.6vw,44px);
  display:grid; gap:clamp(13px,1.2vw,18px);
  backdrop-filter:blur(6px);
}
.lead__card-title{ font-weight:400; font-size:clamp(18px,1.5vw,26px); letter-spacing:-0.015em; }
.lead__card-sub{ margin-top:-6px; color:rgba(255,255,255,.5); font-size:clamp(11px,0.82vw,13px); }
.lead__policy{ color:rgba(255,255,255,.42); font-size:clamp(10px,0.75vw,12px); line-height:1.5; }
.field{ display:block; position:relative; }
.field__lbl{ position:absolute; left:-9999px; }
.field select,.field input{
  width:100%; height:clamp(44px,3.4vw,54px);
  padding:0 16px; font:inherit; font-size:clamp(12px,0.85vw,14px);
  color:var(--ink); background-color:transparent;
  border:1px solid var(--line); border-radius:2px;
  transition:border-color .3s var(--ease), background .3s var(--ease);
  appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%238B857E' stroke-width='1.3'/></svg>");
  background-repeat:no-repeat; background-position:right 16px center; background-size:12px 8px;
  padding-right:40px; color:var(--muted);
}
.field select:valid{ color:var(--ink); }
.field input::placeholder{ color:var(--muted); }
.field select:hover,.field input:hover{ border-color:#c3beb5; }
.field select:focus,.field input:focus{ outline:none; border-color:var(--ink); background-color:#fff; }
.field.is-err select,.field.is-err input{ border-color:#B4462F; }

/* ---- кастомный выпадающий список ---- */
.sel{ position:relative; }
.sel__native{ position:absolute; inset:0; width:100%; height:100%; opacity:0; pointer-events:none; }
.sel__btn{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  width:100%; height:clamp(44px,3.4vw,54px); padding:0 16px;
  font-size:clamp(12px,0.85vw,14px); text-align:left; color:var(--ink);
  background-color:transparent; border:1px solid var(--line); border-radius:2px;
  transition:border-color .3s var(--ease), background-color .3s var(--ease);
}
.sel__btn:hover{ border-color:#b7b1a8; }
.sel.is-open .sel__btn{ border-color:var(--ink); background-color:#fff; }
.sel__val{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sel__val.is-placeholder{ color:var(--muted); }
.sel__caret{ flex:none; width:12px; height:8px; transition:transform .35s var(--ease); }
.sel__caret path{ stroke:var(--muted); }
.sel.is-open .sel__caret{ transform:rotate(180deg); }

.sel__list{
  position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:25;
  padding:6px; border:1px solid var(--line); border-radius:2px;
  background:var(--paper); box-shadow:0 22px 44px -20px rgba(20,16,12,.34);
  opacity:0; visibility:hidden; transform:translateY(-10px) scaleY(.97); transform-origin:top center;
  transition:opacity .3s var(--ease), transform .34s var(--ease), visibility 0s .34s;
}
.sel.is-open .sel__list{ opacity:1; visibility:visible; transform:none; transition-delay:0s; }
.sel.is-up .sel__list{ top:auto; bottom:calc(100% + 6px); transform-origin:bottom center; }

.sel__opt{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  width:100%; padding:11px 12px; border-radius:2px;
  font-size:clamp(12px,0.85vw,14px); color:var(--ink); text-align:left;
  opacity:0; transform:translateY(-8px);
  transition:opacity .34s var(--ease), transform .34s var(--ease), background-color .2s var(--ease);
}
.sel.is-open .sel__opt{ opacity:1; transform:none; }
.sel.is-open .sel__opt:nth-child(1){ transition-delay:.05s,.05s,0s }
.sel.is-open .sel__opt:nth-child(2){ transition-delay:.09s,.09s,0s }
.sel.is-open .sel__opt:nth-child(3){ transition-delay:.13s,.13s,0s }
.sel.is-open .sel__opt:nth-child(4){ transition-delay:.17s,.17s,0s }
.sel.is-open .sel__opt:nth-child(5){ transition-delay:.21s,.21s,0s }
.sel.is-open .sel__opt:nth-child(6){ transition-delay:.25s,.25s,0s }
.sel__opt:hover,.sel__opt.is-active{ background-color:var(--paper-2); }
.sel__opt.is-sel{ font-weight:500; }
.sel__opt.is-sel::after{ content:''; width:5px; height:5px; border-radius:50%; background:var(--ink); flex:none; }
.field.is-err .sel__btn{ border-color:#B4462F; }

/* крупный вариант */
.field--lg .sel__btn{ height:clamp(52px,4vw,64px); padding:0 20px; font-size:clamp(13px,0.95vw,15px); background-color:var(--paper); }
.field--lg .sel__opt{ padding:13px 16px; font-size:clamp(13px,0.95vw,15px); }

/* на тёмном фоне */
.sel--dark .sel__btn{ background-color:rgba(255,255,255,.05); border-color:rgba(255,255,255,.18); color:#fff; }
.sel--dark .sel__val.is-placeholder{ color:rgba(255,255,255,.62); }
.sel--dark .sel__caret path{ stroke:rgba(255,255,255,.6); }
.sel--dark .sel__btn:hover{ border-color:rgba(255,255,255,.4); }
.sel--dark.is-open .sel__btn{ border-color:#fff; background-color:rgba(255,255,255,.1); }
.sel--dark .sel__list{ background:#241F1A; border-color:rgba(255,255,255,.16); box-shadow:0 24px 50px -18px rgba(0,0,0,.6); }
.sel--dark .sel__opt{ color:rgba(255,255,255,.86); }
.sel--dark .sel__opt:hover,.sel--dark .sel__opt.is-active{ background-color:rgba(255,255,255,.09); color:#fff; }
.sel--dark .sel__opt.is-sel::after{ background:#fff; }
.field--dark.is-err .sel__btn{ border-color:#E08C77; }

/* крупные поля в блоках 07–08 */
.field--lg select,.field--lg input{ height:clamp(52px,4vw,64px); padding:0 20px; font-size:clamp(13px,0.95vw,15px); background-color:var(--paper); }
.field--lg select{ padding-right:44px; background-position:right 20px center; }
.btn--lg{ height:clamp(52px,4vw,64px); font-size:clamp(13px,0.92vw,15px); }
.btn--light{ background:#fff; color:var(--ink); }
.btn--light:hover{ background:var(--paper-2); }

/* поля на тёмном фоне */
.field--dark select,.field--dark input{
  background-color:rgba(255,255,255,.05); border-color:rgba(255,255,255,.18); color:#fff;
}
.field--dark input::placeholder{ color:rgba(255,255,255,.45); }
.field--dark select{ color:rgba(255,255,255,.45); background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='1.3'/></svg>"); }
.field--dark select:valid{ color:#fff; }
.field--dark select option{ color:var(--ink); }
.field--dark select:hover,.field--dark input:hover{ border-color:rgba(255,255,255,.34); }
.field--dark select:focus,.field--dark input:focus{ border-color:#fff; background-color:rgba(255,255,255,.1); }
.field--dark.is-err select,.field--dark.is-err input{ border-color:#E08C77; }

.calc__out{
  display:block; margin-top:clamp(18px,2vw,30px);
  padding:clamp(18px,1.8vw,28px) clamp(18px,2vw,32px);
  background:var(--paper-2); border-left:2px solid var(--ink);
  animation:up .5s var(--ease) both;
}
.calc__out b{ display:block; font-weight:400; font-size:clamp(20px,1.85vw,32px); letter-spacing:-0.02em; }
.calc__out small{ display:block; margin-top:8px; color:var(--muted); font-size:clamp(11px,0.8vw,13px); line-height:1.55; }
.calc__card .calc__out{ background:#fff; }
.calc__out--dark{ background:rgba(255,255,255,.07); border-left-color:#fff; color:#fff; }
.calc__out--dark small{ color:rgba(255,255,255,.55); }

/* ============ ФУТЕР ============ */
.ftr{ border-top:1px solid var(--line); padding:clamp(11px,1vw,16px) 0; }
.ftr__in{ display:flex; align-items:center; justify-content:space-between; gap:20px; }
.ftr__nav{ display:flex; gap:clamp(16px,2.2vw,38px); font-size:clamp(11px,0.82vw,13px); }
.ftr__nav a:hover{ color:var(--muted); }
.ftr__copy{ color:var(--muted); font-size:clamp(10px,0.76vw,12.5px); }
.ftr__soc{ display:flex; gap:10px; }
.ftr__soc a{
  display:grid; place-items:center; width:clamp(28px,2.1vw,32px); aspect-ratio:1;
  border:1px solid var(--line); border-radius:2px; color:var(--ink);
  transition:background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}
.ftr__soc a:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }

/* ============ МОДАЛКА ============ */
.modal{ position:fixed; inset:0; z-index:60; display:grid; place-items:center; padding:clamp(12px,2.5vw,40px); }
.modal__backdrop{ position:absolute; inset:0; background:rgba(12,10,8,.72); backdrop-filter:blur(3px); animation:fade .35s var(--ease); }
.modal__card{
  position:relative; width:min(1120px,100%); max-height:min(88vh,900px);
  overflow-y:auto; background:var(--paper); border-radius:3px;
  animation:modalIn .45s var(--ease) both;
}
@keyframes modalIn{ from{ opacity:0; transform:translateY(22px) scale(.99) } to{ opacity:1; transform:none } }
.modal__x{
  position:sticky; top:0; margin-left:auto; z-index:2;
  display:grid; place-items:center; width:52px; height:52px;
  color:var(--ink); background:var(--paper);
  transition:opacity .3s;
}
.modal__x:hover{ opacity:.55; }
.modal__body{ padding:0 clamp(20px,3vw,48px) clamp(28px,3vw,48px); margin-top:-52px; }
.m-head{ padding-top:clamp(26px,3vw,44px); padding-right:56px; }
.m-label{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.m-title{ margin-top:12px; font-weight:400; font-size:clamp(22px,2.3vw,38px); line-height:1.16; letter-spacing:-0.02em; }
.m-text{ margin-top:14px; color:var(--muted); font-size:clamp(12px,0.9vw,14.5px); line-height:1.6; max-width:62ch; }
.m-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:var(--gap); margin-top:clamp(22px,2.4vw,36px); }
.m-grid img{ width:100%; height:auto; object-fit:cover; aspect-ratio:4/3; background:var(--dark); }
.m-grid figure{ margin:0; display:flex; flex-direction:column; }
.m-grid figcaption{ margin-top:10px; font-size:12px; color:var(--muted); }
.m-tall img{ aspect-ratio:4/5; }
.m-grid--one{ grid-template-columns:1fr; }
.m-grid--one img{ aspect-ratio:16/10; }
.m-sub{ margin-top:clamp(22px,2.4vw,34px); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.m-swatches{ display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:var(--gap); margin-top:14px; }
.m-swatches figure{ margin:0; }
.m-swatches img{ width:100%; aspect-ratio:1; object-fit:cover; }
.m-swatches figcaption{ margin-top:8px; font-size:11.5px; color:var(--muted); }
.m-list{ margin-top:clamp(20px,2.2vw,32px); border-top:1px solid var(--line); }
.m-list div{ display:flex; justify-content:space-between; gap:16px; padding:13px 0; border-bottom:1px solid var(--line); font-size:clamp(11px,0.85vw,13.5px); }
.m-list span:first-child{ color:var(--muted); }
.m-cta{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:clamp(22px,2.4vw,34px); }
.m-form{ display:grid; grid-template-columns:1fr 1fr; gap:var(--gap); margin-top:clamp(20px,2.2vw,32px); }
.m-form .field:nth-child(3), .m-form .btn, .m-form .m-note{ grid-column:1/-1; }
.m-note{ color:var(--muted); font-size:12px; line-height:1.55; }
.m-ok{ margin-top:24px; padding:24px; background:var(--paper-2); border-left:2px solid var(--ink); animation:up .45s var(--ease) both; }
.m-ok b{ font-weight:500; font-size:18px; }
.m-ok small{ display:block; margin-top:6px; color:var(--muted); font-size:13px; }
body.is-locked{ overflow:hidden; }

/* ============ REVEAL ============ */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .85s var(--ease), transform .85s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
.rooms__grid .reveal:nth-child(2), .materials__grid .reveal:nth-child(2){ transition-delay:.07s }
.rooms__grid .reveal:nth-child(3), .materials__grid .reveal:nth-child(3){ transition-delay:.14s }
.rooms__grid .reveal:nth-child(4), .materials__grid .reveal:nth-child(4){ transition-delay:.21s }
.materials__grid .reveal:nth-child(5){ transition-delay:.28s }
.materials__grid .reveal:nth-child(6){ transition-delay:.35s }
.process__grid .reveal:nth-child(2){ transition-delay:.07s }
.process__grid .reveal:nth-child(3){ transition-delay:.14s }
.process__grid .reveal:nth-child(4){ transition-delay:.21s }
.process__grid .reveal:nth-child(5){ transition-delay:.28s }
.stats__grid .reveal:nth-child(2){ transition-delay:.09s }
.stats__grid .reveal:nth-child(3){ transition-delay:.18s }

/* ============ АДАПТИВ ============ */
/* ultra-wide: hero не растягиваем сверх исходника — уводим в общий контейнер */
@media (min-width:1700px){
  .hero{ width:var(--wrap); margin-inline:auto; }
}

@media (max-width:1180px){
  .materials__grid{ grid-template-columns:repeat(5,1fr); }
  .materials__aside{ grid-column:1/-1; flex-direction:row; align-items:center; justify-content:space-between; gap:24px; }
  .materials__aside p{ max-width:60ch; }
}
@media (max-width:900px){
  .hdr__nav, .hdr__cta{ display:none; }
  .burger{ display:block; }
  .hdr__in{ justify-content:flex-end; }
  .hero{ height:clamp(400px,72vw,560px); }
  .hero__title{ font-size:clamp(22px,4.6vw,34px); }
  .hero__note{ font-size:11px; }
  .manifest__grid, .projects__grid, .calc__lay, .lead__lay{ grid-template-columns:1fr; }
  .calc__lay, .lead__lay{ gap:clamp(26px,4vw,44px); }
  .manifest__title{ font-size:clamp(27px,5.4vw,42px); }
  .projects__media img{ aspect-ratio:16/10; }
  .rooms__grid{ grid-template-columns:repeat(2,1fr); gap:clamp(14px,3vw,24px); }
  .process__grid{ grid-template-columns:repeat(2,1fr); gap:26px 20px; }
  .step:not(:last-child)::after, .step:not(:last-child)::before{ display:none; }
  .calc__card, .lead__card{ padding:clamp(20px,4vw,32px); }
  .m-form{ grid-template-columns:1fr; }
  .ftr__in{ flex-wrap:wrap; justify-content:center; text-align:center; gap:10px 16px; }
  .ftr__nav{ gap:18px; }
  .ftr__nav{ order:1; width:100%; justify-content:center; }
  .ftr__copy{ order:3; width:100%; }
  .ftr__soc{ order:2; }
}
@media (max-width:640px){
  .wordmark__text{ font-size:24vw; letter-spacing:-0.01em; }
  .rooms__grid{ grid-template-columns:1fr; }
  .room__media img{ aspect-ratio:4/3.4; }
  .materials__grid{ grid-template-columns:repeat(3,1fr); }
  .materials__aside{ flex-direction:column; align-items:flex-start; }
  .mat__name{ opacity:1; transform:none; }
  .process__grid{ grid-template-columns:1fr; gap:22px; }
  .stats__grid{ grid-template-columns:1fr; }
  .stat + .stat{ border-left:0; border-top:1px solid var(--line); }
  .stat{ padding:20px 0; }
  .calc__title, .lead__title{ font-size:clamp(26px,6.4vw,34px); }
  .spec__row{ grid-template-columns:.8fr 1fr; }
  .hero__title{ font-size:22px; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
}