@charset "utf-8";
/* ==========================================================================
   TEMPLATE-041 绿茵竞技体育企业模板 — 内页样式（栏目/详情/图集/单页/标签/搜索/示例/404）
   ========================================================================== */

/* ---------- 栏目横幅 ---------- */
.ae-banner {
    position: relative;
    padding: 78px 0 60px;
    background: linear-gradient(135deg, #0F1420 0%, #1A2233 45%, #12563D 100%);
    color: #fff;
    overflow: hidden;
}
.ae-banner::before {
    content: ""; position: absolute; inset: auto -10% -60% auto; width: 460px; height: 460px;
    background: radial-gradient(closest-side, rgba(242, 107, 51, .35), transparent 70%);
    pointer-events: none;
}
.ae-banner::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background-image:
        repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 60px);
}
.ae-banner-in { position: relative; z-index: 2; }
.ae-banner-tag {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 4px 12px; margin-bottom: 16px;
    background: rgba(255, 185, 59, .18); border: 1px solid rgba(255, 185, 59, .4);
    color: var(--ae-glow); border-radius: 999px;
    font-size: 11.5px; font-weight: 700; letter-spacing: .22em;
}
.ae-banner h1 {
    color: #fff; font-size: 42px; margin-bottom: 14px; letter-spacing: -.5px;
}
.ae-banner-sub {
    max-width: 780px; color: rgba(255, 255, 255, .78);
    font-size: 15px; line-height: 1.9; margin-bottom: 22px;
}

/* ---------- 面包屑 ---------- */
.ae-crumb { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13px; }
.ae-crumb a { color: rgba(255, 255, 255, .78); }
.ae-crumb a:hover { color: var(--ae-glow); }
.ae-crumb em { font-style: normal; opacity: .5; }
.ae-crumb span { color: var(--ae-glow); }

.ae-crumbbar {
    background: var(--ae-paper);
    border-bottom: 1px solid var(--ae-line);
    padding: 14px 0;
}
.ae-crumbbar .ae-crumb a { color: var(--ae-muted); }
.ae-crumbbar .ae-crumb a:hover { color: var(--ae-field); }
.ae-crumbbar .ae-crumb em { color: var(--ae-line-2); opacity: 1; }
.ae-crumbbar .ae-crumb span { color: var(--ae-ink); font-weight: 600; }

/* ---------- 布局：主内容 + 侧栏 ---------- */
.ae-layout {
    display: grid; grid-template-columns: 1fr 320px; gap: 40px;
    padding-top: 60px; padding-bottom: 80px;
}
.ae-layout.is-right { grid-template-columns: 1fr 320px; }
.ae-main { min-width: 0; }
.ae-side { min-width: 0; }

/* ---------- 侧栏组件 ---------- */
.ae-widget {
    background: #fff;
    border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
    margin-bottom: 22px; overflow: hidden;
}
.ae-widget:last-child { margin-bottom: 0; }
.ae-widget-head {
    display: flex; align-items: baseline; justify-content: space-between;
    padding: 16px 20px; border-bottom: 1px solid var(--ae-line);
    background: var(--ae-paper);
}
.ae-widget-head h2 { font-size: 15.5px; color: var(--ae-ink); }
.ae-widget-head small {
    font-size: 10.5px; color: var(--ae-muted); letter-spacing: .2em; text-transform: uppercase;
}
.ae-widget-body { padding: 18px 20px; }
.ae-widget-body.is-flush { padding: 0; }

/* 栏目导航 */
.ae-cats > li { border-bottom: 1px solid var(--ae-line); }
.ae-cats > li:last-child { border-bottom: 0; }
.ae-cats > li > a {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 20px; font-size: 14px; color: var(--ae-text);
    transition: all .25s var(--ae-ease);
}
.ae-cats > li > a span { opacity: 0; color: var(--ae-field); transition: opacity .25s; }
.ae-cats > li > a:hover,
.ae-cats > li.is-active > a { background: var(--ae-field-soft); color: var(--ae-field); font-weight: 600; }
.ae-cats > li.is-active > a { border-left: 3px solid var(--ae-field); padding-left: 17px; }
.ae-cats > li > a:hover span, .ae-cats > li.is-active > a span { opacity: 1; }
.ae-subcats { background: var(--ae-paper); padding: 6px 0; }
.ae-subcats li a {
    display: block; padding: 6px 24px 6px 30px; font-size: 13px; color: var(--ae-muted);
    position: relative;
}
.ae-subcats li a::before {
    content: ""; position: absolute; left: 20px; top: 50%; width: 4px; height: 4px;
    border-radius: 50%; background: var(--ae-line-2); transform: translateY(-50%);
}
.ae-subcats li a:hover, .ae-subcats li.is-active a { color: var(--ae-field); background: #fff; }
.ae-subcats li.is-active a::before { background: var(--ae-field); }

/* 热读排行 */
.ae-hotlist li {
    display: flex; gap: 12px; padding: 12px 20px;
    border-bottom: 1px dashed var(--ae-line);
}
.ae-hotlist li:last-child { border-bottom: 0; }
.ae-hotlist li em {
    flex: none; width: 22px; height: 22px; border-radius: 4px;
    background: var(--ae-paper); color: var(--ae-muted);
    font-style: normal; font-weight: 700; font-size: 12px;
    display: inline-flex; align-items: center; justify-content: center;
}
.ae-hotlist li:nth-child(-n+3) em { background: var(--ae-ink); color: var(--ae-glow); }
.ae-hotlist li a {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; font-size: 13.5px; line-height: 1.55; color: var(--ae-text);
}
.ae-hotlist li a:hover { color: var(--ae-field); }

/* 侧栏联系模块 */
.ae-side-contact { background: var(--ae-ink); border-color: var(--ae-ink); }
.ae-side-contact .ae-widget-body {
    padding: 24px 22px; color: rgba(255, 255, 255, .78);
    background: linear-gradient(160deg, rgba(14,140,95,.35) 0%, transparent 70%);
}
.ae-side-contact h2 { color: #fff; font-size: 17px; margin-bottom: 10px; }
.ae-side-contact p { font-size: 13.5px; line-height: 1.85; margin-bottom: 16px; }
.ae-side-contact .ae-tel {
    display: flex; flex-direction: column; padding: 12px 14px; margin-bottom: 14px;
    background: rgba(255, 255, 255, .06); border: 1px solid rgba(255,255,255,.1); border-radius: 8px;
    color: #fff;
}
.ae-side-contact .ae-tel small { font-size: 11.5px; letter-spacing: .18em; opacity: .7; }
.ae-side-contact .ae-tel strong { font-size: 20px; color: var(--ae-glow); margin-top: 4px; letter-spacing: .04em; }
.ae-side-contact .ae-btn { width: 100%; }

/* ---------- 列表头部 ---------- */
.ae-list-head {
    display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
    padding-bottom: 12px; margin-bottom: 22px;
    border-bottom: 2px solid var(--ae-ink);
}
.ae-list-head h2 { font-size: 22px; color: var(--ae-ink); }
.ae-list-head p { font-size: 13px; color: var(--ae-muted); }

/* ---------- 文章列表卡 ---------- */
.ae-posts { display: flex; flex-direction: column; gap: 20px; }
.ae-post {
    display: grid; grid-template-columns: 260px 1fr; gap: 22px;
    padding: 20px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
    transition: all .3s var(--ae-ease);
}
.ae-post:hover { border-color: var(--ae-field); box-shadow: var(--ae-shadow-sm); transform: translateY(-2px); }
.ae-post-media {
    position: relative; display: block; overflow: hidden;
    aspect-ratio: 16/10; border-radius: 6px; background: var(--ae-paper);
}
.ae-post-media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .6s var(--ae-ease);
}
.ae-post:hover .ae-post-media img { transform: scale(1.05); }
.ae-post-num {
    position: absolute; left: 8px; top: 8px;
    padding: 3px 8px; border-radius: 4px;
    background: rgba(15, 20, 32, .8); color: var(--ae-glow);
    font-size: 11px; font-weight: 700; letter-spacing: .1em;
}
.ae-post-body { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ae-post-cat {
    align-self: flex-start;
    padding: 3px 10px; border-radius: 4px;
    background: var(--ae-sunset-soft); color: var(--ae-sunset);
    font-size: 11.5px; font-weight: 600; letter-spacing: .06em;
}
.ae-post-body h3 { font-size: 17px; line-height: 1.55; }
.ae-post-body h3 a { color: var(--ae-ink); }
.ae-post-body h3 a:hover { color: var(--ae-field); }
.ae-post-body p {
    font-size: 13.5px; color: var(--ae-muted); line-height: 1.85;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ae-post-meta {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin-top: auto; padding-top: 10px;
    border-top: 1px dashed var(--ae-line);
    font-size: 12.5px; color: var(--ae-muted);
}
.ae-post-meta i { font-style: normal; opacity: .5; }
.ae-post-more {
    margin-left: auto; color: var(--ae-field); font-weight: 600;
}
.ae-post-more span { display: inline-block; transition: transform .25s var(--ae-ease); }
.ae-post:hover .ae-post-more span { transform: translateX(4px); }

/* 空态 */
.ae-empty {
    padding: 60px 24px; text-align: center;
    background: var(--ae-paper); border: 1px dashed var(--ae-line-2); border-radius: var(--ae-radius-lg);
}
.ae-empty strong { display: block; font-size: 18px; color: var(--ae-ink); margin-bottom: 8px; }
.ae-empty p { font-size: 14px; color: var(--ae-muted); margin-bottom: 18px; }

/* 分页 */
.ae-pager { margin-top: 34px; display: flex; justify-content: center; }
.ae-pager .page-control { display: inline-block; }
.ae-pager .pagination { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.ae-pager .pagination .page-item > span,
.ae-pager .pagination .page-item > a {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 40px; height: 40px; padding: 0 14px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius);
    color: var(--ae-text); font-size: 14px;
    transition: all .25s var(--ae-ease);
}
.ae-pager .pagination .page-item > a:hover {
    border-color: var(--ae-field); color: var(--ae-field);
}
.ae-pager .pagination .page-item.active > a,
.ae-pager .pagination .page-item > span {
    background: var(--ae-ink); border-color: var(--ae-ink); color: var(--ae-glow); font-weight: 700;
}

/* ---------- 文章详情 ---------- */
.ae-article {
    padding: 30px 32px 34px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
}
.ae-article-cat {
    display: inline-block;
    padding: 4px 12px; margin-bottom: 14px;
    background: var(--ae-field-soft); color: var(--ae-field);
    border-radius: 4px; font-size: 12.5px; font-weight: 600; letter-spacing: .05em;
}
.ae-article h1 {
    font-size: 30px; line-height: 1.4; margin-bottom: 16px; letter-spacing: -.3px;
}
.ae-article-meta {
    display: flex; flex-wrap: wrap; gap: 20px;
    padding: 12px 0 16px; margin-bottom: 22px;
    border-bottom: 1px dashed var(--ae-line);
    font-size: 13px; color: var(--ae-muted);
}
.ae-article-meta em { font-style: normal; color: var(--ae-sunset); font-weight: 700; }
.ae-abstract {
    padding: 14px 18px; margin-bottom: 22px;
    background: var(--ae-paper); border-left: 3px solid var(--ae-sunset);
    font-size: 14px; color: var(--ae-text); line-height: 1.85; border-radius: 4px;
}
.ae-abstract strong { color: var(--ae-ink); }

/* 正文排版 */
.ae-content { font-size: 15.5px; line-height: 1.95; color: var(--ae-text); word-break: break-word; }
.ae-content p { margin: 0 0 18px; }
.ae-content h2 { font-size: 22px; margin: 32px 0 16px; padding-left: 14px; border-left: 4px solid var(--ae-field); }
.ae-content h3 { font-size: 18px; margin: 26px 0 12px; }
.ae-content h4 { font-size: 16px; margin: 20px 0 10px; color: var(--ae-ink-2); }
.ae-content a { color: var(--ae-field); border-bottom: 1px dashed var(--ae-field); }
.ae-content a:hover { color: var(--ae-field-deep); border-bottom-style: solid; }
.ae-content img {
    display: block; margin: 20px auto; max-width: 100%; height: auto;
    border-radius: 6px; box-shadow: var(--ae-shadow-sm);
}
.ae-content ul, .ae-content ol { padding-left: 24px; margin: 0 0 18px; }
.ae-content ul li { list-style: disc; margin-bottom: 6px; }
.ae-content ol li { list-style: decimal; margin-bottom: 6px; }
.ae-content blockquote {
    margin: 22px 0; padding: 16px 20px;
    background: var(--ae-field-soft); border-left: 4px solid var(--ae-field);
    color: var(--ae-text); font-size: 15px; line-height: 1.9;
}
.ae-content blockquote p:last-child { margin-bottom: 0; }
.ae-content table {
    width: 100%; margin: 20px 0; border-collapse: collapse; font-size: 14px;
}
.ae-content th, .ae-content td { border: 1px solid var(--ae-line); padding: 10px 12px; text-align: left; }
.ae-content th { background: var(--ae-paper); font-weight: 600; }
.ae-content pre {
    background: var(--ae-ink); color: #e5e7eb; padding: 16px; border-radius: 6px;
    overflow-x: auto; font-size: 13px;
}

/* 文章标签 */
.ae-article-tags {
    display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
    margin-top: 26px; padding-top: 20px; border-top: 1px dashed var(--ae-line);
}
.ae-article-tags > span { font-size: 13px; color: var(--ae-muted); }
.ae-article-tags a {
    padding: 4px 12px; font-size: 12.5px;
    background: var(--ae-paper); color: var(--ae-text);
    border: 1px solid var(--ae-line); border-radius: 999px;
}
.ae-article-tags a:hover { background: var(--ae-field); border-color: var(--ae-field); color: #fff; }
.ae-pages { margin-top: 24px; }

/* 上一篇/下一篇 */
.ae-neighbor {
    display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px;
}
.ae-neighbor a {
    padding: 16px 20px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
    transition: all .25s var(--ae-ease);
    display: flex; flex-direction: column; gap: 6px; min-width: 0;
}
.ae-neighbor a:hover { border-color: var(--ae-field); box-shadow: var(--ae-shadow-sm); }
.ae-neighbor a.next { text-align: right; align-items: flex-end; }
.ae-neighbor span { font-size: 12.5px; color: var(--ae-muted); letter-spacing: .1em; }
.ae-neighbor strong {
    font-size: 14.5px; color: var(--ae-ink); font-weight: 600; line-height: 1.5;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* 相关推荐 */
.ae-related { margin-top: 44px; }
.ae-related-head {
    display: flex; align-items: baseline; justify-content: space-between; gap: 20px;
    padding-bottom: 10px; margin-bottom: 20px;
    border-bottom: 2px solid var(--ae-ink);
}
.ae-related-head h2 { font-size: 20px; }
.ae-related-head h2 small { font-size: 11px; color: var(--ae-muted); letter-spacing: .18em; margin-left: 6px; font-weight: 500; }
.ae-related-head a { font-size: 13.5px; color: var(--ae-field); font-weight: 600; }
.ae-related-grid { display: flex; flex-direction: column; gap: 16px; }

/* ---------- 图集 ---------- */
.ae-gallery-stage {
    position: relative; overflow: hidden;
    border-radius: var(--ae-radius-lg); background: var(--ae-ink);
    margin-bottom: 18px;
}
.ae-gallery-stage img {
    width: 100%; height: auto; display: block; object-fit: contain;
    max-height: 640px;
}
.ae-gallery-cap {
    position: absolute; inset: auto 0 0 0;
    padding: 16px 22px;
    background: linear-gradient(180deg, transparent, rgba(15, 20, 32, .85));
    color: #fff; display: flex; flex-direction: column; gap: 4px;
}
.ae-gallery-cap strong { font-size: 16px; color: #fff; }
.ae-gallery-cap span { font-size: 12.5px; opacity: .8; letter-spacing: .06em; }
.ae-gallery-thumbs {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px;
    margin: 20px 0 10px;
}
.ae-thumb {
    position: relative; aspect-ratio: 4/3;
    border: 2px solid transparent; border-radius: 6px; overflow: hidden;
    background: var(--ae-paper);
    transition: all .25s var(--ae-ease);
}
.ae-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ae-thumb span {
    position: absolute; right: 6px; bottom: 6px;
    padding: 1px 6px; border-radius: 3px;
    background: rgba(15, 20, 32, .7); color: #fff;
    font-size: 11px;
}
.ae-thumb:hover { border-color: var(--ae-sunset); }
.ae-thumb.is-active { border-color: var(--ae-field); }
.ae-gallery-desc { margin-top: 20px; }

/* ---------- 单页（About 等） ---------- */
.ae-single {
    padding: 30px 32px 34px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
    font-size: 15.5px; line-height: 1.95; color: var(--ae-text);
}
.ae-single h2 {
    font-size: 22px; margin: 28px 0 16px; padding-left: 14px;
    border-left: 4px solid var(--ae-field); color: var(--ae-ink);
}
.ae-single h2:first-of-type { margin-top: 8px; }
.ae-lead {
    padding: 16px 20px; margin-bottom: 20px;
    background: linear-gradient(90deg, var(--ae-field-soft), #fff);
    border-left: 3px solid var(--ae-field); border-radius: 4px;
    color: var(--ae-text);
}

.ae-feature-grid {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 18px 0 24px;
}
.ae-feature {
    padding: 20px;
    background: var(--ae-paper); border-radius: var(--ae-radius);
    border: 1px solid var(--ae-line);
}
.ae-feature h3 { font-size: 15.5px; margin-bottom: 8px; color: var(--ae-ink); }
.ae-feature h3::before {
    content: "◆ "; color: var(--ae-sunset); margin-right: 4px;
}
.ae-feature p { font-size: 13.5px; color: var(--ae-muted); line-height: 1.85; }

.ae-check-list { margin: 12px 0 20px; }
.ae-check-list li {
    position: relative; padding: 8px 0 8px 28px;
    border-bottom: 1px dashed var(--ae-line);
    font-size: 14.5px;
}
.ae-check-list li:last-child { border-bottom: 0; }
.ae-check-list li::before {
    content: "✓"; position: absolute; left: 6px; top: 8px;
    width: 18px; height: 18px; border-radius: 50%;
    background: var(--ae-field); color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 700;
}

.ae-contact-grid {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 12px;
}
.ae-contact-card {
    padding: 18px 20px;
    background: var(--ae-paper); border: 1px solid var(--ae-line); border-radius: var(--ae-radius);
    display: flex; flex-direction: column; gap: 6px;
}
.ae-contact-card strong { font-size: 12.5px; color: var(--ae-muted); letter-spacing: .1em; }
.ae-contact-card span, .ae-contact-card a { font-size: 16px; color: var(--ae-ink); font-weight: 600; }
.ae-contact-card a:hover { color: var(--ae-field); }

/* ---------- 标签页 ---------- */
.ae-tag-panel {
    padding: 26px 26px 24px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
}
.ae-tag-panel h2 { font-size: 20px; margin-bottom: 8px; }
.ae-tag-panel .ae-tip { font-size: 13px; color: var(--ae-muted); margin-bottom: 18px; }
.ae-tag-filter {
    display: flex; flex-wrap: wrap; gap: 8px;
    padding-bottom: 18px; margin-bottom: 18px;
    border-bottom: 1px dashed var(--ae-line);
}

.ae-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 14px;
    background: var(--ae-paper); color: var(--ae-text);
    border: 1px solid var(--ae-line); border-radius: 999px;
    font-size: 13px;
    transition: all .25s var(--ae-ease);
}
.ae-chip:hover { background: var(--ae-field); color: #fff; border-color: var(--ae-field); }
.ae-chip.is-active { background: var(--ae-ink); color: var(--ae-glow); border-color: var(--ae-ink); }
.ae-chip em {
    font-style: normal; padding: 1px 6px; border-radius: 3px;
    background: rgba(15, 20, 32, .06); font-size: 11px; color: var(--ae-muted);
}
.ae-chip:hover em, .ae-chip.is-active em { background: rgba(255, 255, 255, .18); color: #fff; }

.ae-cloud { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- 搜索页 ---------- */
.ae-searchbox {
    padding: 24px 26px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
}
.ae-searchbox form {
    display: flex; gap: 12px; align-items: stretch;
}
.ae-searchbox input {
    flex: 1; min-width: 0; padding: 12px 18px;
    border: 1px solid var(--ae-line-2); border-radius: var(--ae-radius);
    font-size: 15px; outline: none;
    transition: border-color .2s;
}
.ae-searchbox input:focus { border-color: var(--ae-field); box-shadow: 0 0 0 3px rgba(14, 140, 95, .12); }
.ae-searchbox .ae-btn { padding: 0 24px; }
.ae-searchbox .ae-hint {
    margin-top: 12px; font-size: 12.5px; color: var(--ae-muted);
}

.ae-cat-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
    margin-top: 16px;
}
.ae-cat-grid > li > a {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px;
    padding: 16px 18px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
    transition: all .25s var(--ae-ease);
}
.ae-cat-grid > li > a:hover { border-color: var(--ae-field); box-shadow: var(--ae-shadow-sm); }
.ae-cat-grid strong { display: block; font-size: 15.5px; color: var(--ae-ink); margin-bottom: 4px; }
.ae-cat-grid span { display: block; font-size: 12.5px; color: var(--ae-muted); line-height: 1.7; }
.ae-cat-grid em {
    font-style: normal; color: var(--ae-field); font-size: 18px;
    transition: transform .25s var(--ae-ease);
}
.ae-cat-grid > li > a:hover em { transform: translateX(4px); }

/* ---------- 404 ---------- */
.ae-404 {
    padding: 90px 0;
    background:
        linear-gradient(180deg, rgba(247, 244, 238, .95), #fff 70%),
        repeating-linear-gradient(45deg, transparent 0 12px, rgba(14,140,95,.05) 12px 24px);
}
.ae-404-in {
    display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: center;
}
.ae-404-main { color: var(--ae-text); }
.ae-404-code {
    font-size: 96px; font-weight: 800; color: var(--ae-ink); line-height: 1;
    letter-spacing: -4px; margin-bottom: 12px;
}
.ae-404-code i {
    font-style: normal; color: var(--ae-sunset);
    -webkit-text-stroke: 2px var(--ae-sunset); color: transparent;
}
.ae-404 h1 { font-size: 28px; margin-bottom: 12px; }
.ae-404 p { font-size: 14.5px; line-height: 1.9; color: var(--ae-muted); margin-bottom: 22px; max-width: 620px; }
.ae-404-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ae-404-panel {
    padding: 24px;
    background: #fff; border: 1px solid var(--ae-line); border-radius: var(--ae-radius-lg);
    box-shadow: var(--ae-shadow-sm);
}
.ae-404-panel h2 { font-size: 16px; margin-bottom: 12px; }
.ae-404-panel form {
    display: flex; gap: 8px; margin-bottom: 20px;
}
.ae-404-panel input {
    flex: 1; min-width: 0; padding: 10px 14px;
    border: 1px solid var(--ae-line-2); border-radius: var(--ae-radius);
    font-size: 14px; outline: none;
}
.ae-404-panel input:focus { border-color: var(--ae-field); }
.ae-404-links li { padding: 10px 0; border-bottom: 1px dashed var(--ae-line); }
.ae-404-links li:last-child { border-bottom: 0; }
.ae-404-links a {
    display: flex; gap: 10px; align-items: baseline;
    font-size: 13.5px; color: var(--ae-text);
}
.ae-404-links a:hover { color: var(--ae-field); }
.ae-404-links em {
    font-style: normal; color: var(--ae-sunset); font-weight: 700; font-size: 12px;
    min-width: 20px;
}

/* ---------- 组件示例页 ---------- */
.ae-demo { padding: 60px 20px 80px; }
.ae-demo-sec {
    padding: 24px 0;
    border-bottom: 1px dashed var(--ae-line);
}
.ae-demo-sec:last-child { border-bottom: 0; }
.ae-demo-sec > h2 {
    font-size: 22px; margin-bottom: 18px;
    padding-left: 14px; border-left: 4px solid var(--ae-field);
}
.ae-demo-sec h3 { font-size: 17px; margin: 12px 0 8px; }
.ae-demo-sec h4 { font-size: 15px; color: var(--ae-ink-2); margin: 8px 0 6px; }
.ae-demo-sec p { font-size: 14.5px; color: var(--ae-text); line-height: 1.9; margin-bottom: 12px; }
.ae-demo-row { display: flex; flex-wrap: wrap; gap: 12px; }
.ae-demo-figure { margin: 12px 0 18px; }
.ae-demo-figure img { display: block; width: 100%; border-radius: var(--ae-radius-lg); }
.ae-demo-figure figcaption { margin-top: 8px; font-size: 12.5px; color: var(--ae-muted); text-align: center; }
.ae-demo-split {
    display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: center;
    margin: 20px 0;
}
.ae-demo-split img { width: 100%; border-radius: var(--ae-radius-lg); }
.ae-demo-stats {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 14px;
}
.ae-demo-stat {
    padding: 20px;
    background: var(--ae-paper); border: 1px solid var(--ae-line); border-radius: var(--ae-radius);
    text-align: center;
}
.ae-demo-stat strong {
    display: block; font-size: 26px; color: var(--ae-ink); font-weight: 800; letter-spacing: -.5px;
}
.ae-demo-stat strong i { font-style: normal; color: var(--ae-sunset); font-size: 15px; margin-left: 2px; }
.ae-demo-stat span { display: block; margin-top: 6px; font-size: 12.5px; color: var(--ae-muted); }

/* ---------- 响应式（内页） ---------- */
@media (max-width: 1024px) {
    .ae-layout { grid-template-columns: 1fr; gap: 32px; padding-top: 40px; padding-bottom: 60px; }
    .ae-side { order: 2; }
    .ae-post { grid-template-columns: 220px 1fr; padding: 16px; }
    .ae-banner h1 { font-size: 32px; }
    .ae-404-in { grid-template-columns: 1fr; }
    .ae-neighbor { grid-template-columns: 1fr; }
    .ae-demo-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
    .ae-banner { padding: 60px 0 44px; }
    .ae-banner h1 { font-size: 26px; }
    .ae-banner-sub { font-size: 14px; }
    .ae-article { padding: 20px 18px 24px; }
    .ae-article h1 { font-size: 22px; }
    .ae-article-meta { gap: 12px; font-size: 12.5px; }
    .ae-post { grid-template-columns: 1fr; padding: 14px; }
    .ae-post-media { aspect-ratio: 16/9; }
    .ae-post-body h3 { font-size: 16px; }
    .ae-list-head h2 { font-size: 18px; }
    .ae-feature-grid, .ae-contact-grid { grid-template-columns: 1fr; }
    .ae-cat-grid { grid-template-columns: 1fr; }
    .ae-searchbox form { flex-direction: column; }
    .ae-searchbox .ae-btn { padding: 12px 20px; }
    .ae-404-code { font-size: 72px; }
    .ae-demo-split { grid-template-columns: 1fr; }
    .ae-demo-stats { grid-template-columns: 1fr 1fr; }
    .ae-gallery-thumbs { grid-template-columns: repeat(3, 1fr); }
    .ae-thumb span { font-size: 10px; }
}