/* 唐山凯捷脱硫石膏 - 前台样式（主色深蓝） */
:root{--primary:#0b4f8a;--primary-dark:#0b3a66;--accent:#f0a500;--text:#1f2937;--muted:#6b7280;--line:#e5e7eb;--bg-soft:#f3f6fa}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.75;color:var(--text);background:#fff;overflow-x:hidden}
img{max-width:100%;height:auto;vertical-align:middle;border:0}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--accent)}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}
.center{text-align:center}

/* 页头 */
.site-header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.header-inner{display:flex;align-items:center;min-height:80px;gap:20px}
.brand{display:flex;align-items:center;gap:10px;color:var(--primary-dark);flex-shrink:0}
.brand-logo{width:52px;height:52px}
.brand-text strong{display:block;font-size:18px;line-height:1.3}
.brand-text small{display:block;color:var(--muted);font-size:12px}
.site-nav{margin-left:auto}
.site-nav ul{display:flex;list-style:none;margin:0;padding:0}
.site-nav a{display:block;padding:0 16px;line-height:80px;color:var(--text);font-size:16px;position:relative}
.site-nav li.active a,.site-nav a:hover{color:var(--primary)}
.site-nav li.active a:after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:3px;background:var(--primary)}
.header-hotline{display:flex;flex-direction:column;align-items:flex-end;color:var(--primary-dark);flex-shrink:0;line-height:1.3}
.header-hotline span{font-size:12px;color:var(--muted)}
.header-hotline strong{font-size:20px;color:var(--primary)}
.nav-hotline{display:none}
.nav-toggle{display:none;margin-left:auto;width:42px;height:42px;border:0;background:transparent;cursor:pointer;padding:9px}
.nav-toggle span{display:block;height:3px;margin:5px 0;background:var(--primary-dark);border-radius:2px;transition:.2s}
.nav-open .nav-toggle span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav-open .nav-toggle span:nth-child(2){opacity:0}
.nav-open .nav-toggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* 轮播 */
.banner{position:relative;height:520px;overflow:hidden;background:var(--primary-dark)}
.banner-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity .8s;display:flex;align-items:center}
.banner-slide.active{opacity:1;z-index:1}
.banner-default{background:linear-gradient(135deg,#0b3a66,#1d6fb8)}
.banner-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.banner-link{position:absolute;inset:0;z-index:1}
.banner-caption{color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.35);position:relative;pointer-events:none}
.banner-caption h2{font-size:44px;margin:0 0 10px;letter-spacing:2px}
.banner-caption p{font-size:20px;margin:0}
.banner-arrow{position:absolute;top:50%;z-index:3;width:44px;height:44px;margin-top:-22px;border:0;border-radius:50%;background:rgba(0,0,0,.3);color:#fff;font-size:30px;line-height:40px;cursor:pointer}
.banner-arrow:hover{background:rgba(0,0,0,.55)}
.banner-arrow.prev{left:20px}
.banner-arrow.next{right:20px}
@media (max-width:1340px){.banner-caption{padding-left:76px;padding-right:76px}}
.banner-dots{position:absolute;left:0;right:0;bottom:20px;z-index:3;text-align:center}
.banner-dots button{width:12px;height:12px;margin:0 5px;border:0;border-radius:50%;background:rgba(255,255,255,.5);cursor:pointer;padding:0}
.banner-dots button.active{background:#fff;width:28px;border-radius:6px}

/* 首页区块 */
.home-section{padding:64px 0}
.home-section:nth-of-type(even){background:var(--bg-soft)}
.section-title{text-align:center;margin-bottom:32px}
.section-title h2{margin:0;font-size:30px;color:var(--primary-dark)}
.section-title .en{margin:4px 0 0;color:var(--muted);text-transform:uppercase;letter-spacing:2px;font-size:14px}
.section-title:after{content:"";display:block;width:48px;height:3px;background:var(--primary);margin:12px auto 0}
.two-col{display:flex;gap:40px;align-items:center}
.two-col.reverse{flex-direction:row-reverse}
.two-col>*{flex:1;min-width:0}
.two-col .section-title{text-align:left}
.two-col .section-title:after{margin-left:0}
.col-media img{width:100%;border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.lead{font-size:16px;color:#374151}
.btn-more{display:inline-block;margin-top:16px;padding:8px 28px;border:1px solid var(--primary);color:var(--primary);border-radius:20px}
.btn-more:hover{background:var(--primary);color:#fff}
.btn-more.light{border-color:#fff;color:#fff}
.btn-more.light:hover{background:#fff;color:var(--primary)}
.btn-primary{display:inline-block;padding:10px 28px;background:var(--primary);color:#fff;border-radius:4px}
.btn-primary:hover{background:var(--primary-dark);color:#fff}
.empty-tip{text-align:center;color:var(--muted);padding:30px 0}
.culture-list,.rd-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.culture-list li,.rd-list li{background:#fff;border-radius:6px;padding:18px;box-shadow:0 2px 10px rgba(0,0,0,.05)}
.culture-list strong,.rd-list strong{color:var(--primary);font-size:17px}
.culture-slogan{text-align:center;font-size:22px;color:var(--primary-dark);font-weight:bold;margin-top:24px}
.home-rd .rd-list{grid-template-columns:1fr}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.gallery-grid figure{margin:0;background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.gallery-grid img{width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery-grid figcaption{padding:8px;text-align:center;color:#374151}
.card-grid{display:grid;gap:20px}
.card-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.card-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.card{display:block;background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;color:var(--text);transition:.2s}
.card:hover{box-shadow:0 8px 24px rgba(0,0,0,.1);transform:translateY(-3px);color:var(--primary)}
.card-img{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--bg-soft)}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-title{display:block;padding:12px 12px 4px;font-weight:bold;text-align:center}
.card-desc{display:block;padding:0 12px 12px;font-size:13px;color:var(--muted);text-align:center}
.news-brief{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.news-brief li{min-width:0}
.news-brief a{display:flex;gap:16px;background:#fff;padding:16px;border-radius:6px;color:var(--text);box-shadow:0 2px 10px rgba(0,0,0,.05)}
.news-brief .date{flex-shrink:0;width:72px;text-align:center;color:var(--muted);font-size:13px;border-right:1px solid var(--line)}
.news-brief .date strong{display:block;font-size:28px;color:var(--primary);line-height:1.2}
.news-brief .text{min-width:0}
.news-brief .title{display:block;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.news-brief .summary{display:block;color:var(--muted);font-size:13px}
.home-contact{background:linear-gradient(135deg,#0b3a66,#1d6fb8)!important;color:#fff}
.home-contact .section-title h2,.home-contact .section-title .en{color:#fff}
.home-contact .section-title:after{background:#fff}
.contact-info{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.contact-info li{display:flex;gap:10px;align-items:baseline;word-break:break-all}
.contact-info .label{flex-shrink:0;display:inline-block;padding:0 10px;background:var(--primary);color:#fff;border-radius:3px;font-size:13px}
.home-contact .contact-info a,.home-contact .contact-info span{color:#fff}
.home-contact .contact-info .label{background:rgba(255,255,255,.2)}

/* 内页 */
.inner-banner{height:200px;display:flex;align-items:center;background:linear-gradient(120deg,rgba(11,58,102,.92),rgba(29,111,184,.85)),url('../images/demo/banner-2.svg') center/cover;color:#fff}
.inner-banner h1{margin:0;font-size:32px;letter-spacing:2px}
.breadcrumb{border-bottom:1px solid var(--line);background:#fafbfc;font-size:14px;color:var(--muted);line-height:46px}
.breadcrumb .container{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.breadcrumb .sep{margin:0 6px}
.breadcrumb a{color:var(--muted)}
.breadcrumb a:hover{color:var(--primary)}
.breadcrumb .current{color:var(--text)}
.inner-page{padding:40px 16px 60px}
.filter-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.filter-tabs a{padding:6px 18px;border:1px solid var(--line);border-radius:18px;color:var(--text)}
.filter-tabs a.active,.filter-tabs a:hover{background:var(--primary);border-color:var(--primary);color:#fff}
.about-block{margin-bottom:48px;scroll-margin-top:90px}
.about-body.has-cover{display:flex;gap:32px;align-items:flex-start}
.about-cover{width:40%;flex-shrink:0;border-radius:6px}
.about-text{flex:1;min-width:0}
.rich-text{word-wrap:break-word}
.rich-text img{max-width:100%;height:auto}
.rich-text table{border-collapse:collapse;width:100%;margin:12px 0}
.rich-text th,.rich-text td{border:1px solid var(--line);padding:8px 12px;text-align:left}
.rich-text th{background:var(--bg-soft);width:36%;font-weight:normal;color:#374151}
.rich-text h3{color:var(--primary-dark);border-left:4px solid var(--primary);padding-left:10px;margin:24px 0 12px;font-size:18px}
.pager{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-top:36px}
.pager a,.pager span{display:inline-block;min-width:36px;padding:4px 10px;border:1px solid var(--line);border-radius:3px;text-align:center;color:var(--text)}
.pager a:hover{border-color:var(--primary);color:var(--primary)}
.pager .current{background:var(--primary);border-color:var(--primary);color:#fff}
.pager .disabled{color:#c0c4cc}
.pager .pager-info{border:0;color:var(--muted)}
.news-list{list-style:none;margin:0;padding:0}
.news-list li{display:flex;gap:24px;padding:20px 0;border-bottom:1px dashed var(--line)}
.news-thumb{flex-shrink:0;width:220px}
.news-thumb img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.news-text{min-width:0}
.news-text h3{margin:0 0 6px;font-size:18px}
.news-text h3 a{color:var(--text)}
.news-text h3 a:hover{color:var(--primary)}
.news-text .meta{margin:0;color:var(--muted);font-size:13px}
.news-text .summary{margin:6px 0 0;color:#4b5563}
.tag{display:inline-block;margin-right:6px;padding:0 6px;font-size:12px;line-height:20px;background:#ef4444;color:#fff;border-radius:3px;vertical-align:2px}
.article h1{font-size:26px;text-align:center;margin:0 0 10px;color:var(--primary-dark)}
.article .meta{text-align:center;color:var(--muted);font-size:13px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:24px}
.article .meta span{margin:0 10px;display:inline-block}
.prev-next{margin-top:36px;padding-top:16px;border-top:1px solid var(--line);color:var(--muted)}
.prev-next p{margin:6px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.product-head{display:flex;gap:40px;margin-bottom:36px}
.product-gallery{width:46%;flex-shrink:0}
.product-main{width:100%;border:1px solid var(--line);border-radius:6px;cursor:zoom-in}
.thumbs{display:flex;gap:10px;margin-top:10px}
.thumbs img{width:80px;height:60px;object-fit:cover;border:1px solid var(--line);border-radius:4px;cursor:zoom-in}
.product-info{flex:1;min-width:0}
.product-info h1{margin:0 0 10px;font-size:28px;color:var(--primary-dark)}
.product-info .meta{color:var(--muted)}
.product-info .summary{font-size:16px;color:#374151;margin-bottom:24px}
.detail-subtitle{font-size:20px;color:var(--primary-dark);border-bottom:2px solid var(--primary);padding-bottom:8px;margin:0 0 16px}
.related{margin-top:40px}
.case-images{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:20px}
.case-images img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;cursor:zoom-in}
.back-link{margin-top:24px}
.contact-company{color:var(--primary-dark);margin-top:0}
.contact-page .contact-info{grid-template-columns:1fr}
.map-note{color:var(--muted);margin-top:20px}
.not-found{text-align:center;padding:80px 16px}
.not-found .code{font-size:96px;font-weight:bold;color:var(--primary);margin:0;line-height:1}
[data-zoom]{cursor:zoom-in}
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;padding:20px;cursor:zoom-out}
.lightbox img{max-width:100%;max-height:100%;box-shadow:0 0 30px rgba(0,0,0,.5)}

/* 页脚 */
.site-footer{background:#0f1f33;color:#aeb8c6;padding:36px 0 20px;font-size:14px}
.site-footer a{color:#cfd8e3}
.site-footer a:hover{color:#fff}
.footer-nav{display:flex;flex-wrap:wrap;gap:8px 24px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:16px}
.footer-contact p,.footer-copy p{margin:4px 0}
.footer-copy{margin-top:16px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);font-size:13px}
.footer-sep{margin-left:16px}

/* 响应式 */
@media (max-width:1240px){
    .site-nav a{padding:0 12px}
    .site-nav li.active a:after{left:12px;right:12px}
    .brand-text strong{font-size:16px}
}
@media (max-width:1100px){
    .brand-text small{display:none}
    .header-hotline{display:none}
}
@media (max-width:900px){
    .header-inner{min-height:64px;flex-wrap:wrap;gap:0}
    .brand-logo{width:42px;height:42px}
    .brand-text strong{font-size:16px}
    .nav-toggle{display:block}
    .site-nav{display:none;width:100%;margin:0;border-top:1px solid var(--line)}
    .nav-open .site-nav{display:block}
    .site-nav ul{flex-direction:column}
    .site-nav a{line-height:48px;padding:0 4px;border-bottom:1px solid var(--line)}
    .site-nav li.active a:after{display:none}
    .site-nav li.active a{background:var(--bg-soft);padding-left:12px;border-left:3px solid var(--primary)}
    .nav-hotline{display:block}
    .nav-hotline a{color:var(--primary);font-weight:bold}
    .banner{height:360px}
    .banner-caption{padding:0 76px}
    .banner-caption h2{font-size:30px}
    .banner-caption p{font-size:16px}
    .card-grid.cols-4{grid-template-columns:repeat(2,1fr)}
    .card-grid.cols-3{grid-template-columns:repeat(2,1fr)}
    .gallery-grid{grid-template-columns:repeat(2,1fr)}
    .two-col,.two-col.reverse,.product-head,.about-body.has-cover{flex-direction:column;gap:24px}
    .product-gallery,.about-cover{width:100%}
    .news-brief{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:600px){
    body{font-size:14px}
    .brand{min-width:0;flex-shrink:1}
    .brand-text{min-width:0}
    .brand-text strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .banner{height:240px}
    .banner-caption h2{font-size:22px}
    .banner-arrow{display:none}
    .banner-caption{padding:0 16px}
    .home-section{padding:40px 0}
    .section-title h2{font-size:24px}
    .card-grid.cols-3{grid-template-columns:1fr}
    .card-grid.cols-4{grid-template-columns:repeat(2,1fr);gap:12px}
    .inner-banner{height:130px}
    .inner-banner h1{font-size:24px}
    .news-list li{flex-direction:column;gap:10px}
    .news-thumb{width:100%}
    .footer-sep{display:block;margin:0}
}

/* 在线留言 */
.message-section{margin-top:48px;padding-top:8px;scroll-margin-top:100px}
.message-intro{color:var(--muted);margin:0 0 18px}
.message-intro em,.msg-field label em{color:#dc2626;font-style:normal}
.message-form{background:var(--bg-soft);border:1px solid var(--line);border-radius:6px;padding:24px}
.msg-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px}
.msg-field-wide{grid-column:1/-1}
.msg-field label{display:block;margin-bottom:6px;color:#374151;font-size:14px}
.msg-field input,.msg-field textarea{width:100%;box-sizing:border-box;padding:9px 12px;border:1px solid #cbd5e1;border-radius:4px;font:inherit;font-size:15px;background:#fff;color:var(--text)}
.msg-field textarea{resize:vertical;min-height:130px;line-height:1.6}
.msg-field input:focus,.msg-field textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(11,79,138,.12)}
.msg-field .is-invalid{border-color:#dc2626}
.msg-error{margin:4px 0 0;color:#dc2626;font-size:13px}
.msg-counter{margin:4px 0 0;font-size:12px;color:var(--muted);text-align:right}
.msg-counter.over{color:#dc2626}
.msg-captcha{display:flex;gap:10px;align-items:center}
.msg-captcha input{flex:1;min-width:0}
.msg-captcha img{flex-shrink:0;border:1px solid var(--line);border-radius:4px;cursor:pointer;background:#fff}
.msg-actions{margin-top:20px}
.msg-actions .btn-primary{border:0;font-size:16px;cursor:pointer}
.msg-actions .btn-primary:disabled{opacity:.6;cursor:not-allowed}
.msg-alert{padding:12px 16px;border-radius:4px;margin-bottom:16px;border:1px solid transparent}
.msg-alert-success{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}
.msg-alert-error{background:#fef2f2;border-color:#fecaca;color:#991b1b}
@media (max-width:600px){
    .msg-grid{grid-template-columns:1fr}
    .message-form{padding:16px}
}
