/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */


/* for scroling card at the bottom - Start */
/* === Active Ads horizontal rail === */

.panel {
    /*margin:1rem auto;*/
    /*background:#fff;*/
    /*border-radius:14px;*/
    box-shadow:0 6px 16px rgba(0,0,0,.06);
    /*padding:1.25rem;*/
}
.card {
  background-color: white;
  border-radius: 12px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.06);
  overflow: hidden;
  position: relative;
  animation: fadeInUp 0.6s ease both;
  min-height: 400px; /* Minimum height for all cards */
  display: flex;
  flex-direction: column;
  border: 1px solid #555;
}


.ad-rail-wrap {
    position:relative;
}
@media (max-width:420px) {
    .ad-rail-wrap::before,
    .ad-rail-wrap::after {
        content: "";
        position: absolute;
        top: 0;
        width: 80px !important;
        height: 100%;
        z-index: 2;
        pointer-events: none;
    }
}

.ad-rail-wrap::before,
.ad-rail-wrap::after {
    content: "";
      position: absolute;
      top: 0;
      width: 300px; /* fade width */
      height: 100%;
      z-index: 2;
      pointer-events: none;
    }

    .ad-rail-wrap::before {
      left: 0;
      background: linear-gradient(to right, #0e1c27 0%, transparent 100%);
    }

    .ad-rail-wrap::after {
      right: 0;
      background: linear-gradient(to left, #0e1c27 0%, transparent 100%);
    }

.ad-rail{
  display:flex; gap:12px; overflow:auto; padding:6px 44px; /* room for arrows */
  scroll-behavior:smooth; scroll-snap-type:x mandatory;
}
.ad-rail::-webkit-scrollbar{ display:none; }

.ad-rail-card {
    min-width: 280px;
    max-width: 320px; 
    scroll-snap-align:center;
}

.rail-btn{
  position:absolute; top:50%; transform:translateY(-50%);
  border:0; width:36px; height:36px; border-radius:999px;
  background:#d8457a; box-shadow:0 4px 10px rgba(0,0,0,.14);
  cursor:pointer; z-index:5; font-size:14px; color: #fff; padding: 0px;
}
.rail-btn:hover {
    background: #fdd700;
    color: #252a2e;
}
.rail-left{ left:4px; line-height: 1em; } .rail-right{ right:4px; }
.rail-btn:disabled{ opacity:.5; cursor:not-allowed; }

/* === Step 3: Upgrade highlight (applied after verification) === */
.upgrade-highlight{
  outline: 3px solid rgba(60,196,124,.35);
  box-shadow: 0 0 0 6px rgba(60,196,124,.12);
  border-radius: 12px;
}
.upgrade-green{
  background: var(--green) !important; color:#fff !important;
}
.package-btn.highlight,
button.highlight {
  /*box-shadow: 0 0 0 3px #007bff inset;
  border-color: #007bff;*/
  background-color: var(--primary);
}
/* for scroling card at the bottom - End */




/*---------------PORTFOLIO SCROLL---------------------------------------------------*/
.screen {
    display: block;
    width: 300px;
    height: 350px;
    overflow: hidden;
    position: relative;
    /*border: 2px solid #b3b3b3;*/
    border-radius: 15px;
    margin: 0 auto;
}
.screen img {
    bottom: -1000px;
    width: 100%;
    height: auto;
    position: absolute;
    z-index: 0;
    margin:0;
    padding:0;
    -webkit-transition: top 11s;
    -moz-transition: top 11s;
    -ms-transition: top 11s;
    -o-transition: top 11s;
    transition: bottom 11s;
}
.screen:hover img {
  bottom: 0;
  -webkit-transition: all 11s;
  -moz-transition: all 11s;
  -ms-transition: all 11s;
  -o-transition: all 11s;
  transition: all 11s;
}

.port-text {
    text-align: center;
    padding-top: 12px;
}
.port-text p {
    padding: 7px 10px;
    font-size: 13px;
    color: #8ea2b2;
    line-height: 1.4em;
    font-family: inherit !important;
    font-weight: 600;
}

/*---------------PORTFOLIO SCROLL-------------------------------------------END--------*/


/*-------LOGOS---------------*/

      .carousel-logo {
      position: relative;
      width: 100%;
      max-width: 100%;
      overflow: hidden;
      /*border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
      background: #fff;*/
    }

    .carousel-track {
      display: flex;
      animation: ticker 30s linear infinite;
    }
    .carousel-track-2 {
      display: flex;
      animation: ticker-2 30s linear infinite;
    }

    .carousel-slide {
      min-width: 10%; /* 6 visible */
    }

    @media (max-width: 767px) {
      .carousel-slide { min-width: 30%; /* 3 visible */}
      .carousel::after { width: 48px; }
    }
    .carousel-slide img {
      width: 100%;
      display: block;
      position: relative;
      filter: grayscale(70%);
    }

    /* Keyframes for infinite scroll */
    @keyframes ticker {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    @keyframes ticker-2 {
      0% { transform: translateX(-50%); }
      100% { transform: translateX(0%); }
    }

    /* Fade effect on left and right */
    .carousel-logo::before,
    .carousel-logo::after {
      content: "";
      position: absolute;
      top: 0;
      width: 80px; /* fade width */
      height: 100%;
      z-index: 2;
      pointer-events: none;
    }

    .carousel-logo::before {
      left: 0;
      background: linear-gradient(to right, #15212a 0%, transparent 100%);
    }

    .carousel-logo::after {
      right: 0;
      background: linear-gradient(to left, #15212a 0%, transparent 100%);
    }

      /*------------LOGOS-END-----------*/


h1 {
    font-size: 2.2rem;
}
/*.top-header {
    padding: 150px 0px 60px 0px !important;
}*/
.blockquote {
    font-family: "Philosopher", sans-serif;
    font-size: 2rem;
    margin-bottom: 3rem;
}
.blockquote-footer {
    font-family: "Philosopher", sans-serif;
    text-align: right;
}
.gap {
    min-height: 50px;
}
.sec-normal {
    padding: 70px 0px;
}
.footer-small-text {
    font-size: 12px;
    color:#fff;
    font-style: italic;
    font-weight: normal;
}
.nav-menu .main-menu>.menu-item:hover>.sub-menu {
    top: 70px !important;
}
.badge {
    font-weight: normal !important;
    font-size: 12px !important;
}
.megamenu-list .service-list .service .media-body a {
    line-height: 25px !important;
    font-weight: 400 !important;
    font-size: 14px !important;
}
.footer .footer-bottom .footer-menu {
    top: 13px !important;
}
.footer .footer-bottom {
    padding: 20px 0px 20px 0px !important;
}
.footer .logo-bg {
    margin: 10px 0 0 !important;
    width: 400px !important;
}