/* ==========================================================================
   Lighthouse Mortgage Group - areas-we-serve directory + cross-product blocks
   Added 2026-08-25. Self-contained; nothing here overrides the base theme.
   ========================================================================== */

/* --- county heading in the directory ------------------------------------ */
.lmg-county{
  margin:34px 0 4px;
  padding-bottom:8px;
  border-bottom:2px solid #1f4167;
  font-size:22px;
}
.lmg-county .lmg-county-meta{
  display:block;
  font-size:13px;
  font-weight:400;
  color:#6c838d;
  margin-top:4px;
  letter-spacing:.01em;
}

/* --- card grid ----------------------------------------------------------- */
.lmg-cardgrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin:18px 0 34px;
}
.lmg-card{
  display:block;
  background:#fff;
  border:1px solid #e2e6ea;
  border-left:4px solid #1f4167;
  border-radius:4px;
  padding:18px 20px;
  text-decoration:none !important;
  color:inherit;
  transition:.18s ease;
}
.lmg-card:hover,.lmg-card:focus{
  border-color:#f5a623;
  border-left-color:#f5a623;
  box-shadow:0 6px 18px -10px rgba(31,65,103,.5);
  transform:translateY(-2px);
}
.lmg-card:focus-visible{outline:2px solid #1f4167;outline-offset:3px;}
.lmg-card-title{
  display:block;
  font-weight:700;
  font-size:17px;
  color:#1f4167;
  margin-bottom:6px;
}
.lmg-card-desc{
  display:block;
  font-size:14px;
  line-height:1.55;
  color:#55606b;
  margin-bottom:12px;
}
.lmg-card-links{
  display:block;
  font-size:12.5px;
  color:#6c838d;
  border-top:1px solid #eef1f3;
  padding-top:9px;
}
.lmg-card-links span{white-space:nowrap;}
.lmg-card-links span + span::before{content:"  \00b7  ";color:#c3ccd3;}

/* --- cross-product block on a city page --------------------------------- */
.lmg-alsofor{
  background:#f6f8f9;
  border:1px solid #e2e6ea;
  border-radius:4px;
  padding:20px 24px;
  margin:26px 0 10px;
}
.lmg-alsofor h3{margin:0 0 6px;font-size:18px;color:#1f4167;}
.lmg-alsofor p{margin:0 0 14px;font-size:14.5px;color:#55606b;}
.lmg-alsofor ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.lmg-alsofor li{margin:0;}
.lmg-alsofor a{
  display:block;background:#fff;border:1px solid #dde3e7;border-radius:3px;
  padding:11px 14px;font-size:14px;font-weight:600;color:#1f4167;
  text-decoration:none !important;transition:.18s ease;
}
.lmg-alsofor a:hover,.lmg-alsofor a:focus{border-color:#f5a623;color:#c77b0a;}
.lmg-alsofor a small{display:block;font-weight:400;font-size:12.5px;color:#7b8894;margin-top:2px;}

/* --- framed service-area strip (replaces the old bullet list) ------------ */
.lmg-serve{text-align:center;}
.lmg-serve p.lmg-serve-lead{max-width:760px;margin:0 auto 16px;}
.lmg-serve-links{line-height:2;margin:0 auto;max-width:900px;}
.lmg-serve-links a{white-space:nowrap;}
.lmg-serve-more{margin-top:16px;font-weight:600;}

/* --- county reference table --------------------------------------------- */
.lmg-tablewrap{overflow-x:auto;margin:18px 0 8px;}
.lmg-table{border-collapse:collapse;width:100%;min-width:620px;font-size:14.5px;}
.lmg-table th,.lmg-table td{padding:10px 13px;border-bottom:1px solid #e7ebee;text-align:left;vertical-align:top;}
.lmg-table th{background:#f2f5f6;color:#41525e;font-size:12px;letter-spacing:.08em;text-transform:uppercase;border-bottom:2px solid #d7dee3;}
.lmg-table td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600;color:#1f4167;}
.lmg-table tbody tr:last-child td{border-bottom:0;}
.lmg-source{font-size:12px;color:#7b8894;margin-top:8px;}
.lmg-source a{color:#7b8894;text-decoration:underline;}

/* --- long-tail town cloud ------------------------------------------------ */
.lmg-cloud{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px;}
.lmg-cloud li{margin:0;}
.lmg-cloud span{
  display:inline-block;background:#f2f5f6;border:1px solid #e2e6ea;border-radius:3px;
  padding:5px 11px;font-size:13px;color:#55606b;
}

@media only screen and (max-width:960px){
  .lmg-cardgrid{grid-template-columns:repeat(2,1fr);}
  .lmg-alsofor ul{grid-template-columns:repeat(2,1fr);}
}
@media only screen and (max-width:640px){
  .lmg-cardgrid{grid-template-columns:1fr;}
  .lmg-alsofor ul{grid-template-columns:1fr;}
}

/* --- inline source note (replaces the old bracketed [Source] style) ------ */
.lmg-cite{display:block;margin-top:6px;font-size:12px;color:#7b8894;}
.lmg-cite a{color:#7b8894;text-decoration:underline;}

/* --- on-page table of contents ------------------------------------------ */
.lmg-toc{background:#f6f8f9;border:1px solid #e2e6ea;border-left:4px solid #1f4167;
  border-radius:4px;padding:18px 24px;margin:24px 0;}
.lmg-toc h3{margin:0 0 8px;font-size:17px;color:#1f4167;}
.lmg-toc ul{margin:0;}
.lmg-toc li p{margin:0 0 4px;font-size:14.5px;}
@media only screen and (max-width:640px){ .lmg-toc ul{columns:1;-webkit-columns:1;} }

/* --- performance: keep aspect ratio when width/height attributes are set ---
   The theme sets img{max-width:100%} but no height rule, so intrinsic
   width/height attributes would squash a scaled image. This restores it.
   Specificity 0,0,1 - theme rules that set an explicit height still win. */
img{height:auto;}