.elementor-kit-1399{--e-global-color-primary:#FFFFFF;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-primary );}.elementor-kit-1399 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Normal Perforated Acoustic Panel - Updated Preview</title>
    <style>
        /* 预览嵌入优化CSS（两列+垂直堆叠） */
        .woocommerce div.product {
            max-width: 1200px;
            margin: 20px auto;
            display: flex;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
            border-radius: 10px;
            overflow: hidden;
            background: #fff;
        }
        .images { flex: 1; padding: 20px; }
        .summary {
            flex: 1;
            display: flex;
            flex-direction: column;
            padding: 20px;
            gap: 15px;
        }
        @media (max-width: 768px) {
            .woocommerce div.product { flex-direction: column; }
            .summary { order: 2; padding: 15px; }
            .images { order: 1; padding: 15px; }
            table.shop_attributes { overflow-x: auto; display: block; white-space: nowrap; }
        }
        .product_title.entry-title { font-size: 2.2em; color: #2c3e50; text-align: left; margin: 0 0 5px 0; padding-bottom: 10px; border-bottom: 2px solid #3498db; }
        .price { font-size: 1.8em; color: #000000; font-weight: bold; text-align: left; margin: 0; }
        .woocommerce-product-gallery img { max-width: 100%; height: auto; border-radius: 8px; display: block; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
        .product-short-description { line-height: 1.7; color: #555; text-align: justify; padding: 0 5px; }
        .product-short-description h2, .summary h2 { font-size: 1.6em; color: #34495e; margin: 20px 0 10px 0; padding-left: 10px; border-left: 3px solid #3498db; }
        .summary ol { background: #f8f9fa; border-left: 4px solid #2c3e50; padding: 20px; margin: 10px 0; border-radius: 0 8px 8px 0; list-style: none; counter-reset: list-counter; }
        .summary ol li { margin-bottom: 12px; padding-left: 35px; position: relative; line-height: 1.5; }
        .summary ol li::before { content: counter(list-counter); counter-increment: list-counter; position: absolute; left: 0; top: 0; width: 24px; height: 24px; background: #3498db; color: white; border-radius: 50%; text-align: center; line-height: 24px; font-weight: bold; font-size: 0.9em; }
        table.shop_attributes { width: 100%; border-collapse: collapse; margin: 15px 0; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
        table.shop_attributes th { background: #3498db; color: white; font-weight: bold; padding: 12px 14px; text-align: left; }
        table.shop_attributes td { padding: 12px 14px; text-align: left; border-bottom: 1px solid #eee; }
        table.shop_attributes tr:hover { background: #f0f8ff; }
        table.shop_attributes tr:last-child td { border-bottom: none; }
        form.cart { margin-top: auto; text-align: left; padding-top: 20px; border-top: 1px solid #eee; }
        .single_add_to_cart_button { background: #3498db; color: white; padding: 12px 25px; border-radius: 5px; font-size: 1.1em; font-weight: bold; border: none; cursor: pointer; transition: background 0.3s; }
        .single_add_to_cart_button:hover { background: #2980b9; }
        .reviews h2 { font-size: 1.4em; color: #34495e; border-left: 3px solid #3498db; padding-left: 10px; }
        .reviews p { font-style: italic; color: #95a5a6; }
    </style>
</head>
<body>
    <div class="woocommerce">
        <div class="product">
            <!-- 左侧图片 -->
            <div class="images">
                <div class="woocommerce-product-gallery">
                    <img src="https://ehw.wvf.mybluehost.me/wp-content/uploads/2023/10/normal-perforated-acoustic-panel-1.jpg" alt="Normal Perforated Acoustic Panel" />
                </div>
            </div>

            <!-- 右侧摘要：垂直堆叠 -->
            <div class="summary">
                <!-- 价格置顶 -->
                <p class="price">$ 57.60</p>

                <!-- 标题 -->
                <h1 class="product_title entry-title">MASTER ACOUSTIC Effectively improve the acoustic effect of normal perforated acoustic panel</h1>

                <!-- 短描述 -->
                <div class="product-short-description">
                    <h2>What is Normal Perforated Acoustic Panel?</h2>
                    <p>Normal perforated acoustic panel is a modern acoustic material, mainly used in architecture and interior design to optimize the sound environment. It is made of wood substrate processed by special technology, and has evenly distributed holes on the surface. Its main function is to absorb sound, reduce echo and noise, and improve the acoustic quality of the room.</p>
                </div>

                <!-- 特性列表 -->
                <div>
                    <h2>Features</h2>
                    <ol>
                        <li>Excellent sound absorption performance</li>
                        <li>Beautiful appearance</li>
                        <li>Environmentally friendly materials</li>
                        <li>Easy to install and maintain</li>
                        <li>Thermal isolation and insulation function</li>
                    </ol>
                </div>

                <!-- 参数列表 -->
                <div>
                    <h2>Parameters</h2>
                    <ol>
                        <li>Finish: Melamine. Natural Veneer, HPL, Paint, Artificial Veneer</li>
                        <li>Intermediate substrate: Ordinary, environmentally Friendly, flame-retardant and moisture-proof.</li>
                        <li>Back felt: Attached at the back Side of acoustic, panel tissue Has fire retardant and sound absorption function.</li>
                    </ol>
                </div>

                <!-- 规格表格 -->
                <div>
                    <h2>Specifications</h2>
                    <table class="shop_attributes">
                        <tr><th>Quantity</th><th>Base Material</th><th>Thickness</th><th>Size</th><th>Color</th><th>Finish</th><th>Usage</th><th>Feature</th><th>Function</th></tr>
                        <tr><td>&ge; 100 square meters</td><td>Owens Glass Fiber</td><td>25/50/100 MM</td><td>1200*600 MM or Other Size</td><td>Color Chart</td><td>Fabric / Leather</td><td>Indoor Room Soundproof Decorative Wall Panel</td><td>Flame Retardant</td><td>Sound Absorption</td></tr>
                    </table>
                </div>

                <!-- 添加购物车：置底 -->
                <form class="cart">
                    <button class="single_add_to_cart_button button alt">Add to Cart</button>
                </form>

                <!-- 评论 -->
                <div class="reviews">
                    <h2>Reviews</h2>
                    <p>There are no reviews yet.</p>
                </div>
            </div>
        </div>
    </div>
</body>
</html/* End custom CSS */