/* 小圈-互动交友平台app 落地页样式（暖粉主题，适配百度移动优先） */
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;background:linear-gradient(160deg,#831843 0%,#ec4899 45%,#f9a8d4 100%);background-attachment:fixed;color:#1e293b;min-height:100vh;line-height:1.6;padding:14px 16px 30px}

.wrapper{max-width:520px;margin:0 auto}

/* bar */
.bar{padding:4px 0 14px;font-size:.78rem;color:rgba(255,255,255,.65)}
.bar__arrow{margin:0 6px;color:rgba(255,255,255,.4)}
.bar__step--now{color:rgba(255,255,255,.9);font-weight:500}

/* header */
.hd{text-align:center;padding:24px 20px 6px;margin-bottom:14px}
.hd__ico{width:72px;height:72px;border-radius:18px;object-fit:cover;margin-bottom:12px;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.hd h1{font-size:1.8rem;font-weight:700;color:#fff;line-height:1.2;margin-bottom:4px}
.hd__tag{font-size:.88rem;color:rgba(255,255,255,.85)}

/* feature masonry */
.feat-masonry{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.feat-tile{background:rgba(255,255,255,.92);border-radius:14px;padding:16px 14px;box-shadow:0 3px 16px rgba(0,0,0,.08)}
.feat-tile--lg{grid-column:span 2}
.feat-tile__icon{font-size:1.6rem;display:block;margin-bottom:6px}
.feat-tile h3{font-size:.85rem;color:#db2777;margin-bottom:4px}
.feat-tile p{font-size:.74rem;color:#64748b;line-height:1.65}

/* cta row */
.cta-row{text-align:center;margin-bottom:16px}
.cta-btn{display:block;padding:15px 30px;background:linear-gradient(135deg,#ec4899,#f472b6);color:#fff;border-radius:14px;text-decoration:none;font-size:1rem;font-weight:600;margin-bottom:10px;transition:transform .2s,box-shadow .25s;box-shadow:0 4px 20px rgba(236,72,153,.45)}
.cta-btn:hover{transform:translateY(-3px)}
.cta-link{color:rgba(255,255,255,.9);text-decoration:none;font-size:.84rem;font-weight:500}

/* expand block */
.expand-block{background:#fff;border-radius:16px;padding:20px;margin-bottom:14px;box-shadow:0 4px 24px rgba(0,0,0,.08)}
.expand-title{font-size:1.05rem;color:#1e293b;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid #ec4899;display:inline-block}

/* expand item as details */
.expand-item{border:1px solid #e5e7eb;border-radius:10px;margin-bottom:8px;overflow:hidden}
.expand-item:last-child{margin-bottom:0}
.expand-head{padding:14px 16px;font-size:.88rem;font-weight:600;color:#1e293b;cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none;transition:background .2s;list-style:none}
.expand-head::-webkit-details-marker{display:none}
.expand-head:hover{background:#fdf2f8}
.expand-arrow{font-size:.7rem;color:#ec4899;transition:transform .25s}
.expand-item[open] .expand-arrow{transform:rotate(180deg)}
.expand-body{font-size:.8rem;color:#64748b;line-height:1.85;padding:0 16px 14px}

/* foot */
.foot{text-align:center;padding:10px 0;color:rgba(255,255,255,.55);font-size:.73rem}
.foot a{color:rgba(255,255,255,.7);text-decoration:none}
.foot p{margin-bottom:3px}

@media(max-width:380px){
    .feat-masonry{grid-template-columns:1fr}
    .feat-tile--lg{grid-column:span 1}
    .hd h1{font-size:1.4rem}
}
@media(min-width:768px){
    body{padding:30px}
    .feat-masonry{grid-template-columns:repeat(3,1fr)}
}