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}

.hdr-home{
  --logo-tax:#fff;
  --nav-fg:rgb(255 255 255 / .9);
  --nav-fg-hover:#fff;
  --login-fg:#fff;
  --login-hover:rgb(255 255 255 / .1);
  --menu-fg:#fff;
}
.hdr-inner-page{
  --logo-tax:rgb(0 33 71);
  --nav-fg:rgb(0 33 71 / .8);
  --nav-fg-hover:rgb(0 33 71);
  --login-fg:rgb(0 33 71);
  --login-hover:rgb(0 33 71 / .05);
  --menu-fg:rgb(0 33 71);
}
.logo-tax{color:var(--logo-tax);transition:color .3s}
.nav-link-tp{color:var(--nav-fg)}
.nav-link-tp:hover{color:var(--nav-fg-hover)}
.hdr-login{color:var(--login-fg)}
.hdr-login:hover{background:var(--login-hover)}
.hdr-toggle-tp{color:var(--menu-fg)}

@supports (animation-timeline:scroll()){
  .hdr-home{
    animation:tp-header linear both;
    animation-timeline:scroll();
    animation-range:0 24px;
  }
}
@keyframes tp-header{
  to{
    background:#ffffffb8;
    -webkit-backdrop-filter:blur(20px) saturate(160%);
    backdrop-filter:blur(20px) saturate(160%);
    border-bottom:1px solid rgb(0 33 71 / .1);
    --logo-tax:rgb(0 33 71);
    --nav-fg:rgb(0 33 71 / .8);
    --nav-fg-hover:rgb(0 33 71);
    --login-fg:rgb(0 33 71);
    --login-hover:rgb(0 33 71 / .05);
    --menu-fg:rgb(0 33 71);
  }
}

.mega-panel{
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease,visibility .2s ease;
}
.mega-panel:before{content:"";position:absolute;left:0;right:0;bottom:100%;height:14px}
@media (min-width:1024px){
  header:has(.mega-services:hover) .panel-services,
  header:has(.panel-services:hover) .panel-services,
  header:has(.mega-calcs:hover) .panel-calcs,
  header:has(.panel-calcs:hover) .panel-calcs{
    visibility:visible;
    opacity:1;
    pointer-events:auto;
  }
  header:has(.mega-services:hover) .mega-services .nav-chev,
  header:has(.panel-services:hover) .mega-services .nav-chev,
  header:has(.mega-calcs:hover) .mega-calcs .nav-chev,
  header:has(.panel-calcs:hover) .mega-calcs .nav-chev{
    transform:rotate(180deg);
  }
}

.mnav-overlay,.mnav-drawer{display:none}
#mnav-open:checked~header .mnav-overlay{display:block}
#mnav-open:checked~header .mnav-drawer{display:block}
body:has(#mnav-open:checked){overflow:hidden}
@media (min-width:1024px){
  .mnav-overlay,.mnav-drawer{display:none!important}
  body:has(#mnav-open:checked){overflow:auto}
}

.mnav-sub{display:none}
#mnav-services:checked~.mnav-sub,
#mnav-jobs:checked~.mnav-sub,
#mnav-specialist:checked~.mnav-sub,
#mnav-calc:checked~.mnav-sub{display:block}
#mnav-services:checked+label .nav-chev,
#mnav-jobs:checked+label .nav-chev,
#mnav-specialist:checked+label .nav-chev,
#mnav-calc:checked+label .nav-chev{transform:rotate(180deg)}

.faq-panel{display:none;overflow:hidden}
.faq-item:has(input:checked) .faq-panel{display:block}
.faq-item:has(input:checked) .faq-chev{transform:rotate(180deg)}
.faq-item-gold:has(input:checked){border-color:rgb(242 180 18 / .4)}

.contact-form{display:block}
.contact-thanks{display:none}
#contact-sent:checked~.contact-form{display:none}
#contact-sent:checked~.contact-thanks{display:flex}
