/* Dark color tokens */
:root {
    --background-color: #0b0f13;
    --default-color: #e6eef8;
    --heading-color: #e6eef8;
    --accent-color: #ffc451;
    --surface-color: #0f1720;
    --contrast-color: #cbd8e2;
}

/* Base dark background */
body {
    background-color: var(--background-color) !important;
    color: var(--default-color) !important;
}



#hero::before {

    background: rgba(0, 0, 0, 0.5) !important;

}

#hero h2 {

    font-size: 74px;
    font-weight: 900;
    letter-spacing: 2px;
    font-family: Arial, Helvetica, sans-serif;
    background-size: 200% auto;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px #d4af37;

    text-shadow:
        2px 2px 2px rgba(0, 0, 0, 0.6),
        -2px -2px 2px #ddc064,
        1px 1px 0 #b8860b,
        -1px -1px 0 #fffacd;

    animation: shimmer 4s linear infinite;
}

@media (max-width: 575.98px) {
    #hero h2 {
        /* This shrinks the font so "Conviction" fits on one line */
        font-size: 40px !important;
        letter-spacing: 1px;

        /* Thinning the stroke so it doesn't overwhelm the smaller letters */
        -webkit-text-stroke: 0.5px #d4af37;


    }
}

@keyframes shimmer {
    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 200% 50%;
    }
}


/* All sections dark surface */
section,
.section,
main>section {
    background-color: var(--surface-color) !important;
    color: var(--default-color) !important;
}

/* Neutralize light backgrounds */
.bg-white,
.bg-light,
.card,
.card-body,
.section-title,
.section-title * {
    background: transparent !important;
    color: var(--default-color) !important;
    border-color: rgba(255, 255, 255, 0.03) !important;
}

/* Header */
.header {
    background-color: rgba(6, 10, 15, 0.6) !important;
}

.navmenu a {
    color: var(--default-color) !important;
}

.navmenu a:hover,
.navmenu .active {
    color: var(--accent-color) !important;
}

/* Forms */
input,
textarea,
select,
.form-control {
    background: #071017 !important;
    color: var(--default-color) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
}

::placeholder {
    color: rgba(230, 238, 248, 0.36) !important;
}

/* Footer */
.footer,
.footer-top,
.footer .copyright {
    background-color: var(--background-color) !important;
    color: var(--contrast-color) !important;
}

/* Links */
a,
a:link {
    color: var(--accent-color) !important;
}

a:hover {
    color: #0ea5a4 !important;
}

/* Cards */
.card,
.service-item,
.team-member,
.testimonial-item,
.portfolio-item {
    background-color: rgba(255, 255, 255, 0.02) !important;
    color: var(--default-color) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
}

/* Pagination */
.swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.12) !important;
}

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

.stretched-link::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}