:root{
    --pink:#f472b6;
    --sky:#38bdf8;
    --deep:#0f172a;
    --text:#1f2937;
    --muted:#64748b;
    --bg:#f8fafc;
    --card:#ffffff;
    --line:#e2e8f0;
    --radius:20px;
  }
  *{box-sizing:border-box;font-family:inherit;}
  html,body{
    margin:0;padding:0;
    font-family:"Segoe UI","Helvetica Neue",Arial,"Microsoft YaHei","微软雅黑","PingFang SC",sans-serif;
    color:var(--text);
    background:var(--bg);
    line-height:1.8;
    -webkit-font-smoothing:antialiased;
  }
  a{text-decoration:none;color:inherit;}
  img{max-width:100%;display:block;}
  .wrap{width:min(1180px,92%);margin:0 auto;}
  header.site-header{
    position:sticky;top:0;z-index:50;
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line);
  }
  .nav-bar{
    display:flex;align-items:center;justify-content:space-between;
    gap:16px;padding:14px 0;flex-wrap:wrap;
  }
  .logo{
    display:flex;align-items:center;gap:10px;
    font-weight:800;font-size:1.15rem;
    letter-spacing:.5px;
  }
  .logo-badge{
    width:38px;height:38px;border-radius:12px;
    background:linear-gradient(135deg,var(--pink),var(--sky));
    display:grid;place-items:center;color:#fff;font-size:1.1rem;
    box-shadow:0 8px 20px rgba(56,189,248,.28);
  }
  .logo span{background:linear-gradient(135deg,var(--pink),var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent;}
  .nav-links{display:flex;flex-wrap:wrap;gap:6px;}
  .nav-links a{
    padding:8px 14px;border-radius:999px;font-size:.92rem;color:#334155;
    transition:.25s;border:1px solid transparent;
  }
  .nav-links a:hover{
    background:linear-gradient(135deg,rgba(244,114,182,.14),rgba(56,189,248,.16));
    border-color:rgba(56,189,248,.4);
    color:#0f172a;
  }
  .hero{
    position:relative;overflow:hidden;
    background:linear-gradient(135deg,#fdf2f8 0%,#eff6ff 50%,#e0f2fe 100%);
    padding:56px 0 48px;
  }
  .hero::before{
    content:"";position:absolute;width:420px;height:420px;border-radius:50%;
    background:radial-gradient(circle,rgba(244,114,182,.35),transparent 70%);
    top:-160px;right:-80px;
  }
  .hero::after{
    content:"";position:absolute;width:360px;height:360px;border-radius:50%;
    background:radial-gradient(circle,rgba(56,189,248,.3),transparent 70%);
    bottom:-160px;left:-100px;
  }
  .hero-inner{
    position:relative;z-index:2;
    display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:center;
  }
  .tag{
    display:inline-block;padding:6px 16px;border-radius:999px;
    background:linear-gradient(135deg,var(--pink),var(--sky));
    color:#fff;font-size:.82rem;font-weight:700;letter-spacing:1px;
    box-shadow:0 8px 20px rgba(244,114,182,.28);
  }
  h1{
    font-size:clamp(1.6rem,3.4vw,2.5rem);
    line-height:1.35;margin:18px 0 14px;font-weight:800;color:#0f172a;
  }
  h1 em{
    font-style:normal;
    background:linear-gradient(135deg,var(--pink),var(--sky));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .hero p{color:#475569;font-size:1rem;margin:0 0 22px;}
  .btn-row{display:flex;gap:12px;flex-wrap:wrap;}
  .btn{
    display:inline-block;padding:12px 26px;border-radius:999px;font-weight:700;font-size:.94rem;
    transition:.25s;border:1px solid transparent;
  }
  .btn-primary{
    background:linear-gradient(135deg,var(--pink),var(--sky));color:#fff;
    box-shadow:0 12px 26px rgba(56,189,248,.32);
  }
  .btn-primary:hover{transform:translateY(-3px);}
  .btn-ghost{
    background:#fff;color:#0f172a;border-color:var(--line);
  }
  .btn-ghost:hover{border-color:var(--sky);color:#0369a1;}
  .hero-figure{
    border-radius:26px;overflow:hidden;
    box-shadow:0 24px 50px rgba(15,23,42,.14);
    border:6px solid #fff;background:#fff;
  }
  section{padding:56px 0;}
  .sec-head{text-align:center;margin-bottom:34px;}
  .sec-head h2{
    font-size:clamp(1.3rem,2.4vw,1.8rem);margin:0 0 10px;color:#0f172a;font-weight:800;
  }
  .sec-head h2 span{
    background:linear-gradient(135deg,var(--pink),var(--sky));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .sec-head p{margin:0;color:var(--muted);font-size:.95rem;}
  .geo-box{
    background:#fff;border-radius:var(--radius);padding:30px 32px;
    border:1px solid var(--line);box-shadow:0 12px 30px rgba(15,23,42,.05);
  }
  .geo-box p{margin:0 0 14px;color:#334155;}
  .geo-box p:last-child{margin-bottom:0;}
  .grid{display:grid;gap:20px;}
  .grid-4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));}
  .grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));}
  .grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}
  .stat-card{
    background:#fff;border-radius:var(--radius);padding:26px 22px;text-align:center;
    border:1px solid var(--line);transition:.28s;
  }
  .stat-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(56,189,248,.18);border-color:rgba(56,189,248,.5);}
  .stat-num{
    font-size:2rem;font-weight:800;
    background:linear-gradient(135deg,var(--pink),var(--sky));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .stat-label{color:var(--muted);font-size:.92rem;margin-top:6px;}
  .adv-card{
    background:#fff;border-radius:var(--radius);padding:26px 22px;
    border:1px solid var(--line);transition:.28s;position:relative;overflow:hidden;
  }
  .adv-card::before{
    content:"";position:absolute;top:0;left:0;height:4px;width:100%;
    background:linear-gradient(90deg,var(--pink),var(--sky));
    opacity:0;transition:.28s;
  }
  .adv-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(244,114,182,.16);}
  .adv-card:hover::before{opacity:1;}
  .adv-icon{font-size:1.7rem;margin-bottom:10px;}
  .adv-card h3{margin:0 0 8px;font-size:1.05rem;color:#0f172a;}
  .adv-card p{margin:0;color:var(--muted);font-size:.9rem;}
  .rank-table{
    width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;
    box-shadow:0 12px 30px rgba(15,23,42,.06);font-size:.94rem;
  }
  .rank-table th{
    background:linear-gradient(135deg,rgba(244,114,182,.16),rgba(56,189,248,.18));
    color:#0f172a;text-align:left;padding:14px 16px;font-weight:700;font-size:.9rem;
  }
  .rank-table td{padding:14px 16px;border-top:1px solid var(--line);color:#334155;}
  .pill{
    display:inline-block;padding:3px 12px;border-radius:999px;font-size:.78rem;font-weight:700;
    background:rgba(56,189,248,.14);color:#0369a1;
  }
  .pill-pink{background:rgba(244,114,182,.16);color:#be185d;}
  .event-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;}
  .event-card{
    background:#fff;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
    transition:.28s;display:flex;flex-direction:column;
  }
  .event-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(15,23,42,.1);}
  .event-card img{height:170px;object-fit:cover;width:100%;}
  .event-body{padding:20px 22px;}
  .event-body h3{margin:0 0 8px;font-size:1.02rem;color:#0f172a;}
  .event-body p{margin:0;color:var(--muted);font-size:.9rem;}
  .news-list{display:grid;gap:18px;}
  .news-item{
    background:#fff;border-radius:var(--radius);padding:24px 26px;
    border:1px solid var(--line);transition:.28s;
  }
  .news-item:hover{border-color:rgba(56,189,248,.55);box-shadow:0 16px 34px rgba(56,189,248,.14);}
  .news-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px;}
  .news-date{
    font-size:.8rem;color:#0369a1;background:rgba(56,189,248,.12);
    padding:3px 12px;border-radius:999px;font-weight:700;
  }
  .news-item h3{margin:0 0 8px;font-size:1.06rem;color:#0f172a;}
  .news-item p{margin:0;color:#475569;font-size:.92rem;}
  .rec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
  .rec-card{
    background:#fff;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
    transition:.28s;
  }
  .rec-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(244,114,182,.16);}
  .rec-card img{height:150px;width:100%;object-fit:cover;}
  .rec-body{padding:18px 20px;}
  .rec-body h3{margin:0 0 6px;font-size:1rem;color:#0f172a;}
  .rec-body p{margin:0;font-size:.88rem;color:var(--muted);}
  .gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;}
  .gallery-grid figure{
    margin:0;border-radius:var(--radius);overflow:hidden;background:#fff;
    border:1px solid var(--line);
  }
  .gallery-grid img{height:180px;width:100%;object-fit:cover;transition:.4s;}
  .gallery-grid figure:hover img{transform:scale(1.06);}
  .gallery-grid figcaption{padding:12px 16px;font-size:.86rem;color:var(--muted);}
  .faq-list{display:grid;gap:14px;}
  details.faq-item{
    background:#fff;border-radius:16px;border:1px solid var(--line);
    padding:18px 22px;transition:.25s;
  }
  details.faq-item[open]{border-color:rgba(244,114,182,.55);box-shadow:0 14px 30px rgba(244,114,182,.13);}
  details.faq-item summary{
    cursor:pointer;font-weight:700;color:#0f172a;font-size:.98rem;list-style:none;
    display:flex;justify-content:space-between;gap:14px;align-items:flex-start;
  }
  details.faq-item summary::-webkit-details-marker{display:none;}
  details.faq-item summary::after{
    content:"＋";color:var(--sky);font-weight:800;flex-shrink:0;
  }
  details.faq-item[open] summary::after{content:"－";color:var(--pink);}
  details.faq-item p{margin:12px 0 0;color:#475569;font-size:.92rem;}
  .cta-band{
    background:linear-gradient(135deg,rgba(244,114,182,.14),rgba(56,189,248,.18));
    border-radius:26px;padding:44px 34px;text-align:center;border:1px solid rgba(56,189,248,.3);
  }
  .cta-band h2{margin:0 0 12px;font-size:clamp(1.25rem,2.4vw,1.7rem);color:#0f172a;}
  .cta-band p{margin:0 auto 24px;color:#475569;max-width:720px;font-size:.95rem;}
  footer.site-footer{
    background:#0f172a;color:#cbd5e1;padding:48px 0 24px;margin-top:20px;
  }
  footer.site-footer h4{margin:0 0 14px;color:#fff;font-size:1rem;}
  .footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px;}
  .footer-grid p{margin:0 0 8px;font-size:.88rem;color:#94a3b8;}
  .footer-grid a{color:#7dd3fc;}
  .footer-grid a:hover{color:#f472b6;}
  .footer-bottom{
    margin-top:32px;padding-top:20px;border-top:1px solid rgba(148,163,184,.24);
    text-align:center;font-size:.84rem;color:#94a3b8;
  }
  @media (max-width:820px){
    .hero-inner{grid-template-columns:1fr;}
    .hero{padding:40px 0 34px;}
    section{padding:42px 0;}
  }