/* Robotcis Institute Styles */

/* =========================
   滚动渐入动画（参考首页风格）
   ========================= */

/* 基础动画类：初始隐藏状态 */
.scroll-animate-up {
    opacity: 0;
    transform: translateY(200px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
    transition-delay: 300ms;
}

.scroll-animate-left {
    opacity: 0;
    transform: translateX(-220px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
    transition-delay: 400ms;
}

.scroll-animate-right {
    opacity: 0;
    transform: translateX(220px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
    transition-delay: 800ms;
}

/* 激活状态：显示并移除偏移 */
.scroll-animate-up.visible,
.scroll-animate-left.visible,
.scroll-animate-right.visible {
    opacity: 1;
    transform: translate(0);
}

/* 兼容旧版 scroll-animate */
.scroll-animate {
    opacity: 0;
    transform: translateY(200px);
    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
    transition-delay: 300ms;
}

.scroll-animate.visible {
    opacity: 1;
    transform: translateY(0);
}

/* =========================
   全局样式
   ========================= */
:root {
    --primary-blue: #0078FF;
    --primary-dark: #003CF1;
    --secondary-blue: #0A82FF;
    --background-dark: #000000;
    --background-alt: #0A0E27;
    --text-white: #FFFFFF;
    --text-gray: rgba(255, 255, 255, 0.92);
    --text-light: rgba(255, 255, 255, 0.65);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    background: #000;
    font-family: 'PingFang SC Light';
    color: var(--text-white);
    line-height: 1.6;
    overflow-x: hidden;
}

.robotics-page {
    min-height: 100vh;
    position: relative;
}

/* 页面缩放容器 - 限制最大宽度1414px并居中 */
.page-scale {
    position: relative;
    width: 100%;
    max-width: 1414px;
    margin: 0 auto;
}

/* =========================
   背景视觉效果
   ========================= */
.background-visuals {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    z-index: 0;
    pointer-events: none;
}

.background-visuals .gradient-1 {
    position: absolute;
    width: min(1142px, calc(1142 / 1414 * 100vw));
    height: min(1142px, calc(1142 / 1414 * 100vw));
    left: min(-300px, calc(-300 / 1414 * 100vw));
    top: min(-300px, calc(-300 / 1414 * 100vw));
    background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(10, 130, 255, 0.15) 0%, rgba(168, 55, 255, 0) 100%);
    animation: float 20s ease-in-out infinite;
    pointer-events: none;
}

.background-visuals .gradient-2 {
    position: absolute;
    width: min(1142px, calc(1142 / 1414 * 100vw));
    height: min(1142px, calc(1142 / 1414 * 100vw));
    right: min(-400px, calc(-400 / 1414 * 100vw));
    top: min(200px, calc(200 / 1414 * 100vw));
    background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(168, 55, 255, 0.1) 0%, rgba(168, 55, 255, 0) 100%);
    animation: float 25s ease-in-out infinite;
    animation-delay: 5s;
    pointer-events: none;
}

@keyframes float {
    0% { transform: translate(0, 0) rotate(0deg); }
    50% { transform: translate(min(20px, calc(20 / 1414 * 100vw)), min(-20px, calc(-20 / 1414 * 100vw))) rotate(180deg); }
    100% { transform: translate(0, 0) rotate(360deg); }
}

/* =========================
   Banner Section
   ========================= */
.banner-section {
     padding: min(40px, calc(40 / 1414 * 100vw)) 0 0;
    position: relative;
    background: transparent;
    margin-top: min(100px, calc(100 / 1414 * 100vw));
}

/* Banner 底部介绍文字 */
.banner-intro-text {
    position: relative;
    width: min(923px, calc(923 / 1414 * 100vw));
    margin: 0 auto 0;
    text-align: center;
    z-index: 110;
    min-height: min(63px, calc(63 / 1414 * 100vw));
}

.banner-intro-text p {
    font-family: "PingFang SC Medium", "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: min(16px, calc(16 / 1414 * 100vw));
    line-height: 1.3;
    color: #ffffff;
    margin: 0;
    padding: 0 min(20px, calc(20 / 1414 * 100vw));
    z-index: 110;
    opacity: 0.7;
}
.banner-intro-text p:hover {

    opacity: 1;
}
.banner-title {
    text-align: center;
    /* margin-bottom: min(54px, calc(54 / 1414 * 100vw)); */
    position: relative;
    z-index: 110;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-family: "PingFang SC Semibold";
}
.banner-title h1{
    font-size: min(45px, calc(45 / 1414 * 100vw));
    /*font-weight: 600;*/
    background: linear-gradient(90deg, rgba(31, 128, 255, 1) 10.096153616905212%, rgba(255, 255, 255, 1) 75%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin: 0;
    letter-spacing: 0;
    line-height: 1;
    margin-bottom: min(15px, calc(15 / 1414 * 100vw));
}
.banner-title p {
    font-size: min(25px, calc(25 / 1414 * 100vw));
    /*font-weight: 600;*/
    background: linear-gradient(90deg, rgba(31, 128, 255, 1) 10.096153616905212%, rgba(255, 255, 255, 1) 75%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin: 0;
    letter-spacing: 0;
}
.banner-container {
    position: relative;
    width: min(896px, calc(860 / 1414 * 100vw));
    height: min(520px, calc(520 / 1414 * 100vw));
    margin: 0 auto;
}

/* 左右两侧的容器区域（按设计稿定位） */
.banner-left-section,
.banner-right-section {
    position: absolute;
    top: 50%;
    width: min(320px, calc(320 / 1414 * 100vw));
    height: min(420px, calc(420 / 1414 * 100vw));
    transform: translateY(-50%);
    z-index: 3;
    pointer-events: none;
}

.banner-left-section {
    left: 0;
}

.banner-right-section {
    right: 0;
}

/* icon+line容器 */
.icon-line-container {
    position: absolute;
    display: flex;
    align-items: center;
    gap: min(-14px, calc(-14 / 1414 * 100vw));
    pointer-events: auto;
}

/* 左侧容器：icon在左，line在右 */
.banner-left-section .icon-line-container {
    left: 0;
    flex-direction: row;
}

/* 右侧容器：line在左，icon在右 */
.banner-right-section .icon-line-container {
    right: 0;
    flex-direction: row;
}

/* 三组图标的横向位置为不规则排布（按设计稿微调，差距加大） */
.banner-left-section .icon-line-container-1 { top: min(30px, calc(30 / 1414 * 100vw)); left: 0; }
/* 2号相对1号更靠中间（向右） */
.banner-left-section .icon-line-container-2 { top: min(170px, calc(170 / 1414 * 100vw)); left: min(52px, calc(52 / 1414 * 100vw)); }
/* 3号相对1号更靠外侧（向左） */
.banner-left-section .icon-line-container-3 { top: min(315px, calc(315 / 1414 * 100vw)); left: max(-24px, calc(-24 / 1414 * 100vw)); }

/* 右侧以2号为基准：1号更靠左；3号比1号更靠右但仍比2号靠左 */
.banner-right-section .icon-line-container-1 { top: min(40px, calc(40 / 1414 * 100vw)); right: min(78px, calc(78 / 1414 * 100vw)); }
.banner-right-section .icon-line-container-2 { top: min(160px, calc(160 / 1414 * 100vw)); right: 0; }
.banner-right-section .icon-line-container-3 { top: min(300px, calc(300 / 1414 * 100vw)); right: min(90px, calc(90 / 1414 * 100vw)); }
.banner-right-section .icon-line-container-2 .line-img{
    width: min(192px, calc(192 / 1414 * 100vw));
}

/* 图标样式 */
.icon-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    transition: transform 0.3s ease;
    text-align: center;
    width: min(115px, calc(115 / 1414 * 100vw));
    opacity: 0;
    transform: translateY(30px);
    animation: iconFadeInUp 0.6s ease forwards;
}

/* 页面加载时依次由下往上渐变出现动画 */
@keyframes iconFadeInUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 左侧 icon-item 依次出现 */
.banner-left-section .icon-line-container:nth-child(1) .icon-item {
    animation-delay: 0.1s;
}
.banner-left-section .icon-line-container:nth-child(2) .icon-item {
    animation-delay: 0.3s;
}
.banner-left-section .icon-line-container:nth-child(3) .icon-item {
    animation-delay: 0.5s;
}

/* 右侧 icon-item 依次出现 */
.banner-right-section .icon-line-container:nth-child(1) .icon-item {
    animation-delay: 0.7s;
}
.banner-right-section .icon-line-container:nth-child(2) .icon-item {
    animation-delay: 0.9s;
}
.banner-right-section .icon-line-container:nth-child(3) .icon-item {
    animation-delay: 1.1s;
}

.icon-item:hover {
    transform: translateY(min(-6px, calc(-6 / 1414 * 100vw)));
}

.icon-item.active {
    transform: scale(1.05);
}

/* 图标容器 - 用于包裹默认和悬停图标 */
.icon-img-wrapper {
    position: relative;
    width: min(52px, calc(52 / 1414 * 100vw));
    height: min(52px, calc(52 / 1414 * 100vw));
    margin-bottom: min(8px, calc(8 / 1414 * 100vw));
}

/* 图标默认和悬停状态 */
.icon-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: opacity 0.3s ease;
}

/* 默认图标 */
.icon-img-default {
    opacity: 1;
    /* 默认状态下的上下浮动动画 */
    animation: icon-float 3s ease-in-out infinite;
}

/* 悬停图标 - 默认隐藏 */
.icon-img-hover {
    opacity: 0;
}

/* 悬停时显示悬停图标 */
.icon-item:hover .icon-img-default {
    opacity: 0;
}

.icon-item:hover .icon-img-hover {
    opacity: 1;
    /* 悬停时停止浮动 */
    animation: none;
}

/* 上下浮动动画 */
@keyframes icon-float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(min(-6px, calc(-6 / 1414 * 100vw)));
    }
}

.icon-text {
    font-size: min(14px, calc(14 / 1414 * 100vw));
    color: #fff;
    text-align: center;
    margin: 0;
    font-weight: 400;
    line-height: 1.4;
    min-width: min(140px, calc(140 / 1414 * 100vw));
}

/* 中间内容区域 */
.banner-content {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(520px, calc(520 / 1414 * 100vw));
    height: min(520px, calc(520 / 1414 * 100vw));
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    /* z-index: 10; */
}

/* 背景视频（bananer-bg.mp4）：放大并保持居中，边缘渐隐融合 */
.banner-bg {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(400px, calc(400 / 1414 * 100vw));
    height:min(400px, calc(400 / 1414 * 100vw));
    max-width: none;
    max-height: none;
    transform: translate(-50%, -50%) scale(1.5);
    transform-origin: center;
    object-fit: contain;
    z-index: 0;
    pointer-events: none;
    -webkit-mask-image: radial-gradient(circle, rgba(0,0,0,1) 58%, rgba(0,0,0,0.85) 68%, rgba(0,0,0,0.2) 82%, rgba(0,0,0,0) 100%);
    mask-image: radial-gradient(circle, rgba(0,0,0,1) 58%, rgba(0,0,0,0.85) 68%, rgba(0,0,0,0.2) 82%, rgba(0,0,0,0) 100%);
}

/* 详细文字展示区域 - 图片和文字作为一个整体居中 */
.detail-display {
    position: absolute;
    left: 50%;
    top: 46%;
    transform: translate(-50%, -50%);
    z-index: 100;
    width: min(300px, calc(300 / 1414 * 100vw));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: min(20px, calc(20 / 1414 * 100vw));
    pointer-events: none;
}

/* 线条样式 */
.line-img {
    display: block;
    width: min(116px, calc(116 / 1414 * 100vw));
    height: auto;
    z-index: 1;
    opacity: 1;
    flex-shrink: 0;
}

.banner-left-section .line-img {
    margin-left: min(-10px, calc(-10 / 1414 * 100vw));
}

.banner-right-section .line-img {
    margin-right: min(-10px, calc(-10 / 1414 * 100vw));
}
.banner-left-section .icon-line-container-1 .line-img {

    width: min(181px, calc(181 / 1414 * 100vw));

}
.banner-left-section .icon-line-container-3 .line-img {

    width: min(203px, calc(203 / 1414 * 100vw));

}

.detail-text {
    font-size: min(24px, calc(24 / 1414 * 100vw));
    color: #fff;
    text-align: center;
    line-height: 1.1;
    margin: 0;
    width: 100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 110;
}

/* 当 detail-text 显示时 */
.detail-text[style*="flex"],
.detail-text.visible {
    display: flex !important;
}

/* 默认显示的图片 */
.detail-default-img {
    width: min(267px, calc(267 / 1414 * 100vw));
    height: min(67px, calc(67 / 1414 * 100vw));
    object-fit: contain;
    z-index: 2;
}

/* 固定显示的文字 */
.detail-fixed-text {
    font-size: min(20px, calc(20 / 1414 * 100vw));
    color: #FFFFFF;
    /*font-weight: 600;*/
    white-space: nowrap;
    font-family: "PingFang SC Semibold";
    z-index: 2;
}

/* =========================
   Intro / Experience / Dishes / Franchise / Footer
   ========================= */
.intro-section {
    position: relative;
    width: min(1436px, calc(1436 / 1414 * 100vw));
    height: min(755px, calc(755 / 1414 * 100vw));
    margin: min(218px, calc(218 / 1414 * 100vw)) auto 0;
}

.intro-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.intro-bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 视频播放遮罩层 */
.intro-video-overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    z-index: 100;
    display: none;
    align-items: center;
    justify-content: center;
}

.intro-video-overlay.active {
    display: flex;
}

.intro-video-player {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.intro-video-close {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 40px;
    color: #fff;
    cursor: pointer;
    z-index: 101;
    transition: opacity 0.3s ease;
}

.intro-video-close:hover {
    opacity: 0.7;
}

.intro-content {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    padding: min(25px, calc(25 / 1414 * 100vw));
}

.intro-logo {
    position: absolute;
    left: min(25px, calc(25 / 1414 * 100vw));
    top: min(25px, calc(25 / 1414 * 100vw));
    width: min(295px, calc(295 / 1414 * 100vw));
    height: auto;
}

.intro-text {
    position: absolute;
    left: min(344px, calc(344 / 1414 * 100vw));
    top: min(36px, calc(36 / 1414 * 100vw));
    right: min(60px, calc(60 / 1414 * 100vw));
    color: rgba(255, 255, 255, 0.85);
    font-size: min(16px, calc(16 / 1414 * 100vw));
    line-height: 1.4;
    text-align: left;
    font-weight: 200;
    margin: 0;
    color: #ffffff;
    font-family: "PingFang SC Medium";
}

/* 播放视频按钮 */
.intro-play-btn {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: min(10px, calc(10 / 1414 * 100vw));
    cursor: pointer;
    transition: transform 0.3s ease;
    z-index: 10;
}

.intro-play-btn:hover {
    transform: translate(-50%, -50%) scale(1.05);
}

.intro-play-icon {
    width: min(80px, calc(80 / 1414 * 100vw));
    height: auto;
}

.intro-play-text {
    color: #fff;
    font-size: min(14px, calc(14 / 1414 * 100vw));
    font-weight: 500;
}

.section-header {
    text-align: center;
    margin: 0 auto min(22px, calc(22 / 1414 * 100vw));
    width: min(1180px, calc(1180 / 1414 * 100vw));
}
.experience-section .section-header{
    /* 背景样式已移至 cdn_assets.html */
}

.section-title {
    font-size: min(30px, calc(30 / 1414 * 100vw));
    font-weight: 500;
    color: #fff;
    font-family: "PingFang SC Regular";
    line-height: 1;
    margin-bottom: min(11px, calc(11 / 1414 * 100vw));
}

.section-subtitle {
    font-size: min(20px, calc(20 / 1414 * 100vw));
    font-weight: 600;
    color: #A2A2A2;
    font-family: "PingFang SC Semibold";
}

.experience-section {
    position: relative;
    padding: min(140px, calc(140 / 1414 * 100vw)) 0 min(80px, calc(80 / 1414 * 100vw));
}

/* Experience Section 右侧背景 - 背景样式已移至 cdn_assets.html */
.experience-section::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: min(596px, calc(596 / 1414 * 100vw));
    height: min(1139px, calc(1139 / 1414 * 100vw));
    /* background在cdn_assets.html中定义 */
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
}

.experience-stage {
    position: relative;
    width: min(1180px, calc(1180 / 1414 * 100vw));
    margin: min(66px, calc(66 / 1414 * 100vw)) auto 0;
    z-index: 1;
}

/* Swiper 容器 */
.experience-swiper {
    width: 100%;
    padding: min(20px, calc(20 / 1414 * 100vw)) 0;
}

.experience-swiper .swiper-slide {
    width: min(264px, calc(264 / 1414 * 100vw)) !important;
    height: min(306px, calc(306 / 1414 * 100vw));
    margin-right: min(38px, calc(38 / 1414 * 100vw)) !important;
}

.experience-card {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: min(10px, calc(10 / 1414 * 100vw));
    overflow: hidden;
    background: rgba(0, 0, 0, 0.35);
    border: min(1px, calc(1 / 1414 * 100vw)) solid rgba(10, 130, 255, 0.7);
    padding: min(18px, calc(18 / 1414 * 100vw)) min(20px, calc(20 / 1414 * 100vw));
    color: #fff;
    z-index: 2;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
    cursor: pointer;
}

.experience-card:hover {
    border-color: #fff;
    box-shadow: 0 min(16px, calc(16 / 1414 * 100vw)) min(40px, calc(40 / 1414 * 100vw)) rgba(0, 0, 0, 0.45);
}

/* 黑色遮罩层 - 默认显示 */
.experience-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
    transition: opacity 0.3s ease;
}

.experience-card:hover::before {
    opacity: 0;
}

/* hover 提示文字 - 默认隐藏，hover时显示 */
.experience-card::after {
    content: attr(data-hover);
    position: absolute;
    left: 50%;
    bottom: min(20px, calc(20 / 1414 * 100vw));
    transform: translateX(-50%);
    background: #006BFF;
    padding: min(8px, calc(8 / 1414 * 100vw)) min(18px, calc(18 / 1414 * 100vw));
    border-radius: min(30px, calc(30 / 1414 * 100vw));
    font-size: min(16px, calc(16 / 1414 * 100vw));
    font-weight: 600;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: 3;
}

.experience-card:hover::after {
    opacity: 1;
}

/* 文字内容 - 默认显示白色，hover时隐藏 */
.experience-card h3 {
    position: relative;
    z-index: 2;
    font-size: min(20px, calc(20 / 1414 * 100vw));
    font-weight: 600;
    margin: min(100px, calc(100 / 1414 * 100vw)) auto min(10px, calc(10 / 1414 * 100vw));
    color: #ffffff;
    opacity: 1;
    transition: opacity 0.3s ease;
    width: min(186px, calc(186 / 1414 * 100vw));
    text-align: center;
}

.experience-card:hover h3 {
    opacity: 0;
}

.experience-card p {
    position: relative;
    z-index: 2;
    font-size: min(14px, calc(14 / 1414 * 100vw));
    line-height: 1.6;
    color: #ffffff;
    opacity: 1;
    transition: opacity 0.3s ease;
    width: min(186px, calc(186 / 1414 * 100vw));
    margin: 0 auto;
    text-align: left;
}

.experience-card:hover p {
    opacity: 0;
}

.experience-card-icon {
    position: relative;
    z-index: 2;
    width: min(38px, calc(38 / 1414 * 100vw));
    height: min(38px, calc(38 / 1414 * 100vw));
    opacity: 1;
    transition: opacity 0.3s ease;
}

.experience-card:hover .experience-card-icon {
    opacity: 0;
}

.experience-card-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    opacity: 0.9;
}

/* Swiper 容器定位 */
.experience-swiper {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-bottom: min(60px, calc(60 / 1414 * 100vw));
}

.experience-swiper .swiper-wrapper {
    display: flex;
    align-items: stretch;
}

/* Swiper 分页指示器 */
.experience-dots {
    bottom: min(20px, calc(20 / 1414 * 100vw)) !important;
    left: 0 !important;
    text-align: left !important;
    transform: none !important;
    width: auto !important;
}

.experience-dots .swiper-pagination-bullet {
    width: min(12px, calc(12 / 1414 * 100vw));
    height: min(12px, calc(12 / 1414 * 100vw));
    background: rgba(255, 255, 255, 0.3);
    opacity: 1;
    margin: 0 min(5px, calc(5 / 1414 * 100vw)) !important;
}

.experience-dots .swiper-pagination-bullet-active {
    background: #006BFF;
}

/* 左右翻页按钮 */
.experience-nav-prev,
.experience-nav-next {
    width: min(40px, calc(40 / 1414 * 100vw));
    height: min(40px, calc(40 / 1414 * 100vw));
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    bottom: min(10px, calc(10 / 1414 * 100vw));
    top: auto !important;
    transform: none !important;
    margin: 0 !important;
}

.experience-nav-prev {
    /* background-image在cdn_assets.html中定义 */
    right: min(50px, calc(50 / 1414 * 100vw));
    left: auto !important;
}

.experience-nav-prev:hover {
    /* background-image在cdn_assets.html中定义 */
}

.experience-nav-next {
    /* background-image在cdn_assets.html中定义 */
    right: 0;
}

.experience-nav-next:hover {
    /* background-image在cdn_assets.html中定义 */
}

/* 隐藏默认的 Swiper 导航按钮样式 */
.experience-nav-prev::after,
.experience-nav-next::after {
    display: none;
}

.dishes-section {
    position: relative;
    padding: min(40px, calc(40 / 1414 * 100vw)) 0 min(80px, calc(80 / 1414 * 100vw));
}

/* Recommended Dishes 左侧背景 */
.dishes-section::before {
    content: '';
    position: absolute;
    left: 0;
    top: min(101px, calc(101 / 1414 * 100vw));
    width: min(502px, calc(502 / 1414 * 100vw));
    height: min(1362px, calc(1362 / 1414 * 100vw));
    /* background在cdn_assets.html中定义 */
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
}

.dishes-hero {
    width: min(980px, calc(980 / 1414 * 100vw));
    margin: 0 auto min(46px, calc(46 / 1414 * 100vw));
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: min(24px, calc(24 / 1414 * 100vw));
    position: relative;
    z-index: 1;
}

.dish-item {
    text-align: center;
}

.dish-item img {
    width: min(220px, calc(220 / 1414 * 100vw));
    height: min(183px, calc(183 / 1414 * 100vw));
    object-fit: cover;
    border-radius: min(8px, calc(8 / 1414 * 100vw));
    box-shadow: 0 min(12px, calc(12 / 1414 * 100vw)) min(30px, calc(30 / 1414 * 100vw)) rgba(0, 0, 0, 0.35);
}

.dish-item span {
    display: block;
    margin-top: min(12px, calc(12 / 1414 * 100vw));
    font-size: min(18px, calc(18 / 1414 * 100vw));
    color: #fff;
}

.dish-features-container {
    width: min(1170px, calc(1170 / 1414 * 100vw));
    margin: 0 auto;
}

/* 5个及以下网格布局 */
.dish-features-grid {
    display: flex;
    justify-content: center;
    gap: min(16px, calc(16 / 1414 * 100vw));
}

/* Swiper容器 */
.dish-feature-swiper {
    width: 100%;
    padding: min(20px, calc(20 / 1414 * 100vw)) 0 min(60px, calc(60 / 1414 * 100vw));
}

.dish-feature-swiper .swiper-slide {
    width: min(195px, calc(195 / 1414 * 100vw)) !important;
    height: min(234px, calc(234 / 1414 * 100vw));
    margin-right: min(16px, calc(16 / 1414 * 100vw)) !important;
}

.dish-feature-item {
    background: rgba(255, 255, 255, 0.06);
    border-radius: min(12px, calc(12 / 1414 * 100vw));
    width: min(195px, calc(195 / 1414 * 100vw));
    height: min(234px, calc(234 / 1414 * 100vw));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

/* 黑色透明蒙版 - 默认显示 */
.dish-feature-item::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
    transition: opacity 0.3s ease;
}

/* 选中时蒙版隐藏 */
.dish-feature-item:hover::before {
    opacity: 0;
}

.dish-feature-item img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.9;
}

/* Swiper分页指示器 */
.dish-feature-dots {
    bottom: min(20px, calc(20 / 1414 * 100vw)) !important;
}

.dish-feature-dots .swiper-pagination-bullet {
    width: min(12px, calc(12 / 1414 * 100vw));
    height: min(12px, calc(12 / 1414 * 100vw));
    background: rgba(255, 255, 255, 0.3);
    opacity: 1;
    margin: 0 min(5px, calc(5 / 1414 * 100vw)) !important;
}

.dish-feature-dots .swiper-pagination-bullet-active {
    background: #006BFF;
}

/* Swiper导航按钮 */
.dish-feature-nav-prev,
.dish-feature-nav-next {
    width: min(40px, calc(40 / 1414 * 100vw));
    height: min(40px, calc(40 / 1414 * 100vw));
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    bottom: min(10px, calc(10 / 1414 * 100vw));
    top: auto !important;
    transform: none !important;
    margin: 0 !important;
}

.dish-feature-nav-prev {
    /* background-image在cdn_assets.html中定义 */
    right: min(50px, calc(50 / 1414 * 100vw));
    left: auto !important;
}

.dish-feature-nav-prev:hover {
    /* background-image在cdn_assets.html中定义 */
}

.dish-feature-nav-next {
    /* background-image在cdn_assets.html中定义 */
    right: 0;
}

.dish-feature-nav-next:hover {
    /* background-image在cdn_assets.html中定义 */
}

.dish-feature-nav-prev::after,
.dish-feature-nav-next::after {
    display: none;
}

.franchise-section {
    position: relative;
    padding: min(40px, calc(40 / 1414 * 100vw)) 0 min(100px, calc(100 / 1414 * 100vw));
}

.franchise-stage {
    position: relative;
    width: min(1189px, calc(1189 / 1414 * 100vw));
    height: min(760px, calc(760 / 1414 * 100vw));
    margin: 0 auto;
}

.franchise-bg {
    position: absolute;
    left: 0;
    top: min(66px, calc(66 / 1414 * 100vw));
    width: min(1189px, calc(1189 / 1414 * 100vw));
    height: min(696px, calc(696 / 1414 * 100vw));
    object-fit: contain;
}

.franchise-node {
    position: absolute;
    width: min(160px, calc(160 / 1414 * 100vw));
    text-align: left;
    color: #fff;
    font-size: min(14px, calc(14 / 1414 * 100vw));
}

.franchise-node .node-title {
    display: block;
    font-size: min(20px, calc(20 / 1414 * 100vw));
    font-weight: 600;
}

.franchise-node .node-desc {
    display: block;
    margin-top: min(6px, calc(6 / 1414 * 100vw));
    color: rgba(255, 255, 255, 0.85);
}

.franchise-node.node-1 { left: min(325px, calc(325 / 1414 * 100vw)); top: min(210px, calc(210 / 1414 * 100vw)); }
.franchise-node.node-2 { left: min(150px, calc(150 / 1414 * 100vw)); top: min(450px, calc(450 / 1414 * 100vw)); }
.franchise-node.node-3 { left: min(350px, calc(350 / 1414 * 100vw)); top: min(725px, calc(725 / 1414 * 100vw)); }
.franchise-node.node-4 { right: min(140px, calc(140 / 1414 * 100vw)); top: min(700px, calc(700 / 1414 * 100vw)); }
.franchise-node.node-5 { right: min(180px, calc(180 / 1414 * 100vw)); top: min(250px, calc(250 / 1414 * 100vw)); text-align: right; }
.franchise-node.node-6 { right: min(00px, calc(00 / 1414 * 100vw)); top: min(80px, calc(80 / 1414 * 100vw)); }

.franchise-keyword {
    position: absolute;
    font-size: min(18px, calc(18 / 1414 * 100vw));
    color: #fff;
    font-weight: 600;
}

.franchise-keyword.keyword-1 { left: min(620px, calc(620 / 1414 * 100vw)); top: min(320px, calc(320 / 1414 * 100vw)); }
.franchise-keyword.keyword-2 { left: min(680px, calc(680 / 1414 * 100vw)); top: min(455px, calc(455 / 1414 * 100vw)); }
.franchise-keyword.keyword-3 { left: min(520px, calc(520 / 1414 * 100vw)); top: min(420px, calc(420 / 1414 * 100vw)); }

.franchise-cta {
    position: absolute;
    left: 50%;
    bottom: min(36px, calc(36 / 1414 * 100vw));
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    border: min(1px, calc(1 / 1414 * 100vw)) solid rgba(255, 255, 255, 0.4);
    padding: min(10px, calc(10 / 1414 * 100vw)) min(22px, calc(22 / 1414 * 100vw));
    border-radius: min(18px, calc(18 / 1414 * 100vw));
    cursor: pointer;
}

/* 确保所有内容在背景之上 */
section {
    position: relative;
    z-index: 10;
}

/* =========================
   联系信息面板 - 位置样式
   ========================= */
/* 注意: 基础样式已在 contact-panel.css 中定义，此处只保留位置相关样式 */

/* 机器人图标触发器位置 */
.robotics-page .robot-icon-trigger {
    position: absolute;
    top: min(689px, calc(689 / 1414 * 100vw));
    right: min(111px, calc(111 / 1414 * 100vw));
}

/* 联系信息面板位置 */
.robotics-page .contact-panel {
    position: absolute;
    top: min(760px, calc(760 / 1414 * 100vw));
    left: 50%;
    transform: translateX(-50%);
}

/* 初始状态为显示（active） */
.robotics-page .contact-panel.active {
    transform: translateX(-50%) translateY(0);
}