/* 공개 사이트 label 페이지 — 시안 nicelabel.html에서 이식 (2026-11-02) */
/* ---- S9 문의 CTA ---- */
@media (max-width:1023px){
  .e-bens{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .e-bens{grid-template-columns:1fr;margin-top:40px}
}
/* ==== NiceLabel 페이지 전용 ==== */
.nl-feed{animation:nl-feed 6s linear infinite}
@keyframes nl-feed{from{transform:translateY(0)}to{transform:translateY(-82px)}}
.nl-led{animation:nl-led 2.4s ease-in-out infinite}
@keyframes nl-led{0%,100%{opacity:.3}50%{opacity:1}}
/* S2 구성 선택 가이드 */
.nl-guide{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:64px;align-items:start}
.nl-pick{display:grid;gap:12px;counter-reset:none}
.nl-pick a{display:grid;grid-template-columns:44px minmax(0,1fr) auto;grid-template-areas:"n q i" "n a i";column-gap:20px;row-gap:6px;align-items:center;min-height:44px;padding:24px 24px 24px 22px;border:1px solid var(--e-line);border-radius:var(--r-card);background:#fff;transition:border-color .2s,background-color .2s}
.nl-pick a:hover{border-color:#212222}
.nl-pick-n{grid-area:n;align-self:start;font-family:var(--font-head);font-size:15px;font-weight:800;letter-spacing:.1em;color:var(--e-red);padding-top:2px}
.nl-pick-q{grid-area:q;font-size:17px;line-height:1.55;color:var(--e-text);letter-spacing:-.02em}
.nl-pick-q small{display:block;font-size:13px;font-weight:600;color:var(--e-mute);margin-bottom:2px}
.nl-pick-a{grid-area:a;justify-self:start;display:inline-flex;align-items:center;min-height:32px;padding:0 14px;border-radius:999px;background:var(--e-black);color:#fff;font-family:var(--font-head);font-size:15px;font-weight:700}
.nl-pick i{grid-area:i;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--e-line);transition:background-color .2s,color .2s,border-color .2s}
.nl-pick i svg{width:20px;height:20px}
.nl-pick a:hover i{background:var(--e-black);color:#fff;border-color:var(--e-black)}
/* S3 Product Range */
.nl-axis{position:relative;margin-top:56px;padding-top:30px}
.nl-axis-cap{position:absolute;right:0;top:0;font-family:var(--font-head);font-size:13px;font-weight:800;letter-spacing:.1em;color:var(--e-sub)}
.nl-axis ol{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.nl-axis ol::before{content:"";position:absolute;left:0;right:0;top:7px;height:2px;background:linear-gradient(90deg,#C4C6C9,#212222)}
.nl-axis ol::after{content:"";position:absolute;right:-2px;top:3px;width:10px;height:10px;border-top:2px solid #212222;border-right:2px solid #212222;transform:rotate(45deg)}
.nl-axis li{position:relative;padding-top:28px;font-size:14px;color:var(--e-sub)}
.nl-axis li::before{content:"";position:absolute;left:0;top:0;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #212222}
.nl-axis li:nth-child(2)::before{background:#555758;border-color:#555758}
.nl-axis li:nth-child(3)::before{background:#0B0B0C;border-color:#0B0B0C}
.nl-axis b{display:block;font-family:var(--font-head);font-size:17px;font-weight:800;color:var(--e-text)}
.nl-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px;align-items:stretch}
.nl-card{display:flex;flex-direction:column;padding:32px 28px 28px;border-radius:var(--r-card);background:#fff;border:1px solid var(--e-line);color:var(--e-text)}
.nl-card-top{display:flex;align-items:center;justify-content:space-between}
.nl-no{font-family:var(--font-head);font-size:15px;font-weight:800;letter-spacing:.12em;color:var(--e-red)}
.nl-meter{display:inline-flex;align-items:flex-end;gap:4px}
.nl-meter i{display:block;width:8px;border-radius:2px;background:var(--e-line)}
.nl-meter i:nth-child(1){height:10px}
.nl-meter i:nth-child(2){height:16px}
.nl-meter i:nth-child(3){height:22px}
.nl-meter i.on{background:#212222}
.nl-card-ic{display:flex;align-items:center;justify-content:center;width:72px;height:72px;margin-top:24px;border-radius:18px;background:var(--e-bg2)}
.nl-card-ic svg{width:40px;height:40px}
.nl-tier{display:inline-flex;align-self:flex-start;align-items:center;min-height:28px;margin-top:24px;padding:0 12px;border-radius:999px;border:1px solid var(--e-line);font-size:13px;font-weight:700;color:var(--e-sub)}
.nl-card h3{margin-top:12px;font-family:var(--font-head);font-size:24px;font-weight:800;line-height:1.3;letter-spacing:-.03em}
.nl-for{margin-top:10px;font-family:var(--font-head);font-size:16px;font-weight:700;line-height:1.5;color:var(--e-text)}
.nl-desc{margin-top:8px;font-size:15px;line-height:1.65;color:var(--e-sub)}
.nl-feat{margin-top:20px;padding-top:20px;border-top:1px solid var(--e-line);display:grid;gap:10px}
.nl-feat li{position:relative;padding-left:28px;font-size:15px;line-height:1.6;color:var(--e-text)}
.nl-feat li::before{content:"";position:absolute;left:2px;top:.35em;width:16px;height:16px;border-radius:50%;background:var(--e-bg2)}
.nl-feat li::after{content:"";position:absolute;left:7px;top:calc(.35em + 4px);width:5px;height:8px;border-right:2px solid var(--e-red);border-bottom:2px solid var(--e-red);transform:rotate(45deg)}
.nl-card-foot{margin-top:auto;padding-top:28px;display:grid;gap:8px}
.nl-trial{font-size:14px;font-weight:700;color:var(--e-text)}
.nl-ext{width:100%;white-space:normal;text-align:center}
.nl-more{justify-self:start}
.nl-more svg{width:18px;height:18px}
.nl-card--top{background:var(--e-dark);border-color:var(--e-dark);color:#fff}
.nl-card--top .nl-no{color:#fff}
.nl-card--top .nl-meter i{background:rgba(255,255,255,.2)}
.nl-card--top .nl-meter i.on{background:#fff}
.nl-card--top .nl-card-ic{background:rgba(255,255,255,.08)}
.nl-card--top .nl-tier{border-color:rgba(255,255,255,.3);color:var(--e-dsub)}
.nl-card--top .nl-for,.nl-card--top .nl-feat li{color:#fff}
.nl-card--top .nl-desc{color:var(--e-dsub)}
.nl-card--top .nl-feat{border-top-color:rgba(255,255,255,.16)}
.nl-card--top .nl-feat li::before{background:rgba(255,255,255,.12)}
.nl-card--top .nl-feat li::after{border-color:#fff}
.nl-note{margin-top:28px;font-size:14px;color:var(--e-mute)}
/* S4 Label Cloud */
.nl-cloud{position:relative;overflow:hidden}
.nl-cloud-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:64px;align-items:center}
.nl-cloud-pts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:36px}
.nl-cloud-pts li{padding:20px 18px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04)}
.nl-cloud-pts b{display:block;font-family:var(--font-head);font-size:18px;font-weight:800;letter-spacing:-.02em}
.nl-cloud-pts span{display:block;margin-top:4px;font-size:14px;line-height:1.5;color:var(--e-dsub)}
.nl-cloud-q{margin-top:28px;padding-left:16px;border-left:2px solid rgba(255,255,255,.5);font-size:16px;line-height:1.7;color:#fff}
.nl-cloud-art svg{width:100%;height:auto;max-width:460px;margin-left:auto}
@media (max-width:1023px){
  .nl-guide{grid-template-columns:1fr;gap:32px}
  .nl-cards{grid-template-columns:1fr;max-width:640px}
  .nl-axis{display:none}
  .nl-cards{margin-top:40px}
  .nl-cloud-in{grid-template-columns:1fr;gap:48px}
  .nl-cloud-art svg{margin:0 auto;max-width:420px}
}
@media (max-width:767px){
  .nl-pick a{grid-template-columns:32px minmax(0,1fr) 44px;column-gap:12px;padding:20px 16px}
  .nl-pick-q{font-size:16px}
  .nl-pick-a{font-size:14px;min-height:30px;padding:0 12px;white-space:normal;line-height:1.3;padding-top:4px;padding-bottom:4px}
  .nl-card{padding:26px 20px 22px}
  .nl-card h3{font-size:21px}
  .nl-cloud-pts{grid-template-columns:1fr}
  .e-btn.nl-ext{white-space:normal;text-align:center}
}
