/*
 * Solution Subcategory / Level-3 Framework V1 Page Art Direction.
 * Public PageModule variants own card, feed, process, FAQ and CTA visuals.
 */
.solution-subcategory-v1-page { min-width: 0; }
.adminbuy_img.is-solution-subcategory-v1-hidden { display: none; }

.solution-subcategory-v1-page .solution-subcategory-v1 {
  margin-top: 81px;
}

.solution-subcategory-v1 {
  --solution-subcategory-section-space: clamp(68px, 6.8vw, 96px);
  overflow: clip;
  color: var(--ui-color-text);
  background: var(--ui-color-page);
}

.solution-subcategory-v1__breadcrumb-bar {
  background: color-mix(in srgb, var(--ui-color-surface) 94%, transparent);
}

.solution-subcategory-v1__hero {
  --solution-subcategory-hero-background:
    radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--ui-color-accent) 18%, transparent), transparent 32%),
    linear-gradient(135deg, #071426 0%, #0b1d34 54%, #10283e 100%);
  --solution-subcategory-hero-overlay-strength: 1;
  --solution-subcategory-hero-eyebrow-color: var(--ui-color-accent);
  --solution-subcategory-hero-eyebrow-size: var(--ui-type-eyebrow-size);
  --solution-subcategory-hero-title-inherit-color: var(--ui-color-on-accent);
  --solution-subcategory-hero-title-color: var(--solution-subcategory-hero-title-inherit-color);
  --solution-subcategory-hero-title-size: 50px;
  --solution-subcategory-hero-title-weight: var(--ui-weight-heavy);
  --solution-subcategory-hero-description-inherit-color: rgba(255, 255, 255, .76);
  --solution-subcategory-hero-description-color: var(--solution-subcategory-hero-description-inherit-color);
  --solution-subcategory-hero-description-size: var(--ui-type-section-description-size, 16px);
  --solution-subcategory-hero-image-position: center;
  --solution-subcategory-hero-grid-color: color-mix(in srgb, #fff 5%, transparent);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--solution-subcategory-hero-background);
}

.solution-subcategory-v1__hero[data-hero-background="white"] {
  --solution-subcategory-hero-background: var(--ui-color-surface);
}

.solution-subcategory-v1__hero[data-hero-background="surface"] {
  --solution-subcategory-hero-background: var(--ui-color-surface-muted);
}

.solution-subcategory-v1__hero[data-hero-background="accent-soft"] {
  --solution-subcategory-hero-background: color-mix(in srgb, var(--ui-color-accent) 9%, #fff);
}

.solution-subcategory-v1__hero[data-hero-foreground="dark"] {
  --solution-subcategory-hero-title-inherit-color: var(--ui-color-text-strong);
  --solution-subcategory-hero-description-inherit-color: var(--ui-color-text-muted);
  --solution-subcategory-hero-grid-color: color-mix(in srgb, var(--ui-color-text-strong) 6%, transparent);
}

.solution-subcategory-v1__hero::before,
.solution-subcategory-v1__hero::after {
  position: absolute;
  z-index: -1;
  pointer-events: none;
  content: "";
}

.solution-subcategory-v1__hero::before {
  inset: 0;
  background:
    linear-gradient(135deg, transparent 0 64%, color-mix(in srgb, var(--ui-color-accent) 28%, transparent) 64.06% 64.2%, transparent 64.28%),
    linear-gradient(90deg, var(--solution-subcategory-hero-grid-color) 1px, transparent 1px);
  background-size: auto, 96px 100%;
  opacity: .66;
}

.solution-subcategory-v1__hero::after {
  top: 12%;
  right: -8%;
  width: min(46vw, 680px);
  aspect-ratio: 1;
  border: 1px solid color-mix(in srgb, var(--ui-color-accent) 28%, transparent);
  border-radius: 50%;
  box-shadow: 0 0 0 84px color-mix(in srgb, var(--ui-color-accent) 4%, transparent);
}

.solution-subcategory-v1__hero-inner {
  display: grid;
  min-height: clamp(520px, 58vh, 640px);
  align-items: center;
  grid-template-columns: minmax(0, 6.5fr) minmax(320px, 5.5fr);
  gap: clamp(44px, 6vw, 96px);
  padding-block: clamp(72px, 8vw, 112px);
}

.solution-subcategory-v1__hero-copy {
  max-width: 720px;
}

.solution-subcategory-v1__hero[data-hero-align="center"] .solution-subcategory-v1__hero-copy {
  justify-self: center;
  text-align: center;
}

.solution-subcategory-v1__hero[data-hero-align="center"] .solution-subcategory-v1__hero-actions {
  justify-content: center;
}

.solution-subcategory-v1__hero[data-hero-align="right"] .solution-subcategory-v1__hero-copy {
  justify-self: end;
  text-align: right;
}

.solution-subcategory-v1__hero[data-hero-align="right"] .solution-subcategory-v1__hero-actions {
  justify-content: flex-end;
}

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

.solution-subcategory-v1__hero h1 {
  max-width: 12em;
  margin: 0;
  color: var(--solution-subcategory-hero-title-color);
  font-size: clamp(min(40px, var(--solution-subcategory-hero-title-size)), 5vw, var(--solution-subcategory-hero-title-size));
  font-weight: var(--solution-subcategory-hero-title-weight);
  line-height: 1.08;
  letter-spacing: -.035em;
}

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

.solution-subcategory-v1__hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ui-space-3);
  margin-top: var(--ui-space-8);
}

.solution-subcategory-v1__hero[data-hero-foreground="light"] .ui-button--outline {
  color: rgba(255, 255, 255, .9);
  background: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .28);
}

.solution-subcategory-v1__hero[data-hero-foreground="light"] .ui-button--outline:hover {
  color: var(--ui-color-on-accent);
  background: color-mix(in srgb, var(--ui-color-accent) 16%, transparent);
  border-color: color-mix(in srgb, var(--ui-color-accent) 72%, white);
}

.solution-subcategory-v1__hero[data-hero-foreground="light"] .ui-button--ghost {
  color: rgba(255, 255, 255, .9);
}

.solution-subcategory-v1__hero[data-hero-foreground="light"] .ui-button--ghost:hover {
  color: var(--ui-color-on-accent);
  background: color-mix(in srgb, var(--ui-color-accent) 16%, transparent);
}

.solution-subcategory-v1__hero .ui-button--text,
.solution-subcategory-v1__hero .ui-button--text:hover {
  color: var(--ui-color-accent);
}

.solution-subcategory-v1__hero-visual {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: color-mix(in srgb, var(--ui-color-accent) 10%, #071426);
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: var(--ui-radius-xl);
  box-shadow: var(--ui-shadow-xl);
}

.solution-subcategory-v1__hero-visual::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 56%, rgb(3 12 24 / calc(.82 * var(--solution-subcategory-hero-overlay-strength))));
  content: "";
}

.solution-subcategory-v1__hero-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--solution-subcategory-hero-image-position);
}

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

.solution-subcategory-v1__hero-visual figcaption {
  position: absolute;
  right: var(--ui-space-5);
  bottom: var(--ui-space-5);
  left: var(--ui-space-5);
  z-index: 1;
  color: rgba(255, 255, 255, .76);
  font-size: var(--ui-text-xs);
  font-weight: var(--ui-weight-medium);
  letter-spacing: .08em;
}

.solution-subcategory-v1 > .page-module {
  --page-module-section-padding: var(--solution-subcategory-section-space);
  --page-module-header-gap: clamp(36px, 4.2vw, 56px);
}

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

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

/* The fixed snapshot is an image-free three-item summary. Its default Cards
   expression should follow the real copy height instead of inheriting the
   shared media-card body minimum. */
.solution-subcategory-v1 #solution-subcategory-summary.page-module--cards.is-variant-default .page-module-card__body {
  min-height: 0;
}

.solution-subcategory-v1 > .page-module:is(
  #solution-subcategory-summary,
  #solution-subcategory-solutions,
  #solution-subcategory-system,
  #solution-subcategory-services
) {
  --page-module-page-background: var(--ui-section-bg-ambient-wash);
}

.solution-subcategory-v1 > .page-module:is(
  #solution-subcategory-siblings,
  #solution-subcategory-points,
  #solution-subcategory-products,
  #solution-subcategory-cases,
  #solution-subcategory-faq
) {
  --page-module-page-background: var(--ui-section-bg-brand-gradient);
}

.solution-subcategory-v1 > .page-module:is(
  #solution-subcategory-solutions,
  #solution-subcategory-cases,
  #solution-subcategory-services
)::before {
  background:
    linear-gradient(135deg, transparent 0 78%, color-mix(in srgb, var(--ui-color-accent) 7%, transparent) 78.05% 78.18%, transparent 78.26%),
    linear-gradient(90deg, color-mix(in srgb, var(--ui-color-border) 26%, transparent) 1px, transparent 1px);
  background-size: auto, 88px 100%;
  opacity: .42;
}

.solution-subcategory-v1 #solution-subcategory-solutions .page-module__container,
.solution-subcategory-v1 #solution-subcategory-cases .page-module__container,
.solution-subcategory-v1 #solution-subcategory-services .page-module__container,
.solution-subcategory-v1 #solution-subcategory-faq .page-module__container {
  max-width: 1160px;
}

.solution-subcategory-v1 #solution-subcategory-cta {
  --page-module-section-padding: clamp(52px, 5.4vw, 76px);
}

@media (max-width: 1024px) {
  .solution-subcategory-v1 {
    --solution-subcategory-section-space: clamp(60px, 7.2vw, 80px);
  }

  .solution-subcategory-v1__hero-inner {
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
    gap: var(--ui-space-10);
  }

  .solution-subcategory-v1__hero h1 {
    font-size: clamp(min(40px, var(--solution-subcategory-hero-title-size)), 5.6vw, min(58px, var(--solution-subcategory-hero-title-size)));
  }
}

@media (max-width: 767px) {
  .solution-subcategory-v1-page .solution-subcategory-v1 { margin-top: 0; }

  .solution-subcategory-v1 {
    --solution-subcategory-section-space: 56px;
  }

  .solution-subcategory-v1__hero-inner {
    min-height: 0;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--ui-space-8);
    padding-block: var(--ui-space-12);
  }

  .solution-subcategory-v1__hero h1 {
    max-width: 10em;
    font-size: clamp(min(36px, var(--solution-subcategory-hero-title-size)), 11vw, min(48px, var(--solution-subcategory-hero-title-size)));
  }

  .solution-subcategory-v1__hero .ui-lead {
    margin-top: var(--ui-space-5);
    font-size: min(var(--solution-subcategory-hero-description-size), var(--ui-text-md));
  }

  .solution-subcategory-v1__hero-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    margin-top: var(--ui-space-7);
  }

  .solution-subcategory-v1__hero-actions .ui-button { width: 100%; }

  .solution-subcategory-v1__hero-visual {
    aspect-ratio: 16 / 10;
    border-radius: var(--ui-radius-lg);
  }

  .solution-subcategory-v1__hero::after {
    top: 42%;
    width: 88vw;
  }

  .solution-subcategory-v1 > .page-module {
    --page-module-header-gap: var(--ui-space-8);
  }

  .solution-subcategory-v1 > .page-module:is(
    #solution-subcategory-solutions,
    #solution-subcategory-cases,
    #solution-subcategory-services
  )::before {
    background-size: auto, 48px 100%;
    opacity: .28;
  }

  .solution-subcategory-v1 #solution-subcategory-cta {
    --page-module-section-padding: 48px;
  }
}

@media (max-width: 399px) {
  .solution-subcategory-v1__hero-inner { padding-block: var(--ui-space-10); }
  .solution-subcategory-v1__hero h1 { font-size: min(35px, var(--solution-subcategory-hero-title-size)); }
}

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

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