@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --primaryWhite: #ffffff;
    --primaryWhiteHover: #ffffffd3;
    --secondaryGreen: #04B477;
    --secondaryGreenHover: #059865;
    --black: #000000;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "inter";
    color: var(--primaryWhite);
}

html,
body {
    height: 100%;
    width: 100%;
    /* scroll-behavior: smooth; */
}


/* Scroll Bar  */
html {
    scrollbar-width: thin;
    scrollbar-color: var(--secondaryGreenHover) var(--black);
}




.topLandingEmailWriter {
    background: url("/Assets/Images/landingBg.png");
    background-size: cover;
    height: 100vh;
    width: 100%;
    padding-top: 2.5vw;
}

.navbar {
    width: 85%;
    background-color: var(--black);
    padding: 1.5vw 1.2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    border-radius: 5vw;
}

.navbar-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 90vw;

}

.logo {
    display: flex;
    align-items: center;
    color: var(--primaryWhite);
}

.logo img {
    width: 2.5vw;
    height: auto;
    margin-right: 1vw;
    margin-left: 0.5vw;
}

.logo span {
    font-family: Poppins;
    font-size: 1.2vw;
    font-weight: 600;
    line-height: 1.4vw;
    text-align: left;

}

.nav-links {
    display: flex;
    gap: 2.5vw;
    list-style: none;
}

#Mobile {
    display: none;
}

.nav-links li {
    position: relative;
}

.nav-links a {
    text-decoration: none;
    color: white;
    font-family: Poppins;
    font-size: 1.2vw;
    font-weight: 400;
    line-height: 1.4vw;
    text-align: left;
    transition: all 0.3s ease-in-out;

}

.nav-links a:hover {
    color: var(--primaryWhiteHover);
}

.nav-links span {
    font-size: 1.2vw;
}

.get-app-btn {
    padding: 0.8vw 2vw;
    background-color: var(--secondaryGreen);
    color: white;
    font-size: 1.2vw;
    font-weight: 400;
    border: none;
    border-radius: 2vw;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    font-family: "poppins";
}

.get-app-btn:hover {
    background-color: var(--secondaryGreenHover);
}

.get-app-btn1 {
    padding: 0.8vw 2vw;
    background-color: var(--secondaryGreen);
    color: white;
    font-size: 1.2vw;
    font-weight: 400;
    border: none;
    border-radius: 2vw;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    font-family: "poppins";
}

.get-app-btn1:hover {
    background-color: var(--secondaryGreenHover);
}

/* Mobile view: initially hide the nav-links and show the menu icon */
.menu-toggle {
    display: none;
    font-size: 2vh;
    color: white;
    cursor: pointer;
    margin-right: 1vh;
}

/* Dropdown styling */
.dropdown {
    position: relative;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: var(--black);
    padding: 1vw 0.5vw;
    list-style: none;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease, max-height 0.3s ease;
    max-height: 0;
    overflow: hidden;
    width: 150%;
    border-radius: 0.5vw;
    margin-top: 1vw;
    z-index: 2;
}

.dropdown-menu li {
    margin-bottom: 1vw;
    text-align: center;
}

.dropdown-menu li:last-child {
    margin-bottom: 0vw;
}

.dropdown-menu a {
    color: var(--primaryWhite);
    font-size: 1.1vw;
    text-decoration: none;
}

.dropdown-menu a:hover {
    color: var(--primaryWhiteHover);
}

/* When dropdown is active, show it with smooth transitions */
.dropdown.open .dropdown-menu {
    display: block;
    opacity: 1;
    max-height: 15vw;
    /* Adjust this depending on the number of dropdown items */
}

/* Transition only works when dropdown is open */
.dropdown.open .dropdown-menu {
    transition: opacity 0.3s ease, max-height 0.5s ease;
}

/* Arrow rotation with transition */
.dropdown a span i {
    transition: all 0.3s ease-in-out;
}

/* Rotate the arrow when dropdown is open */
.dropdown.open a span i {
    transform: rotate(-180deg);
}

/* When nav is open in mobile view */
.nav-open .nav-links {
    display: flex;
}

.nav-open .menu-toggle i {
    content: "\f00d";
    /* FontAwesome cross icon */
}

.EmailLandingHeading {
    width: 85%;
    height: auto;
    display: flex;
    margin: auto;
    position: relative;
}

.EmailLandingHeadingLeft {
    width: 50%;
    height: auto;
    margin-top: 5vw;
}

.EmailLandingHeadingLeft h1 {
    font-size: 4.2vw;
    font-weight: 600;
    line-height: 5vw;
    text-align: left;
}

.EmailLandingHeadingLeft h1 span {
    color: var(--secondaryGreen);
}

.EmailLandingHeadingLeft p {
    font-size: 1.2vw;
    font-weight: 400;
    line-height: 1.4vw;
    text-align: left;
    margin-top: 1.5vw;
    margin-bottom: 1.5vw;
}

.EmailLandingHeadingLeft img {
    width: 11.7vw;
    height: auto;
}

.usersMainDiv {
    display: flex;
    align-items: center;
    margin-top: 2vw;
    gap: 1vw;
}

.usersMainDiv img {
    width: 10.5vw;
}


.userCount h2 {
    font-size: 1.7vw;
    font-weight: 600;
    line-height: 1.4vw;
    text-align: left;

}

.userCount p {
    margin-top: 0.4vw;
    margin-bottom: 0vw;
    font-size: 1.2vw;
    font-weight: 400;
    line-height: 1.4vw;
    text-align: left;
}

.emailparent {
    position: relative;
    width: 100%;
    height: auto;
}

.mySwiper1 {
    position: absolute !important;
    top: 58%;
    left: 31%;
    z-index: 1;
    width: 38% !important;
}

.mySwiper1 .swiper-slide {
    transition: all 0.5s ease;
    opacity: 0.1;
    box-shadow: none;
}

.mySwiper1 .swiper-slide-active {
    opacity: 1;
}

.clientCards1 {
    padding: 0.7vw 1vw;
    background-color: var(--primaryWhite);
    border-radius: 0.6vw;
    width: 12vw;
    height: auto;
}

.clientCards1 img {
    margin-top: 0.3vw !important;
    width: 20% !important;
    object-fit: contain !important;
    height: auto !important;
}


.EmailLandingHeadingRight {
    width: 50%;
    height: 80.4vh;
    position: relative;
    overflow: hidden;
    /* This will hide the bottom part of the image */
}



.EmailLandingHeadingRightImg {
    width: 73%;
    height: auto;
    object-fit: contain;
    position: absolute;
    top: -14%;
    left: 33%;
    z-index: 4;
}

.emailWriterServices {
    width: 100%;
    height: auto;
    background: linear-gradient(180deg, #000000 20%, #01110a 80%);
}


.emailWriterServicesHead {
    width: 85%;
    margin: auto;
    text-align: center;
    padding: 4vw 16vw;
    padding-bottom: 3vw;
}

.emailWriterServicesHead h2 {
    font-size: 3.2vw;
    font-weight: 600;
    line-height: 4vw;
}

.emailWriterServicesHead h2 span {
    color: var(--secondaryGreen);
}

.emailWriterServicesHead p {
    font-size: 1.04vw;
    font-weight: 400;
    line-height: 1.5vw;
    margin-top: 1vw;
}

.emailWriterServicesMain {
    width: 85%;
    margin: auto;
    display: flex;
    padding-bottom: 5vw;
}

.emailWriterServicespoints img {
    width: 5vw;
    height: auto;
}

.emailWriterServicespoints h5 {
    margin-top: 1vw;
    margin-bottom: 1vw;
    font-size: 1.43vw;
    font-weight: 600;
    line-height: 1.4vw;
    text-align: left;
}

.emailWriterServicespoints p {
    font-size: 1.04vw;
    font-weight: 400;
    line-height: 1.5vw;
    text-align: left;
    padding-right: 2vw;
}

.emailWriterWorking {
    width: 100%;
    height: auto;
    background-color: var(--black);
}

.emailWriterWorkingHead {
    width: 85%;
    margin: auto;
    text-align: center;
    padding: 4vw 16vw;
    padding-bottom: 6vw;
}

.emailWriterWorkingHead h2 {
    font-size: 3vw;
    font-weight: 600;
    line-height: 4vw;
}

.emailWriterWorkingHead h2 span {
    color: var(--secondaryGreen);
}

.emailWriterWorkingHead p {
    font-size: 1.04vw;
    font-weight: 400;
    line-height: 1.5vw;
    margin-top: 1vw;
}

.emailWriterWorkingMain {
    width: 85%;
    margin: auto;
    display: flex;
    padding-bottom: 5vw;
    align-items: center;
}

#ShowMobile {
    display: none;
}


.emailWriterWorkingMainLeft h1 {
    font-size: 2.88vw;
    font-weight: 600;
    line-height: 3.8vw;
    text-align: left;
    width: 100%;
}

.emailWriterWorkingMainLeft1 h1 {
    font-size: 2.88vw;
    font-weight: 600;
    line-height: 3.8vw;
    text-align: left;
    margin-left: 5vw;
    width: 75%;
}

.emailWriterWorkingMainLeft2 h1 {
    width: 70%;
}

.emailWriterWorkingMainLeft h1 span {
    color: var(--secondaryGreen);
}

.emailWriterWorkingMainLeft p {
    font-size: 1.04vw;
    font-weight: 400;
    line-height: 1.5vw;
    text-align: left;
    width: 85%;
    margin-top: 1.4vw;
}

.emailWriterWorkingMainLeft1 p {
    margin-left: 5vw;
}

.emailWriterWorkingMainRight img {
    width: 40vw;
    height: auto;
}

.emailWriterInterface {
    width: 100%;
    height: auto;
    background: linear-gradient(180deg, #01110a 40%, #010c07 60%);
}

.emailWriterInterfaceHead {
    width: 85%;
    margin: auto;
    padding: 4vw 0vw;
    padding-bottom: 3vw;
}

.emailWriterInterfaceHead h1 {
    font-size: 3.2vw;
    font-weight: 600;
    line-height: 4vw;
    text-align: center;
    width: 50%;
    margin: auto;
}

.emailWriterInterfaceHead h1 span {
    color: var(--secondaryGreen);
}

.emailWriterInterfaceHead img {
    margin-top: 4vw;
    width: 100%;
    height: auto;
}

.emailWriterClient {
    width: 100%;
    height: auto;
    background-color: var(--black);
}

.emailWriterClientHead {
    text-align: center;
    padding: 4vw 0vw;
    padding-bottom: 6vw;
}

.emailWriterClientHead h2 {
    font-size: 3.2vw;
    font-weight: 600;
    line-height: 4vw;
}

.emailWriterClientHead h2 span {
    color: var(--secondaryGreen);
}

.emailWriterClientHead p {
    font-size: 1.04vw;
    font-weight: 400;
    line-height: 1.5vw;
    width: 54%;
    text-align: center;
    margin: auto;
    margin-top: 1.2vw;
    color: #CBD5E1;
}

/* Card Crousel CSS  */
.emailWriterClientMain {
    padding-bottom: 5vw;
}

.swiper {
    width: 100%;
    height: auto;
    position: relative;
}

/* Style for each swiper slide */
.swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    border-radius: 1vw;
    box-shadow: 0pvw 0.5vw 1vw rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease-in-out;
}

/* Make images responsive with vw units */
.swiper-slide img {
    width: 100%;
    height: auto;
    border-radius: 1vw;
    object-fit: cover;
}

/* Navigation buttons with vw-based sizes */
.swiper-navigation {
    position: relative;
    width: 13%;
    margin: auto;
    margin-top: 6vw;

}

.swipeButtons {
    cursor: pointer;
    background-color: transparent;
    font-size: 1.04vw !important;
    color: var(--primaryWhite) !important;
    font-weight: 500 !important;
    line-height: 1.5vw !important;
    letter-spacing: 0.1vw !important;
    text-align: left !important;
    border: none;
    display: flex;
    gap: 0.8vw;

}

.swipeButtons i,
.swipeButtons span {
    transition: all 0.3s ease-in-out;
}

.swipeButtons:hover i,
.swipeButtons:hover span {
    color: var(--secondaryGreen) !important;
}



.swiper-button-next:after,
.swiper-button-prev:after {
    display: none !important;
}



/* clients Cards  */
.clientCards {
    padding: 1vw 1vw;
    padding-right: 0vw;
    background-color: var(--primaryWhite);
    border-radius: 1vw;
    width: 100%;
    height: auto;
}

.clientCards img {
    margin-top: 1vw;
    width: 15%;
    object-fit: contain;
    height: auto;
}

.quoteText {
    color: #413D45;
    font-size: 1.5vw;
    font-weight: 500;
    line-height: 2vw;
    text-align: left;
    padding-right: 1vw;
    margin-top: 0.8vw;
    margin-bottom: 0.5vw;
    height: 33vh;
}

.quoteAuthor {
    font-size: 0.8vw;
    font-weight: 500;
    line-height: 1.2vw;
    text-align: left;
    color: #67646A;
}

.quoteSubtext {
    font-size: 0.65vw;
    font-weight: 500;
    line-height: 1.1vw;
    text-align: left;
    color: #413D45;
}

/* clients Cards 2 */



.quoteText1 {
    color: #413D45;
    font-size: 0.8vw;
    font-weight: 500;
    line-height: 1vw;
    text-align: left;
    padding-right: 1vw;
    margin-top: 0.8vw;
    margin-bottom: 0.5vw;
    height: 16vh;

}

.quoteAuthor1 {
    font-size: 0.5vw;
    font-weight: 500;
    line-height: 0.8vw;
    text-align: left;
    color: #67646A;
}

.quoteSubtext1 {
    font-size: 0.45vw;
    font-weight: 500;
    line-height: 0.8vw;
    text-align: left;
    color: #413D45;
}

/* FAQS  */
.emailWriterFaq {
    width: 100%;
    height: auto;
    background-color: #00110a;
}

.emailWriterFaqHead {
    text-align: center;
    padding: 4vw 0vw;
    padding-bottom: 6vw;
}

.emailWriterFaqHead h2 {
    font-size: 3.2vw;
    font-weight: 600;
    line-height: 4vw;
    width: 50%;
    margin: auto;
}

.emailWriterFaqHead p {
    font-size: 1.04vw;
    font-weight: 400;
    line-height: 1.5vw;
    width: 40%;
    margin: auto;
    margin-top: 1.2vw;
}

.emailWriterFaqMain {
    width: 85%;
    margin: auto;
    padding-bottom: 5vw;
}

.accordion {
    max-width: 100%;
    overflow: hidden;
}

.accordion-item {
    border-bottom: 0.1vw solid #7A7E82;
}

.accordion-header {
    display: flex;
    justify-content: space-between;
    padding: 1.5vw 0vw;
    padding-left: 1.2vw;
    cursor: pointer;
}

.accordion-header h3 {
    font-size: 1.5vw;
    font-weight: 600;
    line-height: 2vw;
    text-align: left;

}

.accordion-header i {
    font-size: 1.5vw;
    transition: transform 0.3s ease;
}

.accordion-content {
    display: grid;
    grid-template-rows: 1fr;
    height: 0;
    overflow: hidden;
    padding: 0 2vw;
    padding-left: 0;
    transition: height 0.5s ease, padding 0.3s ease;

}

.accordion-content p {
    color: #CBD5E1;
    font-size: 1.12vw;
    line-height: 1.8vw;
}

.accordion-item.active .accordion-content {
    height: auto;
    padding: 1.5vw 2vw;
    padding-left: 1vw;
}

.accordion-item.active .accordion-header i {
    transform: rotate(-180deg);
}


/* Download Our App  */
.DownlaodOurApp {
    width: 100%;
    height: auto;
    background-color: var(--black);
    padding-top: 5vw;
}

.DownlaodOurAppMain {
    background-color: #111111;
    width: 100%;
}

.DownlaodOurAppMainRow {
    display: flex;
    width: 85%;
    margin: auto;
    padding: 4vw 0vw;
    align-items: center;
}

.DownlaodOurAppMainLeft {
    width: 70%;
}

.DownlaodOurAppMainLeft h2 {
    font-size: 2.87vw;
    font-weight: 600;
    line-height: 3.3vw;
    text-align: left;
}

.DownlaodOurAppMainLeft h2 span {
    color: var(--secondaryGreen);
}

.DownlaodOurAppMainLeft p {
    font-size: 1.04vw;
    font-weight: 400;
    line-height: 1.6vw;
    text-align: left;
    margin: 1.5vw 0vw;
}

.DownloadsCountMain {
    display: flex;
    gap: 2vw;
}

.DownloadsCountMainLeftRight h4 {
    font-size: 1.8vw;
    font-weight: 600;
    line-height: 2vw;
    text-align: left;
}

.DownloadsCountMainLeftRight p {
    font-size: 1.1vw;
    font-weight: 400;
    line-height: 1.6vw;
    text-align: left;
    margin: 0.5vw 0vw;
}

.DownlaodOurAppMainRight {
    width: 30%;
    position: relative;
}

.DownlaodOurAppMainRight img {
    width: 85%;
    display: flex;
    margin-left: 16%;
}

.forAndroid {
    position: absolute;
    top: 10%;
    left: 23%;
}

.forAndroid h2 {
    font-size: 2vw;
    font-weight: 600;
    line-height: 3vw;
    text-align: left;
}

.forAndroid p {
    font-size: 1.58vw;
    font-weight: 400;
    line-height: 2.5vw;
    text-align: left;

}

.forAndroid img {
    width: 5.2vw;
    height: auto;
    margin-top: 1vw;
    margin-left: 0vw;

}

/* Footer Portion  */
.footerPortion {
    width: 100%;
    height: auto;
    background-color: var(--black);
    padding: 2vw 0vw;
}


.footerTop {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 85%;
    margin: auto;
    padding: 1vw 0vw;
}

.footerTopPointss {
    width: 49.2%;
}

.logoFooter {
    display: flex;
    align-items: center;
    color: var(--primaryWhite);
}

.logoFooter img {
    width: 3vw;
    height: auto;
    margin-right: 1vw;
    margin-left: 0.5vw;
}

.logoFooter span {
    font-size: 1.2vw;
    font-weight: 600;
    line-height: 1.4vw;
    text-align: left;

}

.footerTopPoints a {
    text-decoration: none;
    font-size: 1.1vw;
    font-weight: 700;
    line-height: 1.6vw;
    text-align: left;
}

.footerBorder {
    border-top: 0.1vw solid #2f2f2f;
    width: 85%;
    margin: auto;
}

.footerBottom {
    width: 85%;
    display: flex;
    margin: auto;
    justify-content: space-between;
    margin-top: 2vw;
    align-items: center;
}

.footerSocialIcons {
    display: flex;
    align-items: center;
    gap: 2vw;
}

.footerSocialIcons i {
    font-size: 1.5vw;
}

.footerSocialIcons p {
    font-size: 1.1vw;

}

.footerSocialIcons p a {
    text-decoration: none;

}

.TermsReserved {
    display: flex;
    gap: 1.7vw;
}

.termsReservedPoints {
    display: flex;
    gap: 0.7vw;
    align-items: center;
    font-size: 1.1vw;
    font-weight: 400;
    line-height: 1.6vw;
    text-align: left;
}

.termsReservedPoints h6 {
    font-size: 1.1vw;
    font-weight: 400;
    line-height: 1.6vw;
    text-align: left;
}

.termsReservedPoints a {
    text-decoration: none;
}


/* Privacy Page And Terms page */

.topLandingPrivacyPolicy {
    background: url("/Assets/Images/privacyBG.png");
    background-size: cover;
    height: auto;
    width: 100%;
    padding-top: 2.5vw;
}

.privacyPolicy {
    width: 85%;
    margin: auto;
    padding-top: 8vw;
}

.privacyPolicy h2 {
    font-size: 3vw;
    font-weight: 600;
    line-height: 3.7vw;
    text-align: center;
}

.privacyPolicy h2 span {
    color: var(--secondaryGreen);
}

.privacyPolicyMain {
    padding-top: 5vw;
    padding-bottom: 3vw;
}

.privacyPolicyMain h5 {
    font-size: 1.58vw;
    font-weight: 500;
    line-height: 2vw;
    text-align: left;
    margin-bottom: 2vw;
}

.privacyPolicyMain h6 {
    font-size: 1.32vw;
    font-weight: 500;
    line-height: 2vw;
    text-align: left;
    margin-bottom: 2vw;
}

.privacyPolicyMain p {
    font-size: 1.08vw;
    font-weight: 400;
    line-height: 2vw;
    text-align: left;
    margin-bottom: 2vw;
}

.privacyPolicyMain p span {
    color: var(--secondaryGreen)
}




/* Hide nav links and button in mobile view */
@media screen and (max-width: 768px) {
    .topLandingEmailWriter {
        background: url("/Assets/Images/landingBg.png");
        background-size: cover;
        height: auto;
        width: 100%;
        padding-top: 2.5vw;

    }

    .navbar {
        width: 90%;
        background-color: var(--black);
        padding: 1.5vh 1.2vh;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        border-radius: 5vh;
    }

    .navbar-container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 90vh;

    }

    .logo {
        display: flex;
        align-items: center;
        color: var(--primaryWhite);
    }

    .logo img {
        width: 2.5vh;
        height: auto;
        margin-right: 1vh;
        margin-left: 0.5vh;
    }

    .logo span {
        font-family: Poppins;
        font-size: 1.2vh;
        font-weight: 600;
        line-height: 1.4vh;
        text-align: left;

    }

    .nav-links {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 6.5vh;
        left: 3vh;
        background-color: black;
        width: 85%;
        height: auto;
        padding: 2vw;
        border-radius: 1vh;
        z-index: 66;
        gap: 0.7vh;
        text-align: center;
    }

    .get-app-btn1 {
        padding: 0.8vh 1.1vh;
        font-size: 1.2vh;
        border-radius: 2vh;
    }

    .nav-links li {
        margin-bottom: 3vw;
    }

    .nav-links a {
        font-size: 1.2vh;
        font-weight: 400;
        line-height: 1.4vh;
        text-align: left;

    }

    .nav-links span {
        font-size: 1.2vh;
    }

    .get-app-btn {
        display: none;
    }

    #Mobile {
        display: block;
    }


    .menu-toggle {
        display: block;
    }

    /* Dropdown styling */
    .dropdown {
        position: relative;
    }

    .dropdown-menu {
        position: absolute;
        top: 100%;
        left: 20%;
        padding: 1vh 0.5vh;
        background-color: #414141;
        opacity: 0;
        max-height: 0;
        width: 60%;
        border-radius: 0.5vh;
        margin-top: 1vh;
        z-index: 2;
    }

    .dropdown-menu li {
        margin-bottom: 1vh;
        text-align: center;
    }

    .dropdown-menu li:last-child {
        margin-bottom: 0vh;
    }

    .dropdown-menu a {
        font-size: 1.1vh;
    }

    .dropdown.open .dropdown-menu {
        max-height: 15vh;
    }

    .EmailLandingHeading {
        width: 88%;
        height: auto;
        display: flex;
        flex-direction: column;
        margin: auto;
        position: relative;
    }

    .EmailLandingHeadingLeft {
        width: 100% !important;
        height: auto;
        margin-top: 5vh;
    }

    .EmailLandingHeadingLeft h1 {
        font-size: 4.2vh;
        font-weight: 600;
        line-height: 5vh;
        text-align: left;
    }

    .EmailLandingHeadingLeft h1 span {
        color: var(--secondaryGreen);
    }

    .EmailLandingHeadingLeft p {
        font-size: 1.2vh;
        font-weight: 400;
        line-height: 1.4vh;
        text-align: left;
        margin-top: 1.5vh;
        margin-bottom: 1.5vh;
    }

    .EmailLandingHeadingLeft img {
        width: 11.7vh;
        height: auto;
    }

    .usersMainDiv {
        display: flex;
        align-items: center;
        margin-top: 2vh;
        gap: 1vh;
    }

    .usersMainDiv img {
        width: 10.5vh;
    }


    .userCount h2 {
        font-size: 1.7vh;
        font-weight: 600;
        line-height: 1.4vh;
        text-align: left;

    }

    .userCount p {
        margin-top: 0.4vh;
        margin-bottom: 0vh;
        font-size: 1.2vh;
        font-weight: 400;
        line-height: 1.4vh;
        text-align: left;
    }

    .emailparent {
        position: relative;
        width: 100%;
        height: auto;
    }

    .mySwiper1 {
        position: absolute !important;
        top: 58%;
        left: -4%;
        z-index: 1;
        width: 89% !important;
    }

    .mySwiper1 .swiper-slide {
        transition: all 0.5s ease;
        opacity: 0.1;
        box-shadow: none;
    }

    .mySwiper1 .swiper-slide-active {
        opacity: 1;
    }

    .clientCards1 {
        padding: 0.7vh 1vh;
        background-color: var(--primaryWhite);
        border-radius: 0.6vh;
        width: 12vh;
        height: auto;
    }

    .clientCards1 img {
        margin-top: 0.3vh !important;
        width: 20% !important;
        object-fit: contain !important;
        height: auto !important;
    }

    .quoteText1 {
        color: #413D45;
        font-size: 0.8vh;
        font-weight: 500;
        line-height: 1vh;
        text-align: left;
        padding-right: 1vh;
        margin-top: 0.8vh;
        margin-bottom: 0.5vh;
        height: 8vh;
    }

    .quoteAuthor1 {
        font-size: 0.5vh;
        font-weight: 500;
        line-height: 0.8vh;
        text-align: left;
        color: #67646A;
    }

    .quoteSubtext1 {
        font-size: 0.45vh;
        font-weight: 500;
        line-height: 0.8vh;
        text-align: left;
        color: #413D45;
    }

    .EmailLandingHeadingRight {
        width: 100%;
        height: 35vh;
        position: relative;
        overflow: hidden;
        /* This will hide the bottom part of the image */
    }



    .EmailLandingHeadingRightImg {
        width: 73%;
        height: auto;
        object-fit: contain;
        position: absolute;
        top: -14%;
        left: 50%;
        z-index: 4;
    }

    .emailWriterServices {
        width: 100%;
        height: auto;
        background: linear-gradient(180deg, #000000 20%, #01110a 80%);
    }


    .emailWriterServicesHead {
        width: 90%;
        margin: auto;
        text-align: center;
        padding: 4vh 0vh;
        padding-bottom: 3vh;
    }

    .emailWriterServicesHead h2 {
        font-size: 3.4vh;
        font-weight: 600;
        line-height: 4.5vh;
    }

    .emailWriterServicesHead h2 span {
        color: var(--secondaryGreen);
    }

    .emailWriterServicesHead p {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.7vh;
        margin-top: 1vh;
    }

    .emailWriterServicesMain {
        width: 90%;
        margin: auto;
        flex-direction: column;
        padding-bottom: 5vh;
        text-align: center;
        gap: 2vh;
    }

    .emailWriterServicespoints img {
        width: 5vh;
        height: auto;
    }

    .emailWriterServicespoints h5 {
        margin-top: 1vh;
        margin-bottom: 1vh;
        font-size: 1.43vh;
        font-weight: 600;
        line-height: 1.4vh;
        text-align: center;
    }

    .emailWriterServicespoints p {
        font-size: 1.04vh;
        font-weight: 400;
        line-height: 1.5vh;
        text-align: center;
        padding-right: 0vh;
    }

    .emailWriterWorkingHead {
        width: 90%;
        margin: auto;
        text-align: center;
        padding: 4vh 0vh;
        padding-bottom: 6vh;
    }

    .emailWriterWorkingHead h2 {
        font-size: 3vh;
        font-weight: 600;
        line-height: 4vh;
    }

    .emailWriterWorkingHead h2 span {
        color: var(--secondaryGreen);
    }

    .emailWriterWorkingHead p {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.7vh;
        margin-top: 1vh;
    }

    #ShowWeb {
        display: none;
    }

    #ShowMobile {
        display: block;
    }

    .emailWriterWorkingMain {
        width: 90%;
        margin: auto;
        display: flex;
        flex-direction: column;
        padding-bottom: 5vh;
        align-items: start;
        gap: 5vh;
    }



    .emailWriterWorkingMainLeft h1 {
        font-size: 2.84vh;
        font-weight: 600;
        line-height: 3.8vh;
        text-align: left;
        width: 100%;
    }

    .emailWriterWorkingMainLeft1 h1 {
        font-size: 2.88vh;
        font-weight: 600;
        line-height: 3.8vh;
        text-align: left;
        margin-left: 0vh;
        width: 80%;
    }

    .emailWriterWorkingMainLeft2 h1 {
        width: 70%;
    }

    .emailWriterWorkingMainLeft h1 span {
        color: var(--secondaryGreen);
    }

    .emailWriterWorkingMainLeft p {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.7vh;
        text-align: left;
        width: 100%;
        margin-top: 1.4vh;
    }

    .emailWriterWorkingMainLeft1 p {
        margin-left: 0vh;
    }

    .emailWriterWorkingMainRight img {
        width: 40vh;
        height: auto;
    }

    .emailWriterInterfaceHead {
        width: 90%;
        margin: auto;
        padding: 4vh 0vh;
        padding-bottom: 3vh;
    }

    .emailWriterInterfaceHead h1 {
        font-size: 3.2vh;
        font-weight: 600;
        line-height: 4vh;
        text-align: center;
        width: 100%;
        margin: auto;
    }

    .emailWriterInterfaceHead img {
        margin-top: 4vh;
        width: 100%;
        height: auto;
    }

    .emailWriterClientHead {
        text-align: center;
        padding: 4vh 0vh;
        padding-bottom: 6vh;
    }

    .emailWriterClientHead h2 {
        font-size: 3.2vh;
        font-weight: 600;
        line-height: 4vh;
    }

    .emailWriterClientHead p {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.7vh;
        width: 90%;
        text-align: center;
        margin: auto;
        margin-top: 1.2vh;
    }

    /* Card Crousel CSS  */
    .emailWriterClientMain {
        padding-bottom: 5vh;
    }


    /* Style for each swiper slide */
    .swiper-slide {
        display: flex;
        justify-content: center;
        align-items: center;
        background: #fff;
        border-radius: 1vh;
        box-shadow: 0vh 0.5vh 1vh rgba(0, 0, 0, 0.2);
        transition: transform 0.3s ease-in-out;
    }

    /* Make images responsive with vw units */
    .swiper-slide img {
        width: 100%;
        height: auto;
        border-radius: 1vh;
        object-fit: cover;
    }

    /* Navigation buttons with vw-based sizes */
    .swiper-navigation {
        position: relative;
        width: 40%;
        margin: auto;
        margin-top: 6vh;
    }

    .swipeButtons {
        cursor: pointer;
        background-color: transparent !important;
        font-size: 1.1vh !important;
        color: var(--primaryWhite) !important;
        font-weight: 500 !important;
        line-height: 1.7vh !important;
        letter-spacing: 0.1vh !important;
        text-align: left !important;
        border: none;
        display: flex;
        gap: 0.8vh;
        width: 0vh !important;
    }

    .swiper-button-next:after,
    .swiper-button-prev:after {
        display: none !important;
    }


    /* clients Cards  */
    .clientCards {
        padding: 1vh 1vh;
        background-color: var(--primaryWhite);
        border-radius: 1vh;
        width: 100%;
        height: auto;
    }

    .clientCards img {
        margin-top: 1vh;
        width: 15%;
        object-fit: contain;
        height: auto;
    }

    .quoteText {
        color: #413D45;
        font-size: 1.6vh;
        font-weight: 500;
        line-height: 2vh;
        text-align: left;
        padding-right: 1vh;
        margin-top: 0.8vh;
        margin-bottom: 0.5vh;
        height: 16vh;
    }

    .quoteAuthor {
        font-size: 0.8vh;
        font-weight: 500;
        line-height: 1.2vh;
        text-align: left;
        color: #67646A;
    }

    .quoteSubtext {
        font-size: 0.65vh;
        font-weight: 500;
        line-height: 1.1vh;
        text-align: left;
        color: #413D45;
    }

    /* FAQS  */

    .emailWriterFaqHead {
        text-align: center;
        padding: 4vh 0vh;
        padding-bottom: 6vh;
    }

    .emailWriterFaqHead h2 {
        font-size: 3.2vh;
        font-weight: 600;
        line-height: 4vh;
        width: 100%;
        margin: auto;
    }

    .emailWriterFaqHead p {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.7vh;
        width: 90%;
        margin: auto;
        margin-top: 1.2vh;
    }

    .emailWriterFaqMain {
        width: 90%;
        margin: auto;
        padding-bottom: 5vh;
    }


    .accordion-item {
        border-bottom: 0.1vh solid #7A7E82;
    }

    .accordion-header {
        padding: 1.5vh 0vh;
        padding-left: 1.2vh;
        cursor: pointer;
    }

    .accordion-header h3 {
        font-size: 1.2vh;
        font-weight: 600;
        line-height: 2vh;
        text-align: left;

    }

    .accordion-header i {
        font-size: 1.2vh;
        transition: transform 0.3s ease;
    }

    .accordion-content {
        display: grid;
        grid-template-rows: 1fr;
        height: 0;
        overflow: hidden;
        padding: 0 2vh;
        font-size: 1.2vh;
        transition: height 0.5s ease, padding 0.3s ease;
    }

    .accordion-item.active .accordion-content {
        height: auto;
        padding: 1.5vh 2vh;
    }

    .accordion-item.active .accordion-header i {
        transform: rotate(-180deg);
    }

    /* Download Our App  */
    .DownlaodOurApp {
        padding-top: 5vh;
    }

    .DownlaodOurAppMain {
        background-color: #111111;
        width: 100%;
    }

    .DownlaodOurAppMainRow {
        display: flex;
        width: 90%;
        flex-direction: column;
        margin: auto;
        padding: 4vh 0vh;
        align-items: center;
        gap: 7vh;
    }

    .DownlaodOurAppMainLeft {
        width: 100%;
    }

    .DownlaodOurAppMainLeft h2 {
        font-size: 2.87vh;
        font-weight: 600;
        line-height: 3.3vh;
        text-align: left;
    }

    .DownlaodOurAppMainLeft p {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.6vh;
        text-align: left;
        margin: 1.5vh 0vh;
    }

    .DownloadsCountMain {
        display: flex;
        gap: 7vh;
    }

    .DownloadsCountMainLeftRight h4 {
        font-size: 1.8vh;
        font-weight: 600;
        line-height: 2vh;
        text-align: left;
    }

    .DownloadsCountMainLeftRight p {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.6vh;
        text-align: left;
        margin: 0.5vh 0vh;
    }

    .DownlaodOurAppMainRight {
        width: 100%;
        position: relative;
    }

    .DownlaodOurAppMainRight img {
        width: 100%;
        display: flex;
        margin-left: 0%;
        margin: auto;
    }

    .forAndroid {
        position: absolute;
        top: 10%;
        left: 10%;
    }

    .forAndroid h2 {
        font-size: 3.8vh;
        font-weight: 600;
        line-height: 4.2vh;
        text-align: left;
    }

    .forAndroid p {
        font-size: 3.1vh;
        font-weight: 400;
        line-height: 3.5vh;
        text-align: left;

    }

    .forAndroid img {
        width: 12.2vh;
        height: auto;
        margin-top: 2vh;
        margin-left: 0vh;

    }

    /* Footer Portion  */
    .footerPortion {
        padding: 2vh 0vh;
    }

    .footerTop {
        display: flex;
        justify-content: start;
        align-items: center;
        /* Center items vertically */
        width: 90%;
        margin: auto;
        padding: 1vh 0vh;
        flex-wrap: wrap;
        /* Allow wrapping for smaller screens */
    }

    .logoFooter img {
        width: 6vh;
        height: auto;
        margin-right: 1.4vh;
        margin-left: 0vh;
    }

    .logoFooter span {
        font-size: 2.9vh;
        font-weight: 600;
        line-height: 2vh;
        text-align: left;

    }

    .footerTopPointss {
        width: 100%;
    }

    .writerFooterBorder {
        border-top: 0.1vh solid #2f2f2f;
        width: 100%;
        margin: auto;
        margin-top: 1.5vh;
    }

    .footerTopPoints {
        margin-top: 1.5vh;
        width: 33%;
    }

    .footerTopPoints a {
        text-decoration: none;
        font-size: 1.8vh;
        font-weight: 700;
        line-height: 4vh;
        text-align: center;
        display: inline-block;
    }

    .footerBorder {
        border-top: 0.1vh solid #2f2f2f;
        width: 90%;
        margin: auto;
    }

    .footerBottom {
        width: 90%;
        display: flex;
        margin: auto;
        justify-content: space-between;
        margin-top: 2vh;
        align-items: start;
        flex-direction: column;
        gap: 3vh;
    }

    .footerSocialIcons {
        display: flex;
        gap: 2vh;
    }

    .footerSocialIcons i {
        font-size: 2.5vh;
    }

    .footerSocialIcons p {
        font-size: 1.7vh;

    }

    .TermsReserved {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    .termsReservedPoints {
        display: flex;
        gap: 0.7vh;
        align-items: center;
        font-size: 1.4vh;
        font-weight: 400;
        line-height: 1.6vh;
        text-align: left;
        margin-bottom: 0.5vh;
        width: 40%;
        /* Optional: adds space between lines */
    }

    .termsReservedPoints h6 {
        font-size: 1.1vh;
        font-weight: 400;
        line-height: 1.6vh;
        text-align: left;
    }

    .termsReservedPoints a {
        text-decoration: none;
    }

    .termsReservedPointsMobiler {
        width: 40%;
        display: flex !important;
        gap: 1vh;
        margin-top: 1vh;
    }

    .termsReservedPoints1#ShowMobile {
        display: flex;
        flex-direction: row;
        width: 19%;
        margin-top: 0vh;
    }

    .termsReservedPoints2#ShowMobile {
        display: flex;
        flex-direction: row;
        width: 59%;
        margin-top: 0vh;
    }

    /* Privacy Page And Terms page */
    .topLandingPrivacyPolicy {
        background: url("/Assets/Images/privacyBG.png");
        background-size: cover;
        height: auto;
        width: 100%;
        padding-top: 2.5vh;
    }

    .privacyPolicy {
        width: 88%;
        margin: auto;
        padding-top: 5vh;
    }

    .privacyPolicy h2 {
        font-size: 3vh;
        font-weight: 600;
        line-height: 3.7vh;
        text-align: center;
    }

    .privacyPolicy h2 span {
        color: var(--secondaryGreen);
    }

    .privacyPolicyMain {
        padding-top: 4vh;
        padding-bottom: 3vh;
    }

    .privacyPolicyMain h5 {
        font-size: 1.58vh;
        font-weight: 500;
        line-height: 2vh;
        text-align: left;
        margin-bottom: 2vh;
    }

    .privacyPolicyMain h6 {
        font-size: 1.32vh;
        font-weight: 500;
        line-height: 2vh;
        text-align: left;
        margin-bottom: 2vh;
    }

    .privacyPolicyMain p {
        font-size: 1.08vh;
        font-weight: 400;
        line-height: 2vh;
        text-align: left;
        margin-bottom: 2vh;
    }




}