/* ==========================================================
   DON CAMILLO BERLIN
   Global Frontend Foundation
========================================================== */
/* ==========================================================
   DON CAMILLO — BRAND SYSTEM
========================================================== */

:root {
    --dc-navy: #061d27;
    --dc-cream: #f1e8dc;
    --dc-gold: #c8a45d;
    --dc-burgundy: #8f1824;
}


/* ==========================================================
   GLOBAL PAGE BACKGROUND
========================================================== */

html {
    background-color: var(--dc-navy);
}

body {
    background-color: var(--dc-navy) !important;
}

#page,
.site,
.site-main,
main {
    background-color: var(--dc-navy);
}

/*
 * Prevent accidental horizontal overflow from cinematic scenes.
 */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}


/*
 * Better rendering for cinematic media.
 */
img,
video,
canvas {
    max-width: 100%;
}


/*
 * Keep our custom scenes isolated from Elementor sizing.
 */
[data-dc-scene] {
    box-sizing: border-box;
}


[data-dc-scene] *,
[data-dc-scene] *::before,
[data-dc-scene] *::after {
    box-sizing: inherit;
}


/*
 * Improve text rendering.
 */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/*
 * Prevent touch highlighting on visual animation assets.
 */
.dc-motion-media {
    -webkit-user-select: none;
    user-select: none;

    -webkit-touch-callout: none;
}


/*
 * Accessibility:
 * preserve native scroll behaviour when reduced motion
 * is explicitly requested by the visitor.
 */
@media (prefers-reduced-motion: reduce) {

    html {
        scroll-behavior: auto !important;
    }

}


/* ==========================================================
   DISABLED — OLD RED RIGHT-DRAWER NAVIGATION
   ==========================================================

   IMPORTANT:
   This complete block was overriding the original navbar CSS.

   It changed:
   - menu position
   - menu width
   - menu background
   - menu opening direction
   - hamburger position
   - navigation typography
   - navigation spacing
   - CTA appearance
   - menu divider
   - opening hours
   - arrows
   - decorative shapes
   - mobile menu layout

   We now let the ORIGINAL navbar stylesheet control all of
   these properties.

========================================================== */


/*

#dcMenu {
    --dc-drawer-red: #a31622;
    --dc-drawer-cream: #eeeadd;

    position: fixed;
    inset: 0 !important;

    display: block !important;

    width: 100%;
    height: 100dvh;

    overflow: hidden;
}


body.admin-bar #dcMenu {
    top: 32px !important;
    height: calc(100dvh - 32px);
}


#dcMenu .dc-menu__panel {
    box-sizing: border-box;

    position: absolute;

    inset: 0 0 0 auto !important;

    z-index: 2;

    width: clamp(340px, 23.2vw, 460px) !important;
    max-width: 100%;

    height: 100%;

    padding: 120px 38px 60px !important;

    background: var(--dc-drawer-red) !important;

    color: var(--dc-drawer-cream);

    border-radius: 38px 0 0 38px;

    align-items: stretch;
    justify-content: center;

    text-align: left;

    overflow-x: hidden;
    overflow-y: auto;

    transform: translate3d(105%,0,0) !important;
}


body.dc-menu-open #dcMenu .dc-menu__panel {
    transform: translate3d(0,0,0) !important;
}


#dcMenu .dc-menu__blur {
    position: absolute;

    inset: 0;

    display: block !important;

    background: rgba(22,15,12,.16) !important;

    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}


body.dc-menu-open .dc-header {
    background: transparent !important;

    border-color: transparent !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}


body.dc-menu-open .dc-header__inner {
    max-width: none;
}


body.dc-menu-open #dcMenuTrigger {
    position: absolute;

    right: 28px;
    left: auto;

    top: 50%;

    transform: translateY(-50%);

    color: #eeeadd !important;

    width: 44px;
    height: 44px;
}


body.dc-menu-open .dc-logo {
    grid-column: 2;
}


body.dc-menu-open #dcMenuTrigger .dc-burger {
    width: 30px;
}


body.dc-menu-open #dcMenuTrigger .dc-burger > span {
    height: 1.5px;
}


#dcMenu .dc-menu__nav,
#dcMenu .dc-menu__nav ul {
    width: 100%;

    margin: 0;
    padding: 0;
}


#dcMenu .dc-menu__nav li {
    margin: 0 !important;

    width: 100%;
}


body.dc-menu-open #dcMenu .dc-menu__nav li {
    opacity: 1;

    transform: none;
}


#dcMenu .dc-menu__nav a,
#dcMenu .dc-menu__cta {
    box-sizing: border-box;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 18px;

    width: 100%;

    min-height: 56px;

    margin: 0;

    padding: 17px 0 !important;

    border: 0;

    border-bottom:
        1px solid rgba(238,234,221,.44);

    border-radius: 0;

    font-family:
        var(--dc-font-sans),
        sans-serif !important;

    font-size: 17px !important;

    font-weight: 400;

    line-height: 1.3;

    letter-spacing: .015em !important;

    text-transform: uppercase;

    text-align: left;

    text-decoration: none;

    color:
        var(--dc-drawer-cream) !important;

    background:
        transparent !important;
}


#dcMenu .dc-menu__nav a::after,
#dcMenu .dc-menu__cta::after {
    content: '➜';

    position: static;

    display: inline-block;

    flex: 0 0 auto;

    width: auto;
    height: auto;

    background: none;

    color: inherit;

    font-family:
        Arial,
        sans-serif;

    font-size: 25px;

    line-height: 1;

    transition:
        transform .25s ease;
}


#dcMenu .dc-menu__nav a:hover::after,
#dcMenu .dc-menu__cta:hover::after {
    transform: translateX(4px);
}


#dcMenu a:focus-visible {
    outline:
        2px solid var(--dc-drawer-cream);

    outline-offset: 5px;
}


#dcMenu .dc-menu__divider {
    display: none;
}


#dcMenu .dc-menu__hours {
    margin-top: 32px;

    width: 100%;

    color: var(--dc-drawer-cream);
}


#dcMenu .dc-hours__title {
    color: inherit;

    font-size: 12px;

    letter-spacing: .1em;

    text-align: left;

    margin: 0 0 12px;
}


#dcMenu .dc-hours__row {
    display: flex;

    flex-direction: row;

    justify-content: space-between;

    gap: 12px;

    color: inherit;

    font-size: 12px;

    line-height: 1.5;

    margin: 5px 0;
}


#dcMenu .dc-menu__panel::before,
#dcMenu .dc-menu__panel::after {
    content: '';

    position: absolute;

    left: 2px;

    width: 46px;
    height: 68px;

    pointer-events: none;

    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 68'%3E%3Cpath d='M9 57C-7 34 2 7 23 4C42 1 45 22 35 37C28 48 20 42 27 32C34 20 26 13 19 21C11 30 18 40 18 48C18 56 13 60 9 57Z' fill='%23eeeadd'/%3E%3C/svg%3E")
        center / contain
        no-repeat;

    opacity: .92;
}


#dcMenu .dc-menu__panel::before {
    top: 5px;
}


#dcMenu .dc-menu__panel::after {
    bottom: 5px;

    transform: scaleY(-1);
}


@media (max-width: 782px) {

    body.admin-bar #dcMenu {
        top: 46px !important;

        height:
            calc(100dvh - 46px);
    }

}


@media (max-width: 767px) {

    #dcMenu .dc-menu__panel {
        width:
            min(88vw,390px) !important;

        padding:
            100px 26px 50px !important;

        border-radius:
            30px 0 0 30px;
    }


    body.dc-menu-open #dcMenuTrigger {
        right: 18px;
    }


    #dcMenu .dc-menu__nav a,
    #dcMenu .dc-menu__cta {
        min-height: 50px;

        padding:
            14px 0 !important;

        font-size:
            16px !important;
    }


    #dcMenu .dc-menu__hours {
        margin-top: 24px;
    }

}


@media (max-height: 650px) {

    #dcMenu .dc-menu__panel {
        justify-content: flex-start;

        padding-top:
            90px !important;
    }

}


@media (prefers-reduced-motion: reduce) {

    #dcMenu,
    #dcMenu *,
    #dcMenu *::after {
        transition:
            none !important;
    }

}

*/


/* ==========================================================
   WORDPRESS ADMIN BAR OFFSET
   KEEP THIS
========================================================== */

body.admin-bar .dc-header {
    top: 32px;
}


@media (max-width: 782px) {

    body.admin-bar .dc-header {
        top: 46px;
    }

}


/* ==========================================================
   DISABLED — RIGHT DRAWER HEADER OVERRIDES
   ==========================================================
   These rules were also part of the red drawer design.

   They moved the hamburger from the ORIGINAL left position
   to the right side and changed the header grid behaviour.
========================================================== */


/*

.dc-header .dc-header__inner {
    max-width: none;
}


.dc-header #dcMenuTrigger {
    position: absolute;

    right: 28px;
    left: auto;

    top: 50%;

    transform: translateY(-50%);

    width: 44px;
    height: 44px;
}


.dc-header .dc-logo {
    grid-column: 2;
    grid-row: 1;
}


.dc-header .dc-header__spacer {
    grid-column: 1;
    grid-row: 1;
}


@media (max-width: 767px) {

    .dc-header #dcMenuTrigger {
        right: 18px;
    }

}

*/