/* ================================================================
   NicoBee — responsive
   Tablette : 768 à 1024 px
   Mobile : jusqu'à 767 px
   ================================================================ */

@media (max-width: 1024px) {
  :root {
    --nb-gutter: 20px;
  }

  .nb-section {
    padding-block: 64px;
  }

  .nb-header-inner {
    min-height: 74px;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
  }

  .nb-menu-toggle {
    display: inline-flex;
    grid-column: 2;
  }

  .nb-menu-toggle-lines,
  .nb-menu-toggle-lines::before,
  .nb-menu-toggle-lines::after {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    content: '';
    transition: transform 180ms ease;
  }

  .nb-menu-toggle-lines::before {
    transform: translateY(-7px);
  }

  .nb-menu-toggle-lines::after {
    transform: translateY(5px);
  }

  .nb-menu-toggle[aria-expanded='true'] .nb-menu-toggle-lines {
    background: transparent;
  }

  .nb-menu-toggle[aria-expanded='true'] .nb-menu-toggle-lines::before {
    transform: translateY(1px) rotate(45deg);
  }

  .nb-menu-toggle[aria-expanded='true'] .nb-menu-toggle-lines::after {
    transform: translateY(-1px) rotate(-45deg);
  }

  .nb-primary-nav {
    display: none;
    grid-column: 1 / -1;
    grid-row: 2;
    padding-bottom: 16px;
  }

  .nb-primary-nav.is-open {
    display: block;
  }

  .nb-primary-menu {
    display: block;
  }

  .nb-primary-menu a {
    padding: 12px 4px;
    border-bottom: 1px solid var(--nb-color-border);
  }

  .nb-primary-menu a::after {
    display: none;
  }

  .nb-header-actions {
    grid-column: 3;
    grid-row: 1;
  }

  .nb-footer-main {
    gap: 36px;
  }
}

@media (max-width: 767px) {
  :root {
    --nb-gutter: 16px;
  }

  .nb-section {
    padding-block: 48px;
  }

  .nb-button,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button {
    width: 100%;
  }

  .nb-site-branding .custom-logo {
    max-width: 150px;
    max-height: 52px;
  }

  .nb-search-toggle {
    display: none;
  }

  .nb-icon-button,
  .nb-menu-toggle {
    width: 38px;
    height: 38px;
    padding: 8px;
  }

  .nb-footer-main {
    padding-block: 44px 32px;
    grid-template-columns: 1fr;
  }

  .nb-footer-menu {
    grid-template-columns: 1fr;
  }

  .nb-footer-bottom {
    padding-block: 20px;
    align-items: flex-start;
    flex-direction: column;
  }

  .nb-legal-menu {
    flex-wrap: wrap;
  }
}
