body {
    background: var(--bg-color);
    color: var(--text-color);
}

.card {
    background: var(--card-bg);
    border-color: var(--card-border);
    transition: .3s;
}

.card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 35px rgba(255, 165, 0, 0.25);
    border-color: var(--accent-color);
}

.card-title {
    color: var(--accent-color);
}

.text-accent {
    color: var(--accent-color);
}

.card-text {
    color: var(--text-muted);
}

@font-face {
    font-family: 'logo';
    src: url('fonts/logo.ttf');
}

.logo {
    font-family: 'logo';
    font-size: 72px;
    .tent {
        color: var(--accent-color);
    }
    .rus {
        font-size: 42px;
    }
}

@media (max-width: 768px) {
    .logo {
        font-size: xxx-large;
        .rus {
            font-size: 28px;
        }
    }
}

.bcl-ac {
    transition: .3s;
}

.bcl-ac:hover {
    transform: translateY(-8px);
    border-color: var(--accent-color);
    box-shadow: 0 15px 35px rgba(255, 165, 0, 0.25);
}

.bg-clr {
    background-color: var(--card-bg);
}
.modal-content {
    background-color: var(--card-bg);
    border-color: var(--card-border);
}
.call-btn {
    --bs-btn-font-size: auto;
}