/* Shared mobile layout, loaded after page-specific styles. */
@media(max-width:820px){
 html,body{max-width:100%;overflow-x:clip}
 img,video,canvas{max-width:100%}
 input,select,textarea{font-size:16px!important;max-width:100%;min-height:44px}
 button,.btn{min-height:44px}
 .header,.portal-top{position:relative!important;top:auto!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;padding:12px 16px!important;gap:12px!important;min-height:0!important}
 .portal-brand{width:205px!important;height:52px!important;flex:0 0 52px!important}
 .header .brand img{width:auto!important;height:48px!important;max-width:210px!important}
 .header .search-wrap,.header .search-container,.header .smart-search-wrap,.header .search{width:100%!important;max-width:none!important;min-width:0!important}
 .header .nav,.header nav,.portal-nav{display:flex!important;flex-wrap:wrap!important;gap:6px!important;width:100%!important;font-size:13px!important}
 .portal-nav a,.header nav a{padding:10px!important;min-height:44px;display:inline-flex;align-items:center}
 .wrap,.product-shell{padding:22px 16px 100px!important}
 .section,.buy-again,.onboarding,.why,.quote,.footer{padding-left:16px!important;padding-right:16px!important}
 .hero--premium{grid-template-columns:1fr!important;min-height:0!important}
 .hero--premium .hero-copy{padding:32px 16px!important}
 .hero-stage{min-height:280px!important;height:auto!important}
 .cc-scroll-sequence{height:calc(65svh + min(100svh, calc(62vw + 220px)))!important;min-height:0!important}
 .cc-scroll-sticky{position:sticky!important;top:0!important;height:min(100svh,calc(62vw + 220px))!important;box-sizing:border-box;min-height:0!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;gap:10px!important;padding:20px 16px!important}
 .cc-scroll-copy{max-width:100%;align-self:center}
 .cc-scroll-copy h2{font-size:clamp(28px,7vw,40px)!important;line-height:1.08!important;margin-bottom:12px!important}
 .cc-scroll-copy p{font-size:16px!important}
 .cc-scroll-stage{width:100%!important;height:min(48svh,62vw)!important;aspect-ratio:16/10;min-height:0!important;flex:none!important}
 .cc-scroll-hint{display:none!important}
 .cc-scroll-copy p{display:block!important}
 .account-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
 .account-product-card{min-width:0!important;padding:14px!important}
 .account-product-card h4{font-size:16px!important;overflow-wrap:anywhere}
 .account-product-card p{font-size:14px!important}
 .account-product-card input{width:100%;min-height:44px;border:1px solid #cbd8e5;border-radius:4px;padding:10px}
 .account-product-card .actions{display:grid!important;grid-template-columns:1fr}
 .account-product-art{height:145px!important;min-height:0!important}
 .account-categories{display:flex!important;flex-wrap:wrap!important;gap:8px}
 .account-order-bar{left:8px!important;right:8px!important;width:calc(100% - 16px)!important;max-width:none!important;bottom:8px!important;padding:10px!important;gap:8px!important}
 .account-order-bar .btn{white-space:normal;text-align:center}
 .quick-add-grid,.line-builder,.po-grid,.frow{grid-template-columns:1fr!important}
 .quick-description,.span-all{grid-column:auto!important}
 .quick-card,.card{padding:18px!important;min-width:0}
 .section-head,.portal-hero{flex-wrap:wrap;gap:12px}
 .table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
 .table{min-width:540px}
 .quick-items{min-width:0}
 .quick-search-results{max-height:45svh}
 #recentPurchases .quick-result{padding:14px 8px}
 #recentPurchases .quick-result b{font-size:15px}
 #recentPurchases .quick-result span{font-size:13px;line-height:1.5}
 .checkout-footer{bottom:max(8px,env(safe-area-inset-bottom))!important}
 .portal-footer,.footer .fgrid,.footer .fbottom{display:flex;flex-direction:column;gap:20px}
}
@media(max-width:540px){
 .account-product-grid,.grid6,.family-grid,.product-grid,.category-grid,.recent-products{grid-template-columns:1fr!important}
 .account-product-art{height:190px!important}
 .hero-points,.asset-grid,.report-metrics{grid-template-columns:1fr!important}
 .account-order-bar{display:flex!important;flex-direction:column;align-items:stretch;transform:none!important}
 .account-order-bar .btn{width:100%}
 .checkout-footer-copy{display:none}
 .checkout-footer{grid-template-columns:1fr 1fr!important}
}
@media(max-width:820px) and (prefers-reduced-motion:reduce){.cc-scroll-sequence{height:auto!important}.cc-scroll-sticky{position:relative!important;height:auto!important}.cc-scroll-copy p{display:none!important}}
@media(max-width:820px){
 body.cc-home{font-size:16px;line-height:1.6}
 .cc-home .topbar{padding:8px 16px;gap:8px;flex-wrap:wrap;font-size:12px}
 .cc-home .topbar .grp{gap:12px;flex-wrap:wrap}
 .cc-home .header .nav{display:flex!important;gap:4px!important}
 .cc-home .header .nav a{font-size:13px;line-height:1.3;padding:10px 8px!important;letter-spacing:0}
 .cc-home .smart-search-wrap{min-width:0!important;width:100%!important}
 .cc-home .header input{width:100%;font-size:16px!important}
 .cc-home .hero--premium .hero-copy{padding:28px 20px!important}
 .cc-home .hero h1{font-size:clamp(30px,7.8vw,42px)!important;line-height:1.12;letter-spacing:-.6px}
 .cc-home .hero p,.cc-home .buy-again p,.cc-home .onboarding-inner p{font-size:16px;line-height:1.65}
 .cc-home .hero-kicker{font-size:11px;letter-spacing:.02em;margin-bottom:12px}
 .cc-home .hero-points{display:grid;grid-template-columns:1fr!important;gap:12px}
 .cc-home .hero-points p,.cc-home .hero-points span{font-size:15px;line-height:1.55}
 .cc-home .hero .actions,.cc-home .hero .hero-actions{display:flex;flex-wrap:wrap;gap:10px}
 .cc-home .hero .btn{width:100%;text-align:center}
 .cc-home .hero-stage{height:clamp(220px,62vw,380px)!important;min-height:0!important}
 .cc-home .hero-stage img{object-fit:cover;width:100%;height:100%}
 .cc-home .logo-bar .inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:12px 16px}
 .cc-home .logo-bar a{font-size:12px;line-height:1.35;padding:10px 4px;justify-content:center;text-align:center}
 .cc-home .section,.cc-home .why,.cc-home .steps,.cc-home .quote{padding:28px 16px!important}
 .cc-home .section h2,.cc-home .why h2,.cc-home .steps h2{font-size:22px;line-height:1.25;letter-spacing:0;text-transform:none}
 .cc-home .buy-again{padding:24px 16px!important;margin:0 auto}
 .cc-home .buy-again-card,.cc-home .onboarding-inner{padding:24px 20px!important;gap:20px}
 .cc-home .buy-again h2,.cc-home .onboarding-inner h2{font-size:28px;line-height:1.2}
 .cc-home .buy-again .actions{display:flex;flex-direction:column;gap:10px}
 .cc-home .buy-again .btn{width:100%;text-align:center}
 .cc-home .reorder-line{gap:12px;font-size:14px}
 .cc-home .reorder-line a{padding:10px 0;min-height:44px}
 .cc-home .grid6{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px}
 .cc-home .cat,.cc-home .prod{min-width:0;border-radius:12px}
 .cc-home .cat b{font-size:15px;line-height:1.4;padding:12px}
 .cc-home .cat .ph{height:120px!important;background-size:contain!important}
 .cc-home #featuredProducts{grid-template-columns:1fr!important}
 .cc-home .prod b{font-size:18px;line-height:1.4}
 .cc-home .prod small,.cc-home .prod .catalog-code{font-size:14px}
 .cc-home .prod .ph{height:190px!important}
 .cc-home .family-grid{grid-template-columns:1fr!important;gap:10px}
 .cc-home .family-link{padding:16px;min-height:64px}
 .cc-home .family-link b{font-size:16px}
 .cc-home .family-link small{font-size:14px;line-height:1.5}
 .cc-home .whygrid,.cc-home .stepgrid{display:grid;grid-template-columns:1fr;gap:20px}
 .cc-home .whyitem h3,.cc-home .step h3{font-size:17px;line-height:1.35;letter-spacing:0;text-transform:none}
 .cc-home .whyitem p,.cc-home .step p,.cc-home .quote-card p{font-size:15px;line-height:1.65}
 .cc-home .step{max-width:none;align-items:flex-start;gap:12px}
 .cc-home .stepnum{font-size:36px;color:#005cb9}
 .cc-home .stepic,.cc-home .steparrow{display:none}
 .cc-home .onboarding-band{padding:0 16px!important;margin:16px auto 28px}
 .cc-home .onboarding-inner .btn{width:100%;text-align:center}
 .cc-home .quote{grid-template-columns:1fr;gap:20px}
 .cc-home .quote-card{min-height:0;padding:24px}
 .cc-home .frow{grid-template-columns:1fr!important}
 .cc-home .footer{padding:28px 16px!important}
 .cc-home .footer .col a{display:flex;align-items:center;min-height:44px;font-size:15px}
 .cc-home .footer p{font-size:15px;line-height:1.6}
 .cc-home .cart-drawer{max-width:100vw;width:min(430px,100vw)}
 .cc-home .smart-search-results{max-height:55svh;overflow:auto}
 .cc-home a:focus-visible,.cc-home button:focus-visible{outline:3px solid #005cb9;outline-offset:3px}
}
@media(max-width:360px){.cc-home .grid6{grid-template-columns:1fr!important}}

/* Product media containment: mobile and desktop. */
.prod{min-width:0;height:auto}
.prod > .ph{display:flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:0;min-height:0;height:160px;overflow:hidden;margin:0 0 14px}
.prod > .ph > img,.account-product-art > img{display:block;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;flex:0 1 auto}
.prod > b,.prod > small,.prod > .catalog-code{min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.45}
.prod > .product-photo-note{margin:0 0 12px!important;line-height:1.45}
.prod > .price{margin-top:8px}
.prod .product-actions > *{min-width:0;min-height:44px;height:auto;white-space:normal}
.account-product-art{flex:none;min-width:0;overflow:hidden}
.account-product-card h4{overflow-wrap:anywhere;line-height:1.4}
.account-product-card .product-photo-note{line-height:1.45;margin-bottom:12px!important}
@media(max-width:820px){.prod > .ph{height:190px}}