/* The residential video service’s Lighthouse scroll scene, fitted below the portfolio rail. */
.vf-service-cta {
  --service-cta-inset: 0%; --service-cta-radius: 0px;
  --service-cta-copy: 1; --service-cta-shade: 1; --service-cta-top: 88px;
  position: relative; background: var(--port-paper); color: var(--port-paper);
  scroll-margin-top: var(--service-cta-top);
}
.vf-service-cta-stage { position: relative; isolation: isolate; height: calc(100svh - var(--service-cta-top)); min-height: 620px; overflow: clip; }
.vf-service-cta[data-motion="scroll"] { height: 300svh; }
.vf-service-cta[data-motion="scroll"] .vf-service-cta-stage { position: sticky; top: var(--service-cta-top); min-height: 0; }
.vf-service-cta-picture { position: absolute; inset: 0; overflow: hidden; background: var(--a360-navy); clip-path: inset(var(--service-cta-inset) round var(--service-cta-radius)); }
.a360-homepage .vf-service-cta-picture > :is(img, video) { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
.vf-service-cta-picture > .vf-service-cta-start, .vf-service-cta-picture > video { display: none; }
.vf-service-cta[data-motion="scroll"] .vf-service-cta-start,
.vf-service-cta[data-motion="scroll"] .vf-service-cta-picture > video { display: block; }
.vf-service-cta[data-motion="scroll"] .vf-service-cta-end { display: none; }
.vf-service-cta-picture > video { opacity: 0; transition: opacity 180ms ease; }
.vf-service-cta.is-video-ready .vf-service-cta-picture > video { opacity: 1; }
.vf-service-cta[data-motion="scroll"].is-video-failed .vf-service-cta-start { display: none; }
.vf-service-cta[data-motion="scroll"].is-video-failed .vf-service-cta-end { display: block; }
.vf-service-cta-shade { position: absolute; inset: 0; background: linear-gradient(90deg, #071827c7, #07182773 65%, #07182730), linear-gradient(0deg, #07182780, transparent 65%); opacity: var(--service-cta-shade); pointer-events: none; }
.vf-service-cta-copy { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; opacity: var(--service-cta-copy); transform: translate3d(0, calc((1 - var(--service-cta-copy)) * 28px), 0); }
.vf-service-cta-copy > .a360-shell { width: 100%; padding-block: 80px; }
.vf-service-cta-copy[inert] { pointer-events: none; }
.vf-service-cta-kicker { display: block; margin: 0 0 22px; color: #e0c58e; font: 800 10px/1.6 var(--a360-sans); letter-spacing: .18em; text-transform: uppercase; }
.vf-service-cta-copy h2 { margin: 0; max-width: 900px; color: #fff; font: 400 clamp(72px, 7.4vw, 120px)/.91 var(--a360-serif); letter-spacing: -.037em; }
.vf-service-cta-copy h2 em { color: #e3c98e; font-weight: 400; }
.vf-service-cta-copy p:not(.vf-service-cta-kicker) { max-width: 445px; color: #ebe9e3; margin: 27px 0 30px; font-size: 15px; line-height: 1.8; }
.vf-service-cta-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
.vf-service-cta-actions .a360-btn { min-height: 48px !important; line-height: 1.35 !important; }
.vf-service-cta-actions .a360-btn-outline-dark { border-color: #ffffffb0 !important; }
.vf-service-cta-actions .a360-btn:focus-visible { outline: 2px solid var(--a360-gold); outline-offset: 5px; }
@media (max-width: 900px) { .vf-service-cta { --service-cta-top: 97px; } }
@media (max-width: 600px) {
  .vf-service-cta-copy > .a360-shell { padding-block: 50px; }
  .vf-service-cta-copy h2 { font-size: clamp(52px, 13vw, 78px); }
  .vf-service-cta-copy p:not(.vf-service-cta-kicker) { font-size: 13px; }
  .vf-service-cta-actions { gap: 12px; }
  .vf-service-cta-actions .a360-btn { min-width: 0; padding-inline: 20px !important; }
}
@media (prefers-reduced-motion: reduce) { .vf-service-cta-picture > video { transition: none; } }