@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/onest-cyrillic-ext-400-700.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/onest-cyrillic-400-700.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/onest-latin-ext-400-700.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/onest-latin-400-700.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: dark;
  --bg: #05070b;
  --surface: #0a0e15;
  --surface-2: #0e1420;
  --text: #f7f9fc;
  --muted: #909bad;
  --blue: #2a86ff;
  --blue-bright: #59a4ff;
  --line: rgba(255,255,255,.11);
  --glass: rgba(14,21,33,.52);
  --glass-strong: rgba(12,18,29,.72);
  --glass-line: rgba(255,255,255,.15);
  --glass-shadow: 0 28px 90px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
  --max: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--text);
  font-family: "Onest", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }

.ambient { position: fixed; pointer-events: none; border-radius: 50%; filter: blur(100px); opacity: .2; z-index: -1; }
.ambient-one { width: 480px; height: 480px; background: #0745d4; top: 5vh; right: -260px; }
.ambient-two { width: 360px; height: 360px; background: #005dff; top: 92vh; left: -260px; opacity: .1; }

.site-header {
  position: fixed;
  z-index: 40;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  width: min(calc(100% - 32px), var(--max));
  height: 62px;
  padding: 0 12px 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--glass-line);
  border-radius: 22px;
  background: linear-gradient(120deg, rgba(255,255,255,.09), rgba(255,255,255,.018) 45%, rgba(52,130,255,.07)), rgba(7,10,15,.58);
  -webkit-backdrop-filter: blur(26px) saturate(155%);
  backdrop-filter: blur(26px) saturate(155%);
  box-shadow: 0 18px 60px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.1);
}
.brand { font-size: 21px; font-weight: 700; letter-spacing: -.025em; }
.brand span { color: var(--blue-bright); }
.desktop-nav { display: flex; align-items: center; gap: 30px; font-size: 14px; color: #b1bac8; }
.desktop-nav a { transition: color .2s ease; }
.desktop-nav a:hover { color: white; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.language-button, .menu-button {
  height: 38px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #aab4c3;
  cursor: pointer;
}
.language-button { padding: 0 12px; font-size: 13px; }
.menu-button { display: none; width: 40px; position: relative; }
.menu-button span { position: absolute; left: 11px; width: 18px; height: 1px; background: white; }
.menu-button span:first-child { top: 16px; }
.menu-button span:last-child { top: 22px; }

.button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 630;
  cursor: pointer;
  transition: transform .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--blue); box-shadow: 0 12px 36px rgba(42,134,255,.25); }
.button-primary:hover { background: #4193ff; box-shadow: 0 16px 46px rgba(42,134,255,.36); }
.button-ghost { background: rgba(255,255,255,.055); border-color: var(--line); }
.button-ghost:hover { background: rgba(255,255,255,.09); border-color: rgba(255,255,255,.2); }
.button-small { min-height: 38px; padding: 0 16px; border-radius: 11px; font-size: 13px; }
.button-full { width: 100%; }

.hero {
  position: relative;
  min-height: 100svh;
  width: min(calc(100% - 40px), var(--max));
  margin: 0 auto;
  padding: 148px 0 84px;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(380px, .98fr);
  align-items: center;
  gap: 42px;
}
.hero-copy { position: relative; z-index: 2; }
.eyebrow { margin: 0 0 24px; color: #93a2b8; font-size: 13px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.eyebrow span { display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 20px var(--blue); }
.hero h1 { margin: 0; max-width: 760px; font-size: clamp(3.6rem, 7.3vw, 7rem); line-height: .98; letter-spacing: -.042em; font-weight: 620; }
.hero h1 em { font-style: normal; color: #7e8da4; }
.hero-lead { max-width: 630px; margin: 30px 0 0; color: #a6b0c0; font-size: clamp(1.08rem, 1.5vw, 1.28rem); line-height: 1.65; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 38px; }
.hero-note { margin: 18px 0 0; color: #667286; font-size: 13px; }

.hero-stage { position: relative; min-height: 600px; display: grid; place-items: center; perspective: 900px; }
.hero-stage::after { content: ""; position: absolute; inset: 4% -5%; background: radial-gradient(circle at 70% 50%, transparent 15%, rgba(5,7,11,.13) 50%, var(--bg) 78%); pointer-events: none; }
.hero-art { position: absolute; z-index: 0; width: 135%; max-width: none; right: -20%; height: 100%; object-fit: cover; object-position: 63% center; border-radius: 40px; opacity: .9; mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 88%, transparent 100%); animation: earth-orbit 20s cubic-bezier(.45,.05,.55,.95) infinite; will-change: transform; }
.floating-card { position: absolute; z-index: 3; padding: 18px; border: 1px solid rgba(255,255,255,.18); border-radius: 22px; background: linear-gradient(145deg, rgba(255,255,255,.11), rgba(255,255,255,.018)), rgba(9,15,25,.52); -webkit-backdrop-filter: blur(22px) saturate(155%); backdrop-filter: blur(22px) saturate(155%); box-shadow: var(--glass-shadow); }
.card-coverage { top: 13%; left: 0; min-width: 165px; color: inherit; text-align: left; cursor: pointer; transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.card-coverage:hover, .card-coverage:focus-visible, .card-coverage.is-active { transform: translateY(-4px) scale(1.025); border-color: rgba(111,181,255,.48); box-shadow: 0 24px 70px rgba(0,0,0,.34), 0 0 36px rgba(42,134,255,.2), inset 0 1px 0 rgba(255,255,255,.14); outline: none; }
.card-kicker, .floating-card small { display: block; color: #8b98aa; font-size: 12px; }
.card-coverage strong { display: block; margin: 6px 0 1px; font-size: 36px; letter-spacing: -.05em; }
.coverage-hint { display: block; max-height: 0; margin-top: 0; overflow: hidden; color: #76b5ff; font-size: 10px; letter-spacing: .055em; opacity: 0; transition: max-height .3s ease, margin-top .3s ease, opacity .3s ease; }
.card-coverage:hover .coverage-hint, .card-coverage:focus-visible .coverage-hint, .card-coverage.is-active .coverage-hint { max-height: 18px; margin-top: 9px; opacity: .9; }
.card-speed { right: -2%; bottom: 18%; display: flex; align-items: center; gap: 12px; }
.card-speed strong { display: block; font-size: 14px; }
.network-dot { width: 11px; height: 11px; border-radius: 50%; background: #39d98a; box-shadow: 0 0 16px rgba(57,217,138,.65); }
.country-burst { position: absolute; z-index: 4; inset: 0; overflow: visible; pointer-events: none; }
.country-sphere {
  position: absolute;
  width: var(--sphere-size, 52px);
  height: var(--sphere-size, 52px);
  display: grid;
  place-items: center;
  border: 1px solid rgba(91,173,255,.78);
  border-radius: 50%;
  background: radial-gradient(circle at 31% 24%, rgba(255,255,255,.32), rgba(72,151,255,.13) 34%, rgba(4,17,37,.58) 68%, rgba(2,8,17,.76));
  -webkit-backdrop-filter: blur(8px) saturate(150%);
  backdrop-filter: blur(8px) saturate(150%);
  box-shadow: 0 0 0 1px rgba(126,190,255,.08), inset -7px -9px 15px rgba(0,33,78,.45), inset 5px 5px 13px rgba(255,255,255,.12), 0 0 24px rgba(35,137,255,.3);
  font-size: calc(var(--sphere-size, 52px) * .48);
  line-height: 1;
  opacity: 0;
  will-change: transform, opacity;
}
.country-sphere::after { content: ""; position: absolute; top: 10%; left: 18%; width: 38%; height: 21%; border-radius: 50%; background: rgba(255,255,255,.25); filter: blur(2px); transform: rotate(-24deg); }
.scroll-cue { position: absolute; left: 0; bottom: 30px; display: flex; gap: 11px; align-items: center; color: #647084; font-size: 12px; text-transform: uppercase; letter-spacing: .12em; }
.scroll-cue span { display: block; width: 1px; height: 34px; background: linear-gradient(var(--blue), transparent); }

.signal-strip { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; padding: 26px 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.signal-strip div { padding: 0 28px; border-right: 1px solid var(--line); }
.signal-strip div:first-child { padding-left: 0; }.signal-strip div:last-child { border-right: 0; }
.signal-strip strong, .signal-strip span { display: block; }
.signal-strip strong { font-size: 20px; letter-spacing: -.03em; }
.signal-strip span { margin-top: 5px; color: #778397; font-size: 13px; }

.section { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; padding: 144px 0; }
.section-heading { display: grid; grid-template-columns: 1fr 1.5fr; column-gap: 50px; align-items: start; }
.section-heading .eyebrow { grid-column: 1 / -1; }
.section-heading h2 { margin: 0; font-size: clamp(2.8rem, 5.2vw, 5.2rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }
.section-heading > p:last-child { max-width: 520px; margin: 10px 0 0 auto; color: #939fb1; font-size: 18px; line-height: 1.65; }

.audience-section { display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: 80px; }
.audience-copy h2 { margin: 0; font-size: clamp(2.8rem, 5vw, 5.1rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }
.audience-copy > p:not(.eyebrow) { max-width: 570px; margin-top: 28px; color: #939fb1; font-size: 18px; line-height: 1.68; }
.audience-orbit { position: relative; min-height: 570px; border: 1px solid var(--glass-line); border-radius: 50%; background: radial-gradient(circle, rgba(34,123,255,.15), transparent 35%), linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.008)); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
.audience-orbit::before, .audience-orbit::after { content: ""; position: absolute; inset: 16%; border: 1px solid rgba(83,157,255,.18); border-radius: 50%; }.audience-orbit::before { background: conic-gradient(from 20deg, transparent, rgba(79,156,255,.08), transparent 32%, rgba(255,255,255,.04), transparent 68%); animation: orbit-ring 28s linear infinite; }.audience-orbit::after { inset: 31%; border-color: rgba(255,255,255,.09); }
.audience-core { position: absolute; z-index: 2; left: 50%; top: 50%; width: 154px; height: 154px; display: grid; place-items: center; transform: translate(-50%,-50%); overflow: hidden; border: 1px solid rgba(109,182,255,.72); border-radius: 50%; background-image: radial-gradient(circle at 34% 24%, rgba(220,241,255,.24), transparent 27%), linear-gradient(120deg, rgba(7,28,61,.08), rgba(0,12,31,.3)), url("bluesim-global-connectivity-hero-v1.jpg"); background-size: auto, auto, cover; background-position: center, center, 73% 50%; box-shadow: 0 0 60px rgba(42,134,255,.28), inset -14px -18px 28px rgba(0,20,51,.55), inset 9px 8px 22px rgba(124,193,255,.13); color: #edf7ff; text-align: center; line-height: 1.25; animation: core-breathe 6s ease-in-out infinite, globe-texture-drift 18s ease-in-out infinite; }
.audience-core::before { content: ""; position: absolute; inset: 9%; border-radius: 50%; background: repeating-linear-gradient(90deg, transparent 0 19px, rgba(105,182,255,.19) 20px, rgba(105,182,255,.19) 21px), repeating-linear-gradient(0deg, transparent 0 18px, rgba(105,182,255,.14) 19px, rgba(105,182,255,.14) 20px); opacity: .9; mask-image: radial-gradient(circle, #000 0 66%, transparent 70%); animation: globe-grid-shift 12s linear infinite; }
.audience-core::after { content: ""; position: absolute; inset: 13% 29%; border: 1px solid rgba(123,197,255,.28); border-radius: 50%; box-shadow: 0 0 22px rgba(42,134,255,.18), 0 0 0 23px rgba(76,160,255,.025); }
.audience-core > span { position: relative; z-index: 2; padding: 8px 10px; border-radius: 14px; background: rgba(2,12,27,.22); text-shadow: 0 1px 12px rgba(0,0,0,.9); font-size: 13px; font-weight: 560; letter-spacing: -.01em; }
.audience-pill { --orbit-radius: 220px; position: absolute; z-index: 3; left: 50%; top: 50%; color: #b8c6d8; font-size: 13px; white-space: nowrap; animation: audience-clockwise 42s linear infinite; }
.audience-pill > span { display: block; padding: 11px 16px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(11,19,31,.64); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 12px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.08); animation: audience-highlight 12s ease-in-out infinite; }
.audience-pill-1 { --orbit-start: 0deg; --orbit-start-negative: 0deg; }.audience-pill-2 { --orbit-start: 60deg; --orbit-start-negative: -60deg; }.audience-pill-3 { --orbit-start: 120deg; --orbit-start-negative: -120deg; }.audience-pill-4 { --orbit-start: 180deg; --orbit-start-negative: -180deg; }.audience-pill-5 { --orbit-start: 240deg; --orbit-start-negative: -240deg; }.audience-pill-6 { --orbit-start: 300deg; --orbit-start-negative: -300deg; }
.audience-pill-2 > span { animation-delay: -10s; }.audience-pill-3 > span { animation-delay: -8s; }.audience-pill-4 > span { animation-delay: -6s; }.audience-pill-5 > span { animation-delay: -4s; }.audience-pill-6 > span { animation-delay: -2s; }
.audience-signal { --orbit-radius: 220px; position: absolute; z-index: 1; left: 50%; top: 50%; width: calc(var(--orbit-radius) - 76px); height: 2px; border-radius: 99px; background: linear-gradient(90deg, rgba(83,168,255,.9), rgba(83,168,255,.34) 64%, transparent); transform-origin: 0 50%; opacity: 0; filter: drop-shadow(0 0 6px rgba(60,152,255,.85)); animation: signal-clockwise 42s linear infinite, signal-pulse 12s ease-in-out infinite; }
.audience-signal::before { content: ""; position: absolute; left: -4px; top: 50%; width: 8px; height: 8px; transform: translateY(-50%); border: 1px solid rgba(120,198,255,.8); border-radius: 50%; box-shadow: 0 0 18px rgba(52,150,255,.9); }
.audience-signal::after { content: ""; position: absolute; right: -3px; top: 50%; width: 7px; height: 7px; transform: translateY(-50%); border-radius: 50%; background: #74b9ff; box-shadow: 0 0 18px #2b8cff, 0 0 34px rgba(42,140,255,.75); }
.audience-signal-1 { --orbit-start: 0deg; }.audience-signal-2 { --orbit-start: 60deg; }.audience-signal-3 { --orbit-start: 120deg; }.audience-signal-4 { --orbit-start: 180deg; }.audience-signal-5 { --orbit-start: 240deg; }.audience-signal-6 { --orbit-start: 300deg; }
.audience-signal-2 { animation-delay: 0s, -10s; }.audience-signal-3 { animation-delay: 0s, -8s; }.audience-signal-4 { animation-delay: 0s, -6s; }.audience-signal-5 { animation-delay: 0s, -4s; }.audience-signal-6 { animation-delay: 0s, -2s; }

.model-switcher { position: relative; margin-top: 72px; border: 1px solid var(--glass-line); border-radius: 34px; background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.015) 52%, rgba(42,134,255,.045)), var(--glass); -webkit-backdrop-filter: blur(28px) saturate(145%); backdrop-filter: blur(28px) saturate(145%); box-shadow: var(--glass-shadow); overflow: hidden; }
.model-tabs { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--line); }
.model-tab { position: relative; padding: 22px; border: 0; background: transparent; color: #7d8899; cursor: pointer; font-size: 15px; font-weight: 620; }
.model-tab:first-child { border-right: 1px solid var(--line); }
.model-tab { transition: color .3s ease, background .3s ease, text-shadow .3s ease; }.model-tab:hover { color: #cdd7e5; background: rgba(255,255,255,.025); }.model-tab.is-active { color: white; background: rgba(42,134,255,.06); text-shadow: 0 0 18px rgba(96,174,255,.28); }
.model-tab.is-active::after { content: ""; position: absolute; left: 25%; right: 25%; bottom: -1px; height: 2px; background: var(--blue); box-shadow: 0 0 18px var(--blue); }
.model-tab::before { content: ""; position: absolute; z-index: 2; left: 0; bottom: -1px; width: 0; height: 2px; background: linear-gradient(90deg, rgba(116,187,255,.15), #75baff); box-shadow: 0 0 16px rgba(52,148,255,.5); }.model-tab.is-counting::before { animation: model-tab-progress 7s linear forwards; }.model-switcher.is-cycle-paused .model-tab.is-counting::before { animation-play-state: paused; }
.model-panels { display: grid; }
.model-panel { grid-area: 1 / 1; min-height: 520px; padding: 62px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: center; }
.model-panel[hidden] { display: none; }
.model-panel.is-entering { animation: model-liquid-in .58s cubic-bezier(.2,.72,.2,1) both; }.model-panel.is-leaving { pointer-events: none; animation: model-liquid-out .44s ease both; }
.model-number { color: var(--blue-bright); font-size: 13px; font-weight: 700; letter-spacing: .14em; }
.model-copy h3 { margin: 16px 0 22px; font-size: clamp(2.7rem, 5vw, 4.8rem); line-height: 1.04; letter-spacing: -.04em; font-weight: 620; }
.model-copy p { color: #96a1b2; font-size: 17px; line-height: 1.65; }
.model-copy ul { margin: 28px 0 0; padding: 0; list-style: none; }
.model-copy li { padding: 13px 0 13px 26px; border-top: 1px solid rgba(255,255,255,.08); color: #c5ccd6; position: relative; }
.model-copy li::before { content: ""; position: absolute; left: 3px; top: 20px; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 14px rgba(42,134,255,.8); }
.model-visual { position: relative; min-height: 390px; display: grid; place-items: center; border-radius: 22px; overflow: hidden; background: radial-gradient(circle at 50% 44%, rgba(31,117,255,.18), transparent 50%), #080c13; }
.boarding-pass { position: relative; overflow: hidden; border: 1px solid rgba(118,185,255,.28); background: radial-gradient(circle at 85% 0%, rgba(50,143,255,.2), transparent 38%), linear-gradient(160deg, rgba(30,66,111,.96), rgba(8,22,42,.98)); box-shadow: 0 34px 80px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.11); color: white; }
.ticket-card { width: min(80%, 360px); padding: 21px; border-radius: 26px; transform: rotate(-3deg); }
.bp-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }.bp-head > strong { font-size: 19px; letter-spacing: -.035em; }.bp-head > strong span { color: #72b7ff; }.bp-head > span { padding: 7px 10px; border: 1px solid rgba(111,184,255,.3); border-radius: 999px; background: rgba(42,134,255,.12); color: #a9d3ff; font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.bp-divider { margin: 16px -21px; border-top: 1px dashed rgba(175,211,255,.28); }
.bp-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }.bp-meta > span { display: grid; gap: 4px; color: #788ba4; font-size: 7px; letter-spacing: .1em; }.bp-meta strong { color: #eaf3ff; font-size: 11px; letter-spacing: 0; }.bp-meta > span:nth-child(even) { padding-left: 16px; border-left: 1px solid rgba(255,255,255,.1); }
.bp-plan { margin-top: 17px; display: grid; gap: 5px; text-align: center; }.bp-plan small { color: #788ba4; font-size: 7px; letter-spacing: .12em; }.bp-plan strong { color: #83c0ff; font-size: 13px; }
.bp-data { margin-top: 14px; padding: 15px 13px; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid rgba(255,255,255,.09); border-radius: 17px; background: rgba(111,170,229,.09); }.bp-data > span { display: grid; gap: 5px; color: #7d90a9; font-size: 7px; letter-spacing: .1em; text-align: center; }.bp-data > span + span { border-left: 1px solid rgba(255,255,255,.12); }.bp-data strong { color: #f4f8ff; font-size: 18px; letter-spacing: -.025em; }.bp-data > span:first-child strong { color: #67dca0; }
.bp-install { margin-top: 16px; padding-top: 15px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px dashed rgba(175,211,255,.28); }.bp-install > span { color: #8dc6ff; font-size: 8px; font-weight: 700; letter-spacing: .11em; }.bp-qr { flex: 0 0 58px; width: 58px; height: 58px; display: block; border: 7px solid white; border-radius: 7px; background-color: #06101c; background-image: linear-gradient(90deg, transparent 44%, #fff 44% 56%, transparent 56%), linear-gradient(transparent 44%, #fff 44% 56%, transparent 56%), repeating-conic-gradient(#06101c 0 25%, #fff 0 50%); background-size: 17px 17px, 17px 17px, 11px 11px; box-shadow: 0 8px 24px rgba(0,0,0,.28); }
.referral-core, .referral-user { position: absolute; display: grid; place-items: center; border-radius: 50%; font-weight: 740; }
.referral-core { z-index: 3; width: 110px; height: 110px; background: var(--blue); box-shadow: 0 0 70px rgba(42,134,255,.42); animation: referral-core-receive 9s ease-in-out infinite; }
.gratitude-heart { position: absolute; z-index: 2; left: 50%; top: 50%; width: 180px; height: 180px; display: grid; place-items: center; transform: translate(-50%,-48%) scale(.5); color: rgba(123,195,255,.56); font-family: Georgia, "Times New Roman", serif; font-size: 154px; font-weight: 400; line-height: 1; text-shadow: 0 0 12px rgba(91,175,255,.52), 0 0 34px rgba(42,134,255,.28); opacity: 0; pointer-events: none; animation: gratitude-heart-wave 9s cubic-bezier(.18,.72,.22,1) infinite; will-change: transform, opacity; }
.referral-user { width: 58px; height: 58px; background: #121a27; border: 1px solid rgba(255,255,255,.15); animation: referral-client-pulse 9s ease-in-out infinite; will-change: transform; }
.user-a { top: 14%; left: 18%; }.user-b { right: 14%; top: 32%; animation-delay: 3s; }.user-c { left: 27%; bottom: 12%; animation-delay: 6s; }
.referral-line { position: absolute; height: 1px; background: linear-gradient(90deg, transparent, var(--blue), transparent); transform-origin: left; opacity: .18; animation: referral-line-pulse 9s ease-in-out infinite; }
.line-a { width: 150px; transform: rotate(35deg); left: 25%; top: 31%; }.line-b { width: 145px; transform: rotate(-12deg); left: 48%; top: 49%; animation-delay: 3s; }.line-c { width: 140px; transform: rotate(125deg); left: 47%; top: 55%; animation-delay: 6s; }
.referral-value { position: absolute; z-index: 4; left: var(--value-x); top: var(--value-y); width: 30px; height: 30px; display: grid; place-items: center; transform: translate(-50%,-50%) scale(.5); border: 1px solid rgba(179,220,255,.72); border-radius: 50%; background: linear-gradient(145deg, #5eb0ff, #1575e7); box-shadow: 0 0 22px rgba(42,134,255,.65), inset 0 1px 0 rgba(255,255,255,.35); color: white; font-size: 14px; font-weight: 700; opacity: 0; animation: referral-value-flow 9s cubic-bezier(.32,.04,.28,1) infinite; }
.value-a { --value-x: 25%; --value-y: 21%; }.value-b { --value-x: 80%; --value-y: 39%; animation-delay: 3s; }.value-c { --value-x: 34%; --value-y: 81%; animation-delay: 6s; }
.commission-pill { position: absolute; right: 8%; bottom: 12%; padding: 12px 16px; border: 1px solid rgba(72,157,255,.28); border-radius: 999px; background: rgba(13,25,44,.9); color: #8ec3ff; font-size: 13px; animation: commission-breathe 3s ease-in-out infinite; }

.language-control { position: relative; }
.language-menu { position: absolute; top: 48px; right: 0; width: 220px; padding: 8px; border: 1px solid var(--line); border-radius: 16px; background: rgba(10,14,21,.97); box-shadow: 0 24px 70px rgba(0,0,0,.48); }
.language-menu[hidden] { display: none; }
.language-menu button { width: 100%; display: flex; justify-content: space-between; padding: 11px 12px; border: 0; border-radius: 10px; background: transparent; color: #a9b3c2; cursor: pointer; text-align: left; }
.language-menu button:hover, .language-menu .is-current { background: rgba(255,255,255,.07); color: white; }
.language-menu button span { color: #68758a; font-size: 12px; }
.language-menu small { display: block; padding: 9px 12px 6px; color: #667286; line-height: 1.4; }

.experience-grid { margin-top: 72px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.experience-card { position: relative; min-height: 430px; padding: 38px; border: 1px solid var(--glass-line); border-radius: 34px; background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.014) 58%, rgba(34,117,255,.05)), var(--glass); -webkit-backdrop-filter: blur(24px) saturate(145%); backdrop-filter: blur(24px) saturate(145%); box-shadow: var(--glass-shadow); overflow: hidden; }
.experience-card-large { grid-column: 1 / -1; min-height: 570px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 60px; background: radial-gradient(circle at 80% 50%, rgba(28,113,255,.17), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012)); }
.card-label { display: inline-block; color: #79b4ff; font-size: 12px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.experience-card h3 { margin: 18px 0 16px; font-size: clamp(2rem, 3.5vw, 3.4rem); line-height: 1.08; letter-spacing: -.035em; font-weight: 620; }
.experience-card p { color: #95a1b2; font-size: 17px; line-height: 1.65; }
.experience-card > small, .experience-card .experience-copy + small { color: #6f7b8e; }
.phone-mockup { position: relative; justify-self: center; width: min(82%, 330px); aspect-ratio: .53; padding: 17px 15px 14px; overflow: hidden; border: 1px solid rgba(255,255,255,.24); border-radius: 46px; background: radial-gradient(circle at 80% 0%, rgba(42,134,255,.14), transparent 32%), linear-gradient(165deg, #0e1724, #05080e); box-shadow: 0 35px 90px rgba(0,0,0,.58), inset 0 0 0 5px #111924; transform: rotate(3deg); }
.phone-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; color: #718096; font-size: 8px; }.phone-top strong { overflow: hidden; color: #d9e2ee; font-size: 8px; font-weight: 550; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.mini-account { margin-top: 20px; padding: 14px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(255,255,255,.035); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
.mini-avatar { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: rgba(42,134,255,.16); color: #78b9ff; font-size: 21px; }.mini-identity { min-width: 0; display: grid; gap: 2px; }.mini-identity strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.mini-identity span { color: #8a98ab; font-size: 8px; }.mini-identity small { overflow: hidden; color: #68768a; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }.mini-balance { align-self: start; display: grid; gap: 2px; text-align: right; }.mini-balance strong { color: #65adff; font-size: 15px; }.mini-balance span { color: #748297; font-size: 7px; }
.mini-actions { margin-top: 9px; display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }.mini-actions > span { min-height: 48px; padding: 7px 3px; display: grid; place-items: center; align-content: center; gap: 3px; border: 1px solid rgba(115,187,255,.18); border-radius: 13px; background: linear-gradient(145deg, rgba(139,75,255,.4), rgba(32,127,255,.55)); color: white; font-size: 7px; box-shadow: 0 8px 20px rgba(19,82,170,.18); }.mini-actions b { font-size: 15px; font-weight: 400; }
.mini-tabs { margin-top: 9px; min-height: 34px; padding: 4px; display: grid; grid-template-columns: 1.25fr .9fr 28px; align-items: center; gap: 4px; border-radius: 12px; background: rgba(255,255,255,.045); font-size: 8px; }.mini-tabs strong { height: 27px; display: grid; place-items: center; border-radius: 9px; background: linear-gradient(100deg, rgba(140,74,255,.65), rgba(38,130,255,.7)); }.mini-tabs span { color: #7c899c; text-align: center; }.mini-tabs i { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.08); border-radius: 9px; color: #8b98aa; font-style: normal; }
.mini-orders { margin-top: 9px; display: grid; gap: 6px; }.mini-order { min-height: 58px; padding: 9px; display: grid; grid-template-columns: 34px minmax(0,1fr) auto; grid-template-rows: 1fr 1fr; align-items: center; gap: 2px 8px; border: 1px solid rgba(255,255,255,.085); border-radius: 14px; background: rgba(255,255,255,.025); }.mini-order > i { grid-row: 1 / 3; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: rgba(42,134,255,.13); color: #63aaff; font-style: normal; font-size: 17px; }.mini-order p { grid-row: 1 / 3; min-width: 0; margin: 0; display: grid; gap: 2px; }.mini-order p strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.mini-order p span, .mini-order p small { overflow: hidden; color: #718095; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }.mini-order p small { color: #9b72ef; }.mini-order > b { align-self: end; padding: 3px 7px; border-radius: 999px; background: rgba(36,112,235,.85); font-size: 7px; font-weight: 550; }.mini-order > b.is-ready { background: rgba(31,162,90,.78); }.mini-order > em { align-self: start; color: #bcc8d7; font-size: 8px; font-style: normal; text-align: right; }
.mini-nav { position: absolute; left: 10px; right: 10px; bottom: 9px; height: 47px; padding: 5px 8px; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(108,174,255,.35); border-radius: 0 0 34px 34px; background: rgba(5,10,18,.92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }.mini-nav > span { display: grid; place-items: center; align-content: center; gap: 2px; color: #69778b; font-size: 12px; }.mini-nav small { font-size: 6px; }.mini-nav .is-active { color: #75b7ff; }
.chat-demo { margin: 50px 0 30px; display: grid; gap: 13px; }
.chat-demo p { width: 84%; margin: 0; padding: 16px 18px; border-radius: 18px 18px 18px 5px; background: #111925; font-size: 14px; line-height: 1.5; }
.chat-demo p:last-child { margin-left: auto; border-radius: 18px 18px 5px 18px; background: rgba(33,119,240,.2); color: #c6dcf7; }
.mix-machine { margin: 38px 0 26px; display: grid; grid-template-columns: minmax(0,1fr) 42px 82px 42px minmax(0,1fr); grid-template-rows: auto 34px auto; align-items: center; gap: 8px; }
.mix-pack { min-height: 92px; padding: 13px 8px; display: grid; place-items: center; align-content: center; gap: 4px; border: 1px solid rgba(255,255,255,.1); border-radius: 17px; background: rgba(4,10,18,.4); text-align: center; animation: mix-pack-pulse 9s ease-in-out infinite; }.mix-pack-one { grid-column: 1; grid-row: 1; }.mix-pack-two { grid-column: 5; grid-row: 1; animation-delay: 2.25s; }.mix-pack small { color: #5f6d82; font-size: 7px; letter-spacing: .1em; }.mix-pack strong { font-size: 17px; }.mix-pack span { color: #7d8a9d; font-size: 9px; }
.mix-core { position: relative; grid-column: 3; grid-row: 1; width: 82px; height: 82px; display: grid; place-items: center; align-content: center; gap: 2px; overflow: hidden; border: 1px solid rgba(100,179,255,.46); border-radius: 50%; background: radial-gradient(circle at 35% 25%, rgba(255,255,255,.18), rgba(42,134,255,.19) 38%, rgba(5,20,42,.88)); box-shadow: 0 0 30px rgba(42,134,255,.16), inset 0 1px 0 rgba(255,255,255,.13); animation: mix-core-pulse 9s ease-in-out infinite; }.mix-core strong { z-index: 2; font-size: 14px; }.mix-core span { z-index: 2; color: #77b6ff; font-size: 6px; letter-spacing: .07em; }.mix-core i { position: absolute; inset: 10px; border: 1px dashed rgba(115,188,255,.34); border-radius: 50%; animation: mix-spin 5s linear infinite; }
.mix-beam { position: relative; display: block; overflow: visible; background: rgba(65,153,255,.24); }.mix-beam-left { grid-column: 2; grid-row: 1; height: 1px; }.mix-beam-right { grid-column: 4; grid-row: 1; height: 1px; }.mix-beam-down { grid-column: 3; grid-row: 2; justify-self: center; width: 1px; height: 34px; }.mix-beam i { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #72b8ff; box-shadow: 0 0 14px rgba(54,150,255,.9); opacity: 0; }.mix-beam-left i { left: 0; top: 50%; transform: translate(-50%,-50%); animation: mix-flow-left 9s ease-in-out infinite; }.mix-beam-right i { right: 0; top: 50%; transform: translate(50%,-50%); animation: mix-flow-right 9s ease-in-out 2.25s infinite; }.mix-beam-down i { left: 50%; top: 0; transform: translate(-50%,-50%); animation: mix-flow-down 9s ease-in-out infinite; }
.mix-output { grid-column: 1 / 6; grid-row: 3; justify-self: center; width: min(86%, 330px); padding: 16px 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; border: 1px solid rgba(82,163,255,.38); border-radius: 19px; background: radial-gradient(circle at 50% 0%, rgba(42,134,255,.17), transparent 55%), rgba(42,134,255,.075); box-shadow: 0 16px 38px rgba(0,0,0,.2); animation: mix-output-reveal 9s ease-in-out infinite; }.mix-output > small { grid-column: 1 / 3; color: #67aaff; font-size: 7px; letter-spacing: .14em; text-align: center; }.mix-output > span { display: grid; gap: 2px; text-align: center; }.mix-output > span + span { border-left: 1px solid rgba(255,255,255,.1); }.mix-output b { font-size: 22px; letter-spacing: -.035em; }.mix-output em { color: #738196; font-size: 7px; font-style: normal; letter-spacing: .1em; }

.coverage-grid { margin-top: 72px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.coverage-option { position: relative; min-height: 420px; padding: 34px; display: flex; flex-direction: column; border: 1px solid var(--glass-line); border-radius: 32px; background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.012)), var(--glass); -webkit-backdrop-filter: blur(24px) saturate(145%); backdrop-filter: blur(24px) saturate(145%); box-shadow: var(--glass-shadow); overflow: hidden; animation: coverage-card-breathe 12s ease-in-out infinite; }.coverage-option:nth-child(2) { animation-delay: 4s; }.coverage-option:nth-child(3) { animation-delay: 8s; }
.coverage-option-featured { transform: translateY(-20px); border-color: rgba(91,167,255,.35); background: radial-gradient(circle at 50% 5%, rgba(42,134,255,.2), transparent 43%), linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.014)), var(--glass); }
.coverage-index { color: #67758a; font-size: 11px; letter-spacing: .14em; }
.coverage-icon { width: 74px; height: 74px; margin: 58px 0 30px; display: grid; place-items: center; border: 1px solid rgba(103,178,255,.42); border-radius: 50%; background: radial-gradient(circle at 34% 28%, rgba(255,255,255,.2), rgba(39,125,238,.15) 42%, rgba(6,17,34,.65)); color: #64aaff; box-shadow: 0 0 30px rgba(42,134,255,.16); font-size: 27px; animation: coverage-icon-breathe 12s ease-in-out infinite; }.coverage-option:nth-child(2) .coverage-icon { animation-delay: 4s; }.coverage-option:nth-child(3) .coverage-icon { animation-delay: 8s; }
.coverage-icon-region { width: 116px; border-radius: 999px; font-size: 16px; letter-spacing: 7px; }
.coverage-icon-global { font-size: 39px; }
.coverage-option h3 { margin: 0; font-size: 34px; font-weight: 620; letter-spacing: -.035em; }
.coverage-option p { margin: 14px 0 24px; color: #94a0b2; line-height: 1.65; }
.coverage-option small { margin-top: auto; color: #69768a; line-height: 1.55; }
.network-note { margin-top: 28px; padding: 22px 26px; display: flex; align-items: center; gap: 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 20px; background: rgba(255,255,255,.022); }
.network-note p { margin: 0; color: #8c98aa; line-height: 1.6; }.network-note strong { color: #dce3ec; }
.network-pulse { flex: 0 0 10px; width: 10px; height: 10px; border-radius: 50%; background: #3bda91; box-shadow: 0 0 18px rgba(59,218,145,.7); }

.activation-experience { position: relative; margin-top: 72px; border: 1px solid var(--glass-line); border-radius: 36px; background: radial-gradient(circle at 82% 20%, rgba(41,132,255,.18), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.012)), var(--glass); -webkit-backdrop-filter: blur(26px) saturate(150%); backdrop-filter: blur(26px) saturate(150%); box-shadow: var(--glass-shadow); overflow: hidden; }
.activation-tabs { display: grid; grid-template-columns: repeat(4,1fr); border-bottom: 1px solid var(--line); }
.activation-tab { position: relative; min-height: 72px; padding: 0 20px; display: flex; align-items: center; gap: 13px; border: 0; border-right: 1px solid var(--line); background: transparent; color: #758297; cursor: pointer; text-align: left; transition: color .25s ease, background .25s ease; }.activation-tab:last-child { border-right: 0; }.activation-tab span { color: #526076; font-size: 11px; letter-spacing: .1em; }.activation-tab.is-active { color: white; background: rgba(42,134,255,.065); }.activation-tab.is-active span { color: var(--blue-bright); }
.activation-panels { display: grid; }
.activation-panel { grid-area: 1 / 1; min-height: 500px; padding: 62px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; animation: activation-panel-in .55s ease both; }
.activation-panel[hidden] { display: grid; visibility: hidden; pointer-events: none; animation: none; }
.activation-panel h3 { margin: 17px 0 20px; font-size: clamp(2.6rem, 4.3vw, 4.5rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }.activation-panel p { max-width: 550px; color: #96a1b2; font-size: 17px; line-height: 1.68; }.activation-panel p strong { color: white; font-weight: 600; }
.activation-visual { justify-self: center; width: min(100%, 430px); min-height: 300px; border: 1px solid rgba(255,255,255,.12); border-radius: 28px; background: radial-gradient(circle at 65% 25%, rgba(60,148,255,.18), transparent 40%), rgba(4,10,18,.48); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 30px 70px rgba(0,0,0,.23); }
.plan-selector { padding: 24px; display: grid; align-content: center; gap: 9px; }.plan-selector > span { padding: 14px 18px; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; color: #68768a; font-size: 11px; letter-spacing: .11em; }.plan-selector > .is-selected { border-color: rgba(82,163,255,.45); background: rgba(42,134,255,.12); color: #a9d1ff; box-shadow: 0 0 28px rgba(42,134,255,.11); }
.compatibility-check { margin-bottom: 7px; padding: 16px 18px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 14px; border: 1px solid rgba(74,218,151,.22); border-radius: 16px; background: rgba(35,159,105,.07); }.compatibility-check small { color: #718096; font-size: 9px; letter-spacing: .13em; }.compatibility-check strong { grid-row: 1 / 3; grid-column: 2; font-size: 25px; letter-spacing: -.03em; }.compatibility-check span { display: flex; align-items: center; gap: 7px; color: #8fbea8; font-size: 11px; }.compatibility-check i { width: 7px; height: 7px; border-radius: 50%; background: #3bda91; box-shadow: 0 0 13px rgba(59,218,145,.75); }
.activation-visual.boarding-pass-email { width: min(100%, 420px); min-height: 0; padding: 28px; border-color: rgba(118,185,255,.28); border-radius: 28px; background: radial-gradient(circle at 85% 0%, rgba(50,143,255,.2), transparent 38%), linear-gradient(160deg, rgba(30,66,111,.96), rgba(8,22,42,.98)); transform: rotate(-1.5deg); }.boarding-pass-email .bp-divider { margin: 18px -28px; }.boarding-pass-email .bp-meta { gap: 15px 24px; }.boarding-pass-email .bp-meta > span { font-size: 8px; }.boarding-pass-email .bp-meta strong { font-size: 13px; }.boarding-pass-email .bp-plan { margin-top: 21px; }.boarding-pass-email .bp-plan strong { font-size: 16px; }.boarding-pass-email .bp-data { margin-top: 18px; padding: 18px 15px; }.boarding-pass-email .bp-data strong { font-size: 22px; }.boarding-pass-email .bp-install { margin-top: 20px; padding-top: 18px; }.boarding-pass-email .bp-qr { flex-basis: 70px; width: 70px; height: 70px; }
.install-account-phone { position: relative; width: min(82%, 330px); min-height: 430px; padding: 17px 15px 58px; overflow: hidden; border-radius: 42px; background: radial-gradient(circle at 80% 0%, rgba(42,134,255,.16), transparent 32%), linear-gradient(165deg, #0e1724, #05080e); box-shadow: 0 35px 90px rgba(0,0,0,.48), inset 0 0 0 5px #111924; transform: rotate(1.5deg); }
.install-phone-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; color: #718096; font-size: 8px; }.install-phone-top strong { overflow: hidden; color: #d9e2ee; font-size: 8px; font-weight: 550; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.install-user-row { margin-top: 17px; padding: 12px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 9px; border: 1px solid rgba(255,255,255,.09); border-radius: 16px; background: rgba(255,255,255,.035); }.install-user-row > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: rgba(42,134,255,.16); color: #78b9ff; font-style: normal; font-size: 19px; }.install-user-row > span { min-width: 0; display: grid; gap: 3px; }.install-user-row > span strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.install-user-row small { color: #738197; font-size: 7px; }.install-user-row > b { display: grid; gap: 2px; color: #65adff; font-size: 13px; text-align: right; }.install-user-row > b small { font-weight: 400; }
.install-order-head { margin: 13px 3px 8px; display: flex; align-items: center; justify-content: space-between; color: #9eabba; font-size: 9px; }.install-order-head b { padding: 4px 8px; border-radius: 999px; background: rgba(31,162,90,.18); color: #68dfa3; font-size: 7px; font-weight: 600; }
.install-order-card { padding: 14px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: linear-gradient(150deg, rgba(255,255,255,.055), rgba(255,255,255,.018)); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }.install-order-title { display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 10px; }.install-order-title > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: rgba(42,134,255,.14); color: #63aaff; font-style: normal; font-size: 18px; }.install-order-title > span { display: grid; gap: 3px; }.install-order-title strong { font-size: 11px; }.install-order-title small { color: #758398; font-size: 8px; }
.install-plan-data { margin: 12px 0; padding: 11px 9px; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid rgba(255,255,255,.07); border-radius: 13px; background: rgba(42,134,255,.055); }.install-plan-data > span { display: grid; gap: 3px; text-align: center; }.install-plan-data > span + span { border-left: 1px solid rgba(255,255,255,.09); }.install-plan-data small { color: #66758a; font-size: 6px; letter-spacing: .1em; }.install-plan-data strong { color: #dcecff; font-size: 13px; }
.magic-link-action { width: 100%; min-height: 48px; padding: 8px 12px; display: grid; grid-template-columns: 28px 1fr; grid-template-rows: 1fr 1fr; align-items: center; column-gap: 9px; border: 1px solid rgba(121,190,255,.36); border-radius: 14px; background: linear-gradient(110deg, rgba(133,70,255,.78), rgba(35,128,255,.9)); color: white; text-align: left; box-shadow: 0 8px 24px rgba(23,103,220,.24); animation: install-magic-breathe 3.4s ease-in-out infinite; }.magic-link-action > span { grid-row: 1 / 3; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.13); font-size: 15px; }.magic-link-action strong { align-self: end; font-size: 9px; }.magic-link-action small { align-self: start; color: rgba(255,255,255,.68); font-size: 7px; }
.install-qr-option { margin-top: 10px; padding-top: 10px; display: flex; align-items: center; gap: 10px; border-top: 1px solid rgba(255,255,255,.07); }.install-qr-option .bp-qr { flex-basis: 36px; width: 36px; height: 36px; border-width: 4px; border-radius: 5px; background-size: 11px 11px, 11px 11px, 7px 7px; }.install-qr-option > span { display: grid; gap: 2px; }.install-qr-option strong { font-size: 9px; }.install-qr-option small { color: #718096; font-size: 7px; }
.install-phone-nav { position: absolute; left: 10px; right: 10px; bottom: 9px; height: 47px; padding: 5px 8px; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(108,174,255,.35); border-radius: 0 0 32px 32px; background: rgba(5,10,18,.92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }.install-phone-nav > span { display: grid; place-items: center; align-content: center; gap: 2px; color: #69778b; font-size: 12px; }.install-phone-nav small { font-size: 6px; }.install-phone-nav .is-active { color: #75b7ff; }
.network-visual { display: grid; place-content: center; justify-items: center; text-align: center; }.network-visual i { width: 14px; height: 14px; margin-bottom: 26px; border-radius: 50%; background: #3bda91; box-shadow: 0 0 22px rgba(59,218,145,.8); }.network-visual span { color: #758399; font-size: 11px; letter-spacing: .16em; }.network-visual strong { margin: 6px 0; font-size: 76px; letter-spacing: -.06em; }.network-visual small { color: #718095; }
.activation-progress { height: 3px; background: rgba(255,255,255,.05); }.activation-progress span { display: block; width: 25%; height: 100%; background: linear-gradient(90deg, #267dff, #75baff); box-shadow: 0 0 16px rgba(42,134,255,.7); transition: width .45s ease; }

.confidence-heading { max-width: 850px; }.confidence-heading h2 { margin: 0; font-size: clamp(3rem, 5vw, 5.2rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }
.confidence-grid { margin-top: 72px; display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.confidence-card { min-height: 470px; padding: 28px; display: flex; flex-direction: column; border: 1px solid var(--glass-line); border-radius: 30px; background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.012)), var(--glass); -webkit-backdrop-filter: blur(24px) saturate(145%); backdrop-filter: blur(24px) saturate(145%); box-shadow: var(--glass-shadow); overflow: hidden; animation: confidence-card-breathe 12s ease-in-out infinite; }.confidence-card-replace { animation-delay: 4s; }.confidence-card-help { animation-delay: 8s; }
.confidence-visual { position: relative; min-height: 210px; margin: -4px -4px 30px; border: 1px solid rgba(255,255,255,.075); border-radius: 23px; background: radial-gradient(circle at 50% 42%, rgba(42,134,255,.16), transparent 52%), rgba(4,10,18,.36); overflow: hidden; }
.confidence-card h3 { margin: auto 0 16px; font-size: 29px; letter-spacing: -.035em; font-weight: 620; }.confidence-card p { margin: 0; color: #8e9aac; line-height: 1.65; }
.payment-orbit { display: grid; grid-template-columns: repeat(3,1fr); align-content: center; gap: 8px; padding: 22px 16px; }.payment-orbit > span { min-height: 43px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.09); border-radius: 12px; background: rgba(255,255,255,.035); color: #7d899b; font-size: 9px; font-weight: 650; animation: payment-method-pulse 9s ease-in-out infinite; }.payment-orbit > span:nth-child(2) { animation-delay: 1.5s; }.payment-orbit > span:nth-child(3) { animation-delay: 3s; }.payment-orbit > span:nth-child(4) { animation-delay: 4.5s; }.payment-orbit > span:nth-child(5) { animation-delay: 6s; }.payment-orbit > span:nth-child(6) { animation-delay: 7.5s; }
.replacement-flow { padding: 22px 17px; display: grid; align-content: center; gap: 12px; }.replacement-profile { position: relative; z-index: 2; min-height: 67px; padding: 12px 14px; display: grid; gap: 4px; border: 1px solid rgba(255,255,255,.09); border-radius: 15px; background: rgba(8,17,29,.86); }.replacement-profile small { color: #647287; font-size: 7px; letter-spacing: .11em; }.replacement-profile strong { font-size: 11px; }.replacement-profile span { color: #7f8da0; font-size: 8px; }.replacement-old { animation: replacement-old-fade 7s ease-in-out infinite; }.replacement-new { border-color: rgba(74,171,124,.22); animation: replacement-new-glow 7s ease-in-out infinite; }.replacement-new span { color: #68c994; }.replacement-flow > i { position: relative; z-index: 1; justify-self: center; width: 1px; height: 20px; background: linear-gradient(rgba(72,158,255,.18), rgba(72,158,255,.8)); }.replacement-flow > i b { position: absolute; left: 50%; top: 0; width: 7px; height: 7px; transform: translate(-50%,-50%); border-radius: 50%; background: #70b7ff; box-shadow: 0 0 16px rgba(55,153,255,.9); animation: replacement-signal 7s ease-in-out infinite; }
.support-handoff { padding: 24px 17px; display: grid; align-content: center; gap: 9px; }.support-person { min-height: 60px; padding: 10px 12px; display: grid; grid-template-columns: 36px 1fr; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 15px; background: rgba(7,15,26,.78); }.support-person > i { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: rgba(42,134,255,.14); color: #78b9ff; font-style: normal; }.support-person > span { display: grid; gap: 3px; }.support-person strong { font-size: 10px; }.support-person small { color: #718096; font-size: 7px; }.support-ai { animation: support-ai-pulse 8s ease-in-out infinite; }.support-human { animation: support-human-pulse 8s ease-in-out infinite; }.support-human > i { background: rgba(44,188,118,.12); color: #6ddca4; }.support-transfer { position: relative; min-height: 31px; display: grid; place-items: center; }.support-transfer::before { content: ""; position: absolute; left: 17px; right: 17px; top: 50%; height: 1px; background: linear-gradient(90deg, transparent, rgba(73,160,255,.6), transparent); }.support-transfer > i { position: absolute; z-index: 2; left: 16%; top: 50%; width: 7px; height: 7px; transform: translate(-50%,-50%); border-radius: 50%; background: #70b7ff; box-shadow: 0 0 16px rgba(55,153,255,.9); animation: support-handoff-flow 8s ease-in-out infinite; }.support-transfer span { z-index: 3; padding: 4px 9px; border-radius: 999px; background: #0a111c; color: #708097; font-size: 7px; }

.qr-section { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 90px; }
.qr-copy h2 { margin: 0; font-size: clamp(3rem, 5vw, 5.2rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }
.qr-copy > p:not(.eyebrow) { margin: 28px 0 0; color: #95a1b2; font-size: 18px; line-height: 1.65; }
.qr-copy ul { margin: 32px 0 0; padding: 0; list-style: none; }
.qr-copy li { padding: 13px 0 13px 26px; border-top: 1px solid var(--line); color: #bdc6d2; position: relative; }
.qr-copy li::before { content: ""; position: absolute; left: 3px; top: 20px; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); }
.qr-demo { position: relative; min-height: 620px; padding: 30px; border: 1px solid var(--glass-line); border-radius: 36px; background: radial-gradient(circle at 60% 10%, rgba(75,158,255,.22), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.012)), var(--glass); -webkit-backdrop-filter: blur(26px) saturate(150%); backdrop-filter: blur(26px) saturate(150%); box-shadow: var(--glass-shadow); overflow: hidden; }
.qr-app-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }.qr-app-header > div { min-width: 0; display: flex; align-items: center; gap: 12px; }.qr-app-header > div > i { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid rgba(91,170,255,.3); border-radius: 12px; background: rgba(42,134,255,.11); color: #71b4ff; font-style: normal; font-size: 21px; }.qr-app-header > div > span { min-width: 0; display: grid; gap: 4px; }.qr-app-header strong { font-size: 20px; }.qr-app-header small { overflow: hidden; color: #748196; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.qr-app-header > span { flex: 0 0 auto; padding: 11px 14px; border: 1px solid rgba(106,181,255,.35); border-radius: 13px; background: linear-gradient(120deg, rgba(85,64,225,.74), rgba(34,126,244,.9)); color: white; font-size: 10px; font-weight: 600; box-shadow: 0 10px 25px rgba(22,101,216,.22); }
.qr-app-tabs { margin-top: 21px; padding: 5px; display: grid; grid-template-columns: .8fr 1.25fr 1.15fr; gap: 4px; border-radius: 15px; background: rgba(255,255,255,.045); }.qr-app-tabs > * { min-height: 45px; padding: 6px; display: grid; place-items: center; border-radius: 11px; color: #69778a; font-size: 8px; font-weight: 500; line-height: 1.25; text-align: center; }.qr-app-tabs strong { background: rgba(255,255,255,.075); color: #71b3ff; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
.campaign-body { margin: 22px 0 20px; padding: 20px 18px; display: flex; align-items: center; gap: 20px; border: 1px solid rgba(255,255,255,.1); border-radius: 22px; background: rgba(255,255,255,.035); }
.campaign-offer { min-width: 0; flex: 1; display: grid; gap: 10px; }.campaign-offer-head { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }.campaign-offer-head > b { padding: 6px 9px; border-radius: 999px; background: rgba(41,115,235,.9); color: white; font-size: 8px; font-weight: 600; }.campaign-offer-head > strong { font-size: 11px; }.campaign-offer-head > span { color: #8693a6; font-size: 9px; }.campaign-offer > em { color: #67aaff; font-size: 17px; font-style: normal; }.campaign-offer > small { margin-top: 0; display: flex; align-items: center; gap: 7px; color: #74c99d; font-size: 8px; }.campaign-offer > small i { width: 7px; height: 7px; border-radius: 50%; background: #3bda91; box-shadow: 0 0 12px rgba(59,218,145,.65); }
.campaign-qr-stage { position: relative; flex: 0 0 176px; min-height: 176px; display: grid; place-items: center; }.campaign-qr { position: relative; z-index: 3; width: 128px; aspect-ratio: 1; padding: 11px; display: grid; grid-template-columns: repeat(4,1fr); gap: 5px; background: #f7fbff; box-shadow: 0 18px 42px rgba(0,0,0,.3); }
.campaign-qr i { background: #07101e; }.campaign-qr i:nth-child(3), .campaign-qr i:nth-child(6), .campaign-qr i:nth-child(8), .campaign-qr i:nth-child(9), .campaign-qr i:nth-child(14) { background: white; }
.scan-wave { position: absolute; z-index: 1; left: 50%; top: 50%; width: 128px; height: 128px; transform: translate(-50%,-50%) scale(.85); border: 1px solid rgba(78,165,255,.48); border-radius: 22px; opacity: 0; animation: campaign-scan-wave 7.5s ease-out infinite; }.scan-wave-two { animation-delay: 3.75s; }
.scan-traveler { position: absolute; z-index: 4; left: 50%; top: 50%; width: 28px; height: 28px; display: grid; place-items: center; transform: translate(-50%,-50%) scale(.6); border: 1px solid rgba(154,210,255,.58); border-radius: 50%; background: linear-gradient(145deg, rgba(82,167,255,.98), rgba(22,102,207,.98)); box-shadow: 0 0 20px rgba(42,134,255,.52); color: white !important; font-size: 9px; font-weight: 700; opacity: 0; animation: campaign-traveler-one 7.5s cubic-bezier(.2,.7,.22,1) infinite; }.scan-traveler-two { animation-name: campaign-traveler-two; animation-delay: 2.5s; }.scan-traveler-three { animation-name: campaign-traveler-three; animation-delay: 5s; }
.qr-app-usage > span { color: #8793a5; font-size: 9px; }.qr-app-usage > span strong { color: #dce5f0; font-size: 11px; }.progress-line { height: 5px; margin-top: 8px; overflow: hidden; border-radius: 99px; background: #18202d; }.progress-line i { display: block; width: 68%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #126cff, #66b0ff); box-shadow: 0 0 12px rgba(42,134,255,.5); transition: width .2s ease; }
.qr-app-actions { display: flex; flex-wrap: wrap; gap: 7px; }.qr-app-actions > span { min-height: 35px; padding: 7px 10px; display: flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; color: #8f9cad; font-size: 11px; }.qr-app-actions b { color: #d7e0eb; font-size: 8px; font-weight: 550; }
.qr-demo > label { display: block; margin: 0 0 8px; color: #7f8c9f; font-size: 10px; }.qr-demo > input { width: 100%; accent-color: var(--blue); cursor: ew-resize; }.campaign-footer { margin-top: 10px; display: flex; align-items: center; justify-content: space-between; color: #6f7b8e; font-size: 10px; }.campaign-footer strong { margin-left: 4px; color: #d4dbe4; font-size: 11px; }

.earning-card { position: relative; padding: 72px; display: grid; grid-template-columns: 1.2fr .8fr; gap: 70px; align-items: center; border: 1px solid rgba(111,178,255,.28); border-radius: 40px; background: radial-gradient(circle at 78% 45%, rgba(45,132,255,.25), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.012)), var(--glass-strong); -webkit-backdrop-filter: blur(28px) saturate(150%); backdrop-filter: blur(28px) saturate(150%); box-shadow: var(--glass-shadow); overflow: hidden; }
.earning-card h2 { margin: 0; font-size: clamp(3rem, 5.2vw, 5.5rem); line-height: 1.04; letter-spacing: -.04em; font-weight: 620; }.earning-card h2 em { color: var(--blue-bright); font-style: normal; }
.earning-card p:not(.eyebrow) { max-width: 690px; color: #95a1b2; font-size: 17px; line-height: 1.65; }
.earning-meter { padding: 28px; border: 1px solid var(--line); border-radius: 22px; background: rgba(3,7,13,.6); }.earning-value { display: grid; gap: 6px; }.earning-value span { color: #7e8b9e; font-size: 12px; }.earning-value strong { font-size: 52px; letter-spacing: -.055em; }
.meter-track { height: 8px; margin-top: 30px; border-radius: 99px; background: #18202c; overflow: hidden; }.meter-track span { display: block; width: 72%; height: 100%; background: linear-gradient(90deg, #126aff, #73b9ff); box-shadow: 0 0 18px #237eff; }.meter-labels { margin-top: 11px; display: flex; justify-content: space-between; color: #687588; }

.money-flows { margin-top: 72px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.money-flow { position: relative; min-height: 470px; padding: 34px; border: 1px solid var(--glass-line); border-radius: 32px; background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.012)), var(--glass); -webkit-backdrop-filter: blur(24px) saturate(145%); backdrop-filter: blur(24px) saturate(145%); box-shadow: var(--glass-shadow); overflow: hidden; }
.money-flow-referral { background: radial-gradient(circle at 85% 5%, rgba(42,134,255,.18), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.012)), var(--glass); }
.money-flow-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }.money-flow-heading span { color: #6e7d91; font-size: 10px; letter-spacing: .13em; }.money-flow-heading strong { color: #85bdff; font-size: 14px; }
.money-route { margin: 70px 0 54px; display: grid; grid-template-columns: 1fr 48px 1fr 48px 1fr; align-items: center; }.money-route > div { min-height: 130px; padding: 16px 12px; display: flex; flex-direction: column; justify-content: center; border: 1px solid rgba(255,255,255,.09); border-radius: 18px; background: rgba(4,10,18,.35); text-align: center; animation: money-node-pulse 7.2s ease-in-out infinite; will-change: transform; }.money-route > div:nth-of-type(2) { animation-delay: 2.4s; }.money-route > div:nth-of-type(3) { animation-delay: 4.8s; }.money-route small { color: #536176; font-size: 9px; letter-spacing: .12em; }.money-route strong { margin: 12px 0 5px; font-size: 15px; }.money-route span { color: #748298; font-size: 10px; line-height: 1.35; }
.money-route > i { position: relative; height: 1px; overflow: visible; background: linear-gradient(90deg, rgba(42,134,255,.16), rgba(74,159,255,.58), rgba(42,134,255,.16)); }.money-route > i b { position: absolute; top: 50%; left: 0; width: 6px; height: 6px; transform: translate(-50%,-50%); border-radius: 50%; background: #72b8ff; box-shadow: 0 0 14px rgba(54,150,255,.9); animation: money-signal 7.2s ease-in-out infinite; }.money-route > i:nth-of-type(2) b { animation-delay: 2.4s; }
.money-flow > p { margin: 0; color: #8c98aa; line-height: 1.65; }
.wallet-clarity { margin-top: 18px; padding: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; border: 1px solid rgba(255,255,255,.1); border-radius: 26px; background: rgba(255,255,255,.022); }.wallet-clarity > div { display: flex; align-items: center; gap: 17px; }.wallet-clarity > div + div { padding-left: 24px; border-left: 1px solid var(--line); }.wallet-icon { flex: 0 0 48px; width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(109,181,255,.28); border-radius: 15px; background: rgba(42,134,255,.08); color: #78b8ff; font-weight: 700; }.wallet-icon-income { border-radius: 50%; }.wallet-clarity p { margin: 0; display: grid; gap: 6px; }.wallet-clarity strong { font-size: 15px; }.wallet-clarity small { color: #79869a; line-height: 1.5; }

.control-section { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 80px; }
.control-copy h2 { margin: 0; font-size: clamp(2.8rem, 5vw, 5.1rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }
.control-copy > p:not(.eyebrow) { margin: 28px 0 0; color: #939fb1; font-size: 17px; line-height: 1.68; }
.control-copy ul { margin: 30px 0 0; padding: 0; list-style: none; }
.control-copy li { position: relative; padding: 12px 0 12px 25px; border-top: 1px solid var(--line); color: #bcc5d1; }
.control-copy li::before { content: ""; position: absolute; left: 2px; top: 19px; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 14px rgba(42,134,255,.7); }
.control-dashboard { position: relative; min-height: 760px; padding: 22px 22px 68px; border: 1px solid var(--glass-line); border-radius: 36px; background: radial-gradient(circle at 80% 6%, rgba(44,137,255,.16), transparent 30%), linear-gradient(165deg, rgba(18,29,47,.94), rgba(8,14,24,.98)); -webkit-backdrop-filter: blur(26px) saturate(150%); backdrop-filter: blur(26px) saturate(150%); box-shadow: var(--glass-shadow); overflow: hidden; }
.dashboard-app-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; color: #6f7c90; font-size: 9px; }.dashboard-app-top > strong { display: grid; gap: 2px; color: #eaf1fa; font-size: 11px; font-weight: 600; text-align: center; }.dashboard-app-top small { color: #667389; font-size: 7px; font-weight: 450; }
.dashboard-live-card { border: 1px solid rgba(126,151,184,.24); background: rgba(6,14,26,.46); box-shadow: inset 0 1px 0 rgba(255,255,255,.025); animation: dashboard-stat-breathe 12s ease-in-out infinite; }
.dashboard-level { min-height: 92px; margin-top: 20px; padding: 17px 20px; display: flex; align-items: center; justify-content: space-between; border-radius: 18px; }.dashboard-level > span { display: grid; gap: 3px; }.dashboard-level small, .dashboard-kpi small { color: #647287; font-size: 8px; }.dashboard-level strong { font-size: 24px; }.dashboard-level em, .dashboard-kpi em { color: #728095; font-size: 8px; font-style: normal; }.dashboard-level > i { color: #438dff; font-style: normal; font-size: 35px; text-shadow: 0 0 22px rgba(60,140,255,.35); }
.dashboard-kpis { margin-top: 11px; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.dashboard-kpi { min-height: 104px; padding: 14px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-radius: 16px; }.dashboard-kpi > span { min-width: 0; display: grid; gap: 4px; }.dashboard-kpi strong { font-size: 15px; letter-spacing: -.025em; }.dashboard-kpi > i { font-style: normal; font-size: 24px; }.dashboard-kpi-income { animation-delay: 2s; }.dashboard-kpi-referrals { animation-delay: 4s; }.dashboard-kpi-points { animation-delay: 6s; }.dashboard-kpi-income > i { color: #36d779; }.dashboard-kpi-referrals > i { color: #ad55ff; }.dashboard-kpi-points > i { color: #ff8128; }
.dashboard-income-card { margin-top: 12px; padding: 18px; display: grid; gap: 10px; border: 1px solid rgba(126,151,184,.24); border-radius: 20px; background: rgba(6,14,26,.5); }.dashboard-income-card > div:first-child { margin-bottom: 4px; display: grid; gap: 4px; }.dashboard-income-card > div:first-child strong { font-size: 17px; }.dashboard-income-card > div:first-child small { color: #758297; font-size: 8px; }
.dashboard-category { min-height: 82px; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; border-radius: 15px; animation: dashboard-category-pulse 8s ease-in-out infinite; }.dashboard-category > span { display: grid; gap: 3px; }.dashboard-category small, .dashboard-category em { color: #718097; font-size: 8px; font-style: normal; }.dashboard-category strong { font-size: 15px; }.dashboard-category > i { font-style: normal; font-size: 29px; }.dashboard-category-esim { background: rgba(31,72,143,.28); }.dashboard-category-esim > i { color: #438dff; }.dashboard-category-vpn { background: rgba(72,33,119,.28); animation-delay: 4s; }.dashboard-category-vpn > i { color: #ae51ff; }
.dashboard-client-card { margin-top: 12px; padding: 15px 17px; display: grid; grid-template-columns: 1fr auto; gap: 5px 14px; border: 1px solid rgba(255,255,255,.09); border-radius: 17px; background: rgba(255,255,255,.026); }.dashboard-client-card > div:first-child { display: grid; gap: 4px; }.dashboard-client-card small { color: #647287; font-size: 7px; letter-spacing: .08em; }.dashboard-client-card strong { font-size: 11px; }.dashboard-client-card > span { align-self: center; color: #7ab8ff; font-size: 9px; }.dashboard-client-progress { grid-column: 1 / 3; height: 6px; margin-top: 6px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.07); }.dashboard-client-progress i { display: block; width: 70%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #176fff, #69b2ff); box-shadow: 0 0 16px rgba(42,134,255,.62); animation: dashboard-traffic-live 7s ease-in-out infinite; }.dashboard-client-card p { grid-column: 1 / 3; margin: 5px 0 0; display: flex; align-items: center; gap: 7px; color: #748297; font-size: 8px; }.dashboard-client-card p b { width: 6px; height: 6px; border-radius: 50%; background: #3bda91; box-shadow: 0 0 12px rgba(59,218,145,.65); }
.dashboard-app-nav { position: absolute; left: 10px; right: 10px; bottom: 9px; height: 48px; padding: 5px 8px; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(111,76,255,.55); border-radius: 0 0 30px 30px; background: rgba(6,13,23,.94); }.dashboard-app-nav > span { display: grid; place-items: center; align-content: center; gap: 2px; color: #6f7c90; font-size: 12px; }.dashboard-app-nav small { font-size: 6px; }.dashboard-app-nav .is-active { color: #79b7ff; }

.journey-steps { position: relative; margin: 72px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4,1fr); list-style: none; counter-reset: none; border-top: 1px solid var(--line); }
.journey-steps::before { content: ""; position: absolute; z-index: 4; left: 0; right: 0; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, rgba(76,163,255,.58), transparent); }
.journey-steps::after { content: ""; position: absolute; z-index: 5; left: 0; top: -5px; width: 9px; height: 9px; border-radius: 50%; background: #75baff; box-shadow: 0 0 16px rgba(51,151,255,.92), 0 0 34px rgba(42,134,255,.48); animation: journey-signal-horizontal 12s linear infinite; }
.journey-steps li { position: relative; min-height: 270px; padding: 30px 24px; border-right: 1px solid var(--line); background: linear-gradient(180deg, rgba(42,134,255,0), rgba(42,134,255,0)); animation: journey-step-breathe 12s ease-in-out infinite; }.journey-steps li:nth-child(2) { animation-delay: 3s; }.journey-steps li:nth-child(3) { animation-delay: 6s; }.journey-steps li:nth-child(4) { animation-delay: 9s; }.journey-steps li:last-child { border-right: 0; }
.journey-steps li > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(78,164,255,.28); border-radius: 50%; background: rgba(42,134,255,.07); color: var(--blue-bright); font-size: 11px; font-weight: 700; letter-spacing: .08em; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); animation: journey-number-pulse 12s ease-in-out infinite; }.journey-steps li:nth-child(2) > span { animation-delay: 3s; }.journey-steps li:nth-child(3) > span { animation-delay: 6s; }.journey-steps li:nth-child(4) > span { animation-delay: 9s; }.journey-steps strong { display: block; margin-top: 44px; font-size: 22px; letter-spacing: -.03em; }.journey-steps p { color: #788599; font-size: 14px; line-height: 1.6; }

.test-card { padding: 54px 48px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 36px; border: 1px solid var(--line); border-radius: 30px; background: radial-gradient(circle at 10% 50%, rgba(42,134,255,.12), transparent 30%), rgba(255,255,255,.025); overflow: hidden; }
.test-orb { width: 130px; height: 130px; display: grid; place-content: center; border-radius: 50%; background: radial-gradient(circle at 36% 28%, #5fb0ff, #176edc 48%, #082b67); box-shadow: 0 0 60px rgba(42,134,255,.28); text-align: center; animation: test-orb-reward 12s ease-in-out infinite; }.test-orb span { font-size: 48px; font-weight: 740; line-height: .9; }.test-orb small { margin-top: 8px; letter-spacing: .15em; }
.test-card h2 { margin: 0; font-size: clamp(2.4rem, 4.4vw, 4.5rem); line-height: 1.05; letter-spacing: -.038em; font-weight: 620; }.test-card p:not(.eyebrow) { max-width: 720px; margin-bottom: 0; color: #8f9bad; line-height: 1.65; }
.test-flow { position: relative; margin-top: 25px; display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }.test-flow::before { content: ""; position: absolute; z-index: 0; left: 8%; right: 8%; top: 19px; height: 1px; background: linear-gradient(90deg, rgba(69,157,255,.18), rgba(79,167,255,.62), rgba(69,157,255,.18)); }.test-flow::after { content: ""; position: absolute; z-index: 1; left: 8%; top: 15px; width: 8px; height: 8px; border-radius: 50%; background: #75baff; box-shadow: 0 0 15px rgba(51,151,255,.9); animation: test-flow-signal 12s linear infinite; }.test-flow > span { position: relative; z-index: 2; min-width: 0; padding: 0 5px; display: grid; justify-items: center; gap: 5px; text-align: center; animation: test-step-breathe 12s ease-in-out infinite; }.test-flow > span:nth-child(2) { animation-delay: 3s; }.test-flow > span:nth-child(3) { animation-delay: 6s; }.test-flow > span:nth-child(4) { animation-delay: 9s; }.test-flow i { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(90,173,255,.3); border-radius: 50%; background: #0c1726; color: #75b7ff; font-style: normal; font-size: 8px; box-shadow: 0 0 0 5px rgba(7,13,22,.88); }.test-flow strong { width: 100%; min-height: 2.5em; display: grid; place-items: center; color: #cbd5e2; font-size: 9px; line-height: 1.25; }.test-flow small { color: #68768a; font-size: 7px; line-height: 1.3; }
.test-actions { min-width: 220px; display: grid; gap: 10px; justify-items: stretch; }.test-actions > small { color: #73b6ff; font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }.test-actions .button { justify-content: space-between; white-space: nowrap; }.test-actions > p { margin: 0; max-width: 220px; color: #6f7d91 !important; font-size: 11px; line-height: 1.4 !important; }
.test-actions .guide-button { white-space: normal; line-height: 1.25; }

.story-grid { padding: 70px 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.story-years { align-self: end; }.story-years strong { display: block; font-size: clamp(6rem, 13vw, 12rem); line-height: .72; letter-spacing: -.09em; color: #15233a; }.story-years span { display: block; max-width: 190px; margin: 30px 0 0 12px; color: #6d798c; line-height: 1.45; }
.story-copy h2 { margin: 0; font-size: clamp(3rem, 5vw, 5.2rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }.story-copy > p:not(.eyebrow) { color: #939fb0; font-size: 18px; line-height: 1.7; }.story-copy > small { color: #6f7b8e; }

.faq-section { display: grid; grid-template-columns: .85fr 1.15fr; gap: 90px; }.faq-heading h2 { margin: 0; font-size: clamp(3rem, 5vw, 5rem); line-height: 1.05; letter-spacing: -.04em; font-weight: 620; }.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }.faq-item button { width: 100%; padding: 24px 0; display: flex; justify-content: space-between; gap: 20px; border: 0; background: transparent; cursor: pointer; text-align: left; font-size: 17px; }.faq-item button b { color: var(--blue-bright); font-size: 22px; font-weight: 400; }.faq-answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s ease; }.faq-answer p { min-height: 0; overflow: hidden; margin: 0; color: #8995a7; line-height: 1.65; }.faq-item.is-open .faq-answer { grid-template-rows: 1fr; }.faq-item.is-open .faq-answer p { padding: 0 34px 24px 0; }

.final-cta-card { position: relative; min-height: 540px; padding: 70px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border: 1px solid rgba(103,170,255,.3); border-radius: 44px; background: radial-gradient(circle at 50% 110%, rgba(24,113,255,.36), transparent 54%), linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.01)), var(--glass-strong); -webkit-backdrop-filter: blur(28px) saturate(150%); backdrop-filter: blur(28px) saturate(150%); box-shadow: var(--glass-shadow); overflow: hidden; }.final-cta-card h2 { max-width: 920px; margin: 0; font-size: clamp(3.2rem, 6vw, 6.3rem); line-height: 1.04; letter-spacing: -.042em; font-weight: 620; }.final-cta-card > div { margin-top: 42px; display: flex; gap: 12px; }

.site-footer { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; padding: 30px 0 40px; border-top: 1px solid var(--line); }.footer-main { padding: 50px 0 70px; display: grid; grid-template-columns: 2fr 1fr 1.4fr; gap: 60px; }.footer-main > div { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; }.footer-main p { color: #79869a; line-height: 1.55; }.footer-main strong { margin-bottom: 12px; color: #6f7b8f; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; }.footer-main a:not(.brand) { color: #a5afbd; font-size: 14px; }.footer-main a:hover { color: white; }.footer-bottom { padding-top: 22px; display: flex; justify-content: space-between; border-top: 1px solid var(--line); color: #566276; font-size: 12px; }.footer-bottom a { transition: color .2s ease; }.footer-bottom a:hover { color: #d9e8ff; }

.mobile-drawer { position: fixed; z-index: 35; inset: 0; padding: 110px 28px 40px; display: flex; flex-direction: column; gap: 10px; background: rgba(5,7,11,.97); backdrop-filter: blur(20px); }.mobile-drawer[hidden] { display: none; }.mobile-drawer a { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 28px; letter-spacing: -.04em; }.mobile-drawer .button { margin-top: 22px; }
.prototype-toast { position: fixed; z-index: 100; left: 50%; bottom: 26px; transform: translate(-50%, 20px); padding: 13px 18px; border: 1px solid var(--line); border-radius: 12px; background: rgba(10,14,21,.95); color: #c7cfda; font-size: 13px; opacity: 0; pointer-events: none; transition: opacity .25s ease, transform .25s ease; }.prototype-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

.modal { position: fixed; inset: 0; z-index: 80; display: none; place-items: center; padding: 20px; }
.modal.is-open { display: grid; }
.modal-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(1,3,7,.78); backdrop-filter: blur(10px); cursor: default; }
.modal-card { position: relative; width: min(100%, 560px); padding: 42px; border: 1px solid var(--glass-line); border-radius: 32px; background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.018)), rgba(8,14,24,.82); -webkit-backdrop-filter: blur(30px) saturate(150%); backdrop-filter: blur(30px) saturate(150%); box-shadow: 0 30px 100px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.1); overflow: hidden; }
.modal-card h2 { margin: 0 0 18px; font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1.05; letter-spacing: -.035em; font-weight: 620; }
.modal-card > p:not(.eyebrow) { color: #98a3b3; line-height: 1.65; }
.modal-card .button { margin-top: 22px; }.modal-card small { display: block; margin-top: 16px; color: #6f7a8c; line-height: 1.5; }
.modal-close { position: absolute; top: 16px; right: 16px; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; background: transparent; cursor: pointer; font-size: 25px; color: #9aa6b6; }
body.modal-open { overflow: hidden; }
.contact-channel-grid { margin-top: 28px; display: grid; gap: 11px; }
.contact-channel { min-height: 82px; padding: 15px 17px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(255,255,255,.035); transition: transform .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease; }
.contact-channel:hover { transform: translateY(-2px); border-color: rgba(100,175,255,.38); background: rgba(42,134,255,.08); box-shadow: 0 16px 40px rgba(0,0,0,.22); }
.contact-channel-primary { border-color: rgba(75,159,255,.3); background: rgba(42,134,255,.075); }
.channel-icon { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(91,171,255,.35); border-radius: 15px; background: linear-gradient(145deg, rgba(42,134,255,.28), rgba(42,134,255,.08)); color: #8fc5ff; font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.contact-channel > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.contact-channel strong { font-size: 16px; }
.contact-channel small { margin: 0; color: #78869a; font-size: 12px; }
.contact-channel b { color: #78b8ff; font-size: 18px; font-weight: 400; }

/* Soft liquid-glass highlights: depth without sacrificing legibility. */
.model-switcher::before,
.experience-card::before,
.qr-demo::before,
.earning-card::before,
.final-cta-card::before,
.modal-card::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: 56%;
  height: 42%;
  top: -25%;
  left: -12%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255,255,255,.16), rgba(93,167,255,.07) 42%, transparent 72%);
  filter: blur(10px);
  pointer-events: none;
}
.model-switcher > *,
.experience-card > *,
.qr-demo > *,
.earning-card > *,
.final-cta-card > *,
.modal-card > * { position: relative; z-index: 1; }
.site-header::after {
  content: "";
  position: absolute;
  inset: 1px 18% auto 18%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.36), transparent);
  pointer-events: none;
}
.button-primary {
  background: linear-gradient(145deg, #4097ff, #176fe7 72%);
  border-color: rgba(255,255,255,.13);
  box-shadow: 0 12px 36px rgba(42,134,255,.28), inset 0 1px 0 rgba(255,255,255,.25);
}
.button-ghost {
  background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.025));
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
}

.reveal { opacity: 0; transform: translateY(30px); transition: opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
@keyframes earth-orbit {
  0%, 100% { transform: translate3d(-1.2%, 1%, 0) scale(1.035) rotate(-.35deg); }
  50% { transform: translate3d(1.8%, -1.2%, 0) scale(1.075) rotate(.4deg); }
}
@keyframes audience-clockwise {
  from { transform: translate(-50%,-50%) rotate(var(--orbit-start)) translateX(var(--orbit-radius)) rotate(var(--orbit-start-negative)); }
  to { transform: translate(-50%,-50%) rotate(calc(var(--orbit-start) + 360deg)) translateX(var(--orbit-radius)) rotate(calc(var(--orbit-start-negative) - 360deg)); }
}
@keyframes signal-clockwise {
  from { transform: rotate(var(--orbit-start)) translateX(76px); }
  to { transform: rotate(calc(var(--orbit-start) + 360deg)) translateX(76px); }
}
@keyframes signal-clockwise-mobile {
  from { transform: rotate(var(--orbit-start)) translateX(56px); }
  to { transform: rotate(calc(var(--orbit-start) + 360deg)) translateX(56px); }
}
@keyframes signal-pulse {
  0%, 72%, 92%, 100% { opacity: 0; }
  77% { opacity: .14; }
  82% { opacity: 1; }
  87% { opacity: .22; }
}
@keyframes audience-highlight {
  0%, 72%, 100% { transform: scale(1); border-color: rgba(255,255,255,.14); background: rgba(11,19,31,.64); box-shadow: 0 12px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.08); color: #b8c6d8; }
  82% { transform: scale(1.09); border-color: rgba(104,181,255,.58); background: rgba(26,77,139,.5); box-shadow: 0 14px 38px rgba(0,0,0,.28), 0 0 28px rgba(42,134,255,.3), inset 0 1px 0 rgba(255,255,255,.2); color: #edf6ff; }
}
@keyframes core-breathe { 0%,100% { box-shadow: 0 0 48px rgba(42,134,255,.2), inset -14px -18px 28px rgba(0,20,51,.55), inset 9px 8px 22px rgba(124,193,255,.13); } 50% { box-shadow: 0 0 78px rgba(42,134,255,.38), inset -14px -18px 28px rgba(0,20,51,.48), inset 9px 8px 26px rgba(150,208,255,.2); } }
@keyframes orbit-ring { to { transform: rotate(360deg); } }
@keyframes globe-grid-shift {
  0% { background-position: 0 0, 0 0; transform: scale(1.02); }
  50% { background-position: 20px 0, 0 0; transform: scale(1.07); }
  100% { background-position: 40px 0, 0 0; transform: scale(1.02); }
}
@keyframes globe-texture-drift {
  0%, 100% { background-position: center, center, 70% 50%; }
  50% { background-position: center, center, 79% 50%; }
}
@keyframes referral-client-pulse {
  0%, 24%, 100% { transform: scale(1); border-color: rgba(255,255,255,.15); background: #121a27; box-shadow: none; color: white; }
  7% { transform: scale(1.16); border-color: rgba(111,187,255,.72); background: #1d70cd; box-shadow: 0 0 34px rgba(42,134,255,.5), inset 0 1px 0 rgba(255,255,255,.22); color: white; }
}
@keyframes referral-line-pulse { 0%, 4%, 26%, 100% { opacity: .16; filter: none; } 12%, 20% { opacity: 1; filter: drop-shadow(0 0 6px rgba(58,151,255,.9)); } }
@keyframes referral-value-flow {
  0%, 5% { left: var(--value-x); top: var(--value-y); transform: translate(-50%,-50%) scale(.45); opacity: 0; }
  8% { opacity: 1; }
  21% { left: 50%; top: 50%; transform: translate(-50%,-50%) scale(1); opacity: 1; }
  26%, 100% { left: 50%; top: 50%; transform: translate(-50%,-50%) scale(.4); opacity: 0; }
}
@keyframes referral-core-receive {
  0%, 16%, 24%, 49%, 57%, 82%, 90%, 100% { transform: scale(1); box-shadow: 0 0 58px rgba(42,134,255,.34); }
  18%, 51%, 84% { transform: scale(1.09); box-shadow: 0 0 82px rgba(42,134,255,.56), inset 0 1px 0 rgba(255,255,255,.2); }
  19.5%, 52.5%, 85.5% { transform: scale(1.025); box-shadow: 0 0 64px rgba(42,134,255,.42); }
  21.5%, 54.5%, 87.5% { transform: scale(1.13); box-shadow: 0 0 98px rgba(86,174,255,.72), inset 0 1px 0 rgba(255,255,255,.28); }
}
@keyframes gratitude-heart-wave {
  0%, 21%, 31%, 54%, 64%, 87%, 97%, 100% { transform: translate(-50%,-48%) scale(.48); opacity: 0; filter: blur(0); }
  23%, 56%, 89% { transform: translate(-50%,-48%) scale(.58); opacity: .68; filter: blur(0); }
  29%, 62%, 95% { transform: translate(-50%,-48%) scale(1.22); opacity: 0; filter: blur(1px); }
}
@keyframes commission-breathe { 0%,100% { border-color: rgba(72,157,255,.28); box-shadow: none; } 50% { border-color: rgba(101,180,255,.5); box-shadow: 0 0 24px rgba(42,134,255,.16); } }
@keyframes model-tab-progress { from { width: 0; opacity: .4; } to { width: 100%; opacity: 1; } }
@keyframes model-liquid-in { from { opacity: 0; transform: translateY(14px) scale(.985); filter: blur(9px); } to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } }
@keyframes model-liquid-out { from { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } to { opacity: 0; transform: translateY(-9px) scale(1.012); filter: blur(7px); } }
@keyframes mix-pack-pulse { 0%, 24%, 100% { transform: scale(1); border-color: rgba(255,255,255,.1); background: rgba(4,10,18,.4); box-shadow: none; } 8% { transform: scale(1.07); border-color: rgba(101,177,255,.52); background: rgba(29,94,170,.25); box-shadow: 0 0 28px rgba(42,134,255,.2); } }
@keyframes mix-flow-left { 0%, 7% { left: 0; opacity: 0; } 10% { opacity: 1; } 21% { left: 100%; opacity: 1; } 24%,100% { left: 100%; opacity: 0; } }
@keyframes mix-flow-right { 0%, 7% { right: 0; opacity: 0; } 10% { opacity: 1; } 21% { right: 100%; opacity: 1; } 24%,100% { right: 100%; opacity: 0; } }
@keyframes mix-flow-down { 0%, 54% { top: 0; opacity: 0; } 57% { opacity: 1; } 69% { top: 100%; opacity: 1; } 72%,100% { top: 100%; opacity: 0; } }
@keyframes mix-core-pulse { 0%, 46%, 68%,100% { transform: scale(1); box-shadow: 0 0 30px rgba(42,134,255,.16), inset 0 1px 0 rgba(255,255,255,.13); } 54% { transform: scale(1.1); box-shadow: 0 0 54px rgba(42,134,255,.46), inset 0 1px 0 rgba(255,255,255,.22); } 59% { transform: scale(1.04) rotate(2deg); } 63% { transform: scale(1.09) rotate(-2deg); } }
@keyframes mix-output-reveal { 0%, 64%,100% { transform: scale(.96); opacity: .34; filter: saturate(.65); } 74% { transform: scale(1.035); opacity: 1; filter: saturate(1.2); box-shadow: 0 20px 48px rgba(20,101,204,.28), 0 0 30px rgba(42,134,255,.15); } 86% { transform: scale(1); opacity: 1; filter: saturate(1); } }
@keyframes mix-spin { to { transform: rotate(360deg); } }
@keyframes install-magic-breathe { 0%,100% { transform: scale(1); box-shadow: 0 8px 24px rgba(23,103,220,.24); } 50% { transform: scale(1.025); box-shadow: 0 10px 32px rgba(51,143,255,.42), 0 0 20px rgba(112,87,255,.22); } }
@keyframes coverage-card-breathe { 0%,25%,100% { border-color: var(--glass-line); box-shadow: var(--glass-shadow); } 10%,18% { border-color: rgba(91,171,255,.43); box-shadow: 0 28px 90px rgba(0,0,0,.34), 0 0 38px rgba(42,134,255,.13), inset 0 1px 0 rgba(255,255,255,.08); } }
@keyframes coverage-icon-breathe { 0%,25%,100% { transform: scale(1); box-shadow: 0 0 30px rgba(42,134,255,.16); } 10% { transform: scale(1.09); box-shadow: 0 0 46px rgba(42,134,255,.42), inset 0 0 20px rgba(94,176,255,.12); } 17% { transform: scale(1.04); box-shadow: 0 0 36px rgba(42,134,255,.28); } }
@keyframes confidence-card-breathe { 0%,25%,100% { border-color: var(--glass-line); box-shadow: var(--glass-shadow); } 10%,18% { border-color: rgba(91,171,255,.4); box-shadow: 0 28px 90px rgba(0,0,0,.34), 0 0 36px rgba(42,134,255,.12), inset 0 1px 0 rgba(255,255,255,.08); } }
@keyframes payment-method-pulse { 0%,16%,100% { color: #7d899b; border-color: rgba(255,255,255,.09); background: rgba(255,255,255,.035); box-shadow: none; transform: scale(1); } 7% { color: #dceeff; border-color: rgba(104,181,255,.44); background: rgba(42,134,255,.13); box-shadow: 0 0 22px rgba(42,134,255,.18); transform: scale(1.04); } }
@keyframes replacement-old-fade { 0%,24%,100% { opacity: 1; border-color: rgba(255,255,255,.09); } 35%,58% { opacity: .46; border-color: rgba(255,255,255,.04); } }
@keyframes replacement-new-glow { 0%,42%,100% { transform: scale(1); border-color: rgba(74,171,124,.22); box-shadow: none; } 58%,72% { transform: scale(1.025); border-color: rgba(91,221,158,.48); box-shadow: 0 0 28px rgba(38,174,109,.17); } }
@keyframes replacement-signal { 0%,30% { top: 0; opacity: 0; } 36% { opacity: 1; } 54% { top: 100%; opacity: 1; } 60%,100% { top: 100%; opacity: 0; } }
@keyframes support-ai-pulse { 0%,28%,100% { border-color: rgba(255,255,255,.09); box-shadow: none; } 10%,20% { border-color: rgba(91,172,255,.42); box-shadow: 0 0 24px rgba(42,134,255,.14); } }
@keyframes support-human-pulse { 0%,55%,100% { border-color: rgba(255,255,255,.09); box-shadow: none; } 68%,84% { border-color: rgba(91,221,158,.36); box-shadow: 0 0 24px rgba(38,174,109,.12); } }
@keyframes support-handoff-flow { 0%,27% { left: 16%; opacity: 0; } 34% { opacity: 1; } 59% { left: 84%; opacity: 1; } 66%,100% { left: 84%; opacity: 0; } }
@keyframes campaign-scan-wave { 0%,12% { transform: translate(-50%,-50%) scale(.86); opacity: 0; } 18% { opacity: .72; } 42%,100% { transform: translate(-50%,-50%) scale(1.35); opacity: 0; } }
@keyframes campaign-traveler-one { 0%,13% { transform: translate(-50%,-50%) scale(.6); opacity: 0; } 19% { opacity: 1; } 42% { transform: translate(70px,-85px) scale(1); opacity: 1; } 52%,100% { transform: translate(76px,-92px) scale(.86); opacity: 0; } }
@keyframes campaign-traveler-two { 0%,13% { transform: translate(-50%,-50%) scale(.6); opacity: 0; } 19% { opacity: 1; } 42% { transform: translate(76px,55px) scale(1); opacity: 1; } 52%,100% { transform: translate(82px,62px) scale(.86); opacity: 0; } }
@keyframes campaign-traveler-three { 0%,13% { transform: translate(-50%,-50%) scale(.6); opacity: 0; } 19% { opacity: 1; } 42% { transform: translate(-106px,30px) scale(1); opacity: 1; } 52%,100% { transform: translate(-114px,36px) scale(.86); opacity: 0; } }
@keyframes dashboard-stat-breathe { 0%,18%,100% { border-color: rgba(126,151,184,.24); box-shadow: inset 0 1px 0 rgba(255,255,255,.025); } 8%,13% { border-color: rgba(83,161,255,.4); box-shadow: 0 0 24px rgba(42,134,255,.12), inset 0 1px 0 rgba(255,255,255,.05); } }
@keyframes dashboard-category-pulse { 0%,38%,100% { transform: scale(1); filter: saturate(.86); } 16%,28% { transform: scale(1.018); filter: saturate(1.22); box-shadow: 0 0 24px rgba(52,135,255,.1); } }
@keyframes dashboard-traffic-live { 0%,100% { width: 70%; filter: brightness(1); } 50% { width: 67%; filter: brightness(1.18); } }
@keyframes journey-signal-horizontal { from { left: 0; opacity: 0; } 4% { opacity: 1; } 96% { opacity: 1; } to { left: calc(100% - 9px); opacity: 0; } }
@keyframes journey-signal-vertical { from { top: 0; opacity: 0; } 4% { opacity: 1; } 96% { opacity: 1; } to { top: calc(100% - 9px); opacity: 0; } }
@keyframes journey-step-breathe { 0%,24%,100% { background: linear-gradient(180deg, rgba(42,134,255,0), rgba(42,134,255,0)); box-shadow: none; } 8%,17% { background: linear-gradient(180deg, rgba(42,134,255,.07), rgba(42,134,255,.015)); box-shadow: inset 0 1px 0 rgba(103,181,255,.12), 0 0 32px rgba(42,134,255,.06); } }
@keyframes journey-number-pulse { 0%,24%,100% { transform: scale(1); border-color: rgba(78,164,255,.28); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); } 8% { transform: scale(1.12); border-color: rgba(112,194,255,.62); box-shadow: 0 0 30px rgba(42,134,255,.34), inset 0 1px 0 rgba(255,255,255,.14); } 16% { transform: scale(1.04); } }
@keyframes test-flow-signal { 0% { left: 8%; opacity: 0; } 5% { opacity: 1; } 95% { opacity: 1; } 100% { left: calc(92% - 8px); opacity: 0; } }
@keyframes test-step-breathe { 0%,24%,100% { filter: brightness(.82); } 8%,17% { filter: brightness(1.3); } }
@keyframes test-orb-reward { 0%,72%,100% { transform: scale(1); box-shadow: 0 0 60px rgba(42,134,255,.28); } 82% { transform: scale(1.1); box-shadow: 0 0 82px rgba(42,134,255,.52), inset 0 1px 0 rgba(255,255,255,.28); } 90% { transform: scale(1.04); } }
@keyframes activation-panel-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes mobile-activation-cue {
  0%, 18%, 100% { color: #758297; background: transparent; text-shadow: none; }
  6%, 12% { color: #fff; background: rgba(42,134,255,.105); text-shadow: 0 0 16px rgba(91,169,255,.5); }
}
@keyframes mobile-model-cue {
  0%, 45%, 100% { color: #7d8899; background: transparent; text-shadow: none; }
  10%, 35% { color: #fff; background: rgba(42,134,255,.09); text-shadow: 0 0 18px rgba(96,174,255,.34); }
}
.model-switcher.is-mobile-manual:not(.is-manually-selected) .model-tab { animation: mobile-model-cue 8s ease-in-out infinite; }
.model-switcher.is-mobile-manual:not(.is-manually-selected) .model-tab:nth-child(2) { animation-delay: 4s; }
@keyframes money-node-pulse {
  0%, 18%, 100% { transform: scale(1); border-color: rgba(255,255,255,.09); background: rgba(4,10,18,.35); box-shadow: none; }
  8% { transform: scale(1.055); border-color: rgba(101,177,255,.5); background: rgba(31,94,168,.24); box-shadow: 0 0 30px rgba(42,134,255,.22), inset 0 1px 0 rgba(255,255,255,.1); }
}
@keyframes money-signal { 0%, 14% { left: 0; opacity: 0; } 17% { opacity: 1; } 31% { left: 100%; opacity: 1; } 34%, 100% { left: 100%; opacity: 0; } }
@keyframes money-signal-vertical { 0%, 14% { top: 0; opacity: 0; } 17% { opacity: 1; } 31% { top: 100%; opacity: 1; } 34%, 100% { top: 100%; opacity: 0; } }

@media (max-width: 980px) {
  .desktop-nav { display: none; }.menu-button { display: block; }
  .hero { grid-template-columns: 1fr; padding-top: 150px; text-align: center; }
  .hero-copy { display: flex; flex-direction: column; align-items: center; }
  .hero-stage { min-height: 500px; }.hero-art { width: 120%; right: -10%; }
  .scroll-cue { display: none; }
  .signal-strip { grid-template-columns: repeat(2, 1fr); row-gap: 28px; }
  .signal-strip div:nth-child(2) { border-right: 0; }.signal-strip div:nth-child(3) { padding-left: 0; }
  .audience-section, .control-section { grid-template-columns: 1fr; gap: 56px; }
  .audience-orbit { width: min(100%, 610px); justify-self: center; }
  .section-heading { grid-template-columns: 1fr; }.section-heading > p:last-child { margin: 28px 0 0; }
  .activation-panel { grid-template-columns: 1fr; gap: 42px; }.activation-visual { width: min(100%, 520px); }
  .model-panel { grid-template-columns: 1fr; }.model-visual { min-height: 380px; }
  .experience-card-large, .qr-section, .earning-card, .story-grid, .faq-section { grid-template-columns: 1fr; }
  .confidence-grid { grid-template-columns: 1fr; }
  .coverage-grid { grid-template-columns: 1fr; }.coverage-option { min-height: 330px; }.coverage-option-featured { transform: none; }
  .money-flows { grid-template-columns: 1fr; }.wallet-clarity { grid-template-columns: 1fr; }.wallet-clarity > div + div { padding: 24px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .phone-mockup { width: min(70%, 310px); }
  .qr-section, .faq-section { gap: 56px; }
  .journey-steps { grid-template-columns: 1fr 1fr; }.journey-steps::after { display: none; }.journey-steps li:nth-child(2) { border-right: 0; }.journey-steps li:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .test-card { grid-template-columns: auto 1fr; }.test-actions { grid-column: 2; width: min(100%, 340px); }
  .footer-main { grid-template-columns: 1.5fr 1fr 1.3fr; }
}

@media (max-width: 760px), (pointer: coarse) {
  .activation-panels { display: block; }
  .activation-panel { grid-area: auto; }
  .activation-panel[hidden] { display: none; }
}

@media (max-width: 640px) {
  html, body { width: 100%; max-width: 100%; overflow-x: clip; }
  main { width: 100vw; max-width: 100%; overflow: hidden; }
  .site-header { top: 10px; width: calc(100% - 20px); padding-left: 16px; }
  .header-actions .button { display: none; }.language-button { display: block; }
  .hero { width: calc(100vw - 30px); max-width: none; margin-inline: auto; padding: 124px 0 60px; gap: 20px; }
  .hero h1 { font-size: clamp(3.15rem, 15vw, 4.6rem); }.hero-lead { font-size: 1rem; }
  .hero-actions { width: 100%; flex-direction: column; }.hero-actions .button { width: 100%; }
  .hero-stage { min-height: 400px; }.hero-art { width: 130%; right: -15%; object-position: 58% center; }.card-coverage { left: 0; top: 7%; }.card-speed { right: 0; bottom: 10%; }.country-sphere { --sphere-size: 43px; }
  .signal-strip { width: calc(100vw - 30px); max-width: none; margin-inline: auto; grid-template-columns: 1fr 1fr; }.signal-strip div, .signal-strip div:first-child, .signal-strip div:nth-child(3) { padding-left: 12px; padding-right: 12px; }
  .signal-strip strong { font-size: 17px; }.signal-strip span { font-size: 11px; }
  .section { width: calc(100vw - 30px); max-width: none; margin-inline: auto; padding: 100px 0; }.section > * { max-width: 100%; }.section-heading h2 { font-size: 3rem; }
  .audience-copy h2, .control-copy h2 { font-size: 3rem; }.audience-orbit { min-height: 420px; }.audience-core { width: 112px; height: 112px; font-size: 13px; }.audience-core > span { font-size: 11px; }.audience-pill, .audience-signal { --orbit-radius: clamp(105px, 32vw, 145px); }.audience-pill { font-size: 11px; }.audience-pill > span { padding: 9px 12px; }.audience-signal { width: calc(var(--orbit-radius) - 56px); animation-name: signal-clockwise-mobile, signal-pulse; }
  .activation-experience { margin-top: 46px; border-radius: 22px; }.activation-tabs { grid-template-columns: 1fr 1fr; }.activation-tab { min-height: 62px; padding: 0 14px; border-bottom: 1px solid var(--line); }.activation-tab:nth-child(2) { border-right: 0; }.activation-panel { min-height: 0; padding: 38px 20px; gap: 32px; }.activation-panel h3 { font-size: 2.8rem; }.activation-panel p { font-size: 16px; }.activation-visual { min-height: 260px; border-radius: 21px; }.activation-visual.boarding-pass-email { min-height: 0; padding: 20px 17px; }.boarding-pass-email .bp-divider { margin: 15px -17px; }.boarding-pass-email .bp-qr { flex-basis: 58px; width: 58px; height: 58px; }.install-account-phone { width: min(100%, 330px); min-height: 430px; border-radius: 34px; }.network-visual strong { font-size: 62px; }
  .activation-experience.is-mobile-manual:not(.is-manually-selected) .activation-tab { animation: mobile-activation-cue 12s ease-in-out infinite; }
  .activation-experience.is-mobile-manual:not(.is-manually-selected) .activation-tab:nth-child(2) { animation-delay: 3s; }
  .activation-experience.is-mobile-manual:not(.is-manually-selected) .activation-tab:nth-child(3) { animation-delay: 6s; }
  .activation-experience.is-mobile-manual:not(.is-manually-selected) .activation-tab:nth-child(4) { animation-delay: 9s; }
  .confidence-heading h2 { font-size: 3rem; }.confidence-grid { margin-top: 46px; grid-template-columns: 1fr; }.confidence-card { min-height: 430px; padding: 22px; border-radius: 22px; }.confidence-visual { min-height: 200px; margin: 0 0 28px; border-radius: 18px; }
  .model-switcher { margin-top: 46px; border-radius: 20px; }.model-tab { padding: 18px 8px; font-size: 13px; }
  .model-panel { padding: 30px 20px; min-height: 0; gap: 34px; }.model-copy h3 { font-size: 2.8rem; }.model-copy p { font-size: 16px; }
  .model-visual { min-height: 390px; }.ticket-card { width: 94%; padding: 18px; border-radius: 22px; }.ticket-card .bp-divider { margin: 14px -18px; }.ticket-card .bp-install { margin-top: 13px; padding-top: 13px; }.ticket-card .bp-qr { flex-basis: 52px; width: 52px; height: 52px; }
  .experience-grid { grid-template-columns: 1fr; margin-top: 46px; }.experience-card, .experience-card-large { grid-column: auto; min-height: 0; padding: 28px 22px; grid-template-columns: 1fr; gap: 34px; border-radius: 20px; }.phone-mockup { width: min(86%, 280px); }.mix-machine { grid-template-columns: minmax(0,1fr) 18px 64px 18px minmax(0,1fr); gap: 4px; }.mix-pack { min-height: 82px; padding: 10px 4px; }.mix-pack strong { font-size: 14px; }.mix-pack small { font-size: 6px; }.mix-core { width: 64px; height: 64px; }.mix-core strong { font-size: 12px; }.mix-core span { font-size: 5px; }.mix-output { width: 100%; padding: 14px 10px; }.mix-output b { font-size: 19px; }
  .coverage-grid { margin-top: 46px; }.coverage-option { min-height: 310px; padding: 26px 22px; border-radius: 22px; }.coverage-icon { margin: 38px 0 24px; }.network-note { align-items: flex-start; padding: 20px; }
  .qr-section { gap: 42px; }.qr-copy h2 { font-size: 3rem; }.qr-demo { min-height: 0; padding: 22px 16px; border-radius: 20px; }.qr-app-header > div > i { width: 34px; height: 34px; }.qr-app-header strong { font-size: 17px; }.qr-app-header > span { padding: 10px; font-size: 8px; }.qr-app-tabs { margin-top: 17px; }.campaign-body { padding: 18px 10px; gap: 6px; }.campaign-qr-stage { flex-basis: 146px; transform: scale(.82); margin: -17px; }.campaign-offer-head { gap: 5px; }.qr-app-actions { gap: 5px; }.qr-app-actions > span { min-height: 31px; padding: 6px 8px; }
  .earning-card { padding: 38px 22px; gap: 40px; border-radius: 22px; }.earning-card h2 { font-size: 3.1rem; }.earning-value strong { font-size: 43px; }
  .money-flows { margin-top: 46px; }.money-flow { min-height: 0; padding: 26px 20px; border-radius: 22px; }.money-flow-heading { align-items: flex-start; flex-direction: column; gap: 8px; }.money-route { margin: 46px 0 38px; grid-template-columns: 1fr; gap: 10px; }.money-route > div { min-height: 94px; }.money-route > i { width: 1px; height: 25px; justify-self: center; background: linear-gradient(rgba(42,134,255,.16), rgba(74,159,255,.58), rgba(42,134,255,.16)); }.money-route > i b { top: 0; left: 50%; animation-name: money-signal-vertical; }.wallet-clarity { padding: 22px 18px; border-radius: 20px; }.wallet-clarity > div { align-items: flex-start; }
  .control-dashboard { min-height: 0; padding: 22px 16px 68px; border-radius: 24px; }.dashboard-kpis { grid-template-columns: 1fr; }.dashboard-kpi { min-height: 78px; }.dashboard-level { min-height: 82px; }.dashboard-income-card { padding: 15px; }.dashboard-category { min-height: 74px; }
  .journey-steps { grid-template-columns: 1fr; border-top: 0; border-left: 1px solid var(--line); }.journey-steps::before { left: -1px; right: auto; top: 0; bottom: 0; width: 1px; height: auto; background: linear-gradient(180deg, transparent, rgba(76,163,255,.58), transparent); }.journey-steps::after { display: block; left: -5px; top: 0; animation-name: journey-signal-vertical; }.journey-steps li { min-height: 220px; border-right: 0; border-bottom: 1px solid var(--line); }.journey-steps strong { margin-top: 42px; }
  .test-card { padding: 34px 22px; grid-template-columns: 1fr; text-align: center; }.test-orb { margin: 0 auto; }.test-actions { grid-column: auto; width: 100%; min-width: 0; }.test-actions > p { max-width: none; }.test-card h2 { font-size: 3rem; }.test-flow { grid-template-columns: 1fr 1fr; gap: 16px 8px; }.test-flow::before, .test-flow::after { display: none; }.test-flow > span { min-height: 82px; align-content: start; }
  .story-grid { padding: 50px 0; gap: 50px; }.story-years strong { font-size: 8rem; }.story-copy h2 { font-size: 3.1rem; }
  .faq-section { gap: 42px; }.faq-heading h2 { font-size: 3rem; }
  .final-cta-card { min-height: 480px; padding: 48px 20px; border-radius: 24px; }.final-cta-card h2 { font-size: 3.3rem; }.final-cta-card > div { width: 100%; flex-direction: column; }.final-cta-card .button { width: 100%; }
  .site-footer { width: calc(100vw - 30px); max-width: none; margin-inline: auto; }.footer-main { grid-template-columns: 1fr; gap: 36px; }.footer-bottom { gap: 18px; flex-direction: column; }
  .modal-card { padding: 34px 22px 26px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .audience-pill { animation: none !important; transform: translate(-50%,-50%) rotate(var(--orbit-start)) translateX(var(--orbit-radius)) rotate(var(--orbit-start-negative)); }
  .audience-pill > span { animation: none !important; }
  .audience-signal { animation: none !important; opacity: .28; transform: rotate(var(--orbit-start)); }
  .audience-core, .coverage-icon, .test-orb, .network-pulse {
    animation: reduced-motion-breathe 7s ease-in-out infinite !important;
  }
}

@keyframes reduced-motion-breathe {
  0%, 100% { opacity: .84; filter: brightness(.94); }
  50% { opacity: 1; filter: brightness(1.12); }
}
