/* =================================================
   HOMEPAGE MAIN CONTAINER
   =================================================
   - Homepage only (main.container_class exists)
   - Sets dark background and resets spacing
*/

main.container_class,
main.container_class > div {
  background-color: #15353d !important;
  color: #ffffff;
}

main.container_class {
  padding-top: 0 !important; /* remove top gap under header */
}

/* =================================================
   HOME GRID CARDS
   ================================================= */

.home_grid_section_card {
  background-color: #cc9a3e; /* honey accent */
}

/* =================================================
   FOOTER
   ================================================= */

footer.bg-white {
  background-color: #cc9a3e !important;
  border-top: 1px solid rgba(15, 76, 92, 0.15);
  color: #15353d;
}

/* =================================================
   MOBILE BOTTOM TABS
   ================================================= */

#tabs {
  background-color: #cc9a3e !important;
}

/* Tab text */
#tabs span {
  color: #15353d !important;
}

/* Tab icons (SVG) */
#tabs svg {
  color: #15353d !important;
  fill: none; /* keep stroke-style icons */
}

/* Hover / active state */
#tabs a:hover span,
#tabs a:hover svg {
  color: #f2af29 !important; /* honey gold */
}

/* =================================================
   HOME SECTION TITLE (ANIMATED)
   =================================================
   - Large faint background text
   - Foreground title stays readable
*/

.animate-slideIn h3.home_section_top_title {
  color: #ffffff !important;
  position: relative;
}

.animate-slideIn h3.home_section_top_title span {
  color: #ffffff;
  opacity: 0.12;       /* subtle background effect */
  z-index: 1;
  pointer-events: none;
}

/* =================================================
   CONTENT SECTIONS – FULL BLEED DARK BACKGROUND
   =================================================
   - Forces dark background
   - Removes boxed look
*/

.content_container,
.content_container .container,
.content_container .css-1uhn2p {
  background-color: #15353d !important;
}

/* Full-width section stretch */
.content_container > .css-1uhn2p {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* =================================================
   FEATURE IMAGE WRAPPER
   =================================================
   - Prevents white bleed from transparent PNGs
   - Ensures image fills container cleanly
*/

.feature-img {
  background-color: #15353d;
  overflow: hidden;
}

.feature-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Placeholder / overlay span inside feature image */
.feature-img > span {
  inset: 0;
  height: 100%;
}