/* Allow grid and flex children to shrink to their available viewport space. */
.related-links{list-style:none;margin:22px 0;padding:0;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:flex-start}
.related-links li{min-width:0;max-width:100%;margin:0;padding:0}
.related-links a{display:inline-block;line-height:1.6;text-decoration:underline;text-underline-offset:3px}
.topbar .wrap{align-items:center;gap:8px 20px}
.topbar a{display:inline-flex;align-items:center;gap:12px;flex-shrink:0;white-space:nowrap}
.phone-number,a[href^="tel:"]{white-space:nowrap;overflow-wrap:normal}
.choice label{align-items:flex-start}
.choice input[type=radio]{margin-top:5px}
.package-fields label,.fields label{min-width:0}
#package-inputs fieldset label:has(input[type=radio]){display:inline-flex;align-items:flex-start;gap:8px}
#package-inputs input[type=radio]{margin:5px 0 0;flex:0 0 auto}
.reseller-options label:has(input[type=checkbox]){align-items:flex-start}
.catalog-layout{grid-template-columns:230px minmax(0,1fr)}
.catalog-layout>*,.product-detail>*,.product-information>*,.quote-grid>*,.lead-layout>*,.fields>*,.package-product>*,.request-path-grid>*{min-width:0}
.catalog-controls>*{min-width:0}
.products article,.guide-grid article,.benefit-grid article,.package-card,.footer>div{min-width:0}
main,footer{overflow-wrap:anywhere}
img{max-width:100%}
input,select,textarea{max-width:100%}
input[type=checkbox],input[type=radio]{width:auto;flex-shrink:0}
.button{max-width:100%;white-space:normal;text-align:center;gap:8px}
.product-add{gap:10px}.product-add span{flex-shrink:0}
.selected-header{flex-wrap:wrap;gap:8px}
.selection-row{grid-template-columns:minmax(0,1fr) 86px 28px}
.category-links{min-width:0}
#lead-product-view img{width:100px;height:100px;flex:0 0 100px}
#lead-product-view>*{min-width:0}
#image-dialog{max-height:90dvh}

/* Use the compact navigation before the full menu runs out of space. */
@media(max-width:1200px){
 .menu{display:block;border:1px solid var(--line);background:white;padding:10px 16px;min-height:44px;font-size:16px}
 .nav nav{display:none;position:absolute;top:92px;left:0;right:0;background:white;padding:20px 24px;box-shadow:0 10px 15px #0001;flex-direction:column;align-items:stretch;gap:8px;font-size:16px;max-height:calc(100dvh - 110px);overflow-y:auto}
 .nav nav.open{display:flex}
 .nav nav>a{padding:10px 12px;min-height:44px}
}
@media(min-width:761px) and (max-width:1050px){
 .catalog-layout{grid-template-columns:180px minmax(0,1fr);gap:20px}
 .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .product-detail,.product-information,.quote-grid,.faq{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
 .gallery-main{height:360px;padding:20px}
 .product-intro h1{font-size:clamp(28px,3.6vw,38px)}
 .guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .quote-grid form{padding:22px}
 .fields{grid-template-columns:1fr}
}
@media(max-width:760px){
 .related-links{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin:20px 0}
 .related-links a{padding:4px 0}
 .topbar .wrap{flex-direction:column;align-items:flex-start;gap:5px;font-size:11px;line-height:1.5}
 .topbar a{font-size:13px;gap:10px;line-height:1.5}
 .benefits{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
 .benefits span{padding:0;min-width:0;line-height:1.5}
 .selected-header{align-items:flex-start}
 .wrap{width:calc(100% - 32px)}
 .nav nav{top:75px;padding:16px;max-height:calc(100dvh - 90px)}
 .topbar .wrap{flex-wrap:wrap;gap:4px 12px}
 .catalog-layout{grid-template-columns:minmax(0,1fr)}
 .catalog-layout>aside{min-width:0}
 .category-links{width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
 .category-links a{flex:0 0 auto;min-height:44px;display:flex;align-items:center}
 .catalog-controls{flex-wrap:wrap}
 .catalog-controls label{flex:1 1 180px}
 .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .catalog-card h3{font-size:18px;line-height:1.4}
 .catalog-grid .product-body{padding:16px}
 .catalog-image{height:200px;padding:18px}
 .fields{grid-template-columns:1fr}
 .selection-row{grid-template-columns:minmax(0,1fr) 75px 28px}
 .product-detail,.product-information,.quote-grid,.faq{grid-template-columns:minmax(0,1fr)}
 .gallery-main{height:clamp(280px,65vw,390px);padding:20px}
 .product-intro h1,.lead-layout h1{font-size:clamp(28px,7vw,37px);letter-spacing:-.8px}
 .price-panel{padding:16px}
 .price-panel th,.price-panel td{padding:9px 6px;font-size:14px}
 .product-information dl>div{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
 .product-request{padding:20px}
 .guide-grid,.package-results{grid-template-columns:minmax(0,1fr)}
 input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px;min-height:44px}
 input[type=file]{padding:10px 8px}
 .product-add,.detail-link{font-size:14px;min-height:44px}
 #quote-dock{gap:10px;padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
 #quote-dock .button{flex:1;min-width:0;font-size:14px;padding:12px 10px}
 #quote-dock>a:last-child{flex:0 0 auto;font-size:14px;padding:8px 0}
 body{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
 #image-dialog{padding:16px}
 .toast{bottom:calc(110px + env(safe-area-inset-bottom))}
}
@media(max-width:600px){
 .catalog-grid,.products,.package-fields,.benefit-grid,.request-path-grid{grid-template-columns:minmax(0,1fr)}
 .catalog-controls{flex-direction:column}
 .catalog-controls label{flex:auto;width:100%}
 .catalog-image{height:clamp(220px,65vw,300px)}
 .product-body p{min-height:0}
 .section-heading,.audience-grid,.steps,.footer{min-width:0}
 .steps{grid-template-columns:minmax(0,1fr)}
 .hero h1{font-size:clamp(32px,9vw,48px)}
 .contact a{font-size:clamp(20px,6vw,23px)}
 .quote-grid form,.lead-layout form{padding:18px}
 .footer{grid-template-columns:minmax(0,1fr)}
 .footer>div:first-child{grid-column:auto}
 #lead-product-view{gap:12px;align-items:flex-start}
 #lead-product-view img{width:72px;height:72px;flex-basis:72px}
 .product-request .button{font-size:14px}
}