/* ===========================================================================
   InstaWP AGENCY DIRECTORY — vetted WordPress agencies (green-skin)
   Used by: agencies.html (browse) + agency-detail.html (single)
   Load order:  style.css -> ../directory/directory.css -> agency.css -> kit.css
   Reuses the directory's .d-* catalog/detail layout; this file adds the
   agency-specific bits: location line, Partner badge, services chips, the
   contact/lead rail, and the "Get listed" funnel band/card.
   No screenshots (agencies have a logo), and NO ratings (not a real data point).
   =========================================================================== */

/* ===================== LOCATION LINE ================================== */
.ad-loc{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.72rem;color:var(--muted)}
.ad-loc svg{width:12px;height:12px;color:var(--green-deep);flex:none}
.phero .ad-loc{color:rgba(234,242,238,.7)}
.phero .ad-loc svg{color:var(--green-x)}

/* ===================== PARTNER / FEATURED PILL ======================== */
.ad-feat{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:.6rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--green-deep);background:var(--green-tint);
  border:1px solid rgba(17,191,133,.3);padding:3px 9px;border-radius:100px;white-space:nowrap}
.ad-feat svg{width:11px;height:11px}
.phero .ad-feat{color:var(--green-x);background:rgba(43,232,166,.12);border-color:rgba(43,232,166,.3)}

/* ===================== SERVICES CHIPS (on a card) ===================== */
.ad-services{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}

/* ===================== AGENCY LOGO TILE =============================== */
/* uses the directory .ci tile; ensure a contained logo + initials fallback */
.ad-card .ci img{width:100%;height:100%;object-fit:contain;padding:6px;background:#fff}
.ad-logo-txt{font-family:var(--mono);font-weight:700;font-size:.9rem;color:var(--green-deep)}

/* ===================== CONTACT / LEAD RAIL CARD ====================== */
/* reuses .d-sandbox shell; .ad-lead just rettargets the accent to neutral-green */
.ad-lead .lbl{color:var(--green-x)}

/* ===================== "GET LISTED" FUNNEL =========================== */
/* dashed CTA card injected into the grid */
.ad-cta-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;
  min-height:230px;padding:24px;border:1.5px dashed rgba(17,191,133,.4);border-radius:var(--r-lg);background:var(--green-tint);box-shadow:none}
.ad-cta-card:hover{border-color:var(--green-deep);transform:none;box-shadow:none}
.ad-cta-card .ic{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid rgba(17,191,133,.3)}
.ad-cta-card .ic svg{width:20px;height:20px;color:var(--green-deep)}
.ad-cta-card h3{font-size:1.02rem;font-weight:700;color:var(--heading);line-height:1.25}
.ad-cta-card p{font-size:.88rem;color:var(--body);line-height:1.5;margin:0}

/* full-width "Get listed" band (echoes the program page's editorial dark band) */
.ad-getlisted{position:relative;overflow:hidden;border-radius:var(--r-xl,22px);padding:clamp(36px,5vw,56px);
  background:linear-gradient(165deg,#0C1A14,#0B1410);border:1px solid rgba(43,232,166,.22);text-align:center}
.ad-getlisted::before{content:'';position:absolute;width:420px;height:300px;top:-140px;left:50%;transform:translateX(-50%);
  border-radius:50%;filter:blur(60px);background:radial-gradient(ellipse at center,rgba(43,232,166,.22),transparent 68%);pointer-events:none}
.ad-getlisted .lbl{position:relative;font-family:var(--mono);font-size:.64rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--green-x);display:inline-flex;align-items:center;gap:7px}
.ad-getlisted .lbl .dot{width:6px;height:6px;border-radius:50%;background:var(--green-x);box-shadow:0 0 8px rgba(43,232,166,.8)}
.ad-getlisted h2{position:relative;font-family:var(--font);font-weight:800;letter-spacing:-.02em;color:#F4F8F7;
  font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.15;margin:14px 0 0}
.ad-getlisted p{position:relative;color:rgba(234,242,238,.72);font-size:1.02rem;line-height:1.55;max-width:54ch;margin:12px auto 0}
.ad-getlisted .btn{position:relative;margin-top:24px}
