/* Real DiyarSis demo panel, presented as a layered product preview. */
#landingHero .hero-animation-img{position:relative;max-width:1180px;margin:3.5rem auto 0;overflow:visible}
#landingHero .hero-animation-img>a{display:block;text-decoration:none;outline-offset:12px}
#landingHero .hero-dashboard-img.dy-demo-showcase{position:relative;width:min(100%,1080px);height:auto;max-width:none;margin:auto;padding:23px 32px 35px;isolation:isolate;perspective:1400px}
.dy-demo-showcase__glow{position:absolute;inset:5% 0 0;z-index:-1;background:radial-gradient(ellipse at 52% 38%,rgba(115,103,240,.27),rgba(171,145,235,.13) 45%,transparent 72%);filter:blur(23px)}
.dy-demo-showcase__frame{position:relative;overflow:hidden;border:1px solid rgba(107,92,207,.18);border-radius:20px;background:#fff;box-shadow:0 48px 75px -35px rgba(55,43,110,.5),0 18px 40px rgba(87,73,158,.15),inset 0 1px rgba(255,255,255,.9);transform:rotateX(5deg) rotateY(-7deg) rotateZ(-1deg);transition:transform .45s ease,box-shadow .45s ease;transform-origin:center center}
#landingHero .hero-animation-img>a:hover .dy-demo-showcase__frame{transform:rotateX(2deg) rotateY(-2deg) rotateZ(0);box-shadow:0 52px 90px -30px rgba(55,43,110,.54),0 22px 46px rgba(87,73,158,.17)}
.dy-demo-showcase__frame:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:20px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.55)}
.dy-demo-showcase__bar{display:flex;align-items:center;gap:15px;height:38px;padding:0 17px;background:linear-gradient(90deg,#fdfcff,#f4f2ff);border-bottom:1px solid #e9e6f6;color:#76748e;font-size:11px;font-weight:600;letter-spacing:.02em}
.dy-demo-showcase__dots{display:inline-flex;gap:5px}.dy-demo-showcase__dots i{width:7px;height:7px;border-radius:50%;background:#d5d0e8}.dy-demo-showcase__dots i:first-child{background:#f09aa8}.dy-demo-showcase__dots i:nth-child(2){background:#f6c985}.dy-demo-showcase__dots i:last-child{background:#8bd5bd}
.dy-demo-showcase__url{flex:1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dy-demo-showcase__live{display:flex;align-items:center;gap:5px;color:#564bd1;white-space:nowrap}.dy-demo-showcase__live i{width:6px;height:6px;background:#28c791;border-radius:50%;box-shadow:0 0 0 3px rgba(40,199,145,.15)}
.dy-demo-showcase__frame img{display:block;width:100%;height:auto;aspect-ratio:1745/777;object-fit:cover;object-position:top}
.dy-demo-showcase__caption{position:absolute;right:0;bottom:5px;z-index:3;display:flex;flex-direction:column;gap:3px;padding:13px 18px;border:1px solid rgba(102,89,202,.15);border-radius:14px;background:rgba(255,255,255,.94);box-shadow:0 15px 35px rgba(70,54,134,.15);text-align:left;transform:rotate(3deg)}.dy-demo-showcase__caption strong{color:#3e365d;font-size:13px}.dy-demo-showcase__caption small{color:#77728f;font-size:11px}
@media(max-width:767px){#landingHero .hero-animation-img{margin:2rem auto 0}#landingHero .hero-dashboard-img.dy-demo-showcase{padding:10px 6px 15px}.dy-demo-showcase__frame{border-radius:11px;transform:rotateX(3deg) rotateY(-3deg) rotateZ(-.5deg)}.dy-demo-showcase__bar{height:26px;padding:0 9px;font-size:8px;gap:7px}.dy-demo-showcase__dots{gap:3px}.dy-demo-showcase__dots i{width:5px;height:5px}.dy-demo-showcase__caption{right:3px;bottom:0;padding:7px 9px;border-radius:8px;transform:none}.dy-demo-showcase__caption strong{font-size:9px}.dy-demo-showcase__caption small{display:none}}
@media(prefers-reduced-motion:reduce){.dy-demo-showcase__frame{transition:none}}