/* ============================================================
   Circi — Theme · Primary Trust Medical (Slate Clinical)
   Layered AFTER styles.css and all section stylesheets.
   ============================================================ */

:root {
  /* Primary: Deep Slate Navy (sophisticated, clinical — not royal blue) */
  --navy:        #1B3D5C;
  --navy-deep:   #122B43;
  --navy-2:      #1F4569;
  --navy-3:      #3D5B7A;

  /* Slate ink — readable on cool surfaces */
  --ink:         #0F172A;
  --ink-2:       #475569;
  --ink-3:       #94A3B8;

  /* Light cool rules + surfaces */
  --rule:        #E2E8F0;
  --rule-soft:   #F1F5F9;
  --paper:       #F8FAFC;
  --paper-2:     #EFF3F7;
  --surface:     #FFFFFF;
  --surface-2:   #F8FAFC;

  /* Secondary: Deep Teal (Tailwind teal-600 family — clinical & calm) */
  --teal:        #0D9488;
  --teal-deep:   #0F766E;
  --teal-ink:    #134E4A;
  --teal-soft:   #CCFBF1;

  /* Accent: Light Green (success/confirmation only) */
  --success:      #16A34A;
  --success-deep: #15803D;
  --success-soft: #DCFCE7;
  --success-ink:  #166534;
}

/* ===== Avatars (override hardcoded gradients) ===== */
.directory .card .av.teal,
.testimonials .q-avatar.teal {
  background: linear-gradient(135deg, #0D9488, #0F766E) !important;
  color: #fff !important;
}
.directory .card .av.navy,
.testimonials .q-avatar.navy {
  background: linear-gradient(135deg, #1F4569, #122B43) !important;
  color: #fff !important;
}
.directory .card .av.plum,
.testimonials .q-avatar.plum {
  background: linear-gradient(135deg, #475569, #1E293B) !important; /* slate */
  color: #fff !important;
}
.testimonials .q-avatar.gold {
  background: linear-gradient(135deg, #64748B, #334155) !important; /* steel */
  color: #fff !important;
}
.testimonials .q-avatar.sage {
  background: linear-gradient(135deg, #14B8A6, #0F766E) !important; /* mint teal */
  color: #fff !important;
}

/* ===== Translucent teal mixes (focus rings, borders) ===== */
.site-footer .newsletter .nl-form:focus-within {
  box-shadow: 0 0 0 4px rgba(13,148,136,0.16);
}
.directory .chip.consult { border-color: rgba(13,148,136,0.32); }
.trust .pi-ico { border-color: rgba(13,148,136,0.22); }
.trust .statement-glyph .gtile { border-color: rgba(13,148,136,0.24); }
.statement-card p.statement-body .em,
.trust p.statement-body .em {
  background: linear-gradient(180deg, transparent 64%, rgba(13,148,136,0.32) 64%) !important;
}

/* ===== Billing chip — soft success green (positive outcome) ===== */
.directory .chip.billing {
  background: var(--success-soft) !important;
  color: var(--success-ink) !important;
  border-color: rgba(22,163,74,0.28) !important;
}
.directory .chip.billing svg { color: var(--success-deep) !important; }

/* ===== GP-column CTA: teal pill needs white text on deeper teal ===== */
.built .col.gp .col-cta .button {
  background: var(--teal);
  color: #fff !important;
}
.built .col.gp .col-cta .button:hover { background: var(--teal-deep); }

/* ===== Hero sheen accent — cool slate-tinted ===== */
.hero {
  background:
    radial-gradient(900px 380px at 50% 0%, rgba(27,61,92,0.05), transparent 70%),
    var(--paper);
}

/* ===== Misc deep-navy mixes ===== */
.btn-ghost { border-color: rgba(27,61,92,0.22) !important; }
.btn-ghost:hover { background: rgba(27,61,92,0.04) !important; }
.site-footer .newsletter { border-top-color: rgba(27,61,92,0.10); border-bottom-color: rgba(27,61,92,0.10); }