/* HustleLedger opportunity directory. All rules are scoped to this screen. */
.ho-page {
  --ho-ink: #eaf5f3;
  --ho-muted: #a5babd;
  --ho-line: #28434b;
  --ho-panel: #11232b;
  --ho-deep: #09151c;
  --ho-aqua: #58e1d0;
  --ho-coral: #e5a77b;
  max-width: 1180px;
  margin-inline: auto;
  padding: clamp(22px, 4vw, 48px) 0 58px;
  color: var(--ho-ink);
}
.ho-page *, .ho-page *::before, .ho-page *::after { box-sizing: border-box; }
.ho-page :focus-visible { outline: 2px solid var(--ho-aqua); outline-offset: 3px; }
.ho-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .43fr);
  align-items: end;
  gap: 28px;
  padding: 10px 0 28px;
  border-bottom: 1px solid var(--ho-line);
}
.ho-kicker, .ho-section-label {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 12px;
  color: var(--ho-aqua);
  font: 500 10px var(--wp-mono, ui-monospace, monospace);
  letter-spacing: .11em;
  text-transform: uppercase;
}
.ho-kicker::before { width: 7px; height: 7px; border-radius: 50%; background: var(--ho-aqua); content: ""; }
.ho-hero h1 {
  max-width: 780px;
  margin: 0;
  font: 700 clamp(38px, 6.2vw, 70px)/.98 var(--wp-display, sans-serif);
  letter-spacing: -.06em;
  text-wrap: balance;
}
.ho-hero h1 em { color: var(--ho-aqua); font-style: normal; }
.ho-intro { max-width: 670px; margin: 17px 0 0; color: #b7c8ca; font-size: 14px; line-height: 1.7; }
.ho-hero-aside {
  position: relative;
  min-height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 15px 17px;
  overflow: hidden;
  border: 1px solid #31535a;
  background: linear-gradient(145deg, #133039, #0d1c23 75%);
}
.ho-hero-aside::after {
  position: absolute;
  top: 0;
  right: 16px;
  width: 1px;
  height: 100%;
  background: #58e1d033;
  content: "";
}
.ho-index { color: #91a9ad; font: 10px var(--wp-mono, ui-monospace, monospace); letter-spacing: .08em; }
.ho-aside-number { margin: 9px 0 0; color: var(--ho-aqua); font: 600 42px/.9 var(--wp-display, sans-serif); letter-spacing: -.07em; }
.ho-aside-caption { margin: 8px 0 0; color: #b2c4c5; font-size: 10px; line-height: 1.5; }
.ho-boundary {
  display: flex;
  gap: 11px;
  margin: 18px 0 27px;
  padding: 13px 15px;
  border-left: 2px solid var(--ho-aqua);
  background: #10252c;
}
.ho-boundary-mark { flex: 0 0 auto; color: var(--ho-aqua); font: 11px var(--wp-mono, ui-monospace, monospace); }
.ho-boundary p { margin: 0; color: #afc2c4; font-size: 11px; line-height: 1.65; }
.ho-boundary strong { color: var(--ho-ink); }
.ho-directory { padding: 0 0 34px; }
.ho-discovery-feed {
  min-width: 0;
  margin: 14px 0 19px;
  padding: 16px;
  border: 1px solid #29464d;
  background: linear-gradient(145deg, #10242c, #0c1a21);
}
.ho-discovery-feed .ho-discovery-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.ho-discovery-feed .ho-discovery-head .ho-section-label { margin-bottom: 6px; }
.ho-discovery-feed .ho-discovery-head h3 { margin: 0; font: 600 20px/1.2 var(--wp-display, sans-serif); }
.ho-discovery-feed .ho-discovery-head p:not(.ho-section-label) { margin: 5px 0 0; color: #a5babd; font-size: 11px; line-height: 1.5; }
.ho-discovery-feed .ho-discovery-updated { flex: 0 0 auto; color: #8fa7aa; font: 9px/1.5 var(--wp-mono, ui-monospace, monospace); text-align: right; }
.ho-discovery-feed .ho-discovery-filters { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0 6px; }
.ho-discovery-feed .ho-discovery-filters button {
  min-height: 34px; padding: 6px 11px; border: 1px solid #34545b;
  background: #10232b; color: #c1d2d2; font: 10px var(--wp-mono, ui-monospace, monospace);
  cursor: pointer;
}
.ho-discovery-feed .ho-discovery-filters button[aria-pressed="true"] { border-color: var(--ho-aqua); background: #143437; color: #a3f4e6; }
.ho-discovery-feed .ho-discovery-filters button:focus-visible { outline: 2px solid var(--ho-aqua); outline-offset: 2px; }
.ho-jobs-tools { display: grid; gap: 5px; margin-top: 10px; }
.ho-jobs-search-label { color: #9fb3b5; font: 9px var(--wp-mono, ui-monospace, monospace); }
.ho-jobs-search { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid #34545b; background: #09171d; color: var(--ho-ink); font: 11px var(--wp-display, sans-serif); }
.ho-jobs-search:focus-visible { outline: 2px solid var(--ho-aqua); outline-offset: 2px; }
.ho-jobs-tools .ho-discovery-filters { margin: 5px 0 3px; }
.ho-discovery-feed .ho-discovery-explainer, .ho-discovery-feed .ho-source-caveat { margin: 7px 0 12px; color: #8fa7aa; font-size: 10px; line-height: 1.5; }
.ho-discovery-feed .ho-discovery-group { min-width: 0; margin-top: 16px; }
.ho-discovery-feed .ho-discovery-subhead { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.ho-discovery-feed .ho-discovery-subhead h4 { margin: 0; color: #eaf5f3; font-size: 12px; }
.ho-discovery-feed .ho-discovery-subhead > span { color: var(--ho-aqua); font: 9px var(--wp-mono, ui-monospace, monospace); }
.ho-discovery-feed .ho-discovery-group .ho-source-caveat { margin: 4px 0 8px; }
.ho-discovery-feed .ho-discovery-list { display: grid; min-width: 0; gap: 5px; }
.ho-discovery-feed .ho-discovery-list > [hidden],
.ho-opportunity-list > [hidden],
.ho-list-more[hidden] { display: none !important; }
.ho-list-more { margin-top: 9px; min-height: 38px; }
.ho-list-more:not([hidden]) { display: inline-flex; }
.ho-discovery-feed .ho-discovery-list[data-empty="true"]::after { content: "No matching public-source items are available."; padding: 8px 0; color: #8fa7aa; font-size: 10px; }
.ho-discovery-feed .ho-discovery-card[hidden] { display: none !important; }
.ho-discovery-feed .ho-discovery-card .ho-card-summary { min-height: 48px; padding: 9px 12px; }
.ho-discovery-feed .ho-discovery-card .ho-card-main { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 12px; }
.ho-discovery-feed .ho-discovery-title { min-width: 0; color: var(--ho-ink); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.ho-discovery-feed .ho-discovery-type { flex: 0 0 auto; color: var(--ho-aqua); font: 8px/1.4 var(--wp-mono, ui-monospace, monospace); text-align: right; }
.ho-discovery-feed .ho-discovery-content { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 10px 14px 14px; }
.ho-discovery-feed .ho-discovery-summary { margin: 0; color: #b5c6c7; font-size: 11px; line-height: 1.55; }
.ho-discovery-feed .ho-discovery-facts { gap: 8px 14px; }
.ho-discovery-feed .ho-video-play { width: fit-content; }
.ho-discovery-feed .ho-video-player { width: min(560px, 100%); aspect-ratio: 16/9; overflow: hidden; }
.ho-discovery-feed .ho-video-player iframe { width: 100%; height: 100%; border: 0; }
.ho-discovery-feed .ho-discovery-card .ho-track-link { width: fit-content; min-height: 34px; }
.ho-discovery-feed .ho-source-attribution { margin: 9px 0 0; color: #8fa7aa; font-size: 9px; line-height: 1.5; }
.ho-discovery-feed .ho-source-attribution a { color: var(--ho-aqua); text-underline-offset: 3px; }
.ho-jobs-group .ho-discovery-list[data-empty="true"]::after { content: "No jobs match these filters."; }
.ho-jobs-group .ho-discovery-updated { margin: 5px 0 8px; }

.ho-directory-head { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.ho-section-label { margin-bottom: 7px; }
.ho-section-heading { margin: 0; font: 600 clamp(23px, 3.2vw, 33px)/1.1 var(--wp-display, sans-serif); letter-spacing: -.045em; }
.ho-directory-note { margin: 6px 0 0; color: #8fa7aa; font-size: 10px; line-height: 1.5; }
.ho-count { flex: 0 0 auto; color: #9bb1b4; font: 10px var(--wp-mono, ui-monospace, monospace); text-align: right; }
.ho-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: end;
  gap: 15px;
  margin-bottom: 18px;
  padding: 15px;
  border: 1px solid var(--ho-line);
  background: #0e1e26;
}
.ho-filter-set { min-width: 0; margin: 0; padding: 0; border: 0; }
.ho-search label, .ho-filter-label { display: block; margin: 0 0 6px; color: #dce9e8; font-size: 10px; font-weight: 700; }
.ho-search input {
  display: block;
  width: 100%;
  min-height: 43px;
  padding: 9px 11px;
  border: 1px solid #3e5a62;
  border-radius: 2px;
  background: #09171d;
  color: var(--ho-ink);
  font: 13px var(--wp-display, sans-serif);
}
.ho-search input::placeholder { color: #789196; }
.ho-search input:focus { border-color: var(--ho-aqua); outline: 0; box-shadow: 0 0 0 2px #58e1d022; }
.ho-filter-group { display: flex; flex-wrap: wrap; gap: 7px; }
.ho-check {
  position: relative;
  display: inline-flex;
  min-height: 39px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border: 1px solid #355159;
  color: #b8c9ca;
  font-size: 10px;
  cursor: pointer;
}
.ho-check:has(input:checked) { border-color: #438b83; background: #153138; color: #b9f6ec; }
.ho-check input { width: 14px; height: 14px; margin: 0; accent-color: var(--ho-aqua); }
.ho-filter-actions { display: flex; flex-wrap: wrap; grid-column: 1 / -1; align-items: center; justify-content: space-between; gap: 10px; padding-top: 11px; border-top: 1px solid #29434a; }
.ho-filter-note { margin: 0; color: #8fa7aa; font-size: 10px; line-height: 1.5; }
.ho-filter-buttons { display: flex; gap: 8px; }
.ho-button {
  display: inline-flex;
  min-height: 39px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 13px;
  border: 1px solid #527078;
  border-radius: 2px;
  background: transparent;
  color: var(--ho-ink);
  font: 700 10px var(--wp-display, sans-serif);
  text-decoration: none;
  cursor: pointer;
}
.ho-button:hover { border-color: var(--ho-aqua); color: var(--ho-aqua); }
.ho-button--primary { border-color: var(--ho-aqua); background: var(--ho-aqua); color: #06201f; }
.ho-button--primary:hover { background: #8cf0e3; color: #06201f; }
.ho-opportunity-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.ho-track-link { display: inline-flex; width: fit-content; min-height: 42px; align-items: center; gap: 9px; padding: 0 13px; border: 1px solid #54b9ad; color: #baf4e9; text-decoration: none; font-size: 12px; font-weight: 700; }
.ho-track-link:hover, .ho-track-link:focus-visible { background: #143a3b; outline: 2px solid #58e1d0; outline-offset: 2px; }
.ho-card { min-width: 0; border: 1px solid var(--ho-line); background: #0e1e26; }
.ho-card[open] { border-color: #3c6868; }
.ho-card-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 10px 14px;
  cursor: pointer;
  list-style: none;
}
.ho-card-summary::-webkit-details-marker { display: none; }
.ho-card-main { min-width: 0; }
.ho-card-main h3 { margin: 0; color: var(--ho-ink); font: 600 16px/1.3 var(--wp-display, sans-serif); letter-spacing: -.02em; overflow-wrap: break-word; }
.ho-card-meta { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 6px; }
.ho-tag { display: inline-flex; align-items: center; min-height: 23px; padding: 0 7px; border: 1px solid #34545b; color: #a9c3c2; font: 9px var(--wp-mono, ui-monospace, monospace); letter-spacing: .015em; }
.ho-tag--cost { border-color: #47766e; color: #a3f4e6; }
.ho-expand { justify-self: end; width: 11px; height: 11px; border-right: 2px solid var(--ho-aqua); border-bottom: 2px solid var(--ho-aqua); transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; }
.ho-card[open] .ho-expand { transform: rotate(225deg) translate(-2px, -1px); }
.ho-card-content { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(240px, .9fr); gap: 20px; padding: 0 18px 19px 66px; }
.ho-info-block { min-width: 0; padding-top: 14px; border-top: 1px solid #29464d; }
.ho-info-block h4 { margin: 0 0 9px; color: var(--ho-aqua); font: 500 9px var(--wp-mono, ui-monospace, monospace); letter-spacing: .1em; text-transform: uppercase; }
.ho-info-block p { margin: 0; color: #b5c6c7; font-size: 11px; line-height: 1.65; }
.ho-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin: 0; }
.ho-facts > div { min-width: 0; }
.ho-facts dt { margin-bottom: 4px; color: #829da1; font: 9px var(--wp-mono, ui-monospace, monospace); text-transform: uppercase; letter-spacing: .06em; }
.ho-facts dd { margin: 0; color: #d5e2e0; font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.ho-range-note { color: #8fa7aa; font-size: 9px; }
.ho-steps { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; counter-reset: ho-steps; }
.ho-steps li { position: relative; min-height: 25px; padding-left: 28px; color: #b5c6c7; font-size: 11px; line-height: 1.55; counter-increment: ho-steps; }
.ho-steps li::before { position: absolute; left: 0; top: 0; display: grid; width: 19px; height: 19px; place-items: center; border: 1px solid #47746e; color: var(--ho-aqua); font: 9px var(--wp-mono, ui-monospace, monospace); content: counter(ho-steps, decimal-leading-zero); }
.ho-video-block { grid-column: 1 / -1; }
.ho-video-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 10px; }
.ho-video { min-width: 0; border: 1px solid #29464d; background: #0a171d; }
.ho-video-media { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border: 0; background: #071116; color: var(--ho-ink); cursor: pointer; }
.ho-video-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ho-play-mark { position: absolute; inset: 50% auto auto 50%; display: grid; width: 42px; height: 32px; place-items: center; transform: translate(-50%, -50%); border: 1px solid #ffffffaa; border-radius: 7px; background: #092027dd; color: #d7fffa; font-size: 13px; }
.ho-video-media:hover .ho-play-mark { background: #58e1d0; color: #06201f; }
.ho-video-media iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ho-video-caption { padding: 9px 10px 10px; }
.ho-video-caption strong { display: block; color: #dce8e7; font: 600 11px/1.4 var(--wp-display, sans-serif); }
.ho-video-caption span { display: block; margin-top: 3px; color: #8fa6aa; font: 9px var(--wp-mono, ui-monospace, monospace); }
.ho-video-caption a { display: inline-block; margin-top: 7px; color: var(--ho-aqua); font-size: 10px; text-underline-offset: 3px; }
.ho-video-status { margin: 9px 0 0; color: #98acae; font-size: 10px; line-height: 1.55; }
.ho-video-status[role="alert"] { color: #ffc0ae; }
.ho-discovery { display: flex; align-items: start; gap: 8px; margin-top: 11px; padding: 10px; border: 1px solid #315159; background: #10252c; }
.ho-discovery p { margin: 0; color: #a9bdbe; font-size: 10px; line-height: 1.55; }
.ho-discovery button { flex: 0 0 auto; padding: 0; border: 0; background: none; color: var(--ho-aqua); font: 700 10px var(--wp-display, sans-serif); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.ho-empty { padding: 27px 20px; border: 1px dashed #3c5960; text-align: center; background: #0d1c23; }
.ho-empty-mark { color: var(--ho-aqua); font: 26px var(--wp-mono, ui-monospace, monospace); }
.ho-empty h3 { margin: 8px 0 5px; font: 600 16px var(--wp-display, sans-serif); }
.ho-empty p { max-width: 430px; margin: auto; color: var(--ho-muted); font-size: 11px; line-height: 1.6; }
.ho-empty a { display: inline-block; margin-top: 12px; color: var(--ho-aqua); font-size: 11px; }
.ho-pagination-note { margin: 12px 0 0; color: #81999e; font: 9px var(--wp-mono, ui-monospace, monospace); text-align: right; }
.ho-tracking { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 19px; padding: 17px 19px; border: 1px solid #31545a; background: #10252c; }
.ho-tracking h2 { margin: 0; font: 600 16px var(--wp-display, sans-serif); }
.ho-tracking p { margin: 4px 0 0; color: #a1b7b9; font-size: 10px; line-height: 1.5; }
.ho-tracking a { flex: 0 0 auto; color: var(--ho-aqua); font-size: 11px; font-weight: 700; text-underline-offset: 4px; }
.ho-footnote { margin: 18px 0 0; color: #81999e; font-size: 9px; line-height: 1.6; }
@media (max-width: 760px) {
  .ho-hero { grid-template-columns: 1fr; gap: 10px; padding-bottom: 17px; }
  .ho-hero-aside { display: none; }
  .ho-intro { margin-top: 10px; font-size: 12px; line-height: 1.5; }
  .ho-kicker { margin-bottom: 8px; }
  .ho-hero h1 { font-size: clamp(32px, 9vw, 42px); }
  .ho-aside-number { font-size: 34px; }
  .ho-filters { grid-template-columns: 1fr; }
  .ho-filter-actions { grid-column: auto; }
  .ho-card-content { grid-template-columns: 1fr; gap: 12px; padding-left: 18px; }
  .ho-video-block { grid-column: auto; }
}
@media (max-width: 560px) {
  .ho-page { padding-top: 18px; }
  .ho-directory-head { align-items: flex-start; flex-direction: column; gap: 7px; }
  .ho-count { text-align: left; }
  .ho-discovery-feed { padding: 11px; }
  .ho-discovery-feed .ho-discovery-head { align-items: flex-start; flex-direction: column; gap: 4px; }
  .ho-discovery-feed .ho-discovery-updated { text-align: left; }
  .ho-discovery-feed .ho-discovery-card .ho-card-main { align-items: flex-start; flex-direction: column; gap: 2px; }
  .ho-discovery-feed .ho-discovery-type { text-align: left; }
  .ho-card-summary { grid-template-columns: minmax(0, 1fr) 16px; gap: 9px; min-height: 48px; padding: 10px 12px; }
  .ho-card-main h3 { font-size: 14px; }
  .ho-card-content { padding-inline: 12px; }
  .ho-filter-actions, .ho-tracking { align-items: flex-start; flex-direction: column; }
  .ho-filter-buttons { width: 100%; }
  .ho-filter-buttons .ho-button { flex: 1; }
  .ho-tracking a { min-height: 40px; display: inline-flex; align-items: center; }
  .ho-check { flex: 1 1 calc(50% - 7px); }
}
@media (prefers-reduced-motion: reduce) {
  .ho-page *, .ho-page *::before, .ho-page *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}