/* Светлая тема UnlimVPN: чистые поверхности и сине-красные акценты. */
[data-theme="vless"] {
  --color-primary: #0d4cd3;
  --color-primary-gradient-1: #0d4cd3;
  --color-primary-gradient-2: #1261dc;
  --color-background: #ffffff;
  --color-muted-background: #f1f5fb;
  --color-ping-green: #16875a;
  --color-ping-yellow: #a86600;
  --color-ping-red: #d9364f;
  --light-text: #1f2937;
  --light-text-muted: #667085;
  --light-border: #dce5f2;
  --light-blue: #eaf2ff;
  --light-blue-strong: #dbe8ff;
  --light-red: #ee3f58;
}

html {
  scroll-behavior: smooth;
  background: #ffffff;
}

body.text-white {
  color: var(--light-text);
  background:
    radial-gradient(circle at 8% 8%, rgba(13, 76, 211, 0.06), transparent 28rem),
    #ffffff;
}

body > .fixed:first-of-type {
  border-bottom: 1px solid rgba(220, 229, 242, 0.9);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 8px 30px rgba(30, 64, 175, 0.05);
}

body > .fixed:first-of-type h1 {
  color: #0b3f9e;
}

.homepage-brand {
  gap: 10px;
  color: var(--light-text);
  font-weight: 800;
  text-decoration: none;
}

.homepage-brand span {
  line-height: 1;
}

#navbar a:not(:last-child) {
  color: #344054;
}

#navbar a:not(:last-child):hover {
  color: var(--color-primary);
}

#mobile-nav {
  background: rgba(255, 255, 255, 0.98);
  color: var(--light-text);
}

#hero {
  background:
    radial-gradient(circle at 82% 32%, rgba(13, 76, 211, 0.18), transparent 22rem),
    linear-gradient(135deg, #ffffff 0%, #f4f8ff 58%, #e9f2ff 100%);
}

#hero > img {
  display: none;
}

#tryout > img {
  opacity: 0.1;
  filter: saturate(0.4) brightness(1.65);
}

#hero h1:first-child {
  color: #0d4cd3;
}

#hero h2 {
  max-width: 760px;
  color: #475467;
  line-height: 1.55;
}

#hero .border-primary {
  border-color: #b8cffb;
  background: rgba(234, 242, 255, 0.92);
  color: #0b3f9e;
}

#hero .border-white\/10 {
  border-color: #ced9e8;
}

#hero .border-white\/10 span:first-child {
  color: #0d4cd3;
}

button.bg-gradient-to-r,
a.bg-primary,
.trial-modal__submit {
  color: #ffffff;
}

button.bg-gradient-to-r {
  box-shadow: 0 12px 28px rgba(13, 76, 211, 0.2);
}

button.bg-gradient-to-r:hover {
  box-shadow: 0 16px 34px rgba(13, 76, 211, 0.28);
}

#advantages .bg-muted-background,
#advantages .bg-primary {
  border: 1px solid var(--light-border);
  box-shadow: 0 12px 34px rgba(30, 64, 175, 0.06);
}

#advantages .bg-primary {
  background: var(--light-blue-strong);
  color: #163d7a;
}

#advantages .bg-muted-background:nth-child(3) {
  border-top: 3px solid var(--light-red);
}

#tryout {
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 50%, rgba(238, 63, 88, 0.1), transparent 20rem),
    linear-gradient(110deg, #e9f2ff 0%, #f7faff 55%, #ffffff 100%);
  color: #17305c;
}

#tryout button {
  background: linear-gradient(90deg, #0d4cd3, #1261dc);
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(13, 76, 211, 0.2);
}

#tariffs .bg-muted-background,
#tariffs .border-primary {
  border: 1px solid var(--light-border);
  background: #ffffff;
  box-shadow: 0 12px 34px rgba(30, 64, 175, 0.08);
}

#tariffs .border-primary {
  border: 2px solid #0d4cd3;
  background: #f5f8ff;
}

#tariffs .bg-black\/10 {
  background: #edf3fc;
}

#tariffs .text-red-400 {
  color: var(--light-red);
}

#servers {
  border-block: 1px solid #e1e8f2;
  background: #f4f7fb;
}

#servers .bg-white\/10 {
  border: 1px solid var(--light-border);
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(30, 64, 175, 0.05);
}

#servers .text-white\/50 {
  color: var(--light-text-muted);
}

#faq .bg-muted-background {
  border: 1px solid var(--light-border);
  background: #f7f9fc;
}

#faq a {
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}

body > div.z-50.bg-muted-background {
  border-top: 1px solid var(--light-border);
  background: #edf3fc;
}

body > div.z-50.bg-muted-background .text-\[\#8E8E8E\] {
  color: #64748b;
}

.trial-modal__backdrop {
  background: rgba(24, 39, 75, 0.46) !important;
}

.trial-modal__dialog {
  border: 1px solid var(--light-border) !important;
  background: #ffffff !important;
  color: var(--light-text) !important;
  box-shadow: 0 24px 80px rgba(24, 39, 75, 0.2) !important;
}

.trial-modal__close {
  background: #edf3fc !important;
  color: #344054 !important;
}

.trial-modal__badge {
  border-color: #adc8fb !important;
  background: #eaf2ff !important;
  color: #0b3f9e !important;
}

.trial-modal__text,
.trial-modal__note {
  color: var(--light-text-muted) !important;
}

.trial-modal__input {
  border-color: #cfd9e8 !important;
  background: #f8fafc !important;
  color: var(--light-text) !important;
}

.trial-modal__input:focus {
  border-color: #0d4cd3 !important;
  box-shadow: 0 0 0 3px rgba(13, 76, 211, 0.16) !important;
}

.trial-modal__input::placeholder {
  color: #98a2b3 !important;
}

.trial-modal__error {
  color: #c72c45 !important;
}

@media (max-width: 767px) {
  body {
    gap: 3.5rem !important;
  }

  #hero {
    min-height: 720px;
  }

  #hero > .z-10 {
    padding-inline: 20px;
  }

  #hero .z-10 > .z-10 {
    margin-top: 24px;
  }

  #advantages,
  #tariffs,
  #servers,
  #faq {
    padding-inline: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
  }
}