/* Единая шапка-навигация Babiators — лендинг, регистрация, вход, легал.
   Самодостаточна (не зависит от --l-* переменных лендинга). */
.lp-header{position:sticky;top:0;z-index:60;background:rgba(26,34,64,.72);
  backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid rgba(255,255,255,.10)}
.lp-header .lp-header-inner{max-width:1400px;margin:0 auto;padding:0 40px;
  display:flex;align-items:center;justify-content:space-between;height:66px}
.lp-logo{display:inline-flex;position:relative;z-index:70}
.lp-logo img{height:26px;filter:brightness(0) invert(1);transition:transform .35s cubic-bezier(.16,1,.3,1),filter .35s}
/* Ховер «солнечный блик по линзе»: блик идёт строго по буквам (маска — сам логотип).
   Буквы на время прохода уходят в тень (::before) — иначе белое по белому не видно,
   и светится только зона под бликом. По краям блика тёплая и холодная кайма — так
   стекло даёт дисперсию. В конце из-за логотипа вылетает искра. */
.lp-logo::before,.lp-logo::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  -webkit-mask:url(/assets/babiators-logo.svg) no-repeat center/contain;
  mask:url(/assets/babiators-logo.svg) no-repeat center/contain}
.lp-logo::before{background:rgba(27,42,74,.62)}
.lp-logo::after{background:linear-gradient(102deg,
    transparent 38%,rgba(255,107,53,.75) 44%,#fff 49%,#fff 53%,rgba(140,205,255,.7) 58%,transparent 64%) no-repeat;
  background-size:260% 100%;background-position:100% 0;
  filter:drop-shadow(0 0 10px rgba(255,150,90,.8))}
.lp-logo-spark{position:absolute;right:-10px;top:-12px;width:20px;height:20px;opacity:0;pointer-events:none;
  filter:drop-shadow(0 0 8px rgba(255,150,90,.9))}
.lp-logo-spark::before,.lp-logo-spark::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,#fff,#FF8C5F);
  clip-path:polygon(50% 0,54% 46%,100% 50%,54% 54%,50% 100%,46% 54%,0 50%,46% 46%)}
.lp-logo-spark::after{transform:rotate(45deg) scale(.55)}
.lp-logo:hover img{transform:scale(1.04);filter:brightness(0) invert(1) drop-shadow(0 0 12px rgba(255,107,53,.55))}
.lp-logo:hover::before{animation:logoFlareDim 2.08s linear}
.lp-logo:hover::after{animation:logoFlare 2.08s linear}
.lp-logo:hover .lp-logo-spark{animation:logoSpark 2.08s linear}
@keyframes logoFlareDim{0%{opacity:0}6%{opacity:1}88%{opacity:1}100%{opacity:0}}
/* background-position идёт 100%→0%: при background-size 260% полезный диапазон
   ровно 0..100%, за его пределами блик стоит на месте и «стартует с задержкой». */
@keyframes logoFlare{0%{opacity:0;background-position:100% 0}4%{opacity:1}94%{opacity:1}100%{opacity:0;background-position:0% 0}}
@keyframes logoSpark{
  0%,55%{opacity:0;transform:scale(.2) rotate(0)}
  72%{opacity:1;transform:scale(1.15) rotate(30deg)}
  100%{opacity:0;transform:scale(.7) rotate(70deg)}
}
@media (prefers-reduced-motion:reduce){
  .lp-logo::before,.lp-logo::after,.lp-logo-spark{display:none}
  .lp-logo img,.lp-logo:hover img{transition:none;transform:none}
}
.lp-nav{display:flex;align-items:center;gap:28px}
.lp-nav a{font-size:15px;font-weight:500;text-decoration:none;color:rgba(188,196,218,.92);transition:color .15s}
.lp-nav a:hover{color:#F3F1EA}
.lp-nav .nav-login{color:#F3F1EA}
.lp-nav .nav-cta{background:#FF6B35;color:#fff;font-weight:600;padding:10px 20px;border-radius:999px;
  box-shadow:0 6px 18px rgba(255,107,53,.32)}
.lp-nav .nav-cta:hover{background:#F0562A;color:#fff}
.site-burger{display:none;position:relative;z-index:70;width:46px;height:46px;border:none;
  background:rgba(255,255,255,.06);border-radius:14px;cursor:pointer;place-items:center;
  transition:background .18s,transform .18s}
.site-burger:hover{background:rgba(255,255,255,.11)}
.site-burger[aria-expanded="true"]{background:rgba(255,107,53,.18)}
.site-burger svg{width:22px;height:22px;stroke:#F3F1EA;transition:opacity .2s}
/* Бургер → X при открытии (иконку прячем, крест рисуем псевдоэлементами) */
.site-burger[aria-expanded="true"] svg{opacity:0}
.site-burger::before,.site-burger::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:2.4px;
  border-radius:2px;background:#FF8B5C;opacity:0;transition:opacity .2s,transform .2s;transform:translate(-50%,-50%)}
.site-burger[aria-expanded="true"]::before{opacity:1;transform:translate(-50%,-50%) rotate(45deg)}
.site-burger[aria-expanded="true"]::after{opacity:1;transform:translate(-50%,-50%) rotate(-45deg)}

/* Контакты внутри мобильного меню (добавляются site-nav.js) — на десктопе скрыты */
.lp-nav-contacts{display:none}

@media (max-width:860px){
  .lp-header .lp-header-inner{padding:0 18px}

  /* ФУЛЛСКРИН-МЕНЮ */
  .lp-nav{position:fixed;inset:0;z-index:58;width:100%;height:100dvh;
    flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;
    padding:104px 28px 36px;overflow-y:auto;
    background:
      radial-gradient(130% 70% at 100% 0%,rgba(255,107,53,.18),transparent 55%),
      radial-gradient(120% 60% at 0% 100%,rgba(96,134,214,.20),transparent 60%),
      linear-gradient(180deg,#232F4F 0%,#171F38 100%);
    border:none;border-radius:0;box-shadow:none;backdrop-filter:none;
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .34s ease,visibility .34s}
  .lp-nav.open{opacity:1;visibility:visible;pointer-events:auto}

  /* Крупные ссылки со ступенчатым появлением */
  .lp-nav a{width:100%;padding:15px 6px;font-size:29px;font-weight:700;letter-spacing:-.01em;
    color:#F3F1EA;border-bottom:1px solid rgba(255,255,255,.08);border-radius:0;
    opacity:0;transform:translateY(20px)}
  .lp-nav.open a{animation:navLinkIn .52s cubic-bezier(.16,1,.3,1) forwards}
  .lp-nav.open a:nth-child(1){animation-delay:.10s}
  .lp-nav.open a:nth-child(2){animation-delay:.17s}
  .lp-nav.open a:nth-child(3){animation-delay:.24s}
  .lp-nav.open a:nth-child(4){animation-delay:.31s}
  .lp-nav a:not(.nav-cta):active{color:#FF8B5C}

  .lp-nav .nav-cta{margin:26px 0 0;padding:18px 20px;display:flex;justify-content:center;font-size:18px;
    border-bottom:none;box-shadow:0 10px 26px rgba(255,107,53,.32)}

  /* Контакты внизу меню */
  .lp-nav-contacts{display:flex;flex-direction:column;gap:14px;margin-top:auto;padding-top:30px;
    opacity:0;transform:translateY(16px)}
  .lp-nav.open .lp-nav-contacts{animation:navLinkIn .5s cubic-bezier(.16,1,.3,1) .40s forwards}
  .lp-nav-contacts .mnav-c{display:flex;align-items:center;gap:12px;color:#EAEEF9;text-decoration:none;font-size:16px;font-weight:600;border-bottom:none;padding:0}
  .lp-nav-contacts .mnav-c svg{width:20px;height:20px;color:#FF8B5C;flex:0 0 auto}
  .lp-nav-socials{display:flex;gap:10px;margin-top:4px}
  .lp-nav-socials a{padding:8px 20px;border:1px solid rgba(255,255,255,.16);border-radius:999px;
    font-size:14px;font-weight:600;color:#EAEEF9;text-decoration:none}
  .lp-nav-socials a:active{border-color:#FF6B35;background:rgba(255,107,53,.14)}

  .site-burger{display:grid}
}
@keyframes navLinkIn{to{opacity:1;transform:translateY(0)}}

/* ============================================================
   Единый футер — лендинг, регистрация, вход, легал
   ============================================================ */
.site-footer{border-top:1px solid rgba(255,255,255,.08);padding:52px 0 30px;margin-top:44px;position:relative;z-index:2}
.site-footer-inner{max-width:1400px;margin:0 auto;padding:0 40px;
  display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:44px;align-items:start}
.site-footer-logo{height:28px;filter:brightness(0) invert(1);opacity:.62;margin-bottom:18px;display:block}
.site-footer-about{font-size:13.5px;color:#8A93AD;line-height:1.7;max-width:340px;margin:0}
.site-footer-col h4{font-size:12.5px;font-weight:700;color:#F3F1EA;margin:0 0 15px;text-transform:uppercase;letter-spacing:.09em}
.site-footer-links{display:flex;flex-direction:column;gap:11px}
.site-footer a{font-size:14px;color:#BCC4DA;text-decoration:none;transition:color .15s}
.site-footer a:hover{color:#FF6B35}
.site-footer-contacts{font-size:14px;color:#BCC4DA;line-height:1.95}
.site-footer-copy{color:#6B7590;font-size:12.5px;margin-top:40px;padding-top:26px;
  border-top:1px solid rgba(255,255,255,.05)}
/* Нижняя строка — по левому краю, элементы через тонкий middot */
.site-footer-copy-inner{max-width:1400px;margin:0 auto;padding:0 40px;
  display:flex;justify-content:flex-start;align-items:center;column-gap:14px;row-gap:8px;flex-wrap:wrap}
.site-footer-copy-inner > *:not(:last-child)::after{content:"·";margin-left:14px;color:#4A5578}
.site-footer-legal{color:#9AA3BD;font-size:12.5px;text-decoration:none;transition:color .15s}
.site-footer-legal:hover{color:#FF6B35}
.site-footer-love{display:inline-flex;align-items:center;gap:6px;color:#8A93AD}
.footer-heart{color:#E0245E;font-size:14px;display:inline-block;animation:footerHeart 1.6s ease-in-out infinite}
@keyframes footerHeart{0%,100%{transform:scale(1)}50%{transform:scale(1.22)}}
@media (prefers-reduced-motion:reduce){.footer-heart{animation:none}}
/* Креативные контакты футера */
.footer-contact{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.footer-contact svg{width:17px;height:17px;color:#FF6B35;flex:0 0 auto}
.footer-socials{display:flex;gap:8px;margin-top:6px}
.footer-social{padding:5px 15px;border:1px solid rgba(255,255,255,.14);border-radius:999px;font-size:13px;line-height:1.4;transition:border-color .15s,background .15s,color .15s}
/* .site-footer a:hover (специфичнее) перекрашивал текст в оранжевый — на тёмном фоне
   это давало контраст 4.37 < 4.5. Поднимаем специфичность и держим белый. */
.site-footer .footer-social:hover{border-color:#FF6B35;background:rgba(255,107,53,.12);color:#fff}
@media (max-width:760px){
  .site-footer-inner{grid-template-columns:1fr;gap:30px;padding:0 20px}
  .site-footer-copy-inner{padding:0 20px;justify-content:flex-start}
}
