/* assets/css/ns_alert.css
   PHP 보안 취약점 긴급 띠배너 (include/new_header.php 에서 노출 기간에만 로드)
   · 헤더(.nh)가 fixed(top:0, 60px) 이므로 배너도 그 아래 top:60px 에 고정
   · 배너가 떠 있는 동안 html.ns-alert-on + --ns-alert-h(실측 높이, JS) 로 본문 상단 여백 보정
   · 종료 후에는 new_header.php 의 NS_ALERT_END 상수만 비우면 됨 (이 파일은 로드되지 않음) */

.ns-alert{
  position:fixed;top:60px;left:0;right:0;z-index:498;   /* 헤더(500)·모바일 드로어(499) 아래 */
  background:#0D1F17;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.no-js .ns-alert{position:relative;top:auto;}           /* JS 없으면 여백 보정이 안 되므로 흐름 안에 둠 */

.ns-alert-on body.pv-page{padding-top:calc(60px + var(--ns-alert-h, 0px));}

.ns-alert-in{
  max-width:1180px;margin:0 auto;
  padding:13px 24px;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.ns-alert-pill{
  flex:none;
  display:inline-flex;align-items:center;gap:6px;
  background:#C8382F;color:#fff;
  font-size:11.5px;font-weight:800;letter-spacing:.06em;line-height:1;
  padding:5px 11px;border-radius:var(--r-full);
  white-space:nowrap;
}
.ns-alert-pill i{
  width:5px;height:5px;border-radius:50%;background:#fff;
  animation:nsAlertBlink 1.5s ease-in-out infinite;
}
@keyframes nsAlertBlink{
  0%,100%{opacity:1;}
  50%{opacity:.3;}
}
.ns-alert-txt{
  flex:1 1 300px;margin:0;
  font-size:14.5px;line-height:1.5;color:#D7E5DE;
}
.ns-alert-txt b{color:#fff;font-weight:700;}
.ns-alert-cta{
  flex:none;display:inline-block;
  background:var(--accent-l);color:#fff;
  font-size:13.5px;font-weight:700;line-height:1.2;
  padding:9px 18px;border-radius:var(--r-full);
  white-space:nowrap;text-decoration:none;
  transition:background .15s;
}
.ns-alert-cta:hover{background:#2EC183;color:#fff;}
.ns-alert-x{
  flex:none;
  background:none;border:0;cursor:pointer;
  color:rgba(255,255,255,.45);
  font-family:inherit;font-size:20px;line-height:1;
  padding:4px 8px;
  transition:color .15s;
}
.ns-alert-x:hover{color:#fff;}

@media (max-width:560px){
  .ns-alert-in{
    position:relative;
    padding:clamp(10px, 2.26vw, 13px) clamp(16px, 4.17vw, 24px);
    padding-right:clamp(40px, 7.29vw, 56px);               /* 우측 상단 닫기 버튼 자리 */
    gap:clamp(10px, 2.08vw, 16px);
  }
  .ns-alert-txt{font-size:clamp(13px, 1.89vw, 14.5px);}
  .ns-alert-cta{
    flex:1 1 100%;text-align:center;
    font-size:clamp(12.5px, 1.76vw, 13.5px);
    padding:clamp(8px, 1.17vw, 9px) clamp(14px, 2.34vw, 18px);
  }
  .ns-alert-x{
    position:absolute;
    top:clamp(6px, 1.3vw, 10px);right:clamp(6px, 1.3vw, 10px);
    font-size:clamp(18px, 2.6vw, 20px);
  }
}

@media (prefers-reduced-motion:reduce){
  .ns-alert-pill i{animation:none;}
}