:root{
  --bg:#f6fbff;
  --muted:#6b7280;
  --accent:#0b63d6;
  --card:#ffffff;
  --glass: rgba(255,255,255,0.6);
  --radius:12px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial; margin:0; background:linear-gradient(180deg,var(--bg),#eef6ff); color:#0f172a;}
.container{max-width:1100px;margin:0 auto;padding:28px}
.site-header{padding:20px 0}
.brand h1{font-family:Playfair Display,serif;margin:0;font-size:28px}
.brand .accent{color:var(--accent)}
.tag{margin:6px 0 0;color:var(--muted);font-size:14px}
.actions .btn{padding:8px 14px;border-radius:8px;text-decoration:none;background:transparent;border:1px solid rgba(15,23,42,0.08);color:inherit}

/* 가입 링크 스타일 */
.signup-link{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);text-decoration:none;opacity:0.95}
.signup-link svg{flex:0 0 16px;stroke:var(--muted)}
.signup-link:hover{opacity:1;color:var(--accent)}
.signup-link:hover svg{stroke:var(--accent)}

.hero{padding:32px 0}
.hero-grid{display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start}
.hero-copy h2{font-family:Playfair Display,serif;font-size:32px;margin:0 0 10px}
.hero-copy p{color:var(--muted);line-height:1.6}
.features{margin:16px 0 20px;padding-left:18px;color:var(--muted)}
.cta-row .btn{display:inline-block;margin-right:10px;text-decoration:none;padding:10px 16px;border-radius:10px}
.btn.primary{background:var(--accent);color:#fff}
.btn.ghost{background:transparent;border:1px solid rgba(11,99,214,0.12);color:var(--accent)}
.hero-card{background:linear-gradient(180deg,var(--card),#f8fbff);padding:18px;border-radius:var(--radius);box-shadow:0 8px 30px rgba(2,6,23,0.06);position:relative;overflow:hidden}
.card-content h3{margin:0 0 8px}
.card-content p{color:var(--muted);font-size:14px}

.site-footer{padding:24px 0;color:var(--muted);font-size:13px}

@media (max-width:880px){
  .hero-grid{grid-template-columns:1fr;}
  .container{padding:18px}
}