.elementor-widget-viral_video_carousel{position:relative;z-index:9991;overflow:visible;}

.viral-vc{
  --viral-accent:#00ffe1;
  --viral-accent-dark:#006f65;
  --center-width:430px;
  --frame:10px;
  --radius:28px;
  --side-scale:78;
  --side-angle:18deg;
  --glow-size:28px;
  --glow-strength:.58;
  position:relative;
  width:100%;
  min-height:calc(var(--center-width) * 16 / 9 + 110px);
  display:flex;
  align-items:center;
  justify-content:center;
  isolation:isolate;
  overflow:visible;
  padding:48px 58px;
}

.viral-vc__viewport{
  position:relative;
  width:min(100%, calc(var(--center-width) * 2.65));
  min-height:calc(var(--center-width) * 16 / 9 + 70px);
  perspective:1400px;
  overflow:visible;
  touch-action:pan-y;
}

.viral-vc__stage{position:absolute;inset:0;overflow:visible;}

.viral-vc__card{
  position:absolute;
  top:50%;left:50%;
  width:var(--center-width);
  aspect-ratio:9/16;
  transform-origin:center center;
  transition:transform .5s cubic-bezier(.2,.75,.2,1),opacity .4s ease,filter .4s ease;
  opacity:0;pointer-events:none;z-index:0;
  will-change:transform,opacity;
}
.viral-vc__card.is-center{transform:translate(-50%,-50%) scale(1) rotateY(0deg);opacity:1;pointer-events:auto;z-index:5;filter:none;}
.viral-vc__card.is-left{transform:translate(-132%,-50%) scale(calc(var(--side-scale)/100)) rotateY(var(--side-angle));opacity:.78;pointer-events:auto;z-index:3;filter:brightness(.72) saturate(.82);}
.viral-vc__card.is-right{transform:translate(32%,-50%) scale(calc(var(--side-scale)/100)) rotateY(calc(var(--side-angle) * -1));opacity:.78;pointer-events:auto;z-index:3;filter:brightness(.72) saturate(.82);}

.viral-vc__frame{
  position:absolute;inset:0;
  padding:var(--frame);
  border-radius:calc(var(--radius) + var(--frame));
  background:linear-gradient(135deg,var(--viral-accent) 0%,#0bcdbb 18%,var(--viral-accent-dark) 48%,#003d37 68%,var(--viral-accent) 100%);
  box-shadow:
    0 0 calc(var(--glow-size) * .8) rgba(0,255,225,calc(var(--glow-strength) * .55)),
    0 0 calc(var(--glow-size) * 2.1) rgba(0,255,225,calc(var(--glow-strength) * .22));
}
.viral-vc__frame::before{
  content:"";position:absolute;
  inset:calc(var(--glow-size) * -.42);
  border-radius:calc(var(--radius) + var(--frame) + var(--glow-size));
  background:radial-gradient(ellipse at center,rgba(0,255,225,calc(var(--glow-strength) * .42)) 0%,rgba(0,111,101,calc(var(--glow-strength) * .20)) 45%,rgba(0,255,225,0) 74%);
  filter:blur(calc(var(--glow-size) * .48));
  opacity:1;z-index:-1;pointer-events:none;
}

.viral-vc__screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:var(--radius);background:#000;}
.viral-vc__video{width:100%;height:100%;display:block;object-fit:cover;background:#000;}

.viral-vc__card:not(.is-center) .viral-vc__play,
.viral-vc__card:not(.is-center) .viral-vc__controls{display:none;}

.viral-vc__play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:82px;height:82px;border-radius:50%;
  border:1px solid rgba(255,255,255,.18) !important;
  background:var(--viral-accent) !important;
  color:#00110f !important;
  box-shadow:0 0 34px rgba(0,255,225,.34);
  cursor:pointer;z-index:5;transition:opacity .2s ease,transform .2s ease,box-shadow .2s ease;
  appearance:none;-webkit-appearance:none;
}
.viral-vc__play:hover{transform:translate(-50%,-50%) scale(1.06);box-shadow:0 0 46px rgba(0,255,225,.48);}
.viral-vc__play span{position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);width:0;height:0;border-top:12px solid transparent;border-bottom:12px solid transparent;border-left:20px solid #00110f;}
.viral-vc__card.is-playing .viral-vc__play{opacity:0;pointer-events:none;}

.viral-vc__controls{
  position:absolute;left:50%;bottom:18px;transform:translateX(-50%);
  display:flex;gap:10px;z-index:8;
  padding:7px;border-radius:999px;background:rgba(0,0,0,.46);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(0,255,225,.18);
}
.viral-vc__control{
  width:42px;height:42px;border-radius:50%;
  border:1px solid rgba(255,255,255,.14) !important;
  background:var(--viral-accent) !important;
  color:#00110f !important;
  display:grid;place-items:center;cursor:pointer;
  box-shadow:0 0 18px rgba(0,255,225,.22);
  padding:0 !important;min-width:0 !important;
  appearance:none;-webkit-appearance:none;
}
.viral-vc__control:hover{filter:brightness(1.06);box-shadow:0 0 28px rgba(0,255,225,.36);}
.viral-vc__control-icon{position:relative;display:block;width:20px;height:20px;color:#000 !important;}
.viral-vc__icon-play::before{content:"";position:absolute;left:6px;top:3px;width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid #000;}
.viral-vc__icon-play.is-pause::before{left:5px;top:3px;width:4px;height:14px;border:0;background:#000;box-shadow:7px 0 0 #000;}
.viral-vc__icon-volume{overflow:hidden;}
.viral-vc__icon-volume::before{
  content:"";position:absolute;left:1px;top:3px;width:14px;height:14px;background:#000;
  clip-path:polygon(0 35%,35% 35%,86% 0,86% 100%,35% 65%,0 65%);
}
.viral-vc__icon-volume::after{
  content:"";position:absolute;right:0;top:4px;width:6px;height:12px;
  border-right:2px solid #000;border-radius:0 10px 10px 0;
}
.viral-vc__icon-volume.is-muted::after{
  right:1px;top:9px;width:18px;height:2px;border:0;border-radius:2px;
  background:#000;transform:rotate(-45deg);transform-origin:center;
}


.viral-vc__arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;
  border:1px solid rgba(255,255,255,.16) !important;
  background:var(--viral-accent) !important;
  color:#00110f !important;
  font-size:29px;line-height:1;cursor:pointer;z-index:20;
  box-shadow:0 0 28px rgba(0,255,225,.28);
  transition:.2s ease;appearance:none;-webkit-appearance:none;
  padding:0 !important;min-width:0 !important;
}
.viral-vc__arrow:hover{transform:translateY(-50%) scale(1.06);box-shadow:0 0 38px rgba(0,255,225,.42);}
.viral-vc__arrow--prev{left:4px;}.viral-vc__arrow--next{right:4px;}

.viral-vc__empty{min-height:320px;border:1px dashed rgba(0,255,225,.4);border-radius:24px;display:flex;align-items:center;justify-content:center;color:#fff;background:#050707;padding:30px;text-align:center;}

@media(max-width:767px){
  .viral-vc{--center-width:min(68vw,360px);min-height:calc(var(--center-width) * 16 / 9 + 72px);padding:28px 0;overflow:visible;}
  .viral-vc__viewport{width:100%;min-height:calc(var(--center-width) * 16 / 9 + 54px);overflow:visible;}
  .viral-vc__card.is-left{transform:translate(-112%,-50%) scale(.66) rotateY(13deg);opacity:.58;}
  .viral-vc__card.is-right{transform:translate(12%,-50%) scale(.66) rotateY(-13deg);opacity:.58;}
  .viral-vc__arrow{display:none;}
  .viral-vc__play{width:70px;height:70px;}
  .viral-vc__controls{bottom:14px;}
  .viral-vc__control{width:40px;height:40px;}
}


/* v1.7 – egyetlen valódi videoelem az egész carouselben */
.viral-vc__screen{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:var(--radius);
  background:#000;
}

.viral-vc__poster-image,
.viral-vc__poster-fallback{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  background:#000;
  user-select:none;
  -webkit-user-drag:none;
}

.viral-vc__player{
  position:absolute;
  inset:0;
  z-index:4;
  overflow:hidden;
  border-radius:var(--radius);
  background:#000;
}

.viral-vc__video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  background:#000;
}

.viral-vc__player:not(.is-playing) .viral-vc__video{
  background:#000;
}

.viral-vc__player.is-playing .viral-vc__play{
  opacity:0;
  pointer-events:none;
}

.viral-vc.is-offscreen .viral-vc__frame::before{display:none;}

@media(max-width:767px){
  .viral-vc__frame{
    box-shadow:
      0 0 calc(var(--glow-size) * .58) rgba(0,255,225,calc(var(--glow-strength) * .42)),
      0 0 calc(var(--glow-size) * 1.35) rgba(0,255,225,calc(var(--glow-strength) * .14));
  }
  .viral-vc__frame::before{
    filter:blur(calc(var(--glow-size) * .34));
    opacity:.78;
  }
}


/* v1.10 – a középső borítókép marad látható addig, amíg a videó ténylegesen el nem indul */
.viral-vc__player{
  background:transparent;
}

.viral-vc__video{
  opacity:0;
  background:transparent;
  transition:opacity .12s linear;
}

.viral-vc__player.is-media-ready .viral-vc__video{
  opacity:1;
}

/* A screen alatti saját borítóképe így a betöltés teljes ideje alatt látszik. */
.viral-vc__player:not(.is-media-ready){
  background:transparent;
}

/* Gyenge mobil GPU-n ne legyen fade-kompozitálás: csak frame-váltás. */
@media(max-width:767px){
  .viral-vc__video{transition:none;}
}


/* v1.9 – oldalsó borítóképek subpixel/fekete csík javítása */
/*
 * Mobil böngészőknél a 3D transform + scale miatt az object-fit:cover kép
 * szélein 1–2 fizikai pixelnyi raster-seam megjelenhet. A borítót picit
 * túlhúzzuk a képernyő szélén, így a fekete háttér nem tud kivillanni.
 */
.viral-vc__poster-image{
  inset:-3px;
  width:calc(100% + 6px);
  height:calc(100% + 6px);
  max-width:none !important;
  max-height:none !important;
  object-fit:cover;
  object-position:center center;
  transform:translateZ(0) scale(1.002);
  -webkit-transform:translateZ(0) scale(1.002);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

/* Ugyanezt a biztos ráhagyást kapja az aktív videó is, hogy váltáskor se legyen seam. */
.viral-vc__video{
  inset:-2px;
  width:calc(100% + 4px);
  height:calc(100% + 4px);
  max-width:none !important;
  max-height:none !important;
  object-fit:cover;
  object-position:center center;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

/* A levágást mindig maga a lekerekített screen végzi. */
.viral-vc__screen{
  contain:paint;
  isolation:isolate;
}

@media(max-width:767px){
  .viral-vc__poster-image{
    inset:-4px;
    width:calc(100% + 8px);
    height:calc(100% + 8px);
  }
}

/* v1.11 – jobb oldali fekete raster-rés megszüntetése */
/* A keret és a belső képernyő méretezése ugyanabba a border-box modellbe kerül. */
.viral-vc__frame,
.viral-vc__screen,
.viral-vc__player,
.viral-vc__video,
.viral-vc__poster-image,
.viral-vc__poster-fallback{
  box-sizing:border-box;
}

/* A belső képernyő minimális vízszintes túlfedést kap a keret alatt.
   A frame levágja, ezért kívülről a keret mérete változatlanul szabályos marad. */
.viral-vc__screen{
  width:calc(100% + 4px);
  height:calc(100% + 2px);
  margin-left:-2px;
  margin-top:-1px;
}

/* A kép/videó a screen szélén túl ér, így 3D/subpixel rendernél sem tud fekete pixel kivillanni. */
.viral-vc__poster-image,
.viral-vc__video{
  inset:-5px !important;
  width:calc(100% + 10px) !important;
  height:calc(100% + 10px) !important;
}

@media(max-width:767px){
  /* Mobilon picit vékonyabb keret + nagyobb belső túlfedés. */
  .viral-vc{
    --frame:7px;
  }
  .viral-vc__screen{
    width:calc(100% + 6px);
    height:calc(100% + 4px);
    margin-left:-3px;
    margin-top:-2px;
  }
  .viral-vc__poster-image,
  .viral-vc__video{
    inset:-7px !important;
    width:calc(100% + 14px) !important;
    height:calc(100% + 14px) !important;
  }
}

/* =========================================================
   v1.12 – mobil média/GPU optimalizálás
   ========================================================= */

/* A borítóképet nem kényszerítjük külön GPU layerre. A kártya maga már
   transzformált réteg, ezért a belső translateZ csak felesleges memória volt. */
.viral-vc__poster-image{
  transform:none !important;
  -webkit-transform:none !important;
  backface-visibility:visible;
  -webkit-backface-visibility:visible;
  will-change:auto;
  inset:-4px !important;
  width:calc(100% + 8px) !important;
  height:calc(100% + 8px) !important;
}

@media(max-width:767px){
  /* Mobilon a brightness/saturate filter minden oldalsó bitmapet külön
     kompozit rétegre tehet. Az opacity önmagában elég a mélységhatáshoz. */
  .viral-vc__card.is-left,
  .viral-vc__card.is-right{
    filter:none !important;
  }

  /* Ennyi túlfedés már eltakarja a subpixel rést, de nem növeli túl a
     raszterizált bitmap területét. */
  .viral-vc__poster-image{
    inset:-5px !important;
    width:calc(100% + 10px) !important;
    height:calc(100% + 10px) !important;
  }

  /* A vezérlőn a backdrop blur mobilon drága, sima áttetsző háttér elég. */
  .viral-vc__controls{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
}