/* Welcome to Salar Juice — mobile only (Home + About). Does not touch carousel. */
@media (max-width: 1023px) {
  section.welcome-section,
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    overflow-x: hidden;
  }

  section.welcome-section > .mx-auto.max-w-7xl,
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) > .mx-auto.max-w-7xl {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    max-width: 100%;
    width: 100%;
    min-width: 0;
  }

  section.welcome-section > .mx-auto.max-w-7xl > div,
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) > .mx-auto.max-w-7xl > div {
    max-width: 100%;
    min-width: 0;
  }

  section.welcome-section > .mx-auto.max-w-7xl > div:first-child [style*="translateX"],
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) > .mx-auto.max-w-7xl > div:first-child,
  section.welcome-section > .mx-auto.max-w-7xl > div:last-child [style*="translateX"],
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) > .mx-auto.max-w-7xl > div:last-child {
    transform: translateX(0) !important;
  }

  section.welcome-section > .mx-auto.max-w-7xl > div:first-child,
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) > .mx-auto.max-w-7xl > div:first-child {
    width: 100%;
    max-width: 100%;
  }

  section.welcome-section img[alt="Salar Juice production facility"],
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) img[alt="Salar Juice production facility"] {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 12rem;
    max-height: 16rem;
    object-fit: cover;
  }

  section.welcome-section > .mx-auto.max-w-7xl > div:last-child .grid.grid-cols-2,
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) > .mx-auto.max-w-7xl > div:last-child .grid.grid-cols-2 {
    gap: 0.75rem;
  }

  section.welcome-section > .mx-auto.max-w-7xl > div:last-child .grid.grid-cols-2 > div,
  section:has(> .mx-auto.max-w-7xl > div > img[alt="Salar Juice production facility"]) > .mx-auto.max-w-7xl > div:last-child .grid.grid-cols-2 > div {
    padding: 1rem;
    transform: translateY(0) !important;
  }
}