/*
Theme Name: Responsive SP
Template: responsive
Description: SyndicatePath redesign child theme implementing the 2026-07-07 mood board (institutional calm with a forward lean).
Version: 0.1.6
Author: Eve (PAI)
Last Updated: 2026-07-07
*/

:root {
  --sp-navy: #12314F;
  --sp-portal-blue: #10659C;
  --sp-slate-ink: #22303C;
  --sp-amber: #E8A33D;
  --sp-path-blue: #0066CC;
  --sp-teal: #1EA8A0;
  --sp-graphite: #1F2A33;
  --sp-steel: #5B6B77;
  --sp-mist: #E3E8EC;
  --sp-paper: #F6F8FA;
}

/* Typography */
body, input, textarea, select {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  color: var(--sp-graphite);
  font-size: 17px;
  line-height: 1.65;
}
h1, h2, h3, h4, h5, h6,
.site-title, .entry-title, .post-title, .page-title {
  font-family: 'Fraunces', Georgia, 'Times New Roman', serif;
  color: var(--sp-navy);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
h1 { font-size: 2.6rem; }
h2 { font-size: 1.9rem; }
h3 { font-size: 1.4rem; }

/* Header: quiet authority surface */
.site-header, #masthead, #masthead-mobile {
  background-color: var(--sp-navy) !important;
  border-bottom: none;
}
.site-header a, .site-header .site-title a,
.main-navigation a, .main-navigation .menu-item a {
  color: #FFFFFF !important;
  font-family: 'Inter', sans-serif;
  font-weight: 500;
}
.main-navigation .current-menu-item > a,
.main-navigation .menu-item a:hover {
  color: var(--sp-amber) !important;
}
.menu-toggle { color: #FFFFFF; }

/* Links */
a { color: var(--sp-path-blue); }
a:hover { color: var(--sp-portal-blue); }

/* CTAs: Signal Amber means act here, dark text for AA contrast */
.button, button[type="submit"], input[type="submit"],
.wp-block-button__link, .elementor-button, .more-link {
  background-color: var(--sp-amber) !important;
  color: var(--sp-slate-ink) !important;
  border: none !important;
  border-radius: 6px;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  padding: 0.7em 1.5em;
  text-decoration: none;
  transition: background-color 0.15s ease;
}
.button:hover, button[type="submit"]:hover, input[type="submit"]:hover,
.wp-block-button__link:hover, .elementor-button:hover {
  background-color: #D8922C !important;
}

/* Content surfaces */
.site-content, #content { background-color: #FFFFFF; }
.hentry, .entry-content { color: var(--sp-graphite); }
blockquote {
  border-left: 3px solid var(--sp-teal);
  background: var(--sp-paper);
  padding: 1em 1.25em;
  color: var(--sp-slate-ink);
}
table th { background: var(--sp-navy); color: #fff; }
table td { border-color: var(--sp-mist); }

/* Footer */
.site-footer, #footer {
  background-color: var(--sp-slate-ink) !important;
  color: var(--sp-mist);
}
.site-footer a, #footer a { color: var(--sp-mist); }
.site-footer a:hover, #footer a:hover { color: var(--sp-amber); }
.footer-widget-area { color: var(--sp-mist); }

/* Retire Gutenberg default palette leftovers */
.has-luminous-vivid-orange-color, .has-luminous-vivid-amber-color { color: var(--sp-amber) !important; }
.has-vivid-red-color { color: var(--sp-navy) !important; }

/* Innovation accents */
::selection { background: var(--sp-teal); color: #fff; }

/* v0.1.1: nav row painted white by restored customizer settings; navy owns the whole header surface */
.main-navigation,
.main-navigation .main-navigation-wrapper,
.site-header-row .main-navigation .main-navigation-wrapper,
.main-navigation.toggled,
.site-header-item-toggle-button .menu-toggle {
  background-color: var(--sp-navy) !important;
}
/* dropdown submenus stay white surfaces, so their links must be dark */
.main-navigation .sub-menu a,
.main-navigation .children a {
  color: var(--sp-navy) !important;
}
.main-navigation .sub-menu a:hover,
.main-navigation .children a:hover {
  color: var(--sp-portal-blue) !important;
}

/* v0.1.2: equal-height columns; uneven text lengths no longer break alignment */
.wp-block-columns.is-layout-flex { align-items: stretch !important; }
.wp-block-columns .wp-block-column {
  display: flex;
  flex-direction: column;
}
/* last element in each column (CTA/link) pins to the bottom edge */
.wp-block-columns .wp-block-column > :last-child { margin-top: auto; }
.wp-block-columns .wp-block-column > h1,
.wp-block-columns .wp-block-column > h2,
.wp-block-columns .wp-block-column > h3 { min-height: 2.6em; }

/* v0.1.3: logo lockup, mark + Fraunces wordmark (option b) */
.custom-logo-link {
  display: flex !important;
  align-items: center;
  gap: 14px;
  text-decoration: none;
}
.custom-logo {
  max-height: 56px;
  width: auto !important;
  height: auto;
}
.sp-wordmark {
  font-family: 'Fraunces', Georgia, serif;
  font-size: 1.55rem;
  font-weight: 600;
  color: #FFFFFF;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.site-header-mobile .custom-logo { max-height: 42px; }
.site-header-mobile .sp-wordmark { font-size: 1.2rem; }

/* v0.1.4: paint the full header surface navy; branding row was rendering white, hiding the white wordmark */
#masthead,
#masthead-mobile,
.responsive-site-primary-header-wrap,
.site-header-row-container,
.site-header-row-container-inner,
.site-header-inner-wrap,
.site-header-row,
.site-header-section {
  background-color: var(--sp-navy) !important;
}

/* active menu item: amber underline instead of white pill */
.main-navigation .menu .current-menu-item > a,
.main-navigation .menu .current_page_item > a {
  background-color: transparent !important;
  box-shadow: inset 0 -3px 0 var(--sp-amber);
}

/* v0.1.5: three-column pathway cards, equalized */
.wp-block-columns .wp-block-column > h2.wp-block-heading.has-background {
  background-color: var(--sp-navy) !important;
  color: #FFFFFF !important;
  min-height: 3.6em;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 6px 6px 0 0;
  margin-bottom: 0;
  padding: 0.6em 1em !important;
  font-family: 'Fraunces', Georgia, serif;
}
.wp-block-columns .wp-block-column > .wp-block-separator {
  display: none; /* separators created the uneven gaps between heading and text */
}
.wp-block-columns .wp-block-column > p.has-background {
  background-color: var(--sp-paper) !important;
  color: var(--sp-graphite) !important;
  flex-grow: 1;               /* all three text panels stretch to equal height */
  margin-top: 0;
  border: 1px solid var(--sp-mist);
  border-top: 3px solid var(--sp-teal);
  border-radius: 0 0 6px 6px;
  padding: 1.25em 1.35em !important;
}
.wp-block-columns .wp-block-column > .wp-block-buttons {
  margin-top: 1.1em;
  padding-bottom: 0.25em;
}

/* v0.1.6: news + InvestInVets side by side; Jessica compact */
.elementor-element-41d6337 > .e-con-inner {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 36px;
  align-items: stretch;
}
.elementor-element-41d6337 > .e-con-inner > .elementor-element-b9c8d7e { min-width: 0; }
.sp-vcf-feature {
  background: var(--sp-navy);
  border-radius: 10px;
  padding: 2em 2.2em;
  color: #fff;
  display: flex;
}
.sp-vcf-inner { display: flex; flex-direction: column; }
.sp-vcf-kicker {
  color: var(--sp-teal);
  font-family: 'Inter', sans-serif;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 0.3em;
}
.sp-vcf-title { color: #fff !important; font-size: 2rem; margin: 0 0 0.4em; }
.sp-vcf-copy { color: var(--sp-mist); line-height: 1.6; }
.sp-vcf-points { color: #fff; margin: 0.6em 0 1.2em 1.1em; padding: 0; }
.sp-vcf-points li { margin-bottom: 0.45em; }
.sp-vcf-cta {
  background-color: var(--sp-amber);
  color: var(--sp-slate-ink) !important;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  padding: 0.7em 1.5em;
  border-radius: 6px;
  text-decoration: none;
  align-self: flex-start;
  margin-top: auto;
}
.sp-vcf-cta:hover { background-color: #D8922C; }
/* Jessica: full row beneath, capped at half width */
.elementor-element-41d6337 > .e-con-inner > .elementor-element-f6e5d4c {
  grid-column: 1 / -1;
  max-width: 540px;
  margin: 0.5em auto 0;
  width: 100%;
}
@media (max-width: 900px) {
  .elementor-element-41d6337 > .e-con-inner { grid-template-columns: 1fr; }
}
