/* V10 — letras atraídas pelo cursor e fotografia com profundidade delicada. */

.v10-hover-title .v8-letter {
  color: var(--v10-color, inherit) !important;
  transform: translate3d(var(--v10-x,0px),var(--v10-y,0px),0)
    rotate(var(--v10-r,0deg)) scale(var(--v10-s,1)) !important;
  transition: transform .2s cubic-bezier(.2,.8,.2,1), color .2s ease, text-shadow .2s ease !important;
}

#range-title.v10-hover-title .v8-letter { text-shadow: 0 0 0 transparent; }
#range-title.v10-hover-title.is-v10-active .v8-letter[style*="--v10-color"] { text-shadow: .04em .04em 0 rgba(17,17,17,.45); }
#categories-title.v10-hover-title .v8-letter { transform-origin: center bottom; }
#reviews-title.v10-hover-title .v8-letter { transform-origin: center; }
#faq .section-head h2.v10-hover-title .v8-letter { transform-origin: bottom; }
#unidades .section-head h2.v10-hover-title .v8-letter { transform-origin: center bottom; }

/* O hover da fotografia tem luz localizada, morph suave e aproximação do recorte. */
.story-frame {
  --v10-photo-x: 50%;
  --v10-photo-y: 50%;
  --v10-photo-shift-x: 0px;
  --v10-photo-shift-y: 0px;
  border-radius: clamp(20px,2.4vw,38px);
}
.story-frame::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at var(--v10-photo-x) var(--v10-photo-y),rgba(255,203,0,.3),transparent 30%);
  mix-blend-mode: soft-light;
  opacity: 0;
  transition: opacity .28s ease;
  pointer-events: none;
}
.story-frame img {
  transform: scale(1.09)
    translate3d(calc(var(--depth-shift-x) + var(--v10-photo-shift-x)),calc(var(--depth-shift-y) + var(--v8-image-y) + var(--v10-photo-shift-y)),0) !important;
  transition: transform .62s var(--ease), filter .35s ease !important;
}
.story-frame:hover,
.story-frame:focus-within {
  border-color: var(--yellow);
  border-radius: clamp(28px,3.4vw,54px) clamp(18px,2vw,32px) clamp(30px,3.8vw,60px) clamp(18px,2vw,34px);
  filter: saturate(1.04) contrast(1.025);
}
.story-frame:hover::after,
.story-frame:focus-within::after { opacity: 1; }
.story-frame:hover img,
.story-frame:focus-within img { transform: scale(1.15) translate3d(var(--v10-photo-shift-x),var(--v10-photo-shift-y),0) !important; }
.story-frame figcaption { z-index: 4; }

@media (hover: none) {
  .story-frame { border-radius: clamp(18px,4vw,30px); }
  .story-frame::after { display: none; }
  .story-frame img { --v10-photo-shift-x: 0px !important; --v10-photo-shift-y: 0px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .v10-hover-title .v8-letter { transform: none !important; transition: none !important; }
  .story-frame img { transform: scale(1.06) !important; transition: none !important; }
}