@media (max-width: 760px) and (max-height: 700px) {
  .home-shell {
    padding: 5.7rem 1rem 7.4rem;
  }

  .deck {
    width: min(calc(100vw - 3rem), 42rem);
    height: clamp(17rem, calc(100svh - 13.1rem), 22rem);
    min-height: 0;
    max-height: none;
  }

  .intro-card {
    padding: 1rem;
  }

  .intro-card-inner {
    justify-content: center;
    gap: .7rem;
  }

  .tiny-title {
    font-size: .82rem;
  }

  .mobile-headline {
    gap: .6rem;
  }

  .mobile-headline h1 {
    font-size: clamp(2rem, 7vw, 2.3rem);
  }

  .mobile-stickers .sticker {
    width: 2.55rem;
    height: 2.55rem;
    border-radius: .9rem;
  }

  .current-lines {
    display: none;
  }

  .card.is-next {
    transform: translateY(2rem) scale(.9);
  }

  .card.is-next-2 {
    transform: translateY(3.7rem) scale(.8);
  }

  .progress-pill {
    bottom: 3.15rem;
  }
}

@media (min-width: 761px) and (max-height: 520px) {
  .top-nav {
    padding: 1.4rem 1rem .6rem;
  }

  .layout-nav {
    font-size: 1.15rem;
  }

  .home-shell {
    padding: 4.7rem 1rem 4.6rem;
  }

  .deck {
    width: min(68vw, 38rem);
    height: clamp(12rem, calc(100svh - 9.4rem), 15rem);
    min-height: 0;
    max-height: none;
    aspect-ratio: auto;
  }

  .intro-card {
    padding: 1rem 1.5rem;
  }

  .intro-card-inner {
    gap: .7rem;
  }

  .headline-line h1 {
    font-size: clamp(2rem, 4.2vw, 2.8rem);
  }

  .headline-line .sticker {
    width: 3.1rem;
    height: 3.1rem;
  }

  .current-lines {
    display: none;
  }

  .progress-pill {
    bottom: .35rem;
  }

  .socials {
    right: .75rem;
    bottom: .75rem;
  }
}

@media (max-width: 760px) and (max-height: 480px) {
  .top-nav {
    padding: 1rem .75rem .5rem;
  }

  .home-shell {
    padding: 4rem .75rem 4rem;
  }

  .deck {
    width: min(calc(100vw - 2rem), 34rem);
    height: clamp(12rem, calc(100svh - 9rem), 16rem);
  }

  .intro-card-inner {
    gap: .55rem;
  }

  .mobile-headline {
    gap: .45rem;
  }

  .mobile-headline h1 {
    font-size: clamp(1.8rem, 7vw, 2.15rem);
  }

  .mobile-stickers .sticker {
    width: 2.25rem;
    height: 2.25rem;
  }

  .progress-pill {
    bottom: .35rem;
  }

  .socials {
    right: .5rem;
    bottom: .5rem;
    left: auto;
    flex-direction: column;
    transform: none;
  }
}