/* Homemade Hope - Clean Reset Styles */

/* Reset */
html, body {
  margin: 0;
  padding: 0;
}
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; height: auto; }

/* Layout helpers */
.container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

/* Header / Banner / Nav */
.site-header {
  margin: 0;
  padding: 0;
}

.banner {
  margin: 0;
  padding: 0;
}

.site-logo {
  display: block;          /* removes the tiny gap under images */
  width: 100%;
  height: auto;
}

.brand-sub {
  text-align: center;
  padding: 8px 12px;
  font-size: 0.95rem;
}

.site-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  justify-content: center;
  align-items: center;
  padding: 10px 12px 12px;
}

.site-nav a {
  text-decoration: none;
  font-weight: 600;
  padding: 6px 8px;
  border-radius: 6px;
}

.site-nav a:hover {
  text-decoration: underline;
}

/* Page */
.page { margin: 0; padding: 0; }

/* Hero */
.hero {
  margin: 0;
  padding: 0;
}

.hero img {
  display: block;          /* removes gap */
  width: 100%;
}

.hero-caption {
  max-width: 1100px;
  margin: 0 auto;
  padding: 18px 16px 24px;
}

.hero-caption h1 {
  margin: 0 0 8px;
  font-size: 1.8rem;
}

.lead {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.45;
}

/* Footer */
.site-footer {
  padding: 18px 0 24px;
}

.site-footer p {
  margin: 0;
  text-align: center;
}

/* Mobile tweaks */
@media (max-width: 600px) {
  .brand-sub { font-size: 0.9rem; }
  .hero-caption h1 { font-size: 1.5rem; }
}


/* ===== Header / Nav ===== */
.topbar { padding: 0; margin: 0; }
.brand { padding: 0; margin: 0; }
.brand-sub { text-align: center; padding: 8px 0 6px; }
.site-nav { padding: 10px 0 14px; }
.site-nav a { text-decoration: none; padding: 6px 10px; border-radius: 6px; }
.site-nav a:hover { background: rgba(0,0,0,0.06); }

/* ===== Main ===== */
.main { padding: 18px 0 30px; }
.section { padding: 18px 0 6px; }
.section h1 { margin: 0 0 8px; }
.section h2 { margin: 0 0 8px; }
.lead { font-size: 1.1rem; margin-top: 6px; }

/* ===== Cards / Grids ===== */
.card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 16px;
}
.card {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  overflow: hidden;
}
.card-img{
  width: 100%;
  height: 220px;
  object-fit: contain;
  background: #f6f6f6;
  padding: 8px;
  display: block;
}
.card-body { padding: 12px 12px 14px; }
.card-body h3 { margin: 0 0 6px; }
.card-body p { margin: 0; line-height: 1.35; }

/* ===== Two column ===== */
.two-col {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 22px;
  align-items: start;
  margin-top: 14px;
}

/* ===== Staff ===== */
.staff-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 14px;
}
.staff-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 14px;
}
.staff-card h3 { margin: 0 0 6px; }

/* ===== Insurance logos ===== */
.logo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 16px;
}
.logo-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  overflow: hidden;
}
.logo-img{
  width: 100%;
  height: 130px;
  object-fit: contain;
  background: #f6f6f6;
  padding: 8px;
  display: block;
}
.logo-text { padding: 12px 12px 14px; }
.logo-text h3 { margin: 0 0 6px; }
.logo-text p { margin: 0; }

/* ===== Images ===== */
.wide-img{
  width: 100%;
  height: auto;
  max-height: 420px;
  object-fit: cover;
  display: block;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.06);
}
.muted { color: rgba(0,0,0,0.65); }

/* ===== Responsive ===== */
@media (max-width: 900px) {
  .card-grid, .staff-grid, .logo-grid { grid-template-columns: 1fr; }
  .two-col { grid-template-columns: 1fr; }
  .card-img { height: 200px; }
}

/* --- Center text under Insurance logos  */
.insurance-grid img,
.insurance-logos ,
.insurance-card ,
.logo-card img {
	text-align: center !important;
}

.insurance-grid h3;
.insurance-logos h3;
.insurance-card  h3;
.logo-card img  h3;
.insurance-grid p;
.insurance-logos p;
.insurance-card p;
.logo-card img p {
	text-align: center !important;
}



/* --- FIX: Insurance logos show full image (no crop) --- */
.insurance-grid img,
.insurance-logos img,
.insurance-card img,
.logo-card img {
  width: 100% !important;
  height: auto !important;          /* allow full height */
  object-fit: contain !important;  /* never crop */
  object-position: center !important;
  max-height: 140px !important;    /* adjust if you want bigger/smaller */
  background: transparent !important;
}


/* =========================================================
   FINAL TARGETED FIXES
   (Insurance logos + Services images ONLY)
   ========================================================= */

/* ---- Insurance logos: full image, no crop, reasonable size ---- */
.logo-grid img,
.logo-card img,
.insurance-grid img,
.insurance-logos img {
  width: 100% !important;
  height: auto !important;
  max-height: 160px !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 auto !important;
}

/* Stop any wrapper from clipping logos */
.logo-grid,
.logo-card,
.insurance-grid,
.insurance-logos {
  overflow: visible !important;
}

/* Center text under insurance logos */
.logo-card,
.logo-card h3,
.logo-card p,
.insurance-grid,
.insurance-grid h3,
.insurance-grid p {
  text-align: center !important;
}

/* ---- Services + Approaches images: restore proper size, no crop ---- */
.card-img {
  width: 100% !important;
  height: auto !important;
  max-height: 220px !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 auto !important;
  padding: 0 !important;
}