:root{--ink: #213b30; --paper: #fafbf8; --muted: #65736a; --line: #dfe4dd; --accent: #aa4b25; --header-height: 84px; --radius: 12px;}
*{box-sizing: border-box;}
html{scroll-behavior: smooth; scroll-padding-top: 108px;}
body{margin: 0px; color: var(--ink); background: var(--paper); font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.55;}
button, input, select{font: inherit;}
button, a, input, select{touch-action: manipulation;}
button{cursor: pointer;}
a{color: inherit; text-decoration: none;}
button{color: inherit;}
img{max-width: 100%;}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible{outline: rgb(178, 102, 56) solid 3px; outline-offset: 4px;}
button:disabled{cursor: not-allowed;}
button[hidden], [hidden]{display: none !important;}
h1, h2, h3, h4, p, figure{margin: 0px;}
.shell{width: min(1280px, 100% - 80px); margin-inline: auto;}
.sr-only{position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px;}
.eyebrow{font-size: 10px; letter-spacing: 0.18em; font-weight: 750; line-height: 1.5; color: rgb(75, 101, 84);}
.hero-button{border: 0px; background: rgb(26, 75, 53); color: rgb(255, 255, 255); display: inline-flex; gap: 35px; align-items: center; justify-content: center; padding: 14px 22px; font-size: 12px; font-weight: 600; min-height: 46px; border-radius: 3px;}
.hero-button:hover{background: rgb(16, 60, 40);}
.material-nav{display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid rgb(207, 216, 203);}
.material-link{display: flex; align-items: center; gap: 14px; padding: 24px 18px; border-bottom: 2px solid transparent; font-size: 14px; font-weight: 600;}
.material-link span{font-size: 9px; font-weight: 400; color: rgb(140, 151, 140);}
.material-link b{margin-left: auto; font-size: 14px; font-weight: 400;}
.material-link.selected{border-bottom-color: rgb(46, 93, 59); background: rgb(240, 244, 237);}
.material-link:hover{background: rgb(242, 245, 238);}
.catalog-section{padding-top: 52px; padding-bottom: 50px; scroll-margin-top: 100px;}
.catalog-heading{display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 27px; gap: 25px;}
.catalog-heading h2{font-size: 34px; font-weight: 500; letter-spacing: -0.04em; line-height: 1.2; margin-top: 10px;}
.catalog-heading h2 > span{color: rgb(163, 94, 55);}
.catalog-heading > p{font-size: 12px; color: rgb(123, 133, 123); max-width: 210px; text-align: right;}
.sort-control{display: flex; align-items: center; gap: 10px; font-size: 12px;}
.sort-control label{color: rgb(109, 121, 110);}
.sort-control select{background: white; border: 1px solid rgb(216, 223, 213); border-radius: 4px; padding: 12px 27px 12px 12px; font-size: 12px; color: rgb(52, 75, 56); max-width: 190px;}
.catalog-layout-v2{display: grid; grid-template-columns: 235px minmax(0px, 1fr); gap: 35px; align-items: start;}
.filter-panel{position: sticky; top: 108px; max-height: calc(100dvh - 125px); overflow: auto; padding-right: 12px; scrollbar-width: thin;}
.filter-top{display: flex; align-items: center; justify-content: space-between; padding-bottom: 19px; border-bottom: 1px solid var(--line);}
.filter-top h3{font-size: 14px; font-weight: 600;}
.filter-top > button{font-size: 10px; border: 0px; background: none; color: rgb(104, 122, 101); text-decoration: underline; padding: 8px;}
.filter-group{border-top: 0px; border-right: 0px; border-left: 0px; border-image: none; padding: 18px 0px; margin: 0px; border-bottom: 1px solid var(--line); min-width: 0px;}
.filter-group legend{padding: 0px; float: left; width: 100%; font-size: 11px; font-weight: 700; letter-spacing: 0.02em; margin-bottom: 12px;}
.filter-check{clear: both; display: flex; align-items: center; gap: 9px; font-size: 12px; min-height: 34px; cursor: pointer;}
.filter-check input{margin: 0px; width: 15px; height: 15px; accent-color: rgb(36, 91, 56); flex-shrink: 0;}
.filter-check span{line-height: 1.4;}
.filter-check small{margin-left: auto; font-size: 10px; color: rgb(139, 153, 133);}
.filter-check:has(input:disabled){color: rgb(173, 180, 168); cursor: default;}
.filter-toggle, .close-filters, .apply-filters{display: none;}
.results-meta{display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 17px; min-height: 30px; font-size: 12px; color: rgb(104, 118, 100);}
.active-filters{display: flex; gap: 7px; flex-wrap: wrap;}
.active-filters:has(button){margin: 0px 0px 17px;}
.active-filters button{border: 1px solid rgb(214, 223, 208); border-radius: 4px; background: rgb(237, 242, 232); font-size: 11px; padding: 6px 9px;}
.active-filters button span{margin-left: 10px;}
.product-grid{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 22px 18px;}
.p-card{border: 1px solid rgb(223, 228, 220); border-radius: 7px; background: white; overflow: hidden; transition: border-color 0.18s, box-shadow 0.18s;}
.p-card:hover, .p-card:focus-within{border-color: rgb(164, 181, 154); box-shadow: rgba(48, 75, 38, 0.063) 0px 8px 24px;}
.product-link{display: flex; flex-direction: column; height: 100%;}
.p-image{aspect-ratio: 1 / 1; background: rgb(241, 243, 238); overflow: hidden; border-bottom: 1px solid rgb(229, 233, 225); display: flex; align-items: center;}
.p-image img{width: 100%; height: 100%; object-fit: contain; transition: transform 0.2s; padding: 12px;}
.product-link:hover .p-image img{transform: scale(1.025);}
.p-body{padding: 18px 16px 13px; display: flex; flex-direction: column; flex: 1 1 0%;}
.p-category{font-size: 9px; font-weight: 600; color: rgb(130, 144, 120); letter-spacing: 0.05em; text-transform: uppercase;}
.p-body h3{font-size: 15px; font-weight: 600; line-height: 1.35; margin: 8px 0px 4px; letter-spacing: -0.02em;}
.p-sku{font-size: 11px; font-weight: 600; color: rgb(107, 124, 97); letter-spacing: 0.07em;}
.p-spec{font-size: 12px; color: rgb(117, 129, 110); margin: 15px 0px 16px;}
.p-foot{border-top: 1px solid rgb(233, 237, 228); padding-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; font-size: 10px; color: rgb(125, 138, 118);}
.p-view{font-size: 11px; color: rgb(40, 88, 58); font-weight: 700; white-space: nowrap;}
.p-view span{margin-left: 8px; font-size: 14px;}
.empty-state{padding: 80px 25px; text-align: center; background: white; border: 1px solid var(--line); border-radius: 7px;}
.empty-state h3{font-family: Georgia, serif; font-size: 27px; font-weight: 400;}
.empty-state p{color: var(--muted); font-size: 14px; margin: 12px 0px 24px;}
.load-more{text-align: center; padding-top: 35px;}
.load-more button{background: transparent; border: 1px solid rgb(179, 194, 169); border-radius: 4px; padding: 13px 29px; font-size: 12px; font-weight: 600; min-height: 45px;}
.load-more button span{margin-left: 30px;}
.load-more p{font-size: 10px; color: rgb(140, 153, 133); margin-top: 12px;}
.catalog-support{margin-top: 12px; margin-bottom: 70px; padding: 38px; background: rgb(234, 240, 227); display: grid; grid-template-columns: 1fr 1fr; gap: 70px; border: 1px solid rgb(220, 229, 212); border-radius: 6px; align-items: center;}
.catalog-support h2{font-family: Georgia, serif; font-size: 32px; font-weight: 400; line-height: 1.25; margin-top: 13px; letter-spacing: -0.02em;}
.catalog-support p{font-size: 13px; line-height: 1.8; color: rgb(103, 118, 94); margin-bottom: 20px; max-width: 400px;}
.unavailable-message{background: rgb(255, 245, 232); border: 1px solid rgb(231, 212, 180); border-radius: 5px; padding: 15px; font-size: 13px; margin: 0px 0px 20px;}
.filter-backdrop{position: fixed; inset: 0px; background: rgba(18, 38, 25, 0.44); z-index: 79;}
.film-cta{font-size: 12px; text-decoration: none; margin-top: 16px;}
.filter-panel:focus{outline: 0px;}
@media (max-width: 1150px) {.shell{width: calc(100% - 48px);}
.catalog-layout-v2{grid-template-columns: 210px minmax(0px, 1fr); gap: 24px;}
.p-body{padding: 14px 12px;}
.p-view{font-size: 10px;}
.p-foot{gap: 4px;}}
@media (max-width: 1000px) {.product-grid{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.material-link{font-size: 12px; padding: 20px 13px; gap: 10px;}
.catalog-heading h2{font-size: 30px;}
.catalog-support{gap: 35px;}}
@media (max-width: 720px) {.shell{width: calc(100% - 36px);}
.material-nav{grid-template-columns: repeat(2, 1fr);}
.material-link{font-size: 12px; padding: 14px 9px; border-bottom: 1px solid rgb(212, 221, 207);}
.material-link.selected{border-bottom: 2px solid rgb(53, 93, 55);}
.catalog-section{padding-top: 34px; scroll-margin-top: 85px;}
.catalog-heading{align-items: flex-start; gap: 10px;}
.catalog-heading > p{display: none;}
.catalog-heading h2{font-size: 29px;}
.filter-toggle{display: flex; gap: 15px; align-items: center; border: 1px solid rgb(209, 219, 202); border-radius: 4px; background: rgb(255, 255, 255); font-size: 12px; padding: 10px 13px; min-height: 44px;}
.filter-toggle span{background: rgb(233, 240, 226); border-radius: 3px; padding: 0px 5px;}
.sort-control{margin-left: auto;}
.sort-control select{font-size: 11px; padding: 10px; max-width: 170px;}
.sort-control label{font-size: 10px;}
.catalog-layout-v2{display: block;}
.filter-panel{display: none; position: fixed; inset: 0px auto 0px 0px; width: min(340px, 90vw); max-height: 100dvh; height: 100dvh; z-index: 80; background: rgb(255, 255, 255); padding: 22px; overflow-y: auto; box-shadow: rgba(20, 37, 27, 0.19) 12px 0px 30px;}
.filter-panel.open{display: block;}
.filter-panel .filter-top{position: sticky; top: -22px; background: rgb(255, 255, 255); z-index: 1; padding-top: 12px;}
.close-filters{display: block !important; font-size: 26px !important; text-decoration: none !important;}
.filter-check{min-height: 42px; font-size: 14px;}
.filter-top h3{font-size: 15px;}
.filter-group legend{font-size: 13px;}
.apply-filters{display: block; background: rgb(34, 78, 53); color: rgb(255, 255, 255); border: 0px; border-radius: 4px; padding: 13px; width: 100%; margin-top: 22px; position: sticky; bottom: 0px;}
.results-meta{font-size: 11px;}
.product-grid{gap: 14px 11px;}
.p-image img{padding: 7px;}
.p-body{padding: 13px 11px;}
.p-category{font-size: 8px; letter-spacing: 0.01em;}
.p-body h3{font-size: 13px; line-height: 1.4;}
.p-sku{font-size: 10px;}
.p-spec{font-size: 11px; margin: 12px 0px;}
.p-foot{align-items: flex-start; flex-direction: column; gap: 7px; padding-top: 10px;}
.p-view{font-size: 11px; width: 100%; display: flex; justify-content: space-between;}
.p-view span{margin-left: 0px;}
.catalog-support{grid-template-columns: 1fr; padding: 25px; gap: 22px; margin-bottom: 35px;}
.catalog-support h2{font-size: 28px;}
.catalog-support h2 br{display: none;}
.catalog-support p{font-size: 12px;}}
@media (max-width: 360px) {.product-grid{grid-template-columns: 1fr;}
.p-foot{flex-direction: row;}
.sort-control select{max-width: 145px;}
.sort-control label{display: none;}}
.p-category{font-size: 10px; color: rgb(91, 110, 82);}
.p-sku{font-size: 12px; color: rgb(82, 101, 72);}
.p-spec{font-size: 13px; color: rgb(89, 107, 80);}
.p-foot, .filter-check small{color: rgb(89, 107, 80);}
.results-meta{color: rgb(82, 99, 73);}
.p-body h3{color: rgb(33, 59, 48);}
.load-more p{color: rgb(96, 114, 86);}
@media (max-width: 720px) {.p-category{font-size: 9px;}
.p-sku{font-size: 11px;}
.p-spec{font-size: 12px;}}
@media (prefers-reduced-motion: reduce) {html{scroll-behavior: auto;}
*, ::before, ::after{scroll-behavior: auto !important; transition: none !important; animation: auto ease 0s 1 normal none running none !important;}}
.material-nav{grid-template-columns: repeat(5, minmax(0px, 1fr));}
.material-link{font-size: 18px; padding: 24px 17px; gap: 8px;}
.material-link b{font-size: 18px;}
.catalog-section{padding-top: 40px;}
.catalog-heading{margin-bottom: 24px;}
.catalog-heading h2{font-size: 34px; margin: 0px; letter-spacing: -0.03em; font-weight: 500;}
.catalog-layout-v2{grid-template-columns: 276px minmax(0px, 1fr); gap: 28px;}
.v1-sidebar{background: rgb(255, 255, 255); border: 1px solid rgb(220, 228, 218); border-radius: 12px; padding: 18px; box-shadow: rgba(24, 53, 36, 0.03) 0px 8px 24px; max-height: calc(100dvh - 122px);}
.v1-sidebar .filter-top{border: 0px; padding: 0px; margin: 0px 0px 13px; gap: 8px;}
.v1-sidebar .filter-top h3{font-size: 15px; line-height: 1.4;}
#activeFilterCount{font-size: 11px; color: rgb(102, 118, 96); margin-left: auto; white-space: nowrap;}
.sidebar-search{position: relative; display: flex; align-items: center; border: 1px solid rgb(213, 223, 208); border-radius: 7px; background: rgb(247, 249, 244); min-height: 42px;}
.sidebar-search > span:first-child{position: absolute; left: 10px; top: 6px; color: rgb(101, 119, 95); font-size: 23px; line-height: 28px; pointer-events: none;}
.sidebar-search input{width: 100%; min-width: 0px; padding: 11px 9px 11px 34px; border: 0px; border-radius: 7px; background: transparent; color: rgb(37, 59, 44); font-size: 12px; line-height: 18px; height: 42px;}
.sidebar-search input::placeholder{color: rgb(109, 123, 101); opacity: 1;}
.sidebar-search:focus-within{outline: rgb(88, 119, 74) solid 2px; outline-offset: 1px;}
.sidebar-search input:focus-visible{outline: none;}
.v1-sidebar .filter-group{padding: 18px 0px 0px; border: 0px;}
.v1-sidebar .filter-group legend{font-size: 11px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: rgb(82, 99, 75); border-bottom: 1px solid rgb(224, 230, 220); padding-bottom: 8px; margin-bottom: 8px;}
.v1-sidebar .filter-check{min-height: 32px; font-size: 13px; gap: 8px;}
.v1-sidebar .filter-check small{font-size: 11px;}
.sidebar-actions{display: flex; gap: 8px; margin-top: 18px;}
.sidebar-actions button{flex: 1 1 0%; min-height: 40px; border: 1px solid rgb(185, 203, 176); border-radius: 6px; padding: 8px 4px; font-size: 12px; font-weight: 600; background: white;}
.sidebar-actions #allProducts{background: rgb(36, 93, 59); color: rgb(255, 255, 255); border-color: rgb(36, 93, 59);}
.results-meta{min-height: 43px; align-items: center; margin-bottom: 17px;}
.results-meta > p{font-size: 13px; color: rgb(92, 111, 83);}
.results-meta .sort-control{margin-left: auto;}
.sort-control select{min-height: 40px; padding: 8px 12px; font-size: 12px;}
@media (max-width: 1150px) {.material-link{font-size: 16px; padding: 21px 12px;}
.catalog-layout-v2{grid-template-columns: 250px minmax(0px, 1fr); gap: 24px;}}
@media (max-width: 1000px) {.material-link{font-size: 15px; padding: 20px 9px;}}
@media (max-width: 720px) {.material-nav{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.material-link{font-size: 16px; padding: 16px 11px;}
.material-link:last-child{grid-column: 1 / -1;}
.catalog-section{padding-top: 30px;}
.catalog-heading h2{font-size: 29px;}
.catalog-heading{margin-bottom: 16px;}
.catalog-layout-v2{display: block;}
.v1-sidebar{max-height: 100dvh; border-radius: 0px; padding: 22px; width: min(350px, 94vw);}
.v1-sidebar .filter-top{padding-top: 12px; padding-bottom: 14px; margin-bottom: 0px; top: -22px;}
.v1-sidebar .filter-check{min-height: 38px;}
.v1-sidebar .sidebar-search{margin-top: 8px;}
.sidebar-search input{font-size: 13px; height: 44px;}
.results-meta{display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 17px;}
.results-meta > p{grid-column: 1 / -1; font-size: 12px;}
.results-meta .sort-control{margin-left: auto;}
.filter-toggle{font-size: 12px; justify-content: space-between; gap: 8px;}
.sort-control select{min-width: 85px;}}
@media (max-width: 360px) {.material-link{font-size: 15px;}
.sort-control label{display: none;}}
.tech td{overflow-wrap:anywhere}.material-link{overflow-wrap:normal}

.tech td{overflow-wrap:anywhere}.material-link{overflow-wrap:normal}

.tech td{overflow-wrap:anywhere}.material-link{overflow-wrap:normal}
