
:root{
  --bg:#0b0c10;--surface:#0f1218;--surface-2:#151a22;
  --text:#eef2f8;--muted:#a7b0bd;--white:#fff;
  --primary:#8A5BFF;--secondary:#00E3AE;--accent:#FFCC66;
  --glass:rgba(255,255,255,.06);
  --font:'Pretendard',system-ui,-apple-system,'Segoe UI',Roboto,'Noto Sans KR',Arial,sans-serif;
}
*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--font)}
.container{max-width:1180px;margin:0 auto;padding:0 22px}
/* Header */
.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(255,255,255,.06)}
.site-header.glass{background:linear-gradient(180deg,rgba(10,12,16,.8),rgba(10,12,16,.4));backdrop-filter:blur(10px)}
.site-header .container{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{font-weight:800;letter-spacing:.2px}
.nav a{color:var(--muted);text-decoration:none;margin-left:18px}
.nav a:hover{color:var(--text)}
/* Hero */
.hero{position:relative;min-height:72vh;display:grid;place-items:center;overflow:hidden}
.hero.premium{background:radial-gradient(1200px 500px at 50% -10%,rgba(138,91,255,.25),transparent 60%), #0b0c10}
.hero .hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;filter:blur(1px) saturate(1.05)}
.hero .hero-lights{position:absolute;inset:-40% -10% auto -10%;height:120%;background:radial-gradient(600px 300px at 20% 30%, rgba(0,227,174,.35), transparent 60%), radial-gradient(700px 300px at 80% 20%, rgba(138,91,255,.35), transparent 60%)}
.noise{position:absolute;inset:0;background-image:url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22100%22 height=%22100%22><filter id=%22n%22 x=%220%22 y=%220%22><feTurbulence type=%22fractalNoise%22 baseFrequency=%220.8%22 numOctaves=%222%22 stitchTiles=%22stitch%22/></filter><rect width=%22100%22 height=%22100%22 filter=%22url(%23n)%22 opacity=%220.04%22/></svg>');pointer-events:none}
.hero-inner{position:relative;text-align:center}
.headline{font-size:40px;line-height:1.2;margin:0 0 10px;background:linear-gradient(90deg,#fff,#b9c7ff 60%,#e0fffa);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{color:var(--muted);margin:0 0 18px}
.lead{color:#e8ecf6;opacity:.9}
.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:0;margin:12px 0 22px;list-style:none}
.chips li{padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:14px}
.cta-group{display:flex;gap:12px;justify-content:center}
.btn{padding:12px 18px;border-radius:14px;border:1px solid #2a2f3a;cursor:pointer;text-decoration:none;color:var(--text);display:inline-block;transition:.2s transform}
.btn.primary{background:linear-gradient(135deg,var(--secondary),#46a6ff);color:#071016;border:none;box-shadow:0 10px 28px rgba(0,0,0,.35)}
.btn.primary.pulse{animation:pulse 2.8s infinite}
.btn.ghost{background:transparent}
.btn:active{transform:translateY(1px)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(0,227,174,.45)}70%{box-shadow:0 0 0 18px rgba(0,227,174,0)}100%{box-shadow:0 0 0 0 rgba(0,227,174,0)}}
/* Sections */
.section{padding:80px 0}
.section.alt{background:var(--surface)}
.section-title{font-size:26px;margin:0 0 24px;text-align:center}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.feature{background:var(--surface-2);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:18px;transition:transform .25s, box-shadow .25s}
.feature:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(0,0,0,.25)}
.feature .icon{font-size:20px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.card{background:var(--surface-2);border:1px solid rgba(255,255,255,.06);border-radius:18px;overflow:hidden;transform:translateZ(0)}
.card img{width:100%;height:200px;object-fit:cover}
.card-body{padding:16px}
.card.glow:hover{box-shadow:0 0 0 1px rgba(138,91,255,.25),0 20px 60px rgba(138,91,255,.18)}
.note{margin-top:12px;color:var(--muted);text-align:center}
/* Map */
.map-wrap{border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.06);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.map{width:100%;height:420px;border:0}
/* Footer */
.site-footer{background:#0e1015;border-top:1px solid rgba(255,255,255,.06);padding:28px 0;margin-top:40px}
.footer-grid{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand-foot{font-size:20px;margin:0 0 4px}
.foot-sub{color:var(--muted);margin:0}
.site-footer .small a{color:var(--muted);text-decoration:none}
/* Chat UI */
.chat-window{width:100%;max-width:820px;height:520px;margin:0 auto;background-color:var(--white);border:1px solid #e0e0e0;border-radius:20px;box-shadow:0 10px 40px rgba(0,0,0,.08);display:flex;flex-direction:column;overflow:hidden;color:#111}
.chat-messages{flex-grow:1;padding:30px;overflow-y:auto;display:flex;flex-direction:column;gap:20px}
.chat-message{display:flex;align-items:flex-end;gap:15px;max-width:85%;opacity:0;transform:translateY(20px);animation:messageFadeIn .5s ease forwards}
.chat-message.user{align-self:flex-end;flex-direction:row-reverse}
.chat-message .avatar{width:40px;height:40px;border-radius:50%;background-color:#0b8c66;color:#fff;font-weight:700;display:flex;justify-content:center;align-items:center;flex-shrink:0}
.message-bubble{padding:15px 20px;border-radius:20px;line-height:1.7;font-size:1rem;font-weight:400}
.chat-message.ai .message-bubble{background-color:#e7f7ef;border-top-left-radius:5px;color:#111}
.chat-message.user .message-bubble{background-color:#0b8c66;border-top-right-radius:5px;color:#fff}
@keyframes messageFadeIn{to{opacity:1;transform:translateY(0)}}
/* Floating */
.floating-bar{position:fixed;right:22px;bottom:22px;z-index:60}
.fab{background:linear-gradient(135deg,var(--secondary),#46a6ff);color:#051018;border:none;border-radius:999px;padding:14px 18px;font-weight:800;cursor:pointer;box-shadow:0 12px 28px rgba(0,0,0,.25)}
@media (max-width:640px){.hero .headline{font-size:28px}.hero .sub{font-size:14px}.chat-window{height:420px}}
