/* ========================================
   捐助支持页面 - 清新自然风
   ======================================== */

.donate-page {
    background: #f6faf6;
    min-height: 100vh;
    overflow: hidden;
}

.ls-footer,
.ls-float-menu {
    display: none;
}

/* ========================================
   Hero 区域
   ======================================== */

.donate-hero {
    position: relative;
    padding: 90px 24px 70px;
    background: linear-gradient(180deg, #f0f9f0 0%, #f6faf6 100%);
    overflow: hidden;
}

.donate-hero-content {
    position: relative;
    z-index: 10;
    max-width: 600px;
    margin: 0 auto;
    text-align: center;
}

.donate-hero-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
    color: #4caf50;
    font-size: 32px;
    margin-bottom: 24px;
    animation: donate-heartbeat 2s ease-in-out infinite;
}

@keyframes donate-heartbeat {
    0%, 100% { transform: scale(1); }
    15% { transform: scale(1.15); }
    30% { transform: scale(1); }
    45% { transform: scale(1.1); }
    60% { transform: scale(1); }
}

.donate-hero-content h1 {
    font-size: 48px;
    font-weight: 600;
    color: #2e3d2e;
    letter-spacing: -1px;
    margin: 0 0 16px;
}

.donate-tagline {
    font-size: 17px;
    color: #6b8f6b;
    margin: 0 0 8px;
}

.donate-sub-tagline {
    font-size: 14px;
    color: #9bb89b;
    margin: 0;
}

/* ========================================
   飘落的叶子 / 爱心 / 嫩芽
   ======================================== */

.donate-hero-leaves {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.donate-leaf {
    position: absolute;
    opacity: 0;
    animation: donate-leaf-fall linear infinite;
}

.donate-leaf i {
    display: block;
}

.donate-leaf-1  { left: 8%;  font-size: 20px; color: #a5d6a7; animation-duration: 12s; animation-delay: 0s; }
.donate-leaf-2  { left: 22%; font-size: 16px; color: #81c784; animation-duration: 15s; animation-delay: -2s; }
.donate-leaf-3  { left: 35%; font-size: 14px; color: #66bb6a; animation-duration: 10s; animation-delay: -5s; }
.donate-leaf-4  { left: 50%; font-size: 18px; color: #c8e6c9; animation-duration: 14s; animation-delay: -3s; }
.donate-leaf-5  { left: 62%; font-size: 13px; color: #ef9a9a; animation-duration: 11s; animation-delay: -7s; }
.donate-leaf-6  { left: 75%; font-size: 22px; color: #a5d6a7; animation-duration: 16s; animation-delay: -1s; }
.donate-leaf-7  { left: 88%; font-size: 12px; color: #ef9a9a; animation-duration: 13s; animation-delay: -4s; }
.donate-leaf-8  { left: 15%; font-size: 15px; color: #81c784; animation-duration: 17s; animation-delay: -8s; }
.donate-leaf-9  { left: 45%; font-size: 16px; color: #66bb6a; animation-duration: 12s; animation-delay: -6s; }
.donate-leaf-10 { left: 80%; font-size: 14px; color: #ef9a9a; animation-duration: 14s; animation-delay: -9s; }

@keyframes donate-leaf-fall {
    0% {
        transform: translateY(-40px) rotate(0deg) scale(0.8);
        opacity: 0;
    }
    10% { opacity: 0.7; }
    50% { opacity: 0.5; }
    90% { opacity: 0.3; }
    100% {
        transform: translateY(420px) rotate(360deg) scale(0.5);
        opacity: 0;
    }
}

/* ========================================
   花园容器（草丛 + 橄榄枝）- 固定定位
   ======================================== */

.donate-garden {
    position: fixed;
    bottom: 0;
    width: 180px;
    pointer-events: none;
    z-index: 9998;
}

.donate-garden-left  { left: 100px; }
.donate-garden-right { right: 100px; }

/* 草丛 */
.donate-grass-group {
    position: relative;
    width: 100%;
    height: 80px;
}

.donate-grass-blade {
    position: absolute;
    bottom: 0;
    width: 4px;
    border-radius: 2px 2px 0 0;
    transform-origin: bottom center;
    transition: transform 0.15s ease-out;
}

.donate-gb-1  { left: 20px;  height: 50px; background: linear-gradient(to top, #66bb6a, #a5d6a7); }
.donate-gb-2  { left: 45px;  height: 65px; background: linear-gradient(to top, #4caf50, #81c784); }
.donate-gb-3  { left: 65px;  height: 45px; background: linear-gradient(to top, #66bb6a, #c8e6c9); }
.donate-gb-4  { left: 90px;  height: 55px; background: linear-gradient(to top, #81c784, #a5d6a7); }
.donate-gb-5  { left: 115px; height: 40px; background: linear-gradient(to top, #66bb6a, #c8e6c9); }
.donate-gb-6  { left: 25px;  height: 55px; background: linear-gradient(to top, #81c784, #a5d6a7); }
.donate-gb-7  { left: 50px;  height: 60px; background: linear-gradient(to top, #4caf50, #81c784); }
.donate-gb-8  { left: 75px;  height: 42px; background: linear-gradient(to top, #66bb6a, #c8e6c9); }
.donate-gb-9  { left: 100px; height: 50px; background: linear-gradient(to top, #66bb6a, #a5d6a7); }
.donate-gb-10 { left: 130px; height: 35px; background: linear-gradient(to top, #81c784, #c8e6c9); }

/* 橄榄枝 - 从底部生长，和草一样扎根底部 */
.donate-branch {
    position: absolute;
    bottom: -25px;
    left: 50%;
    margin-left: -80px;
    width: 160px;
    height: 280px;
    opacity: 0.75;
    transition: transform 0.2s ease-out;
    transform-origin: bottom center;
}

.donate-branch svg {
    width: 100%;
    height: 100%;
}

/* ========================================
   主内容区域
   ======================================== */

.donate-main {
    position: relative;
    z-index: 5;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 24px 80px;
}

/* ========================================
   捐助档位列表
   ======================================== */

.donate-tier-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: #e8f0e8;
    border: 1px solid #e0ece0;
    border-radius: 12px;
    overflow: hidden;
}

.donate-tier {
    display: flex;
    align-items: stretch;
    background: #fff;
    transition: background .15s;
}

.donate-tier:hover {
    background: #f8fbf8;
}

.donate-tier-featured {
    background: #f8fbf8;
}

.donate-tier-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 140px;
    flex-shrink: 0;
    padding: 24px 16px;
    border-right: 1px solid #e8f0e8;
}

.donate-tier-badge {
    font-size: 12px;
    font-weight: 600;
    padding: 3px 12px;
    border-radius: 6px;
    text-align: center;
}

.donate-tier-price {
    font-size: 28px;
    font-weight: 700;
    color: #2e3d2e;
    letter-spacing: -1px;
}

.donate-tier-body {
    flex: 1;
    padding: 24px 28px;
}

.donate-tier-title {
    font-size: 16px;
    font-weight: 600;
    color: #2e3d2e;
    margin-bottom: 12px;
}

.donate-tier-perks {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 24px;
}

.donate-tier-perks li {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #5a6e5a;
    line-height: 1.8;
}

.donate-tier-perks li i {
    font-size: 14px;
    color: #4caf50;
    flex-shrink: 0;
}

/* ========================================
   收款二维码（独立区块）
   ======================================== */

.donate-qrcodes {
    margin-top: 32px;
    background: #fff;
    border: 1px solid #e0ece0;
    border-radius: 12px;
    overflow: hidden;
}

.donate-qrcodes-title {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 24px;
    font-size: 15px;
    font-weight: 600;
    color: #2e3d2e;
    background: #f8fbf8;
    border-bottom: 1px solid #e8f0e8;
}

.donate-qrcodes-title i {
    font-size: 18px;
    color: #4caf50;
}

.donate-qrcodes-list {
    display: flex;
    justify-content: center;
    gap: 40px;
    padding: 32px 24px;
}

.donate-qrcode-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.donate-qrcode-img {
    width: 140px;
    height: 140px;
    border-radius: 12px;
    overflow: hidden;
    border: 2px solid #e8f0e8;
    background: #fff;
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
    cursor: pointer;
}

.donate-qrcode-img:hover {
    transform: scale(1.08) translateY(-4px);
    border-color: #4caf50;
    box-shadow: 0 12px 28px rgba(76, 175, 80, .18);
}

.donate-qrcode-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.donate-qrcode-label {
    font-size: 13px;
    color: #8fa88f;
    font-weight: 500;
    transition: color .3s;
}

.donate-qrcode-item:hover .donate-qrcode-label {
    color: #4caf50;
}

/* ========================================
   注意事项
   ======================================== */

.donate-notes {
    margin-top: 48px;
    background: #fff;
    border: 1px solid #e0ece0;
    border-radius: 12px;
    overflow: hidden;
}

.donate-notes-title {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 24px;
    font-size: 15px;
    font-weight: 600;
    color: #2e3d2e;
    background: #f8fbf8;
    border-bottom: 1px solid #e8f0e8;
}

.donate-notes-title i {
    font-size: 18px;
    color: #f0a020;
}

.donate-notes-list {
    padding: 20px 24px;
}

.donate-notes-list p {
    font-size: 14px;
    color: #8fa88f;
    line-height: 2;
    margin: 0;
}
