/* ============================================================
   DaoHang 遥望侣途 - 前台样式
   版权所有：东台市讯淘网络科技有限公司/王阳
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 14px; scroll-behavior: smooth; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
    background: #f5f7fa;
    color: #333;
    min-height: 100vh;
}
a { color: #4a90d9; text-decoration: none; }
a:hover { color: #2471c8; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* ----- 顶部 Header ----- */
.site-header {
    background: #1e293b;
    box-shadow: 0 2px 8px rgba(0,0,0,.2);
    position: sticky;
    top: 0;
    z-index: 100;
}
.header-inner { display: flex; align-items: center; height: 56px; justify-content: space-between; }
.site-logo { display: flex; align-items: center; }
.site-logo img { height: 36px; }
.site-logo span { color: #fff; font-size: 20px; font-weight: 700; letter-spacing: 1px; }
.site-nav { display: flex; gap: 4px; }
.site-nav a { color: #cbd5e1; padding: 6px 16px; border-radius: 4px; font-size: 14px; transition: .15s; }
.site-nav a:hover, .site-nav a.active { background: #334155; color: #fff; }
.admin-link { border: 1px solid #475569 !important; }

/* ----- Hero 搜索区 ----- */
.hero-section {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 56px 0 48px;
    text-align: center;
}
.hero-title { font-size: 38px; font-weight: 700; margin-bottom: 10px; }
.hero-sub   { opacity: .85; font-size: 16px; margin-bottom: 28px; }
.search-box { display: flex; justify-content: center; gap: 0; max-width: 560px; margin: 0 auto; }
.search-box input {
    flex: 1;
    padding: 12px 18px;
    border: none;
    border-radius: 8px 0 0 8px;
    font-size: 15px;
    outline: none;
}
.search-box button {
    padding: 12px 24px;
    background: #f59e0b;
    color: #fff;
    border: none;
    border-radius: 0 8px 8px 0;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity .15s;
}
.search-box button:hover { opacity: .88; }

/* ----- 导航分区 ----- */
.main-content { padding: 40px 20px; }
.nav-section  { margin-bottom: 36px; }
.section-title {
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 16px;
    padding-left: 12px;
    border-left: 4px solid #667eea;
}
.nav-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}
.nav-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 16px 10px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,.07);
    color: #374151;
    font-size: 13px;
    text-align: center;
    transition: transform .15s, box-shadow .15s;
}
.nav-card:hover { transform: translateY(-3px); box-shadow: 0 4px 14px rgba(0,0,0,.12); color: #4a90d9; }
.nav-icon { font-size: 26px; }
.nav-title { word-break: break-all; }

/* ----- 底部 Footer ----- */
.site-footer {
    background: #1e293b;
    color: #94a3b8;
    text-align: center;
    padding: 24px 0;
    font-size: 13px;
    margin-top: 40px;
}
.site-footer p + p { margin-top: 6px; }
.site-footer a { color: #7dd3fc; }
.footer-contact { font-size: 12px; }

/* ----- 响应式 ----- */
@media (max-width: 600px) {
    .hero-title { font-size: 26px; }
    .nav-grid   { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); }
    .site-nav a { padding: 6px 10px; font-size: 13px; }
}