/* ==========================================================================
   Custom fixes — Kensington Law Firm
   1) Make the nav readable while it floats transparently over hero/breadcrumb
      images (before the user scrolls and the white sticky bar kicks in).
   2) Replace the broken search-toggle icon (missing font) with a
      dependency-free CSS-drawn icon so it always renders.
   ========================================================================== */

/* --- 1. Transparent nav over dark imagery --- */
.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-nav-link {
  color: #ffffff;
}

.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-nav-link:hover,
.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-nav-item.active .rd-nav-link,
.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-nav-item.focus .rd-nav-link,
.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-nav-item.opened .rd-nav-link {
  color: #C9A227;
}

.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-nav-link:before {
  background: #C9A227;
}

.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .brand .brand-logo-dark {
  display: none;
}

.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .brand .brand-logo-light {
  display: inline-block;
}

.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-navbar-search-toggle {
  color: #ffffff;
}

.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-navbar-toggle span,
.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-navbar-toggle span:before,
.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-navbar-toggle span:after {
  background-color: #ffffff;
}

/* Once stuck (scrolled), the sticky bar already gets a white background
   from the theme, so the default dark colors defined in style.css apply
   again automatically — no extra rule needed here. */

/* --- 2. Search icon: pure CSS, no external font required --- */
.rd-navbar-search-toggle span {
  width: 20px;
  height: 20px;
  border: 2px solid currentColor;
  border-radius: 50%;
  background: none !important;
}

.rd-navbar-search-toggle span::before,
.rd-navbar-search-toggle span::after {
  content: "" !important;
  font-family: initial !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  background: currentColor;
  border-radius: 0;
}

.rd-navbar-search-toggle span::before {
  width: 2px;
  height: 10px;
  top: 22px;
  left: 22px;
  transform: rotate(45deg) !important;
}

.rd-navbar-search-toggle span::after {
  display: none;
}

.rd-navbar-search-toggle.active span {
  border-color: transparent;
}

.rd-navbar-search-toggle.active span::before {
  top: 8px;
  left: 8px;
  width: 2px;
  height: 20px;
  transform: rotate(45deg) !important;
}

/* --- 3. Brand color system (replaces photo backgrounds) ---
   A consistent navy + gold palette for hero, breadcrumb, and CTA
   sections, instead of stock photography. */
.bg-navy-gradient {
  background: radial-gradient(circle at 15% 20%, rgba(201, 162, 39, 0.14), transparent 45%),
              linear-gradient(135deg, #1B3A5C 0%, #0F2B47 100%);
}

.bg-navy-gradient-alt {
  background: radial-gradient(circle at 85% 15%, rgba(201, 162, 39, 0.12), transparent 45%),
              linear-gradient(135deg, #0F2B47 0%, #1B3A5C 60%, #0A1F33 100%);
}

.bg-navy-gradient-deep {
  background: radial-gradient(circle at 50% 0%, rgba(201, 162, 39, 0.10), transparent 55%),
              linear-gradient(135deg, #0A1F33 0%, #1B3A5C 100%);
}

/* --- 4. Check Case nav button --- */
.rd-navbar-nav .rd-nav-link-cta {
  background: #C9A227;
  color: #ffffff !important;
  padding: 10px 24px !important;
  border-radius: 30px;
  transition: .25s background-color ease, .25s color ease;
}

.rd-navbar-nav .rd-nav-link-cta:before {
  display: none !important;
}

.rd-navbar-nav .rd-nav-link-cta:hover,
.rd-navbar-nav .rd-nav-link-cta:focus {
  background: #1B3A5C;
  color: #ffffff !important;
}

.header-transparent .rd-navbar-static:not(.rd-navbar--is-stuck) .rd-nav-link-cta {
  color: #ffffff !important;
}

.rd-navbar-fixed .rd-nav-item .rd-nav-link-cta {
  display: inline-block;
  margin: 8px 18px;
}

.rd-navbar-fixed .rd-nav-item.active .rd-nav-link-cta,
.rd-navbar-fixed .rd-nav-item:hover .rd-nav-link-cta {
  background: #1B3A5C;
  color: #ffffff !important;
}

/* --- 5. Breadcrumb contrast against the navy gradient --- */
.breadcrumbs-custom-path a,
.breadcrumbs-custom-path a:active,
.breadcrumbs-custom-path a:focus {
  color: rgba(255, 255, 255, 0.75) !important;
}

.breadcrumbs-custom-path a:hover {
  color: #C9A227 !important;
}

.breadcrumbs-custom-path li.active {
  color: #C9A227 !important;
}

.breadcrumbs-custom-path li::after {
  color: rgba(255, 255, 255, 0.35) !important;
}

/* --- 6. Hero cutout image (background-removed portrait) --- */
.swiper-slide-caption {
  position: relative;
  z-index: 2;
}

.hero-person-img {
  position: absolute;
  left: 4%;
  bottom: 0;
  max-height: 94%;
  width: auto;
  z-index: 1;
  pointer-events: none;
  filter: drop-shadow(0 25px 35px rgba(0, 0, 0, 0.35));
}

@media (max-width: 1400px) {
  .hero-person-img {
    left: -2%;
    max-height: 88%;
  }
}