/*====================================================

BOOK APPOINTMENT BUTTON

====================================================*/

.book-btn{

display:inline-flex;

align-items:center;

justify-content:center;

padding:16px 30px;

background:var(--primary);

color:#ffffff !important;

font-weight:700;

text-decoration:none;

border-radius:999px;

transition:.3s;

}

.book-btn:hover{

background:var(--primary-dark);

color:#ffffff !important;

transform:translateY(-2px);

}

.book-btn:hover{

transform:translateY(-3px);

box-shadow:0 20px 40px rgba(74,106,90,.35);

}

.card{
    background:var(--white);
    border-radius:28px;
    padding:40px;
    box-shadow:var(--shadow-sm);
    border:1px solid rgba(79,107,91,.08);
    transition:all .35s ease;
    position:relative;
    overflow:hidden;
}

.card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:6px;
    height:100%;
    background:linear-gradient(
        to bottom,
        var(--primary-light),
        var(--primary)
    );
}

.card:hover{
    transform:translateY(-8px);
    box-shadow:var(--shadow);
}

/*====================================================

BUTTONS

====================================================*/

.btn-primary,

.btn-secondary,

.btn-outline{

display:inline-flex;

align-items:center;

gap:12px;

padding:16px 28px;

border-radius:999px;

font-weight:600;

transition:.35s;



}

.btn-primary{

background:var(--primary);

color:white;

}

.btn-primary:hover{

background:var(--primary-dark);

transform:translateY(-3px);

}

.btn-secondary{

background:white;

color:var(--primary);

border:2px solid var(--primary);

}

.btn-secondary:hover{

background:var(--primary);

color:white;

}

.btn-outline{

border:2px solid #ddd;

background:white;

color:#444;

}

.btn-outline:hover{

border-color:var(--primary);

color:var(--primary);

}

.btn-primary img,

.btn-secondary img,

.btn-outline img{

width:20px;

height:20px;

}



/*  end buttons */

.trust-card img{

transition:transform .35s ease;

}

.trust-card:hover img{

transform:scale(1.12);

}

/*====================================================

SVG ICONS

====================================================*/

svg{

display:block;

}

.condition-card img,

.trust-card img,

.feature img,

.hero-buttons img{

width:26px;

height:26px;

object-fit:contain;

}

.condition-card img{

margin-bottom:22px;

}

/*====================================================

TOP PHONE

====================================================*/

.top-phone{

display:flex;

align-items:center;

gap:8px;

color:#fff;

font-weight:600;

}

.top-phone img{

width:16px;

height:16px;

display:block;

flex-shrink:0;

filter:brightness(0) invert(1);

}

.top-contact{

    display:flex;
    align-items:center;
    gap:10px;

}

.top-contact img{

    width:18px;
    height:18px;
    display:block;

}

.top-contact a{

    display:flex;
    align-items:center;
    text-decoration:none;

}

.top-phone-link{

    color:#ffffff;
    font-weight:600;
    transition:color .25s ease;

}

.top-phone-link:hover{

    color:#d9e7dd;

}

/*====================================================

FLOATING WHATSAPP

====================================================*/

.floating-whatsapp{

position:fixed;

right:25px;

bottom:25px;

display:flex;

align-items:center;

gap:12px;

padding:16px 22px;

background:#25D366;

color:#fff;

text-decoration:none;

font-weight:700;

border-radius:999px;

box-shadow:0 18px 45px rgba(0,0,0,.25);

z-index:9999;

transition:.3s;

}

.floating-whatsapp img{

    width:22px;

    height:22px;

    display:block;

    flex-shrink:0;

}

.floating-whatsapp:hover{

transform:translateY(-4px);

box-shadow:0 24px 50px rgba(0,0,0,.3);

}

@media(max-width:768px){

.floating-whatsapp span{

display:none;

}

.floating-whatsapp{

padding:18px;

border-radius:50%;

}

}

/*====================================================

GOOGLE BUTTON

====================================================*/

.btn-google{

display:inline-flex;

align-items:center;

gap:12px;

padding:16px 28px;

border-radius:999px;

background:#4285F4;

color:white;

font-weight:700;

text-decoration:none;

transition:.3s;

}

.btn-google img{

width:22px;

height:22px;

}

.btn-google:hover{

background:#2d6cdf;

transform:translateY(-3px);

}


/*<!-- ======================================================
animated stats
====================================================== -->*/

.stats{

padding:90px 7%;

background:white;

}

.stats-grid{

display:grid;

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

gap:35px;

text-align:center;

}

.stat{

padding:35px;

border-radius:25px;

background:#F8F6F2;

transition:.3s;

}

.stat:hover{

transform:translateY(-6px);

}

.stat h2{

font-size:3rem;

color:var(--primary);

}

/*open menu */

.menu-toggle{

display:none;

background:none;

border:none;

cursor:pointer;

}

@media(max-width:992px){

.menu-toggle{

display:block;

}

nav{

position:fixed;

top:0;

right:-100%;

width:320px;

height:100vh;

background:white;

display:flex;

flex-direction:column;

padding:120px 40px;

transition:.4s;

box-shadow:-10px 0 30px rgba(0,0,0,.12);

}

nav.active{

right:0;

}

}
.card-link{

margin-top:30px;

font-weight:700;

color:var(--primary);

transition:.3s;

}

.journey-card:hover .card-link{

letter-spacing:.5px;

}

.feature-icon{

width:72px;

height:72px;

display:flex;

align-items:center;

justify-content:center;

background:rgba(74,106,90,.08);

border-radius:18px;

}

.feature-icon img{

width:42px;

height:42px;

color:var(--primary);

}

/* neww css for new svg */

.feature-icon{

    width:72px;
    height:72px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:rgba(74,106,90,.08);

    border-radius:20px;

}

.feature-icon svg,
.feature-icon img{

    width:42px;
    height:42px;
    color:var(--primary);

}

/*==================================================
GOOGLE REVIEW CARD
==================================================*/

.google-rating-card{

    max-width:460px;

    margin:0 auto;

    padding:50px 40px;

    background:#fff;

    border-radius:28px;

    text-align:center;

    box-shadow:0 20px 45px rgba(0,0,0,.08);

    transition:.35s;

}

.google-rating-card:hover{

    transform:translateY(-8px);

}

.google-icon{

    width:70px;

    margin-bottom:20px;

}

.google-rating-value{

    font-size:4rem;

    font-weight:700;

    color:var(--primary);

    line-height:1;

}

.google-stars{

    display:flex;

    justify-content:center;

    gap:6px;

    margin:20px 0;
     color:#F4B400;   /* Google Gold also try #FFC107 or #FFD54A*/

}

.google-stars img{
    
    width:26px;

    height:26px;
    color:#F4B400;   /* Google Gold */
    /*color:#D4AF37; */ /*Luxuary gold*/
    filter:drop-shadow(0 2px 4px rgba(0,0,0,.15));

}

.google-rating-text{

    font-size:1.15rem;

    margin-bottom:10px;

}

.google-rating-sub{

    color:#6d6d6d;

    margin-bottom:30px;

    line-height:1.6;

}

.review-buttons{

    display:flex;

    gap:15px;

    justify-content:center;

    flex-wrap:wrap;

}
.review-trust{

    margin:25px 0;

    display:flex;

    flex-direction:column;

    gap:10px;

    color:var(--primary);

    font-weight:600;

    font-size:.95rem;

}
.form-group{

    margin-bottom:20px;

}

.form-group label{

    display:block;

    margin-bottom:8px;

    font-weight:600;

}

.form-group select{

    width:100%;

    padding:14px;

    border:1px solid #d9d9d9;

    border-radius:12px;

    font-size:1rem;

    background:#fff;

}