.at-video-list {
   position: relative;
   width: 100vw;
   max-width: none;
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - 50vw);
   padding: clamp(88px, 9vw, 150px) 0 120px;
   background: linear-gradient(180deg, #1b1b22 0%, #18181e 38%, #1d1d24 100%);
   overflow: hidden
}

.at-video-list:before {
   content: "";
   position: absolute;
   inset: -160px -10% auto auto;
   width: 720px;
   height: 720px;
   border-radius: 50%;
   background: radial-gradient(circle, rgba(176, 83, 255, .15), rgba(255, 86, 185, .05) 38%, transparent 70%);
   pointer-events: none
}

.at-video-list>* {
   position: relative;
   width: min(calc(100% - 64px), 1600px);
   margin-left: auto;
   margin-right: auto
}

.at-video-list-hero {
   padding-bottom: clamp(70px, 8vw, 120px)
}

.at-video-list-hero h1 {
   margin: 0;
   font-size: clamp(78px, 12vw, 190px);
   line-height: .78;
   letter-spacing: -.075em;
   font-weight: 900;
   background: linear-gradient(105deg, #fff 8%, #d5b4ff 48%, #ff8ecf 82%);
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent
}

.at-video-list-intro {
   max-width: 760px;
   margin: 36px 0 0;
   color: #b5b5c0;
   font-size: clamp(18px, 1.4vw, 24px);
   line-height: 1.65
}

.at-video-admin-actions {
   display: flex;
   gap: 10px;
   margin-top: 28px;
   flex-wrap: wrap
}

.at-video-section-head {
   display: flex;
   align-items: end;
   justify-content: space-between;
   gap: 30px;
   margin-bottom: 28px
}

.at-video-section-head h2 {
   margin: 0;
   font-size: clamp(42px, 4.5vw, 72px);
   letter-spacing: -.055em;
   line-height: .95
}

.at-video-section-head>span {
   color: #858590;
   font-size: 13px;
   font-weight: 800;
   letter-spacing: .12em
}

.at-video-featured {
   padding-bottom: 110px
}

.at-video-featured-card {
   display: grid;
   grid-template-columns: minmax(0, 1.5fr) minmax(360px, .8fr);
   min-height: 620px;
   border: 1px solid var(--at-line);
   border-radius: 30px;
   overflow: hidden;
   background: #202027;
   color: inherit !important;
   text-decoration: none;
   box-shadow: 0 26px 80px rgba(0, 0, 0, .24)
}

.at-video-featured-media {
   position: relative;
   min-height: 520px;
   background: #111;
   overflow: hidden
}

.at-video-featured-media:after {
   content: "";
   position: absolute;
   inset: 0;
   background: linear-gradient(90deg, transparent 60%, rgba(17, 17, 22, .18)), linear-gradient(0deg, rgba(0, 0, 0, .24), transparent 45%)
}

.at-video-featured-media img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
   transition: transform .7s cubic-bezier(.2, .7, .2, 1)
}

.at-video-featured-card:hover .at-video-featured-media img {
   transform: scale(1.025)
}

.at-video-play {
   position: absolute;
   z-index: 2;
   left: 36px;
   bottom: 34px;
   width: 82px;
   height: 82px;
   border-radius: 50%;
   display: grid;
   place-items: center;
   background: rgba(255, 255, 255, .92);
   box-shadow: 0 10px 35px rgba(0, 0, 0, .25)
}

.at-video-play svg {
   width: 30px;
   height: 30px;
   fill: #15151b;
   margin-left: 4px
}

.at-video-featured-copy {
   display: flex;
   flex-direction: column;
   justify-content: center;
   padding: clamp(42px, 5vw, 84px)
}

.at-video-meta-line {
   display: flex;
   flex-wrap: wrap;
   gap: 9px 16px;
   color: #9d9da8;
   font-size: 12px;
   font-weight: 800;
   letter-spacing: .1em;
   text-transform: uppercase
}

.at-video-meta-line span+span:before {
   content: "/";
   margin-right: 16px;
   color: #565661
}

.at-video-featured-copy h3 {
   margin: 24px 0 14px;
   font-size: clamp(48px, 4.4vw, 82px);
   line-height: .96;
   letter-spacing: -.06em;
   overflow-wrap: anywhere
}

.at-video-featured-copy strong {
   font-size: 18px;
   color: #e2caFF
}

.at-video-featured-copy p {
   margin: 24px 0 0;
   color: #aaaab6;
   line-height: 1.7;
   font-size: 17px
}

.at-video-watch {
   margin-top: 36px;
   font-size: 13px;
   font-weight: 900;
   letter-spacing: .13em;
   color: #fff
}

.at-video-watch b {
   color: #d5b4ff
}

.at-video-all {
   padding-top: 4px
}

.at-video-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 54px 24px
}

.at-video-card {
   position: relative;
   min-width: 0
}

.at-video-card-link {
   display: block;
   color: inherit !important;
   text-decoration: none
}

.at-video-card-media {
   position: relative;
   aspect-ratio: 16/9;
   overflow: hidden;
   border-radius: 18px;
   background: #101015;
   border: 1px solid rgba(255, 255, 255, .08)
}

.at-video-card-media:after {
   content: "";
   position: absolute;
   inset: 0;
   background: linear-gradient(0deg, rgba(0, 0, 0, .30), transparent 52%);
   pointer-events: none
}

.at-video-card-media img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform .5s ease, filter .5s ease
}

.at-video-card:hover img {
   transform: scale(1.035);
   filter: brightness(.92)
}

.at-video-play-small {
   left: 20px;
   bottom: 18px;
   width: 52px;
   height: 52px;
   opacity: 0;
   transform: translateY(8px);
   transition: .25s ease
}

.at-video-play-small svg {
   width: 20px;
   height: 20px
}

.at-video-card:hover .at-video-play-small {
   opacity: 1;
   transform: none
}

.at-video-type {
   position: absolute;
   z-index: 2;
   top: 16px;
   left: 16px;
   padding: 8px 11px;
   border: 1px solid rgba(255, 255, 255, .20);
   border-radius: 999px;
   background: rgba(16, 16, 21, .56);
   backdrop-filter: blur(10px);
   font-size: 10px;
   font-weight: 900;
   letter-spacing: .10em
}

.at-video-card-copy {
   padding: 18px 3px 0
}

.at-video-card-copy h3 {
   margin: 12px 0 0;
   font-size: clamp(23px, 1.7vw, 31px);
   line-height: 1.12;
   letter-spacing: -.035em
}

.at-video-card-copy p {
   margin: 12px 0 0;
   color: #92929d;
   font-size: 17px;
   line-height: 1.6
}

.at-video-check {
   position: absolute;
   z-index: 10;
   right: 14px;
   top: 14px
}

.at-video-check input {
   width: 20px;
   height: 20px
}

.at-video-empty {
   padding: 90px 30px;
   border: 1px solid var(--at-line);
   border-radius: 20px;
   text-align: center;
   color: #898995
}

.at-video-pages {
   margin-top: 70px;
   text-align: center
}

.at-video-pages .pg_wrap {
   display: inline-block
}

.at-video-bulk-form {
   display: flex;
   gap: 8px;
   margin-top: 28px;
   flex-wrap: wrap
}

@media(max-width:1100px) {
   .at-video-featured-card {
      grid-template-columns: 1fr;
      min-height: 0
   }

   .at-video-featured-media {
      min-height: 0;
      aspect-ratio: 16/9
   }

   .at-video-grid {
      grid-template-columns: repeat(2, 1fr)
   }
}

@media(max-width:700px) {
   .at-video-list {
      padding-top: 72px;
      padding-bottom: 80px
   }

   .at-video-list>* {
      width: min(calc(100% - 32px), 1600px)
   }

   .at-video-list-hero h1 {
      font-size: clamp(70px, 24vw, 112px)
   }

   .at-video-list-intro {
      font-size: 17px;
      margin-top: 26px
   }

   .at-video-featured {
      padding-bottom: 74px
   }

   .at-video-featured-card {
      border-radius: 20px
   }

   .at-video-featured-copy {
      padding: 32px 24px 36px
   }

   .at-video-featured-copy h3 {
      font-size: 42px
   }

   .at-video-play {
      width: 58px;
      height: 58px;
      left: 18px;
      bottom: 16px
   }

   .at-video-play svg {
      width: 22px;
      height: 22px
   }

   .at-video-grid {
      grid-template-columns: 1fr;
      gap: 42px
   }

   .at-video-play-small {
      opacity: 1;
      transform: none;
      width: 46px;
      height: 46px
   }

   .at-video-section-head {
      align-items: flex-end
   }

   .at-video-section-head h2 {
      font-size: 40px
   }
}

@media(prefers-reduced-motion:reduce) {

   .at-video-card-media img,
   .at-video-play-small,
   .at-video-featured-media img {
      transition: none
   }
}