/* ================================================================
   01. 防止 Elementor / WordPress 的默认样式干扰这个页面
   ================================================================ */

#qorix-coa-page,
#qorix-coa-page *,
#qorix-coa-page *::before,
#qorix-coa-page *::after {
    box-sizing: border-box;
}


/* ================================================================
   02. 页面基础变量
   ================================================================ */

#qorix-coa-page {

    /* 深蓝主色 */
    --q-navy: #17234d;

    /* 第二深蓝 */
    --q-navy-2: #243975;

    /* 蓝色 */
    --q-blue: #2870ca;

    /* 青绿色 */
    --q-teal: #2ba89c;

    /* 主要文字 */
    --q-text: #15223f;

    /* 次要文字 */
    --q-text-soft: #596984;

    /* 浅色文字 */
    --q-muted: #8994a6;

    /* 边框颜色 */
    --q-border: #dce4ee;

    /* 页面背景 */
    --q-background: #edf6fb;

    /* 成功颜色 */
    --q-success: #167647;

    /* 错误颜色 */
    --q-danger: #b8353b;


    /*
    这一段用于突破 Elementor 容器宽度，
    让页面横向铺满浏览器
    */
    position: relative;

    width: 100vw;

    margin-left: calc(50% - 50vw);

    overflow: hidden;


    /* 页面字体 */
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Arial,
        Helvetica,
        sans-serif;

    color: var(--q-text);
}


/* ================================================================
   03. 去除 Elementor 可能给 HTML 小工具增加的多余间距
   ================================================================ */

#qorix-coa-page h1,
#qorix-coa-page h2,
#qorix-coa-page h3,
#qorix-coa-page p {
    margin-top: 0;
}


/* ================================================================
   04. 整个页面主背景
   ================================================================ */

#qorix-coa-page .qorix-hero {

    position: relative;

    width: 100%;

    min-height: 760px;

    overflow: hidden;


    /*
    浅蓝色实验室风格背景
    */
    background:

        radial-gradient(
            circle at 78% 20%,
            rgba(74, 154, 225, 0.18),
            transparent 27%
        ),

        radial-gradient(
            circle at 15% 80%,
            rgba(60, 182, 201, 0.14),
            transparent 29%
        ),

        linear-gradient(
            110deg,
            #fbfdff 0%,
            #f2f8fc 33%,
            #eaf5fb 68%,
            #e5f2fa 100%
        );
}


/* ================================================================
   05. 页面背景很淡的网格
   ================================================================ */

#qorix-coa-page .qorix-grid-background {

    position: absolute;

    inset: 0;

    z-index: 0;

    opacity: 0.19;

    background-image:

        linear-gradient(
            rgba(54, 103, 155, 0.07) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(54, 103, 155, 0.07) 1px,
            transparent 1px
        );

    background-size:
        72px 72px;

    pointer-events: none;
}


/* ================================================================
   06. 左下显微镜 SVG
   只是装饰，不参与功能
   ================================================================ */

#qorix-coa-page .qorix-microscope {

    position: absolute;

    z-index: 1;

    left: -95px;

    bottom: -90px;

    width: 520px;

    max-width: none;

    opacity: 0.13;

    pointer-events: none;
}


/* ================================================================
   07. 右边分子结构 SVG
   ================================================================ */

#qorix-coa-page .qorix-molecule {

    position: absolute;

    z-index: 1;

    right: -85px;

    top: 65px;

    width: 390px;

    max-width: none;

    opacity: 0.10;

    pointer-events: none;
}


/* ================================================================
   08. 主内容区域

   左侧：
   品牌介绍

   右侧：
   报告查询卡片
   ================================================================ */

#qorix-coa-page .qorix-main {

    position: relative;

    z-index: 5;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(520px, 0.86fr);

    align-items: center;

    gap: 78px;

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

    min-height: 760px;

    margin: 0 auto;

    padding:
        55px 0 58px;
}


/* ================================================================
   09. 左侧介绍区域
   ================================================================ */

#qorix-coa-page .qorix-intro {

    position: relative;

    max-width: 690px;

    padding:
        25px 0 30px;
}


/* ================================================================
   10. 左上小标题 TRUST THROUGH SCIENCE
   ================================================================ */

#qorix-coa-page .qorix-eyebrow {

    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 25px;

    color: #697b98;

    font-size: 14px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


/* 小标题右边蓝线 */
#qorix-coa-page .qorix-eyebrow::after {

    content: "";

    display: block;

    width: 42px;

    height: 3px;

    border-radius: 10px;

    background: #2d78cd;
}


/* ================================================================
   11. 左侧大标题
   ================================================================ */

#qorix-coa-page .qorix-title {

    margin:
        0 0 28px;

    color: #132342;

    font-size:
        clamp(
            48px,
            4vw,
            66px
        );

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -1.5px;
}


/* ================================================================
   12. 左侧宣传语
   ================================================================ */

#qorix-coa-page .qorix-slogan {

    margin-bottom: 8px;

    color: #273b5c;

    font-size: 21px;

    font-weight: 650;

    letter-spacing: 0.15px;
}


#qorix-coa-page .qorix-slogan-small {

    margin-bottom: 0;

    color: #6d7b91;

    font-size: 15px;

    line-height: 1.7;
}


/* ================================================================
   13. 三个功能优势区域
   ================================================================ */

#qorix-coa-page .qorix-benefits {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 28px;

    max-width: 680px;

    margin-top: 55px;
}


/* 单个优势 */
#qorix-coa-page .qorix-benefit {

    min-width: 0;
}


/* 圆形图标背景 */
#qorix-coa-page .qorix-benefit-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 60px;

    height: 60px;

    margin-bottom: 16px;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            rgba(41, 113, 203, 0.10),
            rgba(78, 171, 218, 0.18)
        );

    color: #2772ca;
}


#qorix-coa-page .qorix-benefit-icon svg {

    width: 28px;

    height: 28px;
}


/* 优势主标题 */
#qorix-coa-page .qorix-benefit h3 {

    margin-bottom: 5px;

    color: #172843;

    font-size: 17px;

    font-weight: 750;

    line-height: 1.3;
}


/* 优势副标题 */
#qorix-coa-page .qorix-benefit-subtitle {

    display: block;

    margin-top: 3px;

    color: #3e526f;

    font-size: 12px;

    font-weight: 650;
}


/* 优势说明 */
#qorix-coa-page .qorix-benefit p {

    margin-bottom: 0;

    color: #8090a5;

    font-size: 12px;

    line-height: 1.55;
}


/* ================================================================
   14. 左下手写风格宣传语
   ================================================================ */

#qorix-coa-page .qorix-signature {

    margin-top: 48px;

    margin-left: 38px;

    color: #355a88;

    font-family:
        "Segoe Script",
        "Brush Script MT",
        cursive;

    font-size: 24px;

    line-height: 1.25;

    transform: rotate(-4deg);

    opacity: 0.78;
}


/* ================================================================
   15. 右侧白色核验卡片
   ================================================================ */

#qorix-coa-page .qorix-card {

    position: relative;

    width: 100%;

    padding:
        38px 40px 35px;

    border:
        1px solid rgba(255, 255, 255, 0.9);

    border-radius: 23px;

    background:
        rgba(255, 255, 255, 0.965);

    box-shadow:
        0 30px 70px rgba(35, 73, 120, 0.13),
        0 5px 16px rgba(35, 73, 120, 0.05);

    backdrop-filter: blur(10px);
}


/* ================================================================
   16. 卡片顶部图标 + 标题
   ================================================================ */

#qorix-coa-page .qorix-card-header {

    display: flex;

    align-items: center;

    gap: 17px;

    margin-bottom: 31px;
}


/* 圆形报告图标 */
#qorix-coa-page .qorix-report-icon {

    flex:
        0 0 auto;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 68px;

    height: 68px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #f1f7ff,
            #e6f0fc
        );

    color: #276eca;
}


#qorix-coa-page .qorix-report-icon svg {

    width: 34px;

    height: 34px;
}


/* 卡片大标题 */
#qorix-coa-page .qorix-card-header h2 {

    margin-bottom: 4px;

    color: #152442;

    font-size: 28px;

    line-height: 1.2;

    font-weight: 800;
}


/* 卡片标题说明 */
#qorix-coa-page .qorix-card-header p {

    margin-bottom: 0;

    color: #718096;

    font-size: 14px;

    line-height: 1.5;
}


/* ================================================================
   17. Step 标题
   ================================================================ */

#qorix-coa-page .qorix-step-heading {

    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 12px;

    color: #293b57;

    font-size: 14px;

    font-weight: 700;
}


/* 圆形 1 / 2 */
#qorix-coa-page .qorix-step-number {

    flex:
        0 0 auto;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 28px;

    height: 28px;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #18265d,
            #2c448d
        );

    color: #ffffff;

    font-size: 13px;

    font-weight: 800;
}


/* Step 副标题 */
#qorix-coa-page .qorix-step-note {

    margin-left: 5px;

    color: #8894a7;

    font-size: 12px;

    font-weight: 500;
}


/* ================================================================
   18. 报告编号输入框
   ================================================================ */

#qorix-coa-page #coa-input {

    display: block;

    width: 100%;

    height: 56px;

    margin: 0;

    padding:
        0 17px;

    border:
        1px solid #ccd6e2;

    border-radius: 8px;

    background: #ffffff;

    outline: none;

    box-shadow: none;

    color: #1b2a42;

    font-family: inherit;

    font-size: 14px;

    line-height: 56px;

    appearance: none;

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


/* 输入框提示文字 */
#qorix-coa-page #coa-input::placeholder {

    color: #9ba5b4;

    opacity: 1;
}


/* 点击输入框 */
#qorix-coa-page #coa-input:focus {

    border-color: #5878ca;

    box-shadow:
        0 0 0 4px
        rgba(65, 96, 190, 0.09);
}


/* ================================================================
   19. SEARCH REPORT 按钮
   ================================================================ */

#qorix-coa-page #coa-search-btn {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    width: 100%;

    height: 57px;

    margin:
        17px 0 0;

    padding:
        0 20px;

    border: 0;

    border-radius: 8px;

    outline: none;

    background:
        linear-gradient(
            105deg,
            #172459 0%,
            #263d85 100%
        );

    box-shadow:
        0 10px 22px
        rgba(30, 44, 102, 0.18);

    color: #ffffff;

    font-family: inherit;

    font-size: 14px;

    font-weight: 750;

    line-height: 1;

    cursor: pointer;

    appearance: none;

    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        opacity 0.18s ease;
}


#qorix-coa-page #coa-search-btn:hover {

    transform:
        translateY(-1px);

    box-shadow:
        0 13px 26px
        rgba(30, 44, 102, 0.24);
}


#qorix-coa-page #coa-search-btn:active {

    transform:
        translateY(0);
}


#qorix-coa-page #coa-search-btn svg {

    width: 21px;

    height: 21px;
}


/* ================================================================
   20. 中间分隔线
   ================================================================ */

#qorix-coa-page .qorix-divider {

    height: 1px;

    margin:
        28px 0 24px;

    background:
        linear-gradient(
            to right,
            transparent,
            #dce4ed 7%,
            #dce4ed 93%,
            transparent
        );
}


/* ================================================================
   21. PDF 拖放区域
   ================================================================ */

#qorix-coa-page .qorix-upload-zone {

    position: relative;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    width: 100%;

    min-height: 172px;

    margin-top: 8px;

    padding:
        22px 20px;

    border:
        1.5px dashed #aebbd0;

    border-radius: 9px;

    background:
        linear-gradient(
            145deg,
            #fcfdff,
            #f7fbff
        );

    text-align: center;

    transition:
        border-color 0.2s ease,
        background 0.2s ease,
        transform 0.2s ease;
}


/* 拖 PDF 进去时 */
#qorix-coa-page .qorix-upload-zone.is-dragging {

    border-color: #347fd3;

    background: #eef6ff;

    transform: scale(1.006);
}


/* 上传云图标 */
#qorix-coa-page .qorix-upload-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 52px;

    height: 52px;

    margin-bottom: 7px;

    color: #2b73c9;
}


#qorix-coa-page .qorix-upload-icon svg {

    width: 45px;

    height: 45px;
}


/* PDF 主提示 */
#qorix-coa-page .qorix-upload-title {

    color: #293b56;

    font-size: 14px;

    font-weight: 750;

    line-height: 1.45;
}


/* PDF 次提示 */
#qorix-coa-page .qorix-upload-description {

    margin-top: 4px;

    color: #8a96a8;

    font-size: 11px;

    line-height: 1.5;
}


/* ================================================================
   22. CHOOSE PDF FILE 按钮
   ================================================================ */

#qorix-coa-page .qorix-file-button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-width: 155px;

    margin-top: 14px;

    padding:
        10px 18px;

    border:
        1px solid #c3cdd9;

    border-radius: 7px;

    background: #ffffff;

    box-shadow:
        0 2px 6px rgba(35, 59, 89, 0.04);

    color: #344861;

    font-size: 12px;

    font-weight: 700;

    line-height: 1;

    cursor: pointer;

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


#qorix-coa-page .qorix-file-button:hover {

    border-color: #4284cb;

    box-shadow:
        0 4px 10px
        rgba(44, 99, 159, 0.08);

    color: #286db8;
}


/* 真正的文件 input 隐藏 */
#qorix-coa-page #coa-file-input {

    position: absolute;

    width: 1px;

    height: 1px;

    padding: 0;

    margin: -1px;

    overflow: hidden;

    clip: rect(0, 0, 0, 0);

    white-space: nowrap;

    border: 0;
}


/* 已选择文件名 */
#qorix-coa-page #coa-selected-file {

    display: none;

    width: 100%;

    margin-top: 11px;

    overflow: hidden;

    color: #66758b;

    font-size: 11px;

    text-overflow: ellipsis;

    white-space: nowrap;
}


/* ================================================================
   23. PDF 本地核验说明
   ================================================================ */

#qorix-coa-page .qorix-local-info {

    display: flex;

    align-items: flex-start;

    gap: 9px;

    margin-top: 16px;

    color: #7d899a;

    font-size: 11px;

    line-height: 1.55;
}


#qorix-coa-page .qorix-local-info svg {

    flex:
        0 0 auto;

    width: 16px;

    height: 16px;

    margin-top: 1px;

    color: #2c9f94;
}


/* ================================================================
   24. 查询结果区域
   ================================================================ */

#qorix-coa-page #coa-result,
#qorix-coa-page #coa-hash-result {

    width: 100%;

    margin-top: 18px;
}


/* ================================================================
   25. 状态提示框公共样式
   ================================================================ */

#qorix-coa-page .coa-status {

    width: 100%;

    padding:
        13px 15px;

    border-radius: 8px;

    font-size: 12px;

    line-height: 1.6;
}


/* 成功 */
#qorix-coa-page .coa-status-success {

    border:
        1px solid #cce9da;

    background: #eef9f3;

    color: #15683e;
}


/* 错误 */
#qorix-coa-page .coa-status-danger {

    border:
        1px solid #efd1d4;

    background: #fff3f3;

    color: #a63237;
}


/* 查询中 / 普通提示 */
#qorix-coa-page .coa-status-neutral {

    border:
        1px solid #e1e6ed;

    background: #f6f8fa;

    color: #69768a;
}


/* ================================================================
   26. 报告查询成功后的数据表
   ================================================================ */

#qorix-coa-page .coa-result-table {

    width: 100%;

    margin-top: 12px;

    overflow: hidden;

    border:
        1px solid #dfe5ed;

    border-radius: 9px;

    background: #ffffff;
}


/* 每一行 */
#qorix-coa-page .coa-result-row {

    display: grid;

    grid-template-columns:
        minmax(145px, 43%)
        1fr;

    gap: 15px;

    width: 100%;

    padding:
        11px 13px;

    border-bottom:
        1px solid #edf0f4;

    font-size: 12px;

    line-height: 1.45;
}


/* 最后一行不要底边 */
#qorix-coa-page .coa-result-row:last-child {

    border-bottom: none;
}


/* 左侧字段 */
#qorix-coa-page .coa-result-label {

    color: #798598;
}


/* 右侧数据 */
#qorix-coa-page .coa-result-value {

    min-width: 0;

    color: #202c40;

    font-weight: 700;

    text-align: right;

    overflow-wrap: anywhere;
}


/* ================================================================
   27. 页面最底下的小信息条
   ================================================================ */

#qorix-coa-page .qorix-footer-strip {

    position: relative;

    z-index: 10;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    gap: 11px;

    padding:
        13px 25px;

    border-top:
        1px solid rgba(35, 75, 122, 0.08);

    background:
        rgba(249, 252, 254, 0.94);

    color: #8490a1;

    font-size: 11px;

    line-height: 1.5;
}


#qorix-coa-page .qorix-footer-dot {

    width: 5px;

    height: 5px;

    border-radius: 50%;

    background: #2ea49a;
}


/* ================================================================
   28. 小电脑 / 横屏平板
   ================================================================ */

@media (max-width: 1180px) {

    #qorix-coa-page .qorix-main {

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

        gap: 45px;

        width:
            min(
                1120px,
                calc(100% - 48px)
            );
    }


    #qorix-coa-page .qorix-title {

        font-size:
            clamp(
                42px,
                4vw,
                56px
            );
    }


    #qorix-coa-page .qorix-benefits {

        gap: 18px;
    }

}


/* ================================================================
   29. 900px 以下：
   左右布局改成上下布局
   ================================================================ */

@media (max-width: 900px) {

    #qorix-coa-page .qorix-hero {

        min-height: auto;
    }


    #qorix-coa-page .qorix-main {

        display: block;

        width:
            min(
                660px,
                calc(100% - 30px)
            );

        min-height: auto;

        padding:
            38px 0 48px;
    }


    #qorix-coa-page .qorix-intro {

        max-width: none;

        padding:
            10px 7px 40px;

        text-align: center;
    }


    #qorix-coa-page .qorix-eyebrow {

        justify-content: center;

        margin-bottom: 20px;
    }


    #qorix-coa-page .qorix-title {

        font-size: 42px;
    }


    #qorix-coa-page .qorix-slogan {

        font-size: 18px;
    }


    #qorix-coa-page .qorix-benefits {

        max-width: 610px;

        margin:
            38px auto 0;

        text-align: left;
    }


    /* 平板隐藏手写文字 */
    #qorix-coa-page .qorix-signature {

        display: none;
    }


    /* 平板背景显微镜降低存在感 */
    #qorix-coa-page .qorix-microscope {

        width: 330px;

        left: -130px;

        bottom: 300px;
    }


    #qorix-coa-page .qorix-molecule {

        width: 270px;

        right: -120px;

        top: 100px;
    }

}


/* ================================================================
   30. 手机布局
   ================================================================ */

@media (max-width: 600px) {

    #qorix-coa-page .qorix-main {

        width:
            calc(100% - 20px);

        padding:
            27px 0 38px;
    }


    /* 手机左上英文小标题 */
    #qorix-coa-page .qorix-eyebrow {

        gap: 10px;

        margin-bottom: 16px;

        font-size: 10px;

        letter-spacing: 2.5px;
    }


    #qorix-coa-page .qorix-eyebrow::after {

        width: 30px;

        height: 2px;
    }


    /* 手机大标题 */
    #qorix-coa-page .qorix-title {

        margin-bottom: 20px;

        font-size: 33px;

        letter-spacing: -0.8px;
    }


    #qorix-coa-page .qorix-slogan {

        margin-bottom: 6px;

        font-size: 15px;
    }


    #qorix-coa-page .qorix-slogan-small {

        font-size: 12px;
    }


    /* 手机上三个优势竖排 */
    #qorix-coa-page .qorix-benefits {

        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 28px;
    }


    /* 手机单个优势改成图标在左，文字在右 */
    #qorix-coa-page .qorix-benefit {

        display: grid;

        grid-template-columns:
            50px 1fr;

        column-gap: 13px;

        align-items: center;

        padding:
            3px 4px;

        text-align: left;
    }


    #qorix-coa-page .qorix-benefit-icon {

        grid-row:
            1 / 3;

        width: 48px;

        height: 48px;

        margin: 0;
    }


    #qorix-coa-page .qorix-benefit-icon svg {

        width: 23px;

        height: 23px;
    }


    #qorix-coa-page .qorix-benefit h3 {

        margin-bottom: 0;

        font-size: 14px;
    }


    #qorix-coa-page .qorix-benefit p {

        margin-top: 3px;

        font-size: 11px;
    }


    /* 手机右侧卡片 */
    #qorix-coa-page .qorix-card {

        padding:
            25px 19px 23px;

        border-radius: 16px;
    }


    #qorix-coa-page .qorix-card-header {

        gap: 12px;

        margin-bottom: 25px;
    }


    #qorix-coa-page .qorix-report-icon {

        width: 53px;

        height: 53px;
    }


    #qorix-coa-page .qorix-report-icon svg {

        width: 27px;

        height: 27px;
    }


    #qorix-coa-page .qorix-card-header h2 {

        font-size: 21px;
    }


    #qorix-coa-page .qorix-card-header p {

        font-size: 11px;
    }


    #qorix-coa-page .qorix-step-heading {

        align-items: flex-start;

        font-size: 13px;
    }


    #qorix-coa-page .qorix-step-note {

        display: block;

        margin:
            2px 0 0;
    }


    #qorix-coa-page #coa-input {

        height: 52px;

        padding:
            0 13px;

        font-size: 12px;

        line-height: 52px;
    }


    #qorix-coa-page #coa-search-btn {

        height: 53px;

        font-size: 12px;
    }


    #qorix-coa-page .qorix-upload-zone {

        min-height: 160px;

        padding:
            20px 14px;
    }


    #qorix-coa-page .qorix-upload-title {

        font-size: 12px;
    }


    /* 手机结果表上下排列 */
    #qorix-coa-page .coa-result-row {

        display: block;
    }


    #qorix-coa-page .coa-result-label {

        margin-bottom: 3px;
    }


    #qorix-coa-page .coa-result-value {

        text-align: left;
    }

}
/* ================================================================
   手机端专用：
   隐藏左侧品牌介绍，打开页面直接显示报告查询
   ================================================================ */

@media (max-width: 600px) {

    /* ------------------------------------------------------------
       1. 手机上完全隐藏电脑端左侧品牌介绍
       
       会隐藏：
       TRUST THROUGH SCIENCE
       Test Report Verification 大标题
       Science · Impartiality · Accuracy · Trust
       Secure Verification
       Local File Check
       Fast & Accurate
       ------------------------------------------------------------ */

    #qorix-coa-page .qorix-intro {
        display: none !important;
    }


    /* ------------------------------------------------------------
       2. 隐藏手机背景装饰
       手机屏幕比较小，显微镜和分子结构没有必要显示
       ------------------------------------------------------------ */

    #qorix-coa-page .qorix-microscope,
    #qorix-coa-page .qorix-molecule,
    #qorix-coa-page .qorix-grid-background {
        display: none !important;
    }


    /* ------------------------------------------------------------
       3. 主区域取消多余顶部空间
       让查询卡片尽量靠近网站导航栏
       ------------------------------------------------------------ */

    #qorix-coa-page .qorix-main {
        display: block !important;

        width: calc(100% - 18px) !important;

        min-height: auto !important;

        margin: 0 auto !important;

        padding:
            14px 0
            28px !important;
    }


    /* ------------------------------------------------------------
       4. 手机背景更干净
       ------------------------------------------------------------ */

    #qorix-coa-page .qorix-hero {
        min-height: auto !important;

        background:
            linear-gradient(
                180deg,
                #edf6fb 0%,
                #f7fbfe 100%
            ) !important;
    }


    /* ------------------------------------------------------------
       5. 查询卡片占满手机主要宽度
       ------------------------------------------------------------ */

    #qorix-coa-page .qorix-card {
        width: 100% !important;

        margin: 0 auto !important;

        padding:
            24px 18px
            22px !important;

        border-radius: 16px !important;
    }


    /* ------------------------------------------------------------
       6. 卡片顶部标题稍微缩小
       防止小屏手机标题过大
       ------------------------------------------------------------ */

    #qorix-coa-page .qorix-card-header {
        margin-bottom: 24px !important;
    }


    #qorix-coa-page .qorix-report-icon {
        width: 50px !important;
        height: 50px !important;
    }


    #qorix-coa-page .qorix-report-icon svg {
        width: 26px !important;
        height: 26px !important;
    }


    #qorix-coa-page .qorix-card-header h2 {
        font-size: 20px !important;
    }


    #qorix-coa-page .qorix-card-header p {
        font-size: 11px !important;
    }


    /* ------------------------------------------------------------
       7. 底部信息也紧凑一些
       ------------------------------------------------------------ */

    #qorix-coa-page .qorix-footer-strip {
        padding:
            10px 15px !important;

        font-size: 9px !important;
    }

}


/* ================================================================
   31. Qorix static rebuild - additions

   The block above is carried over unchanged from the live
   Elementor widget. Everything below was added during the
   rebuild and is safe to edit on its own.
   ================================================================ */

/* The page sits directly under the site header, so it must not
   inherit the mint body background of the rest of the site. */
body.page-verify { background: #eaf3f9; }


/* ----------------------------------------------------------------
   Mobile: keep the page heading instead of hiding it.

   The live build hid the whole left column below 600px, which took
   the H1 with it. Here the heading and strapline stay (centred and
   compact) and only the three benefit tiles are dropped.
   ---------------------------------------------------------------- */

@media (max-width: 600px) {

    #qorix-coa-page .qorix-intro {
        display: block !important;
        max-width: calc(100% - 18px);
        margin: 0 auto;
        padding-top: 26px;
        text-align: center;
    }

    #qorix-coa-page .qorix-eyebrow {
        justify-content: center;
    }

    #qorix-coa-page .qorix-title {
        font-size: 30px !important;
        line-height: 1.16 !important;
        margin-bottom: 12px !important;
    }

    #qorix-coa-page .qorix-slogan {
        font-size: 16px !important;
        margin-bottom: 6px !important;
    }

    #qorix-coa-page .qorix-slogan-small {
        font-size: 13px !important;
        margin-bottom: 0 !important;
    }

    #qorix-coa-page .qorix-benefits {
        display: none !important;
    }
}


/* ================================================================
   32. 报告原件 / The report document

   The strip under a verified record that opens the issued PDF,
   and the panel it opens into.
   ================================================================ */

#qorix-coa-page .qorix-report-doc {

    display: flex;
    align-items: center;
    gap: 14px;

    margin-top: 16px;
    padding: 14px 16px;

    border: 1px solid var(--q-border);
    border-radius: 10px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7fbff 100%
        );
}

#qorix-coa-page .qorix-report-doc-icon {

    flex: none;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    border-radius: 9px;
    background: #e8f1fb;
    color: var(--q-blue);
}

#qorix-coa-page .qorix-report-doc-icon svg {
    width: 20px;
    height: 20px;
}

#qorix-coa-page .qorix-report-doc-text {
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.35;
}

#qorix-coa-page .qorix-report-doc-text strong {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: var(--q-text);
}

#qorix-coa-page .qorix-report-doc-text span {
    display: block;
    font-size: 12px;
    color: var(--q-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#qorix-coa-page .qorix-report-doc-actions {
    flex: none;
    display: flex;
    align-items: center;
    gap: 10px;
}

#qorix-coa-page .qorix-report-view {

    padding: 10px 18px;

    border: 0;
    border-radius: 7px;

    background:
        linear-gradient(
            135deg,
            var(--q-navy) 0%,
            var(--q-navy-2) 100%
        );

    color: #ffffff;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .6px;
    text-transform: uppercase;
    cursor: pointer;

    transition: filter .18s ease, transform .18s ease;
}

#qorix-coa-page .qorix-report-view:hover {
    filter: brightness(1.12);
}

#qorix-coa-page .qorix-report-download {

    font-size: 12px;
    font-weight: 700;
    letter-spacing: .4px;
    color: var(--q-blue);
    text-decoration: none;
    white-space: nowrap;
}

#qorix-coa-page .qorix-report-download:hover {
    text-decoration: underline;
}


/* ---------------------------------------------------------------
   The panel the report opens into
   --------------------------------------------------------------- */

.qorix-modal {

    position: fixed;
    inset: 0;
    z-index: 9000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 28px;

    background: rgba(10, 18, 38, .72);
    backdrop-filter: blur(2px);
}

.qorix-modal[hidden] {
    display: none !important;
}

.qorix-modal-panel {

    display: flex;
    flex-direction: column;

    width: min(1000px, 100%);
    height: min(90vh, 1100px);

    overflow: hidden;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 30px 80px rgba(8, 15, 35, .45);
}

.qorix-modal-head {

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    padding: 14px 18px;

    border-bottom: 1px solid #dce4ee;
    background: #f7fbff;
}

.qorix-modal-heading { min-width: 0; }

.qorix-modal-title {

    margin: 0;

    font-family: "DM Sans", "Segoe UI", system-ui, sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #15223f;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qorix-modal-sub {

    margin: 2px 0 0;

    font-family: "Mulish", "Segoe UI", system-ui, sans-serif;
    font-size: 12px;
    color: #8994a6;
}

.qorix-modal-tools {
    flex: none;
    display: flex;
    align-items: center;
    gap: 14px;
}

.qorix-modal-download {

    font-family: "Mulish", "Segoe UI", system-ui, sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: #2870ca;
    text-decoration: none;
}

.qorix-modal-download:hover {
    text-decoration: underline;
}

.qorix-modal-close {

    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    padding: 0;
    border: 1px solid #dce4ee;
    border-radius: 7px;

    background: #ffffff;
    color: #15223f;
    cursor: pointer;
}

.qorix-modal-close:hover {
    background: #eef4fb;
}

.qorix-modal-close svg {
    width: 17px;
    height: 17px;
}

.qorix-modal-frame {

    flex: 1 1 auto;
    width: 100%;

    border: 0;
    background: #525659;
}


@media (max-width: 900px) {

    .qorix-modal { padding: 12px; }

    .qorix-modal-panel { height: 92vh; }
}


@media (max-width: 600px) {

    #qorix-coa-page .qorix-report-doc {
        flex-wrap: wrap;
    }

    #qorix-coa-page .qorix-report-doc-actions {
        width: 100%;
        justify-content: space-between;
    }

    #qorix-coa-page .qorix-report-view {
        flex: 1 1 auto;
        text-align: center;
    }
}


/* ================================================================
   33. Printing a verified record

   Someone who has just verified a report often wants the result on
   paper, or as a PDF, to file against the delivery. Print gives them
   the record and nothing else: no search box, no upload zone, no
   decoration, no navigation.
   ================================================================ */

@media print {

    body.page-verify { background: #ffffff; }

    .site-header,
    .site-footer,
    .to-top,
    #qorix-coa-page .qorix-grid-background,
    #qorix-coa-page .qorix-microscope,
    #qorix-coa-page .qorix-molecule,
    #qorix-coa-page .qorix-signature,
    #qorix-coa-page .qorix-benefits,
    #qorix-coa-page .qorix-footer-strip,
    #qorix-coa-page .qorix-divider,
    #qorix-coa-page #coa-search-btn,
    #qorix-coa-page #coa-input,
    #qorix-coa-page .qorix-upload-zone,
    #qorix-coa-page .qorix-local-info,
    #qorix-coa-page .qorix-report-doc-actions {
        display: none !important;
    }

    #qorix-coa-page .qorix-hero {
        min-height: auto !important;
        background: #ffffff !important;
    }

    #qorix-coa-page .qorix-main {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
    }

    #qorix-coa-page .qorix-intro {
        display: block !important;
        margin-bottom: 14px;
    }

    #qorix-coa-page .qorix-card {
        box-shadow: none !important;
        border: 1px solid #c9d4e2 !important;
        width: 100% !important;
        max-width: 100% !important;
        page-break-inside: avoid;
    }

    /* the step numbering means nothing on paper */
    #qorix-coa-page .qorix-step-number,
    #qorix-coa-page .qorix-step-note {
        display: none !important;
    }

    #qorix-coa-page .coa-result-table {
        page-break-inside: avoid;
    }
}


/* ================================================================
   34. Contrast

   Two colours in the block above fall below WCAG AA once measured
   against what is actually painted behind them. Same hues, deep
   enough to read.
   ================================================================ */

#qorix-coa-page {
    /* was #8994a6, 3.1:1 on the card */
    --q-muted: #687588;
}

/* the line under the card, 11px on near white */
#qorix-coa-page .qorix-footer-strip {
    color: #687588;
}


/* ================================================================
   35. What to do with a verified record
   ================================================================ */

#qorix-coa-page .qorix-record-tools {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

#qorix-coa-page .qorix-record-tools button {
    padding: 8px 14px;
    border: 1px solid var(--q-border);
    border-radius: 7px;
    background: #ffffff;
    color: var(--q-navy);
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .3px;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease;
}

#qorix-coa-page .qorix-record-tools button:hover {
    background: #eef4fb;
    border-color: #b9c7da;
}

@media print {
    #qorix-coa-page .qorix-record-tools { display: none !important; }
}

@media (max-width: 600px) {
    #qorix-coa-page .qorix-record-tools button {
        flex: 1 1 auto;
        text-align: center;
    }
}


/* ================================================================
   36. What the check does and does not say
   ================================================================ */

#qorix-coa-page .qorix-scope {
    width: min(860px, calc(100% - 36px));
    margin: 0 auto 28px;
    padding: 24px 28px 20px;
    border: 1px solid #dbe6f2;
    border-radius: 12px;
    background: rgba(255, 255, 255, .72);
}

#qorix-coa-page .qorix-scope h2 {
    margin: 0 0 14px;
    font-family: "DM Sans", "Segoe UI", system-ui, sans-serif;
    font-size: 17px;
    font-weight: 700;
    color: var(--q-navy);
}

#qorix-coa-page .qorix-scope ul {
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

#qorix-coa-page .qorix-scope li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 9px;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--q-text-soft);
}

#qorix-coa-page .qorix-scope li::before {
    position: absolute;
    left: 0;
    top: 0;
    font-weight: 700;
}

#qorix-coa-page .qorix-scope-yes li::before {
    content: "\2713";
    color: var(--q-success);
}

#qorix-coa-page .qorix-scope-no li::before {
    content: "\2715";
    color: var(--q-danger);
}

#qorix-coa-page .qorix-scope-help {
    margin: 14px 0 0;
    padding-top: 12px;
    border-top: 1px solid #e6eef7;
    font-size: 13px;
    color: var(--q-muted);
}

#qorix-coa-page .qorix-scope-help a {
    color: #1f5fa8;
    font-weight: 700;
    text-decoration: none;
}

#qorix-coa-page .qorix-scope-help a:hover {
    text-decoration: underline;
}

@media (max-width: 600px) {

    #qorix-coa-page .qorix-scope {
        width: calc(100% - 18px);
        padding: 20px 18px 16px;
    }

    #qorix-coa-page .qorix-scope li {
        font-size: 13px;
    }
}

/* on paper it belongs with the record */
@media print {

    #qorix-coa-page .qorix-scope {
        display: block !important;
        border: 1px solid #c9d4e2;
        background: #ffffff;
        page-break-inside: avoid;
    }
}


/* ================================================================
   37. Reports under a batch number
   ================================================================ */

#qorix-coa-page .qorix-batch-list {
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
}

#qorix-coa-page .qorix-batch-list li {
    margin-bottom: 8px;
}

#qorix-coa-page .qorix-batch-pick {
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--q-border);
    border-radius: 9px;
    background: #ffffff;
    text-align: left;
    font-family: inherit;
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease;
}

#qorix-coa-page .qorix-batch-pick:hover {
    border-color: #9fb6d2;
    background: #f6faff;
}

#qorix-coa-page .qorix-batch-no {
    font-size: 14px;
    font-weight: 700;
    color: var(--q-navy);
    letter-spacing: .2px;
}

#qorix-coa-page .qorix-batch-meta {
    font-size: 12px;
    color: var(--q-muted);
}

/* A specimen is neither a pass nor a failure, so it reads as neither
   green nor red. Amber, the colour of "read this before you go on". */
#qorix-coa-page .coa-status-specimen {

    border:
        1px solid #e6cfa6;

    background: #fdf6e8;

    color: #7a5313;
}