:root { --header: 74px; --gutter: clamp(20px, 5vw, 72px); --menu-orange: #f05b00; --menu-size: 64px; }
html { scroll-padding-top: calc(var(--header) + 20px); }
body.is-menu-open { overflow: hidden; }
body .site-shell {
  position: fixed; inset: 0 0 auto; z-index: 50; width: 100%; height: var(--header); min-height: var(--header);
  display: grid; grid-template-columns: minmax(0,1fr) 56px minmax(0,1fr); align-items: center; gap: 12px;
  padding: 0 var(--gutter); background: #080807; color: #fffefa; border: 0; border-radius: 0;
  box-shadow: none; backdrop-filter: none; transform: none; transition: background 220ms;
}
body .site-shell::before, body .site-shell::after { display: none; }
body .site-shell .brand-link { grid-column: 1; grid-row: 1; justify-self: start; display: inline-flex; align-items: baseline; gap: 12px; padding: 0; color: #fffefa; font: 600 25px/1.2 var(--font-ui); white-space: nowrap; text-decoration: none; }
body .site-shell .brand-link::before, body .site-shell .brand-link::after { display: none; }
body .site-shell .brand-link span { display: inline; }
body .site-shell .studio-label { color: #ff791b; font-size: 16px; font-weight: 700; }
body .site-shell .logo-dock { grid-column: 2; grid-row: 1; width: 56px; height: 52px; pointer-events: none; }
body .site-shell .menu-toggle { grid-column: 3; grid-row: 1; justify-self: end; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; min-height: 48px; padding: 12px; color: #fffefa; background: transparent; border: 0; border-radius: 0; cursor: pointer; }
body .site-shell .menu-toggle span, body .site-shell .menu-toggle span::before, body .site-shell .menu-toggle span::after { display: block; position: relative; width: 24px; height: 2px; background: currentColor; transition: transform 200ms; }
body .site-shell .menu-toggle span::before, body .site-shell .menu-toggle span::after { content: ''; position: absolute; left: 0; }
body .site-shell .menu-toggle span::before { top: -7px; }
body .site-shell .menu-toggle span::after { top: 7px; }
body .site-shell .menu-toggle[aria-expanded="true"] span { background: transparent; }
body .site-shell .menu-toggle[aria-expanded="true"] span::before { top: 0; transform: rotate(45deg); }
body .site-shell .menu-toggle[aria-expanded="true"] span::after { top: 0; transform: rotate(-45deg); }
body .site-shell .primary-nav { position: fixed; inset: var(--header) 0 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; padding: 24px var(--gutter) 100px; background: var(--menu-orange); border: 0; border-radius: 0; box-shadow: none; max-height: none; overflow-y: auto; visibility: hidden; opacity: 0; transform: translateY(-12px); transition: opacity 200ms, visibility 200ms, transform 200ms; }
body .site-shell .primary-nav a { flex: 0 0 auto; display: block; padding: 0; margin: 0; min-height: 0; border: 0; background: none; color: #fffefa; font: 600 var(--menu-size)/1.35 var(--font-ui) !important; text-decoration: none; white-space: normal; opacity: 1; transition: transform 200ms; }
body .site-shell .primary-nav a::after { display: none; }
body .site-shell .primary-nav a:hover { transform: translateX(12px); }
body .site-shell .home-menu-email { display: none; position: fixed; bottom: 24px; left: var(--gutter); right: var(--gutter); color: #fffefa; font: 700 20px/1.4 var(--font-ui); text-decoration: none; overflow-wrap: anywhere; }
body .site-shell.is-menu-open { z-index: 100; background: var(--menu-orange); }
body .site-shell.is-menu-open .studio-label { color: #fffefa; }
body .site-shell.is-menu-open .primary-nav { visibility: visible; opacity: 1; transform: none; }
body .site-shell.is-menu-open .home-menu-email { display: block; }
body .site-shell .text-word { opacity: 1 !important; }
body .site-shell :focus-visible { outline: 2px solid #fffefa; outline-offset: 5px; }
body .site-shell .brand-link .text-word { white-space: nowrap; }
.site-menu-fallback { display: flex; flex-wrap: wrap; gap: 12px 24px; padding: 16px var(--gutter); margin-top: var(--header); background: #080807; color: #fffefa; }
.site-menu-fallback a { color: inherit; }
@media (max-width: 680px) {
  :root { --header: 66px; --menu-size: 40px; }
  body .site-shell { grid-template-columns: minmax(0,1fr) 40px 48px; gap: 8px; }
  body .site-shell .brand-link { font-size: 18px; gap: 8px; }
  body .site-shell .studio-label { font-size: 13px; }
  body .site-shell .logo-dock { width: 40px; height: 44px; }
  body .site-shell .home-menu-email { font-size: 19px; }
}
@media (max-width: 370px) { body .site-shell .brand-link { font-size: 15px; } }
@media (max-height: 600px) {
  :root { --menu-size: 28px; }
  body .site-shell .primary-nav { justify-content: flex-start; padding-top: 12px; }
}
@media (prefers-reduced-motion: reduce) { body .site-shell, body .site-shell .primary-nav, body .site-shell .primary-nav a, body .site-shell .menu-toggle span::before, body .site-shell .menu-toggle span::after { transition: none; } }
