.elementor-3308 .elementor-element.elementor-element-6iw1dlv:not(.elementor-motion-effects-element-type-background), .elementor-3308 .elementor-element.elementor-element-6iw1dlv > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;background-image:url("https://devzone.vn/wp-content/uploads/2026/07/nha-xuong-san-xuat-devzone-cao-cap.png");}.elementor-3308 .elementor-element.elementor-element-6iw1dlv{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-3308 .elementor-element.elementor-element-6iw1dlv > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-3308 .elementor-element.elementor-element-5ffd739 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );word-spacing:var( --e-global-typography-text-word-spacing );}.elementor-3308 .elementor-element.elementor-element-db39ed2 img{width:100%;}.elementor-3308 .elementor-element.elementor-element-971c817{--display:flex;}.elementor-3308 .elementor-element.elementor-element-2c5b951{--display:flex;}.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-wrapper{--video-aspect-ratio:1.77777;}.elementor-3308 .elementor-element.elementor-element-ca5958a{--display:flex;}.elementor-3308 .elementor-element.elementor-element-ca5958a.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3308 .elementor-element.elementor-element-c84fa40{--display:flex;}.elementor-3308 .elementor-element.elementor-element-1165c34{--display:flex;}.eael-reading-progress-wrap .eael-reading-progress{height:5px !important;}.eael-reading-progress-wrap .eael-reading-progress .eael-reading-progress-fill{height:5px !important;background-color:#1fd18e;transition:width 50ms ease;}:root{--page-title-display:none;}@media(max-width:1200px) and (min-width:768px){.elementor-3308 .elementor-element.elementor-element-ca5958a{--width:1033px;}}@media(max-width:1366px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );word-spacing:var( --e-global-typography-text-word-spacing );}}@media(max-width:1024px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );word-spacing:var( --e-global-typography-text-word-spacing );}.elementor-3308 .elementor-element.elementor-element-db39ed2 > .elementor-widget-container{padding:0px 0px 0px 0px;}}@media(max-width:767px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );word-spacing:var( --e-global-typography-text-word-spacing );}.elementor-3308 .elementor-element.elementor-element-db39ed2 > .elementor-widget-container{padding:0px 0px 0px 0px;}}/* Start custom CSS for html, class: .elementor-element-4c6fcbc */.elementor-3308 .elementor-element.elementor-element-4c6fcbc{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  padding:0!important;
}

.elementor-3308 .elementor-element.elementor-element-4c6fcbc img{
  width:100%!important;
  max-width:none!important;
  display:block;
  border-radius:0!important;
}/* End custom CSS */
/* Start custom CSS for video, class: .elementor-element-6730094 *//* =================================================
   VIDEO PREMIUM – DEVZONE
   Dán trực tiếp vào Custom CSS của widget Video
================================================= */

.elementor-3308 .elementor-element.elementor-element-6730094 {
  position: relative;
  z-index: 1;
  padding: 3px;
  border-radius: 24px;
  overflow: visible;

  background: linear-gradient(
    120deg,
    #064bba,
    #54a7ff,
    #ffffff,
    #2c85ff,
    #064bba
  );
  background-size: 300% 300%;

  box-shadow:
    0 24px 65px rgba(6, 75, 186, 0.25),
    0 10px 25px rgba(0, 25, 70, 0.14);

  animation:
    videoBorderFlow 5s linear infinite,
    videoFloating 4s ease-in-out infinite;

  transition:
    transform 0.45s cubic-bezier(.2,.8,.2,1),
    box-shadow 0.45s ease;
}

/* Khung video khi hover */
.elementor-3308 .elementor-element.elementor-element-6730094:hover {
  transform: translateY(-8px) scale(1.015);

  box-shadow:
    0 38px 90px rgba(6, 75, 186, 0.34),
    0 15px 35px rgba(0, 20, 60, 0.2);
}

/* Glow xanh lan ra bên ngoài */
.elementor-3308 .elementor-element.elementor-element-6730094::before {
  content: "";
  position: absolute;
  inset: -10px;
  z-index: -2;

  border-radius: 31px;

  background: linear-gradient(
    120deg,
    rgba(6, 75, 186, 0.75),
    rgba(80, 170, 255, 0.55),
    rgba(255, 255, 255, 0.25),
    rgba(6, 75, 186, 0.75)
  );

  background-size: 300% 300%;

  filter: blur(18px);
  opacity: 0.48;

  animation:
    videoBorderFlow 5s linear infinite,
    videoGlowPulse 2.6s ease-in-out infinite;

  pointer-events: none;
}

/* Vòng sáng mảnh chạy ngoài viền */
.elementor-3308 .elementor-element.elementor-element-6730094::after {
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;

  border-radius: 30px;
  border: 1px solid rgba(77, 156, 255, 0.55);

  box-shadow:
    0 0 15px rgba(6, 75, 186, 0.3),
    inset 0 0 12px rgba(255, 255, 255, 0.18);

  animation: videoOuterRing 2.8s ease-out infinite;

  pointer-events: none;
}

/* Khung chứa nội dung video */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-widget-container {
  position: relative;
  overflow: hidden;
  border-radius: 21px;
  background: #061327;
  isolation: isolate;
}

/* Video, YouTube, Vimeo, ảnh thumbnail */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-wrapper,
.elementor-3308 .elementor-element.elementor-element-6730094 iframe,
.elementor-3308 .elementor-element.elementor-element-6730094 video,
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-image-overlay {
  display: block;
  width: 100%;
  border-radius: 21px;
  overflow: hidden;
}

/* Phủ màu cinematic lên thumbnail */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-image-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;

  background:
    radial-gradient(
      circle at center,
      transparent 15%,
      rgba(2, 17, 40, 0.08) 48%,
      rgba(2, 17, 40, 0.48) 100%
    ),
    linear-gradient(
      180deg,
      rgba(4, 20, 45, 0.03) 0%,
      rgba(4, 20, 45, 0.3) 100%
    );

  transition: background 0.45s ease;
  pointer-events: none;
}

.elementor-3308 .elementor-element.elementor-element-6730094:hover .elementor-custom-embed-image-overlay::after {
  background:
    radial-gradient(
      circle at center,
      transparent 28%,
      rgba(2, 17, 40, 0.05) 55%,
      rgba(2, 17, 40, 0.34) 100%
    );
}

/* Ánh sáng quét ngang video */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-widget-container::before {
  content: "";
  position: absolute;
  top: -100%;
  left: -55%;
  z-index: 4;

  width: 34%;
  height: 300%;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.06),
    rgba(255, 255, 255, 0.26),
    rgba(255, 255, 255, 0.06),
    transparent
  );

  transform: rotate(22deg);
  animation: videoLightSweep 5s ease-in-out infinite;
  pointer-events: none;
}

/* Ánh sáng viền trong */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-widget-container::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;

  border-radius: 21px;
  border: 1px solid rgba(255, 255, 255, 0.2);

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.3),
    inset 0 -30px 45px rgba(0, 20, 55, 0.15);

  pointer-events: none;
}

/* =========================
   NÚT PLAY
========================= */

.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play {
  width: 86px;
  height: 86px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;
  z-index: 8;

  background: linear-gradient(
    145deg,
    #1477f8,
    #064bba
  );

  border: 1px solid rgba(255, 255, 255, 0.65);

  box-shadow:
    0 15px 38px rgba(0, 0, 0, 0.4),
    0 0 0 9px rgba(255, 255, 255, 0.12),
    0 0 35px rgba(45, 142, 255, 0.65);

  animation: playButtonPulse 2s ease-in-out infinite;

  transition:
    transform 0.35s cubic-bezier(.2,.8,.2,1),
    box-shadow 0.35s ease,
    background 0.35s ease;
}

/* Vòng sóng thứ nhất quanh nút Play */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play::before {
  content: "";
  position: absolute;
  inset: -14px;

  border-radius: 50%;
  border: 2px solid rgba(90, 170, 255, 0.55);

  animation: playWave 2.2s ease-out infinite;
  pointer-events: none;
}

/* Vòng sóng thứ hai */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play::after {
  content: "";
  position: absolute;
  inset: -14px;

  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.45);

  animation: playWave 2.2s ease-out 1.1s infinite;
  pointer-events: none;
}

.elementor-3308 .elementor-element.elementor-element-6730094:hover .elementor-custom-embed-play {
  transform: translate(-50%, -50%) scale(1.14);

  background: linear-gradient(
    145deg,
    #2e91ff,
    #064bba
  );

  box-shadow:
    0 18px 45px rgba(0, 0, 0, 0.42),
    0 0 0 12px rgba(255, 255, 255, 0.13),
    0 0 55px rgba(54, 150, 255, 0.85);
}

/* Icon tam giác */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play i {
  position: relative;
  z-index: 2;

  color: #ffffff;
  font-size: 31px;
  opacity: 1;

  transform: translateX(2px);
  text-shadow: none;
  filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.25));
}

/* Nếu icon Play của Elementor là SVG */
.elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play svg {
  position: relative;
  z-index: 2;

  width: 31px;
  height: 31px;
  fill: #ffffff;

  transform: translateX(2px);
  filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.25));
}


/* =========================
   ANIMATION
========================= */

/* Viền gradient chuyển động */
@keyframes videoBorderFlow {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

/* Video nổi nhẹ liên tục */
@keyframes videoFloating {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-4px);
  }
}

/* Glow sáng tối */
@keyframes videoGlowPulse {
  0%,
  100% {
    opacity: 0.35;
    transform: scale(0.98);
  }

  50% {
    opacity: 0.7;
    transform: scale(1.02);
  }
}

/* Sóng tỏa ra toàn khung */
@keyframes videoOuterRing {
  0% {
    opacity: 0.65;
    transform: scale(0.99);
  }

  75% {
    opacity: 0;
    transform: scale(1.035);
  }

  100% {
    opacity: 0;
    transform: scale(1.035);
  }
}

/* Ánh sáng quét qua thumbnail */
@keyframes videoLightSweep {
  0% {
    left: -55%;
  }

  38% {
    left: -55%;
  }

  68% {
    left: 130%;
  }

  100% {
    left: 130%;
  }
}

/* Nút Play thở nhẹ */
@keyframes playButtonPulse {
  0%,
  100% {
    box-shadow:
      0 15px 38px rgba(0, 0, 0, 0.4),
      0 0 0 8px rgba(255, 255, 255, 0.1),
      0 0 28px rgba(45, 142, 255, 0.48);
  }

  50% {
    box-shadow:
      0 15px 38px rgba(0, 0, 0, 0.4),
      0 0 0 13px rgba(255, 255, 255, 0.13),
      0 0 48px rgba(45, 142, 255, 0.78);
  }
}

/* Sóng tròn quanh nút Play */
@keyframes playWave {
  0% {
    opacity: 0.85;
    transform: scale(0.72);
  }

  100% {
    opacity: 0;
    transform: scale(1.65);
  }
}


/* =========================
   TABLET
========================= */

@media (max-width: 1024px) {
  .elementor-3308 .elementor-element.elementor-element-6730094 {
    animation:
      videoBorderFlow 5s linear infinite,
      videoFloating 4s ease-in-out infinite;
  }
}


/* =========================
   MOBILE
========================= */

@media (max-width: 767px) {
  .elementor-3308 .elementor-element.elementor-element-6730094 {
    padding: 2px;
    border-radius: 17px;

    animation: videoBorderFlow 5s linear infinite;

    box-shadow:
      0 18px 42px rgba(6, 75, 186, 0.22),
      0 7px 16px rgba(0, 25, 70, 0.12);
  }

  .elementor-3308 .elementor-element.elementor-element-6730094::before {
    inset: -6px;
    border-radius: 22px;
    filter: blur(12px);
  }

  .elementor-3308 .elementor-element.elementor-element-6730094::after {
    inset: -5px;
    border-radius: 21px;
  }

  .elementor-3308 .elementor-element.elementor-element-6730094:hover {
    transform: translateY(-3px);
  }

  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-widget-container,
  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-wrapper,
  .elementor-3308 .elementor-element.elementor-element-6730094 iframe,
  .elementor-3308 .elementor-element.elementor-element-6730094 video,
  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-image-overlay {
    border-radius: 15px;
  }

  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-widget-container::after {
    border-radius: 15px;
  }

  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play {
    width: 64px;
    height: 64px;
  }

  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play i {
    font-size: 24px;
  }

  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play svg {
    width: 24px;
    height: 24px;
  }
}


/* Người dùng tắt hiệu ứng chuyển động */
@media (prefers-reduced-motion: reduce) {
  .elementor-3308 .elementor-element.elementor-element-6730094,
  .elementor-3308 .elementor-element.elementor-element-6730094::before,
  .elementor-3308 .elementor-element.elementor-element-6730094::after,
  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-widget-container::before,
  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play,
  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play::before,
  .elementor-3308 .elementor-element.elementor-element-6730094 .elementor-custom-embed-play::after {
    animation: none !important;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a088fae */.elementor-3308 .elementor-element.elementor-element-a088fae{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  padding:0!important;
}

.elementor-3308 .elementor-element.elementor-element-a088fae img{
  width:100%!important;
  max-width:none!important;
  display:block;
  border-radius:0!important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-998b015 */.elementor-3308 .elementor-element.elementor-element-998b015{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  padding:0!important;
}

.elementor-3308 .elementor-element.elementor-element-998b015 img{
  width:100%!important;
  max-width:none!important;
  display:block;
  border-radius:0!important;
}/* End custom CSS */