.collection-page{color:#111;font:16px/1.55 Helvetica,Arial,sans-serif}.collection-page *{box-sizing:border-box}.collection-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.collection-wrap{display:grid;grid-template-columns:240px 1fr;gap:35px;margin:55px 3%}.collection-wrap aside h2,#collection-filter-close{display:none}.collection-wrap aside details{border-bottom:1px solid #eee;padding:20px 0}.collection-wrap aside summary{font-size:12px;letter-spacing:.2em;cursor:pointer}.collection-wrap aside label{display:block;font-size:13px;padding:7px 0}.collection-wrap input[type=number]{width:90px;padding:8px;border:1px solid #ddd}.collection-toolbar{display:flex;gap:15px;align-items:center;margin-bottom:16px}.collection-toolbar button,.collection-toolbar select,#collection-clear,#collection-filter-close{background:white;border:1px solid #ddd;padding:10px;color:#222;cursor:pointer}.collection-toolbar #collection-count{margin:auto;font-size:13px}.collection-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:35px 20px}.collection-card{position:relative}.collection-card a{color:inherit;text-decoration:none}.collection-card .collection-image{position:relative;aspect-ratio:1}.collection-card .collection-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .3s}.collection-card .collection-image img+img{opacity:0}.collection-card:hover .collection-image img+img{opacity:1}.collection-card h3{font-size:16px;line-height:1.05;margin:5px 0 0}.collection-card p{margin:5px 0;font-size:13px}.collection-stars{color:#e9a529}.collection-stars small{color:#333;font-size:11px}.collection-quick{position:absolute;top:8px;right:8px;opacity:0;background:white;border:0;padding:8px;cursor:pointer}.collection-card:hover .collection-quick,.collection-quick:focus{opacity:1}.collection-banner{height:450px;background:url('/assets/zelox/hero-roadside-campaign-v1.png') center/cover;display:grid;place-items:center;text-align:center;color:white}.collection-banner h2{font-size:50px;line-height:1;margin:0}.collection-banner p{font-size:18px}@media(max-width:768px){.collection-wrap{display:block;margin:20px 15px}.collection-wrap aside{display:none;position:fixed;inset:0 20% 0 0;z-index:99;background:white;padding:20px;overflow:auto;box-shadow:0 0 0 100vw #0008}.collection-wrap aside.open{display:block}.collection-wrap aside h2,#collection-filter-close{display:block}.collection-toolbar #collection-count{display:none}.collection-toolbar button,.collection-toolbar select{flex:1}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 15px}.collection-card h3{font-size:16px}.collection-banner{height:300px}.collection-banner h2{font-size:28px}.collection-banner p{font-size:15px}.collection-quick{opacity:1}}
@media(min-width:769px){.collection-wrap.filter-closed{grid-template-columns:1fr}.collection-wrap.filter-closed aside{display:none}}
@media(max-width:768px){.collection-card .collection-quick{opacity:0}.collection-card .collection-quick:focus-visible{opacity:1}}
.collection-card .collection-quick{top:auto;bottom:65px;left:8px;right:8px;background:#f18f01;color:#fff;text-align:center;padding:9px}@media(hover:none){.collection-card .collection-quick{display:none}}
@media(max-width:768px){
 .collection-card h3{font-family:Helvetica,Arial,sans-serif;font-size:18px;line-height:18px;font-weight:700;letter-spacing:.45px;margin:10px 0 0}
 .collection-card p{font-size:13.6px;line-height:20.4px;margin:5px 0 6px}
}
@media(max-width:768px){
 .collection-banner{height:auto;aspect-ratio:50/39;background-position:50% 50%}
 .collection-banner>div{width:calc(100% - 34px)}
 .collection-banner h2{font-size:28px;line-height:28px;letter-spacing:.7px;font-weight:700}
 .collection-banner p{font-size:19.136px;line-height:30.6176px;font-weight:400}
}
@media(max-width:768px){
 .collection-wrap{margin-left:17px;margin-right:17px}
 .collection-grid{column-gap:17px;row-gap:15px}
 .collection-stars{font-size:16px;line-height:22.4px;letter-spacing:1px;margin:3px 0 2px}
 .collection-stars small{font-size:12px;line-height:16.8px;letter-spacing:0}
}
@media(max-width:768px){.collection-wrap{margin-top:25.34px}}
@media(max-width:768px){.collection-banner p{letter-spacing:.368px}}
.collection-toolbar #collection-filter-toggle{font-size:0}
.collection-toolbar #collection-filter-toggle::before{content:"";display:inline-block;width:15px;height:15px;vertical-align:middle;margin-right:8px;background:radial-gradient(circle at 4px 4px,#222 0 1.6px,transparent 1.8px),radial-gradient(circle at 10px 11px,#222 0 1.6px,transparent 1.8px),linear-gradient(#222,#222) center 4px/14px 1px no-repeat,linear-gradient(#222,#222) center 11px/14px 1px no-repeat}
.collection-toolbar #collection-filter-toggle::after{content:"Filter";font:14px Helvetica,Arial,sans-serif;vertical-align:middle}
.collection-toolbar #collection-filter-toggle::before{width:20px;height:20px;margin-right:10px;background:radial-gradient(circle at 6px 6px,#222 0 1.8px,transparent 2px),radial-gradient(circle at 14px 14px,#222 0 1.8px,transparent 2px),linear-gradient(#222,#222) center 6px/18px 1px no-repeat,linear-gradient(#222,#222) center 14px/18px 1px no-repeat}
.collection-toolbar #collection-filter-toggle::after{font-size:16px;line-height:22.72px}
/* Match the established collection page's filters, card typography, and grid. */
#collection-filter summary{position:relative;display:block;list-style:none;font-size:12.8px;line-height:20.48px;letter-spacing:3.84px;padding:15px 10px 15px 0;text-transform:uppercase}#collection-filter summary::-webkit-details-marker{display:none}#collection-filter summary:after{content:'';position:absolute;right:2px;top:18px;width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}#collection-filter details[open]>summary:after{transform:rotate(225deg);top:23px}#collection-filter details{padding:0}#collection-clear{display:none}#collection-clear[data-active=true]{display:block}.collection-card h3{font-size:18px;line-height:18px;font-weight:700;letter-spacing:.45px;margin:10px 0 0}.collection-card p{font-size:13.6px;line-height:20.4px;letter-spacing:.4px;margin:5px 0 0}.collection-stars{font-size:16px;line-height:22.4px;letter-spacing:1px;color:#f4a51c;margin:3px 0 2px}.collection-stars small{font-size:12px;line-height:16.8px;letter-spacing:.4px}.collection-toolbar{height:59px;margin-bottom:0}
@media(min-width:769px){.collection-wrap{grid-template-columns:calc((100% + 22px)/5 - 32px) 1fr;gap:32px;margin:45px 40px 55px}.collection-grid{column-gap:22px}}
@media(max-width:768px){.collection-wrap{margin-top:22.5px}.collection-wrap aside summary{font-size:11.776px;line-height:18.8416px;letter-spacing:3.5328px}.collection-toolbar{height:59px;margin-bottom:0}.collection-card p{letter-spacing:.368px}}
.collection-card{padding-bottom:6px}@media(min-width:769px){.collection-grid{row-gap:30px}}@media(max-width:768px){#collection-filter summary{font-size:11.776px;line-height:18.8416px;letter-spacing:3.5328px}}
@media(min-width:769px){.collection-wrap{margin-bottom:30px}}
@media(max-width:768px){
 .collection-wrap{margin-bottom:15px}
 .collection-toolbar{align-items:flex-start}
 .collection-toolbar #collection-filter-toggle,.collection-toolbar select{height:44px;min-width:0;flex:1 1 0}
 .collection-toolbar #collection-filter-toggle{padding:0 20px}
 .collection-toolbar select{font:16px/25.6px Helvetica,Arial,sans-serif;padding:8px 28px 8px 10px}
 .collection-banner p{margin:5px 0}
}
.collection-price-fields{display:flex;gap:2px;margin-bottom:15px}
.collection-price-fields input[type=number]{width:calc((100% - 2px)/2);min-width:0}
.collection-price-pending{font-size:12px;line-height:1.6;margin:10px 0 15px}
@media(min-width:769px){
 #collection-filter details[open]{padding-bottom:20px}
 #collection-filter label{font:16px/22.4px Helvetica,Arial,sans-serif;letter-spacing:.4px;padding:0;margin:0 0 10px}
 #collection-filter input[type=checkbox]{width:16px;height:16px;vertical-align:middle;margin:0 8px 0 0}
 .collection-toolbar{display:grid;grid-template-columns:193.375px minmax(0,1fr) 193.375px;grid-template-rows:44px;gap:0;align-items:center}
 .collection-toolbar #collection-filter-toggle{width:111px;height:44px;padding:0 20px}
 .collection-toolbar #collection-sort{width:100%;height:44px;padding:8px 28px 8px 10px;font:16px/25.6px Helvetica,Arial,sans-serif;letter-spacing:.4px}
 .collection-toolbar #collection-count{justify-self:center;margin:0;font:16px/25.6px Helvetica,Arial,sans-serif;letter-spacing:.4px}
 .collection-banner h2{font-size:56px;line-height:56px;letter-spacing:1.4px;font-weight:700}
 .collection-banner p{font-size:20.8px;line-height:33.28px;letter-spacing:.4px;margin:5px 0}
}
@media(max-width:768px){
 html:has(#collection-filter.open){overflow:hidden}
 .collection-wrap aside#collection-filter{inset:0 auto 0 0;width:min(350px,100vw);padding:0 20px}
 #collection-filter h2{height:70px;display:flex;align-items:center;margin:0;border-bottom:1px solid #e8e8e1;font:700 27.74px/1 Helvetica,Arial,sans-serif;letter-spacing:.6935px}
 #collection-filter-close{position:absolute;right:0;top:0;width:68px;height:70px;padding:0;border:0;background:none;color:#000;font-size:0}
 #collection-filter-close::after{content:'×';font:400 28px/1 Helvetica,Arial,sans-serif}
 #collection-filter details:first-of-type{margin-top:20px}
 #collection-filter details{padding:0 0 5px;margin:0 0 5px}
 #collection-filter details:last-of-type{border-bottom:0}
 #collection-filter label{font:14.72px/20.608px Helvetica,Arial,sans-serif;letter-spacing:.368px;padding:0;margin:0 0 10px}
 #collection-filter input[type=checkbox]{width:16px;height:16px;vertical-align:middle;margin:0 8px 0 0}
}

/* Keep the preview control inside the image's visual bounds regardless of title length. */
.collection-card { container-type:inline-size; }
.collection-card .collection-quick {
 top:calc(100cqi - 10px); bottom:auto; left:10px; right:10px;
 border:0; background:#f18f01; color:#fff; padding:8px 5px;
 font:13.6px/21.76px Helvetica,Arial,sans-serif; letter-spacing:normal;
 text-align:center; opacity:0; transform:translateY(calc(-100% + 5px));
 transition:opacity .25s ease, transform .25s ease-out, background-color .4s ease;
}
.collection-card:hover .collection-quick,
.collection-card:focus-within .collection-quick { opacity:1; transform:translateY(-100%); }
.collection-card .collection-image img+img { transition:opacity .2s cubic-bezier(.26,.54,.32,1); }
.collection-card:hover .collection-image img+img { opacity:0; }
.collection-card .collection-image:hover img+img,
.collection-card:has(.collection-quick:hover) .collection-image img+img,
.collection-card:focus-within .collection-image img+img { opacity:1; }
@media(max-width:768px), (hover:none) {
 .collection-card .collection-quick { display:none; }
 .collection-card .collection-image img+img { display:none; }
}
@media(prefers-reduced-motion:reduce) {
 .collection-card .collection-quick,
 .collection-card .collection-image img+img { transition:none; }
}