:root {
    --black-100: #171717;
    --black-90: #2E2E2E;
    --black-80: #454545;
    --black-70: #5D5D5D;
    --black-60: #747474;
    --black-50: #8B8B8B;
    --black-40: #A2A2A2;
    --black-30: #B9B9B9;
    --black-20: #D1D1D1;
    --black-10: #E8E8E8;
    --black-09: #EAEAEA;
    --black-08: #ECECEC;
    --black-07: #EFEFEF;
    --black-06: #F1F1F1;
    --black-05: #F3F3F3;
    --black-04: #F6F6F6;
    --black-03: #F8F8F8;
    --black-02: #FAFAFA;
    --black-01: #FDFDFD;
    --white-100: #FFFFFF;
    --white-90: #EBEBEB;
    --white-80: #D7D7D7;
    --white-70: #C3C3C3;
    --white-60: #AFAFAF;
    --white-50: #9B9B9B;
    --white-40: #888888;
    --white-30: #747474;
    --white-20: #606060;
    --white-10: #4C4C4C;
    --white-09: #4A4A4A;
    --white-08: #484848;
    --white-07: #464646;
    --white-06: #444444;
    --white-05: #424242;
    --white-04: #404040;
    --white-03: #3E3E3E;
    --white-02: #3C3C3C;
    --white-01: #3A3A3A;
}

html,
body {
    scroll-behavior: smooth;
}

body {
    color: var(--dark-90);
    /*font-family: 'Share Tech Mono', monospace;*/
    font-family: 'Raleway', sans-serif;
    background-color: var(--background);
}

body.theme-dark {
    background-color: var(--black-100);
}


/* text */

a {
    text-decoration: none;
    color: initial;
}

a:hover {
    text-decoration: underline;
}

.text-muted {
    color: var(--dark-30)!important;
}

.text-dark-10 {
    color: var(--dark-10)!important;
}


/* utils */

.mb-64 {
    margin-bottom: 64px;
}

.mb-96 {
    margin-bottom: 96px;
}

.theme-dark .border-top {
    border-top: 1px solid var(--white-20)!important;
}

.border-bottom {
    border-bottom: 1px solid var(--black-20);
}

.theme-dark .border-bottom {
    border-bottom: 1px solid var(--white-20)!important;
}

hr,
h1,
h2,
h3,
h4,
h5,
h6,
a,
pre,
small,
ul li,
ol li {
    color: var(--black-80);
}

.theme-dark hr,
.theme-dark h1,
.theme-dark h2,
.theme-dark h3,
.theme-dark h4,
.theme-dark h5,
.theme-dark h6,
.theme-dark a,
.theme-dark pre,
.theme-dark small,
.theme-dark ul li,
.theme-dark ol li {
    color: var(--white-80);
}


/* button */

.btn-secondary {
    border: none;
    border-radius: 0;
    line-height: 18px;
    padding: 0 0 4px 0;
    color: var(--black-50);
    text-transform: uppercase;
    background-color: transparent;
    border-bottom: 1px solid var(--black-20);
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    color: var(--black-100)!important;
    background-color: transparent!important;
}

.theme-dark .btn-secondary {
    color: var(--white-50);
    border-bottom: 1px solid var(--white-20);
}

.theme-dark .btn-secondary:hover,
.theme-dark .btn-secondary:focus,
.theme-dark .btn-secondary:active {
    color: var(--white-100)!important;
    border-bottom: 1px solid var(--white-100)!important;
}


/* form */

.form-control {
    border: none;
    padding-left: 0;
    border-radius: 0;
    /*text-transform: uppercase;*/
    border-bottom: 1px solid var(--black-20);
}

.form-control.form-error {
    border-bottom: 1px solid #EB5B52!important;
}

.form-control:hover,
.form-control:active,
.form-control:focus {
    border-color: var(--black-80)!important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0)!important;
}

.form-control::placeholder {
    font-size: 14px;
    color: var(--black-50);
    text-transform: uppercase;
}

.form-control:-ms-input-placeholder {
    font-size: 14px;
    color: var(--black-50);
    text-transform: uppercase;
}

.form-control::-ms-input-placeholder {
    font-size: 14px;
    color: var(--black-50);
    text-transform: uppercase;
}

.text-error {
    color: #EB5B52;
    font-size: 12px;
    text-transform: uppercase;
}

.theme-dark .form-control {
    color: var(--white-80);
    background-color: var(--black-100);
    border-bottom: 1px solid var(--white-20);
}

.theme-dark .form-control:hover,
.theme-dark .form-control:active,
.theme-dark .form-control:focus {
    border-color: var(--white-80)!important;
}

.theme-dark .form-control::placeholder {
    color: var(--white-50);
}

.theme-dark .form-control:-ms-input-placeholder {
    color: var(--white-50);
}

.theme-dark .form-control::-ms-input-placeholder {
    color: var(--white-50);
}


/* container */

@media (max-width: 767px) {
    .container {
        padding-right: 20px;
        padding-left: 20px;
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 760px;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 940px;
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 940px;
    }
}


/* navbar */

.navbar {
    --bs-navbar-padding-y: 50px;
}

.navbar .navbar-toggler {
    border: none;
}

.navbar .navbar-toggler:focus {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0);
}

.navbar .navbar-toggler-icon {
    background-image: url('../img/menu-light.svg');
}

.navbar .navbar-brand {
    font-size: 20px;
    color: var(--black-100);
    text-transform: uppercase;
}

.navbar .navbar-nav {
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.navbar .navbar-nav .nav-link {
    padding: 0;
    color: var(--black-80);
    text-transform: uppercase;
}

.navbar .navbar-nav .nav-link.logo {
    color: var(--black-100);
    font-size: 20px;
    line-height: 22px;
}

.theme-dark .navbar .navbar-brand {
    color: var(--white-100);
}

.theme-dark .navbar .navbar-toggler-icon {
    background-image: url('../img/menu-dark.svg');
}

.theme-dark .navbar .navbar-nav .nav-link {
    color: var(--white-60);
}

.theme-dark .navbar .navbar-nav .nav-link.logo {
    color: var(--white-100);
}


/* offcanvas */

.offcanvas.offcanvas-start {
    width: 360px;
}

.offcanvas .offcanvas-header .btn-close {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0)!important;
}

.offcanvas .navbar-nav {
    align-items: start;
}

.offcanvas .navbar-nav .nav-link {
    padding: 10px 0;
}

.theme-dark .offcanvas {
    background-color: var(--black-100);
}

.theme-dark .offcanvas-header .btn-close {
    filter: invert(1);
}


/* main */

main {
    min-height: 84.5vh;
}


/* section */

section {
    padding: 42px 0 54px 0;
}

.section-title {
    text-align: center;
    color: var(--black-100);
    text-transform: uppercase;
}

.section-description {
    color: var(--black-80);
    text-align: center;
    font-size: 20px;
    line-height: 22px;
}

.theme-dark .section-title {
    color: var(--white-100);
}

.theme-dark .section-description {
    color: var(--white-80);
}


/* services */

.services .service-lists .service-title {
    margin-bottom: 8px;
    color: var(--black-80);
    text-transform: uppercase;
}

.services .service-lists ul li {
    padding: 8px 0;
    color: var(--black-80);
}

.theme-dark .services .service-lists .service-title {
    color: var(--white-80);
}

.theme-dark .services .service-lists ul li {
    color: var(--white-80);
}


/* members */

.members .member-lists {
    margin-top: 108px;
}

.members .member-lists .member-title {
    text-align: center;
    margin-bottom: 24px;
    color: var(--black-100);
    text-transform: uppercase;
}

.members .member-lists .member-image {
    width: 100%;
    height: 248px;
    object-fit: cover;
    border-radius: 4px;
    margin-bottom: 16px;
    /*border: 1px solid var(--black-50);*/
}

.members .member-lists .member-name {
    color: var(--black-80);
    font-size: 18px;
    line-height: 20px;
    margin-bottom: 2px;
}

.members .member-lists .member-role {
    color: var(--black-60);
    margin-bottom: 16px;
}

.members .member-lists .member-description {
    line-height: 24px;
    color: var(--black-80);
    text-transform: uppercase;
}

@media (max-width:991.98px) {
    .members .member-lists {
        margin-top: 92px;
    }
    .members .member-lists .member-image {
        height: 198px;
    }
}

.theme-dark .members .member-lists .member-title {
    color: var(--white-100);
}

.theme-dark .members .member-lists .member-image {
    /*border: 1px solid var(--white-10);*/
}

.theme-dark .members .member-lists .member-name {
    color: var(--white-80);
}

.theme-dark .members .member-lists .member-role {
    color: var(--white-60);
}

.theme-dark .members .member-lists .member-description {
    color: var(--white-80);
}


/* blogs */

.blogs .blog-lists .blog-image {
    width: 100%;
    height: 248px;
    object-fit: cover;
    border-radius: 4px;
    margin-bottom: 16px;
    border: 1px solid var(--black-10);
}

.blogs .blog-lists .blog-title {
    min-height: 48px;
    color: var(--black-80);
    text-transform: uppercase;
}

@media (max-width:991.98px) {
    .blogs .blog-lists .blog-title {
        min-height: unset;
    }
    .blogs .blog-lists .blog-image {
        height: 198px;
    }
}

.theme-dark .blogs .blog-lists .blog-image {
    border: 1px solid var(--white-10);
}

.theme-dark .blogs .blog-lists .blog-title {
    color: var(--white-80);
}


/* article */

.article ul li {
    padding: 8px 0;
}

.article ul li a {
    color: var(--black-80);
    text-transform: uppercase;
}

.theme-dark .article ul li a {
    color: var(--white-100);
}


/* article-detail */

.article-detail .title,
.article-detail .author {
    display: flex;
    flex-direction: column;
    color: var(--black-100);
    text-transform: uppercase;
}

.article-detail .image {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 20px;
}

.article-detail .caption {
    line-height: 26px;
    margin-bottom: 28px;
    color: var(--black-100);
    text-transform: uppercase;
}

.article-detail p {
    line-height: 24px;
    color: var(--black-80);
    margin-bottom: 28px;
}

.theme-dark .article-detail .title,
.theme-dark .article-detail .author,
.theme-dark .article-detail .caption {
    color: var(--white-100);
}

.theme-dark .article-detail p {
    color: var(--white-80);
}

/* testimonials */

.testimonials {
    position: relative;
    padding: 48px 0 64px 0;
}

.testimonials .swiper-button-prev {
    top: 5em;
    left: -24px!important;
}

.testimonials .swiper-button-next {
    top: 5em;
    right: -24px!important;
}

.testimonials .swiper-button-prev,
.testimonials .swiper-button-next {
    color: var(--black-80);
}

.testimonials .swiper-button-prev:after,
.testimonials .swiper-button-next:after {
    content: ''!important;
}

@media(max-width:991.98px) {
    .testimonials .container .content {
        padding: 0 16px;
    }
    .testimonials .swiper-button-prev {
        left: 10px!important;
    }
    .testimonials .swiper-button-next {
        right: 10px!important;
    }
}

.theme-dark .testimonials .container .content, .panah {
    color: var(--white-80);
}

.theme-dark .testimonials .swiper-button-prev,
.theme-dark .testimonials .swiper-button-next, .panah {
    color: var(--white-80);
}

/* contact */

.contact .contact-form {
    padding: 32px;
    border-radius: 4px;
    border: 2px dashed var(--black-20);
}

.contact .contact-form .contact-wrapper {
    display: flex;
    align-items: start;
    justify-content: space-between;
    border-bottom: 1px solid var(--black-20);
}

.contact .contact-form .contact-wrapper .left {
    width: 50%;
    border-right: 1px solid var(--black-20);
}

.contact .contact-form .contact-wrapper .left .contact-title {
    font-size: 20px;
    margin-bottom: 8px;
    color: var(--black-80);
    text-transform: uppercase;
}

.contact .contact-form .contact-wrapper .left .contact-description {
    color: var(--black-60);
    text-transform: uppercase;
}

.contact .contact-form .contact-wrapper .left .contact-info {
    gap: 20px;
    display: flex;
    flex-wrap: wrap;
}

.contact .contact-form .contact-wrapper .left .contact-info .label {
    margin-bottom: 4px;
    color: var(--black-80);
    text-transform: uppercase;
}

.contact .contact-form .contact-wrapper .left .contact-info .value {
    font-size: 14px;
    color: var(--black-60);
    text-transform: uppercase;
}

.contact .contact-form .contact-wrapper .right {
    padding: 0 0 24px 24px;
    width: 50%;
}

.contact .contact-form .contact-wrapper .right .box {
    width: 100%;
    max-width: 72px;
    height: 86px;
    border: 2px dashed var(--black-20);
}

.contact .contact-send {
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    color: var(--black-80);
}

@media(max-width:991.98px) {
    .contact .contact-form {
        padding: 24px;
    }
    .contact .contact-form .contact-wrapper {
        flex-direction: column;
        border-bottom: none!important;
    }
    .contact .contact-form .contact-wrapper .left,
    .contact .contact-form .contact-wrapper .right {
        width: 100%;
    }
    .contact .contact-form .contact-wrapper .left {
        border-right: none!important;
    }
    .contact .contact-form .contact-wrapper .left .contact-info {
        margin-bottom: 0!important;
    }
    .contact .contact-form .contact-wrapper .right {
        border-top: 1px solid var(--black-20);
        padding-top: 36px!important;
        padding: 0;
    }
    .theme-dark .contact .contact-form .contact-wrapper .right {
        border-top: 1px solid var(--white-20);
    }
}

.theme-dark .contact .contact-form {
    border: 2px dashed var(--white-20);
}

.theme-dark .contact .contact-form .contact-wrapper {
    border-bottom: 1px solid var(--white-20);
}

.theme-dark .contact .contact-form .contact-wrapper .left {
    border-right: 1px solid var(--white-20);
}

.theme-dark .contact .contact-form .contact-wrapper .left .contact-title {
    color: var(--white-80);
}

.theme-dark .contact .contact-form .contact-wrapper .left .contact-description {
    color: var(--white-60);
}

.theme-dark .contact .contact-form .contact-wrapper .left .contact-info .label {
    color: var(--white-80);
}

.theme-dark .contact .contact-form .contact-wrapper .left .contact-info .value {
    color: var(--white-60);
}

.theme-dark .contact .contact-form .contact-wrapper .right .box {
    border: 2px dashed var(--white-20);
}

.theme-dark .contact .contact-send {
    color: var(--white-80);
}


/* footer */

footer .copyright {
    color: var(--black-60);
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    text-transform: uppercase;
}

.theme-dark footer .copyright {
    color: var(--white-60);
}


/* theme-switch */

.theme-switch {
    gap: 0;
    display: flex;
    bottom: 48px;
    right: 64px;
    position: fixed;
    padding: 4px;
    width: max-content;
    border-radius: 80px;
    background: var(--white-50);
}

.theme-switch .btn {
    font-size: 12px;
    padding: 10px 24px;
    border-radius: 80px;
    color: var(--white-100);
    text-transform: uppercase;
}

.theme-switch .btn:hover,
.theme-switch .btn.selected {
    color: var(--white-100);
    background: var(--black-80);
    border-color: var(--black-80);
}

@media (max-width:991.98px) {
    .theme-switch {
        display: none;
    }
}

.theme-dark .theme-switch {
    background: var(--black-90);
}

.theme-dark .theme-switch .btn:hover,
.theme-dark .theme-switch .btn.selected {
    background: var(--black-100);
    border-color: var(--black-100);
}

:not(.btn-check)+.btn:active {
    border-color: transparent;
}

.error-404 {
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    color: var(--black-80);
}

.error-404 a {
    font-size: 20px;
    line-height: 22px;
    color: var(--black-80);
    text-decoration-line: underline;
}

.theme-dark .error-404 {
    color: var(--white-80);
}

.theme-dark .error-404 a {
    color: var(--white-80);
}