/* t209_4 · layout structure · 活力橙·宽屏分栏 */

body.tpl-t209.var-v4 .container,
body.tpl-t209.var-v4 .width-1200,
body.tpl-t209.var-v4 .c-container,
body.tpl-t209.var-v4 .warp,
body.tpl-t209.var-v4 .warp2 {
  max-width: var(--tpl-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* ── v4 banner: split-hero ── */
body.ban-full-bleed .banner, body.ban-full-bleed .c-layer--banner {
  width: 100%;
  margin: 0;
  border-radius: 0;
}
body.ban-inset-rounded .banner, body.ban-inset-rounded .c-layer--banner {
  margin: 20px auto;
  max-width: calc(var(--tpl-max) - 40px);
  border-radius: var(--tpl-radius);
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.12);
}
body.ban-contained-overlay .banner {
  max-width: var(--tpl-max);
  margin: 24px auto;
  position: relative;
  border-radius: var(--tpl-radius);
  overflow: hidden;
}
body.ban-split-hero .banner {
  display: grid;
  grid-template-columns: 1fr;
}
@media (min-width: 992px) {
  body.ban-split-hero .banner .swiper-container,
  body.ban-split-hero .banner-main {
    min-height: 420px;
  }
}

body.var-v4 .banner-bottom, body.var-v4 .banner-ul {
  transition: all .3s ease;
}

/* ── v4 sections: full-bands ── */
body.sec-alternating-rows .c-layer:nth-child(even),
body.sec-alternating-rows section:nth-child(even) {
  background: var(--tpl-bg);
}
body.sec-card-shadow .c-layer, body.sec-card-shadow section,
body.sec-card-shadow .banner-bottom {
  margin: 16px auto;
  max-width: var(--tpl-max);
  border-radius: var(--tpl-radius);
  box-shadow: 0 4px 24px rgba(0,0,0,.07);
  overflow: hidden;
}
body.sec-centered-text .c-layer, body.sec-centered-text section {
  text-align: center;
}
body.sec-centered-text .c-grid, body.sec-centered-text .banner-ul {
  justify-content: center;
}
body.sec-full-bands .c-layer, body.sec-full-bands section {
  padding-top: 48px;
  padding-bottom: 48px;
}
body.sec-full-bands .c-layer:nth-child(odd) {
  background: var(--tpl-bg);
}

/* grid / cards per variant */
body.var-v1 .c-grid { display: flex; flex-wrap: wrap; gap: 16px; }
body.var-v1 .c-grid > * { flex: 1 1 calc(25% - 16px); min-width: 200px; }

body.var-v2 .c-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; }
body.var-v2 .banner-ul li {
  background: #fff;
  border-radius: var(--tpl-radius);
  padding: 20px;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}

body.var-v3 .c-layer { padding: 56px 0; }
body.var-v3 .banner-ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
body.var-v3 .banner-ul li { max-width: 220px; text-align: center; }

body.var-v4 .banner-ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
body.var-v4 .banner-ul li {
  border-right: 1px solid rgba(0,0,0,.08);
  padding: 24px 16px;
}
@media (max-width: 768px) {
  body.var-v4 .banner-ul { grid-template-columns: repeat(2, 1fr); }
  body.hdr-centered-logo .nav-list { flex-direction: column; }
  body.ban-inset-rounded .banner { margin: 10px; max-width: none; }
}

/* t199 hhshop specifics */
body.tpl-t209.var-v4 .c-layer--function .c-grid > div {
  border-left: 4px solid var(--tpl-primary);
  padding-left: 12px;
}
body.var-v2 .c-layer--hhshop-solution { background: var(--tpl-bg); }
body.var-v3 .c-layer--hhshop-solution { border-top: 3px solid var(--tpl-accent); }
body.var-v4 .c-layer--fast-build { background: linear-gradient(180deg, #fff, var(--tpl-bg)); }

/* t204 / generic head */
body.var-v1 .head-box { border-bottom: 2px solid var(--tpl-primary); }
body.var-v2 .head .logo { font-size: 1.4em; font-weight: 700; }
body.var-v3 .head-box { background: transparent !important; box-shadow: none; }
body.var-v4 .head-box { padding: 16px 0; }

/* news list */
body.var-v4 .news-list .dot, body.var-v4 .n-list .dot {
  border-left: 4px solid var(--tpl-primary);
  padding-left: 16px;
  margin-bottom: 20px;
}
body.var-v2 .news-list .dot, body.var-v2 .n-list .dot {
  border-left: none;
  border-radius: var(--tpl-radius);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  padding: 16px;
}
body.var-v3 .news-list .dot { text-align: left; max-width: 720px; margin-left: auto; margin-right: auto; }
body.var-v4 .news-list .dot { border-left-width: 6px; }

/* inner page breadcrumb area */
body.var-v4 .banner-bottom, body.var-v4 .ab1, body.var-v4 .page-title {
  border-bottom: 1px solid rgba(0,0,0,.06);
}
