#section1 {
    position: relative;
    width: 100%;
    aspect-ratio: 1920 / 980;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
#section1 .container {
    height: 100%;position: relative;
    display: flex;flex-direction: column;align-items: start;justify-content: center;
}
.section1_text { padding: 1rem;position: relative;z-index: 2; }
.product_title {
    font-size: 3rem;
    font-weight: 900;
    color: #ffffff;
    letter-spacing: 0.1rem;
    -webkit-text-stroke: 0 #0080ff;
    text-stroke: 0 #0080ff;
    text-shadow:
            2px 2px 0 #0080ff,
            -2px -2px 0 #0080ff,
            2px -2px 0 #0080ff,
            -2px 2px 0 #0080ff,
            4px 4px 8px rgba(0, 0, 0, 0.3),
            2px 2px 4px rgba(0, 128, 255, 0.5);
    margin-bottom: 1.5rem;
    line-height: 1.2;
}
.product_btn { display: inline-block;margin-top: 1rem; }
.product_btn img { height: 3rem;transition: transform 0.3s ease; }
.product_btn:hover img { transform: scale(1.05); }

/* 滑动动画关键帧 */
@keyframes slideFromLeft {
    from { opacity: 0;transform: translate(calc(-50% - 100vw), -50%); }
    to { opacity: 1;transform: translate(-50%, -50%); }
}

@keyframes slideFromRight {
    from {
        opacity: 0;
        transform: translate(calc(-50% + 100vw), -50%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

@keyframes slideFromTop {
    from {
        opacity: 0;
        transform: translate(-50%, calc(-50% - 100vh));
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

@keyframes slideFromBottom {
    from {
        opacity: 0;
        transform: translate(-50%, calc(-50% + 100vh));
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

.img_oab_block1 {
    background-color: #0AB5E120;
    width: 22%;
    aspect-ratio: 3 / 5;
    clip-path: polygon(0 100%, 35% 0, 100% 0, 65% 100%);
    position: absolute;
    top: 40%;
    left: 52%;
    transform: translate(-50%, -50%);
    animation: slideFromLeft 0.8s ease-out 0.2s both;
}
.img_oab_block2 {
    background-color: #0AB5E120;
    width: 26%;
    aspect-ratio: 4 / 5;
    clip-path: polygon(0 100%, 25% 0, 100% 0, 75% 100%);
    position: absolute;
    top: 68%;
    left: 86%;
    transform: translate(-50%, -50%);
    animation: slideFromRight 0.8s ease-out 0.8s both;
}
.img_fff_block1 {
    background-color: #FFFFFF70;
    width: 16%;
    aspect-ratio: 3 / 4;
    clip-path: polygon(0 100%, 28% 0, 100% 0, 72% 100%);
    position: absolute;
    top: 90%;
    left: 65%;
    transform: translate(-50%, -50%);
    animation: slideFromBottom 0.8s ease-out 1s both;
}
.img_fff_block2 {
    background-color: #FFFFFF70;
    width: 16%;
    aspect-ratio: 3 / 4;
    clip-path: polygon(0 100%, 28% 0, 100% 0, 72% 100%);
    position: absolute;
    top: 16%;
    left: 92%;
    transform: translate(-50%, -50%);
    animation: slideFromRight 0.8s ease-out 1.2s both;
}
.section1_img1 {
    width: 30%;
    position: absolute;
    top: 60%;
    left: 60%;
    transform: translate(-50%, -50%);
    animation: slideFromBottom 0.8s ease-out 0.6s both;
}
.section1_img2 {
    width: 30%;
    position: absolute;
    top: 40%;
    left: 80%;
    transform: translate(-50%, -50%);
    animation: slideFromTop 0.8s ease-out 0.4s both;
}

@media (max-width: 1023px) {
    #section1 { aspect-ratio: 480 / 780; }
    #section1 .container { justify-content: end;align-items: center; }
    .section1_text { padding: 0;text-align: center; }
    .product_title {
        font-size: 2.5rem;
        -webkit-text-stroke: 0 #0080ff;
        text-stroke: 0 #0080ff;
    }
    .product_title span { font-size: 1.8rem; }
    .product_btn img { height: 2.5rem; }
    .img_oab_block1 { width: 40%;top: 24%;left: 14%; }
    .img_oab_block2 { width: 56%;top: 54%;left: 76%; }
    .section1_img1 { width: 60%;top: 40%;left: 30%; }
    .section1_img2 { width: 60%;top: 32%;left: 68%; }
    .img_fff_block1 { width: 26%;top: 68%;left: 38%; }
    .img_fff_block2 { width: 32%;top: 18%;left: 98%; }
}

/* section2 */
#section2 { }
.section2_item { width: 80%;margin: 2rem auto 0;text-align: center; }
.section2_item img { width: 10rem;margin-bottom: 2rem; }
.section2_title {
    font-size: 1.8rem;
    color: #4EBDE7;
    margin-bottom: 0.5rem;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0.2rem;
}
.section2_text {
    font-size: 1.5rem;
    color: #666666;
    margin-bottom: 1.5rem;
    text-align: center;
    letter-spacing: 0.1rem;
}
@media (max-width: 1023px) {
    .section2_item { width: 100%; }
    .section2_item img { width: 5rem; }
    .section2_title { font-size: 1rem; }
    .section2_text { font-size: 1rem; }
}

@media (min-width: 1023px) {
    #calculator { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 91%); }
}