/*===============================================
Template Name: Edulax - Education Online Course HTML5 Template
Author:  https://themeforest.net/user/dream-master
Description: Description
Version: 1.0.0
Text Domain: Edulax
Tags: consulting, finance, corporate, business, consultant, multipurpose, technology, it-solution, software, agency, company, portfolio, bangking, insurance, digital-agency, digital-marketing.
================================================*/

/*TABLE OF CONTENTS*/
/*=====================
01. edulax Header-top Area Css
02. edulax sign up form Css
03. edulax Header Area Css
04. edulax header cart sidebar css
05. edulax Cart Item Css
06. edulax Search Popup Css
07. edulax Sidbar Css
08. edulax hero Area css
09. edulax feature Area Css
10. edulax section title Css
11. edulax about Area Css
12. edulax marquee Area css
13. edulax case study Area css
15. edulax why choose Area css
16. edulax course design offer Area css
17. edulax team Area css
18. edulax testimonial Area css
19. edulax call to action Area css
20. edulax blog Area css 
21. edulax brand Area css
22. edulax footer Area css
23. edulax course category css
24. edulax online course Area Css
25. edulax reason choose area css
26. edulax course program Area css
27. edulax cumpus life section css
28. edulax admission learning  section css
29. edulax joint event area css
30. edulax faq Area css
31. edulax breadcub area css
32. edulax instruction details section css
33. edulax-details-course-area css
34. edulax event details area css
35. edulax course details area css 
36. edulax pricing Area css
37. edulax shop details area css
38. edulax shop section area css
39. edulax shopping Cart Section css
40. edulax Product Section checkout css
41. edulax latest blog area css
42. edulax blog details area css
43. edulax Conatct Area css
44. edulax Error area css
45. Loader Css
=======================*/



/*---=====================================================
   <!--edulax Header-top Area Css-->
=========================================================---*/
.header-top-area {
    background-color: #1e1e1e;
    border-bottom: 2px solid #F38223;
}

.row.header-top {
    padding: 13px 0 13px 0;
}

.header-top-welcome ul li {
    list-style: none;
    display: inline-block;
    color: rgba(255, 255, 255, 0.92);
    font-size: 12px;
    font-weight: 600;
    margin-right: 18px;
}

.header-top-welcome ul li svg {
    width: 13px;
    height: 13px;
    color: #FF9938;
    margin-right: 6px;
}


.header-top-right {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 8px;
}

.header-top-right::before {
    content: '◆';
    font-size: 9px;
    color: #FF9938;
}

.header-top-right p {
    font-weight: 700;
    color: rgba(255,255,255,0.78);
    letter-spacing: 1.8px;
    text-transform: uppercase;
    font-size: 10.5px;
    gap: 8px;
}




/*---=====================================================
   <!--Advantage Header Area Css-->
=========================================================---*/

.advantage-header-area.style-2 {
    padding: 5px 0px 5px;
    border-bottom: 1px solid #E3E0D9;
}


a.logo_two {
    display: none;
}
.sticky a.logo_two {
    display: block;
}
.sticky a.active_logo {
    display: none;
}
.header-menu {
    transition: 0.5s;
}
.edulax-header-area  ul {
    display: inline-block;
}
.header-menu ul li {
    display: inline-block;
    position: relative;
    z-index: 1;
}
.header-menu ul li a {
    display: inline-block;
    padding: 35px 10px 35px 10px;
    margin-left: 10px;
    position: relative;
    z-index: 1;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #44423D;
    transition: color 0.2s;
}

.header-menu ul li a i {
    display: inline-block;
    font-size: 13px;
    margin-left: 2px;
    transition: 0.5s;
    font-weight: 700;
    color:var(--title-color);
}
.header-menu ul li a::before {
    position: absolute;
    content: "";
    width: 0;
    height: 28px;
    right: 0;
    top: 33px;
    background: #FF9938;
    z-index: -1;
    border-radius: 4px;
    transition: 0.5s;
}

.header-menu ul li a:hover:before{
    width: 100%;
    left: 0px;
}

.header-menu ul li a:hover{
    color:var(--color-white);
}

.header-menu ul li a:hover i{
    color:var(--color-white);
}

.sticky .header-menu > ul > li > a:before {
    background: #fff;
}

.sticky .header-menu ul li a:hover{
    color:var(--title-color);
}

.sticky .header-menu ul li a:hover i {
    color:var(--title-color);
}

.sticky .header-btn a::before {
    background: var(--color-white);
}

.sticky .header-btn a:hover{
    color: var(--title-color);
}

/* sticky header */
.edulax-header-area.style-three.sticky .header-menu ul li a:hover {
    color: var(--title-color);
}

.edulax-header-area.style-three.sticky .header-menu ul li a:hover i {
    color:var(--title-color);
}

.header-menu ul li span {
    font-size: 15px;
    color: #131414;
    margin-left: 5px;
    position: relative;
    top: -1px;
    display: inline-block;
    transform: rotate(88deg);
}
.edulax-header-area .edulax_btn a {
    margin-right: 23px;
    border-radius: 0;
}


/*** Sub Menu Style ***/
.header-menu ul .sub_menu {
    position: absolute;
    left: 0;
    top: 130%;
    width: 225px;
    text-align: left;
    background: #fff;
    margin: 0;
    z-index: 1;
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    transition: .5s;
    visibility: hidden;
    border-top: 3px solid var(--primary-color);
    opacity: 0;
    transition: 0.5s;
}

.header-menu ul li:hover>.sub_menu {
    visibility: visible;
    top: 100%;
    opacity: 1;
}

.header-menu ul .sub_menu li {
    position: relative;
    margin: 0;
    display: block;
}
.header-menu ul .sub_menu li a {
    display: block;
    padding: 12px 25px;
    margin: 0;
    line-height: 1.3;
    letter-spacing: normal;
    transition: .5s;
    visibility: inherit !important;
    color: #1a1a1a!important;
    font-size: 16px;
    font-weight: 500;
    position: relative;
    z-index: 1;
    
}
.header-menu ul .sub_menu li:hover>a {
    color: var(--primary-color) !important;
    margin-left: 10px;
}
.header-menu ul .sub_menu li a:before {
    position: absolute;
    content: "";
    left: 12px;
    top: 18px;
    height: 8px;
    width: 8px;
    background: var(--primary-color);
    z-index: -1;
    border-radius: 50%;
    opacity: 0;
    transition: .5s;
}
.header-menu ul .sub_menu li a:hover:before {
    opacity: 1;
}
.sticky .header-menu ul .sub_menu li a:hover:before {
    left: 8px;
}
.sticky .header-menu ul .sub_menu li a:hover {
    margin-left: 15px;
}
/* sub menu style two */
.edulax-header-area.style_two .header-menu ul .sub_menu li a {
    display: block;
    padding: 12px 20px;
}
.sticky .sub_menu li a {
    padding: 12px 20px !important;
}
/* header right */

.header_right {
    display: flex;
    align-items: center;
}
.header_right .nav-btn.navSidebar-button {
    margin-top: -8px;
}
.header-button {
    display: inline-block;
    margin: 10px 0 0;
}
.header-button a {
    display: inline-block;
    border-radius: 8px;
    font-size: 16px;
    color: #ffffff;
    font-weight: 500;
    transition: 0.5s;
}

/* header button */


/* sticky */
.sticky {
    left: 0;
    margin: auto;
    position: fixed !important;
    top: 0;
    width: 100%;
    box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
    background: #fff!important;
    transition: .5s;
    z-index: 999 !important;
    animation: 800ms running fadeInUp;
    animation-name: slideInDown;
}

.sticky .header-menu ul li a {
    color: #14110D;
    transition: 0.5s;
}
.sticky .header-menu ul li a i {
    color: #14110D;
}

.edulax-header-area.style_two .header-menu ul .sub_menu li a:before {
    left: 6px;
}
.sticky .edulax_btn a::before {
    background: #EFA122;
}

/* header menu right */

.header-right-wrapper {
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 15px;
}

.header-contact span {
     
    font-size: 18px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #14110D;
    letter-spacing: -0.005em;
    transition: color 0.2s;
}

.header-contact span svg {
    width: 18px;
    height: 18px;
    color: #F38223;
}


.header-btn a {
    display: inline-block;
    font-size: 15px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family: "Outfit";
    border-radius: 5px;
    background-color: #FF9938;
    padding: 15px 35px;
    transition: 0.5s;
    position: relative;
    z-index: 1;
}

.header-btn a:hover {
    background: #C5601A;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(243,130,35,0.36);
}



.header-btn a i {
    display: inline-block;
    margin-left: 10px;
}


 
  
  /*==========================================
    edulax Search Popup Css
  =========================================*/
  
  .search-popup {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    margin-top: -540px;
    transform: translateY(-100%);
    background-color: #f5f5f5;
    -webkit-transition: all 500ms cubic-bezier(0.86, 0, 0.07, 1);
    -moz-transition: all 500ms cubic-bezier(0.86, 0, 0.07, 1);
    -o-transition: all 500ms cubic-bezier(0.86, 0, 0.07, 1);
    transition: all 1500ms cubic-bezier(0.86, 0, 0.07, 1);
    -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    -moz-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    -o-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    backdrop-filter: blur(5px);
  }
  
  .search-popup {
    width: 100%;
  }
  
  .search-active .search-popup {
    transform: translateY(0%);
    margin-top: 0;
  }
  
  .search-popup .close-search {
    position: absolute;
    left: 0;
    right: 0;
    top: 75%;
    margin: 0 auto;
    margin-top: -200px;
    border-radius: 50%;
    text-align: center;
    background:var(--primary-color);
    width: 70px;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    border-bottom: 3px solid var(--primary-color);
    border-left: 3px solid #393939;
    border-top: 3px solid #fff;
    border-right: 3px solid #393939;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    opacity: 0;
    visibility: hidden;
    height: 70px;
    line-height: 70px;
    text-align: center;
  }
  
  .search-popup .close-search i {
    position: relative;
    font-size: 30px;
    color: #fff;
  }
  
  .search-active .search-popup .close-search {
    visibility: visible;
    opacity: 1;
    top: 50%;
    -webkit-transition-delay: 1500ms;
    -moz-transition-delay: 1500ms;
    -ms-transition-delay: 1500ms;
    -o-transition-delay: 1500ms;
    transition-delay: 1500ms;
  }
  
  .search-popup form {
    position: absolute;
    max-width: 700px;
    top: 50%;
    left: 15px;
    right: 15px;
    margin: -35px auto 0;
    transform: scaleX(0);
    transform-origin: center;
    background-color: transparent;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
  }
  
  .search-active .search-popup form {
    transform: scaleX(1);
    -webkit-transition-delay: 1200ms;
    -moz-transition-delay: 1200ms;
    -ms-transition-delay: 1200ms;
    -o-transition-delay: 1200ms;
    transition-delay: 1200ms;
  }
  
  .search-popup .form-group {
    position: relative;
    margin: 0px;
    overflow: hidden;
  }
  
  .search-popup .form-group input[type="text"],
  .search-popup .form-group input[type="search"] {
    position: relative;
    display: block;
    font-size: 18px;
    line-height: 50px;
    color: #000000;
    height: 70px;
    width: 100%;
    padding: 10px 30px;
    padding-right: 100px;
    background-color: #fff;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    font-weight: 500;
    text-transform: capitalize;
  }
  
  .search-popup .form-group input::placeholder {
    font-size: 18px;
    font-family: "Montserrat", sans-serif;
  }
  
  .search-popup .form-group input[type="submit"],
  .search-popup .form-group button {
    position: absolute;
    right: 30px;
    top: 0px;
    height: 70px;
    line-height: 70px;
    background: transparent;
    text-align: center;
    font-size: 24px;
    color: #000000;
    padding: 0;
    cursor: pointer;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    border: none;
    transition: 0.5s;
  }
  
  .search-popup .form-group button i {
    transition: 0.5s;
  }
  
  .search-popup .form-group button:hover i {
    color: #f00;
  }
  
  .search-popup .form-group input {
    border-radius: 5px;
    border: 2px solid #f5f5f5;
  }
  
  .search-popup .form-group input[type="submit"]:hover,
  .search-popup .form-group button:hover {
    color: #000000;
  }
  
  .search-popup input::placeholder,
  .search-popup textarea::placeholder {
    color: #000000;
  }
  
  .search-popup .close-search.style-two {
    position: absolute;
    right: 25px;
    left: auto;
    color: #fff;
    width: auto;
    height: auto;
    top: 25px;
    margin: 0px;
    border: none;
    background: none !important;
    box-shadow: none !important;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
  }
  
  .search-popup .close-search.style-two i {
    font-size: 20px;
    color: #181d4e;
    transition: 0.5s;
  }
  
  .search-popup .close-search.style-two i:hover {
    color: #f00;
  }
  
  .search-box-btn.search-box-outer i {
    cursor: pointer;
    display: inline-block;
    text-align: center;
    transition: all 500ms ease;
    font-size: 16px;
    text-transform: uppercase;
    color:var(--title-color);
    width: 46px;
    height: 46px;
    line-height: 46px;
    border-radius: 23px;
    background-color: rgba(255,255,255,0);
    border: 1px solid rgba(30,30,30,0.15);
}
  
.sticky .search-box-btn.search-box-outer i {
    color: #fff;
    background-color: rgba(255,255,255,0);
    border: 1px solid rgba(255,255,255);
}

.sticky button.cart_btn.headers-button {
    background-color: rgba(255,255,255);
    border: 1px solid rgba(255,255,255,0.5);
}

.sticky .header-sidbar-button a {
    background: var(--color-white);
    color: var(--title-color);
}

  /*===========================
<-- edulax Sidbar Css -->
=============================*/

.xs-sidebar-group .xs-overlay {
    left: 100%;
    top: 0;
    position: fixed;
    z-index: 101;
    height: 100%;
    opacity: 0;
    width: 100%;
    visibility: hidden;
    -webkit-transition: all 0.4s ease-in 0.8s;
    -o-transition: all 0.4s ease-in 0.8s;
    transition: all 0.4s ease-in 0.8s;
}

.xs-sidebar-group .widget-heading {
    position: absolute;
    top: 23px;
    right: 0;
    padding: 25px;
}

.xs-sidebar-widget {
    position: fixed;
    right: -100%;
    top: 0;
    bottom: 0;
    width: 100%;
    max-width: 360px;
    z-index: 999999;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color:var(--title-color);
    -webkit-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    -o-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    visibility: hidden;
    opacity: 0;
}

.xs-sidebar-group.isActive .xs-overlay {
    opacity: 0.7;
    visibility: visible;
    -webkit-transition: all 0.8s ease-out 0s;
    -o-transition: all 0.8s ease-out 0s;
    transition: all 0.8s ease-out 0s;
    left: 0;
}

.xs-sidebar-group.isActive .xs-sidebar-widget {
    opacity: 1;
    visibility: visible;
    right: 0;
    -webkit-transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
    -o-transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
    transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
}

.sidebar-textwidget {
    padding: 40px 32px;
}

.close-side-widget i {
    color:var(--primary-color);
    font-size: 28px;
    display: block;
}

.sidebar-widget-container {
    position: relative;
    top: 150px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-in 0.3s;
    -o-transition: all 0.3s ease-in 0.3s;
    transition: all 0.3s ease-in 0.3s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.xs-sidebar-group.isActive .sidebar-widget-container {
    top: 0px;
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 1s ease-out 1.2s;
    -o-transition: all 1s ease-out 1.2s;
    transition: all 1s ease-out 1.2s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.xs-overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.5;
    z-index: 0;
}

.xs-bg-black {
    background-color:var(--primary-color);
}

/*html css*/
.nav-logo {
    margin: 0 0 50px;
}

.content-box h2 {
    color: #fff;
    font-size: 26px;
    font-weight: 600;
}

.content-box p {
    display: inline-block;
    color: #fff;
    padding: 15px 0 0;
}
a.theme-btn.btn-style-two span {
    color: #fff;
    font-size: 20px;
    padding-top: 10px;
    display: inline-block;
}

a.theme-btn.btn-style-two i {
    color:var(--primary-color);
}

.contact-info h2 {
    color: #fff;
    font-size: 26px;
    margin-bottom: 15px;
    font-weight: 600;
}

ul.list-style-one li {
    display: block;
    list-style: none;
    color: #fff;
    padding: 16px 0 0;
    overflow: hidden;
}

ul.list-style-one li span {
    font-size: 20px;
    font-weight: 600;
    color:var(--primary-color);
    margin: 0 10px 0 0px;
}

ul.social-box {
    margin: 30px 0 0;
}

ul.social-box li {
    display: inline-block;
    list-style: none;
    margin: 0 6px 0 0;
}

ul.social-box li a {
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 36px;
    text-align: center;
    background: #fff;
    color:var(--primary-color);
    transition: .5s;
    font-size: 18px;
    border-radius: 3px;
}

ul.social-box li a:hover {
    background:var(--primary-color);
    color: #fff;
}



/*===========================================
<-- edulax hero Area css style-one -->
==============================================*/

.hero-section {
    background: url(../images/home/photo-2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    /* height: 900px; */
    position: relative;
    z-index: 1;
    padding-bottom: 80px;
}

.hero-section::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(10,10,10,0.30) 0%, rgba(10,10,10,0.65) 100%);
}

.hero-content {
    position: relative;
    z-index: 1;
    padding-top: 80px;
    text-align: center;
}

.hero-thumb {
  
}

.hero-thumb a {
    display: inline-block;
    max-width: 100%;
    padding: 22px 32px 18px;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
}

.hero-thumb a img {
    height: 180px;
    width: auto;
    max-width: 90vw;
    object-fit: contain;
    display: block;
}

.hero-content .hero-sub-title span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.30);
    border-radius: 99px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    color: #fff;
    position: relative;
    z-index: 1;
}

.hero-content .hero-sub-title span::before {
    content: '◆';
    color: #FF9938;
    font-size: 10px;
}

.hero-content .hero-title h1 {
     
    font-size: clamp(44px, 6.2vw, 84px);
    font-weight: 500;
    letter-spacing: -0.028em;
    line-height: 0.98;
    color: #fff;
    text-shadow: 0 4px 24px rgba(0,0,0,0.5);
    padding: 30px 0 30px;
}

.hero-content .hero-title h1 Span {
    color: #FF9938;
}

.hero-desc p {
    font-size: 18px;
    line-height: 1.66;
    color: rgba(255, 255, 255, 0.92);
    margin: 0 auto;
    max-width: 660px;
    font-weight: 500;
    padding: 0 0 38px;
}

.hero-btn a {
    padding: 17px 30px;
    background: #F38223;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s, color 0.2s, border-color 0.2s, filter 0.2s;
    border-radius: 2px;
}

.hero-btn a:hover {
    background: #C5601A;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(243,130,35,0.36);
}

a.btn-two {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    border: 1.5px solid rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(8px);
    margin-left: 10px;
}

a.btn-two:hover {
    border-color: #FF9938;
    color: #FF9938;
    background: rgba(255,255,255,0.14);
}

.hero-trust {
    margin-top: 14px;
    display: inline-flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.84);
    justify-content: center;
    padding: 28px 0 0;
}

.hero-trust .stars {
    color: #F38223;
    letter-spacing: 3px;
    font-size: 14px;
}

.hero-trust .dot {
    width: 5px;
    height: 5px;
    background: #F38223;
    border-radius: 50%;
    display: inline-block;
}



/*===========================================
<-- edulax hero Area css style-two -->
==============================================*/

.brand-section {
    background: #F4F4F1;
    border-top: 4px solid #F38223;
    border-bottom: 1px solid #E3E0D9;
}

.brand-single-box {
    padding: 42px 28px;
    text-align: center;
    border-right: 1px solid #E3E0D9;
    position: relative;
}

.brand-single-box:before {
    content: '';
    position: absolute;
    top: 1px;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 3px;
    background: #F38223;
}

.brand-content h1 {
     
    font-size: clamp(34px, 4.2vw, 52px);
    font-weight: 600;
    color: #14110D;
    letter-spacing: -0.025em;
    line-height: 1;
}

.brand-content h1 em {
    color: #F38223;
    font-weight: 600;
}

.brand-content p {
    font-size: 11px;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    color: #14110D;
    margin-top: 12px;
    font-weight: 800;
}



/*===========================================
<-- Advance Service Section Css  -->
==============================================*/

.service-section {
    padding: 100px 0 70px;
}

.advantage-section-title {
    padding: 0 0 50px;
}

.section-sub-title span {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 3.5px;
    text-transform: uppercase;
    color: #F38223;
    margin-bottom: 22px;
}

.section-sub-title span:before {
    content: '';
    width: 28px;
    height: 2px;
    background: #F38223;
}

.section-title h1 {
    font-size: clamp(38px, 5vw, 55px);
    font-weight: 500;
    line-height: 1.02;
    letter-spacing: -0.024em;
    color: #14110D;
    margin-bottom: 20px;
}

.section-title h1 em {
    color: #F38223;
    font-weight: 500;
}

.section-desc p {
    font-size: 17px;
    line-height: 1.72;
    color: #44423D;
}

.text-center .section-desc p {
    margin: auto;
    width: 60%;
}

.service-single-box {
    background: #fff;
    border: 1px solid #E3E0D9;
    transition: transform 0.28s, box-shadow 0.28s, border-color 0.28s;
    overflow: hidden;
    margin-bottom: 30px;
}

.service-thumb {
    position: relative;
    z-index: 1;
    transition: .7s;
    overflow: hidden;
}

.service-content {
    padding: 20px 26px 32px 28px;
}

.service-num {
    position: absolute;
    top: 16px;
    left: 16px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    background: #14110D;
    color: #F38223;
    padding: 6px 12px;
    border-radius: 2px;
}


.service-content h2 {
     
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -0.015em;
    color: #14110D;
}

.service-content p {
    font-size: 15px;
    line-height: 1.68;
    color: #44423D;
    border-bottom: 1px solid #EDEAE2;
    padding-bottom: 20px;
}


.service-btn a {
    padding-top: 18px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #F38223;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.service-btn a::after {
    content: '→';
    transition: transform 0.2s;
}

/* hover */

.service-single-box:hover {
    border: 1px solid #F38223;
}

.service-single-box:hover .service-btn a::after { 
    transform: translateX(4px); 
}

.service-single-box:hover .service-thumb img {
    transform: scale(1.06);
}

/*===========================================
<--Advantage Proejct Section Css  style-one -->
==============================================*/

.project-section {
    padding: 100px 0 80px;
    background: #FAFAF8;
}

.project-thumb {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.project-thumb img {
    width: 100%;
    height: 230px;
    object-fit: cover;
    display: block;
    transition: transform 0.6s, filter 0.4s;
    margin-bottom: 20px;
}

.gallery-tag {
    position: absolute;
    bottom: 14px;
    left: 14px;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: #F38223;
    z-index: 1;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.3s, transform 0.3s;
} 


.project-thumb:hover img {
    transform: scale(1.06);
    filter: brightness(1.06);
}

.project-thumb:hover .gallery-tag {
    opacity: 1;
    transform: translateY(0);
}

/*===========================================
<--edulax about Area Css  style-two -->
==============================================*/
.about-us-section {
    padding: 100px 0 100px;
}

.split-list li {
    padding: 20px 0 20px;
    border-bottom: 1px dashed #E3E0D9;
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.split-list .marker {
    width: 30px;
    height: 30px;
    background: #F38223;
    color: #fff;
     
    font-weight: 600;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
}

.split-list .about-content h2 {
    display: block;
     
    font-weight: 500;
    font-size: 18px;
    color: #14110D;
    margin: 0 0 8px;
    line-height: 1;
}

.split-list .about-content p {
    font-size: 14.5px;
    color: #44423D;
    line-height: 1.68;
}

.about-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.about-thumb {
    margin: 0 0 0 30px;
}

.about-us-section.style-2 {
    background: #FAFAF8;
}

.about-us-section.style-2 .about-thumb {
    margin: 0 30px 0 0;
}

/*===========================================
<--Advantage Why Choose Us -->
==============================================*/
.why-choose-us-section {
    padding: 100px 0 70px;
    background: #0E0E0E;
}

.why-choose-single-box {
    padding: 38px 28px;
    border: 1px solid rgba(255,255,255,0.14);
    transition: background 0.2s;
    margin-bottom: 30px;
}

.number span {
     
    font-size: 32px;
    font-weight: 500;
    color: #FF9938;
    margin-bottom: 14px;
    line-height: 1;
}

.choose-us-content h2 {
     
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    letter-spacing: -0.01em;
}

.choose-us-content p {
    font-size: 14.5px;
    line-height: 1.68;
    color: rgba(255,255,255,0.72);
}

.why-choose-single-box:hover {
    background: rgba(255,255,255,0.04);
}

/*===========================================
<--Advantage Faq Section Css -->
==============================================*/

.faqs-section {
    padding: 100px 0 90px;
}

/* faq Accordion */

.tab_container {
    overflow: hidden;
    margin: 38px 0 20px;
    position: relative;
}
  
.accordion li {
    list-style: none;
    padding: 0px 0px 20px;
    border-bottom: 1px solid #E3E0D9;

}

.accordion li:first-child {
    border-top: 1px solid #E3E0D9;
}
  
.accordion li a {
    position: relative;
    width: 100%;
    display: block;
    cursor: pointer;
    z-index: 1;
    border-radius: 10px;
    padding: 26px 4px 14px;
     
    font-size: 19px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #14110D;
}
  
.accordion li p {
    display: none;
    margin: 0;
    overflow: hidden;
    padding: 10px 4px 10px;
    font-size: 15.5px;
    line-height: 1.74;
    color: #44423D;
}
  
.accordion a:before {
    width: 2px;
    height: 12px;
    background: #F38223;
    position: absolute;
    right: 35px;
    content: " ";
    top: 23px;
    transform: rotate(0deg);
    transition: all 0.5s ease-in-out;
    z-index: 2;
}
  
.accordion a:after {
    width: 12px;
    height: 2px;
    background: #F38223;
    position: absolute;
    right: 30px;
    content: " ";
    top: 28px;
    transition: all 0.5s ease-in-out;
    z-index: 1;
}
  
.accordion a.active:after {
    transform: rotate(0deg);
    -webkit-transition: all 0.5s ease-in-out;
    background: #F38223;
}
  /* Active */

.accordion a.active:after {
    transform: rotate(0deg);
    -webkit-transition: all 0.5s ease-in-out;
}
  
.accordion a.active:before {
    display: none;
}
  
.accordion a.active {
    border-radius: 10px 10px 0 0;
    filter: drop-shadow(0px 20px 15px rgba(219,231,228,0.4));
}






/* ================================================ */
    /* edulax testimonial Area css style-three */
/* ================================================ */

.call-to-section {
    padding: 100px 0 70px;
    background: #0E0E0E;
    position: relative;
}

.call-to-section:before {
    content: '';
    position: absolute;
    top: -180px;
    left: -180px;
    width: 560px;
    height: 560px;
    background: radial-gradient(circle, rgba(243,130,35,0.36) 0%, transparent 65%);
    pointer-events: none;
}

.call-to-section::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: repeating-linear-gradient(90deg, #FFD24A 0 50px, transparent 50px 90px);
    opacity: 0.55;
}

.our-contact-us {
    padding: 22px 24px;
    border: 1.5px solid rgba(255, 255, 255, 0.16);
    transition: border-color 0.2s, background 0.2s;
    margin-bottom: 15px;
}

.our-contact-us span {
    font-size: 10.5px;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    font-weight: 800;
}

.our-contact-us h2 {
    line-height: 1.5;
     
    font-size: 26px;
    font-weight: 500;
    color: #fff;
    letter-spacing: -0.015em;
    margin: 0;
}

.our-contact-us:hover {
    border: 1.5px solid #FF9938;
}


.why-choose-us-section.border-style {
    position: relative;
    z-index: 1;
}

.why-choose-us-section.border-style::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: repeating-linear-gradient(90deg, #FFD24A 0 50px, transparent 50px 90px);
    opacity: 0.55;
}


/*===========================================
<-- Advantage footer Area css-->
==============================================*/

.footer-area {
    background-color: #14110D;
    padding: 100px 0 20px;
    border-top: solid 3px #F38223;
}

.footer-widget-title h2 {
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2.6px;
    text-transform: uppercase;
    color: #FF9938;
    margin-bottom: 8px;
}

.footer-desc p {
    font-size: 14.5px;
    line-height: 1.78;
    color: rgba(255, 255, 255, 0.6);
    padding: 25px 0 0;
}

.footer-widget-menu ul li {
    margin-bottom: 10px;
}

.footer-widget-menu ul li a {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.72);
    transition: color 0.2s;
}

.footer-widget-menu ul li a:hover{
    color: #FF9938;
}

.footer-widget-menu ul li img {
    margin-right: 12px;
}

.footer-widget-blog.first {
    margin-top: 30px;
}

.footer-widget-blog {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}

.footer-widget-blog-content a {
    display: inline-block;
    font-size: 17px;
    line-height: 24px;
    color:var(--color-white);
    font-weight: 400;
    font-family: "Outfit";
    transition: 0.5s;
}

.footer-widget-blog-content a:hover{
    color: #FF9938;
}

.footer-widget-blog-content p {
    font-size: 9.5px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 4px;
}

.footer-widget-icon i {
    color: #FF9938;
    font-size: 17px;
}
.footer-widget-blog-content h3 {
    font-size: 14.5px;
    color: #fff;
    font-weight: 600;
    line-height: 1.55;
}

.row.add-footer-class {
    border-bottom: 1px solid  rgba(255,255,255,0.10196078431372549);
    padding-bottom: 50px;
    margin-bottom: 24px;
}

.footer-bottom-desc p {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.42);
    letter-spacing: 0.4px;
}


/*===========================================
<-- Advantage BreadCumb Area css-->
==============================================*/


.breadcum-section {
    padding: 100px 0 100px;
    background: #FAFAF8;
    border-bottom: 4px solid #F38223;
}

.breadcum-menu ul li {
    list-style: none;
    display: inline-block;
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #6B6862;
    margin-bottom: 22px;
    font-weight: 700;
}

.breadcum-menu ul li a.first-child {
    color: #F38223;
}

.breadcum-menu ul li a:hover {
    color: #F38223;
}

/* Inner About Section */

.row.advantage-row {
    padding: 65px 0;
    margin-top: 65px;
    border-top: 1px solid #E3E0D9;
}

.about-thumb.style-2 {
    margin: 0 30px 0 0;
}

ul.service-list li {
    list-style: none;
    padding: 9px 0;
    display: flex;
    gap: 12px;
}

ul.service-list li::before {
    content: '';
    width: 18px;
    height: 2px;
    background: #F38223;
    margin-top: 12px;
    flex-shrink: 0;
}

/*===========================================
<-- Advantage Services Area css-->
==============================================*/

.services-section {
    padding: 100px 0 70px;
}

.our-services-box {
    padding: 24px 22px;
    background: #fff;
    border: 1px solid #E3E0D9;
    transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    margin-bottom: 16px;
}

.our-services-box:hover { 
    transform: translateY(-3px); 
    border-color: #F38223; 
    box-shadow: 0 18px 36px rgba(20,17,13,0.06); 
}

.our-service-content span {
    font-size: 9.5px;
    letter-spacing: 2.2px;
    text-transform: uppercase;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-weight: 800;
    margin-bottom: 8px;
    color: #44423D;
}

.our-service-content h2 {
     
    font-size: 19px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #14110D;
    line-height: 1.3;
}

.our-service-content p {
    font-size: 12.5px;
    color: #44423D;
    margin-top: 6px;
    line-height: 1.5;
}

/* Active box */

.our-services-box.active {
    background: #0E0E0E;
}

.active .our-service-content h2 {
    color: #fff;
}

.active .our-service-content p {
    color: rgba(255,255,255,0.74);
}

.active .our-service-content span {
    color: #F38223;
}

/* ======Google Map====== */

.google-map-section {
    padding: 100px 0 100px;
    background: #F4F4F1;
}


/* =========Contact Us========= */

.contact-section {
    padding: 100px 0 100px;
}


.our-contact-us-box {
    border: 1px solid #E3E0D9;
    padding: 44px;
}

.contact-title h1 {
     
    font-size: 32px;
    font-weight: 500;
    letter-spacing: -0.022em;
    margin-bottom: 8px;
    color: #14110D;
}

.contact-desc > p {
    font-size: 15px;
    color: #44423D;
    margin-bottom: 28px;
    line-height: 1.7;
}


/* ===contact Form ==== */

.form-box input {
    width: 100%;
    height: 50px;
    border-radius: 4px;
    background-color: #FAFAF8;
    border: 1px solid #E3E0D9;
    margin-bottom: 20px;
    padding-left: 25px;
    outline: 0;
    transition: border-color 0.2s, background 0.2s;
    font-size: 15px;
}

.form-box input:focus{
    border-color: #F38223;
}

.form-box select {
    width: 100%;
    height: 50px;
    border-radius: 4px;
    background-color: #FAFAF8;
    border: 1px solid #E3E0D9;
    margin-bottom: 20px;
    padding-left: 25px;
    outline: 0;
    transition: border-color 0.2s, background 0.2s;
    font-size: 15px;
}

.form-box select:focus{
    border-color: #F38223;
}

.form-box.message textarea {
    width: 100%;
    height: 140px;
    border-radius: 4px;
    background-color: #FAFAF8;
    border: 1px solid #E3E0D9;
    padding: 25px 25px 25px;
    outline: 0;
}

.form-box label {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #44423D;
    margin-bottom: 8px;
}

.form-box label span {
    color: #F38223;
}


.contact-form button {
    display: inline-block;
    line-height: 28px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    color: #ffffff;
    text-align: center;
    width: 100%;
    height: 50px;
    border-radius: 2px;
    background-color: #F38223;
    transition: 0.5s;
    border: 0;
    margin-top: 20px;
}

.contact-form button:hover{
    background-color: #C5601A;
    transform: translateY(-2px);
    box-shadow: 0 14px 32px var(--orange-glow);
}

/* Contact Right */

.our-contact-info {
    background: #0E0E0E;
    color: #fff;
    padding: 44px 44px 247px 44px;
    position: relative;
    overflow: hidden;
}

.our-contact-info:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 5px;
    background: repeating-linear-gradient(90deg, #FFD24A 0 40px, transparent 40px 70px);
    opacity: 0.55;
}

.top-title h2 {
     
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -0.015em;
    color: #fff;
    margin-bottom: 20px;
}


ul.contact-us li {
    display: flex;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px dashed rgba(255,255,255,0.14);
    align-items: flex-start;
    list-style: none;
}

.ctn-icon svg {
    width: 18px;
    height: 18px;
}

.ctn-icon {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(243,130,35,0.10);
    color: #FF9938;
    flex-shrink: 0;
    margin-top: 2px;
    border-radius: 2px;
}

.ctn-info span {
    display: block;
    font-size: 11px;
    letter-spacing: 2.2px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.55);
    font-weight: 800;
    margin-bottom: 4px;
}

.ctn-info h3 {
    color: #fff;
    font-size: 16px;
    line-height: 1.3;
     
    font-weight: 500;
    letter-spacing: -0.005em;
}

.ctn-info p {
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 4px;
    line-height: 1.55;
}

.ctn-info h3:hover {
    color: #FF9938;
}