/* ==========================================================================
   splitu.css — дизайн-система splitu.ru (макеты «Вариант A», гайд Guide.dc.html)
   Префикс классов .sp- — чтобы не пересекаться с легаси-стилями контента.
   Брейкпоинты: десктоп ≥1024 (контейнер 1280), планшет 768–1023 (720), мобильный <768 (358).
   ========================================================================== */

:root{
    /* бренд и действия */
    --sp-blue:#0099D0;        /* фирменный голубой: плашки, иконки, фокус */
    --sp-blue-d:#0A76A0;      /* синие кнопки, ссылки, активные чипы */
    --sp-blue-dh:#08618A;     /* синяя кнопка — наведение */
    --sp-link-h:#075E80;      /* ссылка — наведение */
    --sp-orange:#FF6C00;      /* главный CTA, бейдж скидки, счётчик */
    --sp-orange-h:#E05A00;
    --sp-orange-t:#C44E00;    /* мелкий оранжевый текст на белом */
    --sp-blue-bg:#EAF6FB;
    --sp-blue-bg2:#E6F5FB;
    --sp-blue-bg3:#F3FAFD;
    --sp-star:#FF9A1F; --sp-star-off:#D6D6D6;
    /* текст, фоны, линии */
    --sp-text:#282828; --sp-text-2:#3A3A3A; --sp-text-3:#555555; --sp-gray:#767676;
    --sp-bg-photo:#F0F0F0; --sp-bg-sec:#FAFAFA;
    --sp-line-field:#CFCFCF; --sp-line:#E2E2E2; --sp-line-2:#EDEDED;
    /* подвал */
    --sp-foot:#1E2226; --sp-foot-t:#B8BEC5; --sp-foot-l:#7FD0EE; --sp-foot-line:#353B42;
    /* статусы */
    --sp-ok:#1E7B3A; --sp-ok-bg:#E7F4EC;
    --sp-err:#C0271D; --sp-err-t:#8E1D15; --sp-err-line:#F2B8B2; --sp-err-bg:#FDECEA;
    --sp-warn-line:#FFB980; --sp-warn-bg:#FFF4EB;
    /* радиусы, тени */
    --sp-r8:8px; --sp-r12:12px; --sp-r16:16px; --sp-r20:20px; --sp-r24:24px;
    --sp-sh-s:0 4px 12px rgba(0,0,0,.06);
    --sp-sh-m:0 8px 24px rgba(0,0,0,.05);
    --sp-sh-l:0 14px 32px rgba(0,70,100,.14);
    --sp-sh-xl:0 20px 48px rgba(20,30,40,.2);
    --sp-overlay:rgba(20,24,28,.55);
    /* сетка */
    --sp-container:1280px; --sp-pad:80px; --sp-gap:20px; --sp-sec:72px;
    --sp-font:'Onest',system-ui,-apple-system,'Segoe UI',sans-serif;
}
@media (max-width:1439px){ :root{ --sp-pad:40px; } }
@media (max-width:1023px){ :root{ --sp-pad:24px; --sp-gap:16px; --sp-sec:48px; } }
@media (max-width:767px){  :root{ --sp-pad:16px; --sp-gap:12px; --sp-sec:36px; } }

/* ---------- база ---------- */
html{ -webkit-text-size-adjust:100%; }
body.sp{
    margin:0; background:#fff; color:var(--sp-text);
    font-family:var(--sp-font); font-size:16px; line-height:1.6;
    -webkit-font-smoothing:antialiased;
}
body.sp a{ color:var(--sp-blue-d); text-decoration:none; }
body.sp a:hover{ color:var(--sp-link-h); }
body.sp img{ max-width:100%; height:auto; }
body.sp button, body.sp input, body.sp select, body.sp textarea{ font-family:inherit; }
body.sp :focus-visible{ outline:3px solid var(--sp-blue); outline-offset:2px; }
body.sp h1,body.sp h2,body.sp h3,body.sp h4{ font-family:var(--sp-font); color:var(--sp-text); margin:0 0 .5em; }
body.sp h1{ font-size:44px; font-weight:800; line-height:1.12; letter-spacing:-.02em; }
body.sp h2{ font-size:30px; font-weight:800; line-height:1.2; }
body.sp h3{ font-size:21px; font-weight:700; line-height:1.3; }
body.sp h4{ font-size:17px; font-weight:700; line-height:1.35; }
@media (max-width:767px){
    body.sp h1{ font-size:28px; line-height:1.15; }
    body.sp h2{ font-size:24px; }
    body.sp h3{ font-size:18px; }
    body.sp h4{ font-size:16px; }
}
.sp-lead{ font-size:21px; line-height:1.55; color:var(--sp-text-2); }
.sp-small{ font-size:14px; line-height:1.5; color:var(--sp-text-3); }
.sp-caps{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--sp-text-3); }
@media (max-width:767px){ .sp-lead{ font-size:17px; line-height:1.5; } }
.sp-sr{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.sp-wrap{ max-width:calc(var(--sp-container) + var(--sp-pad)*2); margin:0 auto; padding:0 var(--sp-pad); box-sizing:border-box; }
.sp-section{ padding-top:var(--sp-sec); }
.sp-section--gray{ background:var(--sp-bg-sec); padding-bottom:var(--sp-sec); margin-top:var(--sp-sec); }
.sp-sec-head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:24px; flex-wrap:wrap; }
.sp-sec-head h2{ margin:0; }

/* ---------- иконки ---------- */
.sp-ico{ width:24px; height:24px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.sp-ico--20{ width:20px; height:20px; }
.sp-ico--18{ width:18px; height:18px; }

/* ---------- кнопки ---------- */
.sp-btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    height:52px; padding:0 28px; box-sizing:border-box; border-radius:var(--sp-r12);
    border:0; cursor:pointer; font:inherit; font-size:16px; font-weight:700; line-height:1;
    text-decoration:none!important; white-space:nowrap; transition:background .15s, color .15s, border-color .15s;
}
.sp-btn--sm{ height:44px; padding:0 18px; }
.sp-btn--block{ display:flex; width:100%; }
.sp-btn--orange, body.sp a.sp-btn--orange{ background:var(--sp-orange); color:#fff; font-size:17px; font-weight:800; }
.sp-btn--orange:hover, body.sp a.sp-btn--orange:hover{ background:var(--sp-orange-h); color:#fff; }
.sp-btn--blue, body.sp a.sp-btn--blue{ background:var(--sp-blue-d); color:#fff; }
.sp-btn--blue:hover, body.sp a.sp-btn--blue:hover{ background:var(--sp-blue-dh); color:#fff; }
.sp-btn--outline, body.sp a.sp-btn--outline{ background:#fff; color:var(--sp-blue-d); border:1.5px solid var(--sp-blue-d); }
.sp-btn--outline:hover, body.sp a.sp-btn--outline:hover{ background:var(--sp-blue-bg); color:var(--sp-blue-d); }
.sp-btn--text, body.sp a.sp-btn--text{ background:transparent; color:var(--sp-blue-d); height:44px; padding:0 4px; }
.sp-btn--text:hover, body.sp a.sp-btn--text:hover{ color:var(--sp-link-h); text-decoration:underline!important; }
.sp-btn[disabled], .sp-btn.is-disabled{ background:var(--sp-line)!important; color:var(--sp-gray)!important; border-color:var(--sp-line)!important; cursor:not-allowed; }

/* ---------- поля ---------- */
.sp-field{ display:flex; flex-direction:column; gap:6px; }
.sp-field > label{ font-size:14px; font-weight:600; color:var(--sp-text-2); }
.sp-input, .sp-select, .sp-textarea{
    height:52px; box-sizing:border-box; width:100%; padding:0 16px;
    border:1.5px solid var(--sp-line-field); border-radius:var(--sp-r12); background:#fff;
    font:inherit; font-size:16px; color:var(--sp-text); outline:none; transition:border-color .15s, box-shadow .15s;
}
.sp-textarea{ height:auto; min-height:104px; padding:12px 16px; resize:vertical; }
.sp-input::placeholder, .sp-textarea::placeholder{ color:var(--sp-gray); }
.sp-input:focus, .sp-select:focus, .sp-textarea:focus{ border-color:var(--sp-blue); box-shadow:0 0 0 3px rgba(0,153,208,.25); }
.sp-input.is-error{ border-color:var(--sp-err); background:var(--sp-err-bg); }
.sp-field__err{ font-size:13px; color:var(--sp-err); }
.sp-check{ display:flex; align-items:flex-start; gap:10px; min-height:44px; font-size:15px; cursor:pointer; }
.sp-check input{ width:20px; height:20px; margin:2px 0 0; accent-color:var(--sp-blue-d); flex-shrink:0; }

/* ---------- чипы, бейджи ---------- */
.sp-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.sp-chip, body.sp a.sp-chip{
    display:inline-flex; align-items:center; height:44px; padding:0 16px; box-sizing:border-box;
    border:1.5px solid var(--sp-line-field); border-radius:999px; background:#fff;
    font-size:15px; font-weight:500; color:var(--sp-text); white-space:nowrap; cursor:pointer;
}
.sp-chip:hover, body.sp a.sp-chip:hover{ border-color:var(--sp-blue); color:var(--sp-blue-d); }
.sp-chip.is-active, body.sp a.sp-chip.is-active{ border-color:var(--sp-blue); background:var(--sp-blue-bg2); color:var(--sp-blue-d); font-weight:700; }
@media (max-width:767px){ .sp-chip, body.sp a.sp-chip{ height:40px; font-size:14px; padding:0 14px; } }
.sp-badge{ display:inline-flex; align-items:center; padding:3px 9px; border-radius:var(--sp-r8); font-size:13px; font-weight:800; line-height:1.4; }
.sp-badge--sale{ background:var(--sp-orange); color:#fff; font-size:16px; }
.sp-badge--in{ background:var(--sp-ok-bg); color:var(--sp-ok); }
.sp-badge--out{ background:var(--sp-bg-photo); color:var(--sp-text-3); }
.sp-badge--mark{ background:var(--sp-warn-bg); color:var(--sp-orange-t); border:1px solid var(--sp-warn-line); }
.sp-counter[hidden]{ display:none!important; }
.sp-counter{ display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 5px; box-sizing:border-box; border-radius:10px; background:var(--sp-orange); color:var(--sp-foot); font-size:12px; font-weight:800; line-height:1; }
.sp-stock{ display:inline-flex; align-items:center; gap:6px; font-size:14px; color:var(--sp-ok); }
.sp-stock::before{ content:''; width:8px; height:8px; border-radius:50%; background:currentColor; }
.sp-stock--out{ color:var(--sp-text-3); }
.sp-stars{ position:relative; display:inline-block; font-size:15px; line-height:1; letter-spacing:1px; color:var(--sp-star-off); white-space:nowrap; }
.sp-stars > span{ position:absolute; top:0; left:0; overflow:hidden; color:var(--sp-star); }

/* ==========================================================================
   ШАПКА
   ========================================================================== */
.sp-header{ position:sticky; top:0; z-index:900; background:#fff; }
.sp-header.is-stuck{ box-shadow:var(--sp-sh-s); }
.sp-topbar{ background:var(--sp-bg-photo); font-size:14px; color:var(--sp-text-3); }
.sp-topbar .sp-wrap{ height:40px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.sp-topbar__usp{ display:flex; gap:28px; }
.sp-topbar__usp span{ display:inline-flex; align-items:center; gap:8px; white-space:nowrap; }
.sp-topbar__usp .sp-ico{ color:var(--sp-blue); }
.sp-topbar__nav{ display:flex; align-items:center; gap:24px; white-space:nowrap; }
body.sp .sp-topbar__nav a{ color:var(--sp-text-3); }
body.sp .sp-topbar__nav a:hover{ color:var(--sp-blue-d); }
.sp-topbar__hours{ color:var(--sp-text); font-weight:500; }

.sp-headmain{ border-bottom:1px solid var(--sp-line); }
.sp-headmain .sp-wrap{ height:96px; display:flex; align-items:center; gap:20px; }
.sp-logo{ display:flex; flex-shrink:0; align-items:center; }
body.sp .sp-logo img{ display:block; height:44px; width:auto; max-width:none; }
.sp-catbtn{ flex-shrink:0; }
.sp-catbtn .sp-ico--close{ display:none; }
.sp-catbtn[aria-expanded="true"] .sp-ico--close{ display:block; }
.sp-catbtn[aria-expanded="true"] .sp-ico--burger{ display:none; }
.sp-search{ flex-grow:1; min-width:0; height:52px; display:flex; align-items:stretch; margin:0; border:2px solid var(--sp-blue); border-radius:var(--sp-r12); overflow:hidden; box-sizing:border-box; position:relative; }
.sp-search input{ flex-grow:1; min-width:0; border:0; outline:none; padding:0 16px; font:inherit; font-size:16px; color:var(--sp-text); background:#fff; }
.sp-search button{ border:0; padding:0 22px; background:var(--sp-blue-d); color:#fff; font:inherit; font-size:16px; font-weight:700; cursor:pointer; display:flex; align-items:center; gap:8px; }
.sp-search button:hover{ background:var(--sp-blue-dh); }
.sp-phone{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; flex-shrink:0; }
body.sp .sp-phone__num{ display:flex; align-items:center; gap:8px; font-size:20px; font-weight:800; color:var(--sp-text); white-space:nowrap; }
.sp-phone__num .sp-ico{ color:var(--sp-orange); }
body.sp .sp-phone__cb{ font-size:15px; font-weight:700; color:var(--sp-orange-t); background:none; border:0; padding:0; cursor:pointer; }
body.sp .sp-phone__cb:hover{ text-decoration:underline; }
.sp-iconbtn, body.sp a.sp-iconbtn{ position:relative; width:52px; height:52px; flex-shrink:0; border-radius:var(--sp-r12); background:var(--sp-bg-photo); color:var(--sp-text); display:flex; align-items:center; justify-content:center; border:0; cursor:pointer; }
.sp-iconbtn:hover, body.sp a.sp-iconbtn:hover{ background:var(--sp-blue-bg); color:var(--sp-blue-d); }
.sp-iconbtn .sp-counter{ position:absolute; top:-6px; right:-6px; }
.sp-cart, body.sp a.sp-cart{ height:52px; flex-shrink:0; display:flex; align-items:center; gap:10px; padding:0 16px 0 12px; border-radius:var(--sp-r12); background:var(--sp-bg-photo); color:var(--sp-text); }
body.sp a.sp-cart:hover{ background:var(--sp-blue-bg); color:var(--sp-blue-d); }
.sp-cart__ico{ position:relative; display:flex; }
.sp-cart__ico .sp-counter{ position:absolute; top:-8px; right:-10px; }
.sp-cart__txt{ display:flex; flex-direction:column; line-height:1.2; }
.sp-cart__txt small{ font-size:13px; color:var(--sp-text-3); }
.sp-cart__txt b{ font-size:15px; font-weight:700; white-space:nowrap; }

/* выпадающее меню «Каталог» */
.sp-catmenu{ position:absolute; left:0; right:0; top:100%; z-index:950; display:none; }
.sp-catmenu.is-open{ display:block; }
.sp-catmenu__panel{ background:#fff; border:1px solid var(--sp-line); border-top:0; border-radius:0 0 var(--sp-r20) var(--sp-r20); box-shadow:0 24px 48px rgba(20,30,40,.16); display:grid; grid-template-columns:minmax(0,1fr) 340px; overflow:hidden; }
.sp-catmenu__main{ padding:28px 32px; display:flex; flex-direction:column; gap:16px; }
.sp-catmenu__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px 16px; }
body.sp .sp-catmenu__item{ min-height:52px; display:flex; align-items:center; gap:12px; padding:0 12px; border-radius:10px; color:var(--sp-text); font-size:16px; font-weight:500; line-height:1.25; }
body.sp .sp-catmenu__item .sp-ico{ color:var(--sp-blue); stroke-width:1.8; }
body.sp .sp-catmenu__item:hover{ background:var(--sp-blue-bg); color:var(--sp-blue-d); }
body.sp .sp-catmenu__item--all{ color:var(--sp-blue-d); font-weight:700; }
.sp-catmenu__side{ background:var(--sp-bg-sec); border-left:1px solid var(--sp-line); padding:28px; display:flex; flex-direction:column; gap:20px; }
.sp-catmenu__side .sp-caps{ font-size:14px; margin-bottom:10px; }
.sp-catmenu__area{ display:flex; flex-wrap:wrap; gap:8px; }
body.sp .sp-catmenu__area a{ height:44px; padding:0 14px; display:flex; align-items:center; border:1px solid var(--sp-line-field); border-radius:10px; background:#fff; color:var(--sp-text); font-size:15px; }
body.sp .sp-catmenu__area a:hover{ border-color:var(--sp-blue); color:var(--sp-blue-d); }
.sp-catmenu__brands{ display:flex; flex-wrap:wrap; gap:6px 14px; font-size:15px; }
body.sp .sp-catmenu__promo{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding:16px; border-radius:14px; background:var(--sp-blue); color:#fff; font-size:19px; font-weight:700; }
body.sp .sp-catmenu__promo:hover{ background:var(--sp-blue-d); color:#fff; }

/* мобильная шапка */
.sp-mhead{ display:none; }
@media (max-width:1023px){
    .sp-topbar, .sp-headmain{ display:none; }
    .sp-mhead{ display:block; background:#fff; border-bottom:1px solid var(--sp-line); }
    .sp-mhead__strip{ height:32px; background:var(--sp-bg-photo); display:flex; align-items:center; justify-content:center; gap:6px; font-size:13px; color:var(--sp-text-3); }
    .sp-mhead__strip .sp-ico{ color:var(--sp-blue); width:16px; height:16px; }
    .sp-mhead__body{ padding:8px var(--sp-pad) 12px; display:flex; flex-direction:column; gap:8px; }
    .sp-mhead__row{ height:48px; display:flex; align-items:center; gap:8px; }
    .sp-mhead__row .sp-iconbtn{ width:44px; height:44px; }
    body.sp .sp-mhead__row .sp-logo img{ height:32px; }
    .sp-mhead__sp{ flex-grow:1; }
    body.sp .sp-mhead__phone{ font-size:17px; font-weight:800; color:var(--sp-text); margin-right:8px; white-space:nowrap; }
    body.sp .sp-mhead__call{ height:44px; padding:0 12px; border-radius:var(--sp-r12); background:var(--sp-orange); color:#fff; display:flex; align-items:center; gap:6px; font-size:16px; font-weight:800; }
    .sp-mhead .sp-search{ height:48px; }
    .sp-mhead .sp-search button{ width:48px; padding:0; justify-content:center; }
    .sp-header.is-stuck .sp-mhead__strip{ display:none; }
}
@media (max-width:767px){ .sp-mhead__phone{ display:none; } }

/* мобильное меню (off-canvas) */
.sp-mmenu{ position:fixed; inset:0; z-index:2000; display:none; }
.sp-mmenu.is-open{ display:block; }
.sp-mmenu__bg{ position:absolute; inset:0; background:var(--sp-overlay); }
.sp-mmenu__panel{ position:absolute; top:0; left:0; bottom:0; width:min(390px,100%); background:#fff; display:flex; flex-direction:column; overflow:hidden; }
.sp-mmenu__head{ height:64px; flex-shrink:0; display:flex; align-items:center; gap:12px; padding:0 16px; border-bottom:1px solid var(--sp-line); }
.sp-mmenu__head .sp-iconbtn{ width:44px; height:44px; }
.sp-mmenu__body{ flex-grow:1; overflow-y:auto; padding:8px 16px; display:flex; flex-direction:column; }
.sp-mmenu__acc{ height:56px; display:flex; align-items:center; justify-content:space-between; padding:0; border:0; border-bottom:1px solid var(--sp-line); background:transparent; font:inherit; font-size:18px; font-weight:700; color:var(--sp-blue-d); cursor:pointer; }
.sp-mmenu__cats{ display:none; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:12px; padding:6px 0 10px; border-bottom:1px solid var(--sp-line); }
.sp-mmenu__acc[aria-expanded="true"] + .sp-mmenu__cats{ display:grid; }
body.sp .sp-mmenu__cats a{ min-height:40px; display:flex; align-items:center; color:var(--sp-text); font-size:15px; line-height:1.25; }
body.sp .sp-mmenu__link{ min-height:52px; display:flex; align-items:center; border-bottom:1px solid var(--sp-line); font-size:17px; font-weight:600; color:var(--sp-text); }
.sp-mmenu__foot{ flex-shrink:0; padding:16px; background:var(--sp-bg-photo); display:flex; flex-direction:column; gap:10px; }
.sp-mmenu__foot .sp-small{ text-align:center; font-size:13px; }
body.sp-lock{ overflow:hidden; }

/* ==========================================================================
   ПОДВАЛ
   ========================================================================== */
.sp-footer{ margin-top:var(--sp-sec); background:var(--sp-foot); color:var(--sp-foot-t); font-size:15px; line-height:1.5; }
.sp-footer .sp-wrap{ padding-top:56px; }
.sp-footer__grid{ display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)); gap:40px; padding-bottom:40px; }
.sp-footer__contacts{ display:flex; flex-direction:column; gap:12px; }
.sp-footer__logo{ align-self:flex-start; padding:8px 12px; border-radius:10px; background:#fff; display:flex; }
body.sp .sp-footer__logo img{ height:36px; width:auto; max-width:none; display:block; }
body.sp .sp-footer__phone{ font-size:21px; font-weight:800; color:#fff; }
body.sp .sp-footer a{ color:var(--sp-foot-t); }
body.sp .sp-footer a:hover{ color:#fff; }
body.sp .sp-footer a.sp-footer__accent{ color:var(--sp-foot-l); }
.sp-footer__col{ display:flex; flex-direction:column; gap:10px; }
.sp-footer__col h3, .sp-footer__col .sp-footer__title{ font-size:15px; font-weight:700; color:#fff; margin:0 0 4px; }
.sp-footer__acc{ display:none; }
.sp-footer__bottom{ border-top:1px solid var(--sp-foot-line); padding:20px 0 28px; display:flex; justify-content:space-between; gap:24px; font-size:14px; }
.sp-footer__legal{ display:flex; gap:24px; flex-wrap:wrap; }
@media (max-width:1023px){
    .sp-footer .sp-wrap{ padding-top:28px; }
    .sp-footer__grid{ grid-template-columns:minmax(0,1fr); gap:0; padding-bottom:20px; }
    .sp-footer__contacts{ padding-bottom:20px; }
    .sp-footer__col{ gap:0; border-top:1px solid var(--sp-foot-line); }
    .sp-footer__col:last-child{ border-bottom:1px solid var(--sp-foot-line); }
    .sp-footer__col h3, .sp-footer__col .sp-footer__title{ display:none; }
    .sp-footer__acc{ display:flex; height:52px; align-items:center; justify-content:space-between; padding:0; border:0; background:transparent; font:inherit; font-size:16px; font-weight:700; color:#fff; cursor:pointer; }
    .sp-footer__acc::after{ content:'+'; font-weight:400; font-size:20px; }
    .sp-footer__acc[aria-expanded="true"]::after{ content:'−'; }
    .sp-footer__links{ display:none; flex-direction:column; gap:10px; padding-bottom:16px; }
    .sp-footer__acc[aria-expanded="true"] + .sp-footer__links{ display:flex; }
    .sp-footer__bottom{ flex-direction:column; gap:8px; }
    .sp-footer__legal{ flex-direction:column; gap:4px; }
    .sp-footer__legal a{ min-height:36px; display:flex; align-items:center; }
}
@media (min-width:1024px){ .sp-footer__links{ display:flex; flex-direction:column; gap:10px; } }

/* ==========================================================================
   КОНТЕНТ-ОБЛАСТЬ (обёртка вокруг $this->body())
   ========================================================================== */
.sp-main{ padding-top:24px; }
.sp-crumbs{ font-size:14px; color:var(--sp-text-3); margin-bottom:16px; }
.sp-crumbs ul, .sp-crumbs ol{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.sp-crumbs li{ display:flex; align-items:center; gap:8px; }
.sp-crumbs li + li::before{ content:'/'; color:var(--sp-text-3); }
.sp-crumbs li:last-child, .sp-crumbs li:last-child a{ color:var(--sp-text); }
@media (max-width:767px){ .sp-crumbs{ font-size:13px; } }
.sp-layout{ display:grid; grid-template-columns:280px minmax(0,1fr); gap:32px; align-items:start; }
@media (max-width:1023px){ .sp-layout{ grid-template-columns:minmax(0,1fr); } }

/* модалки */
.sp-modal{ position:fixed; inset:0; z-index:2100; display:none; align-items:center; justify-content:center; padding:16px; box-sizing:border-box; }
.sp-modal.is-open{ display:flex; }
.sp-modal__bg{ position:absolute; inset:0; background:var(--sp-overlay); }
.sp-modal__box{ position:relative; width:440px; max-width:100%; max-height:100%; overflow:auto; box-sizing:border-box; background:#fff; border-radius:var(--sp-r20); box-shadow:var(--sp-sh-xl); padding:28px; display:flex; flex-direction:column; gap:14px; }
.sp-modal__close{ position:absolute; top:16px; right:16px; width:44px; height:44px; border:0; border-radius:var(--sp-r12); background:var(--sp-bg-photo); color:var(--sp-text); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.sp-modal__title{ font-size:24px; font-weight:800; line-height:1.2; padding-right:48px; }
.sp-modal__sub{ font-size:15px; line-height:1.5; color:var(--sp-text-3); }
@media (max-width:767px){ .sp-modal{ align-items:flex-end; padding:0; } .sp-modal__box{ width:100%; border-radius:var(--sp-r20) var(--sp-r20) 0 0; } }

/* нативная форма ICMS «Обратный звонок» внутри модалки */
.sp-modal .icms-forms__callback .form-group, .sp-modal form .field{ margin-bottom:12px; }
.sp-modal form label{ display:block; font-size:14px; font-weight:600; color:var(--sp-text-2); margin-bottom:6px; }
.sp-modal form input[type=text], .sp-modal form input[type=tel], .sp-modal form input[type=email], .sp-modal form textarea{
    width:100%; height:52px; box-sizing:border-box; padding:0 16px; border:1.5px solid var(--sp-line-field); border-radius:var(--sp-r12); font:inherit; font-size:16px; outline:none;
}
.sp-modal form textarea{ height:auto; min-height:96px; padding:12px 16px; }
.sp-modal form input:focus, .sp-modal form textarea:focus{ border-color:var(--sp-blue); box-shadow:0 0 0 3px rgba(0,153,208,.25); }
.sp-modal form .buttons, .sp-modal form .form-actions{ margin-top:8px; }
.sp-modal form input[type=submit], .sp-modal form button[type=submit]{
    width:100%; height:56px; border:0; border-radius:var(--sp-r12); background:var(--sp-orange); color:#fff; font:inherit; font-size:18px; font-weight:800; cursor:pointer;
}
.sp-modal form input[type=submit]:hover, .sp-modal form button[type=submit]:hover{ background:var(--sp-orange-h); }

/* кнопка «наверх» */
.sp-top{ position:fixed; right:32px; bottom:104px; width:48px; height:48px; border-radius:50%; border:0; background:#fff; color:var(--sp-blue-d); box-shadow:var(--sp-sh-xl); display:none; align-items:center; justify-content:center; cursor:pointer; z-index:800; }
.sp-top.is-visible{ display:flex; }
@media (max-width:767px){ .sp-top{ right:16px; bottom:84px; } }

/* хлебные крошки ICMS (ol.breadcrumb + svg-иконка «домой») */
.sp-crumbs .breadcrumb{ background:none; padding:0; margin:0; border-radius:0; display:flex; flex-wrap:wrap; gap:8px; list-style:none; }
.sp-crumbs .breadcrumb > li + li::before{ content:'/'; padding:0; color:var(--sp-text-3); }
.sp-crumbs .breadcrumb > li{ display:flex; align-items:center; gap:8px; }
.sp-crumbs svg{ width:16px; height:16px; vertical-align:-2px; fill:currentColor; }
.sp-crumbs .breadcrumb > .active{ color:var(--sp-text); }

/* ---------- подсказки поиска ---------- */
body.sp .sp-search{ overflow:visible; }
.sp-search input{ border-radius:10px 0 0 10px; }
.sp-search button{ border-radius:0 10px 10px 0; }
.sp-suggest{ position:absolute; left:-2px; right:-2px; top:calc(100% + 6px); z-index:1200; background:#fff; border:1px solid var(--sp-line); border-radius:var(--sp-r16); box-shadow:var(--sp-sh-xl); padding:8px; max-height:70vh; overflow-y:auto; }
body.sp .sp-suggest__item{ display:flex; align-items:center; gap:12px; padding:8px; border-radius:10px; color:var(--sp-text); outline:none; }
body.sp .sp-suggest__item:hover, body.sp .sp-suggest__item:focus{ background:var(--sp-blue-bg); color:var(--sp-text); }
.sp-suggest__img{ width:48px; height:48px; flex-shrink:0; border-radius:8px; background:var(--sp-bg-photo); display:flex; align-items:center; justify-content:center; overflow:hidden; }
body.sp .sp-suggest__img img{ max-width:100%; max-height:100%; object-fit:contain; }
.sp-suggest__t{ flex:1; min-width:0; font-size:15px; line-height:1.3; display:flex; flex-direction:column; }
.sp-suggest__t small{ color:var(--sp-gray); font-size:12px; }
.sp-suggest__item b{ white-space:nowrap; font-size:15px; }
body.sp .sp-suggest__all{ display:block; width:100%; margin-top:4px; padding:10px; border:0; border-radius:10px; background:var(--sp-bg-sec); color:var(--sp-blue-d); font:inherit; font-weight:700; cursor:pointer; text-align:center; height:auto; }
body.sp .sp-suggest__all:hover{ background:var(--sp-blue-bg); }
.sp-suggest__empty{ padding:12px; color:var(--sp-text-3); font-size:15px; }

/* ---------- cookie (P16) ---------- */
.sp-cookie{ position:fixed; left:24px; bottom:24px; z-index:1500; max-width:520px; display:flex; align-items:center; gap:16px; padding:16px 20px; background:#fff; border:1px solid var(--sp-line); border-radius:var(--sp-r16); box-shadow:var(--sp-sh-xl); }
.sp-cookie p{ margin:0; font-size:14px; line-height:1.45; color:var(--sp-text-3); }
.sp-cookie .sp-btn{ flex-shrink:0; }
@media (max-width:767px){ .sp-cookie{ left:12px; right:80px; bottom:12px; max-width:none; flex-direction:column; align-items:stretch; gap:10px; padding:14px; } }
.sp-mmenu__cats .sp-mmenu__all{ font-weight:700; }
