.elementor-786 .elementor-element.elementor-element-8e1d1d1:not(.elementor-motion-effects-element-type-background), .elementor-786 .elementor-element.elementor-element-8e1d1d1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.gambling-montenegro.com/wp-content/uploads/2025/06/Rectangle-12-8.png");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-786 .elementor-element.elementor-element-8e1d1d1{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:120px 0px 120px 0px;}.elementor-786 .elementor-element.elementor-element-8e1d1d1 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-786 .elementor-element.elementor-element-0e95927{bottom:150px;}.elementor-786 .elementor-element.elementor-element-0e95927 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:14px;font-weight:400;color:#FFFFFF;}.elementor-786 .elementor-element.elementor-element-eed815c{text-align:center;}.elementor-786 .elementor-element.elementor-element-eed815c .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:50px;font-weight:800;color:#FFFFFF;}.elementor-786 .elementor-element.elementor-element-c8207fc{padding:80px 0px 80px 0px;}.elementor-786 .elementor-element.elementor-element-cbd639e.ha-has-bg-overlay:hover > .elementor-widget-container::before{transition:background 0.3s;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-786 .elementor-element.elementor-element-8e1d1d1{padding:60px 0px 60px 0px;}.elementor-786 .elementor-element.elementor-element-eed815c .elementor-heading-title{font-size:25px;}.elementor-786 .elementor-element.elementor-element-c8207fc{padding:60px 0px 60px 0px;}.elementor-786 .elementor-element.elementor-element-397fa9f{width:100%;}}/* Start custom CSS for html, class: .elementor-element-cbd639e */.card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
  }

  .card {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    background: linear-gradient(#ffffff 0%, #f3f6fa 100%);
    height: 320px;
    cursor: pointer;
  }

 .card::before,
.card-front::before,
.card-back::before {
  content: '';
  display: block;
  height: 4px;
  background-color: #d91f25;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}


  .card-inner {
    position: absolute;
    inset: 0;
    transition: transform 0.6s ease;
  }

  .card-front {
    position: absolute;
    inset: 0;
    padding: 20px;
    transition: opacity 0.4s ease;
    background: linear-gradient(#ffffff 0%, #f3f6fa 100%);
  }
  
  .card-back{
      position: absolute;
      inset: 0;
      padding: 20px;
      transition: opacity 0.4s ease;
      background: #ffffff;
  }

  .card-front {
    text-align: center;
  }

  .card-front img {
    width: 170px;
    margin: 30px auto 15px;
    display: block;
  }

  .card-front h3 {
    font-size: 15px;
    color: #16103e;
    margin: 0;
    font-weight: 700;
  }

  .card-back {
    transform: translateY(100%);
    transition: transform 0.5s ease;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 35px;
  }

  .card:hover .card-back,
  .card:focus-within .card-back {
    transform: translateY(0%);
  }

  .card:hover .card-front,
  .card:focus-within .card-front {
    opacity: 0;
  }

  .card-back h3 {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
    color: #16103e;
  }

  .desc-short {
    color: #16103e;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.3em;
    margin-bottom: 10px;
  }
  
  .read-toggle {
    display: none;
  }

  .read-label {
    font-size: 0.9rem;
    color: #007BFF;
    cursor: pointer;
    text-decoration: underline;
    display: inline-block;
    margin-top: 10px;
  }

  .readmore {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  font-size: 13px;
  color: #16103e;
  line-height: 1.3em;
  margin-top: 5px;
}

.read-toggle:checked ~ .readmore {
  max-height: 200px; 
  overflow-y: auto;
}


  @media (max-width: 768px) {
    .card-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media (max-width: 480px) {
    .card-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }/* End custom CSS */