.membership-card{border-radius:20px;overflow:visible;position:relative;display:flex;flex-direction:column;transition:all 0.4s cubic-bezier(0.4,0,0.2,1);box-shadow:0 6px 25px rgba(0,0,0,0.15);border:2px solid rgba(255,255,255,0.1);height:100%;width:100%;max-width:100%}.membershipSwiper .swiper-slide{height:auto;display:flex;width:auto;max-width:100%;box-sizing:border-box}.membership-swiper-container .swiper-slide,.membership-grid .membership-card{flex:0 0 auto;box-sizing:border-box}.membership-swiper-container{width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}.membershipSwiper{overflow:visible !important;padding:0 20px;width:100%;max-width:100%;box-sizing:border-box}@media (max-width:767px){.membershipSwiper{padding:0 10px}.membershipSwiper .swiper-slide{max-width:calc(100vw - 40px);margin:0 auto}.membership-card{max-width:100%;margin:0 auto}}@media (max-width:375px){.membershipSwiper{padding:0 8px}.membershipSwiper .swiper-slide{max-width:calc(100vw - 32px)}}.membership-card.card-blue{background:linear-gradient(135deg,#193c76 0%,#0077b6 100%);color:#ffffff}.membership-card.card-gold{background:linear-gradient(135deg,#f5c542 0%,#edd25f 100%);color:#1a1a1a}.membership-card.card-red{background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);color:#ffffff}.membership-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 12px 40px rgba(0,0,0,0.3)}.membership-card.active{transform:translateY(-10px) scale(1.03);box-shadow:0 15px 45px rgba(0,0,0,0.35);z-index:5}.membership-card.card-blue.active{background:linear-gradient(135deg,#224a8d 0%,#0088cc 100%)}.membership-card.card-gold.active{background:linear-gradient(135deg,#f5c542 0%,#f5c542 100%)}.membership-card.card-red.active{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%)}.membership-card.owned{border:3px solid #10b981;box-shadow:0 8px 30px rgba(16,185,129,0.3)}.owned-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(16,185,129,0.08) 0%,rgba(5,150,105,0.08) 100%);pointer-events:none;z-index:1;border-radius:inherit}.owned-badge-membership{position:absolute;top:12px;left:12px;background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:white;padding:8px 14px;border-radius:12px;font-size:11px;font-weight:800;display:flex;align-items:center;gap:6px;box-shadow:0 4px 15px rgba(16,185,129,0.5);z-index:10;text-transform:uppercase;letter-spacing:0.8px;animation:badge-glow 2s ease-in-out infinite}@keyframes badge-glow{0%,100%{box-shadow:0 4px 15px rgba(16,185,129,0.5)}50%{box-shadow:0 6px 25px rgba(16,185,129,0.7)}}.owned-badge-membership i{font-size:14px;animation:crown-rotate 3s linear infinite}@keyframes crown-rotate{0%,90%{transform:rotate(0deg)}95%{transform:rotate(-15deg)}100%{transform:rotate(0deg)}}.membership-card-image{position:relative;width:100%;height:200px;overflow:hidden;border-radius:20px 20px 0 0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(0,0,0,0.03) 0%,rgba(0,0,0,0.08) 100%)}.membership-card-image img{width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform 0.6s cubic-bezier(0.4,0,0.2,1);user-select:none;-webkit-user-drag:none;max-width:100%}.membership-card:hover .membership-card-image img{transform:scale(1.08)}@media (max-width:375px){.membership-card-image{height:320px}.membership-card{border-radius:16px}.membership-card-image{border-radius:16px 16px 0 0}}@media (min-width:376px) and (max-width:480px){.membership-card-image{height:320px}}@media (min-width:481px) and (max-width:576px){.membership-card-image{height:350px}}@media (min-width:577px) and (max-width:767px){.membership-card-image{height:350px}}@media (min-width:768px) and (max-width:1023px){.membership-card-image{height:350px}}@media (min-width:1024px) and (max-width:1279px){.membership-card-image{height:380px}}@media (min-width:1280px) and (max-width:1439px){.membership-card-image{height:370px}}@media (min-width:1440px){.membership-card-image{height:380px}}.discount-badge{position:absolute;top:12px;right:12px;background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);color:white;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:900;box-shadow:0 4px 15px rgba(220,38,38,0.5);z-index:10;letter-spacing:0.8px;text-transform:uppercase;border:2px solid rgba(255,255,255,0.3);animation:discount-pulse 2s ease-in-out infinite;white-space:nowrap}@keyframes discount-pulse{0%,100%{transform:scale(1);box-shadow:0 4px 15px rgba(220,38,38,0.5)}50%{transform:scale(1.05);box-shadow:0 6px 25px rgba(220,38,38,0.7)}}.badge-membership{display:inline-block;padding:8px 16px;border-radius:20px;font-size:11px;font-weight:900;letter-spacing:0.8px;text-transform:uppercase;box-shadow:0 4px 15px rgba(0,0,0,0.2);animation:badge-pulse 2s ease-in-out infinite;border:2px solid rgba(255,255,255,0.2);white-space:nowrap;max-width:100%}.badge-membership.badge-recommended{background:linear-gradient(135deg,#b45309 0%,#92400e 100%);color:#ffffff;box-shadow:0 4px 20px rgba(180,83,9,0.5)}.badge-membership.badge-popular{background:linear-gradient(135deg,#991b1b 0%,#7f1d1d 100%);color:#ffffff;box-shadow:0 4px 20px rgba(153,27,27,0.5)}@keyframes badge-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.membership-card-content{padding:18px;display:flex;flex-direction:column;flex:1;position:relative;z-index:2;box-sizing:border-box;width:100%;max-width:100%}@media (min-width:768px){.membership-card-content{padding:20px}}@media (min-width:1024px){.membership-card-content{padding:22px}}.price-section{position:relative;margin-bottom:12px;width:100%;max-width:100%;box-sizing:border-box}.badge-wrapper{margin-bottom:10px;min-height:36px;display:flex;align-items:center;width:100%;overflow:hidden}.discount-price{font-size:13px;text-decoration:line-through;opacity:0.7;font-weight:600;margin-bottom:4px;word-break:break-word}.card-gold .discount-price{color:#78350f;opacity:0.8}.real-price{font-size:24px;font-weight:900;line-height:1.2;margin-bottom:0;letter-spacing:-0.5px;word-break:break-word}.card-gold .real-price{color:#1a1a1a}@media (min-width:768px){.real-price{font-size:26px}}@media (min-width:1024px){.real-price{font-size:28px}.discount-price{font-size:14px}}.membership-card-title{font-size:15px;font-weight:800;margin-bottom:14px;min-height:44px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;width:100%}.card-gold .membership-card-title{color:#1a1a1a}@media (min-width:768px){.membership-card-title{font-size:16px;min-height:46px}}@media (min-width:1024px){.membership-card-title{font-size:17px;min-height:48px}}.detail-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:100%;padding:12px 18px;border-radius:12px;font-weight:700;font-size:13px;border:none;cursor:pointer;background:rgba(255,255,255,0.15);margin-bottom:14px;transition:all 0.3s ease;position:relative;z-index:2;backdrop-filter:blur(10px);box-sizing:border-box}.card-gold .detail-btn{background:rgba(0,0,0,0.1);color:#1a1a1a}.card-gold .detail-btn:hover{background:rgba(0,0,0,0.2)}@media (min-width:768px){.detail-btn{font-size:14px;padding:13px 20px}}@media (min-width:1024px){.detail-btn{padding:14px 22px;font-size:15px}}.detail-btn:hover{background:rgba(255,255,255,0.25);transform:translateY(-2px)}.detail-btn:active{transform:scale(0.98)}.detail-btn.active,.membership-card.active .detail-btn{background:rgba(255,255,255,0.35);font-weight:800}.chevron{transition:transform 0.4s ease;flex-shrink:0}.chevron.rotate{transform:rotate(180deg)}.details-dropdown{position:absolute;left:18px;right:18px;bottom:20%;max-height:0;overflow:hidden;opacity:0;visibility:hidden;transition:opacity 0.4s ease,max-height 0.4s ease,visibility 0.4s ease;margin-bottom:10px;z-index:1000;pointer-events:none;box-sizing:border-box}.details-content{border-radius:14px;padding:14px;background:rgba(255,255,255,0.15);backdrop-filter:blur(15px);box-shadow:0 -4px 20px rgba(0,0,0,0.2);max-height:280px;overflow-y:auto;-webkit-overflow-scrolling:touch;border:1px solid rgba(255,255,255,0.1);box-sizing:border-box;width:100%}.card-gold .details-content{background:rgba(0,0,0,0.08)}@media (min-width:1024px){.details-content{padding:16px;max-height:300px}}.details-dropdown.active{opacity:1;visibility:visible;pointer-events:auto;max-height:380px}.benefits-list{list-style:none;padding:0;margin:0;width:100%}.benefits-list li{display:flex;gap:8px;align-items:flex-start;font-size:12px;margin-bottom:8px;line-height:1.6;word-break:break-word}.card-gold .benefits-list li{color:#1a1a1a}@media (min-width:768px){.benefits-list li{font-size:13px;margin-bottom:9px}}@media (min-width:1024px){.benefits-list li{font-size:14px;margin-bottom:10px}}.check{color:#86efac;font-weight:900;margin-top:2px;flex-shrink:0;font-size:15px}.card-gold .check{color:#15803d}.spacer{flex:1}.order-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:100%;padding:14px 24px;border-radius:25px;font-weight:900;text-decoration:none;font-size:14px;z-index:2;position:relative;transition:all 0.3s ease;line-height:1.4;text-transform:uppercase;letter-spacing:0.5px;overflow:hidden;background:rgba(255,255,255,0.9);box-shadow:0 6px 20px rgba(0,0,0,0.2);box-sizing:border-box;white-space:nowrap}.card-blue .order-btn{background:rgba(255,255,255,0.95);color:#193c76}.card-gold .order-btn{background:rgba(26,26,26,0.9);color:#f5c542}.card-red .order-btn{background:rgba(255,255,255,0.95);color:#dc2626}.order-btn::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(0,0,0,0.1);transform:translate(-50%,-50%);transition:width 0.6s,height 0.6s}.order-btn:hover::before{width:400px;height:400px}@media (min-width:768px){.order-btn{padding:15px 26px;font-size:15px}}@media (min-width:1024px){.order-btn{padding:16px 28px;font-size:16px}}.order-btn:hover{box-shadow:0 8px 30px rgba(0,0,0,0.3);transform:translateY(-3px)}.order-btn:active{transform:scale(0.98)}.expiry-section{margin-top:16px;margin-bottom:16px;width:100%;box-sizing:border-box}.expiry-info{font-size:13px;display:flex;align-items:center;gap:8px;justify-content:center;padding:12px 18px;border-radius:12px;font-weight:800;transition:all 0.3s ease;border:2px solid;text-transform:uppercase;letter-spacing:0.5px;width:100%;max-width:100%;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (min-width:768px){.expiry-info{font-size:14px;padding:13px 20px}}@media (min-width:1024px){.expiry-info{font-size:15px;padding:14px 22px}}.expiry-info.lifetime{background:linear-gradient(135deg,rgba(16,185,129,0.15) 0%,rgba(5,150,105,0.15) 100%);color:#059669;border-color:rgba(16,185,129,0.4)}.expiry-info.lifetime i{font-size:18px;color:#10b981;animation:rotate-infinity 3s linear infinite}@keyframes rotate-infinity{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.expiry-info.normal{background:linear-gradient(135deg,rgba(59,130,246,0.15) 0%,rgba(37,99,235,0.15) 100%);color:#2563eb;border-color:rgba(59,130,246,0.4)}.expiry-info.normal i{font-size:16px;color:#3b82f6}.expiry-info.expiring-soon{background:linear-gradient(135deg,rgba(251,146,60,0.2) 0%,rgba(249,115,22,0.2) 100%);color:#ea580c;border-color:rgba(249,115,22,0.5);animation:pulse-warning 2s ease-in-out infinite}.expiry-info.expiring-soon i{font-size:16px;color:#f97316;animation:shake-warning 0.5s ease-in-out infinite}@keyframes pulse-warning{0%,100%{box-shadow:0 0 0 0 rgba(249,115,22,0.4)}50%{box-shadow:0 0 0 10px rgba(249,115,22,0)}}@keyframes shake-warning{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}.membership-card:hover .expiry-info.lifetime{background:linear-gradient(135deg,rgba(16,185,129,0.25) 0%,rgba(5,150,105,0.25) 100%);border-color:rgba(16,185,129,0.6)}.membership-card:hover .expiry-info.normal{background:linear-gradient(135deg,rgba(59,130,246,0.25) 0%,rgba(37,99,235,0.25) 100%);border-color:rgba(59,130,246,0.6)}.membership-card:hover .expiry-info.expiring-soon{background:linear-gradient(135deg,rgba(251,146,60,0.3) 0%,rgba(249,115,22,0.3) 100%);border-color:rgba(249,115,22,0.7)}@media (max-width:576px){.membership-card{border-radius:16px;max-width:100%}.membership-card-image{border-radius:16px 16px 0 0}.owned-badge-membership{font-size:10px;padding:6px 12px}.owned-badge-membership i{font-size:12px}.badge-membership{font-size:10px !important;padding:6px 14px !important}.membership-card-content{padding:16px}.real-price{font-size:22px}.membership-card-title{font-size:14px;min-height:40px}.detail-btn{font-size:12px;padding:10px 16px}.expiry-info{font-size:11px;padding:10px 14px;white-space:normal;text-align:center}.expiry-info i{font-size:13px !important}.order-btn{font-size:13px;padding:12px 20px}.discount-badge{font-size:10px;padding:5px 10px}}.details-content::-webkit-scrollbar{width:6px}.details-content::-webkit-scrollbar-track{background:rgba(255,255,255,0.1);border-radius:10px}.details-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);border-radius:10px}.details-content::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.5)}.card-gold .details-content::-webkit-scrollbar-track{background:rgba(0,0,0,0.1)}.card-gold .details-content::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.3)}.card-gold .details-content::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.5)}