/* Rotaflow mega menu — from /reports/mega-menu-figma-spec.md */
:root{
  --rf-navy-800:#001D36; --rf-navy-500:#004987; --rf-navy-25:#FDFEFF; --rf-navy-100:#EAF5FF;
  --rf-orange-600:#F9500D; --rf-orange-100:#FFE5D5;
  --rf-g700:#414651; --rf-g600:#535862; --rf-g500:#717680; --rf-g300:#D5D7DA; --rf-g200:#E9EAEB; --rf-g100:#F5F5F5;
  --rf-shadow:0 4px 16px rgba(0,0,0,.25);
  --rf-container:1440px; --rf-pad:82px;
  --rf-font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

/* ---- Header shell ---- */
.rf-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:var(--rf-navy-25);border-bottom:1px solid var(--rf-g200);font-family:var(--rf-font);transition:background .25s ease,border-color .25s ease}
/* offset page content on non-overlay (inner) pages so it isn't hidden under the fixed header */
body.rf-fixed-offset{padding-top:var(--rf-header-h,104px)}
/* keep clear of the WP admin bar when logged in */
.admin-bar .rf-header{top:32px}
@media (max-width:782px){.admin-bar .rf-header{top:46px}}

/* ---- Transparent overlay header (front page) ---- */
.rf-header--overlay{background:transparent;border-bottom-color:transparent}
.rf-header--overlay .rf-nav__link{color:#fff}
.rf-header--overlay .rf-search{color:#fff}
.rf-header--overlay .rf-burger{color:#fff}
.rf-header--overlay .rf-nav__link:hover,
.rf-header--overlay .rf-nav__item.is-open>.rf-nav__link{color:var(--rf-orange-600)}
/* solidified: scrolled past top OR a panel is open */
.rf-header--overlay.is-solid{background:var(--rf-navy-25);border-bottom-color:var(--rf-g200)}
.rf-header--overlay.is-solid .rf-nav__link{color:var(--rf-navy-800)}
.rf-header--overlay.is-solid .rf-search{color:var(--rf-navy-500)}
.rf-header--overlay.is-solid .rf-burger{color:var(--rf-navy-800)}
.rf-header--overlay.is-solid .rf-nav__item.is-open>.rf-nav__link{color:var(--rf-orange-600)}
/* When a dropdown opens, solidify the (front-page) header INSTANTLY instead of
   fading over .25s — during the fade the hero shows through the transparent
   header and reads as a stray band above the panel. Scroll-solidify keeps its fade. */
.rf-header--overlay:has(.rf-nav__item.is-open){transition:none}
.rf-header *{box-sizing:border-box}
.rf-header__inner{max-width:90rem;margin:0 auto;padding:0.75rem 3.5rem;display:flex;align-items:center;justify-content:space-between;gap:16px}
.rf-logo{display:flex;align-items:center;flex:0 0 auto;padding-right:32px}
.rf-logo img{height:80px;width:auto;display:block}

/* ---- Nav ---- */
.rf-nav{flex:1 1 auto}
.rf-nav__list{display:flex;align-items:center;gap:16px;list-style:none;margin:0;padding:0}
.rf-nav__item{position:static}
.rf-nav__link{display:inline-flex;align-items:center;gap:4px;padding:8px;background:none;border:0;cursor:pointer;
  font-family:var(--rf-font);font-weight:600;font-size:16px;line-height:1.5;color:var(--rf-navy-800);text-decoration:none;white-space:nowrap}
.rf-nav__link:hover{color:var(--rf-orange-600)}
.rf-chev{transition:transform .2s ease}
/* open state */
.rf-nav__item.is-open>.rf-nav__link{color:var(--rf-orange-600);text-decoration:underline;text-underline-offset:4px}
.rf-nav__item.is-open>.rf-nav__link .rf-chev{transform:rotate(180deg)}

/* ---- Right side ---- */
.rf-header__right{display:flex;align-items:center;gap:24px;flex:0 0 auto}
.rf-search{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:none;border:0;cursor:pointer;color:var(--rf-navy-500)}
.rf-btn{display:inline-flex;align-items:center;justify-content:center;min-width:144px;padding:16px 28px;border-radius:56px;
  background:var(--rf-navy-500);border:1px solid var(--rf-navy-500);color:var(--rf-navy-25);
  font-weight:600;font-size:16px;line-height:1.5;text-decoration:none;white-space:nowrap}
.rf-btn:hover{background:#013a6b;border-color:#013a6b;color:#fff}

/* ---- Panels ---- */
.rf-panel{position:absolute;left:0;right:0;top:100%;background:var(--rf-navy-25);box-shadow:var(--rf-shadow);
  border-radius:0 0 24px 24px;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:1001}
/* only the OPEN panel captures the cursor — while it's closing (is-open removed) it
   must not, or the fading panel (a descendant of the nav item) re-fires mouseenter and
   the menu re-opens on its own when the cursor is over that area. */
.rf-nav__item.is-open>.rf-panel{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.rf-panel__inner{max-width:var(--rf-container);margin:0 auto;padding:32px 3.5rem}

/* generic columns */
.rf-col{display:flex;flex-direction:column;gap:16px}
.rf-link{display:inline-flex;align-items:center;gap:6px;font-weight:400;font-size:16px;line-height:1.5;color:var(--rf-g700);text-decoration:none}
a.rf-link:hover{color:var(--rf-orange-600)}
.rf-link--plain{color:var(--rf-navy-800);cursor:default;font-weight:600}
.rf-chev-right{color:var(--rf-orange-600);font-weight:700;font-size:1.1em;line-height:1}
@media (min-width:1025px){
  /* Menu chevron: design icon (Figma 2817-42330), colored to match the text (navy, hover orange) */
  .rf-chev-right{ color:inherit; display:inline-block; vertical-align:middle; font-size:0; width:20px; height:20px; flex:0 0 auto; background-color:currentColor; -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 18l6-6-6-6" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat; mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 18l6-6-6-6" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat; }
  /* Solutions + Products panel chevrons match the design at 24px */
  .rf-cat .rf-chev-right,.rf-cat-panel .rf-group-head .rf-chev-right,.rf-product .rf-chev-right{width:24px;height:24px}
}

/* ---- Solutions two-pane ---- */
.rf-solutions{display:grid;grid-template-columns:400px 1fr;gap:0}
/* Left column: 1rem gap to divider, 1.375rem between items */
.rf-solutions__cats{display:flex;flex-direction:column;gap:1.375rem;padding-right:1rem;border-right:1px solid var(--rf-g300)}
.rf-cat{display:flex;align-items:center;gap:0;padding:0;background:none;border:0;cursor:pointer;text-align:left;text-decoration:none;color:var(--rf-navy-800)}
.rf-cat__icon{width:3rem;height:3rem;flex:0 0 auto}
/* nav-link: fills remaining width, label left / chevron right, 0.5rem padding */
.rf-cat__link{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:0.25rem;padding:0.5rem}
.rf-cat__label{font-family:"Inter",sans-serif;font-weight:600;font-size:1.25rem;line-height:1.5;color:#001D36}
.rf-cat .rf-chev-right{color:var(--rf-navy-800)}
.rf-cat.is-active .rf-cat__label{color:var(--rf-orange-600);text-decoration:underline;text-underline-offset:4px}
.rf-cat.is-active .rf-chev-right{color:var(--rf-orange-600)}
/* Content: fixed 3rem left, then two equal 50/50 columns */
.rf-solutions__content{padding-left:3rem;position:relative;min-height:240px}
.rf-cat-panel{display:none;grid-template-columns:1fr 1fr;gap:0}
.rf-cat-panel.is-active{display:grid}
.rf-cat-panel .rf-col{min-width:0;gap:0.25rem}
.rf-cat-panel .rf-col--haz{gap:0.5rem}
.rf-cat-panel .rf-subgroup{display:flex;flex-direction:column;gap:0.25rem;padding-left:1rem}
/* leaf links: Label/Large-500 */
.rf-cat-panel .rf-link{font-family:"Inter",sans-serif;font-weight:500;font-size:1rem;line-height:1.5;color:#001D36;padding:0.5rem;gap:0.25rem}
.rf-cat-panel a.rf-link:hover{color:var(--rf-orange-600)}
/* Special Hazard heading: Title/Small-600 */
.rf-cat-panel .rf-group-head .rf-link{font-family:"Inter",sans-serif;font-weight:600;font-size:1.125rem;line-height:1.5;color:#001D36;gap:0.25rem;padding:0.5rem}
/* Desktop: stack all category panels in one grid cell so the content area is
   always as tall as the tallest panel (Fire Protection) — switching categories
   no longer changes the panel height / makes the layout jump. */
@media (min-width:1025px){
  .rf-solutions__content{display:grid}
  .rf-cat-panel{grid-area:1/1;display:grid;visibility:hidden}
  .rf-cat-panel.is-active{visibility:visible}
}

/* ---- Products grid (Figma 2640-38080) ---- */
.rf-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.25rem;align-items:start}
.rf-product{display:flex;flex-direction:column;gap:0.5rem;text-decoration:none}
/* logo box: fixed 8.75rem x 4rem (35/16), logo contained & left-aligned */
.rf-product__logo{width:8.75rem!important;height:4rem!important;aspect-ratio:35/16;object-fit:contain;object-position:left center;max-width:none!important;max-height:none!important;align-self:flex-start}
/* product name: Title/Small-600, 0.5rem padding, 0.25rem gap to chevron */
.rf-product .rf-link{font-family:"Inter",sans-serif;font-weight:600;font-size:1.125rem;line-height:1.5;color:#001D36;gap:0.25rem;padding:0.5rem}
.rf-product--group{gap:0.5rem}
.rf-product--group .rf-product__main{display:flex;flex-direction:column;gap:0.5rem;text-decoration:none}
/* Ansul sub-link: Label/Large-500, indented 1rem, 0.5rem padding */
.rf-product--group>.rf-link{margin-left:1rem;padding:0.5rem;font-family:"Inter",sans-serif;color:#001D36;font-weight:500;font-size:1rem;line-height:1.5}

/* ---- Resources / About / Careers ---- */
.rf-resources{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:2.25rem}
.rf-careers{display:grid;grid-template-columns:1fr 1.2fr;gap:2.25rem}
.rf-about{display:block}
.rf-col--blocks{gap:2.25rem}
.rf-col--rail{padding-left:3.5rem}
.rf-block .rf-link{font-family:"Inter",sans-serif;font-weight:600;font-size:1.125rem;line-height:1.6875rem;color:#001D36;gap:0.25rem;padding:0.5rem}
.rf-block__desc{margin:0;font-family:"Inter",sans-serif;font-weight:400;font-size:0.875rem;line-height:1.3125rem;color:#535862;padding:0 0.5rem;max-width:34ch}

/* article cards */
.rf-rail__head{display:block;font-family:"Inter",sans-serif;font-size:1rem;font-weight:500;line-height:1.5rem;color:#717680;margin-bottom:1.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rf-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.rf-card{display:flex;flex-direction:column;text-decoration:none}
.rf-card__thumb{display:block;margin-bottom:1rem}
.rf-card__img{width:100%;height:auto;border-radius:0.5rem !important;display:block}
.rf-card__date{font-size:0.75rem;font-weight:400;line-height:1.125rem;color:#717680;margin-bottom:0.5rem}
.rf-card__title{font-weight:600;font-size:0.875rem;line-height:1.3125rem;color:#001D36;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;margin-bottom:8px}
.rf-card__more{font-weight:600;font-size:14px;color:var(--rf-navy-500)}
.rf-card:hover .rf-card__more{color:var(--rf-orange-600)}

/* job cards */
.rf-col--rail .rf-jobs{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.rf-job{display:flex;flex-direction:column}
.rf-job__date{font-family:"Inter",sans-serif;font-size:0.75rem;font-weight:400;line-height:1.125rem;color:#717680;margin-bottom:0.75rem;overflow:hidden;text-overflow:ellipsis}
.rf-job__title{font-family:"Inter",sans-serif;font-weight:500;font-size:1rem;line-height:1.5rem;color:#004987 !important;text-decoration:underline solid !important;text-underline-offset:3px;overflow:hidden;text-overflow:ellipsis;margin-bottom:0.5rem}
.rf-job__title:hover{color:var(--rf-orange-600) !important}
.rf-job__meta{font-family:"Inter",sans-serif;font-size:0.75rem;font-weight:400;line-height:1.125rem;color:#717680}
.rf-empty{color:var(--rf-g500);font-size:14px}

/* ---- Dim overlay ---- */
.rf-overlay{position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0,29,54,.45);z-index:999;opacity:0;transition:opacity .18s ease;pointer-events:none}
.rf-overlay.is-visible{opacity:1}

/* ---- Full-screen search overlay ---- */
.rf-search-overlay{position:fixed;inset:0;z-index:2000;background:rgba(0,29,54,.94);
  display:flex;align-items:center;justify-content:center;padding:24px;
  opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}
.rf-search-overlay.is-open{opacity:1;visibility:visible}
.rf-search-overlay__close{position:absolute;top:28px;right:32px;width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;background:none;border:0;color:#fff;cursor:pointer;transition:opacity .2s}
.rf-search-overlay__close:hover{opacity:.7}
.rf-search-overlay__form{display:flex;align-items:center;gap:16px;width:100%;max-width:760px;
  border-bottom:2px solid rgba(255,255,255,.85);padding-bottom:14px}
.rf-search-overlay__form input{flex:1 1 auto;min-width:0;background:none;border:0;outline:none;
  color:#fff;font-family:inherit;font-size:28px;line-height:1.3;padding:6px 0}
.rf-search-overlay__form input::placeholder{color:rgba(255,255,255,.55)}
.rf-search-overlay__submit{flex:0 0 auto;background:none;border:0;color:#fff;cursor:pointer;display:flex;align-items:center;transition:opacity .2s}
.rf-search-overlay__submit:hover{opacity:.7}
.rf-search-overlay__submit svg{width:26px;height:26px}
body.rf-search-open{overflow:hidden}
@media (max-width:600px){
  .rf-search-overlay__form input{font-size:20px}
  .rf-search-overlay__close{top:16px;right:16px}
}

/* ---- Burger (mobile) ---- */
.rf-burger{display:none;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:none;border:0;cursor:pointer;color:var(--rf-navy-800)}
.rf-burger__box{position:relative;display:block;width:28px;height:20px}
.rf-burger__bar{position:absolute;left:0;width:28px;height:2px;background:currentColor;border-radius:0;transform-origin:14px 1px;transition:top .18s ease,opacity .14s ease,transform .22s ease}
.rf-burger__bar:nth-child(1){top:0}
.rf-burger__bar:nth-child(2){top:9px}
.rf-burger__bar:nth-child(3){top:18px}
/* search/X icon micro-interaction */
.rf-search{transition:transform .25s ease,opacity .25s ease}
.rf-search:hover{color:var(--rf-orange-600) !important}
.rf-search:active{transform:scale(.9)}

/* ---- Responsive ---- */
@media (max-width:1280px){
  :root{--rf-pad:40px}
  .rf-nav__list{gap:1rem}
  .rf-nav__link{font-size:15px;padding:8px 6px}
  .rf-btn{min-width:auto;padding:12px 20px}
}
/* mobile back button — hidden on desktop, injected by JS */
.rf-mobile-back{display:none}
.rf-mobile-cta{display:none}
/* lock page scroll while the mobile nav is open */
body.nav-open{overflow:hidden}

@media (max-width:1024px){
  .rf-burger{display:flex}
  .rf-header__right .rf-btn{display:none}
  .rf-header__inner{padding:12px 20px}
  .rf-logo{margin-right:auto;padding-right:0}   /* push logo left so search + burger group on the right */
  .rf-logo img{height:48px}
  .rf-header__right{gap:8px}

  /* drawer fades in just below the header; header stays ON TOP (higher z-index)
     so the burger morph is always visible. Panels inside are ABSOLUTE. */
  .rf-nav{display:block;position:fixed;inset:var(--rf-header-h,72px) 0 0;background:#fff;z-index:990;
    overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);
    transition:opacity .22s ease,transform .22s ease,visibility .22s}
  .rf-nav.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}

  /* hamburger morphs into X when open */
  body.nav-open .rf-burger__bar:nth-child(1){top:calc(50% - 1px);transform:rotate(45deg)}
  body.nav-open .rf-burger__bar:nth-child(2){opacity:0;transform:scaleX(0)}
  body.nav-open .rf-burger__bar:nth-child(3){top:calc(50% - 1px);transform:rotate(-45deg)}
  /* overlay header on front page: solidify chrome once drawer open */
  body.nav-open .rf-header--overlay .rf-burger{color:var(--rf-navy-800)}
  body.nav-open .rf-header--overlay{background:var(--rf-navy-25);border-bottom-color:var(--rf-g200)}
  body.nav-open .rf-header--overlay .rf-search{color:var(--rf-navy-500)}

  /* level 0 (scrolls inside the drawer) */
  .rf-nav__list{position:absolute;inset:0;display:flex;flex-direction:column;align-items:stretch;gap:0;overflow-y:auto;padding:8px 20px 96px}
  .rf-nav__item{border-bottom:1px solid var(--rf-g200)}
  .rf-nav__item>.rf-nav__link{width:100%;justify-content:space-between;padding:18px 0;font-size:16px;color:var(--rf-navy-800)}
  .rf-nav__link .rf-chev{display:none}
  .rf-has-panel>.rf-nav__link::after,.rf-nav__item:not(.rf-has-panel)>.rf-nav__link::after{content:"\203A";color:var(--rf-navy-800);font-size:22px;line-height:1}
  .rf-mobile-cta{position:absolute;left:20px;right:20px;bottom:20px;z-index:2;display:flex;align-items:center;justify-content:center;padding:16px;border-radius:56px;background:var(--rf-navy-500);color:#fff;font-weight:600;font-size:16px;text-decoration:none}

  /* slide-in panels (level 1) — absolute within the drawer, slide right -> left */
  .rf-panel{position:absolute;inset:0;background:#fff;z-index:3;pointer-events:auto;
    transform:translateX(100%);transition:transform .28s ease;visibility:visible;opacity:1;display:block;
    box-shadow:none;border-radius:0;overflow:hidden auto;padding:1.75rem 1.5rem}
  .rf-panel.is-mobile-active{transform:translateX(0)}
  .rf-panel__inner{max-width:none;margin:0;padding:0}

  /* "Solutions" back-title: Title/Medium-600, chevron flush left + text padded 0.5rem 0 0.5rem 0.5rem;
     1.25rem gap down to the list below it */
  .rf-mobile-back{display:flex;align-items:center;gap:0.5rem;width:100%;padding:0.5rem 0;margin-bottom:1.25rem;border:0;background:none;
    font-family:var(--rf-font);font-weight:600;font-size:1.125rem;line-height:1.5;color:#001D36;cursor:pointer;text-align:left}
  .rf-mobile-back::before{content:"\2039";font-size:24px;line-height:1}

  /* Solutions: cats become a list; cat-panels slide to level 2 */
  .rf-solutions{display:block}
  .rf-solutions__cats{display:flex;flex-direction:column;gap:0.75rem;border-right:0;padding:0}
  .rf-cat{padding:0;justify-content:flex-start;gap:0;align-items:center}
  /* divider between items: 0.75rem above (padding-bottom) + 0.75rem below (list gap) */
  .rf-cat:not(:last-child){border-bottom:1px solid var(--rf-g200);padding-bottom:0.75rem}
  .rf-cat__icon{width:2.5rem;height:2.5rem}
  /* nav-link: fills row, label left / chevron right, padded 0.5rem 0 0.5rem 0.5rem */
  .rf-cat__link{flex:1 1 0;min-width:0;padding:0.5rem 0 0.5rem 0.5rem}
  .rf-cat__label{flex:1 1 auto;font-size:1rem;font-weight:600;line-height:1.5;color:#001D36}
  .rf-cat .rf-chev-right{margin-left:auto}
  .rf-solutions__content{display:contents}
  .rf-cat-panel,.rf-cat-panel.is-active{position:absolute;inset:0;background:#fff;z-index:4;
    transform:translateX(100%);transition:transform .28s ease;display:block;padding:1.75rem 1.5rem;overflow:hidden auto;gap:0}
  .rf-cat-panel.is-mobile-active{transform:translateX(0)}
  .rf-cat-panel .rf-col{gap:0.25rem}
  /* drill-down sub-links: Label/Large-500 (0.875rem), 0.5rem padding, 0.25rem apart */
  .rf-cat-panel .rf-link{display:block;padding:0.5rem;font-size:0.875rem;font-weight:500;line-height:1.5;color:#001D36}
  .rf-group-head{padding-top:8px}

  /* Resources / About / Careers stack as link rows */
  .rf-resources,.rf-careers,.rf-about{display:block}
  .rf-col--rail{display:none}
  /* Resources / About Us / Careers: flatten block columns into one divided list
     (Figma 2843-20454) — identical treatment for all three */
  .rf-resources,.rf-about,.rf-careers{display:flex;flex-direction:column;gap:0.75rem}
  .rf-col--blocks{display:contents}
  .rf-block{padding:0 0 0.75rem;border-bottom:1px solid var(--rf-g200)}
  /* no divider under the very last item (last block of the last block-column) */
  .rf-col--blocks:not(:has(~ .rf-col--blocks)) .rf-block:last-child{border-bottom:0;padding-bottom:0}
  .rf-block .rf-link{font-size:1rem;line-height:1.5}
  .rf-block__desc{font-size:0.75rem;line-height:1.5;color:#535862;padding:0 0.5rem;max-width:none}
  /* Products: logo (6.5625rem x 3rem) above name, dividers 0.75rem apart (Figma 2817-10094) */
  .rf-products{display:flex;flex-direction:column;gap:0.75rem}
  .rf-product{flex-direction:column;align-items:flex-start;gap:0;padding:0;border-bottom:0}
  .rf-product:not(:last-child){border-bottom:1px solid var(--rf-g200);padding-bottom:0.75rem}
  .rf-product__logo{width:6.5625rem!important;height:3rem!important;object-fit:contain;object-position:left center;max-height:none!important}
  .rf-product .rf-link{font-size:1rem;font-weight:600;line-height:1.5;color:#001D36;padding:0.5rem;gap:0.25rem}
  .rf-product--group{flex-wrap:nowrap}
}

/* ---- Dropdown open: solid whitish header + divider line (Figma 2645-29588) ---- */
.rf-header:has(.rf-nav__item.is-open){background:var(--rf-navy-25);border-bottom-color:var(--rf-g200)}
.rf-header--overlay:has(.rf-nav__item.is-open) .rf-nav__link{color:var(--rf-navy-800)}
.rf-header--overlay:has(.rf-nav__item.is-open) .rf-search{color:var(--rf-navy-500)}
.rf-header--overlay:has(.rf-nav__item.is-open) .rf-burger{color:var(--rf-navy-800)}
.rf-header--overlay:has(.rf-nav__item.is-open) .rf-nav__item.is-open>.rf-nav__link{color:var(--rf-orange-600)}
/* keep the page-dim scrim below the header so it never tints the bar */
/* start 1px under the header so no hairline of the scrim (over the page/hero)
   can peek between the header and the dropdown panel */
.rf-overlay{top:calc(var(--rf-header-h,104px) - 1px)}
.rf-panel{border-top:1px solid var(--rf-g300)}

/* Supply Chain Management is a plain <a class="rf-cat"> (no data-cat, so the JS is-active
   hover doesn't apply to it) — give it a CSS hover matching the other categories' active look. */
a.rf-cat:hover{color:var(--rf-orange-600)}
a.rf-cat:hover .rf-cat__label{color:var(--rf-orange-600);text-decoration:underline;text-underline-offset:4px}

/* Landing page: transparent header over the hero video — white logo + white (navy-text)
   CONTACT US button so they stand out. Reverts to normal when scrolled (.is-solid). */
.rf-logo img.rf-logo__white{ display: none; }
.rf-header--overlay:not(.is-solid) .rf-logo__color{ display: none; }
.rf-header--overlay:not(.is-solid) .rf-logo__white{ display: block; }
.rf-header--overlay:not(.is-solid) .rf-btn{ background:#FDFEFF; border-color:#FDFEFF; color:#004987; }
.rf-header--overlay:not(.is-solid) .rf-btn:hover{ background:#E9EAEB; border-color:#E9EAEB; color:#004987; }

/* .rf-btn hover: a 2px secondary-orange stroke appears as an outer border,
   drawn OUTSIDE the button bounds via a box-shadow spread — so it "grows"
   without scaling the button or shifting layout. Follows the 56px pill radius. */
.rf-btn { transition: box-shadow .15s ease, background .15s ease, border-color .15s ease; }
.rf-btn:hover,
.rf-btn:focus-visible { box-shadow: 0 0 0 2px #F9500D; }

/* Submenu items with no page yet are plain <span class="rf-link"> — the a.rf-link:hover
   rule missed them, so they never turned orange on hover. Cover the class too. */
.rf-link:hover{color:var(--rf-orange-600)}

/* ---- Mobile Solutions menu tweaks (Figma 2813-19335) ---- */
@media (max-width:1024px){
  /* No active/highlighted category in the mobile Solutions list (nothing selected on entry) */
  .rf-cat.is-active{ color:var(--rf-navy-800); }
  .rf-cat.is-active .rf-cat__label{ text-decoration:none; color:#001D36; }
  .rf-cat.is-active .rf-chev-right{ color:var(--rf-navy-800); }

  /* 24px chevron icons — mask + currentColor so each follows the color of the text
     beside it (navy normally, orange when that text turns orange). */
  .rf-cat .rf-chev-right,
  .rf-cat-panel .rf-link .rf-chev-right{
    font-size:0 !important; width:24px; height:24px; flex:0 0 auto; margin-left:auto; color:inherit; background-color:currentColor;
    -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 18l6-6-6-6" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/24px 24px no-repeat;
    mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 18l6-6-6-6" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/24px 24px no-repeat;
  }
  /* Resources/About/Careers block titles: 24px chevron INLINE right after the label.
     Uses a mask + currentColor so it follows the label color (navy → orange when active). */
  .rf-block .rf-link .rf-chev-right{
    font-size:0 !important; width:24px; height:24px; flex:0 0 auto; color:inherit; background-color:currentColor;
    -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 18l6-6-6-6" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/24px 24px no-repeat;
    mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 18l6-6-6-6" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/24px 24px no-repeat;
  }
  .rf-has-panel>.rf-nav__link::after,
  .rf-nav__item:not(.rf-has-panel)>.rf-nav__link::after{
    content:"" !important; width:24px; height:24px; flex:0 0 auto;
    background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 18l6-6-6-6" stroke="%23001D36" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/24px 24px no-repeat;
  }
  .rf-mobile-back::before{
    content:"" !important; width:24px; height:24px; flex:0 0 auto;
    background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M15 18l-6-6 6-6" stroke="%23001D36" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/24px 24px no-repeat;
  }
}

/* ---- Mobile main menu tweaks (Figma 2817-10152) ---- */
@media (max-width:1024px){
  /* No dividers between the top-level menu items */
  .rf-nav__item{ border-bottom:none; }
  /* Non-panel items (e.g. Projects) have no chevron */
  .rf-nav__item:not(.rf-has-panel)>.rf-nav__link::after{ content:none !important; background:none !important; }
  /* CONTACT US button flows right after the menu items, not pinned to the bottom.
     Drawer padding 1.75rem 1rem 1.125rem; items 0.5rem apart; 2.25rem before CTA. */
  .rf-nav{ display:flex; flex-direction:column; overflow-y:auto; }
  .rf-nav__list{ position:static; inset:auto; flex:0 0 auto; overflow:visible; padding:1.75rem 1rem 0; gap:0.5rem; }
  .rf-nav__item>.rf-nav__link{ padding:0.5rem; font-size:1rem; font-weight:600; line-height:1.5; color:#001D36; }
  .rf-mobile-cta{ position:static; left:auto; right:auto; bottom:auto; margin:2.25rem 1rem 1.125rem; flex:0 0 auto; }
  /* Menu open on the front page: show the original (color) logo, not the white one
     (the white logo is invisible on the white drawer). */
  body.nav-open .rf-header--overlay .rf-logo__color{ display:block; }
  body.nav-open .rf-header--overlay .rf-logo__white{ display:none; }
  /* Search + close(X) icons: navy-500 (#004987); search glyph sized to the design 32px */
  .rf-search{ color:var(--rf-navy-500); }
  .rf-search svg{ width:32px; height:32px; }
  body.nav-open .rf-burger,
  body.nav-open .rf-header--overlay .rf-burger{ color:var(--rf-navy-500); }
}

/* Search icon fills its 32px button (bigger, matches design 2817-10152) */
.rf-search svg{ width:32px; height:32px; }
/* Hamburger color = same as the close (X) icon: navy-500 (#004987) */
@media (max-width:1024px){
  .rf-burger,
  .rf-header--overlay.is-solid .rf-burger{ color:var(--rf-navy-500); }
}

/* Search icon — force a true square; a global svg{max-width:100%} + flex was
   clamping the width to ~20px so the glyph rendered small & squished. */
.rf-search svg{ width:32px !important; height:32px !important; max-width:none !important; flex:0 0 auto !important; }

/* ---- Mobile Solutions drill-down panels (Figma 2817-9832, 2817-9987) ---- */
@media (max-width:1024px){
  /* No divider lines between the links inside a category drill-down panel
     (the category LIST itself keeps its dividers — see 2813-19335). */
  .rf-cat-panel .rf-link{ border-bottom:none; }

  /* "Special Hazard" is a group head with a chevron. Inside the block-level panel
     link the chevron <span> was inline (no box), so its background-image chevron
     never showed. Make the link inline-flex so the chevron renders after the label. */
  /* "Special Hazard" heading: Title/Small-600 at 1rem on mobile, 0.25rem gap to chevron */
  .rf-cat-panel .rf-group-head .rf-link{ display:inline-flex; align-items:center; gap:0.25rem; padding:0.5rem; font-size:1rem; font-weight:600; line-height:1.5; color:#001D36; }
  .rf-cat-panel .rf-group-head .rf-link .rf-chev-right{
    margin-left:0; width:20px; height:20px; -webkit-mask-size:20px 20px; mask-size:20px 20px;
  }
}

/* ---- Mobile Products panel: logo stacked above label (Figma 2817-10094) ---- */
@media (max-width:1024px){
  /* Product links carry no chevron in the mobile panel */
  .rf-product .rf-chev-right{ display:none; }
  /* Ansul group: 0.25rem between the main link and the sub-link */
  .rf-product--group{ gap:0.25rem; }
  .rf-product--group .rf-product__main{ gap:0; }
  /* Ansul sub-link: Label/Large-500 (1rem), indented 1rem, 0.5rem padding */
  .rf-product--group>.rf-link{ margin-left:1rem; padding:0.5rem; font-size:1rem; font-weight:500; line-height:1.5; color:#001D36; }
}

/* Header CONTACT US in the white (overlay) state — hover like .rf-btn-white:
   keep the white fill, turn the 1px border + label orange. */
.rf-header--overlay:not(.is-solid) .rf-btn:hover{
  background:#FDFEFF;
  border-color:#F9500D;
  color:#F9500D;
}
