/* Self-host Inter (вариативный) — чтобы шрифт был ОДИНАКОВЫЙ у всех.
   Раньше Inter только назывался в font-family, но не подгружался: у кого он
   установлен в системе — видели Inter, у остальных был фолбэк. Теперь грузится
   с сайта. Субсеты: кириллица, латиница, вьетнамский. font-display:swap. */
@font-face{font-family:'Inter';font-style:normal;font-display:swap;font-weight:100 900;
  src:url('fonts/inter-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter';font-style:normal;font-display:swap;font-weight:100 900;
  src:url('fonts/inter-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-display:swap;font-weight:100 900;
  src:url('fonts/inter-vietnamese.woff2') format('woff2');
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}

:root {
  --hub-bg: #07162f;
  --hub-panel: rgba(8, 29, 61, 0.98);
  --hub-line: rgba(83, 151, 218, 0.25);
  --hub-muted: #8fa6c5;
  --hub-cyan: #42bfff;
  --hub-blue: #087cff;
}

.site-header {
  isolation: isolate;
  overflow: visible;
  z-index: 100 !important;
  transform: translateY(0);
  transition: transform .34s cubic-bezier(.22, .8, .3, 1), box-shadow .25s;
  will-change: transform;
}

.site-header.header-hidden {
  transform: translateY(calc(-100% - 5px));
  pointer-events: none;
}

.site-header .site-logo {
  flex: 0 0 auto;
}

.site-header .geizer-network-logo {
  width: 206px;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.site-header .geizer-network-logo img {
  width: 116px !important;
  height: 54px !important;
  object-fit: contain;
  clip-path: inset(0 0 7.5% 0);
}

.site-header .brand-tagline {
  width: 206px;
  margin-top: -1px;
  color: rgba(245, 248, 255, .82);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  font-size: 7px;
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: .055em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

.site-header .hub-mount {
  min-width: 1px;
  min-height: 42px;
  flex: 1 1 auto;
  margin-left: auto;
}

.site-header:not(.nav-ready) .phone {
  opacity: 0 !important;
  visibility: hidden !important;
}

.site-header:not(.nav-ready) .nav-toggle {
  opacity: 0 !important;
  visibility: hidden !important;
}

.site-header .context-chip {
  padding: 6px 10px;
  border: 1px solid rgba(82, 151, 221, 0.24);
  border-radius: 999px;
  color: #9bb0ce;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  white-space: nowrap;
}

.hub-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}

.hub-home,
.hub-company,
  .hub-contacts,
.hub-reviews,
.hub-trigger {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 14px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--hub-muted);
  font: inherit;
  font-size: 15px !important;
  cursor: pointer;
  transition: color 0.2s, background 0.2s;
}

.site-header .phone {
  font-size: 16px;
  line-height: 1;
}

.hub-home:hover,
.hub-company:hover,
.hub-contacts:hover,
.hub-reviews:hover,
.hub-trigger:hover,
.hub-node.is-open .hub-trigger {
  background: rgba(32, 83, 137, 0.2);
  color: #fff;
}

.hub-chevron {
  width: 6px;
  height: 6px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.22s;
}

.hub-node.is-open .hub-chevron {
  transform: rotate(225deg) translate(-1px, -1px);
}

.mega-panel {
  position: fixed;
  top: 82px;
  left: 50%;
  z-index: 80;
  width: min(1120px, calc(100vw - 40px));
  padding: 18px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 18px;
  border: 1px solid var(--hub-line);
  border-radius: 0 0 24px 24px;
  background: rgba(18, 44, 84, 0.64);
  box-shadow: 0 35px 90px rgba(0, 4, 14, 0.5);
  -webkit-backdrop-filter: blur(26px);
  backdrop-filter: blur(26px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, -12px);
  transition: opacity 0.2s, transform 0.24s, visibility 0.2s;
}

.hub-node.is-open .mega-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.mega-intro {
  min-height: 210px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid rgba(96, 150, 212, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at 88% 12%, rgba(60, 150, 240, 0.12), transparent 46%),
    linear-gradient(160deg, rgba(17, 46, 92, 0.6), rgba(10, 28, 56, 0.5));
}

.mega-intro small {
  color: var(--hub-cyan);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.mega-logo {
  width: 98px;
  height: 46px;
  margin-bottom: 12px;
  object-fit: contain;
  object-position: left center;
}

.mega-intro strong {
  margin: 7px 0;
  color: #f5f8ff;
  font-size: 26px;
  line-height: 1.04;
  letter-spacing: -0.04em;
}

.mega-intro p {
  margin: 0;
  color: #91a8c8;
  font-size: 12px;
}

/* Вход в сам раздел: из выпадающего меню видны только три статьи,
   без этой кнопки в блог целиком попасть неоткуда */
.mega-intro-btn {
  margin-top: 14px;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: linear-gradient(110deg, #0a74ff, #2f9bff);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 14px 30px -14px rgba(8, 134, 255, 0.9);
  transition: transform 0.25s, box-shadow 0.25s;
}

.mega-intro-btn em {
  font-style: normal;
  transition: transform 0.25s;
}

.mega-intro-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 38px -12px rgba(8, 134, 255, 1);
}

.mega-intro-btn:hover em {
  transform: translateX(3px);
}

.mega-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.mega-card {
  min-height: 100px;
  padding: 17px;
  display: grid;
  grid-template-columns: 30px 1fr auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(96, 150, 212, 0.14);
  border-radius: 16px;
  background: rgba(13, 40, 82, 0.5);
  box-shadow: 0 18px 40px -18px rgba(3, 12, 30, 0.72), 0 4px 12px -6px rgba(3, 12, 30, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transition: transform 0.2s, border-color 0.2s, background 0.2s, box-shadow 0.2s;
}

.mega-card:hover {
  transform: translateY(-2px);
  border-color: rgba(66, 191, 255, 0.4);
  background: rgba(20, 56, 108, 0.68);
  box-shadow: 0 30px 60px -20px rgba(3, 12, 30, 0.8), 0 8px 20px -8px rgba(11, 111, 224, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.mega-card.is-current {
  border-color: rgba(66, 191, 255, 0.34);
  background: linear-gradient(135deg, rgba(24, 62, 116, 0.6), rgba(13, 40, 82, 0.55));
}


.mega-index {
  color: var(--hub-cyan);
  font-size: 10px;
  font-weight: 900;
}

.mega-card b,
.mega-card small {
  display: block;
}

.mega-card b {
  color: #fff;
  font-size: 15px;
}

.mega-card small {
  margin-top: 3px;
  color: #88a0c1;
  font-size: 10px;
  line-height: 1.35;
}

.mega-arrow {
  color: #5e89b8;
  font-style: normal;
  font-size: 17px;
}

.articles-panel {
  grid-template-columns: 260px 1fr;
}

.articles-panel .mega-links {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.articles-panel .mega-card {
  min-height: 210px;
  grid-template-columns: 1fr;
  align-content: end;
  overflow: hidden;
  background:
    linear-gradient(0deg, rgba(4, 18, 41, 0.96), rgba(7, 32, 67, 0.62)),
    repeating-linear-gradient(135deg, rgba(70, 168, 255, 0.08) 0 1px, transparent 1px 16px);
}

.article-preview {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  object-fit: cover;
  opacity: 0.58;
  transition: transform 0.55s, opacity 0.25s;
}

.article-preview-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(0deg, rgba(3, 15, 34, 0.98) 8%, rgba(3, 15, 34, 0.7) 58%, rgba(3, 15, 34, 0.12));
}

.article-preview-card:hover .article-preview {
  opacity: 0.72;
  transform: scale(1.05);
}

.article-preview-card .mega-index,
.article-preview-card .article-teaser,
.article-preview-card .mega-arrow {
  position: relative;
  z-index: 2;
}

.article-teaser em {
  display: inline-block;
  margin-top: 13px;
  color: #fff;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.articles-panel .mega-arrow {
  position: absolute;
  right: 17px;
  top: 16px;
  z-index: 3;
}

.articles-panel .mega-card {
  position: relative;
}

.site-header .phone {
  margin-left: 10px;
  white-space: nowrap;
}

.nav-toggle {
  display: none;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(77, 145, 214, 0.25);
  border-radius: 12px;
  background: rgba(8, 33, 70, 0.75);
  cursor: pointer;
}

.nav-toggle span,
.nav-toggle i {
  width: 18px !important;
  height: 1px !important;
  display: block !important;
  margin: 5px auto !important;
  background: #fff !important;
}

.nav-scrim {
  position: fixed;
  inset: 82px 0 0;
  z-index: 60;
  background: rgba(1, 8, 20, 0.62);
  backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: 0.2s;
}

.ecosystem-extra {
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.ecosystem-card {
  min-height: 240px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(69, 145, 218, 0.24);
  border-radius: 20px;
  background: #0a2349;
}

.ecosystem-card > img {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  object-fit: cover;
  transition: transform 0.65s;
}

.ecosystem-card:hover > img {
  transform: scale(1.045);
}

.ecosystem-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(3, 15, 34, 0.98), rgba(3, 15, 34, 0.72) 55%, rgba(3, 15, 34, 0.12));
}

.ecosystem-copy {
  width: min(390px, 78%);
  position: absolute;
  left: 28px;
  bottom: 25px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ecosystem-copy small {
  color: var(--hub-cyan);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ecosystem-copy b {
  margin: 7px 0 4px;
  color: #fff;
  font-size: 26px;
  letter-spacing: -0.035em;
}

.ecosystem-copy em {
  color: #9eb2cf;
  font-size: 12px;
  font-style: normal;
}

.ecosystem-copy i {
  margin-top: 16px;
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

body.nav-layer-open .nav-scrim {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* Discreet offer companion shown after the first screen */
.scroll-companion {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 68;
  width: min(300px, calc(100vw - 28px));
  padding: 13px;
  overflow: hidden;
  border: 1px solid rgba(76, 151, 224, .34);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(8, 35, 73, .58), rgba(5, 20, 44, .48));
  box-shadow: 0 16px 38px rgba(0, 5, 18, .24);
  backdrop-filter: blur(14px) saturate(118%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(18px) scale(.97);
  transition: opacity .3s, visibility .3s, transform .38s cubic-bezier(.22, .8, .3, 1);
}

.scroll-companion::before {
  content: "";
  position: absolute;
  inset: -70px auto auto -45px;
  width: 150px;
  height: 150px;
  border: 1px solid rgba(65, 194, 255, .19);
  border-radius: 50%;
  box-shadow: 0 0 0 28px rgba(65, 194, 255, .035), 0 0 0 58px rgba(65, 194, 255, .025);
  pointer-events: none;
}

.scroll-companion.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

.scroll-companion.is-dismissed { display: none; }
.scroll-companion-kicker { position: relative; display: block; margin-bottom: 2px; color: #48baff; font-size: 8px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.scroll-companion > strong { position: relative; display: block; margin-bottom: 9px; color: #f6f9ff; font-size: 15px; letter-spacing: -.02em; }
.scroll-companion-close { position: absolute; top: 7px; right: 7px; z-index: 2; width: 25px; height: 25px; padding: 0; border: 0; border-radius: 50%; background: rgba(112, 158, 207, .07); color: #88a3c5; font-size: 16px; line-height: 1; cursor: pointer; transition: color .2s, background .2s; }
.scroll-companion-close:hover { color: #fff; background: rgba(112, 158, 207, .18); }
.scroll-companion-actions { position: relative; display: grid; gap: 5px; }
.scroll-companion-actions a { display: grid; grid-template-columns: 8px 1fr auto; gap: 8px; align-items: center; min-height: 44px; padding: 6px 9px; border: 1px solid rgba(76, 145, 216, .18); border-radius: 10px; background: rgba(10, 39, 80, .45); transition: border-color .24s, background .24s, transform .24s; }
.scroll-companion-actions a:hover { border-color: rgba(76, 170, 255, .62); background: rgba(14, 54, 108, .82); transform: translateX(-3px); }
.scroll-companion-actions a > i { width: 7px; height: 7px; border-radius: 50%; background: #31b8ff; box-shadow: 0 0 0 5px rgba(49, 184, 255, .08), 0 0 14px rgba(49, 184, 255, .45); }
.scroll-companion-actions .companion-franchise > i { background: #ffe900; box-shadow: 0 0 0 5px rgba(255, 233, 0, .07), 0 0 14px rgba(255, 233, 0, .35); }
.scroll-companion-actions span { min-width: 0; }
.scroll-companion-actions small,.scroll-companion-actions b { display: block; }
.scroll-companion-actions small { margin-bottom: 1px; color: #93a9c6; font-size: 8px; }
.scroll-companion-actions b { color: #f5f8ff; font-size: 11px; }
.scroll-companion-actions em { color: #55bfff; font-size: 14px; font-style: normal; transition: transform .2s; }
.scroll-companion-actions a:hover em { transform: translateX(3px); }
body:has(dialog[open]) .scroll-companion { opacity: 0; visibility: hidden; pointer-events: none; }
body.vi-avoid-floating .scroll-companion { opacity: 0; visibility: hidden; pointer-events: none; }

/* Виджет обратного звонка стоит ровно тут же — right:22px, тот же bottom,
   z-index 70 против 69 — и полностью накрывал эту кнопку. Поднимаем на
   высоту виджета с зазором, иначе «наверх» физически некликабельна. */
.floating-to-top {
  position: fixed;
  right: 22px;
  bottom: calc(var(--floating-top-bottom, 22px) + 54px);
  z-index: 69;
  display: flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  overflow: hidden;
  padding: 4px;
  border: 1px solid rgba(91, 178, 255, .55);
  border-radius: 999px;
  background: rgba(11, 48, 94, .7);
  color: #fff;
  box-shadow: 0 12px 30px rgba(0, 8, 25, .28);
  backdrop-filter: blur(12px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(12px);
  cursor: pointer;
  transition: width .28s, bottom .35s, opacity .25s, visibility .25s, transform .3s, background .25s;
}

.floating-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

.floating-to-top i {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg, #0b83f8, #42bdff);
  font-size: 17px;
  font-style: normal;
  animation: floatingArrow 2.2s ease-in-out infinite;
}

.floating-to-top span {
  padding-right: 9px;
  color: #dfeeff;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.floating-to-top:hover { width: 105px; background: rgba(11, 48, 94, .9); }
body:has(dialog[open]) .floating-to-top { opacity: 0; visibility: hidden; pointer-events: none; }
body.vi-avoid-floating .floating-to-top { opacity: 0; visibility: hidden; pointer-events: none; }

@keyframes floatingArrow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}

@media (max-width: 1080px) {
  .site-header .context-chip,
  .hub-company,
  .hub-contacts,
  .hub-reviews {
    display: none;
  }
  .hub-home,
  .hub-trigger {
    padding-inline: 10px;
  }
}

@media (max-width: 820px) {
  .site-header {
    height: 70px !important;
    padding-inline: 16px !important;
    gap: 12px !important;
  }

  .site-header .site-logo img {
    max-width: 104px;
  }

  .site-header .geizer-network-logo {
    width: 170px;
  }

  .site-header .brand-tagline {
    width: 170px;
    font-size: 5.8px;
  }

  .site-header .phone {
    margin-left: auto;
    font-size: 13px;
  }

  .nav-toggle {
    display: block !important;
    flex: 0 0 42px;
  }

  .hub-nav {
    position: fixed;
    top: 70px;
    left: 12px;
    right: 12px;
    z-index: 75;
    padding: 12px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    border: 1px solid var(--hub-line);
    border-radius: 0 0 20px 20px;
    background: rgba(7, 23, 49, 0.98);
    box-shadow: 0 30px 70px rgba(0, 4, 14, 0.55);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: 0.2s;
  }

  .site-header.nav-open .hub-nav {
    opacity: 1;
    visibility: visible;
    transform: none;
  }

  .hub-home,
  .hub-company,
  .hub-contacts,
  .hub-reviews,
  .hub-trigger {
    width: 100%;
    justify-content: center;
    border: 1px solid rgba(77, 145, 214, 0.16);
    background: rgba(11, 39, 80, 0.72);
  }

  .hub-company,
  .hub-contacts,
  .hub-reviews {
    display: inline-flex;
  }

  .mega-panel {
    position: fixed;
    top: 198px;
    width: calc(100vw - 24px);
    max-height: calc(100vh - 212px);
    overflow: auto;
    grid-template-columns: 1fr;
    border-radius: 18px;
  }

  .mega-intro {
    min-height: 130px;
  }

  .articles-panel .mega-links {
    grid-template-columns: 1fr;
  }

  .articles-panel .mega-card {
    min-height: 120px;
  }

  .nav-scrim {
    top: 70px;
  }

  .ecosystem-extra {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  /* Номер тут прятался целиком — см. блок «Телефон в шапке» в конце файла.
     Скрывать было нечего: кнопка-иконка занимает 40 px, а свободного места
     в шапке на 360 px — 74 px. */

  .hub-nav {
    grid-template-columns: 1fr;
  }

  .mega-panel {
    top: 298px;
    max-height: calc(100vh - 312px);
  }

  .mega-links {
    grid-template-columns: 1fr;
  }

  .mega-card {
    min-height: 86px;
  }

  .scroll-companion {
    right: 10px;
    bottom: 10px;
    width: min(300px, calc(100vw - 20px));
    padding: 12px;
  }

  .scroll-companion > strong { font-size: 14px; }
  .scroll-companion-actions a { padding: 6px 8px; }

  .floating-to-top {
    right: 10px;
    /* на мобильном виджет звонка тоже уезжает в right:10px — поднимаем так же */
    bottom: calc(var(--floating-top-bottom, 10px) + 52px);
    width: 40px;
    height: 40px;
  }

  .floating-to-top i { width: 30px; height: 30px; flex-basis: 30px; }
  .floating-to-top:hover { width: 40px; }
}

/* Shared animated footer */
body > footer.global-footer {
  --footer-x: 50%;
  --footer-y: 50%;
  position: relative;
  isolation: isolate;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  /* fay63: было 80px. Вместе с отступом .footer-shell (72px) и собственным
     нижним отступом секции над подвалом это давало полосу пустоты почти в
     полтора экрана по высоте — между кнопкой «Перейти в блог» и логотипом
     в подвале не было ничего. Сокращаем оба отступа. */
  margin: 28px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden;
  color: #f5f8ff !important;
  background: #041126;
  font-size: 15px;
}

.global-footer::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  background-image: linear-gradient(rgba(79, 157, 238, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 157, 238, .055) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 84%, transparent);
}

.global-footer .footer-light {
  position: absolute !important;
  z-index: -1;
  left: var(--footer-x);
  top: var(--footer-y);
  display: block !important;
  width: 620px;
  height: 620px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  background: radial-gradient(circle, rgba(16, 126, 255, .17), rgba(7, 78, 159, .05) 38%, transparent 70%);
  transition: left .18s ease-out, top .18s ease-out;
}

.global-footer .footer-runner {
  display: block !important;
  overflow: hidden;
  padding: 22px 0;
  border-block: 1px solid rgba(65, 129, 201, .28);
  background: rgba(8, 34, 72, .7);
}

.footer-runner > div {
  position: relative;
  left: 50%;
  display: flex !important;
  width: max-content;
  align-items: center;
  gap: 27px;
  transform: translateX(-50%);
  animation: footerRunner 18s ease-in-out infinite alternate;
}

.footer-runner:hover > div { animation-play-state: paused; }
.footer-runner span { color: #a6bad6; font-size: 12px; font-weight: 800; letter-spacing: .18em; white-space: nowrap; }
.footer-runner i { width: 7px; height: 7px; border-radius: 50%; background: #21a5ff; box-shadow: 0 0 16px #21a5ff; }

.global-footer .footer-shell {
  display: block !important;
  width: min(1240px, calc(100% - 56px));
  margin: 0 auto;
  padding: 48px 0 27px;
}

.global-footer .footer-main {
  display: grid !important;
  grid-template-columns: 1.15fr 1.8fr .85fr;
  gap: 65px;
  align-items: start;
}

.global-footer .footer-brand,
.global-footer .footer-nav section,
.global-footer .footer-contact { min-width: 0; }

.global-footer .footer-brand img {
  width: 145px !important;
  height: 60px;
  margin: 0 0 23px !important;
  object-fit: contain;
  object-position: left center;
}

.global-footer .footer-tagline {
  display: block;
  width: max-content;
  max-width: 230px;
  margin: -13px 0 24px;
  color: rgba(245, 248, 255, .82);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  font-size: 7.5px;
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: .055em;
  text-transform: uppercase;
  white-space: nowrap;
}

.global-footer .footer-brand:has(.footer-tagline) > img {
  clip-path: inset(0 0 7.5% 0);
}

.footer-status {
  display: flex;
  width: max-content;
  align-items: center;
  gap: 8px;
  margin-bottom: 20px;
  color: #94aac8;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .11em;
}

.footer-status i { width: 7px; height: 7px; border-radius: 50%; background: #31d889; box-shadow: 0 0 0 5px rgba(49, 216, 137, .1); animation: footerPulse 2s ease-in-out infinite; }
.footer-brand h2 { max-width: 350px; margin: 0 0 13px; font-size: clamp(22px, 2vw, 31px); line-height: 1.04; letter-spacing: -.045em; }
.footer-brand p { max-width: 350px; margin: 0; color: #8fa6c5; font-size: 14px; line-height: 1.55; }

.global-footer .footer-nav {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.footer-nav h3,
.footer-contact > span {
  display: block;
  margin: 0 0 20px;
  color: #53b9ff;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .15em;
}

.footer-nav a {
  display: flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  gap: 8px;
  margin: 0 0 13px;
  color: #bac9de;
  font-size: 14px;
  transition: color .25s, transform .25s;
}

.footer-nav a i { color: #4f83bb; font-style: normal; opacity: 0; transform: translate(-5px, 5px); transition: .25s; }
.footer-nav a:hover { color: #fff; transform: translateX(4px); }
.footer-nav a:hover i { opacity: 1; transform: none; }

.global-footer .footer-contact {
  display: block !important;
  margin: 0;
  padding: 0;
  font-style: normal;
}

.footer-contact a { display: block; }
.footer-cta-partner { width: max-content; max-width: 100%; margin-bottom: 16px; padding: 11px 18px; border-radius: 999px; background: linear-gradient(180deg, #ffe14a, #ffc400); color: #14233f; font-weight: 900; font-size: 14px; box-shadow: 0 14px 30px -14px rgba(255, 190, 0, .7); transition: transform .2s, box-shadow .3s; }
.footer-cta-partner:hover { transform: translateY(-2px); box-shadow: 0 20px 40px -14px rgba(255, 190, 0, .85); }
.footer-cta-partner i { font-style: normal; margin-left: 6px; display: inline-block; transition: transform .25s; }
.footer-cta-partner:hover i { transform: translate(3px, -3px); }
.footer-phone { margin-bottom: 8px; color: #fff; font-size: clamp(20px, 2vw, 29px); font-weight: 900; line-height: 1.05; letter-spacing: -.04em; }
.footer-mail { width: max-content; max-width: 100%; padding-bottom: 4px; border-bottom: 1px solid #296398; color: #56bcff; font-size: 14px; font-weight: 700; }
.footer-mail i { display: inline-block; margin-left: 5px; font-style: normal; transition: transform .25s; }
.footer-mail:hover i { transform: translate(3px, -3px); }
.footer-contact p { max-width: 230px; margin: 26px 0 0; color: #8198b8; font-size: 13px; }

.global-footer .footer-route {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-top: 60px;
  padding: 25px 28px;
  border: 1px solid #245486;
  border-radius: 20px;
  background: linear-gradient(110deg, rgba(13, 51, 102, .86), rgba(8, 31, 66, .72));
  transition: border-color .3s, transform .3s;
}

.footer-route:hover { transform: translateY(-3px); border-color: #398ee0; }
.footer-route span { display: block; margin-bottom: 3px; color: #8fa8c8; font-size: 12px; }
.footer-route strong { font-size: 20px; }
.footer-route > a { display: flex; align-items: center; gap: 25px; flex: 0 0 auto; padding: 13px 17px 13px 20px; border-radius: 999px; background: #f4f8ff; color: #092247; font-size: 13px; font-weight: 800; transition: background .25s, transform .25s; }
.footer-route > a i { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: #0e82f6; color: #fff; font-style: normal; }
.footer-route > a:hover { background: #51bdff; transform: translateX(3px); }

.global-footer .footer-bottom {
  display: grid !important;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  margin-top: 28px;
  padding-top: 25px;
  border-top: 1px solid rgba(62, 112, 170, .35);
  color: #68819f;
  font-size: 11px;
}
.footer-animate { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .75s ease; }
.footer-animate.is-visible { opacity: 1; transform: none; }

@keyframes footerRunner {
  from { transform: translateX(calc(-50% - min(6vw, 90px))); }
  to { transform: translateX(calc(-50% + min(6vw, 90px))); }
}
@keyframes footerPulse { 50% { opacity: .45; transform: scale(.78); } }

@media (max-width: 1000px) {
  .global-footer .footer-main { grid-template-columns: 1fr 1.7fr; }
  .global-footer .footer-contact { grid-column: 1 / -1; display: grid !important; grid-template-columns: 1fr 1fr 1fr; align-items: end; gap: 25px; padding-top: 25px; border-top: 1px solid rgba(62, 112, 170, .35); }
  .footer-contact > span { grid-column: 1 / -1; margin-bottom: 0; }
  .footer-contact p { margin: 0; }
}

@media (max-width: 720px) {
  body > footer.global-footer { margin-top: 45px !important; }
  .global-footer .footer-shell { width: min(100% - 36px, 620px); padding-top: 52px; }
  .global-footer .footer-main { grid-template-columns: 1fr; gap: 42px; }
  .global-footer .footer-brand img { width: 125px !important; }
  .global-footer .footer-nav { grid-template-columns: 1fr 1fr; gap: 32px 22px; }
  .global-footer .footer-nav section:last-child { grid-column: 1 / -1; }
  .global-footer .footer-contact { grid-column: auto; grid-template-columns: 1fr; gap: 7px; }
  .footer-contact > span { grid-column: auto; margin-bottom: 12px; }
  .footer-contact p { margin-top: 18px; }
  .global-footer .footer-route { align-items: stretch; flex-direction: column; }
  .footer-route > a { justify-content: space-between; }
  .global-footer .footer-bottom { grid-template-columns: 1fr auto; }
  .global-footer .footer-bottom > span:nth-child(2) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .footer-runner > div, .footer-status i { animation: none; }
  .footer-animate { opacity: 1; transform: none; transition: none; }
  .global-footer .footer-light { display: none !important; }
  .floating-to-top i { animation: none; }
}

/* Brand surface: long water-flow contours instead of a square grid */
.geizer-surface::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -2 !important;
  pointer-events: none !important;
  opacity: 1 !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 1000' fill='none'%3E%3Cpath d='M-180 826C183 738 260 372 584 269C909 165 1117 458 1786 68' stroke='%231f8bd1' stroke-opacity='.11' stroke-width='1.2'/%3E%3Cpath d='M-210 878C205 780 286 433 615 326C945 219 1197 472 1772 153' stroke='%2358c7ef' stroke-opacity='.065' stroke-width='1'/%3E%3Cpath d='M-264 934C223 842 341 513 667 402C993 291 1242 510 1789 254' stroke='%23266fae' stroke-opacity='.09' stroke-width='1'/%3E%3Cpath d='M-102 194C246 24 529 76 778 178C1027 280 1234 263 1702 20' stroke='%234bc6ef' stroke-opacity='.045' stroke-width='1'/%3E%3Cpath d='M-91 227C249 77 522 113 770 212C1018 311 1290 293 1694 75' stroke='%231979bd' stroke-opacity='.07' stroke-width='1'/%3E%3C/svg%3E"),
    radial-gradient(ellipse at 78% 7%, rgba(12, 112, 210, .14), transparent 38%),
    radial-gradient(ellipse at 4% 72%, rgba(44, 183, 226, .045), transparent 32%) !important;
  background-size: cover, auto, auto !important;
  background-position: center, center, center !important;
  background-repeat: no-repeat !important;
}

.geizer-surface .grid-bg {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 820' fill='none'%3E%3Cpath d='M-120 704C251 603 265 303 612 216C959 129 1111 397 1712 81' stroke='%2341bfff' stroke-opacity='.15'/%3E%3Cpath d='M-119 756C284 652 320 370 659 281C998 192 1174 424 1715 156' stroke='%23177dc5' stroke-opacity='.12'/%3E%3Cpath d='M-137 805C330 710 393 448 718 357C1043 266 1240 459 1712 246' stroke='%2374d7f3' stroke-opacity='.065'/%3E%3Cpath d='M-85 111C252 -5 536 45 765 139C994 233 1256 219 1690 25' stroke='%2341bfff' stroke-opacity='.055'/%3E%3C/svg%3E"),
    radial-gradient(ellipse at 82% 14%, rgba(11, 123, 231, .12), transparent 34%) !important;
  background-size: cover, auto !important;
  background-position: center, center !important;
  background-repeat: no-repeat !important;
}

body > footer.global-footer {
  --footer-x: initial;
  --footer-y: initial;
}

.global-footer::before {
  opacity: .9;
  mask-image: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 760' fill='none'%3E%3Cpath d='M-91 596C241 467 329 232 664 177C999 122 1189 337 1702 66' stroke='%231e86c9' stroke-opacity='.16'/%3E%3Cpath d='M-91 635C276 501 382 287 708 237C1034 187 1237 367 1705 131' stroke='%2355c8ed' stroke-opacity='.08'/%3E%3Cpath d='M-100 684C313 552 439 355 758 308C1077 261 1292 407 1700 218' stroke='%231968a6' stroke-opacity='.13'/%3E%3Cpath d='M-104 728C349 609 502 423 811 389C1120 355 1351 455 1708 319' stroke='%2343bce8' stroke-opacity='.055'/%3E%3C/svg%3E") !important;
  background-size: cover !important;
  background-position: center bottom !important;
  background-repeat: no-repeat !important;
}

.global-footer .footer-light {
  left: -6% !important;
  top: 18% !important;
  width: 112% !important;
  height: 430px !important;
  border-radius: 0 !important;
  transform: none;
  opacity: .68;
  filter: none;
  mix-blend-mode: screen;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1800 440' fill='none'%3E%3Cpath d='M-75 330C273 162 483 155 751 243C1019 331 1279 340 1870 37' stroke='%230b88da' stroke-opacity='.22' stroke-width='34'/%3E%3Cpath d='M-70 343C298 195 487 193 748 271C1009 349 1309 358 1871 83' stroke='%234fd2f0' stroke-opacity='.14' stroke-width='10'/%3E%3Cpath d='M-68 365C328 248 510 235 763 305C1016 375 1362 383 1870 151' stroke='%23ffe900' stroke-opacity='.055' stroke-width='2'/%3E%3C/svg%3E") center / 104% 100% no-repeat !important;
  animation: footerCurrent 18s ease-in-out infinite alternate;
}

@keyframes footerCurrent {
  from { transform: translate3d(-2.5%, 8px, 0) scaleX(1.02); opacity: .48; }
  to { transform: translate3d(2.5%, -8px, 0) scaleX(.98); opacity: .75; }
}

@media (prefers-reduced-motion: reduce) {
  .global-footer .footer-light { display: block !important; animation: none !important; opacity: .5; }
}

/* Compact GEIZER mark: the network descriptor is intentionally omitted. */
.site-header .geizer-network-logo {
  width: 132px !important;
  align-self: center !important;
  overflow: hidden;
}

.site-header .geizer-network-logo img {
  width: 116px !important;
  height: 58px !important;
  object-position: center top;
  clip-path: inset(0 0 13% 0) !important;
}

.site-header .brand-tagline,
.global-footer .footer-tagline {
  display: none !important;
}

.global-footer .footer-brand img[src*="geizer-logo"] {
  clip-path: inset(0 0 13% 0) !important;
}

@media (max-width: 720px) {
  .site-header .geizer-network-logo { width: 108px !important; }
  .site-header .geizer-network-logo img {
    width: 98px !important;
    height: 52px !important;
  }
}

/* ============================================================
   ШАПКА — СТЕКЛО С РАСТВОРЕНИЕМ
   Живёт здесь, а не в стилях страниц: navigation.css подключён после них
   на всех семи страницах, поэтому .site-header перебивает .header.
   Цвет берём из токена самой страницы: где-то --bg, где-то --navy.
   ============================================================ */
.site-header {
  border-bottom: 0;
  /* запасной вариант для браузеров без color-mix */
  background: linear-gradient(180deg, rgba(6,15,33,.92), rgba(6,15,33,.58) 58%, rgba(6,15,33,.22));
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--bg, var(--navy, #070f22)) 92%, transparent),
    color-mix(in srgb, var(--bg, var(--navy, #070f22)) 58%, transparent) 58%,
    color-mix(in srgb, var(--bg, var(--navy, #070f22)) 22%, transparent));
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
}

/* Хвост градиента ниже шапки: контент уходит под неё и тает, без обрыва.
   z-index:-1 — чтобы выпадающие меню оставались поверх. */
.site-header::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 100%;
  height: 30px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(6,15,33,.22), transparent);
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg, var(--navy, #070f22)) 22%, transparent), transparent);
}

/* Открытое мобильное меню читается только на плотном фоне */
.site-header.nav-open {
  background: var(--bg, var(--navy, #070f22));
}
.site-header.nav-open::after {
  opacity: 0;
}

/* ============================================================
   СОЦСЕТИ И ПРИЛОЖЕНИЯ
   ============================================================ */
.hub-social {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
  padding-left: 10px;
  border-left: 1px solid rgba(120, 180, 255, .22);
}
.hub-social a {
  position: relative;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #8ba4c4;
  transition: .22s;
}
.hub-social a:hover {
  background: rgba(120, 180, 255, .14);
  color: #fff;
  transform: translateY(-1px);
}
.hub-social svg { width: 17px; height: 17px; fill: currentColor; }
.hub-social a:first-child svg { width: 19px; }

/* Всплывающая подсказка: какая это соцсеть/бот и зачем — иконки в шапке идут без подписи */
.hub-social a[data-tip]::after,
.hub-social a[data-tip]::before {
  position: absolute;
  left: 50%;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s, transform .18s;
  transform: translate(-50%, -4px);
  z-index: 120;
}
.hub-social a[data-tip]::after {
  content: attr(data-tip);
  top: calc(100% + 11px);
  padding: 7px 11px;
  border: 1px solid rgba(120, 180, 255, .35);
  border-radius: 9px;
  background: #0c1f3a;
  color: #eaf3ff;
  font: 700 11px/1.3 Inter, Arial, sans-serif;
  white-space: nowrap;
  box-shadow: 0 14px 30px rgba(0, 8, 25, .4);
}
.hub-social a[data-tip]::before {
  content: '';
  top: calc(100% + 6px);
  border: 5px solid transparent;
  border-bottom-color: #0c1f3a;
}
.hub-social a[data-tip]:hover::after, .hub-social a[data-tip]:hover::before,
.hub-social a[data-tip]:focus-visible::after, .hub-social a[data-tip]:focus-visible::before {
  opacity: 1;
  transform: translate(-50%, 0);
}

.hub-lang {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-left: 6px;
  padding-left: 10px;
  border-left: 1px solid rgba(120, 180, 255, .22);
}
.hub-lang a {
  padding: 5px 7px;
  border-radius: 7px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #8ba4c4;
  transition: .22s;
}
.hub-lang a:hover { background: rgba(120, 180, 255, .14); color: #fff; }
.hub-lang a.is-current { background: rgba(120, 180, 255, .2); color: #fff; }

.footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.footer-social a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 12px;
  border: 1px solid rgba(120, 180, 255, .26);
  border-radius: 999px;
  color: #b9cde6;
  font-size: 11px;
  font-weight: 800;
  transition: .22s;
}
.footer-social a:hover { background: rgba(120, 180, 255, .12); color: #fff; border-color: rgba(120, 180, 255, .5); }
.footer-social svg { width: 15px; height: 15px; fill: currentColor; }

/* Кнопки магазинов: тёмная плашка + фирменный знак, как в сторах */
.footer-apps {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}
.app-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border: 1px solid rgba(150, 190, 235, .3);
  border-radius: 11px;
  background: #0a172e;
  color: #fff;
  transition: .22s;
}
.app-btn:hover { background: #12294c; border-color: rgba(150, 190, 235, .6); transform: translateY(-2px); }
.app-ic { width: 19px; height: 19px; fill: #fff; flex: none; }
.app-ic.gp { fill: none; }
.app-btn span { display: flex; flex-direction: column; line-height: 1.12; }
.app-btn small { font-size: 7px; color: #9db4d2; letter-spacing: .02em; white-space: nowrap; }
.app-btn b { font-size: 12px; letter-spacing: -.01em; white-space: nowrap; }

/* На странице приложения кнопки крупнее — там они главный призыв */
.rv-app-btns .app-btn { padding: 9px 16px 9px 13px; gap: 10px; }
.rv-app-btns .app-ic { width: 24px; height: 24px; }
.rv-app-btns .app-btn small { font-size: 9px; }
.rv-app-btns .app-btn b { font-size: 16px; }

@media (max-width: 1080px) {
  .hub-social {
    grid-column: 1 / -1;
    justify-content: center;
    margin: 2px 0 0;
    padding: 12px 0 0;
    border-left: none;
    border-top: 1px solid rgba(120, 180, 255, .22);
  }
}

/* ============================================================
   ТЕЛЕФОН · комфортные цели для пальца в футере.
   Ссылки разделов и контактов были высотой 21–26px — в такую строку
   сложно попасть, особенно на ходу. Даём им 40px по высоте за счёт
   вертикальных отступов: вид не меняется, промахов меньше.
   ============================================================ */
@media (max-width:760px){
  /* Область нажатия увеличиваем ВЕРТИКАЛЬНЫМИ ОТСТУПАМИ, а не сменой display.
     inline-flex делал ссылку флекс-контейнером и «блокифицировал» вложенную
     стрелку <i>↗</i>: на компьютере она inline-block и идёт в потоке текста,
     а внутри флекса становилась блоком и вставала иначе. Отступы у строчной
     ссылки кликабельны и при этом не влияют на раскладку строки — палец
     попадает легче, вид не меняется. */
  .global-footer .footer-nav a,
  .global-footer .footer-links a,
  .global-footer .footer-contact a,
  .global-footer address a,
  .global-footer nav a{padding-block:10px}
  .global-footer .footer-bottom{padding-block:6px}
}
/* Контакты и нижняя строка футера были на грани читаемости
   (13px/11px тусклым серо-синим) — поднимаем контраст. */
/* Кнопку «Стать партнёром» исключаем: она лежит внутри .footer-contact,
   и общее осветление текста перекрашивало её тёмную надпись на жёлтой
   плашке в светло-голубую — надпись пропадала. */
.global-footer .footer-contact p,
.global-footer .footer-contact a:not(.footer-cta-partner){color:#a9c0e0}
.global-footer .footer-bottom span{color:#8fa8c9}
/* Чип раздела («Блог», «Статья», «Франшиза») рядом с логотипом.
   Он спрятан в header-cohesion.css, но тот подключён через @import внутри
   theme-cohesion.css — то есть скачивается вторым заходом, и до его прихода
   надпись успевала мелькнуть у логотипа. Прячем здесь: этот файл идёт
   обычным <link> и применяется сразу. Правило ниже в @media (max-width:1080px)
   оставлено как было — оно про мобильную раскладку меню. */
.site-header .context-chip{display:none}
/* Ссылка на политику обработки ПДн в подвале (152-ФЗ, ст. 18.1 ч. 2):
   документ должен быть доступен без ограничений, а не только из формы. */
.global-footer .footer-privacy { color: #a9c0e0; font-size: 12.5px; text-decoration: underline; text-underline-offset: 3px; padding-block: 6px; }
.global-footer .footer-privacy:hover { color: #fff; }

/* Реквизиты юрлица в подвале — рядом с копирайтом, тем же тоном. */
.global-footer .footer-req { color: #8fa6c6; font-size: 12.5px; letter-spacing: .01em; }

/* fay63 · «Обсудить проект» вместо кнопки «Стать партнёром» в подвале.
   Кнопка убрана по правке владельца: золотая таблетка в подвале спорила с
   призывами на самих страницах, а «Обсудить проект» до этого была просто
   надписью и никуда не вела — при том что это самая уместная формулировка
   для человека, который дочитал до низа. Теперь ведёт она сама.
   Кегль намеренно мелкий и цвет приглушённый: сразу под ссылкой стоит телефон
   крупным белым, и когда «Обсудить проект» было того же веса, две строки
   сливались в одну кашу — глаз не понимал, где ссылка, а где номер. */
.global-footer .footer-discuss{display:inline-block;width:max-content;max-width:100%;margin-bottom:12px;
  color:#93aac9;font-size:12px;font-weight:700;letter-spacing:.03em;text-decoration:none;
  border-bottom:1px solid rgba(147,170,201,.28);padding-bottom:2px;transition:color .25s,border-color .25s}
.global-footer .footer-discuss:hover{color:#ffd873;border-bottom-color:rgba(255,216,115,.6)}
.global-footer .footer-discuss i{font-style:normal;margin-left:5px;display:inline-block;transition:transform .25s}
.global-footer .footer-discuss:hover i{transform:translate(3px,-3px)}

/* ============================================================
   Телефон в шапке на узком экране
   ------------------------------------------------------------
   Пять страничных стилей (landing, franchise, home, chemistry,
   contacts) прятали номер целиком: `.header .phone{display:none}`.
   На телефоне единственным оставшимся номером был подвальный —
   на посадочной по оборудованию это 25 184 px прокрутки от первого
   экрана, тридцать девять экранов. То есть мобильный посетитель
   с платного клика позвонить не мог вообще, а цель `phone` в Метрике
   не могла сработать по построению.

   Возвращаем номер кнопкой-иконкой: место есть (на 360 px в шапке
   свободно 74 px), ссылка та же `tel:`, цель считается как раньше.
   Порог 720 px — самый широкий из пяти, чтобы накрыть все страницы;
   селектор с тегом (0,2,1) заведомо перебивает `.header .phone`. */
@media (max-width: 720px) {
  /* Размер, скругление, рамка и фон — ровно как у кнопки меню рядом.
     Раньше телефон был кругом 40×40 с фоном rgba(10,39,80,.5), а меню —
     скруглённым квадратом 42×42 с rgba(8,33,70,.75). Две соседние кнопки
     разной формы, разного размера и разной плотности фона читаются как
     недоделка, а не как замысел. Держим их одной парой. */
  /* Раскладка flex, а не grid, и это принципиально. Внутри ссылки, кроме
     иконки, лежит сам номер — он спрятан кеглем 0, но остаётся содержимым.
     В гриде это второй элемент, и браузер строил ДВЕ строки: замер показал
     29,4 px под иконку и 11,4 px под невидимый номер. Трубка центровалась
     внутри своей строки и сидела на 5,7 px выше центра кнопки. Во flex
     пустой номер занимает нулевую ширину и на положение иконки не влияет. */
  header.site-header .phone {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(77, 145, 214, .25);
    border-radius: 12px;
    background: rgba(8, 33, 70, .75);
    color: #eaf2ff;
    font-size: 0;
    line-height: 0;
  }

  header.site-header .phone::before {
    content: "";
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 15.5c-1.25 0-2.45-.2-3.57-.57a1 1 0 0 0-1.02.24l-2.2 2.2a15.05 15.05 0 0 1-6.59-6.59l2.2-2.2a1 1 0 0 0 .25-1.02A11.36 11.36 0 0 1 8.5 4a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1c0 9.39 7.61 17 17 17a1 1 0 0 0 1-1v-3.5a1 1 0 0 0-1-1z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 15.5c-1.25 0-2.45-.2-3.57-.57a1 1 0 0 0-1.02.24l-2.2 2.2a15.05 15.05 0 0 1-6.59-6.59l2.2-2.2a1 1 0 0 0 .25-1.02A11.36 11.36 0 0 1 8.5 4a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1c0 9.39 7.61 17 17 17a1 1 0 0 0 1-1v-3.5a1 1 0 0 0-1-1z'/%3E%3C/svg%3E") center / contain no-repeat;
  }

  header.site-header .phone:active { background: rgba(16, 62, 122, .8); }
}

/* ===== Телефон уехал за край экрана =====
   Замер 19.08.2026: на всех страницах и на всех десктопных ширинах — от 1024
   до 1920 — номер 8 800 600-54-37 стоял правее видимой части. На экране 1440
   он начинался на отметке 1455 при ширине окна 1425. Человек его не видел.

   Шапка — флекс-строка без переноса, а телефон в ней последний: перед ним
   встали «Войти как партнёра» и «Стать партнёром». Считаем на 1440:
   логотип 80 + меню 684 + калькулятор 40 + вход 174 + кнопка 149 + номер 141
   = 1268, плюс пять промежутков по 30 = 1418. Доступно 1169. Лишние 249 px
   выталкивали именно номер. Ширина строки от размера окна не зависит —
   отступы шапки растут вместе с ним, — поэтому и на 1920 номер не помещался.

   Подпись «Войти как партнёр» оставлена по требованию владельца: сворачивать
   её в иконку нельзя. Поэтому место берём в другом порядке — уходят иконки
   соцсетей (они продублированы в подвале) и ужимаются промежутки в строке
   и отступы пунктов меню.

   Лежит именно здесь, а не в header-cohesion.css: Главная тот файл не
   подключает — она источник стиля, а не получатель, — а navigation.css
   стоит на всех страницах без исключения.

   Нижняя граница правил — 721 px. Ниже неё телефон показывается кнопкой-
   трубкой и живёт по своим правилам, там ужимать нечего. Прижим телефона
   влево (margin-left:0) действует только с 1081: до этой ширины номер
   должен уходить вправо через margin-left:auto, иначе он повиснет посреди
   шапки рядом с меню. Замер показал, что настольная раскладка держится и
   на 1009 px — бургер там ещё не включается, — поэтому сжатие нужно и там.

   !important здесь вынужденно: страничные темы подключаются ПОСЛЕ
   navigation.css (на Главной это theme-light.css) и задают шапке свои
   промежутки той же силой селектора — по порядку побеждали они. */
@media (min-width: 721px) {
  header.site-header{ gap: 14px !important; }
  header.site-header .hub-nav{ gap: 4px !important; }
  header.site-header .hub-nav > a{ padding-left: 8px !important; padding-right: 8px !important; }
  header.site-header .hub-social{ display: none !important; }
}
@media (min-width: 1081px) {
  header.site-header .phone{ margin-left: 0 !important; }
}
@media (min-width: 721px) and (max-width: 1300px) {
  header.site-header{ gap: 11px !important; }
  header.site-header .hub-nav > a{ padding-left: 6px !important; padding-right: 6px !important; }
}

/* Полоса 721–1500 px: даже после сжатия номер целиком сюда не влезает —
   замер даёт от 2 до 123 px за краем, в зависимости от страницы. Показывать
   его наполовину за экраном хуже, чем не показывать: там он и был всё это
   время, просто никто не видел. Прячем честно, а с 1501 px он появляется —
   раньше он не был виден НИ на одной десктопной ширине.
   На телефоне (≤720) номер остаётся кнопкой-трубкой и никуда не девается. */
@media (min-width: 721px) and (max-width: 1500px) {
  header.site-header .phone{ display: none !important; }
}


/* fay66 · Подвал на узком телефоне: разделы разъезжались
   ---------------------------------------------------------------------------
   На ширине до 720px подвал раскладывался в две колонки, а третий раздел
   («Полезное») тянулся на всю строку. На телефоне 360–414px колонка выходит
   ~159px — длинные названия («Оборудование БРИЗ», «Франшиза во Вьетнаме»,
   «География сети») переносятся на две строки, и списки в соседних колонках
   перестают совпадать по строкам: «Контакты» оказывается между «Химией» и
   «Услугами». Плюс широкий третий блок под двумя узкими читается как сбой
   вёрстки.
   В одну колонку выравнивать нечего, а третий раздел перестаёт выделяться. */
@media (max-width: 560px) {
  .global-footer .footer-nav { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .global-footer .footer-nav section:last-child { grid-column: auto; }
  /* Ссылки в одну колонку не переносятся, поэтому шаг между ними можно
     сделать плотнее — иначе подвал растягивается на лишний экран. */
  .global-footer .footer-nav a { margin-bottom: 10px; }
  .global-footer .footer-nav h3 { margin-bottom: 14px; }
}

/* fay67 · Телефон-иконка убрана из шапки на узком экране
   ---------------------------------------------------------------------------
   19.08 её сюда вернули не от красоты: на мобильном звонить было нечем,
   единственный номер жил в подвале — 25 184 px прокрутки от первого экрана.
   Сегодня номер появился в самом меню (.hub-phone-m, над «Стать партнёром»),
   то есть путь к звонку остался, только стал длиннее на одно нажатие.
   А в шапке на 375 px подряд стояли четыре кнопки — расчёт, вход, звонок и
   меню; звонок из них единственный, который повторяется пунктом меню.

   ВНИМАНИЕ на будущее: если .hub-phone-m уберут из меню, эту иконку надо
   вернуть. Иначе на мобильном снова не останется ни одной ссылки tel: выше
   подвала, и цель «phone» в Метрике перестанет срабатывать по построению. */
@media (max-width: 720px) {
  header.site-header .phone { display: none !important; }
}