.price-section{
background: linear-gradient(
    to bottom right,
    #FFF4E4 -10%,
    #FFF 85%,
    #F2FFEE 100%
  );  
  padding: 4em 0;
  position: relative;
  overflow: hidden;
}

.price-section h1{
    font-weight: bold;
    background: linear-gradient(135deg, #00AA74, #00C788);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.blur-left{
  width: 470px;
  height: 470px;
  border-radius: 500px;
  opacity: 0.3;
  background: #ffdc9e;
  filter: blur(75px);
  position: absolute;
  top:0;
  left: -20%;
  pointer-events: none;
  z-index: 0;
}
.blur-right{
 width: 470px;
 height: 470px;
 border-radius: 500px;
 opacity: 0.3;
 background: #c6fb87;
 filter: blur(75px);
 position: absolute;
 top: 17%;
 right: -20%;
 pointer-events: none;
 z-index: 0;
}
.card-price{
    z-index: 1;
    position: relative;
    background: #FFFFFF;
    border-radius: 20px;
    padding: 2.1em 1.5em 2em 1.5em;
    font-family: 'Nunito', sans-serif;
    box-shadow: 1px 25px 30px -6px #ece0f54a;
    display: flex;
    flex-direction: column;
    max-width: 345px;
    min-height: 440px;
    margin-top: 2em;
    text-align: center;
}
.card-price.most-popular{
  border: 4px solid #efefef;
  transition: all 0.3s ease;
  margin-top: 0;
  text-align: center;
}
.card-price-content{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.card-price.most-popular:hover{
    box-shadow: 4px 4px 37px -10px #a03eea54;
    border:4px solid #abd700;
}
.card-price.most-popular h3 {
    color: #218025;
}
.card-price h3{
  color: #170F49;
  font-size: 28px;
  font-weight: 700;
  text-align: center;
  font-family: 'Nunito', sans-serif;
}
.card-price h4{
  color: #6F6C90;
  font-size: 18px;
  font-weight: 300;
  font-family: 'Nunito', sans-serif;
}
.card-price h5{
  font-weight: 700;
  color: #170F49;
  margin-top: 1.5em;
  font-size: 18px;
  margin-bottom: 1em;
  font-family: 'Nunito', sans-serif;
}
.card-price ul li{
    color: #170F49;
    font-size: 18px;
    display: flex;
    flex-direction: row;
    gap: 6px;
    align-items: center;
    margin-bottom: 11px;
    font-weight: 500;
    font-family: 'Nunito', sans-serif;
}
.card-price ul{
  list-style: none;
  padding: 0;
  margin-bottom: 0;
}
.relative{
  position: relative;
}
.most-popular-icon{
  width: 200px;
  height: 40px;
  position: absolute;
  top: -23px;
  display: flex;
  align-items: center;
  left: 0;
  right: 0;
  margin:0 auto;
}
.most-popular-icon-thumb{
  width: 60px;
  height: 60px;
  z-index: 2;
}
.most-popular-label{
  background: #4CAF50;
  display: block;
  position: absolute;
  padding: 8px 28px 8px 54px;
  border-radius: 24px;
  left: 8px;
}
.most-popular-label span{
  color: #FFFFFF;
  font-size: 16px;
  font-family: 'Nunito', sans-serif;  
  font-weight: bold;
}
.card-price-contact a{
  font-size: 18px;
  color: #2F327D;
  text-decoration: none;
  display: block;
  margin-bottom: 0.3em;
}

.flex-container {
    display: flex;
    justify-content:center;
    flex-wrap: wrap;
    gap: 60px;
}
.card-price-contact{
  padding: 1em 0;
}

#features{
    padding: 4em 0;
    margin-bottom: 4em;
}
.features-header{
    background: #7600A5;
    padding: 1em;
    border-radius: 8px 8px 0 0;
}
.features-header h4{
    color: #FFFFFF;
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 0;
}
.features-list{
    list-style: none;
    margin: 0;
    border: 1px solid #E0E0E0;
    padding: 0;
    border-radius: 15px 15px 0 0;
    overflow: hidden;
}
.features-list li{
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    color: #747474;
    padding: 0.5em 0.5em 0.5em 2.5em;
    position: relative;
}
.features-list li:before{
    content: '';
    background: url(../img/icon-check.svg);
    width: 24px;
    height: 24px;
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 11px;
}
.features-list-no-icon li{
    padding: 0.5em;
    color: #747474;
}
.features-list-no-icon li:before{
    display: none;
}
.features-list li:nth-child(odd) {
    background: #F2F2F2;
}
.features-list li:nth-child(even) {
    background: #FFF;
}
.features-list li:hover{
    z-index: 2;
    color: #747474;
    background: #a03eea2b;
}

.flex-list-header{
    display: flex;
    padding: 0 !important;
    align-items: stretch;
    position: relative;
}
.flex-list-header div{
    padding: 15px;
    color: #FFF;
    font-family: 'Montserrat', sans-serif;
    padding: 20px;
}
.flex-list-header div:nth-child(1){
    background: transparent;
    color: #747474;
    font-weight: bold;
    width: 71%;
    display: flex;
    align-items: center;
}
.flex-list-header div:nth-child(2){
    background: #060606;
    width: 15%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;   
    font-size: 16px; 
}
.flex-list-header div:nth-child(3){
    background: #3f3f3f;
    width: 15%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;  
    font-size: 16px;
}
.flex-list-header div:nth-child(4){
    background: #535353;
    width: 15%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;  
    font-size: 16px;
}
.flex-list{
    display: flex;
}
.flex-list div:nth-child(1){
    font-family: 'Nunito', sans-serif;  
    width: 71%;
    display: flex;
    align-items: center;    
    color: #595959;
    font-size: 16px;
}
.flex-list div:nth-child(2){
    width: 15%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;    
}
.flex-list div:nth-child(3){
    width: 15%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;    
}
.flex-list div:nth-child(4){
    width: 15%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;    
}

.flex-list-header div:nth-child(2) span, .flex-list-header div:nth-child(3) span, .flex-list-header div:nth-child(4) span{
    display: none;
}
.pricing-student-input input {
    width: 150px; 
    padding: 10px;
    border-radius: 10px; 
    border: 2px solid #ddd;
    text-align: center;
    font-size: 1.5em;
}

.pricing-student-input input:focus {
    outline: none;
    border-color: #6c5ce7; 
    box-shadow: 0 0 5px rgba(108, 92, 231, 0.5);
}
.icon-price-plan{
    width: 100px;
    padding: 1em 0;
}
.modal-dialog-centered {
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-body {
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-body-content {
  min-height: 310px;
  text-align: center;
}
#accountModalLabel{
    font-size: 2em;
}
.modal-body-content p{
    font-size: 1.4em;
}

.icon-container a{
    flex-direction: column;
    border: 1px solid #EAEAEA;
    padding: 1em;
    border-radius: 8px;
    gap: 11px;
    min-width: 260px;
    text-decoration: none;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.icon-container a:hover{
    background: #f3faff;
}
.icon-container span{
    font-weight: bold;
    font-size: 18px;
}

.modal-icon {
  width: 100px;
  height: auto;
}

.btn-primary, .btn-secondary {
  width: 200px;
  margin-bottom: 10px;
}
.wrapper-icons-account{
    gap:10px;
}
/* Media Queries */
/* Small devices (landscape phones, 576px and up) */
@media (max-width: 767px) {
    .wrapper-icons-account{
        flex-direction: column;
    }
    .flex-list-header div:nth-child(2) b, .flex-list-header div:nth-child(3) b, .flex-list-header div:nth-child(4) b{
        display: none;
    }    
    .flex-list-header div:nth-child(2) span, .flex-list-header div:nth-child(3) span, .flex-list-header div:nth-child(4) span{
        display: block;
        font-weight: bold;
    }
    .modal-body-content p{
        font-size: inherit;
    }
    #accountModalLabel{
        font-size: 1.2em;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
    .flex-container{
        gap:20px;
    }
    .card-price{
        max-width: 320px;
        width: 100%;
        margin-top: 0;
    }
    .flex-list div:nth-child(1){
        width: 62%;
    }
    .flex-list div:nth-child(2){
        width: 20%;
    }
    .icon-container a{
        min-width: 220px;
    }    
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {
    .flex-container{
        gap:20px;
    }
    .card-price{
        max-width: 280px;
    }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) and (max-width: 1399px) {
    .flex-container{
        gap:40px;
    }
}

@media (min-width: 1400px) and (max-width: 2400px) {

}