/* Barcode Labels Bangalore V15 — compact, readable shopping layouts.
   Final stylesheet: wins over legacy spacing without weakening touch targets. */
:root{--v15-header:#174561;--v15-border:#dbe7ee}
html{scroll-padding-top:115px}
/* Desktop: less empty air between every storefront section */
.header-main{height:73px!important;min-height:0!important}
.brand-mark{width:55px;height:55px}
.desktop-nav .nav-inner{min-height:44px!important}
.demo-banner{padding:4px 12px!important}
.utility-bar{padding:6px 0!important}
.header-main>.searchbar{height:44px!important;max-width:440px!important}
.header-main>.searchbar .search-submit{min-height:34px!important}
.section{padding-block:48px!important}
.section-head{margin-bottom:19px!important;gap:16px!important}
.section-head h2{margin:6px 0 8px!important;font-size:clamp(26px,2.8vw,37px)!important;line-height:1.18!important}
.section-head p{font-size:12.5px!important;line-height:1.55!important}
.section-head .text-link{font-size:12px!important}
.section-finder{padding-top:35px!important;padding-bottom:22px!important}
.finder-wrap{padding:26px 28px!important;gap:24px!important}
.finder-left h2{font-size:24px!important;margin:5px 0 8px!important}
.finder-left p{font-size:11px!important;line-height:1.55!important}
.finder-form{gap:10px!important}
.finder-form label{gap:5px!important}
.finder-form select{height:42px!important}
.finder-submit{min-height:42px!important}
#categories.section,#label-materials.section{padding-block:38px!important}
#categories .section-head,#label-materials .section-head{margin-bottom:17px!important}
#homepage-materials.material-directory-grid{margin-bottom:0!important}
.products-section{padding-top:41px!important}
.shop-controls{margin-bottom:15px!important}
.article-grid{gap:16px!important}
.article-art{height:175px!important}
.article-art img{max-height:100%!important;object-fit:contain!important}
.brand-grid{gap:14px!important}
.brand-card{padding:18px!important}
.brand-footnote{margin-top:12px!important;font-size:11px!important}
.faq-section,.knowledge-section,.brand-section,.size-section{padding-block:40px!important}
.faq-layout{gap:24px!important}
.cta-section{padding-top:18px!important;padding-bottom:44px!important}
.cta-box{padding:30px 35px!important}
.site-footer{padding-top:42px!important}
.footer-grid{gap:25px!important}
.inner-page .main-inner{padding-block:28px 52px!important}
.inner-banner-layout{min-height:0!important;padding-block:23px!important}
.inner-banner h1{margin:7px 0 8px!important}
.inner-banner .bread{margin-bottom:8px!important}
.related-products{margin-top:38px!important}
/* Prevent decorative card transitions from shifting layout while loading. */
.category-card,.material-directory-card,.product-card{content-visibility:auto;contain-intrinsic-size:auto 235px}
@media(min-width:1100px){.hero-layout{min-height:440px!important}.hero-copy{padding-block:40px!important}.hero-visual{height:410px!important}.hero-photo{height:330px!important;top:42px!important}}
@media(min-width:861px) and (max-width:1099px){.hero-layout{min-height:405px!important}.hero-copy{padding-block:32px!important}.hero-visual{height:390px!important}}

@media(max-width:860px){
 html{scroll-padding-top:110px!important}
 body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))!important}
 .site-header{z-index:1400!important}
 .container{width:calc(100% - 28px)!important}
 .demo-banner{height:18px!important;min-height:18px!important;padding:0 8px!important}
 .demo-banner::after{font-size:8px!important;letter-spacing:.02em!important}
 .header-main{display:grid!important;grid-template-rows:57px 43px!important;gap:0 8px!important;padding-bottom:5px!important;min-height:0!important;height:auto!important}
 .header-main>.brand{align-self:center!important}
 .brand-mark{width:44px!important;height:44px!important;border-radius:12px!important}
 .brand-mark svg{width:40px!important;height:40px!important}
 .brand{gap:8px!important}
 .brand-type strong{font-size:15.5px!important;letter-spacing:-.4px!important}
 .brand-type small{font-size:8px!important;letter-spacing:1.9px!important;margin-top:3px!important}
 .mobile-menu-button.v13-header-menu{min-height:39px!important;height:39px!important;padding:5px 11px!important;border-radius:10px!important;font-size:16px!important}
 .v13-header-menu span{font-size:11.5px!important}
 .header-main>.searchbar{height:39px!important;min-height:39px!important;padding:3px 4px 3px 11px!important;gap:7px!important;border-radius:10px!important;max-width:none!important}
 .header-main>.searchbar svg{width:16px!important;height:16px!important;flex:none!important}
 .header-main>.searchbar input{font-size:12px!important;line-height:1.2!important;padding:0!important}
 .header-main>.searchbar .search-submit{height:33px!important;min-height:33px!important;width:46px!important;flex:0 0 46px!important;padding:5px 3px!important;border-radius:8px!important;font-size:0!important}
 .header-main>.searchbar .search-submit::after{content:'Go';font-size:12px;font-weight:800;line-height:1}
 .section{padding-block:28px!important}
 .section-head{margin-bottom:13px!important;gap:7px!important}
 .section-head h2{font-size:clamp(23px,6vw,30px)!important;margin:5px 0 6px!important;line-height:1.15!important}
 .section-head p{font-size:11px!important;line-height:1.45!important}
 .section-head .text-link{margin-top:8px!important;font-size:11px!important}
 .section-kicker{font-size:9px!important;letter-spacing:1.6px!important}
 /* Hero: keep the photo and buying actions without a screen of introductory padding */
 .hero-layout{min-height:0!important;gap:0!important}
 .hero-copy{padding:18px 0 6px!important}
 .hero .eyebrow{font-size:8px!important;letter-spacing:1.2px!important}
 .hero h1{font-size:clamp(30px,7.5vw,37px)!important;line-height:1.09!important;letter-spacing:-1.3px!important;margin:9px 0 8px!important}
 .hero p{font-size:11.5px!important;line-height:1.48!important;max-width:580px!important}
 .hero-cta{margin-top:12px!important;gap:8px 12px!important}
 .hero-cta .btn{min-height:42px!important;padding:9px 12px!important;font-size:10.5px!important;gap:8px!important}
 .hero-points{margin-top:8px!important;font-size:8.5px!important;gap:4px 9px!important}
 .hero-visual{height:184px!important;min-height:0!important;margin:5px 0 7px!important}
 .hero-visual .hero-photo{height:178px!important;top:0!important;border-radius:13px!important;object-position:center 50%!important}
 .trust-grid{padding:9px 0!important;gap:5px 9px!important}
 .trust-grid>div{gap:7px!important}
 .trust-grid strong{font-size:10px!important}
 .trust-grid small{font-size:8px!important;line-height:1.25!important}
 .trust-icon{font-size:18px!important}
 /* Finder: four inputs remain accessible, but the section is not a giant card */
 .section-finder{padding-top:19px!important;padding-bottom:14px!important}
 .finder-wrap{padding:15px!important;gap:11px!important;border-radius:14px!important}
 .finder-left h2{font-size:23px!important;letter-spacing:-.65px!important;margin:4px 0 4px!important}
 .finder-left p{font-size:10.5px!important;line-height:1.45!important;max-width:none!important}
 .finder-form{gap:8px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .finder-form label{font-size:10px!important;gap:5px!important;min-width:0!important}
 .finder-form select{font-size:11px!important;height:41px!important;min-width:0!important;padding:0 8px!important}
 .finder-submit{min-height:43px!important;font-size:11px!important}
 #categories.section,#label-materials.section{padding-block:23px!important}
 #categories .section-head,#label-materials .section-head{margin-bottom:13px!important}
 .category-grid{gap:10px!important}
 .category-card{min-height:222px!important;padding:11px!important;gap:6px!important}
 .category-card img{height:116px!important;min-height:0!important}
 .category-card h3{font-size:13px!important;margin:1px 0 4px!important}
 .category-card p{font-size:9.5px!important;line-height:1.35!important;margin:0 0 7px!important}
 .category-card .arrow{font-size:10px!important}
 #homepage-materials.material-directory-grid{gap:10px!important;margin-bottom:0!important}
 #homepage-materials .v7-material-image{min-height:0!important;aspect-ratio:1.28!important;padding:5px!important}
 #homepage-materials .material-card-copy{padding:9px 12px 13px 10px!important}
 #homepage-materials .material-card-copy strong{font-size:11.5px!important;line-height:1.28!important}
 #homepage-materials .material-card-copy small{font-size:9.5px!important;line-height:1.28!important}
 .products-section{padding-top:26px!important}
 .shop-controls{margin-bottom:11px!important;gap:8px!important}
 .filter-tabs{gap:5px!important;margin-bottom:10px!important}
 .filter-tabs a,.filter-tabs button{font-size:10px!important;padding:7px 9px!important;min-height:35px!important}
 .product-grid{gap:10px!important}
 .product-card-main{padding:10px!important}
 .product-card h3{font-size:11.5px!important;line-height:1.35!important;margin:5px 0 7px!important}
 .product-image{aspect-ratio:1.22!important}
 .count-pill{padding:5px 10px!important}
 .size-section,.brand-section,.knowledge-section,.faq-section{padding-block:26px!important}
 .size-layout{gap:12px!important}
 .size-pills{gap:6px!important}
 .brand-grid{gap:10px!important}
 .brand-card{padding:14px 11px!important;min-height:0!important}
 .brand-footnote{margin-top:10px!important;font-size:10px!important;line-height:1.4!important}
 .article-grid{gap:11px!important}
 .article-card{min-height:0!important}
 .article-art{height:138px!important}
 .article-card-main,.article-copy{padding:14px!important}
 .article-card h3{font-size:15px!important;line-height:1.36!important}
 .faq-layout{gap:12px!important}
 .faq-layout h2{font-size:25px!important}
 .faq-list details{padding:12px 0!important}
 .cta-section{padding-top:13px!important;padding-bottom:27px!important}
 .cta-box{padding:20px!important}
 .cta-box h2{font-size:23px!important}
 .cta-box p{font-size:11.5px!important}
 .cta-box .btn{min-height:43px!important;margin-top:12px!important}
 .site-footer{padding-top:28px!important;padding-bottom:20px!important}
 .footer-grid{gap:17px 11px!important}
 .inner-page .main-inner{padding-block:18px 40px!important}
 .inner-banner-layout{padding-block:17px!important}
 .inner-banner h1{font-size:28px!important}
 .inner-banner p{font-size:11.5px!important}
 .related-products{margin-top:25px!important}
 /* Less persistent chrome without compromising 44px tap size. */
 .v13-contact-bar{gap:8px!important;padding:7px 12px calc(7px + env(safe-area-inset-bottom,0px))!important}
 .v13-contact-bar a{min-height:44px!important;padding:9px 7px!important;font-size:12px!important;border-radius:11px!important}
}
@media(max-width:370px){
 .brand-type strong{font-size:13.4px!important}.brand-mark{width:41px!important;height:41px!important}
 .header-main{grid-template-rows:54px 43px!important}
 .container{width:calc(100% - 24px)!important}
 .category-card{min-height:213px!important}.category-card img{height:105px!important}
 .finder-wrap{padding:12px!important}
}
@media(prefers-reduced-motion:reduce){.category-card,.material-directory-card{transition:none!important}}
/* Final desktop density and natural content flow (avoid browser-sized placeholders). */
.category-card,.material-directory-card,.product-card{content-visibility:visible!important;contain-intrinsic-size:none!important}
@media(min-width:861px){
 .hero-layout{min-height:405px!important}
 .hero-copy{padding-block:31px!important}
 .hero h1{font-size:clamp(39px,3.7vw,53px)!important;letter-spacing:-2.5px!important;margin:14px 0!important}
 .hero p{font-size:13px!important;line-height:1.65!important}
 .hero-cta{margin-top:19px!important}
 .hero-points{margin-top:22px!important}
 .hero-visual{height:390px!important}
 .hero-visual .hero-photo{top:32px!important;height:314px!important}
 .category-card{min-height:210px!important;padding:21px!important}
 .category-card img{height:158px!important}
}