/* ============================================================
   地毯佬 ditanlao.com — 2026 全新改版样式
   暖色 · 大图 · 卡片化 | 无框架依赖
   ============================================================ */
:root{
  --paper:#faf7f2;
  --ink:#26201a;
  --muted:#85796c;
  --brand:#b0713a;
  --brand-2:#8d572a;
  --dark:#1d1712;
  --line:#ece4d8;
  --card:#ffffff;
  --shadow:0 10px 30px rgba(38,32,26,.08);
  --radius:14px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",sans-serif;
  color:var(--ink);background:var(--paper);line-height:1.7;font-size:16px;
}
img{max-width:100%;height:auto;border:0;display:block}
a{color:inherit;text-decoration:none;transition:color .2s}
ul,ol{list-style:none}
.dt-container{max-width:1180px;margin:0 auto;padding:0 20px}

/* ---------- 顶部导航 ---------- */
.dt-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);transition:box-shadow .25s}
.dt-header.scrolled{box-shadow:0 6px 24px rgba(38,32,26,.1)}
.dt-header-in{display:flex;align-items:center;gap:28px;height:74px}
.dt-logo img{height:46px;width:auto}
.dt-nav{display:flex;gap:4px;flex:1;justify-content:center}
.dt-nav a{padding:8px 14px;border-radius:8px;font-size:15.5px;font-weight:500;color:#4d4337;white-space:nowrap}
.dt-nav a:hover{color:var(--brand);background:#f6efe6}
.dt-header-cta{display:flex;align-items:center;gap:14px}
.dt-tel{text-align:right;line-height:1.3}
.dt-tel b{display:block;font-size:19px;color:var(--brand);letter-spacing:.5px}
.dt-tel span{font-size:12px;color:var(--muted)}
.dt-burger{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer;padding:9px 8px}
.dt-burger span{display:block;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;transition:.25s}

/* ---------- 首页 Hero ---------- */
.dt-hero{position:relative;min-height:560px;height:78vh;max-height:760px;display:flex;align-items:center;color:#fff;
  background:linear-gradient(rgba(26,18,11,.52),rgba(26,18,11,.22) 45%,rgba(26,18,11,.62)),url("/skin/ditanlao/img/hero_home.jpg") center 38%/cover no-repeat}
.dt-hero-in{width:100%}
.dt-hero-eyebrow{display:inline-block;font-size:13px;letter-spacing:4px;padding:6px 14px;border:1px solid rgba(255,255,255,.45);border-radius:999px;margin-bottom:22px;color:#f3e7d8}
.dt-hero h1{font-size:clamp(32px,5vw,54px);font-weight:800;letter-spacing:2px;line-height:1.25;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.dt-hero h1 em{font-style:normal;color:#f0b078}
.dt-hero p{margin:18px 0 30px;font-size:clamp(15px,1.6vw,18px);color:#f4ede3;max-width:560px}
.dt-hero-btns{display:flex;gap:14px;flex-wrap:wrap}
.dt-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 28px;border-radius:10px;font-size:16px;font-weight:600;transition:.2s}
.dt-btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 22px rgba(176,113,58,.45)}
.dt-btn-primary:hover{background:var(--brand-2);color:#fff;transform:translateY(-2px)}
.dt-btn-ghost{border:1.5px solid rgba(255,255,255,.65);color:#fff}
.dt-btn-ghost:hover{background:rgba(255,255,255,.14);color:#fff}
.dt-hero-chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}
.dt-hero-chips span{font-size:13.5px;color:#f6efe5;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);padding:6px 14px;border-radius:999px;backdrop-filter:blur(4px)}

/* ---------- 通用区块 ---------- */
.dt-section{padding:64px 0}
.dt-section-tint{background:#fff}
.dt-sec-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:34px;gap:16px;flex-wrap:wrap}
.dt-sec-head h2{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:1px}
.dt-sec-head h2 small{display:block;font-size:13px;font-weight:500;color:var(--brand);letter-spacing:3px;margin-bottom:6px}
.dt-sec-head p{color:var(--muted);font-size:14px}
.dt-more-link{color:var(--brand);font-size:14.5px;white-space:nowrap;border-bottom:1px dashed var(--brand);padding-bottom:2px}
.dt-more-link:hover{color:var(--brand-2)}

/* ---------- 图片墙 ---------- */
.dt-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.dt-g-item{background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.dt-g-item:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(38,32,26,.14)}
.dt-g-item figure{overflow:hidden;aspect-ratio:4/3;background:#efe9e0}
.dt-g-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.dt-g-item:hover img{transform:scale(1.06)}
.dt-g-item h3{font-size:14.5px;font-weight:500;padding:12px 14px 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#4d4337}
.dt-g-item:hover h3{color:var(--brand)}

/* 办公地毯分栏 */
.dt-split{display:grid;grid-template-columns:5fr 7fr;gap:34px;align-items:center}
.dt-split-img{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.dt-split-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3.2}
.dt-split .dt-gallery{grid-template-columns:repeat(3,1fr);gap:14px}
.dt-split .dt-g-item h3{padding:9px 10px 11px;font-size:13px}

/* ---------- 列表（案例/知识） ---------- */
.dt-two-col{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.dt-l-list li{border-bottom:1px dashed var(--line)}
.dt-l-list li:last-child{border-bottom:0}
.dt-l-list a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 4px}
.dt-l-list .dt-l-title{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#4d4337}
.dt-l-list time{color:#b3a899;font-size:13px;font-family:Consolas,monospace;white-space:nowrap}
.dt-l-list a:hover .dt-l-title{color:var(--brand)}
.dt-l-list li::before{content:none}

/* ---------- 品牌/数字 ---------- */
.dt-brand{display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:center}
.dt-brand p{color:#5c5245;margin-top:14px}
.dt-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.dt-stat{background:var(--card);border-radius:var(--radius);padding:26px 20px;text-align:center;box-shadow:var(--shadow)}
.dt-stat b{display:block;font-size:34px;color:var(--brand);font-weight:800;line-height:1.2}
.dt-stat span{font-size:13.5px;color:var(--muted)}

/* ---------- CTA 横幅 ---------- */
.dt-cta{background:linear-gradient(120deg,#a4662f,#c9884b 55%,#a4662f);color:#fff;padding:58px 0;text-align:center}
.dt-cta h2{font-size:clamp(24px,3.4vw,34px);font-weight:800;letter-spacing:2px}
.dt-cta p{margin:12px 0 26px;color:#fdf3e7;font-size:15.5px}
.dt-cta .dt-btn{background:#fff;color:var(--brand-2)}
.dt-cta .dt-btn:hover{transform:translateY(-2px);color:var(--brand)}

/* ---------- 内页头部横带 ---------- */
.dt-pagehead{position:relative;color:#fff;padding:56px 0 46px;
  background:linear-gradient(rgba(26,18,11,.62),rgba(26,18,11,.5)),url("/skin/ditanlao/img/hero_office.jpg") center 60%/cover no-repeat}
.dt-pagehead h1,.dt-pagehead-t{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:1px}
.dt-pagehead h1 small,.dt-pagehead-t small{display:block;font-size:13px;font-weight:400;letter-spacing:3px;color:#e8cdb0;margin-top:6px}
.dt-crumb{margin-top:14px;font-size:13.5px;color:#e9dccb}
.dt-crumb a{color:#f0e2cf}
.dt-crumb a:hover{color:#fff}

/* ---------- 内页内容 ---------- */
.dt-article{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:40px 44px;margin-top:-34px;position:relative}
.dt-article h1{font-size:26px;font-weight:700;line-height:1.4}
.dt-article-meta{color:#b3a899;font-size:13.5px;margin:10px 0 24px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.dt-text{font-size:16.5px;color:#3c342b;overflow-wrap:break-word}
.dt-text p{margin:0 0 14px}
.dt-text img{border-radius:10px;margin:10px auto}
.dt-text h2{font-size:20px;margin:26px 0 12px;padding-left:12px;border-left:4px solid var(--brand)}
.dt-text h3{font-size:17px;margin:20px 0 10px}
.dt-pagelink{text-align:center;margin:22px 0;color:var(--muted)}
.dt-prevnext{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
.dt-prevnext a{font-size:14px;color:#5c5245;background:#f8f4ee;border-radius:10px;padding:12px 16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dt-prevnext a:hover{color:var(--brand);background:#f4ecdf}

/* ---------- 分页 ---------- */
.pager{margin-top:38px;text-align:center;line-height:2.4;font-size:14px;color:var(--muted)}
.pager a{display:inline-block;padding:5px 13px;margin:0 3px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#5c5245}
.pager a:hover{border-color:var(--brand);color:var(--brand)}
.pager b,.pager .cur{display:inline-block;padding:5px 13px;margin:0 3px;border-radius:8px;background:var(--brand);color:#fff;font-weight:600}
.pager select{padding:4px 8px;border-radius:8px;border:1px solid var(--line);color:#5c5245}

/* ---------- 封面页子栏目块 ---------- */
.dt-sub-block{margin-bottom:36px}
.dt-sub-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.dt-sub-head h3{font-size:20px;font-weight:700;padding-left:12px;border-left:4px solid var(--brand)}

/* ---------- 友情链接 ---------- */
.dt-links{padding:30px 0;font-size:13.5px;color:var(--muted)}
.dt-links h4{font-size:14px;color:#a2958a;margin-bottom:10px;letter-spacing:1px}
.dt-links ul{display:flex;flex-wrap:wrap;gap:8px 18px}
.dt-links a:hover{color:var(--brand)}

/* ---------- 页脚 ---------- */
.dt-footer{background:var(--dark);color:#b8ab9c;margin-top:30px}
.dt-footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1.15fr 1.1fr 1fr 1.25fr;gap:30px;padding:52px 20px 40px}
.dt-footer-logo{height:44px;width:auto;margin-bottom:16px}
.dt-footer h4{color:#f0e6d8;font-size:15.5px;margin-bottom:14px;letter-spacing:1px}
.dt-footer a{display:block;padding:3.5px 0;font-size:14px;color:#b8ab9c}
.dt-footer a:hover{color:#f0b078}
.dt-footer p{font-size:14px}
.dt-footer-bar{border-top:1px solid rgba(255,255,255,.08);padding:18px 0;font-size:13px;text-align:center;color:#8a7d6f}
.dt-footer-bar a{display:inline;color:#8a7d6f}
.dt-footer-bar a:hover{color:#f0b078}

/* ---------- 浮动元素 ---------- */
.dt-m-fix{position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;background:linear-gradient(90deg,var(--brand),#c9884b);color:#fff;text-align:center;padding:13px;font-size:16px;font-weight:700;letter-spacing:1px;box-shadow:0 -6px 20px rgba(0,0,0,.18)}
.dt-gotop{position:fixed;right:22px;bottom:26px;z-index:90;width:46px;height:46px;border-radius:12px;border:0;background:#fff;color:var(--brand);font-size:20px;cursor:pointer;box-shadow:0 8px 24px rgba(38,32,26,.18);opacity:0;pointer-events:none;transition:.25s}
.dt-gotop.show{opacity:1;pointer-events:auto}
.dt-gotop:hover{background:var(--brand);color:#fff}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .dt-gallery{grid-template-columns:repeat(2,1fr);gap:12px}
  .dt-split{grid-template-columns:1fr}
  .dt-two-col{grid-template-columns:1fr}
  .dt-brand{grid-template-columns:1fr}
  .dt-footer-grid{grid-template-columns:1fr 1fr;padding:40px 20px 30px}
  .dt-article{padding:26px 20px}
}
@media (max-width:1120px){
  .dt-header-in{gap:16px}
  .dt-nav{gap:0}
  .dt-nav a{padding:8px 9px;font-size:14.5px}
  .dt-tel span{display:none}
  .dt-tel b{font-size:17px}
}
/* 窄屏切换为汉堡菜单 */
@media (max-width:920px){
  .dt-header-in{height:62px}
  .dt-logo img{height:38px}
  .dt-nav{position:fixed;top:62px;left:0;right:0;background:#fff;flex-direction:column;padding:10px 16px 16px;gap:2px;display:none;box-shadow:0 20px 40px rgba(38,32,26,.15);max-height:calc(100vh - 62px);overflow-y:auto}
  .dt-nav.open{display:flex}
  .dt-nav a{padding:12px 10px;border-bottom:1px solid var(--line);font-size:16px}
  .dt-nav > a{border-bottom:1px solid var(--line)}
  .dt-tel{display:none}
  .dt-header-cta{margin-left:auto}
  .dt-burger{display:block}
}
@media (max-width:760px){
  .dt-hero{min-height:480px;height:auto;padding:90px 0 70px}
  .dt-section{padding:44px 0}
  .dt-m-fix{display:block}
  body{padding-bottom:52px}
  .dt-footer-grid{grid-template-columns:1fr}
  .dt-prevnext{grid-template-columns:1fr}
  .dt-gotop{bottom:70px}
}

/* ---------- 服务流程 ---------- */
.dt-flow-sec{padding-bottom:64px}
.dt-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:8px}
.dt-flow-step{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px 16px 22px;text-align:center;transition:transform .25s,box-shadow .25s}
.dt-flow-step:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(38,32,26,.12)}
.dt-flow-step i{font-style:normal;display:inline-flex;width:46px;height:46px;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(160deg,var(--brand),var(--brand-2));color:#fff8ef;font-size:20px;margin-bottom:12px}
.dt-flow-step b{position:absolute;top:12px;left:16px;font-size:13px;font-weight:800;color:#e2cfb6;letter-spacing:1px}
.dt-flow-step h3{font-size:16.5px;font-weight:800;margin:0 0 6px;letter-spacing:.5px}
.dt-flow-step p{font-size:13.5px;line-height:1.75;color:var(--muted);margin:0}
.dt-flow-step:not(:last-child)::after{content:"›";position:absolute;top:40px;right:-15px;z-index:1;font-size:24px;font-weight:800;color:#d3a06b;line-height:1}
@media(max-width:920px){
  .dt-flow{grid-template-columns:repeat(2,1fr)}
  .dt-flow-step:last-child{grid-column:1/-1}
  .dt-flow-step::after{display:none}
}

/* ===== 导航下拉子栏目 ===== */
.dt-drop{position:relative}
.dt-caret{display:inline-block;width:7px;height:7px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:rotate(45deg);margin-left:5px;margin-bottom:3px;transition:.2s;opacity:.55}
.dt-drop:hover .dt-caret{transform:rotate(225deg);margin-bottom:0;margin-top:3px}
.dt-drop::after{content:"";position:absolute;top:100%;left:0;right:0;height:10px}
.dt-drop-panel{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(6px);background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 44px rgba(38,32,26,.14);padding:8px;min-width:186px;display:flex;flex-direction:column;gap:1px;opacity:0;visibility:hidden;transition:.18s ease;z-index:60}
.dt-drop:hover .dt-drop-panel,.dt-drop:focus-within .dt-drop-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dt-drop-panel a{padding:9px 14px;font-size:14.5px;border-radius:8px;color:#4d4337;white-space:nowrap;font-weight:400}
.dt-drop-panel a:hover{background:#f6efe6;color:var(--brand)}
@media (max-width:920px){
  .dt-drop{display:flex;flex-direction:column}
  .dt-drop::after{display:none}
  .dt-drop-panel{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;border:0;background:transparent;padding:0 0 2px 14px;min-width:0;display:none;border-radius:0}
  .dt-nav.open .dt-drop-panel{display:flex}
  .dt-drop-panel a{border-bottom:1px solid var(--line);font-size:15px;padding:10px 8px;color:#7a6f60}
}