/* Shared product directory, loaded after the legacy navigation styles. */
.fix_nav > .top { position: relative; }
.fix_nav { position: relative; z-index: 1000; }
#cssmenu, #cssmenu > ul, #cssmenu > ul > .products-nav { position: static; }
#cssmenu .products-menu, #cssmenu .products-menu * { box-sizing: border-box; }
#cssmenu .products-menu { color: #183b2b; font-family: 'Poppins', sans-serif; line-height: 1.5; text-align: left; }
#cssmenu .products-menu [hidden] { display: none !important; }
#cssmenu .pm-trigger { display: flex; align-items: center; gap: 9px; margin: 20px 12px; padding: 10px 0; color: #183b2b; font-size: 15px; font-weight: 600; line-height: 1; list-style: none; cursor: pointer; border-bottom: 2px solid transparent; }
#cssmenu .pm-trigger::-webkit-details-marker { display: none; }
#cssmenu .pm-trigger::marker { content: ''; }
#cssmenu .pm-chevron { width: 7px; height: 7px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg) translateY(-2px); }
#cssmenu .products-menu[open] .pm-chevron { transform: rotate(225deg) translate(-2px, -1px); }
#cssmenu .products-nav-current .pm-trigger, #cssmenu .products-menu[open] .pm-trigger, #cssmenu .pm-trigger:hover { border-bottom-color: #80a450; }
#cssmenu .pm-panel { position: absolute; top: 100%; right: 0; z-index: 1100; width: min(1080px, calc(100vw - 40px)); overflow: hidden; border: 1px solid #dce7de; border-top: 3px solid #6c983f; border-radius: 0 0 18px 18px; background: #fff; box-shadow: 0 22px 60px #173a2926; }
#cssmenu .pm-header { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 24px 28px; background: #f5f8f1; border-bottom: 1px solid #e3eadf; }
#cssmenu .pm-eyebrow { display: block; margin-bottom: 5px; color: #57713f; font-size: 10px; font-weight: 600; letter-spacing: .14em; }
#cssmenu .pm-header h2 { margin: 0; color: #183b2b; font-size: 24px; font-weight: 600; line-height: 1.3; text-align: left; }
#cssmenu .pm-header p { margin: 6px 0 0; color: #627066; font-size: 12px; line-height: 1.5; }
#cssmenu .pm-search-wrap { flex: 0 1 345px; }
#cssmenu .pm-search-wrap label { display: block; margin-bottom: 6px; color: #3d5447; font-size: 12px; font-weight: 500; }
#cssmenu .pm-search-wrap input { display: block; width: 100%; min-height: 46px; margin: 0; padding: 12px 14px; border: 1px solid #cbd8c5; border-radius: 9px; background: #fff; color: #183b2b; font: 13px/1.5 'Poppins', sans-serif; }
#cssmenu .pm-search-wrap input::placeholder { color: #6f7d74; opacity: 1; }
#cssmenu .pm-body { display: grid; grid-template-columns: minmax(0, 1fr); }
#cssmenu .pm-enhanced .pm-body { grid-template-columns: 215px minmax(0, 1fr); }
#cssmenu .pm-categories { padding: 22px 14px; border-right: 1px solid #e5eae2; background: #fbfcf9; }
#cssmenu .pm-category-label { display: block; padding: 0 12px; margin-bottom: 12px; color: #6d7a6b; font-size: 10px; font-weight: 600; letter-spacing: .08em; }
#cssmenu .pm-categories button { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 44px; margin: 0 0 5px; padding: 11px 12px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #4b5b50; font: 12px/1.4 'Poppins', sans-serif; text-align: left; cursor: pointer; }
#cssmenu .pm-categories button:hover { background: #edf2e7; }
#cssmenu .pm-categories button[aria-pressed="true"] { border-color: #1d5835; background: #1d5835; color: #fff; font-weight: 500; }
#cssmenu .pm-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; min-height: 22px; padding: 1px 5px; border-radius: 5px; background: #e7eddf; color: #536847; font-size: 10px; }
#cssmenu [aria-pressed="true"] .pm-badge { background: #ffffff26; color: #fff; }
#cssmenu .pm-results-wrap { min-width: 0; max-height: min(430px, calc(100dvh - 340px)); overflow-y: auto; overscroll-behavior: contain; padding: 18px 22px 24px; scrollbar-width: thin; scrollbar-color: #becdb5 #f6f8f2; }
#cssmenu .pm-results-meta { display: flex; justify-content: space-between; margin-bottom: 12px; color: #69796c; font-size: 11px; }
#cssmenu .pm-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
#cssmenu a.pm-product { display: flex; flex-direction: column; float: none; position: relative; gap: 5px; width: auto; min-width: 0; min-height: 87px; margin: 0; padding: 13px 14px; border: 1px solid #e6ebe3; border-radius: 9px; background: #fff; color: #183b2b; text-decoration: none; text-transform: none; line-height: 1.4; }
#cssmenu a.pm-product:hover, #cssmenu a.pm-product[aria-current="page"] { border-color: #92af7b; background: #f1f6ea; color: #183b2b; }
#cssmenu .pm-product-name { display: block; color: inherit; font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
#cssmenu .pm-composition { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #647264; font-size: 10px; font-weight: 400; line-height: 1.5; }
#cssmenu .pm-empty { padding: 36px 16px; color: #183b2b; text-align: center; }
#cssmenu .pm-empty strong { font-size: 17px; }
#cssmenu .pm-empty p { margin: 10px 0 18px; color: #637264; font-size: 13px; line-height: 1.6; }
#cssmenu .pm-reset { min-height: 44px; padding: 10px 18px; border: 1px solid #1d5835; border-radius: 8px; background: #1d5835; color: #fff; font: 13px/1.5 'Poppins', sans-serif; cursor: pointer; }
#cssmenu .pm-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 28px; border-top: 1px solid #e5eae2; background: #fbfcf9; color: #687667; font-size: 11px; }
#cssmenu .pm-footer a { display: inline-flex; float: none; align-items: center; gap: 14px; width: auto; min-height: 30px; padding: 0; margin: 0; border: 0; background: transparent; color: #1d5835; font-size: 12px; font-weight: 600; text-transform: none; text-decoration: none; line-height: 1.5; }
#cssmenu .pm-footer a:hover { color: #183b2b; text-decoration: underline; }
#cssmenu .products-menu :is(a, button, input, summary):focus-visible { outline: 3px solid #d5812d; outline-offset: 3px; }
#cssmenu #menu-button, #cssmenu .submenu-button { font-family: inherit; text-align: left; background: transparent; border: 0; border-radius: 0; }

@media (min-width: 961px) {
    .fix_nav > .top { display: flex; align-items: center; gap: 24px; }
    .fix_nav > .top > .clear { display: none; }
    .fix_nav .logo { float: none; flex: 0 0 180px; width: 180px; margin: 0; }
    .fix_nav .logo img { max-width: 100%; height: auto; }
    .fix_nav .top_right { float: none; flex: 1; width: auto; min-width: 0; }
    .fix_nav .navbarrr { display: flex; align-items: center; justify-content: flex-end; gap: 18px; width: auto; float: none; margin: 0; }
    .fix_nav .navbarrr > .link { flex: 0 0 auto; }
    .fix_nav .quote { float: none; width: auto; margin: 0; }
    .fix_nav .quote_btn { width: auto; padding: 13px 20px; white-space: nowrap; }
    .fix_nav .journey { flex: 0 0 100px; width: 100px; margin: 0; }
    #cssmenu > ul { display: flex; align-items: center; float: none; }
    #cssmenu > ul > li > a { white-space: nowrap; }
    #cssmenu .submenu-button { display: none; }
    #cssmenu li:focus-within > ul { left: auto; }
    #cssmenu li:focus-within > ul > li { height: auto; }
}
@media (min-width: 961px) and (max-width: 1280px) {
    .fix_nav .journey { display: none; }
    .fix_nav > .top { gap: 14px; }
    .fix_nav .logo { flex-basis: 150px; width: 150px; }
    .fix_nav .navbarrr { gap: 12px; }
    #cssmenu > ul > li > a, #cssmenu .pm-trigger { font-size: 13px; margin-inline: 9px; }
    .fix_nav .quote_btn { padding: 12px 15px; font-size: 13px; }
}
@media (max-width: 960px) {
    #cssmenu #menu-button { width: 100%; min-height: 46px; }
    #cssmenu > ul { max-height: calc(100dvh - 195px); overflow-y: auto; overscroll-behavior: contain; }
    #cssmenu > ul > li > a { min-height: 44px; padding: 15px 18px; }
    #cssmenu .submenu-button { height: 44px; width: 46px; }
    #cssmenu .pm-trigger { justify-content: space-between; min-height: 44px; margin: 0; padding: 14px 22px 14px 18px; color: #fff; font-size: 14px; border: 0; }
    #cssmenu .products-nav-current .pm-trigger, #cssmenu .products-menu[open] .pm-trigger { background: #1d5835; }
    #cssmenu .pm-panel { position: relative; top: auto; right: auto; width: 100%; border: 0; border-radius: 0; box-shadow: none; }
    #cssmenu .pm-header { flex-wrap: wrap; gap: 14px; padding: 20px; }
    #cssmenu .pm-header h2 { font-size: 21px; }
    #cssmenu .pm-search-wrap { flex-basis: 100%; }
    #cssmenu .pm-search-wrap input { font-size: 16px; }
    #cssmenu .pm-enhanced .pm-body { grid-template-columns: minmax(0, 1fr); }
    #cssmenu .pm-categories { display: flex; gap: 7px; overflow-x: auto; padding: 13px 16px; border: 0; border-bottom: 1px solid #e5eae2; }
    #cssmenu .pm-category-label { display: none; }
    #cssmenu .pm-categories button { flex: 0 0 auto; width: auto; margin: 0; border-color: #dfe7d8; white-space: nowrap; }
    #cssmenu .pm-results-wrap { max-height: 340px; max-height: min(340px, 45dvh); padding: 16px; }
    #cssmenu .pm-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #cssmenu .pm-footer { padding: 14px 18px; }
    #cssmenu .pm-footer > span { display: none; }
    #cssmenu .pm-footer a { min-height: 44px; }
}
@media (max-width: 420px) {
    #cssmenu .pm-results { grid-template-columns: minmax(0, 1fr); }
    #cssmenu a.pm-product { min-height: 74px; }
}
@media (min-width: 961px) and (max-height: 650px) {
    #cssmenu .pm-panel { max-height: calc(100dvh - 120px); overflow-y: auto; }
    #cssmenu .pm-results-wrap { max-height: 250px; }
}
