/* Static-first: disabling JavaScript or motion leaves a single, readable image. */
.scroll-film { --film-progress:1; --film-globe:0; --film-globeScale:1; --film-california:0; --film-mapScale:1; --film-property:1; --film-scale:1; --film-light:1; --film-shutter:0; --film-frame:1; position:relative; background:#03090f; }
.scroll-film.motion-enabled { height:430svh; }
.seller-film.motion-enabled { height:310svh; }
.film-stage { position:relative; height:100svh; min-height:620px; overflow:hidden; isolation:isolate; color:#f3f4ed; }
.motion-enabled .film-stage { position:sticky; top:0; }
.film-art,.film-shade,.film-stars,.film-property,.seller-image,.seller-shutter,.seller-frame { position:absolute; inset:0; pointer-events:none; }
.film-art { z-index:-2; overflow:hidden; }
.film-stars { background:radial-gradient(circle at 11% 28%,#d1f2ff 0 1px,transparent 2px),radial-gradient(circle at 67% 19%,#d1f2ff80 0 1px,transparent 2px),radial-gradient(circle at 84% 53%,#d1f2ff90 0 1px,transparent 2px),radial-gradient(circle at 39% 75%,#d1f2ff80 0 1px,transparent 2px),radial-gradient(ellipse at 72% 40%,#1a354830,transparent 65%); background-size:271px 271px,409px 409px,353px 353px,499px 499px,100% 100%; opacity:var(--film-globe); }
.film-globe { position:absolute; width:min(67vw,870px); aspect-ratio:1; right:-3%; top:50%; opacity:var(--film-globe); transform:translateY(-47%) scale(var(--film-globeScale)); transform-origin:45% 44%; border-radius:50%; }
.film-globe svg { display:block; width:100%; filter:drop-shadow(0 0 24px #5ea8e63b); }
.film-california { position:absolute; width:min(31vw,390px); right:17%; top:50%; transform:translateY(-48%) scale(var(--film-mapScale)); opacity:var(--film-california); }
.film-california svg { display:block; width:100%; }
.film-california>span { position:absolute; top:42%; left:43%; font-size:12px; letter-spacing:.2em; white-space:nowrap; }
.film-california small { display:block; font-size:11px; letter-spacing:0; color:#b7cdd5; padding-top:8px; }
.film-property { opacity:var(--film-property); transform:scale(var(--film-scale)); transform-origin:50% 49%; }
.film-property img,.seller-image img { width:100%; height:100%; display:block; object-fit:cover; object-position:center 48%; }
.film-shade { background:linear-gradient(90deg,#03090fbd,transparent 80%),linear-gradient(0deg,#03090ff5,transparent 31%,transparent 70%,#03090f99); }
.film-topline { position:absolute; top:125px; left:6%; right:6%; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:10px; letter-spacing:.16em; color:#d4e2e5; }
.film-topline a { display:inline-flex; align-items:center; min-height:44px; font-size:12px; letter-spacing:0; border-bottom:1px solid #bcd2d95c; }
.film-titles { position:absolute; left:8%; right:6%; top:39%; height:250px; pointer-events:none; }
.film-titles>p { position:absolute; inset:0; opacity:0; font:clamp(54px,7.1vw,112px)/.98 var(--serif); letter-spacing:-.055em; margin:0; text-shadow:0 3px 24px #0008; }
.film-titles>p:last-child { opacity:1; }
.film-titles em { color:#d7e8e3; }
.film-titles small { display:block; font:10px/1.5 var(--sans); letter-spacing:.24em; color:#c1d4db; margin-bottom:24px; }
.film-bottom { position:absolute; bottom:26px; left:6%; right:6%; }
.film-chapters { display:flex; gap:36px; font-size:10px; letter-spacing:.1em; color:#a8bac3; }
.film-chapters span { padding-block:12px; }
.film-chapters b { font-weight:400; margin-left:10px; }
.film-chapters .is-current { color:#e6f9f7; }
.film-progress { height:1px; background:#ffffff30; margin:8px 0; }
.film-progress i { display:block; width:100%; height:1px; background:#b5ebeb; transform:scaleX(var(--film-progress)); transform-origin:left; }
.film-caption { display:flex; align-items:center; justify-content:space-between; gap:14px; color:#b5c7d1; font-size:10px; }
.film-caption button { min-height:48px; padding:8px 0 8px 12px; font-size:11px; text-decoration:underline; text-underline-offset:4px; }
.film-caption button[hidden] { display:none; }
.arrival-welcome { min-height:680px; padding-top:100px; padding-bottom:100px; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); }
.arrival-note { border-left:1px solid #ffffff30; padding:36px 0 36px 40px; }
.arrival-note>p { font:clamp(32px,3.2vw,48px)/1.12 var(--serif); letter-spacing:-.04em; margin:28px 0; }
.arrival-note small { display:block; color:#a8bac3; font-size:12px; line-height:1.8; max-width:320px; }
.arrival-note .text-button { margin-top:20px; }
.seller-image { transform:scale(var(--film-scale)); transform-origin:center 48%; }
.seller-image img { object-position:center; }
.seller-ambience { position:absolute; inset:0; background:radial-gradient(ellipse at 58% 53%,#ffd39b22 0%,#ffd39b10 31%,transparent 67%); opacity:var(--film-light); mix-blend-mode:screen; }
.seller-shutter { background:#02060a; transform:scaleY(var(--film-shutter)); z-index:1; }
.seller-frame { inset:max(180px,24%) 5% 19%; border:1px solid #e2e8de80; opacity:var(--film-frame); }
.seller-frame::after { content:'CALI DREAMZ / THE PROPERTY EDIT'; position:absolute; right:18px; bottom:15px; font-size:9px; letter-spacing:.17em; color:#f1e9d7; }
.seller-film .film-titles { top:40%; }
@media(max-width:900px) {
  .film-globe { width:95vw; right:-30%; }
  .film-california { width:43vw; right:12%; }
  .film-titles { left:6%; }
  .arrival-welcome { grid-template-columns:1fr; gap:35px; }
  .arrival-note { padding:20px 0 20px 25px; }
}
@media(max-width:620px) {
  .scroll-film.motion-enabled { height:350svh; }
  .seller-film.motion-enabled { height:185svh; }
  .film-stage { min-height:590px; }
  .film-topline { top:111px; font-size:8px; letter-spacing:.08em; align-items:flex-start; }
  .film-topline>span { max-width:180px; padding-top:12px; }
  .film-topline a { font-size:11px; white-space:nowrap; }
  .film-globe { width:110vw; right:-35%; top:40%; }
  .film-california { width:53vw; right:18%; top:38%; }
  .film-california>span { font-size:9px; left:33%; }
  .film-california small { font-size:9px; }
  .film-titles,.seller-film .film-titles { top:49%; height:190px; }
  .film-titles>p { font-size:clamp(43px,10.8vw,66px); }
  .film-titles small { font-size:8px; margin-bottom:16px; }
  .film-chapters { gap:0; justify-content:space-between; font-size:8px; letter-spacing:0; }
  .film-chapters b { margin-left:4px; }
  .film-caption { font-size:9px; gap:10px; }
  .film-caption>span { max-width:195px; }
  .film-caption button { font-size:10px; white-space:nowrap; }
  .film-bottom { bottom:18px; }
  .film-shade { background:linear-gradient(0deg,#03090ff7,transparent 85%),linear-gradient(180deg,#03090fa8,transparent 40%); }
  .seller-frame { inset:23% 4% 23%; }
  .seller-frame::after { font-size:7px; right:10px; bottom:12px; }
  .arrival-welcome { padding-top:70px; padding-bottom:70px; }
  .arrival-welcome .hero-note { margin-top:35px; }
}
@media(prefers-reduced-motion:reduce) {
  .scroll-film.motion-enabled { height:auto; }
  .motion-enabled .film-stage { position:relative; }
  .film-property,.seller-image { transform:none; }
}

/* Seller story: restrained scroll travel and source-image framing. */
.seller-film { --film-light:0; }
.seller-film .seller-image { inset:70px 0 0; }
.seller-film .seller-image img { object-position:center top; }
.seller-video { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center top; opacity:0; transition:opacity .22s ease; }
.seller-film.has-video-frame .seller-video { opacity:1; }
.seller-film.video-failed .seller-video { display:none; }

.seller-film .film-titles { top:38%; }
@media(max-width:900px) {
  .seller-film.motion-enabled { height:190svh; }
  .seller-film .film-titles { top:39%; }
}
@media(max-width:620px) {
  .seller-film .seller-image img,.seller-film .seller-video { object-position:69% top; }
  .seller-film .film-titles { top:26%; }
}
@media(max-width:900px) and (prefers-reduced-motion:reduce) {
  .seller-film.motion-enabled { height:auto; }
}
@media(max-width:900px) and (prefers-reduced-motion:no-preference) {
  .seller-film.motion-enabled { height:190svh; }
}
@media(max-width:620px) and (prefers-reduced-motion:reduce) {
  .seller-film.motion-enabled { height:auto; }
}
@media(max-width:620px) and (prefers-reduced-motion:no-preference) {
  .seller-film.motion-enabled { height:185svh; }
}

/* Short, reversible page introductions. Copy and actions remain ordinary DOM. */
.buying-film,.about-film,.finance-film { --film-light:0; }
.buying-film.motion-enabled,.about-film.motion-enabled,.finance-film.motion-enabled { height:190svh; }
.buying-film .film-stage,.about-film .film-stage,.finance-film .film-stage { min-height:620px; }
.buying-film .film-art>img,.about-film .film-art>img,.finance-film .film-art>img,
.buying-film .film-video,.about-film .film-video,.finance-film .film-video {
  position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; pointer-events:none;
}
.buying-film .film-art>img,.about-film .film-art>img,.finance-film .film-art>img { object-position:center; }
.about-film .film-art>img,.about-film .film-video { object-position:69% center; }
.finance-film .film-art>img,.finance-film .film-video { object-position:center 52%; }
.buying-film .film-video,.about-film .film-video,.finance-film .film-video { opacity:0; transition:opacity .22s ease; }
.buying-film.has-video-frame .film-video,.about-film.has-video-frame .film-video,.finance-film.has-video-frame .film-video { opacity:1; }
.buying-film.video-failed .film-video,.about-film.video-failed .film-video,.finance-film.video-failed .film-video { display:none; }
.buying-film .film-shade,.about-film .film-shade,.finance-film .film-shade {
  background:linear-gradient(90deg,#03090fe8 0%,#03090fa8 36%,#03090f24 76%,#03090f47 100%),linear-gradient(0deg,#03090fc9,transparent 32%,transparent 68%,#03090f88);
}
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] {
  position:absolute; inset:0 auto auto 0; width:min(100%,760px); opacity:0;
  pointer-events:none; text-shadow:0 3px 24px #0009;
}
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title]:first-child { opacity:1; }
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h1,:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h2 {
  max-width:760px; margin:0 0 18px; font:clamp(52px,6.5vw,92px)/.99 var(--serif);
  letter-spacing:-.055em; text-wrap:balance;
}
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] em { color:#d7e8e3; }
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title]>small {
  display:block; font:10px/1.5 var(--sans); letter-spacing:.2em; color:#d0e1e4; margin-bottom:19px;
}
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title]>p {
  max-width:560px; margin:0 0 20px; color:#d2dfe2; font:17px/1.65 var(--sans); text-shadow:0 2px 18px #000b;
}
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] .film-cta {
  display:inline-flex; align-items:center; min-height:48px; padding:0 18px;
  border:1px solid #dce9eb8c; border-radius:999px; color:#f5f7f4; background:#0a1217a8;
  font:14px/1.2 var(--sans); text-decoration:none; pointer-events:auto;
}
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] .film-cta:hover { background:#dce9eb; color:#111a20; }
:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] .film-cta:focus-visible { outline:2px solid #a5e9e7; outline-offset:4px; }
.film-topline a[data-film-skip] { min-width:100px; justify-content:flex-end; }
.film-page-nav { max-width:1240px; margin:0 auto; }
.about-film .film-titles { right:48%; }
.finance-film .film-titles { right:8%; }
.finance-film :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h1,.finance-film :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h2 { max-width:700px; }
@media(min-width:901px) {
  .buying-film,.about-film,.finance-film { width:100%; }
  .buying-film .film-stage,.about-film .film-stage,.finance-film .film-stage { height:100svh; }
}
@media(max-width:900px) {
  .buying-film.motion-enabled,.about-film.motion-enabled,.finance-film.motion-enabled { height:190svh; }
  .about-film .film-titles { right:42%; }
  :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h1,:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h2 { font-size:clamp(46px,8vw,72px); }
}
@media(max-width:620px) {
  .buying-film.motion-enabled,.about-film.motion-enabled,.finance-film.motion-enabled { height:185svh; }
  .buying-film .film-stage,.about-film .film-stage,.finance-film .film-stage { min-height:650px; }
  .buying-film .film-art>img,.buying-film .film-video { object-position:50% center; }
  .about-film .film-art>img,.about-film .film-video { object-position:72% center; }
  .finance-film .film-art>img,.finance-film .film-video { object-position:58% center; }
  .buying-film .film-shade,.about-film .film-shade,.finance-film .film-shade {
    background:linear-gradient(0deg,#03090ff2 0%,#03090fbe 46%,#03090f32 100%),linear-gradient(90deg,#03090f66,transparent 78%);
  }
  .buying-film .film-titles,.about-film .film-titles,.finance-film .film-titles { top:37%; left:6%; right:6%; height:280px; }
  .about-film .film-titles { top:38%; right:6%; }
  :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h1,:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h2 { font-size:clamp(42px,10.4vw,58px); line-height:1.02; margin-bottom:13px; }
  :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title]>small { font-size:8px; letter-spacing:.16em; margin-bottom:13px; }
  :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title]>p { font-size:15px; line-height:1.5; margin-bottom:14px; max-width:34ch; }
  :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] .film-cta { min-height:48px; font-size:13px; }
  .film-topline { top:111px; }
  .film-bottom { bottom:18px; }
}
@media(max-width:360px) {
  .buying-film .film-titles,.about-film .film-titles,.finance-film .film-titles { top:36%; }
  :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h1,:is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title] h2 { font-size:41px; }
  :is(.buying-film,.about-film,.finance-film) .film-titles>[data-film-title]>p { font-size:14px; max-width:30ch; }
}
@media(max-height:620px),(prefers-reduced-motion:reduce) {
  .buying-film.motion-enabled,.about-film.motion-enabled,.finance-film.motion-enabled { height:auto; }
  .buying-film.motion-enabled .film-stage,.about-film.motion-enabled .film-stage,.finance-film.motion-enabled .film-stage { position:relative; height:650px; min-height:0; }
}

/* Three financing beats get a readable, native-scroll runway. */
@media(prefers-reduced-motion:no-preference){.finance-film.motion-enabled{height:330svh}}
