
        :root {
            --radius: 12px; --radius-sm: 8px; --radius-round: 20px;
            --shadow: 0 5px 20px rgba(0,0,0,.08); --shadow-hover: 0 15px 40px rgba(0,0,0,.1);
            --transition: .3s;
        }
        .detail-section { padding: 60px 0; background: var(--white); }

        .product-top { display: flex; gap: 50px; margin-bottom: 60px; }
        .product-gallery { flex: 1; }
        .product-gallery .main-img {
            width: 100%; border-radius: var(--radius); overflow: hidden;
            box-shadow: 0 5px 20px rgba(0,0,0,.08); margin-bottom: 15px;
        }
        .product-gallery .main-img img { width: 100%; height: 450px; object-fit: cover; display: block; }

        .product-info-detail { flex: 1; padding: 10px 0; }
        .product-info-detail h1 { font-size: 32px; color: var(--dark); margin-bottom: 8px; }
        .product-tags { margin-top: 18px; display: flex; gap: 10px; }
        .product-tags .meta-tag {
            display: inline-block; padding: 3px 12px; border-radius: 4px;
            font-size: 12px; font-weight: 600; color: #fff;
        }
        .product-tags .meta-tag.hot { background: var(--tag-hot); }
        .product-tags .meta-tag.new { background: var(--tag-new); }
        .product-meta { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 20px; align-items: center; }
        .product-meta .meta-item { font-size: 14px; color: var(--gray-light); }
        .inquiry-btn {
            display: inline-flex; align-items: center; padding: 14px 36px;
            background: var(--primary); color: #fff; border-radius: 50px;
            font-size: 15px; font-weight: 600; text-decoration: none;
            transition: all var(--transition);
        }
        .inquiry-btn:hover { background: var(--primary-dark); transform: translateY(-2px); }
        .product-info-detail .subtitle {
            font-size: 16px; color: var(--text-muted); margin: 20px 0 24px; line-height: 1.8;
        }
        .product-info-detail .spec-list {
            display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px;
        }
        .product-info-detail .spec-list .spec-item {
            padding: 6px 16px; background: var(--bg-hover);
            border-radius: 6px; font-size: 14px; color: var(--text-light);
        }
        .product-gallery .thumb-list { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
        .product-gallery .thumb-list img {
            width: 72px; height: 72px; object-fit: cover; border-radius: 6px;
            cursor: pointer; border: 2px solid transparent; transition: all var(--transition);
        }
        .product-gallery .thumb-list img:hover,
        .product-gallery .thumb-list img.active { border-color: var(--primary); }

        .product-desc-section { padding: 40px 0; border-top: 2px solid var(--border-lighter); }
        .product-desc-section h3 { font-size: 22px; color: var(--dark); margin-bottom: 20px; }
        .product-desc-section p { font-size: 15px; color: var(--text-light); line-height: 2; margin-bottom: 18px; }
        .product-desc-section img {
            width: 100%; border-radius: var(--radius-sm); margin: 20px 0;
            box-shadow: 0 3px 15px rgba(0,0,0,.06);
        }

        .related-section { padding: 60px 0; background: var(--bg-light); }
        .related-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 25px; }
        .related-card {
            display: block; background: var(--white); border-radius: var(--radius);
            overflow: hidden; box-shadow: var(--shadow); transition: all .4s;
            text-decoration: none; color: inherit;
        }
        .related-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-hover); }
        .related-card .rel-img { height: 200px; overflow: hidden; position: relative; }
        .related-card .rel-img .product-hot {
            position: absolute; top: 10px; right: 10px; padding: 3px 10px;
            background: var(--tag-hot); color: var(--bg-white); font-size: 11px;
            border-radius: 10px; font-weight: 600;
        }
        .related-card .rel-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
        .related-card:hover .rel-img img { transform: scale(1.08); }
        .related-card .rel-body { padding: 18px; text-align: center; }
        .related-card .rel-body h4 { font-size: 16px; color: var(--dark); margin-bottom: 8px; }

        @media (max-width: 992px) {
            .product-top { flex-direction: column; }
            .product-gallery .main-img img { height: 350px; }
            .related-grid { grid-template-columns: repeat(2,1fr); }
        }
        @media (max-width: 768px) {
            .product-gallery .main-img img { height: 280px; }
            .product-info-detail h1 { font-size: 24px; }
            .related-grid { grid-template-columns: 1fr; }
        }
    