/*------------------------------------------------------------------
[Master Stylesheet]

Project: Yogastic
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[Table of contents]

1. Body
2. Header
3. Banner Section
4. Our Services Section
5. About Us Section
6. Our Specialties Section
7. Get In Touch Section
8. What We Offer Section
9. Testimonial Section
10. Blog Posts Section
11. Subscribe Now Section
12. Footer Section
*/

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Karla:wght@400;500;600&family=Playfair+Display:wght@400;700&display=swap');
body {
    font-family: 'Karla', sans-serif;
}

:root {
    --e-global-color-primary: #242424;
    --e-global-color-secondary: #764979;
    --e-global-color-text: #6b6b6b;
    --e-global-color-accent: #413625;
    --e-global-color-white: #ffffff;
    --e-global-color-light-o:#fdf9e0;
    --e-global-color-soft-orange: #e1ccad;
    --e-global-color-desaturated-magenta: #543458;
    --e-global-color-olive: #d4bd39;
    --e-global-color-olive-bright:#dbba13;
    --e-global-color-olive-text: #806f0e;
    --e-global-color-darkgreen: #1c5123;
    --e-global-color-pale-blue: #f4f7ff;
}
:root {
    --f-global-color-: #351997;
    --f-global-gra:#003813;
background: linear-gradient(90deg, rgba(0, 56, 19, 1) 0%, rgba(221, 191, 19, 1) 100%);
  
}
html {
    scroll-behavior: smooth;
}

h1 {
    font-family: 'Playfair Display', serif;
    font-size: 64px;
    line-height: 82px;
    font-weight: 700;
    color: var(--e-global-color-pale-blue);
}

h2 {
    font-family: 'Playfair Display', serif;
    font-size: 48px;
    line-height: 55px;
    font-weight: 700;
}

h3 {
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    line-height: 55px;
    font-weight: 700;
}

h4 {
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    line-height: 30px;
    font-weight: 700;
}

h5 {
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
}

h6 {
    font-family: 'Playfair Display', serif;
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
}

p {
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;
}

/* Home Page Style */

/* Home Page Header Section Style */

.banner-section-outer {
    background-image: url('../images/banner_section_background.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.main_header {
    padding: 42px 128px 0;
}

.navbar-collapse ul {
    text-align: center;
    align-items: center;
    display: inherit;
}

.navbar-expand-lg {
    position: relative;
    z-index: 1;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 0;
    padding-left: 0;
}

.nav-link {
    padding: 0;
}

.navbar-brand {
    margin-left: 0;
    margin-right: 0;
    padding-top: 0;
    padding-bottom: 0;
}

/* .navbar-nav {
    padding-left: 220px;
} */

.navbar-nav li {
    margin: 0 35px 0 18px;
}

.navbar-nav li:first-child {
    margin-left: 0;
}

.navbar-nav li:last-child {
    margin-right: 0;
    padding-right: 0;
}

.navbar-nav .nav-item a {
    font-family: 'Playfair Display', serif;
    font-size: 18px;
    line-height: 18px;
    font-weight: 400;
    color: var(--e-global-color-darkgreen) !important;
    transition: all 0.3s ease-in-out;
}

.navbar-nav .nav-item a:hover {
    color: var(--e-global-color-olive-text) !important;
    background-color: transparent;
}

.navbar-nav .active>a {
    color: var(--e-global-color-olive-text) !important;
}

.navbar-nav .dropdown {
    margin: 0 15px 0 20px;
}

.navbar-nav .nav-item .dropdown-item {
    color: var(--e-global-color-primary) !important;
    transition: all 0.3s ease-in-out;
}

.navbar-nav .nav-item .dropdown-item:hover {
    color: var(--e-global-color-primary) !important;
    background-color: var(--e-global-color-soft-orange) !important;
}

.navbar-nav .drop-down-pages .active>a {
    color: var(--e-global-color-primary) !important;
    background-color: var(--e-global-color-soft-orange) !important;
}

.navbar-collapse .drop-down-pages {
    text-align: left;
    margin-left: 0;
}

.navbar-nav .dropdown-menu {
    background-color: var(--e-global-color-white);
    position: absolute;
    left: -20px;
    top: 38px;
    padding: 0;
    border: none;
    box-shadow: 1px 1px 30px rgb(0 0 0 / 1%);
}

.navbar-nav .drop-down-pages li {
    margin: 0;
}

.navbar-nav .drop-down-pages .nav-item a {
    font-size: 16px;
    line-height: 16px;
    font-weight: 400;
    padding: 12px 20px;
}

.navbar-expand-lg .drop-down-pages .nav-link {
    padding-left: 0;
}

.contact_us {
    background-color:var(--e-global-color-darkgreen);
    color: var(--e-global-color-white) !important;
    padding: 20px 50px;
    text-align: center;
    display: inline-block;
    border-radius: 30px 0px 30px 0px;
    transition: all 0.3s ease-in-out;
    font-size: 20px;
    
}
 .contact_us:hover {
    color: var(--e-global-color-pale-blue) !important;
    background-color: var(--e-global-color-darkgreen);
    border: 2px solid var(--e-global-color-darkgreen);
    text-decoration: none;
}

.navbar-nav .active>.contact_us {
    color: var(--e-global-color-primary) !important;
    background-color: var(--e-global-color-white);
}

.header-card {
    background-color: #ffffff;
    border-radius: 78px 0px;           
    padding: 24px 62px;              
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06); 
}

.nav-main-flex {
    display: flex;
    align-items: center;
    width: 100%;
}
.nav-menu {
    display: flex;
    justify-content: center;
    margin: 0 auto;
}
.nav-menu li {
    margin: 0 22px;
}
.nav-cta {
    margin-left: auto;
}
@media (max-width: 991px) {
    .nav-main-flex {
        flex-direction: column;
        gap: 20px;
    }

    .nav-menu {
        flex-direction: column;
        margin: 0;
    }

    .nav-cta {
        margin-left: 0;
    }
}

.logo-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* LOGO IMAGE */
.logo-wrap img {
    max-height: 70px;
}

/* SLOGAN TEXT */
.logo-text {
    font-family: 'Playfair Display', serif;
    font-size: 14px;
    line-height: 18px;
    color: var(--e-global-color-darkgreen);
    white-space: nowrap;
}
/* MENU LINK BASE */
.nav-menu .nav-link {
    position: relative;
    padding-bottom: 6px;
}

/* UNDERLINE */
.nav-menu .nav-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0%;
    height: 2px;
    background-color: var(--e-global-color-olive-text);
    transition: width 0.3s ease-in-out;
}

/* HOVER EFFECT */
.nav-menu .nav-link:hover::after {
    width: 100%;
}

/* Home Page Social Icons Style */

.left_icons {
    height: 860px;
    z-index: 1;
    position: relative;
}

.left_icons ul {
    background-color: var(--e-global-color-olive-bright);
    border-radius: 0 30px 30px 0;
}

.left_icons ul li {
    display: block;
    padding: 10px 15px 8px 10px;
}

.left_icons ul li i {
    border-radius: 100%;
    background: var(--e-global-color-darkgreen);
    color: var(--e-global-color-white);
    font-size: 18px;
    line-height: 48px;
    height: 48px;
    width: 48px;
    text-align: center;
    transition: all 0.3s ease-in-out;
}

.left_icons ul li i:hover {
    background-color: var(--e-global-color-white);
    color: var(--e-global-color-darkgreen);
}
/* ACTIVE LINK COLOR */
.nav-menu .active .nav-link {
    color: var(--e-global-color-olive-text);
    font-weight: 500;
}

/* ACTIVE UNDERLINE */
.nav-menu .active .nav-link::after {
    width: 100%;
}
header {
    position: sticky;
    top: 0;
    z-index: 999;
}
header.scrolled {
    background-color: #ffffff;
     box-shadow: 0px 8px 25px rgba(0, 0, 0, 0.08); 
    transition: all 0.3s ease;
}



/* Home Page Banner Section Style */

.banner-section-outer .banner-section {
    padding: 50px 292px 138px;
    position: relative;
}

.banner-section-outer .banner-section .banner-section-content {
    padding-top: 168px;
}

.banner-section-outer .banner-section h5 {
    text-transform: uppercase;
    color: var(--e-global-color-pale-blue   );
    letter-spacing: 3.1px;
    margin-bottom: 0;
    background: var(--e-global-color-darkgreen);
    width: 100%;
    max-width: 325px;
    padding: 11px 35px;
    border-radius: 50px;
    font-weight: 600;
}

.banner-section-outer .banner-section h1 {
    margin-bottom: 18px;
    margin-left: -2px;
}

.banner-section-outer .ityped-cursor {
    font-size: 1em;
    opacity: 1;
    -webkit-animation: blink 0.3s infinite;
    -moz-animation: blink 0.3s infinite;
    animation: blink 0.3s infinite;
    animation-direction: alternate;
}

@keyframes blink {
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes blink {
    100% {
        opacity: 0;
    }
}

@-moz-keyframes blink {
    100% {
        opacity: 0;
    }
}

.banner-section-content h1 span {
    color: var(--e-global-color-white);
    border-right: var(--e-global-color-olive);
}

.banner-section-outer .banner-section p {
    color: var(--e-global-color-pale-blue);
    margin-bottom: 28px;
    padding-right: 60px;
    margin-left: -2px;
}

.banner-section-outer .banner-section-content .btn_wrapper {
    margin-bottom: 100px;
}

.btn_wrapper .getstarted_btn {
    position: relative;
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 50px;
    text-align: center;
    color: var(--e-global-color-accent);
    display: inline-block;
    background-color: var(--e-global-color-olive-bright);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
}

 .btn_wrapper .getstarted_btn:hover {
    color: var(--e-global-color-darkgreen);
    background-color: var(--e-global-color-darkgreen);
    transform: translateY(-10px);
}

.btn_wrapper .viewmore_btn {
    position: relative;
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 50px;
    text-align: center;
    color: var(--e-global-color-accent);
    display: inline-block;
    background-color: var(--e-global-color-olive);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
}

 .btn_wrapper .viewmore_btn:hover {
    color: var(--e-global-color-darkgreen);
    background-color: var(--e-global-color-white);
    transform: translateY(-10px);
    border: 1px solid var(--e-global-color-darkgreen);
}

.banner-section-outer .btn_wrapper .getstarted_btn:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.banner-section-outer .btn_wrapper .getstarted_btn:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-secondary) !important;
    background: var(--e-global-color-white);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.banner-section-outer .banner-section .banner-section-content .top-btn i {
    font-size: 70px;
    line-height: 70px;
    color: var(--e-global-color-white);
    animation: float_img 6s ease-in-out infinite;
}

.banner-section-outer .banner-section .banner-section-content .top-btn i:hover {
    color: var(--e-global-color-soft-orange);
}

.banner-section-outer .banner-section .banner-section-image {
    position: relative;
    animation: float 6s ease-in-out infinite;
}

.banner-section-outer .banner-section .banner-section-image figure {
    position: absolute;
    top: -5px;
    left: -20px;
}

@keyframes float {
    0% {
        box-shadow: 0 5px 15px 0px rgba(0, 0, 0, 0.6);
        transform: translatex(0px);
    }
    50% {
        box-shadow: 0 25px 15px 0px rgba(0, 0, 0, 0.2);
        transform: translatex(-20px);
    }
    100% {
        box-shadow: 0 5px 15px 0px rgba(0, 0, 0, 0.6);
        transform: translatex(0px);
    }
}

.banner-section-outer .banner-section .banner_left_top_shape {
    position: absolute;
    top: -38px;
    left: 0;
}

.banner-section-outer .banner-section .banner_left_bottom_shape {
    position: absolute;
    top: 80px;
    left: 0;
}

.left_shape img {
    -webkit-animation: mover 1s infinite alternate;
    animation: mover 1s infinite alternate;
}

@-webkit-keyframes mover {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-30px);
    }
}

.banner-section-outer .banner-section .banner_right_top_shape {
    position: absolute;
    bottom: 200px;
    right: 0;
}

.banner-section-outer .banner-section .banner_right_bottom_shape {
    position: absolute;
    bottom: 80px;
    right: 0;
}

.right_shape img {
    -webkit-animation: mover 1s infinite alternate;
    animation: mover 1s infinite alternate;
}

@-webkit-keyframes mover {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-30px);
    }
}

/* Home Page Our Services Section Style */

.services_section {
    padding: 120px 0 130px;
    position: relative;
}

.services_section .services_content {
    text-align: center;
}

.services_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
        font-weight: 600;
}

.services_content h2 {
    margin-bottom: 20px;
    padding: 0 120px;
    color: var(--e-global-color-primary);
}

.services_content p {
    margin-bottom: 35px;
    padding: 0 110px;
    color: var(--e-global-color-text);
}

.services_section .services_box_content {
    transition: all 0.3s ease-in-out;
}

.services_section .services_box_content .services_box_upper_portion {
    margin-bottom: 10px;
    animation: float_img 6s ease-in-out infinite;
}

.services_section .services_box_content .services_box_upper_portion img {
    transition: all 0.3s ease-in-out;
}

@keyframes float_img {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(-20px);
    }
    100% {
        transform: translatey(0px);
    }
}

.services_box_content .services_box_lower_portion h3 {
    margin-bottom: 0;
}

.services_box_content .services_box_lower_portion p {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
}

.services_box_content .services_box_lower_portion .btn_wrapper i {
    color: var(--e-global-color-pale-blue);
    background-color: var(--e-global-color-darkgreen);
    font-size: 26px;
    line-height: 26px;
    padding: 12px 15px;
    border-radius: 18px 0 18px 0;
    transition: all ease-in-out 0.3s;
}

.services_box_content:hover {
    transform: translateY(-10px);
}

/* .services_section .services_box_content:hover .services_box_upper_portion img {
    opacity: 0.6;
} */

.services_box_content:hover .services_box_lower_portion .btn_wrapper i {
    color: var(--e-global-color-white);
    background-color: var(--e-global-color-olive);
}

.services_section .services_left_shape {
    position: absolute;
    top: 115px;
    left: 0;
}

/* Remove old floating animation from the upper portion */
.services_section .services_box_content .services_box_upper_portion {
    margin-bottom: 30px;
    /* animation: float_img 6s ease-in-out infinite;  <-- comment/remove this */
}

/* Make the upper portion a 3D container with fixed ratio */
.services_box_upper_portion {
    position: relative;
    perspective: 1000px;      /* needed for 3D flip */
}

/* Keep image area aspect ratio similar to your current images */
.services_box_upper_portion .service-flip {
    width: 100%;
    aspect-ratio: 4 / 5;      /* adjust ratio if needed (width/height) */
    position: relative;
}

/* Inner element that actually rotates */
.service-flip-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.6s ease;
}

/* Front & back faces */
.service-front,
.service-back {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
}

/* Make the image fill the card */
/* .service-front img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
} */

/* Back face styling */
.service-back {
    background-color: #ffffff;
    color: var(--e-global-color-darkgreen);
    padding: 18px 16px;
    transform: rotateY(180deg);
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.10);  /* soft shadow to match style */
}

.service-back h4 {
    font-family: 'Playfair Display', serif;
    font-size: 18px;
    margin-bottom: 8px;
}

.service-back p {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 0;
}

/* Hover: flip the upper card only */
.services_box_content:hover .service-flip-inner {
    transform: rotateY(180deg);
}

/* Keep your existing lift-up effect on the whole box */
.services_box_content:hover {
    transform: translateY(-10px);
}

/* Ensure the arrow and text do NOT flip (they are outside the flip container already) */
/* No extra CSS needed here; just keep the arrow in .services_box_lower_portion */

/* Home Page About Us Section Style */

.aboutus_section {
    background-image: url('../images/aboutus_background.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 100px 0 130px;
}

.aboutus_image {
    position: relative;
    z-index: 1;
}

.aboutus_image figure {
    margin-top: -12px;
}

.aboutus_section .aboutus_top_shape {
    position: absolute;
    top: -10px;
    left: -38px;
}

.aboutus_section .aboutus_bottom_shape {
    position: absolute;
    top: 250px;
    left: -65px;
}

.aboutus_content {
    padding-top: 145px;
    padding-left: 16px;
}

.aboutus_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
    font-weight: 600;
}

.aboutus_content h2 {
    margin-bottom: 18px;
    color: var(--e-global-color-primary);
}

.aboutus_content p {
    margin-bottom: 15px;
    color: var(--e-global-color-text);
}

.aboutus_content h6 {
    color: var(--e-global-color-secondary);
    margin-left: 16px;
    margin-bottom: 35px;
}

.aboutus_line_wrapper {
    position: relative;
}

.aboutus_line_wrapper .purple_line {
    position: absolute;
    left: 0;
    top: 5px;
}

.aboutus_content .btn_wrapper .get_started_btn {
    position: relative;
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 40px;
    text-align: center;
    color: var(--e-global-color-darkgreen);
    display: inline-block;
    background-color: var(--e-global-color-olive);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
}

.aboutus_content .btn_wrapper .get_started_btn:hover {
    color: var(--e-global-color-white);
    background-color: none;
    border: 1px solid   var(--e-global-color-darkgreen);
    transform: translateY(-10px);
}

.aboutus_content .btn_wrapper .get_started_btn:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.aboutus_content .btn_wrapper .get_started_btn:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-white);
    background: var(--e-global-color-darkgreen);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

/* Home Page Our Specialties Section Style */

.our_specialties_section {
    background-color: var(--e-global-color-light-o);
    padding: 120px 0 108px;
    position: relative;
}

.our_specialties_heading_content {
    text-align: center;
}

.our_specialties_heading_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
    font-weight: 600;
}

.our_specialties_heading_content h2 {
    margin-bottom: 18px;
    color: var(--e-global-color-primary);
}

.our_specialties_heading_content p {
    margin-bottom: 35px;
    padding: 0 95px;
    color: var(--e-global-color-text);
}

.s1 {
    padding-top: 110px;
    padding-right: 25px;
}

.s2 {
    padding-right: 70px;
}

.s3 {
    padding-right: 75px;
}

.s4 {
    padding-right: 25px;
}

.specialties_content_wrapper {
    position: relative;
}

.specialties_content {
    text-align: right;
    margin-bottom: 46px;
    position: relative;
}

.specialties_content .specialties_name {
    font-family: 'Playfair Display', serif;
    font-size: 18px;
    line-height: 24px;
    font-weight: 700;
    color: var(--e-global-color-primary);
    margin-bottom: 6px;
}

.specialties_content .specialties_paragraph {
    font-size: 18px;
    line-height: 22px;
    font-weight: 400;
    color: var(--e-global-color-text);
    margin-bottom: 0;
}

.specialties_left_line {
    position: absolute;
    top: 120px;
    right: -50px;
}

.specialties_left_line img {
    height: 390px;
}

.specialties_content::after {
    content: "\f058";
    height: 76px;
    width: 76px;
    background-color: var(--e-global-color-darkgreen);
    position: absolute;
    border-radius: 100%;
    z-index: 1;
    text-align: center;
    padding: 5px;
    font-weight: 400;
    font-size: 42px;
    line-height: 64px;
    color: var(--e-global-color-white);
    font-family: 'Font Awesome 6 Free';
}

.s1::after {
    top: 110px;
    right: -78px;
}

.s2::after {
    top: 0px;
    right: -30px;
}

.s3::after {
    top: 0;
    right: -30px;
}

.s4::after {
    top: 0;
    right: -78px;
}

.specialties_content2 {
    text-align: left;
}

.specialties_content2::after {
    content: "\f058";
    height: 76px;
    width: 76px;
    background-color: var(--e-global-color-darkgreen);
    position: absolute;
    border-radius: 100%;
    z-index: 1;
    text-align: center;
    padding: 5px;
    font-weight: 400;
    font-size: 42px;
    line-height: 64px;
    color: var(--e-global-color-white);
    font-family: 'Font Awesome 6 Free';
}

.s5 {
    padding-top: 110px;
    padding-left: 24px;
}

.s6 {
    padding-left: 74px;
}

.s7 {
    padding-left: 74px;
}

.s8 {
    padding-left: 24px;
}

.s5::after {
    top: 110px;
    left: -78px;
}

.s6::after {
    top: 0px;
    left: -30px;
}

.s7::after {
    top: 0;
    left: -30px;
}

.s8::after {
    top: 0;
    left: -78px;
}

.specialties_right_line {
    position: absolute;
    top: 120px;
    left: -50px;
}

.specialties_right_line img {
    height: 390px;
}

.our_specialties_section .specialties_image {
    text-align: center;
    animation: float_img 6s ease-in-out infinite;
}

.our_specialties_section .our_specialties_right_shape {
    position: absolute;
    top: 150px;
    right: 0;
}

/* Home Page Get In Touch Section Style */
/* Home Page Get In Touch Section Style */

.get_in_touch_section {
    padding: 120px 0 130px;
    position: relative;
    overflow: hidden;
}

/* Left yellow & right image halves as full-height backgrounds */
.get_in_touch_section::before,
.get_in_touch_section::after {
    content: "";
    position: absolute;
    top: 0;
    height: 100%;          /* full section height – removes white gaps */
    z-index: 0;
}

/* Left yellow background */
.get_in_touch_section::before {
    left: 0;
    width: 50%;
    background: var(--e-global-color-olive-bright);
}

/* Right image background – FULL COVER, visible on ALL devices */
.get_in_touch_section::after {
    right: 0;
    width: 50%;
    background-image: url("../images/get-in-toch.webp");
    background-size: cover;         /* makes it cover fully */
    background-position: center;
    background-repeat: no-repeat;
}

/* Ensure content is above the background halves */
.get_in_touch_section > .container {
    position: relative;
    z-index: 1;
}

/* -------- Existing content styles (unchanged) -------- */

.get_in_touch_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-pale-blue);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
    font-weight: 600;
}

.get_in_touch_content h2 {
    color: var(--e-global-color-primary);
    margin-bottom: 32px;
    padding-right: 25px;
}

.get_in_touch_content input {
    font-family: 'Karla', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
    background-color: var(--e-global-color-white);
    color: var(--e-global-color-text);
    padding-top: 28px;
    padding-bottom: 28px;
    padding-left: 20px;
    border-radius: 0;
    width: 98%;
    margin-bottom: 16px;
    outline: none;
    border: none;
}

.get_in_touch_content .form_style {
    margin-left: -18px;
}

.get_in_touch_content textarea {
    font-family: 'Karla', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
    background-color: var(--e-global-color-white);
    color: var(--e-global-color-text);
    border-radius: 0;
    padding: 18px 20px;
    width: 96%;
    outline: none;
    resize: none;
    height: 115px;
    margin-bottom: 42px;
    border: none;
}

.get_in_touch_content .form-control:focus {
    box-shadow: none;
    outline: none;
    border: none;
}

textarea {
    overflow: auto;
}

.get_in_touch_content button {
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 40px;
    text-align: center;
    color: var(--e-global-color-white);
    display: inline-block;
    background-color: var(--e-global-color-darkgreen);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    outline: none;
    border: none;
    overflow: hidden;
    position: relative;
}

.get_in_touch_content button:hover {
    color: var(--e-global-color-darkgreen);
    background-color: var(--e-global-color-white);
    border: 2px solid var(--e-global-color-darkgreen);
}

.get_in_touch_content button:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.get_in_touch_content button:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-secondary);
    background-color: var(--e-global-color-white);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.get_in_touch_section .get_in_touch_shape {
    position: absolute;
    bottom: 210px;
    left: -400px;
}

/* Home Page Testimonial Section Style */

.testimonial_section {
    background-image: url('../images/testimonial_background.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 145px 0 135px;
    position: relative;
}

.testimonial_content {
    text-align: center;
}

.testimonial_content i {
    font-size: 140px;
    line-height: 88px;
    color: var(--e-global-color-darkgreen);
    margin-bottom: 35px;
}

.testimonial_content .testimonial_paragraph {
    font-size: 24px;
    line-height: 36px;
    font-weight: 500;
    color: var(--e-global-color-primary);
    padding: 0 52px 0 55px;
    margin-bottom: 26px;
}

.testimonial_content figure {
    margin-bottom: 18px;
}

.testimonial_content .testimonial_person_name {
    font-family: 'DM Serif Display', serif;
    font-size: 22px;
    line-height: 24px;
    font-weight: 400;
    color: var(--e-global-color-primary);
    margin-bottom: 5px;
}

.testimonial_content span {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    color: var(--e-global-color-text);
}

.testimonial_section .testimonial_left_shape {
    position: absolute;
    left: 0;
    top: 78px;
}

.testimonial_section .testimonial_right_shape {
    position: absolute;
    right: 0;
    bottom: 78px;
}

#carouselExampleControls .carousel-control-prev {
    left: -112px;
    top: -70px;
    font-size: 50px;
    line-height: 50px;
    color: var(--e-global-color-darkgreen);
    opacity: 1;
}

#carouselExampleControls .carousel-control-prev i {
    transition: all 0.3s ease-in-out;
}

#carouselExampleControls .carousel-control-prev i:hover {
    color: var(--e-global-color-soft-orange);
}

#carouselExampleControls .carousel-control-next {
    right: -112px;
    top: -70px;
    font-size: 50px;
    line-height: 50px;
    color: var(--e-global-color-darkgreen);
    opacity: 1;
}

#carouselExampleControls .carousel-control-next i {
    transition: all 0.3s ease-in-out;
}

#carouselExampleControls .carousel-control-next i:hover {
    color: var(--e-global-color-soft-orange);
}

/* Home Page Blog Posts Section Style */

/* .blog_posts_section {
    padding: 0px 0 130px;
    position: relative;
}

.blog_posts_content {
    text-align: center;
}

.blog_posts_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-secondary);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
}

.blog_posts_content h2 {
    margin-bottom: 18px;
    color: var(--e-global-color-primary);
}

.blog_posts_content p {
    margin-bottom: 35px;
    padding: 0 95px;
    color: var(--e-global-color-text);
}

.blog_posts_image {
    margin-bottom: 45px;
    animation: float_img 6s ease-in-out infinite;
    transition: all 0.3s ease-in-out;
}

.blog_posts_image_content {
    position: absolute;
    bottom: 22px;
    left: 40px;
}

.blog_posts_image_content span {
    font-size: 18px;
    line-height: 18px;
    font-weight: 400;
    color: var(--e-global-color-white);
    background-color: var(--e-global-color-secondary);
    padding: 5px 18px;
    border-radius: 15px 0 15px 0;
    margin-bottom: 15px;
    display: inline-block;
}

.blog_posts_image_content h4 {
    color: var(--e-global-color-white);
    margin-bottom: 22px;
    padding-right: 30px;
}

.blog_posts_image_content i {
    font-size: 20px;
    line-height: 20px;
    color: var(--e-global-color-white);
    transition: all 0.3s ease-in-out;
}

.blog_posts_image:hover .blog_posts_image_content i {
    color: var(--e-global-color-soft-orange);
}

.blog_posts_section .btn_wrapper {
    text-align: center;
}

.blog_posts_section .btn_wrapper .view_blog {
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 36px;
    text-align: center;
    color: var(--e-global-color-accent);
    display: inline-block;
    background-color: var(--e-global-color-soft-orange);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    position: relative;
    overflow: hidden;
}

.blog_posts_section .btn_wrapper .view_blog:hover {
    color: var(--e-global-color-white);
    background-color: var(--e-global-color-secondary);
    transform: translateY(-10px);
}

.blog_posts_section .btn_wrapper .view_blog:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.blog_posts_section .btn_wrapper .view_blog:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-white);
    background-color: var(--e-global-color-secondary);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.blog_posts_section .blog_posts_left_shape {
    position: absolute;
    left: 0;
    bottom: -110px;
}

.blog_posts_section .blog_posts_right_shape {
    position: absolute;
    right: 0;
    bottom: 302px;
} */

/* Home Page Subscribe Section Style */

.subscribe_section {
    z-index: 1;
    position: relative;
}

.subscribe_background_image {
    background-image: url('../images/subscribe_background-1.png');
    background-repeat: no-repeat;
    position: relative;
    padding: 118px 80px 130px;
}

.subscribe_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
    font-weight: 600;
}

.subscribe_content h2 {
    color: var(--e-global-color-primary);
    margin-bottom: 32px;
}

.subscribe_content input {
    font-family: 'Karla', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
    background-color: var(--e-global-color-white);
    color: var(--e-global-color-text);
    padding-top: 25px;
    padding-bottom: 28px;
    padding-left: 20px;
    border-radius: 0;
    width: 90%;
    margin-bottom: 26px;
    outline: none;
    border: none;
}

.subscribe_content button {
    font-size: 20px;
    line-height: 20px;
    font-weight: 500;
    padding: 20px 39px;
    text-align: center;
    color: var(--e-global-color-white);
    display: inline-block;
    background-color: var(--e-global-color-darkgreen);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    outline: none;
    border: none;
    overflow: hidden;
    position: relative;
}

.subscribe_content button:hover {
    color: var(--e-global-color-darkgreen);
    background-color: var(--e-global-color-white);
    transform: translateY(-10px);
}

.subscribe_content button:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.subscribe_content button:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-secondary);
    background-color: var(--e-global-color-white);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.subscribe_content .form-control:focus {
    box-shadow: none;
    outline: none;
    border: none;
}

.subscribe_background_image .subscribe_image {
    position: absolute;
    bottom: -71px;
    right: -163px;
}

/* Form validation states */
.form-control.is-invalid {
    border-color: #dc3545;
}

.error-message {
    font-size: 13px;
    margin-top: 4px;
}

/* Home Page Footer Section Style */

.footer-section {
    position: relative;
    background-color: var(--e-global-color-light-o);
    padding: 308px 0 0px;
    margin-top: -218px;
}

.middle-portion {
    margin-top: 36px;
    margin-bottom: 42px;
}

.middle-portion .footer_logo {
    padding-top: 5px;
}

.middle-portion .footer_logo img {
    width: 200px;     /* increase this */
    max-width: none;  /* overrides Bootstrap */
    height: auto;
}



.middle-portion .about_col {
    margin-left: -8px;
}

.middle-portion .about_col h4 {
    margin-bottom: 18px;
    padding-left: 2px;
}

.middle-portion h4 {
    color: var(--e-global-color-darkgreen);
    margin-bottom: 16px;
}

.middle-portion ul {
    margin-bottom: 0;
}

.middle-portion .about_col ul li p {
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    color: var(--e-global-color-darkgreen);
    margin-bottom: 24px;
}

.middle-portion ul .icons {
    display: inline-block;
    margin-right: 8px;
}

.middle-portion ul .icons i {
    border-radius: 100%;
    background: var(--e-global-color-darkgreen);
    color: var(--e-global-color-pale-blue);
    font-size: 18px;
    line-height: 48px;
    height: 48px;
    width: 48px;
    text-align: center;
    margin-right: 0;
    transition: all 0.3s ease-in-out;
}

.middle-portion ul .icons i:hover {
    color: var(--e-global-color-darkgreen);
    background-color: var(--e-global-color-white);
    border: 2px solid var(--e-global-color-darkgreen);
    transform: translateY(-5px);
}

.middle-portion li a {
    text-decoration: none;
    color: var(--e-global-color-darkgreen);
    font-weight: 400;
    font-size: 18px;
    line-height: 32px;
    transition: all 0.3s ease-in-out;
}

.middle-portion .links_col {
    padding-left: 42px;
}

.middle-portion .contact_col {
    padding-right: 15px;
    margin-left: -42px;
}

.middle-portion .contact_col ul li {
    margin-bottom: 8px;
}

.middle-portion li i {
    color: var(--e-global-color-darkgreen);
    margin-right: 12px;
    transition: all 0.3s ease-in-out;
}

.middle-portion li .location {
    margin-right: 15px;
}

.middle-portion .contact_col li span {
    color: var(--e-global-color-darkgreen);
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
}

.middle-portion li a:hover {
    color: var(--e-global-color-soft-orange);
}

.middle-portion .contact_col ul .contact_icons:hover i {
    color: var(--e-global-color-soft-orange);
}

.bottom-portion {
    border-top: 1px solid var(--e-global-color-darkgreen);
    text-align: center;
}

.copyright {
    padding: 24px 0;
}

.copyright p {
    color: var(--e-global-color-darkgreen);
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
    margin: 0;
}

.footer_shape figure {
    position: absolute;
    bottom: 120px;
    right: 0;
}



/* About Page Style */

/* About Page Sub Banner Section Style */

.sub-banner-section {
    background-image: url('../images/banner_section_background.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.sub-banner-section .banner-section {
    padding: 58px 0 58px;
    position: relative;
}

.sub-banner-section .banner-section .banner-section-content {
    text-align: center;
}

.sub-banner-section .banner-section h1 {
    margin-bottom: 16px;
}

.sub-banner-section .banner-section p {
    color: var(--e-global-color-white);
    padding: 0 260px;
    margin-bottom: 26px;
}

.sub-banner-section .banner-section .btn_wrapper {
    font-size: 20px;
    line-height: 20px;
    font-weight: 400;
    padding: 14px 24px;
    text-align: center;
    background-color: var(--e-global-color-darkgreen);
    color: var(--e-global-color-white);
    display: inline-block;
    border-radius: 25px 0 25px 0;
    transition: all 0.3s ease-in-out;
}

.sub-banner-section .banner-section .btn_wrapper .sub_home_span {
    margin-right: 8px;
}

.sub-banner-section .banner-section .btn_wrapper i {
    font-size: 14px;
}

.sub-banner-section .banner-section .btn_wrapper .sub_span {
    color: var(--e-global-color-soft-orange);
    margin-left: 8px;
}

.sub-banner-section .banner-section .banner_left_top_shape {
    position: absolute;
    top: -8px;
    left: 0;
}

.sub-banner-section .banner-section .banner_left_bottom_shape {
    position: absolute;
    top: 112px;
    left: 0;
}

.sub-banner-section .banner-section .banner_right_top_shape {
    position: absolute;
    bottom: 222px;
    right: 0;
}

.sub-banner-section .banner-section .banner_right_bottom_shape {
    position: absolute;
    bottom: 98px;
    right: 0;
}

/* About Page About Us Section Style */

.aboutpage_aboutus_section {
    padding: 132px 0;
}

.aboutpage_aboutus_image {
    position: relative;
    z-index: 999;
        width: 100%;
    max-width: 90%;
}

.aboutpage_aboutus_image figure {
    margin-top: -12px;
}

.aboutpage_aboutus_section .aboutus_top_shape {
    position: absolute;
    top: 6px;
    left: -36px;
    z-index: 0;
}

.aboutpage_aboutus_section .aboutus_bottom_shape {
    position: absolute;
    top: 265px;
    left: -62px;
    z-index: -1;
}

/* .aboutpage_aboutus_content {
    padding-top: 110px;
} */

.aboutpage_aboutus_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
    font-weight: 600;
}

.aboutpage_aboutus_content h2 {
    margin-bottom: 18px;
    color: var(--e-global-color-primary);
}

.aboutpage_aboutus_content p {
    margin-bottom: 12px;
    color: var(--e-global-color-text);
}

.aboutpage_aboutus_content .margin_bottom {
    margin-bottom: 30px;
}

.aboutpage_aboutus_content .box {
    width: 48%;
    background-color: var(--e-global-color-white);
    display: inline-block;
    align-items: center;
    padding: 20px 24px 15px;
    border-radius: 30px 0 30px 0;
    margin-bottom: 22px;
    margin-right: 12px;
    box-shadow: 1px 1px 50px rgb(0 0 0 / 7%);
    transition: all 0.3s ease-in-out;
    position: relative;
}

.aboutpage_aboutus_content .box i {
    position: absolute;
    left: 22px;
    top: 24px;
    border-radius: 100%;
    border: 2px solid var(--e-global-color-darkgreen);
    height: 38px;
    width: 38px;
    text-align: center;
    font-size: 18px;
    line-height: 36px;
    color: var(--e-global-color-darkgreen);
}

.aboutpage_aboutus_content .box span {
    font-size: 18px;
    line-height: 21px;
    font-weight: 600;
    padding-left: 50px;
    display: inline-block;
    color: var(--e-global-color-primary);
}

.aboutpage_aboutus_content .box:hover {
    transform: translateY(-10px);
}

/* About Page Discount Section Style */

.discount_section {
    background-image: url('../images/about-us/discount_background.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 120px 0 130px;
}

.discount_content {
    text-align: center;
}

.discount_content h2 {
    margin-bottom: 18px;
    color: var(--e-global-color-primary);
    padding: 0 230px;
}

.discount_content span {
    color: var(--e-global-color-darkgreen);
}

.discount_content p {
    margin-bottom: 35px;
    /* padding: 0 160px; */
    color: var(--e-global-color-text);
}

.discount_content .btn_wrapper .get_started {
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 50px;
    text-align: center;
    color: var(--e-global-color-accent);
    display: inline-block;
    background-color: var(--e-global-color-olive-bright);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    position: relative;
    overflow: hidden;
}

.discount_content .btn_wrapper .get_started:hover {
    color: var(--e-global-color-white);
    background-color: var(--e-global-color-secondary);
    transform: translateY(-10px);
}

.discount_content .btn_wrapper .get_started:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.discount_content .btn_wrapper .get_started:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-white);
    background-color: var(--e-global-color-darkgreen);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.discount_section .container {
    position: relative;
    z-index: 1;
}

/* Center heading + subtitle */
.discount_content {
    text-align: center;
}

/* White pill-shaped block – similar to About page cards */
.treatment_shell {
    max-width: 1120px;
    margin: 40px auto 0;
    background-color: #ffffff;
    border-radius: 36px;
    padding: 40px 40px 28px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.08);
}

/* Layout of cards inside the shell */
.treatment_cards {
    margin: 0;
}

/* Individual card */
.treatment_card {
    background: #ffffff;
    border-radius: 24px;
    padding: 22px 18px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    height: 100%;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

/* Number badge for each step */
.step_badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--e-global-color-olive);
    color: var(--e-global-color-darkgreen);
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 14px;
}

/* Card title */
.treatment_card h3 {
    font-family: 'Playfair Display', serif;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 600;
    color: var(--e-global-color-darkgreen);
    margin-bottom: 8px;
}

/* Card text */
.treatment_card p {
    font-size: 20px;
    padding-top: 10px;
    line-height: 1.3;
    color: var(--e-global-color-text);
    margin-bottom: 0;
}

/* Hover interaction – subtle but engaging */
.treatment_card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.12);
    background-color: #faf7ea; /* soft warm tint – adjust to your palette */
}

/* Slight color shift on badge when hovering the card */
.treatment_card:hover .step_badge {
    background-color: var(--e-global-color-darkgreen);
    color: #ffffff;
}

/* Button spacing */
.discount_content .btn_wrapper {
    margin-top: 45px;
}

/* ---------- Responsive tweaks ---------- */

@media (max-width: 1199.98px) {
    .treatment_shell {
        max-width: 100%;
        padding: 32px 28px 24px;
        border-radius: 30px;
    }

    .treatment_card {
        border-radius: 20px;
    }
}

@media (max-width: 991.98px) {
    .discount_section {
        padding: 90px 0 100px;
    }

    .treatment_shell {
        padding: 28px 22px 20px;
        margin-top: 32px;
    }

    .treatment_card {
        margin-bottom: 0;
    }
}

@media (max-width: 575.98px) {
    .treatment_shell {
        padding: 22px 16px 18px;
        border-radius: 24px;
    }

    .treatment_card {
        padding: 18px 16px;
    }

    .treatment_card h3 {
        font-size: 16px;
    }

    .treatment_card p {
        font-size: 13px;
    }

    .step_badge {
        width: 32px;
        height: 32px;
        font-size: 13px;
    }
}




/* About Page Our Mission Section Style */

.mission_section {
    padding: 130px 0 130px;
    position: relative;
}

.mission_section .mission_box {
    width: 100%;
    background-color: var(--e-global-color-white);
    border-radius: 200px 0 200px 0;
    box-shadow: 1px 1px 50px rgb(0 0 0 / 7%);
}

.mission_content {
       padding: 140px 0px 0px 85px;
}

.mission_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
    font-weight: 600;
}

.mission_content h2 {
    margin-bottom: 16px;
    color: var(--e-global-color-primary);
}

.mission_content p {
    margin-bottom: 32px;
    color: var(--e-global-color-text);
    padding-right: 25px;
}

.mission_content .btn_wrapper .read_more_btn {
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 44px;
    text-align: center;
    color: var(--e-global-color-white);
    display: inline-block;
    background-color: var(--e-global-color-secondary);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    position: relative;
    overflow: hidden;
}

.mission_content .btn_wrapper .read_more_btn:hover {
    color: var(--e-global-color-accent);
    background-color: var(--e-global-color-soft-orange);
    transform: translateY(-10px);
}

.mission_content .btn_wrapper .read_more_btn:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.mission_content .btn_wrapper .read_more_btn:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-accent);
    background-color: var(--e-global-color-soft-orange);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.mission_section .mission_right_shape {
    position: absolute;
    top: 210px;
    right: 0;
}

/* About Page Our Vision Section Style */

.vision_section {
    padding: 45px 0 130px;
    position: relative;
}

.vision_section .vision_box {
    width: 100%;
    background-color: var(--e-global-color-white);
    border-radius: 200px 0 200px 0;
    box-shadow: 1px 1px 50px rgb(0 0 0 / 7%);
}

.vision_content {
    padding: 120px 0px 10px 40px;
}
.vision_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
    font-weight: 600;
}

.vision_content h2 {
    margin-bottom: 16px;
    color: var(--e-global-color-primary);
}

.vision_content p {
    margin-bottom: 32px;
    color: var(--e-global-color-text);
    padding-right: 60px;
}

.vision_content .btn_wrapper .read_more_btn {
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 44px;
    text-align: center;
    color: var(--e-global-color-white);
    display: inline-block;
    background-color: var(--e-global-color-secondary);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    position: relative;
    overflow: hidden;
}

.vision_content .btn_wrapper .read_more_btn:hover {
    color: var(--e-global-color-accent);
    background-color: var(--e-global-color-soft-orange);
    transform: translateY(-10px);
}

.vision_content .btn_wrapper .read_more_btn:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.vision_content .btn_wrapper .read_more_btn:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-accent);
    background-color: var(--e-global-color-soft-orange);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.vision_section .vision_left_shape {
    position: absolute;
    top: 140px;
    left: 0;
}


/* Services Page Style */

/* Services Page Services Section Style */

.services_section .services_page_services_right_shape {
    position: absolute;
    top: 115px;
    right: 0;
}

/* Pricing Page Style */

/* Pricing Page Pricing Plans Section Style */

.pricing_plans_section_padding {
    padding: 120px 0 130px;
}


/* Contact Page Message Section Style */

.message_section {
    padding: 120px 0 130px;
    background-color: var(--e-global-color-white);
}

.message_content h5 {
    text-transform: uppercase;
    color: var(--e-global-color-darkgreen);
    letter-spacing: 3.1px;
    margin-bottom: 12px;
}

.message_content h2 {
    color: var(--e-global-color-primary);
    margin-bottom: 18px;
}

.message_content p {
    padding-right: 100px;
    margin-bottom: 36px;
    color: var(--e-global-color-text);
}

.message_content input {
    font-family: 'Karla', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
    background-color: var(--e-global-color-white);
    color: var(--e-global-color-text);
    padding-top: 32px;
    padding-bottom: 32px;
    padding-left: 25px;
    border-radius: 0;
    width: 90%;
    margin-bottom: 28px;
    outline: none;
    border: none;
    box-shadow: 1px 1px 50px rgb(0 0 0 / 5%);
}

.message_content .form_style {
    margin-left: -40px;
}

.message_content textarea {
    font-family: 'Karla', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
    background-color: var(--e-global-color-white);
    color: var(--e-global-color-text);
    border-radius: 0;
    padding: 18px 25px;
    width: 90%;
    outline: none;
    resize: none;
    height: 128px;
    margin-bottom: 42px;
    border: none;
    box-shadow: 1px 1px 50px rgb(0 0 0 / 5%);
}

.message_content .form-control:focus {
    box-shadow: none;
    outline: none;
    border: none;
}

textarea {
    overflow: auto;
}

.message_content button {
    font-size: 22px;
    line-height: 22px;
    font-weight: 500;
    padding: 24px 40px;
    text-align: center;
    color: var(--e-global-color-white);
    display: inline-block;
    background-color: var(--e-global-color-darkgreen);
    border-radius: 35px 0px 35px 0px;
    transition: all 0.3s ease-in-out;
    outline: none;
    border: none;
    overflow: hidden;
    position: relative;
}

.message_content button:hover {
    color: var(--e-global-color-darkgreen);
    background-color: var(--e-global-color-olive);
    transform: translateY(-10px);
}

.message_content button:hover:before {
    left: 0%;
    right: auto;
    width: 100%;
}

.message_content button:before {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    width: 0px;
    z-index: -1;
    content: '';
    color: var(--e-global-color-white);
    background-color: var(--e-global-color-olive);
    transition: all 0.4s cubic-bezier(0.12, 0, 0.38, 1) 0s;
}

.message_section .box_padding {
    margin-top: 10px;
}

.message_section .box {
    box-shadow: 1px 1px 50px rgb(0 0 0 / 5%);
    width: 380px;
    transition: all 0.3s ease-in-out;
    border-radius: 45px 0 45px 0;
    background-color: var(--e-global-color-white);
    padding: 30px 18px 40px;
    margin-left: -30px;
    margin-bottom: 30px;
}

.message_section .box .box_wrapper {
    position: relative;
    padding-left: 20px;
    margin-top: -12px;
    display: inline-block;
    width: 74%;
}

.message_section .box .box_wrapper h3 {
    margin-bottom: 5px;
    color: var(--e-global-color-primary);
}

.message_section .box .box_wrapper p {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    margin-top: -10px;
    margin-bottom: 11px;
    color: var(--e-global-color-text);
}

.message_section .box .box_wrapper a {
    color: var(--e-global-color-text);
    transition: all 0.3s ease-in-out;
}

.message_section .box .box_wrapper a:hover {
    color: var(--e-global-color-soft-orange);
}

.message_section .box .box_image_content {
    float: left;
    width: 26%;
}

.message_section .box .box_image_content figure {
    background-color: var(--e-global-color-darkgreen);
    width: 90px;
    height: 90px;
    line-height: 90px;
    text-align: center;
    border-radius: 100px;
    transition: all 0.3s ease-in-out;
}

.message_section .box:hover .box_image_content figure {
    background-color: var(--e-global-color-olive);
}

/* Contact Page Contact Map Section Style */

.contact_map_section {
    overflow: hidden;
    margin-bottom: -10px;
}

/* Contact Page Contact Subscribe Section Style */

.contact_subscribe_section {
    margin-top: -200px;
}

/* Blog Posts Page Style */

.blog-posts {
    padding: 120px 0 130px;
}

.single-post .single-post-heading {
    font-size: 30px !important;
}




/* Gallery Page */

/* ---------- GALLERY HERO ---------- */

.gallery-hero {
    padding: 110px 0 70px;
    background: linear-gradient(
        180deg,
        #f8faf9 0%,
        #ffffff 45%,
        #fdf8ea 100%
    );
}

.gallery-eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.18em;
    font-size: 12px;
    color: var(--e-global-color-olive-text);
    margin-bottom: 10px;
}

.gallery-hero h1 {
    font-family: 'Playfair Display', serif;
    font-size: 40px;
    font-weight: 600;
    color: var(--e-global-color-darkgreen);
    margin-bottom: 12px;
}

.gallery-hero h1 span {
    color: var(--e-global-color-olive-text);
}

.gallery-subtitle {
    font-size: 16px;
    color: #555;
    max-width: 520px;
    margin: 0 auto;
}

/* ---------- GALLERY SECTION ---------- */

.gallery-section {
    padding: 0 0 110px;
    background-color: transparent;
}

/* Filter buttons */
.gallery-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 18px 18px;
    margin: 80px 0px 40px;
}

.gallery-filter .filter-btn {
    border: none;
    outline: none;
    background-color: var(--e-global-color-darkgreen);
    color: var(--e-global-color-pale-blue);
    font-size: 20px;
    font-weight: 600;
    padding: 12px 22px;
    border-radius: 50px;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease,
                box-shadow 0.25s ease, transform 0.25s ease;
}

.gallery-filter .filter-btn.active {
    background-color: var(--e-global-color-olive);
    color: var(--e-global-color-darkgreen);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16);
    transform: translateY(-1px);
}

/* White rounded container for grid */
.gallery-shell {
    background-color: #ffffff;
    border-radius: 30px;
    padding: 32px 26px 24px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.08);
}

/* Card & image */
.gallery-card {
    border-radius: 20px;
    overflow: hidden;
    background-color: #000;
    position: relative;
}

.gallery-img-wrap {
    position: relative;
    overflow: hidden;
}

.gallery-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s ease;
}

/* Overlay on hover */
.gallery-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.1) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 18px 18px 16px;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.gallery-title {
    font-family: 'Playfair Display', serif;
    font-size: 18px;
    color: #ffffff;
    margin-bottom: 4px;
}

.gallery-cat {
    font-size: 13px;
    color: #f7e7a8;
    margin-bottom: 6px;
}

.gallery-zoom {
    align-self: flex-start;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    background-color: var(--e-global-color-olive);
    color: var(--e-global-color-darkgreen);
    padding: 4px 10px;
    border-radius: 999px;
}

/* Hover states */
.gallery-card:hover .gallery-img-wrap img {
    transform: scale(1.07);
}

.gallery-card:hover .gallery-overlay {
    opacity: 1;
    transform: translateY(0);
}

/* Filter hide class */
.gallery-item.is-hidden {
    opacity: 0;
    transform: scale(0.96);
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
}

/* ---------- LIGHTBOX ---------- */

.gallery-lightbox {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;            
    transition: opacity 0.35s ease;    
    z-index: 1050;
}

.gallery-lightbox.open {
    opacity: 1;
    pointer-events: auto;
}

.gallery-lightbox-inner {
    max-width: 760px;          
    width: 70%;                
    max-height: 80vh;         
    background-color: #ffffff;
    border-radius: 16px;
    padding: 14px 14px 20px;
    position: relative;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.45);

    /* open/close animation (scale + fade) */
    transform: scale(0.85) translateY(20px);
    opacity: 0;
    transition:
        transform 0.35s cubic-bezier(0.16, 0.84, 0.44, 1),
        opacity 0.35s ease;
}
.gallery-lightbox.open .gallery-lightbox-inner {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.gallery-lightbox-inner img {
    width: 100%;
    height: auto;
    max-height: 70vh;  
    border-radius: 10px;
    display: block;
    object-fit: contain;
}


.gallery-lightbox-inner p {
    margin: 18px 4px 0;
    font-size: 20px;
    color: var(--e-global-color-darkgreen);
    text-align: center;
}

.gallery-lightbox-close {
    position: absolute;
    top: 6px;
    right: 10px;
    border: none;
    background: transparent;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    color: var(--e-global-color-white);
    transition: color 0.2s ease, transform 0.2s ease;
}
.gallery-lightbox-close:hover {
    color: #000;
    transform: scale(1.1);
}
/* ---------- RESPONSIVE ---------- */

@media (max-width: 991.98px) {
    .gallery-hero {
        padding: 90px 0 50px;
    }
    .gallery-hero h1 {
        font-size: 32px;
    }
    .gallery-shell {
        padding: 24px 18px 18px;
        border-radius: 24px;
    }
}

@media (max-width: 575.98px) {
    .gallery-hero {
        padding: 80px 0 40px;
    }
    .gallery-hero h1 {
        font-size: 26px;
    }
    .gallery-shell {
        padding: 18px 12px 14px;
    }
    .gallery-filter .filter-btn {
        font-size: 13px;
        padding: 6px 14px;
    }
}

.footer_logo {
    background: #ffffff;
    padding: 14px 16px;
    border-radius: 12px;
    display: inline-block;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    max-width: 220px;
}

.footer_logo img {
    max-width: 190px;
    height: auto;
    display: block;
    margin: auto;
}

.middle-portion .row {
    justify-content: center;
}


.footer-logo-wrapper {
    padding: 0px;
}