/* ============================================================
   《中国审判》电子期刊 · 全局样式与首页（期次封面墙）
   ============================================================ */

:root {
  /* 司法期刊主色系：深红 + 金 + 米白纸面 */
  --red: #9A1F24;
  --red-bright: #B02930;
  --red-deep: #7C151A;
  --red-dark: #5A0E12;
  --gold: #C9A050;
  --gold-bright: #E3C27E;
  --gold-dim: #9C7C3B;
  --paper: #F8F4EC;
  --paper-dim: #EFE7D6;
  --ink: #2B2620;
  --ink-soft: #6A6055;
  --bg: #16100D;
  --bg-soft: #251A15;
  --serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, SimSun, "STZhongyuan", "Times New Roman", serif;
  --shadow-page: 0 18px 45px rgba(0, 0, 0, .55);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--serif);
  background: var(--bg);
  color: var(--ink);
  min-height: 100vh;   /* 老内核回退 */
  min-height: 100dvh;
  -webkit-font-smoothing: antialiased;
}

button { font-family: inherit; cursor: pointer; }

/* 隐藏视图时强制 display:none（避免被 flex 覆盖） */
[hidden] { display: none !important; }

/* ============================================================
   首页 · 刊头
   ============================================================ */

#home-view {
  min-height: 100vh;   /* 老内核回退 */
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(1200px 500px at 50% -80px, rgba(201, 160, 80, .08), transparent 70%),
    linear-gradient(180deg, #1B130F 0%, #16100D 45%, #1D1410 100%);
}

.masthead {
  position: relative;
  color: #F4E7CB;
  background:
    radial-gradient(900px 300px at 30% 0%, rgba(255, 214, 140, .10), transparent 65%),
    linear-gradient(168deg, var(--red-bright) 0%, var(--red-deep) 55%, var(--red-dark) 100%);
  border-bottom: 1px solid rgba(201, 160, 80, .45);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .45);
}

.masthead-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 30px 28px 20px;
  display: flex;
  align-items: center;
  gap: 26px;
}

.masthead-badge {
  width: 72px;
  height: 72px;
  flex: none;
  color: var(--gold-bright);
  border: 1px solid rgba(201, 160, 80, .55);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, .14);
}
.masthead-badge svg { width: 46px; height: 46px; }

.masthead-title { flex: none; }

.journal-name {
  font-size: 46px;
  font-weight: 700;
  letter-spacing: 14px;
  margin-right: -14px; /* 抵消末字间距，保持视觉居中 */
  line-height: 1.15;
  color: #F7EBD0;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .4);
}

.journal-name-en {
  margin-top: 2px;
  font-size: 13px;
  letter-spacing: 9px;
  margin-right: -9px;
  color: var(--gold-bright);
  font-weight: 600;
}

.masthead-meta {
  margin-left: auto;
  text-align: right;
  font-size: 13px;
  line-height: 2;
  color: rgba(244, 231, 203, .92);
}
.masthead-cite { color: rgba(244, 231, 203, .6); font-size: 12px; }

.masthead-rule {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 28px 14px;
  margin: 0 auto;
  color: var(--gold);
}
.masthead-rule span {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201, 160, 80, .7), rgba(201, 160, 80, .25));
}
.masthead-rule span:last-child {
  background: linear-gradient(90deg, rgba(201, 160, 80, .25), rgba(201, 160, 80, .7), transparent);
}
.masthead-rule i { font-style: normal; font-size: 10px; opacity: .85; }

/* ============================================================
   首页 · 主体与期次封面墙
   ============================================================ */

.home-main {
  flex: 1;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 44px 28px 60px;
}

.section-head { text-align: center; margin-bottom: 36px; }

.section-head h2 {
  display: inline-block;
  font-size: 26px;
  letter-spacing: 10px;
  margin-right: -10px;
  color: var(--gold-bright);
  font-weight: 700;
  position: relative;
  padding: 0 34px;
}
.section-head h2::before,
.section-head h2::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 22px;
  height: 1px;
  background: var(--gold-dim);
}
.section-head h2::before { left: 0; }
.section-head h2::after { right: 0; }

.section-sub {
  margin-top: 10px;
  font-size: 13px;
  letter-spacing: 4px;
  color: #8D7F6C;
}

.issue-wall {
  display: grid;
  /* auto-fit 收起空列，配合居中，期数少时封面墙保持水平居中 */
  grid-template-columns: repeat(auto-fit, minmax(232px, 300px));
  justify-content: center;
  gap: 34px 28px;
}

/* ---- 期次卡片：CSS 绘制的迷你封面 ---- */

.issue-card {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: transform .25s ease;
}

.issue-card:hover,
.issue-card:focus-visible {
  transform: translateY(-6px);
  outline: none;
}
.issue-card:focus-visible .mini-cover { box-shadow: 0 0 0 2px var(--gold); }

.mini-cover {
  position: relative;
  aspect-ratio: 8 / 11;
  border-radius: 3px;
  overflow: hidden;
  color: #F6ECD8;
  background:
    radial-gradient(140% 70% at 50% -10%, rgba(255, 216, 150, .16), transparent 60%),
    linear-gradient(170deg, #A8262C 0%, #861519 48%, #64101A 100%);
  border: 1px solid rgba(0, 0, 0, .5);
  box-shadow: var(--shadow-page);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 7.5% 9% 9%;
  text-align: center;
  transition: box-shadow .25s ease;
  container-type: inline-size; /* 页内字号随卡片宽度缩放 */
}
.issue-card:hover .mini-cover {
  box-shadow:
    0 0 0 1px rgba(201, 160, 80, .75),
    0 24px 52px rgba(0, 0, 0, .6),
    0 0 34px rgba(176, 41, 48, .38);
}

.mini-cover::before {
  content: "";
  position: absolute;
  inset: 4.5%;
  border: 1px solid rgba(201, 160, 80, .6);
  pointer-events: none;
}
.mini-cover::after {
  content: "";
  position: absolute;
  inset: 5.8%;
  border: 1px solid rgba(201, 160, 80, .28);
  pointer-events: none;
}

.mc-charge {
  font-size: clamp(9px, 2.1cqw, 11px);
  letter-spacing: 2px;
  color: rgba(244, 231, 203, .8);
  line-height: 1.6;
}

.mc-name {
  margin-top: 4%;
  font-size: clamp(26px, 13cqw, 40px);
  font-weight: 700;
  letter-spacing: clamp(3px, 2cqw, 8px);
  margin-right: clamp(-3px, -2cqw, -8px);
  color: #F7EBD0;
  text-shadow: 0 2px 5px rgba(0, 0, 0, .45);
}

.mc-en {
  margin-top: 3px;
  font-size: clamp(8px, 2.3cqw, 11px);
  letter-spacing: clamp(2px, 1cqw, 5px);
  color: var(--gold-bright);
  font-weight: 600;
}

.mc-badge {
  margin-top: 5.5%;
  width: 17%;
  color: var(--gold-bright);
  opacity: .95;
}
.mc-badge svg { width: 100%; height: auto; display: block; }

.mc-theme {
  margin-top: 5.5%;
  font-size: clamp(11px, 3.2cqw, 15px);
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 1.65;
  color: #FBF3DE;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}

.mc-hl {
  margin-top: auto;
  width: 100%;
  border-top: 1px solid rgba(201, 160, 80, .4);
  padding-top: 5.5%;
  font-size: clamp(8.5px, 2.4cqw, 11.5px);
  line-height: 1.8;
  color: rgba(248, 240, 222, .88);
}
.mc-hl .mc-hl-title {
  color: var(--gold-bright);
  letter-spacing: 4px;
  margin-bottom: 2%;
  font-size: clamp(9px, 2.6cqw, 12px);
}

.mc-no {
  margin-top: 5.5%;
  font-size: clamp(10px, 2.9cqw, 13.5px);
  letter-spacing: 2px;
  color: var(--gold-bright);
  white-space: nowrap;
}
.mc-no span { margin-left: 8px; font-size: .78em; opacity: .85; }

.issue-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
  font-size: 13px;
  color: #A69680;
  letter-spacing: 1px;
}
.read-btn {
  color: var(--gold);
  font-size: 12.5px;
  letter-spacing: 2px;
  border-bottom: 1px solid rgba(201, 160, 80, .45);
  padding-bottom: 2px;
  transition: color .2s ease;
}
.issue-card:hover .read-btn { color: var(--gold-bright); }

/* ============================================================
   首页 · 页脚
   ============================================================ */

.site-footer {
  text-align: center;
  padding: 34px 24px calc(30px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(201, 160, 80, .18);
  color: #B3A68F;
  font-size: 13px;
  line-height: 2.1;
}
.footer-name {
  font-size: 15px;
  letter-spacing: 4px;
  color: #D3C4A4;
  margin-bottom: 2px;
}
.muted { color: #857A67; }
.small { font-size: 11.5px; opacity: .8; }

.footer-rule {
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(320px, 60%);
  margin: 0 auto 18px;
  color: var(--gold-dim);
}
.footer-rule span { flex: 1; height: 1px; background: rgba(201, 160, 80, .35); }
.footer-rule i { font-style: normal; font-size: 9px; }

/* ============================================================
   响应式
   ============================================================ */

@media (max-width: 900px) {
  .masthead-inner { flex-direction: column; gap: 14px; padding-top: 26px; text-align: center; }
  .masthead-badge { width: 58px; height: 58px; }
  .masthead-badge svg { width: 36px; height: 36px; }
  .journal-name { font-size: 38px; letter-spacing: 11px; margin-right: -11px; }
  .masthead-meta { margin-left: 0; text-align: center; font-size: 12px; line-height: 1.9; }
  .masthead-cite { display: none; }
}

@media (max-width: 640px) {
  .masthead-inner { padding: 22px 18px 14px; }
  .journal-name { font-size: 33px; letter-spacing: 9px; margin-right: -9px; }
  .journal-name-en { letter-spacing: 6px; margin-right: -6px; }
  .home-main { padding: 30px 16px 46px; }
  .section-head h2 { font-size: 21px; letter-spacing: 7px; padding: 0 24px; }
  .issue-wall { grid-template-columns: repeat(2, 1fr); gap: 24px 14px; }
  /* 小卡片容纳不下要目列表，隐藏后由期号行沉底并加金线分隔 */
  .mc-hl { display: none; }
  .mc-no {
    margin-top: auto;
    padding-top: 6%;
    border-top: 1px solid rgba(201, 160, 80, .4);
    display: block;
  }
  .issue-meta { flex-direction: column; gap: 2px; text-align: center; }
  .read-btn { border-bottom: none; }
  .site-footer { font-size: 12px; }
}
