/*==============================================================
    BetterSelfMD Service Spotlight
==============================================================*/

.bsmd-service-spotlight{
    padding:6rem 0;
    overflow:hidden;
    background:#FBFAF7;
     background:
        var(--rb-hero-bgimage),
        radial-gradient(circle at 25% 25%, rgba(19,168,162,.25), transparent 28%),
        linear-gradient(135deg, #F2F0EC, #ffffff);
    background-size: auto 80%, auto, auto;
    background-position: right center, left top, center;
    background-repeat: no-repeat, no-repeat, no-repeat; 
}

.bsmd-service-spotlight-card{

position:relative;

overflow:hidden;

display:flex;

align-items:center;

padding:1rem;

background-size: contain;

background-position:right center;

background-repeat:no-repeat;
}

/************************************************/

.bsmd-service-spotlight-content{

    position:relative;
    z-index:10;

    max-width:560px;

}

.bsmd-service-spotlight-eyebrow{

display:inline-flex;

padding:8px 18px;

border-radius:40px;

background:rgba(19,168,162,.10);

color:var(--rb-hero-color);

font-size: 10px;

letter-spacing:.18em;

text-transform:uppercase;

font-weight:700;

margin-bottom:18px;
}

.bsmd-service-spotlight-content h2{

margin:0 0 25px;

font-size: clamp(1rem,5vw,3rem);

line-height:.95;

color:#1D2430;
}

.bsmd-service-spotlight-description{

    color:#66707A;

    font-size:18px;

    line-height:1.8;

    margin-bottom:35px;

}

.bsmd-service-spotlight-description p{

    margin-bottom:20px;

}

/************************************************/

.bsmd-service-spotlight-list{

display:grid;

grid-template-columns: repeat(1,minmax(0,1fr));

gap: 4px 30px;

list-style:none;

padding:0;

margin:0 0 45px;
}

.bsmd-service-spotlight-list li{

    position:relative;

    padding-left:34px;

    color:#1D2430;

    font-weight:600;

    line-height:1.6;

}

.bsmd-service-spotlight-list li:before{

    content:"✓";

    position:absolute;

    left:0;
    top:3px;

    width:22px;
    height:22px;

    border-radius:50%;

    background:var(--rb-hero-color);

    color:#fff;

    text-align:center;

    line-height:22px;

    font-size:12px;

}

/************************************************/

.bsmd-service-spotlight-btn{

    display:inline-flex;

    align-items:center;

    gap:12px;

    padding:16px 30px;

    border-radius:12px;

    background:var(--rb-hero-color);

    color:#fff;

    text-decoration:none;

    text-transform:uppercase;

    font-weight:700;

    font-size:13px;

    letter-spacing:.08em;

    transition:.25s;

}

.bsmd-service-spotlight-btn:hover{

    background:#fff;

    color:var(--rb-hero-color);

    transform:translateY(-3px);

    box-shadow:0 0 4px var(--rb-hero-color);

}

.bsmd-service-spotlight-btn span{

    font-size:18px;

}

/************************************************/

@media (max-width:991px){

.bsmd-service-spotlight{
    padding:2rem 0;
    background:#FBFAF7;
     background:
        radial-gradient(circle at 25% 25%, rgba(19,168,162,.25), transparent 28%),
        linear-gradient(135deg, #F2F0EC, #ffffff);
    background-size: auto, auto;
    background-position: left top, center;
    background-repeat: no-repeat, no-repeat; 
}

.bsmd-service-spotlight-card{
    padding:1rem;
    min-height:auto;

}
.bsmd-service-spotlight-content{
    max-width:100%;
}
.bsmd-service-spotlight-content h2{
    font-size:2rem;
}

.bsmd-service-spotlight-list{
    grid-template-columns:1fr;
}

}

@media (max-width:576px){
    .bsmd-service-spotlight-card{
        padding:2rem 1.5rem;
    }

    .bsmd-service-spotlight-content h2{
        font-size:2rem;
    }

    .bsmd-service-spotlight-description{
        font-size:16px;
    }

    .bsmd-service-spotlight-btn{
        width:100%;
        justify-content:center;
    }
}