/* ИТС, зуботехническая лаборатория. Светлый минимализм, цвета от логотипа (шалфей #A8CFB0 + чёрный).
   29.10.2026 лаборатория выбрала вариант 4 «светлее и мягче» (Ольга), кнопки тёмные и контрастные (Катерина).
   Пути к шрифтам относительные: сайт живёт и в /p/its/ (черновик), и в корне домена. */
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('../fonts/manrope-cyrillic.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('../fonts/manrope-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('../fonts/manrope-ruble.woff2') format('woff2');unicode-range:U+20BD}

:root{
  --ink:#26312b;       /* основной текст, мягче чёрного: 13:1 на фоне */
  --ink-2:#3a4741;
  --muted:#5e6d65;     /* второстепенный текст, контраст > 5:1 на фоне и на --bg-soft */
  --line:#e6eee8;
  --bg:#fbfcf9;        /* тёплый белый */
  --bg-soft:#f2f7f3;
  --sage:#a8cfb0;      /* цвет круга в логотипе */
  --sage-soft:#ebf5ee;
  --green:#2f7a4f;     /* ссылки и кнопки: тёмные, белый текст 5:1 (Катерина 29.10: «темнее кнопки, более контрастные») */
  --green-dk:#21593a;
  --accent-soft:#4f9370; /* светлый зелёный ТОЛЬКО для крупного текста (заголовок, цифры): 3.3+ при норме 3 */
  --dark:#101612;      /* рамки фото: работы сняты на чёрном фоне */
  --radius:22px;
  --radius-sm:14px;
  --shadow:0 1px 2px rgba(38,49,43,.03),0 10px 30px rgba(38,49,43,.05);
  --wrap:1180px;
  --hdr:72px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 12px);-webkit-text-size-adjust:100%}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('../fonts/inter-cyrillic.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('../fonts/inter-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-feature-settings:'lnum' 1;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--green);text-underline-offset:3px}
a:hover{color:var(--green-dk)}
h1,h2,h3{line-height:1.15;letter-spacing:-.02em;margin:0;font-weight:700}
h1,h2{font-weight:800;letter-spacing:-.03em}
h3{font-weight:750}  /* 25.10.2026 Алексей: заголовки и крючки жирнее */
h1{font-size:clamp(34px,5vw,64px);letter-spacing:-.035em;line-height:1.02}
h2{font-size:clamp(28px,3.4vw,44px);letter-spacing:-.03em}
h1,h2,h3{text-wrap:balance}
h3{font-size:19px;letter-spacing:-.01em}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:20px;padding-right:20px}
.sec{padding-top:104px;padding-bottom:104px;position:relative}
.sec--soft{background:var(--bg-soft)}
.sec__head{max-width:760px;margin-bottom:40px}
.sec__head p{color:var(--muted);font-size:17px;margin:14px 0 0}
.kicker{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--green);margin-bottom:14px}
.kicker::before{content:'';width:22px;height:2px;background:var(--sage);border-radius:2px}
.muted{color:var(--muted)}
/* Ссылка «Перейти к содержанию»: до фокуса не занимает места и не создаёт прокрутку вправо (линтер gate 34) */
.skip{position:absolute;left:8px;top:8px;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;background:var(--ink);color:#fff;border-radius:8px;z-index:100}
.skip:focus{width:auto;height:auto;padding:10px 14px;overflow:visible;clip-path:none}

/* Кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 26px;border-radius:999px;font:inherit;font-weight:700;font-size:16px;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background .2s,color .2s,border-color .2s,transform .2s}
.btn--main{background:var(--green);color:#fff}
.btn--main:hover{background:var(--green-dk);color:#fff}
.btn--ghost{background:rgba(255,255,255,.6);color:var(--ink);border-color:#d3e2d7}
.btn--ghost:hover{border-color:var(--green);color:var(--green)}
.btn svg{width:18px;height:18px;flex:none}
/* Фокус: контраст кольца к фону не ниже 3:1 (линтер gate 26a). Шалфей #a8cfb0 давал 1.67,
   поэтому на светлом рисуем тёмно-зелёным #21593a (7.98), в тёмных секциях и подвале шалфеем (12:1). */
:focus-visible{outline:3px solid var(--green-dk);outline-offset:3px;border-radius:6px}
.sec--dark :focus-visible,.ftr :focus-visible,.lb :focus-visible{outline-color:var(--sage)}

/* Шапка: фон с размытием на ::before, чтобы не ломать fixed-меню на телефоне */
.hdr{position:sticky;top:0;z-index:50;height:var(--hdr)}
.hdr::before{content:'';position:absolute;inset:0;background:rgba(251,252,249,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line);z-index:-1}
.hdr__in{height:100%;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);flex:none}
.brand img{width:44px;height:44px}
.brand b{display:block;font-family:'Inter','Manrope',sans-serif;font-size:20px;font-weight:900;letter-spacing:.06em;line-height:1.05}
.brand>span>span{display:block;font-size:11.5px;color:var(--muted);line-height:1.25;letter-spacing:.005em}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{color:var(--ink-2);text-decoration:none;font-weight:600;font-size:15px;padding:8px 12px;border-radius:999px}
.nav a:hover{background:var(--bg-soft);color:var(--ink)}
.hdr__tel{font-weight:700;color:var(--ink);text-decoration:none;white-space:nowrap;font-size:15px}
.hdr .btn{min-height:42px;padding:8px 18px;font-size:15px;white-space:nowrap}
.burger{display:none;margin-left:auto;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;align-items:center;justify-content:center}
.burger svg{width:22px;height:22px}
.nav .nav__tel{display:none}

/* Первый экран: должен влезать в 1280x720 целиком */
.hero{padding-top:40px;padding-bottom:56px}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center}
.hero__grid>*{min-width:0}
.hero__badge{display:inline-flex;align-items:center;gap:8px;background:var(--sage-soft);color:var(--green-dk);border-radius:999px;padding:6px 14px;font-size:13.5px;font-weight:800;margin-bottom:20px}
.hero__badge i{width:8px;height:8px;border-radius:50%;background:var(--green);display:block}
.hero h1{margin-bottom:18px}
.hero h1 em{font-style:normal;color:var(--accent-soft)}
.hero__lead{font-size:18px;color:var(--ink-2);max-width:600px;margin-bottom:28px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}
.facts{display:flex;flex-wrap:wrap;gap:10px 22px;padding:0;margin:0;list-style:none;font-size:14.5px;color:var(--muted)}
.facts li{display:flex;align-items:center;gap:8px}
.facts svg{width:18px;height:18px;color:var(--green);flex:none}
/* Карусель первого экрана (29.10.2026, вариант 4 + просьба Катерины «крупные, но листались»): одно крупное фото,
   смена наплывом. Без горизонтальной прокрутки: лента со scroll-snap залипает на трекпаде Мака (guide_frontend_gotchas).
   Снимки широкие и крупные: рамка 3:2 почти родная, коронки внизу кадра, поэтому object-position по низу. */
.hshow{position:relative}
.hshow__frame{position:relative;border-radius:var(--radius);overflow:hidden;background:#fff;padding:clamp(10px,1.3vw,16px);aspect-ratio:3/2;box-shadow:0 18px 40px rgba(38,49,43,.10);touch-action:pan-y}
.hshow__s{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s linear .8s}
.hshow__s.on{opacity:1;visibility:visible;transition:opacity .8s ease,visibility 0s}
.hshow__s img{width:100%;height:100%;object-fit:contain;object-position:50% 50%;transform:scale(1.02);transition:transform 6s ease-out}
.hshow__s.on img{transform:none}
.hshow__s figcaption{position:absolute;left:16px;bottom:14px;right:16px;color:#fff;font-size:13.5px;font-weight:600;line-height:1.3;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.hshow__bar{display:flex;align-items:center;gap:8px;margin-top:12px}
.hshow__dots{display:flex;gap:2px;margin-right:auto}
.hshow__dots button{width:28px;height:28px;padding:0;border:0;background:none;cursor:pointer;display:grid;place-items:center}
.hshow__dots button::before{content:'';width:8px;height:8px;border-radius:4px;background:#c9d8ce;transition:width .3s ease,background-color .3s ease}
.hshow__dots button[aria-current=true]::before{width:22px;background:var(--green)}
.hshow__btn,.hshow__pp{width:42px;height:42px;border-radius:50%;border:1px solid #d3e2d7;background:#fff;color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;transition:border-color .2s,color .2s}
.hshow__btn:hover,.hshow__pp:hover{border-color:var(--green);color:var(--green)}
.hshow__btn svg,.hshow__pp svg{width:20px;height:20px}
.hshow__pp[aria-pressed=false] svg+svg,.hshow__pp[aria-pressed=true] svg:first-child{display:none}
.hshow__pp[hidden]{display:none}   /* display:grid выше перебивал hidden: при reduce кнопка была видна и запускала автолистание */

/* Преимущества */
.grid{display:grid;gap:18px}
.grid>*{min-width:0}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.card h3{margin-bottom:8px}
.card p{color:var(--muted);margin:0}
.ico{width:48px;height:48px;border-radius:14px;background:var(--sage-soft);color:var(--green);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.ico svg{width:24px;height:24px}

/* Оживающие иконки преимуществ (блок 24 библиотеки WCL): линии прорисовываются, когда карточка появляется (.rv.in),
   при наведении двигается своя деталь. Без библиотек и без отдельного наблюдателя. */
.feat .ico svg{overflow:visible;transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.feat .ico svg *{stroke-dasharray:120;stroke-dashoffset:120}
.feat .ico{width:52px;height:52px}
.feat .ico svg{width:26px;height:26px}
.feat.in .ico svg *{animation:icoDraw 1.4s .2s ease forwards}
.feat.in .ico svg *:nth-child(2){animation-delay:.4s}.feat.in .ico svg *:nth-child(3){animation-delay:.6s}.feat.in .ico svg *:nth-child(4){animation-delay:.8s}
@keyframes icoDraw{to{stroke-dashoffset:0}}
.feat .ico{transition:background .3s}
.feat:hover .ico{background:var(--sage)}
.feat:hover .ico--truck svg{transform:translateX(3px)}
.feat:hover .ico--clock svg,.feat:hover .ico--scan svg{transform:rotate(-10deg)}
.feat:hover .ico--shield svg,.feat:hover .ico--tooth svg{transform:translateY(-2px) scale(1.1)}
.feat:hover .ico--layers svg{transform:translateY(-2px)}

/* Изделия */
.prod{display:flex;flex-direction:column}
.prod ul{margin:12px 0 0;padding:0;list-style:none;color:var(--ink-2);font-size:15px}
.prod li{padding:7px 0;border-top:1px dashed var(--line)}
.prod li:first-child{border-top:0}
.prod .tag{margin-top:auto;padding-top:16px;font-size:13.5px;color:var(--muted)}

/* Галерея */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.tab{font:inherit;font-weight:700;font-size:14.5px;border:1px solid var(--line);background:#fff;color:var(--ink-2);border-radius:999px;padding:9px 16px;cursor:pointer}
.tab[aria-selected="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.tab[aria-selected="true"] .muted{color:#a9bab0}
.gal__cap{font-size:17px;font-weight:700;margin:0 0 6px}
.gal__note{color:var(--muted);margin:0 0 18px;font-size:15px}
.gal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gal--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.gal button{all:unset;cursor:zoom-in;border-radius:var(--radius-sm);overflow:hidden;background:var(--dark);aspect-ratio:4/3;display:block}
.gal button:focus-visible{outline:3px solid var(--sage);outline-offset:3px}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.gal button:hover img{transform:scale(1.04)}
.lb{position:fixed;inset:0;background:rgba(8,12,10,.92);z-index:200;display:none;align-items:center;justify-content:center;padding:20px}
.lb.open{display:flex}
.lb img{max-height:82vh;width:auto;max-width:100%;border-radius:12px}
.lb figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px;max-width:1100px}
.lb figcaption{color:#e8efe9;font-size:15px;text-align:center;max-width:720px}
.lb__btn{position:absolute;top:16px;width:48px;height:48px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lb__close{right:16px}
.lb__prev,.lb__next{top:50%;transform:translateY(-50%)}
.lb__prev{left:16px}.lb__next{right:16px}
.lb__btn svg{width:22px;height:22px}

/* Поиск по прайсу (04.11.2026): 120 позиций в 10 разделах, вручную искать долго */
.pfind{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px}
.pfind label{font-weight:700;font-size:15px;flex:none}
.pfind input{flex:1 1 260px;min-width:0;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid #76937f;border-radius:12px;padding:11px 14px}
.pfind input:focus{outline:2px solid var(--green-dk);outline-offset:1px;border-color:var(--green-dk)}
.pfind input::-webkit-search-cancel-button{cursor:pointer}
.pfind__n{font-size:14.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.pfind__n:empty{display:none}
.price.is-tabs.is-find .ptabs,.price.is-find .ptabs{display:none}
.price.is-tabs.is-find .price__grp,.price.is-find .price__grp{display:block}
.price.is-tabs.is-find .price__grp h3,.price.is-find .price__grp h3{display:block}
.price.is-find .price__row.is-hide{display:none}
.price.is-tabs.is-find .price__grp.is-hide,.price.is-find .price__grp.is-hide{display:none}
.price__none{margin:6px 0 0;font-weight:600;color:var(--ink-2)}
@media (max-width:620px){.pfind label{display:none}.pfind input{flex:1 1 100%}}

/* Мобильный прайс (04.11.2026): 10 пилюль шли в три ряда «в кучу» — на телефоне раздел
   выбирается нативным селектом, пилюли показываем с 621 px */
.psel{display:none}
.psel label{display:block;font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.psel select{width:100%;font:inherit;font-size:16px;font-weight:600;color:var(--ink);background:#fff;border:1px solid #76937f;border-radius:12px;padding:12px 40px 12px 14px;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' fill='none' stroke='%232f7a4f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.psel select:focus-visible{outline:2px solid var(--green-dk);outline-offset:1px}
@media (max-width:620px){
  .price.is-tabs .psel{display:block;margin-bottom:14px}
  .price.is-tabs .ptabs{display:none}
  .price.is-find .psel{display:none}
}

/* Цены: без min-width и горизонтальной прокрутки, на телефоне строки складываются */
.price{display:grid;gap:18px}
.price__grp{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.price__grp h3{padding:18px 22px;background:var(--bg-soft);border-bottom:1px solid var(--line);font-size:17px}
.price__row{display:grid;grid-template-columns:minmax(0,1fr) 120px 140px;gap:16px;align-items:baseline;padding:14px 22px;border-top:1px solid var(--line)}
.price__row:first-of-type{border-top:0}
.price__row--head{font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;padding-top:12px;padding-bottom:12px}
.price__n{font-weight:600}
.price__n small{display:block;color:var(--muted);font-weight:500;font-size:12.5px;margin-top:2px}
.price__t{color:var(--muted);font-size:14.5px}
.price__p{font-weight:800;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.price__t{font-variant-numeric:tabular-nums}
.price__notes{display:grid;gap:8px;margin:22px 0 0;padding:0;list-style:none;color:var(--muted);font-size:15px}
.price__notes li{display:flex;gap:10px}
.price__notes li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--sage);margin-top:10px;flex:none}
.price__cta{margin-top:26px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* Доставка: узлы с бегущей точкой (блок 05 библиотеки WCL, чистый SVG) */
.deliv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.deliv>*{min-width:0}
.deliv__map{position:relative;background:#eef4f0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.deliv__map img{display:block;width:100%;height:auto}
.deliv__map>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.cities{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 22px;padding:0;list-style:none}
.cities li{background:var(--sage-soft);color:var(--green-dk);font-weight:700;font-size:14.5px;border-radius:999px;padding:7px 14px}

/* 09.11.2026 анкета о качестве (118н п. 40) */
.ank{border:0;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.ank legend{grid-column:1 / -1;font-weight:700;font-size:14.5px;margin:0 0 4px;padding:0}
.form .ank__opt{display:flex;flex-direction:row;align-items:center;gap:9px;font-weight:600;font-size:14.5px;color:var(--ink-2);padding:11px 13px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;cursor:pointer;transition:border-color .2s,background-color .2s}
.form .ank__opt:hover{border-color:var(--sage)}
.form .ank__opt input{width:18px;height:18px;min-width:18px;padding:0;border:0;background:none;accent-color:var(--green);flex:none}
.form .ank__opt:has(input:checked){border-color:var(--green);background:var(--sage-soft)}

/* 09.11.2026 производство: фото цеха рядом с фактами (кадр Натальи от 09.11) */
.lab{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:48px;align-items:center}
.lab>*{min-width:0}
.lab__media{margin:0}
.lab__media img{display:block;width:100%;height:auto;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow)}
.lab__media figcaption{margin-top:10px;color:var(--muted);font-size:13.5px}
/* два кадра производства: мастер первым, цех вторым, листаются вбок (просьба Алексея 09.11.2026) */
.lab__gal{min-width:0}
.labgal{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
.labgal::-webkit-scrollbar{display:none}
.labgal:focus-visible{outline:3px solid var(--sage);outline-offset:4px;border-radius:6px}
.labgal__item{flex:0 0 88%;margin:0;min-width:0;scroll-snap-align:start}
.labgal__item img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow)}
.labgal__item figcaption{margin-top:10px;color:var(--muted);font-size:13.5px}
.lab__lead{margin:16px 0 0;color:var(--ink-2);font-size:16.5px;line-height:1.6}
.lab__facts{list-style:none;margin:22px 0 26px;padding:0;display:grid;gap:14px}
.lab__facts li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start;font-size:15.5px;color:var(--ink-2)}
.lab__facts svg{width:22px;height:22px;color:var(--green);margin-top:2px}
@media (max-width:900px){.lab{grid-template-columns:minmax(0,1fr);gap:26px}}

/* Гарантия и требования: раскрывающиеся блоки */
.acc{border:1px solid var(--line);border-radius:var(--radius);background:#fff;overflow:hidden}
.acc+.acc{margin-top:12px}
.acc summary{list-style:none;cursor:pointer;padding:20px 22px;font-weight:750;font-size:17px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:'';width:12px;height:12px;border-right:2.5px solid var(--green);border-bottom:2.5px solid var(--green);transform:rotate(45deg);transition:transform .2s;flex:none;margin-top:-6px}
.acc[open] summary::after{transform:rotate(-135deg);margin-top:6px}
.acc__body{padding:0 22px 22px;color:var(--ink-2);max-width:72ch}
.acc__body ol{margin:0 0 14px;padding-left:22px}
.acc__body li{margin-bottom:8px}

/* Лицензия */
.lic{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px;align-items:center}
.lic>*{min-width:0}
.lic__pages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.lic__pages button{all:unset;cursor:zoom-in;border-radius:10px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:#fff}
.lic__pages button:focus-visible{outline:3px solid var(--green-dk);outline-offset:3px}
.dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 18px;margin:0 0 22px}
.dl dt{color:var(--muted);font-size:14.5px}
.dl dd{margin:0;font-weight:600}

/* Контакты и форма */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
.contact>*{min-width:0}
.cbox{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}
.cbox h3{margin-bottom:18px;font-size:21px}
.cl{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:14px}
.cl li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px}
.cl svg{width:20px;height:20px;color:var(--green);margin-top:3px}
.cl b{display:block}
.cl a{color:var(--ink);font-weight:700;text-decoration:none}
.cl a:hover{color:var(--green)}
.cl span{display:block;color:var(--muted);font-size:14.5px}
.form{display:grid;gap:14px}
.form label{display:grid;gap:6px;font-weight:600;font-size:14.5px}
.form .opt{color:var(--muted);font-weight:500}
.form input,.form textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--bg-soft);border:1px solid #76937f;border-radius:12px;padding:13px 14px;width:100%}
/* рамка поля видна без подписи: 3.1:1 к подложке (линтер gate 40); при фокусе кольцо тёмно-зелёное */
.form input:focus,.form textarea:focus{outline:2px solid var(--green-dk);outline-offset:1px;border-color:var(--green-dk);background:#fff}
.form textarea{min-height:96px;resize:vertical}
.form .chk{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;font-weight:500;font-size:14px;color:var(--ink-2)}
.form .chk input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--green)}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__msg{font-size:15px;font-weight:600;min-height:1.2em}
.form__msg.ok{color:var(--green)}
.form__msg.err{color:#b3261e}
.form .btn{width:100%}
.form__note{font-size:13px;color:var(--muted);margin:0}

/* Подвал */
.ftr{background:#0f1512;color:#c8d3cc;padding-top:56px;padding-bottom:28px;font-size:14.5px}
.ftr a{color:#e6efe9;text-decoration:underline;text-decoration-color:rgba(230,239,233,.35);text-underline-offset:3px}
.ftr a:hover{text-decoration:underline}
.ftr__grid{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:32px;margin-bottom:32px}
.ftr__grid>*{min-width:0}
.ftr h4{color:#fff;font-size:15px;margin:0 0 12px}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ftr .brand{color:#fff;margin-bottom:14px}
.ftr .brand>span>span{color:#9fb0a6}
.ftr__req{color:#9fb0a6;line-height:1.6}
.ftr__bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:20px;display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;color:#8fa096;font-size:13.5px}
.ftr__bottom a{color:#8fa096}

/* Внутренние страницы (сведения, ОМС, права, документы) */
.doc{max-width:880px;padding-top:48px;padding-bottom:80px}
.doc h1{font-size:clamp(28px,3.4vw,40px);margin-bottom:12px}
.doc h2{font-size:22px;margin:40px 0 14px;padding-bottom:8px;border-bottom:2px solid var(--sage);display:inline-block}
.doc h3{margin:22px 0 8px}
.doc .lead{color:var(--muted);font-size:17px;margin-bottom:28px}
.doc ul,.doc ol{padding-left:22px;margin:0 0 16px}
.doc li{margin-bottom:8px}
.doc table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:15px}
.doc th,.doc td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line)}
.doc th{color:var(--muted);font-weight:600;width:38%}
.doc .note{color:var(--muted);font-size:14px}
.crumbs{font-size:14px;color:var(--muted);margin-bottom:18px}
.crumbs a{color:var(--muted)}

/* Плашка черновика: видит клиент, поэтому без служебных слов */
.draft{background:#fff7e0;color:#5b4a12;font-size:13.5px;text-align:center;padding:8px 16px;border-bottom:1px solid #f1e2b0}

/* Баннер cookie */
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:150;max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 40px rgba(20,28,24,.18);padding:18px 20px;display:none;gap:14px;align-items:center;font-size:14.5px}
.ck.show{display:flex}
.ck p{margin:0;color:var(--ink-2)}
.ck__btns{display:flex;gap:8px;flex:none}
.ck .btn{min-height:42px;padding:8px 16px;font-size:14.5px}

/* 25.10.2026 «живее»: блоки 17, 19, 25, 13, 10, 11 библиотеки WCL под светлую палитру лаборатории */

/* Перелив зелёного в заголовке (блок 17) */
.shine{background:linear-gradient(110deg,var(--accent-soft) 0%,var(--accent-soft) 38%,#479969 46%,#3d8a5f 50%,#479969 54%,var(--accent-soft) 62%,var(--accent-soft) 100%);background-size:260% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 7s linear infinite}
@keyframes shine{from{background-position:100% center}to{background-position:0% center}}

/* Бегущая строка видов работ (блок 19), контурный текст на светлом фоне */
.mq{overflow:hidden;white-space:nowrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0;background:#fff}
.mq__track{display:inline-block;font-weight:800;font-size:clamp(15px,1.5vw,20px);letter-spacing:-.02em;line-height:1.1;color:#5c7566;animation:mq 48s linear infinite}  /* мелким кеглем контур не читается: сплошной серый */
.mq__track b{color:var(--green);-webkit-text-stroke:0}
.mq:hover .mq__track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}

/* Изделия: сборка «хаос → порядок» (блок 13 на движке scroll-progress) */
.asm{min-height:215vh;--c1:var(--sage);--c2:var(--green)}
.asm .sp-stage{display:flex;align-items:center}
.asm__in{width:100%}
.asm .sec__head{margin-bottom:28px}
.asm__grid{width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.asm .prod{padding:22px 24px}
.asm .prod h3{margin-bottom:8px}
.asm .prod p{color:var(--muted);margin:0;font-size:15px}
.asm .prod .tag{margin-top:12px;padding-top:0;font-size:13.5px;color:var(--green);font-weight:700}
.asm .sp-progress{height:3px}

/* Как работаем: sticky-шаги (блок 10) */
.how{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.how>*{min-width:0}
.how__left{position:sticky;top:calc(var(--hdr) + 40px)}
.how__nav{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:14px}
.how__nav li{display:flex;gap:14px;align-items:center;color:var(--muted);font-weight:600;font-size:17px;transition:color .3s}
.how__nav li i{width:10px;height:10px;border-radius:50%;background:#cfdcd3;flex:none;transition:background .3s,box-shadow .3s}
.how__nav li.on{color:var(--ink)}
.how__nav li.on i{background:var(--green);box-shadow:0 0 0 5px var(--sage-soft)}
.how__right{display:flex;flex-direction:column;gap:13vh;padding:2vh 0 12vh}
.how__card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);transform:scale(.97);transition:transform .5s,border-color .5s;display:grid;gap:20px}
.how__card.on{opacity:1;transform:none;border-color:var(--sage)}
.how__tag{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:800}
.how__card h3{font-size:24px;margin:10px 0 8px}
.how__card p{color:var(--muted);margin:0}
.how__pic{border-radius:14px;overflow:hidden;background:var(--dark);aspect-ratio:16/10}
.how__pic img{width:100%;height:100%;object-fit:cover}
.how__ico{height:160px;border-radius:14px;background:var(--sage-soft);color:var(--green);display:flex;align-items:center;justify-content:center}
.how__ico svg{width:64px;height:64px;stroke-width:1.4}

/* Галерея: наклон за курсором (блок 11), только мышь */
.gal{perspective:1000px}
.gal button{transition:transform .18s ease-out;transform-style:preserve-3d}

/* Сцена сборки не помещается: узкий или низкий экран = обычная сетка без закрепления */
@media (max-width:900px){.asm__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px),(max-height:680px){
  .asm{min-height:0;padding-top:64px;padding-bottom:64px}
  .asm .sp-stage{position:static;height:auto;overflow:visible;display:block}
  .asm .sp-card{transform:none !important;opacity:1 !important;filter:none !important}
  .asm .sp-fade{opacity:1;transform:none}
  .asm .sp-progress{display:none}
}
@media (max-width:767px){.asm__grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:820px){
  .how{grid-template-columns:minmax(0,1fr);gap:24px}
  .how__left{position:static}
  .how__nav{display:none}
  .how__right{gap:16px;padding:0}
  .how__card{opacity:1;transform:none}
  .how__ico{height:120px}
}

/* 25.10.2026 аудит отдела дизайна: ритм секций, факты, тёмная витрина, компактные шаги, финал */
.sec--sage{background:#eef6f0}
.sec--sage::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.sec--sage>.wrap{position:relative}
.facts4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid rgba(47,122,79,.25)}
.fact{padding:28px 24px 8px 0;border-right:1px solid rgba(47,122,79,.18);margin-right:24px}
.fact:last-child{border-right:0;margin-right:0}
.fact b{display:block;font-weight:800;font-size:clamp(36px,4.2vw,56px);line-height:1;letter-spacing:-.04em;color:var(--accent-soft);font-variant-numeric:tabular-nums}
.fact span{display:block;font-weight:800;font-size:17px;margin:8px 0 10px}
.fact p{margin:0;color:var(--ink-2);font-size:15px}
.why__lic{display:grid;grid-template-columns:20px auto auto;justify-content:start;gap:10px;align-items:center;margin:36px 0 0;color:var(--ink-2);font-size:15px}
.why__lic svg{width:20px;height:20px;color:var(--green);flex:none}

.sec--dark{background:#020302;color:#e9efeb}
.sec--dark .kicker{color:var(--sage)}
.sec--dark h2{color:#fff}
.sec--dark .sec__head p{color:#a8b8ae}
.gal--show{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(150px,16vw,215px);gap:14px}
.gal--show button{position:relative;background:radial-gradient(120% 120% at 50% 0%,#141b16 0%,#070b08 70%);aspect-ratio:auto;height:100%;border-radius:12px;border:1px solid rgba(255,255,255,.07);padding:8px}
.gal--show .gal__big{grid-column:span 2;grid-row:span 2}
.gal--show .gal__wide{grid-column:span 2}
.gal--show img{width:100%;height:100%;object-fit:contain;border-radius:6px}
.gal__lbl{position:absolute;left:8px;right:8px;bottom:8px;padding:24px 12px 10px;font-size:13px;font-weight:600;line-height:1.3;color:#eaf2ec;background:linear-gradient(transparent,rgba(4,8,5,.92));border-radius:0 0 8px 8px;text-align:left;transition:background .25s ease,color .25s ease}
.gal__big .gal__lbl{font-size:15px}

.how__card{grid-template-columns:auto minmax(0,1fr);align-items:start;gap:22px;padding:26px 28px}
.how__num{font-size:44px;font-weight:800;line-height:.9;letter-spacing:-.04em;color:#5f9a70;font-variant-numeric:tabular-nums}
.how__card.on .how__num{color:var(--green)}
.how__card h3{margin:2px 0 8px}

.final{overflow:hidden;isolation:isolate}
.final__head{position:relative;z-index:1;text-align:center;max-width:720px;margin-bottom:44px}
.final__head h2{margin-bottom:12px}
.final__head p{color:var(--ink-2);font-size:17px;margin:0 auto 22px;max-width:560px}
.final .contact{position:relative;z-index:1}
.final.is-off .hero__bg i{animation:none}

/* Эффекты наведения только для мыши: на телефоне не залипают (аудит анимации п.6) */
@media (hover:hover) and (pointer:fine){
  .gal--show button:hover .gal__lbl{color:#fff;background:linear-gradient(transparent,rgba(2,3,2,.95))}
}
@media (hover:none){
  .gal button:hover img{transform:none}
}
@media (max-width:900px){
  .facts4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fact:nth-child(2){border-right:0;margin-right:0}
  .fact:nth-child(n+3){border-top:1px solid rgba(47,122,79,.18)}
  .gal--show{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gal--show{grid-auto-rows:clamp(120px,34vw,180px)}
  .gal__lbl{font-size:12.5px;padding:22px 10px 9px}
}
@media (max-width:620px){
  .sec{padding-top:72px;padding-bottom:72px}
  .facts4{grid-template-columns:minmax(0,1fr)}
  .fact{border-right:0;margin-right:0;padding:22px 0 18px;border-top:1px solid rgba(47,122,79,.18)}
  .fact:first-child{border-top:0}
  .how__num{font-size:34px}
  .how__card{padding:22px}
  .why__lic{grid-template-columns:20px minmax(0,1fr);align-items:start}
  .why__lic a{grid-column:2}
}

/* Появление по прокрутке: порог 0, высокие блоки показываются сразу (память guide_frontend_gotchas) */
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .shine,.mq__track{animation:none}
  .hshow__s,.hshow__s img{transition:none}
  .hshow__s img{transform:none}
  .how__card{opacity:1;transform:none}
  .gal img{transition:none}
  .feat .ico svg *{stroke-dasharray:none;stroke-dashoffset:0;animation:none}
  .feat .ico svg{transition:none}
}

/* Планшет */
@media (max-width:1080px){
  .nav a{padding:8px 9px;font-size:14.5px}
  .hdr__tel{display:none}
}
@media (max-width:900px){
  :root{--hdr:64px}
  .sec{padding-top:64px;padding-bottom:64px}
  .nav,.hdr .btn{display:none}
  .burger{display:flex}
  .nav.open{display:flex;position:fixed;top:var(--hdr);left:0;right:0;flex-direction:column;background:#fff;padding:12px 20px 20px;border-bottom:1px solid var(--line);box-shadow:0 12px 30px rgba(20,28,24,.1)}
  .nav.open a{font-size:17px;padding:13px 4px;border-radius:0;border-bottom:1px solid var(--line)}
  .nav.open .nav__tel{display:block;color:var(--green);font-weight:800;border-bottom:0}
  .hero{padding-top:24px}
  .hero__grid,.deliv,.lic,.contact{grid-template-columns:minmax(0,1fr);gap:32px}
  /* 04.11.2026: на телефоне сначала заголовок и кнопки, фото после них (было фото первым, посетитель не понимал о чём сайт) */
  .hshow__frame{aspect-ratio:1296/816}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gal{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ftr__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ftr__grid>:last-child{grid-column:1 / -1}
}
/* Телефон */
@media (max-width:620px){
  body{font-size:15.5px}
  .hero__lead{font-size:16.5px}
  .hero__cta .btn{flex:1 1 100%}
  .g3,.g2{grid-template-columns:minmax(0,1fr)}
  .gal{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .gal--3{grid-template-columns:minmax(0,1fr)}
  .card,.cbox{padding:22px}
  .price__row{grid-template-columns:minmax(0,1fr) auto;gap:3px 12px;padding:14px 16px}
  .price__row--head{display:none}
  .price__n{font-size:15.5px;line-height:1.35}
  .price__t{grid-column:1;grid-row:2;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
  .price__t::before{content:'срок '}
  .price__p{grid-column:2;grid-row:1 / 3;align-self:center;font-size:17px}
  .price__grp h3{padding:16px 18px}
  .lb__prev,.lb__next{top:auto;bottom:16px;transform:none}
  .ftr__grid{grid-template-columns:minmax(0,1fr)}
  .ck{flex-direction:column;align-items:stretch}
  .ck__btns .btn{flex:1}
  .dl{grid-template-columns:minmax(0,1fr);gap:2px}
  .dl dd{margin-bottom:10px}
  .doc th,.doc td{display:block;width:auto;padding:6px 0}
  .doc th{border-bottom:0;padding-top:12px}
}
@media print{
  .no-print,.hdr,.ck,.lb,.burger,.draft{display:none !important}
  body{background:#fff !important;color:#000 !important}
  .rv{opacity:1 !important;transform:none !important}
}

/* 25.10.2026 правки Алексея: прайс вкладками, реальная карта доставки, карта у контактов, коронка в «Как работаем», подвал */
.ptabs{display:none}
.price.is-tabs{gap:0}
.price.is-tabs .ptabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.ptabs button{font:inherit;font-weight:700;font-size:15px;border:1px solid var(--line);background:#fff;color:var(--ink-2);border-radius:999px;padding:10px 18px;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.ptabs button[aria-selected=true]{background:var(--green);border-color:var(--green);color:#fff}
.ptabs button:focus-visible{outline:3px solid var(--green-dk);outline-offset:2px}
.price.is-tabs .price__grp{display:none}
.price.is-tabs .price__grp.on{display:block;animation:ptIn .35s var(--ease-out,ease-out)}
.price.is-tabs .price__grp h3{display:none}
@keyframes ptIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (hover:hover) and (pointer:fine){.ptabs button[aria-selected=false]:hover{border-color:var(--sage);color:var(--green)}}

.deliv__map .rt-c{fill:none;stroke:#fff;stroke-width:13;stroke-linejoin:round;stroke-linecap:round;opacity:.85}
.deliv__map .rt{fill:none;stroke:var(--green);stroke-width:6;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.rv .deliv__map .rt,.deliv__map.rv .rt{stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--ease-in-out,ease) calc(var(--i) * .12s)}
.deliv__map.rv.in .rt{stroke-dashoffset:0}
.deliv__map .city{fill:#fff;stroke:var(--green);stroke-width:6}
.deliv__map .hub{fill:var(--green)}
.deliv__map .hub-ring{fill:rgba(255,255,255,.7);stroke:var(--green);stroke-width:3;transform-box:fill-box;transform-origin:center;animation:hubP 2.8s ease-out infinite}
@keyframes hubP{0%{transform:scale(.7);opacity:1}100%{transform:scale(1.6);opacity:0}}
.deliv__map .lbl,.deliv__map .lbl-s{paint-order:stroke;stroke:#fff;stroke-width:9px;stroke-linejoin:round}
.deliv__map .lbl{fill:var(--ink);font:800 34px 'Manrope',sans-serif}
.deliv__map .lbl--hub{fill:var(--green-dk,#1f5a39)}
.deliv__map .lbl-s{fill:var(--ink-2);font:600 24px 'Manrope',sans-serif}
.deliv__map .dot{fill:var(--green);stroke:#fff;stroke-width:4}
.osm{position:absolute;right:0;bottom:0;background:rgba(255,255,255,.82);color:var(--muted);font-size:11px;line-height:1;padding:5px 8px;border-top-left-radius:8px;text-decoration:none}
.osm:hover{color:var(--ink)}

.contact__l{display:grid;gap:22px;min-width:0}
.cmap{position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#eef4f0;box-shadow:var(--shadow)}
.cmap img{display:block;width:100%;height:auto}
.cmap>svg{position:absolute;inset:0;width:100%;height:100%}
.cmap .spin__pin{fill:var(--green-dk);stroke:#fff;stroke-width:4}
.cmap .spin__in{fill:#fff}
.cmap .spin__pulse{fill:rgba(47,122,79,.35);transform-box:fill-box;transform-origin:center;animation:spinP 2.4s ease-out infinite}
.cmap .spin__lbl{fill:var(--ink);font:800 34px 'Manrope',sans-serif;paint-order:stroke;stroke:#fff;stroke-width:9px;stroke-linejoin:round}
@keyframes spinP{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.2);opacity:0}}
.cmap__tag{position:absolute;left:14px;top:14px;display:inline-flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:8px 14px 8px 10px;font-weight:800;font-size:14px;color:var(--ink);box-shadow:0 6px 18px rgba(20,28,24,.14)}
.cmap__tag svg{width:18px;height:18px;color:var(--green)}

.crown{margin:34px 0 0;max-width:300px}
.crown canvas{display:block;width:100%;height:auto;aspect-ratio:320/270}
.crown figcaption{margin-top:6px;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--green)}
@media (max-width:900px),(max-height:700px){.crown{display:none}}

.ftr__2col{grid-template-columns:repeat(2,minmax(0,max-content));column-gap:28px}
.ftr__org{display:flex;gap:28px;align-items:center;border-top:1px solid rgba(255,255,255,.1);padding:24px 0;margin-bottom:6px}
.ftr__org .brand{margin:0;flex:none}
.ftr__org .ftr__req{margin:0;font-size:13.5px;line-height:1.65}
@media (max-width:620px){
  .ptabs{flex-wrap:nowrap!important;overflow-x:auto;margin-left:-16px;margin-right:-16px;padding:0 16px 4px;scrollbar-width:none}
  .ptabs::-webkit-scrollbar{display:none}
  .deliv__map .lbl{font-size:50px}
  .deliv__map .lbl-s{font-size:30px}
  .deliv__map .lbl,.deliv__map .lbl-s{stroke-width:12px}
  .ftr__org{flex-direction:column;align-items:flex-start;gap:14px}
}
@media (prefers-reduced-motion:reduce){
  .deliv__map .rt{stroke-dashoffset:0!important;transition:none!important}
  .deliv__map .hub-ring,.cmap .spin__pulse,.price.is-tabs .price__grp.on{animation:none!important}
}

/* 25.10.2026 Алексей: первый экран уже окна → шире остальных секций и на высоту экрана, бегущая строка у нижнего края */
@media (min-width:901px){
  .hero{min-height:calc(100svh - var(--hdr) - 54px);display:flex;align-items:center;padding-top:32px;padding-bottom:40px}
  .hero>.wrap{width:100%;max-width:1440px;padding-left:clamp(20px,3.5vw,56px);padding-right:clamp(20px,3.5vw,56px)}
  .hero__grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);gap:clamp(40px,4vw,72px)}
  .hero h1{font-size:clamp(40px,4.6vw,76px)}
  .hero__lead{font-size:clamp(17px,1.3vw,20px)}
  .hshow__frame{max-height:calc(100svh - var(--hdr) - 170px);min-height:360px}
}
/* 29.10.2026 вариант 4: мягкая шалфейная дымка на первом экране, светлее секция фактов, крупные цифры светлым зелёным */
.hero{background:radial-gradient(55% 75% at 92% 12%,#e4f1e7 0%,rgba(228,241,231,0) 70%),radial-gradient(45% 60% at 0% 100%,#edf6ef 0%,rgba(237,246,239,0) 70%),var(--bg)}
.hero__bg--contours i{opacity:.45}

/* Доставка: карта уже, слева список городов по расстоянию с подсветкой маршрута */
.deliv{grid-template-columns:minmax(0,1fr) minmax(0,.8fr)}
.dlist{list-style:none;margin:26px 0 10px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;border-top:1px solid var(--line)}
.dlist li{border-bottom:1px solid var(--line)}
.dlist button{all:unset;box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 4px;cursor:pointer;font-weight:700;font-size:16.5px;color:var(--ink);transition:color .2s}
.dlist button small{display:block;font-weight:500;font-size:13px;color:var(--muted);margin-top:2px}
.dlist button b{font-weight:800;color:var(--green);font-variant-numeric:tabular-nums;white-space:nowrap}
.dlist button:focus-visible{outline:3px solid var(--green-dk);outline-offset:2px;border-radius:6px}
.dlist button.on{color:var(--green)}
.dlist__note{margin:0 0 24px;color:var(--muted);font-size:13.5px}
.deliv__map .rt,.deliv__map .rt-c,.deliv__map .cg{transition:opacity .3s,stroke-width .3s}
.deliv__map.dim .rt:not(.hl),.deliv__map.dim .rt-c{opacity:.18}
.deliv__map.dim .cg:not(.hl){opacity:.4}
.deliv__map .rt.hl{stroke-width:9}
.deliv__map .cg.hl .city{fill:var(--green)}
@media (max-width:900px){.deliv{grid-template-columns:minmax(0,1fr)}}
@media (max-width:620px){.dlist{grid-template-columns:minmax(0,1fr)}.dlist__note{font-size:13px}}

/* Карта в контактах: картинка-превью, по согласию или кнопке живой виджет Яндекса поверх */
.cmap__on{position:absolute;right:14px;bottom:34px;text-decoration:none;display:grid;gap:2px;justify-items:start;font:inherit;font-weight:800;font-size:14px;color:#fff;background:var(--green);border:0;border-radius:14px;padding:10px 16px;cursor:pointer;box-shadow:0 8px 22px rgba(20,28,24,.22);transition:background .2s,transform .2s}
.cmap__on small{font-weight:500;font-size:11.5px;opacity:.85}
.cmap__on:hover{background:var(--green-dk)}
.cmap__on:active{transform:scale(.97)}
.cmap__on:focus-visible{outline:3px solid #fff;outline-offset:3px}
.cmap__frame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#eef4f0}
.cmap.live{min-height:380px}
.cmap.live>img{position:absolute;inset:0;height:100%;object-fit:cover}
.cmap.live>svg,.cmap.live .cmap__tag,.cmap.live .cmap__on,.cmap.live .osm{display:none}
.cmap.wait .cmap__on{opacity:.6;pointer-events:none}

/* 26.10.2026 Алексей: форма по высоте до низа карты слева; лишнюю высоту забирает поле «Комментарий» */
@media (min-width:901px){
  .contact{align-items:stretch}
  .contact>.cbox{display:flex;flex-direction:column}
  .contact>.cbox .form{flex:1;display:flex;flex-direction:column}
  .contact>.cbox .form label:has(textarea){flex:1;display:flex;flex-direction:column}
  .contact>.cbox .form label:has(textarea) textarea{flex:1}
}

/* 26.10.2026 мобильная проверка: бургер не ужимается, компактный баннер cookie, плашка в две строки, кнопка карты полосой */
.burger{flex:none}
.cmap__on small{font-size:12.5px}
@media (max-width:620px){
  .ck{left:10px;right:10px;bottom:10px;padding:12px 14px;gap:10px;font-size:13px;line-height:1.4;border-radius:14px}
  .ck .btn{min-height:40px;padding:6px 12px;font-size:14px}
  .hero__badge{border-radius:14px;align-items:flex-start;line-height:1.35;padding:7px 12px;font-size:12.5px}
  .hero__badge i{margin-top:5px;flex:none}
  .cmap__on{left:12px;right:12px;bottom:30px;justify-items:center;text-align:center;padding:9px 14px}
  .cmap>img{height:260px;object-fit:cover}   /* svg с меткой обрезается так же: preserveAspectRatio="xMidYMid slice" */
  .cmap__tag{left:10px;top:10px;font-size:13px;padding:7px 12px 7px 9px}
}
/* 320-360: длинные подписи кнопок («Сведения о медицинской организации», «Уточнить доставку в ваш город»)
   переносились в две строки (линтер gate 49a): ужимаем поле кнопки, текст держим в одну строку */
@media (max-width:360px){
  .btn{padding:12px 10px;font-size:13.5px}
  .btn svg{width:16px;height:16px}
}
/* 320-360: логотип с подписью + бургер 44px не влезали (308px в 280px), бургер ужимался до 36px; подпись переносится, кегль тот же */
@media (max-width:360px){
  .hdr__in{gap:12px}
  .brand{flex:0 1 auto;min-width:0;gap:10px}
  .brand img{width:40px;height:40px}
}

/* 26.10.2026 SEO: плашка внутри H1 (ключ «зуботехническая лаборатория» в заголовке), вид как раньше */
.hero h1 .hero__badge{display:flex;width:max-content;max-width:100%;letter-spacing:normal;line-height:1.35;text-wrap:wrap}

/* 04.11.2026 мобильный прайс: правила стоят в конце, чтобы перебить .price.is-tabs .ptabs выше */
@media (max-width:620px){
  .price.is-tabs .psel{display:block;margin-bottom:14px}
  .price.is-tabs .ptabs{display:none !important}
  .price.is-find .psel{display:none}
}

/* ===== 04.11.2026 мобильная доводка: убираем «разброс и пустые места» =====
   Алексей: «всё разбросано, пустые места, ничего не ценно». Сжимаем ритм, карточки в две колонки,
   шаги превращаем в таймлайн без белых плашек. */
@media (max-width:620px){
  .sec{padding-top:56px;padding-bottom:56px}
  .sec__head{margin-bottom:24px}
  .sec__head p{font-size:15.5px;margin-top:10px}

  /* Изделия: две колонки компактных карточек вместо шести простыней */
  .asm{padding-top:56px;padding-bottom:56px}
  .asm .sec__head{margin-bottom:20px}
  /* строки-карточки: название и срок в одну строку, описание в две строки без «...» в полтекста */
  .asm__grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .asm .prod{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:4px;
             padding:14px 16px;border-radius:14px;align-items:start}
  .asm .prod h3{font-size:16px;line-height:1.25;margin:0;grid-column:1}
  .asm .prod .tag{grid-column:2;grid-row:1;margin:0;padding:0;font-size:12px;font-weight:700;color:var(--green);
                  white-space:nowrap;text-align:right;line-height:1.5}
  .asm .prod p:not(.tag){grid-column:1 / -1;grid-row:2;font-size:13.5px;line-height:1.45;color:var(--muted);margin:0}

  /* Факты 2x2, цифры мельче: секция была 1800 px */
  .facts4{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
  .fact{padding:16px 0 14px;margin-right:0;border-right:0;border-top:1px solid rgba(47,122,79,.18)}
  .fact:nth-child(2){border-right:0}
  .fact:nth-child(n+3){border-top:1px solid rgba(47,122,79,.18)}
  .fact:first-child,.fact:nth-child(2){border-top:0}
  .fact b{font-size:30px}
  .fact span{font-size:14.5px;margin:6px 0 6px}
  .fact p{font-size:13.5px;line-height:1.45}

  /* Как работаем: таймлайн строками, без белых карточек и воздуха */
  .how{gap:18px}
  .how__right{gap:0;padding:0}
  /* фон и тень гасим !important: its-motion.css подключается после и красит карточку под скролл-эффект */
  .how__card,.how__card.on{background:none!important;box-shadow:none!important;border:0;border-top:1px solid var(--line);
             border-radius:0;padding:15px 0;grid-template-columns:42px minmax(0,1fr);gap:12px}
  .how__card:first-child{border-top:0}
  .how__num{font-size:26px;line-height:1.1;color:#4f9370}
  .how__card.on .how__num{color:var(--green)}
  .how__card h3{font-size:17.5px;margin:0 0 4px}
  .how__card p{font-size:14.5px;line-height:1.45}

  /* Галерея: тоньше паспарту, подписи в две строки не лезут на фото */
  .gal--show{gap:10px}
  .gal--show button{padding:4px;border-radius:10px}
  .gal__lbl{left:4px;right:4px;bottom:4px;padding:18px 9px 7px;font-size:11.5px;line-height:1.25;
            display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .gal--show .gal__big .gal__lbl{font-size:13px;padding:20px 10px 8px}

  /* Прайс: карточка раздела и строки компактнее */
  .price__grp{border-radius:16px}
  .price__row{padding:12px 14px}
  .price__p{font-size:16px}
  .price__notes{margin-top:16px;font-size:14px}
  .price__cta{margin-top:20px;gap:10px}
}
/* Сноски к прайсу: на телефоне не вываливаем семь пунктов подряд, прячем под раскрывашку (04.11.2026) */
.pnotes{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}
.pnotes>summary{cursor:pointer;font-weight:700;font-size:15px;color:var(--ink);display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;padding:2px 0}
.pnotes>summary::-webkit-details-marker{display:none}
.pnotes>summary::after{content:'';width:11px;height:11px;border-right:2.5px solid var(--green);border-bottom:2.5px solid var(--green);transform:rotate(45deg);transition:transform .2s;flex:none;margin-top:-5px}
.pnotes[open]>summary::after{transform:rotate(-135deg);margin-top:5px}
.pnotes[open]>summary{margin-bottom:12px}
.pnotes .price__notes{margin-top:0}
@media (max-width:620px){.pnotes{margin-top:18px;padding-top:14px}.pnotes>summary{font-size:14.5px}}

/* ===== 04.11.2026 прайс: «пилюли в три ряда» читались как каша.
   На широком экране раздел выбирается списком слева, справа таблица с заголовком раздела.
   Разметка и JS те же: .ptabs становится колонкой, .ppanes — правой частью. */
@media (min-width:821px){
  .price.is-tabs .pbody{display:grid;grid-template-columns:minmax(0,264px) minmax(0,1fr);gap:32px;align-items:start}
  .price.is-tabs .ptabs{display:flex;flex-direction:column;flex-wrap:nowrap;gap:2px;margin:0;
                        position:sticky;top:calc(var(--hdr) + 24px);border-right:1px solid var(--line);padding-right:14px}
  .price.is-tabs .ptabs button{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
                               text-align:left;white-space:normal;background:none;border:0;border-radius:10px;
                               padding:10px 12px;font-size:15px;font-weight:600;color:var(--ink-2);line-height:1.3}
  .price.is-tabs .ptabs button:hover{background:var(--bg-soft);color:var(--ink)}
  .price.is-tabs .ptabs button[aria-selected=true]{background:var(--green);color:#fff;font-weight:700}
  .price.is-tabs .ptabs__n{font-size:12px;font-weight:600;opacity:.65;font-variant-numeric:tabular-nums;flex:none}
  .price.is-tabs .ptabs button[aria-selected=true] .ptabs__n{opacity:.85}
  .price.is-tabs .ppanes{min-width:0}
  .price.is-tabs .ptitle{display:flex;align-items:baseline;gap:12px;margin:0 0 12px;padding:0 2px}
  .ptitle{display:none}   /* нужен только в десктопной колонке: на телефоне раздел показывает селект */
  .ptitle b{font-size:20px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
  .ptitle span{font-size:13.5px;color:var(--muted);font-variant-numeric:tabular-nums}
  .price.is-tabs .price__row{grid-template-columns:minmax(0,1fr) 100px 140px;padding:15px 20px}
  .price.is-tabs .price__n{font-size:15.5px;line-height:1.4}
  .price.is-tabs .price__p{font-size:17.5px}
  .price.is-tabs .price__grp{border-radius:18px}
}
}
/* Заголовки таблицы прайса в одну строку */
.price__row--head span{white-space:nowrap}

/* 04.11.2026: счётчик позиций в пилюлях и селект до планшета (621-820 давал два ряда пилюль — снова «каша») */
.ptabs__n{margin-left:7px;font-size:12px;font-weight:600;opacity:.6;font-variant-numeric:tabular-nums}
.ptabs button[aria-selected=true] .ptabs__n{opacity:.85}
@media (max-width:820px){
  .price.is-tabs .psel{display:block;margin-bottom:14px}
  .price.is-tabs .ptabs{display:none !important}
  .price.is-tabs .pbody{display:block}
}
@media (max-width:820px){
  .ptitle{margin-bottom:10px}
}
@media (max-width:820px){ .price.is-find .psel{display:none !important} }

/* Прайс: колонки ближе друг к другу и лёгкая зебра по строкам — так длинная таблица читается */
@media (min-width:821px){
  .price.is-tabs .price__row{grid-template-columns:minmax(0,1fr) 84px 124px}
  .price.is-tabs .price__row:nth-of-type(even){background:#fafcf9}
  .price.is-tabs .price__row--head{background:none}
}
/* при поиске правая колонка занимает всё место, разделов нет */
@media (min-width:821px){
  .price.is-find .pbody{display:block}
}
@media (min-width:821px){
  .price.is-tabs .price__row:not(.price__row--head):hover{background:var(--bg-soft)}
}

/* ===== 04.11.2026 первый экран по выбранному направлению A «инженерный минимализм» =====
   Убрали перелив в H1, топографические контуры, маркизу материалов и фон-градиенты.
   Текст слева, крупное фото 4:5 справа, под кадром подпись, ниже волосяная полоса трёх цифр. */
.hero{background:var(--bg);padding:64px 0 0;min-height:0;display:block}
.hero__bg{display:none}
.hero__kicker{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 18px}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(32px,5vw,64px);align-items:center}
.hero h1{font-size:clamp(34px,3.9vw,56px);font-weight:700;letter-spacing:-.025em;line-height:1.08;margin:0 0 24px;max-width:15ch}
.hero h1 em{font-style:normal;color:var(--green);background:none;-webkit-background-clip:border-box;background-clip:border-box;animation:none;color:var(--green)}
.hero__lead{font-size:clamp(16.5px,1.2vw,18.5px);line-height:1.5;color:var(--ink-2);max-width:44ch;margin:0 0 30px}
.hero__cta{margin:0}
.hero__nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:56px 0 0;
            border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hero__nums>div{padding:22px 28px;border-left:1px solid var(--line)}
.hero__nums>div:first-child{border-left:0;padding-left:0}
.hero__nums b{display:block;font-size:26px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.hero__nums span{display:block;margin-top:4px;font-size:13.5px;line-height:1.4;color:var(--muted)}

/* карусель в новом виде: кадр 4:5 без паспарту, подпись и управление под кадром.
   04.11.2026 (Алексей: «скролл где-то сбоку»): карусель занимает колонку целиком, поэтому
   подпись, точки и стрелки стоят ровно по краям кадра, а не шире него. */
.hero .hshow{width:100%;max-width:none;margin-left:auto;margin-right:auto}
.hero .hshow__frame{aspect-ratio:4/5;max-height:none;min-height:0;border-radius:4px;box-shadow:none}
.hero .hshow__s figcaption{display:none}
.hshow__cap{margin:12px 0 10px;font-size:13px;line-height:1.4;color:var(--muted)}
.hero .hshow__bar{margin-top:0}
.hero .hshow__btn,.hero .hshow__pp{width:38px;height:38px;border-color:var(--line)}

@media (max-width:900px){
  .hero{padding:28px 0 0}
  .hero__grid{grid-template-columns:minmax(0,1fr);gap:26px}
  .hero h1{font-size:clamp(30px,8.4vw,38px);max-width:22ch;margin-bottom:18px}
  .hero__lead{margin-bottom:22px}
  .hero .hshow__frame{aspect-ratio:3/2}
  .hero__nums{grid-template-columns:minmax(0,1fr);margin-top:32px}
  .hero__nums>div{border-left:0;border-top:1px solid var(--line);padding:14px 0}
  .hero__nums>div:first-child{border-top:0;padding-top:16px}
  .hero__nums b{font-size:20px}
  .hero__nums span{font-size:13px}
}

/* Первый экран должен влезать в 1920x1080 (линтер gate 44d): кадр не выше остатка окна */
@media (min-width:901px){
  /* БЫЛО max-height на кадре: фото ужималось по высоте, вставало СЛЕВА от колонки, а полоса
     управления тянулась на всю колонку, и стрелки уезжали за правый край кадра.
     Теперь ширина карусели ограничена той же меркой, кадр по центру колонки,
     подпись и точки со стрелками ровно под ним, первый экран по-прежнему влезает в окно. */
  .hero .hshow{width:min(100%,calc((100svh - var(--hdr) - 300px) * .8));margin-left:auto;margin-right:auto}
  .hero .hshow__frame{max-height:none;min-height:0}
  .hero{padding-top:44px}
  .hero__nums{margin-top:40px}
  .hero__nums>div{padding-top:18px;padding-bottom:18px}
}

/* Ось первого экрана = ось остальных секций (комиссия: hero жил на своей сетке 1440) */
.hero>.wrap{max-width:var(--wrap);padding-left:20px;padding-right:20px;width:100%}

/* ===== 04.11.2026 «Что изготавливаем»: убрали залипание на 215vh (комиссия, 5 голосов из 5).
   Обычная секция, сетка 3x2, в карточке цена и срок, лёгкий подъём при наведении. ===== */
.works{gap:18px}
.works .prod{padding:26px 26px 24px;transition:transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s ease,border-color .25s ease}
.works .prod h3{font-size:20px;margin-bottom:10px}
.works .prod p{font-size:15px;line-height:1.5}
.works .prod .tag{margin-top:auto;padding-top:18px;font-size:14px;font-weight:700;color:var(--green);
                  font-variant-numeric:tabular-nums}
.works__note{margin:26px 0 0;font-size:14px;color:var(--muted)}
@media (hover:hover) and (pointer:fine){
  .works .prod:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(38,49,43,.09);border-color:#cfe0d5}
}
@media (max-width:900px){
  .works .prod{padding:22px}
  .works .prod h3{font-size:18px}
}
@media (max-width:620px){
  .works{gap:12px}
  .works .prod{padding:18px}
  .works .prod .tag{padding-top:14px;font-size:13.5px}
}

/* «Изделия» на телефоне: строка-карточка, цена и срок в первой строке справа (как в первом варианте мобилки) */
@media (max-width:620px){
  .works .prod{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:5px;
               padding:14px 16px;align-items:start;border-radius:14px}
  .works .prod h3{font-size:16px;line-height:1.25;margin:0;grid-column:1}
  .works .prod .tag{grid-column:2;grid-row:1;margin:0;padding:0;font-size:12.5px;font-weight:700;
                    white-space:nowrap;line-height:1.55;text-align:right}
  .works .prod p:not(.tag){grid-column:1 / -1;grid-row:2;font-size:13.5px;line-height:1.45;color:var(--muted)}
  .works__note{font-size:13px}
}

/* ===== 04.11.2026 шапка (комиссия: полупрозрачный фон над тёмной галереей становился грязно-серым) =====
   Непрозрачный фон и тонкая тень; при прокрутке больше 8 px шапка чуть ужимается (класс is-stuck ставит JS). */
.hdr{transition:height .22s ease}
.hdr::before{background:#fbfcf9;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--line);
             box-shadow:0 1px 0 rgba(38,49,43,.05)}
.hdr.is-stuck{--hdr:64px}
.hdr.is-stuck .brand img{width:38px;height:38px;transition:width .22s ease,height .22s ease}
.hdr.is-stuck .brand b{font-size:18px}
.hdr.is-stuck .hdr__in{gap:20px}
.hdr.is-stuck::before{box-shadow:0 6px 18px rgba(38,49,43,.07)}

/* Доставка: три факта строками над списком городов, километры уходят вниз мелким (комиссия, пункт 12) */
.dfacts{list-style:none;margin:22px 0 6px;padding:0;display:grid;gap:9px;font-size:16px;color:var(--ink)}
.dfacts li{display:flex;gap:10px;align-items:flex-start;line-height:1.45}
.dfacts li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);margin-top:9px;flex:none}
.dlist{margin-top:18px}
.dlist button{font-size:15.5px;padding:12px 4px}
.dlist button b{font-weight:600;color:var(--muted);font-size:14px}

/* ===== 04.11.2026 «Как работаем» на десктопе: зазор 13vh оставлял 1.16 экрана воздуха, шаги не читались
   как процесс. Делаем таймлайн с вертикальной линией, как на телефоне (комиссия его хвалила). ===== */
@media (min-width:821px){
  .how__right{gap:0!important;padding:4px 0 8px;position:relative}   /* its-motion.css задаёт 18vh после нас */
  .how__right::before{content:'';position:absolute;left:21px;top:14px;bottom:34px;width:2px;background:var(--sage);opacity:.55}
  .how__card,.how__card.on{background:none!important;box-shadow:none!important;border:0;border-radius:0;
      padding:16px 0 22px;grid-template-columns:44px minmax(0,1fr);gap:16px;position:relative;transform:none}
  .how__num{font-size:26px;line-height:1.15;color:#4f9370;background:var(--bg);position:relative;z-index:1;
            padding:2px 0;width:44px;text-align:center}   /* 3.5:1 на фоне: #7aa98a давал 2.46 */

  .how__card.on .how__num{color:var(--green)}
  .how__card h3{font-size:19px;margin:2px 0 5px}
  .how__card p{font-size:15px;line-height:1.5}
  .how__left .crown{margin-top:26px}
}

/* ===== 04.11.2026 типографика: сводим разнобой кеглей (комиссия, пункт 10) =====
   Шесть ступеней: 68/44/34 заголовки, 20 подзаголовок, 18 лид, 16 текст, 14.5 подпись, 11.5 лейбл. */
.kicker{font-size:11.5px;letter-spacing:.14em}
h1{line-height:1.06;letter-spacing:-.022em}
h2{letter-spacing:-.025em}
h3{font-size:20px;letter-spacing:-.015em}
.sec__head p{font-size:16.5px;line-height:1.55}
/* вторичные секции чуть тише главных: у них свой масштаб заголовка */
#delivery h2,#license h2{font-size:clamp(26px,2.7vw,34px)}
#delivery .dfacts{font-size:16px;line-height:1.5}
.card p,.works .prod p{font-size:15px}
.price__notes{font-size:14.5px}
@media (max-width:620px){
  .kicker{font-size:11px}
  h3{font-size:18px}
  .sec__head p{font-size:15.5px}
}

/* Прайс: цена всегда в своей колонке. Раньше у позиций без срока span срока не выводился,
   и цена съезжала в колонку «Срок» (видно как разбросанные цены). Закрепляем места явно. */
.price__t{grid-column:2}
.price__p{grid-column:3}
@media (max-width:620px){
  .price__t{grid-column:1}
  .price__p{grid-column:2}
}

/* Заголовок раздела прайса: на телефоне его роль играет селект, поэтому скрыт (было видно слипшееся
   «Металлокерамика7 позиций»: оба правила лежали внутри медиа-запроса от 821px) */
.ptitle{display:none}
@media (min-width:821px){
  .price.is-tabs .ptitle{display:flex;align-items:baseline;gap:12px;margin:0 0 12px;padding:0 2px}
  .ptitle b{font-size:20px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
  .ptitle span{font-size:13.5px;color:var(--muted);font-variant-numeric:tabular-nums}
}

/* ===== 04.11.2026 галерея: ровная сетка 4 колонки, подпись под кадром =====
   Раньше была мозаика 2x2 + широкие, подпись лежала на снимке и закрывала светлые коронки. */
.gal--grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 16px;align-items:start}
.gal__item{margin:0;min-width:0;display:flex;flex-direction:column}
.gal__item button{all:unset;cursor:zoom-in;display:block;border-radius:12px;overflow:hidden;
                  background:radial-gradient(120% 120% at 50% 0%,#161d18 0%,#080c09 72%);
                  border:1px solid rgba(255,255,255,.07);padding:6px}
.gal__item button:focus-visible{outline:3px solid var(--sage);outline-offset:3px}
.gal__item img{width:100%;aspect-ratio:4/3;object-fit:contain;border-radius:6px}
.gal__item figcaption{margin-top:10px;font-size:13px;line-height:1.35;color:#c9d6cd}
.gal__item button:hover img{transform:scale(1.02)}
@media (hover:none){.gal__item button:hover img{transform:none}}
@media (max-width:900px){
  .gal--grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
}
@media (max-width:620px){
  .gal--grid{gap:16px 10px}
  .gal__item button{padding:4px;border-radius:10px}
  .gal__item figcaption{font-size:11.5px;margin-top:7px}
}

/* Карусель героя: зум-наезд обрывался на 83% (6 с анимации при смене каждые 5 с).
   Делаем анимацию короче интервала, чтобы кадр успевал «доехать». */
.hero .hshow__s img{transform:scale(1.035);transition:transform 4.6s ease-out}
.hero .hshow__s.on img{transform:none}

/* Печать: убираем управляющие элементы, которые на бумаге не нужны (04.11.2026) */
@media print{
  .tbar,.hshow__bar,.hshow__dots,.hshow__pp,.hshow__btn,.pfind,.psel,.ck,.lb,.draft{display:none !important}
  .hero{padding-top:0 !important}
  .hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,.9fr) !important}
  .gal--grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  .gal__item button{padding:0 !important;border:0 !important}
  .works .prod,.price__grp{break-inside:avoid}
  .sec{padding-top:28px !important;padding-bottom:28px !important}
  a[href]::after{content:""}
}

/* ===== 04.11.2026 полировка: одна система радиусов и плейсхолдеры =====
   В CSS жило семь разных радиусов (22/18/16/14/12/10), из-за этого карточки выглядели сборными.
   Теперь: 20 - крупные блоки, 16 - панели, 12 - поля и плитки, 999 - кнопки и пилюли. */
.card,.cbox,.acc,.price__grp,.works .prod,.how__card,.pnotes,.price{border-radius:20px}
.ck,.cmap,.deliv__map,.gal__item button,.lic__pages button{border-radius:16px}
.form input,.form textarea,.psel select,.pfind input,.tsearch,.gal__item button{border-radius:12px}
@media (max-width:620px){
  .works .prod{border-radius:16px}
  .card,.cbox,.price__grp{border-radius:16px}
}
.form input::placeholder,.form textarea::placeholder{color:#8b9a92;opacity:1}

/* Подвал: колонка «Разделы» была на max-content и разъезжалась (Изделия/Работы с разной шириной) */
.ftr{padding-top:48px}
.ftr__grid{gap:28px 40px;margin-bottom:26px}
.ftr__2col{grid-template-columns:repeat(2,minmax(110px,1fr));column-gap:18px;row-gap:8px}
.ftr ul{gap:9px}
.ftr__org{padding:22px 0}
@media (max-width:620px){
  .ftr{padding-top:36px}
  .ftr__2col{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ===== 04.11.2026 последний лоск ===== */

/* 1. Полоса цифр на телефоне: три строки по 80 px сжимаем в один ряд */
@media (max-width:620px){
  .hero__nums{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:26px}
  .hero__nums>div{border-left:1px solid var(--line);border-top:0;padding:12px 10px 12px 12px}
  .hero__nums>div:first-child{border-left:0;padding-left:0}
  .hero__nums b{font-size:17px;letter-spacing:-.01em}
  .hero__nums span{font-size:11.5px;line-height:1.3;margin-top:3px}
}

/* 2. Абзацы без висячих слов: поддержка в Chromium 117+, остальные просто игнорируют */
p,.hero__lead,.sec__head p{text-wrap:pretty}

/* 3. Тактильная отдача кнопок и карточек галереи */
.btn,.cta,.ghost{transition:background .2s ease,color .2s ease,border-color .2s ease,transform .12s ease}
.btn:active,.cta:active,.ghost:active{transform:scale(.985)}
.gal__item button:active{transform:scale(.995)}

/* 4. Подпись карусели меняется мягко, без прыжка текста */
.hshow__cap{transition:opacity .25s ease}

/* 5. Наведение на строку прайса: подсветка и лёгкий сдвиг цены, чтобы читалась строка, а не таблица */
@media (min-width:821px){
  .price.is-tabs .price__row:not(.price__row--head){transition:background .18s ease}
  .price.is-tabs .price__row:not(.price__row--head):hover .price__p{transform:translateY(-1px)}
  .price.is-tabs .price__p{transition:transform .18s ease}
}

/* 6. Ссылки в тексте: аккуратное подчёркивание с отступом и толщиной */
.doc a,.price__notes a,.works__note a{text-decoration-thickness:1px;text-underline-offset:3px}
.doc a:hover,.price__notes a:hover,.works__note a:hover{text-decoration-thickness:2px}

/* На 320-360 три колонки сжимают «от 3 500 ₽» до разрыва со знаком рубля: там снова столбик */
@media (max-width:360px){
  .hero__nums{grid-template-columns:minmax(0,1fr)}
  .hero__nums>div{border-left:0;border-top:1px solid var(--line);padding:11px 0}
  .hero__nums>div:first-child{border-top:0;padding-top:0}
  .hero__nums b{font-size:19px}
  .hero__nums span{font-size:12.5px}
}

/* 08.11.2026: вкладки галереи работ */
.gal__tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.gal__tab{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:14.5px;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.gal__tab span{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.gal__tab.is-on{background:var(--green);border-color:var(--green);color:#fff}
.gal__tab.is-on span{color:rgba(255,255,255,.75)}
.gal__tab:focus-visible{outline:3px solid var(--green-dk);outline-offset:2px}
.gal__item[hidden]{display:none}

/* 09.11.2026: 3D-коронка на первом экране (референс Алексея: зелёная wireframe-модель) */
.hero3d{position:relative;aspect-ratio:3/2;border-radius:var(--radius);overflow:hidden;background:linear-gradient(160deg,#f8fbf9,#e7f0ea);box-shadow:0 18px 40px rgba(38,49,43,.10)}
.hero3d__poster{display:block;width:100%;height:100%;object-fit:cover;transition:opacity .5s ease}
.hero3d__cv{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .6s ease}
.hero3d.is-ready .hero3d__cv{opacity:1}
.hero3d.is-ready .hero3d__poster{opacity:0}
.hero3d__cap{position:absolute;left:0;right:0;bottom:0;margin:0;padding:10px 16px;font-size:12.5px;color:var(--muted);background:linear-gradient(0deg,rgba(255,255,255,.9),rgba(255,255,255,0))}

/* 09.11.2026: галерея работ в два ряда с горизонтальной прокруткой (Алексей: третья строка не нужна) */
.gal--grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-auto-columns:clamp(190px,19vw,250px);gap:14px 12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:2px 2px 12px;scrollbar-width:thin;align-items:start}
.gal--grid .gal__item{scroll-snap-align:start;margin:0;min-width:0}
.gal--grid .gal__item button{width:100%;height:clamp(140px,14.5vw,196px);aspect-ratio:auto;background:#0d120f}
.gal--grid .gal__item img{width:100%;height:100%;object-fit:cover}
.gal--grid .gal__item figcaption{font-size:12.5px;line-height:1.25;margin-top:8px}
@media (max-width:620px){.gal--grid{grid-auto-columns:56vw;gap:12px 10px}.gal--grid .gal__item button{height:38vw}}

/* 09.11.2026: та же canvas-модель коронки вынесена на первый экран крупным планом */
.crown--hero{max-width:none;margin:0;aspect-ratio:3/2;display:flex;flex-direction:column;justify-content:center}
.crown--hero canvas{width:100%;height:100%;aspect-ratio:auto}
.crown--hero figcaption{display:none}
.crown--hero{position:relative}
@media (max-width:900px),(max-height:700px){.crown--hero{display:flex}}

/* 09.11.2026: бегущая строка с материалами под цифрами первого экрана (просьба Алексея) */
.marquee{overflow:hidden;margin-top:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee__row{display:flex;align-items:center;gap:26px;white-space:nowrap;width:max-content;animation:mq 90s linear infinite;will-change:transform}
.marquee span{font-size:14.5px;color:var(--muted);letter-spacing:.02em}
.marquee i{display:block;width:5px;height:5px;border-radius:50%;background:var(--sage);flex:0 0 auto}
@keyframes mq{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion:reduce){.marquee__row{animation:none}}

/* 09.11.2026 техосмотр: на планшете модель не выдавливает цифры за сгиб */
@media (max-width:1100px){
  .crown--hero{aspect-ratio:auto;height:clamp(220px,38vw,330px)}
}
@media (max-width:620px){
  .crown--hero{height:clamp(190px,54vw,260px)}
}
/* новая строка кнопок ленты и куки не поверх контента */
@media (max-width:900px){
  .ck{bottom:12px}
}

/* 09.11.2026: блок названия выровнен по центру логотипа, ИТС жирнее */
.brand>span{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.brand{align-items:center}