@font-face { font-family: Pretendard; src: url('/assets/v12/Pretendard-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family: Pretendard; src: url('/assets/v12/Pretendard-Bold.otf') format('opentype'); font-weight:700 900; font-display:swap; }
:root { color-scheme:light; --ink:#152065; --muted:#68739d; --paper:#f7f8ff; --point:#2c3df5; --acid:#d8ff45; --line:#cbd3f2; --page:min(1280px, calc(100% - 96px)); }
* { box-sizing:border-box; }
html { background:var(--paper); overflow-x:clip; scroll-behavior:smooth; scroll-padding-top:30px; overscroll-behavior-x:none; }
body { margin:0; color:var(--ink); font-family:Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif; line-height:1.6; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; text-underline-offset:5px; }
a, button { -webkit-tap-highlight-color:transparent; }
a:focus-visible, button:focus-visible { outline:3px solid #ff956b; outline-offset:5px; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { word-break:keep-all; }
button { font:inherit; }
[hidden] { display:none !important; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:12px; left:12px; z-index:100; padding:12px 20px; background:var(--acid); color:var(--ink); transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.site-header { display:flex; align-items:center; justify-content:space-between; width:var(--page); height:100px; margin:auto; color:white; position:relative; z-index:3; }
.brand { display:inline-flex; align-items:center; gap:12px; font-size:29px; font-weight:700; letter-spacing:-.06em; text-decoration:none; line-height:1; }
.brand img { width:42px; height:42px; border-radius:12px; }
.primary-navigation { display:flex; gap:32px; align-items:center; }
.primary-navigation a { text-decoration:none; font-size:14px; min-height:44px; display:inline-flex; align-items:center; }
.primary-navigation a:hover { color:var(--acid); }
.primary-navigation .nav-download { padding:9px 24px; background:var(--acid); color:var(--ink); border-radius:999px; font-weight:700; }
.hero-shell { background:var(--point); overflow:clip; }
.hero { position:relative; width:var(--page); margin:0 auto; display:grid; grid-template-columns:1.05fr 1fr; gap:34px; align-items:center; min-height:670px; padding:54px 0 98px; color:white; }
.eyebrow { font-size:11px; letter-spacing:.14em; font-weight:700; margin-bottom:24px; }
.hero .eyebrow { color:var(--acid); }
.hero h1 { font-size:clamp(52px,5.7vw,82px); line-height:1.18; letter-spacing:-.075em; margin:0 0 28px; font-weight:700; }
.hero h1 em { color:var(--acid); font-style:normal; }
.hero-lead { font-size:19px; line-height:1.7; margin-bottom:28px; letter-spacing:-.025em; }
.store-badge-links { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.store-badge-link { display:flex; align-items:center; justify-content:center; width:156px; height:52px; flex:0 0 156px; text-decoration:none; transition:transform 160ms; }
.store-badge-link:hover { transform:translateY(-3px); }
.store-badge-link img { max-width:none; }
.app-store-badge { height:44px; width:auto; }
.google-play-badge { width:169px; height:auto; }
.hero-visual { position:relative; min-width:0; display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:18px; padding:24px 0; }
.person { min-width:0; margin:0; }
.hero-visual .person:first-child { transform:rotate(-5deg); }
.hero-visual .person:nth-child(2) { padding-top:72px; transform:rotate(5deg); }
.person-quote { margin:0 0 14px; background:white; color:var(--ink); padding:16px 18px; border:2px solid var(--ink); border-radius:20px; font-size:15px; line-height:1.55; letter-spacing:-.03em; box-shadow:4px 5px 0 rgba(21,32,101,.2); }
.person-portrait { aspect-ratio:3/4; width:100%; object-fit:cover; border:5px solid #c3ccff; border-radius:30px; }
.person:nth-of-type(even) .person-portrait { border-color:var(--acid); }
.person-name { padding:10px 0 0; font-size:13px; display:flex; align-items:baseline; gap:10px; justify-content:center; }
.person-name span { opacity:.8; font-size:11px; }
.hero-note { position:absolute; right:2px; bottom:-25px; color:#dee2ff; font-size:10px; letter-spacing:.05em; }
.intro-band { background:var(--acid); color:var(--ink); padding:20px 24px; text-align:center; font-size:17px; letter-spacing:-.02em; }
.intro-band p { margin:0; }
.section { width:var(--page); margin:0 auto; padding:112px 0; }
.section h2,.download-section h2 { font-size:clamp(34px,3.9vw,56px); font-weight:700; line-height:1.23; letter-spacing:-.065em; margin:0; }
.section-heading { display:grid; grid-template-columns:1fr 1fr; gap:0 9%; align-items:end; }
.section-heading .eyebrow { grid-column:1/-1; color:var(--point); }
.section-heading > p:last-child { margin:0; color:var(--muted); font-size:17px; max-width:430px; word-break:keep-all; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin:62px 0 0; padding:0; list-style:none; }
.steps li { border-top:2px solid var(--point); padding-top:22px; }
.step-number { color:var(--point); font-size:13px; letter-spacing:.04em; }
.steps h3 { margin:30px 0 14px; font-size:23px; letter-spacing:-.045em; }
.steps p { color:var(--muted); font-size:15px; word-break:keep-all; margin:0; }
.lobby-section { background:url('/assets/v12/background.jpg') center 54%/cover no-repeat; padding:0 0 90px; }
.lobby-section .section { width:100%; padding-inline:calc((100% - var(--page)) / 2); padding-bottom:50px; background:var(--paper); }
.lobby-demo { width:var(--page); margin:auto; padding:34px; background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:36px; }
.lobby-top { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:0 0 28px; border-bottom:1px solid var(--line); }
.lobby-top h3 { margin:0; font-size:21px; letter-spacing:-.03em; }
.lobby-tabs { display:flex; gap:8px; flex-wrap:wrap; }
.lobby-tabs button { min-height:44px; border:1px solid var(--line); border-radius:999px; padding:9px 19px; background:white; color:var(--ink); cursor:pointer; font-size:13px; }
.lobby-tabs button[aria-pressed='true'] { color:white; background:var(--point); border-color:var(--point); }
.lobby-people { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding-top:32px; align-items:start; }
.lobby-people .person:nth-child(even) { padding-top:28px; }
.lobby-people .person-quote { font-size:13px; padding:14px; min-height:70px; box-shadow:none; border-color:var(--point); }
.lobby-people .person-portrait { border-width:4px; border-radius:26px; }
.lobby-people .person:nth-child(2) .person-portrait { border-color:#ff956b; }
.lobby-people .person:nth-child(3) .person-portrait { border-color:#55c6d9; }
.lobby-people .person:nth-child(4) .person-portrait { border-color:#9874d8; }
.demo-caption { font-size:11px; color:var(--muted); margin:28px 0 0; text-align:right; }
.connection-section { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.connection-copy > p:not(.eyebrow) { max-width:430px; margin:26px 0 0; color:var(--muted); font-size:17px; word-break:keep-all; }
.connection-copy .eyebrow { color:var(--point); }
.chat-demo { background:#ebeeff; border-radius:36px; padding:28px; border:1px solid var(--line); }
.chat-head { display:flex; gap:12px; align-items:center; padding-bottom:24px; border-bottom:1px solid var(--line); }
.chat-head img { width:48px; height:64px; object-fit:cover; border:2px solid var(--point); border-radius:13px; }
.chat-head strong { font-size:16px; }
.chat-head span { display:block; color:var(--muted); font-size:11px; }
.message { display:block; width:fit-content; max-width:90%; border-radius:18px; padding:14px 18px; font-size:14px; margin:22px 0 0; background:white; color:var(--ink); }
.message.sent { background:var(--point); color:white; margin-left:auto; }
.chat-label { display:block; color:var(--muted); font-size:10px; margin:7px 0 0; text-align:right; }
.chat-request { margin-top:28px; border:1px solid var(--line); background:white; border-radius:20px; padding:18px; font-size:13px; text-align:center; }
.chat-request strong { display:block; margin-bottom:8px; }
.chat-request span { display:inline-block; background:var(--acid); padding:6px 16px; border-radius:999px; font-size:11px; }
.privacy-note { margin-top:30px; border-top:1px solid var(--line); padding-top:22px; font-size:13px; color:var(--muted); }
.safety-section { border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:90px; }
.safety-copy .eyebrow { color:var(--point); }
.safety-copy > p:not(.eyebrow) { color:var(--muted); font-size:16px; margin:25px 0 0; word-break:keep-all; }
.text-link { display:inline-block; margin-top:24px; font-size:14px; }
.safety-points article { padding:22px 0 24px; border-top:1px solid var(--line); }
.safety-points h3 { font-size:19px; margin-bottom:10px; }
.safety-points p { color:var(--muted); font-size:14px; margin-bottom:0; word-break:keep-all; }
.download-section { background:var(--point); color:white; padding:80px 48px; text-align:center; }
.download-section .eyebrow { color:var(--acid); }
.download-section > img { width:80px; margin:0 auto 28px; border-radius:22px; }
.download-section h2 em { color:var(--acid); font-style:normal; }
.download-section > p:not(.eyebrow) { margin:24px 0 25px; color:#dee2ff; font-size:17px; }
.download-section .store-badge-links { justify-content:center; }
.site-footer { width:var(--page); margin:auto; padding:56px 0 36px; }
.footer-top { display:flex; gap:40px; justify-content:space-between; align-items:flex-start; }
.footer-top nav { display:flex; gap:12px 24px; flex-wrap:wrap; justify-content:flex-end; max-width:650px; }
.footer-top nav a { color:var(--muted); font-size:12px; }
.business-info { display:grid; gap:4px; margin-top:36px; font-size:11px; color:var(--muted); }
.business-info strong { color:var(--ink); font-weight:700; }
.store-trademarks,.copyright { color:var(--muted); font-size:10px; margin:20px 0 0; }
@media (max-width:1050px) {
  :root { --page:calc(100% - 64px); }
  .hero { min-height:620px; gap:24px; }
  .hero h1 { font-size:clamp(44px,5.6vw,60px); }
  .hero-lead { font-size:16px; }
  .hero-visual { gap:12px; }
  .person-quote { font-size:13px; padding:12px; }
  .hero-visual .person:nth-child(2) { padding-top:56px; }
  .lobby-people { gap:16px; }
  .connection-section,.safety-section { gap:48px; }
}
@media (max-width:700px) {
  :root { --page:calc(100% - 40px); }
  .site-header { height:80px; }
  .brand { font-size:25px; gap:8px; }
  .brand img { width:34px; height:34px; border-radius:10px; }
  .primary-navigation a:not(.nav-download) { display:none; }
  .primary-navigation .nav-download { min-height:40px; padding:7px 18px; font-size:12px; }
  .hero { display:block; padding:42px 0 54px; min-height:0; }
  .hero h1 { font-size:clamp(42px,11.4vw,68px); margin-bottom:24px; }
  .hero .eyebrow { font-size:10px; margin-bottom:22px; }
  .hero-lead { font-size:16px; margin-bottom:22px; }
  .hero-visual { max-width:440px; margin:32px auto 0; padding:18px 8px 0; gap:16px; }
  .hero-visual .person:nth-child(2) { padding-top:45px; }
  .hero-note { bottom:-28px; }
  .person-quote { font-size:12px; padding:12px 10px; border-radius:15px; margin-bottom:12px; }
  .person-portrait { border-width:4px; border-radius:24px; }
  .store-badge-links { gap:8px; }
  .store-badge-link { width:148px; flex-basis:148px; height:50px; }
  .app-store-badge { height:40px; }
  .google-play-badge { width:154px; }
  .intro-band { padding:20px; font-size:14px; word-break:keep-all; }
  .section { padding:72px 0; }
  .section h2,.download-section h2 { font-size:clamp(31px,8vw,42px); }
  .section-heading { display:block; }
  .section-heading > p:last-child { margin-top:24px; font-size:15px; }
  .steps { grid-template-columns:1fr; gap:30px; margin-top:40px; }
  .steps h3 { margin-top:16px; font-size:21px; }
  .steps p { font-size:14px; }
  .lobby-section { padding-bottom:56px; }
  .lobby-section .section { padding-bottom:30px; }
  .lobby-demo { padding:22px 14px; border-radius:26px; }
  .lobby-top { display:block; padding-bottom:20px; }
  .lobby-top h3 { margin-bottom:18px; font-size:19px; }
  .lobby-tabs { gap:6px; }
  .lobby-tabs button { padding:8px 12px; font-size:11px; }
  .lobby-people { grid-template-columns:repeat(2,1fr); gap:22px 12px; padding-top:24px; }
  .lobby-people .person:nth-child(even) { padding-top:18px; }
  .lobby-people .person-quote { font-size:11px; padding:10px; min-height:63px; }
  .lobby-people .person-portrait { border-radius:20px; }
  .person-name { gap:6px; font-size:12px; }
  .person-name span { font-size:10px; }
  .demo-caption { font-size:10px; text-align:left; }
  .connection-section,.safety-section { display:block; }
  .connection-copy > p:not(.eyebrow) { font-size:15px; }
  .chat-demo { margin-top:34px; padding:22px; border-radius:26px; }
  .safety-points { margin-top:32px; }
  .download-section { padding:60px 20px; }
  .download-section > p:not(.eyebrow) { font-size:15px; }
  .footer-top { display:block; }
  .footer-top nav { justify-content:flex-start; margin-top:26px; gap:12px 20px; }
}
@media (max-width:350px) {
  :root { --page:calc(100% - 32px); }
  .hero h1 { font-size:38px; }
  .store-badge-links { gap:0; }
  .store-badge-link { width:142px; flex-basis:142px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none !important; animation:none !important; }
}