html, body {
  overflow-x: hidden !important;
}

body {
    margin: 0;
    padding: 0;
    background-color: black;
    font-family: 'Poppins', sans-serif;
    color: #f5f5f7;
    display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
    /*height: 100vh;*/ 
	min-height: 100dvh;
    /*overflow-x: auto;  ? pozwala przewijac poziomo, jesli trzeba */
    overflow-y: hidden;
    text-align: center;
}

/*   iPhone 15:
Logical viewport: 393 x 852 pixels
iPhone 13:
Logical viewport: 390 x 844 pixels; 
iPhone 12:
Logical viewport: 390 x 844 pixels; 
iPhone X:
Logical viewport: 375 x 812 pixels; 
iPhone 6-8:
Logical viewport: 375 x 667 pixels;
lowest viewport 320px      */

.split-text-container {
	 flex: 1;
    display: flex;
    flex-direction: column;
  /*  justify-content: center; */
    align-items: center;
  /*  padding: 0.2rem; */
    padding-top: 5rem;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
	
}

/* Domyslnie na telefonie (mobile first) – bez przerwy, jeden pod drugim */
.split-text-container div {
    display: block;
    text-align: center;
}

/* Na szerszych ekranach: poziomo z odstepem */
@media (min-width: 768px) {
     .split-text-container div {
        display: flex;
        justify-content: center;
        flex-wrap: nowrap;
        white-space: nowrap; /* zapobiega zawijaniu tekstu */
        gap: 1rem;
        overflow-wrap: break-word;
    }

    .text-part {
        font-size: clamp(2rem, 5vw, 4.5rem); /* dynamiczny rozmiar */
        line-height: 1.2;
    }

    .split-text-container {
        max-width: 100vw; /* zapobiega zbyt duzym szerokosciom */
        overflow-x: hidden;
    }
}


@media (min-width: 993px) {
  .logo {
    max-height: 451px !important;
  }
  .split-text-container {
    padding-top: 3rem;
  }
}


@media (max-width: 992px) {
    .split-text-container div {
        flex-wrap: wrap;
        justify-content: center;
        white-space: normal;
    }
}

/* Zastosowanie clamp() dla responsywnej wielkosci czcionki */
.split-text-container span.text-part {
    font-size: clamp(2rem, 8vw, 5rem);
    font-weight: bold;
    text-transform: uppercase;
}

/* Animacje */
.text-part {
    display: inline-block;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}

.text-part.left {
    transform: translateX(-200%);
    animation-name: slide-in-left;
    animation-delay: 0.3s;
}

.text-part.right {
    transform: translateX(200%);
    animation-name: slide-in-right;
    animation-delay: 0.5s;
}

@keyframes slide-in-left {
    from { transform: translateX(-200%); }
    to   { transform: translateX(0); }
}

@keyframes slide-in-right {
    from { transform: translateX(200%); }
    to   { transform: translateX(0); }
}

.contact-info {
    font-size: clamp(1rem, 4vw, 2rem);
    text-transform: none;
    margin-top: 2rem;
    opacity: 0;
    animation: fade-in 2s ease-out 2s forwards;
    line-height: 1.6;
    max-width: 100vw;
    word-break: break-word;
    padding: 0 1rem;
}

.contact-info a {
    color: #287f85;
    text-decoration: underline;
}

.contact-info a:hover {
    text-decoration: underline;
}

.address {
    display: inline-block;
    
    overflow-x: auto;
    text-align: center;
}

/* Efekt pojawienia sie tekstu */
@keyframes fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.logo-wrapper {
    width: 100%;
    text-align: center;
    padding: 1.5rem 0;
}

.logo {
    max-height: 200px;
    max-width: 80%;
    height: auto;
    width: auto;
    object-fit: contain;
}