```json
{
"summary

```json
{
"summary": "我将为您创建一个校园生活页面的section，包含左右布局。左边是带背景图片和渐变的卡片，右边是两个并列的内容卡片。",
"widget": {
"type": "custom-template",
"isAPI": false,
"fullWidth": true,
"html": "<div class=\"container mx-auto px-4 py-12\">\n <div class=\"flex flex-col md:flex-row gap-8\">\n <!-- 左侧卡片 -->\n <div class=\"md:w-1/2\">\n <div class=\"relative h-full rounded-xl overflow-hidden\">\n <img src=\"/assets/images/16-9/business-01.jpg\" alt=\"校园活动\" class=\"w-full h-full object-cover\">\n <div class=\"absolute inset-x-0 bottom-0 bg-gradient-to-t from-black to-transparent p-6 pt-16\">\n <h3 class=\"text-2xl font-bold text-white mb-2\">校园精彩活动</h3>\n <p class=\"text-gray-200 mb-4\">参与丰富多彩的校园活动，体验大学生活的无限可能...</p>\n <a href=\"#\" class=\"inline-block px-4 py-2 bg-white text-black rounded-md hover:bg-gray-100 transition-colors\">阅读更多</a>\n </div>\n </div>\n </div>\n \n <!-- 右侧双卡片 -->\n <div class=\"md:w-1/2 flex flex-col gap-6\">\n <div class=\"flex-1 bg-white rounded-xl overflow-hidden shadow-md\">\n <img src=\"/assets/images/showcase/1.jpg\" alt=\"学术讲座\" class=\"w-full h-48 object-cover\">\n <div class=\"p-6\">\n <h4 class=\"text-xl font-bold mb-3\">学术讲座系列</h4>\n <p class=\"text-gray-600 line-clamp-3 mb-4\">每周邀请知名学者举办专题讲座，拓宽你的学术视野，激发创新思维...</p>\n <a href=\"#\" class=\"text-blue-600 hover:text-blue-800 font-medium\">阅读更多 →</a>\n </div>\n </div>\n \n <div class=\"flex-1 bg-white rounded-xl overflow-hidden shadow-md\">\n <img src=\"/assets/images/showcase/2.jpg\" alt=\"社团活动\" class=\"w-full h-48 object-cover\">\n <div class=\"p-6\">\n <h4 class=\"text-xl font-bold mb-3\">社团招新季</h4>\n <p class=\"text-gray-600 line-clamp-3 mb-4\">从艺术到体育，从学术到公益，上百个社团等你加入，找到志同道合的伙伴...</p>\n <a href=\"#\" class=\"text-blue-600 hover:text-blue-800 font-medium\">阅读更多 →</a>\n </div>\n </div>\n </div>\n </div>\n</div>"
},
"next": [
"添加悬停动画",
"优化移动布局",
"增加卡片间距",
"统一按钮样式",
"添加加载动画"
]
}
```