/* Сайт «Ионизаторы воды премиум класса» — kangen.johnnykole.com.
   Свёрстан вручную по выгрузке из Тильды: размеры, цвета, отступы и тексты
   сняты с оригинала замерами (не на глаз). Правится по секциям — ищи
   комментарии вида «5. О КОМПАНИИ» в index.html; палитра — в :root ниже.
   Шрифт один: Lora 400..700 (вес 300 в макете рисуется как 400 — так же,
   как в оригинале: в Lora нет светлого начертания). */



@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIhMX1D_JOuMw_LLPtLp_A.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIhMX1D_JOuMw_LJftLp_A.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* math */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIhMX1D_JOuMw_LXftLp_A.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-209F, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIhMX1D_JOuMw_LT_tLp_A.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AE, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F8D0-1F8D8, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FAC6, U+1FAC8, U+1FACC-1FADD, U+1FADF-1FAEB, U+1FAEF-1FAFA, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIhMX1D_JOuMw_LLvtLp_A.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIhMX1D_JOuMw_LL_tLp_A.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIhMX1D_JOuMw_LIftL.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIvMX1D_JOuMwf7I-NP.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIvMX1D_JOuMw77I-NP.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* math */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIvMX1D_JOuM3b7I-NP.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-209F, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIvMX1D_JOuM2T7I-NP.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AE, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F8D0-1F8D8, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FAC6, U+1FAC8, U+1FACC-1FADD, U+1FADF-1FAEB, U+1FAEF-1FAFA, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIvMX1D_JOuMwX7I-NP.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIvMX1D_JOuMwT7I-NP.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/0QIvMX1D_JOuMwr7Iw.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;
}




/* ---------- ПАЛИТРА И ОСНОВА ---------- */
:root{
  --navy:#0b1f3a;        /* тёмные карточки, кнопка «Сравнительная таблица» */
  --ink:#111827;         /* кнопка «Подробнее» */
  --gold:#c8a96a;        /* кнопка «Купить» */
  --cream:#ffffee;       /* текст на тёмном и пункты меню */
  --mist:#f5f7fa;        /* фон полосы «Канген вода» */
  --mark:#ff6c47;        /* плашки ТОП / Новая модель / НОВИНКА */
  --muted:#757575;       /* подписи ролей в карточках «Кто рекомендует» */
  --line:rgba(0,0,0,.1); /* разделители в списке моделей */
  --serif:'Lora',Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--serif);
  font-size:16px;
  color:#000;
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3{margin:0;font-weight:600}

/* Контейнеры: 1160 на широком экране, 940 на планшете, 100%-40 на телефоне.
   .wrap--narrow — колонка в 10/12 ширины (видео и список моделей). */
.wrap{width:1200px;max-width:100%;margin:0 auto;padding:0 20px}
.wrap--narrow > *{width:960px;max-width:100%;margin-left:auto;margin-right:auto}

/* ---------- 1. МЕНЮ ---------- */
.menu{
  position:fixed;top:0;left:0;right:0;z-index:900;
  height:35px;background:#000;
}
.menu__in{position:relative;height:35px;padding:0 40px;display:flex;align-items:center}
.menu__list{display:flex;align-items:center;gap:34px}
.menu__list--right{margin-left:auto}
.menu a{font-size:16px;font-weight:600;color:var(--cream);line-height:20px}
.menu a:hover{opacity:.7}
.menu__logo{position:absolute;left:50%;top:1px;transform:translateX(-50%)}
.menu__logo img{width:30px;height:30px}

/* Мобильная шапка с бургером (≤980) */
.mmenu{display:none;position:relative;z-index:900;background:#000}
.mmenu__bar{min-height:64px;padding:20px;display:flex;align-items:center;justify-content:space-between}
.mmenu__logo img{width:30px;height:30px}
.mmenu__burger{width:28px;height:20px;position:relative;background:none;border:0;padding:0;cursor:pointer}
.mmenu__burger span{position:absolute;left:0;right:0;height:2px;background:#fff;transition:.25s}
.mmenu__burger span:nth-child(1){top:0}
.mmenu__burger span:nth-child(2){top:9px}
.mmenu__burger span:nth-child(3){top:18px}
.mmenu.is-open .mmenu__burger span:nth-child(1){transform:translateY(9px) rotate(45deg)}
.mmenu.is-open .mmenu__burger span:nth-child(2){opacity:0}
.mmenu.is-open .mmenu__burger span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
.mmenu__list{display:none;padding:0 20px 24px}
.mmenu.is-open .mmenu__list{display:block}
.mmenu__list a{display:block;padding:11px 0;font-size:18px;font-weight:600;color:var(--cream)}

/* ---------- 2. ОБЛОЖКА ---------- */
.cover{
  height:70vh;min-height:430px;
  display:flex;align-items:center;justify-content:center;
  background-image:linear-gradient(to bottom, rgba(14,42,79,1), rgba(23,23,23,1));
}
.cover__title{
  width:100%;max-width:1160px;padding:24px 0 40px;
  font-size:82px;line-height:1.17;font-weight:600;letter-spacing:2px;
  color:#fff;text-align:center;
}
.cover__title .thin{font-weight:300}

/* ---------- 3. ОБО МНЕ ---------- */
.about{padding:60px 0 30px}
.about__grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.about__photo{min-height:120vh;background:url(img/evgeniy.jpg) center/cover no-repeat}
.about__card{
  background:var(--navy);padding:60px;
  display:flex;flex-direction:column;justify-content:center;
}
.about__title{font-size:42px;line-height:1.23;color:#fff;margin-bottom:24px}
.about__line{width:50px;height:3px;background:#fff;opacity:.6}
.about__text{margin-top:23px;font-size:20px;line-height:31px;font-weight:400;color:var(--cream)}
.about__text strong{font-weight:700}

/* ---------- 4. ПОЛОСА «КАНГЕН ВОДА» ---------- */
.strip{background:var(--mist);padding:30px 0 45px;text-align:center}
.strip__title{font-size:36px;line-height:1.23;font-weight:700;margin-bottom:15px}
.strip__text{margin-top:8px;padding-bottom:6px;font-size:20px;line-height:31px;font-weight:300}

/* ---------- 5. О КОМПАНИИ ---------- */
.company{padding:60px 0}
.company__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
.company__photos{display:flex;flex-direction:column;gap:20px}
.company__big{aspect-ratio:1/1;background:url(img/oshiro.jpg) center/cover no-repeat}
.company__small{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.company__small div{aspect-ratio:1/1;background-size:cover;background-position:center}
.company__card{background:var(--navy);padding:44px 50px;color:#fff}
.company__title{font-size:30px;line-height:1.45;font-weight:700;margin-bottom:20px}
.company__text{font-size:18px;line-height:20px;font-weight:300;padding-bottom:20px}
.company__text strong{font-weight:700}
.company__text .cream{color:var(--cream)}

/* ---------- 6. ЧТО ТАКОЕ КАНГЕН ВОДА ---------- */
.kangen{padding:60px 0}
.kangen__title{max-width:700px;margin:0 auto;padding-bottom:20px;font-size:46px;line-height:1.23;text-align:center}
.kangen__lead{max-width:700px;margin:0 auto;padding-bottom:40px;font-size:24px;line-height:1.2;letter-spacing:.5px;text-align:center}
.kangen__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.kangen__img{aspect-ratio:360/220;background-size:cover;background-position:center}
.kangen__name{margin:27px 0 12px;font-size:26px;line-height:1.23}
.kangen__text{margin:17px 0 25px;font-size:18px;line-height:27.9px;font-weight:300}

/* ---------- 7. КТО РЕКОМЕНДУЕТ ---------- */
.recommend{position:relative;padding:60px 0;background:url(img/leaves.jpg) center/cover no-repeat}
.recommend::before{content:'';position:absolute;inset:0;background:#000;opacity:.4}
.recommend__in{position:relative;padding:90px 0}
.recommend__title{font-size:48px;line-height:1.23;color:#fff;text-align:center;margin-bottom:60px}
.recommend__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 40px;margin-bottom:30px}
.rcard{background:#fff;border-radius:4px;padding:40px}
.rcard__top{display:flex;align-items:center}
.rcard__ava{width:50px;height:50px;border-radius:50%;margin-right:12px;flex:0 0 auto;object-fit:cover}
.rcard__name{font-size:18px;line-height:24.3px;font-weight:600}
.rcard__role{font-size:16px;line-height:16px;font-weight:300;color:var(--muted)}
.rcard__text{margin-top:25px;font-size:18px;line-height:19.8px;font-weight:300}

/* ---------- 8. ВИДЕО ПРЕЗЕНТАЦИЯ ---------- */
.video{padding:15px 0 45px;background:#fff}
.video__title{font-size:46px;line-height:1.23;text-align:center}
.video__box{
  display:block;position:relative;margin-top:55px;aspect-ratio:16/9;border-radius:15px;overflow:hidden;
  background:#000 url(img/video-poster.jpg) center/cover no-repeat;cursor:pointer;border:0;padding:0;
}
.video__play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:84px;height:60px;border-radius:14px;background:rgba(0,0,0,.72);
  display:flex;align-items:center;justify-content:center;transition:background .2s;
}
.video__box:hover .video__play{background:#e00}
.video__play::after{content:'';border-style:solid;border-width:13px 0 13px 22px;border-color:transparent transparent transparent #fff;margin-left:4px}
.video__box iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- 9. МОДЕЛИ И ЦЕНЫ ---------- */
.models{padding:30px 0 60px}
.models__title{padding-bottom:50px;font-size:46px;line-height:1.23;text-align:center}
.model{
  display:grid;grid-template-columns:200px 1fr 161px;column-gap:20px;
  padding:15px 0;border-bottom:1px solid var(--line);
}
.model__imgwrap{position:relative;width:200px}
.model__img{width:200px;height:200px;object-fit:cover}
.model__mark{
  position:absolute;left:10px;top:10px;
  font-size:9px;font-weight:600;color:#fff;background:var(--mark);
  padding:4.5px 9px;border-radius:5px;line-height:1.2;white-space:nowrap;
}
.model__name{font-size:20px;line-height:30px;font-weight:600}
.model__descr{margin-top:8px;font-size:18px;line-height:27.9px;font-weight:300}
.model__price{margin-bottom:15px;font-size:20px;line-height:27px;font-weight:600}
.model__btns{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.btn-sm{
  display:inline-block;font-size:13px;line-height:18.2px;font-weight:600;
  border-radius:5px;padding:8.4px 15px;text-align:center;cursor:pointer;border:0;
  font-family:inherit;transition:opacity .2s;
}
.btn-sm:hover{opacity:.85}
.btn-sm--dark{background:var(--ink);color:#fff}
.btn-sm--gold{background:var(--gold);color:#000;border:1px solid #fff;padding:7.4px 15px}

/* Попап карточки аппарата — как в оригинале: белый экран во весь размер,
   слева фото 560×560, справа название, цена, кнопка и характеристики. */
.pop{position:fixed;inset:0;z-index:1000;background:#fff;display:none;overflow-y:auto}
.pop.is-open{display:block}
.pop__box{max-width:1240px;margin:65px auto 60px;padding:0 40px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.pop__img{display:flex;align-items:center;justify-content:center}
.pop__img img{width:100%;aspect-ratio:1/1;object-fit:contain}
.pop__name{font-size:24px;line-height:32.4px;font-weight:600}
.pop__price{margin-top:21px;font-size:20px;line-height:27px;font-weight:600}
.pop__buy{display:inline-block;margin-top:20px;padding:12.7px 30px;border-radius:5px;
  background:var(--ink);color:#fff;font-size:14px;line-height:19.6px;font-weight:600}
.pop__buy:hover{opacity:.9}
.pop__specs{margin-top:30px;font-size:18px;line-height:27.9px;font-weight:300}
.pop__back{position:absolute;left:20px;top:22px;border:0;background:none;cursor:pointer;
  font-family:inherit;font-size:15px;font-weight:300;color:#000}
.pop__back:hover{opacity:.6}
.pop__close{position:absolute;right:20px;top:16px;width:32px;height:32px;border:0;background:none;
  color:#000;font-size:32px;line-height:1;cursor:pointer;font-family:inherit}
.pop__close:hover{opacity:.6}

/* ---------- 10. ДВЕ КНОПКИ ---------- */
.links{padding:0 0 30px}
.links__row{display:flex;justify-content:center;gap:20px;padding:0 20px;flex-wrap:wrap}
.btn-lg{
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  min-height:60px;padding:18.8px 60px;border-radius:15px;
  font-size:16px;line-height:22.4px;font-weight:600;transition:opacity .2s;
}
.btn-lg:hover{opacity:.85}
.btn-lg--dark{background:var(--navy);color:#fff}
.btn-lg--outline{border:3px solid #000;color:#000;padding:15.8px 60px}

/* ---------- 11. СОЦСЕТИ ---------- */
.socials{padding:15px 0}
.socials__row{display:flex;justify-content:center;gap:14px}
.socials__row a{width:48px;height:48px;display:block;margin-bottom:4px}
.socials__row svg{width:48px;height:48px;display:block}

/* ---------- 12. ПОДВАЛ ---------- */
.footer{background:#fff;min-height:100px;display:flex;align-items:center}
.footer__in{width:100%;padding:0 40px;display:grid;grid-template-columns:250px 1fr 250px;align-items:center}
.footer__col{font-size:14px;line-height:18.9px;font-weight:600}
.footer__col--mid{text-align:center;padding-right:16px}
.footer__col--mid a{color:#222}
.footer__col--mid a:hover{text-decoration:underline}
.footer__col--right{text-align:right}

/* ---------- 13. ПЛАВАЮЩИЕ КНОПКИ ---------- */
.fab{position:fixed;z-index:950;width:60px;height:60px;border-radius:50%;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:transform .2s}
.fab:hover{transform:scale(1.06)}
.fab svg{width:28px;height:28px;fill:#fff}
.fab--chat{right:65px;bottom:108px;background:#1f7ae0}
.fab--write{right:50px;bottom:50px;background:#033c79}
.fab-list{position:fixed;right:65px;bottom:178px;z-index:950;display:none;flex-direction:column;gap:10px}
.fab-list.is-open{display:flex}
.fab-list a{
  width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#033c79;box-shadow:0 2px 10px rgba(0,0,0,.25);
}
.fab-list svg{width:26px;height:26px;fill:#fff}
.write{position:fixed;right:50px;bottom:120px;z-index:960;width:320px;max-width:calc(100vw - 40px);
  background:#fff;border-radius:10px;box-shadow:0 10px 40px rgba(0,0,0,.25);padding:24px;display:none}
.write.is-open{display:block}
.write__title{font-size:20px;line-height:1.3;font-weight:600;margin-bottom:6px}
.write__hint{font-size:15px;line-height:1.4;font-weight:300;color:#555;margin-bottom:16px}
.write__links{display:flex;flex-direction:column;gap:8px}
.write__links a{
  display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid #e3e3e3;border-radius:8px;
  font-size:16px;font-weight:600;
}
.write__links a:hover{border-color:var(--navy)}
.write__links svg{width:22px;height:22px;flex:0 0 auto}
.write__close{position:absolute;right:10px;top:6px;border:0;background:none;font-size:26px;line-height:1;color:#888;cursor:pointer;font-family:inherit}

/* Пять мест, где в Тильде назначен шрифт TildaSans. Тильда его не подгружает,
   поэтому на живом сайте браузер рисует их системным Times — повторяем один в один,
   иначе эти заголовки шире и на телефоне переносятся в две строки. */
.kangen__title,
.video__title,
.models__title,
.rcard__role,
.rcard__text{font-family:'Times New Roman',Times,serif}

/* ---------- ПЛАНШЕТ (981–1199) ---------- */
/* Ступени взяты из оригинала замерами: типографика меняется на 1200, 980 и 640,
   ширина контейнера — на 1200, 960 и 640, колонки встают в столбец на 960,
   карточки аппаратов — на 480. */
@media (max-width:1199px){
  .wrap{width:960px;padding:0 10px}
  .wrap--narrow > *{width:780px}
  .company__grid{gap:18.8px}
  .kangen__grid{gap:20px}
  .recommend__grid{gap:30px 20px}
  .model{grid-template-columns:200px 1fr 147px}
  .cover__title{font-size:78px}
  .about__title{font-size:38px}
  .company__title{font-size:26px}
  .kangen__lead{font-size:22px}
  .kangen__name{font-size:24px}
  .recommend__title{font-size:44px}
  .model__price{font-size:18px}
  .btn-lg{padding:18.8px 45px}
  .btn-lg--outline{padding:15.8px 45px}
}

/* ---------- БУРГЕР-МЕНЮ И ЗАГОЛОВОК «О КОМПАНИИ» (≤980) ---------- */
@media (max-width:980px){
  .menu{display:none}
  .mmenu{display:block}
  .company__title{font-size:21px}
  .footer{padding:0 0 45px}
  .footer__in{grid-template-columns:1fr;gap:30px;padding:45px 20px 0;text-align:center}
  .footer__col{text-align:center}
  .footer__col--mid{padding:0}
  .footer__col--right{text-align:center}
}

/* ---------- КОЛОНКИ В ОДИН СТОЛБЕЦ (≤960) ---------- */
@media (max-width:960px){
  .wrap{width:640px;padding:0 20px}
  .wrap--narrow > *{width:100%}
  .about__grid{grid-template-columns:1fr;gap:0}
  .company__grid{grid-template-columns:1fr;gap:20px}
  .company__card{order:-1}   /* как в оригинале на узком экране: текст перед фото */
  .company__small{gap:14px}
  .company__photos{gap:16px}
  .kangen__grid{grid-template-columns:1fr;gap:45px}
  .kangen__name{margin-top:20px}
  .recommend__in{padding:60px 0}
  .recommend__title{margin-bottom:40px}
  .recommend__grid{grid-template-columns:1fr;gap:30px;margin-bottom:0}
  .rcard{padding:30px}
  .model{grid-template-columns:200px 1fr;row-gap:15px}
  .model__right{grid-column:2}
  .model__price{text-align:left}
  .model__btns{align-items:flex-start}
  .pop__box{grid-template-columns:1fr;gap:24px;margin:60px auto 40px;padding:0 20px}
  .btn-lg{padding:18.8px 30px}
  .btn-lg--outline{padding:15.8px 30px}
}

/* Ролик в диапазоне 641–960 в оригинале шире текста — во всю ширину контейнера */
@media (max-width:960px) and (min-width:641px){
  .video .wrap--narrow{padding:0}
}

/* ---------- ТЕЛЕФОННАЯ ТИПОГРАФИКА (≤640) ---------- */
@media (max-width:640px){
  .wrap{width:100%}
  .cover__title{font-size:30px;line-height:1;padding:24px 10px 40px}
  .about__title{font-size:30px}
  .about__text{line-height:29px}
  .strip__text{line-height:29px}
  .kangen__lead{font-size:20px}
  .kangen__name{font-size:22px}
  .kangen__text{line-height:26.1px}
  .about__card{padding:30px 20px}
  .recommend__title{font-size:30px;margin-bottom:40px}
  .model__price{font-size:16px}
  .footer__col{font-size:12px;line-height:16.2px}
}

/* ---------- ТЕЛЕФОН (≤480) ---------- */
@media (max-width:480px){
  .video{padding:90px 0}
  .company__card{padding:20px}
  .model{grid-template-columns:1fr;row-gap:12px}
  .model__imgwrap{width:100%}
  .model__img{width:100%;height:auto;aspect-ratio:1/1}
  .model__right{grid-column:1}
  .model__btns{align-items:stretch;gap:8px}
  .btn-sm{padding:10.9px 15px}
  .btn-sm--gold{padding:9.9px 15px}
  .links__row{flex-direction:column;align-items:stretch}
  .fab--chat{right:20px;bottom:88px}
  .fab--write{right:20px;bottom:20px}
  .fab-list{right:20px;bottom:158px}
  .write{right:20px;left:20px;bottom:90px;width:auto}
}