:root{
  /* Toss / TDS tokens */
  --primary:#3182f6; --primary-hover:#2272eb; --weak-bg:#e8f3ff; --weak-fg:#1b64da;
  --canvas:#ffffff; --fg:#191f28; --body:#4e5968; --muted:#8b95a1;
  --surface:#f2f4f6; --line:#e5e8eb; --on-primary:#ffffff; --danger:#e42939;
  --good:#0ca678; --amber:#f08c00;
  --sans:'Pretendard',-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Segoe UI',Roboto,sans-serif;
  --mono:'Pretendard',ui-monospace,SFMono-Regular,Menlo,monospace;
  /* aliases kept so legacy class references still resolve */
  --ink:var(--fg); --ink-soft:var(--body); --green:var(--primary); --green-deep:var(--primary-hover);
  --paper:var(--canvas); --mint:#69a9ff; --red:var(--danger); --serif:var(--sans);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--canvas);color:var(--fg);font-family:var(--sans);line-height:1.6;
  -webkit-font-smoothing:antialiased;letter-spacing:-.01em}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.mono{font-family:var(--mono)}

/* announcement strip */
.strip{background:var(--fg);color:#e5e8eb;font-size:13px;padding:10px 16px;text-align:center;letter-spacing:0}
.strip b{color:#69a9ff;font-weight:600}

/* top nav */
nav.top{display:flex;justify-content:space-between;align-items:center;padding:18px 0;flex-wrap:wrap;gap:12px}
.logo{font-weight:700;font-size:20px;text-decoration:none;color:var(--fg);letter-spacing:-.02em}
.logo em{color:var(--primary);font-style:normal}
nav.top .links{display:flex;align-items:center;flex-wrap:wrap;gap:6px 22px}
nav.top .links a{font-size:14px;color:var(--body);text-decoration:none;font-weight:500}
nav.top .links a:hover{color:var(--fg)}
nav.top .links a.cta{background:var(--primary);color:#fff;padding:9px 16px;border-radius:8px;font-weight:600}
nav.top .links a.cta:hover{background:var(--primary-hover)}
.langs{font-size:13px}
.langs a{color:var(--muted);text-decoration:none;padding:2px 5px}
.langs a.on{color:var(--primary);font-weight:600}

/* market switcher bar */
.marketbar{background:var(--surface);border-bottom:1px solid var(--line)}
.marketbar .wrap{display:flex;gap:4px;align-items:center;padding:0}
.marketbar a{font-size:13px;color:var(--body);text-decoration:none;padding:12px 16px;font-weight:500;border-radius:0}
.marketbar a.on{color:var(--primary);font-weight:700;box-shadow:inset 0 -2px 0 var(--primary)}
.marketbar a:hover{color:var(--fg)}

.crumb{font-size:13px;color:var(--muted);padding:18px 0 0}
.crumb a{color:var(--muted);text-decoration:none}

/* hero */
header.hero{padding:56px 0 40px}
.hero.grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
@media(max-width:900px){.hero.grid{grid-template-columns:1fr;gap:32px}}
.aida{display:inline-block;font-size:12px;letter-spacing:.14em;color:var(--weak-fg);background:var(--weak-bg);
  text-transform:uppercase;font-weight:700;padding:5px 12px;border-radius:999px;margin-bottom:18px}
.kicker{font-size:13px;letter-spacing:.02em;color:var(--primary);font-weight:600;margin-bottom:16px}
h1{font-weight:700;font-size:clamp(30px,4.4vw,46px);line-height:1.25;letter-spacing:-.03em}
.big{font-weight:700;font-size:clamp(30px,4.6vw,50px);line-height:1.24;letter-spacing:-.03em;word-break:keep-all;text-wrap:balance}
h1 .u,.big .u{color:var(--primary)}
p.lead{margin-top:20px;font-size:18px;color:var(--body);max-width:600px;line-height:1.55}
.btns{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.btn{display:inline-block;background:var(--primary);color:#fff;font-weight:600;padding:15px 26px;
  text-decoration:none;font-size:16px;border-radius:12px;border:0;cursor:pointer}
.btn:hover{background:var(--primary-hover)}
.btn.ghost{background:var(--surface);color:var(--fg)}
.btn.ghost:hover{background:var(--line)}

/* score-card visual (mcard) */
.mcard{border:1px solid var(--line);background:#fff;border-radius:20px;overflow:hidden;
  box-shadow:0 8px 24px rgba(25,31,40,.06)}
.mcard .mhead{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);
  padding:14px 18px;font-size:13px;color:var(--muted);font-weight:500}
.mcard .mhead b{color:var(--primary);font-weight:600}
.mcard table{width:100%;border-collapse:collapse;font-size:14px}
.mcard td,.mcard th{padding:11px 18px;text-align:left;border-bottom:1px solid var(--line)}
.mcard th{font-size:12px;color:var(--muted);font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.mcard td.score{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.bad{color:var(--danger)}.mid{color:var(--amber)}.good{color:var(--good)}
.mcard .mfoot{padding:12px 18px;font-size:12.5px;color:var(--muted)}

/* self-check widget */
.selfcheck{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:26px}
.selfcheck h3{font-size:17px;margin-bottom:6px}
.selfcheck p.sc-sub{font-size:13.5px;color:var(--body);margin-bottom:16px}
.sc-row{display:flex;gap:10px}
.sc-row input{flex:1;padding:14px 16px;border:1px solid var(--line);border-radius:12px;font-size:15px;
  font-family:var(--sans);background:#fff;color:var(--fg)}
.sc-row input:focus{outline:none;border-color:var(--primary)}
.sc-row button{background:var(--primary);color:#fff;border:0;border-radius:12px;padding:0 22px;
  font-size:15px;font-weight:600;cursor:pointer;white-space:nowrap}
.sc-row button:hover{background:var(--primary-hover)}
.sc-pre{font-size:12.5px;color:var(--body);background:var(--surface);border:1px dashed var(--line);
  border-radius:10px;padding:10px 12px;margin:0 0 14px}
.sc-out{margin-top:16px;display:none}
.sc-out.show{display:block}
.sc-band{font-size:13.5px;font-weight:600;color:var(--fg);margin:0 0 6px}
.sc-band.bad{color:var(--danger)}
.sc-list{margin:12px 0 0;font-size:13.5px;color:var(--body);list-style:none}
.sc-list li{padding:6px 0 6px 24px;position:relative}
.sc-list li::before{content:"";position:absolute;left:0;top:12px;width:8px;height:8px;border-radius:50%;background:var(--muted)}
.sc-list li.hit::before{background:var(--danger)}
.sc-tag{display:inline-block;font-size:11px;color:var(--danger);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:1px 7px;margin-left:4px;white-space:nowrap}
.sc-note{font-size:12px;color:var(--muted);margin-top:14px}
.sc-email>input[type=url]{width:100%;box-sizing:border-box;padding:14px 16px;border:1px solid var(--line);border-radius:12px;font-size:15px;font-family:inherit}
.sc-email>input[type=url]:focus{outline:none;border-color:var(--primary)}
.sc-email{display:none;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.sc-email.show{display:block}
.sc-email label{display:block;font-size:14px;font-weight:600;color:var(--fg);margin-bottom:4px}
.sc-email .sc-email-sub{font-size:12.5px;color:var(--body);margin-bottom:10px}
.sc-email .sc-email-ok{display:none;font-size:12.5px;color:var(--good);margin-top:10px;font-weight:500}
.sc-email .sc-email-ok.show{display:block}

/* sections */
section{padding:64px 0;border-top:1px solid var(--line)}
h2{font-size:clamp(24px,3vw,32px);font-weight:700;line-height:1.3;margin-bottom:14px;letter-spacing:-.025em}
h3{font-size:19px;font-weight:600;margin:22px 0 8px;letter-spacing:-.02em}
.sec-kicker{font-size:13px;letter-spacing:.02em;color:var(--primary);font-weight:600;margin-bottom:12px}
.prose{max-width:760px;color:var(--body);font-size:16.5px;line-height:1.7}
.prose p{margin-bottom:16px}
.prose strong{color:var(--fg);font-weight:600}
.prose a{color:var(--primary);text-decoration:none;font-weight:500}
.prose a:hover{text-decoration:underline}
.prose ul,.prose ol{margin:0 0 18px 20px}
.prose li{margin-bottom:8px}
.prose table{width:100%;border-collapse:collapse;font-size:14.5px;margin:10px 0 22px}
.prose td,.prose th{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose th{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;font-weight:600}

/* ecosystem chips */
.eco{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-top:8px}
.eco div{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.eco .e{font-size:12px;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;font-weight:500}
.eco .v{font-size:16px;margin-top:4px;font-weight:600;color:var(--fg)}

/* comparison table */
.cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:14.5px;margin-top:8px;
  border:1px solid var(--line);border-radius:16px;overflow:hidden}
.cmp th,.cmp td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line)}
.cmp thead th{font-size:13px;color:var(--body);font-weight:600;background:var(--surface)}
.cmp thead th.hi{color:var(--primary)}
.cmp tbody th{font-weight:500;color:var(--fg)}
.cmp td.hi{background:var(--weak-bg);font-weight:600;color:var(--fg)}
.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0}

/* cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:28px}
.cards.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:860px){.cards,.cards.four{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cards,.cards.four{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;text-decoration:none;color:inherit;display:block}
a.card:hover{border-color:var(--primary)}
.card .n{color:var(--primary);font-size:12px;letter-spacing:.04em;text-transform:uppercase;font-weight:600}
.card h3{font-size:17px;margin:8px 0 6px}
.card p{font-size:14px;color:var(--body);line-height:1.6}

/* deliverable preview cards */
.deliv{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px}
@media(max-width:860px){.deliv{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.deliv{grid-template-columns:1fr}}
.dpage{border:1px solid var(--line);border-radius:14px;background:#fff;padding:18px;font-size:12.5px;color:var(--body);
  box-shadow:0 4px 14px rgba(25,31,40,.04);min-height:190px}
.dpage .tag{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.dpage h4{font-size:15px;margin:6px 0 10px;color:var(--fg);font-weight:600;letter-spacing:-.02em}
.dpage .bar{height:7px;border-radius:999px;background:var(--surface);margin:6px 0;position:relative;overflow:hidden}
.dpage .bar i{position:absolute;left:0;top:0;height:100%;border-radius:999px;background:var(--primary)}
.dpage .bar.b i{background:var(--danger)}
.dpage .kv{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px dashed var(--line);font-variant-numeric:tabular-nums}
.dpage .kv:last-child{border-bottom:0}
.dpage ol{margin:4px 0 0 16px;padding:0}
.dpage ol li{margin:5px 0}

/* pricing tiers */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
@media(max-width:860px){.tiers{grid-template-columns:1fr}}
.tier{border:1px solid var(--line);background:#fff;padding:28px 24px;position:relative;border-radius:18px}
.tier.hot{border:2px solid var(--primary);box-shadow:0 12px 30px rgba(49,130,246,.14)}
.tier .tag{position:absolute;top:-12px;left:24px;background:var(--primary);color:#fff;font-size:11px;
  letter-spacing:.04em;padding:4px 12px;border-radius:999px;font-weight:600}
.tier h3{margin:0;font-size:18px}
.tier .price{font-size:28px;font-weight:700;margin:12px 0 4px;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.tier .per{font-size:13px;color:var(--muted)}
.tier ul{list-style:none;margin:18px 0 22px;font-size:14px;color:var(--body)}
.tier li{padding:8px 0 8px 24px;position:relative;border-bottom:1px solid var(--line)}
.tier li::before{content:"";position:absolute;left:0;top:15px;width:7px;height:7px;border-radius:50%;background:var(--primary)}
.tier li:last-child{border-bottom:0}

/* CTA form box */
.formbox{background:var(--fg);color:#e5e8eb;padding:48px;margin-top:8px;border-radius:24px}
@media(max-width:640px){.formbox{padding:32px 22px}}
.formbox h2{color:#fff}
.formbox .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px}
@media(max-width:640px){.formbox .fgrid{grid-template-columns:1fr}}
.formbox label{display:block;font-size:12.5px;letter-spacing:.02em;margin-bottom:7px;color:#8b95a1;font-weight:500}
.formbox input,.formbox textarea{width:100%;padding:14px 15px;background:#2a2f38;border:1px solid #3c414b;
  color:#fff;font-size:15px;font-family:var(--sans);border-radius:12px}
.formbox input:focus,.formbox textarea:focus{outline:none;border-color:var(--primary)}
.formbox button{grid-column:1/-1;background:var(--primary);color:#fff;border:0;padding:16px;font-size:16px;
  font-weight:600;cursor:pointer;font-family:var(--sans);border-radius:12px}
.formbox button:hover{background:var(--primary-hover)}
.formbox .note{grid-column:1/-1;font-size:12.5px;color:#8b95a1}

/* FAQ */
details{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;padding:20px 0;font-weight:600;font-size:16px;display:flex;
  justify-content:space-between;gap:20px;color:var(--fg)}
summary::-webkit-details-marker{display:none}
summary .plus{color:var(--primary);transition:transform .25s;font-weight:400}
details[open] .plus{transform:rotate(45deg)}
details .prose{padding-bottom:20px}

.pillar{border-left:3px solid var(--primary);padding:6px 0 6px 20px;margin:24px 0}
.pillar .pk{font-size:13px;letter-spacing:.02em;color:var(--primary);font-weight:600}

/* footer */
footer{padding:40px 0;font-size:13.5px;color:var(--muted);border-top:1px solid var(--line);margin-top:40px}
footer .cols{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}
footer a{color:var(--muted);text-decoration:none}
footer a:hover{color:var(--body)}

@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.rise{animation:rise .6s cubic-bezier(.22,1,.36,1) both}
.r2{animation-delay:.1s}.r3{animation-delay:.2s}.r4{animation-delay:.32s}

[dir=rtl] .aida,[dir=rtl] .prose{text-align:right}
[dir=rtl] .pillar{border-left:0;border-right:3px solid var(--primary);padding-left:0;padding-right:20px}