html{scroll-behavior:smooth}
.ui-toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;pointer-events:none}
label[for]{cursor:pointer}
.icon-x{display:none}
#mnav-open:checked~header .icon-menu{display:none}
#mnav-open:checked~header .icon-x{display:block}
#mnav-open:checked~header .mnav-panel{max-height:80vh;opacity:1;overflow-y:auto}
.mnav-svc-sub{display:none}
#mnav-svc:checked~label .mega-chevron{transform:rotate(180deg)}
#mnav-svc:checked~.mnav-svc-sub{display:flex}
.mega-panel{visibility:hidden;opacity:0;transform:translateY(-.5rem);pointer-events:none}
@media (min-width:1024px){
.mnav-panel{display:none!important}
header:has(.nav-mega:hover) .mega-panel,
header:has(.nav-mega:focus-within) .mega-panel,
.mega-panel:hover{
visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto
}
.nav-mega:hover .mega-chevron,
.nav-mega:focus-within .mega-chevron{transform:rotate(180deg)}
}
.mega-panel:before{content:"";position:absolute;left:0;right:0;bottom:100%;height:16px}
@supports (animation-timeline:scroll()){
header.site-header{
animation:header-glass linear both;
animation-timeline:scroll();
animation-range:0 24px;
}
}
@keyframes header-glass{
to{
background-color:hsl(var(--navy)/.85);
-webkit-backdrop-filter:blur(16px) saturate(140%);
backdrop-filter:blur(16px) saturate(140%);
box-shadow:0 8px 30px -12px rgba(15,30,64,.4);
}
}
.glass-header{
backdrop-filter:blur(16px) saturate(140%);
}
.glass-slab{
backdrop-filter:blur(20px);
}
.svc-card:hover{
border-color:hsl(var(--cyan)/.4);
background-color:hsl(var(--navy));
color:#fff;
box-shadow:0 24px 60px -20px rgba(15,30,64,.5);
}
.svc-card:hover .svc-img{opacity:.4}
.svc-card:hover .eyebrow{color:hsl(var(--cyan))}
.svc-card:hover .svc-short{color:hsla(0,0%,100%,.7)}
.svc-card:hover .svc-adv{color:hsla(0,0%,100%,.85)}
.svc-card:hover .more-toggle{color:hsla(0,0%,100%,.8)}
.svc-card:hover .more-toggle:hover{color:#fff}
.more-txt{display:inline}
.less-txt{display:none}
.svc-more:checked~.svc-body .more-txt{display:none}
.svc-more:checked~.svc-body .less-txt{display:inline}
.svc-more:checked~.svc-body .plus-icon{transform:rotate(45deg)}
.svc-more:checked~.svc-body .more-panel{
grid-template-rows:1fr;
opacity:1;
}
.callback-modal{display:none}
#callback-open:checked~.callback-modal{display:flex}
.callback-form{display:block}
.callback-thanks{display:none}
#callback-sent:checked~.callback-form{display:none}
#callback-sent:checked~.callback-thanks{display:block}
.enquiry-form{display:block}
.enquiry-thanks{display:none}
#enquiry-sent:checked~.enquiry-form{display:none}
#enquiry-sent:checked~.enquiry-thanks{display:flex}
.inq-pill{
border-radius:9999px;padding:.625rem 1.25rem;font-family:var(--font-heading);font-size:.875rem;font-weight:500;transition:all .3s;border:1px solid hsla(0,0%,100%,.2);color:hsla(0,0%,100%,.7);display:inline-flex;cursor:pointer;
}
.inq-pill:hover{border-color:hsla(0,0%,100%,.4);color:#fff}
.inq-radio:checked+.inq-pill{
background-color:hsl(var(--cyan));color:hsl(var(--navy));border-color:transparent;
}
body:has(#mnav-open:checked){overflow:hidden}
@media (min-width:1024px){
body:has(#mnav-open:checked){overflow:auto}
}
.eyebrow.justify-center{display:flex;justify-content:center}
