/* ═══════════════════════════════════════════
   研路通 | 论文辅导与发表服务网站
   设计令牌：学术蓝 × 印泥红 × 宣纸白
   ═══════════════════════════════════════════ */

/* ── 必填标识 ── */
.form-label .required {
  color: #c00;
  margin-left: 2px;
}

/* ── 字体加载 ──────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@600;700;900&family=Noto+Sans+SC:wght@400;500;700&display=swap');

/* ── 设计令牌 (CSS 自定义属性) ──────────── */
:root {
  --deep:    #122B52;
  --deep2:   #0C1F3D;
  --seal:    #B93A2B;
  --sealSoft:#F3E2DE;
  --paper:   #F7F5F0;
  --card:    #FFFFFF;
  --ink:     #2B2F36;
  --mist:    #6E7889;
  --line:    #DFDACD;
  --gold:    #A8842C;

  --serif: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
  --sans:  'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* ── reset ─────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html  { scroll-behavior:smooth; }
body  { font-family:var(--sans); color:var(--ink); background:var(--paper); min-height:100vh; }

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition:none !important; animation:none !important; }
}

.serif { font-family:var(--serif); }
.sans  { font-family:var(--sans); }

img, svg { display:block; max-width:100%; }
a { text-decoration:none; color:inherit; }
input, select, textarea, button { font-family:inherit; font-size:inherit; }
input:focus, select:focus, textarea:focus, button:focus-visible { outline:2px solid var(--seal); outline-offset:2px; }

/* ── 动效 ──────────────────────────────── */
.fade-up { animation:fadeUp .6s ease both; }
@keyframes fadeUp {
  from { opacity:0; transform:translateY(14px); }
  to   { opacity:1; transform:none; }
}

/* ── 容器 ──────────────────────────────── */
.container  { max-width:1200px; margin:0 auto; padding:0 20px; }

/* ── 顶栏 ──────────────────────────────── */
.header {
  position:sticky; top:0; z-index:30;
  background:rgba(247,245,240,.92);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner {
  max-width:1200px; margin:0 auto; padding:14px 20px;
  display:flex; align-items:center; justify-content:space-between;
}
.logo-wrap { display:flex; align-items:center; gap:10px; }
.logo-mark {
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px;
  background:var(--seal); border-radius:6px;
  font-family:var(--serif); font-weight:900; color:#fff; font-size:17px;
}
.logo-text { font-family:var(--serif); font-weight:900; color:var(--deep); font-size:17px; line-height:1; }
.logo-sub  { font-size:10px; letter-spacing:.3em; color:var(--mist); }

.nav-desktop { display:none; align-items:center; gap:28px; }
@media (min-width:768px) { .nav-desktop { display:flex; } }
.nav-link { font-size:14px; font-weight:500; color:var(--deep); }
.nav-link:hover { opacity:.7; }
.nav-cta {
  font-size:14px; font-weight:700; color:#fff;
  background:var(--deep); padding:8px 16px; border-radius:6px;
}

/* ── 首屏 ──────────────────────────────── */
.hero {
  max-width:1200px; margin:0 auto; padding:64px 20px 80px;
  display:grid; gap:48px; align-items:center;
}
@media (min-width:768px) { .hero { grid-template-columns:1.5fr 1fr; padding:96px 20px 112px; } }

.hero-tag {
  font-size:12px; font-weight:700; letter-spacing:.3em;
  color:var(--seal); margin-bottom:20px;
}
.hero h1 {
  font-family:var(--serif); font-weight:900; line-height:1.15;
  color:var(--deep);
  font-size:clamp(2rem, 5vw, 3.4rem);
}
.hero h1 span { color:var(--seal); }
.hero-desc {
  font-size:16px; line-height:1.7; max-width:600px;
  color:var(--mist); margin-top:24px;
}
.hero-btns { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.btn-primary {
  display:inline-block; font-size:14px; font-weight:700; color:#fff;
  background:var(--seal); padding:14px 28px; border-radius:6px;
  transition:opacity .2s;
}
.btn-primary:hover { opacity:.85; }
.btn-outline {
  display:inline-block; font-size:14px; font-weight:700; color:var(--deep);
  border:1.5px solid var(--deep); padding:14px 28px; border-radius:6px;
  transition:opacity .2s;
}
.btn-outline:hover { opacity:.7; }

.hero-stats {
  display:flex; flex-wrap:wrap; gap:32px; margin-top:40px;
}
.stat-num { font-family:var(--serif); font-weight:900; font-size:24px; color:var(--deep); }
.stat-lbl { font-size:12px; color:var(--mist); margin-left:8px; }

.hero-card {
  display:none; position:relative;
}
@media (min-width:768px) { .hero-card { display:flex; justify-content:center; } }
.manuscript {
  background:#fff; border:1px solid var(--line); border-radius:8px;
  padding:32px; transform:rotate(1.5deg);
  box-shadow:0 20px 50px rgba(18,43,82,.10);
  width:300px; position:relative;
}
.manuscript-label {
  font-size:10px; letter-spacing:.3em; color:var(--mist); margin-bottom:12px;
}
.manuscript-title {
  font-family:var(--serif); font-weight:700; font-size:18px; color:var(--deep); margin-bottom:16px;
}
.manuscript-item {
  font-size:14px; padding:8px 0; color:var(--ink);
  border-bottom:1px dashed var(--line);
}
.manuscript-seal {
  position:absolute; bottom:-24px; right:-20px;
}

/* ── 印章 ──────────────────────────────── */
.seal {
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-weight:900; text-align:center;
  border-radius:8px; user-select:none;
}

/* ── 服务体系 ───────────────────────────── */
.section-services {
  background:#fff; border-top:1px solid var(--line); padding:80px 0;
}
.section-label {
  font-size:12px; font-weight:700; letter-spacing:.3em; color:var(--seal); margin-bottom:8px;
}
.section-title {
  font-family:var(--serif); font-weight:900; font-size:30px; color:var(--deep); margin-bottom:12px;
}
.section-desc {
  font-size:14px; color:var(--mist); max-width:600px; margin-bottom:48px;
}

.services-grid {
  display:grid; gap:24px;
}
@media (min-width:768px) { .services-grid { grid-template-columns:1fr 1fr; } }

.service-card {
  background:var(--paper); border:1px solid var(--line); border-radius:8px;
  padding:28px; display:flex; flex-direction:column;
  transition:transform .2s;
}
.service-card:hover { transform:translateY(-4px); }

.service-card-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:16px; }
.service-tag {
  display:inline-block; font-size:11px; font-weight:700;
  padding:4px 10px; border-radius:4px;
  background:var(--sealSoft); color:var(--seal);
}
.service-name { font-family:var(--serif); font-weight:900; font-size:24px; color:var(--deep); margin-top:12px; }

.difficulty-label { font-size:10px; color:var(--mist); margin-bottom:4px; text-align:right; }
.difficulty-dots { display:flex; gap:4px; justify-content:flex-end; }
.dot { width:10px; height:10px; border-radius:50%; }
.dot.active  { background:var(--seal); }
.dot.inactive{ background:var(--line); }

.service-desc { font-size:14px; line-height:1.65; color:var(--ink); margin-bottom:20px; }
.service-points {
  display:grid; grid-template-columns:1fr 1fr; gap:8px 16px; margin-bottom:20px;
}
.service-point { font-size:13px; color:var(--deep); }
.service-footer {
  margin-top:auto; padding-top:16px; border-top:1px dashed var(--line);
  display:flex; align-items:center; justify-content:space-between;
}
.service-cycle { font-size:12px; color:var(--mist); }
.service-cta {
  font-size:14px; font-weight:700; color:var(--seal); margin-top:16px; display:inline-block;
}

/* ── 服务流程 ──────────────────────────── */
.section-process {
  background:var(--deep); padding:80px 0;
}
.process-title { font-family:var(--serif); font-weight:900; font-size:30px; color:#fff; margin-bottom:48px; }
.process-grid {
  display:grid; gap:40px;
}
@media (min-width:768px) { .process-grid { grid-template-columns:repeat(3,1fr); } }

.step {
  position:relative; padding-left:56px;
}
.step-num {
  position:absolute; left:0; top:0;
  font-family:var(--serif); font-weight:900;
  color:var(--seal); font-size:34px; line-height:1;
}
.step-title { font-family:var(--serif); font-weight:700; font-size:18px; color:#fff; margin-bottom:6px; }
.step-desc { font-size:14px; line-height:1.65; color:#9FB0CC; }

/* ── 诚信承诺 ──────────────────────────── */
.section-promise {
  background:#fff; border-bottom:1px solid var(--line); padding:80px 0;
}
.promise-grid {
  display:grid; gap:40px; align-items:center;
  max-width:1200px; margin:0 auto; padding:0 20px;
}
@media (min-width:768px) { .promise-grid { grid-template-columns:auto 1fr; } }
.promise-seal { justify-self:center; }

.promise-title {
  font-family:var(--serif); font-weight:900; font-size:30px; color:var(--deep); margin-bottom:16px;
}
.promise-items {
  display:grid; gap:16px;
}
@media (min-width:768px) { .promise-items { grid-template-columns:1fr 1fr; gap:16px 40px; } }
.promise-item-title { font-family:var(--serif); font-weight:700; color:var(--deep); margin-bottom:4px; }
.promise-item-desc { font-size:14px; line-height:1.65; color:var(--mist); }

/* ── FAQ ────────────────────────────────── */
.section-faq {
  padding:80px 0;
}
.faq-wrap { max-width:800px; margin:0 auto; padding:0 20px; }
.faq-list { display:grid; gap:12px; margin-top:40px; }

.faq-item {
  background:#fff; border:1px solid var(--line); border-radius:8px; overflow:hidden;
}
.faq-q {
  list-style:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 24px;
  font-family:var(--serif); font-weight:700; color:var(--deep);
}
.faq-q::-webkit-details-marker { display:none; }
.faq-icon {
  flex-shrink:0; font-weight:900; color:var(--seal); font-size:20px;
  transition:transform .25s;
  font-family:var(--sans);
}
.faq-item[open] .faq-icon { transform:rotate(45deg); }
.faq-a {
  font-size:14px; line-height:1.7; color:var(--ink);
  padding:16px 24px 20px;
  border-top:1px dashed var(--line);
}
.faq-footnote {
  font-size:12px; text-align:center; color:var(--mist); margin-top:32px;
}

/* ── 咨询表单 ──────────────────────────── */
.section-consult {
  padding:80px 0;
}
.consult-form-wrap {
  max-width:720px; margin:0 auto; padding:0 20px;
}
.consult-card {
  background:#fff; border:1px solid var(--line); border-radius:12px;
  padding:28px; margin-top:40px;
  box-shadow:0 12px 40px rgba(18,43,82,.06);
}
@media (min-width:768px) { .consult-card { padding:36px; } }

.form-grid { display:grid; gap:16px; }
.form-row { display:grid; gap:16px; }
@media (min-width:768px) { .form-row-2 { grid-template-columns:1fr 1fr; } }
@media (min-width:768px) { .form-row-3 { grid-template-columns:1fr 1fr 1fr; } }

.form-label {
  display:block; font-size:12px; font-weight:700; color:var(--deep); margin-bottom:6px;
}
.form-field {
  width:100%; padding:12px 16px; border-radius:6px;
  border:1px solid var(--line); background:#fff; color:var(--ink);
  font-size:14px; transition:border-color .2s;
}
.form-field:focus { border-color:var(--seal); }
textarea.form-field { min-height:96px; resize:vertical; }

.form-error {
  font-size:12px; color:var(--seal);
}
.form-submit {
  display:inline-block; font-size:14px; font-weight:700; color:#fff;
  background:var(--seal); padding:14px 32px; border-radius:6px;
  border:none; cursor:pointer; width:100%;
  transition:opacity .2s;
}
@media (min-width:768px) { .form-submit { width:auto; align-self:flex-start; } }
.form-submit:hover { opacity:.85; }
.form-submit:disabled { opacity:.6; cursor:not-allowed; }
.form-hint {
  font-size:12px; color:var(--mist);
}

/* ── 表单成功状态 ──────────────────────── */
.form-success {
  display:flex; flex-direction:column; align-items:center; gap:16px; padding:40px 0;
}
.form-success-msg {
  font-family:var(--serif); font-size:20px; font-weight:700; color:var(--deep);
}
.form-success-desc { font-size:14px; color:var(--mist); text-align:center; }
.form-reset-btn {
  font-size:14px; color:var(--seal); background:none; border:none;
  cursor:pointer; text-decoration:underline;
}

/* ── 管理后台 ──────────────────────────── */
.admin-overlay {
  position:fixed; inset:0; z-index:50;
  display:flex; align-items:center; justify-content:center; padding:16px;
  background:rgba(12,31,61,.55);
}
.admin-panel {
  width:100%; max-width:720px; border-radius:12px; overflow:hidden;
  background:var(--paper); max-height:85vh; display:flex; flex-direction:column;
}
.admin-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 24px; background:var(--deep);
}
.admin-header h3 { font-family:var(--serif); font-weight:700; color:#fff; font-size:16px; }
.admin-close {
  font-size:14px; color:rgba(255,255,255,.8); background:none; border:none;
  cursor:pointer;
}
.admin-close:hover { color:#fff; }

.admin-body { padding:24px; overflow-y:auto; }
.admin-login { display:grid; gap:12px; max-width:320px; }
.admin-login-label { font-size:12px; font-weight:700; color:var(--deep); }
.admin-login-input {
  padding:12px 16px; border-radius:6px; border:1px solid var(--line);
  background:#fff; font-size:14px;
}
.admin-login-btn {
  font-size:14px; font-weight:700; color:#fff;
  background:var(--deep); padding:12px 24px; border-radius:6px;
  border:none; cursor:pointer;
}

.admin-toolbar {
  display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;
}
.admin-count { font-size:14px; color:var(--mist); }
.admin-actions { display:flex; gap:12px; }
.admin-btn {
  font-size:12px; font-weight:700; padding:6px 12px; border-radius:6px;
  background:none; cursor:pointer;
}
.admin-btn-refresh { border:1px solid var(--deep); color:var(--deep); }
.admin-btn-clear   { border:1px solid var(--seal); color:var(--seal); }

.admin-leads { display:grid; gap:12px; }
.admin-lead {
  background:#fff; border:1px solid var(--line); border-radius:8px; padding:16px;
}
.admin-lead-top {
  display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 16px; margin-bottom:8px;
}
.admin-lead-name { font-family:var(--serif); font-weight:700; color:var(--deep); }
.admin-lead-tag {
  font-size:12px; padding:2px 8px; border-radius:4px;
  background:var(--sealSoft); color:var(--seal);
}
.admin-lead-meta { font-size:12px; color:var(--mist); }
.admin-lead-contact { font-size:14px; color:var(--ink); }
.admin-lead-msg { font-size:14px; color:var(--mist); margin-top:4px; }

/* ── AI 在线咨询 ──────────────────────── */
.chat-button {
  position:fixed; bottom:24px; right:20px; z-index:40;
  display:flex; align-items:center; gap:8px;
  padding:14px 20px; border-radius:9999px; border:none;
  background:var(--seal); color:#fff;
  font-family:var(--sans); font-weight:700; font-size:14px;
  cursor:pointer; box-shadow:0 8px 24px rgba(185,58,43,.3);
  transition:transform .2s;
}
.chat-button:hover { transform:scale(1.05); }

.chat-panel {
  position:fixed; bottom:96px; right:20px; z-index:40;
  width:320px; height:460px;
  background:#fff; border:1px solid var(--line);
  border-radius:12px; overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:0 16px 48px rgba(0,0,0,.15);
}
@media (min-width:768px) { .chat-panel { width:384px; } }

.chat-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px; background:var(--deep);
}
.chat-header-title { font-family:var(--serif); font-weight:700; color:#fff; font-size:14px; }
.chat-header-sub { font-size:12px; color:rgba(255,255,255,.7); }
.chat-close-btn {
  color:rgba(255,255,255,.8); background:none; border:none; cursor:pointer; font-size:14px;
}
.chat-close-btn:hover { color:#fff; }

.chat-messages {
  flex:1; overflow-y:auto; padding:16px;
  background:var(--paper); display:grid; gap:12px; align-content:flex-start;
}
.chat-msg {
  font-size:14px; padding:10px 14px; border-radius:8px; max-width:85%;
  line-height:1.5;
}
.chat-msg-user {
  justify-self:end; background:var(--deep); color:#fff;
}
.chat-msg-ai {
  justify-self:start; background:#fff; color:var(--ink); border:1px solid var(--line);
}
.chat-typing { font-size:12px; color:var(--mist); padding:0 8px; }

.chat-input-bar {
  display:flex; gap:8px; padding:12px; background:#fff; border-top:1px solid var(--line);
}
.chat-input {
  flex:1; padding:10px 12px; border-radius:6px; border:1px solid var(--line);
  font-size:14px; outline:none;
}
.chat-input:focus { border-color:var(--seal); }
.chat-send-btn {
  font-size:14px; font-weight:700; color:#fff;
  background:var(--seal); padding:0 16px; border-radius:6px;
  border:none; cursor:pointer;
}
.chat-send-btn:disabled { opacity:.6; cursor:not-allowed; }

/* ── 页脚 ──────────────────────────────── */
.footer {
  background:var(--deep2); padding:40px 20px;
}
.footer-inner {
  max-width:1200px; margin:0 auto;
  display:flex; flex-direction:column; align-items:center; gap:16px;
}
@media (min-width:768px) {
  .footer-inner { flex-direction:row; justify-content:space-between; }
}
.footer-copy { font-size:12px; color:#8DA0C4; }
.footer-links { display:flex; align-items:center; gap:24px; }
.footer-link { font-size:12px; color:#8DA0C4; }
.footer-link:hover { color:#fff; }
.footer-admin-btn { font-size:12px; color:#8DA0C4; text-decoration:underline; background:none; border:none; cursor:pointer; }
.footer-admin-btn:hover { color:#fff; }

/* ── 响应式微调 ────────────────────────── */
@media (max-width:767px) {
  .section-title { font-size:24px; }
  .process-title { font-size:24px; }
  .promise-title { font-size:24px; }
  .service-name  { font-size:20px; }
  .service-points { grid-template-columns:1fr; }
  .hero-stats    { gap:20px; }
  .admin-panel   { max-width:100%; border-radius:0; max-height:100vh; }
  .chat-panel    { right:8px; left:8px; width:auto; }
  .chat-button   { right:12px; }
}

/* ── 滚动条（可选美化） ────────────────── */
.chat-messages::-webkit-scrollbar { width:4px; }
.chat-messages::-webkit-scrollbar-track { background:transparent; }
.chat-messages::-webkit-scrollbar-thumb { background:var(--line); border-radius:4px; }

.admin-body::-webkit-scrollbar { width:4px; }
.admin-body::-webkit-scrollbar-track { background:transparent; }
.admin-body::-webkit-scrollbar-thumb { background:var(--line); border-radius:4px; }
