/* Product-page navigation must occupy the same fixed slots as the home page.
   Keeping the slots stable prevents language/cart controls from moving when a
   page has shorter labels or when the missing Benefits link is hydrated. */
@media (min-width:1280px) {
  nav .nav-inner {
    height:80px!important;
    min-height:80px!important;
  }
  nav .nav-left {
    display:grid!important;
    grid-template-columns:clamp(132px,8.2vw,160px) clamp(106px,6.6vw,130px) clamp(76px,4.8vw,94px) clamp(59px,3.75vw,72px)!important;
  }
  nav .nav-left>a,
  nav .nav-right-links>a {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    justify-self:stretch!important;
    text-align:center!important;
    top:-3px!important;
  }
  nav .nav-right-links {
    display:grid!important;
    grid-template-columns:clamp(106px,6.65vw,130px) clamp(42px,2.7vw,52px) clamp(80px,5.05vw,98px)!important;
  }
  nav .nav-logo img {
    transform:translateY(-3px)!important;
  }
  nav .nav-cart-area>.language-switch {
    transform:translateX(10px)!important;
  }
}

@media (min-width:1280px) and (max-width:1399px) {
  nav .nav-right-links { gap:20px!important; }
  nav .nav-cart-area { gap:10px!important; }
  nav .nav-cart-area>.language-switch { margin-left:0!important; }
  nav .cart-btn { flex-basis:64px!important; width:64px!important; }
}

/* On compact desktop screens, align the first navigation label with the
   content edge and keep the labels evenly separated. The large-PC geometry
   starts at 1800px and remains unchanged. */
@media (min-width:1280px) and (max-width:1599px) {
  html body nav .nav-left {
    grid-template-columns:repeat(4,max-content)!important;
    column-gap:clamp(37px,calc(14vw - 142.2px),48px)!important;
    transform:translateX(-36px)!important;
  }
  html body nav .nav-right-links {
    grid-template-columns:repeat(3,max-content)!important;
    column-gap:clamp(32px,2.6vw,42px)!important;
  }
}

/* The translated first labels have different intrinsic widths. Align their
   visible left edge with the catalogue edge instead of centring every
   language around the German label width. */
@media (min-width:1280px) and (max-width:1599px) {
  html[lang^="fr"] body nav .nav-left { transform:translateX(-47px)!important; }
  html[lang^="en"] body nav .nav-left { transform:translateX(36px)!important; }
}

@media (min-width:1280px) and (max-width:1360px) {
  html body nav .nav-left {
    transform:translateX(-99px)!important;
  }
  html[lang^="fr"] body nav .nav-left { transform:translateX(-110px)!important; }
  html[lang^="en"] body nav .nav-left { transform:translateX(-27px)!important; }
}

@media (max-width:480px) {
  .shop-footer { padding:24px 0 28px!important; line-height:1.35!important; }
  .shop-footer>.container { padding-left:16px!important; padding-right:16px!important; }
  .shop-footer .footer-inner { gap:5px!important; }
  .shop-footer .footer-company { margin-top:0!important; line-height:1.32!important; }
  .shop-footer .footer-prelaunch-note { line-height:1.32!important; }
  .shop-footer .footer-links { display:flex!important; flex-wrap:wrap!important; justify-content:center!important; width:min(100%,430px)!important; column-gap:22px!important; row-gap:13px!important; margin-top:12px!important; line-height:1.3!important; text-align:center!important; }
  .shop-footer .footer-links a { display:inline-flex!important; align-items:center!important; justify-content:center!important; min-width:0!important; min-height:0!important; padding:2px 0!important; border:0!important; border-radius:0!important; background:none!important; color:#999!important; line-height:1.25!important; overflow-wrap:anywhere!important; }
  .shop-footer .footer-links a::after { content:none!important; }
}

/* Keep the current home-page navigation geometry on every shop/product page.
   Medium widths use the compact menu; landscape tablets and narrow desktops
   keep the full menu in the same centered three-column layout as the home page. */
@media (min-width:769px) {
  html body.sd-family-shop>nav {
    font-size:18.4px!important;
    line-height:29.44px!important;
  }
  html body.sd-family-shop>nav .cart-btn { font-size:15.64px!important; }
}

@media (min-width:769px) and (max-width:1360px) {
  :root { --nav-h:72px!important; }
  html body nav { height:72px!important; }
  html body nav .nav-inner {
    position:relative!important;
    display:grid!important;
    grid-template-columns:50px minmax(0,1fr) auto!important;
    grid-template-rows:72px!important;
    align-items:center!important;
    width:100%!important;
    max-width:none!important;
    height:72px!important;
    min-height:72px!important;
    margin:0!important;
    padding:0 24px!important;
    column-gap:12px!important;
  }
  html body nav .nav-left,
  html body nav .nav-right-links { display:none!important; }
  html body nav .nav-toggle {
    position:relative!important;
    z-index:4!important;
    display:flex!important;
    grid-column:1!important;
    grid-row:1!important;
    justify-self:start!important;
    align-items:center!important;
    justify-content:center!important;
    width:50px!important;
    height:50px!important;
    padding:8px!important;
  }
  html body nav .nav-logo {
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    z-index:2!important;
    display:flex!important;
    grid-column:1/-1!important;
    grid-row:1!important;
    justify-self:center!important;
    width:96px!important;
    height:64px!important;
    margin:0!important;
    transform:translate(-50%,-50%)!important;
  }
  html body nav .nav-logo img {
    width:auto!important;
    max-width:96px!important;
    height:64px!important;
    transform:none!important;
  }
  html body nav .nav-cart-area {
    position:relative!important;
    z-index:4!important;
    display:flex!important;
    grid-column:3!important;
    grid-row:1!important;
    justify-self:end!important;
    align-items:center!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    gap:12px!important;
    transform:none!important;
  }
  html body nav .nav-cart-area>.language-switch { margin:0!important; transform:none!important; }
  html body nav .cart-btn { flex:0 0 56px!important; width:56px!important; height:46px!important; }
  html body nav .sd-nav-whatsapp { width:56px!important; min-width:56px!important; }
  html body nav .nav-links {
    position:fixed!important;
    top:72px!important;
    left:0!important;
    right:0!important;
    z-index:10000!important;
    display:none!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:20px!important;
    max-height:calc(100dvh - 72px)!important;
    padding:28px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    background:rgba(8,8,12,.98)!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    box-shadow:0 18px 40px rgba(0,0,0,.45)!important;
    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;
  }
  html body nav .nav-links.open { display:flex!important; }
  html body nav .nav-links .mobile-language-switch { display:none!important; }
  .site-nav~main { padding-top:72px!important; }
}

@media (min-width:1361px) and (max-width:1499px) {
  :root { --nav-h:80px!important; }
  html body nav { height:80px!important; }
  html body nav .nav-inner.nav-inner {
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 96px minmax(0,1fr)!important;
    grid-template-rows:80px!important;
    justify-content:center!important;
    align-items:center!important;
    width:1113px!important;
    max-width:calc(100% - 48px)!important;
    height:80px!important;
    min-height:80px!important;
    margin:0 auto!important;
    padding:0!important;
    column-gap:24px!important;
  }
  html body.sd-family-shop nav .nav-inner.nav-inner>.nav-left.nav-left {
    display:flex!important;
    grid-column:1!important;
    align-items:center!important;
    justify-self:stretch!important;
    justify-content:space-between!important;
    gap:0!important;
    width:100%!important;
    transform:none!important;
  }
  html body.sd-family-shop nav .nav-inner.nav-inner .nav-right-links.nav-right-links {
    display:flex!important;
    align-items:center!important;
    gap:32px!important;
  }
  html body nav .nav-toggle { display:none!important; }
  html body nav .nav-logo {
    position:relative!important;
    left:auto!important;
    top:auto!important;
    z-index:2!important;
    display:flex!important;
    grid-column:2!important;
    grid-row:1!important;
    justify-self:center!important;
    width:96px!important;
    height:72px!important;
    margin:0!important;
    transform:none!important;
  }
  html body nav .nav-logo img { width:auto!important; max-width:96px!important; height:72px!important; transform:none!important; }
  html body.sd-family-shop nav .nav-inner.nav-inner>.nav-cart-area.nav-cart-area {
    position:relative!important;
    z-index:4!important;
    display:flex!important;
    grid-column:3!important;
    grid-row:1!important;
    justify-self:stretch!important;
    justify-content:space-between!important;
    align-items:center!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    gap:0!important;
    transform:none!important;
  }
  html body nav .nav-cart-area>.language-switch { margin-left:0!important; margin-right:0!important; transform:none!important; }
  html body nav .cart-btn { flex:0 0 56px!important; width:56px!important; height:46px!important; }
  html body nav .sd-nav-whatsapp { width:56px!important; min-width:56px!important; }
  html body nav .nav-left>a,
  html body nav .nav-right-links>a { font-size:18px!important; white-space:nowrap!important; }
  html body nav .nav-links,
  html body nav .nav-links.open { display:none!important; }
  .site-nav~main { padding-top:80px!important; }
}

.product-details-section { padding-top:40px!important; }

@media (max-width:768px) {
  .product-details-section { padding-top:30px!important; }
}