/* Only rules the Webflow Style panel cannot express live here.
All hover / active colours are controlled in Styles. */
.nav2_component .w-form-done,.nav2_component .w-form-fail,.new_main-nav .w-form-done,.new_main-nav .w-form-fail{display:none}
.nav2_search-lens:after{content:””;position:absolute;width:6px;height:1.5px;background:#8a8580;transform:rotate(45deg);bottom:0;right:-4px}
/* the per-panel Talk to us CTA is a mobile-only element */
.nav2_panel .nav2_mob-cta{display:none}
/* — motion — */
@keyframes nav2Fade{from{opacity:0}}
@keyframes nav2Rise{from{transform:translateY(-6px)}}
.nav2_panel.is-open{animation:nav2Fade .18s ease-out}
.nav2_panel.is-open .nav2_panel-inner{animation:nav2Rise .2s ease-out}
/* .nav2_chev is a border caret with a base rotate(45deg); 225deg = 45 + 180 */
.nav2_chev{transition:transform .2s ease}
.nav2_item.is-open .nav2_chev{transform:rotate(225deg)}
@media (prefers-reduced-motion:reduce){
.nav2_panel.is-open,.nav2_panel.is-open .nav2_panel-inner{animation:none}
.nav2_chev{transition:none}
}
@media screen and (max-width:991px){
/* bar has an explicit width AND 16px side margins — without the desktop
max-width cap that overflows the viewport. Let width resolve instead. */
.nav2_bar{width:auto}
/* bar = logo + burger only (search and CTA live inside the drawer) */
.nav2_search-btn{display:none}
.nav2_actions > .button{display:none}
/* keep the burger’s 44px hit area; push the icon 11px further off the edge (22px visual) */
[data-nav2-burger]{margin-right:11px}
/* drawer shell */
.nav2_component.is-mob .nav2_panels,.new_main-nav.is-mob .nav2_panels{display:block;max-height:calc(100vh – 90px);overflow-y:auto}
.nav2_component:not(.is-mob) .nav2_panels,.new_main-nav:not(.is-mob) .nav2_panels{display:none}
/* frosted drawer, matching the desktop panels (Figma: white 70%, blur 20, soft shadow) */
.nav2_mob-root{display:none;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 10px 30px -6px rgba(0,0,0,.09),0 1px 2px rgba(0,0,0,.05)}
/* level 1 vs drilldown */
.is-mob .nav2_mob-root{display:block}
.is-mob.is-drill .nav2_mob-root{display:none}
.is-mob .nav2_panel{display:none}
.is-mob .nav2_panel.is-mob-open{display:block}
.is-mob .nav2_mob-back{display:flex;padding-top:0}
.is-mob .nav2_mob-section{display:block}
.is-mob .nav2_panel .nav2_mob-cta{display:block}
.is-mob .nav2_panel-narrow{width:100%;margin-left:0}
.nav2_panel-inner{flex-direction:column;padding:24px}
/* real search input in the drawer */
.nav2_mob-input{flex:1 1 auto;min-width:0;margin-left:10px;padding:0;border:0;background:transparent;outline:0;font-size:16px;line-height:1.4;color:#1a1a1a}
.nav2_mob-input::placeholder{color:#8a8a8a}
.nav2_mob-input::-webkit-search-decoration,.nav2_mob-input::-webkit-search-cancel-button{-webkit-appearance:none}
/* level-1 rows keep their rule, except the last (Figma) */
.nav2_mob-list .nav2_mob-row:last-child{border-bottom:0}
/* single column */
.is-mob .nav2_pk-row,.is-mob .nav2_col-left,.is-mob .nav2_col-right,.is-mob .nav2_pane-wrap{width:100%;padding:0;flex-direction:column;align-self:auto}
.is-mob .nav2_divider{display:none}
.is-mob .nav2_fmt-cols,.is-mob .nav2_ind-cols{column-count:1}
/* packaging: interleave the two desktop columns into the Figma order
(formats → end-of-life → view all → catalogue lockup) */
.is-mob .nav2_pk-row{display:flex}
.is-mob .nav2_pk-left,.is-mob .nav2_pk-right{display:contents}
.is-mob .nav2_pk-left>.nav2_mono{order:1}
.is-mob .nav2_fmt-cols{order:2}
.is-mob .nav2_pk-right>.nav2_mono{order:3}
.is-mob .nav2_eol-hold{order:4;width:100%}
.is-mob .nav2_pk-right>.nav2_viewall{order:5;width:100%}
.is-mob .nav2_cat-lockup{order:6;width:100%}
/* row density — Figma: 8px padding, NO rules between leaf items */
.is-mob .nav2_fmt-link,.is-mob .nav2_eol-link,.is-mob .nav2_ind-link,.is-mob .nav2_crow,.is-mob .nav2_link,.is-mob .nav2_chip{width:100%;padding:8px 0;border:0}
/* first leaf row sits 24px under the back rule (Figma) on panels without an eyebrow */
.is-mob [data-nav2-panel=”industry”] .w-dyn-item:first-child>a{padding-top:24px}
.is-mob [data-nav2-panel=”company”] .nav2_col-left>a:first-child{padding-top:24px}
.is-mob .nav2_chip-row{display:block;margin-bottom:0}
.is-mob .nav2_chip{display:block;height:auto;margin:0;background:transparent;font-size:16px;line-height:1.35}
.is-mob .nav2_mono{margin-top:24px;margin-bottom:12px}
/* view-all rows keep their rule (Figma) */
.is-mob .nav2_viewall{margin-top:0;padding:24px 0;border-bottom:1px solid rgba(34,34,34,.1)}
.is-mob .nav2_ind-footer{display:none}
.is-mob .nav2_pane{display:block}
.is-mob .nav2_rail,.is-mob .nav2_rail-arrow{display:none}
/* industry: no featured article on mobile */
.is-mob .nav2_col-right{display:none}
/* resources: flatten to sections */
.is-mob [data-mob-hide]{display:none}
.is-mob [data-nav2-pane=”articles”] > .padding-xxsmall,.is-mob [data-nav2-pane=”cases”] > .padding-xxsmall{display:none}
.is-mob [data-nav2-pane=”software”] > *:first-child{display:none}
.is-mob [data-nav2-pane=”cases”] .nav2_feat-grid{display:block;grid-row-gap:0;grid-column-gap:0;margin-bottom:0}
.is-mob [data-nav2-pane=”cases”] .nav2_fcard{padding:8px 0;border-bottom:0}
.is-mob .nav2_fcard-img,.is-mob .nav2_art-img{display:none}
.is-mob .nav2_fcard .padding-small,.is-mob .nav2_sfeat .padding-small{display:none}
.is-mob .nav2_fcard .button.is-link,.is-mob .nav2_sfeat .button.is-link{display:none}
/* strip design-system wrapper padding so rows sit on the 8px rhythm */
.is-mob .nav2_fcard .padding-xxsmall,.is-mob .nav2_sfeat .padding-xxsmall{padding:0}
.is-mob .nav2_fcard .paragraph,.is-mob .nav2_sfeat .paragraph,.is-mob .nav2_srow .paragraph{margin:0}
/* software rows — no rules between items (Figma) */
.is-mob .nav2_sfeat{flex-direction:row;padding:8px 0;border-bottom:0;margin-bottom:0}
.is-mob .nav2_sfeat-media{display:none}
.is-mob .nav2_srow{padding:8px 0;border-bottom:0}
.is-mob .nav2_sicon-footprint,.is-mob .nav2_sicon-dieline,.is-mob .nav2_sicon-report{display:none}
.is-mob .nav2_srow-copy .heading-style-h5-caption{display:none}
/* resources: one hover treatment across Articles / Case studies / Software
(matches the .nav2_srow:hover set in Styles: grey fill + 8px indent) */
.is-mob .nav2_chip,.is-mob .nav2_fcard,.is-mob .nav2_sfeat{transition:all .2s cubic-bezier(.455,.03,.515,.955)}
.is-mob .nav2_chip:hover,.is-mob [data-nav2-pane=”cases”] .nav2_fcard:hover,.is-mob .nav2_sfeat:hover{background-color:rgba(0,0,0,.05);padding-left:8px;color:#1a1a1a;border-color:transparent}
}
