:root {
  --cp-ink: #171421;
  --cp-muted: #6f6878;
  --cp-line: rgba(61, 42, 79, 0.12);
  --cp-paper: #fffdfb;
  --cp-purple: #5b2e91;
  --cp-purple-soft: #f1eafa;
  --cp-shadow: 0 18px 48px rgba(55, 31, 76, 0.09);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.sjm-content-page { margin: 0; color: var(--cp-ink); background: linear-gradient(180deg,#fffaf4,#f8f5fb); font-family: "Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif; line-height: 1.7; }
.cp-container { width: min(1080px, calc(100% - 40px)); margin: 0 auto; }
.cp-hero { padding: 84px 0 54px; text-align: center; }
.cp-eyebrow { margin: 0 0 12px; color: var(--cp-purple); font-size: .82rem; font-weight: 900; }
.cp-hero h1 { margin: 0; font-size: clamp(2.35rem,5vw,4rem); line-height: 1.15; letter-spacing: -.065em; word-break: keep-all; }
.cp-hero p:last-child { max-width: 720px; margin: 22px auto 0; color: var(--cp-muted); font-size: 1.03rem; word-break: keep-all; }
.cp-section { padding: 28px 0 76px; }
.cp-section-head { margin-bottom: 24px; }
.cp-section-head h2 { margin: 0; font-size: clamp(1.55rem,3vw,2.2rem); letter-spacing: -.045em; }
.cp-section-head p { margin: 8px 0 0; color: var(--cp-muted); }
.cp-service-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.cp-service-card { min-height: 230px; padding: 24px; border: 1px solid var(--cp-line); border-radius: 22px; background: rgba(255,255,255,.88); box-shadow: var(--cp-shadow); }
.cp-service-card.available { border-color: rgba(91,46,145,.24); }
.cp-card-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.cp-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--cp-purple-soft); font-size: 1.25rem; }
.cp-status { padding: 5px 8px; border-radius: 999px; color: #6b4d88; background: #eee7f5; font-size: .7rem; font-weight: 900; }
.cp-status.free { color: #176650; background: #e1f3eb; }
.cp-status.beta { color: #985827; background: #fff0db; }
.cp-service-card h3 { margin: 18px 0 8px; font-size: 1.2rem; }
.cp-service-card p { margin: 0; color: var(--cp-muted); font-size: .9rem; }
.cp-service-card a { display: inline-flex; margin-top: 18px; color: var(--cp-purple); text-decoration: none; font-weight: 900; }
.cp-service-card .cp-coming { display: inline-flex; margin-top: 18px; color: #96909a; font-size: .83rem; font-weight: 800; }
.cp-note { margin-top: 22px; padding: 18px 20px; border: 1px solid #eadcc8; border-radius: 16px; color: #6c6257; background: #fff7eb; font-size: .88rem; }
.cp-article-list { display: grid; gap: 18px; }
.cp-article { scroll-margin-top: 100px; padding: clamp(24px,4vw,38px); border: 1px solid var(--cp-line); border-radius: 24px; background: rgba(255,255,255,.9); box-shadow: var(--cp-shadow); }
.cp-article-label { color: var(--cp-purple); font-size: .76rem; font-weight: 900; }
.cp-article h2 { margin: 9px 0 15px; font-size: clamp(1.45rem,3vw,2rem); line-height: 1.35; letter-spacing: -.045em; }
.cp-article h3 { margin: 24px 0 8px; font-size: 1.06rem; }
.cp-article p { margin: 0 0 12px; color: #5d5662; }
.cp-article ul { margin: 10px 0 0; padding-left: 20px; color: #5d5662; }
.cp-easy-box { margin-top: 20px; padding: 18px; border-radius: 17px; background: linear-gradient(135deg,#f3ebfb,#fff8ed); }
.cp-easy-box strong { display: block; color: var(--cp-purple); margin-bottom: 5px; }
.cp-easy-box p { margin: 0; }
.cp-cta { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-top: 34px; }
.cp-cta a { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 20px; border-radius: 13px; color: white; background: var(--cp-purple); text-decoration: none; font-weight: 900; }
.cp-cta a.secondary { color: var(--cp-purple); background: white; border: 1px solid rgba(91,46,145,.25); }
@media(max-width:850px){.cp-service-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.cp-container{width:min(100% - 28px,560px)}.cp-hero{padding-top:58px}.cp-service-grid{grid-template-columns:1fr}.cp-service-card{min-height:auto}}
