/* earnedit sec-2 */
/* Animated filtering: smooth show/hide of cards */
.filter-grp .filter-box{
  transition: opacity .42s cubic-bezier(.22,1,.36,1), transform .42s cubic-bezier(.22,1,.36,1);
  will-change: opacity, transform;
  opacity: 1;
  transform: translateY(0);
}
/* transitional hiding class: animate to hidden state (translate only for smoother movement) */
.filter-grp .filter-box.is-hiding{
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
}
/* initial showing helper: start hidden, then remove this class to animate in */
.filter-grp .filter-box.is-showing{
  opacity: 0;
  transform: translateY(12px);
}
/* final hidden state: removed from layout so grid reflows */
.filter-grp .filter-box.is-hidden{ display: none !important; }


/* Stagger helper when revealing many cards */
.filter-grp[data-stagger="true"] .filter-box{ transition-delay: 0ms; }
.filter-grp[data-stagger="true"] .filter-box.showing{ opacity: 1; transform: none; }

/* Category pill active style for original links in this template */
.filter-bar ul{ display:flex; gap:10px; flex-wrap:wrap; margin:0; padding:0; }
.filter-bar ul li a{ display:inline-block; padding:8px 14px; border-radius:18px; background:transparent; color:#cfcfcf; border:1px solid rgba(255,255,255,0.03); transition:all .18s ease; }
.filter-bar ul li a.active{ background:linear-gradient(180deg,#1db954,#11c26f); color:#04240b; box-shadow:0 6px 18px rgba(17,194,111,0.12); border-color:rgba(0,0,0,0.2); }

.filter-sec {background: #0F0F0F; padding: 64px 0;}
.filter-grp {position: relative; width: 100%;}
.filter-grp .filter-bar {width: 100%; margin-bottom: 44px;}
.filter-grp .filter-bar ul {display: flex; align-items: center; justify-content: center; width: 100%; gap: 20px;}
.filter-grp .filter-bar ul li {display: block; margin: 0; padding: 0;}
.filter-grp .filter-bar ul li a {display: flex; align-items: center; justify-content: center; border: 1px solid #3CB64A; padding: 14px 32px; border-radius: 60px; font-family: 'Inter'; font-weight: 600; font-size: 16px; line-height: 20px; color: #3CB64A;}
.filter-grp .filter-bar ul li a.active {background: linear-gradient(90deg, #3CB64A 0%, #2E9E3F 100%); color: #FFF;}
.filter-box-grp {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; width: 100%; flex-wrap: wrap;}
.filter-box-grp .filter-box {position: relative; }
.filter-box-grp .filter-box .filter-inner {display: flex; flex-direction: column; width: 100%; background: #1E1E1E; overflow: hidden; border-radius: 16px; height: 100%;}
.filter-box-grp .filter-box .filter-inner .filter-img {display: block; position: relative; width: 100%;}
.filter-box-grp .filter-box .filter-inner .filter-img::after {content: ''; display: block; padding-top: 66.74%;}
.filter-box-grp .filter-box .filter-inner .filter-img img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 16px 16px 0 0;}
.filter-box-grp .filter-box .filter-inner .tag-line {position: absolute; left: 24px; top: 24px;}
.filter-box-grp .filter-box .filter-inner .tag-line span {display: block; font-family: 'Inter'; font-weight: 600; font-size: 14px; line-height: 16px; letter-spacing: 0%; color: #FFF; background: linear-gradient(90deg, #3CB64A 0%, #2E9E3F 100%);
padding: 10px 16px; border-radius: 60px;}
.filter-box-content {padding: 24px; display: flex; flex-direction: column; height: 100%;}
.filter-box-content .date-sec {display: block; margin-bottom: 10px; font-family: 'Inter'; font-weight: 400; font-size: 16px;
line-height: 24px; color: #A1A1AB;}
.filter-box-content .filter-title {margin-bottom: 16px;}
.filter-box-content .filter-title h5 {font-family: 'Inter'; font-weight: 600; font-size: 20px; line-height: 32px; color: #FFF; margin-bottom: 10px;}
.filter-box-content .filter-title p {font-family: 'Inter'; font-weight: 400; font-size: 16px; line-height: 24px; color: #A1A1AB;}
.auther-name {display: flex; align-items: center; gap: 10px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.1); margin-top: auto;}
.auther-name .auth-img {display: inline-flex; height: 32px; min-width: 32px; width: 32px; overflow: hidden; border-radius: 40px; border: 1px solid #3CB64A;}
.auther-name .auth-img img {width: 100%; height: 100%; object-fit: contain;}
.auther-name .auth-name {display: block;}
.auther-name .auth-name span {display: block; color: #FFF; font-family: 'Inter'; font-weight: 400; font-size: 16px;
line-height: 24px; }
/* Row mode: when a single category is selected show results in a horizontal row */
.filter-box-grp.row-mode{ display:flex; gap:20px; overflow-x:auto; padding-bottom:6px; }
.filter-box-grp.row-mode .filter-box{ flex: 0 0 320px; max-width:320px; }

.woocommerce.blog-listing nav.woocommerce-pagination ul{list-style: none;}
.woocommerce.blog-listing nav.woocommerce-pagination ul li .page-numbers:not(.current):not(.next):not(.prev){border: 1px solid #3CB64A; background: transparent; color: #3CB64A;}
.woocommerce.blog-listing nav.woocommerce-pagination ul li .next, 
.woocommerce.blog-listing nav.woocommerce-pagination ul li .prev{border: 1px solid #FFF; background: transparent; color: #FFF;}


/* loader */
.filter-grp .loaders { display: none; gap: 60px; align-items: center; flex-wrap: wrap; justify-content: center;  }
.filter-grp.loading .loaders { display: flex; }
.filter-grp.loading .filter-box-grp { display: none; }
.filter-grp .loader-wrap { display: flex;flex-direction: column;align-items: center;gap: 16px; }
.filter-grp .loader-wrap { display: flex;flex-direction: column;align-items: center;gap: 16px; }
.filter-grp .loader-wrap .bars rect:nth-child(1) { animation: barWave 1s ease-in-out infinite 0s; }
.filter-grp .loader-wrap .bars rect:nth-child(2) { animation: barWave 1s ease-in-out infinite 0.15s; }
.filter-grp .loader-wrap .bars rect:nth-child(3) { animation: barWave 1s ease-in-out infinite 0.3s; }
.filter-grp .loader-wrap .bars rect:nth-child(4) { animation: barWave 1s ease-in-out infinite 0.45s; }
.filter-grp .loader-wrap .bars rect:nth-child(5) { animation: barWave 1s ease-in-out infinite 0.6s; }
@keyframes barWave {
  0%,
  100% {
    height: 10px;
    y: 35px;
    opacity: 0.3;
  }
  50% {
    height: 40px;
    y: 20px;
    opacity: 1;
  }
}
/* loader */

@media (max-width: 1199px){ .filter-box-grp.row-mode .filter-box{ flex: 0 0 46%; max-width:46%; } }
@media (max-width: 767px){ .filter-box-grp.row-mode .filter-box{ flex: 0 0 80%; max-width:80%; } }

@media (max-width: 1699px){ 
  .filter-grp .filter-bar ul {gap: 10px;}
  .filter-grp .filter-bar ul li a {padding: 14px 20px;}
}

@media (max-width: 1399px){ 
  .filter-grp .filter-bar ul {gap: 10px;}
  .filter-grp .filter-bar ul li a {padding: 14px 20px;}
}

@media (max-width: 1199px){ 
  .filter-grp .filter-bar ul {gap: 8px;}
  .filter-grp .filter-bar ul li a {font-size: 14px; padding: 8px 18px;}
  .filter-box-grp {gap: 20px;}
  .filter-box-content {padding: 16px;}
  .filter-box-content .date-sec {font-size: 14px; line-height: 20px; margin-bottom: 6px;} 
  .filter-box-content .filter-title h5 {font-size: 18px; line-height: 26px; margin-bottom: 6px;}
  .filter-box-content .filter-title p {font-size: 14px; line-height: 20px;}
  .filter-box-content .filter-title {margin-bottom: 12px;}
  .auther-name {padding-top: 12px;}
  .auther-name .auth-name span {font-size: 14px; line-height: 20px;}

}

@media (max-width: 991px){
  .filter-box-grp{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px;}
  .filter-grp .filter-bar ul {gap: 5px;}
  .filter-grp .filter-bar ul li a {font-size: 12px; padding: 8px 10px;}
  .filter-box-content {padding: 16px;}
  .filter-box-content .date-sec {font-size: 14px; line-height: 20px; margin-bottom: 6px;} 
  .filter-box-content .filter-title h5 {font-size: 18px; line-height: 26px; margin-bottom: 6px;}
  .filter-box-content .filter-title p {font-size: 14px; line-height: 20px;}
  .filter-box-content .filter-title {margin-bottom: 12px;}
  .auther-name {padding-top: 12px;}
  .auther-name .auth-name span {font-size: 14px; line-height: 20px;}
}

@media (max-width: 767px){
  .filter-box-grp{ grid-template-columns: 1fr; gap: 24px;}
  .earn-banner .earn-banner-bg {min-height: 400px;}
  .earn-content .earn-scrub ul li span {font-size: 14px;}
  .earn-content .earn-scrub ul {gap: 30px;}
  .earn-content .earn-scrub {margin-bottom: 16px;}
  .earn-title h1 {font-size: 32px; line-height: 1; margin-bottom: 16px;}
  .earn-title p {font-size: 14px; line-height: 22px;}
  .filter-grp .filter-bar ul li a {font-size: 14px; padding: 8px 24px;}
  .filter-grp .filter-bar ul {width: 1080px; overflow-x: auto; gap: 8px; justify-content: flex-start;}
  .filter-grp .filter-bar {overflow-x: auto;}
  .filter-box-content {padding: 16px;}
  .filter-box-content .date-sec {font-size: 14px; line-height: 20px; margin-bottom: 6px;} 
  .filter-box-content .filter-title h5 {font-size: 18px; line-height: 26px; margin-bottom: 6px;}
  .filter-box-content .filter-title p {font-size: 14px; line-height: 20px;}
  .filter-box-content .filter-title {margin-bottom: 12px;}
  .auther-name {padding-top: 12px;}
  .auther-name .auth-name span {font-size: 14px; line-height: 20px;}

}
/* earnedit sec-2 */