@charset "utf-8";
/* ===== Extensions added for the PbootCMS build ===== */

/* Hero: layered slide images instead of the single Unsplash background */
.hero::before { background: none; }
.hero::after { background: linear-gradient(135deg, rgba(26,58,92,.60) 0%, rgba(26,58,92,.28) 100%); }
.hero-slides { position: absolute; inset: 0; overflow: hidden; }
.hero-slide {
  position: absolute; inset: 0; background-size: cover; background-position: center;
  opacity: 0; animation: heroFade 18s linear infinite;
}
.hero-slide:nth-child(2) { animation-delay: 6s; }
.hero-slide:nth-child(3) { animation-delay: 12s; }
@keyframes heroFade {
  0% { opacity: 0; }
  5% { opacity: .72; }
  30% { opacity: .72; }
  36% { opacity: 0; }
  100% { opacity: 0; }
}
.hero-badge {
  display: inline-block; padding: 6px 16px; border-radius: 99px; margin-bottom: 20px;
  background: rgba(232,119,34,.14); border: 1px solid rgba(232,119,34,.5);
  color: #ffb37a; font-size: 13px; font-weight: 600; letter-spacing: .3px;
}

/* Inner page banner uses the column cover image, with a sane fallback */
.page-banner::before { background: var(--pb-img, url('/static/upload/image/gti/banners/default.jpg')) center/cover; }

/* Section / grid helpers */
.section-more { text-align: center; margin-top: 40px; }
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.news-card--grid { display: block; margin-bottom: 0; }
.news-card--grid .news-card-img { height: 200px; min-height: 0; }
.news-card--grid .news-card-body { padding: 24px; }

/* Product filter sidebar */
.filter-list--plain li { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text-muted); }
.filter-list--plain li::before { content: '\2713'; color: var(--accent); font-weight: 700; }
.filter-link { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 14px; color: var(--text); padding: 9px 12px; border-radius: 6px; }
.filter-link:hover { background: var(--bg-gray); color: var(--primary); }
.filter-link.active { background: var(--primary); color: #fff; }
.filter-link.active .count { color: rgba(255,255,255,.75); }
.sidebar-cta { background: linear-gradient(135deg, var(--primary-dark), var(--primary)); border-color: transparent; }
.sidebar-cta h3 { color: #fff; border-bottom-color: rgba(255,255,255,.3); }
.sidebar-cta p { font-size: 14px; color: rgba(255,255,255,.82); margin-bottom: 16px; }
.product-card-cat { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--accent); margin-bottom: 6px; }
.products-toolbar .toolbar-cta { font-size: 14px; font-weight: 700; color: var(--accent); }
.products-toolbar .toolbar-cta:hover { color: var(--accent-dark); }

/* Product detail page */
.page-top { padding-top: 120px; }
.breadcrumb--dark { color: var(--text-muted); font-size: 14px; margin-bottom: 28px; }
.breadcrumb--dark a { color: var(--primary); font-weight: 600; }
.breadcrumb--dark a:hover { color: var(--accent); }
.breadcrumb--dark span { color: var(--text-muted); }
.tab-title { color: var(--primary); font-size: 18px; font-weight: 700; margin: 0 0 16px; }
.spec-list { list-style: disc; padding-left: 22px; line-height: 2; color: var(--text-muted); margin-bottom: 28px; }
.spec-note { margin-top: 16px; color: var(--text-muted); }
.product-tabs .tab-content { line-height: 1.9; }

/* Article / news detail */
.article-body { color: var(--text-muted); line-height: 1.9; }
.article-body h2, .article-body h3, .article-body h4 { color: var(--primary); margin: 22px 0 12px; }
.article-body p { margin-bottom: 14px; }
.article-body ul, .article-body ol { padding-left: 22px; margin-bottom: 14px; }
.article-body img { border-radius: var(--radius); margin: 16px 0; }
.article-meta { display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; color: var(--text-muted); margin: 14px 0 26px; }
.article-meta .category { color: var(--accent); font-weight: 700; }
.article-back { margin-top: 36px; }
.news-detail { padding: 60px 0; }
.news-detail h1 { font-size: 30px; font-weight: 800; line-height: 1.35; color: var(--primary); }

/* About page */
.about-hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.about-hero-text h2 { font-size: 34px; font-weight: 800; line-height: 1.3; color: var(--primary); margin: 12px 0 20px; }
.contact-extra { max-width: 900px; margin: 0 auto; }

/* FAQ page */
.faq-list { max-width: 900px; margin: 0 auto; }
.faq-list .faq-item { margin-bottom: 14px; }
.faq-question { font-weight: 600; color: var(--primary); }

/* Search / pagination / 404 */
.search-box--inline { display: flex; gap: 10px; width: 100%; }
.search-box--inline input { flex: 1; }
.pagination-empty { text-align: center; color: var(--text-muted); padding: 40px 0; }
.error-banner { height: 260px; }
.error-body { text-align: center; }
.error-body p { font-size: 17px; color: var(--text-muted); margin-bottom: 24px; }

@media (max-width: 992px) {
  .news-grid, .about-hero-grid { grid-template-columns: 1fr; }
  .news-card--grid .news-card-img { height: 220px; }
}

/* reduced-motion 静态兜底：系统开启「减少动画」时静止展示首张 banner，避免 hero 空白 */
@media (prefers-reduced-motion: reduce) {
  .hero-slide { animation: none; }
  .hero-slide:nth-child(1) { opacity: .72; }
  .hero-slide:nth-child(n+2) { display: none; }
}