/* V6: restore the approved navy and keep both Sama images in one clipped frame. */
html,
body,
main,
.hero,
.services,
.before-after {
  background: #0A0F1A;
}

.site-header,
.mobile-menu {
  background: #0A0F1A;
}

.instagram-signature {
  grid-column: 1 / -1;
  justify-self: stretch;
  width: 100%;
  margin: -12px 0 0;
  text-align: center;
  color: var(--cv-silver-text);
  font-size: 13px;
  letter-spacing: .15em;
}

.instagram-signature a {
  color: var(--cv-silver-accent);
  text-decoration: none;
}

.instagram-signature a:hover {
  color: #fff;
}

.comparison-frame {
  --comparison-position: 0%;
  position: relative;
  height: min(560px, 52vw);
  overflow: hidden;
  border: 1px solid rgba(243, 244, 246, .34);
  background: #111827;
}

.comparison-frame img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  object-position: center;
}

.comparison-frame .compare-after {
  clip-path: inset(0 calc(100% - var(--comparison-position)) 0 0);
}

.comparison-frame .compare-range {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: ew-resize;
}

.comparison-frame .compare-line {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: var(--comparison-position);
  width: 1px;
  background: var(--cv-silver-accent);
  pointer-events: none;
}

.comparison-frame .compare-label {
  z-index: 2;
}

@media (max-width: 760px) {
  .instagram-signature {
    order: 3;
    margin: -12px 0 0;
    font-size: 12px;
  }

  .comparison-frame {
    height: 480px;
  }
}
