/*
 * Advisor profile — compact / premium. Scoped .agp-* on the shared
 * tokens: gradient --ink hero, avatar with ring, inline contact, optional
 * stat strip, a floating white "Connect" card, compact tab bar, closing
 * CTA. Coral accents; verified badge green; WhatsApp green.
 */

.agp {
  padding-bottom: 0;
}
.agp > .crumb {
  margin-bottom: 16px;
}

/* ---------- hero ---------- */
.agp-hero {
  background: linear-gradient(135deg, #232a2f 0%, var(--ink) 45%, var(--ink-2) 100%);
  color: #fff;
  border-radius: 18px;
  padding: 30px 34px;
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  align-items: center;
}
.agp-id {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 26px;
  align-items: center;
  min-width: 0;
}
.agp-photo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  flex: none;
}
.agp-avatar {
  width: 128px;
  height: 128px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--sand);
  border: 4px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 18px 40px rgba(0, 0, 0, 0.35);
  flex: none;
}
.agp-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.agp-verified-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #fff;
  background: #0f7a3d;
  border-radius: 999px;
  padding: 4px 10px;
  white-space: nowrap;
}
.agp-idbody {
  min-width: 0;
}
.agp-idbody h1 {
  color: #fff;
  font-size: clamp(24px, 3.1vw, 34px);
  display: flex;
  align-items: center;
  gap: 9px;
}
.agp-tick {
  display: inline-flex;
  color: var(--coral);
  flex: none;
}
.agp-job {
  color: rgba(255, 255, 255, 0.68);
  font-size: 15px;
  margin-top: 3px;
}
.agp-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 14px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.78);
}
.agp-meta li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.agp-meta svg {
  color: var(--coral);
  flex: none;
  margin-top: 2px;
}
.agp-meta a {
  color: inherit;
}
.agp-meta a:hover {
  color: #fff;
}

.agp-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.13);
}
.agp-stat {
  display: grid;
  grid-template-columns: auto auto;
  grid-auto-rows: min-content;
  column-gap: 7px;
  align-items: center;
  background: linear-gradient(180deg, rgba(255, 90, 95, 0.14) 0%, rgba(255, 90, 95, 0.05) 100%);
  border: 1px solid rgba(255, 90, 95, 0.25);
  border-radius: 10px;
  padding: 8px 12px;
}
.agp-stat .ic {
  grid-row: 1 / 3;
  display: inline-flex;
  color: var(--coral);
}
.agp-stat .v {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}
.agp-stat .stars {
  grid-column: 2;
  color: var(--coral);
  margin: -2px 0 1px;
}
.agp-stat .l {
  grid-column: 2;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.6);
  text-transform: uppercase;
  letter-spacing: 0.3px;
  white-space: nowrap;
}

/* ---------- connect card ---------- */
.agp-connect {
  background: #fff;
  color: var(--ink);
  border-radius: 14px;
  box-shadow: 0 22px 55px rgba(10, 12, 14, 0.28);
  padding: 20px;
  align-self: start;
}
.agp-connect h3 {
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  text-align: center;
  padding-bottom: 14px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--line);
}
.agp-connect .btn {
  margin-top: 10px;
}
.agp-connect .btn-outline {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}
.agp-connect .btn-outline:hover {
  border-color: var(--coral);
  color: var(--coral-dark);
}
.agp-response {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 12px;
  color: var(--muted);
  margin-top: 14px;
}
.agp-response::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #1faa53;
}

/* ---------- tab bar ---------- */
.agp-tabs {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scrollbar-width: none;
  border-bottom: 1px solid var(--line);
  margin-top: 26px;
}
.agp-tabs::-webkit-scrollbar {
  display: none;
}
.agp-tab {
  flex: none;
  padding: 13px 2px;
  font-size: 14px;
  font-weight: 600;
  color: var(--muted);
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
}
.agp-tab.is-active {
  color: var(--coral-dark);
  border-bottom-color: var(--coral);
}
.agp-panel {
  padding-top: 28px;
}
.agp-panel[hidden] {
  display: none;
}
.agp-panel h3 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 12px;
}

/* ---------- two-column body ---------- */
.agp-two {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 40px;
  align-items: start;
}
.agp-aside-blocks {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.agp-block {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 18px;
}
.agp-block-h {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 12px;
}
.agp-cred {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  font-size: 13px;
  padding: 6px 0;
}
.agp-cred + .agp-cred {
  border-top: 1px solid var(--line);
}
.agp-cred .k {
  color: var(--muted);
  flex: none;
}
.agp-cred b {
  font-weight: 700;
  text-align: right;
  overflow-wrap: anywhere;
}

.agp-bio {
  font-size: 15px;
  line-height: 1.65;
  color: #34383c;
}

.agp-sec-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 18px;
}

.agp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.agp-chip {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  background: #fff5f5;
  border: 1px solid #f4d9d9;
  border-radius: 999px;
  padding: 5px 12px;
}

.agp-contact {
  display: flex;
  flex-direction: column;
  gap: 13px;
}
.agp-contact li {
  display: flex;
  gap: 11px;
  font-size: 13.5px;
  align-items: flex-start;
}
.agp-contact svg {
  color: var(--coral-dark);
  flex: none;
  margin-top: 2px;
}
.agp-contact .k {
  display: block;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 1px;
}

.agp-ask {
  font-size: 13.5px;
  color: var(--muted);
  background: var(--sand);
  border: 1px dashed var(--line);
  border-radius: 10px;
  padding: 14px 16px;
}
.agp-ask a {
  color: var(--coral-dark);
  font-weight: 600;
}

.agp-rev-score {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--sand);
}
.agp-rev-score .n {
  font-size: 15px;
  font-weight: 700;
  color: var(--coral-dark);
  line-height: 1;
}
.agp-rev-score .stars {
  color: var(--coral);
  font-size: 12px;
}
.agp-rev-score .c {
  font-size: 12px;
  color: var(--muted);
}
.agp-note {
  margin-top: 14px;
  font-size: 12.5px;
  color: var(--muted);
}

/* ---------- listings tab: medium-card arrow rail ---------- */
.agp-count {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 8px;
  border-radius: 999px;
  background: var(--sand);
  border: 1px solid var(--line);
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  vertical-align: middle;
}
.agp-listings-rail {
  position: relative;
  margin-top: 4px;
}
.agp-listings-rail .adv-rail {
  display: flex;
  gap: 18px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding: 4px 2px 6px;
}
.agp-listings-rail .adv-rail::-webkit-scrollbar {
  display: none;
}
.agp-listings-rail .adv-rail > .pcard {
  flex: 0 0 clamp(220px, 23%, 262px);
  scroll-snap-align: start;
}
.adv-rail-more {
  flex: 0 0 150px;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px dashed var(--line);
  border-radius: var(--radius, 14px);
  color: var(--coral-dark);
  font-weight: 600;
  font-size: 13px;
  background: var(--sand);
}
.adv-rail-more:hover {
  border-color: var(--coral);
  color: var(--coral);
}
@media (prefers-reduced-motion: reduce) {
  .agp-listings-rail .adv-rail {
    scroll-behavior: auto;
  }
}
@media (max-width: 560px) {
  .agp-listings-rail .adv-nav {
    display: none;
  }
  .agp-listings-rail .adv-rail > .pcard {
    flex-basis: 78vw;
  }
}

/* ---------- reviews (wp-realestate comment markup, restyled) ----------
   The plugin's own review CSS + Font Awesome are not loaded on advisor
   pages (strict allowlist), so everything under #comments is styled here,
   and the FA stars are replaced with a CSS glyph. */
#agp-reviews #comments {
  margin-top: 16px;
}
/* the plugin prints its own "N Reviews" summary — we show our own head */
#agp-reviews .review-title-wrapper {
  display: none;
}
/* something in the base CSS stretches these — pin them to content height */
#agp-reviews li.comment,
#agp-reviews .the-comment,
#agp-reviews .the-comment .avatar,
#agp-reviews .comment-box {
  height: auto !important;
  min-height: 0 !important;
}
#agp-reviews ol.comment-list,
#agp-reviews ul.comment-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#agp-reviews li.comment {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 16px;
  background: var(--card);
  box-shadow: 0 1px 2px rgba(29, 35, 39, 0.03);
}
#agp-reviews .comment .children {
  list-style: none;
  margin: 10px 0 0;
  padding: 0 0 0 16px;
  border-left: 2px solid var(--line);
}
#agp-reviews .the-comment {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
#agp-reviews .the-comment .avatar {
  flex: none;
}
#agp-reviews .the-comment .avatar img {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: block;
}
#agp-reviews .comment-box {
  flex: 1;
  min-width: 0;
}
#agp-reviews .comment-author,
#agp-reviews .comment-author .flex-middle {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
}
#agp-reviews .name-comment {
  font-weight: 600;
  font-size: 13px;
  color: var(--ink);
}
#agp-reviews .comment-author .date,
#agp-reviews .comment-meta {
  font-size: 12px;
  color: var(--muted);
}
#agp-reviews .comment-text,
#agp-reviews .comment-content {
  margin-top: 5px;
  font-size: 13px;
  line-height: 1.55;
  color: #3a3f43;
}
#agp-reviews .comment-text p:last-child {
  margin-bottom: 0;
}
#agp-reviews .comment-reply-link,
#agp-reviews .reply {
  display: none;
}

/* star rows — plugin stacks two <ul>, the .filled one clipped to width% */
#agp-reviews .review-stars-rated,
#agp-reviews .review-stars-rated-wrapper {
  position: relative;
  display: inline-block;
  line-height: 1;
}
#agp-reviews .review-stars {
  display: inline-flex;
  list-style: none;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}
#agp-reviews .review-stars li {
  width: 1em;
  font-size: 12px;
}
#agp-reviews .comment-author .review-stars li {
  font-size: 12px;
}
#agp-reviews .review-stars li span::before {
  content: "\2605"; /* ★ */
  color: #dcd3cc;
}
#agp-reviews .review-stars.filled {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}
#agp-reviews .review-stars.filled li span::before {
  color: var(--coral);
}
#agp-reviews .nb-review {
  margin-left: 8px;
  font-size: 12px;
  color: var(--muted);
}

/* review form */
#agp-reviews #respond,
#agp-reviews .comment-respond {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
#agp-reviews .comment-reply-title {
  font-family: var(--font-serif);
  font-size: 18px;
  margin: 0 0 12px;
}
#agp-reviews .comment-form-rating .subtitle,
#agp-reviews .comment-form-rating label {
  display: block;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 4px;
}
#agp-reviews .comment-form-rating .review-stars li {
  cursor: pointer;
  font-size: 20px;
}
#agp-reviews .comment-form-rating .review-stars li span.active::before,
#agp-reviews .comment-form-rating .review-stars li span:hover::before {
  color: var(--coral);
}
#agp-reviews .form-group,
#agp-reviews .comment-form p {
  margin: 0 0 14px;
}
#agp-reviews textarea,
#agp-reviews .comment-form textarea {
  width: 100%;
  min-height: 110px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  font: inherit;
  font-size: 14px;
  background: #fff;
}
#agp-reviews textarea:focus {
  outline: none;
  border-color: var(--coral);
}
#agp-reviews .form-submit input[type="submit"],
#agp-reviews .comment-form input[type="submit"] {
  background: var(--coral-dark);
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 11px 24px;
  font: inherit;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
}
#agp-reviews .form-submit input[type="submit"]:hover,
#agp-reviews .comment-form input[type="submit"]:hover {
  background: var(--coral);
}
/* honeypot field the spam mu-plugin injects — keep it off-screen */
#agp-reviews input[name="asraa_hp_website"] {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  opacity: 0;
}
#agp-reviews .comments-closed,
#agp-reviews .no-comments {
  font-size: 13px;
  color: var(--muted);
}

/* ---------- closing CTA ---------- */
.agp-cta {
  background: linear-gradient(135deg, #232a2f 0%, var(--ink) 60%);
  color: #fff;
  border-radius: 14px;
  padding: 24px 32px;
  margin: 44px 0 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.agp-cta h2 {
  color: #fff;
  font-size: 20px;
}
.agp-cta p {
  color: rgba(255, 255, 255, 0.66);
  font-size: 14px;
  margin-top: 4px;
}

/* ---------- responsive ---------- */
@media (max-width: 1080px) {
  .agp-hero {
    grid-template-columns: 1fr;
  }
  .agp-connect {
    max-width: 420px;
  }
}
@media (max-width: 900px) {
  .agp-two {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .agp-hero {
    padding: 24px 20px;
  }
  .agp-id {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 16px;
  }
  .agp-photo {
    margin: 0 auto;
  }
  .agp-idbody h1,
  .agp-meta li {
    justify-content: center;
  }
  .agp-meta {
    align-items: center;
  }
  .agp-stats {
    justify-content: center;
  }
  .agp-connect {
    max-width: none;
  }
  .agp-cta {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* =====================================================================
   ADVISOR ARCHIVE - "Our Property Advisors"  (archive-agent.php)
   ===================================================================== */
.agarch {
  padding-bottom: 72px;
}
.agarch > .crumb {
  margin-bottom: 14px;
}

/* ---------- hero ---------- */
.agarch-hero {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 30px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 18px;
  background:
    radial-gradient(120% 140% at 100% 0%, #fff4ef 0%, rgba(255, 244, 239, 0) 55%),
    var(--card);
  padding: 30px 32px;
  overflow: hidden;
}
/* hero with a background photo (Customizer "Default hero image") — a
   left-to-right white scrim keeps the dark copy readable while the
   skyline shows through on the right */
.agarch-hero.has-bg {
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  border-color: transparent;
}
.agarch-hero.has-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.96) 0%,
    rgba(255, 255, 255, 0.86) 38%,
    rgba(255, 255, 255, 0.45) 68%,
    rgba(255, 255, 255, 0.12) 100%
  );
}
.agarch-hero.has-bg > * {
  position: relative;
  z-index: 1;
}
/* Stats sit on their own solid strip so they stay legible no matter
   what's behind them in the photo, without constraining the copy width
   (the row stays on one line on desktop/tablet). */
.agarch-hero.has-bg .agarch-stats {
  background: rgba(255, 255, 255, 0.88);
  border-radius: 12px;
  padding: 16px 20px;
  border-top: none;
}
.agarch-hero h1 {
  font-size: clamp(26px, 3.4vw, 38px);
}
.agarch-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 30px;
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.agarch-stat {
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  column-gap: 8px;
}
.agarch-stat svg {
  grid-row: 1 / 3;
  color: var(--coral-dark);
}
.agarch-stat b {
  font-size: 19px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.1;
}
.agarch-stat span {
  grid-column: 2;
  font-size: 12px;
  color: var(--muted);
}
.agarch-hero-art {
  width: 220px;
  height: 130px;
  flex: none;
  align-self: stretch;
  border-radius: 12px;
  background:
    linear-gradient(0deg, var(--sand), var(--sand)) bottom / 100% 34% no-repeat,
    repeating-linear-gradient(90deg, #e7ddd4 0 2px, transparent 2px 22px) bottom / 100% 70% no-repeat,
    repeating-linear-gradient(0deg, #efe7de 0 14px, #e7ddd4 14px 15px) bottom / 100% 70% no-repeat,
    var(--card);
  opacity: 0.9;
}

/* ---------- filter bar ---------- */
.agarch-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-top: 20px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
}
.agarch-search {
  flex: 1 1 240px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.agarch-search svg {
  color: var(--muted);
  flex: none;
}
.agarch-search input {
  border: 0;
  outline: 0;
  width: 100%;
  font: inherit;
  font-size: 14px;
  background: transparent;
}
.agarch-sel {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 0 1 auto;
}
.agarch-sel > span {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
}
.agarch-sel select {
  min-height: 44px;
  padding: 0 30px 0 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-size: 13.5px;
  color: var(--ink);
  cursor: pointer;
}
.agarch-filter-btns {
  display: flex;
  gap: 8px;
}
.agarch-filter .btn {
  min-height: 44px;
}

.agarch-count {
  margin: 16px 0 20px;
  font-size: 13px;
  color: var(--muted);
}

/* ---------- body layout ---------- */
.agarch-body {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 34px;
  align-items: start;
}
.agarch-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 16px;
}

/* ---------- advisor card ---------- */
.agent-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  padding: 22px 16px 16px;
  transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}
.agent-card:hover {
  border-color: #e4d9d3;
  box-shadow: 0 14px 30px rgba(29, 35, 39, 0.09);
  transform: translateY(-3px);
}
.ac-flag {
  position: absolute;
  top: 12px;
  left: 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--coral-dark);
  background: #fff2f1;
  border: 1px solid #f3d9d6;
  border-radius: 999px;
  padding: 3px 8px;
}
.ac-avatar {
  width: 72px;
  height: 72px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--sand);
  box-shadow: 0 0 0 3px var(--paper), 0 0 0 4px var(--line);
  margin-bottom: 12px;
}
.ac-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ac-avatar.is-initials {
  display: grid;
  place-items: center;
  background: #ffe9ea;
  color: var(--coral-dark);
  font-weight: 700;
  font-size: 24px;
}
.ac-name {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 15px;
  color: var(--ink);
  margin: 0;
}
.ac-name a {
  color: inherit;
}
.ac-tick {
  display: inline-grid;
  place-items: center;
  width: 15px;
  height: 15px;
  border-radius: 999px;
  background: #f0b429;
  color: #fff;
  flex: none;
}
.ac-role {
  margin: 3px 0 0;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--coral-dark);
}
.ac-loc {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.ac-loc svg {
  color: var(--muted);
}
.ac-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: calc(100% + 32px);
  margin: 14px -16px 0;
  border-top: 1px solid var(--line);
}
.ac-stat {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 10px 4px;
}
.ac-stat + .ac-stat {
  border-left: 1px solid var(--line);
}
.ac-stat b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}
.ac-stat b svg {
  color: #f0b429;
}
.ac-stat span {
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted);
}
.ac-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  width: 100%;
  margin-top: 14px;
}
.ac-actions .btn {
  min-height: 40px;
  padding: 0 10px;
  font-size: 12.5px;
}
.agent-card .btn-outline {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}
.agent-card .btn-outline:hover {
  border-color: var(--coral);
  color: var(--coral-dark);
}
.agent-card .btn-ink {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
.agent-card .btn-ink:hover {
  background: #000;
  color: #fff;
}

/* ---------- pagination ---------- */
.agarch-pager {
  margin-top: 28px;
}
.agarch-pager .page-numbers {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0;
  margin: 0;
}
.agarch-pager a.page-numbers,
.agarch-pager span.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  background: var(--card);
}
.agarch-pager a.page-numbers:hover {
  border-color: var(--coral);
  color: var(--coral-dark);
}
.agarch-pager .page-numbers.current {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
.agarch-pager .page-numbers.dots {
  border-color: transparent;
  background: none;
}
.agarch-pager .prev svg {
  transform: rotate(180deg);
}

.agarch-empty {
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 30px;
  text-align: center;
  color: var(--muted);
}
.agarch-empty a {
  color: var(--coral-dark);
  font-weight: 600;
}

/* ---------- sidebar ---------- */
.agarch-side {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: sticky;
  top: 92px;
}
.agarch-card {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  background: var(--card);
}
.agarch-card-h {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 12px;
}
.agarch-card-dark {
  background: linear-gradient(135deg, #232a2f 0%, var(--ink) 60%);
  border-color: var(--ink);
  color: #fff;
}
.agarch-card-dark h3 {
  font-family: var(--font-sans);
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 6px;
  color: #fff;
}
.agarch-card-dark p {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
  margin: 0 0 14px;
}
.agarch-card-dark ul {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.agarch-card-dark li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.85);
}
.agarch-card-dark li svg {
  color: var(--coral);
  flex: none;
  margin-top: 1px;
}
.btn-light {
  background: #fff;
  color: var(--ink);
}
.btn-light:hover {
  background: rgba(255, 255, 255, 0.88);
  color: var(--ink);
}
.agarch-card-dark .btn + .btn {
  margin-top: 8px;
}

.agarch-quote {
  font-family: var(--font-serif);
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink);
  margin: 0;
}
.agarch-quote-by {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--muted);
}

.agarch-spec-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.agarch-spec-list li + li {
  border-top: 1px solid var(--line);
}
.agarch-spec-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 0;
  font-size: 13px;
  color: var(--ink);
}
.agarch-spec-list a:hover {
  color: var(--coral-dark);
}
.agarch-spec-list b {
  font-size: 12px;
  color: var(--muted);
  background: var(--sand);
  border-radius: 999px;
  padding: 1px 8px;
}

.agarch-card-join p {
  font-size: 13px;
  color: var(--muted);
  margin: 0 0 12px;
}
.agarch-card-join .btn-outline {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}
.agarch-card-join .btn-outline:hover {
  border-color: var(--coral);
  color: var(--coral-dark);
}

/* ---------- bottom CTA ---------- */
.agarch-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 34px;
  padding: 22px 26px;
  border-radius: 14px;
  background: var(--sand);
  border: 1px solid var(--line);
}
.agarch-cta h2 {
  font-size: 20px;
  margin: 0;
}
.agarch-cta p {
  margin: 4px 0 0;
  font-size: 13.5px;
  color: var(--muted);
}
.agarch-cta-btns {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* ---------- responsive ---------- */
@media (max-width: 900px) {
  .agarch-body {
    grid-template-columns: 1fr;
  }
  .agarch-side {
    position: static;
  }
  .agarch-hero {
    grid-template-columns: 1fr;
  }
  .agarch-hero-art {
    display: none;
  }
  .agarch-grid-wide {
    max-height: none;
    overflow-y: visible;
    padding-right: 0;
  }
}
@media (max-width: 700px) {
  /* narrow screens: the copy spans full width, so the scrim can't fade
     to transparent or the stats lose contrast over the skyline */
  .agarch-hero.has-bg::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.86) 100%);
  }
  .bld-hero .wrap {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}
@media (max-width: 620px) {
  .agarch-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .agarch-filter {
    padding: 12px;
  }
  .agarch-sel {
    flex: 1 1 100%;
  }
  .agarch-sel select {
    width: 100%;
  }
  .agarch-cta {
    flex-direction: column;
    align-items: flex-start;
  }
  .agarch-cta-btns .btn {
    flex: 1;
  }
}

/* =====================================================================
   Listings-tab property cards - tighten the rail card
   ===================================================================== */
.agp-listings-rail .adv-rail > .pcard {
  flex-basis: clamp(190px, 20%, 216px);
}
.agp-listings-rail .adv-rail > .pcard .thumb {
  aspect-ratio: 16 / 10;
}
.agp-listings-rail .adv-rail > .pcard .body {
  padding: 12px 12px 14px;
}
.agp-listings-rail .adv-rail > .pcard .price {
  font-size: 14px;
}
.agp-listings-rail .adv-rail > .pcard .title {
  font-size: 13px;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.agp-listings-rail .adv-rail > .pcard .loc,
.agp-listings-rail .adv-rail > .pcard .meta {
  font-size: 12px;
}
.agp-listings-rail .adv-rail > .pcard .loc {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* =====================================================================
   BUILDER ARCHIVE + CARD  (archive-agency.php / agency-card.php)
   reuses the .agarch-* layout; only the card + a few extras are new
   ===================================================================== */

/* wider grid for the landscape builder cards */
.agarch-grid-wide {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.agency-card {
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  overflow: hidden;
  transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}
.agency-card:hover {
  border-color: #e4d9d3;
  box-shadow: 0 14px 30px rgba(29, 35, 39, 0.09);
  transform: translateY(-3px);
}
.gc-flag {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--coral-dark);
  background: #fff;
  border-radius: 999px;
  padding: 3px 9px;
  box-shadow: 0 2px 8px rgba(29, 35, 39, 0.12);
}
.gc-cover {
  position: relative;
  display: block;
  height: 160px;
  background: var(--sand);
  overflow: hidden;
}
.gc-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.gc-cover-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #b7ad9c;
}
.gc-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, 0.28) 100%);
}
.gc-logo {
  position: absolute;
  left: 14px;
  bottom: -22px;
  z-index: 2;
  width: 64px;
  height: 44px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 6px 16px rgba(29, 35, 39, 0.14);
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 6px;
}
.gc-logo img {
  max-width: 100%;
  max-height: 32px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.gc-logo.is-initials {
  font-weight: 800;
  font-size: 16px;
  color: var(--coral-dark);
  background: #fff;
}
.gc-body {
  padding: 30px 16px 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.gc-name {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 15px;
  color: var(--ink);
  margin: 0;
}
.gc-name a {
  color: inherit;
}
.gc-loc {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.gc-loc svg {
  color: var(--muted);
}
.gc-stats {
  margin: 8px 0 0;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
}
.gc-cta {
  margin-top: 14px;
  align-self: flex-start;
  min-height: 38px;
  padding: 0 14px;
  font-size: 12.5px;
}

/* sidebar: featured projects list */
.agarch-proj-list {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.agarch-proj-list a {
  display: flex;
  gap: 10px;
  align-items: center;
}
.agarch-proj-thumb {
  flex: none;
  width: 52px;
  height: 40px;
  border-radius: 8px;
  overflow: hidden;
  background: var(--sand);
}
.agarch-proj-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.agarch-proj-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.agarch-proj-meta b {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.3;
}
.agarch-proj-meta span {
  font-size: 12px;
  color: var(--muted);
}

/* single-agency hero: logo tile instead of a round avatar */
.agp-avatar-logo {
  border-radius: 14px;
  background: #fff;
  padding: 12px;
  display: grid;
  place-items: center;
}
.agp-avatar-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.agp-avatar-logo.is-initials {
  font-weight: 800;
  font-size: 30px;
  color: var(--coral-dark);
}

@media (max-width: 620px) {
  .agarch-grid-wide {
    grid-template-columns: 1fr;
  }
}

/* =====================================================================
   SINGLE BUILDER — full scrolling profile  (single-agency.php)
   ===================================================================== */
.bld {
  padding-bottom: 0;
}
.bld-crumb {
  padding-top: 20px;
  margin-bottom: 14px;
}

/* ---------- hero ---------- */
.bld-hero {
  position: relative;
  background-color: var(--ink);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.bld-hero.no-cover {
  background-image: linear-gradient(120deg, #eef1f3 0%, var(--sand) 60%, #f0e7de 100%);
}
.bld-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(15, 18, 20, 0.34) 0%, rgba(15, 18, 20, 0.06) 55%, rgba(15, 18, 20, 0) 100%);
}
.bld-hero .wrap {
  position: relative;
  z-index: 1;
  padding-top: 46px;
  padding-bottom: 46px;
}
.bld-hero-card {
  max-width: 640px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 26px 60px rgba(10, 12, 14, 0.28);
  padding: 24px;
  display: flex;
  gap: 22px;
}
.bld-logo {
  flex: none;
  width: 132px;
  height: 96px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  display: grid;
  place-items: center;
  padding: 12px;
  align-self: flex-start;
}
.bld-logo img {
  max-width: 100%;
  max-height: 72px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.bld-logo.is-initials {
  font-weight: 800;
  font-size: 26px;
  color: var(--coral-dark);
}
.bld-hero-body {
  min-width: 0;
  flex: 1;
}
.bld-name {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(22px, 3vw, 30px);
  color: var(--ink);
  line-height: 1.15;
}
.bld-tick {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: var(--coral);
  color: #fff;
  flex: none;
}
.bld-tag {
  margin: 4px 0 0;
  font-size: 14px;
  color: var(--muted);
}
.bld-loc {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 8px 0 0;
  font-size: 13px;
  color: var(--muted);
}
.bld-loc svg {
  color: var(--coral-dark);
  flex: none;
}
.bld-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));
  gap: 8px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.bld-stat {
  background: linear-gradient(180deg, #fff6f6 0%, #fffaf9 100%);
  border: 1px solid #f5dede;
  border-radius: 10px;
  padding: 9px 10px;
}
.bld-stat b {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--coral-dark);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bld-stat span {
  display: block;
  margin-top: 1px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 480px) {
  .bld-stats {
    grid-template-columns: repeat(2, 1fr);
  }
}
.bld-hero-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.bld-hero-btns .btn {
  min-height: 42px;
}
.bld-hero-btns .btn-outline {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}
.bld-hero-btns .btn-outline:hover {
  border-color: var(--coral);
  color: var(--coral-dark);
}

/* ---------- about ---------- */
/* frosted-glass card — used for the trust points, the figures band and
   the review cards, so every card on the builder page reads the same */
.bld-glass {
  background: rgba(255, 255, 255, 0.55);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  backdrop-filter: blur(14px) saturate(1.4);
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 16px;
  box-shadow: 0 14px 40px rgba(29, 35, 39, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
.band-dark .bld-glass {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.16);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.bld-about {
  background:
    radial-gradient(120% 120% at 100% 0%, #fff4ef 0%, rgba(255, 244, 239, 0) 45%),
    var(--card);
}
.bld-about-grid {
  display: grid;
  grid-template-columns: 1.12fr 1fr;
  gap: 40px;
  align-items: start;
}
.bld-lead,
.bld-about .prose {
  font-size: 16px;
  line-height: 1.7;
  color: #34383c;
}
.bld-feats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 26px;
}
.bld-feat {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px 16px 15px;
}
.bld-feat svg {
  color: var(--coral-dark);
  flex: none;
}
.bld-feat b {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--ink);
}
.bld-feat span {
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
}
/* Media card: one fixed shape on every builder page — any image, any
   original size, is cover-cropped into the same 16:10 block a video
   embed would fill. */
.bld-media {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background: var(--sand);
  align-self: start;
  aspect-ratio: 16 / 10;
  width: 100%;
  box-shadow: 0 20px 50px rgba(29, 35, 39, 0.14);
}
.bld-media img,
.bld-media iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border: 0;
}
.bld-media-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #b7ad9c;
}
.bld-play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(15, 18, 20, 0.18);
}
.bld-play span {
  width: 62px;
  height: 62px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  display: grid;
  place-items: center;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}
.bld-play span::before {
  content: "";
  border-style: solid;
  border-width: 11px 0 11px 18px;
  border-color: transparent transparent transparent var(--coral-dark);
  margin-left: 4px;
}
.bld-play:hover span {
  background: #fff;
}

/* ---------- why choose (figures band) ---------- */
/* premium graphite gradient, not flat black — matches the hero / CTA */
.bld-why.band-dark {
  background:
    radial-gradient(90% 120% at 100% 0%, rgba(255, 90, 95, 0.16) 0%, rgba(255, 90, 95, 0) 55%),
    linear-gradient(135deg, #2b333a 0%, var(--ink) 48%, var(--ink-2) 100%);
}
.bld-why .h-2 {
  color: #fff;
}
.bld-why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
  margin-top: 26px;
}
.bld-why-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
  padding: 18px 14px;
}
.bld-why-item svg {
  color: var(--coral);
}
.bld-why-item b {
  font-size: 21px;
  font-weight: 700;
  color: #fff;
}
.bld-why-item span {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.62);
}

/* ---------- reviews ---------- */
.bld-review-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 24px;
}
.bld-review {
  margin: 0;
  padding: 18px;
}
.bld-review-stars {
  color: var(--coral);
  margin-bottom: 8px;
}
.bld-review blockquote {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.6;
  color: #34383c;
}
.bld-review figcaption {
  margin-top: 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}

/* ---------- closing CTA ---------- */
.bld-cta-inner {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 40px;
  align-items: center;
}
.bld-cta.band-dark {
  background:
    radial-gradient(90% 120% at 0% 100%, rgba(255, 90, 95, 0.16) 0%, rgba(255, 90, 95, 0) 55%),
    linear-gradient(135deg, #2b333a 0%, var(--ink) 48%, var(--ink-2) 100%);
}
.bld-cta .h-2 {
  color: #fff;
}
.bld-cta-form {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  padding: 20px;
}

@media (max-width: 900px) {
  .bld-about-grid,
  .bld-cta-inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .bld-hero-card {
    max-width: none;
  }
}
@media (max-width: 560px) {
  .bld-hero-card {
    flex-direction: column;
    gap: 16px;
    padding: 18px;
  }
  .bld-logo {
    width: 108px;
    height: 78px;
  }
  .bld-logo img {
    max-height: 54px;
  }
  .bld-feats,
  .bld-review-grid {
    grid-template-columns: 1fr;
  }
}

.bld-about-grid.is-solo { grid-template-columns: 1fr; max-width: 780px; }

/* Builder profile — connect block (Call/WhatsApp/Email chips + social
   icon row, 2-3 typical). Replaces the plain .bld-contact text row.
   2026-09-12. */
.bld-connect {
  margin: 8px 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bld-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bld-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 13px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(10, 12, 14, 0.04);
  transition: border-color 0.15s, color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.bld-chip svg {
  color: var(--coral-dark);
  flex: none;
}
.bld-chip:hover {
  border-color: var(--coral-dark);
  color: var(--coral-dark);
  box-shadow: 0 3px 8px rgba(214, 53, 58, 0.15);
  transform: translateY(-1px);
}
.bld-chip--wa {
  background: #eaf9ef;
  border-color: #bfe6cb;
}
.bld-chip--wa svg {
  color: #1e7a3d;
}
.bld-chip--wa:hover {
  border-color: #1e7a3d;
  color: #1e7a3d;
}
.bld-social-row {
  display: flex;
  gap: 8px;
}
.bld-social-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  box-shadow: 0 1px 2px rgba(10, 12, 14, 0.04);
  transition: border-color 0.15s, color 0.15s, background 0.15s, transform 0.15s;
}
.bld-social-ico:hover {
  border-color: var(--coral-dark);
  color: var(--coral-dark);
  background: #fff6f6;
  transform: translateY(-1px);
}
@media (max-width: 480px) {
  .bld-chip span {
    display: none;
  }
  .bld-chip {
    padding: 8px;
  }
}

/* =====================================================================
   2026-10-03 — sample profiles + phone polish (profile page + cards)
   ===================================================================== */
/* "Sample profile" marker (demo/example advisors) */
.agp-sample-pill,
.ac-flag--sample {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #8a5300;
  background: #fff4e5;
  border: 1px solid #f2d3a4;
  border-radius: 999px;
  padding: 4px 10px;
  white-space: nowrap;
}
.ac-flag--sample { padding: 3px 8px; }
.ac-flag--sample ~ .ac-flag { display: none; } /* sample replaces "Featured" */

/* no photo: show the initial instead of an empty circle */
.agp-avatar .agp-initials {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background: #fdeceb;
  color: var(--coral-dark);
  font-family: var(--font-serif);
  font-size: 56px;
  font-weight: 600;
}

@media (max-width: 640px) {
  /* profile hero: three stats in one even row */
  .agp-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  .agp-stat {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    padding: 10px 4px;
  }
  .agp-stat .ic { display: none; }
  .agp-stat:only-child { grid-column: 1 / -1; }
  .agp-cta { margin: 32px 0 24px; padding: 22px 20px; }

  /* directory cards: photo beside the name — about half the height */
  .agent-card {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    column-gap: 14px;
    align-items: center;
    text-align: left;
    padding: 16px 16px 14px;
  }
  .agent-card > .ac-avatar { grid-column: 1; grid-row: 1 / span 3; width: 64px; height: 64px; margin: 0; }
  .agent-card > :not(.ac-avatar):not(.ac-flag):not(.ac-stats):not(.ac-actions) { grid-column: 2; margin: 0; }
  .agent-card > .ac-stats,
  .agent-card > .ac-actions { grid-column: 1 / -1; }
  .agent-card .ac-flag { top: 10px; left: auto; right: 10px; }
  .agent-card .ac-name { padding-right: 96px; }
  .ac-stats { margin-top: 12px; }
  .ac-stat { padding: 8px 4px; }
  .ac-actions { margin-top: 12px; }
}
@media (max-width: 900px) {
  /* no fixed bottom bar on advisor pages, so no 96px reserve above the footer */
  body.single-agent main,
  body.post-type-archive-agent main { padding-bottom: 0; }
}
/* floating voice button: lighter on advisor pages */
body.single-agent .asraa-voice-fab,
body.post-type-archive-agent .asraa-voice-fab { width: 40px; height: 40px; opacity: 0.88; }
@media (max-width: 640px) {
  /* profile stats: value over label inside each box (the base styles pin both to column 2) */
  .agp-stat .v,
  .agp-stat .l,
  .agp-stat .stars { grid-column: 1 !important; grid-row: auto !important; }
  .agp-stat .v { font-size: 17px; line-height: 1.2; }
  .agp-stat .l { white-space: normal; font-size: 12px; letter-spacing: 0.02em; line-height: 1.25; }
  /* directory cards: text left beside the photo, stats centred */
  .agent-card .ac-name,
  .agent-card .ac-role,
  .agent-card .ac-loc { justify-content: flex-start; text-align: left; justify-self: start; }
  .agent-card .ac-stat { align-items: center; text-align: center; }
}

/* 2026-10-03 — sample profiles: example listings + example reviews */
.agp-sample-note {
  margin: 4px 0 16px;
  padding: 10px 14px;
  font-size: 13.5px;
  line-height: 1.5;
  color: #6b4500;
  background: #fff8ec;
  border: 1px dashed #f2d3a4;
  border-radius: 10px;
}
.agp-sample-note b { color: #8a5300; text-transform: uppercase; letter-spacing: 0.04em; font-size: 12px; }
.agp-ex-reviews {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.agp-ex-review {
  margin: 0;
  padding: 18px;
  background: var(--card);
  border: 1px dashed var(--line);
  border-radius: 12px;
}
.agp-ex-top { display: flex; align-items: center; gap: 10px; }
.agp-ex-av {
  flex: none;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: var(--sand);
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}
.agp-ex-who { display: flex; flex-direction: column; min-width: 0; }
.agp-ex-who b { font-size: 14.5px; color: var(--ink); }
.agp-ex-who span { font-size: 12.5px; color: var(--muted); }
.agp-ex-stars { margin-left: auto; color: var(--coral); letter-spacing: 1px; font-size: 14px; }
.agp-ex-review blockquote { margin: 12px 0 0; font-size: 14px; line-height: 1.6; color: var(--muted); font-style: italic; }
@media (max-width: 640px) {
  .agp-ex-reviews { grid-template-columns: 1fr; }
}
