/* Android waitlist links accompany every App Store CTA. The default is a quiet
   secondary line under the CTA; --nav is the header pill and --plain a text nav item. */
.android-cta {
  display: flex; align-items: center; gap: 8px;
  width: fit-content; min-height: 44px; margin-top: 6px;
  color: rgba(255,255,255,.62); font-size: 14px; font-weight: 500; line-height: 1.3;
  text-decoration: none;
}
.android-cta::before {
  content: ""; flex-shrink: 0; width: 18px; height: 18px; background: #3ddc84;
  -webkit-mask: url("/images/android-glyph.svg") center / contain no-repeat;
  mask: url("/images/android-glyph.svg") center / contain no-repeat;
}
.android-cta strong { color: #fff; font-weight: 700; white-space: nowrap; }
.android-cta strong::after { content: "→"; display: inline-block; margin-left: 6px; color: #ffdb00; transition: transform .15s ease; }
.android-cta:hover strong { color: #ffdb00; }
.android-cta:hover strong::after { transform: translateX(3px); }
.android-cta:focus-visible { outline: 3px solid rgba(255,219,0,.6); outline-offset: 3px; border-radius: 999px; }
.android-cta--center { margin-inline: auto; text-align: center; }
html[lang="fr"] .android-cta [lang="en"], html:not([lang="fr"]) .android-cta [lang="fr"] { display: none; }

.android-cta--nav, .android-cta--plain { min-height: 0; margin: 0; white-space: nowrap; }
.android-cta--nav {
  align-self: stretch; gap: 6px; padding: 0 14px;
  border: 1px solid rgba(255,255,255,.2); border-radius: 999px; background: rgba(255,255,255,.08);
  color: #fff; font-size: 13px; font-weight: 700;
}
.android-cta--nav::before, .android-cta--plain::before { width: 16px; height: 16px; }
.android-cta--nav:hover { border-color: rgba(255,219,0,.7); }
@media (max-width: 640px) {
  .android-cta--nav { padding: 0 11px; }
  .android-cta--nav span, .android-cta--plain span {
    position: absolute; width: 1px; height: 1px; overflow: hidden;
    clip-path: inset(50%); white-space: nowrap;
  }
}
/* Make room for the Android pill in the tighter page headers. */
@media (max-width: 400px) {
  .top-nav { gap: 6px; }
  .top-nav .nav-link, .top-nav .nav-cta { padding-inline: 12px; }
  .android-cta--nav { padding: 0 9px; }
}
.waitlist-page {
  margin: 0; background: #0a0a0b; color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6; min-height: 100vh;
  background-image: radial-gradient(ellipse at 85% 15%, #ffdb0014, transparent 60%);
}
.waitlist-page * { box-sizing: border-box; }
.waitlist-wrap { max-width: 760px; margin: auto; padding: 28px 24px 70px; }
.waitlist-page a { color: #ffdb00; }
.waitlist-brand { color: #fff !important; font-size: 20px; font-weight: 750; text-decoration: none; }
.waitlist-card { margin-top: 60px; padding: 36px; border: 1px solid #ffffff25; border-radius: 24px; background: #151518; }
.waitlist-eyebrow { color: #ffdb00; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.waitlist-card h1 { font-size: clamp(32px, 6vw, 52px); line-height: 1.08; letter-spacing: -.04em; margin: 18px 0 24px; }
.waitlist-intro { color: #d5d5dc; font-size: 18px; }
.waitlist-note, .waitlist-privacy { color: #aaaab5; font-size: 13px; }
.waitlist-form { display: grid; gap: 16px; margin-top: 32px; }
.waitlist-form input[type="email"] { width: 100%; padding: 15px; color: #fff; background: #0a0a0b; border: 1px solid #ffffff45; border-radius: 10px; font: inherit; }
.waitlist-form input:focus-visible { outline: 2px solid #ffdb00; outline-offset: 2px; }
.waitlist-consent { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; }
.waitlist-consent input { flex-shrink: 0; width: 20px; height: 20px; accent-color: #ffdb00; }
.waitlist-submit { border: 0; border-radius: 12px; padding: 16px; background: #ffdb00; color: #111; font: inherit; font-weight: 750; cursor: pointer; }
.waitlist-submit:disabled { opacity: .65; cursor: wait; }
.waitlist-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.waitlist-error { color: #ffb4ab; }
.waitlist-success { border-left: 3px solid #ffdb00; padding-left: 20px; margin-top: 30px; }
.waitlist-page [hidden] { display: none !important; }
@media (max-width: 480px) { .waitlist-card { padding: 24px; margin-top: 32px; } .waitlist-wrap { padding-inline: 16px; } }
