/* ============================================================
   CODSHIPX AI R18-R12
   ACTUAL VIDEO ELEMENT CINEMATIC LOCK

   Important change:
   Do not depend only on data-codi-cinematic attribute.

   Target the real video inside the isolated cinematic entry.
   ============================================================ */

/* CODSHIPX_AI_R18_R12_BEGIN */


/* ============================================================
   STAGE
   ============================================================ */

.r7-r24-cinematic{
  position:fixed !important;

  inset:0 !important;

  width:100vw !important;

  height:100vh !important;
  height:100dvh !important;

  overflow:hidden !important;

  background:#000 !important;

  border:0 !important;
  outline:0 !important;

  isolation:isolate !important;
}


.r7-r24-codi-entry{
  position:absolute !important;

  inset:0 !important;

  width:100% !important;
  height:100% !important;

  overflow:hidden !important;

  margin:0 !important;
  padding:0 !important;

  background:#000 !important;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}


/* ============================================================
   ACTUAL RUNTIME VIDEO TARGET

   This deliberately targets ANY video inside the isolated
   cinematic entry wrapper.

   It neutralizes R10/R11 optical transform experiments and
   gives the video a predictable physical viewport size.
   ============================================================ */

.r7-r24-codi-entry video,
.r7-r24-cinematic .r7-r24-codi-entry video,
.r7-r24-cinematic video{
  position:absolute !important;

  left:50% !important;
  top:46% !important;

  right:auto !important;
  bottom:auto !important;

  display:block !important;

  /*
   * 1920px class:
   * ~1570px authored video canvas.
   *
   * 1366px class:
   * ~1120px canvas.
   *
   * This is far more predictable than transform:scale().
   */
  width:clamp(
    1080px,
    82vw,
    1600px
  ) !important;

  height:auto !important;

  min-width:0 !important;
  min-height:0 !important;

  max-width:none !important;
  max-height:none !important;

  margin:0 !important;
  padding:0 !important;

  object-fit:contain !important;
  object-position:50% 50% !important;

  transform:
    translate3d(-50%,-50%,0) !important;

  transform-origin:50% 50% !important;

  border:0 !important;
  border-radius:0 !important;
  outline:0 !important;

  background:#000 !important;

  box-shadow:none !important;

  opacity:1 !important;

  /*
   * Premium but restrained grade.
   */
  filter:
    brightness(1.055)
    contrast(1.07)
    saturate(1.06) !important;

  pointer-events:none !important;
  user-select:none !important;

  -webkit-user-drag:none !important;

  backface-visibility:hidden !important;
  will-change:transform !important;
}


/* ============================================================
   CINEMATIC BLACK INTEGRATION
   ============================================================ */

.r7-r24-cinematic::before{
  content:"" !important;

  position:absolute !important;
  inset:-2px !important;

  z-index:5 !important;

  pointer-events:none !important;

  background:

    linear-gradient(
      180deg,
      rgba(0,0,0,.17) 0%,
      rgba(0,0,0,.025) 12%,
      transparent 25%,
      transparent 73%,
      rgba(0,0,0,.055) 88%,
      rgba(0,0,0,.24) 100%
    ),

    radial-gradient(
      ellipse 88% 82% at 50% 47%,
      transparent 0%,
      transparent 59%,
      rgba(0,0,0,.025) 69%,
      rgba(0,0,0,.11) 84%,
      rgba(0,0,0,.36) 100%
    ) !important;
}


/* ============================================================
   SUBTLE AI CORE BLOOM
   CSS only.
   ============================================================ */

.r7-r24-cinematic::after{
  content:"" !important;

  position:absolute !important;
  inset:0 !important;

  z-index:4 !important;

  pointer-events:none !important;

  background:

    radial-gradient(
      circle at 50% 45%,
      rgba(128,255,58,.05) 0%,
      rgba(103,255,48,.018) 14%,
      rgba(65,255,40,.005) 29%,
      transparent 45%
    ),

    radial-gradient(
      ellipse 60% 43% at 50% 47%,
      rgba(38,73,255,.012) 0%,
      transparent 72%
    ) !important;

  opacity:.72 !important;

  mix-blend-mode:screen !important;
}


/* ============================================================
   PREMIUM POWERED-BY SAFE ZONE
   ============================================================ */

.r7-r24-codi-entry::before{
  content:"POWERED BY" !important;

  position:absolute !important;

  left:calc(50% - 8px) !important;
  bottom:28px !important;

  z-index:20 !important;

  display:block !important;

  color:rgba(184,193,203,.57) !important;

  font-family:
    Inter,
    ui-sans-serif,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif !important;

  font-size:10px !important;
  font-weight:500 !important;

  letter-spacing:.115em !important;
  line-height:1 !important;

  white-space:nowrap !important;

  transform:translateX(-100%) !important;

  pointer-events:none !important;
}


.r7-r24-codi-entry::after{
  content:"POWER LANKA" !important;

  position:absolute !important;

  left:calc(50% + 2px) !important;
  bottom:27px !important;

  z-index:20 !important;

  display:block !important;

  color:rgba(255,255,255,.95) !important;

  font-family:
    Inter,
    ui-sans-serif,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif !important;

  font-size:11px !important;
  font-weight:800 !important;

  letter-spacing:.06em !important;
  line-height:1 !important;

  white-space:nowrap !important;

  pointer-events:none !important;

  text-shadow:
    0 0 16px rgba(255,255,255,.035) !important;
}


/* ============================================================
   LARGE DESKTOP / FULL-HD+
   ============================================================ */

@media (min-width:1800px){

  .r7-r24-codi-entry video,
  .r7-r24-cinematic .r7-r24-codi-entry video,
  .r7-r24-cinematic video{
    top:46% !important;

    width:min(
      82vw,
      1600px
    ) !important;
  }

}


/* ============================================================
   LAPTOP / 1366 CLASS
   ============================================================ */

@media (min-width:901px) and (max-width:1500px){

  .r7-r24-codi-entry video,
  .r7-r24-cinematic .r7-r24-codi-entry video,
  .r7-r24-cinematic video{
    top:45.5% !important;

    width:82vw !important;

    min-width:1040px !important;
    max-width:1240px !important;
  }

}


@media (min-width:901px) and (max-height:800px){

  .r7-r24-codi-entry video,
  .r7-r24-cinematic .r7-r24-codi-entry video,
  .r7-r24-cinematic video{
    top:44.5% !important;

    width:78vw !important;

    min-width:980px !important;
    max-width:1180px !important;
  }

  .r7-r24-codi-entry::before{
    bottom:19px !important;
  }

  .r7-r24-codi-entry::after{
    bottom:18px !important;
  }

}


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

@media (max-width:900px) and (orientation:landscape){

  .r7-r24-codi-entry video,
  .r7-r24-cinematic .r7-r24-codi-entry video,
  .r7-r24-cinematic video{
    top:46% !important;

    width:92vw !important;

    min-width:0 !important;
    max-width:none !important;

    height:auto !important;
  }

}


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

@media (max-width:900px) and (orientation:portrait){

  .r7-r24-codi-entry video,
  .r7-r24-cinematic .r7-r24-codi-entry video,
  .r7-r24-cinematic video{
    top:48% !important;

    width:155vw !important;

    min-width:0 !important;
    max-width:none !important;

    height:auto !important;
  }

}


/* ============================================================
   PHONE
   ============================================================ */

@media (max-width:520px){

  .r7-r24-codi-entry video,
  .r7-r24-cinematic .r7-r24-codi-entry video,
  .r7-r24-cinematic video{
    top:47% !important;

    width:175vw !important;

    min-width:0 !important;
    max-width:none !important;

    height:auto !important;
  }

  .r7-r24-codi-entry::before{
    left:calc(50% - 6px) !important;
    bottom:17px !important;

    font-size:8px !important;
  }

  .r7-r24-codi-entry::after{
    left:calc(50% + 1px) !important;
    bottom:16px !important;

    font-size:9px !important;
  }

}


/* ============================================================
   NATIVE VIDEO UI MUST NEVER SHOW
   ============================================================ */

.r7-r24-codi-entry video::-webkit-media-controls,
.r7-r24-cinematic video::-webkit-media-controls{
  display:none !important;
}


/* CODSHIPX_AI_R18_R12_END */