:root{--ink:#282b26;--paper:#f5f5f0;--muted:#72756c;--line:#d4d7cd;--accent:#a8ad98}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:105px}body{margin:0;color:var(--ink);background:var(--paper);font-family:'DM Sans',Arial,sans-serif;font-weight:300}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #b4ac83;outline-offset:6px}button{color:inherit}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Manrope,Arial,sans-serif;font-weight:300}header{position:absolute;top:0;left:0;width:100%;z-index:20;padding:34px 4.2%;display:flex;justify-content:space-between;align-items:center;color:white;transition:background .3s,padding .3s}header.scrolled{position:fixed;padding:18px 4.2%;background:rgba(245,245,240,.97);color:var(--ink);border-bottom:1px solid var(--line)}.brand{font-family:Manrope,Arial,sans-serif;font-size:48px;letter-spacing:.16em;line-height:1;display:inline-block}.brand span{display:block;font-family:'DM Sans',Arial,sans-serif;font-size:7px;letter-spacing:.16em;margin-top:10px;white-space:nowrap}nav{display:flex;gap:36px;align-items:center}nav a,.headerActions button{font-size:11px;letter-spacing:.15em;text-transform:uppercase}nav a{position:relative;padding:10px 0}nav a:after{content:'';position:absolute;bottom:4px;left:0;width:0;height:1px;background:currentColor;transition:width .3s}nav a:hover:after{width:100%}.headerActions{display:flex;align-items:center;gap:20px}.headerActions button{border:0;background:none;padding:10px}#menu{display:none;width:40px}#menu span{display:block;height:1px;background:currentColor;margin:7px 0}.hero{height:100svh;min-height:650px;position:relative;color:white;background:#3d4038;overflow:hidden}.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease}.slide.active{opacity:1}.slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 8s linear}.slide.active img{transform:scale(1)}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.30),transparent 40%,rgba(0,0,0,.50));pointer-events:none}.heroTop,.heroCaption,.heroBottom{position:absolute;z-index:2;left:4.2%;right:4.2%}.heroTop{top:165px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.2em}.heroCaption{bottom:145px;text-align:center}.eyebrow{font-size:10px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;line-height:1.5}.heroCaption h1{font-size:clamp(46px,6.2vw,94px);letter-spacing:-.045em;line-height:1.2;margin:14px 0 22px}.heroDiscover{font-size:10px;text-transform:uppercase;letter-spacing:.16em;border-bottom:1px solid #ffffff85;padding-bottom:9px}.heroBottom{bottom:37px;display:flex;justify-content:space-between;align-items:center}.scrollLink{display:flex;gap:30px;align-items:center;font-size:9px;letter-spacing:.13em}.scrollLink>span:last-child{font-size:24px}.sliderControls{display:flex;align-items:center;gap:17px}.sliderControls>span{font-size:10px;letter-spacing:.12em;margin-right:14px}.sliderControls button{border:0;background:none;color:white;padding:8px;font-size:22px}#pause{font-size:14px}#dots{display:flex;gap:10px}#dots button{width:5px;height:5px;border:1px solid white;border-radius:50%;padding:0;opacity:.5}#dots button.active{background:white;opacity:1}.section{padding:110px 4.2%}.sectionHeading{display:flex;justify-content:space-between;align-items:end;margin-bottom:55px}h2{font-size:clamp(34px,4.3vw,66px);line-height:1.15;letter-spacing:-.045em}.sectionHeading h2{margin-top:20px}.sectionNote{font-size:13px;line-height:1.7;width:235px;color:var(--muted)}.filters{display:flex;gap:30px;padding-bottom:24px}.filters button{border:0;border-bottom:1px solid transparent;background:none;padding:8px 0;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}.filters button.active{color:var(--ink);border-color:var(--ink)}.projectGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.projectCard{position:relative;overflow:hidden;aspect-ratio:1.28;display:block;background:#d9dcd1;color:white}.projectCard img{width:100%;height:100%;object-fit:cover;transition:transform 1s}.projectCard:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,#0008)}.projectCard:hover img{transform:scale(1.035)}.cardCopy{position:absolute;z-index:1;left:35px;right:35px;bottom:29px;display:flex;align-items:end;justify-content:space-between}.cardCopy h3{font-size:27px;letter-spacing:-.03em;margin:7px 0}.cardCopy .eyebrow{font-size:8px}.cardCopy>span{font-size:27px}.services{display:grid;grid-template-columns:1fr 1.1fr;gap:12%;background:#e9ebe2}.serviceIntro h2{margin:25px 0 35px}.serviceIntro>p:last-child{max-width:350px;font-size:14px;line-height:1.9;color:#64695d}.serviceList article{display:flex;gap:30px;padding:32px 0;border-top:1px solid #c8ccbf}.serviceList article:last-child{border-bottom:1px solid #c8ccbf}.serviceNumber{font-size:10px;padding-top:6px;color:#6d7364}.serviceList h3{font-size:29px;letter-spacing:-.04em}.serviceList p{font-size:13px;line-height:1.8;max-width:350px;color:#64695d;margin-top:15px}.serviceList article>span:last-child{margin-left:auto;font-size:22px}.studio{display:grid;grid-template-columns:1fr 1fr;background:#343a31;color:#f4f4ed}.studioPhoto{min-height:650px;overflow:hidden}.studioPhoto img{height:100%;width:100%;object-fit:cover}.studioCopy{padding:100px 12%;display:flex;flex-direction:column;justify-content:center;align-items:start}.studioCopy h2{font-size:clamp(32px,3.2vw,49px);margin:35px 0}.studioCopy>p:not(.eyebrow){line-height:1.9;font-size:14px;color:#c6cabe;white-space:pre-line;text-wrap:pretty}.textLink{display:inline-block;font-size:11px;letter-spacing:.08em;padding-bottom:11px;border-bottom:1px solid currentColor;margin-top:40px}.contact{padding-top:130px;padding-bottom:70px}.contact h2{margin:28px 0 48px;font-size:clamp(50px,7vw,110px)}.contactMail{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:30px;font-size:clamp(24px,3vw,42px);font-weight:300;letter-spacing:-.03em}.contactMail span{font-size:50px}.contactBottom{display:flex;justify-content:space-between;padding-top:28px;font-size:13px;color:var(--muted)}footer{border-top:1px solid var(--line);padding:40px 4.2%;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:var(--muted)}.footerBrand{font-size:35px;color:var(--ink)}dialog{border:0;padding:0;width:100vw;max-width:none;height:100svh;max-height:none;margin:0;background:var(--paper);color:var(--ink);overflow-y:auto}dialog::backdrop{background:#1b211b}.detailHeader{display:flex;justify-content:space-between;align-items:center;padding:30px 4.2%;border-bottom:1px solid var(--line)}.detailHeader .brand{font-size:36px}.detailHeader button{border:0;background:none;font-size:12px}.detailIntro{padding:80px 4.2% 60px}.detailIntro h2{margin:20px 0;font-size:clamp(45px,7vw,100px)}.detailIntro>p:last-child{font-size:13px;color:var(--muted)}#detailGallery{display:grid;gap:12px;padding:0 4.2%}#detailGallery img{width:100%;max-height:90vh;object-fit:contain;background:#e8e9e2}.detailFoot{padding:60px 4.2%;display:flex;justify-content:space-between;align-items:center}.detailFoot .textLink{margin:0}.detailFoot>a:last-child{font-size:11px;color:var(--muted)}body.modalOpen{overflow:hidden}[hidden]{display:none!important}
@media(min-width:1500px){.section{padding-left:7%;padding-right:7%}}@media(max-width:800px){header{padding:25px 6%}.brand{font-size:40px}.brand span{font-size:6px}#menu{display:block}header nav{display:none;position:absolute;top:100%;left:0;width:100%;background:var(--paper);color:var(--ink);padding:30px 6%;flex-direction:column;align-items:start;gap:12px}header.open nav{display:flex}header nav a{font-size:16px}header.scrolled{padding:18px 6%}.hero{min-height:600px}.heroTop{top:140px;left:6%;right:6%}.heroTop>span:last-child{display:none}.heroCaption{bottom:160px;left:6%;right:6%}.heroCaption h1{font-size:52px}.heroBottom{left:6%;right:6%;bottom:30px;gap:25px;align-items:start}.scrollLink{max-width:140px;line-height:1.8;gap:16px;font-size:8px}.sliderControls{gap:5px;flex-wrap:wrap;justify-content:end}.sliderControls>span{width:100%;text-align:right;margin:0 9px 10px 0}#dots{gap:7px}.sliderControls button{font-size:20px}.section{padding:75px 6%}.sectionHeading{display:block;margin-bottom:30px}.sectionHeading h2{font-size:40px}.sectionNote{margin-top:22px;max-width:260px}.filters{gap:22px;overflow:auto;white-space:nowrap}.filters button{font-size:9px}.projectGrid{grid-template-columns:1fr;gap:10px}.projectCard{aspect-ratio:1.2}.cardCopy{left:24px;right:24px;bottom:20px}.cardCopy h3{font-size:28px}.services{grid-template-columns:1fr;gap:45px}.serviceIntro h2{font-size:48px}.serviceList article{gap:20px}.serviceList h3{font-size:28px}.studio{grid-template-columns:1fr}.studioPhoto{min-height:0;height:440px}.studioCopy{padding:70px 6%}.studioCopy h2{font-size:40px}.contact{padding-top:80px}.contactBottom{gap:25px;font-size:12px}.contactBottom p{max-width:170px}footer{padding:35px 6%;flex-wrap:wrap;gap:30px}footer>span{width:calc(50% - 30px);font-size:9px}.detailIntro{padding-top:55px}.detailFoot{gap:25px;align-items:start}.detailFoot>a{font-size:10px!important}.detailHeader{padding:25px 6%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.slide img{transform:none!important}}
/* MIPA brand gold, taken from the original site's heading and button styles. */
:root{--ink:#2b2721;--paper:#f8f6f1;--muted:#777065;--line:#ded6c6;--accent:#C4AD6C;--gold:#C4AD6C;--gold-text:#89713a}
.brand,.footerBrand{color:var(--gold)}.brand span{color:inherit}header.scrolled .brand,.detailHeader .brand,.footerBrand{color:var(--gold-text)}nav a:after{background:var(--gold)}nav a:hover,.headerActions button:hover{color:var(--gold)}button:focus-visible,a:focus-visible{outline-color:var(--gold)}.heroTop,.heroCaption>.eyebrow{color:#e6d8ad}.heroDiscover{color:#e6d8ad;border-bottom-color:var(--gold)}.scrollLink>span:last-child,.sliderControls button{color:var(--gold)}#dots button{border-color:var(--gold)}#dots button.active{background:var(--gold)}.section .eyebrow,.studioCopy .eyebrow,.detailIntro .eyebrow{color:var(--gold-text)}.filters button.active{color:var(--gold-text);border-color:var(--gold)}.projectCard .eyebrow,.cardCopy>span{color:#e6d8ad}.services{background:#eee9de}.serviceIntro>p:last-child,.serviceList p{color:#756c5d}.serviceList article{border-color:#d6cbb5}.serviceNumber,.serviceList article>span:last-child{color:var(--gold-text)}.studio{background:#2d2922;color:#f8f6f1}.studioCopy .eyebrow,.studioCopy .textLink{color:var(--gold)}.studioCopy>p:not(.eyebrow){color:#d3cbbc}.textLink{border-color:var(--gold)}.contactMail>span{color:var(--gold-text)}.contactMail:hover,.contactBottom a:hover,footer>a:last-child:hover{color:var(--gold-text)}#detailGallery img{background:#eee9de}
/* Main navigation stays collapsed until the menu button is activated. */
#menu{display:block;width:42px;height:42px}#menu span{transition:transform .25s}#menu span:first-child{box-shadow:0 8px 0 currentColor;margin-bottom:15px}#menu span:last-child{margin:0}header nav{display:none;position:absolute;top:100%;right:4.2%;left:auto;width:340px;max-width:calc(100vw - 8.4%);padding:35px;background:var(--paper);color:var(--ink);border:1px solid var(--line);flex-direction:column;align-items:stretch;gap:12px;box-shadow:0 20px 45px #0002}header.open nav{display:flex}header nav a{font-size:15px;padding:13px 0}header.open #menu span:first-child{box-shadow:none;transform:translateY(8px) rotate(45deg)}header.open #menu span:last-child{transform:translateY(-8px) rotate(-45deg)}@media(max-width:800px){header nav{right:6%;max-width:88vw;width:340px;padding:25px}}


/* Reference-led fullscreen project captions. */
.heroTop,.heroDiscover,.heroBottom>.scrollLink,.sliderControls>span,#prev,#next{display:none}.heroCaption{bottom:160px;display:flex;flex-direction:column;align-items:center;gap:11px}.heroCaption>a{order:0}.heroCaption>.eyebrow{order:1;color:#fff;font-size:12px;font-weight:400;letter-spacing:.3em}.heroCaption h1{font-family:Italiana,Georgia,serif;font-size:48px;font-weight:400;line-height:1.15;letter-spacing:.01em;text-transform:uppercase;margin:0}.heroBottom{bottom:62px;justify-content:center}.sliderControls{position:relative;justify-content:center;gap:0}#dots{gap:10px}#dots button{width:10px;height:10px;border:0;background:#fff;opacity:.9;position:relative}#dots button.active{background:transparent;outline:2px solid white;outline-offset:0;opacity:1}#dots button.active:after{content:'';position:absolute;inset:3px;border-radius:50%;background:white}#dots button:before{content:'';position:absolute;inset:-6px}#pause{position:absolute;left:calc(100% + 20px);font-size:12px;color:#fff;opacity:0;transition:opacity .2s}.sliderControls:hover #pause,#pause:focus-visible{opacity:1}.hero:after{background:linear-gradient(180deg,rgba(0,0,0,.2),transparent 50%,rgba(0,0,0,.24))}@media(max-width:800px){.heroCaption{bottom:160px;gap:10px}.heroCaption h1{font-size:36px}.heroCaption>.eyebrow{font-size:10px;letter-spacing:.25em}.heroBottom{bottom:62px}.sliderControls{flex-wrap:nowrap}#dots{gap:10px}#dots button{width:9px;height:9px}}@media(hover:none){#pause{opacity:.7}}
/* More readable typography across desktop and mobile. */
.brand span{font-size:9px}.headerActions button{font-size:13px}header nav a{font-size:18px}.eyebrow{font-size:12px}.sectionNote{font-size:16px;width:290px}.filters button{font-size:12px}.cardCopy .eyebrow{font-size:11px}.cardCopy h3{font-size:31px}.serviceIntro>p:last-child,.serviceList p,.studioCopy>p:not(.eyebrow){font-size:16px;line-height:1.85}.serviceNumber{font-size:12px}.textLink{font-size:14px}.contactBottom{font-size:16px}footer,footer>span{font-size:12px}.detailIntro>p:last-child{font-size:16px}.detailHeader button,.detailFoot>a:last-child{font-size:14px}.heroCaption h1{font-size:56px}.heroCaption>.eyebrow{font-size:14px}@media(max-width:800px){.brand span{font-size:8px}.sectionNote{font-size:15px}.filters button{font-size:11px}.cardCopy h3{font-size:30px}.heroCaption h1{font-size:42px}.heroCaption>.eyebrow{font-size:12px}.contactBottom{font-size:14px}.detailFoot>a{font-size:12px!important}footer>span{font-size:11px}}
/* Compact service cards with a comfortable reading width. */
.services{display:block;padding:80px max(5%,calc((100% - 1240px)/2));background:#eee9de}.serviceIntro{max-width:740px;margin-bottom:42px}.serviceIntro h2{font-size:48px;margin:18px 0 22px}.serviceIntro>p:last-child{max-width:620px;font-size:17px;line-height:1.75}.serviceList{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.serviceList article,.serviceList article:last-child{position:relative;display:flex;flex-direction:column;gap:27px;min-height:280px;padding:32px;background:#faf8f3;border:1px solid #dcd2bd;border-top:3px solid var(--gold);border-radius:8px;box-shadow:0 7px 22px #42351f06}.serviceNumber{font-size:14px;letter-spacing:.12em;color:var(--gold-text);padding:0}.serviceList h3{font-size:29px;line-height:1.25;letter-spacing:-.025em}.serviceList p{max-width:none;font-size:17px;line-height:1.7;margin-top:18px}.serviceList article>span:last-child{display:none}@media(max-width:1000px){.serviceList{gap:16px}.serviceList article,.serviceList article:last-child{padding:25px}.serviceList h3{font-size:25px}.serviceList p{font-size:16px}}@media(max-width:700px){.services{padding:60px 6%}.serviceIntro h2{font-size:38px}.serviceIntro>p:last-child{font-size:16px}.serviceList{grid-template-columns:1fr;gap:18px}.serviceList article,.serviceList article:last-child{min-height:0;padding:28px;gap:20px}.serviceList h3{font-size:29px}.serviceList p{font-size:17px;margin-top:14px}}

.brand{font-size:0;letter-spacing:0;line-height:0}.brand img{display:block;width:200px;height:auto;object-fit:contain}.scrolled .brand img,.detailHeader .brand img{width:150px}.footerBrand img{width:160px}@media(max-width:800px){.brand img{width:160px}.scrolled .brand img{width:130px}}

/* Fullscreen home and focused destination pages, following the reference. */
body[data-page="home"]{overflow:hidden}body:not([data-page="home"]) main{padding-top:110px;min-height:calc(100svh - 116px)}body:not([data-page="home"]) header{position:fixed;background:var(--paper);color:var(--ink)}body[data-page="projects"] .projects{padding-top:55px}.projectGrid{gap:12px}.projectCard{aspect-ratio:1.5}.cardCopy{left:26px;right:26px;bottom:22px}.cardCopy h3{font-size:27px}.studio{min-height:calc(100svh - 225px)}.studioPhoto{min-height:600px}.contact{max-width:1100px;margin:auto;padding-top:60px}.contact h2{font-size:68px;margin-bottom:35px}.contactMail{font-size:30px}.contactForm{margin-top:45px;border-top:1px solid var(--line);padding-top:28px}.formDemo{color:var(--muted);font-size:13px;margin-bottom:25px}.formFields{display:grid;grid-template-columns:1fr 1fr;gap:25px}.formFields label{display:flex;flex-direction:column;gap:10px;font-size:15px}.formFields .full{grid-column:1/-1}.formFields input,.formFields textarea{width:100%;border:1px solid #d5c9b2;background:#fcfbf7;border-radius:4px;padding:13px;font:inherit;font-size:17px;color:var(--ink)}.formFields input:focus,.formFields textarea:focus{outline:2px solid var(--gold);outline-offset:2px}.formTrap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.formSubmit{padding:15px 25px;margin-top:25px;border:1px solid var(--gold);border-radius:4px;background:var(--gold);color:#28231a;font-size:15px}.formSubmit:hover{background:#d5bf83}#formStatus{font-size:15px;line-height:1.7;margin-top:18px;color:var(--gold-text)}@media(max-width:800px){body:not([data-page="home"]) main{padding-top:92px}.projectCard{aspect-ratio:1.2}.contact h2{font-size:46px}.contactMail{font-size:25px}.formFields{grid-template-columns:1fr}.studioPhoto{min-height:0;height:400px}}

/* Complete project stories and responsive, optimised galleries. */
#detailNote{max-width:920px;display:grid;gap:18px;font-size:17px;line-height:1.85;color:var(--muted);margin-top:30px}#detailGallery{grid-template-columns:1fr 1fr;align-items:start}.galleryImage{display:block;border:0;background:#eee9de;padding:0;cursor:zoom-in;overflow:hidden}.galleryImage img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;transition:transform .5s}.galleryImage:hover img{transform:scale(1.015)}#photoViewer{background:#151510;color:white;overflow:hidden;padding:65px 70px;align-items:center;justify-content:center}#photoViewer[open]{display:flex}#photoLarge{display:block;max-width:100%;max-height:calc(100svh - 130px);object-fit:contain}.photoToolbar{position:absolute;top:15px;left:30px;right:25px;display:flex;justify-content:space-between;align-items:center}.photoToolbar button,#photoPrevious,#photoNext{background:none;border:0;color:white;font-size:32px;padding:10px}#photoPrevious,#photoNext{position:absolute;top:45%}#photoPrevious{left:12px}#photoNext{right:12px}.socialButtons{display:flex;gap:18px}.socialButtons button{padding:8px 0;border:0;border-bottom:1px solid var(--gold);background:none;color:var(--gold-text);font-size:13px}.homeSocial{position:absolute;z-index:3;bottom:20px;left:4.2%}.homeSocial button{color:white;font-size:11px}#socialDemo{padding:0 5% 60px}#socialDemo .detailHeader{padding:30px 0}#socialTitle{font-size:32px}#socialNotice{font-size:15px;color:var(--muted);margin:28px 0}#socialGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}#socialGrid img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}#socialGrid h3{font-size:25px;margin-top:18px}#socialGrid p{font-size:13px;color:var(--muted);margin-top:8px}
/* Expanded hover target, with a CSS fallback for the pointer interaction. */
#menu{position:relative;width:95px;padding-left:57px}#menu:before{content:'MENU';position:absolute;left:0;top:15px;font-size:12px;letter-spacing:.12em}#menu span{width:26px}.headerActions{position:relative}.headerActions:after{content:'';position:absolute;top:100%;right:0;width:100%;height:40px}header nav:before{content:'';position:absolute;top:-42px;right:0;width:150px;height:42px}@media(any-hover:hover){header:has(.headerActions:hover) nav,header nav:hover{display:flex}}@media(max-width:800px){#detailGallery{grid-template-columns:1fr}#detailNote{font-size:16px}#photoViewer{padding:65px 35px}#photoPrevious{left:0}#photoNext{right:0}#photoPrevious,#photoNext{font-size:25px;padding:5px}#socialGrid{grid-template-columns:1fr}#menu{width:85px;padding-left:49px}#menu:before{font-size:10px}.homeSocial{left:6%}}

/* Desktop navigation follows the reference: visible labels and hover dropdowns. */
.navGroup{position:relative}.navDropdown{display:none}.navDropdown a{display:block}.navGroup:hover>.navDropdown,.navGroup:focus-within>.navDropdown{display:block}.navDropdown{position:absolute;left:-22px;top:100%;min-width:225px;padding:15px 22px;background:var(--paper);border:1px solid var(--line);box-shadow:0 12px 30px #0002;color:var(--ink)}.navDropdown a{font-size:13px;padding:12px 0;letter-spacing:.09em;white-space:nowrap}.navGroup>a{display:block}.navGroup>a:before{content:'';position:absolute;right:-12px;top:45%;width:4px;height:4px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg)}
@media(min-width:801px){header{gap:35px}#menu{display:none!important}.headerActions:after,header nav:before{display:none}header nav,header.open nav,header:has(.headerActions:hover) nav,header nav:hover{display:flex;position:static;flex-direction:row;align-items:center;gap:38px;width:auto;max-width:none;padding:0;background:none;border:0;box-shadow:none;color:inherit;margin-left:auto}header nav>a,header .navGroup>a{font-size:14px;padding:18px 0;letter-spacing:.12em}.headerActions{flex-shrink:0}.brand img{width:180px}.navDropdown a:hover{color:var(--gold-text)}}
@media(max-width:800px){.navGroup{width:100%}.navDropdown{display:block;position:static;min-width:0;padding:0 0 8px 16px;border:0;border-left:1px solid var(--gold);box-shadow:none;margin-top:5px}.navDropdown a{font-size:12px;padding:9px 0}.navGroup>a:before{display:none}header nav{max-height:calc(100svh - 115px);overflow:auto}.navGroup>a{font-size:16px}}
/* A centred page frame and a larger, more comfortable type scale. */
html{background:#e7e2d8}body{max-width:1440px;margin:0 auto;background:var(--paper);box-shadow:0 0 50px #42351f0a}header,header.scrolled,body:not([data-page="home"]) header{width:min(100%,1440px);left:50%;transform:translateX(-50%);padding-left:50px;padding-right:50px}.section{padding-left:60px;padding-right:60px}.projects{max-width:1240px;margin:0 auto}.services{padding:65px 60px}.serviceIntro{max-width:820px}.serviceIntro>p:last-child{max-width:730px}.studioCopy{padding:65px 9%}.contact{max-width:1100px;padding-left:60px;padding-right:60px}.heroCaption h1{font-size:64px}.heroCaption>.eyebrow{font-size:15px}.eyebrow{font-size:14px}.sectionNote{font-size:18px;width:300px;line-height:1.75}.sectionHeading h2{font-size:50px}.filters button{font-size:14px}.cardCopy .eyebrow{font-size:13px}.cardCopy h3{font-size:32px}.serviceIntro h2{font-size:52px}.serviceIntro>p:last-child,.serviceList p,.studioCopy>p:not(.eyebrow){font-size:18px;line-height:1.8}.serviceList h3{font-size:32px}.serviceNumber{font-size:14px}.textLink{font-size:16px}.contactBottom{font-size:18px}.formFields label{font-size:17px}.formFields input,.formFields textarea{font-size:18px}.formDemo,#formStatus{font-size:15px}.formSubmit{font-size:17px}footer,footer>span{font-size:14px}.socialButtons button{font-size:15px}.homeSocial button{font-size:13px}#detailNote{font-size:19px;max-width:940px}.detailHeader button,.detailFoot>a:last-child{font-size:16px}@media(min-width:801px){header nav>a,header .navGroup>a{font-size:16px;letter-spacing:.07em}header nav{gap:30px}.navDropdown a{font-size:15px;letter-spacing:.04em}}@media(max-width:1000px){header,header.scrolled,body:not([data-page="home"]) header{padding-left:30px;padding-right:30px}.section,.services,.contact{padding-left:35px;padding-right:35px}header nav{gap:22px!important}header nav>a,header .navGroup>a{font-size:14px}.serviceList h3{font-size:27px}.serviceList p{font-size:17px}}@media(max-width:800px){body{width:100%;box-shadow:none}header,header.scrolled,body:not([data-page="home"]) header{padding-left:6%;padding-right:6%}.section,.services,.contact{padding-left:6%;padding-right:6%}.heroCaption h1{font-size:44px}.heroCaption>.eyebrow{font-size:13px}.sectionHeading h2,.serviceIntro h2{font-size:40px}.sectionNote{font-size:17px}.serviceIntro>p:last-child,.serviceList p,.studioCopy>p:not(.eyebrow){font-size:17px}.cardCopy h3{font-size:30px}.filters button{font-size:12px}.contactBottom{font-size:16px}#detailNote{font-size:17px}footer>span{font-size:12px}}

.slide img{transform:none!important;transition:none!important}.heroCaption{min-height:112px}

/* The complete original logo, framed around its transparent margins. */
:root{--header-height:100px}header,header.scrolled,body:not([data-page="home"]) header{height:var(--header-height);padding-top:18px;padding-bottom:18px;align-items:center;overflow:visible}.brand,.footerBrand{--logo-width:146px;position:relative;display:block;flex:0 0 var(--logo-width);width:var(--logo-width);height:calc(var(--logo-width)*190/478);overflow:hidden;line-height:normal;font-size:0}.brand img,.scrolled .brand img,.detailHeader .brand img,.footerBrand img{position:absolute;display:block;width:calc(var(--logo-width)*512/478);height:auto;max-width:none;left:calc(var(--logo-width)*-18/478);top:calc(var(--logo-width)*-182/478);object-fit:contain}.brand:focus-visible{outline-offset:5px}body:not([data-page="home"]) header,header.scrolled{background:#2d2922;color:#f8f6f1;border-bottom:1px solid #685c46}.detailHeader{background:#2d2922;color:#f8f6f1}.detailHeader .brand{--logo-width:132px}footer{background:#2d2922;color:#e5dfd1}.footerBrand{--logo-width:136px}footer .socialButtons button{color:#e6d8ad}body:not([data-page="home"]) main{padding-top:var(--header-height)}html{scroll-padding-top:var(--header-height)}#detailNote{max-width:72ch}.serviceNumber{display:none}.serviceList article{border-top-width:1px;border-radius:12px;box-shadow:none}.serviceIntro>.eyebrow,.sectionHeading>div>.eyebrow,.studioCopy>.eyebrow,.contact>.eyebrow{display:none}.sectionHeading h2,.serviceIntro h2{margin-top:0}.heroCaption h1{letter-spacing:0}.sectionHeading h2,.serviceIntro h2,.studioCopy h2,.contact h2{letter-spacing:-.03em}::selection{background:#c4ad6c;color:#211d16}input,textarea{caret-color:#89713a}a{ text-underline-offset:5px}.formSubmit{min-height:48px}.headerActions button{min-height:44px;min-width:44px}.socialButtons button{min-height:44px}.photoToolbar button,#photoPrevious,#photoNext{min-width:44px;min-height:44px}.galleryImage:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.navDropdown a{min-height:44px;line-height:1.4}.heroCaption>.eyebrow{color:white}.projectCard .eyebrow{color:white}.heroCaption a{display:block;padding:8px}.heroBottom{bottom:64px}#dots{gap:0}#dots button{box-sizing:content-box;width:10px;height:10px;padding:7px;background:transparent!important;border:0;border-radius:0;opacity:1;outline:0}#dots button:before{content:'';position:absolute;inset:7px;border-radius:50%;background:white}#dots button.active:before{background:transparent;border:2px solid white;inset:5px}#dots button.active:after{content:'';position:absolute;inset:9px;background:white;border-radius:50%}#dots button:focus-visible{outline:2px solid var(--gold);outline-offset:0}.contactMail{overflow-wrap:anywhere;gap:20px}.detailFoot{gap:25px}#socialGrid a:focus-visible{outline:2px solid var(--gold)}
@media(max-width:800px){:root{--header-height:88px}.brand{--logo-width:124px}.detailHeader .brand{--logo-width:120px}.footerBrand{--logo-width:126px}header nav{top:100%;max-height:calc(100svh - 105px)}.hero{min-height:520px}.heroCaption{bottom:150px}.heroCaption h1{font-size:clamp(32px,7.6vw,44px);text-wrap:balance}.heroCaption>.eyebrow{font-size:12px;letter-spacing:.18em}.homeSocial{bottom:12px}.homeSocial button{font-size:12px}.heroBottom{bottom:70px}.filters{gap:20px}.filters button{min-height:44px;flex-shrink:0}.sectionHeading{display:block}.sectionNote{width:auto;max-width:32ch}.serviceIntro h2,.sectionHeading h2{font-size:38px}.studioCopy h2{font-size:36px}.contact h2{font-size:44px}.contactMail{font-size:23px}.contactMail span{font-size:32px}.contactBottom{flex-wrap:wrap;gap:15px}.contactBottom p{max-width:none}footer{gap:22px}footer>span{width:auto}.detailHeader{padding:18px 6%;min-height:88px}.detailIntro{padding:38px 6% 36px}.detailIntro h2{font-size:42px;overflow-wrap:anywhere}.detailFoot{flex-direction:column;align-items:start}.textLink{font-size:15px}.serviceList article{padding:26px}.studioPhoto{height:330px}.formFields{gap:22px}}
@media(prefers-reduced-motion:reduce){.slide{transition:none}.galleryImage img{transition:none}}

:root{--gold-text:#78602c;--muted:#6b6359}.serviceIntro>p:last-child,.serviceList p{color:#655d51}#dots button.active{outline:0;border-radius:0}@media(max-width:800px){.navDropdown{padding-right:12px}}
.serviceList article,.serviceList article:last-child{border-top-width:1px}@media(max-width:800px){header nav,header nav:hover,header:has(.headerActions:hover) nav{display:none!important}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{display:flex!important}header nav>a,header .navGroup>a{font-size:16px}.navDropdown a{font-size:14px}}
.hero,#photoViewer{touch-action:pan-y}.hero img,#photoViewer img{user-select:none;-webkit-user-drag:none}.heroCaption a{-webkit-user-select:none;user-select:none}

.uiArrow{display:inline-block;width:20px;height:20px;vertical-align:middle;flex-shrink:0;margin-left:7px}.cardCopy>span .uiArrow{width:30px;height:30px;margin:0;color:#e6d8ad}.contactMail .uiArrow{width:34px;height:34px;margin:0}.sliderControls .uiArrow,#photoPrevious .uiArrow,#photoNext .uiArrow{width:26px;height:26px;margin:0}.textLink,.socialButtons button{display:inline-flex;align-items:center;gap:3px}.detailFoot>a:last-child{display:inline-flex;align-items:center}.projectCard{-webkit-tap-highlight-color:transparent}.filters{scrollbar-width:thin;scrollbar-color:#c4ad6c transparent}.filters::-webkit-scrollbar{height:4px}.filters::-webkit-scrollbar-thumb{background:#c4ad6c;border-radius:3px}

/* Main navigation opens from the centre of the header, independently of language. */
.menuTriggerZone{position:absolute;left:25%;top:0;width:50%;height:100%;display:flex;align-items:center;justify-content:center}.headerActions{margin-left:auto;z-index:2}.headerActions:after{display:none!important}#menu{display:flex!important;position:static;width:auto;height:auto;min-width:110px;min-height:46px;padding:12px 16px;align-items:center;justify-content:center;gap:0;border:0;background:none;color:inherit}#menu:before,#menu:after{display:none!important}#menu span,#menu span:first-child,#menu span:last-child,header.open #menu span:first-child,header.open #menu span:last-child{display:inline;width:auto;height:auto;margin:0;background:none;box-shadow:none;transform:none;font-size:13px;font-weight:400;letter-spacing:.18em;line-height:1.5}#menu span{border-bottom:1px solid var(--gold);padding-bottom:5px}header.open{background:#2d2922;color:#f8f6f1}header nav,header nav:hover,header:has(.headerActions:hover) nav{display:none!important;position:absolute!important;left:0!important;right:0!important;top:100%!important;width:100%!important;max-width:none!important;margin:0!important;padding:40px 50px!important;background:#2d2922!important;color:#f8f6f1!important;border:0!important;border-top:1px solid #685c46!important;box-shadow:0 20px 30px #0002!important;max-height:calc(100svh - var(--header-height));overflow:auto}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{display:grid!important;grid-template-columns:1.3fr 1.3fr 1fr 1fr;align-items:start;gap:32px!important}header nav:before{display:none!important}.navGroup>a:before{display:none}.navDropdown,.navGroup:hover>.navDropdown,.navGroup:focus-within>.navDropdown{display:block!important;position:static;left:auto;top:auto;background:none;color:#d6ccba;border:0;box-shadow:none;min-width:0;padding:12px 0 0;margin:0}.navDropdown a{font-size:15px;line-height:1.6;letter-spacing:.04em;padding:8px 0;min-height:40px;white-space:normal}header nav>a,header .navGroup>a{font-size:17px;letter-spacing:.08em;padding:0 0 12px}header nav a:hover{color:#e6d8ad}.navGroup{width:100%}@media(max-width:800px){.menuTriggerZone{left:40%;width:32%}#menu{min-width:90px;padding:10px 5px}#menu span{font-size:11px}header nav{padding:28px 6%!important}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{display:grid!important;grid-template-columns:1fr 1fr;gap:28px!important}.navDropdown a{font-size:14px}header nav>a,header .navGroup>a{font-size:15px}}

/* Full-bleed slideshow; navigation reveals one level at a time. */
body[data-page="home"]{width:100%;max-width:none;margin:0;box-shadow:none}body[data-page="home"] header{width:100%;max-width:none}body[data-page="home"] .hero{width:100%;max-width:none}.navDropdown,.navGroup:hover>.navDropdown,.navGroup:focus-within>.navDropdown{display:none!important}.navGroup.subOpen>.navDropdown{display:block!important}.navLevelTrigger{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:0 0 12px;border:0;background:none;color:inherit;font-size:17px;font-weight:300;letter-spacing:.08em;text-transform:uppercase;text-align:left}.navLevelTrigger:after{content:'';display:block;width:6px;height:6px;border-right:1px solid var(--gold);border-bottom:1px solid var(--gold);transform:rotate(45deg);margin-top:-4px;transition:transform .2s}.navLevelTrigger[aria-expanded="true"]:after{transform:rotate(225deg);margin-top:4px}.navLevelTrigger:hover{color:#e6d8ad}.navDropdown{padding-top:8px}.navDropdown a{min-height:44px}header nav>a{min-height:44px;display:flex;align-items:flex-start;padding-top:10px}@media(max-width:800px){header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{grid-template-columns:1fr;gap:14px!important}.navLevelTrigger{font-size:16px;padding:8px 0}.navDropdown{padding:8px 0 8px 18px}.navDropdown a{font-size:14px}header nav>a{font-size:16px;padding:12px 0}}

/* Match the visible browser viewport, including mobile browser-bar changes. */
body[data-page="home"]{height:100vh;height:100dvh;width:100%;max-width:none;overflow:hidden}body[data-page="home"] main{height:100%;padding:0;margin:0}body[data-page="home"] .hero{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;min-height:0;margin:0;max-width:none}body[data-page="home"] header{position:fixed;z-index:50;width:100vw}body[data-page="home"] .heroBottom{bottom:calc(62px + env(safe-area-inset-bottom,0px))}body[data-page="home"] .homeSocial{bottom:calc(12px + env(safe-area-inset-bottom,0px))}
@media(max-width:800px){header,header.scrolled,body:not([data-page="home"]) header,body[data-page="home"] header{display:grid;grid-template-columns:112px minmax(0,1fr) 44px;gap:8px;padding-left:16px;padding-right:16px;height:calc(88px + env(safe-area-inset-top,0px));padding-top:calc(12px + env(safe-area-inset-top,0px));padding-bottom:12px;background:#2d2922;color:#fff}.brand{--logo-width:112px}.menuTriggerZone{position:static;left:auto;top:auto;width:auto;height:auto;min-width:0;display:flex;align-items:center;justify-content:center;margin:0;z-index:2}.headerActions{position:static;margin:0;width:44px;display:flex;justify-content:center;z-index:3}#menu{display:flex!important;min-width:106px;width:auto;height:44px;min-height:44px;margin:0;padding:10px 12px;border:1px solid #c4ad6c;background:transparent;color:#fff;border-radius:3px}#menu span{font-size:12px;letter-spacing:.1em;border:0;padding:0}#language{min-width:44px;min-height:44px;padding:8px;font-size:13px;color:#fff}header nav{top:100%!important;max-height:calc(100dvh - 88px - env(safe-area-inset-top,0px));z-index:4}body[data-page="home"] .heroCaption{bottom:calc(150px + env(safe-area-inset-bottom,0px));left:6%;right:6%}body:not([data-page="home"]) main{padding-top:calc(88px + env(safe-area-inset-top,0px))}}
@media(max-width:350px){header,header.scrolled,body:not([data-page="home"]) header,body[data-page="home"] header{grid-template-columns:98px minmax(0,1fr) 40px;gap:5px;padding-left:12px;padding-right:12px}.brand{--logo-width:98px}#menu{min-width:96px;padding:8px}#menu span{font-size:11px}}
/* A compact navigation panel, independent of the full-screen slideshow. */
header nav,header nav:hover,header:has(.headerActions:hover) nav{left:50%!important;right:auto!important;transform:translateX(-50%);width:680px!important;max-width:calc(100vw - 48px)!important;padding:28px 32px!important;border:1px solid #685c46!important;border-radius:6px;background:#2d2922!important;box-shadow:0 18px 40px #0003!important}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{grid-template-columns:1fr 1fr;gap:14px 36px!important}header nav>a,.navLevelTrigger{font-size:16px;letter-spacing:.07em;min-height:44px}.navGroup.subOpen{grid-row:span 2}.navDropdown{border-top:1px solid #685c46;padding:12px 0 0}.navDropdown a{font-size:14px;color:#d6ccba}.navDropdown a:hover{color:#fff}.menuTriggerZone:after{content:'';position:absolute;top:100%;left:0;right:0;height:8px}header.open{background:transparent}body:not([data-page="home"]) header.open,header.scrolled.open{background:#2d2922}
@media(max-width:800px){header nav,header nav:hover,header:has(.headerActions:hover) nav{width:360px!important;max-width:calc(100vw - 28px)!important;padding:20px 24px!important}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{grid-template-columns:1fr;gap:8px!important}.navGroup.subOpen{grid-row:auto}.navDropdown{padding:8px 0 4px 14px}header.open,body[data-page="home"] header.open{background:#2d2922}.menuTriggerZone:after{display:none}}
/* Desktop main navigation fits on a single content-sized row. */
@media(min-width:801px){header nav,header nav:hover,header:has(.headerActions:hover) nav{width:640px!important;max-width:calc(100vw - 48px)!important;padding:18px 26px!important;overflow:visible}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{grid-template-columns:repeat(4,max-content)!important;justify-content:space-between;align-items:start;gap:22px!important}.navGroup.subOpen{grid-row:auto}.navGroup{position:relative;width:auto}.navLevelTrigger,header nav>a{font-size:15px;letter-spacing:.05em;white-space:nowrap;min-height:42px;padding:10px 0}.navDropdown,.navGroup.subOpen>.navDropdown{position:absolute;top:100%;left:-20px;min-width:210px;padding:12px 20px;border:1px solid #685c46;border-radius:4px;background:#2d2922;box-shadow:0 12px 24px #0002;margin-top:0;z-index:5}.navDropdown a{font-size:14px;white-space:nowrap;min-height:42px}.navLevelTrigger{gap:9px}}
/* Light floating navigation: one row, with quiet gold details. */
@media(min-width:801px){header nav,header nav:hover,header:has(.headerActions:hover) nav{width:max-content!important;max-width:calc(100vw - 48px)!important;padding:10px 14px!important;top:calc(100% - 6px)!important;background:#faf8f2!important;color:#302b23!important;border:1px solid #e4dccb!important;border-radius:12px;box-shadow:0 12px 30px #17130b24!important}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{gap:6px!important;grid-template-columns:repeat(4,max-content)!important;align-items:center}.navGroup{width:auto}.navLevelTrigger,header nav>a{font-family:'DM Sans',Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:.04em;min-height:44px;padding:12px 17px;border-radius:7px;align-items:center;transition:background .18s,color .18s}.navLevelTrigger:hover,header nav>a:hover,.navGroup.subOpen>.navLevelTrigger{background:#eee8da;color:#78602c}.navLevelTrigger:after{width:5px;height:5px;border-color:#89713a}.navDropdown,.navGroup.subOpen>.navDropdown{top:calc(100% + 10px);left:0;min-width:220px;padding:10px;border:1px solid #e4dccb;border-radius:10px;background:#faf8f2;color:#302b23;box-shadow:0 12px 28px #17130b24}.navDropdown:before{content:'';position:absolute;top:-12px;left:0;right:0;height:14px}.navDropdown a{font-size:14px;font-weight:400;letter-spacing:.02em;padding:11px 14px;color:#5b5143;border-radius:6px;min-height:44px;text-transform:none}.navDropdown a:hover{background:#eee8da;color:#78602c}.navGroup.subOpen>.navLevelTrigger:after{transform:rotate(225deg)}#menu span{letter-spacing:.15em}header.open #menu span{color:#e6d8ad;border-color:#e6d8ad}}
@media(max-width:800px){header nav,header nav:hover,header:has(.headerActions:hover) nav{background:#faf8f2!important;color:#302b23!important;border:1px solid #e4dccb!important;border-radius:10px;padding:15px!important;box-shadow:0 12px 28px #17130b24!important}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{gap:4px!important}.navLevelTrigger,header nav>a{padding:12px 14px;min-height:48px;font-size:15px;font-weight:400;letter-spacing:.04em;border-radius:6px}.navLevelTrigger:hover,header nav>a:hover,.navGroup.subOpen>.navLevelTrigger{color:#78602c;background:#eee8da}.navDropdown,.navGroup.subOpen>.navDropdown{margin:0 12px;padding:5px 0 8px 12px;background:none;color:#5b5143;border-top:1px solid #e4dccb}.navDropdown a{font-size:14px;text-transform:none;letter-spacing:.02em;color:#5b5143;padding:11px 8px}.navDropdown a:hover{color:#78602c}.navLevelTrigger:after{border-color:#89713a}}
/* XBD-style desktop reveal: the navigation belongs to the header itself. */
@media(min-width:801px){header,header.scrolled,body:not([data-page="home"]) header,body[data-page="home"] header{display:grid;grid-template-columns:146px minmax(0,1fr) 60px;align-items:center;gap:28px;transition:background .25s,color .25s}.menuTriggerZone{display:none!important}.headerActions{grid-column:3;margin:0;justify-self:end}header nav,header nav:hover,header:has(.headerActions:hover) nav{display:flex!important;position:static!important;left:auto!important;right:auto!important;top:auto!important;transform:none;width:auto!important;max-width:none!important;min-height:0;height:100%;padding:0!important;margin:0!important;border:0!important;border-radius:0;background:none!important;color:inherit!important;box-shadow:none!important;overflow:visible;visibility:hidden;opacity:0;pointer-events:none;justify-content:center;gap:34px!important;transition:opacity .25s}header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{display:flex!important;visibility:visible;opacity:1;pointer-events:auto;justify-content:center;align-items:center;gap:34px!important}header.open,header.scrolled.open,body:not([data-page="home"]) header.open,body[data-page="home"] header.open{background:rgba(250,248,242,.96)!important;color:#302b23;border-bottom:1px solid #e6dfd1}header.open .brand img{filter:grayscale(1) brightness(.18)}.navGroup{position:static;width:auto;height:100%;display:flex;align-items:center}.navLevelTrigger,header nav>a{font-size:14px;font-weight:400;letter-spacing:.055em;padding:12px 0;min-height:44px;border-radius:0;background:none!important;color:inherit;white-space:nowrap}.navLevelTrigger:hover,header nav>a:hover,.navGroup.subOpen>.navLevelTrigger{color:#89713a!important;background:none!important}.navLevelTrigger:after{display:none}.navGroup.subOpen>.navLevelTrigger{box-shadow:0 1px 0 #89713a}.navDropdown,.navGroup:hover>.navDropdown,.navGroup:focus-within>.navDropdown{display:none!important;position:fixed;top:var(--header-height);left:0;right:0;width:100%;min-width:0;max-width:none;margin:0;padding:10px 30px;background:rgba(250,248,242,.96);color:#302b23;border:0;border-top:1px solid #e6dfd1;border-radius:0;box-shadow:none;justify-content:center;align-items:center;gap:28px;z-index:5}.navGroup.subOpen>.navDropdown{display:flex!important}.navDropdown:before{display:none}.navDropdown a{padding:8px 0;min-height:40px;font-size:13px;letter-spacing:.025em;white-space:nowrap;color:#302b23;background:none!important}.navDropdown a:hover{color:#89713a!important}.headerActions #language{color:inherit}}
@media(min-width:801px) and (max-width:1050px){header nav,header.open nav,header.open nav:hover,header.open:has(.headerActions:hover) nav{gap:22px!important}.navLevelTrigger,header nav>a{font-size:13px;letter-spacing:.02em}}

/* One discreet downward cue; menu-item emphasis is an underline only. */
.menuCue{display:block;width:15px;height:15px;flex-shrink:0;color:var(--gold);margin-left:9px}#menu{gap:0}.navLevelTrigger,.navLevelTrigger:hover,.navLevelTrigger:focus,.navLevelTrigger:focus-visible,.navLevelTrigger:active{border:0!important;border-left:0!important;border-right:0!important;outline:0!important;box-shadow:none!important}.navGroup.subOpen>.navLevelTrigger,.navLevelTrigger:focus-visible{box-shadow:0 1px 0 #89713a!important}.navDropdown{border-left:0!important}.navDropdown a:focus-visible{outline:0;box-shadow:0 1px 0 #89713a}
@media(min-width:801px){.menuTriggerZone{display:flex!important;position:absolute;top:0;left:50%;transform:translateX(-50%);width:auto;min-width:140px;height:100%;align-items:center;justify-content:center;opacity:1;visibility:visible;transition:opacity .18s}.menuTriggerZone:after{display:none}#menu{display:flex!important;min-width:130px;min-height:46px;padding:10px 12px;color:inherit}#menu span{font-size:11px;font-weight:400;letter-spacing:.15em;border:0;padding:0}.headerActions{position:relative;z-index:6}header.open .menuTriggerZone{opacity:0;visibility:hidden;pointer-events:none}header.open nav .navLevelTrigger{box-shadow:none!important}header.open nav .navGroup.subOpen>.navLevelTrigger,header.open nav .navLevelTrigger:focus-visible{box-shadow:0 1px 0 #89713a!important}}
@media(max-width:800px){#menu{padding:9px 10px}.menuCue{width:13px;height:13px;margin-left:7px}}
/* The mobile home header sits transparently over the slideshow. */
@media(max-width:800px){body[data-page="home"] header,body[data-page="home"] header.open,body[data-page="home"] header.scrolled{background:transparent!important;border-bottom:0;box-shadow:none}body[data-page="home"] header .brand img{filter:none}body[data-page="home"] header #menu,body[data-page="home"] header #language{color:#fff}}
/* Navigation emphasis is a bottom rule only, at every level. */
#mainNavigation,#mainNavigation .navGroup,#mainNavigation .navDropdown,#mainNavigation .navLevelTrigger,#mainNavigation a{border-left:0!important;border-right:0!important;outline:none!important}#mainNavigation .navLevelTrigger,#mainNavigation .navLevelTrigger:hover,#mainNavigation .navLevelTrigger:focus,#mainNavigation .navLevelTrigger:focus-visible,#mainNavigation a,#mainNavigation a:hover,#mainNavigation a:focus,#mainNavigation a:focus-visible{border-top:0!important;border-left:0!important;border-right:0!important;box-shadow:none!important;outline:none!important}#mainNavigation .navLevelTrigger,#mainNavigation a{border-bottom:1px solid transparent!important}#mainNavigation .navGroup.subOpen>.navLevelTrigger,#mainNavigation .navLevelTrigger:hover,#mainNavigation .navLevelTrigger:focus-visible,#mainNavigation a:hover,#mainNavigation a:focus-visible{border-bottom-color:#89713a!important;box-shadow:none!important}#mainNavigation .navDropdown:before,#mainNavigation .navGroup:before,#mainNavigation a:before{border-left:0!important;box-shadow:none!important}

.mobileMenuIcon{display:none}@media(max-width:800px){#menu{width:48px;min-width:48px;height:48px;min-height:48px;padding:12px;border:0;background:transparent;border-radius:0}#menu [data-menu-label],#menu .menuCue{display:none!important}#menu .mobileMenuIcon{display:block;width:26px;height:26px;color:inherit}header.open #menu .mobileMenuIcon{transform:rotate(90deg);transition:transform .2s}.menuTriggerZone{justify-content:center}}

.mobileMenuClose{display:none}@media(max-width:800px){header.open #menu .mobileMenuIcon{transform:none}header.open .mobileMenuLines{display:none}header.open .mobileMenuClose{display:block}}

/* Exact font families identified on the XBD reference. */
:root{--font-body:"DM Sans",Arial,sans-serif;--font-heading:"Manrope",Arial,sans-serif;--font-menu:"DM Sans",Arial,sans-serif}body,input,textarea,button{font-family:var(--font-body);font-weight:400}h1,h2,h3,.heroCaption h1,.cardCopy h3,.serviceList h3{font-family:var(--font-heading);font-weight:400}#mainNavigation,#mainNavigation a,#mainNavigation button,.navLevelTrigger,header nav>a,header .navGroup>a,.headerActions button,#menu span{font-family:var(--font-menu);font-weight:400}.heroCaption>.eyebrow,.eyebrow,.filters button,.sectionNote,#detailNote,.contactMail{font-family:var(--font-body)}
@media(min-width:801px){.navDropdown:before{display:block!important;content:'';position:absolute;left:0;right:0;top:-12px;height:14px;border:0!important;background:transparent;box-shadow:none!important}.navGroup.subOpen>.navDropdown{pointer-events:auto}#mainNavigation{isolation:isolate}}

/* Anchor desktop sublevels to the actual header edge, overriding old card offsets. */
@media(min-width:801px){
#header #mainNavigation .navGroup>.navDropdown{position:absolute;top:100%;left:0;right:0;width:100%;margin:0;transform:none;min-width:0;border-radius:0}
#header #mainNavigation .navDropdown:before{top:-2px;height:3px}
}
/* Extend only section backgrounds beyond the existing centered content box. */
html{background:var(--paper);overflow-x:clip}
body{box-shadow:none}
.services,.studio,body>footer{box-shadow:0 0 0 100vmax var(--section-background);clip-path:inset(0 -100vmax)}
.services{--section-background:#eee9de}
.studio,body>footer{--section-background:#2d2922}
#header:before{content:'';position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:inherit;pointer-events:none;z-index:-1;border-bottom:inherit}

@media(min-width:801px){#header #mainNavigation .navDropdown:after{content:'';position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:inherit;z-index:-1;pointer-events:none}}

/* Inner pages use persistent desktop navigation; only home reveals on hover. */
@media(min-width:801px){
body:not([data-page="home"]) #header{background:#faf8f2!important;color:#302b23;border-bottom:1px solid #e6dfd1}
body:not([data-page="home"]) #header #mainNavigation{visibility:visible;opacity:1;pointer-events:auto}

body:not([data-page="home"]) #header .brand img{filter:grayscale(1) brightness(.18)}
}

/* Use the existing bottom border as the single navigation underline. */
#mainNavigation a:after,#mainNavigation .navLevelTrigger:after{display:none!important;content:none!important}

/* Keep submenu underlines straight, matching the main navigation. */
#mainNavigation .navDropdown a{border-radius:0!important}

/* Project view: quiet light header, readable text and a compact photo index. */
#projectDialog{background:var(--paper);scrollbar-color:#c4ad6c var(--paper)}
#projectDialog .detailHeader{position:sticky;top:0;z-index:4;background:var(--paper);color:var(--ink);padding:20px max(24px,calc((100% - 1280px)/2));min-height:88px;border-bottom:1px solid var(--line)}
#projectDialog .detailHeader .brand img{filter:grayscale(1) brightness(.18)}
#projectDialog .detailHeader button{min-height:44px;padding:10px 0 10px 20px;font-size:15px}
#projectDialog .detailHeader .brand{outline:none}
.projectLayout{max-width:1360px;margin:0 auto;padding:56px 40px 64px;display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.65fr);gap:64px;align-items:start}
#projectDialog .detailIntro{padding:0;min-width:0}
#projectDialog .detailIntro h2{font-size:clamp(36px,3.8vw,56px);line-height:1.1;letter-spacing:-.02em;margin:0 0 16px;text-wrap:balance;overflow-wrap:anywhere}
.projectMeta{font-size:14px;line-height:1.5;color:var(--gold-text);margin-bottom:28px}
#projectDialog #detailNote{font-size:18px;line-height:1.75;margin:0;max-width:65ch;color:#655d51}
#projectDialog #detailNote p{margin:0 0 20px}
#projectDialog #detailGallery{padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
#projectDialog .galleryImage{width:100%;aspect-ratio:4/3;border-radius:0;background:#eee9de}
#projectDialog .galleryImage img{width:100%;height:100%;max-height:none;object-fit:cover}
#projectDialog .detailFoot{max-width:1360px;margin:auto;padding:32px 40px 48px;border-top:1px solid var(--line)}
@media(max-width:1000px){.projectLayout{grid-template-columns:1fr;gap:32px;padding:36px 28px 48px}#projectDialog .detailIntro{max-width:720px}#projectDialog .detailIntro h2{font-size:42px}#projectDialog .detailFoot{padding:28px}}
@media(max-width:600px){.projectLayout{padding:28px 20px 36px;gap:28px}#projectDialog .detailHeader{padding:14px 20px;min-height:80px}#projectDialog .detailIntro h2{font-size:36px}#projectDialog #detailNote{font-size:17px;line-height:1.7}#projectDialog #detailGallery{gap:10px}#projectDialog .detailFoot{padding:24px 20px 36px}.projectMeta{margin-bottom:24px}}

.projectPhotos{min-width:0}#detailGallery{scroll-margin-top:110px}.galleryPagination{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:24px;font-size:14px;color:#655d51}.galleryPagination button{background:none;border:0;border-bottom:1px solid var(--gold);border-radius:0;min-height:44px;padding:8px 0;color:var(--ink);min-width:80px}.galleryPagination button:hover{color:var(--gold-text)}.galleryPagination button:disabled{opacity:.35;cursor:default;border-color:transparent}.galleryPagination span{white-space:nowrap}@media(max-width:600px){.galleryPagination{gap:8px;font-size:13px;padding-top:16px}.galleryPagination button{min-width:72px}}

/* Consistent inner-page navigation and a compact contact composition. */
body:not([data-page="home"]) #header,body:not([data-page="home"]) #header.open{background:#faf8f2!important;color:#302b23;border-bottom:1px solid var(--line)}
body:not([data-page="home"]) #header .brand img{filter:grayscale(1) brightness(.18)}
body:not([data-page="home"]) #header #menu,body:not([data-page="home"]) #header #language{color:#302b23}
#mainNavigation [aria-current="page"]{color:var(--gold-text)!important;border-bottom-color:#89713a!important}
.serviceList article,.serviceList article:last-child{min-height:220px;gap:16px;padding:28px}
.serviceList p{margin-top:12px;max-width:36ch}
.contact{max-width:1280px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px;padding-top:64px;padding-bottom:72px;align-items:start}
.contactIntro{min-width:0}.contactIntro>.eyebrow{display:none}
.contact h2{font-size:clamp(40px,4.5vw,60px);margin:0 0 36px;line-height:1.12}
.contactMail{font-size:28px;padding-bottom:20px}
.contact .contactForm{margin:0;padding-top:0;border-top:0}
.contact .contactBottom{display:flex;flex-direction:column;align-items:start;gap:16px;padding-top:24px;font-size:18px}
.contact .contactBottom p{max-width:30ch;line-height:1.65}
.contact .contactBottom a{padding:4px 0;min-height:44px;display:inline-flex;align-items:center}
.contact .formFields{gap:24px 20px}.contact .formDemo{line-height:1.6;margin-bottom:24px}
.contact .formSubmit{min-height:48px}.contact input,.contact textarea{border-radius:0}
@media(max-width:1000px){.contact{gap:40px;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);padding-left:32px;padding-right:32px}.contact .formFields{grid-template-columns:1fr}.contact h2{font-size:44px}.contactMail{font-size:25px}}
@media(max-width:800px){.contact{grid-template-columns:1fr;padding:40px 6% 48px;gap:32px}.contact h2{font-size:42px;margin-bottom:28px}.contact .contactBottom{gap:8px;padding-top:20px;font-size:17px}.contact .contactForm{border-top:1px solid var(--line);padding-top:28px}.filters{flex-wrap:wrap;white-space:normal;overflow:visible;gap:4px 22px;padding-bottom:20px}.filters button{font-size:12px;letter-spacing:.08em;flex-shrink:1}.serviceList article,.serviceList article:last-child{min-height:0;padding:24px}.serviceList h3{font-size:28px}.services{padding-top:40px;padding-bottom:48px}.serviceIntro{margin-bottom:28px}.studioCopy{padding-top:44px;padding-bottom:48px}.studioPhoto{height:300px}.studioCopy h2{text-wrap:balance}.sectionHeading h2{text-wrap:balance}}

/* Transparent navigation, with the brand aligned right as on XBD. */
body #header,body #header.open,body #header.scrolled,body:not([data-page="home"]) #header,body:not([data-page="home"]) #header.open,body[data-page="home"] #header.open{background:transparent!important;box-shadow:none!important;border-bottom:0!important;backdrop-filter:none}
#header:before,#header #mainNavigation .navDropdown:after{display:none!important}
body #header #mainNavigation,body #header.open #mainNavigation,body #header #mainNavigation:hover,body #header:has(.headerActions:hover) #mainNavigation,body #header #mainNavigation .navDropdown{background:transparent!important;box-shadow:none!important;border:0!important;backdrop-filter:none}
#header #mainNavigation .navLevelTrigger,#header #mainNavigation a{background:transparent!important}
body[data-page="home"] #header,body[data-page="home"] #header.open{color:white!important}
body[data-page="home"] #header.open .brand img{filter:none}
body[data-page="home"] #header #mainNavigation a,body[data-page="home"] #header #mainNavigation .navLevelTrigger,body[data-page="home"] #header #language{color:white!important}
@media(min-width:801px){body #header{grid-template-columns:60px minmax(0,1fr) 146px}#header .brand{grid-column:3;grid-row:1;justify-self:end}#header .headerActions{grid-column:1;grid-row:1;justify-self:start}#header #mainNavigation{grid-column:2;grid-row:1}}
@media(max-width:800px){body #header{grid-template-columns:44px minmax(0,1fr) 112px}#header .brand{grid-column:3;grid-row:1;justify-self:end}#header .headerActions{grid-column:1;grid-row:1;justify-self:start}#header .menuTriggerZone{grid-column:2;grid-row:1}body #header.open{height:auto;min-height:88px;position:sticky;top:0}body #header.open #mainNavigation{position:static;grid-column:1/-1;grid-row:2;width:100%;max-width:none;max-height:calc(100dvh - 100px);margin:0;padding:12px 0!important;border-radius:0}body:not([data-page="home"]):has(#header.open) main{padding-top:0}#header .navDropdown{margin:0 12px;padding:4px 0 8px 12px}body[data-page="home"] #header .navDropdown a{color:white!important}}

#projectDialog .detailHeader{background:transparent;flex-direction:row-reverse;border-bottom:0}

@media(max-width:800px){body #header.open #mainNavigation{transform:none!important;left:auto!important;right:auto!important;justify-self:stretch;grid-template-columns:1fr!important;gap:4px!important}}

@media(max-width:800px){body #header.open{left:0!important;transform:none!important;width:100%;max-width:none}}

@media(max-width:800px){body #header.open{height:auto!important;grid-template-rows:64px auto}body #header.open #mainNavigation{position:static!important;width:100%!important;height:auto!important;border:0!important;border-radius:0!important;box-shadow:none!important}body #header.open #mainNavigation .navGroup{width:100%;height:auto}body #header.open #mainNavigation .navDropdown{position:static!important;width:auto!important;transform:none!important;margin:0 12px!important;min-width:0!important;box-shadow:none!important;border:0!important;border-radius:0!important}}

#header #mainNavigation .navLevelTrigger,#header #mainNavigation a{border-radius:0!important}

.crewCredit{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-size:12px;line-height:1.5;text-transform:none;letter-spacing:0;color:inherit;white-space:nowrap}.crewCredit svg{width:13px;height:13px;stroke:var(--gold);stroke-width:1.5;fill:none}.crewCredit strong{font-weight:500}.crewCredit:hover strong{text-decoration:underline}.homeCredit{position:absolute;z-index:3;right:4.2%;bottom:20px;color:#fff}body>footer{flex-wrap:wrap;gap:24px}body>footer .crewCredit{flex-basis:100%;border-top:1px solid #675d4c;padding-top:20px;color:#e6d8ad}#detailVideo{margin-top:12px;font-size:15px}@media(max-width:800px){.homeCredit{left:0;right:0;bottom:12px;font-size:11px}body[data-page="home"] .homeSocial{bottom:46px}body[data-page="home"] .heroBottom{bottom:92px}.heroCaption{bottom:180px}}

body>footer .clientLogin{font-size:12px;color:#e6d8ad;margin-left:auto}#header #mainNavigation .navDropdown{flex-wrap:wrap}

.portfolioEmpty{grid-column:1/-1;padding:32px 0;font-size:18px;color:var(--muted)}

/* Original full logo left; the original house mark alone on the right. */
.brandHouse{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;flex-shrink:0}
.houseCrop{--house-size:40px;position:relative;display:block;width:var(--house-size);height:var(--house-size);overflow:hidden}
.houseCrop img{position:absolute;width:calc(var(--house-size)*512/116);height:auto;max-width:none;left:calc(var(--house-size)*-22/116);top:calc(var(--house-size)*-190/116)}
body:not([data-page="home"]) #header .brandHouse img,#projectDialog .brandHouse img{filter:grayscale(1) brightness(.18)}
body[data-page="home"] #header .brandHouse img{filter:none}
#header .brand{grid-column:1;grid-row:1;justify-self:start}
#header .headerActions{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:20px;justify-content:flex-end}
@media(min-width:801px){body #header{grid-template-columns:146px minmax(0,1fr) 146px}}
@media(max-width:800px){body #header{grid-template-columns:112px minmax(0,1fr) 96px}#header .headerActions{gap:4px}.houseCrop{--house-size:30px}#header .headerActions #language{padding:8px;min-width:44px;min-height:44px}}
@media(max-width:350px){body #header{grid-template-columns:98px minmax(0,1fr) 92px;gap:4px}}
#projectDialog .detailHeader{flex-direction:row;gap:24px}.detailActions{display:flex;align-items:center;gap:20px}#projectDialog .detailActions button{padding:8px;min-height:44px}
@media(max-width:600px){#projectDialog .detailHeader{gap:12px}.detailActions{gap:8px}#projectDialog .detailActions button{font-size:13px}}

/* The house mark is the menu trigger at every viewport size. */
#header .menuTriggerZone,#header.open .menuTriggerZone{position:static!important;transform:none!important;display:flex!important;width:auto;min-width:0;height:auto;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
#header #menu{display:inline-flex!important;min-width:44px;width:44px;min-height:44px;height:44px;padding:2px;border:0;background:none;border-radius:0}
#header #menu .houseCrop,#header.open #menu .houseCrop{display:block!important;box-shadow:none!important;transform:none!important;margin:0!important;padding:0!important;border:0!important;height:var(--house-size);width:var(--house-size)}
#header.open #menu .houseCrop{opacity:.8}
#detailMenu{border:0;background:none;padding:2px!important;min-width:44px;min-height:44px}
.detailNavigation{display:flex;justify-content:center;flex-wrap:wrap;gap:24px;padding:16px 24px;font-family:var(--font-menu);font-size:14px}.detailNavigation a{padding:8px 0;border-bottom:1px solid transparent}.detailNavigation a:hover,.detailNavigation a:focus-visible{border-bottom-color:var(--gold-text)}

/* A white house trigger over photography, with a restrained CSS chevron. */
body[data-page="home"] #header #menu .houseCrop img{filter:brightness(0) invert(1)!important}
#header #menu .mobileMenuIcon,#header #menu .menuCue{display:none!important}
#header #menu,#detailMenu{position:relative}
#header #menu:before,#detailMenu:before{display:none!important;content:none!important}
#header #menu:after,#detailMenu:after{content:'';display:block!important;position:absolute;left:50%;bottom:-5px;width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translate(-50%,0) rotate(45deg);transition:transform .2s ease;pointer-events:none}
#header #menu:hover:after,#detailMenu:hover:after{transform:translate(-50%,2px) rotate(45deg)}
#header #menu[aria-expanded="true"]:after,#detailMenu[aria-expanded="true"]:after{transform:translate(-50%,2px) rotate(225deg)}
/* Separate language control from the house; use a quiet opacity cue. */
#header .headerActions{gap:32px}
#header #menu:after,#detailMenu:after{display:none!important;content:none!important}
@keyframes houseMenuFade{0%,100%{opacity:1}50%{opacity:.55}}
#header #menu .houseCrop,#detailMenu .houseCrop{animation:houseMenuFade 4s ease-in-out infinite}
#header #menu:hover .houseCrop,#header #menu:focus-visible .houseCrop,#header #menu[aria-expanded="true"] .houseCrop,#detailMenu:hover .houseCrop,#detailMenu:focus-visible .houseCrop,#detailMenu[aria-expanded="true"] .houseCrop{animation:none;opacity:1!important}
@media(max-width:800px){body #header{grid-template-columns:112px minmax(0,1fr) 112px}#header .headerActions{gap:20px}}
@media(max-width:350px){body #header{grid-template-columns:98px minmax(0,1fr) 104px}#header .headerActions{gap:16px}}
@media(prefers-reduced-motion:reduce){#header #menu .houseCrop,#detailMenu .houseCrop{animation:none;opacity:1}}
/* Mobile menu: parent above its submenu, with comfortable inset spacing. */
@media(max-width:800px){
body #header{padding-right:24px;padding-left:20px}
body #header.open #mainNavigation{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;padding:20px 12px 28px!important;max-height:calc(100dvh - 112px);overflow-y:auto}
body #header.open #mainNavigation .navGroup{display:flex;flex-direction:column;align-items:stretch;gap:0;width:100%;height:auto}
body #header.open #mainNavigation .navLevelTrigger,body #header.open #mainNavigation>a{padding:12px 8px;min-height:48px;width:100%;text-align:left;justify-content:flex-start}
body #header.open #mainNavigation .navGroup>.navDropdown{position:static!important;inset:auto!important;margin:0!important;padding:10px 8px 18px 28px!important;width:100%!important;min-width:0!important;transform:none!important}
body #header.open #mainNavigation .navGroup.subOpen>.navDropdown{display:flex!important;flex-direction:column;align-items:stretch;gap:4px}
body #header.open #mainNavigation .navDropdown a{display:flex;align-items:center;padding:12px 8px;min-height:48px;white-space:normal;line-height:1.5}
}
@media(max-width:350px){body #header{padding-left:16px;padding-right:20px}}
@media(max-width:800px){#header .headerActions{width:auto!important;min-width:108px;flex-shrink:0}#header .headerActions .menuTriggerZone{flex:0 0 44px;width:44px!important;min-width:44px!important;height:44px}}
@media(max-width:350px){#header .headerActions{min-width:104px}}
/* Mobile navigation opens beneath the house, aligned to its right edge. */
@media(max-width:800px){
body #header.open #mainNavigation{align-items:flex-end!important;padding:20px 0 28px 12px!important}
body #header.open #mainNavigation .navGroup{align-items:flex-end;width:min(100%,260px)}
body #header.open #mainNavigation .navLevelTrigger,body #header.open #mainNavigation>a{width:auto;max-width:100%;padding:12px 8px;align-self:flex-end;text-align:right;justify-content:flex-end}
body #header.open #mainNavigation .navGroup>.navDropdown{align-items:flex-end!important;width:100%!important;padding:10px 8px 18px 12px!important}
body #header.open #mainNavigation .navDropdown a{align-self:flex-end;justify-content:flex-end;text-align:right;padding:12px 0;max-width:100%}
}
.crewCredit{font-size:10px;gap:4px}.crewCredit svg{width:11px;height:11px}
@media(max-width:800px){.homeCredit{font-size:9px;gap:3px}.homeCredit svg{width:10px;height:10px}}

/* One transparent header in every navigation state. */
body #header .headerActions{width:auto!important;min-width:120px}
body #header .menuTriggerZone{display:flex!important;flex-shrink:0}
body #header,body #header.open,body #header.scrolled,
body #header #mainNavigation,body #header #mainNavigation .navDropdown,
#projectDialog .detailHeader,#projectDialog .detailNavigation{
 background:none!important;background-image:none!important;backdrop-filter:none!important;box-shadow:none!important;
}
body[data-page="studio"] main{padding-top:0}
body[data-page="studio"] #header,body[data-page="studio"] #header #language,
body[data-page="studio"] #header #mainNavigation a,
body[data-page="studio"] #header #mainNavigation button{color:#fff!important}
body[data-page="studio"] #header .brand img{filter:none!important}
body[data-page="studio"] #header .brandHouse img{filter:brightness(0) invert(1)!important}
@media(min-width:801px){
 body #header #mainNavigation .navDropdown{top:100%!important;margin-top:0!important;padding-top:14px;padding-bottom:16px}
 body #header #mainNavigation .navDropdown:before{content:'';position:absolute;left:0;right:0;top:-20px;height:20px;background:transparent}
 body[data-page="studio"] .studioCopy{padding-top:140px}
}
@media(max-width:800px){
 body #header .headerActions{min-width:108px}
 body[data-page="studio"] .studioPhoto{height:380px}
 body[data-page="studio"]:has(#header.open) .studio{margin-top:0}
 body[data-page="studio"]:has(#header.open){background:#2d2922}
 body[data-page="studio"] .studioCopy{padding-top:44px}
}

/* A single navigation selection while a submenu is being explored. */
#mainNavigation:has(.navGroup.subOpen)>a[aria-current="page"]{border-bottom-color:transparent!important;box-shadow:none!important}
body[data-page="studio"] #header #mainNavigation{ text-shadow:0 1px 4px #0008 }
@media(min-width:801px){body:not([data-page="home"]) #header #mainNavigation{transition:none}}

/* About: a quiet editorial spread, with clear text and an independent photograph. */
body[data-page="studio"],body[data-page="studio"]:has(#header.open){background:var(--paper)}
body[data-page="studio"] main{padding-top:var(--header-height)}
body[data-page="studio"] #studio{
 --section-background:var(--paper);background:var(--paper);color:var(--ink);
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);align-items:center;
 gap:clamp(40px,6vw,96px);padding:64px 60px 80px;min-height:calc(100svh - 220px);
 box-shadow:none;clip-path:none;
}
body[data-page="studio"] #studio .studioCopy{padding:16px 0;max-width:520px}
body[data-page="studio"] #studio .studioCopy>.eyebrow{display:block;color:var(--gold-text);font-size:12px;letter-spacing:.18em;margin:0 0 32px}
body[data-page="studio"] #studio .studioCopy h2{font-size:clamp(44px,4.4vw,68px);line-height:1.08;letter-spacing:-.025em;margin:0 0 32px;text-wrap:balance}
body[data-page="studio"] #studio .studioCopy>p:not(.eyebrow){font-size:19px;line-height:1.75;color:#716b60;max-width:43ch;margin:0 0 40px}
body[data-page="studio"] #studio .studioCopy .textLink{color:var(--gold-text);font-size:15px;padding-bottom:12px}
body[data-page="studio"] #studio .studioPhoto{height:clamp(420px,54vw,640px);min-height:0;position:relative;margin:0}
body[data-page="studio"] #studio .studioPhoto img{display:block;width:100%;height:100%;object-fit:cover;object-position:55% 50%;filter:none}
body[data-page="studio"] #header,body[data-page="studio"] #header #language,
body[data-page="studio"] #header #mainNavigation a,body[data-page="studio"] #header #mainNavigation button{color:var(--ink)!important;text-shadow:none}
body[data-page="studio"] #header .brand img,body[data-page="studio"] #header .brandHouse img{filter:grayscale(1) brightness(.18)!important}
body[data-page="studio"] #header #mainNavigation{text-shadow:none}
body[data-page="studio"]>footer{margin-top:0;border-top:0}
@media(max-width:1000px){body[data-page="studio"] #studio{gap:40px;padding:40px 32px 56px}body[data-page="studio"] #studio .studioCopy h2{font-size:48px}}
@media(max-width:800px){
 body[data-page="studio"] #studio{grid-template-columns:1fr;gap:36px;padding:32px 24px 48px;min-height:0}
 body[data-page="studio"] #studio .studioCopy{padding:0;max-width:560px}
 body[data-page="studio"] #studio .studioCopy>.eyebrow{margin-bottom:24px}
 body[data-page="studio"] #studio .studioCopy h2{font-size:44px;margin-bottom:24px}
 body[data-page="studio"] #studio .studioCopy>p:not(.eyebrow){font-size:18px;margin-bottom:28px}
 body[data-page="studio"] #studio .studioPhoto{height:420px;min-height:0}
 body[data-page="studio"]:has(#header.open) main{padding-top:0}
}

/* Keep desktop submenu close to its parent row without a hover gap. */
@media(min-width:801px){
 body #header #mainNavigation .navDropdown{top:calc(100% - 24px)!important;padding-top:4px!important;padding-bottom:8px!important;min-height:44px}
 body #header #mainNavigation .navDropdown:before{top:-12px;height:12px}
}

.submenuToggle{display:none;background:none;border:0;color:inherit}
@media(max-width:800px){
 body #header.open #mainNavigation .navGroup:has(.submenuToggle){display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;column-gap:0}
 body #header.open #mainNavigation .navGroup:has(.submenuToggle)>.navLevelTrigger{grid-column:1;grid-row:1;justify-self:end}
 body #header.open #mainNavigation .submenuToggle{display:flex;align-items:center;justify-content:center;grid-column:2;grid-row:1;width:44px;height:48px;padding:0}
 body #header.open #mainNavigation .navGroup:has(.submenuToggle)>.navDropdown{grid-column:1/-1;grid-row:2}
}

/* Full original service descriptions stay readable with mouse, keyboard and touch. */
.serviceList article,.serviceList article:last-child{height:auto;min-height:360px;align-items:start;transition:border-color .2s,background-color .2s}
.serviceList article:hover,.serviceList article:focus-within{border-color:var(--gold);background:#fdfbf6}
.serviceList p{font-size:17px;line-height:1.75;max-width:46ch}
.serviceList h3{margin-bottom:20px}
@media(max-width:800px){.serviceList article,.serviceList article:last-child{min-height:0;padding:28px 24px}.serviceList p{font-size:17px;line-height:1.75}}

/* Service detail pages share the About page composition. */
/* About: a quiet editorial spread, with clear text and an independent photograph. */
body[data-page="serviceDetail"],body[data-page="serviceDetail"]:has(#header.open){background:var(--paper)}
body[data-page="serviceDetail"] main{padding-top:var(--header-height)}
body[data-page="serviceDetail"] #serviceDetail{
 --section-background:var(--paper);background:var(--paper);color:var(--ink);
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);align-items:center;
 gap:clamp(40px,6vw,96px);padding:64px 60px 80px;min-height:calc(100svh - 220px);
 box-shadow:none;clip-path:none;
}
body[data-page="serviceDetail"] #serviceDetail .studioCopy{padding:16px 0;max-width:520px}
body[data-page="serviceDetail"] #serviceDetail .studioCopy>.eyebrow{display:block;color:var(--gold-text);font-size:12px;letter-spacing:.18em;margin:0 0 32px}
body[data-page="serviceDetail"] #serviceDetail .studioCopy h2{font-size:clamp(44px,4.4vw,68px);line-height:1.08;letter-spacing:-.025em;margin:0 0 32px;text-wrap:balance}
body[data-page="serviceDetail"] #serviceDetail .studioCopy>p:not(.eyebrow){font-size:19px;line-height:1.75;color:#716b60;max-width:43ch;margin:0 0 40px}
body[data-page="serviceDetail"] #serviceDetail .studioCopy .textLink{color:var(--gold-text);font-size:15px;padding-bottom:12px}
body[data-page="serviceDetail"] #serviceDetail .studioPhoto{height:clamp(420px,54vw,640px);min-height:0;position:relative;margin:0}
body[data-page="serviceDetail"] #serviceDetail .studioPhoto img{display:block;width:100%;height:100%;object-fit:cover;object-position:55% 50%;filter:none}
body[data-page="serviceDetail"] #header,body[data-page="serviceDetail"] #header #language,
body[data-page="serviceDetail"] #header #mainNavigation a,body[data-page="serviceDetail"] #header #mainNavigation button{color:var(--ink)!important;text-shadow:none}
body[data-page="serviceDetail"] #header .brand img,body[data-page="serviceDetail"] #header .brandHouse img{filter:grayscale(1) brightness(.18)!important}
body[data-page="serviceDetail"] #header #mainNavigation{text-shadow:none}
body[data-page="serviceDetail"]>footer{margin-top:0;border-top:0}
@media(max-width:1000px){body[data-page="serviceDetail"] #serviceDetail{gap:40px;padding:40px 32px 56px}body[data-page="serviceDetail"] #serviceDetail .studioCopy h2{font-size:48px}}
@media(max-width:800px){
 body[data-page="serviceDetail"] #serviceDetail{grid-template-columns:1fr;gap:36px;padding:32px 24px 48px;min-height:0}
 body[data-page="serviceDetail"] #serviceDetail .studioCopy{padding:0;max-width:560px}
 body[data-page="serviceDetail"] #serviceDetail .studioCopy>.eyebrow{margin-bottom:24px}
 body[data-page="serviceDetail"] #serviceDetail .studioCopy h2{font-size:44px;margin-bottom:24px}
 body[data-page="serviceDetail"] #serviceDetail .studioCopy>p:not(.eyebrow){font-size:18px;margin-bottom:28px}
 body[data-page="serviceDetail"] #serviceDetail .studioPhoto{height:420px;min-height:0}
 body[data-page="serviceDetail"]:has(#header.open) main{padding-top:0}
}


.serviceBack{display:inline-block;font-size:13px;letter-spacing:.06em;color:var(--gold-text);margin-bottom:32px;padding:10px 0}
.serviceCardLink{display:block;width:100%;height:100%;color:inherit}
.serviceList article:has(.serviceCardLink){display:block;padding:0!important}
.serviceList .serviceCardLink{padding:28px;min-height:360px}
.serviceCardLink:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
@media(max-width:800px){.serviceList .serviceCardLink{min-height:0;padding:28px 24px}}
#serviceDetail .studioPhoto:after,#serviceDetail .studioPhoto:before{display:none!important}
/* The full left-hand brand always retains its original gold artwork. */
body #header .brand img,body #header.open .brand img,
body:not([data-page="home"]) #header .brand img,
body[data-page="studio"] #header .brand img,
body[data-page="serviceDetail"] #header .brand img,
body #projectDialog .detailHeader .brand img{filter:none!important}

/* Portfolio introductions read as one editorial heading and a line beneath it. */
#projects .sectionHeading{display:block;margin-bottom:40px}
#projects .sectionHeading h2{margin-bottom:20px}
#projects .sectionNote{width:auto;max-width:none;margin:0;font-size:18px;line-height:1.6}
@media(max-width:800px){#projects .sectionHeading{margin-bottom:28px}#projects .sectionHeading h2{margin-bottom:16px}#projects .sectionNote{font-size:17px;max-width:40ch}}

/* Lightbox fills the available screen in either phone orientation. */
#photoViewer{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:24px 56px}
#photoViewer #photoLarge{width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain}
#photoViewer .photoToolbar{z-index:2;top:max(8px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));text-shadow:0 1px 4px #000}
#photoPrevious,#photoNext{z-index:2;top:50%;transform:translateY(-50%);background:#15151055;border-radius:0}
@media(max-width:1000px){
 #photoViewer{padding:0}
 #photoPrevious{left:env(safe-area-inset-left,0px)}
 #photoNext{right:env(safe-area-inset-right,0px)}
}
/* Client-approved brand contrast: white on the slideshow, dark on light pages. */
body[data-page="home"] #header .brand img,body[data-page="home"] #header.open .brand img{filter:brightness(0) invert(1)!important}
body:not([data-page="home"]) #header .brand img,
body[data-page="studio"] #header .brand img,
body[data-page="serviceDetail"] #header .brand img,
body #projectDialog .detailHeader .brand img{filter:brightness(0) saturate(100%)!important}
body[data-page="home"] #header,body[data-page="home"] #header #mainNavigation,
body[data-page="home"] #header #mainNavigation a,body[data-page="home"] #header #mainNavigation button,
body[data-page="home"] .heroCaption,body[data-page="home"] .heroCaption>.eyebrow,
body[data-page="home"] .heroDiscover,body[data-page="home"] .homeSocial,
body[data-page="home"] .homeSocial button,body[data-page="home"] .homeCredit,
body[data-page="home"] .sliderControls button{color:#fff!important}
body[data-page="home"] #dots button{border-color:#fff!important}
body[data-page="home"] #dots button.active{background:#fff!important}
body[data-page="home"] .heroDiscover,body[data-page="home"] #header #mainNavigation .subOpen>.navLevelTrigger{border-bottom-color:#fff}
/* Project listing follows the client's XBD reference: image-led, centred captions. */
#projectGrid{gap:12px}
#projectGrid .projectCard{aspect-ratio:16/10}
#projectGrid .projectCard:after{background:linear-gradient(transparent 25%,#0005 100%)}
#projectGrid .cardCopy{inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px}
#projectGrid .cardCopy>div{display:flex;flex-direction:column;align-items:center;gap:10px}
#projectGrid .cardCopy h3{order:0;font-size:clamp(24px,2.2vw,34px);line-height:1.15;font-weight:400;text-transform:uppercase;letter-spacing:.02em;margin:0;color:#fff;text-shadow:0 1px 5px #0006}
#projectGrid .cardCopy .eyebrow{order:1;color:#fff;font-size:12px;letter-spacing:.16em;line-height:1.5;margin:0}
#projectGrid .cardCopy>span{display:none}
@media(max-width:800px){#projectGrid{gap:8px;margin-left:-24px;margin-right:-24px}#projectGrid .projectCard{aspect-ratio:16/10}#projectGrid .cardCopy h3{font-size:27px}#projectGrid .cardCopy .eyebrow{font-size:11px}}
@media(max-width:800px){body #projects{padding-left:24px;padding-right:24px}}
/* Client refinement: lower captions; transparent inner headers scroll with the page. */
#projectGrid .cardCopy{align-items:flex-end;padding-bottom:32px}
body:not([data-page="home"]) #header{position:absolute!important}
#projectDialog .detailHeader{position:relative;top:auto}
@media(max-width:800px){
 #projectGrid .cardCopy{padding-bottom:28px}
 body:not([data-page="home"]) #header.open{position:relative!important}
}
/* Keep the transparent mobile navigation separate from slideshow captions. */
@media(max-width:800px){
 body[data-page="home"]:has(#header.open) .heroCaption,
 body[data-page="home"]:has(#header.open) .sliderControls,
 body[data-page="home"]:has(#header.open) .homeSocial,
 body[data-page="home"]:has(#header.open) .homeCredit{opacity:0;visibility:hidden;pointer-events:none}
}
/* More compact touch navigation, retaining comfortable 44px touch targets. */
@media(max-width:800px){
 body #header.open #mainNavigation{gap:2px!important;padding-top:12px!important;padding-bottom:16px!important}
 body #header.open #mainNavigation .navLevelTrigger,
 body #header.open #mainNavigation>a{min-height:44px;padding-top:8px;padding-bottom:8px}
 body #header.open #mainNavigation .submenuToggle{height:44px;min-height:44px}
 body #header.open #mainNavigation .navGroup>.navDropdown{padding-top:2px!important;padding-bottom:8px!important}
 body #header.open #mainNavigation .navDropdown a{min-height:44px;padding-top:8px;padding-bottom:8px}
 body #header.open #mainNavigation .navGroup.subOpen>.navDropdown{gap:0}
}
/* Compact mobile menu rows, with separate controls kept easy to target. */
@media(max-width:800px){
 body #header.open #mainNavigation{gap:0!important;padding-top:6px!important;padding-bottom:10px!important}
 body #header.open #mainNavigation .navLevelTrigger,
 body #header.open #mainNavigation>a{min-height:36px;padding-top:5px;padding-bottom:5px;font-size:14px}
 body #header.open #mainNavigation .submenuToggle{height:36px;min-height:36px}
 body #header.open #mainNavigation .navGroup>.navDropdown{padding-top:0!important;padding-bottom:0!important}
 body #header.open #mainNavigation .navDropdown a{min-height:28px;padding-top:3px;padding-bottom:3px;font-size:13px;line-height:22px}
}

@media(max-width:800px){.hero .slide img{object-position:var(--mobile-x,50%) var(--mobile-y,50%)}}

/* 5 November: image-first project presentation and restrained XBD typography. */
:root{--font-heading:"Belleza",serif;--font-body:"proxima-nova","Nunito",sans-serif;--font-menu:"Nunito",sans-serif}
body,input,textarea,button{font-family:var(--font-body)}
h1,h2,h3,.heroCaption h1,#projectGrid .cardCopy h3{font-family:var(--font-heading);font-weight:400}
#projectGrid .cardCopy h3{font-size:clamp(23px,2vw,30px);letter-spacing:.025em}
#projectGrid .cardCopy .eyebrow{font-size:10px;letter-spacing:.18em}
.heroCaption h1{font-size:clamp(32px,3.5vw,50px);letter-spacing:.02em}
body #dots button,body[data-page="home"] #dots button.active{background:transparent!important;border:0!important;border-radius:50%!important}
#dots button:before{inset:8px;border-radius:50%;background:#fff}
#dots button.active:before{inset:6px;border:1px solid #fff;background:transparent}
#dots button.active:after{inset:10px;border-radius:50%;background:#fff}
#projectDialog .projectLayout{display:flex;flex-direction:column;gap:0;padding:0;max-width:none;margin:0}
#projectDialog .projectPhotos{order:-1;width:100%}
#projectDialog #detailGallery{display:block;padding:0}
#projectDialog .detailHeader{position:fixed;inset:0 0 auto;min-height:88px;padding:20px 4%;z-index:8;color:white;background:transparent;transition:color .25s}
body #projectDialog .detailHeader .brand img,#projectDialog .detailHeader .brandHouse img{filter:brightness(0) invert(1)!important}
#projectDialog .detailNavigation{position:fixed;top:88px;right:4%;z-index:9;color:white}
#projectDialog .detailActions #closeProject{color:inherit}
#projectDialog.pastProjectPhoto .detailHeader{color:var(--ink)}
body #projectDialog.pastProjectPhoto .detailHeader .brand img,#projectDialog.pastProjectPhoto .detailHeader .brandHouse img{filter:brightness(0)!important}
#projectDialog.pastProjectPhoto .detailNavigation{color:var(--ink)}
.projectPhotos{--project-thumb-height:clamp(72px,11vw,144px)}
.projectStage{height:calc(100svh - var(--project-thumb-height) - 36px);position:relative;background:#26251f;touch-action:pan-y}
.projectMainImage{display:block;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
#projectDialog #projectMainPhoto{display:block;width:100%;height:100%;max-height:none;object-fit:cover}
.projectPrevious,.projectNext{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:#0002;color:white;padding:10px;cursor:pointer}
.projectPrevious{left:20px}.projectNext{right:20px}
.projectPrevious svg,.projectNext svg{width:100%;height:100%}
.projectSlideCount{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;pointer-events:none}
.projectThumbs{display:flex;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;padding:8px 0;scrollbar-width:thin;scrollbar-color:var(--gold) transparent}
.projectThumbs button{flex:0 0 clamp(100px,16vw,220px);height:var(--project-thumb-height);padding:0;border:0;background:transparent;cursor:pointer;opacity:.6;transition:opacity .2s}
.projectThumbs button.active,.projectThumbs button:hover{opacity:1}
.projectThumbs button.active{outline:1px solid var(--gold);outline-offset:-1px}
.projectThumbs img{display:block;width:100%;height:100%;object-fit:cover}
#projectDialog .detailIntro{padding:64px 32px 40px;width:min(100%,1100px);margin:0 auto;max-width:none;box-sizing:border-box}
#projectDialog .detailIntro h2{font-size:clamp(30px,3.2vw,40px);line-height:1.15;text-transform:uppercase;letter-spacing:.015em;margin-bottom:8px}
#projectDialog .projectMeta{font-size:12px;letter-spacing:.16em;margin:0 0 20px;text-transform:uppercase}
#projectDialog #detailNote{font-size:18px;line-height:1.65;max-width:72ch}
#projectDialog .detailFoot{width:min(100%,1100px);box-sizing:border-box;padding:24px 32px 48px}
#photoPrevious,#photoNext{border-radius:50%;background:#15151044}
@media(max-width:800px){
 #projectGrid .cardCopy h3{font-size:22px}#projectGrid .cardCopy .eyebrow{font-size:9px}
 .heroCaption h1{font-size:32px}
 #projectDialog .detailHeader{min-height:80px;padding:16px 24px}
 #projectDialog .detailHeader .brand{--logo-width:112px}
 #projectDialog .detailNavigation{top:80px}
 .projectPrevious{left:10px}.projectNext{right:10px}
 #projectDialog .detailIntro{padding:32px 24px 24px}
 #projectDialog .detailIntro h2{font-size:30px}
 #projectDialog #detailNote{font-size:17px;line-height:1.65}
 #projectDialog .detailFoot{padding:20px 24px 36px}
 .projectPhotos{--project-thumb-height:20vw}
 .projectThumbs button{flex-basis:28vw;height:var(--project-thumb-height)}
}
@media(prefers-reduced-motion:reduce){.projectThumbs button,#projectDialog .detailHeader{transition:none}}

.projectMainImage{position:relative;overflow:hidden}
#projectDialog .projectPhotoOutgoing{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;object-fit:cover;pointer-events:none}

@media(max-width:800px){
 .projectStage{height:auto;aspect-ratio:1}
}

.projectExpandIcon{position:absolute;right:16px;bottom:16px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#15151099;color:white}
.projectExpandIcon svg{width:22px;height:22px}

@media(max-width:800px){
 #projectDialog #projectMainPhoto,#projectDialog .projectPhotoOutgoing{
  object-position:var(--crop-x,50%) var(--crop-y,50%);
  transform-origin:var(--crop-x,50%) var(--crop-y,50%);
  transform:scale(var(--crop-zoom,1));
 }
}
.projectExpandIcon{z-index:1}
