/* Home page layout alignment, scoped to WordPress front page ID 7. */
body.page-id-7 .elementor-7 {
  --sh-layout-max: 1440px;
  --sh-layout-gutter: clamp(20px, 3.5vw, 56px);
  --sh-section-space: clamp(48px, 5vw, 72px);
}

/* Elementor's 50%-wide HTML widgets and mixed 1140px/full-width inner
   containers are the source of the different section left edges. */
body.page-id-7 .elementor-7 .sh-home-module {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding-inline: 0 !important;
}

body.page-id-7 .elementor-7 .sh-home-module > .e-con-inner {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding-inline: 0 !important;
}

body.page-id-7 .elementor-7 .sh-home-module > .e-con-inner > .elementor-widget {
  align-self: stretch;
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

/* With the widgets now full width, their previous 100vw/negative-margin
   breakout is no longer needed and otherwise shifts content to the left. */
body.page-id-7 .elementor-7 .st-cert,
body.page-id-7 .elementor-7 .fc-section,
body.page-id-7 .elementor-7 .shc-intro,
body.page-id-7 .elementor-7 .shc-cf7-wrap {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* One content width and one gutter across the product, certification,
   collection, capability and contact modules. */
body.page-id-7 .elementor-7 .sh-products__poster-content,
body.page-id-7 .elementor-7 .sh-products__grid,
body.page-id-7 .elementor-7 .st-cert__shell,
body.page-id-7 .elementor-7 .fc-shell,
body.page-id-7 .elementor-7 .shc-shell,
body.page-id-7 .elementor-7 .shc-cf7-wrap > .shc-cf7-panel {
  width: 100%;
  max-width: var(--sh-layout-max);
  margin-left: auto;
  margin-right: auto;
}

body.page-id-7 .elementor-7 .sh-products__poster-content,
body.page-id-7 .elementor-7 .sh-products__grid,
body.page-id-7 .elementor-7 .st-cert__shell,
 {
  padding-left: var(--sh-layout-gutter) !important;
  padding-right: var(--sh-layout-gutter) !important;
}

/* The form is a separate Elementor shortcode widget; align its panel to
   the capability panel above without adding an extra nested gutter. */
body.page-id-7 .elementor-7 .shc-cf7-wrap {
  padding-left: var(--sh-layout-gutter) !important;
  padding-right: var(--sh-layout-gutter) !important;
  padding-bottom: var(--sh-section-space) !important;
}

body.page-id-7 .elementor-7 .shc-cf7-panel {
  max-width: none;
}

/* Research and the manufacturing split use their own root wrappers.
   Keep their full-bleed backgrounds while matching the shared text edge. */
body.page-id-7 .elementor-7 .fd-section {
  width: 100%;
  max-width: var(--sh-layout-max);
  margin-inline: auto;
  padding-left: var(--sh-layout-gutter) !important;
  padding-right: var(--sh-layout-gutter) !important;
  padding-top: var(--sh-section-space) !important;
  padding-bottom: var(--sh-section-space) !important;
}

body.page-id-7 .elementor-7 .au-section {
  width: 100%;
  max-width: var(--sh-layout-max);
  margin-inline: auto;
}

body.page-id-7 .elementor-7 .au-intro {
  padding-left: var(--sh-layout-gutter) !important;
  padding-right: var(--sh-layout-gutter) !important;
}

body.page-id-7 .elementor-7 .au-right {
  padding-left: var(--sh-layout-gutter) !important;
  padding-right: var(--sh-layout-gutter) !important;
}

/* Regularize transitions without changing each module's internal grid. */
body.page-id-7 .elementor-7 .sh-products__grid {
  padding-bottom: clamp(44px, 4vw, 60px) !important;
}

body.page-id-7 .elementor-7 .st-cert {
  padding-top: var(--sh-section-space) !important;
  padding-bottom: var(--sh-section-space) !important;
}

body.page-id-7 .elementor-7 .fc-section {
  padding-top: var(--sh-section-space) !important;
  padding-bottom: var(--sh-section-space) !important;
}

body.page-id-7 .elementor-7 .shc-intro {
  padding-top: var(--sh-section-space) !important;
}

@media (max-width: 900px) {
  body.page-id-7 .elementor-7 {
    --sh-layout-gutter: clamp(20px, 4vw, 32px);
    --sh-section-space: clamp(40px, 6vw, 56px);
  }

  body.page-id-7 .elementor-7 .fd-section {
    padding-top: var(--sh-section-space) !important;
    padding-bottom: var(--sh-section-space) !important;
  }
}

@media (max-width: 600px) {
  body.page-id-7 .elementor-7 {
    --sh-layout-gutter: 20px;
    --sh-section-space: 44px;
  }

  body.page-id-7 .elementor-7 .sh-products__poster-content,
  body.page-id-7 .elementor-7 .sh-products__grid {
    padding-left: var(--sh-layout-gutter) !important;
    padding-right: var(--sh-layout-gutter) !important;
  }

  body.page-id-7 .elementor-7 .sh-products__grid {
    padding-bottom: 44px !important;
  }

  body.page-id-7 .elementor-7 .au-intro,
  body.page-id-7 .elementor-7 .au-right {
    padding-left: var(--sh-layout-gutter) !important;
    padding-right: var(--sh-layout-gutter) !important;
  }

  body.page-id-7 .elementor-7 .shc-intro {
    padding-top: 40px !important;
  }

  body.page-id-7 .elementor-7 .shc-cf7-wrap {
    padding-bottom: 44px !important;
  }
}

/* Keep the research/design composition side-by-side on laptops and tablets.
   The widget's own 1180px breakpoint stacks it while both columns still fit. */
@media (min-width: 700px) and (max-width: 1180px) {
  body.page-id-7 .elementor-7 .fd-layout {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    gap: clamp(20px, 2.6vw, 34px);
  }

  body.page-id-7 .elementor-7 .fd-right {
    padding: 0 clamp(14px, 1.8vw, 24px) 44px;
  }

  body.page-id-7 .elementor-7 .fd-design-content {
    padding: clamp(28px, 3vw, 44px) clamp(8px, 1.6vw, 20px) 0;
  }

  body.page-id-7 .elementor-7 .fd-design-list {
    gap: 14px;
    margin-top: clamp(28px, 3vw, 45px);
    padding-left: 0;
  }

  body.page-id-7 .elementor-7 .fd-small-images {
    gap: 12px;
    margin-top: clamp(28px, 3vw, 48px);
    padding-inline: 0;
  }

  body.page-id-7 .elementor-7 .fd-objectives {
    padding: clamp(20px, 2.5vw, 32px);
  }
}

@media (min-width: 700px) and (max-width: 900px) {
  body.page-id-7 .elementor-7 .fd-design-content h3 span:last-child {
    padding-left: 0;
  }
}

/* The manufacturing split also stacks too early at 1100px.  Below 851px
   its three-image grid and text need the full width, so retain that stack. */
@media (min-width: 851px) and (max-width: 1100px) {
  body.page-id-7 .elementor-7 .au-section {
    grid-template-columns: minmax(0, 40%) minmax(0, 60%);
  }

  body.page-id-7 .elementor-7 .au-left {
    display: flex;
    flex-direction: column;
  }

  body.page-id-7 .elementor-7 .au-intro {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding-top: 32px;
    padding-bottom: 32px;
  }

  body.page-id-7 .elementor-7 .au-factory {
    margin-top: 0 !important;
  }

  body.page-id-7 .elementor-7 .au-right {
    padding-top: 32px;
    padding-bottom: 36px;
  }

  body.page-id-7 .elementor-7 .au-image-grid {
    gap: 10px;
  }
}
