.network-bg {
  position: relative;
  width: 100%;
  min-height: 700px;
  
  overflow: hidden;
  display: flex;
  align-items: center;
}



#networkCanvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}

.network-content {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  width: 90%;
  padding: 80px 40px;
  margin: auto;
  color: #fff;
}

.network-content h1,
.network-content h3,
.network-content p {
  color: #fff;
}



.title-top{
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.5em;
  text-align: center;
}

.jumbo-description
{
    text-align: center;
    word-wrap: break-word;
    line-height: 2em;
    font-size: 20px;
    margin-top: 20px;
    
}
/* Mobile version */
@media (max-width: 768px) {

  .title-top{
    font-size: 20px;
    letter-spacing: 0.2em; /* mniejszy odstęp między literami */
    line-height: 1.4;
    text-shadow: 0 2px 8px rgba(0,0,0,0.35);
    display: none;
  }

  .jumbo-description{
    font-size: 16px;
    line-height: 1.6;
    padding: 0 15px; /* żeby tekst nie dotykał krawędzi */
    margin-top: 15px;
    text-shadow: 0 2px 8px rgba(0,0,0,0.35);
    display: none;
  }

}




.fancy-title {
  font-size: clamp(2.2rem, 6vw, 5rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.01em;
  cursor: default;
  display: inline-block;
  text-shadow: 0 2px 8px rgba(0,0,0,0.35);
}

.fancy-title span {
  display: inline-block;
  transition: transform 0.35s ease, color 0.35s ease, text-shadow 0.35s ease;
}

.fancy-title:hover span {
  transform: scale(0.9);
}

/* MOBILE */
@media (max-width: 768px) {

  .fancy-title {
    font-size: clamp(1.8rem, 8vw, 3rem);
    line-height: 1.2;
    letter-spacing: 0;
    text-align: center;

  }

  .fancy-title:hover span {
    transform: none; /* wyłączenie hover na mobile */
  }

}

/* opóźnienia dla płynniejszego efektu */
.fancy-title:hover span:nth-child(1)  { color: #ff4d6d; transition-delay: 0s; }
.fancy-title:hover span:nth-child(2)  { color: #ff7a00; transition-delay: 0.03s; }
.fancy-title:hover span:nth-child(3)  { color: #ffb703; transition-delay: 0.06s; }
.fancy-title:hover span:nth-child(4)  { color: #06d6a0; transition-delay: 0.09s; }
.fancy-title:hover span:nth-child(5)  { color: #9ef01a; transition-delay: 0.12s; } /* lime */
.fancy-title:hover span:nth-child(6)  { color: #8338ec; transition-delay: 0.15s; }
.fancy-title:hover span:nth-child(7)  { color: #ef476f; transition-delay: 0.18s; }
.fancy-title:hover span:nth-child(8)  { color: #f15bb5; transition-delay: 0.21s; } /* pink */
.fancy-title:hover span:nth-child(9)  { transition-delay: 0.24s; }

.fancy-title:hover span:nth-child(10) { color: #fb5607; transition-delay: 0.27s; }
.fancy-title:hover span:nth-child(11) { color: #ff006e; transition-delay: 0.30s; }
.fancy-title:hover span:nth-child(12) { color: #00f5d4; transition-delay: 0.33s; } /* neon mint */
.fancy-title:hover span:nth-child(13) { color: #f15bb5; transition-delay: 0.36s; }
.fancy-title:hover span:nth-child(14) { color: #ffbe0b; transition-delay: 0.39s; }
.fancy-title:hover span:nth-child(15) { transition-delay: 0.42s; }

.fancy-title:hover span:nth-child(16) { color: #ff4d6d; transition-delay: 0.45s; }
.fancy-title:hover span:nth-child(17) { color: #2ec4b6; transition-delay: 0.48s; }
.fancy-title:hover span:nth-child(18) { color: #8338ec; transition-delay: 0.51s; }
.fancy-title:hover span:nth-child(19) { color: #ff7a00; transition-delay: 0.54s; }
.fancy-title:hover span:nth-child(20) { color: #9ef01a; transition-delay: 0.57s; }
.fancy-title:hover span:nth-child(21) { color: #ff006e; transition-delay: 0.60s; }
.fancy-title:hover span:nth-child(22) { color: #f15bb5; transition-delay: 0.63s; }
.fancy-title:hover span:nth-child(23) { color: #ffb703; transition-delay: 0.66s; }
.fancy-title:hover span:nth-child(24) { color: #2ec4b6; transition-delay: 0.69s; }
.fancy-title:hover span:nth-child(25) { color: #ef476f; transition-delay: 0.72s; }
.fancy-title:hover span:nth-child(26) { color: #8338ec; transition-delay: 0.75s; }


.fancy-title:hover span {
  animation: letterWave 0.6s ease forwards;
}

.fancy-title:hover span:nth-child(1)  { animation-delay: 0s; }
.fancy-title:hover span:nth-child(2)  { animation-delay: 0.03s; }
.fancy-title:hover span:nth-child(3)  { animation-delay: 0.06s; }
.fancy-title:hover span:nth-child(4)  { animation-delay: 0.09s; }
.fancy-title:hover span:nth-child(5)  { animation-delay: 0.12s; }
.fancy-title:hover span:nth-child(6)  { animation-delay: 0.15s; }
.fancy-title:hover span:nth-child(7)  { animation-delay: 0.18s; }
.fancy-title:hover span:nth-child(8)  { animation-delay: 0.21s; }
.fancy-title:hover span:nth-child(9)  { animation-delay: 0.24s; }

.fancy-title:hover span:nth-child(10) {  animation-delay: 0.27s; }
.fancy-title:hover span:nth-child(11) {  animation-delay: 0.30s; }
.fancy-title:hover span:nth-child(12) {  animation-delay: 0.33s; }
.fancy-title:hover span:nth-child(13) {  animation-delay: 0.36s; }
.fancy-title:hover span:nth-child(14) {  animation-delay: 0.39s; }
.fancy-title:hover span:nth-child(15) { animation-delay: 0.42s; }

.fancy-title:hover span:nth-child(16) {  animation-delay: 0.45s; }
.fancy-title:hover span:nth-child(17) {  animation-delay: 0.48s; }
.fancy-title:hover span:nth-child(18) { animation-delay: 0.51s; }
.fancy-title:hover span:nth-child(19) {  animation-delay: 0.54s; }
.fancy-title:hover span:nth-child(20) {  animation-delay: 0.57s; }
.fancy-title:hover span:nth-child(21) {  animation-delay: 0.60s; }
.fancy-title:hover span:nth-child(22) {  animation-delay: 0.63s; }
.fancy-title:hover span:nth-child(23) {  animation-delay: 0.66s; }
.fancy-title:hover span:nth-child(24) {  animation-delay: 0.69s; }
.fancy-title:hover span:nth-child(25) {  animation-delay: 0.72s; }
.fancy-title:hover span:nth-child(26) {  animation-delay: 0.75s; }


@keyframes letterWave {
  0% {
    transform: translateY(0) scale(1);
  }
  50% {
    transform: translateY(-10px) scale(0.88);
  }
  100% {
    transform: translateY(0) scale(0.92);
  }
}


.ita_button {
    width: 226px;
    height: 58px;
    display: flex;
    align-items: center;      
    justify-content: center;  
    font-size: 18px;
    text-align: center;
}