/* Desktop: a restrained, translucent web treatment inspired by product photography. */
@media (min-width:701px) {
  body {
    color:#1d293c;
    background:radial-gradient(ellipse at 80% 28%, rgba(221,235,252,.47), transparent 37%),
      radial-gradient(ellipse at 53% 93%, rgba(224,243,236,.36), transparent 36%), #f8fafc;
  }
  .topbar { border-bottom-color:rgba(116,139,164,.17); }
  .brand-sub { color:#8d9aaa; border-left-color:rgba(116,139,164,.23); }
  .nav-btn {
    border-radius:999px;
    border-color:rgba(201,214,227,.9);
    background:rgba(255,255,255,.68);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 3px 12px rgba(53,81,111,.06);
    -webkit-backdrop-filter:blur(18px) saturate(135%);backdrop-filter:blur(18px) saturate(135%);
  }
  .hero { grid-template-columns:1.03fr .97fr; }
  .hero-copy h1 { letter-spacing:-.055em; color:#15243a; }
  .hero-copy h1 em { color:#2862c6; }
  .eyebrow { color:#537399;letter-spacing:.18em; }
  .intro { color:#64758a; }
  .download-buttons { gap:12px; }
  .download-choice {
    border-radius:17px;
    border:1px solid rgba(255,255,255,.32);
    background:linear-gradient(155deg,#346fd7,#235cc2);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.23),0 8px 20px rgba(38,86,163,.15);
    transition:transform .24s cubic-bezier(.2,.7,.2,1),box-shadow .24s,background .24s;
  }
  .download-choice:hover { transform:translateY(-3px); background:linear-gradient(155deg,#3674de,#2158b9);box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 12px 24px rgba(38,86,163,.2); }
  .download-choice:active { transform:translateY(0) scale(.985); }
  .showcase { isolation:isolate; overflow:visible; background:none;box-shadow:none;border:0; }
  .showcase .stage-halo,.showcase .illustration,.showcase .float-card { display:none; }
  .showcase::before {
    content:""; position:absolute; width:65%;height:22px;left:17.5%;bottom:8%;z-index:-1;
    background:radial-gradient(ellipse,rgba(42,62,84,.20),rgba(73,99,130,.05) 50%,transparent 73%);
    filter:blur(12px);pointer-events:none;
  }
  .showcase .phone.demo-launch {
    position:relative; width:min(245px,calc((100dvh - 325px) * .477)); min-width:178px;
    height:auto; animation:none; transform:perspective(1100px) rotateY(-7deg) rotateX(3deg) rotateZ(-4deg);
    border-radius:39px; padding:5px;
    background:linear-gradient(110deg,#8291a1 0%,#f5f8fc 13%,#8492a1 33%,#e2e8ef 61%,#697987 100%);
    box-shadow:inset 1px 1px 0 rgba(255,255,255,.95),inset -1px -1px 1px rgba(39,50,63,.55),0 0 0 1px #6e7e8e,0 18px 27px rgba(49,68,91,.22),0 37px 50px rgba(65,89,116,.15);
    transform-style:preserve-3d;
  }
  .showcase .phone.demo-launch:hover { box-shadow:inset 1px 1px 0 rgba(255,255,255,.95),inset -1px -1px 1px rgba(39,50,63,.55),0 0 0 1px #6e7e8e,0 22px 35px rgba(49,68,91,.26),0 42px 55px rgba(65,89,116,.17); }
  .showcase .phone.demo-launch::before,.showcase .phone.demo-launch::after {content:"";position:absolute;z-index:-1;width:3px;background:linear-gradient(90deg,#748392,#d0d9e0);border-radius:3px;}
  .showcase .phone.demo-launch::before {left:-3px;top:18%;height:10%;}
  .showcase .phone.demo-launch::after {right:-3px;top:27%;height:14%;}
  .mock-label { right:7%;bottom:7%;color:#667b95;font-weight:500; }
  .features {
    border:1px solid rgba(207,220,232,.72); border-radius:20px;
    background:rgba(255,255,255,.60);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 10px 35px rgba(58,85,112,.045);
    -webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);
  }
  .feature-tabs button {border-left-color:rgba(150,169,190,.22);}
  .feature-tabs button[aria-pressed="true"]:after {border-radius:10px;background:#3470d4;}
  footer {border-top-color:rgba(130,151,174,.17);}
  .install-dialog {background:rgba(255,255,255,.93);border-color:rgba(255,255,255,.85);box-shadow:0 25px 75px rgba(24,42,66,.23);-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px);}
  .sim-head button {background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);}
}
@media (min-width:701px) and (max-height:800px) {
  .showcase .phone.demo-launch {width:min(200px,calc((100dvh - 325px) * .477));}
  .showcase::before {bottom:4%;}
}
@media (min-width:701px) and (max-width:1000px) {
  .showcase {transform:none;}
  .feature-intro {flex-basis:165px;}
  .feature-tabs button {padding-left:12px;padding-right:10px;}
}