/* ============================================================
   Зовео — креативный слой для внутренних страниц (2026-11)
   Единый стиль с новой главной: тёмный интро-блок с картой,
   срезанные углы, пунктирные маршруты, зелёные акценты.
   Подключается ПОСЛЕ site.css / legal.css / nav.css.
   ============================================================ */

#zoveo-site {
  --zc-green: #22c55e;
  --zc-green-bright: #4ade80;
  --zc-deep: #0f2d23;
  --zc-dark: #0a0f0e;
  --zc-cut: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
  --zc-cut-sm: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
  --zc-font-display: 'Onest', 'Inter', 'Segoe UI', system-ui, sans-serif;
}

#zoveo-site h1, #zoveo-site h2, #zoveo-site h3 {
  font-family: var(--zc-font-display);
  letter-spacing: -0.02em;
}

/* ---------- появление при скролле ---------- */
#zoveo-site .zrv { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s cubic-bezier(.22,.61,.36,1); transition-delay: var(--rv-delay, 0ms); }
#zoveo-site .zrv.zrv-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  #zoveo-site .zrv { opacity: 1 !important; transform: none !important; transition: none; }
}

/* ============================================================
   ИНТРО СТРАНИЦЫ — тёмная полоса «ночная карта»
   ============================================================ */
#zoveo-site .zpageintro {
  max-width: none;
  position: relative;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 72px max(32px, calc(50vw - 608px)) 64px;
  overflow: hidden;
  color: #e8f2ec;
  background:
    radial-gradient(800px 320px at 85% -20%, rgba(34,197,94,.18), transparent 60%),
    radial-gradient(600px 380px at -10% 120%, rgba(34,197,94,.10), transparent 55%),
    linear-gradient(155deg, #0c1512 0%, var(--zc-dark) 45%, var(--zc-deep) 100%);
}
/* сетка улиц */
#zoveo-site .zpageintro::before {
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(148,163,184,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,184,.06) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(700px 420px at 70% 30%, #000 25%, transparent 78%);
  pointer-events: none;
}
/* световой маршрут */
#zoveo-site .zpageintro::after {
  content: "";
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 300' preserveAspectRatio='none'%3E%3Cpath d='M-40 240 C 320 180, 700 120, 1180 150 S 1400 90, 1500 70' fill='none' stroke='%2322c55e' stroke-opacity='.35' stroke-width='2.5' stroke-dasharray='8 10'/%3E%3Ccircle cx='420' cy='165' r='7' fill='%2322c55e'/%3E%3Ccircle cx='1010' cy='142' r='7' fill='%234ade80'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  opacity: .8;
  pointer-events: none;
}
#zoveo-site .zpageintro > * { position: relative; }

#zoveo-site .zpageintro .zbreadcrumb {
  display: inline-block;
  font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--zc-green-bright);
  text-decoration: none;
  padding: 7px 14px;
  border: 1.5px dashed rgba(74,222,128,.4);
  background: rgba(34,197,94,.08);
  clip-path: var(--zc-cut-sm);
  margin-bottom: 22px;
  transition: background .2s;
}
#zoveo-site .zpageintro .zbreadcrumb:hover { background: rgba(34,197,94,.18); }

#zoveo-site .zpageintro h1 { color: #f4faf6; }
#zoveo-site .zpageintro p { color: rgba(232,242,236,.72); }

/* кнопки */
#zoveo-site .zbutton {
  clip-path: var(--zc-cut-sm);
  border-radius: 0;
  font-family: var(--zc-font-display);
  transition: transform .2s ease, background-color .22s ease, box-shadow .22s ease, border-color .22s;
}
#zoveo-site .zbutton:not(.outline) {
  background: var(--zc-green); color: #06281a;
  box-shadow: 0 12px 30px -12px rgba(34,197,94,.55);
}
#zoveo-site .zbutton:not(.outline):hover { background: var(--zc-green-bright); transform: translateY(-2px); }
#zoveo-site .zpageintro .zbutton.outline {
  background: rgba(248,250,252,.06); color: #e8f2ec;
  border: 1.5px dashed rgba(148,163,184,.45);
}
#zoveo-site .zpageintro .zbutton.outline:hover { border-color: var(--zc-green); color: var(--zc-green-bright); }
#zoveo-site .zbutton.outline:hover { border-color: var(--zc-green); }

/* ============================================================
   КАРТОЧКИ / СЕКЦИИ — срезанные углы, пунктир, hover
   ============================================================ */
#zoveo-site .zfeature,
#zoveo-site .zfaq details,
#zoveo-site .zpricing article,
#zoveo-site .znotice,
#zoveo-site .zcallout,
#zoveo-site .zconnect,
#zoveo-site .zdemo,
#zoveo-site .zpanel {
  border-radius: 0;
  clip-path: var(--zc-cut);
}
#zoveo-site .zfeature:hover,
#zoveo-site .zpricing article:hover {
  border-color: rgba(34,197,94,.5);
  box-shadow: 0 26px 50px -28px rgba(13,59,42,.3);
}

/* акцентные маркеры списков */
#zoveo-site .zpricing article li::before,
#zoveo-site .zlist li::before { border-radius: 0; }

/* секционные заголовки — крупнее */
#zoveo-site .zsectionhead h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.14; }

/* разделители секций — пунктирный маршрут */
#zoveo-site .zsection { border-top: 1.5px dashed rgba(13,59,42,.14); }
#zoveo-site main > .zw:first-of-type:not(.zsection) { border-top: 0; }

/* таблицы */
#zoveo-site .ztable, #zoveo-site table { border-radius: 0; }
#zoveo-site table tbody tr { transition: background .18s; }
#zoveo-site table tbody tr:hover { background: #f2f9f4; }

/* тёмные секции (zdark) — глубже и с зелёным свечением */
#zoveo-site .zdark {
  background:
    radial-gradient(700px 300px at 85% 0%, rgba(34,197,94,.14), transparent 60%),
    linear-gradient(150deg, var(--zc-deep), var(--zc-dark));
}
#zoveo-site .ztint { background: #f2f9f4; }

/* ============================================================
   ФУТЕР — тёмный, как на главной
   ============================================================ */
#zoveo-site .zfooter {
  background: var(--zc-dark);
  border-top: 0;
  color: rgba(232,242,236,.75);
  padding-top: 64px;
}
#zoveo-site .zfooter .zlogo { filter: brightness(0) invert(1); }
#zoveo-site .zfooter p { color: rgba(148,163,184,.85); }
#zoveo-site .zfooter strong { color: rgba(232,242,236,.45); letter-spacing: .12em; text-transform: uppercase; font-size: 12.5px; }
#zoveo-site .zfooter a, #zoveo-site .zfooter a.zfooterlink, #zoveo-site .zfooter button { color: rgba(232,242,236,.75); }
#zoveo-site .zfooter a:hover, #zoveo-site .zfooter button:hover { color: var(--zc-green-bright); }
#zoveo-site .zfootbottom { border-top: 1.5px dashed rgba(148,163,184,.2); color: rgba(148,163,184,.7); }
#zoveo-site .zl-footer { color: rgba(148,163,184,.7); }
#zoveo-site .zl-footer a { color: rgba(148,163,184,.85); }
#zoveo-site .zl-footer a:hover { color: var(--zc-green-bright); }

/* ---------- мобильная адаптация интро ---------- */
@media (max-width: 640px) {
  #zoveo-site .zpageintro { padding: 56px 20px 48px; }
}

/* ============================================================
   ЖИВАЯ КАРТА В ИНТРО (инжектируется reveal.js)
   ============================================================ */
#zoveo-site .zci-wrap {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 46%;
  pointer-events: none;
  mask-image: linear-gradient(90deg, transparent, #000 35%);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 35%);
}
#zoveo-site .zci-map { width: 100%; height: 100%; }
@media (max-width: 900px) { #zoveo-site .zci-wrap { opacity: .35; width: 70%; } }

#zoveo-site .zci-route {
  stroke-dasharray: 8 10;
  animation: zci-dash 26s linear infinite;
}
@keyframes zci-dash { to { stroke-dashoffset: -800; } }

#zoveo-site .zci-pin {
  transform-box: fill-box;
  transform-origin: center bottom;
  animation: zci-pin-drop .9s cubic-bezier(.34,1.56,.64,1) both,
             zci-pin-float 4.5s ease-in-out 1.2s infinite;
}
#zoveo-site .zci-pin.zci-d1 { animation-delay: .3s, 1.5s; }
#zoveo-site .zci-pin.zci-d2 { animation-delay: .6s, 1.8s; }
@keyframes zci-pin-drop { from { transform: translateY(-18px) scale(.5); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes zci-pin-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }

#zoveo-site .zci-pulse {
  transform-box: fill-box;
  transform-origin: center;
  animation: zci-pulse 2.6s ease-out infinite;
}
#zoveo-site .zci-pulse.zci-d1 { animation-delay: .9s; }
#zoveo-site .zci-pulse.zci-d2 { animation-delay: 1.8s; }
@keyframes zci-pulse { 0% { transform: scale(.4); opacity: .8; } 100% { transform: scale(2.4); opacity: 0; } }

/* ============================================================
   ЖИВЫЕ HOVER-ЭФФЕКТЫ
   ============================================================ */

/* блик на зелёных кнопках */
#zoveo-site .zbutton:not(.outline) {
  position: relative;
  overflow: hidden;
}
#zoveo-site .zbutton:not(.outline)::after {
  content: "";
  position: absolute;
  top: -20%; bottom: -20%; left: -30%;
  width: 36%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.45), transparent);
  transform: skewX(-18deg) translateX(-140%);
  transition: none;
  pointer-events: none;
}
#zoveo-site .zbutton:not(.outline):hover::after {
  transform: skewX(-18deg) translateX(430%);
  transition: transform .6s ease;
}

/* иконки карточек — лёгкое покачивание при наведении */
#zoveo-site .zfeature svg { transition: transform .35s cubic-bezier(.34,1.56,.64,1); }
#zoveo-site .zfeature:hover svg { transform: rotate(-8deg) scale(1.12); }

/* текстовые ссылки — подчёркивание-полоса */
#zoveo-site .ztextlink {
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 1.5px;
  background-repeat: no-repeat;
  background-position: 0 100%;
  transition: background-size .3s ease, color .2s;
  text-decoration: none;
}
#zoveo-site .ztextlink:hover { background-size: 100% 1.5px; }

/* FAQ — плавное раскрытие */
#zoveo-site .zfaq details[open] p { animation: zci-fade .35s ease; }
@keyframes zci-fade { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* пунктирные маршруты между шагами/этапами — бегущий пунктир */
#zoveo-site .zsteps li:not(:last-child)::after,
#zoveo-site .zflowbody [class*="line"] { animation: zci-dash 20s linear infinite; }

@media (prefers-reduced-motion: reduce) {
  #zoveo-site .zci-route,
  #zoveo-site .zci-pin,
  #zoveo-site .zci-pulse { animation: none !important; }
  #zoveo-site .zbutton:not(.outline)::after { display: none; }
}