
/* ===== IRA GUIDES: clean layout ===== */

/* Safety + typography */
#guides-map .card, #guides-map .panel { min-width:0; }
#guides-map img { max-width:100%; height:auto; display:block; }
#guides-map .muted { color:#6b7280; }
#guides-map h2{margin:0 0 1rem}
#guides-map h3{margin:0 0 1rem;font-size:1rem}
#guides-map h4{margin:0 0 1rem;font-size:.95rem}

/* Inner padding parity with site cards */
#guides-map .card > .pad, #guides-map .panel > .pad { padding:16px; }

/* Hero image */
#guides-map .hero-card .hero-img{
  display:block; margin:0 auto 12px; max-width:620px; height:auto; border-radius:8px;
}

/* Buttons row */
#guides-map .cta-row{display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.5rem}

/* Split cards (image on top) */
#guides-map .split-card{display:grid; grid-template-rows:auto 1fr;}
#guides-map .split-card > img{
  border-bottom:1px solid #e5e7eb; border-top-left-radius:12px; border-top-right-radius:12px;
}

/* ===== GRID LAYOUT ===== */

/* Mobile / tablet */
#guides-map{
  display:grid; grid-template-columns:1fr; gap:16px; margin:8px auto 28px; max-width:1046px;
}

/* Desktop */
@media (min-width:1024px){
  /* Two columns for hero + right rail */
  #guides-map{
    grid-template-columns:minmax(640px,1fr) 380px;
    gap:16px;
  }

  /* Row mapping */
  #guides-map .hero-card    { grid-column:1/2; grid-row:1; }
  #guides-map .recent-guides{ grid-column:2/3; grid-row:1 / span 2; } /* sits beside hero + fact */
  #guides-map .g-fact       { grid-column:1/2; grid-row:2; }

  /* Three-up row spans both columns and creates its own 3-column grid */
  #guides-map .three-up{
    grid-column:1 / 3; grid-row:3;
    display:grid; grid-template-columns:repeat(3, 1fr); gap:16px;
  }

  /* Two-up row spans both columns and creates its own 2-column grid */
  #guides-map .two-up{
    grid-column:1 / 3; grid-row:4;
    display:grid; grid-template-columns:repeat(2, 1fr); gap:16px;
  }

  /* Archive footer card — always last, full width */
  #guides-map .archive{ grid-column:1/3; grid-row:4; }
}

/* “Our Latest Guides” visuals */
.recent-guides .latest{ display:block; }
.recent-guides .latest img{
  width:100%; height:auto; border-radius:8px; margin:0 0 8px; display:block;
}
.recent-guides .latest div{ margin:0; }
.recent-guides .latest strong{ margin-bottom:4px; display:block; }
.recent-guides .latest p{ margin:0; color:#6b7280; font-size:.92rem; }

.unified-heading {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

/* === Updated Button Colors (from hero palette) === */
.btn.btn-primary {
  background: #3f6e91;   /* medium slate-blue */
  color: #fff;
  border: 1px solid #3f6e91;
}
.btn.btn-primary:hover {
  filter: brightness(1.1);
}

.btn.btn-secondary {
  background: #9bb6cc;   /* lighter desaturated blue */
  color: #0f172a;        /* dark navy text for contrast */
  border: 1px solid #9bb6cc;
}
.btn.btn-secondary:hover {
  filter: brightness(1.05);
}

