/* AlphaVPN v4 — Private Signal art direction */
:root {
  --bg: #050507;
  --panel: #0b0b10;
  --panel-raised: #111017;
  --line: rgba(255, 255, 255, .09);
  --line-strong: rgba(255, 255, 255, .16);
  --text: #f5f3f7;
  --muted: #bbb6c1;
  --muted-2: #96909d;
  --gold: #ff9838;
  --gold-light: #ffd07a;
  --gold-wash: rgba(255, 152, 56, .1);
  --violet: #8e5bff;
  --pink: #ea39b8;
  --brand-gradient: linear-gradient(112deg, #8e5bff 4%, #ea39b8 50%, #ff9a3d 96%);
  --brand-loop: linear-gradient(90deg, #8e5bff 0%, #ea39b8 25%, #ff9a3d 50%, #ea39b8 75%, #8e5bff 100%);
}

html { background: var(--bg); }
body {
  background: var(--bg);
  font-family: Onest, var(--font-geist-sans, Inter), Inter, Arial, sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

::selection { background: rgba(234, 57, 184, .34); color: #fff; }
:focus-visible { outline: 2px solid #d592ff; outline-offset: 4px; }
[id] { scroll-margin-top: 96px; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  z-index: 10001;
  inset: 14px auto auto 14px;
  padding: 12px 18px;
  border-radius: 999px;
  color: #08070a;
  background: #f5f3f7;
  font-size: 13px;
  font-weight: 750;
  transform: translateY(-180%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }

.site-shell {
  background:
    radial-gradient(circle at 78% 6%, rgba(142, 91, 255, .055), transparent 27%),
    radial-gradient(circle at 18% 31%, rgba(234, 57, 184, .025), transparent 24%),
    var(--bg);
}
.site-shell::before {
  opacity: .12;
  background-image:
    radial-gradient(rgba(255,255,255,.2) .55px, transparent .55px),
    linear-gradient(115deg, transparent 0 46%, rgba(255,255,255,.02) 50%, transparent 54%);
  background-size: 17px 17px, 100% 100%;
  -webkit-mask: linear-gradient(to bottom,#000 0,transparent 64%);
  mask: linear-gradient(to bottom,#000 0,transparent 64%);
}
.site-shell::after { opacity: .05; filter: blur(28px); }
.site-shell.pointer-active::after { opacity: .17; }
.ambient { opacity: .3; filter: blur(34px); }

/* A short one-shot brand reveal, not a loading screen. */
.intro-sequence {
  background: #000;
  animation: introCurtain 2.28s cubic-bezier(.77,0,.18,1) forwards;
}
.intro-grid,.intro-scan,.intro-counter { display: none; }
.intro-sequence::before,.intro-sequence::after {
  width: 52vw;
  height: 1px;
  opacity: 0;
  animation: privateSignalLine 2.28s cubic-bezier(.16,1,.3,1) forwards;
}
.intro-flash {
  width: min(600px,80vw);
  opacity: 0;
  filter: blur(26px);
  animation: privateSignalGlow 2.28s ease forwards;
}
.intro-mark {
  width: min(250px,48vw);
  opacity: 0;
  animation: privateSignalMark 2.28s cubic-bezier(.16,1,.3,1) forwards;
}
.intro-mark::before { inset: 4%; border-color: rgba(255,255,255,.13); animation-duration: 12s; }
.intro-mark::after { inset: 18% -7%; border-color: rgba(234,57,184,.12); animation-duration: 18s; }
.intro-mark-glow { opacity: .24; filter: blur(56px); animation: none; }
.intro-wordmark {
  margin-top: -20px;
  font-size: clamp(36px,5vw,58px);
  animation: privateSignalWord 2.28s cubic-bezier(.16,1,.3,1) forwards;
}
.intro-wordmark em { animation-duration: 5.5s; }
.intro-powered { margin-top: 13px; animation: privateSignalPowered 2.28s ease forwards; }
.intro-powered span { font-size: 7px; color: #77727d; }

@keyframes introCurtain {
  0%,78% { opacity: 1; visibility: visible; clip-path: inset(0); }
  96% { opacity: 1; clip-path: inset(0 0 0 0); }
  100% { opacity: 0; visibility: hidden; clip-path: inset(0 0 100% 0); }
}
@keyframes privateSignalLine {
  0%,10% { opacity: 0; transform: scaleX(0); }
  22% { opacity: 1; transform: scaleX(1); }
  60% { opacity: .22; transform: scaleX(1); }
  82%,100% { opacity: 0; transform: scaleX(1); }
}
@keyframes privateSignalGlow {
  0%,14% { opacity: 0; transform: scale(.25); }
  30% { opacity: .55; transform: scale(.86); }
  70% { opacity: .28; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.25); }
}
@keyframes privateSignalMark {
  0%,19% { opacity: 0; transform: scale(.86); filter: blur(12px) brightness(1.6); }
  38%,74% { opacity: 1; transform: scale(1); filter: blur(0) brightness(1); }
  100% { opacity: 0; transform: scale(1.035) translateY(-10px); filter: blur(2px); }
}
@keyframes privateSignalWord {
  0%,37% { opacity: 0; transform: translateY(12px); }
  51%,75% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-9px); }
}
@keyframes privateSignalPowered {
  0%,49% { opacity: 0; transform: translateY(7px); }
  61%,76% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-6px); }
}

/* Navigation */
.site-header {
  width: min(1320px,calc(100% - 48px));
  height: 84px;
  padding: 0 4px;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.075);
  background: linear-gradient(to bottom,rgba(5,5,7,.9),rgba(5,5,7,.66));
  backdrop-filter: blur(22px) saturate(1.15);
  -webkit-backdrop-filter: blur(22px) saturate(1.15);
  animation-delay: 1.42s;
}
.site-header::after { display: none; }
.brand { gap: 10px; }
.brand-logo-mini { width: 36px; height: 36px; }
.brand-logo-mini::before,.brand-logo-mini::after { display: none; }
.brand-logo-mini img {
  width: 100%; height: 100%; display: block; position: relative; z-index: 2;
  object-fit: contain;
  filter: drop-shadow(0 0 12px rgba(234,57,184,.22));
}
.brand-word { font-size: 20px; letter-spacing: -.028em; }
.brand-word em { animation-duration: 7s; }
.desktop-nav { gap: 42px; font-size: 12px; }
.desktop-nav a { position: relative; }
.desktop-nav a::after {
  content: '';
  position: absolute;
  left: 0; right: 100%; bottom: -10px;
  height: 1px;
  background: var(--brand-gradient);
  transition: right .3s cubic-bezier(.16,1,.3,1);
}
.desktop-nav a:hover::after { right: 0; }
.account-link {
  min-height: 42px;
  border-color: rgba(255,255,255,.15);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
}
.language-switch { background: #0a090d; }
.language-switch a {
  min-width: 35px; height: 29px; padding: 0 9px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  color: var(--muted-2);
  font-size: 11px; font-weight: 700;
}
.language-switch a.active { background: var(--text); color: #0a0a08; }

/* Hero — copy first, brand object second. */
.hero {
  width: min(1320px,calc(100% - 48px));
  min-height: min(840px,calc(100svh - 84px));
  grid-template-columns: 1.1fr .9fr;
  grid-template-areas: 'copy visual';
  gap: 24px;
  padding: 62px 0 70px;
  overflow: visible;
}
.hero::before {
  content: 'PRIVATE SIGNAL';
  left: auto;
  right: -2%;
  top: 49%;
  translate: 0 -50%;
  color: rgba(255,255,255,.012);
  font-size: clamp(88px,12vw,178px);
  letter-spacing: -.075em;
  writing-mode: vertical-rl;
  animation: none;
}
.hero::after {
  content: '';
  position: absolute;
  left: -10vw;
  right: -10vw;
  top: -44px;
  bottom: -28px;
  width: auto;
  height: auto;
  z-index: -4;
  translate: none;
  opacity: .68;
  background:
    linear-gradient(90deg,#050507 0%,rgba(5,5,7,.98) 18%,rgba(5,5,7,.9) 36%,rgba(5,5,7,.42) 59%,rgba(5,5,7,.2) 100%),
    linear-gradient(to bottom,#050507 0%,transparent 17%,transparent 74%,#050507 100%),
    url('assets/hero-network-v2.jpg') center right / cover no-repeat;
  -webkit-mask-image: linear-gradient(to bottom,transparent,#000 13%,#000 82%,transparent);
  mask-image: linear-gradient(to bottom,transparent,#000 13%,#000 82%,transparent);
  pointer-events: none;
}
.hero-copy { max-width: 730px; z-index: 5; }
.eyebrow {
  margin-bottom: 28px;
  color: #ffab58;
  font-size: 10px;
  letter-spacing: .18em;
}
.eyebrow span { width: 38px; background: var(--brand-gradient); box-shadow: none; }
.hero h1 {
  max-width: 760px;
  font-size: clamp(58px,6vw,88px);
  line-height: .98;
  letter-spacing: -.038em;
  font-weight: 610;
  text-wrap: balance;
}
.hero h1 strong {
  width: auto;
  color: var(--text);
  background: none;
  font-weight: 610;
  animation: none;
  position: relative;
}
.hero h1 strong::after {
  content: '';
  width: min(430px,72%);
  height: 2px;
  position: absolute;
  left: 0;
  bottom: -16px;
  background: linear-gradient(90deg,#8e5bff,#ea39b8,#ff9a3d,transparent);
  box-shadow: 0 0 18px rgba(234,57,184,.34);
  transform-origin: left;
  animation: signalUnderline 1.1s cubic-bezier(.16,1,.3,1) 1.65s both;
}
.site-shell[dir='rtl'] .hero h1 strong::after { left: auto; right: 0; transform-origin: right; }
@keyframes signalUnderline { from { transform: scaleX(0); opacity: 0; } }
.hero-lead {
  max-width: 630px;
  margin-top: 38px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.65;
}
.hero-actions { margin-top: 32px; }
.primary-button,.secondary-button {
  min-height: 54px;
  border-radius: 999px;
  padding: 0 24px;
  gap: 28px;
}
.primary-button {
  color: #08070a;
  background: #f5f3f7;
  box-shadow: 0 16px 52px rgba(0,0,0,.32);
  animation: none;
}
.primary-button::before { background: linear-gradient(90deg,transparent,rgba(142,91,255,.26),transparent); }
.secondary-button { background: rgba(8,7,10,.58); }
.hero-note { color: #8f8a96; }
.hero-note span { color: #7ed69b; }
.hero-copy > * { animation: privateRise .72s cubic-bezier(.16,1,.3,1) backwards; }
.hero-copy > *:nth-child(1) { animation-delay: 1.32s; }
.hero-copy > *:nth-child(2) { animation-delay: 1.40s; }
.hero-copy > *:nth-child(3) { animation-delay: 1.49s; }
.hero-copy > *:nth-child(4) { animation-delay: 1.58s; }
.hero-copy > *:nth-child(5) { animation-delay: 1.67s; }
@keyframes privateRise { from { opacity:0; transform:translateY(18px); clip-path:inset(0 0 38%); } }

.hero-visual { min-height: 560px; overflow: visible; }
.hero-visual::before { width: 440px; height: 440px; opacity: .5; }
.signal-field { opacity: .2; -webkit-mask-image: radial-gradient(circle,#000,transparent 68%); mask-image: radial-gradient(circle,#000,transparent 68%); }
.logo-stage {
  width: min(470px,100%);
  animation: privateStage .95s cubic-bezier(.16,1,.3,1) 1.28s backwards;
}
@keyframes privateStage { from { opacity:0; transform:translateY(18px) scale(.96); filter:blur(8px); } }
.logo-stage::before { opacity: .52; animation-duration: 24s; }
.logo-stage::after { opacity: .17; animation-duration: 15s; }
.logo-tilt { width: 72%; height: 72%; }
.logo-float { animation-duration: 8s; }
.hero-logo-image {
  filter: drop-shadow(0 38px 48px rgba(0,0,0,.62)) drop-shadow(0 0 18px rgba(234,57,184,.18));
}
.glow-a,.glow-b { opacity: .45; animation-duration: 9s; }
.energy-burst,.data-stream,.status-pill-brand,.protocol-chip-brand { display: none; }
.brand-orbit { opacity: .4; }
.brand-orbit-a { animation-duration: 24s; }
.brand-orbit-b { animation-duration: 30s; }
.brand-orbit-c { display: none; }
.brand-signature { bottom: 5%; }
.brand-signature strong { font-size: clamp(24px,2.5vw,34px); }
.brand-signature strong span { animation-duration: 7s; }
.powered-lockup small { color: #8e8994; }
.hero-scroll-cue { opacity: .55; }

/* Persian hero: keep the copy on a calm field and the planet behind the emblem. */
.site-shell[dir='rtl'] .hero {
  grid-template-columns: .88fr 1.12fr;
  gap: 54px;
}
.site-shell[dir='rtl'] .hero::after {
  left: -10vw;
  right: -10vw;
  opacity: .68;
  background:
    linear-gradient(90deg,#050507 0%,#050507 28%,rgba(5,5,7,.96) 48%,rgba(5,5,7,.48) 76%,rgba(5,5,7,.16) 100%),
    linear-gradient(to bottom,#050507 0%,transparent 17%,transparent 74%,#050507 100%),
    url('assets/hero-network-v2.jpg') center right / cover no-repeat;
  transform: scaleX(-1);
  transform-origin: center;
}
.site-shell[dir='rtl'] .hero-copy {
  max-width: 680px;
}
.site-shell[dir='rtl'] .hero h1 {
  max-width: 680px;
  font-size: clamp(52px,5vw,72px);
  line-height: 1.14;
  letter-spacing: -.022em;
  text-wrap: pretty;
}
.site-shell[dir='rtl'] .hero-lead {
  max-width: 610px;
  font-size: 16px;
  line-height: 1.9;
}
.site-shell[dir='rtl'] .logo-stage { width: min(430px,100%); }

.proof-strip {
  width: min(1320px,calc(100% - 48px));
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.018);
  overflow: hidden;
}
.proof-strip div { min-height: 94px; padding: 0 34px; }
.proof-strip strong { color: #f3eff7; font-size: 28px; font-weight: 600; }
.proof-strip span { color: var(--muted-2); font-size: 11px; }
.velocity-band { display: none; }

/* Editorial section rhythm */
.content-section { width: min(1240px,calc(100% - 48px)); padding: 144px 0; }
.content-section + .content-section { border-top-color: rgba(255,255,255,.07); }
.section-kicker { color: #ffac5d; font-size: 10px; letter-spacing: .18em; }
.section-heading h2 { font-size: clamp(42px,4.6vw,62px); font-weight: 600; letter-spacing: -.056em; }
.section-heading > p:last-child { color: var(--muted); }

/* Outcomes are rows, not a repeated card template. */
.feature-grid { grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--line); }
.feature-card {
  min-height: 176px;
  padding: 24px 8px;
  display: grid;
  grid-template-columns: 104px minmax(240px,.8fr) minmax(300px,1fr);
  align-items: center;
  gap: 26px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.feature-card::before { background: linear-gradient(90deg,rgba(142,91,255,.07),rgba(234,57,184,.035),transparent 70%); }
.feature-card::after { display: none; }
.feature-card:hover { transform: translateX(8px); background: transparent; }
.site-shell[dir='rtl'] .feature-card:hover { transform: translateX(-8px); }
.feature-number { display: none; }
.feature-icon {
  --icon-accent: #a875ff;
  width: 68px;
  height: 68px;
  margin: 0 0 0 12px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb,var(--icon-accent) 46%,transparent);
  border-radius: 18px;
  color: #f8f5fb;
  background:
    radial-gradient(circle at 72% 22%,color-mix(in srgb,var(--icon-accent) 20%,transparent),transparent 48%),
    #111016;
  box-shadow: inset 0 1px rgba(255,255,255,.055),0 18px 42px rgba(0,0,0,.2);
  transform: none;
  transform-origin: center;
}
.site-shell[dir='rtl'] .feature-icon { margin: 0 12px 0 0; }
.feature-card:nth-child(2) .feature-icon { --icon-accent: #ec4bb7; }
.feature-card:nth-child(3) .feature-icon { --icon-accent: #ff9d48; }
.feature-icon svg {
  width: 31px;
  height: 31px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.feature-card:hover .feature-icon {
  border-color: color-mix(in srgb,var(--icon-accent) 75%,transparent);
  filter: drop-shadow(0 0 18px color-mix(in srgb,var(--icon-accent) 24%,transparent));
  transform: translateY(-2px);
}
.feature-card h3 { margin: 0; font-size: 22px; font-weight: 580; }
.feature-card p { max-width: 480px; font-size: 14px; }

/* Signature signal narrative */
.signal-story {
  width: min(1320px,calc(100% - 48px));
  padding-inline: 54px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background:
    radial-gradient(circle at 0 0,rgba(142,91,255,.085),transparent 31%),
    radial-gradient(circle at 100% 100%,rgba(255,154,61,.065),transparent 31%),
    #08080c;
  overflow: hidden;
}
.signal-story-heading { max-width: 810px; }
.signal-story-track { margin-top: 70px; display: grid; grid-template-columns: repeat(3,1fr); position: relative; }
.signal-story-track::before {
  content: '';
  height: 1px;
  position: absolute;
  left: 8%; right: 8%; top: 38px;
  background: linear-gradient(90deg,transparent,#8e5bff,#ea39b8,#ff9a3d,transparent);
  box-shadow: 0 0 20px rgba(234,57,184,.28);
}
.signal-story-track article { min-height: 260px; padding: 0 30px; position: relative; }
.signal-story-track article > span {
  width: 76px; height: 76px;
  display: grid; place-items: center;
  border: 1px solid rgba(168,117,255,.5);
  border-radius: 22px;
  background:
    radial-gradient(circle at 70% 22%,rgba(168,117,255,.18),transparent 46%),
    #0f0e14;
  color: #f7f3fa;
  box-shadow: inset 0 1px rgba(255,255,255,.06),0 18px 40px rgba(0,0,0,.24),0 0 28px rgba(142,91,255,.08);
  position: relative; z-index: 2;
}
.signal-node svg {
  width: 31px;
  height: 31px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.signal-story-track article:nth-child(2) > span { border-color: rgba(236,75,183,.55); background: radial-gradient(circle at 70% 22%,rgba(236,75,183,.19),transparent 46%),#0f0e14; }
.signal-story-track article:nth-child(3) > span { border-color: rgba(255,157,72,.55); background: radial-gradient(circle at 70% 22%,rgba(255,157,72,.19),transparent 46%),#0f0e14; }
.signal-story-track article > div { margin-top: 30px; }
.signal-story-track small { color: var(--muted-2); font-size: 9px; font-weight: 750; letter-spacing: .16em; }
.signal-story-track h3 { margin: 13px 0 12px; font-size: 20px; letter-spacing: -.03em; }
.signal-story-track p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }

/* Evidence and map */
.protocol-table-wrap { border-radius: 18px; background: #09090d; box-shadow: none; }
.comparison-table .alpha-column { background: rgba(142,91,255,.08); animation: none; }
.comparison-table thead .alpha-column::before { box-shadow: none; }
.protocol-table .alpha-column {
  position: relative;
  border-inline-color: rgba(234,57,184,.32);
  background: linear-gradient(180deg,rgba(142,91,255,.18),rgba(234,57,184,.075) 58%,rgba(255,154,61,.045));
  box-shadow: inset 1px 0 rgba(234,57,184,.22),inset -1px 0 rgba(234,57,184,.22);
}
.protocol-table thead .alpha-column {
  padding-top: 16px;
  color: #fff;
  background: linear-gradient(145deg,rgba(142,91,255,.28),rgba(234,57,184,.14));
}
.protocol-table thead .alpha-column::before {
  height: 3px;
  background: var(--brand-gradient);
  box-shadow: 0 0 20px rgba(234,57,184,.38);
}
.protocol-table thead .alpha-column > span { display: block; margin-top: 9px; font-size: 12px; letter-spacing: .045em; }
.protocol-table .protocol-pick {
  width: max-content;
  margin: 0;
  padding: 5px 8px;
  display: inline-flex;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  color: #f8eefa;
  background: rgba(255,255,255,.075);
  font-size: 7px;
  line-height: 1;
  letter-spacing: .09em;
}
.rating-table thead th:first-child { width: 31%; }
.rating-table tbody th { color: #d2ced8; font-size: 11px; }
.rating-table tbody tr { transition: background .3s ease; }
.rating-table tbody tr:hover { background: rgba(255,255,255,.018); }
.protocol-rating {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  direction: ltr;
}
.rating-stars {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  color: rgba(255,255,255,.12);
  font-size: 13px;
  line-height: 1;
  letter-spacing: .08em;
}
.rating-stars::before { content: '★★★★★'; }
.rating-stars::after {
  position: absolute;
  inset: 0;
  overflow: hidden;
  color: #c7bdde;
  white-space: nowrap;
}
.score-1 .rating-stars::after { content: '★'; }
.score-2 .rating-stars::after { content: '★★'; }
.score-3 .rating-stars::after { content: '★★★'; }
.score-4 .rating-stars::after { content: '★★★★'; }
.score-5 .rating-stars::after { content: '★★★★★'; }
.protocol-rating > b { color: #f0edf4; font-size: 11px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rating-table .alpha-column .rating-stars::after {
  color: transparent;
  background: var(--brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
}
.rating-table tbody td:nth-child(3) .rating-stars::after { color: #c7a9ff; }
.rating-table tbody td:nth-child(4) .rating-stars::after { color: #ff9d48; }
.protocol-table + .comparison-note { color: #aaa3b0; background: linear-gradient(90deg,rgba(142,91,255,.075),rgba(234,57,184,.035),transparent); }
.comparison-table th,.comparison-table td { border-color: rgba(255,255,255,.075); }
.network-section { gap: 54px; }
.server-row { background: rgba(255,255,255,.015); }
.server-row > b { color: var(--muted-2); }
.globe-scene { min-height: 580px; }
.network-globe { width: min(600px,54vw); animation-duration: 10s; filter: drop-shadow(0 42px 64px rgba(0,0,0,.68)) saturate(.88) brightness(.9); }
.globe-aura { opacity: .24; filter: blur(72px); animation-duration: 30s; }
.globe-orbit { opacity: .48; animation-duration: 20s; }
.geo-chip { background: rgba(7,7,10,.76); box-shadow: none; }
.service-compare-section { padding-top: 122px; }
.compare-heading { margin-bottom: 48px; }

/* Conversion surface */
.pricing-section { padding-top: 156px; }
.pricing-layout { gap: 14px; }
.plan-picker,.checkout-card { border-radius: 24px; background: #09090d; }
.device-options button,.period-options button { background: #0d0d12; }
.device-options button:hover,.device-options button.active,.period-options button:hover,.period-options button.active {
  border-color: rgba(234,57,184,.42);
  background: linear-gradient(145deg,rgba(142,91,255,.11),rgba(234,57,184,.06),rgba(255,154,61,.035));
}
.device-options button > b,.period-options b,.checkout-plan b { color: #f4eff8; }
.device-options button > span { color: #09070a; background: #f1edf5; }
.checkout-card {
  background:
    radial-gradient(circle at 100% 0,rgba(234,57,184,.12),transparent 36%),
    linear-gradient(145deg,#111018,#0a0a0e);
}
.checkout-head i { color: #dfb1ff; background: rgba(142,91,255,.1); }
.checkout-button { border-radius: 999px; color: #08070a; background: #f5f3f7; box-shadow: none; }
.payment-rails article { background: rgba(255,255,255,.018); }
.payment-rails article:hover { border-color: rgba(234,57,184,.24); }

.objection-promise { background: rgba(142,91,255,.065); }
.objection-promise > .promise-icon {
  width: 58px;
  height: 58px;
  border: 1px solid rgba(234,57,184,.42);
  border-radius: 17px;
  color: #f8f4fb;
  background:
    radial-gradient(circle at 72% 22%,rgba(255,154,61,.2),transparent 45%),
    linear-gradient(145deg,rgba(142,91,255,.16),rgba(234,57,184,.08));
  box-shadow: inset 0 1px rgba(255,255,255,.07),0 18px 38px rgba(0,0,0,.2);
}
.promise-icon svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.account-section {
  border-color: rgba(255,255,255,.11);
  background:
    radial-gradient(circle at 0 0,rgba(142,91,255,.1),transparent 34%),
    radial-gradient(circle at 100% 100%,rgba(255,154,61,.07),transparent 34%),
    #08080c;
}
.link-card { background: rgba(0,0,0,.26); }
.flow-connector b { color: #d0a5ef; }

footer { border-color: rgba(255,255,255,.08); }
footer > div > span { color: var(--muted-2); }

@media (max-width: 1100px) {
  .hero { grid-template-columns: 1fr .78fr; }
  .hero h1 { font-size: clamp(54px,6.8vw,76px); }
  .feature-card { grid-template-columns: 90px minmax(200px,.8fr) 1fr; }
}

@media (max-width: 1000px) {
  .hero {
    min-height: auto;
    grid-template-columns: 1fr;
    grid-template-areas: 'copy' 'visual';
    gap: 6px;
    padding-top: 64px;
  }
  .hero::after { display: block; left: -24%; right: -24%; top: 38%; bottom: -4%; opacity: .5; }
  .hero-copy { max-width: 780px; }
  .hero-visual { min-height: 430px; }
  .logo-stage { width: min(430px,74vw); }
  .feature-card { grid-template-columns: 90px minmax(220px,.8fr) 1fr; }
  .feature-card p { grid-column: 3; }
  .signal-story { padding-inline: 34px; }
  .signal-story-track article { padding-inline: 20px; }
  .site-shell[dir='rtl'] .hero {
    grid-template-columns: 1fr;
    grid-template-areas: 'copy' 'visual';
    gap: 6px;
  }
  .site-shell[dir='rtl'] .hero h1 { font-size: clamp(48px,7.3vw,66px); }
  .site-shell[dir='rtl'] .logo-stage { width: min(420px,74vw); }
}

@media (max-width: 720px) {
  .site-header,.hero,.proof-strip,.content-section,.account-section,footer { width: min(100% - 28px,1320px); }
  .site-header { height: 70px; }
  .brand-logo-mini { width: 32px; height: 32px; }
  .hero { min-height: auto; padding: 44px 0 34px; }
  .hero::before { display: none; }
  .hero::after { left: -46%; right: -45%; top: 48%; bottom: -8%; opacity: .38; }
  .eyebrow { margin-bottom: 20px; font-size: 8px; }
  .hero h1 { font-size: clamp(43px,12.2vw,59px); line-height: 1.02; letter-spacing: -.028em; }
  .hero h1 strong { margin-top: 7px; }
  .hero h1 strong::after { bottom: -11px; }
  .hero-lead { margin-top: 29px; font-size: 15px; line-height: 1.6; }
  .hero-actions { margin-top: 26px; }
  .hero-visual { min-height: 315px; margin-inline: -14px; }
  .logo-stage { width: min(330px,84vw); }
  .brand-signature { bottom: 0; }
  .brand-signature strong { font-size: 23px; }
  .powered-lockup small { font-size: 6px; letter-spacing: .2em; }
  .proof-strip { border-radius: 15px; }
  .proof-strip div { min-height: 78px; padding: 15px 18px; }
  .proof-strip strong { font-size: 23px; }
  .content-section { padding: 100px 0; }
  .section-heading h2 { font-size: clamp(36px,10vw,45px); }
  .section-heading > p:last-child { font-size: 15px; }
  .feature-grid { margin-top: 40px; }
  .feature-card {
    min-height: 0;
    padding: 28px 0;
    grid-template-columns: 72px 1fr;
    gap: 15px;
  }
  .feature-icon { width: 58px; height: 58px; margin: 0; border-radius: 16px; transform: none; }
  .site-shell[dir='rtl'] .feature-icon { margin: 0; }
  .feature-icon svg { width: 27px; height: 27px; }
  .feature-card h3 { font-size: 18px; }
  .feature-card p { grid-column: 2; padding-inline-start: 0; }
  .signal-story { padding: 76px 22px; border-radius: 22px; }
  .signal-story-track { margin-top: 52px; grid-template-columns: 1fr; gap: 36px; }
  .signal-story-track::before { width: 1px; height: auto; left: 31px; right: auto; top: 20px; bottom: 20px; }
  .signal-story-track article { min-height: 0; padding: 0; display: grid; grid-template-columns: 68px 1fr; gap: 22px; }
  .signal-story-track article > span { width: 64px; height: 64px; border-radius: 19px; }
  .signal-node svg { width: 27px; height: 27px; }
  .signal-story-track article > div { margin-top: 6px; }
  .site-shell[dir='rtl'] .signal-story-track::before { left: auto; right: 31px; }
  .site-shell[dir='rtl'] .hero h1 { font-size: clamp(40px,10.8vw,53px); line-height: 1.18; letter-spacing: -.018em; }
  .site-shell[dir='rtl'] .hero-lead { font-size: 15px; line-height: 1.85; }
  .globe-scene { min-height: 430px; }
  .network-globe { width: min(480px,104vw); }
  .geo-chip { transform: scale(.88); }
  .pricing-section { padding-top: 112px; }
  .device-options button { min-height: 132px; }
  .intro-mark { width: min(220px,48vw); }
  .intro-wordmark { font-size: 38px; }
}

@media (prefers-reduced-motion: reduce) {
  .intro-sequence { display: none !important; }
  .hero-copy > *,.logo-stage,.hero h1 strong::after { animation: none !important; opacity: 1; transform: none; clip-path: none; }
  .signal-field { display: none; }
  .logo-float,.brand-orbit,.network-globe,.globe-orbit,.globe-aura { animation: none !important; }
}
