/*
Theme Name:   Hinza
Theme URI:    https://hinzaco.com
Author:       Hinzaco - Azizi
Author URI:   https://hinzaco.com
Description:  A corporate website serves as the digital face of your brand. We design professional, well-structured websites tailored to your business goals, helping you build trust with your audience and effectively showcase your products and services. With modern design, strategic layout, team and project presentations, and clear contact information, we create a strong online presence that supports your company's growth and credibility.
Version:      1.0
Tested up to: 7.0
Requires PHP: 8.2.0
License:      GNU General Public License v3 or later
License URI:  https://www.gnu.org/licenses/gpl-3.0.html
Text Domain:  Hinza
*/


:root {
    --primary-color: #061E3A;
    --primary-color-dark: #111827;
    --secondary-color: #64748B;
    --secondary-color-dark: #39485d;
    --accent-color: #F0571A;
    --text-color: #333333;
    --text-color-dark: #111827;
    --text-color-light: #F1F5F9;
    --text-color-light2: #555555;
    --border-color-light: #e6e6e6;
    --border-color-dark: #b7b7b7;
    --border-color-dark2: #cccccc;
    --background-color: #f1f1f1;
    --background-color-secondary: #e5dedf;
    --text-font-family: Roboto;
    --digits-font-family: var(--text-font-family);
}

input, input::-webkit-input-placeholder {
    font-size: 14px !important;
    font-family: var(--text-font-family) !important
}

body {
    font-size: 14px;
    font-family: var(--text-font-family);
    font-weight: 400;
    line-height: 1.8;
    color: var(--text-color)
}

/* ------------- reset css ----------------*/
*, *::before, *::after {
    box-sizing: border-box
}

a {
    color: var(--accent-color);
    text-decoration: none;
    transition: all 0.5s
}

a:hover {
    color: var(--text-color-dark);
    outline: 0;
    box-shadow: none
}

a:focus {
    outline: 0;
    box-shadow: none
}

html {
    scroll-behaviour: smooth
}

body {
    margin: 0;
    max-width: 100vw;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased
}

::-webkit-scrollbar {
    width: 10px
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 0;
    background: #000
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--primary-color);
    border-radius: 10px
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: var(--secondary-color)
}

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%
}

input, button, textarea, select {
    font: inherit
}

h1 {
    font-size: 20px
}

h2 {
    font-size: 19px
}

h3 {
    font-size: 18px
}

h4 {
    font-size: 17px
}

h5 {
    font-size: 16px
}

h6 {
    font-size: 15px
}

ul {
    list-style-type: none;
    padding: 0
}

p {
    margin-bottom: 20px
}

p:first-child {
    margin-top: 0
}

p:last-child {
    margin-bottom: 0
}

/* -------------- General / Start ------------- */
.absolute-link {
    position: absolute;
    width: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.d-none {
    display: none !important;
}

.d-block {
    display: block !important;
}

.pt-0 {
    padding-top: 0 !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.section {
    padding: 80px 10px;
}

@media (max-width: 1023.98px) {
    .section {
        padding-top: 60px;
        padding-bottom: 60px;
    }
}

@media (max-width: 991.98px) {
    .section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
}

@media (max-width: 767.98px) {
    .section {
        padding-top: 30px;
        padding-bottom: 30px;
    }
}

@media (max-width: 575.98px) {
    .section {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}


.section .section-desc,
.section .section-desc * {
    font-family: var(--text-font-family);
    color: var(--text-color);
    font-size: 14px;
    text-align: justify;
    font-weight: 300;
    line-height: 1.8;
}

.section .section-desc a {
    color: var(--accent-color);
    text-decoration: underline !important;
    text-underline-offset: 5px;
}

.section .section-desc b, .section .section-desc strong {
    font-weight: bold;
}

.section .section-desc ul {
    list-style: disc;
    padding-right: 20px;
    margin: 15px 0;
}

.section .section-desc ol {
    padding-right: 20px;
    margin: 15px 0;
}

.section .section-desc h1,
.section .section-desc h1 * {
    font-family: var(--text-font-family);
    font-size: 24px;
    font-weight: 700;
}

.section .section-desc h2,
.section .section-desc h2 * {
    font-family: var(--text-font-family);
    font-size: 20px;
    font-weight: 600;
}

.section .section-desc h3,
.section .section-desc h3 * {
    font-family: var(--text-font-family);
    font-size: 20px;
    font-weight: 500;
}

.section .section-desc h4,
.section .section-desc h4 * {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: 500;
}

.section .section-desc h5,
.section .section-desc h5 * {
    font-family: var(--text-font-family);
    font-size: 16px;
    font-weight: 400;
}

.text-center {
    text-align: center
}

.form-control {
    padding: 0 15px;
    line-height: 40px;
    border: none;
    border-left: 1px solid var(--border-color-light);
    width: 100%;
    border-radius: 0px;
    font-size: 14px;
    font-family: var(--text-font-family);
    color: var(--secondary-color-dark);
    text-align: left;
    background-color: #d7d7d7c9;
}

.form-wrapper .col-lg-6:nth-child(2) .form-control {
    border-left-width: 0px;
}

.form-control:focus-visible {
    outline: none;
}

textarea.form-control {
    padding: 10px 15px;
    line-height: 26px;
    height: 98px !important;
}

label.resume-upload {
    display: inline-block;
    text-align: center;
    width: 92px;
    padding: 0 5px;
    line-height: 33px;
    border-radius: 5px;
    border: 1px solid var(--text-color-dark);
    background: #fff;
    position: relative;
    z-index: 2;
    cursor: pointer
}

.wpcf7-form-control-wrap[data-name="resume"] {
    margin-right: -92px
}

.wpcf7-spinner {
    position: absolute;
    transform: translateX(250%);
    margin: 0
}

.form-wrapper .form-info {
    width: 78%;
    gap: 0px;
    display: flex;
    padding: 0px;

}

.form-wrapper .Rect-btn-wrapper {
    width: 20%;
    padding: 0px;
}

.form-wrapper {
    justify-content: center;
    max-width: 767px;
    margin: 0px auto;
    flex-direction: row-reverse;
}

.form-wrapper .Rect-btn-wrapper .wpcf7-submit {
    font-family: var(--text-font-family);
    position: relative;
    font-size: 14px;
    font-weight: bold;
    padding: 0 25px;
    height: 42px;
    line-height: 40px;
    background: var(--primary-color) !important;
    border: 1px solid var(--primary-color);
    border-radius: 0;
    color: #fff;
    box-shadow: none;
    overflow: hidden;
    z-index: 1;
    transition: all .4s ease;
    width: 100%;
    cursor: pointer;
}

.form-wrapper .Rect-btn-wrapper:hover .wpcf7-submit {
    color: #fff;
    border-color: var(--accent-color);
    background: var(--accent-color) !important;
}

.form-wrapper .Rect-btn-wrapper .wpcf7-submit::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--accent-color);
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .4s ease;
}

.form-wrapper .Rect-btn-wrapper:hover .wpcf7-submit::before {
    transform: scaleX(1);
}

.form-wrapper .wpcf7-not-valid-tip {
    color: var(--accent-color);
    margin-top: 5px;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output, .wpcf7 form.sent .wpcf7-response-output {
    border-color: var(--border-color-light);
    color: var(--text-color-light);
    max-width: 752px;
    margin: 0px auto;
}

.wpcf7 form .wpcf7-response-output {
    border: 1px solid var(--border-color-light);
    margin-top: 10px;
}

/*--------- General / End ---------------*/
/*------ Swiper / Start -------------*/
.swiper {
    position: relative;
}

.swiper .swiper-pagination {
    z-index: 1 !important;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    box-shadow: 0 0 20px #0000009e;
}

/*------ Swiper / End -------------*/
/*------ Titles / Start -------------*/

.section .section-title .elementor-heading-title,
.section .section-title .elementor-heading-title * {
    font-family: var(--text-font-family);
    font-size: 30px;
    font-weight: bold;
    line-height: 1.5;
    color: var(--primary-color);
}

.section .section-title .elementor-heading-title span {
    color: var(--accent-color);
}

.section .section-subtitle .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 14px;
    font-weight: bold;
    line-height: 1.5;
    color: var(--accent-color);
    padding-left: 10px;
    padding-bottom: 10px;
    border-left: 1px solid var(--accent-color);
    border-bottom: 1px solid var(--accent-color);
    display: inline-block;
}

.section .section-subtitle .elementor-heading-title a {
    font-weight: bold;
    line-height: 1.5;
}

@media (max-width: 1023.98px) {
    .section .section-title .elementor-heading-title {
        font-size: 26px;
    }
}

@media (max-width: 991.98px) {
    .section .section-title .elementor-heading-title {
        font-size: 24px;
    }

    .section .subtitle .elementor-heading-title {
        font-size: 20px;
    }
}

@media (max-width: 767.98px) {
    .section .section-title .elementor-heading-title {
        font-size: 20px;
    }

    .section .section-subtitle .elementor-heading-title {
        font-size: 14px;
    }
}

@media (max-width: 575.98px) {
    .section .section-title .elementor-heading-title {
        font-size: 16px;
    }

    .section .subtitle .elementor-heading-title {
        font-size: 18px;
    }
}

/*------ Titles / End -------------*/
/*------ Buttons / Start -------------*/
.button, .button-border {
    display: block;
}

.button, .btn .elementor-button {
    font-family: var(--text-font-family);
    position: relative;
    font-size: 14px;
    font-weight: 500;
    padding: 0 25px;
    height: 42px;
    line-height: 40px;
    background: var(--primary-color) !important;
    border: 1px solid var(--primary-color);
    border-radius: 0;
    color: #fff;
    box-shadow: none;
    overflow: hidden;
    z-index: 1;
    transition: color .4s ease;
    text-wrap: nowrap;
}

.btn .elementor-button .elementor-button-icon {
    color: var(--accent-color);
}

.btn .elementor-button .elementor-button-text {
    font-family: var(--text-font-family);
    color: #fff;
    line-height: 40px;
}

.btn a::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--accent-color);
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .4s ease;
}

.btn:hover a::before {
    transform: scaleX(1);
}

.btn:hover .elementor-button:hover {
    color: #fff;
    border-color: var(--accent-color);
}

.btn:hover .elementor-button-icon svg {
    color: #fff;
    fill: #fff;
}

.button-border, .btn-border .elementor-button {
    font-family: var(--text-font-family);
    position: relative;
    font-size: 14px;
    font-weight: 500;
    padding: 0 25px;
    height: 42px;
    line-height: 40px;
    background: transparent !important;
    border: 1px solid var(--secondary-color);
    border-radius: 0;
    color: var(--secondary-color);
    box-shadow: none;
    transition: all 0.3s;
}

.button-border:hover, .btn-border .elementor-button .elementor-button-text {
    font-family: var(--text-font-family);
    font-size: 14px;
    font-weight: 500;
}

.button-border:hover, .btn-border:hover .elementor-button,
.button-border:focus, .btn-border:focus .elementor-button {
    box-shadow: none;
    background: var(--primary-color) !important;
    border-color: var(--primary-color);
    color: #fff;
}

/*------ Buttons / End -------------*/
/* ----------- Header / Start --------------- */
.header {
    border-bottom: 1px solid var(--border-color-light);
}

.header .btn-border {
    line-height: 0.5
}

.header .btn-border .elementor-button {
    white-space: nowrap
}

.header .language-nav {
    position: relative
}

.header .mobile-btn {
    display: none !important
}

.header .language-nav .elementor-nav-menu--main {
}

.header .language-nav .elementor-nav-menu--main .elementor-nav-menu > .menu-item {
    border: 1px solid var(--text-color);
    border-radius: 3px
}

.header .language-nav .elementor-nav-menu--main .elementor-nav-menu > .menu-item > .elementor-item {
    line-height: 40px;
    width: 40px;
    padding: 0;
    font-size: 16px;
    justify-content: center;
    font-weight: 400
}

.header .language-nav .elementor-nav-menu--main .elementor-nav-menu > .menu-item > .elementor-item .sub-arrow {
    padding: 0
}

.header .language-nav .elementor-nav-menu--main .elementor-nav-menu > .menu-item > .elementor-item .sub-arrow svg {
    font-size: 12px
}

.header .language-nav .elementor-nav-menu--main .elementor-nav-menu > .menu-item > .sub-menu {
    width: 42px !important;
    min-width: 42px !important;
    top: 41px !important;
    left: auto !important;
    right: -1px;
    border-radius: 0px
}

.header .language-nav .elementor-nav-menu--main .elementor-nav-menu > .menu-item > .sub-menu > .menu-item .elementor-sub-item {
    text-align: center;
    padding: 0;
    line-height: 40px;
    font-weight: 400
}

.header .navbar .elementor-icon-list-items {
    gap: 10px
}

.header .navbar .elementor-icon-list-items .elementor-icon-list-item .elementor-icon-list-text {
    font-family: var(--text-font-family);
    color: #fff;
    font-size: 14px;
    font-weight: 400
}

.header .logo {
    max-width: 250px !important;
    height: 60px
}

.header .logo a {
    max-width: 250px !important;
    height: 60px
}

.header .logo img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.header .elementor-nav-menu .menu-item-has-children .menu-item .elementor-sub-item:hover {
    background-color: #8fa6af
}

.header .elementor-nav-menu .menu-item-has-children .elementor-nav-menu--dropdown {
    border: 1px solid #8fa6af;
    border-radius: 5px;
    margin-left: 20px !important
}

.header .elementor-nav-menu .menu-item-has-children .elementor-nav-menu--dropdown .menu-item .elementor-sub-item {
    padding: 10px 15px;
    font-family: var(--text-font-family) !important;
}

.header .menu .menu-item .hfe-menu-item {
    font-family: var(--text-font-family) !important;
    font-size: 15px;
    font-weight: 500;
    color: var(--text-color-dark);
}

.header .menu .menu-item .hfe-menu-item:hover {
    color: var(--secondary-color-dark);
}

.header .menu .menu-item .sub-menu {
    left: inherit !important;
    right: 0 !important;
}

.header .menu .menu-item .sub-menu .hfe-sub-menu-item {
    font-family: var(--text-font-family) !important;
    font-size: 15px;
    font-weight: 500;
    color: var(--text-color-dark);
    padding: 10px 15px;
}

.header .menu .menu-item .sub-menu .hfe-sub-menu-item:hover {
    color: var(--secondary-color);
}

@media (max-width: 1024px) {
    .header .menu .menu-item .sub-menu .hfe-sub-menu-item {
        background: var(--background-color) !important;
    }
}

.header .btn, .header .btn-popup {
    align-items: center;
    display: flex;
}

.header .logo-title .elementor-heading-title {
    font-family: var(--text-font-family) !important;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-color-dark);
    text-wrap: nowrap;
}

.header .btn-popup a {
    background-color: var(--accent-color) !important;
    color: var(--text-color-light) !important;
    border-color: var(--accent-color) !important;

}

.header .btn-popup a .elementor-button-content-wrapper .elementor-button-text {
    color: var(--text-color-light) !important;
}


.header .btn-popup.btn a::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--primary-color);
    z-index: -1;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .4s ease;
}

.header .btn-popup.btn:hover a::before {
    transform: scaleX(1);
}

.header .btn-popup.btn:hover .elementor-button:hover {
    border-color: var(--primary-color) !important;

}

.header {
    position: relative;
    width: 100%;
    transition: all .35s ease;
    z-index: 9999;
}

.header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #fff;
    box-shadow: 0 8px 30px rgba(0, 0, 0, .08);
    animation: headerDown .35s ease;
}

body.header-sticky {
    padding-top: 90px;
}

.btn-col .btn-lan .elementor-button {
    padding: 0 12px;
    background-color: transparent !important;
    color: var(--primary-color) !important;
}

.btn-col .btn-lan .elementor-button .elementor-button-text {
    color: var(--primary-color) !important;
}

.btn-col .btn-lan:hover .elementor-button .elementor-button-text {
    color: #fff !important;
}

@keyframes headerDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@media (max-width: 1190px) {
    .header .menu .hfe-nav-menu .menu-item .hfe-menu-item {
        padding-left: 7px !important;
        padding-right: 7px !important;
    }
}

@media (max-width: 1024px) {
    .header .btn .elementor-button {
        padding: 0px 12px;
        width: 100%;
    }

    .header .btn.btn-lan {
        width: fit-content !important;
    }

    .header .btn.btn-lan .elementor-button {
        width: auto;
    }

    .header .menu .hfe-nav-menu .hfe-nav-menu__layout-horizontal {
        left: -218px !important;
        right: auto !important;
        max-width: 97vw !important;
    }
}

@media (max-width: 992px) {
    .header .btn .elementor-button .elementor-button-text {
        font-size: 12px;
    }

    .header .btn {
        flex-basis: fit-content;
    }
}

@media (max-width: 767.98px) {
    .header .logo-title .elementor-heading-title {
        font-size: 12px;
    }

    .header .hfe-nav-menu__toggle .hfe-nav-menu-icon {
        border: 1px solid;
    }

    .header .hfe-nav-menu__toggle {
        display: flex !important;
    }

    .header .menu .hfe-nav-menu .hfe-nav-menu__layout-horizontal {
        left: -175px !important;

    }
}

@media (max-width: 580px) {
    .header .logo-title {
        display: none;
    }

    .header .logo-col {
        width: 55px;
    }

    .header .btn-col {
        width: 70%;
    }

    .header .menu-col {
        width: 30%;
    }

    .header .menu .hfe-nav-menu .hfe-nav-menu__layout-horizontal {
        left: -57px !important;
    }
}

@media (max-width: 430px) {
    .header .btn.btn-call .elementor-button .elementor-button-text {
        display: none;
    }

    .header .btn.btn-call .elementor-button .elementor-button-content-wrapper {
        height: 100%;
    }

    .header .btn .elementor-button {
        padding: 0px 9px;
    }
}

/* ----------- Header / End --------------- */
/*----------- popup / Start --------------*/
.contact-form .form-control option {
    line-height: 40px;
}

#popup-section {
    position: fixed;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, .5);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: opacity .35s ease,
    visibility .35s ease;
}

#popup-section > * {
    transform: scale(.95) translateY(20px);
    opacity: 0;

    transition: transform .35s cubic-bezier(.2, .8, .2, 1),
    opacity .35s ease;
}

#popup-section.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

#popup-section.active > * {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.popup-section.section {
    padding-top: 200px;
}

.popup-close svg {
    fill: var(--primary-color);
}

.popup-close .elementor-button {
    background-color: #fff !important;
}


/* ----------- popup / End --------------- */
/*----------- Footer / Start --------------*/
.footer {
    background: var(--text-color);
    padding-top: 60px;
    padding-bottom: 0
}

.footer .footer-bottom .text-footer p {
    font-family: var(--text-font-family);
    color: var(--text-color-light);
    font-size: 14px;
    opacity: 0.8;
    text-align: center;
}

.footer .footer-title .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    color: #fff
}

.footer .footer-bottom .social-media .elementor-icon-list-item .elementor-icon-list-icon {
    width: 44px !important;
}

.footer .footer-bottom .social-media .elementor-icon-list-items .elementor-icon-list-item .elementor-icon-list-icon svg {
    height: 20px;
    width: 20px;
}

.footer .contact-info .elementor-icon-list-item:not(:last-child) {
    padding-bottom: 10px
}

.footer .contact-info .elementor-icon-list-item .elementor-icon-list-icon {
    height: 20px;
    align-items: center
}

.footer .contact-info .elementor-icon-list-item .elementor-icon-list-icon svg {
    margin: 0;
    color: #fff;
    fill: #fff
}

.footer .contact-info .elementor-icon-list-item .elementor-icon-list-text {
    font-family: var(--text-font-family);
    font-size: 14px;
    line-height: 26px;
    color: #fff;
    font-weight: 300;
    opacity: 0.6
}

.footer .section-title {
    padding-right: 100px !important
}

.footer .section-title .elementor-heading-title {
    color: #fff;
    font-size: 45px;
    margin-bottom: 0;
    letter-spacing: 3px;
    font-weight: 300;
    opacity: 0.8
}

.footer .footer-title .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    color: #fff
}

.footer .contact-info .elementor-icon-list-item:not(:last-child) {
    padding-bottom: 10px
}

.footer .contact-info .elementor-icon-list-item .elementor-icon-list-icon {
    height: 20px;
    align-items: center
}

.footer .contact-info .elementor-icon-list-item .elementor-icon-list-icon svg {
    margin: 0;
    color: #fff;
    fill: #fff
}

.footer .contact-info .elementor-icon-list-item .elementor-icon-list-text {
    font-family: var(--text-font-family);
    font-size: 14px;
    line-height: 26px;
    color: var(--text-color-light);
    font-weight: 300;
    opacity: 0.8
}

.footer .contact-info .elementor-icon-list-item .elementor-icon-list-text:hover {
    opacity: 1;
}

.footer .footer-menu .hfe-nav-menu .menu-item .hfe-menu-item {
    font-family: var(--text-font-family);
    font-size: 14px;
    line-height: 22px;
    color: var(--text-color-light) !important;
    font-weight: 300;
    opacity: 0.8
}

.footer .footer-menu .hfe-nav-menu .menu-item .hfe-menu-item:hover {
    opacity: 1;
}

.form .form-wrapper .wpcf7-form-control-wrap input:focus-visible {
    outline: none
}

.copyright p {
    font-size: 12px;
    color: #fff;
    font-family: var(--text-font-family);
}

.footer .main-title .elementor-heading-title {
    font-family: var(--text-font-family) !important;
}

.footer .catalog-btn .elementor-icon-list-text {
    font-family: var(--text-font-family) !important;
}

/*----------- Footer / End --------------*/
/*-------------- BACK TO TOP / Start ------------- */
.back-to-top {
    transition: all .3s;
}

.back-to-top a {
    border: 2px solid var(--primary-color);
    width: 40px;
    height: 40px;
    text-align: center;
    font-size: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    right: 9px;
    bottom: 9px;
    border-radius: 50%;
    z-index: 99;
    transition: all .3s;
}

.back-to-top a svg {
    transition: all .3s;
}

.back-to-top a:hover svg,
.back-to-top a:hover {
    color: #fff !important;
    fill: #fff !important;
    background: var(--primary-color);
    border-color: #fff !important;
}

/*-------------- BACK TO TOP / End ------------- */

/*----------- Blog cart / Start --------------*/
.blog-cart .img-wrapper {
    display: block;
    aspect-ratio: 5/3;
    height: 100%;
    border-radius: 0px;
    overflow: hidden;
    margin-bottom: 15px
}

.blog-cart .img-wrapper img {
    width: 100% !important;
    height: 100% !important;
    max-width: inherit !important;
    object-fit: cover;
    display: block
}

.blog-cart-minimal {
    padding-left: 40px
}

.blog-cart .blog-date {
    padding-right: 40px
}

.blog-cart .info-wrapper {
    position: relative;
    padding-bottom: 45px;
}

.blog-cart .blog-date, .blog-cart-minimal .blog-date {
    font-family: var(--digits-font-family);
    color: var(--text-color-light2);
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    position: relative;
    margin-bottom: 10px
}

.blog-cart .blog-title, .blog-cart-minimal .blog-title {
    font-family: var(--text-font-family);
    color: var(--primary-color);
    font-size: 16px;
    line-height: 30px;
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
    padding-bottom: 15px;
    margin-bottom: 12px;
}

.blog-cart .blog-title:before, .blog-cart-minimal .blog-title:before {
    content: '';
    width: 40px;
    height: 2px;
    background: var(--accent-color);
    position: absolute;
    left: 0;
    bottom: 2px;
}

.blog-cart .blog-title:after, .blog-cart-minimal .blog-title:after {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-color);
    position: absolute;
    left: 0;
    bottom: 0px;
}

.blog-cart .blog-desc, .blog-cart-minimal .blog-desc {
    font-family: var(--text-font-family);
    color: var(--text-color);
    font-size: 14px;
    font-weight: 300;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-cart .blog-desc *, .blog-cart-minimal .blog-desc * {
    font-family: var(--text-font-family);
    color: var(--text-color);
    font-size: 14px;
    font-weight: 300;
}

.blog-cart .btn-more, .blog-cart-minimal .btn-more {
    font-family: var(--text-font-family);
    color: var(--accent-color);
    display: block;
    font-size: 14px;
    line-height: 30px;
    height: 0;
    overflow: hidden;
    transition: all .5s ease-in-out;
    position: absolute;
    bottom: 0;
    left: 0;
}

.blog-cart .btn-more:after, .blog-cart-minimal .btn-more:after {
    content: '';
    width: 16px;
    height: 16px;
    background: url('assets/img/arrow.svg') no-repeat center center /contain;
    vertical-align: middle;
    display: inline-block;
    margin-right: 3px
}

.blog-cart:hover .blog-title, .blog-cart-minimal:hover .blog-title {
    color: var(--accent-color)
}

.blog-cart:hover .btn-more, .blog-cart-minimal:hover .btn-more {
    height: 30px;
}


@media (max-width: 575.98px) {
    .blog-cart {
        display: flex
    }

    .blog-cart .img-wrapper {
        margin-bottom: 0;
        aspect-ratio: 1/1;
        flex-basis: 160px;
        width: 160px;
        height: 164px
    }

    .blog-cart .info-wrapper {
        flex: 1 0 50%;
        max-width: calc(100% - 150px);
        padding-left: 10px;
        padding-right: 10px;
    }

    .blog-cart .blog-date {
        font-size: 12px
    }

    .blog-cart .blog-title {
        font-size: 16px;
        line-height: 20px
    }

    .blog-cart .blog-desc {
        margin: 10px 0
    }

    .blog-cart .blog-desc * {
        line-height: 1.6
    }
}

@media (max-width: 430px) {
    .blog-cart .blog-desc {
        display: none
    }

    .blog-cart .blog-title {
        margin-bottom: 10px
    }

    .blog-cart .img-wrapper {
        height: auto;
        width: 130px;
        flex-basis: 130px
    }

    .blog-cart {
        padding-bottom: 10px;
    }
}

/*----------- Blog cart / End --------------*/
/*------------ Page header / Start ---------------*/

.page-header {
    position: relative;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center left;
    background-size: cover;
    border-bottom: 1px solid var(--border-color-light);
    min-height: 400px;
}

@media (max-width: 580px) {
    .page-header {
        min-height: 250px;
    }
}


/*------------ Page header / End ---------------*/
/* ----------- Homepage / Start --------------- */
.section-hero {
    padding: 0 !important
}

.section-hero .col-one {
    background-color: var(--primary-color);
    padding: 60px;
}

.section-hero .col-one .subtitle .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 30px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--border-color-light);
    position: relative;
    margin-bottom: 12px;
}

.section-hero .col-one .subtitle:before {
    position: absolute;
    content: '';
    background-color: var(--accent-color);
    width: 100px;
    height: 3px;
    left: 110px;
    bottom: 30px;
}

.section-hero .col-one .subtitle:after {
    position: absolute;
    content: '';
    background-color: var(--accent-color);
    width: 50px;
    height: 1px;
    left: 110px;
    bottom: 24px;
}

.section-hero .col-one .counter .elementor-counter-number-wrapper {
    direction: ltr;
}

.section-hero .col-one .counter .elementor-counter-number-wrapper * {
    font-family: var(--digits-font-family);
    font-size: 56px;
    line-height: 60px;
    color: var(--accent-color);
}

.section-hero .col-one .counter .elementor-counter-number-wrapper .elementor-counter-number-prefix {
    font-size: 30px;
    font-weight: bold;
}

.section-hero .col-one .counter .elementor-counter-title {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: 300;
    line-height: 1.3;
    color: var(--border-color-dark);
}

.section-hero .vertical-text {
    margin: 20px 0 !important;
    padding: 10px;
    border-right: 1px solid var(--border-color-light);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.section-hero .vertical-text .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: bold;
    color: var(--border-color-light);
    text-align: center;
    white-space: nowrap;
    transform: rotate(90deg) translateX(-75px);
}

.section-hero .title {
    padding: 30px;
}

.section-hero .title .elementor-heading-title,
.section-hero .title .elementor-heading-title * {
    font-family: var(--text-font-family);
    font-size: 60px;
    font-weight: bold;
    line-height: 1.4;
    color: var(--primary-color);
}

.section-hero .title .elementor-heading-title span {
    color: var(--accent-color);
}

.section-hero .video-wrapper {
    position: relative;
}

.section-hero .video-wrapper .metal {
    width: 150px;
    height: auto;
    position: absolute;
    top: -50px;
    right: 38%;
    z-index: 1;
    animation-name: fullrotate;
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes fullrotate {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

.section-hero .video-content {
    padding: 20px 20px 20px 7%;
    background: #fff;
    position: absolute;
    right: 0;
    bottom: 300px;
    top: -1px;
}

.section-hero .video-content .section-title .elementor-heading-title span {
    font-weight: 300;
    color: var(--primary-color);
}

.section-hero .video-content .section-desc {
    width: 70%;
}

/**/

.section-categories {
}

.section-categories .cat-item {
    border: 1px solid var(--border-color-light);
    position: relative;
    transition: all 0.4s;
}

.section-categories .cat-item:hover {
    border-color: var(--primary-color);
}

.section-categories .cat-item:before {
    content: '';
    width: 1px;
    border-left: 1px dashed var(--border-color-light);
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(30% + 120px);
}

.section-categories .cat-item:after {
    content: '';
    width: 1px;
    border-left: 1px dashed var(--border-color-light);
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(30% + 180px);
    z-index: -1;
}

.section-categories .cat-item .cat-details {
    width: 30%;
    border-left: 1px solid var(--border-color-light);
    background: var(--background-color);
}

.section-categories .cat-item .cat-details .elementor-image-box-img {
    padding: 40px 50px 30px 50px;
    margin-bottom: 0;
    background: #fff;


}


.section-categories .cat-item .cat-details .elementor-image-box-img img {
    object-fit: contain;
    /*    transition: filter .08s linear;*/
    filter: none;
}

/*.section-categories .cat-item:hover .cat-details .elementor-image-box-img img{
    filter: brightness(0) saturate(100%) invert(40%) sepia(51%) saturate(3088%) hue-rotate(352deg) brightness(97%) contrast(94%);
}*/
.section-categories .cat-item .cat-details .elementor-image-box-content {
    padding: 25px;
}

.section-categories .cat-item .cat-details .elementor-image-box-content .elementor-image-box-title {
    font-family: var(--text-font-family);
    font-size: 16px;
    font-weight: 600;
    color: var(--primary-color);
    margin-top: 0;
}

.section-categories .cat-item .cat-details .elementor-image-box-content .elementor-image-box-description {
    font-family: var(--text-font-family);
    font-size: 14px;
    font-weight: 300;
    color: var(--text-color);
}

.section-categories .cat-item .cat-pic {
    width: calc(70% - 60px);
}

.section-categories .cat-item .vertical-text {
    padding: 5px 10px 5px 0;
    border-left: 1px dashed var(--border-color-light);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.section-categories .cat-item .vertical-text .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 50px;
    font-weight: bold;
    text-align: center;
    white-space: nowrap;
    transform: rotate(90deg) translateX(-120px);
    color: transparent;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: var(--border-color-light);
    text-transform: uppercase;
    transition: all 0.4s;
}

.section-categories .cat-item:hover .vertical-text .elementor-heading-title {
    -webkit-text-stroke-color: var(--primary-color);
}

/**/
.box-why-us {
    padding: 40px;
    min-height: 360px;
    transition: all 0.4s;
}

.box-why-us .elementor-icon-box-content .elementor-icon-box-title {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.4s;
}

.box-why-us:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: url("assets/img/shape-11.png") center/cover no-repeat;
    opacity: 1;
    z-index: 0;
    will-change: opacity;
    transform: translateZ(0);
    backface-visibility: hidden;
    pointer-events: none;
}

.box-why-us:after {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--primary-color);
    clip-path: inset(0 0 100% 0);
    transition: clip-path .4s ease;
    z-index: 1;
}

.box-why-us .elementor-icon-box-content .elementor-icon-box-description {
    font-family: var(--text-font-family);
    font-size: 13px;
    font-weight: 300;
    color: var(--text-color-light2);
    transition: all 0.4s;
}

.box-why-us:hover::before {
    opacity: 0;
}

.box-why-us:hover:after {
    clip-path: inset(0 0 0 0);
}

.box-why-us .elementor-widget-icon-box {
    z-index: 3;
}

.box-why-us:hover .elementor-icon-box-content .elementor-icon-box-title {
    color: var(--text-color-light);
}

.box-why-us:hover .elementor-icon-box-content .elementor-icon-box-description {
    color: var(--border-color-dark);
}

.box-why-us .elementor-icon {
    position: relative;
    border-bottom: 1px solid;
    padding-bottom: 20px;
    width: 50px;
}

.box-why-us .elementor-icon:before {
    position: absolute;
    content: "";
    background-color: var(--accent-color);
    width: 1px;
    height: 20px;
    bottom: -9px;
    right: 0px;
}

.box-why-us .elementor-icon:after {
    position: absolute;
    content: "";
    background-color: var(--accent-color);
    width: 1px;
    height: 20px;
    bottom: -9px;
    left: 0px;
}

.box-why-us .elementor-icon svg {

}

.box-why-us .elementor-icon-box-wrapper {
    position: relative;
}

.box-why-us .elementor-icon-box-wrapper:before {
    content: "";
    position: absolute;
    right: -10px;
    top: -10px;
    width: 100%;
    height: 100%;
    background: url("assets/img/gear.svg") right top no-repeat;
    opacity: 0.03;
    z-index: 0;
    background-size: 120px;
    transition: all 0.4s;
}

.box-why-us:hover .elementor-icon-box-wrapper:before {
    filter: brightness(0) saturate(100%) invert(100%) sepia(27%) saturate(2%) hue-rotate(250deg) brightness(114%) contrast(100%);
}

.section.cta {
    padding: 40px 10px;
}

.section.cta .section-subtitle .elementor-heading-title {
    font-size: 18px;
}

.section.cta .section-title.cta-title .elementor-heading-title {
    font-size: 22px;
}

.section.cta .btn-popup a {
    background-color: transparent !important;
}

.section.cta .btn-popup .elementor-button .elementor-button-text {
    color: var(--primary-color);
}

.section.cta .btn-popup:hover a .elementor-button-content-wrapper .elementor-button-text {
    color: var(--text-color-light) !important;
}

/**/

.section-steps {
    background: var(--primary-color);
}

.section-steps .section-title .elementor-heading-title {
    color: #fff;
}

.section-steps .section-desc,
.section-steps .section-desc * {
    color: var(--border-color-dark);
}

.section-steps .vertical-text {
    padding: 5px 10px 5px 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.section-steps .vertical-text .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 42px;
    line-height: 1.2;
    font-weight: bold;
    text-align: left;
    white-space: nowrap;
    transform: rotate(90deg) translate(60px, 60px);
    color: var(--secondary-color-dark);
    text-transform: uppercase;
    opacity: 0.2;
}

.section-steps .number {
    z-index: 1;
}

.section-steps .number .elementor-heading-title {
    font-family: var(--digits-font-family);
    font-size: 400px;
    line-height: 350px;
    height: 260px;
    font-weight: bold;
    background-image: url("assets/img/text-bg.png");
    color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.section-steps .circle-text {
    color: var(--border-color-light);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 130px;
    height: 130px;
    background-color: var(--secondary-color-dark);
    border-radius: 50%;
    text-align: center;
    padding: 0px 20px;
    margin-left: -75px;
}

.section-steps .circle-text .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 16px;
    font-weight: 300;
    color: var(--border-color-light);
    text-align: center;
}

.section-steps .e-n-tabs-heading {
    width: 60px;
    flex: 0 0 60px;
    border-right: 1px solid var(--secondary-color-dark);
    border-left: 1px solid var(--secondary-color-dark);
    margin-right: 80px;
    justify-content: space-between;
}

.section-steps .e-n-tabs-heading .e-n-tab-title {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
    width: 60px;
    height: 103px;
    margin-left: -1px;
    text-align: center;
    font-family: var(--digits-font-family);
    font-size: 20px;
    font-weight: bold;
    line-height: 103px;
    color: var(--border-color-dark);
    background-color: var(--secondary-color-dark);
    left: 0px;
    cursor: pointer;
    clip-path: polygon(0% 30%, 100% 0%, 100% 70%, 0% 100%, 0% 0%);
    transition: all 500ms ease;
}


.section-steps .e-n-tabs-heading {
    order: 0;
}

.section-steps .e-n-tabs-heading:after {
    content: "↓";
    margin-right: -8px;
    font-size: 32px;
    margin-top: 28px;
    order: 1;
    display: flex;
    justify-content: center;
    color: var(--border-color-dark);
    animation: blink 1.8s infinite;
}

@keyframes blink {
    0% {
        opacity: 1;
    }
    40% {
        opacity: 1;
    }
    60% {
        opacity: 0.2;
    }
    100% {
        opacity: 1;
    }
}

.section-steps .e-n-tabs-heading .e-n-tab-title .e-n-tab-title-text {
    font-family: var(--digits-font-family);
    font-size: 20px;
    font-weight: bold;
    line-height: 103px;
    color: var(--border-color-dark);
}

.section-steps .e-n-tabs-heading .e-n-tab-title[aria-selected="true"] {
    background: var(--accent-color) !important;
    order: 0;
}

.section-steps .e-n-tabs-heading .e-n-tab-title[aria-selected="true"] .e-n-tab-title-text {
    color: #fff !important
}

.section-steps .e-n-tabs-heading .e-n-tab-title[aria-selected="true"] ~ .e-n-tab-title {
    order: 2;
}


.section-steps .e-n-tabs-content .section-title .elementor-heading-title {
    font-size: 20px;
    font-weight: 500;
    opacity: 0.8;
}

.section-steps .e-n-tabs-heading:has(.e-n-tab-title:last-child[aria-selected="true"])::after {
    content: none;
}


.section-steps .e-n-tabs-content .section-desc {
    opacity: 0.7;
}

.section-steps .e-n-tabs-content img {
    max-width: 100%;
}

.section-steps .e-n-tabs-content .btn-border .elementor-button {
    border-color: #fff;
    opacity: 0.7;
}

.section-steps .e-n-tabs-content .btn-border .elementor-button .elementor-button-text {
    color: #fff;
}

.section-steps .e-n-tabs-content .btn-border:hover .elementor-button {
    border-color: var(--secondary-color);
    background: var(--secondary-color) !important;
    opacity: 1;
}

.section-steps .e-n-tabs-heading .e-n-tab-title {
    transition: all .3s ease;
}

.section-steps .e-n-tabs-heading .e-n-tab-title.attention .e-n-tab-title-text {
    animation: pulseTab .8s ease-in-out 6;
}

@keyframes pulseTab {
    0%, 100% {
        color: inherit;
        transform: scale(1);
    }

    50% {
        color: var(--accent-color);
        transform: scale(1.08);
    }
}


/**/

.section-brands {
}

.section-brands img {
    filter: grayscale(300%);
    opacity: 0.8;
    transition: all 0.5s;
}

.section-brands img:hover {
    filter: grayscale(0);
    opacity: 1;
}

/**/

.section-products {
    padding: 0 !important;
}

.section-products .section-header {
    padding: 50px;
    border-bottom: 1px solid var(--border-color-dark2);
}

.section-products .section-header .elementor-counter {
}

.section-products .section-header .elementor-counter .elementor-counter-title {
    font-family: var(--text-font-family);
    font-size: 16px;
    font-weight: 500;
    color: var(--text-color-light2);
    line-height: 26px;
}

.section-products .section-header .elementor-counter .elementor-counter-number-wrapper {
    direction: ltr;
}

.section-products .section-header .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number {
    font-family: var(--digits-font-family);
    font-size: 100px;
    line-height: 80px;
}

.section-products .section-header .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number-suffix {
    font-size: 50px;
    line-height: 80px;
    margin-left: 5px;
}

.section-products .product-item {
    padding: 40px;
}

.section-products .product-item:not(:last-child) {
    border-right: 1px solid var(--border-color-dark2);
}

.section-products .product-item .elementor-icon-box-icon {
    width: 150px;
    height: 150px;
    background: url("assets/img/shape.png") no-repeat top right /contain;
    position: relative;
    padding: 75px 75px 0px 0px;
    rotate: 270deg;
}

.section-products .product-item .elementor-icon-box-icon .elementor-icon {
    width: 70px;
    height: 70px;
    background: #fff;
    font-size: 40px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 20px 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    fill: var(--text-color-light2)
}

.section-products .product-item .elementor-icon-box-title {
    margin: 10px 0 20px;
    padding-bottom: 15px;
    font-family: var(--text-font-family);
    font-size: 16px;
    font-weight: 500;
    color: var(--primary-color);
    position: relative;
}

.section-products .product-item .elementor-icon-box-title * {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: 500;
    color: var(--primary-color);
}

.section-products .product-item .elementor-icon-box-title:before {
    content: '';
    width: 50px;
    height: 2px;
    background: var(--accent-color);
    position: absolute;
    bottom: -1px;
    left: 0;
}

.section-products .product-item .elementor-icon-box-title:after {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-color);
    position: absolute;
    bottom: -3px;
    left: 0;
}

.section-products .product-item .elementor-icon-box-description {
    font-family: var(--text-font-family);
    font-size: 13px;
    font-weight: 300;
    color: var(--text-color-light2);
}

/*.section-products .product-item .btn .elementor-button {
    background: var(--border-color-dark) !important;
    border-color: var(--border-color-dark);
}*/

.section-products .product-item .btn .elementor-button .elementor-button-content-wrapper {
    height: 100%;
    font-size: 16px;
}

.section-products .product-item .btn:hover .elementor-button {
    border-color: var(--accent-color);
}

@media (max-width: 1500px) {

    .section-hero .video-content {
        padding: 20px 20px 20px 5%;
    }
}

@media (max-width: 1400px) {
    .section-hero .title .elementor-heading-title, .section-hero .title .elementor-heading-title * {
        font-size: 44px;
    }

    .section-hero .video-content {
        bottom: 180px;
        top: -1px;
    }


    .section-categories .cat-item .cat-details .elementor-image-box-img {
        padding: 20px 40px 25px 40px;
        display: flex;
        justify-content: center;
    }

    .section-categories .cat-item .cat-details .elementor-image-box-img img {
        width: 65px;
    }

    .section-steps .number .elementor-heading-title {
        font-size: 380px;
    }

    .section-steps .circle-text {
        margin-left: 0px;
        position: absolute;
        top: 66%;
        right: 12%;
    }

    .section-steps .number {
        width: 100%;
        display: flex;
        justify-content: flex-end;
        padding-right: 60px;
    }

    .section-categories .cat-item .cat-pic img {
        height: 100%;
        object-fit: cover;
    }

}

@media (max-width: 1200px) {
    .section-hero .title .elementor-heading-title, .section-hero .title .elementor-heading-title * {
        font-size: 36px;
    }

    .section-hero .col-one .subtitle .elementor-heading-title {
        font-size: 25px;
    }

    .section-hero .col-one .counter .elementor-counter-number-wrapper * {
        font-size: 48px;
    }

    .section-hero .video-content {
        gap: 10px;
    }


    .section-categories .cat-item .cat-details .elementor-image-box-content {
        padding: 15px;
    }


    .section-categories .cat-item .cat-details .elementor-image-box-img {
        padding: 15px 40px 20px 40px;
    }

    .section-categories .cat-item .vertical-text .elementor-heading-title {
        font-size: 40px;
        transform: rotate(90deg) translateX(-100px);
    }

    .section-categories .cat-item .cat-details .elementor-image-box-content .elementor-image-box-title {
        margin-bottom: 0px;
    }

    .section-categories .cat-item {
        width: 49%;
    }


    .section-products .product-item {
        padding: 30px;
    }


    .section-products .section-header {
        padding: 40px;
    }

    .choose-us .box-why-us {
        padding: 30px;
        width: 49%;
        flex: 0 0 49%;
        min-height: 200px;
    }

    .choose-us {
        flex-wrap: wrap;
        column-gap: 0px;
        justify-content: space-between;
    }

    .choose-us .box-why-us:before {
        background-size: 100% 200px !important;
        background: url(assets/img/shape-11.png) center no-repeat;
    }

    .box-why-us .elementor-icon-box-wrapper {
        flex-direction: row !important;
        gap: 20px !important;
    }

    .box-why-us .elementor-icon-box-wrapper:before {
        background-size: 80px;
    }

    .box-why-us .elementor-icon-box-content .elementor-icon-box-title {
        margin-top: 0px;
    }
}

@media (max-width: 1024.98px) {
    .video-wrapper .hero-video {
        width: 70% !important;
    }

    .video-wrapper .hero-video .elementor-video {
        min-height: 450px;
    }

    .video-wrapper .video-content {
        width: 30%;
        position: relative;
    }

    .video-wrapper {
        flex-wrap: nowrap;
    }

    .section-hero .col-one {
        padding: 30px;
    }

    .section-hero .video-content {
        padding: 20px;
        gap: 10px;
    }

    .section-hero .video-wrapper .metal {
        right: 26%;
    }

    .section .section-title .elementor-heading-title, .section .section-title .elementor-heading-title * {
        font-size: 24px;
    }

    .section-hero .video-content .section-desc {
        width: 100%;
    }

    .section-categories .cat-item .cat-details {
        width: 40%;
    }

    .section-categories .cat-item .cat-pic {
        width: calc(60% - 45px);
    }

    .section-categories .cat-item .vertical-text .elementor-heading-title {
        font-size: 30px;
        transform: rotate(90deg) translateX(-55px);
    }

    .section-categories .cat-item .vertical-text {
        width: 45px;
    }

    .section-categories .cat-item:before {
        right: calc(30% + 140px);
    }

    .section-steps .e-n-tabs-heading {
        margin-right: 40px;
    }


    .section-steps .e-n-tabs-content .section-title .elementor-heading-title {
        font-size: 18px;
    }

    .section-steps .vertical-text .elementor-heading-title {
        font-size: 30px;
    }


    .section-steps .number .elementor-heading-title {
        font-size: 330px;
    }

    .section-steps .circle-text {
        width: 110px;
        height: 110px;
    }


    .section-products .section-header .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number-suffix {
        font-size: 40px;
    }

    .section-products .section-header .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number {
        font-size: 85px;
    }

    .box-why-us .elementor-icon {
        padding-bottom: 12px;
        width: 40px;
    }

    .box-why-us .elementor-icon svg {
        width: 40px;
    }

    .box-why-us .elementor-icon-box-content .elementor-icon-box-title {
        margin-bottom: 5px;
        font-size: 16px;
    }
}

@media (max-width: 992px) {
    .section-articles .latest-blog .col-lg-3:last-child {
        display: none;
    }

}

@media (max-width: 767.98px) {
    .section-hero .col-one .subtitle .elementor-heading-title {
        font-size: 20px;
        margin-bottom: 0px;
    }

    .section-hero .col-one .subtitle .elementor-heading-title br {
        display: none;
    }

    .section-hero .col-one .subtitle:before {
        left: 0px;
        bottom: 0px;
    }

    .section-hero .col-one .subtitle:after {
        left: 0px;
        bottom: -5px;
    }

    .section-hero .title .elementor-heading-title, .section-hero .title .elementor-heading-title * {
        font-size: 26px;
    }

    .section-hero .title .elementor-heading-title br, .section-hero .video-content .section-title .elementor-heading-title span br {
        display: none;
    }

    .section-hero .video-wrapper .metal {
        display: none;
    }


    .video-wrapper .hero-video {
        width: 100% !important;
    }

    .video-wrapper .video-content {
        width: 90%;
        margin-top: -150px;
        border: 1px solid var(--border-color-light);
        margin-right: auto;
        margin-left: auto;
        background-image: none !important;
    }

    .video-wrapper {
        flex-wrap: wrap;
    }

    .title-wrapper {
        background-image: none !important;
    }

    .section-hero .vertical-text .elementor-heading-title {
        transform: rotate(90deg) translateX(-50px);
        font-size: 11px;
    }


    .section-categories .cat-item {
        width: 100%;
    }


    .section-categories .cat-item .cat-details .elementor-image-box-img {
        padding: 30px 40px 35px 40px;
    }


    .section-categories .cat-item .cat-details .elementor-image-box-content {
        padding: 25px;
    }


    .section-steps .e-n-tabs-heading {
        margin-right: 20px;
    }

    .section-steps .number {
        margin-top: -160px;
        padding-right: 120px;
    }

    .section-steps .number .elementor-heading-title {
        font-size: 290px;
    }

    .section-steps .circle-text {
        top: 55%;
        right: 7%;
    }


    .section-products .product-item:not(:last-child) {
        border-rigth: none;
        border-bottom: 1px solid var(--border-color-dark2);
    }


    .section-products .product-item {
        padding: 25px;
    }


    .section-products .section-header .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number-suffix {
        font-size: 30px;
    }

    .section-products .section-header .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number {
        font-size: 75px;
    }

    .section-products .section-header .elementor-counter .elementor-counter-title br {
        display: none;
    }

    .section-products .section-header .elementor-widget-counter {
        width: 70%;
    }

    .section-products .section-header .elementor-widget-image {
        width: 22%;
    }

    .section-products .section-header .elementor-widget-image img {
        width: 60px;
    }

    .section-products .section-header {
        padding: 30px;
    }

    .section-products .section-header .elementor-counter .elementor-counter-title {
        padding-right: 10px;
    }

    .section-articles .latest-blog .col-sm-6 {
        width: 33% !important;
    }

    .choose-us .box-why-us:before {
        background-size: 100% 230px !important;
    }

    .choose-us .box-why-us {
        min-height: 230px;
    }

    .section-products .product-item {
        border-right: none !important;
    }
}

@media (max-width: 580px) {
    .section-hero .title .elementor-heading-title, .section-hero .title .elementor-heading-title * {
        font-size: 20px;
    }

    .section-hero .col-one .subtitle .elementor-heading-title {
        font-size: 16px;
    }

    .section .section-title .elementor-heading-title, .section .section-title .elementor-heading-title * {
        font-size: 20px;
    }

    .section .section-title .elementor-heading-title, .section .section-title .elementor-heading-title * {
        font-size: 20px;
    }

    .video-wrapper .video-content {
        margin-top: -180px;
    }

    .section-hero .title {
        padding: 20px;
    }

    .section-hero .title-wrapper {
        width: calc(100% - 210px);
    }

    .section-hero .col-one {
        width: 170px;
        padding: 20px;
    }

    .section-hero .vertical-text .elementor-heading-title {
        transform: rotate(90deg) translateX(-17px);
        font-size: 10px;
        white-space: pre-wrap;
    }

    .section-categories .cat-item .cat-details .elementor-image-box-img {
        padding: 15px 40px 20px 40px;
    }

    .section-categories .cat-item .cat-details .elementor-image-box-content {
        padding: 15px;
    }

    .section-products .section-header {
        padding: 30px 15px;
    }

    .section-products .section-header .section-title .elementor-heading-title br {
        display: none;
    }

    .section-articles .latest-blog .col-sm-6 {
        width: 100% !important;
    }

    .form-wrapper .Rect-btn-wrapper {
        width: 25%;
    }

    .form-wrapper .form-info {
        width: 70%;
    }

    .form-wrapper .Rect-btn-wrapper .wpcf7-submit {
        padding: 0 15px;
    }

    input, input::-webkit-input-placeholder {
        font-size: 12px !important;
    }

    .form-control {
        padding: 0 10px;
    }

    .footer .footer-title .elementor-heading-title {
        font-size: 16px;
    }

    .footer .footer-bottom .text-footer p {
        font-size: 13px;
    }

    .choose-us .box-why-us:before {
        background-size: 100% 300px !important;
    }

    .choose-us .box-why-us {
        min-height: 300px;
    }

    .box-why-us .elementor-icon-box-wrapper {
        flex-direction: column !important;
    }
}

@media (max-width: 480px) {
    .section-hero .title-wrapper {
        width: calc(100% - 150px);

    }

    .section-hero .vertical-text {
        display: none;
    }

    .section-hero .title .elementor-heading-title, .section-hero .title .elementor-heading-title * {
        font-size: 18px;
    }

    .section-hero .col-one .subtitle .elementor-heading-title {
        font-size: 14px;
    }

    .section-hero .col-one {
        width: 150px;
        padding: 15px;

    }

    .section-hero .title {
        padding: 15px;
    }

    .section-steps .number {
        margin-top: -178px;
    }

    .section-steps .number .elementor-heading-title {
        font-size: 230px;
    }

    .section-steps .circle-text {
        width: 100px;
        height: 100px;
        top: 55%;
        right: 10%;
    }

    .section-steps .circle-text .elementor-heading-title {
        font-size: 14px;
    }

    .section-steps .vertical-text .elementor-heading-title {
        font-size: 18px;
    }

    .section-steps .e-n-tabs-heading {
        margin-right: 0px;
    }

    .section-steps .e-n-tabs-heading {
        width: 40px;
        flex: 0 0 40px;
    }

    .section-steps .e-n-tabs-heading .e-n-tab-title {
        width: 40px;
        height: 90px;
    }

    .section-steps .e-n-tabs-heading .e-n-tab-title .e-n-tab-title-text {
        font-size: 18px;
    }

    .section-products .product-item {
        padding: 15px;
    }

    .choose-us .box-why-us:before {
        background-size: 100% 200px !important;
    }

    .choose-us .box-why-us {
        min-height: 200px;
        width: 100%;
        flex: 0 0 100%;
    }

    .box-why-us .elementor-icon-box-wrapper {
        flex-direction: row !important;
    }
}

@media (max-width: 430px) {
    .section-hero .col-one {
        width: 130px;
        display: flex;
        align-items: center;
    }

    .section-hero .col-one .subtitle:before {
        bottom: -2px;
    }

    .section-hero .title-wrapper {
        width: calc(100% - 130px);

    }

    .video-wrapper .video-content {
        width: 96%;
    }

    .section-categories .cat-item .cat-details .elementor-image-box-img img {
        width: 48px;
    }

    .section-categories .cat-item .cat-pic {
        width: 50%;
    }

    .section-categories .cat-item .cat-details {
        width: 50%;
    }

    .section-categories .cat-item .vertical-text {
        display: none;
    }

    .section-categories .cat-item .cat-details .elementor-image-box-content .elementor-image-box-title {
        font-size: 14px;
    }

    .section-categories .cat-item .cat-details .elementor-image-box-content .elementor-image-box-description {
        font-size: 13px;
    }

    .section-steps .number {
        padding-left: 105px;
        margin-top: -73px;
    }

    .section-steps .number .elementor-heading-title {
        line-height: 180px;
        height: 180px;
    }

    .section-products .section-header .elementor-counter .elementor-counter-title {
        line-height: 20px;
        font-size: 14px;

    }

    .form-wrapper .Rect-btn-wrapper {
        width: 30%;
    }

    .form-wrapper .form-info {
        width: 65%;
    }

    .form-wrapper .Rect-btn-wrapper .wpcf7-submit {
        padding: 0 10px;
    }

    .choose-us .box-why-us {
        padding: 20px;
    }
}

/* ----------- Home page / End --------------- */
/* ----------- About page / Start --------------- */
.section-about {
}

.section-about .pic-wrapper {
    position: relative;
}

.section-about .pic-wrapper .pic1 {
    position: absolute;
    left: 0px;
    bottom: 0px;
}

.section-about .pic-wrapper .pic2 {
    position: relative;
}

.section-about .pic-wrapper .pic3 {
    position: absolute;
    right: 0px;
    bottom: 60px;
}

.section-about .pic-wrapper .vertical-text {
    /*position: absolute;
    top: 217px;
    right: 8px;*/
    background: var(--accent-color);
    padding: 17px 30px;
    transform: rotate(-90deg) translateX(-82px);
}

.section-about .pic-wrapper .vertical-text .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    line-height: 26px;
    text-transform: uppercase;
}

.section-about .pic-wrapper .vertical-text .elementor-heading-title:before {
    position: absolute;
    content: '';
    background-color: var(--text-color);
    width: 20px;
    height: 1px;
    left: 0px;
    top: 30px;
}

.section-about .section-subsubtitle .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    color: var(--primary-color);
    margin: 0;
}

.section-about .elementor-icon-list-items {
    margin-bottom: 10px !important;
}

.section-about .elementor-icon-list-items .elementor-icon-list-item .elementor-icon-list-icon svg {
    fill: var(--accent-color);
}

.section-about .elementor-icon-list-items .elementor-icon-list-item .elementor-icon-list-text {
    font-family: var(--text-font-family);
    font-size: 14px;
    font-weight: 400;
    color: var(--text-color);
}

.section-about .awards-wrapper {
    background: var(--background-color);
    padding: 30px;
    position: relative;
}

.section-about .awards-wrapper:before {
    position: absolute;
    content: '';
    background-color: #fff;
    width: 100px;
    height: 100px;
    left: 0px;
    top: 0px;
    clip-path: polygon(0% 0%, 100% 0%, 0% 100%, 0% 100%, 0% 0%);
}

.section-about .awards-wrapper:after {
    position: absolute;
    content: '';
    background-color: #fff;
    width: 100px;
    height: 100px;
    right: 0px;
    bottom: 0px;
    clip-path: polygon(0% 100%, 100% 0%, 100% 100%, 0% 100%, 0% 0%);
}

.section-about .awards-wrapper .title {
    position: absolute;
    width: 90px;
    left: -15px;
    top: 25px;
    transform: rotate(-45deg);
}

.section-about .awards-wrapper .title .elementor-heading-title {
    font-family: var(--text-font-family);
    font-size: 20px;
    font-weight: bold;
    line-height: 28px;
    color: var(--border-color-dark);
    text-transform: uppercase;
}

.section-about .awards-wrapper .item .elementor-image-box-img {
    width: 60% !important;
    margin-left: 40% !important;
}

.section-about .awards-wrapper .item .elementor-image-box-title {
    font-family: var(--text-font-family);
    font-size: 16px;
    font-weight: bold;
    color: var(--text-color-light2);
    margin: 0;
    text-align: left;
}

.section-about .awards-wrapper .item .elementor-image-box-description {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: bold;
    color: var(--primary-color);
    text-align: left;
}

@media (max-width: 1199.98px) {
    .section-about .awards-wrapper .item .elementor-image-box-title,
    .section-about .awards-wrapper .item .elementor-image-box-description {
        font-size: 14px;
    }

    .section-about .awards-wrapper:before {
        width: 60px;
        height: 60px;
    }

    .section-about .awards-wrapper:after {
        width: 60px;
        height: 60px;
    }
}

@media (max-width: 1023.98px) {
    .section-about .pic-wrapper .vertical-text {
        transform: rotate(-90deg) translateX(0px);
    }
}

@media (max-width: 767.98px) {
    .section-about .awards-wrapper .item .elementor-image-box-img {
        width: 100px !important;
        margin-left: calc(100% - 100px) !important;
    }

    .section-about .pic-wrapper {
        display: none;
    }
}

/**/

.section-about-details {
    background: var(--background-color);
    padding-right: 0;
    padding-left: 0;
}

.section-about-details .heading {
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: -100px;
    position: relative;
    z-index: 1;
}

.section-about-details .titles-wrapper {
    background: var(--primary-color);
    padding: 40px;
}

.section-about-details .titles-wrapper .section-subtitle .elementor-heading-title {
    color: var(--accent-color);
}

.section-about-details .titles-wrapper .section-title .elementor-heading-title {
    color: #fff;
}

.section-about-details .detail-wrapper {
    position: relative;
    display: block;
    background: #fff;
    box-shadow: 0px 0px 30px 0px rgba(51, 45, 79, 0.10);
    padding: 40px;
}

.section-about-details .detail-wrapper .section-subtitle .elementor-heading-title {
    border: 0;
    padding: 0;
    color: var(--border-color-dark);
    font-weight: bold;
}

.section-about-details .detail-wrapper .section-title .elementor-heading-title {
    font-size: 20px;
}

.section-about-details .detail-wrapper .section-desc {
    margin-top: 20px;
    margin-bottom: 20px;
}

.section-about-details .detail-wrapper .section-desc + .elementor-widget-icon:last-child svg path:nth-child(2) {
    fill: transparent !important;
}

.section-about-details .detail-wrapper .overlayer {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    background: #fff;
    height: 0;
    overflow: hidden;
    padding: 30px;
    transition: all 0.5s;
    opacity: 0;
    z-index: 1;
    box-shadow: 0px 0px 30px 0px rgba(51, 45, 79, 0.10);
}

.section-about-details .detail-wrapper:hover .overlayer {
    height: 500px;
    opacity: 1;
}

/* ----------- About page / End --------------- */
/*----------- Load more section / Start --------------*/
.text-loadmore:after {
    content: '';
    opacity: 1;
    transition: .4s;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    background-image: linear-gradient(to top, rgba(241, 241, 241, 0.85) 10%, #ffffff00)
}

.text-loadmore {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 7; /* Number of lines to show */
    -webkit-box-orient: vertical
}

.text-loadmore.expanded:after {
    background-image: none;
    z-index: -1
}

.text-loadmore.expanded {
    overflow: visible;
    -webkit-line-clamp: initial; /* Show all lines */
    text-overflow: initial
}

.expand-button {
    position: relative;
    cursor: pointer !important;
    font-size: 16px;
    font-weight: 500
}

.section-load .section-loadmore {
    overflow: hidden;
    height: 400px;
    gap: 10px
}

.section-load {
    background-color: var(--background-color) !important
}

.section-loadmore:after {
    content: '';
    opacity: 1;
    transition: .4s;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    background-image: linear-gradient(to top, #f1f1f1 10%, #F8F8F900)
}

.section.section-load .section-full-load .elementor-widget-container p {
    color: #fff !important;
    font-weight: 300;
    font-size: 14px
}

.expand-button-section {
    position: relative;
    cursor: pointer !important;
    font-size: 16px;
    font-weight: 500;
    width: 1320px;
    max-width: 100% !important;
    padding: 10px;
    margin-right: auto;
    margin-left: auto;
    color: #000
}

.expand-button .elementor-heading-title {
    position: absolute;
    bottom: 5px;
    left: 0;
    background-color: transparent;
    cursor: pointer !important;
    font-size: 16px;
    font-weight: 500;
    font-family: var(--text-font-family)
}

.expand-button-section .elementor-heading-title {
    position: absolute;
    bottom: 5px;
    left: 5px;
    background-color: transparent;
    cursor: pointer !important;
    font-size: 16px;
    font-weight: 500;
    font-family: var(--text-font-family);
    color: var(--text-color) !important;
    padding: 0 20px;
    line-height: 40px;
    outline: none;
    border: 1px solid var(--text-color);
    border-radius: 3px;
    transition: all .5s ease-in-out
}

.section-loadmore.expanded:after {
    background-image: none;
    z-index: -1
}

.section-load .section-loadmore.expanded {
    overflow: visible;
    height: 100%
}

.section-loadmore .elementor-heading-title {
    font-family: var(--text-font-family);
    font-weight: 600 !important;
    color: var(--text-color) !important;
    padding: 15px 0px 10px;
    font-size: 16px
}

.section-loadmore .elementor-widget-container ul {
    margin-left: 0px;
    margin-right: 20px
}

.section-loadmore-title .elementor-widget-container .elementor-heading-title {
    font-weight: 600;
    color: #262020;
    font-size: 22px;
    line-height: 24px
}

.section-loadmore a {
    color: var(--accent-color)
}

.section-loadmore h3 {
    font-family: var(--text-font-family);
    font-weight: 600;
    color: #262020;
    padding: 15px 0px 0px;
    font-size: 16px
}

.section-loadmore h2 {
    font-family: var(--text-font-family);
    padding: 15px 0px 0px;
    font-size: 18px
}

.section-loadmore h4 {
    font-family: var(--text-font-family);
    padding: 15px 0px 0px;
    font-size: 15px
}

.section-loadmore h5, .section-loadmore h6 {
    font-family: var(--text-font-family);
    padding: 15px 0px 0px;
    font-size: 14px
}

.section-loadmore p span, .section-loadmore p, .section-loadmore ul li {
    font-size: 14px;
    font-family: var(--text-font-family);
    font-weight: 300
}

.section-loadmore ul li::marker {
    color: var(--accent-color)
}

.section-loadmore img {
    max-height: 360px;
    object-fit: cover;
    margin: 15px 0px
}

/*----------- Load more section / End --------------*/
/* ----------- Contact page / Start --------------- */
.section-contact {
}

.section-contact .item {
    background: var(--background-color);
    padding: 25px;
}

.section-contact .item .elementor-icon-box-content {
    padding-left: 25px;
}

.section-contact .item .elementor-icon-box-content:before {
    content: '';
    position: absolute;
    background-color: var(--accent-color);
    width: 3px;
    top: 0;
    bottom: 0;
    left: 0;
}

.section-contact .item .elementor-icon-box-content:after {
    content: '';
    position: absolute;
    background-color: var(--accent-color);
    width: 1px;
    left: 9px;
    top: 0;
    bottom: 50%;
}

.section-contact .item .elementor-icon-box-content .elementor-icon-box-title {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: bold;
    color: var(--primary-color);
    margin: 0 0 10px;
}

.section-contact .item .elementor-icon-box-content .elementor-icon-box-title * {
    font-family: var(--text-font-family);
    font-size: 18px;
    font-weight: bold;
    color: var(--primary-color);
}

.section-contact .item .elementor-icon-box-content .elementor-icon-box-description {
    font-family: var(--text-font-family);
    /*font-size: 16px;
    font-weight: 500;*/
    color: var(--text-color-light2);
}

.section-contact .item .section-desc {
    padding: 15px;
    background: #fff;
}

.section-contact .item .section-desc p {
    margin-bottom: 0;
}

.contact-form {
    border: 1px solid var(--border-color-dark2);
    padding: 30px;
}

.contact-form p {
    margin: 0 !important;
    position: relative;
    font-family: var(--text-font-family);
}

.contact-form .wpcf7-form-control-wrap {
    display: block;
    position: relative;
}


.contact-form .form-control {
    background: #fff;
    margin-bottom: 20px;
    border: 1px solid var(--border-color-light);
    height: 42px;
    direction: ltr;
}

.contact-form .form-control:hover {
    border-color: var(--accent-color)
}

.contact-form .wpcf7-spinner {
    margin: 0;
    width: 74px;
    height: 42px;
    border-radius: 0;
    transform: translateX(0%);
    vertical-align: middle;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    cursor: wait;
}

.contact-form .wpcf7-not-valid-tip {
    position: absolute;
    bottom: 0px;
    left: 0;
    font-size: 12px;
    direction: ltr;
}

.contact-form .wpcf7 form.invalid .wpcf7-response-output,
.contact-form .wpcf7 form.unaccepted .wpcf7-response-output,
.contact-form .wpcf7 form.payment-required .wpcf7-response-output,
.contact-form .wpcf7 form.sent .wpcf7-response-output {
    border-color: var(--border-color-light);
    color: var(--text-color-light2);
    max-width: 752px;
    margin: 15px auto 0;
    text-align: left;
    direction: ltr;
}


/* ----------- Contact page / End --------------- */
/* ----------- Product single / Start --------------- */


/* ----------- Product single / End --------------- */
/* ----------- Employee / Start --------------- */


/* ----------- Employee / End --------------- */
/*-------------- Blog sidebar / Start ---------------*/
.blog-sidebar {
    position: sticky;
    top: 105px;
}

.blog-sidebar #block-7, .blog-sidebar #block-9 {
    margin-bottom: 15px !important;
}

.blog-sidebar .wp-block-latest-posts__list .wp-block-latest-posts__post-title {
    font-size: 14px;
    width: 60%;
    height: 50px;
    overflow: hidden;
    line-height: 25px;
    padding-left: 10px;
    margin-bottom: 30px;
    margin-top: 5px;
    color: var(--primary-color);

}

.blog-sidebar .wp-block-latest-posts__list li {
    margin-bottom: 15px !important;
    margin-top: 15px !important;
    display: flex;
    position: relative;
    flex-wrap: wrap;
}

.blog-sidebar .wp-block-latest-posts__list li .wp-block-latest-posts__featured-image {
    width: 40%;
    margin-left: 0;
    margin-bottom: 0;
}

.blog-sidebar .wp-block-latest-posts__list li .wp-block-latest-posts__featured-image img {
    height: 100px !important;
    object-fit: cover;
    width: 100%;
}

.blog-sidebar .title-sidebar {
    color: var(--primary-color);
    font-weight: bold;
    font-size: 16px;
    padding-left: 20px;
    position: relative;
}

.blog-sidebar .title-sidebar:before {
    content: '';
    position: absolute;
    background-color: var(--accent-color);
    width: 3px;
    top: 0;
    bottom: 0;
    left: 0;
}

.blog-sidebar .title-sidebar:after {
    content: '';
    position: absolute;
    background-color: var(--accent-color);
    width: 1px;
    left: 9px;
    top: 0;
    bottom: 50%;
}

.widget_recent_entries .wp-block-latest-posts__list .wp-block-latest-posts__post-date {
    font-size: 14px;
    flex: 0 0 100%;
    font-family: var(--digits-font-family);
}

.widget_categories .wp-block-categories-list li {

    padding-left: 20px;
    margin-bottom: 5px;
}

.widget_categories .wp-block-categories-list li a {
    color: var(--text-color) !important;
}

/*-------------- Blog sidebar / End ---------------*/
/*-------------- Single Blog / Start ---------------*/
.single-top {
    margin-right: 30px;
    padding-bottom: 30px;
}

.single-post * {
    font-family: var(--text-font-family);
}


.single-post #content {
    margin-bottom: 40px;
    margin-top: 70px;
}

.single-top .page-header .entry-title {
    font-size: 24px !important;
    font-weight: bold;
    line-height: 40px;
    margin: 0px;
}

.single-top .page-header {
    border-bottom: none !important;
    padding-bottom: 30px;
    width: 100%;
    height: auto;
    min-height: auto;
}

.single-top .short-dsc {
    padding-top: 22px;
}

.single-top .header-col {
    align-items: center;
    display: flex;
    justify-content: center;
    vertical-align: middle;
    flex-direction: column;
}

.single-top .blog-expert p {
    text-align: justify;
    font-size: 16px;
}

.single-date .fa-calendar {
    color: var(--accent-color);
    font-family: 'Font Awesome 5 Free';
}

.single-info {
    display: flex;
}

.single-top .img-thumbnail img {
    height: auto;
}


.single-info .single-categories .fa-folder {
    color: var(--accent-color);
}

.single-info .single-categories {
    padding-left: 30px;

}

.single-post .blog-project-slider {
    background-color: var(--secondary-color);
    padding: 100px 0px;
}

.single-post .read-more-blog .read-more-blog-col .elementor-heading-title:before {
    content: '\27F6';
    font-size: 24px;
    font-weight: bold;
    color: var(--accent-color);
    padding-bottom: 10px;
    padding-right: 5px;
}

.read-more-blog .read-more-blog-col .elementor-heading-title {
    font-size: 15px !important;
    font-family: var(--text-font-family);
}

.single-post .section.read-more-blog {
    padding-bottom: 0px;
}

.single-post .page-content img {
    width: 100%;
    max-height: 500px;
    object-fit: cover;
}

.single-post #content .page-content .editor-content h1, .single-post #content .page-content .editor-content h1 strong {
    font-size: 20px;
    color: var(--primary-color);
    font-family: var(--text-font-family);
    margin: 0px;
}


.single-post #content .page-content .editor-content h2, .single-post #content .page-content .editor-content h2 strong {
    font-size: 19px;
    color: var(--primary-color);
    font-family: var(--text-font-family);
    margin: 0px;
}


.single-post #content .page-content .editor-content h3, .single-post #content .page-content .editor-content h3 strong {
    font-size: 18px;
    color: var(--primary-color);
    font-family: var(--text-font-family);
    margin: 0px;
}

.single-post #content .page-content .editor-content h4, .single-post #content .page-content .editor-content h4 strong {
    font-size: 17px;
    color: var(--primary-color);
    font-family: var(--text-font-family);
    margin: 0px;
}


.single-post #content .page-content .editor-content h5, .single-post #content .page-content .editor-content h6,
.single-post #content .page-content .editor-content h5 strong, .single-post #content .page-content .editor-content h6 strong {
    font-size: 16px;
    color: var(--primary-color);
    font-family: var(--text-font-family);
    margin: 0px;
}

.single-post #content .page-content ol li::marker {
    font-family: var(--digits-font-family);
    color: var(--primary-color);
    font-weight: bold;
}

.single-post #content .page-content ul {
    padding-left: 25px;
}

.single-post #content .page-content ul li:before {
    content: '';
    width: 6px;
    height: 6px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    background: var(--accent-color);
    margin-right: 6px;
    display: inline-block;
}


.title-en-blog {
    font-size: 20px;
    font-weight: 500;
    position: relative;
    margin-bottom: 14px;
    text-transform: capitalize;
    color: var(--primary-color);
    text-align: center;
}

.title-fa-blog {
    text-align: center;
    color: #FFFFFF;
    font-size: 24px;
    padding-bottom: 40px;

}

.title-service-blog .title-fa-blog {
    color: var(--text-color);
}

.section-services-blog .row {
    justify-content: space-between;
    margin: 0;
}

.col-services {
    width: 23.5%;
    display: flex;
    flex-direction: row;
    background: #EDEDED;
    backdrop-filter: blur(14px);
    padding: 20px;
}

.image-services-blog {
    width: 20%;
}

.heading-services-blog {
    width: 80%;
    padding-right: 20px;
    display: flex;
    align-items: center;
}

.heading-services-blog .heading-title {
    font-size: 15px;
    font-weight: 100;
    line-height: 22px;
    color: var(--text-color);
}

.section-services-blog {
    max-width: 1200px;
    padding: 80px 10px;
    margin-left: auto;
    margin-right: auto;
}

.tag-links a {
    margin: 0px 5px;
    font-family: var(--text-font-family) !important;
    display: inline-block;
    border: 1px solid #cccccc;
    padding: 8px 15px;
    transition: all .4s;
}

.tag-links a:hover {
    background-color: var(--primary-color);
    color: #fff;
}

.single-info .single-categories a {
    display: inline-block;
    margin-right: 10px;
    color: var(--primary-color);
}

.single-info .single-date span {
    font-family: var(--digits-font-family);
}


.blog-pagination .nav-links {
    position: relative;
    display: flex;
}

.blog-pagination .nav-links .nav-previous:before {
    content: "";
    width: 2px;
    height: 80%;
    position: absolute;
    border: 1px solid #919191;
    top: 0;
    left: 50%;
}

.blog-pagination {
    background-color: var(--secondary-color-dark);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 10px;
}

.blog-pagination .post-navigation {
    margin-bottom: 10px;
    max-width: 1440px !important;
    margin: 0px auto;
}

.blog-pagination .post-navigation .nav-next {
    margin-left: auto;
}

.blog-pagination .post-navigation .nav-previous {
    margin-right: auto;
}


.blog-pagination .navigation .nav-links .nav-next a,
.blog-pagination .navigation .nav-links .nav-previous a {
    display: flex;
    flex-direction: row !important;
    align-items: center;
    color: var(--text-color-light);
}

.blog-pagination .navigation .nav-links .nav-next a i,
.blog-pagination .navigation .nav-links .nav-previous a i {
    padding: 0px 5px;
}

.single-post .comment-blog {
    /*margin-top: 15px;
    padding: 20px 30px;
    background: var(--background-color);
    border-radius: 5px;*/
}

.single-post .comment-blog .comments-area {
    width: 100%;
    max-width: 100%;
}

.single-post .comment-blog .comments-area * {
    font-size: 14px;
    font-family: var(--text-font-family);
}

.single-post .comment-blog .comments-area .comments-title {
    display: none;
}

.single-post .comment-blog .comments-area .comment-list {
    padding: 0;
    margin: 0 0 15px;
}

.single-post .comment-blog .comments-area .comment-list li.comment {
    padding: 20px 30px;
    background: var(--background-color);
    margin: 0 0 5px;
}

.single-post .comment-respond {
    padding: 0;
}

.single-post .comment-respond .comment-reply-title {
    padding-bottom: 0px;
    font-size: 18px;
    font-weight: bold;
    color: var(--primary-color);
}

.comment-blog .commentlist .comment .comment-respond #reply-title {
    font-size: 16px;
    display: flex;
    justify-content: space-between;
}

.single-post .comment-respond .form-submit input[type="submit"] {
    font-family: var(--text-font-family);
    font-size: 14px;
    font-weight: bold;
    line-height: 30px;
    background: var(--primary-color);
    color: #000000;
    padding: 4px 25px;
    border: 1px solid var(--primary-color);
    position: relative;
    display: inline-block;
    margin-top: 10px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    outline: none;
    cursor: pointer;
    overflow: hidden;
    transition: all .2s ease-in-out;
}

.single-post .comment-respond .form-submit input[type="submit"]:hover {
    background: var(--secondary-color);
    border-color: var(--secondary-color);
    color: #ffffff;
}

.single-post .comment-respond .logged-in-as {
    padding-bottom: 0px;
}

.single-post .comment-respond .comment-form-comment {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.single-post .comment-respond .comment-form-comment #comment {
    line-height: 20px;
    padding-top: 10px;
    max-width: 100%;
    height: 100px;
    border: 1px solid #fff;
    background: #fff;
    border-radius: 0px;
    font-size: 14px;
}

.single-post .commentlist .comment-respond .comment-form-comment #comment {
    border: 1px solid #fff;
    background: #fff;
}

.single-post .comment-respond .comment-form {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 20px 30px;
    background: var(--background-color);
}

.single-post .comment-respond .comment-form .comment-form-author, .single-post .comment-respond .comment-form .comment-form-email, .single-post .comment-respond .comment-form .comment-form-url {
    width: 31%;
    display: flex;
    flex-direction: column;
}

.single-post .comment-respond .comment-form .comment-form-author input, .single-post .comment-respond .comment-form .comment-form-email input, .single-post .comment-respond .comment-form .comment-form-url input {
    padding: 5px 15px;
    border: 1px solid #fff;
    background: #fff;
    border-radius: 0px;
    font-size: 14px;
    line-height: 30px;
    box-shadow: none;
    width: 100%;
    direction: rtl !important;
}

.single-post .commentlist .comment-respond .comment-form .comment-form-author input, .single-post .commentlist .comment-respond .comment-form .comment-form-email input, .single-post .commentlist .comment-respond .comment-form .comment-form-url input {
    border: 1px solid #fff;
    background: #fff;
}

.single-post .comment-body {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    color: #000;
    margin: 0;
}

.single-post .comment-body .comment-meta {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--border-color-light);
    padding-bottom: 10px;
    margin: 0 0 10px;
}

.single-post .comment-body .comment-content {
    width: 100%;
    margin: 0;
}

.single-post .comment-body .comment-author,
.single-post .comment-body .comment-author * {
    /*width: 50%;*/
    font-size: 16px;
    font-weight: bold;
}

.single-post .comment-body .comment-metadata,
.single-post .comment-body .comment-metadata * {
    color: var(--primary-color);
    font-weight: bold;
    font-size: 13px;
}

.single-post .comment-body .comment-awaiting-moderation {
    font-size: 12px;
    opacity: 0.8;
}

.single-post .commentlist .comment .comment-author {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--border-color-light);
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.single-post .commentlist .comment .comment-author img {
    margin-left: 10px;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    object-fit: cover;
    line-height: 70px;
}

/*.comment-blog #comments {
    display: none;
}*/

.comment-blog .title-comment {
    padding-bottom: 0px;
    font-size: 18px;
    font-weight: bold;
    color: var(--primary-color);
}

.single-post .commentlist {
    max-width: 1300px;
    padding: 20px 40px;
    gap: 15px;
    display: flex;
    flex-direction: column;
    background-color: var(--background-color);
    border-radius: 10px;
    margin: 0px !important;
}

.comment-blog .comment::marker {
    content: none;
}

.comment-blog .comment-meta a {
    font-size: 13px;
    color: #000;
    text-align: right;
    font-family: var(--text-font-family);
}

.comment-blog .comment ul {
    margin: 15px;
}

.comment-blog .says {
    font-weight: 600;
    font-family: var(--text-font-family);
    color: var(--secondary-color);
}

.comment-blog .fn {
    font-weight: 600;
    font-family: var(--text-font-family);
    color: var(--secondary-color);
}

.comment-blog .comment .comment-body p {
    color: #000;
    font-family: var(--text-font-family);
    font-weight: 300;
}

.comment-awaiting-moderation {
    order: 1;
    width: 100%;
}

.comment-blog .reply {
    width: 20%;
}

.comment-blog .reply .comment-reply-link {
    color: var(--secondary-color);
    margin-right: auto;
    text-align: left;
    width: 100%;
    display: block;
}

.comment-blog .comment-body p {
    width: 80%;
}

.tag-links:before {
    content: '';
    width: 28px;
    height: 28px;
    background-image: url(assets/img/tag.svg);
    display: inline-block;
    background-position: center;
    background-size: 28px;
}

.tag-links {
    display: flex;
    align-items: center;
}

.mini-product.section-products .section-header {
    border-bottom: none;
}

.mini-product.section-products .product-item .elementor-icon-box-wrapper {
    display: flex;
}

@media (max-width: 1200px) {
    .mini-product.section-products .product-item .elementor-icon-box-wrapper {
        flex-direction: column;
    }

    .mini-product.section-products .product-item {
        padding: 25px;
    }

    .section-products .product-item .elementor-icon-box-icon {
        width: 120px;
        height: 120px;
        padding: 60px 60px 0px 0px;
    }

    .section-products .product-item .elementor-icon-box-icon .elementor-icon {
        width: 60px;
        height: 60px;
        font-size: 35px;
    }
}

@media (max-width: 992.98px) {
    .single-top .page-header {
        padding-bottom: 15px;
        padding-top: 15px;
    }


    .single-top .short-dsc {
        padding-top: 15px;
    }

    .single-top .header-col {
        padding: 0px 20px;
    }


    .single-top {
        margin-right: 0px;
        padding-bottom: 20px;
    }

    .section.mini-product .section-title .elementor-heading-title span {
        font-size: 24px;
    }
}

@media (max-width: 767.98px) {
    .blog-sidebar {
        display: none;
    }

    .section-products .product-item .elementor-icon-box-wrapper {
        flex-direction: row;
    }

    .mini-product.section-products .section-header {
        padding: 30px 0px 10px
    }

    .section.mini-product .section-title .elementor-heading-title span {
        font-size: 20px;
    }

    .mini-product.section-products .product-item:not(:last-child) {
        border-right: none;
        border-bottom: 1px solid var(--border-color-dark2);;
    }

    .section-brands img {
        max-width: 100px;
    }
}

@media (max-width: 580px) {
    .single-top .page-header .entry-title {
        font-size: 20px !important;
    }


    .single-top .header-col {
        padding: 0px 10px;
    }

    .single-post #content {
        margin-top: 25px;

    }

    .single-post #content .elementor > .elementor-element {
        padding: 0px;
    }

    .single-post #content .page-content .editor-content h2 strong, .single-post #content .page-content .editor-content h1 strong, .single-post #content .page-content .editor-content h3 strong {
        font-size: 16px;
    }

    .single-post #content .page-content .editor-content h2, .single-post #content .page-content .editor-content h1, .single-post #content .page-content .editor-content h3 {
        font-size: 16px;
    }

    .single-post .comment-respond .comment-form {
        padding: 20px;
    }

    .section.mini-product .section-title .elementor-heading-title span {
        font-size: 18px;
    }

    .section-products .product-item .elementor-icon-box-icon {
        width: 100px;
        height: 100px;
        padding: 50px 50px 0px 0px;
    }

    .section-products .product-item .elementor-icon-box-icon .elementor-icon {
        width: 50px;
        height: 50px;
        font-size: 30px;
    }
}

@media (max-width: 430px) {
    .section-products .product-item .elementor-icon-box-icon {
        width: 90px;
        height: 90px;
        padding: 45px 45px 0px 0px;
    }

    .section-products .product-item .elementor-icon-box-icon .elementor-icon {
        width: 40px;
        height: 40px;
        font-size: 25px;
    }

    .section-products .product-item .elementor-icon-box-title {
        margin: 0px 0 10px;
        padding-bottom: 10px;
    }

    .single-top .short-dsc {
        padding-top: 0px;
    }

    .single-top .page-header {
        padding-bottom: 5px;
        padding-top: 5px;
    }
}

/*-------------- Single Blog / End ---------------*/
/*-------------- Blog list / Start ---------------*/
.archive .page-header .entry-title, .category .page-header .entry-title, .blog .page-header .entry-title {
    font-size: 30px !important;
    font-weight: bold;
    line-height: 40px;
    color: var(--primary-color);
    max-width: 1440px;
    text-align: left;
    width: 100%;
    margin: 0px auto;
    padding: 10px;
}

.archive .page-header, .category .page-header, .blog .page-header {
    background-image: url("assets/img/page-cover-en.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    justify-content: center;

}

.archive .page-header .breadcrumb-wrapper, .category .page-header .breadcrumb-wrapper, .blog .page-header .breadcrumb-wrapper {
    max-width: 1440px;
    text-align: left;
    width: 100%;
    margin: 0px auto;
    padding: 10px;
}

.archive .card-blog .blog-img, .category .card-blog .blog-img, .blog .card-blog .blog-img {
    height: 230px;
    width: 50%;
}

.archive .card-blog .blog-info, .category .card-blog .blog-info, .blog .card-blog .blog-info {
    width: 50%;
}

.single-post .widget_recent_entries .wp-block-latest-posts__list .wp-block-latest-posts__post-date,
.archive .widget_recent_entries .wp-block-latest-posts__list .wp-block-latest-posts__post-date,
.category .widget_recent_entries .wp-block-latest-posts__list .wp-block-latest-posts__post-date,
.blog .widget_recent_entries .wp-block-latest-posts__list .wp-block-latest-posts__post-date {
    color: var(--text-color-light2);
    font-size: 12px;
    padding-left: calc(40% + 10px);
    margin-top: -30px;
}

.archive #content, .category #content, .blog #content {
    margin-bottom: 40px;
    margin-top: 120px;
}

.archive #content .container, .category #content .container, .blog #content .container, .single-post #content .container {
    max-width: 1440px !important;

}

.archive #content .container .page-content .row, .category #content .container .page-content .row, .blog #content .container .page-content .row {
    padding-left: 20px;
}

.navigation.pagination {
    margin: 5px 0;
    border-top: 1px solid #cccccc;
    padding-top: 15px;
}

.pagination .nav-links, .comments-pagination .nav-links {
    margin-top: 0;
    display: flex;
}

.pagination .nav-links > *, .comments-pagination .nav-links > * {
    font-size: 14px;
    font-weight: bold;
    margin-top: 0;
    margin-right: 0;
    margin-left: 0;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-family: var(--digits-font-family);
}

.pagination .nav-links > *.current, .comments-pagination .nav-links > *.current {
    text-decoration: none;
    border: 1px solid #ccc;
}

@media (max-width: 767.98px) {
    .archive #content .container .page-content .row, .category #content .container .page-content .row, .blog #content .container .page-content .row {
        padding-left: 0px !important;
    }

    .archive #content, .category #content, .blog #content {
        margin-top: 70px;
    }
}

@media (max-width: 580px) {
    .archive .page-header, .category .page-header, .blog .page-header {
        background-position: center;
    }

    .archive .page-header .entry-title, .category .page-header .entry-title, .blog .page-header .entry-title {
        font-size: 24px !important;
        padding: 0px 10px;
    }
}

/*-------------- Blog list / End ---------------*/
/*-------------- Error page / Start ---------------*/
.error-page {
    background-color: #EDEDED;
    background-image: url(/wp-content/uploads/2023/10/background2.png);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: contain;
    padding-top: 145px;
    padding-bottom: 80px;
    position: relative;
}

.error-page .page-title {
    position: relative;
    z-index: 1;
    color: var(--primary-color);
    text-align: center;
    font-weight: 600;
    font-size: 24px;
    line-height: 35px;
    margin: 0 0 15px;
}

.error-page .page-content {
    position: relative;
    z-index: 1;
    color: var(--text-color);
    font-size: 16px;
    text-align: center;
    font-weight: 400;
    margin-left: 0;
    padding-top: 0;
}

.error-page .page-content .btn {
    position: relative;
    display: inline-block;
    line-height: 1;
    background-color: var(--primary-color);
    font-size: 15px;
    padding: 12px 24px;
    border-radius: 3px;
    color: #000;
    text-align: center;
    transition: all .3s;
}

.error-page .page-content .btn:hover {
    color: #fff;
    background-color: #000;
}

.error-page .page-content {
    margin: 0;
}

.error-page .page-content h2 {
    color: var(--primary-color);
    text-align: center;
    font-weight: 900;
    font-size: 100px;
    line-height: 100px;
}

/*-------------- Error page / End ---------------*/
/* ------------- 404 page / Start --------------- */


.wrapper-404 {
    text-align: center
}

.wrapper-404 img {
    margin: 0 auto
}

.wrapper-404 p {
    font-size: 18px;
    margin-top: 0;
    color: var(--text-color)
}

.wrapper-404 b {
    font-size: 150px;
    line-height: 150px;
    font-weight: bold;
    display: inline-block;
    color: var(--primary-color)
}

.wrapper-404 a {
    width: auto;
    display: inline-block
}

.wrapper-404 .btn-circle {
    display: inline-block
}

@media (min-width: 576px) {
    .wrapper-404 .btn-circle .elementor-button:before {
        border: 2px solid var(--secondary-color);
        filter: brightness(0) saturate(100%) invert(47%) sepia(31%) saturate(547%) hue-rotate(298deg) brightness(100%) contrast(84%)
    }

    .wrapper-404 .btn-circle .elementor-button:hover:before {
        filter: brightness(0) saturate(100%) invert(96%) sepia(0%) saturate(2%) hue-rotate(289deg) brightness(108%) contrast(100%)
    }
}

@media (max-width: 575.98px) {
    .wrapper-404 b {
        font-size: 100px
    }

    .wrapper-404 p {
        font-size: 14px
    }

    .wrapper-404 .btn-circle .elementor-button {
        margin-right: 0
    }
}

/* ------------- 404 page / End--------------- */

.hfe-skip-link {
    position: fixed !important;
    left: -9999px !important;
    top: 0 !important;
}