@charset "utf-8";
/* ============================================
   航空学院网站 - public.css（全局公共样式）
   包含：全局重置、头部、导航、页脚
   适配：博达网站群 V12 / Tomcat + FreeMarker
   版本：2026-05
   ============================================ */

/* ========== CSS变量定义 ========== */
:root {
    --primary:       #0EA5E9;     /* 主色：天蓝 */
    --primary-dark:  #0284C7;     /* 深蓝 */
    --primary-deeper:#0369A1;     /* 更深蓝 */
    --navy:          #0F172A;     /* 深海军蓝（标题/页脚背景） */
    --navy-mid:      #1E293B;     /* 中间海军蓝 */
    --text-main:     #2c3e50;     /* 主文字 */
    --text-sub:      #666;        /* 次文字 */
    --text-light:    #999;        /* 浅文字 */
    --bg-page:       #f4f7fa;     /* 页面背景 */
    --bg-white:      #fff;        /* 白色卡片 */
    --border-light:  #eee;        /* 浅边框 */
    --shadow-card:   0 4px 20px rgba(0,0,0,0.06);
    --radius-card:   16px;
    --transition:    all 0.3s ease;
    --container:     1200px;
}

/* ========== 全局重置 ========== */
html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6,
form, fieldset, table, td, img, div, textarea, dl, dt, dd {
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--bg-page);
    font-size: 14px;
    font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
    color: var(--text-main);
    line-height: 1.6;
}

ul, ol, li, dl, dt, dd {
    list-style: none;
}

select, input, textarea, img {
    vertical-align: middle;
    border: 0;
    margin: 0;
}

a {
    text-decoration: none;
    cursor: pointer;
    transition: var(--transition);
    color: inherit;
}

a:hover {
    text-decoration: none;
}

i {
    font-style: normal;
}

img {
    max-width: 100%;
}

/* 头部logo区域图片不受全局max-width限制（!important 防止被博达CMS注入CSS覆盖） */
#header img {
    max-width: none !important;
    width: auto !important;
}

.clear {
    clear: both;
}

.clearFloat {
    clear: both;
    height: 0;
    font-size: 1px;
    line-height: 0;
    overflow: hidden;
}


/* ============================================
   头部区域  #header
   ============================================ */
#header {
    background: linear-gradient(135deg, #0F172A 0%, #0369A1 50%, #0EA5E9 100%);
    width: 100%;
    min-width: var(--container);
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
    position: relative;
    overflow: visible;
}

/* 头部网格纹理 */
#header::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}

/* .top — 头部内容行 */
.top {
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 18px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 1;
    overflow: visible;
}

/* .logo — 双LOGO设计（学校+学院） */
.logo {
    display: flex;
    align-items: center;
    overflow: visible;
    flex-shrink: 0;
}

.logo a {
    display: flex;
    align-items: center;
    gap: 0;
    color: #fff;
    text-decoration: none;
    overflow: visible;
    flex-wrap: nowrap;
    flex-shrink: 0;
    min-width: max-content;
}

/* 学校LOGO区域 */
.logo-school {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* 学院LOGO区域 */
.logo-dept {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* LOGO图标 */
.logo-icon {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.logo-icon img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    transition: transform 0.3s ease;
    object-fit: contain;
    background: #fff;
    padding: 2px;
}

.logo-icon img:hover {
    transform: scale(1.06);
}

/* 分隔线 */
.logo-divider {
    width: 1px;
    height: 44px;
    background: rgba(255,255,255,0.3);
    margin: 0 14px;
    flex-shrink: 0;
}

/* LOGO文字区域 */
.logo-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* 学校名称 - 图片形式 */
.logo-school .logo-text {
    display: flex;
    align-items: center;
}

/* 学校名称 - 图片形式（首页）
   不设max-width，让图片按height等比缩放自然显示完整 */
.logo-school .college-name-img {
    height: 44px;
    width: auto;
    /* 关键：给文字留出呼吸空间，防止浏览器subpixel渲染截断边缘笔画 */
    padding: 0 4px;
    box-sizing: content-box;
    filter: brightness(0) invert(1) drop-shadow(0 2px 4px rgba(0,0,0,0.2));
    transition: transform 0.3s ease;
}

.logo-school .college-name-img:hover {
    transform: scale(1.03);
}

/* 学校名称 - 文字形式（子页） */
.logo-school .college-name-cn {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 3px;
    text-shadow: 0 2px 6px rgba(0,0,0,0.2);
    line-height: 1.2;
    white-space: nowrap;
}

.logo-school .college-name-en {
    font-size: 10px;
    color: rgba(255,255,255,0.7);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    line-height: 1.2;
    white-space: nowrap;
}

/* 学院名称 */
.logo-dept .dept-name-cn {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 3px;
    text-shadow: 0 2px 6px rgba(0,0,0,0.2);
    line-height: 1.2;
}

.logo-dept .dept-name-en {
    font-size: 10px;
    color: rgba(255,255,255,0.7);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    line-height: 1.2;
}

/* .ss — 右上角搜索/快捷链接 */
.ss {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    flex-shrink: 1;
    min-width: 0;
}

.ss p {
    display: flex;
    align-items: center;
    gap: 8px;
    text-align: right;
}

.ss p a {
    color: rgba(255,255,255,0.8);
    font-size: 12px;
    padding: 5px 12px;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 20px;
    transition: var(--transition);
}

.ss p a:hover {
    color: #fff;
    background: rgba(255,255,255,0.15);
    border-color: rgba(255,255,255,0.5);
}

/* 搜索框 */
.ssMain {
    width: 100%;
    max-width: 220px;
    background: rgba(255,255,255,0.15);
    backdrop-filter: blur(10px);
    border-radius: 22px;
    height: 38px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    border: 1px solid rgba(255,255,255,0.2);
    transition: var(--transition);
}

.ssMain:hover {
    background: rgba(255,255,255,0.22);
    border-color: rgba(255,255,255,0.4);
}

p.ssMain input {
    background: none;
    border: none;
    outline: none;
    color: #fff;
    flex: 1;
    font-size: 13px;
}

p.ssMain input::placeholder {
    color: rgba(255,255,255,0.55);
}

p.ssMain input.ssText {
    width: auto;
}

p.ssMain input.ssBtn {
    width: 28px;
    height: 28px;
    cursor: pointer;
    flex-shrink: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.8)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E") center center no-repeat;
    background-size: 16px;
}


/* ============================================
   导航菜单  .menu
   ============================================ */
.menu {
    position: relative;
    z-index: 100;
    width: 100%;
    min-width: var(--container);
    background: rgba(255,255,255,0.98);
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 15px rgba(0,0,0,0.08);
}

/* 一级菜单ul - 后代选择器兼容CMS可能包裹的div/nav等结构 */
.menu ul {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
    max-width: var(--container);
    height: 54px;
    padding: 0 20px;
}

/* 二级下拉菜单ul - 覆盖一级flex样式 */
.menu li > ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 160px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    border-radius: 0 0 8px 8px;
    z-index: 200;
    padding: 6px 0;
    border-top: 2px solid var(--primary);
    height: auto;
    width: auto;
    justify-content: flex-start;
    flex-direction: column;
}

.menu li:hover > ul {
    display: block;
}

/* 一级菜单项 */
.menu ul > li {
    position: relative;
    text-align: center;
    flex: 1;
    max-width: 140px;
    line-height: 54px;
    border-bottom: 3px solid transparent;
    transition: var(--transition);
    list-style: none;
}

/* 菜单项分隔线 */
.menu ul > li::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 18px;
    background: linear-gradient(to bottom, transparent, rgba(14,165,233,0.25), transparent);
}

.menu ul > li:last-child::after {
    display: none;
}

.menu ul > li:hover {
    background: rgba(14,165,233,0.06);
    border-bottom-color: var(--primary);
}

.menu ul > li > a {
    display: block;
    color: var(--text-main);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    position: relative;
    height: 100%;
}

.menu ul > li > a:hover {
    color: var(--primary);
}

/* 当前选中态 */
.menu ul > li > a.active,
.menu ul > li.current > a {
    color: var(--primary);
}

/* 蓝色下划线动画 */
.menu ul > li > a span {
    position: relative;
    display: inline-block;
}

.menu ul > li > a span::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 2px;
    background: var(--primary);
    border-radius: 2px;
    transition: width 0.3s ease;
}

.menu ul > li:hover > a span::after,
.menu ul > li > a.active span::after {
    width: 70%;
}

/* 二级菜单项 - 覆盖一级li的样式 */
.menu li > ul > li {
    text-align: center;
    line-height: 42px;
    border-bottom: none;
    list-style: none;
    padding: 0;
    margin: 0;
    white-space: nowrap;
    flex: none;
    max-width: none;
}

.menu li > ul > li::after {
    display: none;
}

.menu li > ul > li a {
    display: block;
    color: var(--text-main);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.5px;
    padding: 0 18px;
    transition: background 0.2s ease, color 0.2s ease;
}

.menu li > ul > li a:hover {
    color: var(--primary);
    background: rgba(14,165,233,0.06);
}

/* 当前选中态（二级） */
.menu li > ul > li a.active,
.menu li > ul > li.current a {
    color: var(--primary);
}


/* ============================================
   页脚  #footer
   ============================================ */
#footer {
    width: 100%;
    min-width: var(--container);
    background: linear-gradient(180deg, #0F172A 0%, #1E293B 100%);
    color: rgba(255,255,255,0.75);
    padding: 45px 20px 28px;
    position: relative;
    text-align: center;
    line-height: 1.9;
    clear: both;
}

/* 顶部蓝色横线 */
#footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #0284C7, #0EA5E9, #38BDF8, #0EA5E9, #0284C7);
}

#footer .footer-content {
    max-width: var(--container);
    margin: 0 auto;
}

#footer .footer-logo {
    margin-bottom: 18px;
}

#footer .footer-logo img {
    height: 50px;
    opacity: 0.85;
    filter: brightness(1.2);
}

#footer .footer-name {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 3px;
    margin-bottom: 6px;
}

#footer .footer-address {
    font-size: 13px;
    color: rgba(255,255,255,0.55);
    margin-bottom: 16px;
}

#footer .footer-links {
    display: flex;
    justify-content: center;
    gap: 28px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

#footer .footer-links a {
    color: rgba(255,255,255,0.6);
    font-size: 13px;
    transition: var(--transition);
}

#footer .footer-links a:hover {
    color: #fff;
}

#footer .footer-divider {
    border: none;
    border-top: 1px solid rgba(255,255,255,0.1);
    margin: 18px 0;
}

#footer .footer-copyright {
    font-size: 12px;
    color: rgba(255,255,255,0.4);
}

#footer .footer-copyright a {
    color: var(--primary);
}

#footer .footer-copyright a:hover {
    color: #38BDF8;
}

/* 博达CMS注入的版权区域兼容 */
#footer span {
    display: block;
    font-size: 13px;
    margin-bottom: 6px;
    color: rgba(255,255,255,0.6);
}

#footer a {
    color: var(--primary);
    font-size: 13px;
}

#footer a:hover {
    color: #38BDF8;
}


/* ============================================
   通用工具类
   ============================================ */

/* 按钮 */
.btn-primary {
    display: inline-block;
    padding: 10px 26px;
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    color: #fff !important;
    border-radius: 22px;
    font-weight: 600;
    font-size: 14px;
    transition: var(--transition);
    box-shadow: 0 4px 14px rgba(14,165,233,0.28);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(14,165,233,0.38);
}

/* 卡片悬浮效果 */
.card-hover {
    transition: var(--transition);
}

.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(14,165,233,0.12);
}

/* 标签 */
.tag {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 500;
}

.tag-blue   { background: #DBEAFE; color: #1D4ED8; }
.tag-red    { background: #FEE2E2; color: #DC2626; }
.tag-green  { background: #D1FAE5; color: #059669; }
.tag-orange { background: #FFEDD5; color: #C2410C; }
.tag-purple { background: #EDE9FE; color: #7C3AED; }

/* 玻璃态 */
.glass {
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
}

/* 淡入上浮动画 */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(22px); }
    to   { opacity: 1; transform: translateY(0); }
}

.animate-fadeInUp {
    animation: fadeInUp 0.6s ease both;
}

/* ============================================
   响应式
   ============================================ */
@media screen and (max-width: 1200px) {
    .top { padding: 15px 20px; }
    .logo-school .college-name-img { height: 38px; padding: 0 3px; }
    .logo-school .college-name-cn { font-size: 18px; letter-spacing: 2px; }
    .logo-school .college-name-en { font-size: 9px; letter-spacing: 1px; }
    .logo-dept .dept-name-cn { font-size: 18px; letter-spacing: 2px; }
    .logo-dept .dept-name-en { font-size: 9px; letter-spacing: 1px; }
    .logo-divider { margin: 0 12px; height: 40px; }
    .logo-icon img { width: 42px; height: 42px; }
    .menu li { max-width: 110px; }
    .menu li a { font-size: 13px; }
}

@media screen and (max-width: 768px) {
    /* 关键修复：移除min-width限制，防止移动端横向溢出 */
    #header,
    .menu,
    #footer {
        min-width: auto;
    }

    .top {
        flex-direction: column;
        gap: 12px;
        padding: 14px 15px;
        max-width: 100%;
    }

    /* Logo区域：确保在移动端可见且不溢出 */
    .logo {
        width: 100%;
        justify-content: center;
    }

    .logo a {
        flex-direction: column;
        gap: 8px;
        width: 100%;
        align-items: center;
    }

    .logo-school {
        justify-content: center;
        width: 100%;
    }

    .logo-school .college-name-img {
        height: 30px;
        padding: 0 2px;
        max-width: 100%;
    }

    .logo-school .college-name-cn {
        font-size: 15px;
        letter-spacing: 1px;
    }

    .logo-school .college-name-en {
        font-size: 8px;
        letter-spacing: 0.5px;
    }

    .logo-dept {
        text-align: center;
    }

    .logo-dept .dept-name-cn {
        font-size: 15px;
        letter-spacing: 1px;
    }

    .logo-dept .dept-name-en {
        font-size: 8px;
        letter-spacing: 0.5px;
    }

    .logo-divider {
        width: 60%;
        height: 1px;
        margin: 4px 0;
    }

    .logo-icon img {
        width: 36px;
        height: 36px;
    }

    /* 搜索框区域 */
    .ss {
        align-items: center;
        width: 100%;
    }

    .ss p {
        display: none;  /* 隐藏顶部快捷链接，节省空间 */
    }

    .ssMain {
        width: 90%;
        max-width: 280px;
    }

    /* 导航菜单：强制三列紧凑布局，覆盖CMS默认样式 */
    .menu ul {
        display: flex !important;
        flex-wrap: wrap !important;
        height: auto !important;
        padding: 4px 8px !important;
        gap: 0 !important;
        justify-content: flex-start !important;
    }

    .menu ul > li {
        display: block !important;
        max-width: none !important;
        flex: 0 0 33.333% !important;
        width: 33.333% !important;
        line-height: 40px !important;
        border-bottom: none !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
    }

    .menu ul > li::after {
        display: none !important;
    }

    .menu ul > li > a {
        display: block !important;
        font-size: 13px !important;
        letter-spacing: 0 !important;
        padding: 0 2px !important;
        text-align: center !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* 移动端隐藏二级下拉菜单 */
    .menu li ul {
        display: none !important;
    }

    /* 页脚 */
    #footer {
        padding: 30px 15px 20px;
        min-width: auto;
    }

    #footer .footer-links {
        gap: 15px;
    }

    #footer .footer-name {
        font-size: 15px;
    }
}