/* Inner pages share the homepage's two desktop widths: 1280px for content,
   1480px for broad visual and technical sections. Full-bleed backgrounds stay full width. */
@media (min-width: 1201px) {
  /* Keep hero content on the same reading edge as the homepage. */
  body:not(.home) :is(
    .ct-about-hero,
    .ct-contact-hero,
    .ct-help-hero,
    .ct-blog-hero,
    .ct-solutions-hero
  ) {
    height: 600px;
  }

  body.ct-static-domain .ct-static-domain-main :is(.about3-banner,.about5-banner,.about6-banner)
  :is(.about3-banner-text,.about5-banner-text,.about6-banner-text) {
    left: max(6.25%, calc((100% - 1280px) / 2));
    padding-left: 0 !important;
  }

  body.ct-static-domain .ct-privacy-hero .ct-privacy-wrap {
    box-sizing: border-box;
    width: min(87.5%, 1280px);
    max-width: 1280px;
    padding-inline: 0;
  }

  body.vx-tech-page .vx-tech-header {
    padding-left: max(0px, calc(
      max(6.25vw, (100vw - 1280px) / 2) -
      max(4vw, (100vw - 1480px) / 2) - 1px
    ));
  }

  body:not(.home) .cs1-product-page .cs1-hero {
    grid-template-columns: minmax(0, 540px) minmax(0, 660px);
    gap: clamp(36px, 4.167vw, 80px);
  }

  body.ct-product-domain .ct-product-domain-main .product-list-banner .product-list-banner-content,
  body.ct-product-domain .ct-product-domain-main .product-collection-banner .product-collection-banner-text {
    left: max(6.25%, calc((100% - 1280px) / 2));
  }

  body.ct-catalog-page .ct-catalog-hero-grid {
    padding-left: calc(
      max(6.25vw, (100vw - 1280px) / 2) -
      max(4vw, (100vw - 1480px) / 2)
    );
  }

  body.ct-product-domain .ct-product-domain-main .product-list-banner,
  body.ct-product-domain .ct-product-domain-main .product-collection-banner,
  body.ct-catalog-page .ct-catalog-hero {
    height: 600px;
  }

  body.ct-product-domain .ct-product-domain-main .product-collection-banner,
  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner {
    overflow: hidden;
  }

  /* Category images have their own 8:3 ratio; fill the hero height as well. */
  body.ct-product-domain .ct-product-domain-main .product-collection-banner .product-collection-banner-wrapper {
    height: 100%;
  }

  body.ct-product-domain .ct-product-domain-main .product-collection-banner .product-collection-banner-image {
    display: block;
    width: 100%;
    height: 100% !important;
    min-height: 0;
    aspect-ratio: auto;
    object-fit: cover;
  }

  /* The overview photo kept its 8:3 intrinsic ratio and covered the next section. */
  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-wrapper,
  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-wrapper > picture {
    display: block;
    height: 100%;
    min-height: 0;
  }

  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-image {
    display: block;
    width: 100%;
    height: 100% !important;
    min-height: 0;
    aspect-ratio: auto;
    object-fit: cover;
  }

  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-content {
    top: 42%;
    bottom: auto;
  }

  body.ct-product-domain .cs1-category .ct-product-domain-main .vortex-product-sections {
    padding-left: 0;
  }

  body:not(.home) :is(
    .ct-about-shell,
    .ct-contact-shell,
    .ct-help-shell,
    .ct-blog-shell,
    .ct-longform-shell,
    .ct-solutions-shell,
    .ct-catalog-shell,
    .cs1-buy-paths,
    .cs1-source-overview,
    .cs1-guide-links,
    .cs1-buyer-choice-grid,
    .cs1-package-grid,
    .four-items-container,
    .vortex-app-module,
    .vortex-app2-module,
    .vortex-structure-container,
    .more-about-container,
    .faq-content,
    .ct-support-intro,
    .ct-support-list,
    .ct-industry-track,
    .ct-process-list,
    .ct-input-panel
  ) {
    box-sizing: border-box;
    width: min(87.5%, 1280px);
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
  }

  body:not(.home) :is(
    .new-feature-container,
    .service-advantages-container,
    .cs1-browser-layout,
    .ct-catalog-entry--overview,
    .cta-background-wrapper,
    .cs1-model-selector,
    .cs1-cta-scene,
    .vortex-product-section,
    .vortex-bimg-module,
    .performance-module-container,
    .cta-module-2-container,
    .ct-catalog-hero-grid,
    .ct-catalog-inside-grid,
    .ct-blog-cta,
    .vx-tech-shell
  ) {
    box-sizing: border-box;
    width: min(92%, 1480px);
    max-width: 1480px;
    margin-left: auto;
    margin-right: auto;
  }

  body:not(.home) .ct-footer .footer-container {
    box-sizing: border-box;
    width: min(87.5%, 1280px);
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1600px) {
  body:not(.home) :is(
    .ct-about-hero,
    .ct-contact-hero,
    .ct-help-hero,
    .ct-blog-hero,
    .ct-solutions-hero
  ) {
    height: min(37.5vw, 680px);
  }

  body.ct-product-domain .ct-product-domain-main .product-list-banner,
  body.ct-product-domain .ct-product-domain-main .product-collection-banner,
  body.ct-catalog-page .ct-catalog-hero {
    height: min(37.5vw, 680px);
  }

  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-content {
    top: 48%;
  }
}

@media (max-width: 767px) {
  body:not(.home) .cs1-product-page .cs1-hero {
    padding-inline: 20px;
  }

  body:not(.home) :is(
    .ct-about-hero-copy,
    .ct-contact-hero-copy,
    .ct-help-hero-copy,
    .ct-blog-hero-inner,
    .ct-solutions-hero-copy,
    .ct-longform-header-inner
  ) {
    box-sizing: border-box;
    width: calc(100% - 40px);
    margin-inline: auto;
  }

  body.ct-static-domain .ct-static-domain-main :is(.about3-banner,.about5-banner,.about6-banner)
  :is(.about3-banner-text,.about5-banner-text,.about6-banner-text) {
    left: 20px;
    width: calc(100% - 40px);
    max-width: calc(100% - 40px);
    padding-left: 0 !important;
  }

  body.ct-static-domain .ct-privacy-hero .ct-privacy-wrap {
    box-sizing: border-box;
    width: calc(100% - 40px);
    padding-inline: 0;
  }

  body.vx-tech-page .vx-tech-header {
    padding-left: 9px;
  }

  body.ct-product-domain .ct-product-domain-main .product-list-banner .product-list-banner-content,
  body.ct-product-domain .ct-product-domain-main .product-collection-banner .product-collection-banner-text {
    left: 20px;
    max-width: calc(100% - 40px);
  }

  body.ct-catalog-page .ct-catalog-hero-grid {
    width: calc(100% - 40px);
  }
}

/* The homepage switches to a centered 88%-wide hero line at tablet width. */
@media (min-width: 577px) and (max-width: 1200px) {
  body:not(.home) {
    --vx-hero-edge: 6.25vw;
  }

  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner {
    height: min(80vh, 680px);
  }

  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-wrapper,
  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-wrapper > picture {
    display: block;
    height: 100%;
    min-height: 0;
  }

  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-image {
    width: 100%;
    height: 100% !important;
    min-height: 0;
    aspect-ratio: auto;
    object-fit: cover;
  }

  body.ct-overview-stage1 .ct-product-domain-main .product-list-banner .product-list-banner-content {
    top: 42%;
    bottom: auto;
  }

  body.ct-product-domain .ct-product-domain-main .product-list-banner .product-list-banner-content,
  body.ct-product-domain .ct-product-domain-main .product-collection-banner .product-collection-banner-text {
    left: var(--vx-hero-edge);
    max-width: calc(100% - 2 * var(--vx-hero-edge));
  }

  body.ct-catalog-page .ct-catalog-hero-grid,
  body:not(.home) :is(
    .ct-about-hero-copy,
    .ct-contact-hero-copy,
    .ct-help-hero-copy,
    .ct-blog-hero-inner,
    .ct-solutions-hero-copy,
    .ct-longform-header-inner
  ) {
    box-sizing: border-box;
    width: calc(100% - 2 * var(--vx-hero-edge));
    margin-inline: auto;
  }

  body.ct-static-domain .ct-static-domain-main :is(.about3-banner,.about5-banner,.about6-banner)
  :is(.about3-banner-text,.about5-banner-text,.about6-banner-text) {
    left: var(--vx-hero-edge);
    max-width: calc(100% - 2 * var(--vx-hero-edge));
    padding-left: 0 !important;
  }

  body.ct-static-domain .ct-privacy-hero .ct-privacy-wrap {
    box-sizing: border-box;
    width: calc(100% - 2 * var(--vx-hero-edge));
    max-width: 1280px;
    padding-inline: 0;
  }

  body.vx-tech-page .vx-tech-header {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    box-sizing: border-box;
    width: calc(100vw - 2 * var(--vx-hero-edge));
    padding-left: 0;
  }
}

@media (min-width: 577px) and (max-width: 768px) {
  body:not(.home) {
    --vx-hero-edge: max(20px, calc((100vw - min(88vw, 620px)) / 2));
  }

  body:not(.home) .cs1-product-page .cs1-hero {
    padding-inline: var(--vx-hero-edge);
  }
}

@media (max-width: 576px) {
  body.vx-tech-page .vx-tech-header {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    box-sizing: border-box;
    width: calc(100vw - 40px);
    padding-left: 0;
  }
}