.screen-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:42px}.screen-card{background:var(--panel);border:1px solid var(--line);border-radius:30px;overflow:hidden}.screen-image{height:510px;display:flex;align-items:flex-start;justify-content:center;overflow:hidden;background:radial-gradient(circle at 50% 65%,#555b2b 0,transparent 65%),#20211e;padding-top:28px}.screen-image img{width:230px;height:auto;border:5px solid #3e403a;border-radius:30px;box-shadow:0 25px 55px #0009}.screen-copy{padding:27px 30px 32px}.screen-copy span{color:var(--lime);font-size:12px;letter-spacing:.15em;text-transform:uppercase;font-weight:800}.screen-copy h3{font:700 28px 'Outfit';margin:9px 0 5px}.screen-copy p{color:var(--muted);margin:0}@media(max-width:650px){.screen-grid{grid-template-columns:1fr}.screen-image{height:460px}}
.image-panel{height:auto;min-height:680px;align-items:center;padding:30px;overflow:visible}.image-panel img{display:block;width:min(100%,290px);height:auto;max-height:none;object-fit:contain}.screen-image{height:auto;min-height:0;padding:28px 20px 32px;overflow:visible}.screen-image img{display:block;width:min(100%,230px);height:auto;object-fit:contain}.phone{height:auto;aspect-ratio:1170/2532}.phone img{display:block;width:100%;height:100%;object-fit:contain}@media(max-width:750px){.image-panel{min-height:0;padding:25px}.image-panel img{width:min(100%,230px)}}@media(max-width:650px){.screen-image{height:auto}}
.hero-art{min-height:850px;padding-top:76px;overflow:visible}.hero-art .phone{width:min(75%,350px);flex:none;z-index:1}.hero-art .float-card.one{top:0;left:50%;right:auto;z-index:3;transform:translateX(-50%) rotate(-4deg);white-space:nowrap}.hero-art .float-card.two{z-index:2;right:-2%;bottom:100px}@media(max-width:750px){.hero-art{min-height:700px;padding-top:72px}.hero-art .phone{width:min(76%,285px)}.hero-art .float-card.one{top:4px;left:50%;right:auto}.hero-art .float-card.two{right:0;bottom:35px}}@media(max-width:420px){.hero-art{min-height:650px}.hero-art .phone{width:min(77%,260px)}.hero-art .float-card.one{padding:11px 15px}.hero-art .float-card.two{bottom:25px}}
.hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.hero>div{min-width:0}.hero h1{overflow-wrap:break-word}.hero-art .phone{width:350px;max-width:calc(100% - 24px)}@media(max-width:750px){.hero{grid-template-columns:minmax(0,1fr)}.hero-art .phone{width:285px;max-width:calc(100% - 24px)}}@media(max-width:420px){.hero-art .phone{width:260px}}
.brand{display:inline-flex;align-items:center;gap:10px}.brand::before{content:"";display:block;flex:none;width:38px;height:38px;background:url("../images/jevu-logo.png") center/cover no-repeat;border-radius:10px}.brand-dot{margin-left:-7px}
.site-header nav{display:grid;grid-template-columns:86px 108px 154px 108px 108px;gap:0;justify-content:center;align-items:center}.site-header nav a{display:block;width:100%;text-align:center;font-size:14px;line-height:1.4;white-space:nowrap}@media(max-width:1050px){.site-header nav{grid-template-columns:76px 94px 132px 94px 94px}.site-header nav a{font-size:12px}}@media(max-width:750px){.site-header nav{display:flex;justify-content:flex-start;gap:0;overflow-x:auto}.site-header nav a{flex:0 0 auto}.site-header nav a:nth-child(1){width:76px}.site-header nav a:nth-child(2){width:94px}.site-header nav a:nth-child(3){width:132px}.site-header nav a:nth-child(4),.site-header nav a:nth-child(5){width:94px}}
/* Browser CSS uses fluid viewport units in place of the mini-app-only rpx unit. */
:root{--jevu-phone-width:clamp(260px,28vw,350px);--jevu-motion-distance:clamp(10px,1.6vw,24px);--jevu-card-gap:clamp(14px,2vw,22px)}
.hero-art .phone{width:var(--jevu-phone-width)}.hero-art{min-height:calc(var(--jevu-phone-width)*2.18 + clamp(72px,7vw,94px))}.screen-grid{gap:var(--jevu-card-gap)}
@keyframes jevu-phone-enter{from{opacity:0;transform:translateY(var(--jevu-motion-distance)) rotate(7deg)}to{opacity:1;transform:translateY(0) rotate(7deg)}}
@keyframes jevu-card-enter{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
.hero-art .phone{animation:jevu-phone-enter .7s cubic-bezier(.2,.7,.2,1) both}.hero-art .float-card{animation:jevu-card-enter .6s ease-out .2s both}.topic,.feature-card,.screen-card,.button,.header-cta,.text-link{transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease}.topic:hover,.feature-card:hover,.screen-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px #0003}.button:hover,.header-cta:hover,.text-link:hover{transform:translateY(-2px)}
@media(max-width:750px){:root{--jevu-phone-width:clamp(240px,68vw,285px)}.hero-art{min-height:calc(var(--jevu-phone-width)*2.18 + 85px)}}
@media(max-width:420px){:root{--jevu-phone-width:clamp(220px,67vw,260px)}}
@media(prefers-reduced-motion:reduce){.hero-art .phone,.hero-art .float-card{animation:none}.topic,.feature-card,.screen-card,.button,.header-cta,.text-link{transition:none}html{scroll-behavior:auto}}
