:root {
  --delta-topbar-height: 54px;
  --delta-topbar-edge: 24px;
  --delta-topbar-bg-opacity: 0;
}

.delta-topbar {
  position: fixed !important;
  top: 0;
  left: 50% !important;
  right: auto !important;
  width: 100%;
  height: var(--delta-topbar-height) !important;
  min-height: var(--delta-topbar-height);
  padding: 0 var(--delta-topbar-edge) !important;
  box-sizing: border-box;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform: translate3d(-50%, 0, 0);
  overflow: hidden;
  border-radius: 999px;
  background-color: transparent;
  box-shadow: none;
  z-index: 1900 !important;
  isolation: isolate;
  pointer-events: none;
  color: inherit;
  will-change: width, top, background-color;
}

.delta-topbar::before {
  content: none;
  display: none;
}

.delta-topbar > * {
  pointer-events: auto;
}

.delta-topbar > .global-menu-open,
.delta-topbar > .delta-topbar-menu {
  position: absolute !important;
  top: 15px !important;
  left: var(--delta-topbar-edge) !important;
  min-width: 64px !important;
  width: auto !important;
  height: 24px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 50px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: rgb(128 128 128 / 18%) !important;
  color: currentColor !important;
  font: 600 12px/1 Pretendard, system-ui, sans-serif !important;
  letter-spacing: -.02em !important;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: color .32s ease, background-color .32s ease, opacity .22s ease;
}

.delta-topbar > .wordmark,
.delta-topbar > .method-wordmark,
.delta-topbar > .about-wordmark,
.delta-topbar > .editorial-wordmark,
.delta-topbar > .case-wordmark {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  margin: 0 !important;
  transform: translate3d(-50%, -50%, 0) !important;
  color: currentColor !important;
  font-size: 18px !important;
  font-weight: 780 !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
  text-decoration: none;
  white-space: nowrap;
  transition: color .32s ease;
}

.delta-topbar > .case-wordmark img {
  display: none !important;
}

.delta-topbar > .case-nav {
  display: none !important;
}

.delta-topbar-meta {
  position: absolute;
  top: 15px;
  right: var(--delta-topbar-edge);
  height: 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  color: currentColor;
  transition: color .32s ease;
}

.delta-topbar-clock {
  min-width: 88px;
  font: 650 11px/1 Pretendard, system-ui, sans-serif;
  letter-spacing: -.015em;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.delta-topbar-mail {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  background: rgb(128 128 128 / 18%);
  text-decoration: none;
  transition: color .25s ease, background-color .25s ease, transform .25s ease;
}

.delta-topbar-mail:hover,
.delta-topbar-mail:focus-visible {
  background: rgb(128 128 128 / 32%);
  transform: translateY(-1px);
}

.delta-topbar-mail svg {
  width: 12px;
  height: 12px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.delta-topbar.is-topbar-morphed {
  color: #fbfaf7 !important;
}

body:has(.hero.hero--dark:not(.is-case)) > .delta-topbar--home {
  color: #fbfaf7 !important;
}

body:has(.hero.is-case) > .delta-topbar--home {
  color: var(--brand-ink, #10282b) !important;
}

.delta-topbar.is-topbar-morphed > .global-menu-open,
.delta-topbar.is-topbar-morphed > .delta-topbar-menu,
.delta-topbar.is-topbar-morphed .delta-topbar-mail {
  background: transparent !important;
}

body.global-menu-active > .delta-topbar {
  opacity: 0;
  pointer-events: none;
}

body.global-menu-active > .delta-topbar * {
  pointer-events: none;
}

@media (max-width: 767px) {
  :root {
    --delta-topbar-edge: 14px;
  }

  .delta-topbar > .global-menu-open,
  .delta-topbar > .delta-topbar-menu {
    left: var(--delta-topbar-edge) !important;
    min-width: 60px !important;
    padding-inline: 14px !important;
  }

  .delta-topbar > .wordmark,
  .delta-topbar > .method-wordmark,
  .delta-topbar > .about-wordmark,
  .delta-topbar > .editorial-wordmark,
  .delta-topbar > .case-wordmark {
    font-size: 15px !important;
  }

  .delta-topbar-meta {
    right: var(--delta-topbar-edge);
    gap: 8px;
  }

  .delta-topbar-clock {
    display: none;
  }

  .delta-topbar {
    will-change: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .delta-topbar,
  .delta-topbar::before,
  .delta-topbar * {
    transition: none !important;
  }
}