/* Доповнення до styles.css для статичного лендингу (без рушія Horoshop) */
.overlay.is-open{display:flex;align-items:flex-start;justify-content:center;padding:10vh 15px 15px}
.overlay .popup{margin:0 auto;max-width:100%}
.overlay .popup.is-open{display:block}
.upButton{transition:bottom .2s}
.upButton.is-visible{bottom:0}
.popup-msg.is-error{color:#d62828}
.productsMenu-submenu-w{columns:2}
@media (max-width:640px){
  .popup{width:auto;padding:0}
  .popup .form-item{margin-left:0}
  .popup .form-head{justify-content:flex-start;width:auto;height:auto;margin:0 0 6px;text-align:left}
}

/* ===== Блок брендов ===== */
.brands-section{padding:40px 0 60px;background:#fff}
.brands-section__wrapper{max-width:1260px;margin:0 auto;padding:0 30px}
.brands-tabs{display:flex;gap:0;border-bottom:1px solid #e5e5e5;margin-bottom:40px}
.brands-tabs__btn{font-family:"Montserrat",sans-serif;font-size:16px;font-weight:700;padding:14px 28px;background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;color:#555;cursor:pointer;transition:color .15s,border-color .15s}
.brands-tabs__btn:hover{color:#007aff}
.brands-tabs__btn.is-active{color:#007aff;border-bottom-color:#007aff}
.brands-panel[hidden]{display:none}
.brands-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:50px 40px;list-style:none;margin:0;padding:0}
.brands-grid:empty{display:none}
.brand-card{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#222;border:0}
.brand-card__logo{display:flex;align-items:center;justify-content:center;width:100%;height:190px;padding:10px;box-sizing:border-box;border-radius:4px;transition:transform .2s}
.brand-card__logo img{max-width:100%;max-height:100%;object-fit:contain}
.brand-card__logo.is-fallback{background:#f5f5f5;font-family:"Montserrat",sans-serif;font-size:26px;font-weight:700;color:#1466e4;text-align:center}
.brand-card__name{margin-top:22px;font-family:"Montserrat",sans-serif;font-size:14px;font-weight:700;letter-spacing:.06em;color:#222}
.brand-card:hover .brand-card__logo{transform:scale(1.04)}
.brand-card:hover .brand-card__name{color:#007aff}
.brands-empty{color:#666;font-size:15px;padding:20px 0}
.brands-grid:not(:empty) + .brands-empty{display:none}
@media (max-width:900px){.brands-grid{grid-template-columns:repeat(2,1fr);gap:36px 24px}.brand-card__logo{height:140px}}
@media (max-width:520px){.brands-grid{grid-template-columns:1fr}.brands-section__wrapper{padding:0 16px}}

/* ===== Адаптив: десктоп / мобільна версія ===== */
@media (min-width: 992px){ .v-mobile{display:none !important} }
@media (max-width: 991px){
  .v-desktop,#modal-overlay{display:none !important}
  body{margin:0;min-width:0;font-family:"Montserrat",sans-serif}
  .m-page .header{position:sticky;top:0;z-index:100}
  .m-page .banner-img{display:block;width:100%;height:auto}
  .m-page .ribbon-banner__text{padding:8px 12px;text-align:center;font-size:12px;line-height:1.4}
  /* Drawers */
  .m-drawer{position:fixed;top:0;bottom:0;left:0;width:86%;max-width:400px;z-index:1001;background:#fff;transform:translate3d(-100%,0,0);transition:transform .3s ease;overflow-y:auto;overscroll-behavior:contain;display:block}
  .m-drawer--right{left:auto;right:0;transform:translate3d(100%,0,0)}
  .m-drawer.is-open{transform:none;box-shadow:0 0 30px rgba(0,0,0,.25)}
  .m-drawer .mm-panel{position:static;transform:none;display:block;height:auto}
  .m-drawer-blocker{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.4);opacity:0;visibility:hidden;transition:opacity .3s}
  .m-drawer-blocker.is-open{opacity:1;visibility:visible}
  html.m-locked,html.m-locked body{overflow:hidden}
  .m-acc-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;background:none;border:0;font:inherit;color:inherit;text-align:left;cursor:pointer}
  .m-acc-icon{transition:transform .25s;width:14px;height:14px}
  .m-acc-toggle[aria-expanded="true"] .m-acc-icon{transform:rotate(180deg)}
  .m-acc-body{padding-left:14px}
  .m-acc-body[hidden]{display:none}
  .m-all-brands{font-weight:700;color:#1466e4}
  /* Brands */
  .brands-section{padding:24px 0 36px}
  .brands-tabs{margin-bottom:24px;overflow-x:auto}
  .brands-tabs__btn{flex:1;padding:12px 8px;font-size:14px;white-space:nowrap}
  .about{padding:0 16px 24px}
  .footer{padding-bottom:env(safe-area-inset-bottom)}
}
.skip-link{position:absolute;left:-9999px;top:0;z-index:2000;background:#fff;padding:8px 12px}
.skip-link:focus{left:8px}
.brands-grid__item{min-width:0}
.brand-card{width:100%}
@media (max-width:520px){
  .brands-grid{grid-template-columns:repeat(2,1fr);gap:24px 14px}
  .brand-card__logo{height:96px}
  .brand-card__logo.is-fallback{font-size:15px;padding:8px}
  .brand-card__name{margin-top:10px;font-size:11px;text-align:center}
}
@media (max-width:991px){
  .upButton{position:fixed;right:12px;bottom:-60px;z-index:999}
  .upButton.is-visible{bottom:12px}
  .upButton-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:1px solid #007aff;border-radius:50%;background:#fff;color:#007aff;box-shadow:0 2px 8px rgba(0,0,0,.15)}
  .upButton-btn__hint{display:none}
  .upButton-btn .icon{width:14px;height:14px;fill:currentColor}
}
@media (min-width:992px){ .container.v-desktop{min-height:0 !important;height:auto} .container.v-desktop .main{flex:0 0 auto} }
