/* =====================================================================
   会宁县福隆劳务服务有限公司 · 官网统一样式（企业正式风 V2）
   设计取向：宽幅、沉稳深蓝、实色描边、克制留白、专业图标
   对齐参考：guangdianhr.com 等成熟企业站的表现形式
   （保留 --brand / --text-2 / --line 等变量名以兼容页面内联样式）
   ===================================================================== */
:root{
  /* 品牌色：沉稳企业蓝（比小程序蓝更深，传达可信） */
  --brand:#1677ff;
  --brand-2:#2a6fd0;
  --brand-deep:#0c2340;                       /* 深navy，用于 Banner 底色 */
  --brand-grad:linear-gradient(120deg,#0c2340 0%,#1455b8 55%,#1677ff 100%);
  --brand-grad-2:linear-gradient(120deg,#1f2a44 0%,#33415c 100%);

  --ink:#16202e;                              /* 标题近黑 */
  --text:#333a45;                             /* 正文 */
  --text-2:#5b6573;
  --text-3:#8a93a0;
  --text-4:#aeb6c2;
  --orange:#d4380d;                           /* 保留：岗位薪资等强调 */
  --orange-2:#ff9f0a;
  --orange-bg:#fff7e6;

  --page-bg:#f4f6f9;                          /* 页面浅灰底 */
  --blue-bg:#eaf1fb;                          /* 浅蓝底（标签/悬停） */
  --gray-bg:#f1f3f7;
  --card:#ffffff;
  --line:#e6e9ef;                             /* 描边 */
  --line-strong:#d6dbe4;

  --radius:8px;                               /* 正式：小圆角 */
  --radius-lg:14px;
  --shadow:0 1px 3px rgba(16,24,40,.06),0 1px 2px rgba(16,24,40,.04);
  --shadow-lg:0 8px 24px rgba(16,24,40,.10);
  --container:1180px;                         /* 宽幅企业级容器 */
  --nav-h:62px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Microsoft YaHei","PingFang SC","Segoe UI",sans-serif;
  color:var(--text);
  background:var(--page-bg);
  font-size:15px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--brand);text-decoration:none;}
img{max-width:100%;display:block;}

/* ============ 布局容器 ============ */
.wrap{max-width:var(--container);margin:0 auto;padding:0 24px;}

/* ============ 顶部全局导航（实色白条 + 激活下划线） ============ */
.site-nav{
  position:sticky;top:0;z-index:50;
  background:#fff;
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;
  height:var(--nav-h);
  /* 内容对齐到容器宽度（全宽白条 + 容器化内容，免改 HTML） */
  padding-left:max(16px, calc((100vw - var(--container)) / 2 + 24px));
  padding-right:max(16px, calc((100vw - var(--container)) / 2 + 24px));
}
.nav-brand{flex-shrink:0;display:flex;align-items:center;gap:10px;}
.nav-brand img{width:38px;height:38px;border-radius:9px;object-fit:cover;box-shadow:0 2px 6px rgba(0,0,0,.12);}
.nav-links{
  display:flex;align-items:stretch;gap:2px;margin-left:auto;height:100%;
}
.nav-links a{
  display:flex;align-items:center;height:100%;
  color:var(--text);font-size:15px;padding:0 15px;position:relative;
  white-space:nowrap;transition:color .15s;
}
.nav-links a::after{
  content:'';position:absolute;left:15px;right:15px;bottom:0;height:3px;
  border-radius:2px;background:var(--brand);opacity:0;transition:opacity .15s;
}
.nav-links a:hover{color:var(--brand);}
.nav-links a.active{color:var(--brand);font-weight:700;}
.nav-links a.active::after{opacity:1;}
.nav-links a.nav-intranet{color:var(--brand);border:1px solid var(--brand);border-radius:6px;margin:auto 0;height:auto;padding:7px 16px;}
.nav-links a.nav-intranet::after{display:none;}
.nav-links a.nav-intranet:hover{background:var(--brand);color:#fff;}

/* ============ 全宽 Banner Hero（企业站标准头图，去小程序感） ============ */
.hero{
  position:relative;overflow:hidden;
  background:var(--brand-grad);
  color:#fff;
  padding-top:72px;padding-bottom:60px;
  /* 内容对齐到容器宽度（全宽背景 + 容器化文字，免改 HTML） */
  padding-left:max(20px, calc((100vw - var(--container)) / 2 + 24px));
  padding-right:max(20px, calc((100vw - var(--container)) / 2 + 24px));
}
/* 细网格纹理，提升质感，避免纯色廉价感 */
.hero::before{
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1.4px);
  background-size:22px 22px;opacity:.5;pointer-events:none;
}
.hero > *{position:relative;}
.hero .logo{display:none;}                       /* 隐藏居中 app 式头像（小程序感来源） */
.hero h1{font-size:38px;font-weight:800;letter-spacing:1px;line-height:1.25;margin-bottom:12px;}
.hero .sub{font-size:16px;opacity:.92;letter-spacing:.4px;max-width:760px;line-height:1.7;}
.hero .sub.sub-brand .mini-logo{display:none;}   /* 隐藏副品牌小图，保持 Banner 整洁 */
.hero .back{
  display:inline-block;margin-top:22px;color:#fff;
  border:1px solid rgba(255,255,255,.55);padding:9px 20px;border-radius:6px;
  font-size:14px;transition:background .15s;
}
.hero .back:hover{background:rgba(255,255,255,.14);}
/* Banner 内主行动按钮（白底实色） */
.hero-cta{
  display:inline-block;margin-top:26px;background:#fff;color:var(--brand);
  font-weight:700;padding:12px 30px;border-radius:6px;font-size:15px;
  box-shadow:0 8px 20px rgba(0,0,0,.20);transition:transform .12s,background .15s;
}
.hero-cta:hover{background:#eef4ff;transform:translateY(-1px);}
.hero.internal{background:var(--brand-grad-2);}

/* ============ 区块标题（左侧实色竖条 + 厚重标题） ============ */
.section-title{
  position:relative;font-size:22px;font-weight:800;color:var(--ink);
  padding-left:16px;margin:42px 0 18px;letter-spacing:.5px;
}
.section-title::before{
  content:'';position:absolute;left:0;top:3px;bottom:3px;
  width:5px;border-radius:3px;background:var(--brand);
}
.section-title:first-child{margin-top:36px;}

/* ============ 卡片（实色描边，正式） ============ */
.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:24px 22px;box-shadow:var(--shadow);
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px);border-color:var(--line-strong);}

/* ============ 标签 / 胶囊 ============ */
.tag{
  display:inline-block;background:var(--blue-bg);color:var(--brand);
  font-size:12px;padding:3px 11px;border-radius:4px;font-weight:600;
}

/* ============ 按钮（规范小圆角，非胶囊） ============ */
.btn-cta{
  display:inline-block;background:var(--brand);color:#fff;
  font-weight:600;padding:12px 30px;border-radius:6px;font-size:15px;
  box-shadow:0 4px 12px rgba(20,85,184,.25);text-decoration:none;
  transition:background .15s, transform .12s;
}
.btn-cta:hover{background:#0f47a0;transform:translateY(-1px);}
.btn-cta:active{transform:scale(.98);}
.back-link{
  display:inline-block;color:var(--brand);border:1px solid var(--brand);
  padding:9px 22px;border-radius:6px;font-size:14px;transition:background .15s,color .15s;
}
.back-link:hover{background:var(--brand);color:#fff;}

/* ============ 特性网格 + 专业图标 ============ */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:8px;}
.features .ic{
  width:54px;height:54px;border-radius:12px;margin-bottom:6px;
  background:linear-gradient(135deg,var(--brand) 0%,#2a6fd0 100%);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;
  box-shadow:0 6px 14px rgba(20,85,184,.25);
}
.features .ic i{font-size:22px;line-height:1;}

/* ============ 多栏企业页脚 ============ */
.site-footer{background:var(--brand-deep);color:#c7d0dc;margin-top:60px;}
.site-footer .ft-inner{
  max-width:var(--container);margin:0 auto;padding:48px 24px 30px;
  display:grid;grid-template-columns:1.7fr 1fr 1fr;gap:36px;
}
.ft-logo{width:48px;height:48px;border-radius:9px;object-fit:cover;margin-bottom:14px;box-shadow:0 4px 10px rgba(0,0,0,.25);}
.ft-name{font-size:16px;font-weight:700;color:#fff;margin-bottom:12px;}
.ft-desc{font-size:13px;line-height:1.85;color:#9fb0c3;max-width:420px;}
.ft-col .ft-h{font-size:15px;font-weight:700;color:#fff;margin-bottom:16px;position:relative;padding-left:12px;}
.ft-col .ft-h::before{content:'';position:absolute;left:0;top:3px;bottom:3px;width:4px;border-radius:2px;background:var(--brand-2);}
.ft-col a,.ft-col .ft-line{display:block;font-size:13px;color:#aebccd;line-height:2.1;text-decoration:none;}
.ft-col a:hover{color:#fff;}
.ft-bottom{
  border-top:1px solid rgba(255,255,255,.10);padding:16px 24px;
  font-size:12px;color:#8a9aad;text-align:center;line-height:1.9;
}
.ft-bottom .beian-badge,.ft-bottom a{color:#aebccd;}
.ft-bottom .beian-badge:hover,.ft-bottom a:hover{color:#fff;}
.ft-bottom .beian-badge img{width:14px;height:16px;display:inline-block;vertical-align:middle;margin-right:3px;}

/* ============ 内部系统入口列表（intranet.html） ============ */
.sys-list{display:flex;flex-direction:column;gap:16px;margin-top:18px;}
.sys-item{border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 20px;background:#fff;transition:box-shadow .15s,border-color .15s;}
.sys-item:hover{box-shadow:var(--shadow-lg);border-color:var(--line-strong);}
.sys-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.sys-name{font-size:17px;font-weight:700;color:var(--ink);}
.sys-desc{margin-top:8px;font-size:14px;color:var(--text-2);line-height:1.8;}
.sys-addr{margin-top:8px;font-size:14px;color:var(--text);}
.sys-addr code,.sys-desc code{background:var(--gray-bg);padding:2px 8px;border-radius:6px;font-family:SFMono-Regular,Consolas,monospace;font-size:13px;color:var(--brand);}
code{background:var(--gray-bg);padding:2px 7px;border-radius:6px;font-size:13px;color:var(--brand);}
.sys-link{display:inline-block;margin-top:12px;color:var(--brand);font-weight:600;font-size:14px;}
.sys-link:hover{text-decoration:underline;}

/* 内网检测状态条（intranet.html） */
.net-status{
  padding:14px 18px;border-radius:var(--radius);font-size:15px;line-height:1.85;margin-bottom:18px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.net-status.checking{background:var(--blue-bg);color:var(--brand);border:1px solid #d6e4ff;}
.net-status.unlocked{background:#eafaf0;color:#1a9c54;border:1px solid #bfe9cd;}
.net-status.locked{background:#fff4f0;color:var(--orange);border:1px solid #ffd4c4;}
#retry{margin-left:auto;background:var(--brand);color:#fff;border:none;border-radius:6px;padding:6px 14px;font-size:13px;cursor:pointer;}
#retry:hover{background:#0f47a0;}

/* 锁定态：内部系统链接不可点击、灰显，真实内网地址隐藏 */
.sys-link.locked{opacity:.4;filter:grayscale(1);cursor:not-allowed;}
body.unlocked .sys-link.locked{opacity:1;filter:none;cursor:pointer;}
.intranet-only{display:none;}
body.unlocked .intranet-only{display:inline;}
.sys-addr.intranet-only{display:none;}
body.unlocked .sys-addr.intranet-only{display:block;}

/* 内部办公入口拦截提示浮层（点击"内部办公"时） */
.intranet-toast{
  position:fixed;top:18px;left:50%;transform:translateX(-50%) translateY(-20px);
  max-width:92%;width:max-content;
  background:#fff4f0;color:var(--orange);border:1px solid #ffd4c4;
  padding:12px 18px;border-radius:var(--radius);font-size:14px;line-height:1.6;
  box-shadow:0 8px 28px rgba(0,0,0,.12);z-index:9999;
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;text-align:center;
}
.intranet-toast.show{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);}

/* 公安备案标识徽标（页脚） */
.beian-badge{display:inline-flex;align-items:center;gap:5px;color:var(--text-3);text-decoration:none;}
.beian-badge:hover{color:var(--brand);}
.beian-badge img{width:15px;height:17px;display:inline-block;vertical-align:middle;}

/* ============ 响应式 ============ */
@media (max-width:980px){
  .site-footer .ft-inner{grid-template-columns:1fr 1fr;}
  .ft-brand{grid-column:1 / -1;}
}
@media (max-width:760px){
  :root{--nav-h:56px;}
  .nav-brand img{width:34px;height:34px;}
  .nav-links a{font-size:13px;padding:0 9px;}
  .nav-links a::after{left:9px;right:9px;}
  .nav-links a.nav-intranet{padding:6px 10px;font-size:12px;}
  .hero{padding-top:52px;padding-bottom:44px;}
  .hero h1{font-size:27px;}
  .hero .sub{font-size:14px;}
  .wrap{padding:0 16px;}
  .features{grid-template-columns:1fr;}
  .section-title{font-size:20px;}
  .site-footer .ft-inner{grid-template-columns:1fr;gap:26px;padding:36px 18px 24px;}
  /* 移动端导航若过长则允许横向滚动，避免换行破版 */
  .site-nav{overflow-x:auto;}
  .nav-links{flex-wrap:nowrap;white-space:nowrap;}
}

/* ============ 滚动揭示（轻量动效，尊重减弱动效偏好） ============ */
.js-reveal .card,
.js-reveal .section-title{
  opacity:0;transform:translateY(18px);
  transition:opacity .6s ease, transform .6s ease;
}
.js-reveal .card.in,
.js-reveal .section-title.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  .js-reveal .card,.js-reveal .section-title{opacity:1!important;transform:none!important;transition:none!important;}
  html{scroll-behavior:auto;}
}