/*
Theme Name: Oblong Base Theme V26.2
Author: Oblong Tech
Version: 26.2.build-3434
@layers root, defaults, theme, blocks, modifiers;
@container {}
*/

/**============================================================================
 * FONTS & TYPOGRAPHY
 =============================================================================*/
:root {
   
}
p {
    max-width: 870px;
}

/**============================================================================
* GRID LAYOUTS
=============================================================================*/
:root {

}
.wp-site-blocks {
    container-type: inline-size;
    display: grid;
}


/**============================================================================
 * TEMPLATE PARTS: HEADER / FOOTER / NAVIGATION
 =============================================================================*/
:root {
    --headerHeight: 126px;
}
.wp-block-template-part:has(>.desktopHeader),
.wp-block-template-part:has(>.mobileHeader)
{
    display: contents;
}
 .desktopHeader {
    position: sticky;
    top: 0;
    z-index: 99999;
    top: -99px;
    transform: translateY(0);

    &.\:stuck {
        transition: transform 400ms cubic-bezier(0.65, 0.05, 0.36, 1);
        transform: translateY(99px);
    }
}

.mobileHeader {
    position: sticky;
    top: 0;
    z-index: 99999;
}
.mobileMenu {

    .wp-block-navigation__responsive-container {
        top: var(--headerHeight);
        padding-top: 0;
        padding-bottom: var(--headerHeight);
        overflow: visible;
        row-gap: calc(150*100svh/1920);
    }
    .wp-block-navigation__responsive-container-open {
        padding-left: calc(60*100vmin/1080);
        padding-right: calc(60*100vmin/1080);
        height: -webkit-fill-available;
        align-items: center;
        margin: auto;
        margin-left: 0;
        svg {
            height: calc(60*100vmin/1080);
            transform: scaleX(2.5);
        }
    }
    .wp-block-navigation__responsive-container-close {
        height: var(--headerHeight);
        padding-left: calc(40*100vmin/1080);
        padding-right: calc(40*100vmin/1080);
        top: calc(-1*var(--headerHeight));
        svg {
            width: calc(72*100vmin/1080);
            height: calc(72*100vmin/1080);
        }
    }
    .wp-block-navigation__responsive-close,
    .wp-block-navigation__responsive-dialog,
    .wp-block-navigation__responsive-container-content
    {
        display: contents!important;
    }
    
    &.wp-block-navigation {
        height: -webkit-fill-available;
    }
    .wp-block-navigation-item:first-child {
        margin-top: auto;
    }
    .wp-block-navigation-item:last-child {
        margin-bottom: auto;
    }
}



/**============================================================================
 * PAGE CONTENT
 =============================================================================*/
.--text-shadow > * {
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.25)) drop-shadow(0px 0px 50px black);
}
.--backdrop-blur {
    position: relative;
    &::after {
        content: "";
        position: absolute;
        inset: 0 0 0 0;
        backdrop-filter: blur(8px) contrast(1.1) brightness(0.9);
    }
}
.__bgnd {
    position: absolute;
    inset: 0 0 0 0;
}

.oblong-block-container {
    margin: 0;
    & > .wp-block-navigation-item {
        display: contents;
        .wp-block-navigation-item__label { display: none; }
        .wp-block-navigation-item__content {
            position: absolute;
            inset: 0 0 0 0;
        }
    }
}
:where( .wp-block-template-part, .wp-site-blocks, .wp-block-post-content ) > .oblong-block-container {
    media (max-width: 768px) {
        --paddingLeft: 16px;
        --paddingRight: 16px;
    }
    @media (min-width: 769px) {
        --paddingLeft: 24px;
        --paddingRight: 24px;
    }
    &:is(.height\:100vh):first-child {
        height: calc(100dvh - var(--headerHeight)) !important;
    }
    &:is(.height\:fullscreen):first-child {
        margin-top: calc(-1 * var(--headerHeight)) !important;
        padding-top: calc(var(--headerHeight) + var(--paddingTop)) !important;
    }
}
.oblong-block-container > .oblong-block-container,
.oblong-block-container > .block-editor-block-list__block > .oblong-block-container
{
    &.width\:contain {
        max-width: max( 40%, 1280px/2 );
        padding-left: var(--paddingLeft);
        padding-right: var(--paddingRight);
    }
}

.oblong-block-container.background\:media {
 
    & > .wp-block-image:first-child,
    & > .wp-block-video:first-child
    {
        position: absolute;
        z-index: -1;
        inset: 0 0 0 0;
        width: auto !important;
        margin-bottom: 0;
    }
    .wp-block-image img {
        aspect-ratio: auto;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
    }
    .wp-block-video video {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
    }
}

@media (min-width: 769px) {
    .--grid5 {
        display: grid;
        grid-template:
            "a a b c" auto
            "a a d e" auto
            / 1fr 1fr 1fr 1fr
        ;
        & > :nth-child(1) { grid-area: a; }
        & > :nth-child(2) { grid-area: b; }
        & > :nth-child(3) { grid-area: c; }
        & > :nth-child(4) { grid-area: d; }
        & > :nth-child(5) { grid-area: e; }
    }
}



/**============================================================================
 * WORDPRESS BLOCK OVERRIDES
 =============================================================================*/
.wp-site-blocks > * {
    margin-block-start: 0;
}
:has(>.is-layout-constrained) {
	container-type: inline-size;
}
@container ( width > 1280px ) {
    .is-layout-constrained {
        width: stretch;
        padding-left: calc(50cqw - 1280px / 2);
        padding-right: calc(50cqw - 1280px / 2);
    }
}

.wp-block-column {
    width: auto;
    width: -webkit-fill-available;
}
.wp-block-column > p:last-child {
    margin-bottom: 0;
}
.wp-block-columns.is-layout-flex {
    display: grid;
    grid-auto-columns: 1fr;

    @media (min-width: 769px) {
        grid-auto-flow: column;
    }
}
.wp-block-spacer[style="height:0"] {
    flex: 1;
}

/**============================================================================
 * WORDPRESS ADMIN CMS
 =============================================================================*/
.editor-visual-editor__post-title-wrapper {
    margin: 24px 12px !important;
}
.acf-block-preview {
    margin-block-start: 0;
}
.block-editor-block-list__block .block-list-appender {
    line-height: 1;
}
.mce-edit-area > iframe {
    padding: 0 8px;
    box-sizing: border-box;
}
.editor-styles-wrapper {
    /*background: #f5f7f3;*/
}
:where(.editor-styles-wrapper) .is-root-container {
    container-type: inline-size;
}
