/* Shared masthead dimensions. Load after each page's own styles. */
:root {
    --studio-header-height: 82px;
    --studio-logo-height: 56px;
    --studio-header-gutter: 22px;
    --studio-header-content: 1500px;
}
body .site-header,
body .work-header,
body .studio-admin-header,
body .studio-confirmation-header {
    box-sizing: border-box;
    height: var(--studio-header-height);
    min-height: var(--studio-header-height);
    padding-block: 0;
    border-top: 4px solid transparent;
    border-bottom: 1px solid #dce5df;
    background: rgba(255,255,255,.96);
    position: sticky;
    top: 0;
    z-index: 60;
    animation: none;
}
body .site-header::before,
body .work-header::before,
body .studio-admin-header::before,
body .studio-confirmation-header::before {
    content: '';
    display: block;
    position: absolute;
    inset: -4px 0 auto;
    height: 4px;
    pointer-events: none;
    background: linear-gradient(90deg,#dff4ea,#73c59f 18%,#297354 32%,#d9f7c6 46%,#297354 60%,#123c2e 78%,#9ed8bf);
    background-size: 240% 100%;
    animation: studio-header-light 7s ease-in-out infinite alternate;
}
body .site-header,
body .site-header.is-compact {
    --nav-panel-top: var(--studio-header-height);
    --compact-nav-panel-top: var(--studio-header-height);
}
body .site-header .nav-wrap,
body .site-header.is-compact .nav-wrap,
body .studio-admin-header-inner {
    box-sizing: border-box;
    width: min(var(--studio-header-content),calc(100% - var(--studio-header-gutter) * 2 - env(safe-area-inset-left) - env(safe-area-inset-right)));
    max-width: var(--studio-header-content);
    height: calc(var(--studio-header-height) - 5px);
    min-height: calc(var(--studio-header-height) - 5px);
    margin-inline: auto;
    padding: 0;
    transition: none;
}
body .work-header,
body .studio-confirmation-header {
    padding-inline: max(calc(var(--studio-header-gutter) + env(safe-area-inset-left)),calc((100% - var(--studio-header-content)) / 2)) max(calc(var(--studio-header-gutter) + env(safe-area-inset-right)),calc((100% - var(--studio-header-content)) / 2));
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    gap: 12px;
}
body .site-header .nav-wrap > .brand,
body .work-header .work-brand,
body .studio-admin-header .studio-admin-brand,
body .studio-confirmation-header .studio-confirmation-brand {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
}
body .site-header .nav-wrap > .brand .site-brand-logo,
body .site-header.is-compact .nav-wrap > .brand .site-brand-logo,
body .work-header .work-brand img,
body .studio-admin-header .studio-admin-brand img,
body .studio-confirmation-header .studio-confirmation-brand img {
    display: block;
    height: var(--studio-logo-height);
    width: auto;
    max-width: none;
    object-fit: contain;
    aspect-ratio: 1583.72 / 800;
    transition: none;
}
body .work-header nav { flex-wrap: nowrap; gap: 14px; }
body .studio-admin-header-inner { grid-template-columns: auto 1fr auto; align-items: center; gap: 20px; }
body .studio-admin-navigation { grid-row: auto; grid-column: auto; }
body .studio-admin-utilities { grid-row: auto; grid-column: auto; }
.studio-admin-menu-button { display: none; }
.studio-admin-refresh-symbol { display: none; }
body #studioAdminNavigationStatus:not(:empty) {
    position: absolute; top: 100%; left: 0; right: 0;
    background: #fff; padding: 12px var(--studio-header-gutter);
    border-bottom: 1px solid #dce5df;
}
@media(max-width:1250px) {
    body .studio-admin-header-inner { grid-template-columns: auto 1fr; gap: 14px; }
    body .studio-admin-utilities { justify-self: end; align-items: center; }
    body .studio-admin-header .studio-admin-menu-button { display: inline-flex; align-items: center; justify-content: center; }
    body .studio-admin-navigation {
        display: none; position: absolute; top: 100%; left: 0; right: 0;
        padding: 18px var(--studio-header-gutter); margin: 0;
        background: #fafcf9; border-bottom: 1px solid #dce5df;
        box-shadow: 0 15px 30px #173c2d12;
        max-height: calc(100dvh - var(--studio-header-height)); overflow-y: auto;
        grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px;
    }
    body .studio-admin-header[data-menu-open] .studio-admin-navigation { display: grid; }
    body .studio-admin-navigation a { white-space: normal; }
}
@media(max-width:1060px) {
    :root { --studio-header-height: 74px; --studio-logo-height: 48px; --studio-header-gutter: 20px; }
}
@media(max-width:600px) {
    :root { --studio-header-height: 68px; --studio-logo-height: 44px; --studio-header-gutter: 16px; }
    body .work-header nav { gap: 10px; }
    body .work-header #workLogout { min-height: 40px; padding: 8px 12px; }
    body .studio-admin-utilities { gap: 7px; }
    body .studio-admin-utilities button { min-height: 40px; padding: 8px 10px; font-size: 12px; }
    .studio-admin-refresh-label { display: none; }
    .studio-admin-refresh-symbol { display: inline; }
    body .studio-confirmation-header > span { max-width: 170px; font-size: 11px; line-height: 1.5; text-align: right; }
}
@media(max-width:360px) {
    :root { --studio-logo-height: 38px; --studio-header-gutter: 12px; }
    body .work-header nav { gap: 7px; }
}
@keyframes studio-header-light { from { background-position: 0% 0; } to { background-position: 100% 0; } }
@media(prefers-reduced-motion:reduce) {
    body .site-header::before,body .work-header::before,body .studio-admin-header::before,body .studio-confirmation-header::before { animation: none; }
}