/**
 * HYDRA storefront — layout shell & container (desktop scale).
 * Scope: #hydraLandingRoot only. Loads after public-storefront.css.
 * Aliases: .store-shell = .hydra-mkt, .store-home = .hydra-mkt-main, etc.
 */

#hydraLandingRoot .hydra-mkt--paper {
  --store-max-width: 1680px;
  --store-pad-x: 24px;
  --store-pad-x-desktop: 32px;
  --store-sidebar-width: 280px;
  --store-sidebar-width-desktop: 320px;
  --store-grid-gap: 18px;
  --store-grid-gap-desktop: 20px;
}

/* Shell — .hydra-mkt / .store-shell */
#hydraLandingRoot .hydra-mkt.hydra-mkt--paper,
#hydraLandingRoot .hydra-mkt--paper.hydra-mkt {
  width: 100%;
  max-width: var(--store-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--store-pad-x);
  padding-right: var(--store-pad-x);
  padding-bottom: 3rem;
  overflow-x: clip;
}

#hydraLandingRoot .hydra-mkt--paper .hydra-mkt-main,
#hydraLandingRoot .hydra-mkt--paper .hydra-mkt-topbar,
#hydraLandingRoot .store-home,
#hydraLandingRoot .store-section {
  max-width: none;
  width: 100%;
}

/* Beat late density pass (1240px cap) in public-storefront.css */
@media (min-width: 1100px) {
  #hydraLandingRoot .hydra-mkt--paper .hydra-mkt-main,
  #hydraLandingRoot .hydra-mkt--paper .hydra-mkt-topbar {
    max-width: none;
  }
}

#hydraLandingRoot .hydra-mkt-store-layout,
#hydraLandingRoot .store-grid-shell {
  width: 100%;
  min-width: 0;
}

/* Section rhythm — slightly tighter vertical, wider horizontal */
@media (min-width: 1100px) {
  #hydraLandingRoot .hydra-mkt--paper {
    --store-pad-x: var(--store-pad-x-desktop);
  }

  #hydraLandingRoot .hydra-mkt.hydra-mkt--paper,
  #hydraLandingRoot .hydra-mkt--paper.hydra-mkt {
    padding-left: var(--store-pad-x-desktop);
    padding-right: var(--store-pad-x-desktop);
  }

  #hydraLandingRoot .hydra-mkt-section,
  #hydraLandingRoot .hydra-mkt-spotlight-wrap,
  #hydraLandingRoot .store-section {
    margin-bottom: 1.35rem;
  }

  #hydraLandingRoot .hydra-mkt-spotlight-wrap {
    gap: 0.65rem;
    margin-bottom: 1rem;
  }

  #hydraLandingRoot .hydra-mkt-catalog-bar {
    margin-bottom: 0.75rem;
    padding-bottom: 0.65rem;
  }

  #hydraLandingRoot .hydra-mkt-main-head {
    margin-bottom: 0.65rem;
  }
}

@media (min-width: 1280px) {
  #hydraLandingRoot .hydra-mkt-store-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--store-sidebar-width-desktop);
    grid-template-rows: auto auto;
    gap: 0 1.25rem;
    align-items: start;
  }

  #hydraLandingRoot .hydra-mkt-store-primary {
    grid-column: 1;
    grid-row: 1;
  }

  #hydraLandingRoot .hydra-mkt-store-sidebar {
    grid-column: 2;
    grid-row: 1 / span 2;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    position: sticky;
    top: 58px;
    max-height: calc(100vh - 68px);
    overflow-y: auto;
    width: var(--store-sidebar-width-desktop);
    min-width: var(--store-sidebar-width-desktop);
  }

  #hydraLandingRoot .hydra-mkt-store-catalog {
    grid-column: 1;
    grid-row: 2;
  }
}

@media (min-width: 1100px) and (max-width: 1279px) {
  #hydraLandingRoot .hydra-mkt-store-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--store-sidebar-width);
    gap: 0 1rem;
    align-items: start;
  }

  #hydraLandingRoot .hydra-mkt-store-sidebar {
    grid-column: 2;
    grid-row: 1 / span 2;
    width: var(--store-sidebar-width);
    min-width: var(--store-sidebar-width);
  }
}

@media (min-width: 1600px) {
  #hydraLandingRoot .hydra-mkt--paper {
    --store-max-width: 1780px;
  }
}