/* 모든 페이지: 글 속 대표 가로선(상자 제목 밑줄, 본문 제목 밑줄, 칼럼 글 머리 구분선) 위로
   선과 같은 남색 계열의 빛이 왼쪽→오른쪽으로 은은하게 흐름. 목록·표·테두리 선은 그대로.
   (빼려면 각 페이지의 lines-site.css 링크만 지우면 됩니다.) */
@property --sl { syntax: '<percentage>'; inherits: false; initial-value: -30%; }

@keyframes line-flow {
  0%   { --sl: -30%; }
  40%  { --sl: 130%; }
  100% { --sl: 130%; }
}

/* 1) 글 상자 제목 밑줄 (회청색 가는 선) */
.prose.wix .wx-sec > h2:first-child::after {
  background-image:
    linear-gradient(90deg, transparent calc(var(--sl) - 16%), rgba(61, 111, 209, .9) var(--sl), transparent calc(var(--sl) + 16%)),
    linear-gradient(90deg, #7d8797 0%, rgba(125, 135, 151, .35) 60%, rgba(125, 135, 151, 0) 100%);
  animation: line-flow 4.5s ease-in-out 1s infinite;
}
/* 상자가 여러 개인 페이지에서는 위에서부터 차례로 흐르도록 살짝씩 어긋나게 */
.prose.wix .wx-sec:nth-of-type(4n+2) > h2:first-child::after { animation-delay: 1.35s; }
.prose.wix .wx-sec:nth-of-type(4n+3) > h2:first-child::after { animation-delay: 1.7s; }
.prose.wix .wx-sec:nth-of-type(4n+4) > h2:first-child::after { animation-delay: 2.05s; }

/* 2) 본문 제목(h2)의 파란 밑줄, 3) 칼럼 글 머리의 남색 구분선 — 같은 색 선 위로 밝은 파랑 */
.prose > h2, .prose.wix > h2, .post-meta {
  border-image: linear-gradient(90deg,
    var(--ln) 0%, var(--ln) calc(var(--sl) - 14%),
    rgba(110, 150, 235, 1) var(--sl),
    var(--ln) calc(var(--sl) + 14%), var(--ln) 100%) 1;
  animation: line-flow 4.5s ease-in-out 1.2s infinite;
}
.prose > h2, .prose.wix > h2 { --ln: #1d67cd; }
.post-meta { --ln: #324158; }

@media (prefers-reduced-motion: reduce) {
  .prose.wix .wx-sec > h2:first-child::after, .prose > h2, .prose.wix > h2, .post-meta { animation: none !important; }
  .prose > h2, .prose.wix > h2, .post-meta { border-image: none; }
}