:root {
  --landing-bg: #041427;
  --landing-surface: #08213d;
  --landing-surface-2: #0c2e52;
  --landing-blue: #55b8ff;
  --landing-red: #f23c58;
  --landing-white: #f7fbff;
  --landing-muted: #8fa8bc;
  --landing-line: rgba(125, 181, 231, .18);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--landing-bg); color: var(--landing-white); font-family: Inter, Arial, Helvetica, sans-serif; }
button, a { -webkit-tap-highlight-color: transparent; }
.landing-body { padding: 0 !important; }
.landing { min-width: 320px; overflow: hidden; background: radial-gradient(circle at 82% 4%, rgba(36,152,236,.12), transparent 26%), var(--landing-bg); }

.landing-header {
  position: relative;
  z-index: 30;
  width: min(calc(100% - 48px), 1400px);
  height: 84px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  border-bottom: 1px solid var(--landing-line);
}

.landing-brand {
  display: inline-flex;
  width: max-content;
  align-items: center;
  gap: 10px;
  color: white;
  font-size: 25px;
  font-style: italic;
  font-weight: 950;
  letter-spacing: -1.3px;
  text-decoration: none;
}

.landing-brand b { color: var(--landing-red); }
.landing-identity { display: flex; align-items: center; gap: 13px; }
.landing-country {
  padding: 5px 7px;
  border: 1px solid rgba(85,184,255,.18);
  border-radius: 6px;
  color: #83a0b5;
  background: rgba(85,184,255,.045);
  font-size: 7px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .8px;
}
.landing-brand__mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 9px 18px 9px 18px;
  color: #06182e;
  background: linear-gradient(135deg, #f7fbff 0 47%, var(--landing-blue) 47% 72%, var(--landing-red) 72%);
  font-size: 19px;
  box-shadow: 0 10px 28px rgba(0, 8, 24, .25);
}

.landing-nav { display: flex; align-items: center; gap: 34px; }
.landing-nav a, .landing-link {
  color: #a9bdcc;
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}
.landing-nav a:hover, .landing-link:hover { color: white; }
.landing-header__actions { justify-self: end; display: flex; align-items: center; gap: 18px; }

.landing-button {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 22px;
  padding: 0 20px;
  border: 0;
  border-radius: 11px;
  color: #06182e;
  background: linear-gradient(100deg, var(--landing-blue), #289ce9);
  box-shadow: 0 16px 36px rgba(36,152,236,.22);
  font-size: 13px;
  font-weight: 950;
  text-decoration: none;
}
.landing-button span { font-size: 18px; }
.landing-button:hover { transform: translateY(-2px); box-shadow: 0 20px 42px rgba(36,152,236,.31); }
.landing-button--small { min-height: 40px; padding: 0 15px; border-radius: 9px; font-size: 11px; box-shadow: none; }

.landing-hero {
  position: relative;
  width: min(calc(100% - 48px), 1400px);
  min-height: 690px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  align-items: center;
  gap: clamp(38px, 6vw, 100px);
  padding: 70px 0 86px;
}
.landing-hero::before {
  content: "";
  position: absolute;
  left: -15vw;
  bottom: 0;
  width: 42vw;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(85,184,255,.42));
}
.landing-kicker {
  margin: 0 0 20px;
  color: var(--landing-blue);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2.1px;
}
.landing-kicker i {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 9px;
  border-radius: 50%;
  background: var(--landing-red);
  box-shadow: 0 0 0 5px rgba(242,60,88,.1);
}
.landing-hero h1 {
  max-width: 690px;
  margin: 0;
  font-size: clamp(54px, 5.7vw, 88px);
  line-height: .95;
  letter-spacing: -4.7px;
}
.landing-hero h1 em, .final-cta h2 em { color: var(--landing-red); font-style: normal; }
.landing-hero__lead {
  max-width: 620px;
  margin: 28px 0 0;
  color: #b4c6d4;
  font-size: 17px;
  line-height: 1.65;
}
.landing-hero__actions { display: flex; align-items: center; gap: 24px; margin-top: 34px; }
.landing-secondary { color: #dce8f1; font-size: 12px; font-weight: 800; text-decoration: none; border-bottom: 1px solid rgba(220,232,241,.3); padding: 8px 0; }
.landing-secondary:hover { color: white; border-color: var(--landing-blue); }
.landing-proof { display: flex; flex-wrap: wrap; gap: 21px; margin-top: 42px; color: #718ca1; font-size: 10px; }
.landing-proof span { display: flex; align-items: center; gap: 7px; }
.landing-proof b { color: white; font-size: 11px; }

.hero-community {
  position: relative;
  min-width: 0;
  min-height: 610px;
  overflow: visible;
  border: 1px solid rgba(125,181,231,.24);
  border-radius: 32px 10px 32px 10px;
  background: #071a30;
  box-shadow: 0 48px 110px rgba(0,7,20,.52);
}
.hero-community::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 12% -8% -8% 14%;
  border-radius: 50%;
  background: rgba(36,152,236,.18);
  filter: blur(75px);
}
.hero-community__image {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  border-radius: inherit;
  object-fit: cover;
  object-position: 58% center;
}
.hero-community__image--mobile { display: none; }
.hero-community__shade {
  position: absolute;
  z-index: 2;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(3,16,31,.82) 0%, rgba(3,16,31,.2) 46%, transparent 72%), linear-gradient(0deg, rgba(3,16,31,.72), transparent 42%);
}
.hero-community__badge {
  position: absolute;
  z-index: 3;
  top: 22px;
  left: 22px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 9px;
  color: #eaf5fc;
  background: rgba(3,17,33,.67);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 1.1px;
  backdrop-filter: blur(12px);
}
.hero-community__badge i { width: 7px; height: 7px; border-radius: 50%; background: var(--landing-red); box-shadow: 0 0 0 5px rgba(242,60,88,.12); }

.phone-device {
  position: relative;
  overflow: hidden;
  width: 246px;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.19);
  border-radius: 34px;
  background: #07101d;
  box-shadow: 0 30px 70px rgba(0,5,16,.58), inset 0 0 0 2px rgba(255,255,255,.035);
}
.phone-device::before {
  content: "";
  position: absolute;
  z-index: 4;
  top: 12px;
  left: 50%;
  width: 68px;
  height: 18px;
  border-radius: 20px;
  background: #07101d;
  transform: translateX(-50%);
}
.phone-device__screen {
  position: relative;
  min-height: 460px;
  overflow: hidden;
  padding: 27px 12px 48px;
  border-radius: 27px;
  background: radial-gradient(circle at 80% 5%, rgba(85,184,255,.12), transparent 28%), #061a30;
}
.phone-device__topbar { display: flex; align-items: center; justify-content: space-between; padding: 0 3px 20px; color: white; font-size: 11px; font-style: italic; font-weight: 950; }
.phone-device__topbar b { color: var(--landing-red); }.phone-device__topbar small { color: #65849b; font-size: 6px; font-style: normal; letter-spacing: 1px; }
.phone-device__heading { margin: 4px 3px 16px; }.phone-device__heading small, .phone-device__heading strong { display: block; }.phone-device__heading small { color: var(--landing-blue); font-size: 6px; font-weight: 900; letter-spacing: 1.2px; }.phone-device__heading strong { margin-top: 6px; color: white; font-size: 19px; letter-spacing: -.7px; }
.phone-match { padding: 13px; border: 1px solid rgba(125,181,231,.2); border-radius: 13px; background: linear-gradient(145deg, rgba(13,48,84,.94), rgba(6,26,48,.98)); }
.phone-match > small { color: #7d9bb0; font-size: 6px; font-weight: 800; letter-spacing: .7px; }
.phone-match > div:not(.phone-choices) { min-height: 70px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 7px; text-align: center; }
.phone-match > div > b { color: #f4f9fc; font-size: 8px; line-height: 1.25; }.phone-match > div > span { color: #66859b; font-size: 6px; font-weight: 900; }
.phone-choices { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; }
.phone-choices span { display: grid; min-height: 42px; place-items: center; align-content: center; border: 1px solid rgba(85,184,255,.18); border-radius: 7px; background: #102f53; }
.phone-choices small, .phone-choices b { display: block; }.phone-choices small { color: #718fa4; font-size: 6px; }.phone-choices b { margin-top: 2px; color: var(--landing-blue); font-size: 9px; }
.phone-device__nav { position: absolute; right: 0; bottom: 0; left: 0; min-height: 43px; display: grid; grid-template-columns: repeat(3,1fr); place-items: center; border-top: 1px solid rgba(125,181,231,.12); color: #57758c; background: rgba(4,19,36,.93); font-size: 6px; }.phone-device__nav b { color: var(--landing-blue); }
.phone-device--hero { position: absolute; z-index: 4; bottom: -35px; left: -35px; transform: rotate(-3deg); }

.mobile-showcase {
  width: min(calc(100% - 48px), 1320px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  align-items: center;
  gap: clamp(54px, 7vw, 110px);
  padding: 135px 0 105px;
}
.mobile-showcase__copy h2 { margin: 0; font-size: clamp(40px,4.6vw,64px); line-height: 1; letter-spacing: -3px; }
.mobile-showcase__copy > p:not(.landing-kicker) { color: #8fa8bc; font-size: 15px; line-height: 1.75; }
.mobile-showcase__points { display: grid; gap: 13px; margin-top: 28px; }
.mobile-showcase__points span { display: flex; align-items: center; gap: 12px; color: #bdd0dd; font-size: 11px; font-weight: 750; }
.mobile-showcase__points i { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(85,184,255,.2); border-radius: 9px; color: var(--landing-blue); background: rgba(85,184,255,.07); font-size: 7px; font-style: normal; font-weight: 950; }
.phone-gallery { position: relative; min-height: 620px; display: flex; align-items: center; justify-content: center; padding: 45px 0; }
.phone-gallery::before { content: ""; position: absolute; inset: 16% 5%; border-radius: 50%; background: rgba(36,152,236,.14); filter: blur(70px); }
.phone-device--gallery { position: relative; z-index: 2; flex: 0 0 auto; width: 228px; }
.phone-device--gallery .phone-device__screen { min-height: 480px; }
.phone-device--left { margin-right: -55px; transform: rotate(-7deg) translateY(22px); }
.phone-device--center { z-index: 4; transform: translateY(-18px); box-shadow: 0 42px 95px rgba(0,5,16,.68), 0 0 0 1px rgba(85,184,255,.18); }
.phone-device--right { margin-left: -55px; transform: rotate(7deg) translateY(24px); }
.phone-match--compact > div:not(.phone-choices) { min-height: 62px; }
.phone-match--ghost { margin-top: 9px; opacity: .55; }.phone-match--ghost > div:not(.phone-choices) { min-height: 46px; grid-template-columns: 1fr auto; text-align: left; }.phone-match--ghost > div > span { color: var(--landing-blue); font-size: 12px; }
.phone-bet-preview { padding: 15px; border: 1px solid rgba(125,181,231,.2); border-radius: 13px; background: linear-gradient(145deg, rgba(13,48,84,.94), rgba(6,26,48,.98)); }
.phone-bet-preview__tag { display: inline-flex; padding: 5px 7px; border-radius: 5px; color: var(--landing-blue); background: rgba(85,184,255,.1); font-size: 6px; font-weight: 900; letter-spacing: .8px; }
.phone-bet-preview > strong, .phone-bet-preview > small { display: block; }.phone-bet-preview > strong { margin-top: 18px; font-size: 12px; }.phone-bet-preview > small { margin-top: 6px; color: #708da2; font-size: 7px; }
.phone-bet-preview > div { display: flex; align-items: center; justify-content: space-between; margin-top: 22px; padding-top: 13px; border-top: 1px solid rgba(125,181,231,.14); color: #7894a8; font-size: 7px; }.phone-bet-preview > div b { color: white; font-size: 11px; }
.phone-action { width: 100%; min-height: 40px; margin-top: 12px; border: 0; border-radius: 8px; color: #05172b; background: linear-gradient(100deg,var(--landing-blue),#289ce9); font-size: 8px; font-weight: 950; }.phone-note { margin: 9px 0 0; color: #617e94; font-size: 6px; text-align: center; }
.phone-wallet-preview { padding: 17px 13px; border: 1px solid rgba(85,184,255,.22); border-radius: 13px; background: linear-gradient(145deg, rgba(15,54,94,.96), rgba(7,29,54,.98)); }.phone-wallet-preview > small, .phone-wallet-preview > strong { display: block; }.phone-wallet-preview > small { color: #7b98ad; font-size: 6px; letter-spacing: .8px; }.phone-wallet-preview > strong { margin-top: 9px; font-size: 24px; letter-spacing: -1.2px; }.phone-wallet-preview > strong span { color: var(--landing-blue); font-size: 7px; letter-spacing: 0; }.phone-wallet-preview button { width: 100%; min-height: 34px; margin-top: 16px; border: 0; border-radius: 7px; color: #06182e; background: var(--landing-blue); font-size: 7px; font-weight: 950; }
.phone-transactions { margin-top: 18px; }.phone-transactions > small { color: #6f8da3; font-size: 6px; font-weight: 900; letter-spacing: .8px; }.phone-transactions p { display: flex; align-items: center; justify-content: space-between; margin: 9px 0 0; padding: 10px; border: 1px solid rgba(125,181,231,.12); border-radius: 9px; background: rgba(9,36,65,.62); }.phone-transactions p span, .phone-transactions p em { display: block; }.phone-transactions p span { color: #dbe8f1; font-size: 7px; font-weight: 800; }.phone-transactions p em { margin-top: 3px; color: #638097; font-size: 6px; font-style: normal; font-weight: 500; }.phone-transactions p b { color: #ff8395; font-size: 8px; }.phone-transactions p b.is-positive { color: var(--landing-blue); }

.product-stage { position: relative; min-width: 0; padding: 45px 20px; }
.product-glow { position: absolute; inset: 8% 4%; border-radius: 50%; background: rgba(36,152,236,.16); filter: blur(70px); }
.product-window {
  position: relative;
  z-index: 2;
  overflow: hidden;
  border: 1px solid rgba(125,181,231,.26);
  border-radius: 24px 8px 24px 8px;
  background: rgba(5,24,46,.9);
  box-shadow: 0 46px 100px rgba(0,7,20,.52);
  transform: perspective(1200px) rotateY(-5deg) rotateX(2deg);
  backdrop-filter: blur(18px);
}
.product-window__top { height: 58px; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; border-bottom: 1px solid var(--landing-line); background: rgba(3,17,33,.72); }
.product-logo { font-size: 15px; font-style: italic; font-weight: 950; }.product-logo b { color: var(--landing-red); }
.product-status { display: flex; align-items: center; gap: 7px; color: #7f9bb0; font-size: 8px; font-weight: 850; letter-spacing: 1px; }
.product-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--landing-blue); box-shadow: 0 0 0 4px rgba(85,184,255,.09); }
.product-window__body { display: grid; grid-template-columns: 1.35fr .65fr; gap: 13px; padding: 18px; }
.product-fixture, .product-bet { border: 1px solid var(--landing-line); border-radius: 14px; background: linear-gradient(145deg, rgba(12,46,82,.85), rgba(6,25,47,.95)); }
.product-fixture { padding: 19px; }
.product-fixture__meta { display: flex; justify-content: space-between; align-items: center; color: var(--landing-blue); font-size: 8px; font-weight: 900; letter-spacing: 1px; }
.product-fixture__meta small { color: #7892a7; font-size: 8px; letter-spacing: 0; }
.product-teams { min-height: 135px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; text-align: center; }
.product-teams strong { font-size: clamp(12px, 1.15vw, 16px); line-height: 1.25; }
.product-teams span { color: #68859a; font-size: 9px; font-weight: 900; }
.product-odds { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.product-odds button { min-height: 52px; border: 1px solid rgba(125,181,231,.17); border-radius: 9px; color: white; background: #102f53; }
.product-odds small, .product-odds b { display: block; }.product-odds small { color: #6f8da3; font-size: 8px; }.product-odds b { margin-top: 4px; color: var(--landing-blue); font-size: 13px; }
.product-bet { padding: 17px; }
.product-bet > div:first-child { display: flex; justify-content: space-between; color: white; font-size: 9px; font-weight: 900; }
.product-bet > div:first-child small { color: #708ba0; font-size: 7px; font-weight: 500; }
.product-bet > p { margin: 22px 0; padding: 13px 0; border-top: 1px solid var(--landing-line); border-bottom: 1px solid var(--landing-line); }
.product-bet > p b, .product-bet > p strong { display: block; }.product-bet > p b { font-size: 10px; }.product-bet > p strong { margin-top: 6px; color: var(--landing-blue); font-size: 18px; }
.product-stake { display: flex; justify-content: space-between; color: #7892a7; font-size: 9px; }.product-stake b { color: white; }
.product-bet > button { width: 100%; min-height: 43px; margin-top: 15px; border: 0; border-radius: 8px; color: #06182e; background: var(--landing-blue); font-size: 9px; font-weight: 950; }
.product-bet > small { display: block; margin-top: 10px; color: #688399; font-size: 7px; text-align: center; }
.stage-chip { position: absolute; z-index: 4; padding: 10px 13px; border: 1px solid rgba(125,181,231,.24); border-radius: 9px; color: #c6d9e7; background: rgba(5,24,46,.86); box-shadow: 0 14px 36px rgba(0,8,24,.3); font-size: 8px; font-weight: 850; backdrop-filter: blur(12px); }
.stage-chip--top { top: 16px; right: 0; }.stage-chip--bottom { bottom: 20px; left: 0; color: #ff9baa; border-color: rgba(242,60,88,.24); }

.landing-strip { min-height: 72px; display: flex; justify-content: center; align-items: center; gap: clamp(20px,4vw,62px); border-top: 1px solid var(--landing-line); border-bottom: 1px solid var(--landing-line); color: #718da2; background: rgba(5,24,46,.56); font-size: 9px; font-weight: 850; letter-spacing: 1.2px; text-transform: uppercase; }
.landing-strip i { width: 4px; height: 4px; border-radius: 50%; background: var(--landing-red); }

.landing-section, .how-section, .pool-section, .trust-section { width: min(calc(100% - 48px), 1320px); margin: 0 auto; padding: 120px 0; }
.section-intro { max-width: 660px; }
.section-intro h2, .pool-copy h2, .final-cta h2 { margin: 0; font-size: clamp(38px,4.4vw,62px); line-height: 1.02; letter-spacing: -3px; }
.section-intro > p:last-child, .pool-copy > p { color: #8fa8bc; font-size: 15px; line-height: 1.7; }
.feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 58px; }
.feature-card { position: relative; min-height: 340px; overflow: hidden; padding: 34px; border: 1px solid var(--landing-line); border-radius: 20px 7px 20px 7px; background: linear-gradient(145deg, rgba(11,43,76,.88), rgba(5,23,43,.95)); }
.feature-card--wide { grid-column: 1 / -1; min-height: 300px; display: grid; grid-template-columns: minmax(0,1fr) .9fr; align-items: center; gap: 50px; }
.feature-number { position: absolute; top: 26px; right: 28px; color: rgba(85,184,255,.18); font-size: 54px; font-weight: 950; letter-spacing: -4px; }
.feature-tag { margin: 0 0 15px; color: var(--landing-blue) !important; font-size: 9px !important; font-weight: 900; letter-spacing: 1.5px; }
.feature-card h3 { max-width: 490px; margin: 0; font-size: 28px; letter-spacing: -1.2px; }
.feature-card > p, .feature-card > div > p { max-width: 520px; color: #849db0; font-size: 13px; line-height: 1.65; }
.mini-schedule { min-height: 92px; display: grid; grid-template-columns: auto 1fr auto 1fr auto; align-items: center; gap: 12px; padding: 15px; border: 1px solid var(--landing-line); border-radius: 13px; background: rgba(5,24,46,.72); }
.mini-schedule span { color: #7f99ad; font-size: 9px; }.mini-schedule b { text-align: center; font-size: 11px; }.mini-schedule i { color: #638198; font-size: 8px; }.mini-schedule em { color: var(--landing-blue); font-size: 18px; font-style: normal; }
.choice-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 42px; }.choice-row span { height: 50px; display: grid; place-items: center; border: 1px solid rgba(85,184,255,.2); border-radius: 9px; color: var(--landing-blue); background: #102f53; font-size: 13px; font-weight: 950; }
.history-preview { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin-top: 42px; padding: 15px; border: 1px solid var(--landing-line); border-radius: 12px; background: rgba(5,24,46,.65); }.history-preview > i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: var(--landing-blue); background: rgba(85,184,255,.1); font-style: normal; }.history-preview span { font-size: 11px; font-weight: 850; }.history-preview small { display: block; margin-top: 4px; color: #6f899e; font-size: 8px; font-weight: 500; }.history-preview > b { color: var(--landing-blue); font-size: 11px; }

.how-section { width: 100%; max-width: none; padding-right: max(24px,calc((100vw - 1320px)/2)); padding-left: max(24px,calc((100vw - 1320px)/2)); background: linear-gradient(180deg, rgba(5,24,46,.46), rgba(10,42,76,.42)); border-top: 1px solid var(--landing-line); border-bottom: 1px solid var(--landing-line); }
.section-intro--center { margin: 0 auto; text-align: center; }
.steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 62px; }
.steps article { min-height: 230px; display: grid; grid-template-columns: auto 1fr; gap: 20px; padding: 28px; border-top: 1px solid rgba(85,184,255,.28); background: rgba(5,24,46,.4); }
.steps article > span { width: 37px; height: 37px; display: grid; place-items: center; border: 1px solid rgba(85,184,255,.28); border-radius: 10px; color: var(--landing-blue); font-size: 11px; font-weight: 950; }
.steps small { color: var(--landing-red); font-size: 8px; font-weight: 900; letter-spacing: 1.3px; }.steps h3 { margin: 13px 0 10px; font-size: 20px; }.steps p { color: #819aad; font-size: 12px; line-height: 1.6; }

.pool-section { display: grid; grid-template-columns: 1fr .88fr; align-items: center; gap: clamp(50px,8vw,120px); }
.pool-copy > p { max-width: 620px; }.pool-copy ul { display: grid; gap: 15px; margin: 30px 0 0; padding: 0; list-style: none; color: #b2c5d3; font-size: 12px; }.pool-copy li { display: flex; align-items: center; gap: 11px; }.pool-copy li span { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 7px; color: var(--landing-blue); background: rgba(85,184,255,.1); font-size: 10px; }
.pool-visual { padding: 28px; border: 1px solid var(--landing-line); border-radius: 22px 8px 22px 8px; background: linear-gradient(145deg, rgba(12,46,82,.9), rgba(5,23,43,.97)); box-shadow: 0 30px 70px rgba(0,8,24,.28); }
.pool-visual__head { display: flex; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--landing-line); color: white; font-size: 10px; font-weight: 900; letter-spacing: 1px; }.pool-visual__head small { color: #708a9f; font-size: 8px; font-weight: 500; letter-spacing: 0; }
.pool-total { padding: 28px 0; text-align: center; }.pool-total small, .pool-total strong { display: block; }.pool-total small { color: #708a9f; font-size: 8px; letter-spacing: 1px; }.pool-total strong { margin-top: 8px; font-size: 40px; letter-spacing: -2px; }.pool-total strong span { color: var(--landing-blue); font-size: 11px; letter-spacing: 0; }
.pool-bars { display: grid; gap: 19px; }.pool-bars > div > span { display: flex; justify-content: space-between; margin-bottom: 8px; }.pool-bars b { font-size: 10px; }.pool-bars small { color: #7790a4; font-size: 9px; }.pool-bars i { display: block; height: 7px; overflow: hidden; border-radius: 10px; background: rgba(255,255,255,.055); }.pool-bars em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--landing-blue),#2d9de9); }
.pool-bars > div:nth-child(2) em { background: linear-gradient(90deg,#9b6cff,var(--landing-red)); }.pool-bars > div:nth-child(3) em { background: linear-gradient(90deg,var(--landing-red),#ff798c); }
.pool-visual > p { display: flex; align-items: center; gap: 9px; margin: 25px 0 0; color: #708a9f; font-size: 8px; }.pool-visual > p i { width: 6px; height: 6px; border-radius: 50%; background: var(--landing-blue); }

.trust-section { padding-top: 20px; }.trust-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 52px; }.trust-grid article { min-height: 210px; padding: 27px; border: 1px solid var(--landing-line); border-radius: 15px 5px 15px 5px; background: rgba(8,33,61,.62); }.trust-grid span { color: var(--landing-red); font-size: 9px; font-weight: 950; }.trust-grid h3 { margin: 28px 0 10px; font-size: 19px; }.trust-grid p { color: #8099ad; font-size: 11px; line-height: 1.65; }
.mvp-notice { margin: 18px 0 0; padding: 15px 18px; border: 1px solid rgba(242,60,88,.18); border-radius: 10px; color: #8da5b8; background: rgba(242,60,88,.035); font-size: 9px; line-height: 1.6; }.mvp-notice b { color: #e6eff6; }

.final-cta { position: relative; width: min(calc(100% - 48px),1320px); min-height: 500px; margin: 30px auto 120px; overflow: hidden; display: grid; place-items: center; align-content: center; padding: 70px 24px; border: 1px solid rgba(85,184,255,.3); border-radius: 30px 9px 30px 9px; text-align: center; background: radial-gradient(circle at 50% 110%, rgba(242,60,88,.2), transparent 38%), radial-gradient(circle at 50% -10%, rgba(85,184,255,.18), transparent 35%), #08213d; }
.final-cta__pattern { position: absolute; inset: 0; opacity: .28; background: repeating-linear-gradient(55deg, transparent 0 34px, rgba(85,184,255,.08) 35px 36px, transparent 37px 70px); }
.final-cta > *:not(.final-cta__pattern) { position: relative; z-index: 2; }.final-cta h2 { max-width: 850px; }.final-cta > p:not(.landing-kicker) { max-width: 560px; margin: 24px 0 28px; color: #9db3c4; font-size: 14px; line-height: 1.6; }
.landing-footer { width: min(calc(100% - 48px),1400px); min-height: 92px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-top: 1px solid var(--landing-line); }.landing-footer .landing-brand { font-size: 18px; }.landing-footer .landing-brand__mark { width: 30px; height: 30px; font-size: 14px; }.landing-footer p { color: #668297; font-size: 9px; }.landing-footer > div { justify-self: end; display: flex; gap: 22px; }.landing-footer > div a { color: #819bad; font-size: 10px; font-weight: 750; text-decoration: none; }.landing-footer > div a:hover { color: white; }

@media (max-width: 1080px) {
  .landing-header { grid-template-columns: 1fr auto; }
  .landing-nav { display: none; }
  .landing-hero { grid-template-columns: 1fr; padding-top: 80px; }
  .landing-hero__copy { max-width: 820px; }
  .hero-community { width: min(100%, 860px); min-height: 590px; margin: 10px auto 30px; }
  .product-stage { width: min(100%,800px); margin: 0 auto; }
  .mobile-showcase { grid-template-columns: 1fr; }
  .mobile-showcase__copy { max-width: 700px; }
  .phone-gallery { width: min(100%,780px); margin: 0 auto; }
  .pool-section { grid-template-columns: 1fr; }
  .pool-visual { width: min(100%,620px); }
}

@media (max-width: 760px) {
  .landing-header, .landing-hero, .landing-section, .mobile-showcase, .pool-section, .trust-section, .final-cta, .landing-footer { width: min(calc(100% - 30px),1400px); }
  .landing-header { height: 72px; }
  .landing-header__actions .landing-link { display: none; }
  .landing-brand { font-size: 21px; }.landing-brand__mark { width: 34px; height: 34px; }
  .landing-hero { min-height: auto; padding: 30px 0 70px; gap: 62px; }
  .hero-community { grid-row: 1; }
  .landing-hero__copy { grid-row: 2; }
  .hero-community__image--desktop { display: none; }
  .hero-community__image--mobile { display: block; }
  .landing-hero h1 { font-size: clamp(48px,13vw,70px); letter-spacing: -3.5px; }
  .landing-hero__lead { font-size: 15px; }
  .landing-proof { gap: 14px; }
  .hero-community { min-height: 540px; margin-bottom: 45px; }
  .phone-device--hero { bottom: -42px; left: 18px; width: 208px; }
  .phone-device--hero .phone-device__screen { min-height: 405px; }
  .product-stage { padding: 25px 0; }
  .product-window { transform: none; }
  .product-window__body { grid-template-columns: 1fr; }
  .stage-chip { display: none; }
  .landing-strip { flex-wrap: wrap; gap: 14px 22px; padding: 20px; }
  .mobile-showcase { padding-top: 95px; padding-bottom: 70px; }
  .phone-gallery { min-height: 570px; justify-content: flex-start; overflow-x: auto; overflow-y: hidden; padding: 50px 35px 70px; scrollbar-width: none; }
  .phone-gallery::-webkit-scrollbar { display: none; }
  .phone-device--gallery { width: 216px; }
  .phone-device--left, .phone-device--center, .phone-device--right { margin: 0 12px 0 0; transform: none; }
  .landing-section, .how-section, .pool-section, .trust-section { padding-top: 85px; padding-bottom: 85px; }
  .section-intro h2, .mobile-showcase__copy h2, .pool-copy h2, .final-cta h2 { font-size: 42px; letter-spacing: -2.3px; }
  .feature-grid, .steps, .trust-grid { grid-template-columns: 1fr; }
  .feature-card--wide { grid-column: auto; grid-template-columns: 1fr; gap: 30px; }
  .landing-footer { grid-template-columns: 1fr auto; padding: 20px 0; }.landing-footer > p { grid-column: 1 / -1; grid-row: 2; }
}

@media (max-width: 480px) {
  .landing-country { display: none; }
  .landing-header__actions .landing-button { min-height: 37px; padding: 0 11px; }
  .landing-hero__actions { align-items: stretch; flex-direction: column; }
  .landing-secondary { width: max-content; }
  .landing-proof { display: grid; grid-template-columns: 1fr 1fr; }
  .hero-community { min-height: 420px; }
  .hero-community__image--mobile { object-position: 55% center; }
  .hero-community__badge { top: 14px; left: 14px; }
  .phone-device--hero { bottom: -34px; left: 12px; width: 182px; }
  .phone-device--hero .phone-device__screen { min-height: 355px; padding-right: 9px; padding-left: 9px; }
  .phone-device--hero .phone-device__heading strong { font-size: 16px; }
  .phone-device--hero .phone-match { padding: 10px; }
  .mobile-showcase { padding-top: 85px; }
  .phone-gallery { margin-right: -15px; margin-left: -15px; }
  .product-window__body { padding: 10px; }.product-fixture { padding: 14px; }.product-teams { min-height: 110px; }
  .feature-card { min-height: 310px; padding: 26px; }
  .mini-schedule { grid-template-columns: auto 1fr auto 1fr; }.mini-schedule em { display: none; }
  .steps article { padding: 22px; }
  .pool-visual { padding: 21px; }
  .final-cta { min-height: 460px; margin-bottom: 70px; }
  .landing-footer > div { gap: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
