/* ============================================================
   Titan Capital — Contact & Client Services section
   Place at /css/contact-section.css (linked after home.css).
   Everything is scoped under .tc-contact to avoid clashes.
============================================================ */
.tc-contact{
  --tc-slate:#1E293B; --tc-steel:#475569; --tc-white:#F8FAFC; --tc-jade:#0F766E;
  --tc-line:#E2E8F0; --tc-muted:#64748B;
  background:var(--tc-white); color:var(--tc-slate);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  padding:72px 32px; box-sizing:border-box;
}
.tc-contact *{box-sizing:border-box}
.tc-contact a{text-decoration:none}
.tc-contact__inner{max-width:1200px;margin:0 auto}

.tc-contact__eyebrow{
  display:flex;align-items:center;gap:12px;margin:0;
  font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.2em;text-transform:uppercase;color:var(--tc-steel);
}
.tc-contact__eyebrow::before{content:"";width:32px;height:1px;background:#94A3B8}
.tc-contact__title{
  margin:16px 0 12px;font-size:clamp(30px,4.5vw,46px);
  line-height:1.1;letter-spacing:-.02em;font-weight:700;color:var(--tc-slate);
}
.tc-contact__lead{margin:0 0 36px;max-width:560px;font-size:16px;line-height:1.65;color:var(--tc-steel)}

.tc-contact__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}

.tc-card{
  display:flex;flex-direction:column;background:#fff;
  border:1px solid var(--tc-line);border-radius:12px;padding:28px;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.tc-card:hover{border-color:#CBD5E1;box-shadow:0 6px 20px rgba(30,41,59,.07)}
.tc-card__icon{
  width:40px;height:40px;margin-bottom:18px;border-radius:10px;
  background:#ECFDF5;color:var(--tc-jade);display:grid;place-items:center;
}
.tc-card__icon svg{width:20px;height:20px}
.tc-card__title{margin:0 0 8px;font-size:19px;font-weight:650;line-height:1.3;color:var(--tc-slate)}
.tc-card__text{margin:0 0 20px;font-size:14.5px;line-height:1.6;color:var(--tc-steel)}

.tc-rows{margin:0 0 24px;padding:0;list-style:none;border-top:1px solid var(--tc-line)}
.tc-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 0;border-bottom:1px solid #F1F5F9;
  font-size:14.5px;font-weight:500;word-break:break-word;
}
.tc-row small{display:block;font-size:12px;font-weight:400;color:var(--tc-muted)}
.tc-actions{display:flex;gap:6px;flex-shrink:0}
.tc-actions a{
  width:36px;height:36px;display:grid;place-items:center;
  border:1px solid var(--tc-line);border-radius:8px;background:#fff;
  color:var(--tc-steel);transition:border-color .2s,color .2s;
}
.tc-actions a:hover{border-color:var(--tc-jade);color:var(--tc-jade)}
.tc-actions svg{width:17px;height:17px}

.tc-steps{margin:0 0 24px;padding:0;list-style:none;counter-reset:tc;font-size:14px;color:var(--tc-steel)}
.tc-steps li{counter-increment:tc;display:flex;gap:12px;align-items:center;margin-bottom:10px;line-height:1.4}
.tc-steps li::before{
  content:counter(tc);flex-shrink:0;width:22px;height:22px;border-radius:50%;
  background:#F1F5F9;color:var(--tc-slate);font-size:11px;font-weight:600;
  display:grid;place-items:center;
}

.tc-cta{
  margin-top:auto;display:flex;align-items:center;justify-content:space-between;
  min-height:46px;padding:12px 16px;border-radius:8px;
  font-size:14.5px;font-weight:600;background:var(--tc-slate);color:#fff;
  border:1px solid var(--tc-slate);transition:background .2s,border-color .2s,color .2s;
}
.tc-cta:hover{background:var(--tc-jade);border-color:var(--tc-jade);color:#fff}
.tc-cta--alt{background:#fff;color:var(--tc-slate);border-color:#CBD5E1}
.tc-cta--alt:hover{background:var(--tc-white);color:var(--tc-jade);border-color:var(--tc-jade)}
.tc-cta svg{width:16px;height:16px}

.tc-contact__note{
  margin:28px 0 0;max-width:760px;padding-left:12px;
  border-left:2px solid var(--tc-jade);font-size:12.5px;line-height:1.6;color:var(--tc-muted);
}

.tc-contact a:focus-visible{outline:2px solid var(--tc-jade);outline-offset:2px}

@media (max-width:860px){
  .tc-contact{padding:48px 20px}
  .tc-contact__grid{grid-template-columns:1fr}
  .tc-actions a{width:44px;height:44px}
}
@media (prefers-reduced-motion:reduce){
  .tc-card,.tc-actions a,.tc-cta{transition:none}
}
