:root {
  color-scheme:dark;
  --bg:#100e20;
  --ink:#f6f2ff;
  --muted:#beb5d4;
  --lavender:#c9b7fc;
  --line:#dac9ff24;
  --font:ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth;
  scroll-padding-top:32px}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font);
  -webkit-font-smoothing:antialiased}
a {
  color:inherit;
  text-decoration:none}
a:focus-visible,summary:focus-visible {
  outline:3px solid var(--lavender);
  outline-offset:6px;
  border-radius:5px}
a:hover {
  color:#dfd1ff}
img {
  display:block;
  max-width:100%;
  height:auto}
p {
  line-height:1.7;
  color:var(--muted)}
.wrap {
  width:min(1120px,calc(100% - 64px));
  margin:auto}
.skip {
  position:absolute;
  left:20px;
  top:-80px;
  background:var(--ink);
  color:var(--bg);
  padding:12px;
  z-index:10}
.skip:focus {
  top:16px}
.site-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:28px 0;
  position:relative;
  z-index:2}
.brand {
  display:inline-flex;
  align-items:center;
  gap:11px;
  font-size:27px;
  letter-spacing:-1px;
  font-weight:750}
.brand img {
  width:37px;
  height:37px;
  border-radius:11px}
.site-nav {
  display:flex;
  align-items:center;
  gap:30px;
  font-size:14px;
  color:#d1c8e2}
.nav-pill {
  border:1px solid var(--line);
  background:#ffffff06;
  border-radius:50px;
  padding:11px 19px}
.hero-shell {
  position:relative;
  isolation:isolate;
  overflow:hidden}
.hero-shell:before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,#100e200a 40%,#100e20 100%),url('/assets/clouds.webp') center top/auto 1020px no-repeat}
.hero {
  min-height:740px;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  align-items:center;
  gap:65px;
  padding-top:32px;
  padding-bottom:88px}
.eyebrow {
  font-size:11px;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--lavender);
  margin:0 0 22px}
.availability {
  display:inline-flex;
  align-items:center;
  gap:9px;
  letter-spacing:.9px;
  font-size:11px;
  font-weight:650;
  text-transform:uppercase;
  color:#e1d6f7;
  margin-bottom:26px}
.availability:before {
  content:"";
  width:6px;
  height:6px;
  background:var(--lavender);
  border-radius:100%;
  box-shadow:0 0 12px #c9b7fc80}
h1,h2,h3 {
  letter-spacing:-.045em;
  line-height:1.08;
  margin:0;
  font-weight:750;
  text-wrap:balance}
h1 {
  font-size:clamp(48px,5.3vw,74px)}
h1 span {
  color:#d3bffa}
h2 {
  font-size:clamp(34px,3.8vw,49px)}
h3 {
  font-size:25px;
  letter-spacing:-.035em}
.hero-copy>p {
  font-size:18px;
  max-width:410px;
  margin:26px 0 30px}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:52px;
  padding:14px 25px;
  background:#dfd1ff;
  color:#201535;
  font-size:14px;
  font-weight:700;
  border:1px solid #f5eeff55;
  border-radius:99px;
  box-shadow:0 4px 24px #b395ed16}
.button:hover {
  background:#ece2ff;
  color:#201535}
.button svg {
  width:17px;
  height:17px}
.hero-note {
  display:block;
  font-size:12px;
  color:#b6aacb;
  margin-top:18px}
.hero-visual {
  position:relative;
  display:flex;
  justify-content:center;
  padding:12px 0}
.phone {
  width:284px;
  padding:5px;
  border:2px solid #706381;
  border-radius:45px;
  background:#08070e;
  box-shadow:0 35px 80px #0007,0 0 65px #b892ff10;
  position:relative;
  overflow:hidden;
  flex-shrink:0}
.phone img {
  width:100%;
  border-radius:37px}
.phone:after {
  content:"";
  position:absolute;
  width:29%;
  height:3.7%;
  left:35.5%;
  top:2%;
  border-radius:99px;
  background:#030305}
.intro {
  text-align:center;
  max-width:650px;
  margin:0 auto;
  padding:50px 0 54px}
.intro>p:not(.eyebrow) {
  font-size:16px;
  margin:20px auto 0;
  max-width:510px}
.features {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px}
.feature {
  background:linear-gradient(145deg,#29203988,#1b172c55);
  border:1px solid var(--line);
  border-radius:30px;
  overflow:hidden;
  padding:37px 38px 0}
.feature p {
  font-size:15px;
  max-width:360px;
  margin:15px 0 28px}
.feature .phone {
  width:256px;
  margin:auto;
  transform:translateY(29px);
  border-radius:39px;
  box-shadow:0 20px 65px #0004}
.feature .phone img {
  border-radius:31px}
.feature-screen {
  height:340px;
  overflow:hidden}
.feature:nth-child(2) {
  background:radial-gradient(ellipse at bottom,#55357355,transparent 75%),#1c172b88}
.feature-label {
  display:block;
  color:var(--lavender);
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  margin-bottom:16px}
.small-features {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  padding:58px 4px 75px}
.small-features h3 {
  font-size:20px;
  letter-spacing:-.02em}
.small-features p {
  font-size:14px;
  margin:13px 0 0}
.feature-icon {
  width:39px;
  height:39px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:14px;
  margin-bottom:18px;
  color:var(--lavender)}
.feature-icon svg {
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round}
.widget-section {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:85px;
  padding:65px 0 95px;
  border-top:1px solid var(--line)}
.widget-section h2 {
  font-size:37px}
.widget-section p {
  font-size:15px;
  max-width:360px}
.widget-image {
  padding:30px 5px;
  background:radial-gradient(ellipse,#71509533,transparent 70%)}
.widget-image img {
  border-radius:28px;
  box-shadow:0 22px 55px #0004}
.faq {
  max-width:740px;
  margin:auto;
  padding:30px 0 80px}
.faq>h2 {
  text-align:center;
  font-size:36px;
  margin-bottom:34px}
.faq details {
  border-bottom:1px solid var(--line);
  padding:22px 0}
.faq summary {
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  gap:20px}
.faq summary::-webkit-details-marker {
  display:none}
.faq summary:after {
  content:"+";
  font-weight:400;
  font-size:21px;
  line-height:1;
  color:var(--lavender)}
.faq details[open] summary:after {
  content:"−"}
.faq p {
  font-size:14px;
  max-width:640px;
  margin:15px 0 0}
.faq p a {
  text-decoration:underline;
  text-underline-offset:4px}
.closing {
  text-align:center;
  padding:65px 24px 70px;
  border:1px solid var(--line);
  border-radius:32px;
  background:radial-gradient(ellipse at 50% 130%,#74528e50,transparent 75%),#201a30}
.closing img {
  width:58px;
  height:58px;
  border-radius:17px;
  margin:0 auto 24px}
.closing h2 {
  font-size:42px}
.closing p {
  margin:18px 0 25px}
.launch-status {
  display:inline-block;
  padding:13px 23px;
  border:1px solid #d8c2ff33;
  border-radius:99px;
  background:#d8c2ff0a;
  color:#e3d6fa;
  font-size:14px}
.site-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:38px 0 30px;
  margin-top:30px;
  font-size:12px;
  color:#afa5c4}
.footer-links {
  display:flex;
  gap:24px}
.copyright {
  margin:0;
  font-size:11px}
.legal-body {
  background:radial-gradient(ellipse at 60% 0,#3b2a5350,transparent 700px),var(--bg)}
.legal-top {
  padding:70px 0 44px;
  max-width:770px}
.legal-top h1 {
  font-size:clamp(43px,5vw,65px)}
.legal-top .intro-text {
  font-size:18px;
  margin:22px 0}
.legal-meta {
  font-size:12px;
  color:#a99dbe}
.legal-layout {
  display:grid;
  grid-template-columns:210px minmax(0,720px);
  gap:65px;
  align-items:start;
  padding:5px 0 70px}
.toc {
  position:sticky;
  top:36px;
  font-size:13px;
  display:grid;
  gap:16px;
  color:var(--muted);
  padding-top:10px}
.toc strong {
  color:var(--ink);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin-bottom:5px}
.legal-content {
  font-size:15px;
  min-width:0}
.legal-content h2 {
  font-size:26px;
  letter-spacing:-.025em;
  margin:40px 0 16px;
  line-height:1.2}
.legal-content section:first-of-type h2 {
  margin-top:28px}
.legal-content p {
  margin:12px 0}
.legal-content a {
  color:var(--lavender);
  text-decoration:underline;
  text-underline-offset:4px}
.notice {
  padding:20px 24px;
  border:1px solid #c8acff2a;
  border-radius:18px;
  background:#b590ef0a;
  font-size:13px;
  line-height:1.7;
  color:#cbbfdb}
.notice strong {
  color:#e4d9f7}
.legal-content ul {
  padding-left:22px;
  color:var(--muted);
  line-height:1.8}
.legal-content li {
  margin:7px 0}
.legal-body .site-footer {
  border-top:1px solid var(--line)}
@media(min-width:1500px) {
  .hero-shell:before {
  background-size:cover}
}
@media(max-width:850px) {
  .hero {
  gap:20px}
.hero h1 {
  font-size:54px}
.phone {
  width:260px}
.widget-section {
  gap:40px}
.legal-layout {
  gap:30px;
  grid-template-columns:170px minmax(0,1fr)}
}
@media(max-width:640px) {
  .wrap {
  width:calc(100% - 40px)}
.site-header {
  padding:22px 0}
.brand {
  font-size:25px}
.brand img {
  width:32px;
  height:32px;
  border-radius:9px}
.site-nav {
  gap:20px;
  font-size:12px}
.site-nav .nav-pill {
  display:none}
.hero-shell:before {
  background-size:auto 1050px;
  background-position:38% top}
.hero {
  display:flex;
  flex-direction:column;
  min-height:0;
  text-align:center;
  padding-top:42px;
  padding-bottom:30px;
  gap:35px}
.availability {
  margin-bottom:23px}
.hero h1 {
  font-size:52px}
.hero-copy>p {
  font-size:16px;
  max-width:330px;
  margin:23px auto 26px}
.hero-note {
  font-size:11px}
.hero-visual {
  width:100%;
  padding:10px 0 30px}
.hero .phone {
  width:250px;
  border-radius:39px}
.hero .phone img {
  border-radius:31px}
.intro {
  padding:45px 0 35px}
.intro h2 {
  font-size:34px}
.intro>p:not(.eyebrow) {
  font-size:15px}
.features {
  grid-template-columns:1fr;
  gap:18px}
.feature {
  padding:30px 27px 0;
  border-radius:25px}
.feature h3 {
  font-size:26px}
.feature p {
  font-size:14px}
.feature-screen {
  height:320px}
.small-features {
  grid-template-columns:1fr;
  gap:30px;
  padding:40px 6px 50px}
.small-features article {
  padding-left:55px;
  position:relative}
.feature-icon {
  position:absolute;
  left:0;
  top:0}
.small-features p {
  margin-top:9px}
.widget-section {
  grid-template-columns:1fr;
  gap:10px;
  padding:45px 0}
.widget-section h2 {
  font-size:34px}
.widget-image {
  padding:20px 0}
.faq {
  padding:30px 0 55px}
.faq>h2 {
  font-size:30px;
  text-align:left}
.faq summary {
  font-size:15px}
.closing {
  padding:43px 21px;
  border-radius:25px}
.closing h2 {
  font-size:33px}
.closing p {
  font-size:14px}
.site-footer {
  flex-direction:column;
  align-items:flex-start;
  gap:22px;
  margin-top:14px;
  padding-bottom:25px}
.footer-links {
  gap:23px;
  flex-wrap:wrap}
.legal-top {
  padding:45px 0 30px}
.legal-layout {
  display:block}
.toc {
  position:static;
  display:flex;
  flex-wrap:wrap;
  gap:13px 20px;
  border-bottom:1px solid var(--line);
  padding:0 0 25px;
  margin-bottom:25px}
.toc strong {
  width:100%;
  margin-bottom:0}
.legal-content h2 {
  font-size:24px}
.notice {
  padding:18px}
.legal-top .intro-text {
  font-size:16px}
}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
}
@media print {
  body,.legal-body {
  background:white;
  color:black}
.site-header,.toc,.site-footer,.skip {
  display:none}
.wrap {
  width:100%}
.legal-layout {
  display:block}
.legal-content p,.legal-content li,.legal-top p {
  color:#333}
.notice {
  color:#333;
  border:1px solid #aaa}
.notice strong,.legal-content a {
  color:black}
.legal-top {
  padding:0 0 20px}
.legal-content h2 {
  break-after:avoid}
section {
  break-inside:avoid}
}


