/* ============================================================
   sigong.html · 信号司索工证页
   区块前缀 sg-
   ============================================================ */

/* ---------- Hero：左文右手势图解墙 ---------- */
.sg-hero{position:relative;overflow:hidden;padding:calc(var(--header-h) + 56px) 0 88px}
.sg-hero__bg{position:absolute;inset:0}
.sg-hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 40%;opacity:.34}
.sg-hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(21,24,27,.95) 30%,rgba(21,24,27,.78) 60%,rgba(21,24,27,.55))}
.sg-hero__inner{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.sg-hero__crumbs{padding:0;margin-bottom:20px}
.sg-hero__kick{display:block;font-family:var(--font-en);font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--o1);margin-bottom:16px}
.sg-hero h1{font-size:clamp(34px,5vw,56px);font-weight:900;line-height:1.15}
.sg-hero h1 em{font-style:normal;color:var(--o2)}
.sg-hero__desc{margin-top:20px;font-size:16px;line-height:1.8;color:var(--g4);max-width:540px}
.sg-hero__desc a{color:var(--o1)}
.sg-hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
/* 右置手势墙 */
.sg-hero__wall{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sg-hero__cell{background:rgba(21,24,27,.6);border:1px solid rgba(224,91,32,.4);padding:20px 12px;text-align:center;backdrop-filter:blur(2px)}
.sg-hero__cell svg{width:64px;height:64px;margin:0 auto 12px}
.sg-hero__cell b{display:block;font-size:14px;color:var(--white);margin-bottom:4px}
.sg-hero__cell span{font-size:12px;color:var(--g4)}

/* ---------- 岗位两摊活 ---------- */
.sg-role{background:var(--c1)}
.sg-role__grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.sg-role__card{padding:34px 32px;background:var(--c2);border:1px solid var(--line-d);border-top:3px solid var(--o1)}
.sg-role__tag{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;padding:4px 12px;background:var(--o1);color:#fff;margin-bottom:16px}
.sg-role__card h3{font-size:21px;margin-bottom:16px}
.sg-role__card ul li{padding:10px 0 10px 22px;position:relative;font-size:14.5px;color:var(--g4);border-bottom:1px dashed var(--line-d)}
.sg-role__card ul li:last-child{border-bottom:none}
.sg-role__card ul li::before{content:"";position:absolute;left:0;top:18px;width:12px;height:2px;background:var(--o1)}

/* ---------- 手势图解 ---------- */
.sg-sign__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sg-sign__item{padding:28px 24px;background:#fff;border:1px solid var(--line-l);text-align:center}
.sg-sign__item svg{width:56px;height:56px;margin:0 auto 16px}
.sg-sign__item h3{font-size:17px;color:var(--c1);margin-bottom:8px}
.sg-sign__item p{font-size:13.5px;color:#5A6158;line-height:1.7}

/* ---------- 报考条件 ---------- */
.sg-req__grid{display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:start}
.sg-req__list li{display:flex;gap:12px;padding:14px 0;border-bottom:1px dashed var(--line-d);font-size:14.5px;color:var(--g4)}
.sg-req__list li b{flex-shrink:0;width:52px;color:var(--white)}
.sg-req__aside{background:var(--c2);border:1px solid var(--line-d);padding:28px;border-top:3px solid var(--o1)}
.sg-req__aside h3{font-size:19px;margin-bottom:16px}
.sg-req__aside p{font-size:14px;color:var(--g4);margin-bottom:12px}
.sg-req__aside p b{color:var(--white)}
.sg-req__aside a{display:inline-flex;align-items:center;gap:6px;color:var(--o1);font-weight:700;font-size:14px}

/* ---------- 安全红线 ---------- */
.sg-safety{background:var(--c2)}
.sg-safety__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.sg-safety__item{padding:26px 22px;background:var(--c1);border-left:4px solid var(--o1)}
.sg-safety__item h3{font-size:17px;margin-bottom:8px}
.sg-safety__item p{font-size:13.5px;color:var(--g4);line-height:1.7}
.sg-safety__link{margin-top:32px;text-align:center;font-size:14px;color:var(--g4)}
.sg-safety__link a{color:var(--o1);font-weight:700;margin:0 4px}

/* ---------- 师傅提醒图带 ---------- */
.sg-band{position:relative;overflow:hidden;padding:90px 0}
.sg-band__bg{position:absolute;inset:0}
.sg-band__bg img{width:100%;height:100%;object-fit:cover;opacity:.22}
.sg-band__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--c1),rgba(21,24,27,.85))}
.sg-band__inner{position:relative;max-width:760px}
.sg-band blockquote{font-size:clamp(22px,3vw,32px);font-weight:900;line-height:1.4;color:var(--white);border-left:4px solid var(--o1);padding-left:22px;margin-bottom:16px}
.sg-band p{font-size:14.5px;color:var(--g4)}

/* ---------- 常见问答 ---------- */
.sg-faq{background:var(--c2)}
.sg-faq__list{max-width:880px}
.sg-faq__item{padding:22px 0;border-bottom:1px dashed var(--line-d)}
.sg-faq__item h3{font-size:17px;margin-bottom:8px;color:var(--white)}
.sg-faq__item p{font-size:14px;color:var(--g4);line-height:1.75}

/* ---------- CTA ---------- */
.sg-cta{background:linear-gradient(150deg,var(--g1),var(--c1))}
.sg-cta__inner{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:center}
.sg-cta__inner h2{font-size:clamp(26px,3.4vw,40px);font-weight:900;line-height:1.25;margin:14px 0 16px}
.sg-cta__inner p{color:var(--g4);font-size:15px;max-width:460px}
.sg-cta__tel{display:inline-flex;flex-direction:column;margin-top:26px;font-family:var(--font-en);font-weight:900;font-size:34px;color:var(--o1)}
.sg-cta__tel small{font-family:var(--font-cn);font-weight:400;font-size:13px;color:var(--g4);margin-top:4px}
.sg-cta__form{background:var(--c2);border:1px solid var(--line-d);padding:32px;border-top:3px solid var(--o1)}
.sg-cta__form h3{font-size:19px;margin-bottom:18px}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .sg-hero__inner{grid-template-columns:1fr;gap:32px}
  .sg-role__grid{grid-template-columns:1fr}
  .sg-sign__grid{grid-template-columns:1fr 1fr}
  .sg-req__grid{grid-template-columns:1fr;gap:28px}
  .sg-safety__grid{grid-template-columns:1fr 1fr}
  .sg-cta__inner{grid-template-columns:1fr;gap:36px}
}
@media (max-width:640px){
  .sg-sign__grid{grid-template-columns:1fr}
  .sg-safety__grid{grid-template-columns:1fr}
  .sg-hero__wall{grid-template-columns:repeat(3,1fr);gap:10px}
  .sg-hero__cell svg{width:48px;height:48px}
}
