@media (max-width: 1037px){
    html{
        font-size: 50%;
    }
    .feature-desc .content{
        gap: 4rem;
    }
   

    .content h1 {
        font-size: 3.75rem;
        background-color: re;
}
    div.write-ups p {
        line-height: var(--line-h);
        max-width: 75ch;
        font-size: 1.85rem;
    }
}


@media (max-width: 917px){
        html{
        font-size: 44%;
    }
    .content{
        padding: 0 2.5rem;
    }
    section.joinSection.feature-desc{
      padding: 0;
    }
    div.write-ups p.ch-45 {
    font-size: 1.845rem;
    }
}


@media (max-width: 790px){
    html{
        font-size: 30%;
    }
    label.nav-toggle-label {
    font-size: 5.24rem;
    display: block;
    color: #fff;
  }
  section.joinSection .writeups{
    width: 90%;
  }
    .content{
    flex-direction: column;
    padding: 0.8rem;
  }
   .content div.write-ups{
    background-color: orang;
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
  }
  .content h1{
    text-align: center;
    font-size: clamp(20px, calc(20px + 10 * ((100vw - 320px) / 205)), 30px);
  }
 
div.writeups p{    
  font-size: 2.5rem !important;
}
  div.write-ups p{
    font-size: 2.8rem;
    padding:  0 5.5rem;
    text-align: center !important;
}
  section.summary p.pad-text{
    padding: 3.5rem 0;
  }
  div.links{
    background-color: re;
        background-color: var(--dark-theme);
    font-size: 1.6rem;
    width: 80%;
    height: 46px;
    align-self: center;
    border-radius: 40px;
  }

  section.summary ul li{
    font-size: clamp(14px, 4vw, 16px);
    list-style: 1.55;
    padding-inline: 15px;
  }

  
.btn{
    font-size: 2.12rem;
    padding: 1.86rem 3rem;
}
div.write-ups p.ch-45{
        font-size: clamp(12px, calc(12px + 2 * ((100vw - 320px) / 186)), 17px);
    padding: 3.5rem 0;
    text-align: center;

}
div.illustration svg{
    width: 60rem;
}

div.write-ups p.subtitles{
    font-size: 2.4rem;
    padding: 1.4rem 2.5rem;
    width: max-content;
}

  main section{
    height: 100vh;
  }

  section.feature-desc{
    padding: 10rem 0;
  }
  .billboard{
    
    padding: 40rem 0 20rem 0;
  }
section.billboard .illustration svg{
    width: 50rem;
}
  section.summary{
    background-color: re;
  }

  
br.break{display: none;}

  section.feature-desc h2{
    width: 90%;
    max-width: 22ch;
    text-align: center;
    font-size: 5rem;
    background-color: dodgerblu;
  }
  section.feature-desc div.content{
    background-color: orang;
  }

      
    .content h1{
        max-width: 21ch;
    }
    div.write-ups{
        background-color: orang;
    }
    section.summary ul span{
      font-size: 3.75rem;
    }
    .content{
        background-color: re;
    }
    div.write-ups p.ch-45{
        max-width: 33ch;
}
   div.cta-btn-holder{
        flex-direction: column;
        width: 65%;
        gap: 2.85rem
    }
section.summary{
      min-height: fit-content;
    max-height: fit-content !important;
    padding: 5rem 0;
}
    
section.summary ul.grid {
  padding-bottom: 55px;
  width: 97%;
}
div.writeups p{    
  font-size: 2.8rem !important;
    max-width: 32ch !important;
}
}