/* ========================================= */
/* SECTION */
/* ========================================= */

.transport-section{
  position:relative;
  overflow:hidden;
}

/* ========================================= */
/* CARD */
/* ========================================= */

.transport-card{
  background:#ffffff;
  border-radius:28px;
  padding:45px;
  box-shadow:0 15px 40px rgba(0,0,0,0.08);
  position:relative;
  z-index:2;
}

/* ========================================= */
/* TITLE */
/* ========================================= */

.transport-content h1{
  color:var(--primary-blue);
  font-size:38px;
  font-weight:700;
  margin-bottom:30px;
  position:relative;
  padding-left:22px;
}

.transport-content h1::before{
  content:"";
  position:absolute;
  left:0;
  top:4px;
  width:6px;
  height:90%;
  background:var(--accent-red);
  border-radius:10px;
}

/* ========================================= */
/* FLOAT IMAGE */
/* ========================================= */

.transport-image{
  float:right;
  width:360px;
  margin:0 0 20px 35px;
  position:relative;
  overflow:hidden;
  border-radius:22px;
  box-shadow:0 10px 25px rgba(0,0,0,0.12);
}

.transport-image img{
  width:100%;
  display:block;
  transition:0.4s ease;
}

.transport-image:hover img{
  transform:scale(1.05);
}

/* BADGE */

.transport-badge{
  position:absolute;
  bottom:16px;
  left:16px;
  background:rgba(38,52,137,0.92);
  color:#ffffff;
  padding:10px 16px;
  border-radius:50px;
  font-size:14px;
  font-weight:600;
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
}

/* ========================================= */
/* TEXT */
/* ========================================= */

.transport-content p{
  color:var(--text-black);
  font-size:16px;
  line-height:1.9;
  margin-bottom:22px;
  text-align:justify;
}

/* CLEAR FLOAT */

.transport-content::after{
  content:"";
  display:block;
  clear:both;
}

/* ========================================= */
/* MOBILE */
/* ========================================= */

@media(max-width:991px){

  .transport-card{
    padding:30px 22px;
  }

  .transport-image{
    float:none;
    width:100%;
    margin:0 0 25px 0;
  }

  .transport-content h1{
    font-size:30px;
  }

}

@media(max-width:768px){

  .transport-content h1{
    font-size:26px;
  }

  .transport-content p{
    font-size:15px;
  }

}