/* ============================================================
   fufu.html 证书复审独有样式（命名空间 .ff-）
   ============================================================ */

/* ---------- Hero：三年倒计时 ---------- */
.ff-hero{position:relative;background:var(--c1);padding-top:var(--header-h);overflow:hidden}
.ff-hero__bg{position:absolute;inset:0}
.ff-hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 35%;opacity:.26}
.ff-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,24,27,.95) 30%,rgba(21,24,27,.55))}
.ff-hero__inner{position:relative;z-index:2;padding:54px 24px 80px}
.ff-hero .crumbs{padding:0 0 26px}
.ff-hero__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}
.ff-hero h1{font-size:clamp(32px,4.8vw,56px);font-weight:900;line-height:1.2;margin-top:10px}
.ff-hero__desc{color:var(--g4);margin-top:16px;max-width:540px}
/* 巨大描边倒计时数字 */
.ff-hero__count{text-align:center;position:relative}
.ff-hero__count b{font-family:var(--font-en);font-size:clamp(120px,16vw,200px);font-weight:900;line-height:1;color:transparent;-webkit-text-stroke:2.5px var(--o1)}
.ff-hero__count b span{font-size:30px;-webkit-text-stroke:0;color:var(--o1);margin-left:8px}
.ff-hero__count em{font-style:normal;display:block;font-family:var(--font-en);font-size:13px;letter-spacing:.4em;color:var(--g3);margin-top:6px}

/* ---------- 复审流程四步（复用 base .steps） ---------- */
.ff-steps{background:var(--c1)}

/* ---------- 复审材料表（米白区） ---------- */
.ff-mat .tbl td:first-child{color:var(--c1);font-weight:700}
.ff-mat .tbl a{color:var(--o1);font-weight:700}

/* ---------- 逾期警示 ---------- */
.ff-overdue{background:var(--c2)}
.ff-overdue__box{display:grid;grid-template-columns:160px 1fr;gap:30px;background:rgba(224,91,32,.08);border:1px solid rgba(224,91,32,.45);border-left:6px solid var(--o1);padding:36px}
.ff-overdue__tag{align-self:start;font-family:var(--font-en);font-size:15px;font-weight:900;letter-spacing:.15em;color:var(--o1)}
.ff-overdue__box h2{font-size:22px;margin-bottom:14px}
.ff-overdue__box p{color:var(--white);font-size:14.5px;line-height:1.9;max-width:680px}
.ff-overdue__sub{margin-top:12px;color:var(--g4)!important;font-size:13.5px!important}

/* ---------- 复审时间线（复用 base .timeline） ---------- */
.ff-life{background:var(--c1)}
.ff-life .timeline__time{color:var(--o2)}

/* ---------- 复审 vs 换证 ---------- */
.ff-diff__grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.ff-diff__card{background:var(--c2);border:1px solid var(--line-d);padding:30px 28px}
.ff-diff__card h3{font-size:19px;margin-bottom:12px;color:var(--o2)}
.ff-diff__card p{font-size:14px;color:var(--g4);line-height:1.8}
.ff-diff__card a{display:inline-block;margin-top:16px;font-size:14px;font-weight:700;color:var(--o1)}
.ff-diff__card a:hover{text-decoration:underline}

/* ---------- 复审通不过的情况 ---------- */
.ff-fail{background:var(--c1)}
.ff-fail__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ff-fail__grid>div{background:var(--c2);border:1px dashed var(--line-d);padding:24px 22px}
.ff-fail__grid b{font-family:var(--font-en);font-size:34px;font-weight:900;color:var(--o1);display:block;line-height:1}
.ff-fail__grid p{font-size:13.5px;color:var(--g4);margin-top:12px;line-height:1.7}

/* ---------- 页底 CTA ---------- */
.ff-cta{background:var(--paper);color:var(--c1)}
.ff-cta h2{color:var(--c1)}
.ff-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap}
.ff-cta__inner p{color:#5A6158;margin-top:10px;max-width:480px}
.ff-cta__inner a{color:var(--o1);font-weight:700}
.ff-cta__inner a:hover{text-decoration:underline}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .ff-hero__grid{grid-template-columns:1fr}
  .ff-fail__grid{grid-template-columns:1fr 1fr}
  .ff-diff__grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ff-overdue__box{grid-template-columns:1fr}
  .ff-fail__grid{grid-template-columns:1fr}
}

/* ---------- 复审材料表列宽 ---------- */
.ff-tcols col:nth-child(1){width:24%}
.ff-tcols col:nth-child(2){width:46%}
.ff-tcols col:nth-child(3){width:30%}

/* ---------- Hero 四步横排 ---------- */
.ff-hero__steps{display:flex;align-items:center;gap:0;margin-top:30px;border:1px solid var(--line-d);background:rgba(30,35,41,.85);max-width:760px}
.ff-hero__steps>span{flex:1;padding:14px 18px;font-size:13px;color:var(--g4)}
.ff-hero__steps b{font-family:var(--font-en);font-size:15px;color:var(--o1);margin-right:8px}
.ff-hero__steps>i{font-style:normal;color:var(--o1)}
/* 到期自查工具 */
.ff-check{background:var(--c2)}
.ff-check__box{display:grid;grid-template-columns:1fr 1fr;gap:26px;max-width:880px;margin:0 auto;background:var(--c1);border:1px dashed var(--line-d);padding:30px}
.ff-check__form{display:flex;flex-direction:column;gap:16px;justify-content:center}
.ff-check__form label{font-size:13.5px;color:var(--g4)}
.ff-check__form input{margin-top:8px;width:100%;background:var(--c2);border:1px solid var(--line-d);color:#fff;padding:12px 14px;font-size:15px}
.ff-check__result{background:var(--c2);border-left:4px solid var(--o1);padding:22px 24px}
.ff-check__result b{font-size:17px;color:var(--o1);display:block;margin-bottom:8px}
.ff-check__result p{font-size:14px;color:var(--g4);line-height:1.8}
/* 培训考场实拍 */
.ff-class__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ff-class__card{background:#fff;border:1px solid var(--line-l);overflow:hidden}
.ff-class__card img{width:100%;height:240px;object-fit:cover}
.ff-class__card h3{font-size:18px;color:var(--c1);margin:16px 22px 8px}
.ff-class__card p{font-size:13.5px;color:#5A6158;padding:0 22px 22px;line-height:1.8}
/* 复审未通过引导 */
.ff-failguide{background:var(--c1)}
.ff-failguide__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ff-failguide__grid>div{background:var(--c2);border:1px solid var(--line-d);padding:26px 24px}
.ff-failguide__grid b{display:block;font-size:16px;color:var(--o1);margin-bottom:10px}
.ff-failguide__grid p{font-size:13.5px;color:var(--g4);line-height:1.8}
.ff-failguide__grid a{color:var(--o2);font-weight:700}
@media (max-width:1024px){.ff-check__box{grid-template-columns:1fr}.ff-class__grid{grid-template-columns:1fr}.ff-failguide__grid{grid-template-columns:1fr}.ff-hero__steps{flex-wrap:wrap}.ff-hero__steps>i{display:none}.ff-hero__steps>span{flex:1 1 40%}}
