/* Dvousloupcový layout pro úvodní sekci */
.homepage-intro-section {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 50px; /* Mezera mezi textem a obrázkem */
  align-items: center; /* Vertikální zarovnání na střed */
  margin: 20px 0 40px 0;
}

/* Odsazení odstavců v textu */
.intro-text-col p {
  margin-bottom: 16px;
}

.intro-text-col p:last-child {
  margin-bottom: 0;
}

.intro-welcome {
  font-weight: bold;
}

/* Centrování fotky ve sloupci */
.intro-img-col {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Omezení rozměrů fotky, aby nebyla příliš vysoká */
.owner-photo {
  max-width: 100%;
  max-height: 480px; /* Tímto parametrem určíte maximální výšku fotky na počítači */
  width: auto;
  height: auto;
  object-fit: contain; /* Zachová poměr stran */
  border-radius: 12px; /* Jemné zaoblení rohů */
}

/* Responzivita pro mobilní zařízení */
@media (max-width: 768px) {
  .homepage-intro-section {
    grid-template-columns: 1fr; /* Jeden sloupec na mobilu */
    gap: 25px;
  }

  .intro-text-col {
    order: 1; /* Na mobilu bude text nahoře */
  }

  .intro-img-col {
    order: 2; /* Obrázek pod textem */
  }

  .owner-photo {
    max-height: 380px; /* Na mobilu výšku o něco snížíme */
  }
}