/* Golden Coastal Drive CTA: brighter, more cinematic, and more compact editorial copy. */
.future-callout {
  position: relative;
  isolation: isolate;
  display: block !important;
  min-height: clamp(620px, 76vh, 840px);
  overflow: hidden;
  padding: clamp(70px, 8vw, 118px) clamp(24px, 5.7vw, 92px) clamp(58px, 6vw, 84px);
  background: #071f2c;
}
.future-callout-copy { position: relative; z-index: 3; width: min(100%, 455px); padding-block: 0; }
.future-callout-copy .eyebrow, .future-callout-copy h2, .future-callout-copy .lede, .future-callout-copy .future-actions { position: relative; z-index: 4; }
.future-callout-copy h2 { max-width: 430px; margin: 18px 0 24px; font-size: clamp(52px, 5.25vw, 86px); line-height: .94; letter-spacing: -.055em; text-wrap: balance; }
.future-callout-copy .lede { max-width: 390px; margin-bottom: 28px; font-size: clamp(15px, 1.15vw, 18px); line-height: 1.55; }
.future-callout-art.home-vision-art { position: absolute; z-index: 1; inset: 0; width: 100%; min-height: 100%; margin: 0; background-image: url('../assets/golden-coastal-drive-at-sunset2.png?v=20260924-3') !important; background-repeat: no-repeat; background-position: center bottom; background-size: cover; opacity: 1; filter: brightness(1.12) saturate(1.16) contrast(1.05); pointer-events: none; }
.future-callout-art.home-vision-art::before { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(7,31,44,.88) 0%, rgba(7,31,44,.64) 18%, rgba(7,31,44,.24) 38%, rgba(7,31,44,.04) 61%, rgba(7,31,44,0) 100%), linear-gradient(0deg, rgba(7,31,44,.38) 0%, rgba(7,31,44,0) 46%); pointer-events: none; }
.future-callout-art.home-vision-art::after { content: ""; position: absolute; inset: 0; z-index: 3; background: radial-gradient(circle at 74% 48%, rgba(255,205,112,.16), transparent 24%), radial-gradient(circle at 55% 65%, rgba(226,174,82,.06), transparent 34%); mix-blend-mode: screen; pointer-events: none; }
.future-actions { position: relative; z-index: 5; display: flex; flex-wrap: wrap; gap: 12px; max-width: 455px; }
.future-actions .button, .future-actions .button.light { flex: 0 1 auto; min-width: 0; min-height: 54px; padding-inline: 25px; white-space: nowrap; }
@media (max-width: 980px) { .future-callout { min-height: 720px; padding: 70px 32px 48px; } .future-callout-copy { width: min(100%, 470px); } .future-callout-art.home-vision-art { background-position: 62% bottom; background-size: cover; filter: brightness(1.1) saturate(1.12) contrast(1.04); } .future-callout-art.home-vision-art::before { background: linear-gradient(180deg, rgba(7,31,44,.92) 0%, rgba(7,31,44,.62) 29%, rgba(7,31,44,.12) 58%, rgba(7,31,44,.18) 100%); } }
@media (max-width: 640px) { .future-callout { min-height: 700px; padding: 54px 22px 30px; } .future-callout-copy { width: 100%; } .future-callout-copy h2 { max-width: 310px; font-size: clamp(44px, 11vw, 62px); line-height: .96; margin-bottom: 20px; } .future-callout-copy .lede { max-width: 315px; font-size: 14px; line-height: 1.45; margin-bottom: 22px; } .future-callout-art.home-vision-art { background-position: 64% bottom; background-size: auto 62%; filter: brightness(1.08) saturate(1.1) contrast(1.03); } .future-callout-art.home-vision-art::before { background: linear-gradient(180deg, rgba(7,31,44,.96) 0%, rgba(7,31,44,.82) 31%, rgba(7,31,44,.22) 61%, rgba(7,31,44,.24) 100%); } .future-actions { flex-direction: column; align-items: stretch; width: min(100%, 340px); gap: 10px; } .future-actions .button, .future-actions .button.light { width: 100%; flex: 1 1 auto; min-height: 50px; white-space: normal; } }
@media (prefers-reduced-motion: reduce) { .future-callout-art.home-vision-art, .future-callout-copy { animation: none !important; transition: none !important; } }