﻿:root {
    --bs-font-sans-serif: 'Lato', sans-serif;
    --danger: #ff5454;
    --success: #77cc62;
    --info: #39afea;
    --warning: #f9aa0b;
    --light-gray: #808284;
    --white: #fff;
    --text-dark: #212529;
    --google: #ea4335;
    --facebook: #1877f2;
    --twitter: #000;
    --youtube: #ff0000;
    --linkedin: #0077b5;
    --pinterest: #e60023;
    --instagram: #e1306c;
    --yelp: #af0606;
    --sharecare: #1aba9c;
    --healthgrades: #0202ea;
    --covid-info-bg: #ffed76;
    --covid-info-color: #8a6d3b;
    --implants-gray-color: #808184;
    --guru-gray-color: #6d6e70;
    --screw-gray-color: #58595b;
    --gray-6c6c6c: #6c6c6c;
    --yellow-shade1: #f0b41c69;
    --yellow-shade2: #f0b41c3d;
    --pink-shade1: #f8d7da;
}

body {
    margin: 0;
    font-family: "Jost", sans-serif;
    /*    color: #474747;*/
    font-weight: 500;
}

.jost {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}
.great-vibes-regular {
    font-family: "Great Vibes", cursive;
    font-weight: 600;
    font-style: normal;
}


/* Top navigation bar */
.top-nav {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
    /*    background: transparent;
    backdrop-filter: blur(5px);*/
    transition: background-color 0.3s ease;
}

#header-nav .nav-item .nav-link {
    color: #fff;
    font-size: 17px;
}

.top-nav.scrolled {
    background: rgba(0, 0, 0, 0.9);
}



.toggler {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 45px;
    height: 35px;
    cursor: pointer;
    position: relative;
    z-index: 1000;
    padding: 5px;
    border-radius: 8px;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .toggler:hover {
        transform: scale(1.05);
    }

.bar {
    width: 100%;
    height: 3px;
    background: linear-gradient(45deg, #fff, #fff);
    border-radius: 3px;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    transform-origin: center;
}


.toggler.open {
    transform: rotate(180deg) scale(1.1);
}

    .toggler.open .bar:nth-child(1) {
        transform: translateY(11px) rotate(45deg);
        background: #fff;
    }

    .toggler.open .bar:nth-child(2) {
        opacity: 0;
        transform: scaleX(0);
    }

    .toggler.open .bar:nth-child(3) {
        transform: translateY(-11px) rotate(-45deg);
        background: #fff;
    }

.navbar-toggler:focus {
    box-shadow: none;
    border: none;
}

/*.dropdown-menu {
    background-color: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(15px);
    border: none;
    border-radius: 15px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    margin-top: 10px;
    padding: 15px 0;
    opacity: 0;
    transform: translateY(-20px);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    pointer-events: none;
}

    

*/
.dropdown-menu {
    background-color: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(15px);
    border: none;
    border-radius: 15px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    margin-top: 10px;
    padding: 15px 0;
    transform: translateY(-20px);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: absolute;
}
.dropdown-menu>li:hover .dropdown-item  {
    transform: translateX(10px);
}
.dropdown-item:focus, .dropdown-item:hover {
    background-color: transparent;
}
@media (min-width: 992px) {
    .dropdown-menu {
        opacity: 0;
        display: block;
    }

    .dropdown:hover .dropdown-menu {
        opacity: 1;
        transform: translateY(0);
    }
}

.dropdown-item {
    padding: 12px 25px;
    transition: all 0.3s ease;
    color: #333;
    font-weight: 500;
}

/* Mobile navbar background */
@media (max-width: 991.98px) {
    #header-nav .nav-item .nav-link {
        color: #000;
        text-align: center;
    }

    #navbar > li > ul > li > a {
        text-align: center;
    }

    .navbar-collapse {
        background: #f5f5f5;
        backdrop-filter: blur(20px);
        border-radius: 15px;
        padding: 20px;
        margin-top: 15px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    }
    .dropdown-menu.show {
        opacity: 1;
        transform: translateY(0);
        pointer-events: all;
    }

}

/*heroCarousel*/

.hero-carousel {
    height: 80vh;
    position: relative;
}

#heroCarousel .carousel-item {
    height: 80vh;
    position: relative;
    transition: none;
    background: none; 
    overflow: hidden; 
}

    /* Background image layer */
    #heroCarousel .carousel-item .bg-layer {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        z-index: 0;
        transform: scale(1);
        transition: transform 10s ease;
    }

    #heroCarousel .carousel-item.active .bg-layer {
        transform: scale(1.2);
    }

    /* Zoom effect for all active slides */
    #heroCarousel .carousel-item .bg-layer {
        transform: scale(1);
        transition: transform 8s ease;
    }

    #heroCarousel .carousel-item.active .bg-layer {
        transform: scale(1.1);
    }

    /* First slide special animation */
    #heroCarousel .carousel-item.active:first-child .bg-layer {
        animation: zoomIn 8s ease forwards;
    }


@keyframes zoomIn {
    from {
        transform: scale(1);
    }

    to {
        transform: scale(1.1);
    }
}
/* Initial state (hidden + pushed down) */
#heroCarousel .carousel-item .hero-text h2,
#heroCarousel .carousel-item .hero-text p,
#heroCarousel .carousel-item .hero-text a {
    opacity: 0;
    transform: translateY(60px);
}

#heroCarousel .carousel-item.active .hero-text h2 {
    animation: fadeUp 2s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0s;
}
#heroCarousel .carousel-item.active .hero-text p {
    animation: fadeUp 2s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 0.5s;
}
#heroCarousel .carousel-item.active .hero-text a {
    animation: fadeUp 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    animation-delay: 1.2s;
}
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(60px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


    #heroCarousel .carousel-item img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 0;
    }

#heroCarousel .carousel-inner {
    overflow: hidden;
}

#heroCarousel .carousel-item {
    transition: transform 0.8s ease-in-out;
}

    #heroCarousel .carousel-item::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: linear-gradient(#d3d3d3, #000000e3 80%, #000c);
        z-index: 1;
        opacity: 0.8;
        mix-blend-mode: multiply;
    }

    #heroCarousel .carousel-item * {
        position: relative;
        z-index: 2;
    }

#heroCarousel .hero-content {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#heroCarousel .hero-text h2 {
    font-family: var(--bs-font-montserrat);
    font-size: clamp(24px, 5vw, 70px);
    color: white;
    font-weight: 400;
    margin-bottom: 20px;
}

#heroCarousel .hero-text p {
    color: #fff;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 30px;
}

.header-underline {
    position: relative;
    display: inline-block;
}

/*#heroCarousel .carousel-item .hero-text h2 {
    opacity: 0;
    transform: translateY(60px);
        transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}
#heroCarousel .carousel-item .hero-text p {
    opacity: 0;
    transform: translateY(60px);
    transition: all 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s;
}

#heroCarousel .carousel-item .hero-text a {
    opacity: 0;
    transform: translateY(40px);
    transition: all 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) 1.2s;
}

#heroCarousel .carousel-item.active .hero-text h2,
#heroCarousel .carousel-item.active .hero-text p,
#heroCarousel .carousel-item.active .hero-text a {
    opacity: 1;
    transform: translateY(0) ;
}*/


/* Prevent jerky background transitions */
#heroCarousel .carousel-item.carousel-item-next,
#heroCarousel .carousel-item.carousel-item-prev {
    transform: none;
}

    #heroCarousel .carousel-item.carousel-item-next.carousel-item-start,
    #heroCarousel .carousel-item.carousel-item-prev.carousel-item-end {
        transform: none;
    }

/* Carousel Indicators - Complete CSS */
#heroCarousel .carousel-indicators {
    bottom: 100px;
    margin-bottom: 0;
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

    #heroCarousel .carousel-indicators [data-bs-target] {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        border: 3px solid rgba(255, 255, 255, 0.8);
        background-color: transparent;
        opacity: 0.7;
        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        backdrop-filter: blur(5px);
        position: relative;
        overflow: hidden;
        cursor: pointer;
        margin: 0;
        text-indent: 0;
    }

        #heroCarousel .carousel-indicators [data-bs-target]::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0;
            height: 0;
            background: radial-gradient(circle, var(--gold), #ffed4e);
            border-radius: 50%;
            transform: translate(-50%, -50%);
            transition: all 0.4s ease;
        }

        #heroCarousel .carousel-indicators [data-bs-target].active,
        #heroCarousel .carousel-indicators [data-bs-target]:hover {
            background-color: transparent;
            border-color: #EFB31C;
            opacity: 1;
            transform: scale(1.3);
            box-shadow: 0 0 20px rgba(255, 215, 0, 0.6);
        }

            #heroCarousel .carousel-indicators [data-bs-target].active::before,
            #heroCarousel .carousel-indicators [data-bs-target]:hover::before {
                width: 100%;
                height: 100%;
            }

        /* Pulse animation for active indicator */
        #heroCarousel .carousel-indicators [data-bs-target].active {
            animation: pulse-gold 2s infinite;
        }

@keyframes pulse-gold {
    0% {
        box-shadow: 0 0 20px rgba(255, 215, 0, 0.6);
        transform: scale(1.3);
    }

    50% {
        box-shadow: 0 0 30px rgba(255, 215, 0, 0.9);
        transform: scale(1.4);
    }

    100% {
        box-shadow: 0 0 20px rgba(255, 215, 0, 0.6);
        transform: scale(1.3);
    }
}


/* Responsive adjustments */
@media (max-width: 768px) {
    .hero-text h2 {
        font-size: 45px;
    }

    .hero-text p {
        font-size: 16px;
    }

    #heroCarousel .carousel-item {
        background-attachment: scroll;
    }
}


.slogan {
    color: #fff;
    /*    font-family: 'Dancing Script', cursive;*/
    font-size: 52px;
    font-weight: 500;
    line-height: 1.2;
    padding: 7px 0 22px;
    text-align: center;
}

@media (min-width: 0) and (max-width: 767px) {
    .slogan {
        font-size: 33px;
        padding: 2px 0px;
    }
}



/*   custom */

a {
    text-decoration: none;
}

.btn {
    text-align: center;
    letter-spacing: .72px;
    text-transform: uppercase;
    border-radius: 100px;
    justify-content: center;
    padding: 1rem 2.3rem;
    font-weight: 600;
    line-height: 1;
    transition: color .2s, background-color .2s;
    /*    display: flex;*/
}

.text-red {
    color: #f06669;
}

.btn.btn1 {
    background-color: #F06669;
    opacity: 1;
    color: white;
    letter-spacing: .64px;
    align-self: center;
    padding: 14px 1.5rem 13px;
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
}

.btn.btn2 {
    background-color: #F0B41C;
    opacity: 1;
    color: white;
    letter-spacing: .64px;
    /*    align-self: center;*/
    padding: 14px 1.5rem 13px;
    font-size: 16px;
    font-weight: 500;
}

.header-underline {
    background-image: linear-gradient(to right, #f0b41c 75%, #f0b41c 75%);
    background-position: 0 80%;
    background-repeat: repeat-x;
    background-size: 8px 12px;
}





.bg-gradient.overlay {
    z-index: 0;
    mix-blend-mode: multiply;
    position: absolute;
    inset: 0%;
    border-radius:40px;
}

.overlay {
    z-index: 2;
    opacity: 1;
    mix-blend-mode: color;
    background-color: #556079;
    position: absolute;
    inset: 0%;
}

.bg-gradient {
    background-image: linear-gradient(137deg, #f06669, #f06669) !important;
}

.bg-pattern {
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0%;
    border-radius: 40px;
}

img {
    vertical-align: middle;
    max-width: 100%;
    display: inline-block;
}

.bottom-card {
    padding: 3rem 5rem;
    box-shadow: 0 5px 20px #00000069;
    margin-top: -80px;
    position: relative;
    z-index: 10;
    border-radius: 40px;
    /*    position: absolute;
    left: 0%;
    right: 0%;
    top:-80px;
    z-index:10;*/
}


/*service-menu*/
#service-menu .nav-item {
    font-size: 22px;
    padding: 1rem;
    color: #000 !important;
}

    #service-menu .nav-item .nav-link {
        color: #000;
    }


/*Ad Banner*/
#ad-banner .ad-img, #ad-banner1 .ad-img, #ea, #eaproceed {
    position: relative
}

.expert-advice-proceed {
    background: url(/img/proceed/proceed-banner-ig.webp) 50% 50% / cover no-repeat #a0a1a3;
    height: 100%;
}

.expert-advice {
    background: url(/img/expert-advice-widget-home-page.jpg) 50% 50%/cover no-repeat #a0a1a3;
    height: 100%
}



.expert-advice-proceed {
    background: url(/img/proceed/proceed-banner-new.webp) 50% 50%/cover no-repeat #a0a1a3;
    background-image: linear-gradient(90deg, #F2F2F2 29%, rgba(255, 255, 255, 0) 59%), url(/img/proceed/proceed-banner-new.webp);
    height: 100%;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}


    .expert-advice-proceed .expert-advice-wrapper p.title {
        font-size: 64px;
        font-weight: 900;
        color: #1b6281;
        margin-top: 100px;
        margin-bottom: 15px;
        text-align: left;
        font-family: Sofia,cursive
    }

    .expert-advice-proceed .expert-advice-wrapper p.dentalPlane {
        font-size: 48px;
        font-weight: 600;
        color: #717273;
        margin-top: 0;
        margin-bottom: 25px;
        text-align: left;
        font-family: Raleway
    }


/*Proceed*/
#proceed-banner .title {
    font-size: 64px;
    font-weight: 900;
    color: #1b6281;
    margin-top: 100px;
    margin-bottom: 0px;
    text-align: left;
    font-family: Sofia,cursive
}

#proceed-banner .sub-title {
    font-size: 48px;
    font-weight: 600;
    color: rgb(113, 114, 115);
    margin-top: 0px;
    margin-bottom: 25px;
    text-align: left;
    font-family: Raleway;
}
/* Main section with text and animated photos */
.dentist-section {
    position: relative;
    background: #ffffff;
    padding: 80px 0;
    overflow: hidden;
}


.dentist-section {
    padding: 80px 0;
    /*    background: #f8f9fa;*/
    position: relative;
    overflow: hidden;
}



/* Photos container */
.photos-area {
    position: relative;
}

/* Base styles for all photos */
/*.photo {
    position: absolute;
    border-radius: 15px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}*/

/*.photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
*/
.photo-1 {
    width: 400px;
    height: 550px;
    transform: translateY(0px);
    transition: transform 0.1s ease-out;
}

.photo-2 {
    width: 350px;
    height: 350px;
    opacity: 0;
    transition: opacity 0.8s ease-in-out, transform 0.1s ease-out;
}

    .photo-2.visible {
        opacity: 1;
    }

.photo-3 {
    width: 350px;
    height: 350px;
    transform: translateX(80px);
    opacity: 0;
    transition: opacity 0.9s ease-in-out, transform 0.1s ease-out;
}

    .photo-3.visible {
        opacity: 1;
    }

/* Decorative elements */
.floating-element {
    position: absolute;
    width: 60px;
    height: 60px;
    background: var(--yellow-shade1);
    border-radius: 50%;
    animation: float 3s ease-in-out infinite;
}

    .floating-element:nth-child(1) {
        top: 100px;
        right: 200px;
        animation-delay: 0s;
    }

    .floating-element:nth-child(2) {
        bottom: 150px;
        left: 100px;
        animation-delay: 1s;
    }

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-20px);
    }
}


/* Bootstrap responsive adjustments */
@media (max-width: 991.98px) {



    .photo-1 {
        width: 200px;
        height: 280px;
        top: 15px;
        left: 40px;
    }

    .photo-2 {
        width: 150px;
        height: 150px;
        top: 25px;
        left: 260px;
    }

    .photo-3 {
        width: 150px;
        height: 150px;
        top: 200px;
        left: 260px;
    }
}

@media (max-width: 767.98px) {
    .dentist-section {
        padding: 60px 0;
    }

    .content-wrapper {
        gap: 40px;
    }

    .text-content h2 {
        font-size: 2.5rem;
    }

    .text-content p {
        font-size: 1.1rem;
    }

    .photos-area {
        height: 340px;
    }

    .photo-1 {
        width: 175px;
        height: 245px;
        top: 15px;
        left: 30px;
    }

    .photo-2 {
        width: 130px;
        height: 130px;
        top: 25px;
        left: 220px;
    }

    .photo-3 {
        width: 130px;
        height: 130px;
        top: 180px;
        left: 220px;
    }
}

@media (max-width: 575.98px) {
    .dentist-section {
        padding: 40px 0;
    }

    .text-content h2 {
        font-size: 2rem;
    }

    .text-content p {
        font-size: 1rem;
    }

    .photos-area {
        height: 280px;
    }

    .photo-1 {
        width: 140px;
        height: 196px;
        top: 15px;
        left: 20px;
    }

    .photo-2 {
        width: 100px;
        height: 100px;
        top: 25px;
        left: 175px;
    }

    .photo-3 {
        width: 100px;
        height: 100px;
        top: 140px;
        left: 175px;
    }
}

/*about-us*/
/*#about-us {
    background: #f8f8f89e;
    position: relative;
    z-index: 2;
}

    #about-us::before {
        content: "";
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 40%;
        height: 70%;
        opacity: 0.6;
        z-index: -1;
        background: var(--yellow-shade1);
    }

.our-procedures a {
    font-size: 1.25rem;
    font-weight: 400;
    color: #F06669;
    line-height: 2.5rem;
}*/

/*services*/
#services{
    position:relative;
}
/*    #services::before {
        content: "";
        position: absolute;
        top: 0px;
        left:-20px;
        width: 50%;
        pointer-events: none;
        opacity: 0.3;
        z-index: -1;
        background: url(../img/fav-color.webp) center center / cover no-repeat;
        height: 100%;
    }*/

#services .owl-nav {
    display: flex;
    justify-content: center;
    padding-top: 20px;
}

#services .owl-prev {
    position: absolute;
    top: 40%;
    left: -13px;
    background-color: #ff6a00;
    color: white;
    padding: 10px 14px;
    border-radius: 50%;
    z-index: 100;
}

#services .owl-next {
    position: absolute;
    top: 40%;
    right: -25px;
    background-color: #ff6a00;
    color: white;
    padding: 10px 14px;
    border-radius: 50%;
    z-index: 100;
}

#services .owl-nav .owl-prev, #services .owl-nav .owl-next {
    color: #fff;
    background-color: #f26669;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease, transform 0.3s ease;
    opacity: 0.6;
    margin-right: 13px;
    font-size: 1.5rem;
}

.image-card {
    flex: 1;
    position: relative;
    height: auto;
    overflow: hidden;
    /*    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);*/
    transition: transform 0.3s ease;
}

.image-card img{
    transition: transform 1s cubic-bezier(0.4, 0, 0.2, 1);

}

.image-card:hover img {
    transform: scale(1.2);
}

    .image-card img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

#service-images .service-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 70%;
    /*    background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 50%, rgba(0, 0, 0, 0) 100%) !important;*/
    background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(76, 76, 76, 0.25) 60%, rgb(0 0 0 / 91%) 100%)
}

#service-images .text-content {
    position: absolute;
    bottom: 0rem;
    color: white;
    z-index: 2;
    width: 100%;
    text-align: center;
}

#service-images .title {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

#service-images .subtitle {
    font-size: 1rem;
    font-weight: 300;
    color: #fff;
}


/*ads*/
/*#ad-banner {
    height: 475px;
    margin-bottom: -6px
}*/

#ad-banner1::after,
#ad-banner::after,
#offers-carousal-div::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -98px;
    height: 50px;
    background-image: url(https://www.ig.americandentalsoftware.com/img/slider-shadow-down.webp);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
}

#offers-carousal-div::before {
    background-image: url(https://www.ig.americandentalsoftware.com/img/slider-shadow-up.webp);
    background-position-x: 50%;
    background-position-y: 50%;
    background-repeat: no-repeat;
    content: "";
    display: block;
    position: absolute;
    top: -66px;
    left: 0px;
    right: 0px;
    height: 66px;
    width: 100%;
    opacity: 0.5;
}

#ad-banner .ad-img, #ad-banner1 .ad-img {
    margin: 33px 0
}

    #ad-banner .ad-img .btn.btn2, #ad-banner1 .ad-img .btn.btn2 {
        margin-left: 222px;
        /*            padding: 6px 30px*/
    }

#offers-carousal-div {
    height: 477px;
    background: center center/cover #fff;
    background-position-x: center;
    background-position-y: center;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    position: relative;
    margin-bottom: 0
}

#ad-banner.fixed-implant-dentures-ad, #ad-banner1.fixed-implant-dentures-ad {
    background-image: url(/img/main-slider/ad-banner2.jpg);
    background-position: center center;
    background-position-x: center;
    background-position-y: center;
    background-repeat: no-repeat;
    background-size: cover
}

#ad-banner.lower-implant-dentures-ad, #ad-banner1.lower-implant-dentures-ad {
    background-image: url(/img/main-slider/ad-banner1.jpg);
    background-position-x: center;
    background-position-y: center;
    background-size: cover
}

#ad-banner.lower-implant-dentures-ad {
    background-position: center center
}

#ad-banner1.lower-implant-dentures-ad {
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden
}

.ad-img .ad-text {
    position: absolute;
    bottom: 50px;
    left: 165px;
    font-size: 24px;
}

#ad-banner .ad-img img, #ad-banner1 .ad-img img {
    width: 582px;
    height: 362px;
}

@media (min-width:0) and (max-width:767.98px) {

    #ad-banner .ad-img, #ad-banner1 .ad-img {
        margin: 85px 0;
        text-align: center
    }

        #ad-banner .ad-img img, #ad-banner1 .ad-img img {
            width: 260px;
            margin: 0 auto 20px
        }

        #ad-banner .ad-img .btn-default, #ad-banner1 .ad-img .btn-default {
            font-size: 16px;
            margin-left: auto;
            margin-right: auto;
            padding: 6px 15px
        }
}



/*Footer*/
/*#footer_section {
    z-index: 2;
}*/

#footer_section .copyright,
#footer_section .footer-menu,
#footer_section .accreditations,
#footer_section .footer-content,
#footer_section .maps-section {
    content-visibility: auto;
    contain: layout;
}

#footer_section .footer-content {
    padding: 70px 0;
}

.icon-square {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    font-size: 1.5rem;
    border-radius: 50px;
}

#footer_section .footer-content .address-details p a {
    color: #000;
}

/*    #footer_section .footer-content .address-details p a:hover,
    #footer_section .footer-content .address-details p a:focus {
        color: var(--success);
    }*/

#footer_section .footer-content .c2a-buttons .btn:hover,
#footer_section .footer-content .c2a-buttons .btn:focus {
    background-color: var(--light-gray) !important;
    border-color: var(--light-gray) !important;
}

.access-ramp-icon {
    margin: 10px 0 0px;
    display: inline-block;
    width: 100%;
    padding: 0px;
    text-align: center;
}

    .access-ramp-icon i {
        color: #0047ba;
        float: none;
        font-size: 42px;
        line-height: 50px;
        margin-right: 7px;
        margin-left: 7px;
    }

    .access-ramp-icon span {
        color: #0047ba;
        font-size: 16px;
        text-align: left;
        margin: 0;
        line-height: 1.3;
        display: inline-block;
        font-weight: 300;
    }

        .access-ramp-icon span b {
            font-weight: 600;
        }

#footer_section .footer-menu {
    box-shadow: 0 20px 25px -30px rgb(0 0 0 / 60%);
    background: #5f5f5f;
}

    #footer_section .footer-menu .nav-pills li a {
        color: #fff;
        font-size: 16px;
    }

        #footer_section .footer-menu .nav-pills li a:hover,
        #footer_section .footer-menu .nav-pills li a:focus {
            color: var(--danger);
        }


    #footer_section .footer-menu .nav-pills .nav-link.active,
    #footer_section .footer-menu .nav-pills .show > .nav-link {
        /*        color: var(--danger);*/
        background-color: transparent;
    }



#footer_section .copyright {
    font-size: 14px;
    color: #fff;
    background: #5f5f5f;
    letter-spacing: 1px;
}

    #footer_section .copyright a {
        color: #fff;
    }

/*        #footer_section .copyright a:hover,
        #footer_section .copyright a:focus {
            color: rgba(0, 0, 0, 0.8);
        }*/


/*social*/
.social-nav li a i {
    width: 25px;
    height: 25px;
}

.social-nav li a.twitter {
    color: var(--twitter);
}

.social-nav li a.facebook {
    color: var(--facebook);
}

.social-nav li a.google-plus {
    color: var(--google);
}

.social-nav li a.linkedin {
    color: var(--linkedin);
}

.social-nav li a.pinterest {
    color: var(--pinterest);
}

.social-nav li a.yelp {
    color: var(--yelp);
}

.social-nav li a.youtube {
    color: var(--youtube);
}

.social-nav li a.instagram {
    color: var(--instagram);
}

.social-nav li a {
    background: #f8f9fa;
}

    .social-nav li a:hover {
        color: var(--white);
        background: var(--warning);
    }

    .social-nav li a.twitter:hover {
        background: var(--twitter);
    }

    .social-nav li a.facebook:hover {
        background: var(--facebook);
    }

    .social-nav li a.google-plus:hover {
        background: var(--google);
    }

    .social-nav li a.linkedin:hover {
        background: var(--linkedin);
    }

    .social-nav li a.pinterest:hover {
        background: var(--pinterest);
    }

    .social-nav li a.yelp:hover {
        background: var(--yelp);
    }

    .social-nav li a.youtube:hover {
        background: var(--youtube);
    }

    .social-nav li a.instagram:hover {
        background: var(--instagram);
    }


/*Footer New*/
#contact-section {
    background-color: var(--yellow-shade2);
}

.section-title {
    /*    font-size: 2.2rem;*/
    font-weight: 600;
    color: #333;
    margin-bottom: 1.5rem;
    text-align: center;
    line-height: 1.3;
}

.section-subtitle {
    font-size: 1rem;
    color: #666;
    text-align: center;
    /*    margin-bottom: 3rem;*/
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6;
}

.contact-info-row {
    margin-top: 2rem;
}

.contact-item {
    text-align: center;
    margin-bottom: 2rem;
}

.contact-icon {
    width: 45px;
    height: 45px;
    border: 2px solid #666;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    /*    margin: 0 auto 15px auto;*/
}

    .contact-icon i {
        font-size: 20px;
        color: #666;
    }

.contact-item h6 {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.5rem;
}

.contact-item p {
    font-size: 0.9rem;
    /*    color: #666;*/
    margin: 0;
    line-height: 1.5;
}

.contact-item a {
    color: #666;
    text-decoration: none;
}

    .contact-item a:hover {
        color: #333;
        text-decoration: underline;
    }

#reviews-slider {
    /*    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);*/
    background: #efefef;
    padding: 250px 0 100px;
    position: relative;
    overflow: hidden;
    margin-top: -200px;
}

    #reviews-slider::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000"><polygon fill="%23ffffff08" points="0,0 1000,300 1000,1000 0,700"/></svg>');
        pointer-events: none;
    }

.section-title {
    /*    font-family: 'Playfair Display', serif;*/
    font-size: 3.5rem;
    font-weight: 700;
    color: var(--primary-color);
    text-align: center;
    margin-bottom: 1rem;
    position: relative;
    z-index: 2;
}

.section-subtitle {
    font-size: 1.1rem;
    color: var(--text-secondary);
    text-align: center;
    margin-bottom: 4rem;
    font-weight: 300;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

#reviews-rolls .item{
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    /*    border-radius: 20px;*/
    padding: 40px 30px;
    margin: 15px;
    /*    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);*/
    border: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    height: auto;
    min-height: 350px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    #reviews-rolls .item::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
        transition: left 0.6s;
    }

    #reviews-rolls .item:hover {
        transform: translateY(-10px);
        /*        box-shadow: 0 30px 60px rgba(0, 0, 0, 0.15);*/
    }

        #reviews-rolls .item:hover::before {
            left: 100%;
        }

.quote-icon {
    /*    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--accent-color), #F4D03F);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 25px;
    box-shadow: 0 8px 25px rgba(212, 175, 55, 0.3);
    position: relative;
    z-index: 2;*/
}

    .quote-icon i {
        /*        color: white;*/
        font-size: 1.5rem;
    }

.testimonial-text {
    font-size: 1.1rem;
    line-height: 1.8;
    color: var(--text-primary);
    font-style: italic;
    margin-bottom: 25px;
    position: relative;
    z-index: 2;
    flex-grow: 1;
}

.testimonial-author {
    text-align: center;
    position: relative;
    z-index: 2;
    margin-top: auto;
}

.star {
    color: #ffc107;
    font-size: 22px;
}

.author-name {
    font-weight: 600;
    font-size: 1.1rem;
    /*    color: var(--primary-color);*/
    /*    margin-bottom: 5px;*/
}

.author-title {
    color: var(--text-secondary);
    font-size: 0.9rem;
    font-weight: 400;
}

/* Navigation Styles */
#reviews-slider .owl-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    z-index: 10;
    display:block;
}

    #reviews-slider .owl-nav .owl-prev,
    #reviews-slider .owl-nav .owl-next {
        position: absolute;
        background: rgba(255, 255, 255, 0.9);
        backdrop-filter: blur(10px);
        color: var(--primary-color);
        width: 55px;
        height: 55px;
        border-radius: 50%;
        border: 2px solid rgba(255, 255, 255, 0.3);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.2rem;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        cursor: pointer;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    }

    #reviews-slider .owl-nav .owl-prev {
        left: -80px;
    }

    #reviews-slider .owl-nav .owl-next {
        right: -80px;
    }

        #reviews-slider .owl-nav .owl-prev:hover,
        #reviews-slider .owl-nav .owl-next:hover {
            color: #000000;
            transform: scale(1.1);
            box-shadow: 0 15px 40px rgb(39 38 37 / 27%);
        }

/* Dots */
.owl-dots {
    text-align: center;
    margin-top: 50px !important;
}

.owl-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    margin: 0 8px;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .owl-dot.active {
        background: var(--accent-color);
        transform: scale(1.3);
    }

/* Responsive Design */
@media (max-width: 1200px) {
    #reviews-slider .owl-nav .owl-prev {
        left: -60px;
    }

    #reviews-slider .owl-nav .owl-next {
        right: -60px;
    }
}

@media (max-width: 992px) {
    .section-title {
        font-size: 2.8rem;
    }

    #reviews-slider .owl-nav .owl-prev,
    #reviews-slider .owl-nav .owl-next {
        display: none;
    }
}

@media (max-width: 768px) {
    #reviews-slider {
        padding: 60px 0;
    }

    .section-title {
        font-size: 2.2rem;
        margin-bottom: 0.5rem;
    }

    .section-subtitle {
        font-size: 1rem;
        margin-bottom: 3rem;
    }

    #reviews-rolls .item {
        padding: 30px 25px;
        margin: 10px;
        min-height: 300px;
    }

    .testimonial-text {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .section-title {
        font-size: 1.8rem;
    }

    #reviews-rolls .item {
        padding: 25px 20px;
        min-height: 280px;
    }

    .testimonial-text {
        font-size: 0.95rem;
        line-height: 1.6;
    }
}

/* Loading animation */
@keyframes shimmer {
    0% {
        opacity: 0.6;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0.6;
    }
}

.loading .item {
    animation: shimmer 1.5s infinite;
}

/* Smooth entrance animation */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.8s ease forwards;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/*Offers*/

#OffersCarousel {
    width: 80%;
    margin: auto;
}
#OffersCarousel .carousel-item {
    height: 100%;
}

.offer-banner {
/*    background: linear-gradient(135deg, #2c5aa0 0%, #4682b4 100%);*/
    background: linear-gradient(50deg, #cf4a4d 0%, #d85c5f 100%);
    position: relative;
    overflow: hidden;
    height: 100%;
}

    .offer-banner.offer-2 {
        background: linear-gradient(135deg, #f0b41c 0%, #edac14 100%);
    }

    .offer-banner::before {
        content: '';
        position: absolute;
        top: 50%;
        left: -100px;
        width: 400px;
        height: 400px;
        background: rgba(255, 255, 255, 0.1);
        border-radius: 50%;
        transform: translateY(-50%);
    }

.offer-content {
    position: relative;
    z-index: 2;
    height: 100%;
}

.offer-text {
    color: white;
}

    .offer-text h2 {
/*        font-size: 2.5rem;*/
        font-weight: 700;
        margin-bottom: 0.5rem;
    }

    .offer-text p {
        font-size: 1.1rem;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 1.5rem;
        opacity: 0.9;
    }

.btn-offer {
    background-color: #ffb700;
    border: none;
    color: white;
    padding: 12px 30px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 25px;
    transition: all 0.3s ease;
}

.offer-2 .btn-offer {
    background-color: #ff4549;
}

.btn-offer:hover {
    background-color: #e5a708;
    color: white;
    transform: translateY(-2px);
}

.offer-2 .btn-offer:hover {
    background-color: #e7282c;
}

.model-image {
    position: relative;
    z-index: 2;
}

/*    .model-image img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }*/

/* Custom carousel controls */
.carousel-control-prev,
.carousel-control-next {
    width: 5%;
    opacity: 0.8;
}

    .carousel-control-prev:hover,
    .carousel-control-next:hover {
        opacity: 1;
    }

.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: rgba(0,0,0,0.3);
    border-radius: 50%;
    padding: 20px;
}

/* Custom indicators */
.carousel-indicators {
    bottom: 30px;
}

    .carousel-indicators button {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        margin: 0 8px;
        background-color: rgba(255,255,255,0.5);
    }

        .carousel-indicators button.active {
            background-color: white;
        }


/* Mobile responsive adjustments */
@media (max-width: 767.98px) {
.offer-banner {
        padding: 2rem 0;
    }

    .offer-text {
        text-align: center;
        margin-top: 2rem;
    }

/*        .offer-text h2 {
            font-size: 2rem;
        }*/

    .btn-offer {
        display: block;
        margin: 0 auto;
        width: fit-content;
    }

    .model-image {
        text-align: center;
        order: -1;
    }

        .model-image img {
/*            border-radius: 8px;*/
            max-width: 300px;
        }

    .carousel-control-prev,
    .carousel-control-next {
        width: 10%;
    }
}

#OffersCarousel .carousel-indicators [data-bs-target] {
    height:10px;
    width:10px;
}
@media (max-width: 991px) {
    .order-0 {
        order: -1 !important;
    }

    .offer-text {
        margin-top: 2rem;
        margin-left: 3rem;
        margin-right: 3rem;
    }
}


.google-reviews-badge {
    background: rgb(254 254 254);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 10px 30px rgb(0 0 0 / 15%);
}
.google-logo {
    width: 32px;
    height: 32px;
    background: white;
    color: #4285f4;
    font-weight: 700;
    font-size: 18px;
}

.badge-title {
    font-size: 1.1rem;
    font-weight: 600;
}

.rating-number {
    font-size: 1.3rem;
    font-weight: 700;
    color: #ffd700;
}

.stars {
    color: #ffd700;
    font-size: 1.2rem;
    letter-spacing: 2px;
}

.review-count {
    font-size: 0.95rem;
    opacity: 0.9;
}

html {
    scroll-behavior: smooth !important;
}



