.navbar{
    position: fixed;
    width: 100%;
    z-index: 2;
}
.main_header_menu{
    padding-top: 6px;
    height: 115px;
}
.yarra_logo {
    position: relative;
    width: 151px;
    height: 74px;
    top: 8px;
    margin-bottom: 10px;
}
.login_menus{
    text-decoration: underline !important;
    margin-right: 50px;
}
.free_demo_button {
    background: #FFB400;
     position: relative;
     height: 50px;
     width: 116px;
     font-family: Poppins;
     color: #FFFFFF;
     line-height: 35px;
}
.free_demo_button:hover {
    background: #FFB400;
}
.nav-link {
    font-family: 'Questrial', sans-serif;
    font-weight: 600;
    font-size: 17px;
    line-height: 15px;
    text-align: left;
    position:relative;
    left: 50px;
    text-decoration: none;
    color: #1F2937;
}
.hover{
    color: #FFB400 !important;
}
.hover::after {
    content: ''; 
    position: absolute;
    width: 100%;
    height: 80px;
    left: 0; 
    background-color: transparent; 
}
.hover:hover::after {
    border-bottom: 3px solid #FFB400;
    height: 66px; 
}
.container_parple-bg {
    background-image: url('../images/Yaraa-Purple-Background.png');
    background-size: cover; 
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
    padding: 30px 0; /* vertical padding instead of fixed left/right */
    
}
.main_banner_class{
    margin-top: 60px !important;
}
.girl_img {
    margin-top: 80px;
}

@media (min-width: 768px) {
    .container_parple-bg {
        height: 730px;
    }
    .girl_img {
        margin-top: 100px;
    }
}
@media (max-width: 1300px) {
    .girl_img {
        width: 100%;
    }
}
.parple-bg_heading {
    font-family: Poppins;
    font-size: 48px;
    line-height: 54px;
    color: #FFFFFF;
    font-weight: 400;
    margin-top: 55px;
}

@media (max-width: 992px) {
    .parple-bg_heading {
        font-size: 36px;
        line-height: 44px;
    }
}

.try_now_button {
    width: 240px;
    height: 66px;
    border-radius: 4px;
    font-weight: 600;
    background: #FFB400;
    color: #FFFFFF;
    font-size: 24px;
    margin-top: 68px;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
}

.try_now_button:hover {
    background: #FFB400;
}
.section_text{
    font-family: Poppins;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    text-align: center;
    margin-left: 80px;
    margin-right: 80px;
}
.section_head{
    font-family: Poppins;
}
.custom-tick {
    color: #F17E01 !important;
  }
.ai_text{
    width: 100%;
    font-family: Poppins;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;    
}
.phone_image{
    max-width: 100%;
  height: auto
}
.image_phone_left {
    padding-left: 110px; /* Adjust the value as needed */
}
.image_phone_right img {
    margin-left: 30px;
}

.paregraph{
    font-size: 16px;
    font-weight: 400;
    line-height: 32px;
}
.paregraph_left{
    font-family: Poppins;
    height: auto;
    width: auto;
    margin-right: 10rem;
}
@media (max-width: 992px) {
    .paregraph_left {
      margin-right: 0;
    }
  }
.paregraph_right{
    font-family: Poppins;
    height: auto;
    width: auto;
    margin-right: 20px;
}
@media (max-width: 768px) {
    .image_phone_left {
      margin-left: 0; /* Reset margin for smaller screens */
    }
  }

.bi-check-lg {
    color: #ffc107; 
    margin-right: 0.5rem; 
}
.tick_box{
    font-family: Poppins;
}
.tick_selection_icon{
    width: 262px;
    height: 262px;
    top: 1444px;
    left: 225px;
    position: absolute;
    z-index: -1;
}
.tick_selection_icon1{
    width: 200px;
    height: 200px;
    top: 1155px;
    left: 20px;
    position: absolute;
    z-index: -1;
}
.atomic_selection_icon{
    width: 350px;
    height: 350px;
    top: 1845px;
    left: 856px;
    position: absolute;
    z-index: -1;
}
.smart_selection_icon{
    width: 426px;
    height: 426px;
    top: 2567px;
    left: 167px;
    position: absolute;
    z-index: -1;
}
.personalized_selection_icon{
    width: 478px;
    height: 478px;
    top: 3310px;
    left: 727px;
    position: absolute;
    z-index: -1;
}
.intelligent_selection_icon{
    width: 380px;
    height: 380px;
    top: 4040px;
    left: 253px;
    position: absolute;
    z-index: -1;
    }
.automate_selection_icon{
    width: 466px;
    height: 466px;
    top: 4672px;
    left: 700px;
    position: absolute;
    z-index: -1;
}
.arrow_right{
    left: 39%;
    position: relative;
}
.arrow_left{
    left: 30%;
    position: relative;
}
.footer {
   width: 100%;
}
.yara-list-items{
    color: #FFFFFF;
    font-size: 26px;
    font-weight: 400;
    font-family: 'Poppins', sans-serif;
    line-height: 36px;
}
.text_whatis{
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    padding-left: 38px;
    padding-right: 38px;
}
.steps_yara_line li {
    background: url("../images/Vector.png") 0 7px !important;
    background-repeat: no-repeat !important;
    list-style: none !important;
    padding: 0 0 0 35px;
    float: left;
    font-family: 'Poppins', sans-serif;
}
.steps_yara_line_faq li {
    background: url("../images/Vector.png") 0 7px !important;
    background-repeat: no-repeat !important;
    list-style: none !important;
    padding: 0 0 0 35px;
}

strong{
    color: #374151;
    line-height: 28px;
}
.steps_yara li {
    margin-bottom: 15px;
}
.steps_yara_line{
    padding-left: 0rem !important;
}
.cards_steps{
    font-size: 25px;
    line-height: 34px;
    margin-left: 20px;
}
.cards_steps_first{
    font-size: 25px;
    line-height: 34px;
    margin-left: 20px;
}
.accordion-button::after {
    display: none; /* Remove default arrow */
    }
    .accordion-button.collapsed .icon-toggle::before {
    content: "\f067"; /* plus */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    }
    .accordion-button .icon-toggle::before {
    content: "\f068"; /* minus */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    }

@media (max-width: 767px) {
  .arrow_divs {
    display: none;
  }

  .cards_steps {
    margin-top: 110px;
    text-align: center;
  }
   .yarra_logo{
    left: 40px !important;
  }
  .navbar-nav{
    align-items: start !important;
    margin-right: 0px;
  }
  .free_demo_button{
    display: none !important;
  }
  .container_parple-bg{
    padding-left: 0px !important;
  }
  .nav-item{
    border-bottom-style: solid;
    border-bottom-color: #c4c4c4;
    border-bottom-width: 1px;
    width: 100%;
    padding-bottom: 10px;
  }
  .last_button_div{
    display: none;
  }
  .menu-link.active::after {
        content: "" !important;
        position: absolute !important;
        left: -42px !important;
        bottom: -11px !important;
    }
   .navbar-nav .dropdown-menu{
    width: 100%;
   }
}
@media (max-width: 500px) {
    .pricing_main_div{
        width: 70% !important;
    }
}
@media (max-width: 767px) and (min-width: 650px) {
  .pricing_main_div{
        width: 46% !important;
    }
}
@media (max-width: 1150px) and (min-width: 767px) {
    .pricing_main_div{
        width: 46% !important;
    }
}

@media (max-width: 1150px) and (min-width: 767px) {
    .pricing_main_div {
        width: 100% !important;
    }
}
@media (min-width: 1400px) {
    .pricing_main_div {
        width: 55% !important;
    }
}

.me-2.icon-toggle{
    background-color: #5576DD;
    padding: 10px;
    border-radius: 4px 0 0 6px;
    color: #FFFFFF;
    font-size: 20px;
}
.accordion-button{
    padding: 0px;
    border-color: 2px solid #d5d8dc;
    font-size: 19px;
    font-family: 'Questrial', sans-serif;
    line-height: 27px;
    color: #1f2124;
    font-weight: 300;
}
.accordion-body{
    font-size: 16px;
    font-family: 'Poppins', sans-serif;
    line-height: 30px;
    color: #374151;
    font-weight: 400;
    padding: 25px;
}
.accordion-item{
    margin-bottom: 30px;
    border-radius: 6px 2px 2px 6px;
}
.accordion-item:not(:first-of-type) {
    border-top: 1px solid #d5d8dc;
}
.accordion-button:focus {
    box-shadow: none !important;   /* remove blue glow */
    border-color: transparent !important; /* remove blue border */
    outline: none !important;
}
.accordion-button:not(.collapsed) {
    background-color: #fff !important;  /* keep background white */
    color: #1f2124 !important;          /* your text color */
}
/* your text color */
.pricing-card {
    border-radius: 15px;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.pricing-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}
.pricing-title {
    font-weight: 700;
    font-size: 20px;
    text-transform: uppercase;
    margin-bottom: 15px;
    font-size: 18px;
    color: #164160;
    font-family: 'Questrial', sans-serif;
}
.price {
    font-size: 30px;
    color: #164160;
    font-family: 'Questrial', sans-serif;
    font-weight: 700;
    margin: 15px 0;
}
.pricing-card ul {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}
.pricing-card ul li {
    font-size: 16px;
    margin-bottom: 10px;
}
.pricing-card ul li i {
    color: #16a34a; /* green check */
    margin-right: 8px;
}
.btn-buy {
    color: #ffffff;
    border-radius: 8px 8px 8px 8px;
    background: #5576dd;
    font-size: 20px;
    padding-top: 15px;
    padding-right: 20px;
    padding-bottom: 15px;
    padding-left: 20px;
    letter-spacing: 1px;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-family: Questrial !important;
    text-decoration: none;
}

.btn-buy:hover {
    background: #FFB400;
    color: #333333;
}
.pricing_main_div{
    width: 65%;
    float: none;
    margin: auto;
}
/* Show dropdown on hover */
.nav-item.dropdown:hover .dropdown-menu {
  display: block;
  margin-top: 0; /* fixes gap */
}
.dropdown-menu{
    width: 220px;
}
.dropdown-item{
    font-family: 'Questrial', sans-serif;
    font-weight: 600;
    font-size: 17px;
    color: #1F2937;
    padding-left: 30px;
}
.menu-link {
    position: relative; /* allow pseudo-element positioning */
    padding-bottom: 10px; /* consistent padding for all */
}
.menu-link.active {
    color: #FFB400 !important;
}
.menu-link.active::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -22px; /* how far below text you want the border */
    width: 100%;
    height: 3px;
    background-color: #FFB400;
    border-radius: 2px;
}
.yara-list-items {
    list-style: none;   /* removes default bullets */
    padding-left: 0;    /* removes left indentation */
    margin: 0;          /* optional: reset margin */
}
.dropdown-toggle::after {
    border: none !important;               /* remove Bootstrap caret */
    font-family: "Font Awesome 7 Free";    /* new FA7 family name */
    font-weight: 900;                      /* solid style */
    content: "\f107";                      /* fa-chevron-down */
    margin-left: 6px;
    font-size: 12px;
    vertical-align: middle;
}

@media (min-width: 768px) and (max-width: 1024px) {
    .navbar-nav {
        margin-left: 50px;
        gap: 10px;
    }
}
/* Footer Background & Padding */
footer {
    background-color: #eef7ff; /* same as live */
    padding-top: 50px;
    padding-bottom: 50px;
    font-family: 'Poppins', sans-serif;
}

/* Footer Headings */
footer h5 {
    font-size: 20px;
    font-weight: 600;
    color: #164160;
    margin-bottom: 20px;
}
.models_headers{
    color: #164160;
    font-size: 18px;
    font-weight: 700;
}
/* Footer Paragraphs */
footer p, footer a {
    font-size: 16px;
    color: #6c6e96;
    line-height: 1.8;
}

footer a:hover {
    color: #164160;
    text-decoration: none;
}
.list-unstyled a{
    font-size: 17px;
    color: #374151 !important;
    font-family: 'Questrial', sans-serif;
}
/* Footer Lists */
.bg-light{
    background-color: #EEF7FF !important;
}
footer{
    padding-top: 32px;
    
}
footer ul {
    padding-left: 0;
    list-style: none;
}

footer ul li {
    margin-bottom: 3px;
}

footer ul li a {
    font-size: 16px;
    color: #6c6e96;
    transition: 0.3s;
}

footer ul li a:hover {
    color: #164160;
}

/* Footer Social Icons */
footer ul li a i {
    font-size: 18px;
    color: #6c6e96;
    transition: 0.3s;
}

footer ul li a:hover i {
    color: #164160;
}
.contact_us_fot{
    margin-top: 40px;
}
.text-muted{
    font-size: 15px;
    color: #374151 !important;
}
/* Footer App Buttons */
footer .img-fluid {
    display: inline-block;
    margin-bottom: 10px;
}

/* Bottom copyright & social */
footer hr {
    border-color: #dddddd;
}

footer .d-flex {
    flex-wrap: wrap;
}

footer .d-flex p {
    margin-bottom: 10px;
}

footer .d-flex ul {
    padding-left: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

footer .d-flex ul li {
    margin-left: 15px;
}

footer .d-flex ul li a {
    font-size: 18px;
    color: #6c6e96;
}

footer .d-flex ul li a:hover {
    color: #164160;
}
.footer_headers{
    font-size: 25px;
    font-family: 'Questrial', sans-serif;
    color: #164160 !important;
}
.list-unstyled{
    margin-top: 26px;
}
/* Responsive adjustments */
@media (max-width: 767px) {
    footer .d-flex {
        flex-direction: column;
        align-items: flex-start;
    }
    footer .d-flex ul {
        margin-top: 15px;
    }
    footer .col-md-3 {
        margin-bottom: 30px;
    }
}
.rounded-circle{
    background-color: #6c6e95 !important;
    text-decoration: none;
}
.accordion-button .icon-toggle::before {
    content: "\f068"; /* fa-minus */
    font-family: "Font Awesome 7 Free" !important;
    font-weight: 900; /* solid */
}
.tickmark_lis li{
    width: 100%;
    text-align: start;
}
/* our */
.compatibility-section {
    background: #f8f9fa;
    padding: 60px 20px;
    text-align: center;
}
.compatibility-section h2 {
    font-weight: bold;
    margin-bottom: 15px;
    font-family: Poppins;
    color: #333B42;
    font-size: 32px;
}
.compatibility-section p {
    max-width: 700px;
    margin: 0 auto 30px;
    font-family: Poppins;
    color: #333B42;
    font-size: 18px;
}
.fw-semibold{
    font-family: Poppins;
    color: #333B42;
    font-size: 20px;
}
.logo-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr); /* 4 logos per row */
    gap: 10px; /* Space between logos */
    justify-items: center;
    align-items: center;
    margin-top: 30px;
}

.logo-grid img {
    object-fit: contain;
    transition: filter 0.3s ease;
    height: 50px;
    max-width: 100px; /* Prevent logos from overflowing */
}
.logo-grid img:hover {
    filter: grayscale(0%);
}
@media (max-width: 1300px) {
    .logo-grid {
        grid-template-columns: repeat(4, 1fr); /* 4 logos per row */
    }
}
@media (max-width: 768px) {
    .logo-grid {
        grid-template-columns: repeat(2, 1fr); /* 2 logos per row on tablets */
    }
}
@media (max-width: 480px) {
    .logo-grid {
        grid-template-columns: repeat(1, 1fr); /* 1 logo per row on mobile */
        gap: 24px;
    }
    .mobile_paddings{
        padding-left: 20px !important;
        padding-right: 20px !important;
        text-align: left !important;
    }
    .cards_steps_first {
        text-align: center;
    }
}
@supports (-webkit-touch-callout: none) {
    .yarra_logo {
        left: 36px !important; /* Fix logo position for Mac */
    }

    .navbar-nav {
        margin-right: 5% !important; /* Fix navbar alignment for Mac */
    }
}