
/* ==========================================================
   MAKEAPACK DESKTOP OPTIMIZATION V1
   Desktop only. Mobile/tablet behavior below 1024px untouched.
   ========================================================== */
@media (min-width:1024px){

  :root{--mkp-desktop-max:1440px}

  body{padding-top:78px!important}

  .site-header{
    height:78px!important;
    background:rgba(10,11,10,.97)!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    backdrop-filter:blur(16px);
  }

  .site-header>.container.nav,
  .site-header .container.nav{
    width:min(calc(100% - 56px),var(--mkp-desktop-max))!important;
    max-width:none!important;
    height:78px!important;
    margin:0 auto!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:190px minmax(0,1fr) auto auto auto!important;
    gap:18px!important;
    align-items:center!important;
  }

  .site-header .brand{
    display:flex!important;
    align-items:center!important;
    width:178px!important;
    min-width:178px!important;
    margin:0!important;
  }

  .site-header .brand img{
    width:178px!important;
    height:auto!important;
    max-height:42px!important;
    object-fit:contain!important;
    object-position:left center!important;
    background:transparent!important;
  }

  .site-header #mainNav.nav-links{
    position:static!important;
    inset:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    overflow:visible!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  .site-header #mainNav>.mkp-desktop-nav-link{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:42px!important;
    padding:0 11px!important;
    margin:0!important;
    color:#d8d9d6!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:650!important;
    letter-spacing:.005em!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
  }

  .site-header #mainNav>.mkp-desktop-nav-link:after{
    content:""!important;
    position:absolute!important;
    left:11px!important;
    right:11px!important;
    bottom:4px!important;
    height:1px!important;
    background:#c8872b!important;
    transform:scaleX(0)!important;
    transform-origin:left!important;
    transition:transform .18s ease!important;
  }

  .site-header #mainNav>.mkp-desktop-nav-link:hover{
    color:#fff!important;
  }
  .site-header #mainNav>.mkp-desktop-nav-link:hover:after{
    transform:scaleX(1)!important;
  }

  .site-header #mainNav .mp-mobile-menu{display:none!important}
  .site-header .menu-btn{display:none!important}

  .site-header .mkp-desktop-contact{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:40px!important;
    padding:0 17px!important;
    border:1px solid #c8872b!important;
    background:#c8872b!important;
    color:#111!important;
    font-size:10px!important;
    line-height:1!important;
    font-weight:780!important;
    text-decoration:none!important;
    white-space:nowrap!important;
  }

  .site-header .smart-search-trigger{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
    margin:0!important;
    border-radius:0!important;
    border-color:rgba(255,255,255,.18)!important;
    color:#ddd!important;
  }

  .site-header .smart-search-trigger:hover{
    color:#c8872b!important;
    border-color:#c8872b!important;
    background:transparent!important;
    transform:none!important;
  }

  .site-header .lang-switch{
    height:40px!important;
    margin:0!important;
    border-radius:0!important;
    border-color:rgba(255,255,255,.18)!important;
    background:transparent!important;
  }

  .site-header .lang-btn{
    min-width:34px!important;
    height:38px!important;
    padding:0 8px!important;
    border-radius:0!important;
    font-size:9px!important;
    font-weight:750!important;
  }

  /* Wider, calmer desktop rhythm without touching mobile. */
  #page-home>.makeapack-film-hero .container,
  #page-home .catalog-category-access>.container,
  #page-home .hp-flow-section>.container,
  #page-home .container{
    max-width:1320px;
  }

  #page-home .hp-flow-section{padding-top:104px!important;padding-bottom:104px!important}
  #page-home .hp-flow-head{gap:78px!important;margin-bottom:52px!important}

  #page-home .hp-system-card,
  #page-home .hp-industry-card,
  #page-home .hp-beyond-card,
  #page-home .hp-knowledge-card{
    transition:border-color .16s ease,background .16s ease,transform .16s ease!important;
  }

  #page-home .hp-industry-card:hover,
  #page-home .hp-beyond-card:hover,
  #page-home .hp-knowledge-card:hover{
    transform:translateY(-3px);
  }

  /* Product pages: use desktop width better, but preserve page layouts. */
  .mkp-product-system>.container,
  .mkp-product-system .product-showcase>.container,
  .mkp-product-system .section>.container,
  .mkp-product-system .product-detail-shell,
  .deep-page>.container,
  .deep-page .container{
    max-width:1320px!important;
  }

  .mkp-product-system .product-detail,
  .mkp-product-system [class*="configurator"]{
    scroll-margin-top:96px!important;
  }
}

@media (min-width:1024px) and (max-width:1180px){
  .site-header>.container.nav,
  .site-header .container.nav{
    width:calc(100% - 32px)!important;
    grid-template-columns:150px minmax(0,1fr) auto auto!important;
    gap:10px!important;
  }
  .site-header .brand{width:145px!important;min-width:145px!important}
  .site-header .brand img{width:145px!important}
  .site-header #mainNav>.mkp-desktop-nav-link{padding:0 7px!important;font-size:10px!important}
  .site-header .mkp-desktop-contact{display:none!important}
}
