.membership-page{padding-bottom:80px}
.membership-hero{padding:30px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,.6fr);gap:22px;align-items:center;position:relative;overflow:hidden;background:radial-gradient(circle at 12% 15%,rgba(14,165,233,.16),transparent 34%),radial-gradient(circle at 88% 5%,rgba(124,58,237,.13),transparent 38%),#0a1422}
.membership-hero::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(125,211,252,.22) 1px,transparent 1px);background-size:34px 34px;opacity:.13}
.membership-hero-copy,.membership-current-card{position:relative;z-index:1;min-width:0}
.membership-hero-copy h1{font-size:clamp(2.2rem,5vw,4.6rem);line-height:1.02;margin:10px 0 14px}
.membership-hero-copy p{max-width:760px;color:var(--text-secondary);font-size:1.05rem;line-height:1.7}
.membership-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.membership-current-card{padding:20px;border:1px solid #2f4e6d;border-radius:14px;background:rgba(8,20,34,.9);box-shadow:0 18px 50px rgba(0,0,0,.24)}
.membership-current-top{display:flex;justify-content:space-between;gap:10px;align-items:center}
.membership-current-card h2{margin:12px 0 6px;font-size:1.65rem}
.membership-active-dot{display:inline-flex;gap:8px;align-items:center;color:#a7f3d0;font-weight:800}
.membership-active-dot::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--success);animation:memberPulse 1.8s ease-in-out infinite}
.membership-summary-strip{margin-top:16px;padding:18px;display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap}
.membership-plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px}
.membership-plan-card{position:relative;padding:22px;display:flex;flex-direction:column;gap:12px;min-height:410px;cursor:pointer;overflow:hidden}
.membership-plan-card input{position:absolute;opacity:0;pointer-events:none}
.membership-plan-card.selected{border-color:#4ac8ff;box-shadow:0 0 0 1px rgba(74,200,255,.18),0 20px 50px rgba(0,0,0,.25)}
.membership-plan-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.membership-plan-name{font-weight:900;color:#9adfff}
.membership-price{font-size:2.1rem;font-weight:900;line-height:1}
.membership-plan-card h2{margin:4px 0 0;font-size:1.42rem}
.membership-plan-card p{color:var(--text-secondary);line-height:1.55;overflow-wrap:anywhere}
.membership-feature-list{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.membership-feature-list li{display:flex;gap:9px;color:#d5e2f3}
.membership-feature-list li::before{content:"✓";color:var(--success);font-weight:900}
.membership-plan-foot{margin-top:auto;display:grid;gap:10px}
.membership-plan-note{color:var(--text-muted);font-size:.82rem}
.membership-current-label{position:absolute;right:12px;top:12px;padding:6px 9px;border-radius:999px;background:#173a2f;color:#a7f3d0;border:1px solid #2d6a55;font-size:.74rem;font-weight:900}
.membership-checkout{grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr);margin-top:18px}
.membership-checkout-card{padding:22px;min-width:0}
.membership-qr{width:min(260px,100%);aspect-ratio:1;border-radius:14px;background:#fff;padding:10px;margin:16px auto;display:block}
.membership-form{display:grid;gap:14px}
.membership-form label{display:grid;gap:7px;color:#bdd0e6;font-weight:800;font-size:.86rem}
.membership-form input,.membership-form textarea{width:100%;min-width:0;border:1px solid var(--border);background:#081421;color:#fff;border-radius:10px;padding:12px 13px}
.membership-form textarea{min-height:110px;resize:vertical}
.membership-redeem{margin-top:18px;padding:20px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center}
.membership-redeem form{display:flex;gap:9px;min-width:0}
.membership-redeem input{min-width:0;width:280px;max-width:100%;border:1px solid var(--border);background:#081421;color:#fff;border-radius:10px;padding:12px}
.membership-history{margin-top:18px;padding:20px}
.membership-history-list{display:grid;gap:9px}
.membership-history-row{display:grid;grid-template-columns:1fr auto auto auto;gap:14px;padding:12px 14px;border:1px solid var(--border);border-radius:10px;align-items:center;min-width:0}
.membership-history-row>*{overflow-wrap:anywhere}
@keyframes memberPulse{50%{box-shadow:0 0 0 7px rgba(52,211,153,.1)}}
@media(max-width:920px){.membership-hero,.membership-checkout{grid-template-columns:1fr}.membership-plan-grid{grid-template-columns:1fr}.membership-plan-card{min-height:auto}.membership-redeem{grid-template-columns:1fr}}
@media(max-width:600px){.membership-hero{padding:20px}.membership-hero-actions,.membership-redeem form{display:grid;grid-template-columns:1fr}.membership-summary-strip{align-items:flex-start}.membership-history-row{grid-template-columns:1fr 1fr}.membership-redeem input{width:100%}}
