/* Homepage · 05 / The shift
   A balanced tablet journey and compact phone cards. */

@media (min-width: 621px) and (max-width: 1100px) {
  .shift-feature {
    gap: 54px;
  }

  .shift-conversation {
    gap: 16px;
  }

  .shift-conversation li {
    min-height: 128px;
    padding: 18px 20px;
    border-radius: 20px;
  }

  .shift-conversation li.shift-conversation__murmur {
    grid-column: 1 / -1;
    min-height: 104px;
    flex-direction: row;
    align-items: center;
    transform: none;
  }

  .shift-conversation__brand {
    width: min(32%, 142px);
  }
}

@media (min-width: 861px) and (max-width: 1100px) {
  .shift-conversation {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 621px) and (max-width: 860px) {
  .shift-conversation {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shift-conversation li:nth-child(3),
  .shift-conversation li:nth-child(7) {
    grid-column: 1 / -1;
    min-height: 96px;
    flex-direction: row;
    align-items: center;
  }

  .shift-conversation li:nth-child(3) strong,
  .shift-conversation li:nth-child(7) strong {
    max-width: 24ch;
    text-align: right;
  }
}

@media (max-width: 620px) {
  .shift-conversation li {
    min-height: 0;
    padding: 14px 16px 16px;
    gap: 18px;
    border-radius: 18px;
  }

  .shift-conversation li::before {
    top: 14px;
    bottom: 14px;
  }

  .shift-conversation li span {
    padding: 6px 8px;
  }

  .shift-conversation__brand {
    width: min(100%, 118px);
  }

  .shift-conversation__palette {
    right: 22px;
    left: 22px;
  }
}