/* ============================================================
   KM Pro 폴리시 레이어 — 21st.dev류 프리미엄 패턴을 절제되게 적용.
   스크롤 진행바 · 네비 스크롤 그림자 · 로고 마퀴 · 카드 스포트라이트
   · 히어로 오로라 · 그라디언트 텍스트. (km-ui.js와 연동)
   메인(.mrn)·아카이브(.mrnA) 페이지에서 로드.
   ============================================================ */

/* 스크롤 진행바 */
.kmProgress{position:fixed;top:0;left:0;height:3px;width:0;z-index:200;
  background:linear-gradient(90deg,var(--km-primary),#2f7fd6 60%,#10a994);
  box-shadow:0 0 10px rgba(47,127,214,.45);transition:width .08s linear}

/* 네비 스크롤 시 그림자/응축(프리미엄 sticky 느낌) */
.kmNav{transition:box-shadow .25s ease, background .25s ease}
body.kmScrolled .kmNav{box-shadow:0 6px 24px rgba(15,35,70,.10);background:rgba(255,255,255,.96);backdrop-filter:saturate(140%) blur(10px)}

/* 신뢰 기관 로고 마퀴 */
.kmMarquee{position:relative;overflow:hidden;padding:8px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.kmMarqueeTrack{display:flex;width:max-content;gap:18px;animation:kmMarq 34s linear infinite}
.kmMarquee:hover .kmMarqueeTrack{animation-play-state:paused}
.kmMarqueeTrack .it{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;
  padding:14px 24px;border:1px solid var(--km-line,#e7ebf2);border-radius:999px;background:#fff;
  font-weight:800;font-size:15px;color:#253044;box-shadow:0 6px 18px rgba(15,35,70,.05)}
.kmMarqueeTrack .it svg,.kmMarqueeTrack .it .kmIco{width:18px;height:18px;color:var(--km-primary);flex:none}
@keyframes kmMarq{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 9px))}}
@media(prefers-reduced-motion:reduce){.kmMarqueeTrack{animation:none;flex-wrap:wrap;justify-content:center}}

/* 카드 커서 스포트라이트(은은한 하이라이트 + 테두리 강조) */
.kmSpot{position:relative;isolation:isolate}
.kmSpot::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:1;pointer-events:none;
  opacity:0;transition:opacity .25s ease;
  background:radial-gradient(220px circle at var(--mx,50%) var(--my,0%), rgba(47,127,214,.16), transparent 60%)}
.kmSpot:hover::after{opacity:1}
.kmSpot:hover{border-color:rgba(47,127,214,.45)}

/* 히어로 오로라(저강도, 다크 히어로 위) */
.kmAurora{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.kmAurora i{position:absolute;border-radius:50%;filter:blur(60px);opacity:.32;mix-blend-mode:screen;
  animation:kmFloat 16s ease-in-out infinite}
.kmAurora i:nth-child(1){width:420px;height:420px;left:-60px;top:-80px;background:#2f7fd6;animation-delay:0s}
.kmAurora i:nth-child(2){width:360px;height:360px;right:6%;top:18%;background:#10a994;opacity:.22;animation-delay:-5s}
.kmAurora i:nth-child(3){width:300px;height:300px;left:34%;bottom:-90px;background:#3b82f6;opacity:.18;animation-delay:-9s}
@keyframes kmFloat{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(24px,-22px) scale(1.08)}}
@media(prefers-reduced-motion:reduce){.kmAurora i{animation:none}}
.mrn .hero .heroInner,.mrnA .hero .heroInner{position:relative;z-index:1}

/* 그라디언트 텍스트 유틸 */
.kmGrad{background:linear-gradient(92deg,var(--km-primary),#2f7fd6 55%,#10a994);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
