/* ============================================================
 * WPBakery Flexbox Grid System (vc_row / vc_column 横排布局)
 * ============================================================ */
.vc_row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
    width: calc(100% + 30px);
    clear: both;
}
.vc_row-fluid {
    display: flex;
    flex-wrap: wrap;
}
.vc_row:after {
    content: "";
    display: table;
    clear: both;
}
.vc_column_container {
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}
.vc_column_container > .wpb_wrapper {
    width: 100%;
}

/* vc_row 内约束宽度 */
.vc_row > .vc_column_container.vc_col-sm-1  { width: 8.3333%; }
.vc_row > .vc_column_container.vc_col-sm-2  { width: 16.6667%; }
.vc_row > .vc_column_container.vc_col-sm-3  { width: 25%; }
.vc_row > .vc_column_container.vc_col-sm-4  { width: 33.3333%; }
.vc_row > .vc_column_container.vc_col-sm-5  { width: 41.6667%; }
.vc_row > .vc_column_container.vc_col-sm-6  { width: 50%; }
.vc_row > .vc_column_container.vc_col-sm-7  { width: 58.3333%; }
.vc_row > .vc_column_container.vc_col-sm-8  { width: 66.6667%; }
.vc_row > .vc_column_container.vc_col-sm-9  { width: 75%; }
.vc_row > .vc_column_container.vc_col-sm-10 { width: 83.3333%; }
.vc_row > .vc_column_container.vc_col-sm-11 { width: 91.6667%; }
.vc_row > .vc_column_container.vc_col-sm-12 { width: 100%; }

/* 内容宽度约束 - 与 The7 一致 */
.vc_row {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}
.vc_row[data-vc-full-width] {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

/* vc_row_inner 嵌套行 */
.vc_row .vc_row {
    margin-left: -15px;
    margin-right: -15px;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

/**
 * iHeir Enterprise - 短代码兼容样式（the7-shortcodes.css）
 *
 * 恢复 The7 时代内容（dt_* 短代码渲染结果）的排版外观。
 * 仅当页面/文章内容包含 The7 短代码标记时才加载（由 functions.php 控制）。
 * v2.0 更新：完整覆盖 The7 与 WPBakery 所有短代码样式，修复容器闭合问题
 */

/* ============================================================
 * 1. 网格基础（wf-container / wf-cell / wf-table / wf-td）
 * ============================================================ */
.wf-container {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -20px;
	clear: both;
}
.wf-container:after {
	content: "";
	display: table;
	clear: both;
}
.wf-cell {
	box-sizing: border-box;
	padding: 0 20px;
	margin-bottom: 16px;
}
.wf-1 { width: 100%; }
.wf-1-2 { width: 50%; }
.wf-1-3 { width: 33.3333%; }
.wf-1-4 { width: 25%; }
.wf-1-5 { width: 20%; }
.wf-2-3 { width: 66.6666%; }
.wf-3-4 { width: 75%; }
.wf-usr-cell { float: left; box-sizing: border-box; padding: 0 8px; margin-bottom: 16px; }
.wf-table { display: table; width: 100%; table-layout: fixed; }
.wf-td { display: table-cell; vertical-align: middle; }

/* ============================================================
 * 2. dt_gap / dt_divider
 * ============================================================ */
.gap { display: block; width: 100%; clear: both; }
.dt-divider {
	height: 1px;
	background: #e4e4e4;
	margin: 20px 0;
	clear: both;
}

/* ============================================================
 * 3. dt_button
 * ============================================================ */
.dt-btn,
.more-link {
	display: inline-block;
	padding: 10px 22px;
	background: #1a5fb4;
	color: #fff !important;
	border-radius: 3px;
	font-weight: 600;
	text-decoration: none;
	transition: background .25s ease;
}
.dt-btn:hover,
.more-link:hover { background: #0e3f7c; color: #fff; }
.dt-btn-s { padding: 6px 14px; font-size: 13px; }
.dt-btn-m { padding: 10px 22px; font-size: 14px; }
.dt-btn-l { padding: 14px 30px; font-size: 16px; }
.btn-blue { background: #1a5fb4; }
.btn-dark-blue { background: #123c73; }
.btn-green { background: #3b7a4e; }
.btn-dark-green { background: #2d5f3c; }
.btn-red { background: #c0392b; }
.btn-berry { background: #8e44ad; }
.btn-orange { background: #e67e22; }
.btn-yellow { background: #f1c40f; color: #333 !important; }
.btn-pink { background: #e84393; }
.btn-violet { background: #6c5ce7; }
.btn-black { background: #2d3436; }
.btn-gray { background: #636e72; }
.btn-white { background: #fff; color: #333 !important; border: 1px solid #ddd; }
.btn-berry:hover, .btn-green:hover, .btn-red:hover, .btn-orange:hover,
.btn-pink:hover, .btn-violet:hover, .btn-black:hover, .btn-gray:hover { filter: brightness(0.9); }
.details.more-link { background: none; color: #1a5fb4 !important; padding: 0; }
.details.more-link:hover { color: #0e3f7c; }

/* ============================================================
 * 4. dt_banner
 * ============================================================ */
.shortcode-banner {
	position: relative;
	overflow: hidden;
	border-radius: 4px;
	margin-bottom: 20px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.shortcode-banner-bg { padding: 10px; box-sizing: border-box; }
.shortcode-banner-inside {
	box-sizing: border-box;
	overflow: hidden;
	text-align: center;
	vertical-align: middle;
}
.shortcode-banner-inside p { margin: 0; }
.shortcode-banner-link { cursor: pointer; }

/* ============================================================
 * 5. dt_list / dt_list_item（standard-arrow 等）
 * ============================================================ */
.standard-arrow,
.standard-number-list,
.image-arrow {
	list-style: none;
	margin: 0 0 20px 0;
	padding: 0;
}
.standard-arrow .dt-list-item,
.standard-number-list .dt-list-item,
.image-arrow .dt-list-item {
	position: relative;
	padding: 6px 0 6px 28px;
	border-bottom: 0;
}
.standard-arrow .dt-list-item:before {
	content: "›";
	position: absolute;
	left: 8px;
	top: 4px;
	color: #1a5fb4;
	font-weight: 700;
	font-size: 18px;
	line-height: 1.4;
}
.standard-number-list { counter-reset: dt-num; }
.standard-number-list .dt-list-item { counter-increment: dt-num; padding-left: 36px; }
.standard-number-list .dt-list-item:before {
	content: counter(dt-num) ".";
	position: absolute;
	left: 4px;
	top: 6px;
	color: #1a5fb4;
	font-weight: 700;
}
.list-divider .dt-list-item { border-bottom: 1px solid #ececec; padding-bottom: 10px; margin-bottom: 8px; }
.list-divider .dt-list-item:last-child { border-bottom: 0; }
.image-arrow .dt-list-item { padding-left: 0; }
.image-arrow .list-img { float: left; margin-right: 12px; max-width: 48px; }
.image-arrow .wf-table { display: table; }
.image-arrow .wf-table > div { display: table-cell; vertical-align: middle; }
.image-arrow .wf-table > div:first-child { width: 48px; }

/* ============================================================
 * 6. dt_benefits_vc（benefits-grid）
 * ============================================================ */
.benefits-grid { margin-bottom: 20px; }
.benefits-grid .wf-cell { text-align: center; margin-bottom: 20px; }
.benefits-grid .borders { position: relative; padding: 0 15px 20px; }
.benefits-grid .borders:after {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 1px;
	background: #eee;
}
.benefits-grid .wf-cell:last-child .borders:after { display: none; }
.benefits-grid-ico {
	display: inline-block;
	margin-bottom: 8px;
	font-size: 44px;
	line-height: 1;
	color: #1a5fb4;
}
.benefits-grid-ico img { max-width: 80px; height: auto; }
.icons-bg .benefits-grid-ico {
	width: 90px;
	height: 90px;
	line-height: 90px;
	text-align: center;
	background: #f5f7fa;
	border-radius: 50%;
}
.icons-bg .benefits-grid-ico img { max-width: 48px; vertical-align: middle; }
.benefits-grid h2, .benefits-grid h3, .benefits-grid h4, .benefits-grid h5 { margin: 8px 0; }
.benefits-grid .text-normal { font-size: 14px; line-height: 1.7; color: #666; }
.benefits-grid .text-small { font-size: 13px; color: #777; }
.benefits-grid .text-big { font-size: 16px; color: #555; }
.benefits-style-one.benefits-grid .wf-cell { text-align: left; }
.benefits-style-one.benefits-grid .wf-td:first-child { width: 90px; padding-right: 12px; }

/* ============================================================
 * 7. dt_logos（logos-grid）
 * ============================================================ */
.logos-grid { margin-bottom: 20px; }
.logos-grid .wf-cell { text-align: center; }
.logos-grid .borders { position: relative; padding: 10px; }
.logos-grid .borders:after {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 1px;
	background: #eee;
}
.logos-grid .wf-cell:last-child .borders:after { display: none; }
.logos-grid img { max-width: 100%; height: auto; filter: grayscale(100%); opacity: .75; transition: all .3s ease; }
.logos-grid a:hover img { filter: grayscale(0); opacity: 1; }

/* ============================================================
 * 8. dt_portfolio / dt_blog_posts（产品/文章网格）
 * ============================================================ */
.portfolio-grid,
.shortcode-blog-posts { margin: 0 -5px; }
.portfolio-grid .wf-cell,
.shortcode-blog-posts .wf-cell { padding: 0 5px; }
.portfolio-item,
.blog-post {
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 4px;
	overflow: hidden;
	padding: 0 0 14px;
	height: 100%;
	box-sizing: border-box;
	transition: box-shadow .25s ease, transform .25s ease;
}
.portfolio-item:hover,
.blog-post:hover { box-shadow: 0 6px 18px rgba(0,0,0,.08); transform: translateY(-2px); }
.portfolio-thumb img,
.blog-thumb img { width: 100%; height: auto; display: block; }
.portfolio-title,
.blog-title { font-size: 15px; margin: 10px 14px 6px; }
.portfolio-title a,
.blog-title a { color: #222; text-decoration: none; }
.portfolio-title a:hover,
.blog-title a:hover { color: #1a5fb4; }
.portfolio-meta { font-size: 12px; color: #999; margin: 0 14px 6px; }
.portfolio-excerpt,
.blog-excerpt { font-size: 13px; color: #666; margin: 0 14px 8px; line-height: 1.6; }
.blog-meta { font-size: 12px; color: #999; margin: 0 14px 8px; }
.portfolio-item .details,
.blog-post .details { margin: 0 14px; }

/* ============================================================
 * 9. dt_blog_posts_small（新闻侧栏列表）
 * ============================================================ */
.dt-blog-posts-small {
	list-style: none;
	margin: 0;
	padding: 0;
}
.dt-blog-posts-small li {
	padding: 6px 0;
	border-bottom: 1px dashed #e8e8e8;
}
.dt-blog-posts-small li:last-child { border-bottom: 0; }
.dt-blog-posts-small a { color: #444; text-decoration: none; font-size: 14px; }
.dt-blog-posts-small a:hover { color: #1a5fb4; }

/* ============================================================
 * 10. dt_sc_heading / dt-quote / dt-highlight / dt-call-to-action
 * ============================================================ */
.dt-sc-heading { margin: 18px 0 12px; color: #1a2b39; }
.dt-quote {
	border-left: 4px solid #1a5fb4;
	background: #f8f9fb;
	padding: 14px 18px;
	margin: 16px 0;
	color: #555;
	font-style: italic;
}
.dt-highlight { padding: 1px 6px; border-radius: 2px; }
.dt-call-to-action {
	background: #f0f4fa;
	border: 1px solid #d7e2f0;
	border-radius: 4px;
	padding: 20px 24px;
	margin: 18px 0;
	text-align: center;
}

/* ============================================================
 * 11. WPBakery 兜底容器（vc_row / vc_column）
 * ============================================================ */
.vc_row.vc_row-fluid { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.vc_row-fluid:after,
.vc_row-fluid:before { content: ""; display: table; }
.vc_column_container { box-sizing: border-box; padding: 0 15px; }
.vc_col-sm-12 { width: 100%; }
.vc_col-sm-9 { width: 75%; }
.vc_col-sm-8 { width: 66.6666%; }
.vc_col-sm-6 { width: 50%; }
.vc_col-sm-4 { width: 33.3333%; }
.vc_col-sm-3 { width: 25%; }
.vc_col-sm-2 { width: 16.6666%; }
.vc_col-sm-10 { width: 83.3333%; }
.vc_empty_space { clear: both; }
.wpb_single_image img { max-width: 100%; height: auto; }

/* ============================================================
 * 12. 手风琴（vc_accordion / vc_toggle / The7 accordion）
 * ============================================================ */
.dt-accordion { margin: 14px 0; }
.dt-accordion-item {
	border: 1px solid #e4e4e4;
	border-radius: 4px;
	margin-bottom: 10px;
	overflow: hidden;
}
.dt-accordion-head {
	margin: 0;
	padding: 12px 18px;
	background: #f7f8fa;
	font-size: 15px;
	cursor: pointer;
	position: relative;
	border: none;
	width: 100%;
	text-align: left;
	font-weight: 600;
	color: #333;
}
.dt-accordion-head:after {
	content: "+";
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: #1a5fb4;
	font-weight: 700;
	font-size: 1.2rem;
}
.dt-accordion-head.is-open:after { content: "−"; }
.dt-accordion-body { padding: 12px 18px; border-top: 1px solid #eee; }

/* ============================================================
 * 13. 标签页
 * ============================================================ */
.dt-tabs { margin-bottom: 20px; }
.dt-tabs .dt-tab-nav { list-style: none; margin: 0; padding: 0; display: flex; border-bottom: 2px solid #e4e4e4; }
.dt-tabs .dt-tab-nav li { margin-right: 4px; }
.dt-tabs .dt-tab-nav button {
	padding: 10px 20px;
	background: transparent;
	border: 1px solid transparent;
	border-bottom: none;
	border-radius: 4px 4px 0 0;
	cursor: pointer;
	font-weight: 500;
	color: #666;
}
.dt-tabs .dt-tab-nav button.is-active {
	background: #fff;
	border-color: #e4e4e4;
	border-bottom-color: #fff;
	color: #1a5fb4;
	margin-bottom: -2px;
}
.dt-tab-content { padding: 20px; border: 1px solid #e4e4e4; border-top: none; border-radius: 0 0 4px 4px; }

/* ============================================================
 * 14. 价格表
 * ============================================================ */
.dt-pricing-table { display: flex; flex-wrap: wrap; margin: 0 -10px; }
.dt-pricing-column {
	flex: 1;
	min-width: 280px;
	margin: 0 10px 20px;
	padding: 20px;
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 4px;
	text-align: center;
}
.dt-pricing-column.featured { border-color: #1a5fb4; box-shadow: 0 4px 16px rgba(26,95,180,.15); }
.dt-pricing-column .price { font-size: 48px; font-weight: 700; color: #1a5fb4; margin: 16px 0; }
.dt-pricing-column .period { font-size: 14px; color: #999; }
.dt-pricing-column .features { list-style: none; padding: 0; margin: 20px 0; }
.dt-pricing-column .features li { padding: 8px 0; border-bottom: 1px solid #eee; }
.dt-pricing-column .features li:last-child { border-bottom: none; }

/* ============================================================
 * 15. 团队 / 评价
 * ============================================================ */
.dt-team { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.dt-team .wf-cell { padding: 0 15px; }
.dt-team-member { text-align: center; }
.dt-team-member img { border-radius: 50%; max-width: 100%; }
.dt-team-member .name { font-weight: 600; margin: 12px 0 4px; }
.dt-team-member .role { color: #1a5fb4; font-size: 14px; }
.dt-team-member .bio { margin-top: 12px; font-size: 14px; color: #666; }

.dt-testimonials { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.dt-testimonial { flex: 1; min-width: 300px; padding: 0 15px; margin-bottom: 20px; }
.dt-testimonial blockquote { font-style: italic; color: #555; }
.dt-testimonial .author { margin-top: 12px; font-weight: 600; }
.dt-testimonial .position { font-size: 14px; color: #999; }

/* ============================================================
 * 16. 计数器 / 进度条 / 饼图 / 圆环
 * ============================================================ */
.dt-counter { text-align: center; padding: 20px; }
.dt-counter .counter-value { font-size: 48px; font-weight: 700; color: #1a5fb4; line-height: 1; }
.dt-counter .counter-label { margin-top: 8px; font-size: 16px; color: #666; }

.dt-progress-bar { margin-bottom: 16px; }
.dt-progress-bar .bar {
	height: 8px;
	background: #eee;
	border-radius: 4px;
	overflow: hidden;
}
.dt-progress-bar .bar-fill {
	height: 100%;
	background: #1a5fb4;
	border-radius: 4px;
	transition: width .6s ease;
}
.dt-progress-bar .label { margin-bottom: 6px; font-weight: 500; }
.dt-progress-bar .percent { font-size: 12px; color: #999; }

.dt-pie-chart,
.dt-circle { text-align: center; }

/* ============================================================
 * 17. 客户 Logo 轮播
 * ============================================================ */
.dt-clients { margin-bottom: 20px; }
.dt-clients-carousel { overflow: hidden; }
.dt-clients-carousel .wf-cell { text-align: center; }
.dt-clients-carousel img { max-width: 100%; height: auto; filter: grayscale(100%); opacity: .7; transition: all .3s ease; }
.dt-clients-carousel a:hover img { filter: grayscale(0); opacity: 1; }

/* ============================================================
 * 18. 图标 / 图标盒子
 * ============================================================ */
.dt-icon { display: inline-block; font-size: 32px; color: #1a5fb4; }
.dt-icon-box { text-align: center; padding: 20px; }
.dt-icon-box .icon { font-size: 48px; color: #1a5fb4; margin-bottom: 12px; }
.dt-icon-box .title { font-weight: 600; margin-bottom: 8px; }
.dt-icon-box .desc { color: #666; }

/* ============================================================
 * 19. 倒计时 / 地图 / 滑块
 * ============================================================ */
.dt-countdown { text-align: center; }
.dt-countdown .time { display: flex; justify-content: center; gap: 10px; }
.dt-countdown .unit { background: #f5f7fa; border-radius: 4px; padding: 10px 16px; min-width: 60px; }
.dt-countdown .value { font-size: 24px; font-weight: 700; color: #1a5fb4; }
.dt-countdown .label { font-size: 12px; color: #999; }

.dt-maps,
.dt-google-map { height: 400px; width: 100%; border: 1px solid #eee; border-radius: 4px; overflow: hidden; }

.dt-slider,
.dt-rev-slider,
.dt-layer-slider { position: relative; overflow: hidden; }
.dt-slider img { width: 100%; height: auto; }

/* ============================================================
 * 20. 社交分享
 * ============================================================ */
.dt-social-share { margin: 20px 0; }
.dt-social-share a { display: inline-block; margin-right: 8px; padding: 8px 16px; background: #f5f7fa; border-radius: 4px; color: #666; font-size: 14px; }
.dt-social-share a:hover { background: #1a5fb4; color: #fff; }

/* ============================================================
 * 21. 垂直标签页
 * ============================================================ */
.dt-tabs-vertical { display: flex; }
.dt-tabs-vertical .dt-tab-nav { flex: 0 0 200px; border-right: 1px solid #eee; padding-right: 20px; }
.dt-tabs-vertical .dt-tab-nav li { margin: 4px 0; }
.dt-tabs-vertical .dt-tab-nav button { width: 100%; text-align: left; border-radius: 4px; }
.dt-tabs-vertical .dt-tab-content { flex: 1; padding-left: 20px; }


/* ============================================================
 * The7 动画系统 (animation 属性支持)
 * ============================================================ */
[data-iheir-animation] {
    opacity: 0;
    transition: opacity 0.1s ease;
}
[data-iheir-animation].iheir-animated {
    opacity: 1;
}

/* Fade 动画 */
[data-iheir-animation*="fadeIn"],
[data-iheir-animation*="fade_in"] {
    animation-name: iheirFadeIn;
    animation-duration: 0.8s;
    animation-fill-mode: both;
}
@keyframes iheirFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Slide 动画 */
[data-iheir-animation*="slideDown"],
[data-iheir-animation*="slide_down"] {
    animation-name: iheirSlideDown;
    animation-duration: 0.8s;
    animation-fill-mode: both;
}
@keyframes iheirSlideDown {
    from { opacity: 0; transform: translateY(-30px); }
    to { opacity: 1; transform: translateY(0); }
}

[data-iheir-animation*="slideUp"],
[data-iheir-animation*="slide_up"] {
    animation-name: iheirSlideUp;
    animation-duration: 0.8s;
    animation-fill-mode: both;
}
@keyframes iheirSlideUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

[data-iheir-animation*="slideLeft"],
[data-iheir-animation*="slide_left"] {
    animation-name: iheirSlideLeft;
    animation-duration: 0.8s;
    animation-fill-mode: both;
}
@keyframes iheirSlideLeft {
    from { opacity: 0; transform: translateX(-30px); }
    to { opacity: 1; transform: translateX(0); }
}

[data-iheir-animation*="slideRight"],
[data-iheir-animation*="slide_right"] {
    animation-name: iheirSlideRight;
    animation-duration: 0.8s;
    animation-fill-mode: both;
}
@keyframes iheirSlideRight {
    from { opacity: 0; transform: translateX(30px); }
    to { opacity: 1; transform: translateX(0); }
}

/* Scale 动画 */
[data-iheir-animation*="scaleIn"],
[data-iheir-animation*="scale_in"],
[data-iheir-animation*="zoomIn"],
[data-iheir-animation*="zoom_in"] {
    animation-name: iheirScaleIn;
    animation-duration: 0.6s;
    animation-fill-mode: both;
}
@keyframes iheirScaleIn {
    from { opacity: 0; transform: scale(0.8); }
    to { opacity: 1; transform: scale(1); }
}

/* Bounce 动画 */
[data-iheir-animation*="bounce"] {
    animation-name: iheirBounce;
    animation-duration: 1s;
    animation-fill-mode: both;
}
@keyframes iheirBounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); opacity: 1; }
    40% { transform: translateY(-20px); }
    60% { transform: translateY(-10px); }
}

/* 动画延迟 */
[data-iheir-animation-delay="100"] { animation-delay: 0.1s; }
[data-iheir-animation-delay="200"] { animation-delay: 0.2s; }
[data-iheir-animation-delay="300"] { animation-delay: 0.3s; }
[data-iheir-animation-delay="400"] { animation-delay: 0.4s; }
[data-iheir-animation-delay="500"] { animation-delay: 0.5s; }
[data-iheir-animation-delay="600"] { animation-delay: 0.6s; }
[data-iheir-animation-delay="700"] { animation-delay: 0.7s; }
[data-iheir-animation-delay="800"] { animation-delay: 0.8s; }
[data-iheir-animation-delay="900"] { animation-delay: 0.9s; }
[data-iheir-animation-delay="1000"] { animation-delay: 1.0s; }

/* 响应式动画修复 */
@media (max-width: 768px) {
    [data-iheir-animation] {
        opacity: 1 !important;
        animation: none !important;
        transform: none !important;
    }
}

/* ============================================================
 * 22. 响应式
 * ============================================================ */
@media (max-width: 992px) {
	.wf-1-4 { width: 50%; }
	.wf-1-5 { width: 50%; }
	.vc_col-sm-8, .vc_col-sm-9, .vc_col-sm-10 { width: 100%; }
	.dt-pricing-column { min-width: 100%; }
	.dt-testimonial { min-width: 100%; }
	.dt-tabs-vertical { flex-direction: column; }
	.dt-tabs-vertical .dt-tab-nav { flex: auto; border-right: none; border-bottom: 1px solid #eee; padding: 0 0 20px; display: flex; overflow-x: auto; }
	.dt-tabs-vertical .dt-tab-nav li { margin: 0 4px 0 0; }
	.dt-tabs-vertical .dt-tab-nav button { border-radius: 4px; white-space: nowrap; }
	.dt-tabs-vertical .dt-tab-content { padding: 20px 0 0; }
}
@media (max-width: 768px) {
	.wf-1-2, .wf-1-3, .wf-2-3, .wf-3-4 { width: 100%; }
	.wf-1-4 { width: 50%; }
	.wf-td { display: block; }
	.wf-table { display: block; }
	.benefits-style-one.benefits-grid .wf-td:first-child { width: auto; }
	.vc_col-sm-2, .vc_col-sm-3, .vc_col-sm-4, .vc_col-sm-6 { width: 100%; }
	.dt-team .wf-cell { width: 50%; }
}
@media (max-width: 480px) {
	.wf-1-4 { width: 100%; }
	.vc_col-sm-2, .vc_col-sm-3, .vc_col-sm-4, .vc_col-sm-6 { width: 100%; }
	.dt-team .wf-cell { width: 100%; }
	.dt-tabs .dt-tab-nav button { padding: 8px 12px; font-size: 13px; }
}

/* ============================================================
 * 23. 清除浮动工具类（防止内容跑到页脚）
 * ============================================================ */
.clearfix::after,
.wf-container::after,
.vc_row-fluid::after,
.benefits-grid::after,
.logos-grid::after,
.portfolio-grid::after,
.shortcode-blog-posts::after,
.dt-accordion::after,
.dt-tabs::after,
.dt-pricing-table::after,
.dt-team::after,
.dt-testimonials::after,
.dt-clients::after {
    content: "";
    display: table;
    clear: both;
}

/* 确保容器正确包含浮动子元素 */
.site-main,
.site-content,
.content-area,
.entry-content,
.the7-legacy-content {
    overflow: hidden;
    /* 或使用 clearfix */
}

/* ============================================================
 * 24. WPBakery 特定组件补充样式
 * ============================================================ */
.vc_message,
.vc_alert,
.vc_info_box {
	padding: 16px 20px;
	border-radius: 4px;
	margin: 16px 0;
}
.vc_message { background: #e8f5e9; border: 1px solid #c8e6c9; color: #2e7d32; }
.vc_alert { background: #fff3e0; border: 1px solid #ffe0b2; color: #e65100; }
.vc_info_box { background: #e3f2fd; border: 1px solid #bbdefb; color: #1565c0; }

.vc_text_separator {
	text-align: center;
	margin: 20px 0;
}
.vc_text_separator .separator-text {
	display: inline-block;
	padding: 0 16px;
	background: #fff;
	position: relative;
	z-index: 1;
}
.vc_text_separator .separator-line {
	border-top: 1px solid #e4e4e4;
	margin-top: -10px;
}

.vc_toggle .dt-accordion-head {
	background: #f5f7fa;
}
.vc_toggle .dt-accordion-body {
	border-top: 1px solid #eee;
}

.vc_carousel,
.vc_posts_grid,
.vc_posts_slider {
	margin: 0 -10px;
}
.vc_carousel .wf-cell,
.vc_posts_grid .wf-cell,
.vc_posts_slider .wf-cell {
	padding: 0 10px;
}

.vc_raw_html,
.vc_raw_js {
	overflow: hidden;
}

.vc_widget,
.vc_widget_sidebar {
	overflow: hidden;
}

/* WPBakery 基础网格样式（vc_basic_grid 等）*/
.vc_grid { margin: 0 -5px; }
.vc_grid .vc_grid-item { padding: 0 5px; margin-bottom: 10px; }
.vc_grid .vc_grid-item-mini { height: 100%; background: #fff; border: 1px solid #ececec; border-radius: 4px; overflow: hidden; }

/* ============================================================
 * WireFrame Grid System - 补充 wf-2/3, wf-3/4, wf-span 等缺失宽度
 * ============================================================ */
.wf-2-3, .wf-span-8 { width: 66.6667%; }
.wf-3-4, .wf-span-9 { width: 75%; }
.wf-1-6, .wf-span-2 { width: 16.6667%; }
.wf-span-1 { width: 8.3333%; }
.wf-tr { display: table-row; }
.wf-float-left { float: left; }
.wf-float-right { float: right; }

/* Benefits grid */
.benefits-grid { margin: 0 -20px; }
.benefits-grid .wf-cell { margin-bottom: 20px; }
.benefit-item { text-align: center; padding: 20px; }
.benefit-item img { max-width: 80px; margin-bottom: 15px; }
.benefit-item h2, .benefit-item h3, .benefit-item h4,
.benefit-item h5, .benefit-item h6 { margin-bottom: 10px; }

/* Accordion (dt_item) */
.st-accordion { }
.st-accordion ul { list-style: none; padding: 0; margin: 0; }
.st-accordion li { margin-bottom: 5px; }
.st-accordion li > a.text-primary {
    display: block; padding: 10px 15px;
    background: #f5f5f5; text-decoration: none;
    color: #333; font-weight: 600; border-radius: 4px;
    transition: background 0.2s;
}
.st-accordion li > a.text-primary:hover { background: #e9e9e9; }
.st-accordion .st-content {
    padding: 15px; display: none;
    border: 1px solid #eee; border-top: none;
    border-radius: 0 0 4px 4px;
}
.st-accordion li.open .st-content { display: block; }

/* Toggle (dt_toggle) */
.st-toggle { margin-bottom: 5px; }
.st-toggle > a.text-primary {
    display: block; padding: 10px 15px;
    background: #f5f5f5; text-decoration: none;
    color: #333; font-weight: 600; border-radius: 4px;
    transition: background 0.2s;
}
.st-toggle > a.text-primary:hover { background: #e9e9e9; }
.st-toggle .st-toggle-content {
    padding: 15px; display: none;
    border: 1px solid #eee; border-top: none;
    border-radius: 0 0 4px 4px;
}
.st-toggle.open .st-toggle-content { display: block; }

/* Code block (dt_code) */
.shortcode-code {
    background: #f8f8f8; border: 1px solid #ddd;
    border-radius: 4px; padding: 15px;
    font-family: 'Courier New', Courier, monospace;
    font-size: 13px; line-height: 1.5;
    overflow-x: auto; white-space: pre-wrap;
    word-wrap: break-word;
}

/* Accordion / Toggle JS toggle support */
.st-accordion li > a.text-primary,
.st-toggle > a.text-primary { cursor: pointer; }

/* ============================================================
 * dt_stripe - 彩色条纹区域
 * ============================================================ */
.dt-stripe { padding: 40px 0; margin: 20px -9999px; clear: both; }
.dt-stripe > * { max-width: 1200px; margin-left: auto; margin-right: auto; padding: 0 20px; }

/* ============================================================
 * dt_social_icon / dt_social_icons - 社交图标
 * ============================================================ */
.dt-social-icons { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.dt-social-icon-link { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--color-primary); color: #fff; font-size: 16px; text-decoration: none; transition: background .2s, transform .2s; }
.dt-social-icon-link:hover { background: var(--color-primary-dark); color: #fff; transform: scale(1.1); text-decoration: none; }

/* ============================================================
 * dt_animated_text - 动画文本
 * ============================================================ */
.dt-animated-text { opacity: 0; transition: opacity 0.6s ease, transform 0.6s ease; }
.dt-animated-text.iheir-animated { opacity: 1; transform: none; }

/* ============================================================
 * dt_tooltip - 提示工具
 * ============================================================ */
.dt-tooltip { position: relative; display: inline-block; border-bottom: 1px dashed var(--color-primary); cursor: help; }
.dt-tooltip::after { content: attr(data-tooltip); position: absolute; background: #333; color: #fff; padding: 6px 12px; border-radius: 4px; font-size: 0.82rem; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 1000; }
.dt-tooltip[data-direction='top']::after { bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 6px; }
.dt-tooltip[data-direction='bottom']::after { top: 100%; left: 50%; transform: translateX(-50%); margin-top: 6px; }
.dt-tooltip[data-direction='left']::after { right: 100%; top: 50%; transform: translateY(-50%); margin-right: 6px; }
.dt-tooltip[data-direction='right']::after { left: 100%; top: 50%; transform: translateY(-50%); margin-left: 6px; }
.dt-tooltip:hover::after { opacity: 1; }

/* ============================================================
 * dt_text - 文本块
 * ============================================================ */
.dt-text-block { margin: 12px 0; }

/* ============================================================
 * dt_vc_list - WPBakery 列表
 * ============================================================ */
.dt-vc-list { list-style: none; margin: 12px 0; padding: 0; }
.dt-vc-list.standard-arrow .dt-list-item { padding: 6px 0 6px 28px; position: relative; }
.dt-vc-list.standard-arrow .dt-list-item:before { content: "\203A"; position: absolute; left: 8px; top: 4px; color: var(--color-primary); font-weight: 700; font-size: 18px; }

/* ============================================================
 * dt_gallery / dt_small_photos - 画廊
 * ============================================================ */
.dt-gallery { display: grid; gap: 10px; margin: 16px 0; }
.dt-gallery-cols-1 { grid-template-columns: 1fr; }
.dt-gallery-cols-2 { grid-template-columns: repeat(2, 1fr); }
.dt-gallery-cols-3 { grid-template-columns: repeat(3, 1fr); }
.dt-gallery-cols-4 { grid-template-columns: repeat(4, 1fr); }
.dt-gallery-cols-5 { grid-template-columns: repeat(5, 1fr); }
.dt-gallery-cols-6 { grid-template-columns: repeat(6, 1fr); }
.dt-gallery-item img { width: 100%; height: auto; display: block; border-radius: var(--radius); transition: transform .3s; }
.dt-gallery-item img:hover { transform: scale(1.03); }
.dt-small-photos { display: flex; flex-wrap: wrap; gap: 8px; }
.dt-small-photos img { max-width: 120px; height: auto; border-radius: var(--radius); }

/* ============================================================
 * dt_slideshow / dt_fancy_video
 * ============================================================ */
.dt-slideshow { margin: 16px 0; overflow: hidden; border-radius: var(--radius); }
.dt-fancy-video { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; margin: 16px 0; border-radius: var(--radius); }
.dt-fancy-video iframe, .dt-fancy-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* ============================================================
 * 响应式补充
 * ============================================================ */
@media (max-width: 768px) {
    .dt-gallery-cols-4, .dt-gallery-cols-5, .dt-gallery-cols-6 { grid-template-columns: repeat(2, 1fr); }
    .dt-stripe { margin: 20px 0; padding: 24px 0; }
}

/* ============================================================
 * 25. js_composer(WPBakery) 覆盖修复（v2.8）
 * ============================================================
 * 说明：js_composer.min.css 在主题 CSS 之后加载，
 * 其 `.vc_column_container { padding-left:0; padding-right:0 }`
 * 会覆盖主题的 15px 列间距，导致同行多列内容紧贴无缝隙；
 * `.vc_column_container { overflow:hidden }` 会把左侧内容裁掉。
 * 以下规则使用更高特异性选择器强制恢复 The7 网格间距。
 */
.vc_row > .vc_column_container,
.vc_row.vc_row-fluid > .vc_column_container,
.vc_row_inner > .vc_column_container {
    padding-left: 15px !important;
    padding-right: 15px !important;
    overflow: visible !important;
}
/* 兜底：任何位置的 vc 列都恢复左右内边距 */
.vc_column_container.vc_col-sm-1,
.vc_column_container.vc_col-sm-2,
.vc_column_container.vc_col-sm-3,
.vc_column_container.vc_col-sm-4,
.vc_column_container.vc_col-sm-5,
.vc_column_container.vc_col-sm-6,
.vc_column_container.vc_col-sm-7,
.vc_column_container.vc_col-sm-8,
.vc_column_container.vc_col-sm-9,
.vc_column_container.vc_col-sm-10,
.vc_column_container.vc_col-sm-11,
.vc_column_container.vc_col-sm-12 {
    padding-left: 15px !important;
    padding-right: 15px !important;
    overflow: visible !important;
}
/* 行容器：允许横向负 margin 溢出显示，不被 entry-content 裁切 */
.vc_row,
.vc_row-fluid,
.vc_row.vc_row-fluid {
    overflow: visible !important;
}
/* 内容容器：不再用 overflow:hidden 裁切横向内容，
   改用 clearfix 处理浮动（防止内容跑到页脚） */
.site-main,
.site-content,
.content-area,
.entry-content,
.the7-legacy-content,
.single .entry-content,
.page .entry-content {
    overflow: visible !important;
}

/* vc_row 等高模式支持 (The7 原生类名) */
.vc_row.vc_row-o-equal-height {
    display: flex;
    flex-wrap: wrap;
}
.vc_row.vc_row-o-equal-height .vc_column_container {
    display: flex;
}
.vc_row.vc_row-o-equal-height .wpb_column {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.vc_row.vc_row-o-equal-height .vc_column-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}
.vc_row.vc_row-o-equal-height .vc_column_inner {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* 图片撑满列高 */
.vc_row.vc_row-o-equal-height .vc_single_image-img {
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    width: 100%;
}

/* 垂直对齐模式 */
.vc_row.vc_row-o-content-middle .vc_column_inner { justify-content: center; }
.vc_row.vc_row-o-content-top .vc_column_inner { justify-content: flex-start; }
.vc_row.vc_row-o-content-bottom .vc_column_inner { justify-content: flex-end; }

/* 响应式：移动端堆叠 */
@media (max-width: 768px) {
    .vc_row.vc_row-o-equal-height,
    .vc_row.vc_row-o-content-middle,
    .vc_row.vc_row-o-content-top,
    .vc_row.vc_row-o-content-bottom {
        display: block;
    }
    .vc_row.vc_row-o-equal-height .vc_column_container { display: block; }
}