/* ============================================================
   Docpod landing — 잉크 온 페이퍼 에디토리얼, 파랑 한 가지 강조
   전 섹션은 .lp-in (= --app-max) 안에서만 정렬된다.
   ============================================================ */
body.lp {
  margin: 0; font-family: var(--font); color: var(--text); background: #fff;
  font-size: 16.5px; word-break: keep-all; overflow-wrap: break-word; -webkit-font-smoothing: antialiased;
}
body.lp a { color: inherit; text-decoration: none; }
.lic { width: 22px; height: 22px; }
.lp-in { max-width: var(--app-max); margin: 0 auto; padding-left: var(--app-pad); padding-right: var(--app-pad); }
body.lp kbd {
  font-family: inherit; font-size: .86em; background: var(--bg);
  border: 1px solid var(--border); border-radius: 5px; padding: 1px 6px; color: var(--text-2);
}
body.lp code { font-family: "IBM Plex Mono", monospace; font-size: .9em; }

/* nav */
.lp-nav {
  border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 20;
  background: rgba(255,255,255,.9); backdrop-filter: blur(14px);
}
.lp-nav .lp-in { display: flex; align-items: center; justify-content: space-between; height: 68px; }
.lp-logo { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: 18px; letter-spacing: -.02em; }
.lp-mark {
  width: 30px; height: 30px; border-radius: 9px; color: #fff; font-size: 15px; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(150deg, #4A82EC, #2A5BC0); box-shadow: 0 2px 6px rgba(42,91,192,.3);
}
.lp-nav nav { display: flex; gap: 10px; align-items: center; }

/* hero */
.hero-grid {
  display: grid; grid-template-columns: minmax(340px, 1fr) minmax(420px, 1.12fr);
  gap: 56px; align-items: center; padding-top: 76px; padding-bottom: 64px;
}
.lp-eyebrow { font-size: 12.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--primary); margin: 0 0 18px; }
.lp-hero h1 { font-size: clamp(40px, 4.6vw, 60px); line-height: 1.1; letter-spacing: -.04em; font-weight: 800; margin: 0 0 22px; }
.lp-hero h1 .hl { position: relative; white-space: nowrap; }
.lp-hero h1 .hl::after {
  content: ''; position: absolute; left: -2px; right: -2px; bottom: .1em; height: .32em;
  background: linear-gradient(90deg, #CFE0FF, #EAF1FF); border-radius: 3px; z-index: -1;
}
.lp-sub { font-size: 18px; line-height: 1.72; color: var(--text-2); margin: 0 0 30px; max-width: 30em; }
.lp-cta { display: flex; gap: 10px; flex-wrap: wrap; }
.lp-note { margin: 16px 0 0; font-size: 13px; color: var(--text-3); }

/* hero artifact */
.mock {
  border: 1px solid var(--border); border-radius: 16px; overflow: hidden; background: #fff;
  box-shadow: 0 24px 60px rgba(16,24,40,.13), 0 2px 8px rgba(16,24,40,.05);
  transform: perspective(1400px) rotateY(-6deg) rotateX(2deg);
}
.mock-chrome { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: #F4F5F8; border-bottom: 1px solid var(--border); }
.mock-chrome span { width: 9px; height: 9px; border-radius: 999px; background: #D6DAE2; }
.mock-chrome em { margin-left: 12px; font-style: normal; font-size: 11.5px; color: var(--text-3); background: #fff; border: 1px solid var(--border); border-radius: 999px; padding: 3px 12px; }
.mock-top { display: flex; align-items: center; gap: 14px; padding: 12px 16px; }
.mock-brand { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 800; }
.mock-brand i { width: 18px; height: 18px; border-radius: 5px; background: linear-gradient(150deg,#4A82EC,#2A5BC0); }
.mock-search { flex: 1; font-size: 11px; color: var(--text-3); background: #F7F8FA; border: 1px solid var(--border); border-radius: 7px; padding: 5px 10px; }
.mock-links { display: flex; gap: 7px; }
.mock-links b { width: 26px; height: 6px; border-radius: 3px; background: #E4E7EE; }
.mock-tabs { display: flex; gap: 14px; padding: 0 16px 9px; border-bottom: 1px solid var(--border); }
.mock-tabs u { font-size: 11.5px; color: var(--text-3); text-decoration: none; padding-bottom: 6px; }
.mock-tabs u.on { color: var(--primary); font-weight: 700; box-shadow: inset 0 -2px 0 var(--primary); }
.mock-body { display: grid; grid-template-columns: 108px 1fr 92px; gap: 14px; padding: 14px 16px 20px; }
.mock-side p, .mock-toc p { margin: 0 0 6px; font-size: 10.5px; color: var(--text-3); line-height: 1.5; }
.mock-side p.grp { font-weight: 800; color: var(--text-2); margin-top: 10px; }
.mock-side p.on, .mock-toc p.on { color: var(--primary); font-weight: 700; }
.mock-doc h4 { margin: 0 0 10px; font-size: 15px; letter-spacing: -.02em; }
.ln { height: 7px; border-radius: 4px; background: #EDEFF4; margin-bottom: 7px; }
.ln.w90 { width: 92%; } .ln.w80 { width: 78%; } .ln.w70 { width: 66%; } .ln.w60 { width: 54%; }
.mock-hint { font-size: 10.5px; background: #F0F6FF; color: #2A5BC0; border-radius: 7px; padding: 7px 10px; margin: 10px 0; }
.mock-table { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: 6px; overflow: hidden; margin: 10px 0; }
.mock-table span { background: #fff; height: 20px; }
.mock-table span:nth-child(-n+3) { background: #FBFCFE; }
.mock-toc p:first-child { font-weight: 800; color: var(--text-2); }

/* stat strip */
.lp-strip { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: #FAFBFD; }
.strip-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.strip-grid div { padding: 26px 20px; text-align: center; border-left: 1px solid var(--border); }
.strip-grid div:first-child { border-left: 0; }
.strip-grid b { display: block; font-size: 27px; font-weight: 800; letter-spacing: -.03em; }
.strip-grid span { font-size: 13px; color: var(--text-2); }

/* section heads */
.lp-sec-head { max-width: 720px; margin: 0 auto 48px; text-align: center; }
.lp-sec-head h2 { font-size: clamp(26px, 3vw, 35px); letter-spacing: -.03em; margin: 0 0 10px; }
.lp-sec-head p { font-size: 16.5px; color: var(--text-2); margin: 0; line-height: 1.7; }

/* ── showcases ───────────────────────────────────────────── */
.lp-shows > .lp-in { padding-top: 88px; padding-bottom: 40px; }
.show {
  display: grid; grid-template-columns: minmax(300px, .85fr) minmax(400px, 1.15fr);
  gap: 56px; align-items: center; padding: 44px 0;
  border-top: 1px solid var(--border);
}
.show:first-of-type { border-top: 0; padding-top: 0; }
.show.flip .show-copy { order: 2; }
.show-tag {
  display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700;
  color: var(--primary); background: #F0F5FF; border-radius: 999px; padding: 6px 14px 6px 10px; margin-bottom: 16px;
}
.show-tag .lic { width: 15px; height: 15px; }
.show-copy h3 { font-size: clamp(22px, 2.2vw, 27px); letter-spacing: -.025em; margin: 0 0 12px; }
.show-copy > p { font-size: 16px; line-height: 1.72; color: var(--text-2); margin: 0 0 18px; }
.show-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.show-list li { position: relative; padding-left: 24px; font-size: 14.8px; color: var(--text-2); line-height: 1.6; }
.show-list li::before {
  content: ''; position: absolute; left: 4px; top: .52em; width: 8px; height: 8px;
  border: 2px solid var(--primary); border-radius: 2px; transform: rotate(45deg);
}
.show-art { min-width: 0; }
.art {
  background: #fff; border: 1px solid var(--border); border-radius: 16px;
  box-shadow: 0 14px 36px rgba(16,24,40,.08); overflow: hidden; font-size: 13px;
}

/* ① editor */
.art-bar { display: flex; align-items: center; gap: 4px; padding: 9px 12px; background: #FBFCFE; border-bottom: 1px solid var(--border); }
.art-bar b { width: 26px; height: 24px; display: grid; place-items: center; font-size: 12px; color: var(--text-2); border-radius: 6px; }
.art-bar b:first-child { background: var(--primary-soft); color: var(--primary); }
.art-div { width: 1px; height: 15px; background: var(--border); margin: 0 5px; }
.art-doc { padding: 20px 22px 22px; }
.art-doc h5 { margin: 0 0 10px; font-size: 19px; letter-spacing: -.02em; }
.art-doc p { margin: 0 0 12px; color: var(--text-2); line-height: 1.65; }
.art-hint { background: #F0F6FF; color: #24509E; border-radius: 9px; padding: 11px 13px; line-height: 1.6; margin-bottom: 14px; }
.art-tbl { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.art-tbl .r { display: grid; grid-template-columns: 1fr 1fr 1fr; border-top: 1px solid var(--border); }
.art-tbl .r:first-child { border-top: 0; }
.art-tbl .r.h { background: #FBFCFE; font-weight: 700; }
.art-tbl span { padding: 9px 11px; border-left: 1px solid var(--border); }
.art-tbl span:first-child { border-left: 0; }
.art-tbl .sel { background: color-mix(in srgb, var(--primary) 8%, transparent); }
.art-tblbar {
  display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 12px; padding: 6px;
  border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow-sm); width: fit-content;
}
.art-tblbar i { font-style: normal; font-size: 11px; font-weight: 700; color: var(--text-3); padding: 0 6px; }
.art-tblbar b { font-size: 12px; font-weight: 600; color: var(--text-2); padding: 5px 8px; border-radius: 6px; }
.art-tblbar b:hover { background: var(--primary-soft); color: var(--primary); }
.art-tblbar b.dg { color: #C6303C; }

/* ② blocks */
.art-blocks { padding: 20px 22px 24px; }
.art-slashline { border-left: 2px solid var(--primary); padding: 3px 0 3px 10px; margin-bottom: 12px; font-size: 17px; }
.art-slashline .cursor { color: var(--text-3); }
.art-menu { border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-md); padding: 6px; }
.art-menu .mt { display: flex; justify-content: space-between; font-size: 11.5px; font-weight: 700; color: var(--text-3); padding: 6px 10px 4px; margin: 0; }
.art-menu .mt span { font-weight: 500; }
.mi { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; }
.mi.on { background: var(--primary-soft); }
.mi b { font-size: 13.5px; font-weight: 600; }
.mi small { flex: 1; font-size: 11.5px; color: var(--text-3); }
.mi kbd { font-size: 11px; }

/* ③ tree */
.art-tree { padding: 16px 18px 20px; }
.t-sec { display: flex; align-items: center; gap: 8px; padding: 11px 12px; background: #FBFCFE; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 8px; }
.t-sec b { font-size: 14px; } .t-sec i { font-style: normal; font-size: 11.5px; color: var(--text-3); }
.t-act { margin-left: auto; color: var(--text-3); letter-spacing: 3px; font-size: 12px; }
.t-page { display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 8px; color: var(--text-2); }
.t-page.ind { padding-left: 30px; }
.t-page.drag { background: #fff; border: 1px solid var(--primary); box-shadow: 0 8px 20px rgba(16,24,40,.1); color: var(--text); font-weight: 600; }
.t-page .grip { color: var(--text-3); letter-spacing: -2px; }
.t-page em { margin-left: auto; font-style: normal; font-size: 11px; color: var(--primary); background: var(--primary-soft); border-radius: 999px; padding: 3px 9px; }
.t-grp { font-size: 11.5px; font-weight: 800; color: var(--text-3); padding: 12px 12px 4px; }

/* ④ search */
.art-search { padding: 22px; background: #F4F6FA; }
.s-box { background: #fff; border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); overflow: hidden; }
.s-in { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--border); font-size: 15.5px; }
.s-in .caret { display: inline-block; width: 1.5px; height: 17px; background: var(--primary); animation: cblink 1.1s steps(1) infinite; }
@keyframes cblink { 50% { opacity: 0; } }
.s-in kbd { margin-left: auto; }
.s-hit { padding: 10px 16px; }
.s-hit.on { background: var(--primary-soft); }
.s-hit b { display: block; font-size: 14px; }
.s-hit small { font-size: 12px; color: var(--text-3); }
.s-note { text-align: center; font-size: 12.5px; color: var(--text-3); margin: 14px 0 0; }

/* ⑤ domain */
.art-domain { padding: 20px 22px 22px; }
.d-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid var(--border); }
.d-row:first-child { border-top: 0; padding-top: 0; }
.d-label { font-size: 12.5px; font-weight: 700; color: var(--text-3); width: 74px; flex-shrink: 0; }
.d-row code { font-size: 13px; color: var(--text-2); }
.d-row code.hi { color: var(--primary); font-weight: 600; }
.badge { font-style: normal; margin-left: auto; font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 4px 10px; }
.badge.ok { background: #EFFAF3; color: #16A34A; }
.d-dns { margin-top: 12px; background: #FBFCFE; border: 1px dashed var(--border-strong); border-radius: 10px; padding: 14px; }
.d-dns p { margin: 0 0 8px; font-size: 12px; font-weight: 700; color: var(--text-3); }
.d-dns code { display: block; background: #fff; border: 1px solid var(--border); border-radius: 7px; padding: 9px 11px; font-size: 12.5px; }
.d-steps { display: flex; gap: 6px; margin-top: 14px; flex-wrap: wrap; }
.d-steps i { font-style: normal; font-size: 11.5px; font-weight: 600; border-radius: 999px; padding: 5px 11px; background: var(--bg); color: var(--text-3); }
.d-steps i.done { background: #EFFAF3; color: #16A34A; }
.d-steps i.live { background: var(--primary); color: #fff; }

/* ⑥ team */
.art-team { padding: 20px 22px 22px; }
.tm-row { display: flex; align-items: center; gap: 6px; margin-bottom: 14px; }
.av { width: 30px; height: 30px; border-radius: 999px; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; margin-left: -8px; border: 2px solid #fff; }
.av:first-child { margin-left: 0; }
.av.a { background: #4A82EC; } .av.b { background: #6D4AE0; } .av.c { background: #16A34A; }
.tm-row em { font-style: normal; margin-left: 10px; font-size: 12.5px; color: var(--text-3); }
.tm-presence { background: #FFF8EB; color: #92600A; border: 1px solid #F5E0B8; border-radius: 10px; padding: 10px 13px; font-size: 12.5px; margin-bottom: 14px; }
.tm-conflict { border: 1px solid var(--border); border-radius: 12px; padding: 14px; box-shadow: var(--shadow-sm); }
.tm-conflict b { display: block; font-size: 13.5px; color: #C6303C; margin-bottom: 6px; }
.tm-conflict p { margin: 0 0 12px; font-size: 12.5px; color: var(--text-2); line-height: 1.6; }
.tm-btns { display: flex; gap: 8px; justify-content: flex-end; }
.tm-btns i { font-style: normal; font-size: 12px; font-weight: 600; border-radius: 8px; padding: 7px 11px; }
.tm-btns .ghost { border: 1px solid var(--border); color: var(--text-2); }
.tm-btns .pri { background: var(--primary); color: #fff; }
.tm-roles { display: flex; align-items: center; gap: 6px; margin-top: 14px; }
.tm-roles i { font-style: normal; font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 4px 10px; background: #EFFAF3; color: #16A34A; }
.tm-roles i.ed { background: var(--bg); color: var(--text-3); }
.tm-roles em { font-style: normal; margin-left: auto; font-size: 11.5px; color: var(--text-3); }

/* ⑦ history */
.art-hist { padding: 20px 22px 22px; }
.h-title { margin: 0 0 12px; font-size: 12.5px; font-weight: 800; color: var(--text-3); }
.h-row { display: flex; align-items: center; gap: 11px; padding: 11px 0; border-top: 1px solid var(--border); position: relative; }
.h-row:first-of-type { border-top: 0; }
.dot { width: 9px; height: 9px; border-radius: 999px; background: var(--border-strong); flex-shrink: 0; }
.dot.now { background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.h-row b { font-size: 13.5px; font-weight: 600; }
.h-row em { font-style: normal; font-size: 12px; color: var(--text-3); margin-left: auto; }
.h-row i { font-style: normal; font-size: 11.5px; font-weight: 600; color: var(--text-2); border: 1px solid var(--border); border-radius: 7px; padding: 4px 9px; }

/* ⑧ stats */
.art-stats { padding: 20px 22px 22px; }
.st-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.st-tiles div { border: 1px solid var(--border); border-radius: 10px; padding: 12px; text-align: center; }
.st-tiles b { display: block; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.st-tiles small { font-size: 11.5px; color: var(--text-3); }
.st-chart { display: flex; align-items: flex-end; gap: 4px; height: 92px; padding: 4px 0 0; border-bottom: 1px solid var(--border); margin-bottom: 14px; }
.st-chart span { flex: 1; background: linear-gradient(180deg, #93B4F2, #D9E5FB); border-radius: 4px 4px 0 0; }
.st-chart span:nth-last-child(-n+3) { background: linear-gradient(180deg, #4A82EC, #9DBBF4); }
.st-list div { display: flex; align-items: center; gap: 10px; padding: 7px 0; font-size: 12.5px; }
.st-list i { font-style: normal; width: 17px; height: 17px; border-radius: 5px; background: var(--bg); color: var(--text-3); font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.st-list .bar { height: 6px; border-radius: 999px; background: var(--primary); margin-left: auto; max-width: 130px; }
.st-list em { font-style: normal; width: 34px; text-align: right; color: var(--text-2); font-weight: 600; }

/* ⑨ ai */
.art-ai { padding: 0; }
.ai-tabs { display: flex; gap: 12px; padding: 12px 18px 0; border-bottom: 1px solid var(--border); }
.ai-tabs u { text-decoration: none; font-size: 12.5px; color: var(--text-3); padding-bottom: 9px; }
.ai-tabs u.on { color: var(--primary); font-weight: 700; box-shadow: inset 0 -2px 0 var(--primary); }
.ai-code { margin: 0; padding: 18px; font-family: "IBM Plex Mono", monospace; font-size: 12.5px; line-height: 1.75; color: var(--text-2); background: #FBFCFE; white-space: pre-wrap; }
.ai-note { margin: 0; padding: 12px 18px 16px; font-size: 12.5px; color: var(--text-3); border-top: 1px solid var(--border); }

/* ── who ─────────────────────────────────────────────────── */
.lp-who { background: #FAFBFD; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.lp-who > .lp-in { padding-top: 84px; padding-bottom: 84px; }
.who-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); gap: 20px; }
.who { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 24px 22px; transition: box-shadow .14s, transform .12s, border-color .14s; }
.who:hover { box-shadow: 0 10px 26px rgba(16,24,40,.07); transform: translateY(-2px); border-color: #C6D4EE; }
.who-ic { display: inline-flex; width: 40px; height: 40px; border-radius: 11px; background: #F0F5FF; color: var(--primary); align-items: center; justify-content: center; margin-bottom: 14px; }
.who h3 { margin: 0 0 8px; font-size: 17px; letter-spacing: -.015em; }
.who p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.7; color: var(--text-2); }
.who-eg { display: inline-block; font-size: 12px; color: var(--text-3); background: var(--bg); border-radius: 7px; padding: 5px 10px; }

/* ── all features ────────────────────────────────────────── */
.lp-all > .lp-in { padding-top: 88px; padding-bottom: 88px; }
.all-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 20px; }
.all-col { border: 1px solid var(--border); border-radius: 16px; padding: 22px 20px; }
.all-col h4 { display: flex; align-items: center; gap: 9px; margin: 0 0 14px; font-size: 15px; letter-spacing: -.015em; }
.all-col h4 .lic { width: 17px; height: 17px; color: var(--primary); }
.all-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.all-col li { position: relative; padding-left: 20px; font-size: 13.8px; line-height: 1.6; color: var(--text-2); }
.all-col li::before {
  content: ''; position: absolute; left: 2px; top: .45em; width: 9px; height: 5px;
  border-left: 2px solid var(--primary); border-bottom: 2px solid var(--primary); transform: rotate(-45deg);
}

/* ── flow ────────────────────────────────────────────────── */
.lp-flow { background: #FAFBFD; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.lp-flow > .lp-in { padding-top: 84px; padding-bottom: 84px; }
.flow { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 22px; margin: 0; padding: 0; }
.flow li { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 26px 24px; position: relative; }
.flow-n { position: absolute; top: -14px; left: 24px; width: 30px; height: 30px; border-radius: 999px; background: var(--text); color: #fff; font-size: 14px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.flow h3 { font-size: 17.5px; margin: 12px 0 8px; letter-spacing: -.015em; }
.flow p { margin: 0 0 18px; font-size: 14.5px; color: var(--text-2); line-height: 1.7; }
.flow-art { border: 1px dashed var(--border-strong); border-radius: 12px; padding: 16px; min-height: 92px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.chip { font-style: normal; font-size: 13px; font-weight: 600; background: #F0F5FF; color: var(--primary); border-radius: 8px; padding: 7px 12px; }
.chip.sm { background: #F4F5F8; color: var(--text-2); font-family: "IBM Plex Mono", monospace; font-size: 12px; }
.blk { font-style: normal; font-size: 12.5px; font-weight: 700; border-radius: 8px; padding: 7px 11px; background: var(--primary); color: #fff; }
.blk.hint { background: #FFF8EB; color: #92600A; }
.blk.tbl { width: 62px; height: 30px; background: repeating-linear-gradient(90deg, #E9EDF5 0 1px, #fff 1px 20px), repeating-linear-gradient(180deg, #E9EDF5 0 1px, #fff 1px 14px); border: 1px solid var(--border); }
.flow-art code { font-family: "IBM Plex Mono", monospace; font-size: 12px; background: #fff; border: 1px solid var(--border); border-radius: 7px; padding: 7px 11px; }
.ok { font-style: normal; font-size: 12.5px; font-weight: 700; color: #16A34A; background: #EFFAF3; border-radius: 999px; padding: 6px 12px; }

/* ── final ───────────────────────────────────────────────── */
.lp-final { background: #0F172A; color: #fff; }
.final-in { text-align: center; padding-top: 96px; padding-bottom: 96px; }
.lp-final h2 { font-size: clamp(28px, 3.4vw, 38px); letter-spacing: -.03em; margin: 0 0 12px; }
.lp-final p { margin: 0 0 26px; color: #B7C0D0; font-size: 16.5px; }
.lp-final .btn.primary { background: #fff; border-color: #fff; color: #0F172A; box-shadow: none; }
.lp-final .btn.primary:hover { background: #E7EDF8; border-color: #E7EDF8; }

.lp-foot { border-top: 1px solid var(--border); }
.foot-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 26px; padding-bottom: 26px; font-size: 13.5px; color: var(--text-3); }

@media (max-width: 1080px) {
  .hero-grid, .show { grid-template-columns: 1fr; gap: 32px; }
  .show.flip .show-copy { order: 0; }
  .mock { transform: none; }
  .strip-grid { grid-template-columns: repeat(2, 1fr); }
  .strip-grid div:nth-child(3) { border-left: 0; }
}

/* ============ NEW: 가져오기 ============ */
/* hero pill */
.lp-new-pill {
  display: inline-flex; align-items: center; gap: 9px; margin: 18px 0 0;
  font-size: 13.5px; font-weight: 600; color: var(--text-2);
  border: 1px solid var(--border); border-radius: 999px; padding: 7px 16px 7px 8px;
  background: #fff; transition: border-color .15s, color .15s;
}
.lp-new-pill b {
  font-size: 10.5px; font-weight: 800; letter-spacing: .08em; color: #fff;
  background: linear-gradient(135deg, #4A82EC, #2A5BC0); border-radius: 999px; padding: 3px 9px;
}
.lp-new-pill:hover { border-color: var(--primary); color: var(--primary); }

/* dark flagship band */
.lp-magic { background: #0F172A; color: #E7ECF6; padding: 84px 0 76px; }
.lp-sec-head.light h2 { color: #fff; }
.lp-sec-head.light p { color: #A8B4CC; }
.lp-sec-head.light p b { color: #fff; }
.magic-new {
  display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .14em;
  color: #9DC0FF; border: 1px solid rgba(157,192,255,.4); border-radius: 999px;
  padding: 4px 13px; margin-bottom: 16px; background: rgba(74,130,236,.12);
}
.magic-grid {
  display: grid; grid-template-columns: 1fr auto 1.25fr; gap: 34px; align-items: center;
  margin: 8px 0 40px;
}
.magic-label { font-size: 11.5px; font-weight: 700; letter-spacing: .1em; color: #7C8AA6; margin: 0 0 12px; text-transform: uppercase; }
.magic-col.in { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; }
.im-file {
  display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14);
  border-radius: 9px; padding: 8px 13px; color: #E7ECF6; white-space: nowrap;
}
.im-file::before { content: ''; width: 9px; height: 11px; border-radius: 2px; flex: none; }
.im-file.hwp::before { background: #3B82F6; }
.im-file.pdf::before { background: #EF4444; }
.im-file.docx::before { background: #2563EB; }
.im-file.img::before { background: #10B981; }
.im-file.url::before { background: #F59E0B; border-radius: 999px; height: 9px; }
.im-file.url { font-family: "IBM Plex Mono", monospace; font-size: 11.5px; font-weight: 500; }
.im-file i { font-style: normal; font-size: 10px; font-weight: 800; color: #6EE7B7; border: 1px solid rgba(110,231,183,.4); border-radius: 4px; padding: 1px 5px; }
.magic-col.mid { text-align: center; }
.magic-core { position: relative; display: inline-grid; place-items: center; margin-bottom: 14px; }
.magic-core b {
  position: relative; z-index: 1; display: inline-grid; place-items: center;
  width: 86px; height: 86px; border-radius: 999px; font-size: 14px;
  background: linear-gradient(150deg, #4A82EC, #2A5BC0); color: #fff;
  box-shadow: 0 10px 34px rgba(74,130,236,.45);
}
.magic-pulse {
  position: absolute; inset: -14px; border-radius: 999px;
  border: 1px solid rgba(122,166,255,.5); animation: magicpulse 2.2s ease-out infinite;
}
@keyframes magicpulse { 0% { transform: scale(.8); opacity: .9; } 100% { transform: scale(1.25); opacity: 0; } }
.magic-steps { display: flex; flex-direction: column; gap: 5px; }
.magic-steps i {
  font-style: normal; font-size: 11.5px; color: #A8B4CC;
  background: rgba(255,255,255,.05); border-radius: 999px; padding: 3px 12px;
}
.magic-site { border-radius: 13px; overflow: hidden; background: #fff; color: var(--text); box-shadow: 0 20px 50px rgba(0,0,0,.4); font-size: 12px; }
.ms-tabs { display: flex; gap: 16px; padding: 10px 16px 0; border-bottom: 1px solid var(--border); font-size: 12px; font-weight: 600; color: var(--text-3); }
.ms-tabs u { text-decoration: none; padding-bottom: 8px; }
.ms-tabs u.on { color: var(--primary); box-shadow: inset 0 -2px 0 var(--primary); }
.ms-body { display: grid; grid-template-columns: 108px 1fr; }
.ms-side { border-right: 1px solid var(--border); padding: 12px 0; }
.ms-side p { margin: 0; padding: 5px 14px; font-size: 11.5px; color: var(--text-2); }
.ms-side p.on { color: var(--primary); font-weight: 700; background: var(--primary-soft); }
.ms-doc { padding: 14px 16px 18px; }
.ms-doc h6 { margin: 0 0 10px; font-size: 14.5px; }
.magic-ai { display: flex; align-items: center; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.magic-ai code {
  font-size: 11px; color: #9DC0FF; background: rgba(74,130,236,.14);
  border: 1px solid rgba(122,166,255,.3); border-radius: 6px; padding: 3px 9px;
}
.magic-ai em { font-style: normal; font-size: 12px; color: #A8B4CC; }
.magic-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; border-top: 1px solid rgba(255,255,255,.1); padding-top: 30px; }
.magic-facts b { display: block; font-size: 21px; letter-spacing: -.02em; color: #fff; margin-bottom: 4px; }
.magic-facts span { font-size: 13px; color: #A8B4CC; }

/* showcase art ⑩ 파일 가져오기 */
.art-import { padding: 22px; }
.art-import .im-in { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.art-import .im-file { background: var(--bg); border-color: var(--border); color: var(--text); }
.art-import .im-file i { color: #059669; border-color: #A7F3D0; }
.im-flow { display: flex; align-items: center; gap: 10px; margin: 4px 0 14px; }
.im-beam { flex: 1; height: 2px; background: repeating-linear-gradient(90deg, var(--primary) 0 8px, transparent 8px 14px); opacity: .6; }
.im-flow em { font-style: normal; font-size: 11.5px; font-weight: 700; color: var(--primary); background: var(--primary-soft); border-radius: 999px; padding: 4px 12px; }
.im-out { border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px; box-shadow: 0 8px 24px rgba(16,24,40,.06); }
.im-out h5 { margin: 0 0 10px; font-size: 16.5px; letter-spacing: -.02em; }
.im-h2 { margin: 12px 0 8px; font-size: 13px; font-weight: 700; color: var(--text); }
.im-note { margin: 12px 2px 0; font-size: 12.5px; color: var(--text-3); }

/* showcase art ⑪ 사이트 통째 */
.art-crawl { padding: 22px; }
.cr-bar {
  display: flex; align-items: center; gap: 10px; border: 1px solid var(--border);
  border-radius: 10px; padding: 9px 12px; background: var(--bg); margin-bottom: 12px;
}
.cr-bar code { flex: 1; font-size: 12px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-bar b { font-size: 12px; color: #fff; background: var(--primary); border-radius: 7px; padding: 5px 12px; white-space: nowrap; }
.cr-scan { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: var(--text-2); margin-bottom: 14px; }
.cr-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--primary); animation: crblink 1.1s ease-in-out infinite; flex: none; }
@keyframes crblink { 50% { opacity: .25; } }
.cr-tree { border: 1px solid var(--border); border-radius: 12px; padding: 10px 0; }
.cr-sec { display: flex; align-items: baseline; gap: 8px; font-weight: 700; font-size: 13px; padding: 7px 16px 5px; }
.cr-sec i { font-style: normal; font-size: 11px; font-weight: 500; color: var(--text-3); font-family: "IBM Plex Mono", monospace; }
.cr-grp { font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--text-3); padding: 7px 16px 3px 28px; text-transform: uppercase; }
.cr-page { font-size: 12.5px; color: var(--text-2); padding: 4px 16px 4px 28px; position: relative; }
.cr-page::before { content: ''; position: absolute; left: 17px; top: 50%; width: 5px; height: 5px; border-radius: 2px; background: #CBD3DF; transform: translateY(-50%); }
.cr-page.ind { padding-left: 40px; }
.cr-page.ind::before { left: 29px; }

@media (max-width: 960px) {
  .magic-grid { grid-template-columns: 1fr; gap: 26px; }
  .magic-col.mid { display: flex; align-items: center; gap: 18px; }
  .magic-steps { flex-direction: row; flex-wrap: wrap; }
  .magic-facts { grid-template-columns: repeat(2, 1fr); }
}

/* ============ NEW: MCP · RAG · 비공개 · 연결 · 아껴읽기 아트 ============ */
.art-mcp { padding: 20px; }
.mcp-bar { display: flex; align-items: center; gap: 10px; border: 1px solid var(--border); border-radius: 10px; padding: 9px 12px; background: var(--bg); }
.mcp-dot { width: 8px; height: 8px; border-radius: 999px; background: #16A34A; flex: none; box-shadow: 0 0 0 4px rgba(22,163,74,.14); }
.mcp-bar code { flex: 1; font-size: 12px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mcp-bar b { font-size: 12px; color: #fff; background: var(--primary); border-radius: 7px; padding: 5px 12px; }
.mcp-targets { display: flex; align-items: center; gap: 7px; margin: 12px 0 14px; flex-wrap: wrap; }
.mcp-targets i { font-style: normal; font-size: 12px; font-weight: 700; border: 1px solid var(--border); border-radius: 999px; padding: 4px 13px; background: #fff; }
.mcp-targets em { font-style: normal; font-size: 12px; color: var(--text-3); }
.mcp-chat { display: flex; flex-direction: column; gap: 8px; }
.mc-q { align-self: flex-end; background: var(--primary); color: #fff; border-radius: 13px 13px 3px 13px; padding: 9px 14px; font-size: 13px; max-width: 80%; }
.mc-tool { align-self: flex-start; font-size: 11.5px; color: var(--text-3); background: var(--bg); border: 1px dashed var(--border-strong); border-radius: 8px; padding: 6px 11px; font-family: "IBM Plex Mono", monospace; }
.mc-a { align-self: flex-start; background: var(--bg); border-radius: 13px 13px 13px 3px; padding: 10px 14px; font-size: 13px; line-height: 1.65; max-width: 88%; }
.mc-a span { display: inline-block; margin-top: 6px; font-size: 11.5px; color: var(--primary); font-weight: 600; }

.art-rag { padding: 20px; }
.rag-row { display: grid; grid-template-columns: 26px 1fr 24px; gap: 12px; align-items: center; border: 1px solid var(--border); border-radius: 11px; padding: 11px 14px; margin-bottom: 8px; }
.rag-row i { font-style: normal; width: 24px; height: 24px; border-radius: 999px; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: var(--primary-soft); color: var(--primary); }
.rag-row b { font-size: 13.5px; }
.rag-row p { margin: 2px 0 0; font-size: 12px; color: var(--text-2); }
.rag-row span { color: #16A34A; font-weight: 800; }
.rag-row.run { border-color: color-mix(in srgb, var(--primary) 40%, transparent); }
.rag-spin { width: 16px; height: 16px; border-radius: 50%; border: 2.5px solid var(--primary-soft); border-top-color: var(--primary); animation: impspin2 .8s linear infinite; display: inline-block; }
@keyframes impspin2 { to { transform: rotate(360deg); } }

.art-priv { padding: 20px; }
.pv-head { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; font-size: 14px; }
.pv-head .badge { margin-left: auto; }
.pv-row { display: flex; align-items: center; gap: 10px; border: 1px solid var(--border); border-radius: 10px; padding: 9px 13px; margin-bottom: 7px; font-size: 13px; }
.pv-row .av { width: 26px; height: 26px; border-radius: 999px; display: grid; place-items: center; color: #fff; font-size: 12px; font-weight: 700; flex: none; }
.av.a { background: #4A82EC; } .av.b { background: #7C3AED; } .av.c { background: #94A3B8; }
.pv-row code { margin-left: auto; font-size: 11.5px; color: var(--text-3); }
.pv-row em { font-style: normal; font-size: 11.5px; color: #16A34A; font-weight: 600; }
.pv-row u { text-decoration: none; font-size: 11.5px; color: #C6303C; font-weight: 700; }
.pv-row.off { opacity: .55; }
.pv-row.off b { text-decoration: line-through; }
.badge.ok { font-size: 11px; font-weight: 700; color: #15803D; background: #EFFBF2; border-radius: 999px; padding: 3px 11px; }

.art-links { padding: 20px; }
.lk-doc { border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px; }
.lk-doc h5 { margin: 0 0 8px; font-size: 15.5px; }
.lk-doc p { margin: 0; font-size: 13px; line-height: 1.9; color: var(--text-2); }
.wik { color: var(--primary); font-weight: 600; border-bottom: 1.5px dashed color-mix(in srgb, var(--primary) 45%, transparent); cursor: pointer; }
.lk-back { border: 1px solid var(--border); border-radius: 12px; padding: 12px 16px; margin-top: 10px; background: var(--bg); }
.lk-back-head { margin: 0 0 8px; font-size: 11.5px; font-weight: 800; letter-spacing: .06em; color: var(--text-3); }
.lk-back span { display: inline-block; font-size: 12.5px; font-weight: 600; color: var(--primary); background: #fff; border: 1px solid var(--border); border-radius: 999px; padding: 4px 12px; margin: 0 6px 6px 0; }

.art-tok { padding: 20px; }
.tk-step { display: grid; grid-template-columns: 24px 1fr auto; gap: 11px; align-items: center; border: 1px solid var(--border); border-radius: 11px; padding: 10px 13px; margin-bottom: 7px; }
.tk-step b { width: 22px; height: 22px; border-radius: 999px; display: grid; place-items: center; font-size: 11.5px; background: var(--bg); color: var(--text-2); }
.tk-t { margin: 0 0 2px; font-size: 13px; font-weight: 700; }
.tk-step code { font-size: 11.5px; color: var(--text-3); }
.tk-cost { font-size: 11.5px; font-weight: 700; color: var(--text-3); white-space: nowrap; }
.tk-cost.ok { color: #16A34A; }
.tk-step.on { border-color: color-mix(in srgb, var(--primary) 45%, transparent); background: var(--primary-soft); }
.tk-step.on b { background: var(--primary); color: #fff; }
.tk-skip { display: flex; gap: 10px; align-items: center; margin: 10px 2px 0; font-size: 12px; color: var(--text-3); }
.tk-skip span { font-weight: 800; font-size: 10.5px; letter-spacing: .08em; color: #C6303C; background: #FDF3F4; border-radius: 999px; padding: 3px 10px; }
.tk-skip del { color: var(--text-3); }

/* ============ 공감 섹션 (우리 회사, 이렇지 않나요?) ============ */
.lp-pain { padding: 72px 0 76px; }
.pain-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-bottom: 40px; }
.pain { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 26px 24px; box-shadow: 0 8px 24px rgba(16,24,40,.05); }
.pain-ic { font-size: 26px; display: block; margin-bottom: 14px; }
.pain h3 { font-size: 17px; letter-spacing: -.02em; margin: 0 0 8px; }
.pain p { font-size: 14px; color: var(--text-2); line-height: 1.75; margin: 0; }
.pain-answer { background: #F6F9FF; border: 1px solid #DCE7FB; border-radius: 20px; padding: 36px 40px; }
.pa-lead { font-size: 21px; letter-spacing: -.02em; line-height: 1.5; margin: 0 0 22px; text-align: center; }
.pa-lead b { color: var(--primary); }
.pa-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 26px; }
.pa-step { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 18px 20px; }
.pa-step-tag { display: inline-block; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; color: var(--primary); background: var(--primary-soft); border-radius: 999px; padding: 4px 13px; margin-bottom: 10px; }
.pa-step p { margin: 0; font-size: 13.5px; color: var(--text-2); line-height: 1.8; }
.pa-step p b { color: var(--text); }
.pa-flow { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }
.pa-chip { font-size: 13.5px; font-weight: 600; color: var(--text-3); background: #fff; border: 1px dashed var(--border-strong); border-radius: 999px; padding: 9px 20px; }
.pa-chip.on { color: #fff; background: linear-gradient(135deg, #4A82EC, #2A5BC0); border: 0; box-shadow: 0 6px 18px rgba(42,91,192,.3); }
.pa-arrow { font-size: 18px; color: var(--text-3); }
@media (max-width: 900px) { .pain-grid, .pa-steps { grid-template-columns: 1fr; } }

/* 히어로: A하면 B 등식 */
.lp-hero-eq { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin: 20px 0 4px; }
.lp-hero-eq span { font-size: 13.5px; font-weight: 700; }
.eq-in { color: var(--text-2); background: var(--bg); border: 1px dashed var(--border-strong); border-radius: 999px; padding: 8px 16px; }
.eq-arrow { color: var(--primary); font-size: 13px; }
.eq-out { color: #1D4FB0; background: #EAF1FF; border: 1px solid #CFE0FF; border-radius: 999px; padding: 8px 16px; }
.eq-plus { color: var(--text-3); }

/* ============ 파이프라인 흐름도 (다크 밴드) ============ */
.pipe { display: flex; align-items: stretch; gap: 10px; margin: 10px 0 34px; }
.pipe-node {
  flex: 1; min-width: 0; background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.13); border-radius: 14px;
  padding: 16px 12px 14px; text-align: center;
}
.pipe-node i {
  font-style: normal; display: inline-grid; place-items: center;
  width: 30px; height: 30px; border-radius: 999px; margin-bottom: 9px;
  font-size: 13px; font-weight: 800; background: rgba(122,166,255,.16); color: #9DC0FF;
}
.pipe-node b { display: block; font-size: 13.5px; color: #fff; margin-bottom: 6px; }
.pipe-node p { margin: 0; font-size: 11.5px; line-height: 1.6; color: #A8B4CC; }
.pipe-node.in { border-style: dashed; border-color: rgba(255,255,255,.3); }
.pipe-node.in i, .pipe-node.out i { font-size: 16px; background: transparent; }
.pipe-node.out {
  background: linear-gradient(160deg, rgba(74,130,236,.28), rgba(42,91,192,.18));
  border-color: rgba(122,166,255,.45);
}
.pipe-arrow { align-self: center; color: #5B6B8C; font-size: 15px; font-weight: 800; flex: none; }
.magic-outs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 38px; }
.mo-card { min-width: 0; }
.mo-mcp { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.13); border-radius: 13px; padding: 14px 16px; }
.mo-url { display: flex; align-items: center; gap: 9px; background: rgba(0,0,0,.3); border: 1px solid rgba(255,255,255,.12); border-radius: 9px; padding: 8px 12px; margin-bottom: 12px; }
.mo-url code { font-size: 12px; color: #C9D6EE; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mo-chat { display: flex; flex-direction: column; gap: 7px; margin-bottom: 12px; }
.mc-q.dark { background: #4A82EC; }
.mc-a.dark { background: rgba(255,255,255,.09); color: #E7ECF6; }
.mc-a.dark span { color: #9DC0FF; }
@media (max-width: 960px) {
  .pipe { flex-direction: column; }
  .pipe-arrow { transform: rotate(90deg); align-self: center; }
  .magic-outs { grid-template-columns: 1fr; }
}

/* ============ 보안 섹션·페이지 ============ */
.lp-secure { padding: 72px 0 76px; background: #FAFBFD; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.sec-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.sec-grid.two { grid-template-columns: repeat(2, 1fr); gap: 18px; }
.sec-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 24px 22px; box-shadow: 0 8px 24px rgba(16,24,40,.05); }
.sec-ic { font-size: 24px; display: block; margin-bottom: 12px; }
.sec-card h3 { font-size: 16px; letter-spacing: -.02em; margin: 0 0 8px; }
.sec-card p { font-size: 13.5px; color: var(--text-2); line-height: 1.75; margin: 0; }
.sp-flow { display: flex; align-items: stretch; gap: 12px; margin-bottom: 26px; }
.sp-node { flex: 1; text-align: center; background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 20px 14px; }
.sp-node i { font-style: normal; font-size: 22px; display: block; margin-bottom: 8px; }
.sp-node b { display: block; font-size: 15px; margin-bottom: 5px; }
.sp-node p { margin: 0; font-size: 12.5px; color: var(--text-2); line-height: 1.6; }
.sp-node.del { border-color: #F3C0C6; background: #FDF7F7; }
.sp-arrow { align-self: center; color: var(--text-3); font-weight: 800; }
.sp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.sp-col { border-radius: 16px; padding: 22px 26px; }
.sp-col.keep { background: #F2FBF5; border: 1px solid #C9EBD4; }
.sp-col.drop { background: #FDF6F6; border: 1px solid #F3D3D7; }
.sp-col h3 { margin: 0 0 12px; font-size: 15.5px; }
.sp-col ul { margin: 0; padding-left: 18px; }
.sp-col li { font-size: 13.5px; line-height: 2; color: var(--text-2); }
@media (max-width: 960px) {
  .sec-grid, .sec-grid.two, .sp-cols { grid-template-columns: 1fr; }
  .sp-flow { flex-direction: column; }
  .sp-arrow { transform: rotate(90deg); }
}

/* 히어로 뱃지 확대 + h1 두 줄 고정 */
.lp-eyebrow.badge-pill {
  display: inline-block; font-size: 14px; font-weight: 700; letter-spacing: .02em;
  text-transform: none; color: #1D4FB0; background: #EAF1FF; border: 1px solid #CFE0FF;
  border-radius: 999px; padding: 8px 18px; margin: 0 0 20px;
}
.lp-hero h1 { font-size: clamp(34px, 3.05vw, 46px); }
.lp-hero h1 .h1line { white-space: nowrap; }

/* ============ v31: 아이콘·여백·폰트·보안 비주얼·푸터 ============ */
/* 카피 폰트 업스케일 */
body.lp { font-size: 17px; }
.lp-sub { font-size: 19px; }
.lp-sec-head p { font-size: 17.5px; }
.show-copy > p { font-size: 17px; }
.show-list li { font-size: 15.5px; }
.who h3 { font-size: 18px; } .who p { font-size: 15.5px; }
.pain h3 { font-size: 18px; } .pain p { font-size: 15px; }
.pa-lead { font-size: 23px; } .pa-step p { font-size: 14.5px; }
.sec-card h3 { font-size: 17px; } .sec-card p { font-size: 14.5px; }
.strip-grid span { font-size: 14px; }
.lp-note { font-size: 13.5px; }
.magic-facts span { font-size: 14px; }
.sp-col li { font-size: 14.5px; }
.flow li p { font-size: 15px; }
.lp-hero-eq span { font-size: 14.5px; }
.lp-new-pill { font-size: 14.5px; }

/* pill ↔ CTA 여백 */
.lp-new-pill { margin: 16px 0 0; }
.lp-hero .lp-cta { margin-top: 20px; }

/* 인라인 자체 아이콘 정렬 */
.eq-in .lic, .eq-out .lic { width: 16px; height: 16px; vertical-align: -3px; margin-right: 6px; }
.pain-ic .lic { width: 30px; height: 30px; color: var(--primary); }
.sec-ic .lic { width: 28px; height: 28px; color: var(--primary); }
.pipe-node i .lic { width: 20px; height: 20px; color: #9DC0FF; }
.sp-node i .lic { width: 24px; height: 24px; color: var(--primary); }
.sp-node.del i .lic { color: #C6303C; }
.sp-col h3 .lic { width: 17px; height: 17px; vertical-align: -3px; margin-right: 6px; color: #15803D; }
.sp-col h3.drop .lic { color: #C6303C; }
.all-ic .lic { width: 19px; height: 19px; color: var(--primary); }
.pv-lock .lic { width: 18px; height: 18px; }
.sp-node p del { color: #C6303C; }
.sp-node.keep { border-color: #C9EBD4; background: #F6FCF8; }

/* 기능 전부 보기 카드화 */
.all-col { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 22px 22px 18px; box-shadow: 0 8px 24px rgba(16,24,40,.05); }
.all-col h4 { font-size: 16.5px; gap: 10px; margin-bottom: 16px; }
.all-ic { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--primary-soft); flex: none; }
.all-col li { font-size: 14.5px; line-height: 1.65; padding: 7px 0 7px 26px; border-top: 1px solid #F1F3F7; }
.all-col li:first-child { border-top: 0; }
.all-col li::before { content: ''; position: absolute; left: 2px; top: 13px; width: 12px; height: 7px; border-left: 2px solid var(--primary); border-bottom: 2px solid var(--primary); transform: rotate(-45deg); background: none; border-radius: 0; }

/* 랜딩 보안 비주얼 밴드 */
.secv { display: grid; grid-template-columns: 1fr 1.7fr 1fr; gap: 16px; margin-bottom: 26px; }
.secv-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 18px 18px 16px; text-align: center; box-shadow: 0 8px 24px rgba(16,24,40,.05); }
.secv-t { margin: 0 0 12px; font-size: 12px; font-weight: 800; letter-spacing: .07em; color: var(--text-3); }
.secv-b { margin: 12px 0 0; font-size: 13px; font-weight: 600; color: var(--text-2); }
.secv-file { display: inline-flex; align-items: center; gap: 10px; border: 1px dashed #E3B7BC; background: #FDF7F7; border-radius: 10px; padding: 10px 16px; font-size: 14px; }
.secv-file del { color: #A8666E; }
.secv-x .lic { width: 18px; height: 18px; color: #C6303C; }
.secv-enc { display: flex; align-items: center; gap: 12px; }
.secv-enc code { flex: 1; min-width: 0; font-size: 11.5px; border-radius: 9px; padding: 12px 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.secv-enc code.plain { background: var(--bg); border: 1px solid var(--border); color: var(--text-2); }
.secv-enc code.cipher { background: #10192E; color: #7EE3A1; border: 1px solid #223252; }
.secv-lockwrap { position: relative; display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 999px; background: var(--primary); flex: none; }
.secv-lockwrap .lic { width: 20px; height: 20px; color: #fff; }
.secv-pulse { position: absolute; inset: -7px; border-radius: 999px; border: 2px solid color-mix(in srgb, var(--primary) 45%, transparent); animation: magicpulse 2s ease-out infinite; }
.secv-kr { font-size: 34px; line-height: 1.4; }

/* 보안 페이지: 다크 히어로 */
.sec-hero { background: #0F172A; color: #E7ECF6; padding: 76px 0 64px; }
.sec-hero-in { max-width: 780px; margin: 0 auto; text-align: center; }
.sec-hero h1 { font-size: clamp(36px, 4vw, 52px); letter-spacing: -.04em; color: #fff; margin: 14px 0 16px; }
.sec-hero p { font-size: 17.5px; line-height: 1.8; color: #A8B4CC; margin: 0 0 34px; }
.sec-shield { position: relative; display: inline-grid; place-items: center; width: 92px; height: 92px; margin-bottom: 20px; }
.sec-shield svg { width: 52px; height: 52px; color: #9DC0FF; position: relative; z-index: 1; }
.sec-ring { position: absolute; inset: 0; border-radius: 999px; border: 1px solid rgba(122,166,255,.4); }
.sec-ring.r1 { animation: magicpulse 2.4s ease-out infinite; }
.sec-ring.r2 { inset: 12px; background: rgba(74,130,236,.14); border-color: rgba(122,166,255,.5); }
.sec-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sec-stats div { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; padding: 16px 10px; }
.sec-stats b { display: block; font-size: 22px; letter-spacing: -.02em; color: #fff; margin-bottom: 4px; }
.sec-stats span { font-size: 12.5px; color: #A8B4CC; }
.sec-sect { padding: 70px 0; }
.sec-sect.dark { background: #0F172A; }

/* 보안 페이지: 암호화 데모 */
.enc-demo { display: grid; grid-template-columns: 1fr auto 1fr; gap: 22px; align-items: center; }
.enc-side { min-width: 0; }
.enc-label { margin: 0 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .06em; color: #7C8AA6; }
.enc-plain { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.15); border-radius: 12px; padding: 14px 16px; font-size: 13.5px; line-height: 1.7; color: #E7ECF6; }
.enc-plain.mono { font-family: "IBM Plex Mono", monospace; font-size: 12.5px; color: #C9D6EE; }
.enc-cipher { position: relative; background: #060D1D; border: 1px solid #223252; border-radius: 12px; padding: 14px 16px; font-family: "IBM Plex Mono", monospace; font-size: 12.5px; line-height: 1.8; color: #7EE3A1; word-break: break-all; }
.enc-badge { position: absolute; top: -9px; right: 12px; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; color: #7EE3A1; background: #0F172A; border: 1px solid #2C5240; border-radius: 999px; padding: 2px 10px; }
.enc-mid { text-align: center; }
.enc-lock { position: relative; display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 999px; background: linear-gradient(150deg, #4A82EC, #2A5BC0); box-shadow: 0 10px 30px rgba(74,130,236,.45); margin-bottom: 10px; }
.enc-lock .lic { width: 28px; height: 28px; color: #fff; }
.enc-mid em { display: block; font-style: normal; font-size: 12px; font-weight: 800; letter-spacing: .06em; color: #9DC0FF; }
.enc-note { text-align: center; margin: 26px 0 0; font-size: 13px; color: #7C8AA6; }

/* 보안 페이지: 삭제 연쇄 */
.del-demo { display: flex; align-items: center; justify-content: center; gap: 26px; }
.del-btn { display: inline-flex; align-items: center; gap: 9px; background: #C6303C; color: #fff; font-weight: 700; font-size: 15px; border-radius: 12px; padding: 14px 24px; box-shadow: 0 10px 26px rgba(198,48,60,.3); }
.del-btn .lic { width: 18px; height: 18px; }
.del-arrow { font-size: 20px; font-weight: 800; color: var(--text-3); }
.del-stack { display: flex; flex-direction: column; gap: 8px; min-width: 300px; }
.del-item { display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--border); border-radius: 10px; padding: 10px 16px; background: #FAFAFB; }
.del-item del { font-size: 14px; color: var(--text-3); }
.del-item em { font-style: normal; font-size: 11.5px; font-weight: 800; color: #C6303C; background: #FDF3F4; border-radius: 999px; padding: 3px 11px; }

/* 보안 페이지: 접근 제어 2열 */
.sec-access { display: grid; grid-template-columns: 1.1fr 1fr; gap: 26px; align-items: center; }
.acc-points { display: flex; flex-direction: column; gap: 16px; }
.acc-point { display: flex; gap: 14px; align-items: flex-start; }
.acc-point > .lic { width: 22px; height: 22px; color: var(--primary); flex: none; margin-top: 2px; }
.acc-point b { display: block; font-size: 15.5px; margin-bottom: 3px; }
.acc-point p { margin: 0; font-size: 14px; color: var(--text-2); line-height: 1.7; }

/* 푸터 확장 */
.lp-foot { border-top: 1px solid var(--border); background: #FAFBFD; padding: 46px 0 36px; }
.foot-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 26px; margin-bottom: 30px; }
.foot-brand p { margin: 12px 0 0; font-size: 13.5px; color: var(--text-3); line-height: 1.7; }
.foot-col h5 { margin: 4px 0 12px; font-size: 13px; letter-spacing: .04em; color: var(--text-3); }
.foot-col a { display: block; font-size: 14px; color: var(--text-2); padding: 5px 0; }
.foot-col a:hover { color: var(--primary); }
.foot-legal { border-top: 1px solid var(--border); padding-top: 20px; }
.foot-legal p { margin: 3px 0; font-size: 12.5px; color: var(--text-3); }
@media (max-width: 900px) {
  .secv, .enc-demo, .sec-access { grid-template-columns: 1fr; }
  .sec-stats, .foot-grid { grid-template-columns: repeat(2, 1fr); }
  .del-demo { flex-direction: column; }
}

/* ============ 기술 페이지 ============ */
.tc-vs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.tc-col { border-radius: 18px; padding: 26px 26px 22px; border: 1px solid var(--border); background: #fff; }
.tc-col.bad { background: #FDF9F9; border-color: #F0D8DB; }
.tc-col.good { background: #F5FBF7; border-color: #CBE9D6; }
.tc-head { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: 16.5px; font-weight: 800; }
.tc-head .lic { width: 18px; height: 18px; }
.tc-col.bad .tc-head .lic { color: #C6303C; }
.tc-col.good .tc-head .lic { color: #15803D; }
.tc-doc { border: 1px dashed var(--border-strong); border-radius: 12px; padding: 13px 16px; font-size: 14px; font-weight: 700; background: #fff; }
.tc-doc span { display: block; margin-top: 5px; font-size: 12.5px; font-weight: 500; color: var(--text-3); line-height: 1.6; }
.tc-doc.hit { border-style: solid; border-color: #A7D8BC; }
.tc-meter { height: 12px; border-radius: 999px; background: #EDEFF3; margin: 14px 0 6px; overflow: hidden; }
.tc-meter i { display: block; height: 100%; background: #DB6B75; border-radius: 999px; }
.tc-meter i.ok { background: #34A46A; }
.tc-cap { margin: 0 0 14px; font-size: 12.5px; font-weight: 700; color: var(--text-3); }
.tc-list { margin: 0; padding-left: 18px; }
.tc-list li { font-size: 14px; line-height: 1.9; color: var(--text-2); }

.tp-steps { display: flex; flex-direction: column; gap: 14px; }
.tp-step { display: grid; grid-template-columns: 44px 1fr; gap: 16px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: 16px; padding: 22px 24px; }
.tp-n { width: 34px; height: 34px; border-radius: 999px; display: grid; place-items: center; font-size: 15px; font-weight: 800; background: linear-gradient(150deg, #4A82EC, #2A5BC0); color: #fff; }
.tp-body b { display: block; font-size: 17px; color: #fff; margin-bottom: 6px; }
.tp-body p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.75; color: #A8B4CC; }
.tp-art { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tp-art code { font-size: 12px; color: #C9D6EE; background: rgba(0,0,0,.3); border: 1px solid rgba(255,255,255,.12); border-radius: 8px; padding: 8px 12px; }
.tp-enc { font-style: normal; color: #7EE3A1; }
.tp-chip { font-size: 12px; font-weight: 600; color: #C9D6EE; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); border-radius: 999px; padding: 5px 13px; }
.tp-chip.ok { color: #7EE3A1; border-color: rgba(126,227,161,.35); }
.tp-chip.dim { opacity: .45; }
.tp-rrf span, .tp-ladder span { font-size: 13px; font-weight: 700; color: #C9D6EE; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); border-radius: 9px; padding: 7px 14px; }
.tp-plus, .tp-eq { background: none !important; border: 0 !important; color: #7C8AA6 !important; padding: 0 !important; }
.tp-win { color: #fff !important; background: linear-gradient(150deg, #4A82EC, #2A5BC0) !important; border: 0 !important; }
.tp-ladder i { font-style: normal; color: #5B6B8C; font-weight: 800; }
.tp-ladder span.on { color: #fff; background: linear-gradient(150deg, #4A82EC, #2A5BC0); border: 0; }
.tp-ladder span.dim { opacity: .4; }

.bench-wrap { max-width: 860px; margin: 0 auto; }
.bench { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; box-shadow: 0 8px 24px rgba(16,24,40,.05); }
.bench th { text-align: left; font-size: 13px; color: var(--text-3); font-weight: 700; padding: 14px 18px; background: #FBFCFE; border-bottom: 1px solid var(--border); }
.bench th span { display: block; font-size: 11px; font-weight: 500; margin-top: 2px; }
.bench td { padding: 13px 18px; font-size: 14.5px; border-bottom: 1px solid #F1F3F7; position: relative; }
.bench td i { position: absolute; left: 0; top: 0; bottom: 0; background: #EAF1FF; z-index: 0; }
.bench td { z-index: 1; }
.bench td:nth-child(2) { font-weight: 700; }
.bench td:nth-child(2) i { border-radius: 0; }
.bench tr.win td { background: #F5FBF7; font-weight: 700; }
.bench tr.win td:nth-child(2) i { background: #D6F0E0; }
.bench td:not(:first-child) { font-variant-numeric: tabular-nums; }
.bench-note { margin: 16px 4px 0; font-size: 14px; color: var(--text-2); line-height: 1.8; }
@media (max-width: 900px) { .tc-vs { grid-template-columns: 1fr; } }

/* 보안 히어로: 방패는 뱃지 위에 단독 배치 */
.sec-shield { display: grid; margin: 0 auto 18px; }
.lp-logo .brand-lockup { height: 32px; }
.foot-brand .brand-lockup { height: 26px; }

/* ---------- 약관·정책 ---------- */
.legal { padding: 56px 0 80px; }
.legal-in { max-width: 760px; }
.legal h1 { font-size: 34px; letter-spacing: -.03em; margin: 0 0 6px; }
.legal-meta { font-size: 13.5px; color: var(--text-3); margin: 0 0 34px; }
.legal h2 { font-size: 18px; letter-spacing: -.02em; margin: 34px 0 10px; }
.legal p { font-size: 15.5px; line-height: 1.9; color: var(--text-2); margin: 0 0 12px; }
.legal ul { margin: 0 0 12px; padding-left: 20px; }
.legal li { font-size: 15.5px; line-height: 1.9; color: var(--text-2); }
.legal a { color: var(--primary); font-weight: 600; }

/* 6열 푸터 — 밝은 배경(다크 CTA 와 대비 유지) */
.lp-foot { background: #FAFBFD; border-top: 1px solid var(--border); color: var(--text-2); padding: 52px 0 38px; }
.foot-grid { grid-template-columns: 1.8fr repeat(3, 1fr); gap: 30px; }
.foot-brand p { color: var(--text-3); }
.foot-col h5 { color: var(--text); font-size: 13.5px; font-weight: 700; }
.foot-col a { color: var(--text-2); font-size: 13.5px; }
.foot-col a:hover { color: var(--primary); }
.foot-legal { border-top: 1px solid var(--border); padding-top: 22px; }
.foot-legal p { color: var(--text-3); }
.foot-bottom { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; flex-wrap: wrap; gap: 10px; }
.foot-bottom span { font-size: 12.5px; color: var(--text-3); }
.foot-bottom-links a { color: var(--text-2); font-size: 12.5px; margin-left: 16px; }
.foot-bottom-links a:hover { color: var(--primary); }
@media (max-width: 900px) { .foot-grid { grid-template-columns: repeat(2, 1fr); } }
.foot-biz p { margin: 2px 0; }
.foot-bottom { margin-top: 22px; }

/* 푸터 폰트 업스케일 */
.lp-foot { padding: 60px 0 44px; }
.foot-col h5 { font-size: 15px; margin-bottom: 14px; }
.foot-col a { font-size: 15px; padding: 7px 0; }
.foot-brand p { font-size: 15px; line-height: 1.75; margin-top: 14px; }
.foot-legal p { font-size: 13.5px; line-height: 1.75; }
.foot-bottom span, .foot-bottom-links a { font-size: 13.5px; }
.foot-bottom-links a { margin-left: 18px; }

/* ============ 사내 RAG 배너(랜딩) ============ */
.lp-rag { padding: 70px 0; background: linear-gradient(180deg, #F6F9FF, #fff); border-top: 1px solid var(--border); }
.rag-band { display: grid; grid-template-columns: 1fr 1.05fr; gap: 44px; align-items: center; }
.rag-badge { display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .1em; color: var(--primary); background: #EAF1FF; border-radius: 999px; padding: 5px 14px; margin-bottom: 16px; }
.rag-band-copy h2 { font-size: clamp(28px, 3.1vw, 38px); letter-spacing: -.03em; line-height: 1.25; margin: 0 0 16px; }
.rag-hl { color: var(--primary); }
.rag-band-copy p { font-size: 16.5px; line-height: 1.85; color: var(--text-2); margin: 0 0 22px; }
.rag-band-art { display: grid; grid-template-columns: 1fr auto 1fr; gap: 14px; align-items: center; }
.rgb-col { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 18px 16px; box-shadow: 0 8px 24px rgba(16,24,40,.06); }
.rgb-col.ok { border-color: #C9EBD4; background: #F7FCF9; }
.rgb-h { margin: 0 0 12px; font-size: 12px; font-weight: 800; letter-spacing: .06em; color: var(--text-3); text-align: center; }
.rgb-item { display: block; font-size: 12.5px; color: var(--text-3); background: var(--bg); border-radius: 8px; padding: 7px 10px; margin-bottom: 6px; text-align: center; }
.rgb-item.on { color: #15803D; background: #EAF8EF; font-weight: 700; }
.rgb-foot { margin: 12px 0 0; font-size: 12px; font-weight: 800; color: #C6303C; text-align: center; }
.rgb-foot.ok { color: #15803D; }
.rgb-arrow { color: var(--text-3); font-weight: 800; font-size: 18px; }

/* ============ /rag 페이지 ============ */
.rg-steps { display: flex; flex-direction: column; gap: 10px; }
.rg-step { display: grid; grid-template-columns: 34px 1fr auto; gap: 14px; align-items: start; background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 16px 18px; box-shadow: 0 6px 18px rgba(16,24,40,.04); }
.rg-n { width: 30px; height: 30px; border-radius: 999px; display: grid; place-items: center; font-size: 13px; font-weight: 800; background: #FDF3F4; color: #C6303C; }
.rg-body b { display: block; font-size: 16px; margin-bottom: 4px; }
.rg-pain { margin: 0 0 4px; font-size: 14px; color: #C6303C; font-weight: 600; }
.rg-detail { margin: 0; font-size: 13.5px; color: var(--text-2); line-height: 1.7; }
.rg-weeks { font-size: 12.5px; font-weight: 800; color: var(--text-3); white-space: nowrap; background: var(--bg); border-radius: 999px; padding: 5px 12px; }
.rg-total { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 26px 0 0; }
.rg-total > div { background: #FDF7F7; border: 1px solid #F0D8DB; border-radius: 14px; padding: 18px; text-align: center; }
.rg-total-label { display: block; font-size: 12.5px; color: var(--text-3); margin-bottom: 6px; }
.rg-total b { font-size: 20px; letter-spacing: -.02em; color: #A8323D; }
.rg-note { margin: 20px 2px 0; font-size: 14.5px; color: var(--text-2); line-height: 1.8; }
.rg-vs { display: grid; grid-template-columns: 1fr auto 1.15fr; gap: 20px; align-items: center; margin-bottom: 34px; }
.rg-vs-col { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.13); border-radius: 16px; padding: 22px 24px; }
.rg-vs-col.after { background: rgba(74,130,236,.13); border-color: rgba(122,166,255,.4); }
.rg-vs-head { margin: 0 0 14px; font-size: 13px; font-weight: 800; letter-spacing: .06em; color: #7C8AA6; }
.rg-vs-col.after .rg-vs-head { color: #9DC0FF; }
.rg-vs-col ul { margin: 0; padding: 0; list-style: none; }
.rg-vs-col li { font-size: 14px; color: #7C8AA6; padding: 6px 0; }
.rg-vs-col s { color: #6B7893; }
.rg-after { margin: 0; padding-left: 20px; }
.rg-after li { color: #E7ECF6; font-size: 15px; padding: 8px 0; }
.rg-after b { display: block; }
.rg-after span { display: block; font-size: 13px; color: #A8B4CC; margin-top: 2px; line-height: 1.6; }
.rg-vs-foot { margin: 16px 0 0; font-size: 13px; font-weight: 800; color: #E08A93; }
.rg-vs-foot.ok { color: #7EE3A1; }
.rg-vs-arrow { color: #5B6B8C; font-weight: 800; font-size: 20px; }
.rg-covered { border-top: 1px solid rgba(255,255,255,.12); padding-top: 28px; }
.rg-covered-head { margin: 0 0 18px; font-size: 16px; font-weight: 700; color: #fff; text-align: center; }
.rg-covered-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.rg-covered-grid > div { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: 16px; }
.rg-covered-grid b { display: block; font-size: 14px; color: #9DC0FF; margin-bottom: 6px; }
.rg-covered-grid span { font-size: 12.5px; color: #A8B4CC; line-height: 1.65; }
@media (max-width: 960px) {
  .rag-band, .rg-vs, .rag-band-art { grid-template-columns: 1fr; }
  .rg-total, .rg-covered-grid { grid-template-columns: 1fr 1fr; }
  .rg-step { grid-template-columns: 30px 1fr; }
  .rg-weeks { grid-column: 2; justify-self: start; }
}

/* 결과 배지 — 어떤 상속에도 흔들리지 않게 배경·색을 명시 */
.rg-vs-foot, .rgb-foot {
  display: inline-block; background: rgba(255,255,255,.08); border-radius: 999px;
  padding: 7px 16px; font-size: 13px; font-weight: 800;
}
.rg-vs-foot { color: #F0A8AF !important; background: rgba(224,138,147,.14); }
.rg-vs-foot.ok { color: #0B3D22 !important; background: #7EE3A1; }
.rgb-foot { background: rgba(198,48,60,.08); color: #C6303C !important; }
.rgb-foot.ok { background: #E9F9EF; color: #14663C !important; }

/* 푸터: 링크 열을 오른쪽으로 밀어 하단 약관 줄 끝과 정렬 */
.foot-grid { grid-template-columns: 1fr auto auto auto; column-gap: 72px; }
.foot-col { min-width: 96px; }
.foot-col:last-child { text-align: right; }
.foot-col:last-child a { text-align: right; }
@media (max-width: 900px) {
  .foot-grid { grid-template-columns: 1fr 1fr; column-gap: 24px; }
  .foot-col:last-child, .foot-col:last-child a { text-align: left; }
}

/* 푸터 링크 열: 동일 폭·좌측정렬로 통일 (마지막 열 오른쪽 끝만 컨테이너에 맞춤) */
.foot-grid { grid-template-columns: 1fr repeat(3, 160px); column-gap: 0; }
.foot-col, .foot-col:last-child, .foot-col:last-child a { text-align: left; }
.foot-col { min-width: 0; }
@media (max-width: 900px) {
  .foot-grid { grid-template-columns: 1fr 1fr; column-gap: 24px; }
}
/* 마지막 열의 '내용 시작점'이 아니라 열 자체가 컨테이너 오른쪽 끝에서 시작하도록 폭 재조정 */
.foot-grid { grid-template-columns: 1fr repeat(2, 168px) minmax(88px, auto); }

/* ============ 국내 자체 인프라(데이터 주권) 섹션 ============ */
.sec-sect.sov { background: linear-gradient(180deg, #F6F9FF, #fff); }
.sov-badge { display: inline-block; font-size: 13px; font-weight: 800; color: #1D4FB0; background: #EAF1FF; border: 1px solid #CFE0FF; border-radius: 999px; padding: 7px 16px; margin-bottom: 14px; }
.sov-vs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 30px; }
.sov-col { border-radius: 18px; padding: 22px; border: 1px solid var(--border); background: #fff; }
.sov-col.out { background: #FDF9F9; border-color: #F0D8DB; }
.sov-col.in { background: #F5FBF7; border-color: #C9EBD4; }
.sov-h { margin: 0 0 16px; font-size: 13px; font-weight: 800; letter-spacing: .05em; color: var(--text-3); text-align: center; }
.sov-flow { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; }
.sov-node { font-size: 12.5px; font-weight: 700; text-align: center; background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; line-height: 1.5; min-width: 88px; }
.sov-node em { display: block; font-style: normal; font-size: 11px; font-weight: 500; color: var(--text-3); margin-top: 3px; }
.sov-node.abroad { border-color: #E3B7BC; background: #FFF4F5; color: #A8323D; }
.sov-node.ours { border-color: #A7D8BC; background: #EAF8EF; color: #14663C; }
.sov-arrow { font-weight: 800; font-size: 16px; }
.sov-arrow.out { color: #C6303C; }
.sov-arrow.in { color: #15803D; }
.sov-foot { margin: 16px 0 0; text-align: center; font-size: 12.5px; font-weight: 800; }
.sov-foot.bad { color: #C6303C; }
.sov-foot.ok { color: #15803D; }
.sov-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.sov-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 22px; box-shadow: 0 8px 24px rgba(16,24,40,.05); }
.sov-ic { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--primary-soft); margin-bottom: 12px; }
.sov-ic .lic { width: 21px; height: 21px; color: var(--primary); }
.sov-card b { display: block; font-size: 16.5px; letter-spacing: -.02em; margin-bottom: 7px; }
.sov-card p { margin: 0; font-size: 14.5px; line-height: 1.8; color: var(--text-2); word-break: keep-all; }
.sov-note { margin: 26px auto 0; max-width: 760px; text-align: center; font-size: 14.5px; line-height: 1.85; color: var(--text-2); }
.sov-note a { color: var(--primary); font-weight: 600; }
.sec-card.hl { border-color: #CFE0FF; background: #F8FBFF; }
@media (max-width: 900px) { .sov-vs, .sov-grid { grid-template-columns: 1fr; } }


/* ── AI-Ready 밴드 (랜딩) ───────────────────────────────── */
.ai-band { padding: 70px 0; background: linear-gradient(180deg, #fff, #F6F9FF); border-bottom: 1px solid var(--border); }
.ai-band-in { display: grid; grid-template-columns: 1.05fr 1fr; gap: 44px; align-items: center; }
.ai-band-copy h2 { font-size: clamp(28px, 3.1vw, 38px); letter-spacing: -.03em; line-height: 1.25; margin: 0 0 16px; }
.ai-band-copy p { font-size: 16.5px; line-height: 1.85; color: var(--text-2); margin: 0 0 22px; }
.ai-band-art { display: grid; gap: 10px; min-width: 0; }
.aib-chip { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 12px 16px; box-shadow: 0 4px 14px rgba(16,24,40,.05); min-width: 0; }
.aib-chip code { font-family: 'IBM Plex Mono', monospace; font-size: 13px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aib-chip span { font-size: 12.5px; color: var(--text-3); white-space: nowrap; }
.aib-chip.on { border-color: #CFE0FF; background: #F8FBFF; }
.aib-chip.on code { color: var(--primary); font-weight: 600; }
@media (max-width: 900px) { .ai-band-in { grid-template-columns: 1fr; } }

/* ── /ai-ready 카드 그리드 ──────────────────────────────── */
.ai-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-content: start; }
.ai-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 20px; min-width: 0; }
.ai-card h3 { margin: 16px 0 8px; font-size: 17.5px; letter-spacing: -.01em; }
.ai-card > p { margin: 0; font-size: 14.5px; line-height: 1.75; color: var(--text-2); }
.ai-thumb { background: #FBFCFE; border: 1px solid var(--border); border-radius: 12px; padding: 16px; min-height: 118px; display: grid; align-content: center; overflow: hidden; }
.ai-urlbar { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--border); border-radius: 9px; padding: 8px 12px; min-width: 0; }
.ai-urlbar code { font-family: 'IBM Plex Mono', monospace; font-size: 12.5px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-urlbar code b { color: var(--primary); font-weight: 700; }
.ai-dot { width: 8px; height: 8px; border-radius: 50%; background: #23B25C; flex: none; }
.ai-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.ai-chips code { font-family: 'IBM Plex Mono', monospace; font-size: 11.5px; background: #fff; border: 1px solid var(--border); border-radius: 999px; padding: 4px 10px; color: var(--text-2); }
.ai-chips code.hl { border-color: #CFE0FF; background: #F0F6FF; color: var(--primary); font-weight: 600; }
.ai-hybrid { display: grid; gap: 8px; }
.ai-lane { display: flex; align-items: center; gap: 8px; }
.ai-lane b { font-size: 11.5px; font-weight: 600; color: var(--text-3); width: 62px; flex: none; }
.ai-lane i { height: 8px; border-radius: 4px; background: #C9DAF8; }
.ai-lane + .ai-lane i { background: #D7EBDD; }
.ai-merge { font-size: 11.5px; font-weight: 700; color: var(--text-3); margin: 2px 0 2px 70px; }
.ai-rank { display: flex; gap: 6px; margin-left: 70px; }
.ai-rank u { text-decoration: none; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; background: var(--primary); color: #fff; font-size: 11.5px; font-weight: 700; }
.ai-rank u:nth-child(2) { opacity: .65; } .ai-rank u:nth-child(3) { opacity: .4; }
.ai-steps { display: grid; gap: 7px; }
.ai-steps > div { display: flex; align-items: center; gap: 9px; background: #fff; border: 1px solid var(--border); border-radius: 9px; padding: 7px 11px; font-size: 12.5px; color: var(--text-2); }
.ai-steps > div b { width: 18px; height: 18px; border-radius: 50%; background: var(--bg); display: grid; place-items: center; font-size: 10.5px; color: var(--text-3); flex: none; }
.ai-steps > div span { margin-left: auto; font-size: 11.5px; color: var(--text-3); white-space: nowrap; }
.ai-steps > div.on { border-color: #CFE0FF; background: #F8FBFF; }
.ai-steps > div.on b { background: var(--primary); color: #fff; }
.ai-steps > div.on span { color: var(--primary); font-weight: 700; }
.ai-md pre { margin: 10px 0 0; font-family: 'IBM Plex Mono', monospace; font-size: 11.5px; line-height: 1.7; color: var(--text-2); background: #fff; border: 1px solid var(--border); border-radius: 9px; padding: 10px 12px; overflow: hidden; white-space: pre-wrap; word-break: break-all; }
.ai-llms { display: grid; gap: 9px; }
.ai-file { display: flex; align-items: baseline; gap: 10px; background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 11px 14px; min-width: 0; }
.ai-file b { font-family: 'IBM Plex Mono', monospace; font-size: 12.5px; color: var(--text); flex: none; }
.ai-file span { font-size: 12px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-file.full { border-color: #CFE0FF; background: #F8FBFF; }
.ai-file.full b { color: var(--primary); }
.ai-fresh { display: grid; gap: 10px; justify-items: start; }
.ai-doc-mini { width: 100%; display: grid; gap: 6px; background: #fff; border: 1px solid var(--border); border-radius: 9px; padding: 12px; }
.ai-doc-mini u { display: block; height: 7px; border-radius: 4px; background: var(--bg); }
.ai-doc-mini u:first-child { width: 46%; background: #DCE4F2; }
.ai-badge { font-size: 11.5px; font-weight: 700; color: var(--primary); background: #F0F6FF; border: 1px solid #CFE0FF; border-radius: 999px; padding: 4px 11px; }
.ai-chunk { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px 12px; align-items: center; }
.ai-chunk-doc { display: flex; gap: 5px; }
.ai-chunk-doc span { flex: 1; border-radius: 5px; background: #C9DAF8; }
.ai-chunk-doc + em + .ai-chunk-doc span { background: #D7EBDD; }
.ai-chunk em { font-style: normal; font-size: 11.5px; color: var(--text-3); white-space: nowrap; }
.ai-lock { display: grid; gap: 8px; }
.ai-lockrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-radius: 9px; padding: 9px 13px; font-size: 12.5px; }
.ai-lockrow.ok { background: #F2FAF5; border: 1px solid #C9EBD4; color: #1D7A43; }
.ai-lockrow.no { background: #FDF3F3; border: 1px solid #F2CFCF; color: #B4232F; }
.ai-lockrow b { font-weight: 700; white-space: nowrap; }
.ai-try { display: grid; gap: 10px; max-width: 640px; margin: 0 auto; }
.ai-try a, .ai-try-mcp { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.13); border-radius: 12px; padding: 13px 17px; text-decoration: none; min-width: 0; }
.ai-try a:hover { border-color: rgba(157,192,255,.55); background: rgba(74,130,236,.1); }
.ai-try code { font-family: 'IBM Plex Mono', monospace; font-size: 13px; color: #C9D6EE; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-try span { font-size: 12.5px; color: #9DC0FF; font-weight: 600; white-space: nowrap; }
.ai-try-mcp span { color: #A8B4CC; font-weight: 400; }
@media (max-width: 760px) { .ai-grid { grid-template-columns: 1fr; } }

/* 푸터 모바일 — 902행의 무조건 .foot-grid 가 위 미디어쿼리를 덮어 폰에서 4열이 넘치던 것 */
@media (max-width: 900px) { .foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .foot-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; } }

/* ── /compare 비교표 ────────────────────────────────────── */
.cmp-sub { font-style: normal; font-size: 12px; font-weight: 600; opacity: .75; margin-left: 2px; }
.cmp-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--border); border-radius: 14px; background: #fff; }
.cmp { width: 100%; min-width: 720px; border-collapse: collapse; font-size: 14px; }
.cmp th, .cmp td { padding: 13px 16px; text-align: center; border-top: 1px solid var(--border); min-width: 0; }
.cmp thead th { border-top: 0; background: #FBFCFE; font-size: 13.5px; font-weight: 700; color: var(--text-2); vertical-align: top; padding-top: 15px; }
.cmp thead th em { display: block; font-style: normal; font-size: 12px; font-weight: 600; color: var(--text-3); margin-top: 3px; }
.cmp td:first-child, .cmp th:first-child { text-align: left; font-weight: 600; color: var(--text); }
.cmp td:first-child i { display: block; font-style: normal; font-size: 12px; font-weight: 500; color: var(--text-3); margin-top: 2px; }
.cmp td { color: var(--text-2); }
.cmp td i { display: block; font-style: normal; font-size: 11.5px; color: var(--text-3); margin-top: 2px; }
.cmp .us { background: #F5F9FF; }
.cmp thead th.us { color: var(--primary); background: #EDF4FF; }
.cmp thead th.us em { color: var(--primary); }
.cmp td.us { color: var(--text); }
.cmp td.us b { color: var(--primary); }
.cmp-y { color: #1D7A43; font-weight: 800; }
.cmp-n { color: #C6303C; font-weight: 800; opacity: .75; }
.cmp-ex, .cmp-fair { max-width: 760px; margin: 22px auto 0; text-align: center; font-size: 15px; line-height: 1.85; color: var(--text-2); }
.cmp-fair b { color: var(--text); }
.cmp-note { margin: 0 auto; max-width: 800px; text-align: center; font-size: 13.5px; line-height: 1.9; color: var(--text-2); }
@media (max-width: 760px) {
  .cmp-wrap { position: relative; }
  .cmp-wrap::after { content: '옆으로 밀어 보세요 →'; position: sticky; display: block; left: 0; text-align: right; font-size: 11.5px; color: var(--text-3); padding: 6px 12px; background: #FBFCFE; border-top: 1px solid var(--border); }
}
.cmp td:first-child, .cmp tbody th:first-child { position: sticky; left: 0; background: #fff; z-index: 1; box-shadow: 1px 0 0 var(--border); }
.cmp thead th:first-child { position: sticky; left: 0; background: #FBFCFE; z-index: 2; box-shadow: 1px 0 0 var(--border); }

/* ── 깃북 청구서 밴드 (랜딩) + /compare 실사례 ─────────────── */
.bill-band { padding: 74px 0; background: #0F172A; color: #E7ECF6; }
.bill-in { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; }
.rag-badge.dark { color: #9DC0FF; background: rgba(74,130,236,.14); border: 1px solid rgba(157,192,255,.35); }
.bill-copy h2 { font-size: clamp(28px, 3.1vw, 38px); letter-spacing: -.03em; line-height: 1.25; margin: 0 0 16px; color: #fff; }
.bill-copy p { font-size: 16.5px; line-height: 1.85; color: #A8B4CC; margin: 0 0 24px; }
.bill-copy p b { color: #fff; }
.btn.light { background: #fff; color: #17203A; border-color: #fff; }
.btn.light:hover { background: #E9EFFB; }
.bill-card { background: #fff; color: var(--text); border-radius: 16px; padding: 22px 24px; box-shadow: 0 18px 48px rgba(0,0,0,.35); min-width: 0; }
.bill-title { margin: 0 0 14px; font-size: 12.5px; font-weight: 800; letter-spacing: .05em; color: var(--text-3); }
.bill-row { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 9px 0; border-top: 1px dashed var(--border); font-size: 14px; min-width: 0; }
.bill-row span { color: var(--text-2); min-width: 0; }
.bill-row span i { display: block; font-style: normal; font-size: 12px; color: var(--text-3); margin-top: 2px; }
.bill-row b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.bill-row.sum { border-top: 2px solid var(--text); margin-top: 4px; }
.bill-row.sum b { font-size: 19px; color: #C6303C; }
.bill-row.us { background: #F5F9FF; border: 1px solid #CFE0FF; border-radius: 10px; padding: 10px 13px; margin-top: 10px; }
.bill-row.us span { color: var(--primary); font-weight: 700; }
.bill-row.us b { font-size: 19px; color: var(--primary); }
.bill-note { margin: 12px 0 0; font-size: 11.5px; color: var(--text-3); }
@media (max-width: 900px) { .bill-in { grid-template-columns: 1fr; } }
.bill-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 28px; align-items: center; }
.bill-card.big .bill-row { font-size: 14.5px; }
.bill-vs { text-align: center; padding: 10px; }
.bill-vs-zero { margin: 0 0 10px; font-size: clamp(56px, 7vw, 84px); font-weight: 800; letter-spacing: -.04em; color: #fff; }
.bill-vs-copy { margin: 0 0 16px; font-size: 15.5px; line-height: 1.85; color: #A8B4CC; }
.bill-vs-punch { margin: 0; font-size: 16.5px; font-weight: 700; color: #9DC0FF; }
@media (max-width: 900px) { .bill-grid { grid-template-columns: 1fr; } }
/* secv 모바일 — keep-all 한글의 min-content 가 1fr 열을 681px 로 벌리던 것 (minmax 0 으로) */
@media (max-width: 900px) {
  .secv { grid-template-columns: minmax(0, 1fr); }
  .secv-kr { font-size: 24px; }
}

/* ── 「주소만 넣으면 이사」 폼 ─────────────────────────────── */
.clone-form { display: flex; gap: 10px; justify-content: center; max-width: 560px; margin: 0 auto; }
.clone-form .inp { flex: 1; min-width: 0; height: 52px; font-size: 15px; border-radius: 12px; }
.clone-form .btn { white-space: nowrap; }
.lp-final p.clone-note { margin: 26px 0 0; font-size: 13px; color: #8B95AB; }
@media (max-width: 560px) { .clone-form { flex-direction: column; } }
/* 예시 문단 — 사장님 지정 줄바꿈(「1년이면」부터 둘째 줄)이 자연 줄바꿈에 안 밀리게 폭 확장 */
.cmp-ex { max-width: 980px; }

/* ── /agent-memory — 조직 에이전트 기억 ─────────────────── */
.am-story { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: 20px; align-items: stretch; }
.am-day { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.13); border-radius: 16px; padding: 22px 24px; display: flex; flex-direction: column; gap: 9px; }
.am-day.after { background: rgba(74,130,236,.13); border-color: rgba(122,166,255,.4); }
.am-day-head { display: flex; align-items: baseline; gap: 10px; margin: 0 0 6px; }
.am-day-head b { font-size: 17px; color: #fff; letter-spacing: -.02em; }
.am-day-head span { font-size: 12.5px; color: #A8B4CC; }
.am-row { font-size: 13.5px; line-height: 1.7; color: #C9D6EE; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); border-radius: 10px; padding: 10px 13px; word-break: keep-all; overflow-wrap: anywhere; }
.am-row code { font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: #9DC0FF; background: rgba(74,130,236,.18); border-radius: 6px; padding: 2px 7px; margin-right: 4px; }
.am-row.hl { border-color: rgba(122,166,255,.45); background: rgba(74,130,236,.14); }
.am-row.ok { border-color: rgba(126,227,161,.4); background: rgba(126,227,161,.1); color: #A9EEC2; font-weight: 600; }
.am-day-foot { margin: auto 0 0; padding-top: 10px; font-size: 12.5px; color: #A8B4CC; word-break: keep-all; overflow-wrap: anywhere; }
/* 전역 .ok(292행 연녹 알약 배경)가 새어 들어와 연녹 배경+연녹 글자가 되므로 전부 명시 덮기 */
.am-day-foot.ok { color: #0B3D22; background: #7EE3A1; font-weight: 700; padding: 9px 13px; border-radius: 10px; }
.am-arrow { color: #5B6B8C; font-weight: 800; font-size: 20px; align-self: center; }
.am-steps { display: flex; flex-direction: column; gap: 14px; }
.am-step { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 14px; align-items: start; background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 18px 20px; box-shadow: 0 6px 18px rgba(16,24,40,.04); }
.am-n { width: 30px; height: 30px; border-radius: 999px; display: grid; place-items: center; font-size: 13px; font-weight: 800; background: #EAF1FF; color: var(--primary); }
.am-step b { display: block; font-size: 16px; margin-bottom: 5px; letter-spacing: -.01em; }
.am-step p { margin: 0; font-size: 14px; color: var(--text-2); line-height: 1.75; word-break: keep-all; overflow-wrap: anywhere; }
.am-snippet { margin: 12px 0 0; font-family: 'IBM Plex Mono', monospace; font-size: 12.5px; line-height: 1.8; color: var(--text); background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 13px 16px; overflow-x: auto; white-space: pre; }
.am-guard-note { margin: 24px auto 0; max-width: 720px; text-align: center; font-size: 13.5px; line-height: 1.85; color: #A8B4CC; word-break: keep-all; overflow-wrap: anywhere; }
.am-guard-note a { color: #9DC0FF; font-weight: 600; }
.ai-card > p a { color: var(--primary); font-weight: 600; text-decoration: none; }
@media (max-width: 900px) {
  .am-story { grid-template-columns: minmax(0,1fr); }
  .am-arrow { transform: rotate(90deg); justify-self: center; }
}

/* ── 에이전트 기억 밴드 (랜딩·부가 활용) — ai-band 의 #F6F9FF 끝과 이어지게 border-top 제거 */
.lp-rag.amb { border-top: 0; background: linear-gradient(180deg, #F6F9FF, #fff); }

/* ── i18n: 헤더 요금 링크 · 푸터 언어 전환(한국어/English) ── */
.lp-nav nav .nav-link { font-size: 14px; font-weight: 600; color: var(--text-2); padding: 0 8px; text-decoration: none; }
.lp-nav nav .nav-link:hover { color: var(--primary); }
.foot-lang { display: inline-flex; gap: 10px; margin-left: 22px; padding-left: 16px; border-left: 1px solid var(--border); }
.foot-lang a { color: var(--text-3); font-size: 12.5px; margin-left: 0; }
.foot-lang a.on { color: var(--text); font-weight: 600; }
.foot-lang a:hover { color: var(--primary); }

/* 폰 폭: 네비에 「요금」이 더해져 63~87px 넘치던 것 — 로그인은 숨기고(가입 화면에 있음) 단추를 좁힌다 ·
   영어 헤드라인은 한 줄 고정(nowrap)을 풀어야 넘치지 않는다 */
@media (max-width: 600px) {
  .lp-nav nav { gap: 6px; }
  .lp-nav nav .btn.ghost { display: none; }
  .lp-nav nav .btn { padding: 8px 12px; font-size: 13.5px; }
  .lp-nav nav .nav-link { padding: 0 4px; }
  .lp-hero h1 .h1line { white-space: normal; }
  .lp-eyebrow.badge-pill { white-space: normal; max-width: 100%; }
}
html[lang="en"] .lp-hero h1 .h1line { white-space: normal; }
@media (max-width: 600px) {
  .lp-hero h1 .hl { white-space: normal; }
  .lp-hero h1 .hl::after { display: none; }
  .lp-eyebrow.badge-pill { box-sizing: border-box; line-height: 1.45; padding: 6px 14px; word-break: normal; overflow-wrap: anywhere; }
  .lp-hero-copy, .lp-hero h1 { min-width: 0; max-width: 100%; word-break: keep-all; overflow-wrap: anywhere; }
}
html[lang="en"] .lp-hero h1 .hl { white-space: normal; }
html[lang="en"] .lp-hero h1, html[lang="en"] .lp-hero-copy p { word-break: normal; }