/* ===========================================================================
   meetowt.com/agencies - the directory of agencies and service firms. 19 October 2026.

   Loaded after styles.css, site.css and jobs.css, and only by agencies.html. It borrows the jobs board's fields, chips, status line, pager and logo
   plate (jobs.css) and adds only what a listing needs that a role does not: a card that is not one big link (it has two controls of its own, Contact
   and Report), the services as chips, and the sentence under the list. Everything is built from the site's own tokens, so jobs.css's dark block restyles it
   too.

   EVERY CONTROL IS AT LEAST 44 PIXELS TALL: the Contact button, the Report link, the chips and the fields (the same rule jobs.css keeps).
   =========================================================================== */

.ag-find__row {
  grid-template-columns: minmax(0, 18rem) auto;
}
@media (max-width: 40rem) {
  .ag-find__row {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* A company's words read in their own direction; this puts each line at the side it starts from. */
.ag-list [dir="auto"] {
  text-align: start;
}

.ag-card {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  width: 100%;
  min-width: 0;
  padding: 1.25rem 1.3rem 1.2rem;
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  background: var(--raised);
  box-shadow: var(--lift-1);
  color: var(--ink);
}
.ag-card__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}
.ag-card__name {
  min-width: 0;
  font-size: 1.2rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.ag-card__where {
  margin: 0.1rem 0 0;
  font-size: 0.85rem;
  color: var(--ink-faint);
  overflow-wrap: anywhere;
}
.ag-card__cat {
  align-self: flex-start;
  padding: 0.15rem 0.7rem;
  border: 1px solid var(--rule);
  border-radius: 999px;
  background: var(--paper);
  color: var(--accent-ink);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.ag-card__pitch {
  margin: 0;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.ag-card__services {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.ag-card__service {
  padding: 0.2rem 0.65rem;
  border: 1px solid var(--rule);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink-soft);
  font-size: 0.82rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.ag-card__about {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.94rem;
  overflow-wrap: anywhere;
}
.ag-card__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  margin-top: auto;
  padding-top: 0.4rem;
}
.ag-card__contact {
  min-height: 2.75rem;
  padding: 0.5rem 1.2rem;
}
.ag-card__report {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0 0.5rem;
  color: var(--ink-soft);
  font-size: 0.9rem;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.ag-card__report:hover {
  color: var(--ink);
}

.ag-note {
  margin: 2rem 0 0;
  max-width: 46rem;
  color: var(--ink-soft);
  font-size: 0.95rem;
}