@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap');

:root {
    --padding-x: 3.5rem;
    --padding-y: 1.75rem;
    --golden-color: #d4af37;
    --dark-color: #464646;
    --section-heading-letter-spacing: 0.1rem;
    --section-text-font-size: 1.2rem;
    --section-text-letter-spacing: 0.06rem;
    --button-letter-spacing: 0.06rem;
    --serif-font-family: "Merriweather", Times, serif
}

body .btn-gold {
    background-color: var(--golden-color);
    color: white;
}

/** Navbar **/
#logo {
    width: 6rem;
}

body *,
body .nav-link {
    font-family: "Host Grotesk", Arial, Helvetica, sans-serif;
    letter-spacing: var(--section-text-letter-spacing);
}

body .navbar {
    padding: 0.5rem var(--padding-x);
}

nav .nav-link {
    font-size: 1.3rem;
}

nav .container-fluid {
    padding-right: 0;
    padding-left: 0;
}

#book-button {
    width: fit-content;
    padding: 5px 10px;
    letter-spacing: var(--button-letter-spacing);
}

/** Footer **/
footer {
    padding: var(--padding-y) var(--padding-x);
}

footer h3,
footer p {
    letter-spacing: var(--section-text-letter-spacing);
}

footer .working-hours {
    margin-bottom: 0.5rem;
}

footer .working-hours .content p {
    margin-bottom: 0.2rem;
}

footer .content a {
    color: var(--bs-body-color);
}


.content a:hover {
    color: rgba(0, 0, 0, 0.8);
}

#footer-signature a {
    color: var(--golden-color);
    text-decoration: none;
}

@media (min-width: 776px) {
    #logo {
        width: 8rem;
    }
}