@font-face{font-family:Bricolage;src:url(./bricolage-800.ttf);font-weight:800;font-display:swap}@font-face{font-family:Space;src:url(./space-400.ttf);font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#f7f0e4;color:#202020;font-family:Space,Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid #202020;outline-offset:6px}h1,h2,h3,p{margin:0}header,main>section,footer{padding-left:max(55px,calc((100vw - 1290px)/2));padding-right:max(55px,calc((100vw - 1290px)/2))}header{display:flex;align-items:center;justify-content:space-between;padding-top:24px;padding-bottom:24px}.logo{display:block}.logo>span{display:block;position:relative;width:48px;height:64px;overflow:hidden}.logo img{position:absolute;width:96px;height:96px;max-width:none;left:-13px;top:-14px}nav{display:flex;gap:40px;font-size:13px}nav a:last-child{border-bottom:1px solid;padding-bottom:7px}.hero{padding-top:30px;padding-bottom:65px}.hero h1{font:800 clamp(94px,12.75vw,187px)/.9 Bricolage,Arial,sans-serif;letter-spacing:-.075em;margin-left:-.025em}.hero h1>span{color:#d6c51b}.hero-bottom{display:flex;align-items:end;justify-content:space-between;margin-top:38px;padding-top:28px;border-top:1px solid #20202040}.hero-bottom p{font-size:24px;line-height:1.4;letter-spacing:-.5px}.hero-bottom>a{display:flex;justify-content:space-between;gap:55px;font-size:12px;border-bottom:1px solid;padding-bottom:10px}.hero-bottom>a>span{font-size:19px}.services{display:grid;grid-template-columns:.65fr 1.4fr;gap:70px;background:#fffdf7;padding-top:75px;padding-bottom:80px}.services h2{font:800 42px/1.05 Bricolage;letter-spacing:-2px}.service-list{border-top:1px solid #20202060}.service-list article{padding:25px 0;border-bottom:1px solid #20202040;display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:baseline}.service-list h3{font:800 23px/1.15 Bricolage;letter-spacing:-.6px}.service-list p{font-size:13px;line-height:1.7;max-width:290px}.contact{background:#f4e42b;padding-top:65px;padding-bottom:65px;display:flex;align-items:center;justify-content:space-between;gap:35px}.contact h2{font:800 clamp(55px,6.5vw,94px)/1 Bricolage;letter-spacing:-5px}.contact>a{font-size:16px;border-bottom:1px solid;padding:12px 0;display:flex;gap:35px}.contact>a>span{font-size:22px}footer{display:flex;justify-content:space-between;padding-top:25px;padding-bottom:25px;font-size:10px}@media(max-width:760px){header,main>section,footer{padding-left:22px;padding-right:22px}header{padding-top:20px;padding-bottom:20px}.logo>span{width:37px;height:51px}.logo img{width:77px;height:77px;left:-10px;top:-11px}nav{gap:23px;font-size:11px}.hero{min-height:max(460px,calc(72svh - 91px));display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding-top:clamp(36px,5svh,56px);padding-bottom:40px}.hero h1{font-size:24.3vw;letter-spacing:-.065em;line-height:.9}.hero-bottom{display:block;margin-top:35px;padding-top:22px}.hero-bottom p{font-size:20px;line-height:1.45;letter-spacing:-.3px}.hero-bottom>a{width:155px;font-size:11px;margin-top:25px;padding-bottom:9px}.hero-bottom>a>span{font-size:17px}.services{display:block;padding-top:40px;padding-bottom:45px}.services h2{font-size:34px;letter-spacing:-1.5px;margin-bottom:28px}.service-list article{display:block;padding:22px 0}.service-list h3{font-size:23px;letter-spacing:-.6px;margin-bottom:9px}.service-list p{font-size:12px;line-height:1.6;max-width:none}.contact{display:block;padding-top:40px;padding-bottom:42px}.contact h2{font-size:59px;letter-spacing:-3px}.contact>a{font-size:13px;gap:20px;margin-top:22px;width:max-content}.contact>a>span{font-size:18px}footer{font-size:9px;padding-top:23px;padding-bottom:23px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.selected-work{margin-top:32px}.selected-work>a{display:inline-flex;align-items:center;gap:28px;min-height:44px;border-bottom:1px solid;font-size:18px}.selected-work>a:hover{border-bottom-width:2px}.selected-work p{margin-top:10px;font-size:11px;line-height:1.5}

/* Give the desktop headline room; centre the mobile composition. */
@media(min-width:761px){.hero{padding-top:80px}.hero-bottom{margin-top:88px}}
@media(max-width:760px){.hero{justify-content:center;gap:38px;text-align:center}.hero h1{margin-left:0}.hero-bottom{margin-top:0;width:100%}}

@media(max-width:760px){.hero-bottom{border-top:0}}

/* Selected type-led services: mobile only. */
.service-number{display:none}
@media(max-width:760px){
.services{padding-top:38px;padding-bottom:38px}
.services h2{font:400 12px/1.4 Space,Arial,sans-serif;letter-spacing:0;margin-bottom:38px}
.service-list{border-top:0}
.service-list article{display:grid;grid-template-columns:25px minmax(0,1fr);column-gap:9px;row-gap:0;padding:0;border-bottom:0;margin-bottom:35px}
.service-list article:nth-of-type(even){margin-left:27px}
.service-list .service-number{display:block;grid-column:1;grid-row:1/3;padding-top:7px;color:#625e56;font-size:10px;letter-spacing:1px}
.service-list h3{grid-column:2;font-size:34px;line-height:1;letter-spacing:-1.4px;margin:0}
.service-list article p{grid-column:2;font-size:13px;line-height:1.6;margin-top:12px;max-width:260px}
.service-list article:nth-of-type(2) h3>span{background:linear-gradient(transparent 57%,#f4e42b 57%)}
.selected-work{margin-top:30px;margin-left:34px;border-top:1px solid #20202030;padding-top:15px}
.selected-work>a{font-size:16px}
.selected-work p{font-size:10px;margin-top:8px}
}

/* Approved centred mobile services. Desktop retains its original layout. */
.mobile-service-break{display:none}
@media(max-width:760px){
.services{text-align:center}
.services .service-list article{display:block;margin:0 0 38px;padding:0}
.services .service-list .service-number{display:block;padding:0;margin-bottom:12px;font-size:10px;line-height:1;letter-spacing:1px}
.services .service-list article p{max-width:290px;margin:12px auto 0}
.services .selected-work{margin-left:0;margin-right:0}
.mobile-service-break{display:block}
}

@media(max-width:350px){.services .service-list h3{font-size:30px}}

/* Centre the desktop hero and the mobile contact/footer. */
@media(min-width:761px){
.hero{text-align:center}
.hero h1{margin-left:0}
.hero-bottom{justify-content:center}
}
@media(max-width:760px){
.contact{text-align:center}
.contact>a{margin-left:auto;margin-right:auto}
footer{flex-direction:column;align-items:center;gap:14px;text-align:center}
}

@media(min-width:761px){.hero-bottom{border-top:0;margin-top:64px;padding-top:0}}

/* Extra breathing room around the hero message. */
@media(min-width:761px){.hero{padding-top:136px;padding-bottom:121px}}
@media(max-width:760px){.hero{min-height:max(540px,calc(72svh - 11px));padding-top:calc(clamp(36px,5svh,56px) + 40px);padding-bottom:80px}}