/* HOLDz content journey — information, guide, newsroom and records */
.page-hero-inner > p:not(.eyebrow) { max-width: 720px; }

.page-hero-commands {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 30px;
}

.page-hero-commands a,
.page-hero-commands button {
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-width: 180px;
  padding: 11px 16px;
  border: 1px solid rgba(255, 255, 255, .16);
  color: #e9edef;
  background: rgba(7, 10, 12, .58);
  backdrop-filter: blur(12px);
  text-align: left;
  transition: transform .2s var(--ease), border-color .2s ease, background .2s ease;
}

.page-hero-commands a:hover,
.page-hero-commands button:hover {
  transform: translateY(-2px);
  border-color: rgba(101, 231, 223, .45);
  background: rgba(101, 231, 223, .08);
}

.page-hero-commands small,
.page-hero-commands strong { display: block; }
.page-hero-commands small { color: #68727a; font: 750 7px/1 var(--mono); letter-spacing: .12em; }
.page-hero-commands strong { margin-top: 6px; font-size: 13px; line-height: 1; }
.page-hero-commands i { color: #65e7df; font-style: normal; }
.page-hero-commands .page-command-primary { border-color: rgba(240, 68, 68, .55); background: rgba(143, 23, 27, .74); }
.page-hero-commands .page-command-primary i { color: #fff; }

.content-tabs,
[data-page="detail"] .detail-tabs {
  position: sticky;
  z-index: 35;
  top: var(--header-h);
  max-width: 100vw;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  border-block: 1px solid rgba(255, 255, 255, .09);
  background: rgba(7, 10, 12, .94);
  backdrop-filter: blur(18px) saturate(1.2);
}

.content-tabs::-webkit-scrollbar,
[data-page="detail"] .detail-tabs::-webkit-scrollbar { display: none; }

.content-tabs-inner,
[data-page="detail"] .detail-tabs-inner {
  min-height: 64px;
  display: flex;
  align-items: stretch;
  overflow: visible;
  scrollbar-width: none;
}

.content-tabs-inner::-webkit-scrollbar,
[data-page="detail"] .detail-tabs-inner::-webkit-scrollbar { display: none; }

.content-tabs a,
.content-tabs button,
[data-page="detail"] .detail-tabs a {
  position: relative;
  flex: none;
  min-width: 104px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 0;
  border-right: 1px solid rgba(255, 255, 255, .075);
  color: #8d969e;
  background: transparent;
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
  transition: color .2s ease, background .2s ease;
}

.content-tabs a:hover,
.content-tabs button:hover,
.content-tabs a.is-active,
[data-page="detail"] .detail-tabs a:hover,
[data-page="detail"] .detail-tabs a.is-active {
  color: #fff;
  background: rgba(255, 255, 255, .035);
}

.content-tabs a.is-active::after,
[data-page="detail"] .detail-tabs a.is-active::after {
  content: "";
  position: absolute;
  right: 16px;
  bottom: -1px;
  left: 16px;
  height: 2px;
  background: #f04444;
}

.content-tabs .content-tab-action {
  min-width: 150px;
  margin-left: auto;
  border-left: 1px solid rgba(255, 255, 255, .075);
  color: #dffdfa;
  background: rgba(101, 231, 223, .055);
}

.content-tabs .content-tab-action span { margin-left: 10px; color: #65e7df; }

.rank-status[aria-busy="true"] { border-color: rgba(101, 231, 223, .24); }

@media (max-width: 840px) {
  .content-tabs,
  [data-page="detail"] .detail-tabs { top: var(--header-h); }
  .content-tabs-inner,
  [data-page="detail"] .detail-tabs-inner { width: max-content; min-width: 100%; }
  .content-tabs .content-tab-action { margin-left: 0; }
}

@media (max-width: 620px) {
  .page-hero-commands { display: grid; grid-template-columns: 1fr 1fr; }
  .page-hero-commands a,
  .page-hero-commands button { min-width: 0; width: 100%; }
  .content-tabs a,
  .content-tabs button,
  [data-page="detail"] .detail-tabs a { min-width: 94px; padding-inline: 14px; }
}
