/* Desktop */
@media (min-width: 2000px) {
  .bodyBG {
    background-image: image-set(
      url("./images/bg2000.webp") 1x,
      url("./images/bg2000Retina.webp") 2x
    );
  }
}
@media (max-width: 1220px) {
  .bodyBG {
    background-image: image-set(
      url("./images/bg1200.webp") 1x,
      url("./images/bg1200Retina.webp") 2x
    );
  }
  .hero .hero-title {
    font-size: 2.4rem;
  }
  .hero .hero-subtitle {
    font-size: 1.3rem;
    width: 90%;
  }
  .hero .hero-description {
    font-size: 1.15rem;
  }
  .email-link {
    font-size: 0.9rem;
    padding: 12px 12px 12px 35px;
  }
  .email-link::before {
    width: 17px;
    height: 17px;
    left: 12px;
  }
  .donate-content h4 {
    width: 80%;
    font-size: 1.1rem;
  }
  .donate-content p {
    width: 60%;
    font-size: 0.9rem;
  }
  .donate img {
    width: 142px;
    height: 135px;
  }
}
@media (max-width: 1060px) {
  .container {
    padding: 30px 10px;
  }
  .hero .hero-title {
    font-size: 2.1rem;
  }
  .hero .hero-subtitle {
    font-size: 1.2rem;
  }
  .hero .hero-description {
    font-size: 1rem;
    width: 80%;
    margin-bottom: 0;
  }
  .newsletter input[type="email"] {
    width: 280px;
    height: 55px;
    font-size: 1rem;
  }
  .newsletter button {
    width: 140px;
    height: 55px;
    font-size: 1.1rem;
  }
  .footer {
    font-size: 12px;
  }
  .donate img {
    width: 135px;
    height: 128px;
  }
  .donate-content h4 {
    width: 65%;
    font-size: 1rem;
  }
  .donate-content p {
    width: 60%;
    font-size: 0.8rem;
  }
  .footer-note a {
    font-size: 14px;
  }
}

/* Tablets */
@media (min-width: 755px) {
  .mobile-donate-btn {
    display: none;
  }
}
@media (max-width: 754px) {
  .donate-content .donate-btn {
    display: none;
  }
}
@media (max-width: 1025px) {
  .bodyBG {
    background-image: image-set(
      url("./images/bg830.png") 1x,
      url("./images/bg830Retina.png") 2x
    );
  }
  .hero {
    padding-bottom: 60px;
    width: 100%;
  }
  .container {
    padding: 15px;
    margin: 0 25px;
  }
  .logo {
    width: 160px;
  }
  .email-link {
    font-size: 1rem;
    padding: 10px 11px 10px 40px;
  }
  .hero .hero-title {
    font-size: 2.9rem;
    margin-bottom: 10px;
    margin-top: 0;
  }
  .hero .hero-subtitle {
    font-size: 1.5rem;
    margin: 0 0 26px 0;
    width: 100%;
  }
  .hero .hero-description {
    font-size: 1.3rem;
    width: 100%;
  }
  .newsletter {
    width: 100%;
    margin-top: 15px;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
  }
  .newsletter input[type="email"] {
    width: 60%;
    height: 64px;
  }
  .newsletter button {
    width: 60%;
    height: 58px;
  }
  .newsletter input::placeholder {
    font-size: 1rem;
  }
  .footer {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .donate {
    width: 100%;
    margin-bottom: 17px;
    align-items: flex-start;
  }
  .donate img {
    width: 147px;
    height: 140px;
    border-radius: 12px;
  }
  .donate-content h4 {
    font-size: 1.6rem;
    width: 100%;
  }
  .donate-content p {
    font-size: 1.2rem;
    width: 100%;
  }
  .footer-note {
    width: 100%;
    justify-content: flex-start;
  }
  .footer-note a {
    text-align: start;
    color: black;
    font-size: 1rem;
  }
}
@media (max-width: 795px) {
  .mobile-donate-btn {
    margin: 0 0 20px 0;
  }
}
@media (max-width: 705px) {
  .hero .hero-title {
    font-size: 2.4rem;
  }
  .hero .hero-subtitle {
    font-size: 1.3rem;
  }
  .hero .hero-description {
    font-size: 1.2rem;
  }
  .donate img {
    width: 125px;
    height: 119px;
  }
  .donate-content h4 {
    font-size: 1.5rem;
  }
  .donate-content p {
    font-size: 1.1rem;
  }
}
@media (max-width: 754px) {
  .mobile-donate-btn {
    margin: 0 0 40px 0;
  }
}
@media (max-width: 630px) {
  .container {
    padding: 5px 0;
    margin: 0 15px;
  }
}

/* Mobile version */
@media (max-width: 550px) {
  .hero {
    padding-bottom: 41px;
  }
  .logo {
    width: 141px;
  }
  .email-link {
    font-size: 0.75rem;
    padding: 8px 11px 8px 36px;
  }
  .email-link::before {
    width: 15px;
    height: 15px;
  }
  .hero .hero-title {
    font-size: 1.9rem;
    margin-bottom: 8px;
  }
  .hero .hero-subtitle {
    font-size: 1.1rem;
  }
  .hero .hero-description {
    font-size: 1.2rem;
  }
  .donate img {
    width: 110px;
    height: 104px;
    border-radius: 12px;
  }
  .donate-content h4 {
    font-size: 1.2rem;
  }
  .donate-content p {
    font-size: 1rem;
  }
  .footer-note a {
    font-size: 0.9rem;
  }
  .newsletter input[type="email"] {
    width: 100%;
  }
  .newsletter button {
    width: 100%;
  }
  .mobile-donate-btn {
    width: 100%;
  }
}
@media (max-width: 500px) {
  .container {
    margin: 0 10px;
  }
}
@media (max-width: 400px) {
  .hero .hero-title {
    font-size: 1.8rem;
    margin-bottom: 12px;
  }
  .hero .hero-subtitle {
    margin: 0 0 20px 0;
  }
  .hero .hero-description {
    margin: 5px 0 0 0;
  }
  .logo {
    width: 135px;
  }
  #newsletterForm .newsletter {
    gap: 5px;
  }
  .donate {
    margin: 0 0 10px 0;
  }
  .donate-content h4 {
    font-size: 1rem;
  }
  .donate-content p {
    margin: 0;
    width: 95%;
    font-size: 0.7rem;
  }
  .donate img {
    width: 94px;
    height: 88px;
  }
  .hero {
    padding-bottom: 20px;
  }
  .mobile-donate-btn {
    margin: 0 0 15px;
  }
}
@media (max-width: 360px) {
  .mobile-donate-btn {
    margin: 0 0 35px;
  }
}
@media (max-width: 338px) {
  .donate-content h4 {
    margin: 0;
  }
}

/* terms page */

@media (max-width: 768px) {
  .terms-page .container {
    padding: 15px;
    max-width: 90%;
  }

  .terms-page .title {
    font-size: 1.8rem;
  }

  .terms-page .section-title {
    font-size: 1.5rem;
  }

  .terms-page .paragraph {
    font-size: 0.95rem;
  }
}

@media (max-width: 480px) {
  .terms-page .container {
    padding: 10px;
    max-width: 100%;
  }

  .terms-page .title {
    font-size: 1.5rem;
  }

  .terms-page .section {
    margin-bottom: 20px;
    padding: 10px;
  }

  .terms-page .section-title {
    font-size: 1.2rem;
  }

  .terms-page .paragraph {
    font-size: 0.9rem;
  }
}
