body,
html {
    background-color: var(--c3-color-background);
    font-family: var(--c3-typography-text-font-family), sans-serif;
    font-weight: var(--c3-typography-text-font-weight);
    font-size: 16px;
    color: var(--c3-color-text);
    line-height: 2;
    transition: background-color 300ms, color 300ms;
    -webkit-transition: background-color 300ms, color 300ms;
}

a {
    display: inline-block;
    position: relative;
    line-height: 1.2;
}

a:before {
    content: '';
    display: block;
    width: 0;
    height: 1px;
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    background-color: var(--c3-color-text);
    transition: width var(--c3-animation-timing) var(--c3-animation-duration);
    -webkit-transition: width var(--c3-animation-timing) var(--c3-animation-duration);
}

a:hover:before,
a:focus-visible:before,
.current-menu-item > a:before {
    width: 100%;
    right: auto;
    left: 0;
}

a:focus-visible,
button:focus-visible,
[tabindex="-1"]:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 0.3rem;
}

.c3-skip-link {
    position: fixed;
    top: 1rem;
    left: 1rem;
    z-index: 1000;
    transform: translateY(-200%);
    padding: 0.6rem 1rem;
    background-color: var(--c3-color-background);
}

.c3-skip-link:focus {
    transform: translateY(0);
}

.current-menu-home.menu-item-home > a:before {
    width: 0;
    right: 0;
    left: auto;
}

.c3--focus-sidebar {
    overflow: hidden;
}

.c3-header {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    z-index: 99;
    visibility: visible;
    opacity: 1;
    filter: blur(0);
    transition: transform var(--c3-animation-duration) var(--c3-animation-timing), visibility 0ms 0ms var(--c3-animation-timing), opacity var(--c3-animation-duration) var(--c3-animation-timing), filter var(--c3-animation-duration) var(--c3-animation-timing);
    -webkit-transition: transform var(--c3-animation-duration) var(--c3-animation-timing), visibility 0ms 0ms var(--c3-animation-timing), opacity var(--c3-animation-duration) var(--c3-animation-timing), filter var(--c3-animation-duration) var(--c3-animation-timing);
}

.c3--focus-sidebar .c3-header,
.c3--focus-post .c3-header,
.c3--focus-page .c3-header {
    transform: translate(-50%, -50%) scale(0.5);
    -webkit-transform: translate(-50%, -50%) scale(0.5);
    visibility: hidden;
    opacity: 0;
    filter: blur(0.5rem);
    transition: transform var(--c3-animation-duration) var(--c3-animation-timing), visibility 0ms var(--c3-animation-duration) var(--c3-animation-timing), opacity var(--c3-animation-duration) var(--c3-animation-timing), filter var(--c3-animation-duration) var(--c3-animation-timing);
    -webkit-transition: transform var(--c3-animation-duration) var(--c3-animation-timing), visibility 0ms var(--c3-animation-duration) var(--c3-animation-timing), opacity var(--c3-animation-duration) var(--c3-animation-timing), filter var(--c3-animation-duration) var(--c3-animation-timing);
}

.c3-header__title {
    position: relative;
    z-index: 2;
    font-family: var(--c3-typography-text-font-family), sans-serif;
    font-weight: var(--c3-typography-text-font-weight);
    font-size: 1.2rem;
    letter-spacing: 0.2rem;
    text-transform: uppercase;
}

.c3-header__link {
    display: inline-block;
    position: relative;
    color: inherit;
    transition: color 400ms var(--c3-animation-timing), text-shadow 400ms var(--c3-animation-timing);
}

.c3-header__link:before {
    display: none;
}

.c3-header__logo {
    position: relative;
    z-index: 1;
}

.c3-header__logo-parts {
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.c3-header__logo-part {
    width: 20%;
    height: 100%;
}

.c3-header__artworks {
    width: clamp(20rem, 32vw, 34rem);
    height: min(60vh, 42rem);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
    transform: translate(-50%, -50%);
}

.c3-header__artworks:after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 2;
    background: rgba(0, 0, 0, 0.16);
    opacity: 0;
    transition: opacity 400ms var(--c3-animation-timing);
}

.c3-header__artworks--active:after {
    opacity: 1;
}

.c3-header__artwork {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    opacity: 0;
    object-fit: cover;
    clip-path: inset(0 50%);
    transform: scale(1.055);
    filter: blur(0.2rem);
    transition: opacity 400ms var(--c3-animation-timing), clip-path 650ms var(--c3-animation-timing), transform 900ms var(--c3-animation-timing), filter 650ms var(--c3-animation-timing);
}

.c3-header__artwork[data-c3-artwork="1"],
.c3-header__artwork[data-c3-artwork="2"] {
    clip-path: inset(0 100% 0 0);
}

.c3-header__artwork[data-c3-artwork="4"],
.c3-header__artwork[data-c3-artwork="5"] {
    clip-path: inset(0 0 0 100%);
}

.c3-header__artwork.c3-header__artwork--active {
    z-index: 1;
    opacity: 1;
    clip-path: inset(0);
    transform: scale(1);
    filter: blur(0);
}

.c3-header--artwork-active .c3-header__link {
    color: #fff;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.35);
}


@media (max-width: 767px) {
    /* Hide scrollbar chrome while preserving native scrolling. */
    html,
    body,
    body * {
        scrollbar-width: none;
    }

    html::-webkit-scrollbar,
    body::-webkit-scrollbar,
    body *::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .c3-header {
        z-index: 97;
    }

    .c3-header__title {
        font-size: 1rem;
        letter-spacing: 0.16rem;
        white-space: nowrap;
    }

    .c3-header__artworks,
    .c3-header__artwork-template {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --c3-animation-duration: 1ms;
    }

    *,
    *:before,
    *:after {
        scroll-behavior: auto !important;
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
    }
}
