/* ========================================================= Publications V2 — preview-only, style-only redesign of the Publications page in the approved Home V2 / About V2 / Work V2 / Project Detail V2 / Experience V2 / Education V2 visual language. Loaded ONLY by templates/main/publications_v2.html (served at /publications-v2/), alongside static/css/home_v2.css (unmodified, loaded first in that template's for the shared tokens/ reset/nav/footer/preview-flag classes — see home_v2.css for --v2-navy, --v2-orange, --v2-muted, --v2-border, --v2-container, --v2-gutter, --v2-section-padding). Every selector below is prefixed .publications-v2-*, so this file cannot affect Home V2, About V2, Work V2, Project Detail V2, Experience V2, Education V2, or any other page even if it were ever accidentally linked from one. None of those approved templates/CSS files are modified by this file or by adding it. Deliberately an editorial bibliography layout (year column + entry column, thin separators between entries) rather than a card grid — no status/type badges are rendered anywhere here, matching the live Publications page. Expand/collapse behavior comes from the unmodified static/js/edu-accordion.js, driven purely by data-accordion-toggle / data-accordion-card / aria-expanded / aria-controls — no styling here is required for it to work. ========================================================= */ /* ---------- Hero (text-only) ---------- */ .publications-v2-hero { padding-top: 64px; padding-bottom: 40px; } .publications-v2-hero-heading { font-family: "Playfair Display", serif; font-weight: 700; font-size: 34px; line-height: 1.2; letter-spacing: -0.01em; color: var(--v2-navy); margin: 16px 0 20px; } .publications-v2-hero-text { font-size: 17px; line-height: 1.65; color: var(--v2-muted); max-width: 750px; margin: 0; } @media (min-width: 900px) { .publications-v2-hero { padding-top: 88px; padding-bottom: 48px; } .publications-v2-hero-heading { font-size: 44px; } } /* ---------- List / rows ---------- */ .publications-v2-section { padding-bottom: 64px; } .publications-v2-list { list-style: none; margin: 0; padding: 0; } .publications-v2-item { border-top: 1px solid var(--v2-border); } .publications-v2-item:last-child { border-bottom: 1px solid var(--v2-border); } .publications-v2-row { display: flex; flex-direction: column; gap: 10px; padding-block: 28px; } @media (min-width: 720px) { .publications-v2-row { flex-direction: row; align-items: flex-start; gap: 28px; } .publications-v2-year { flex: 0 0 140px; } .publications-v2-entry { flex: 1 1 auto; min-width: 0; } } /* ---------- Year column ---------- */ .publications-v2-year { font-family: "Playfair Display", serif; font-weight: 700; font-size: 20px; color: var(--v2-navy); line-height: 1.3; } /* ---------- Entry ---------- */ .publications-v2-heading { margin: 0; } .publications-v2-header { width: 100%; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; background: none; border: 0; padding: 0; text-align: left; cursor: pointer; font: inherit; } .publications-v2-header-main { display: flex; align-items: flex-start; gap: 16px; min-width: 0; } .publications-v2-thumb { flex: 0 0 auto; width: 72px; height: 54px; border-radius: 6px; overflow: hidden; border: 1px solid var(--v2-border); } .publications-v2-thumb img { width: 100%; height: 100%; object-fit: cover; } .publications-v2-header-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .publications-v2-title { font-family: "Playfair Display", serif; font-weight: 700; font-size: 18px; line-height: 1.35; color: var(--v2-navy); } .publications-v2-authors { font-size: 14px; line-height: 1.5; color: var(--v2-muted); } .publications-v2-authors strong { color: var(--v2-navy); font-weight: 700; } .publications-v2-venue { font-size: 13px; font-style: italic; color: var(--v2-muted); } .publications-v2-chev { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 4px; color: var(--v2-muted); transition: transform 0.2s ease; } .publications-v2-header[aria-expanded="true"] .publications-v2-chev { transform: rotate(180deg); } /* ---------- Panel (tags / links / summary) ---------- */ .publications-v2-panel { overflow: hidden; max-height: 0; transition: max-height 0.25s ease; } .publications-v2-panel-inner { padding-top: 16px; } .publications-v2-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; } .publications-v2-tag { font-size: 12px; font-weight: 600; color: var(--v2-muted); background: #fafafa; border: 1px solid var(--v2-border); border-radius: 6px; padding: 3px 9px; } .publications-v2-actions { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 14px; } a.publications-v2-action { font-size: 13px; font-weight: 600; color: var(--v2-orange); } a.publications-v2-action:hover { text-decoration: underline; } .publications-v2-summary { border-top: 1px solid var(--v2-border); padding-top: 14px; } .publications-v2-summary-grid { display: grid; grid-template-columns: 1fr; gap: 14px; } .publications-v2-summary-item p { font-size: 13px; line-height: 1.6; color: var(--v2-ink); margin-top: 4px; } .publications-v2-summary-label { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--v2-orange); } @media (min-width: 640px) { .publications-v2-summary-grid { grid-template-columns: repeat(2, 1fr); column-gap: 24px; } } .publications-v2-empty { font-size: 14px; color: var(--v2-muted); } /* ---------- Profile row (Scholar / ResearchGate / ORCID + CTA) ---------- */ .publications-v2-profile { display: flex; flex-direction: column; align-items: center; gap: 20px; margin-top: 56px; padding-top: 40px; border-top: 1px solid var(--v2-border); text-align: center; } .publications-v2-profile-icons { display: flex; align-items: center; gap: 14px; } .publications-v2-social-icon { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 9999px; border: 1px solid var(--v2-border-strong); color: var(--v2-navy); transition: color 0.15s ease, border-color 0.15s ease; } .publications-v2-social-icon svg { width: 18px; height: 18px; } .publications-v2-social-icon:hover { color: var(--v2-orange); border-color: var(--v2-orange); } a.publications-v2-profile-cta { font-size: 14px; font-weight: 600; color: var(--v2-navy); border-bottom: 1px solid var(--v2-border-strong); padding-bottom: 2px; transition: color 0.15s ease, border-color 0.15s ease; } a.publications-v2-profile-cta:hover { color: var(--v2-orange); border-color: var(--v2-orange); }