@charset "utf-8";
/* =====================================================================
   飒西颂餐饮管理 - 全站样式
   参考站 demoall.5fa.cn/28539 响应式餐饮甜品食品模板
   主色 #ff1200 / 深色 #191d20,#333739 / 正文 #322d2d
   ===================================================================== */

* { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  font-family:"Open Sans","Raleway","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  font-size:14px; line-height:1.7; color:#322d2d; background:#fff;
  overflow-x:hidden;
}
a { color:#322d2d; text-decoration:none; transition:all .3s ease; }
a:hover { color:#ff1200; }
img { max-width:100%; display:block; border:0; }
ul,ol { list-style:none; }
h1,h2,h3,h4,h5,h6 { font-weight:normal; }

/* ---------- 工具类 ---------- */
.text-center { text-align:center; }
.text-white { color:#fff !important; }
.text-light { color:#bdbcbc !important; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.img-fallback { display:flex; align-items:center; justify-content:center; width:100%; height:100%; min-height:200px; color:#fff; font-size:14px; }

/* ---------- 容器与栅格（自实现，无框架） ---------- */
.container { width:100%; max-width:1200px; margin:0 auto; padding:0 15px; }
.row { display:flex; flex-wrap:wrap; margin:0 -15px; width:100%; }
.row > [class*="col-"] { padding:0 15px; position:relative; width:100%; box-sizing:border-box; }
.col-md-12{flex:0 0 100%;max-width:100%;}
.col-md-8 {flex:0 0 66.6667%;max-width:66.6667%;}
.col-md-7 {flex:0 0 58.3333%;max-width:58.3333%;}
.col-md-6 {flex:0 0 50%;max-width:50%;}
.col-md-5 {flex:0 0 41.6667%;max-width:41.6667%;}
.col-md-4 {flex:0 0 33.3333%;max-width:33.3333%;}
.col-md-3 {flex:0 0 25%;max-width:25%;}
.clearfix::after { content:""; display:table; clear:both; }

/* =====================================================================
   Preloader 加载动画
   ===================================================================== */
.preloader { position:fixed; left:0; top:0; width:100%; height:100%; z-index:99999; background:#fff; display:flex; align-items:center; justify-content:center; transition:opacity .5s ease, visibility .5s ease; }
.preloader.hide { opacity:0; visibility:hidden; }
.preloader .spinner { width:60px; height:60px; position:relative; }
.preloader .pre-bounce1,.preloader .pre-bounce2 { width:100%; height:100%; border-radius:50%; background-color:#ff1200; opacity:.6; position:absolute; top:0; left:0; animation:prebounce 2s infinite ease-in-out; }
.preloader .pre-bounce2 { animation-delay:-1s; }
@keyframes prebounce { 0%,100%{transform:scale(0);} 50%{transform:scale(1);} }

/* =====================================================================
   Topbar 顶部信息栏
   ===================================================================== */
.topbar { background:#191d20; color:#fff; padding:9px 0; font-size:13px; }
.topbar .row { align-items:center; }
.topbar-left { flex:0 0 58.3333%; max-width:58.3333%; }
.topbar-right { flex:0 0 41.6667%; max-width:41.6667%; }
.welcome a { color:#fff; }
.welcome a:hover { color:#ff1200; }
.welcome strong { color:#ff1200; font-weight:700; }
.welcome .fa { margin-right:6px; color:#ff1200; }
.social { float:right; }
.social li { display:inline-block; margin-left:6px; }
.social li a { display:block; width:30px; height:30px; line-height:30px; text-align:center; color:#fff; border:1px solid #3a3f42; border-radius:50%; font-size:13px; }
.social li a:hover { background:#ff1200; border-color:#ff1200; color:#fff; }

/* =====================================================================
   Header + 导航
   ===================================================================== */
.header { background:#fff; padding:10px 0; position:relative; z-index:1000; width:100%; transition:all .3s ease; }
.header-sticky { position:fixed; left:0; top:0; width:100%; box-shadow:0 2px 12px rgba(0,0,0,.08); }
.header-wrap { border-top:1px dashed #d7d7d7; border-bottom:1px dashed #d7d7d7; min-height:66px; }
.header .container { display:flex; align-items:center; justify-content:space-between; min-height:66px; padding-top:6px; padding-bottom:6px; }

/* logo */
.logo-wrap { flex:0 0 auto; }
.logo { display:flex; align-items:center; gap:12px; }
.logo a { display:flex; align-items:center; gap:12px; }
.logo-icon { width:52px; height:52px; flex:0 0 52px; background:#ff1200; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(255,18,0,.35); }
.logo-icon svg { width:30px; height:30px; fill:#fff; }
.logo-text { line-height:1.15; }
.logo-text .brand { display:block; font-size:24px; font-weight:700; color:#191d20; letter-spacing:1px; }
.logo-text .tagline { display:block; font-size:12px; color:#726666; letter-spacing:3px; text-transform:uppercase; margin-top:2px; }

/* main nav */
.nav-area { display:flex; align-items:center; }
.mainnav { }
.mainnav .menu { display:flex; align-items:center; }
.mainnav .menu > li { position:relative; }
/* 导航结构标记 (源自参考站语义, JS/样式钩子) */
.Lev1,.Lev2 { position:relative; }
.has-sub { } /* 含下拉子菜单的项, JS 展开钩子 */
.mainnav .menu > li > a.menu1 { display:block; position:relative; font-size:16px; color:#726666; font-weight:500; height:66px; line-height:66px; padding:0 22px; outline:none; }
.mainnav .menu > li > a.menu1::before { content:"\f005"; font-family:FontAwesome; font-size:11px; color:#d7a8a3; margin-right:8px; vertical-align:middle; }
.mainnav .menu > li:first-child > a.menu1::before { content:""; margin:0; }
.mainnav .menu > li > a.menu1:hover,
.mainnav .menu > li.current > a.menu1 { color:#ff1200; }
.mainnav .menu > li.current > a.menu1::before,
.mainnav .menu > li > a.menu1:hover::before { color:#ff1200; }

/* dropdown */
.mainnav .sub-menu { position:absolute; left:50%; top:100%; transform:translateX(-50%) translateY(-10px); width:190px; background:#fff; box-shadow:0 6px 24px rgba(0,0,0,.12); z-index:9999; opacity:0; visibility:hidden; transition:all .3s ease; padding:6px 0; }
.mainnav .menu > li:hover > .sub-menu { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.mainnav .sub-menu > li { position:relative; }
.mainnav .sub-menu > li > a.menu2 { display:block; padding:0 22px; line-height:44px; font-size:14px; color:#726666; border-top:1px dashed #ececec; text-align:center; }
.mainnav .sub-menu > li:first-child > a.menu2 { border-top:none; }
.mainnav .sub-menu > li > a.menu2:hover { color:#fff; background:#191d20; }

.nav-extra { margin-left:18px; display:flex; align-items:center; gap:8px; font-size:15px; color:#191d20; font-weight:700; padding-left:18px; border-left:1px solid #ececec; }
.nav-extra .fa { color:#ff1200; }

/* hamburger */
.btn-menu { display:none; width:44px; height:44px; cursor:pointer; flex-direction:column; justify-content:center; align-items:center; gap:5px; }
.btn-menu span { display:block; width:26px; height:3px; background:#191d20; border-radius:2px; transition:all .3s ease; }
.btn-menu.show span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.btn-menu.show span:nth-child(2){ opacity:0; }
.btn-menu.show span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* mobile drawer (top-level hidden — gotcha #8) */
.m-nav,.m-overlay { display:none; }

/* =====================================================================
   Banner 轮播
   ===================================================================== */
.top-slider { position:relative; width:100%; overflow:hidden; background:#191d20; }
.flexslider { position:relative; width:100%; }
.slides { position:relative; width:100%; }
.slide-item { width:100%; height:600px; background-size:cover; background-position:center center; position:relative; display:none; }
.slide-item.active { display:block; }
.slide-caption { position:absolute; left:0; top:0; width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 20px; background:rgba(25,29,32,.35); }
.slide-title { color:#fff; font-size:46px; font-weight:700; line-height:1.3; text-shadow:0 2px 10px rgba(0,0,0,.4); margin-bottom:18px; }
.slide-title em { font-style:normal; color:#ff4d3d; }
.slide-desc { color:#fff; font-size:18px; margin-bottom:30px; max-width:720px; text-shadow:0 1px 6px rgba(0,0,0,.4); }
.slide-btn { }

.flex-dots { position:absolute; bottom:26px; left:0; width:100%; text-align:center; z-index:20; }
.flex-dot { display:inline-block; width:14px; height:14px; border-radius:50%; background:rgba(255,255,255,.5); margin:0 5px; cursor:pointer; border:2px solid transparent; transition:all .3s ease; }
.flex-dot.active { background:#ff1200; border-color:#fff; transform:scale(1.15); }
.flex-prev,.flex-next { position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.25); color:#fff; font-size:22px; line-height:48px; text-align:center; cursor:pointer; z-index:20; transition:all .3s ease; }
.flex-prev { left:24px; } .flex-next { right:24px; }
.flex-prev:hover,.flex-next:hover { background:#ff1200; }

/* =====================================================================
   Section 通用
   ===================================================================== */
.roll-row { position:relative; width:100%; }
.roll-titlebox { text-align:center; margin-bottom:50px; }
.roll-titlebox .maintitle { font-size:36px; font-weight:700; color:#191d20; line-height:1.3; margin-bottom:16px; position:relative; display:inline-block; padding:0 30px; }
.roll-titlebox .maintitle::before,.roll-titlebox .maintitle::after { content:"\f005"; font-family:FontAwesome; font-size:14px; color:#ff1200; position:absolute; top:50%; transform:translateY(-50%); opacity:.6; }
.roll-titlebox .maintitle::before { left:0; } .roll-titlebox .maintitle::after { right:0; }
.roll-titlebox .subtitle { font-size:15px; color:#726666; max-width:760px; margin:0 auto; line-height:1.8; }
.dark-title .maintitle,.our-satisfied .maintitle { color:#fff; }
.our-satisfied .subtitle { color:#bdbcbc; }

/* 按钮 */
.roll-button { display:inline-block; font-size:14px; font-weight:700; color:#fff; background:#ff1200; border:1px solid #ff1200; padding:13px 48px; transition:all .3s ease; cursor:pointer; }
.roll-button:hover { background:#191d20; color:#fff; border-color:#191d20; }
.roll-button.border { background:transparent; border:1px solid #ff1200; color:#ff1200; }
.roll-button.border:hover { background:#ff1200; color:#fff; box-shadow:0 0 0 26px #ff1200 inset; }
.roll-button.white { background:#fff; border:1px solid #fff; color:#191d20; }
.roll-button.white:hover { background:transparent; color:#fff; }
.roll-button.border.white { background:transparent; border:1px solid #fff; color:#fff; }
.roll-button.border.white:hover { background:#fff; color:#191d20; box-shadow:0 0 0 26px #fff inset; }

.readmore { margin-top:26px; }

/* =====================================================================
   关于我们 (aside-image 左文右图)
   ===================================================================== */
.about-sec { padding:80px 0 70px; }
.aside-image { position:relative; width:100%; }
.iabout-text { padding:20px 40px 20px 0; }
.content-wrap { }
.iport-desc { font-size:15px; color:#5a5353; line-height:2; margin-bottom:8px; text-indent:2em; }
.iabout-text h4 { font-size:15px; color:#5a5353; line-height:2; font-weight:400; }
.iabout-image { position:relative; }
.image-holder { width:100%; height:420px; background-size:cover !important; background-position:center center; border:6px solid #fff; box-shadow:0 10px 30px rgba(0,0,0,.12); }

/* =====================================================================
   产品展示 横向轮播
   ===================================================================== */
.product-sec { padding:70px 0 80px; background:#faf6f5; position:relative; }
.product-sec .roll-titlebox { margin-bottom:40px; }
.pc-carousel { position:relative; overflow:hidden; padding:0 50px; }
.pc-track { display:flex; gap:20px; transition:transform .5s ease; }
.pc-item { flex:0 0 calc((100% - 60px)/4); }
@media(max-width:991px){ .pc-item{ flex:0 0 calc((100% - 40px)/3); } }
@media(max-width:767px){ .pc-item{ flex:0 0 calc((100% - 20px)/2); } }
.pc-item .item-wrap { display:block; position:relative; overflow:hidden; background:#191d20; }
.pc-item .item-wrap img { width:100%; height:230px; object-fit:cover; transition:transform .4s ease; }
.pc-item .item-wrap .overlay { position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255,18,0,.85); opacity:0; transition:opacity .3s ease; z-index:5; display:flex; align-items:center; justify-content:center; pointer-events:none; }
.pc-item .item-wrap:hover .overlay { opacity:1; }
.pc-item .item-wrap .link { width:60px; height:60px; border-radius:50%; border:2px solid #fff; display:flex; align-items:center; justify-content:center; color:#fff; font-size:22px; transform:rotate(60deg); transition:transform .3s ease; }
.pc-item .item-wrap:hover .link { transform:rotate(0deg); }
.pc-item .item-wrap:hover img { transform:scale(1.08); }
.pc-item .pc-name { text-align:center; padding:14px 8px; background:#fff; font-size:15px; color:#191d20; font-weight:600; border-top:none; }
.pc-item .item-wrap:hover ~ .pc-name,
.pc-item:hover .pc-name { color:#ff1200; }
.carousel-prev,.carousel-next { position:absolute; top:42%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; background:#fff; color:#ff1200; border:1px solid #ff7a6e; font-size:18px; line-height:42px; text-align:center; cursor:pointer; z-index:10; box-shadow:0 4px 12px rgba(0,0,0,.1); }
.carousel-prev { left:0; } .carousel-next { right:0; }
.carousel-prev:hover,.carousel-next:hover { background:#ff1200; color:#fff; border-color:#ff1200; }

/* =====================================================================
   核心业务 (深色 our-satisfied 风格 4 列)
   ===================================================================== */
.biz-sec { background:#191d20; padding:80px 0; position:relative; }
.biz-sec::before { content:""; position:absolute; left:0; top:0; width:100%; height:6px; background:linear-gradient(90deg,#ff1200,#ff7a4d); }
.biz-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; width:100%; }
.biz-card { background:#23282b; border:1px solid #2e3438; padding:38px 24px; text-align:center; transition:all .35s ease; position:relative; overflow:hidden; }
.biz-card::before { content:""; position:absolute; left:0; top:0; width:100%; height:3px; background:#ff1200; transform:scaleX(0); transition:transform .35s ease; transform-origin:left; }
.biz-card:hover { background:#ff1200; border-color:#ff1200; transform:translateY(-6px); }
.biz-card:hover::before { transform:scaleX(1); background:#fff; }
.biz-icon { width:78px; height:78px; margin:0 auto 22px; border-radius:50%; background:rgba(255,18,0,.15); display:flex; align-items:center; justify-content:center; font-size:34px; color:#ff1200; transition:all .35s ease; }
.biz-card:hover .biz-icon { background:rgba(255,255,255,.2); color:#fff; }
.biz-card h3 { font-size:20px; color:#fff; font-weight:600; margin-bottom:14px; }
.biz-card p { font-size:13px; color:#bdbcbc; line-height:1.9; }
.biz-card:hover p { color:#fff; }

/* =====================================================================
   视差 CTA
   ===================================================================== */
.parallax-sec { position:relative; width:100%; background-attachment:fixed; background-position:center; background-size:cover; background-repeat:no-repeat; padding:90px 0; }
.parallax-sec .over { position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(25,29,32,.78); }
.parallax-sec .mask { position:absolute; left:0; top:0; width:100%; height:100%; background:linear-gradient(135deg,rgba(255,18,0,.25),rgba(25,29,32,.3)); }
.callout-wrap { position:relative; z-index:10; text-align:center; }
.callout-content h3 { font-size:36px; color:#fff; font-weight:700; line-height:1.4; margin-bottom:8px; }
.callout-content p { font-size:16px; color:#e0d6d4; margin-bottom:28px; }
.callout-buttons { }

/* =====================================================================
   新闻 enjoy-meal 深灰
   ===================================================================== */
.news-sec { background:#333739; padding:80px 0 70px; position:relative; overflow:hidden; }
.news-sec .roll-titlebox { margin-bottom:30px; }
.inews-content { padding:0 30px 0 0; }
.inews-list { }
.inews-item { padding:24px 0; border-bottom:1px solid #44494c; }
.inews-item:first-child { padding-top:0; }
.inews-item:last-child { border-bottom:none; }
.inews-title { font-size:18px; font-weight:600; margin-bottom:10px; line-height:1.5; }
.inews-title a { color:#fff; }
.inews-title a:hover { color:#ff1200; }
.inews-title .inews-no { color:#ff1200; margin-right:6px; }
.inews-desc { font-size:13px; color:#bdbcbc; line-height:1.9; }
.inews-meta { display:inline-block; margin-left:8px; color:#ff7a6e; font-size:13px; }
.inews-img { position:relative; }
.inews-img img { width:100%; height:460px; object-fit:cover; border:6px solid #2a2d2f; box-shadow:0 12px 30px rgba(0,0,0,.3); }
.img-chef { position:absolute; right:-20px; bottom:-30px; width:60%; }

/* =====================================================================
   合作伙伴
   ===================================================================== */
.partner-sec { padding:70px 0; background:#fff; }
.partner-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:18px; width:100%; }
.partner-item { height:90px; border:1px solid #ececec; display:flex; align-items:center; justify-content:center; font-size:15px; color:#999; font-weight:600; background:#fafafa; transition:all .3s ease; text-align:center; padding:0 8px; }
.partner-item:hover { border-color:#ff1200; color:#ff1200; background:#fff; box-shadow:0 6px 16px rgba(255,18,0,.12); transform:translateY(-3px); }
.partner-item .fa { margin-right:6px; }

/* =====================================================================
   Footer
   ===================================================================== */
.footer { background:#191d20; color:#bdbcbc; padding:60px 0 0; position:relative; width:100%; }
.footer::before { content:""; position:absolute; left:0; top:0; width:100%; height:4px; background:linear-gradient(90deg,#ff1200,#ff7a4d); }
.footer-main { display:flex; flex-wrap:wrap; width:100%; margin:0 -15px; }
.footer-col { flex:1 1 0; min-width:0; padding:0 15px 40px; }
.footer-col.fc-about { flex:0 0 33.3333%; max-width:33.3333%; }
.footer-title { font-size:17px; color:#fff; font-weight:600; margin-bottom:22px; padding-bottom:12px; position:relative; }
.footer-title::after { content:""; position:absolute; left:0; bottom:0; width:36px; height:2px; background:#ff1200; }
.footer-about-text { font-size:13px; line-height:1.9; color:#bdbcbc; margin-bottom:18px; }
.footer-social { }
.footer-social li { display:inline-block; margin-right:8px; }
.footer-social li a { display:block; width:34px; height:34px; line-height:34px; text-align:center; border:1px solid #3a3f42; border-radius:50%; color:#bdbcbc; }
.footer-social li a:hover { background:#ff1200; border-color:#ff1200; color:#fff; }
.footer-links li { margin-bottom:11px; }
.footer-links li a { color:#bdbcbc; font-size:13px; }
.footer-links li a::before { content:"\f105"; font-family:FontAwesome; color:#ff1200; margin-right:8px; }
.footer-links li a:hover { color:#fff; padding-left:4px; }
.footer-contact .fc-item { display:flex; align-items:flex-start; margin-bottom:16px; font-size:13px; color:#bdbcbc; line-height:1.7; }
.footer-contact .fc-item .fa { color:#ff1200; font-size:15px; margin-right:10px; margin-top:3px; flex:0 0 15px; }
.footer-qr { margin-top:14px; text-align:center; }
.footer-qr img { width:110px; height:110px; margin:0 auto; background:#fff; padding:5px; }
.footer-qr-text { font-size:12px; color:#999; margin-top:8px; }
.footer-bottom { border-top:1px solid #2a2d2f; padding:20px 0; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; width:100%; gap:10px; }
.copyr { margin:0; font-size:13px; color:#999; }
.copyr a { color:#bdbcbc; }
.footer-icp { }
.footer-icp a { color:#999; font-size:13px; }
.footer-icp a:hover { color:#ff1200; }
.footernav { }
.footernav ul { display:flex; flex-wrap:wrap; }
.footernav ul li a { color:#bdbcbc; padding:0 12px; font-size:13px; position:relative; }
.footernav ul li a::before { content:""; position:absolute; left:0; top:3px; width:1px; height:13px; background:#3a3f42; }
.footernav ul li:first-child a::before { width:0; }
.footernav ul li a:hover { color:#fff; }

/* =====================================================================
   返回顶部
   ===================================================================== */
.go-top { position:fixed; right:28px; bottom:28px; width:44px; height:44px; line-height:44px; text-align:center; background:#191d20; color:#fff; font-size:20px; border-radius:50%; cursor:pointer; z-index:9999; opacity:0; visibility:hidden; transition:all .3s ease; }
.go-top.show { opacity:1; visibility:visible; }
.go-top:hover { background:#ff1200; }

/* =====================================================================
   内页 Banner + 面包屑
   ===================================================================== */
.n-banner { position:relative; width:100%; height:300px; background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; text-align:center; }
.n-banner-mask { position:absolute; left:0; top:0; width:100%; height:100%; background:linear-gradient(135deg,rgba(25,29,32,.82),rgba(255,18,0,.45)); }
.n-banner-caption { position:relative; z-index:5; color:#fff; }
.n-banner-caption h2 { font-size:38px; font-weight:700; margin-bottom:8px; }
.n-banner-caption p { font-size:14px; letter-spacing:4px; color:#ffd9d4; text-transform:uppercase; }

.ntit { background:#fff; border-bottom:1px solid #f0e9e8; }
.ntit .container { display:flex; justify-content:space-between; align-items:center; padding-top:24px; padding-bottom:24px; flex-wrap:wrap; gap:10px; }
.ntt { }
.ntt-h1 { font-size:26px; color:#191d20; font-weight:700; display:inline-block; }
.ntt-en { font-size:14px; color:#bdbcbc; font-style:italic; margin-left:12px; letter-spacing:2px; }
.weiz { font-size:13px; color:#999; }
.weiz a { color:#726666; }
.weiz a:hover { color:#ff1200; }
.weiz .fa { margin:0 6px; color:#ccc; }

.page-content { padding:60px 0 80px; background:#fff; width:100%; }
.content { width:100%; }

/* =====================================================================
   列表页 (产品/新闻)
   ===================================================================== */
.list-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; width:100%; }
.news-card { display:block; background:#fff; border:1px solid #f0e9e8; overflow:hidden; transition:all .3s ease; }
.news-card:hover { border-color:#ff1200; box-shadow:0 10px 26px rgba(0,0,0,.1); transform:translateY(-4px); }
.news-card-img { position:relative; overflow:hidden; }
.news-card-img img { width:100%; height:210px; object-fit:cover; transition:transform .4s ease; }
.news-card:hover .news-card-img img { transform:scale(1.08); }
.news-card-body { padding:18px 20px 22px; }
.news-card-title { font-size:16px; color:#191d20; font-weight:600; margin-bottom:10px; line-height:1.5; }
.news-card:hover .news-card-title { color:#ff1200; }
.news-card-meta { font-size:12px; color:#999; margin-bottom:10px; }
.news-card-meta .fa { color:#ff1200; margin-right:5px; }
.news-card-meta span { margin-right:14px; }
.news-card-desc { font-size:13px; color:#726666; line-height:1.8; }

.pager { text-align:center; margin-top:50px; }
.pager a,.pager span { display:inline-block; min-width:40px; height:40px; line-height:38px; padding:0 12px; margin:0 4px; border:1px solid #ececec; color:#726666; font-size:14px; }
.pager a:hover,.pager span.active { background:#ff1200; border-color:#ff1200; color:#fff; }

/* =====================================================================
   详情页
   ===================================================================== */
.detail { width:100%; }
.detail-head { display:flex; gap:36px; padding-bottom:30px; border-bottom:1px solid #f0e9e8; margin-bottom:34px; flex-wrap:wrap; }
.detail-main-img { flex:0 0 46%; max-width:46%; }
.detail-main-img img { width:100%; height:380px; object-fit:cover; border:6px solid #fff; box-shadow:0 8px 24px rgba(0,0,0,.1); }
.detail-info { flex:1; min-width:280px; }
.detail-title { font-size:26px; color:#191d20; font-weight:700; line-height:1.4; margin-bottom:16px; }
.detail-meta { font-size:13px; color:#999; margin-bottom:20px; padding-bottom:16px; border-bottom:1px dashed #ececec; }
.detail-meta span { margin-right:18px; }
.detail-meta .fa { color:#ff1200; margin-right:5px; }
.detail-info p { font-size:14px; color:#5a5353; line-height:2; margin-bottom:12px; }
.detail-desc { margin-bottom:34px; }
.detail-desc h3 { font-size:20px; color:#191d20; font-weight:600; margin-bottom:16px; padding-left:14px; border-left:4px solid #ff1200; }
.detail-desc p { font-size:14px; color:#5a5353; line-height:2; margin-bottom:14px; text-indent:2em; }
.detail-desc img { width:100%; max-width:760px; margin:18px auto; border-radius:4px; }
.params-table { width:100%; border-collapse:collapse; margin-bottom:34px; }
.params-table caption { font-size:18px; color:#191d20; font-weight:600; text-align:left; margin-bottom:14px; padding-left:14px; border-left:4px solid #ff1200; }
.params-table th,.params-table td { border:1px solid #ececec; padding:12px 16px; font-size:14px; text-align:left; }
.params-table th { background:#faf6f5; color:#191d20; font-weight:600; width:30%; }
.params-table td { color:#5a5353; }
.detail-features { margin-bottom:34px; }
.detail-features h3,.related-title { font-size:20px; color:#191d20; font-weight:600; margin-bottom:18px; padding-left:14px; border-left:4px solid #ff1200; }
.feat-list { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; width:100%; }
.feat-item { display:flex; align-items:flex-start; gap:12px; padding:14px 16px; background:#faf6f5; border-left:3px solid #ff1200; }
.feat-item .fa { color:#ff1200; font-size:18px; margin-top:3px; }
.feat-item span { font-size:14px; color:#5a5353; line-height:1.7; }
.detail-related { }
.related-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; width:100%; }
.related-card { display:block; text-align:center; }
.related-card img { width:100%; height:150px; object-fit:cover; margin-bottom:10px; transition:transform .3s ease; }
.related-card:hover img { transform:scale(1.05); }
.related-card h4 { font-size:14px; color:#191d20; font-weight:500; }
.related-card:hover h4 { color:#ff1200; }

/* 新闻详情 */
.news-article { width:100%; }
.news-art-title { font-size:28px; color:#191d20; font-weight:700; line-height:1.4; text-align:center; margin-bottom:16px; }
.news-art-meta { text-align:center; font-size:13px; color:#999; padding-bottom:20px; border-bottom:1px solid #f0e9e8; margin-bottom:30px; }
.news-art-meta span { margin:0 12px; }
.news-art-meta .fa { color:#ff1200; margin-right:5px; }
.news-art-body { font-size:15px; color:#4a4343; line-height:2.1; }
.news-art-body p { margin-bottom:18px; text-indent:2em; }
.news-art-body h3 { font-size:19px; color:#191d20; font-weight:600; margin:26px 0 14px; text-indent:0; }
.news-art-body img { width:100%; max-width:820px; margin:20px auto; border-radius:4px; text-indent:0; }
.pager-nav { display:flex; justify-content:space-between; margin-top:36px; padding-top:24px; border-top:1px solid #f0e9e8; flex-wrap:wrap; gap:10px; }
.pager-nav a { color:#726666; font-size:14px; }
.pager-nav a:hover { color:#ff1200; }

/* =====================================================================
   关于我们页
   ===================================================================== */
.about-intro { margin-bottom:50px; }
.intro-text p { font-size:15px; color:#5a5353; line-height:2.1; margin-bottom:16px; text-indent:2em; }
.about-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin:40px 0; width:100%; }
.stat-item { text-align:center; padding:30px 16px; background:#faf6f5; border-top:3px solid #ff1200; }
.stat-num { font-size:38px; color:#ff1200; font-weight:700; line-height:1; }
.stat-num small { font-size:18px; }
.stat-label { font-size:14px; color:#726666; margin-top:8px; }
.sec-title { font-size:24px; color:#191d20; font-weight:700; text-align:center; margin-bottom:36px; position:relative; padding-bottom:14px; }
.sec-title::after { content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:50px; height:3px; background:#ff1200; }

.timeline { position:relative; max-width:900px; margin:0 auto 50px; padding:20px 0; }
.timeline::before { content:""; position:absolute; left:50%; top:0; bottom:0; width:2px; background:#f0d8d4; transform:translateX(-50%); }
.timeline-item { position:relative; width:50%; padding:0 40px 36px 0; }
.timeline-item:nth-child(even){ left:50%; padding:0 0 36px 40px; }
.timeline-node { position:absolute; right:-9px; top:4px; width:18px; height:18px; border-radius:50%; background:#ff1200; border:3px solid #fff; box-shadow:0 0 0 3px #f0d8d4; }
.timeline-item:nth-child(even) .timeline-node { left:-9px; right:auto; }
.timeline-date { font-size:14px; color:#ff1200; font-weight:700; margin-bottom:6px; }
.timeline-content h4 { font-size:17px; color:#191d20; font-weight:600; margin-bottom:6px; }
.timeline-content p { font-size:13px; color:#726666; line-height:1.8; }

.culture-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:50px; width:100%; }
.culture-card { padding:36px 26px; text-align:center; border:1px solid #f0e9e8; transition:all .3s ease; }
.culture-card:hover { border-color:#ff1200; box-shadow:0 10px 26px rgba(0,0,0,.08); transform:translateY(-4px); }
.culture-card .fa { font-size:38px; color:#ff1200; margin-bottom:18px; }
.culture-card h4 { font-size:19px; color:#191d20; font-weight:600; margin-bottom:12px; }
.culture-card p { font-size:13px; color:#726666; line-height:1.9; }

.team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; width:100%; }
.team-card { text-align:center; }
.team-av { width:100%; height:240px; overflow:hidden; margin-bottom:14px; background:#eee; }
.team-av img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.team-card:hover .team-av img { transform:scale(1.06); }
.team-info { }
.team-name { font-size:17px; color:#191d20; font-weight:600; }
.team-role { font-size:13px; color:#ff1200; margin-top:4px; }

/* =====================================================================
   联系我们
   ===================================================================== */
.contact-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:50px; width:100%; }
.ci-card { padding:34px 24px; text-align:center; border:1px solid #f0e9e8; transition:all .3s ease; }
.ci-card:hover { border-color:#ff1200; box-shadow:0 8px 22px rgba(0,0,0,.08); }
.ci-icon { width:70px; height:70px; margin:0 auto 18px; border-radius:50%; background:rgba(255,18,0,.1); display:flex; align-items:center; justify-content:center; font-size:28px; color:#ff1200; }
.ci-label { font-size:14px; color:#999; margin-bottom:8px; }
.ci-value { font-size:17px; color:#191d20; font-weight:600; line-height:1.5; }
.contact-form { background:#faf6f5; padding:40px; border-top:3px solid #ff1200; }
.contact-form h3 { font-size:22px; color:#191d20; font-weight:600; margin-bottom:24px; }
.form-row { display:flex; gap:20px; margin-bottom:18px; flex-wrap:wrap; }
.form-field { flex:1; min-width:220px; }
.form-field.full { flex:0 0 100%; }
.form-label { display:block; font-size:13px; color:#726666; margin-bottom:8px; }
.form-input,.form-textarea { width:100%; padding:12px 14px; border:1px solid #ececec; background:#fff; font-size:14px; color:#322d2d; font-family:inherit; transition:border-color .3s; }
.form-input:focus,.form-textarea:focus { border-color:#ff1200; outline:none; }
.form-textarea { min-height:140px; resize:vertical; }
.form-submit { background:#ff1200; color:#fff; border:none; padding:14px 50px; font-size:15px; font-weight:700; cursor:pointer; transition:all .3s; font-family:inherit; }
.form-submit:hover { background:#191d20; }

/* =====================================================================
   fade-in 滚动动画 (gotcha #5: 正确特异性 html.js .fade-in.visible (0,3,1) 胜 html.js .fade-in (0,2,1))
   ===================================================================== */
.fade-in { opacity:1; }
html.js .fade-in { opacity:0; transform:translateY(40px); transition:opacity .7s ease, transform .7s ease; }
html.js .fade-in.visible { opacity:1; transform:translateY(0); }

/* =====================================================================
   响应式
   ===================================================================== */
@media(max-width:1200px){
  .container{ max-width:100%; }
  .mainnav .menu > li > a.menu1{ padding:0 16px; font-size:15px; }
  .slide-title{ font-size:38px; }
}
@media(max-width:1024px){
  /* 移动导航显现 */
  .btn-menu{ display:flex; }
  .nav-area .mainnav{ display:none; }
  .nav-extra{ display:none; }
  .m-overlay{ display:block; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:9998; opacity:0; visibility:hidden; transition:all .3s; }
  .m-overlay.show{ display:block; opacity:1; visibility:visible; }
  .m-nav{ display:block; position:fixed; right:-300px; top:0; width:280px; height:100%; background:#191d20; z-index:9999; transition:right .3s ease; overflow-y:auto; padding:60px 0 30px; }
  .m-nav.show{ right:0; }
  .m-close{ position:absolute; right:16px; top:16px; color:#fff; font-size:24px; cursor:pointer; }
  .m-nav .menu > li > a.menu1{ display:block; color:#fff; padding:0 28px; line-height:48px; font-size:16px; border-bottom:1px solid #2a2d2f; }
  .m-nav .menu > li > a.menu1:hover,.m-nav .menu > li.current > a.menu1{ background:#ff1200; }
  .m-nav .sub-menu{ position:static; transform:none; opacity:1; visibility:visible; background:#23282b; box-shadow:none; padding:0; width:100%; }
  .m-nav .sub-menu > li > a.menu2{ color:#bdbcbc; line-height:42px; border:none; text-align:left; padding-left:48px; font-size:14px; }
  .m-nav .sub-menu > li > a.menu2:hover{ background:#ff1200; color:#fff; }
  .m-nav .nav-extra{ display:flex; margin:18px 24px 0; padding:14px 0 0; border-top:1px solid #2a2d2f; color:#fff; border-left:none; }
  .biz-grid{ grid-template-columns:repeat(2,1fr); }
  .partner-grid{ grid-template-columns:repeat(3,1fr); }
}
@media(max-width:991px){
  .topbar-left,.topbar-right{ flex:0 0 100%; max-width:100%; text-align:center; }
  .social{ float:none; }
  .topbar .social li{ margin:0 3px; }
  .col-md-8,.col-md-7,.col-md-5,.col-md-4,.col-md-3{ flex:0 0 100%; max-width:100%; }
  .iabout-text{ padding:0 0 30px; }
  .image-holder{ height:320px; }
  .list-grid{ grid-template-columns:repeat(2,1fr); }
  .related-grid{ grid-template-columns:repeat(2,1fr); }
  .team-grid{ grid-template-columns:repeat(2,1fr); }
  .about-stats{ grid-template-columns:repeat(2,1fr); }
  .feat-list{ grid-template-columns:1fr; }
  .inews-img{ display:none; }
  .footer-col.fc-about{ flex:0 0 100%; max-width:100%; }
  .footer-col{ flex:0 0 50%; max-width:50%; }
}
@media(max-width:767px){
  .col-md-6,.col-sm-6{ flex:0 0 100%; max-width:100%; }
  .slide-item{ height:380px; }
  .slide-title{ font-size:26px; }
  .slide-desc{ font-size:14px; }
  .roll-titlebox .maintitle{ font-size:26px; }
  .callout-content h3{ font-size:24px; }
  .biz-grid{ grid-template-columns:1fr; }
  .partner-grid{ grid-template-columns:repeat(2,1fr); }
  .list-grid,.culture-grid,.contact-grid{ grid-template-columns:1fr; }
  .related-grid,.team-grid,.about-stats{ grid-template-columns:1fr; }
  .detail-head{ flex-direction:column; }
  .detail-main-img{ flex:0 0 100%; max-width:100%; }
  .timeline::before{ left:9px; }
  .timeline-item{ width:100%; left:0 !important; padding:0 0 30px 36px; }
  .timeline-item .timeline-node{ left:0; right:auto; }
  .footer-col{ flex:0 0 100%; max-width:100%; }
  .footer-bottom{ flex-direction:column; text-align:center; }
  .ntit .container{ flex-direction:column; align-items:flex-start; }
  .contact-form{ padding:24px; }
  .form-row{ flex-direction:column; gap:0; }
  .n-banner{ height:220px; }
  .n-banner-caption h2{ font-size:26px; }
}