body {
           background-color: black;
       }

       .common-container {
           max-width: 1380px;
           margin: 0 auto;
           width: 100%;
       }

       .press-media-container {
           /* background-color: white; */
       }

       .card-container {
           padding-bottom: 20px;
           /* border-bottom: 1px solid rgba(255, 255, 255, 0.2); */
           /* display: flex; */
           gap: 25px;
           flex-wrap: wrap;
       }

       .card {
           /* width: calc(32% - 0px); */
           background: #111;
           border-radius: 8px;
           overflow: hidden;
           box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
           display: flex;
           flex-direction: column;
           transition: transform 0.3s ease, box-shadow 0.3s ease;
           background-color: white;
       }

       /* Hover Effect */
       .card:hover {
           transform: translateY(-8px);
           box-shadow: 0 12px 24px rgba(0, 0, 0, 0.6);
       }

       .card img {
           width: 100%;
           height: auto;
           display: block;
       }

       .card-content {
           padding: 20px;


       }

      .press-media-list{

  .swiper-wrapper {
      padding-bottom: 60px;

      @media(width <= 1024px)
      {
        padding-bottom: 40px;
      }
  }

  .swiper-pagination {
      top: inherit;
      width: 55%;
      left: 0%;
      right: 0;
      bottom: 8%;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      transform: translate(0px, 0px);
      margin: auto;
      background: #ffffff;

        @media(width <= 1024px)
        {
            width: 45%;
            bottom: 12%;
        }
        @media(width <= 992px)
        {
          width: 25%;
            bottom: 7%;
        }
        @media(width <= 468px)
        {
          width: 60%;
          bottom: 12%;

        }

      .swiper-pagination-bullet {
          border-radius: 0;
          margin: 0;
          -webkit-box-flex: 1;
          -webkit-flex: 1;
          -ms-flex: 1;
          flex: 1;
          -webkit-transition: all .35s ease;
          -o-transition: all .35s ease;
          transition: all .35s ease;
          height: 3px;
          margin: 0;

      }

      .swiper-pagination-bullet-active {
          background: #bda375;
      }
  }



  .press-media-list-counter {
      position: absolute;
      bottom: -4px;
      left: 0;
      right: 0;
      text-align: center;
      margin: 0 auto;
      color: #ffffff;
      font-size: 18px;

      @media(width <= 992px)
        {
          
            bottom: 0px;
        }
  }
}

        .swiper-button-prev.press-media-list-prev {
            top: auto;
            bottom: 10px;
            left: 221px;

            svg 
            {
                width: 80px;
                height: 80px;
            }

              @media(width <= 768px)
            {
                left: 140px;
            }
            @media(width <= 468px)
            {
                left: 40px;
            }
        }

       .swiper-button-next.press-media-list-next
       {
            top: auto;
            right: 221px;
            bottom: 10px;

            svg 
            {
                width: 80px;
                height: 80px;
            }
               @media(width <= 768px)
            {
                right: 140px;
            }
             @media(width <= 468px)
            {
                right: 40px;
            }
       }

       .card-content h3 {
           font-size: 14px;
           font-weight: normal;
           margin: 0 0 15px;
           line-height: 1.2em;
           min-height: 84px;
           display: none;
       }

       .card-content a {
           text-decoration: none;
           color: #000;
           font-size: 14px;
           letter-spacing: 1.4px;
           font-family: "Noto Sans Display", sans-serif;
       }

       .card-content a:hover {
           text-decoration: underline;
           color: #000;
       }

       .press-media-container .title {
           color: #ffff;
           font-size: 45px;
           font-weight: 100;
           font-family: "Noto Sans Display", sans-serif;
       }

       .sub-title {
           width: fit-content;
           color: #fff;
           font-size: 26px;
           font-weight: 100;
           font-family: "Noto Sans Display", sans-serif;
           position: relative;
           border-bottom: 1px solid #a77b32;
       }



       .press-media-list-next img,
       .press-media-list-prev img {
           width: 15px;
       }


       @media screen and (max-width:992px) {
           .common-container {
               padding: 0 10px;
           }

           .card-container {
               line-height: 1.2em;
               gap: 10px;
               padding-bottom: 15px;
           }

           .press-media-container .title {
               font-size: 36px;
           }

           .card-content a {
               font-size: 10px;
           }

           .card-content h3 {
               font-size: 12px;
               line-height: 1.1em;
           }

           .card-content h3 {
               min-height: 93px;
           }

           .card:hover {
               transform: unset;
           }

           .sub-title {
               font-size: 20px;
           }

       }