/* ============================================================
   tuanti-baoming.html · 团体批量报名服务
   题头③：顶部色带 + 面包屑 + 标题
   ============================================================ */

/* ---------- 题头：顶部色带 ---------- */
.tt-band{
  background:linear-gradient(120deg,var(--orange) 0%, var(--orange-deep) 55%, #C74A00 100%);
  padding:120px 0 40px; color:#fff;
}
.tt-crumbs{
  display:flex; flex-wrap:wrap; gap:8px; font-size:13px; color:rgba(255,255,255,.85); margin-bottom:20px;
}
.tt-crumbs a{ color:#fff; }
.tt-crumbs a:hover{ color:#FFF1E0; }
.tt-sep{ color:rgba(255,255,255,.5); }
.tt-title{ font-size:42px; font-weight:800; letter-spacing:1px; }
.tt-sub{ margin-top:14px; max-width:720px; color:rgba(255,255,255,.94); font-size:16px; line-height:1.9; }

/* ---------- 题头大图 ---------- */
.tt-band-img{ padding:34px 0 10px; background:var(--white); }
.tt-hero-img{
  width:100%; height:300px; object-fit:cover; border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
}

/* ---------- 团体价值：数字大卡 ---------- */
.tt-value{ background:var(--white); }
.tt-vgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.tt-vcard{
  background:var(--bg-soft); border-radius:var(--radius-lg); padding:28px 22px;
  border-bottom:4px solid var(--green); transition:transform .28s ease, box-shadow .28s ease;
}
.tt-vcard:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.tt-vnum{
  display:block; font-size:34px; font-weight:800; color:var(--orange-deep); line-height:1.2;
}
.tt-vcard h3{ margin:8px 0 10px; font-size:18px; }
.tt-vcard p{ font-size:14px; color:var(--ink-2); line-height:1.85; }

/* ---------- 适用场景：2x2 卡片 ---------- */
.tt-scene{ background:var(--bg-green); }
.tt-sgrid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.tt-scard{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:28px 26px; box-shadow:var(--shadow-sm);
}
.tt-stag{
  display:inline-block; font-size:12px; font-weight:700; letter-spacing:1px;
  color:var(--green-deep); background:var(--green-soft); padding:4px 12px; border-radius:999px; margin-bottom:12px;
}
.tt-scard h3{ font-size:19px; margin-bottom:10px; }
.tt-scard p{ font-size:14.5px; color:var(--ink-2); line-height:1.9; }

/* ---------- 团体流程：步骤流 ---------- */
.tt-flow{ background:var(--white); }
.tt-flow-steps{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; margin-top:24px; }
.tt-flow-steps li{
  position:relative; background:var(--bg-orange); border-radius:var(--radius);
  padding:24px 18px 20px; border:1px solid #FFE3CC;
}
.tt-fs{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%; font-weight:800; color:#fff;
  background:linear-gradient(135deg,var(--green),var(--green-deep)); margin-bottom:12px;
}
.tt-flow-steps h3{ font-size:16px; margin-bottom:8px; }
.tt-flow-steps p{ font-size:13.5px; color:var(--ink-2); line-height:1.8; }

/* ---------- 材料组织：左右 + 表格 ---------- */
.tt-material{ background:var(--bg-soft); }
.mat-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:44px; align-items:center; }
.mat-p{ margin:14px 0 18px; color:var(--ink-2); font-size:15px; line-height:1.9; }
.mat-list{ display:flex; flex-direction:column; gap:10px; }
.mat-list li{
  position:relative; padding-left:26px; font-size:14.5px; color:var(--ink);
}
.mat-list li::before{
  content:""; position:absolute; left:0; top:8px; width:12px; height:12px;
  border-radius:3px; background:linear-gradient(135deg,var(--orange),var(--green));
}
.mat-table-wrap{
  background:#fff; border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-md); border:1px solid var(--line);
}
.mat-table{ width:100%; border-collapse:collapse; font-size:14.5px; }
.mat-table th{
  background:var(--ink); color:#fff; text-align:left; padding:14px 18px; font-weight:700;
}
.mat-table td{ padding:13px 18px; border-top:1px solid var(--line); color:var(--ink-2); }
.mat-table tbody tr:hover{ background:var(--bg-orange); }

/* ---------- 企业对接 ---------- */
.tt-contact{ background:var(--white); }
.tc-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:44px; align-items:center; }
.tc-fig{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); }
.tc-fig img{ width:100%; height:320px; object-fit:cover; }
.tc-p{ margin:14px 0 20px; color:var(--ink-2); font-size:15px; line-height:1.9; }
.tc-p a{ color:var(--green-deep); font-weight:600; }
.tc-card{
  background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:20px 24px; display:flex; flex-direction:column; gap:14px;
}
.tc-row{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.tc-lab{
  flex-shrink:0; width:80px; font-size:13px; font-weight:700; color:var(--ink-3);
}
.tc-row a{ color:var(--orange-deep); font-weight:700; font-size:16px; }
.tc-tip{ margin-top:16px; font-size:13.5px; color:var(--ink-3); }
.tc-tip a{ color:var(--green-deep); font-weight:600; }

/* ---------- 常见问答 ---------- */
.tt-faq{ background:var(--bg-orange); }
.tt-qalist{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.tt-qa{
  background:#fff; border-radius:var(--radius); padding:24px 24px 22px;
  border:1px solid var(--line); box-shadow:var(--shadow-sm);
}
.tt-qtag{
  display:inline-block; font-size:12px; font-weight:700; color:#fff;
  background:var(--orange); padding:3px 12px; border-radius:999px; margin-bottom:12px;
}
.tt-qa h3{ font-size:16.5px; margin-bottom:8px; }
.tt-qa p{ font-size:14px; color:var(--ink-2); line-height:1.85; }

/* ---------- 底部行动带 ---------- */
.tt-cta{
  background:linear-gradient(120deg,var(--green-deep) 0%, #12B76A 100%);
  padding:56px 0;
}
.tt-cta-inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:22px; color:#fff; }
.tt-cta-copy h2{ font-size:26px; font-weight:800; }
.tt-cta-copy p{ margin-top:8px; max-width:540px; color:rgba(255,255,255,.92); font-size:15px; line-height:1.8; }
.tt-cta-actions{ display:flex; flex-wrap:wrap; gap:14px; }
.btn-ghost.btn-white{ border-color:#fff; color:#fff; }
.btn-ghost.btn-white:hover{ background:rgba(255,255,255,.14); color:#fff; }

/* ---------- 响应式 ---------- */
@media (max-width:980px){
  .tt-title{ font-size:32px; }
  .tt-vgrid{ grid-template-columns:repeat(2,1fr); }
  .tt-sgrid{ grid-template-columns:1fr; }
  .tt-flow-steps{ grid-template-columns:repeat(2,1fr); }
  .mat-grid, .tc-grid{ grid-template-columns:1fr; gap:30px; }
  .tt-qalist{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .tt-band{ padding:110px 0 30px; }
  .tt-hero-img{ height:200px; }
  .tt-vgrid{ grid-template-columns:1fr; }
  .tt-flow-steps{ grid-template-columns:1fr; }
}