.container-header {
  background-color: white;
  background-image: none;
}
.container-topbar {
  max-width: 1320px;
  margin-left: auto;
  margin-right: auto;
 }
h1 {
    color: rgba(25, 25, 112, .75);
    font-size: 1.2em;
}
.container-header {
height: 140px;
}
/* arizonabirds.com — mobile column order */
@media (max-width: 991.98px) {
  /* Flex the real parent */
  body.site.has-sidebar-left.has-sidebar-right .site-grid {
    display: flex !important;
    flex-direction: column !important;
  }

  /* MAIN first */
  body.site.has-sidebar-left.has-sidebar-right .site-grid > .container-component {
    order: 1 !important;
    width: 100% !important;
  }

  /* LEFT second */
  body.site.has-sidebar-left.has-sidebar-right .site-grid > .container-sidebar-left {
    order: 2 !important;
    width: 100% !important;
  }

  /* RIGHT third */
  body.site.has-sidebar-left.has-sidebar-right .site-grid > .container-sidebar-right {
    order: 3 !important;
    width: 100% !important;
  }
}
/* Change Cassiopeia footer background to white */
.container-footer {
    background-color: #ffffff !important;
}

/* Force Cassiopeia footer background to white */
footer.footer.container-footer,
.container-footer,
.container-footer .grid-child {
  background: #ffffff !important;
  background-image: none !important; /* kill any gradients */
}

/* Make footer text/links dark on the white background */
.container-footer,
.container-footer a {
  color: #111 !important;
}
/* 1) Kill the gradient on the footer itself */
.footer.container-footer {
  background: #fff !important;
  background-image: none !important;
}

/* 2) Nuke any “card/module” box backgrounds inside the footer */
.footer .card,
.footer .card-body,
.footer .moduletable,
.footer .moduletable > div,
.footer .grid-child {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* 3) Keep footer text/links dark on white */
.footer.container-footer,
.footer.container-footer a {
  color: #111 !important;
}
/* Force the footer itself to white, no gradient */
footer.footer.container-footer {
  background: #fff !important;
  background-image: none !important;
}
/* Nuke “boxed/blue” module backgrounds inside the footer */
footer.footer.container-footer .card,
footer.footer.container-footer .card-body,
footer.footer.container-footer .moduletable,
footer.footer.container-footer .grid-child,
footer.footer.container-footer .bg-primary,
footer.footer.container-footer .text-bg-primary {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Keep footer text/links dark */
footer.footer.container-footer,
footer.footer.container-footer a {
  color: #111 !important;
  }
/* --- TEMP: nuke *all* backgrounds inside the footer --- */
footer.footer.container-footer,
footer.footer.container-footer *,
footer.footer.container-footer *::before,
footer.footer.container-footer *::after {
  background: transparent !important;
  background-image: none !important;
}

/* Bootstrap helpers that often cause the blue box */
footer.footer.container-footer [class*="bg-"],
footer.footer.container-footer [class*="text-bg-"] {
  background: transparent !important;
  background-image: none !important;
}

/* Cards/module chrome sometimes carry their own vars */
footer.footer.container-footer .card {
  --bs-card-bg: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Keep the footer itself white and text dark */
footer.footer.container-footer { background: #fff !important; }
footer.footer.container-footer, 
footer.footer.container-footer a { color: #111 !important; }
/* Reduce the space above the footer */
footer.footer.container-footer {
  margin-top: 0 !important;   /* or try 0.5em for a little breathing room */
  padding-top: 0 !important;  /* optional if you want the white box tighter */
}
/* A) Stop margin-collapsing and kill any footer top margin */
footer.footer.container-footer {
  /* stops the article's bottom margin from collapsing into the footer */
  padding-top: 1px !important;    /* you won't see 1px, it's just to break collapse */
  margin-top: 0 !important;
  overflow: auto !important;       /* also prevents margin-collapsing */
}

/* B) If the gap comes from the article/content container */
.container-component,
.item-page,
.com-content-article,
.blog {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* C) If Cassiopeia's grid is adding a row gap above the footer */
.site-grid {
  row-gap: 0 !important;
  gap: 0 !important; /* shorthand in case both are set */
}

/* D) Absolute override for any template margin on .footer */
.footer {
  margin-top: 0 !important;
}
/* PACK UP THE SPACE *ABOVE* THE FOOTER */

/* 1) If a bottom module row exists, remove its spacing */
.container-bottom-a,
.container-bottom-b {
  margin: 0 !important;
  padding: 0 !important;
}

/* 2) Remove the grid row gap between content and footer */
.site-grid {
  row-gap: 0 !important;
  gap: 0 !important; /* handles older/newer definitions */
  --cassiopeia-grid-gutter-y: 0 !important; /* safety for custom var */
}

/* 3) Kill bottom margins on the last element of the main content */
.container-component,
.container-component .grid-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.container-component > *:last-child,
.container-component .grid-child > *:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* 4) Common culprits in articles/blogs: last paragraph/cards leaving a gap */
.container-component p:last-child,
.container-component .item-page > *:last-child,
.container-component .blog > *:last-child,
.container-component .moduletable:last-child,
.container-component .card:last-child,
.container-component .card-body:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* 5) As an absolute fallback, zero any grid-child right before footer */
.site-grid > .grid-child:last-of-type:not(footer) {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Keep footer's own top spacing at zero just in case */
footer.footer.container-footer,
.footer { 
  margin-top: 0 !important; 
  padding-top: 0 !important; 
  overflow: auto !important; /* breaks margin-collapsing, harmless visually */
}


/* Tighten space ABOVE the footer by removing the grid row's bottom padding */
.site-grid > .grid-child {
  padding-bottom: 0 !important;   /* <-- this is the big one */
  margin-bottom: 0 !important;    /* safety */
}

/* Keep the footer from adding its own top gap */
footer.footer.container-footer,
.footer {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* If you have bottom module rows, kill their spacing too */
.container-bottom-a,
.container-bottom-b {
  margin: 0 !important;
  padding: 0 !important;
}
/* Tighten the footer's internal padding */
footer.footer.container-footer .grid-child {
  padding-top: 0.2rem !important;   /* adjust to taste */
  padding-bottom: 0.5rem !important;
  padding-left: 0.5em !important;
  padding-right: 0.5em !important;
}

/* Keep any outer gap off, just in case */
footer.footer.container-footer,
.footer {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
@media (max-width: 768px) {
  footer.footer.container-footer .grid-child {
    padding-top: 0.4rem !important;
    padding-bottom: 0.4rem !important;
  }
}
/* Add breathing room between left sidebar and main article */
.container-sidebar-left {
  padding-right: 1rem !important;   /* adjust value: 1rem ≈ 16px */
}

.container-component {
  margin-left: 0 !important;        /* make sure it doesn't overlap */
}
/* Sidebar flush to the left edge, with gap before the article */
.container-sidebar-left {
  padding-left: 0 !important;      /* no gutter on the outside */
  margin-left: 0 !important;
  padding-right: 1.5rem !important; /* gutter only between sidebar and article */
}
/* Right sidebar flush right, with gap before the article */
.container-sidebar-right {
  padding-right: 0 !important;     /* no gutter on the outside */
  margin-right: 0 !important;
  padding-left: 1.5rem !important; /* gutter only between sidebar and article */
}
/* Center footer text */
footer.footer.container-footer .grid-child {
  display: flex !important;
  justify-content: center !important; /* center horizontally */
  text-align: center !important;
}

/* If you want stacked text centered vertically as well */
footer.footer.container-footer .grid-child > * {
  margin: 0 .25rem; /* small spacing between items */
}
/* Make footer menu links bold */
footer.footer.container-footer .mod-menu a {
  font-weight: bold !important;
}
/* Add a thin black rule above the footer */
footer.footer.container-footer {
  border-top: 1px solid #000;   /* 1-pixel black line */
  margin-top: 0 !important;     /* remove any extra gap */
  padding-top: 1rem !important; /* space above footer text */
}
/* Thin black rule aligned with content width (not full browser width) */
footer.footer.container-footer .grid-child {
  border-top: 1px solid #000;      /* thin black line */
  padding-top: 1rem !important;    /* space above the text */
  margin-top: 0 !important;        /* remove any gap above the rule */
  max-width: var(--cassiopeia-grid-max-width, 1320px); /* stay aligned with content grid */
  margin-left: auto;
  margin-right: auto;
}
/* --- 1) MOBILE/TABLET GUTTERS (add space at phone edges) --- */
@media (max-width: 991.98px) {
  /* Add left/right padding to stacked blocks */
  .site-grid > .grid-child {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  /* Ensure the main article has breathing room too */
  .container-component {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* --- 2) DESKTOP-ONLY: keep sidebars flush to browser edges --- */
@media (min-width: 992px) {
  .container-sidebar-left {
    padding-left: 0 !important;         /* flush to left edge */
    padding-right: 1.5rem !important;   /* gap before article */
    margin-left: 0 !important;
  }
  .container-sidebar-right {
    padding-right: 0 !important;        /* flush to right edge */
    padding-left: 1.5rem !important;    /* gap before article */
    margin-right: 0 !important;
  }
}
/* Keep footer horizontal on phones */
@media (max-width: 768px) {
  footer.footer.container-footer .grid-child {
    flex-wrap: nowrap !important;       /* stop items from wrapping */
    flex-direction: row !important;     /* stay in one horizontal line */
    justify-content: center !important; /* center them nicely */
    align-items: center !important;     /* vertically align */
    gap: 0.75rem;                       /* small space between items */
  }

  /* Make sure footer modules don’t stretch full width */
  footer.footer.container-footer .grid-child > * {
    flex: 0 0 auto !important;
    width: auto !important;
  }
}
/* Footer menu horizontal on phones */
@media (max-width: 768px) {
  /* Make the UL a row, not a column */
  footer.footer.container-footer .mod-menu,
  footer.footer.container-footer nav .mod-menu,
  footer.footer.container-footer .navbar-nav,
  footer.footer.container-footer .nav.mod-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;        /* keep in one line */
    justify-content: center !important;
    align-items: center !important;
    gap: 0.75rem;
    padding-left: 0 !important;
    margin: 0 !important;
    list-style: none;
    white-space: nowrap;                  /* prevent wrap */
    overflow-x: auto;                     /* allow swipe if too many items */
    -webkit-overflow-scrolling: touch;
  }

  /* List items shouldn’t be full-width blocks */
  footer.footer.container-footer .mod-menu > li,
  footer.footer.container-footer .navbar-nav > li {
    display: inline-flex !important;
    width: auto !important;
    margin: 0 !important;
  }

  /* Neutralize Bootstrap's column helper if present */
  footer.footer.container-footer .flex-column {
    flex-direction: row !important;
  }
}
/* Reduce vertical space between top image and main text on phones */
@media (max-width: 768px) {

  /* Trim bottom space below header/banner image */
  .container-header,
  header.header {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Trim top space above the article/content */
  .site-grid > .grid-child:first-of-type,
  .container-component,
  .item-page {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Optional: if a custom intro image or hero section has padding */
  .hero, .banner, .image-intro {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
}
/* Phones only: tighten the gap directly under the banner */
@media (max-width: 768px) {
  /* 1) Kill any space at the bottom of the header */
  header.header,
  .container-header,
  header.header .grid-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* 2) If the banner sits inside a <p>, remove that paragraph margin */
  header.header p:has(img),
  .container-header p:has(img) {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 3) Prevent margin-collapsing from the first content row */
  .site-grid > .grid-child:first-of-type {
    margin-top: 0 !important;
    padding-top: 1px !important; /* breaks collapse; visually invisible */
    overflow: auto !important;
  }

  /* 4) If your article adds an automatic title/header block */
  .page-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0.25rem !important; /* optional tiny gap */
  }
}
/* --- Phones only: collapse the space directly under the banner image --- */
@media (max-width: 768px) {

  /* 1) Remove any bottom spacing on the header container and its inner grid */
  header.header,
  .container-header,
  header.header .grid-child,
  .container-header .grid-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* 2) Banner image wrappers: kill default paragraph/figure margins if present */
  header.header p,
  .container-header p,
  header.header figure,
  .container-header figure {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 3) Banner image itself: block-level, no line-gap */
  header.header img,
  .container-header img,
  .brand-logo img {
    display: block !important;
    margin: 0 !important;
    vertical-align: bottom !important;
  }

  /* 4) Stop margin-collapsing from first content row */
  .site-grid > .grid-child:first-of-type {
    margin-top: 0 !important;
    padding-top: 1px !important;   /* invisible, prevents collapse */
    overflow: auto !important;
  }

  /* 5) If the first thing in content is the article title block, trim it */
  .page-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0.25rem !important;  /* keep a tiny gap, adjust or set 0 */
  }

  /* 6) If Joomla article adds top margin on first element, remove it */
  .container-component,
  .item-page,
  .com-content-article {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  .item-page > *:first-child,
  .com-content-article > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* 7) If there’s a custom module right under the banner, collapse it */
  .mod-custom,
  .banner,
  .hero {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* 8) Remove grid row gap between the header row and the first content row */
  .site-grid {
    row-gap: 0 !important;
    gap: 0 !important;
  }
}

/* Phones only: remove the space directly under the banner image */
@media (max-width: 768px) {

  /* 1) Kill any bottom padding/margin inside the header */
  .header.container-header .grid-child {
    padding-bottom: 0 !important;
  }
  .header.container-header {
    margin-bottom: 0 !important;
  }

  /* 2) Remove inline-image baseline gap from the brand link/wrapper */
  .header.container-header .navbar-brand,
  .header.container-header .brand-logo {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;      /* <-- key for image baseline gap */
    display: block !important;
  }
  .header.container-header .brand-logo img {
    display: block !important;      /* no inline baseline */
    margin: 0 !important;
  }

  /* 3) Stop margin-collapsing at the boundary */
  .header.container-header {
    padding-bottom: 1px !important;  /* invisible shim to break collapse */
    margin-bottom: -1px !important;  /* cancels the 1px visually */
    overflow: hidden !important;      /* also prevents collapse */
  }

  /* 4) Ensure the first grid row doesn’t bring its own top gap */
  .site-grid { row-gap: 0 !important; gap: 0 !important; }
  .site-grid > .grid-child { margin-top: 0 !important; }
  .container-component > *:first-child,
  .item-page > *:first-child,
  .com-content-article > *:first-child,
  .page-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

/* Phones only: remove forced height & padding under the banner image */
@media (max-width: 768px) {
  /* 1) Nuke any fixed/min-height on the header and its inner grid */
  header.header.container-header,
  header.header.container-header .grid-child,
  header.header .navbar-brand,
  header.header .brand-logo {
    height: auto !important;
    min-height: 0 !important;
  }

  /* 2) Remove internal bottom spacing */
  header.header.container-header,
  header.header.container-header .grid-child {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* 3) Kill inline-image baseline gap */
  header.header .brand-logo { line-height: 0 !important; }
  header.header .brand-logo img {
    display: block !important;
    height: auto !important;     /* overrides any fixed px height */
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* 4) (Optional) If a tiny sliver remains, pull the first content row up slightly */
  .site-grid > .grid-child:first-of-type {
    margin-top: -8px !important;   /* adjust to taste: -4px … -12px */
  }
}
.ab-buy {
  margin-top: 1rem;
  margin-bottom: 2rem;   /* ← this creates breathing room below the button */
}

.ab-callout {
  margin-bottom: 2.5rem; /* extra separation between sections */
}
