{"id":2458,"date":"2026-04-12T12:12:49","date_gmt":"2026-04-12T12:12:49","guid":{"rendered":"https:\/\/bouyuen.com\/?page_id=2458"},"modified":"2026-04-14T13:05:40","modified_gmt":"2026-04-14T13:05:40","slug":"dingtiancafe","status":"publish","type":"page","link":"https:\/\/bouyuen.com\/en\/dingtiancafe\/","title":{"rendered":"Elementor \u9875\u9762 #2458"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"2458\" class=\"elementor elementor-2458\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d917b57 e-flex e-con-boxed e-con e-parent\" data-id=\"d917b57\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5d43803 elementor-widget elementor-widget-html\" data-id=\"5d43803\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"zh-Hant\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>\u9f0e\u5929\u8336\u5ba4 Ding Tin - \u7a7a\u9593\u8a2d\u8a08\u5168\u96c6<\/title>\r\n    <style>\r\n        :root {\r\n            --bg-color: #0f0f0f;\r\n            --text-gold: #c5a059;\r\n            --text-gray: #888888;\r\n            --accent-color: #d4b475;\r\n        }\r\n\r\n        body {\r\n            margin: 0;\r\n            padding: 0;\r\n            background-color: var(--bg-color);\r\n            font-family: \"Noto Serif TC\", \"PingFang TC\", serif;\r\n            color: #ffffff;\r\n            line-height: 1.6;\r\n        }\r\n\r\n        \/* Hero Banner *\/\r\n        .hero {\r\n            position: relative;\r\n            height: 80vh;\r\n            background: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.6)), url('https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_003.jpg') center\/cover no-repeat;\r\n            display: flex;\r\n            align-items: center;\r\n            padding: 0 8%;\r\n        }\r\n\r\n        .hero-text {\r\n            max-width: 800px;\r\n            animation: fadeIn 1.2s ease-out;\r\n        }\r\n\r\n        @keyframes fadeIn {\r\n            from { opacity: 0; transform: translateY(20px); }\r\n            to { opacity: 1; transform: translateY(0); }\r\n        }\r\n\r\n        .hero-text span {\r\n            color: var(--text-gray);\r\n            letter-spacing: 5px;\r\n            font-size: 14px;\r\n            text-transform: uppercase;\r\n        }\r\n\r\n        .hero-text h1 {\r\n            font-size: clamp(2.5rem, 8vw, 4.5rem);\r\n            color: var(--text-gold);\r\n            margin: 15px 0;\r\n            font-weight: 500;\r\n            letter-spacing: 2px;\r\n        }\r\n\r\n        .gold-line {\r\n            width: 60px;\r\n            height: 2px;\r\n            background: var(--accent-color);\r\n            margin-top: 30px;\r\n        }\r\n\r\n        \/* Container *\/\r\n        .container {\r\n            padding: 80px 8%;\r\n            max-width: 1400px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        .section-header {\r\n            display: flex;\r\n            align-items: center;\r\n            font-size: 14px;\r\n            color: var(--text-gray);\r\n            letter-spacing: 4px;\r\n            margin-bottom: 50px;\r\n        }\r\n\r\n        .section-header::before {\r\n            content: \"\";\r\n            width: 40px;\r\n            height: 1px;\r\n            background: var(--text-gray);\r\n            margin-right: 20px;\r\n        }\r\n\r\n        \/* Grid System *\/\r\n        .row {\r\n            display: grid;\r\n            gap: 30px;\r\n            margin-bottom: 30px;\r\n        }\r\n\r\n        .col-1 { grid-template-columns: 1fr; }\r\n        .col-2 { grid-template-columns: 1fr 1fr; }\r\n        .col-3 { grid-template-columns: 1fr 1fr 1fr; }\r\n\r\n        .img-box {\r\n            position: relative;\r\n            overflow: hidden;\r\n            background: #1a1a1a;\r\n            cursor: zoom-in;\r\n            border: 1px solid rgba(255,255,255,0.05);\r\n        }\r\n\r\n        .img-box img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: cover;\r\n            display: block;\r\n            transition: transform 0.8s cubic-bezier(0.2, 1, 0.3, 1);\r\n        }\r\n\r\n        .img-box:hover img {\r\n            transform: scale(1.05);\r\n        }\r\n\r\n        .label {\r\n            padding: 15px 0 10px 0;\r\n            font-size: 12px;\r\n            color: var(--text-gray);\r\n            letter-spacing: 1px;\r\n            font-weight: 300;\r\n            text-transform: uppercase;\r\n        }\r\n\r\n        \/* Lightbox *\/\r\n        .lightbox {\r\n            position: fixed;\r\n            top: 0; left: 0; width: 100%; height: 100%;\r\n            background: rgba(0,0,0,0.95);\r\n            display: none;\r\n            justify-content: center;\r\n            align-items: center;\r\n            z-index: 9999;\r\n            cursor: zoom-out;\r\n        }\r\n\r\n        .lightbox.active { display: flex; }\r\n        .lightbox img {\r\n            max-width: 90%;\r\n            max-height: 85vh;\r\n            box-shadow: 0 0 40px rgba(0,0,0,0.5);\r\n        }\r\n\r\n        \/* Responsive *\/\r\n        @media (max-width: 900px) {\r\n            .col-2, .col-3 { grid-template-columns: 1fr; }\r\n            .hero { height: 60vh; }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"lightbox\" id=\"lightbox\">\r\n        <img decoding=\"async\" src=\"\" alt=\"Preview\">\r\n    <\/div>\r\n\r\n    <section class=\"hero\">\r\n        <div class=\"hero-text\">\r\n            <span>PROJECT CASE \u00b7 \u9805\u76ee\u6848\u4f8b<\/span>\r\n            <h1>\u9f0e\u5929\u8336\u5ba4<br><\/h1>\r\n            <div class=\"gold-line\"><\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <div class=\"container\">\r\n        <div class=\"section-header\">\u7a7a\u9593\u5beb\u771f GALLERY<\/div>\r\n\r\n        <div class=\"row col-1\">\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_003.jpg\" alt=\"\u5ba4\u5167\u5168\u666f\" style=\"height: 600px;\">\r\n                <div class=\"label\">Interior Panorama \u00b7 01<\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"row col-2\">\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_001.jpg\" alt=\"\u5e97\u9762\u5916\u89c0\" style=\"height: 500px;\">\r\n                <div class=\"label\">Exterior View \u00b7 02<\/div>\r\n            <\/div>\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_002.jpg\" alt=\"\u5427\u53f0\u5340\u57df\" style=\"height: 500px;\">\r\n                <div class=\"label\">Service Counter \u00b7 03<\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"row col-3\">\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_detial_004.jpg\" alt=\"\u9713\u8679\u7d30\u7bc0\" style=\"height: 400px;\">\r\n                <div class=\"label\">Neon Craft \u00b7 04<\/div>\r\n            <\/div>\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_detial_005.jpg\" alt=\"\u683c\u67f5\u7d30\u7bc0\" style=\"height: 400px;\">\r\n                <div class=\"label\">Ceiling Detail \u00b7 05<\/div>\r\n            <\/div>\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_004.jpg\" alt=\"\u7a97\u908a\u5ea7\u5e2d\" style=\"height: 400px;\">\r\n                <div class=\"label\">Window Seating \u00b7 06<\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"row col-2\">\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_005.jpg\" alt=\"\u5fa9\u53e4\u5361\u5ea7\" style=\"height: 480px;\">\r\n                <div class=\"label\">Booth Seating \u00b7 07<\/div>\r\n            <\/div>\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_008.jpg\" alt=\"\u54c1\u724c\u5c55\u793a\" style=\"height: 480px;\">\r\n                <div class=\"label\">Branding View \u00b7 08<\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"row col-2\">\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_006.jpg\" alt=\"\u805a\u9910\u5340\" style=\"height: 450px;\">\r\n                <div class=\"label\">Dining Area \u00b7 09<\/div>\r\n            <\/div>\r\n            <div class=\"img-box\">\r\n                <img decoding=\"async\" src=\"https:\/\/bouyuen.com\/wp-content\/uploads\/2026\/04\/TP_\u9f0e\u5929\u8336\u5ba4_002.jpg\" alt=\"\u7a7a\u9593\u6df1\u5ea6\" style=\"height: 450px;\">\r\n                <div class=\"label\">Perspective View \u00b7 10<\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        const lightbox = document.getElementById('lightbox');\r\n        const lightboxImg = lightbox.querySelector('img');\r\n        const images = document.querySelectorAll('.img-box img');\r\n\r\n        images.forEach(img => {\r\n            img.parentElement.addEventListener('click', () => {\r\n                lightboxImg.src = img.src;\r\n                lightbox.classList.add('active');\r\n                document.body.style.overflow = 'hidden';\r\n            });\r\n        });\r\n\r\n        lightbox.addEventListener('click', () => {\r\n            lightbox.classList.remove('active');\r\n            document.body.style.overflow = 'auto';\r\n        });\r\n    <\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>\u9f0e\u5929\u8336\u5ba4 Ding Tin &#8211; \u7a7a\u9593\u8a2d\u8a08\u5168\u96c6 PROJECT CASE \u00b7 \u9805\u76ee\u6848\u4f8b \u9f0e\u5929\u8336\u5ba4 \u7a7a [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"_joinchat":[],"footnotes":""},"class_list":["post-2458","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"2523841739@qq.com","author_link":"https:\/\/bouyuen.com\/en\/author\/2523841739qq-com\/"},"uagb_comment_info":0,"uagb_excerpt":"\u9f0e\u5929\u8336\u5ba4 Ding Tin &#8211; \u7a7a\u9593\u8a2d\u8a08\u5168\u96c6 PROJECT CASE \u00b7 \u9805\u76ee\u6848\u4f8b \u9f0e\u5929\u8336\u5ba4 \u7a7a&hellip;","_links":{"self":[{"href":"https:\/\/bouyuen.com\/en\/wp-json\/wp\/v2\/pages\/2458","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bouyuen.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bouyuen.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bouyuen.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bouyuen.com\/en\/wp-json\/wp\/v2\/comments?post=2458"}],"version-history":[{"count":0,"href":"https:\/\/bouyuen.com\/en\/wp-json\/wp\/v2\/pages\/2458\/revisions"}],"wp:attachment":[{"href":"https:\/\/bouyuen.com\/en\/wp-json\/wp\/v2\/media?parent=2458"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}