
@keyframes wbgRainbow {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}

/* 페이지 헤더 */
body.archive.category .page-header,
body.archive.category .entry-header {
    padding: 36px 0 20px;
    text-align: center;
}
body.archive.category .page-header h1 {
    font-size: clamp(26px, 3.5vw, 38px);
    font-weight: 800;
    background: linear-gradient(135deg,#00cfff,#4f8ef7,#8b5cf6,#c026d3,#00cfff);
    background-size: 200% 200%;
    animation: wbgRainbow 20s linear infinite;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0;
}

/* 그리드 */
body.archive.category .gb-query-loop-wrapper,
body.archive.category .gb-grid-wrapper {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
    gap: 20px !important;
    margin: 0 !important;
}
body.archive.category .gb-query-loop-wrapper > .gb-grid-column,
body.archive.category .gb-grid-wrapper > .gb-grid-column {
    width: auto !important;
    padding: 0 !important;
}

/* ★ 카드 본체 — block + relative (flex 폐기) */
body.archive.category article.gb-container {
    position: relative;
    display: block !important;
    border-radius: 12px;
    overflow: hidden;
    min-height: 0 !important;
    padding: 3px !important;
    /* 메인 wbg-card-inner와 동일: 4색 청보라 + 20s */
    background: linear-gradient(135deg,
        #00cfff, #4f8ef7, #8b5cf6, #c026d3,
        #00cfff, #4f8ef7, #8b5cf6, #00cfff) !important;
    background-size: 300% 300% !important;
    animation: wbgRainbow 20s linear infinite !important;
    transition: transform 0.3s cubic-bezier(.34,1.56,.64,1);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
body.archive.category article.gb-container:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.18);
}

/* Overlay 제거 */
body.archive.category article.gb-container::before {
    content: none !important;
}

/* ★ 이미지 영역 — absolute + padding-bottom 140% (5:7 비율 보장) */
body.archive.category article.gb-container::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    right: 3px;
    width: auto;
    height: 0;
    padding-bottom: calc((100% - 6px) * 7 / 5);  /* 5:7 = h/w 140%, 좌우 padding 6px 보정 */
    background-image: var(--background-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #0d1b2a;
    border-radius: 0;
    z-index: 1;
}

/* 2026-10-18 sweep #58: 공지 썸네일은 가로형(1200x630) — 표지용 5:7 상자에서 좌우가 잘렸다. 공지 카테고리만 가로 비율 + contain */
body.archive.category.category-notice article.gb-container::after {
    padding-bottom: calc((100% - 6px) * 630 / 1200);
    background-size: contain;
}
body.archive.category.category-notice article.gb-container > .gb-container {
    margin-top: calc((100% - 6px) * 630 / 1200) !important;
}

/* info strip — 이미지 영역(140%) 아래로 밀어내기 */
body.archive.category article.gb-container > .gb-container {
    position: relative !important;
    margin-top: calc((100% - 6px) * 7 / 5) !important;  /* ::after height와 동일 */
    background: #0d1b2a !important;
    padding: 10px 12px !important;
    border-radius: 0 !important;
    max-width: 100% !important;
    z-index: 2;
}

/* 카테고리 배지 */
body.archive.category article.gb-container .post-term-item,
body.archive.category article.gb-container p.gb-headline-4a8d1aac {
    display: inline-flex !important; align-items: center !important; line-height: 1 !important;
    background: linear-gradient(135deg,#fbbf24,#f59e0b) !important;
    color: #0f172a !important;
    padding: 5px 10px 3px !important; /* 상5 하3 — 한글 시각 중앙 보정 */
    border-radius: 999px !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    margin: 0 0 6px !important;
    /* line-height: 1.4 제거 — 위의 line-height: 1 유지 */
}

/* 타이틀 (메인 wbg-card-title 동일) */
body.archive.category article.gb-container h4.gb-headline,
body.archive.category article.gb-container h2.gb-headline {
    font-weight: 700 !important;
    font-size: 14px !important;
    color: #e0e0e0 !important;
    line-height: 1.35 !important;
    margin: 0 0 4px !important;
    text-shadow: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
body.archive.category article.gb-container h4.gb-headline a,
body.archive.category article.gb-container h2.gb-headline a {
    color: #e0e0e0 !important;
    text-decoration: none !important;
}
body.archive.category article.gb-container h4.gb-headline a:hover {
    color: #fde047 !important;
}

/* 날짜 */
body.archive.category article.gb-container p.gb-headline-b72a7626,
body.archive.category article.gb-container time.entry-date {
    font-size: 11px !important;
    color: #94a3b8 !important;
    margin: 0 !important;
    font-weight: 500;
}
body.archive.category article.gb-container p.gb-headline-b72a7626 .gb-icon svg {
    fill: #94a3b8 !important;
    width: 10px !important;
    height: 10px !important;
}

/* 모바일 */
@media (max-width: 640px) {
    body.archive.category .gb-query-loop-wrapper,
    body.archive.category .gb-grid-wrapper {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
    body.archive.category article.gb-container h4.gb-headline {
        font-size: 13px !important;
    }
    body.archive.category article.gb-container > .gb-container {
        padding: 8px 10px !important;
    }
}

/* 페이지네이션 (강조 유지) */
body.archive.category .gb-query-loop-pagination,
body.archive.category .navigation.pagination {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
}
body.archive.category .gb-query-loop-pagination a,
body.archive.category .gb-query-loop-pagination span,
body.archive.category .navigation .page-numbers {
    padding: 10px 16px !important;
    border-radius: 8px !important;
    background: #f1f5f9 !important;
    color: #475569 !important;
    font-weight: 600 !important;
    border: none !important;
    text-decoration: none !important;
    font-size: 14px !important;
    min-width: 42px;
    text-align: center;
    transition: all 0.2s ease !important;
}
body.archive.category .gb-query-loop-pagination a:hover,
body.archive.category .navigation .page-numbers:hover {
    background: #6366f1 !important;
    color: #fff !important;
}
body.archive.category .gb-query-loop-pagination .gb-block-is-current,
body.archive.category .navigation .page-numbers.current {
    background: linear-gradient(135deg,#00cfff,#4f8ef7,#8b5cf6,#c026d3) !important;
    background-size: 200% 200% !important;
    animation: wbgRainbow 20s linear infinite;
    color: #fff !important;
}
/*# sourceURL=wia-category-ui-inline-css */
