/* Mobile Responsiveness */

/* 1. שיפור כלליות */
html {
  scroll-behavior: smooth;
  width: 100%;
  font-size: 16px; /* גודל ברירת מחדל */
}

/* 2. רספונסיביות לכל המסכים */
@media (max-width: 1740px) {
  .sections {
      width: 90%;
      height: auto;
      top: 100vh;
  }
  .headtext {
      font-size: 18px;
      text-align: center;
  }
}

@media (max-width: 1360px) {
  .sections {
      width: 90%;
      top: 120vh;
  }
  .headtext {
      font-size: 20px;
  }
}

@media (max-width: 1260px) {
  .sections {
      width: 85%;
      top: 130vh;
  }
  .headtext {
      font-size: 22px;
  }
}

/* שיפור בגודל תמונות */
@media (max-width: 1000px) {
  .expSec img{
    right: 80px;
  }
  img.Navlogo {
      width: 80px;
  }

  .welcomSec img,
  .pvpSec img,
  .expSec img,
  .indSec img {
      width: 150px;
  }

  .headtext {
      font-size: 16px;
  }

  img.pirate{
    display: none;
  }
}

/* 3. מכשירים קטנים (למשל טלפונים) */
@media (max-width: 780px) {
  .sections {
      width: 100%;
      height: auto;
      top: 100vh;
      display: flex;
      justify-content: center;
      z-index: 50;
  }
 

  .soliderImg{
    top: 1100px;
  }
  
  .headtext {
      font-size: 12px;
      text-align: center;
  }
  .expSec{
    left: 0;
  }

  .pvpSec .secText,
  .expSec .secText,
  .indSec .secText {
      position: absolute;
      left: 0;
      width: 70%;
      padding-left: 0;
      text-align: left;


  }

  .piraSec .secText{
    position: absolute;
    top: -100px;
      left: 50px;
      width: 70%;
      padding-left: 0;
      text-align: left;
  }

  img.Navlogo {
      width: 70px;
  }

  .joinButt {
      width: 130px;
      font-size: 14px;
  }
}

/* 4. מכשירים מאוד קטנים (כמו טלפונים קטנים מאוד) */
@media (max-width: 680px) {
  .sections {
      top: 90vh;
    
  }
  .sections div{
    width: 100%;
  }

  .headtext {
      font-size: 10px;
  }

  .joinButt {
      width: 120px;
      font-size: 12px;
  }

  .indSec img{
    left: 50px;
    top: -10px;
  }

  .pvpSec h2,
  .expSec h2,
  .indSec h2 {
      font-size: 28px;
      letter-spacing: 5px;
  }

  .joinUsButton {
      font-size: 13px;
  }
}

/* מכשירים קטנים מאוד (מסכים של 350px ומטה) */
@media (max-width: 490px) {
  .joinButt {
      width: 100px;
      font-size: 12px;
  }
}
