.pmswt-thumb-wrap {
position: relative;
} .pmswt-video-overlay {
position: absolute;
inset: 0;
pointer-events: none;
} .pmswt-video-overlay.has-video::before,
.pmswt-video-overlay.has-video::after {
content: "";
position: absolute;
bottom: -60%;
right: -60%;
width: 220%;
height: 220%;
border-radius: 50%;
pointer-events: none;
opacity: 0;
background:
radial-gradient(circle at 20% 20%,
rgba(255, 255, 255, 0.45),
rgba(255, 255, 255, 0.18) 22%,
rgba(15, 23, 42, 0.0) 55%);
transform-origin: 100% 100%;
}
.pmswt-video-overlay.has-video::before {
animation: pmswt-wave-corner 3.2s ease-out infinite;
}
.pmswt-video-overlay.has-video::after {
animation: pmswt-wave-corner 3.2s ease-out infinite;
animation-delay: 1.6s;
}
@keyframes pmswt-wave-corner {
0% {
transform: scale(0.28);
opacity: 0.45;
}
55% {
transform: scale(1);
opacity: 0;
}
100% {
transform: scale(1.05);
opacity: 0;
}
} .pmswt-video-overlay .video-play-btn {
position: absolute;
right: 18px;
bottom: 18px;
width: 60px;
height: 60px;
border-radius: 50%;
border: none;
cursor: pointer;
background: rgba(15, 23, 42, 0.32);
display: flex;
align-items: center;
justify-content: center;
outline: none;
padding: 0;
color: #f9fafb;
z-index: 2;
pointer-events: auto;
transition:
transform 0.22s ease-out,
background 0.22s ease-out,
box-shadow 0.22s ease-out;
box-shadow:
0 0 0 0 rgba(148, 163, 184, 0.38),
0 10px 24px rgba(15, 23, 42, 0.9);
}
.pmswt-thumb-wrap:hover .pmswt-video-overlay .video-play-btn {
background: rgba(15, 23, 42, 0.96);
transform: translateY(-1px) scale(1.03);
box-shadow:
0 0 0 1px rgba(148, 163, 184, 0.6),
0 16px 36px rgba(15, 23, 42, 0.95);
}
.pmswt-video-overlay .video-play-icon {
font-size: 26px;
margin-left: 3px;
pointer-events: none;
} .pmsyt-placeholder {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
opacity: 0;
transition: opacity 0.2s ease-out;
z-index: 1;
}
.pmsyt-placeholder.is-visible {
opacity: 1;
}
.pmsyt-placeholder.is-hidden {
opacity: 0;
pointer-events: none;
}
.pms-modal__body {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
} .pms-modal__body iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
display: block;
border: 0;
} .glass-reflect {
position: relative;
background: rgba(255, 255, 255, 0.22);
border-radius: 22px;
overflow: hidden;
backdrop-filter: blur(22px) saturate(1.35);
-webkit-backdrop-filter: blur(22px) saturate(1.35);
transform-origin: center;
transition:
transform 0.3s ease-out,
box-shadow 0.3s ease-out,
background-color 0.3s ease-out;
} .glass-reflect::before {
content: "";
position: absolute;
inset: -40%;
background: linear-gradient(
115deg,
transparent 0,
rgba(255, 255, 255, 0.35) 26%,
rgba(255, 255, 255, 0.95) 48%,
rgba(255, 255, 255, 0.45) 64%,
transparent 82%
);
transform: translateX(-130%);
opacity: 0;
pointer-events: none;
mix-blend-mode: screen;
transition:
transform 1s ease-out,
opacity 0.75s ease-out;
} .post-card:hover .glass-reflect {
background-color: rgba(255, 255, 255, 0.3);
}
.post-card:hover .glass-reflect::before {
transform: translateX(130%);
opacity: 1;
}