/* Shared UX refinements: keep after the original layout stylesheet. */
html{color-scheme:light;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
main,section,article,.wrap>div,.hero-copy,.form-row>div{min-width:0}
h1,h2,h3{text-wrap:balance;overflow-wrap:break-word}
p,li{overflow-wrap:break-word}
p{text-wrap:pretty}
.eyebrow{font-size:12px;letter-spacing:1.6px}
.hero .eyebrow,.specialist .eyebrow,.sector-band .eyebrow,.experience-panel .eyebrow{font-size:11px}
.hero-foot,.image-index,.experience-panel>span,.about-intro span,.about-banner .wrap,.principle-grid span,.footer-bottom{font-size:11px}
.hero-foot{flex-wrap:wrap;letter-spacing:1px}
.image-index{letter-spacing:1px}
.intro-overview>p,.service-content,.section-top>p,.founder-copy p,.specialist p,.specialist-detail ul,.engagement p:not(.eyebrow),.technical p,.principle-grid p,.qualifications p:not(.eyebrow),.contact-intro>p:not(.eyebrow){font-size:16px;line-height:1.7}
.button,.text-link,.menu-toggle,.nav-contact,.support-paths a{min-height:48px}
.button{justify-content:space-between;touch-action:manipulation}
.button:active{transform:translateY(1px)}
.text-link,.support-paths a{transition:color .15s,border-color .15s}
.footer-top>div>a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
.footer-top>div>a:hover{color:white;text-decoration:underline;text-underline-offset:5px}
summary{min-height:64px;touch-action:manipulation}
summary h3{flex:1;min-width:0}
.number,.expand{flex-shrink:0}
.number{font-variant-numeric:tabular-nums;color:#556773}
.service-list details{border-left:2px solid transparent;padding-inline:20px}
.service-list details[open]{border-left-color:var(--orange)}
summary:hover h3{color:#a34400}
summary:focus-visible{outline-offset:-3px}
.form-field input,.form-field select,.form-field textarea{font-size:16px;min-height:48px;border-color:#82939d;scroll-margin:24px}
.form-field label{font-size:14px}
.form-field label span{font-size:12px}
.form-field textarea{line-height:1.65}
.form-field input:user-invalid,.form-field textarea:user-invalid{border-color:#a62f2f}
.form-status:not(:empty){background:#e5ebe6;padding:16px;border:1px solid #bbc9c0}
.enquiry-form .form-note{font-size:13px;line-height:1.6}
:focus-visible{outline:3px solid #a84a08;outline-offset:5px}
#site-header :focus-visible,footer :focus-visible,.hero :focus-visible,.specialist :focus-visible{outline-color:#ffad70}
.skip{color:var(--ink);font-size:16px}
.sectors{flex-wrap:wrap;justify-content:flex-start;gap:16px 32px}
.sectors span+span{border:0;padding-left:0}
.sectors span{display:flex;align-items:center;gap:12px}
.sectors span:before{content:'';width:4px;height:4px;background:#8a9aa4;flex-shrink:0}
.footer-bottom{padding-bottom:calc(30px + env(safe-area-inset-bottom))}
@media(min-width:761px) and (max-width:1100px){
 .hero h1{font-size:clamp(40px,4.8vw,54px)}
 .hero-copy{padding-top:48px}
 .hero-intro{font-size:16px}
 .hero-foot{margin-top:32px}
 .bio{gap:44px;grid-template-columns:.8fr 1.2fr}
 .technical-grid{gap:40px;grid-template-columns:1fr 1fr}
 .principle-grid{gap:24px}
 .contact>.contact-layout{grid-template-columns:.8fr 1.2fr;gap:32px}
 .enquiry-form .form-row{grid-template-columns:1fr;gap:0}
 .footer-top{flex-wrap:wrap}
}
@media(max-width:900px){
 .nav-wrap{height:88px}
 .menu-toggle{display:flex;align-items:center;gap:12px;background:transparent;color:white;border:1px solid #ffffff70;padding:10px 14px;font-size:14px;cursor:pointer}
 #navigation{display:none;position:absolute;left:0;right:0;top:88px;padding:16px 24px 24px;background:var(--deep);border-bottom:1px solid #ffffff40;max-height:calc(100vh - 88px);max-height:calc(100dvh - 88px);overflow-y:auto;overscroll-behavior:contain}
 #navigation.open{display:flex;flex-direction:column;gap:4px;align-items:stretch}
 #navigation a{min-height:48px;padding:12px;font-size:15px}
 #navigation [aria-current=page]:after{left:12px;bottom:8px}
 #navigation .nav-contact{margin:12px 0 0;display:flex;justify-content:space-between}
 .hero{display:grid;grid-template-columns:1fr}
 .hero-copy{padding:44px 32px 28px}
 .hero h1{font-size:clamp(40px,6.5vw,58px)}
 .hero-intro{max-width:580px}
 .hero-image{min-height:300px;background-size:auto,auto 270%;background-position:center,50% 20%}
 .hero-foot{margin-top:32px}
 .about-intro{gap:32px;align-items:flex-start}
 .about-intro span{max-width:220px;flex-shrink:0}
}
@media(max-width:760px){
 .wrap{width:calc(100% - 40px)}
 .hero-copy{padding:36px 20px 24px}
 .hero h1{font-size:clamp(36px,9vw,48px);letter-spacing:-1.7px}
 .about-hero h1{font-size:clamp(34px,8.5vw,46px);letter-spacing:-1.6px}
 .intro h2,.expertise h2,.technical h2,.contact h2{font-size:clamp(28px,7.5vw,36px)}
 .eyebrow,.hero .eyebrow{font-size:11px;letter-spacing:1.2px}
 .brand-image{width:210px;height:60px}
 .brand-image img{width:378px;left:-26px;top:-142px}
 .hero-foot{gap:10px;font-size:10px}
 .image-label{font-size:14px}
 .intro{gap:24px}
 .service-list details,.service-list details[open]{padding-inline:10px}
 summary h3{font-size:18px;line-height:1.45;max-width:none}
 .service-content,.service-list details[open] .service-content{padding:0 0 24px 0}
 .service-content li{padding-left:16px;position:relative}
 .service-content li:before{position:absolute;left:0}
 .specialist{width:calc(100% - 40px)}
 .about-intro span{max-width:none}
 .about-banner .wrap{font-size:10px;gap:16px;flex-wrap:wrap}
 .technical-list h3,.principle-grid h3{font-size:21px}
 .contact>.contact-layout{grid-template-columns:1fr;gap:28px}
 .enquiry-form .button{width:100%}
 .footer-top>div{flex-wrap:wrap;gap:12px 28px}
 .footer-bottom{font-size:11px;line-height:1.7}
}
@media(max-width:380px){
 .nav-wrap{width:calc(100% - 24px)}
 .brand-image{width:182px;height:52px}
 .brand-image img{width:328px;left:-23px;top:-123px}
 .menu-toggle{padding:10px;font-size:13px;gap:8px}
 .actions{align-items:stretch;flex-direction:column;width:100%;gap:14px}
 .actions .text-link{align-self:flex-start}
 .experience-panel{padding:24px}
 .bio-heading h2{font-size:32px}
 .technical-list>div{padding-left:30px}
 .about-hero h1 br{display:none}
}
@media(hover:none){.button:hover{transform:none}}
/* Anchor the wide-screen hero to the page edge, not the centred body grid. */
@media(min-width:901px){
 .nav-wrap{width:auto;max-width:none;margin-inline:clamp(40px,5vw,96px)}
 .hero{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);min-height:580px}
 .hero-copy{padding:64px clamp(32px,3.5vw,64px) 28px clamp(40px,5vw,96px);text-align:left;align-items:flex-start}
 .hero h1{width:100%;max-width:820px;font-size:clamp(44px,4vw,72px);line-height:1.08;letter-spacing:-2.5px;text-wrap:initial}
 .hero-intro{max-width:560px;margin:26px 0 28px;font-size:17px;line-height:1.7}
 .hero .actions{flex-wrap:wrap;gap:20px 30px}
 .hero-foot{max-width:700px;margin-top:44px;padding-top:18px;gap:12px 24px;justify-content:flex-start}
 .hero-image{min-height:580px}
}
@media(min-width:901px) and (max-width:1100px){
 .hero-copy{padding-top:48px;padding-left:40px;padding-right:32px}
 .hero h1{font-size:44px;letter-spacing:-1.8px}
 .hero-intro{font-size:16px}
 .hero-foot{margin-top:32px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* About: use horizontal introductions instead of sparse, tall sidebars. */
.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.enquiry-form button:disabled{opacity:.7;cursor:wait;transform:none}
.enquiry-form [disabled]{cursor:wait}
.form-status[data-state="error"]{background:#fff1ed;border-color:#bc7464;color:#7d2b1b}
.form-status[data-state="success"]{background:#e5ebe6;border-color:#91ab97;color:#244d30}
.about-page .bio{display:block;padding:48px 0 40px}
.about-page .bio-heading{display:grid;grid-template-columns:1.2fr 1fr;column-gap:40px;align-items:end;padding-bottom:26px;margin-bottom:28px;border-bottom:1px solid var(--line)}
.about-page .bio-heading .eyebrow{grid-column:1/-1;margin-bottom:14px}
.about-page .bio-heading h2{grid-row:2/4;font-size:clamp(30px,3.2vw,46px)}
.about-page .bio-heading>p:not(.eyebrow){margin:0;font-size:15px}
.about-page .bio-heading .location{border:0;padding:0;margin:6px 0 0;font-size:12px}
.about-page .bio-copy{display:grid;grid-template-columns:1fr 1fr;gap:18px 40px}
.about-page .bio-copy h3{grid-column:1/-1;margin:0 0 4px;font-size:25px}
.about-page .bio-copy h3 br{display:none}
.about-page .bio-copy p{margin:0;font-size:16px;line-height:1.7}
.about-page .bio-copy .text-link{grid-column:1/-1;justify-self:start;margin-top:0}
.about-page .principles{padding:40px 0 48px;border-top:1px solid var(--line)}
.about-page .principles .section-top{margin-bottom:28px}
.about-page .principle-grid h3{margin-top:18px}
.about-page .technical{padding:48px 0}
.about-page .qualifications{padding:32px 0;grid-template-columns:.7fr 2fr;gap:40px}
.about-page .contact{padding:36px 0 48px}
.about-page .contact>.contact-layout{display:block}
.about-page .contact-intro{display:grid;grid-template-columns:1fr 1fr;gap:12px 40px;margin-bottom:24px;align-items:start}
.about-page .contact-intro .eyebrow{grid-column:1/-1;margin:0}
.about-page .contact-intro h2{grid-row:2/4;font-size:clamp(30px,3vw,40px)}
.about-page .contact-intro>p:not(.eyebrow){margin:0;max-width:540px}
.about-page .contact-intro .contact-person{font-size:14px}
.about-page .enquiry-form{padding:28px;background:#e9ece9;border:1px solid #d0d8d6;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.about-page .enquiry-form .form-row{display:contents}
.about-page .enquiry-form>.form-field{grid-column:1/-1}
.about-page .enquiry-form textarea{min-height:120px;height:120px}
.about-page .enquiry-form .form-note{align-self:center;margin:0}
.about-page .enquiry-form .button{justify-self:end;align-self:center}
.about-page .form-status,.about-page .enquiry-form noscript{grid-column:1/-1}
@media(max-width:760px){
 .about-page .bio{padding:32px 0}
 .about-page .bio-heading,.about-page .bio-copy,.about-page .contact-intro{grid-template-columns:1fr;gap:14px}
 .about-page .bio-heading h2,.about-page .contact-intro h2{grid-row:auto}
 .about-page .bio-heading .eyebrow{margin-bottom:0}
 .about-page .bio-heading .location{margin:0}
 .about-page .bio-copy h3{font-size:22px}
 .about-page .principles{padding:32px 0}
 .about-page .qualifications{grid-template-columns:1fr;gap:8px}
 .about-page .qualifications .eyebrow{margin-bottom:8px}
 .about-page .enquiry-form{padding:20px;grid-template-columns:1fr;gap:0}
 .about-page .enquiry-form .form-note{margin-bottom:16px}
 .about-page .enquiry-form .button{justify-self:stretch}
 .about-page .contact{padding:32px 0}
}