.coverall-page { background: #fff; color: #1d293e; padding: 2.2rem 0 3rem; }
.coverall-shell { margin: 0 auto; max-width: 1240px; padding: 0 2rem; }
.coverall-breadcrumb { margin-bottom: 1.7rem; }
.coverall-breadcrumb ol { display: flex; flex-wrap: wrap; gap: .55rem; list-style: none; margin: 0; padding: 0; }
.coverall-breadcrumb li { color: #687586; font-size: .85rem; line-height: 1.65; }
.coverall-breadcrumb li + li:not(.visually-hidden)::before { content: "/"; margin-right: .55rem; color: #a0a7b1; }
.coverall-breadcrumb a { color: inherit; text-decoration: none; }
.coverall-breadcrumb a:hover { color: #ce1838; }
.coverall-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: start; gap: clamp(2rem, 5vw, 4.4rem); }
.coverall-gallery, .coverall-summary { min-width: 0; }
.coverall-main-image { background: #f7f8fa; border: 0; border-radius: 3px; cursor: zoom-in; display: block; overflow: hidden; padding: 0; position: relative; width: 100%; }
.coverall-main-image > img { display: block; height: 690px; max-height: 75vw; object-fit: contain; width: 100%; }
.coverall-zoom-label { align-items: center; background: rgba(255,255,255,.96); border: 1px solid #e3e6eb; border-radius: 3px; bottom: .8rem; color: #5a6575; display: inline-flex; font-size: .75rem; gap: .45rem; padding: .5rem .65rem; position: absolute; right: .8rem; }
.coverall-image-empty { align-items: center; background: #f7f8fa; color: #687586; display: flex; justify-content: center; min-height: 500px; }
.coverall-carousel { --carousel-visible: 4; --carousel-gap: .65rem; align-items: center; display: grid; grid-template-columns: minmax(0,1fr); min-width: 0; }
.coverall-carousel.is-overflowing { column-gap: .4rem; grid-template-columns: 2.1rem minmax(0,1fr) 2.1rem; }
.coverall-carousel [data-carousel-track] { display: flex; flex-wrap: nowrap; gap: var(--carousel-gap); min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; padding: 4px; scroll-padding-inline: 4px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.coverall-carousel [data-carousel-track]::-webkit-scrollbar { display: none; }
.coverall-carousel [data-carousel-item] { box-sizing: border-box; flex: 0 0 calc((100% - (var(--carousel-visible) - 1) * var(--carousel-gap)) / var(--carousel-visible)); min-width: 0; scroll-snap-align: start; scroll-snap-stop: normal; }
.coverall-carousel [data-carousel-item]:focus-visible, .coverall-carousel [data-carousel-item]:has(input:focus-visible) { outline: 3px solid #487fc3; outline-offset: -3px; }
.coverall-carousel-arrow { align-items: center; align-self: center; background: #fff; border: 1px solid #dce1e8; border-radius: 50%; color: #354156; display: inline-flex; height: 2.1rem; justify-content: center; padding: 0; width: 2.1rem; }
.coverall-carousel-arrow[hidden] { display: none !important; }
.coverall-carousel-arrow:hover:not(:disabled) { border-color: #c81c38; color: #c81c38; }
.coverall-carousel-arrow:disabled { color: #b0b8c4; cursor: default; opacity: .5; }
.coverall-thumbnails-carousel { margin-top: 1rem; }
.coverall-thumbnail { background: white; border: 1px solid #dde2e8; border-radius: 3px; padding: .25rem; }
.coverall-thumbnail img { display: block; height: 98px; object-fit: contain; width: 100%; }
.coverall-thumbnail.is-active { border-color: #d82040; box-shadow: 0 0 0 1px #d82040; }
.coverall-summary { padding-top: 1.1rem; }
.coverall-category { color: #c81c38; font-size: .8rem; font-weight: 700; letter-spacing: .06em; margin: 0 0 1rem; text-transform: uppercase; }
.coverall-summary h1 { color: #18243c; font-size: clamp(2rem, 3.2vw, 2.75rem); font-weight: 700; letter-spacing: -.035em; line-height: 1.17; margin: 0 0 .9rem; overflow-wrap: break-word; }
.coverall-item-ref { color: #687586; font-size: .81rem; margin: 0 0 1.8rem; }
.coverall-colors { border: 0; border-top: 1px solid #e1e5eb; margin: 0 0 1.8rem; min-width: 0; padding: 1.35rem 0 0; }
.coverall-field-label { color: #2e384a; float: none; font-size: .9rem; font-weight: 600; margin: 0 0 .85rem; padding: 0; width: auto; }
.coverall-color-option { align-items: center; background: white; border: 1px solid #dce1e8; border-radius: 4px; color: #364254; cursor: pointer; display: inline-flex; flex-direction: column; font-size: .86rem; gap: .5rem; justify-content: center; line-height: 1.4; margin: 0; min-height: 74px; padding: .65rem .35rem; position: relative; text-align: center; text-decoration: none; }
.coverall-color-option > span:not(.coverall-color-swatch) { max-width: 100%; min-width: 0; overflow-wrap: anywhere; }
.coverall-color-option input { height: 1px; opacity: 0; position: absolute; width: 1px; }
.coverall-color-option:has(input:checked), .coverall-color-option.is-active { border-color: #d82040; box-shadow: 0 0 0 1px #d82040; color: #19263a; }
.coverall-color-option:has(input:focus-visible), .coverall-color-option:focus-visible { outline: 3px solid #487fc3; outline-offset: 3px; }
.coverall-color-option:hover { border-color: #78869a; color: #18243c; }
.coverall-color-swatch { background: #edf0f3; border: 1px solid rgba(25,38,58,.18); border-radius: 3px; display: inline-block; flex: 0 0 auto; height: 1.1rem; width: 1.1rem; }
.coverall-color-swatch.color-white { background: #fff; }
.coverall-color-swatch.color-blue { background: #187ccb; }
.coverall-color-swatch.color-green { background: #71c6b5; }
.coverall-color-swatch.color-dark-blue, .coverall-color-swatch.color-navy, .coverall-color-swatch.color-navy-blue { background: #173d67; }
.coverall-color-swatch.color-black { background: #24282f; }
.coverall-color-swatch.color-orange { background: #f98e28; }
.coverall-color-swatch.color-white-with-orange-tape { background: linear-gradient(135deg,#fff 0 44%,#f98e28 44% 56%,#fff 56%); }
.coverall-color-swatch.color-yellow { background: #f4d451; }
.coverall-color-swatch.color-red { background: #d73540; }
.coverall-color-swatch.color-gray, .coverall-color-swatch.color-grey { background: #939ca6; }
.coverall-color-swatch.color-camouflage, .coverall-color-swatch.color-camo { background: linear-gradient(135deg,#52634a 0 33%,#a9987c 33% 66%,#645943 66%); }
.coverall-color-help { color: #687586; font-size: .78rem; line-height: 1.6; margin: .8rem 0 0; }
.coverall-pricing { border-top: 1px solid #e1e5eb; margin-top: 1.4rem; padding-top: 1.5rem; }
.coverall-pricing h2 { font-size: .91rem; font-weight: 500; margin: 0 0 .65rem; }
.coverall-price { color: #18243c; font-size: clamp(2.3rem, 3.3vw, 2.8rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.2; margin: 0 0 .4rem; }
.coverall-currency { font-size: .47em; font-weight: 600; letter-spacing: 0; vertical-align: .14em; }
.coverall-price-unit { font-size: .48em; font-weight: 400; letter-spacing: 0; }
.coverall-price-spec { color: #354156; font-size: 1rem; font-weight: 500; margin: 0 0 .7rem; }
.coverall-price-basis { color: #48566a; font-size: .85rem; line-height: 1.6; margin: 0 0 .35rem; }
.coverall-price-disclaimer { color: #687586; font-size: .8rem; line-height: 1.6; margin: 0; max-width: 420px; }
.coverall-contact { margin-top: 1.6rem; }
.coverall-quote-button { align-items: center; background: #d91c3d; border: 1px solid #d91c3d; border-radius: 3px; color: white; display: inline-flex; font-size: 1rem; font-weight: 600; gap: .65rem; justify-content: center; min-height: 52px; padding: .8rem 1.45rem; text-decoration: none; transition: background 150ms; }
.coverall-quote-button:hover { background: #bb1231; border-color: #bb1231; color: white; }
.coverall-quote-button i { font-size: 1.16rem; }
.coverall-contact-email { color: #354156; display: block; font-size: .92rem; margin-top: 1rem; overflow-wrap: anywhere; text-decoration: none; }
.coverall-contact-email:hover { color: #c81c38; text-decoration: underline; }
.coverall-volume-message { color: #354156; font-size: .95rem; line-height: 1.65; margin: 1.35rem 0 0; }
.coverall-page h2 { color: #18243c; }
.coverall-specifications, .coverall-ordering, .coverall-customer-notes, .coverall-related { margin-top: 3.4rem; }
.coverall-specifications > h2, .coverall-ordering > h2, .coverall-customer-notes > h2, .coverall-related > h2 { font-size: 1.25rem; font-weight: 650; letter-spacing: -.015em; margin: 0 0 1.15rem; }
.coverall-specs-table { border: 1px solid #e0e4ea; border-collapse: collapse; color: #364254; font-size: .94rem; line-height: 1.6; table-layout: fixed; width: 100%; }
.coverall-specs-table th, .coverall-specs-table td { border: 1px solid #e0e4ea; overflow-wrap: anywhere; padding: .95rem 1.35rem; text-align: left; vertical-align: top; }
.coverall-specs-table th { background: #f5f6f8; color: #253146; font-size: .88rem; font-weight: 600; width: 32%; }
.coverall-ordering-grid { display: grid; gap: 2rem; grid-template-columns: repeat(2,minmax(0,1fr)); margin: 0; }
.coverall-ordering-grid > div + div { border-left: 1px solid #e1e5eb; padding-left: 2rem; }
.coverall-ordering-grid dt { font-size: .9rem; font-weight: 600; margin-bottom: .5rem; }
.coverall-ordering-grid dd, .coverall-customer-notes p { color: #536174; font-size: .94rem; line-height: 1.65; margin: 0; }
.coverall-related { border-top: 1px solid #e1e5eb; padding-top: 2.5rem; }
.coverall-related-grid { display: grid; gap: 1.1rem; grid-template-columns: repeat(4,minmax(0,1fr)); }
.coverall-related-card { border: 1px solid #e1e5eb; border-radius: 4px; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.coverall-related-image { background: #fafbfc; display: block; padding: .8rem; }
.coverall-related-image img { height: 235px; object-fit: contain; width: 100%; }
.coverall-related-body { display: flex; flex: 1; flex-direction: column; padding: 1.1rem; }
.coverall-related-body h3 { font-size: .96rem; font-weight: 600; line-height: 1.45; margin: 0; }
.coverall-related-body h3 a { color: #253146; text-decoration: none; }
.coverall-related-link { color: #c81c38; font-size: .84rem; font-weight: 600; margin-top: auto; padding-top: .8rem; text-decoration: none; }
.coverall-lightbox { background: #fff; border: 0; border-radius: 4px; height: min(900px,94vh); max-height: 94vh; max-width: 94vw; overflow: hidden; padding: 1rem; width: min(1000px,94vw); }
.coverall-lightbox::backdrop { background: rgba(12,20,35,.86); }
.coverall-lightbox > img { height: 100%; object-fit: contain; width: 100%; }
.coverall-lightbox-close, .coverall-lightbox-prev, .coverall-lightbox-next { align-items: center; background: #fff; border: 1px solid #dce1e8; border-radius: 50%; color: #243147; display: flex; height: 44px; justify-content: center; position: absolute; width: 44px; }
.coverall-lightbox-close { right: 1rem; top: 1rem; }
.coverall-lightbox-prev { left: 1rem; top: calc(50% - 22px); }
.coverall-lightbox-next { right: 1rem; top: calc(50% - 22px); }
.coverall-page button:focus-visible, .coverall-page a:focus-visible { outline: 3px solid #487fc3; outline-offset: 3px; }
@media (max-width: 1050px) {
    .coverall-shell { padding: 0 1.5rem; }
    .coverall-hero { gap: 2rem; }
    .coverall-main-image > img { height: 640px; }
    .coverall-summary h1 { font-size: 2.15rem; }
    .coverall-related-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
    .coverall-carousel { --carousel-visible: 3; }
    .coverall-page { padding-top: 1.4rem; }
    .coverall-shell { padding: 0 1.1rem; }
    .coverall-breadcrumb { margin-bottom: 1.2rem; }
    .coverall-hero { gap: 1.5rem; grid-template-columns: 1fr; }
    .coverall-main-image > img { height: min(128vw,620px); max-height: none; }
    .coverall-summary { padding-top: 0; }
    .coverall-summary h1 { font-size: clamp(1.85rem,7vw,2.5rem); }
    .coverall-item-ref { margin-bottom: 1.4rem; }
    .coverall-quote-button { width: 100%; }
    .coverall-specifications, .coverall-ordering, .coverall-customer-notes { margin-top: 2.6rem; }
    .coverall-specs-table th, .coverall-specs-table td { padding: .8rem .85rem; }
    .coverall-specs-table th { width: 38%; }
    .coverall-ordering-grid { gap: 1.3rem; grid-template-columns: 1fr; }
    .coverall-ordering-grid > div + div { border-left: 0; border-top: 1px solid #e1e5eb; padding: 1.3rem 0 0; }
    .coverall-related-grid { gap: .8rem; }
    .coverall-related-image img { height: 190px; }
    .coverall-related-body { padding: .85rem; }
}
@media (max-width: 370px) { .coverall-related-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .coverall-quote-button { transition: none; } }