﻿@import url("./clear.css");

:root {
    --hhk-holz: #8b5e3c;
    --hhk-holz-2: #a8754d;
    --hhk-holz-dark: #5e3e26;
    --hhk-creme: #f6ead7;
    --hhk-creme-2: #efe1c6;
    --hhk-paper: #fbf5e8;
    --hhk-paper-warm: #fdf7ea;
    --hhk-wald: #3f6b4a;
    --hhk-wald-2: #4d7d5a;
    --hhk-wald-dark: #2c4d35;
    --hhk-gold: #d9a441;
    --hhk-gold-2: #e9c275;
    --hhk-gold-soft: #f1d398;
    --hhk-burgrot: #8f3d2e;
    --hhk-burgrot-2: #a64a39;
    --hhk-ink: #2b211a;
    --hhk-ink-2: #3a2d24;
    --hhk-ink-soft: #5a4a3a;
    --hhk-rule: #d9c4a4;
    --hhk-rule-soft: #e8d8b9;
    --hhk-shadow: 0 1px 0 rgba(43, 33, 26, .04), 0 10px 30px -18px rgba(43, 33, 26, .18);
    --hhk-shadow-hover: 0 1px 0 rgba(43, 33, 26, .04), 0 22px 44px -22px rgba(43, 33, 26, .32);
    --hhk-space-xs: 8px;
    --hhk-space-sm: 12px;
    --hhk-space-md: 18px;
    --hhk-space-lg: 20px;
    --hhk-page-gutter: var(--hhk-space-md);
    --hhk-page-gutter-mobile: var(--hhk-space-lg);
    --hhk-breadcrumb-y: var(--hhk-space-sm);
    --hhk-hero-padding: var(--hhk-space-md);
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    background: var(--hhk-paper);
    color: var(--hhk-ink);
    display: flex;
    flex-direction: column;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.55;
    min-height: 100vh;
}

#main-wrapper {
    flex: 1 1 auto;
}

h1,
h2,
h3,
.h1,
.h2,
.h3 {
    color: var(--hhk-ink);
    letter-spacing: 0;
}

a {
    color: var(--hhk-wald-dark);
}

a:hover,
a:focus {
    color: var(--hhk-burgrot);
}

.btn {
    border-radius: 999px;
    font-weight: 700;
}

.btn-primary,
button.btn-primary,
input.btn-primary {
    background: var(--hhk-gold);
    border-color: var(--hhk-gold);
    color: var(--hhk-ink);
    box-shadow: 0 4px 0 var(--hhk-holz-dark), 0 8px 20px -12px rgba(43, 33, 26, .4);
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--hhk-gold-soft);
    border-color: var(--hhk-gold-soft);
    color: var(--hhk-ink);
}

.btn-secondary {
    background: var(--hhk-ink);
    border-color: var(--hhk-ink);
    color: var(--hhk-paper);
}
