/* DarkMovis Animation World 1.0 — playful visuals, native scrolling, GPU-safe motion. */
.dman {
    --dman-red: #ff5d73;
    --dman-red-rgb: 255,93,115;
    --dman-violet: #9b7cff;
    --dman-aqua: #43d8c4;
    --dman-yellow: #ffc45d;
    --dman-navy: #07101f;
    --dman-view: 5.35;
    --dman-gap: 13px;
    --dman-width: min(calc(var(--dmui-page-width,100vw) - 34px),1366px);
    position: relative;
    width: var(--dman-width);
    margin: clamp(30px,4vw,54px) calc((100% - var(--dman-width))/2);
    overflow: visible;
    color: #f9fbff;
    direction: rtl;
    font-family: inherit;
    isolation: isolate;
    contain: layout style;
    -webkit-tap-highlight-color: transparent;
}

.elementor-widget-darkmovis_animations,
.elementor-widget-darkmovis_animations > .elementor-widget-container { overflow: visible !important; }
.dman, .dman *, .dman *::before, .dman *::after { box-sizing: border-box; }
.dman :where(a,button) { font: inherit; -webkit-tap-highlight-color: transparent; }
.dman a { color: inherit; text-decoration: none; }
.dman svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.dman::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 11px;
    left: 12px;
    width: 132px;
    height: 74px;
    opacity: .13;
    background-image: radial-gradient(circle,rgba(255,255,255,.9) 1px,transparent 1.35px);
    background-size: 14px 14px;
    transform: rotate(-7deg);
    pointer-events: none;
}

.dman__header { min-height: 78px; margin-bottom: 20px; padding-inline: 2px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.dman__heading { min-width: 0; flex: 1 1 auto; display: flex; align-items: center; gap: 12px; }
.dman__heading-copy { position: relative; min-width: 0; padding-bottom: 9px; display: block; }
.dman__heading-copy::after { content: ""; position: absolute; right: 0; bottom: 0; width: min(205px,88%); height: 1px; border-radius: 99px; background: linear-gradient(90deg,transparent,var(--dman-violet),var(--dman-red)); box-shadow: 0 0 10px rgba(var(--dman-red-rgb),.4); }
.dman__heading-copy > small { margin-bottom: 4px; display: block; color: #b7a8ff; font-size: 8px; font-weight: 950; letter-spacing: 1.4px; direction: ltr; text-align: right; }
.dman__heading h2 { margin: 0; color: #fff; font-size: clamp(21px,2vw,29px); font-weight: 950; line-height: 1.4; letter-spacing: -.6px; }
.dman__heading p { margin: 3px 0 0; color: #99a5b7; font-size: clamp(10px,.9vw,12px); font-weight: 650; line-height: 1.7; }

.dman__mark { position: relative; width: 64px; height: 64px; flex: 0 0 64px; display: block; filter: drop-shadow(0 9px 18px rgba(118,82,255,.2)); transform: translateZ(0); animation: dmanMarkFloat 3.2s cubic-bezier(.45,.05,.45,.95) infinite paused; }
.dman.is-inview .dman__mark { animation-play-state: running; }
.dman__mark::before { content: ""; position: absolute; inset: 4px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; background: radial-gradient(circle at 77% 15%,rgba(155,124,255,.27),transparent 40%),linear-gradient(145deg,#172945,#081221 72%); box-shadow: inset 0 1px rgba(255,255,255,.13),0 9px 22px rgba(0,0,0,.25); transform: rotate(5deg); }
.dman__mark-sheet { position: absolute; display: block; border: 1px solid rgba(255,255,255,.2); border-radius: 11px; }
.dman__mark-sheet--back { z-index: 1; top: 18px; right: 13px; width: 34px; height: 33px; background: linear-gradient(145deg,#8870f2,#563cb7); box-shadow: 0 5px 12px rgba(95,64,190,.24); transform: rotate(-10deg) translate3d(0,0,0); animation: dmanSheetWiggle 3.2s ease-in-out infinite paused; }
.dman.is-inview .dman__mark-sheet--back { animation-play-state: running; }
.dman__mark-sheet--front { z-index: 2; top: 14px; right: 17px; width: 35px; height: 36px; overflow: hidden; background: linear-gradient(150deg,#ff7184,#d92c58); box-shadow: inset 0 1px rgba(255,255,255,.23),0 7px 14px rgba(var(--dman-red-rgb),.24); transform: translateZ(0); }
.dman__mark-sheet--front::before { content: ""; position: absolute; top: -8px; left: -6px; width: 23px; height: 23px; border-radius: 50%; background: rgba(255,196,93,.88); opacity: .9; }
.dman__mark-sheet--front b { position: absolute; z-index: 2; top: 14px; width: 5px; height: 6px; border-radius: 50%; background: #fff; box-shadow: 0 1px 0 #73162d; transform-origin: center; animation: dmanBlink 3.2s ease-in-out infinite paused; }
.dman.is-inview .dman__mark-sheet--front b { animation-play-state: running; }
.dman__mark-sheet--front b:nth-child(1) { right: 8px; }
.dman__mark-sheet--front b:nth-child(2) { left: 8px; }
.dman__mark-sheet--front em { position: absolute; right: 11px; bottom: 7px; width: 12px; height: 6px; border-bottom: 2px solid #fff; border-radius: 0 0 12px 12px; }
.dman__mark-dot { position: absolute; z-index: 4; top: 8px; left: 6px; width: 9px; height: 9px; border: 2px solid #091322; border-radius: 50%; background: var(--dman-aqua); box-shadow: 0 0 0 3px rgba(67,216,196,.12),0 0 12px rgba(67,216,196,.7); animation: dmanDotBounce 1.6s ease-in-out infinite paused; }
.dman.is-inview .dman__mark-dot { animation-play-state: running; }

.dman__tools { flex: 0 0 auto; display: flex; align-items: center; gap: 9px; }
.dman__all { height: 44px; padding: 0 14px; display: inline-flex; align-items: center; gap: 8px; color: #c8cddd; border: 1px solid rgba(255,255,255,.08); border-radius: 15px; background: rgba(4,9,18,.45); font-size: 11px; font-weight: 850; transition: color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease; }
.dman__all svg { width: 16px; }
.dman__nav { height: 44px; padding: 3px; display: flex; align-items: center; gap: 3px; border: 1px solid rgba(255,255,255,.08); border-radius: 15px; background: rgba(3,8,17,.48); box-shadow: inset 0 1px rgba(255,255,255,.04); direction: rtl; }
.dman__nav button { width: 36px; height: 36px; padding: 0; display: grid; place-items: center; color: #aab4c4; border: 1px solid transparent; border-radius: 12px; outline: 0; background: transparent; cursor: pointer; transition: transform .18s cubic-bezier(.2,.82,.24,1),color .18s ease,border-color .18s ease,background .18s ease; }
.dman__nav button svg { width: 18px; height: 18px; }
.dman__nav button:disabled { opacity: .25; cursor: default; }
.dman__nav button:focus-visible,.dman__all:focus-visible,.dman__card:focus-visible { outline: 2px solid #b7a7ff; outline-offset: 2px; }

.dman__rail { display: flex; align-items: stretch; gap: var(--dman-gap); padding: 3px 2px 12px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; scrollbar-width: none; overscroll-behavior-inline: contain; touch-action: pan-x pan-y; cursor: grab; }
.dman__rail::-webkit-scrollbar { display: none; }
.dman__rail.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.dman__item { --item-w: calc((100% - (var(--dman-gap) * (var(--dman-view) - 1)))/var(--dman-view)); --tone: var(--dman-red); --tone-rgb: 255,93,115; flex: 0 0 max(176px,var(--item-w)); width: max(176px,var(--item-w)); min-width: 0; scroll-snap-align: start; contain: layout paint style; }
.dman__item:nth-child(5n+2) { --tone: #9b7cff; --tone-rgb: 155,124,255; }
.dman__item:nth-child(5n+3) { --tone: #43d8c4; --tone-rgb: 67,216,196; }
.dman__item:nth-child(5n+4) { --tone: #ffc45d; --tone-rgb: 255,196,93; }
.dman__item:nth-child(5n+5) { --tone: #55b8ff; --tone-rgb: 85,184,255; }
.dman__archive-item { display: none; }
.dman__card { position: relative; width: 100%; aspect-ratio: .72; min-height: 330px; display: block; overflow: hidden; border: 1px solid rgba(255,255,255,.095); border-radius: 25px; background: #091221; box-shadow: 0 14px 31px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.055); isolation: isolate; transform: translateZ(0); transition: transform .25s cubic-bezier(.2,.82,.24,1),border-color .22s ease,box-shadow .25s ease; }
.dman__card::after { content: ""; position: absolute; z-index: 8; inset: 0; border: 1px solid transparent; border-radius: inherit; background: linear-gradient(145deg,rgba(255,255,255,.13),transparent 22%,transparent 70%,rgba(var(--tone-rgb),.28)) border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.dman__poster { position: absolute; inset: 0; display: block; overflow: hidden; }
.dman__image { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 23%; background: linear-gradient(145deg,#1b2c46,#0a111f 58%,#3c1634); transform: translateZ(0) scale(1.002); transition: transform .48s cubic-bezier(.2,.82,.24,1),filter .3s ease; }
.dman__image--empty::after { content: "DM"; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.08); font: 950 50px/1 Arial,sans-serif; }
.dman__veil { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(4,8,16,.06) 0%,rgba(4,9,18,.08) 34%,rgba(5,11,22,.72) 67%,#060d1a 100%),linear-gradient(90deg,rgba(var(--tone-rgb),.07),transparent 58%); pointer-events: none; }
.dman__topline { position: absolute; z-index: 4; top: 11px; right: 11px; left: 11px; display: flex; align-items: center; justify-content: space-between; gap: 8px; pointer-events: none; }
.dman__topline small,.dman__topline b { min-height: 27px; padding: 4px 8px; display: inline-flex; align-items: center; gap: 5px; color: #fff; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; background: rgba(5,11,22,.78); box-shadow: inset 0 1px rgba(255,255,255,.05); font-size: 8.5px; font-weight: 900; white-space: nowrap; }
.dman__topline small { color: var(--tone); border-color: rgba(var(--tone-rgb),.28); background: rgba(5,11,22,.82); }
.dman__topline b { direction: ltr; }
.dman__topline b svg { width: 12px; color: #ffd66b; fill: currentColor; stroke: none; }
.dman__bubbles { position: absolute; z-index: 3; top: 48px; left: 12px; width: 36px; height: 54px; opacity: .82; pointer-events: none; }
.dman__bubbles i { position: absolute; display: block; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: rgba(var(--tone-rgb),.21); box-shadow: inset 0 1px rgba(255,255,255,.18); transition: transform .3s cubic-bezier(.2,.82,.24,1),opacity .2s ease; }
.dman__bubbles i:nth-child(1) { top: 0; left: 2px; width: 13px; height: 13px; }
.dman__bubbles i:nth-child(2) { top: 19px; left: 17px; width: 9px; height: 9px; }
.dman__bubbles i:nth-child(3) { top: 34px; left: 1px; width: 6px; height: 6px; }
.dman__content { position: absolute; z-index: 5; right: 14px; bottom: 14px; left: 14px; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.dman__content > small { margin-bottom: 4px; color: var(--tone); font-size: 9px; font-weight: 900; }
.dman__content > strong { width: 100%; min-height: 45px; display: -webkit-box; overflow: hidden; color: #fff; font-size: 16px; font-weight: 950; line-height: 1.55; letter-spacing: -.3px; text-shadow: 0 2px 8px rgba(0,0,0,.7); -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.dman__watch { min-height: 37px; margin-top: 9px; padding: 0 11px; display: inline-flex; align-items: center; gap: 7px; color: #fff; border: 1px solid rgba(var(--tone-rgb),.28); border-radius: 12px; background: linear-gradient(135deg,rgba(var(--tone-rgb),.25),rgba(var(--tone-rgb),.1)); box-shadow: inset 0 1px rgba(255,255,255,.08); font-size: 10px; font-weight: 900; transition: transform .2s ease,background .2s ease,border-color .2s ease; }
.dman__watch svg { width: 14px; }

@media (hover:hover) and (pointer:fine) {
    .dman__all:hover,.dman__nav button:hover:not(:disabled) { color: #fff; border-color: rgba(155,124,255,.34); background: rgba(155,124,255,.09); transform: translateY(-1px); }
    .dman__nav button:active:not(:disabled) { transform: scale(.94); }
    .dman__card:hover { border-color: rgba(var(--tone-rgb),.42); box-shadow: 0 20px 42px rgba(0,0,0,.34),0 0 24px rgba(var(--tone-rgb),.08); transform: translateY(-5px); }
    .dman__card:hover .dman__image { transform: scale(1.055); filter: saturate(1.05); }
    .dman__card:hover .dman__bubbles i:nth-child(1) { transform: translate3d(2px,-6px,0); }
    .dman__card:hover .dman__bubbles i:nth-child(2) { transform: translate3d(-2px,-4px,0); }
    .dman__card:hover .dman__bubbles i:nth-child(3) { transform: translate3d(1px,-3px,0); }
    .dman__card:hover .dman__watch { border-color: rgba(var(--tone-rgb),.48); background: rgba(var(--tone-rgb),.24); transform: translateX(-2px); }
}

@keyframes dmanMarkFloat { 0%,100% { transform: translate3d(0,0,0) rotate(0); } 48% { transform: translate3d(0,-4px,0) rotate(-2deg); } }
@keyframes dmanSheetWiggle { 0%,100% { transform: rotate(-10deg) translate3d(0,0,0); } 50% { transform: rotate(-14deg) translate3d(2px,-2px,0); } }
@keyframes dmanBlink { 0%,42%,48%,100% { transform: scaleY(1); } 45% { transform: scaleY(.12); } }
@keyframes dmanDotBounce { 0%,100% { transform: translate3d(0,0,0) scale(.9); } 50% { transform: translate3d(0,-4px,0) scale(1); } }

@media (max-width:767px) {
    .dman { --dman-width: min(calc(var(--dmui-page-width,100vw) - 18px),430px); --dman-gap: 9px; margin-block: 27px; }
    .dman::before { top: 8px; left: 3px; width: 92px; height: 58px; opacity: .1; }
    .dman__header { min-height: 67px; margin-bottom: 13px; gap: 10px; }
    .dman__heading { gap: 8px; }
    .dman__mark { width: 54px; height: 54px; flex-basis: 54px; }
    .dman__mark-sheet--back { top: 16px; right: 11px; width: 29px; height: 28px; }
    .dman__mark-sheet--front { top: 12px; right: 14px; width: 30px; height: 31px; }
    .dman__mark-sheet--front b { top: 12px; width: 4px; height: 5px; }
    .dman__mark-sheet--front b:nth-child(1) { right: 7px; }
    .dman__mark-sheet--front b:nth-child(2) { left: 7px; }
    .dman__mark-sheet--front em { right: 9px; bottom: 6px; width: 10px; }
    .dman__mark-dot { top: 6px; left: 4px; width: 8px; height: 8px; }
    .dman__heading-copy > small { font-size: 6.8px; letter-spacing: 1px; }
    .dman__heading h2 { font-size: 18px; line-height: 1.35; }
    .dman__heading p { max-width: 185px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
    .dman__all { display: none; }
    .dman__nav { height: 40px; }
    .dman__nav button { width: 32px; height: 32px; }
    .dman__nav button svg { width: 16px; }
    .dman__item { flex-basis: max(154px,var(--item-w)); width: max(154px,var(--item-w)); }
    .dman__archive-item { display: block; }
    .dman__archive-card { position: relative; width: 100%; aspect-ratio: .72; min-height: 260px; padding: 18px 13px 15px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; overflow: hidden; border: 1px solid rgba(155,124,255,.28); border-radius: 21px; color: #fff; background: radial-gradient(circle at 50% 18%,rgba(155,124,255,.25),transparent 42%),linear-gradient(155deg,#152642,#07101f 72%); box-shadow: inset 0 1px rgba(255,255,255,.08),0 14px 30px rgba(0,0,0,.24); text-align: center; }
    .dman__archive-card::before { content: ""; position: absolute; inset: 0; opacity: .15; background-image: radial-gradient(circle,rgba(255,255,255,.9) 1px,transparent 1.35px); background-size: 15px 15px; mask-image: linear-gradient(180deg,#000,transparent 58%); pointer-events: none; }
    .dman__archive-card::after { content: ""; position: absolute; right: 15%; bottom: 0; left: 15%; height: 2px; border-radius: 99px; background: linear-gradient(90deg,transparent,#9b7cff,#ff5d73,transparent); box-shadow: 0 0 12px rgba(155,124,255,.6); }
    .dman__archive-art { position: relative; z-index: 1; width: 100px; height: 104px; display: block; }
    .dman__archive-art > i { position: absolute; display: block; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; box-shadow: inset 0 1px rgba(255,255,255,.24); }
    .dman__archive-art > i:nth-child(1) { top: 7px; right: 5px; width: 24px; height: 24px; background: #43d8c4; }
    .dman__archive-art > i:nth-child(2) { top: 27px; left: 0; width: 17px; height: 17px; background: #ffc45d; }
    .dman__archive-art > i:nth-child(3) { right: 15px; bottom: 3px; width: 12px; height: 12px; background: #ff5d73; }
    .dman__archive-art > b { position: absolute; top: 21px; right: 17px; width: 66px; height: 66px; display: block; border: 1px solid rgba(255,255,255,.2); border-radius: 22px; background: linear-gradient(145deg,#9b7cff,#5f45c5); box-shadow: inset 0 1px rgba(255,255,255,.25),0 12px 24px rgba(67,42,154,.32); transform: rotate(5deg); }
    .dman__archive-art > b em { position: absolute; top: 24px; width: 8px; height: 10px; border-radius: 50%; background: #fff; }
    .dman__archive-art > b em:nth-child(1) { right: 16px; }
    .dman__archive-art > b em:nth-child(2) { left: 16px; }
    .dman__archive-art > b small { position: absolute; right: 21px; bottom: 13px; width: 23px; height: 10px; border-bottom: 3px solid #fff; border-radius: 0 0 18px 18px; }
    .dman__archive-copy { position: relative; z-index: 1; width: 100%; display: flex; flex-direction: column; align-items: center; }
    .dman__archive-copy > small { margin-bottom: 4px; color: #afa3ed; font-size: 8px; font-weight: 800; }
    .dman__archive-copy > strong { color: #fff; font-size: 14px; font-weight: 950; line-height: 1.5; }
    .dman__archive-copy > span { min-height: 35px; margin-top: 11px; padding: 0 11px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(255,255,255,.13); border-radius: 12px; background: rgba(255,255,255,.055); font-size: 9px; font-weight: 900; }
    .dman__archive-copy svg { width: 14px; }
    .dman__card { min-height: 260px; border-radius: 21px; }
    .dman__topline { top: 9px; right: 9px; left: 9px; }
    .dman__topline small,.dman__topline b { min-height: 24px; padding-inline: 7px; font-size: 7.5px; }
    .dman__content { right: 11px; bottom: 11px; left: 11px; }
    .dman__content > strong { min-height: 40px; font-size: 13.5px; }
    .dman__watch { min-height: 34px; margin-top: 7px; padding-inline: 9px; font-size: 9px; }
    .dman__bubbles { top: 42px; left: 8px; transform: scale(.86); transform-origin: top left; }
}

html.dmui-low-power .dman__card,
html.dmui-low-power .dman__image,
html.dmui-low-power .dman__bubbles i,
html.dmui-low-power .dman__watch { transition-duration: .01ms !important; }
html.dmui-low-power .dman__mark { animation-duration: 5s; }
html.dmui-low-power .dman__mark-sheet--back,
html.dmui-low-power .dman__mark-sheet--front b,
html.dmui-low-power .dman__mark-dot { animation-duration: 4.8s; }

@media (prefers-reduced-motion:reduce) {
    .dman *, .dman *::before, .dman *::after { animation: none !important; transition-duration: .01ms !important; }
}
