.referral-page{background-color:#fafafa;min-height:100vh;padding-top:20px;padding-bottom:60px}.referral-page .container{max-width:100%;margin:0 auto;padding:0 40px}.referral-hero{background-color:#fff;border-radius:24px;margin-bottom:30px;padding:40px;position:relative;overflow:hidden;box-shadow:0 4px 20px #00000008}.hero-images{justify-content:space-between;align-items:center;margin-bottom:40px;display:flex}.hero-img-left,.hero-img-right{object-fit:contain;max-width:250px}.hero-text{text-align:center;max-width:600px}.ref-title{color:#052c21;opacity:0;margin-bottom:10px;font-size:3rem;font-weight:800;transition:all .8s ease-out;transform:translateY(20px)}.ref-subtitle{color:#b99256;opacity:0;margin-bottom:20px;font-size:1.5rem;font-weight:700;transition:all .8s ease-out;transform:translateY(20px)}.ref-desc{color:#666;opacity:0;font-size:1.1rem;line-height:1.6;transition:all .8s ease-out;transform:translateY(20px)}.loaded .ref-title{opacity:1;transition-delay:.1s;transform:translateY(0)}.loaded .ref-subtitle{opacity:1;transition-delay:.3s;transform:translateY(0)}.loaded .ref-desc,.rewards-grid.loaded .reward-item:first-child{opacity:1;transition-delay:.5s;transform:translateY(0)}.rewards-grid.loaded .reward-divider:nth-child(2){opacity:1;transition-delay:1.2s;transform:translateY(0)}.rewards-grid.loaded .reward-item:nth-child(3){opacity:1;transition-delay:1.9s;transform:translateY(0)}.ref-features{border-top:1px solid #eee;justify-content:space-between;gap:20px;padding-top:30px;display:flex}.ref-feature{text-align:right;align-items:center;gap:15px;display:flex}.ref-feature .ref-icon{color:#333;font-size:24px}.ref-feature h4{color:#333;margin:0 0 5px;font-size:1rem;font-weight:700}.ref-feature p{color:#888;margin:0;font-size:.9rem}.ref-cards{grid-template-columns:1.5fr 1fr;gap:30px;margin-bottom:30px;display:grid}.ref-card{border-radius:24px;padding:30px}.dark-card{color:#fff;background-color:#052c21;position:relative}.dark-card-header{text-align:center;margin-bottom:30px}.dark-card-header h3{color:#b99256;margin-bottom:10px;font-size:1.5rem}.dark-card-header p{color:#fff;font-size:1rem}.rewards-grid{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;justify-content:space-between;align-items:center;padding:20px;display:flex}.rewards-grid .reward-item,.rewards-grid .reward-divider{opacity:0;transition:all 1s cubic-bezier(.4,0,.2,1);transform:translateY(20px)}.reward-item{text-align:center;flex:1}.reward-item h4{color:#fff;margin-bottom:15px;font-size:.9rem;font-weight:400}.reward-percent{color:#b99256;margin-bottom:15px;font-size:2.5rem;font-weight:700}.reward-item p{color:#ccc;margin:0;font-size:.8rem;line-height:1.4}.reward-divider{justify-content:center;align-items:center;padding:0 10px;display:flex}.plus-icon{color:#fff;background-color:#b99256;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;display:flex}.dark-card-footer{justify-content:space-between;align-items:center;margin-top:30px;display:flex}.dark-card-footer p{color:#fff;margin:0;font-size:.9rem}.medal-icon{color:#b99256;font-size:32px}.light-card{background-color:#fff;border:1px solid #eee}.light-card h3{text-align:center;color:#333;margin-bottom:50px;font-size:1.3rem}.steps-container{justify-content:space-between;align-items:flex-start;padding:0 20px;display:flex;position:relative}.step-item{text-align:center;z-index:2;flex-direction:column;flex:1;align-items:center;display:flex;position:relative}.step-icon-wrapper{background:#fff;border:2px solid #eee;border-radius:50%;justify-content:center;align-items:center;width:70px;height:70px;margin-bottom:15px;transition:all .4s;display:flex;position:relative}.step-icon{color:#333;font-size:28px;transition:all .4s}.step-number{color:#fff;background:#052c21;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;font-weight:700;transition:all .4s;display:flex;position:absolute;bottom:-10px}.step-item h4{color:#333;margin-bottom:8px;font-size:1rem;transition:all .4s}.step-item p{color:#888;margin:0;font-size:.85rem;line-height:1.4}.step-item.step-active .step-icon-wrapper{background:#052c21;border-color:#052c21;transform:scale(1.1);box-shadow:0 0 20px #052c214d}.step-item.step-active .step-icon{color:#b99256}.step-item.step-active .step-number{color:#fff;background:#b99256}.step-item.step-active h4{color:#b99256}.step-line{z-index:1;background:0 0;border-top:2px dashed #ccc;flex:1;height:2px;margin-top:35px;transition:border-color .4s;position:relative}.step-line.line-active{border-top-color:#052c21}.ref-bottom{width:100%;display:block}.stats-card,.cta-card{background:#fff;border:1px solid #eee;border-radius:24px;padding:30px}.stats-card h3{color:#333;margin-bottom:30px;font-size:1.2rem}.stats-grid{justify-content:space-between;display:flex}.stat-item{text-align:center;flex:1;position:relative}.stat-item:not(:last-child):after{content:"";background-color:#eee;width:1px;height:40px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.stat-icon{color:#666;margin-bottom:15px;font-size:24px}.stat-value{color:#333;margin-bottom:10px;font-size:1.5rem;font-weight:800}.stat-item p{color:#888;margin:0;font-size:.85rem}.cta-card{text-align:center;background-color:#fcfbfa;flex-direction:column;justify-content:center;align-items:center;display:flex}.cta-card h3{color:#333;margin-bottom:15px;font-size:1.3rem}.cta-card p{color:#666;margin-bottom:25px;font-size:.9rem;line-height:1.5}.cta-btn{color:#fff;cursor:pointer;background-color:#052c21;border:none;border-radius:8px;justify-content:center;align-items:center;gap:10px;padding:15px 50px;font-size:1rem;font-weight:700;text-decoration:none;transition:background-color .3s;display:inline-flex}.cta-btn:hover{color:#fff;background-color:#0a4031}@media (max-width:992px){.ref-cards,.ref-bottom{grid-template-columns:1fr}.hero-images{flex-direction:column;gap:30px}.hero-img-left,.hero-img-right{max-width:200px}.ref-features{flex-wrap:wrap}.ref-feature{width:45%}}@media (max-width:768px){.steps-container{flex-direction:column;gap:30px}.step-line{display:none}.stats-grid{flex-wrap:wrap;gap:20px}.stat-item{width:45%}.stat-item:after{display:none}.ref-features{flex-direction:column}.ref-feature{width:100%}}
