/* Clear Correct page css start */

.blue-text {
  color: #004aad;
}
.text-center {
  text-align: center;
  display: block;
}
.hero{
    position:relative;
}

.hero img{
    height:650px;
    object-fit:cover;
    width:100%;
}

.hero-content{
    position:absolute;
    top:50%;
    right:10%;
    transform:translateY(-50%);
    max-width:320px;
    width: 50%;
}

.hero-content span{
    display:block;
    font-size:14px;
    margin-bottom:10px;
}


/* INTRO */

.intro {
    background: #d8e6ed;
}
.common-space {
    padding:90px 0;
}

.pb-0 {
    padding-bottom: 0;
}

.intro p{
    margin-bottom:25px;
}

/* TWO COLUMN */
.image-block {
    position: relative;
    height: 100%;
}
.image-block img {
    vertical-align: middle;
    width: 100%;
    position: absolute;
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
}
.two-col {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.content-block h2{
    margin:5px 0 20px;
}

.content-block p{
    margin-bottom:18px;
}

/* RESPONSIVE */

@media(max-width:768px){

    .hero img{
        height:350px;
    }

    .hero-content{
        right:30px;
    }

    .two-col{
        grid-template-columns:1fr;
    }
}
.section-heading{
    text-align:center;
    margin-bottom:40px;
}

.section-heading h2{
    margin-top:5px;
}

/* Designed For Life */
.card-content h5 {
    margin-top: 0;
}
.card-content h3 {
    margin-bottom: 6px;
}

.life-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:40px;
}

.life-card {
    position:relative;
    overflow:hidden;
    border-radius:20px;
    padding-top: 80%;
}

.life-card img{
    width:100%;
    display:block;
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: center;
}

.life-card .overlay{
    position:absolute;
    inset:0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffffed 100%);
}

.card-content{
    position:absolute;
    bottom:20px;
    left:20px;
    right:20px;
    text-align:center;
}

/* Different */

.different-content h2 {
    margin-top: 5px;
    margin-bottom: 20px;
}

.different-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.different-content ul{
    margin-top:20px;
    padding-left:20px;
}

.different-content li{
    margin-bottom:12px;
}

.different-note{
    max-width:630px;
    margin:40px auto 0;
    text-align:center;
    font-size: 16px;
}

/* Treatment */

.treatment-image{
    border-radius:20px;
    margin-bottom:60px;
    width:100%;
}

.treatment-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px 40px;
}

.treatment-grid h4{
    margin-bottom: 3px;
    margin-top: 0;
}

/* Journey */

.journey{
    background: #d8e6ed;
}

.journey h2{
    margin:5px 0 40px;
    text-align:center;
}

/* Responsive */
@media(max-width:1140px){
    .hero-content{
        width: auto;
    }
    .hero img {
      height: 430px;
    }
    .common-space {
      padding: 60px 0;
    }
    .pb-0 {
      padding-bottom: 0;
    }
}
@media(max-width:768px){
    .life-grid,
    .different-grid,
    .treatment-grid{
        grid-template-columns:1fr;
    }
    .image-block img {
      top: 0;
    }
    .image-block {
      padding-top: 100%;
    }
    .two-col {
      gap: 28px;
    }
    .different-note {
      margin: 10px auto 0;
    }
}
@media(max-width:640px){
    .hero img {
        height: 450px;
        object-position: bottom;
        object-fit: contain;
    }
    .hero-content {
        right: unset;
        left: 20px;
        width: calc(100% - 40px);
        top: 40px;
        transform: unset;
        text-align: center;
        max-width: 100%;
    }
    .common-space {
        padding: 40px 0;
    }
    .treatment-image {
        margin-bottom: 28px;
    }
    .treatment-grid {
        gap: 10px;
    }
    .journey h2,
    .section-heading {
      margin-bottom: 24px;
    }
 }

.pb-0 {
  padding-bottom: 0;
}