/* ===================================================================
   武汉欧亚华林木业有限公司 - 全站公共样式
   配色：自然大地色 #996633 / #CCCC99 / #CC6600 / #FFFFCC / #FFFFFF / #333300
=================================================================== */

* { margin: 0; padding: 0; box-sizing: border-box; }

:root{
  --c-brown:#996633;      /* 主色 木材棕 */
  --c-sage:#CCCC99;       /* 边框/辅助 草木灰 */
  --c-orange:#CC6600;     /* 强调色 暖橙 */
  --c-cream:#FFFFCC;      /* 浅底 奶黄 */
  --c-white:#FFFFFF;
  --c-dark:#333300;       /* 正文 深橄榄棕 */
  --c-gray:#666655;
}

html,body{ font-family:"Microsoft YaHei","微软雅黑","PingFang SC",Helvetica,Arial,sans-serif; color:var(--c-dark); background:#faf7ef; line-height:1.7; font-size:15px; }
img{ display:block; max-width:100%; height:auto; }
a{ color:var(--c-brown); text-decoration:none; transition:color .2s; }
a:hover{ color:var(--c-orange); }
ul,ol{ list-style:none; }
h1,h2,h3,h4{ font-weight:600; line-height:1.4; }

/* 通用容器 */
.wrap{ width:1200px; max-width:94%; margin:0 auto; }
.section{ padding:46px 0; }
.clr{ clear:both; }

/* 顶部条 */
.topbar{ background:var(--c-dark); color:#ddd; font-size:13px; }
.topbar .wrap{ display:flex; justify-content:space-between; align-items:center; height:36px; flex-wrap:wrap; gap:8px; }
.topbar a{ color:#e8d9b0; }
.topbar .nav-mini a{ margin-left:14px; }

/* 页头 */
.site-header{ background:var(--c-white); border-bottom:3px solid var(--c-brown); box-shadow:0 2px 8px rgba(51,51,0,.06); position:sticky; top:0; z-index:50; }
.site-header .wrap{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:20px; }
.logo{ display:flex; align-items:center; gap:14px; }
.logo .mark{ width:56px; height:56px; border-radius:50%; background:var(--c-brown); color:var(--c-cream); display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:700; letter-spacing:1px; }
.logo .txt h1, .logo .txt p{ font-size:22px; color:var(--c-dark); margin:0; }
.logo .txt span{ display:block; font-size:12px; color:var(--c-orange); letter-spacing:3px; text-transform:uppercase; }
.head-contact{ text-align:right; }
.head-contact .tel{ font-size:24px; color:var(--c-orange); font-weight:700; font-family:Arial; }
.head-contact .tel small{ font-size:12px; color:var(--c-gray); font-weight:400; display:block; }

/* 主导航 */
.main-nav{ background:var(--c-brown); }
.main-nav ul{ display:flex; flex-wrap:wrap; }
.main-nav li{ flex:1; position:relative; }
.main-nav a{ display:block; color:#fff; padding:15px 6px; text-align:center; font-size:16px; border-right:1px solid rgba(255,255,255,.12); }
.main-nav li:last-child a{ border-right:none; }
.main-nav a:hover, .main-nav li.active a{ background:var(--c-orange); color:#fff; }

/* 轮播/横幅 */
.banner{ position:relative; background:#1f1a08; }
.banner img{ width:100%; height:420px; object-fit:cover; }
.banner .cap{ position:absolute; left:0; right:0; bottom:0; padding:26px 0; background:linear-gradient(transparent,rgba(0,0,0,.75)); color:#fff; }
.banner .cap .wrap{ }
.banner .cap h2{ font-size:30px; }
.banner .cap p{ margin-top:8px; color:#e8d9b0; font-size:15px; }

/* 面包屑 */
.crumbs{ background:var(--c-cream); border-bottom:1px solid var(--c-sage); }
.crumbs .wrap{ padding:12px 0; font-size:13px; color:var(--c-gray); }
.crumbs a{ color:var(--c-gray); }
.crumbs a:hover{ color:var(--c-orange); }
.crumbs .sep{ margin:0 6px; color:#bbb; }

/* 区块标题 */
.sec-title{ text-align:center; margin-bottom:34px; }
.sec-title h2{ font-size:26px; color:var(--c-dark); display:inline-block; padding-bottom:10px; border-bottom:3px solid var(--c-orange); }
.sec-title span{ display:block; color:var(--c-orange); font-size:13px; letter-spacing:4px; text-transform:uppercase; margin-top:6px; }

/* 关于区块（首页） */
.about-row{ display:flex; gap:34px; align-items:center; flex-wrap:wrap; }
.about-row .pic{ flex:1 1 420px; }
.about-row .pic img{ width:100%; border-radius:6px; box-shadow:0 4px 18px rgba(51,51,0,.18); }
.about-row .txt{ flex:1 1 420px; }
.about-row .txt h2{ font-size:24px; color:var(--c-dark); margin-bottom:6px; }
.about-row .txt .en{ color:var(--c-orange); font-size:13px; letter-spacing:3px; text-transform:uppercase; margin-bottom:16px; display:block; }
.about-row .txt p{ margin-bottom:12px; color:#555; text-indent:2em; }
.about-row .txt .more{ display:inline-block; margin-top:10px; padding:8px 22px; background:var(--c-brown); color:#fff; border-radius:3px; }
.about-row .txt .more:hover{ background:var(--c-orange); color:#fff; }

/* 产品卡片网格 */
.prod-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.prod-card{ background:#fff; border:1px solid #ece6d2; border-radius:6px; overflow:hidden; transition:box-shadow .2s,transform .2s; }
.prod-card:hover{ box-shadow:0 6px 22px rgba(153,102,51,.22); transform:translateY(-4px); }
.prod-card .ph{ overflow:hidden; }
.prod-card .ph img{ width:100%; height:170px; object-fit:cover; transition:transform .4s; }
.prod-card:hover .ph img{ transform:scale(1.06); }
.prod-card .info{ padding:12px 14px; }
.prod-card .info h3{ font-size:16px; color:var(--c-dark); margin-bottom:4px; }
.prod-card .info p{ font-size:13px; color:var(--c-gray); }

/* 滚动产品（首页热销） */
.scroll-row{ display:flex; gap:18px; overflow-x:auto; padding-bottom:8px; }
.scroll-row .prod-card{ min-width:230px; }

/* 优势 */
.adv-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.adv-card{ background:#fff; border-top:4px solid var(--c-orange); padding:26px 20px; text-align:center; border-radius:4px; box-shadow:0 2px 10px rgba(51,51,0,.06); }
.adv-card .ico{ width:58px; height:58px; margin:0 auto 14px; border-radius:50%; background:var(--c-cream); color:var(--c-brown); display:flex; align-items:center; justify-content:center; font-size:26px; font-weight:700; }
.adv-card h3{ font-size:17px; margin-bottom:6px; color:var(--c-dark); }
.adv-card p{ font-size:13px; color:var(--c-gray); }

/* 新闻列表（首页两栏） */
.news-home{ display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.news-home .col h3.col-t{ font-size:18px; color:var(--c-dark); border-bottom:2px solid var(--c-sage); padding-bottom:10px; margin-bottom:14px; }
.news-home .col h3.col-t span{ border-bottom:2px solid var(--c-orange); padding-bottom:10px; }
.news-home .col ul li{ padding:9px 0; border-bottom:1px dashed #e4ddc6; display:flex; justify-content:space-between; gap:10px; }
.news-home .col ul li a{ color:#444; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.news-home .col ul li .date{ color:#aaa; font-size:13px; }

/* 列表页通用 */
.list-page .wrap{ display:flex; gap:30px; padding:40px 0; }
.list-main{ flex:1; min-width:0; }
.list-side{ width:240px; flex-shrink:0; }
.list-main .head{ display:flex; justify-content:space-between; align-items:center; border-bottom:2px solid var(--c-brown); padding-bottom:12px; margin-bottom:24px; }
.list-main .head h2{ font-size:22px; color:var(--c-dark); }
.list-main .head .count{ font-size:13px; color:var(--c-gray); }

/* 产品列表 grid (3列) */
.pgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pgrid .prod-card .ph img{ height:190px; }

/* 新闻/案例列表 */
.nlist li{ background:#fff; border:1px solid #ece6d2; border-radius:6px; padding:18px; margin-bottom:16px; display:flex; gap:18px; transition:box-shadow .2s; }
.nlist li:hover{ box-shadow:0 4px 16px rgba(153,102,51,.16); }
.nlist li .pic{ flex:0 0 220px; }
.nlist li .pic img{ width:220px; height:150px; object-fit:cover; border-radius:4px; }
.nlist li .info{ flex:1; min-width:0; }
.nlist li .info h3{ font-size:18px; margin-bottom:8px; }
.nlist li .info h3 a{ color:var(--c-dark); }
.nlist li .info .meta{ font-size:13px; color:#aaa; margin-bottom:8px; }
.nlist li .info p{ color:#666; font-size:14px; }
.nlist li .info .more{ color:var(--c-orange); font-size:13px; }

/* 案例网格 */
.cgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.cgrid .case-card{ background:#fff; border:1px solid #ece6d2; border-radius:6px; overflow:hidden; }
.cgrid .case-card img{ width:100%; height:200px; object-fit:cover; transition:transform .4s; }
.cgrid .case-card:hover img{ transform:scale(1.05); }
.cgrid .case-card .info{ padding:12px 14px; }
.cgrid .case-card h3{ font-size:15px; color:var(--c-dark); }
.cgrid .case-card p{ font-size:12px; color:var(--c-gray); margin-top:3px; }

/* 侧栏 */
.side-box{ background:#fff; border:1px solid #ece6d2; border-radius:6px; margin-bottom:20px; overflow:hidden; }
.side-box h3{ background:var(--c-brown); color:#fff; padding:12px 16px; font-size:16px; }
.side-box .bd{ padding:14px 16px; }
.side-cat li{ border-bottom:1px dashed #e4ddc6; }
.side-cat li:last-child{ border-bottom:none; }
.side-cat li a{ display:block; padding:10px 2px; color:#555; }
.side-cat li a:hover,.side-cat li a.on{ color:var(--c-orange); font-weight:600; }
.side-contact .bd p{ margin-bottom:8px; font-size:13px; color:#555; }
.side-contact .bd .tel{ font-size:20px; color:var(--c-orange); font-weight:700; }

/* 分页 */
.pager{ text-align:center; margin-top:30px; }
.pager a,.pager span{ display:inline-block; min-width:34px; height:34px; line-height:34px; padding:0 8px; margin:0 3px; border:1px solid var(--c-sage); border-radius:3px; color:#666; }
.pager a:hover{ background:var(--c-brown); color:#fff; border-color:var(--c-brown); }
.pager .cur{ background:var(--c-brown); color:#fff; border-color:var(--c-brown); }

/* 详情页 */
.detail-page .wrap{ display:flex; gap:30px; padding:36px 0; }
.detail-main{ flex:1; min-width:0; }
.detail-head{ border-bottom:1px solid var(--c-sage); padding-bottom:16px; margin-bottom:20px; }
.detail-head h1{ font-size:24px; color:var(--c-dark); margin-bottom:8px; }
.detail-head .meta{ color:#999; font-size:13px; }
.detail-head .meta span{ margin-right:18px; }
.detail-pic{ text-align:center; margin-bottom:22px; }
.detail-pic img{ max-width:560px; margin:0 auto; border-radius:6px; box-shadow:0 4px 18px rgba(51,51,0,.14); }
.detail-para{ background:#fff; border:1px solid #ece6d2; border-radius:6px; padding:24px 26px; margin-bottom:20px; }
.detail-para h2{ font-size:18px; color:var(--c-brown); border-left:4px solid var(--c-orange); padding-left:10px; margin:18px 0 12px; }
.detail-para p{ margin-bottom:14px; color:#444; text-indent:2em; }
.detail-para ul.spec{ margin:8px 0 14px 2em; }
.detail-para ul.spec li{ list-style:disc; color:#555; margin-bottom:6px; }
.detail-tag{ background:var(--c-cream); border:1px solid var(--c-sage); padding:14px 18px; border-radius:4px; font-size:13px; color:#555; margin-bottom:20px; }
.detail-tag a{ margin-right:14px; }
.pnav{ display:flex; justify-content:space-between; gap:14px; border-top:1px solid var(--c-sage); padding-top:16px; font-size:14px; }
.pnav a{ color:#555; }

/* 联系页 */
.contact-grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:30px; }
.contact-info{ background:#fff; border:1px solid #ece6d2; border-radius:6px; padding:26px; }
.contact-info h2{ font-size:20px; color:var(--c-brown); margin-bottom:18px; border-left:4px solid var(--c-orange); padding-left:10px; }
.contact-info ul li{ padding:10px 0; border-bottom:1px dashed #e4ddc6; display:flex; gap:10px; }
.contact-info ul li .k{ width:90px; color:var(--c-gray); flex-shrink:0; }
.contact-info ul li .v{ color:var(--c-dark); }
.msg-form{ background:#fff; border:1px solid #ece6d2; border-radius:6px; padding:26px; }
.msg-form h2{ font-size:20px; color:var(--c-brown); margin-bottom:18px; border-left:4px solid var(--c-orange); padding-left:10px; }
.field{ margin-bottom:14px; }
.field label{ display:block; margin-bottom:6px; color:#555; font-size:14px; }
.field input,.field textarea{ width:100%; padding:10px 12px; border:1px solid var(--c-sage); border-radius:4px; font-size:14px; font-family:inherit; background:#fff; }
.field textarea{ resize:vertical; min-height:110px; }
.field input:focus,.field textarea:focus{ border-color:var(--c-brown); outline:none; }
.btn{ display:inline-block; background:var(--c-brown); color:#fff; padding:11px 30px; border:none; border-radius:4px; font-size:15px; cursor:pointer; }
.btn:hover{ background:var(--c-orange); }
.map-box{ margin-top:26px; background:#fff; border:1px solid #ece6d2; border-radius:6px; padding:18px; }
.map-box h2{ font-size:18px; color:var(--c-brown); margin-bottom:12px; }
.map-box .map{ height:340px; background:#efeada; border-radius:4px; display:flex; align-items:center; justify-content:center; color:#888; }

/* 关于页 */
.about-block{ background:#fff; border:1px solid #ece6d2; border-radius:6px; padding:30px; }
.about-block h2{ font-size:20px; color:var(--c-brown); border-left:4px solid var(--c-orange); padding-left:10px; margin:22px 0 14px; }
.about-block p{ margin-bottom:14px; color:#444; text-indent:2em; }
.about-block .lead-img{ width:100%; margin-bottom:18px; border-radius:6px; }
.culture-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:14px; }
.culture-grid .ci{ background:var(--c-cream); border-radius:6px; padding:22px 18px; text-align:center; }
.culture-grid .ci h3{ color:var(--c-brown); font-size:17px; margin-bottom:6px; }
.culture-grid .ci p{ color:#666; font-size:13px; text-indent:0; }

/* 页脚 */
.site-footer{ background:var(--c-dark); color:#cbb98a; padding:36px 0 0; margin-top:40px; }
.site-footer .f-grid{ display:grid; grid-template-columns:2fr 1fr 1fr 1.2fr; gap:30px; padding-bottom:26px; border-bottom:1px solid rgba(255,255,255,.1); }
.site-footer h4{ color:#fff; font-size:16px; margin-bottom:14px; }
.site-footer p,.site-footer li{ font-size:13px; margin-bottom:7px; color:#cbb98a; }
.site-footer a{ color:#cbb98a; }
.site-footer a:hover{ color:var(--c-orange); }
.site-footer .f-about p{ line-height:1.8; }
.f-contact .tel{ font-size:22px; color:var(--c-orange); font-weight:700; font-family:Arial; }
.copyright{ text-align:center; padding:16px 0; font-size:13px; color:#9a8a5e; }
.copyright a{ color:#9a8a5e; }
.back-top{ position:fixed; right:20px; bottom:30px; width:42px; height:42px; background:var(--c-brown); color:#fff; border-radius:50%; text-align:center; line-height:42px; cursor:pointer; opacity:.9; display:none; z-index:60; }
.back-top:hover{ background:var(--c-orange); }

/* 响应式 */
@media (max-width:1024px){
  .prod-grid,.adv-grid{ grid-template-columns:repeat(2,1fr); }
  .pgrid,.cgrid{ grid-template-columns:repeat(2,1fr); }
  .news-home{ grid-template-columns:1fr; }
  .site-footer .f-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:760px){
  body{ font-size:14px; }
  .site-header .wrap{ flex-direction:column; align-items:flex-start; }
  .head-contact{ text-align:left; }
  .main-nav ul{ flex-wrap:wrap; }
  .main-nav li{ flex:1 1 33%; }
  .main-nav a{ padding:12px 4px; font-size:14px; }
  .banner img{ height:230px; }
  .banner .cap h2{ font-size:20px; }
  .prod-grid,.adv-grid,.pgrid,.cgrid,.culture-grid,.contact-grid{ grid-template-columns:1fr; }
  .list-page .wrap,.detail-page .wrap{ flex-direction:column; }
  .list-side{ width:100%; }
  .nlist li{ flex-direction:column; }
  .nlist li .pic{ flex:none; }
  .nlist li .pic img{ width:100%; height:180px; }
  .site-footer .f-grid{ grid-template-columns:1fr; }
  .about-row{ flex-direction:column; }
}