/* =========================================
   Inquiry Section
========================================= */

.inquiry-section {
    position: relative;

    /* 整个模块的上下空间 */
    padding: 80px 0;

    min-height: 500px;

    display: flex;
    align-items: center;

    isolation: isolate;

    /* 不能 hidden，否则表单上下凸出的部分会被裁掉 */
    overflow: visible;
    /*background-color: #f7f9fc;*/
}


/* =========================================
   Background
   背景图片比整个 Section 矮
========================================= */

.inquiry-bg {
    position: absolute;
    /*
     * 控制背景区域高度
     * 数值越大，背景越高
     */
    top: 100px;
    bottom: 100px;

    left: 0;
    right: 0;

    z-index: -3;

    background-image: var(--inquiry-bg-image, url("/wp-content/uploads/2026/08/inquiry.webp"));

    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    transform: scale(1.02);
}


/* =========================================
   Background Overlay
========================================= */

.inquiry-overlay {
    position: absolute;

    top: 82px;
    bottom: 82px;

    left: 0;
    right: 0;

    z-index: -2;

    background:
        linear-gradient(
            90deg,
            rgba(7, 20, 36, 0.94) 0%,
            rgba(7, 20, 36, 0.86) 32%,
            rgba(7, 20, 36, 0.68) 65%,
            rgba(7, 20, 36, 0.80) 100%
        );
}


/* =========================================
   Main Container
========================================= */

.inquiry-container {
    position: relative;
    z-index: 2;

    width: min(1400px, calc(100% - 80px));

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(500px, 600px);

    gap: 90px;

    align-items: center;
}


/* =========================================
   Left Content
========================================= */

.inquiry-content {
    /*max-width: 600px;*/
}


/* 小标题 */

.inquiry-eyebrow {
    margin-bottom: 18px;

    color: #4da3ff;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 2px;
}


/* =========================================
   Main Title
========================================= */

.inquiry-title {
    margin: 0 0 22px;

    color: #ffffff;

    font-size: clamp(46px, 4.3vw, 68px);

    line-height: 1.02;

    font-weight: 700;

    letter-spacing: -2px;

    text-shadow:
        0 3px 18px rgba(0, 0, 0, .28);
}

.inquiry-title span {
    display: block;

    color: #4da3ff;

    text-shadow:
        0 4px 24px rgba(0, 102, 204, .28);
}


/* =========================================
   Description
========================================= */

.inquiry-description {
    max-width: 560px;

    margin: 0 0 28px;

    color: rgba(255, 255, 255, .78);

    font-size: 15px;

    line-height: 1.65;
}


/* =========================================
   Features
========================================= */

.inquiry-features {
    border-top: 1px solid rgba(255,255,255,.18);
}

.inquiry-feature {
    min-height: 54px;

    display: flex;
    align-items: center;

    gap: 28px;

    border-bottom: 1px solid rgba(255,255,255,.18);

    transition:
        background .3s ease,
        padding-left .3s ease;
}

.inquiry-feature span {
    width: 20px;

    flex-shrink: 0;

    color: #4da3ff;

    font-size: 11px;
    font-weight: 600;
}

.inquiry-feature strong {
    color: #ffffff;

    font-size: 15px;
    font-weight: 600;

    transition: color .3s ease;
}

.inquiry-feature:hover {
    padding-left: 6px;
}

.inquiry-feature:hover strong {
    color: #4da3ff;
}


/* =========================================
   Response
========================================= */

.inquiry-response {
    margin-top: 22px;

    color: rgba(255,255,255,.65);

    font-size: 13px;
}

.inquiry-response strong {
    margin-left: 4px;

    color: #ffffff;
}


/* =========================================
   Form Card
   重点：
   表单高度独立于背景
========================================= */

.inquiry-form-card {

    position: relative;

    z-index: 5;

    /*
     * 这里不要设置 height
     * 让 WPForms 自己决定高度
     */

    padding: 42px;

    background: rgba(255,255,255,.98);

    border-radius: 4px;

    /*
     * 让表单真正浮起来
     */
    box-shadow:
        0 25px 70px rgba(0,0,0,.28),
        0 8px 25px rgba(0,0,0,.12);

    /*
     * 关键：
     * 允许表单上下超出背景区域
     */
    margin-top: -60px;
    margin-bottom: -60px;
}


/* =========================================
   Form Header
========================================= */

.inquiry-form-eyebrow {
    margin-bottom: 16px;

    color: #0066cc;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 2px;
}

.inquiry-form-card h3 {
    margin: 0 0 10px;

    color: #111827;

    font-size: 34px;

    line-height: 1.2;

    font-weight: 700;

    letter-spacing: -0.5px;
}

.inquiry-form-card > p {
    margin: 0;

    color: #64748b;

    font-size: 14px;

    line-height: 1.7;
}


/* 分割线 */

.inquiry-form-divider {
    height: 1px;

    margin: 26px 0 25px;

    background: #e2e8f0;
}


/* =========================================
   WPForms
========================================= */

.inquiry-form-card .wpforms-container {
    margin: 0 !important;
}

.inquiry-form-card .wpforms-field {
    padding: 0 0 16px !important;
}

.inquiry-form-card .wpforms-field-label {
    margin-bottom: 7px !important;

    color: #1e293b !important;

    font-size: 12px !important;

    font-weight: 600 !important;
}


/* 输入框 */

.inquiry-form-card input,
.inquiry-form-card textarea,
.inquiry-form-card select {

    width: 100% !important;

    border: 1px solid #dbe3ec !important;

    border-radius: 3px !important;

    background: #ffffff !important;

    color: #1e293b !important;

    box-shadow: none !important;

    transition:
        border-color .25s ease,
        box-shadow .25s ease;
}


/* Input */

.inquiry-form-card input {
    height: 46px !important;
}


/* Textarea */

.inquiry-form-card textarea {
    min-height: 110px !important;
}


/* Focus */

.inquiry-form-card input:focus,
.inquiry-form-card textarea:focus,
.inquiry-form-card select:focus {

    border-color: #0066cc !important;

    box-shadow:
        0 0 0 3px rgba(0,102,204,.08) !important;

    outline: none !important;
}


/* =========================================
   Submit Button
========================================= */

.inquiry-form-card button[type="submit"],
.inquiry-form-card .wpforms-submit {

    width: 100% !important;

    min-height: 50px !important;

    border: none !important;

    border-radius: 3px !important;

    background: #0066cc !important;

    color: #ffffff !important;

    font-size: 14px !important;

    font-weight: 600 !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease !important;
}

.inquiry-form-card button[type="submit"]:hover,
.inquiry-form-card .wpforms-submit:hover {

    background: #0052a3 !important;

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(0,102,204,.25);
}


/* =========================================
   Reveal Animation
========================================= */

.inquiry-content > *,
.inquiry-form-card {

    opacity: 0;

    transform: translateY(28px);

    filter: blur(4px);

    transition:
        opacity .8s ease,
        transform .8s cubic-bezier(.22,1,.36,1),
        filter .8s ease;
}


.inquiry-section.is-visible .inquiry-content > *,
.inquiry-section.is-visible .inquiry-form-card {

    opacity: 1;

    transform: translateY(0);

    filter: blur(0);
}


/* 动画延迟 */

.inquiry-content .inquiry-eyebrow {
    transition-delay: .1s;
}

.inquiry-content .inquiry-title {
    transition-delay: .2s;
}

.inquiry-content .inquiry-description {
    transition-delay: .35s;
}

.inquiry-content .inquiry-features {
    transition-delay: .5s;
}

.inquiry-content .inquiry-response {
    transition-delay: .65s;
}

.inquiry-form-card {
    transition-delay: .35s;
}


/* =========================================
   Tablet
========================================= */

@media (max-width: 1100px) {

    .inquiry-section {
        padding: 80px 0;
    }

    .inquiry-container {

        width: min(
            100% - 50px,
            900px
        );

        grid-template-columns: 1fr;

        gap: 60px;
    }

    .inquiry-content {
        max-width: 700px;
    }

    .inquiry-form-card {

        width: 100%;

        max-width: 650px;

        margin:
            -20px auto
            -20px;
    }
}


/* =========================================
   Mobile
========================================= */

@media (max-width: 600px) {

    .inquiry-section {

        padding: 60px 0;

        min-height: auto;
    }

    /*
     * 手机端背景不要过度缩短
     */
    .inquiry-bg,
    .inquiry-overlay {

        top: 30px;
        bottom: 30px;
    }

    .inquiry-container {

        width: calc(100% - 30px);

        gap: 45px;
    }

    .inquiry-title {

        font-size: 40px;

        line-height: 1.04;

        letter-spacing: -1px;
    }

    .inquiry-description {

        font-size: 14px;

        line-height: 1.7;
    }

    .inquiry-feature {

        min-height: 50px;

        gap: 18px;
    }

    .inquiry-feature strong {
        font-size: 14px;
    }

    .inquiry-form-card {

        padding: 26px 22px;

        margin:
            -20px auto
            -20px;

        width: 100%;
    }

    .inquiry-form-card h3 {

        font-size: 28px;
    }
}