/* Match the preview to the source drawing so it fills the box without cropping. */
.hlp-floor-plan-page .h8-blog-wrapper .blog-item.style-2 .blog-thumb {
  background: #fff;
  height: auto;
  min-height: 0;
  aspect-ratio: 1650 / 1200;
  align-self: center;
}

.hlp-floor-plan-page .h8-blog-wrapper .blog-item.style-2 .blog-thumb > a {
  display: block;
  padding: 0;
}

.hlp-floor-plan-page .h8-blog-wrapper .blog-item.style-2 .blog-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: none;
}

.hlp-floor-plan-page .blog-date {
  top: auto;
  bottom: 12px;
  padding: 10px 14px;
  background: var(--tj-color-theme-primary);
}

.hlp-floor-plan-page .blog-date .date {
  font-size: 20px;
  margin-bottom: 4px;
}

.hlp-floor-plan-page .blog-thumb > a:focus-visible {
  outline: 3px solid var(--tj-color-theme-primary);
  outline-offset: -3px;
}

html.hlp-plan-viewer-open,
html.hlp-plan-viewer-open body {
  overflow: hidden;
}

.hlp-plan-viewer {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 72px 16px 16px;
  border: 0;
  background: rgba(5, 15, 18, .97);
}

.hlp-plan-viewer[open] {
  display: flex;
  align-items: center;
  justify-content: center;
}

.hlp-plan-viewer::backdrop {
  background: #050f12;
}

.hlp-plan-viewer-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.hlp-plan-viewer-close {
  position: fixed;
  top: max(12px, env(safe-area-inset-top));
  right: max(16px, env(safe-area-inset-right));
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  background: var(--tj-color-theme-primary, #1e8a8a);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 2px 14px rgba(0, 0, 0, .4);
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease;
}

.hlp-plan-viewer-close svg {
  display: block;
  flex-shrink: 0;
}

.hlp-plan-viewer-close:hover {
  background: #102b30;
  border-color: #71ceca;
}

.hlp-plan-viewer-close:focus-visible {
  outline: 3px solid #71ceca;
  outline-offset: 3px;
}
