.l85fm8l1-component {
  --primary: var(--themeColor1);
  --primary-hover: color-mix(in srgb, var(--themeColor1) 80%, #000000);
  --text-main: #1e293b;
  --text-muted: #cbd5e1;
  --border: #e2e8f0;
  --surface: #ffffff;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ease: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  box-sizing: border-box;
  color: var(--text-main);
  font-family: var(--font);
  margin-top: var(--section-margin-tb, 0);
  margin-bottom: var(--section-margin-tb, 0);
}
.l85fm8l1-component *, .l85fm8l1-component *::before, .l85fm8l1-component *::after { box-sizing: border-box; }
.l85fm8l1-component button, .l85fm8l1-component a { font: inherit; }
.l85fm8l1-component.application-section {
      width: 100%;
      padding: 38px 0 31px;
      background-color: var(--section-background-color, var(--surface));
      background-image: var(--section-background-image, none);
      background-position: var(--section-background-position, center);
      background-size: var(--section-background-size, cover);
      background-repeat: var(--section-background-repeat, no-repeat);
    }
.l85fm8l1-component .application-inner {
      box-sizing: border-box;
      width: 100%;
      max-width: var(--custom-content-max-width);
      margin: 0 auto;
      padding-left: var(--padding_lr);
      padding-right: var(--padding_lr);
      padding-top: var(--inner-padding-tb, 0);
      padding-bottom: var(--inner-padding-tb, 0);
    }
.l85fm8l1-component .section-header {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      margin-bottom: 36px;
    }
.l85fm8l1-component .heading-group { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 4px; }
.l85fm8l1-component .section-title {
      display: block;
      margin: 0;
      color: var(--text-color, var(--primary));
      font-size: var(--text-size, 32px);
      font-family: var(--text-family, inherit);
      font-weight: var(--text-weight, 800);
      font-style: var(--text-font-style, normal);
      text-decoration: var(--text-decoration, none);
      line-height: var(--text-line-height, 1.1);
      letter-spacing: var(--text-letter-spacing, 1.5px);
      text-align: var(--text-align, left);
      text-transform: var(--text-transform, uppercase);
    }
.l85fm8l1-component .section-title:hover { color: var(--text-hover-color, var(--text-color, var(--primary))); }
.l85fm8l1-component .section-title:hover { font-size: var(--text-hover-size, var(--text-size, 32px)); font-family: var(--text-hover-family, var(--text-family, inherit)); }
.l85fm8l1-component .section-subtitle:hover { font-size: var(--text-hover-size, var(--text-size, 18px)); font-family: var(--text-hover-family, var(--text-family, inherit)); }
.l85fm8l1-component .section-subtitle {
      margin: 0;
      display: block;
      color: var(--text-color, var(--text-main));
      font-size: var(--text-size, 18px);
      font-family: var(--text-family, inherit);
      font-weight: var(--text-weight, 600);
      font-style: var(--text-font-style, normal);
      text-decoration: var(--text-decoration, none);
      line-height: var(--text-line-height, 1.6);
      letter-spacing: var(--text-letter-spacing, 0);
      text-align: var(--text-align, left);
      text-transform: var(--text-transform, capitalize);
    }
.l85fm8l1-component .section-subtitle:hover { color: var(--text-hover-color, var(--text-color, var(--text-main))); }
.l85fm8l1-component .section-subtitle::after {
      content: "";
      display: inline-block;
      width: 48px;
      height: 2px;
      margin-left: 12px;
      vertical-align: middle;
      background: var(--primary);
    }
.l85fm8l1-component .brochure-action {
      min-height: 37px;
      padding: 8px 20px;
      border: 0;
      border-radius: 4px;
      display: block;
      color: var(--action-color, #ffffff);
      background: var(--button-background, var(--primary));
      text-decoration: var(--action-text-decoration, none);
      font-size: var(--action-font-size, 13.5px);
      font-family: var(--action-font-family, inherit);
      text-align: var(--action-text-align, left);
      text-transform: var(--action-text-transform, none);
      font-weight: var(--action-font-weight, 600);
      font-style: var(--action-font-style, normal);
      line-height: var(--action-line-height, 1.6);
      letter-spacing: var(--action-letter-spacing, 0);
      transition: var(--ease);
      cursor: pointer;
    }
.l85fm8l1-component .brochure-action:hover, .l85fm8l1-component .brochure-action:focus-visible {
      color: var(--action-hover-color, var(--action-color, #ffffff));
      font-size: var(--action-hover-font-size, var(--action-font-size, 13.5px));
      font-family: var(--action-hover-font-family, var(--action-font-family, inherit));
      background: var(--button-hover-background, var(--primary-hover));
      box-shadow: 0 4px 14px color-mix(in srgb, var(--primary) 35%, transparent);
      transform: translateY(-2px);
      outline: none;
    }
.l85fm8l1-component .action-icon { display: inline-block; width: var(--action-icon-size, 16px); height: var(--action-icon-size, 16px); margin-left: 8px; font-size: var(--action-icon-size, 16px); line-height: 1; vertical-align: middle; }
.l85fm8l1-component .action-icon:not(.action-icon-image) { color: var(--action-icon-color, #ffffff); }
.l85fm8l1-component .action-icon-image { object-fit: contain; }
.l85fm8l1-component .brochure-action:hover .action-icon:not(.action-icon-image), .l85fm8l1-component .brochure-action:focus-visible .action-icon:not(.action-icon-image) { color: var(--action-icon-hover-color, #ffffff); }
.l85fm8l1-component .application-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
      gap: 32px;
      align-items: stretch;
    }
.l85fm8l1-component .visual-stage {
      position: relative;
      align-self: start;
      display: grid;
      width: 100%;
      min-width: 0;
      overflow: hidden;
      border-radius: 12px;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }
.l85fm8l1-component .visual-stage::before { content: ''; grid-area: 1 / 1; min-width: 0; aspect-ratio: var(--image-ratio, 3 / 2); }
.l85fm8l1-component .sector-panels { position: relative; grid-area: 1 / 1; display: grid; min-width: 0; }
.l85fm8l1-component .sector-panel { position: relative; grid-area: 1 / 1; display: grid; grid-template-rows: repeat(2, minmax(min-content, 1fr)); row-gap: var(--navigation-button-size, 44px); min-width: 0; opacity: 0; visibility: hidden; transition: opacity 0.3s ease; }
.l85fm8l1-component .sector-panel.active { opacity: 1; visibility: visible; }
.l85fm8l1-component .sector-image-frame { position: absolute; inset: 0; overflow: hidden; border-radius: var(--image-shape, 0%); }
.l85fm8l1-component .sector-image {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: var(--image-fit, cover);
      border-radius: inherit;
      display: block;
      transition: transform 0.6s ease;
    }
.l85fm8l1-component .visual-stage:hover .sector-panel.active .sector-image { transform: scale(1.03); }
.l85fm8l1-component .sector-overlay {
      position: relative;
      z-index: 1;
      grid-row: 2;
      align-self: end;
      padding: 32px 28px 26px;
      color: #ffffff;
      --overlay-gradient-top: rgba(15, 23, 42, 0);
      --overlay-gradient-middle: rgba(15, 23, 42, 0.88);
      --overlay-gradient-bottom: rgba(15, 23, 42, 0.96);
      background: var(--image-overlay-background, linear-gradient(180deg, var(--overlay-gradient-top) 0%, var(--overlay-gradient-middle) 35%, var(--overlay-gradient-bottom) 100%));
    }
.l85fm8l1-component .sector-badge {
      display: block;
      width: 100%;
      margin: 0 0 10px;
      color: var(--badge-color, #ffffff);
      font-size: var(--badge-size, 12px);
      font-family: var(--badge-family, inherit);
      text-align: var(--badge-align, left);
      font-weight: var(--badge-weight, 700);
      font-style: var(--badge-font-style, normal);
      text-decoration: var(--badge-decoration, none);
      line-height: var(--badge-line-height, 1.6);
      letter-spacing: var(--badge-letter-spacing, 0.5px);
      text-transform: var(--badge-transform, uppercase);
    }
.l85fm8l1-component .sector-badge > span { display: inline-block; padding: 4px 12px; border-radius: 4px; background: var(--badge-background, var(--primary)); }
.l85fm8l1-component .sector-badge:hover { color: var(--badge-hover-color, var(--badge-color, #ffffff)); font-size: var(--badge-hover-size, var(--badge-size, 12px)); font-family: var(--badge-hover-family, var(--badge-family, inherit)); }
.l85fm8l1-component .sector-title { display: block; width: 100%; margin: 0 0 8px; color: var(--title-color, #ffffff); font-size: var(--title-size, 21px); font-family: var(--title-family, inherit); font-weight: var(--title-weight, 700); font-style: var(--title-font-style, normal); text-decoration: var(--title-decoration, none); line-height: var(--title-line-height, 1.35); letter-spacing: var(--title-letter-spacing, 0); text-align: var(--title-align, left); text-transform: var(--title-transform, none); }
.l85fm8l1-component .sector-title:hover { color: var(--title-hover-color, var(--title-color, #ffffff)); font-size: var(--title-hover-size, var(--title-size, 21px)); font-family: var(--title-hover-family, var(--title-family, inherit)); }
.l85fm8l1-component .sector-description { display: block; width: 100%; margin: 0 0 14px; color: var(--description-color, var(--text-muted)); font-size: var(--description-size, 13.5px); font-family: var(--description-family, inherit); font-weight: var(--description-weight, 400); font-style: var(--description-font-style, normal); text-decoration: var(--description-decoration, none); line-height: var(--description-line-height, 1.55); letter-spacing: var(--description-letter-spacing, 0); text-align: var(--description-align, left); text-transform: var(--description-transform, none); }
.l85fm8l1-component .sector-description:hover { color: var(--description-hover-color, var(--description-color, var(--text-muted))); font-size: var(--description-hover-size, var(--description-size, 13.5px)); font-family: var(--description-hover-family, var(--description-family, inherit)); }
.l85fm8l1-component .chemical-list { display: flex; flex-wrap: wrap; gap: 8px; }
.l85fm8l1-component .chemical {
      display: block;
      min-width: 0;
      max-width: 100%;
      margin: 0;
      padding: 3px 10px;
      border: 1px solid rgba(255, 255, 255, 0.22);
      border-radius: 20px;
      color: var(--chemical-color, #f8fafc);
      font-family: var(--chemical-family, inherit);
      background: var(--chemical-background, rgba(255, 255, 255, 0.16));
      backdrop-filter: blur(4px);
      font-size: var(--chemical-size, 12px);
      font-weight: var(--chemical-weight, 400);
      font-style: var(--chemical-font-style, normal);
      text-decoration: var(--chemical-decoration, none);
      text-align: var(--chemical-align, left);
      text-transform: var(--chemical-transform, none);
      line-height: var(--chemical-line-height, 1.6);
      letter-spacing: var(--chemical-letter-spacing, 0);
      overflow-wrap: anywhere;
    }

.l85fm8l1-component .chemical:hover { color: var(--chemical-hover-color, var(--chemical-color, #f8fafc)); background: var(--chemical-hover-background, var(--chemical-background, rgba(255, 255, 255, 0.16))); font-size: var(--chemical-hover-size, var(--chemical-size, 12px)); font-family: var(--chemical-hover-family, var(--chemical-family, inherit)); }
.l85fm8l1-component .nav-button {
      position: absolute;
      top: 50%;
      z-index: 5;
      width: var(--navigation-button-size, 44px);
      height: var(--navigation-button-size, 44px);
      padding: 0;
      border-width: var(--navigation-border-width, 1px);
      border-style: var(--navigation-border-style, solid);
      border-color: var(--navigation-border-color, rgba(255, 255, 255, 0.3));
      border-radius: var(--navigation-border-radius, 50%);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--navigation-color, #ffffff);
      background: var(--navigation-background, var(--primary));
      backdrop-filter: blur(4px);
      transform: translateY(-50%);
      cursor: pointer;
      transition: var(--ease);
    }
.l85fm8l1-component .nav-button:hover, .l85fm8l1-component .nav-button:focus-visible { color: var(--navigation-hover-color, var(--navigation-color, #ffffff)); background: var(--navigation-hover-background, var(--primary)); border-color: var(--navigation-border-hover-color, var(--navigation-border-color, rgba(255, 255, 255, 0.3))); transform: translateY(-50%) scale(1.1); outline: none; }
.l85fm8l1-component .nav-prev { left: 18px; }
.l85fm8l1-component .nav-next { right: 18px; }
.l85fm8l1-component .nav-icon { font-size: var(--navigation-icon-size, 28px); font-weight: 300; line-height: 1; transform: translateY(-1px); }
.l85fm8l1-component .pagination {
      position: absolute;
      z-index: 6;
      top: 20px;
      right: 20px;
      display: flex;
      align-items: center;
      gap: 6px;
    }
.l85fm8l1-component .page-indicator {
      width: 8px;
      height: 8px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.4);
      cursor: pointer;
      transition: var(--ease);
    }
.l85fm8l1-component .page-indicator:hover { background: rgba(255, 255, 255, 0.7); }
.l85fm8l1-component .page-indicator.active { width: 24px; border-radius: 4px; background: #ffffff; }
.l85fm8l1-component .page-indicator:focus-visible { outline: 2px solid #ffffff; outline-offset: 3px; }
.l85fm8l1-component .sector-tabs {
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 12px;
    }
.l85fm8l1-component .sector-tab {
      position: relative;
      min-height: 0;
      flex: 1 1 0%;
      width: 100%;
      padding: 18px 24px;
      overflow: hidden;
      border: 1px solid var(--border);
      border-radius: 4px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      color: var(--text-main);
      background: #ffffff;
      text-align: left;
      cursor: pointer;
      transition: var(--ease);
    }
.l85fm8l1-component .sector-tab:hover { border-color: #94a3b8; background: #f8fafc; transform: translateX(4px); }
.l85fm8l1-component .sector-tab:focus-visible { outline: 2px solid var(--selection-accent, var(--primary)); outline-offset: 2px; }
.l85fm8l1-component .sector-tab.active { padding-right: 68px; border-color: var(--selection-accent, var(--primary)); color: #ffffff; background: var(--selection-accent, var(--primary)); box-shadow: 0 8px 20px color-mix(in srgb, var(--selection-accent, var(--primary)) 22%, transparent); }
.l85fm8l1-component .tab-copy { display: block; flex: 1; min-width: 0; }
.l85fm8l1-component .tab-name { display: block; color: inherit; font-family: var(--tab-name-family, inherit); font-size: var(--tab-name-size, 16px); font-weight: var(--tab-name-weight, 600); font-style: var(--tab-name-font-style, normal); text-decoration: var(--tab-name-decoration, none); text-align: var(--tab-name-align, left); text-transform: var(--tab-name-transform, none); line-height: var(--tab-name-line-height, 1.6); letter-spacing: var(--tab-name-letter-spacing, 0); }
.l85fm8l1-component .sector-tab.active .tab-name { color: var(--tab-name-color, #ffffff); }
.l85fm8l1-component .sector-tab:hover .tab-name { font-size: var(--tab-name-hover-size, var(--tab-name-size, 16px)); font-family: var(--tab-name-hover-family, var(--tab-name-family, inherit)); }
.l85fm8l1-component .sector-tab.active:hover .tab-name { color: var(--tab-name-hover-color, var(--tab-name-color, #ffffff)); }
.l85fm8l1-component .tab-detail { display: none; max-width: 100%; margin-top: 2px; color: inherit; font-family: var(--tab-detail-family, inherit); font-size: var(--tab-detail-size, 12px); font-weight: var(--tab-detail-weight, 400); font-style: var(--tab-detail-font-style, normal); text-decoration: var(--tab-detail-decoration, none); text-align: var(--tab-detail-align, left); text-transform: var(--tab-detail-transform, none); line-height: var(--tab-detail-line-height, 1.6); letter-spacing: var(--tab-detail-letter-spacing, 0); opacity: 0.85; }
.l85fm8l1-component .sector-tab.active .tab-detail { display: block; color: var(--tab-detail-color, #ffffff); }
.l85fm8l1-component .sector-tab:hover .tab-detail { font-size: var(--tab-detail-hover-size, var(--tab-detail-size, 12px)); font-family: var(--tab-detail-hover-family, var(--tab-detail-family, inherit)); }
.l85fm8l1-component .sector-tab.active:hover .tab-detail { color: var(--tab-detail-hover-color, var(--tab-detail-color, #ffffff)); }
.l85fm8l1-component .tab-icon { display: none; position: absolute; right: 24px; top: 50%; width: 32px; height: 32px; align-items: center; justify-content: center; color: #ffffff; font-size: 30px; line-height: 1; opacity: 0.4; transform: translateY(-50%); }
.l85fm8l1-component .tab-icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.l85fm8l1-component .sector-tab.active .tab-icon { display: flex; }
.l85fm8l1-component .sr-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

    @media (max-width: 992px) {
.l85fm8l1-component .application-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 960px) {
.l85fm8l1-component .application-inner { padding-left: 1rem; padding-right: 1rem; }
    }

    @media (max-width: 768px) {
.l85fm8l1-component.application-section { padding: 64px 0; }
.l85fm8l1-component .section-header { align-items: flex-start; flex-direction: column; gap: 18px; margin-bottom: 28px; }
.l85fm8l1-component .heading-group { width: 100%; }
.l85fm8l1-component .section-title { font-size: var(--text-mobile-size, var(--text-size, 26px)); }
.l85fm8l1-component .brochure-action { width: 100%; white-space: normal; }
.l85fm8l1-component .brochure-action { font-size: var(--action-mobile-font-size, var(--action-font-size, 13.5px)); }
.l85fm8l1-component .application-grid { gap: 28px; }
.l85fm8l1-component .visual-stage { min-height: 320px; }
.l85fm8l1-component .sector-panel { display: flex; flex-direction: column; justify-content: flex-end; padding-top: calc(40px + var(--navigation-button-size, 44px)); }
.l85fm8l1-component .sector-overlay { align-self: stretch; flex-shrink: 0; margin-top: auto; }
.l85fm8l1-component .sector-overlay { padding: 72px 20px 22px; }
.l85fm8l1-component .sector-badge { font-size: var(--badge-mobile-size, var(--badge-size, 12px)); }
.l85fm8l1-component .sector-title { font-size: var(--title-mobile-size, var(--title-size, 19px)); overflow-wrap: anywhere; }
.l85fm8l1-component .sector-description { max-width: 100%; font-size: var(--description-mobile-size, var(--description-size, 13px)); }
.l85fm8l1-component .nav-button { top: 24px; transform: none; }
.l85fm8l1-component .nav-button:hover, .l85fm8l1-component .nav-button:focus-visible { transform: none; }
.l85fm8l1-component .nav-prev { left: 16px; }
.l85fm8l1-component .nav-next { left: calc(24px + var(--navigation-button-size, 44px)); right: auto; }
.l85fm8l1-component .pagination { top: 38px; right: 16px; }
.l85fm8l1-component .sector-tab { min-height: 64px; padding: 14px 16px; flex: none; }
    }

    @media (max-width: 360px) {
.l85fm8l1-component .visual-stage { min-height: 420px; }
    }

@media (max-width: 768px) { .l85fm8l1-component .section-title, .l85fm8l1-component .section-subtitle { font-size: var(--text-mobile-size, var(--text-size, inherit)); } }
@media (max-width: 768px) { .l85fm8l1-component .chemical { font-size: var(--chemical-mobile-size, var(--chemical-size, 12px)); } }
@media (max-width: 768px) { .l85fm8l1-component .tab-name { font-size: var(--tab-name-mobile-size, var(--tab-name-size, 16px)); } .l85fm8l1-component .tab-detail { font-size: var(--tab-detail-mobile-size, var(--tab-detail-size, 12px)); } }
@media (max-width: 768px) {
  .l85fm8l1-component .section-title:hover,
  .l85fm8l1-component .section-subtitle:hover { font-size: var(--text-hover-size, var(--text-mobile-size, var(--text-size, inherit))); }
  .l85fm8l1-component .brochure-action:hover,
  .l85fm8l1-component .brochure-action:focus-visible { font-size: var(--action-hover-font-size, var(--action-mobile-font-size, var(--action-font-size, 13.5px))); }
  .l85fm8l1-component .sector-badge:hover { font-size: var(--badge-hover-size, var(--badge-mobile-size, var(--badge-size, 12px))); }
  .l85fm8l1-component .sector-title:hover { font-size: var(--title-hover-size, var(--title-mobile-size, var(--title-size, 19px))); }
  .l85fm8l1-component .sector-description:hover { font-size: var(--description-hover-size, var(--description-mobile-size, var(--description-size, 13px))); }
  .l85fm8l1-component .chemical:hover { font-size: var(--chemical-hover-size, var(--chemical-mobile-size, var(--chemical-size, 12px))); }
  .l85fm8l1-component .sector-tab:hover .tab-name { font-size: var(--tab-name-hover-size, var(--tab-name-mobile-size, var(--tab-name-size, 16px))); }
  .l85fm8l1-component .sector-tab:hover .tab-detail { font-size: var(--tab-detail-hover-size, var(--tab-detail-mobile-size, var(--tab-detail-size, 12px))); }
}
