@charset "utf-8";
/* ===================================================
   EXPERNET 2026 - Resources Page Styles
   =================================================== */

/* badge 컬러 */
.badge {
  display: inline-flex;
  align-items: center;
  padding: .2rem .65rem;
  border-radius: var(--radius-full);
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.4;
}
.badge-primary  { background: rgba(0,65,125,.09);    color: var(--color-primary); }
.badge-accent   { background: rgba(0,153,230,.1);    color: var(--color-accent); }
.badge-teal     { background: rgba(0,203,172,.1);    color: var(--color-teal); }
.badge-purple   { background: rgba(92,78,229,.09);   color: #5c4ee5; }

/* 자료 카드 hover (기존 화이트 카드 — 하위 호환 유지) */
.resource-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  transition: box-shadow var(--transition-base), transform var(--transition-base);
}
.resource-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

/* ===================================================
   자료 카드 — 화이트 카드 (2026-06 리디자인)
   =================================================== */

/* 그리드 */
.rc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

/* 타입별 색상 변수 */
.rc-datasheet   { --rc-base: #00adef; --rc-base-rgb: 0,173,239; }
.rc-whitepaper  { --rc-base: #7e63ff; --rc-base-rgb: 126,99,255; }
.rc-guide       { --rc-base: #09b8a5; --rc-base-rgb: 9,184,165; }
.rc-overview    { --rc-base: #fd4fff; --rc-base-rgb: 253,79,255; }
.rc-brochure    { --rc-base: #004e8c; --rc-base-rgb: 0,78,140; }
.rc-infographic { --rc-base: #ff8f2c; --rc-base-rgb: 255,143,44; }
.rc-casestudy   { --rc-base: #ff4d7f; --rc-base-rgb: 255,77,127; }
.rc-expernet    { --rc-base: #3b76fc; --rc-base-rgb: 59,118,252; }

/* 카드 공통 */
.rc-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  text-decoration: none;
  overflow: hidden;
  transition: box-shadow .25s ease, transform .25s ease;
  cursor: pointer;
}
.rc-card:hover {}

/* 헤더 (아이콘 + 자료타입) */
.rc-header {
  padding: 1.25rem 1.25rem .75rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

/* 아이콘 */
.rc-icon {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
}
.rc-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.rc-icon .rc-icon-hover   { display: none; }
.rc-icon .rc-icon-default { display: block; }
.rc-card:hover .rc-icon .rc-icon-default { display: none; }
.rc-card:hover .rc-icon .rc-icon-hover   { display: block; }

/* 자료 타입 레이블 */
.rc-data-type {
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--rc-base, #888);
  transition: color .25s;
}
.rc-card:hover .rc-data-type { color: #1a2345; }

/* 바디-제목 (자료명) — 3줄 고정 높이 */
.rc-body-title {
  padding: 0 1.25rem .5rem;
  height: calc(1rem * 1.6 * 3);
  overflow: hidden;
}

/* 자료 제목 */
.rc-title {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  color: #1a2345;
  word-break: keep-all;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
  margin: 0;
  width: 100%;
  transition: color .25s;
}
.rc-card:hover .rc-title { color: var(--rc-base, #1a2345); }

/* 바디-벤더 (벤더명) */
.rc-body-vendor {
  padding: 0 1.25rem .875rem;
  display: flex;
  align-items: flex-start;
}

/* 벤더 뱃지 — 글자+2 크기 */
.rc-vendor {
  display: inline-block;
  padding: .2rem 1ch;
  width: fit-content;
  border-radius: var(--radius-full);
  font-size: .6875rem;
  font-weight: 600;
  color: var(--rc-base, #888);
  background: rgba(var(--rc-base-rgb, 88,88,88), .15);
  text-align: center;
  white-space: nowrap;
}

/* 준비중 */
.rc-preparing {
  margin-top: .5rem;
  font-size: .7rem;
  color: var(--color-text-muted);
}

/* 푸터 (태그) — 두 줄 고정 높이 */
.rc-footer {
  position: relative;
  padding: .5rem 1.25rem;
  border-top: 1px solid #e2e8f0;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-content: flex-start;
  height: 4.2rem;
  overflow: hidden;
  transition: border-color .25s;
}
.rc-footer::after {
  content: '';
  position: absolute;
  inset: 0;
  background: transparent;
  pointer-events: none;
  z-index: 1;
  transition: background .25s;
}
.rc-card:hover .rc-footer {
  border-top-color: #e2e8f0;
}
.rc-card:hover .rc-footer::after {
  background: rgba(var(--rc-base-rgb, 88,88,88), .20);
}
.rc-card:hover {
  border-color: var(--rc-base);
}

/* 태그 */
.rc-tag {
  font-size: .65rem;
  font-weight: 700;
  padding: .15rem .45rem;
  border-radius: var(--radius-sm);
  background: #f7f9fc;
  color: #5a6a80;
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
  position: relative;
  z-index: 0;
}
.rc-card:hover .rc-tag {
  background: #e2e8f0;
  color: #5a6a80;
}
.rc-tag.is-active {
  background: var(--rc-base, var(--color-accent));
  color: #fff;
}

/* 반응형 */
@media (max-width: 900px) {
  .rc-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
  .rc-grid { grid-template-columns: 1fr; }
}