/*
Theme Name:   astra Child
Theme URI:    https://yourdomain.com/
Description:  astra Child Theme
Author:       Your Name
Author URI:   https://yourdomain.com/
Template:     astra
Version:      1.0.0
*/

/* ============================================================
 * FAQ 列表样式（Quick and Easy FAQs 插件覆盖样式）
 * 目标结构：
 *   .qe-faq-toggle > .qe-toggle-title > h4 > i.fa（隐藏原图标）
 *   .qe-faq-toggle > .qe-toggle-content
 *   .qe-faq-toggle.active 时展开
 * ============================================================ */

/* 每一条 FAQ 的外层容器 */
.qe-faq-toggle {
    margin-bottom: 15px;
    border: none;
    transition: all 0.3s;
}

/* 标题条：浅灰底 + 左右留出图标/箭头位置 */
.qe-faq-toggle .qe-toggle-title {
    background-color: #ececec;
    border: none;
    padding: 18px 60px 18px 70px;
    position: relative;
    cursor: pointer;
    transition: background-color 0.2s;
}

.qe-faq-toggle.active .qe-toggle-title,
.qe-faq-toggle .qe-toggle-title:hover {
    background-color: #e2e2e2;
}

/* 隐藏插件自带的 +/- 图标 */
.qe-faq-toggle .qe-toggle-title h4 i.fa {
    display: none !important;
}

/* 标题文字 */
.qe-faq-toggle .qe-toggle-title h4 {
    font-weight: 700;
    font-size: 16px;
    color: #222;
    margin: 0;
    line-height: 1.4;
}

/* 左侧橙色问号圆圈 */
.qe-faq-toggle .qe-toggle-title::before {
    content: "?";
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #f28c1a;
    color: #fff;
    font-weight: 700;
    font-size: 20px;
    font-family: Arial, sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* 右侧箭头（向下 V） */
.qe-faq-toggle .qe-toggle-title::after {
    content: "";
    position: absolute;
    right: 24px;
    top: 50%;
    width: 14px;
    height: 14px;
    border-right: 3px solid #222;
    border-bottom: 3px solid #222;
    transform: translate(0, -70%) rotate(45deg);
    transition: transform 0.3s ease;
}

/* 展开状态：箭头翻转为向上 ^ */
.qe-faq-toggle.active .qe-toggle-title::after {
    transform: translate(0, -30%) rotate(-135deg);
}

/* 答案区：白底 + 细边框 + 左侧 A 圆圈位置 */
.qe-faq-toggle .qe-toggle-content {
    background-color: #fff;
    border: 1px solid #e5e5e5;
    padding: 22px 22px 22px 70px;
    margin: 0;
    position: relative;
}

/* 左侧灰色 A 圆圈 */
.qe-faq-toggle .qe-toggle-content::before {
    content: "A";
    position: absolute;
    left: 15px;
    top: 22px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #a6a6a6;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    font-family: Arial, sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* 答案文字 */
.qe-faq-toggle .qe-toggle-content p {
    margin: 0 0 10px;
    color: #333;
    line-height: 1.7;
}

.qe-faq-toggle .qe-toggle-content p:last-child {
    margin-bottom: 0;
}

/* 移动端适配 */
@media (max-width: 576px) {
    .qe-faq-toggle .qe-toggle-title {
        padding: 14px 48px 14px 58px;
    }
    .qe-faq-toggle .qe-toggle-title::before,
    .qe-faq-toggle .qe-toggle-content::before {
        width: 30px;
        height: 30px;
        font-size: 16px;
        left: 12px;
    }
    .qe-faq-toggle .qe-toggle-content {
        padding: 18px 18px 18px 58px;
    }
    .qe-faq-toggle .qe-toggle-title::after {
        right: 16px;
        width: 11px;
        height: 11px;
    }
    .qe-faq-toggle .qe-toggle-title h4 {
        font-size: 15px;
    }
}

/* ============================================================
 * FAQ 页面大标题：整屏通栏 + 蓝底白字
 * 用 Elementor 生成的唯一元素 ID 精确定位，不影响其他页面
 * ============================================================ */
.elementor-element.elementor-element-4b56ca1 {
    background-color: #0067FF !important;   /* 系统主蓝（与首页 Product 标题条一致） */
    padding: 28px 20px !important;
    text-align: center !important;
    /* 让元素突破父容器，实现整屏通栏 */
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    box-sizing: border-box !important;
}

.elementor-element.elementor-element-4b56ca1 .elementor-widget-container {
    padding: 0 !important;
    background: transparent !important;
}

.elementor-element.elementor-element-4b56ca1 .elementor-heading-title {
    color: #fff !important;
    margin: 0 !important;
    text-align: center !important;
    line-height: 1.2 !important;
}

/* 移动端适配：减小上下留白与字号 */
@media (max-width: 576px) {
    .elementor-element.elementor-element-4b56ca1 {
        padding: 28px 16px !important;
    }
    .elementor-element.elementor-element-4b56ca1 .elementor-heading-title {
        font-size: 28px !important;
    }
}

/* ============================================================
 * FAQ 分类过滤器（Quick and Easy FAQs）：药丸型蓝色按钮
 * 结构：ul.qe-faqs-filters-container > li[.active] > a.qe-faqs-filter
 * 默认：白底蓝边蓝字；hover：淡蓝底；active（选中）：蓝底白字
 * ============================================================ */
ul.qe-faqs-filters-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 12px;
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    justify-content: center;
}

ul.qe-faqs-filters-container > li {
    list-style: none;
    margin: 0;
    padding: 0;
    border: none;
}

ul.qe-faqs-filters-container > li > a.qe-faqs-filter {
    display: inline-block;
    padding: 8px 18px;
    border: 1px solid #0067FF;      /* 系统主蓝边框 */
    border-radius: 999px;           /* 药丸型 */
    background-color: #0067FF;      /* 未选中：蓝底 */
    color: #fff;                    /* 未选中：白字 */
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
}

ul.qe-faqs-filters-container > li > a.qe-faqs-filter:hover {
    background-color: #0052cc;      /* hover：稍深蓝 */
    border-color: #0052cc;
    color: #fff;
}

ul.qe-faqs-filters-container > li.active > a.qe-faqs-filter,
ul.qe-faqs-filters-container > li > a.qe-faqs-filter.active {
    background-color: #f28c1a;      /* 选中：系统主橙（与问号圆圈一致） */
    color: #fff;                    /* 选中：白字 */
    border-color: #f28c1a;
}

/* 移动端：改为 2 列等宽网格，按钮统一长度 */
@media (max-width: 576px) {
    ul.qe-faqs-filters-container {
        display: grid;
        grid-template-columns: 1fr 1fr;   /* 2 列等宽 */
        gap: 10px;
        justify-content: stretch;
    }
    ul.qe-faqs-filters-container > li {
        width: 100%;
    }
    ul.qe-faqs-filters-container > li > a.qe-faqs-filter {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 44px;
        padding: 8px 10px;
        font-size: 13px;
        text-align: center;
        white-space: normal;          /* 允许长文字换行 */
        line-height: 1.25;
        box-sizing: border-box;
    }
}

/* ============================================================
 * 全站右下角悬浮 WhatsApp 按钮
 * ============================================================ */
.sp-wa-float {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 9999;
    font-family: inherit;
}

.sp-wa-float .sp-wa-btn {
    width: 56px;
    height: 56px;
    border: none;
    border-radius: 50%;
    background-color: #25D366;                  /* WhatsApp 官方绿 */
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    padding: 0;
    animation: sp-wa-pulse 2.2s ease-out infinite;
}

.sp-wa-float .sp-wa-btn:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
    animation: none;
}

.sp-wa-float .sp-wa-btn svg {
    display: block;
    width: 32px;
    height: 32px;
}

/* 呼吸光环动画，让图标更醒目 */
@keyframes sp-wa-pulse {
    0%   { box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25), 0 0 0 0 rgba(37, 211, 102, 0.55); }
    70%  { box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25), 0 0 0 16px rgba(37, 211, 102, 0); }
    100% { box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25), 0 0 0 0 rgba(37, 211, 102, 0); }
}

/* 桌面端点击后弹出的二维码卡片 */
.sp-wa-float .sp-wa-popup {
    position: absolute;
    right: 0;
    bottom: 72px;                                /* 位于按钮正上方 */
    width: 220px;
    background: #fff;
    border-radius: 10px;
    padding: 16px 14px 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
    text-align: center;
    animation: sp-wa-fadein 0.18s ease-out;
}

.sp-wa-float .sp-wa-popup[hidden] {
    display: none;
}

.sp-wa-float .sp-wa-popup::after {
    /* 卡片底部的小三角，指向按钮 */
    content: "";
    position: absolute;
    right: 20px;
    bottom: -8px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #fff;
}

.sp-wa-float .sp-wa-close {
    position: absolute;
    top: 4px;
    right: 8px;
    background: transparent;
    border: none;
    font-size: 20px;
    line-height: 1;
    color: #999;
    cursor: pointer;
    padding: 2px 6px;
}

.sp-wa-float .sp-wa-close:hover {
    color: #333;
}

.sp-wa-float .sp-wa-popup-title {
    font-size: 13px;
    font-weight: 600;
    color: #222;
    margin-bottom: 8px;
}

.sp-wa-float .sp-wa-qr {
    display: block;
    width: 180px;
    height: 180px;
    margin: 0 auto 8px;
    object-fit: contain;
    border: 1px solid #eee;
}

.sp-wa-float .sp-wa-popup-tip {
    font-size: 12px;
    color: #0067FF;                              /* 系统主蓝 */
    font-weight: 600;
}

@keyframes sp-wa-fadein {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 移动端：按钮略小，位置留一点余量避开系统底栏 */
@media (max-width: 576px) {
    .sp-wa-float {
        right: 14px;
        bottom: 14px;
    }
    .sp-wa-float .sp-wa-btn {
        width: 50px;
        height: 50px;
    }
    .sp-wa-float .sp-wa-btn svg {
        width: 28px;
        height: 28px;
    }
}

/* ============================================================
 * WooCommerce 归档页顶部 banner：
 *   适用于商店首页 /shop/ 与所有产品分类页 /product-category/*
 *   目标：去掉水波纹底图，改成与 FAQ 一致的纯蓝底 + 白字
 * ============================================================ */
.woocommerce.archive .ast-archive-entry-banner,
.woocommerce-shop .ast-archive-entry-banner,
.tax-product_cat .ast-archive-entry-banner {
    background-color: #0067FF !important;   /* 系统主蓝 */
    background-image: none !important;      /* 去掉水波纹背景图 */
    padding: 28px 20px !important;          /* 与 FAQ 页蓝条同高 */
    text-align: center;
    /* 整屏通栏 */
    width: 100vw;
    max-width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    box-sizing: border-box;
}

/* 主标题（如 CIJ Printer / Laser Marker / All Products） */
.woocommerce.archive .ast-archive-entry-banner .entry-title,
.woocommerce.archive .ast-archive-entry-banner .ast-archive-title,
.woocommerce.archive .ast-archive-entry-banner h1,
.woocommerce.archive .ast-archive-entry-banner h2 {
    color: #fff !important;
    margin: 0 !important;
    text-align: center !important;
    line-height: 1.2 !important;
}

/* 副标题 / 分类描述（如 Continuous Inkjet Printer） */
.woocommerce.archive .ast-archive-entry-banner .ast-archive-description,
.woocommerce.archive .ast-archive-entry-banner .archive-description,
.woocommerce.archive .ast-archive-entry-banner .term-description,
.woocommerce.archive .ast-archive-entry-banner p {
    color: #fff !important;
    max-width: 720px;
    margin: 8px auto 0;
    font-size: 14px;
    line-height: 1.5;
    opacity: 0.95;
}

/* 移动端适配：减小上下留白与字号 */
@media (max-width: 576px) {
    .woocommerce.archive .ast-archive-entry-banner,
    .woocommerce-shop .ast-archive-entry-banner,
    .tax-product_cat .ast-archive-entry-banner {
        padding: 22px 16px !important;
    }
    .woocommerce.archive .ast-archive-entry-banner .entry-title,
    .woocommerce.archive .ast-archive-entry-banner .ast-archive-title,
    .woocommerce.archive .ast-archive-entry-banner h1,
    .woocommerce.archive .ast-archive-entry-banner h2 {
        font-size: 26px !important;
    }
    .woocommerce.archive .ast-archive-entry-banner .ast-archive-description,
    .woocommerce.archive .ast-archive-entry-banner .archive-description,
    .woocommerce.archive .ast-archive-entry-banner .term-description,
    .woocommerce.archive .ast-archive-entry-banner p {
        font-size: 13px;
    }
}

/* ============================================================
 * 首页底部"免费申请打样"联系区块（.sp-contact-block）
 * 左右两栏：左=微信二维码+联系信息，右=SureForms 表单
 * 桌面并排、移动端堆叠
 * 结构：Elementor 容器 + SureForms 短代码，需覆盖两者默认样式
 *
 * ⚠️ 所有选择器加 body 前缀提高特异性（比 Elementor 的
 *   .elementor-XXXX .elementor-element-XXXX（0,2,0）更强）
 * ============================================================ */

/* -------- 容器与布局 -------- */
body .sp-contact-block {
    background-color: #f2f7ff !important;   /* 淡蓝底 */
    padding: 50px 20px !important;
    box-sizing: border-box !important;
}

body .sp-contact-block .sp-contact-inner,
body .sp-contact-block .sp-contact-inner > .e-con-inner {
    max-width: 1160px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 40px !important;
    align-items: stretch !important;
}

/* 左侧列：二维码 + 联系信息 */
body .sp-contact-block .sp-contact-left {
    flex: 1 1 340px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 !important;
}

/* 二维码卡片 */
body .sp-contact-block .sp-contact-qr,
body .sp-contact-block .sp-contact-qr > .elementor-widget-container {
    width: 176px !important;
    padding: 8px !important;
    background: #fff !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
    box-sizing: border-box !important;
}

body .sp-contact-block .sp-contact-qr img {
    width: 160px !important;
    height: 160px !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 !important;
}

/* 联系信息列表 */
body .sp-contact-block .sp-contact-info {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 15px !important;
    color: #333 !important;
    line-height: 1.9 !important;
}

body .sp-contact-block .sp-contact-info li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body .sp-contact-block .sp-contact-info .sp-label {
    display: inline-block !important;
    min-width: 56px !important;
    color: #666 !important;
    font-weight: 500 !important;
}

body .sp-contact-block .sp-contact-info a {
    color: #0067FF !important;
    text-decoration: none !important;
}

body .sp-contact-block .sp-contact-info a:hover {
    text-decoration: underline !important;
}

/* 右侧列：SureForms 表单（透明，无卡片） */
body .sp-contact-block .sp-contact-right {
    flex: 1 1 500px !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 16px 0 !important;
    box-sizing: border-box !important;
}

/* -------- 标题与说明文字（居中） -------- */
body .sp-contact-block .sp-contact-title,
body .sp-contact-block .sp-contact-title .elementor-heading-title,
body .sp-contact-block .sp-contact-title h1,
body .sp-contact-block .sp-contact-title h2,
body .sp-contact-block .sp-contact-title h3 {
    color: #3268e6 !important;              /* 蓝色标题 */
    font-weight: 700 !important;
    font-size: 26px !important;
    line-height: 1.2 !important;
    margin: 0 0 6px !important;
    text-align: center !important;
}
body .sp-contact-block .sp-contact-title {
    align-items: center !important;
}

body .sp-contact-block .sp-contact-desc,
body .sp-contact-block .sp-contact-desc .elementor-widget-container,
body .sp-contact-block .sp-contact-desc p {
    color: #555 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin: 0 0 12px !important;
    text-align: center !important;
}

/* -------- 表单外层链路：撑满 sp-contact-right -------- */
body .sp-contact-block .sp-contact-form,
body .sp-contact-block .sp-contact-form > .elementor-widget-container,
body .sp-contact-block .sp-contact-form .elementor-shortcode,
body .sp-contact-block .sp-contact-form .srfm-form-container {
    width: 100% !important;
    max-width: 100% !important;
    background: transparent !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body .sp-contact-block .sp-contact-form .srfm-form-container {
    --srfm-form-container-max-width: 100% !important;
    --srfm-form-container-width: 100% !important;
    --srfm-block-gap: 0 !important;
    --srfm-form-container-gap: 0 !important;
}

/* -------- SureForms form：宽度 50% + 水平居中 + 极窄行距 -------- */
body .sp-contact-block .sp-contact-form form.srfm-form {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: wrap !important;
    width: 50% !important;
    max-width: 50% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    row-gap: 0 !important;
    gap: 0 !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
}

/* -------- 所有字段容器：强制满宽（覆盖 SureForms 各种宽度类） -------- */
body .sp-contact-block .sp-contact-form form.srfm-form > *,
body .sp-contact-block .sp-contact-form form.srfm-form .srfm-block,
body .sp-contact-block .sp-contact-form form.srfm-form .srfm-block-single,
body .sp-contact-block .sp-contact-form form.srfm-form .srfm-input-block,
body .sp-contact-block .sp-contact-form form.srfm-form [class*="srfm-slug-"],
body .sp-contact-block .sp-contact-form form.srfm-form [class*="srfm-block-width"],
body .sp-contact-block .sp-contact-form .srfm-block-wrap,
body .sp-contact-block .sp-contact-form .srfm-input-container,
body .sp-contact-block .sp-contact-form .srfm-block-content,
body .sp-contact-block .sp-contact-form [class$="-block"],
body .sp-contact-block .sp-contact-form [class*="-block-wrap"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex: 0 0 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* 隐藏 label */
body .sp-contact-block .sp-contact-form .srfm-block-label,
body .sp-contact-block .sp-contact-form label {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
}

/* 隐藏字段/空错误提示不占空间 */
body .sp-contact-block .sp-contact-form form.srfm-form > input[type="hidden"],
body .sp-contact-block .sp-contact-form .srfm-error-wrap:empty,
body .sp-contact-block .sp-contact-form .srfm-error-message[hidden],
body .sp-contact-block .sp-contact-form p#srfm-error-message[hidden] {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 0 !important;
}

body .sp-contact-block .sp-contact-form .srfm-error-wrap {
    line-height: 0 !important;
    min-height: 0 !important;
}

/* -------- 输入框：深灰底 + 白色文字 + 居中 + 32px 高 -------- */
body .sp-contact-block .sp-contact-form input[type="text"],
body .sp-contact-block .sp-contact-form input[type="email"],
body .sp-contact-block .sp-contact-form input[type="tel"],
body .sp-contact-block .sp-contact-form input[type="number"],
body .sp-contact-block .sp-contact-form input[type="url"],
body .sp-contact-block .sp-contact-form textarea,
body .sp-contact-block .sp-contact-form .srfm-input-common,
body .sp-contact-block .sp-contact-form .srfm-input,
body .sp-contact-block .sp-contact-form .srfm-textarea,
body .sp-contact-block .sp-contact-form .srfm-input-textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 32px !important;
    height: 32px !important;
    padding: 4px 14px !important;
    background-color: #8a8a8a !important;
    border: none !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    text-align: center !important;
    display: block !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* textarea 不可缩放 */
body .sp-contact-block .sp-contact-form textarea,
body .sp-contact-block .sp-contact-form .srfm-textarea,
body .sp-contact-block .sp-contact-form .srfm-input-textarea {
    resize: none !important;
}

/* placeholder：白色居中 */
body .sp-contact-block .sp-contact-form ::placeholder,
body .sp-contact-block .sp-contact-form input::placeholder,
body .sp-contact-block .sp-contact-form textarea::placeholder {
    color: #ffffff !important;
    opacity: 0.95 !important;
    text-align: center !important;
}

/* focus 状态 */
body .sp-contact-block .sp-contact-form input:focus,
body .sp-contact-block .sp-contact-form textarea:focus,
body .sp-contact-block .sp-contact-form .srfm-input-common:focus,
body .sp-contact-block .sp-contact-form .srfm-input:focus,
body .sp-contact-block .sp-contact-form .srfm-textarea:focus {
    background-color: #6f6f6f !important;
    color: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(50, 104, 230, 0.3) !important;
}

/* -------- 提交按钮：满宽蓝色 -------- */
body .sp-contact-block .sp-contact-form .srfm-submit-btn-container,
body .sp-contact-block .sp-contact-form .srfm-submit-richtext-wrapper,
body .sp-contact-block .sp-contact-form .srfm-submit-block {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    display: flex !important;
    justify-content: stretch !important;
    align-items: stretch !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
}

body .sp-contact-block .sp-contact-form button,
body .sp-contact-block .sp-contact-form button[type="submit"],
body .sp-contact-block .sp-contact-form input[type="submit"],
body .sp-contact-block .sp-contact-form .srfm-submit-btn,
body .sp-contact-block .sp-contact-form .srfm-button {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex: 1 1 100% !important;
    display: block !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    background-color: #3268e6 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 6px !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: background-color 0.2s !important;
}

body .sp-contact-block .sp-contact-form button:hover,
body .sp-contact-block .sp-contact-form button[type="submit"]:hover,
body .sp-contact-block .sp-contact-form input[type="submit"]:hover,
body .sp-contact-block .sp-contact-form .srfm-submit-btn:hover,
body .sp-contact-block .sp-contact-form .srfm-button:hover {
    background-color: #2755c4 !important;
}

/* 报错提示居中 */
body .sp-contact-block .sp-contact-form .srfm-error,
body .sp-contact-block .sp-contact-form .srfm-error-message {
    text-align: center !important;
}

/* -------- 移动端：单栏堆叠 + 表单宽度恢复 100% -------- */
@media (max-width: 768px) {
    body .sp-contact-block {
        padding: 32px 16px !important;
    }
    body .sp-contact-block .sp-contact-inner,
    body .sp-contact-block .sp-contact-inner > .e-con-inner {
        flex-direction: column !important;
        gap: 24px !important;
    }
    body .sp-contact-block .sp-contact-left {
        align-items: center !important;
        text-align: center !important;
    }
    body .sp-contact-block .sp-contact-right {
        padding: 16px 0 !important;
    }
    body .sp-contact-block .sp-contact-title,
    body .sp-contact-block .sp-contact-title .elementor-heading-title {
        font-size: 22px !important;
    }
    body .sp-contact-block .sp-contact-form form.srfm-form {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ============================================================
 * 手机端首页快捷导航（[sp_mobile_nav]）
 * - 桌面端默认隐藏
 * - 手机端 (≤768px) 显示：仿截图不对称布局
 * ============================================================ */
.sp-mobile-nav {
    display: none;                          /* 桌面端 (>1024px) 隐藏 */
}

@media (max-width: 1024px) {
    .sp-mobile-nav {
        display: block !important;
        width: 100%;
        margin: 0;                          /* 无外边距，间距由父容器控制 */
        background: #fff;                   /* 白色分隔缝的底色 */
        gap: 0;
        overflow: hidden;
    }

    /* 承载短代码的 Elementor widget 及其祖先容器：去掉默认内外边距，
       让本区块与下方 hero/轮播 紧贴（用户希望减少空白） */
    .elementor-widget-shortcode:has(.sp-mobile-nav),
    .elementor-widget-shortcode:has(.sp-mobile-nav) .elementor-widget-container {
        margin: 0 !important;
        padding: 0 !important;
    }
    /* 兜底：不支持 :has() 的旧浏览器，直接压缩紧邻兄弟的上边距 */
    .sp-mobile-nav + * {
        margin-top: 4px !important;
    }

    /* 顶部两栏：左大按钮 + 右侧 3 个纵排 */
    .sp-mobile-nav .sp-mnav-top {
        display: grid !important;
        grid-template-columns: 1fr 1fr;     /* 左右两列 */
        gap: 3px;                            /* 白色细缝 */
        background: #fff;
        margin-bottom: 3px;
    }

    /* 左侧大按钮：All Products */
    .sp-mobile-nav .sp-mnav-big {
        background-color: #0067FF;
        color: #fff !important;
        text-decoration: none !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 9px;
        min-height: 128px;                  /* 相对 150 版缩 15% */
        padding: 12px 10px;
        transition: background-color 0.2s;
    }

    /* 右侧容器：3 个中等按钮纵排 */
    .sp-mobile-nav .sp-mnav-right {
        display: grid !important;
        grid-template-rows: 1fr 1fr 1fr;
        gap: 3px;                            /* 与左侧一致的白缝 */
        background: #fff;
    }

    /* 单个按钮通用样式（中等 + 底部小按钮） */
    .sp-mobile-nav .sp-mnav-cell {
        background-color: #0067FF;
        color: #fff !important;
        text-decoration: none !important;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 9px;
        padding: 9px 10px;
        transition: background-color 0.2s;
        text-align: center;
    }

    /* 图标 */
    .sp-mobile-nav .sp-mnav-icon {
        color: #fff;
        line-height: 1;
    }
    .sp-mobile-nav .sp-mnav-big .sp-mnav-icon {
        font-size: 31px;                    /* 大按钮图标 */
    }
    .sp-mobile-nav .sp-mnav-cell .sp-mnav-icon {
        font-size: 19px;                    /* 右侧中等按钮图标 */
    }

    /* 文字 */
    .sp-mobile-nav .sp-mnav-label {
        color: #fff;
        font-weight: 600;
        line-height: 1.2;
    }
    .sp-mobile-nav .sp-mnav-big .sp-mnav-label {
        font-size: 17px;
    }
    .sp-mobile-nav .sp-mnav-cell .sp-mnav-label {
        font-size: 14px;
    }

    /* 按下反馈 */
    .sp-mobile-nav .sp-mnav-big:active,
    .sp-mobile-nav .sp-mnav-cell:active {
        background-color: #0052cc;
    }
}