3 changed files with 162 additions and 22 deletions
--- a/frontend/public/ai-soccer-prediction.html
+++ b/frontend/public/ai-soccer-prediction.html
@ -0,0 +1,152 @@
+<!DOCTYPE html>
+<html lang="ko">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>AI 축구 승부예측 — GPT·Claude·Gemini의 선택은? | TriplePick</title>
+  <meta name="description" content="ChatGPT, Claude, Gemini 3개 AI가 2026 월드컵 경기 결과를 예측합니다. AI 예측 근거 공개, 실시간 군중 픽 비율 확인. 내 예측으로 AI를 이겨보세요." />
+  <meta name="keywords" content="AI 축구 예측, ChatGPT 축구, AI 승부예측, 인공지능 축구 분석, Gemini 월드컵, Claude 축구, AI 스포츠 예측, 축구 AI, GPT 월드컵 예측, 2026 월드컵 AI" />
+  <link rel="canonical" href="https://triplepick.o2o.kr/ai-soccer-prediction" />
+  <meta property="og:title" content="AI 축구 승부예측 — GPT·Claude·Gemini | TriplePick" />
+  <meta property="og:description" content="3개의 AI가 월드컵을 예측합니다. AI를 이기면 100만원." />
+  <meta property="og:url" content="https://triplepick.o2o.kr/ai-soccer-prediction" />
+  <meta property="og:type" content="website" />
+  <style>
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+    body {
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+      background: #0a0a0f;
+      color: #e8e8e8;
+      min-height: 100vh;
+    }
+    .wrap { max-width: 680px; margin: 0 auto; padding: 48px 20px 64px; }
+    .badge {
+      display: inline-block;
+      background: #00ff8822;
+      border: 1px solid #00ff8855;
+      color: #00ff88;
+      font-size: 13px;
+      font-weight: 700;
+      padding: 4px 14px;
+      border-radius: 999px;
+      margin-bottom: 20px;
+    }
+    h1 {
+      font-size: clamp(26px, 6vw, 38px);
+      font-weight: 900;
+      line-height: 1.2;
+      margin-bottom: 16px;
+    }
+    h1 span { color: #00ff88; }
+    .lead {
+      font-size: 16px;
+      line-height: 1.7;
+      color: #b0b0c0;
+      margin-bottom: 36px;
+    }
+    .ai-list { margin-bottom: 36px; display: flex; flex-direction: column; gap: 12px; }
+    .ai-row {
+      background: #13131e;
+      border: 1px solid #ffffff14;
+      border-radius: 14px;
+      padding: 18px 20px;
+      display: flex;
+      align-items: center;
+      gap: 16px;
+    }
+    .ai-name { font-size: 16px; font-weight: 800; min-width: 80px; }
+    .ai-name.gpt { color: #10a37f; }
+    .ai-name.claude { color: #cc785c; }
+    .ai-name.gemini { color: #4285f4; }
+    .ai-desc { font-size: 13px; color: #8888a0; line-height: 1.5; }
+    h2 { font-size: 20px; font-weight: 800; margin-bottom: 16px; }
+    .step-list { counter-reset: step; display: flex; flex-direction: column; gap: 14px; margin-bottom: 36px; }
+    .step {
+      background: #13131e;
+      border: 1px solid #ffffff14;
+      border-radius: 14px;
+      padding: 16px 20px 16px 56px;
+      position: relative;
+      font-size: 14px;
+      line-height: 1.6;
+      color: #c0c0d0;
+    }
+    .step::before {
+      counter-increment: step;
+      content: counter(step);
+      position: absolute;
+      left: 18px;
+      top: 16px;
+      width: 24px;
+      height: 24px;
+      background: #00ff8820;
+      border: 1px solid #00ff8840;
+      color: #00ff88;
+      font-size: 12px;
+      font-weight: 900;
+      border-radius: 50%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      line-height: 24px;
+      text-align: center;
+    }
+    .step strong { color: #ffffff; }
+    .cta {
+      display: block;
+      text-align: center;
+      background: #00ff88;
+      color: #000;
+      font-size: 17px;
+      font-weight: 900;
+      padding: 16px 32px;
+      border-radius: 14px;
+      text-decoration: none;
+      margin-top: 40px;
+      transition: opacity .15s;
+    }
+    .cta:hover { opacity: .85; }
+    footer { margin-top: 48px; text-align: center; font-size: 12px; color: #44445a; }
+    footer a { color: #44445a; }
+  </style>
+</head>
+<body>
+  <div class="wrap">
+    <div class="badge">AI vs 인간 대결</div>
+    <h1><span>GPT · Claude · Gemini</span><br />3개의 AI가 월드컵을 예측한다면?</h1>
+    <p class="lead">
+      세계 최고 수준의 AI 3종이 2026 FIFA 월드컵 경기 결과를 예측합니다.<br />
+      AI들의 예측 근거까지 공개되며, 당신이 직접 AI를 이길 수 있습니다.
+    </p>
+
+    <div class="ai-list">
+      <div class="ai-row">
+        <div class="ai-name gpt">GPT</div>
+        <div class="ai-desc">OpenAI의 GPT 모델. 방대한 축구 통계와 역대 경기 데이터를 기반으로 예측.</div>
+      </div>
+      <div class="ai-row">
+        <div class="ai-name claude">Claude</div>
+        <div class="ai-desc">Anthropic의 Claude. 팀 컨디션, 전술 분석, 최근 폼을 종합해 예측.</div>
+      </div>
+      <div class="ai-row">
+        <div class="ai-name gemini">Gemini</div>
+        <div class="ai-desc">Google의 Gemini. 최신 뉴스와 실시간 정보까지 반영한 예측.</div>
+      </div>
+    </div>
+
+    <h2>어떻게 참여하나요?</h2>
+    <div class="step-list">
+      <div class="step">사이트에 접속해 <strong>이메일로 참여 등록</strong>합니다. 완전 무료.</div>
+      <div class="step">경기 킥오프 5일 전부터 투표 가능. <strong>홈팀 승·무·원정팀 승</strong> 중 하나를 선택.</div>
+      <div class="step">킥오프 직전에 <strong>AI 3개의 예측</strong>과 전체 참여자 픽 비율이 공개됩니다.</div>
+      <div class="step">경기 종료 후 결과 확인. AI보다 더 많이 맞히면 <strong>100만원 상금</strong> 도전!</div>
+    </div>
+
+    <a class="cta" href="https://triplepick.o2o.kr/">AI 예측 보러 가기 →</a>
+
+    <footer>
+      <p><a href="https://triplepick.o2o.kr/">TriplePick 2026</a> &nbsp;|&nbsp; AI Prediction Arena</p>
+    </footer>
+  </div>
+</body>
+</html>
--- a/frontend/public/sitemap.xml
+++ b/frontend/public/sitemap.xml
@ -15,4 +15,9 @@
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
+  <url>
+    <loc>https://triplepick.o2o.kr/ai-soccer-prediction.html</loc>
+    <changefreq>weekly</changefreq>
+    <priority>0.7</priority>
+  </url>
 </urlset>
--- a/frontend/public/worldcup-prediction.html
+++ b/frontend/public/worldcup-prediction.html
@ -3,16 +3,16 @@
 <head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>2026 월드컵 승부예측 — AI vs 나의 픽, 100만원 상금 | TriplePick(트리플픽)</title>
+  <title>2026 월드컵 승부예측 — AI vs 나의 픽, 100만원 상금 | TriplePick</title>
  <meta name="description" content="2026 FIFA 월드컵 승부예측을 GPT·Claude·Gemini AI와 함께! AI의 예측과 내 픽을 비교하고, 정답을 맞히면 100만원 상금. 무료 참여, 실시간 결과 확인. 한국 vs 체코, 한국 vs 멕시코 경기 예측 가능." />
-  <meta name="keywords" content="2026 월드컵 승부예측, 월드컵 예측, AI 축구 예측, FIFA 월드컵 2026, 월드컵 픽, 한국 월드컵, 축구 승부예측, 월드컵 결과 예측, 트리플픽, 한국 체코, 한국 멕시코, 월드컵 무료 이벤트, 월드컵 상금, 인공지능 축구, 2026 FIFA, 월드컵 그룹A, 한국 16강, 월드컵 투표, 메시 월드컵, 호날두 월드컵, 메시 2026, 호날두 2026, 음바페 월드컵, 손흥민 월드컵, 스타 선수 출전" />
+  <meta name="keywords" content="2026 월드컵 승부예측, 월드컵 예측, AI 축구 예측, FIFA 월드컵 2026, 월드컵 픽, 한국 월드컵, 축구 승부예측, 월드컵 결과 예측, 트리플픽, 한국 체코, 한국 멕시코, 월드컵 무료 이벤트, 월드컵 상금, 인공지능 축구, 2026 FIFA, 월드컵 그룹A, 한국 16강, 월드컵 투표" />
  <link rel="canonical" href="https://triplepick.o2o.kr/worldcup-prediction.html" />
-  <meta property="og:title" content="2026 월드컵 승부예측 | TriplePick(트리플픽) — AI vs 나의 픽" />
+  <meta property="og:title" content="2026 월드컵 승부예측 | TriplePick — AI vs 나의 픽" />
  <meta property="og:description" content="GPT·Claude·Gemini AI와 승부예측 대결! 한국 경기 결과를 맞히면 100만원. 무료 참여." />
  <meta property="og:url" content="https://triplepick.o2o.kr/worldcup-prediction.html" />
  <meta property="og:type" content="website" />
  <meta name="twitter:card" content="summary_large_image" />
-  <meta name="twitter:title" content="2026 월드컵 승부예측 | TriplePick(트리플픽)" />
+  <meta name="twitter:title" content="2026 월드컵 승부예측 | TriplePick" />
  <meta name="twitter:description" content="AI 3종과 승부예측 대결. 정답 맞히면 100만원. 무료 참여." />
  <script type="application/ld+json">
  {
@ -302,15 +302,6 @@
        한국의 16강 가능성을 AI는 어떻게 예측할까요?
      </p>

-      <div class="highlight-box">
-        <p>
-          🌟 <strong>레전드들의 마지막 무대 — 메시·호날두·음바페 출전!</strong><br />
-          리오넬 메시(아르헨티나)와 크리스티아누 호날두(포르투갈)가 함께하는 마지막 월드컵이 될 수 있습니다.
-          킬리안 음바페(프랑스), 엘링 홀란드(노르웨이), 손흥민(한국) 등 세계 최정상 스타들이
-          총출동하는 역대급 대회. AI는 이 슈퍼스타들의 활약을 어떻게 예측할까요?
-        </p>
-      </div>
-
      <div class="highlight-box">
        <p>
          💡 <strong>AI 3종이 모두 한국 패를 예측한다면?</strong><br />
@ -343,10 +334,6 @@
        <p class="faq-q">예측 변경이 가능한가요?</p>
        <p class="faq-a">킥오프 5분 전 마감 전까지는 예측을 자유롭게 변경할 수 있습니다. 마감 이후에는 변경이 불가합니다.</p>
      </div>
-      <div class="faq-item">
-        <p class="faq-q">메시·호날두 같은 스타 선수가 출전하는 경기도 예측할 수 있나요?</p>
-        <p class="faq-a">TriplePick은 2026 월드컵 그룹 A 전 경기를 대상으로 합니다. 메시(아르헨티나), 호날두(포르투갈), 음바페(프랑스) 등 레전드 선수들이 출전하는 경기는 그룹 A 외 경기이지만, AI 예측 근거 코멘트에서 이 선수들의 영향력 분석을 확인할 수 있습니다. 향후 서비스 확장 시 더 많은 경기를 포함할 예정입니다.</p>
-      </div>
      <div class="faq-item">
        <p class="faq-q">모바일에서도 사용할 수 있나요?</p>
        <p class="faq-a">모바일 최적화 서비스입니다. 스마트폰 브라우저에서 바로 참여 가능하며, 별도 앱 설치가 필요 없습니다.</p>
@ -367,17 +354,13 @@
      <span class="tag">한국 16강</span>
      <span class="tag">월드컵 상금</span>
      <span class="tag">그룹A</span>
-      <span class="tag">메시 2026</span>
-      <span class="tag">호날두 2026</span>
-      <span class="tag">음바페</span>
-      <span class="tag">손흥민 월드컵</span>
-      <span class="tag">스타 선수 출전</span>
    </div>

    <a class="cta" href="https://triplepick.o2o.kr/">지금 무료로 예측하러 가기 →</a>

    <footer>
      <p><a href="https://triplepick.o2o.kr/">TriplePick 2026</a> &nbsp;|&nbsp; AI Prediction Arena</p>
+      <p style="margin-top:8px"><a href="https://triplepick.o2o.kr/ai-soccer-prediction.html">AI 축구 예측이란?</a> &nbsp;|&nbsp; <a href="https://triplepick.o2o.kr/leaderboard">리더보드</a></p>
    </footer>
  </div>
 </body>