/*
 * Copyright 2020 Adobe. All rights reserved.
 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. You may obtain a copy
 * of the License at http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
 * OF ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 */
/* custom */
.component-layout {
  max-width: 1568px;
  margin: 0 auto;
  padding: 0 64px;
  box-sizing: border-box;
}
@media screen and (max-width: 1024px) {
  .component-layout {
    max-width: 1504px;
    padding: 0 32px;
  }
}
@media screen and (max-width: 768px) {
  .component-layout {
    padding: 0 16px;
  }
}
main .section.rtk-responsive-flex {
  display: flex;
  flex-direction: row;
  gap: 35px;
}
main > .section.rtk-responsive-flex > div {
  margin: 0;
  flex-grow: 1;
}
main > .section.has-bg-img {
  position: relative;
}
main > .section.has-bg-img > picture.section-bg-picture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
main > .section.has-bg-img > picture.section-bg-picture > img.section-bg-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
main > .section.enable-mask {
  position: relative;
}
main > .section.enable-mask.enable-mask-dark {
  --linear-gradient: linear-gradient(269.74deg, rgba(0, 0, 0, 0.1) 1.66%, rgba(3, 5, 10, 0.1) 19.18%, rgba(6, 9, 18, 0.12) 29.93%, rgba(6, 9, 18, 0.2) 48.59%, #060913 98.36%), linear-gradient(90deg, rgba(7, 32, 70, 0.2) 69.91%, rgba(7, 32, 70, 0) 100%);
}
main > .section.enable-mask.enable-mask-light {
  --linear-gradient: linear-gradient(269.74deg, rgba(228, 228, 228, 0) 21%, #e4e4e4 93.25%);
}
main > .section.enable-mask::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--linear-gradient);
  z-index: -1;
}
main > .section.hide-section {
  display: none !important;
}
@media (width <= 1024px) {
  main .section.rtk-responsive-flex {
    flex-direction: column;
    gap: 0;
  }
}
main .section.fixed-width:not(.rtk-responsive-flex) > div,
main .section.fixed-width.rtk-responsive-flex {
  max-width: 1568px;
  margin: 0 auto;
  padding: 0 64px;
  box-sizing: border-box;
}
@media screen and (max-width: 1024px) {
  main .section.fixed-width:not(.rtk-responsive-flex) > div,
  main .section.fixed-width.rtk-responsive-flex {
    max-width: 1504px;
    padding: 0 32px;
  }
}
@media screen and (max-width: 768px) {
  main .section.fixed-width:not(.rtk-responsive-flex) > div,
  main .section.fixed-width.rtk-responsive-flex {
    padding: 0 16px;
  }
}
main .section.rtk-contact-card-container {
  display: flex;
  flex-direction: row;
  gap: 16px;
}
main .section.rtk-contact-card-container > .rtk-contact-card-wrapper {
  margin: 0;
  padding: 0;
  flex-grow: 1;
}
main:has(.cmp__anchor) div {
  scroll-margin: calc(var(--header-height) + 47px);
}
body.product-spec-no-support #supportSectionAnchorTab,
body.product-group-no-support #supportSectionAnchorTab,
body.product-spec-no-support #supportSection,
body.product-group-no-support #supportSection {
  display: none;
}
body.product-spec-show-support #productDetailSectionAnchorTab,
body.product-group-show-support #productDetailSectionAnchorTab,
body.product-spec-show-support #productDetailSection,
body.product-group-show-support #productDetailSection,
body.product-spec-show-support #orderingInformationSectionAnchorTab,
body.product-group-show-support #orderingInformationSectionAnchorTab,
body.product-spec-show-support #orderingInformationSection,
body.product-group-show-support #orderingInformationSection,
body.product-spec-show-support #technicalDocumentationSectionAnchorTab,
body.product-group-show-support #technicalDocumentationSectionAnchorTab,
body.product-spec-show-support #technicalDocumentationSection,
body.product-group-show-support #technicalDocumentationSection,
body.product-spec-show-support #designToolSectionAnchorTab,
body.product-group-show-support #designToolSectionAnchorTab,
body.product-spec-show-support #designToolSection,
body.product-group-show-support #designToolSection {
  display: none;
}
/* Custom styles for spec-list in feature and text component */
.spec-list {
  position: relative;
}
/* Reset */
.spec-list ul {
  margin: 0 !important;
  padding: 0 !important;
}
.spec-list li {
  margin: 6px 0 !important;
  overflow-wrap: anywhere !important;
}
/* Use custom markers */
.spec-list ul.lv1,
.spec-list ul.lv2,
.spec-list ul.lv3 {
  list-style: none !important;
}
.spec-list ul.lv2,
.spec-list ul.lv3 {
  margin-top: 6px !important;
}
/* ---- Key: lock the "first-line" metrics ----
Marker vertical position is based on this line-height,
NOT based on the whole li height (so nested ul won't break it).
*/
.spec-list {
  --lh: 1.4em;
  /* adjust if you want */
}
.spec-list li {
  line-height: var(--lh);
  /* ensure consistent baseline */
}
/* Shared marker behavior */
.spec-list ul.lv1 > li,
.spec-list ul.lv2 > li,
.spec-list ul.lv3 > li {
  position: relative;
}
.spec-list ul.lv1 > li::before,
.spec-list ul.lv2 > li::before,
.spec-list ul.lv3 > li::before {
  position: absolute;
  /* Put marker at the vertical middle of the FIRST text line */
  top: calc(var(--lh) / 2);
  transform: translateY(-50%);
  line-height: 1;
}
/* ========= Fixed "text start" ========= */
/* LV1: •  (text start = 18px) */
.spec-list ul.lv1 > li {
  padding-left: 18px;
}
.spec-list ul.lv1 > li::before {
  content: "•";
  left: 0;
}
/* LV2: "-" (text start = 24px requirement in your layout) */
.spec-list ul.lv2 > li {
  padding-left: 16px;
  margin: 4px 0;
}
.spec-list ul.lv2 > li::before {
  content: "-";
  left: 4px;
}
/* LV3: "-" (text start = 40px requirement in your layout) */
.spec-list ul.lv3 > li {
  padding-left: 24px;
  margin: 4px 0;
}
.spec-list ul.lv3 > li::before {
  content: "-";
  left: 12px;
}
@media screen and (min-width: 769px) {
  #bannerDescription .cmp__text-container {
    max-width: 65%;
  }
}
:root {
  /* colors */
  --background-color: white;
  --light-color: #f8f8f8;
  --dark-color: #505050;
  --text-color: #131313;
  --link-color: #3b63fb;
  --link-hover-color: #1d3ecf;
  /* fonts */
  --body-font-family: roboto, roboto-fallback, sans-serif;
  --heading-font-family: roboto-condensed, roboto-condensed-fallback, sans-serif;
  /* body sizes */
  --body-font-size-m: 22px;
  --body-font-size-s: 19px;
  --body-font-size-xs: 17px;
  /* heading sizes */
  --heading-font-size-xxl: 55px;
  --heading-font-size-xl: 44px;
  --heading-font-size-l: 34px;
  --heading-font-size-m: 27px;
  --heading-font-size-s: 24px;
  --heading-font-size-xs: 22px;
  /* nav height */
  --nav-height: 64px;
}
/* fallback fonts */
@font-face {
  font-family: roboto-condensed-fallback;
  size-adjust: 88.82%;
  src: local('Arial');
}
@font-face {
  font-family: roboto-fallback;
  size-adjust: 99.529%;
  src: local('Arial');
}
@media (width >= 900px) {
  :root {
    /* body sizes */
    --body-font-size-m: 18px;
    --body-font-size-s: 16px;
    --body-font-size-xs: 14px;
    /* heading sizes */
    --heading-font-size-xxl: 45px;
    --heading-font-size-xl: 36px;
    --heading-font-size-l: 28px;
    --heading-font-size-m: 22px;
    --heading-font-size-s: 20px;
    --heading-font-size-xs: 18px;
  }
}
body {
  display: none;
  margin: 0;
  background-color: var(--background-color);
  color: var(--text-color);
  font-family: var(--body-font-family);
  font-size: var(--body-font-size-m);
  line-height: 1.6;
}
body.appear {
  display: block;
}
header {
  height: var(--nav-height);
}
header .header,
footer .footer {
  visibility: hidden;
}
header .header[data-block-status="loaded"],
footer .footer[data-block-status="loaded"] {
  visibility: visible;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0.8em;
  margin-bottom: 0.25em;
  font-family: var(--heading-font-family);
  font-weight: 600;
  line-height: 1.25;
  scroll-margin: calc(var(--header-height) + 8px);
}
h1 {
  font-size: var(--heading-font-size-xxl);
}
h2 {
  font-size: var(--heading-font-size-xl);
}
h3 {
  font-size: var(--heading-font-size-l);
}
h4 {
  font-size: var(--heading-font-size-m);
}
h5 {
  font-size: var(--heading-font-size-s);
}
h6 {
  font-size: var(--heading-font-size-xs);
}
p,
dl,
ol,
ul,
pre,
blockquote {
  margin-top: 0.8em;
  margin-bottom: 0.25em;
}
code,
pre {
  font-size: var(--body-font-size-s);
}
pre {
  padding: 16px;
  border-radius: 8px;
  background-color: var(--light-color);
  overflow-x: auto;
  white-space: pre;
}
main > div {
  margin: 40px 16px;
}
input,
textarea,
select,
button {
  font: inherit;
}
/* links */
a:any-link {
  text-decoration: none;
  overflow-wrap: break-word;
}
/* buttons */
a.button:any-link,
button {
  box-sizing: border-box;
  display: inline-block;
  max-width: 100%;
  margin: 12px 0;
  border: 2px solid transparent;
  border-radius: 2.4em;
  padding: 0.5em 1.2em;
  font-family: var(--body-font-family);
  font-style: normal;
  font-weight: 500;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  background-color: var(--link-color);
  color: var(--background-color);
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
a.button:hover,
a.button:focus,
button:hover,
button:focus {
  background-color: var(--link-hover-color);
  cursor: pointer;
}
button:disabled,
button:disabled:hover {
  background-color: var(--light-color);
  cursor: unset;
}
a.button.secondary,
button.secondary {
  background-color: unset;
  border: 2px solid currentcolor;
  color: var(--text-color);
}
main img {
  max-width: 100%;
  width: auto;
  height: auto;
}
.icon {
  display: inline-block;
  height: 24px;
  width: 24px;
}
.icon img {
  height: 100%;
  width: 100%;
}
/* sections */
main > .section {
  /* margin: 40px 0; */
  margin: 0;
}
main > .section > div {
  /* max-width: 1200px; */
  margin: auto;
  /* padding: 0 24px; */
}
main > .section:first-of-type {
  /* margin-top: 0; */
}
@media (width >= 900px) {
  main > .section > div {
    /* padding: 0 32px; */
  }
}
/* section metadata */
main .section.light,
main .section.highlight {
  background-color: var(--light-color);
  margin: 0;
  padding: 40px 0;
}
/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  /* font: inherit; */
  vertical-align: baseline;
}
sup {
  vertical-align: super;
  font-size: smaller;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  margin: 0;
  vertical-align: baseline;
  border: 0;
  font-size: 100%;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
html {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-size: 16px;
}
.headline-1 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 900;
  font-size: 4rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .headline-1 {
    font-weight: 700;
    font-size: 3.5rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .headline-1 {
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.5;
  }
}
.headline-2 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 900;
  font-size: 3rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .headline-2 {
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .headline-2 {
    font-weight: 700;
    font-size: 1.75rem;
    line-height: 1.5;
  }
}
.headline-3 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .headline-3 {
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .headline-3 {
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.3;
  }
}
.headline-4 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .headline-4 {
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .headline-4 {
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.5;
  }
}
.headline-5 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .headline-5 {
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .headline-5 {
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1.43;
  }
}
.headline-6 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .headline-6 {
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .headline-6 {
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5;
  }
}
.subtitle-1 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .subtitle-1 {
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .subtitle-1 {
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5;
  }
}
.subtitle-2 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.43;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .subtitle-2 {
    font-size: 0.875rem;
    line-height: 1.43;
  }
}
@media (max-width: 768px) {
  .subtitle-2 {
    font-size: 0.875rem;
    line-height: 1.43;
  }
}
.body-1 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .body-1 {
    font-size: 1rem;
    line-height: 1.5;
  }
}
@media (max-width: 768px) {
  .body-1 {
    font-size: 1rem;
    line-height: 1.5;
  }
}
.body-2 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.43;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .body-2 {
    font-size: 0.875rem;
    line-height: 1.43;
  }
}
@media (max-width: 768px) {
  .body-2 {
    font-size: 0.875rem;
    line-height: 1.43;
  }
}
.caption {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 1.33;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .caption {
    font-size: 0.75rem;
    line-height: 1.33;
  }
}
@media (max-width: 768px) {
  .caption {
    font-size: 0.75rem;
    line-height: 1.33;
  }
}
.button {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.25;
}
@media (min-width: 769px) and (max-width: 1024px) {
  .button {
    font-size: 1rem;
    line-height: 1.25;
  }
}
@media (max-width: 768px) {
  .button {
    font-size: 1rem;
    line-height: 1.25;
  }
}
.f-16-500 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.4;
}
.f-14-100 {
  font-family: roboto, roboto-fallback, Arial, Helvetica, sans-serif;
  font-size: 0.875rem;
  font-weight: 100;
  line-height: 1.3;
}
.rt-white {
  color: #FFFFFF;
}
.rt-light-100 {
  color: #FDFEFE;
}
.rt-light-200 {
  color: #FCFDFD;
}
.rt-light-300 {
  color: #FBFCFC;
}
.rt-light-400 {
  color: #FAFBFC;
}
.rt-light-500 {
  color: #F9FAFB;
}
.rt-light-600 {
  color: #F8F9FA;
}
.rt-light-700 {
  color: #F7F9FA;
}
.rt-light-800 {
  color: #F6F8F9;
}
.rt-light-900 {
  color: #F5F6F8;
}
.rt-gray-100 {
  color: #F3F3F3;
}
.rt-gray-200 {
  color: #EBEBEB;
}
.rt-gray-300 {
  color: #E2E2E2;
}
.rt-gray-400 {
  color: #DCDCDC;
}
.rt-gray-500 {
  color: #D6D6D6;
}
.rt-gray-600 {
  color: #D1D1D1;
}
.rt-gray-700 {
  color: #CCCCCC;
}
.rt-gray-800 {
  color: #C6C6C6;
}
.rt-gray-900 {
  color: #BCBCBC;
}
.rt-blue-100 {
  color: #C2D8FC;
}
.rt-blue-200 {
  color: #95BAFE;
}
.rt-blue-300 {
  color: #C2D8FC;
}
.rt-blue-400 {
  color: #4E85EC;
}
.rt-blue-500 {
  color: #3C74C9;
}
.rt-blue-600 {
  color: #285EB0;
}
.rt-blue-700 {
  color: #18498F;
}
.rt-blue-800 {
  color: #0C3677;
}
.rt-blue-900 {
  color: #072B62;
}
.rt-light-blue-100 {
  color: #E6F7FA;
}
.rt-light-blue-200 {
  color: #BFEAF1;
}
.rt-light-blue-300 {
  color: #80D5E2;
}
.rt-light-blue-400 {
  color: #33BCD0;
}
.rt-light-blue-500 {
  color: #009EB8;
}
.rt-light-blue-600 {
  color: #2B89B8;
}
.rt-light-blue-700 {
  color: #1F6E9A;
}
.rt-light-blue-800 {
  color: #15536F;
}
.rt-light-blue-900 {
  color: #0D3A4D;
}
.rt-lime-100 {
  color: #F1F7D4;
}
.rt-lime-200 {
  color: #E2F1A7;
}
.rt-lime-300 {
  color: #D4EA7A;
}
.rt-lime-400 {
  color: #D6EE4F;
}
.rt-lime-500 {
  color: #CDE821;
}
.rt-lime-600 {
  color: #B7DC1C;
}
.rt-lime-700 {
  color: #B0C11A;
}
.rt-lime-800 {
  color: #81901A;
}
.rt-lime-900 {
  color: #596815;
}
.rt-green-100 {
  color: #C8EEC4;
}
.rt-green-200 {
  color: #A3E39D;
}
.rt-green-300 {
  color: #7ED775;
}
.rt-green-400 {
  color: #63CF58;
}
.rt-green-500 {
  color: #47C63A;
}
.rt-green-600 {
  color: #40C034;
}
.rt-green-700 {
  color: #37B92C;
}
.rt-green-800 {
  color: #2FB125;
}
.rt-green-900 {
  color: #20A418;
}
.rt-dark-100 {
  color: #C9CBCD;
}
.rt-dark-200 {
  color: #A5A8AC;
}
.rt-dark-300 {
  color: #81858B;
}
.rt-dark-400 {
  color: #666B72;
}
.rt-dark-500 {
  color: #4B5159;
}
.rt-dark-600 {
  color: #444A51;
}
.rt-dark-700 {
  color: #3B4048;
}
.rt-dark-800 {
  color: #33373E;
}
.rt-dark-900 {
  color: #23272E;
}
.rt-black-100 {
  color: #CFCFCF;
}
.rt-black-200 {
  color: #B0B0B0;
}
.rt-black-300 {
  color: #909090;
}
.rt-black-400 {
  color: #787878;
}
.rt-black-500 {
  color: #606060;
}
.rt-black-600 {
  color: #585858;
}
.rt-black-700 {
  color: #4E4E4E;
}
.rt-black-800 {
  color: #444444;
}
.rt-black-900 {
  color: #333333;
}
