:root {
    --primary-color: ;
    --primary-color: #D4AF37;
    --secondary-color: #7A7A7A;
    --neutral: #F0F0F0;
    --menu-highlights: #ff7101;
    --menu-height: 100px;
    --menu-color: var(--primary-color);
    --headings-color: var(--primary-color);
    --links-color: var(--primary-color);
    --links-color-box-shadow: var(--neutral);
    --preview-background-color: var(--primary-color);
    --preview-hover-color: var(--primary-color);
    --preview-box-shadow-color: var(--primary-color);
    --submenu-anchor-background-color: rgb(225 233 242);
    --submenu-anchor-border-color: var(--primary-color);
    --submenu-background-color: var(--neutral);
    --submenu-link-item-margin: 0;
    --main-nav-text-color: var(--neutral);
    --main-nav-text-color: #41444f;
    --main-nav-links-color: var(--neutral);
    --main-nav-links-color: #41444f;
    --main-nav-links-hover-color: var(--menu-highlights);
    --main-nav-font-size: small;
    --main-nav-font-weight: 800;
    --header-background-color: #F5F5DC;
    --footer-background-color: var(--header-background-color);
    --main-nav-text-hover-color: var(--menu-highlights);
    --card-background: var(--neutral);
    --hero-card-background: rgba(240, 240, 240, 1);
    --hero-card-background: rgba(255, 255, 255, 0.9);
    --card-background: rgba(255, 255, 255, 0.8);
    --submenu-hover-color: var(--card-background);


    --card-border-radius: 5px;
    --secondary-header-font-size: 3cqmax;
    --card-type-a-title-size: 5cqmin;
    --card-type-a-paragraph-size: 4cqmin;
    --card-type-a-cta-size: 4cqmin;
    --primary-font-family: 'Playfair Display', Georgia, serif;
    --seconday-font-family: 'Montserrat', serif;

}

@font-face {
    font-family: 'Playfair Display', Georgia, serif;
    src: url(./fonts/playfairdisplay/PlayfairDisplay[wght].ttf);
}

@font-face {
    font-family: 'Montserrat', serif;
    src: url(./fonts/montserrat/Montserrat[wght].ttf);
}

html {
    scroll-behavior: smooth;
}

@view-transition {
    navigation: auto;
}

body {
    display: grid;
    max-width: 100svw;
    min-height: 100svh;
    font-family: var(--seconday-font-family);
    color: var(--secondary-color);
    padding: 0;
    margin: 0;
    container: body / inline-size;
    overflow: clip;
}

main {
    display: contents;
}