/* scode=15 Page Art Direction. Public PageModule variants own their internal visuals. */
.solution-category-v2-page { min-width: 0; }
.adminbuy_img.is-solution-category-v2-hidden { display: none; }

.solution-category-v2-page .solution-category-v2 {
  margin-top: 81px;
}

.solution-category-v2 {
  --solution-category-section-space: clamp(72px, 7.2vw, 104px);
  overflow: clip;
  color: var(--ui-color-text);
  background: var(--ui-color-page);
}

.solution-category-v2__breadcrumb-bar {
  background: color-mix(in srgb, var(--ui-color-surface) 92%, transparent);
}

.solution-category-v2__hero {
  --solution-category-hero-overlay-strength: 1;
  --solution-category-hero-image-position: center;
  --solution-category-hero-eyebrow-color: var(--ui-color-accent);
  --solution-category-hero-eyebrow-size: var(--ui-type-eyebrow-size);
  --solution-category-hero-title-color: var(--ui-color-on-accent);
  --solution-category-hero-title-size: 50px;
  --solution-category-hero-title-weight: var(--ui-weight-heavy);
  --solution-category-hero-description-color: rgba(255, 255, 255, .78);
  --solution-category-hero-description-size: var(--ui-type-section-description-size, 16px);
  position: relative;
  min-height: clamp(560px, 61vh, 680px);
  display: grid;
  align-items: center;
  isolation: isolate;
  overflow: hidden;
  background: var(--ui-color-text-strong);
}

.solution-category-v2__hero::before,
.solution-category-v2__hero::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
}

.solution-category-v2__hero::before {
  background:
    linear-gradient(90deg,
      rgb(6 18 34 / calc(.96 * var(--solution-category-hero-overlay-strength))) 0%,
      rgb(6 18 34 / calc(.82 * var(--solution-category-hero-overlay-strength))) 42%,
      rgb(6 18 34 / calc(.34 * var(--solution-category-hero-overlay-strength))) 72%,
      rgb(6 18 34 / calc(.22 * var(--solution-category-hero-overlay-strength))) 100%),
    linear-gradient(180deg,
      rgb(6 18 34 / calc(.12 * var(--solution-category-hero-overlay-strength))),
      rgb(6 18 34 / calc(.38 * var(--solution-category-hero-overlay-strength))));
}

.solution-category-v2__hero[data-hero-align="center"]::before {
  background:
    linear-gradient(90deg,
      rgb(6 18 34 / calc(.76 * var(--solution-category-hero-overlay-strength))),
      rgb(6 18 34 / calc(.58 * var(--solution-category-hero-overlay-strength))) 50%,
      rgb(6 18 34 / calc(.76 * var(--solution-category-hero-overlay-strength)))),
    linear-gradient(180deg,
      rgb(6 18 34 / calc(.12 * var(--solution-category-hero-overlay-strength))),
      rgb(6 18 34 / calc(.38 * var(--solution-category-hero-overlay-strength))));
}

.solution-category-v2__hero[data-hero-align="right"]::before {
  background:
    linear-gradient(270deg,
      rgb(6 18 34 / calc(.96 * var(--solution-category-hero-overlay-strength))) 0%,
      rgb(6 18 34 / calc(.82 * var(--solution-category-hero-overlay-strength))) 42%,
      rgb(6 18 34 / calc(.34 * var(--solution-category-hero-overlay-strength))) 72%,
      rgb(6 18 34 / calc(.22 * var(--solution-category-hero-overlay-strength))) 100%),
    linear-gradient(180deg,
      rgb(6 18 34 / calc(.12 * var(--solution-category-hero-overlay-strength))),
      rgb(6 18 34 / calc(.38 * var(--solution-category-hero-overlay-strength))));
}

.solution-category-v2__hero::after {
  left: auto;
  width: min(43vw, 620px);
  background:
    linear-gradient(135deg, transparent 0 48%, color-mix(in srgb, var(--ui-color-accent) 38%, transparent) 48.1% 48.35%, transparent 48.45%),
    linear-gradient(135deg, transparent 0 63%, rgba(255, 255, 255, .18) 63.05% 63.18%, transparent 63.3%);
  opacity: .62;
}

.solution-category-v2__hero-image {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--solution-category-hero-image-position);
}

.solution-category-v2__hero[data-hero-image-position="left"] { --solution-category-hero-image-position: left center; }
.solution-category-v2__hero[data-hero-image-position="center"] { --solution-category-hero-image-position: center; }
.solution-category-v2__hero[data-hero-image-position="right"] { --solution-category-hero-image-position: right center; }

.solution-category-v2__hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(240px, 5fr);
  align-items: center;
  min-height: inherit;
  padding-block: var(--ui-space-20);
}

.solution-category-v2__hero-copy {
  grid-column: 1;
  max-width: 780px;
}

.solution-category-v2__hero[data-hero-align="center"] .solution-category-v2__hero-copy,
.solution-category-v2__hero[data-hero-align="right"] .solution-category-v2__hero-copy {
  grid-column: 1 / -1;
}

.solution-category-v2__hero[data-hero-align="center"] .solution-category-v2__hero-copy {
  margin-inline: auto;
  text-align: center;
}

.solution-category-v2__hero[data-hero-align="right"] .solution-category-v2__hero-copy {
  margin-left: auto;
  text-align: right;
}

.solution-category-v2__hero .ui-eyebrow {
  margin-bottom: var(--ui-space-5);
  color: var(--solution-category-hero-eyebrow-color);
  background: color-mix(in srgb, var(--solution-category-hero-eyebrow-color) 14%, transparent);
  font-size: var(--solution-category-hero-eyebrow-size);
}

.solution-category-v2__hero h1 {
  max-width: 760px;
  margin: 0;
  color: var(--solution-category-hero-title-color);
  font-size: clamp(min(38px, var(--solution-category-hero-title-size)), 5vw, var(--solution-category-hero-title-size));
  font-weight: var(--solution-category-hero-title-weight);
}

.solution-category-v2__hero .ui-lead {
  max-width: 740px;
  margin: var(--ui-space-6) 0 0;
  color: var(--solution-category-hero-description-color);
  font-size: var(--solution-category-hero-description-size);
}

.solution-category-v2__hero[data-hero-align="center"] :is(h1, .ui-lead) { margin-inline: auto; }
.solution-category-v2__hero[data-hero-align="right"] :is(h1, .ui-lead) { margin-left: auto; }

.solution-category-v2 > .page-module {
  --page-module-section-padding: var(--solution-category-section-space);
  --page-module-header-gap: clamp(40px, 4.6vw, 64px);
}

.solution-category-v2 > .page-module:not(.page-module--cta)::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  content: "";
}

.solution-category-v2 > .page-module > .page-module__container {
  position: relative;
  z-index: 1;
}

.solution-category-v2 > .page-module:is(#solution-category-overview, #solution-category-needs, #solution-category-modules, #solution-category-cases, #solution-category-faq) {
  --page-module-page-background: var(--ui-section-bg-ambient-wash);
}

.solution-category-v2 > .page-module:is(#solution-category-scenes, #solution-category-guide, #solution-category-articles, #solution-category-services) {
  --page-module-page-background: var(--ui-section-bg-brand-gradient);
}

.solution-category-v2 > .page-module:is(#solution-category-scenes, #solution-category-articles, #solution-category-services)::before {
  background:
    linear-gradient(135deg, transparent 0 74%, color-mix(in srgb, var(--ui-color-accent) 8%, transparent) 74.05% 74.18%, transparent 74.25%),
    linear-gradient(90deg, color-mix(in srgb, var(--ui-color-border) 28%, transparent) 1px, transparent 1px);
  background-size: auto, 80px 100%;
  opacity: .46;
}

.solution-category-v2 #solution-category-overview .page-module__container {
  display: grid;
  grid-template-columns: minmax(280px, 5fr) minmax(0, 7fr);
  align-items: start;
  gap: clamp(48px, 7vw, 112px);
}

.solution-category-v2 #solution-category-overview .page-module__header {
  position: sticky;
  top: 104px;
  margin: 0;
  text-align: left;
}

.solution-category-v2 #solution-category-overview .page-module__grid--image-text { grid-template-columns: minmax(0, 1fr); }
.solution-category-v2 #solution-category-overview .page-module-card { grid-column: 1 / -1 !important; }

.solution-category-v2 #solution-category-articles .page-module__container,
.solution-category-v2 #solution-category-faq .page-module__container { max-width: 1120px; }

.solution-category-v2 #solution-category-services .page-module__container { max-width: 1180px; }

.solution-category-v2 #solution-category-cta {
  --page-module-section-padding: clamp(56px, 6vw, 84px);
}

@media (max-width: 1024px) {
  .solution-category-v2 { --solution-category-section-space: clamp(64px, 8vw, 84px); }
  .solution-category-v2__hero { min-height: 560px; }
  .solution-category-v2__hero-inner { grid-template-columns: minmax(0, 4fr) minmax(180px, 1fr); }
  .solution-category-v2 #solution-category-overview .page-module__container {
    grid-template-columns: minmax(240px, 4fr) minmax(0, 6fr);
    gap: var(--ui-space-12);
  }
}

@media (max-width: 767px) {
  .solution-category-v2-page .solution-category-v2 { margin-top: 0; }
  .solution-category-v2 { --solution-category-section-space: 56px; }
  .solution-category-v2__hero {
    --solution-category-hero-image-position: 62% center;
    min-height: 500px;
    align-items: end;
  }
  .solution-category-v2__hero::before {
    background: linear-gradient(180deg, rgba(6, 18, 34, .32) 0%, rgba(6, 18, 34, .74) 42%, rgba(6, 18, 34, .98) 100%);
  }
  .solution-category-v2__hero::after { width: 76vw; opacity: .42; }
  .solution-category-v2__hero-inner { display: block; min-height: 0; padding-block: 144px var(--ui-space-12); }
  .solution-category-v2__hero-copy { max-width: none; }
  .solution-category-v2__hero h1 { max-width: 11em; }
  .solution-category-v2__hero .ui-lead {
    margin-top: var(--ui-space-5);
    font-size: min(var(--solution-category-hero-description-size), var(--ui-text-md));
  }
  .solution-category-v2 > .page-module { --page-module-header-gap: var(--ui-space-10); }
  .solution-category-v2 #solution-category-overview .page-module__container { display: block; }
  .solution-category-v2 #solution-category-overview .page-module__header {
    position: static;
    margin: 0 auto var(--ui-space-10);
    text-align: center;
  }
  .solution-category-v2 #solution-category-articles .page-module__container,
  .solution-category-v2 #solution-category-faq .page-module__container,
  .solution-category-v2 #solution-category-services .page-module__container { max-width: var(--ui-container-max); }
  .solution-category-v2 > .page-module:is(#solution-category-scenes, #solution-category-articles, #solution-category-services)::before {
    background-size: auto, 48px 100%;
    opacity: .3;
  }
  .solution-category-v2 #solution-category-cta { --page-module-section-padding: 48px; }
}

@media (max-width: 399px) {
  .solution-category-v2__hero { min-height: 480px; }
  .solution-category-v2__hero-inner { padding-bottom: var(--ui-space-10); }
}

/*
 * Overview keeps its established split composition when left-aligned.
 * Center places the shared module header above the body, while right mirrors
 * the split without changing the public image_text DOM or card styling.
 */
@media (min-width: 768px) {
  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:center"] .page-module__container {
    display: block;
  }

  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:center"] .page-module__header {
    position: static;
    margin: 0 auto var(--page-module-header-gap);
    text-align: center;
  }

  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:center"] .page-module__intro {
    margin-right: auto;
    margin-left: auto;
  }

  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:right"] .page-module__container {
    grid-template-columns: minmax(0, 7fr) minmax(280px, 5fr);
  }

  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:right"] .page-module__header {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    text-align: right;
  }

  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:right"] .page-module__intro {
    margin-right: 0;
    margin-left: auto;
  }

  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:right"] .page-module__grid--image-text {
    grid-column: 1;
    grid-row: 1;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .solution-category-v2 #solution-category-overview[style*="--page-module-title-align:right"] .page-module__container {
    grid-template-columns: minmax(0, 6fr) minmax(240px, 4fr);
  }
}

/* Approved mobile H1 delta 2026-09-23. All preceding frozen CSS stays byte-identical. */
@media (max-width: 767px) {
  .solution-category-v2__hero h1 {
    font-size: min(var(--solution-category-hero-title-size, 50px), 26px);
    line-height: 1.4;
  }
}

@media (max-width: 360px) {
  .solution-category-v2__hero h1 {
    font-size: min(var(--solution-category-hero-title-size, 50px), 24px);
  }
}