/* HELPRITE / V20 – classic homepage hero and stable sticky header.
   Works over V19 without touching forms, menus, recruitment or CMS settings. */

/* Always use the same solid navy identity before and after scrolling.
   The previous white scroll state was making the light logo/nav invisible. */
header.top,
header.top.sc,
header.top.scrolled-deep,
header.top.sc.scrolled-deep{
  position:sticky!important;
  top:0!important;
  z-index:120!important;
  background:#10213c!important;
  color:#eef5ff!important;
  border-bottom:1px solid rgba(255,255,255,.13)!important;
  box-shadow:0 6px 18px rgba(9,26,49,.13)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
header.top .util,
header.top.sc .util{
  background:#10213c!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
}
header.top .bar,
header.top.sc .bar,
header.top.scrolled-deep .bar{
  background:#10213c!important;
  min-height:84px!important;
}
header.top.sc .bar,
header.top.scrolled-deep .bar{min-height:77px!important;}
header.top .bar>.logo img.lg-l,
header.top.sc .bar>.logo img.lg-l,
header.top.scrolled-deep .bar>.logo img.lg-l{display:none!important;}
header.top .bar>.logo img.lg-d,
header.top.sc .bar>.logo img.lg-d,
header.top.scrolled-deep .bar>.logo img.lg-d{
  display:block!important;
  width:175px!important;
  height:auto!important;
  max-width:100%;
  filter:none!important;
}
header.top nav li a,
header.top.sc nav li a,
header.top.scrolled-deep nav li a{
  color:#e1ecfb!important;
  background:transparent!important;
  min-height:76px;
}
header.top nav li a:hover,
header.top nav li a[aria-current="page"],
header.top.sc nav li a:hover,
header.top.sc nav li a[aria-current="page"]{color:#fff!important;}
header.top nav li a::after,
header.top.sc nav li a::after{background:#8bc5f5!important;}
header.top .bar>a.portal.portal-desktop,
header.top.sc .bar>a.portal.portal-desktop,
header.top.scrolled-deep .bar>a.portal.portal-desktop,
header.top .bar>a.portal.portal-desktop:visited{
  background:#f4f8ff!important;
  color:#10213c!important;
  border:1px solid #f4f8ff!important;
  border-radius:5px!important;
}
header.top .bar>a.portal.portal-desktop:hover{background:#dcecff!important;border-color:#dcecff!important;}
header.top .bar>a.portal.portal-desktop svg,
header.top.sc .bar>a.portal.portal-desktop svg{color:#10213c!important;fill:#10213c!important;}

/* Restore the original two-column hero from the user's reference image,
   with exactly the old title, buttons, monogram artwork and vertical marker. */
.hero.hero-atelier:not(.v19-hero){
  background:#fbfcfe!important;
  color:#10213c!important;
  isolation:isolate;
  border:0!important;
  min-height:0!important;
}
.hero.hero-atelier:not(.v19-hero)::before{
  background:transparent!important;
  width:0!important;
}
.hero.hero-atelier:not(.v19-hero)::after{display:none!important;}
.hero.hero-atelier .hero-artboard{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(340px,.88fr);
  align-items:center;
  gap:clamp(34px,5vw,94px);
  padding-top:clamp(68px,6.3vw,112px);
  padding-bottom:clamp(62px,6.3vw,112px);
}
.hero.hero-atelier .hero-copy{min-width:0;position:relative;z-index:2;}
.hero.hero-atelier .hero-kicker{
  color:#285e99!important;
  font-size:.72rem!important;
  font-weight:800!important;
  letter-spacing:.17em!important;
  margin-bottom:26px!important;
}
.hero.hero-atelier .hero-kicker .kicker-line{background:#2e75b4!important;}
.hero.hero-atelier h1{
  color:#10213c!important;
  font-size:clamp(3.4rem,5.2vw,5.5rem)!important;
  line-height:1.095!important;
  letter-spacing:-.069em!important;
  font-weight:800!important;
  max-width:16ch!important;
  margin:0 0 31px!important;
}
.hero.hero-atelier h1 .hero-emphasis{color:#255b9a!important;}
.hero.hero-atelier h1 .hero-emphasis::after{display:block!important;background:#70a8d8!important;height:3px!important;}
.hero.hero-atelier .hero-summary{
  max-width:49ch!important;
  color:#566982!important;
  font-size:clamp(1.06rem,1.27vw,1.22rem)!important;
  line-height:1.76!important;
  margin:0!important;
}
.hero.hero-atelier .hero-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:18px 30px!important;
  margin-top:35px!important;
}
.hero.hero-atelier .hero-primary,
.hero.hero-atelier .hero-primary:visited{
  background:#193d72!important;
  border-color:#193d72!important;
  color:#fff!important;
  border-radius:4px!important;
  padding:13px 24px!important;
  min-height:54px!important;
  box-shadow:none!important;
  width:auto!important;
}
.hero.hero-atelier .hero-primary:hover{background:#0e2f5b!important;border-color:#0e2f5b!important;}
.hero.hero-atelier .hero-secondary,
.hero.hero-atelier .hero-secondary:visited{
  color:#152b46!important;
  border-bottom-color:#152b46!important;
}
.hero.hero-atelier .hero-secondary .material-icon{fill:currentColor;}
.hero.hero-atelier .hero-stage{
  min-width:0;
  min-height:560px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero.hero-atelier .hero-stage::before{
  display:block!important;
  content:"";
  position:absolute;
  inset:6% 4% -2% 1%;
  transform:translate(13px,12px);
  border:1px solid #d5e1ef;
  background:transparent!important;
  z-index:-1;
}
.hero.hero-atelier .stage-frame{
  position:relative;
  width:min(100%,550px)!important;
  max-width:550px!important;
  aspect-ratio:.93!important;
  border-radius:0!important;
  overflow:hidden;
  background:#102b50!important;
  box-shadow:0 22px 42px -32px rgba(6,27,54,.3)!important;
}
.hero.hero-atelier .stage-image{
  display:block;
  width:100%;height:100%;
  object-fit:cover!important;
  padding:0!important;
  animation:none!important;
  transform:none!important;
  translate:0 0!important;
}
.hero.hero-atelier .stage-graticule{
  display:block!important;
  inset:13px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:0!important;
}
.hero.hero-atelier .stage-index{top:24px;left:30px;}
.hero.hero-atelier .stage-foot{left:30px!important;right:30px!important;bottom:24px!important;}
.hero.hero-atelier .hero-side-marker{display:block!important;}

/* Mobile navigation: clear close icon visible and reachable above the drawer. */
header.top .menu{position:relative;}
header.top .menu-close-icon{display:none;width:22px;height:22px;pointer-events:none;}
@media(max-width:1320px){
  header.top .bar>.logo img.lg-d,header.top.sc .bar>.logo img.lg-d{width:158px!important;}
  header.top nav li a,header.top.sc nav li a{font-size:.79rem!important;}
}
@media(max-width:1080px){
  .hero.hero-atelier .hero-artboard{grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr);gap:32px;}
  .hero.hero-atelier h1{font-size:clamp(3rem,5.1vw,4.6rem)!important;}
  .hero.hero-atelier .hero-stage{min-height:420px;}
}
@media(max-width:980px){
  header.top .bar,header.top.sc .bar{min-height:76px!important;}
  header.top .menu,header.top.sc .menu{
    position:relative!important;
    z-index:200!important;
    width:45px;height:45px;
    color:#fff!important;
    border:1px solid rgba(217,235,255,.35)!important;
    background:rgba(255,255,255,.08)!important;
    border-radius:5px!important;
    cursor:pointer;
  }
  header.top .menu-glyph>span{background:#fff!important;}
  header.top .menu[aria-expanded="true"]{background:rgba(255,255,255,.15)!important;}
  header.top .menu[aria-expanded="true"] .menu-glyph{display:none!important;}
  header.top .menu[aria-expanded="true"] .menu-close-icon{display:block!important;color:#fff!important;}
  header.top nav{z-index:150!important;}
  header.top nav li a,header.top.sc nav li a{min-height:0!important;color:#dfeaf4!important;}
  header.top nav li a:hover,header.top nav li a[aria-current="page"]{background:rgba(106,174,223,.13)!important;color:#fff!important;}
  .hero.hero-atelier .hero-artboard{grid-template-columns:1fr;gap:34px;padding-top:60px;padding-bottom:65px;}
  .hero.hero-atelier .hero-stage{min-height:0;max-width:580px;width:100%;margin-inline:auto;}
  .hero.hero-atelier .stage-frame{aspect-ratio:1.3!important;width:100%!important;}
  .hero.hero-atelier .hero-side-marker{display:none!important;}
}
@media(max-width:700px){
  header.top .bar,header.top.sc .bar{min-height:73px!important;}
  header.top .bar>.logo img.lg-d{width:152px!important;}
  .hero.hero-atelier .hero-artboard{gap:26px;padding-top:48px;padding-bottom:50px;}
  .hero.hero-atelier h1{font-size:clamp(2.4rem,8.2vw,3.45rem)!important;line-height:1.13!important;max-width:18ch!important;margin-bottom:22px!important;}
  .hero.hero-atelier .hero-summary{font-size:1rem!important;line-height:1.7!important;}
  .hero.hero-atelier .hero-actions{flex-direction:column!important;align-items:stretch!important;gap:17px!important;}
  .hero.hero-atelier .hero-primary{width:100%!important;justify-content:center!important;}
  .hero.hero-atelier .hero-secondary{align-self:center;}
  .hero.hero-atelier .stage-frame{aspect-ratio:1.27!important;}
}
/* Keep the drawer from changing the sticky header's scroll container. */
@media(max-width:980px){
  body.menu-is-open{overflow:visible!important;}
  html:has(body.menu-is-open){overflow:hidden;}
  header.top button.menu,
  header.top.sc button.menu,
  header.top.scrolled-deep button.menu{
    background:rgba(255,255,255,.09)!important;
    color:#fff!important;
    border-color:rgba(217,235,255,.38)!important;
  }
  header.top button.menu .menu-glyph{display:flex!important;}
  header.top button.menu[aria-expanded="true"]{
    position:fixed!important;
    top:16px!important;
    right:max(20px,env(safe-area-inset-right))!important;
    left:auto!important;
    z-index:500!important;
    background:rgba(255,255,255,.13)!important;
  }
  header.top button.menu[aria-expanded="true"] .menu-glyph{display:none!important;}
  header.top button.menu[aria-expanded="true"] .menu-close-icon{display:block!important;}
}