/* =========================================================
   LIFE O2 MEDICAL
   PREMIUM HEADER CSS
   Main Brand Color: #9D00FF
========================================================= */


/* =========================================================
   ROOT VARIABLES
========================================================= */

:root{

    --primary:#9D00FF;
    --primary-light:#C44DFF;
    --primary-soft:#EBD1FF;

    --purple-dark:#190024;
    --purple-deep:#260035;
    --purple-mid:#520080;
    --purple:#7200A8;

    --white:#ffffff;
    --black:#111111;
    --text:#222222;
    --muted:#777777;

    --gold:#FFD21F;

    --border:#eeeeee;

    --shadow:
        0 10px 35px rgba(0,0,0,.10);

    --transition:
        all .3s ease;
}


/* =========================================================
   GLOBAL
========================================================= */

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

html{
    scroll-behavior:smooth;
}

body{

    margin:0;

    font-family:
        'Poppins',
        Arial,
        Helvetica,
        sans-serif;

    color:var(--text);

    background:#fff;

    overflow-x:hidden;
}

a{
    text-decoration:none;
}

img{
    max-width:100%;
    height:auto;
}


/* =========================================================
   TOP BAR
========================================================= */

.topbar{

    background:

        radial-gradient(
            circle at 8% 50%,
            rgba(157,0,255,.30),
            transparent 28%
        ),

        radial-gradient(
            circle at 92% 50%,
            rgba(157,0,255,.20),
            transparent 28%
        ),

        linear-gradient(
            105deg,
            #190024 0%,
            #39005F 35%,
            #520080 55%,
            #260035 100%
        );

    color:#fff;

    padding-top:10px;
    padding-bottom:10px!important;

    position:relative;

    z-index:1050;

    border-bottom:
        1px solid
        rgba(255,255,255,.08);

}


/* subtle shine */

.topbar::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.25),
            transparent
        );

}


/* =========================================================
   TOP BAR LEFT
========================================================= */

.topbar-left{

    display:flex;

    align-items:center;

    flex-wrap:wrap;
    padding-bottom:10px;

}


/* =========================================================
   TOP BAR ITEM
========================================================= */

.topbar-item{

    display:flex;

    align-items:center;

    gap:12px;

    padding:5px 24px;

    border-right:
        1px solid
        rgba(255,255,255,.15);

    transition:var(--transition);

}

.topbar-item:first-child{
    padding-left:10px;
}

.topbar-item:last-child{
    border-right:none;
}


/* hover */

.topbar-item:hover{

    transform:
        translateY(-1px);

}


/* =========================================================
   TOP BAR ICON
========================================================= */

.topbar-icon{

    color:var(--gold);

    font-size:25px;

    min-width:30px;

    text-align:center;

    filter:
        drop-shadow(
            0 4px 8px
            rgba(255,210,31,.30)
        );

    transition:var(--transition);

}

.topbar-item:hover .topbar-icon{

    transform:
        translateY(-2px)
        scale(1.08);

    filter:
        drop-shadow(
            0 5px 13px
            rgba(255,210,31,.45)
        );

}


/* =========================================================
   TOP BAR TEXT
========================================================= */

.topbar-text{

    line-height:1.2;

}

.topbar-text h6{

    margin:0;

    color:#fff;

    font-size:14px;

    font-weight:700;

    letter-spacing:.2px;

}

.topbar-text p{

    margin:3px 0 0;

    color:
        rgba(255,255,255,.75);

    font-size:12px;

    font-weight:400;

}


/* =========================================================
   CONTACT AREA
========================================================= */

.contact-area{

    display:flex;

    align-items:center;

    justify-content:flex-end;

    gap:18px;

    width:100%;

}


/* =========================================================
   CONTACT LINK
========================================================= */

.contact-link{

    display:flex;

    align-items:center;

    gap:9px;

    color:#fff;

    text-decoration:none;

    font-size:13px;

    font-weight:500;

    white-space:nowrap;

    transition:var(--transition);

}

.contact-link:hover{

    color:#DCA8FF;

}


/* =========================================================
   EMAIL / PHONE CIRCLE
========================================================= */

.contact-icon{

    width:32px;

    height:32px;

    min-width:32px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            var(--primary),
            var(--primary-light)
        );

    border:
        1px solid
        rgba(255,255,255,.25);

    box-shadow:
        0 4px 12px
        rgba(157,0,255,.35);

    transition:var(--transition);

}

.contact-icon i{

    font-size:13px;

}

.contact-link:hover .contact-icon{

    transform:
        translateY(-2px)
        scale(1.08);

    box-shadow:
        0 6px 18px
        rgba(157,0,255,.55);

}


/* =========================================================
   SOCIAL ICONS
========================================================= */

.social-icons{

    display:flex;

    align-items:center;

    gap:7px;

    margin-left:2px;
  
}


/* =========================================================
   SOCIAL BUTTON
========================================================= */

.social-icons a{

    width:32px;

    height:32px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    color:#fff;

    text-decoration:none;

    background:
        rgba(255,255,255,.10);

    border:
        1px solid
        rgba(255,255,255,.18);

    backdrop-filter:blur(8px);

    transition:var(--transition);

}


/* social icon */

.social-icons a i{

    font-size:12px;

}


/* social hover */

.social-icons a:hover{

    background:
        linear-gradient(
            135deg,
            var(--primary),
            var(--primary-light)
        );

    border-color:
        var(--primary);

    color:#fff;

    transform:
        translateY(-3px);

    box-shadow:
        0 6px 18px
        rgba(157,0,255,.45);

}


/* =========================================================
   HEADER AREA
========================================================= */

.header-area{

    background:#fff;

    position:relative;

    z-index:1040;

    padding:8px 0;

    border-bottom:
        1px solid
        rgba(0,0,0,.04);

    box-shadow:
        0 3px 20px
        rgba(0,0,0,.06);

}


/* =========================================================
   NAVBAR
========================================================= */

.header-area .navbar{

    min-height:82px;

    padding:0;

}


/* =========================================================
   LOGO
========================================================= */

.navbar-brand{

    display:flex;

    align-items:center;

    padding:0;

    margin-right:25px;

}

.navbar-brand img{

    height:60px;

    width:auto;

    object-fit:contain;

    transition:var(--transition);

}

.navbar-brand:hover img{

    transform:
        scale(1.04);

}


/* =========================================================
   NAVIGATION
========================================================= */

.navbar-nav{

    align-items:center;

    gap:2px;

}

.navbar-nav .nav-item{

    position:relative;

}


/* =========================================================
   NAV LINK
========================================================= */

.navbar-nav .nav-link{

    position:relative;

    color:
        #10008f;

    font-size:15px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.1px;

    padding:
        27px 12px !important;

    transition:var(--transition);

}


/* hover */

.navbar-nav .nav-link:hover{

    color:
        var(--primary);

}


/* active */

.navbar-nav .nav-link.active{

    color:
        var(--primary);

}


/* =========================================================
   ACTIVE UNDERLINE
========================================================= */

.navbar-nav .nav-link.active::after{

    content:"";

    position:absolute;

    left:12px;

    right:12px;

    bottom:10px;

    height:3px;

    background:
        linear-gradient(
            90deg,
            var(--primary),
            var(--primary-light)
        );

    border-radius:10px;

    box-shadow:
        0 3px 8px
        rgba(157,0,255,.35);

}


/* =========================================================
   DROPDOWN ARROW
========================================================= */

.navbar-nav .dropdown-toggle::after{

    display:inline-block;

    margin-left:7px;

    vertical-align:3px;

    border-top:
        5px solid
        var(--primary);

    border-right:
        4px solid transparent;

    border-left:
        4px solid transparent;

    transition:var(--transition);

}


/* rotate arrow when dropdown open */

.navbar-nav .show.dropdown-toggle::after{

    transform:
        rotate(180deg);

}


/* =========================================================
   NORMAL DROPDOWN
========================================================= */

.dropdown-menu{

    border:none;

    border-radius:16px;

    padding:10px 0;

    background:#fff;

    box-shadow:
        0 15px 45px
        rgba(30,0,50,.14);

}


/* dropdown item */

.dropdown-item{

    color:#333;

    font-size:14px;

    font-weight:500;

    padding:
        10px 20px;

    transition:var(--transition);

}

.dropdown-item:hover{

    background:
        #F6E9FF;

    color:
        var(--primary);

}


/* =========================================================
   MEGA MENU
========================================================= */

.mega-menu{

    position:static !important;

}


/* mega dropdown */

.mega-dropdown{

    width:100%;

    left:0 !important;

    right:0 !important;

    margin-top:0;

    border:none;

    border-radius:
        0 0 20px 20px;

    padding:
        30px !important;

    background:#fff;

    box-shadow:
        0 18px 45px
        rgba(30,0,50,.15);

}


/* =========================================================
   MEGA MENU TITLE
========================================================= */

.mega-title{

    color:
        var(--primary);

    font-size:17px;

    font-weight:700;

    margin:
        0 0 12px;

    padding-bottom:9px;

    border-bottom:
        2px solid
        #F0E3F8;

    position:relative;

}


/* title small line */

.mega-title::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-2px;

    width:40px;

    height:2px;

    background:
        var(--primary);

}


/* =========================================================
   MEGA MENU LINKS
========================================================= */

.mega-dropdown a{

    display:block;

    color:#444;

    text-decoration:none;

    font-size:14px;

    font-weight:500;

    padding:
        7px 0;

    transition:var(--transition);

}

.mega-dropdown a:hover{

    color:
        var(--primary);

    padding-left:8px;

}


/* =========================================================
   CALL / HELPLINE BOX
========================================================= */

.call-box{

    display:flex;

    align-items:center;

    gap:12px;

    margin-left:20px;

    white-space:nowrap;

}


/* =========================================================
   CALL ICON
========================================================= */

.call-icon{

    width:40px;

    height:40px;

    min-width:40px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            var(--primary),
            var(--primary-light)
        );

    box-shadow:
        0 6px 16px
        rgba(157,0,255,.30);

    transition:var(--transition);

}

.call-icon i{

    font-size:17px;

}

.call-box:hover .call-icon{

    transform:
        scale(1.08);

    box-shadow:
        0 8px 20px
        rgba(157,0,255,.45);

}


/* =========================================================
   CALL INFO
========================================================= */

.call-info small{

    display:block;

    color:
        var(--primary);

    font-size:13px;

    font-weight:500;

    margin-bottom:2px;

}

.call-info h4{

    margin:0;

    color:#111;

    font-size:20px;

    font-weight:800;

    line-height:1;

    letter-spacing:.2px;

}


/* =========================================================
   NAVBAR TOGGLER
========================================================= */

.navbar-toggler{

    border:none;

    width:44px;

    height:44px;

    border-radius:10px;

    background:
        #F7EDFF;

    color:
        var(--primary);

    padding:0;

}

.navbar-toggler:focus{

    box-shadow:
        0 0 0 3px
        rgba(157,0,255,.12);

}


/* =========================================================
   CUSTOM TOGGLER ICON
========================================================= */

.navbar-toggler-icon{

    width:24px;

    height:18px;

    background-image:none !important;

    position:relative;

    display:inline-block;

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

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

}

.navbar-toggler-icon::after{

    content:"";

    position:absolute;

    left:0;

    top:7px;

    width:24px;

    height:2px;

    background:
        var(--primary);

}


/* =========================================================
   TABLET / SMALL DESKTOP
========================================================= */

@media(
    min-width:992px
) and (
    max-width:1300px
){

    .topbar-item{

        padding:
            5px 14px;

    }

    .topbar-text h6{

        font-size:13px;

    }

    .topbar-text p{

        font-size:11px;

    }

    .contact-area{

        gap:10px;

    }

    .contact-link{

        font-size:11px;

    }

    .contact-icon{

        width:29px;

        height:29px;

        min-width:29px;

    }

    .social-icons{

        gap:4px;

    }

    .social-icons a{

        width:29px;

        height:29px;

    }

    .navbar-brand img{

        height:54px;

    }

    .navbar-nav .nav-link{

        font-size:13px;

        padding-left:8px !important;

        padding-right:8px !important;

    }

    .call-box{

        margin-left:10px;

    }

    .call-info h4{

        font-size:17px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:991px){

    /* TOP BAR */

    .topbar{

        padding:
            10px 5px;

    }


    /* LEFT ITEMS */

    .topbar-left{

        width:100%;

        justify-content:center;

        margin-bottom:5px;

    }


    .topbar-item{

        border:none;

        padding:
            6px 10px;

        justify-content:center;

    }


    .topbar-item:first-child{

        padding-left:10px;

    }


    .topbar-icon{

        font-size:21px;

        min-width:24px;

    }


    .topbar-text h6{

        font-size:12px;

    }


    .topbar-text p{

        font-size:10px;

    }


    /* CONTACT */

    .contact-area{

        justify-content:center;

        flex-wrap:wrap;

        gap:10px;

        margin-top:5px;

    }


    .contact-link{

        font-size:11px;

    }


    .contact-icon{

        width:30px;

        height:30px;

        min-width:30px;

    }


    .social-icons{

        gap:5px;

        margin-left:0;

    }


    .social-icons a{

        width:30px;

        height:30px;

    }


    /* HEADER */

    .header-area{

        padding:
            6px 0;

    }


    .header-area .navbar{

        min-height:65px;

    }


    /* LOGO */

    .navbar-brand{

        margin-right:10px;

    }


    .navbar-brand img{

        height:58px;

    }


    /* NAV */

    .navbar-nav{

        width:100%;

        align-items:flex-start;

        padding-top:15px;

        padding-bottom:10px;

    }


    .navbar-nav .nav-item{

        width:100%;

    }


    .navbar-nav .nav-link{

        width:100%;

        padding:
            11px 5px !important;

        font-size:14px;

    }


    /* active line */

    .navbar-nav .nav-link.active::after{

        left:0;

        right:auto;

        width:45px;

        bottom:4px;

    }


    /* dropdown */

    .mega-menu{

        position:relative !important;

    }


    .mega-dropdown{

        width:100%;

        position:static !important;

        padding:
            15px !important;

        border-radius:12px;

        box-shadow:none;

        border:
            1px solid
            #F0E3F8;

    }


    .mega-dropdown .row{

        margin:0;

    }


    .mega-dropdown .col-lg-3{

        width:100%;

        padding:0;

    }


    .mega-title{

        margin-top:12px;

        font-size:15px;

    }


    .mega-dropdown a{

        font-size:13px;

        padding:6px 0;

    }


    /* CALL */

    .call-box{

        width:100%;

        margin:
            10px 0 15px;

        justify-content:flex-start;

        padding:
            10px;

        border-radius:12px;

        background:
            #FAF3FF;

    }


    .call-info h4{

        font-size:21px;

    }

}


/* =========================================================
   EXTRA SMALL MOBILE
========================================================= */

@media(max-width:575px){

    .topbar-item{

        padding:
            5px 6px;

        gap:7px;

    }


    .topbar-item:nth-child(3){

        display:none;

    }


    .topbar-text h6{

        font-size:11px;

    }


    .topbar-text p{

        font-size:9px;

    }


    .topbar-icon{

        font-size:18px;

    }


    .contact-area{

        gap:7px;

    }


    .contact-link{

        font-size:10px;

    }


    .contact-icon{

        width:28px;

        height:28px;

        min-width:28px;

    }


    .social-icons a{

        width:28px;

        height:28px;

    }


    .social-icons a i{

        font-size:10px;

    }


    .navbar-brand img{

        height:52px;

    }


    .call-box{

        padding:9px;

    }


    .call-icon{

        width:36px;

        height:36px;

        min-width:36px;

    }


    .call-info small{

        font-size:11px;

    }


    .call-info h4{

        font-size:18px;

    }

}


/* =========================================================
   VERY SMALL DEVICES
========================================================= */

@media(max-width:400px){

    .topbar-item:nth-child(2){

        display:none;

    }


    .contact-link .contact-text{

        display:none;

    }


    .contact-link{

        gap:0;

    }


    .contact-area{

        gap:6px;

    }

}


/* =========================================================
   DROPDOWN DESKTOP HOVER EFFECT
========================================================= */

@media(min-width:992px){

    .mega-menu:hover > .mega-dropdown{

        /* Bootstrap remains click controlled,
           this gives a smooth visual transition */

    }

}


/* =========================================================
   DROPDOWN ANIMATION
========================================================= */

.mega-dropdown{

    opacity:0;

    transform:
        translateY(8px);

    transition:
        opacity .25s ease,
        transform .25s ease;

}


/* Bootstrap adds .show */

.mega-dropdown.show{

    opacity:1;

    transform:
        translateY(0);

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.nav-link:focus,
.contact-link:focus,
.social-icons a:focus,
.navbar-brand:focus{

    outline:
        2px solid
        rgba(157,0,255,.45);

    outline-offset:3px;

}


/* =========================================================
   SELECTION
========================================================= */

::selection{

    background:
        var(--primary);

    color:#fff;

}


/* =========================================================
   SCROLLBAR
========================================================= */

::-webkit-scrollbar{

    width:8px;

}

::-webkit-scrollbar-track{

    background:#f5f5f5;

}

::-webkit-scrollbar-thumb{

    background:
        linear-gradient(
            var(--primary),
            var(--primary-light)
        );

    border-radius:10px;

}

::-webkit-scrollbar-thumb:hover{

    background:
        var(--primary);

}

/* 4 point  */
.medical-features{
   
    margin-top: -30px;
    background: radial-gradient( circle at 8% 50%, rgba(157,0,255,.30), transparent 28% ), radial-gradient( circle at 92% 50%, rgba(157,0,255,.20), transparent 28% ), linear-gradient( 105deg, #190024 0%, #39005F 35%, #520080 55%, #260035 100% );
    border-radius: 20px;
    padding: 25px 15px;
    color:#fff;
    overflow:hidden;
}

.feature-box{
    display:flex;
    align-items:center;
    gap:15px;
    position:relative;
    height:100%;
}

.feature-box::after{
    content:'';
    position:absolute;
    right:-15px;
    top:10%;
    width:1px;
    height:80%;
    background:rgba(255,255,255,.25);
}

.feature-last::after{
    display:none;
}

.feature-icon{
    min-width:60px;
    text-align:center;
}

.feature-icon i{
    font-size:42px;
    color:#fff;
}

.feature-content h5{
    font-size:17px;
    font-weight:700;
    margin-bottom:5px;
}

.feature-content p{
    margin:0;
    font-size:14px;
    color:rgba(255,255,255,.85);
    line-height:1.5;
}

@media(max-width:991px){
    .feature-box{
        margin-bottom:25px;
    }

    .feature-box::after{
        display:none;
    }
}



/* =========================================================
   PREMIUM MEDICAL SERVICES SECTION
========================================================= */

/* =========================================================
   PREMIUM MEDICAL SERVICES
========================================================= */

.services-section{
    position:relative;
    padding:48px 0 52px;
    background:#fff;
    overflow:hidden;
}


/* Soft Background */

.services-section::before{
    content:"";
    position:absolute;

    width:420px;
    height:420px;

    top:-220px;
    left:-180px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.08),
            transparent 68%
        );

    pointer-events:none;
}

.services-section::after{
    content:"";
    position:absolute;

    width:380px;
    height:380px;

    bottom:-220px;
    right:-150px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.06),
            transparent 68%
        );

    pointer-events:none;
}


/* Container */

.services-section .container{
    position:relative;
    z-index:2;
}


/* =========================================================
   HEADER
========================================================= */

.services-header{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:30px;

    margin-bottom:28px;
}


.services-heading{
    position:relative;
}


.heading-line{

    width:45px;
    height:3px;

    margin-bottom:10px;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            #9D00FF,
            #C95CFF
        );
}


.section-label{

    display:block;

    margin-bottom:4px;

    color:#9D00FF;

    font-size:11px;

    font-weight:800;

    letter-spacing:2px;
}


.services-heading h2{

    margin:0 0 5px;

    color:#250024;

    font-size:34px;

    line-height:1.15;

    font-weight:500;

    letter-spacing:-.7px;
}


.services-heading h2 strong{

    color:#9D00FF;

    font-weight:800;
}


.services-heading p{

    margin:0;

    color:#777;

    font-size:13px;
}


/* =========================================================
   VIEW ALL
========================================================= */

.view-services-btn{

    display:inline-flex;

    align-items:center;

    gap:9px;

    padding:11px 20px;

    color:#fff;

    text-decoration:none;

    font-size:12px;

    font-weight:700;

    border-radius:50px;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #6800A8
        );

    box-shadow:
        0 8px 20px rgba(157,0,255,.22);

    transition:.3s ease;
}


.view-services-btn i{
    transition:.3s ease;
}


.view-services-btn:hover{

    color:#fff;

    transform:translateY(-3px);

    box-shadow:
        0 12px 28px rgba(157,0,255,.30);
}


.view-services-btn:hover i{

    transform:translateX(4px);
}


/* =========================================================
   SERVICES GRID
========================================================= */

.services-grid{

    display:grid;

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

    gap:15px;
}


/* =========================================================
   SERVICE CARD
========================================================= */

.service-card{

    position:relative;

    display:flex;

    align-items:center;

    min-height:115px;

    padding:18px 18px;

    border-radius:18px;

    border:1px solid #eee;

    background:#fff;

    box-shadow:
        0 6px 20px rgba(45,0,60,.055);

    overflow:hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


/* Purple side line */

.service-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:3px;
    height:100%;

    background:
        linear-gradient(
            180deg,
            #9D00FF,
            #C95CFF
        );

    transform:scaleY(.2);

    transition:.35s ease;
}


.service-card:hover{

    transform:translateY(-5px);

    border-color:
        rgba(157,0,255,.22);

    box-shadow:
        0 15px 35px rgba(50,0,70,.11);
}


.service-card:hover::before{

    transform:scaleY(1);
}


/* =========================================================
   NUMBER
========================================================= */

.service-number{

    position:absolute;

    top:9px;
    right:13px;

    color:#eee;

    font-size:10px;

    font-weight:800;

    letter-spacing:1px;

    transition:.3s ease;
}


.service-card:hover .service-number{

    color:
        rgba(157,0,255,.25);
}


/* =========================================================
   ICON
========================================================= */

.service-icon{

    flex-shrink:0;

    width:55px;
    height:55px;

    margin-right:15px;

    display:flex;

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

    border-radius:15px;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #6800A8
        );

    box-shadow:
        0 8px 18px rgba(157,0,255,.22);

    transition:.35s ease;
}


.service-icon i{

    color:#fff;

    font-size:21px;

    transition:.35s ease;
}


.service-card:hover .service-icon{

    transform:
        translateY(-3px)
        rotate(3deg);

    box-shadow:
        0 12px 25px rgba(157,0,255,.32);
}


.service-card:hover .service-icon i{

    transform:scale(1.1);
}


/* =========================================================
   CONTENT
========================================================= */

.service-content{

    padding-right:15px;
}


.service-content h4{

    margin:0 0 4px;

    color:#250024;

    font-size:15px;

    font-weight:750;
}


.service-content p{

    margin:0;

    color:#777;

    font-size:11px;

    line-height:1.4;
}


/* =========================================================
   ARROW
========================================================= */

.service-arrow{

    position:absolute;

    right:15px;
    bottom:14px;

    width:25px;
    height:25px;

    display:flex;

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

    border-radius:50%;

    color:#9D00FF;

    background:#f8efff;

    font-size:10px;

    transition:.3s ease;
}


.service-card:hover .service-arrow{

    color:#fff;

    background:#9D00FF;

    transform:translateX(3px);
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:991px){

    .services-section{
        padding:40px 0 45px;
    }

    .services-header{
        align-items:center;
        text-align:center;
        flex-direction:column;
        margin-bottom:24px;
    }

    .heading-line{
        margin-left:auto;
        margin-right:auto;
    }

    .services-heading h2{
        font-size:29px;
    }

    .services-grid{
        grid-template-columns:
            repeat(2,1fr);
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:576px){

    .services-section{
        padding:32px 0 36px;
    }

    .services-heading h2{
        font-size:24px;
    }

    .services-heading p{
        font-size:11px;
        padding:0 10px;
    }

    .section-label{
        font-size:9px;
        letter-spacing:1.5px;
    }

    .services-grid{
        grid-template-columns:
            repeat(2,1fr);

        gap:10px;
    }

    .service-card{

        min-height:125px;

        padding:14px 10px;

        border-radius:15px;

        display:block;

        text-align:center;
    }

    .service-icon{

        width:45px;
        height:45px;

        margin:0 auto 9px;

        border-radius:13px;
    }

    .service-icon i{
        font-size:18px;
    }

    .service-content{
        padding:0;
    }

    .service-content h4{
        font-size:12px;
        margin-bottom:3px;
    }

    .service-content p{
        font-size:9px;
    }

    .service-number{
        top:6px;
        right:8px;
        font-size:8px;
    }

    .service-arrow{
        display:none;
    }

    .view-services-btn{
        padding:9px 16px;
        font-size:11px;
    }
}

/* End Services */


/* about why */
/* =========================================================
   PREMIUM HEALTHCARE ABOUT SECTION
   COLOR THEME
========================================================= */

.about-healthcare{
    position:relative;

    padding:55px 0 !important;

    background:
        radial-gradient(
            circle at 8% 50%,
            rgba(157,0,255,.10),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 50%,
            rgba(157,0,255,.08),
            transparent 28%
        ),
        #f8f7fb;

    font-family:'Poppins',sans-serif;

    overflow:hidden;
}


/* Background Glow */

.about-healthcare::before{
    content:"";

    position:absolute;

    width:450px;
    height:450px;

    left:-250px;
    top:50px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.10),
            transparent 68%
        );

    filter:blur(25px);

    pointer-events:none;
}


.about-healthcare::after{
    content:"";

    position:absolute;

    width:400px;
    height:400px;

    right:-220px;
    bottom:-100px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.09),
            transparent 68%
        );

    filter:blur(25px);

    pointer-events:none;
}


.about-healthcare .container{
    position:relative;
    z-index:2;
}


/* =========================================================
   COMMON CARD
========================================================= */

.about-card,
.choose-card,
.help-card{

    position:relative;

    min-height:390px;

    border-radius:24px;

    overflow:hidden;

    transition:
        transform .4s ease,
        box-shadow .4s ease;
}


.about-card:hover,
.choose-card:hover,
.help-card:hover{

    transform:translateY(-7px);
}


/* =========================================================
   ABOUT CARD
========================================================= */

.about-card{

    padding:35px;

    color:#fff;

    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(157,0,255,.35),
            transparent 35%
        ),
        radial-gradient(
            circle at 90% 90%,
            rgba(157,0,255,.20),
            transparent 35%
        ),
        linear-gradient(
            105deg,
            #190024 0%,
            #39005F 35%,
            #520080 55%,
            #260035 100%
        );

    box-shadow:
        0 20px 45px rgba(38,0,53,.18);
}


/* Purple Top Line */

.about-card::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:4px;

    background:
        linear-gradient(
            90deg,
            #9D00FF,
            #C95CFF,
            #9D00FF
        );
}


/* Decorative Circle */

.about-card::after{

    content:"";

    position:absolute;

    width:220px;
    height:220px;

    right:-100px;
    top:-100px;

    border-radius:50%;

    border:1px solid rgba(255,255,255,.10);

    box-shadow:
        0 0 0 30px rgba(157,0,255,.025),
        0 0 0 60px rgba(157,0,255,.02);
}


/* =========================================================
   ABOUT CONTENT
========================================================= */

.about-card .content{

    position:relative;

    z-index:3;

    width:55%;
}


.about-card h2{

    margin:0 0 17px;

    font-size:26px;

    font-weight:800;

    letter-spacing:-.4px;
}


.about-card h2::after{

    content:"";

    display:block;

    width:42px;
    height:3px;

    margin-top:9px;

    border-radius:20px;

    background:#9D00FF;
}


.about-card p{

    margin-bottom:18px;

    color:rgba(255,255,255,.78);

    font-size:13px;

    line-height:1.7;
}


/* =========================================================
   ABOUT LIST
========================================================= */

.about-list{

    list-style:none;

    padding:0;

    margin:18px 0;
}


.about-list li{

    display:flex;

    align-items:center;

    margin-bottom:10px;

    color:rgba(255,255,255,.90);

    font-size:12px;
}


.about-list i{

    flex-shrink:0;

    margin-right:9px;

    color:#C95CFF;

    font-size:13px;
}


/* =========================================================
   ABOUT BUTTON
========================================================= */

.btn-about{

    display:inline-flex;

    align-items:center;

    padding:10px 21px;

    margin-top:6px;

    border-radius:50px;

    color:#fff;

    text-decoration:none;

    font-size:12px;

    font-weight:700;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #6800A8
        );

    border:1px solid rgba(255,255,255,.15);

    box-shadow:
        0 8px 20px rgba(157,0,255,.30);

    transition:.3s ease;
}


.btn-about:hover{

    color:#fff;

    transform:translateY(-3px);

    box-shadow:
        0 12px 28px rgba(157,0,255,.45);
}


/* =========================================================
   ABOUT IMAGE
========================================================= */

.about-image{

    position:absolute;

    right:-10px;
    bottom:0;

    width:48%;

    z-index:2;

    transition:.4s ease;
}


.about-image img{

    display:block;

    width:100%;

    filter:
        drop-shadow(
            0 15px 25px rgba(0,0,0,.25)
        );

    transition:.4s ease;
}


.about-card:hover .about-image{

    transform:translateY(-6px);
}


.about-card:hover .about-image img{

    transform:scale(1.02);
}


/* =========================================================
   WHY CHOOSE CARD
========================================================= */

.choose-card{

    padding:32px 27px;

    background:#fff;

    border:1px solid rgba(157,0,255,.10);

    box-shadow:
        0 18px 40px rgba(40,0,60,.08);
}


.choose-card h2{

    margin:0;

    padding-bottom:14px;

    color:#250024;

    font-size:22px;

    font-weight:800;

    position:relative;
}


.choose-card h2::after{

    content:"";

    position:absolute;

    left:0;
    bottom:0;

    width:45px;
    height:3px;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            #9D00FF,
            #C95CFF
        );
}


/* =========================================================
   CHOOSE LIST
========================================================= */

.choose-list{

    list-style:none;

    padding:0;

    margin:24px 0 0;
}


.choose-list li{

    position:relative;

    display:flex;

    align-items:flex-start;

    gap:9px;

    padding:9px 0;

    color:#555;

    font-size:12px;

    line-height:1.5;

    border-bottom:1px solid #f2edf5;
}


.choose-list li:last-child{

    border-bottom:0;
}


.choose-list i{

    flex-shrink:0;

    margin-top:2px;

    color:#9D00FF;

    font-size:13px;
}


/* =========================================================
   TRUSTED BOX
========================================================= */

.trusted-box{

    display:flex;

    align-items:center;

    margin-top:18px;

    padding:12px;

    border-radius:15px;

    background:
        linear-gradient(
            135deg,
            rgba(157,0,255,.07),
            rgba(157,0,255,.02)
        );

    border:1px solid rgba(157,0,255,.10);
}


.trusted-icon{

    width:55px;
    height:55px;

    flex-shrink:0;

    margin-right:11px;

    display:flex;

    align-items:center;
    justify-content:center;
}


.trusted-icon img{

    max-width:100%;

    max-height:55px;

    object-fit:contain;
}


.trusted-box h5{

    margin:0;

    color:#39005F;

    font-size:12px;

    font-weight:700;
}


/* =========================================================
   EMERGENCY CARD
========================================================= */

.help-card{

    padding:32px 25px;

    text-align:center;

    color:#fff;

    background:
        radial-gradient(
            circle at 15% 15%,
            rgba(157,0,255,.40),
            transparent 35%
        ),
        radial-gradient(
            circle at 85% 85%,
            rgba(157,0,255,.25),
            transparent 35%
        ),
        linear-gradient(
            105deg,
            #190024 0%,
            #39005F 35%,
            #520080 55%,
            #260035 100%
        );

    box-shadow:
        0 20px 45px rgba(38,0,53,.20);
}


.help-card::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:4px;

    background:
        linear-gradient(
            90deg,
            #9D00FF,
            #D66AFF,
            #9D00FF
        );
}


.help-card h2{

    margin:0 0 6px;

    font-size:22px;

    font-weight:800;
}


.help-card h5{

    margin:0;

    color:rgba(255,255,255,.70);

    font-size:12px;

    font-weight:400;
}


/* =========================================================
   PHONE BOX
========================================================= */

.phone-box{

    display:flex;

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

    gap:10px;

    margin:22px 0;

    padding:13px 15px;

    border-radius:50px;

    border:1px solid rgba(255,255,255,.20);

    background:
        rgba(255,255,255,.07);

    box-shadow:
        inset 0 0 20px rgba(157,0,255,.08);

    backdrop-filter:blur(10px);

    font-size:22px;

    font-weight:800;

    letter-spacing:.5px;
}


.phone-box i{

    width:35px;
    height:35px;

    display:flex;

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

    border-radius:50%;

    color:#fff;

    background:#9D00FF;

    font-size:14px;

    box-shadow:
        0 5px 15px rgba(157,0,255,.45);
}


.help-card h6{

    margin:0 0 22px;

    color:#C95CFF;

    font-size:12px;

    font-weight:700;
}


/* =========================================================
   HELP FEATURES
========================================================= */

.help-features{

    display:grid;

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

    gap:8px;
}


.help-features div{

    padding:12px 5px;

    border-radius:12px;

    background:
        rgba(255,255,255,.055);

    border:
        1px solid rgba(255,255,255,.07);

    transition:.3s ease;
}


.help-features div:hover{

    background:
        rgba(157,0,255,.18);

    transform:translateY(-3px);
}


.help-features i{

    display:block;

    margin-bottom:7px;

    color:#C95CFF;

    font-size:19px;
}


.help-features p{

    margin:0;

    color:rgba(255,255,255,.75);

    font-size:9px;

    line-height:1.3;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1199px){

    .about-card .content{
        width:60%;
    }

    .about-image{
        width:45%;
    }

    .about-card,
    .choose-card,
    .help-card{
        min-height:380px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:991px){

    .about-healthcare{
        padding:40px 0 !important;
    }

    .about-card,
    .choose-card,
    .help-card{
        min-height:auto;
    }

    .about-card{
        padding:28px;
    }

    .about-card .content{
        width:100%;
    }

    .about-image{
        position:relative;

        right:auto;
        bottom:auto;

        width:70%;

        margin:
            15px auto -28px;
    }

    .choose-card{
        padding:28px;
    }

    .help-card{
        padding:28px 22px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:576px){

    .about-healthcare{
        padding:30px 0 !important;
    }

    .about-card,
    .choose-card,
    .help-card{
        border-radius:20px;
    }

    .about-card{
        padding:23px 20px;
    }

    .about-card h2{
        font-size:22px;
    }

    .about-card p{
        font-size:12px;
        line-height:1.6;
    }

    .about-list li{
        font-size:11px;
    }

    .about-image{
        width:80%;
    }

    .choose-card{
        padding:23px 20px;
    }

    .choose-card h2{
        font-size:20px;
    }

    .choose-list li{
        font-size:11px;
    }

    .help-card{
        padding:25px 18px;
    }

    .help-card h2{
        font-size:20px;
    }

    .phone-box{
        font-size:19px;
    }

    .help-features{
        grid-template-columns:
            repeat(2,1fr);

        gap:8px;
    }

    .help-features div{
        padding:12px 5px;
    }

    .help-features i{
        font-size:17px;
    }

    .help-features p{
        font-size:9px;
    }
}

/* about why */

/* department*/

/* =========================================================
   PREMIUM DEPARTMENTS SECTION
========================================================= */

.departments-section{

    position:relative;

    padding:70px 0 80px;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 8% 50%,
            rgba(157,0,255,.12),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 50%,
            rgba(157,0,255,.10),
            transparent 28%
        ),
        #faf9fc;
}


/* Background Glow */

.departments-section::before{

    content:"";

    position:absolute;

    width:500px;
    height:500px;

    left:-280px;
    top:250px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.10),
            transparent 68%
        );

    filter:blur(20px);

    pointer-events:none;
}


.departments-section::after{

    content:"";

    position:absolute;

    width:450px;
    height:450px;

    right:-250px;
    bottom:100px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.09),
            transparent 68%
        );

    filter:blur(20px);

    pointer-events:none;
}


.departments-section .container{

    position:relative;

    z-index:2;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.department-heading{

    display:flex;

    align-items:end;

    justify-content:space-between;

    gap:30px;

    margin-bottom:42px;

    padding-bottom:25px;

    border-bottom:1px solid #ece8f1;
}


.heading-tag{

    display:inline-flex;

    align-items:center;

    gap:7px;

    margin-bottom:10px;

    color:#9D00FF;

    font-size:10px;

    font-weight:800;

    letter-spacing:1.5px;
}


.heading-tag i{

    font-size:12px;
}


.heading-content h2{

    margin:0 0 8px;

    color:#190024;

    font-size:40px;

    line-height:1.15;

    font-weight:800;

    letter-spacing:-1px;
}


.heading-content h2 span{

    color:#9D00FF;

    position:relative;
}


.heading-content h2 span::after{

    content:"";

    position:absolute;

    left:0;
    bottom:-4px;

    width:100%;
    height:3px;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            #9D00FF,
            #C95CFF
        );
}


.heading-content p{

    max-width:620px;

    margin:0;

    color:#777;

    font-size:13px;

    line-height:1.7;
}


/* View All */

.view-departments{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 22px;

    flex-shrink:0;

    color:#fff;

    text-decoration:none;

    border-radius:50px;

    font-size:12px;

    font-weight:700;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #520080
        );

    box-shadow:
        0 10px 25px rgba(157,0,255,.25);

    transition:.35s ease;
}


.view-departments i{

    transition:.35s ease;
}


.view-departments:hover{

    color:#fff;

    transform:translateY(-3px);

    box-shadow:
        0 15px 30px rgba(157,0,255,.35);
}


.view-departments:hover i{

    transform:translateX(5px);
}


/* =========================================================
   CATEGORY
========================================================= */

.department-category{

    margin-bottom:45px;
}


.category-title{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:20px;
}


.category-icon{

    width:45px;
    height:45px;

    display:flex;

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

    flex-shrink:0;

    border-radius:14px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #520080
        );

    box-shadow:
        0 8px 20px rgba(157,0,255,.25);
}


.category-icon i{

    font-size:18px;
}


.category-title small{

    display:block;

    margin-bottom:1px;

    color:#9D00FF;

    font-size:9px;

    font-weight:800;

    letter-spacing:1px;
}


.category-title h3{

    margin:0;

    color:#250024;

    font-size:20px;

    font-weight:800;
}


/* =========================================================
   DEPARTMENT CARD
========================================================= */

.department-card{

    display:block;

    position:relative;

    overflow:hidden;

    height:100%;

    text-decoration:none;

    border-radius:20px;

    background:#fff;

    border:1px solid rgba(157,0,255,.08);

    box-shadow:
        0 12px 30px rgba(40,0,60,.07);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


.department-card:hover{

    transform:translateY(-8px);

    border-color:
        rgba(157,0,255,.35);

    box-shadow:
        0 20px 45px rgba(40,0,60,.13),
        0 0 25px rgba(157,0,255,.08);
}


/* =========================================================
   IMAGE
========================================================= */

.department-image{

    position:relative;

    height:175px;

    overflow:hidden;

    background:#250024;
}


.department-image::after{

    content:"";

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            to top,
            rgba(25,0,36,.55),
            transparent 55%
        );
}


.department-image img{

    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

    transition:
        transform .6s ease;
}


.department-card:hover .department-image img{

    transform:scale(1.08);
}


/* =========================================================
   CARD ICON
========================================================= */

.card-icon{

    position:absolute;

    left:15px;
    bottom:15px;

    width:40px;
    height:40px;

    z-index:3;

    display:flex;

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

    border-radius:12px;

    color:#fff;

    background:
        rgba(157,0,255,.90);

    border:
        1px solid rgba(255,255,255,.30);

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

    backdrop-filter:blur(8px);

    transition:.35s ease;
}


.card-icon i{

    font-size:16px;
}


.department-card:hover .card-icon{

    transform:
        rotate(-5deg)
        scale(1.08);

    background:#9D00FF;
}


/* =========================================================
   CARD CONTENT
========================================================= */

.department-content{

    padding:17px 16px 16px;
}


.department-content h4{

    margin:0 0 5px;

    color:#250024;

    font-size:15px;

    font-weight:800;
}


.department-content p{

    margin:0 0 12px;

    color:#888;

    font-size:10px;
}


/* Explore */

.department-link{

    display:inline-flex;

    align-items:center;

    gap:6px;

    color:#9D00FF;

    font-size:10px;

    font-weight:800;

    transition:.3s ease;
}


.department-link i{

    transition:.3s ease;
}


.department-card:hover .department-link{

    color:#6800A8;
}


.department-card:hover .department-link i{

    transform:translateX(4px);
}


/* =========================================================
   CATEGORY SEPARATOR
========================================================= */

.department-category:not(:last-child)::after{

    content:"";

    display:block;

    width:100%;

    height:1px;

    margin-top:42px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #e8e1ed,
            transparent
        );
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:991px){

    .departments-section{

        padding:55px 0 60px;
    }


    .department-heading{

        align-items:center;

        flex-direction:column;

        text-align:center;
    }


    .heading-content p{

        margin:auto;
    }


    .department-image{

        height:150px;
    }


    .department-content h4{

        font-size:14px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:576px){

    .departments-section{

        padding:45px 0 50px;
    }


    .department-heading{

        margin-bottom:32px;

        padding-bottom:20px;
    }


    .heading-content h2{

        font-size:29px;
    }


    .heading-content p{

        font-size:11px;

        padding:0 8px;
    }


    .view-departments{

        padding:10px 18px;

        font-size:11px;
    }


    .department-category{

        margin-bottom:32px;
    }


    .category-title{

        margin-bottom:15px;
    }


    .category-icon{

        width:38px;
        height:38px;

        border-radius:11px;
    }


    .category-icon i{

        font-size:15px;
    }


    .category-title h3{

        font-size:17px;
    }


    .department-image{

        height:120px;
    }


    .card-icon{

        width:34px;
        height:34px;

        left:10px;
        bottom:10px;

        border-radius:9px;
    }


    .card-icon i{

        font-size:13px;
    }


    .department-content{

        padding:13px 11px;
    }


    .department-content h4{

        font-size:12px;

        line-height:1.3;
    }


    .department-content p{

        font-size:9px;

        margin-bottom:8px;
    }


    .department-link{

        font-size:9px;
    }


    .department-category:not(:last-child)::after{

        margin-top:30px;
    }
}

/* End department*/

/* Say about*/
/* =========================================================
   GOOGLE REVIEW SECTION
========================================================= */

.google-review-section{

    position:relative;

    padding:65px 0;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 8% 50%,
            rgba(157,0,255,.30),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 50%,
            rgba(157,0,255,.20),
            transparent 28%
        ),
        linear-gradient(
            105deg,
            #190024 0%,
            #39005F 35%,
            #520080 55%,
            #260035 100%
        );
}


/* Background glow */

.google-review-section::before{

    content:"";

    position:absolute;

    width:400px;
    height:400px;

    left:-200px;
    top:-150px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.35),
            transparent 68%
        );

    filter:blur(20px);
}


.google-review-section::after{

    content:"";

    position:absolute;

    width:400px;
    height:400px;

    right:-200px;
    bottom:-180px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.30),
            transparent 68%
        );

    filter:blur(20px);
}


.google-review-section .container{

    position:relative;

    z-index:2;
}


/* =========================================================
   HEADER
========================================================= */

.review-header{

    margin-bottom:35px;
}


.review-tag{

    display:inline-flex;

    align-items:center;

    gap:7px;

    margin-bottom:10px;

    color:#C95CFF;

    font-size:10px;

    font-weight:800;

    letter-spacing:1.5px;
}


.review-tag i{

    font-size:15px;
}


.review-header h2{

    margin:0 0 8px;

    color:#fff;

    font-size:36px;

    font-weight:800;

    letter-spacing:-.7px;
}


.review-header h2 span{

    color:#9D00FF;
}


.review-header p{

    margin:0;

    color:rgba(255,255,255,.65);

    font-size:13px;
}


/* =========================================================
   MAIN CARD
========================================================= */

.review-main-card{

    display:grid;

    grid-template-columns:
        220px 1fr 240px;

    align-items:center;

    gap:30px;

    padding:30px;

    border-radius:24px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.12),
            rgba(255,255,255,.045)
        );

    border:
        1px solid rgba(255,255,255,.14);

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

    backdrop-filter:blur(15px);

    -webkit-backdrop-filter:blur(15px);

    transition:.4s ease;
}


.review-main-card:hover{

    border-color:
        rgba(157,0,255,.45);

    box-shadow:
        0 30px 70px rgba(0,0,0,.30),
        0 0 30px rgba(157,0,255,.10);
}


/* =========================================================
   RATING
========================================================= */

.google-rating{

    display:flex;

    align-items:center;

    gap:15px;

    padding-right:25px;

    border-right:
        1px solid rgba(255,255,255,.10);
}


.google-logo{

    width:55px;
    height:55px;

    display:flex;

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

    border-radius:16px;

    color:#fff;

    font-size:25px;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #520080
        );

    box-shadow:
        0 10px 25px rgba(157,0,255,.30);
}


.rating-number strong{

    display:block;

    color:#fff;

    font-size:32px;

    line-height:1;

    font-weight:800;
}


.stars{

    margin-top:6px;

    color:#FFD43B;

    font-size:14px;

    letter-spacing:1px;
}


.rating-number small{

    display:block;

    margin-top:4px;

    color:rgba(255,255,255,.55);

    font-size:9px;
}


/* =========================================================
   REVIEW CONTENT
========================================================= */

.review-content{

    position:relative;

    padding:5px 15px;
}


.review-icon{

    margin-bottom:8px;

    color:#9D00FF;

    font-size:22px;
}


.review-content p{

    margin:0 0 15px;

    color:rgba(255,255,255,.85);

    font-size:13px;

    line-height:1.7;

    font-style:italic;
}


.review-user{

    display:flex;

    align-items:center;

    gap:10px;
}


.user-avatar{

    width:35px;
    height:35px;

    display:flex;

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

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #520080
        );

    font-size:13px;
}


.review-user h5{

    margin:0;

    color:#fff;

    font-size:11px;

    font-weight:700;
}


.review-user span{

    color:rgba(255,255,255,.50);

    font-size:9px;
}


/* =========================================================
   ACTION
========================================================= */

.review-action{

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:10px;
}


.google-review-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    width:100%;

    padding:12px 15px;

    border-radius:50px;

    color:#fff;

    text-decoration:none;

    font-size:11px;

    font-weight:700;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #6800A8
        );

    box-shadow:
        0 10px 25px rgba(157,0,255,.30);

    transition:.35s ease;
}


.google-review-btn:hover{

    color:#fff;

    transform:translateY(-3px);

    box-shadow:
        0 15px 30px rgba(157,0,255,.45);
}


.google-review-btn i:last-child{

    transition:.3s ease;
}


.google-review-btn:hover i:last-child{

    transform:translateX(4px);
}


.review-action small{

    color:rgba(255,255,255,.45);

    font-size:8px;

    text-align:center;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:991px){

    .review-main-card{

        grid-template-columns:1fr;

        text-align:center;

        gap:20px;
    }


    .google-rating{

        justify-content:center;

        padding-right:0;

        padding-bottom:20px;

        border-right:0;

        border-bottom:
            1px solid rgba(255,255,255,.10);
    }


    .review-content{

        padding:0 10px;
    }


    .review-user{

        justify-content:center;
    }


    .review-action{

        max-width:300px;

        width:100%;

        margin:auto;
    }
}


@media(max-width:576px){

    .google-review-section{

        padding:50px 0;
    }


    .review-header h2{

        font-size:28px;
    }


    .review-header p{

        font-size:11px;

        padding:0 10px;
    }


    .review-main-card{

        padding:22px 17px;

        border-radius:20px;
    }


    .google-rating{

        flex-direction:column;

        gap:10px;
    }


    .google-logo{

        width:48px;
        height:48px;

        font-size:21px;
    }


    .rating-number strong{

        font-size:28px;
    }


    .review-content p{

        font-size:11px;
    }
}
/* End Say about*/

/* scribe*/
/* =========================================================
   LIFE O2 PREMIUM THEME
========================================================= */

:root{

    --life-purple:#9D00FF;
    --life-purple-light:#C95CFF;
    --life-purple-dark:#190024;
    --life-purple-deep:#39005F;

    --life-gradient:
        radial-gradient(
            circle at 8% 50%,
            rgba(157,0,255,.30),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 50%,
            rgba(157,0,255,.20),
            transparent 28%
        ),
        linear-gradient(
            105deg,
            #190024 0%,
            #39005F 35%,
            #520080 55%,
            #260035 100%
        );
}


/* =========================================================
   NEWSLETTER
========================================================= */

.newsletter-section{

    position:relative;

    padding:22px 0;

    background:#fff;

    overflow:hidden;
}


.newsletter-wrapper{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:35px;

    padding:25px 35px;

    border-radius:20px;

    background:var(--life-gradient);

    box-shadow:
        0 20px 50px rgba(57,0,95,.20);

    overflow:hidden;
}


/* Glow */

.newsletter-wrapper::before{

    content:"";

    position:absolute;

    width:280px;
    height:280px;

    top:-180px;
    left:-100px;

    border-radius:50%;

    background:
        rgba(157,0,255,.25);

    filter:blur(20px);
}


.newsletter-wrapper::after{

    content:"";

    position:absolute;

    width:250px;
    height:250px;

    right:-100px;
    bottom:-170px;

    border-radius:50%;

    background:
        rgba(157,0,255,.25);

    filter:blur(20px);
}


/* =========================================================
   NEWSLETTER CONTENT
========================================================= */

.newsletter-content{

    position:relative;

    z-index:2;

    display:flex;

    align-items:center;

    gap:17px;

    color:#fff;
}


.newsletter-icon{

    width:58px;
    height:58px;

    flex-shrink:0;

    display:flex;

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

    border-radius:16px;

    background:
        rgba(255,255,255,.10);

    border:
        1px solid rgba(255,255,255,.22);

    box-shadow:
        inset 0 0 20px rgba(255,255,255,.05),
        0 8px 25px rgba(0,0,0,.15);
}


.newsletter-icon i{

    color:#fff;

    font-size:25px;
}


.newsletter-text span{

    display:block;

    margin-bottom:3px;

    color:#C95CFF;

    font-size:9px;

    font-weight:800;

    letter-spacing:1.8px;
}


.newsletter-content h4{

    margin:0;

    color:#fff;

    font-size:21px;

    font-weight:800;

    letter-spacing:-.3px;
}


.newsletter-content p{

    margin:4px 0 0;

    color:rgba(255,255,255,.65);

    font-size:11px;
}


/* =========================================================
   NEWSLETTER FORM
========================================================= */

.newsletter-form{

    position:relative;

    z-index:2;

    display:flex;

    align-items:center;

    width:48%;

    padding:5px;

    border-radius:14px;

    background:
        rgba(255,255,255,.10);

    border:
        1px solid rgba(255,255,255,.18);

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);
}


.input-wrap{

    display:flex;

    align-items:center;

    flex:1;

    gap:9px;

    padding-left:14px;
}


.input-wrap i{

    color:rgba(255,255,255,.55);

    font-size:13px;
}


.newsletter-form input{

    width:100%;

    min-width:0;

    border:0;

    outline:0;

    background:transparent;

    color:#fff;

    padding:12px 5px;

    font-size:12px;
}


.newsletter-form input::placeholder{

    color:rgba(255,255,255,.55);
}


.newsletter-form button{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    border:0;

    border-radius:10px;

    padding:12px 20px;

    background:#9D00FF;

    color:#fff;

    font-size:11px;

    font-weight:700;

    cursor:pointer;

    box-shadow:
        0 8px 20px rgba(157,0,255,.35);

    transition:.35s ease;
}


.newsletter-form button:hover{

    background:#B52AFF;

    transform:translateY(-2px);

    box-shadow:
        0 12px 28px rgba(157,0,255,.50);
}


.newsletter-form button i{

    font-size:10px;

    transition:.3s;
}


.newsletter-form button:hover i{

    transform:translateX(4px);
}


/* =========================================================
   FOOTER
========================================================= */
/* =========================================================
   PREMIUM LIFE O2 THEME
========================================================= */

:root{
    --life-purple:#9D00FF;
    --life-purple-light:#C95CFF;
    --life-purple-deep:#39005F;
    --life-purple-dark:#190024;
    --life-white:#ffffff;
    --life-muted:rgba(255,255,255,.68);

    --life-gradient:
        radial-gradient(
            circle at 8% 50%,
            rgba(157,0,255,.30),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 50%,
            rgba(157,0,255,.20),
            transparent 28%
        ),
        linear-gradient(
            105deg,
            #190024 0%,
            #39005F 35%,
            #520080 55%,
            #260035 100%
        );
}


/* =========================================================
   NEWSLETTER
========================================================= */

.newsletter-section{

    position:relative;

    padding:35px 0;

    background:#f7f5fa;

    overflow:hidden;
}


/* Decorative Glow */

.newsletter-section::before{

    content:"";

    position:absolute;

    width:300px;
    height:300px;

    left:-150px;
    top:-120px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.12),
            transparent 70%
        );

    pointer-events:none;
}


.newsletter-section::after{

    content:"";

    position:absolute;

    width:300px;
    height:300px;

    right:-150px;
    bottom:-150px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.10),
            transparent 70%
        );

    pointer-events:none;
}


/* Main Newsletter Box */

.newsletter-wrapper{

    position:relative;

    z-index:2;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:35px;

    padding:28px 35px;

    border-radius:20px;

    background:var(--life-gradient);

    box-shadow:
        0 20px 50px rgba(57,0,95,.25),
        0 0 35px rgba(157,0,255,.12);

    overflow:hidden;
}


/* Glass shine */

.newsletter-wrapper::before{

    content:"";

    position:absolute;

    width:250px;
    height:250px;

    top:-160px;
    right:10%;

    border-radius:50%;

    background:
        rgba(255,255,255,.07);

    filter:blur(5px);

    pointer-events:none;
}


/* =========================================================
   NEWSLETTER CONTENT
========================================================= */

.newsletter-content{

    position:relative;

    z-index:2;

    display:flex;

    align-items:center;

    gap:16px;

    color:#fff;
}


.newsletter-icon{

    width:58px;
    height:58px;

    flex-shrink:0;

    display:flex;

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

    border-radius:16px;

    border:
        1px solid rgba(255,255,255,.25);

    background:
        linear-gradient(
            135deg,
            rgba(157,0,255,.9),
            rgba(255,255,255,.10)
        );

    box-shadow:
        0 10px 25px rgba(0,0,0,.20),
        inset 0 0 20px rgba(255,255,255,.08);

    transition:.35s ease;
}


.newsletter-wrapper:hover .newsletter-icon{

    transform:
        translateY(-4px)
        rotate(-4deg);

    box-shadow:
        0 15px 30px rgba(157,0,255,.35);
}


.newsletter-icon i{

    color:#fff;

    font-size:25px;
}


.newsletter-content h4{

    margin:0;

    color:#fff;

    font-size:22px;

    font-weight:800;

    letter-spacing:-.3px;
}


.newsletter-content p{

    margin:5px 0 0;

    color:
        rgba(255,255,255,.68);

    font-size:13px;
}


/* =========================================================
   NEWSLETTER FORM
========================================================= */

.newsletter-form{

    position:relative;

    z-index:2;

    display:flex;

    align-items:center;

    width:48%;

    padding:5px;

    border-radius:14px;

    background:
        rgba(255,255,255,.10);

    border:
        1px solid rgba(255,255,255,.18);

    backdrop-filter:blur(12px);

    -webkit-backdrop-filter:blur(12px);

    box-shadow:
        inset 0 0 20px rgba(255,255,255,.03);
}


.newsletter-form input{

    flex:1;

    min-width:0;

    border:0;

    outline:0;

    background:transparent;

    color:#fff;

    padding:14px 16px;

    font-size:13px;
}


.newsletter-form input::placeholder{

    color:
        rgba(255,255,255,.55);
}


.newsletter-form button{

    border:0;

    outline:0;

    padding:13px 25px;

    border-radius:10px;

    background:
        linear-gradient(
            135deg,
            #9D00FF,
            #C95CFF
        );

    color:#fff;

    font-size:13px;

    font-weight:700;

    cursor:pointer;

    box-shadow:
        0 8px 20px rgba(157,0,255,.35);

    transition:.35s ease;
}


.newsletter-form button:hover{

    transform:
        translateY(-2px);

    background:
        linear-gradient(
            135deg,
            #C95CFF,
            #9D00FF
        );

    box-shadow:
        0 12px 28px rgba(157,0,255,.55);
}


/* =========================================================
   FOOTER
========================================================= */

.life-footer{

    position:relative;

    padding-top:45px;

    background:var(--life-gradient);

    color:#fff;

    overflow:hidden;
}


/* Background Glow */

.life-footer::before{

    content:"";

    position:absolute;

    width:500px;
    height:500px;

    left:-300px;
    bottom:-280px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.30),
            transparent 68%
        );

    filter:blur(10px);

    pointer-events:none;
}


.life-footer::after{

    content:"";

    position:absolute;

    width:450px;
    height:450px;

    right:-280px;
    top:-250px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(157,0,255,.28),
            transparent 68%
        );

    filter:blur(10px);

    pointer-events:none;
}


.footer-container{

    position:relative;

    z-index:2;

    max-width:1380px;

    margin:auto;
}


/* =========================================================
   BRAND
========================================================= */

.footer-brand{

    padding-right:35px;
}


.life-logo{

    display:inline-flex;

    align-items:center;

    color:#fff;

    text-decoration:none;
}


.life-logo img{

    max-width:170px;

    height:auto;

    display:block;

    filter:
        drop-shadow(
            0 5px 15px rgba(157,0,255,.25)
        );
}


.footer-description{

    max-width:270px;

    margin:18px 0;

    color:
        rgba(255,255,255,.68);

    font-size:12px;

    line-height:1.8;
}


/* =========================================================
   SOCIAL ICONS
========================================================= */

.social-icons{

    display:flex;

    gap:9px;
}


.social-icons a{

    width:34px;
    height:34px;

    display:flex;

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

    border-radius:11px;

    background:
        rgba(157,0,255,.85);

    border:
        1px solid rgba(255,255,255,.15);

    color:#fff;

    text-decoration:none;

    font-size:12px;

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

    transition:.35s ease;
}


.social-icons a:hover{

    color:#fff;

    background:#9D00FF;

    transform:
        translateY(-5px);

    box-shadow:
        0 12px 28px rgba(157,0,255,.45);
}


/* =========================================================
   FOOTER COLUMNS
========================================================= */

.footer-column{

    min-height:165px;

    padding-left:35px;

    border-left:
        1px solid rgba(255,255,255,.12);
}


.footer-title{

    position:relative;

    display:inline-block;

    margin:0 0 20px;

    color:#fff;

    font-size:15px;

    font-weight:800;
}


.footer-title::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:32px;
    height:3px;

    border-radius:10px;

    background:
        linear-gradient(
            90deg,
            #9D00FF,
            #C95CFF
        );

    box-shadow:
        0 0 10px rgba(157,0,255,.6);
}


/* =========================================================
   FOOTER LINKS
========================================================= */

.footer-links{

    list-style:none;

    padding:0;

    margin:0;
}


.footer-links li{

    margin-bottom:9px;
}


.footer-links a{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:
        rgba(255,255,255,.62);

    text-decoration:none;

    font-size:12px;

    transition:.3s ease;
}


.footer-links a::before{

    content:"";

    width:5px;
    height:5px;

    flex-shrink:0;

    border-radius:50%;

    background:#9D00FF;

    box-shadow:
        0 0 8px rgba(157,0,255,.7);

    transition:.3s ease;
}


.footer-links a:hover{

    color:#fff;

    transform:
        translateX(5px);
}


.footer-links a:hover::before{

    transform:
        scale(1.5);

    background:#C95CFF;
}


/* =========================================================
   CONTACT
========================================================= */

.contact-item{

    display:flex;

    align-items:flex-start;

    gap:11px;

    margin-bottom:13px;

    color:
        rgba(255,255,255,.65);

    font-size:12px;

    line-height:1.55;
}


.contact-item i{

    width:17px;

    flex-shrink:0;

    margin-top:3px;

    color:#9D00FF;

    filter:
        drop-shadow(
            0 0 5px rgba(157,0,255,.5)
        );
}


/* =========================================================
   CONTACT HOVER
========================================================= */

.contact-item:hover{

    color:#fff;
}


.contact-item:hover i{

    color:#C95CFF;

    transform:
        scale(1.1);
}


/* =========================================================
   FOOTER BOTTOM
========================================================= */

.footer-bottom{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    margin-top:30px;

    padding:17px 0;

    border-top:
        1px solid rgba(255,255,255,.12);

    color:
        rgba(255,255,255,.52);

    font-size:11px;
}


.footer-bottom strong{

    color:#C95CFF;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:991px){

    .newsletter-wrapper{

        flex-direction:column;

        align-items:stretch;

        gap:20px;

        padding:25px;
    }


    .newsletter-form{

        width:100%;
    }


    .footer-brand{

        padding-right:10px;

        margin-bottom:25px;
    }


    .footer-column{

        padding-left:25px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:767px){

    .newsletter-section{

        padding:25px 12px;
    }


    .newsletter-wrapper{

        padding:25px 18px;

        border-radius:18px;

        text-align:center;
    }


    .newsletter-content{

        flex-direction:column;

        gap:10px;
    }


    .newsletter-icon{

        width:52px;
        height:52px;
    }


    .newsletter-content h4{

        font-size:19px;
    }


    .newsletter-content p{

        font-size:11px;
    }


    .newsletter-form{

        flex-direction:column;

        width:100%;

        padding:6px;

        background:
            rgba(255,255,255,.08);

        gap:6px;
    }


    .newsletter-form input{

        width:100%;

        text-align:center;

        padding:12px;
    }


    .newsletter-form button{

        width:100%;

        padding:12px;
    }


    /* Footer */

    .life-footer{

        padding-top:35px;
    }


    .footer-brand{

        text-align:center;

        padding-right:0;
    }


    .life-logo{

        justify-content:center;

        width:100%;
    }


    .life-logo img{

        max-width:150px;
    }


    .footer-description{

        margin-left:auto;

        margin-right:auto;
    }


    .social-icons{

        justify-content:center;
    }


    .footer-column{

        min-height:auto;

        padding:22px 0 0;

        margin-top:15px;

        border-left:0;

        border-top:
            1px solid rgba(255,255,255,.10);

        text-align:center;
    }


    .footer-title{

        margin-bottom:20px;
    }


    .footer-links a{

        justify-content:center;
    }


    .contact-item{

        justify-content:center;

        text-align:left;

        max-width:280px;

        margin-left:auto;

        margin-right:auto;
    }


    .footer-bottom{

        flex-direction:column;

        gap:6px;

        margin-top:25px;

        padding:15px 10px;

        font-size:10px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:480px){

    .newsletter-content h4{

        font-size:17px;
    }


    .newsletter-content p{

        font-size:10px;
    }


    .footer-description{

        font-size:11px;
    }


    .footer-links a{

        font-size:11px;
    }


    .contact-item{

        font-size:11px;
    }
}
