/* Общая шапка и подвал всех страниц skladsync.ru (главная, справка, «Что нового», юридические).
   Классы sx-* и свои переменные — не зависят от CSS конкретной страницы (там свои правила header.site). */
.sx-head,.sx-foot{--sx-blue:#1d74ab;--sx-lime:#a2c617;--sx-lime-dark:#8fb112;--sx-text:#222;--sx-muted:#5c6b78;--sx-line:#e0e6ea;--sx-soft:#f4f8fb;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--sx-text);line-height:1.5;font-size:16px} /* не наследовать от страницы */
.sx-in{width:min(1160px,calc(100% - 40px));margin-inline:auto}

.sx-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--sx-line)}
.sx-head .sx-in{display:flex;align-items:center;gap:24px;height:64px}
.sx-logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--sx-text);text-decoration:none;flex:none}
.sx-logo img{flex:none;width:auto;height:32px;aspect-ratio:1;object-fit:contain} /* пропорции знака не зависят от ширины шапки (Safari сжимал картинку во flex) */
.sx-logo b{color:var(--sx-blue);font-weight:800}
.sx-nav{display:flex;gap:22px;margin-left:auto;font-size:14px;font-weight:600}
.sx-nav a,.sx-menu nav a{color:var(--sx-text);text-decoration:none;border-radius:6px}
.sx-nav a{padding:6px 2px;border-bottom:2px solid transparent}
.sx-nav a:hover{color:var(--sx-blue)}
.sx-nav a[aria-current]{color:var(--sx-blue);border-bottom-color:var(--sx-blue)}
.sx-cta{flex:none;display:inline-flex;align-items:center;padding:10px 18px;border-radius:8px;font-weight:700;font-size:14.5px;text-decoration:none;
  background:var(--sx-lime);color:#1d2b12;border:1px solid var(--sx-lime-dark);box-shadow:0 6px 18px rgba(162,198,23,.3)}
.sx-cta:hover{background:#aed127}
.sx-nav a:focus-visible,.sx-cta:focus-visible,.sx-menu summary:focus-visible,.sx-menu nav a:focus-visible,.sx-foot a:focus-visible{outline:3px solid var(--sx-lime);outline-offset:2px}

.sx-menu{display:none;position:relative;margin-left:auto}
.sx-menu summary{list-style:none;cursor:pointer;white-space:nowrap;padding:8px 12px;border:1px solid var(--sx-line);border-radius:10px;font-weight:600;font-size:14px;background:#fff}
.sx-menu summary::-webkit-details-marker{display:none}
.sx-menu summary::after{content:" ▾";color:var(--sx-muted)}
.sx-menu[open] summary::after{content:" ▴"}
.sx-menu nav{position:absolute;right:0;top:calc(100% + 8px);z-index:60;display:grid;min-width:220px;background:#fff;border:1px solid var(--sx-line);
  border-radius:12px;box-shadow:0 12px 32px rgba(24,56,77,.12);padding:6px}
.sx-menu nav a{padding:11px 14px;font-weight:500}
.sx-menu nav a:hover,.sx-menu nav a[aria-current]{background:var(--sx-soft);color:var(--sx-blue)}
.sx-menu nav .sx-menu-cta{display:none}
@media (max-width:980px){.sx-nav{display:none}.sx-menu{display:block}}
/* Телефон: в шапке только знак с названием и «Меню»; «Подключить» — последним пунктом меню, на главной есть кнопка первого экрана. */
@media (max-width:600px){.sx-head .sx-in{gap:12px}.sx-head .sx-cta{display:none}
  .sx-menu nav .sx-menu-cta{display:block;margin-top:6px;text-align:center;font-weight:700;background:var(--sx-lime);color:#1d2b12;border:1px solid var(--sx-lime-dark)}
  .sx-menu nav .sx-menu-cta:hover{background:#aed127;color:#1d2b12}}
@media (max-width:360px){.sx-logo{font-size:17px}}

.sx-foot{border-top:1px solid var(--sx-line);padding:36px 0 28px;margin-top:56px;font-size:13.5px;color:var(--sx-muted);background:#fff}
.sx-foot-in{display:flex;gap:24px;flex-wrap:wrap;justify-content:space-between;align-items:flex-start}
.sx-foot .sx-logo{font-size:16px}
.sx-foot .sx-logo img{height:26px}
.sx-foot-brand p{margin:8px 0 0}
.sx-foot a{color:var(--sx-blue)}
.sx-foot-nav{display:flex;gap:22px;flex-wrap:wrap}
.sx-foot-nav a{color:var(--sx-text);text-decoration:none;font-weight:600}
.sx-foot-nav a:hover{color:var(--sx-blue)}
.sx-legal{margin-top:22px;margin-bottom:0;line-height:1.6}
.sx-legal a{color:inherit;text-decoration:underline}

/* Юридические страницы: таблица тарифов оферты на узком экране помещается в ширину (на production вылезала на 320–375). */
@media (max-width:480px){.sx-legal-page table{font-size:13.5px}.sx-legal-page th,.sx-legal-page td{padding:7px 8px;overflow-wrap:anywhere}}

/* Окно «Настройки cookie» из legal-info.js: две кнопки выбора одинакового вида, как в окне согласия. */
#ss-cookie-settings [data-ck-allow],#ss-cookie-settings [data-ck-deny]{background:#fff!important;color:#1d74ab!important;border:1.5px solid #1d74ab!important;flex:1 1 0;min-width:9.5em;white-space:nowrap;font-size:14px}
#ss-cookie-settings button[data-ck-close]{flex-basis:100%;text-align:right}
@media (max-width:480px){#ss-cookie-settings [data-ck-allow],#ss-cookie-settings [data-ck-deny]{flex-basis:100%}}
/* тот же порядок, что в окне согласия: «Только необходимые» первой (в разметке legal-info.js она вторая) */
#ss-cookie-settings [data-ck-deny]{order:1}#ss-cookie-settings [data-ck-allow]{order:2}#ss-cookie-settings button[data-ck-close]{order:3}