/* ============================================================
   Press — 05-press.html (목록) + 05-press-detail.html (상세) 전용
   ▸ 목록: 3열 앨범 카드 — 카드 자체(.press-list / .press-card)는 index 언론보도 섹션과
     공용이라 common.css 에 있고, 여기에는 목록 페이지 여백/로딩/빈 상태만 둔다.
   ▸ 페이지네이션은 common.css 의 .board-pagination 공용 스타일 사용
   ▸ 상세 본문(.case-detail-body__content) / 목록으로 버튼(.case-detail-body__back) 은
     use-case-detail.css 를 그대로 재사용 — 05-press-detail.html 이 함께 로드
   ※ 공통 스타일은 common.css 참조
   ============================================================ */

/* ============================================================
   언론보도 목록 보드
   ▸ 카드(.press-list / .press-card)는 common.css 공용 — index 언론보도 섹션과 동일
   ▸ 여기에는 섹션 여백 / 로딩 상태 / 빈 상태만
   ============================================================ */
.press-board {
    padding: 6vw 0;
}

/* 목록 페이지는 섹션 헤더가 없어 common.css 의 margin-top(72px) 불필요 */
.press-board__list {
    margin-top: 0;
}

/* 페이지 이동 중 — 기존 카드를 흐리게 유지해 레이아웃 점프 없이 로딩을 알림 */
.press-board__list.is-loading {
    opacity: 0.4;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

.press-board__empty {
    grid-column: 1 / -1;
    padding: 80px 0;
    text-align: center;
    color: var(--color-muted);
    list-style: none;
}

/* ============================================================
   언론보도 상세
   ============================================================ */
.press-detail {
    padding: 6vw 0;
}

/* 기사 본문은 공통 .inner(1440px) 보다 좁게 — 한 줄이 너무 길면 읽기 힘들다.
   제목/메타/본문/버튼이 같은 축에 맞도록 .inner 자체를 좁힌다. */
.press-detail .inner {
    max-width: 900px;
}

.press-detail__head {
    margin-bottom: 48px;
    padding-bottom: 24px;
    border-bottom: 1px solid #E5E5E5;
}

.press-detail__title {
    margin: 0;
    color: #262626;
    font-family: "Spoqa Han Sans Neo", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
    font-size: 1.875rem; /* 30px */
    font-weight: 700;
    line-height: 1.533;
    word-break: keep-all;
}

.press-detail__meta {
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 8px;

    color: #B4B4B4;
    font-family: "Spoqa Han Sans Neo", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
    font-size: 1rem; /* 16px */
    font-weight: 400;
    line-height: 1.5;
}

/* 등록일 / 조회수 구분선 */
.press-detail__meta-sep {
    width: 1px;
    height: 12px;
    background: #DEDEDE;
}

.press-detail__foot {
    margin-top: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

/* 원문 보기 — link_url 이 있을 때만 렌더 (.case-detail-body__back 과 같은 크기의 채움 버튼) */
.press-detail__source {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    width: 12.5rem;   /* 200px */
    height: 3.75rem;  /* 60px */
    border: 1px solid var(--color-primary);
    border-radius: 100px;
    background: var(--color-primary);

    color: #fff;
    text-align: center;
    text-decoration: none;
    font-family: "Spoqa Han Sans Neo", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
    font-size: 1.25rem; /* 20px */
    font-weight: 500;
    line-height: 1.5rem;
    letter-spacing: -1px;

    transition: background 0.2s ease, color 0.2s ease;
}

.press-detail__source:hover,
.press-detail__source:focus-visible {
    background: transparent;
    color: var(--color-primary);
}

/* ============================================================
   반응형
   ============================================================ */

/* ── 768px 이하 (모바일 — 루트 12px) ─────────────────── */
@media (max-width: 768px) {
    .press-board {
        padding: 60px 0;
    }

    .press-detail {
        padding: 60px 0 100px;
    }

    .press-detail__head {
        margin-bottom: 32px;
    }

    .press-detail__title {
        font-size: 1.833rem; /* 22px */
        line-height: 1.4;
    }

    .press-detail__foot {
        margin-top: 40px;
        flex-direction: column;
    }

    .press-detail__source {
        width: 100%;
        max-width: 20rem;
    }
}