/* ===== CS GROUP — shared design tokens & components ===== */

:root{
  --green-900:#123322;
  --green-700:#1E6B44;
  --green-600:#22824A;
  --green-500:#2E9E5B;
  --green-100:#E3F2E8;
  --green-50:#EFF7F1;

  --blue-700:#0E4670;
  --blue-600:#155586;
  --blue-500:#1C6FB0;
  --blue-100:#E4EEF6;

  --ink-900:#12201F;
  --ink-700:#33453F;
  --ink-500:#5E6F68;
  --ink-300:#93A099;

  --paper:#F6F7F2;
  --surface:#FFFFFF;
  --surface-2:#F0F2EC;
  --line:#DEE3D8;

  --amber-600:#B4740E;
  --amber-100:#FBF0DC;
  --red-600:#B23A32;
  --red-100:#FBE7E4;

  --radius-lg:20px;
  --radius-md:14px;
  --radius-sm:9px;
  --shadow-1:0 1px 2px rgba(18,32,29,.06), 0 8px 24px -12px rgba(18,32,29,.18);
  --shadow-2:0 2px 6px rgba(18,32,29,.08), 0 20px 44px -18px rgba(18,32,29,.28);

  --bg:var(--paper);
  --fg:var(--ink-900);
  --fg-muted:var(--ink-500);
  --card-bg:var(--surface);
  --card-line:var(--line);
  color-scheme:light;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0F1712;
    --fg:#EAF0EA;
    --fg-muted:#9FB0A6;
    --card-bg:#162019;
    --card-line:#26332A;
    --surface-2:#1A241C;
    --green-100:#173A26;
    --green-50:#122C1D;
    --blue-100:#122B3C;
    --line:#26332A;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0F1712;
  --fg:#EAF0EA;
  --fg-muted:#9FB0A6;
  --card-bg:#162019;
  --card-line:#26332A;
  --surface-2:#1A241C;
  --green-100:#173A26;
  --green-50:#122C1D;
  --blue-100:#122B3C;
  --line:#26332A;
  color-scheme:dark;
}

*{box-sizing:border-box;}
body{
  background:var(--bg);
  color:var(--fg);
  font-family:'Noto Sans KR',-apple-system,'Malgun Gothic',sans-serif;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Gothic A1','Noto Sans KR',sans-serif;
  color:var(--fg);
  text-wrap:balance;
  margin:0;
  letter-spacing:-.01em;
}
p{margin:0;color:var(--fg-muted);}
a{color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1180px;margin:0 auto;padding-inline:24px;}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.78rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--green-600);
}
:root[data-theme="dark"] .eyebrow, @media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .eyebrow{color:var(--green-500);} }

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 24px;border-radius:999px;font-weight:700;font-size:.95rem;
  border:1px solid transparent;cursor:pointer;text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--green-600);color:#fff;box-shadow:var(--shadow-1);}
.btn-primary:hover{background:var(--green-700);}
.btn-ghost{background:transparent;border-color:var(--card-line);color:var(--fg);}
.btn-ghost:hover{border-color:var(--green-600);color:var(--green-600);}
.btn-light{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.4);backdrop-filter:blur(2px);}
.btn-light:hover{background:rgba(255,255,255,.24);}

.card{
  background:var(--card-bg);
  border:1px solid var(--card-line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-1);
}

.chip{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.74rem;font-weight:700;padding:5px 11px;border-radius:999px;
  letter-spacing:.02em;
}
.chip-live{background:var(--green-100);color:var(--green-700);}
:root[data-theme="dark"] .chip-live, @media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip-live{color:var(--green-500);}}
.chip-beta{background:var(--amber-100);color:var(--amber-600);}
.chip-blue{background:var(--blue-100);color:var(--blue-600);}
:root[data-theme="dark"] .chip-blue, @media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip-blue{color:#6FA8D8;}}

.site-header{
  position:sticky;top:env(safe-area-inset-top,0px);z-index:40;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px) saturate(1.1);
  border-bottom:1px solid var(--card-line);
}
.site-header .bar{
  display:flex;align-items:center;justify-content:space-between;
  height:74px;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.05rem;text-decoration:none;color:var(--fg);}
.brand img{height:30px;width:auto;}
.brand small{display:block;font-family:'Noto Sans KR';font-size:.66rem;font-weight:700;color:var(--fg-muted);letter-spacing:.06em;}

.nav{display:flex;align-items:center;gap:30px;}
.nav a{font-size:.92rem;font-weight:700;text-decoration:none;color:var(--fg-muted);}
.nav a:hover{color:var(--green-600);}
.nav .nav-cta{color:#fff;background:var(--blue-600);padding:10px 18px;border-radius:999px;}
.nav .nav-cta:hover{background:var(--blue-700);color:#fff;}

.footer{
  background:var(--ink-900);color:#C9D4CB;padding-block:52px 30px;margin-top:96px;
}
.footer a{color:#C9D4CB;text-decoration:none;}
.footer .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px;}
.footer h4{color:#fff;font-size:.85rem;letter-spacing:.04em;margin-bottom:14px;}
.footer .fine{color:#8CA090;font-size:.8rem;line-height:1.9;}
.footer .legal{border-top:1px solid #223129;margin-top:36px;padding-top:20px;font-size:.78rem;color:#7C9086;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}

@media (max-width:860px){
  .nav{display:none;}
  .footer .cols{grid-template-columns:1fr;}
}

.section{padding-block:88px;}
.section-head{max-width:640px;margin-bottom:44px;}
.section-head h2{font-size:2rem;margin-top:10px;}
.section-head p{margin-top:14px;font-size:1.02rem;}

table{border-collapse:collapse;width:100%;}
th,td{text-align:left;padding:12px 14px;font-size:.92rem;}
th{color:var(--fg-muted);font-weight:700;font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--card-line);}
td{border-bottom:1px solid var(--card-line);font-variant-numeric:tabular-nums;}
tr:last-child td{border-bottom:none;}

.tag-status{font-size:.74rem;font-weight:700;padding:4px 10px;border-radius:999px;display:inline-block;}
.tag-status.ongoing{background:var(--blue-100);color:var(--blue-600);}
.tag-status.done{background:var(--green-100);color:var(--green-700);}
.tag-status.warn{background:var(--amber-100);color:var(--amber-600);}
.tag-status.risk{background:var(--red-100);color:var(--red-600);}

[hidden]{display:none!important;}