/*
Theme Name: WorldCourse
Theme URI: https://templatesjungle.com/
Author: TemplatesJungle
Author URI: https://templatesjungle.com/
Description: WorldCourse is specially designed product packaged for online course websites.
Version: 1.1
*/


/*--------------------------------------------------------------
This is main CSS file that contains custom style rules used in this template
--------------------------------------------------------------*/


/*------------------------------------*\
    Table of contents
\*------------------------------------*/


/*------------------------------------------------

CSS STRUCTURE:

1. VARIABLES

2. GENERAL TYPOGRAPHY
  2.1 General Styles
  2.2 Floating & Alignment
  2.3 Forms
  2.4 Lists
  2.5 Code
  2.6 Tables
  2.7 Spacing
  2.8 Utilities
  2.9 Misc
    - Row Border
    - Zoom Effect
  2.10 Buttons
    - Button Sizes
    - Button Shapes
    - Button Color Scheme
    - Button Aligns
  2.11 Section
    - Hero Section
    - Section Title
    - Section Paddings
    - Section Margins
    - Section Bg Colors
    - Content Colors
    - Content Borders

3. EXTENDED TYPOGRAPHY
  3.1 Blockquote / Pullquote
  3.2 Text Highlights

4. CONTENT ELEMENTS
  4.1 Tabs
  4.2 Accordions
  4.3 Brand Carousel
  4.4 Category Carousel

5. BLOG STYLES
  5.1 Blog Single Post
  5.2 About Author
  5.3 Comments List
  5.4 Comments Form3

6. SITE STRUCTURE
  6.1 Header
    - Header Menu
    - Nav Sidebar
  6.2 Billboard
  6.3 About Us Section
  6.4 Video Section
  6.5 Selling Products Section
  6.6 Quotation Section
  6.7 Latest Blogs Section
  6.8 Newsletter Section
  6.9 Instagram Section
  6.10 Footer
    - Footer Top
    - Footer Bottom

7. OTHER PAGES
  7.1 Product detail
  7.2 Shop page

    
/*--------------------------------------------------------------
/** 1. VARIABLES
--------------------------------------------------------------*/

:root {
    /* widths for rows and containers
     */
    --header-height: 160px;
    --header-height-min: 80px;
}


/* on mobile devices below 600px
 */

@media screen and (max-width: 600px) {
     :root {
        --header-height: 100px;
        --header-height-min: 80px;
    }
}


/* Theme Colors */

:root {
    --accent-color: #f1bd03;
    --dark-color: #0a1622;
    --light-dark-color: #727272;
    --light-color: #fff;
    --grey-color: #908F8D;
    --light-grey-color: #f5f5f5;
    --primary-color: #6995B1;
    --light-primary-color: #eef1f3;
}


/* Fonts */

:root {
    --body-font: 'Jost', sans-serif;
    --heading-font: 'Jost', sans-serif;
    --secondary-font: 'Roboto Slab', serif;
}
section#hero {
    max-height: 56vh !important;
}

@media (max-width: 768px) {
    section#hero {
        max-height: 85vh !important;
    }
}
body {
    --bs-link-color: #333;
    --bs-link-hover-color: #333;
    --bs-link-color-rgb: 40, 40, 40;
    --bs-link-hover-color-rgb: 0, 0, 0;
    --bs-light-rgb: 248, 248, 248;
    --bs-font-sans-serif: 'Jost', sans-serif;
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.3rem;
    --bs-body-color: #0a1622;
    --bs-primary: #f1bd03;
    --bs-primary-rgb: 241, 189, 95;
    --bs-primary-bg-subtle: #FFF9EB;
    --bs-border-color: #F7F7F7;
    --bs-secondary-rgb: 230, 243, 251;
    --bs-warning-rgb: 255, 249, 235;
    --bs-info-rgb: 230, 243, 250;
}

.btn {
    --bs-btn-font-family: var(--heading-font);
}

.btn-primary {
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 600;
    transition: all 0.3s ease-in;
    --bs-btn-color: #0a1622;
    --bs-btn-bg: #f1bd03;
    --bs-btn-border-color: #f1bd03;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #0a1622;
    --bs-btn-hover-border-color: #0a1622;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #0a1622;
    --bs-btn-active-bg: #f1bd03;
    --bs-btn-active-border-color: #f1bd03;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #0a1622;
    --bs-btn-disabled-bg: #d3d7dd;
    --bs-btn-disabled-border-color: #f1bd03;
}

.btn-outline-primary {
    transition: all 0.3s ease-in;
    padding: 1.2rem 3rem;
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.02375rem;
    --bs-btn-color: #0a1622;
    --bs-btn-bg: #ffffff;
    --bs-btn-border-color: #f1bd03;
    --bs-btn-hover-color: #0a1622;
    --bs-btn-hover-bg: #f1bd03;
    --bs-btn-hover-border-color: #f1bd03;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #0a1622;
    --bs-btn-active-bg: #f1bd03;
    --bs-btn-active-border-color: #f1bd03;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #0a1622;
    --bs-btn-disabled-bg: #d3d7dd;
    --bs-btn-disabled-border-color: #f1bd03;
    --bs-gradient: none;
}

.btn-dark {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.06rem;
    padding: 1.2rem 3rem;
    transition: all 0.3s ease-in;
    text-transform: uppercase;
    --bs-btn-color: #fff;
    --bs-btn-bg: #000;
    --bs-btn-border-color: #000;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #212529;
    --bs-btn-hover-border-color: #212529;
    --bs-btn-focus-shadow-rgb: 66, 70, 73;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #000;
    --bs-btn-active-border-color: #000;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #000;
    --bs-btn-disabled-border-color: #000;
}

.btn-outline-dark {
    line-height: 0.75rem;
    letter-spacing: 0.09375rem;
    text-transform: capitalize;
    transition: all 0.3s ease-in;
    font-size: 1rem;
    font-weight: 600;
    border: 2px solid #000;
    transition: all 0.5s ease-in;
    --bs-btn-color: #212529;
    --bs-btn-border-color: #212529;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #212529;
    --bs-btn-hover-border-color: #212529;
    --bs-btn-focus-shadow-rgb: 33, 37, 41;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #212529;
    --bs-btn-active-border-color: #212529;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #212529;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #212529;
    --bs-gradient: none;
}

@media screen and (max-width:991px) {
    .btn-primary,
    .btn-outline-primary,
    .btn-outline-dark,
    .btn-dark {
        padding: 0.6rem 1.5rem;
        font-size: 1rem;
    }
}

body {
    letter-spacing: 0.01625rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font);
    color: var(--bs-body-color);
    font-weight: 600;
    text-transform: capitalize;
}

a {
    text-decoration: none;
}

.breadcrumb.text-white {
    --bs-breadcrumb-divider-color: #fff;
    --bs-breadcrumb-item-active-color: var(--bs-primary);
}

.dropdown-menu {
    --bs-dropdown-link-active-bg: var(--bs-primary);
}

.secondary-font {
    font-family: var(--secondary-font);
    font-style: italic;
    font-weight: 400;
}



.padding-small {
    padding: 1.5rem 0;
}


/* arrow hover effect */

.btn-wrap:hover i.icon.icon-arrow-io {
    transform: translate3d(5px, 0px, 0px) rotate(-180deg);
}

.btn-wrap i.icon.icon-arrow-io {
    display: inline-block;
    transform: rotate(-180deg);
    transition: transform 0.3s ease-out 0s;
}


/*----------------------------------------------*/


/* 6. SITE STRUCTURE */


/*----------------------------------------------*/


/* 6.1 Header
--------------------------------------------------------------*/


/* Preloader */

.preloader-wrapper {
    width: 100%;
    height: 100vh;
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 111;
    background: #fff;

    display: flex;
    justify-content: center;
    align-items: center;
}

.preloader-wrapper .preloader {
    transform: translateZ(0);
}

.preloader:before,
.preloader:after {
    content: '';
    position: absolute;
    top: 0;
}

.preloader:before,
.preloader:after,
.preloader {
    border-radius: 50%;
    width: 2em;
    height: 2em;
    animation: animation 1.2s infinite ease-in-out;
}

.preloader {
    animation-delay: -0.16s;
}

.preloader:before {
    left: -3.5em;
    animation-delay: -0.32s;
}

.preloader:after {
    left: 3.5em;
}

@keyframes animation {
    0%,
    80%,
    100% {
        box-shadow: 0 2em 0 -1em var(--accent-color);
    }
    40% {
        box-shadow: 0 2em 0 0 var(--accent-color);
    }
}


/* offcanvas cross button style  */

.btn-close:focus {
    box-shadow: none;
}


/* nav bar style  */

.navbar-nav .nav-link.active,
.navbar-nav .nav-link:active,
.navbar-nav .nav-link:hover {
    color: var(--accent-color);
}

.nav-link {
    color: #000;
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
}


/* dropdown style */

.dropdown-item {
    text-transform: uppercase;
    font-weight: 600;
    padding: 0.5rem 1rem;
}

.dropdown-item.active,
.dropdown-item:active {
    color: var(--bs-body-color);
}


/* modal style */

.modal-backdrop {
    --bs-backdrop-zindex: 1;
}


/* billboard style  */

.form-control {
    font-size: 1rem;
    color: var(--grey-color);
    line-height: normal;
    letter-spacing: 0.02125rem;
    text-transform: capitalize;
    border-radius: 0.25rem;
    border: 1px solid #e8e8e8;
    background: var(--light-grey-color);
    display: flex;
    padding: 0.8rem 1rem;
    align-items: center;
    gap: 0.375rem;
    text-align: right;
    direction: rtl;
    align-self: stretch;
}



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


/*----- Services Section Style -------------------------*/

.services-element {
    cursor: pointer;
    background: var(--light-grey-color);
    transition: all 0.2s ease-out;
}

.services-element:hover {
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.12);
}


/*----- topselling Section Style -------------------------*/

button.filter-button {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.02375rem;
    border: none;
    color: #555555;
    background: var(--light-grey-color);
    text-transform: capitalize;
    transition: all 0.3s ease-in;
}

button.filter-button.active,
button.filter-button:hover {
    color: var(--bs-body-color);
    background: var(--accent-color);
}

.card {
    border: none;
}


/* blog section style */


/* -Zoom Effect
------------------------------------------*/

.zoom-effect {
    position: relative;
    overflow: hidden;
}

.zoom-effect img {
    max-width: 100%;
    -webkit-transition: 0.6s ease-out;
    -moz-transition: 0.6s ease-out;
    transition: 0.6s ease-out;
}

.zoom-effect:hover img {
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

.zoom-effect:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 2;
    opacity: 0;
    -moz-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}

.zoom-effect:hover:before {
    opacity: 1;
    cursor: pointer;
}


/* testimonial section style */

.swiper-pagination {
    position: unset;
}

.swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 10px));
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 10px));
}

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


/* footer section style */

a.footer-link:hover {
    color: var(--accent-color);
}

iconify-icon.social-icon {
    color: var(--grey-color);
}

iconify-icon.social-icon:hover {
    color: var(--accent-color);
}

@media screen and (max-width: 991px) {
    /* offcanvas menu */
    .offcanvas-body .nav-item {
        font-weight: 700;
        border-bottom: 1px solid #d1d1d1;
    }
    /* dropdown-menu */
    .dropdown-menu {
        padding: 0;
        border: none;
        line-height: 1.4;
        font-size: 0.9em;
    }
}


/*--------------------------------------------------------------
faqs page style start
--------------------------------------------------------------*/

.accordion-button:not(.collapsed) {
    color: var(--body-text-color);
    background-color: transparent;
    box-shadow: none;
}

.accordion {
    --bs-accordion-color: var(--light-text-color);
    --bs-accordion-bg: none;
    --bs-accordion-btn-color: var(--body-text-color);
}

.accordion-button:not(.collapsed)::after {
    background-image: url('https://api.iconify.design/eva/arrow-down-fill.svg?color=%2341403e');
}

.accordion-button::after {
    background-image: url('https://api.iconify.design/eva/arrow-down-fill.svg?color=%2341403e');
}

.accordion-button:focus {
    z-index: 3;
    border-color: none;
    box-shadow: none;
}


/*--------------------------------------------------------------
Blog page style start
--------------------------------------------------------------*/


/* blog style */

.blog-paragraph {
    color: var(--grey-color);
    font-size: 1rem;
    font-weight: 400;
    line-height: normal;
    font-family: var(--secondary-font);
}

.blog-read {
    color: var(--grey-color);
    font-size: 1rem;
    letter-spacing: 0.02rem;
    text-transform: uppercase;
}

a.blog-read {
    border-bottom: 1px solid #D9D9D8;
    transition: all 0.3s ease-in;
}

a.blog-read:hover {
    border-bottom: 1px solid #8a8a8a;
}


/* ------ Pagination ------*/

.pagination .page-numbers {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    color: var(--bs-body-color);
    padding: 0 10px;
    line-height: 1.4;
    transition: 0.9s all;
    border-radius: 8px;
}

.pagination .page-numbers:hover,
.pagination .page-numbers.current {
    color: var(--accent-color);
}

iconify-icon.pagination-arrow {
    color: var(--bs-body-color);
    transition: 0.9s all;
}

iconify-icon.pagination-arrow:hover {
    color: var(--accent-color);
}


/*--------------------------------------------------------------
Single Product page style start
--------------------------------------------------------------*/

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: var(--bs-body-color);
    background-color: var(--accent-color);
}


/* product-thumbnail-slider */

.product-thumbnail-slider {
    height: 640px;
}


/*--------------------------------------------------------------
Checkout page style start
--------------------------------------------------------------*/

.form-check-input {
    border: 1px solid var(--accent-color);
}

.form-check-input:checked {
    background-color: var(--accent-color);
    border-color: var(--accent-color);
}

.form-check-input:focus {
    border-color: var(--accent-color);
    box-shadow: none;
}


/*--------------------------------------------------------------
Account page style start
--------------------------------------------------------------*/

.nav-tabs .nav-item.show .nav-link.account-tab,
.nav-tabs .nav-link.account-tab {
    color: var(--bs-body-color);
}

.nav-tabs .nav-item.show .nav-link.account-tab,
.nav-tabs .nav-link.account-tab.active {
    color: var(--accent-color);
}


/*--------------------------------------------------------------
Styles page style start
--------------------------------------------------------------*/

.chocolat-wrapper {
    z-index: 9999;
}


/* Instructors page style
------------------------------------------------------------- */

.team-member ul.social-links {
    top: 0;
}

.team-member ul li {
    padding: 5px;
    transform: rotatey(-90deg) perspective(100px);
    transform-origin: left;
    cursor: pointer;
    transition: .5s ease-in-out;
    background-color: var(--accent-color);
}

.team-member ul li:first-of-type {
    transition-delay: .3s;
}

.team-member ul li:nth-of-type(2) {
    transition-delay: 0.6s;
}

.team-member ul li:nth-of-type(3) {
    transition-delay: 0.9s;
}

.team-member ul li:last-of-type {
    transition-delay: 1.3s;
}

.team-member:hover ul li {
    transform: rotatey(0deg);
}


/*--------------------------------------------------------------
  Price Plan page style
  --------------------------------------------------------------*/

.plan-post {
    border: 1px solid var(--accent-color);
}

span.price-tick {
    color: var(--accent-color);
}

.price-option {
    height: 316px;
}

.recommend-price {
    background: var(--accent-color);
}


/*--------------------------------------------------------------
  Shop Plan page style
  --------------------------------------------------------------*/

.product-qty {
    width: 25%;
}

@media screen and (max-width: 800px) {
    .product-qty {
        width: 50%;
    }
}

.product-store .product-item {
    position: relative;
}

.product-item .cart-concern {
    background: var(--light-color);
    width: 80%;
    text-align: center;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 180px;
    z-index: 9;
    transition: 0.5s ease-out;
    padding: 20px 30px;
    opacity: 0;
}

.product-item:hover .cart-concern {
    bottom: 150px;
    opacity: 1;
}

.cart-concern .cart-button button {
    background: none;
    color: var(--dark-color);
    height: auto;
    padding: 0;
    margin: 0;
}

.cart-concern .cart-button button i.icon {
    font-size: 15px;
}

.product-item .wishlist-btn i.icon.icon-heart {
    font-size: 20px;
}

.product-item .item-price {
    font-size: 1.8em;
}


/* - course detail Page style
--------------------------------------------------------------*/


/*---- video section style start ----*/


/* color box style */

div#cboxOverlay {
    opacity: 0.8 !important;
}

.video .video-player {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

iconify-icon.video-icon {
    font-size: 35px;
    color: var(--bs-light);
    border-radius: 6.25rem;
    background: rgba(255, 255, 255, 0.35);
    transition: all 0.4s ease-in-out;
}

iconify-icon.video-icon:hover {
    font-size: 45px;
}

.nav-tabs .nav-item {
    transition: all 0.1s ease-in;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: var(--bs-nav-tabs-link-active-color);
    background-color: transparent;
    border-color: transparent;
    border-bottom: 2px solid var(--accent-color);
    transition: all 0.1s ease-in;
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
    isolation: isolate;
    border-color: transparent;
    border-bottom: 2px solid var(--accent-color);
    transition: all 0.1s ease-in;
}

.reviews-components {
    box-shadow: 0px 0px 60px rgba(0, 0, 0, 0.1);
}

a.course:hover {
    transition: all 0.3s ease-in;
}

a.course:hover {
    color: var(--accent-color);
}


/*---- video section style start ----*/


/* color box style */

div#cboxOverlay {
    opacity: 0.8 !important;
}

.video .video-player {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

iconify-icon.video-icon {
    font-size: 35px;
    color: var(--bs-light);
    border-radius: 6.25rem;
    background: rgba(255, 255, 255, 0.35);
    transition: all 0.4s ease-in-out;
}

iconify-icon.video-icon:hover {
    font-size: 45px;
}


/* RTL Support for Arabic */

html[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .navbar-nav {
    padding-right: 0;
}

html[dir="rtl"] .navbar-nav .nav-link {
    text-align: right;
}

html[dir="rtl"] .dropdown-menu {
    text-align: right;
}

html[dir="rtl"] .offcanvas-end {
    right: auto;
    left: 0;
    transform: translateX(-100%);
}

html[dir="rtl"] .offcanvas.show {
    transform: translateX(0);
}

html[dir="rtl"] .services-element {
    text-align: right;
}

html[dir="rtl"] .services-element .ps-3 {
    padding-right: 1rem !important;
    padding-left: 0 !important;
}

html[dir="rtl"] .list-group-item {
    text-align: right;
}

html[dir="rtl"] .text-md-end {
    text-align: left !important;
}

html[dir="rtl"] .me-2,
html[dir="rtl"] .me-3,
html[dir="rtl"] .me-4 {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

html[dir="rtl"] .me-3 {
    margin-left: 1rem !important;
}

html[dir="rtl"] .me-4 {
    margin-left: 1.5rem !important;
}

html[dir="rtl"] .ms-2,
html[dir="rtl"] .ms-3,
html[dir="rtl"] .ms-4,
html[dir="rtl"] .ms-5 {
    margin-left: 0 !important;
    margin-right: 0.5rem !important;
}

html[dir="rtl"] .ms-3 {
    margin-right: 1rem !important;
}

html[dir="rtl"] .ms-4 {
    margin-right: 1.5rem !important;
}

html[dir="rtl"] .ms-5 {
    margin-right: 3rem !important;
}

html[dir="rtl"] .pe-3,
html[dir="rtl"] .pe-4,
html[dir="rtl"] .pe-5 {
    padding-right: 0 !important;
    padding-left: 1rem !important;
}

html[dir="rtl"] .pe-4 {
    padding-left: 1.5rem !important;
}

html[dir="rtl"] .pe-5 {
    padding-left: 3rem !important;
}

html[dir="rtl"] .ps-3,
html[dir="rtl"] .ps-4,
html[dir="rtl"] .ps-5 {
    padding-left: 0 !important;
    padding-right: 1rem !important;
}

html[dir="rtl"] .ps-4 {
    padding-right: 1.5rem !important;
}

html[dir="rtl"] .ps-5 {
    padding-right: 3rem !important;
}


/* Arabic Font Family */

@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800&display=swap');
html[dir="rtl"] body {
    font-family: 'Tajawal', sans-serif;
}

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6 {
    font-family: 'Tajawal', sans-serif;
}


/* Counter Animation Styles */

.counter-number {
    font-weight: bold;
    font-size: 2.5rem;
    color: var(--primary-color);
}

.count-title {
    font-size: 1.2rem;
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 0;
    text-align: center;
}


/* Typing Animation Styles */

.typing-text,
.typing-paragraph {
    margin-top: 3rem;
    position: relative;
    display: inline-block;
}

.typing-text::after,
.typing-paragraph::after {
    content: '|';
    position: absolute;
    right: -8px;
    width: 8px;
    animation: blink 1s infinite;
}

@keyframes blink {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}


/* RTL version of typing animation */

html[dir="rtl"] .typing-text::after,
html[dir="rtl"] .typing-paragraph::after {
    right: auto;
}

.typing-paragraph {
    min-height: 48px;
    /* Set a minimum height to prevent layout shifts */
}


/* Class to hide cursor when typing is complete */

.typing-complete::after {
    display: none;
}


/* Initially hide paragraph cursor until ready */

.cursor-hidden::after {
    display: none;
}


/* Hero section styling */

#hero {
    margin-top: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7));
}

#hero h2 {
    position: relative;
    display: inline-block;
}

#hero .btn {
    margin-top: 1rem;
}


/* About Us page styles */


/* Timeline styles */

.timeline {
    position: relative;
    padding: 1rem 0;
}

.timeline-item {
    background: var(--light-grey-color);
    margin-bottom: 2rem;
}

.timeline-item:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.timeline-item:before {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background: var(--bs-primary);
    border-radius: 50%;
}

html[dir="rtl"] .timeline-item:before {
    transform: translateY(-50%);
}


/* Right side items */

html[dir="rtl"] .col-md-6:nth-child(odd) .timeline-item:before {
    left: -10px;
}


/* Left side items */

html[dir="rtl"] .col-md-6:nth-child(even) .timeline-item:before {
    right: -10px;
}


/* Team member styles */

.team-member {
    background-color: var(--light-grey-color);
    padding: 2rem;
    border-radius: 0.5rem;
    transition: all 0.3s ease;
}

.team-member:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}


/* Mobile responsive fixes for RTL */

ol.breadcrumb.justify-content-center {
    direction: ltr;
}


/* Enhanced Spacing and Structure */




/* Better spacing between sections */

section+section {
    margin-top: 2rem;
}


/* Improved container spacing */

.container {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}


/* Enhanced Card Styling */

.card {
    transition: all 0.3s ease;
    margin-bottom: 0.75rem;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
     
            .hover-float:hover {
                transform: translateY(-5px);
                transition: transform 0.3s ease;
            }
            
            .path-icon {
                width: 60px;
                height: 60px;
                background-color: rgba(241, 189, 3, 0.1);
                border-radius: 50%;
                transition: all 0.3s ease;
            }
            
            .card:hover .path-icon {
                transform: scale(1.1);
                background-color: rgba(241, 189, 3, 0.2);
            }
            
            .vision-box {
                border-radius: 10px;
                height: 100%;
                transition: all 0.3s ease;
                border-bottom: 3px solid transparent;
            }
            
            .vision-box:hover {
                border-bottom: 3px solid #f1bd03;
                transform: translateY(-5px);
            }
            
            .team-member {
                transition: all 0.3s ease;
            }
            
            .team-member:hover {
                transform: translateY(-10px);
            }
            
            .team-member .team-social {
                opacity: 0;
                transition: all 0.3s ease;
            }
            
            .team-member:hover .team-social {
                opacity: 1;
            }
            
            .parallax-section {
                background-attachment: fixed;
                background-position: center;
                background-repeat: no-repeat;
                background-size: cover;
            }

/* Better spacing for vision boxes */

.vision-box {
   
    margin-bottom: 0.75rem;
    border-radius: 5px;
    height: 100%;
    transition: all 0.3s ease;
    border-bottom: 3px solid transparent;
}

.vision-box:hover {
    border-bottom: 3px solid var(--accent-color);
    transform: translateY(-5px);
}


/* Improved button styling */

.btn {
    border-radius: 4px;
    padding: 0.8rem 2rem;
    transition: all 0.3s ease;
}


/* Call to Action Enhancement */

#cta {
    background-color: var(--accent-color);

    color: white;
    padding: 2rem 0;
    border-radius: 0;
}

#cta .btn-light {
    background-color: var(--light-color);
    color: var(--dark-color);
    border-color: var(--light-color);
    font-weight: 600;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    padding: 0.4rem 1rem;
}

#cta .btn-light:hover {
    background-color: var(--accent-color);
    color: var(--dark-color);
    border-color: var(--accent-color);
}


/* Enhanced Responsive Support */

@media screen and (max-width: 991px) {
    .display-2 {
        font-size: 2.5rem;
    }
    .display-5 {
        font-size: 1.8rem;
    }
    .row>[class*="col-"] {
        margin-bottom: 0.75rem;
    }
    #cta {
        padding: 1.5rem 0;
    }
    .btn {
        padding: 0.3rem 0.75rem;
    }
    .methodology-item {
        margin-bottom: 0.75rem;
    }
}

@media screen and (max-width: 768px) {
    .display-2 {
        font-size: 2rem;
    }
    .display-5 {
        font-size: 1.5rem;
    }
    .path-icon {
        width: 45px;
        height: 45px;
    }
    #cta .btn-light {
        display: block;
        width: 100%;
        margin-top: 1rem;
    }
}


/* Enhanced RTL Support */

html[dir="rtl"] .accordion-button::after {
    margin-right: auto;
    margin-left: 0;
}

html[dir="rtl"] .me-2,
html[dir="rtl"] .me-3,
html[dir="rtl"] .me-4 {
    margin-left: 0.5rem !important;
    margin-right: 0 !important;
}

html[dir="rtl"] .me-3 {
    margin-left: 1rem !important;
}

html[dir="rtl"] .me-4 {
    margin-left: 1.5rem !important;
}

html[dir="rtl"] .ms-2,
html[dir="rtl"] .ms-3 {
    margin-right: 0.5rem !important;
    margin-left: 0 !important;
}

html[dir="rtl"] .ms-3 {
    margin-right: 1rem !important;
}

html[dir="rtl"] .ps-3 {
    padding-right: 1rem !important;
    padding-left: 0 !important;
}

html[dir="rtl"] .pe-3 {
    padding-left: 1rem !important;
    padding-right: 0 !important;
}

html[dir="rtl"] .text-start {
    text-align: right !important;
}

html[dir="rtl"] .text-end {
    text-align: left !important;
}

html[dir="rtl"] .float-start {
    float: right !important;
}

html[dir="rtl"] .float-end {
    float: left !important;
}


/* Fix alignment in services elements for RTL */

html[dir="rtl"] .services-element .d-flex {
    flex-direction: row-reverse;
}


/* Fix alignment in methodology items for RTL */

html[dir="rtl"] .methodology-item .d-flex {
    flex-direction: row-reverse;
}


/* Animation enhancements */

.hover-float {
    transition: transform 0.3s ease;
}

.hover-float:hover {
    transform: translateY(-5px);
}

.services-element {
    transition: all 0.3s ease;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

.services-element:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}


/* Improved spacing for FAQ section */

.accordion-item {
    margin-bottom: 0.5rem;
    border-radius: 4px;
    overflow: hidden;
}

.accordion-button {
    padding: 0.625rem;
    font-weight: 600;
}

.accordion-body {
    padding: 0.625rem;
    line-height: 1.6;
}


/* Better testimonial styling */

.testimonial-swiper .swiper-slide {
    padding: 0.5rem;
}


/* Smooth counter animation */

.counter-number {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: var(--dark-color);
}


/* Better visual hierarchy */

h2.display-5 {
    margin-bottom: 0.5rem;
}

p.secondary-font {
    margin-bottom: 1rem;
    line-height: 1.6;
}


/* Add comfortable line height for better readability */

p {
    line-height: 1.7;
}

/* Updated Footer Styling */
#bottom-wrap.footer {
    background-color: #f1bd03;
    padding: 3.5rem 0 2rem;
    font-family: var(--body-font);
    position: relative;
    box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.08);
    color: var(--dark-color);
}

#bottom-wrap .container {
    position: relative;
}

#bottom-wrap .border-wrap {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(10, 22, 34, 0.15);
}

#bottom-wrap .bottom-widget {
    margin-bottom: 1.5rem;
    padding: 0 0.5rem;
    transition: transform 0.3s ease;
}

#bottom-wrap .bottom-widget:hover {
    transform: translateY(-5px);
}

#bottom-wrap .widget_nav_menu h2,
#bottom-wrap .widget_nav_menu .widgettitle {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    color: var(--dark-color);
    text-transform: capitalize;
    position: relative;
    padding-bottom: 0.75rem;
}

#bottom-wrap .widget_nav_menu h2:after,
#bottom-wrap .widget_nav_menu .widgettitle:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2px;
    background-color: var(--dark-color);
}

#bottom-wrap .menu {
    padding: 0;
    margin: 0;
    list-style: none;
}

#bottom-wrap .menu li {
    margin-bottom: 1rem;
    transition: transform 0.3s ease;
}

/* Add icons to menu items */
#bottom-wrap .menu li a {
    color: rgba(10, 22, 34, 0.85);
    font-size: 1rem;
    font-weight: 500;
    transition: all 0.3s ease;
    text-decoration: none;
    display: flex;
    align-items: center;
}

/* Default icon for all menu items */
#bottom-wrap .menu li a:before {
    content: '';
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.3s ease;
}

/* Specific icons for menu items - updated for new structure */
#bottom-wrap .menu-item-25543 a:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230a1622' d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM169.8 165.3c7.9-22.3 29.1-37.3 52.8-37.3h58.3c34.9 0 63.1 28.3 63.1 63.1c0 22.6-12.1 43.5-31.7 54.8L280 264.4c-.2 13-10.9 23.6-24 23.6c-13.3 0-24-10.7-24-24V250.5c0-8.6 4.6-16.5 12.1-20.8l44.3-25.4c4.7-2.7 7.6-7.7 7.6-13.1c0-8.4-6.8-15.1-15.1-15.1H222.6c-3.4 0-6.4 2.1-7.5 5.3l-.4 1.2c-4.4 12.5-18.2 19-30.6 14.6s-19-18.2-14.6-30.6l.4-1.2zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z'/%3E%3C/svg%3E");
}

#bottom-wrap .menu-item-25542 a:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230a1622' d='M256 288A144 144 0 1 0 256 0a144 144 0 1 0 0 288zm-94.7 32C72.2 320 0 392.2 0 481.3c0 17 13.8 30.7 30.7 30.7H481.3c17 0 30.7-13.8 30.7-30.7C512 392.2 439.8 320 350.7 320H161.3z'/%3E%3C/svg%3E");
}

#bottom-wrap .menu-item-24537 a:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230a1622' d='M480 352h-133.5l-45.25 45.25C289.2 409.3 273.1 416 256 416s-33.16-6.656-45.25-18.75L165.5 352H32c-17.67 0-32 14.33-32 32v96c0 17.67 14.33 32 32 32h448c17.67 0 32-14.33 32-32v-96C512 366.3 497.7 352 480 352zM432 456c-13.2 0-24-10.8-24-24c0-13.2 10.8-24 24-24s24 10.8 24 24C456 445.2 445.2 456 432 456zM233.4 374.6C239.6 380.9 247.8 384 256 384s16.38-3.125 22.62-9.375l128-128c12.49-12.5 12.49-32.75 0-45.25c-12.5-12.5-32.76-12.5-45.25 0L288 274.8V32c0-17.67-14.33-32-32-32C238.3 0 224 14.33 224 32v242.8L150.6 201.4c-12.49-12.5-32.75-12.5-45.25 0c-12.49 12.5-12.49 32.75 0 45.25L233.4 374.6z'/%3E%3C/svg%3E");
}

#bottom-wrap .menu-item-15478 a:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230a1622' d='M256 0c4.6 0 9.2 1 13.4 2.9L457.7 82.8c22 9.3 38.4 31 38.3 57.2c-.5 99.2-41.3 280.7-213.6 363.2c-16.7 8-36.1 8-52.8 0C57.3 420.7 16.5 239.2 16 140c-.1-26.2 16.3-47.9 38.3-57.2L242.7 2.9C246.8 1 251.4 0 256 0z'/%3E%3C/svg%3E");
}

#bottom-wrap .menu-item-15479 a:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%230a1622' d='M144 144v48H304V144c0-44.2-35.8-80-80-80s-80 35.8-80 80zM80 144c0-79.5 64.5-144 144-144s144 64.5 144 144v48h16c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V256c0-35.3 28.7-64 64-64H80V144z'/%3E%3C/svg%3E");
}

#bottom-wrap .menu-item-25544 a:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%230a1622' d='M64 64C28.7 64 0 92.7 0 128V384c0 35.3 28.7 64 64 64H512c35.3 0 64-28.7 64-64V128c0-35.3-28.7-64-64-64H64zm64 320H64V320c35.3 0 64 28.7 64 64zM64 192V128h64c0 35.3-28.7 64-64 64zM448 384c0-35.3 28.7-64 64-64v64H448zm64-192c-35.3 0-64-28.7-64-64h64v64zM288 352c-53 0-96-43-96-96s43-96 96-96s96 43 96 96s-43 96-96 96z'/%3E%3C/svg%3E");
}

#bottom-wrap .menu li a:hover {
    color: var(--dark-color);
    font-weight: 600;
}

#bottom-wrap .menu li a:hover:before {
    transform: scale(1.2);
}

/* Empty column styling */
#bottom-wrap .col-lg-2:empty {
    min-height: 1px;
}

/* RTL Support */
html[dir="rtl"] #bottom-wrap .menu {
    padding-right: 0;
}

html[dir="rtl"] #bottom-wrap .widget_nav_menu h2:after,
html[dir="rtl"] #bottom-wrap .widget_nav_menu .widgettitle:after {
    left: auto;
    right: 0;
}

html[dir="rtl"] #bottom-wrap .menu li a:before {
    margin-right: 0;
    margin-left: 10px;
}

/* Footer Copyright Section (preserved from previous version) */
#footer-wrap {
    background-color: #0a1622;
    padding: 1.5rem 0;
    color: #fff;
}

#footer-wrap .footer-copyright {
    font-size: 0.95rem;
    display: flex;
    align-items: center;
}

#footer-wrap .footer-copyright:before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23f1bd03' d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM199.4 312.6c-31.2-31.2-31.2-81.9 0-113.1s81.9-31.2 113.1 0c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9c-50-50-131-50-181 0s-50 131 0 181s131 50 181 0c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0c-31.2 31.2-81.9 31.2-113.1 0z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

html[dir="rtl"] #footer-wrap .footer-copyright:before {
    margin-right: 0;
    margin-left: 10px;
}

/* Responsive Adjustments */
@media screen and (max-width: 991px) {
    #bottom-wrap.footer {
        padding: 3rem 0 1.5rem;
    }
    
    #bottom-wrap .bottom-widget {
        margin-bottom: 1.5rem;
    }
    
    #bottom-wrap .widget_nav_menu h2,
    #bottom-wrap .widget_nav_menu .widgettitle {
        font-size: 1.15rem;
        margin-bottom: 1.25rem;
    }
}

@media screen and (max-width: 767px) {
    #bottom-wrap.footer {
        padding: 2.5rem 0 1rem;
    }
    
    #bottom-wrap .menu li {
        margin-bottom: 0.75rem;
    }
    
    #bottom-wrap .menu li a {
        font-size: 0.95rem;
    }
    
    #footer-wrap .footer-copyright {
        justify-content: center;
        text-align: center;
    }
}

@media screen and (max-width: 575px) {
    #bottom-wrap .bottom-widget {
        margin-bottom: 1rem;
    }
}