@media (max-width: 900px){
  html,body{max-width:100%;overflow-x:hidden}
  body.mobile-menu-open{overflow:hidden}
  .header{height:66px!important;padding:0 16px!important;grid-template-columns:1fr 42px!important;z-index:1000}
  .header .logo img{width:165px!important;max-width:165px!important;height:51px!important}
  .headright{display:none!important}
  .menu{display:block!important;z-index:1002;color:inherit;cursor:pointer}
  .mainnav{position:fixed!important;left:0!important;right:0!important;top:66px!important;bottom:0!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;height:calc(100dvh - 66px)!important;max-height:none!important;overflow-y:auto!important;overscroll-behavior:contain;padding:10px 20px 28px!important;background:#f4f1ea!important;color:#11110f!important;box-shadow:0 18px 35px rgba(17,17,15,.16);z-index:1001;transform:translateY(-130%)!important;transition:transform .28s ease!important}
  .mainnav.open{transform:translateY(0)!important}
  .mainnav>.navgroup{width:100%}
  .mainnav>.navgroup>a,.mainnav>.navgroup>button,.mainnav>a{position:relative;display:block;width:100%;padding:15px 34px 15px 0!important;border:0!important;border-bottom:1px solid var(--line,rgba(17,17,15,.15))!important;background:transparent!important;color:#11110f!important;text-align:left!important;font:700 13px/1.35 Arial,Helvetica,sans-serif!important}
  .mainnav>.navgroup>a::after,.mainnav>.navgroup>button::after{content:"+";position:absolute;right:2px;top:50%;transform:translateY(-50%);font-size:20px;font-weight:400;line-height:1}
  .mainnav>.navgroup.mobile-open>a::after,.mainnav>.navgroup.mobile-open>button::after{content:"−"}
  .mainnav.open .navgroup>.dropdown{display:none!important}
  .mainnav.open .navgroup.mobile-open>.dropdown{position:static!important;display:block!important;width:100%!important;margin:0!important;padding:6px 0 13px 15px!important;border:0!important;border-bottom:1px solid var(--line,rgba(17,17,15,.15))!important;background:transparent!important;box-shadow:none!important;opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto!important}
  .mainnav .dropdown .drop-media,.mainnav .dropdown .drop-list>small{display:none!important}
  .mainnav .dropdown .drop-list,.mainnav .dropdown .drop-links{display:block!important}
  .mainnav .dropdown .drop-links>a{display:block!important;width:100%!important;padding:9px 0!important;border:0!important;color:#6f6962!important;font-size:13px!important;font-weight:400!important;line-height:1.35!important;white-space:normal!important}
  .mainnav .dropdown .drop-links>a.mobile-all-link{color:#11110f!important;font-weight:700!important}
  .hero-stats .wrap{height:78px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .hero-stats .stat{min-width:0!important;min-height:78px!important;padding:18px 3px 12px!important;text-align:center!important}
  .hero-stats .stat:not(:last-child)::after{display:block!important;top:25%!important;height:50%!important}
  .hero-stats .stat span{display:block;max-width:100%;font-size:clamp(6px,2.05vw,9px)!important;line-height:1.2!important;letter-spacing:.025em!important;white-space:normal!important}
  .hero-scroll{bottom:142px!important}
  .dots{bottom:151px!important}
  .product-simple span{display:block!important;width:auto!important;height:auto!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#11110f!important;box-shadow:none!important}
  .product-simple span::before,.product-simple span::after{display:none!important;content:none!important}
  .section-head h2,.story h2,.stores h2,.blog h2,.gallery-intro h1,.detail-copy h1,.offer-intro h1,.contact-hero h1{overflow-wrap:anywhere}
  .story-grid>div:last-child p,.section-head>p,.store-intro>p,.gallery-intro-grid>p,.offer-intro p{font-size:15px;line-height:1.7}
  .online-chat__panel{max-width:calc(100vw - 30px)}
}

@media (max-width: 560px){
  .hero-copy{bottom:178px!important}
  .hero h1{font-size:clamp(44px,14vw,58px)!important}
  .story,.pillars,.products,.applications,.material-brands,.stores,.blog{padding-top:78px;padding-bottom:78px}
  .section-head{margin-bottom:30px}
  .product-simple{min-height:155px}
  .product-simple h3{font-size:21px}
  .application{height:390px}
  .gallery-intro{padding-top:72px;padding-bottom:44px}
  .footer{padding-top:48px}
}

@media(max-width:900px){
  body .plain-direction-arrow{display:inline-block!important;position:relative!important;width:.8rem!important;height:.8rem!important;min-width:.8rem!important;padding:0!important;margin:0!important;border:0!important;background:none!important;box-shadow:none!important;font-size:0!important;vertical-align:baseline;opacity:1!important;max-height:none!important;transform:none!important}
  body .plain-direction-arrow::before{content:""!important;display:block!important;position:absolute;width:.65rem;height:0;border-top:1.5px solid currentColor;left:0;top:.4rem;transform:rotate(-45deg)}
  body .plain-direction-arrow::after{content:""!important;display:block!important;position:absolute;width:.42rem;height:.42rem;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;right:.08rem;top:.08rem}
}

/* Keep mobile card link labels and their arrows on the same line. */
.gmeta>span{
  display:inline-flex!important;align-items:center!important;white-space:nowrap;
}
.gmeta>span>.plain-direction-arrow{
  display:inline-block!important;margin:0 0 0 4px!important;
}
@media(max-width:900px){
  .product-simple>span,.application>div>span,.gmeta>span{
    display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:4px;white-space:nowrap;
  }
  .product-simple>span>.plain-direction-arrow,.application>div>span>.plain-direction-arrow,.gmeta>span>.plain-direction-arrow{
    display:inline-block!important;flex:0 0 .8rem!important;width:.8rem!important;margin:0!important;
  }
}
