/* Get the app: one calm band. Copy on one side, a single phone floating gently on a soft glow on the other.
   Nothing overlaps the phone screen. The copy sits in ink for contrast on the band. */
.getapp { position: relative; overflow: clip; isolation: isolate; padding: 72px 0 64px;
  background: linear-gradient(135deg, #FAA21B 0%, #FF7A45 55%, #FF5E7E 100%); color: var(--ink); }
.ga__blob { position: absolute; z-index: -1; border-radius: 50%; filter: blur(70px); pointer-events: none; }
.ga__blob--a { width: 34vw; height: 34vw; left: -8vw; bottom: -14vw; background: var(--sun); opacity: .45; }
.ga__blob--b { width: 30vw; height: 30vw; right: -6vw; top: -12vw; background: var(--cat-design); opacity: .3; }

.ga__grid { display: grid; gap: 40px; }
.ga__copy .kicker { color: rgba(3, 21, 20, .78); }
.ga__copy .kicker__n { color: var(--ink); box-shadow: inset 0 0 0 1.5px rgba(3, 21, 20, .5); }
.ga__title { color: var(--ink); font-size: clamp(40px, 4vw + 4px, 60px); max-width: 12ch; }
.ga__lead { margin-top: 18px; max-width: 26em; font-size: 18px; line-height: 1.5; color: var(--ink); }
.getapp .stores { margin-top: 26px; }
.getapp .store { background: #000; box-shadow: 0 14px 28px -16px rgba(60, 10, 30, .7); }
.getapp .store:hover { background: #1a1a1a; }
.ga__qr { display: inline-flex; margin-top: 16px; padding: 10px 20px 10px 10px; border-radius: 22px; background: #fff; box-shadow: 0 18px 34px -18px rgba(90, 20, 40, .6); }
.ga__qr img { width: 76px; height: 76px; box-shadow: none; background: #fff; }

.ga__stage { position: relative; display: grid; place-items: center; padding: 8px 0 24px; }
.ga__glow { position: absolute; width: min(420px, 90vw); aspect-ratio: 1; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(255, 255, 255, .65), rgba(255, 255, 255, .22) 60%, rgba(255, 255, 255, 0)); }
.ga__phone { position: relative; width: min(230px, 58vw); margin: 0; filter: drop-shadow(0 30px 40px rgba(110, 20, 50, .35)); }
.ga__phone img { display: block; width: 100%; height: auto; border-radius: 31px; }
.is-live .ga__phone { animation: ga-float 7s ease-in-out infinite; }
.is-live .ga__glow { animation: ga-glow 7s ease-in-out infinite; }
@keyframes ga-float { 50% { transform: translateY(-10px); } }
@keyframes ga-glow { 50% { transform: scale(1.06); opacity: .85; } }

@media (min-width: 960px) {
  .getapp { padding: 96px 0; min-height: min(100svh, 900px); display: grid; align-items: center; }
  .ga__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 48px; align-items: center; }
  .ga__phone { width: min(270px, calc((100svh - 220px) * .45)); }
}
@media (max-width: 959px) { .ga__stage { order: -1; } }
@media (prefers-reduced-motion: reduce) { .is-live .ga__phone, .is-live .ga__glow { animation: none; } }