<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="template:media-width" content="1024">
    <meta name="template:media-height" content="1024">
    <meta name="viewport" content="width=1080, height=1080">
    <title>极简边框风格 - 1080x1080</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }

        html, body { width: 1080px; height: 1080px; overflow: hidden; }

        body {
            font-family: 'PingFang SC', 'Source Han Sans', 'Microsoft YaHei', -apple-system, BlinkMacSystemFont, sans-serif;
            background: #fafafa;
            color: #1a1a1a;
            display: flex;
            flex-direction: column;
            padding: 100px 80px;
        }

        /* 顶部标题 - 极简风格 */
        .header {
            text-align: center;
            margin-bottom: 60px;
        }

        .title {
            font-size: 56px;
            font-weight: 300;
            line-height: 1.3;
            color: #2d3436;
            letter-spacing: 3px;
        }

        /* 图片区域 - 细边框，大留白 */
        .image-section {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 30px 0;
            min-height: 0;
        }

        .image-container {
            width: 100%;
            max-width: 720px;
            height: 100%;
            max-height: 100%;
            border: 2px solid #2d3436;
            background: #fff;
            padding: 8px;
            box-shadow: 0 4px 20px rgba(0,0,0,0.08);
        }

        .image-container img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
        }

        /* 底部文字 - 极简 */
        .footer {
            text-align: center;
            margin-top: 50px;
        }

        .text {
            font-size: 28px;
            font-weight: 300;
            line-height: 1.6;
            color: #636e72;
            letter-spacing: 1px;
            max-width: 700px;
            margin: 0 auto;
        }

        @media (max-width: 1080px) { 
            .title { font-size: 50px; } 
            .text { font-size: 26px; } 
        }
    </style>
</head>
<body>
    <div class="header">
        <div class="title">{{title}}</div>
    </div>

    <div class="image-section">
        <div class="image-container">
            <img src="{{image}}" alt="内容图片">
        </div>
    </div>

    <div class="footer">
        <div class="text">{{text}}</div>
    </div>
</body>
</html>
