.cnap * { box-sizing: border-box; }
.cnap {
  font-family: 'Instrument Sans','Noto Sans KR',sans-serif;
  background: #fff;
  color: #313435;
  line-height: 1.7;
  --dark:   #05294d;
  --mid:    #09498a;
  --blue:   #1976d2;
  --blt:    #f1f7ff;
  --orange: #bf7b3a;
  --green:  #16a34a;
  --hdk:    #98c1ea;
  --hlt:    #05294d;
  --body:   #313435;
  --muted:  #677172;
  --border: #c7d1d3;
  --grey:   #f7f7f7;
  --mono:   'IBM Plex Mono', monospace;

  --eye-size: 12px;
  --sub-size: 1.15rem;
  --sub-max-width: none;
  --sub-white-space: nowrap;
  --hero-badge-size: 12px;
  --hero-sub-size: 1.2rem;
  --pill-size: 14px;
  --metric-lbl-size: 12px;
  --cta-btn-size: 16px;
  --cta-note-size: 12px;
}

.cnap .dk { background: var(--dark); position: relative; overflow: hidden; }
.cnap .wh { background: #fff; }
.cnap .gy { background: var(--grey); }
.cnap .dk::before { content:''; position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(25,118,210,0.18) 0%,transparent 70%); top:-120px; left:-120px; pointer-events:none; }
.cnap .dk::after  { content:''; position:absolute; width:360px; height:360px; border-radius:50%; background:radial-gradient(circle,rgba(25,118,210,0.12) 0%,transparent 70%); bottom:-100px; right:-100px; pointer-events:none; }

.cnap section { padding: 88px 0; }
.cnap #hero { padding: 0; min-height: 80vh; display: flex; align-items: center; }
.cnap .wrap { max-width: 1060px; margin: 0 auto; padding: 0 2rem; position: relative; z-index: 1; }
.cnap .wrap-sm { max-width: 740px; margin: 0 auto; padding: 0 2rem; position: relative; z-index: 1; text-align: center; }

.cnap .eye { font-family: var(--mono); font-size: var(--eye-size); font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; display: block; margin-bottom: 0.9rem; }
.cnap .eye-dk { color: #4e9de0; }
.cnap .eye-lt { color: var(--mid); }

.cnap h1 { font-size: clamp(2.2rem,5vw,3.4rem); font-weight: 700; line-height: 1.18; letter-spacing: -0.02em; margin-bottom: 1.1rem; color: var(--hdk); }
.cnap h2 { font-size: clamp(1.6rem,3.5vw,2.4rem); font-weight: 700; line-height: 1.22; letter-spacing: -0.015em; margin-bottom: 0.85rem; }
.cnap h2.dk { color: var(--hdk); }
.cnap h2.lt { color: var(--hlt); }
.cnap .sub { font-size: var(--sub-size); line-height: 1.75; max-width: var(--sub-max-width); margin-bottom: 2.5rem; white-space: var(--sub-white-space); }
.cnap .sub.dk { color: rgba(255,255,255,0.6); }
.cnap .sub.lt { color: var(--muted); }
.cnap .sub.cx { margin-left: auto; margin-right: auto; }

.cnap .hero-badge { display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:var(--hero-badge-size); letter-spacing:0.12em; text-transform:uppercase; color:#98c1ea; background:rgba(25,118,210,0.12); border:1px solid rgba(25,118,210,0.3); padding:6px 16px; border-radius:999px; margin-bottom:2rem; }
.cnap .hero-badge::before { content:'●'; font-size:7px; animation:cnap-blink 2s infinite; }
@keyframes cnap-blink { 0%,100%{opacity:1}50%{opacity:.3} }
.cnap .accent { color: var(--orange); }
.cnap .hero-inner { text-align: center; }
.cnap .hero-sub { font-size:var(--hero-sub-size); color:rgba(255,255,255,0.58); max-width:700px; margin:0 auto 2.25rem; line-height:1.78; }
.cnap .pills { display:flex; justify-content:center; gap:0.6rem; flex-wrap:wrap; margin-bottom:3rem; }
.cnap .pill { font-size:var(--pill-size); font-weight:500; color:rgba(255,255,255,0.65); background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.13); padding:6px 14px; border-radius:6px; display:flex; align-items:center; gap:6px; }
.cnap .pill .d { width:5px; height:5px; border-radius:50%; background:#34d399; }
.cnap .metrics { display:flex; justify-content:center; gap:3rem; }
.cnap .metric-val { font-size:2rem; font-weight:700; color:var(--hdk); line-height:1; margin-bottom:0.25rem; }
.cnap .metric-lbl { font-family:var(--mono); font-size:var(--metric-lbl-size); color:rgba(255,255,255,0.4); letter-spacing:0.06em; }

.cnap .conclusion { background:var(--dark); border-radius:10px; padding:2rem; text-align:center; position:relative; overflow:hidden; }
.cnap .conclusion::before { content:''; position:absolute; width:280px; height:280px; border-radius:50%; background:radial-gradient(circle,rgba(25,118,210,0.25) 0%,transparent 70%); top:-100px; left:-60px; pointer-events:none; }
.cnap .conclusion h3 { font-size:1.15rem; font-weight:700; color:var(--hdk); margin-bottom:0.5rem; position:relative; }
.cnap .conclusion p  { font-size:15px; color:rgba(255,255,255,0.55); position:relative; line-height:1.75; margin:0; }

.cnap #cta { text-align:center; border-top:1px solid rgba(255,255,255,0.07); }
.cnap #cta .sub { color:rgba(255,255,255,0.55); }
.cnap .cta-btn { display:inline-block; background:var(--blue); color:#fff; font-size:var(--cta-btn-size); font-weight:600; padding:13px 34px; border-radius:6px; text-decoration:none; transition:background .2s,box-shadow .2s; }
.cnap .cta-btn:hover { background:var(--mid); box-shadow:0 4px 18px rgba(25,118,210,0.4); color:#fff; }
.cnap .cta-note { font-family:var(--mono); font-size:var(--cta-note-size); color:rgba(255,255,255,0.28); margin-top:1.1rem; }

.cnap .subnav {
  position: sticky;
  top: 52px;
  z-index: 90;
  background: var(--dark);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 2px 12px rgba(0,0,0,0.25);
}
.cnap .subnav-inner {
  max-width: 1060px;
  margin: 0 auto;
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  gap: 1rem;
}
.cnap .subnav-links { display: flex; gap: 0.25rem; }
.cnap .subnav-links a {
  color: rgba(255,255,255,0.65);
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  padding: 6px 14px;
  border-radius: 5px;
  transition: color .2s, background .2s;
  white-space: nowrap;
}
.cnap .subnav-links a:hover { color: #fff; background: rgba(255,255,255,0.07); }
.cnap .subnav-cta {
  background: var(--blue);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 12px;
  border-radius: 4px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s;
}
.cnap .subnav-cta:hover { background: var(--mid); color: #fff; }

@media (max-width:768px) {
  .cnap .metrics { gap:1.75rem; }
  .cnap .sub { white-space: normal; }
  .cnap .subnav { display:none; }
}

/* INTRO PAGE SPECIFIC */
.cnap.cnap-intro {
  --eye-size: 11px;
  --sub-size: 1.05rem;
  --sub-max-width: 560px;
  --sub-white-space: normal;
  --hero-badge-size: 11px;
  --hero-sub-size: 1.1rem;
  --pill-size: 13px;
  --metric-lbl-size: 11px;
  --cta-btn-size: 15px;
  --cta-note-size: 11px;
}

.cnap.cnap-intro .lc-bar { display:flex; align-items:stretch; border:1px solid var(--border); border-radius:10px; overflow:hidden; margin-bottom:2rem; box-shadow:0 2px 6px rgba(0,0,0,0.05); }
.cnap.cnap-intro .lc-step { flex:1; padding:1.25rem 0.75rem; text-align:center; border-right:1px solid var(--border); }
.cnap.cnap-intro .lc-step:last-child { border-right:none; }
.cnap.cnap-intro .lc-ico { font-size:1.2rem; margin-bottom:0.4rem; }
.cnap.cnap-intro .lc-nm { font-size:13px; font-weight:700; color:var(--hlt); margin-bottom:0.1rem; }
.cnap.cnap-intro .lc-dsc { font-size:11px; color:var(--muted); line-height:1.45; }
.cnap.cnap-intro .lc-arr { display:flex; align-items:center; padding:0 0.1rem; color:var(--border); font-size:1rem; flex-shrink:0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.cnap.cnap-intro .lc-loop { font-family:var(--mono); font-size:11px; color:var(--muted); display:flex; align-items:center; gap:0.75rem; margin-bottom:2.5rem; }
.cnap.cnap-intro .lc-loop::before,.cnap.cnap-intro .lc-loop::after { content:''; flex:1; height:1px; background:var(--border); }

.cnap.cnap-intro .msa-axiom { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2.5rem; }
.cnap.cnap-intro .msa-axiom-item { background:var(--grey); border:1px solid var(--border); border-radius:8px; padding:1.1rem 1.25rem; font-size:13px; color:var(--muted); line-height:1.65; }
.cnap.cnap-intro .msa-axiom-label { display:block; font-family:var(--mono); font-size:10px; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; color:var(--mid); margin-bottom:0.4rem; }
.cnap.cnap-intro .conclusion h3 { font-size:1.1rem; }
.cnap.cnap-intro .conclusion p { font-size:13px; }

.cnap.cnap-intro .pipe { display:flex; align-items:stretch; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:10px; overflow:hidden; margin-bottom:1.75rem; }
.cnap.cnap-intro .pipe-s { flex:1; padding:1.4rem 0.75rem; text-align:center; border-right:1px solid rgba(255,255,255,0.08); }
.cnap.cnap-intro .pipe-s:last-child { border-right:none; }
.cnap.cnap-intro .pipe-n { display:inline-block; width:24px; height:24px; border-radius:50%; background:rgba(25,118,210,0.2); border:1px solid rgba(25,118,210,0.45); color:#98c1ea; font-family:var(--mono); font-size:10px; font-weight:500; line-height:22px; text-align:center; margin-bottom:0.5rem; }
.cnap.cnap-intro .pipe-t { font-size:13px; font-weight:700; color:var(--hdk); margin-bottom:0.15rem; }
.cnap.cnap-intro .pipe-w { font-family:var(--mono); font-size:10px; color:rgba(255,255,255,0.38); }
.cnap.cnap-intro .pipe-a { display:flex; align-items:center; padding:0 0.1rem; color:rgba(25,118,210,0.5); font-size:1rem; flex-shrink:0; }
.cnap.cnap-intro .notes { display:grid; grid-template-columns:repeat(3,1fr); gap:0.85rem; }
.cnap.cnap-intro .note { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.09); border-radius:8px; padding:1.1rem 1.25rem; }
.cnap.cnap-intro .note-l { font-family:var(--mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color:#4e9de0; margin-bottom:0.4rem; }
.cnap.cnap-intro .note-t { font-size:13px; color:rgba(255,255,255,0.52); line-height:1.65; }

.cnap.cnap-intro .ba { border-radius:10px; overflow:hidden; border:1px solid var(--border); box-shadow:0 2px 6px rgba(0,0,0,0.05); }
.cnap.cnap-intro .ba-head { display:grid; grid-template-columns:110px 1fr 28px 1fr; background:var(--dark); }
.cnap.cnap-intro .ba-hc { padding:0.75rem 1.1rem; font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; font-weight:500; }
.cnap.cnap-intro .ba-hc.b { color:#fca5a5; }
.cnap.cnap-intro .ba-hc.a { color:#86efac; text-align:right; }
.cnap.cnap-intro .ba-row { display:grid; grid-template-columns:110px 1fr 28px 1fr; border-top:1px solid var(--border); }
.cnap.cnap-intro .ba-row:nth-child(odd) .ba-c { background:#fff; }
.cnap.cnap-intro .ba-row:nth-child(even) .ba-c { background:var(--grey); }
.cnap.cnap-intro .ba-c { padding:0.85rem 1.1rem; font-size:14px; display:flex; align-items:center; }
.cnap.cnap-intro .ba-ph { font-family:var(--mono); font-size:10px; font-weight:500; letter-spacing:0.08em; text-transform:uppercase; color:var(--mid); border-right:1px solid var(--border); }
.cnap.cnap-intro .ba-b { color:#b91c1c; border-left:3px solid #fca5a5; }
.cnap.cnap-intro .ba-b::before { content:'✕ '; font-weight:700; color:#dc2626; flex-shrink:0; }
.cnap.cnap-intro .ba-m { justify-content:center; color:var(--border); }
.cnap.cnap-intro .ba-a { color:#15803d; }
.cnap.cnap-intro .ba-a::before { content:'✓ '; font-weight:700; color:#16a34a; flex-shrink:0; }

.cnap.cnap-intro .feat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; }
.cnap.cnap-intro .feat { background:#fff; border:1px solid var(--border); border-radius:10px; padding:1.75rem; box-shadow:0 2px 6px rgba(0,0,0,0.05); transition:border-color .2s,box-shadow .2s,transform .2s; }
.cnap.cnap-intro .feat:hover { border-color:var(--blue); box-shadow:0 4px 20px rgba(25,118,210,0.13); transform:translateY(-2px); }
.cnap.cnap-intro .feat-header { display:flex; align-items:center; gap:0.75rem; margin-bottom:0.9rem; }
.cnap.cnap-intro .feat-ico { width:30px; height:30px; border-radius:6px; background:var(--blt); border:1px solid rgba(25,118,210,0.18); display:flex; align-items:center; justify-content:center; font-size:0.85rem; flex-shrink:0; }
.cnap.cnap-intro .feat-lc { font-family:var(--mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color:var(--blue); }
.cnap.cnap-intro .feat-ttl { font-size:15px; font-weight:700; color:var(--hlt); margin-bottom:0.4rem; }
.cnap.cnap-intro .feat-dsc { font-size:13px; color:var(--muted); line-height:1.65; }

.cnap.cnap-intro .layers { display:flex; flex-direction:column; margin-bottom:2.5rem; }
.cnap.cnap-intro .layer { padding:1.5rem 1.75rem; border:1px solid rgba(255,255,255,0.1); }
.cnap.cnap-intro .layer:first-child { border-radius:10px 10px 0 0; }
.cnap.cnap-intro .layer:last-child { border-radius:0 0 10px 10px; border-top:none; }
.cnap.cnap-intro .layer:not(:first-child):not(:last-child) { border-top:none; }
.cnap.cnap-intro .layer.l3 { background:rgba(25,118,210,0.1); border-color:rgba(25,118,210,0.35); }
.cnap.cnap-intro .layer.l2 { background:rgba(25,118,210,0.06); border-color:rgba(25,118,210,0.2); }
.cnap.cnap-intro .layer.l1 { background:rgba(255,255,255,0.03); }
.cnap.cnap-intro .layer-lbl { font-family:var(--mono); font-size:10px; letter-spacing:0.12em; text-transform:uppercase; margin-bottom:0.2rem; }
.cnap.cnap-intro .layer.l3 .layer-lbl { color:#4e9de0; }
.cnap.cnap-intro .layer.l2 .layer-lbl { color:#98c1ea; }
.cnap.cnap-intro .layer.l1 .layer-lbl { color:rgba(255,255,255,0.38); }
.cnap.cnap-intro .layer-ttl { font-size:14px; font-weight:700; color:var(--hdk); margin-bottom:0.65rem; }
.cnap.cnap-intro .chips { display:flex; flex-wrap:wrap; gap:0.35rem; }
.cnap.cnap-intro .chip { font-size:12px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.11); border-radius:5px; padding:3px 9px; color:rgba(255,255,255,0.55); }
.cnap.cnap-intro .chip.own { border-color:rgba(191,123,58,0.5); background:rgba(191,123,58,0.1); color:#e8a96a; }
.cnap.cnap-intro .layer-conn { display:flex; align-items:center; justify-content:center; height:32px; gap:0.65rem; font-family:var(--mono); font-size:10px; color:rgba(255,255,255,0.28); }
.cnap.cnap-intro .layer-conn::before,.cnap.cnap-intro .layer-conn::after { content:''; flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.07),transparent); }
.cnap.cnap-intro .env-rows { display:flex; flex-direction:column; gap:0.55rem; margin-bottom:0.85rem; }
.cnap.cnap-intro .env-row { display:flex; align-items:center; gap:0.7rem; padding-bottom:0.55rem; border-bottom:1px solid rgba(255,255,255,0.07); }
.cnap.cnap-intro .env-row:last-child { border-bottom:none; padding-bottom:0; }
.cnap.cnap-intro .env-badge { font-family:var(--mono); font-size:10px; padding:3px 9px; border-radius:5px; flex-shrink:0; min-width:78px; text-align:center; }
.cnap.cnap-intro .env-badge.lo { background:rgba(25,118,210,0.15); color:#98c1ea; border:1px solid rgba(25,118,210,0.28); }
.cnap.cnap-intro .env-badge.op { background:rgba(191,123,58,0.12); color:#e8a96a; border:1px solid rgba(191,123,58,0.28); }
.cnap.cnap-intro .env-badge.cl { background:rgba(22,163,74,0.1); color:#86efac; border:1px solid rgba(22,163,74,0.22); }
.cnap.cnap-intro .env-info { font-size:13px; color:rgba(255,255,255,0.5); }
.cnap.cnap-intro .env-info strong { color:var(--hdk); font-size:13px; }
.cnap.cnap-intro .env-note { font-family:var(--mono); font-size:11px; color:rgba(255,255,255,0.28); text-align:center; padding:0.7rem; border:1px dashed rgba(25,118,210,0.25); border-radius:7px; line-height:1.6; }

.cnap.cnap-intro .seg-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; }
.cnap.cnap-intro .seg { background:#fff; border:1px solid var(--border); border-radius:10px; padding:1.75rem; box-shadow:0 2px 6px rgba(0,0,0,0.05); transition:border-color .2s,box-shadow .2s; }
.cnap.cnap-intro .seg:hover { border-color:var(--blue); box-shadow:0 4px 20px rgba(25,118,210,0.12); }
.cnap.cnap-intro .seg-lbl { font-family:var(--mono); font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:var(--mid); margin-bottom:0.35rem; }
.cnap.cnap-intro .seg-ttl { font-size:15px; font-weight:700; color:var(--hlt); margin-bottom:0.5rem; }
.cnap.cnap-intro .seg-txt { font-size:13px; color:var(--muted); line-height:1.65; }
.cnap.cnap-intro .seg-tags { display:flex; gap:0.35rem; flex-wrap:wrap; margin-top:0.85rem; }
.cnap.cnap-intro .seg-tag { font-family:var(--mono); font-size:10px; background:var(--blt); border:1px solid rgba(25,118,210,0.18); color:var(--blue); padding:3px 9px; border-radius:4px; }

.cnap.cnap-intro .why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
.cnap.cnap-intro .why { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.09); border-radius:10px; padding:1.5rem; transition:border-color .2s; }
.cnap.cnap-intro .why:hover { border-color:rgba(25,118,210,0.45); }
.cnap.cnap-intro .why-ico { font-size:1.3rem; margin-bottom:0.65rem; }
.cnap.cnap-intro .why-ttl { font-size:14px; font-weight:700; color:var(--hdk); margin-bottom:0.35rem; }
.cnap.cnap-intro .why-dsc { font-size:13px; color:rgba(255,255,255,0.48); line-height:1.65; }

/* Intro section rhythm accents */
.cnap.cnap-intro #lifecycle .eye,
.cnap.cnap-intro #solution .eye,
.cnap.cnap-intro #compare .eye,
.cnap.cnap-intro #features .eye,
.cnap.cnap-intro #architecture .eye,
.cnap.cnap-intro #why .eye,
.cnap.cnap-intro #segments .eye {
  position:relative;
  display:inline-block;
  padding-right:84px;
}
.cnap.cnap-intro #lifecycle .eye::after,
.cnap.cnap-intro #solution .eye::after,
.cnap.cnap-intro #compare .eye::after,
.cnap.cnap-intro #features .eye::after,
.cnap.cnap-intro #architecture .eye::after,
.cnap.cnap-intro #why .eye::after,
.cnap.cnap-intro #segments .eye::after {
  content:'';
  position:absolute;
  right:0;
  top:50%;
  width:72px;
  height:1px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,rgba(25,118,210,0.5),rgba(25,118,210,0));
}
.cnap.cnap-intro #lifecycle h2,
.cnap.cnap-intro #solution h2,
.cnap.cnap-intro #compare h2,
.cnap.cnap-intro #features h2,
.cnap.cnap-intro #architecture h2,
.cnap.cnap-intro #why h2,
.cnap.cnap-intro #segments h2 {
  position:relative;
  padding-bottom:0.45rem;
}
.cnap.cnap-intro #lifecycle h2::after,
.cnap.cnap-intro #solution h2::after,
.cnap.cnap-intro #compare h2::after,
.cnap.cnap-intro #features h2::after,
.cnap.cnap-intro #architecture h2::after,
.cnap.cnap-intro #why h2::after,
.cnap.cnap-intro #segments h2::after {
  content:'';
  position:absolute;
  left:0;
  bottom:0;
  width:56px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,#1976d2,#4e9de0);
}

.cnap.cnap-intro #cta .wrap-sm { max-width:960px; }

/* UNIFIED AUTH PAGE SPECIFIC */
.cnap.cnap-unified-auth {
  --eye-size: 12px;
  --sub-size: 1.15rem;
  --sub-max-width: none;
  --sub-white-space: nowrap;
  --hero-badge-size: 12px;
  --hero-sub-size: 1.2rem;
  --pill-size: 14px;
  --metric-lbl-size: 12px;
  --cta-btn-size: 16px;
  --cta-note-size: 12px;
}

.cnap.cnap-unified-auth .pain-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; margin-bottom:2.5rem; }
.cnap.cnap-unified-auth .pain-card { background:#fff; border:1px solid var(--border); border-radius:10px; padding:1.75rem; box-shadow:0 2px 6px rgba(0,0,0,0.05); }
.cnap.cnap-unified-auth .pain-icon { width:24px; height:24px; margin-bottom:0.85rem; color:var(--mid); display:inline-flex; align-items:center; justify-content:center; }
.cnap.cnap-unified-auth .pain-icon svg { width:24px; height:24px; stroke-width:2; }
.cnap.cnap-unified-auth .pain-ttl { font-size:16px; font-weight:700; color:var(--hlt); margin-bottom:0.4rem; }
.cnap.cnap-unified-auth .pain-dsc { font-size:15px; color:var(--muted); line-height:1.65; }

.cnap.cnap-unified-auth .arch-diag { border:1px solid rgba(255,255,255,0.1); border-radius:12px; overflow:hidden; margin-bottom:1.75rem; }
.cnap.cnap-unified-auth .arch-diag-row { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,0.07); }
.cnap.cnap-unified-auth .arch-node { padding:0.625rem 1.75rem; text-align:center; }
.cnap.cnap-unified-auth .arch-node--client { background:rgba(255,255,255,0.03); }
.cnap.cnap-unified-auth .arch-node--gw { background:rgba(25,118,210,0.1); }
.cnap.cnap-unified-auth .arch-node--svc { background:rgba(255,255,255,0.03); }
.cnap.cnap-unified-auth .arch-node-tag { font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:rgba(255,255,255,0.28); margin-bottom:0.45rem; }
.cnap.cnap-unified-auth .arch-node-name { font-size:15px; font-weight:700; color:var(--hdk); line-height:1.35; }
.cnap.cnap-unified-auth .arch-node-name--client-mixed { white-space:nowrap; }
.cnap.cnap-unified-auth .mobile-break { display:none; }
.cnap.cnap-unified-auth .arch-node-desc { font-family:var(--mono); font-size:12px; color:rgba(255,255,255,0.38); margin-top:0.35rem; }
.cnap.cnap-unified-auth .arch-simple-arrows { display:grid; grid-template-columns:1fr 1fr; }
.cnap.cnap-unified-auth .arch-simple-arrow { text-align:center; padding:8px 0; color:rgba(25,118,210,0.5); font-size:1.15rem; }
.cnap.cnap-unified-auth .arch-merge { position:relative; height:48px; }
.cnap.cnap-unified-auth .arch-merge::before { content:''; position:absolute; left:25%; right:25%; top:0; height:24px; border-left:1px solid rgba(25,118,210,0.25); border-right:1px solid rgba(25,118,210,0.25); border-bottom:1px solid rgba(25,118,210,0.25); border-radius:0 0 6px 6px; }
.cnap.cnap-unified-auth .arch-merge::after { content:'↓'; position:absolute; bottom:4px; left:50%; transform:translateX(-50%); color:rgba(25,118,210,0.55); font-size:1.1rem; line-height:1; }
.cnap.cnap-unified-auth .arch-diag-hub { background:rgba(74,222,128,0.05); border-top:1px solid rgba(74,222,128,0.18); border-bottom:1px solid rgba(74,222,128,0.18); padding:0.75rem 2rem; text-align:center; }
.cnap.cnap-unified-auth .arch-diag-hub-name { font-size:1.25rem; font-weight:700; color:#4ade80; margin-bottom:0.35rem; letter-spacing:-0.01em; }
.cnap.cnap-unified-auth .arch-diag-hub-desc { font-size:15px; color:rgba(255,255,255,0.55); line-height:1.6; margin-bottom:0.25rem; }
.cnap.cnap-unified-auth .arch-diag-hub-spi { font-family:var(--mono); font-size:12px; color:rgba(74,222,128,0.5); }
.cnap.cnap-unified-auth .arch-diag-infra { background:rgba(255,255,255,0.02); border-top:1px solid rgba(255,255,255,0.06); padding:0.9rem 1.75rem; text-align:center; }
.cnap.cnap-unified-auth .arch-diag-infra-lbl { font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.22); display:block; margin-bottom:0.3rem; }
.cnap.cnap-unified-auth .arch-diag-infra-desc { font-size:15px; color:rgba(255,255,255,0.42); }

.cnap.cnap-unified-auth .comp-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; margin-bottom:2rem; }
.cnap.cnap-unified-auth .comp-card {
  background:linear-gradient(180deg,#ffffff 0%,#fcfdff 100%);
  border:1px solid var(--border);
  border-radius:10px;
  padding:1.5rem;
  box-shadow:0 2px 6px rgba(0,0,0,0.05);
  transition:border-color .25s, box-shadow .25s, transform .25s;
}
.cnap.cnap-unified-auth .comp-card:hover {
  border-color:rgba(25,118,210,0.4);
  box-shadow:0 10px 24px rgba(25,118,210,0.14);
  transform:translateY(-4px);
}
.cnap.cnap-unified-auth .comp-name {
  font-size:14px;
  font-weight:700;
  letter-spacing:0.01em;
  text-transform:none;
  color:var(--green);
  background:rgba(22,163,74,0.08);
  border-bottom:1px solid rgba(22,163,74,0.18);
  border-radius:10px 10px 0 0;
  padding:0.75rem 1.5rem;
  margin:-1.5rem -1.5rem 0.75rem;
  line-height:1.3;
}
.cnap.cnap-unified-auth .comp-items { list-style:none; }
.cnap.cnap-unified-auth .comp-items li { font-size:14px; color:var(--muted); padding:5px 0; border-bottom:1px solid var(--border); line-height:1.55; }
.cnap.cnap-unified-auth .comp-items li:last-child { border-bottom:none; }
.cnap.cnap-unified-auth .comp-items li.hi { color:var(--green); font-weight:500; }
.cnap.cnap-unified-auth .comp-items li.hlt { color:var(--hlt); font-size:13px; font-weight:600; }

.cnap.cnap-unified-auth .spi-block { border:1px solid var(--border); border-radius:10px; overflow:hidden; }
.cnap.cnap-unified-auth .spi-head { background:rgba(22,163,74,0.06); border-bottom:1px solid rgba(22,163,74,0.15); padding:0.75rem 1.25rem; display:flex; justify-content:space-between; align-items:center; }
.cnap.cnap-unified-auth .spi-head-ttl { font-size:14px; font-weight:700; color:var(--green); }
.cnap.cnap-unified-auth .spi-head-badge { font-family:var(--mono); font-size:11px; color:var(--muted); background:var(--grey); border:1px solid var(--border); border-radius:4px; padding:2px 8px; }
.cnap.cnap-unified-auth .spi-items { display:grid; grid-template-columns:repeat(4,1fr); background:#fff; }
.cnap.cnap-unified-auth .spi-item {
  padding:0.85rem 1rem;
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  transition:background .2s ease;
}
.cnap.cnap-unified-auth .spi-item:hover { background:#f7fbff; }
.cnap.cnap-unified-auth .spi-item:nth-child(4n) { border-right:none; }
.cnap.cnap-unified-auth .spi-item:nth-last-child(-n+4) { border-bottom:none; }
.cnap.cnap-unified-auth .spi-lbl { font-size:13px; font-weight:600; color:var(--hlt); margin-bottom:0.2rem; }
.cnap.cnap-unified-auth .spi-dsc { font-size:12px; color:var(--muted); line-height:1.55; }

/* Unified-auth section rhythm accents */
.cnap.cnap-unified-auth #problem .eye,
.cnap.cnap-unified-auth #architecture .eye,
.cnap.cnap-unified-auth #components .eye,
.cnap.cnap-unified-auth #compare .eye,
.cnap.cnap-unified-auth #scope .eye {
  position:relative;
  display:inline-block;
  padding-right:84px;
}
.cnap.cnap-unified-auth #problem .eye::after,
.cnap.cnap-unified-auth #architecture .eye::after,
.cnap.cnap-unified-auth #components .eye::after,
.cnap.cnap-unified-auth #compare .eye::after,
.cnap.cnap-unified-auth #scope .eye::after {
  content:'';
  position:absolute;
  right:0;
  top:50%;
  width:72px;
  height:1px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,rgba(25,118,210,0.5),rgba(25,118,210,0));
}
.cnap.cnap-unified-auth #problem h2,
.cnap.cnap-unified-auth #architecture h2,
.cnap.cnap-unified-auth #components h2,
.cnap.cnap-unified-auth #compare h2,
.cnap.cnap-unified-auth #scope h2 {
  position:relative;
  padding-bottom:0.45rem;
}
.cnap.cnap-unified-auth #problem h2::after,
.cnap.cnap-unified-auth #architecture h2::after,
.cnap.cnap-unified-auth #components h2::after,
.cnap.cnap-unified-auth #compare h2::after,
.cnap.cnap-unified-auth #scope h2::after {
  content:'';
  position:absolute;
  left:0;
  bottom:0;
  width:56px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,#1976d2,#4e9de0);
}

.cnap.cnap-unified-auth .cmp-table { border:1px solid var(--border); border-radius:10px; overflow:hidden; width:100%; }
.cnap.cnap-unified-auth .cmp-table table { width:100%; border-collapse:collapse; }
.cnap.cnap-unified-auth .cmp-table thead tr { background:var(--dark); }
.cnap.cnap-unified-auth .cmp-table thead th { font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:0.08em; text-transform:uppercase; color:rgba(255,255,255,0.5); padding:0.85rem 1.1rem; text-align:left; border-bottom:1px solid rgba(255,255,255,0.08); }
.cnap.cnap-unified-auth .cmp-table thead th:first-child { width:20%; color:rgba(255,255,255,0.3); }
.cnap.cnap-unified-auth .cmp-table tbody tr { border-bottom:1px solid var(--border); }
.cnap.cnap-unified-auth .cmp-table tbody tr:last-child { border-bottom:none; }
.cnap.cnap-unified-auth .cmp-table tbody tr:nth-child(even) td { background:var(--grey); }
.cnap.cnap-unified-auth .cmp-table tbody td { padding:0.85rem 1.1rem; font-size:15px; color:var(--muted); vertical-align:top; line-height:1.6; }
.cnap.cnap-unified-auth .cmp-table tbody td:first-child { font-weight:600; color:var(--hlt); font-size:13px; }
.cnap.cnap-unified-auth .cmp-table .td-before { color:#b91c1c; }
.cnap.cnap-unified-auth .cmp-table .td-after { color:#15803d; }
.cnap.cnap-unified-auth .cmp-badge { display:inline-block; background:rgba(22,163,74,0.2); color:#166534; font-family:var(--mono); font-size:11px; font-weight:600; border:1px solid rgba(22,163,74,0.45); border-radius:3px; padding:1px 6px; margin-right:4px; vertical-align:middle; }

.cnap.cnap-unified-auth .scope-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; margin-bottom:1.1rem; }
.cnap.cnap-unified-auth .scope-box { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.09); border-radius:10px; padding:1.75rem; }
.cnap.cnap-unified-auth .scope-box.hi { border-color:rgba(74,222,128,0.3); background:rgba(74,222,128,0.04); }
.cnap.cnap-unified-auth .scope-box-head { font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:rgba(255,255,255,0.72); margin-bottom:1.1rem; display:flex; align-items:center; gap:0.5rem; }
.cnap.cnap-unified-auth .scope-badge { font-family:var(--mono); font-size:11px; background:rgba(74,222,128,0.18); color:#86efac; border:1px solid rgba(74,222,128,0.45); border-radius:3px; padding:1px 7px; }
.cnap.cnap-unified-auth .scope-badge.opt { background:rgba(255,255,255,0.12); color:rgba(255,255,255,0.85); border-color:rgba(255,255,255,0.28); }
.cnap.cnap-unified-auth .scope-box ul { list-style:none; }
.cnap.cnap-unified-auth .scope-box ul li { font-size:15px; color:rgba(255,255,255,0.82); padding:0.5rem 0; border-bottom:1px solid rgba(255,255,255,0.1); line-height:1.65; display:flex; gap:0.6rem; align-items:flex-start; }
.cnap.cnap-unified-auth .scope-box ul li:last-child { border-bottom:none; }
.cnap.cnap-unified-auth .scope-box ul li::before { content:'-'; color:rgba(255,255,255,0.5); flex-shrink:0; font-family:var(--mono); font-size:12px; margin-top:2px; }
.cnap.cnap-unified-auth .output-row { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:10px; padding:1.1rem 1.5rem; display:flex; gap:0.6rem; flex-wrap:wrap; align-items:center; }
.cnap.cnap-unified-auth .output-lbl { font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.72); margin-right:0.5rem; }
.cnap.cnap-unified-auth .output-tag { font-size:13px; color:rgba(255,255,255,0.88); background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.26); border-radius:4px; padding:3px 10px; }

.cnap.cnap-unified-auth #cta .wrap-sm { max-width:960px; }
.cnap.cnap-unified-auth #cta .sub { white-space:normal; max-width:900px; }

@media (max-width:768px) {
  .cnap.cnap-intro .feat-grid,.cnap.cnap-intro .seg-grid,.cnap.cnap-intro .why-grid,.cnap.cnap-intro .notes,.cnap.cnap-intro .msa-axiom { grid-template-columns:1fr; }
  .cnap.cnap-intro .lc-bar,.cnap.cnap-intro .pipe { flex-direction:column; }
  .cnap.cnap-intro .lc-arr,.cnap.cnap-intro .pipe-a { display:none; }
  .cnap.cnap-intro .ba-head,.cnap.cnap-intro .ba-row { grid-template-columns:80px 1fr 24px 1fr; }

  .cnap.cnap-unified-auth .pain-grid,.cnap.cnap-unified-auth .comp-grid,.cnap.cnap-unified-auth .scope-grid { grid-template-columns:1fr; }
  .cnap.cnap-unified-auth .arch-diag { border-radius:10px; }
  .cnap.cnap-unified-auth .arch-diag-row { grid-template-columns:1fr 1fr; }
  .cnap.cnap-unified-auth .arch-node { padding:0.75rem 1rem; }
  .cnap.cnap-unified-auth .arch-node-name { font-size:14px; }
  .cnap.cnap-unified-auth .arch-node-name--client-mixed { white-space:normal; }
  .cnap.cnap-unified-auth .mobile-break { display:inline; }
  .cnap.cnap-unified-auth .arch-node-desc { font-size:11px; }
  .cnap.cnap-unified-auth .arch-simple-arrows { grid-template-columns:1fr 1fr; }
  .cnap.cnap-unified-auth .arch-merge::before { left:16%; right:16%; }
  .cnap.cnap-unified-auth .arch-diag-hub { padding:0.75rem 1rem; }
  .cnap.cnap-unified-auth .arch-diag-hub-name { font-size:1.05rem; }
  .cnap.cnap-unified-auth .arch-diag-hub-desc { font-size:13px; }
  .cnap.cnap-unified-auth .arch-diag-hub-spi { font-size:11px; }
  .cnap.cnap-unified-auth .arch-diag-infra { padding:0.8rem 1rem; }
  .cnap.cnap-unified-auth .arch-diag-infra-desc { font-size:13px; }
  .cnap.cnap-unified-auth .spi-items { grid-template-columns:repeat(2,1fr); }
}