/* Sparkling — шапка A/C, футер B/C, дата обновления.
 * Цвета: --sp-* (пресет) с фирменными значениями по умолчанию (Blue). Префиксы классов: sph (шапка), spf (футер). */
.sph, .spf {
  --x-bg: var(--sp-bg, #00050B); --x-card: var(--sp-card, #111924); --x-text: var(--sp-text, #F8FCFF);
  --x-accent: var(--sp-accent, #009CFF);
  --x-soft: color-mix(in srgb, var(--x-text) 86%, transparent);
  --x-muted: color-mix(in srgb, var(--x-text) 45%, transparent);
  --x-line: color-mix(in srgb, var(--x-text) 9%, transparent);
  --x-font: var(--sp-font, var(--main-font, Arial)), Arial, Helvetica, sans-serif;
  --x-mono: var(--sp-mono, "Courier New", monospace);
  font-family: var(--x-font); color: var(--x-text);
}
.sph *, .spf * { box-sizing: border-box; }
.sph a, .spf a { color: inherit; text-decoration: none; }
.sph ul, .spf ul { list-style: none; margin: 0; padding: 0; }
.sph li::before, .spf li::before, .sph li::marker, .spf li::marker { content: none; }
.sph p, .spf p { margin: 0; text-transform: none; }
.sph img, .spf img { border-radius: 0; display: block; max-width: var(--logo-width, 150px); height: auto; }

/* ---------- Шапка ---------- */
.sph { position: sticky; top: 0; z-index: 60; }
.sph__in { height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 var(--offsets, 64px); }
.sph--a { background: color-mix(in srgb, var(--x-bg) 60%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--x-line); }
.sph--c { position: fixed; left: 50%; top: 14px; transform: translateX(-50%); width: min(1040px, calc(100% - 32px)); }
.sph--c .sph__in { height: 60px; padding: 0 10px 0 20px; border-radius: 999px; background: color-mix(in srgb, var(--x-card) 72%, transparent);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: 1px solid color-mix(in srgb, var(--x-text) 12%, transparent); box-shadow: 0 18px 50px rgba(0, 0, 0, .45); }
body.sp-hdr-c { padding-top: 88px; }
body.admin-bar .sph--a { top: 32px; } body.admin-bar .sph--c { top: 46px; }

.sph__logo { display: inline-flex; align-items: center; flex: 0 1 auto; min-width: 0; }
.sph__logo__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sph__logo__name, .spf__logo__name { font-weight: 700; font-size: 21px; letter-spacing: -.02em; }

.sph__nav { flex: 1; display: flex; justify-content: center; min-width: 0; }
.sph__menu { display: flex; gap: 28px; align-items: center; }
.sph__menu > li { position: relative; }
.sph__menu a { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; line-height: 1.3; color: var(--x-soft); transition: color .15s; }
.sph__menu a:hover, .sph__menu .current-menu-item > a { color: var(--x-accent); }
.sph__menu .menu-item-has-children > a::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.sph__menu .sub-menu { position: absolute; top: 100%; left: -14px; min-width: 220px; padding: 8px; margin-top: 10px; border-radius: 14px;
  background: var(--x-card); border: 1px solid var(--x-line); box-shadow: 0 18px 40px rgba(0, 0, 0, .45);
  opacity: 0; visibility: hidden; transform: translateY(-4px); transition: .15s; display: block; }
.sph__menu .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.sph__menu li:hover > .sub-menu, .sph__menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.sph__menu .sub-menu a { display: block; padding: 9px 12px; border-radius: 9px; font-size: 14.5px; }
.sph__menu .sub-menu a:hover { background: color-mix(in srgb, var(--x-text) 6%, transparent); }
.sph__sub-toggle { display: none; }

.sph__cta { display: flex; align-items: center; gap: 8px; flex: none; }
.sph .sph__btn { display: inline-flex; align-items: center; height: 40px; padding: 0 16px; border-radius: 12px; font-size: 14px; font-weight: 700; white-space: nowrap; border: 0; }
.sph--c .sph__btn { border-radius: 999px; }
.sph .sph__btn--w { background: var(--x-text); color: var(--x-bg); }
.sph .sph__btn--d { background: color-mix(in srgb, var(--x-text) 8%, transparent); border: 1px solid color-mix(in srgb, var(--x-text) 10%, transparent); color: var(--x-text); font-weight: 600; }
.sph .sph__btn:hover { opacity: .88; }
.sph__burger { display: none; width: 40px; height: 40px; border: 0; padding: 0; border-radius: 12px; cursor: pointer;
  background: color-mix(in srgb, var(--x-text) 8%, transparent); flex-direction: column; gap: 5px; align-items: center; justify-content: center; }
.sph--c .sph__burger { border-radius: 999px; }
.sph__burger span { width: 16px; height: 2px; background: var(--x-text); border-radius: 2px; transition: .2s; }
.sph.is-open .sph__burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.sph.is-open .sph__burger span:nth-child(2) { opacity: 0; }
.sph.is-open .sph__burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 960px) {
  .sph__in { padding: 0 16px; gap: 12px; }
  .sph--c .sph__in { padding: 0 8px 0 16px; }
  .sph__burger { display: flex; }
  .sph .sph__btn--d { display: none; }
  .sph .sph__btn { padding: 0 12px; font-size: 13px; }
  .sph__logo img { max-width: min(var(--logo-width, 150px), 40vw); }
  .sph__logo__name { font-size: 18px; }
  .sph__nav { position: absolute; left: 0; right: 0; top: 100%; display: none; justify-content: stretch; padding: 8px 16px 16px;
    background: var(--x-bg); border-bottom: 1px solid var(--x-line); max-height: calc(100vh - 64px); overflow-y: auto; }
  .sph--c .sph__nav { top: calc(100% + 8px); border-radius: 22px; border: 1px solid var(--x-line); background: var(--x-card); }
  .sph.is-open .sph__nav { display: flex; }
  .sph__menu { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
  .sph__menu > li { border-bottom: 1px solid var(--x-line); display: flex; flex-wrap: wrap; align-items: center; }
  .sph__menu > li:last-child { border-bottom: 0; }
  .sph__menu > li > a { flex: 1; padding: 14px 0; font-size: 16px; }
  .sph__menu .menu-item-has-children > a::after { content: none; }
  .sph__sub-toggle { display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border: 0; background: transparent; color: var(--x-text); cursor: pointer; }
  .sph__sub-toggle::after { content: ""; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: .2s; }
  .sph__menu li.is-sub-open > .sph__sub-toggle::after { transform: rotate(-135deg); }
  .sph__menu .sub-menu { position: static; width: 100%; margin: 0 0 10px; padding: 4px; opacity: 1; visibility: visible; transform: none; display: none; box-shadow: none; background: color-mix(in srgb, var(--x-text) 4%, transparent); }
  .sph__menu li.is-sub-open > .sub-menu { display: block; }
  body.sp-menu-open { overflow: hidden; }
}
@media (max-width: 782px) { body.admin-bar .sph--a { top: 46px; } }

/* ---------- Футер ---------- */
.spf { background: var(--x-bg); border-top: 1px solid var(--x-line); }
.spf--b { padding-top: 48px; }
.spf__band { max-width: 1152px; margin: 0 auto; padding: 28px 32px; border-radius: 24px; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap;
  background: radial-gradient(70% 140% at 100% 0%, color-mix(in srgb, var(--x-accent) 32%, transparent), transparent 60%), var(--x-card);
  border: 1px solid color-mix(in srgb, var(--x-accent) 28%, transparent); }
.spf .spf__band-title { font-size: 24px; line-height: 1.2; font-weight: 700; letter-spacing: -.02em; color: var(--x-text); }
.spf .spf__band-text { margin-top: 6px; font-size: 14.5px; line-height: 1.5; color: color-mix(in srgb, var(--x-text) 72%, transparent); }
.spf__band-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.spf .spf__btn { display: inline-flex; align-items: center; justify-content: center; height: 44px; padding: 0 18px; border-radius: 12px; font-size: 14px; font-weight: 700; white-space: nowrap; }
.spf .spf__btn--w { background: var(--x-text); color: var(--x-bg); }
.spf .spf__btn--d { background: color-mix(in srgb, var(--x-text) 8%, transparent); border: 1px solid color-mix(in srgb, var(--x-text) 10%, transparent); color: var(--x-text); font-weight: 600; }
.spf .spf__btn:hover { opacity: .88; }
.spf__in { max-width: 1280px; margin: 0 auto; padding: 48px var(--offsets, 64px) 0; }
.spf__top { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 32px; }
.spf__logo { display: inline-flex; align-items: center; }
.spf .spf__desc { margin-top: 14px; font-size: 14px; line-height: 1.55; color: color-mix(in srgb, var(--x-text) 72%, transparent); max-width: 300px; }
.spf .spf__col-title { margin-bottom: 14px; font: 600 11px/1 var(--x-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--x-muted); }
.spf__list a { display: block; padding: 6px 0; font-size: 14.5px; line-height: 1.4; color: var(--x-soft); }
.spf__list a:hover, .spf__links a:hover { color: var(--x-accent); }
.spf__col--widget, .spf__col--widget a { color: var(--x-soft); font-size: 14.5px; }
.spf__soc { display: flex; gap: 8px; margin-top: 16px; }
.spf__soc a { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--x-text) 6%, transparent); border: 1px solid var(--x-line); color: color-mix(in srgb, var(--x-text) 72%, transparent); }
.spf__soc a:hover { color: var(--x-accent); }
.spf__bot { margin-top: 40px; padding: 20px 0 28px; border-top: 1px solid var(--x-line); display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  font-size: 12.5px; line-height: 1.5; color: var(--x-muted); }
.spf__co { font: 600 11px/1.4 var(--x-mono); letter-spacing: .1em; text-transform: uppercase; }
.spf__risk { max-width: 640px; }
.spf__row { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding: 28px var(--offsets, 64px); border-bottom: 1px solid var(--x-line); }
.spf--c .spf__soc { margin: 0; }
.spf__links { display: flex; gap: 22px; flex-wrap: wrap; font-size: 14px; color: var(--x-soft); }
.spf__bot--c { margin: 0; border: 0; padding: 18px var(--offsets, 64px) 26px; }
@media (max-width: 860px) {
  .spf__band { margin: 0 16px; flex-direction: column; align-items: stretch; padding: 24px 20px; }
  .spf__band-btns { flex-direction: column; }
  .spf__in { padding: 40px 16px 0; }
  .spf__top { grid-template-columns: 1fr 1fr; gap: 26px; }
  .spf__brand { grid-column: 1 / -1; }
  .spf__row { padding: 24px 16px; }
  .spf__bot--c { padding: 18px 16px 26px; }
}

/* ---------- Дата обновления ---------- */
.page-update-text time { white-space: nowrap; }
