/* ============================================================
   VACD 全站视觉增强（vacd-polish.css）
   说明：只优化字体、颜色、圆角、阴影、过渡等观感，
         不修改 flex / grid 的列数、间距和区块结构。
   ============================================================ */

:root {
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-card: 0 4px 18px rgba(0, 50, 120, 0.07);
  --shadow-card-hover: 0 12px 32px rgba(0, 50, 120, 0.12);
  --shadow-header: 0 4px 24px rgba(0, 36, 90, 0.16);
  --ease-out: cubic-bezier(0.4, 0, 0.2, 1);
  --text-heading: #1a2d42;
  --border-subtle: rgba(0, 86, 179, 0.09);
}

html {
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ---------- 顶栏与导航 ---------- */
header {
  box-shadow: var(--shadow-header) !important;
}

.logo img {
  border-radius: var(--radius-sm);
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.12));
}

.logo-text h1 {
  font-weight: 600;
  letter-spacing: 0.02em;
}

.logo-text p {
  letter-spacing: 0.01em;
}

nav ul li a {
  letter-spacing: 0.02em;
}

.dropdown-content {
  border-radius: var(--radius-md) !important;
  border: 1px solid var(--border-subtle);
  overflow: hidden;
  box-shadow: 0 12px 36px rgba(0, 40, 100, 0.14) !important;
}

.back-nav {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.back-link {
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--radius-md) !important;
}

/* ---------- 章节标题 ---------- */
.section-title {
  color: var(--text-heading);
  font-weight: 600;
  letter-spacing: 0.03em;
}

.section-title::after {
  width: 72px !important;
  height: 4px !important;
  border-radius: 2px;
  background: linear-gradient(
    90deg,
    var(--primary-color, #0056b3),
    var(--secondary-color, #004494)
  ) !important;
  bottom: -12px !important;
}

/* ---------- 卡片、公告、活动 ---------- */
.about-card,
.announcement-item,
.event-card,
.job-preview-card,
.staff-card,
.staff-intro,
.contact-item,
.online-sharing-card,
.register-doc-card {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md) !important;
  box-shadow: var(--shadow-card);
}

.about-card:hover,
.clickable-card:hover,
.event-card:hover,
.job-preview-card:hover,
.staff-card:hover {
  box-shadow: var(--shadow-card-hover) !important;
}

.announcements {
  border: 1px solid rgba(0, 86, 179, 0.1);
  border-radius: var(--radius-lg) !important;
}

.announcement-category-title {
  letter-spacing: 0.02em;
}

.announcement-meeting-poster img {
  border: 1px solid var(--border-subtle);
}

.card-content h3,
.event-card h3,
.job-preview-title {
  letter-spacing: 0.01em;
}

/* ---------- 按钮与链接 ---------- */
.btn,
.btn-small {
  border-radius: var(--radius-md) !important;
  letter-spacing: 0.02em;
  transition: background 0.25s var(--ease-out),
    transform 0.25s var(--ease-out),
    box-shadow 0.25s var(--ease-out) !important;
}

.btn:focus-visible,
.btn-small:focus-visible,
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--primary-color, #0056b3);
  outline-offset: 3px;
}

a {
  transition: color 0.2s var(--ease-out);
}

/* ---------- 模态框、表单 ---------- */
.modal-content {
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 20px 60px rgba(0, 40, 100, 0.2) !important;
  border: 1px solid var(--border-subtle);
}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
  border-radius: var(--radius-sm) !important;
  border: 1px solid var(--medium-gray, #ddd) !important;
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--primary-color, #0056b3) !important;
  box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.12);
  outline: none;
}

/* ---------- 页脚 ---------- */
footer {
  background: linear-gradient(180deg, #1a4a8c 0%, #153d75 100%) !important;
  box-shadow: 0 -4px 20px rgba(0, 36, 90, 0.08);
}

footer a {
  transition: color 0.2s var(--ease-out);
}

footer a:hover {
  color: #fff !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------- 法律页（Impressum / Datenschutz）与主站配色统一 ---------- */
.legal-page .header {
  border-left-color: var(--primary-color, #0056b3);
}

.legal-page .section {
  box-shadow: var(--shadow-card);
  border-radius: var(--radius-md);
}

.legal-page .section h2 {
  color: var(--primary-color, #0056b3);
}

.legal-page a {
  color: var(--primary-color, #0056b3);
}

.legal-page a:hover {
  color: var(--secondary-color, #004494);
}

.legal-page .back:hover {
  color: var(--primary-color, #0056b3);
}