:root{
    --color-primary:#7c3aed;
    --color-primary-dark:#5b21b6;
    --color-accent:#22c55e;
    --color-surface:#fff7e6;
    --color-text:#0b1220;
    --rgb-primary:124,58,237;
    --rgb-accent:34,197,94;
    --radius-sm:6px;
    --radius-md:12px;
    --radius-lg:18px;
    --radius-xl:26px;
    --shadow-sm:0 1px 0 rgba(2,6,23,.06);
    --shadow-md:0 10px 26px rgba(2,6,23,.10), 0 2px 10px rgba(2,6,23,.06);
    --shadow-lg:0 18px 48px rgba(2,6,23,.16), 0 6px 18px rgba(2,6,23,.10), 0 1px 0 rgba(255,255,255,.25) inset;
    --space-section:3rem;
    --space-card:1.25rem;
    --space-gap:1rem;
    --transition:.52s cubic-bezier(.16,1,.3,1);
    --heading-weight:650;
    --body-line-height:1.65;
    --stripe-a:#ffffff;
    --stripe-b:#fff1cf;
    --stripe-c:#0b1220;
    --stripe-d:#ffffff;
    --card-border:rgba(124,58,237,.24);
    --card-glow:rgba(34,197,94,.22);
    --focus-ring:rgba(34,197,94,.42);
}

body{
    color:var(--color-text);
    line-height:var(--body-line-height);
    background:
        radial-gradient(1200px 500px at 15% -10%, rgba(124,58,237,.10), transparent 60%),
        radial-gradient(900px 420px at 85% 0%, rgba(34,197,94,.10), transparent 55%),
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,247,230,.88));
}

h1,h2,h3,h4{font-weight:var(--heading-weight)}

section,.section{
    padding-top:var(--space-section);
    padding-bottom:var(--space-section);
    background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,247,230,.45));
}

.card,[class*="card"]{
    border-radius:var(--radius-lg);
    box-shadow:
        0 14px 34px rgba(2,6,23,.14),
        0 3px 10px rgba(2,6,23,.08),
        0 1px 0 rgba(255,255,255,.45) inset;
    padding:var(--space-card);
    transition:
        box-shadow var(--transition),
        transform var(--transition),
        border-color var(--transition),
        background var(--transition),
        color var(--transition);
    background:
        radial-gradient(120% 120% at 0% 0%, rgba(124,58,237,.14), transparent 55%),
        radial-gradient(100% 120% at 100% 0%, rgba(34,197,94,.12), transparent 55%),
        linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,247,230,.78));
    border:1px solid rgba(2,6,23,.08);
}

.btn,button[class*="btn"],a[class*="btn"]{
    border-radius:var(--radius-md);
    transition:
        transform var(--transition),
        box-shadow var(--transition),
        background var(--transition),
        color var(--transition),
        border-color var(--transition),
        filter var(--transition);
    outline-color:var(--focus-ring);
    caret-color:var(--color-accent);
    accent-color:var(--color-accent);
}

a:not([class]){
    color:var(--color-primary);
    transition:
        color var(--transition),
        text-shadow var(--transition),
        filter var(--transition);
    text-shadow:0 1px 0 rgba(255,255,255,.35);
}

.card:hover,[class*="card"]:hover{
    transform:translateY(-6px);
    box-shadow:
        0 26px 64px rgba(2,6,23,.20),
        0 10px 26px rgba(2,6,23,.13),
        0 0 0 1px rgba(124,58,237,.22),
        0 1px 0 rgba(255,255,255,.50) inset;
    border-color:rgba(124,58,237,.35);
    background:
        radial-gradient(110% 120% at 10% 0%, rgba(124,58,237,.20), transparent 55%),
        radial-gradient(90% 110% at 100% 10%, rgba(34,197,94,.16), transparent 50%),
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,241,207,.80));
}

.card{border-left:4px solid transparent}
.card{
    border-image:
        linear-gradient(180deg, rgba(124,58,237,.95) 0%, rgba(34,197,94,.95) 100%) 1;
}

header,.header,.navbar{
    background:
        linear-gradient(90deg, rgba(124,58,237,.10), rgba(34,197,94,.08)),
        radial-gradient(1000px 300px at 20% 0%, rgba(255,255,255,.65), transparent 55%),
        linear-gradient(180deg, rgba(255,255,255,.0), rgba(255,255,255,.0));
}

/* ========== Section Layout Variants ========== */

/* news: masonry-2 */
/* 两列瀑布流 */
.news-grid{column-count:2;column-gap:var(--space-gap)}
.news-grid .card{break-inside:avoid;margin-bottom:var(--space-gap)}

/* features: centered */
/* 居中大卡片 */
.feature-list{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:calc(var(--space-gap) * 2);
    max-width:720px;
    margin:0 auto;
}
.feature-list .card{
    border-radius:var(--radius-xl);
    background:
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,247,230,.70)),
        radial-gradient(100% 120% at 50% 0%, rgba(124,58,237,.16), transparent 58%);
}

/* hero: overlay */
/* 全屏背景+文字覆盖 */
.hero{
    position:relative;
    min-height:70vh;
    display:flex;
    align-items:center;
}
.hero::before{
    content:"";
    position:absolute;
    inset:-1px;
    z-index:0;
    background:
        repeating-linear-gradient(90deg, rgba(255,255,255,.16) 0 16px, transparent 16px 32px),
        radial-gradient(1000px 500px at 20% 20%, rgba(124,58,237,.28), transparent 58%),
        radial-gradient(900px 420px at 80% 10%, rgba(34,197,94,.22), transparent 55%),
        linear-gradient(135deg, rgba(11,18,32,.92), rgba(11,18,32,.70));
    opacity:.98;
    filter:saturate(1.12) contrast(1.02);
}
.hero-content{position:relative;z-index:1}
.hero-content *{
    text-shadow:
        0 10px 30px rgba(2,6,23,.35),
        0 2px 8px rgba(2,6,23,.18);
}

/* testimonials: masonry */
.testimonial-list{column-count:2;column-gap:var(--space-gap)}
.testimonial-list>*{break-inside:avoid;margin-bottom:var(--space-gap)}
.testimonial-list .card{
    background:
        radial-gradient(120% 120% at 0% 0%, rgba(34,197,94,.16), transparent 55%),
        radial-gradient(100% 100% at 100% 0%, rgba(124,58,237,.14), transparent 55%),
        linear-gradient(180deg, rgba(255,255,255,.93), rgba(255,241,207,.78));
}

/* partners: grid-4 */
.partner-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:calc(var(--space-gap) * 1.5);
    align-items:center;
}
.partner-grid .card{
    border-radius:16px;
    box-shadow:
        0 12px 26px rgba(2,6,23,.12),
        0 2px 8px rgba(2,6,23,.07),
        0 1px 0 rgba(255,255,255,.40) inset;
}

/* faq: with-sidebar */
/* FAQ 左 + 联系信息右 */
.faq-wrapper{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:2rem;
}
.faq-wrapper .card{
    border-radius:22px;
}

/* stats: inline */
/* 水平排列 */
.stats-grid{
    display:flex;
    justify-content:center;
    gap:3rem;
}
.stats-grid .card{
    background:
        linear-gradient(180deg, rgba(11,18,32,.96), rgba(11,18,32,.76));
    color:rgba(255,255,255,.92);
    border:1px solid rgba(255,255,255,.10);
    box-shadow:
        0 22px 58px rgba(2,6,23,.30),
        0 10px 26px rgba(2,6,23,.16),
        0 1px 0 rgba(255,255,255,.10) inset;
}
.stats-grid .card *{color:inherit}
.stats-grid .card::selection{background:rgba(34,197,94,.35)}

/* cta: centered */
.cta-inner{text-align:center;max-width:700px;margin:0 auto}
.cta-inner .card{
    border-radius:var(--radius-xl);
    background:
        linear-gradient(135deg, rgba(124,58,237,.20) 0%, rgba(34,197,94,.16) 50%, rgba(255,255,255,.55) 100%),
        radial-gradient(900px 400px at 50% 0%, rgba(255,255,255,.55), transparent 55%),
        linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,241,207,.78));
    border:1px solid rgba(124,58,237,.18);
    box-shadow:
        0 28px 70px rgba(2,6,23,.18),
        0 10px 26px rgba(2,6,23,.10),
        0 0 0 1px rgba(34,197,94,.14) inset;
}

/* Page Layout: full-width */
/* 无侧边栏, 全宽 */
.page-main{max-width:1200px;margin:0 auto}

/* 条件性装饰 */
.card:focus-within,[class*="card"]:focus-within{
    outline:2px solid rgba(34,197,94,.35);
    outline-offset:3px;
    box-shadow:
        0 26px 64px rgba(2,6,23,.20),
        0 10px 26px rgba(2,6,23,.13),
        0 0 0 4px rgba(34,197,94,.14),
        0 1px 0 rgba(255,255,255,.52) inset;
}

@media (max-width:1024px){
    .news-grid{grid-template-columns:repeat(2, 1fr) !important}
    .feature-list{grid-template-columns:repeat(2, 1fr) !important}
    .partner-grid{grid-template-columns:repeat(3, 1fr) !important}
    .stats-grid{grid-template-columns:repeat(2, 1fr) !important}
    .hero-inner{grid-template-columns:1fr !important}
    .news-grid .card,.testimonial-list .card{border-radius:16px}
}
@media (max-width:640px){
    :root{--space-section:2rem;--space-card:1rem;--space-gap:0.75rem;--radius-lg:16px;--radius-xl:22px}
    .news-grid{grid-template-columns:1fr !important}
    .feature-list{grid-template-columns:1fr !important}
    .faq-list{grid-template-columns:1fr !important}
    .testimonial-list{column-count:1 !important}
    .partner-grid{grid-template-columns:repeat(2, 1fr) !important}
    .stats-grid{grid-template-columns:repeat(2, 1fr) !important}
    .cta-inner{grid-template-columns:1fr !important}
    .hero::before{opacity:.95}
}