@property --omw-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

.omw-wall {
  display: block;
  width: 100%;
  max-width: 100%;
  background: #fff;
  color: #171717;
  box-sizing: border-box;
  isolation: isolate;
  min-width: 0;
  --omw-columns: 4;
  --omw-columns-tablet: 3;
  --omw-columns-mobile: 2;
  --omw-gap: 22px;
  --omw-gap-tablet: 20px;
  --omw-gap-mobile: 18px;
  --omw-ratio: 4 / 5;
  --omw-neon-one: #7C3AED;
  --omw-neon-two: #E879F9;
  --omw-spin-speed: 3.6s;
  --omw-shadow-alpha: .30;
  --omw-shadow-blur: 18px;
  --omw-shadow-y: 9px;
  --omw-card-radius: 3px;
  --omw-border-width: 2.5px;
  --omw-overlay-alpha: .62;
  --omw-logo-width: 42px;
  --omw-title-size: 16px;
  --omw-subtitle-size: 12px;
  --omw-title-color: #fff;
  --omw-subtitle-color: #E8D6FF;
  --omw-badge-bg: #090909;
  --omw-badge-color: #fff;
  --omw-image-fit: cover;
  --omw-hover-scale: 1.06;
  --omw-play-button-bg: #E9D9FF;
  --omw-play-button-accent: #B58AFF;
  --omw-play-icon-color: #39245C;
  --omw-play-button-size: 64px;
}
.omw-wall *, .omw-wall *::before, .omw-wall *::after { box-sizing: border-box; }
.omw-wall .omw-grid {
  display: grid !important;
  grid-template-columns: repeat(var(--omw-columns, 4), minmax(0, 1fr)) !important;
  gap: max(var(--omw-gap, 22px), 22px);
  align-items: start;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  overflow: visible;
  margin: 0;
}
.omw-wall .omw-card {
  position: relative !important;
  z-index: 0;
  display: block !important;
  flex: none !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  aspect-ratio: var(--omw-ratio, 4 / 5) !important;
  border-radius: var(--omw-card-radius, 3px);
  background: #131313;
  color: #fff;
  text-decoration: none !important;
  outline: none;
  box-shadow: 0 var(--omw-shadow-y, 9px) var(--omw-shadow-blur, 18px) rgba(0,0,0,var(--omw-shadow-alpha, .30)), 0 2px 5px rgba(0,0,0,.10);
  transform: translateY(0) scale(1);
  transform-origin: center center;
  transition: transform .32s cubic-bezier(.2,.8,.2,1), box-shadow .32s ease, filter .32s ease;
  isolation: isolate;
  -webkit-tap-highlight-color: transparent;
  touch-action: pan-y pinch-zoom;
}
/* Soft animated aura behind the crisp neon rim. */
.omw-card::after {
  content: '';
  position: absolute;
  z-index: 2;
  inset: calc(var(--omw-border-width, 2.5px) / -1.5);
  padding: calc(var(--omw-border-width, 2.5px) + 1px);
  border-radius: calc(var(--omw-card-radius, 3px) + 2px);
  background: conic-gradient(from var(--omw-angle), transparent 0deg, var(--omw-neon-one) 72deg, var(--omw-neon-two) 132deg, transparent 205deg, transparent 248deg, var(--omw-neon-two) 300deg, var(--omw-neon-one) 330deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  filter: blur(6px) saturate(1.4);
  opacity: .92;
  pointer-events: none;
  animation: omw-neon-rotation var(--omw-spin-speed, 3.6s) linear infinite;
}
.omw-card::before {
  content: '';
  position: absolute;
  z-index: 3;
  inset: calc(var(--omw-border-width, 2.5px) / -1.5);
  padding: var(--omw-border-width, 2.5px);
  border-radius: calc(var(--omw-card-radius, 3px) + 1px);
  background: conic-gradient(from var(--omw-angle), transparent 0deg, transparent 30deg, var(--omw-neon-one, #7C3AED) 72deg, #fff 91deg, var(--omw-neon-two, #E879F9) 126deg, transparent 174deg, transparent 218deg, var(--omw-neon-two, #E879F9) 270deg, var(--omw-neon-one, #7C3AED) 318deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  opacity: .98;
  filter: drop-shadow(0 0 4px rgba(124,58,237,.78));
  filter: drop-shadow(0 0 4px color-mix(in srgb, var(--omw-neon-one, #7C3AED) 70%, transparent));
  animation: omw-neon-rotation var(--omw-spin-speed, 3.6s) linear infinite;
}
@keyframes omw-neon-rotation { to { --omw-angle: 360deg; } }
.omw-wall--no-neon .omw-card::before,
.omw-wall--no-neon .omw-card::after { display: none; }
.omw-card:focus-visible { outline: 2px solid var(--omw-neon-one, #7C3AED); outline-offset: 5px; }
.omw-hover-lift .omw-card:hover,
.omw-hover-lift .omw-card:focus-visible,
.omw-hover-lift .omw-card.omw-card--touch-active,
.omw-hover-lift-zoom .omw-card:hover,
.omw-hover-lift-zoom .omw-card:focus-visible,
.omw-hover-lift-zoom .omw-card.omw-card--touch-active {
  z-index: 6;
  transform: translateY(var(--omw-hover-lift-negative, -6px)) scale(var(--omw-hover-scale, 1.06));
  box-shadow: 0 calc(var(--omw-shadow-y, 9px) + 7px) calc(var(--omw-shadow-blur, 18px) + 13px) rgba(0,0,0,calc(var(--omw-shadow-alpha, .30) + .16)), 0 0 22px color-mix(in srgb, var(--omw-neon-one, #7C3AED) 36%, transparent), 0 0 34px color-mix(in srgb, var(--omw-neon-two, #E879F9) 24%, transparent);
  filter: saturate(1.08) contrast(1.015);
}
.omw-hover-zoom .omw-card:hover,
.omw-hover-zoom .omw-card:focus-visible,
.omw-hover-zoom .omw-card.omw-card--touch-active {
  z-index: 6;
  transform: scale(var(--omw-hover-scale, 1.06));
  box-shadow: 0 12px 28px rgba(0,0,0,calc(var(--omw-shadow-alpha, .30) + .16)), 0 0 22px color-mix(in srgb, var(--omw-neon-one, #7C3AED) 36%, transparent);
}
.omw-hover-lift-zoom .omw-card:hover .omw-card__image,
.omw-hover-lift-zoom .omw-card:focus-visible .omw-card__image,
.omw-hover-lift-zoom .omw-card.omw-card--touch-active .omw-card__image,
.omw-hover-zoom .omw-card:hover .omw-card__image,
.omw-hover-zoom .omw-card:focus-visible .omw-card__image,
.omw-hover-zoom .omw-card.omw-card--touch-active .omw-card__image { transform: scale(1.045); }
.omw-hover-none .omw-card,
.omw-hover-none .omw-card:hover,
.omw-hover-none .omw-card:focus-visible,
.omw-hover-none .omw-card.omw-card--touch-active { transform: none; transition: none; }
.omw-hover-none .omw-card:hover { box-shadow: 0 var(--omw-shadow-y, 9px) var(--omw-shadow-blur, 18px) rgba(0,0,0,var(--omw-shadow-alpha, .30)); }
.omw-wall .omw-card__ratio {
  display: block !important;
  position: relative;
  width: 100% !important;
  height: 0 !important;
  padding: 0 0 var(--omw-ratio-padding, 125%) !important;
  margin: 0 !important;
  border: 0 !important;
  pointer-events: none;
}
.omw-wall .omw-card__image-wrap {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  overflow: hidden;
  border-radius: inherit;
  background: #171717;
}
.omw-card__image {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: var(--omw-image-fit, cover);
  object-position: center;
  border: 0 !important;
  border-radius: inherit !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  transition: transform .52s cubic-bezier(.2,.75,.25,1), filter .32s ease;
}
.omw-card__logo {
  position: absolute;
  z-index: 2;
  top: var(--omw-logo-top, 5%);
  right: var(--omw-logo-right, auto);
  bottom: var(--omw-logo-bottom, auto);
  left: var(--omw-logo-left, 5%);
  width: var(--omw-logo-width, 42px);
  max-width: 24%;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 50%;
  border: 1px solid rgba(124,58,237,.82);
  border-color: color-mix(in srgb, var(--omw-neon-one, #7C3AED) 82%, transparent);
  background: rgba(13,9,25,.78);
  box-shadow: 0 0 10px rgba(124,58,237,.34), 0 0 16px rgba(232,121,249,.22);
  box-shadow: 0 0 10px color-mix(in srgb, var(--omw-neon-one, #7C3AED) 34%, transparent), 0 0 16px color-mix(in srgb, var(--omw-neon-two, #E879F9) 22%, transparent);
}
.omw-card__logo img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 2px; }
.omw-card__badge {
  position: absolute;
  z-index: 2;
  right: 5%;
  bottom: 5%;
  max-width: 54%;
  padding: 4px 6px;
  color: var(--omw-badge-color, #fff);
  background: rgba(9,9,9,.90);
  background: color-mix(in srgb, var(--omw-badge-bg, #090909) 90%, transparent);
  border: 1px solid rgba(232,121,249,.88);
  border-color: color-mix(in srgb, var(--omw-neon-two, #E879F9) 88%, transparent);
  border-radius: 4px;
  font-size: clamp(8px, .7vw, 11px);
  font-weight: 800;
  letter-spacing: .04em;
  line-height: 1.15;
  text-align: center;
  overflow-wrap: anywhere;
  box-shadow: 0 0 10px rgba(232,121,249,.25);
  box-shadow: 0 0 10px color-mix(in srgb, var(--omw-neon-two, #E879F9) 25%, transparent);
}
.omw-card__overlay {
  position: absolute;
  z-index: 1;
  inset: auto 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 20% 7% 9%;
  text-align: center;
  background: linear-gradient(0deg, rgba(0,0,0,var(--omw-overlay-alpha, .62)) 0%, rgba(0,0,0,calc(var(--omw-overlay-alpha, .62) * .52)) 55%, transparent 100%);
  pointer-events: none;
}
.omw-overlay--center .omw-card__overlay {
  inset: 0;
  justify-content: center;
  padding: 12% 7%;
  background: rgba(0,0,0,calc(var(--omw-overlay-alpha, .62) * .88));
}
.omw-card__title {
  display: block;
  width: 100%;
  color: var(--omw-title-color, #fff);
  font-size: var(--omw-title-size, 16px);
  line-height: 1.24;
  font-weight: 800;
  text-wrap: balance;
  overflow-wrap: anywhere;
  text-shadow: 0 2px 5px rgba(0,0,0,.9);
}
.omw-card__subtitle {
  display: block;
  color: var(--omw-subtitle-color, #E8D6FF);
  width: 100%;
  font-size: var(--omw-subtitle-size, 12px);
  line-height: 1.3;
  font-weight: 700;
  overflow-wrap: anywhere;
  text-shadow: 0 1px 4px rgba(0,0,0,.9);
}
/* Centre play button stays visible in public view and Elementor preview on every device. */
.omw-card__play {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 50%;
  width: var(--omw-play-button-size, 64px);
  height: var(--omw-play-button-size, 64px);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--omw-play-icon-color, #39245C);
  background: linear-gradient(145deg, #F7F1FF, #B58AFF);
  background: linear-gradient(145deg, color-mix(in srgb, var(--omw-play-button-bg, #E9D9FF) 92%, #fff), var(--omw-play-button-accent, #B58AFF));
  border: 1.5px solid rgba(255,255,255,.9);
  box-shadow: 0 0 0 5px rgba(236,220,255,.16), 0 7px 20px rgba(12,4,29,.32), 0 0 20px rgba(181,138,255,.52), 0 0 28px rgba(232,121,249,.38);
  box-shadow: 0 0 0 5px rgba(236,220,255,.16), 0 7px 20px rgba(12,4,29,.32), 0 0 20px color-mix(in srgb, var(--omw-play-button-accent, #B58AFF) 72%, transparent), 0 0 28px color-mix(in srgb, var(--omw-neon-two, #E879F9) 42%, transparent);
  opacity: .96;
  visibility: visible;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.94);
  transition: opacity .24s ease, visibility .24s ease, transform .34s cubic-bezier(.2,.8,.2,1), box-shadow .24s ease;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.omw-card__play::before {
  content: '';
  position: absolute;
  inset: -7px;
  border: 1px solid rgba(233,217,255,.78);
  border-color: color-mix(in srgb, var(--omw-play-button-bg, #E9D9FF) 78%, transparent);
  border-radius: 50%;
  opacity: .78;
  animation: omw-play-pulse 2.4s ease-out infinite;
}
.omw-card__play-icon {
  position: relative;
  display: block;
  width: 34%;
  height: 34%;
  margin-left: 4%;
  fill: currentColor;
  filter: drop-shadow(0 1px 1px rgba(255,255,255,.35));
}
@keyframes omw-play-pulse {
  0% { transform: scale(.9); opacity: .7; }
  75%, 100% { transform: scale(1.28); opacity: 0; }
}
.omw-card:hover .omw-card__play,
.omw-card:focus-visible .omw-card__play,
.omw-card.omw-card--touch-active .omw-card__play,
.omw-card:active .omw-card__play {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1.08);
}
.omw-card:hover .omw-card__play { box-shadow: 0 0 0 6px rgba(236,220,255,.19), 0 9px 24px rgba(12,4,29,.36), 0 0 26px color-mix(in srgb, var(--omw-play-button-accent, #B58AFF) 82%, transparent), 0 0 36px color-mix(in srgb, var(--omw-neon-two, #E879F9) 52%, transparent); }
.omw-card__type {
  position: absolute;
  z-index: 2;
  top: 5%;
  right: 5%;
  padding: 4px 7px;
  color: rgba(255,255,255,.94);
  background: rgba(12,8,21,.64);
  border: 1px solid color-mix(in srgb, var(--omw-neon-one, #7C3AED) 58%, rgba(255,255,255,.2));
  border-radius: 20px;
  font-size: 9px;
  line-height: 1.2;
  letter-spacing: .04em;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity .2s ease;
  pointer-events: none;
}
.omw-card:hover .omw-card__type,
.omw-card:focus-visible .omw-card__type,
.omw-card.omw-card--touch-active .omw-card__type { opacity: 1; }
.omw-type--always .omw-card__type { opacity: 1; }
.omw-empty {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 28px 22px;
  border: 1px dashed #c9cdd2;
  border-radius: 10px;
  background: #fff;
  color: #4b5563;
  text-align: center;
  line-height: 1.6;
}
.omw-empty strong { color: #171717; }
@media (max-width: 1024px) {
  .omw-wall .omw-grid { grid-template-columns: repeat(var(--omw-columns-tablet, 3), minmax(0, 1fr)) !important; gap: max(var(--omw-gap-tablet, 20px), 20px); }
  .omw-card__title { font-size: clamp(10px, 1.4vw, var(--omw-title-size, 16px)); }
  .omw-card__subtitle { font-size: clamp(9px, 1.1vw, var(--omw-subtitle-size, 12px)); }
  .omw-card__play { width: min(var(--omw-play-button-size, 64px), 23%); height: auto; aspect-ratio: 1; }
}
@media (max-width: 767px) {
  .omw-wall .omw-grid { grid-template-columns: repeat(var(--omw-columns-mobile, 2), minmax(0, 1fr)) !important; gap: max(var(--omw-gap-mobile, 18px), 18px); }
  .omw-wall .omw-card { box-shadow: 0 6px 12px rgba(0,0,0,var(--omw-shadow-alpha, .30)), 0 1px 4px rgba(0,0,0,.10); }
  .omw-card__title { font-size: clamp(10px, 3.2vw, var(--omw-title-size, 16px)); }
  .omw-card__subtitle { font-size: clamp(8px, 2.5vw, var(--omw-subtitle-size, 12px)); }
  .omw-card__badge { font-size: 8px; }
  .omw-card__play { width: clamp(34px, 28%, 52px); height: auto; aspect-ratio: 1; }
  .omw-card.omw-card--touch-active { z-index: 8; transform: translateY(-3px) scale(min(var(--omw-hover-scale, 1.06), 1.045)); }
  .omw-empty { padding: 20px 14px; font-size: 13px; }
}
@media (max-width: 360px) {
  .omw-card__logo { width: 30px; }
  .omw-card__badge { right: 4%; bottom: 4%; max-width: 62%; padding: 2px 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .omw-card, .omw-card::before, .omw-card::after, .omw-card__image, .omw-card__type, .omw-card__play, .omw-card__play::before { animation: none !important; transition: none !important; }
  .omw-card::before { background: linear-gradient(135deg, var(--omw-neon-one), var(--omw-neon-two)); }
  .omw-card__play::before { display: none; }
}
