/* ============================================================
   NV PREMIUM LAYER — 커스텀 커서 · 마퀴 · 리빌 · 마그네틱
   (포인터가 정밀한 데스크톱에서만 커서 활성화)
   ============================================================ */

/* ── 커스텀 커서 ── */
@media (hover: hover) and (pointer: fine) {
  html.nvp-cursor-on body { cursor: none; }
  html.nvp-cursor-on a,
  html.nvp-cursor-on button,
  html.nvp-cursor-on [onclick],
  html.nvp-cursor-on label { cursor: none; }
  /* 입력 요소는 기본 커서 유지 */
  html.nvp-cursor-on input,
  html.nvp-cursor-on textarea,
  html.nvp-cursor-on select { cursor: auto; }
}
/* 커서 전용 클래스(.nvp-cur-*) — 카드 장식용 .nvp-ring 과 이름이 겹치지 않도록 분리.
   (겹치면 커서가 사각형·엉뚱한 위치로 렌더됨) */
.nvp-cur-dot, .nvp-cur-ring {
  position: fixed; top: 0; left: 0; z-index: 2147483647;
  pointer-events: none; border-radius: 50%;
  will-change: transform;
  display: none;
  box-sizing: border-box;
}
html.nvp-cursor-on .nvp-cur-dot,
html.nvp-cursor-on .nvp-cur-ring { display: block; }
/* mix-blend-mode 는 커서가 움직일 때마다 화면 전체를 재합성(recomposite)시켜
   저사양 기기에서 마우스가 렉 걸리는 원인 → 제거하고 뚜렷한 색으로 대체 */
.nvp-cur-dot {
  width: 7px; height: 7px; margin: 0;
  background: #2563eb;
  box-shadow: 0 0 0 1.5px rgba(255,255,255,.55);
}
.nvp-cur-ring {
  width: 38px; height: 38px;
  border: 1.6px solid rgba(37, 99, 235, .8);
  background: rgba(56, 189, 248, .05);
  transition: width .25s cubic-bezier(.22,1,.36,1), height .25s cubic-bezier(.22,1,.36,1),
              background .25s ease, border-color .25s ease;
  align-items: center; justify-content: center;
}
html.nvp-cursor-on .nvp-cur-ring { display: flex; }
.nvp-cur-ring .nvp-cur-label {
  font-size: 0; opacity: 0; color: #fff; font-weight: 700; letter-spacing: .08em;
  transition: opacity .2s ease, font-size .2s ease;
  font-family: 'Inter','Noto Sans KR',sans-serif; white-space: nowrap;
}
/* 인터랙티브 호버: 링 확대 */
.nvp-cur-ring.is-hover {
  width: 62px; height: 62px;
  border-color: rgba(56,189,248,1);
  background: rgba(56,189,248,.12);
}
/* 텍스트 라벨 모드 (VIEW 등) */
.nvp-cur-ring.is-label {
  width: 78px; height: 78px;
  background: rgba(37, 99, 235, .92);
  border-color: transparent;
  mix-blend-mode: normal;
}
.nvp-cur-ring.is-label .nvp-cur-label { font-size: .68rem; opacity: 1; }

/* ── 마퀴 밴드 ── */
.nvp-marquee {
  overflow: hidden; position: relative;
  background: #05070d;
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding: 22px 0;
  user-select: none;
}
.nvp-marquee-track {
  display: flex; gap: 0; width: max-content;
  animation: nvpMarquee 28s linear infinite;
}
.nvp-marquee:hover .nvp-marquee-track { animation-play-state: paused; }
.nvp-marquee-seg {
  display: flex; align-items: center; gap: 28px; padding-right: 28px;
  font-family: 'Inter','Noto Sans KR',sans-serif;
  font-weight: 800; font-size: clamp(1.05rem, 2.2vw, 1.6rem);
  letter-spacing: .04em; white-space: nowrap;
  color: rgba(255,255,255,.9);
}
.nvp-marquee-seg .o { color: transparent; -webkit-text-stroke: 1px rgba(148,183,255,.5); }
.nvp-marquee-seg .s { color: #38bdf8; font-size: .8em; }
@keyframes nvpMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── 스테이트먼트(대형 카피) 섹션 ── */
.nvp-statement {
  position: relative; overflow: hidden;
  background: #070b16; padding: 130px 0 120px;
}
.nvp-statement::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(ellipse 50% 55% at 82% 14%, rgba(56,189,248,.08), transparent 62%),
              radial-gradient(ellipse 45% 50% at 10% 90%, rgba(124,58,237,.07), transparent 62%);
}
.nvp-statement .container { position: relative; z-index: 1; }
.nvp-st-eyebrow {
  font-family:'Inter',sans-serif; font-size:.72rem; font-weight:700;
  letter-spacing:.28em; color:#5b708f; text-transform:uppercase; margin-bottom:34px;
  display:flex; align-items:center; gap:14px;
}
.nvp-st-eyebrow::before { content:''; width:44px; height:1px; background:rgba(120,150,190,.5); }
.nvp-st-line {
  font-size: clamp(1.9rem, 5.2vw, 4.1rem);
  font-weight: 900; line-height: 1.22; letter-spacing: -.025em; color: #f5f9ff;
  opacity: 0; transform: translateY(38px);
  transition: opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1);
  margin: 0;
}
.nvp-st-line + .nvp-st-line { margin-top: 10px; }
.nvp-st-line.is-in { opacity: 1; transform: none; }
.nvp-st-line .hl {
  background: linear-gradient(100deg,#60a5fa,#38bdf8 55%,#a78bfa);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.nvp-st-line .ghost { color: transparent; -webkit-text-stroke: 1.5px rgba(148,183,255,.45); }
.nvp-st-sub {
  margin-top: 44px; max-width: 620px;
  color: #93a6c2; font-size: 1.08rem; line-height: 1.85;
  opacity: 0; transform: translateY(24px);
  transition: opacity .9s ease .25s, transform .9s ease .25s;
}
.nvp-st-sub.is-in { opacity: 1; transform: none; }
.nvp-st-sub b { color: #dbe7fb; }
.nvp-st-points {
  margin-top: 54px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px; overflow: hidden;
}
.nvp-st-point {
  background: #0a0f1c; padding: 30px 28px;
  transition: background .3s ease;
}
.nvp-st-point:hover { background: #0e1526; }
.nvp-st-point .n {
  font-family:'Inter',sans-serif; font-size:.7rem; font-weight:700; letter-spacing:.16em;
  color:#38bdf8; margin-bottom:14px;
}
.nvp-st-point .t { font-size:1.06rem; font-weight:800; color:#eef4ff; margin-bottom:10px; letter-spacing:-.01em; }
.nvp-st-point .d { font-size:.9rem; color:#8ea3c0; line-height:1.7; }
@media (max-width: 860px) {
  .nvp-st-points { grid-template-columns: 1fr; }
  .nvp-statement { padding: 90px 0 84px; }
}
/* ── PROMISE 3포인트 순차 등장(스태거) + 번호 강조바 성장 ── */
.nvp-st-points.nvp-reveal { opacity: 1; transform: none; }   /* 컨테이너는 고정, 포인트만 순차 이동 */
.nvp-st-point {
  opacity: 0; transform: translateY(26px);
  transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1), background .3s ease;
}
.nvp-st-points.is-in .nvp-st-point { opacity: 1; transform: none; }
.nvp-st-points.is-in .nvp-st-point:nth-child(1) { transition-delay: .08s; }
.nvp-st-points.is-in .nvp-st-point:nth-child(2) { transition-delay: .24s; }
.nvp-st-points.is-in .nvp-st-point:nth-child(3) { transition-delay: .40s; }
.nvp-st-point .n { position: relative; display: inline-block; padding-bottom: 12px; }
.nvp-st-point .n::after {
  content: ''; position: absolute; left: 0; bottom: 0; height: 2px; width: 0;
  background: linear-gradient(90deg, #38bdf8, #818cf8); border-radius: 2px;
  transition: width .8s cubic-bezier(.22,1,.36,1);
}
.nvp-st-points.is-in .nvp-st-point:nth-child(1) .n::after { width: 40px; transition-delay: .40s; }
.nvp-st-points.is-in .nvp-st-point:nth-child(2) .n::after { width: 40px; transition-delay: .56s; }
.nvp-st-points.is-in .nvp-st-point:nth-child(3) .n::after { width: 40px; transition-delay: .72s; }
.nvp-st-point .t { transition: color .3s ease; }
.nvp-st-point:hover .t { color: #ffffff; }
@media (prefers-reduced-motion: reduce) {
  .nvp-st-point { opacity: 1 !important; transform: none !important; transition: none !important; }
  .nvp-st-point .n::after { width: 40px !important; transition: none !important; }
}

/* ── 리빌(등장) 애니메이션 ── */
.nvp-reveal { opacity: 0; transform: translateY(30px); transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
.nvp-reveal.is-in { opacity: 1; transform: none; }

/* ── 모션 최소화 대응 ── */
@media (prefers-reduced-motion: reduce) {
  .nvp-cur-dot, .nvp-cur-ring, .nvp-ring { display: none !important; }
  html.nvp-cursor-on body, html.nvp-cursor-on a, html.nvp-cursor-on button { cursor: auto !important; }
  .nvp-marquee-track { animation: none !important; }
  .nvp-st-line, .nvp-st-sub, .nvp-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ── 인지부조화 스테이트먼트 밴드 (서브페이지 공용) ── */
.nvp-band {
  position: relative; overflow: hidden;
  background: #05070d; padding: 104px 0 96px;
  border-top: 1px solid rgba(255,255,255,.05);
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.nvp-band::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(ellipse 46% 60% at 88% 8%, rgba(56,189,248,.07), transparent 60%),
              radial-gradient(ellipse 40% 50% at 6% 96%, rgba(124,58,237,.06), transparent 62%);
}
.nvp-band .container { position: relative; z-index: 1; }
.nvp-band-kicker {
  font-family:'Inter',sans-serif; font-size:.7rem; font-weight:800;
  letter-spacing:.3em; color:#4c617f; text-transform:uppercase; margin-bottom:28px;
  display:flex; align-items:center; gap:13px;
}
.nvp-band-kicker::before { content:''; width:38px; height:1px; background:rgba(120,150,190,.45); }
.nvp-band h2.nvp-st-line {
  font-size: clamp(1.65rem, 4.4vw, 3.4rem);
  max-width: 980px;
}
.nvp-band-res {
  margin-top: 30px; max-width: 640px;
  color: #94a7c3; font-size: 1.06rem; line-height: 1.85;
}
.nvp-band-res b { color: #dbe7fb; }
.nvp-band-trust {
  margin-top: 38px; display: flex; flex-wrap: wrap; gap: 10px;
}
.nvp-band-trust span {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .82rem; font-weight: 600; color: #b9cbe6;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1);
  border-radius: 100px; padding: 8px 16px;
  transition: border-color .25s ease, background .25s ease;
}
.nvp-band-trust span:hover { border-color: rgba(56,189,248,.45); background: rgba(56,189,248,.07); }
.nvp-band-trust span::before { content:'✓'; color:#38bdf8; font-weight:800; }
@media (max-width: 720px) { .nvp-band { padding: 74px 0 68px; } }

/* ═══════════════════════════════════════════════════════════
   v3 — 서브페이지 중간 섹션 프리미엄 업그레이드
   (다크 테마 서브페이지 공통: svc-dark / sub-dark / ab-dark)
   ═══════════════════════════════════════════════════════════ */

/* ── 스포트라이트 카드 (마우스 따라 하이라이트) ── */
.svc-dark .svc-card, .sub-dark .svc-card, .ab-dark .koh-exp-card,
.svc-dark .why-item, .sub-dark .why-item {
  position: relative; overflow: hidden;
  background: linear-gradient(165deg, rgba(30,41,59,.5), rgba(10,15,28,.72)) !important;
  border: 1px solid rgba(148,163,184,.14) !important;
  border-radius: 20px !important;
  transition: transform .35s cubic-bezier(.22,1,.36,1), border-color .35s, box-shadow .35s;
}
.svc-dark .svc-card::before, .sub-dark .svc-card::before, .ab-dark .koh-exp-card::before {
  content: ''; position: absolute; left: 18%; right: 18%; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(148,197,255,.5), transparent);
}
.svc-dark .svc-card::after, .sub-dark .svc-card::after,
.svc-dark .why-item::after, .sub-dark .why-item::after, .ab-dark .koh-exp-card::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: radial-gradient(360px 240px at var(--mx,50%) var(--my,50%), rgba(120,170,255,.14), transparent 70%);
  transition: opacity .35s;
}
.svc-dark .svc-card:hover::after, .sub-dark .svc-card:hover::after,
.svc-dark .why-item:hover::after, .sub-dark .why-item:hover::after, .ab-dark .koh-exp-card:hover::after { opacity: 1; }
.svc-dark .svc-card:hover, .sub-dark .svc-card:hover {
  transform: translateY(-7px);
  border-color: rgba(148,197,255,.4) !important;
  box-shadow: 0 26px 60px -22px rgba(30,80,200,.45), 0 0 0 1px rgba(148,197,255,.12) !important;
}
.svc-dark .why-item, .sub-dark .why-item { padding: 22px 22px !important; }
.svc-dark .why-item:hover, .sub-dark .why-item:hover {
  transform: translateY(-4px);
  border-color: rgba(148,197,255,.35) !important;
  box-shadow: 0 20px 46px -20px rgba(30,80,200,.4) !important;
}

/* 카드 넘버링 + 아이콘 글로우 */
.svc-dark .svc-grid, .sub-dark .svc-grid { counter-reset: svcnum; }
.svc-dark .svc-card h3::before, .sub-dark .svc-card h3::before {
  counter-increment: svcnum; content: counter(svcnum, decimal-leading-zero);
  display: block; font-family: 'Inter', sans-serif; font-size: .68rem; font-weight: 800;
  letter-spacing: .22em; color: #6d8dc9; margin-bottom: 8px;
}
.svc-dark .svc-card-icon, .sub-dark .svc-card-icon {
  border-radius: 16px !important;
  box-shadow: 0 10px 26px -8px rgba(30,80,200,.5), 0 0 0 1px rgba(255,255,255,.06) inset;
  transition: transform .35s cubic-bezier(.22,1.4,.36,1);
}
.svc-dark .svc-card:hover .svc-card-icon, .sub-dark .svc-card:hover .svc-card-icon { transform: scale(1.08) rotate(-4deg); }
.svc-dark .svc-card h3, .sub-dark .svc-card h3 { color: #eef2fb !important; }
.svc-dark .svc-card p, .sub-dark .svc-card p { color: #9aa9c4 !important; }

/* ── 프로세스 타임라인 글로우 ── */
.svc-dark .process-num, .sub-dark .process-num {
  position: relative;
  box-shadow: 0 10px 30px -8px rgba(37,99,235,.55), 0 0 0 5px rgba(96,165,250,.08) !important;
  transition: transform .3s, box-shadow .3s;
}
.svc-dark .process-item:hover .process-num, .sub-dark .process-item:hover .process-num {
  transform: scale(1.12);
  box-shadow: 0 14px 36px -8px rgba(37,99,235,.7), 0 0 0 8px rgba(96,165,250,.12) !important;
}
.svc-dark .process-item:not(:last-child)::after, .sub-dark .process-item:not(:last-child)::after {
  background: linear-gradient(90deg, rgba(96,165,250,.5), rgba(96,165,250,.08)) !important;
  height: 1.5px !important;
}
.svc-dark .process-label, .sub-dark .process-label { color: #dbe6f8 !important; }
.svc-dark .process-desc, .sub-dark .process-desc { color: #7e8daa !important; }

/* ── 체크리스트 프리미엄 칩 ── */
.svc-dark .check-list li, .sub-dark .check-list li {
  background: rgba(148,163,184,.05); border: 1px solid rgba(148,163,184,.12);
  border-radius: 13px; padding: 12px 15px !important;
  color: #b9c6dd !important;
  transition: border-color .25s, background .25s, transform .25s;
}
.svc-dark .check-list li:hover, .sub-dark .check-list li:hover {
  border-color: rgba(148,197,255,.4); background: rgba(96,165,250,.07); transform: translateX(4px);
}
.svc-dark .check-list li .ck, .sub-dark .check-list li .ck {
  background: linear-gradient(135deg, rgba(37,99,235,.3), rgba(34,211,238,.18)) !important;
  box-shadow: 0 0 12px rgba(96,165,250,.35);
}
.svc-dark .check-list li .ck svg, .sub-dark .check-list li .ck svg { stroke: #93c5fd !important; }

/* ── CTA 박스 프리미엄 ── */
.svc-dark .cta-box, .sub-dark .cta-box {
  background:
    radial-gradient(640px 360px at 82% -20%, rgba(96,165,250,.32), transparent 62%),
    radial-gradient(520px 320px at 8% 120%, rgba(34,211,238,.16), transparent 60%),
    linear-gradient(150deg, #0d1830, #101f42 55%, #0b1428) !important;
  border: 1px solid rgba(120,165,255,.22);
  box-shadow: 0 50px 110px -40px rgba(20,60,160,.55), 0 0 0 1px rgba(255,255,255,.03) inset;
  border-radius: 28px !important;
}
.svc-dark .cta-box::before, .sub-dark .cta-box::before {
  background: rgba(96,165,250,.08) !important;
}
.svc-dark .cta-box::after, .sub-dark .cta-box::after {
  content: ''; position: absolute; left: 15%; right: 15%; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(148,197,255,.65), transparent);
}
.svc-dark .btn-cta-white, .sub-dark .btn-cta-white {
  box-shadow: 0 14px 40px -10px rgba(0,0,0,.5), 0 0 24px rgba(148,197,255,.25) !important;
}

/* ── 섹션 타이틀 이어브로 라인 ── */
.svc-dark .section-badge, .sub-dark .section-badge { position: relative; }

/* ── 스태거 리빌 (JS가 data-nvp-stagger 부여) ── */
[data-nvp-stagger] { opacity: 0; transform: translateY(26px); }
[data-nvp-stagger].is-in {
  opacity: 1; transform: none;
  transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);
  transition-delay: var(--nvp-d, 0s);
}
@media (prefers-reduced-motion: reduce) {
  [data-nvp-stagger] { opacity: 1; transform: none; }
}

/* ═══════════════════════════════════════════════════════════
   v4 — 하이엔드 교체: 3D 틸트 · 코닉 링 · 점화 · 카운트업
   ═══════════════════════════════════════════════════════════ */

/* ── 회전 코닉 그라데이션 보더 (JS가 .nvp-ring 주입) ── */
.nvp-ring {
  position: absolute; inset: 0; border-radius: inherit; padding: 1.2px;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0; transition: opacity .45s; pointer-events: none; overflow: hidden;
}
.nvp-ring i {
  content: ''; position: absolute; inset: -60%; display: block;
  background: conic-gradient(from 0deg,
    transparent 0 62%, rgba(122,168,255,.95) 76%, rgba(34,211,238,.9) 86%, transparent 94%);
}
@keyframes nvpSpin { to { transform: rotate(1turn); } }
/* 링은 hover 시에만 보이므로 애니메이션도 hover 시에만 실행 (상시 회전 제거) */
.svc-card:hover .nvp-ring, .why-item:hover .nvp-ring,
.stat-box:hover .nvp-ring, .koh-exp-card:hover .nvp-ring { opacity: 1; }
.svc-card:hover .nvp-ring i, .why-item:hover .nvp-ring i,
.stat-box:hover .nvp-ring i, .koh-exp-card:hover .nvp-ring i { animation: nvpSpin 3.4s linear infinite; }

/* 틸트 대상: GPU 힌트는 hover 시에만 (상시 레이어 승격 방지) */
[data-nvp-tilt] { transform-style: preserve-3d; }
[data-nvp-tilt]:hover { will-change: transform; }
/* 화면 밖(nvp-off-view) · 탭 숨김(nvp-off-hidden) 시 무한 애니메이션 일시정지 */
.nvp-off-view, .nvp-off-hidden { animation-play-state: paused !important; }
[data-nvp-tilt] > * { transform: translateZ(0); }

/* ── 프로세스 번호 점화(스크롤 진입 시 순차 팝) ── */
.svc-dark [data-nvp-stagger].is-in .process-num,
.sub-dark [data-nvp-stagger].is-in .process-num {
  animation: nvpPop .75s cubic-bezier(.3,1.6,.5,1) backwards;
  animation-delay: calc(var(--nvp-d, 0s) + .18s);
}
@keyframes nvpPop {
  0% { transform: scale(.45); box-shadow: 0 0 0 0 rgba(96,165,250,0); }
  65% { transform: scale(1.18); box-shadow: 0 14px 40px -6px rgba(37,99,235,.8), 0 0 0 10px rgba(96,165,250,.15); }
  100% { transform: scale(1); }
}

/* ── 통계 숫자 카운트업 중 톤 ── */
.nvp-counting { filter: brightness(1.25); }

/* ── CTA 오로라 드리프트 ── */
.svc-dark .cta-box, .sub-dark .cta-box { background-size: 130% 130%, 130% 130%, 100% 100% !important; animation: nvpAurora 9s ease-in-out infinite alternate; }
@keyframes nvpAurora {
  0%   { background-position: 100% 0%, 0% 100%, 0 0; }
  100% { background-position: 80% 22%, 22% 78%, 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  .nvp-ring i, .svc-dark .cta-box, .sub-dark .cta-box { animation: none !important; }
  .svc-dark [data-nvp-stagger].is-in .process-num,
  .sub-dark [data-nvp-stagger].is-in .process-num { animation: none !important; }
}

/* ═══════════════════════════════════════════════════════════
   자체 개발 AI 영상 제작 파이프라인 (NODE STUDIO) 노드 그래프 섹션
   ═══════════════════════════════════════════════════════════ */
.nvpl-section {
  position: relative; overflow: hidden;
  background: #05070d; padding: 108px 0 112px;
  border-top: 1px solid rgba(255,255,255,.05);
}
.nvpl-section::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(ellipse 48% 55% at 84% 10%, rgba(56,189,248,.08), transparent 60%),
              radial-gradient(ellipse 42% 50% at 8% 96%, rgba(124,58,237,.06), transparent 62%);
}
.nvpl-section .container { position: relative; z-index: 1; }
.nvpl-kicker {
  font-family:'Inter',sans-serif; font-size:.7rem; font-weight:800;
  letter-spacing:.3em; color:#4c617f; text-transform:uppercase; margin-bottom:24px;
  display:flex; align-items:center; gap:13px;
}
.nvpl-kicker::before { content:''; width:38px; height:1px; background:rgba(120,150,190,.45); }
.nvpl-title {
  font-size: clamp(1.6rem, 4.2vw, 3rem); font-weight: 900; line-height: 1.28;
  letter-spacing: -.02em; color: #f5f9ff; margin: 0; max-width: 900px;
  word-break: keep-all; overflow-wrap: break-word; text-wrap: balance;
}
.nvpl-title .hl {
  background: linear-gradient(100deg,#60a5fa,#38bdf8 55%,#a78bfa);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.nvpl-sub {
  margin-top: 22px; max-width: 720px; color: #93a6c2; font-size: 1.04rem; line-height: 1.85;
}
.nvpl-sub b { color: #dbe7fb; }

/* 캔버스(노드 에디터 느낌) */
.nvpl-canvas {
  position: relative; margin-top: 44px; border-radius: 20px; overflow: hidden;
  border: 1px solid rgba(148,163,184,.16);
  background: linear-gradient(165deg, #0a0d15, #070a11 70%);
  box-shadow: 0 40px 90px -40px rgba(10,40,120,.5), 0 0 0 1px rgba(255,255,255,.02) inset;
}
.nvpl-canvas::before {  /* 도트 그리드 */
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image: radial-gradient(rgba(148,183,255,.14) 1px, transparent 1px);
  background-size: 22px 22px;
}
.nvpl-canvas-bar {
  position: relative; display: flex; align-items: center; gap: 8px;
  padding: 11px 16px; border-bottom: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.015);
}
.nvpl-canvas-bar i { width: 9px; height: 9px; border-radius: 50%; background:#2a3242; }
.nvpl-canvas-bar i:nth-child(1){ background:#e0736b; } .nvpl-canvas-bar i:nth-child(2){ background:#e3b34f; } .nvpl-canvas-bar i:nth-child(3){ background:#5bb87e; }
.nvpl-canvas-bar b { margin-left: 8px; font-family:'Inter',sans-serif; font-size:.74rem; font-weight:700; letter-spacing:.14em; color:#7f93b3; }
.nvpl-canvas-bar .nvpl-live { margin-left:auto; font-size:.68rem; font-weight:700; color:#6fe0a6; display:flex; align-items:center; gap:6px; }
.nvpl-canvas-bar .nvpl-live::before { content:''; width:7px; height:7px; border-radius:50%; background:#6fe0a6; box-shadow:0 0 0 0 rgba(111,224,166,.6); animation: nvplPulse 2s infinite; }
@keyframes nvplPulse { 0%{box-shadow:0 0 0 0 rgba(111,224,166,.5);} 70%{box-shadow:0 0 0 7px rgba(111,224,166,0);} 100%{box-shadow:0 0 0 0 rgba(111,224,166,0);} }

/* 플로우(노드 배치) */
.nvpl-flow {
  position: relative; z-index: 1; display: flex; align-items: center; justify-content: center;
  gap: 0; padding: 40px 26px; flex-wrap: nowrap;
}
.nvpl-col { display: flex; flex-direction: column; gap: 16px; justify-content: center; }

.nvpl-node {
  width: 214px; border-radius: 12px; overflow: hidden;
  background: linear-gradient(180deg, #191b22, #14161c);
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 16px 34px -16px rgba(0,0,0,.7);
}
.nvpl-node--model { width: 230px; border-color: rgba(120,170,255,.42);
  box-shadow: 0 20px 46px -14px rgba(40,90,200,.5), 0 0 0 1px rgba(120,170,255,.14) inset; }
.nvpl-nhead {
  display:flex; align-items:center; gap:8px; padding: 9px 12px;
  font-size:.82rem; font-weight:700; color:#e7ebf3; border-bottom:1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
}
.nvpl-nhead .nvpl-dot { width:8px; height:8px; border-radius:50%; background:#38bdf8; flex:0 0 auto; }
.nvpl-node--model .nvpl-nhead .nvpl-dot { background:#a78bfa; }
.nvpl-node--out .nvpl-nhead .nvpl-dot { background:#6fe0a6; }
.nvpl-nbody { padding: 11px 12px 13px; }
.nvpl-port { display:flex; align-items:center; gap:7px; font-size:.76rem; color:#aab4c6; padding: 3px 0; }
.nvpl-port i { width:7px; height:7px; border-radius:50%; background:#57b98a; }
.nvpl-port.in i { background:#e3b34f; }
.nvpl-port.out { justify-content:flex-end; }
.nvpl-chip {
  margin-top:8px; font-family:'Inter',sans-serif; font-size:.62rem; font-weight:700; letter-spacing:.04em;
  color:#8fb6ff; background: rgba(96,165,250,.1); border:1px solid rgba(96,165,250,.22);
  border-radius:6px; padding:5px 8px; line-height:1.5; word-break:keep-all;
}
.nvpl-badge {
  display:inline-block; margin-top:2px; font-family:'Inter',sans-serif; font-size:.74rem; font-weight:800;
  color:#cbe0ff; background: linear-gradient(135deg, rgba(37,99,235,.35), rgba(124,58,237,.28));
  border:1px solid rgba(148,183,255,.3); border-radius:7px; padding:6px 10px; letter-spacing:.02em;
}
.nvpl-prev {
  margin-top:8px; height:74px; border-radius:8px; position:relative; overflow:hidden;
  background: linear-gradient(135deg,#12233f,#1a2c4d 45%,#26183f);
  border:1px solid rgba(255,255,255,.07);
}
.nvpl-prev::after {
  content:''; position:absolute; inset:0;
  background: radial-gradient(120px 60px at 30% 20%, rgba(120,190,255,.35), transparent 60%),
             radial-gradient(120px 80px at 80% 90%, rgba(180,120,255,.28), transparent 60%);
}
.nvpl-prev .nvpl-play {
  position:absolute; left:9px; bottom:8px; z-index:1; display:flex; align-items:center; gap:6px;
  font-family:'Inter',sans-serif; font-size:.66rem; font-weight:700; color:#eaf1ff;
  background:rgba(3,7,15,.55); border-radius:20px; padding:3px 9px 3px 6px; backdrop-filter: blur(2px);
}
.nvpl-prev .nvpl-play::before { content:''; width:0;height:0; border-left:8px solid #fff; border-top:5px solid transparent; border-bottom:5px solid transparent; }
.nvpl-prev .nvpl-tag { position:absolute; right:8px; top:7px; z-index:1; font-size:.6rem; font-weight:700; color:#bcd0ee; background:rgba(3,7,15,.5); border-radius:5px; padding:2px 6px; }

/* 연결선(와이어) */
.nvpl-wire { flex:0 0 44px; height:2px; align-self:center; position:relative;
  background: linear-gradient(90deg, rgba(56,189,248,.12), rgba(56,189,248,.75)); border-radius:2px; }
.nvpl-wire::after { content:''; position:absolute; right:-1px; top:50%; transform:translateY(-50%);
  width:0;height:0; border-left:7px solid rgba(56,189,248,.85); border-top:5px solid transparent; border-bottom:5px solid transparent; }
.nvpl-wire::before { content:''; position:absolute; left:0; top:50%; width:7px; height:7px; border-radius:50%;
  transform:translate(-3px,-50%); background:#38bdf8; box-shadow:0 0 8px rgba(56,189,248,.7); }

.nvpl-caption { margin-top:20px; font-size:.86rem; color:#7387a6; line-height:1.7; }
.nvpl-caption b { color:#b9cbe6; }
.nvpl-tags { margin-top:26px; display:flex; flex-wrap:wrap; gap:10px; }
.nvpl-tags span {
  display:inline-flex; align-items:center; gap:7px; font-size:.82rem; font-weight:600; color:#b9cbe6;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:100px; padding:8px 16px;
  transition: border-color .25s, background .25s;
}
.nvpl-tags span:hover { border-color:rgba(56,189,248,.45); background:rgba(56,189,248,.07); }
.nvpl-tags span::before { content:''; width:6px; height:6px; border-radius:50%; background:#38bdf8; }

@media (max-width: 900px) {
  .nvpl-section { padding: 80px 0 84px; }
  .nvpl-flow { flex-direction: column; padding: 30px 18px; }
  .nvpl-col { flex-direction: row; flex-wrap: wrap; justify-content:center; width:100%; }
  .nvpl-node, .nvpl-node--model { width: 100%; max-width: 300px; }
  .nvpl-col .nvpl-node { flex: 1 1 240px; }
  .nvpl-wire { flex:0 0 34px; width:2px; height:34px; align-self:center;
    background: linear-gradient(180deg, rgba(56,189,248,.12), rgba(56,189,248,.75)); }
  .nvpl-wire::after { right:50%; top:auto; bottom:-1px; transform:translateX(50%);
    border-left:5px solid transparent; border-right:5px solid transparent; border-top:7px solid rgba(56,189,248,.85); border-bottom:0; }
  .nvpl-wire::before { left:50%; top:0; transform:translate(-50%,-3px); }
}
@media (prefers-reduced-motion: reduce) {
  .nvpl-canvas-bar .nvpl-live::before { animation: none !important; }
}

/* ═══════════════════════════════════════════════════════════
   BYGENCY — 자체 개발 통합 마케팅 프로그램 섹션
   ═══════════════════════════════════════════════════════════ */
.byg-logo { display:inline-flex; align-items:center; margin: 4px 0 24px; }
/* 배경 투명 처리된 로고(워드마크는 밝은색) — 다크 섹션에 그대로 얹음 */
.byg-logo img {
  display:block; height:66px; width:auto; max-width:82vw; object-fit:contain;
  filter: drop-shadow(0 6px 20px rgba(37,99,235,.32));
}
@media (max-width:900px){ .byg-logo img { height:50px; } }
.byg-fallback { display:none; align-items:center; gap:13px; }
.byg-fallback .byg-mark { width:44px; height:44px; flex:0 0 auto; }
.byg-fallback .byg-word {
  font-family:'Inter',sans-serif; font-weight:900; font-size:2.1rem; letter-spacing:.06em;
  background:linear-gradient(90deg,#1e40af,#2563eb 45%,#22d3ee);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
/* 기능 그리드 */
.byg-feats {
  margin-top: 38px; display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:14px;
}
.byg-feat {
  position:relative; background:linear-gradient(165deg, rgba(30,41,59,.5), rgba(10,15,28,.72));
  border:1px solid rgba(148,163,184,.14); border-radius:16px; padding:22px 20px;
  transition:transform .32s cubic-bezier(.22,1,.36,1), border-color .32s, box-shadow .32s;
}
.byg-feat:hover {
  transform:translateY(-5px); border-color:rgba(148,197,255,.42);
  box-shadow:0 24px 54px -22px rgba(30,80,200,.5), 0 0 0 1px rgba(148,197,255,.1);
}
.byg-feat .byg-num { font-family:'Inter',sans-serif; font-size:.64rem; font-weight:800; letter-spacing:.16em;
  color:#5f7db4; position:absolute; top:18px; right:18px; }
.byg-feat .byg-ic {
  width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(37,99,235,.3), rgba(34,211,238,.18));
  border:1px solid rgba(120,170,255,.28); margin-bottom:14px;
  box-shadow:0 8px 20px -8px rgba(37,99,235,.5);
}
.byg-feat .byg-ic svg { width:22px; height:22px; stroke:#8fd0ff; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.byg-feat h4 { font-size:1rem; font-weight:800; color:#eef4ff; margin:0 0 7px; letter-spacing:-.01em; }
.byg-feat p { font-size:.85rem; color:#93a6c2; line-height:1.62; margin:0; }
/* CTA */
.byg-cta { margin-top:40px; display:flex; flex-wrap:wrap; gap:16px 20px; align-items:center; }
.byg-btn {
  display:inline-flex; align-items:center; gap:10px; font-size:1.02rem; font-weight:800; color:#fff;
  background:linear-gradient(100deg,#1d4ed8,#2563eb 50%,#0ea5e9); border-radius:14px; padding:16px 30px;
  text-decoration:none; box-shadow:0 18px 44px -14px rgba(37,99,235,.75);
  transition:transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s;
}
.byg-btn:hover { transform:translateY(-3px); box-shadow:0 28px 58px -14px rgba(37,99,235,.9); }
.byg-btn svg { width:20px; height:20px; stroke:#fff; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.byg-cta .byg-note { font-size:.88rem; color:#8ea3c0; }
.byg-cta .byg-note b { color:#dbe7fb; }
@media (max-width: 900px) {
  .byg-logo img { height:46px; }
  .byg-fallback .byg-word { font-size:1.6rem; }
}
/* 모바일: 서비스 카드 2열 컴팩트 정돈 */
@media (max-width: 640px) {
  .byg-feats { grid-template-columns:1fr 1fr !important; gap:10px; margin-top:26px; }
  .byg-feat { padding:16px 14px; border-radius:14px; }
  .byg-feat .byg-num { top:12px; right:12px; font-size:.58rem; }
  .byg-feat .byg-ic { width:38px; height:38px; border-radius:10px; margin-bottom:10px; }
  .byg-feat .byg-ic svg { width:19px; height:19px; }
  .byg-feat h4 { font-size:.9rem; margin-bottom:5px; word-break:keep-all; }
  .byg-feat p { font-size:.78rem; line-height:1.55; }
}
@media (max-width: 380px) {
  .byg-feats { grid-template-columns:1fr !important; }
}

/* ============================================================
   한글 제목 줄바꿈 정돈 (전 페이지 공통)
   - word-break:keep-all → 어절(단어) 중간에서 끊기지 않음
   - text-wrap:balance   → 여러 줄일 때 줄 길이를 균형 있게 배분
   ============================================================ */
h1, h2, h3,
.section-title, .nvpl-title, .nvp-st-line, .hx-title,
.sub-hero h1, .ins-hero h1, .pt-hero h1, .mv-hero h1, .team-hero h1,
.syn-title, .ins-body h2, .inshub-card h3, .svc-faq-head h2 {
  word-break: keep-all;
  overflow-wrap: break-word;
  text-wrap: balance;
}

/* ── 인라인 SVG 아이콘(이모지 대체) ── */
.nv-emo{width:1em;height:1em;display:inline-block;vertical-align:-.14em;flex:0 0 auto;line-height:1;}
.nv-emo path,.nv-emo circle,.nv-emo rect,.nv-emo line,.nv-emo polyline,.nv-emo polygon{vector-effect:non-scaling-stroke;}
.rt-node i .nv-emo{width:16px;height:16px;}
.ig-actions .nv-emo,.fb-act .nv-emo,.fb-stat .nv-emo,.kko-msg .nv-emo{width:1.05em;height:1.05em;vertical-align:-.16em;}
.icon .nv-emo{width:1em;height:1em;}
