/* AlphaVPN v5 — readability, gaming and account experience */
body {
  font-kerning: normal;
  font-variant-ligatures: common-ligatures contextual;
}

/* The old splash screen is gone, so primary content should not wait for it. */
.site-header,
.hero-copy > *,
.logo-stage {
  animation-name: none !important;
  opacity: 1;
  transform: none;
  clip-path: none;
}
.hero h1 strong::after { animation-delay: .15s; }
.history-hero-copy h1 { line-height: .97; letter-spacing: -.032em; }
.history-intro h2,
.history-tech h2 { line-height: 1.08; letter-spacing: -.026em; }
.history-step h3 { line-height: 1.14; letter-spacing: -.02em; }

p { text-wrap: pretty; }
.section-heading h2 {
  line-height: 1.08;
  letter-spacing: -.032em;
  text-wrap: balance;
}
.section-heading > p:last-child,
.feature-card p,
.signal-story-track p,
.faq-list details > p,
.account-section p {
  font-size: 15px;
}
.feature-card p,
.signal-story-track p,
.faq-list details > p { line-height: 1.72; }
.section-kicker,
.eyebrow,
.signal-story-track small,
.payment-rails small,
.checkout-head,
.picker-label { letter-spacing: .12em; }
.inline-source {
  color: #d7b7ff;
  text-decoration: underline;
  text-decoration-color: rgba(215,183,255,.38);
  text-underline-offset: 4px;
}
.inline-source:hover { color: #fff; text-decoration-color: currentColor; }

/* Factual protocol summary replaces subjective star ratings. */
.protocol-facts {
  margin-top: 54px;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #09090d;
  overflow: hidden;
}
.protocol-facts article {
  min-height: 250px;
  padding: 28px;
  border-inline-end: 1px solid var(--line);
  position: relative;
}
.protocol-facts article:last-child { border-inline-end: 0; }
.protocol-facts article::before {
  content: '';
  width: 86px;
  height: 86px;
  position: absolute;
  inset: auto -28px -28px auto;
  border-radius: 50%;
  background: radial-gradient(circle,rgba(142,91,255,.17),transparent 68%);
}
.protocol-facts article:nth-child(2)::before { background: radial-gradient(circle,rgba(234,57,184,.16),transparent 68%); }
.protocol-facts article:nth-child(3)::before { background: radial-gradient(circle,rgba(255,152,56,.15),transparent 68%); }
.protocol-facts article:nth-child(4)::before { background: radial-gradient(circle,rgba(255,255,255,.1),transparent 68%); }
.protocol-facts span {
  color: var(--muted-2);
  font: 760 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing: .12em;
}
.protocol-facts h3 {
  margin: 72px 0 14px;
  font-size: 21px;
  font-weight: 620;
  letter-spacing: -.022em;
}
.protocol-facts p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.protocol-source { margin: 18px 0 0; color: var(--muted-2); font-size: 11px; line-height: 1.65; }

/* What a VPN actually changes — and what it does not. */
.truth-section { padding-top: 122px; }
.truth-grid {
  margin-top: 54px;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 14px;
}
.truth-card {
  min-height: 330px;
  padding: 38px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0,rgba(142,91,255,.1),transparent 38%),
    #09090d;
}
.truth-card.truth-boundary { background: radial-gradient(circle at 100% 0,rgba(255,152,56,.08),transparent 38%),#09090d; }
.truth-card > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(168,117,255,.34);
  border-radius: 13px;
  color: #e7d8ff;
  background: rgba(142,91,255,.08);
}
.truth-boundary > span { border-color: rgba(255,152,56,.32); color: #ffc583; background: rgba(255,152,56,.07); }
.truth-card h3 { margin: 30px 0 20px; font-size: 25px; letter-spacing: -.025em; }
.truth-card ul { margin: 0; padding: 0; display: grid; gap: 14px; list-style: none; }
.truth-card li { padding-inline-start: 22px; color: var(--muted); font-size: 15px; line-height: 1.6; position: relative; }
.truth-card li::before { content: ''; width: 7px; height: 7px; position: absolute; inset-inline-start: 0; top: .62em; border-radius: 50%; background: #a875ff; box-shadow: 0 0 12px rgba(168,117,255,.5); }
.truth-boundary li::before { background: #ff9d48; box-shadow: 0 0 12px rgba(255,157,72,.4); }

/* Animated gaming route. */
.gaming-section {
  width: min(1320px,calc(100% - 48px));
  min-height: 680px;
  padding: 78px 72px;
  display: grid;
  grid-template-columns: minmax(0,.9fr) minmax(420px,1.1fr);
  align-items: center;
  gap: 36px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 30px;
  background:
    radial-gradient(circle at 78% 26%,rgba(142,91,255,.18),transparent 26%),
    radial-gradient(circle at 90% 78%,rgba(234,57,184,.11),transparent 30%),
    linear-gradient(145deg,#0c0b12,#07070a 68%);
  overflow: hidden;
  position: relative;
}
.gaming-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(circle at 80% 52%,#000,transparent 63%);
  mask-image: radial-gradient(circle at 80% 52%,#000,transparent 63%);
  pointer-events: none;
}
.gaming-copy { min-width: 0; max-width: 570px; position: relative; z-index: 3; }
.gaming-copy h2 { margin: 12px 0 22px; font-size: clamp(43px,4.7vw,66px); line-height: 1.02; letter-spacing: -.035em; text-wrap: balance; }
.gaming-lead { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.75; }
.gaming-points { margin-top: 34px; display: grid; gap: 16px; }
.gaming-point { display: grid; grid-template-columns: 26px 1fr; gap: 13px; align-items: start; }
.gaming-point > span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 8px; color: #eee6f7; background: rgba(142,91,255,.12); font-size: 11px; }
.gaming-point:nth-child(2) > span { background: rgba(234,57,184,.12); }
.gaming-point:nth-child(3) > span { background: rgba(255,152,56,.12); }
.gaming-point h3 { margin: 1px 0 5px; font-size: 15px; font-weight: 660; }
.gaming-point p { margin: 0; color: var(--muted-2); font-size: 13px; line-height: 1.6; }
.gaming-rule { margin: 30px 0 0; padding-top: 20px; border-top: 1px solid var(--line); color: #d9d4df; font-size: 13px; line-height: 1.6; }
.gaming-visual { min-width: 0; min-height: 560px; display: grid; place-items: center; position: relative; z-index: 2; }
.gaming-controller {
  width: min(620px,54vw);
  max-width: none;
  height: auto;
  position: relative;
  z-index: 3;
  mix-blend-mode: screen;
  filter: drop-shadow(0 44px 50px rgba(0,0,0,.7)) drop-shadow(0 0 34px rgba(142,91,255,.22));
  animation: controllerFloat 5.6s ease-in-out infinite;
}
.gaming-halo { width: 380px; height: 380px; position: absolute; border: 1px solid rgba(168,117,255,.22); border-radius: 50%; animation: gameHalo 13s linear infinite; }
.gaming-halo::before,.gaming-halo::after { content:''; position:absolute; inset: 12%; border:1px dashed rgba(234,57,184,.18); border-radius:50%; }
.gaming-halo::after { inset: 28%; border-style:solid; border-color:rgba(255,152,56,.18); }
.game-route-panel {
  width: min(480px,94%);
  padding: 16px;
  position: absolute;
  inset: auto 50% 8px auto;
  translate: 50% 0;
  z-index: 5;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(7,7,10,.82);
  backdrop-filter: blur(18px);
}
.game-route-switch { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.game-route-switch button {
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: rgba(255,255,255,.025);
  font: inherit;
  font-size: 12px;
  font-weight: 670;
  cursor: pointer;
  transition: border-color .25s ease,color .25s ease,background .25s ease,transform .25s ease;
}
.game-route-switch button:hover { transform: translateY(-2px); color:#fff; }
.game-route-switch button.active { color:#fff; border-color:rgba(234,57,184,.48); background:linear-gradient(135deg,rgba(142,91,255,.18),rgba(234,57,184,.1)); }
.game-route-status { margin: 13px 2px 1px; color: var(--muted-2); font-size: 11px; line-height: 1.45; }
.game-route-status::before { content:''; width:7px; height:7px; display:inline-block; margin-inline-end:8px; border-radius:50%; background:#79d895; box-shadow:0 0 12px rgba(121,216,149,.55); animation: routePulse 1.8s ease-in-out infinite; }
@keyframes controllerFloat { 50% { transform: translateY(-16px) rotate(1.4deg); } }
@keyframes gameHalo { to { transform: rotate(360deg); } }
@keyframes routePulse { 50% { opacity:.35; transform:scale(.72); } }

/* Account entry and sign-in dialog. */
.account-section { align-items: center; }
.account-copy .primary-button { margin-top: 28px; }
.link-card { min-height: 126px; }
.link-card > i { font-size: 8px; letter-spacing: .08em; }
.auth-dialog {
  width: min(680px,calc(100% - 28px));
  max-height: min(760px,calc(100svh - 28px));
  margin: auto;
  padding: 0;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 28px;
  color: var(--text);
  background:
    radial-gradient(circle at 100% 0,rgba(142,91,255,.14),transparent 37%),
    #0a0a0f;
  box-shadow: 0 36px 120px rgba(0,0,0,.72);
  overflow: auto;
}
.auth-dialog::backdrop { background: rgba(0,0,0,.76); backdrop-filter: blur(10px); }
.auth-modal-inner { padding: 34px; position: relative; }
.auth-close {
  width: 40px; height: 40px; position: absolute; inset: 20px 20px auto auto;
  border: 1px solid var(--line); border-radius: 50%; color: #fff; background: rgba(255,255,255,.03); font-size: 21px; cursor: pointer;
}
[dir='rtl'] .auth-dialog .auth-close { inset: 20px auto auto 20px; }
.auth-eyebrow { margin: 0 48px 8px 0; color:#ffac5d; font-size:9px; font-weight:760; letter-spacing:.12em; }
.auth-dialog h2 { margin: 0; font-size: clamp(30px,5vw,43px); line-height:1.08; letter-spacing:-.03em; }
.auth-lead { margin: 14px 0 0; color:var(--muted); font-size:14px; line-height:1.65; }
.auth-grid { margin-top: 30px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.auth-card { padding:22px; border:1px solid var(--line); border-radius:19px; background:rgba(255,255,255,.022); }
.auth-card h3 { margin:0 0 8px; font-size:17px; }
.auth-card p { min-height: 66px; margin:0 0 18px; color:var(--muted-2); font-size:12px; line-height:1.55; }
.auth-email-form { display:grid; gap:10px; }
.auth-email-form label { color:var(--muted); font-size:11px; }
.auth-email-row { display:grid; grid-template-columns:1fr auto; gap:8px; }
.auth-email-row input,.auth-code-row input {
  min-width:0; min-height:46px; padding:0 13px; border:1px solid var(--line-strong); border-radius:12px; color:#fff; background:#07070a; font:inherit; font-size:13px;
}
.auth-email-row button,.auth-code-row button,.auth-telegram-button {
  min-height:46px; padding:0 16px; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:12px; color:#09070b; background:#f4f1f7; font:inherit; font-size:12px; font-weight:730; cursor:pointer;
}
.auth-email-row button:disabled { color:var(--muted-2); background:#25232a; cursor:not-allowed; }
.auth-code-row { display:none; grid-template-columns:1fr auto; gap:8px; }
.auth-code-row.visible { display:grid; }
.auth-telegram-button { width:100%; color:#fff; background:linear-gradient(135deg,#794eff,#d634aa); }
.auth-feedback { min-height:18px; margin:10px 0 0; color:#d3ccd9; font-size:11px; line-height:1.45; }
.auth-feedback[data-state='error'] { color:#ffb58d; }
.auth-trial {
  margin-top: 12px; padding: 18px 20px; display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid rgba(255,152,56,.22); border-radius:17px; background:rgba(255,152,56,.055);
}
.auth-trial div { display:grid; gap:4px; }
.auth-trial strong { font-size:13px; }
.auth-trial small { color:var(--muted-2); font-size:11px; line-height:1.45; }
.auth-trial a { min-height:42px; padding:0 16px; display:inline-flex; align-items:center; border-radius:999px; color:#0a0807; background:#ffb66c; font-size:11px; font-weight:760; white-space:nowrap; }
.auth-footnote { margin:16px 2px 0; color:var(--muted-2); font-size:10px; line-height:1.55; }

@media (max-width: 1000px) {
  .protocol-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .protocol-facts article:nth-child(2) { border-inline-end:0; }
  .protocol-facts article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .gaming-section { grid-template-columns:minmax(0,1fr); padding:64px 44px 44px; }
  .gaming-copy { max-width:760px; }
  .gaming-visual { min-height:520px; }
  .gaming-controller { width:min(660px,78vw); }
}

@media (max-width: 720px) {
  .section-heading h2 { letter-spacing:-.024em; }
  .history-hero-copy h1 { line-height:1.02; letter-spacing:-.022em; }
  .section-kicker,.eyebrow { font-size:9px; }
  .protocol-facts { grid-template-columns:1fr; border-radius:20px; }
  .protocol-facts article { min-height:210px; border-inline-end:0; border-bottom:1px solid var(--line); }
  .protocol-facts article:last-child { border-bottom:0; }
  .protocol-facts h3 { margin-top:52px; }
  .truth-grid { grid-template-columns:1fr; }
  .truth-card { min-height:0; padding:29px 24px; border-radius:20px; }
  .gaming-section { width:min(100% - 28px,1320px); min-height:0; padding:60px 22px 28px; border-radius:23px; }
  .gaming-copy h2 { font-size:clamp(39px,11vw,52px); letter-spacing:-.026em; }
  .gaming-lead { font-size:15px; }
  .gaming-visual { min-height:410px; margin-inline:-16px; }
  .gaming-controller { width:min(520px,112vw); }
  .gaming-halo { width:290px; height:290px; }
  .game-route-panel { width:calc(100% - 16px); bottom:0; }
  .game-route-switch button { padding:0 7px; font-size:11px; }
  .auth-modal-inner { padding:28px 20px 22px; }
  .auth-grid { grid-template-columns:1fr; }
  .auth-card p { min-height:0; }
  .auth-email-row { grid-template-columns:1fr; }
  .auth-trial { align-items:flex-start; flex-direction:column; }
  .auth-trial a { width:100%; justify-content:center; }
}

@media (prefers-reduced-motion: reduce) {
  .gaming-controller,.gaming-halo,.game-route-status::before { animation:none !important; }
}
