
body{
  background:#f5f7fb;
}

/* ===== BANNER ===== */
.ct-banner{
  background:#1e2b4f;
  color:#fff;
  text-align:center;
  padding:70px 20px;
}

.ct-banner h1{
  font-size:42px;
  margin-bottom:10px;
}

.ct-banner p{
  font-size:20px;
  opacity:0.9;
}

/* ===== SECTION ===== */
.ct-section{
  padding:80px 20px;
}

.ct-container{
  max-width:1200px;
  margin:auto;
}

/* GRID */
.ct-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:30px;
  align-items:start;
  padding: 20px;
   background:#fff;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

/* ===== LEFT SIDE ===== */
.ct-info h2{
  margin-bottom:20px;
  font-size:28px;
  color:#1e2b4f;
}

.ct-info-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  /* background:#fff; */
  border-radius:10px;
  overflow:hidden;
  /* box-shadow:0 10px 25px rgba(0,0,0,0.08); */
}

/* BOX */
.ct-box{
  padding:30px 20px;
  text-align:center;
}

/* DIVIDERS */
.ct-box:nth-child(1),
.ct-box:nth-child(3){
  border-right:1px solid #e5e5e5;
}

.ct-box:nth-child(1),
.ct-box:nth-child(2){
  border-bottom:1px solid #e5e5e5;
}

/* ICON */
.ct-box i{
  font-size:26px;
  color:#1e2b4f;
  margin-bottom:10px;
}

.ct-box h4{
  margin-bottom:8px;
  font-size: 16px;
}

.ct-box p{
  font-size:17px;
  color:#666;
}

/* ===== RIGHT FORM ===== */
.ct-form{
  background: #8f8d8d;
  /* padding:30px; */
  border-radius:10px;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.ct-form h2{
   margin-bottom:20px;
  font-size:28px;
  color:#1e2b4f;
  padding: 5px 20px;
}
form{
    padding: 20px;
}
/* INPUT ROW */
.ct-row{
  display:flex;
  gap:10px;
  margin-bottom:18px;
}

.ct-row input{
  flex:1;
  padding:12px;
  border:1px solid #ddd;
  border-radius:5px;
  outline:none;
  font-size: 16px;
}

textarea{
  width:100%;
  padding:12px;
  border:1px solid #ddd;
  border-radius:5px;
  margin-bottom:15px;
  resize:none;
  font-size: 16px;
}

/* BUTTON */
button{
  background:#1e2b4f;
  color:#fff;
  padding:12px 20px;
  border:none;
  border-radius:5px;
  cursor:pointer;
  transition:0.3s;
  font-size: 16px;
}

button:hover{
  background:#16213a;
}

/* ================= RESPONSIVE ================= */



@media(min-width:1600px){
  .ct-container{
    max-width:1300px;
  }
}
/* @media(max-width:1500px){
  .ct-container{
    max-width:1100px;
  }
} */

/* 1300 */
@media(max-width:1300px){
  .ct-banner h1{
    font-size:36px;
  }
}

/* 1100 */
@media(max-width:1100px){
  .ct-grid{
    grid-template-columns:1fr;
  }
}

/* 980 */
@media(max-width:980px){
  .ct-info h2{
    font-size:24px;
  }
}

/* 768 */
@media(max-width:768px){
  /* .ct-info-grid{
    grid-template-columns:1fr;
  } */

  .ct-box{
    border-right:none !important;
    border-bottom:1px solid #e5e5e5;
  }

  .ct-box:last-child{
    border-bottom:none;
  }
}

/* 480 */
@media(max-width:480px){
  .ct-banner h1{
    font-size:28px;
  }

  .ct-row{
    flex-direction:column;
  }

  .ct-form{
    padding:20px;
  }
}





/* ===== GOOGLE MAP ===== */
/* ===== MAP SECTION ===== */
.ct-section{
  padding:80px 20px;
}

.ct-map{
  max-width:1200px;
  margin:auto;
}

/* MAP FRAME */
.ct-map iframe{
  width:100%;
  height:400px;
  border:0;
  border-radius:12px;
  display:block;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

/* ================= RESPONSIVE ================= */

/* 1500 */
@media(max-width:1500px){
  .ct-map{
    max-width:1100px;
  }
}

/* 1300 */
@media(max-width:1300px){
  .ct-map iframe{
    height:380px;
  }
}

/* 1100 */
@media(max-width:1100px){
  .ct-map iframe{
    height:350px;
  }
}

/* 980 */
@media(max-width:980px){
  .ct-map iframe{
    height:320px;
  }
}

/* 768 */
@media(max-width:768px){
  .ct-section{
    padding:40px 15px;
  }

  .ct-map iframe{
    height:280px;
  }
}

/* 480 */
@media(max-width:480px){
  .ct-map iframe{
    height:240px;
    border-radius:8px;
  }
}

/* ===== FAQ SECTION ===== */
.faq-section{
  padding:80px 20px;
  background: #eae0ee;
}

.faq-container{
  max-width:1100px;
  margin:auto;
  padding: 0 20px;
}

.faq-container h2{
  text-align:center;
  margin-bottom:40px;
  font-size:30px;
}

/* FAQ ITEM */
.faq-item{
  border:1px solid #e5e5e5;
  border-radius:8px;
  margin-bottom:15px;
  overflow:hidden;
}

/* QUESTION */
.faq-question{
  width:100%;
  padding:15px;
  background:#474444;
  border:none;
  text-align:left;
  font-weight:bold;
  cursor:pointer;
  position:relative;
  font-size: 18px;
}

/* ICON (+ / -) */
.faq-question::after{
  content:'+';
  position:absolute;
  right:20px;
  font-size:18px;
}

/* ACTIVE STATE */
.faq-item.active .faq-question::after{
  content:'-';
}

/* ANSWER (ANIMATION) */
.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height 0.4s ease;
  background:#fff;
  padding:0 15px;
}

.faq-answer p{
  padding:15px 0;
  color:#555;
}

/* ================= RESPONSIVE ================= */

/* 1500 */
@media(max-width:1500px){
  .ct-container{max-width:1100px;}
}

/* 1300 */
@media(max-width:1300px){
  .ct-banner h1{font-size:36px;}
}

/* 1100 */
@media(max-width:1100px){
  .ct-grid{
    grid-template-columns:1fr;
  }
}

/* 980 */
@media(max-width:980px){
  .ct-info h2{font-size:24px;}
}

/* 768 */
@media(max-width:500px){
  .ct-info-grid{
    grid-template-columns:1fr;
  }

  .ct-box{
    border-right:none !important;
    border-bottom:1px solid #e5e5e5;
  }

  .ct-box:last-child{
    border-bottom:none;
  }
}

/* 480 */
@media(max-width:480px){
  .ct-banner h1{font-size:28px;}

  .ct-row{
    flex-direction:column;
  }

  .ct-form{
    padding:20px;
  }

  .faq-container h2{
    font-size:24px;
  }
}
