@font-face{font-family:"Spectral";src:url(../fonts/Spectral-400-cyrillic.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Spectral";src:url(../fonts/Spectral-400-latin.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:"Spectral";src:url(../fonts/Spectral-500-cyrillic.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Spectral";src:url(../fonts/Spectral-500-latin.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:"Spectral";src:url(../fonts/Spectral-400i-cyrillic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Spectral";src:url(../fonts/Spectral-400i-latin.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:"Golos";src:url(../fonts/GolosText-400-cyrillic.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos";src:url(../fonts/GolosText-400-latin.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:"Golos";src:url(../fonts/GolosText-500-cyrillic.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos";src:url(../fonts/GolosText-500-latin.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:"Golos";src:url(../fonts/GolosText-600-cyrillic.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos";src:url(../fonts/GolosText-600-latin.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2212}

:root{
  --bg:#EFF2EE; --white:#FFFFFF; --ink:#22302A; --ink2:#4C5A53; --sage:#8E9A92; --line:#D7DDD8;
  --cocoa:#5E3427; --cocoa-h:#4A281D; --dark:#22302A; --on-dark:#EEF1EC;
  --pad:5vw; --r:24px;
  --serif:"Spectral",Georgia,serif; --sans:"Golos",-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-variant-numeric:lining-nums;background:var(--bg);color:var(--ink);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
.wrap{padding:0 var(--pad)}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--cocoa);color:#fff;text-decoration:none;border-radius:999px;font:500 18px/1 var(--sans);padding:0 34px;height:58px;transition:background .2s}
.btn:hover{background:var(--cocoa-h)}
.link{text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
h2{font:400 clamp(36px,3.6vw,56px)/1.08 var(--serif);letter-spacing:-.015em;max-width:16em}
.sec{padding:112px 0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:56px}
.sec-head p{max-width:34em;color:var(--ink2)}

/* шапка */
.hdr{position:sticky;top:0;z-index:20;background:rgba(239,242,238,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;height:72px;gap:2.6vw}
.logo{display:flex;align-items:center;gap:14px;text-decoration:none;flex:none}
.logo img{width:54px;height:54px;border-radius:50%}
.logo span{font:400 40px/1 var(--serif);letter-spacing:-.01em}
.nav{display:flex;gap:2.2vw;margin-left:auto;margin-right:auto}
.nav a{text-decoration:none;font-size:16px;color:var(--ink)}
.nav a:hover{color:var(--cocoa)}
.hdr .tel{text-decoration:none;font-size:18px}
.hdr .btn{height:46px;font-size:16px;padding:0 26px}
.burger{display:none}

/* первый экран: замеры с concepts/out/h3.png (кадр 1536) */
.hero{position:relative;min-height:calc(66.67vw - 72px);padding-top:12.6vw;overflow:hidden}
.hero h1{position:relative;z-index:2;font:400 4.55vw/1.14 var(--serif);letter-spacing:-.02em;max-width:50vw}
.hero .lead{margin-top:2.3vw;font-size:1.43vw;line-height:1.5;max-width:40vw;color:var(--ink)}
.hero .acts{display:flex;align-items:center;gap:2.3vw;margin-top:3.3vw}
.hero .btn{height:4.36vw;padding:0 2.6vw;font-size:1.37vw;min-height:52px}
.hero .acts .link{font-size:1.37vw}
.hero .proof{margin-top:2.6vw;font-size:1.2vw;color:var(--ink2)}
.ring{position:absolute;border-radius:50%;overflow:hidden;background:#cfd5cf}
.ring img{width:100%;height:100%;object-fit:cover}
.ring.big{width:49vw;height:49vw;left:48.2vw;top:5.2vw}
.ring.big img{object-position:46% 50%}
.ring.small{width:23.6vw;height:23.6vw;left:41.4vw;top:32vw;border:.55vw solid var(--bg)}
.ring.small img{object-position:30% 50%}
.sticker{position:absolute;left:82vw;top:5.2vw;width:14vw;height:14vw;border-radius:50%;background:var(--cocoa);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.25;font-size:1.05vw}
.sticker b{font:500 4.2vw/1 var(--serif);margin-bottom:.5vw}

/* 02 цены «всё включено» */
.incl{background:var(--white)}
.incl-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:start}
.incl-photo{border-radius:var(--r);overflow:hidden;aspect-ratio:4/3}
.incl-photo img{width:100%;height:100%;object-fit:cover}
.incl-text{margin-top:28px;color:var(--ink2);max-width:30em}
.plist{list-style:none;border-top:1px solid var(--line)}
.plist li{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:22px 0;border-bottom:1px solid var(--line)}
.plist .n{font:400 28px/1.15 var(--serif)}
.plist .n small{display:block;font:400 15px/1.4 var(--sans);color:var(--ink2);margin-top:6px}
.plist .p{font:500 24px/1 var(--sans);color:var(--cocoa)}
.incl .note{margin-top:28px;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.incl .note p{color:var(--ink2);max-width:28em}

/* 03 мастера */
.masters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.master{background:var(--white);border-radius:var(--r);padding:32px 28px;display:flex;flex-direction:column}
.master .ini{width:56px;height:56px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;font:400 28px/1 var(--serif);color:var(--cocoa);margin-bottom:22px}
.master h3{font:400 30px/1.1 var(--serif)}
.master .role{font-size:15px;color:var(--ink2);margin-top:6px}
.master q{display:block;margin-top:22px;font:italic 400 21px/1.35 var(--serif);quotes:"«" "»"}
.master .who{margin-top:auto;padding-top:18px;font-size:14px;color:var(--ink2)}
.works{display:flex;gap:16px;overflow-x:auto;margin-top:40px;padding-bottom:8px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.works img{flex:none;width:calc((100% - 5*16px)/6);aspect-ratio:3/4;object-fit:cover;border-radius:16px;scroll-snap-align:start}

/* 04 визит */
.visit{background:var(--white)}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;counter-reset:s}
.step img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r)}
.step h3{font:400 26px/1.15 var(--serif);margin-top:22px;display:flex;gap:12px}
.step h3::before{counter-increment:s;content:counter(s);font:500 15px/1.9 var(--sans);color:var(--cocoa)}
.step p{margin-top:10px;color:var(--ink2);font-size:16px}
.visit blockquote{margin-top:56px;font:italic 400 clamp(26px,2.4vw,36px)/1.3 var(--serif);max-width:24em}
.visit blockquote cite{display:block;margin-top:12px;font:400 15px/1.4 var(--sans);font-style:normal;color:var(--ink2)}

/* 05 остальное */
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:32px}
.tabs button{font:500 16px/1 var(--sans);border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:14px 22px;cursor:pointer}
.tabs button[aria-selected=true]{background:var(--ink);color:var(--on-dark);border-color:var(--ink)}
.panel{display:none}.panel.on{display:block}
.panel .plist{columns:2;column-gap:64px;border-top:0}
.panel .plist li{break-inside:avoid;border-top:1px solid var(--line);border-bottom:0}
.panel .plist .n{font:500 20px/1.3 var(--sans)}
.panel .plist .p{font-size:20px}
.more{margin-top:32px}

/* 06 отзывы */
.revs{background:var(--white)}
.rgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.rev{background:var(--bg);border-radius:var(--r);padding:32px;display:flex;flex-direction:column}
.rev p{font-size:16px;line-height:1.6}
.rev footer{margin-top:auto;padding-top:22px;display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--ink2)}
.rev footer b{color:var(--ink);font-weight:500}
.revs .more{display:inline-block}

/* 07 запись */
.book{background:var(--dark);color:var(--on-dark)}
.book-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:stretch}
.book h2{color:#fff}
.book .intro{margin-top:20px;color:#C9D1CB;max-width:30em}
.book .btn{margin-top:36px;background:#fff;color:var(--ink)}
.book .btn:hover{background:#E5E9E4}
.chan{list-style:none;margin-top:44px;border-top:1px solid #3D4B44}
.chan li{display:flex;justify-content:space-between;gap:24px;padding:16px 0;border-bottom:1px solid #3D4B44}
.chan span{color:#AEB9B2}
.chan a{text-decoration:none}
.chan a:hover{text-decoration:underline}
.perks{margin-top:28px;font-size:15px;color:#AEB9B2;max-width:34em}
.where{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:16px}
.where .map{border-radius:var(--r);overflow:hidden;display:block;min-height:320px;background:#cfd5cf}
.where .map img{width:100%;height:100%;object-fit:cover}
.where .addr{display:flex;gap:16px;align-items:center}
.where .addr img{width:120px;height:90px;object-fit:cover;border-radius:12px;flex:none}

.ftr{padding:40px 0 120px;font-size:14px;color:var(--ink2)}
.ftr .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.tag{position:fixed;right:16px;bottom:16px;z-index:30;background:rgba(34,48,42,.86);color:#fff;font-size:12px;padding:8px 12px;border-radius:999px;text-decoration:none}
.dock{display:none}

@media (max-width:1100px){
  .nav{display:none}
  .masters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .works img{width:calc((100% - 3*16px)/4)}
}
@media (max-width:760px){
  .hero h1 br{display:none}
  :root{--pad:20px;--r:20px}
  body{font-size:16px}
  .sec{padding:72px 0}
  .sec-head{display:block;margin-bottom:32px}
  .sec-head p{margin-top:14px}
  .hdr .wrap{height:60px;gap:12px}
  .logo img{width:40px;height:40px}.logo span{font-size:30px}
  .hdr .tel,.hdr .btn{display:none}
  .burger{display:flex;margin-left:auto;width:44px;height:44px;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--line);text-decoration:none}
  .hero{min-height:0;padding:28px var(--pad) 8px;display:flex;flex-direction:column}
  .hero h1{font-size:clamp(32px,9.4vw,42px);max-width:none;line-height:1.06}
  .hero .lead{font-size:16px;max-width:none;margin-top:14px}
  .hero .art{position:relative;width:100%;aspect-ratio:1/1;margin-top:20px;order:0}
  .ring.big{width:84%;height:84%;left:16%;top:0}
  .ring.small{width:42%;height:42%;left:0;top:56%;border-width:5px}
  .sticker{left:auto;right:-2%;top:-3%;width:30%;height:30%;font-size:11px}
  .sticker b{font-size:32px;margin-bottom:4px}
  .hero .acts{flex-direction:column;align-items:stretch;gap:14px;margin-top:22px}
  .hero .btn{height:56px;font-size:17px}
  .hero .acts .link{font-size:17px;align-self:center}
  .hero .proof{font-size:14px;text-align:center;margin-top:14px}
  .incl-grid,.book-grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .plist .n{font-size:24px}.plist .p{font-size:20px}
  .masters,.steps,.rgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-right:calc(-1*var(--pad));padding-right:var(--pad)}
  .master,.rev{flex:none;width:calc(100% - 24px);scroll-snap-align:start}
  .step{flex:none;width:calc(78% - 12px);scroll-snap-align:start}
  .works img{width:calc((100% - 16px)/2.2)}
  .panel .plist{columns:1}
  .tabs{flex-wrap:nowrap;overflow-x:auto;margin-right:calc(-1*var(--pad))}
  .tabs button{flex:none}
  .chan li{flex-direction:column;gap:2px}
  .where .map{min-height:240px}
  .dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:25;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(239,242,238,.96);border-top:1px solid var(--line)}
  .dock .btn{flex:1;height:52px;font-size:16px}
  .dock .call{width:52px;height:52px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;text-decoration:none;flex:none}
  .tag{bottom:84px;right:12px}
  .ftr{padding-bottom:110px}
}
@media (min-width:761px){.hero .art{position:static}}