/* =========================================================
   Goodin Home Page Proposal (requested)
   Keep custom CSS minimal; rely on Bootstrap utilities
   ========================================================= */
:root {
  --goodin-blue: #0061aa;
  --goodin-royal-blue: #005696;
  --goodin-goldenrod: #fbb040;
  --goodin-midnight: #1b3244;
  --goodin-red: #f44336;
  --goodin-pale-grey: #f0f0f0;
  --goodin-shadow-grey: #d9d9d9;
  --goodin-black: #191919;
  /*--goodin-white: var(--goodin-white); commented, coz brand-color goodin-white would be overridden*/
}

/* tiny byline text */
.smallest {
  font-size: 0.72rem;
  line-height: 1.1;
}

/* Button behavior: all buttons hover like "View Promotions" (goldenrod + black text) */
.btn,
.btn:focus {
  transition: background-color 0.12s ease, color 0.12s ease, border-color 0.12s ease, transform 0.12s ease;
}

.btn:hover {
  background-color: var(--goodin-goldenrod) !important;
  border-color: var(--goodin-goldenrod) !important;
  color: var(--goodin-black) !important;
}

/* Primary Goodin button */
.btn-gd-primary {
  --bs-btn-color: var(--goodin-white);
  --bs-btn-bg: var(--goodin-blue);
  --bs-btn-border-color: var(--goodin-blue);
  --bs-btn-hover-bg: var(--goodin-goldenrod);
  --bs-btn-hover-border-color: var(--goodin-goldenrod);
  --bs-btn-hover-color: var(--goodin-black);
}

.hero-pills .badge {
  background: var(--goodin-royal-blue) !important;
  color: var(--goodin-white) !important;
}
.hero-pills .badge.is-new {
  background: var(--goodin-red) !important;
  color: var(--goodin-white) !important;
}

/* KPI cards: consistent layout + bottom aligned buttons */
.kpi-card {
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 1rem;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.05);
  height: 100%;
}
.kpi-card__inner {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.kpi-card__content {
  flex: 1 1 auto;
}
.kpi-card__cta {
  margin-top: auto;
  padding-top: 0.75rem;
}

/* Market cards base */
.market-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 575.98px) {
  .market-grid {
    grid-template-columns: 1fr;
  }
}
/* =========================================
   Market Card
   ========================================= */
.market-card {
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(6px);
  color: var(--goodin-white);
  min-height: 132px;
}
.market-card__link {
  text-decoration: none;
  color: inherit;
  display: block;
  height: 100%;
}
.market-card__body {
  position: relative;
  z-index: 2;
  padding: 1rem;
}
.market-card__meta {
  opacity: 0.86;
  font-size: 0.9rem;
}
.market-card--bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  opacity: 0.65;
  z-index: 0;
}
.market-card--bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  /* ensures readability */
  z-index: 1;
}
.market-card--plumbing::before {
  background-image: url("https://www.goodinco.com/images/default-source/default-album/plumbing8f6df2a7-40ac-48b1-b4af-b7bb86554d71.tmb-mkts-ban.webp?Culture=en&sfvrsn=d3e6ab9c_3");
}
.market-card--hvac::before {
  background-image: url("https://www.goodinco.com/images/default-source/default-album/havc.tmb-mkts-ban.webp?Culture=en&sfvrsn=304f438_3");
}
.market-card--pump::before {
  background-image: url("https://www.goodinco.com/images/default-source/default-album/pumpwell.tmb-mkts-ban.webp?Culture=en&sfvrsn=7684c82d_3");
}
.market-card--industrial::before {
  background-image: url("https://www.goodinco.com/images/default-source/default-album/industrial0f8f5289-d109-415b-b9af-b9238b028869.tmb-mkts-ban.webp?Culture=en&sfvrsn=e8a3357f_3");
}

/* Icon chip */
.market-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(251, 176, 64, 0.18);
  border: 1px solid rgba(251, 176, 64, 0.35);
}

/* Hot-cold gradient pill for HVAC */
.pill-hot-cold {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0.28)), linear-gradient(90deg, #f44336 0%, #c35a87 40%, #7a4a97 50%, #1d5f9f 80%, #005696 100%);
  color: var(--goodin-white);
  border: 1px solid var(--goodin-royal-blue);
}

/* =========================================
   Featured product cards
   ========================================= */
.product-card {
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 1rem;
  height: 100%;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.product-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.08);
}
.product-img {
  border-radius: 0.9rem;
  border: 1px solid rgba(0, 0, 0, 0.1);
  overflow: hidden;
  height: 170px;
  background: var(--goodin-white);
}
.product-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* =========================================
   Brand Spotlight horizontal scroller + flip
   ========================================= */
.brandflip {
  overflow: hidden;
}
.brandflip__track {
  display: flex;
  gap: 0.75rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
  scroll-snap-type: x mandatory;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.brandflip__track::-webkit-scrollbar {
  display: none;
}
.brandflip__item {
  flex: 0 0 auto;
  scroll-snap-align: start;
}
.brandflip__card {
  width: 96px;
  height: 96px;
  perspective: 900px;
  position: relative;
  border-radius: 999px;
  outline: none;
}
.brandflip__card:focus-visible {
  box-shadow: 0 0 0 0.2rem rgba(251, 176, 64, 0.45);
  border-radius: 999px;
}
.brandflip__face {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  backface-visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.brandflip__front {
  background: var(--goodin-white);
}
.brandflip__logo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.brandflip__back {
  transform: rotateY(180deg);
  background: var(--goodin-blue);
  color: var(--goodin-white);
  flex-direction: column;
  padding: 0.6rem;
  text-align: center;
}
.brandflip__title {
  font-weight: 700;
  font-size: 0.82rem;
  line-height: 1.1;
}
.brandflip__actions {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: 0.45rem;
}
.brandflip__actions .btn {
  border-radius: 0.6rem;
}
.brandflip__card:hover .brandflip__front, .brandflip__card:focus .brandflip__front {
  transform: rotateY(180deg);
}
.brandflip_card:hover .brandflip__back, .brandflip__card:focus .brandflip__back {
  transform: rotateY(360deg);
}
.brandflip__front, .brandflip__back {
  transition: transform 0.55s ease;
}

/* Mobile: stack cards bigger */
@media (max-width: 575.98px) {
  .brandflip__card {
    width: 120px;
    height: 120px;
  }
}
/* Tips cards images */
.news-img {
  height: 260px;
  border-radius: 1rem 1rem 0 0;
  overflow: hidden;
  background: #e9eef5;
}
.news-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Local service: icon red filled */
.icon-red {
  background: var(--goodin-red);
  color: var(--goodin-white);
  border-color: var(--goodin-red);
}