/* ============================================================================
   qiye-tuanti.html 企业团体报名专属样式（复古美式工业风）
   ========================================================================== */

/* ---------- 题头：全幅图深色Banner ---------- */
.t-head{position:relative;min-height:520px;display:flex;align-items:flex-end;overflow:hidden}
.t-head-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.t-head-mask{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(15,33,24,.72) 0%,rgba(36,20,7,.82) 60%,rgba(36,20,7,.92) 100%);
}
.t-head-inner{position:relative;z-index:2;padding:calc(var(--header-h) + 60px) 0 64px;color:var(--cream-100)}
.t-head .crumb{margin-bottom:18px}
.t-head h1{
  font-size:clamp(30px,4.6vw,52px);color:var(--cream-50);max-width:820px;line-height:1.18;
  border-left:6px solid var(--brass);padding-left:22px;
}
.t-head-sub{font-size:16px;color:var(--cream-200);max-width:760px;margin:20px 0 28px;line-height:1.9}
.t-head-actions{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- 为什么走团体通道 ---------- */
.t-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.t-why-item{
  background:var(--cream-50);border:1px solid var(--line);border-top:4px solid var(--green-600);
  padding:28px 24px;position:relative;transition:transform .3s ease,box-shadow .3s ease;
}
.t-why-item::before{
  content:"";position:absolute;top:12px;right:14px;width:8px;height:8px;
  background:var(--brass);border-radius:50%;box-shadow:14px 0 0 var(--line);
}
.t-why-item:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.t-why-item h3{font-size:19px;color:var(--brown-800);margin-bottom:10px}
.t-why-item p{font-size:14.5px;color:var(--ink-soft);line-height:1.85}

/* ---------- 对比表 ---------- */
.t-compare-table{table-layout:auto}
.t-compare-table td:nth-child(2){color:var(--muted)}
.t-compare-table td:nth-child(3){color:var(--green-800)}
.t-compare-note{margin-top:16px;font-size:13px;color:var(--muted);border-left:3px solid var(--brass);padding-left:12px}

/* ---------- 五步流程：横向步进箭头 ---------- */
.t-flow-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;counter-reset:step}
.t-flow-steps li{
  position:relative;padding:0 16px 0 0;text-align:center;
}
.t-flow-steps li:not(:last-child)::after{
  content:"";position:absolute;top:26px;right:-6px;width:12px;height:12px;
  border-top:2px solid var(--brass);border-right:2px solid var(--brass);
  transform:rotate(45deg);z-index:2;
}
.t-flow-dot{
  display:inline-flex;width:52px;height:52px;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:18px;font-weight:700;color:var(--cream-50);
  background:var(--green-800);border:2px solid var(--brass);border-radius:50%;margin-bottom:14px;
}
.t-flow-steps h3{font-size:16.5px;color:var(--brown-800);margin-bottom:8px}
.t-flow-steps p{font-size:13px;color:var(--muted);line-height:1.8;text-align:left}

/* ---------- 场景（深棕底棋盘） ---------- */
.t-scene{background:var(--brown-800);color:var(--cream-100)}
.t-scene .sec-head h2{color:var(--cream-50)}
.t-scene .sec-lead{color:var(--cream-200)}
.t-scene-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.t-scene-card{
  background:rgba(251,247,236,.06);border:1px solid var(--line-dark);border-left:4px solid var(--brass);
  padding:24px 26px;transition:background .25s ease;
}
.t-scene-card:hover{background:rgba(251,247,236,.12)}
.t-scene-card h3{color:var(--brass-light);font-size:18px;margin-bottom:8px}
.t-scene-card p{font-size:14px;color:var(--cream-200);line-height:1.85}

/* ---------- 我们替企业做的事（铆钉角标卡） ---------- */
.t-done-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.t-done-card{
  background:var(--cream-50);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:26px 22px;box-shadow:inset 0 0 0 4px var(--cream-100);position:relative;
  transition:transform .3s ease,border-color .3s ease;
}
.t-done-card:hover{transform:translateY(-4px);border-color:var(--brass)}
.t-done-card::before,.t-done-card::after{
  content:"";position:absolute;width:7px;height:7px;background:var(--brown-600);border-radius:50%;
}
.t-done-card::before{top:9px;left:9px}
.t-done-card::after{bottom:9px;right:9px}
.t-done-badge{
  display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;
  background:var(--brass);color:var(--cream-50);font-family:var(--font-display);font-weight:700;
  border-radius:var(--r-xs);margin-bottom:12px;
}
.t-done-card h3{font-size:17px;color:var(--brown-800);margin-bottom:8px}
.t-done-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.8}
.t-done-note{margin-top:26px;font-size:13.5px;color:var(--muted);max-width:820px}

/* ---------- 表单区 ---------- */
.t-form-sec{background:var(--green-900)}
.t-form-wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:center}
.t-form-text h2{color:var(--cream-50);font-size:clamp(24px,3vw,36px);margin-bottom:14px}
.t-form-text p{color:var(--cream-200);font-size:15px;line-height:1.9;margin-bottom:18px}
.t-form-points{display:flex;flex-direction:column;gap:10px}
.t-form-points li{
  padding-left:20px;position:relative;color:var(--cream-100);font-size:14px;
}
.t-form-points li::before{content:"▸";position:absolute;left:0;color:var(--brass)}
.t-form-card h3{font-size:19px;color:var(--brown-800);margin-bottom:18px;padding-bottom:12px;border-bottom:2px solid var(--brass)}
.t-submit{width:100%}

/* ---------- 底部行动带 ---------- */
.t-foot{padding:64px 0;position:relative;overflow:hidden;text-align:center}
.t-foot-inner{position:relative;z-index:2}
.t-foot-stamp{
  position:absolute;right:-30px;top:-30px;width:150px;height:150px;display:flex;align-items:center;justify-content:center;
  border:3px solid var(--brass);border-radius:50%;color:var(--brass-light);
  font-family:var(--font-display);font-size:15px;letter-spacing:.3em;transform:rotate(18deg);opacity:.55;
}
.t-foot h2{color:var(--cream-50);font-size:clamp(24px,3.2vw,36px);margin-bottom:12px}
.t-foot p{color:var(--cream-200);max-width:640px;margin:0 auto 26px;line-height:1.9}
.t-foot-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .t-why-grid,.t-done-grid{grid-template-columns:1fr}
  .t-flow-steps{grid-template-columns:1fr 1fr;gap:24px}
  .t-flow-steps li:not(:last-child)::after{display:none}
  .t-scene-grid{grid-template-columns:1fr}
  .t-form-wrap{grid-template-columns:1fr}
}
@media (max-width:560px){
  .t-flow-steps{grid-template-columns:1fr}
  .t-head h1{padding-left:14px}
}
