/* One image-only banner size for every public page and both carousels. */
:root { --site-banner-height: 400px; }
@media (min-width: 768px) { :root { --site-banner-height: 650px; } }
@media (min-width: 1024px) { :root { --site-banner-height: 710px; } }
.site-banner,
#heroCarousel,
.pk-banner .pk-slider {
  position: relative;
  height: var(--site-banner-height) !important;
  min-height: var(--site-banner-height) !important;
  max-height: var(--site-banner-height) !important;
  overflow: hidden;
  padding: 0;
}
.site-banner > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
/* The fixed navigation floats above the banner without reserving a dark band. */
header.site-header-unified:has(> nav.site-nav) {
  padding: 0;
  height: 0;
  min-height: 0;
  background: transparent;
  z-index: 50;
}
header.site-header-unified > nav.site-nav,
header.site-header-unified > nav.site-nav.is-scrolled {
  width: min(1120px, calc(100% - 1.5rem));
}
header.site-header-unified > nav.site-nav > div:first-child {
  gap: 16px;
}
header.site-header-unified > nav.site-nav .lg\:flex.gap-9,
header.site-header-unified > nav.site-nav.is-scrolled .lg\:flex.gap-9 {
  gap: clamp(12px, 1.5vw, 24px);
}
header.site-header-unified > nav.site-nav a {
  flex-shrink: 0;
  white-space: nowrap;
}
header.site-header-unified > nav.site-nav .nav-link,
header.site-header-unified > nav.site-nav.is-scrolled .nav-link,
header.site-header-unified > nav.site-nav a[href$="/contact"] {
  font-size: 12px !important;
  line-height: 1.5 !important;
  letter-spacing: .1em;
}
@media (min-width: 1024px) {
  header.site-header-unified > nav.site-nav img { max-width: 120px; }
}
@media (max-width: 1023px) {
  header.site-header-unified > nav.site-nav a { font-size: 14px !important; }
}
.banner-page-intro {
  max-width: 1240px;
  margin: auto;
  padding: 40px 28px 0;
  color: #312721;
}
.banner-page-intro p { max-width: 760px; margin-top: 18px; color: #6b625a; }

#heroCarousel .carousel-slide img,
.pk-banner .pk-slider .slide img { object-position: center top; }

/* Slow zoom on each home slide; reset only after its crossfade finishes. */
#heroCarousel .carousel-slide img {
  transform: scale(1);
  transform-origin: center center;
  transition: transform 0s linear 700ms;
}
#heroCarousel .carousel-slide.is-active img {
  transform: scale(1.1);
  transition: transform 7.7s linear;
}
@media (prefers-reduced-motion: reduce) {
  #heroCarousel .carousel-slide img,
  #heroCarousel .carousel-slide.is-active img {
    transform: none;
    transition: none;
  }
}

/* Phones & tablets: flat full-width bar instead of the floating pill, so the open menu is a clean rectangular panel */
@media (max-width: 1023px) {
  header.site-header-unified > nav.site-nav,
  header.site-header-unified > nav.site-nav.is-scrolled {
    top: 0;
    left: 0;
    width: 100%;
    transform: none;
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid rgba(232, 189, 85, .28);
    background: rgba(22, 17, 13, .92);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .3);
  }
  header.site-header-unified > nav.site-nav > div:first-child { padding-left: 1.1rem; padding-right: .9rem; }
  header.site-header-unified > nav.site-nav #mobileMenu {
    border-radius: 0;
    max-height: calc(100vh - 4.6rem);
    padding: .25rem 1.25rem 1.25rem !important;
    border-top: 1px solid rgba(255, 255, 255, .1) !important;
  }
}

/* Contact + FAQ banners: taller, with the tiger kept in frame. */
#contact-banner, #faq-banner { --site-banner-height: 480px; }
@media (min-width: 768px) { #contact-banner, #faq-banner { --site-banner-height: 720px; } }
@media (min-width: 1024px) { #contact-banner, #faq-banner { --site-banner-height: 820px; } }
#contact-banner > img { object-position: 50% 62%; }
#faq-banner > img { object-position: 60% 92%; }

/* Keep the property in view within the existing full-width banner. */
.site-banner.site-banner--property > img { object-position: center 60%; }