:root {
  --zenbuai-header-rail: 86.25rem;
  --zenbuai-header-gutter: 3rem;
  --zenbuai-header-gutter-mobile: 1.25rem;
  --zenbuai-header-height: 4.75rem;
  --zenbuai-header-height-mobile: 4.25rem;
  --zenbuai-header-content-gap: clamp(1.5rem, 3vw, 3.5rem);
  --zenbuai-header-service-gap: clamp(1.8rem, 4vw, 4.5rem);
  --zenbuai-logo-ink: #151515;
  --zenbuai-logo-red: #b9131e;
  --zenbuai-service-ink: #202020;
  --zenbuai-service-muted: #625f68;
  --zenbuai-academy-blue: #3157e8;
  --zenbuai-fde-red: #b9131e;
  --zenbuai-logo-font: "Noto Sans JP", "Hiragino Sans",
    "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
}

/*
 * ZenbuAI共通ヘッダー。幅・高さ・左右余白は公式トップのレールを正とする。
 * 各LP固有の.container/.wrap幅は本ヘッダーに持ち込まない。
 */
.zenbuai-global-header-inner.zenbuai-global-header-inner {
  display: grid !important;
  width: min(
    calc(100% - var(--zenbuai-header-gutter)),
    var(--zenbuai-header-rail)
  ) !important;
  min-height: var(--zenbuai-header-height) !important;
  align-items: center !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: var(--zenbuai-header-content-gap) !important;
  margin-inline: auto !important;
  padding-block: 0 !important;
}

.zenbuai-global-header-inner > * {
  min-width: 0;
}

.zenbuai-global-header-inner > :is(
    nav,
    .header-actions,
    .header__actions,
    .flow-header__right
  ) {
  justify-self: end;
}

/* ロゴは公式トップと同じ文字組みに固定する。 */
.zenbuai-home-brand.zenbuai-home-brand {
  display: grid !important;
  width: max-content !important;
  min-width: 0 !important;
  min-height: 0 !important;
  align-items: initial !important;
  align-content: initial !important;
  grid-template-columns: none !important;
  gap: 0.36rem !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--zenbuai-logo-ink) !important;
  background: transparent !important;
  font-family: var(--zenbuai-logo-font) !important;
  font-size: clamp(1.2rem, 2vw, 1.55rem) !important;
  font-weight: 900 !important;
  letter-spacing: -0.035em !important;
  line-height: 1 !important;
  text-align: left !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transform: none !important;
}

.zenbuai-home-brand.zenbuai-home-brand > span {
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  letter-spacing: inherit !important;
  line-height: 1 !important;
  text-align: left !important;
}

.zenbuai-home-brand.zenbuai-home-brand > small {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--zenbuai-logo-red) !important;
  font-family: var(--zenbuai-logo-font) !important;
  font-size: 0.6rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-align: justify !important;
  text-align-last: justify !important;
}

.zenbuai-home-brand.zenbuai-home-brand:focus-visible {
  outline: 3px solid rgba(185, 19, 30, 0.34) !important;
  outline-offset: 4px !important;
}

/* 同じヘッダー内のサービス導線は、ページ固有クラスで間隔を変えない。 */
.zenbuai-global-header-inner
  :is(.site-nav, .product-nav, .partner-nav, .flow-product-nav):has(
    > .zenbuai-service-link
  ),
  .zenbuai-global-header-inner .campaign-product-nav:has(
    > .zenbuai-service-link
  ) {
  display: flex !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  align-items: center !important;
  justify-content: flex-end !important;
  grid-column: auto !important;
  grid-row: auto !important;
  gap: var(--zenbuai-header-service-gap) !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
}

.zenbuai-service-link.zenbuai-service-link {
  position: relative;
  display: grid !important;
  width: max-content !important;
  min-width: max-content !important;
  min-height: 0 !important;
  align-content: center !important;
  gap: 0.4rem !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--zenbuai-service-ink) !important;
  background: transparent !important;
  font-family: var(--zenbuai-logo-font) !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transform: none !important;
}

.zenbuai-service-link.zenbuai-service-link > :first-child {
  display: block !important;
  color: inherit !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* 狭い幅でも日本語副表記を常に残す。 */
.zenbuai-service-link.zenbuai-service-link > :last-child {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: var(--zenbuai-service-muted) !important;
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

.zenbuai-service-link.zenbuai-service-link--academy:is(
    :hover,
    :focus-visible,
    :active,
    .is-selected,
    [aria-current="page"]
  ) > * {
  color: var(--zenbuai-academy-blue) !important;
}

.zenbuai-service-link.zenbuai-service-link--fde:is(
    :hover,
    :focus-visible,
    :active,
    .is-selected,
    [aria-current="page"]
  ) > * {
  color: var(--zenbuai-fde-red) !important;
}

.zenbuai-service-link.zenbuai-service-link:focus-visible {
  border-radius: 0.25rem;
  outline: 3px solid rgba(32, 32, 32, 0.16) !important;
  outline-offset: 4px !important;
}

.zenbuai-service-link.zenbuai-service-link::after {
  display: none !important;
}

.zenbuai-global-header-inner > .zfde-header-primary {
  display: flex !important;
  width: auto !important;
  min-height: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.zenbuai-global-header-inner > :is(.header__actions, .flow-header__right) {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 1.25rem;
}

@media (max-width: 760px) {
  :root {
    --zenbuai-header-content-gap: clamp(0.55rem, 3vw, 1rem);
    --zenbuai-header-service-gap: clamp(0.65rem, 4vw, 1.5rem);
  }

  .zenbuai-global-header-inner.zenbuai-global-header-inner {
    min-height: var(--zenbuai-header-height) !important;
  }

  .zenbuai-global-header-inner > :is(.header__actions, .flow-header__right) {
    display: flex !important;
    gap: 0 !important;
  }

  .zenbuai-global-header-inner
    > .header__actions
    > :is(.back, .theme-switch),
  .zenbuai-global-header-inner > .flow-header__right > .header-back {
    display: none !important;
  }
}

@media (max-width: 420px) {
  :root {
    --zenbuai-header-content-gap: clamp(0.45rem, 2.5vw, 0.75rem);
    --zenbuai-header-service-gap: clamp(0.55rem, 3vw, 0.9rem);
  }

  .zenbuai-global-header-inner.zenbuai-global-header-inner {
    width: min(
      calc(100% - var(--zenbuai-header-gutter-mobile)),
      var(--zenbuai-header-rail)
    ) !important;
    min-height: var(--zenbuai-header-height-mobile) !important;
  }

  /* 3ブランドの中心を等間隔に置き、長いZ-ACADEMYに引っ張られない配置にする。 */
  .zenbuai-global-header-inner.zenbuai-global-header-inner:has(
      .zenbuai-service-link--academy
    ) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;
  }

  .zenbuai-global-header-inner:has(.zenbuai-service-link--academy)
    > :is(.zfde-header-primary, .header__actions, .flow-header__right),
  .zenbuai-global-header-inner:has(.zenbuai-service-link--academy)
    :is(.site-nav, .product-nav, .partner-nav, .flow-product-nav):has(
      > .zenbuai-service-link
    ),
  .zenbuai-global-header-inner:has(.zenbuai-service-link--academy)
    .campaign-product-nav:has(
      > .zenbuai-service-link
    ) {
    display: contents !important;
  }

  .zenbuai-global-header-inner:has(.zenbuai-service-link--academy)
    :is(.zenbuai-home-brand, .zenbuai-service-link) {
    justify-self: center !important;
  }

  .zenbuai-global-header-inner:has(.zenbuai-service-link--academy)
    :is(.partner-nav__back, .back, .theme-switch, .header-back) {
    display: none !important;
  }

  /* Z-FDE固有の340px補正より共通レールを優先する。 */
  .zfde-site-header
    .zfde-header-inner.zenbuai-global-header-inner.zenbuai-global-header-inner {
    width: min(
      calc(100% - var(--zenbuai-header-gutter-mobile)),
      var(--zenbuai-header-rail)
    ) !important;
  }

  .zenbuai-home-brand.zenbuai-home-brand {
    font-size: 0.72rem !important;
  }

  .zenbuai-home-brand.zenbuai-home-brand > small {
    font-size: 0.48rem !important;
    letter-spacing: 0.06em !important;
  }

  .zenbuai-service-link.zenbuai-service-link {
    gap: 0.25rem !important;
  }

  .zenbuai-service-link.zenbuai-service-link > :first-child {
    font-size: 0.68rem !important;
    letter-spacing: 0.1em !important;
  }

  .zenbuai-service-link.zenbuai-service-link > :last-child {
    font-size: 0.54rem !important;
    letter-spacing: 0.01em !important;
  }
}