/* Banner */
.courses-banner {
    position: relative;
       height: 650px;
    background: url('../images/contact-bg.webp') center/cover no-repeat;
    display: flex;
    align-items: center;
}
#typingText::after{
  content:"";
  animation:blink 1s infinite;
}

@keyframes blink{
  0%,100%{opacity:1}
  50%{opacity:0}
}


/* Dark overlay */


/* Container */
.courses-banner .container {
    position: relative;
    width: 90%;
    max-width: 1200px;
    margin: auto;
}

/* Title */
.courses-banner h1 {
    color: #fff;
    font-size: 56px;
    font-weight: 700;
}
/* CARD */
.contact-card{
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 20px 40px rgba(0,0,0,0.1);
}

/* LEFT PANEL */
.contact-infos{
  background: linear-gradient(135deg,#08289b,#0fb37e);
}

.contact-info h2{
  font-weight:700;
}

.info-item{
  display:flex;
  align-items:flex-start;
  gap:20px;
  margin-bottom:25px;
}
.info-item span{
    margin-left: 30px;
}

.info-item i{
  width:40px;
  height:40px;
  /* background:rgba(255,255,255,0.2); */
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* INPUT STYLE */
.contact-input{
  border:none;
  border-bottom:2px solid #eee;
  border-radius:0;
  padding:14px 5px;
}

.contact-input:focus{
  box-shadow:none;
  border-bottom:2px solid #6ec4a9;
}
.apply-btn {
  display: inline-block;
  margin-top: 20px;
  background: linear-gradient(135deg,#08289b,#0fb37e);
  color: #fff;
  padding: 12px 28px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  transition: .3s;border: none;
}

.apply-btn:hover {
  background: #186de3;
  color: #fff;
}
.info-box{
  display:flex;
  gap:20px;
  align-items:flex-start;
}



@media(max-width:768px){
    .info-box{
        flex-direction: column;
        text-align: center;
    }
     .contact-info{
    text-align:left;
  }
  .contact-item{
    gap:12px;
    margin-bottom:20px;
  }

  .contact-icon{
    min-width:40px;
    height:40px;
    font-size:16px;
  }

  .contact-text{
    font-size:14px;
  }
}