/* Single fixed media layer: replace the image here with the supplied animation.
   No background-attachment dependency, including on mobile browsers. */
body{background:#171325;isolation:isolate}
.rewards-backdrop{position:fixed;inset:0;z-index:-1;pointer-events:none;background:#171325;overflow:hidden}
.rewards-backdrop img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.rewards-backdrop:after{display:none}
.brand-logo{display:block;width:44px;height:44px;flex-shrink:0}
@media(max-width:400px){.nav .brand{font-size:1rem}.brand-logo{width:30px;height:30px}.nav-login{padding-inline:8px}}
.site-header{position:fixed;inset:0 0 auto;background:rgba(16,10,29,.38);color:white;border-color:#ffffff30;backdrop-filter:blur(12px)}
.menu-toggle{background:#211a31;color:#fff;border-color:#ffffff60}
.mobile-menu{background:#211a31}.mobile-menu a{border-color:#ffffff30}
.hero{position:relative;display:flex;align-items:center;min-height:100vh;min-height:100svh;padding-block:150px 100px;color:white}
.hero-copy{max-width:920px}
.hero h1{font-size:clamp(2.65rem,6.1vw,6rem);line-height:1.05;letter-spacing:-.055em}
.hero h1 span{color:var(--yellow);background:none}
.hero .eyebrow{color:var(--yellow);letter-spacing:.15em}
.hero .intro{color:#fff;max-width:560px;text-shadow:0 1px 8px #0008}
.hero .actions{flex-direction:row;align-items:center}
.hero .secondary{border-color:#ffffff80;color:#fff;background:#100b2080}
.hero .secondary:hover{background:#100b20bb}
.hero .app-link,.hero .app-link a{color:#fff}
.scroll-cue{position:absolute;bottom:30px;left:0;display:flex;gap:24px;align-items:center;color:white;font-size:.875rem;text-decoration:none;padding-block:12px}
.scroll-cue span{font-size:1.25rem}
.site-story{position:relative;background:transparent;color:#fff;--muted:#d5d0df;--line:#ffffff30}
.benefits h2{max-width:950px}.benefits h2 span{color:var(--yellow)}
.benefits .steps{margin-top:48px}
.mechanism{padding-block:85px;background:transparent;border-block:1px solid #ffffff30}
.mechanism h2{max-width:850px}
.mechanism-lines{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.mechanism-lines p{font-family:Manrope,sans-serif;font-size:clamp(1.25rem,2.1vw,2rem);font-weight:700;line-height:1.25;border-top:1px solid #10253450;padding-top:24px;letter-spacing:-.035em}
.launch>.button{margin-top:35px}
.rewards-interlude{min-height:65vh;min-height:65svh;display:flex;align-items:center;padding-block:85px;color:white}
.rewards-interlude .eyebrow{color:var(--yellow)}
.rewards-interlude h2{font-size:clamp(2rem,4.5vw,4.5rem);max-width:1000px;text-shadow:0 2px 20px #0008}
.rewards-interlude p:last-child{font-size:.75rem;margin-top:35px;color:#e5e0ea}
footer{position:relative;background:transparent;color:#fff;--muted:#d5d0df;--line:#ffffff30}
/* Content scrolls over the uninterrupted rewards image all the way to the footer. */
.landlord-entry,.join-section,.landlord-panel,.join-guidance{background:transparent;color:#fff}
.landlord-entry{border-color:#ffffff30}
.site-story .eyebrow{color:var(--yellow)}
.join-section{border-block:1px solid #ffffff30}
.join-guidance{border:1px solid #ffffff40}
.join-grid>div>p:not(.eyebrow){color:#d5d0df}
.landlord-panel{border:1px solid #ffffff40}
.mechanism-lines p{border-color:#ffffff40}
.site-story .number{color:var(--ink)}
.site-story .dark{background:var(--yellow);color:var(--ink)}
.site-story .dark:hover{background:#e9dc24}
.faq summary,.text-link{color:#fff}
@media(max-width:700px){.hero{padding-top:115px;padding-bottom:105px}.hero h1{font-size:clamp(2.3rem,8.9vw,3.7rem)}.hero .actions{flex-direction:column;align-items:stretch}.hero .intro{font-size:1rem}.rewards-backdrop img{object-position:48% center}.rewards-backdrop:after{background:rgba(13,9,26,.62)}.mechanism{padding-block:50px}.mechanism-lines{grid-template-columns:1fr;gap:20px}.rewards-interlude{min-height:65svh;padding-block:65px}.benefits .steps{margin-top:32px}}
