/* Local photographic reference and progressive motion for home/features only. */
.homepage {
    background: linear-gradient(180deg, rgba(12, 4, 18, .06), rgba(12, 4, 18, .18)), url("images/wallpapers/bg.9944b8471704.webp") center top / cover no-repeat;
}
.home-layout { padding-top: 150px; gap: 40px; }
.homepage h1 { font-size: clamp(2.3rem, 5.6vw, 5rem); text-shadow: 0 0 9px rgba(255,255,255,.7), 0 0 30px rgba(255,255,255,.5); }
.partners, .signup-home { background: linear-gradient(rgba(13,14,19,.25), rgba(13,14,19,.45)), url("images/wallpapers/night.7668f3f50736.webp") center / cover; }
.signup-link { position: relative; isolation: isolate; overflow: hidden; min-height: 90vh; }
.signup-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; }
.signup-link .buttonLvt { background: rgba(255,255,255,.9); }
.dashboard-showcase { background: #fff; border-radius: 25px 25px 0 0; box-shadow: 0 -2px 18px rgba(255,255,255,.5); }
.dashboard-showcase-copy { max-width: 980px; }
.dashboard-showcase-copy h2 { font-size: clamp(2rem, 4.2vw, 3.75rem); background-image: linear-gradient(#397f39, #287d83 30%, #515cbb 55%, #8b48a3 75%, #b34c6b); }
.advantages { position: relative; padding-top: 50px; }
.motion-toggle, .scene-controls button { border: 1px solid #e5dfec; border-radius: 8px; padding: 9px 12px; background: #19171f; color: white; cursor: pointer; font: inherit; font-size: 13px; }
.advantages > .motion-toggle { position: absolute; top: 0; right: 0; }
.advantages.is-animated .advantage-visual { animation: advantage-float 7s ease-in-out infinite; }
.advantages.is-animated .two .advantage-visual { animation-delay: -2s; animation-name: advantage-pan; }
.advantages.is-animated .three .advantage-visual { animation-delay: -4s; animation-name: advantage-breathe; }
.advantages.is-paused .advantage-visual { animation-play-state: paused; }
@keyframes advantage-float { 0%,100% { transform: scale(1.03) translateY(0); } 50% { transform: scale(1.07) translateY(-5px); } }
@keyframes advantage-pan { 0%,100% { transform: scale(1.07) translateX(-3px); } 50% { transform: scale(1.07) translateX(3px); } }
@keyframes advantage-breathe { 0%,100% { transform: scale(1.02); } 50% { transform: scale(1.07); } }

.how-banner .header-img.features-scene { display: block; width: min(48%, 680px); height: auto; margin: 50px 24px 24px 0; background: transparent; }
.features-scene h2 { font-size: 20px; text-align: center; color: white; margin: 0 0 12px; }
.features-scene .market-stage { min-height: 390px; overflow: hidden; background: url("images/wallpapers/city3d.8faaaa0b5586.webp") center / contain no-repeat; perspective: 1100px; border-radius: 20px; }
.features-scene .market-carousel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; height: auto; padding: 24px; animation: none; transform: none; }
.features-scene .market-carousel .market-panel { position: relative; display: block; min-width: 0; width: auto; height: 180px; margin: 0; border-radius: 10px; background: #18151e; border: 1px solid #948798; box-shadow: 0 4px 18px #17101d80; overflow: hidden; }
.features-scene .market-panel img { display: block; width: 100%; height: 100%; object-fit: cover; }
.features-scene .market-panel figcaption { position: absolute; bottom: 0; padding: 20px 5px 10px; text-align: center; font-size: 13px; background: linear-gradient(transparent, #15101deb); }
.features-scene.is-animated .market-stage { height: 440px; touch-action: pan-y; cursor: grab; }
.features-scene.is-animated .market-carousel { display: block; position: absolute; left: 50%; top: 40%; width: 0; height: 0; padding: 0; transform-style: preserve-3d; }
.features-scene.is-animated .market-panel { position: absolute; left: -65px; top: -90px; width: 130px; height: 180px; transform: rotateY(var(--angle)) translateZ(180px); -webkit-box-reflect: below 8px linear-gradient(transparent 60%, #ffffff30); }
.features-scene .market-panel:nth-child(1) { --angle: 0deg; }
.features-scene .market-panel:nth-child(2) { --angle: 60deg; }
.features-scene .market-panel:nth-child(3) { --angle: 120deg; }
.features-scene .market-panel:nth-child(4) { --angle: 180deg; }
.features-scene .market-panel:nth-child(5) { --angle: 240deg; }
.features-scene .market-panel:nth-child(6) { --angle: 300deg; }
.features-scene.is-animated .market-ground { position: absolute; width: 75%; height: 90px; left: 12.5%; bottom: 58px; border-radius: 50%; background: radial-gradient(ellipse, #e0d4f344, transparent 70%); }
.features-scene.is-animated .market-stage::before, .features-scene.is-animated .market-stage::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: repeating-linear-gradient(100deg, transparent 0 65px, #ffffff18 66px 67px, transparent 68px 130px); background-size: 180px 150px; mask-image: linear-gradient(transparent, #000, transparent); animation: local-rain 1.5s linear infinite; }
.features-scene.is-animated .market-stage::after { opacity: .4; background-size: 280px 210px; animation-duration: 2.5s; }
.features-scene.is-paused .market-stage::before, .features-scene.is-paused .market-stage::after { animation-play-state: paused; }
@keyframes local-rain { to { background-position: -20px 150px; } }
.scene-controls { display: flex; justify-content: center; gap: 10px; margin-top: 12px; }
.features-scene :focus-visible, .advantages .motion-toggle:focus-visible { outline: 3px solid #fbb6d4; outline-offset: 3px; }
@media (min-width: 1000px) and (prefers-reduced-motion: no-preference) { .partners, .signup-home { background-attachment: fixed; } }
@media (max-width: 950px) {
    .how-banner .header-img.features-scene { width: min(100% - 32px, 620px); margin: 24px auto; }
    .how-banner .header-flex { flex-direction: column; padding-top: 110px; }
    .features-scene .market-stage { min-height: 0; }
}
@media (max-width: 750px) {
    .home-layout { padding-top: 125px; width: calc(100% - 36px); }
    .homepage h1 { font-size: clamp(2rem, 8vw, 3rem); }
    .signup-link { min-height: 60vh; }
    .advantages { padding-top: 65px; }
    .features-scene .market-carousel { gap: 10px; padding: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .features-scene .market-carousel .market-panel { height: 170px; }
}
@media (prefers-reduced-motion: reduce) {
    .partners, .signup-home { background-attachment: scroll; }
    .advantages .advantage-visual, .features-scene .market-carousel { animation: none !important; transform: none !important; }
}
