/* banner */
.framework_ark_banner {
    position: relative;
    width: 100%;
}

.banner_text_box {
    width: 100%;
    max-width: 1330px;
    margin: 0 auto;
    padding: 3rem 1rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
}

.banner_text_box .banner_logo {
    width: 10rem;
    margin-bottom: 1rem;
}

.banner_text_box .banner_text {
    max-width: 550px;
    margin-bottom: 3rem;
    color: #474747;
    font-size: 0.95rem;
    line-height: 1.8;
}

.banner_text_box .banner_btn {
    display: flex;
    align-items: center;
}

.banner_text_box button {
    padding: 0.625rem 1.5rem;
    background: linear-gradient(180deg, #1c60ff, #7628ff);
    color: #fff;
    border: none;
    font-weight: bold;
    border-radius: 0.375rem;
    font-size: 1rem;
    cursor: pointer;
    width: 8rem;
    height: 3rem;
    line-height: 3rem;
}

.banner_text_box .button {
    padding: 0 1.5rem;
    background: linear-gradient(180deg, #1c60ff, #7628ff);
    color: #fff;
    border: none;
    font-weight: bold;
    border-radius: 0.375rem;
    font-size: 1rem;
    cursor: pointer;
    width: 8rem;
    text-align: center;
    line-height: 3rem;
    height: 3rem;
}

.banner_text_box button.btn_product {
    padding: 2px;
    margin-left: 1rem;
}

.banner_text_box button.btn_product .flex_int {
    background-color: #e5eeff;
    height: 100%;
    border-radius: 0.3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #2759db;
}

.banner_text_box button.btn_product .icon {
    margin-right: 0.5rem;
    font-size: 1.3rem;
    color: #345ed3;
}

.banner_text_box a {
    color: #176eff;
    font-size: 1rem;
}

.framework_ark_banner .img_box img {
    width: 100%;
    height: 435px;
    object-fit: cover;
}

@media (max-width:768px) {
    .framework_ark_banner .img_box img {
        height: 300px;
    }

    .banner_text_box .banner_text {
        font-size: 1rem;
    }
}

/* 品牌 */
.framework_brand {
    padding: 4rem 0 7.6rem;
    position: relative;
    background: url(/resource/image/AI-soujian/back_1.png) no-repeat center center;
    background-size: 100%;
}

.frameword_brand_flex {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 1rem;
}

.frameword_brand_flex .brand_title {
    text-align: center;
    margin-bottom: 2rem;
}

.frameword_brand_flex .brand_title h4 {
    display: inline-block;
    font-size: 3.2rem;
    font-weight: bold;
    background: linear-gradient(90deg, #641bd7, #ff5b3c);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    letter-spacing: 1px;
}

.frameword_brand_flex .brand_title h4 span {
    color: #333333;
    font-weight: 400;
}

.frameword_brand_flex .brand_title p {
    margin-top: 1rem;
    font-size: 1.45rem;
    color: #000000;
}

.frameword_brand_flex .brand_title p span {
    font-weight: 600;
}

.frameword_brand_flex .brand_content {
    margin-bottom: 2.2rem;
    padding: 0 3rem;
}

.frameword_brand_flex .brand_content p {
    color: #5f5f5f;
    font-size: 0.95rem;
    margin-bottom: 1rem;
    line-height: 2;
}

.frameword_brand_flex .brand_content p span {
    font-weight: 600;
}

.frameword_brand_flex .brand_imgs {
    display: flex;
    justify-content: center;
    align-items: center;
    /* flex-wrap: wrap; */
}

.frameword_brand_flex .img_box {
    width: 4.3rem;
    margin: 0 1rem;
}

.brand_href {
    text-align: center;
    margin-top: 3rem;
}

.brand_href a {
    display: inline-block;
    padding: 1rem 2rem;
    background: #040200;
    color: #fff;
    border: none;
    font-weight: bold;
    border-radius: 0.5rem;
    font-size: 0.95rem;
    cursor: pointer;
}


/* AI搜索营销 */
.framework_geo {
    position: relative;
    padding-top: 1rem;
}

.framework_geo .framework_geo_box {
    max-width: 1650px;
    padding: 3.6rem 3.3rem;
    margin: 0 auto 3rem;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 0.8rem;
}

.framework_geo .framework_geo_box .geo_title {
    text-align: center;
    margin-bottom: 2.6rem;
}

.framework_geo .framework_geo_box .geo_title h4 {
    display: inline-block;
    font-size: 2.2rem;
    font-weight: bold;
    background: linear-gradient(90deg, #6a0bff, #ff5b3c);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    letter-spacing: 1px;
}

.framework_geo .framework_geo_box .geo_title p {
    font-size: 1.1rem;
    margin-top: 0.5rem;
}

.framework_geo .framework_geo_box .content_fl {
    flex: 0 0 48%;
}

.framework_geo .framework_geo_box .content_fr {
    flex: 0 0 48%;
}

.framework_geo .framework_geo_box .content_fl p {
    margin-bottom: 1rem;
    color: #4b4b4b;
    text-indent: 2rem;
    font-size: 0.95rem;
    line-height: 2;
}

.framework_geo .framework_geo_box .content_fl p span {
    color: #3636ff;
    font-weight: bold;
}

.framework_geo .framework_geo_box .content_fr .item {
    flex: 0 0 28%;
    padding: 2.2rem 1rem;
    border-radius: 1.8rem;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border: 2px solid #d3d3ff;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.framework_geo .framework_geo_box .content_fr .item .icon {
    margin-bottom: 1rem;
    font-size: 3rem;
}

.framework_geo .framework_geo_box .content_fr .item p {
    font-size: 1.45rem;
    margin-bottom: 1.2rem;
}

.framework_geo .framework_geo_box .content_fr .item p span {
    font-size: 2.8rem;
    font-weight: bold;
}

.framework_geo .framework_geo_box .content_fr .item h4 {
    color: #000000;
    font-size: 1.4rem;
    font-weight: 600;
}

.framework_geo .framework_geo_box .content_fr .item1 {
    background-image: url(/resource/image/AI-soujian/icon_back-1.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.framework_geo .framework_geo_box .content_fr .item2 {
    background-image: url(/resource/image/AI-soujian/icon_back-2.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.framework_geo .framework_geo_box .content_fr .item3 {
    background-image: url(/resource/image/AI-soujian/icon_back-3.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.framework_geo .framework_geo_box .content_fr .item1 .icon {
    color: #9797ff;
}

.framework_geo .framework_geo_box .content_fr .item1 p {
    color: #9797ff;
}

.framework_geo .framework_geo_box .content_fr .item1 p span {
    color: #3636ff;

}

.framework_geo .framework_geo_box .content_fr .item2 .icon {
    color: #e49ae8;
}

.framework_geo .framework_geo_box .content_fr .item2 p {
    color: #e59ce8;
}

.framework_geo .framework_geo_box .content_fr .item2 p span {
    color: #c94acf;

}

.framework_geo .framework_geo_box .content_fr .item3 .icon {
    color: #ffb2b2;
}

.framework_geo .framework_geo_box .content_fr .item3 p {
    color: #ff9971;
}

.framework_geo .framework_geo_box .content_fr .item3 p span {
    color: #ff5858;

}

/* AI搜索营销（GEO）-- 优化原理 */
.framework_geo_optimize {
    position: relative;
    padding: 3.5rem 0;
}

.framework_optimize_box {
    margin-top: 5rem;
}

.framework_geo_optimize .geo_title {
    text-align: center;
    margin-bottom: 2.6rem;
}

.framework_geo_optimize .geo_title h4 {
    color: #000000;
    font-size: 2.2rem;
    font-weight: 400;
}

.framework_geo_optimize .geo_title h4 span {
    display: inline-block;
    font-size: 2.2rem;
    font-weight: bold;
    background: linear-gradient(90deg, #6a0bff, #ff5b3c);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    letter-spacing: 1px;
}

.framework_geo_optimize .geo_title p {
    font-size: 1.1rem;
    margin-top: 0.6rem;
    color: #606060;
}

.optimize_box_flex .container_box {
    max-width: 1650px;
    margin: 0 auto;
    padding: 0 1.5rem;
    text-align: center;
}

.optimize_box_flex .title-main {
    font-size: 2rem;
    font-weight: 700;
    background: linear-gradient(90deg, #722ed1, #eb2f96);
    -webkit-background-clip: text;
    color: transparent;
    margin-bottom: 1rem;
}

.optimize_box_flex .title-sub {
    font-size: 1.2rem;
    color: #666;
    margin-bottom: 2.2rem;
}

.optimize_box_flex .flow-wrapper {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 3.2rem;
}

.optimize_box_flex .flow-item {
    flex: 1;
    background: linear-gradient(to bottom, rgba(230, 247, 255, 0.3), rgba(255, 230, 240, 0.3));
    border-radius: 1rem;
    padding: 1.5rem 1rem;
    position: relative;
}

.optimize_box_flex .flow-item:nth-of-type(1) {
    border: 2px solid #e7efff;
    background: linear-gradient(to bottom, #f8fbff, #e6f1ff);
}

.optimize_box_flex .flow-item:nth-of-type(2) {
    border: 2px solid #eaedff;
    background: linear-gradient(to bottom, #f9faff, #eaedff);
}

.optimize_box_flex .flow-item:nth-of-type(3) {
    border: 2px solid #f2edff;
    background: linear-gradient(to bottom, #fcfaff, #f2edff);
}

.optimize_box_flex .flow-item:nth-of-type(4) {
    border: 2px solid #faeeff;
    background: linear-gradient(to bottom, #fefaff, #faeeff);
}

.optimize_box_flex .flow-item:nth-of-type(5) {
    border: 2px solid #feedfb;
    background: linear-gradient(to bottom, #fffafe, #feedfb);
}

.optimize_box_flex .flow-item .icon_tag {
    position: absolute;
    font-size: 2rem;
    right: -2.8rem;
    top: 50%;
    transform: translateY(-50%) rotate(180deg);
}

.optimize_box_flex .flow-item:nth-child(1) .icon_tag {
    color: #b1e3fd;
}

.optimize_box_flex .flow-item:nth-child(2) .icon_tag {
    color: #b1e3fd;
}

.optimize_box_flex .flow-item:nth-child(3) .icon_tag {
    color: #d2c4f5;
}

.optimize_box_flex .flow-item:nth-child(4) .icon_tag {
    color: #e0b8f1;
}

.optimize_box_flex .icon-circle {
    width: 5rem;
    height: 5rem;
    font-size: 2.2rem;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    margin-top: -4rem;
    box-shadow: 0 0 0 2px rgb(255 255 255);
}

.optimize_box_flex .icon-circle i {
    font-size: 2.3rem;
    color: #fff;
}

.optimize_box_flex .icon-1 {
    background: linear-gradient(180deg, #d7f3fe, #69d2fb);
    border: 2px solid #69d2fb;
}

.optimize_box_flex .icon-2 {
    background: linear-gradient(180deg, #deeffe, #89c9fc);
    border: 2px solid #89c9fc;
}

.optimize_box_flex .icon-3 {
    background: linear-gradient(180deg, #cfd7fe, #abbafd);
    border: 2px solid #abbafd;
}

.optimize_box_flex .icon-4 {
    background: linear-gradient(180deg, #f0e6ff, #cba9fe);
    border: 2px solid #cba9fe;
}

.optimize_box_flex .icon-5 {
    background: linear-gradient(180deg, #f7e3ff, #e29bff);
    border: 2px solid #e29bff;
}

.optimize_box_flex .step-title {
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: #222;
}

.optimize_box_flex .step-desc {
    font-size: 0.9rem;
    color: #555;
    line-height: 1.6;
    margin-bottom: 1.6rem;
    min-height: 4rem;
    text-align: left;
}

.optimize_box_flex .geo-title {
    font-size: 0.9rem;
    font-weight: 600;
    color: #ff7d00;
    margin-bottom: 12px;
    text-align: left;
}

.optimize_box_flex .geo-tag {
    background-color: #fcf6f2;
    border-left: 3px solid #ff7200;
    border-radius: 8px;
    padding: 0.8rem 1rem;
    margin-bottom: 1rem;
    font-size: 0.9rem;
    color: #333;
    text-align: left;
    box-shadow: 0 0 10px rgb(221 221 221);
}


.optimize_box_flex .icon-text {
    font-size: 2.3rem;
    color: #fff;
}


/* 系统图谱 */
.framework_geo_xitong {
    padding: 4rem 0;
    background: url(/resource/image/AI-soujian/back_3.png) no-repeat center center;
    background-size: 100%;
}

.framework_geo_xitong .container_box {
    max-width: 1650px;
    padding: 0 2.5rem;
    margin: 0 auto;
}

.title-main {
    text-align: center;
    font-size: 1.75rem;
    font-weight: 700;
    color: #111;
    margin-bottom: 1.25rem;
}

.desc-text {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #606060;
    margin-bottom: 2rem;
    margin-top: 3.1rem;
}

.system-map {
    display: flex;
    gap: 0.75rem;
    border-radius: 1.6rem;
    overflow: hidden;
}

/* 左侧导航栏 */
.sidebar {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.sidebar-item {
    background: linear-gradient(180deg, #3377ff 0%, #165dff 100%);
    color: #fff;
    border-radius: 0.5rem;
    padding: 0.25rem 1rem;
    text-align: center;
    width: 9.45rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sidebar-item .item-title {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    padding: 0.3rem 0.6rem;
    border-radius: 10rem;
    background-color: #165adc;
    color: #ffdd44;
}

.sidebar-item .item-title span {
    background: linear-gradient(180deg, #ebeef9, #f7df1b);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.sidebar-item .item-sub {
    font-size: 1rem;
    margin-bottom: 0.3rem;
}

.sidebar-item .item-sub span {
    font-size: 12px;

}

/* 右侧内容区 */
.content-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.content-row {
    background-color: #d5e5ff;
    border-radius: 0.75rem;
    padding: 1.1rem;
    display: flex;
    gap: 0.75rem;
}

.col-group {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.col-full {
    flex: 1;
}

.col-half {
    flex: 1;
}

.col-third {
    flex: 1;
}

.card-block {
    background-color: #fff;
    border-radius: 0.5rem;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.card-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #222;
}

.tag-group {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.tag-item {
    background-color: #e8f4ff;
    border: 1px solid #cce0ff;
    border-radius: 0.5rem;
    padding: 0.6rem 1rem;
    font-size: 0.875rem;
    color: #333;
    flex: 1;
    text-align: center;
    white-space: nowrap;
}

.mobile-sidebar {
    display: none;
}

/* 响应式适配 */
@media (max-width: 992px) {
    .system-map {
        flex-direction: column;
    }

    .content-row {
        flex-wrap: wrap;
    }

    .sidebar {
        display: none;
    }

    .mobile-sidebar {
        display: block;
        flex: 0 0 100%;
    }

    .sidebar-item {
        width: auto;
        flex: 1;
    }
}

@media (max-width: 768px) {
    .framework_geo_xitong {
        background-position: center -1rem;
    }

    .content-row {
        flex-direction: column;
    }

    .title-main {
        font-size: 1.45rem;
    }

    .sidebar-item .item-title {
        margin-top: 0.6rem;
    }

    .tag-group {
        flex-direction: column;
    }

    .tag-item {
        white-space: normal;
    }
}


/* 全局容器统一自适应 */
.framework_ark_banner .img_box img,
.framework_brand,
.framework_geo,
.framework_geo_optimize,
.framework_geo_xitong {
    width: 100% !important;
    overflow: hidden !important;
}


/* 品牌部分 移动端 */
@media (max-width: 768px) {
    .framework_brand {
        padding: 2rem 0 4rem;
        background-size: cover;
    }

    .frameword_brand_flex .brand_title h4 {
        font-size: 2rem !important;
    }

    .framework_geo .framework_geo_box .content_fl p {
        font-size: 1rem;
    }

    .frameword_brand_flex .brand_title p {
        font-size: 1rem !important;
    }

    .frameword_brand_flex .brand_content {
        padding: 0 1rem;
    }

    .frameword_brand_flex .brand_imgs {
        flex-wrap: wrap;
        gap: 1rem;
    }

    .frameword_brand_flex .img_box {
        width: 3rem;
        margin: 0.5rem;
    }
}

/* AI搜索营销 左右布局 → 垂直布局 */
@media (max-width: 768px) {
    .framework_geo .framework_geo_box {
        padding: 2rem 1rem;
    }

    .framework_geo .framework_geo_box .geo_title h4 {
        font-size: 1.6rem !important;
    }

    .framework_geo .framework_geo_box .d-flex {
        flex-direction: column !important;
        gap: 2rem;
    }

    .framework_geo .framework_geo_box .content_fl,
    .framework_geo .framework_geo_box .content_fr {
        flex: 0 0 100% !important;
    }

    .framework_geo .framework_geo_box .content_fr {
        flex-direction: column;
        gap: 1rem;
    }

    .framework_geo .framework_geo_box .content_fr .item {
        margin-bottom: 1rem;
        padding: 1.5rem 1rem;
        width: 100%;
    }
}

/* 优化原理步骤卡片 移动端自动换行 */
@media (max-width: 992px) {
    .optimize_box_flex .flow-wrapper {
        flex-wrap: wrap;
        gap: 2rem;
    }

    .optimize_box_flex .flow-item {
        flex: 0 0 46%;
        margin-bottom: 2rem;
    }

    .optimize_box_flex .flow-item .icon_tag {
        display: none;
        /* 小屏隐藏箭头更清爽 */
    }
}

@media (max-width: 768px) {
    .optimize_box_flex .flow-wrapper {
        flex-direction: column;
    }

    .optimize_box_flex .flow-item {
        flex: 0 0 100%;
    }

    .optimize_box_flex .step-desc {
        font-size: 1rem;
    }

    .optimize_box_flex .geo-title {
        font-size: 1.1rem;
    }

    .optimize_box_flex .icon-circle {
        margin-top: -2.5rem;
        width: 4rem;
        height: 4rem;
    }

    .optimize_box_flex .geo-tag {
        font-size: 1rem;
    }

    .framework_geo_optimize .geo_title h4,
    .framework_geo_optimize .geo_title h4 span {
        font-size: 1.6rem !important;
    }
}

/* 系统图谱 移动端完整适配 */
@media (max-width: 992px) {
    .framework_geo_xitong {
        padding: 2rem 0;
        background-size: cover;
    }

    .framework_geo_xitong .container_box {
        padding: 0 1rem;
    }

    .system-map {
        flex-direction: column;
        gap: 1rem;
    }

    .sidebar {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .sidebar-item {
        flex: 1 1 30%;
        min-width: 100px;
        width: auto;
    }
}

@media (max-width: 768px) {
    .content-row {
        flex-direction: column;
        padding: 1rem;
    }

    .tag-group {
        flex-direction: column;
    }

    .tag-item {
        white-space: normal;
        font-size: 1rem;
        word-break: break-word;
    }

    .sidebar-item {
        padding: 1rem 0.5rem;
    }

    .card-title {
        font-size: 1.1rem;
    }

    .sidebar-item .item-title {
        font-size: 1.2rem;
    }

    .sidebar-item .item-sub span {
        margin-top: 0.6rem;
    }

    .desc-text {
        margin-top: 1.5rem;
        font-size: 1rem;
    }
}

/* 视频样式 */
.video-js {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

.close-btn {
    background: rgb(0 0 0 / 20%);
}

.close-btn:hover {
    background: rgb(0 0 0 / 10%);
}



/* AI搜索营销（GEO）-- 高权重合作媒体 */
.cont_case_box_media {
    max-width: 1320px;
}

.section-title {
    font-size: 1.1rem;
    font-weight: bold;
    color: #666;
    text-align: center;
    margin: 24px 0 12px;
}

.media-item_flex {
    display: grid;
    grid-template-columns: 1.4fr 3fr;
    gap: 20px;
    align-items: start;
}

/* 第一个：国家级媒体，单独一块 */
.national-media {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.logo-card-big {
    border-radius: 6px;
    padding: 0;
    background: #fff;
    max-width: 400px;
}

.logo-card-big img {
    width: 100%;
    height: auto;
    display: block;
}

/* 通用网格容器：省市级 / 商业媒体 / B2B平台 */
.media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
}

.logo-card {
    border-radius: 6px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 64px;
    background: #fff;
}

.logo-card img {
    max-width: 100%;
    max-height: 60px;
    object-fit: contain;
    border-radius: 10px;
    overflow: hidden;
}