*,*::before,*::after{
margin: 0;
padding: 0;
box-sizing: border-box;
}

p, h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0; 
}

html, body{
min-height: 100%;
overflow-x: visible; 
height: auto;

}

picture,img {width: 100%;}

:root{
--main-color: #FAFAF8;
--secondary-color: #D9E4DD;
--accent-color: #265A56;
--text-color: #0F2422;
--hover-color: #3D918B; 
--cards-color: #EFF3EF;
--background-gradient: linear-gradient(to bottom, 
#F3F7F4 1%,   /* Start: light green-gray */
    #E7EEEA 100%  /* End: soft gray */
);
--font-nav: clamp(1.7rem, 1.25vw , 1.9rem);
--h1-size: 4.4rem;
--h2-size: clamp(3rem, 1vw + 2.5rem, 4rem);
--h3-size: 2.4rem;
--h4-size:clamp(2.2rem, 0.2vw + 2.1rem, 2.4rem);
--p-size: clamp(1.6rem, 0.2vw + 1.5rem, 1.8rem);
--padding-h3-p:clamp(1.2rem, 0.8vw + 0.8rem, 2rem);
--padding-p-btn:2rem;
--content-bottom-padding:2rem;
--padding-RL-sides: clamp(2.4rem, 1.4vw + 1.7rem, 3.8rem);
--padding-h2-p:2.54rem;
--main-container-padding: clamp(4.2rem, 1vw + 3.7rem, 5.2rem);
--container-width: 162rem;
--padding-block-52:5.2rem;
--padding-block-60:6rem;
--padding-inline-32:3.2rem;
--padding-inline-56:5.6rem;
--padding-16:1.6rem;
--padding-18:1.8rem;
--padding-20:2rem;
--padding-24:2.4rem;
--padding-28:2.8rem;
--padding-32:3.2rem;
--padding-36:3.6rem;
--padding-40:4rem;
--padding-44:4.4rem;
--padding-48:4.8rem;
--padding-52:5.2rem;
--padding-56:5.6rem;
--padding-60:6rem;
--padding-66:6.4rem;
--padding-156:15.6rem;
--img-radius-10:1rem;
--fw-500:500;
--fw-600:600;
--fw-700:700;
--fs-20:clamp(1.8rem, 1.57rem + 0.667vw , 2rem);
}
@font-face {
  font-display: swap; 
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 300;
  src: url('./assets/fonts/heebo-v28-hebrew_latin-300.woff2') format('woff2'); 
}
@font-face {
  font-display: swap; 
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 400;
  src: url('./assets/fonts/heebo-v28-hebrew_latin-regular.woff2') format('woff2');
}
@font-face {
  font-display: swap; 
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 500;
  src: url('./assets/fonts/heebo-v28-hebrew_latin-500.woff2') format('woff2'); 
  }
@font-face {
  font-display: swap; 
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 600;
  src: url('./assets/fonts/heebo-v28-hebrew_latin-600.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 700;
  src: url('./assets/fonts/heebo-v28-hebrew_latin-700.woff2') format('woff2'); 
}
@font-face {
  font-display: swap;
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 800;
  src: url('./assets/fonts/heebo-v28-hebrew_latin-800.woff2') format('woff2');
}
html{
background-color: var(--main-color);
color: var(--text-color);
font-family: "Heebo", sans-serif;
font-size: 10px;
color: var(--text-color);
}
li{list-style: none;}
a{
color: inherit; 
text-decoration: none;
cursor: pointer;
}
hr{
    margin-block: 2rem;
border: none;
height: 0.3rem;
background: var(--accent-color);
}
.highlight-title{
background: linear-gradient(180deg, transparent 54%, #D9E4DD 55%);
display: inline-block;
line-height: 1.4;
padding: 0  1ch;
}
.flex__center{
display: flex;
flex-direction: column;
align-items: center;
justify-content:  flex-start;
}
.flex__center_row{
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 4rem;
}
.secondary-btn{
font-size: 2rem;
background-color: var(--accent-color);
border: none;
color: var(--main-color);
height: 7rem;
width: 100%;
max-width: clamp(32rem, 0.52vw + 29.4rem, 37.2rem);
border-radius: 1.5rem;
display: flex;
justify-content: center;
align-items: center;
transition: background-color .3s;
margin-top: 5.2rem ; /* vertical: top & bottom, horizontal: 0 */
}
.secondary-btn:hover,.hero__cta:hover {background-color: var(--hover-color);}
.secondary-btn:focus {
 outline: 2px solid var(--text-color);
 outline-offset: 0.2rem;
}
.benefits__list > h2,
.treatments__list > h2,
.testimonials__header > h2
{font-size: var(--h2-size);}

.list__container_content > h3, .treatments__list__card__content > h3 {font-size: var(--h3-size);}
.list__container_content > h3,
.treatments__list__card__content > h3
{padding-bottom: var(--padding-h3-p);}

.list__container_content > p,
.treatments__list__card__content > p,
.before__after__card__content > p,
.testimonial__card > p
{font-size: var(--p-size);}

.visually-hidden {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.contact,.pricing_wrapper,.about-page { background-color: var(--main-color); }
.contact .business-info,
.before_after_gallery > main,
.treatments .treatments-list,
.treatments .treatment-intro > div
{
width: 100%;
max-width: 160rem;
margin: 0 auto;
padding: clamp(3.2rem , -0.26rem + 9.1vw , 5.2rem) 1.2rem 4rem;
}
header{
max-width: 162rem;
width: 100%;
margin: 0 auto;
padding: 0.8rem 2.4rem;
display: flex;
justify-content:space-between; 
align-items: center;
position: sticky;
position: -webkit-sticky;
top: 0;
z-index: 2000;
width: 100%;
background: var(--main-color); 
box-shadow: 0 10px 30px -8px rgba(201, 201, 200, 0.4);
border-radius: 2.4rem;
}
.main-nav{ font-size: var(--font-nav);}
.logo-link {
display: block;           
width: fit-content;    
line-height: 0;
}
.logo_footer{
height: 9.4rem;
width: auto;
display: block;
cursor: pointer;
}
.logo {
width: clamp(14rem, 13vw, 18.6rem);
cursor: pointer;
display: block !important;
height: clamp(6.4rem , 4.33rem + 4.6vw , 9.4rem);
width: auto;
}
.main-nav > ul{
display: flex;
align-items: center;
justify-content: center;
gap: clamp(2rem, -1rem + 5vw,8rem); /* Min 2rem, ideal 5vw, max 7.2rem */
}
.main-nav > ul > li > a{
    position: relative;
    padding: 1rem 0;
    font-weight: 300;
}

.main-nav > ul > li > a:before{
    content:'';
    position: absolute;
    height:0.4rem;
    width:0;
    background-color: var(--accent-color);
    bottom: 0;
    right: 0;
    transition: all 0.4s ease;
}
.main-nav > ul > li > a:hover:before{
  width:100%;
}
.main-nav > ul > li > a.active{
font-weight: 500;
}

.main-nav > ul > li > a.active:before {
  width: 100%;
}

.nav__cta{
    font-size: var(--font-nav);
    background-color: var(--accent-color);
    border: none;
    color: var(--main-color);
    width: clamp(18rem, 13.8vw , 20rem);
    height: 5.3rem;
    border-radius: 0.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color .3s;
}
.mobile__nav_toggle .close__icon, .mobile__nav_toggle {display: none;}
.rating {display: none;}
.hero__section{
position: relative;
    height: 65rem;
    max-width: 162rem;
    overflow: hidden;
    margin: 0 auto;
}

.hero__image{
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: clamp(600px, 65vw, 980px);   
    height: 100%;                     
    aspect-ratio: 950 / 650;
}

.hero__image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
    display: block;
}

.hero__content{
    position: absolute;
    z-index: 2;
    right: 0; 
    top: 50%;
    transform: translateY(-50%); 
    width: 100%;
    max-width:72rem;/* right 40% of hero */
    padding-right: 1.6rem;
}

.hero__content p{
    font-size: clamp(4.1rem, 2.7vw, 4.5rem);
    font-weight: 700;
    line-height: clamp(5rem,3.25vw ,5.8rem);
}

.hero__content h1{
    font-size: clamp(2.5rem,1.6vw, 2.8rem);
    font-weight: 350;
    line-height: 144%;
    margin-top: 2.4rem;
    margin-bottom: 4rem;
    width: clamp(60rem, 4vw + 16rem, 64rem);
}

.hero__cta{
    font-size: 2.4rem;
    background-color: var(--accent-color);
    border: none;
    color: var(--main-color);
    height: 7.7rem;
    width: 32rem;
    border-radius: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color .3s;
    position: relative; 
    overflow: hidden;       
}

.hero__cta::after {
  content: "";
  position: absolute; 
  top: 50%; 
  transform: translateY(-50%);
  right: 2.4rem;                    
  width: 1.6rem; 
  height: 1.6rem;
  background: lime;          
  border-radius: 50%;
  z-index: 1;                   
}

.hero__cta::before {
      content: "";
      position: absolute;
      top: 50%; 
      transform: translateY(-50%) scale(1);
      right: 2.4rem;                    
      width: 1.6rem; 
      height: 1.6rem;
      opacity: 1;
      z-index: 00;
      background: limegreen;
      border-radius: 50%;
      animation: breathe-out 1.4s infinite ease-out;
    }

@keyframes breathe-out {
  0%   { transform: translateY(-50%) scale(1);   opacity: 1; }/* ← Full strength */
  100% { transform: translateY(-50%) scale(2.5); opacity: 0;   }/* ← Fade out completely */
}

.expertise__section{
    padding-block: var(--main-container-padding);
    display: flex;
    justify-content: center;  
    padding-inline: 0.5rem;  
}

.expertise__container{
    width: 100%;
    max-width: var(--container-width);
    padding-inline: clamp(0rem, 0.2vw - 0.5rem, 0.2rem);
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-evenly;
}
.expertise__container > .point{ flex: 1 1 100%;  }
.point{
        border-left: 0.56rem solid rgb(from var(--secondary-color) r g b / 30%);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start; 
       margin-inline: 0.5rem;
} 
.point:last-child{border-left: none;}
.point p{
    /* border: 2px solid purple;  */
    font-size: clamp(2rem, 0.8vw + 1.2rem, 2.4rem);
    color: var(--text-color);
    text-align: center;
    padding-top: 1.5rem;
    padding-inline: 1rem;
}

.testimonials {
    padding: var(--main-container-padding) 2.4rem;
    background: linear-gradient(to bottom, 
        #F3F7F4 1%,   /* Start: light green-gray */
        #E7EEEA 100%  /* End: soft gray */
    );
}

.testimonials__header {
    text-align: center;
    padding-bottom: var(--main-container-padding);
}

.testimonials__header > h3 {
    font-size: clamp(2.4rem, 0.8vw + 2rem, 3.2rem);
    padding-block: 1.8rem 1.6rem;
}

.testimonials__header > h4 {
    font-size: clamp(1.9rem, 0.5vw + 1.65rem, 2.4rem);
    font-weight: 500;
}

.testimonials__grid {
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 4rem;
}

.testimonial__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 36rem; 
    flex-shrink: 1; 
    flex-grow: 0;
    background: var(--main-color);
    box-shadow: 0 0.4rem 5rem 0 #C8C8C8;  
    padding: 2rem;
    border-radius: 2rem; 
}

.youtube-player {
    border-radius: 1.5rem;
    width: 100%;
    max-width: 31.5rem;  
    aspect-ratio: 9/16; 
    height: auto;
    background-color: #000;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.youtube-player iframe {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 1.5rem;
    display: block;
}

.play-button {
    width: 68px;
    height: 48px;
    background-color: rgba(255, 0, 0, 0.9);
    border-radius: 12px;
    position: relative;
    z-index: 2;
    transition: transform 0.2s ease-in-out;
}

.play-button::after {
    content: "";
    border-style: solid;
    border-width: 10px 0 10px 20px;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%);
}

.youtube-player:hover .play-button {
    transform: scale(1.1);
    background-color: #ff0000;
}

.testimonial__card > h4 {
    text-align: center;
    font-size: clamp(1.8rem, 0.4vw + 1.4rem, 2.2rem);
    padding-block: 1rem;   
}

.before_after_results{ padding: var(--main-container-padding) 0; }

.before__after__cards__container{
    width: 100%;
    max-width:var(--container-width) ;
    display: flex;
    flex-wrap: wrap;
    gap: clamp(2.4rem , -2.2rem + 6.06vw , 4rem);
    align-items: flex-start;
    justify-content: center;
} 

.before__after__header {
    text-align: center;
    padding: 0 2rem;
}

.before__after__header > h2{
padding-bottom: var(--padding-h2-p);
font-size: var(--h2-size);
}

.before__after__header > h3{
    font-size: clamp(1.8rem, 0.6vw + 1.5rem, 2.4rem);
    font-weight: 500;
    padding-bottom: var(--main-container-padding);
}

.before__after__card{
    display: flex;
    flex: 0 1 clamp(36rem , 7rem + 37.7vw , 55.2rem);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    width: fit-content;
    max-width: 100%;
    height: auto;
    border-radius: 0 0 1.5rem 1.5rem ;
    box-shadow: 0 2.4rem 73.6px -28px rgba(31, 48, 37, 0.4); 
}

.before__after__img{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.8rem;
    border-radius: 1.5rem 1.5rem 0 0;
    overflow: hidden;
}

.before__after__img > picture > img,
.before__after__img > img{
    width: 100%;
    aspect-ratio: 272 / 362;
    object-fit: cover;
    display: block;
}

.before__after__card > svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.before__after__card__content{
    padding: clamp(2.4rem, 1.2vw + 1.8rem, 3.6rem) clamp(2rem, 1vw + 1.5rem, 3rem);
    background-color: var(--cards-color);
    text-align: center;
    width: 100%;
}

.before__after__card__content > h4{
    font-size: var(--h4-size);
    padding-bottom: 1rem;
}

.treatments__list{
    background: var(--background-gradient);
    padding: var(--main-container-padding) 0;
}

.treatments__cards__container{
    max-width: var(--container-width);
    padding-top: clamp(4.3rem, 2vw + 3.3rem, 6.3rem);
    gap: clamp(1.6rem , -98rem + 120vw , 4rem);
    align-items: flex-start;
}

.treatments__cards__container > article {
    background-color: var(--main-color);
    flex: 0 1 clamp(33rem , 29.65rem + 9.56vw , 44rem );
    /* flex: 0 1 44rem; */
    border-radius: 3.2rem;
    box-shadow: 0 0.4rem 4rem 1rem #E0DFDF;
}

.treatments__cards__container > article > img {
 border-radius: 3.2rem 3.2rem 0 0;
 width: 100%;
 height: auto;
}

.treatments__list__card__content{

    padding: clamp(3rem, 0.8vw + 2.6rem, 3.8rem) 2.4rem;
    text-align: right;
}

.treatments__list__card__content > p {
    padding-bottom: var(--padding-p-btn);
}

.card-btn{
    font-size: 1.8rem;
    font-weight: 600;
    border: 0.25rem solid var(--accent-color);
    color: var(--accent-color);
    height: 5.3rem;
    border-radius: 0.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color .3s;
    display: flex;
    gap: 1.6rem; 
}

.card-btn > svg{
    width: 1.9rem;
    height: 1.9rem; 
    fill: var(--accent-color);
}

.card-btn:hover{
    background-color: var(--accent-color);
    color: var(--main-color);
}

.card-btn:hover svg{fill: var(--main-color);}


.benefits__list{ 
    text-align: center;
    padding: var(--main-container-padding) 2.4rem;
}

.benefits__list > h2 {text-align: center;}

.benefits__container{
    display: flex;
    flex-direction: column;
    justify-content:center ;
    align-items: start;
}

.list__container:nth-child(odd){align-self: flex-end;}

.list__container{
    max-width: 108rem;
    background-color: white;
    border: 0.2rem solid var(--secondary-color);
    border-right: 7.5rem solid var(--secondary-color);
    border-radius: 1.6rem;
    margin-top: 6rem;
    padding: 4rem var(--padding-RL-sides);
    display: flex;
    position: relative;
}

.list__container_content{
    text-align: right;
    margin-left: clamp(0px, 12vw - 12rem, 6rem);
}

.list__container > img
{
    height: auto;
    object-fit:cover;
    width: 100%;
    max-width: 336px
}

.list__container > svg{
    position: absolute;
    right: 0;                    
    top: 50%;                   
    transform: translateY(-50% ); 
    height: 6rem;
    width: 6em;
    margin-right: -6.5rem;  

}

footer{background-color: var(--secondary-color);}

footer > p {
    font-size: 1.6rem;
    text-align: center;
    padding-bottom: 2.4rem;
}

.footer-wrapper{
    padding-block: 3.6rem ;
    padding-inline: 2rem;
    display: flex;
}

.footer-wrapper>*{flex:1 1 30rem}
.social-media{padding-right:1.2rem}
.social-media>h3{font-size:1.6rem;padding-block:2.8rem 1.4rem;line-height:1}
.icons-wrapper>a:first-child,.icons-wrapper>a:nth-child(2){padding-left:3.2rem}
.beauty_treatment_list_nav{padding-bottom:2.8rem}
.icons-wrapper > a > svg{
    width: 3.2rem;
    height: 3.2rem;
}

footer .social-media .whatsapp-btn{
    background-color:#126832 ;
    margin-top:1.6rem ;
    font-size: 1.6rem;
    font-weight:700;
    border: none;
    color: var(--main-color);
    max-width:  17.2rem;
    width: 100%;
    height: 4.5rem;
    border-radius: 1.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    transition: background-color .3s;
}

footer .social-media .whatsapp-btn > img{
 width: 100%;
 width: 2.4rem;
 height: 2.4rem;
}

.footer-nav,
.treatment_list_nav ,
.beauty_treatment_list_nav,
.footer-info ,
.business-info > address >h3
{
    font-size: 1.6rem;
    line-height: 1;
}

.footer-nav > ul > li,
.treatment_list_nav > ul > li,
.beauty_treatment_list_nav> ul > li,
.footer-info  > ul > li,
.business-info > address > h3
{
padding-bottom: 1.6rem;
}

.footer-nav > h3 ,
.treatment_list_nav > h3,
.beauty_treatment_list_nav > h3,
.footer-info > h3 {padding-bottom: 2rem;}

 business-info > address{ font-style: normal;}
.business-info > address > h3
{
padding-block: 2.8rem 1.6rem;
}

 .business-info >  address > p{
     display: flex;
       align-items: center;
       gap: 1.6rem;
       margin-bottom: 1.2rem;
 }
 .business-info >  address > p > a,
 .business-info >  address > p > time
{font-size: 1.6rem;}

 .business-info > address > p > svg
{
    fill: var(--text-color);
    width: 2rem;
    height: 2rem;
}

.about-page .about-wrapper{
    max-width: var(--container-width);
    margin: 0 auto;
    text-align: center;
}

.about-page .about-wrapper > h1
{
    font-size: var(--h2-size);
    text-align: center;
    background: linear-gradient(180deg, transparent 55%, #D9E4DD 20%);
    display: inline-block;
    padding: 0 1ch;
    margin-block: var(--padding-60);
}

.about-page .values-and-vision
{
    display: flex;
    justify-content: center;
    align-items: center;
   gap: clamp(2rem, -14.55rem + 13.22vw, 61.6rem);
    min-height: 48rem; 
    height: auto;
    padding-inline: 1.2rem;
}

 .about-page .content_text
 {
    text-align: center;
    margin:  auto 0;
    width: 100%;
    max-width: 74rem;
 }


 .about-page .content_text > blockquote > p
 {
    font-size: clamp(2.4rem , 3.2vw , 3.2rem);
    font-weight:var(--fw-700);
    margin: 0 auto;
}

 .about-page .content_text > p
 {
    font-size: var(--fs-20);
    padding-block: var(--padding-24) var(--padding-32);
 }

 .about-page .benefits_points
 {
    display: flex;
    justify-content: space-around;
 }

.about-page .benefits_points >div
{
    display: flex;
    align-items: center;
    gap: 0.8rem
}

.about-page .benefits_points>div>svg{fill:var(--accent-color)}
.about-page .benefits_points>div>p{font-size:var(--p-size)}

 .about-page .values-and-vision > img
 {
    object-fit: cover;       
    object-position: center;
    width: 100%;
    max-width: 31rem;
    height: auto;
    border-radius: 2rem;
    overflow: hidden;
    display: block;
}
.about-page .education,
.about-page .experience,
.about-page .proffessional_developent,
.about-page .teaching_experience{
    display: flex;
    justify-content: space-evenly;
    gap:clamp(0rem, -34.4rem + 31.3vw, 15.6rem);
    margin-bottom: var(--padding-16);
    padding-inline: var(--padding-16);
} 

.about-page .teaching_experience{ margin-bottom: 5.2rem}

.flex-direction-reverse{flex-direction: row-reverse;}

.about-page .education_text ,
.about-page .experience_text,
.about-page .proffessional_developent_experience_txt,
.about-page .teaching_experience_txt
{ 
    text-align: right;
    margin:  auto 0;
}

.about-page .education_text > h2 ,
.about-page .experience_text >h2,
.about-page .proffessional_developent_experience_txt > h2,
.about-page .teaching_experience_txt > h2
{
    font-size: 2.8rem;
    padding-bottom:clamp(1.8rem , 0.98rem + 1.78vw , 2.4rem);
}

.about-page .education_text > p ,
.about-page .experience_text >p,
.about-page .proffessional_developent_experience_txt > p,
.about-page .teaching_experience_txt > p
{
    font-size: var(--fs-20);
}

.about-page .img-container > img,
.about-page .cert-container> img
{
    width: 100%;
    height: 100%;
    object-fit:cover;
    display: block;
    border-radius: 2.8rem;
}

.about-page .img-container
{
    max-width: 52rem;
    height: 52rem;
    aspect-ratio: 1/1;
}

.about-page .cert-container
{
    height:68rem;
    aspect-ratio: 3/4;
}

.carousel-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    margin: 0 auto; 
    width: 100%;

}

.carousel-wrapper{
    overflow: visible;
    display: flex; 
    align-items: center; 
    justify-content: center;
    gap: 1rem;
    margin: 0 auto;
    width: 100%;
    max-width: 66rem;
}

 .about-page .carousel-wrapper::-webkit-scrollbar{display: none;}

.carousel {
    flex: 1 1 52rem;
    width: 100%;  
    max-width: 52rem;  
    gap: 2rem;
    aspect-ratio: 3/4;
    display: flex;
    align-items: center;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    scroll-behavior: smooth;
}

.card{
    /* border: 2px dashed rgb(255, 179, 0); */
    align-content: center;
    scroll-snap-align: start;
    flex: 0 0 100%; 
    width: 100%;
}

.nav-btn{
    border-radius: 50%;
    background: var(--secondary-color);
    color: var(--text-color);
    box-shadow: 0 4px 10px rgba(92, 92, 92, 0.1);
    font-size: 1.4rem;
    width: 5rem;
    height: 5rem;
    cursor: pointer;
    border: none;
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.5s ease;
}

.next:hover,
.prev:hover
{
    background: var(--accent-color);
    color: var(--main-color);
}

.carousel-dots {
    display: flex;
    justify-content: center;
    gap: 0.8rem;
    margin-bottom: 1.2rem;
}

.carousel-dots span {
    width: 1.6rem;
    height: 1.6rem;
    background-color: var(--secondary-color);
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
}

.carousel-dots span.active{
    background-color: var(--accent-color);
    width: 3rem;
    border-radius: 1rem;
}

.about-page .proffessional_developent {
    gap: 2.4rem; 
}

.about-page .cert-container-2
{
    flex: 0 0 100%; 
    width: 100%;
     align-content: center;
   scroll-snap-align: start;
}

.about-page .cert-container-2 > img
{
    width: 100%;
    height: 100%;
    object-fit:cover;
    display: block;
    border-radius: 2.8rem;
}
.landscape-carousel::-webkit-scrollbar{display: none;}

.landscape-carousel{
   display: flex;
    align-items: center;
    margin: 0 auto;
    gap: 1rem;
    flex: 1 1 68rem; 
    max-width: 68rem;
    height: 48rem;
    aspect-ratio: 1.41/1;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    scroll-behavior: smooth;
    margin: 0 auto;
}

.landscape-wrapper {
    display: flex;
    align-items: center; 
    justify-content: center;
    gap: 1.5rem;
    width: 100%;
    max-width: 105rem;
}

.landscape-section{
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 2rem;
    margin: 0 auto; 
    width: 100%;
}

.about-page .carousel-wrapper::-webkit-scrollbar{display: none;}
.landscape-dots{
     display: flex;
    justify-content: center;
    gap: 0.8rem;
    margin-bottom: 1.2rem;
}
.landscape-dots span {
    width: 1.6rem;
    height: 1.6rem;
    background-color: var(--secondary-color);
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
}
.landscape-dots span.active{
    background-color: var(--accent-color);
    width: 3rem;
    border-radius: 1rem;
} 
   .pricing_wrapper{ text-align: center; }
   .pricing .pricing_wrapper{
    padding-block: clamp(3.2rem , -0.26rem + 9.1vw , 5.2rem);
    padding-inline: 0.8rem;
   }

   .pricing .pricing_wrapper > h1 {
    font-size:clamp(3.2rem , 2.27rem + 2.67vw , 4.4rem);
   }

  .pricing .pricing-list{
    height: auto;
    width: fit-content;
    max-width: 100%; 
    margin: 0 auto;
    background-color: #F0F4F2;
    border-right: solid 0.8rem var(--accent-color) ;
    box-shadow: 0 0.8rem 4rem 0.1rem #E0DFDF;
    padding: var(--padding-32) clamp(1.2rem, -7rem + 18vw,  4.8rem);
    margin-top: clamp(2.4rem , -0.36rem + 7.3vw , 4rem);
  }
  .pricing .treatments_pricing_list{padding-bottom: var(--padding-28);}
  .pricing .treatment{
    display: flex;
    gap: var(--padding-16);
    padding-bottom: 0.8rem;
    justify-content: space-between;
  }
  .pricing .treatments_pricing_list > p{
    font-size:clamp(1.4rem, 1.05rem + 0.9vw , 1.6rem);
    text-align: right;
  }
.pricing .treatment > h3,
.pricing .treatment > p{font-size: clamp(1.6rem, 0.65rem + 2.5vw , 2.1rem);}
.pricing .treatment > p{font-weight: 700;}

.dotted-line {
  height: 3px;
   background: repeating-linear-gradient(
    to right,
    var(--text-color) 0px,
    var(--text-color) 4px,   
    transparent 4px,
    transparent 8px 
  );
  background-size: 8px 100%;
  margin: 2.4rem 0;
  flex: 1;
  border: none;
  margin: auto 0;
}

.contact .business-info{ display: flex; gap:1.2rem ;}

.small{ flex: 0 1 40%; }

.big{ flex: 0 1 60%; }

.contact .business-info-wrapper{ margin: auto 0; }

.contact .business-info-wrapper >  address{ font-style: normal;}

.contact .business-info-wrapper > h1,
.contact .FQA-wrapper > h2
{
    font-size:clamp(2.8rem , 2.1rem + 1.81vw , 3.2rem);
    padding-bottom:clamp(2.4rem, 1.02rem + 3.63vw , 3.2rem);
}

.contact .business-info-wrapper >  address > p{
       display: flex;
       align-items: center;
       gap: 1.6rem;
       padding-bottom: clamp(2rem , 1.3rem + 1.81vw , 2.4rem);
}

.contact .business-info-wrapper >  address > p > a,
.contact .business-info-wrapper >  address > p > time
{
    font-size: clamp(1.8rem, 1.45rem + 0.90vw , 2rem);
    font-weight:500;
}

.contact .business-info-wrapper >  address > p > svg
{
    fill: var(--text-color);
     width: clamp(2.4rem, 1.02rem + 3.63vw , 3.2rem);
     height: clamp(2.4rem, 1.02rem + 3.63vw , 3.2rem);
}
.contact .embeded-map > iframe { width: 100%; height: 100%;}
.contact .FQA{ background: var(--background-gradient);}

.contact .FQA-wrapper{
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 160rem;
    margin: 0 auto;
    padding-inline:1.2rem; 
    padding-top: clamp(3.2rem , 1.81rem + 3.63vw , 4rem);; 
}

.contact .FQA-wrapper > details
{
    font-size: clamp(1.8rem, 1.45rem + 0.90vw , 2rem);
    font-weight: 600;
    padding-block: 2.8rem ;
    border-top: 0.1rem solid var(--accent-color);
}
.contact .FQA-wrapper > details > summary 
{
    cursor: pointer;
    list-style: none;
    outline: none;
    display: flex;
    align-content: center;
    justify-content: space-between;
    padding-left: clamp(0rem , -5.52rem + 14.52vw , 3.2rem);
}

summary::marker, 
summary::-webkit-details-marker 
{
  display: none;
  content: none;
}

.contact .FQA-wrapper > details > summary::after
{
    content:'+';
    font-size: 3.6rem;
    line-height: 0.5;
    align-self: center;
    padding-inline: 1.8rem;
}

.contact .FQA-wrapper > details[open] > summary::after{ content: '-'; }
.contact .FQA-wrapper > details > p,
.contact .FQA-wrapper > details > ol
{
    padding-top: 2.4rem;
    line-height: 1.5;
    font-weight: 400;
    padding-inline: 1.4rem;
}

.contact .FQA-wrapper > details > ol > li{
    list-style: inside;
     text-indent: -2.8rem;
     padding-right: 1.6rem;
     text-align: right;
     line-height: 1.5;
     padding-bottom: 1.2rem;
}

.contact .whatsapp-btn{
    background-color:#08973d ;
    font-size: clamp(2rem , 1.35vw + 0.90vw , 2.2rem);
    font-weight:700;
    border: none;
    color: var(--main-color);
    max-width:  clamp(20rem , 13rem + 18.1vw , 24rem);
    width: 100%;
    height: clamp(5.6rem , 1.81vw + 5vw , 6rem);
    border-radius: 1.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    transition: background-color .3s;
}
.contact .whatsapp-btn:hover { background-color:#075E54 ;}
.contact .whatsapp-btn > img{
 width: 100%;
 width: clamp(3.2rem , 2.5rem + 1.81vw , 3.6rem);
 height: clamp(3.2rem , 2.5rem + 1.81vw , 3.6rem);
}

.before_after_gallery .gallery_content{text-align: center;} 
.before_after_gallery .gallery_content > h1 {font-size: clamp(3.2rem, 2.26rem + 2.66vw ,4rem);}
.before_after_gallery .before__after__cards__container{ margin-bottom: 10rem;}
.before_after_gallery .gallery_content > h2 {
    font-size: clamp(2.4rem, 1.5rem + 2.66vw ,3.6rem);
    padding-block: 1.2rem;
    font-weight: 600;
}

.before_after_gallery .gallery_content > h3 {
    font-size: clamp(1.8rem, 1.56rem + 0.66vw ,2rem);
    font-weight: 500;
}

.before_after_gallery  .filter{
    padding-block:clamp(2.4rem, 1.5rem + 2.66vw ,3.6rem) clamp(4rem, 3.53rem + 4.66vw ,4.4rem);
}

.before_after_gallery .filter > label
{
font-size: clamp(1.8rem, 1.56rem + 0.66vw ,2rem);
padding-left:clamp(2.4rem, 1.5rem + 2.66vw ,3.6rem);
font-weight: 600;
}
.before_after_gallery #filter-gallery {font-size: clamp(1.8rem, 1.56rem + 0.66vw ,2rem);} 
#filter-gallery{padding-block: 0.4rem;}
.hidden {display: none;}

.treatments > main {padding-bottom: 16em;}
.treatments .treatment-intro  {
    background: linear-gradient( #E7EEEA 60%, var(--main-color) 40%);
    text-align: center;
    padding-block: 0 8rem;
}
.treatments  .clinic-benefits  {
    display: flex;
    gap: clamp(2rem , -40.66rem + 33.33vw , 6rem);
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
}
.treatments .clinic-benefits  > * {flex: 1 1 28.8rem;}

.treatments .clinic-benefits > article {
    max-width: 100%;
    padding: 2.4rem;
    background-color: var(--main-color);
    border-radius: 2.4rem;
    box-shadow: 0 2.4rem 6.4rem -2.8rem #E0DFDF; 
}
.treatments .clinic-benefits > article > svg {
    fill: var(--accent-color);
    width: 3.2rem;
    height: 3.2rem;
}
.treatments .clinic-benefits > article > h3{
    font-size: 2rem;
    padding-block: 2rem 1.2rem;
    font-weight: 800;
}

.treatments .clinic-benefits > article > p{ font-size: 1.6rem; }
.treatments .treatments_list > .treatments__cards__container { padding-block: 0 5.2rem; }
.treatments .treatment-intro > div > h1{font-size: clamp(3.2rem, 2.26rem + 2.66vw ,4rem);}
.treatments .clinic-benefits{margin-top: clamp(2.8rem , -0.8rem + 8vw , 5.2rem);}
.treatments .treatments__cards__container > article{ background-color:#EFF3EF ; }

.treatment > main > article,
.terms main,
.privacy main,
.accessibility-content
{
    padding-block: 5.2rem 3.2rem;
    width: 100%;
    max-width: 110rem;
    margin: 0 auto;
    line-height: 1.2;
    padding-inline:2rem;
}

.treatment > main > article > h1,
.privacy  h1,
.terms h1,
.accessibility-content > h1 {font-size: 3.6rem;}

.treatment > main > article > h2,
.privacy  h2,
.terms h2,
.accessibility-content > h2
{
    font-size: clamp(2.6rem, 2.6rem + 0.307vw ,2.8rem);
    padding-block: 2.4rem 0rem;
}

.treatment > main > article > h3,
.privacy h3,
.terms h3,
.accessibility-content > h3
{
    font-size: 2.2rem;
    padding-block: 2.4rem 0.8rem;
}

.treatment > main > article > h4,
.privacy h4,
.accessibility-content > h4
{
   font-size: 1.8rem; 
    padding-block: 1.2rem 1rem;
}

.treatment > main > article > p,
.privacy  p,
.terms p,
.accessibility-content > p,
.privacy  ul > li,
.terms ul > li,
.accessibility-content  ul > li
{
     line-height: 1.6;
}

.treatment > main > article > p,
.treatment > main > article > ul > li,
.accessibility-content  ul > li,
.accessibility-content > p

{
    font-size: 1.6rem;
    text-align: justify;
    padding-block: 0.8rem;

}

.privacy  ul > li,
.terms ul > li,
.privacy  p,
.terms p{
    font-size: 1.6rem;
    padding-block: 0.8rem; 
}

.treatment > main > article > ul > li{
    list-style:inside;
     line-height: 1.6;
     text-indent: -2.4rem;
     padding-right: 1.6rem;
     text-align: right;
}

@media(max-width:1301px){
.testimonials__grid{justify-content: space-evenly;}
    .treatments .treatment-intro  {
    background: #E7EEEA;
    text-align: center;
    margin-bottom: clamp(4rem,  0.1rem + 8vw , 6.4rem);
     padding-bottom: clamp(0.4rem,  0.153rem + 0.66vw , 2.4rem);
}
.treatments .clinic-benefits  > * {flex: 1 1 36rem;}
}


@media screen and (min-width: 1140px) and (max-width: 1301px) {
.treatments .treatment-intro > div{
    padding-inline: 8.4rem;
}
}

@media (max-width: 1101px) {

    header{
        padding-inline:clamp(0.2rem, -0.52rem + 1.5vw, 0.8rem);
        padding-block:clamp(0.8rem, 0.55rem + 1.2vw, 1.2rem);
    }
    .main-nav{
            display: none;
            position:absolute;
            inset: 7rem 2rem auto;
            padding: 4.4rem;
            background-color: white;
            border-radius: 1.6rem;
    }

    .main-nav > ul{
        display: grid;
        text-align: center;
        gap: 4rem;
    }

    .main-nav[data-visible]{
            position: fixed;
            display: block !important;
    }
    .mobile__nav_toggle{
        order: 1;
        cursor: pointer;
        background: transparent;
        border: 0;
        display: block;
    }

    .logo-link          { order: 3; }   
    .nav__cta           { order: 2; }   
    .mobile__nav_toggle { order: 1; }  
header{
    padding: 0.8rem;
}
    .hero__section {
        height: auto;      
        min-height: auto;   
        display: flex;
        flex-direction: column;
        justify-content: flex-start; 
        align-items: center;
        background-color:#F8F8F5 ; 
        margin: 0 !important;
    }

    .hero__content{ padding-right: 0; }
    
    .hero__image,
    .hero__content {
        position: relative;  
        top: auto;
        left: auto ;
        right: auto;
        transform: none;
        /* border: 1rem solid rgb(202, 50, 205) */
    }

    .hero__content {
        order: 1;
        text-align: center;
    }

    .rating {
        display: flex;
        gap: 1rem;
        padding-top: 2.4rem;
    }

    .rating > p:first-of-type {
        font-size: 1.7rem;
        line-height: 0;
        font-weight: 500;
    }

    .stars > svg{
            width: 2rem;
            height: 2rem;
    }

    .hero__content > p {
        font-size:  clamp(2.3rem, 2.2rem + 2vw, 4rem);
        padding-top: 1.2rem;
        padding-inline:clamp(1rem, 21.8vw - 75.5rem, 6rem);
        line-height: 1.2;
    }

    .hero__content h1 {
        font-size: clamp(2rem, 1.6vw + 1.04rem, 2.8rem);
        width: 100%;
        font-weight: 400;
        margin-top: 1.2rem;
        margin-bottom: 2.8rem;
        padding-inline: clamp(1rem, 2vw - 0.2rem, 2rem);
    }

    .hero__cta{
        margin: 0 auto;
        font-size: 2rem;
        height: 6.4rem;
        width: 28rem;
        border-radius: 1.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #1F615C;
        transition: background-color .3s;
        position: relative;   
        overflow: hidden;
        margin-bottom: 2.4rem;    
        box-shadow: 0px 22px 21.1px -20px rgba(31, 97, 92, 0.57);
    }

    .hero__image {
        order: 2;
        width: 100%;
        max-width: 41.4rem; 
        aspect-ratio: 412 / 532;
        height: auto;
        padding-inline: 1rem;
        margin-bottom: 5rem;
        position: relative;
    }

    .hero__image::before {
    content: "";
    position: absolute;
    bottom: -20%;
    left: 16%;
    transform: translate(-50%, 0);
    width: 130%;  /*120%*/              
    height: 130%; /*120%*/ 
    background: url(./assets/ornament_left.svg) no-repeat center/contain;
    z-index: -1;
    pointer-events: none;
    }

    .hero__image::after {
    content: "";
    position: absolute;
    bottom: -19%;
    left: 81%;
    transform: translate(-50%, 0);
    width: 130%;               
    height: 130%;
    background: url(./assets/ornament_right.svg) no-repeat center/contain;
    z-index: -1;
    pointer-events: none;
    }

    .hero__image picture,
    .hero__image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block;
    }
    
.about-page .content_text > p{padding-block: var(--padding-16) var(--padding-24);}
.about-page .values-and-vision {padding-inline: 1rem;}
.about-page .content_text{padding-inline: var(--padding-16);}
    .about-page .education > * ,
    .about-page .experience > * ,
    .about-page .proffessional_developent > *,
    .about-page .teaching_experience > *
    {
        flex: 1 1 50%;
    }

    .about-page .teaching_experience{
    margin-bottom: 2.4rem
}
    .about-page .education_text,
    .about-page .experience_text,
    .about-page .proffessional_developent_experience_txt,
    .about-page .teaching_experience_txt { text-align: center; }

    .about-page .education_text > p,
    .about-page .experience_text > p,
    .about-page .proffessional_developent_experience_txt > p,
    .about-page .teaching_experience_txt > p
    {
        padding-inline: var(--padding-24);
    }

    .about-page .img-container{
        max-width: 100%;
        height: auto;
    }
    
    .about-page .cert-container {
        max-height: 68rem;
        width: 100%;
        height: auto;
    }

    .nav-btn {display: none;}
    .carousel {
        flex: 1 1 100%;
        overflow-x: auto; 
        -webkit-overflow-scrolling: touch; 
        scroll-snap-type: x mandatory;
    }

.carousel-dots span {
    width: 1.2rem;
    height: 1.2rem;
}

.landscape-dots span {
    width: 1.2rem;
    height: 1.2rem;
}

.landscape-carousel{
  max-height: 48rem;
  height: auto;
}

.contact .business-info{gap:clamp(2rem ,1.3rem + 1.81vw ,2.4rem)}
.embeded-map.big {
    width: 100%;
    line-height: 0;
    position: relative;
    overflow: hidden;
    background-color: #f0f0f0; 
}

.embeded-map.big a {
    display: block;
    width: 100%;
    height: 100%;
}
.embeded-map.big img {
aspect-ratio: 3 / 1; 
width: 100%;
max-width: 1028px; 
height: auto;
object-fit: cover;
margin: 0 auto;
display: block;
image-rendering: -webkit-optimize-contrast;
}
.embeded-map.big:hover img {
    filter: brightness(0.9);
}
.map-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(24, 139, 67, 0.9); 
    color: white;
    padding: 1.2rem 2.4rem;
    border-radius: 50px;
    font-size: 1.6rem;
    font-weight: bold;
    pointer-events: none;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}
.footer-wrapper{flex-wrap:wrap;gap:.8rem}
.footer-wrapper>*{flex:1 1 20rem}
.business-info{flex-grow:10}
}

@media (min-width: 1101px){.hero__content h1 { max-width:55rem ;}}
@media (min-width: 1600px){.hero__content h1 { max-width:60rem ;}}
@media(max-width:999px){
.about-page .values-and-vision{flex-direction:column-reverse;height:auto}
.about-page .values-and-vision>*{min-height:0}
.about-page .content,.about-page .content_text{max-width:none;width:100%}
.about-page .values-and-vision>img{margin-block:var(--padding-24)}
.expertise__section{display:none}
.treatments__cards__container>article{box-shadow:0 .2rem 2rem 1rem #e0dfdf}
.list__container{flex-direction:column}

.list__container  picture > img{
        display: flex;
        max-width: 100%;
        height: auto;
        object-fit:contain;
}
.list__container:nth-child(odd){align-self:normal}
.list__container_content{padding-bottom:var(--content-bottom-padding)}
.big,.small{flex:0 1 50%}
}

@media(max-width: 800px){
.about-page .education  ,
.about-page .experience  ,
.about-page .proffessional_developent ,
.about-page .teaching_experience {
flex-direction: column;
gap: var(--padding-24);
margin-bottom: var(--padding-66);
}

.about-page .education_text > p,
.about-page .experience_text > p,
.about-page .proffessional_developent_experience_txt > p,
.about-page .teaching_experience_txt > p {padding-inline: 0;}

.about-page .img-container{
max-width: 100%;        
aspect-ratio: unset;   
margin: 0 auto;
}

.about-page .about-wrapper>h2{margin-block:var(--padding-56) var(--padding-40)}

.point > svg {
width: 3.2rem;
height: 3.2rem;
flex-basis: 24%;
}

.before__after__card > svg {
        width: 4rem;
        height: 4rem;
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
}
.small{flex:0 1 58%}
.big{flex:0 1 43%}
}

@media (min-width: 1280px) {
.testimonial__card {flex-basis: calc(25% - 3rem);}
}

@media (min-width: 600px) and (max-width: 1280px) {
    .testimonial__card {
       /* border: 3px solid red; */
       flex-basis: calc(50% - 2rem);
    }
}

@media (min-width: 1217px) and (max-width: 1280px) {
    .testimonial__card {margin-inline: 5rem;}
}

@media(max-width: 650px){

.about-page .values-and-vision > img{
    width: auto;
    max-width:100%;
}

.list__container{border-right:.2rem solid var(--secondary-color)}
.list__container > svg{
            margin-right: 0;
            top: 0;
            right:40%;
            transform: translateY(-55%);
            height: 5.6rem;
            width: 5.6rem;
    }
    
    .highlight-title{
        display:inline ;
        padding: 0;
        line-height: normal;
        background: none;
}

br{ display: none;}
.contact .business-info-wrapper > h1,
.contact .FQA-wrapper > h2 {text-align: center;}
.big,.small{flex:0 1 100%}.contact 
.embeded-map>iframe{height:35.2rem}
.contact .business-info-wrapper{margin:0 auto}
.contact .business-info{flex-direction:column}
.contact .whatsapp-btn{margin:0 auto}
.before_after_gallery .gallery_content>h1{line-height:1.2}
}


@media(max-width: 450px){
    .testimonial__card {
        flex-basis: 100%;
}

 .about-page .benefits_points{
    justify-content: space-around;
    align-items: center;
    padding-inline: 1.2rem;  
 }

 .about-page .benefits_points div { gap: 0;}
 .about-page .benefits_points div:nth-child(1),
.about-page .benefits_points div:nth-child(2){
margin-left: 2rem;
}

.about-page .content_text{
    padding-inline: 0; 
}
    .expertise__section{
        padding-inline: 0;
        padding-block: 2.4rem;
    }

    .expertise__container{
        flex-wrap: wrap;
        gap: 1.6rem;
}
 
    .point{
        border-left: none;
        display: flex;
        flex-direction: row;
        align-items:center;
        justify-content: flex-start;  
}

 .point > p{
     padding: 0;
 }

.before__after__img{
    gap: 0.5rem;
}
.dotted-line { display: none; }

.footer-wrapper{
    gap: 1.4rem;
    padding-bottom: 1rem;
  }

.footer-wrapper > * {
        flex: 1 1 16rem;
        padding-bottom: 1.6rem;
}
.business-info{padding-bottom:.8rem}

.icons-wrapper > a > svg{
    width: 2.8rem;
    height: 2.8rem;
}

.icons-wrapper > a:nth-child(1),
.icons-wrapper > a:nth-child(2)
{
    padding-left: 2.4rem ;
}

footer > p {
    font-size: 1.4rem;
    padding-bottom: 2rem;
}

.footer-nav,
.treatment_list_nav ,
.beauty_treatment_list_nav,
.footer-info ,
.business-info > address > h3,
.business-info >  address > p > a,
.business-info >  address > p > time
{
    font-size: 1.4rem;

}
.social-media{ padding-right: 0;}
footer .social-media .whatsapp-btn{

    font-size: 1.4rem;
    max-width:  14.5rem;
}

footer .social-media .whatsapp-btn > img{
 width: 100%;
 width: 2rem;
 height: 2rem;
}
}

@media(max-width:400px){
    .before__after__cards__container{padding-inline: 2rem;}
}