.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: var(--z-header);
  height: var(--header-height-mobile);
  color: var(--color-text);
  transition: height var(--duration-normal) var(--ease-standard), background-color var(--duration-normal) var(--ease-standard), border-color var(--duration-normal) var(--ease-standard), box-shadow var(--duration-normal) var(--ease-standard);
}

.site-header.is-scrolled {
  height: var(--header-height-mobile-scrolled);
  border-bottom: var(--border-thin);
  background-color: var(--header-scrolled-bg);
  -webkit-backdrop-filter: blur(var(--header-backdrop-blur));
  backdrop-filter: blur(var(--header-backdrop-blur));
}

body.is-menu-open .site-header {
  z-index: calc(var(--z-menu) + var(--z-base));
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: calc(var(--container-max) + var(--container-padding-desktop) * 2);
  height: 100%;
  margin-inline: auto;
  padding-inline: var(--container-padding-mobile);
}

.site-header__logo { position: relative; z-index: calc(var(--z-menu) + var(--z-base)); flex: 0 1 auto; }
.site-header__logo img { width: auto; max-width: min(56vw, 240px); max-height: var(--header-logo-height-mobile); transition: max-height var(--duration-normal) var(--ease-standard); }
.global-nav, .site-header__contact { display: none; }

.menu-button {
  position: relative;
  z-index: calc(var(--z-menu) + var(--z-base));
  display: grid;
  flex: 0 0 var(--menu-button-size);
  width: var(--menu-button-size);
  height: var(--menu-button-size);
  padding: 0;
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--color-transparent);
  color: var(--color-text);
  cursor: pointer;
}

.menu-button__icon { position: relative; width: var(--menu-icon-size); height: var(--space-2); }
.menu-button__line { position: absolute; inset-inline: 0; top: 50%; height: var(--menu-line-width); background: currentcolor; transform-origin: center; transition: transform var(--duration-normal) var(--ease-in-out), opacity var(--duration-fast) var(--ease-standard); }
.menu-button__line:first-child { transform: translateY(calc(var(--space-1) / -2)); }
.menu-button__line:last-child { transform: translateY(calc(var(--space-1) / 2)); }
.menu-button[aria-expanded="true"] .menu-button__line:first-child { transform: rotate(45deg); }
.menu-button[aria-expanded="true"] .menu-button__line:last-child { transform: rotate(-45deg); }

.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: var(--z-menu);
  min-height: 100svh;
  background: var(--color-bg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(calc(var(--space-1) * -1));
  transition: opacity var(--duration-normal) var(--ease-standard), transform var(--duration-normal) var(--ease-in-out), visibility 0s linear var(--duration-normal);
}

.mobile-menu.is-open { opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s; }
.mobile-menu__inner { display: flex; flex-direction: column; min-height: 100svh; padding: calc(var(--header-height-mobile) + var(--space-3)) var(--container-padding-mobile) var(--space-5); overflow-y: auto; }
.mobile-menu__list { border-top: var(--border-thin); }
.mobile-menu__list a { display: flex; align-items: center; min-height: var(--menu-item-min-height); border-bottom: var(--border-thin); font-size: 18px; font-weight: var(--font-weight-medium); letter-spacing: 0.02em; }
.mobile-menu__contact { display: grid; min-height: var(--menu-item-min-height); margin-top: var(--space-4); padding-inline: var(--space-3); place-items: center; border-radius: var(--radius-md); background: var(--color-button); color: var(--color-white); font-weight: var(--font-weight-semibold); }

@media (max-width: 359px) {
  .site-header__inner, .mobile-menu__inner { padding-inline: var(--space-2); }
}

@media (min-width: 992px) {
  .site-header { height: var(--header-height-desktop); }
  .site-header.is-scrolled { height: var(--header-height-desktop-scrolled); }
  .site-header__inner { gap: var(--space-3); padding-inline: var(--container-padding-desktop); }
  .site-header__logo img { max-width: 300px; max-height: var(--header-logo-height-desktop); }
  .site-header.is-scrolled .site-header__logo img { max-height: var(--header-logo-height-desktop-scrolled); }
  .global-nav { display: block; margin-left: auto; }
  .global-nav__list { display: flex; align-items: center; gap: var(--nav-gap-laptop); }
  .global-nav a { position: relative; display: inline-flex; align-items: center; min-height: var(--header-contact-height); font-size: 16px; font-weight: var(--font-weight-medium); line-height: 1.4; letter-spacing: 0.02em; transition: color var(--duration-normal) var(--ease-standard); }
  .global-nav a::after { position: absolute; inset: auto 0 5px; height: 2px; background: var(--color-button); content: ""; transform: scaleX(0); transform-origin: right; transition: transform var(--duration-normal) var(--ease-standard); }
  .global-nav a:hover, .global-nav a:focus-visible { color: var(--color-button); }
  .global-nav a:hover::after, .global-nav a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
  .site-header__contact { display: grid; flex: 0 0 auto; min-height: var(--header-contact-height); padding-inline: var(--header-contact-padding-inline); place-items: center; border-radius: var(--radius-md); background: var(--color-button); color: var(--color-white); font-size: 16px; font-weight: var(--font-weight-semibold); transition: background-color var(--duration-normal) var(--ease-standard); }
  .site-header__contact:hover, .site-header__contact:focus-visible { background: var(--color-button-hover); }
  .menu-button, .mobile-menu { display: none; }
}

@media (min-width: 1200px) {
  .global-nav__list { gap: var(--nav-gap-desktop); }
}