@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',Arial,sans-serif;color:#263d2e;background:#f1f0e9;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #4e8951;outline-offset:5px}button{border:0;background:none}a{color:inherit;text-decoration:none}header{height:128px;padding:34px 4%;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:20}.brand{font:800 43px/.9 'Manrope',Arial;letter-spacing:-2.5px}.brand-star{font-size:44px;display:inline-block;margin-left:7px;vertical-align:middle}.brand small{display:block;font:500 9px/1.6 'DM Sans';letter-spacing:1.65px;margin-top:12px}.header-note{margin-left:auto;margin-right:8%;font-size:10px;line-height:1.6;letter-spacing:1.3px}#menu-toggle{display:flex;align-items:center;gap:26px;font-size:14px}.menu-icon{border:1px solid #acb2a5;border-radius:50%;width:39px;height:39px;display:grid;place-items:center;font-size:25px;transition:transform .3s}#menu-toggle[aria-expanded=true] .menu-icon{transform:rotate(45deg)}main{height:calc(100svh - 214px);min-height:500px;position:relative;overflow:hidden}.intro{position:absolute;left:4%;top:12%;z-index:3;pointer-events:none}.intro button{pointer-events:auto}.eyebrow{font-size:9px;letter-spacing:1.5px;display:flex;align-items:center;gap:8px}.eyebrow>span{height:5px;width:5px;background:#40593d;border-radius:50%}h1{font-family:'Manrope',Arial,sans-serif;font-size:clamp(64px,6.7vw,110px);font-weight:500;line-height:1.01;letter-spacing:-6px;margin:27px 0 24px}h1 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-5px}.intro p{font-size:14px;line-height:1.9;color:#6c7568;letter-spacing:-.4px}.text-link{display:flex;align-items:center;gap:50px;font-size:13px;margin-top:26px;border-bottom:1px solid #aab3a3;padding:0 0 11px}.text-link span{font-size:22px}#studio{position:absolute;inset:0 0 10px 22%;touch-action:pan-y}#scene{position:absolute;inset:0;cursor:grab}#scene:active{cursor:grabbing}canvas{display:block;width:100%;height:100%;touch-action:pan-y}#scene-status{position:absolute;left:50%;top:46%;font-size:13px;transform:translateX(-50%)}#hotspots{position:absolute;inset:0;pointer-events:none}#hotspots button{position:absolute;display:flex;align-items:center;gap:9px;pointer-events:auto;transform:translate(-50%,-50%);white-space:nowrap;padding:8px;transition:opacity .2s}#hotspots b{width:31px;height:31px;display:grid;place-items:center;background:#f8f9ee;color:#284d37;border:1px solid #fff;border-radius:50%;font-size:10px;font-weight:500;box-shadow:0 2px 15px #1d31282b}#hotspots button span{max-width:0;opacity:0;overflow:hidden;background:#244b34;color:#fff;padding:0;border-radius:3px;font-size:11px;transition:all .25s}#hotspots button:hover span,#hotspots button:focus-visible span{max-width:180px;opacity:1;padding:8px 12px}#hotspots button:hover b{background:#dcf4a5}#hotspots.hidden{display:none}.scene-caption{position:absolute;bottom:42px;left:4%;display:flex;align-items:center;gap:16px;font-size:9px;letter-spacing:1px;pointer-events:none}.caption-star{font-size:42px;color:#65834c}.scene-caption small{display:block;margin-top:7px;font-size:11px;letter-spacing:0;color:#737b6f}.scene-controls{position:absolute;bottom:42px;right:5%;display:flex;align-items:center;gap:8px}.scene-controls button{border:1px solid #bdc3b4;border-radius:50%;width:35px;height:35px;font-size:21px}.scene-controls button[aria-pressed=true]{background:#e1e6d8}.scene-controls span{font-size:8px;letter-spacing:1.5px;margin-left:10px}.side-note{position:absolute;right:25px;top:40%;writing-mode:vertical-rl;font-size:8px;letter-spacing:1.7px}footer{height:86px;border-top:1px solid #cdd0c3;margin:0 4%;display:flex;align-items:center;justify-content:space-between;font-size:11px}.availability{display:flex;align-items:center;gap:8px}.availability i{width:6px;height:6px;background:#6a894c;border-radius:50%}.footer-center{font-size:8px;letter-spacing:1.4px;color:#7d8477}footer button{font-size:12px}footer button span{padding-left:18px;font-size:18px}#menu{position:fixed;inset:0;background:#e8eddd;z-index:15;padding:170px 12% 50px}#menu[hidden]{display:none}.menu-heading{font-size:11px;letter-spacing:2px;margin-bottom:24px}#menu>button{display:flex;width:100%;padding:17px 0;align-items:center;border-bottom:1px solid #b8c3af;font-size:clamp(28px,5vw,65px);letter-spacing:-2px;text-align:left}#menu small{font-size:12px;letter-spacing:0;margin-right:40px}#menu button span{margin-left:auto}#menu p{font-size:11px;margin-top:35px;letter-spacing:2px}dialog{border:0;background:#f5f5ec;color:#263d2e;width:min(780px,92vw);max-height:86svh;padding:58px;border-radius:5px;box-shadow:0 20px 120px #11281840}dialog::backdrop{background:#213b2b77;backdrop-filter:blur(7px)}#close-detail{position:absolute;right:20px;top:18px;font-size:20px;width:38px;height:38px;border:1px solid #b9c1b0;border-radius:50%}.panel-tag{font-size:11px;letter-spacing:2px}dialog h2{font-family:Manrope,Arial;font-size:52px;font-weight:500;letter-spacing:-3px;line-height:1.1;margin:25px 0}dialog p{font-size:15px;line-height:1.9;color:#68735f}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}.project{background:#e4e7db;padding:20px;min-height:180px;display:flex;flex-direction:column;justify-content:space-between}.project:nth-child(2){background:#254734;color:#edf0df}.project strong{font-size:36px;letter-spacing:-2px;font-weight:500}.project small{font-size:10px;letter-spacing:1px}.project p{font-size:12px;line-height:1.6;color:inherit;margin:12px 0 0}.service-row{padding:22px 0;border-top:1px solid #c8cdbd;display:grid;grid-template-columns:35px 1fr}.service-row small{padding-top:5px;font-size:11px}.service-row h3{margin:0;font-size:23px;font-weight:500}.service-row p{margin:8px 0 0;font-size:13px}.contact-note{border-top:1px solid #c8cdbd;padding-top:18px;margin-top:26px}#brief{width:100%;min-height:125px;border:1px solid #b8c3af;background:#eaf0e0;padding:15px;font:14px/1.7 inherit;resize:vertical;color:#263d2e}#save-brief{background:#264b35;color:white;padding:13px 20px;margin-top:14px;font-size:14px}#save-status{font-size:12px}.fallback #scene{display:grid;place-items:center;background:radial-gradient(ellipse,#d2dfbd,transparent 65%)}.fallback #scene::after{content:'SWANDIO ✳';font-size:clamp(25px,5vw,70px);font-weight:800;color:#346548}.fallback #hotspots{display:none}@media(min-width:1600px){#studio{inset:-30px 0 0 22%}}@media(max-width:900px){header{height:105px}.header-note{display:none}main{height:calc(100svh - 179px);min-height:740px}.intro{top:20px}h1{font-size:67px;letter-spacing:-4px;margin:18px 0}.intro p{font-size:12px}.intro .eyebrow{font-size:8px}#studio{inset:130px -12% 45px 5%}.scene-caption{bottom:25px}.scene-controls{bottom:25px}.scene-controls span,.footer-center,.side-note{display:none}footer{height:74px}}@media(max-width:560px){header{height:95px;padding:25px 6%}.brand{font-size:33px}.brand-star{font-size:34px}.brand small{font-size:7px;letter-spacing:1.1px;margin-top:8px}#menu-toggle{font-size:12px;gap:12px}.menu-icon{width:32px;height:32px}main{height:calc(100svh - 165px);min-height:690px}.intro{left:6%;top:10px}h1{font-size:62px;letter-spacing:-4px}.intro p{font-size:12px;margin-bottom:0}.text-link{margin-top:15px;font-size:11px;gap:35px}#studio{inset:235px -24% 53px -22%}.scene-caption{left:6%;bottom:24px;gap:10px;font-size:7px}.caption-star{font-size:32px}.scene-caption small{font-size:9px}.scene-controls{right:6%;gap:5px}.scene-controls button{width:30px;height:30px}footer{margin:0 6%;height:70px;font-size:9px}footer button{font-size:10px}footer button span{padding-left:5px}#hotspots b{width:27px;height:27px}#hotspots button span{display:none}dialog{padding:45px 25px 30px}dialog h2{font-size:39px}.project-grid{grid-template-columns:1fr}#menu{padding:135px 7% 40px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Architectural studio: a larger, three-storey cutaway takes centre stage. */
:root{background:#f6f4ee;color:#3c493f}main{min-height:620px;height:calc(100svh - 214px)}.intro{top:24%;max-width:30%}h1{font-size:clamp(58px,5.7vw,90px);letter-spacing:-5px}.intro .eyebrow{font-size:8px;letter-spacing:1.2px}#studio{inset:-30px 0 15px 25%}.scene-caption{bottom:22px}.scene-controls{bottom:22px}#hotspots b{background:#fffaf1bF;backdrop-filter:blur(6px);border:1px solid #fff;font-size:9px;width:28px;height:28px}#scene canvas{outline:none}
@media(min-width:1500px){main{min-height:680px}#studio{inset:-40px 0 0 24%}}
@media(max-width:900px){main{height:auto;min-height:980px}.intro{top:15px;max-width:none}h1{font-size:64px}#studio{inset:175px -8% 50px 7%}.scene-caption,.scene-controls{bottom:20px}}
@media(max-width:560px){main{min-height:1010px}.intro{top:12px;left:6%}h1{font-size:58px}.intro p{font-size:12px}#studio{inset:278px -3% 52px -3%}.scene-caption{bottom:20px}.scene-controls{bottom:20px}.scene-caption small{max-width:210px;font-size:9px}.scene-caption>div{font-size:6.5px}}
/* White architecture, mint upholstery and a quiet gallery backdrop. */
:root{background:#edf4f1;color:#34554b}.intro p{color:#6b847a}.scene-caption small{color:#74897f}footer{border-color:#c8d9d0}#menu{background:#e4efe8}#hotspots b{background:#fbfffdcf;color:#416b5a}#hotspots button:hover b{background:#d4eee3}
@media(min-width:901px){header{height:108px;padding-top:25px;padding-bottom:25px}main{height:calc(100svh - 178px);min-height:520px}footer{height:70px}.scene-caption,.scene-controls{bottom:14px}#studio{inset:-15px 0 22px 25%}}
@media(max-width:560px){main{min-height:880px}#studio{inset:250px -3% 52px -3%}}
/* Compact navigation floats on the right; content routes use the whole page. */
[hidden]{display:none!important}#menu{inset:90px 4% auto auto;width:min(420px,calc(100vw - 32px));max-height:calc(100svh - 110px);overflow:auto;padding:30px 30px 22px;background:#294e42;color:#f2f7ed;border:1px solid #ffffff26;box-shadow:0 18px 50px #1a3d2820;border-radius:3px}#menu .menu-heading{font-size:9px;letter-spacing:1.5px;margin-bottom:17px;opacity:.6}#menu>button{font-size:27px;letter-spacing:-1px;padding:17px 0;border-color:#ffffff25;transition:color .2s,padding .2s}#menu>button:hover,#menu>button[aria-current=page]{color:#c5e7c9;padding-left:6px}#menu small{font-size:10px;margin-right:19px;opacity:.5}#menu>p{font-size:9px;letter-spacing:1px;opacity:.5;margin:25px 0 0}#page{position:relative;height:auto;min-height:calc(100svh - 178px);overflow:visible;padding:30px 8% 70px}.page-topline{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #bfcec4;padding-top:24px;font-size:12px}.page-topline>span{font-size:9px;letter-spacing:1.6px;color:#789184}#page-content{max-width:1150px;padding:65px 0 45px}#page .panel-tag{font-size:11px;letter-spacing:2px;color:#7b9184}#page h1{font-family:Manrope,Arial,sans-serif;font-size:clamp(50px,6.5vw,100px);font-weight:500;line-height:1.08;letter-spacing:-4px;margin:24px 0 35px;outline:none}#page p{font-size:17px;line-height:1.9;color:#6b8075;max-width:780px}#page .project-grid{gap:24px;margin-top:48px}#page .project{min-height:300px;padding:35px}#page .project strong{font-size:clamp(35px,4vw,60px)}#page .project p{color:inherit;font-size:14px}#page .service-row{padding:30px 0;grid-template-columns:65px 1fr}#page .service-row h3{font-size:30px;font-weight:500}#page .service-row p{font-size:16px;margin:12px 0 0}#page .contact-note{margin-top:25px}#page #brief{min-height:170px;font-family:inherit;font-size:16px}#page #save-status{font-size:14px}.page-home{display:flex;justify-content:space-between;border-top:1px solid #bfcec4;padding:25px 0;font-size:18px}.page-home span{font-size:24px}.subpage footer{margin-top:0}@media(max-width:560px){#menu{top:78px;right:16px;width:calc(100vw - 32px);padding:22px;max-height:calc(100svh - 95px)}#menu>button{font-size:24px;padding:16px 0}#page{padding:20px 6% 30px;min-height:calc(100svh - 165px)}.page-topline>span{display:none}#page-content{padding:40px 0 25px}#page h1{font-size:44px;letter-spacing:-2px}#page p{font-size:15px}#page .project{min-height:230px;padding:25px}#page .service-row{grid-template-columns:32px 1fr}#page .service-row h3{font-size:23px}#page .service-row p{font-size:14px}}
