/* Cibomio — large / ultra-wide viewport enhancements (1920px+).
   Loaded globally after km-brand.css; does not affect mobile/tablet. */

@media (min-width: 1920px) {
  :root {
    --km-container: 1680px;
    --km-container-narrow: 1400px;
    --km-page-gutter: clamp(24px, 2.5vw, 48px);
  }

  html {
    font-size: 17px;
  }

  /* Header */
  .km-h1,
  .km-h2-inner,
  .km-mega__inner {
    max-width: var(--km-container);
    padding-left: var(--km-page-gutter);
    padding-right: var(--km-page-gutter);
  }

  .km-logo {
    font-size: clamp(38px, 2.1vw, 44px);
  }

  .km-h2-inner .km-nav-link {
    font-size: 14px;
  }

  .km-header-spacer {
    height: 128px;
  }

  /* Catalog & product grids */
  .km-catalog-page {
    max-width: var(--km-container) !important;
    padding: 24px var(--km-page-gutter);
  }

  .km-rec-grid,
  .km-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 22px;
  }

  .km-browse-sidebar {
    width: 300px;
    top: 156px;
  }

  .km-browse-head__title {
    font-size: clamp(30px, 2.2vw, 38px);
  }

  /* Content pages */
  .km-page,
  .km-pdp,
  .km-pdp-details,
  .km-pdp-recs {
    max-width: var(--km-container-narrow);
    padding-left: var(--km-page-gutter);
    padding-right: var(--km-page-gutter);
  }

  .km-about-page {
    max-width: 1440px;
  }

  .km-info-page {
    max-width: 920px;
  }

  .km-account-page {
    max-width: 1280px;
    padding-left: var(--km-page-gutter);
    padding-right: var(--km-page-gutter);
  }

  .km-business-page {
    max-width: var(--km-container-narrow);
  }

  .km-membership-page .km-membership-plans,
  .km-membership-page .km-membership-benefits {
    max-width: var(--km-container);
  }

  .km-couriers-page,
  .km-courier-page {
    max-width: 960px;
  }

  .km-blog-page {
    max-width: var(--km-container-narrow);
  }

  /* Auth — slightly larger but still narrow */
  .km-auth-page {
    max-width: 520px;
    padding: 40px var(--km-page-gutter) 64px;
  }

  .km-auth-page h1 {
    font-size: clamp(28px, 2vw, 34px);
  }

  /* Footer */
  .km-footer__inner {
    max-width: var(--km-container-narrow);
    padding-left: var(--km-page-gutter);
    padding-right: var(--km-page-gutter);
  }

  .km-footer__logo {
    font-size: 28px;
  }

  /* Homepage (testmain) */
  .km-testmain__main {
    max-width: 840px;
  }

  .km-testmain__stack {
    max-width: clamp(560px, 42vw, 680px);
    padding: clamp(36px, 3vw, 48px) clamp(28px, 2.5vw, 40px) clamp(28px, 2.5vw, 36px);
  }

  .km-testmain__stack::before {
    border-radius: clamp(32px, 2.5vw, 44px);
    width: calc(100% + clamp(48px, 4vw, 72px));
    height: calc(100% + clamp(46px, 4vw, 64px));
    min-width: 0;
    min-height: 0;
  }

  .km-testmain__logo-cibomio-line {
    font-size: clamp(52px, 4vw, 64px);
  }

  .km-testmain__tagline {
    font-size: clamp(18px, 1.4vw, 22px);
  }
}

@media (min-width: 2560px) {
  :root {
    --km-container: 1920px;
    --km-container-narrow: 1600px;
  }

  html {
    font-size: 18px;
  }

  .km-rec-grid,
  .km-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 24px;
  }

  .km-catalog-page {
    max-width: var(--km-container) !important;
  }

  .km-h1,
  .km-h2-inner,
  .km-mega__inner {
    max-width: var(--km-container);
  }

  .km-page,
  .km-pdp,
  .km-pdp-details,
  .km-pdp-recs {
    max-width: var(--km-container-narrow);
  }

  .km-about-page {
    max-width: 1600px;
  }

  .km-account-page {
    max-width: 1440px;
  }

  .km-footer__inner {
    max-width: var(--km-container-narrow);
  }

  .km-testmain__main {
    max-width: 960px;
  }

  .km-testmain__stack {
    max-width: clamp(600px, 38vw, 760px);
  }
}

@media (min-width: 3840px) {
  :root {
    --km-container: 2200px;
    --km-container-narrow: 1800px;
    --km-page-gutter: clamp(32px, 2vw, 64px);
  }

  html {
    font-size: 19px;
  }

  .km-rec-grid,
  .km-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 28px;
  }

  .km-h1,
  .km-h2-inner,
  .km-mega__inner,
  .km-catalog-page,
  .km-page,
  .km-pdp,
  .km-pdp-details,
  .km-pdp-recs,
  .km-footer__inner {
    max-width: var(--km-container);
  }

  .km-page,
  .km-pdp,
  .km-pdp-details,
  .km-pdp-recs,
  .km-account-page,
  .km-about-page,
  .km-business-page {
    max-width: var(--km-container-narrow);
  }
}