/* =========================================================
   HEADER
   ========================================================= */

/* Fixed header spacing */
body{
  padding-top: 56px;
}
/* Header shell */
.header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: #000000;
  border-bottom: 1.5px solid #ffffff;
}


/* Slim animated gradient bar at the very top */
.header::before{
  display: none;
}

@keyframes casTopBarSweep{
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@media (prefers-reduced-motion: reduce){
  .header::before{
    animation: none;
    background-position: 50% 50%;
  }
}

/* Header inner containers */
.header .header-inner{
  --header-side-pad: clamp(22px, 4.2vw, 66px);
  --header-nav-edge-pad: 16px;

  width: 100%;
  max-width: none;
  margin: 0;
  padding-left: var(--header-side-pad);
  padding-right: var(--header-side-pad);
  box-sizing: border-box;
}

.header .header-inner{
  display: flex;
  align-items: center;
  gap: 16px;
  padding-top: 5px;
  padding-bottom: 5px;
}

/* Brand */
.header .brand{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  margin-left: calc(-1 * (var(--header-side-pad) - 6px));
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0;
  color: var(--text);
  text-decoration: none;
}
.header .brand:hover{
  text-decoration: none;
}

.header .brand .mark{
  width: 48px;
  height: 48px;
  border-radius: 8px;
  background: #0b0d1000 url("/assets/logo_website_final_cropped3.png") center/contain no-repeat;
  box-shadow: 0 0 0 0 rgba(255,255,255,.06) inset;
  text-decoration: none;
  flex: 0 0 auto;
  transform: translateY(1px);
  cursor: default;
}

.header .brand-name{
  display: inline-block;
  flex: 0 0 auto;
  font-family: "Red Hat Text", "Red Hat Display", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.012em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--text);
  text-decoration: none;
}

.header .brand-name:hover,
.header .brand-name:focus{
  color: var(--text);
  text-decoration: none;
}

@supports (font-variation-settings: normal){
  .header .brand-name{
    font-variation-settings: "wght" 800;
  }
}

/* Primary nav */
.header .nav{
  margin-left: clamp(34px, 4vw, 68px);
  display: flex;
  align-items: center;
  gap: 15px;
}

/* Default/mobile nav link styling stays button-like */
.header .nav a{
  color: var(--text);
  text-decoration: none;
  padding: 8px 11px;
  border-radius: 9px;
  border: 1px solid #1b2430;
  background: #131922;
  transition: background 0.15s ease, color 0.15s ease;
}

.header .nav a:hover{
  background: #182131;
}

.header .nav a.active{
  color: #000000;
  font-weight: 650;
  outline: 1px solid #233249;
  background: #59E00B;
}

/* Desktop top-nav tabs */
@media (min-width: 861px){
  .header .header-inner{
    --header-y-pad: 7px;
    padding-top: var(--header-y-pad);
    padding-bottom: var(--header-y-pad);
    align-items: stretch;
  }

  .header .brand{
    align-self: center;
  }

  .header .nav{
    gap: 0;
    align-self: stretch;
    align-items: stretch;
    margin-top: calc(-1 * var(--header-y-pad));
    margin-bottom: calc(-1 * var(--header-y-pad));
  }

  .header .nav > .nav-item{
    align-items: stretch;
  }

  .header .nav > a,
  .header .nav > .nav-item > a{
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    padding: 0 19px;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    color: #ffffff;
    font-family: "Red Hat Display", "Red Hat Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.005em;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transform: none;
    transition: none;
  }

  /* Top header: no sticky active/focus green */
  .header .nav > a.active,
  .header .nav > .nav-item > a.active,
  .header .nav > a[aria-current="page"],
  .header .nav > .nav-item > a[aria-current="page"],
  .header .nav > a:focus,
  .header .nav > .nav-item > a:focus,
  .header .nav > .nav-item:focus-within > a{
    background: transparent;
    color: #ffffff;
    font-weight: 600;
    letter-spacing: -0.005em;
    outline: 0;
    transform: none;
  }

  /* Top header: green only while the actual link is hovered */
  .header .nav > a:hover,
  .header .nav > .nav-item > a:hover{
    background: transparent;
    color: #68f31d;
    transform: none;
  }

  .header .nav > a.nav-industries,
  .header .nav > a.nav-sustainability,
  .header .nav > .nav-item > a.nav-industries,
  .header .nav > .nav-item > a.nav-sustainability{
    padding: 0 19px;
    font-size: 16px;
    font-weight: 600;
  }
}

/* Desktop header action buttons */
.header-actions{
  display: none;
}

@media (min-width: 861px){
  .header-actions{
    margin-left: auto;
    margin-right: calc(-1 * (var(--header-side-pad) - var(--header-nav-edge-pad)));
    display: flex;
    align-items: center;
    gap: 12px;
    align-self: center;
  }

  .header-action{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 28px;
    border-radius: 999px;
    font-family: "Red Hat Display", "Red Hat Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: -0.005em;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: none;
  }

  .header-action--outline{
    background: #000000;
    color: #59E00B;
    border: 1px solid #59E00B;
  }

  .header-action--outline:hover,
  .header-action--outline:focus{
    background: #000000;
    color: #4fc715;
    border-color: #4fc715;
  }

  .header-action--filled{
    background: #59E00B;
    color: #000000;
    border: 1px solid #59E00B;
  }

  .header-action--filled:hover,
  .header-action--filled:focus{
    background: #4fc715;
    color: #000000;
    border-color: #4fc715;
  }
}

/* Desktop: hide mobile-only extras */
@media (min-width: 861px){
  .header .nav .nav-mobile-extra{
    display: none;
  }
}

/* Fluid desktop header spacing from 1280px down to 1201px */
@media (min-width: 1201px) and (max-width: 1280px){
  .header .header-inner{
    /*
      Begins at 0px at 1280px and reaches 7.9px at 1201px.

      Each space between neighboring navigation tabs decreases by twice
      this amount because both neighboring tabs lose horizontal padding.

      The Resources-to-Contact gap decreases by the same total amount
      through the Resources padding and the header flex gap.
    */
    --header-gap-reduction: clamp(
      0px,
      calc(128px - 10vw),
      7.9px
    );

    gap: calc(16px - var(--header-gap-reduction));
  }

  .header .nav{
    /*
      Compensates for the smaller header gap and smaller left padding on
      Services, keeping the brand-to-Services text gap unchanged.
    */
    margin-left: calc(
      51.2px +
      var(--header-gap-reduction) +
      var(--header-gap-reduction)
    );
  }

  .header .nav > a,
  .header .nav > .nav-item > a{
    padding-left: calc(19px - var(--header-gap-reduction));
    padding-right: calc(19px - var(--header-gap-reduction));
  }

  .header .nav > a.nav-industries,
  .header .nav > a.nav-sustainability,
  .header .nav > .nav-item > a.nav-industries,
  .header .nav > .nav-item > a.nav-sustainability{
    padding-left: calc(19px - var(--header-gap-reduction));
    padding-right: calc(19px - var(--header-gap-reduction));
  }
}

/* Mobile menu button */
.menu-btn{
  display: none;
}

.menu-btn .menu-icon{
  display: inline-block;
  width: 22px;
  height: 16px;
  position: relative;
}

.menu-btn .menu-icon span{
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  border-radius: 999px;
  background: #ffffff;
  transition: transform 0.18s ease, opacity 0.18s ease, top 0.18s ease;
}

.menu-btn .menu-icon span:nth-child(1){ top: 0; }
.menu-btn .menu-icon span:nth-child(2){ top: 7px; }
.menu-btn .menu-icon span:nth-child(3){ top: 14px; }

.menu-btn.open .menu-icon span:nth-child(1){
  top: 7px;
  transform: rotate(45deg);
}

.menu-btn.open .menu-icon span:nth-child(2){
  opacity: 0;
}

.menu-btn.open .menu-icon span:nth-child(3){
  top: 7px;
  transform: rotate(-45deg);
}

@media (prefers-reduced-motion: reduce){
  .menu-btn .menu-icon span{
    transition: none;
  }
}

/* Desktop dropdowns */
@media (min-width: 861px){
  .header .header-inner{
    position: relative;
  }

  .header .nav{
    margin-right: 0;
  }

  .nav-item{
    position: relative;
    display: inline-flex;
    align-items: center;
  }

  .nav-item--dropdown{
    position: relative;
  }

  /* Shared simple dropdown logic */
  .nav-item--dropdown .nav-dropdown--simple{
    --simple-dropdown-width: 330px;
    --simple-dropdown-gap: 8px;

    position: absolute;
    top: calc(100% + var(--simple-dropdown-gap));
    left: 0;
    right: auto;
    width: var(--simple-dropdown-width);
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    opacity: 0;
    transform: none;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.16s ease, visibility 0.16s ease;
    z-index: 230;
    box-sizing: border-box;
  }

  .nav-item--dropdown .nav-dropdown--simple::before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: calc(-1 * var(--simple-dropdown-gap));
    height: var(--simple-dropdown-gap);
  }

  .header .nav > .nav-item--dropdown:last-of-type .nav-dropdown--simple{
    left: auto;
    right: calc(-1 * var(--header-nav-edge-pad));
  }

  .nav-item--dropdown:hover .nav-dropdown--simple,
  .nav-item--dropdown:focus-within .nav-dropdown--simple{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .nav-simple-list{
    display: flex;
    flex-direction: column;
    width: var(--simple-dropdown-width);
    min-width: var(--simple-dropdown-width);
    max-width: var(--simple-dropdown-width);
    background: #05070a;
    border: 1px solid #05070a;
    box-shadow: 1px 2px 10px 5px rgba(0, 0, 0, 0.22);
    box-sizing: border-box;
    overflow: visible;
  }

  /* Compact desktop dropdown rows containing a link and a separate subtitle */
  .nav-simple-item,
  .nav-subitem{
    position: relative;
    width: 100%;
    padding: 8px 20px;
    border-top: 1px solid #05070a;
    background: #05070a;
    box-sizing: border-box;
  }

  .nav-simple-list > .nav-simple-item:first-child,
  .nav-simple-list > .nav-subitem:first-child,
  .nav-submenu > .nav-simple-item:first-child{
    border-top: 0;
  }

  /* Main dropdown links keep their existing type styling */
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-simple-item > a{
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #ffffff;
    font-family: "Red Hat Display", "Red Hat Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.005em;
    text-decoration: none;
    transform: none;
    white-space: normal;
    overflow: visible;
    overflow-wrap: break-word;
    word-break: normal;
    box-sizing: border-box;
    transition: none;
  }

  /* Subtitles are separate from the links and never inherit link hover color */
  .nav-simple-item__subtitle{
    display: block;
    margin-top: 2px;
    color: #929aa8;
    font-family: "Red Hat Text", "Red Hat Display", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 12.5px;
    line-height: 1.25;
    font-weight: 400;
    letter-spacing: 0;
    text-decoration: none;
  }

  /* Dropdown links: active/current page should have no persistent styling */
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-simple-item > a.active,
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-simple-item > a[aria-current="page"],
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-simple-item > a:focus{
    background: transparent;
    color: #ffffff;
    border-color: transparent;
    outline: 0;
    box-shadow: none;
    transform: none;
  }

  /* Green applies only to the actual main link being hovered */
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-simple-item > a:hover{
    background: transparent;
    color: #59E00B;
    border-color: transparent;
    transform: none;
  }

  .header .nav .nav-dropdown--simple .nav-simple-list .nav-simple-item > a:focus-visible{
    outline: 2px solid var(--blue);
    outline-offset: 3px;
  }

  /* Services dropdown width */
  .nav-item--services{
    position: relative;
  }

  .nav-item--services .nav-dropdown--simple{
    --simple-dropdown-width: 340px;
  }

  .nav-item--resources .nav-dropdown--simple{
    --simple-dropdown-width: 350px;
  }

  .nav-item--sustainability .nav-dropdown--simple,
  .nav-item--about .nav-dropdown--simple{
    --simple-dropdown-width: 320px;
  }

  .header .nav > .nav-item--services .nav-dropdown--simple{
    left: 0;
    right: auto;
  }

  .nav-simple-list--services{
    overflow: visible;
  }

  .nav-subitem{
    position: relative;
    width: 100%;
  }

  .header .nav .nav-dropdown--simple .nav-simple-list .nav-subitem__trigger{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-right: 24px;
  }

  .header .nav .nav-dropdown--simple .nav-simple-list .nav-subitem__trigger::after{
    content: "›";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    color: currentColor;
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
  }

  .nav-submenu{
    --services-submenu-width: 340px;

    position: absolute;
    top: 0;
    left: 100%;
    width: var(--services-submenu-width);
    min-width: var(--services-submenu-width);
    max-width: var(--services-submenu-width);
    background: #05070a;
    border: 1px solid rgba(223, 223, 223, 0.34);
    box-shadow: 1px 2px 10px 5px rgba(0, 0, 0, 0.22);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 240;
    box-sizing: border-box;
    transition: opacity 0.16s ease, visibility 0.16s ease;
  }

  .nav-subitem:hover > .nav-submenu,
  .nav-subitem:focus-within > .nav-submenu{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  /* Submenu parents should NOT stay green due to active/current child pages */
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-subitem:has(.nav-submenu a.active) > .nav-subitem__trigger,
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-subitem:has(.nav-submenu a[aria-current="page"]) > .nav-subitem__trigger{
    background: #05070a;
    color: #ffffff;
    border-color: #05070a;
    transform: none;
  }

  /* Submenu parent links: green only while the exact parent link is hovered */
  .header .nav .nav-dropdown--simple .nav-simple-list .nav-subitem__trigger:hover{
    background: #05070a;
    color: #59E00B;
    border-color: #05070a;
    transform: none;
  }

  .header .nav .nav-dropdown--simple .nav-simple-list .nav-submenu a{
    width: 100%;
    min-width: 100%;
    max-width: 100%;
  }

  /* Button-style submenu trigger, such as Checklists and Guides */
  .header .nav .nav-dropdown--simple .nav-simple-list button.nav-subitem__trigger{
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0 24px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #ffffff;
    font-family: "Red Hat Display", "Red Hat Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.005em;
    text-align: left;
    text-decoration: none;
    white-space: normal;
    overflow: visible;
    overflow-wrap: break-word;
    word-break: normal;
    box-sizing: border-box;
    cursor: default;
    transform: none;
    transition: none;
  }

  .header .nav .nav-dropdown--simple .nav-simple-list button.nav-subitem__trigger:focus{
    background: transparent;
    color: #ffffff;
    border-color: transparent;
    transform: none;
  }

  .header .nav .nav-dropdown--simple .nav-simple-list button.nav-subitem__trigger:hover{
    background: transparent;
    color: #59E00B;
    border-color: transparent;
    transform: none;
  }

  .header .nav .nav-dropdown--simple .nav-simple-list button.nav-subitem__trigger:focus-visible{
    outline: 2px solid var(--blue);
    outline-offset: 3px;
  }
}

@media (prefers-reduced-motion: reduce){
  .nav-item--services .nav-dropdown,
  .nav-item--dropdown .nav-dropdown--simple{
    transition: none;
    transform: none;
  }
}

/* Hamburger header/nav */
body.cas-mobile-nav-open{
  overflow: hidden;
}

body.cas-mobile-nav-open .header{
  width: 100%;
}

.cas-mobile-drawer{
  display: none;
}

@media (max-width: 1200px){
  .header{
    --cas-mobile-header-height: 56px;
    z-index: 1100;
    max-width: 100vw;
    overflow-x: clip;
  }
  
  .header .header-inner{
    position: relative;
    z-index: 3;
    min-height: var(--cas-mobile-header-height);
    padding-top: 0;
    padding-bottom: 0;
    align-items: center;
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  }

  body.cas-mobile-nav-open .header .header-inner{
    box-shadow:
      0px 3px 3px -2px rgba(255, 255, 255, 0.2)
      0px 3px 4px 0px rgba(255, 255, 255, 0.14)
      0px 1px 8px 0px rgba(255, 255, 255, 0.12)
  }

  .header .brand{
    flex: 1 1 auto;
    min-width: 0;
    align-self: stretch;
    display: flex;
    align-items: center;
  }

  .header .brand-name{
    display: flex;
    align-items: center;
    align-self: stretch;
    transform: translateY(1px);
  }

  .header .brand .mark{
    transform: none;
  }

  .header .nav{
    display: none;
  }

  .menu-btn{
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: calc(
      -1 * (var(--header-side-pad) - var(--header-nav-edge-pad))
    );
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    padding: 8px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #ffffff;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .menu-btn:hover,
  .menu-btn:focus{
    background-color: rgba(255, 255, 255, 0.08);
    outline: 0;
  }

  @media (hover: none){
    .menu-btn:hover{
      background-color: transparent;
    }
  }

  .menu-btn:focus-visible{
    outline: 2px solid #ffffff;
    outline-offset: 3px;
  }

  .menu-btn .menu-icon{
    width: 24px;
    height: 24px;
  }

  .menu-btn .menu-icon span{
    left: 3px;
    right: 3px;
    height: 2px;
    background: #ffffff;
  }

  .menu-btn .menu-icon span:nth-child(1){ top: 6px; }
  .menu-btn .menu-icon span:nth-child(2){ top: 11px; }
  .menu-btn .menu-icon span:nth-child(3){ top: 16px; }

  .menu-btn.open .menu-icon span:nth-child(1){
    top: 11px;
    transform: rotate(45deg);
  }

  .menu-btn.open .menu-icon span:nth-child(2){
    opacity: 0;
  }

  .menu-btn.open .menu-icon span:nth-child(3){
    top: 11px;
    transform: rotate(-45deg);
  }

  .cas-mobile-drawer{
    display: block;
    position: fixed;
    inset: var(--cas-mobile-header-height) 0 0 0;
    z-index: 2;
    visibility: hidden;
    pointer-events: none;
    overflow: hidden;
  }

  .cas-mobile-drawer.is-open,
  .cas-mobile-drawer.is-closing{
    visibility: visible;
  }

  .cas-mobile-drawer.is-open{
    pointer-events: auto;
  }

  .cas-mobile-drawer__backdrop{
    position: absolute;
    inset: 0;
    background: transparent;
    pointer-events: none;
  }

  .cas-mobile-drawer.is-open .cas-mobile-drawer__backdrop{
    pointer-events: auto;
  }

  .cas-mobile-drawer__panel{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    scrollbar-gutter: auto;
    background: #000000;
    color: #ffffff;
    box-shadow:
      0px 3px 3px -2px rgba(0, 0, 0, 0.20),
      0px 3px 4px 0px rgba(0, 0, 0, 0.14),
      0px 1px 8px 0px rgba(0, 0, 0, 0.12);
    transform: translateY(-100%);
    visibility: visible;
    transition:
      transform 225ms cubic-bezier(0, 0, 0.2, 1),
      visibility 225ms cubic-bezier(0, 0, 0.2, 1);
    will-change: transform;
  }

  .cas-mobile-drawer__panel::-webkit-scrollbar{
    width: 0;
    height: 0;
    display: none;
  }

  .cas-mobile-drawer.is-open .cas-mobile-drawer__panel{
    transform: translateY(0);
  }

  .cas-mobile-drawer.is-closing .cas-mobile-drawer__panel{
    transform: translateY(-100%);
    transition:
      transform 195ms cubic-bezier(0.4, 0, 0.6, 1),
      visibility 195ms cubic-bezier(0.4, 0, 0.6, 1);
  }

  .cas-mobile-drawer__nav{
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    padding-top: 15px;
    background: #000000;
    color: #ffffff;
    font-family: "Red Hat Display", "Red Hat Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    box-sizing: border-box;
  }

  .cas-mobile-link{
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 54px;
    padding: 12px 24px;
    border-top: 1px solid rgba(242, 242, 242, 0.52);
    background: #000000;
    color: #ffffff;
    font-family: "Red Hat Display", "Red Hat Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 1.27rem;
    font-weight: 400;
    line-height: 1.2;
    text-decoration: none;
    box-sizing: border-box;
    transition: all 0.2s ease-out 0s;
  }

  .cas-mobile-link:first-child{
    border-top: 0;
  }

  .cas-mobile-link:hover,
  .cas-mobile-link:focus{
    color: #68f31d;
    text-decoration: underline;

    outline: 0;
  }

  .cas-mobile-link:focus-visible{
    outline: 2px solid rgba(242, 242, 242, 0.9);
    outline-offset: -2px;
  }

  .cas-mobile-accordion{
    border-top: 1px solid rgba(242, 242, 242, 0.52);
    background: #000000;
  }

  .cas-mobile-drawer__nav > .cas-mobile-link:last-child,
  .cas-mobile-drawer__nav > .cas-mobile-accordion:last-child{
    border-bottom: 1px solid rgba(242, 242, 242, 0.52);
  }

  .cas-mobile-accordion__summary{
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 54px;
    margin: 0;
    padding: 0 24px;
    border: 0;
    border-top: none;
    background: #000000;
    color: #ffffff;
    font-family: "Red Hat Display", "Red Hat Text", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 1.27rem;
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    transition: all 0.2s ease-out 0s;
  }

  .cas-mobile-accordion__summary:hover,
  .cas-mobile-accordion__summary:focus{
    color: #ffffff;
    text-decoration: none;
    outline: 0;
  }

  .cas-mobile-accordion.is-open .cas-mobile-accordion__summary{
    color: #ffffff;
    text-decoration: none;
  }

  .cas-mobile-accordion__summary:focus-visible{
    outline: 2px solid rgba(242, 242, 242, 0.9);
    outline-offset: -2px;
  }

  .cas-mobile-accordion__icon{
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    fill: #ffffff;
    transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .cas-mobile-accordion.is-open .cas-mobile-accordion__icon{
    transform: rotate(180deg);
  }

  .cas-mobile-accordion__content{
    height: 0;
    overflow: hidden;
    background: #000000;
    transition: height 300ms cubic-bezier(0.4, 0, 0.2, 1);
    will-change: height;
  }

  .cas-mobile-accordion__details{
    display: flex;
    flex-direction: column;
    padding: 0 0 24px 32px;
    background: #000000;
  }

  .cas-mobile-sub-link{
    display: block;
    width: 100%;
    padding: 12px 0;
    background: #000000;
    color: #ffffff;
    font-family: "Red Hat Text", "Red Hat Display", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16.5px;
    line-height: 1.2;
    font-weight: 450;
    letter-spacing: 0.010em;
    text-decoration: underline;
    text-decoration-skip-ink: all;
    box-sizing: border-box;
    transition: all 0.2s ease-out 0s;
  }

  .cas-mobile-sub-link:hover,
  .cas-mobile-sub-link:focus{
    color: #68f31d;
    text-decoration: underline;
    outline: 0;
  }

  .cas-mobile-sub-link:focus-visible{
    outline: 2px solid rgba(242, 242, 242, 0.9);
    outline-offset: 2px;
  }

  .nav-item .nav-dropdown{
    display: none !important;
  }
}

/*
  Intermediate header:
  preserve the original desktop header height and alignment,
  hide only the desktop navigation, place the hamburger
  immediately after the two action buttons, and limit the
  opened navigation panel to the right half of the viewport.
*/
@media (min-width: 861px) and (max-width: 1200px){
  .header .header-inner{
    min-height: 0;
    padding-top: var(--header-y-pad);
    padding-bottom: var(--header-y-pad);
    align-items: stretch;
  }

  .header .brand{
    flex: 0 0 auto;
    align-self: center;
    display: flex;
    align-items: center;
  }

  .header .brand-name{
    display: inline-block;
    align-self: auto;
    transform: none;
  }

  .header .brand .mark{
    transform: translateY(1px);
  }

  .header-actions{
    margin-left: auto;
    margin-right: 0;
  }

  .header .header-inner > .menu-btn{
    margin-left: 0;
    align-self: center;
    flex: 0 0 auto;
  }

  .cas-mobile-drawer__panel{
    inset: 0 0 0 auto;
    width: 50%;
  }
}

/* Small mobile header tuning */
@media (max-width: 360px){
  .header .header-inner{
    --header-side-pad: 12px;
  }



  .header .brand .mark{
    width: 34px;
    height: 34px;
  }

  .header .brand{
    gap: 6px;
  }

  .cas-mobile-link,
  .cas-mobile-accordion__summary{
    padding-left: 16px;
    padding-right: 16px;
    font-size: 1.1rem;
    min-height: 48px;
  }

  .cas-mobile-accordion__details{
    padding-left: 24px;
  }

  .cas-mobile-sub-link{
    font-size: 15px;
  }
}

@media (prefers-reduced-motion: reduce){
  .cas-mobile-drawer__panel,
  .cas-mobile-accordion__content,
  .cas-mobile-accordion__icon{
    transition: none;
  }
}