:root{
        /* нейтральные + уровни поверхностей */
        --bg:#f7f6f3; --surface:#fff; --surface-2:#fff; --border:#e8e6e0; --muted-bg:#f2f1ec;
        --text:#232b30; --text-muted:#5f686c; --text-faint:#6f7873;
        --shadow-card:0 14px 30px -14px rgba(20,126,129,.22);
        /* статусные токены (ошибки/успех) + подложка логотипа */
        --danger-soft:#fdecec; --danger-text:#c0392b; --danger-border:#f5c2c2;
        --success-text:#2f9e44; --logo-plate:#fff; --photo-bg:#f3f5f6;
        /* --- фирменная палитра: teal из логотипа С (макет карточки) --- */
        --accent:#147e81; --accent-dark:#0f6366; --accent-soft:#eef8f8; --accent-bright:#2eb4b8;
        /* кнопки: темнее акцента ради WCAG ≥4.5:1 с белым текстом */
        --btn:#0f6366; --btn-hover:#0a4f51;
        --accent-grad:linear-gradient(120deg,#2eb4b8 0%,#147e81 55%,#0f6366 120%);
        /* тёмные секции — petrol, в тон логотипу #084858 */
        --graphite:#0c2a2c; --dark:#0c2a2c; --dark2:#084858;
        /* --- вторичные акценты --- */
        /* янтарный: тёплый акцент (акции, «горячее», CTA-выделения) */
        --warm:#ff8a3c; --warm-dark:#e8701f; --warm-soft:#fff1e6;
        /* зелёный: статусы «в наличии», позитив */
        --success:#2f9e44; --success-soft:#e8f6ec;
        color-scheme:light;
    }
    /* ---- Тёмная тема: переопределяем нейтральные токены ----
       --dark становится светлым (текст заголовков), --dark2 остаётся тёмным (фон панелей). */
    :root[data-theme="dark"]{
        /* bg < muted < surface < surface-2 — меньше монотонности */
        --bg:#101418; --surface:#1a2027; --surface-2:#232a33; --border:#343c46; --muted-bg:#151a20;
        --text:#e8ecef; --text-muted:#aeb8c0; --text-faint:#97a3ad;
        --shadow-card:0 16px 34px -16px rgba(0,0,0,.55);
        /* статусные токены (ошибки/успех) + подложка логотипа */
        --danger-soft:#3a2323; --danger-text:#f0a0a0; --danger-border:#5a3333;
        --success-text:#63c982; --logo-plate:#e8ebee; --photo-bg:#2a323b;
        --accent:#147e81; --accent-dark:#0f6366; --accent-soft:#123436; --accent-bright:#2eb4b8;
        --btn:#147e81; --btn-hover:#0f6366;
        --graphite:#c5d4d5; --dark:#eef4f4; --dark2:#0a1f21;
        --warm:#ff9a55; --warm-dark:#ff8a3c; --warm-soft:#3a2716;
        --success:#48c265; --success-soft:#123322;
        color-scheme:dark;
    }
    /* Новый логотип teal/silver — на тёмной теме без invert */
    *{box-sizing:border-box}
    body{
        margin:0; background:var(--bg); color:var(--text);
        font-family:'Manrope',-apple-system,Segoe UI,Roboto,sans-serif;
        font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased;
    }
    a{color:var(--accent); text-decoration:none}
    a:hover{opacity:.85}
    .sp-container{max-width:1440px; margin:0 auto; padding:0 48px}

    /* ---- Верхняя полоса ---- */
    .sp-topbar{background:var(--surface); border-bottom:1px solid var(--border); font-size:13px}
    .sp-topbar__in{display:flex; align-items:center; gap:16px; height:44px; flex-wrap:nowrap}
    .sp-topnav{display:flex; align-items:center; gap:18px; list-style:none; margin:0; padding:0; flex:1 1 auto; min-width:0; flex-wrap:nowrap}
    .sp-topnav>li{display:flex; align-items:center; flex-shrink:0}
    .sp-topnav a{color:var(--text-muted); font-weight:500; white-space:nowrap}
    .sp-topnav a:hover{color:var(--accent)}
    .sp-topnav__pick{color:var(--accent) !important; font-weight:700 !important}
    .sp-topnav__pick:hover{color:var(--accent-dark) !important}
    .sp-topnav__grp{position:relative}
    .sp-topnav__grp-btn{background:none; border:0; padding:0; margin:0; color:var(--text-muted); font:inherit; font-weight:500; cursor:pointer; display:inline-flex; align-items:center; gap:4px; white-space:nowrap; line-height:1.2}
    .sp-topnav__grp-btn:hover,.sp-topnav__grp:hover .sp-topnav__grp-btn,.sp-topnav__grp.is-open .sp-topnav__grp-btn{color:var(--accent)}
    .sp-topnav__arr{font-size:9px; opacity:.55; transform:translateY(1px)}
    .sp-topnav__drop{position:absolute; top:calc(100% + 10px); left:0; min-width:188px; margin:0; padding:6px 0; list-style:none; background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:0 12px 32px rgba(12,42,44,.14); opacity:0; visibility:hidden; transform:translateY(-4px); transition:.15s ease; z-index:90}
    .sp-topnav__drop::before{content:""; position:absolute; top:-6px; left:18px; width:10px; height:10px; background:var(--surface); border-left:1px solid var(--border); border-top:1px solid var(--border); transform:rotate(45deg)}
    .sp-topnav__grp:hover .sp-topnav__drop,.sp-topnav__grp.is-open .sp-topnav__drop{opacity:1; visibility:visible; transform:translateY(0)}
    .sp-topnav__drop a{display:block; padding:8px 16px; color:var(--text-muted); font-weight:500; white-space:nowrap}
    .sp-topnav__drop a:hover{color:var(--accent); background:var(--accent-soft); opacity:1}
    .sp-topbar__right{display:flex; align-items:center; gap:12px; color:var(--text-muted); flex:0 0 auto; margin-left:auto; white-space:nowrap; position:relative; z-index:2}
    .sp-topbar__hours{white-space:nowrap}
    .sp-topbar__phone{color:var(--text); font-weight:700; font-size:14px; white-space:nowrap}
    .sp-topbar__msg{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:28px;padding:0 8px;border-radius:8px;font-size:11px;font-weight:800;letter-spacing:.02em;color:#fff;text-decoration:none}
    .sp-topbar__msg--wa{background:#25D366}
    .sp-topbar__msg--tg{background:#2AABEE}
    .sp-topbar__msg:hover{filter:brightness(.95);opacity:1;color:#fff}
    .sp-topbar__call{color:var(--accent); font-weight:600; white-space:nowrap}
    /* На средних ширинах прячем второстепенное, чтобы полоса не переполнялась */
    @media (max-width:1320px){ .sp-topbar__call,.sp-topbar__msg{display:none} }
    @media (max-width:1240px){ .sp-topbar__hours{display:none} .sp-topnav{gap:14px} }
    @media (max-width:1080px){ .sp-rate{display:none} }
    @media (max-width:960px){ .sp-topnav{gap:12px; font-size:12px} }

    /* Курсы валют + поповер */
    .sp-rate{position:relative; cursor:default}
    .sp-rate__val{display:inline-flex; align-items:center; gap:5px; background:var(--accent-soft); color:var(--accent); font-weight:700; padding:5px 12px; border-radius:100px; font-size:12px}
    .sp-rate__val::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 3px rgba(20,126,129,.18)}
    .sp-rate__sep{opacity:.45}
    .sp-rate__pop{position:absolute; top:calc(100% + 12px); right:0; width:290px; background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px 20px; box-shadow:0 16px 40px rgba(12,42,44,.16); opacity:0; visibility:hidden; transform:translateY(-6px); transition:.18s ease; z-index:80; text-align:left; white-space:normal}
    .sp-rate:hover .sp-rate__pop{opacity:1; visibility:visible; transform:translateY(0)}
    .sp-rate__pop::before{content:""; position:absolute; top:-6px; right:26px; width:12px; height:12px; background:var(--surface); border-left:1px solid var(--border); border-top:1px solid var(--border); transform:rotate(45deg)}
    .sp-rate__pop-h{display:flex; align-items:center; gap:9px; font-size:14px; font-weight:800; color:var(--text); margin-bottom:14px}
    .sp-rate__pop-h i{display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; background:var(--accent); color:#fff; border-radius:50%; font-style:normal; font-size:13px; font-weight:800}
    .sp-rate__row{display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--border); font-size:13px}
    .sp-rate__row:last-of-type{border-bottom:0}
    .sp-rate__cur{display:flex; align-items:center; gap:8px; color:var(--text-muted)}
    .sp-rate__cur b{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; background:var(--muted-bg); border-radius:6px; font-weight:800; color:var(--accent); font-size:13px}
    .sp-rate__row strong{color:var(--text); font-weight:800; font-size:14px}
    .sp-rate__note{font-size:11px; color:var(--text-faint); line-height:1.5; margin-top:12px; padding-top:12px; border-top:1px solid var(--border)}

    /* ---- Шапка ---- */
    .sp-header{background:var(--surface); border-bottom:1px solid var(--border)}
    .sp-header__in{display:flex; align-items:center; gap:28px; height:88px}

    /* Логотип: реальный файл + текстовый фолбэк */
    .sp-logo{display:flex; align-items:center; flex-shrink:0}
    .sp-logo__img{height:52px; width:auto; display:block}
    .sp-logo__img--dark{display:none}
    :root[data-theme="dark"] .sp-logo__img--light{display:none}
    :root[data-theme="dark"] .sp-logo__img--dark{display:block}
    .sp-logo__fallback{display:none; align-items:center; gap:11px}
    .sp-logo__ring{
        width:36px; height:36px; border-radius:50%; border:5px solid var(--accent);
        clip-path: polygon(0 0, 72% 0, 72% 34%, 100% 34%, 100% 100%, 0 100%);
    }
    .sp-logo__name{font-weight:800; font-size:21px; letter-spacing:-.01em; line-height:1}
    .sp-logo__name b{color:var(--accent)}
    .sp-logo__sub{font-size:9px; letter-spacing:.16em; color:var(--text-faint); font-weight:600; margin-top:3px}

    .sp-catalog-btn{
        display:inline-flex; align-items:center; gap:8px; background:var(--btn,var(--accent-dark));
        color:#fff; font-weight:700; font-size:15px; border:0; border-radius:12px;
        padding:13px 22px; min-height:48px; cursor:pointer;
    }
    .sp-catalog-btn:hover{background:var(--btn-hover,var(--accent-dark)); opacity:1}

    /* Каталог + мега-меню */
    .sp-catalog{position:relative}
    .sp-catalog.open .sp-cat-burger{transform:rotate(90deg)}
    .sp-cat-burger{transition:.2s}
    .sp-megamenu{
        position:absolute; top:calc(100% + 12px); left:0;
        width:min(1180px, calc(100vw - 24px));
        max-width:calc(100vw - 24px);
        max-height:min(70vh, 620px);
        overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
        background:var(--surface); border:1px solid var(--border); border-radius:18px;
        box-shadow:0 24px 56px rgba(12,42,44,.18); padding:16px; z-index:90; display:none;
    }
    .sp-catalog.open .sp-megamenu{display:block}
    .sp-mm-tabs{display:flex; align-items:center; gap:8px; margin:0 0 14px; padding-bottom:12px; border-bottom:1px solid var(--border); position:sticky; top:0; z-index:2; background:var(--surface)}
    .sp-mm-tab{appearance:none; border:1px solid var(--border); background:var(--muted-bg); color:var(--text-muted); font:inherit; font-weight:700; font-size:13px; padding:8px 14px; border-radius:999px; cursor:pointer}
    .sp-mm-tab.is-on{background:var(--accent); border-color:var(--accent); color:#fff}
    .sp-mm-tab-all{margin-left:auto; font-size:13px; font-weight:700; color:var(--accent); text-decoration:none; white-space:nowrap}
    .sp-mm-tab-all:hover{opacity:.85}
    .sp-mm-flex{display:grid; grid-template-columns:minmax(200px,288px) minmax(0,1fr)}
    /* левая колонка — группы каталога с иконками */
    .sp-mm-side{display:flex; flex-direction:column; gap:2px; border-right:1px solid var(--border); padding-right:10px; min-width:0}
    .sp-mm-cat{display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:11px; font-weight:600; font-size:14px; color:var(--text); text-decoration:none; transition:.12s}
    .sp-mm-cat:hover, .sp-mm-cat.is-on{background:var(--accent-soft); color:var(--accent); opacity:1}
    .sp-mm-cat__ic{flex:0 0 auto; width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center; background:var(--accent-soft); border-radius:8px; color:var(--accent); font-size:14px}
    .sp-mm-cat.is-on .sp-mm-cat__ic{background:var(--surface)}
    .sp-mm-cat__ic img{width:17px; height:17px; object-fit:contain}
    .sp-mm-cat__arr{margin-left:auto; color:var(--text-faint); font-size:16px; line-height:1}
    .sp-mm-cat.is-on .sp-mm-cat__arr{color:var(--accent)}
    /* правая колонка — панели подкатегорий (по одной на группу) */
    .sp-mm-main{padding:6px 6px 6px 26px; min-height:326px}
    .sp-mm-panel{display:none}
    .sp-mm-panel.is-on{display:block; animation:mmFade .2s ease}
    @keyframes mmFade{from{opacity:0; transform:translateY(4px)}to{opacity:1; transform:none}}
    .sp-mm-cols{column-count:3; column-gap:26px}
    .sp-mm-group{break-inside:avoid; margin-bottom:16px}
    .sp-mm-sub{display:block; font-weight:800; font-size:14px; color:var(--text); margin-bottom:7px; text-decoration:none}
    .sp-mm-sub:hover{color:var(--accent); opacity:1}
    .sp-mm-list{list-style:none; margin:0; padding:0}
    .sp-mm-list li{margin:5px 0}
    .sp-mm-list a{font-size:13px; color:var(--text-muted); text-decoration:none}
    .sp-mm-list a:hover{color:var(--accent)}
    .sp-mm-more{display:inline-block; margin-top:3px; font-size:12px; font-weight:600; color:var(--accent)}
    .sp-mm-banwrap{margin-top:14px; padding-top:14px; border-top:1px solid var(--border)}
    .sp-mm-banwrap:empty{display:none}
    @media (max-width:1100px){
      .sp-megamenu{width:calc(100vw - 24px); max-width:calc(100vw - 24px); left:0}
      .sp-mm-flex{grid-template-columns:minmax(160px,220px) minmax(0,1fr)}
      .sp-mm-cols{column-count:2}
      .sp-mm-main{padding-left:16px; min-height:0}
    }

    .sp-search{flex:1 1 260px; position:relative; min-width:0}
    .sp-search__form{display:flex; position:relative; width:100%}
    .sp-search input{
        width:100%; height:48px; border:1px solid var(--border); border-radius:12px;
        padding:0 48px 0 18px; font-family:inherit; font-size:14px; background:var(--muted-bg);
    }
    .sp-search input:focus{outline:none; border-color:var(--accent); background:var(--surface)}
    .sp-search__btn{position:absolute; right:4px; top:4px; width:40px; height:40px; border:0; border-radius:9px; background:transparent; cursor:pointer; font-size:16px; color:var(--text-muted)}
    .sp-search__btn:hover{color:var(--accent)}

    /* Единый ритм иконок шапки */
    .sp-mobsearch{display:none}
    .sp-theme-toggle,
    .sp-iconlink,
    .sp-account,
    .sp-cart{
        position:relative; display:inline-flex; align-items:center; justify-content:center;
        width:42px; height:42px; padding:0; gap:0;
        border:1px solid var(--border); border-radius:12px;
        background:var(--muted-bg); color:var(--text);
        font-size:14px; font-weight:600; line-height:1; text-decoration:none;
        transition:border-color .15s ease, background .15s ease, color .15s ease;
    }
    .sp-theme-toggle:hover,
    .sp-iconlink:hover,
    .sp-account:hover,
    .sp-cart:hover{border-color:var(--accent); background:var(--accent-soft); color:var(--accent); opacity:1}
    .sp-cart__ic,.sp-account__ic,.sp-iconlink__ic,.sp-theme-toggle__ic{font-size:16px; line-height:1}
    .sp-cart__label,.sp-account__label{display:none}
    .sp-cart__count,.sp-iconlink__count{
        position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; padding:0 5px;
        background:var(--accent); color:#fff; border-radius:100px; font-size:10px; font-weight:800;
        display:flex; align-items:center; justify-content:center;
    }
    .sp-iconlink__count[hidden],.sp-iconlink__count:empty{display:none!important}
    @media (min-width:1200px){
        .sp-cart{width:auto; height:42px; padding:0 14px; gap:8px}
        .sp-account{width:auto; height:42px; padding:0 12px; gap:8px}
        .sp-cart__label,.sp-account__label{display:inline}
        .sp-header__icons{gap:10px}
    }
    .sp-iconbtn{display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-width:44px; min-height:44px; border:1px solid var(--border); border-radius:11px; background:var(--surface); color:var(--text-muted); cursor:pointer; font-size:16px; line-height:1; padding:0; transition:border-color .15s,color .15s,background .15s,transform .12s}
    .sp-iconbtn:hover{border-color:var(--accent); color:var(--accent); background:var(--accent-soft)}
    .sp-iconbtn.is-on,
    .sc-card__tools .sp-iconbtn.is-on,
    .sp-iconbtn.sp-iconbtn--cmp-on{
      border-color:var(--accent)!important; color:#fff!important; background:var(--accent)!important;
      box-shadow:0 6px 16px -8px rgba(20,126,129,.55)
    }
    .sp-iconbtn.is-on:hover,
    .sc-card__tools .sp-iconbtn.is-on:hover,
    .sp-iconbtn.sp-iconbtn--cmp-on:hover{background:var(--accent-dark)!important; border-color:var(--accent-dark)!important; color:#fff!important}
    .sp-iconbtn[data-sp-list="cmp"].is-on{font-weight:800; letter-spacing:-.04em}
    .sp-iconbtn--lg{width:48px; height:48px; min-width:48px; min-height:48px; border-radius:12px; font-size:18px}
    .sp-toast{
      position:fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(12px);
      z-index:1400; max-width:min(92vw,360px); padding:12px 18px; border-radius:12px;
      background:var(--dark2,#0f2a2c); color:#fff; font-size:14px; font-weight:700;
      box-shadow:0 12px 28px rgba(0,0,0,.28); opacity:0; pointer-events:none;
      transition:opacity .2s ease, transform .2s ease;
    }
    .sp-toast.is-on{opacity:1; transform:translateX(-50%) translateY(0)}

    @media (max-width:1100px) and (min-width:841px){
        .sp-header__in{gap:12px}
        .sp-catalog-btn{padding:12px 14px; font-size:14px; white-space:nowrap}
        .sp-logo__img{height:44px}
        .sp-search{flex:1 1 220px}
    }

    /* Модалка «Заказать звонок» */
    .sp-modal{position:fixed; inset:0; background:rgba(8,72,88,.55); display:none; align-items:center; justify-content:center; z-index:1000; padding:12px; overflow-y:auto}
    .sp-modal.open{display:flex}
    .sp-modal__box{position:relative; width:400px; max-width:100%; max-height:calc(100dvh - 24px); overflow-y:auto; background:var(--surface); border-radius:20px; padding:34px 32px; box-shadow:0 24px 60px rgba(8,72,88,.3); margin:auto}
    .sp-modal__x{position:absolute; top:12px; right:12px; width:44px; height:44px; min-width:44px; min-height:44px; border:0; border-radius:11px; background:var(--muted-bg); color:var(--text-muted); font-size:16px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center}
    .sp-modal__x:hover{background:var(--border)}
    .sp-modal__box h3{font-size:22px; font-weight:800; margin:0 0 8px}
    .sp-modal__box p{font-size:14px; color:var(--text-muted); margin:0 0 18px; line-height:1.5}
    .sp-modal__field{width:100%; height:48px; border:1px solid var(--border); border-radius:11px; padding:0 15px; font-family:inherit; font-size:14px; margin-bottom:10px; background:var(--surface)}
    .sp-modal__field:focus{outline:none; border-color:var(--accent)}
    .sp-modal__submit{width:100%; height:48px; min-height:48px; background:var(--btn,var(--accent-dark)); color:#fff; border:0; border-radius:11px; font-weight:700; font-size:15px; cursor:pointer; font-family:inherit; margin-top:4px}
    .sp-modal__submit:hover{background:var(--btn-hover,var(--accent-dark))}
    .sp-consent{display:flex; align-items:flex-start; gap:9px; margin:4px 0 2px; font-size:12px; line-height:1.45; color:var(--text-muted); cursor:pointer}
    .sp-consent input{width:18px;height:18px;min-width:18px;min-height:18px;margin-top:1px;accent-color:var(--accent);flex-shrink:0;cursor:pointer}
    .sp-consent a{color:var(--accent)}
    .sp-consent a:hover{text-decoration:underline}
    .sp-modal__note{font-size:13px; color:var(--text-muted); text-align:center; margin-top:12px}
    .sp-modal__err{background:var(--danger-soft,#fdecec); border:1px solid var(--danger-border,#f5c2c2); color:var(--danger-text,#c0392b); border-radius:10px; padding:10px 14px; font-size:13px; margin-bottom:12px}
    .sp-modal__product{background:var(--accent-soft); border-radius:10px; padding:11px 14px; font-size:13px; font-weight:600; color:var(--accent); margin-bottom:14px}
    .sp-modal__ok{width:56px; height:56px; border-radius:50%; background:var(--success-soft); color:var(--success); display:flex; align-items:center; justify-content:center; font-size:28px; margin:0 auto 14px}
    .sp-modal__box .sp-modal__ok+h3,.sp-modal__box .sp-modal__ok~h3{text-align:center}
    .sp-modal__ok~p{text-align:center}

    /* Бургер + мобильная навигация */
    .sp-burger{display:none; width:44px; height:44px; border:0; background:var(--muted-bg); border-radius:11px; font-size:18px; cursor:pointer; color:var(--text)}
    .sp-mobnav{position:fixed; inset:0; background:rgba(8,72,88,.5); z-index:1000; display:none}
    .sp-mobnav.open{display:block}
    .sp-mobnav__box{position:absolute; top:0; right:0; width:330px; max-width:86vw; height:100%; background:var(--surface); padding:20px; overflow:auto; box-shadow:-10px 0 40px rgba(8,72,88,.25); display:flex; flex-direction:column; gap:16px}
    .sp-mobnav__x{align-self:flex-end; width:44px; height:44px; min-width:44px; min-height:44px; border:0; background:var(--muted-bg); border-radius:11px; font-size:18px; cursor:pointer; color:var(--text-muted); display:inline-flex; align-items:center; justify-content:center}
    .sp-mobnav__search{display:flex; position:relative}
    .sp-mobnav__search input{width:100%; height:48px; border:1px solid var(--border); border-radius:11px; padding:0 52px 0 14px; font-family:inherit; font-size:14px; background:var(--muted-bg)}
    .sp-mobnav__search input:focus{outline:none; border-color:var(--accent); background:var(--surface)}
    .sp-mobnav__search button{position:absolute; right:4px; top:4px; width:44px; height:44px; min-width:44px; min-height:44px; border:0; border-radius:10px; background:transparent; font-size:16px; cursor:pointer; color:var(--text-muted)}
    .sp-mobnav__cat{display:flex; align-items:center; justify-content:center; gap:10px; background:var(--accent); color:#fff; padding:14px; border-radius:11px; font-weight:700; font-size:16px}
    .sp-mobnav__cat span{font-size:18px}
    .sp-mobnav__cat:hover{background:var(--accent-dark)}
    .sp-mobnav__links{display:flex; flex-direction:column}
    .sp-mobnav__links a{padding:13px 4px; border-bottom:1px solid var(--border); font-weight:600; font-size:16px; color:var(--text)}
    .sp-mobnav__links a:hover{color:var(--accent)}
    .sp-mobnav__sec{padding:18px 4px 6px; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint)}
    .sp-mobnav__sec:first-of-type{padding-top:4px}
    .sp-mobnav__foot{margin-top:auto; display:flex; flex-direction:column; gap:12px}
    .sp-mobnav__phone{font-size:20px; font-weight:800; color:var(--text)}
    .sp-mobnav__cb{background:var(--accent); color:#fff; text-align:center; padding:13px; border-radius:11px; font-weight:700}
    .sp-mobnav__theme{margin-top:14px; width:100%; background:var(--muted-bg); border:1px solid var(--border); color:var(--text); padding:12px; border-radius:11px; font-weight:600; font-size:14px; font-family:inherit; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px}
    .sp-noscroll{overflow:hidden}
    @media (max-width:840px){ .sp-burger{display:inline-flex; align-items:center; justify-content:center} }

    /* ---- Рабочая область ---- */
    .sp-main{padding:0 0 8px}
    .sp-main--page{min-height:50vh; padding:32px 0}

    /* ===== Общие UI-примитивы шаблона (переиспользуются страницами) ===== */
    .tpl-crumbs{font-size:13px;color:var(--text-muted);padding:6px 0 18px}
    .tpl-crumbs a{color:var(--text-muted)}
    .tpl-crumbs a:hover{color:var(--accent)}
    .tpl-crumbs__sep{color:var(--text-faint);margin:0 3px}
    .tpl-crumbs__cur{color:var(--text)}
    .tpl-h1{font-size:40px;font-weight:800;letter-spacing:-.02em;margin:0 0 10px}
    .tpl-lead{font-size:16px;line-height:1.55;color:var(--text-muted);max-width:100%;width:100%;margin:0 0 8px}
    .tpl-section-h{font-size:28px;font-weight:800;letter-spacing:-.01em;margin:40px 0 20px}
    .tpl-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:13px;font-weight:700;font-size:15px;padding:14px 26px;min-height:48px;cursor:pointer;border:0;font-family:inherit;text-decoration:none;box-sizing:border-box}
    .tpl-btn--primary{background:var(--btn,var(--accent-dark));color:#fff}
    .tpl-btn--primary:hover{background:var(--btn-hover,var(--accent-dark));opacity:1}
    .tpl-btn--bright{background:var(--accent-soft);color:var(--accent-dark);border:1px solid rgba(20,126,129,.22)}
    .tpl-btn--bright:hover{background:var(--btn,var(--accent-dark));color:#fff;border-color:transparent;opacity:1}
    .tpl-btn--ghost{background:transparent;color:var(--text);border:1px solid var(--border)}
    .tpl-btn--ghost:hover{border-color:var(--accent);color:var(--accent);opacity:1}
    .tpl-card{background:var(--surface);border:1px solid var(--border);border-radius:16px}
    :root[data-theme="dark"] .tpl-card{background:var(--surface-2,#232a33)}
    .tpl-badge{display:inline-block;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:600;padding:6px 13px;border-radius:100px}
    .tpl-dark{background:var(--dark2);color:#fff;border-radius:24px}

    @media (max-width:1200px){ .sp-container{padding:0 24px} }
    @media (max-width:840px){
        html,body{overflow-x:clip;max-width:100%}
        .sp-container{padding:0 12px;max-width:100%}
        .sp-topbar{display:none}
        .sp-header{overflow-x:clip}
        .sp-header__in{height:56px; gap:8px; justify-content:space-between; max-width:100%; min-width:0}
        .sp-search{display:none}
        .sp-mobsearch{
            display:inline-flex;align-items:center;justify-content:center;
            width:44px;height:44px;min-width:44px;min-height:44px;border-radius:11px;
            border:1px solid var(--border);background:var(--surface);color:var(--text-muted);
            text-decoration:none;flex-shrink:0;font-size:16px
        }
        .sp-mobsearch:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
        .sp-catalog{display:none}          /* каталог доступен из шторки-меню */
        .sp-logo{margin-right:auto; min-width:0; max-width:min(168px,46vw)}
        .sp-logo__img{height:28px; max-width:100%; object-fit:contain}
        .sp-iconbtn{width:44px;height:44px;border-radius:11px;font-size:16px}
        .sp-cart__label{display:none}
        .sp-cart{
            padding:0; width:44px; height:44px; min-width:44px; min-height:44px; justify-content:center; gap:0;
            flex-shrink:0; border-radius:11px;
        }
        .sp-cart__ic{font-size:16px}
        .sp-burger{width:44px; height:44px; min-width:44px; min-height:44px; flex-shrink:0; border-radius:11px; font-size:17px}
        .sp-header__icons{gap:6px; flex-shrink:0}
        /* на мобиле в шапке: лого · поиск · корзина · бургер; остальное — в шторке */
        .sp-header__icons .sp-theme-toggle,
        .sp-header__icons .sp-account,
        .sp-header__icons .sp-iconlink{display:none}
        .tpl-h1{font-size:28px}
        .tpl-section-h{font-size:22px}
    }
    @media (max-width:380px){
        .sp-logo__img{height:24px}
        .sp-logo{max-width:min(140px,42vw)}
        .sp-header__icons{gap:4px}
    }

/* ===== Футер (вынесено из footer.php) ===== */
.sp-footer{background:var(--dark2); color:#c8cfd1; margin-top:56px; padding:48px 0 24px}
.sp-footer a{color:#c8cfd1}
.sp-footer a:hover{color:var(--accent-bright); opacity:1}
.sp-footer__grid{display:grid; grid-template-columns:minmax(200px,1.35fr) repeat(3,minmax(0,1fr)); gap:28px 32px; align-items:start}
.sp-footer__brand{min-width:0}
.sp-footer__logo{display:inline-flex; align-items:center; margin:0 0 16px; padding:0; background:transparent; border-radius:0}
.sp-footer__logo img{height:44px; width:auto; display:block; max-width:220px; object-fit:contain}
.sp-footer__desc{font-size:13px; line-height:1.55; color:#9aa4a6; max-width:280px}
.sp-footer__phone{color:#fff; font-weight:700; font-size:17px; display:block; margin:14px 0 4px}
.sp-footer__acc{margin:0; border:0; background:transparent}
.sp-footer__acc > summary{
    color:#fff; font-size:14px; font-weight:700; margin:0 0 12px; cursor:default;
    list-style:none; display:flex; align-items:center; justify-content:space-between; gap:8px;
}
.sp-footer__acc > summary::-webkit-details-marker{display:none}
.sp-footer__acc > summary::after{content:""; flex:0 0 0}
.sp-footer ul{list-style:none; margin:0; padding:0; font-size:13px; line-height:2}
.sp-footer__soc{display:flex; flex-wrap:wrap; gap:10px 14px; margin-top:12px; font-size:12px}
.sp-footer__sub{
    margin-top:28px; padding:14px 18px; border:1px solid rgba(255,255,255,.1); border-radius:14px;
    display:flex; align-items:center; justify-content:space-between; gap:16px 20px; flex-wrap:wrap;
    background:rgba(255,255,255,.03);
}
.sp-footer__sub-txt{display:flex; flex-direction:column; gap:2px; max-width:280px}
.sp-footer__sub-txt b{color:#fff; font-size:14px}
.sp-footer__sub-txt span{font-size:12px; color:#9aa4a6; line-height:1.4}
.sp-footer__sub-form{display:flex; flex-wrap:wrap; align-items:center; gap:8px; flex:1; min-width:220px}
.sp-footer__sub-form input[type=email]{flex:1 1 160px; height:40px; padding:0 12px; border:1px solid rgba(255,255,255,.14); border-radius:10px; background:rgba(0,0,0,.2); color:#fff; font:inherit; font-size:14px}
.sp-footer__sub-form button{height:40px; padding:0 14px; border:0; border-radius:10px; background:var(--accent); color:#fff; font:inherit; font-weight:700; cursor:pointer}
.sp-footer__sub-agree{display:flex; align-items:flex-start; gap:8px; width:100%; font-size:11px; color:#9aa4a6; line-height:1.35}
.sp-footer__sub-agree input{width:18px;height:18px;min-width:18px;min-height:18px;flex-shrink:0;margin-top:1px;accent-color:var(--accent)}
.sp-footer__sub-agree a{color:var(--accent-bright)}
.sp-footer__sub-ok{margin:0; color:#7dcea0; font-weight:600; font-size:13px}
.sp-footer__sub-err{margin:0; width:100%; color:#f5a3a3; font-size:12px}
.sp-footer__bottom{
    border-top:1px solid rgba(255,255,255,.08); margin-top:28px; padding-top:16px;
    display:flex; justify-content:space-between; gap:12px; font-size:12px; color:#7c8688;
}
@media (max-width:900px){
    .sp-footer__grid{grid-template-columns:1fr 1fr; gap:22px}
    .sp-footer__brand{grid-column:1 / -1}
}
@media (max-width:768px){
    .sp-footer{padding:36px 0 20px}
    .sp-footer__grid{grid-template-columns:1fr; gap:0}
    .sp-footer__brand{padding-bottom:18px; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:4px}
    .sp-footer__acc{
        border-bottom:1px solid rgba(255,255,255,.08); padding:4px 0;
    }
    .sp-footer__acc > summary{
        cursor:pointer; margin:0; padding:14px 0; font-size:15px;
    }
    .sp-footer__acc > summary::after{
        content:"▾"; flex:0 0 auto; color:rgba(255,255,255,.55); font-size:12px;
        transition:transform .15s ease;
    }
    .sp-footer__acc[open] > summary::after{transform:rotate(180deg)}
    .sp-footer__acc ul{padding:0 0 14px; line-height:2.05}
    .sp-footer__sub{padding:14px; margin-top:18px; align-items:flex-start}
    .sp-footer__bottom{flex-direction:column; gap:8px; margin-top:20px}
}