/* Shared blue photographic backdrop supplied for the case archive. */
body {
  background-color: #eaf3fb;
  background-image: url("./assets/site-background.jpg");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* Home: keep the existing Gitee-inspired sections while revealing one backdrop. */
.site-header,
.site-header.is-scrolled {
  color: #15364a;
  background: rgba(246, 251, 255, .52);
  border-color: rgba(255, 255, 255, .8);
  box-shadow: 0 10px 32px #315e8030, inset 0 1px #fff;
  backdrop-filter: blur(28px) saturate(155%);
  -webkit-backdrop-filter: blur(28px) saturate(155%);
}
.site-nav a,
.site-header.is-scrolled .site-nav a { color: #315268; }
.site-nav a:hover,
.site-nav a.is-active,
.site-header.is-scrolled .site-nav a:hover,
.site-header.is-scrolled .site-nav a.is-active { color: #126b8c; }
.wordmark small,
.site-header.is-scrolled .wordmark small { color: #55778b; }
.mobile-nav-link,
.site-header.is-scrolled .mobile-nav-link {
  color: #1e536d;
  background: rgba(255, 255, 255, .52);
  border-color: rgba(255, 255, 255, .84);
}

.hero,
.project-index,
.closing { background: transparent; }
.hero { color: #14354c; }
.hero-image,
.hero-shade,
.hero-orbit,
.hero::before,
.hero::after,
.project-index::before,
.closing::before { display: none; }
.hero .eyebrow { color: #1b6685; }
.hero h1 { color: #102d43; text-shadow: 0 2px 20px #ffffff55; }
.hero h1 em { color: #276f9c; text-shadow: none; }
.hero-copy { color: #2e536b; }
.hero-index,
.hero-index span:first-child { color: #276f9c; }
.hero-coordinate { color: #57788d; }
.hero .primary-action {
  color: #174e69;
  background: rgba(255, 255, 255, .54);
  border-color: rgba(255, 255, 255, .9);
  box-shadow: inset 0 1px #fff, 0 14px 38px #35658a2b;
}
.hero .primary-action:hover { background: rgba(255, 255, 255, .74); box-shadow: inset 0 1px #fff, 0 18px 44px #35658a3a; }

.project-index { color: #16384d; background: rgba(245, 251, 255, .16); }
.project-index h2 { color: #12364c; }
.index-list { gap: .75rem; border-top: 0; }
.index-list a {
  padding: 1rem 1.15rem;
  color: #1d4358;
  background: rgba(255, 255, 255, .45);
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 12px;
  box-shadow: inset 0 1px #ffffffbd, 0 7px 22px #36658412;
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}
.index-list a:hover { padding-left: 1.15rem; background: rgba(255, 255, 255, .72); }

.project,
.project.is-even {
  background: rgba(244, 250, 254, .11) !important;
  border-color: rgba(255, 255, 255, .44);
}
.project.is-even { background: rgba(218, 236, 250, .12) !important; }
.case-preview {
  padding: clamp(1.4rem, 3vw, 2.5rem);
  background: rgba(255, 255, 255, .47);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: 26px;
  box-shadow: inset 0 1px #fff, 0 20px 54px #315f8028;
  backdrop-filter: blur(28px) saturate(145%);
  -webkit-backdrop-filter: blur(28px) saturate(145%);
}
.case-preview-visual { background: rgba(255, 255, 255, .42); border-color: rgba(255, 255, 255, .82); }
.case-preview-link { background: rgba(255, 255, 255, .58); }

.closing { color: #143b53; background: rgba(245, 251, 255, .2); }
.closing h2 { color: #143b53; }
.closing p:not(.eyebrow),
.closing .resource-card p:not(.eyebrow) { color: #375f76; }
.closing .resource-card { border-color: #98b8c779; }
.closing .primary-action { color: #176480; }
footer { color: #365c71; background: rgba(245, 251, 255, .3); border-color: rgba(255, 255, 255, .6); }

/* Detail pages: frosted document, legible cells, softly rounded table. */
.detail-header { background: rgba(246, 251, 255, .58); }
.case-document {
  background: rgba(255, 255, 255, .61);
  border-color: rgba(255, 255, 255, .86);
  border-radius: 22px;
  box-shadow: inset 0 1px #fff, 0 24px 68px #315f8033;
  backdrop-filter: blur(32px) saturate(145%);
  -webkit-backdrop-filter: blur(32px) saturate(145%);
}
.case-table-wrap {
  overflow: hidden;
  background: rgba(255, 255, 255, .3);
  border: 1px solid rgba(139, 170, 190, .58);
  border-radius: 14px;
}
.case-facts { border-collapse: separate; border-spacing: 0; }
.case-facts th,
.case-facts td {
  border: 0;
  border-right: 1px solid rgba(139, 170, 190, .43);
  border-bottom: 1px solid rgba(139, 170, 190, .43);
}
.case-facts tr > :last-child { border-right: 0; }
.case-facts tbody tr:last-child > * { border-bottom: 0; }
.case-facts thead th { background: rgba(224, 239, 248, .74); }
.case-facts tbody th { background: rgba(236, 245, 250, .48); }
.case-facts tbody tr:nth-child(even) td { background: rgba(255, 255, 255, .24); }
.case-image-button { background: rgba(255, 255, 255, .45); border-color: rgba(255, 255, 255, .84); }
.detail-pager a {
  background: rgba(255, 255, 255, .55);
  border-color: rgba(255, 255, 255, .84);
  box-shadow: inset 0 1px #fff, 0 10px 26px #315f801e;
  backdrop-filter: blur(22px) saturate(135%);
  -webkit-backdrop-filter: blur(22px) saturate(135%);
}

@media (max-width: 640px) {
  .hero { min-height: min(72svh, 650px); }
  .hero-index { color: #276f9c; }
  .index-list { gap: .55rem; }
  .index-list a { padding: .8rem .85rem; }
  .index-list a:hover { padding-left: .85rem; }
  .case-preview { width: 90vw; padding: 1.2rem; border-radius: 19px; }
  .case-document { border-radius: 15px; }
  .case-table-wrap { border-radius: 11px; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-header, .site-header.is-scrolled, .detail-header,
  .case-preview, .case-document, .index-list a, .detail-pager a { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(255, 255, 255, .9); }
}
@media (prefers-contrast: more) {
  .case-document, .case-preview { background: rgba(255, 255, 255, .94); border-color: #31566a; }
  .case-table-wrap { border-color: #31566a; }
  .case-facts th, .case-facts td { border-color: #8ba5b5; }
}

/* Use black for reading text over the blue photograph and frosted surfaces. */
body,
.hero h1,
.hero-copy,
.hero .primary-action,
.project-index h2,
.index-list a,
.index-list strong,
.index-list small,
.project,
.case-preview h2,
.case-preview-scenario span,
.case-preview-scenario strong,
.case-preview-value span,
.case-preview-value p,
.case-preview-link,
.closing,
.closing h2,
.closing p:not(.eyebrow),
.closing .resource-card p:not(.eyebrow),
.case-document h1,
.case-context,
.case-context strong,
.case-facts,
.case-facts thead th,
.case-facts tbody th,
.case-facts td strong,
.case-figure figcaption,
.case-more-body,
.detail-pager strong {
  color: #000;
}
.project { color: #000 !important; }
.hero h1 em { color: #3151d7; }
