{"id":1226,"date":"2026-01-29T15:20:44","date_gmt":"2026-01-29T07:20:44","guid":{"rendered":"https:\/\/winswaymanagement.com\/?page_id=1226"},"modified":"2026-01-31T14:00:30","modified_gmt":"2026-01-31T06:00:30","slug":"charles-st-mirrickville-nsw-11-2023-f-2","status":"publish","type":"page","link":"https:\/\/winswaymanagement.com\/index.php\/charles-st-mirrickville-nsw-11-2023-f-2\/","title":{"rendered":"charles st mirrickville nsw 11.2023 F"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Winsway | Charles St Residence<\/title>\r\n <style>\r\n \/* \u5f15\u5165\u89c4\u8303\u5b57\u4f53 *\/\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600&display=swap');\r\n\r\n :root {\r\n --ws-bg: #FFFFFF;\r\n --ws-text-strong: #202020;\r\n --ws-text-body: #505050;\r\n --ws-text-meta: #A0A0A0;\r\n --ws-line: #E2E2E2;\r\n \r\n \/* \u5b57\u4f53\u7cfb\u7edf *\/\r\n --font-heading: 'Arial', sans-serif;\r\n --font-body: 'Inter', sans-serif;\r\n \r\n \/* \u52a8\u753b\u66f2\u7ebf *\/\r\n --ease-smooth: cubic-bezier(0.33, 1, 0.68, 1);\r\n --ease-draw: cubic-bezier(0.7, 0, 0.3, 1); \/* \u7ebf\u6761\u751f\u957f\u4e13\u7528\u66f2\u7ebf *\/\r\n }\r\n\r\n body {\r\n margin: 0;\r\n padding: 0;\r\n background-color: var(--ws-bg);\r\n -webkit-font-smoothing: antialiased;\r\n color: var(--ws-text-body);\r\n overflow-x: hidden;\r\n }\r\n\r\n \/* --- 1. Fixed Hero Section (\u89c6\u5dee\u80cc\u666f) --- *\/\r\n .hero-section {\r\n \/* \u6838\u5fc3\uff1a\u56fa\u5b9a\u5b9a\u4f4d *\/\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 85vh; \r\n z-index: 0; \/* \u653e\u5728\u5e95\u5c42 *\/\r\n overflow: hidden;\r\n }\r\n .hero-img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n }\r\n\r\n \/* --- 2. Main Layout (\u8986\u76d6\u5c42) --- *\/\r\n .main-wrapper {\r\n position: relative;\r\n z-index: 2; \/* \u5728 Hero \u4e4b\u4e0a *\/\r\n background-color: var(--ws-bg); \/* \u5fc5\u987b\u6709\u80cc\u666f\u8272\u624d\u80fd\u906e\u6321 *\/\r\n \r\n \/* \u6838\u5fc3\uff1a\u9876\u90e8\u5916\u8fb9\u8ddd = Hero\u7684\u9ad8\u5ea6\uff0c\u8ba9\u51fa\u7b2c\u4e00\u5c4f *\/\r\n margin-top: 85vh; \r\n \r\n display: grid;\r\n grid-template-columns: 350px 1fr;\r\n min-height: 100vh;\r\n border-bottom: 1px solid var(--ws-line);\r\n box-shadow: 0 -20px 50px rgba(0,0,0,0.05); \/* \u9876\u90e8\u589e\u52a0\u4e00\u70b9\u9634\u5f71\u63d0\u5347\u5c42\u6b21 *\/\r\n }\r\n\r\n \/* --- Left Sticky --- *\/\r\n .col-sticky {\r\n position: sticky;\r\n top: 0;\r\n height: 100vh;\r\n padding: 60px 45px; \r\n display: flex;\r\n flex-direction: column;\r\n gap: 40px;\r\n box-sizing: border-box;\r\n background: var(--ws-bg);\r\n z-index: 100;\r\n \r\n \/* \u79fb\u9664\u539f\u6765\u7684 border-right\uff0c\u6539\u7528\u4f2a\u5143\u7d20\u505a\u52a8\u753b *\/\r\n border-right: none; \r\n }\r\n\r\n \/* \u2605 \u52a8\u753b\u7ebf\u6761 1\uff1a\u5782\u76f4\u5206\u5272\u7ebf (\u4ece\u4e0a\u5f80\u4e0b) \u2605 *\/\r\n .col-sticky::after {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n width: 1px;\r\n height: 0%; \/* \u521d\u59cb\u9ad8\u5ea6\u4e3a0 *\/\r\n background-color: var(--ws-line); \/* \u82e5\u9700\u8981\u84dd\u8272\u53ef\u6539\u4e3a\u84dd\u8272 *\/\r\n animation: drawDown 1.5s var(--ease-draw) 0.5s forwards; \/* \u5ef6\u65f6\u64ad\u653e *\/\r\n }\r\n\r\n @keyframes drawDown {\r\n to { height: 100%; }\r\n }\r\n\r\n \/* \u6807\u9898\u7ec4 *\/\r\n h1.project-title {\r\n font-family: var(--font-heading);\r\n font-weight: 700;\r\n font-size: 24px; \r\n line-height: 1.1;\r\n color: var(--ws-text-strong);\r\n margin: 0;\r\n letter-spacing: 0.04em; \r\n text-transform: uppercase;\r\n opacity: 0;\r\n animation: fadeUp 0.8s ease 0.8s forwards; \/* \u5185\u5bb9\u4e5f\u7a0d\u5fae\u5ef6\u65f6 *\/\r\n }\r\n\r\n .meta-container {\r\n position: relative;\r\n padding-top: 25px;\r\n \/* \u79fb\u9664\u539f\u6765\u7684 border-top *\/\r\n border-top: none; \r\n opacity: 0;\r\n animation: fadeUp 0.8s ease 1s forwards;\r\n }\r\n\r\n \/* \u2605 \u52a8\u753b\u7ebf\u6761 2\uff1a\u6c34\u5e73\u5206\u5272\u7ebf (\u4ece\u5de6\u5f80\u53f3) \u2605 *\/\r\n .meta-container::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n height: 1px;\r\n width: 0%; \/* \u521d\u59cb\u5bbd\u5ea6\u4e3a0 *\/\r\n background-color: var(--ws-text-strong);\r\n animation: drawRight 1.2s var(--ease-draw) 1.2s forwards;\r\n }\r\n\r\n @keyframes drawRight {\r\n to { width: 100%; }\r\n }\r\n\r\n @keyframes fadeUp {\r\n from { opacity: 0; transform: translateY(20px); }\r\n to { opacity: 1; transform: translateY(0); }\r\n }\r\n\r\n .meta-block {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n margin-bottom: 18px;\r\n }\r\n\r\n .meta-label {\r\n font-family: var(--font-body);\r\n font-size: 10px;\r\n color: var(--ws-text-meta);\r\n text-transform: uppercase;\r\n letter-spacing: 0.08em;\r\n font-weight: 600;\r\n }\r\n\r\n .meta-value {\r\n font-family: var(--font-body);\r\n font-size: 13px; \r\n color: var(--ws-text-strong);\r\n font-weight: 400;\r\n }\r\n\r\n \/* --- Right Gallery --- *\/\r\n .col-gallery {\r\n padding: 60px; \r\n background-color: var(--ws-bg);\r\n }\r\n\r\n .gallery-grid {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 20px; \r\n }\r\n\r\n .gallery-item {\r\n position: relative;\r\n width: 100%;\r\n aspect-ratio: 4 \/ 3; \r\n overflow: hidden;\r\n background-color: #F8F8F8;\r\n opacity: 0;\r\n transform: translateY(20px);\r\n transition: opacity 0.8s ease, transform 0.8s ease, box-shadow 0.4s ease;\r\n cursor: pointer;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: flex-start;\r\n }\r\n\r\n .gallery-item.visible {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .gallery-item img {\r\n display: block;\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover; \r\n transition: all 0.5s var(--ease-smooth); \r\n transform-origin: top center;\r\n }\r\n\r\n .gallery-item:hover {\r\n box-shadow: 0 20px 40px rgba(0,0,0,0.06);\r\n z-index: 10;\r\n }\r\n\r\n .gallery-item:hover img {\r\n width: 90%;\r\n height: 75%; \r\n margin-top: 5%; \r\n }\r\n\r\n \/* --- \u5e95\u90e8\u6587\u6848 (\u4f18\u5316\u7248) --- *\/\r\n .item-caption {\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 25%; \r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n text-align: center;\r\n opacity: 0;\r\n transform: translateY(5px);\r\n transition: all 0.4s ease 0.1s; \r\n }\r\n\r\n .gallery-item:hover .item-caption {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n \/* \u2605 \u6838\u5fc3\u4fee\u6539 3\uff1a\u589e\u5927\u52a0\u7c97\u6587\u6848 \u2605 *\/\r\n .cap-title {\r\n font-family: var(--font-heading);\r\n font-weight: 800; \/* \u52a0\u7c97\u5230 ExtraBold *\/\r\n font-size: 14px; \/* \u589e\u5927\u5b57\u53f7 (\u539f12px) *\/\r\n color: var(--ws-text-strong);\r\n text-transform: uppercase;\r\n letter-spacing: 0.05em;\r\n margin-bottom: 5px;\r\n }\r\n\r\n .cap-sub {\r\n font-family: var(--font-body);\r\n font-weight: 400; \/* Regular (\u539f300) *\/\r\n font-size: 12px; \/* \u589e\u5927\u5b57\u53f7 (\u539f11px) *\/\r\n color: var(--ws-text-meta);\r\n letter-spacing: 0.02em;\r\n }\r\n\r\n @media (max-width: 1200px) {\r\n .gallery-grid { grid-template-columns: repeat(2, 1fr); }\r\n }\r\n @media (max-width: 900px) {\r\n .main-wrapper { grid-template-columns: 1fr; margin-top: 0; \/* \u79fb\u52a8\u7aef\u53d6\u6d88\u89c6\u5dee *\/ }\r\n .hero-section { position: relative; height: 50vh; }\r\n .col-sticky { position: relative; height: auto; border-right: none; padding: 40px; }\r\n .col-sticky::after { display: none; } \/* \u79fb\u52a8\u7aef\u9690\u85cf\u5782\u76f4\u7ebf *\/\r\n .col-gallery { padding: 20px; }\r\n .gallery-grid { grid-template-columns: 1fr; gap: 20px; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n <!-- Fixed Hero Background -->\r\n <div class=\"hero-section\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_856-2.webp\" alt=\"Winsway Cover\" class=\"hero-img\">\r\n <\/div>\r\n\r\n <!-- Main Content (Scrolls Over Hero) -->\r\n <div class=\"main-wrapper\">\r\n <aside class=\"col-sticky\">\r\n <h1 class=\"project-title\">Charles St<br>Residence<\/h1>\r\n <div class=\"meta-container\">\r\n <div class=\"meta-block\">\r\n <span class=\"meta-label\">Location<\/span>\r\n <span class=\"meta-value\">Marrickville, Sydney<\/span>\r\n <\/div>\r\n <div class=\"meta-block\">\r\n <span class=\"meta-label\">Year<\/span>\r\n <span class=\"meta-value\">11.2023<\/span>\r\n <\/div>\r\n \r\n <\/div>\r\n <\/aside>\r\n\r\n <main class=\"col-gallery\">\r\n <div class=\"gallery-grid\">\r\n \r\n <!-- 1 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_856-1.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 2 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 3 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-8.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 4 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-7.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 5 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-6.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 6 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-5.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 7 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-4.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 8 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-3.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 9 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-2.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 10 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_855-1.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 11 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_854.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 12 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_854-4.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 13 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_854-3.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 14 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_854-2.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 15 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_854-1.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 16 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/charles-st-mirrickville-home-1.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 17 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_1919-1.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- 18 -->\r\n <div class=\"gallery-item\">\r\n <img decoding=\"async\" src=\"https:\/\/winswaymanagement.com\/wp-content\/uploads\/2026\/01\/rsw_1280h_1916.webp\">\r\n <div class=\"item-caption\">\r\n <span class=\"cap-title\">CharlesSt Mirrickville<\/span>\r\n <span class=\"cap-sub\">11.2023<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/main>\r\n <\/div>\r\n\r\n <script>\r\n const observer = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n if (entry.isIntersecting) {\r\n entry.target.classList.add('visible');\r\n }\r\n });\r\n }, { threshold: 0.05 });\r\n\r\n document.querySelectorAll('.gallery-item').forEach(item => {\r\n observer.observe(item);\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Winsway | Charles St Residence Charles StResidence Loca […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-1226","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/pages\/1226","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/comments?post=1226"}],"version-history":[{"count":19,"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/pages\/1226\/revisions"}],"predecessor-version":[{"id":1383,"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/pages\/1226\/revisions\/1383"}],"wp:attachment":[{"href":"https:\/\/winswaymanagement.com\/index.php\/wp-json\/wp\/v2\/media?parent=1226"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}