.header.site-header.unified-header{box-sizing:border-box;height:96px;min-height:96px;margin:0;padding:0 4vw;position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:24px;background:#131313;border-bottom:1px solid #ffffff24;background-image:none;backdrop-filter:none}
.unified-header .brand{position:relative;display:block;flex-shrink:0;line-height:1;text-decoration:none}
.unified-header img.brand-logo{width:190px;height:auto;display:block}
.unified-header .header-areas{display:flex;align-items:center;gap:24px;margin:0 auto;font:500 13px 'DM Sans',sans-serif;width:auto;order:0}
.unified-header .header-areas a{display:block!important;color:#f2f0e7;text-decoration:none;white-space:nowrap;border:0;border-radius:0;padding:0;background:transparent;box-shadow:none;font:inherit;gap:0}
.unified-header .header-areas a[aria-current=page]{color:var(--accent)}
.unified-header .header-actions{display:flex;align-items:center;gap:16px;flex-shrink:0}
.unified-header .header-contact{display:block;margin:0;font:500 13px 'DM Sans',sans-serif;white-space:nowrap;border-bottom:1px solid #ffffff55;color:#f2f0e7;text-decoration:none;padding:8px 0}
.unified-header .motion{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 10px;border:1px solid #ffffff35;border-radius:6px;background:none;color:#f2f0e7;cursor:pointer}
.unified-header .motion b{font:500 10px 'DM Sans',sans-serif}
.unified-header .motion span{width:9px;height:10px;background:linear-gradient(to right,currentColor 0 3px,transparent 3px 6px,currentColor 6px);color:#963F50}
.unified-header .motion[aria-pressed=false] span{background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}
.unified-header .brand-symbol-layer{position:absolute;inset:0;clip-path:inset(0 71% 0 0);pointer-events:none;width:190px;height:auto}
.logo-dock-layer{position:fixed;inset:0;z-index:31;pointer-events:none;overflow:hidden}
.logo-dock-layer canvas{position:absolute;left:0;top:0;display:block;transform-origin:0 0;opacity:0}
.logo-header-stage{position:fixed;left:-10000px;top:0;width:400px;height:400px;pointer-events:none;visibility:hidden}
.logo-header-stage .hero,.logo-header-stage .sculpture{width:400px;height:400px;min-height:0;padding:0;margin:0}
@media(max-width:1100px){.header.site-header.unified-header{gap:16px;padding:0 24px}.unified-header .header-areas{gap:16px}.unified-header .motion b{display:none}.unified-header .header-actions{gap:10px}}
@media(max-width:800px){.header.site-header.unified-header{height:78px;min-height:78px;padding:0 20px}.unified-header .header-areas{display:none}.unified-header img.brand-logo,.unified-header .brand-symbol-layer{width:142px}.unified-header .header-contact{display:none}.unified-header .header-actions{margin-left:auto}}

/* A single baseline marker identifies the current area. */
.unified-header .header-areas a{position:relative}
.unified-header .header-areas a[aria-current=page]{text-decoration:none}
.unified-header .header-areas a::after{content:'';position:absolute;left:0;right:0;bottom:-9px;width:auto;height:1px;background:currentColor;opacity:0;pointer-events:none}
.unified-header .header-areas a[aria-current=page]::after{opacity:1}

/* Keep only the raster wordmark; the inline vector renders the symbol. */
.unified-header .brand-logo{clip-path:polygon(29% 0,100% 0,100% 61%,29% 61%)}
.unified-header .brand-subtitle{position:absolute;left:32%;right:0;top:61%;height:31%;display:grid;place-items:center;perspective:450px;overflow:hidden;color:var(--accent,#f2f0e7);font-family:'DM Sans',sans-serif;font-weight:700;font-size:14px;letter-spacing:.4em;text-transform:uppercase;line-height:1;pointer-events:none}
.unified-header .brand-subtitle>span{grid-area:1/1;display:block;backface-visibility:hidden;transform-origin:center;white-space:nowrap}
@media(max-width:800px){.unified-header .brand-subtitle{font-size:10.5px;letter-spacing:.4em}}
.unified-header .brand-lockup .brand-logo{clip-path:polygon(29% 0,100% 0,100% 61%,29% 61%)!important}
.unified-header .brand .brand-subtitle>span{font:inherit;letter-spacing:inherit;margin:0;padding:0}

.unified-header .brand-animated-symbol{position:absolute;left:0;top:0;height:100%;aspect-ratio:1;width:auto;border:0;pointer-events:none;z-index:3;background:#131313}

/* The header mark is inline: no iframe, WebGL context or loading gap. */
.unified-header .brand-vector-symbol{position:absolute;left:0;top:0;height:100%;width:auto;aspect-ratio:1;z-index:3;color:var(--header-symbol-color,#f2f0e7);pointer-events:none;transition:color .35s ease}
.brand-vector-symbol .symbol-part{color:#f2f0e7;fill:currentColor;fill-rule:evenodd;stroke:currentColor;stroke-width:1;stroke-linejoin:round}
.brand-vector-symbol .symbol-part-0{color:var(--header-symbol-color,#f2f0e7);transition:color .35s ease;animation:header-symbol-breathe 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes header-symbol-breathe{0%,60%,100%{opacity:.85;transform:scale(1)}75%{opacity:1;transform:scale(1.035)}85%{opacity:.9;transform:scale(1)}92%{opacity:1;transform:scale(1.02)}}
.still .brand-vector-symbol .symbol-part,.motion-off .brand-vector-symbol .symbol-part{animation:none}
@media(prefers-reduced-motion:reduce){.brand-vector-symbol .symbol-part{animation:none}}

/* Give the desktop navigation the same visual presence as the wordmark. */
@media(min-width:801px){
 .unified-header .header-areas{font-size:clamp(17px,1.2vw,22px);gap:clamp(22px,2vw,38px);line-height:1.4}
}
/* Each navigation item owns its area colour, independently of page state. */
.unified-header .header-areas a[data-area=studio]{--menu-color:#ff713d}
.unified-header .header-areas a[data-area=sessions]{--menu-color:#f65ca4}
.unified-header .header-areas a[data-area=raeume]{--menu-color:#963F50}
.unified-header .header-areas a[data-area=webdesign]{--menu-color:#ad92ff}
.unified-header .header-areas a[aria-current=page],.unified-header .header-areas a:hover,.unified-header .header-areas a:focus-visible{color:var(--menu-color)!important}

.unified-header .header-areas a:focus-visible,.unified-header .brand:focus-visible{outline:2px solid #f2f0e7;outline-offset:7px}
.unified-header .header-areas a{min-height:44px;display:flex!important;align-items:center}
.unified-header .header-areas a::after{bottom:0}

/* The shared control pauses the existing logo and illustration animations. */
.unified-header .motion[hidden]{display:none!important}
.unified-header .motion{min-width:44px;flex-shrink:0}
.unified-header .motion svg{display:block;flex-shrink:0}
.unified-header .motion .motion-play{display:none}
.unified-header .motion[data-motion-paused=true] .motion-pause{display:none}
.unified-header .motion[data-motion-paused=true] .motion-play{display:block}
.unified-header .motion:focus-visible{outline:2px solid #f2f0e7;outline-offset:4px}
.unified-header .motion:disabled{opacity:.65;cursor:default}
@media(max-width:400px){
 .header.site-header.unified-header,body.studio-premium-page .header.site-header.unified-header{padding-inline:12px;gap:8px}
 .header.site-header.unified-header img.brand-logo,.header.site-header.unified-header .brand-symbol-layer{width:136px}
 .unified-header .header-actions{gap:8px}
 .unified-header .area-launcher,.unified-header .header-home-close{width:44px;height:44px;flex-basis:44px}
}

/* The return action names its destination instead of resembling a window close. */
.unified-header .header-home-close{display:flex;align-items:center;justify-content:center;gap:6px;width:auto;flex:0 0 auto;min-height:44px;padding:0 11px;border-radius:6px;font:500 13px 'DM Sans',sans-serif}
.unified-header .header-home-close svg{flex:none}
.mobile-home-return{display:none}
@media print{.mobile-home-return{display:none!important}}
@media(max-width:800px){
 .unified-header .header-home-close{display:none}
 .mobile-home-return{display:flex;align-items:center;min-height:44px;padding:0 20px;background:#131313;color:#f2f0e7;border-bottom:1px solid #ffffff24}
 .mobile-home-return a{position:static;display:inline-flex;align-items:center;gap:7px;width:auto;height:auto;min-height:44px;border:0;border-radius:0;color:inherit;font:500 13px 'DM Sans',sans-serif;text-decoration:none;rotate:none}
 .mobile-home-return a:hover{background:none;rotate:none}
 .mobile-home-return svg{width:18px;height:18px}
 .mobile-home-return a:focus-visible{outline:2px solid currentColor;outline-offset:2px}
}
