/* Match the homepage's case cards and photographic column presentation. */
/* These title-only banners do not need the shared subtitle row. */
:is(.page-cases, .page-columns) .civil-banner { min-height: 420px; padding-bottom: 96px; }
:is(.page-cases, .page-columns) .civil-banner > .container { display: block; }
.listing-pagination { display: grid; justify-items: center; gap: 14px; margin-top: 44px; }
.listing-pagination[hidden] { display: none; }
.listing-page-controls { display: flex; align-items: center; justify-content: center; gap: 6px; }
.listing-page-controls button { min-width: 40px; min-height: 40px; padding: 8px 12px; border: 1px solid transparent; border-radius: 3px; background: transparent; color: #6f6f6f; font: 500 14px/1.5 Pretendard, sans-serif; cursor: pointer; }
.listing-page-controls button:hover:not(:disabled) { background: #e7e7e7; color: #202020; }
.listing-page-controls button[aria-current="page"] { background: #201719; color: #fff; }
.listing-page-controls button:disabled { color: #b5b5b5; cursor: default; }
.listing-page-controls button:focus-visible { outline: 2px solid #c62828; outline-offset: 2px; }
.listing-page-controls > span { color: #909090; }
:is(#case-results, #column-results) { scroll-margin-top: calc(var(--site-header-height) + 24px); }
:is(.page-cases, .page-columns) .listing-section { padding-block: 82px 96px; }
:is(.page-cases, .page-columns) .listing-section .sample-note { margin: 0 0 24px; text-align: left; }
.page-cases .listing-section { background: #f5f5f5; }
.page-cases .listing-section .sample-note { color: #6f6f6f; }
/* A quiet white list keeps the column titles easy to scan. */
.page-columns .listing-section { padding-block: 64px; background: #fff; color: #202020; }
.page-columns .listing-section > .container { max-width: 1040px; }
.page-columns .listing-section .sample-note { color: #6f6f6f; }
.page-columns .case-row {
  min-height: 158px;
  align-items: center;
  gap: 32px;
  padding: 26px 36px 26px 0;
  border-bottom: 1px solid #e0e0e0;
}
.page-columns .column-list { border-top: 1px solid #e0e0e0; }
.page-columns .case-row .case-category { margin: 0 0 8px; color: #c62828; font-size: 13px; }
.page-columns .case-row h3 { margin-bottom: 8px; color: #202020; font-size: 22px; }
.page-columns .case-row-copy > p:last-child { color: #6f6f6f; font-size: 14px; line-height: 1.7; }
.page-columns .case-row > img { flex-basis: 160px; width: 160px; height: 96px; margin: 0; border-radius: 3px; opacity: 1; }
.page-columns .case-row:is(:hover, :focus-visible) h3 { color: #c62828; }
.page-columns .case-row:focus-visible { outline: 2px solid #c62828; outline-offset: 5px; }
@media (max-width: 767px) {
  :is(.page-cases, .page-columns) .civil-banner { min-height: 220px; padding-bottom: 48px; }
  .page-cases .listing-section { padding-block: 48px 64px; }
  .page-columns .listing-section { padding-block: 40px; }
  .page-columns .case-row { min-height: 138px; gap: 18px; padding: 24px 0; }
  .page-columns .case-row .case-category { font-size: 12px; }
  .page-columns .case-row h3 { font-size: 18px; }
  .page-columns .case-row-copy > p:last-child { font-size: 13px; }
  .page-columns .case-row > img { flex-basis: 96px; width: 96px; height: 64px; }
}
@media (prefers-reduced-motion: reduce) {
  :is(.page-cases, .page-columns) :is(.case-result-card, .case-feature-image > img, .case-row > img) { transition: none; }
}
