/* =====================================================
   弘祥消防培训学校 · 全站 UI 美化增强层 custom.css
   覆盖 comm/head.html 全局组件 + 通用元素，全站统一加载
   品牌色：深蓝主色 + 红色CTA + 金色点缀（消防专业风）
   ===================================================== */

/* ---------- 全局基础精修 ---------- */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
::selection{background:rgba(231,76,60,.16);color:var(--primary-dark)}
/* 现代滚动条 */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#f1f3f7}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary),var(--primary-dark));border-radius:10px;border:2px solid #f1f3f7}
::-webkit-scrollbar-thumb:hover{background:var(--accent)}

/* 通用卡片质感（无侵入增强，供各页 .xx-card 复用基础） */
[class$="-card"],.region-card,.cc-body,.faq-item{backface-visibility:hidden}

/* ---------- 头部导航 ---------- */
.site-header{
  background-color:#1E3A5F; /* 兜底：渐变失效时仍保证深色底白字可见 */
  background:linear-gradient(135deg,#16294a 0%,#1E3A5F 60%,#1a3d6e 100%);
  box-shadow:0 2px 6px rgba(12,20,35,.08),0 10px 30px -12px rgba(30,58,95,.4);
  transition:box-shadow .3s;
}
.header-inner{height:74px}
.logo-icon{
  background:linear-gradient(135deg,#E74C3C,#c0392b);
  box-shadow:0 6px 14px -4px rgba(231,76,60,.55);
}
.logo-text{letter-spacing:.5px;font-size:19px}
.header-nav a{
  position:relative;font-weight:500;color:rgba(255,255,255,.78);
  padding:8px 14px;border-radius:8px;
}
.header-nav a::after{
  content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;
  background:linear-gradient(90deg,var(--accent),var(--gold));
  transform:scaleX(0);transform-origin:left;transition:transform .28s ease;border-radius:2px
}
.header-nav a:hover{color:#fff;background:rgba(255,255,255,.06)}
.header-nav a:hover::after,.header-nav a.active::after{transform:scaleX(1)}
.header-nav a.active{color:var(--gold)}
.header-cta{
  background:linear-gradient(135deg,#E74C3C,#d63b2f);
  box-shadow:0 8px 18px -6px rgba(231,76,60,.55);
  border:1px solid rgba(255,255,255,.16);
}
.mobile-nav a{font-weight:500}
.mobile-nav .mobile-cta{background:linear-gradient(135deg,#E74C3C,#c0392b)}

/* ---------- 页头 banner ---------- */
.page-header{
  background:linear-gradient(135deg,#0f1a2e 0%,#1E3A5F 45%,#1a3d6e 100%);
  position:relative;overflow:hidden
}
.page-header::before{
  content:"";position:absolute;top:-40%;right:-5%;width:460px;height:460px;
  background:radial-gradient(circle,rgba(212,175,55,.10),transparent 68%);border-radius:50%
}
.page-header::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:4px;
  background:linear-gradient(90deg,var(--accent),var(--gold),var(--accent))
}
.page-header .container{position:relative;z-index:1}
.page-header h1{letter-spacing:.5px;text-shadow:0 2px 14px rgba(0,0,0,.18)}
.page-header p{color:rgba(255,255,255,.7)}

/* ---------- 按钮三态精修 ---------- */
.btn-primary-custom{
  background:linear-gradient(135deg,#E74C3C,#d63b2f);
  box-shadow:0 8px 20px -6px rgba(231,76,60,.5);
  letter-spacing:.3px
}
.btn-primary-custom:hover{transform:translateY(-3px);box-shadow:0 12px 26px -8px rgba(231,76,60,.6)}
.btn-primary-custom:active{transform:translateY(-1px)}
.btn-outline-custom:hover{transform:translateY(-2px);box-shadow:0 10px 22px -8px rgba(231,76,60,.5)}
.btn-outline-dark{letter-spacing:.3px}
.btn-outline-dark:hover{transform:translateY(-2px);box-shadow:0 10px 20px -8px rgba(30,58,95,.35)}

/* ---------- 区块标题 ---------- */
.section-title{letter-spacing:.5px}
.section-title::after{
  width:72px;height:4px;border-radius:4px;
  box-shadow:0 2px 6px rgba(212,175,55,.4)
}

/* ---------- 卡片 hover 统一质感 ---------- */
.course-card,.adv-card,.case-card,.news-card,.region-card{
  transition:transform .3s cubic-bezier(.22,.6,.36,1),box-shadow .3s,border-color .3s;
}
.course-card:hover,.case-card:hover{box-shadow:0 18px 40px -18px rgba(30,58,95,.25),0 4px 12px rgba(30,58,95,.06)}
.adv-card:hover{transform:translateY(-6px)}
.news-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px -16px rgba(30,58,95,.22)}

/* course-card 头部渐变 + body/foot 细节 */
.course-card .cc-head.blue{background:linear-gradient(135deg,#1E3A5F,#275a8f)}
.course-card .cc-head.red{background:linear-gradient(135deg,#E74C3C,#c0392b)}
.course-card .cc-head .cc-icon{
  width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.16)
}
.course-card .cc-foot a:hover{color:var(--accent-dark);letter-spacing:.3px}

/* adv 图标容器渐变 */
.adv-icon{box-shadow:0 6px 16px -6px rgba(30,58,95,.2)}

/* ---------- 数据/徽章 ---------- */
.hero-badge,.cta-card .tag{
  backdrop-filter:blur(4px)
}

/* ---------- 表格精修（region-table 等通用） ---------- */
table{border-collapse:collapse}
.region-table,.table{border-radius:12px;overflow:hidden}
.region-table td{padding:11px 14px;border-bottom:1px solid var(--border);font-size:.85rem;transition:background .2s}
.region-table tr:hover td{background:#f7f9fc}
.region-table tr:last-child td{border-bottom:none}
/* 通用表单控件 */
input,select,textarea{
  border:1px solid var(--border)!important;border-radius:10px!important;
  padding:10px 14px!important;transition:border-color .2s,box-shadow .2s;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--primary)!important;box-shadow:0 0 0 3px rgba(30,58,95,.1)!important;outline:none
}

/* ---------- 页脚增强 ---------- */
.site-footer{background:linear-gradient(180deg,var(--primary-dark),#0e1f36)}
.site-footer .fi-item i{font-size:15px}
.site-footer h5{letter-spacing:.5px}
.footer-bottom{letter-spacing:.4px}

/* ---------- 链接、段落 ---------- */
a:hover{text-decoration:none}
p{word-break:break-word}
img{max-width:100%}

/* ---------- 响应式微调 ---------- */
@media(max-width:575px){
  .page-header{padding:42px 0 36px}
  .page-header h1{font-size:1.35rem}
  .section-title{margin-bottom:28px;font-size:1.25rem}
  .header-inner{height:64px}
  .logo-text{font-size:16px}
}
@media(max-width:991px){
  .header-nav a{padding:6px 10px}
}

/* ---------- 通用工具类（各页可调用） ---------- */
.text-gradient{background:linear-gradient(90deg,#E74C3C,#D4AF37);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.rounded-xl{border-radius:16px}
.shadow-soft{box-shadow:0 10px 30px -12px rgba(30,58,95,.2)}
.hover-lift{transition:transform .3s,box-shadow .3s}
.hover-lift:hover{transform:translateY(-5px);box-shadow:0 18px 40px -18px rgba(30,58,95,.28)}