@import '../components/navbar.css';
@import '../components/footer.css';
@import '../components/backtop.css';




.terms-page{
  margin-top: 14rem;
}


.terms-wrapper{
  color:white;
  padding: 30px;
  border-radius:20px;
}
.terms-header h1{
  font-size:  clamp(40px, 6vw, 45px);
  font-weight: 900;
}
.terms-header p{
  font-size: clamp(30px, 6vw, 35px);
  font-family: 'Courier New', Courier, monospace;
}
.terms-header small{
  font-size: clamp(16px, 6vw, 25px);
  opacity: 0.7;
  font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
.terms-header h1 span{
  color:#23d1c5;
}

.terms-container{
  display:flex;
  gap:60px;
  margin-top:50px;
}

.terms-menu{
  width: 350px;
  border-right:1px solid rgba(255,255,255,0.2);
  padding-right:40px;
}

.terms-menu ul{
  list-style:none;
}

.terms-menu li{
  margin-bottom: 25px;
  color:#a7b9c5;
}

.terms-menu li.active{
  color:white;
  font-weight:600;
  border-left:3px solid white;
  padding-left:10px;
}

.terms-content{
  flex:1;
}
.terms-content ul li{
  margin-bottom: 30px;
  line-height: 1.8;
  font-size: 18;
  opacity: 0.8;
  font-weight: 500;
}

.feedback-box{
  background: rgba(255,255,255,0.05);
  padding: 25px;
  border-radius:12px;
  text-align:center;
  margin-top: 70px;
}
.feedback-emojis{
    font-size: 30px;
}
.feedback-box{
font-size: 19px;
font-weight: 700;
}
/* Responsive */

@media(max-width:768px){
  .terms-container{
    flex-direction:column;
  }

  .terms-menu{
    width:100%;
    border-right:none;
    border-bottom:1px solid rgba(255,255,255,0.2);
    padding-bottom:20px;
  }
}