/* ================= FONT IMPORT ================= */
@font-face {
    font-family: 'AvertaStd';
    src: url('fonts/AvertaStd-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'AvertaStd';
    src: url('fonts/AvertaStd-RegularItalic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'AvertaStd';
    src: url('fonts/AvertaStd-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'AvertaStd-Semibold';
    src: url('fonts/AvertaStd-Semibold.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'AvertaStd-Light';
    src: url('fonts/AvertaStd-Light.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'AvertaStd-LightItalic';
    src: url('fonts/AvertaStd-LightItalic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
}
/* ================= GLOBAL ================= */
.elementor-section{
    display: none !important;
}
div#wrapper
 {
    padding-top: 0!important;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
p{
    margin: 0;
    padding: 0;
}
body {
    font-family: 'AvertaStd', sans-serif;
    background: #ffffff;
    color: #333;
}
a.btn:hover, a.faq-btn:hover{
    color: #fff;
}
a.btn-gary:hover{
    color: #574E48;
}
/* ================= HEADER ================= */
#site-header{
    display: none;
}
.header {
    background: #ffffff;
    padding: 0;
}
.moble-top-bar {
   display: none;
}
.moble-top-bar .contact-info{
    padding: 10px 10px;
}
.btn-froup {
    display: flex;
    gap: 10px;
}
.moble-top-bar .free-try {
    padding: 10px 10px;
    background-color: #47403B;
    border-radius: 0 0 10px 10px;
    display: flex;
    align-items: center;
}
.moble-top-bar .user-login {
    padding: 10px 20px;
    background-color: #F68F52;
   border-radius: 0 0 10px 10px;
}
.moble-top-bar .free-try a{
    text-decoration: none;
    color: #fff;
}
.top-bar {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0px 20px;
    display: flex;
    justify-content: flex-end;
}
.contact-info {
    background-color: #EAE9E8;
    padding: 10px 20px;
    border-radius: 0 0 10px 10px;
    display: flex;
    gap: 20px;
    align-items: center;
    flex-wrap: wrap;
}
.contact-info a{
    text-decoration: none;
    color: #574E48;
}
.header .container{
    padding: 0px 20px;
}
.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Logo */
.brand-logo img {
    height: 83px;
}

/* Nav */
.nav ul {
    list-style: none;
    display: flex;
    gap: 30px;
    margin: 0;
    padding: 0;
}
.nav ul li {
    position: relative;
}


.nav a {
    text-decoration: none;
    color: #47403B;
    font-family: 'AvertaStd-Semibold';
    font-weight: 400;
    font-size: 20px;
    display: flex;
}

/* Buttons */
.header-actions {
    display: flex;
    gap: 10px;
}

.btn {
    font-family: 'AvertaStd';
    font-size: 18px;
    padding: 15px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    display: inline-block;
}
.btn-small{
    padding: 12px 20px;
}
.btn-dark {
    background: #3b3432;
    color: #fff;
}

.btn-orange {
    background: #F68F52;
    color: #fff;
}
.btn-gary{
    background: #EAE9E8;
    color: #574E48;
    display: flex;
    align-items: center;
    gap: 5px;
}
.btn-outline{
    color: #fff;
    background-color: #ffffff00;
    border: 1px solid #F68F52;
}
.divider {
    width: 1px;
    height: 18px;
    background: #574E48;
     margin: 0 3px;
}
.free{
    position: relative;
}
.free span{
    position: absolute;
    display: block;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 14px;
    margin-left: 10px;
}
/* Hamburger */
.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 5px;
}

.hamburger span {
    width: 47px;
    height: 2px;
    background: #47403B;
}

/* ================= OFFCANVAS ================= */
.offcanvas {
    position: fixed;
    top: 0;
    left: -100%;
    width: 280px;
    height: 100%;
    background: #fff;
    transition: 0.3s;
    z-index: 1000;
}

.offcanvas.active {
    left: 0;
}

.offcanvas-inner {
    padding: 20px;
}

.offcanvas ul {
    list-style: none;
    padding: 0;
}

.offcanvas li {
    margin-bottom: 20px;
}

.offcanvas a {
    text-decoration: none;
    font-size: 18px;
    color:#47403B;
}
.offcanvas a.btn {
    color:#ffffff;
}

/* Close */
#closeMenu.close-btn {
    background: none;
    border: none;
    font-size: 30px;
    float: right;
    cursor: pointer;
    color:#47403B;
    padding: 10px;
}

/* Overlay */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    display: none;
    z-index: 999;
}

.overlay.active {
    display: block;
}

/* Mobile */
@media (max-width: 992px) {
    .nav,
    .header-actions {
        display: none;
    }

    .hamburger {
        display: flex;
    }
}
/* header section end*/


.btn-with-icon1::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 8px;
    background: url('./img/btn-aro1.svg') no-repeat center;
    background-size: contain;
    vertical-align: middle;
}
.btn-with-icon2::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 8px;
    background: url('./img/btn-aro2.svg') no-repeat center;
    background-size: contain;
    vertical-align: middle;
}


/* Container */
.container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 50px 20px;
}
.container-full {
    max-width: 2000;
}

/* ================= HERO ================= */
.hero {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 40px;
    padding-bottom: 60px;
}


.hero-left {
    flex: 0 0 45%;
    max-width: 40%;
    min-width: 300px;
}

.hero-right {
    flex: 0 0 55%;
    max-width: 60%;
}


/* Top line */
.hero-top {
    font-size: 14px;
    color: #47403B;
    margin-bottom: 15px;
    font-weight: 400;
}
.hero-top span{
    color: #F68F52;

}


/* Heading */
.hero h1 {
    font-family: 'AvertaStd';
    font-weight: 800; /* ExtraBold */
    font-size: 60px;
    color: #47403B;
    margin-bottom: 15px;
    line-height: 60px;
}

.hero h1 span {
    display: block;
}

/* Sub Heading */
.sub-text {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-style: italic;
    color: #F68F52;
    font-size: 24px;
    margin-bottom: 20px;
}
.hero .sub-text span{
    font-weight: 700 !important;
}
/* Paragraph */
.description {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 17px;
    line-height: 1.6;
    color: #47403B;
    margin-bottom: 20px;
}
.description span{
    font-weight: 500;
}
/* Features */
.features {
    font-family: 'AvertaStd-Semibold';
    font-size: 16px;
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    line-height: 22px;
}

.features span {
    border-right: 1px solid #F68F52;
    padding-right: 10px;
}

.features span:last-child {
    border-right: none;
}

/* Buttons */
.buttons {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.note {
    font-family: 'AvertaStd';
    font-size: 16px;
    color: #777;
    margin-top: 10px;
    font-style: italic;
}

/* ================= SLIDER ================= */
.hero-right {
    flex: 1;
    min-width: 300px;
}

.slider {
    overflow: hidden;
}

.slides {
    display: flex;
    transition: 0.5s ease-in-out;
}
.slide img {
    width: 100%;
    display: block;
}
@media (min-width: 768px) {
.slide {
    min-width: 100%;
}
}

/* MOBILE ONLY */
@media (max-width: 768px) {

    .slider {
        overflow: hidden;
        padding-left: 10px; /* left spacing */
    }

    .slides {
        display: flex;
        gap: 12px;
        transition: transform 0.3s ease;
    }

    .slide {
        flex: 0 0 90%;
    }

    .slide img {
        width: 100%;
        border-radius: 12px;
    }
}

/* Dots */
.dots {
    text-align: center;
    margin-top: 10px;
}

.dot {
    height: 8px;
    width: 8px;
    margin: 0 4px;
    display: inline-block;
    background: #ccc;
    border-radius: 50%;
    cursor: pointer;
}

.dot.active {
    background: #F68F52;
}

/* LOG SECTION */
.brand .logo {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 50PX;
    margin-bottom: 20px;
}
.brand .brandtext {
    font-family: 'AvertaStd-Light';
    font-size: 20px;
    font-weight: 300;
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
    line-height: 22px;
}
.brand .brandtext span{
    font-family: 'AvertaStd';
        border-right: 1px solid #F68F52;
    padding-right: 10px;
}
.brand .brandtext span span{
    font-family: 'AvertaStd-Light';
}
.brand .brandtext span:last-child {
    border-right: none;
}
/* section 2 */
.container-full.bg-dark{
    background-color: #47403B;

}
.features2 {
    text-align: center;

}
.features2 h2{
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 35px;
    color:#F68F52
}
.features2 h2 span{
    color:#ffffff;
    font-style: italic;
    padding: 0;
}
.features2 p{
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 22px;
    line-height: 49px;
    color: #FFF;
    padding: 0;
}
.features2 p span{
    color:#F68F52;
    font-style: italic;
}
/* tab css */

.tabs-wrapper {
    display: flex;
    gap: 40px;
    margin-top: 40px;
    margin-bottom: 40px;
}

/* LEFT */
.tabs-left {
    flex: 0 0 45%;
    max-width: 40%;
    display: flex;
}
.tabs-right{
    flex: 0 0 55%;
    max-width: 60%;
}
/* Main Tabs */
.main-tabs {
    
    list-style: none;
    padding: 0;
    flex: 0 0 50%;
    max-width: 50%;
}
.tab-summery {
    display: none;
}

.tab-summery.tab-active {
    display: block !important;
}

.main-tabs li.active::after {
        content: "";
    display: inline-block;
    width: 42px;
    height: 36px;
    margin-left: 8px;
    background: url(./img/tab-aro1.svg) no-repeat center;
    background-size: contain;
    vertical-align: middle;
    position: absolute;
    top: 22px;
    right: 0;
}

.main-tabs li {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 22px;
    cursor: pointer;
    padding: 12px 0;
    color: #ddd;
    line-height: 23px;
}

.main-tabs li span {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 18px;
    display: block;
    font-size: 14px;
    color: #ffffff;
}

.main-tabs li.active {
    color: #ff8a4d;
    position: relative;
}

/* Step Tabs */
.step-content {
    display: none;
    margin-top: 20px;
}

.step-content.active {
    display: block;
}

.steps {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
    flex-direction: column;
}

.step {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 22px;
    cursor: pointer;
    color: #ffffff;
    line-height: 40px;
}

.step.active {
    color: #ff8a4d;
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 22px;
    line-height: 40px;
}
.step.active::after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 20px;
    margin-left: 15px;
    background: url(./img/tab-aro2.svg) no-repeat center;
    background-size: contain;
    vertical-align: middle;
}


.desc {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #ffffff;
    max-width: 300px;
}

/* RIGHT */
.tabs-right {
    flex: 1;
}

.tabs-right img {
    width: 100%;
    border-radius: 15px;
}

.fcta{
    display: flex;
    gap: 40px;
    margin-top: 40px;
    margin-bottom: 40px;
}
.fcta .left{
    flex: 0 0 45%;
    max-width: 40%;
}

.summery {
    font-family: 'AvertaStd-Semibold';
    font-size: 16px;
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}
.summery div {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 19px;
    border-right: 1px solid #F68F52;
    padding-right: 10px;
    color: #fff;
}
.summery div span {
    font-family: 'AvertaStd-Light';
    display: block;
}
.summery div:last-child {
    border-right: none;
}

/* ================= SERVICES ================= */
.services {
    background: #ffffff;
    padding: 80px 20px;
}
.services h2{
    color: #47403B;
    text-align: center;
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 14px;
    text-transform: uppercase;
}
.services h2 span{
    font-family: 'AvertaStd-Semibold';
    font-weight: 400;
}
.services p.sub-heading{
    color: #F68F52;
    font-family: 'AvertaStd-LightItalic';
    font-style: italic;
    font-weight: 400;
    font-size: 21px;
    text-align: center;
    margin-bottom: 40px;
}
.services-wrapper {
    display: flex;
    gap: 50px;
    /* align-items: center; */
}

/* LEFT */
.services-tabs {
    flex: 1;
}

.services-tabs ul {
    list-style: none;
    padding: 0;
    padding-bottom: 20px;
}

.services-tabs li {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 25px;
    margin-bottom: 15px;
    cursor: pointer;
    color: #47403B;
    transition: 0.3s;
}

.services-tabs li.active {
    color: #F68F52;
}

.btn-light {
    color: #47403B !important;
}

/* RIGHT */
.services-content {
    flex: 2;
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
}

.content-inner {
    display: flex;
    align-items: center;
    gap: 40px;
}

.image-box {
    position: relative;
    border-radius: 10px;
}

/* Image */
.image-box img {
    width: 300px;
    border-radius: 15px;
}
.image-box .tags{
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 15px;
}
.image-box .tag{
    color: #47403B;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 17px;
    background-color: #fff;
    padding: 10px;
    border-radius: 5px;
    margin-top: 10px;
    display: table;
}
/* Text */
.text-box p {
    color: #47403B;
    margin-bottom: 15px;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 22px;
    line-height: 30px;
}

.text-box a {
    color: #47403B;
    text-decoration: none;
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 21px;

}

.service-lnk {
    display: inline-flex;
    align-items: center;
    gap: 15px;
}


.service-lnk::after {
    content: "";
    display: inline-block;
    width: 42px;
    height: 36px;
    margin-left: 8px;
    background: url('./img/big-arrow.svg') no-repeat center;
    background-size: contain;
    vertical-align: middle;
    position: relative;
}

/* ================= CTA SECTION ================= */
.cta {
    background: url('./img/cta-bg.webp') no-repeat center right;
    background-size: cover;
    padding: 100px 0;
}

.cta-wrapper {
    display: flex;
    align-items: center;
}

/* Content */
.cta-content {
    max-width: 550px;
}

/* Heading */
.cta-content h2 {
    color: #47403B;
    margin-bottom: 10px;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 35px;


}

/* Sub Heading */
.cta-content h3 {
    font-family: 'AvertaStd-LightItalic';
    font-size: 26px;
    font-style: italic;
    color: #F68F52;
    margin-bottom: 20px;
    font-weight: 400;
}

/* Paragraph */
.cta-content p {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 22px;
    line-height: 1.7;
    color: #5a5552;
    margin-bottom: 20px;
    line-height: 25px;
}

/* Button */
.mt-10 {
    margin-top: 10px;
}

/* testimonial-section */
.testimonial-section {
    padding: 60px 0px;
    text-align: center;
    background: #ffffff;
}

.heading {
    color: #47403B;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 35px;
    margin-bottom: 5px;
}

.subheading {
    font-family: 'AvertaStd-LightItalic';
    color: #F68F52;
    margin-bottom: 40px;
    font-style: italic;
    font-weight: 400;
    font-size: 26px;
}


.testimonial-slider {
    overflow: hidden;
    position: relative;
}

.testimonial-slides {
    display: flex;
    transition: transform 0.5s ease;
}

.testimonial-item {
    min-width: 50%;
    padding: 10px;
    display: flex;
    justify-content: center;
}

.testimonial-inner {
    display: flex;
    gap: 10px;
    max-width: 900px;
    align-items: stretch;
}

.image-box {
    flex: 0 0 290px;
    border-radius: 15px;
    overflow: hidden;
}

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

.content {
    text-align: left;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.quote {
    color: #47403B;
    margin-bottom: 20px;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 23px;
    line-height: 26px;
}

.author h4 {
    color: #47403B;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 31px;
    margin: 10px 0 5px;
}

.author p {
    color: #47403B;
    font-family: 'AvertaStd-Light';
    font-style: italic;
    font-weight: 400;
    font-size: 20px;
}

.line {
    display: block;
    width: 40px;
    height: 1px;
    background: #F68F52;
    margin-bottom: 10px;
}

/* Controls */
.testimonial-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    gap: 15px;
}

.testimonial-controls button {
    background-color: #ffffff;
    border: none;
    cursor: pointer;
    padding: 0;
}

.testimonial-prev,
.testimonial-next {
    width: 50px;
    height: 20px;
    border: none;
    cursor: pointer;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.testimonial-prev {
    background-image: url('./img/slide-pre.svg');
}

.testimonial-next {
    background-image: url('./img/slide-next.svg');
}


.testimonial-dots {
    display: flex;
    gap: 6px;
}

.testimonial-dots span {
    width: 10px;
    height: 10px;
    background: #D9D9D9;
    border-radius: 50%;
    cursor: pointer;
}

.testimonial-dots span.active {
    background: #47403B;
}

/* pricing-section */
.pricing-section {
    background: #F68F52;
    padding: 80px 20px 5px 20px;
    text-align: center;
    color: #333;
}
.pricing-section ul.tab-buttons {
    display: flex;
    justify-content: center;;
    list-style: none;
}
.pricing-section .tab-title{
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 22px;
    padding: 10px;
}
li#essential {
    position: relative;
}
#essential::before{
    content: "Most Popular";
    position: absolute;
    margin-top: -32px;
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 13px;
    text-transform: uppercase;
    color: #fff;
    margin-left: 10px;
}
.pricing-section .tab-title.active{
    background-color: #fff;
    border-radius: 10px 10px 0px 0px;
}

.pricing-section .title {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 36px;
    margin-bottom: 10px;
}

.pricing-section .subtitle {
    font-family: 'AvertaStd-LightItalic';
    font-style: italic;
    font-size: 26px;
    margin-bottom: 50px;
    color: #fff;

}

.pricing-section .container {
    max-width: 1150px;
    margin: auto;
}

/* FLEX LAYOUT */
.pricing-section .pricing-wrapper {
    display: flex;
    gap: 30px;
    justify-content: center;
    flex-wrap: wrap;
    align-items: flex-start;
}

/* CARD */
.pricing-section .pricing-card {
    flex: 0 0 320px; /* fixed base width */
    text-align: left;
}

.pricing-section .pricing-card .box{
    background: #ffffff;
    padding: 30px;
    border-radius: 16px;
    width: 100%;
    position: relative;
    
}
.pricing-card.featured {
    flex: 0 0 380px; /* slightly bigger */
}

.pricing-section .pricing-card h3 {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 26px;
    margin-bottom: 5px;
    text-align: left;
}

.pricing-section .plan-sub {
    font-family: 'AvertaStd-Light';
    font-style: italic;
    font-weight: 400;
    font-size: 23px;
    color: #47403B;
    text-align: left;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}

.pricing-section .pricing-card ul {
    list-style: none;
    padding: 0;
    text-align: left;
    margin-bottom: 25px;
}

.pricing-section .pricing-card ul li {
    font-family: 'AvertaStd-Light';
    font-size: 18px;
    margin-bottom: 10px;
}



.pricing-section .badge {
    font-family: 'AvertaStd';
    color: #F68F52;
    font-size: 13px;
    text-transform: uppercase;
    position: absolute;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
}

/* BUTTON */
.pricing-section .btn {
    background: #47403B;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    display: inline-block;
    font-family: 'AvertaStd';
    font-size: 18px;
    margin-top: 20px;
}

/* NOTES */
.pricing-section .pricing-notes {
    font-size: 13px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

.pricing-section .pricing-notes span {
    width: 48%;
    text-align: left;
    font-family: 'AvertaStd-Light';
    font-style: italic;
    font-size: 17px;
    border-left: 1px solid #F68F52;
    line-height: 17px;
    padding-left: 5px;
}

/* SELECT */
.pricing-section select {
    padding: 4px;
    border-radius: 5px;
    font-size: 23px;
    font-family: 'AvertaStd-Light';
    font-style: italic;
    margin-left: 10px;
   width: 113px;
}

.pricing-section .pricing-term{
    font-family: 'AvertaStd-Light';
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding-bottom: 20px;
    justify-content: center;
}
.pricing-section .pricing-term span{
    border-right: 1px solid #574E48;
    padding-right: 10px;
}
.pricing-section .pricing-term span:last-child{
    border-right: none;
}

/* faq */
/* ================= FAQ ================= */
section.faq .container{
    padding-top: 0;
}
.faq {
    background: #F68F52;
    padding: 0px 0px;
    color: #47403B;
}

.faq-title {
    text-align: center;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 36px;
    margin-block-start: 0;
}

/* Layout */
.faq-wrapper {
    display: flex;
    gap: 40px;
}

.faq-column {
    flex: 1;
}

/* Item */
.faq-item {
    border-bottom: 1px solid rgba(255,255,255,0.4);
    padding: 15px 0;
}

/* Question */
.faq-question {
    font-size: 18px;
    cursor: pointer;
    position: relative;
    font-family: 'AvertaStd-Light';
}

/* Answer */
.faq-answer {
    font-family: 'AvertaStd-Light';
    font-size: 18px;
    max-height: 0;
    overflow: hidden;
    transition: 0.2s ease;
    font-size: 15px;
    color: #fff;
}

/* Active */
.faq-item.active .faq-answer {
    max-height: 100px;
    margin-top: 10px;
     font-family: 'AvertaStd-Light';
    font-size: 18px;
}

/* Button */
.faq-btn-wrap {
    text-align: center;
    margin-top: 40px;
}

.faq-btn {
    display: inline-block;
    background: #47403B;
    color: #fff;
    padding: 14px 24px;
    border-radius: 6px;
    text-decoration: none;
    font-family: 'AvertaStd-Semibold';
    font-size: 18px;
    text-transform: uppercase;
}

/* ================= RESOURCES ================= */
.resources {
    padding: 80px 0;
    background: #f5f5f5;
}

/* Heading */
.resources-head {
    text-align: center;
    margin-bottom: 40px;
}

.resources-head h2 {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 35px;
    color: #47403B;
}

.resources-head p {
    font-family: 'AvertaStd-LightItalic';
    font-weight: 400;
    font-size: 26px;
    text-align: center;
    font-style: italic;
    color: #F68F52;
    margin-top: 5px;
}

/* Grid */
.resources-grid {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
}

.resource-item {
    flex: 1;
    min-width: 280px;
}

/* Title */
.resource-title {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 24px;
    display: inline-block;
    color: #47403B;
    text-decoration: none;
    margin-bottom: 10px;
}

/* Image */
.resource-img img {
    width: 100%;
    border-radius: 12px;
    display: block;
    transition: 0.3s;
}

/* Hover */
.resource-img:hover img {
    transform: scale(1.03);
}

/* Text */
.resource-item p {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 18px;
    margin-top: 15px;
    color: #47403B;
    line-height: 1.6;
}


/* book-demo */
/* ================= DEMO CTA ================= */
.demo {
    background: #FDE9DC;
    padding: 50px 0;
    text-align: center;
}

.demo-content {
    max-width: 800px;
    margin: 0 auto;
}

/* Heading */
.demo h2 {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 36px;
    color: #47403B;
    margin-bottom: 10px;

}

/* Sub heading */
.demo h3 {
    font-family: 'AvertaStd-LightItalic';
    font-weight: 400;
    font-size: 26px;
    text-align: center;
    font-style: italic;
    color: #F68F52;
    margin-bottom: 20px;
}

/* Description */
.demo-desc {
    font-family: 'AvertaStd-Light';
    font-size: 18px;
    color: #555;
    margin-bottom: 30px;
    line-height: 1.6;
    font-weight: 400;
    line-height: 22px;
}

/* Buttons */
.demo-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.btn-group {
    display: flex;
    flex-direction: column;
    align-items: center;
}


/* Small text */
.btn-group span {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 16px;
    font-style: italic;
    color: #47403B;
    margin-top: 8px;

}

/* Bottom line */
.demo-bottom {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 20px;
    letter-spacing: 1%;
    margin-top: 30px;
    color: #000000;
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.demo-bottom div {
    position: relative;
    padding: 0 10px;
}
.demo-bottom div span{
    color: #5a5552;
}

.demo-bottom div:not(:last-child)::after {
    content: "|";
    position: absolute;
    right: -10px;
    color: #F68F52;
}

/* Footer Css */
/* ================= FOOTER ================= */

.footer {
    background: #47403B;
    color: #fff;
    padding: 50px 0 10px;
}

.footer a {
    color: #ddd;
    text-decoration: none;
}

.footer h4 {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 20px;
    color: #F68F52;
    margin-bottom: 15px;
}

/* TOP LAYOUT */
.footer-top {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: wrap;
}

/* LEFT GROUP (4 columns) */
.footer-left {
    display: flex;
    flex: 1;
    gap: 20px;
    flex-wrap: wrap;
    flex-direction: column;
}
.left-top {
    display: grid;
    grid-auto-flow: column;
}
.footer-col {
    flex: 1 1 180px;
}

/* LIST */
.footer-col ul {
    list-style: none;
    padding: 0;
}

.footer-col li {
    margin-bottom: 10px;
}

.footer-col li a {
    font-family: 'AvertaStd-Light';
    font-size: 18px;
}

/* RIGHT INFO */
.footer-info {
    flex: 0 0 320px;
}

.footer-info p {
    font-family: 'AvertaStd-Light';
    font-size: 18px;
    line-height: 30px;
}

.footer-logo {
    height: 63px;
    margin-bottom: 15px;
}

/* SUBSCRIBE */
.subscribe p {
    margin: 15px 0 10px;
    color: #F68F52;
}

.subscribe-box {
    display: flex;
    overflow: hidden;
    border-radius: 4px;
}

.subscribe-box input {
    flex: 1;
    padding: 8px 16px;
    border: none;
    outline: none;
    border-radius: 6px 0px 0px 6px;
}

.subscribe-box button {
    background: #F68F52;
    border: none;
    color: #fff;
    padding: 10px 15px;
    cursor: pointer;
    border-radius: 0px 6px 6px 0px;
}

/* CERTIFICATIONS */
.footer-cert {
    margin-bottom: 40px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

.footer-cert img {
    height: 43px;
}

/* BOTTOM */
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.footer-links {
    display: flex;
    gap: 15px;
}
.footer-links a:not(:last-child)::after {
    content: "|";
    color: #F68F52;
    margin-left: 15px;
}

.social {
    display: flex;
    gap: 10px;
}

.social img {
    width: 32px;
    height: 32px;
    background: #F68F52;
    padding: 5px;
    border-radius: 4px;
}

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

@media (max-width: 1024px) {
    .footer-info {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .footer{
        padding: 0;
    }
    .left-top {
        grid-auto-flow: unset; /* reset */
        grid-template-columns: repeat(2, 1fr);
        gap: 10px; /* optional spacing */
    }

    .footer-top {
        flex-direction: column;
    }

    .footer-left {
        flex-direction: column;
        gap: 20px;
    }
    .left-bottom{
        border-bottom: 1px solid #F68F52
    }
    .footer-bottom {
        flex-direction: column-reverse;
        align-items: flex-start;
        margin-top: 20px;
    }

    .footer-links {
        justify-content: center;
    }

    .social {
        justify-content: center;
    }
}

/* Responsive */
@media (max-width: 767px) {
    .moble-top-bar {
        display: flex;
        gap: 5px;
        margin-bottom: 20px;
        justify-content: space-between;
        padding: 0 20px;
    }

    .top-bar {
        display: none; /* hide on mobile */
    }
}




/* Responsive */
@media (max-width: 768px) {
    .demo-bottom{
        gap: 5px;
    }
    .demo h2 {
        font-size: 30px;
    }

    .demo-buttons {
        flex-direction: column;
        gap: 15px;
    }
    .demo h3{
        font-size: 20px;
    }
    .demo-bottom div:not(:last-child)::after {
        content: none;
    }
}

/* Responsive */
@media (max-width: 768px) {
    .faq-wrapper {
        flex-direction: column;
        gap: 0;
    }
    .faq-title{
        text-align: left;
        padding-top: 30px;
    }
}


/* RESPONSIVE */
@media (max-width: 992px) {
    .pricing-section .featured {
        transform: none;
    }
}

@media (max-width: 768px) {
    .pricing-section .pricing-wrapper {
        flex-direction: column;
        align-items: center;
    }

    .pricing-section .pricing-card {
        width: 100%;
        max-width: 400px;
    }
    .pricing-section .pricing-term{
        justify-content: start;
        padding-left: 20px;
    }
    .pricing-section .pricing-term span{
        border-right: none;
        color: #47403B;
    }
    .pricing-section .subtitle{
        font-size: 20px;
    }
}

@media only screen and (min-width: 811px) {
  .pricing-section .mobile-tab-price{
    display: none !important;
  }
}
@media only screen and (max-width: 811px) {
  .pricing-section .pricing-card {
    flex: 0 0 380px;
}
}

/* Responsive */
@media (max-width: 768px) {
    .testimonial-item{
        min-width: 100%;
    }
}
@media (max-width: 425px) {
    .testimonial-inner {
        flex-direction: column;
        text-align: center;
    }

    .content {
        text-align: left;
    }
    img.desktop{
        display: none;
    }
}

/* Responsive */
@media (max-width: 768px) {
    .cta {
        background: url(./img/cta-bg-mobile.webp) no-repeat center top;
        background-position: top;
        padding-top: 20px;
        padding-bottom: 350px;
        background-size: cover;
    }

    .cta-content h2 {
        font-size: 30px;
    }
    .cta-content h3{
        font-size: 20px;
    }
    .cta-content p{
        font-size: 18px;
    }
}

/* Responsive */
@media (max-width: 768px) {
    .services-wrapper {
        flex-direction: column;
    }

    .content-inner {
        flex-direction: column;
        text-align: center;
    }

    .image-box img {
        width: 100%;
        height: 400px;
    }
}
@media only screen and (min-width: 426px) {
  img.mobile{
    display: none;
  }
}
@media only screen and (max-width: 426px) {
  .image-box {
        min-height: 337px !important;
    }
    .image-box img.mobile {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

/* Responsive */
@media(max-width: 768px) {
    .tabs-wrapper {
        flex-direction: column;
        display: none;
    }
    .fcta{
        flex-direction: column-reverse;
        gap: 0px;

    }
    .fcta .right{
        display: none;
    }
    .fcta .left {
    flex: 0 0 100%;
    max-width: 100%;
    }
    .tabs-left {
    flex: 0 0 100%;
    max-width: 100%;
    }
    .tabs-right {
    flex: 0 0 100%;
    max-width: 100%;
    }
}

/* ================= RESPONSIVE ================= */
@media (max-width: 768px) {
    .hero {
        flex-direction: column-reverse;
    }

    .hero h1 {
        font-size: 50px;
    }
    .hero-left,
    .hero-right {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .brand .brandtext span{
        border-right: 0;
        display: inline-block;  
    }
    .brand .brandtext span::after{
        content: "";
        width: 50px;
        border-bottom: 1px solid #F68F52;
        height: 10px;
        display: block;
        margin: auto;  
    }
    .brand .brandtext span:last-child::after {
    border-bottom: none;
    }
    .services h2, .services p.sub-heading{
        text-align: left;
        display: inline-block;
    }
    .image-box {
        width: stretch;
        min-height: 500px;
    }
    .testimonial-section{
        padding: 0;
    }
    .testimonial-section .heading{
        text-align: left;
        font-size: 30px;
    }
    .testimonial-section .subheading{
        text-align: left;
        font-size: 20px;
    }
    .pricing-section{
        padding: 0;
    }
    .pricing-section .container{
        text-align: left;
    }
    .features2 h2{
        font-size: 30px;
        text-align: left;
    }
    .features2 p{
         font-size: 18px;
        text-align: left;
    }
}


/* MOBILE ONLY */

.mob-item {
    border-bottom: 1px solid #F68F52;
    padding: 15px 0;
}
.mob-item.active h3{
    color: #F68F52;
}

/* HEADER */
.mob-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.mob-head h3 {
    font-family: 'AvertaStd';
    font-weight: 400;
    font-size: 20px;
    color: #ffffff;
    font-size: 18px;
}

.mob-head span {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 16px;
    font-size: 14px;
    color: #ffffff;
}

.arrow {
    width: 20px;
    height: 20px;
    background-image: url('./img/down.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: transform 0.3s ease;
}

/* Rotate when active */
.mob-item.active .arrow {
    transform: rotate(180deg);
}

/* CONTENT */
.mob-content {
    display: none;
    margin-top: 15px;
}

.mob-item.active .mob-content {
    display: block;
}

/* SLIDER */
.mob-slider {
    overflow: hidden;
    border-radius: 12px;
}

.mob-slides {
    display: flex;
    transition: 0.4s;
    gap: 12px;
}
.ste-box {
    flex: 0 0 90%;
    flex-shrink: 0;
    border-radius: 10px;
}
.step-title {
    text-align: right;
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 16px;
    color: #F68F52;

}

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

/* DOTS */
.mob-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 8px;
}

.mob-dots span {
    width: 6px;
    height: 6px;
    background: #aaa;
    border-radius: 50%;
}

.mob-dots span.active {
    background: #F68F52;
}

/* TEXT */
.mob-content p {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 18px;
    margin: 15px 0;
    color: #ffffff;
}

/* STATS */
.mob-stats {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
}

.mob-stats span {
    font-family: 'AvertaStd-Light';
    font-weight: 400;
    font-size: 16px;
    color: #fff;
    border-right: 1px solid #F68F52;
    padding: 0 10px;
}

.mob-stats span:last-child {
    border: none;
}

/* HIDE ON DESKTOP */
@media (min-width: 769px) {
    .mobile-raper {
        display: none;
    }
   
}
@media (max-width: 600px) {
     .resources-grid {
        flex-direction: column;
    }
}

/* app screenshot section */
/* MOBILE / TABLET ONLY */
/* Hide mobile section on desktop */
.services-mobile {
    display: none;
}

@media (max-width: 1024px) {

    .services-wrapper {
        display: none; /* hide desktop version */
    }

    .services-mobile {
        display: block;
        overflow: hidden;
    }

    .services-mob-slider {
        overflow: hidden;
    }

    .services-mob-track {
        display: flex;
        gap: 16px;
        transition: transform 0.3s ease;
        margin-bottom: 30px;
    }

    .services-mob-item {
        flex: 0 0 85%; /* 👈 peek next */
        background: #fff;
        border-radius: 16px;
    }

    .services-mob-item h3 {
        font-family: 'AvertaStd';
        font-weight: 400;
        font-size: 26px;
        color: #F68F52;
        margin-bottom: 10px;
        min-height: 64px;
    }

    .image-box-m {
        position: relative;
    }

    .image-box-m img {
        width: 100%;
        border-radius: 12px;
    }

    .tags {
        position: absolute;
        bottom: 10px;
        left: 10px;
    }

    .tags span {
        font-family: 'AvertaStd-Light';
        font-weight: 400;
        font-size: 14px;
        display: block;
        background: #fff;
        padding: 6px 10px;
        margin-bottom: 6px;
        border-radius: 6px;
    }

    .services-mob-item p {
        font-family: 'AvertaStd-Light';
        font-weight: 400;
        font-size: 18px;
        line-height: 23px;
        color: #47403B;
        margin: 10px 0;
        
    }

    .services-mob-item a {
        font-weight: 400;
        font-size: 18px;
        color: #47403B;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 15px;
    }
    .services-mob-item a::after {
    content: "";
    display: inline-block;
    width: 42px;
    height: 36px;
    margin-left: 8px;
    background: url(./img/big-arrow.svg) no-repeat center;
    background-size: contain;
    vertical-align: middle;
    position: relative;
    }

    /* DOTS */
    .services-mob-dots {
        display: flex;
        margin-bottom: 20px;
        gap: 6px;
    }

    .services-mob-dots span {
        width: 6px;
        height: 6px;
        background: #ccc;
        border-radius: 50%;
    }

    .services-mob-dots span.active {
        background: #F68F52;
    }
}

/* sub menu css */
.nav .sub-menu {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    width: max-content;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.17);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.25s ease;
    z-index: 100;
}

/* Show on hover */
.nav ul li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Submenu items */
.sub-menu-item {
    list-style: none;
}

.sub-menu-item a {
    display: block;
    padding: 5px 18px;
    font-size: 14px;
    color: #47403B;
    transition: 0.2s;
    font-size: 18px;
}
svg.e-font-icon-svg.e-fas-caret-down {
    width: 11px;
    margin-left: 10px;
}

/* Hover effect */
.sub-menu-item a:hover {
    color: #F68F52;
}

/* video model  */
.video-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.video-modal.active {
    display: flex;
}

/* Dark overlay */
.video-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.8);
}

/* Video box */
.video-content {
    position: relative;
    width: 90%;
    max-width: 800px;
    z-index: 2;
}

.video-content video {
    width: 100%;
    border-radius: 10px;
}

/* Close button */
.video-close {
    position: absolute;
    top: -30px;
    right: 0;
    font-size: 30px;
    color: #fff;
    cursor: pointer;
}

/* footer subscriber css */
.info{
    margin-top:5px;
    font-size:14px;
    font-family: 'AvertaStd-Light';
}

.info.success{
    color:#00b67a;
}

.info.error{
    color:#ff4d4f;
}
.subscribe-box [type=submit]:focus{
    background-color: #F68F52;
}

/* mobile sub menu css */
/* Mobile Sub Menu */
.offcanvas .sub-menu {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition:
        max-height 0.35s ease,
        opacity 0.25s ease;
    padding-left: 15px;
    
}
.offcanvas li.sub-menu-item{
    margin-bottom: 0;
}

/* Active Dropdown */
.offcanvas li.active > .sub-menu {
    max-height: 500px;
    opacity: 1;
    visibility: visible;
    margin-top: 10px;
}

/* Arrow */
.offcanvas li svg {
    width: 12px;
    height: 12px;
    transition: transform 0.3s ease;
    margin-left: auto;
}

/* Rotate Arrow */
.offcanvas li.active > a svg {
    transform: rotate(180deg);
}

/* Parent Link */
.offcanvas li > a {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Submenu Item */
.offcanvas .sub-menu li a {
    padding: 10px 0;
    display: block;
}