/* ============ 官网门户（PC + 手机自适应）Apple 风格 ============ */

/* 顶部导航 */
.portal-top{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.72);
  backdrop-filter:saturate(180%) blur(18px);
  -webkit-backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.portal-top .inner{
  max-width:1200px; margin:0 auto; height:64px;
  display:flex; align-items:center; padding:0 24px; gap:18px;
}
.portal-top .logo{
  font-size:18px; font-weight:700; color:var(--wc-text);
  display:flex; align-items:center; gap:10px; cursor:pointer;
}
.portal-top .logo img{height:30px; width:auto; border-radius:6px; object-fit:contain;}
.portal-top .logo svg{color:var(--wc-green);}
.portal-top .nav{
  flex:1; display:flex; justify-content:center; gap:32px;
}
.portal-top .nav a{
  color:#1d1d1f; font-size:15px; font-weight:500; letter-spacing:-.01em;
  padding:6px 2px; position:relative; transition:.2s;
}
.portal-top .nav a::after{
  content:""; position:absolute; left:50%; bottom:0; width:0; height:2px;
  background:var(--wc-green); border-radius:2px; transition:.25s; transform:translateX(-50%);
}
.portal-top .nav a:hover{color:var(--wc-green);}
.portal-top .nav a:hover::after,.portal-top .nav a.active::after{width:100%;}
.portal-top .nav a.active{color:var(--wc-green);}
.portal-top .phone{
  color:var(--wc-green); font-weight:600; font-size:14px;
  display:flex; align-items:center; gap:6px;
}
.portal-top .nav-toggle{
  display:none; background:none; border:none; color:var(--wc-text); cursor:pointer; padding:4px;
}

/* Hero */
.ph-hero{
  padding:80px 24px 48px; text-align:center;
  background:linear-gradient(180deg, #f5f5f7 0%, #fff 100%);
}
.ph-hero-content{max-width:820px; margin:0 auto;}
.ph-hero-title{
  font-size:56px; line-height:1.08; font-weight:700; letter-spacing:-.03em;
  color:#1d1d1f; margin:0;
}
.ph-hero-sub{
  font-size:19px; line-height:1.6; color:#6e6e73; margin:20px auto 0; max-width:640px;
}
.ph-hero-actions{
  display:flex; gap:14px; justify-content:center; margin-top:32px; flex-wrap:wrap;
}
.ph-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 28px; border-radius:999px; font-size:15px; font-weight:600;
  text-decoration:none; transition:.2s;
}
.ph-btn-primary{background:var(--wc-green); color:#fff; box-shadow:0 4px 14px rgba(7,193,96,.35);}
.ph-btn-primary:hover{background:var(--wc-green-press); transform:translateY(-1px);}
.ph-btn-secondary{background:#fff; color:var(--wc-green); border:1.5px solid var(--wc-green);}
.ph-btn-secondary:hover{background:rgba(7,193,96,.05);}

.ph-hero-media{
  max-width:1100px; margin:56px auto 0; border-radius:28px; overflow:hidden;
  background:#000; position:relative; box-shadow:0 24px 70px rgba(0,0,0,.18);
  aspect-ratio:16/7;
}
.ph-swiper{position:absolute; inset:0;}
.ph-slide{
  position:absolute; inset:0; opacity:0; transition:opacity .8s ease-in-out;
}
.ph-slide.active{opacity:1;}
.ph-slide img{width:100%; height:100%; object-fit:cover;}
.ph-dots{
  position:absolute; bottom:18px; left:50%; transform:translateX(-50%);
  display:flex; gap:8px; z-index:3;
}
.ph-dots span{width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.45); cursor:pointer; transition:.2s;}
.ph-dots span.active{background:#fff; width:22px; border-radius:4px;}

/* 容器 */
.ph-container{max-width:1200px; margin:0 auto; padding:40px 24px 80px;}
.ph-section{margin-bottom:72px;}
.ph-section-title{
  font-size:36px; font-weight:700; letter-spacing:-.025em; color:#1d1d1f;
  margin:0 0 28px; text-align:center;
}
.ph-empty{text-align:center; color:#86868b; padding:48px 0; font-size:15px;}

/* Bento 业务模块 */
.ph-bento{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
.ph-bento-card{
  background:#fff; border-radius:24px; padding:28px;
  box-shadow:0 4px 24px rgba(0,0,0,.05);
  display:flex; flex-direction:column; align-items:flex-start; gap:10px;
  text-decoration:none; color:inherit; transition:.25s;
}
.ph-bento-card:hover{transform:translateY(-6px); box-shadow:0 16px 40px rgba(0,0,0,.1);}
.ph-bento-card .ph-icon{
  width:52px; height:52px; border-radius:16px;
  background:linear-gradient(135deg, rgba(7,193,96,.14), rgba(7,193,96,.05));
  color:var(--wc-green); display:flex; align-items:center; justify-content:center; margin-bottom:6px;
}
.ph-bento-card .ph-name{font-size:19px; font-weight:700; color:#1d1d1f;}
.ph-bento-card .ph-sub{font-size:13px; color:#86868b; line-height:1.5;}

/* 培训科目 */
.ph-subject-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:20px;}
.ph-subject-card{
  background:#fff; border-radius:24px; padding:24px;
  box-shadow:0 4px 24px rgba(0,0,0,.05); transition:.25s;
}
.ph-subject-card:hover{transform:translateY(-4px); box-shadow:0 12px 34px rgba(0,0,0,.09);}
.ph-subject-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:14px;}
.ph-subject-name{font-size:17px; font-weight:700; color:#1d1d1f;}
.ph-count{font-size:12px; font-weight:600; color:var(--wc-green); background:rgba(7,193,96,.1); padding:4px 10px; border-radius:999px;}
.ph-pills{display:flex; flex-wrap:wrap; gap:10px;}
.ph-pill{
  background:#f5f5f7; color:#1d1d1f; font-size:13px; padding:8px 14px; border-radius:999px;
  text-decoration:none; transition:.2s;
}
.ph-pill:hover{background:var(--wc-green); color:#fff;}

/* 证书查询大卡片 */
.ph-feature{
  background:linear-gradient(135deg, #f5f5f7, #fff); border:1px solid rgba(0,0,0,.05);
  border-radius:28px; padding:32px; display:flex; align-items:center; gap:22px;
  text-decoration:none; color:inherit; box-shadow:0 8px 30px rgba(0,0,0,.06);
  transition:.25s;
}
.ph-feature:hover{transform:translateY(-4px); box-shadow:0 16px 44px rgba(0,0,0,.1);}
.ph-feature-icon{
  width:68px; height:68px; border-radius:22px; flex:none;
  background:linear-gradient(135deg, rgba(7,193,96,.16), rgba(7,193,96,.06));
  color:var(--wc-green); display:flex; align-items:center; justify-content:center;
}
.ph-feature-text{display:flex; flex-direction:column; gap:6px; flex:1;}
.ph-feature-text strong{font-size:20px; color:#1d1d1f;}
.ph-feature-text span{font-size:14px; color:#86868b;}
.ph-arrow{font-size:24px; color:#c7c7cc;}
.ph-feature:hover .ph-arrow{color:var(--wc-green);}

/* 列表 */
.ph-list{display:flex; flex-direction:column; gap:12px;}
.ph-list-item{
  background:#fff; border-radius:18px; padding:18px 22px;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  box-shadow:0 2px 16px rgba(0,0,0,.04); text-decoration:none; color:inherit; transition:.2s;
}
.ph-list-item:hover{transform:translateY(-2px); box-shadow:0 8px 26px rgba(0,0,0,.08);}
.ph-list-title{font-size:15px; font-weight:600; color:#1d1d1f;}
.ph-list-date{font-size:13px; color:#86868b; white-space:nowrap;}

/* 培训动态 */
.ph-news-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;}
.ph-news-card{
  background:#fff; border-radius:24px; overflow:hidden;
  box-shadow:0 4px 24px rgba(0,0,0,.05); text-decoration:none; color:inherit; transition:.25s;
}
.ph-news-card:hover{transform:translateY(-5px); box-shadow:0 14px 38px rgba(0,0,0,.1);}
.ph-news-cover{aspect-ratio:16/10; overflow:hidden; background:#f5f5f7;}
.ph-news-cover img{width:100%; height:100%; object-fit:cover; transition:.4s;}
.ph-news-card:hover .ph-news-cover img{transform:scale(1.05);}
.ph-news-title{display:block; font-size:16px; font-weight:700; color:#1d1d1f; padding:18px 20px 4px;}
.ph-news-date{display:block; font-size:13px; color:#86868b; padding:0 20px 18px;}
.ph-more{text-align:center; margin-top:24px;}
.ph-link{color:var(--wc-green); font-weight:600; text-decoration:none; font-size:15px;}
.ph-link:hover{text-decoration:underline;}

/* 页脚 */
.portal-footer{background:#1d1d1f; color:#a1a1a6; padding:56px 24px 24px; font-size:13px;}
.portal-footer .f-inner{max-width:980px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr auto; gap:48px;}
.portal-footer .f-title{color:#f5f5f7; font-size:14px; font-weight:700; margin-bottom:14px;}
.portal-footer .f-col{display:flex; flex-direction:column; gap:8px;}
.portal-footer a{color:#a1a1a6; text-decoration:none;}
.portal-footer a:hover{color:#fff;}
.portal-footer .f-qr img{width:96px; height:96px; border-radius:10px; background:#fff;}
.portal-footer .f-copy{text-align:center; margin-top:40px; padding-top:18px; border-top:1px solid #333; color:#6e6e73;}

/* 其他页面兼容 */
.portal-form{max-width:520px; margin:0 auto; padding:40px 24px;}
.portal-form .f-row{display:flex; flex-direction:column; gap:6px; margin-bottom:14px;}
.portal-form .f-row label{font-size:13px; color:var(--wc-sub);}
.portal-form .f-row input,.portal-form .f-row textarea{border:1px solid var(--wc-line); border-radius:var(--radius-input); padding:10px 12px; font-size:14px; outline:none;}
.portal-form .f-row input:focus{border-color:var(--wc-green);}

.portal-article{max-width:860px; margin:40px auto; background:#fff; border-radius:24px; padding:40px; box-shadow:0 4px 24px rgba(0,0,0,.05);}
.portal-article h1{font-size:28px; margin:0 0 10px; color:#1d1d1f;}
.portal-article .meta{color:#86868b; font-size:13px; margin-bottom:22px; border-bottom:1px solid var(--wc-line); padding-bottom:14px;}
.portal-article .content{line-height:1.8; font-size:15px; color:#333;}

.cert-query{max-width:560px; margin:50px auto; background:#fff; border-radius:24px; padding:32px; box-shadow:0 4px 24px rgba(0,0,0,.05);}
.cert-result{border:1px solid var(--wc-line); border-radius:14px; padding:16px; margin-top:14px;}

/* 响应式 */
@media(max-width:900px){
  .ph-bento{grid-template-columns:repeat(2, 1fr);}
  .ph-subject-grid{grid-template-columns:1fr;}
  .ph-news-grid{grid-template-columns:repeat(2, 1fr);}
  .portal-footer .f-inner{grid-template-columns:1fr 1fr;}
}
@media(max-width:768px){
  .portal-top .nav{
    display:none; position:absolute; top:64px; left:12px; right:12px;
    background:rgba(255,255,255,.96); backdrop-filter:blur(16px);
    border-radius:18px; box-shadow:0 12px 40px rgba(0,0,0,.12);
    flex-direction:column; padding:12px; gap:4px;
  }
  .portal-top .nav.open{display:flex;}
  .portal-top .nav a{padding:12px 14px; border-radius:10px;}
  .portal-top .nav a:hover{background:#f5f5f7;}
  .portal-top .nav a::after{display:none;}
  .portal-top .phone{display:none;}
  .portal-top .nav-toggle{display:block;}
  .ph-hero{padding:60px 20px 36px;}
  .ph-hero-title{font-size:34px;}
  .ph-hero-sub{font-size:16px;}
  .ph-hero-media{border-radius:18px; margin-top:36px;}
  .ph-section-title{font-size:26px; margin-bottom:22px;}
  .ph-bento{grid-template-columns:1fr;}
  .ph-news-grid{grid-template-columns:1fr;}
  .ph-feature{flex-direction:column; align-items:flex-start; text-align:left;}
  .ph-feature .ph-arrow{align-self:flex-end;}
  .ph-list-item{flex-direction:column; align-items:flex-start; gap:6px;}
  .portal-footer .f-inner{grid-template-columns:1fr; gap:28px;}
  .portal-article{padding:24px; margin:24px auto;}
}