/* ===== hypercoil5.blade.php 内联块 #1 ===== */
/* 3D模型上下浮动动画 */
        @keyframes float-up-down {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-20px);
            }
        }

        .hypercoil-series-page {
            background: #000;
            margin: 0;
            padding: 0;
            font-family: Arial, 'Helvetica Neue', sans-serif;
        }

        .series-section {
            width: 100%;
            position: relative;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: clamp(160px, 12vh, 230px) 0 clamp(40px, 4vh, 60px) 0;
            box-sizing: border-box;
        }

        .series-section.c-series {
            padding-bottom: 0;
        }

        .series-section.m-series {
            padding-top: 0;
        }

        /* Logo 样式 - 使用相对单位 */

        .image-container .series-logo {
            position: absolute;
            top: clamp(20px, 1.4vh, 40px);
            left: clamp(20px, 1.4vw, 36px);
            width: clamp(110px, 7vw, 160px);
            height: auto;
            object-fit: contain;
            z-index: 15;
        }

        /* 图片容器 */
        .image-container {
            width: 100%;
            position: relative;
            margin-bottom: 0;
        }

        .image-container > img:not(.series-logo) {
            width: 100%;
            height: auto;
            display: block;
            object-fit: cover;
        }

        /* 文字覆盖层 */
        .text-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            pointer-events: none;
        }

        /* 陶瓷心01 - HYPERCOIL C SERIES */
        .ceramic-01 {
            position: relative;
        }

        .ceramic-01 .text-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 1;
            pointer-events: none;
            margin-top: -8vh;
        }

        .ceramic-01 .main-title {
            font-size: clamp(140px, 20vw, 700px);
            font-weight: 900;
            color: #8AB4FF;
            line-height: 0.9;
            text-transform: uppercase;
            letter-spacing: clamp(-3px, -0.4vw, -8px);
            text-align: center;
            margin: 0;
            font-family: Impact, 'Arial Black', sans-serif;
            max-width: min(92vw, 1900px);
        }

        .ceramic-01 .main-title .c-letter {
            color: #FF7B7B;
        }

        .ceramic-01 img:not(.series-logo) {
            position: relative;
            z-index: 10;
            animation: float-up-down 4s ease-in-out infinite;
            margin-top: -16vh;
        }

        .ceramic-01 img.series-logo {
            position: absolute;
            z-index: 15;
        }

        .ceramic-01 .bottom-text {
            position: absolute;
            bottom: clamp(80px, 10vh, 120px);
            left: 0;
            right: 0;
            z-index: 20;
            text-align: center;
            padding: 0 clamp(20px, 3vw, 60px);
        }

        .ceramic-01 .bottom-text p {
            font-size: clamp(14px, 1.05vw, 20px);
            color: #ffffff;
            line-height: 1.6;
            letter-spacing: 0.5px;
            margin: 0;
            max-width: 1600px;
            margin: 0 auto;
        }

        /* 陶瓷心02 - PURE FLAVOR · EVEN HEATING */
        .ceramic-02 {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .ceramic-02 img:not(.series-logo) {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

        .ceramic-02 .text-overlay {
            justify-content: flex-start;
            padding-top: clamp(100px, 12vh, 150px);
        }

        .ceramic-02 .main-title {
            font-size: clamp(32px, 4.7vw, 90px);
            font-weight: 900;
            color: #fff;
            line-height: 1.1;
            text-transform: uppercase;
            letter-spacing: clamp(3px, 0.4vw, 8px);
            text-align: center;
            margin-bottom: clamp(24px, 3vh, 40px);
        }

        .ceramic-02 .description {
            font-size: clamp(14px, 1.05vw, 20px);
            color: #fff;
            line-height: 1.8;
            text-align: center;
            max-width: clamp(600px, 80vw, 1500px);
            letter-spacing: clamp(0.6px, 0.06vw, 1.2px);
            padding: 0 20px;
        }




        /* 陶瓷心03 - FINER ATOMIZATION */
        .ceramic-03 {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            padding: clamp(40px, 6vh, 90px) clamp(36px, 4.6vw, 120px);
            box-sizing: border-box;
            overflow: hidden;
        }

        .ceramic-03::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.4) 85%, rgba(0, 0, 0, 0.6) 100%);
            z-index: 1;
            pointer-events: none;
        }

        .ceramic-03 .background-video {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: left center;
            z-index: 0;
        }

        .ceramic-03 .text-overlay {
            position: relative;
            z-index: 2;
            width: auto;
            height: auto;
            padding: clamp(10px, 1.2vw, 28px) 0;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            box-sizing: border-box;
            max-width: clamp(620px, 40vw, 860px);
            margin-left: clamp(28px, 4.2vw, 110px);
            margin-right: clamp(28px, 4.2vw, 120px);
            margin-top: clamp(12px, 2vh, 36px);
            margin-bottom: clamp(12px, 2vh, 36px);
        }

        .ceramic-03 .text-overlay .text-box {
            margin: 0;
            max-width: 100%;
            text-align: left;
            padding-right: 0;
        }

        /* 陶瓷心04 - 文字居中 */
        .ceramic-04 {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .ceramic-04 video {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .ceramic-04 .text-overlay {
            position: relative;
            z-index: 2;
            justify-content: center;
            align-items: center;
            padding: 0 clamp(32px, 5vw, 80px);
            box-sizing: border-box;
        }

        .ceramic-04 .text-overlay .text-box {
            max-width: clamp(600px, 50vw, 900px);
            text-align: center;
            margin: 0 auto;
        }

        /* 陶瓷心05 - 文字右侧 */
        .ceramic-05 video,

        .ceramic-05 .text-overlay {
            justify-content: center;
            align-items: center;
            padding: 0 8%;
            box-sizing: border-box;
        }

        .ceramic-05 .text-overlay .text-box {
            margin-left: auto;
            margin-right: 12%;
            max-width: 560px;
            text-align: left;
        }

        .ceramic-05 {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .ceramic-05 video {
            object-fit: cover;
        }


        .ceramic-03 .main-title,
        .ceramic-04 .main-title,
        .ceramic-05 .main-title {
            font-size: clamp(34px, 4.4vw, 78px);
            font-weight: 900;
            color: #ffffff;
            line-height: 1.05;
            text-transform: uppercase;
            letter-spacing: clamp(1px, 0.15vw, 2px);
            text-align: left;
            margin-bottom: clamp(16px, 2vh, 24px);
            font-family: 'Arial Black', Impact, sans-serif;
            word-break: keep-all;
            overflow-wrap: normal;
        }

        .ceramic-04 .main-title {
            text-align: center;
        }

        .ceramic-03 .description,
        .ceramic-04 .description,
        .ceramic-05 .description {
            font-size: clamp(11px, 0.85vw, 16px);
            color: #ffffff;
            line-height: 1.55;
            text-align: left;
            letter-spacing: clamp(0.6px, 0.08vw, 1.2px);
            text-transform: uppercase;
            word-wrap: break-word;
            overflow-wrap: break-word;
        }

        .ceramic-04 .description {
            line-height: 1.6;
            text-align: center;
        }

        .ceramic-05 .description {
            line-height: 1.6;
        }

        /* 视频悬停热区 */
        .video-hover-area {
            position: absolute;
            /* 根据视频中物体的位置调整，这里设置在视频中心偏左的位置 */
            left: 15%;
            top: 50%;
            transform: translateY(-50%);
            width: clamp(200px, 25vw, 400px);
            height: clamp(300px, 40vh, 500px);
            z-index: 5;
            /* 调试时可以添加边框查看位置 */
            /* border: 2px dashed rgba(255, 0, 0, 0.5); */
            cursor: pointer;
            pointer-events: auto;
        }

        /* 网芯01 - HYPERCOIL M SERIES */
        .mesh-01 {
            position: relative;
        }

        .mesh-01 .text-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 1;
            pointer-events: none;
            margin-top: -8vh;
        }

        .mesh-01 .main-title {
            font-size: clamp(140px, 20vw, 700px);
            font-weight: 900;
            color: #8AB4FF;
            line-height: 0.9;
            text-transform: uppercase;
            letter-spacing: clamp(-3px, -0.4vw, -8px);
            text-align: center;
            margin: 0;
            font-family: Impact, 'Arial Black', sans-serif;
            max-width: min(92vw, 1900px);
        }

        .mesh-01 .main-title .m-letter {
            color: #FFE600;
        }

        .mesh-01 img:not(.series-logo) {
            position: relative;
            z-index: 10;
            animation: float-up-down 4s ease-in-out infinite;
            margin-top: -16vh;
        }

        /* 网芯02 - FASTER, DEEPER HEAT-UP */
        .mesh-02 {
            position: relative;
            min-height: 100vh;
        }

        .mesh-02 img:not(.series-logo),
        .mesh-02 video {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
            transform: scale(1.5);
        }

        .mesh-02 .text-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            padding: 0 clamp(20px, 5vw, 80px);
            box-sizing: border-box;
            pointer-events: none;
        }

        .mesh-02 .text-overlay .text-box {
            max-width: clamp(400px, 40vw, 800px);
            margin-right: clamp(20px, 3vw, 60px);
        }

        .mesh-02 .main-title {
            font-size: clamp(44px, 5.2vw, 120px);
            font-weight: 900;
            color: #FFE600;
            line-height: 0.95;
            text-transform: uppercase;
            letter-spacing: clamp(1.5px, 0.2vw, 4px);
            text-align: left;
            margin-bottom: clamp(24px, 2.5vh, 48px);
        }

        .mesh-02 .description {
            font-size: clamp(16px, 1.15vw, 24px);
            color: #fff;
            line-height: 1.65;
            text-align: left;
            letter-spacing: clamp(0.6px, 0.06vw, 1.4px);
        }

        @media (min-width: 1440px) {
            .mesh-02 {
                display: grid;
                grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
                align-items: center;
                gap: clamp(64px, 6vw, 140px);
                padding: clamp(160px, 14vh, 240px) clamp(120px, 8vw, 220px);
                min-height: auto;
            }

            .mesh-02 img:not(.series-logo),
            .mesh-02 video {
                position: static;
                width: 100%;
                height: auto;
                max-width: clamp(520px, 52vw, 820px);
                max-height: clamp(480px, 60vh, 780px);
                object-fit: contain;
                justify-self: stretch;
            }

            .mesh-02 .text-overlay {
                position: static;
                width: auto;
                height: auto;
                padding: 0;
                align-items: flex-start;
                justify-content: center;
                pointer-events: auto;
                display: flex;
                flex-direction: column;
                gap: clamp(24px, 2vh, 40px);
            }

            .mesh-02 .text-overlay .text-box {
                margin-right: 0;
                max-width: clamp(420px, 32vw, 580px);
            }

            .mesh-04 {
                display: grid;
                grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.95fr);
                align-items: center;
                gap: clamp(60px, 5vw, 140px);
                padding: clamp(160px, 14vh, 240px) clamp(110px, 7vw, 200px);
                min-height: auto;
            }

            .mesh-04 img:not(.series-logo) {
                position: static;
                width: 100%;
                height: auto;
                object-fit: contain;
                justify-self: stretch;
            }

            .mesh-04 .text-overlay {
                position: static;
                width: auto;
                height: auto;
                padding: 0;
                align-items: flex-start;
                justify-content: center;
                pointer-events: auto;
                display: flex;
                flex-direction: column;
                gap: clamp(20px, 2vh, 36px);
            }

            .mesh-04 .text-overlay .text-box {
                margin: 0 0 0 clamp(200px, 8vw, 320px);
                padding-left: 0;
                max-width: clamp(420px, 32vw, 600px);
                display: flex;
                flex-direction: column;
                gap: clamp(24px, 2vh, 40px);
            }

            .mesh-04 .main-title {
                font-size: clamp(60px, 4.6vw, 120px);
                line-height: 0.9;
                margin: 0;
            }

            .mesh-04 .description {
                font-size: clamp(18px, 1.15vw, 26px);
                line-height: 1.65;
                letter-spacing: clamp(0.4px, 0.04vw, 1.2px);
            }

            .mesh-05 {
                display: grid;
                grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
                align-items: center;
                gap: clamp(60px, 5vw, 140px);
                padding: clamp(160px, 14vh, 240px) clamp(110px, 7vw, 200px);
                min-height: auto;
            }

            .mesh-05 img:not(.series-logo) {
                position: static;
                width: 100%;
                height: auto;
                object-fit: contain;
                justify-self: stretch;
                grid-column: 2;
            }

            .mesh-05 .text-overlay {
                position: static;
                width: auto;
                height: auto;
                padding: 0;
                align-items: flex-start;
                justify-content: center;
                pointer-events: auto;
                display: flex;
                flex-direction: column;
                gap: clamp(20px, 2vh, 36px);
                grid-column: 1;
            }

            .mesh-05 .text-overlay .text-box {
                margin: 0;
                padding-right: clamp(12px, 1vw, 24px);
                max-width: clamp(440px, 34vw, 640px);
                display: flex;
                flex-direction: column;
                gap: clamp(24px, 2vh, 40px);
            }

            .mesh-05 .main-title {
                font-size: clamp(60px, 4.8vw, 120px);
                line-height: 0.9;
                margin: 0;
            }

            .mesh-05 .description {
                font-size: clamp(18px, 1.2vw, 26px);
                line-height: 1.65;
                letter-spacing: clamp(0.4px, 0.04vw, 1.2px);
            }
        }

        /* 网芯03 - STEADY SMOOTHNESS */
        .mesh-03 {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .mesh-03 img:not(.series-logo) {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .mesh-03 .text-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-start;
            pointer-events: none;
            padding: clamp(36px, 6vh, 100px) clamp(20px, 3vw, 60px) 0;
            gap: clamp(14px, 2vh, 28px);
            box-sizing: border-box;
        }

        .mesh-03 .main-title {
            font-size: clamp(32px, 4.5vw, 86px);
            font-weight: 900;
            color: #242936;
            line-height: 1;
            text-transform: uppercase;
            letter-spacing: clamp(1px, 0.15vw, 3px);
            text-align: center;
            font-family: Impact, 'Arial Black', sans-serif;
            margin-bottom: 0;
        }

        .mesh-03 .description {
            font-size: clamp(12px, 1.15vw, 22px);
            color: #242936;
            line-height: 1.5;
            text-align: center;
            max-width: clamp(320px, 75vw, 1200px);
            letter-spacing: clamp(0.4px, 0.05vw, 1px);
            padding: 0 20px;
        }

        /* 网芯04 - MESH HEATING SYSTEM */
        .mesh-04 {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
        }

        .mesh-04 img:not(.series-logo) {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .mesh-04 .text-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: flex-end;
            padding: clamp(40px, 6vh, 120px) clamp(60px, 6vw, 140px) clamp(40px, 4vh, 80px) clamp(24px, 3vw, 80px);
            gap: clamp(16px, 2vh, 32px);
            pointer-events: none;
            box-sizing: border-box;
        }

        .mesh-04 .text-overlay .text-box {
            display: flex;
            flex-direction: column;
            gap: clamp(18px, 2vh, 32px);
            max-width: clamp(380px, 35vw, 670px);
            text-align: left;
            margin: 0 0 0 clamp(40px, 4vw, 80px);
        }

        .mesh-04 .main-title {
            font-size: clamp(34px, 5.8vw, 112px);
            font-weight: 900;
            color: #FFE600;
            line-height: 1.1;
            text-transform: uppercase;
            letter-spacing: clamp(2px, 0.15vw, 3px);
            margin: 0 0 clamp(24px, 3vh, 42px) 0;
            font-family: Impact, 'Arial Black', sans-serif;
        }

        .mesh-04 .description {
            font-size: clamp(13px, 0.95vw, 18px);
            color: #FFFFFF;
            line-height: 1.65;
            letter-spacing: clamp(0.3px, 0.025vw, 0.5px);
            text-transform: uppercase;
        }

        /* 网芯05 - MESH HEATING SYSTEM */
        .mesh-05 {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
        }

        .mesh-05 img:not(.series-logo),
        .mesh-05 video {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .mesh-05 .text-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: flex-start;
            padding: clamp(40px, 6vh, 120px) clamp(32px, 3.5vw, 80px) clamp(40px, 5vh, 100px) clamp(56px, 6vw, 140px);
            gap: clamp(16px, 2vh, 32px);
            pointer-events: none;
            box-sizing: border-box;
        }

        .mesh-05 .text-overlay .text-box {
            display: flex;
            flex-direction: column;
            gap: clamp(18px, 2vh, 32px);
            max-width: clamp(400px, 50vw, 950px);
            text-align: left;
            margin-left: 0;
        }

        .mesh-05 .main-title {
            font-size: clamp(32px, 4.9vw, 94px);
            font-weight: 900;
            color: #FFE600;
            line-height: 1.1;
            text-transform: uppercase;
            letter-spacing: clamp(2px, 0.15vw, 3px);
            margin: 0 0 clamp(24px, 3vh, 42px) 0;
            font-family: Impact, 'Arial Black', sans-serif;
        }

        .mesh-05 .description {
            font-size: clamp(13px, 0.85vw, 16px);
            color: #FFFFFF;
            line-height: 1.65;
            letter-spacing: clamp(0.3px, 0.025vw, 0.5px);
            text-transform: uppercase;
        }

        /* 响应式设计 - 优化版本 */

        /* 超大屏幕 (1920px+) */
        @media (min-width: 1920px) {
            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(240px, 20vw, 800px);
                letter-spacing: clamp(-5px, -0.35vw, -12px);
            }
        }

        /* 大屏幕到中等屏幕 (1280px - 1919px) */
        @media (max-width: 1919px) and (min-width: 1280px) {
            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(180px, 20vw, 400px);
                letter-spacing: clamp(-3px, -0.4vw, -8px);
            }
        }

        /* 中等屏幕 (1024px - 1279px) */
        @media (max-width: 1279px) and (min-width: 1024px) {
            .series-section {
                padding: clamp(180px, 20vh, 220px) 0 60px 0;
            }


            .image-container .series-logo {
                width: clamp(140px, 15vw, 180px);
                top: 18px;
                left: 18px;
            }

            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(140px, 16vw, 260px);
                letter-spacing: clamp(-3px, -0.28vw, -8px);
            }

            .ceramic-02 .main-title {
                font-size: clamp(60px, 6vw, 75px);
                letter-spacing: 6px;
            }

            .ceramic-02 .description {
                font-size: clamp(16px, 1.6vw, 18px);
            }

            .ceramic-03 .main-title,
            .ceramic-04 .main-title,
            .ceramic-05 .main-title {
                font-size: clamp(70px, 7vw, 90px);
            }

            .mesh-02 .main-title,
            .mesh-04 .main-title,
            .mesh-05 .main-title {
                font-size: clamp(65px, 6.5vw, 85px);
            }
        }

        @media (max-width: 1279px) {
            .ceramic-03 {
                justify-content: center;
                padding: clamp(60px, 10vh, 150px) clamp(32px, 5.5vw, 110px);
            }

            .ceramic-03::before {
                background: linear-gradient(90deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.35) 45%, rgba(0, 0, 0, 0.7) 80%, rgba(0, 0, 0, 0.9) 100%);
            }

            .ceramic-03 .text-overlay {
                max-width: clamp(520px, 72vw, 720px);
                justify-content: center;
                margin: clamp(16px, 3.2vh, 44px) auto;
                padding: 0 clamp(14px, 2.8vw, 32px);
            }

            .ceramic-03 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                padding-right: 0;
            }
        }

        /* 平板设备 (768px - 1023px) */
        @media (max-width: 1023px) and (min-width: 768px) {
            .series-section {
                padding: clamp(160px, 18vh, 190px) 0 50px 0;
            }


            .series-section.c-series {
                padding-bottom: 0;
            }

            .series-section.m-series {
                padding-top: 0;
            }

            .image-container .series-logo {
                width: clamp(120px, 14vw, 150px);
                top: 16px;
                left: 16px;
            }

            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(110px, 19vw, 220px);
                letter-spacing: clamp(-3px, -0.32vw, -6px);
            }

            .ceramic-02 .main-title {
                font-size: clamp(40px, 5vw, 55px);
                letter-spacing: clamp(3px, 0.5vw, 5px);
            }

            .ceramic-02 .description {
                font-size: clamp(14px, 1.8vw, 17px);
                padding: 0 30px;
            }


            .ceramic-03 .main-title,
            .ceramic-04 .main-title,
            .ceramic-05 .main-title {
                font-size: clamp(50px, 6vw, 70px);
                letter-spacing: clamp(1.5px, 0.2vw, 2px);
            }

            .ceramic-03 .description,
            .ceramic-04 .description,
            .ceramic-05 .description {
                font-size: clamp(16px, 2vw, 20px);
            }

            .ceramic-03 .text-overlay {
                padding: 0 clamp(20px, 4vw, 50px);
                max-width: 88%;
            }

            .ceramic-03 .text-overlay .text-box {
                padding-right: 0;
            }

            .ceramic-04 .text-overlay,
            .ceramic-05 .text-overlay {
                padding: 0 5%;
            }

            .mesh-02 .main-title {
                font-size: clamp(50px, 6vw, 70px);
                left: auto;
                right: 8%;
                top: 30%;
            }

            .mesh-02 .description {
                font-size: clamp(14px, 1.8vw, 17px);
                left: auto;
                right: 8%;
                top: 50%;
                max-width: 45%;
            }

            .mesh-03 .text-overlay {
                padding-top: clamp(12%, 15vh, 18%);
                gap: clamp(20px, 3vh, 30px);
            }

            .mesh-03 .main-title {
                font-size: clamp(70px, 8vw, 90px);
                letter-spacing: 3px;
            }

            .mesh-03 .description {
                font-size: clamp(18px, 2.2vw, 24px);
                line-height: 1.55;
                max-width: 85%;
            }

            .mesh-04 .text-overlay {
                padding: 0 6%;
            }

            .mesh-04 .text-overlay .text-box {
                max-width: 500px;
                margin-right: 3%;
            }

            .mesh-04 .main-title {
                font-size: clamp(70px, 8vw, 100px);
                margin-bottom: 24px;
            }

            .mesh-04 .description {
                font-size: clamp(16px, 2vw, 20px);
                line-height: 1.6;
            }

            .mesh-05 .text-overlay .text-box {
                margin-left: 6%;
                max-width: 550px;
            }

            .mesh-05 .main-title {
                font-size: clamp(60px, 7vw, 85px);
            }

            .mesh-05 .description {
                font-size: clamp(14px, 1.8vw, 17px);
            }
        }

        /* 小平板和大手机 (600px - 767px) */
        @media (max-width: 767px) and (min-width: 600px) {
            .series-section {
                padding: clamp(140px, 16vh, 170px) 0 40px 0;
            }


            .series-section.c-series {
                padding-bottom: 0;
            }

            .series-section.m-series {
                padding-top: 0;
            }

            .image-container .series-logo {
                width: clamp(100px, 13vw, 120px);
                top: 12px;
                left: 12px;
            }

            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(90px, 22vw, 180px);
                letter-spacing: clamp(-2px, -0.3vw, -5px);
            }

            .ceramic-02 .main-title {
                font-size: clamp(28px, 4.5vw, 36px);
                letter-spacing: clamp(2px, 0.4vw, 3px);
            }

            .ceramic-02 .description {
                font-size: clamp(13px, 2vw, 15px);
                padding: 0 24px;
            }



            .ceramic-03 .main-title,
            .ceramic-04 .main-title,
            .ceramic-05 .main-title {
                font-size: clamp(28px, 5vw, 38px);
                letter-spacing: 1.5px;
            }

            .ceramic-03 .text-overlay,
            .ceramic-04 .text-overlay,
            .ceramic-05 .text-overlay {
                padding: 0 clamp(24px, 5vw, 40px);
                max-width: 92%;
            }

            .ceramic-03 .text-overlay .text-box,
            .ceramic-04 .text-overlay .text-box,
            .ceramic-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                padding-right: 0;
            }

            .ceramic-03 .main-title,
            .ceramic-03 .description,
            .ceramic-04 .main-title,
            .ceramic-04 .description,
            .ceramic-05 .main-title,
            .ceramic-05 .description {
                text-align: center;
            }

            .ceramic-03 .description,
            .ceramic-04 .description,
            .ceramic-05 .description {
                font-size: clamp(13px, 2vw, 15px);
                line-height: 1.55;
            }

            .mesh-02 .main-title {
                font-size: clamp(28px, 5vw, 38px);
                left: 24px;
                right: 24px;
                text-align: center;
                top: 28%;
            }

            .mesh-02 .description {
                font-size: clamp(13px, 2vw, 15px);
                left: 24px;
                right: 24px;
                text-align: center;
                top: 42%;
                max-width: none;
            }

            .mesh-03 .text-overlay {
                padding-top: clamp(18%, 20vh, 25%);
                gap: clamp(18px, 3vh, 24px);
            }

            .mesh-03 .main-title {
                font-size: clamp(42px, 7vw, 56px);
                letter-spacing: 2px;
            }

            .mesh-03 .description {
                font-size: clamp(15px, 2.4vw, 19px);
                line-height: 1.5;
                max-width: 90%;
            }

            .mesh-04 .text-overlay {
                padding: 0 28px;
                padding-top: 24%;
                justify-content: flex-start;
            }

            .mesh-04 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 100%;
            }

            .mesh-04 .main-title {
                font-size: clamp(46px, 7.5vw, 62px);
                margin-bottom: 16px;
            }

            .mesh-04 .description {
                font-size: clamp(15px, 2.4vw, 19px);
                line-height: 1.5;
            }

            .mesh-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 90%;
            }

            .mesh-05 .main-title {
                font-size: clamp(36px, 6vw, 48px);
            }

            .mesh-05 .description {
                font-size: clamp(13px, 2vw, 15px);
                text-align: center;
            }
        }

        /* 手机竖屏 (480px - 599px) */
        @media (max-width: 599px) and (min-width: 480px) {
            .series-section {
                padding: clamp(150px, 17vh, 170px) 0 40px 0;
            }


            .series-section.c-series {
                padding-bottom: 0;
            }

            .series-section.m-series {
                padding-top: 0;
            }

            .image-container .series-logo {
                width: clamp(90px, 12vw, 110px);
                top: 11px;
                left: 11px;
            }

            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(80px, 22vw, 160px);
                letter-spacing: clamp(-2px, -0.28vw, -5px);
            }

            .ceramic-02 .main-title {
                font-size: clamp(26px, 4vw, 32px);
                letter-spacing: clamp(2px, 0.3vw, 2.5px);
            }

            .ceramic-03 .main-title,
            .ceramic-04 .main-title,
            .ceramic-05 .main-title,
            .mesh-02 .main-title,
            .mesh-04 .main-title,
            .mesh-05 .main-title {
                font-size: clamp(26px, 4.5vw, 32px);
                letter-spacing: 1.5px;
            }

            .ceramic-03 .text-overlay,
            .ceramic-04 .text-overlay,
            .ceramic-05 .text-overlay {
                padding: 0 24px;
            }

            .ceramic-03 .text-overlay .text-box,
            .ceramic-04 .text-overlay .text-box,
            .ceramic-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
            }

            .ceramic-03 .main-title,
            .ceramic-03 .description,
            .ceramic-04 .main-title,
            .ceramic-04 .description,
            .ceramic-05 .main-title,
            .ceramic-05 .description {
                text-align: center;
            }

            .ceramic-02 .description,
            .ceramic-03 .description,
            .ceramic-04 .description,
            .ceramic-05 .description,
            .mesh-02 .description,
            .mesh-03 .description,
            .mesh-04 .description,
            .mesh-05 .description {
                font-size: clamp(12px, 1.8vw, 14px);
                padding: 0 20px;
            }



            .mesh-02 .main-title,
            .mesh-02 .description {
                right: 20px;
                left: 20px;
                text-align: center;
            }

            .mesh-02 .main-title {
                top: 26%;
            }

            .mesh-02 .description {
                top: 44%;
            }

            .mesh-03 .text-overlay {
                padding-top: clamp(20%, 22vh, 26%);
                gap: clamp(16px, 2.5vh, 22px);
            }

            .mesh-03 .main-title {
                font-size: clamp(38px, 6vw, 50px);
                letter-spacing: 2px;
            }

            .mesh-03 .description {
                font-size: clamp(14px, 2.2vw, 17px);
                line-height: 1.5;
                max-width: 92%;
                letter-spacing: 0.8px;
            }

            .mesh-04 .text-overlay {
                padding: 0 24px;
                justify-content: flex-start;
                padding-top: 28%;
            }

            .mesh-04 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 100%;
            }

            .mesh-04 .main-title {
                font-size: clamp(42px, 7vw, 56px);
                margin-bottom: 14px;
            }

            .mesh-04 .description {
                font-size: clamp(14px, 2.2vw, 17px);
                line-height: 1.5;
            }

            .mesh-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 92%;
            }

            .mesh-05 .main-title {
                font-size: clamp(28px, 5vw, 36px);
            }

            .mesh-05 .description {
                font-size: clamp(12px, 1.8vw, 14px);
                text-align: center;
            }
        }

        /* 小屏手机 (360px - 479px) */
        @media (max-width: 479px) and (min-width: 360px) {
            .series-section {
                padding: clamp(135px, 16vh, 160px) 0 35px 0;
            }


            .series-section.c-series {
                padding-bottom: 0;
            }

            .series-section.m-series {
                padding-top: 0;
            }

            .image-container .series-logo {
                width: clamp(80px, 11vw, 100px);
                top: 10px;
                left: 10px;
            }

            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(72px, 24vw, 140px);
                letter-spacing: clamp(-2px, -0.3vw, -4px);
            }

            .ceramic-02 .main-title {
                font-size: clamp(20px, 3.5vw, 24px);
                letter-spacing: clamp(1.5px, 0.3vw, 2px);
            }

            .ceramic-03 .main-title,
            .ceramic-04 .main-title,
            .ceramic-05 .main-title,
            .mesh-02 .main-title,
            .mesh-04 .main-title,
            .mesh-05 .main-title {
                font-size: clamp(20px, 3.8vw, 24px);
                letter-spacing: 1px;
            }

            .ceramic-03 .text-overlay,
            .ceramic-04 .text-overlay,
            .ceramic-05 .text-overlay {
                padding: 0 16px;
            }

            .ceramic-03 .text-overlay .text-box,
            .ceramic-04 .text-overlay .text-box,
            .ceramic-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
            }

            .ceramic-03 .main-title,
            .ceramic-03 .description,
            .ceramic-04 .main-title,
            .ceramic-04 .description,
            .ceramic-05 .main-title,
            .ceramic-05 .description {
                text-align: center;
            }

            .ceramic-02 .description,
            .ceramic-03 .description,
            .ceramic-04 .description,
            .ceramic-05 .description,
            .mesh-02 .description,
            .mesh-03 .description,
            .mesh-04 .description,
            .mesh-05 .description {
                font-size: clamp(11px, 1.6vw, 12px);
                padding: 0 16px;
            }



            .mesh-02 .main-title,
            .mesh-02 .description {
                left: 16px;
                right: 16px;
                text-align: center;
            }

            .mesh-02 .main-title {
                top: 26%;
            }

            .mesh-02 .description {
                top: 44%;
            }

            .mesh-03 .text-overlay {
                padding-top: clamp(28%, 32vh, 36%);
                gap: clamp(14px, 2vh, 16px);
            }

            .mesh-03 .main-title {
                font-size: clamp(26px, 4.5vw, 32px);
                letter-spacing: 1px;
            }

            .mesh-03 .description {
                font-size: clamp(11px, 1.6vw, 12px);
                line-height: 1.45;
                max-width: 94%;
                letter-spacing: 0.4px;
            }

            .mesh-04 .text-overlay {
                padding: 0 16px;
                padding-top: clamp(35%, 38vh, 42%);
                justify-content: flex-start;
            }

            .mesh-04 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 100%;
            }

            .mesh-04 .main-title {
                font-size: clamp(30px, 5.5vw, 36px);
                margin-bottom: clamp(10px, 1.5vh, 12px);
            }

            .mesh-04 .description {
                font-size: clamp(11px, 1.6vw, 12px);
                line-height: 1.45;
                letter-spacing: 0.4px;
            }

            .mesh-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 94%;
            }

            .mesh-05 .main-title {
                font-size: clamp(24px, 4.2vw, 30px);
            }

            .mesh-05 .description {
                font-size: clamp(11px, 1.6vw, 12px);
                text-align: center;
            }
        }

        /* 超小屏手机 (<360px) */
        @media (max-width: 359px) {
            .series-section {
                padding: 120px 0 30px 0;
            }


            .series-section.c-series {
                padding-bottom: 0;
            }

            .series-section.m-series {
                padding-top: 0;
            }

            .image-container .series-logo {
                width: 75px;
                top: 8px;
                left: 8px;
            }

            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(60px, 24vw, 120px);
                letter-spacing: clamp(-2px, -0.32vw, -3px);
            }

            .ceramic-02 .main-title {
                font-size: 18px;
                letter-spacing: 1px;
            }

            .ceramic-03 .main-title,
            .ceramic-04 .main-title,
            .ceramic-05 .main-title,
            .mesh-02 .main-title,
            .mesh-04 .main-title,
            .mesh-05 .main-title {
                font-size: 18px;
                letter-spacing: 0.8px;
            }

            .ceramic-03 .text-overlay,
            .ceramic-04 .text-overlay,
            .ceramic-05 .text-overlay {
                padding: 0 12px;
            }

            .ceramic-03 .text-overlay .text-box,
            .ceramic-04 .text-overlay .text-box,
            .ceramic-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
            }

            .ceramic-03 .main-title,
            .ceramic-03 .description,
            .ceramic-04 .main-title,
            .ceramic-04 .description,
            .ceramic-05 .main-title,
            .ceramic-05 .description {
                text-align: center;
            }

            .ceramic-02 .description,
            .ceramic-03 .description,
            .ceramic-04 .description,
            .ceramic-05 .description,
            .mesh-02 .description,
            .mesh-03 .description,
            .mesh-04 .description,
            .mesh-05 .description {
                font-size: 10px;
                padding: 0 12px;
            }



            .mesh-02 .main-title,
            .mesh-02 .description {
                left: 12px;
                right: 12px;
                text-align: center;
            }

            .mesh-02 .main-title {
                top: 26%;
            }

            .mesh-02 .description {
                top: 44%;
            }

            .mesh-03 .text-overlay {
                padding-top: 32%;
                gap: 12px;
            }

            .mesh-03 .main-title {
                font-size: 24px;
                letter-spacing: 0.8px;
            }

            .mesh-03 .description {
                font-size: 10px;
                line-height: 1.4;
                max-width: 95%;
                letter-spacing: 0.3px;
            }

            .mesh-04 .text-overlay {
                padding: 0 12px;
                padding-top: 36%;
                justify-content: flex-start;
            }

            .mesh-04 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 100%;
            }

            .mesh-04 .main-title {
                font-size: 28px;
                margin-bottom: 10px;
            }

            .mesh-04 .description {
                font-size: 10px;
                line-height: 1.4;
                letter-spacing: 0.3px;
            }

            .mesh-05 .text-overlay .text-box {
                margin: 0 auto;
                text-align: center;
                max-width: 95%;
            }

            .mesh-05 .main-title {
                font-size: 22px;
            }

            .mesh-05 .description {
                font-size: 10px;
                text-align: center;
            }
        }

        /* 横屏模式优化 */
        @media (max-height: 600px) and (orientation: landscape) {
            .series-section {
                padding: clamp(100px, 12vh, 140px) 0 30px 0;
                min-height: auto;
            }


            .image-container .series-logo {
                width: clamp(80px, 10vw, 120px);
                top: 12px;
            }

            .ceramic-01 .main-title,
            .mesh-01 .main-title {
                font-size: clamp(140px, 18vw, 260px);
            }

            .ceramic-02 .main-title {
                font-size: clamp(28px, 4vw, 48px);
            }

            .ceramic-02 .description {
                font-size: clamp(12px, 1.4vw, 16px);
            }

            .ceramic-03 .main-title,
            .ceramic-04 .main-title,
            .ceramic-05 .main-title,
            .mesh-02 .main-title,
            .mesh-04 .main-title,
            .mesh-05 .main-title {
                font-size: clamp(28px, 4vw, 50px);
            }

            .ceramic-03 .description,
            .ceramic-04 .description,
            .ceramic-05 .description,
            .mesh-02 .description,
            .mesh-03 .description,
            .mesh-04 .description,
            .mesh-05 .description {
                font-size: clamp(12px, 1.4vw, 16px);
            }

            .mesh-03 .text-overlay {
                padding-top: 8%;
                gap: 16px;
            }

            .mesh-04 .text-overlay {
                padding-top: 12%;
            }

            .ceramic-02,
            .ceramic-03,
            .ceramic-04,
            .ceramic-05,
            .mesh-02,
            .mesh-03,
            .mesh-04,
            .mesh-05 {
                min-height: 100vh;
            }
        }

/* ===== hypercoil5.blade.php 内联块 #2 ===== */
.ceramic-02 {
        min-height: 110vh; /* 容器高度为1.1倍视口高度 */
    }

    .sequence-canvas {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        z-index: 0;
        background-color: #000;
        background-image: url('https://static.airtekvape.com/storage/frame_0001.jpg');
        background-size: cover;
        background-position: center;
    }

    .ceramic-02 .series-logo {
        z-index: 10;
    }

    .ceramic-02 .text-overlay {
        z-index: 10;
    }