/* ============================================================
   LABBRARY PROVIDER DIRECTORY STYLESHEET
   Additive layer for the provider directory (template 25) and
   the provider-identity upgrade to the generic provider
   profile (template 16). Loads after the approved base,
   expansion, and dynamic stylesheets and redefines no approved
   selector. All classes begin with intelle-.

   Sections
   01 Directory hero
   02 Search, filters, and sort toolbar
   03 Applied filters and live count
   04 Editorial provider grid
   05 Provider cards
   06 Logo stage and typographic fallback
   07 Pagination
   08 Profile identity upgrade
   09 Large-catalog toolbar on profiles
   10 Reduced motion and print
   ============================================================ */

/* ------------------------------------------------------------
   01 DIRECTORY HERO
   Editorial and information dense: an asymmetric two-column
   band, counts set in tabular figures inside a fact ledger,
   never a centered SaaS hero or a row of equal metric cards.
   ------------------------------------------------------------ */
.intelle-pdir-hero {
  background:
    radial-gradient(110% 70% at 92% -12%, rgba(141, 124, 255, 0.12), transparent 55%),
    var(--intelle-ink);
  color: var(--intelle-canvas);
  padding: 46px 0 42px;
}
.intelle-pdir-hero__inner {
  display: grid;
  gap: 26px;
}
@media (min-width: 900px) {
  .intelle-pdir-hero__inner {
    grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr);
    align-items: end;
    gap: 48px;
  }
}
.intelle-pdir-hero__title {
  margin: 10px 0 0;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.08;
  font-size: clamp(1.8rem, 4.4vw, 2.7rem);
  max-width: 20ch;
}
.intelle-pdir-hero__lede {
  margin: 16px 0 0;
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.65;
  color: rgba(247, 244, 237, 0.72);
  max-width: 56ch;
}
.intelle-pdir-hero__ledger {
  border-left: 3px solid rgba(247, 244, 237, 0.18);
  padding-left: 20px;
  display: grid;
  gap: 12px;
}
.intelle-pdir-hero__ledger dl {
  margin: 0;
  display: grid;
  gap: 8px;
}
.intelle-pdir-hero__ledger div {
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.intelle-pdir-hero__ledger dt {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: rgba(247, 244, 237, 0.6);
}
.intelle-pdir-hero__ledger dd {
  margin: 0 0 0 auto;
  font-weight: 800;
  font-size: 1.15rem;
  font-variant-numeric: tabular-nums;
}
.intelle-pdir-hero__rule {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.55;
  color: rgba(247, 244, 237, 0.62);
}

/* ------------------------------------------------------------
   02 SEARCH, FILTERS, AND SORT TOOLBAR
   A real GET form: named controls WordPress can render and a
   server can read. JavaScript only enhances.
   ------------------------------------------------------------ */
.intelle-pdir-toolbar {
  display: grid;
  gap: 14px;
}
.intelle-pdir-search {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.intelle-pdir-search .intelle-search { flex: 1 1 260px; margin: 0; }
.intelle-pdir-filters {
  display: grid;
  gap: 12px;
}
.intelle-pdir-filters[hidden] { display: none; }
@media (min-width: 760px) {
  .intelle-pdir-filters[hidden] { display: grid !important; }
  .intelle-pdir-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; }
  .intelle-pdir-filters-toggle { display: none; }
}
.intelle-pdir-field { display: grid; gap: 6px; }
.intelle-pdir-field label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--intelle-muted-light);
}
.intelle-pdir-field select {
  width: 100%;
  min-height: 48px;
  border: 1.5px solid var(--intelle-border-light);
  border-radius: var(--intelle-radius-sm);
  background: var(--intelle-paper);
  color: var(--intelle-ink);
  font: inherit;
  font-weight: 700;
  padding: 0 14px;
}
.intelle-pdir-field select:focus-visible {
  outline: 3px solid var(--intelle-blue);
  outline-offset: 2px;
}
.intelle-pdir-filters-toggle {
  min-height: 48px;
  border: 1.5px solid var(--intelle-border-light);
  border-radius: var(--intelle-radius-sm);
  background: var(--intelle-paper);
  color: var(--intelle-ink);
  font: inherit;
  font-weight: 800;
  padding: 0 16px;
  cursor: pointer;
  flex: none;
}
.intelle-pdir-filters-toggle[aria-expanded="true"] {
  background: var(--intelle-ink);
  color: var(--intelle-canvas);
  border-color: var(--intelle-ink);
}
@media (max-width: 759.98px) {
  .intelle-pdir-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
  }
  .intelle-pdir-search .intelle-search {
    grid-column: 1 / -1;
    width: 100%;
  }
  .intelle-pdir-search > button {
    width: 100%;
    min-height: 54px;
  }
  .intelle-pdir-filters {
    gap: 16px;
    padding: 18px;
    border: 1px solid var(--intelle-border-light);
    border-radius: var(--intelle-radius-md);
    background: var(--intelle-panel-light);
    box-shadow: var(--intelle-shadow-card);
  }
  .intelle-pdir-field {
    gap: 8px;
  }
  .intelle-pdir-field label {
    font-size: 0.78rem;
  }
  .intelle-pdir-field select {
    min-height: 56px;
    padding: 0 16px;
    font-size: 16px;
  }
}

/* ------------------------------------------------------------
   03 APPLIED FILTERS AND LIVE COUNT
   ------------------------------------------------------------ */
.intelle-pdir-applied {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 0;
}
.intelle-pdir-applied__label {
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--intelle-muted-light);
}
.intelle-pdir-applied .intelle-chip { cursor: default; }
.intelle-pdir-count {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

/* ------------------------------------------------------------
   04 EDITORIAL PROVIDER GRID
   Two-column editorial rhythm at width, one column below.
   Cards flex to their content; the grid does not force equal
   text volume or identical shadows.
   ------------------------------------------------------------ */
.intelle-pdir-grid {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 1080px) {
  .intelle-pdir-grid { grid-template-columns: 1fr 1fr; gap: 18px 22px; align-items: start; }
}

/* ------------------------------------------------------------
   05 PROVIDER CARDS
   ------------------------------------------------------------ */
.intelle-pdir-card {
  border: 1.5px solid var(--intelle-border-light);
  border-radius: var(--intelle-radius-md);
  background: var(--intelle-paper);
  padding: 18px;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 12px;
}
.intelle-pdir-card__top {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.intelle-pdir-card__idwrap { min-width: 0; }
.intelle-pdir-card__name {
  margin: 4px 0 0;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
}
.intelle-pdir-card__model {
  margin: 3px 0 0;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--intelle-muted-light);
}
.intelle-pdir-card__desc {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.6;
  color: var(--intelle-muted-light);
}
.intelle-pdir-card__facts {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--intelle-muted-light);
  font-variant-numeric: tabular-nums;
}
.intelle-pdir-card__facts li { display: inline-flex; align-items: center; gap: 7px; }
.intelle-pdir-card__facts li::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 2px;
  background: var(--intelle-border-light);
  flex: none;
}
.intelle-pdir-card__facts b { color: var(--intelle-ink); font-weight: 800; }
.intelle-pdir-card__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  border-top: 1px solid var(--intelle-border-light);
  padding-top: 14px;
}
.intelle-pdir-card__site {
  font-size: 0.84rem;
  font-weight: 800;
  color: var(--intelle-ink);
  margin-left: auto;
}

/* ------------------------------------------------------------
   06 LOGO STAGE AND TYPOGRAPHIC FALLBACK
   A consistent stage: fixed box, aspect preserved, never a
   circle crop, never a broken-image icon. Inline marks and img
   elements both sit centered with contain behavior.
   ------------------------------------------------------------ */
.intelle-pdir-logo {
  flex: none;
  position: relative;
  width: 118px;
  height: 60px;
  border: 1px solid var(--intelle-border-light);
  border-radius: 12px;
  background: var(--intelle-pdir-logo-bg, #FFFFFF);
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 0;
}
.intelle-pdir-logo img,
.intelle-pdir-logo svg {
  position: absolute;
  inset: 8px;
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  max-width: none;
  max-height: none;
  object-fit: contain;
  display: block;
}
.intelle-pdir-logo--fallback {
  background: var(--intelle-ink);
  color: var(--intelle-canvas);
  font-weight: 800;
  font-size: 1.3rem;
  letter-spacing: 0.02em;
  font-family: var(--intelle-font-wordmark);
}
.intelle-pdir-logo--fallback span { line-height: 1; }
/* Profile-scale stage */
.intelle-pdir-logo--hero {
  width: 128px;
  height: 84px;
  border-radius: 14px;
}
/* Compact identity rows */
.intelle-pdir-logo--row {
  width: 64px;
  height: 44px;
  border-radius: 10px;
}
.intelle-pdir-logo--row img,
.intelle-pdir-logo--row svg {
  inset: 6px;
  width: calc(100% - 12px);
  height: calc(100% - 12px);
}
.intelle-pdir-logo--row.intelle-pdir-logo--fallback { font-size: 1rem; }

/* ------------------------------------------------------------
   07 PAGINATION
   Server-rendered links with a compact window: first, prev,
   nearby numbers, gap markers, last. The current page is a
   non-link with aria-current.
   ------------------------------------------------------------ */
.intelle-pdir-pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}
.intelle-pdir-pages a,
.intelle-pdir-pages [aria-current] {
  display: inline-grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0 12px;
  border: 1.5px solid var(--intelle-border-light);
  border-radius: 12px;
  background: var(--intelle-paper);
  color: var(--intelle-ink);
  font-weight: 800;
  font-size: 0.9rem;
  text-decoration: none;
  font-variant-numeric: tabular-nums;
}
.intelle-pdir-pages a:focus-visible {
  outline: 3px solid var(--intelle-blue);
  outline-offset: 2px;
}
.intelle-pdir-pages [aria-current="page"] {
  background: var(--intelle-ink);
  color: var(--intelle-canvas);
  border-color: var(--intelle-ink);
}
.intelle-pdir-pages__gap {
  color: var(--intelle-muted-light);
  font-weight: 800;
  padding: 0 2px;
}
.intelle-pdir-more {
  display: block;
  margin: 28px auto 0;
}
[data-pdir-more-wrap]:empty { display: none; }

/* ------------------------------------------------------------
   08 PROFILE IDENTITY UPGRADE
   The logo stage joins the hero identity without displacing
   the H1 or competing with the site header.
   ------------------------------------------------------------ */
.intelle-pdir-identity {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  flex-wrap: wrap;
}
.intelle-pdir-identity__text { min-width: min(100%, 340px); flex: 1; }
.intelle-pdir-identity .intelle-pdir-logo { margin-top: 4px; }
.intelle-pdir-model {
  margin: 8px 0 0;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--intelle-muted-dark);
}
.intelle-on-light .intelle-pdir-model,
.intelle-x-hero--split .intelle-pdir-model { color: var(--intelle-muted-light); }

/* ------------------------------------------------------------
   09 LARGE-CATALOG TOOLBAR ON PROFILES
   ------------------------------------------------------------ */
.intelle-pdir-cattools {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
}
@media (min-width: 760px) {
  .intelle-pdir-cattools { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); align-items: end; }
}

/* ------------------------------------------------------------
   10 REDUCED MOTION AND PRINT
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .intelle-pdir-card,
  .intelle-pdir-pages a { transition: none; }
}
@media print {
  .intelle-pdir-toolbar,
  .intelle-pdir-pages,
  .intelle-pdir-filters-toggle { display: none !important; }
  .intelle-pdir-card { break-inside: avoid; }
  .intelle-pdir-hero { background: #fff; color: #000; }
}

/* Similar-provider identity rows with logos wrap gracefully on
   narrow viewports instead of forcing width. */
.intelle-pdir-rowhead { flex-wrap: wrap; row-gap: 8px; }
[data-pdir-empty][hidden] {
  display: none !important;
}
.intelle-pdir-card {
  padding: 24px;
  color: var(--intelle-ink);
}
.intelle-pdir-card__name {
  color: var(--intelle-ink);
}
.intelle-pdir-card__model,
.intelle-pdir-card__desc,
.intelle-pdir-card__facts {
  color: var(--intelle-muted-light);
}
@media (max-width: 640px) {
  .intelle-pdir-card {
    padding: 20px;
  }
}