.elementor-32475 .elementor-element.elementor-element-a7c266a{--display:flex;}.elementor-32475 .elementor-element.elementor-element-7472ca2{--display:flex;--min-height:278px;}.elementor-32475 .elementor-element.elementor-element-247b5e2{text-align:center;}.elementor-32475 .elementor-element.elementor-element-247b5e2 .elementor-heading-title{font-weight:bold;color:#DB0303;}.elementor-32475 .elementor-element.elementor-element-ffb84b6{text-align:center;}.elementor-32475 .elementor-element.elementor-element-ffb84b6 .elementor-heading-title{color:#DB0303;}.elementor-32475 .elementor-element.elementor-element-7e79d9d{--display:flex;}/* Start custom CSS for container, class: .elementor-element-a7c266a *//* 1. ไล่สีพื้นหลัง (แดงล่าง -> ขาวบน) และจัดการพื้นที่ */
.elementor-32475 .elementor-element.elementor-element-a7c266a {
    background: linear-gradient(to top, #ff3344 0%, #ffffff 100%);
    overflow: hidden;
    position: relative;
    z-index: 1; /* ป้องกันไม่ให้พื้นหลังบังเนื้อหา */
}

/* 2. สร้างรูปทรงสี่เหลี่ยมสไตล์โปร่งแสง (Glassmorphism) */
.elementor-32475 .elementor-element.elementor-element-a7c266a::before,
.elementor-32475 .elementor-element.elementor-element-a7c266a::after {
    content: "";
    position: absolute;
    bottom: -200px; /* ให้เริ่มลอยจากข้างใต้กรอบ */
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 12px; /* ลบมุมให้ดูละมุน */
    z-index: -1; /* ให้สี่เหลี่ยมอยู่หลังเนื้อหา (Text/Image) */
}

/* 3. กลุ่มที่ 1: สี่เหลี่ยมชุดแรก + จำลองสี่เหลี่ยมเพิ่มด้วยเงา (box-shadow) */
.elementor-32475 .elementor-element.elementor-element-a7c266a::before {
    width: 60px;
    height: 60px;
    left: 15%;
    /* ใช้ box-shadow สร้างแฝดสี่เหลี่ยมในตำแหน่งและขนาดต่างๆ แบบไม่ต้องเขียน HTML เพิ่ม */
    box-shadow: 
        25vw 250px 0 -15px rgba(255, 255, 255, 0.4),
        50vw 400px 0 20px rgba(255, 255, 255, 0.2),
        70vw 100px 0 -10px rgba(255, 255, 255, 0.5);
    animation: floatUp1 20s linear infinite;
}

/* 4. กลุ่มที่ 2: สี่เหลี่ยมชุดที่สอง + จำลองเพิ่มด้วยเงา (ขนาดใหญ่กว่าและหมุนกลับด้าน) */
.elementor-32475 .elementor-element.elementor-element-a7c266a::after {
    width: 90px;
    height: 90px;
    left: 65%;
    box-shadow: 
        -30vw 300px 0 -25px rgba(255, 255, 255, 0.3),
        -45vw 500px 0 15px rgba(255, 255, 255, 0.2),
        15vw 700px 0 -30px rgba(255, 255, 255, 0.4);
    animation: floatUp2 25s linear infinite;
}

/* 5. ชุดคำสั่งแอนิเมชันลอยขึ้นและหมุน */
@keyframes floatUp1 {
    0% { transform: translateY(0) rotate(0deg); opacity: 1; }
    100% { transform: translateY(-1500px) rotate(360deg); opacity: 0; }
}

@keyframes floatUp2 {
    0% { transform: translateY(0) rotate(0deg); opacity: 1; }
    100% { transform: translateY(-1600px) rotate(-360deg); opacity: 0; }
}/* End custom CSS */