/*--------------
 * Table of Contents
--------------*/

/*-----------------
1. Variable definition
2. Setup
3.
------------------*/
:root {
    --primary-bg-color-dark: #363636;
    --secondary-bg-color-dark: #242424;

    --primary-link-color: #485fc7;

    --primary-text-color: #00090B;
    --primary-background-color: #FAF6F0;
    --secondary-background-color: #AD9C87;
    --primary-highlight-color: #F0C65F;
    --secondary-highlight-color: #F7E3B2;
}

.hero .navbar.has-secondary-bg-color {
    background-color: var(--secondary-background-color);
}

[data-theme=light],
.theme-light {
    --bulma-link-text: var(--primary-highlight-color);
    --bulma-link-text-hover: var(--primary-highlight-color);
    --bulma-navbar-item-color: var(--primary-background-color);
    --bulma-content-heading-color: var(--primary-text-color);
    --bulma-strong-color: var(--primary-text-color);
}

.navbar {
    --bulma-navbar-background-color: var(--secondary-background-color);
}

html {
    background-color: var(--primary-text-color);
}

a:hover {
    text-decoration: underline;
}

a.navbar-item:hover {
    background-color: unset;
    color: var(--bulma-navbar-item-color);
    text-decoration: underline;
}

.footer .title {
    --bulma-title-color: unset;
}

.is-secondary-dark {
    background-color: var(--primary-text-color);
    color: var(--primary-background-color);
}

.is-secondary-dark .title {
    color: var(--primary-background-color);
}

.is-secondary-dark p,
.is-secondary-dark div {
    color: #b5b5b5;
}

.hero.hero-bg-img {
    /*background-image: url("/img/hero_bg.webp");*/
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    background-color: var(--primary-text-color);
}

.button {
    background-color: var(--primary-highlight-color);
    color: var(--primary-text-color);
}

.grid .card:not(:last-child) {
    margin-bottom: unset;
}

@media screen and (min-width: 769px){
    .content-space-left {
        padding-left: 22%;
    }

    .content-space-right {
        padding-right: 22%;
    }

    .px-tablet-6 {
        padding-left: 3rem;
        padding-right: 3rem;
    }
}