/* ========= Base ========= */
:root{
  --wrap: 1180px;

  --white: #ffffff;
  --black: #232323;
  --blue:  #0047ab;
  --blue-d:#003a8c;
  --line: rgba(255,255,255,.35);

  --text: #111;
  --muted: #666;

  --font: Arial, Helvetica, "Noto Sans", system-ui, -apple-system, sans-serif;
}

*{ box-sizing: border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: var(--font);
  color: var(--text);
  background: var(--white);
}
a{ color: inherit; text-decoration: none; }

.wrap{
  width: min(var(--wrap), calc(100% - 40px));
  margin: 0 auto;
}

/* ========= Top Header (white) ========= */
.top-header{ background: var(--white); }
.top-header__inner{
  height: 96px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 24px;
}
.brand{
  display:flex;
  align-items:center;
  gap: 14px;
  min-width: 320px;
}
.brand__logo{
  width: 64px;
  height: 44px;
  border: 1px solid #ddd;
  background: #f6f6f6;
}
.brand__name{
  font-weight: 700;
  letter-spacing: .5px;
}
.brand__tagline{
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

.top-contact{
  text-align:right;
  line-height: 1.2;
}
.top-contact__title{
  font-size: 14px;
  font-weight: 600;
}
.top-contact__line{
  margin-top: 6px;
  font-size: 13px;
  color: #333;
}
.top-contact__line a{ color:#333; }
.top-contact__line a:hover{ text-decoration: underline; }
.sep{ padding: 0 8px; color:#777; }

/* ========= Nav Bar (black) ========= */
.nav-bar{ background: var(--black); }
.nav-bar__inner{
  height: 44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 26px;
  white-space: nowrap;
  overflow-x: auto;
}
.nav-link{
  color:#fff;
  font-size: 13px;
  letter-spacing: .3px;
  opacity: .92;
}
.nav-link:hover{ opacity: 1; }
.nav-link.is-active{ opacity:1; font-weight:700; }

/* ========= Hero ========= */
.hero{
  position: relative;
  height: 800px;
  overflow: visible;
  background: #dfeaf5;
}
.hero__bg{
  position:absolute;
  inset:0;
  /* later replace with your image */
  background:
    linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.15)),
    radial-gradient(circle at 70% 40%, rgba(255,255,255,.25), transparent 55%),
    linear-gradient(180deg, #b7d5ee 0%, #7fb1df 100%);
  background-size: cover;
  background-position: center;
}
.hero__center{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding-bottom: 80px;
}
.hero-box{
  width: 640px;
  padding: 34px 34px;
  text-align:center;
  background: rgba(255,255,255,.60);
  border: 2px solid rgba(15,55,105,.55);
  outline: 1px solid rgba(15,55,105,.35);
  outline-offset: 10px;
}
.hero-box__top{
  font-size: 14px;
  letter-spacing: 3px;
  color: rgba(20,40,70,.85);
  margin-bottom: 10px;
}
.hero-box__title{
  font-size: 64px;
  font-weight: 800;
  letter-spacing: 6px;
  color: #1d5fae;
  line-height: 1;
}
.hero-box__sub{
  margin-top: 10px;
  font-size: 16px;
  letter-spacing: 4px;
  color: rgba(20,40,70,.75);
}

/* ========= Overlay clickable bar (3 buttons) ========= */
.hero-links{
  position: absolute;
  left: 50%;
  bottom: -46px;
  transform: translateX(-50%);
  width: 980px;
  height: 92px;
  background: var(--blue);
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  z-index: 5;
}
.hero-link{
  flex: 1 1 33.333%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .5px;
  position: relative;
}
.hero-link + .hero-link{
  border-left: 1px solid var(--line);
}
.hero-link:hover{ background: var(--blue-d); }

.hero-link__arrow{
  font-size: 16px;
  opacity: .9;
}
.hero-link__arrow--left{ margin-right: 12px; }
.hero-link__arrow--right{ margin-left: 12px; }

.iso-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 20px;
  background: #fff;
  color: var(--blue);
  font-weight: 800;
  border-radius: 2px;
  border: 2px solid rgba(255,255,255,.75);
  letter-spacing: 1px;
  transform: translateY(-8px);
}

/* ========= After hero spacing ========= */
.after-hero{
  padding-top: 120px;
  background: #fff;
}

/* =========================================================
   INTRO (FORCE LOCKED VERSION)
   - Grey strip: 200w x 930h
   - Right photo: 1200w x 400h
   - Photo overlaps HALF grey strip => right: 100px
   - Diagram: 770w x 385h
   - Your adjustments:
     * Text left 350px
     * Diagram up 150px
   ========================================================= */

.after-hero .intro{
  position: relative;
  padding: 90px 0 90px 0;
  background: #fff;
  min-height: 930px;
}

/* grey strip: 200x930 */
.after-hero .intro::after{
  content:"";
  position:absolute;
  top: 0;
  right: 0;
  width: 200px;
  height: 930px;
  background: #e6e6e6;
  z-index: 0;
}

.after-hero .intro__wrap{
  position: relative;
  z-index: 1;
}

/* LEFT text */
.after-hero .intro__text{
  width: 620px;
  padding-left: 6px;
  padding-top: 10px;

  /* ✅ 文案向左移动 350px */
  transform: translateX(-350px);
}

.after-hero .intro__kicker{
  font-size: 12px;
  color: #111;
  margin-bottom: 12px;
}

.after-hero .intro__title{
  margin: 0;
  font-size: 40px;
  line-height: 1.15;
  font-weight: 800;
  color: #1d5fae;
  white-space: normal;
}

.after-hero .intro__line{
  width: 62px;
  height: 2px;
  background: #1d5fae;
  margin-top: 16px;
  margin-bottom: 24px;
}

.after-hero .intro__para{
  font-size: 12px;
  line-height: 1.95;
  color:#333;
  max-width: 600px;
}

/* RIGHT photo pinned */
.after-hero .intro__photoAbs{
  position: absolute;
  top: 90px;
  right: 100px;      /* grey 200, overlap half = 100 */
  z-index: 2;
  width: 1200px;
  height: 400px;
}

.after-hero .intro__photo{
  width: 1200px;
  height: 400px;
  margin: 0;
  background:#f2f2f2;
  border: 1px solid #d9d9d9;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#666;
  font-size: 12px;
  letter-spacing: .08em;
}

/* DIAGRAM (flow below) */
.after-hero .intro__diagramWrap{
  /* 原来是 320px，让它往上 150px => 170px */
  margin-top: 170px;   /* ✅ 第二张图向上移动 150px */
  display:flex;
  justify-content:flex-start;
}

.after-hero .intro__diagram{
  width: 770px;
  height: 385px;
  background:#f2f2f2;
  border: 1px solid #d9d9d9;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#666;
  font-size: 12px;
  letter-spacing: .08em;
  margin-left: 300px;
}

/* ========= Responsive ========= */
@media (max-width: 1100px){
  .hero-links{ width: min(980px, calc(100% - 40px)); }

  .after-hero .intro::after{ display:none; }

  /* 手机上不要再左移太多，否则会出屏 */
  .after-hero .intro__text{
    transform: translateX(0);
    width: 100%;
    max-width: 620px;
  }

  .after-hero .intro__photoAbs{
    position: static;
    width: auto;
    height: auto;
    margin-top: 30px;
  }

  .after-hero .intro__photo{
    width: 100%;
    max-width: 1200px;
    height: 340px;
  }

  .after-hero .intro__diagramWrap{
    margin-top: 60px;
  }

  .after-hero .intro__diagram{
    width: 100%;
    max-width: 770px;
    height: 260px;
    margin-left: 0;
  }
}

@media (max-width: 860px){
  .top-header__inner{
    height: auto;
    padding: 14px 0;
    flex-direction: column;
    align-items:flex-start;
  }
  .top-contact{ text-align:left; }

  .hero{ height: 560px; }
  .hero__center{ padding-bottom: 70px; }
  .hero-box__title{ font-size: 44px; letter-spacing: 4px; }
  .hero-links{ height: 72px; bottom: -36px; }
  .after-hero{ padding-top: 102px; }
}

@media (max-width: 560px){
  .nav-bar__inner{ justify-content:flex-start; }
  .hero{ height: 460px; }
  .hero-box{ padding: 24px 20px; }
  .hero-box__title{ font-size: 36px; letter-spacing: 3px; }
  .hero-box__sub{ font-size: 13px; letter-spacing: 2px; }
  .hero-links{ height: 66px; bottom: -33px; }
  .iso-badge{ height: 40px; padding: 0 12px; transform: translateY(-6px); }
  .after-hero{ padding-top: 96px; }
}



















/* ================= Blue Feature Section (1000px) ================= */

.blue-feature{
  background: #0047ab;
  padding: 70px 0 60px 0;
}

.blue-feature__inner{
  width: 1000px;   /* ✅ container width */
  margin: 0 auto;
}

/* top layout */
.blue-feature__top{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

/* left text box 360x500 */
.blue-feature__text{
  width: 360px;
  height: 500px;
  color: #ffffff;
  padding-top: 20px;
}

.blue-feature__title{
  font-size: 30px;
  font-weight: 800;
  letter-spacing: .5px;
}

.blue-feature__line{
  width: 70px;
  height: 2px;
  background: rgba(255,255,255,.9);
  margin: 18px 0 24px 0;
}

.blue-feature__desc{
  font-size: 12px;
  line-height: 2.0;
  color: rgba(255,255,255,.92);
  max-width: 330px;
}

/* right image wrapper (keeps fixed size area) */
.blue-feature__hero{
  width: 500px;   /* ✅ */
  height: 360px;  /* ✅ */
}

/* top image (500x360) */
.blue-feature__heroImg{
  width: 500px;
  height: 360px;
  display: block;
  object-fit: cover;   /* ✅ 图片裁切填满，不变形 */
  background: rgba(255,255,255,.12);
}

/* bottom 4 thumbs */
.blue-feature__grid{
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(4, 250px); /* ✅ 1000 total */
  gap: 0;
}

.blue-feature__thumbLink{
  width: 250px;
  height: 250px;
  display: block;
}

.blue-feature__thumbImg{
  width: 250px;
  height: 250px;
  display: block;
  object-fit: cover;   /* ✅ 图片填满 250x250 */
}

/* responsive (optional) */
@media (max-width: 1040px){
  .blue-feature__inner{ width: calc(100% - 40px); }
  .blue-feature__top{ flex-direction: column; gap: 24px; }
  .blue-feature__hero{ width: 100%; height: auto; }
  .blue-feature__heroImg{ width: 100%; height: 320px; }

  .blue-feature__grid{ grid-template-columns: repeat(2, 1fr); }
  .blue-feature__thumbLink{ width: 100%; height: 220px; }
  .blue-feature__thumbImg{ width: 100%; height: 220px; }
}


















/* ================= Mosaic (1000px, irregular images) ================= */

.mosaic{
  background: #0047ab;
  padding: 40px 0 60px 0;
}

.mosaic__inner{
  width: 1000px;
  margin: 0 auto;
}

.mosaic__topHint{
  text-align: center;
  color: rgba(255,255,255,.9);
  font-size: 12px;
  letter-spacing: .8px;
  margin-bottom: 18px;
}

.mosaic__arrow{
  display:inline-block;
  margin-left: 6px;
  opacity: .85;
}

/* 4 columns x 250, 5 rows x 250 */
.mosaic__grid{
  position: relative;
  width: 1000px;
  display: grid;
  grid-template-columns: repeat(4, 250px);
  grid-template-rows: repeat(5, 250px);
  gap: 0;
  background: transparent;
}

/* base item */
.mosaic__item{
  position: relative;
  display: block;
  overflow: hidden;
  text-decoration: none;
}

.mosaic__img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover; /* ✅ 后期换图不变形 */
}

/* layout mapping */
.mosaic__item--bigA{ grid-column: 1 / span 2; grid-row: 1 / span 2; }
.mosaic__item--maskTile{ grid-column: 3; grid-row: 1; }
.mosaic__item--maskPhoto{ grid-column: 4; grid-row: 1; }
.mosaic__item--robotPhoto{ grid-column: 3; grid-row: 2; }
.mosaic__item--equipTile{ grid-column: 4; grid-row: 2; }
.mosaic__item--foodTile{ grid-column: 1; grid-row: 3; }
.mosaic__item--bigB{ grid-column: 2 / span 3; grid-row: 3 / span 2; }
.mosaic__item--foodPhoto{ grid-column: 1; grid-row: 4; }
.mosaic__item--bioTile{ grid-column: 1; grid-row: 5; }
.mosaic__item--roundPhoto{ grid-column: 2; grid-row: 5; }
.mosaic__item--learnMore{ grid-column: 3 / span 2; grid-row: 5; }

/* tiles */
.mosaic__item--maskTile,
.mosaic__item--bioTile{
  background: #8fd3ee; /* 浅蓝 */
}

.mosaic__item--equipTile,
.mosaic__item--foodTile,
.mosaic__item--learnMore{
  background: rgba(255,255,255,.16);
}

.mosaic__tileText{
  width: 100%;
  height: 100%;
  display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #0f2f55;
  text-align:center;
}

.mosaic__tileText--white{
  color: #ffffff;
}

.mosaic__cn{
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .5px;
}

.mosaic__en{
  margin-top: 8px;
  font-size: 10px;
  letter-spacing: 1.2px;
  opacity: .9;
}

/* learn more style */
.mosaic__learnText{
  width: 100%;
  height: 100%;
  display:flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 18px;
  letter-spacing: 1px;
  font-weight: 600;
}

.mosaic__chev{
  margin-left: 14px;
  font-size: 22px;
  opacity: .95;
}

/* overlay white cards (absolute) */
.mosaic__overlay{
  position: absolute;
  width: 250px;
  height: 250px;
  background: #ffffff;
  display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #1b1b1b;
  box-shadow: 0 6px 18px rgba(0,0,0,.15);
  z-index: 5;
}

.mosaic__overlayCN{
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .8px;
}

.mosaic__overlayEN{
  margin-top: 8px;
  font-size: 10px;
  letter-spacing: 1.6px;
  opacity: .75;
}

/* Electronics overlay: sit across row2 center area (like screenshot) */
.mosaic__overlay--electronics{
  left: 500px;  /* col3 start */
  top: 250px;   /* row2 start */
}

/* Pharma overlay: sit on big pharma image left edge lower area */
.mosaic__overlay--pharma{
  left: 250px;  /* col2 start */
  top: 750px;   /* row4 start */
}

/* hover (subtle zoom for photos / darken) */
.mosaic__item:hover .mosaic__img{
  transform: scale(1.03);
  transition: transform .25s ease;
}

.mosaic__overlay:hover{
  transform: translateY(-2px);
  transition: transform .2s ease;
}

.mosaic__item--learnMore:hover{
  background: rgba(255,255,255,.22);
}

/* responsive: stack */
@media (max-width: 1040px){
  .mosaic__inner{ width: calc(100% - 40px); }
  .mosaic__grid{
    width: 100%;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: none;
  }
  .mosaic__overlay{ display:none; }
}
















/* ================= ISO Banner (2540x640 bg) ================= */

.iso-banner{
  /* ✅ 背景图路径：后期你换文件即可 */
  background: url("../images/iso-banner-bg.jpg") center/cover no-repeat;
  height: 640px;              /* ✅ 你给的高度 */
  position: relative;
}

/* optional: slight bright overlay like screenshot */
.iso-banner::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(255,255,255,.08);
}

.iso-banner__inner{
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* middle translucent card */
.iso-banner__card{
  width: 980px;               /* 视觉接近截图（需要更精确我再按你截图调） */
  padding: 52px 64px;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(255,255,255,.55);
}

/* small top label */
.iso-banner__kicker{
  font-size: 12px;
  color: rgba(0,0,0,.65);
  margin-bottom: 10px;
  letter-spacing: .5px;
}

/* title */
.iso-banner__title{
  margin: 0;
  font-size: 32px;
  font-weight: 800;
  color: #333;
  letter-spacing: .5px;
}

/* blue line under title */
.iso-banner__line{
  width: 70px;
  height: 2px;
  background: #1d5fae;
  margin: 18px 0 22px 0;
}

/* paragraph */
.iso-banner__desc{
  margin: 0;
  font-size: 12px;
  line-height: 2.05;
  color: rgba(0,0,0,.72);
  max-width: 860px;
}

/* bottom link */
.iso-banner__link{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 34px;
  color: #1d5fae;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
}

.iso-banner__link:hover{
  text-decoration: underline;
}

.iso-banner__chev{
  font-size: 20px;
  line-height: 1;
}

/* responsive */
@media (max-width: 1040px){
  .iso-banner{
    height: auto;
    min-height: 520px;
    padding: 70px 0;
  }
  .iso-banner__inner{
    padding: 0 20px;
  }
  .iso-banner__card{
    width: 100%;
    padding: 36px 26px;
  }
}













/* ================= Values / Strengths ================= */

.values{
  background: #ffffff;
  padding: 80px 0 80px 0;
}

.values__inner{
  width: 1000px;           /* 和前面模块一致 */
  margin: 0 auto;
}

.values__head{
  text-align: center;
}

.values__kicker{
  font-size: 12px;
  color: rgba(0,0,0,.6);
  letter-spacing: .6px;
  margin-bottom: 10px;
}

.values__title{
  margin: 0;
  font-size: 34px;
  font-weight: 800;
  color: #333;
  letter-spacing: 1px;
}

.values__headLine{
  width: 70px;
  height: 2px;
  background: #1d5fae;
  margin: 18px auto 0 auto;
}

/* cards layout */
.values__cards{
  margin-top: 60px;
  display: flex;
  justify-content: center;
  gap: 34px;               /* 三张卡之间的距离 */
}

/* card base */
.values__card{
  width: 250px;
  height: 360px;
  color: #ffffff;
  text-align: center;
  padding: 44px 22px 0 22px;
}

/* colors (3 different blues like screenshot) */
.values__card--light{ background: #1f74b9; }
.values__card--mid{   background: #004aa8; }
.values__card--dark{  background: #001b3f; }

.values__check{
  font-size: 26px;
  line-height: 1;
  font-weight: 800;
  margin-bottom: 18px;
}

.values__cardTitle{
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 1px;
  margin-bottom: 18px;
}

.values__cardLine{
  width: 34px;
  height: 2px;
  background: rgba(255,255,255,.85);
  margin: 0 auto 34px auto;
}

.values__sub{
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 16px;
  opacity: .95;
}

.values__desc{
  font-size: 12px;
  line-height: 1.85;
  opacity: .92;
}

/* bottom paragraph */
.values__foot{
  margin-top: 48px;
  text-align: center;
  font-size: 12px;
  line-height: 1.9;
  color: rgba(0,0,0,.65);
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

/* responsive */
@media (max-width: 1040px){
  .values__inner{ width: calc(100% - 40px); }
  .values__cards{
    flex-direction: column;
    align-items: center;
    gap: 18px;
  }
}












/* ================= Service Flow ================= */

.service-flow{
  /* 左右背景（全宽），中间白内容区 */
  background: url("../images/service-bg.jpg") center/cover no-repeat; /* 你后期换背景图 */
  padding: 70px 0 90px 0;
}

/* 中间白色内容区 */
.service-flow__inner{
  width: 1000px;
  margin: 0 auto;
  background: #ffffff;
  padding: 60px 0 70px 0;
}

/* head */
.service-flow__head{
  text-align: center;
}

.service-flow__title{
  margin: 0;
  font-size: 30px;
  font-weight: 800;
  color: #333;
  letter-spacing: 1px;
}

.service-flow__subtitle{
  margin-top: 8px;
  font-size: 12px;
  color: rgba(0,0,0,.65);
  letter-spacing: .8px;
}

.service-flow__line{
  width: 70px;
  height: 2px;
  background: #1d5fae;
  margin: 18px auto 0 auto;
}

/* rows */
.service-flow__row{
  display:flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
}

.service-flow__row--top{ margin-top: 46px; }
.service-flow__row--bottom{ margin-top: 54px; }

/* button columns */
.service-flow__btnCol{
  width: 310px;
  display:flex;
  flex-direction: column;
  gap: 14px;
}

.service-flow__btnCol--right{
  width: 330px;
}

/* buttons */
.sf-btn{
  height: 50px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 13px;
  letter-spacing: .5px;
  text-decoration:none;
  transition: all .18s ease;
}

.sf-btn--outline{
  background: #ffffff;
  border: 2px solid #0047ab;
  color: #0047ab;
}

.sf-btn--solid{
  background: #0047ab;
  border: 2px solid #0047ab;
  color: #ffffff;
}

.sf-btn:hover{
  filter: brightness(1.05);
}

/* images */
.service-flow__imgBox{
  overflow:hidden;
  background: #f2f2f2;
}

.service-flow__imgBox--top{
  width: 360px;
  height: 260px;
}

.service-flow__imgBox--bottom{
  width: 360px;
  height: 260px;
}

.service-flow__img{
  width: 100%;
  height: 100%;
  display:block;
  object-fit: cover;
}

/* responsive */
@media (max-width: 1040px){
  .service-flow__inner{
    width: calc(100% - 40px);
    padding: 46px 0 50px 0;
  }
  .service-flow__row{
    flex-direction: column;
    gap: 18px;
  }
  .service-flow__btnCol,
  .service-flow__btnCol--right{
    width: 100%;
    max-width: 360px;
  }
}
















/* ================= CTA + Footer ================= */

.cta-footer__cta{
  height: 380px;
  background: url("../images/cta-bg.jpg") center/cover no-repeat;
  position: relative;
}

/* dark overlay like screenshot */
.cta-footer__cta::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.35);
}

.cta-footer__ctaInner{
  position: relative;
  z-index: 1;
  height: 100%;
  width: 1000px;
  margin: 0 auto;
  display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  padding: 0 20px;
}

.cta-footer__ctaTitle{
  font-size: 22px;
  font-weight: 800;
  letter-spacing: .8px;
}

.cta-footer__ctaSub{
  margin-top: 10px;
  font-size: 12px;
  letter-spacing: .6px;
  opacity: .95;
}

.cta-footer__ctaLine{
  width: 100%;
  height: 2px;
  background: rgba(48,155,255,.65);   /* 蓝色横线贯穿 */
  margin: 34px 0 22px 0;
  position: relative;
}

.cta-footer__ctaBtns{
  display:flex;
  gap: 26px;
  align-items:center;
  justify-content:center;
}

.cta-btn{
  width: 140px;
  height: 36px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .6px;
  border: 1px solid rgba(255,255,255,.75);
  text-decoration: none;
}

.cta-btn--dark{
  background: #003a8c;
  border-color: rgba(255,255,255,.65);
  color:#fff;
}

.cta-btn--light{
  background: #66c2e6;
  border-color: rgba(255,255,255,.65);
  color:#fff;
}

.cta-btn:hover{
  filter: brightness(1.05);
}

.cta-footer__ctaSmall{
  margin-top: 22px;
  font-size: 11px;
  opacity: .9;
}

/* ================= Footer block ================= */

.site-footer{
  background: #3d3d3d;
  color: rgba(255,255,255,.78);
}

.site-footer__inner{
  width: 1000px;
  margin: 0 auto;
  padding: 46px 0 44px 0;
  display:flex;
  gap: 70px;
  align-items:flex-start;
  justify-content: flex-start;
}

/* left brand col */
.site-footer__col--brand{
  width: 360px;
}

.site-footer__iso img{
  width: 90px;
  height: auto;
  display:block;
  margin-bottom: 18px;
}

.site-footer__addr{
  font-size: 12px;
  line-height: 1.8;
  margin-bottom: 16px;
  opacity: .85;
}

.site-footer__line{
  font-size: 12px;
  line-height: 2;
  opacity: .85;
}

.site-footer__line a{
  color: rgba(255,255,255,.85);
  text-decoration: none;
}

.site-footer__line a:hover{
  text-decoration: underline;
}

.site-footer__muted{
  opacity: .6;
  margin-top: 10px;
}

/* link columns */
.site-footer__heading{
  color: rgba(255,255,255,.88);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .5px;
  margin-bottom: 14px;
}

.site-footer__link{
  display:block;
  font-size: 12px;
  line-height: 2.1;
  color: rgba(255,255,255,.65);
  text-decoration: none;
}

.site-footer__link:hover{
  color: rgba(255,255,255,.9);
}

/* bottom bar */
.site-footer__bottom{
  background: #2a2a2a;
  color: rgba(255,255,255,.65);
  text-align:center;
  font-size: 12px;
  padding: 16px 0;
}

/* responsive */
@media (max-width: 1040px){
  .cta-footer__ctaInner,
  .site-footer__inner{
    width: calc(100% - 40px);
  }
  .site-footer__inner{
    flex-direction: column;
    gap: 26px;
    padding: 34px 0 30px 0;
  }
  .site-footer__col--brand{
    width: 100%;
  }
}









/* ===== Logo image (path reserved) ===== */
.brand__logo{
  display:none; /* ✅ 隐藏旧的 div 占位 */
}

.brand__logoImg{
  width: 64px;
  height: 44px;
  display:block;
  object-fit: contain;      /* ✅ 不拉伸 */
}

/* ===== Hero banner bg (2540x800 path reserved) ===== */
.hero__bg{
  position:absolute;
  inset:0;
  background: url("../images/banner.jpg") center/cover no-repeat; /* ✅ Banner路径 */
}