.pd_hero {
  padding: 8rem 0px 10rem;
  background-color: #fff;
}
.pd_hero .content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8rem;
}
.pd_hero .gallery {
  flex-shrink: 0;
  width: 64rem;
}
.pd_hero .stage {
  position: relative;
  overflow: hidden;
  border-radius: 2.4rem;
  background-color: var(--light2);
}
.pd_hero .stage .swiper-slide {
  background-color: var(--light2);
}
.pd_hero .stage a {
  display: block;
  aspect-ratio: 1 / 0.92;
  padding: 4rem;
  cursor: zoom-in;
}
.pd_hero .stage img {
  mix-blend-mode: multiply;
  transition: transform 0.35s ease;
}
/* hover zoom (revision 4, see pd2-pd_hero.js): image magnified around the cursor */
.pd_hero .stage a {
  overflow: hidden;
}
.pd_hero .stage a.zoom img {
  transform: scale(2.2);
  transition: transform 0.2s ease-out;
}
.pd_hero .zoom_hint {
  position: absolute;
  right: 2.4rem;
  top: 2.4rem;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  height: 3.6rem;
  padding: 0px 1.6rem 0px 1.2rem;
  border-radius: 1.8rem;
  color: var(--title);
  background-color: rgba(255, 255, 255, 0.86);
  box-shadow: 0px 0.6rem 1.6rem rgba(4, 17, 45, 0.08);
  font-weight: 500;
  font-size: 1.3rem;
  pointer-events: none;
  transition: opacity 0.3s;
}
.pd_hero .zoom_hint::before {
  content: '';
  width: 1.6rem;
  height: 1.6rem;
  background-color: var(--primary);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 3.5 3.5M7 4.8v4.4M4.8 7h4.4'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 3.5 3.5M7 4.8v4.4M4.8 7h4.4'/%3E%3C/svg%3E") no-repeat center / contain;
}
.pd_hero .stage.zooming .zoom_hint,
.pd_hero .stage.zooming .count,
.pd_hero .stage.zooming .swiper_btns {
  opacity: 0;
}
.pd_hero .count,
.pd_hero .stage .swiper_btns {
  transition: opacity 0.3s;
}
.pd_hero .count {
  position: absolute;
  left: 2.8rem;
  bottom: 2.6rem;
  z-index: 2;
  color: var(--text2);
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 2rem;
}
.pd_hero .count em {
  color: var(--title);
  font-weight: 700;
}
.pd_hero .stage .swiper_btns {
  position: absolute;
  right: 2.4rem;
  bottom: 2.4rem;
  z-index: 2;
  gap: 1rem;
}
.pd_hero .thumbs {
  margin-top: 1.6rem;
}
.pd_hero .thumbs .swiper-slide {
  width: calc((100% - 3.6rem) / 4);
  aspect-ratio: 1 / 0.86;
  padding: 1rem;
  overflow: hidden;
  cursor: pointer;
  border-radius: 1.4rem;
  border: 1px solid transparent;
  background-color: var(--light2);
  transition: border-color 0.3s;
}
.pd_hero .thumbs .img {
  height: 100%;
}
.pd_hero .thumbs .swiper-slide img {
  mix-blend-mode: multiply;
}
.pd_hero .thumbs .swiper-slide:hover,
.pd_hero .thumbs .swiper-slide-thumb-active {
  border-color: var(--primary);
}
.pd_hero .info {
  flex: 1;
  max-width: 64rem;
}
.pd_hero .tcon .cat {
  display: inline-block;
  padding: 0.6rem 1.4rem;
  border-radius: 2rem;
  color: var(--primary);
  background-color: rgba(11, 61, 135, 0.09);
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 1.8rem;
}
.pd_hero .tcon h1 {
  margin-top: 1.8rem;
  font-size: 5rem;
  line-height: 5.8rem;
}
.pd_hero .tcon h1 + p {
  margin-top: 2rem;
  font-size: 1.7rem;
  line-height: 2.8rem;
}
.pd_hero .points {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.4rem 2.4rem;
  margin-top: 2.8rem;
  padding-top: 2.8rem;
  border-top: 1px solid var(--line);
}
.pd_hero .points li {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  color: var(--title);
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.pd_hero .points i {
  flex-shrink: 0;
  width: 2.2rem;
  height: 2.2rem;
  margin-top: 0.1rem;
  border-radius: 50%;
  background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 4.2 3.8 7 9 1'/%3E%3C/svg%3E") no-repeat center / 1rem;
}
.pd_hero .btns {
  display: flex;
  flex-wrap: wrap;
  gap: 1.4rem;
  margin-top: 3.6rem;
}
.pd_hero .btns button.btn,
.pd_hero .btns button.btn_line {
  font-family: inherit;
}

.pd_hero .wa {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2.4rem;
  color: var(--primary);
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 2rem;
  transition: color 0.3s;
}
.pd_hero .wa img {
  width: 2.2rem;
  height: 2.2rem;
}
.pd_hero .wa:hover {
  color: var(--primary_dark);
  text-decoration: underline;
}
.pd_hero .trust {
  display: grid;
  grid-template-columns: repeat(3, minmax(0px, 1fr));
  gap: 2rem;
  margin-top: 3.2rem;
  padding: 2.4rem 2.8rem;
  border-radius: 1.4rem;
  background-color: var(--light);
}
.pd_hero .trust li {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.pd_hero .trust li + li {
  padding-left: 2rem;
  border-left: 1px solid var(--line);
}
.pd_hero .trust strong {
  color: var(--primary);
  font-weight: 700;
  font-size: 2.6rem;
  line-height: 3.2rem;
}
.pd_hero .trust span {
  color: var(--text);
  font-size: 1.4rem;
  line-height: 2rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .pd_hero {
    padding: 7rem 0px 9rem;
  }
  .pd_hero .content {
    flex-direction: column;
    align-items: stretch;
    gap: 5rem;
  }
  .pd_hero .gallery {
    width: 100%;
  }
  .pd_hero .stage a {
    aspect-ratio: 4 / 3;
  }
  .pd_hero .thumbs .swiper-slide {
    height: 16rem;
    aspect-ratio: auto;
  }
  .pd_hero .info {
    max-width: none;
  }
  .pd_hero .tcon h1 + p,
  .pd_hero .points li {
    font-size: 1.9rem;
    line-height: 1.55;
  }
  .pd_hero .trust span,
  .pd_hero .wa {
    font-size: 1.7rem;
  }
}
@media screen and (max-width: 768px) {
  .pd_hero {
    padding: 28px 0px 56px;
  }
  .pd_hero .content {
    flex-direction: column;
    align-items: stretch;
    gap: 30px;
  }
  .pd_hero .gallery {
    width: 100%;
  }
  .pd_hero .stage {
    border-radius: 16px;
  }
  .pd_hero .stage a {
    padding: 20px;
  }
  .pd_hero .count {
    left: 16px;
    bottom: 16px;
    font-size: 13px;
  }
  .pd_hero .stage .swiper_btns {
    right: 12px;
    bottom: 12px;
    gap: 8px;
  }
  .pd_hero .stage .swiper_btns div {
    width: 36px;
    height: 36px;
  }
  .pd_hero .thumbs {
    margin-top: 8px;
  }
  .pd_hero .thumbs .swiper-slide {
    width: calc((100% - 24px) / 4);
    padding: 6px;
    border-radius: 10px;
  }
  .pd_hero .info{
    max-width: unset;
  }
  .pd_hero .tcon .cat {
    padding: 5px 12px;
    font-size: 12px;
    line-height: 16px;
  }
  .pd_hero .tcon h1 {
    margin-top: 12px;
    font-size: 28px;
    line-height: 1.2;
  }
  .pd_hero .tcon h1 + p {
    margin-top: 14px;
    font-size: 15px;
    line-height: 1.7;
  }
  .pd_hero .points {
    grid-template-columns: minmax(0px, 1fr);
    gap: 10px;
    margin-top: 20px;
    padding-top: 20px;
  }
  .pd_hero .points li {
    gap: 10px;
    font-size: 14px;
    line-height: 1.5;
  }
  .pd_hero .points i {
    width: 18px;
    height: 18px;
    background-size: 8px;
  }
  .pd_hero .btns {
    gap: 10px;
    margin-top: 26px;
  }
  .pd_hero .wa {
    gap: 8px;
    margin-top: 18px;
    font-size: 14px;
  }
  .pd_hero .wa img {
    width: 20px;
    height: 20px;
  }
  .pd_hero .trust {
    gap: 10px;
    margin-top: 24px;
    padding: 16px 14px;
    border-radius: 12px;
  }
  .pd_hero .trust li + li {
    padding-left: 10px;
  }
  .pd_hero .trust strong {
    font-size: 20px;
    line-height: 1.2;
  }
  .pd_hero .trust span {
    font-size: 11px;
    line-height: 1.4;
  }
}

/* no hover zoom on touch screens */
@media (hover: none), (pointer: coarse) {
  .pd_hero .zoom_hint {
    display: none;
  }
}


.pd_specs {
  padding: 10rem 0px 11rem;
  background-color: var(--light);
  scroll-margin-top: 4rem;
}
/* tab bar (generated from the panels: any number of tabs) */
.pd_specs .tabs_nav {
  padding: 0.8rem;
  border-radius: 1.4rem;
  background-color: #fff;
  box-shadow: 0px 0.6rem 2rem rgba(11, 20, 46, 0.04);
}
.pd_specs .tabs {
  display: flex;
  gap: 0.8rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.pd_specs .tabs::-webkit-scrollbar {
  display: none;
}
.pd_specs .tabs li {
  flex: 1 1 0px;
  min-width: max-content;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 5.6rem;
  padding: 0px 2.8rem;
  border-radius: 0.9rem;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  color: var(--title);
  font-weight: 600;
  font-size: 1.7rem;
  outline: none;
  transition: 0.3s;
}
.pd_specs .tabs li:hover,
.pd_specs .tabs li:focus-visible {
  color: var(--primary);
  background-color: var(--light);
}
.pd_specs .tabs li.active {
  color: #fff;
  background-color: var(--primary);
}
.pd_specs .panels {
  margin-top: 2.4rem;
}
.pd_specs .panels > li {
  display: none;
  padding: 4.8rem;
  border-radius: 2rem;
  background-color: #fff;
}
.pd_specs .panels > li.active {
  display: block;
  animation: pd_specs_in 0.5s ease both;
}
@keyframes pd_specs_in {
  from {
    opacity: 0;
    transform: translateY(1.2rem);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
.pd_specs .tab_name {
  display: none;
}
/* free editor content inside any panel */
.pd_specs .tag + h2 {
  margin-top: 1.2rem;
}
.pd_specs h2 {
  color: var(--title);
  font-weight: 700;
  font-size: 3.6rem;
  line-height: 4.4rem;
}
.pd_specs .editor h3 {
  margin-top: 3rem;
  color: var(--title);
  font-weight: 700;
  font-size: 2.2rem;
  line-height: 2.8rem;
}
.pd_specs .text p,
.pd_specs .editor p {
  margin-top: 1.8rem;
  color: var(--text);
  font-size: 1.7rem;
  line-height: 2.8rem;
}
.pd_specs .editor ul,
.pd_specs .editor ol {
  margin-top: 1.8rem;
  padding-left: 2rem;
  color: var(--text);
  font-size: 1.6rem;
  line-height: 2.6rem;
}
.pd_specs .editor ul li {
  list-style: disc;
}
.pd_specs .editor ol li {
  list-style: decimal;
}
.pd_specs .editor img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-top: 2.4rem;
  border-radius: 1.4rem;
}
/* overview: text + benefits (left) / image (right) */
.pd_specs .overview {
  display: grid;
  grid-template-columns: minmax(0px, 1.12fr) minmax(0px, 1fr);
  align-items: stretch;
  gap: 6.4rem;
}
.pd_specs .benefits {
  margin-top: 3.6rem;
  padding: 3.2rem 3.6rem 3.4rem;
  border-radius: 1.6rem;
  background-color: var(--light);
}
.pd_specs .benefits h3 {
  color: var(--title);
  font-weight: 700;
  font-size: 2.2rem;
  line-height: 2.8rem;
}
.pd_specs .benefits .check_list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  gap: 1.4rem 3.2rem;
  margin-top: 2.2rem;
}
.pd_specs .benefits .check_list li {
  font-size: 1.5rem;
  line-height: 2.4rem;
}
.pd_specs .benefits .check_list li::before {
  top: 0.4rem;
}
.pd_specs .overview .media {
  position: relative;
  min-height: 52rem;
  overflow: hidden;
  border-radius: 1.8rem;
}
.pd_specs .overview .pic {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
}
.pd_specs .overview .media:hover .pic img {
  transform: scale(1.04);
}
.pd_specs .overview .cap {
  position: absolute;
  left: 2rem;
  right: 2rem;
  bottom: 2rem;
  z-index: 2;
  padding: 1.8rem 2.2rem;
  border-radius: 1.2rem;
  background-color: rgba(4, 17, 45, 0.72);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.pd_specs .overview .cap b {
  display: block;
  margin-bottom: 0.2rem;
  color: #fff;
  font-weight: 600;
  font-size: 1.6rem;
}
/* specifications */
.pd_specs .specs {
  display: flex;
  align-items: flex-start;
  gap: 5.6rem;
}
.pd_specs .table {
  flex: 1;
  overflow: hidden;
  border-radius: 1.4rem;
  border: 1px solid var(--line);
}
.pd_specs table {
  width: 100%;
  border-collapse: collapse;
}
.pd_specs th,
.pd_specs td {
  padding: 1.3rem 2.4rem;
  text-align: left;
  vertical-align: top;
  font-size: 1.5rem;
  line-height: 2.2rem;
}
.pd_specs th {
  width: 34%;
  color: var(--title);
  font-weight: 600;
  background-color: var(--light);
}
.pd_specs td {
  color: var(--text);
}
.pd_specs td.req {
  color: var(--text2);
  font-style: italic;
}
.pd_specs tr + tr th,
.pd_specs tr + tr td {
  border-top: 1px solid var(--line);
}
.pd_specs .drawing {
  flex-shrink: 0;
  width: 46rem;
}
.pd_specs .drawing a {
  display: block;
  aspect-ratio: 1100 / 700;
  padding: 1.6rem;
  cursor: zoom-in;
  border-radius: 1.4rem;
  border: 1px solid var(--line);
  background-color: #fff;
  transition: border-color 0.3s, box-shadow 0.3s;
}
.pd_specs .drawing a:hover {
  border-color: var(--primary);
  box-shadow: 0px 1.2rem 2.8rem rgba(11, 20, 46, 0.08);
}
.pd_specs .drawing h3 {
  margin-top: 2.4rem;
  color: var(--title);
  font-weight: 700;
  font-size: 2rem;
  line-height: 2.6rem;
}
.pd_specs .drawing p {
  margin-top: 1rem;
  color: var(--text);
  font-size: 1.5rem;
  line-height: 2.4rem;
}
/* options */
.pd_specs .options {
  display: flex;
  align-items: flex-start;
  gap: 6.4rem;
}
.pd_specs .options .text {
  flex-shrink: 0;
  width: 36rem;
}
.pd_specs .options .btn_text {
  margin-top: 2.8rem;
}
.pd_specs .acc {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0px, 1fr));
  gap: 2rem;
}
.pd_specs .acc li {
  padding: 1rem 1rem 2rem;
  border-radius: 1.6rem;
  border: 1px solid var(--line);
  transition: transform 0.35s, box-shadow 0.35s, border-color 0.35s;
}
.pd_specs .acc li:hover {
  transform: translateY(-0.6rem);
  border-color: rgba(11, 61, 135, 0.28);
  box-shadow: 0px 1.6rem 3.6rem rgba(11, 20, 46, 0.08);
}
.pd_specs .acc .pic {
  aspect-ratio: 480 / 330;
  overflow: hidden;
  border-radius: 1.2rem;
  background-color: var(--light2);
}
.pd_specs .acc .pic img {
  mix-blend-mode: multiply;
}
.pd_specs .acc h3 {
  margin-top: 1.6rem;
  padding: 0px 0.8rem;
  color: var(--title);
  font-weight: 600;
  font-size: 1.7rem;
  line-height: 2.2rem;
}
.pd_specs .acc p {
  margin-top: 0.4rem;
  padding: 0px 0.8rem;
  color: var(--text);
  font-size: 1.4rem;
  line-height: 2rem;
}
/* downloads (designed tab) */
.pd_specs .downloads {
  display: grid;
  grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr);
  align-items: stretch;
  gap: 4rem;
}
.pd_specs .feature {
  position: relative;
  display: flex;
  align-items: center;
  gap: 4rem;
  overflow: hidden;
  padding: 4.4rem 4.4rem;
  border-radius: 1.8rem;
  background: var(--grad_card);
}
.pd_specs .feature::before {
  content: '';
  position: absolute;
  left: -12rem;
  top: -12rem;
  width: 40rem;
  height: 40rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(111, 168, 236, 0.28) 0%, rgba(111, 168, 236, 0) 70%);
  pointer-events: none;
}
.pd_specs .feature .cover {
  position: relative;
  flex-shrink: 0;
  width: 21rem;
  aspect-ratio: 600 / 819;
  overflow: hidden;
  border-radius: 0.6rem;
  box-shadow: 0px 2.4rem 4.8rem rgba(0, 0, 0, 0.4), 1.2rem 1.2rem 0px rgba(255, 255, 255, 0.08);
  transform: rotate(-3deg);
  transition: transform 0.5s;
}
.pd_specs .feature .cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pd_specs .feature:hover .cover {
  transform: rotate(0deg) translateY(-0.6rem);
}
.pd_specs .feature .txt {
  position: relative;
  flex: 1;
  min-width: 0px;
}
.pd_specs .feature h2 {
  color: #fff;
  font-size: 3rem;
  line-height: 3.8rem;
}
.pd_specs .feature p {
  margin-top: 1.4rem;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.5rem;
  line-height: 2.4rem;
}
.pd_specs .feature .meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 2.2rem;
}
.pd_specs .feature .meta li {
  padding: 0.5rem 1.2rem;
  border-radius: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: rgba(255, 255, 255, 0.9);
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 1.8rem;
}
.pd_specs .feature .btn {
  margin-top: 3rem;
  color: var(--primary);
}
.pd_specs .feature .btn:hover {
  color: #fff;
  background-color: var(--primary_dark);
}
.pd_specs .more_files {
  display: flex;
  flex-direction: column;
}
.pd_specs .more_files .head h3 {
  color: var(--title);
  font-weight: 700;
  font-size: 2.2rem;
  line-height: 2.8rem;
}
.pd_specs .more_files .head p {
  margin-top: 0.6rem;
  color: var(--text);
  font-size: 1.5rem;
  line-height: 2.4rem;
}
.pd_specs .files {
  margin-top: 2.2rem;
}
.pd_specs .files li + li {
  margin-top: 1.2rem;
}
.pd_specs .files a,
.pd_specs .files button {
  display: flex;
  align-items: center;
  gap: 1.8rem;
  width: 100%;
  padding: 1.6rem 1.8rem 1.6rem 1.6rem;
  border-radius: 1.4rem;
  border: 1px solid var(--line);
  background-color: #fff;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
  transition: transform 0.35s, box-shadow 0.35s, border-color 0.35s;
}
.pd_specs .files a:hover,
.pd_specs .files button:hover {
  transform: translateY(-0.3rem);
  border-color: rgba(11, 61, 135, 0.35);
  box-shadow: 0px 1.2rem 2.8rem rgba(11, 20, 46, 0.08);
}
/* Inquiry file cards are <button>; keep card chrome after a→button */
.pd_specs .files button[data-inquiry] {
  display: flex;
  align-items: center;
  gap: 1.8rem;
  width: 100%;
  padding: 1.6rem 1.8rem 1.6rem 1.6rem;
  border-radius: 1.4rem;
  border: 1px solid var(--line);
  background-color: #fff;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
  transition: transform 0.35s, box-shadow 0.35s, border-color 0.35s;
}
.pd_specs .files button[data-inquiry]:hover {
  transform: translateY(-0.3rem);
  border-color: rgba(11, 61, 135, 0.35);
  box-shadow: 0px 1.2rem 2.8rem rgba(11, 20, 46, 0.08);
}
.pd_specs .files .ico {
  position: relative;
  flex-shrink: 0;
  width: 5rem;
  height: 5.6rem;
  border-radius: 0.8rem;
  background: var(--light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b3d87' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8Z'/%3E%3Cpath d='M14 3v5h5'/%3E%3C/svg%3E") no-repeat center 0.9rem / 2.6rem;
}
.pd_specs .files .ico em {
  position: absolute;
  left: 50%;
  bottom: 0.7rem;
  transform: translateX(-50%);
  padding: 0.1rem 0.5rem;
  border-radius: 0.3rem;
  background-color: var(--primary);
  color: #fff;
  font-style: normal;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.4rem;
  letter-spacing: 0.04em;
}
.pd_specs .files .ico.dwg em {
  background-color: var(--text2);
}
.pd_specs .files .name {
  flex: 1;
  min-width: 0px;
}
.pd_specs .files h4 {
  color: var(--title);
  font-weight: 600;
  font-size: 1.7rem;
  line-height: 2.4rem;
  transition: color 0.3s;
}
.pd_specs .files a:hover h4,
.pd_specs .files button:hover h4 {
  color: var(--primary);
}
.pd_specs .files .name p {
  margin-top: 0.2rem;
  color: var(--text2);
  font-size: 1.4rem;
  line-height: 2rem;
}
.pd_specs .files .act {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  height: 4.2rem;
  padding: 0px 1.8rem;
  border-radius: 0.8rem;
  border: 1px solid var(--primary);
  color: var(--primary);
  font-weight: 600;
  font-size: 1.4rem;
  transition: 0.3s;
}
.pd_specs .files .act::before {
  content: '';
  width: 1.4rem;
  height: 1.4rem;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5v9M4.5 7 8 10.5 11.5 7M2 14.5h12'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5v9M4.5 7 8 10.5 11.5 7M2 14.5h12'/%3E%3C/svg%3E") no-repeat center / contain;
}
.pd_specs .files .act.req::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1.5' y='3' width='13' height='10' rx='1.5'/%3E%3Cpath d='m2 4 6 5 6-5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1.5' y='3' width='13' height='10' rx='1.5'/%3E%3Cpath d='m2 4 6 5 6-5'/%3E%3C/svg%3E");
}
.pd_specs .files a:hover .act,
.pd_specs .files button:hover .act {
  color: #fff;
  background-color: var(--primary);
}
.pd_specs .more_files .note {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-top: auto;
  padding-top: 2.4rem;
  color: var(--text2);
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.pd_specs .more_files .note::before {
  content: '';
  flex-shrink: 0;
  width: 1.6rem;
  height: 1.6rem;
  margin-top: 0.3rem;
  background-color: var(--text2);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='10' height='7.5' rx='1.5'/%3E%3Cpath d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='10' height='7.5' rx='1.5'/%3E%3Cpath d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2'/%3E%3C/svg%3E") no-repeat center / contain;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .pd_specs {
    padding: 9rem 0px 10rem;
  }
  .pd_specs .tabs li {
    font-size: 1.9rem;
  }
  .pd_specs .panels > li {
    padding: 4.8rem;
  }
  .pd_specs .overview,
  .pd_specs .downloads {
    grid-template-columns: minmax(0px, 1fr);
    gap: 4rem;
  }
  .pd_specs .overview .media {
    min-height: 0px;
    aspect-ratio: 16 / 10;
  }
  .pd_specs .specs,
  .pd_specs .options {
    flex-direction: column;
    align-items: stretch;
    gap: 4rem;
  }
  .pd_specs .drawing,
  .pd_specs .options .text {
    width: 100%;
  }
  .pd_specs .drawing {
    display: flex;
    align-items: center;
    gap: 3rem;
  }
  .pd_specs .drawing a {
    flex-shrink: 0;
    width: 44rem;
  }
  .pd_specs .drawing h3 {
    margin-top: 0px;
  }
  .pd_specs .text p,
  .pd_specs .editor p,
  .pd_specs .drawing p,
  .pd_specs th,
  .pd_specs td,
  .pd_specs .benefits .check_list li,
  .pd_specs .feature p,
  .pd_specs .more_files .head p {
    font-size: 1.8rem;
    line-height: 1.55;
  }
  .pd_specs .acc p,
  .pd_specs .files .name p,
  .pd_specs .overview .cap,
  .pd_specs .more_files .note {
    font-size: 1.7rem;
  }
  .pd_specs .acc h3,
  .pd_specs .files h4 {
    font-size: 2rem;
  }
  .pd_specs .files .act,
  .pd_specs .feature .meta li {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .pd_specs {
    padding: 56px 0px 60px;
  }
  .pd_specs .tabs_nav {
    margin: 0px -20px;
    padding: 6px 20px;
    border-radius: 0px;
  }
  .pd_specs .tabs {
    gap: 4px;
  }
  .pd_specs .tabs li {
    flex: none;
    height: 42px;
    padding: 0px 16px;
    border-radius: 8px;
    font-size: 14px;
  }
  .pd_specs .panels {
    margin-top: 16px;
  }
  .pd_specs .panels > li {
    padding: 26px 18px;
    border-radius: 14px;
  }
  .pd_specs h2 {
    font-size: 24px;
    line-height: 1.25;
  }
  .pd_specs .text p,
  .pd_specs .editor p {
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.7;
  }
  .pd_specs .editor h3 {
    margin-top: 20px;
    font-size: 18px;
  }
  .pd_specs .editor ul,
  .pd_specs .editor ol {
    font-size: 14px;
    line-height: 1.7;
  }
  .pd_specs .overview,
  .pd_specs .downloads {
    grid-template-columns: minmax(0px, 1fr);
    gap: 24px;
  }
  .pd_specs .benefits {
    margin-top: 22px;
    padding: 22px 18px;
    border-radius: 12px;
  }
  .pd_specs .benefits h3 {
    font-size: 18px;
  }
  .pd_specs .benefits .check_list {
    grid-template-columns: minmax(0px, 1fr);
    gap: 8px;
    margin-top: 14px;
  }
  .pd_specs .benefits .check_list li {
    padding-left: 24px;
    font-size: 14px;
    line-height: 1.55;
  }
  .pd_specs .benefits .check_list li::before {
    top: 3px;
    width: 15px;
    height: 15px;
  }
  .pd_specs .overview .media {
    min-height: 0px;
    aspect-ratio: 4 / 3.4;
    border-radius: 12px;
  }
  .pd_specs .overview .cap {
    left: 10px;
    right: 10px;
    bottom: 10px;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.5;
  }
  .pd_specs .overview .cap b {
    font-size: 14px;
  }
  .pd_specs .specs,
  .pd_specs .options {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
  }
  .pd_specs .drawing,
  .pd_specs .options .text {
    width: 100%;
  }
  .pd_specs .table {
    border-radius: 10px;
  }
  .pd_specs th,
  .pd_specs td {
    padding: 10px 12px;
    font-size: 13px;
    line-height: 1.5;
  }
  .pd_specs th {
    width: 38%;
  }
  .pd_specs .drawing a {
    padding: 10px;
    border-radius: 10px;
  }
  .pd_specs .drawing h3 {
    margin-top: 16px;
    font-size: 17px;
  }
  .pd_specs .drawing p {
    margin-top: 6px;
    font-size: 14px;
    line-height: 1.6;
  }
  .pd_specs .options .btn_text {
    margin-top: 16px;
  }
  .pd_specs .acc {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 10px;
  }
  .pd_specs .acc li {
    padding: 6px 6px 14px;
    border-radius: 10px;
  }
  .pd_specs .acc li:hover {
    transform: none;
  }
  .pd_specs .acc .pic {
    border-radius: 8px;
  }
  .pd_specs .acc h3 {
    margin-top: 10px;
    padding: 0px 4px;
    font-size: 14px;
    line-height: 1.35;
  }
  .pd_specs .acc p {
    padding: 0px 4px;
    font-size: 12px;
    line-height: 1.5;
  }
  .pd_specs .feature {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    padding: 28px 22px 26px;
    border-radius: 14px;
  }
  .pd_specs .feature .cover {
    width: 120px;
    border-radius: 4px;
  }
  .pd_specs .feature h2 {
    font-size: 22px;
    line-height: 1.3;
  }
  .pd_specs .feature p {
    margin-top: 10px;
    font-size: 14px;
    line-height: 1.6;
  }
  .pd_specs .feature .meta {
    gap: 6px;
    margin-top: 16px;
  }
  .pd_specs .feature .meta li {
    padding: 3px 10px;
    font-size: 12px;
    line-height: 18px;
  }
  .pd_specs .feature .btn {
    margin-top: 20px;
  }
  .pd_specs .more_files .head h3 {
    font-size: 18px;
    line-height: 1.3;
  }
  .pd_specs .more_files .head p {
    font-size: 14px;
    line-height: 1.6;
  }
  .pd_specs .files {
    margin-top: 14px;
  }
  .pd_specs .files li + li {
    margin-top: 8px;
  }
  .pd_specs .files a,
  .pd_specs .files button,
  .pd_specs .files button[data-inquiry] {
    gap: 12px;
    width: 100%;
    padding: 12px;
    border-radius: 10px;
  }
  .pd_specs .files .ico {
    width: 40px;
    height: 46px;
    border-radius: 7px;
    background-size: 20px;
    background-position: center 7px;
  }
  .pd_specs .files .ico em {
    bottom: 5px;
    padding: 0px 4px;
    font-size: 8px;
    line-height: 12px;
  }
  .pd_specs .files h4 {
    font-size: 14px;
    line-height: 1.35;
  }
  .pd_specs .files .name p {
    font-size: 12px;
    line-height: 1.4;
  }
  .pd_specs .files .act {
    width: 38px;
    height: 38px;
    padding: 0px;
    justify-content: center;
    font-size: 0px;
    border-radius: 8px;
  }
  .pd_specs .files .act::before {
    width: 15px;
    height: 15px;
  }
  .pd_specs .more_files .note {
    gap: 8px;
    padding-top: 16px;
    font-size: 12px;
    line-height: 1.5;
  }
  .pd_specs .more_files .note::before {
    width: 14px;
    height: 14px;
    margin-top: 1px;
  }
}


.pd_features {
  position: relative;
  z-index: 1;
  overflow: hidden;
  padding: 11rem 0px 11rem;
  background-color: var(--primary);
}
.pd_features .bg {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -2;
  width: 100%;
  height: 100%;
}
/* revision 4: the photo must cover the whole section (it rendered at its natural size -> hard edges) */
.pd_features .bg img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* brand-blue gradient mask spread evenly over the whole section (revision 4: theme colours, no visible photo edge) */
.pd_features::before {
  content: '';
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -1;
  width: 100%;
  height: 100%;
  background: linear-gradient(115deg, rgba(4, 17, 45, 0.9) 0%, rgba(8, 47, 106, 0.84) 32%, rgba(11, 61, 135, 0.74) 64%, rgba(11, 61, 135, 0.62) 100%);
  pointer-events: none;
}
.pd_features::after {
  content: '';
  position: absolute;
  left: -16rem;
  top: -24rem;
  z-index: -1;
  width: 80rem;
  height: 80rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(111, 168, 236, 0.3) 0%, rgba(111, 168, 236, 0) 68%);
  pointer-events: none;
}
.pd_features .content {
  display: flex;
  align-items: stretch;
  gap: 7.2rem;
}
.pd_features .visual {
  position: relative;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50rem;
  overflow: hidden;
  border-radius: 2.4rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: radial-gradient(circle at 50% 44%, #fff 0%, rgba(255, 255, 255, 0.94) 42%, rgba(234, 241, 250, 0.84) 100%);
  box-shadow: 0px 3rem 6rem rgba(4, 17, 45, 0.25);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.pd_features .visual .pic {
  width: 92%;
  height: 80%;
  margin-bottom: 4rem;
}
.pd_features .visual .pic img {
  transition: transform 0.6s;
}
.pd_features .visual:hover .pic img {
  transform: scale(1.04);
}
.pd_features .chips {
  position: absolute;
  left: 2.4rem;
  right: 2.4rem;
  bottom: 2.4rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.8rem;
}
.pd_features .chips li {
  padding: 0.7rem 1.4rem;
  border-radius: 2rem;
  background-color: rgba(4, 17, 45, 0.55);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #fff;
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 1.8rem;
}
.pd_features .info {
  flex: 1;
  min-width: 0px;
}
.pd_features .tcon .tag + h2 {
  margin-top: 1.4rem;
}
.pd_features .tcon h2 {
  max-width: 72rem;
}
.pd_features .tcon p {
  max-width: 64rem;
  color: rgba(255, 255, 255, 0.84);
}
.pd_features .list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0px, 1fr));
  gap: 2rem;
  margin-top: 4rem;
}
.pd_features .list li {
  padding: 2.6rem 2.6rem 2.8rem;
  border-radius: 1.6rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background-color: rgba(255, 255, 255, 0.08);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  transition: transform 0.35s, background-color 0.35s, border-color 0.35s;
}
.pd_features .list li:hover {
  transform: translateY(-0.6rem);
  border-color: rgba(255, 255, 255, 0.36);
  background-color: rgba(255, 255, 255, 0.15);
}
.pd_features .list i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5rem;
  height: 5rem;
  border-radius: 1.2rem;
  background-color: rgba(255, 255, 255, 0.16);
  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.2);
}
.pd_features .list i img {
  display: block;
  width: 2.8rem;
  height: 2.8rem;
}
.pd_features .list h3 {
  margin-top: 2.2rem;
  color: #fff;
  font-weight: 600;
  font-size: 1.9rem;
  line-height: 2.4rem;
}
.pd_features .list p {
  margin-top: 0.8rem;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.5rem;
  line-height: 2.3rem;
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .pd_features {
    padding: 10rem 0px 10rem;
  }
  .pd_features .content {
    flex-direction: column;
    gap: 5rem;
  }
  .pd_features .visual {
    width: 100%;
    height: 52rem;
  }
  .pd_features .visual .pic {
    width: auto;
    height: 86%;
  }
  .pd_features .list {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
  }
  .pd_features .tcon p {
    font-size: 2rem;
    line-height: 1.55;
  }
  .pd_features .list h3 {
    font-size: 2.2rem;
    line-height: 1.3;
  }
  .pd_features .list p,
  .pd_features .chips li {
    font-size: 1.8rem;
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  .pd_features {
    padding: 60px 0px 60px;
  }
  .pd_features::before {
    background: linear-gradient(180deg, rgba(8, 47, 106, 0.95) 0%, rgba(11, 61, 135, 0.84) 60%, rgba(11, 61, 135, 0.7) 100%);
  }
  .pd_features .content {
    flex-direction: column;
    gap: 30px;
  }
  .pd_features .visual {
    order: 2;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 0.95;
    border-radius: 16px;
  }
  .pd_features .visual .pic {
    width: 82%;
  }
  .pd_features .chips {
    left: 12px;
    right: 12px;
    bottom: 12px;
    gap: 6px;
  }
  .pd_features .chips li {
    padding: 5px 10px;
    font-size: 11px;
    line-height: 16px;
  }
  .pd_features .list {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 10px;
    margin-top: 26px;
  }
  .pd_features .list li {
    padding: 18px 14px 20px;
    border-radius: 12px;
  }
  .pd_features .list li:hover {
    transform: none;
  }
  .pd_features .list i {
    width: 40px;
    height: 40px;
    border-radius: 10px;
  }
  .pd_features .list i img {
    width: 22px;
    height: 22px;
  }
  .pd_features .list h3 {
    margin-top: 14px;
    font-size: 15px;
    line-height: 1.35;
  }
  .pd_features .list p {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.5;
  }
}


.pd_applications {
  padding: 11rem 0px 11rem;
  background-color: #fff;
}
.pd_applications .top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 6rem;
}
.pd_applications .tcon {
  max-width: 66rem;
}
.pd_applications .desc {
  max-width: 56rem;
}
.pd_applications .desc p {
  color: var(--text);
  font-size: 1.8rem;
  line-height: 2.8rem;
}
.pd_applications .grid {
  display: flex;
  align-items: stretch;
  gap: 2.4rem;
  margin-top: 5.2rem;
}
.pd_applications .cases {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  gap: 2.4rem;
}
.pd_applications .cases li {
  overflow: hidden;
  border-radius: 2rem;
  background-color: var(--light);
}
.pd_applications .cases .pic {
  position: relative;
  aspect-ratio: 900 / 600;
}
.pd_applications .cases li:hover .pic img {
  transform: scale(1.04);
}
.pd_applications .loc {
  position: absolute;
  left: 2rem;
  top: 2rem;
  padding: 0.6rem 1.4rem;
  border-radius: 2rem;
  background-color: rgba(4, 17, 45, 0.72);
  color: #fff;
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 1.8rem;
}
.pd_applications .txt {
  padding: 2.8rem 3.2rem 3.4rem;
}
.pd_applications .meta {
  color: var(--accent);
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 1.8rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.pd_applications .txt h3 {
  margin-top: 0.8rem;
  color: var(--title);
  font-weight: 700;
  font-size: 2.2rem;
  line-height: 2.8rem;
}
.pd_applications .txt p {
  margin-top: 1.2rem;
  color: var(--text);
  font-size: 1.5rem;
  line-height: 2.4rem;
}
.pd_applications .industries {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  width: 34rem;
  padding: 3.6rem 3.2rem;
  border-radius: 2rem;
  background: linear-gradient(160deg, #082f6a 0%, #0b3d87 100%);
}
.pd_applications .industries h3 {
  color: #fff;
  font-weight: 700;
  font-size: 2.2rem;
  line-height: 2.8rem;
}
.pd_applications .industries ul {
  margin-top: 2rem;
  margin-bottom: 3.2rem;
}
.pd_applications .industries li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.pd_applications .industries li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.4rem 0px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 2.2rem;
  transition: 0.3s;
}
.pd_applications .industries li a::after {
  content: '';
  width: 1rem;
  height: 0.8rem;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M.7 4h8.6M6 .7 9.3 4 6 7.3'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M.7 4h8.6M6 .7 9.3 4 6 7.3'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform 0.3s;
}
.pd_applications .industries li a:hover {
  color: #fff;
}
.pd_applications .industries li a:hover::after {
  transform: translateX(0.4rem);
}
.pd_applications .industries .btn {
  align-self: flex-start;
  margin-top: auto;
  color: var(--primary);
  background-color: #fff;
}
.pd_applications .industries .btn:hover {
  color: #fff;
  background-color: var(--primary_dark);
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .pd_applications {
    padding: 10rem 0px 10rem;
  }
  .pd_applications .top {
    flex-direction: column;
    align-items: flex-start;
    gap: 2.4rem;
  }
  .pd_applications .tcon,
  .pd_applications .desc {
    max-width: none;
  }
  .pd_applications .desc p {
    font-size: 2rem;
    line-height: 1.55;
  }
  .pd_applications .grid {
    flex-direction: column;
  }
  .pd_applications .industries {
    width: 100%;
  }
  .pd_applications .industries ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    column-gap: 4rem;
  }
  .pd_applications .industries li + li {
    border-top: none;
  }
  .pd_applications .industries li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }
  .pd_applications .txt p,
  .pd_applications .industries li a {
    font-size: 1.8rem;
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  .pd_applications {
    padding: 60px 0px 60px;
  }
  .pd_applications .top {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .pd_applications .desc p {
    font-size: 15px;
    line-height: 1.7;
  }
  .pd_applications .grid {
    flex-direction: column;
    gap: 12px;
    margin-top: 28px;
  }
  .pd_applications .grid .cases {
    grid-template-columns: repeat(auto-fill,minmax(min(250px,100%),1fr));
    gap: 12px;
  }
  .pd_applications .cases li {
    border-radius: 14px;
  }
  .pd_applications .loc {
    left: 12px;
    top: 12px;
    padding: 4px 10px;
    font-size: 12px;
  }
  .pd_applications .txt {
    padding: 18px 18px 22px;
  }
  .pd_applications .meta {
    font-size: 12px;
    line-height: 16px;
  }
  .pd_applications .txt h3 {
    margin-top: 6px;
    font-size: 18px;
    line-height: 1.3;
  }
  .pd_applications .txt p {
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.6;
  }
  .pd_applications .industries {
    width: 100%;
    padding: 24px 20px;
    border-radius: 14px;
  }
  .pd_applications .industries h3 {
    font-size: 18px;
  }
  .pd_applications .industries ul {
    margin: 10px 0px 20px;
  }
  .pd_applications .industries li a {
    padding: 11px 0px;
    font-size: 15px;
  }
}


.pd_related {
  overflow: hidden;
  padding: 11rem 0px 12rem;
  background-color: var(--light);
}
.pd_related .top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 4rem;
}
.pd_related .right {
  display: flex;
  align-items: center;
  gap: 3.2rem;
}
.pd_related .swiper {
  margin-top: 4.8rem;
  overflow: visible;
  clip-path: inset(-4rem -100vw -4rem 0px);
}
.pd_related .dots {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  margin-top: 4.8rem;
}
.pd_related .dots .dot {
  width: 1rem;
  height: 1rem;
  border-radius: 0.5rem;
  background-color: #c3cedb;
  cursor: pointer;
  transition: width 0.35s, background-color 0.35s;
}
.pd_related .dots .dot:hover {
  background-color: #8fa3bb;
}
.pd_related .dots .dot.active {
  width: 3.2rem;
  background-color: var(--primary);
}
.pd_related .swiper-slide {
  width: calc((100% - 7.2rem) / 4);
  padding: 1.2rem 1.2rem 2.6rem;
  border-radius: 2rem;
  border: 1px solid transparent;
  background-color: #fff;
  transition: transform 0.35s, box-shadow 0.35s, border-color 0.35s;
}
.pd_related .swiper-slide:hover {
  transform: translateY(-0.6rem);
  border-color: rgba(11, 61, 135, 0.2);
  box-shadow: 0px 1.6rem 3.6rem rgba(11, 20, 46, 0.1);
}
.pd_related .swiper a {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.pd_related .pic {
  aspect-ratio: 1 / 0.86;
  overflow: hidden;
  padding: 2.4rem;
  border-radius: 1.4rem;
  background-color: var(--light2);
  transition: background-color 0.4s;
}
.pd_related .pic img {
  mix-blend-mode: multiply;
}
.pd_related .swiper a:hover .pic {
  background-color: #eceff3;
}
.pd_related .swiper a:hover .pic img {
  transform: scale(1.05);
}
.pd_related .txt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1;
  padding: 2.2rem 1.2rem 0px;
}
.pd_related h3 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: var(--title);
  font-weight: 600;
  font-size: 1.9rem;
  line-height: 2.6rem;
  transition: color 0.3s;
}
.pd_related .swiper a:hover h3 {
  color: var(--primary);
}
.pd_related .txt p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  margin-top: 1rem;
  color: var(--text);
  font-size: 1.5rem;
  line-height: 2.4rem;
}
.pd_related .more {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  margin-top: auto;
  padding-top: 2rem;
  color: var(--primary);
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 2rem;
  transition: color 0.3s;
}
.pd_related .more::after {
  content: '';
  width: 1rem;
  height: 0.8rem;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M.7 4h8.6M6 .7 9.3 4 6 7.3'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M.7 4h8.6M6 .7 9.3 4 6 7.3'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform 0.3s;
}
.pd_related .swiper a:hover .more {
  color: var(--primary_dark);
}
.pd_related .swiper a:hover .more::after {
  transform: translateX(0.4rem);
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .pd_related {
    padding: 10rem 0px 10rem;
  }
  .pd_related .swiper-slide {
    width: calc((100% - 4.8rem) / 3);
  }
  .pd_related h3 {
    font-size: 2.2rem;
    line-height: 1.3;
  }
  .pd_related .txt p,
  .pd_related .more {
    font-size: 1.7rem;
    line-height: 1.55;
  }
}
@media screen and (max-width: 768px) {
  .pd_related {
    padding: 60px 0px 60px;
  }
  .pd_related .dots {
    gap: 8px;
    margin-top: 28px;
  }
  .pd_related .dots .dot {
    width: 8px;
    height: 8px;
    border-radius: 4px;
  }
  .pd_related .dots .dot.active {
    width: 24px;
  }
  .pd_related .top {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
  .pd_related .right {
    justify-content: space-between;
    width: 100%;
    gap: 16px;
  }
  .pd_related .swiper {
    margin-top: 24px;
  }
  .pd_related .swiper-slide {
    width: 40%;
    padding: 8px 8px 18px;
    border-radius: 14px;
  }
  .pd_related .pic {
    padding: 14px;
    border-radius: 10px;
  }
  .pd_related .txt {
    padding: 14px 6px 0px;
  }
  .pd_related h3 {
    font-size: 16px;
    line-height: 1.35;
  }
  .pd_related .txt p {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.55;
  }
  .pd_related .swiper-slide:hover {
    transform: none;
  }
  .pd_related .more {
    gap: 6px;
    padding-top: 14px;
    font-size: 13px;
    line-height: 18px;
  }
}
@media screen and (max-width: 576px){
  .pd_related .swiper-slide{
    width: 75%;
  }
}