@charset "utf-8";
/* Shared visual system. Loaded after page styles so each template keeps its layout. */
:root {
  --brand: #1f5dcb;
  --brand-deep: #17489f;
  --ink: #182b49;
  --muted: #627189;
  --line: #e3eaf3;
  --surface: #f5f8fc;
  --radius: 12px;
  --shadow: 0 5px 22px rgba(24, 51, 93, .06);
  --shadow-hover: 0 14px 32px rgba(24, 51, 93, .13);
  --ease: cubic-bezier(.22, .61, .36, 1);
}
body { color: var(--ink); -webkit-font-smoothing: antialiased; }
::selection { background: #dbe8ff; color: #173d7c; }
a, button { -webkit-tap-highlight-color: rgba(31, 93, 203, .12); }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid #7aa7f5; outline-offset: 4px;
}
.Header-wrapper { box-shadow: 0 3px 22px rgba(24, 51, 93, .08); }
.Header-dropdown { border-color: var(--line); border-radius: 0 0 14px 14px; box-shadow: var(--shadow-hover); }
.Header-dpmenu a { transition: color .2s, background-color .2s; }
.Header-dpmenu a:hover, .Header-dpmenu a:focus-visible { color: var(--brand); background-color: var(--surface); }
.H-lang .Hlang-menu { color: var(--brand); }
.Header-Menu { transition: color .2s; }
.Header-Menu:hover, .Header-navbar ul li.ontrue .Header-Menu { color: var(--brand); }
.pubTitle h2, .pubTitle h6 { color: var(--ink); font-weight: 600; line-height: 1.35; }
.pubTitle p { color: var(--muted); }
.pubTitle i { background: var(--brand); border-radius: 4px; }
.ind-about, .relly { background-color: var(--surface); }
.ind-about-video { overflow: hidden; border-radius: var(--radius); box-shadow: var(--shadow); }
.ys-product ul li a, .ys-product ul li:hover h4 { text-shadow: 0 2px 16px rgba(0, 0, 0, .4); }
.sonimgban.led-h1-tit h1 { animation: none; text-shadow: 0 3px 20px rgba(0, 0, 0, .4); }

/* CTA buttons share color, radius and feedback without changing their sizing. */
.ind-about-note .pubTitle a, .relly-formbtn, .zb-btn,
.pro-cont .downfile li .more, .newsxq-share a,
.nofound-btns .nofound-btn:not(.nofound-btn-ghost), .prolist li span.more {
  background: var(--brand); color: #fff; border-radius: 8px;
  font-weight: 600; letter-spacing: .025em;
  transition: background-color .22s, box-shadow .22s, transform .22s var(--ease);
}
.relly-formbtn:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; transform: none; }
.fullpage a { border-color: var(--line); border-radius: 8px; color: var(--muted); box-shadow: none; }
.fullpage a:hover, .fullpage a.ontrue, .fullpage a.on {
  background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 4px 12px rgba(31, 93, 203, .18);
}
.promenu { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.promenu a { transition: color .2s, background-color .2s; }
.promenu a.cur, .promenu a:hover, .prolist dl dd a.cur, .prolist dl dd a:hover { color: var(--brand); }
.pro-tab-tit { border-bottom-color: var(--brand); }
.pro-tab-tit li { border-radius: 8px 8px 0 0; background: var(--surface); transition: background-color .2s, color .2s; }
.pro-tab-tit li.cur, .pro-tab-tit li.active, .pro-tab-tit li:hover { background: var(--brand); color: #fff; }

.prolist li, .news-list li { border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); transition: box-shadow .3s var(--ease), transform .3s var(--ease); }
.prolist li:after { height: 3px; background: var(--brand); }
.product .swiper-slide .com-img, .case-list .case-img { border-radius: var(--radius); }
.product .swiper-slide h4 { height: auto; min-height: 48px; line-height: 1.5; padding: 12px 8px; font-weight: 500; }
.prolist-wddes p, .prolist-wdtit p, .news-wd p { color: var(--muted); }
.prolist li:hover h4, .news-list li a:hover .news-wd h4 { color: var(--brand); }
.com-img img, .case-img img { transition: transform .55s var(--ease); }
.banner .swiper-pagination-bullet { height: 5px; border-radius: 8px; overflow: hidden; }
.banner .swiper-pagination-bullet:before { height: 5px; background: #fff; border-radius: inherit; }
.relly-form .relly-formipt input, .relly-form textarea {
  border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink);
  transition: border-color .2s, box-shadow .2s;
}
.relly-form .relly-formipt input:focus, .relly-form textarea:focus {
  border-color: var(--brand); box-shadow: 0 0 0 3px rgba(31, 93, 203, .1);
}
.relly-form textarea { resize: vertical; }
@media (hover: hover) and (pointer: fine) {
  .ind-about-note .pubTitle a:hover, .relly-formbtn:not(:disabled):hover, .zb-btn:hover,
  .pro-cont .downfile li .more:hover, .newsxq-share a:hover,
  .nofound-btns .nofound-btn:not(.nofound-btn-ghost):hover {
    background: var(--brand-deep); color: #fff; opacity: 1;
    transform: translateY(-2px); box-shadow: 0 7px 18px rgba(31, 93, 203, .22);
  }
  .prolist li:hover, .news-list li:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
  .com-img:hover img, .case-img img:hover { transform: scale(1.035); }
  .prolist li a:hover .prolist-img img { transform: scale(1); }
}
@media (hover: none) {
  .prolist li:hover, .news-list li:hover { transform: none; box-shadow: var(--shadow); }
  .com-img:hover img, .case-img img:hover, .prolist li a:hover .prolist-img img { transform: none; }
}
@media (max-width: 767px) {
  .H-lang .Hlang-menu { display: flex; align-items: center; justify-content: center; gap: 5px; width: auto; height: 60px; white-space: nowrap; font-size: 12px; }
  .H-lang .Hlang-menu i { flex: 0 0 20px; margin: 0; }
  .banner .swiper-pagination-bullet { width: 28px; margin: 0 5px !important; }
  .fullpage { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
  .fullpage a { margin: 0; min-width: 44px; height: 44px; }
  .pubTitle p { line-height: 1.8; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .wow { visibility: visible !important; }
  .sonimgban-prowdft h6, .sonimgban-prowdft h1, .sonimgban-prowdft p, .sonimgban-prowdft span { opacity: 1; transform: none; }
  .prolist li:hover, .news-list li:hover, .com-img:hover img, .case-img img:hover { transform: none; }
}
