/* =========================================================
   Footer layout + spacing
   ========================================================= */

/* Hide first and third footer widget areas */
.site-footer .footer-widgets .widget-area:first-child,
.site-footer .footer-widgets .widget-area:last-child {
  display: none;
}

/* Ensure the remaining widget takes full width */
.site-footer .footer-widgets .widget-area {
  width: 100%;
}

/* Hard reset footer spacing */
#colophon.site-footer {
  margin: 0 !important;
  padding: 0 !important;
}

/* Remove padding/margins on footer inner containers */
#colophon .footer-widgets,
#colophon .widget-area,
#colophon .wrap,
#colophon .container,
#colophon .site-footer-inner {
  margin: 0 !important;
  padding: 0 !important;
}

/* Block editor vertical margins */
#colophon .wp-block-columns,
#colophon .wp-block-column,
#colophon p {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Remove unused site-info area */
#colophon .site-info {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Divider line above footer */
#colophon::before {
  content: "";
  display: block;
  width: 100%;
  border-top: 1px solid #ccc;
  margin-bottom: 45px;
}


/* =========================================================
   Page width centering (desktop) + gutters
   ========================================================= */

@media (min-width: 783px) {
  #content,
  .site-content,
  .site-content .wrap,
  .content-area,
  #primary,
  main,
  .site-main {
    float: none !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 890px !important;
    box-sizing: border-box !important;
  }

  #content,
  .site-content,
  .site-content .wrap {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}


/* =========================================================
   Footer: centered + matches page width
   ========================================================= */

#colophon .footer-widgets {
  display: block !important;          /* avoid flex drift */
  max-width: 890px !important;        /* match page max-width */
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px !important;      /* match gutters */
  padding-right: 32px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

/* Remaining widget column behaves like a centered block */
#colophon .footer-widgets .widget-area {
  display: block !important;
  width: 100% !important;
  margin: 0 auto !important;
}

/* Center common block layouts inside the footer widget */
#colophon .footer-widgets .wp-block-columns,
#colophon .footer-widgets .wp-block-column {
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
  text-align: center !important;
}

#colophon .footer-widgets p,
#colophon .footer-widgets a {
  text-align: center !important;
}


/* =========================================================
   Mobile gutters (content + media-text)
   ========================================================= */

@media (max-width: 782px) {
  .wp-block-media-text > .wp-block-media-text__content {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .entry-content,
  .page-content {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}


/* =========================================================
   Forms
   ========================================================= */

form {
  margin: 0 auto;
  padding: 0 16px; /* space from screen edges */
}

form input[type="text"],
form input[type="email"],
form textarea {
  display: block !important;
  width: 100% !important;
  max-width: 650px;               /* unified field width */
  margin: 0 auto 16px !important; /* centered + spacing */
  box-sizing: border-box !important;
}

form textarea {
  resize: vertical; /* or: none; */
}

/* Mobile: intentionally narrower fields */
@media (max-width: 600px) {
  form input[type="text"],
  form input[type="email"],
  form textarea {
    max-width: 320px;
  }
}


/* =========================================================
   Responsive images
   ========================================================= */

img,
.header-image img,
.hero img {
  max-width: 100%;
  height: auto;
  display: block;
}


/* =========================================================
   Mobile menu button label override
   ========================================================= */

.menu-toggle {
  position: relative;
  padding: 12px 20px;
  min-width: 160px;
  text-align: center;

  /* Hide original "Menu" text */
  overflow: hidden;
  white-space: nowrap;
  text-indent: -9999px;
}

/* Replace label */
.menu-toggle::after {
  content: "Learn More";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  color: inherit;
  font: inherit;
  font-weight: 400;
  letter-spacing: 0.02em;
  text-indent: 0;
  pointer-events: none;
}

/* Force consistent background across states */
.menu-toggle,
.menu-toggle:hover,
.menu-toggle:focus,
.menu-toggle:active,
.menu-toggle.toggled,
.menu-toggle.is-active {
  background-color: #2f371d;
}


/* =========================================================
   Prevent horizontal clipping
   ========================================================= */

#page,
.site {
  overflow-x: visible !important;
}


/* =========================================================
   Footer/background color unification
   ========================================================= */

html,
body {
  background: #f6f2ea !important;
}

/* Theme-agnostic footer wrappers */
footer,
[id*="footer"],
[class*="footer"],
[id*="colophon"],
[class*="colophon"],
[id*="site-info"],
[class*="site-info"],
[id*="copyright"],
[class*="copyright"],
[id*="socket"],
[class*="socket"],
[id*="credits"],
[class*="credits"] {
  background: #f6f2ea !important;
  background-image: none !important;
}

/* Remove inner boxed backgrounds */
footer *,
[id*="footer"] *,
[class*="footer"] *,
[id*="colophon"] *,
[class*="colophon"] * {
  background-color: transparent !important;
}

/* Keep text readable */
footer,
footer a,
[id*="footer"],
[id*="footer"] a,
[class*="footer"],
[class*="footer"] a {
  color: inherit;
}
/* =========================================================
   Full-width CTA using an existing Group block
   ========================================================= */

.full-width-band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);

  background: #2f371d;   /* your CTA background */
  color: #ffffff;

  padding: 64px 0;
}

/* Keep CTA content aligned with page width */
.full-width-band > * {
  max-width: 890px;      /* match your site */
  margin-left: auto;
  margin-right: auto;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}

/* Mobile */
@media (max-width: 782px) {
  .full-width-band {
    padding: 48px 0;
  }

  .full-width-band > * {
    padding-left: 16px;
    padding-right: 16px;
  }
}
/* =========================================================
   CTA band: center the actual Gutenberg Columns container
   (Columns → Column → Group)
   ========================================================= */

/* 1) Make the band a centering context */
.full-width-band{
  display: flex !important;
  justify-content: center !important;
}

/* 2) Center the Columns block and lock it to your site width */
.full-width-band .wp-block-columns{
  width: 100% !important;
  max-width: 890px !important;     /* match your site */
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px !important;   /* match your gutters */
  padding-right: 32px !important;
  box-sizing: border-box !important;
}

/* 3) Center everything inside the column/group */
.full-width-band .wp-block-column,
.full-width-band .wp-block-group{
  width: 100% !important;
  text-align: center !important;
}

/* 4) Buttons are flex-based: center them explicitly */
.full-width-band .wp-block-buttons{
  justify-content: center !important;
}

/* Mobile gutters */
@media (max-width: 782px){
  .full-width-band .wp-block-columns{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
/* =========================================================
   Footer layout + spacing
   ========================================================= */

/* Hide first and third footer widget areas */
.site-footer .footer-widgets .widget-area:first-child,
.site-footer .footer-widgets .widget-area:last-child {
  display: none;
}

/* Ensure the remaining widget takes full width */
.site-footer .footer-widgets .widget-area {
  width: 100%;
}

/* Hard reset footer spacing */
#colophon.site-footer {
  margin: 0 !important;
  padding: 0 !important;
}

/* Remove padding/margins on footer inner containers */
#colophon .footer-widgets,
#colophon .widget-area,
#colophon .wrap,
#colophon .container,
#colophon .site-footer-inner {
  margin: 0 !important;
  padding: 0 !important;
}

/* Block editor vertical margins */
#colophon .wp-block-columns,
#colophon .wp-block-column,
#colophon p {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Remove unused site-info area */
#colophon .site-info {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Divider line above footer */
#colophon::before {
  content: "";
  display: block;
  width: 100%;
  border-top: 1px solid #ccc;
  margin-bottom: 45px;
}


/* =========================================================
   Page width centering (desktop) + gutters
   ========================================================= */

@media (min-width: 783px) {
  #content,
  .site-content,
  .site-content .wrap,
  .content-area,
  #primary,
  main,
  .site-main {
    float: none !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 890px !important;
    box-sizing: border-box !important;
  }

  #content,
  .site-content,
  .site-content .wrap {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}


/* =========================================================
   Footer: centered + matches page width
   ========================================================= */

#colophon .footer-widgets {
  display: block !important;          /* avoid flex drift */
  max-width: 890px !important;        /* match page max-width */
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px !important;      /* match gutters */
  padding-right: 32px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

/* Remaining widget column behaves like a centered block */
#colophon .footer-widgets .widget-area {
  display: block !important;
  width: 100% !important;
  margin: 0 auto !important;
}

/* Center common block layouts inside the footer widget */
#colophon .footer-widgets .wp-block-columns,
#colophon .footer-widgets .wp-block-column {
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
  text-align: center !important;
}

#colophon .footer-widgets p,
#colophon .footer-widgets a {
  text-align: center !important;
}


/* =========================================================
   Mobile gutters (content + media-text)
   ========================================================= */

@media (max-width: 782px) {
  .wp-block-media-text > .wp-block-media-text__content {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .entry-content,
  .page-content {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}


/* =========================================================
   Forms
   ========================================================= */

form {
  margin: 0 auto;
  padding: 0 16px; /* space from screen edges */
}

form input[type="text"],
form input[type="email"],
form textarea {
  display: block !important;
  width: 100% !important;
  max-width: 650px;               /* unified field width */
  margin: 0 auto 16px !important; /* centered + spacing */
  box-sizing: border-box !important;
}

form textarea {
  resize: vertical; /* or: none; */
}

/* Mobile: intentionally narrower fields */
@media (max-width: 600px) {
  form input[type="text"],
  form input[type="email"],
  form textarea {
    max-width: 320px;
  }
}


/* =========================================================
   Responsive images
   ========================================================= */

img,
.header-image img,
.hero img {
  max-width: 100%;
  height: auto;
  display: block;
}


/* =========================================================
   Mobile menu button label override
   ========================================================= */

.menu-toggle {
  position: relative;
  padding: 12px 20px;
  min-width: 160px;
  text-align: center;

  /* Hide original "Menu" text */
  overflow: hidden;
  white-space: nowrap;
  text-indent: -9999px;
}

/* Replace label */
.menu-toggle::after {
  content: "Learn More";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  color: inherit;
  font: inherit;
  font-weight: 400;
  letter-spacing: 0.02em;
  text-indent: 0;
  pointer-events: none;
}

/* Force consistent background across states */
.menu-toggle,
.menu-toggle:hover,
.menu-toggle:focus,
.menu-toggle:active,
.menu-toggle.toggled,
.menu-toggle.is-active {
  background-color: #2f371d;
}


/* =========================================================
   Prevent horizontal drift (IMPORTANT for footer centering)
   ========================================================= */

/* The CTA uses 100vw; clipping prevents tiny overflow that shifts "center" */
html,
body {
  overflow-x: clip;
}

/* Override your earlier setting that caused drift */
#page,
.site {
  overflow-x: clip !important;
}


/* =========================================================
   Footer/background color unification
   ========================================================= */

html,
body {
  background: #f6f2ea !important;
}

/* Theme-agnostic footer wrappers */
footer,
[id*="footer"],
[class*="footer"],
[id*="colophon"],
[class*="colophon"],
[id*="site-info"],
[class*="site-info"],
[id*="copyright"],
[class*="copyright"],
[id*="socket"],
[class*="socket"],
[id*="credits"],
[class*="credits"] {
  background: #f6f2ea !important;
  background-image: none !important;
}

/* Remove inner boxed backgrounds */
footer *,
[id*="footer"] *,
[class*="footer"] *,
[id*="colophon"] *,
[class*="colophon"] * {
  background-color: transparent !important;
}

/* Keep text readable */
footer,
footer a,
[id*="footer"],
[id*="footer"] a,
[class*="footer"],
[class*="footer"] a {
  color: inherit;
}


/* =========================================================
   Full-width CTA using an existing Group block
   ========================================================= */

.full-width-band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);

  background: #2f371d;   /* your CTA background */
  color: #ffffff;

  padding: 64px 0;
}

/* Keep CTA content aligned with page width */
.full-width-band > * {
  max-width: 890px;      /* match your site */
  margin-left: auto;
  margin-right: auto;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}

/* Mobile */
@media (max-width: 782px) {
  .full-width-band {
    padding: 48px 0;
  }

  .full-width-band > * {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* =========================================================
   CTA band: center the actual Gutenberg Columns container
   (Columns → Column → Group)
   ========================================================= */

.full-width-band{
  display: flex !important;
  justify-content: center !important;
}

.full-width-band .wp-block-columns{
  width: 100% !important;
  max-width: 890px !important;     /* match your site */
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px !important;   /* match your gutters */
  padding-right: 32px !important;
  box-sizing: border-box !important;
}

.full-width-band .wp-block-column,
.full-width-band .wp-block-group{
  width: 100% !important;
  text-align: center !important;
}

.full-width-band .wp-block-buttons{
  justify-content: center !important;
}

@media (max-width: 782px){
  .full-width-band .wp-block-columns{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}


/* =========================================================
   Footer hard-center failsafe (in case theme adds wrappers)
   ========================================================= */

#colophon,
#colophon .wrap,
#colophon .container,
#colophon .site-footer-inner {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* Center the actual visible footer content column again */
#colophon .footer-widgets {
  max-width: 890px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
}

@media (max-width: 782px){
  #colophon .footer-widgets{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
/* =========================================================
   FIX: keep CTA height, remove the EMPTY BLOCK gap after it
   ========================================================= */

/* Keep CTA height exactly as designed */
.full-width-band{
  padding: 64px 0 !important;
  margin-bottom: 0 !important;
}

/* Mobile CTA height */
@media (max-width: 782px){
  .full-width-band{ padding: 48px 0 !important; }
}
#colophon::before{
  margin-bottom: 0 !important;
}
/* =========================================================
   FINAL: remove gap + faint line between CTA and footer
   ========================================================= */

/* 1) Keep CTA height as-is (prevents accidental shrink) */
.full-width-band { padding: 64px 0 !important; }
@media (max-width: 782px){ .full-width-band { padding: 48px 0 !important; } }

/* 2) Nuke *all* spacing/borders on any blocks that come AFTER the CTA
      (inside the page content only) */
.entry-content .full-width-band ~ *,
.page-content  .full-width-band ~ *{
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 3) Specifically remove any Spacer/Separator blocks that appear after the CTA */
.entry-content .full-width-band ~ .wp-block-spacer,
.entry-content .full-width-band ~ .wp-block-separator,
.page-content  .full-width-band ~ .wp-block-spacer,
.page-content  .full-width-band ~ .wp-block-separator{
  display: none !important;
  height: 0 !important;
}

/* 4) Remove the footer divider line you added */
#colophon::before{
  display: none !important;
  content: none !important;
  border: 0 !important;
  margin: 0 !important;
}

/* 5) Ensure footer has no top border/spacing from theme */
#colophon,
#colophon.site-footer,
.site-footer{
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}
/* =========================================================
   Remove the empty sidebar that is creating the white gap
   ========================================================= */

/* Hide empty sidebar container entirely */
#secondary.widget-area:empty {
  display: none !important;
}

/* In case it isn't technically "empty" (whitespace nodes), still remove it */
#secondary.widget-area {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
}

/* Ensure the main wrappers don't reserve space for sidebar layouts */
#content.site-content,
#primary.content-area,
#main.site-main,
article,
.entry-content {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
}

/* If the theme uses floats for primary/secondary, clear them cleanly */
#primary.content-area {
  float: none !important;
  width: 100% !important;
}
/* =========================================================
   Footer background color
   ========================================================= */

#colophon,
.site-footer,
footer {
  background-color: #9fa493 !important;
}

/* Ensure inner footer areas inherit the same background */
#colophon .footer-widgets,
#colophon .wrap,
#colophon .container,
#colophon .site-footer-inner {
  background-color: transparent !important;
}
/* =========================================================
   REMOVE the content block BETWEEN CTA and footer
   (so green bands touch)
   ========================================================= */

/* Remove the empty entry-footer + any spacing it creates */
.entry-footer {
  display: none !important;
}

/* Collapse anything left after the CTA inside the post */
.entry-content > .full-width-band ~ * {
  display: none !important;
}

/* Safety: ensure footer sits directly after content */
#colophon,
.site-footer {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* =========================================================
   FINAL: pull footer up to eliminate remaining white band
   ========================================================= */

/* Lift the footer to cover the white space */
#colophon.site-footer {
  margin-top: -64px !important;   /* adjust if needed */
  padding-top: 64px !important;   /* preserves footer breathing room */
}

/* Mobile: slightly smaller lift */
@media (max-width: 782px){
  #colophon.site-footer {
    margin-top: -48px !important;
    padding-top: 48px !important;
  }
}
/* Undo footer overlap so a spacer gap can appear */
#colophon.site-footer{
  margin-top: 0 !important;
}