/* Touch-first navigation and feedback; original logos and category artwork stay intact. */
.mobile-call{display:none}
.quick-lines>a>.quick-art{
  display:grid!important;place-items:center;flex:0 0 50px;width:50px;height:50px;
  border-radius:15px;border:1px solid #3d7095;background:linear-gradient(145deg,#254c68,#173449);
  box-shadow:inset 0 1px #b5eaff12;transition:transform .22s,background .22s,box-shadow .22s;
}
.quick-art>img{width:37px;height:34px;object-fit:contain}
.quick-art>.quick-symbol{width:37px;height:37px;flex-basis:37px}
.quick-art .quick-symbol .ui-icon{width:37px;height:37px}
.quick-lines>a{border-color:#334b65;overflow:hidden}
.quick-lines>a.is-active>.quick-art{background:#0878a8;border-color:#62cfff;box-shadow:0 0 0 3px #25b4ed1a}
.header-main nav .nav-icon{transition:transform .22s,color .22s,background .22s,border-color .22s;border-radius:12px}
.quick-lines>a,.header-main nav a,.make-card,.category-tabs button,.product-open,.mobile-call{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.quick-lines>a:focus-visible,.header-main nav a:focus-visible,.mobile-call:focus-visible{outline:3px solid #7bddff;outline-offset:3px}
.quick-lines>a:active>.quick-art{transform:scale(.9)}
.header-main nav a:active .nav-icon{transform:scale(.86)}
.category-tabs button:not(:disabled):active,.make-card:active,.product-open:active{transform:scale(.97)}
.tap-feedback>.quick-art,.tap-feedback>.nav-icon{animation:map-icon-tap .42s ease-out}
@keyframes map-icon-tap{0%{transform:scale(.88)}55%{transform:scale(1.09)}100%{transform:scale(1)}}
@media(hover:hover) and (pointer:fine){
  .quick-lines>a:hover>.quick-art{transform:translateY(-3px);border-color:#64cfff;box-shadow:0 5px 17px #00a1e128}
  .header-main nav a:hover .nav-icon{transform:translateY(-3px)}
}
@media(max-width:1000px) and (min-width:601px){
 .header-main nav a{border-radius:15px;font-size:17px}
 .header-main nav .nav-icon{width:48px;height:42px;background:#1c3851;border:1px solid #305a77}
}
@media(max-width:600px){
 html{scroll-padding-top:82px;scrollbar-gutter:auto}
 body{padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))}
 header,html[data-theme=dark] header{backdrop-filter:none;isolation:auto}
 .header-main{height:64px;gap:12px}
 .header-main .logo img{width:clamp(175px,51vw,215px)}
 #menu-toggle{display:none}
 .mobile-call{display:flex;align-items:center;justify-content:center;gap:7px;min-width:72px;min-height:46px;padding:7px 11px;border:1px solid #315d7b;border-radius:12px;background:#19344b;color:#c6efff;font-size:16px;font-weight:600}
 .mobile-call .ui-icon{width:23px;height:23px}
 .header-main nav,.header-main nav.open,html[data-theme=dark] .header-main nav{
   position:fixed;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
   inset:auto 0 0;z-index:100;gap:4px;align-items:stretch;padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));
   border:0;border-top:1px solid #385774;background:#101f32f9;box-shadow:0 -6px 24px #0004;
 }
 .header-main nav a{
   min-width:0;min-height:66px;gap:3px;padding:4px 2px;border:1px solid transparent;border-radius:13px;
   font-size:14px;font-weight:600;line-height:1.3;color:#c5d7e8;background:transparent;
 }
 .header-main nav .nav-icon{height:34px;width:43px;background:transparent;border:0;color:#7bd8ff}
 .header-main nav .nav-icon .ui-icon{width:29px;height:29px;stroke-width:1.7}
 .header-main nav a.nav-current{background:#164360;border-color:#2c88b2;color:#fff}
 .header-main nav a.nav-current .nav-icon{color:#a0e7ff;transform:none;background:transparent}
 .header-main nav a:after{display:none}
 .hero{height:clamp(275px,calc(100svh - 475px),390px)}
 .hero-inner{padding-top:23px}
 .hero h1{font-size:clamp(33px,9.4vw,42px);line-height:1.1;margin:13px 0}
 .hero-copy p{font-size:16px;line-height:1.5;margin-bottom:17px}
 .hero-copy .button{min-height:49px;font-size:16px;gap:10px}
 .hero .illustrative{font-size:10px;bottom:9px}
 .quick-lines{gap:9px;width:calc(100% - 28px);overflow:visible;border:0!important;box-shadow:none;background:transparent;margin:0 auto}
 .quick-lines>a{min-height:112px;border:1px solid #36536f!important;border-radius:15px!important;padding:13px 10px 27px;gap:10px;background:linear-gradient(145deg,#1d334c,#14283f);box-shadow:0 5px 15px #0002}
 .quick-lines>a>.quick-art{width:43px;height:45px;flex-basis:43px;border-radius:12px}
 .quick-art>img{width:33px;height:31px}
 .quick-art>.quick-symbol,.quick-art .quick-symbol .ui-icon{width:33px;height:33px}
 .quick-lines>a>span:not(.line-count):not(.quick-art):not(.quick-symbol){font-size:16px;line-height:1.35}
 .quick-lines .line-count{font-size:12px;right:10px;bottom:7px;color:#b4cbdf}
 .quick-lines>a.is-active{border-color:#43c8ff!important;background:#1b435f;box-shadow:inset 0 -3px #1ab7f2}
 .vehicles{padding-top:35px}
 .section-heading{margin-bottom:24px}
 .section-heading h2{font-size:34px;line-height:1.15}
 .category-tabs button,.category-tabs button[data-category=racks]{flex-wrap:wrap;align-content:center;justify-content:center;gap:7px;min-height:92px;border-radius:13px;font-size:16px}
 .category-tabs button:first-child{min-height:52px}
 .category-tabs button .category-count{font-size:13px}
 .category-tabs button:disabled{opacity:.7}
 .category-tabs img{width:35px;height:33px}
 .category-tabs button[data-category=fibra]>.ui-icon{width:35px;height:35px}
 .brand-family{border-radius:13px}
 .brand-family-icon{border-radius:12px;width:43px;height:43px}
 .brand-family-icon .ui-icon{width:29px;height:29px}
 .make-card{border-radius:15px}
 .make-arrow{height:30px;width:30px}
 .brand-family{flex-wrap:wrap}
 .brand-family>div{flex:1;min-width:140px}
 .contact-list>a>strong{font-size:18px}
 .floating-whatsapp{bottom:calc(91px + env(safe-area-inset-bottom,0px));right:12px;min-height:48px;font-size:15px;padding:10px 15px}
 .floating-whatsapp>svg{width:25px;height:25px}
 .filter-toggle,.clear-filters,.filter-chip,.text-button,.bike-shortcut{min-height:46px}
 .vehicle-context>button,.dialog-close{width:46px;height:46px;min-width:46px;min-height:46px}
 .vehicle-context{flex-wrap:wrap}
 .vehicle-context>div{min-width:0}
 .dialog-content .button{width:100%;white-space:normal;text-align:center}
 .photo-tools{gap:12px;flex-wrap:wrap}
 .photo-tools button,.photo-tools a{min-height:44px;display:inline-flex;align-items:center;font-size:14px}
 .product-card{border-radius:17px}
 .product-open{border-radius:11px}
 .catalog-note{font-size:15px}
 .footer-bottom{padding-bottom:58px}
}
@media(max-width:600px) and (max-height:740px){
 .hero{height:263px}
 .hero-inner{padding-top:17px}
 .hero-copy .eyebrow{display:none}
 .hero h1{font-size:34px;margin:9px 0 12px}
 .hero-copy p{line-height:1.45;margin-bottom:14px}
 .hero .illustrative{display:none}
 .quick-lines>a{min-height:99px;padding:10px 9px 24px;gap:8px}
 .quick-lines>a>.quick-art{width:35px;height:40px;flex-basis:35px}
 .quick-art>img{width:30px;height:29px}
 .quick-lines>a>span:not(.line-count):not(.quick-art):not(.quick-symbol){font-size:15px}
}
@media(prefers-reduced-motion:reduce){
 .tap-feedback>.quick-art,.tap-feedback>.nav-icon{animation:none}
 .quick-lines>a>.quick-art,.header-main nav .nav-icon{transition:none}
 .quick-lines>a:hover>.quick-art,.quick-lines>a:active>.quick-art,.header-main nav a:active .nav-icon,.category-tabs button:not(:disabled):active,.make-card:active,.product-open:active{transform:none}
}
@media(max-width:600px){
 .catalog-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start}
 .catalog-toolbar>.search-field{min-width:0;width:100%;margin:0}
 .catalog-toolbar>.search-field input{min-width:0;width:100%}
 .catalog-toolbar>.advanced-filters{grid-column:1/-1;width:100%;box-sizing:border-box}
 .catalog-toolbar .filter-toggle{min-width:110px}
}
@media(max-width:600px){
 .count-note{white-space:normal;max-width:100%;overflow-wrap:anywhere;box-sizing:border-box}
 .header-main{min-height:64px}
 .floating-whatsapp{display:none}
}
