| 1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720"> |
| 2 | <!-- P08 Chapter 3 WHERE & WHEN · breathing · hero_page with ch3_where.png --> |
| 3 | |
| 4 | <g id="bg-image"> |
| 5 | <image href="../images/ch3_where.png" x="0" y="0" width="1280" height="720" preserveAspectRatio="xMidYMid slice"/> |
| 6 | </g> |
| 7 | |
| 8 | <!-- Chapter tag --> |
| 9 | <g id="chapter-tag"> |
| 10 | <rect x="60" y="50" width="180" height="48" fill="#1A1A2E"/> |
| 11 | <rect x="60" y="50" width="14" height="48" fill="#00C896"/> |
| 12 | <text x="92" y="83" font-family="Impact, "Arial Black", sans-serif" font-size="22" font-weight="900" fill="#FFF8EE" letter-spacing="6">CH · 03</text> |
| 13 | </g> |
| 14 | |
| 15 | <!-- Hero chapter title --> |
| 16 | <g id="chapter-title"> |
| 17 | <text x="640" y="220" text-anchor="middle" font-family="Impact, "Arial Black", sans-serif" font-size="160" font-weight="900" fill="#1A1A2E" letter-spacing="-2">WHERE.</text> |
| 18 | <rect x="400" y="240" width="480" height="14" fill="#00C896"/> |
| 19 | </g> |
| 20 | |
| 21 | <!-- Subtitle band --> |
| 22 | <g id="subtitle-band"> |
| 23 | <rect x="160" y="290" width="960" height="80" rx="12" fill="#FFF8EE" stroke="#1A1A2E" stroke-width="4"/> |
| 24 | <text x="640" y="342" text-anchor="middle" font-family="Arial, "Microsoft YaHei", sans-serif" font-size="26" font-weight="700" fill="#1A1A2E">椰岛大草原 · <tspan fill="#00C896" font-weight="900">一座为夏天造的城市</tspan></text> |
| 25 | </g> |
| 26 | |
| 27 | <!-- Module tags (#41 measurement lines + module tags style) --> |
| 28 | <g id="tag-venue"> |
| 29 | <rect x="60" y="430" width="240" height="78" rx="12" fill="#FFF8EE" stroke="#1A1A2E" stroke-width="4"/> |
| 30 | <rect x="60" y="430" width="14" height="78" fill="#FF3DA5"/> |
| 31 | <use data-icon="chunk-filled/map-pin" x="86" y="446" width="28" height="28" fill="#FF3DA5"/> |
| 32 | <text x="122" y="467" font-family="Impact, sans-serif" font-size="14" font-weight="900" fill="#1A1A2E" letter-spacing="2">VENUE · 场地</text> |
| 33 | <text x="86" y="494" font-family="Arial, "Microsoft YaHei", sans-serif" font-size="14" font-weight="700" fill="#1A1A2E">椰岛大草原 · CocoBay</text> |
| 34 | </g> |
| 35 | <g id="tag-area"> |
| 36 | <rect x="315" y="430" width="240" height="78" rx="12" fill="#FFF8EE" stroke="#1A1A2E" stroke-width="4"/> |
| 37 | <rect x="315" y="430" width="14" height="78" fill="#00B8D9"/> |
| 38 | <use data-icon="chunk-filled/sparkles" x="341" y="446" width="28" height="28" fill="#00B8D9"/> |
| 39 | <text x="377" y="467" font-family="Impact, sans-serif" font-size="14" font-weight="900" fill="#1A1A2E" letter-spacing="2">AREA · 占地</text> |
| 40 | <text x="341" y="494" font-family="Arial, "Microsoft YaHei", sans-serif" font-size="14" font-weight="700" fill="#1A1A2E">120 公顷 · 5 大舞台环抱</text> |
| 41 | </g> |
| 42 | <g id="tag-when"> |
| 43 | <rect x="570" y="430" width="240" height="78" rx="12" fill="#FFF8EE" stroke="#1A1A2E" stroke-width="4"/> |
| 44 | <rect x="570" y="430" width="14" height="78" fill="#FFD93D"/> |
| 45 | <use data-icon="chunk-filled/calendar" x="596" y="446" width="28" height="28" fill="#FFD93D"/> |
| 46 | <text x="632" y="467" font-family="Impact, sans-serif" font-size="14" font-weight="900" fill="#1A1A2E" letter-spacing="2">WHEN · 日期</text> |
| 47 | <text x="596" y="494" font-family="Arial, "Microsoft YaHei", sans-serif" font-size="14" font-weight="700" fill="#1A1A2E">2026.7.18 — 7.24 · 7 天</text> |
| 48 | </g> |
| 49 | <g id="tag-transit"> |
| 50 | <rect x="825" y="430" width="240" height="78" rx="12" fill="#FFF8EE" stroke="#1A1A2E" stroke-width="4"/> |
| 51 | <rect x="825" y="430" width="14" height="78" fill="#00C896"/> |
| 52 | <use data-icon="chunk-filled/arrow-right" x="851" y="446" width="28" height="28" fill="#00C896"/> |
| 53 | <text x="887" y="467" font-family="Impact, sans-serif" font-size="14" font-weight="900" fill="#1A1A2E" letter-spacing="2">ACCESS · 交通</text> |
| 54 | <text x="851" y="494" font-family="Arial, "Microsoft YaHei", sans-serif" font-size="14" font-weight="700" fill="#1A1A2E">机场 30 km · 高铁 15 min</text> |
| 55 | </g> |
| 56 | |
| 57 | <!-- Right side WHEN big dates --> |
| 58 | <g id="when-block"> |
| 59 | <rect x="1085" y="540" width="135" height="120" rx="12" fill="#1A1A2E"/> |
| 60 | <text x="1152" y="582" text-anchor="middle" font-family="Impact, sans-serif" font-size="42" font-weight="900" fill="#FFD93D" letter-spacing="-1">7.18</text> |
| 61 | <line x1="1100" y1="595" x2="1205" y2="595" stroke="#FFF8EE" stroke-width="2"/> |
| 62 | <text x="1152" y="630" text-anchor="middle" font-family="Impact, sans-serif" font-size="42" font-weight="900" fill="#FF3DA5" letter-spacing="-1">7.24</text> |
| 63 | </g> |
| 64 | |
| 65 | <!-- Decoration: zigzag in upper-right --> |
| 66 | <g id="decor-upper-right"> |
| 67 | <path d="M 1080 80 L 1110 60 L 1110 80 L 1140 60 L 1140 80 L 1170 60" stroke="#FF3DA5" stroke-width="4" fill="none" stroke-linecap="round"/> |
| 68 | <circle cx="1200" cy="100" r="10" fill="#FFD93D" stroke="#1A1A2E" stroke-width="3"/> |
| 69 | </g> |
| 70 | |
| 71 | <!-- Footer --> |
| 72 | <g id="footer"> |
| 73 | <text x="1220" y="700" text-anchor="end" font-family="Impact, sans-serif" font-size="14" font-weight="900" fill="#1A1A2E" letter-spacing="3">08 / 14 · SUGAR RUSH</text> |
| 74 | </g> |
| 75 | </svg> |
| 76 |