/* 玫瑰 主题 - 基于 apps-leyugroup.com 视觉风格 */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800;900&family=Poppins:wght@300;400;500;600;700&display=swap');

:root {
    --algy-primary: #510725;
    --algy-primary-dark: #260410;
    --algy-accent: #ec4899;
    --algy-gradient1: #fce7f3;
    --algy-gradient2: #fdf2f8;
    --algy-dark1: #4a0e22;
    --algy-dark2: #8c1c40;
    --algy-bg: #ffffff;
    --algy-text: #2b044d;
    --algy-text2: #707b8e;
    --algy-border: #e5e7eb;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Nunito', 'PingFang SC', 'Microsoft YaHei', sans-serif; color: var(--algy-text); background: var(--algy-bg); line-height: 1.6; }

/* ========== Header ========== */
.algy-header { background: #fff; position: sticky; top: 0; z-index: 999; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.algy-header .navbar { padding: 15px 0; }
.algy-header .navbar-brand img { max-height: 60px; }
.algy-header .nav-link { color: #333; font-weight: 500; padding: 0.5rem 1rem; transition: 0.3s; }
.algy-header .nav-link:hover, .algy-header .nav-link.active { color: var(--algy-primary); background: var(--algy-gradient2); border-radius: 4px; }
.algy-header .btn-primary { background: var(--algy-primary); border-color: var(--algy-primary); font-weight: 500; }
.algy-header .btn-primary:hover { background: var(--algy-primary-dark); border-color: var(--algy-primary-dark); transform: translateY(-1px); }

/* ========== Hero ========== */
.algy-hero { padding: 100px 0 80px; background: linear-gradient(135deg, var(--algy-gradient1), var(--algy-gradient2)); position: relative; overflow: hidden; }
.algy-hero h1 { font-size: 2.8rem; font-weight: 800; color: var(--algy-text); margin-bottom: 1.5rem; }
.algy-hero p { font-size: 1.1rem; color: var(--algy-text2); margin-bottom: 2rem; }
.algy-hero .btn-hero-primary { background: var(--algy-primary); color: #fff; padding: 14px 32px; border-radius: 30px; font-weight: 600; transition: 0.3s; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.algy-hero .btn-hero-primary:hover { background: var(--algy-primary-dark); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.2); }
.algy-hero .btn-hero-outline { background: transparent; color: var(--algy-primary); border: 2px solid var(--algy-primary); padding: 12px 28px; border-radius: 30px; font-weight: 600; text-decoration: none; transition: 0.3s; }
.algy-hero .btn-hero-outline:hover { background: var(--algy-primary); color: #fff; }
.algy-hero-image { position: relative; }
.algy-hero-image img { max-width: 100%; border-radius: 16px; box-shadow: 0 20px 50px rgba(0,0,0,0.15); }

/* ========== Service / Features ========== */
.algy-service { padding: 100px 0; background: linear-gradient(to right, var(--algy-gradient1), var(--algy-gradient2)); }
.algy-service-header { text-align: center; margin-bottom: 4rem; }
.algy-service-header h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 1rem; }
.algy-service-header p { color: var(--algy-text2); font-size: 1.1rem; }
.algy-service-card { background: #fff; border-radius: 16px; padding: 2.5rem 2rem; text-align: center; box-shadow: 0 5px 20px rgba(0,0,0,0.05); transition: 0.3s; height: 100%; }
.algy-service-card:hover { transform: translateY(-8px); box-shadow: 0 15px 40px rgba(0,0,0,0.1); }
.algy-service-icon { width: 80px; height: 80px; border-radius: 50%; background: linear-gradient(135deg, var(--algy-primary), var(--algy-accent)); display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem; color: #fff; font-size: 2rem; }
.algy-service-card h4 { font-weight: 700; margin-bottom: 1rem; color: var(--algy-text); }
.algy-service-card p { color: var(--algy-text2); font-size: 0.95rem; }

/* ========== Pricing ========== */
.algy-pricing { padding: 100px 0; background: var(--algy-bg); position: relative; }
.algy-pricing::before { content: ''; position: absolute; inset: 0; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120"><path fill="%23f0f9ff" d="M0,60 C300,0 900,120 1200,60 L1200,120 L0,120 Z"></path></svg>') no-repeat center/cover; opacity: 0.5; }
.algy-pricing-header { text-align: center; margin-bottom: 4rem; position: relative; z-index: 2; }
.algy-pricing-header h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 1rem; }
.algy-pricing-header p { color: var(--algy-text2); }
.algy-pricing-card { background: #fff; border-radius: 16px; padding: 2.5rem 2rem; text-align: center; box-shadow: 0 5px 20px rgba(0,0,0,0.05); transition: 0.3s; position: relative; z-index: 2; border: 2px solid transparent; }
.algy-pricing-card.featured { border-color: var(--algy-primary); transform: scale(1.05); }
.algy-pricing-card:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(0,0,0,0.1); }
.algy-pricing-card.featured:hover { transform: scale(1.05) translateY(-5px); }
.algy-pricing-card .price { font-size: 2.5rem; font-weight: 800; color: var(--algy-primary); margin: 1rem 0; }
.algy-pricing-card .price span { font-size: 1rem; color: var(--algy-text2); font-weight: 400; }
.algy-pricing-card h4 { font-weight: 700; margin-bottom: 0.5rem; }
.algy-pricing-card ul { list-style: none; padding: 0; margin: 1.5rem 0; }
.algy-pricing-card ul li { padding: 0.5rem 0; color: var(--algy-text2); }
.algy-pricing-card ul li i { color: var(--algy-primary); margin-right: 0.5rem; }
.algy-pricing-card .btn { background: var(--algy-primary); color: #fff; border: none; padding: 12px 30px; border-radius: 30px; font-weight: 600; width: 100%; }
.algy-pricing-card .btn:hover { background: var(--algy-primary-dark); }
.algy-pricing-card.featured .btn { background: linear-gradient(135deg, var(--algy-primary), var(--algy-accent)); }

/* ========== Customer Reviews ========== */
.algy-reviews { padding: 100px 0; background: linear-gradient(to right, var(--algy-gradient1), var(--algy-gradient2)); }
.algy-reviews-header { text-align: center; margin-bottom: 4rem; }
.algy-reviews-header h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 1rem; }
.algy-review-card { background: #fff; border-radius: 16px; padding: 2rem; box-shadow: 0 5px 20px rgba(0,0,0,0.05); margin: 0 1rem; height: 100%; }
.algy-review-card img { width: 60px; height: 60px; border-radius: 50%; margin-bottom: 1rem; }
.algy-review-card h4 { font-weight: 700; margin-bottom: 0.5rem; color: var(--algy-text); }
.algy-review-card p { color: var(--algy-text2); font-size: 0.95rem; }

/* ========== App Download ========== */
.algy-app { padding: 100px 0; background: var(--algy-bg); }
.algy-app h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 1rem; }
.algy-app p { color: var(--algy-text2); margin-bottom: 2rem; }
.algy-app-btns { display: flex; gap: 1rem; flex-wrap: wrap; }
.algy-app-btns a { display: inline-block; padding: 12px 30px; border-radius: 8px; font-weight: 600; text-decoration: none; transition: 0.3s; }
.algy-app-btns .btn-app { background: var(--algy-text); color: #fff; }
.algy-app-btns .btn-app:hover { background: var(--algy-primary); }
.algy-app-btns .btn-outline { background: transparent; color: var(--algy-text); border: 2px solid var(--algy-text); }
.algy-app-image img { max-width: 100%; border-radius: 16px; box-shadow: 0 20px 50px rgba(0,0,0,0.15); }

/* ========== CTA ========== */
.algy-cta { padding: 80px 0; background: linear-gradient(135deg, var(--algy-primary), var(--algy-primary-dark)); color: #fff; position: relative; overflow: hidden; }
.algy-cta::before { content: ''; position: absolute; top: -50%; right: -10%; width: 400px; height: 400px; border-radius: 50%; background: rgba(255,255,255,0.1); }
.algy-cta::after { content: ''; position: absolute; bottom: -50%; left: -10%; width: 300px; height: 300px; border-radius: 50%; background: rgba(255,255,255,0.08); }
.algy-cta h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 1rem; position: relative; z-index: 2; }
.algy-cta .btn { background: #fff; color: var(--algy-primary); padding: 14px 40px; border-radius: 30px; font-weight: 600; border: none; position: relative; z-index: 2; }
.algy-cta .btn:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(0,0,0,0.2); }

/* ========== FAQ ========== */
.algy-faq { padding: 100px 0; background: var(--algy-bg); }
.algy-faq h2 { text-align: center; font-size: 2.2rem; font-weight: 700; margin-bottom: 3rem; }
.algy-faq-item { background: var(--algy-gradient2); border-radius: 12px; padding: 1.5rem; margin-bottom: 1rem; cursor: pointer; transition: 0.3s; }
.algy-faq-item:hover { background: var(--algy-gradient1); }
.algy-faq-item h5 { font-weight: 600; margin-bottom: 0.5rem; color: var(--algy-primary); }
.algy-faq-item p { color: var(--algy-text2); margin: 0; }

/* ========== Footer ========== */
.algy-footer { background: var(--algy-dark1); color: #fff; padding: 60px 0 30px; }
.algy-footer h5 { font-weight: 700; margin-bottom: 1.5rem; }
.algy-footer p, .algy-footer li { color: rgba(255,255,255,0.7); font-size: 0.95rem; }
.algy-footer ul { list-style: none; padding: 0; }
.algy-footer ul li { margin-bottom: 0.5rem; }
.algy-footer ul li a { color: rgba(255,255,255,0.7); text-decoration: none; transition: 0.3s; }
.algy-footer ul li a:hover { color: #fff; padding-left: 5px; }
.algy-footer .copyright { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1.5rem; margin-top: 2rem; text-align: center; color: rgba(255,255,255,0.5); }

/* ========== Responsive ========== */
@media (max-width: 768px) {
    .algy-hero h1 { font-size: 2rem; }
    .algy-hero p { font-size: 1rem; }
    .algy-pricing-card.featured { transform: scale(1); }
}