/* ui10-owners: civic sales path. Prussian, Yale, powder, mint cream. */

html.hub-surface-partners main {
  display: flex;
  flex-direction: column;
}

html.hub-surface-partners .hub-switch { order: 1; }
html.hub-surface-partners .hub-hero { order: 2; }
html.hub-surface-partners .hub-partner-block { order: 3; }
html.hub-surface-partners .hub-path { order: 4; }
html.hub-surface-partners .hub-seats { order: 5; }
html.hub-surface-partners .hub-sales { order: 6; }
html.hub-surface-partners .offer-rail { order: 7; }
html.hub-surface-partners #hub-resources-section { order: 8; }

.hub-switch,
.hub-hero,
.hub-path,
.hub-seats,
.hub-sales,
.hub-partner-block,
#hub-resources-section {
  width: 100%;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

main {
  background: var(--home-page-bg, #f4f6f9);
  color: var(--home-navy, #0b2545);
}

main h1,
main h2,
main h3,
.seat-chart figcaption {
  color: #0B2545;
}

.hub-switch {
  display: flex;
  gap: 1.5rem;
  padding-top: 1.35rem;
  padding-bottom: 0.25rem;
}

.hub-switch a {
  color: #134074;
  font-weight: 700;
  text-decoration: none;
  padding-bottom: 0.2rem;
  border-bottom: 2px solid transparent;
}

html.hub-surface-owners .hub-switch a[href="/owners"],
html.hub-surface-partners .hub-switch a[href="/partners"] {
  color: #0B2545;
  border-bottom-color: #0B2545;
}

.hub-switch a:hover {
  text-decoration: none;
  border-bottom-color: var(--home-line-strong, #c9d4e1);
}

.hub-hero {
  text-align: left;
  padding-top: 1.25rem;
  padding-bottom: 0.5rem;
}

.hub-kicker {
  margin: 0 0 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #134074;
}

.hub-hero h1 {
  margin: 0 0 0.5rem;
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  line-height: 1.2;
  text-align: left;
}

#hub-tagline {
  margin: 0;
  max-width: 42rem;
  text-align: left;
  color: var(--home-muted, #5c6b7a);
  font-size: 1.05rem;
  line-height: 1.5;
}

.hub-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem 1.25rem;
  margin-top: 1.25rem;
}

.hub-text-link {
  color: #134074;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.hub-text-link:hover {
  color: #0B2545;
}

.hub-path {
  padding-top: 1.75rem;
  padding-bottom: 1.5rem;
}

.hub-path h2,
.hub-sales h2,
.hub-partner-block h2,
#hub-resources-section h2 {
  margin: 0 0 0.85rem;
  font-size: 1.2rem;
}

.hub-path-steps,
.hub-boards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.hub-step {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

.hub-step h3 {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  padding-bottom: 0.45rem;
  border-bottom: 2px solid var(--home-line-strong, #c9d4e1);
  font-size: 1.05rem;
  line-height: 1.3;
}

.hub-step h3 span {
  color: #134074;
  font-size: 1.35rem;
  font-weight: 700;
}

.hub-step p,
.hub-board p,
.hub-sales > p,
.hub-partner-block > p {
  margin: 0 0 0.75rem;
  color: var(--home-muted, #5c6b7a);
  font-size: 0.98rem;
  line-height: 1.5;
}

.hub-complete {
  background: var(--home-surface, #ffffff);
  border: 1px solid var(--home-line, #e3e8ef);
  border-radius: var(--home-radius, 12px);
  padding: 0.85rem 1rem;
  box-shadow: var(--home-shadow);
}

.hub-complete ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-complete li {
  margin: 0;
  padding: 0.15rem 0;
  color: #0B2545;
}

.hub-complete p {
  margin: 0.75rem 0 0;
}

.hub-seats {
  padding-bottom: 1.75rem;
}

.seat-chart {
  margin: 0 0 1.25rem;
  padding: 0;
}

.seat-chart figcaption {
  margin: 0 0 0.75rem;
  font-size: 1.2rem;
  font-weight: 700;
}

.seat-chart svg {
  display: block;
  width: 100%;
  max-width: 720px;
  height: auto;
}

.seat-chart-note {
  margin: 0.75rem 0 0;
  max-width: 42rem;
  color: var(--home-muted, #5c6b7a);
  font-size: 1.02rem;
  line-height: 1.5;
}

.hub-board {
  background: var(--home-surface, #ffffff);
  border: 1px solid var(--home-line, #e3e8ef);
  border-radius: var(--home-radius, 12px);
  padding: 1rem 1.05rem 1.1rem;
  box-shadow: var(--home-shadow);
}

.hub-board .hub-badge {
  display: inline-block;
  margin: 0 0 0.55rem;
  padding: 0.12rem 0.45rem;
  background: var(--home-blue, #134074);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.hub-board h3 {
  margin: 0 0 0.4rem;
  font-size: 1.12rem;
}

.hub-sales {
  padding-bottom: 1.75rem;
}

.hub-funnels {
  margin: 0;
}

.hub-funnel-row {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr);
  gap: 0.35rem 1rem;
  align-items: baseline;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--home-line, #e3e8ef);
}

.hub-funnels dt {
  margin: 0;
  font-weight: 700;
  color: #0B2545;
}

.hub-funnels dd {
  margin: 0;
}

.hub-funnels a {
  color: #134074;
}

html.hub-surface-partners .offer-rail,
.offer-rail {
  width: 100%;
  max-width: none;
  background: #0B2545;
}

.hub-partner-block {
  padding-top: 1.5rem;
  padding-bottom: 0.5rem;
}

.hub-loading {
  margin: 0 0 0.75rem;
  padding: 0;
  text-align: left;
  color: #0B2545;
}

.hub-links {
  display: block;
  max-width: none;
  margin: 0;
  padding: 0 0 0.5rem;
}

.hub-links[hidden],
#hub-resources-section[hidden],
.hub-loading[hidden] {
  display: none !important;
}

.hub-row {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr) auto;
  gap: 0.35rem 1rem;
  align-items: baseline;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--home-line, #e3e8ef);
  color: #0B2545;
  text-decoration: none;
  background: transparent;
  box-shadow: none;
}

.hub-row:hover {
  color: #134074;
  text-decoration: none;
}

.hub-row-title {
  font-weight: 700;
}

.hub-row-open {
  color: #134074;
  font-weight: 700;
}

#hub-resources-section {
  padding-top: 0.5rem;
  padding-bottom: 2rem;
}

.hub-resources {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.hub-resources a {
  padding: 0.4rem 0.75rem;
  background: #ffffff;
  border: 1px solid var(--home-line-strong, #c9d4e1);
  border-radius: 999px;
  color: #134074;
  text-decoration: none;
  box-shadow: none;
}

.hub-resources a:hover {
  border-color: #134074;
  text-decoration: none;
}

@media (min-width: 901px) {
  .site-nav a.nav-hub-link {
    display: none;
  }
}

@media (max-width: 720px) {
  .hub-switch,
  .hub-hero,
  .hub-path,
  .hub-seats,
  .hub-sales,
  .hub-partner-block,
  #hub-resources-section {
    padding-left: 16px;
    padding-right: 16px;
  }

  .hub-switch a {
    flex: 1;
  }

  .hub-hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .hub-hero-actions .btn-primary {
    display: block;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
  }

  .hub-path-steps,
  .hub-boards,
  .hub-funnel-row {
    grid-template-columns: 1fr;
  }

  .hub-row {
    grid-template-columns: 1fr auto;
  }

  .hub-row-use {
    grid-column: 1 / -1;
  }

  .offer-rail .offer-rail-inner {
    flex-direction: column;
    align-items: stretch;
  }

  .offer-rail .offer-rail-inner .btn {
    width: 100%;
    flex: none;
    text-align: center;
    box-sizing: border-box;
  }
}