/* Услуга Плюс — CSS услуг и действующего нейроинтерфейса. 08.10.2026. Полная замена поля CSS, без тегов style. */ /* ==================== UP v2: библиотека стилей услуг УслугаПлюс (дизайн-планка НМ, 26.08.2026). Ниже — не удалять ==================== */ :root{ --up-navy:#0a2540; --up-ink:#1f2a3d; --up-ink-soft:#46536b; --up-green:#279a43; --up-green-h:#1e7c34; --up-blue:#2f6fe4; --up-violet:#8b5cf6; --up-hero1:#0a1f3c; --up-hero2:#164374; --up-cream:#fae7b5; --up-bg:#edf2fa; --up-card:#ffffff; --up-line:#dde6f2; --up-r:18px; --up-font:'Manrope','Roboto',Arial,sans-serif; } /* Полоса на всю ширину + контейнер. Класс перебивает старое глобальное section{max-width:600px} */ .up-band{width:100%} .up-band--tint{background:var(--up-bg)} .up-sec{width:100%;max-width:1140px;margin:0 auto;padding:64px 20px;box-sizing:border-box; font-family:var(--up-font);color:var(--up-ink);font-size:18px;line-height:1.6} .up-sec *,.up-header *,.up-footer *{box-sizing:border-box} /* Тёмная полоса (hero, подвал) — градиент как у эталона */ .up-band--dark{background:linear-gradient(135deg,var(--up-hero1) 0%,var(--up-hero2) 100%);color:#e8eef8} .up-band--dark .up-sec{color:#e8eef8} .up-band--dark .up-sec h1,.up-band--dark .up-sec h2{color:#fff} .up-band--dark .up-lead{color:#cfdcef} /* Hero: точечный узор справа (чистый CSS, без картинок) */ .up-hero .up-sec{position:relative;padding:76px 20px} .up-hero .up-sec::before{content:"";position:absolute;right:0;top:40px;width:38%;height:70%; background-image:radial-gradient(rgba(255,255,255,.22) 1.5px,transparent 1.5px); background-size:20px 20px;opacity:.5;pointer-events:none} .up-hero .up-zebra{position:relative;z-index:1} /* Надзаголовок капсом (eyebrow) */ .up-eyebrow{font:700 13px/1 var(--up-font);letter-spacing:.14em;text-transform:uppercase; color:var(--up-blue);margin:0 0 14px} .up-band--dark .up-eyebrow{color:#8fb4ef} /* Акцентные слова в заголовке — градиент */ .up-accent{background:linear-gradient(90deg,#5b8cff,#a06bff);-webkit-background-clip:text;background-clip:text;color:transparent} /* Заголовки */ .up-sec h1{font-size:44px;line-height:1.12;color:var(--up-navy);margin:0 0 18px;font-weight:800;letter-spacing:-.01em} .up-sec h2{font-size:34px;line-height:1.15;color:var(--up-navy);margin:0 0 30px;font-weight:800;text-align:center;letter-spacing:-.01em} .up-sec h2::after{content:"";display:block;width:56px;height:4px;border-radius:2px; background:linear-gradient(90deg,#5b8cff,#a06bff);margin:14px auto 0} .up-sec h2[style*="left"]::after{margin-left:0} .up-sec h3{font-size:19px;color:var(--up-navy);margin:0 0 8px;font-weight:700} .up-lead{font-size:20px;margin:0 0 24px;color:var(--up-ink-soft)} /* Ряд крупных цифр (как «4 поля · 15 секунд · 2–3 варианта») */ .up-stats{display:flex;justify-content:flex-start;gap:48px;flex-wrap:wrap;margin-top:34px} .up-stats>div{text-align:left} .up-stats b{display:block;font:800 34px/1.1 var(--up-font); background:linear-gradient(90deg,#5b8cff,#a06bff);-webkit-background-clip:text;background-clip:text;color:transparent} .up-stats span{font-size:15px;color:var(--up-ink-soft)} .up-band--dark .up-stats span{color:#a9bcd8} /* Кнопки и телефон (перебивают старое глобальное button{...}) */ .up-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px; background:linear-gradient(180deg,#2ea24a,#1f7a34);color:#fff!important;font:700 19px/1 var(--up-font); height:58px;padding:0 32px;margin:0;border:none;border-radius:14px; text-decoration:none;cursor:pointer;box-shadow:0 12px 26px rgba(31,122,52,.32); transition:transform .15s,box-shadow .15s} .up-btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(31,122,52,.4);color:#fff} .up-btn--ghost{background:transparent;border:1.5px solid rgba(255,255,255,.45);box-shadow:none} .up-btn--ghost:hover{background:rgba(255,255,255,.08);border-color:#fff;box-shadow:none} .up-hero-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center} .up-cta-note{margin:12px 0 0;font-size:15px;color:#a9bcd8} .up-phone{font:800 26px/1.1 var(--up-font);color:var(--up-navy);text-decoration:none;white-space:nowrap} .up-band--dark a{color:#dfe8f5} /* Траст-чипсы под кнопкой */ .up-trust{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;font-size:15px;color:var(--up-ink-soft)} .up-trust span{background:#eef3fb;border:1px solid var(--up-line);border-radius:999px;padding:8px 14px} .up-trust b{color:var(--up-navy)} .up-band--dark .up-trust{color:#d6e2f3} .up-band--dark .up-trust span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)} .up-band--dark .up-trust b{color:#fff} .up-band--dark .up-trust span.up-badge{background:var(--up-cream);border-color:var(--up-cream);color:#6b5500} .up-badge{display:inline-block;background:var(--up-cream);color:#6b5500;font-weight:700; border-radius:999px;padding:8px 14px;font-size:15px;border:none} /* Зебра: текст+фото */ .up-zebra{display:flex;align-items:center;gap:48px} .up-zebra>*{flex:1;min-width:0} .up-zebra--rev{flex-direction:row-reverse} .up-media img{width:100%;height:auto;display:block;border-radius:20px;box-shadow:0 20px 50px rgba(10,37,64,.16)} .up-band--dark .up-media img{outline:1px solid rgba(255,255,255,.16);box-shadow:0 28px 64px rgba(0,0,0,.45)} /* Плитки (ситуации, услуги) */ .up-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:0;padding:0;list-style:none} .up-card{background:var(--up-card);border:1px solid var(--up-line);border-radius:var(--up-r);padding:30px 26px 26px; position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(10,37,64,.07); transition:transform .15s,box-shadow .15s} .up-card::before{content:"";position:absolute;top:0;left:0;right:0;height:5px; background:linear-gradient(90deg,#5b8cff,#a06bff)} .up-cards li:nth-child(even) .up-card::before,.up-cards li.up-card:nth-child(even)::before{ background:linear-gradient(90deg,#34b45c,#1e7c34)} .up-card p{margin:0;font-size:16px;color:var(--up-ink-soft)} /* Карточка с фото услуги: картинка сверху, текст под ней */ .up-card--img{padding:0 0 24px} .up-card--img::before{display:none} .up-card--img img{width:100%;height:172px;object-fit:cover;display:block;margin:0 0 16px;border-radius:var(--up-r) var(--up-r) 0 0} .up-card--img h3,.up-card--img p{padding:0 24px} /* Равная высота карточек в ряду — низ ровный, без провалов */ .up-cards li{display:flex} .up-card{width:100%;display:flex;flex-direction:column} .up-card--img p{margin-top:auto} a.up-card{text-decoration:none;color:inherit} .up-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(10,37,64,.14);border-color:#c9d8ef} /* Шаги «как работаем» — номера с градиентом */ .up-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:0;padding:0;list-style:none;counter-reset:s} .up-steps li{background:#fff;border:1px solid var(--up-line);border-radius:var(--up-r);padding:26px} .up-steps li::before{counter-increment:s;content:counter(s);display:inline-flex;align-items:center;justify-content:center; width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#5b8cff,#a06bff);color:#fff; font:800 18px/1 var(--up-font);margin-bottom:14px} /* Прайс — карточкой */ .up-price{width:100%;max-width:700px;margin:0 auto;border-collapse:separate;border-spacing:0; background:#fff;border:1px solid var(--up-line);border-radius:var(--up-r);overflow:hidden; box-shadow:0 10px 30px rgba(10,37,64,.06)} .up-price td{padding:15px 22px;border-bottom:1px solid var(--up-line);font-size:17px} .up-price tr:last-child td{border-bottom:none} .up-price td:last-child{text-align:right;font-weight:800;color:var(--up-navy);white-space:nowrap} /* Отзывы — вид ленты: имя сверху, район и дата серым, текст без кавычек */ .up-reviews{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0;padding:0;list-style:none} .up-review{background:#fff;border:1px solid var(--up-line);border-radius:var(--up-r);padding:22px;font-size:16px; box-shadow:0 6px 20px rgba(10,37,64,.05)} .up-review footer{margin-top:10px;color:#666;font-size:14px} .up-review header{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px} .up-review header b{color:var(--up-navy);font-size:16px} .up-review header span{color:#8a94a8;font-size:14px} .up-ava{width:44px;height:44px;border-radius:50%;flex:0 0 44px;display:inline-flex;align-items:center;justify-content:center; color:#fff;font:800 18px/1 var(--up-font);font-style:normal;background:linear-gradient(135deg,#5b8cff,#a06bff)} .up-reviews li:nth-child(even) .up-ava{background:linear-gradient(135deg,#34b45c,#1e7c34)} .up-review p{margin:0;color:var(--up-ink-soft)} .up-rev-add{text-align:center;margin:20px 0 0} .up-rev-add a{display:inline-block;color:#fff;font-size:15px;font-weight:700;text-decoration:none; border:none;border-radius:999px;padding:12px 24px;background:linear-gradient(90deg,#2f6fe4,#8b5cf6); box-shadow:0 10px 24px rgba(47,111,228,.3)} .up-rev-add a:hover{box-shadow:0 14px 30px rgba(47,111,228,.42)} /* FAQ на details/summary — без JS, текст виден роботам */ .up-faq{max-width:780px;margin:0 auto;background:#fff;border:1px solid var(--up-line);border-radius:var(--up-r); padding:6px 26px;box-shadow:0 10px 30px rgba(10,37,64,.06)} .up-faq details{border-bottom:1px solid var(--up-line)} .up-faq details:last-child{border-bottom:none} .up-faq summary{cursor:pointer;font-weight:700;font-size:18px;color:var(--up-navy); padding:18px 34px 18px 0;list-style:none;position:relative} .up-faq summary::-webkit-details-marker{display:none} .up-faq summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%); font-size:26px;color:var(--up-blue)} .up-faq details[open] summary::after{content:"−"} .up-faq details p{margin:0 0 18px;color:var(--up-ink-soft)} /* Шапка */ .up-header{display:flex;align-items:center;justify-content:space-between;gap:24px; max-width:1140px;margin:0 auto;padding:16px 20px;font-family:var(--up-font)} .up-header img{height:44px;width:auto;display:block} .up-header-right{display:flex;align-items:center;gap:22px} .up-hours{font-size:13px;color:#68748c} /* Тёмная шапка (wrapper с up-band--dark) — единая тёмная зона с hero */ .up-band--dark .up-nav a{color:#dfe8f5} .up-band--dark .up-nav a:hover{color:#fff} .up-band--dark .up-phone{color:#fff} .up-band--dark .up-hours{color:#a9bcd8} .up-band--dark .up-burger summary{color:#fff;border-color:rgba(255,255,255,.28)} /* Подвал: светлый по умолчанию; тёмный — при классе up-band--dark на обёртке */ .up-footer{max-width:1140px;margin:0 auto;padding:44px 20px;text-align:center; font-family:var(--up-font);font-size:15px;color:#5b6780} .up-footer nav{padding-bottom:18px;border-bottom:1px solid var(--up-line);margin-bottom:18px!important} .up-footer a{color:var(--up-navy);text-decoration:none} .up-footer a:hover{color:var(--up-blue)} .up-footer address{font-style:normal;margin-top:8px} .up-band--dark .up-footer{color:#a9bcd8} .up-band--dark .up-footer nav{border-bottom-color:rgba(255,255,255,.12)} .up-band--dark .up-footer a{color:#dfe8f5} .up-band--dark .up-footer a:hover{color:#fff} /* Cookie-уведомление (152-ФЗ): баннер в подвале каждой страницы */ .up-cookie{position:fixed;left:16px;bottom:16px;z-index:7000;max-width:440px;background:#fff; border:1px solid var(--up-line);border-radius:14px;box-shadow:0 16px 40px rgba(10,37,64,.22); padding:16px 18px;font:15px/1.5 var(--up-font);color:var(--up-ink)} .up-cookie a{color:var(--up-blue)} .up-cookie button{display:inline-block;margin-left:10px;background:var(--up-navy);color:#fff;border:none; border-radius:10px;padding:8px 18px;font:700 14px var(--up-font);cursor:pointer} /* Мобильная кнопка звонка — вставляется в hero-блок каждой страницы раздела */ .up-call-fab{position:fixed;left:12px;right:12px;bottom:12px;z-index:5000;display:none; height:56px;border-radius:16px;background:linear-gradient(180deg,#2ea24a,#1f7a34);color:#fff; font:700 19px/56px var(--up-font);text-align:center;text-decoration:none; box-shadow:0 10px 28px rgba(0,0,0,.3)} /* Мобильная фикс-панель: звонок + онлайн-заявка (заменяет одиночную up-call-fab) */ .up-fab-bar{position:fixed;left:12px;right:12px;bottom:12px;z-index:5000;display:none;gap:10px} .up-fab-call{flex:1.15;display:flex;align-items:center;justify-content:center;height:54px;border-radius:16px; background:linear-gradient(180deg,#2ea24a,#1f7a34);color:#fff!important;font:700 17px/1 var(--up-font); text-decoration:none;box-shadow:0 8px 22px rgba(0,0,0,.28)} .up-fab-order{flex:1;display:flex;align-items:center;justify-content:center;height:54px;border-radius:16px; background:#fff;color:var(--up-navy)!important;font:700 16px/1 var(--up-font);text-decoration:none; border:1px solid var(--up-line);box-shadow:0 8px 22px rgba(10,37,64,.18)} /* Перекраска стандартных форм Тильды — ТОЛЬКО на страницах с классом up-page (его ставит hero-блок) */ .up-page .t-submit{background:linear-gradient(180deg,#2ea24a,#1f7a34)!important;border-radius:14px!important; font-weight:700!important;height:56px!important} .up-page .t-input{border-radius:12px!important} /* Меню шапки */ .up-nav{display:flex;gap:24px;flex-wrap:wrap} .up-nav a{color:var(--up-navy);text-decoration:none;font:600 15px var(--up-font)} .up-nav a:hover{color:var(--up-blue)} .up-burger{display:none;position:relative} .up-burger summary{list-style:none;cursor:pointer;font:700 16px var(--up-font);color:var(--up-navy);padding:10px 14px;border:1px solid var(--up-line);border-radius:10px} .up-burger summary::-webkit-details-marker{display:none} .up-burger-menu{position:absolute;right:0;top:48px;background:#fff;border:1px solid var(--up-line);border-radius:14px;box-shadow:0 16px 40px rgba(10,37,64,.18);display:flex;flex-direction:column;gap:12px;padding:16px 20px;z-index:6000;min-width:230px} .up-burger-menu a{color:var(--up-navy);text-decoration:none;font:600 17px var(--up-font)} /* Планшет */ @media (max-width:960px){ .up-sec h1{font-size:34px} .up-sec h2{font-size:27px} .up-cards{grid-template-columns:1fr 1fr} .up-zebra{gap:28px} .up-nav{display:none} .up-burger{display:block} .up-stats{gap:30px} } /* Мобильный */ @media (max-width:760px){ .up-sec{padding:40px 16px 48px} .up-hero .up-sec{padding:48px 16px 52px} .up-hero .up-sec::before{display:none} .up-sec h1{font-size:29px} .up-sec h2{font-size:24px} .up-lead{font-size:18px} .up-zebra{flex-direction:column} .up-zebra .up-media{order:-1} .up-cards,.up-steps,.up-reviews{grid-template-columns:1fr} .up-btn{width:100%;font-size:21px} .up-header .up-btn{display:none} .up-header{flex-wrap:wrap;gap:10px 14px;padding:12px 16px} .up-header img{height:34px} .up-hours{display:none} .up-phone{font-size:23px} .up-burger summary{padding:8px 12px;font-size:15px} .up-footer{padding:32px 16px;font-size:14px} .up-cookie{left:12px;right:12px;bottom:80px;max-width:none} .up-call-fab{display:block} .up-fab-bar{display:flex} body.up-page{padding-bottom:84px!important} .up-stats{gap:22px} .up-stats b{font-size:28px} } /* Сохранённые поправки стандартных блоков Тильды. */ @media screen and (min-width: 980px) and (max-width: 1366px) { .t967__list-item { margin-top: 10px; margin-bottom: 10px; } } .t850__wrap {padding: 12px 20px;} .t613__title {padding: 15px 20px;} .t613__wrapper {padding: 12px 30px;} .t-feed__buttons-wrapper {margin-top: 40px;} /* UP-NMX-COMPAT START — восстановление действующих GPT-инструментов, 08.10.2026 */ /* === NMX SITE BASE (02.10.26) — общие правила сайта, пережили очистку legacy-слоя nm-* === */ /* Старый слой nm-* (hero/формы/окна/токены --f --tx --red) снят 02.10.26; копия — library/02-page-build/legacy/custom-css-legacy-prefix-2026-10-02.css */ /* Global html/body overflow deliberately not restored. */ /* Общий сброс кнопок: держит отступ/радиус у .nmx-btn-circle .nmx-font-btn .nmx-feed-clear .nmx-remove-btn .nmx-answer-btn */ :where(button[class^="nmx-"],button[class*=" nmx-"],.nmx-form button,.nmx-feed-section button,.nmx-loading button){padding:10px 20px;border:none;border-radius:5px;font-size:16px;cursor:pointer;margin:5px;font-family:var(--nmx-f)} section:where([class^="nmx-"],[class*=" nmx-"]){width:100%;box-sizing:border-box} /* Поправки блоков Тильды */ /* === NMX START === */ /* NMX v0.9 — Группа 1 + Шаг 2.1 + Шаг 2.2 (photo) + Шаг 2.3 (markdown/math/download) + Шаг 2.4 (stt/tts) */ /* v0.9 UI-фиксы: лента ответов видна всегда, кнопка очистки скрыта пока пусто, плотный bottom-bar */ /* TOKENS */ :root{ --nmx-primary:#2b6cb0; --nmx-primary-dark:#1a4070; --nmx-grad-hero:linear-gradient(to bottom,#06101f 0%,#0c1d3a 40%,#132e55 70%,#1a4070 100%); --nmx-grad-form-wrap:linear-gradient(to bottom,#1a4070 0%,#1d4d82 30%,#235898 60%,#b0c1d4 100%); --nmx-grad-submit:linear-gradient(135deg,#1a4070,#2b6cb0); --nmx-bg-form:#dadfe4; --nmx-bg-feed:#f5f6fa; --nmx-bg-card:#fff; --nmx-bg-btn-soft:#ededeb; --nmx-bg-page:#f8f5f0; --nmx-tx:#1a1a1a; --nmx-tx-2:#444; --nmx-tx-3:#777; --nmx-red:#e24b4a; --nmx-red-dark:#a32d2d; --nmx-success:#22c55e; --nmx-border-soft:#dddce0; --nmx-violet:#7c5cbf; --nmx-pink:#d4618c; --nmx-gold:#c9a24c; --nmx-sky:#4a9ec8; --nmx-green:#5daa68; --nmx-fire:#e07040; --nmx-fb:rgba(255,255,255); --nmx-fb2:1.5px solid rgba(180,178,170,.45); --nmx-fc:rgba(30,100,200,.4); --nmx-fs:0 0 0 3px rgba(30,100,200,.08); --nmx-r-sm:8px; --nmx-r:12px; --nmx-r-lg:16px; --nmx-r-pill:24px; --nmx-f:'Google Sans',sans-serif; --nmx-fs-h1:42px; --nmx-fs-sub:21px; --nmx-fs-h2:20px; --nmx-fs-base:18px; --nmx-fs-small:16px; --nmx-w-tool:700px; --nmx-w-hero:680px; } @media(max-width:768px){ :root{--nmx-fs-h1:28px;--nmx-fs-sub:18px;--nmx-fs-base:19px;--nmx-fs-small:15px;--nmx-fs-h2:22px} } /* HERO */ .nmx-hero{position:relative;overflow:hidden;padding:30px 24px 10px;text-align:center;background:var(--nmx-grad-hero)} .nmx-hero *,.nmx-form-section *,.nmx-feed-section *,.nmx-loading *{font-family:var(--nmx-f);box-sizing:border-box} .nmx-hero__glow{position:absolute;border-radius:50%;pointer-events:none} .nmx-hero__glow--tr{top:-100px;right:-40px;width:420px;height:420px;background:radial-gradient(circle,rgba(60,130,220,.2) 0%,transparent 65%)} .nmx-hero__glow--bl{bottom:-80px;left:-60px;width:360px;height:360px;background:radial-gradient(circle,rgba(30,100,200,.14) 0%,transparent 60%)} .nmx-hero__glow--c{top:30%;left:55%;width:280px;height:280px;background:radial-gradient(circle,rgba(255,255,255,.03) 0%,transparent 60%)} .nmx-hero__inner{position:relative;z-index:1;max-width:var(--nmx-w-hero);margin:0 auto} .nmx-hero__badge{display:inline-block;font-size:16px;font-weight:400;letter-spacing:.12em;color:rgba(200,225,255,.95);border:1px solid rgba(200,225,255,.25);padding:7px 22px;border-radius:var(--nmx-r-pill);margin-bottom:18px;text-transform:uppercase} .nmx-hero__badge.nmx-pro-only{color:#f87b75;border-color:rgba(248,123,117,.5)} .nmx-hero h1{font-size:var(--nmx-fs-h1);font-weight:400;color:#fff;margin:20px 0 30px;line-height:1.2;letter-spacing:.02em} .nmx-hero__sub{font-size:var(--nmx-fs-sub);font-weight:300;color:rgba(255,255,255,.7);line-height:1.5} .nmx-hero__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:30px auto 0} .nmx-hero__card{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:14px 16px;text-align:left} .nmx-hero__icon{flex-shrink:0;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center} .nmx-hero__icon--bolt{background:rgba(245,190,60,.1);border:1px solid rgba(245,190,60,.18)} .nmx-hero__icon--mic{background:rgba(100,180,250,.1);border:1px solid rgba(100,180,250,.18)} .nmx-hero__icon--pro{background:rgba(160,120,240,.1);border:1px solid rgba(160,120,240,.18)} .nmx-hero__icon--free{background:rgba(80,210,170,.1);border:1px solid rgba(80,210,170,.18)} .nmx-hero__card-title,.nmx-hero__card-desc{font-size:16px;line-height:1.35} .nmx-hero__card-title{font-weight:400;color:rgba(255,255,255,.95)} .nmx-hero__card-desc{font-weight:300;color:rgba(255,255,255,.5);margin-top:2px} /* FORM */ .nmx-form-wrap{background:var(--nmx-grad-form-wrap);padding:40px 2px 56px} .nmx-form-section{max-width:var(--nmx-w-tool);margin:0 auto;background:var(--nmx-bg-form);border-radius:var(--nmx-r);padding:28px 20px 24px} .nmx-form-section h2{font-size:var(--nmx-fs-h2);font-weight:400;color:var(--nmx-tx);text-align:center;margin:0 0 24px;font-family:var(--nmx-f)} /* LABEL + COUNTER */ .nmx-form .nmx-label{display:flex;justify-content:space-between;align-items:baseline;font-size:var(--nmx-fs-base);color:var(--nmx-tx-2);margin-bottom:6px;font-weight:500;font-family:var(--nmx-f)} .nmx-form .nmx-label .nmx-char-count{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);transition:color .2s;font-weight:400} .nmx-form .nmx-label .nmx-char-count.overflow{color:var(--nmx-red)!important;font-weight:700} /* FIELD */ .nmx-form .nmx-field{position:relative;background:var(--nmx-fb);border:var(--nmx-fb2);border-radius:var(--nmx-r);margin-bottom:14px;transition:border-color .25s,box-shadow .25s,background .25s} .nmx-form .nmx-field:focus-within{border-color:var(--nmx-fc);box-shadow:var(--nmx-fs)} .nmx-form .nmx-field.overflow{border-color:var(--nmx-red)!important;box-shadow:0 0 0 3px rgba(226,75,74,.12)!important} .nmx-form .nmx-field.invalid{border-color:rgba(226,75,74,.5)} .nmx-form .nmx-input,.nmx-form .nmx-textarea{width:100%;border:none;padding:14px 50px 14px 14px;font-size:var(--nmx-fs-base);color:var(--nmx-tx);outline:none;font-family:var(--nmx-f);border-radius:var(--nmx-r)} .nmx-form .nmx-textarea{min-height:90px;resize:vertical;overflow:auto;display:block} .nmx-form .nmx-input::placeholder,.nmx-form .nmx-textarea::placeholder{color:var(--nmx-tx-3)} /* FIELD CONTROLS */ .nmx-form .nmx-field-controls{position:absolute;right:2px;top:3px;display:flex;align-items:center} .nmx-form .nmx-btn-circle{width:36px;height:36px;border-radius:50%;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:background .15s,transform .1s;padding:0} .nmx-form .nmx-btn-circle:active{transform:scale(.92)} .nmx-form .nmx-clear-btn{background:rgba(0,0,0,.05);color:var(--nmx-tx-3);display:none} .nmx-form .nmx-clear-btn.visible{display:flex} .nmx-form .nmx-clear-btn:hover{background:rgba(226,75,74,.08);color:var(--nmx-red)} .nmx-form .nmx-clear-btn svg{width:16px;height:16px;pointer-events:none} .nmx-form .nmx-field:has(textarea) .nmx-field-controls{top:auto;bottom:6px} .nmx-form .nmx-field:has(textarea) .nmx-textarea{padding-bottom:44px} /* SELECTS */ .nmx-form .nmx-selects{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-bottom:14px} .nmx-form .nmx-select{width:100%;border:var(--nmx-fb2);background-color:var(--nmx-fb);background-image:url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23888' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;border-radius:var(--nmx-r);padding:14px;font-size:var(--nmx-fs-base);color:var(--nmx-tx);font-family:var(--nmx-f);appearance:none;cursor:pointer;outline:none} .nmx-form .nmx-select:focus{border-color:var(--nmx-fc);box-shadow:var(--nmx-fs)} /* SUBMIT */ .nmx-form .nmx-submit{width:100%;border:none;background:var(--nmx-grad-submit);border-radius:var(--nmx-r);padding:16px;font-size:var(--nmx-fs-base);font-weight:400;color:#fff;cursor:pointer;font-family:var(--nmx-f);margin:20px 0 10px;transition:opacity .15s,transform .12s} .nmx-form .nmx-submit:hover{opacity:.9} .nmx-form .nmx-submit:active{transform:scale(.98)} .nmx-form .nmx-submit:disabled{opacity:.5;cursor:not-allowed} /* ERROR */ .nmx-form .nmx-error{font-size:var(--nmx-fs-small);color:var(--nmx-red-dark);min-height:18px;margin-top:6px;text-align:center;font-family:var(--nmx-f)} /* GEN-COUNTER */ .nmx-form .nmx-gen-counter{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);text-align:center;margin:6px 0 4px;min-height:18px;font-family:var(--nmx-f)} .nmx-form .nmx-gen-counter.warning{color:var(--nmx-fire);font-weight:500} /* BOTTOM-BAR — v0.9: плотный отступ, без разделительной линии */ .nmx-form .nmx-bottom-bar{display:flex;justify-content:space-between;align-items:center;margin-top:4px;padding-top:0;border-top:none;flex-wrap:wrap;gap:8px} .nmx-form .nmx-bottom-group{display:flex;align-items:center;gap:8px} .nmx-form .nmx-bottom-group:has(.nmx-font-group){margin-left:auto} /* «Шрифт» всегда у правого края — site-wide */ .nmx-form .nmx-bottom-label{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);font-family:var(--nmx-f)} .nmx-form .nmx-font-group{display:flex;align-items:center;background:var(--nmx-bg-btn-soft);border-radius:var(--nmx-r-sm);overflow:hidden} .nmx-form .nmx-font-btn{background:transparent;border:none;color:var(--nmx-tx-2);padding:6px 12px;font-size:17px;font-weight:600;cursor:pointer;font-family:var(--nmx-f);transition:background .15s} .nmx-form .nmx-font-btn:hover{background:rgba(0,0,0,.05)} .nmx-form .nmx-font-sep{width:1px;height:18px;background:rgba(0,0,0,.1)} /* LOADING */ .nmx-loading{display:none;max-width:var(--nmx-w-tool);margin:24px auto 0;background:var(--nmx-bg-card);border-radius:var(--nmx-r);padding:24px;text-align:center;color:var(--nmx-tx-2);font-family:var(--nmx-f);font-size:var(--nmx-fs-base)} .nmx-loading.visible{display:block} .nmx-spinner{width:36px;height:36px;border:3px solid var(--nmx-border-soft);border-top-color:var(--nmx-primary);border-radius:50%;animation:nmx-spin 1s linear infinite;margin:0 auto 14px} @keyframes nmx-spin{to{transform:rotate(360deg)}} .nmx-loading-timer{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);margin-top:8px} /* FEED — v0.9: видна всегда, не зависит от .visible */ .nmx-feed-section{max-width:var(--nmx-w-tool);margin:24px auto 0;background:var(--nmx-bg-feed);border-radius:var(--nmx-r);padding:20px;font-family:var(--nmx-f)} .nmx-feed-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:0} .nmx-feed-section:has(.nmx-answer-card) .nmx-feed-header{margin-bottom:14px} .nmx-feed-title{font-size:var(--nmx-fs-small);font-weight:500;color:var(--nmx-tx-3);text-transform:uppercase;letter-spacing:.08em} /* FEED-CLEAR — v0.9: скрыта по умолчанию, показывается через .visible когда есть карточки */ .nmx-feed-clear{display:none;background:var(--nmx-bg-btn-soft);border:none;color:var(--nmx-tx-2);padding:6px 14px;font-size:var(--nmx-fs-small);border-radius:var(--nmx-r-sm);cursor:pointer;font-family:var(--nmx-f);transition:background .15s} .nmx-feed-clear.visible{display:inline-flex;align-items:center} .nmx-feed-clear:hover{background:#e0dfdc} /* ANSWER CARD */ .nmx-answer-card{position:relative;background:var(--nmx-bg-card);border:1px solid var(--nmx-border-soft);border-radius:var(--nmx-r);padding:18px 18px 14px;margin-bottom:14px} .nmx-answer-card:last-child{margin-bottom:0} .nmx-answer-text{font-size:var(--nmx-fs-base);color:var(--nmx-tx);line-height:1.65;word-wrap:break-word;padding-right:36px} .nmx-remove-btn{position:absolute;top:8px;right:8px;width:28px;height:28px;border:none;background:transparent;color:var(--nmx-tx-3);cursor:pointer;border-radius:50%;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s} .nmx-remove-btn:hover{background:rgba(226,75,74,.08);color:var(--nmx-red)} .nmx-answer-btns{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap} .nmx-answer-btns .nmx-copy-btn{margin-left:auto} /* «Копировать» всегда у правого края ряда; новые кнопки добавлять слева от неё — site-wide */ .nmx-answer-btn{display:inline-flex;align-items:center;gap:6px;background:var(--nmx-bg-btn-soft);border:none;color:var(--nmx-tx-2);padding:8px 14px;font-size:var(--nmx-fs-small);border-radius:var(--nmx-r-sm);cursor:pointer;font-family:var(--nmx-f);transition:background .15s,color .15s} .nmx-answer-btn:hover{background:#e0dfdc} .nmx-answer-btn svg{width:14px;height:14px} .nmx-answer-btn.copied{background:#d4edda;color:#155724} /* PHOTO-UPLOAD (Шаг 2.2) */ .nmx-photo-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0,0,0,0)} .nmx-photo-upload{margin:0 0 14px} .nmx-photo-counter{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);font-weight:400;margin-left:8px} .nmx-photo-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;padding:30px 16px;background:var(--nmx-fb);border:2px dashed rgba(180,178,170,.55);border-radius:var(--nmx-r);cursor:pointer;transition:border-color .25s,box-shadow .25s,background .25s;user-select:none;text-align:center;box-sizing:border-box;font-family:var(--nmx-f)} .nmx-photo-dropzone:hover{border-color:var(--nmx-fc);box-shadow:var(--nmx-fs)} .nmx-photo-dropzone--hover{background:rgba(255,255,255,.92)!important;border-color:var(--nmx-fc)!important;border-style:solid!important;box-shadow:var(--nmx-fs)} .nmx-photo-dropzone--disabled{opacity:.4;pointer-events:none} .nmx-photo-dropzone-icon{width:42px;height:42px;color:#78909c} .nmx-photo-dropzone-title{font-size:16px;font-weight:500;color:var(--nmx-tx)} .nmx-photo-dropzone-hint{font-size:14px;color:var(--nmx-tx-3)} .nmx-photo-gallery{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px} .nmx-photo-gallery:empty{display:none;margin-top:0} .nmx-photo-card{position:relative;width:160px;height:160px;border-radius:var(--nmx-r);overflow:hidden;border:var(--nmx-fb2);background:#eef1f4;flex-shrink:0;cursor:pointer} .nmx-photo-card img{width:100%;height:100%;object-fit:cover;display:block} .nmx-photo-remove{position:absolute;top:4px;right:4px;width:24px;height:24px;border:none;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;padding:0} .nmx-photo-card:hover .nmx-photo-remove{opacity:1} .nmx-photo-add{width:100px;height:100px;border-radius:var(--nmx-r);border:2px dashed rgba(180,178,170,.55);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:border-color .2s,background .2s;background:transparent} .nmx-photo-add:hover{border-color:var(--nmx-fc);background:rgba(255,255,255,.5)} .nmx-photo-add svg{width:24px;height:24px;color:#90a4ae} .nmx-photo-lightbox{position:fixed;inset:0;z-index:99998;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;padding:20px;cursor:zoom-out} .nmx-photo-lightbox img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px} /* MARKDOWN-TYPOGRAPHY (Шаг 2.3) — стили внутри .nmx-answer-text */ .nmx-answer-text h1,.nmx-answer-text h2,.nmx-answer-text h3,.nmx-answer-text h4{margin:24px 0 12px;font-weight:600;line-height:1.3;color:var(--nmx-tx)} .nmx-answer-text > h1:first-child,.nmx-answer-text > h2:first-child,.nmx-answer-text > h3:first-child,.nmx-answer-text > h4:first-child{margin-top:0} .nmx-answer-text h1{font-size:1.4em} .nmx-answer-text h2{font-size:1.25em} .nmx-answer-text h3{font-size:1.12em} .nmx-answer-text h4{font-size:1.05em} .nmx-answer-text p{margin:0 0 16px} .nmx-answer-text p:last-child{margin-bottom:0} /* компактные списки — принято на чате главной 20.07.26 */ .nmx-answer-text ul,.nmx-answer-text ol{margin:6px 0 10px;padding-left:24px} .nmx-answer-text li{margin:3px 0} .nmx-answer-text li:last-child{margin-bottom:0} .nmx-answer-text li ul,.nmx-answer-text li ol{margin:2px 0 4px} /* Нормализация loose-list от marked: внутри становится inline без отступов */ .nmx-answer-text li > p{margin:0;padding:0;display:inline} /* Убиваем «дыры» от лишних и пустых абзацев, которые marked плодит из-за breaks:true */ .nmx-answer-text li br{display:none} .nmx-answer-text p:empty{display:none} .nmx-answer-text br + br{display:none} .nmx-answer-text > br{display:none} /* Прижимаем абзац после списка (но с дыханием) */ .nmx-answer-text ol + p,.nmx-answer-text ul + p{margin-top:8px} .nmx-answer-text strong{font-weight:600;color:var(--nmx-tx)} .nmx-answer-text em{font-style:italic} .nmx-answer-text code{background:rgba(0,0,0,.06);border-radius:4px;padding:1px 6px;font-family:Consolas,Menlo,monospace;font-size:.92em} .nmx-answer-text pre{background:#f5f6fa;border-radius:var(--nmx-r-sm);padding:12px 14px;margin:10px 0;overflow-x:auto;border:1px solid var(--nmx-border-soft)} .nmx-answer-text pre code{background:transparent;padding:0;font-size:.88em;line-height:1.5} .nmx-answer-text blockquote{margin:10px 0;padding:6px 14px;border-left:3px solid var(--nmx-primary);background:rgba(43,108,176,.04);color:var(--nmx-tx-2);border-radius:0 var(--nmx-r-sm) var(--nmx-r-sm) 0} .nmx-answer-text blockquote p{margin:0;display:block} .nmx-answer-text a{color:var(--nmx-primary);text-decoration:underline} .nmx-answer-text a:hover{color:var(--nmx-primary-dark)} .nmx-answer-text hr{border:none;border-top:1px solid var(--nmx-border-soft);margin:14px 0} .nmx-answer-text table{border-collapse:collapse;width:100%;margin:10px 0;font-size:.95em} .nmx-answer-text th,.nmx-answer-text td{border:1px solid var(--nmx-border-soft);padding:6px 10px;text-align:left} .nmx-answer-text th{background:#eef1f5;font-weight:500} .nmx-answer-text img{max-width:100%;height:auto;border-radius:6px} /* DOWNLOAD-DOC (Шаг 2.3, опц.) */ .nmx-dl-group{display:inline-flex;align-items:center;gap:6px;margin-left:auto} .nmx-dl-label{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);margin-right:2px} .nmx-doc-btn,.nmx-pdf-btn{padding:8px 12px} .nmx-doc-btn svg,.nmx-pdf-btn svg{width:14px;height:14px} /* MODAL (для download-doc и др. подтверждений) */ .nmx-modal{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:20px;font-family:var(--nmx-f)} .nmx-modal-content{background:#fff;border-radius:var(--nmx-r);padding:24px;max-width:420px;width:100%;box-shadow:0 16px 48px rgba(0,0,0,.25)} .nmx-modal-content h3{margin:0 0 12px;font-weight:500;font-size:18px;color:var(--nmx-tx)} .nmx-modal-content p{margin:0;line-height:1.5;color:var(--nmx-tx-2);font-size:var(--nmx-fs-base)} .nmx-modal-btns{display:flex;gap:8px;justify-content:flex-end;margin-top:18px} .nmx-modal-btn{padding:10px 18px;border:none;border-radius:var(--nmx-r-sm);cursor:pointer;font-family:var(--nmx-f);font-size:var(--nmx-fs-small);font-weight:500;transition:opacity .15s} .nmx-modal-btn:hover{opacity:.85} .nmx-modal-btn--primary{background:var(--nmx-primary);color:#fff} .nmx-modal-btn--secondary{background:var(--nmx-bg-btn-soft);color:var(--nmx-tx-2)} /* STT-VOICE (Шаг 2.4) */ .nmx-form .nmx-mic-btn{background:transparent;color:var(--nmx-tx-3);transition:background .15s,color .15s} .nmx-form .nmx-mic-btn:hover{background:rgba(43,108,176,.08);color:var(--nmx-primary)} .nmx-form .nmx-mic-btn svg{width:18px;height:18px;fill:currentColor} .nmx-form .nmx-mic-btn.active{background:var(--nmx-success);color:#fff} .nmx-form .nmx-mic-btn.active:hover{background:#16a34a} .nmx-form .nmx-cancel-btn{background:rgba(0,0,0,.05);color:var(--nmx-tx-3);width:30px;height:30px} .nmx-form .nmx-cancel-btn:hover{background:rgba(226,75,74,.1);color:var(--nmx-red)} .nmx-form .nmx-cancel-btn svg{width:14px;height:14px} .nmx-form .nmx-rec-panel{display:none;align-items:center;gap:8px;padding:0 6px} .nmx-form .nmx-field.recording .nmx-rec-panel{display:flex} .nmx-form .nmx-field.recording .nmx-clear-btn{display:none !important} .nmx-form .nmx-rec-dot{width:8px;height:8px;border-radius:50%;background:var(--nmx-red);animation:nmx-pulse 1s ease-in-out infinite} @keyframes nmx-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}} .nmx-form .nmx-rec-wave{display:flex;align-items:center;gap:2px;height:18px} .nmx-form .nmx-rec-wave i{display:block;width:2px;background:var(--nmx-red);border-radius:2px;animation:nmx-wave 1s ease-in-out infinite} .nmx-form .nmx-rec-wave i:nth-child(1){height:6px;animation-delay:0s} .nmx-form .nmx-rec-wave i:nth-child(2){height:10px;animation-delay:.1s} .nmx-form .nmx-rec-wave i:nth-child(3){height:14px;animation-delay:.2s} .nmx-form .nmx-rec-wave i:nth-child(4){height:18px;animation-delay:.3s} .nmx-form .nmx-rec-wave i:nth-child(5){height:14px;animation-delay:.4s} .nmx-form .nmx-rec-wave i:nth-child(6){height:10px;animation-delay:.5s} .nmx-form .nmx-rec-wave i:nth-child(7){height:6px;animation-delay:.6s} .nmx-form .nmx-rec-wave i:nth-child(8){height:4px;animation-delay:.7s} @keyframes nmx-wave{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}} .nmx-form .nmx-rec-timer{font-size:var(--nmx-fs-small);color:var(--nmx-tx-2);font-variant-numeric:tabular-nums;min-width:38px} .nmx-form .nmx-field.recording{border-color:rgba(226,75,74,.45)} /* Озвучка ответов снята с интерфейса сайта; голосовой ввод сохраняется. */ /* RESPONSIVE */ @media(max-width:768px){ .nmx-hero__glow--tr{top:-60px;right:-30px;width:200px;height:200px} .nmx-hero__glow--bl{bottom:-50px;left:-40px;width:180px;height:180px} .nmx-hero__glow--c{display:none} .nmx-hero__badge{font-size:14px;padding:5px 14px;margin-bottom:20px} .nmx-hero__grid{grid-template-columns:1fr;gap:10px;max-width:100%} .nmx-hero__card{padding:12px 14px;border-radius:12px} .nmx-hero__icon{width:30px;height:30px;border-radius:8px} .nmx-hero__card-title{font-size:20px} .nmx-hero__card-desc{font-size:18px} .nmx-form-section,.nmx-feed-section,.nmx-loading{padding:20px 14px} .nmx-form-wrap{padding:30px 2px 40px} .nmx-form .nmx-selects{grid-template-columns:1fr} .nmx-form .nmx-input,.nmx-form .nmx-textarea,.nmx-form .nmx-select{font-size:19px} .nmx-answer-text{font-size:19px} .nmx-form .nmx-bottom-bar{flex-direction:column;align-items:stretch} .nmx-form .nmx-bottom-group{justify-content:center} .nmx-photo-dropzone{padding:24px 12px} .nmx-photo-dropzone-icon{width:36px;height:36px} .nmx-photo-card,.nmx-photo-add{width:91px;height:91px} .nmx-photo-remove{opacity:1} } /* FORM-TEMPLATE */ .nmx-form .nmx-tpl-btn{background:rgba(255,255,255,.65);border:1px solid rgba(0,0,0,.1);border-radius:var(--nmx-r-sm);padding:6px 12px;font-size:var(--nmx-fs-small);color:var(--nmx-tx-2);cursor:pointer;font-family:var(--nmx-f);line-height:1.2;white-space:nowrap;transition:background .15s} .nmx-form .nmx-tpl-btn:hover{background:rgba(255,255,255,.95)} .nmx-tpl-name-input{width:100%;border:var(--nmx-fb2);border-radius:var(--nmx-r-sm);padding:12px 14px;font-size:var(--nmx-fs-base);font-family:var(--nmx-f);color:var(--nmx-tx);outline:none;margin:10px 0;box-sizing:border-box} /* === NMX END === */ /* CHIPS */ .nmx-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:-4px 0 14px;padding:0} .nmx-chips-label{font-size:13px;color:var(--nmx-tx-3);font-family:var(--nmx-f);margin-right:4px;font-weight:400} .nmx-chip{display:inline-flex;align-items:center;background:rgba(255,255,255,.7);border:1px solid rgba(180,178,170,.4);color:var(--nmx-tx-2);padding:7px 14px;font-size:13px;font-family:var(--nmx-f);font-weight:400;line-height:1.2;border-radius:var(--nmx-r-pill);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .1s,box-shadow .15s} .nmx-chip:hover{background:#fff;border-color:var(--nmx-fc);color:var(--nmx-primary);box-shadow:0 1px 4px rgba(43,108,176,.08)} .nmx-chip:active{transform:scale(.96)} .nmx-chip:focus-visible{outline:none;border-color:var(--nmx-fc);box-shadow:var(--nmx-fs)} /* + приёмник 25.06: подсветка ВЫБРАННОЙ чипсы (класс .active вешает JS) — в боевом CSS отсутствовала */ .nmx-chip.active{background:var(--nmx-primary);border-color:var(--nmx-primary);color:#fff} .nmx-chip.active:hover{background:var(--nmx-primary-dark,#1a4070);border-color:var(--nmx-primary-dark,#1a4070);color:#fff} .nmx-chip[data-hidden="1"]{display:none} /* CTA CUSTOM INPUT */ .nmx-cta-custom{width:100%;border:var(--nmx-fb2);background:#fff;border-radius:var(--nmx-r);padding:14px;font-size:var(--nmx-fs-base);color:var(--nmx-tx);font-family:var(--nmx-f);outline:none;box-sizing:border-box;transition:border-color .25s,box-shadow .25s} .nmx-cta-custom:focus{border-color:var(--nmx-fc);box-shadow:var(--nmx-fs)} .nmx-cta-custom::placeholder{color:var(--nmx-tx-3)} /* CHIPS MOBILE */ @media(max-width:768px){ .nmx-chips{gap:1px;margin:-2px 0 12px} .nmx-chip{padding:6px 12px;font-size:14px} .nmx-chips-label{width:100%;margin:0 0 2px} } /* ═══ FORM 2a — раскладка/пометки (промоут 29.06 из components-2a.html; ранее дублировались page-local) ═══ */ /* row-grid: 2/3 колонки, авто-сворачивание без media-query */ .nmx-row-2, .nmx-row-3{display:grid;gap:12px;margin-bottom:14px;align-items:start} .nmx-row-2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))} .nmx-row-3{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))} .nmx-row-3 .nmx-chips-block{margin-top:8px} /* req-mark: звёздочка обязательного поля */ .nmx-req{color:var(--nmx-red,#e24b4a);font-weight:700;margin-left:2px} /* label-with-button: заголовок поля + кнопка справа */ .nmx-label-row{display:flex;align-items:baseline;gap:12px;margin-bottom:6px} .nmx-label-row>.nmx-label{flex:1 1 auto;margin-bottom:0} .nmx-label-btn{background:transparent;border:1px solid var(--nmx-primary,#2b6cb0);color:var(--nmx-primary,#2b6cb0);border-radius:var(--nmx-r-sm,8px);padding:5px 14px;font:500 13px/1.2 var(--nmx-f);cursor:pointer;white-space:nowrap;transition:background .15s,color .15s} .nmx-label-btn:hover{background:var(--nmx-primary,#2b6cb0);color:#fff} /* ── КОНТЕНТ СТРАНИЦЫ (.nmx-page · блок 5 SEO-контент) ── */ .nmx-page{max-width:var(--nmx-w-tool);margin:0 auto;padding:8px 20px 24px;font-family:var(--nmx-f);font-size:var(--nmx-fs-base);line-height:1.6;color:var(--nmx-tx-2)} .nmx-page h2{font-size:24px;font-weight:600;line-height:1.3;color:var(--nmx-tx);margin:40px 0 14px} .nmx-page h3{font-size:var(--nmx-fs-base);font-weight:600;line-height:1.35;color:var(--nmx-tx);margin:18px 0 6px} .nmx-page p{margin:0 0 14px} .nmx-page ul,.nmx-page ol{margin:0 0 16px;padding-left:24px} .nmx-page li{margin:7px 0} .nmx-page strong{color:var(--nmx-tx)} .nmx-page a{color:var(--nmx-violet);text-decoration:underline;text-underline-offset:3px} .nmx-page a:hover{opacity:.8} .nmx-page table{width:100%;border-collapse:collapse;margin:16px 0;font-size:var(--nmx-fs-small)} .nmx-page th,.nmx-page td{border:1px solid var(--nmx-border-soft);padding:10px 12px;text-align:left;vertical-align:top} .nmx-page th{background:var(--nmx-bg-form);font-weight:600;color:var(--nmx-tx)} .nmx-page td:first-child{color:var(--nmx-tx-3)} .nmx-sample{background:var(--nmx-bg-card);border-radius:var(--nmx-r);padding:16px 20px;margin:6px 0 16px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 22px rgba(16,24,40,.06)} .nmx-sample summary{cursor:pointer;font-weight:600;color:var(--nmx-violet);list-style:none} .nmx-sample summary::-webkit-details-marker{display:none} .nmx-sample summary::before{content:'▸ '} .nmx-sample[open] summary::before{content:'▾ '} .nmx-sample[open] summary{margin-bottom:12px} .nmx-sample h3{margin-top:14px} .nmx-cta-btn{display:inline-block;background:var(--nmx-grad-submit);color:#fff;font-size:var(--nmx-fs-base);font-weight:500;text-decoration:none;padding:14px 32px;border-radius:var(--nmx-r);transition:opacity .15s,transform .12s} .nmx-cta-btn:hover{opacity:.9;color:#fff} .nmx-cta-btn:active{transform:scale(.98)} /* ── КОНТЕНТ-МОДУЛИ (.nmx-page · карточки/шаги/цифры) ── */ .nmx-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin:20px 0 30px} .nmx-stat{background:var(--nmx-bg-card);border-radius:var(--nmx-r-lg);padding:20px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 22px rgba(16,24,40,.07)} .nmx-stat b{display:block;font-size:30px;font-weight:700;color:var(--nmx-violet);line-height:1.1} .nmx-stat span{display:block;font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);margin-top:6px} .nmx-stat--accent{background:var(--nmx-violet)} .nmx-stat--accent b{color:#fff} .nmx-stat--accent span{color:rgba(255,255,255,.85)} .nmx-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:16px;margin:16px 0 30px} .nmx-step{background:var(--nmx-bg-card);border-radius:var(--nmx-r-lg);padding:24px 22px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 22px rgba(16,24,40,.07)} .nmx-step__n{width:36px;height:36px;border-radius:50%;background:var(--nmx-violet);color:#fff;font-size:18px;font-weight:600;display:flex;align-items:center;justify-content:center;margin-bottom:16px} .nmx-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px;margin:16px 0 30px} .nmx-card{background:var(--nmx-bg-card);border-radius:var(--nmx-r-lg);padding:24px 22px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 22px rgba(16,24,40,.07)} .nmx-page .nmx-step h3,.nmx-page .nmx-card h3{margin:0 0 8px;font-size:17px;line-height:1.3} .nmx-page .nmx-step p,.nmx-page .nmx-card p{margin:0;color:var(--nmx-tx-2);font-size:var(--nmx-fs-small);line-height:1.5} .nmx-ic{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;margin-bottom:16px;background:color-mix(in srgb,currentColor 14%,#fff)} .nmx-ic svg{width:26px;height:26px;stroke-width:1.8} .nmx-ic--violet{color:var(--nmx-violet)}.nmx-ic--pink{color:var(--nmx-pink)}.nmx-ic--gold{color:var(--nmx-gold)}.nmx-ic--sky{color:var(--nmx-sky)}.nmx-ic--green{color:var(--nmx-green)}.nmx-ic--fire{color:var(--nmx-fire)} .nmx-getlist{list-style:none;padding:0;margin:16px 0 30px;display:grid;gap:13px} .nmx-getlist li{display:flex;gap:12px;align-items:flex-start;color:var(--nmx-tx-2)} .nmx-getlist li .nmx-ic{flex:0 0 auto;width:24px;height:24px;border-radius:0;background:none;margin:1px 0 0;color:var(--nmx-green)} .nmx-getlist li .nmx-ic svg{width:24px;height:24px} /* === NMX NAV POPUP START === */ /* v1.4: логотип-шапка вместо круглой иконки, увеличенные шрифты, контрастная secondary-кнопка */ /* Стили попапа «PRO-доступ». Добавить в конец основного CSS-файла сайта. Использует токены из :root основного CSS — попап автоматически подстраивается под палитру. Дополнительно: T123-блок навигации ставит на класс .nmx-page-pro / .nmx-page-free. Через эти селекторы можно скрывать/показывать любые элементы в зависимости от ветки. */ /* Скрыть иконку профиля Tilda Members на Free-страницах */ .nmx-page-free .tlk-userbar{display:none!important} .nmx-nav-modal *, .nmx-nav-modal *::before, .nmx-nav-modal *::after{box-sizing:border-box} .nmx-nav-modal{animation:nmx-nav-fade .15s ease-out} @keyframes nmx-nav-fade{from{opacity:0}to{opacity:1}} .nmx-nav-modal .nmx-modal-content{ text-align:center; padding:0 28px 32px; max-width:440px; max-height:90vh; overflow-y:auto; overflow-x:hidden; } /* Шапка попапа с логотипом — прижата к верху бокса, фон совпадает с JPG-фоном логотипа */ .nmx-nav-modal__header{ background:#0c1d3a; margin:0 -28px 24px; padding:18px 20px; border-radius:var(--nmx-r) var(--nmx-r) 0 0; display:flex; align-items:center; justify-content:center; } .nmx-nav-modal__header img{ display:block; height:52px; width:auto; max-width:100%; } .nmx-nav-modal .nmx-nav-modal__title{ margin:0 0 8px; font-size:24px; font-weight:500; color:var(--nmx-tx); font-family:var(--nmx-f); line-height:1.25; } .nmx-nav-modal__subtitle{ font-size:16px; color:var(--nmx-tx-3); margin:0 0 28px; font-family:var(--nmx-f); line-height:1.4; } .nmx-nav-modal__card{ display:block; width:100%; text-align:left; border:none; border-radius:var(--nmx-r); padding:18px 20px; margin:0 0 12px; cursor:pointer; font-family:var(--nmx-f); transition:opacity .15s,transform .12s,box-shadow .15s; } .nmx-nav-modal__card:hover{opacity:.92} .nmx-nav-modal__card:active{transform:scale(.98)} .nmx-nav-modal__card:focus-visible{outline:2px solid var(--nmx-primary);outline-offset:2px} .nmx-nav-modal__card--primary{ background:var(--nmx-grad-submit); color:#fff; } .nmx-nav-modal__card--secondary{ background:var(--nmx-bg-form); border:1px solid rgba(0,0,0,.12); color:var(--nmx-tx); margin-bottom:24px; } .nmx-nav-modal__card--secondary:hover{ background:#cdd3d9; opacity:1; } .nmx-nav-modal__card-title{ font-size:18px; font-weight:500; margin:0 0 4px; line-height:1.3; } .nmx-nav-modal__card-sub{ font-size:14px; line-height:1.4; } .nmx-nav-modal__card--primary .nmx-nav-modal__card-sub{color:rgba(255,255,255,.82)} .nmx-nav-modal__card--secondary .nmx-nav-modal__card-sub{color:var(--nmx-tx-2)} .nmx-nav-modal__close{ font-size:15px; color:var(--nmx-tx-3); cursor:pointer; background:none; border:none; font-family:var(--nmx-f); padding:8px 14px; border-radius:var(--nmx-r-sm); display:inline-block; margin:0 auto; } .nmx-nav-modal__close:hover{color:var(--nmx-tx-2)} .nmx-nav-modal__close:focus-visible{outline:2px solid var(--nmx-primary);outline-offset:2px} html.nmx-nav-lock, body.nmx-nav-lock{overflow:hidden!important} /* Мобильный — крупнее шрифты, больше воздуха */ @media(max-width:480px){ .nmx-nav-modal .nmx-modal-content{padding:0 22px 28px} .nmx-nav-modal__header{margin:0 -22px 22px;padding:16px;border-radius:var(--nmx-r) var(--nmx-r) 0 0} .nmx-nav-modal__header img{height:44px} .nmx-nav-modal .nmx-nav-modal__title{font-size:22px} .nmx-nav-modal__subtitle{font-size:16px;margin-bottom:22px} .nmx-nav-modal__card{padding:18px;margin-bottom:14px} .nmx-nav-modal__card-title{font-size:18px} .nmx-nav-modal__card-sub{font-size:14px} .nmx-nav-modal__close{font-size:16px;padding:10px 16px} } /* === NMX NAV POPUP END === */ /* ====== NMX REMARK & HINT (общие блоки) ====== Эти стили можно вынести в общий CSS сайта (Tilda → Настройки → Дополнительный код → CSS в HEAD) тогда они будут работать на всех страницах генераторов без дублирования. */ /* Подсказка под полем формы — фиолетовый блок «Что важно упомянуть» */ .nmx-form-hint { margin-top: -8px; margin-bottom: 18px; padding: 12px 14px; background: #f3f0fa; border-left: 3px solid #7c5cbf; border-radius: 6px; font-size: 14px; color: #444; line-height: 1.5; } .nmx-form-hint__label { color: #7c5cbf; } /* Ремарка о пропущенных фактах в карточке ответа — жёлтый блок */ .nmx-remark-block { margin-bottom: 8px; padding: 12px 14px; background: #fff8e6; border-left: 3px solid #f0a500; border-radius: 6px; font-size: 14px; color: #4a3800; line-height: 1.5; } .nmx-remark-block__icon { margin-right: 4px; } .nmx-remark-block strong { color: #c0392b; } /* Отступ кнопок в карточке ответа */ .nmx-answer-card .nmx-answer-btns { margin-top: 12px; } /* === NMX FOOTER START === */ /* Подвал сайта (T123 на странице-подвале, «Шапка и подвал»). Фон зеркалит hero: светлее сверху → темнее к низу страницы. Вся вёрстка подвала — только здесь, в блоке T123 стилей нет. */ :root{--nmx-grad-footer:linear-gradient(to top,#06101f 0%,#0c1d3a 45%,#132e55 80%,#1a4070 100%)} .nmx-footer{background:var(--nmx-grad-footer);padding:48px 24px 32px} .nmx-footer,.nmx-footer *{box-sizing:border-box;font-family:var(--nmx-f)} .nmx-footer__grid{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:32px} .nmx-footer__col{display:flex;flex-direction:column;gap:12px;align-items:flex-start} .nmx-footer__title{font-size:var(--nmx-fs-small);font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:rgba(200,225,255,.95);margin-bottom:4px} .nmx-footer__link{font-size:var(--nmx-fs-small);color:rgba(255,255,255,.7);text-decoration:none;line-height:1.4;padding:2px 0} .nmx-footer__link:hover{color:#fff} /* Тильда красит все сайтовым цветом правилом с ID (#allrecords a) — оно сильнее обычного класса. Перебиваем её специфичность для ссылок подвала. */ #allrecords .nmx-footer__link{color:rgba(255,255,255,.7)!important;text-decoration:none!important} #allrecords .nmx-footer__link:hover{color:#fff!important} .nmx-footer__qr{width:136px;height:136px;padding:8px;background:#fff;border-radius:var(--nmx-r-sm)} .nmx-footer__qr img,.nmx-footer__qr canvas{width:120px;height:120px;display:block} .nmx-footer__hint{font-size:14px;color:rgba(255,255,255,.5);line-height:1.4} .nmx-footer__bottom{max-width:1160px;margin:36px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:6px} .nmx-footer__req{font-size:14px;color:rgba(255,255,255,.45);line-height:1.5} @media(max-width:900px){.nmx-footer__grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.nmx-footer__grid{grid-template-columns:1fr}} /* === NMX FOOTER END === */ /* === NMX SHARE START === */ /* Блок «Поделиться страницей» (T123 сразу после формы; родитель на recepty, на остальных страницах — алиасы). Вся вёрстка блока — только здесь, в блоке T123 стилей нет (как NMX FOOTER). Боевой код — pages/_site/share.txt. Принят вживую на recepty 03.07.26. Полноширинная тёмная лента по канону контента (паттерн 08b): фирменный градиент, глоу-круги, кнопки мессенджеров. */ :root{--nmx-grad-share:linear-gradient(135deg,#06101f 0%,#0c1d3a 45%,#1a4070 100%)} .nmx-share-wrap{position:relative;overflow:hidden;background:var(--nmx-grad-share);padding:38px clamp(24px,5vw,72px)} .nmx-share-wrap *{font-family:var(--nmx-f);box-sizing:border-box} .nmx-share-glow{position:absolute;border-radius:50%;pointer-events:none} .nmx-share-glow--tr{top:-120px;right:-60px;width:340px;height:340px;background:radial-gradient(circle,rgba(60,130,220,.22) 0%,transparent 65%)} .nmx-share-glow--bl{bottom:-100px;left:-70px;width:300px;height:300px;background:radial-gradient(circle,rgba(124,92,191,.16) 0%,transparent 60%)} .nmx-share{position:relative;z-index:1;max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px 40px;flex-wrap:wrap} .nmx-share__text{flex:1 1 300px;min-width:270px} .nmx-share__title{font-size:24px;font-weight:400;color:#fff;line-height:1.25;margin:0 0 10px} .nmx-share__sub{font-size:16px;font-weight:300;color:rgba(255,255,255,.72);line-height:1.5;margin:0} .nmx-share__btns{flex:1 1 420px;display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end} .nmx-share-btn{border:none;border-radius:10px;padding:11px 18px;font-size:15px;font-weight:400;color:#fff;cursor:pointer;transition:opacity .15s,transform .12s;white-space:nowrap} .nmx-share-btn:hover{opacity:.88} .nmx-share-btn:active{transform:scale(.97)} .nmx-share-btn--tg{background:#39aedf} .nmx-share-btn--max{background:#5a48f5} .nmx-share-btn--vk{background:#4a76a8} .nmx-share-btn--ok{background:#ee8208} .nmx-share-btn--wa{background:#25d366} .nmx-share-btn--sms{background:#6b7a90} .nmx-share-btn--native{display:none;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.35)} @media(max-width:768px){ .nmx-share-wrap{padding:30px 20px} .nmx-share{justify-content:center} .nmx-share__text{text-align:center} .nmx-share__title{font-size:21px} .nmx-share__sub{font-size:15px} .nmx-share__btns{justify-content:center;gap:8px} .nmx-share-btn{padding:10px 14px;font-size:14px} } /* === NMX SHARE END === */ /* === NMX TOOLS START === */ /* Блок перелинковки «Другие инструменты» (T123 перед подвалом; родитель на группу — pages/_groups//tools.txt, на страницах группы — алиасы). Вся вёрстка блока — только здесь, в блоке T123 стилей нет (как NMX FOOTER и NMX SHARE). Принят вживую на recepty 03.07.26 (v0.6 → v1.0). Чипсы «Разделы» и градиент-CTA несут базовые стили inline в блоке (паттерн контент-слоя nmc-chip: inline не перебивается тильдовским цветом ссылок) — здесь только hover к ним. */ .nmx-tools-wrap{background:#f4f6f9;font-family:var(--nmx-f)} .nmx-tools-wrap *{box-sizing:border-box} .nmx-tools{max-width:1100px;margin:0 auto;padding:56px clamp(24px,5vw,72px) 64px} .nmx-tools__head{text-align:center;max-width:720px;margin:0 auto} .nmx-tools__kicker{font-size:13px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--nmx-primary);margin-bottom:10px} .nmx-tools__title{margin:0 0 10px;font-size:clamp(24px,3vw,30px);line-height:1.25;font-weight:700;color:#0f1626} /* Градиентное слово — приём градиентных цифр контент-канона */ .nmx-tools__grad{background:linear-gradient(90deg,#2b6cb0,#7c5cbf);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#2b6cb0} .nmx-tools__sub{font-size:16px;line-height:1.5;color:#6b7280} .nmx-tools__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:30px} /* Тень в покое — двойная мягкая тень карточек контент-канона */ .nmx-tools__card{display:flex;flex-direction:column;gap:7px;background:#fff;border-radius:var(--nmx-r-lg);padding:22px 24px;text-decoration:none;box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 22px rgba(16,24,40,.06);transition:box-shadow .18s,transform .18s} .nmx-tools__card:hover{transform:translateY(-3px);box-shadow:0 3px 6px rgba(16,24,40,.06),0 14px 30px rgba(16,24,40,.11)} .nmx-tools__card:hover .nmx-tools__name{color:var(--nmx-primary)} .nmx-tools__ic{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;margin-bottom:5px} .nmx-tools__tag{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#98a2b3} .nmx-tools__name{font-size:18px;font-weight:700;line-height:1.3;color:#0f1626;transition:color .18s} .nmx-tools__desc{font-size:16px;line-height:1.45;color:#4a5568} .nmx-tools__sections{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-top:32px} .nmx-tools__sections-label{font-size:16px;color:#6b7280;margin-right:4px} .nmx-tools__all{text-align:center;margin-top:28px} .nmx-tools__cta:hover{opacity:.92} /* Hover чипс nmc-chip — дубль-страховка: правило живёт page-local в контент-блоках; при промоуте контент-слоя в global — объединить в один источник */ .nmc-chip:hover{border-color:#2b6cb0 !important;background:#f5f9ff} /* === NMX TOOLS END === */ /* === NMX CATALOG START === */ /* v1.1 — каталог /pages-list (+ /pro/): hero-поиск, секции групп; карточки и чипсы — секция NMX TOOLS */ .nmx-ctl-wrap{font-family:var(--nmx-f)} .nmx-ctl-wrap *{box-sizing:border-box} .nmx-ctl-wrap .nmx-hero{padding-bottom:44px} .nmx-ctl-count{margin-top:14px;font-size:16px;color:rgba(255,255,255,.55);min-height:20px} .nmx-ctl-search{position:relative;max-width:520px;margin:20px auto 0} .nmx-ctl-search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);pointer-events:none} .nmx-ctl-search input{width:100%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.97);border-radius:var(--nmx-r-pill);padding:15px 20px 15px 46px;font-size:17px;font-family:var(--nmx-f);color:var(--nmx-tx);outline:none;transition:box-shadow .2s} .nmx-ctl-search input:focus{box-shadow:0 0 0 4px rgba(120,170,255,.25)} .nmx-ctl-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:18px} .nmx-ctl-cta{margin:26px 0 6px} .nmx-ctl-cta-link{display:block;margin-top:12px;font-size:15px;color:rgba(200,225,255,.8)!important;text-decoration:underline} .nmx-ctl-body{padding-top:40px} .nmx-ctl-group{margin-bottom:44px;scroll-margin-top:80px} .nmx-ctl-group:last-of-type{margin-bottom:0} .nmx-ctl-group-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin-bottom:2px} .nmx-ctl-group-title{position:relative;margin:0;padding-left:16px;font-size:24px;font-weight:700;color:#0f1626;font-family:var(--nmx-f)} .nmx-ctl-group-title::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:6px;height:22px;border-radius:3px;background:var(--ctl-c,#2b6cb0)} .nmx-ctl-group-count{font-size:15px;color:#98a2b3} .nmx-ctl-group-link{margin-left:auto;font-size:15px;font-weight:500;color:var(--nmx-primary)!important;text-decoration:none} .nmx-ctl-group-link:hover{text-decoration:underline} .nmx-ctl-empty{display:none;text-align:center;padding:40px 20px;font-size:17px;color:#6b7280} .nmx-ctl-empty.visible{display:block} .nmx-ctl-empty a,.nmx-ctl-foot a{color:var(--nmx-primary)!important} .nmx-ctl-foot{text-align:center;margin-top:48px;font-size:16px;color:#6b7280} .nmx-ctl-hide{display:none!important} @media(max-width:768px){ .nmx-ctl-group-title{font-size:20px} .nmx-ctl-search input{font-size:16px;padding:13px 16px 13px 44px} } /* === NMX CATALOG END === */ /* === NMX MENU START === */ /* Меню сайта (T123 первым блоком; родитель — pages/_site/menu.txt, на остальных страницах — алиасы; один код на Free и PRO, ADR 018). Точная копия T770. Вся вёрстка блока — только здесь, в блоке T123 стилей нет (как NMX FOOTER и NMX SHARE); вынесено из блока после приёмки 04.07.26 (ADR 019). Все правила заякорены на id #nmx-menu: тильдовское #allrecords a{color:#ff8562} сильнее классов (та же грабля, что у NMX FOOTER). */ #nmx-menu{background-color:#0a2540;font-family:'Google Sans',Arial,sans-serif;position:relative;z-index:900;} #nmx-menu *{box-sizing:border-box;} #nmx-menu ul{list-style:none;margin:0;padding:0;} /* --- верхний ряд --- */ #nmx-menu .nmx-menu__top{position:relative;height:110px;padding:0 20px;} #nmx-menu .nmx-menu__logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;} #nmx-menu .nmx-menu__logo img{display:block;width:200px;max-width:200px;height:auto;} #nmx-menu .nmx-menu__side{position:absolute;top:0;height:100%;width:50%;display:flex;align-items:center;justify-content:center;} #nmx-menu .nmx-menu__side_left{left:0;flex-direction:column;padding:0 150px 0 40px;} #nmx-menu .nmx-menu__side_right{left:50%;flex-direction:row;gap:30px;padding:0 40px 0 150px;} #nmx-menu .nmx-menu__textlink{font-size:14px;color:#fae7b5;text-decoration:none;transition:opacity .2s ease-in-out;} #nmx-menu .nmx-menu__textlink:hover{opacity:.8;} #nmx-menu .nmx-menu__socials{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:14px !important;} #nmx-menu .nmx-menu__socials a{display:block;width:30px;height:30px;} #nmx-menu .nmx-menu__socials svg{display:block;width:30px;height:30px;} #nmx-menu .nmx-menu__btn{display:inline-flex;align-items:center;justify-content:center;height:45px;padding:0 30px;border-radius:50px;background-color:#515573;color:#fae7b5;font-size:14px;font-weight:400;text-decoration:none;white-space:nowrap;transition:background-color .2s ease-in-out,color .2s ease-in-out;} #nmx-menu .nmx-menu__btn:hover{background-color:#5f6485;} /* --- линия --- */ #nmx-menu .nmx-menu__line{border:0;height:1px;background-color:#c2c2c2;margin:0 40px;} /* --- нижний ряд: пункты меню --- */ #nmx-menu .nmx-menu__nav{height:40px;display:flex;align-items:center;justify-content:center;} #nmx-menu .nmx-menu__list{display:flex;} #nmx-menu .nmx-menu__item{padding:0 15px;position:relative;white-space:nowrap;} #nmx-menu .nmx-menu__link{position:relative;font-size:14px;color:#fae7b5;font-weight:400;text-transform:uppercase;letter-spacing:.5px;text-decoration:none;cursor:pointer;transition:color .3s ease-in-out,opacity .3s ease-in-out;} #nmx-menu .nmx-menu__link:not(.is-active)::after{content:'';position:absolute;left:0;bottom:20%;opacity:0;width:100%;height:100%;box-shadow:inset 0 -1px 0 0 #fff;transition:all .3s ease;pointer-events:none;} #nmx-menu .nmx-menu__link:not(.is-active):hover::after,#nmx-menu .nmx-menu__link:not(.is-active):focus-visible::after{opacity:1;bottom:0;} #nmx-menu .nmx-menu__link.is-active{color:#fff;opacity:.7;} /* --- выпадающее подменю (десктоп) --- */ #nmx-menu .nmx-menu__sub{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:15px;opacity:0;visibility:hidden;transition:opacity .2s cubic-bezier(.895,.03,.685,.22),visibility .2s;z-index:990;} #nmx-menu .nmx-menu__sublist{position:relative;width:280px;background-color:#fff;border:1px solid #515573;border-radius:5px;padding:18px 20px !important;text-align:center;max-height:calc(100vh - 230px);overflow:auto;} #nmx-menu .nmx-menu__sublist::before,#nmx-menu .nmx-menu__sublist::after{content:'';position:absolute;left:50%;margin-left:-10px;width:0;height:0;border:10px solid transparent;} #nmx-menu .nmx-menu__sublist::before{border-bottom-color:#515573;top:-21px;} #nmx-menu .nmx-menu__sublist::after{border-bottom-color:#fff;top:-20px;} #nmx-menu .nmx-menu__subitem{margin-bottom:12px;} #nmx-menu .nmx-menu__subitem:last-child{margin-bottom:0;} #nmx-menu .nmx-menu__sublink{display:block;font-size:14px;font-weight:400;color:#222;text-decoration:none;white-space:normal;line-height:1.35;transition:color .3s ease-in-out,opacity .3s ease-in-out;} #nmx-menu .nmx-menu__sublink:hover,#nmx-menu .nmx-menu__sublink.is-active{color:#d7c699 !important;} @media screen and (min-width:981px){ .nmx-menu__item_has-sub:hover .nmx-menu__sub, #nmx-menu .nmx-menu__item_has-sub:focus-within .nmx-menu__sub{opacity:1;visibility:visible;} } /* --- мобильная плашка и бургер --- */ #nmx-menu .nmx-menu__bar{display:none;} #nmx-menu .nmx-menu__bar-title{color:#fff;font-size:16px;font-weight:700;} #nmx-menu .nmx-menu__burger{position:relative;flex-shrink:0;width:28px;height:20px;padding:0;border:none;background-color:transparent;outline:none;cursor:pointer;z-index:999;} #nmx-menu .nmx-menu__burger span{display:block;position:absolute;left:0;width:100%;height:3px;background-color:#fff;opacity:1;transform:rotate(0deg);transition:.25s ease-in-out;} #nmx-menu .nmx-menu__burger span:nth-child(1){top:0;} #nmx-menu .nmx-menu__burger span:nth-child(2),#nmx-menu .nmx-menu__burger span:nth-child(3){top:8px;} #nmx-menu .nmx-menu__burger span:nth-child(4){top:16px;} #nmx-menu .nmx-menu__burger_open span:nth-child(1){top:8px;width:0;left:50%;} #nmx-menu .nmx-menu__burger_open span:nth-child(2){transform:rotate(45deg);} #nmx-menu .nmx-menu__burger_open span:nth-child(3){transform:rotate(-45deg);} #nmx-menu .nmx-menu__burger_open span:nth-child(4){top:8px;width:0;left:50%;} /* --- мобильная версия (до 980px) --- */ @media screen and (max-width:980px){ #nmx-menu .nmx-menu__bar{display:flex;align-items:center;justify-content:space-between;min-height:64px;padding:20px;background-color:#111;} #nmx-menu .nmx-menu__panel{display:none;} #nmx-menu.nmx-menu_open .nmx-menu__panel{display:flex;flex-direction:column;} #nmx-menu .nmx-menu__top{display:contents;} #nmx-menu .nmx-menu__line{display:none;} #nmx-menu .nmx-menu__logo{order:1;position:static;transform:none;padding:20px;display:flex;justify-content:center;} #nmx-menu .nmx-menu__nav{order:2;height:auto;padding:20px 0;} #nmx-menu .nmx-menu__list{display:block;} #nmx-menu .nmx-menu__item{display:block;position:static;text-align:center;padding:10px;white-space:normal;} #nmx-menu .nmx-menu__side{position:static;width:100%;height:auto;} #nmx-menu .nmx-menu__side_left{order:3;padding:20px 20px 0;} #nmx-menu .nmx-menu__side_right{order:4;flex-direction:column;gap:15px;padding:20px 20px 25px;} /* подменю-аккордеон: прозрачный фон, золотые ссылки — как в T770 */ #nmx-menu .nmx-menu__sub{display:none;position:static;transform:none;padding:12px 0 2px;opacity:1;visibility:visible;} #nmx-menu .nmx-menu__item.is-open .nmx-menu__sub{display:block;} #nmx-menu .nmx-menu__sublist{width:100%;max-width:100%;background-color:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.15);border-radius:0;padding:0 0 16px !important;max-height:none;overflow:visible;} #nmx-menu .nmx-menu__sublist::before,#nmx-menu .nmx-menu__sublist::after{display:none;} #nmx-menu .nmx-menu__subitem{margin-bottom:16px;} #nmx-menu .nmx-menu__sublink{color:#fae7b5;} #nmx-menu .nmx-menu__sublink.is-active{color:#d7c699 !important;} } @media screen and (max-width:480px){ #nmx-menu .nmx-menu__link{font-size:18px;} #nmx-menu .nmx-menu__textlink{font-size:18px;} #nmx-menu .nmx-menu__sublink{font-size:16px;} } /* === NMX MENU END === */ /* === NMX TECH START === */ /* Кнопка «Наверх» технического head-скрипта сайта (pages/_site/tech.txt, ADR 021). Кнопку создаёт сам скрипт на каждой странице (блока T123 нет); появляется после прокрутки двух экранов. Использует токены :root. */ .nmx-top-btn{position:fixed;right:16px;bottom:18px;z-index:9990;width:46px;height:46px;border-radius:50%;border:none;cursor:pointer;background:var(--nmx-grad-submit,#2b6cb0);color:#fff;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s;box-shadow:0 4px 14px rgba(0,0,0,.28);-webkit-tap-highlight-color:transparent} .nmx-top-btn--visible{opacity:1;visibility:visible;transform:none} .nmx-top-btn:hover{filter:brightness(1.08)} .nmx-top-btn:active{transform:scale(.94)} .nmx-top-btn:focus-visible{outline:2px solid var(--nmx-primary,#2b6cb0);outline-offset:2px} .nmx-top-btn svg{width:20px;height:20px} @media(max-width:480px){.nmx-top-btn{right:12px;bottom:14px;width:44px;height:44px}} /* Фикс прыжка страницы вверх при тильдовском попапе (#popup:support, вход и др.): tilda-scripts-3.0 при открытии пишет ИНЛАЙН-стиль height:100vh прямо на body — документ схлопывается до экрана, прокрутка сбрасывается в 0. Правило на body (не на классе .t-body_popupshowed — класс появляется позже инлайна и не успевает). overflow:hidden Тильды остаётся — фон под попапом не крутится. Доказано вживую 21.07 (Chrome, замер скролла до/после клика «Техподдержка» в подвале главной). */ body:has(nmx-form,.nmx-form,.nmx-hero){height:auto!important} /* === NMX TECH END === */ /* === NMX BRANCH START === */ /* Ветки Free/PRO в одном коде блока (ADR 022). Класс ветки на ставит head-скрипт NMX TECH (pages/_site/tech.txt). Элемент с .nmx-free-only виден только на Free, с .nmx-pro-only — только на /pro/. Fallback: если класса ветки нет (head-скрипт выключен) — страница выглядит как Free. */ html.nmx-page-pro .nmx-free-only{display:none!important} html:not(.nmx-page-pro) .nmx-pro-only{display:none!important} /* === NMX BRANCH END === */ /* === NMX CHAT START === */ /* Чат главной (NMX ChatUI v1.4+). Боевой код блока — pages/glavnaya/build/chat.txt, в блоке T123 стилей нет (вынос после приёмки 20.07.26, гейт «Финиш»). Ссылки заякорены на #nmxChatShell — глобальный #allrecords a сильнее классов. */ .nmx-chat-shell{display:flex;flex-direction:column;min-height:75vh;min-height:75dvh;max-height:150vh;max-height:150dvh;background:var(--nmx-bg-page,#f8f5f0);font-family:var(--nmx-f)} .nmx-chat-shell *{box-sizing:border-box;font-family:var(--nmx-f)} .nmx-chat-shell :where(button){padding:0;margin:0} /* нейтрализация глобального button{padding;margin} */ .nmx-chat-window{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;position:relative;padding:0 12px} .nmx-chat-inner{max-width:var(--nmx-w-tool,700px);margin:0 auto;display:flex;flex-direction:column;min-height:100%} .nmx-chat-welcome{margin:auto;text-align:center;padding:40px 16px;max-width:520px} .nmx-chat-welcome p{font-size:var(--nmx-fs-sub);font-weight:300;color:var(--nmx-tx-3);margin:0;line-height:1.5} .nmx-chat-welcome.nmx-hidden{display:none} .nmx-chat-feed{display:flex;flex-direction:column;gap:20px;padding:20px 0 24px} .nmx-chat-msg--user{display:flex;justify-content:flex-end} .nmx-chat-user-bubble{max-width:80%;background:var(--nmx-bg-btn-soft,#ededeb);color:var(--nmx-tx);border-radius:var(--nmx-r-lg,16px) var(--nmx-r-lg,16px) var(--nmx-r-sm,8px) var(--nmx-r-lg,16px);padding:12px 16px;font-size:var(--nmx-fs-base);line-height:1.55;word-break:break-word} /* вложения: ряд миниатюр НАД текстом сообщения; полный размер — по клику */ .nmx-chat-user-media{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px} .nmx-chat-user-media:last-child{margin-bottom:0} .nmx-chat-user-bubble img{width:110px;height:110px;border-radius:10px;display:block;object-fit:cover;cursor:zoom-in} .nmx-chat-user-file{flex-basis:100%;margin:0;font-size:var(--nmx-fs-small);opacity:.8} .nmx-chat-msg--ai{width:100%} .nmx-chat-ai .nmx-answer-text{font-size:var(--nmx-fs-base);padding:0} .nmx-chat-ai .nmx-answer-btns{margin-top:8px} .nmx-chat-ai .nmx-answer-btn{padding:4px 10px;font-size:14px} .nmx-chat-memnote{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3);text-align:center;padding:4px 10px;line-height:1.45} #nmxChatShell .nmx-chat-memnote a{color:var(--nmx-violet,#7c5cbf);text-decoration:underline;text-underline-offset:3px} .nmx-chat-typing{display:flex;align-items:center;gap:5px;width:fit-content;padding:14px 18px;background:var(--nmx-bg-card,#fff);border:1px solid var(--nmx-border-soft,#dddce0);border-radius:var(--nmx-r-lg,16px) var(--nmx-r-lg,16px) var(--nmx-r-lg,16px) 4px} .nmx-chat-typing i{width:7px;height:7px;border-radius:50%;background:var(--nmx-tx-3,#999);display:block;animation:nmx-typing-bounce 1.1s infinite ease-in-out} .nmx-chat-typing i:nth-child(2){animation-delay:.15s} .nmx-chat-typing i:nth-child(3){animation-delay:.3s} @keyframes nmx-typing-bounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}} .nmx-chat-scrolldown{position:absolute;right:14px;top:-54px;width:40px;height:40px;border-radius:50%;background:var(--nmx-bg-card,#fff);border:1px solid var(--nmx-border-soft,#dddce0);box-shadow:0 4px 14px rgba(0,0,0,.15);display:none;align-items:center;justify-content:center;cursor:pointer;z-index:5;padding:0} .nmx-chat-scrolldown.nmx-visible{display:flex} .nmx-chat-scrolldown:hover{background:#f5f5f5} .nmx-chat-composer{position:relative;z-index:20;background:var(--nmx-bg-form,#dadfe4);border-top:1px solid rgba(0,0,0,.06);padding:10px 10px calc(env(safe-area-inset-bottom,0px) + 10px);flex-shrink:0} .nmx-chat-composer-inner{max-width:var(--nmx-w-tool,700px);margin:0 auto} .nmx-chat-files{display:none;flex-wrap:wrap;gap:8px;padding:0 2px 8px} .nmx-chat-files.nmx-has-files{display:flex} .nmx-chat-file-chip{position:relative;display:flex;align-items:center;gap:8px;background:var(--nmx-bg-card,#fff);border:1px solid var(--nmx-border-soft,#dddce0);border-radius:var(--nmx-r-pill,24px);padding:5px 10px 5px 5px} .nmx-chat-file-chip img{width:32px;height:32px;border-radius:50%;object-fit:cover;display:block} .nmx-chat-file-chip .nmx-chat-file-ico{width:32px;height:32px;border-radius:50%;background:var(--nmx-primary);color:#fff;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center} .nmx-chat-file-chip span{font-size:var(--nmx-fs-small);color:var(--nmx-tx-2);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .nmx-chat-file-x{width:18px;height:18px;border-radius:50%;border:none;background:rgba(0,0,0,.5);color:#fff;font-size:10px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0} .nmx-chat-box{display:flex;flex-direction:column;gap:2px;background:var(--nmx-fb,#fff);border:var(--nmx-fb2);border-radius:var(--nmx-r-lg,16px);padding:6px 8px;transition:border-color .25s,box-shadow .25s,background .25s} .nmx-chat-box:focus-within{border-color:var(--nmx-fc);box-shadow:var(--nmx-fs)} .nmx-chat-box.nmx-recording{border-color:var(--nmx-red)!important;box-shadow:0 0 0 3px rgba(226,75,74,.1)!important;background:rgba(255,251,251,.95)!important} .nmx-chat-textarea{width:100%;border:none;outline:none;resize:none;background:none;min-height:26px;max-height:420px;font-size:var(--nmx-fs-base);color:var(--nmx-tx);padding:6px;line-height:1.5;overflow-y:auto} .nmx-chat-textarea::placeholder{color:var(--nmx-tx-3)} .nmx-chat-box.nmx-recording .nmx-chat-textarea{cursor:default} .nmx-chat-toolbar{display:flex;align-items:center;gap:2px} .nmx-chat-tools-right{display:flex;align-items:center;gap:2px;margin-left:auto} .nmx-chat-ibtn{width:38px;height:38px;border-radius:50%;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;padding:0;transition:background .15s,transform .1s} .nmx-chat-ibtn:active{transform:scale(.92)} .nmx-chat-ibtn--clip{background:none;color:var(--nmx-tx-3)} .nmx-chat-ibtn--clip:hover{background:rgba(0,0,0,.05)} .nmx-chat-ibtn--clear{background:rgba(0,0,0,.05);color:var(--nmx-tx-3);display:none} .nmx-chat-ibtn--clear.nmx-visible{display:flex} .nmx-chat-ibtn--clear:hover{background:rgba(226,75,74,.08);color:var(--nmx-red)} .nmx-chat-box.nmx-recording .nmx-chat-ibtn--clear{display:none!important} .nmx-chat-ibtn--mic{background:none;color:var(--nmx-tx-3)} .nmx-chat-ibtn--mic:hover{background:rgba(43,108,176,.08);color:var(--nmx-primary)} .nmx-chat-ibtn--mic.nmx-active{background:var(--nmx-success,#22c55e)!important;color:#fff!important} .nmx-chat-ibtn--send{background:var(--nmx-primary)} .nmx-chat-ibtn--send:hover{background:var(--nmx-primary-dark)} .nmx-chat-ibtn--send:disabled{opacity:.45;cursor:not-allowed} .nmx-chat-box.nmx-recording .nmx-chat-ibtn--send{display:none} .nmx-chat-rec-row{display:none;align-items:center;gap:6px;min-width:0;padding:0 6px} .nmx-chat-box.nmx-recording .nmx-chat-rec-row{display:flex;flex:1} .nmx-chat-rec-dot{width:8px;height:8px;border-radius:50%;background:var(--nmx-red);flex-shrink:0;animation:nmx-rec-pulse 1s ease-in-out infinite} @keyframes nmx-rec-pulse{0%,100%{opacity:1}50%{opacity:.3}} .nmx-chat-rec-wave{display:flex;align-items:center;gap:2px;height:20px;flex-shrink:0} .nmx-chat-rec-wave i{display:block;width:2.5px;border-radius:2px;background:var(--nmx-red);animation:nmx-rec-wave .8s ease-in-out infinite} .nmx-chat-rec-wave i:nth-child(1){height:6px;animation-delay:0s} .nmx-chat-rec-wave i:nth-child(2){height:12px;animation-delay:.1s} .nmx-chat-rec-wave i:nth-child(3){height:16px;animation-delay:.2s} .nmx-chat-rec-wave i:nth-child(4){height:10px;animation-delay:.3s} .nmx-chat-rec-wave i:nth-child(5){height:6px;animation-delay:.4s} .nmx-chat-rec-wave i:nth-child(6){height:14px;animation-delay:.5s} .nmx-chat-rec-wave i:nth-child(7){height:8px;animation-delay:.6s} @keyframes nmx-rec-wave{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}} .nmx-chat-rec-timer{font-size:var(--nmx-fs-small);color:var(--nmx-red-dark);font-variant-numeric:tabular-nums;min-width:38px} .nmx-chat-rec-cancel{width:38px;height:38px;padding:0;border-radius:50%;border:none;background:rgba(0,0,0,.05);color:var(--nmx-tx-3);display:none;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0} .nmx-chat-box.nmx-recording .nmx-chat-rec-cancel{display:flex} .nmx-chat-rec-cancel:hover{background:rgba(226,75,74,.1);color:var(--nmx-red)} .nmx-chat-bottom-row{display:flex;align-items:center;justify-content:space-between;gap:10px;max-width:var(--nmx-w-tool,700px);margin:8px auto 0;padding:0 4px;flex-wrap:wrap} .nmx-chat-char-count{font-size:var(--nmx-fs-small);color:var(--nmx-tx-2)} .nmx-chat-char-count.nmx-hidden{visibility:hidden} .nmx-chat-char-count.nmx-overflow{color:var(--nmx-red);font-weight:700} .nmx-chat-gen-counter{font-size:var(--nmx-fs-small);color:var(--nmx-tx-3)} .nmx-chat-gen-counter.nmx-warning{color:var(--nmx-fire,#e07040);font-weight:500} .nmx-chat-gen-counter.nmx-empty{color:var(--nmx-red);font-weight:600} #nmxChatShell .nmx-chat-gen-counter a{color:var(--nmx-violet,#7c5cbf);text-decoration:underline;text-underline-offset:3px} .nmx-chat-right-group{display:flex;align-items:center;gap:10px;margin-left:auto} .nmx-chat-font-group{display:flex;align-items:center;background:var(--nmx-bg-btn-soft,#ededeb);border-radius:var(--nmx-r-sm,8px);overflow:hidden} .nmx-chat-font-btn{background:transparent;border:none;color:var(--nmx-tx-2);padding:5px 11px;font-size:16px;font-weight:600;cursor:pointer} .nmx-chat-font-btn:hover{background:rgba(0,0,0,.06)} .nmx-chat-font-sep{width:1px;height:16px;background:rgba(0,0,0,.1)} .nmx-chat-clear-link{background:none;border:none;color:var(--nmx-tx-3);font-size:var(--nmx-fs-small);cursor:pointer;text-decoration:underline;padding:0} .nmx-chat-clear-link:hover{color:var(--nmx-red-dark)} @media(max-width:768px){ .nmx-chat-window{padding:0 6px} .nmx-chat-welcome{padding:32px 14px} .nmx-chat-composer{padding:8px 6px calc(env(safe-area-inset-bottom,0px) + 8px)} .nmx-chat-textarea,.nmx-chat-user-bubble,.nmx-chat-ai .nmx-answer-text{font-size:19px!important} .nmx-chat-scrolldown{right:10px;top:-50px} } /* Размер сообщений/ввода — один scoped токен. Не меняет форму другого инструмента, меню, счётчики и кнопки; новые/восстановленные сообщения наследуют выбор. */ #nmxChatShell{--nmx-chat-fs:18px} #nmxChatShell .nmx-answer-text,#nmxChatShell .nmx-chat-textarea,#nmxChatShell .nmx-chat-user-bubble{font-size:var(--nmx-chat-fs)!important} #nmxChatShell .nmx-answer-text p,#nmxChatShell .nmx-answer-text li,#nmxChatShell .nmx-answer-text table,#nmxChatShell .nmx-answer-text th,#nmxChatShell .nmx-answer-text td{font-size:1em!important} #nmxChatShell .nmx-answer-text pre,#nmxChatShell .nmx-answer-text code{font-size:.9em!important} #nmxChatShell .nmx-answer-text h1{font-size:1.5em!important} #nmxChatShell .nmx-answer-text h2{font-size:1.3em!important} #nmxChatShell .nmx-answer-text h3{font-size:1.15em!important} #nmxChatShell .nmx-chat-font-btn:disabled{opacity:.4;cursor:default} /* === NMX CHAT END === */ /* === NMX CONTENT GLAVNAYA — интерактив контент-блока главной (вынесено из pages/glavnaya/build/content.txt 21.07.26) === */ .nmc-content summary::-webkit-details-marker{display:none} /* — появление при скролле — */ .nmc-rv{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)} .nmc-rv.nmc-vis{opacity:1;transform:none} .nmc-d1{transition-delay:.08s}.nmc-d2{transition-delay:.16s}.nmc-d3{transition-delay:.24s} .nmc-d4{transition-delay:.32s}.nmc-d5{transition-delay:.4s}.nmc-d6{transition-delay:.48s} /* — карточки — */ .nmc-card{transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s} .nmc-card:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(23,58,102,.14)} .nmc-card-link{position:relative;transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s} .nmc-card-link::after{content:'';position:absolute;inset:0;border-radius:16px;padding:1.5px;background:linear-gradient(135deg,#2b6cb0,#7c5cbf,#d4618c);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s;pointer-events:none} .nmc-card-link:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(23,58,102,.18)} .nmc-card-link:hover::after{opacity:1} .nmc-arr{transition:transform .3s} .nmc-card-link:hover .nmc-arr{transform:translateX(5px)} .nmc-ico{transition:transform .4s cubic-bezier(.34,1.56,.64,1)} .nmc-card-link:hover .nmc-ico,.nmc-card:hover .nmc-ico{transform:scale(1.12) rotate(-5deg)} /* — chips — */ .nmc-chip{transition:transform .25s,border-color .25s,background .25s,box-shadow .25s} .nmc-chip:hover{border-color:#2b6cb0 !important;background:#f5f9ff !important;transform:translateY(-2px);box-shadow:0 8px 18px rgba(43,108,176,.16)} /* — кнопки: подъём + пробегающий блик — */ .nmc-btn-main,.nmc-btn-white{position:relative;overflow:hidden;transition:transform .3s,box-shadow .3s} .nmc-btn-main:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(26,64,112,.38)} .nmc-btn-white:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(4,12,26,.38)} .nmc-btn-main::after,.nmc-btn-white::after{content:'';position:absolute;top:0;left:-90%;width:55%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);transition:left .65s ease;pointer-events:none} .nmc-btn-white::after{background:linear-gradient(105deg,transparent,rgba(43,108,176,.16),transparent)} .nmc-btn-main:hover::after,.nmc-btn-white:hover::after{left:135%} /* — FAQ — */ .nmc-sum:hover{background:#f8fafd} .nmc-a:hover{color:#1a4070 !important} .nmc-chev{transition:transform .35s} .nmc-faq-d{transition:box-shadow .3s,border-color .3s} .nmc-faq-d:hover{border-color:#c9d5e3} .nmc-faq-d[open]{box-shadow:0 14px 30px rgba(23,58,102,.1);border-color:#c9d5e3} .nmc-faq-d[open] .nmc-chev{transform:rotate(180deg)} .nmc-faq-d[open] .nmc-faq-p{animation:nmcFade .45s ease} /* — анимации сцен — */ .nmc-float{animation:nmcFloat 5s ease-in-out infinite} .nmc-float2{animation:nmcFloat 6.5s ease-in-out .9s infinite} .nmc-float3{animation:nmcFloat 7.5s ease-in-out 1.8s infinite} .nmc-tw{animation:nmcTw 2.6s ease-in-out infinite} .nmc-tw2{animation:nmcTw 3.4s ease-in-out 1.3s infinite} .nmc-dot1{animation:nmcDot 1.2s ease-in-out infinite} .nmc-dot2{animation:nmcDot 1.2s ease-in-out .2s infinite} .nmc-dot3{animation:nmcDot 1.2s ease-in-out .4s infinite} .nmc-star{animation:nmcFloat 6s ease-in-out infinite,nmcStar 3.6s ease-in-out infinite} .nmc-ring{animation:nmcRing 2.8s ease-out infinite} /* — градиентный акцент в заголовках — */ .nmc-grad{background:linear-gradient(90deg,#2b6cb0,#7c5cbf);-webkit-background-clip:text;background-clip:text;color:transparent} .nmc-grad-w{background:linear-gradient(90deg,#bfe0ff,#e3d7f9);-webkit-background-clip:text;background-clip:text;color:transparent} @keyframes nmcFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}} @keyframes nmcTw{0%,100%{opacity:1}50%{opacity:.3}} @keyframes nmcDot{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}} @keyframes nmcStar{0%,100%{filter:drop-shadow(0 14px 26px rgba(4,12,26,.5))}50%{filter:drop-shadow(0 10px 42px rgba(255,214,120,.65))}} @keyframes nmcRing{0%{transform:scale(.68);opacity:.8}100%{transform:scale(1.55);opacity:0}} @keyframes nmcFade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}} @media (prefers-reduced-motion:reduce){ .nmc-rv{opacity:1;transform:none;transition:none} .nmc-float,.nmc-float2,.nmc-float3,.nmc-tw,.nmc-tw2,.nmc-dot1,.nmc-dot2,.nmc-dot3,.nmc-star,.nmc-ring{animation:none} } /* === NMX CONTENT GLAVNAYA END === */ /* === NMX TARIFY MOBILE (24.07): тарифные карточки на телефонах — столбик, акцент первым === */ @media (max-width:600px){ #tarify-cards .nmc-card{grid-column:1/-1} #tarify-cards .nmc-d4{order:-1} } /* === NMX TARIFY MOBILE END === */ /* === NMX VITRINA LIST (25.07): панель витрины v4 — два цветных столбца-трека со строками-инструментами; тинт трека, градиент иконки и акцент стрелки — inline === */ #allrecords .nmc-vlist{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px} #allrecords .nmc-vtrack{border-radius:20px;padding:20px 18px;box-shadow:0 2px 4px rgba(16,24,40,.05),0 24px 48px rgba(6,16,31,.14)} #allrecords .nmc-vtrack__head{display:flex;align-items:center;gap:9px;margin:2px 4px 4px} #allrecords .nmc-vtrack__dot{width:9px;height:9px;border-radius:50%;flex-shrink:0} #allrecords .nmc-vtrack__h{font-size:21px;font-weight:700;letter-spacing:-.2px;color:#0f1626;margin:0} #allrecords .nmc-vtrack__lead{font-size:15px;line-height:1.45;color:#5b6675;margin:0 4px 14px 22px} #allrecords .nmc-vtrack__rows{display:flex;flex-direction:column;gap:9px} #allrecords .nmc-vrow{background:#ffffff;border:1px solid #e0e7ef;border-radius:12px;padding:13px 14px;display:flex;align-items:center;gap:13px;text-decoration:none;box-shadow:0 1px 3px rgba(16,24,40,.05);transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s,border-color .3s} #allrecords .nmc-vrow:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(23,58,102,.12);border-color:#c9d5e3} #allrecords .nmc-vrow__ic{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0} #allrecords .nmc-vrow__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px} #allrecords .nmc-vrow__t{font-size:17px;font-weight:700;line-height:1.3;color:#0f1626} #allrecords .nmc-vrow__d{font-size:16px;line-height:1.4;color:#3f4a59} #allrecords .nmc-vrow__arr{flex-shrink:0;display:flex;transition:transform .3s} #allrecords .nmc-vrow:hover .nmc-vrow__arr{transform:translateX(4px)} /* === NMX VITRINA LIST END === */ /* === NMX LP (25.07.26): витрины разделов — галерея страниц-примеров + лайтбокс; первый носитель numerolog v3 === */ #allrecords .nmx-gal{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:12px 0 0} #allrecords .nmx-gal img{width:100%;height:auto;border-radius:10px;border:1px solid #e0e7ef;cursor:zoom-in;box-shadow:0 1px 3px rgba(16,24,40,.07);transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s} #allrecords .nmx-gal img:hover{transform:scale(1.05);box-shadow:0 12px 26px rgba(23,58,102,.2)} .nmx-lb{position:fixed;inset:0;z-index:99999;background:rgba(6,16,31,.93);display:none;align-items:center;justify-content:center;padding:28px;cursor:zoom-out} .nmx-lb.active{display:flex} .nmx-lb img{max-width:100%;max-height:100%;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.55)} /* === NMX LP END === */ /* === NMX HERO COSMIC (25.07.26): космический первый экран витрин — звёздное поле, орбиты, блюр-свечения; модификатор к .nmx-hero. Звёзды расставляет JS блока (.nmx-hero__stars) === */ .nmx-hero--cosmic{min-height:88vh;display:flex;align-items:center;justify-content:center;padding:80px 24px 100px;background:linear-gradient(170deg,#020a18 0%,#06101f 20%,#0c1d3a 45%,#132e55 70%,#1a4070 100%)} .nmx-hero--cosmic .nmx-hero__inner{max-width:800px} .nmx-hero__stars{position:absolute;inset:0;overflow:hidden;pointer-events:none} .nmx-hero__star{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;animation:nmxTwinkle 3s ease-in-out infinite} .nmx-hero__orbit{position:absolute;top:50%;left:50%;width:280px;height:280px;margin:-140px 0 0 -140px;border:1px solid rgba(255,255,255,.04);border-radius:50%;pointer-events:none} .nmx-hero__orbit--m{width:440px;height:440px;margin:-220px 0 0 -220px;border-color:rgba(255,255,255,.03)} .nmx-hero__orbit--l{width:620px;height:620px;margin:-310px 0 0 -310px;border-color:rgba(255,255,255,.02)} .nmx-hero__orbit-dot{position:absolute;top:50%;left:50%;width:6px;height:6px;margin:-3px;background:rgba(100,180,255,.6);border-radius:50%;box-shadow:0 0 12px rgba(100,180,255,.4);animation:nmxOrbit 20s linear infinite} .nmx-hero__orbit--m .nmx-hero__orbit-dot{animation-duration:35s;background:rgba(160,120,240,.5);box-shadow:0 0 12px rgba(160,120,240,.3)} .nmx-hero__orbit--l .nmx-hero__orbit-dot{animation-duration:50s;background:rgba(80,210,170,.4);box-shadow:0 0 12px rgba(80,210,170,.3)} .nmx-hero__blur{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none} .nmx-hero__blur--1{top:-10%;right:-5%;width:500px;height:500px;background:rgba(60,130,220,.12)} .nmx-hero__blur--2{bottom:-15%;left:-10%;width:600px;height:600px;background:rgba(120,80,200,.08)} .nmx-hero__blur--3{top:40%;left:30%;width:300px;height:300px;background:rgba(80,210,170,.06)} .nmx-hero--cosmic .nmx-hero__badge{font-size:13px;letter-spacing:.14em;margin-bottom:28px;animation:nmxFadeIn 1s ease .2s both} .nmx-hero--cosmic h1{font-size:52px;line-height:1.15;margin:0 0 24px;animation:nmxSlideUp .8s ease .3s both} .nmx-hero__grad{background:linear-gradient(135deg,#64b4ff,#a78bfa,#5eead4);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent} .nmx-hero--cosmic .nmx-hero__sub{font-size:20px;line-height:1.7;color:rgba(255,255,255,.65);animation:nmxSlideUp .8s ease .5s both} .nmx-hero__stats{display:flex;justify-content:center;flex-wrap:wrap;gap:48px;margin-top:40px;animation:nmxSlideUp .8s ease .7s both} .nmx-hero__stat-num{font-size:36px;font-weight:400;color:#fff;line-height:1.2} .nmx-hero__stat-label{font-size:14px;color:rgba(255,255,255,.45);margin-top:4px} .nmx-hero__scroll{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);z-index:2;animation:nmxFloatY 3s ease-in-out infinite} .nmx-hero__scroll svg{width:28px;height:28px;stroke:rgba(255,255,255,.3);fill:none;stroke-width:2} @keyframes nmxTwinkle{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}} @keyframes nmxOrbit{from{transform:rotate(0deg) translateX(140px) rotate(0deg)}to{transform:rotate(360deg) translateX(140px) rotate(-360deg)}} @keyframes nmxFadeIn{from{opacity:0}to{opacity:1}} @keyframes nmxSlideUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}} @keyframes nmxFloatY{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-12px)}} @media(max-width:768px){ .nmx-hero--cosmic{min-height:auto;padding:60px 16px 70px} .nmx-hero--cosmic h1{font-size:32px} .nmx-hero--cosmic .nmx-hero__sub{font-size:17px} .nmx-hero__stats{gap:22px;margin-top:30px} .nmx-hero__stat-num{font-size:28px} .nmx-hero__orbit--l{display:none} .nmx-hero__scroll{display:none} } @media (prefers-reduced-motion:reduce){ .nmx-hero__star,.nmx-hero__orbit-dot,.nmx-hero__scroll{animation:none} .nmx-hero--cosmic .nmx-hero__badge,.nmx-hero--cosmic h1,.nmx-hero--cosmic .nmx-hero__sub,.nmx-hero__stats{animation:none;opacity:1;transform:none} } /* === NMX HERO COSMIC END === */ /* === NMX LINK CARDS (13.09.26): карточки-ссылки, которые печатает tools/build-nav.py — «Похожие инструменты» (страницы), «Инструменты раздела» и «Другие разделы» (хабы). База карточки inline (цвет раздела в --c), здесь только ховер и transition (canon/03: в прод без page-local ) === */ .nmx-lk-card{transition:border-color .15s,box-shadow .15s,transform .15s} .nmx-lk-card:hover{border-color:var(--c)!important;box-shadow:0 8px 20px rgba(16,24,40,.08);transform:translateY(-1px)} /* === NMX LINK CARDS END === */ /* UP-NMX-COMPAT END */ /* Общий дизайн резервного питания, 08.10.2026 */ .ep-tools{font-family:Arial,sans-serif;color:#173348;background:#f2f5f5;font-synthesis:none} :where(.ep-tools) *{box-sizing:border-box} .ep-tools{margin:0} :where(.ep-tools) button,:where(.ep-tools) input,:where(.ep-tools) select,:where(.ep-tools) textarea{font:inherit} :where(.ep-tools) button,:where(.ep-tools) a,:where(.ep-tools) input{touch-action:manipulation} :where(.ep-tools) button{cursor:pointer} :where(.ep-tools) button:disabled{cursor:default;opacity:.5} :where(.ep-tools) [hidden]{display:none!important} :where(.ep-tools) a{color:#246949} :where(.ep-tools) button:focus-visible,:where(.ep-tools) a:focus-visible,:where(.ep-tools) summary:focus-visible,:where(.ep-tools) input:focus-visible,:where(.ep-tools) select:focus-visible,:where(.ep-tools) textarea:focus-visible{outline:3px solid #b77b0b;outline-offset:3px} :where(.ep-tools) .shell{max-width:1220px;padding:0 32px;margin:auto} :where(.ep-tools) .topbar{background:#fff;border-bottom:1px solid #dce5e2} :where(.ep-tools) .topbar .shell{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:80px} :where(.ep-tools) .brand{font-size:23px;font-weight:800;letter-spacing:-.6px} :where(.ep-tools) .brand em{color:#288751;font-style:normal} :where(.ep-tools) .brand small{display:block;font-size:12px;letter-spacing:.1px;font-weight:400;margin-top:5px;color:#6b7e86} :where(.ep-tools) .draft{font-size:12px;background:#eef4f1;border-radius:20px;padding:8px 13px;color:#517064} :where(.ep-tools) .intro{padding:42px 0 24px} :where(.ep-tools) .eyebrow{font-size:11px;letter-spacing:1.8px;text-transform:uppercase;font-weight:bold;color:#547765;margin:0 0 12px} :where(.ep-tools) h1{font-size:clamp(30px,3.8vw,45px);line-height:1.1;letter-spacing:-1.3px;margin:0 0 15px;max-width:750px} :where(.ep-tools) .intro p:last-child{color:#63777f;max-width:730px;line-height:1.6;margin:0} :where(.ep-tools) .demo{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:0 0 22px} :where(.ep-tools) .demo-label{font-size:12px;color:#6b7b82} :where(.ep-tools) .modes{display:flex;gap:6px;border:1px solid #d7e3dc;border-radius:12px;padding:5px;background:#e8eeeb} :where(.ep-tools) .modes button{border:0;background:none;color:#50675c;border-radius:8px;padding:11px 23px;font-size:14px;font-weight:bold} :where(.ep-tools) .modes button[aria-pressed=true]{background:#fff;color:#163b2a;box-shadow:0 2px 5px #18332c12} :where(.ep-tools) .selector{background:#fff;border:1px solid #d7e2df;border-radius:22px;overflow:hidden;box-shadow:0 14px 40px #18392b05} :where(.ep-tools) .selector-head{background:#143b30;color:#fff;padding:27px 30px;display:flex;align-items:center;gap:24px;justify-content:space-between} :where(.ep-tools) .selector-head h2{font-size:25px;letter-spacing:-.5px;margin:0 0 8px} :where(.ep-tools) .selector-head p{font-size:14px;color:#c2d4c9;line-height:1.5;margin:0} :where(.ep-tools) .badge{white-space:nowrap;border:1px solid #6b927d;border-radius:22px;padding:8px 12px;font-size:11px;color:#cee4d2} :where(.ep-tools) .step{padding:26px 30px;border-bottom:1px solid #e5ece8} :where(.ep-tools) .step-title{display:flex;align-items:center;gap:11px;margin-bottom:18px} :where(.ep-tools) .step-title h3{font-size:17px;margin:0} :where(.ep-tools) .step-title .number{color:#2a714b;background:#eaf3ec;display:grid;place-items:center;border-radius:50%;height:27px;width:27px;font-size:12px;font-weight:bold;flex-shrink:0} :where(.ep-tools) .reset{margin-left:auto;border:0;background:none;color:#6b7c79;font-size:12px;padding:8px} :where(.ep-tools) .devices{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px} :where(.ep-tools) .device{display:flex;align-items:center;gap:10px;min-height:81px;border:1px solid #dce4e0;background:#fff;border-radius:11px;text-align:left;padding:12px 10px;color:#334d42;position:relative} :where(.ep-tools) .device:hover{border-color:#63a779;background:#f6faf6} :where(.ep-tools) .device[aria-pressed=true]{background:#eaf5dc;border-color:#90b757;color:#213e25;box-shadow:inset 0 0 0 1px #90b757} :where(.ep-tools) .device svg{width:22px;height:22px;min-width:22px;stroke:#398557;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round} :where(.ep-tools) .device b{font-size:12px;line-height:1.3;display:block} :where(.ep-tools) .device small{display:block;color:#74847a;margin-top:4px;font-size:12px} :where(.ep-tools) .device[aria-pressed=true] small{color:#496b3d} :where(.ep-tools) .help{font-size:12px;color:#73847e;line-height:1.6;margin:13px 0 0} :where(.ep-tools) .refine{margin-top:15px} :where(.ep-tools) .refine summary{font-size:13px;color:#2a6746;cursor:pointer;padding:5px 0} :where(.ep-tools) .editor{margin-top:14px;display:grid;gap:10px} :where(.ep-tools) .editrow{padding:14px;border:1px solid #dce5df;border-radius:12px;display:grid;grid-template-columns:1.5fr repeat(4,minmax(0,1fr));gap:12px;align-items:end;background:#f9fbfa} :where(.ep-tools) .editrow>strong{align-self:center;font-size:13px} :where(.ep-tools) .editrow label{display:grid;gap:6px;font-size:11px;color:#647971} :where(.ep-tools) .editrow input{width:100%;min-width:0;padding:9px 8px;border:1px solid #cbdacf;border-radius:7px;color:#173b2c;background:#fff} :where(.ep-tools) .add{border:1px dashed #9ab7a5;border-radius:8px;background:#fff;color:#367449;font-size:13px;padding:12px;margin-top:12px} :where(.ep-tools) .time-layout{display:grid;grid-template-columns:1fr 250px;gap:30px;align-items:start} :where(.ep-tools) .time-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:10px} :where(.ep-tools) .time-presets button{background:#fff;border:1px solid #d9e4dc;border-radius:10px;padding:13px 8px;font-weight:bold;color:#385546} :where(.ep-tools) .time-presets button small{display:block;font-size:11px;font-weight:normal;color:#7b8c81;margin-top:5px} :where(.ep-tools) .time-presets button[aria-pressed=true]{background:#f8e6b9;border-color:#d9b765;color:#664908} :where(.ep-tools) .slider-row{display:flex;align-items:center;gap:18px;margin-top:17px} :where(.ep-tools) .slider-row input[type=range]{width:100%;accent-color:#31794d} :where(.ep-tools) .hours-field{display:flex;align-items:center;gap:7px;font-size:12px;color:#6a7b73;white-space:nowrap} :where(.ep-tools) .hours-field input{width:68px;padding:8px;border:1px solid #c7d6cd;border-radius:7px;color:#173b2c} :where(.ep-tools) .place{display:grid;gap:9px;font-size:12px;color:#657a6b;padding-top:2px} :where(.ep-tools) .place select{width:100%;padding:13px 10px;border:1px solid #d6e1d9;border-radius:9px;color:#254332;background:#fff} :where(.ep-tools) .metrics{display:grid;grid-template-columns:repeat(3,1fr);background:#f4f8f4;padding:23px 30px;gap:26px} :where(.ep-tools) .metric{border-right:1px solid #dce6db} :where(.ep-tools) .metric:last-child{border:0} :where(.ep-tools) .metric span{font-size:12px;color:#6c7e70;display:block;margin-bottom:7px} :where(.ep-tools) .metric strong{font-size:30px;letter-spacing:-.8px;line-height:1.1} :where(.ep-tools) .metric strong small{font-size:13px;letter-spacing:0;margin-left:3px} :where(.ep-tools) .metric p{font-size:11px;margin:7px 0 0;color:#738370;line-height:1.4} :where(.ep-tools) .calculation-note{padding:0 30px 21px;background:#f4f8f4} :where(.ep-tools) .calculation-note summary{font-size:12px;cursor:pointer;color:#557459} :where(.ep-tools) .calculation-note p{font-size:12px;line-height:1.6;max-width:930px;color:#697f6b} :where(.ep-tools) .calculation-note label{display:inline-flex;gap:7px;align-items:center;font-size:12px;margin:8px 18px 0 0} :where(.ep-tools) .calculation-note input{width:68px;padding:7px;border:1px solid #c8d8c6;border-radius:6px} :where(.ep-tools) .results{padding:30px} :where(.ep-tools) .result-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:10px} :where(.ep-tools) .result-heading h3{font-size:21px;margin:0;letter-spacing:-.4px} :where(.ep-tools) .count{font-size:11px;color:#708379} :where(.ep-tools) .result-note{font-size:13px;color:#75877b;margin:0 0 20px;line-height:1.55} :where(.ep-tools) .warning{border-left:3px solid #cf9b38;background:#fff9ec;padding:12px 15px;font-size:12px;color:#7a6335;line-height:1.55;margin:0 0 20px} :where(.ep-tools) .result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px} :where(.ep-tools) .product{border:1px solid #d7e4db;border-radius:13px;padding:20px;display:flex;flex-direction:column;min-width:0} :where(.ep-tools) .product.selected{border-color:#26804b;box-shadow:inset 0 0 0 1px #26804b} :where(.ep-tools) .product-tag{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#6c8876;margin-bottom:11px} :where(.ep-tools) .product h4{font-size:18px;line-height:1.25;margin:0 0 13px;color:#233d2e} :where(.ep-tools) .spec{font-size:12px;color:#547060;margin-bottom:8px;line-height:1.5} :where(.ep-tools) .runtime{font-size:12px;color:#286f43;margin:2px 0 16px} :where(.ep-tools) .price{font-size:24px;font-weight:bold;letter-spacing:-.5px;margin-top:auto} :where(.ep-tools) .source{font-size:11px;line-height:1.5;color:#6c7e70;margin:5px 0 16px} :where(.ep-tools) .source a{color:#64806b} :where(.ep-tools) .product button,:where(.ep-tools) .primary{display:inline-flex;align-items:center;justify-content:center;border:1px solid #267446;border-radius:9px;background:#fff;color:#267446;padding:12px;font-weight:bold;font-size:13px;min-height:44px;text-decoration:none} :where(.ep-tools) .product.selected button,:where(.ep-tools) .primary{background:#277a46;color:#fff} :where(.ep-tools) .no-results{padding:23px;border-radius:12px;background:#f5f8f5;color:#627967;font-size:14px;line-height:1.6;grid-column:1/-1} :where(.ep-tools) .kit-spec{grid-column:1/-1;border:1px solid #cfdecf;background:#f5f9f1;border-radius:14px;padding:23px} :where(.ep-tools) .kit-spec h4{margin:0 0 15px;font-size:18px} :where(.ep-tools) .kit-spec p{color:#5a735b;font-size:14px;line-height:1.6} :where(.ep-tools) .kit-spec ul{padding-left:20px;font-size:14px;line-height:1.9;margin-bottom:0} :where(.ep-tools) .request{padding:25px 30px;background:#153b30;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:25px} :where(.ep-tools) .request h3{font-size:19px;margin:0 0 8px} :where(.ep-tools) .request p{font-size:12px;line-height:1.5;color:#c1d7c8;margin:0;max-width:620px} :where(.ep-tools) .request .primary{background:#d9eda1;border-color:#d9eda1;color:#294322;white-space:nowrap} :where(.ep-tools) .brief-panel{padding:25px 30px;background:#f6faf7;border-top:1px solid #d7e3d9} :where(.ep-tools) .brief-panel label{font-size:15px;font-weight:bold;display:block;margin-bottom:12px} :where(.ep-tools) .brief-panel textarea{display:block;width:100%;height:220px;border:1px solid #bacfc0;border-radius:9px;background:#fff;color:#31563f;font-size:12px;line-height:1.65;padding:14px;resize:vertical} :where(.ep-tools) .brief-actions{display:flex;align-items:center;gap:15px;margin-top:12px;flex-wrap:wrap} :where(.ep-tools) .brief-actions span{font-size:12px;color:#637765} :where(.ep-tools) .footer{padding:22px 0 38px;color:#819084;font-size:11px;line-height:1.6} :where(.ep-tools) .error{color:#8b3326;font-size:13px;background:#fff0ec;border:1px solid #f3c9bd;border-radius:10px;padding:14px;margin-bottom:15px} :where(.ep-tools) .mode-bridge{border:0;background:none;text-decoration:underline;color:#267349;font-size:inherit;padding:0} @media(max-width:1100px){:where(.ep-tools) .devices{grid-template-columns:repeat(4,minmax(0,1fr))} :where(.ep-tools) .time-layout{grid-template-columns:1fr 220px} :where(.ep-tools) .device b{font-size:13px}} @media(max-width:760px){:where(.ep-tools) .shell{padding:0 18px} :where(.ep-tools) .intro{padding-top:29px} :where(.ep-tools) .selector-head{padding:23px} :where(.ep-tools) .badge{display:none} :where(.ep-tools) .step{padding:23px} :where(.ep-tools) .devices{grid-template-columns:repeat(3,minmax(0,1fr))} :where(.ep-tools) .device{flex-direction:column;align-items:start;gap:7px} :where(.ep-tools) .time-layout{grid-template-columns:1fr;gap:20px} :where(.ep-tools) .editrow{grid-template-columns:repeat(2,minmax(0,1fr))} :where(.ep-tools) .editrow>strong{grid-column:1/-1} :where(.ep-tools) .result-grid{grid-template-columns:1fr} :where(.ep-tools) .metrics{padding:22px;gap:14px} :where(.ep-tools) .metric strong{font-size:24px} :where(.ep-tools) .metric span{font-size:11px} :where(.ep-tools) .metric p{font-size:10px} :where(.ep-tools) .calculation-note{padding:0 22px 20px} :where(.ep-tools) .results{padding:23px} :where(.ep-tools) .request{flex-direction:column;align-items:stretch;padding:23px;gap:17px} :where(.ep-tools) .request .primary{width:100%} :where(.ep-tools) .brief-panel{padding:23px} :where(.ep-tools) .result-heading{align-items:start;flex-direction:column} :where(.ep-tools) .product{display:grid;grid-template-columns:1fr auto;column-gap:20px} :where(.ep-tools) .product h4,:where(.ep-tools) .product-tag,:where(.ep-tools) .spec,:where(.ep-tools) .runtime{grid-column:1} :where(.ep-tools) .product .price{grid-column:2;grid-row:2;text-align:right;font-size:22px} :where(.ep-tools) .product .source{grid-column:1/-1} :where(.ep-tools) .product button{grid-column:1/-1} :where(.ep-tools) .demo{gap:10px} :where(.ep-tools) .draft{font-size:10px} :where(.ep-tools) .intro p:last-child{font-size:14px}} @media(max-width:420px){:where(.ep-tools) .shell{padding:0 12px} :where(.ep-tools) .brand{font-size:20px} :where(.ep-tools) .brand small{font-size:10px} :where(.ep-tools) .draft{padding:7px;max-width:105px;text-align:center} :where(.ep-tools) .selector-head{padding:21px 18px} :where(.ep-tools) .selector-head h2{font-size:21px} :where(.ep-tools) .step{padding:21px 16px} :where(.ep-tools) .device{padding:11px 8px;min-height:93px} :where(.ep-tools) .device b{font-size:11px} :where(.ep-tools) .devices{gap:7px} :where(.ep-tools) .metrics{grid-template-columns:1fr;gap:16px;padding:21px} :where(.ep-tools) .metric{border-right:0;border-bottom:1px solid #dce6db;padding-bottom:13px;display:grid;grid-template-columns:1fr auto;gap:4px} :where(.ep-tools) .metric:last-child{padding-bottom:0} :where(.ep-tools) .metric span{align-self:center;margin:0} :where(.ep-tools) .metric p{margin:0;grid-column:1/-1} :where(.ep-tools) .metric strong{font-size:25px} :where(.ep-tools) .modes{width:100%} :where(.ep-tools) .modes button{flex:1;padding:11px 8px;font-size:12px} :where(.ep-tools) .step-title h3{font-size:15px} :where(.ep-tools) .reset{font-size:10px;padding:5px} :where(.ep-tools) .product{display:flex} :where(.ep-tools) .product .price{text-align:left;font-size:25px} :where(.ep-tools) .time-presets{gap:7px} :where(.ep-tools) .time-presets button{font-size:13px} :where(.ep-tools) .time-presets button small{font-size:10px}} @media(prefers-reduced-motion:reduce){:where(.ep-tools) *{scroll-behavior:auto!important}} .ep-en02{font-family:Arial,Helvetica,sans-serif;color:#173c31;background:#fafbf7;--k-ink:#163d30;--k-green:#26774d;--k-lime:#d9ec9b;--k-muted:#65786c} .ep-en02{scroll-behavior:smooth;scroll-padding-top:28px} .ep-en02{background:#fafbf7} :where(.ep-en02) a{color:inherit} :where(.ep-en02) button,:where(.ep-en02) input,:where(.ep-en02) select,:where(.ep-en02) textarea{font:inherit} :where(.ep-en02) .k-wrap{width:min(1180px,100% - 64px);margin:auto} :where(.ep-en02) .k-preview{background:#e8eddf;color:#5c6d58;padding:9px 24px;text-align:center;font-size:11px;letter-spacing:.2px} :where(.ep-en02) .k-preview span{margin-left:20px} :where(.ep-en02) .k-header{background:#fafbf7;border-bottom:1px solid #e2e8dc} :where(.ep-en02) .k-nav{height:94px;display:flex;align-items:center;justify-content:space-between;gap:30px} :where(.ep-en02) .k-brand{display:flex;align-items:center;gap:11px;font-size:22px;font-weight:700;text-decoration:none;letter-spacing:-.7px} :where(.ep-en02) .k-brand b{color:#318353} :where(.ep-en02) .k-brand small{display:block;font-weight:400;font-size:11px;color:#6a7d6e;letter-spacing:.2px;margin-top:5px} :where(.ep-en02) .k-logo{width:37px;height:37px;background:#d9ec9b;border-radius:10px;display:grid;place-items:center;font-size:30px;font-weight:400;line-height:1} :where(.ep-en02) .k-nav nav{display:flex;gap:28px} :where(.ep-en02) .k-nav nav a{font-size:13px;text-decoration:none;color:#49604f} :where(.ep-en02) .k-nav nav a:hover{color:#26774d} :where(.ep-en02) .k-button{display:inline-flex;justify-content:center;align-items:center;gap:26px;padding:17px 22px;border-radius:8px;background:#1e6743;color:#fff;text-decoration:none;font-weight:600;font-size:14px;border:1px solid #1e6743;min-height:48px} :where(.ep-en02) .k-button:hover{background:#164b32} :where(.ep-en02) .k-outline{background:transparent;color:#235a3e;border-color:#a8b9a5;padding:12px 18px;font-size:12px} :where(.ep-en02) .k-outline:hover{background:#eef3e5} :where(.ep-en02) .k-hero{display:grid;grid-template-columns:1.14fr 1fr;align-items:center;gap:45px;padding-top:65px;padding-bottom:68px} :where(.ep-en02) .k-overline{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;font-weight:600;color:#537450;margin:0 0 22px} :where(.ep-en02) .k-overline>span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7ea747;vertical-align:middle;margin-right:8px} :where(.ep-en02) .k-hero h1{font-size:clamp(34px,4.1vw,54px);font-weight:600;letter-spacing:-2.3px;line-height:1.12;margin:0 0 24px;max-width:640px} :where(.ep-en02) .k-hero h1 em{font-style:normal;color:#5b8659} :where(.ep-en02) .k-lead{font-size:16px;line-height:1.75;color:#647767;max-width:510px} :where(.ep-en02) .k-actions{display:flex;align-items:center;gap:22px;margin-top:30px;flex-wrap:wrap} :where(.ep-en02) .k-text-link{font-size:13px;text-decoration:none;border-bottom:1px solid #b1beaa;padding:9px 0} :where(.ep-en02) .k-hero-facts{display:flex;flex-wrap:wrap;gap:10px 17px;margin-top:31px;font-size:11px;color:#61745e;max-width:500px} :where(.ep-en02) .k-hero-facts span:before{content:'✓';margin-right:6px;color:#35794b} :where(.ep-en02) .k-hero-art{height:430px;background:#e8eddf;border-radius:24px;position:relative;overflow:hidden;isolation:isolate} :where(.ep-en02) .k-art-top{display:flex;align-items:center;gap:8px;padding:23px 24px;font-size:11px;color:#49604a} :where(.ep-en02) .k-art-top>span:last-child{margin-left:auto;font-weight:600} :where(.ep-en02) .k-live-dot{height:6px;width:6px;border-radius:50%;background:#729545} :where(.ep-en02) .k-orbit{position:absolute;width:340px;height:340px;left:80px;top:70px;border:1px solid #cdd9be;border-radius:50%;background:radial-gradient(circle,#d6e3b6 0,transparent 65%);z-index:-1} :where(.ep-en02) .k-orbit:before{content:'';position:absolute;inset:38px;border:1px solid #d0ddbf;border-radius:50%} :where(.ep-en02) .k-battery{position:absolute;left:46px;top:129px;width:225px;height:199px;border-radius:13px;background:linear-gradient(115deg,#214d3a,#173c2d);box-shadow:12px 17px 26px #3b5f3621,inset -10px 0 0 #123123;border-top:12px solid #28543d;padding:30px 25px;color:#dceacb;transform:rotate(-6deg)} :where(.ep-en02) .k-battery-handle{position:absolute;top:-36px;left:50px;width:100px;height:30px;border:8px solid #486847;border-bottom:0;border-radius:9px 9px 0 0} :where(.ep-en02) .k-pins{position:absolute;top:-22px;left:20px;right:22px;display:flex;justify-content:space-between} :where(.ep-en02) .k-pins i{font-size:9px;font-style:normal;color:white;width:19px;height:13px;display:grid;place-items:center;border-radius:3px;background:#bb775d} :where(.ep-en02) .k-pins i:last-child{background:#638275} :where(.ep-en02) .k-device-label{font-size:8px;font-weight:600;letter-spacing:1.6px;display:block;opacity:.8} :where(.ep-en02) .k-battery strong{font-size:28px;font-weight:500;display:block;margin-top:10px;letter-spacing:-.4px} :where(.ep-en02) .k-battery sub{font-size:17px} :where(.ep-en02) .k-battery small{font-size:9px;opacity:.7} :where(.ep-en02) .k-charge-bars{display:flex;gap:3px;margin:14px 0 7px} :where(.ep-en02) .k-charge-bars i{width:27px;height:7px;background:#cae28b;border-radius:1px} :where(.ep-en02) .k-charge-bars i:last-child{opacity:.4} :where(.ep-en02) .k-inverter{position:absolute;top:96px;right:30px;background:linear-gradient(135deg,#fefef8,#dadfcf);border:1px solid #f6f8ef;border-radius:11px;padding:20px;width:165px;height:126px;box-shadow:8px 10px 25px #3b5f3622;transform:rotate(7deg);color:#3e5a41} :where(.ep-en02) .k-inverter strong{font-size:52px;line-height:1;display:block;font-weight:400} :where(.ep-en02) .k-socket{position:absolute;right:16px;top:47px;height:36px;width:36px;border:4px solid #b3c0a7;border-radius:50%;display:grid;place-items:center;font-size:28px;line-height:1;color:#51694a;background:#dbe2d3} :where(.ep-en02) .k-inverter small,:where(.ep-en02) .k-charger small{font-size:9px;display:block} :where(.ep-en02) .k-charger{position:absolute;right:26px;top:263px;width:155px;height:80px;background:#6d815f;border-top:6px solid #849573;border-radius:7px;transform:rotate(5deg);padding:12px 15px;box-shadow:6px 10px 20px #3b5f3625;color:#f0f5e7} :where(.ep-en02) .k-charger strong{position:absolute;right:14px;top:11px;font-size:28px;font-weight:400;color:#d6e9a4} :where(.ep-en02) .k-charger small{margin-top:12px;font-size:8px} :where(.ep-en02) .k-art-note{position:absolute;bottom:34px;left:26px;font-size:10px;line-height:1.5;color:#597153} :where(.ep-en02) .k-art-note span{display:block;font-size:8px;letter-spacing:1px;margin-bottom:7px;color:#839577} :where(.ep-en02) .k-art-caption{position:absolute;bottom:11px;left:26px;font-size:8px;color:#718168} :where(.ep-en02) .k-band{border-top:1px solid #e2e8d8;border-bottom:1px solid #e2e8d8} :where(.ep-en02) .k-band>.k-wrap{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:25px 0} :where(.ep-en02) .k-band span{font-size:12px;line-height:1.6;color:#7a8672} :where(.ep-en02) .k-band b{color:#324f37} :where(.ep-en02) .k-band p{font-size:12px;color:#4b634b} :where(.ep-en02) .k-section{padding-top:82px;padding-bottom:80px} :where(.ep-en02) .k-section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:32px} :where(.ep-en02) .k-section-head h2,:where(.ep-en02) .k-install h2,:where(.ep-en02) .k-faq h2,:where(.ep-en02) .k-final h2{font-size:clamp(27px,3vw,39px);line-height:1.15;font-weight:500;letter-spacing:-1.3px;margin:0} :where(.ep-en02) .k-section-head .k-overline{margin-bottom:15px} :where(.ep-en02) .k-section-head>p{max-width:365px;font-size:14px;line-height:1.65;color:#6c7c69;margin:0 0 3px} :where(.ep-en02) .k-scenarios{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} :where(.ep-en02) .k-scenario{padding:27px 25px;border:1px solid #dce4d3;border-radius:15px;display:flex;flex-direction:column;background:#fff} :where(.ep-en02) .k-card-number{font-size:9px;letter-spacing:1.3px;color:#7d8d71;display:block;margin-bottom:29px} :where(.ep-en02) .k-scenario h3{font-size:24px;font-weight:500;letter-spacing:-.7px;margin:0 0 13px} :where(.ep-en02) .k-scenario>p{font-size:13px;line-height:1.6;color:#758070;min-height:42px;margin:0 0 24px} :where(.ep-en02) .k-appliance-line{font-size:11px;color:#53674c;line-height:1.7;padding-bottom:25px} :where(.ep-en02) .k-scenario-bottom{border-top:1px solid #e3e9db;padding-top:19px;margin-top:auto} :where(.ep-en02) .k-scenario-bottom span{display:block;font-size:11px;color:#6c7b62;margin-bottom:15px} :where(.ep-en02) .k-scenario-bottom b{color:#294a30} :where(.ep-en02) .k-scenario button{width:100%;padding:13px 9px;background:#f3f6ed;border:1px solid #dce5d1;border-radius:7px;text-align:left;color:#285337;font-size:12px;font-weight:600} :where(.ep-en02) .k-featured{background:#eaf1db;border-color:#bacc9c} :where(.ep-en02) .k-featured button{background:#2c6440;color:#fff;border-color:#2c6440} :where(.ep-en02) .k-scenario.is-chosen{outline:2px solid #789a52;outline-offset:3px} :where(.ep-en02) .k-caption{font-size:11px;line-height:1.7;color:#7a8573;margin:18px 0 0} :where(.ep-en02) .k-calc-section{background:#eef2e8;padding:65px 0 70px} :where(.ep-en02) .selector{border-radius:16px;box-shadow:none;border-color:#d4ddc9} :where(.ep-en02) .selector-head{background:#204836} :where(.ep-en02) .selector-head h2{font-weight:500} :where(.ep-en02) .badge{border-color:#709074} :where(.ep-en02) .device{border-radius:8px} :where(.ep-en02) .metrics{background:#f5f8ef} :where(.ep-en02) .calculation-note{background:#f5f8ef} :where(.ep-en02) .kit-options{padding:26px 30px;border-bottom:1px solid #e5ece8} :where(.ep-en02) .kit-option-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:25px} :where(.ep-en02) .kit-option-grid>label{display:grid;gap:9px;font-size:12px;color:#63735e} :where(.ep-en02) .kit-option-grid select{width:100%;padding:12px;border:1px solid #d4dfca;border-radius:8px;background:#fff;color:#24442d} :where(.ep-en02) .kit-options .help{max-width:850px} :where(.ep-en02) .k-parts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px} :where(.ep-en02) .k-parts-grid article{border-top:1px solid #cfdac6;padding:22px 0 7px} :where(.ep-en02) .k-parts-grid article>span{font-size:11px;color:#7a9a59} :where(.ep-en02) .k-parts-grid h3{font-size:17px;font-weight:500;margin:16px 0 12px} :where(.ep-en02) .k-parts-grid p{font-size:13px;line-height:1.7;color:#78816f;margin:0} :where(.ep-en02) .k-price-explainer{display:grid;grid-template-columns:1fr 1.5fr;gap:50px;margin-top:55px;border-top:1px solid #dce4d3;padding-top:37px} :where(.ep-en02) .k-price-explainer h3{font-size:25px;font-weight:500;letter-spacing:-.5px;margin:0} :where(.ep-en02) .k-price-explainer .k-overline{margin-bottom:15px} :where(.ep-en02) .k-price-explainer p:not(.k-overline):not(.k-caption){font-size:14px;color:#697962;line-height:1.7;margin-top:0} :where(.ep-en02) .k-price-references{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:25px} :where(.ep-en02) .k-price-reference{border:1px solid #e0e5d8;border-radius:10px;padding:20px;background:#f6f8f0} :where(.ep-en02) .k-price-reference span{font-size:10px;color:#7b8870;display:block;margin-bottom:11px} :where(.ep-en02) .k-price-reference h4{font-weight:500;font-size:14px;line-height:1.5;margin:0 0 12px;min-height:42px} :where(.ep-en02) .k-price-reference strong{font-size:23px;font-weight:500;display:block;margin-bottom:9px} :where(.ep-en02) .k-price-reference a{font-size:11px;color:#638052} :where(.ep-en02) .k-install{background:#1c4232;color:#f2f5e8;padding:65px 0} :where(.ep-en02) .k-install-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:70px;align-items:center} :where(.ep-en02) .k-install .k-overline{color:#b4ce91} :where(.ep-en02) .k-install .k-lead{color:#b0c5ac;font-size:14px;line-height:1.75} :where(.ep-en02) .k-install-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:25px} :where(.ep-en02) .k-install-options button{background:transparent;border:1px solid #527557;border-radius:9px;color:#cfdbc5;padding:15px;text-align:left} :where(.ep-en02) .k-install-options button[aria-pressed=true]{background:#d6e89e;border-color:#d6e89e;color:#22442e} :where(.ep-en02) .k-install-options b{font-size:12px;display:block;font-weight:600} :where(.ep-en02) .k-install-options span{font-size:10px;display:block;margin-top:7px;opacity:.8} :where(.ep-en02) .k-install #installation-description{font-size:12px;line-height:1.7;color:#b8ccb2;min-height:60px;margin:15px 0 20px} :where(.ep-en02) .k-light{background:#d6e89e;border-color:#d6e89e;color:#22442e} :where(.ep-en02) .k-light:hover{background:#e1efbe} :where(.ep-en02) .k-switch-scene{text-align:center;padding:10px 0} :where(.ep-en02) .k-switch-label{font-size:10px;letter-spacing:1px;color:#a6be97;margin-bottom:22px} :where(.ep-en02) .k-switch-box{background:linear-gradient(135deg,#f2f1e7,#dddccf);border:7px solid #eeeede;border-radius:14px;padding:22px 30px 18px;width:305px;margin:auto;color:#43543e;box-shadow:0 25px 35px #112b2630} :where(.ep-en02) .k-din-title{font-size:8px;letter-spacing:2px;border-bottom:1px solid #c5c8b9;padding-bottom:15px;color:#7a8472} :where(.ep-en02) .k-switch-positions{display:flex;justify-content:space-between;margin:20px 0 12px;font-size:10px;font-weight:bold} :where(.ep-en02) .k-switch-rail{height:42px;background:linear-gradient(#c3c6b9,#b6bbac);border-radius:7px;position:relative;margin:0 9px;border:4px solid #d8dace} :where(.ep-en02) .k-switch-knob{position:absolute;left:0;top:0;bottom:0;width:62px;background:linear-gradient(#788878,#4f6354);border-radius:5px;box-shadow:0 3px 7px #46544155;transition:left .25s} :where(.ep-en02) .k-switch-knob:after{content:'';height:20px;width:3px;background:#acb79d;position:absolute;left:29px;top:7px} :where(.ep-en02) .k-switch-scene.is-board .k-switch-knob{left:calc(100% - 62px)} :where(.ep-en02) .k-din-bottom{display:flex;justify-content:space-between;gap:10px;font-size:8px;margin-top:20px;color:#868d7b} :where(.ep-en02) .k-din-bottom strong{font-weight:500;letter-spacing:1px} :where(.ep-en02) .k-switch-scene>p{font-size:12px;line-height:1.7;color:#d6e1ca;max-width:330px;margin:25px auto 10px} :where(.ep-en02) .k-switch-scene>small{display:block;font-size:10px;line-height:1.7;color:#a6bc9c;max-width:340px;margin:auto} :where(.ep-en02) .k-comparison{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} :where(.ep-en02) .k-comparison article{padding:27px 25px;border:1px solid #dfe6d6;border-radius:13px;background:#fff;display:flex;flex-direction:column} :where(.ep-en02) .k-comparison .k-card-number{margin-bottom:19px} :where(.ep-en02) .k-comparison h3{font-weight:500;font-size:23px;letter-spacing:-.5px;margin:0 0 13px} :where(.ep-en02) .k-comparison p{font-size:13px;line-height:1.65;color:#6d7b65;margin:0} :where(.ep-en02) .k-comparison ul{padding:0;list-style:none;font-size:12px;line-height:1.65;color:#556a4e;margin:20px 0 25px} :where(.ep-en02) .k-comparison li{padding:10px 0;border-bottom:1px solid #edf0e6} :where(.ep-en02) .k-comparison a,:where(.ep-en02) .k-comparison button{color:#2b6942;font-size:12px;font-weight:600;background:none;padding:6px 0;border:0;text-decoration:none;text-align:left;margin-top:auto} :where(.ep-en02) .k-comparison article.k-comparison-active{background:#eef4e3;border-color:#bfd2a2} :where(.ep-en02) .k-inline-heading{display:flex;align-items:center;justify-content:space-between;gap:20px} :where(.ep-en02) .k-inline-heading h3{font-size:21px;font-weight:500} :where(.ep-en02) .k-inline-heading button{border:0;background:transparent;color:#466938;font-size:12px;padding:10px} :where(.ep-en02) #station-comparison{padding:25px;background:#edf3e2;border:1px solid #d6e2c4;border-radius:12px;margin-top:20px} :where(.ep-en02) #station-comparison>.k-caption{margin:0 0 20px} :where(.ep-en02) .k-station-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px} :where(.ep-en02) .k-station-cards article{background:#fff;border:1px solid #dbe4cd;padding:20px;border-radius:9px} :where(.ep-en02) .k-station-cards h4{font-size:17px;margin:0 0 13px;font-weight:500} :where(.ep-en02) .k-station-cards p,:where(.ep-en02) .k-station-cards a{font-size:11px;line-height:1.6;color:#68805c} :where(.ep-en02) .k-station-cards strong{font-size:23px;font-weight:500;display:block} :where(.ep-en02) .k-station-empty{grid-column:1/-1;color:#5f7055;font-size:13px;line-height:1.7} :where(.ep-en02) .k-faq{display:grid;grid-template-columns:1fr 1.5fr;gap:60px;padding:20px 0 75px} :where(.ep-en02) .k-faq .k-overline{margin-bottom:15px} :where(.ep-en02) .k-faq details{border-bottom:1px solid #dce4d3;padding:0 0 20px;margin-bottom:20px} :where(.ep-en02) .k-faq summary{cursor:pointer;font-size:14px;line-height:1.6;color:#32543b} :where(.ep-en02) .k-faq details p{font-size:13px;line-height:1.7;color:#6e7c66;margin-bottom:0} :where(.ep-en02) .k-final{padding:45px 0 65px;text-align:center;border-top:1px solid #dce4d3} :where(.ep-en02) .k-final .k-overline{margin-bottom:17px} :where(.ep-en02) .k-final h2{font-size:40px} :where(.ep-en02) .k-final>p:not(.k-overline){font-size:14px;color:#6e7c65;margin:20px 0 25px} :where(.ep-en02) .k-footer{border-top:1px solid #dce4d3;padding:26px 0;background:#f0f3e8} :where(.ep-en02) .k-footer>.k-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px} :where(.ep-en02) .k-footer .k-brand{font-size:18px;gap:5px} :where(.ep-en02) .k-footer p,:where(.ep-en02) .k-footer span{font-size:10px;color:#7b8770} :where(.ep-en02) .kit-spec{background:#f6f9f0} :where(.ep-en02) .k-live-summary{display:flex;gap:15px;flex-wrap:wrap;font-size:11px;color:#728666;margin-top:15px} :where(.ep-en02) button:focus-visible,:where(.ep-en02) a:focus-visible,:where(.ep-en02) summary:focus-visible,:where(.ep-en02) input:focus-visible,:where(.ep-en02) select:focus-visible{outline:3px solid #a5833c;outline-offset:4px} @media(min-width:1400px){:where(.ep-en02) .k-hero-art{height:440px} :where(.ep-en02) .k-hero{padding-top:80px;padding-bottom:80px}} @media(max-width:1000px){:where(.ep-en02) .k-wrap{width:calc(100% - 40px)} :where(.ep-en02) .k-nav nav{gap:18px} :where(.ep-en02) .k-hero{gap:25px;padding-top:45px;padding-bottom:45px} :where(.ep-en02) .k-hero-art{height:390px} :where(.ep-en02) .k-battery{left:22px;top:133px;width:190px;height:175px;padding:24px 20px} :where(.ep-en02) .k-battery strong{font-size:24px} :where(.ep-en02) .k-inverter{width:135px;right:17px;top:84px;padding:16px} :where(.ep-en02) .k-inverter small{font-size:8px} :where(.ep-en02) .k-charger{right:17px;top:245px;width:130px} :where(.ep-en02) .k-hero h1{font-size:40px} :where(.ep-en02) .k-nav .k-button{display:none} :where(.ep-en02) .k-hero-facts{gap:10px} :where(.ep-en02) .k-scenario{padding:22px 19px} :where(.ep-en02) .k-scenario h3{font-size:22px} :where(.ep-en02) .k-install-grid{gap:35px} :where(.ep-en02) .k-parts-grid{gap:18px} :where(.ep-en02) .k-band p{font-size:11px} :where(.ep-en02) .k-band>.k-wrap{gap:16px} :where(.ep-en02) .k-comparison article{padding:24px 19px} :where(.ep-en02) .k-comparison h3{font-size:21px}} @media(max-width:760px){:where(.ep-en02) .k-preview{padding:8px 15px;font-size:10px} :where(.ep-en02) .k-preview span{display:block;margin:4px 0 0;font-size:9px} :where(.ep-en02) .k-wrap{width:calc(100% - 32px)} :where(.ep-en02) .k-nav{height:77px;gap:15px} :where(.ep-en02) .k-brand{font-size:19px} :where(.ep-en02) .k-logo{height:32px;width:32px} :where(.ep-en02) .k-brand small{font-size:9px} :where(.ep-en02) .k-nav nav{gap:14px} :where(.ep-en02) .k-nav nav a{font-size:11px} :where(.ep-en02) .k-nav nav a:last-child{display:none} :where(.ep-en02) .k-hero{grid-template-columns:1fr;padding-top:35px;padding-bottom:35px;gap:30px} :where(.ep-en02) .k-overline{font-size:10px;margin-bottom:17px} :where(.ep-en02) .k-hero h1{font-size:40px;letter-spacing:-1.5px;max-width:none} :where(.ep-en02) .k-lead{font-size:14px;max-width:none} :where(.ep-en02) .k-actions{margin-top:25px;gap:12px} :where(.ep-en02) .k-actions .k-button{font-size:13px;padding:15px 17px} :where(.ep-en02) .k-text-link{font-size:12px} :where(.ep-en02) .k-hero-facts{margin-top:22px;font-size:10px} :where(.ep-en02) .k-hero-art{height:345px;max-width:480px;width:100%;margin:auto} :where(.ep-en02) .k-battery{left:43px;top:105px;width:205px;height:180px} :where(.ep-en02) .k-inverter{right:32px;top:75px;width:145px;height:119px} :where(.ep-en02) .k-charger{right:25px;top:214px;width:145px;height:78px} :where(.ep-en02) .k-art-note{bottom:31px;font-size:9px;left:23px} :where(.ep-en02) .k-art-note span{display:none} :where(.ep-en02) .k-art-caption{left:23px;font-size:7px;bottom:10px} :where(.ep-en02) .k-art-top{padding:20px 23px;font-size:10px} :where(.ep-en02) .k-band>.k-wrap{display:grid;grid-template-columns:1fr 1fr;padding:22px 0;gap:10px 20px} :where(.ep-en02) .k-band span{grid-column:1/-1;font-size:12px} :where(.ep-en02) .k-band span br{display:none} :where(.ep-en02) .k-band p{margin:5px 0;font-size:11px} :where(.ep-en02) .k-section{padding-top:48px;padding-bottom:45px} :where(.ep-en02) .k-section-head{display:block;margin-bottom:25px} :where(.ep-en02) .k-section-head>p{max-width:none;margin-top:18px;font-size:13px} :where(.ep-en02) .k-section-head h2,:where(.ep-en02) .k-install h2,:where(.ep-en02) .k-faq h2{font-size:30px;letter-spacing:-.8px} :where(.ep-en02) .k-scenarios,:where(.ep-en02) .k-comparison{grid-template-columns:1fr;gap:13px} :where(.ep-en02) .k-scenario{padding:23px} :where(.ep-en02) .k-card-number{margin-bottom:19px} :where(.ep-en02) .k-scenario h3{font-size:24px} :where(.ep-en02) .k-scenario>p{min-height:0;margin-bottom:14px} :where(.ep-en02) .k-appliance-line{padding-bottom:19px} :where(.ep-en02) .k-scenario-bottom{display:flex;align-items:center;gap:15px;justify-content:space-between;padding-top:15px} :where(.ep-en02) .k-scenario-bottom span{margin:0;font-size:10px} :where(.ep-en02) .k-scenario button{width:auto;font-size:11px;padding:12px} :where(.ep-en02) .k-caption{font-size:10px} :where(.ep-en02) .k-calc-section{padding:43px 0} :where(.ep-en02) .k-parts-grid{grid-template-columns:1fr 1fr;gap:22px} :where(.ep-en02) .k-parts-grid h3{font-size:16px} :where(.ep-en02) .k-parts-grid p{font-size:12px} :where(.ep-en02) .k-price-explainer{grid-template-columns:1fr;gap:20px;margin-top:35px;padding-top:27px} :where(.ep-en02) .k-price-explainer h3{font-size:24px} :where(.ep-en02) .k-price-references{grid-template-columns:1fr;gap:10px} :where(.ep-en02) .k-price-reference{display:grid;grid-template-columns:1fr auto;gap:5px 15px;padding:18px} :where(.ep-en02) .k-price-reference span{grid-column:1/-1;margin:0 0 6px} :where(.ep-en02) .k-price-reference h4{min-height:0;margin:0;font-size:13px} :where(.ep-en02) .k-price-reference strong{font-size:20px;white-space:nowrap;margin:0} :where(.ep-en02) .k-price-reference a{grid-column:1/-1;margin-top:8px} :where(.ep-en02) .k-install{padding:43px 0} :where(.ep-en02) .k-install-grid{grid-template-columns:1fr;gap:30px} :where(.ep-en02) .k-switch-box{width:280px} :where(.ep-en02) .k-switch-scene{padding:20px 0 0;border-top:1px solid #3c6144} :where(.ep-en02) .k-comparison article{padding:25px} :where(.ep-en02) .k-comparison h3{font-size:23px} :where(.ep-en02) .k-comparison ul{margin:13px 0} :where(.ep-en02) .k-station-cards{grid-template-columns:1fr} :where(.ep-en02) .k-faq{grid-template-columns:1fr;gap:25px;padding-bottom:45px} :where(.ep-en02) .k-faq details{padding-bottom:16px;margin-bottom:17px} :where(.ep-en02) .k-faq summary{font-size:13px} :where(.ep-en02) .k-final{padding:35px 0 45px} :where(.ep-en02) .k-final h2{font-size:33px} :where(.ep-en02) .k-final>p:not(.k-overline){font-size:13px} :where(.ep-en02) .k-footer>.k-wrap{flex-wrap:wrap;gap:5px 15px} :where(.ep-en02) .k-footer span{width:100%;font-size:9px} :where(.ep-en02) .kit-options{padding:22px} :where(.ep-en02) .kit-option-grid{grid-template-columns:1fr;gap:17px} :where(.ep-en02) .kit-option-grid select{font-size:12px} :where(.ep-en02) #station-comparison{padding:20px} :where(.ep-en02) .k-inline-heading h3{font-size:19px}} @media(max-width:390px){:where(.ep-en02) .k-nav nav{gap:10px} :where(.ep-en02) .k-nav nav a{font-size:10px} :where(.ep-en02) .k-brand{font-size:17px} :where(.ep-en02) .k-logo{width:28px;height:28px} :where(.ep-en02) .k-hero h1{font-size:35px} :where(.ep-en02) .k-battery{left:24px;width:185px;top:114px} :where(.ep-en02) .k-inverter{right:16px;width:125px;padding:15px;top:72px} :where(.ep-en02) .k-inverter .k-socket{right:10px;width:32px;height:32px} :where(.ep-en02) .k-charger{right:17px;width:123px;top:226px} :where(.ep-en02) .k-art-note{bottom:32px;max-width:180px} :where(.ep-en02) .k-scenario-bottom{align-items:stretch} :where(.ep-en02) .k-scenario-bottom span{align-self:center;max-width:70px} :where(.ep-en02) .k-install-options button{padding:12px} :where(.ep-en02) .k-price-reference{grid-template-columns:1fr} :where(.ep-en02) .k-price-reference strong{margin-top:5px}} @media(prefers-reduced-motion:reduce){.ep-en02{scroll-behavior:auto} :where(.ep-en02) .k-switch-knob{transition:none}} :where(.ep-en02) .k-catalog-notice{padding:16px 20px;background:#edf2e4;border:1px solid #d7e2c7;border-radius:10px;font-size:12px;line-height:1.7;color:#53634c} :where(.ep-en02) .k-catalog-tabs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:25px 0} :where(.ep-en02) .k-catalog-tabs button{background:white;border:1px solid #d7dfcd;border-radius:30px;padding:12px 18px;color:#33523a;cursor:pointer} :where(.ep-en02) .k-catalog-tabs button[aria-pressed=true]{background:#235e3e;color:white;border-color:#235e3e} :where(.ep-en02) .k-catalog-tabs a{margin-left:auto;font-size:13px} :where(.ep-en02) .k-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px} :where(.ep-en02) .k-product{border:1px solid #dce4d3;border-radius:14px;background:white;overflow:hidden;display:flex;flex-direction:column} :where(.ep-en02) .k-product[hidden]{display:none} :where(.ep-en02) .k-product-photo{height:265px;padding:26px 20px 15px;position:relative;background:#fff;display:grid;place-items:center} :where(.ep-en02) .k-product-photo img{width:100%;height:220px;object-fit:contain} :where(.ep-en02) .k-product-photo>span{position:absolute;top:12px;left:12px;font-size:10px;border-radius:20px;background:#edf3e3;padding:6px 9px} :where(.ep-en02) .k-product-photo>p{font-size:12px;color:#77826c;padding:20px} :where(.ep-en02) .k-product-body{padding:22px;display:flex;flex-direction:column;flex:1;border-top:1px solid #eef2e8} :where(.ep-en02) .k-product h3{font-size:20px;margin:0 0 12px;line-height:1.3;letter-spacing:-.4px} :where(.ep-en02) .k-product-spec{font-size:12px;font-weight:600;line-height:1.5;margin:0 0 12px;color:#487044} :where(.ep-en02) .k-product-note{font-size:12px;color:#6c7d69;line-height:1.7;margin:0 0 22px} :where(.ep-en02) .k-product-price{margin-top:auto} :where(.ep-en02) .k-product-price strong{font-size:28px;font-weight:600;display:block} :where(.ep-en02) .k-product-price span{display:block;font-size:11px;margin-top:6px;color:#6b7e64} :where(.ep-en02) .k-product-price small{display:block;font-size:10px;line-height:1.6;margin-top:6px;color:#6b7e64} :where(.ep-en02) .k-product-actions{margin-top:20px;display:flex;flex-direction:column;gap:14px} :where(.ep-en02) .k-product-actions button{border:0;border-radius:7px;padding:14px 8px;background:#eaf1dd;color:#275437;font-size:12px;font-weight:600;cursor:pointer} :where(.ep-en02) .k-product-actions button:hover{background:#dce9c6} :where(.ep-en02) .k-product-actions a{font-size:11px;text-align:center;color:#58794b} :where(.ep-en02) .k-price-section{background:#edf2e6;padding:65px 0} :where(.ep-en02) .k-payment{display:flex;align-items:center;gap:18px;font-size:13px;margin-bottom:22px} :where(.ep-en02) .k-payment select{padding:12px;border:1px solid #c8d6bc;border-radius:8px;color:#2c573b;background:white;max-width:100%} :where(.ep-en02) .k-table-scroll{overflow-x:auto;border-radius:12px;border:1px solid #d4decb;background:white} :where(.ep-en02) .k-price-table{border-collapse:collapse;width:100%;font-size:13px;text-align:left} :where(.ep-en02) .k-price-table th,:where(.ep-en02) .k-price-table td{padding:18px 20px;border-bottom:1px solid #e4eadc;vertical-align:middle} :where(.ep-en02) .k-price-table thead th{background:#e1e9d6;font-size:11px;font-weight:600;color:#49643d} :where(.ep-en02) .k-price-table tbody th{font-weight:500;min-width:230px} :where(.ep-en02) .k-price-table td{white-space:nowrap} :where(.ep-en02) .k-price-table a{text-decoration:none} :where(.ep-en02) .k-price-table a:hover{text-decoration:underline} :where(.ep-en02) .k-price-table small{display:block;font-size:10px;line-height:1.7;color:#75836b;margin-top:6px} :where(.ep-en02) .k-price-table input{width:68px;padding:10px;border:1px solid #bfd0b0;border-radius:7px;color:#285735;background:#fafcf6} :where(.ep-en02) .k-price-table input[aria-invalid=true]{border-color:#b53636;background:#fff0ee} :where(.ep-en02) .k-price-total{background:#204a34;color:white;border-radius:12px;margin-top:20px;padding:25px;display:flex;justify-content:space-between;align-items:center;gap:25px} :where(.ep-en02) .k-price-total small{font-size:11px;color:#c2d3ae;line-height:1.6} :where(.ep-en02) .k-price-total strong{display:block;font-size:36px;margin:12px 0} :where(.ep-en02) .k-price-total p{font-size:12px;line-height:1.7;margin:0;max-width:700px;color:#d8e4ca} :where(.ep-en02) .k-price-total button{background:transparent;border:1px solid #749060;border-radius:7px;padding:12px;color:#dfebd0;font-size:11px;cursor:pointer} :where(.ep-en02) .k-price-more{margin-top:22px;border-top:1px solid #cddabb;padding-top:20px} :where(.ep-en02) .k-price-more summary{cursor:pointer;font-size:13px;font-weight:600;line-height:1.6} :where(.ep-en02) .k-price-more .k-table-scroll{margin-top:18px} :where(.ep-en02) .k-nav nav{gap:20px} @media(max-width:1000px){:where(.ep-en02) .k-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))} :where(.ep-en02) .k-nav{flex-wrap:wrap;height:auto;padding:20px 0} :where(.ep-en02) .k-nav nav{order:3;width:100%;justify-content:center} :where(.ep-en02) .k-nav nav a:last-child{display:block}} @media(max-width:620px){:where(.ep-en02) .k-product-grid{grid-template-columns:1fr} :where(.ep-en02) .k-product-photo{height:260px} :where(.ep-en02) .k-product-photo img{height:220px} :where(.ep-en02) .k-catalog-tabs{gap:8px} :where(.ep-en02) .k-catalog-tabs button{font-size:11px;padding:12px} :where(.ep-en02) .k-catalog-tabs a{width:100%;margin:5px 0} :where(.ep-en02) .k-payment{display:block} :where(.ep-en02) .k-payment select{display:block;margin-top:10px;width:100%;font-size:12px} :where(.ep-en02) .k-price-section{padding:42px 0} :where(.ep-en02) .k-price-total{display:block;padding:20px} :where(.ep-en02) .k-price-total button{margin-top:18px} :where(.ep-en02) .k-price-total strong{font-size:30px} :where(.ep-en02) .k-price-table th,:where(.ep-en02) .k-price-table td{padding:14px} :where(.ep-en02) .k-nav nav{gap:15px;justify-content:flex-start;flex-wrap:wrap} :where(.ep-en02) .k-nav nav a{font-size:11px} :where(.ep-en02) .k-catalog-notice{font-size:11px;padding:15px} :where(.ep-en02) .k-product h3{font-size:22px} :where(.ep-en02) .k-product-note{font-size:13px}} :where(.ep-en10) .en-page .en-section{max-width:none;width:100%;margin:0} :where(.ep-en10) .en-page img{max-width:100%} :where(.ep-en10) .en-page{--ink:#173f36;--muted:#607067;--green:#24634e;--line:#dce3d6;--bg:#f6f6f0;color:var(--ink);font:16px/1.55 Arial,sans-serif;background:#fff;isolation:isolate} :where(.ep-en10) .en-page *{box-sizing:border-box} :where(.ep-en10) .en-page h1,:where(.ep-en10) .en-page h2,:where(.ep-en10) .en-page h3,:where(.ep-en10) .en-page p{margin-top:0} :where(.ep-en10) .en-page a{color:#24634e} :where(.ep-en10) .en-page button,:where(.ep-en10) .en-page input,:where(.ep-en10) .en-page select,:where(.ep-en10) .en-page textarea{font:inherit} :where(.ep-en10) .en-page [hidden]{display:none!important} :where(.ep-en10) .en-wrap{max-width:1140px;margin:auto;padding:0 24px} :where(.ep-en10) .en-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:22px;padding-bottom:22px;flex-wrap:wrap} :where(.ep-en10) .en-brand{font-weight:800;font-size:22px;color:var(--ink)!important;text-decoration:none} :where(.ep-en10) .en-brand span{font-size:13px;font-weight:400;display:block;color:var(--muted)} :where(.ep-en10) .en-navlinks{display:flex;gap:24px;flex-wrap:wrap} :where(.ep-en10) .en-navlinks a{text-decoration:none;color:var(--ink)} :where(.ep-en10) .en-hero{background:linear-gradient(120deg,#173f36,#24634e);color:#fff;padding:64px 0} :where(.ep-en10) .en-hero-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:55px;align-items:center} :where(.ep-en10) .en-eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:700;margin-bottom:18px;color:#a9d5ed} :where(.ep-en10) .en-page h1{font-size:clamp(34px,4vw,54px);line-height:1.1;letter-spacing:-.025em;margin-bottom:24px} :where(.ep-en10) .en-hero p{font-size:18px;color:#d9e6ef;max-width:610px} :where(.ep-en10) .en-hero-panel{background:#ffffff0d;border:1px solid #ffffff35;border-radius:22px;padding:28px} :where(.ep-en10) .en-hero-panel strong{font-size:33px;display:block;color:#b9efbb} :where(.ep-en10) .en-hero-panel p{font-size:15px;margin:12px 0 0} :where(.ep-en10) .en-hero-panel .en-panel-row{border-top:1px solid #ffffff25;margin-top:22px;padding-top:20px;font-size:15px} :where(.ep-en10) .en-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px} :where(.ep-en10) .en-page .en-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 20px;border:1px solid transparent;border-radius:10px;background:var(--green);color:#fff;text-decoration:none;font-weight:700;cursor:pointer;text-align:center;line-height:1.3} :where(.ep-en10) .en-page .en-btn:hover{background:#1e7135} :where(.ep-en10) .en-page .en-btn-outline{border:1px solid #b9cbd7;background:#fff;color:var(--ink)} :where(.ep-en10) .en-page .en-btn-outline:hover{background:#eef5f8} :where(.ep-en10) .en-page .en-btn-light{border-color:#ffffff77;background:transparent;color:#fff} :where(.ep-en10) .en-page .en-btn-light:hover{background:#ffffff10} :where(.ep-en10) .en-page :focus-visible{outline:3px solid #edac38;outline-offset:3px} :where(.ep-en10) .en-section{padding:62px 0} :where(.ep-en10) .en-section h2{font-size:clamp(26px,3vw,36px);line-height:1.2;letter-spacing:-.02em;margin-bottom:16px} :where(.ep-en10) .en-intro{max-width:780px;color:var(--muted)} :where(.ep-en10) .en-notice{padding:16px 20px;border-left:4px solid #d69b29;background:#fff7e5;border-radius:0 10px 10px 0;font-size:14px;margin:22px 0} :where(.ep-en10) .en-toolbar{display:flex;align-items:end;gap:18px;flex-wrap:wrap;padding:20px 0} :where(.ep-en10) .en-toolbar label{font-size:13px;display:grid;gap:7px;font-weight:bold} :where(.ep-en10) .en-page select,:where(.ep-en10) .en-page input,:where(.ep-en10) .en-page textarea{border:1px solid #b6c5d0;border-radius:8px;padding:11px;background:white;color:var(--ink);max-width:100%} :where(.ep-en10) .en-count{margin-left:auto;font-size:14px;color:var(--muted);padding-bottom:12px} :where(.ep-en10) .en-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px} :where(.ep-en10) .en-card{border:1px solid var(--line);border-radius:17px;overflow:hidden;background:#fff;display:flex;flex-direction:column} :where(.ep-en10) .en-photo{height:220px;position:relative;background:#fff;padding:28px} :where(.ep-en10) .en-photo img{width:100%;height:100%;object-fit:contain} :where(.ep-en10) .en-tag{position:absolute;top:12px;left:12px;border-radius:20px;padding:5px 10px;background:#eaf2f6;color:#375267;font-size:11px;font-weight:bold} :where(.ep-en10) .en-cardbody{padding:22px;display:flex;flex-direction:column;flex:1} :where(.ep-en10) .en-card h3{font-size:20px;line-height:1.25;margin-bottom:12px} :where(.ep-en10) .en-small{font-size:14px} :where(.ep-en10) .en-note{color:var(--muted);min-height:65px} :where(.ep-en10) .en-card dl{font-size:13px;margin:0 0 22px} :where(.ep-en10) .en-card dl div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid #edf1f4} :where(.ep-en10) .en-card dt{color:var(--muted)} :where(.ep-en10) .en-card dd{margin:0;font-weight:bold;text-align:right} :where(.ep-en10) .en-pricelabel{font-size:11px;color:var(--muted);margin-top:auto} :where(.ep-en10) .en-price{font-size:29px;font-weight:bold;letter-spacing:-.03em;margin:3px 0} :where(.ep-en10) .en-source{font-size:12px} :where(.ep-en10) .en-date{font-size:11px;color:var(--muted);margin:8px 0 18px} :where(.ep-en10) .en-card .en-btn{width:100%;font-size:14px} :where(.ep-en10) .en-tint{background:var(--bg)} :where(.ep-en10) .en-compare{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px} :where(.ep-en10) .en-choice{border-radius:16px;background:#fff;border:1px solid var(--line);padding:26px} :where(.ep-en10) .en-choice h3{font-size:22px;margin-bottom:14px} :where(.ep-en10) .en-choice p{font-size:15px;color:var(--muted)} :where(.ep-en10) .en-choice .en-kicker{color:#278541;font-size:12px;font-weight:bold;margin-bottom:12px} :where(.ep-en10) .en-choice ul{padding-left:18px;font-size:14px} :where(.ep-en10) .en-hybrid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;border-top:1px solid var(--line);padding-top:30px;margin-top:32px} :where(.ep-en10) .en-hybrid h3{font-size:25px;margin-bottom:10px} :where(.ep-en10) .en-hybrid p{color:var(--muted);margin-bottom:0} :where(.ep-en10) .en-flow{display:flex;gap:10px;align-items:center;justify-content:center} :where(.ep-en10) .en-flow span{padding:15px;background:#fff;border-radius:12px;font-size:14px;text-align:center} :where(.ep-en10) .en-formgrid{display:grid;grid-template-columns:1fr 1fr;gap:30px} :where(.ep-en10) .en-formfields{display:grid;gap:16px} :where(.ep-en10) .en-formfields label{display:grid;gap:7px;font-size:14px;font-weight:bold} :where(.ep-en10) .en-page textarea{width:100%;min-height:108px;resize:vertical} :where(.ep-en10) .en-result{background:#edf4f8;border-radius:15px;padding:24px} :where(.ep-en10) .en-result h3{font-size:22px} :where(.ep-en10) .en-result textarea{height:240px;font-size:14px} :where(.ep-en10) .en-result .en-small{color:var(--muted)} :where(.ep-en10) .en-result button{margin-top:14px} :where(.ep-en10) .en-faq{max-width:900px} :where(.ep-en10) .en-page details{padding:19px 0;border-bottom:1px solid var(--line)} :where(.ep-en10) .en-page summary{font-size:17px;font-weight:bold;cursor:pointer} :where(.ep-en10) .en-page details p{margin:15px 0 0;color:var(--muted)} :where(.ep-en10) .en-safety{background:#fff7e5;padding:20px;border-radius:12px;margin-top:25px;font-size:14px} :where(.ep-en10) .en-footer{padding:28px 0;background:#173f36;color:#c4d2de;font-size:13px} :where(.ep-en10) .en-footer a{color:#d6eafb} :where(.ep-en10) .en-footer-grid{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap} :where(.ep-en10) .en-status{min-height:24px;font-size:13px} :where(.ep-en10) .en-empty{padding:30px;background:#f4f7fa;border-radius:12px} @media(max-width:850px){:where(.ep-en10) .en-hero-grid{grid-template-columns:1fr;gap:24px} :where(.ep-en10) .en-hero{padding:42px 0} :where(.ep-en10) .en-hero-panel{max-width:540px} :where(.ep-en10) .en-grid{grid-template-columns:repeat(2,minmax(0,1fr))} :where(.ep-en10) .en-compare{grid-template-columns:1fr} :where(.ep-en10) .en-formgrid,:where(.ep-en10) .en-hybrid{grid-template-columns:1fr} :where(.ep-en10) .en-section{padding:42px 0} :where(.ep-en10) .en-navlinks{gap:16px;font-size:14px}} @media(max-width:560px){:where(.ep-en10) .en-wrap{padding-left:18px;padding-right:18px} :where(.ep-en10) .en-grid{grid-template-columns:1fr} :where(.ep-en10) .en-photo{height:205px} :where(.ep-en10) .en-note{min-height:0} :where(.ep-en10) .en-toolbar{align-items:stretch;gap:12px} :where(.ep-en10) .en-toolbar label{width:100%} :where(.ep-en10) .en-count{margin-left:0} :where(.ep-en10) .en-hero-panel strong{font-size:28px} :where(.ep-en10) .en-actions .en-btn{width:100%} :where(.ep-en10) .en-formgrid{gap:22px} :where(.ep-en10) .en-result{padding:18px} :where(.ep-en10) .en-nav{padding-top:15px;padding-bottom:15px} :where(.ep-en10) .en-navlinks{gap:13px} :where(.ep-en10) .en-flow span{font-size:12px;padding:10px} :where(.ep-en10) .en-cardbody{padding:20px}} .ep{--ink:#173f36;--green:#24634e;--lime:#dcebb5;--paper:#f6f6f0;color:var(--ink);font-family:Arial,sans-serif;font-size:18px;line-height:1.65;background:var(--paper)}.ep *{box-sizing:border-box}.ep a{color:inherit}.ep img{max-width:100%;display:block}.ep-wrap{max-width:1200px;margin:auto;padding:0 28px}.ep-draft{background:#e7edda;font-size:12px;text-align:center;padding:7px 20px}.ep-head{background:#f6f6f0f5;border-bottom:1px solid #dae0d4}.ep-nav{display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:90px}.ep-brand{text-decoration:none;font-size:23px;font-weight:700;line-height:1.2;display:flex;gap:12px;align-items:center}.ep-logo{display:grid;place-items:center;background:var(--ink);color:var(--lime);width:45px;height:45px;border-radius:13px;font-size:36px;font-weight:400}.ep-brand small{display:block;font-size:16px;font-weight:400;margin-top:6px}.ep-nav nav{display:flex;gap:24px;font-size:18px;align-items:center;flex-wrap:wrap}.ep-nav nav a{text-decoration:none}.ep a:hover{text-decoration:underline}.ep-btn{display:inline-block;border:1px solid var(--ink);background:var(--ink);color:white!important;border-radius:8px;padding:13px 20px;text-decoration:none;font-weight:600;font-size:16px;cursor:pointer}.ep-btn.light{background:transparent;color:var(--ink)!important}.ep-btn.lime{background:var(--lime);border-color:var(--lime);color:var(--ink)!important}.ep-eyebrow{font-size:14px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin:0 0 18px}.ep h1{font-size:clamp(37px,4.7vw,62px);line-height:1.08;letter-spacing:-.04em;font-weight:600;margin:0 0 24px}.ep h2{font-size:clamp(28px,3.3vw,42px);line-height:1.13;letter-spacing:-.03em;margin:0 0 20px;font-weight:600}.ep h3{font-size:23px;line-height:1.25;margin:0 0 12px;letter-spacing:-.02em}.ep p{margin:0 0 18px}.ep-lead{font-size:18px;line-height:1.65;max-width:590px;color:#53675f}.ep-hero{padding:68px 0 60px}.ep-hero-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:56px;align-items:center}.ep-actions{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0}.ep-proof{display:flex;gap:18px;font-size:16px;flex-wrap:wrap;color:#52665b}.ep-visual{border-radius:26px;background:#e6ebdb;position:relative;padding:25px;min-height:410px;display:flex;align-items:center;justify-content:center;overflow:hidden}.ep-visual img{width:85%;height:310px;object-fit:contain;background:white;border-radius:18px;box-shadow:0 18px 60px #1c463220}.ep-visual-label{position:absolute;bottom:22px;left:20px;right:20px;background:#fff;padding:13px 16px;border-radius:10px;box-shadow:0 5px 20px #173f3610;font-size:16px;display:flex;justify-content:space-between;gap:10px}.ep-visual-label strong{display:block;font-size:16px}.ep-section{padding:65px 0}.ep-section.white{background:#fff}.ep-section.dark{background:var(--ink);color:#fff}.ep-section.dark p{color:#dbe5dc}.ep-section-top{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:30px}.ep-section-top h2{margin:0;max-width:600px}.ep-section-top p{max-width:390px;color:#627469;margin:0}.ep-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.ep-card{background:white;border:1px solid #dde3d9;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}.ep-photo{background:#fff;padding:22px;height:235px;position:relative}.ep-photo img{height:100%;width:100%;object-fit:contain}.ep-card-body{padding:25px;display:flex;flex-direction:column;flex:1}.ep-card-body p{color:#607067;font-size:18px}.ep-card-body .ep-btn{margin-top:auto;align-self:start}.ep-pill{display:inline-block;font-size:16px;padding:5px 9px;background:#e9eedf;border-radius:5px;margin-bottom:14px;align-self:start}.ep-price{font-size:24px;font-weight:700;margin:4px 0 4px}.ep-caption{font-size:16px;color:#65746b;margin-top:18px!important}.ep-linkgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.ep-linkbox{border:1px solid #dce2d5;border-radius:12px;padding:20px;text-decoration:none;background:#fafbf6;font-weight:600;display:block}.ep-linkbox span{display:block;font-size:16px;font-weight:400;margin-top:7px;color:#64746a}.ep-callout{display:grid;grid-template-columns:1.3fr 1fr;gap:50px;align-items:center}.ep-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;counter-reset:steps}.ep-step{border-top:1px solid #cfd8ca;padding-top:22px}.ep-step:before{counter-increment:steps;content:'0' counter(steps);display:block;color:#78926e;margin-bottom:15px;font-size:13px}.ep-step p{font-size:18px;color:#607067}.ep-faq{max-width:800px}.ep-faq details{border-bottom:1px solid #dae1d4;padding:20px 0}.ep-faq summary{font-weight:600;cursor:pointer;font-size:18px}.ep-faq details p{margin:14px 0 0;color:#627469;font-size:18px}.ep-foot{padding:30px 0;font-size:16px;border-top:1px solid #d7dfd0}.ep-foot .ep-wrap{display:flex;justify-content:space-between;gap:30px}.ep-crumb{font-size:16px;margin-bottom:26px!important;color:#617367}.ep-notice{padding:17px 20px;border-radius:10px;background:#edf0e3;font-size:16px;margin-bottom:28px}.ep-table-wrap{overflow:auto}.ep-table{border-collapse:collapse;width:100%;min-width:660px;background:white}.ep-table th,.ep-table td{padding:18px;text-align:left;border-bottom:1px solid #dce3d6;vertical-align:top;font-size:16px}.ep-table th{background:#e9eddf}.ep-table td:first-child{font-weight:600}.ep a:focus-visible,.ep summary:focus-visible{outline:3px solid #719240;outline-offset:5px}.ep-sources a{font-size:16px}.ep-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.ep-filter button{padding:10px 16px;border:1px solid #bac9b7;border-radius:20px;background:white;color:var(--ink);cursor:pointer}.ep-filter button[aria-pressed=true]{background:var(--ink);color:white}.ep-card[hidden]{display:none!important}.ep-count{font-size:16px;margin:0 0 18px}.ep-spec{font-weight:600;color:var(--ink)!important}.ep-intro{padding:42px 0 20px}.ep-intro h1{max-width:950px}.ep-minor-nav{display:flex;gap:20px;flex-wrap:wrap;font-size:16px;padding:15px 0;border-top:1px solid #dfe4d8}.ep .selector{margin:0}.ep-calc-shell{max-width:1200px;margin:auto;padding:40px 28px} @media(max-width:900px){.ep-nav{flex-wrap:wrap;gap:14px;padding-top:16px;padding-bottom:16px}.ep-nav nav{gap:16px;flex-wrap:wrap}.ep-hero-grid{gap:28px}.ep-grid{grid-template-columns:repeat(2,1fr)}.ep-linkgrid{grid-template-columns:repeat(2,1fr)}.ep-visual{min-height:330px}.ep-visual img{height:260px}.ep-hero{padding:45px 0}.ep-section-top{align-items:start}.ep-steps{gap:20px}} @media(max-width:600px){.ep-wrap{padding:0 20px}.ep-nav{padding-top:16px;padding-bottom:16px}.ep-nav>.ep-btn{display:none}.ep-brand{font-size:21px}.ep-nav nav{width:100%;font-size:16px;gap:12px 18px}.ep-hero-grid,.ep-callout{grid-template-columns:1fr;gap:30px}.ep-hero{padding:35px 0}.ep-lead{font-size:18px}.ep-visual{min-height:300px}.ep-visual img{height:250px}.ep-section{padding:43px 0}.ep-section-top{display:block}.ep-section-top p{margin-top:15px}.ep-grid,.ep-steps{grid-template-columns:1fr}.ep-linkgrid{gap:10px}.ep-linkbox{padding:15px;font-size:18px}.ep-foot .ep-wrap{display:block}.ep-foot p{margin-top:15px}.ep-photo{height:240px}.ep-calc-shell{padding:25px 15px}.ep-intro{padding-top:26px}.ep-draft{font-size:10px}.ep-actions .ep-btn{flex:1;text-align:center}} .ep-subnav{border-top:1px solid #dce2d5;display:flex;gap:22px;padding:13px 28px;font-size:16px;flex-wrap:wrap}.ep-subnav a{text-decoration:none}.ep-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.ep-editor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.ep-editor label{display:flex;flex-direction:column;gap:7px;font-size:16px;font-weight:600}.ep-editor input,.ep-editor select,.ep-editor textarea,.ep-brief{font:inherit;min-width:0;width:100%;background:white;border:1px solid #bccbbb;border-radius:8px;padding:12px;color:#173f36}.ep-editor input:focus-visible,.ep-editor select:focus-visible,.ep-brief:focus-visible{outline:3px solid #8aa368}.ep-tool{border:1px solid #d8e0ce;border-radius:18px;padding:28px;background:#f4f7ed}.ep-tool-result{padding:23px;background:#173f36;border-radius:12px;color:white;display:flex;flex-direction:column;justify-content:center}.ep-tool-result strong{font-size:31px;line-height:1.2;margin:10px 0}.ep-tool-result p{font-size:13px;color:#dfebd8}.ep-tool-result small{font-size:14px}.ep-tool-help{font-size:12px;color:#627367;margin-top:15px!important}.ep-error{padding:12px;background:#fff0da;color:#863e13;margin-top:15px!important}.ep-card .ep-product-title{font-size:24px}.ep-related{display:flex;flex-wrap:wrap;gap:12px}.ep-related a{padding:12px 17px;border:1px solid #cbd7c4;border-radius:8px;text-decoration:none;font-size:14px}.ep-switch{display:flex;gap:10px;margin:25px 0}.ep-switch button{flex:1;padding:15px 10px;border:1px solid #bacaaf;background:white;border-radius:8px;cursor:pointer;font:inherit;color:#173f36}.ep-switch button[aria-pressed=true]{background:#173f36;color:#e9f4d7}.ep-switch-display{padding:25px;background:white;border-radius:12px;min-height:150px}.ep-switch-display strong{font-size:30px}.ep-board{border:2px solid #bccab4;border-radius:18px;padding:25px;background:#e9eee1}.ep-mount-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}.ep-brief{min-height:220px;margin:16px 0;resize:vertical}.ep-feature-list{padding-left:20px;color:#53675c}.ep-feature-list li{margin:10px 0}.ep .ep-card-photo-note{font-size:11px;margin-top:9px}.ep-small-table td small{display:block;font-weight:400;color:#637468;margin-top:6px}.ep-small-table th{font-size:13px}.ep .ep-error[hidden],.ep [hidden]{display:none!important} @media(max-width:600px){.ep-subnav{padding:13px 20px;gap:12px 18px;font-size:16px}.ep-two,.ep-editor,.ep-mount-grid{grid-template-columns:1fr}.ep-tool{padding:20px}.ep-tool-result strong{font-size:27px}.ep-switch button{font-size:14px}.ep-board{padding:18px}.ep-actions .ep-btn{flex:1 1 100%}} .ep-form-anchor{scroll-margin-top:24px}.ep-form-slot{padding:55px 0;background:#eaf0df;border-top:2px dashed #a9bb98;border-bottom:2px dashed #a9bb98}.ep-form-slot h2{font-size:30px}.ep-form-slot p{max-width:700px;color:#53675c} body.ep{margin:0} .ep .k-button,.ep-tools .primary{color:#fff}.ep-tools .request .primary{color:#294322} .ep .ep-inline-f5d87759{color:#54758c}.ep .ep-inline-f693c9b2{color:#536578;margin-top:22px}.ep .ep-inline-818205ab{font-size:24px}