:root{
  --brand-blue: #0098d6;
  --brand-black: #000000;
  --brand-white: #ffffff;
  --muted: #6c757d;
}

/* Header */
.site-header .navbar {
  background: var(--brand-white);
  padding: .6rem 0;
}
.navbar-brand img { height:36px; }

/* Carousel styling */
.carousel-wrap .carousel-item img {
  height: 420px;
  object-fit: cover;
}
.carousel-caption {
  background: rgba(0,0,0,0.45);
  padding: 12px 16px;
  border-radius: 6px;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: none;
  background-color: rgba(0,0,0,0.35);
  border-radius: 50%;
  width: 44px;
  height: 44px;
  background-size: 18px 18px;
}

/* dots */
.carousel-dots .dot {
  background: transparent;
  border: 1px solid rgba(0,0,0,0.15);
  margin: 0 4px;
  width: 36px;
  height: 32px;
}
.carousel-dots .dot.active {
  background: var(--brand-blue);
  color: #fff;
  border-color: var(--brand-blue);
}

/* thumbnails */
.carousel-thumbs { gap: 8px; }
.carousel-thumbs .thumb {
  width: 84px;
  height: 56px;
  overflow: hidden;
  border-radius: 6px;
  border: 2px solid transparent;
  cursor: pointer;
}
.carousel-thumbs .thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.carousel-thumbs .thumb.active { border-color: var(--brand-blue); box-shadow: 0 4px 12px rgba(0,0,0,.12); }

/* Card scroller */
.cards-scroll-wrapper { overflow: hidden; }
.cards-scroll {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding-bottom: 8px;
}
.cards-scroll::-webkit-scrollbar { height: 10px; }
.item-card { min-width: 260px; max-width: 260px; flex: 0 0 auto; }

/* make arrows look brandy */
.scroll-left, .scroll-right {
  background: var(--brand-black);
  color: #fff;
  border: none;
  padding: 6px 10px;
}
.btn-primary { background: var(--brand-blue); border-color: var(--brand-blue); }

/* footer tweaks */
.site-footer a { opacity: .95; }
@media (max-width: 767px) {
  .carousel-wrap .carousel-item img { height: 240px; }
  .carousel-thumbs .thumb { width: 62px; height: 44px; }
  .item-card { min-width: 200px; max-width: 200px; }
}
