.related-products{padding:80px 0;background-color:var(--bg-color)}@media only screen and (max-width:767px){.related-products{padding:40px 0}.related-products .page-width{padding:0}.related-products .swiper{padding:0 20px}}.related-products__heading{margin:0 0 50px}@media only screen and (max-width:767px){.related-products__heading{margin:0 0 20px;padding:0 20px}}.related-products__slider .swiper-button-next,.related-products__slider .swiper-button-prev{position:relative;top:unset;left:unset;right:unset;bottom:unset}.related-products__slider .swiper-button-prev{margin:0 5px 0 0}.related-products__slider .swiper-button-next{margin:0 0 0 5px}.related-products__slider .swiper-slide{height:auto}

/* =========================================
   COMPARE TREATMENTS
========================================= */

.comparison-card{
    display:flex;
    flex-direction:column;
    height:100%;
    background:#fff;
    color:#172462;
}

.comparison-card__image-wrapper{
    position:relative;
    background:#F4F6FC;
    aspect-ratio:1/1;
    overflow:hidden;
}

.comparison-card__image{
    width:100%;
    height:100%;
    object-fit:contain;
    padding:20px;
}

.comparison-card__badge{
    position:absolute;
    top:12px;
    right:12px;
    background:#172462;
    color:#fff;
    font-size:10px;
    font-weight:700;
    padding:5px 8px;
    border-radius:3px;
    text-transform:uppercase;
}

.comparison-card__main{
    padding:18px 0 22px;
    text-align:center;
}

.comparison-card__title{
    display:block;
    min-height:42px;
    margin-bottom:8px;
    color:#172462;
    text-decoration:none;
    font-size:15px;
    line-height:1.4;
    font-weight:500;
}

.comparison-card__price{
    margin:10px 0 18px;
}

.comparison-card__button{
    width:140px;
    margin:0 auto;
}

.comparison-card__details{
    flex:1;
    border-top:1px solid #D8DBE5;
}

.comparison-card__section{
    padding:16px 0;
    border-bottom:1px solid #D8DBE5;
}

.comparison-card__section-heading{
    margin:0 0 10px;
    font-size:10px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#172462;
}

.comparison-card__description{
    font-size:12px;
    line-height:1.55;
    color:#172462;
    min-height:74px;
}

.comparison-card__list,
.comparison-card__skin-types{
    list-style:none;
    margin:0;
    padding:0;
}

.comparison-card__list li{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-bottom:8px;
    font-size:12px;
}

.comparison-card__bullet{
    width:7px;
    height:7px;
    background:#172462;
    margin-top:5px;
    flex-shrink:0;
}

.comparison-card__skin-types li{
    margin-bottom:5px;
    font-size:12px;
    text-decoration:underline;
}

@media(max-width:767px){

.comparison-card__details{
    display:none;
}

.comparison-card__title{
    min-height:auto;
}
.comparison-card__concerns,
.comparison-card__skin-types{
  font-size:12px;
  line-height:1.55;
  color:#172462;
}

.comparison-card__concerns ul,
.comparison-card__skin-types ul{
  list-style:none;
  margin:0;
  padding:0;
}

.comparison-card__concerns li,
.comparison-card__skin-types li{
  margin:0 0 7px;
}

.comparison-card__concerns a,
.comparison-card__skin-types a{
  color:inherit;
  text-decoration:none;
}

.comparison-card__concerns a:hover,
.comparison-card__skin-types a:hover{
  text-decoration:underline;
}
/* Equal-height Best For section */
.comparison-card__section--best-for{
  height:210px;
  min-height:210px;
  box-sizing:border-box;
  flex:none;
}

/* Put each concern on a separate line */
.comparison-card__skin-concern{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 6px;
  font-size:12px;
  line-height:1.4;
}

.comparison-card__skin-concern:last-child{
  margin-bottom:0;
}

.comparison-card__skin-concern a,
.comparison-card__skin-concern span{
  display:block;
  color:inherit;
  text-decoration:none;
}
/* Comparison card skin types */
.comparison-card__skin-types{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  min-height:70px;
}

.comparison-card__skin-types > a,
.comparison-card__skin-types > span{
  display:block;
  color:inherit;
  font-size:12px;
  line-height:1.4;
  text-decoration:none;
}

.comparison-card__skin-types > a:hover{
  text-decoration:underline;
}
.comparison-card__skin-types{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}

.comparison-card__skin-type{
  display:block;
  width:100%;
  font-size:12px;
  line-height:1.4;
}

.comparison-card__skin-type a,
.comparison-card__skin-type span{
  display:block;
  color:inherit;
  text-decoration:none;
}

.comparison-card__skin-type a:hover{
  text-decoration:underline;
}
}
