.demo-video-card{display:flex;flex-direction:column}
.demo-video-card .demo-card-screen{position:relative;aspect-ratio:16/9;overflow:hidden;background:#1d2c73}
.demo-video-card .demo-card-screen .demo-card-poster,.demo-video-card .demo-card-screen video{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;border:0;border-radius:0}
.demo-video-card .demo-card-screen .demo-card-poster{object-fit:cover}
.demo-video-card .demo-card-screen video{opacity:0;transition:opacity .3s ease}
.demo-video-card.is-playing .demo-card-screen video{opacity:1}
.demo-video-card.is-playing .demo-card-poster{opacity:0}
.demo-video-card figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;flex:1}
.demo-video-card figcaption>span{font-size:15px;line-height:1.5}


.farm-demo .demo-video-card+figure{display:flex;flex-direction:column}
.farm-demo .demo-video-card+figure>a{display:block;position:relative;aspect-ratio:16/9;background:#f3f5f8}
.farm-demo .demo-video-card+figure>a>img{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;object-position:50% 70%}
.farm-demo .demo-video-card+figure>figcaption{flex:1;display:flex;align-items:center;min-height:73px}
@media(max-width:760px){.demo-video-card figcaption{padding:12px 14px;gap:10px}.demo-video-card figcaption>span{font-size:15px}.farm-demo .demo-video-card+figure>figcaption{min-height:62px}}
@media(prefers-reduced-motion:reduce){.demo-video-card .demo-card-screen video{transition:none}}
.demo-photo-card{display:flex;flex-direction:column}
.demo-card-photo-stage{position:relative;aspect-ratio:16/9;background:#f3f5f8;overflow:hidden}
.demo-card-photo-stage>a{display:block;position:absolute;inset:0}
.farm-demo .demo-photo-card .demo-card-photo-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 70%}
.demo-photo-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:1;width:44px;height:48px;padding:0;display:grid;place-items:center;border:1px solid #ffffffb3;border-radius:3px;background:#27358dbf;color:#fff;font:30px/1 Arial;cursor:pointer}
.demo-photo-prev{left:10px}.demo-photo-next{right:10px}
.demo-photo-arrow:focus-visible{outline:3px solid #27358d;outline-offset:3px}
.demo-photo-card figcaption{display:flex;align-items:center;justify-content:space-between;gap:15px;flex:1;min-height:73px}
.demo-photo-count{white-space:nowrap;font-size:14px;color:#53678b}

.xcmg-film-hero{position:relative;isolation:isolate;min-height:650px;background:#16254b;color:white;overflow:hidden}
.xcmg-film-media,.xcmg-film-shade{position:absolute;inset:0;z-index:-1}
.xcmg-film-media :is(img,video){position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%;border:0;border-radius:0}
.xcmg-film-media video{opacity:0;transition:opacity .5s ease}
.xcmg-film-hero.is-playing video{opacity:1}
.xcmg-film-shade{background:linear-gradient(90deg,#132349f2 0%,#132349b3 31%,#13234933 65%,#13234912),linear-gradient(0deg,#132349a6,transparent 35%)}
.xcmg-film-inner{max-width:1440px;margin:auto;min-height:650px;display:flex;align-items:center;padding:80px 5vw 110px}
.xcmg-film-copy{max-width:750px}
main .xcmg-film-kicker{font:700 14px/1.5 Arial,Helvetica,sans-serif;letter-spacing:.1em;margin:0 0 26px;color:#e6ecff}
.xcmg-film-hero h1{color:#fff;font:700 clamp(46px,5.4vw,78px)/1.05 Arial,Helvetica,sans-serif;max-width:none;letter-spacing:-.035em;hyphens:none;margin:0 0 40px}
.xcmg-film-hero .button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;background:white;color:#27358d;border:1px solid white;padding:17px 22px;font-size:17px;min-height:58px}
.xcmg-film-topnote{position:absolute;top:26px;right:3vw;display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.09em}
.xcmg-film-topnote::before{content:'';width:7px;height:7px;background:#cce59e;border-radius:50%}
.xcmg-film-bottom{position:absolute;bottom:24px;left:3vw;right:3vw;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:13px}

.xcmg-film-hero :is(a,button):focus-visible{outline:3px solid white;outline-offset:5px}
.xcmg-film-tabs{padding-top:28px;padding-bottom:28px;background:#f4f5fa}
.xcmg-film-tabs .xcmg-tabs{margin:0}
@media(min-width:1800px){.xcmg-film-hero,.xcmg-film-inner{min-height:730px}}
@media(max-width:760px){
 .xcmg-film-hero{min-height:0}
 .xcmg-film-media{height:350px;bottom:auto}
 .xcmg-film-media :is(img,video){object-position:50% 50%}
 .xcmg-film-shade{top:180px;bottom:auto;height:185px;background:linear-gradient(0deg,#16254b,transparent)}
 .xcmg-film-inner{min-height:0;padding:310px 6vw 110px;align-items:start}
 main .xcmg-film-kicker{font-size:12px;margin-bottom:18px}
 .xcmg-film-hero h1{font-size:clamp(40px,9vw,56px);line-height:1.08;margin-bottom:28px}
 .xcmg-film-hero .button{padding:14px 18px;font-size:16px;gap:20px;min-height:52px}
 .xcmg-film-topnote{top:17px;right:6vw;font-size:10px}
 .xcmg-film-bottom{left:6vw;right:6vw;bottom:23px;font-size:12px;gap:12px}
 
}
@media(prefers-reduced-motion:reduce){.xcmg-film-media video{transition:none}}