inou/portal/templates/landing_ko.tmpl

122 lines
11 KiB
Cheetah

{{define "landing_ko"}}
<style>
.landing-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 48px; width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 24px; }
.hero-answer { text-align: center; font-size: 1.25rem; font-weight: 400; color: var(--text); line-height: 1.8; margin-top: 16px; margin-bottom: 32px; }
.hero-answer .inou { font-weight: 700; color: var(--accent); }
.hero-tagline { text-align: center; font-size: 1.3rem; font-weight: 600; color: var(--text); margin-bottom: 32px; }
.hero-cta { margin-bottom: 0; text-align: center; }
.hero-cta .btn { padding: 18px 56px; font-size: 0.9rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; border-radius: 4px; }
.story-prose.warm { font-size: 1.1rem; line-height: 1.8; color: var(--text); }
.story-prose.warm p { margin-bottom: 20px; }
.story-prose.warm .emphasis { font-weight: 600; font-size: 1.15rem; }
.story-title { font-size: 1.25rem; font-weight: 600; color: var(--text); margin-bottom: 32px; }
.story-pair { margin-bottom: 32px; }
.story-pair .data { font-size: 1.1rem; font-weight: 400; color: var(--text); margin-bottom: 4px; }
.story-pair .reality { font-size: 1rem; font-weight: 300; font-style: italic; color: var(--text-muted); }
.story-transition { font-size: 1.25rem; font-weight: 400; color: var(--text); line-height: 1.8; margin: 32px 0; padding: 24px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.story-gaps { font-size: 1rem; font-weight: 300; color: var(--text-muted); line-height: 1.8; margin-bottom: 32px; }
.story-gaps span { display: block; }
.story-gaps .indent { font-style: italic; }
.story-connections { font-size: 1rem; font-weight: 300; color: var(--text-muted); line-height: 1.8; margin-bottom: 32px; }
.story-connections span { display: block; }
.story-ai { font-size: 1.25rem; font-weight: 400; color: var(--text); line-height: 1.8; margin-bottom: 32px; }
.story-ai span { display: block; }
.story-ai .last { font-style: italic; }
.story-prose { font-size: 1rem; font-weight: 300; color: var(--text-muted); line-height: 1.8; margin-bottom: 20px; }
.story-prose:last-of-type { margin-bottom: 32px; }
.story-prose strong { font-weight: 600; color: var(--text); }
.story-prose .inou { font-weight: 700; color: var(--accent); }
.story-closing { font-size: 1.25rem; font-weight: 400; color: var(--text); padding-top: 24px; border-top: 1px solid var(--border); }
.story-closing .inou { font-weight: 700; color: var(--accent); }
.trust-card { width: 100%; margin-left: auto; margin-right: auto; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 32px 48px; margin-bottom: 24px; }
.trust-card .section-label { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 24px; }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.trust-item { font-size: 0.9rem; font-weight: 300; color: var(--text-muted); line-height: 1.6; }
.trust-item strong { display: block; font-weight: 600; color: var(--text); margin-bottom: 4px; }
.landing-footer { padding: 16px 0; border-top: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.landing-footer-left { font-size: 0.9rem; color: var(--text-muted); display: flex; gap: 16px; align-items: center; }
.landing-footer-left a { color: var(--text-muted); text-decoration: none; }
.landing-footer-left a:hover { color: var(--accent); }
.landing-footer-right { font-size: 1rem; }
.landing-footer-right .inou { font-weight: 700; color: var(--accent); }
.landing-footer-right .health { font-weight: 400; color: var(--text-muted); }
@media (max-width: 768px) { .trust-card { padding: 24px; } .trust-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (max-width: 480px) { .trust-card { padding: 20px 16px; } .trust-grid { grid-template-columns: 1fr; gap: 20px; } .landing-footer { flex-direction: column; gap: 12px; text-align: center; } .landing-footer-left { flex-direction: column; gap: 8px; } }
</style>
<div class="sg-container">
<div class="landing-card">
<div class="hero">
<div class="hero-answer"><span class="inou">inou</span>는 당신의 건강 기록을 정리하고 AI와 안전하고 비공개로 공유합니다.</div>
<div class="hero-tagline">당신의 건강, 이해되다.</div>
<div class="hero-cta">{{if .Dossier}}<a href="/invite" class="btn btn-primary">친구 초대</a>{{else}}<a href="/start" class="btn btn-primary">로그인</a>{{end}}{{if .Error}}<div class="error" style="margin-top: 24px;">{{.Error}}</div>{{end}}</div>
</div>
</div>
<div class="landing-card">
<div class="story">
<h2 class="story-title">건강을 위해 AI가 필요한 이유</h2>
<div class="story-prose warm">
<p>당신의 건강 데이터는 수십 곳에 흩어져 있습니다 — 심장내과, 신경과, 검사실, 스마트워치, 앱, 23andMe. 그리고 나머지는 당신만 알고 있습니다: 무엇을 먹고, 무엇을 마시고, 어떤 보충제를 복용하는지. 운동 루틴. 증상. 목표 — 임신을 원하든, 마라톤 훈련 중이든, 단순히 덜 피곤해지고 싶든.</p>
<p>건강하고 그 상태를 유지하고 싶든, 어려운 진단을 받았든, 스스로를 대변할 수 없는 가족을 돌보든 — 어떤 의사도 전체 그림을 보지 못합니다. 모든 것을 연결하는 시스템은 없습니다.</p>
<p>하지만 당신은 모든 것에 접근할 수 있습니다. 부족한 것은 이해하는 전문 지식뿐입니다.</p>
<p class="emphasis">당신의 AI는 그것을 가지고 있습니다. inou는 전체 그림을 제공합니다.</p>
</div>
</div>
</div>
<div class="landing-card">
<div class="story">
<h2 class="story-title">도전</h2>
<div class="story-pair"><div class="data">당신의 MRI에는 4,000개의 슬라이스가 있습니다.</div><div class="reality">10분 만에 판독되었습니다.</div></div>
<div class="story-pair"><div class="data">당신의 게놈에는 수백만 개의 변이가 있습니다.</div><div class="reality">알게 된 것은 눈 색깔과 조상의 출신지뿐이었습니다.</div></div>
<div class="story-pair"><div class="data">당신의 혈액 검사에는 수십 개의 마커가 있습니다.</div><div class="reality">의사는 "다 괜찮아 보입니다"라고 했습니다.</div></div>
<div class="story-pair"><div class="data">당신의 시계는 10,000시간의 수면을 기록했습니다.</div><div class="reality">트레이너는 그 존재를 모릅니다.</div></div>
<div class="story-pair"><div class="data">당신은 백 가지 다른 보충제를 시도했습니다.</div><div class="reality">아무도 어떤 것인지 묻지 않았습니다.</div></div>
<div class="story-transition">연결고리는 거기 있습니다.<br>한 사람이 다루기엔 너무 복잡할 뿐입니다.</div>
<div class="story-gaps">
<span>당신의 몸이 와파린을 어떻게 처리하는지 아무도 모릅니다 — 당신 자신도.</span>
<span class="indent">하지만 답은 23andMe에 숨겨져 있을 수 있습니다.</span>
<span>MRI의 그 "이상 없음" — 누군가 정말로 4,000개 슬라이스를 모두 주의 깊게 봤을까요?</span>
<span>갑상선은 "정상 범위" — 하지만 아무도 그것을 피로, 체중, 항상 추운 것과 연결하지 않았습니다.</span>
</div>
<div class="story-connections">
<span>아무도 오후 커피와 수면의 질을 연결하지 않습니다.</span>
<span>철분 수치와 운동 시 피로를.</span>
<span>유전자와 브레인 포그를.</span>
</div>
<div class="story-ai">
<span>당신의 AI는 잊지 않습니다.</span>
<span>서두르지 않습니다.</span>
<span>놓친 것을 찾습니다.</span>
<span class="last">전문화되지 않습니다 — 당신을 전체로 봅니다.</span>
</div>
<div class="story-closing"><span class="inou">inou</span>는 당신의 AI가 모든 것을 고려하게 합니다 — 모든 슬라이스, 모든 마커, 모든 변이 — 모든 것을 연결하고 마침내 다른 누구도 줄 수 없었던 답을 제공합니다.</div>
</div>
</div>
<div class="landing-card">
<div class="story">
<h2 class="story-title">우리가 이것을 만든 이유</h2>
<p class="story-prose">당신은 수년간의 건강 데이터를 수집해 왔습니다. 병원 검사. 검사실 결과. 환자 포털의 기록. 시계의 데이터. 어쩌면 DNA까지.</p>
<p class="story-prose">그리고 당신만 아는 것들이 있습니다 — 체중, 혈압, 운동 프로그램, 복용하는 보충제, 항상 말하기를 잊는 증상들.</p>
<p class="story-prose">모든 것이 거기 있습니다 — 하지만 서로 소통하지 않는 시스템들, 자기 분야만 보는 전문의들, 또는 당신 머릿속에 갇혀 있습니다.</p>
<p class="story-prose">심장내과 의사는 신경과 의사가 무엇을 발견했는지 모릅니다. 트레이너는 혈액 검사를 보지 못했습니다. 주치의는 어떤 보충제를 복용하는지 모릅니다. 그리고 그들 중 누구도 당신과 함께 앉아서 점들을 연결할 시간이 없습니다.</p>
<p class="story-prose"><strong>AI는 마침내 할 수 있습니다.</strong> 어떤 전문가 혼자서도 볼 수 없는 것을 모으고 — 게다가 설명해 줍니다.</p>
<p class="story-prose">하지만 이 데이터는 채팅 창에 들어가지 않습니다. 그리고 가장 원하지 않는 것은 당신의 의료 기록이 다른 사람의 서버에서 그들의 모델을 훈련시키는 것입니다.</p>
<p class="story-prose"><span class="inou">inou</span>는 모든 것을 모읍니다 — 검사, 영상, 유전자, 활력징후, 약물, 보충제 — 암호화되고, 비공개이며, 누구와도 공유되지 않습니다. 당신의 AI는 안전하게 연결됩니다. 데이터는 당신의 것입니다.</p>
<div class="story-closing">당신의 건강, 이해되다.</div>
</div>
</div>
<div class="trust-card">
<div class="section-label">{{.T.data_yours}}</div>
<div class="trust-grid">
<div class="trust-item"><strong>{{.T.never_training}}</strong>{{.T.never_training_desc}}</div>
<div class="trust-item"><strong>{{.T.never_shared}}</strong>{{.T.never_shared_desc}}</div>
<div class="trust-item"><strong>{{.T.encrypted}}</strong>{{.T.encrypted_desc}}</div>
<div class="trust-item"><strong>{{.T.delete}}</strong>{{.T.delete_desc}}</div>
</div>
</div>
<footer class="landing-footer">
<div class="landing-footer-left"><span>© 2025</span><a href="/privacy-policy">개인정보</a></div>
<span class="landing-footer-right"><span class="inou">inou</span> <span class="health">health</span></span>
</footer>
</div>
{{end}}