@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/geist-latin-variable.woff2") format("woff2");
}

@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/instrument-serif-latin-regular.woff2") format("woff2");
}

@font-face {
  font-family: "Instrument Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/instrument-serif-latin-italic.woff2") format("woff2");
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin-variable.woff2") format("woff2");
}

.get-app-body .skip-link {
  min-height: var(--tap-min);
  display: inline-flex;
  align-items: center;
}

.get-app-body .download-hero {
  position: relative;
  overflow: clip;
  padding-block: clamp(68px, 8vw, 104px);
}

.get-app-body .download-hero::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: min(46vw, 660px);
  aspect-ratio: 1;
  top: 8%;
  right: -15vw;
  border: 1px dashed var(--rule-strong);
  border-radius: 50%;
  pointer-events: none;
}

.get-app-body .download-grid {
  grid-template-columns: minmax(0, 1fr) minmax(430px, .88fr);
  gap: clamp(54px, 8vw, 112px);
}

.get-app-body .download-copy { position: relative; z-index: 2; }

.get-app-body .download-title {
  max-width: 720px;
  font-size: clamp(52px, 6.8vw, 92px);
  text-wrap: balance;
}

.get-app-body .download-lede {
  max-width: 620px;
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.62;
}

.get-app-body .store-row {
  scroll-margin-top: 90px;
  gap: 10px;
}

.get-app-body .store-badge {
  width: 174px;
  min-width: 0;
  min-height: 56px;
  padding: 7px 12px;
  gap: 10px;
  border: 1px solid #000;
  border-radius: 8px;
  color: #fff;
  background: #000;
  box-shadow: none;
  transition: opacity 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.get-app-body .store-badge[aria-disabled="true"] {
  color: #fff;
  background: #000;
  opacity: .56;
  filter: saturate(.25);
}

.get-app-body .store-badge.is-live:hover {
  transform: translateY(-2px);
  box-shadow: var(--pop-sm);
}

.get-app-body .store-logo {
  width: 29px;
  height: 32px;
  flex: 0 0 29px;
}

.get-app-body .apple-logo { fill: currentColor; }
.get-app-body .play-logo { padding: 2px; }

.get-app-body .store-copy small {
  font-family: var(--sans);
  font-size: 9px;
  font-weight: 450;
  letter-spacing: .01em;
  line-height: 1.1;
  text-transform: none;
}

.get-app-body .store-copy strong {
  margin-top: 1px;
  font-size: 18px;
  line-height: 1.08;
  letter-spacing: -.02em;
}

.get-app-body .launch-state {
  max-width: 530px;
  margin-top: 13px;
  font-family: var(--sans);
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
}

.get-app-body .launch-state strong { color: var(--ink-soft); }

.get-app-body .hero-actions { margin-top: 24px; }

.get-app-body .privacy-note {
  max-width: 610px;
  margin-top: 24px;
}

.get-app-body .download-preview { min-height: 620px; }

.get-app-body .download-phone {
  width: min(82%, 352px);
  box-shadow: 10px 10px 0 var(--orange);
  transform: rotate(2deg);
}

.get-app-body .download-screen { min-height: 566px; }
.get-app-body .download-screen-image { height: 242px; }
.get-app-body .download-screen-body { padding: 22px 20px; }

.get-app-body .qr-card {
  bottom: 52px;
  width: 184px;
  transform: rotate(-3deg);
}

.get-app-body .download-proof { padding-block: clamp(72px, 8vw, 104px); }

.get-app-body .download-proof .loop-title {
  max-width: 830px;
  margin-top: 18px;
  font-size: clamp(42px, 5.4vw, 68px);
  line-height: .98;
  text-wrap: balance;
}

.get-app-body .download-proof-card {
  min-height: 238px;
  display: flex;
  flex-direction: column;
}

.get-app-body .download-proof-card span { color: var(--butter); }
.get-app-body .download-proof-card h3 { max-width: 300px; margin-top: auto; padding-top: 30px; }
.get-app-body .download-proof-card p { line-height: 1.6; }

.get-app-body .download-fallback { padding-block: clamp(76px, 9vw, 112px); }
.get-app-body .fallback-panel { box-shadow: 7px 7px 0 var(--orange); }

@media (max-width: 1040px) {
  .get-app-body .download-grid { grid-template-columns: 1fr; }
  .get-app-body .download-copy { max-width: 780px; }
  .get-app-body .download-preview { width: min(100%, 680px); margin: 0 auto; }
}

@media (max-width: 600px) {
  .get-app-body .download-hero { padding: 54px 0 72px; }
  .get-app-body .download-title { font-size: clamp(46px, 13vw, 60px); }
  .get-app-body .download-lede { font-size: 17px; line-height: 1.55; }

  .get-app-body .store-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .get-app-body .store-badge {
    width: 100%;
    min-height: 52px;
    padding: 6px 9px;
    gap: 7px;
  }

  .get-app-body .store-logo { width: 25px; height: 29px; flex-basis: 25px; }
  .get-app-body .store-copy small { font-size: 8px; }
  .get-app-body .store-copy strong { font-size: 15px; }
  .get-app-body .hero-actions .landing-button { width: 100%; }

  .get-app-body .download-preview {
    min-height: 568px;
    margin-top: -8px;
  }

  .get-app-body .download-phone { width: 88%; }
  .get-app-body .download-screen { min-height: 522px; }
  .get-app-body .download-screen-image { height: 212px; }
  .get-app-body .download-screen-body h2 { font-size: 28px; }

  .get-app-body .qr-card {
    left: -2px;
    bottom: 2px;
    width: 150px;
    padding: 11px;
  }

  .get-app-body .qr-card img { width: 74px; height: 74px; }
  .get-app-body .qr-card span { display: none; }

  .get-app-body .download-proof .loop-title { font-size: clamp(39px, 11vw, 52px); }
  .get-app-body .download-proof-card { min-height: auto; }
  .get-app-body .download-proof-card h3 { margin-top: 0; padding-top: 24px; }
  .get-app-body .fallback-panel { padding: 30px 22px; box-shadow: 5px 5px 0 var(--orange); }
}

@media (max-width: 380px) {
  .get-app-body .store-row { grid-template-columns: 1fr; }
  .get-app-body .store-badge { max-width: 174px; }
  .get-app-body .download-preview { min-height: 550px; }
  .get-app-body .download-phone { width: 94%; }
}

@media (prefers-reduced-motion: reduce) {
  .get-app-body .download-phone,
  .get-app-body .qr-card { transform: none; }
}
