@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@100..800&display=swap');

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

:root {
    --black: #000000;
    --white: #FFFFFF;
    --Blue: #546B92;
    --Torqoies-green: #19B4A4;
    --Dark-gray: #525252;
    --Big-stone: #162135;
    --Midnight-blue: #3232AB;
}

body {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: var(--Dark-gray);
    font-family: "Rubik";
    padding: 0;
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    word-break: break-word
}

body,
html {
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
}

a {
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: none;
    outline: none;
    outline-offset: 0;
    color: var(--white)
}

a,
a.nav-link,
a:active,
a:focus {
    color: var(--white)
}

a,
a.nav-link,
.btn,
input,
textarea,
select {
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn.focus:active,
.btn:active:focus,
.btn:focus {
    outline: none;
    outline-offset: 0;
    box-shadow: none;
}

input.btn:focus {
    border: transparent;
}

.btn.active,
.btn:active,
.btn:focus {
    box-shadow: none;
}

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

video {
    background-size: cover;
    display: table-cell;
    vertical-align: middle;
    width: 100%;
}

p {
    margin: 0 0 25px;
}

p:last-of-type {
    margin-bottom: 0;
}

ul,
ol,
dl {
    list-style-position: outside;
    margin-bottom: 25px;
}

ul {
    margin: 0;
    padding: 0;
}



h1 {
    font-size: 3.501rem;
    line-height: 4.501rem;
    font-weight: 700;
    font-family: "Sora";
    color: var(--Big-stone);
    margin-bottom: 24px;
}

h2 {
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: 700;
    color: var(--Big-stone);
    letter-spacing: 0.5px;
    font-family: "Sora";
    text-transform: capitalize;
}

h3 {
    font-size: 2.125rem;
    line-height: 2.6875rem;
    font-family: "Sora";
}

h4 {
    font-size: 1.375rem;
    line-height: 1.925rem;
    font-family: "Sora";
}

h5 {
    font-size: 1.25rem;
    line-height: 1.25rem;
    font-family: "Sora";
}

h6 {
    font-size: 1.125rem;
    line-height: 1.4375rem;
    font-family: "Sora";
}

.text-very-small {
    font-size: 16px;
    line-height: 14px;
}

.text-extra-small {
    font-size: 15px;
    line-height: 16px;
}

.text-small {
    font-size: 14px;
    line-height: 22px;
}



/* ===================================
     Button
====================================== */
.btn {
    font-size: 16px;
    line-height: 32px;
    font-weight: 400;
    display: inline-block;
    width: auto;
    padding: 10px 20px;
    font-family: "Rubik";
    border-radius: 5px;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.btn-bg-pink {
    background-color: var(--Torqoies-green);
    color: var(--white);
}

.btn-bg-pink:hover {
    background-color: transparent;
    border: 1px solid var(--Torqoies-green);
    color: var(--Torqoies-green);
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.btn-secondary {
    background: transparent;
    border-color: var(--Torqoies-green);
    color: var(--Torqoies-green);
}

.btn-secondary:hover {
    background: var(--Torqoies-green);
    border-color: var(--Torqoies-green);
    color: var(--white);
}

.btn-secondary:hover svg {
    fill: var(--white);
}

.btn-bg-pink svg {
    fill: #fff;
    /* default white */
    transition: fill 0.3s ease;
}

.btn-bg-pink:hover svg {
    fill: var(--Torqoies-green);
    /* your hover color */
}

.btn-check:checked+.btn,
.btn.active,
.btn.show,
.btn:first-child:active,
:not(.btn-check)+.btn:active {
    color: var(--black);
    background-color: transparent;
    border-color: var(--Torqoies-green);
}

section {
    padding: 100px 0;
    overflow: hidden;
}

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

/* Top-bar css start */
header .header-bottom {
    padding: 10px 24px 20px 24px;
    align-items: center;
}

header .social-media ul {
    display: flex;
    list-style: none;
    gap: 30px;
}

header .social-media li i {
    color: var(--Blue);
    font-size: 16px;
    margin-right: 9px;
}

header .social-media li a {
    color: var(--black);
    font-size: 16px;
    line-height: 26.5px;
    font-weight: 400;
    font-family: "Rubik";
}

header .search-box .search-bar .form-control {
    max-width: 260px;
    height: 52px;
}

header .search-box .search-bar {
    position: relative;
}

header .search-box .search-bar img {
    position: absolute;
    top: 17px;
    right: 17px;
}

header .search-box .search-bar input::placeholder {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    font-family: "Rubik";
    color: var(--Dark-gray);
}

header .navbar {
    background-color: var(--white);
    height: 100%;
    padding: 0;
    box-shadow: 0 2px 28px rgba(0, 0, 0, 0.09);
    border-radius: 5px;

}

header .navbar ul li a {
    font-size: 16px;
    line-height: 26.5px;
    font-weight: 500;
    font-family: "Rubik";
    color: var(--black);
}

header .navbar ul {
    gap: 25px;
    margin: 0 !important;
    margin-left: auto ! IMPORTANT;
}

header .navbar .sub-menu {
    position: absolute;
    width: 160px;
    background-color: var(--Torqoies-green);
    box-shadow: 0 10px 25px var(--Blue);
    margin-top: 20px !important;
    opacity: 0;
    z-index: 10;
    transition: all ease 0.5s;
    border-radius: 8px;
    padding: 15px;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

/* header .navbar-brand{
    padding: 0;
} */
.navbar ul li:hover .sub-menu {
    opacity: 1;
    z-index: 99;
    margin-top: 0;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.navbar ul .sub-menu li {
    margin: 0;
    width: 100%;
}

.navbar ul .sub-menu li a {
    display: inline-block;
    padding: 5px 20px;
    width: 100%;
}

header ul {
    list-style: none;
}



header {
    width: 100%;
    z-index: 999;
}

.header-bottom {
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.header-bottom.hide {
    transform: translateY(-100%);
    opacity: 0;
    position: absolute;
    width: 100%;
}

/* Mega Menu */
.mega-menu {
    position: relative;
}

.mega-menu .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 20px;
    z-index: 1000;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

/* .mega-menu:hover .dropdown-menu {
        display: block;
    } */

.mega-menu .dropdown-menu .row>div {
    padding: 10px;
    width: 100%;
}

.mega-menu h6 {
    font-weight: 600;
    margin-bottom: 10px;
}

.mega-menu a {
    display: block;
    color: #333;
    padding: 4px 0;
    text-decoration: none;
    transition: color 0.2s ease;
}

.mega-menu a:hover {
    color: var(--Torqoies-green)
}


/* Header Top (info bar) */
.header-top {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
    transform: translateY(0);
    opacity: 1;
    z-index: 1001;
}

/* Hidden state */
.header-top.hide {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

/* Navbar stays fixed */
.header-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    transition: top 0.3s ease-in-out;
}

/* Push navbar down only when top is visible */
.header-top:not(.hide)+.header-nav {
    top: 80px;
    /* height of header-top */
}


/* Top-bar css end */

/* Hero-banner start css */
.hero-banner {
    padding-top: 65px;
    margin-bottom: 50px;
    min-height: 500px;

    background-image:
        url("https://rainflowweb.com/demo/cardiology/wp-content/uploads/2025/11/Hero.png");

    /* background-image:
        url("https://rainflowweb.com/demo/cardiology/wp-content/uploads/2025/11/Hero-3.png"); */

    background-size: cover !important;
    overflow: hidden;
    position: relative;
    background-position: center center !important;
    padding-bottom: 0 !important;
}



.hero-banner .welcome {
    max-width: fit-content;
    max-height: fit-content;
    background-color: #d7d1ef;
    border-radius: 5px;
    margin-bottom: 24px;
    /* margin-top: 130px; */
    padding: 7.5px 12px;
    gap: 12px;
    display: flex;
}

.hero-banner .welcome span {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    font-family: "Rubik";
    color: var(--Midnight-blue)
}

.hero-banner p {
    max-width: 65%;
    margin-bottom: 24px;
}

.hero-banner-card.hero-one {
    position: absolute;
    top: 285px;
    right: 37px;
}

.hero-banner .full-screen {
    position: relative;
}

.hero-icon-two {
    position: absolute;
    /* top: 14px;
    left: 150px; */
    top: 72px;
    left: 140px;
}

.hero-banner .container.position-relative .row {
    height: 610px;
}

.hero-banner .hero-banner-card h5 {
    font-weight: 400;
    font-family: "Rubik";
    color: var(--Big-stone);
    line-height: 24px;
    margin-bottom: 0;

}

.hero-banner-card.hero-two {
    position: absolute;
    left: -64px;
    top: 410px;
    padding: 12px 20px !important;
}

.hero-banner-card-box {
    position: relative;
}

.hero-banner .hero-two-text {
    font-weight: 600;
    font-size: 20px;
    line-height: 25px;
    font-family: "Rubik";
    color: var(--Big-stone);
}

.hero-banner-card.hero-two h6 {
    font-weight: 400;
    font-family: "Rubik";
    color: var(--Dark-gray);
    max-width: 100%;
    margin-bottom: 0;
    line-height: 21px;
}

.hero-banner-card.hero-two h3 {
    font-weight: 600;
    font-family: "Sora";
    color: var(--Torqoies-green);
    margin-bottom: 0;
    line-height: 43px;

}

.hero-banner-card-box .hero-banner-card {
    display: flex;
    background-color: white;
    padding: 21px 20px;
    gap: 10px;
    border-radius: 10px;
    align-items: center;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.hero-btn {
    gap: 24px;
    display: flex;
}

.hero-banner-bg {
    padding-top: 120px;
}

.hero-icon-one {
    position: absolute;
    top: 466px;
    right: 0px;
}

/* Hero-banner start end */

/* book-appointment start */
.book-appointment {
    padding-bottom: 65px;
}

.book-appointment .book-appointment-box {
    background-color: #FFF5F5;
    border-radius: 20px;
    padding: 35px 30px 28px 30px;
    height: 100%;
}

.book-appointment .book-appointment-box .book-appointment-images {
    margin-bottom: 30px;
}

.book-appointment .book-appointment-box .book-appointment-text h4 {
    font-family: "Sora";
    color: var(--Big-stone);
    margin-bottom: 24px;
    font-weight: 700;
}

.book-appointment .book-appointment-box .book-appointment-text p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.book-appointment .book-appointment-box .book-appointment-text .book {
    font-size: 15px;
    font-family: "Rubik";
    color: var(--Big-stone);
    font-weight: 700;
    margin-top: 24px;
    display: block;
}

.book-appointment .book-appointment-box:hover .book svg path:nth-child(1) {
    fill: var(--Torqoies-green);
}

.book-appointment .book-appointment-box:hover .book svg path:nth-child(2) {
    fill: var(--white);
    rotate: -30deg;
    transform-origin: center center;
    transition: all 0.2s linear;
}



.book-appointment .book-appointment-box .book-appointment-text svg {
    margin-left: 7px;
}

.book-appointment .book-box-bg-1 {
    background-color: #fdeded;
}

.book-appointment .book-box-bg-2 {
    background-color: #dde6f7;
}

.book-appointment .book-box-bg-3 {
    background-color: #fcf1de;
}

/* book-appointment end */

/* About me start css */

.box {
    max-width: max-content;
    max-height: 52px;
    background-color: #d7d1ef;
    border-radius: 5px;
    margin-bottom: 24px;
    padding: 7.5px 12px;
    gap: 12px;
    display: flex;
    width: 100%;
    margin: 0px auto 24px auto;
}

.box span {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    font-family: "Rubik";
    color: var(--Midnight-blue);
}

.about-me .box {
    margin: 0px 0px 22px 0;
}

.about-me .title-about {
    padding-bottom: 40px;
}

.about-me .title-about h2 {
    text-transform: capitalize;
    margin-bottom: 25px;
}

.feature-box .feature-box-move .feature-box-icon {
    background-color: #90d2ca;
    width: 100%;
    max-width: 80px;
    height: 80px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
}

.feature-box .feature-box-move {
    display: flex;
    gap: 20px;
    margin-bottom: 24px;

}

.feature-box .feature-box-content h4 {
    /* font-size: 22px; */
    font-family: "Sora";
    color: var(--Big-stone);
    margin-bottom: 8px;
    font-weight: 600;
}

.feature-box .feature-box-content p {
    width: 100%;
}

.about-images-box img {
    border-radius: 20px;
    margin-bottom: 15px;
}

.about-bg {
    position: absolute;
    right: -55px;
    top: 22px;
    opacity: .4;
}

.about-me .container {
    position: relative;
}

.about-me {
    position: relative;
}

.about-bg img {
    width: 270px;
    height: 270px;
}

.bloge .headings-title {
    margin-bottom: 24px;
}

/* About me end css */


/* About me slider css start */


.about-swiper {
    background-color: var(--Torqoies-green);
    padding-bottom: 100px;
    padding-top: 50px;
}

.about-swiper .swiper {
    padding-top: 50px;
}

.about-swiper .box {
    margin: 0px 0px 24px 0px;
    background: rgba(255, 255, 255, 0.1);
}

.about-swiper .box span {
    color: var(--white);
}

.creative-box {
    position: relative;
    overflow: hidden;
    height: 375px;
    border-radius: 16px;
}

.creative-box figure {
    margin: 0;
    width: 100%;
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
}

.creative-box img {
    display: block;
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
    transition: transform 0.6s ease-in-out;
    border-radius: 16px;
}

.creative-box:hover img {
    transform: scale(1.1);
}

/* text container */
.creative-text-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    padding: 55px 35px 20px 25px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.5);
    /* default semi-white */
    opacity: 1;
    visibility: visible;
    transition: background 0.4s ease-in-out, color 0.4s ease-in-out;
}

/* default text color */
.creative-text-box h4,
.creative-text-box p,
.creative-text-box a {
    color: var(--Big-stone);
}

/* hover overlay */
.creative-box:hover .creative-text-box {
    background: rgba(0, 0, 0, 0.2);
    /* semi-black overlay */
}

.creative-box:hover .creative-text-box :is(h4, p, a) {
    color: #fff;

}





.creative-box:hover .book svg path:nth-child(1) {
    fill: var(--white);
}

.creative-box:hover .book svg path:nth-child(2) {
    fill: var(--black);
    rotate: -30deg;
    transform-origin: center center;
    transition: all 0.2s linear;
}



.creative-box .creative-text-box .text-wrap h4 {
    font-family: "Sora";
    margin-bottom: 8px;
    font-weight: 700;
}

.creative-box .creative-text-box .text-wrap p {
    margin-bottom: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.creative-box .creative-text-box .text-wrap a {
    font-size: 15px;
    font-family: "Rubik";
    font-weight: 700;
    display: flex;
    align-items: center;
}

.creative-box .creative-text-box .text-wrap .book svg {
    margin-left: 12px;
}

.swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
    position: absolute;
    bottom: -50px;
}

.swiper.mySwiper.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    overflow: unset;
    overflow-x: clip;
}

.swiper-pagination-bullet {
    background-color: var(--white);
}

/* creative-collaborators end */
/* About me slider css end */
.welcome-ana {
    padding-top: 95px;
    padding-bottom: 50px;
}

.welcome-ana .box {
    margin: 0 0 24px 0;
}

.welcome-ana .title-about h2 {
    margin-bottom: 24px;
}

.welcome-ana-section {
    display: flex;
    /* align-items: center; */
    justify-content: space-between;
    padding-top: 48px;
    margin-bottom: 48px;
}

.welcome-ana-icon {
    background-color: #1d2033;
    width: 100%;
    max-width: 80px;
    height: 80px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-bottom: 15px;
}

.welcome-chaek-icon {
    padding-right: 12px;
}

.welcome-chaek-box .welcome-ana-box {
    display: flex;
    /* margin-right: 70px; */
    margin-bottom: 10px;
}

.welcome-chaek-box {
    display: block;
    padding-top: 20px;
}

.welcome-ana-bg-images {
    position: relative;
}

.image-1 {
    position: absolute;
    top: 0;
    right: 0;
    width: 312px;
    border-radius: 20px;
}

.image-2 {
    position: absolute;
    left: 100px;
    top: 180px;
    width: 325px;
    height: 380px;
    border-radius: 20px;
}

.image-3 {
    position: absolute;
    right: 30px;
    top: 430px;
}

.image-3 {
    transition: transform 0.3s ease;
}

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

.welcome-ana-section .welcome-ana-content h4 {
    font-weight: 600;
    color: var(--Big-stone);
    letter-spacing: 2px;
    min-height: 63px;
}

.welcome-ana .welcome-ana-box .welcome-ana-content p {
    min-height: 73px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.learn-more-btn {
    background-color: transparent;
    border: 1px solid #fff;
    color: #fff;
}

.learn-more-btn:hover {
    background-color: var(--white);
    border: 1px solid #fff;
    color: var(--Big-stone);
}

.learn-more-btn i {
    color: #fff !important;
}

.video-section .learn-more-btn:hover i {
    color: var(--Big-stone) !important;
}

/* Appointment foem  css start*/

.appointment-foem {
    background-color: var(--Big-stone);
    overflow: visible;
}

.appointment-foem .box {
    margin: 0px 0px 24px 0px;
    background-color: var(--white);
}

.appointment-foem .box span {
    color: var(--Big-stone);
}

.appointment-foem h2 {
    color: var(--white);
    margin-bottom: 50px;
}

.input-group-append {
    cursor: pointer;
}

.bg-blue {
    margin-top: -50px;
}

.appointment-foem .form-control {
    width: 100%;
    max-width: 100%;
    height: 56px;
    border-radius: 5px;
    margin-bottom: 30px;
}

.appointment-foem .form-select {
    width: 100%;
    max-width: 100%;
    height: 56px;
    border-radius: 5px;
    margin-bottom: 30px;
}

.datepicker {
    background: var(--white);
    padding: 8px 12px;
    border-radius: 6px;
    border: 1px solid #ddd;
    font-size: 16px;
    color: #212529A6 !important;
    outline: none;
    height: 56px;
    border-radius: 5px;
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    resize: none;
    line-height: inherit;
    word-break: normal;
    -webkit-transition: .3s;
    transition: .3s;
    text-align: left !important;
}

.form-control,
.form-select,
input,
select,
textarea {
    color: #212529A6 !important;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    resize: none;
    line-height: inherit;
    word-break: normal;
    -webkit-transition: .3s;
    text-align: left !important;
    font-size: 15px !important;
}

textarea {
    line-height: 40px !important;
    border-radius: 6px;
    padding: 10px;
}

.appointment-section .appointment-from textarea {
    line-height: 45px !important;
}

input[type="button"],
input[type="text"],
input[type="email"],
input[type="search"],
input[type="password"],
textarea,
input[type="submit"],
input[type="tel"],
input[type="date"],
input[type="time"] {
    -webkit-appearance: none;
    color: #212529A6 !important;
    text-align: left !important;
    justify-content: left !important;
    width: 100%;
    /* height: 100%; */
    font-size: 15px !important;
}


/* Universal fix for iOS Safari & Chrome */
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
    -webkit-appearance: none;
    appearance: none;
    text-align: left;
    /* fallback */
    direction: ltr;
    font-size: 16px;
    /* avoid zoom on focus */
    padding-left: 12px;
    color: #333;
}

/* iOS-specific inner wrapper */
input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit {
    text-align: left;
    padding: 0;
}

/* Ensure fields behave like other inputs */
input[type="date"].form-control,
input[type="time"].form-control,
input[type="datetime-local"].form-control {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 10px 12px;
    background: #fff;
    color: #333;
    box-sizing: border-box;
}


/* Base: force left alignment and remove iOS appearance */
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    text-align: left !important;
    text-align-last: left !important;
    direction: ltr !important;
    padding-left: 12px !important;
    /* visual spacing */
    box-sizing: border-box;
}

/* Target WebKit "datetime" pseudo-elements (iOS) */
input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit {
    display: block !important;
    text-align: left !important;
    padding-left: 12px !important;
}

/* Force the inner fields wrapper to align to start (not centered) */
input[type="date"]::-webkit-datetime-edit-fields-wrapper,
input[type="time"]::-webkit-datetime-edit-fields-wrapper,
input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper {
    display: flex !important;
    justify-content: flex-start !important;
    gap: 0.25rem;
}

/* Ensure each sub-field/text is left-aligned and doesn't add extra padding */
input[type="date"]::-webkit-datetime-edit-day-field,
input[type="date"]::-webkit-datetime-edit-month-field,
input[type="date"]::-webkit-datetime-edit-year-field,
input[type="date"]::-webkit-datetime-edit-text,
input[type="time"]::-webkit-datetime-edit-hour-field,
input[type="time"]::-webkit-datetime-edit-minute-field,
input[type="time"]::-webkit-datetime-edit-ampm-field,
input[type="time"]::-webkit-datetime-edit-text {
    text-align: left !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block !important;
}

/* iOS-only extra guard */
@supports (-webkit-overflow-scrolling: touch) {

    input[type="date"],
    input[type="time"],
    input[type="datetime-local"] {
        -webkit-appearance: none !important;
    }
}


.datepicker::-webkit-date-and-time-value {
    color: #212529A6 !important;
}

.form-control {
    text-align: left !important;
}

.appointment-foem .btn {
    width: 100%;
    max-width: 100%;
    height: 56px;
    border-radius: 5px;
    padding: 12px;
}

/* Appointment foem  css end*/

/* certifications css start*/
.headings-title {
    margin-bottom: 48px;
}

.label-title {
    margin-bottom: 12px;
}

.certifications .team-member-image img {
    border-radius: 20px;
    height: 300px;
}

.certifications .team-style .team-member-text h6 {
    font-size: 18px;
    font-family: "Sora";
    color: var(--Big-stone);
    margin-bottom: 24px;
    font-weight: 500;
    text-align: center;
    margin-top: 12px;
    line-height: 26px;
}

/* certifications css end*/

/* video-section css start */
.video-section {
    background-image: url(../images/old-retired-men-modern.jpg);
    background-size: cover;
    overflow: hidden;
    position: relative;
    background-position: center center;
}

.video-section-bg {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: #19B4A4;
    background: linear-gradient(90deg, rgba(25, 180, 164, 0.9) 0%, rgba(25, 180, 164, 0) 90%);
}

.video-section .welcome {
    background-color: #49bcae;
    max-width: max-content;
    max-height: 52px;
    border-radius: 5px;
    margin-bottom: 24px;
    padding: 7.5px 12px;
    gap: 12px;
    display: flex;
    width: 100%;
    margin: 0px auto 24px 0px;
}

.video-section .text-white {
    margin-bottom: 24px;
}

.video-section p {
    margin-bottom: 24px;
}

.video-section .hero-btn .btn-bg-pink {
    background-color: var(--white);
    color: var(--Big-stone);
}

.video-section .hero-btn .btn-bg-pink:hover {
    background-color: transparent;
    color: var(--Big-stone);
    border: 1px solid var(--white);
}

.video-section .hero-btn i {
    color: var(--Big-stone);
    margin-left: 12px;

}

.video-section .hero-btn .fa-arrow-right {
    transform: rotate(330deg);
}

.video-section .video-btn {
    margin-left: 40px;
    transition: transform 0.3s ease;
}

.video-section .video-btn img:hover {
    transform: scale(1.2);
    transition: transform 0.3s ease;
}

/* video-section css end */


/* Blog section css :start */


.bloge .card {
    /* max-width: 350px; */
    border: 0;
    overflow: hidden;
    width: 100%;
}

.bloge .card img {
    width: 100%;
    display: block;
    border-radius: 20px;
    height: 250px;
}

.bloge .card h4 {
    font-family: "Sora";
    color: var(--Big-stone);
    margin-bottom: 8px;
    font-weight: 700;
    width: 400px;
    /* Set a fixed width */
    white-space: nowrap;
    /* Prevent text from wrapping */
    overflow: hidden;
    /* Hide overflow text */
    text-overflow: ellipsis;
    /* Add "..." at the end */
}

.bloge .meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.bloge .meta i {
    color: var(--Torqoies-green);
    margin-right: 4px;
}

.bloge .card-content p {
    margin-bottom: 12px;
    margin-top: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bloge .card-content a {
    font-weight: 700;
    font-size: 15.5px;
    text-decoration: none;
    color: #162135;
    display: flex;
    align-items: center;
    gap: 6px;
}

.bloge .card-content:hover a svg path:nth-child(1) {
    fill: var(--Torqoies-green);
}

.bloge .card-content:hover a svg path:nth-child(2) {
    fill: var(--white);
    rotate: -30deg;
    transform-origin: center center;
    transition: all 0.2s linear;
}





.bloge .card-content a img {
    width: 20px;
    height: 20px;
}

/* Blog section css :end */


/* footer css start */
.opening-hours {
    padding-left: 50px;
}

footer {
    background-color: #172135;
    background-image: url(../images/Footer-bg\ .png);
    background-repeat: no-repeat !important;
    background-size: cover !important;
    overflow: hidden;
    position: relative;
    background-position: center center !important;
}

.footer-top {
    padding-top: 65px;
    border-bottom: 1px solid #ffffff1c;
    padding-bottom: 50px;
}

.contact-information {
    display: flex;
    gap: 20px;
    align-items: center;
}

.contact-information-icon {
    background-color: var(--Torqoies-green);
    width: 100%;
    max-width: 60px;
    height: 60px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    transition: all 0.7s ease;

}

.contact-information-icon:hover {
    background-color: var(--white);
    transition: all 0.7s ease;
}

.contact-information-icon:hover i {
    color: var(--Torqoies-green);
    transition: all 0.7s ease;
}

.contact-information-icon i {
    font-size: 22px;
    color: var(--white);
}

.contact-information-text p {
    font-size: 14px;
    line-height: 22px;
    color: var(--white);
    font-family: "Rubik";
    margin-bottom: 5PX;
}

.contact-information-text a {
    font-size: 18px;
    line-height: 24px;
    color: var(--white);
    font-family: "Rubik";
    font-weight: 600;
}

.contact-information-text a:hover {
    color: var(--Torqoies-green);
}

.footer-center {
    padding-top: 50px;
    padding-bottom: 58px;
}

.footer-center .social-media-post ul {
    display: flex;
    align-content: center;
    gap: 30px;
}

.footer-center .social-media-post ul li {
    background-color: var(--white);
    width: 100%;
    max-width: 42px;
    height: 42px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    transition: all 0.7s ease;
}

.footer-center .social-media-post ul li i {
    color: var(--Torqoies-green);
    font-size: 16px;
}

.footer-center .social-media-post ul li:hover i {
    color: var(--white);
    transition: all 0.7s ease;
}

.footer-center .social-media-post ul li:hover {
    background-color: var(--Torqoies-green);
    transition: all 0.7s ease;
}

.footer-center h5 {
    /* font-size: 20px; */
    font-family: "Sora";
    color: var(--white);
    font-weight: 700;
    margin-bottom: 15px;
}

.footer-center h5:before {
    content: "";
    border-bottom: 1px solid var(--white);
    left: 0;
    position: absolute;
    bottom: -15px;
    width: 30px;
    height: 2px;
}

footer .footer-center ul li {
    margin-bottom: 12px;
}


footer .footer-center ul li a {
    font-size: 16px;
    line-height: 24px;
    color: var(--white);
    font-family: "Rubik";
    font-weight: 400;
}

footer .footer-center ul li a:hover {
    color: var(--Torqoies-green);
}

footer .footer-center ul {
    list-style: none;
}

footer .footer-center ul {
    padding-top: 24px;
}

footer .footer-bottom {
    background-color: var(--white);
    border-radius: 20px 20px 0px 0px;
    padding: 30px 25px;
    display: flex;
    justify-content: space-between;
}

footer .footer-bottom ul {
    list-style: none;
    display: flex;
}

footer .footer-bottom ul li a {
    font-size: 16px;
    line-height: 24px;
    color: var(--Dark-gray);
    font-family: "Rubik";
    font-weight: 400;
}

footer .footer-bottom ul li a:hover {
    color: var(--Torqoies-green);
}

footer .right-line {
    width: 1px;
    height: 20px;
    background-color: var(--Dark-gray);
    margin: 0 20px;
}

footer .footer-bottom .footer-text a {
    font-size: 16px;
    line-height: 24px;
    color: var(--Dark-gray);
    font-family: "Rubik";
    font-weight: 400;
}

footer .footer-bottom .footer-text a:hover {
    color: var(--Torqoies-green);
}

footer .footer-bottom .footer-text {}

/* footer css end */


/* service-page css strat */

.breadcrumb {
    padding: 0px;
    margin-bottom: 0px;
    justify-content: center;
}

.breadcrumb ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    font-size: 16px;
    font-weight: 500;
}

.breadcrumb li a {
    font-family: "Rubik";
    font-weight: 500;
    font-size: 16px;
    color: var(--Big-stone);
    text-decoration: none;
    opacity: 1;
    transition: all 0.5s linear;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
}

.breadcrumb li.active {
    display: flex;
    align-items: center;
    color: var(--Torqoies-green)
}

.breadcrumb li+li::before {
    content: ">";
    margin: 0 10px 0px 5px;
    color: var(--Big-stone);
    opacity: 1;
}


.service-page {
    background: linear-gradient(to bottom, #d6d9ff, #ffffff);
}

.banner-section {
    width: 100%;
    height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: unset;
}

.out-side-icon-1 {
    position: absolute;
    right: 15%;
    top: -20px;
}

.out-side-icon-2 {
    position: absolute;
    top: 200px;
    left: -100px;
    opacity: .3;
}

.banner-content-part {
    padding-top: 100px;
}

.service-section .creative-box {
    margin-bottom: 24px;
}


.service-video {
    padding-top: 26px;
    padding-bottom: 50px;
}

.service-video h2 {
    margin: 24px 0;
}

.service-img img {
    border-radius: 20px;
}

.service-btn {
    background-color: var(--white);
    width: 100%;
    max-width: 100px;
    height: 100px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

}


.service-video span {
    background-color: #ebebf7;
    border-radius: 5px;
    padding: 12px 8.5px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    font-family: "Rubik";
    color: var(--Midnight-blue);
    margin: 0px;
}

.service-video span img {
    margin-right: 12px;
}





.subscribe-section {
    background: #00b3a4;
    padding: 20px 100px 100px 100px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.subscribe-section .subscribe-form {
    margin-top: 210px !important;
    align-items: center;
    background: white;
    padding: 6px;
    border-radius: 8px;
    z-index: 1;
    max-width: 500px;
    flex: 1;
}

.subscribe-form {
    position: relative;
}

.subscribe-section .subscribe-box {
    display: flex;
    position: relative;
}

.mc4wp-form {
    height: 49px;
}

.subscribe-section .arrow {
    position: absolute;
    right: -250px;
    top: 40px;
}

.subscribe-section .subscribe-text h2 {
    margin-bottom: 24px;
}

.mc4wp-form-fields {
    display: flex;
    justify-content: space-between;
}

.mc4wp-alert.mc4wp-success {
    position: relative;
    bottom: -10px;
}

.mc4wp-alert.mc4wp-notice {
    position: relative;
    bottom: -10px;
}

.mc4wp-alert.mc4wp-error {
    position: relative;
    bottom: -10px;
}

.subscribe-section .subscribe-form {
    /* display: flex; */
    align-items: center;
    background: white;
    padding: 6px;
    border-radius: 8px;
    z-index: 1;
    max-width: 500px;
    flex: 1;
}

.subscribe-section .subscribe-form input {
    flex: 1;
    border: none;
    outline: none;
    padding: 12px;
    font-size: 14px;
    border-radius: 6px;
}

.subscribe-section .subscribe-form button {
    background: var(--Big-stone);
    color: var(--white);
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: 0.3s;
}

.subscribe-section .subscribe-form button:hover {
    background: #374151;
}

/* service-page css end */



/* service-detail start */
.service-detail .categories-box {
    background-color: #FFF5F5;
    border-radius: 20px;
    border: 1px solid #F3F3F3;
    padding: 30.8px;
    position: relative;
}

.service-detail {
    padding-bottom: 75PX;
}

.service-detail-form {
    padding-bottom: 75PX;
}

.service-detail .categories-box h4 {
    color: #0C193E;
}

.service-detail .categories-heading {
    padding-top: 25px;
}

.service-detail .categories-box h4:before {
    content: "";
    border-bottom: 1px solid var(--black);
    left: 30px;
    position: absolute;
    top: 70px;
    width: 30px;
    height: 2px;
}

.service-detail .nav-pills .nav-link.active {
    background-color: var(--Torqoies-green);
    color: var(--white)
}

.service-detail .nav-pills .nav-link {
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    padding: 15px 18px;
    margin-bottom: 15px;
    text-transform: capitalize;
}

.service-detail .categories {
    display: flex;
    justify-content: space-between;
}

.service-detail .feature-service .feature-service-images img {
    border-radius: 20px;
}

.service-detail .feature-service .feature-service-images {
    margin-bottom: 24px;
}

.service-detail .feature-service .feature-service-text h3 {
    margin-bottom: 24px;
    color: #0C193E;
    font-weight: 600;

}

.service-detail .mobile-tab-box .form-select {
    margin-top: 35px;
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    padding: 15px 18px;

    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.service-detail .mobile-tab-box .form-select:focus {
    box-shadow: none;
    outline: none;
    border: 0;
}

.service-detail .feature-service .feature-service-video {
    padding-top: 25px;
    display: flex;
    gap: 25px;
}

.service-detail .feature-service .feature-service-video .feature-images img {
    border-radius: 20px;
}


.service-detail .feature-service .feature-service-video .feature-box-video-btn {
    background-color: var(--white);
    width: 100%;
    max-width: 100px;
    height: 100px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.service-detail .feature-service .feature-chaek-box .feature-box {
    display: flex;
    align-items: center;
    margin-left: 0;
    margin-bottom: 18px;
}

.service-detail .feature-service .feature-chaek-box .feature-box .feature-chaek-box-icon {
    margin-right: 10px;
}

.service-detail .feature-service .feature-chaek-box {
    padding-top: 24px;
}

.service-detail .feature-service .feature-chaek-box h4 {
    color: #0C193E;
    font-weight: 600;
    margin-bottom: 24px;
}

.service-detail .categories-box .download-box {
    display: flex;
    align-items: center;
}

.service-detail .categories-box .download-box .download-icon {
    /* background-color: #FFF5F5;
    width: 100%;
    max-width: 52px;
    height: 52px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px; */
}

.service-detail .categories-box .download-box .download-icon img {
    background-color: #FFF5F5;
    width: 100%;
    max-width: 52px;
    height: 52px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px;
}

.single-portfolio .single-portfolio-box .download-icon img {
    background-color: #FFF5F5;
    width: 100%;
    max-width: 70px !important;
    height: 70px !important;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px;
}

.single-portfolio .single-portfolio-box {
    background-color: #F9F9FF;
}


.service-detail .download-section {
    margin: 30px 0;
    background-color: #F9F9FF;
}

.service-detail .needs-any-help {
    background-color: var(--Torqoies-green);
}

.service-detail .needs-any-help .needs-any-help-heading h4 {
    color: var(--white);
    font-weight: 600;
}

.service-detail .needs-any-help .needs-any-help-heading p {
    color: var(--white);
    margin-bottom: 32px;
    max-width: 90%;
}

.download-box-bottom {
    margin-bottom: 20px;
}

.service-detail .accordion .accordion-item .accordion-header .categories {
    justify-content: space-between;
}

.service-detail .needs-any-help .needs-any-box {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.service-detail .needs-any-help .needs-any-box .needs-any-box-icon {
    background-color: var(--white);
    width: 100%;
    max-width: 52px;
    height: 52px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px;
}

.service-detail .needs-any-help .needs-any-help-heading h4::before {
    border-bottom: 1px solid var(--white);
}

.service-detail .needs-any-help .needs-any-box .needs-any-text-sub .text-small {
    color: var(--white);
    margin-bottom: 5px;
}

.service-detail .needs-any-help .needs-any-box .needs-any-text-sub h6 {
    color: var(--white);
}


/* service-detail end */


/* about-section start css */
.about-section {
    padding-bottom: 50px;
}

.about-section h2 {
    margin-bottom: 24px;
}

.about-section .box {
    margin: 0px auto 24px 0;
}

.about-section .box span {
    color: var(--Big-stone);
}

.about-section .about-me-box-bottom .about-me-box-text h4 {
    color: var(--Big-stone);
    margin-bottom: 12px;
}

.about-section .about-me-box-bottom .about-me-box-images {
    display: flex;
    gap: 20px;
    margin-bottom: 24px;
}

.about-section .about-me-box-bottom .about-me-box-images .download-icon {
    background-color: #F9F9FF;
    width: 100%;
    max-width: 80px;
    height: 80px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
}

.about-section .about-me-box-bottom .about-me-box-images .download-icon img {
    max-width: 50px;
}

.counter-section #counter {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--Big-stone);
    padding: 75px 80px;
    width: 100%;
    border-radius: 20px;
}

.counter-section #counter .item .count {
    color: var(--white);
    margin-bottom: 5px;
    font-size: 62px;
    line-height: 68px;
    font-weight: 600;
    font-family: "Sora";
}

.counter-section #counter .item h6 {
    color: var(--white);
    font-family: "Sora";
    font-size: 19px;
    line-height: 28px;
    font-weight: 400;
}

.counter-section {
    padding-bottom: 50px;
}

.testimonials-card {
    background-color: #F9F9FF;
    border-radius: 25px;
    border: 1px solid #F3F3F3;
    padding: 20px;

}

.testimonials-card .testimonials-card-images img {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.testimonials-card .testimonials-social-icon {
    display: flex;
    justify-content: space-between;
    margin-bottom: 28px;
}

.testimonials-card .testimonials-social-icon .auther-icon {
    margin-right: -17px;
}

.testimonials-card .testimonials-social-icon ul {
    list-style: none;
    display: flex;
    gap: 5px;
}

.testimonials-card .testimonials-social-icon ul li {
    background-color: var(--Torqoies-green);
    width: 26px;
    height: 26px;
    align-items: center;
    justify-content: center;
    display: flex;
}

.testimonials-card .testimonials-social-icon ul li i {
    color: var(--white);
}

.testimonials-card .testimonials-card-text {
    margin-bottom: 21px;
}

.testimonials-card .testimonials-card-text h6 {
    color: var(--Big-stone);
    font-weight: 600;
}

.about-testimonials .testimonials-card .testimonials-card-text p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.testimonials-card .testimonials-card-name {
    display: flex;
    align-items: center;
    gap: 5px;
}

.testimonials-card .testimonials-card-holer .name {
    font-family: "Sora";
    font-size: 16px;
    line-height: 25.6px;
    font-weight: 600;
    color: var(--Big-stone);
}

.testimonials-card .testimonials-card-holer .sub-name {
    font-size: 16px;
    line-height: 25.6px;

}

.about-testimonials .swiper-pagination-bullet {
    background-color: #000000 !important;
    width: 7px;
    height: 7px;
    margin: 0px 7px !important;
    opacity: 1 !important;
}

.about-testimonials .swiper-pagination-bullet-active {
    width: 7px;
    height: 7px;
    outline: 1px solid #000;
    outline-offset: 5px;

}

.about-testimonials .swiper.testimonials.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    overflow: unset;
    overflow-x: clip;

}

.about-testimonials .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
    position: absolute;
    bottom: -50px;
}

.service-video-about {
    padding-bottom: 100px;
}

/* about-section end css */
.appointment-section {
    padding-bottom: 50px;
}

.appointment-section .appointment-from .btn {
    padding: 13px 70px;
    max-width: fit-content;
    margin-top: 15px;
}

.error-message {
    color: red;
    font-size: 13px
}

.contact-pages .btn-bg-pink {
    max-width: fit-content;
}

.appointment-section .appointment-from {
    background-color: var(--Big-stone);
    border-radius: 20PX;
    padding: 30PX;
    position: relative;
}

.appointment-section .appointment-from h4 {
    color: var(--white);
    margin-bottom: 25px;
}

.appointment-section .appointment-from h4::before {
    content: "";
    border-bottom: 1px solid var(--white);
    left: 30px;
    position: absolute;
    top: 65px;
    width: 30px;
    height: 2px;

}

.appointment-section .appointment-from .form-control {
    background-color: var(--white);
    border-radius: 5px;
    color: var(--Big-stone);
    height: 60px;
    margin-bottom: 15px;
}

.appointment-section .appointment-from .form-select {
    background-color: var(--white);
    border-radius: 5px;
    color: var(--Big-stone);
    height: 60px;
    margin-bottom: 15px;
}

.appointment-section .appointment-from .datepicker {
    background-color: var(--white);
    border-radius: 5px;
    color: var(--Big-stone);
    height: 60px;
    margin-bottom: 15px;
    width: 100%;
}

.appointment-section .appointment-datepiker .datepicker {
    width: 100%;
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    height: 100%;
    box-shadow: 3px 12px 24px rgba(0, 0, 0, 0.05);
}

.appointment-section .appointment-datepiker .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 36px;
}

.appointment-section .appointment-datepiker .header h6 {
    font-size: 18px;
    font-weight: 600;
    color: var(--Big-stone);
}

.appointment-section .appointment-datepiker .dropdowns {
    display: flex;
    gap: 8px;
}

.appointment-section .appointment-datepiker .datepicker .calendar {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: var(--Big-stone);
}

.appointment-section .appointment-datepiker select {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: "Rubik";
    border: 1px solid #D4D4D4;
    padding: 6px 12px;
    border-radius: 8px;
    background: var(--Torqoies-green);
    color: var(--white);
    cursor: pointer;
}

.appointment-datepiker .datepicker .dropdowns select {
    color: var(--white) ! IMPORTANT;
    font-family: 'Rubik';
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;

}

.appointment-section .appointment-datepiker .calendar {
    text-align: center;
}

.appointment-section .appointment-datepiker h3 {
    margin-bottom: 32px;
    color: var(--Big-stone);
    font-weight: 600;
}

.appointment-section .appointment-datepiker .month-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.appointment-section .appointment-datepiker .month-nav button {
    border: none;
    background: var(--white);
    border-radius: 8px;
    padding: 6px 10px;
    cursor: pointer;
    border: 1px solid #D4D4D4;
}

.appointment-section .appointment-datepiker table {
    width: 100%;
    border-collapse: collapse;
    height: 390px;
}

.appointment-section .appointment-datepiker th {
    color: var(--Dark-gray);
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    padding: 10px;
}

.appointment-section .appointment-datepiker td {
    padding: 10px;
    cursor: pointer;
    border-radius: 8px;
    transition: 0.3s;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    padding: 10px;
    color: var(--Dark-gray);
}

.online-video-call {
    padding-top: 50px;
    overflow: visible;
    padding-bottom: 72px;
}

.appointment-section .appointment-datepiker td:hover {
    /* background: #eafaf8; */
}

.appointment-section .appointment-datepiker .disabled {
    color: #ccc;
    pointer-events: none;
}

.appointment-section .appointment-datepiker .selected {
    background: #00bfa6;
    color: #fff;
    font-weight: bold;
}

.appointment-section .appointment-datepiker .highlight {
    background: #fdeeee;
    color: #d9534f;
}

.appointment-section .appointment-datepiker .maim-datepiker {
    background: #f9f9f9;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.appointment-download-box {
    border-radius: 20px;
    border: 1px solid #F3F3F3;
    padding: 30.8px;
    position: relative;
    background-color: #F9F9FF;
}

.appointment-download-box h4:before {
    content: "";
    border-bottom: 1px solid var(--black);
    left: 30px;
    position: absolute;
    top: 70px;
    width: 30px;
    height: 2px;
}

.appointment-download-box .categories-heading {
    padding-top: 25px;
}

.appointment-download-box .download-box-bottom {
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    padding: 15px 18px;
}

.appointment-download-box .download-box .download-icon {
    background-color: #FFF5F5;
    width: 100%;
    max-width: 52px;
    height: 52px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px;
}

.appointment-download-box .download-box {
    display: flex;
    align-items: center;
}


.feature-chaek-box h4 {
    color: #0C193E;
    font-weight: 600;
    margin-bottom: 24px;
}

.feature-chaek-box .feature-box {
    display: flex;
    align-items: center;
    margin-left: 0;
    margin-bottom: 18px;
}

.feature-chaek-box .feature-box .feature-chaek-box-icon {
    margin-right: 10px;
}

.appointment-need-any-help {
    background-color: var(--Torqoies-green);
    border-radius: 20px;
    display: flex;
    padding: 30px 30px 0 30px;
    position: relative;
}

.appointment-need-any-help .needs-any-help-heading h4 {
    color: var(--white);
}

.appointment-need-any-help .needs-any-help-heading h4:before {
    content: "";
    border-bottom: 1px solid var(--white);
    left: 50px;
    position: absolute;
    top: 65px;
    width: 30px;
    height: 2px;
}

.appointment-need-any-help .needs-any-help-heading p {
    color: var(--white);
    max-width: 80%;
    margin-bottom: 32px;
    margin-top: 28px;
}

.appointment-need-any-help .needs-any-box {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.appointment-need-any-help .needs-any-box .needs-any-box-icon {
    background-color: #FFF5F5;
    width: 100%;
    max-width: 52px;
    height: 52px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px;
}

.appointment-need-any-help .needs-any-box .needs-any-text-sub .text-small {
    color: var(--white);
    margin-bottom: 5px;
}

.appointment-need-any-help .needs-any-box .needs-any-text-sub h6 {
    color: var(--white);
}

.appointment-need-any-help .need-help-video .need-help-video-icon {
    background-color: #FFF5F5;
    width: 100%;
    max-width: 82px;
    height: 82px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px;
}

.appointment-need-any-help .needs-any-help {
    margin-bottom: 30px;
}

.appointment-need-any-help .need-help-video {
    display: flex;
    padding-top: 35px;
}

.appointment-need-any-help .need-help-video h2 {
    color: var(--white);
}

.appointment-need-any-help .needs-any-images {
    margin-top: -89px;
}

.appointment-need-any-help .need-help-video .need-help-video-arrow {
    position: absolute;
    left: 200px;
    bottom: 100px;
}

.appointment-need-any-help .need-help-video-text {
    position: relative;
}

.appointment-need-any-help .needs-any-images img {
    max-width: 100%;
    max-height: 100%;
}

/* testimonials css start */
/* .testimonial-pages .testimonials-card {
    margin-bottom: 68px;
} */
.testimonial-pages .container .row-cols-1 .col {
    margin-bottom: 68px;
}

.testimonial-pages .testimonials-card {
    height: 100%;
}

.testimonial-pages .pagination-section {
    padding-bottom: 100px;
}

.service-video .testimonial {
    margin-bottom: 20px;
}

.testimonial-video {
    padding: 100px 0;
}

/* testimonials css end */


/* portfolio css start */

.portfolio-page .box {
    margin: 0px 0px 24px 0;

}

.portfolio-page .box span {
    color: var(--Big-stone);
}

.portfolio-page h2 {
    margin-bottom: 24px;
}

.portfolio-page h4 {
    margin-bottom: 12px;
    font-weight: 600;
}

.text-color {
    color: var(--Big-stone);
    font-weight: 600;
}


.portfolio-page .portfolio-hover-box .card {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    cursor: pointer;
    margin-bottom: 30px;
}

.portfolio-page {
    padding-bottom: 70px;
}

.portfolio-page .portfolio-hover-box {
    padding-top: 50px;
}

.portfolio-page-service-video {
    padding-bottom: 100px;
}

.portfolio-page .portfolio-hover-box .card img {
    width: 744px;
    height: 360px;
    display: block;
    /* object-fit: cover; */
    transition: transform 0.7s ease;
}

.portfolio-page .portfolio-hover-box .card:hover img {
    transform: scale(1.1);
}

.portfolio-page .portfolio-hover-box .card .overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--white);
    color: #333;
    padding: 22px 19px;
    opacity: 0;
    transform: translateY(100%);
    transition: all 0.7s ease;
    border-radius: 25px;
    margin: 15px;

}

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

.portfolio-page .portfolio-hover-box .overlay h3 {
    font-size: 18px;
    margin-bottom: 8px;
}

.portfolio-page .portfolio-hover-box .overlay p {
    font-size: 14px;
    line-height: 1.4;
    color: #666;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.related-portfolio .portfolio-slide .swiper-slide img {
    border-radius: 25px;
    height: 100%;
}


.related-portfolio .portfolio-slide .swiper-pagination-bullet {
    background-color: #000000 !important;
    width: 7px;
    height: 7px;
    margin: 0px 7px !important;
    opacity: 1 !important;
}

.related-portfolio .portfolio-slide .swiper-pagination-bullet-active {
    width: 7px;
    height: 7px;
    outline: 1px solid #000;
    outline-offset: 5px;

}

.related-portfolio .portfolio-slide.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    overflow: unset;
    overflow-x: clip;

}

.related-portfolio .portfolio-slide .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
    position: absolute;
    bottom: -50px;
}


.portfolio-detail .categories-text {
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    text-transform: capitalize;
}

.service-detail .categories-box .download-box {
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    padding: 15px 15px;
    margin-bottom: 15px;
    text-transform: capitalize;
}

.service-detail .categories-box .categories-text {
    max-width: 270px;
}

.portfolio-detail .categories {
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    padding: 15px 15px;
    margin-bottom: 15px;
    text-transform: capitalize;
}

.portfolio-detail .download-text {
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    text-transform: capitalize;

}





/* Mobile adjustment */
@media (max-width: 600px) {
    .portfolio-page .portfolio-hover-box .overlay {
        opacity: 1;
        transform: translateY(0);
    }

    .portfolio-page .portfolio-hover-box .card:hover img {
        transform: none;
    }
}

/* portfolio css end */


/* FAQ css start */
.accordion-button {
    background-color: #fff;
    color: #000;
    position: relative;
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
    font-family: "Sora";
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.accordion-item {
    margin-bottom: 25px;
    box-shadow: 0 0px 20px rgba(0, 0, 0, 0.05);
    border: none;
    border-radius: 10px;
}

.accordion-item .accordion-body p {
    color: var(--white);
    line-height: 24px;
    font-weight: 400;
    font-family: "Rubik";
}

.accordion-item .accordion-body {
    background-color: var(--Big-stone);
    border-radius: 0px 0px 10px 10px;
}

.accordion-button:not(.collapsed) {
    background-color: #162135;
    color: #fff;
    border-radius: 10px 10px 0px 0px;
    border-bottom: 0.8px solid #f3f3f3;
    box-shadow: none;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-button .icon {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
}

.accordion-button::after {
    display: none;
}


.accordion-button .icon::before {
    content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='currentColor' class='bi bi-eye-slash-fill' viewBox='0 0 16 16'><path d='m10.79 12.912-1.614-1.615a3.5 3.5 0 0 1-4.474-4.474l-2.06-2.06C.938 6.278 0 8 0 8s3 5.5 8 5.5a7 7 0 0 0 2.79-.588M5.21 3.088A7 7 0 0 1 8 2.5c5 0 8 5.5 8 5.5s-.939 1.721-2.641 3.238l-2.062-2.062a3.5 3.5 0 0 0-4.474-4.474z'/><path d='M5.525 7.646a2.5 2.5 0 0 0 2.829 2.829zm4.95.708-2.829-2.83a2.5 2.5 0 0 1 2.829 2.829zm3.171 6-12-12 .708-.708 12 12z'/></svg>");
}



.accordion-button:not(.collapsed) .icon::before {
    content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='white' class='bi bi-eye-fill' viewBox='0 0 16 16'><path d='M10.5 8a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0'/><path d='M0 8s3-5.5 8-5.5S16 8 16 8s-3 5.5-8 5.5S0 8 0 8m8 3.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7'/></svg>");
}


.form-control:focus {
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border-color: #D3D3D3;
    outline: 0;
    box-shadow: none;
}

.form-control {
    height: 56px;
}

.faq-sarch-bar {
    position: relative;
    margin-bottom: 30px;
}

.faq-sarch-bar img {
    position: absolute;
    top: 20px;
    right: 20px;
}

.faq-section .heading-faq h2 {
    margin-bottom: 50px;
}

.faq-section .box span {
    color: #035E58;
}

.faq-section .box {
    background-color: #e7e8e7;
}

.faq-video {
    padding: 100px 0;
}

/* FAQ css end */


/* consultancy css start */
.consultancy .consultancy-box h3 {
    color: var(--Big-stone);
    padding: 24px 0;
}

/* consultancy css end */
/* privacy-policy css start */

/* 
body {
    position: relative;
} */

.sidebar {
    position: sticky;
    top: 100px;
    /* adjust so it stays below your fixed header */
}

.scroll-spys {
    overflow: unset;
}

.scrollspy-example {
    position: relative;
    height: 100%;
    overflow-y: auto;
}

/* Sidebar sticky */
.sidebar {
    position: sticky;
    top: 150px;
    /* push below your fixed header */
    max-height: calc(100vh - 150px);
    overflow-y: unset;
}

/* Sections styling for demo */
.content-text {
    padding: 25px 0px;
    border-bottom: 1px solid #ddd;
}

.scroll-spys.privacy-policy .nav-pills .nav-link.active {
    background-color: var(--Torqoies-green);
    color: var(--white);
}

.scroll-spys.privacy-policy .nav li {
    margin-bottom: 15px;
}

.scroll-spys.privacy-policy .nav li a {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    font-family: "Rubik";
    color: var(--black);
    max-width: 300px;
}

.privacy-policy h4:before {
    content: "";
    border-bottom: 1px solid var(--black);
    left: 15px;
    position: absolute;
    bottom: -15px;
    width: 30px;
    height: 2px;
}

.scroll-spys.privacy-policy .nav {
    padding-top: 42px;
}

.privacy-policy .position-relative {
    padding-left: 15px;
}

.privacy-policy .position-relative h4 {
    color: #0C193E;
    font-weight: 600;
}

.privacy-policy .content-text .consultancy-box h3 {
    color: #0C193E;
    font-weight: 600;
    padding: 24px 0;
}

/* privacy-policy css end */





html .njs-sticky-side.image_button_cover.placement-right {
    right: 0;
}

html .njs-sticky-side.image_button_cover {
    position: fixed;
    top: 50%;
    box-shadow: none;
    z-index: 99999;
    transition: transform 0.3s cubic-bezier(0, 0, 0, 1);
    -webkit-transition: -webkit-transform 0.3s cubic-bezier(0, 0, 0, 1);
}

html .njs-sticky-side.image_button_cover.placement-right.now-show a {
    transform: translate3d(4px, 0, 0) rotate(-90deg);
    -webkit-transform: translate3d(4px, 0, 0) rotate(-90deg);
}

html .njs-sticky-side.image_button_cover.placement-right a {
    border-radius: 10px 10px 0 0;
    transform: translate3d(200%, 0, 0) rotate(-90deg);
    -webkit-transform: translate3d(200%, 0, 0) rotate(-90deg);
    transform-origin: 100% 100%;
    -webkit-transform-origin: 100% 100%;
}

html .njs-sticky-side.image_button_cover a {
    padding: 6px 15px 12px;
    font-size: 16px;
    font-weight: 400;
    display: inline-block;
    position: relative;
    transition: transform 0.3s;
    -webkit-transition: -webkit-transform 0.3s;
    background-color: var(--Torqoies-green);
    color: white;
    font-weight: 400;
    top: -106.5px;
}

html .njs-sticky-side.image_button_cover a:hover {
    background-color: white;
    color: black;
    border: 2px solid #acacac;
}


/* pagination-section css start */

.pagination-section {
    padding-bottom: 41px;
}

.pagination-section .page-link {
    border: 1px solid #DFE3E8;
    border-radius: 4px;
    color: var(--Big-stone);
}

.pagination-section .pagination {
    gap: 8px;
}

.pagination-section .pagination .active {
    background-color: var(--Torqoies-green);
    color: var(--white);
    border: var(--Torqoies-green);
}

.pagination-section .pagination .active .page-link {
    background-color: var(--Torqoies-green);
    color: var(--white);
    border: var(--Torqoies-green);
}

.pagination-section .page-link:focus {
    z-index: 3;
    color: var(--bs-pagination-focus-color);
    background-color: transparent;
    outline: 0;
    box-shadow: none;
}

.pagination-section .pagination li i {
    color: var(--Big-stone);
}

/* pagination-section css end */



/* education CSS start */
.education-section .select-education-box {
    margin-bottom: 46px;
}

.education-section .select-education-box .form-select {
    background-color: var(--Torqoies-green);
    color: var(--white) !important;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.15px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23fff' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px;
    height: 36px;
}

.education-section .card {
    position: relative;
    margin-bottom: 24px;
}

.education-section .top-bar .tag-bar {
    position: absolute;
    top: 45px;
    left: 45px;
    background-color: var(--Torqoies-green);
    border-radius: 20px;
    padding: 5px 10px;
    align-items: center;
    justify-content: center;
    display: flex;
    gap: 5px;
    cursor: pointer;

}

.education-section .top-bar .tag-time {
    position: absolute;
    top: 220px;
    right: 45px;
    background-color: var(--Torqoies-green);
    border-radius: 20px;
    padding: 5px 10px;
    align-items: center;
    justify-content: center;
    display: flex;
    gap: 5px;
}

.education-section .card {
    border: 0;
    overflow: hidden;
    width: 100%;
    box-shadow: 0px 0px 70px 0px #0000000D;
    padding: 24px;
    border-radius: 20px;

}

.education-section .card .top-bar i {
    font-size: 18px;
}

.education-section .card .top-bar span {
    font-family: 'Rubik';
    font-weight: 500;
    font-size: 16px;
    line-height: 0px;
    color: var(--white);
}

.education-section .card img {
    width: 100%;
    display: block;
    margin-bottom: 24px;
    border-radius: 20px;
    min-height: 245px;
    object-fit: cover;

}

.education-section .card h4 {
    font-family: "Sora";
    color: var(--Big-stone);
    margin-bottom: 0px;
    font-weight: 700;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.education-section .modal-content .modal-body .card-content p {
    margin-bottom: 12px;
    margin-top: 24px;
    display: block;
}

.education-section .meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.education-section .meta i {
    color: var(--Torqoies-green);

}

.education-section .card-content p {
    margin-bottom: 12px;
    margin-top: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;


}

.education-section .card-content a {
    font-weight: 700;
    font-size: 15.5px;
    text-decoration: none;
    color: #162135;
    display: flex;
    align-items: center;
    gap: 6px;
}

.education-section .card-content a img {
    width: 20px;
    height: 20px;
}

.education-section .ratio::before {
    padding-top: 100%;
}

.education-section .modal-body .video-modal-section {
    padding: 25px;
    background-color: #E5E7FF;
}

/* .education-detail .categories-box .download-box .download-icon {} */

/* education CSS end */


/* education datile css start */

.education-detail .feature-service-images {
    position: relative;
    margin-bottom: 25px;
}

.education-detail .tag-bar {
    position: absolute;
    bottom: 25px;
    left: 25px;
    background-color: var(--Torqoies-green);
    border-radius: 20px;
    padding: 5px 10px;
    align-items: center;
    justify-content: center;
    display: flex;
    gap: 5px;

}

.education-detail .tag-bar span {
    font-family: 'Rubik';
    font-weight: 500;
    font-size: 16px;
    line-height: 0px;
    color: var(--white);
}

.education-detail .feature-service .meta {
    display: flex;
    gap: 12px;
}

.education-detail .feature-service .meta span {
    font-family: 'Rubik';
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: #525252;
}

.education-detail .feature-service .meta i {
    color: var(--Torqoies-green);
}

.education-detail .feature-service-text h3 {
    font-family: 'Sora';
    font-weight: 700;
    color: #0C193E;
    margin-bottom: 24px;
    margin-top: 15px;
}

.education-detail .educational-images-box {
    display: flex;
    gap: 27px;
    margin-bottom: 24px;
}

.education-detail .feature-chaek-box h3 {
    color: #0C193E;
    margin-bottom: 24px;
    margin-top: 15px;
}

.education-detail .categories-box {
    background-color: #FFF5F5;
    border-radius: 20px;
    border: 1px solid #F3F3F3;
    padding: 30.8px;
    position: relative;
}

.education-detail .education-sarch-box {
    background-color: #FFF5F5;
}

.education-detail .education-blog {
    background-color: #F9F9FF;
    /* margin: 30px 0; */
}

.education-detail .education-help {
    background-color: var(--Torqoies-green);
    margin: 30px 0;
}

.education-detail .categories-box h4 {
    color: #0C193E;
}

.education-detail .categories-box h4:before {
    content: "";
    border-bottom: 1px solid var(--black);
    left: 30px;
    position: absolute;
    top: 70px;
    width: 30px;
    height: 2px;
}

.education-detail .search-box {
    padding-top: 25px;
}

.education-detail .search-box .form-control {
    height: 80px;
}

.education-detail .search-box .search-bar {
    position: relative;
}

.education-detail .search-box .search-bar i {
    position: absolute;
    top: 15px;
    right: 15px;
    background-color: #FFF5F5;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--Torqoies-green);

}

.education-detail .download-box {
    display: flex;
    align-items: center;
    gap: 15px;

}

.education-detail .download-icon {
    width: 100%;
    max-width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;

}

.education-detail .download-icon img {
    border: 2px solid var(--Torqoies-green);
    border-radius: 50%;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: cover;
}

.education-detail .education-blog .download-box-bottom {
    background-color: var(--white);
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--black);
    border-radius: 5px;
    padding: 15px 18px;
    text-transform: capitalize;
    /* margin-bottom: 0; */
}

.education-detail .education-blog .categories-heading {
    padding-top: 30px;
}

.education-detail .download-text {
    font-family: 'Rubik';
    font-weight: 600;
    font-size: 16px;
    color: var(--Big-stone);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.education-detail .meta i {
    color: var(--Torqoies-green);
}

.education-detail .meta span {
    font-family: 'Rubik';
    font-weight: 400;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--Dark-gray);
}

.education-detail .education-help p {
    color: var(--white);
    margin-bottom: 32px;
    max-width: 90%;
    padding-top: 28px;
}

.needs-any-box {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.education-detail .needs-any-help-heading h4 {
    font-family: 'Sora';
    font-weight: 600;
    font-size: 22px;
    line-height: 30.8px;
    color: var(--white);
}

.education-detail h4:before {
    /* border-bottom: 1px solid var(--white) !important; */
}

.education-detail .needs-any-box-icon {
    background-color: var(--white);
    width: 100%;
    max-width: 52px;
    height: 52px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin-right: 20px;
}

.education-detail .needs-any-help-heading h4:before {
    border-bottom: 1px solid var(--white) !important;
}

.education-detail .mobile-open .line {
    height: 2px;
    width: 30px;
    background-color: #000;
    display: block;
}

.education-detail .text-small {
    color: var(--white);
    margin-bottom: 5px;
}

.education-detail .needs-any-text-sub h6 {
    color: var(--white);
}

.education-detail .needs-any-box {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.modal-dialog .card-content {
    max-height: 380px;
    /* adjust height as per your design */
    overflow-y: auto;
    /* vertical scroll */
    overflow-x: hidden;
    /* no horizontal scroll */
    padding-right: 8px;
    /* to avoid text hiding behind scrollbar */
}

/* Optional: custom scrollbar styling */
.modal-dialog .card-content::-webkit-scrollbar {
    width: 6px;
}

.modal-dialog .card-content::-webkit-scrollbar-thumb {
    background: #cecccc;
    /* scrollbar color */
    border-radius: 4px;
}

.modal-dialog .card-content::-webkit-scrollbar-track {
    background: #F4F0F7;
    /* track background */
}

.mobile-open {
    display: none;
}

.education-detail .education-sarch-box h4:before {
    content: "";
    border-bottom: 1px solid var(--black);
    left: 30px;
    position: absolute;
    top: 70px;
    width: 30px;
    height: 2px;
}

.modal .modal-body .badge {
    background-color: var(--Torqoies-green) !important;
    font-family: 'Rubik';
    font-weight: 500;
    font-size: 16px;
    line-height: 25.6px;
    color: var(--white);
    border-radius: 20px;
    width: max-content;
}

/* education datile css end */

.thank-you-section {
    padding-top: 200px !important;
}

/* .form-group {
    position: relative;
    display: flex;
    flex-direction: column;
} */
/* education datile css end */
.appointment-foem .from .form-group {
    position: relative;
}

.appointment-foem .from .error-message {
    position: absolute;
    bottom: 8px;
    color: red;
    font-size: 13px;
}

.appointment-section .appointment-from .error-message {
    color: red;
    font-size: 13px;
    top: -15px;
    position: relative;
}

/* Contact Us pages strat */
.contact-appointment {
    padding-top: 0px;
    padding-bottom: 0px !important;
}

.contact-box-section .contact-box {
    box-shadow: 0px 0px 20px 0px #0000001A;
    padding: 70px 30px;
    text-align: center;
    border-radius: 20px;
    height: 100%;

}

.contact-appointment img {
    width: 100%;
}

.contact-box-section .contact-box-icon {
    background-color: var(--Torqoies-green);
    max-width: 60px;
    height: 60px;
    border-radius: 50%;
    align-content: center;
    text-align: center;
    margin: 0 auto 10px auto;
}

.contact-box-section .contact-box-content h4 {
    color: var(--Big-stone);
    margin-bottom: 10px;
}

.contact-box-section .contact-box-content a {
    font-family: 'Rubik';
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: var(--black);
}

.contact-appointment .contact-appointment-bg {
    background-color: var(--Big-stone);
    border-radius: 20px;
    padding: 50px 30px;
    margin-bottom: 25px;
}

.contact-appointment .contact-appointment-bg .appointment-from .col-md-12 {
    margin-bottom: 15px;
}

.contact-appointment .contact-appointment-bg .appointment-from h4 {
    font-family: 'Sora';
    font-weight: 600;
    font-size: 22px;
    line-height: 30.8px;
    color: var(--white);
    margin-bottom: 40px;
}

.contact-appointment .contact-appointment-bg .appointment-from {
    position: relative;
}

.contact-appointment .contact-appointment-bg .appointment-from h4::before {
    content: "";
    border-bottom: 1px solid var(--white);
    left: 0px;
    position: absolute;
    top: 45px;
    width: 30px;
    height: 2px;
}

.contact-appointment .contact-appointment-bg .appointment-from .form-select {
    height: 56px;
}

.contact-appointment .contact-appointment-bg .appointment-from #exampleFormControlTextarea1 {
    height: 100px;
}

.contact-section .welcome {
    max-width: 162px;
    max-height: 52px;
    background-color: #d7d1ef;
    border-radius: 5px;
    margin-bottom: 24px;
    margin-top: 130px;
    padding: 7.5px 12px;
    gap: 12px;
    display: flex;
}

.contact-section h2 {
    margin-bottom: 56px;
}

.contact-section .row.row-cols-1 .col {
    margin-bottom: 24px;
}

/* Contact Us pages end */
.header-nav .nav-btn {
    display: flex;
    align-items: center;
    margin-right: 15px;
    margin-left: auto;
}

.form-select:focus {
    border-color: 0;
    outline: 0;
    box-shadow: none;
}

/* Header language css start */
.language-dropdown .dropdown-menu li a {
    padding: 8px 12px;
    display: block;
    color: #333 !important;
    text-decoration: none;
}

.language-dropdown .btn {
    padding: 15px 16px;
    border: 1px solid var(--Torqoies-green);
}

.language-dropdown .btn span {
    color: var(--Big-stone);
}

.language-dropdown .dropdown-menu.show {
    min-width: 98px !important;
}

.language-dropdown .dropdown-menu li a:hover {
    background-color: var(--Torqoies-green);
    color: #fff !important;
}

.language-dropdown .dropdown-toggle::after {
    margin-left: 15px;
    vertical-align: middle;
}

.dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: none !important;
    border-bottom: 0;
    border-left: none !important;
}

/* Header language css end */

/* Search highlight css start */
.highlight {
    background: #68a7d4;
    color: #fff;
    border-radius: 3px;
    padding: 0 2px;
    transition: background 0.3s;
}

/* Search highlight css End */

/* 404 page css start */
.not-found-section {
    padding-top: 250px !important;
}

.error-404 {
    font-size: 9rem;
    font-weight: bold;
    color: #19B4A4;
}

/* 404 page css end */

/* No hover link css start */
.no-hover-link {
    pointer-events: none;
    /* Disables all click events */
    text-decoration: none;
    /* Removes underline */
    color: inherit;
    /* Ensures the text color is inherited from the parent */
}

.no-hover-link:hover {
    text-decoration: none;
    /* Ensures no underline on hover */
    color: inherit;
    /* Prevents color change on hover */
}

/* No hover link css end */

.navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    width: auto;
    min-width: 200px;
    max-width: 90vw;
    white-space: nowrap;
    padding: 10px 15px;
    box-sizing: border-box;

}

/* Make links inside the dropdown flexible and readable */

.navbar-expand-lg .navbar-nav .dropdown-menu a {
    display: block;
    width: 100%;
    padding: 8px 10px;
    color: #333;
    text-decoration: none;
    font-size: 15px;
    transition: background-color 0.2s ease;
}

.navbar-expand-lg .navbar-nav .dropdown-menu a:hover {
    background-color: var(--Torqoies-green);
    color: var(--white);
}


.no-results {
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

.no-results h2 {
    font-weight: 600;
    color: var(--Big-stone);
    /* max-width: 30%; */
    margin: auto;

}

.no-results svg {
    margin-bottom: 25px;
}

.no-results h2 span {
    /* color: var(--Torqoies-green); */
    font-weight: bold;
}

.no-results-top {
    padding-top: 0;
    height: 290px;
}

.single-service .categories-box {
    margin-bottom: 24px;
}

.service-detail .categories-box {
    margin-bottom: 24px;
}

.bg-images {
    position: absolute;
    left: -540px;
    top: -210px;
    width: 400px;
}

.hero-banner {
    position: relative;
}

.mySwiper .swiper-pagination-bullet-active {
    background-color: var(--white) !important;

}

.text-colore {
    color: var(--Torqoies-green);
}


/* =============================== */
/* UNIVERSAL RULE FOR ALL TRANSLATED LANGUAGES */
/* =============================== */

html[class^="translated-"],
html[class*=" translated-"] {
    font-size: 11px !important;
    font-family: "Rubik", "Sora", sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html[class^="translated-"] body,
html[class*=" translated-"] body {
    hyphens: auto !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
}



html.translated-en {
    font-size: 11px !important;
    line-height: 1.4 !important;

}

html.translated-hr {
    font-size: 11px !important;
    line-height: 1.4 !important;

}

html.translated-es {
    font-size: 11px !important;
    line-height: 19px !important;
    hyphens: auto !important;
}


html.translated-cs {
    font-size: 11px !important;
    line-height: 19px !important;
    hyphens: auto !important;
}

html.translated-de {
    font-size: 11px !important;
    line-height: 19px !important;
    letter-spacing: -0.15px !important;
}

html.translated-de * {
    hyphens: auto !important;
}


html.translated-ru {
    font-size: 11px !important;
    line-height: 19px !important;
    letter-spacing: -0.2px !important;
    word-spacing: -0.5px !important;
}


html.translated-en .your-text-class,
html.translated-es .your-text-class,
html.translated-cs .your-text-class,
html.translated-de .your-text-class,
html.translated-ru .your-text-class {
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    hyphens: auto !important;
}






.service-video-text {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.service-img img {
    width: 100%;
    border-radius: 10px;
}

.service-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.service-btn svg {
    width: 60px;
    height: 60px;
    fill: #162135;
    transition: transform 0.2s;
}

.service-btn svg:hover {
    transform: scale(1.2);
}

/* Custom close button */
.video-close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 30px;
    font-weight: bold;
    color: white;
    background: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
}

.video-close-btn:hover {
    background: rgba(0, 0, 0, 0.7);
}

.single-service .feature-service-images img {
    width: 100%;
}

.single-education .feature-service-images img {
    width: 100%;
}

/* .portfolio-page .col-md-7 .card img {
    max-width: 746px;
    max-height: 526px;
} */

/* .portfolio-page .col-md-5 .card img {
    max-width: 526px;
    max-height: 526px;
}

.portfolio-page .col-md-4 .card img {
    max-width: 416px;
    max-height: 416px;
} */

.single-portfolio .feature-service-images img {
    width: 100%;
}

.single-portfolio .feature-service-images img {
    width: 100%;
}

.single-portfolio .feature-service-images img {
    width: 100%;
}

.about-images-box img {
    width: 350px;
    height: 100%;
}


/* UNIVERSAL RULE */
html[class^="translated-"] {
    font-family: "Rubik", "Sora", sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5;
}

/* LANGUAGE-SPECIFIC */
html.translated-de {
    font-size: 14px;
    line-height: 1.6;
}

/* German */
html.translated-ru {
    font-size: 13px;
    line-height: 1.7;
}

/* Russian */

.modal-dialog .modal-body .card-content .meta span {
    font-size: 12px;
}

.appointment-from .btn-bg-pink:hover {
    background-color: var(--white);
    color: var(--black);
}


.contact-pages .btn.btn-bg-pink {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 55px;
    gap: 8px;
}

.contact-pages .btn.btn-bg-pink br {
    display: none;
}

.contact-pages .btn.btn-bg-pink::after {
    content: "";
    display: inline-block;
    width: 35px;
    height: 35px;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 16 16'><path d='M5.854 10.803a.5.5 0 1 1-.708-.707L9.243 6H6.475a.5.5 0 1 1 0-1h3.975a.5.5 0 0 1 .5.5v3.975a.5.5 0 1 1-1 0V6.707z'/></svg>") no-repeat center center;
    background-size: contain;
    transition: all 0.3s ease;
}


.contact-pages .btn.btn-bg-pink:hover::after {
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='black' viewBox='0 0 16 16'><path d='M5.854 10.803a.5.5 0 1 1-.708-.707L9.243 6H6.475a.5.5 0 1 1 0-1h3.975a.5.5 0 0 1 .5.5v3.975a.5.5 0 1 1-1 0V6.707z'/></svg>") no-repeat center center;
    background-size: contain;
}

.meta span {
    display: flex;
    align-items: center;
    gap: 8px;
}

.welcome-ana .welcome-ana-box .welcome-ana-content {
    /* border-bottom: 1px solid #F3F3F3; */
}

.custom-file-input {
    position: relative;
    display: inline-block;
    width: 100%;
    margin-bottom: 15px;
}

.custom-file-input input[type="file"] {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.custom-file-label {
    display: block;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 15px 12px;
    color: #212529A6 !important;
    background: #fff;
    pointer-events: none;
}

.custom-file-input input[type="file"]:valid+.custom-file-label {
    color: #212529A6 !important;
}



.choose-img input[type="file"] {
    padding: 5px;
    background-color: #fff;
    border-radius: 5px;
    width: 100%;
    margin-bottom: 15px;
}

.choose-img input[type="file"]::file-selector-button {
    padding: 12px;
    border-width: 0;
    border-radius: 5px;
    background-color: var(--Torqoies-green);
    color: #FFFFFF;
    font-weight: 500;
    transition: all .25s ease-in-out;
    cursor: pointer;
    margin-right: 1em;
    font-size: 16px;
}

.videoModal .modal-body {
    display: flex;
    flex-wrap: wrap;
    padding: 0 !important;
}

.videoModal .ratio {
    flex: 1;
    min-height: 100%;
    width: 100%;
    background-color: #000;
}

.videoModal video {
    width: 100%;
    height: 100%;

}

/* .modal-backdrop {
  display: none !important;
  opacity: 1 !important;
  visibility: hidden !important;
} */

body.modal-open {
    overflow: auto !important;
    padding-right: 0 !important;
}


.videoModal .col-md-5 {
    background: #fff;
    overflow-y: auto;
    max-height: 90vh;
}

.service-img #previewVideo {
    border-radius: 10px;
}

@media (max-width: 768px) {
    .videoModal .modal-body {
        flex-direction: column;
    }

    .videoModal .ratio {
        height: auto;
    }

    .videoModal .col-md-5 {
        max-height: none;
    }
}





.related-portfolio .card {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    cursor: pointer;
    margin-bottom: 30px;
}

.related-portfolio .portfolio-slide .swiper-slide img {
    width: 100%;
    height: 330px !important;
    display: block;
    transition: transform 0.7s ease;
    border-radius: 24px;
}

/* Image zoom on hover */
.related-portfolio .card:hover img {
    transform: scale(1.1);
}

/* Overlay styling */
.related-portfolio .card .overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--white);
    color: #333;
    padding: 15px;
    opacity: 0;
    transform: translateY(100%);
    transition: all 0.7s ease;
    border-radius: 25px;
    margin: 15px;
}

/* Show overlay only when the card is hovered */
.related-portfolio .card:hover .overlay {
    opacity: 1;
    transform: translateY(0);
}

.related-portfolio .overlay h3 {
    font-size: 18px;
    margin-bottom: 8px;
}

.related-portfolio .overlay p {
    font-size: 14px;
    line-height: 1.4;
    color: #666;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Responsive images */
@media (max-width: 767px) {
    .related-portfolio .card img {
        width: 100%;
        height: auto;
    }
}

.single-service .banner-section {
    padding-top: 150px;
    margin-bottom: 50px;
    height: auto;
}


/* Extra bottom space so last section tracks correctly */
.content-text {
    scroll-margin-top: 140px;
    /* smooth anchor offset */
    padding-bottom: 100px;
}

/* For active highlight */
/* #myScrollspy .nav-link.active {
  color: #fff;
  background: #035E58;
} */

.choose-img {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 15px;
    border-radius: 5px;
    padding: 6px;
    background-color: white;
}

.file-label {
    padding: 10px 20px;
    background-color: #00bfae;
    /* Button Color */
    color: white;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: background-color 0.3s ease;
    margin-right: 10px;
}

.file-label:hover {
    background-color: #00a49b;
    /* Button Hover Color */
}

.file-name {
    font-size: 13px;
    color: #555;
}