/* Heta Builder — front render */
.hb-root { width: 100%; box-sizing: border-box; }
.hb-root *, .hb-root *::before, .hb-root *::after { box-sizing: border-box; }

.hb-section { width: 100%; }
.hb-section__inner {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.hb-section--w-boxed .hb-section__inner { max-width: 1140px; padding-left: 16px; padding-right: 16px; }
.hb-section--w-narrow .hb-section__inner { max-width: 760px; padding-left: 16px; padding-right: 16px; }

.hb-row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
  width: calc(100% + 20px);
}
.hb-wrap,
.hb-item {
  padding-left: 10px;
  padding-right: 10px;
  min-width: 0;
}
.hb-wrap { margin-bottom: 0; }
.hb-item { margin-bottom: 20px; }
.hb-wrap__inner {
  width: 100%;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
}

/* 12-col inspired widths */
.hb-col-12 { width: 100%; flex: 0 0 100%; max-width: 100%; }
.hb-col-10 { width: 83.333%; flex: 0 0 83.333%; max-width: 83.333%; } /* 5/6 */
.hb-col-10-alt { width: 80%; flex: 0 0 80%; max-width: 80%; } /* 4/5 */
.hb-col-9 { width: 75%; flex: 0 0 75%; max-width: 75%; }
.hb-col-8 { width: 66.666%; flex: 0 0 66.666%; max-width: 66.666%; }
.hb-col-7 { width: 60%; flex: 0 0 60%; max-width: 60%; }
.hb-col-6 { width: 50%; flex: 0 0 50%; max-width: 50%; }
.hb-col-5 { width: 40%; flex: 0 0 40%; max-width: 40%; }
.hb-col-4 { width: 33.333%; flex: 0 0 33.333%; max-width: 33.333%; }
.hb-col-3 { width: 25%; flex: 0 0 25%; max-width: 25%; }
.hb-col-2-alt { width: 20%; flex: 0 0 20%; max-width: 20%; } /* 1/5 */
.hb-col-2 { width: 16.666%; flex: 0 0 16.666%; max-width: 16.666%; } /* 1/6 */

.hb-heading { margin: 0 0 12px; line-height: 1.3; color: inherit; }
.hb-text { line-height: 1.6; color: inherit; }
.hb-text p { margin: 0 0 12px; }
.hb-text p:last-child { margin-bottom: 0; }

.hb-image { display: block; max-width: 100%; height: auto; }
.hb-image-link { display: block; max-width: 100%; text-decoration: none; }
.hb-image-align .hb-image { display: inline-block; vertical-align: top; }
.hb-image-frame {
  display: block;
  overflow: hidden;
  max-width: 100%;
  background: #f3eeea;
}
.hb-image-frame .hb-image {
  width: 100%;
  height: 100%;
  max-width: none;
  display: block;
}
.hb-image--contain { object-fit: contain; }
.hb-image--cover { object-fit: cover; }
.hb-image--px { max-width: 100%; }

.hb-image-hover {
  display: block;
  overflow: hidden;
  --hb-hover-scale: 1.06;
}
.hb-image-hover .hb-image,
.hb-image-hover .hb-image-frame,
.hb-image-hover img {
  transition: transform .35s ease, opacity .35s ease, filter .35s ease, box-shadow .35s ease;
}
.hb-image-hover--zoom:hover img,
.hb-image-hover--zoom:hover .hb-image {
  transform: scale(var(--hb-hover-scale));
}
.hb-image-hover--zoom_out:hover img,
.hb-image-hover--zoom_out:hover .hb-image {
  transform: scale(0.96);
}
.hb-image-hover--opacity:hover {
  opacity: .78;
}
.hb-image-hover--grayscale img,
.hb-image-hover--grayscale .hb-image {
  filter: grayscale(0);
}
.hb-image-hover--grayscale:hover img,
.hb-image-hover--grayscale:hover .hb-image {
  filter: grayscale(1);
}
.hb-image-hover--brightness:hover img,
.hb-image-hover--brightness:hover .hb-image {
  filter: brightness(1.12);
}
.hb-image-hover--lift {
  transition: transform .35s ease, box-shadow .35s ease;
}
.hb-image-hover--lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
}

.hb-button-wrap { margin: 8px 0; }
.hb-button {
  display: inline-block;
  padding: 10px 22px;
  text-decoration: none;
  font-weight: 600;
  border-radius: 2px;
  transition: opacity .15s ease;
}
.hb-button:hover { opacity: .85; }
.hb-button--primary { background: #7d6356; color: #fff; }
.hb-button--ghost { background: transparent; color: #7d6356; border: 1px solid #7d6356; }

.hb-spacer { width: 100%; }
.hb-divider { border: 0; border-top: 1px solid #d4c8c0; margin: 12px 0; }
.hb-divider--dashed { border-top-style: dashed; }
.hb-divider--dotted { border-top-style: dotted; }

.hb-icon-box { padding: 8px; }
.hb-icon-box__icon { font-size: 28px; color: #7d6356; margin-bottom: 10px; }
.hb-icon-box__title { font-weight: 700; margin-bottom: 6px; font-size: 16px; }
.hb-icon-box__text { font-size: 14px; line-height: 1.5; opacity: .85; }

.hb-faq { width: 100%; }
.hb-faq__item {
  border-bottom: 1px solid #e8dfd8;
  padding: 10px 0;
}
.hb-faq__item:first-child { padding-top: 0; }
.hb-faq__q {
  cursor: pointer;
  font-weight: 700;
  list-style: none;
  color: #3d3330;
}
.hb-faq__q::-webkit-details-marker { display: none; }
.hb-faq__a {
  margin-top: 8px;
  line-height: 1.55;
  color: #5a4d46;
  font-size: 14px;
}

.hb-quote {
  margin: 0;
  padding: 16px 20px;
  border-left: 3px solid #7d6356;
  background: #f7f4f2;
}
.hb-quote__text { margin: 0 0 8px; font-style: italic; line-height: 1.55; }
.hb-quote__cite { display: block; font-size: 13px; font-style: normal; color: #8a7a70; }

.hb-list { margin: 0 0 0 1.1em; padding: 0; line-height: 1.6; }
.hb-list li { margin-bottom: 6px; }
.hb-list--marker-none,
.hb-list--marker-check {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
.hb-list--marker-check li {
  position: relative;
  padding-left: 1.4em;
}
.hb-list--marker-check li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: #7d6356;
  font-weight: 700;
}

/* Gallery */
.hb-gallery {
  display: grid;
  grid-template-columns: repeat(var(--hb-gallery-cols, 3), minmax(0, 1fr));
  width: 100%;
}
.hb-gallery__item {
  margin: 0;
  overflow: hidden;
  background: #f3eeea;
}
.hb-gallery__link { display: block; height: 100%; }
.hb-gallery__img {
  display: block;
  width: 100%;
  height: auto;
}
.hb-gallery--ratio-1-1 .hb-gallery__item,
.hb-gallery--ratio-4-3 .hb-gallery__item,
.hb-gallery--ratio-16-9 .hb-gallery__item,
.hb-gallery--ratio-3-4 .hb-gallery__item {
  aspect-ratio: 1 / 1;
}
.hb-gallery--ratio-4-3 .hb-gallery__item { aspect-ratio: 4 / 3; }
.hb-gallery--ratio-16-9 .hb-gallery__item { aspect-ratio: 16 / 9; }
.hb-gallery--ratio-3-4 .hb-gallery__item { aspect-ratio: 3 / 4; }
.hb-gallery--ratio-1-1 .hb-gallery__img,
.hb-gallery--ratio-4-3 .hb-gallery__img,
.hb-gallery--ratio-16-9 .hb-gallery__img,
.hb-gallery--ratio-3-4 .hb-gallery__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 767px) {
  .hb-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Carousel */
.hb-carousel {
  position: relative;
  width: 100%;
  --hb-carousel-h: 420px;
}
.hb-carousel__viewport {
  overflow: hidden;
  width: 100%;
  background: #f3eeea;
}
.hb-carousel__track {
  position: relative;
  width: 100%;
  height: var(--hb-carousel-h);
}
.hb-carousel__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s ease;
}
.hb-carousel__slide.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}
.hb-carousel__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hb-carousel__caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 12px 16px;
  background: linear-gradient(transparent, rgba(0,0,0,.55));
  color: #fff;
  font-size: 14px;
}
.hb-carousel__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: #3d3330;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,.12);
}
.hb-carousel__nav--prev { left: 10px; }
.hb-carousel__nav--next { right: 10px; }
.hb-carousel__nav:hover { background: #fff; }
.hb-carousel__dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 10px;
}
.hb-carousel__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 0;
  padding: 0;
  background: #d5cbc4;
  cursor: pointer;
}
.hb-carousel__dot.is-active { background: #7d6356; }

/* Section scroll animations (Nilco-style) */
.hb-section-animate {
  opacity: 0;
  will-change: opacity, transform;
}
.hb-section-animate.is-visible {
  opacity: 1;
  transform: translate(0, 0) !important;
}
.hb-section-animate--right_to_left,
.hb-section-animate--left_to_right {
  opacity: 0.15;
  transition:
    opacity 0.9s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.9s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.hb-section-animate--right_to_left { transform: translateX(64px); }
.hb-section-animate--left_to_right { transform: translateX(-64px); }
.hb-section-animate--bottom_to_top,
.hb-section-animate--top_to_bottom {
  opacity: 0.2;
  transition:
    opacity 1.05s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 1.05s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.hb-section-animate--bottom_to_top { transform: translateY(clamp(48px, 12vh, 120px)); }
.hb-section-animate--top_to_bottom { transform: translateY(calc(-1 * clamp(48px, 12vh, 120px))); }
@media (max-width: 767px) {
  .hb-section-animate--right_to_left,
  .hb-section-animate--left_to_right,
  .hb-section-animate--bottom_to_top,
  .hb-section-animate--top_to_bottom {
    transform: translateY(24px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hb-section-animate {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Visibility */
@media (min-width: 992px) {
  .hb-hide-desktop { display: none !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hb-hide-tablet { display: none !important; }
}
@media (max-width: 767px) {
  .hb-hide-mobile { display: none !important; }
}

@media (max-width: 991px) {
  .hb-tablet-1-1 { width: 100%; flex: 0 0 100%; max-width: 100%; }
  .hb-tablet-5-6 { width: 83.333%; flex: 0 0 83.333%; max-width: 83.333%; }
  .hb-tablet-4-5 { width: 80%; flex: 0 0 80%; max-width: 80%; }
  .hb-tablet-3-4 { width: 75%; flex: 0 0 75%; max-width: 75%; }
  .hb-tablet-2-3 { width: 66.666%; flex: 0 0 66.666%; max-width: 66.666%; }
  .hb-tablet-3-5 { width: 60%; flex: 0 0 60%; max-width: 60%; }
  .hb-tablet-1-2 { width: 50%; flex: 0 0 50%; max-width: 50%; }
  .hb-tablet-2-5 { width: 40%; flex: 0 0 40%; max-width: 40%; }
  .hb-tablet-1-3 { width: 33.333%; flex: 0 0 33.333%; max-width: 33.333%; }
  .hb-tablet-1-4 { width: 50%; flex: 0 0 50%; max-width: 50%; }
  .hb-tablet-1-5 { width: 50%; flex: 0 0 50%; max-width: 50%; }
  .hb-tablet-1-6 { width: 50%; flex: 0 0 50%; max-width: 50%; }
}

@media (max-width: 767px) {
  .hb-mobile-1-1,
  .hb-mobile-5-6,
  .hb-mobile-4-5,
  .hb-mobile-3-4,
  .hb-mobile-2-3,
  .hb-mobile-3-5,
  .hb-mobile-1-2,
  .hb-mobile-2-5,
  .hb-mobile-1-3,
  .hb-mobile-1-4,
  .hb-mobile-1-5,
  .hb-mobile-1-6 {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}