*{box-sizing:border-box}body{margin:0;background:#f4f7f6;color:#153139;font:16px/1.6 system-ui,sans-serif}header,footer{background:#fff}header>div,main,footer>div{width:min(1120px,92%);margin:auto}header>div{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;flex-wrap:wrap}nav{display:flex;gap:1rem;flex-wrap:wrap}a{color:#07635e;text-underline-offset:4px}nav a,.brand{text-decoration:none;font-weight:650}.brand{font-size:1.35rem;letter-spacing:.04em;color:#153139}.brand img{width:min(210px,55vw);vertical-align:middle}.hero{background:#10383e;color:white;margin:1.5rem 0 2rem;padding:clamp(1.5rem,6vw,5rem);border-radius:22px;background-image:radial-gradient(ellipse at top right,#24766f,transparent 64%)}h1{font-size:clamp(2.5rem,7vw,5.5rem);line-height:1;margin:.4em 0;letter-spacing:-.055em}h2{font-size:clamp(1.6rem,4vw,2.4rem);line-height:1.1}.hero p{max-width:48ch}.eyebrow{font-size:.8rem;letter-spacing:.17em;text-transform:uppercase}.button{display:inline-block;background:#c8f2df;color:#10383e;padding:.65rem 1.15rem;border-radius:6px;font-weight:700;text-decoration:none}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:1rem}.card,article{background:white;padding:1.25rem;border:1px solid #d9e5e1;border-radius:14px;overflow-wrap:anywhere}.card h3{margin-top:0}section{margin:2rem 0 3rem}details{margin:.55rem 0;border-top:1px solid #d9e5e1;padding-top:.55rem}summary{cursor:pointer;font-weight:650}article img,details img{max-width:100%;height:auto}article table,details table{display:block;max-width:100%;overflow:auto;border-collapse:collapse}td,th{padding:.25rem;border:1px solid #d9e5e1}footer>div{padding:1.5rem 0}small{color:#48646a}

/* Catalog storefront */
:root{--red:#a9162e;--deep-red:#761126;--ink:#22262c;--line:#e3e1e2}
body{background:#fff;color:var(--ink)}
header{border-bottom:1px solid var(--line)}
header>div{padding:1.2rem 0;gap:clamp(1rem,5vw,4rem)}
header nav{width:min(1120px,92%);margin:auto;gap:clamp(.8rem,4vw,2.4rem);padding:.85rem 0;border-top:1px solid var(--line)}
header nav a:last-child{margin-left:auto}
a{color:var(--red)}
a:hover{text-decoration:underline}
.brand img{width:190px}
.search{display:flex;flex:1;min-width:min(100%,260px)}
.search input,.search button{font:inherit;border:1px solid #aaa;padding:.6rem .9rem}
.search input{flex:1;min-width:0;border-radius:4px 0 0 4px}
.search button{background:var(--red);color:#fff;border-color:var(--red);font-weight:700;border-radius:0 4px 4px 0;cursor:pointer}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.hero{border-radius:0;margin:0 calc((100% - 100vw)/2) 3rem;padding:clamp(2.5rem,7vw,6rem) max(4vw,calc((100vw - 1120px)/2));background:#f7eeee;color:var(--ink);background-image:linear-gradient(112deg,#faf4f4 56%,#f0d7db 56%,#f0d7db 78%,#e8bcc4 78%);border-bottom:5px solid var(--red)}
.hero h1,.hero .eyebrow{color:var(--deep-red)}
.button{background:var(--red);color:white;border-radius:3px}
.button:hover,.search button:hover{background:var(--deep-red)}
.category-strip{display:flex;gap:.5rem;flex-wrap:wrap;padding:.7rem 0 1rem}
.category-strip a{padding:.45rem .7rem;background:#f8f1f2;border:1px solid #e9d3d7;border-radius:3px;text-decoration:none;font-weight:650}
.category-strip a:hover{background:#f2dfe2}
.grid{align-items:start;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.card,article{border-radius:3px;border-color:var(--line)}
.card{border-top:3px solid var(--red);scroll-margin-top:1rem}
.card:has(details[open]){grid-column:1/-1}
.card h3{color:var(--deep-red)}
details{border-color:var(--line)}
#search-status:empty{display:none}
footer{background:#f6f4f4;border-top:1px solid var(--line)}

body{overflow-x:clip}

:is(#company, #warranty, #contact) :is(article, table, th, td) {
  border: 0;
}

.product-photos {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-block: 1rem;
}

.product-photos img {
  display: block;
  width: auto;
  height: auto;
  max-width: min(100%, 22rem);
  max-height: 18rem;
  object-fit: contain;
}

.card:has(details[open]),
details[id^="product-"],
details[id^="product-"] :is(table, th, td) {
  border-color: transparent;
}

.product-sizes :is(td, th) {
  vertical-align: top;
}

.product-sizes td {
  font-size: .875rem;
}

.product-sizes :is(h4, td > b, td > strong, td p > b, td p > strong) {
  font-size: 1rem;
}