/*
 Theme Name:   Nursing Homes Near Me
 Theme URI:    https://nursinghomesnearme.org
 Description:  GeneratePress child theme for NursingHomesNearMe.org
 Author:       NursingHomesNearMe.org
 Author URI:   https://nursinghomesnearme.org
 Template:     generatepress
 Version:      1.0.0
 Text Domain:  nhnm-child
*/

/* ════════════════════════════════════════════════════════
   DESIGN TOKENS
════════════════════════════════════════════════════════ */
:root {
  /* Blues */
  --b:    #1a5fa8;
  --bd:   #0d3d6e;
  --bdd:  #071f3a;
  --bl:   #e8f2fd;
  --bm:   #c2d9f5;
  --b2:   #4a90d9;
  --b3:   #2563eb;
  /* Orange accent */
  --or:   #f97316;
  --ord:  #c2530a;
  --orl:  #fff4ed;
  /* Neutrals */
  --ink:  #0f1923;
  --ink2: #374151;
  --mut:  #6b7280;
  --bg:   #f0f4f9;
  --wh:   #ffffff;
  --bdr:  #d1dce9;
  /* UI */
  --r:    10px;
  --sh:   0 2px 12px rgba(13,61,110,.10);
  --sh2:  0 6px 28px rgba(13,61,110,.14);
  --sh3:  0 12px 48px rgba(13,61,110,.18);
}

/* ════════════════════════════════════════════════════════
   RESET & BASE
════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: 15px;
  line-height: 1.65;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--b); }
a:hover { color: var(--bd); }

img { max-width: 100%; height: auto; }

/* ════════════════════════════════════════════════════════
   TOPBAR / SITE HEADER
════════════════════════════════════════════════════════ */
.site-header,
.nhnm-topbar {
  background: var(--bdd) !important;
  border: none !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.25) !important;
}

.nhnm-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  height: 60px;
  position: sticky;
  top: 0;
  z-index: 1000;
  gap: 20px;
}

/* Logo */
.nhnm-logo {
  font-family: 'Syne', sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: #fff !important;
  text-decoration: none !important;
  letter-spacing: -.02em;
  white-space: nowrap;
  flex-shrink: 0;
}
.nhnm-logo span { color: #93c5fd; }
.nhnm-logo sub {
  font-size: 10px;
  font-weight: 600;
  color: rgba(255,255,255,.45);
  vertical-align: baseline;
  margin-left: 1px;
  font-family: 'Outfit', sans-serif;
  letter-spacing: .02em;
}

/* Nav */
.nhnm-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
  justify-content: center;
  flex-wrap: wrap;
}
.nhnm-nav a {
  color: rgba(255,255,255,.7) !important;
  font-size: 13px;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 7px;
  text-decoration: none !important;
  transition: .15s;
  white-space: nowrap;
}
.nhnm-nav a:hover,
.nhnm-nav a.current-page { color: #fff !important; background: rgba(255,255,255,.1); }

/* States dropdown in nav */
.nhnm-nav .has-dd { position: relative; }
.nhnm-nav .has-dd > a::after { content: ' ▾'; font-size: 10px; }
.nhnm-nav .dd-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: var(--bdd);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  padding: 8px;
  min-width: 180px;
  box-shadow: 0 8px 32px rgba(0,0,0,.3);
  z-index: 200;
  max-height: 400px;
  overflow-y: auto;
}
.nhnm-nav .has-dd:hover .dd-menu { display: block; }
.nhnm-nav .dd-menu a {
  display: block;
  padding: 6px 10px !important;
  border-radius: 5px !important;
}

/* Topbar CTA */
.nhnm-topbar-cta {
  background: var(--or);
  color: #fff !important;
  font-size: 13px;
  font-weight: 700;
  padding: 8px 18px;
  border-radius: 8px;
  text-decoration: none !important;
  white-space: nowrap;
  transition: .15s;
  flex-shrink: 0;
}
.nhnm-topbar-cta:hover { background: var(--ord); color: #fff !important; }

/* Mobile hamburger */
.nhnm-burger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  color: rgba(255,255,255,.8);
}
.nhnm-mobile-menu {
  display: none;
  background: var(--bdd);
  padding: 12px 20px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.nhnm-mobile-menu a {
  display: block;
  color: rgba(255,255,255,.8) !important;
  padding: 10px 0;
  font-size: 14px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  text-decoration: none !important;
}
.nhnm-mobile-menu a:last-child { border-bottom: none; }
.nhnm-mobile-menu.open { display: block; }

/* ════════════════════════════════════════════════════════
   FOOTER
════════════════════════════════════════════════════════ */
.site-footer,
.nhnm-footer {
  background: var(--bdd) !important;
  color: rgba(255,255,255,.6) !important;
}

.nhnm-footer {
  padding: 48px 24px 24px;
}
.nhnm-footer-grid {
  max-width: 960px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  margin-bottom: 24px;
}
.nhnm-footer-brand .nhnm-logo { font-size: 22px; display: block; margin-bottom: 12px; }
.nhnm-footer-brand p {
  font-size: 13px;
  color: rgba(255,255,255,.5);
  line-height: 1.7;
  max-width: 260px;
}
.nhnm-footer-brand .nhnm-footer-email {
  margin-top: 14px;
  font-size: 12px;
  color: rgba(255,255,255,.4);
}
.nhnm-footer-brand .nhnm-footer-email a {
  color: #93c5fd !important;
  text-decoration: none;
}
.nhnm-footer-brand .nhnm-footer-email a:hover { color: #fff !important; text-decoration: underline; }
.nhnm-footer-col h4 {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255,255,255,.4);
  margin-bottom: 14px;
}
.nhnm-footer-col a {
  display: block;
  color: rgba(255,255,255,.65) !important;
  font-size: 13px;
  padding: 4px 0;
  text-decoration: none !important;
  transition: .15s;
}
.nhnm-footer-col a:hover { color: #fff !important; }
.nhnm-footer-bottom {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  color: rgba(255,255,255,.3);
  flex-wrap: wrap;
  gap: 8px;
}
.nhnm-footer-bottom a { color: rgba(255,255,255,.4) !important; text-decoration: none !important; }
.nhnm-footer-bottom a:hover { color: rgba(255,255,255,.7) !important; }

/* ════════════════════════════════════════════════════════
   PAGE LAYOUT OVERRIDES
════════════════════════════════════════════════════════ */
.page-hero {
  background: linear-gradient(135deg, var(--bdd) 0%, var(--bd) 60%, var(--b3) 100%);
  color: #fff;
  padding: 48px 24px 40px;
  text-align: center;
}
.page-hero h1 {
  font-family: 'Syne', sans-serif;
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 800;
  letter-spacing: -.02em;
  margin-bottom: 12px;
  color: #fff !important;
}
.page-hero p {
  font-size: 16px;
  color: rgba(255,255,255,.75);
  max-width: 600px;
  margin: 0 auto;
}

.page-content-wrap {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 24px 60px;
}
.page-content-wrap h2 {
  font-family: 'Syne', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--bd);
  margin: 32px 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--bl);
}
.page-content-wrap h3 { font-size: 18px; color: var(--b); margin: 20px 0 8px; }
.page-content-wrap p { margin-bottom: 14px; color: var(--ink2); line-height: 1.75; }
.page-content-wrap ul,
.page-content-wrap ol { padding-left: 22px; margin-bottom: 14px; color: var(--ink2); }
.page-content-wrap li { margin-bottom: 6px; line-height: 1.7; }
.page-content-wrap a { color: var(--b); font-weight: 600; }
.page-content-wrap strong { color: var(--ink); }

/* ════════════════════════════════════════════════════════
   BLOG / ARTICLE CARDS
════════════════════════════════════════════════════════ */
.nhnm-article-card {
  background: var(--wh);
  border: 1px solid var(--bdr);
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--sh);
  transition: .2s;
  text-decoration: none !important;
  color: inherit;
  display: flex;
  flex-direction: column;
}
.nhnm-article-card:hover { transform: translateY(-3px); box-shadow: var(--sh2); border-color: var(--b); }
.nhnm-article-card .nhnm-ac-img {
  height: 160px;
  background: linear-gradient(135deg, var(--bd), var(--b2));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36px;
}
.nhnm-article-card .nhnm-ac-body { padding: 16px; flex: 1; display: flex; flex-direction: column; }
.nhnm-article-card .nhnm-ac-tag {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--b);
  margin-bottom: 8px;
}
.nhnm-article-card .nhnm-ac-title {
  font-family: 'Syne', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--bd) !important;
  line-height: 1.35;
  margin-bottom: 8px;
  flex: 1;
}
.nhnm-article-card .nhnm-ac-desc {
  font-size: 12px;
  color: var(--mut);
  line-height: 1.6;
  margin-bottom: 12px;
}
.nhnm-article-card .nhnm-ac-read {
  font-size: 12px;
  font-weight: 700;
  color: var(--b) !important;
}

/* ════════════════════════════════════════════════════════
   SINGLE POST (ARTICLE) STYLES
════════════════════════════════════════════════════════ */
.single .entry-title {
  font-family: 'Syne', sans-serif !important;
  font-size: clamp(24px, 4vw, 36px) !important;
  font-weight: 800 !important;
  color: var(--bdd) !important;
  letter-spacing: -.02em;
  line-height: 1.25;
}
.single .entry-content {
  font-size: 16px;
  line-height: 1.8;
  color: var(--ink2);
  max-width: 720px;
}
.single .entry-content h2 {
  font-family: 'Syne', sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: var(--bd);
  margin: 36px 0 14px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--bl);
}
.single .entry-content h3 { font-size: 19px; color: var(--b); margin: 24px 0 10px; font-weight: 700; }
.single .entry-content p { margin-bottom: 18px; }
.single .entry-content ul,
.single .entry-content ol { padding-left: 24px; margin-bottom: 18px; }
.single .entry-content li { margin-bottom: 8px; }
.single .entry-content strong { color: var(--ink); }
.single .entry-content blockquote {
  border-left: 4px solid var(--b);
  background: var(--bl);
  padding: 16px 20px;
  margin: 24px 0;
  border-radius: 0 8px 8px 0;
  font-style: normal;
  color: var(--bd);
  font-weight: 500;
}
.single .entry-content a { color: var(--b); font-weight: 600; }
.single .entry-content a:hover { color: var(--bd); }

/* Article info box */
.nhnm-info-box {
  background: var(--bl);
  border: 1px solid var(--bm);
  border-radius: var(--r);
  padding: 18px 20px;
  margin: 24px 0;
  font-size: 14px;
}
.nhnm-info-box strong { color: var(--bd); }

/* ════════════════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .nhnm-nav { display: none; }
  .nhnm-burger { display: block; }
  .nhnm-topbar-cta { font-size: 12px; padding: 7px 12px; }
  .nhnm-footer-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
  .nhnm-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .nhnm-footer-grid { grid-template-columns: 1fr; }
  .nhnm-topbar { padding: 0 16px; }
}

/* ════════════════════════════════════════════════════════
   GENERATEPRESS FULL-WIDTH OVERRIDE
   This is the definitive fix for GP's sidebar grid.
   GP uses CSS Grid on .site-content with named columns.
   With no-sidebar class, it should collapse — but we
   enforce it with every selector GP might use.
════════════════════════════════════════════════════════ */

/* 1. The site wrapper — remove ALL width constraints */
.site,
.site-container,
#page {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow-x: hidden;
}

/* 2. GP's grid-container — used for header, nav, content wrapper */
.grid-container {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

/* 3. GP's site-content grid — this is the sidebar-causing element */
.site-content,
#content,
.site-content.grid-container {
    display: block !important;   /* kill the grid */
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 4. Content area column — force 100% regardless of grid */
.content-area,
#primary,
.entry-content,
.wp-block-group {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    grid-column: 1 / -1 !important;
}

/* 5. site-main padding/margin */
.site-main,
#main {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* 6. Kill any remaining sidebar space */
.widget-area,
#sidebar,
aside.sidebar {
    display: none !important;
    width: 0 !important;
}

/* 7. GP no-sidebar class — ensure it cascades */
.no-sidebar .content-area,
.no-sidebar #primary,
.full-width-content .content-area {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
}

/* 8. Remove GP's inside navigation / header padding */
.inside-navigation,
.inside-header,
.inside-top-bar {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 9. Page title area — hidden, we do our own */
.page-header,
.singular .page-header,
.entry-header {
    display: none !important;
}

/* 10. Ensure our full-width sections actually span full width */
.nhnm-hero-hp,
.nhnm-trust,
.nhnm-how,
.nhnm-states-section,
.nhnm-cities-section,
.nhnm-articles-section,
.nhnm-cta-section,
.nhnm-topbar,
.nhnm-footer,
.page-hero {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    margin-left: 0 !important;
    margin-right: 0 !important;
}