@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap');
@import url('../assets/base.css');

body { background-image: radial-gradient(circle at 20% 0%, rgba(140,124,255,0.08), transparent 45%); background-attachment: fixed; }

.page-hero {
    padding: 150px 0 40px;
}
.page-hero h1 {
    font-size: clamp(2.2rem, 5vw, 3rem);
    color: var(--text-bright);
    font-weight: 700;
}
.page-hero p {
    color: var(--text-dim);
    max-width: 560px;
    margin-top: 14px;
}

.case-list { padding-bottom: 100px; display: flex; flex-direction: column; gap: 60px; }

.case {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 40px;
    background: var(--bg-card);
}
.case-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; margin-bottom: 20px; }
.case-head h2 { font-size: 1.5rem; color: var(--text-bright); }
.case-index { font-family: var(--mono); color: var(--accent); font-size: 0.85rem; }
.case-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }

.case-body { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.case-col .col-label { font-family: var(--mono); font-size: 0.75rem; color: var(--accent-teal); letter-spacing: 0.5px; margin-bottom: 8px; }
.case-col p { color: var(--text); font-size: 0.92rem; }

.case-citation {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
    font-family: var(--mono);
    font-size: 0.8rem;
    color: var(--text-dim);
    line-height: 1.8;
}
.paper-link {
    display: inline-flex;
    align-items: center;
    color: var(--accent-teal);
    font-weight: 600;
    text-decoration: none;
}
.paper-link:hover { text-decoration: underline; }

@media (max-width: 760px) {
    .case { padding: 26px; }
    .case-body { grid-template-columns: 1fr; gap: 18px; }
}

.back-link { display: inline-block; margin-bottom: 30px; font-family: var(--mono); font-size: 0.85rem; }