/* =========================================================
   NOXEN VPN — FINAL GLOBAL PREMIUM CSS
   ВСТАВИТЬ ЦЕЛИКОМ В "ДОПОЛНИТЕЛЬНЫЙ CSS" СТРАНИЦЫ
   ========================================================= */

/* =========================
   БАЗА
   ========================= */

html,
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 14% 18%, rgba(77, 159, 255, 0.16) 0%, rgba(77, 159, 255, 0) 28%),
    radial-gradient(circle at 84% 15%, rgba(133, 98, 255, 0.16) 0%, rgba(133, 98, 255, 0) 30%),
    radial-gradient(circle at 54% 60%, rgba(55, 203, 255, 0.08) 0%, rgba(55, 203, 255, 0) 24%),
    linear-gradient(180deg, #05070c 0%, #060912 28%, #060911 52%, #05070c 100%) !important;
  background-attachment: fixed !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  color: #ffffff;
  position: relative;
}

#allrecords,
#allrecords .t-records,
#allrecords .t-rec,
#allrecords .t-records__wrapper,
.t-rec,
.t-records,
.t-records__wrapper,
.t-container,
.t-container_100 {
  background: transparent !important;
}

#allrecords {
  position: relative;
}

/* =========================
   ГЛОБАЛЬНАЯ АТМОСФЕРА
   ========================= */

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(circle at 22% 24%, rgba(81, 152, 255, 0.08) 0%, rgba(81, 152, 255, 0) 26%),
    radial-gradient(circle at 78% 20%, rgba(145, 108, 255, 0.08) 0%, rgba(145, 108, 255, 0) 28%),
    radial-gradient(circle at 50% 52%, rgba(64, 198, 255, 0.05) 0%, rgba(64, 198, 255, 0) 24%);
  filter: blur(18px);
  animation: noxenAmbientShift 18s ease-in-out infinite;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(rgba(255,255,255,0.010) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.010) 1px, transparent 1px);
  background-size: 42px 42px;
  opacity: .16;
  mask-image: radial-gradient(circle at center, rgba(0,0,0,0.96) 16%, rgba(0,0,0,0.30) 72%, transparent 96%);
  -webkit-mask-image: radial-gradient(circle at center, rgba(0,0,0,0.96) 16%, rgba(0,0,0,0.30) 72%, transparent 96%);
}

/* =========================
   СЕКЦИИ — БЕЗ СВОЕГО ФОНА
   ========================= */

.nx-hero,
.nox2-section,
.nox3-final,
.nxf-footer {
  position: relative;
  z-index: 1;
  background: transparent !important;
}

.nx-hero::before,
.nx-hero::after,
.nox2-section::before,
.nox2-section::after,
.nox3-final::before,
.nox3-final::after,
.nxf-footer::before,
.nxf-footer::after {
  display: none !important;
  opacity: 0 !important;
}

/* =========================
   РИТМ И СТЫКИ БЛОКОВ
   ========================= */

.nx-hero {
  min-height: 820px !important;
  padding-bottom: 56px !important;
}

.nox2-section {
  margin-top: -56px !important;
  padding-top: 72px !important;
  padding-bottom: 90px !important;
}

.nox3-final {
  margin-top: -28px !important;
  padding-top: 92px !important;
  padding-bottom: 102px !important;
}

.nxf-footer {
  margin-top: -24px !important;
  padding-top: 72px !important;
}

/* =========================
   WRAP-Ы
   ========================= */

.nx-wrap,
.nox2-wrap,
.nox3-wrap,
.nxf-wrap {
  position: relative;
  z-index: 2;
}

.nx-wrap::after,
.nox2-wrap::after,
.nox3-wrap::after,
.nxf-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 10%, rgba(255,255,255,0.025) 0%, rgba(255,255,255,0) 24%),
    radial-gradient(circle at 80% 90%, rgba(133, 98, 255, 0.035) 0%, rgba(133, 98, 255, 0) 26%);
  z-index: 0;
}

/* =========================
   ТИПОГРАФИКА
   ========================= */

.nx-title,
.nox2-title,
.nox3-title,
.nxf-title {
  text-wrap: balance;
  letter-spacing: -0.058em !important;
}

.nx-subtitle,
.nox2-text,
.nox2-card-text,
.nox3-subtitle,
.nox3-card-text,
.nxf-text {
  color: rgba(228,236,249,0.74) !important;
  letter-spacing: -0.01em !important;
}

.nox2-title,
.nox3-title,
.nxf-title {
  color: #f6f9ff !important;
}

.nx-panel-title,
.nox3-card-title,
.nox2-card-title {
  letter-spacing: -0.02em;
}

.nx-title-accent,
.nox2-title-accent,
.nox3-accent,
.nxf-accent {
  filter: drop-shadow(0 0 16px rgba(126, 172, 255, 0.08));
}

/* =========================
   ЕДИНЫЙ СТИЛЬ КАРТОЧЕК
   ========================= */

.nx-panel,
.nox2-card,
.nox3-card,
.nxf-shell,
.nxf-contact-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.060), rgba(255,255,255,0.024)) !important;
  border-color: rgba(255,255,255,0.085) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 18px 50px rgba(0,0,0,0.22) !important;
  transition:
    transform .38s cubic-bezier(.2,.9,.2,1),
    box-shadow .38s cubic-bezier(.2,.9,.2,1),
    border-color .38s cubic-bezier(.2,.9,.2,1),
    background .38s cubic-bezier(.2,.9,.2,1) !important;
}

.nx-panel::after,
.nox2-card::after,
.nox3-card::after,
.nxf-shell::after,
.nxf-contact-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,0.12), rgba(255,255,255,0) 26%),
    linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0));
  opacity: 0;
  transition: opacity .34s ease;
}

.nx-panel:hover,
.nox2-card:hover,
.nox3-card:hover,
.nxf-shell:hover,
.nxf-contact-card:hover {
  transform: translateY(-4px);
  border-color: rgba(161, 188, 255, 0.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    0 26px 70px rgba(0,0,0,0.28),
    0 0 30px rgba(121,146,255,0.08) !important;
}

.nx-panel:hover::after,
.nox2-card:hover::after,
.nox3-card:hover::after,
.nxf-shell:hover::after,
.nxf-contact-card:hover::after {
  opacity: 1;
}

/* =========================
   МЕЛКИЕ CHIPS И BOXES
   ========================= */

.nx-benefit,
.nox2-chip,
.nox3-benefit,
.nx-mini-box,
.nox3-mini-box {
  background: rgba(255,255,255,0.035) !important;
  border-color: rgba(255,255,255,0.07) !important;
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease,
    background .28s ease !important;
}

.nx-benefit:hover,
.nox2-chip:hover,
.nox3-benefit:hover,
.nx-mini-box:hover,
.nox3-mini-box:hover {
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 10px 24px rgba(0,0,0,0.18),
    0 0 16px rgba(121,146,255,0.06) !important;
}

/* =========================
   ЖЕСТКИЙ ФИКС ШРИФТА КНОПОК
   ========================= */

.nx-btn,
.nx-btn *,
.nx-floating-btn,
.nx-floating-btn *,
.nox3-btn,
.nox3-btn *,
.nxf-btn,
.nxf-btn *,
button,
button *,
a.nx-btn,
a.nx-btn *,
a.nx-floating-btn,
a.nx-floating-btn *,
a.nox3-btn,
a.nox3-btn *,
a.nxf-btn,
a.nxf-btn * {
  font-family: "Inter", Arial, Helvetica, sans-serif !important;
  font-style: normal !important;
  font-weight: 600 !important;
  font-kerning: normal !important;
  font-optical-sizing: auto !important;
  font-synthesis: none !important;
  letter-spacing: 0.01em !important;
  line-height: 1.1 !important;
  text-transform: none !important;
  text-decoration: none !important;
  text-shadow: none !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: geometricPrecision !important;
}

.nx-btn-primary,
.nx-btn-primary *,
.nx-floating-btn-primary,
.nx-floating-btn-primary *,
.nox3-btn-primary,
.nox3-btn-primary *,
.nxf-btn-primary,
.nxf-btn-primary * {
  font-family: "Inter", Arial, Helvetica, sans-serif !important;
  font-style: normal !important;
  font-weight: 700 !important;
  letter-spacing: 0.012em !important;
  line-height: 1.08 !important;
}

.nx-btn-secondary,
.nx-btn-secondary *,
.nx-floating-btn-secondary,
.nx-floating-btn-secondary *,
.nox3-btn-secondary,
.nox3-btn-secondary *,
.nxf-btn-secondary,
.nxf-btn-secondary * {
  font-family: "Inter", Arial, Helvetica, sans-serif !important;
  font-style: normal !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.1 !important;
}

.nx-floating-menu,
.nx-floating-menu * {
  font-family: "Inter", Arial, Helvetica, sans-serif !important;
  font-style: normal !important;
  font-synthesis: none !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* =========================
   ОБЩИЙ СТИЛЬ КНОПОК
   ========================= */

.nx-btn,
.nx-floating-btn,
.nox3-btn,
.nxf-btn {
  position: relative;
  isolation: isolate;
  transform: translateZ(0);
  backface-visibility: hidden;
  transition:
    transform .34s cubic-bezier(.2,.9,.2,1),
    box-shadow .34s cubic-bezier(.2,.9,.2,1),
    border-color .34s cubic-bezier(.2,.9,.2,1),
    background .34s cubic-bezier(.2,.9,.2,1),
    color .34s cubic-bezier(.2,.9,.2,1),
    opacity .34s cubic-bezier(.2,.9,.2,1) !important;
}

.nx-btn::after,
.nx-floating-btn::after,
.nox3-btn::after,
.nxf-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,0.18), rgba(255,255,255,0) 34%),
    linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0));
  opacity: 0;
  transition: opacity .34s ease;
  z-index: 0;
}

.nx-btn > *,
.nx-floating-btn > *,
.nox3-btn > *,
.nxf-btn > * {
  position: relative;
  z-index: 1;
}

.nx-btn:hover,
.nx-btn:focus,
.nx-floating-btn:hover,
.nx-floating-btn:focus,
.nox3-btn:hover,
.nox3-btn:focus,
.nxf-btn:hover,
.nxf-btn:focus {
  transform: translateY(-3px) scale(1.01);
}

.nx-btn:hover::after,
.nx-btn:focus::after,
.nx-floating-btn:hover::after,
.nx-floating-btn:focus::after,
.nox3-btn:hover::after,
.nox3-btn:focus::after,
.nxf-btn:hover::after,
.nxf-btn:focus::after {
  opacity: 1;
}

.nx-btn:active,
.nx-floating-btn:active,
.nox3-btn:active,
.nxf-btn:active {
  transform: translateY(-1px) scale(0.995);
}

.nx-btn-primary:hover,
.nx-btn-primary:focus,
.nx-floating-btn-primary:hover,
.nx-floating-btn-primary:focus,
.nox3-btn-primary:hover,
.nox3-btn-primary:focus,
.nxf-btn-primary:hover,
.nxf-btn-primary:focus {
  box-shadow:
    0 26px 54px rgba(70,126,255,0.34),
    0 0 24px rgba(141,167,255,0.20),
    0 0 60px rgba(121,146,255,0.10),
    inset 0 1px 0 rgba(255,255,255,0.18) !important;
}

.nx-btn-secondary:hover,
.nx-btn-secondary:focus,
.nx-floating-btn-secondary:hover,
.nx-floating-btn-secondary:focus,
.nox3-btn-secondary:hover,
.nox3-btn-secondary:focus,
.nxf-btn-secondary:hover,
.nxf-btn-secondary:focus {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 18px 36px rgba(0,0,0,0.26),
    0 0 22px rgba(121,146,255,0.08) !important;
}

/* =========================
   FLOATING MENU
   ========================= */

.nx-floating-menu {
  transition:
    opacity .42s cubic-bezier(.2,.9,.2,1),
    transform .42s cubic-bezier(.2,.9,.2,1),
    visibility .42s ease !important;
}

.nx-floating-menu.is-visible .nx-floating-menu-inner {
  animation: noxenMenuFloat 5s ease-in-out infinite;
}

.nx-floating-menu-inner {
  position: relative;
  background: rgba(10, 14, 23, 0.64) !important;
  border: 1px solid rgba(255,255,255,0.11) !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,0.36),
    inset 0 1px 0 rgba(255,255,255,0.10),
    0 0 40px rgba(91,129,255,0.08) !important;
}

.nx-floating-menu-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0)),
    radial-gradient(circle at 80% 10%, rgba(136, 107, 255, 0.10), rgba(136, 107, 255, 0) 30%);
  opacity: .9;
}

/* =========================
   ВИЗУАЛЫ HERO И CTA
   ========================= */

.nx-core,
.nox3-core {
  animation-duration: 8s !important;
  box-shadow:
    0 0 90px rgba(93,177,255,0.32),
    0 0 160px rgba(145,105,255,0.18),
    inset 0 0 30px rgba(255,255,255,0.08) !important;
}

.nx-ring,
.nox3-ring {
  opacity: 0.7;
  animation: noxenRingPulse 8s ease-in-out infinite;
}

.nx-ring:nth-child(2),
.nox3-ring:nth-child(2) {
  animation-delay: .8s;
}

.nx-ring:nth-child(3),
.nox3-ring:nth-child(3) {
  animation-delay: 1.6s;
}

.nx-ring:nth-child(4),
.nox3-ring:nth-child(4) {
  animation-delay: 2.4s;
}

.nx-route {
  filter: drop-shadow(0 0 12px rgba(143,229,255,0.18));
}

.nx-route::before,
.nx-route::after {
  animation: noxenDotPulse 3.6s ease-in-out infinite;
}

.nx-route::after {
  animation-delay: 1.2s;
}

/* =========================
   FOOTER ПОЛИРОВКА
   ========================= */

.nxf-shell {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    0 26px 90px rgba(0,0,0,0.30),
    0 0 40px rgba(105,131,255,0.06) !important;
}

.nxf-links a,
.nxf-contact-link,
.nxf-mini-nav a {
  transition:
    color .28s ease,
    opacity .28s ease,
    transform .28s ease !important;
}

.nxf-links a:hover,
.nxf-contact-link:hover,
.nxf-mini-nav a:hover {
  transform: translateX(2px);
}

/* =========================
   АНИМАЦИИ ПОЯВЛЕНИЯ
   ========================= */

.nox2-section,
.nox3-final,
.nxf-footer {
  animation: noxenSectionIn .9s cubic-bezier(.2,.9,.2,1) both;
}

.nox2-section { animation-delay: .05s; }
.nox3-final  { animation-delay: .08s; }
.nxf-footer  { animation-delay: .1s; }

/* =========================
   ТИЛЬДА — НЕ ЛЕЗЬ
   ========================= */

a,
a:hover,
a:focus,
a:visited,
button,
button:hover,
button:focus {
  text-decoration: none !important;
}

button,
a,
.nx-btn,
.nx-floating-btn,
.nox3-btn,
.nxf-btn {
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* =========================
   KEYFRAMES
   ========================= */

@keyframes noxenAmbientShift {
  0%, 100% {
    opacity: 1;
    transform: scale(1) translate3d(0,0,0);
  }
  50% {
    opacity: 1;
    transform: scale(1.03) translate3d(0,-6px,0);
  }
}

@keyframes noxenRingPulse {
  0%, 100% {
    opacity: 0.34;
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    opacity: 0.68;
    transform: translate(-50%, -50%) scale(1.018);
  }
}

@keyframes noxenDotPulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 14px rgba(143,229,255,0.45);
  }
  50% {
    transform: scale(1.18);
    box-shadow: 0 0 20px rgba(143,229,255,0.72);
  }
}

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

@keyframes noxenSectionIn {
  from {
    opacity: 0;
    transform: translateY(16px);
    filter: blur(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

/* =========================
   АДАПТИВ
   ========================= */

@media (max-width: 1199px) {
  .nx-hero {
    min-height: auto !important;
    padding-bottom: 44px !important;
  }

  .nox2-section {
    margin-top: -34px !important;
    padding-top: 56px !important;
  }

  .nox3-final {
    margin-top: -18px !important;
    padding-top: 72px !important;
  }

  .nxf-footer {
    margin-top: -14px !important;
    padding-top: 56px !important;
  }

  .nx-panel:hover,
  .nox2-card:hover,
  .nox3-card:hover,
  .nxf-shell:hover,
  .nxf-contact-card:hover {
    transform: translateY(-2px);
  }

  .nx-btn:hover,
  .nx-floating-btn:hover,
  .nox3-btn:hover,
  .nxf-btn:hover {
    transform: translateY(-2px) scale(1.005);
  }
}

@media (max-width: 767px) {
  html,
  body {
    background-attachment: scroll !important;
  }

  body::before,
  body::after {
    opacity: 0.75;
  }

  .nx-hero {
    padding-bottom: 34px !important;
  }

  .nox2-section {
    margin-top: -18px !important;
    padding-top: 42px !important;
    padding-bottom: 70px !important;
  }

  .nox3-final {
    margin-top: -10px !important;
    padding-top: 58px !important;
    padding-bottom: 74px !important;
  }

  .nxf-footer {
    margin-top: -8px !important;
    padding-top: 42px !important;
  }

  .nx-btn,
  .nx-floating-btn,
  .nox3-btn,
  .nxf-btn,
  .nx-btn *,
  .nx-floating-btn *,
  .nox3-btn *,
  .nxf-btn * {
    font-size: 14px !important;
  }

  .nx-btn:hover,
  .nx-floating-btn:hover,
  .nox3-btn:hover,
  .nxf-btn:hover,
  .nx-panel:hover,
  .nox2-card:hover,
  .nox3-card:hover,
  .nxf-shell:hover,
  .nxf-contact-card:hover,
  .nx-benefit:hover,
  .nox2-chip:hover,
  .nox3-benefit:hover,
  .nx-mini-box:hover,
  .nox3-mini-box:hover {
    transform: none;
  }

  .nx-floating-menu.is-visible .nx-floating-menu-inner {
    animation: none;
  }
}

/* =========================
   FIX: УБИРАЕМ ПЕРЕГРУЗ СВЕЧЕНИЯ
   ========================= */

/* УБИРАЕМ ЛИШНИЙ ГЛОБАЛЬНЫЙ ГЛОУ */
body::before {
  opacity: 0.45 !important;
  filter: blur(28px) !important;
}

/* УБИРАЕМ ВТОРОЙ СЛОЙ СВЕЧЕНИЯ У WRAP */
.nx-wrap::after,
.nox2-wrap::after,
.nox3-wrap::after,
.nxf-wrap::after {
  display: none !important;
}

/* УБИРАЕМ СВЕТ С КАРТОЧЕК (главный виновник грязи) */
.nx-panel::after,
.nox2-card::after,
.nox3-card::after,
.nxf-shell::after,
.nxf-contact-card::after {
  display: none !important;
}

/* ОСЛАБЛЯЕМ ХОВЕР СВЕТ */
.nx-panel:hover,
.nox2-card:hover,
.nox3-card:hover,
.nxf-shell:hover,
.nxf-contact-card:hover {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 18px 40px rgba(0,0,0,0.26) !important;
}

/* ОСЛАБЛЯЕМ КНОПКИ (убираем лишний glow) */
.nx-btn-primary:hover,
.nx-floating-btn-primary:hover,
.nox3-btn-primary:hover,
.nxf-btn-primary:hover {
  box-shadow:
    0 18px 36px rgba(70,126,255,0.22),
    inset 0 1px 0 rgba(255,255,255,0.16) !important;
}

/* УБИРАЕМ ЛИШНИЙ СВЕТ В HERO */
.nx-hero::after {
  opacity: 0.6 !important;
  filter: blur(40px) !important;
}

/* УМЕНЬШАЕМ ЯДРО (оно тоже пересвечивает) */
.nx-core,
.nox3-core {
  box-shadow:
    0 0 60px rgba(93,177,255,0.22),
    0 0 100px rgba(145,105,255,0.12) !important;
}