body {
    line-height: 1.6;
    font-size: 16px;
    font-weight: 400;
    font-family:'pingfang SC','microsoft yahei','微软雅黑',arial,sans-serif;
    color: #000;
  }

h1,h2,h3,h4,h5,h6{
    font-family: 'pingfang SC','microsoft yahei','微软雅黑',arial,sans-serif;
}

p{
    margin-bottom: 5px;
}
ul,li{
    list-style: none;
}
ul{
    padding-left: 0px;
}

a:hover{
    color: #000;
}

.pc{
    display: block;
}@media(max-width:992px){
    .pc{
        display: none;
    }
}

.w-90{
    width: 90%;
    max-width: 1600px;
    margin: 0 auto;
}

.btn:focus,
.btn:active,
.form-control:focus {
    outline: none;
    box-shadow: none;
    border: none;
}

/* ==========================================================================
   OPTIWAVE Single Page - International High-end Design System
   Color: #0b4ea2 (primary) / #ee1d25 (accent)
   ========================================================================== */

:root {
    --ow-primary: #0b4ea2;
    --ow-primary-dark: #08387a;
    --ow-primary-light: #e7eef9;
    --ow-accent: #ee1d25;
    --ow-ink: #0a0e1a;
    --ow-text: #1a1f2e;
    --ow-muted: #5b6478;
    --ow-line: #e6e8ee;
    --ow-bg: #ffffff;
    --ow-bg-soft: #f6f7fb;
    --ow-bg-dark: #0a0e1a;
    --ow-radius: 0px;
    --ow-radius-lg: 8px;
    --ow-shadow-sm: 0 1px 2px rgba(10, 14, 26, .04), 0 2px 8px rgba(10, 14, 26, .04);
    --ow-shadow-md: 0 8px 24px rgba(10, 14, 26, .08);
    --ow-shadow-lg: 0 20px 60px rgba(10, 14, 26, .12);
    --ow-ease: cubic-bezier(.22, .61, .36, 1);
    --ow-fs-head: 'pingfang SC', 'microsoft yahei', '微软雅黑', arial, sans-serif;
    --ow-fs-body: 'pingfang SC', 'microsoft yahei', '微软雅黑', arial, sans-serif;
    /* Sticky header height (incl. bottom border).
       Used ONLY by .ow-section scroll-margin-top, whose formula is
       calc(var(--ow-header-h) - section padding-top) so that the section
       TITLE lands flush against the header's bottom edge.
       Do NOT set scroll-padding-top on html, and do NOT set
       scroll-behavior: smooth - the anchor jump is instant by design. */
    --ow-header-h: 100px;
}
a{
    color: var(--ow-text);
}
/* base reset: anchor offset is handled per-section by .ow-section's
   scroll-margin-top; no scroll-padding-top here (it would add up),
   no smooth scrolling (instant jump = exact position). */

.ow-body {
    font-family: var(--ow-fs-body);
    color: var(--ow-text);
    background: var(--ow-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
.ow-body h1, .ow-body h2, .ow-body h3, .ow-body h4 {
    font-family: var(--ow-fs-head);
    font-weight: 700;
    color: var(--ow-ink);
    letter-spacing: 0;
    margin: 0 0 0.6em;
}
.ow-body p { margin: 0 0 0.8rem; line-height: 1.7; color: var(--ow-text); }
/* Article body links - strictly scoped to the .ow-prose container
   so that all UI component links (.ow-contact-value a, .ow-product-tag,
   .ow-news-link, .ow-nav__link, .ow-footer__link, .ow-brand, etc.)
   keep their own styles regardless of whether the <a> tag has a class. */
.ow-prose a {
    color: var(--ow-primary);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: color .25s var(--ow-ease);
}
.ow-prose a:hover { color: var(--ow-primary-dark); }

/* layout container */
.ow-container {
    width: 95%;
    max-width: 1000px;
    margin: 0 auto;
    box-sizing: border-box;
}
@media (max-width: 768px) {
    .ow-container { padding: 0 15px; width: 100%;}
}

/* skip link (a11y) */
.ow-skip {
    position: absolute; top: -100px; left: 0;
    background: var(--ow-primary); color: #fff;
    padding: 10px 20px; z-index: 9999;
    font-size: 14px; font-weight: 500;
    transition: top .25s var(--ow-ease);
}
.ow-skip:focus { top: 0; color: #fff; }

/* eyebrow tag */
.ow-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--ow-fs-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--ow-primary);
    margin: 0 0 18px;
}
.ow-eyebrow::before {
    content: "";
    display: inline-block;
    width: 28px; height: 1px;
    background: var(--ow-accent);
}

/* buttons */
.ow-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 28px;
    font-family: var(--ow-fs-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1;
    border: 1px solid transparent;
    border-radius: 0;
    cursor: pointer;
    transition: all .3s var(--ow-ease);
    text-transform: uppercase;
    white-space: nowrap;
}
.ow-btn--primary {
    background: var(--ow-primary);
    color: #fff;
    border-color: var(--ow-primary);
}
.ow-btn--primary:hover {
    background: var(--ow-accent);
    border-color: var(--ow-accent);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(238, 29, 37, .25);
}
.ow-btn--ghost {
    background: transparent;
    color: var(--ow-ink);
    border-color: var(--ow-ink);
}
.ow-btn--ghost:hover {
    background: var(--ow-ink);
    color: #fff;
    transform: translateY(-2px);
}
.ow-btn--light {
    background: transparent;
    color: #fff;
    border-color: rgba(255, 255, 255, .4);
}
.ow-btn--light:hover {
    background: #fff;
    color: var(--ow-ink);
    border-color: #fff;
}
.ow-btn .ow-btn__arrow {
    display: inline-block;
    transition: transform .3s var(--ow-ease);
}
.ow-btn:hover .ow-btn__arrow { transform: translateX(4px); }

/* ==========================================================================
   Header / Navigation
   ========================================================================== */
.ow-header {
    /* Native sticky: the header ALWAYS keeps its place in the document
       flow, so toggling .is-sticky only changes the shadow - no layout
       jump. (The old relative->fixed switch removed the header from the
       flow, shifting the whole page up ~99px, which broke anchor
       landings on the first click.) */
    position: sticky;
    top: 0;
    width: 100%;
    background: #fff;
    z-index: 100;
    border-bottom: 1px solid var(--ow-line);
    transition: box-shadow .3s var(--ow-ease);
}
.ow-header.is-sticky {
    box-shadow: var(--ow-shadow-sm);
}
.ow-header__inner {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 150px;
    min-height: 80px;
    padding: 14px 0;
}
.ow-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--ow-ink);
    text-decoration: none;
}
.ow-brand:hover { color: var(--ow-ink); }
/* Image logo (used by .ow-brand--img) */
.ow-brand--img {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}
.ow-brand--img:hover { color: inherit; }
.ow-brand__img {
    display: block;
    height: 50px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    /* keep original color on scroll - no filter */
}
.ow-header .ow-brand__img { height: 70px; }
.ow-footer .ow-brand__img { height: 56px; }
@media (max-width: 560px) {
    /* Header shrinks to ~81px (36px logo + 28px inner padding + 1px border).
       Only the height var changes here; the scroll-margin formula
       (header - 50px) is inherited from the <=768px block and auto-adapts. */
    :root { --ow-header-h: 84px; }
    .ow-header .ow-brand__img { height: 36px; }
    .ow-footer .ow-brand__img { height: 48px; }
}

/* primary nav (desktop) */
.ow-nav { display: flex; align-items: center; }
.ow-nav__list {
    display: flex;
    align-items: center;
    gap: 20px;
    list-style: none;
    margin: 0; padding: 0;
}
.ow-nav__link {
    display: inline-block;
    position: relative;
    padding: 10px 18px;
    font-family: var(--ow-fs-body);
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ow-ink);
    text-decoration: none;
    transition: color .25s var(--ow-ease);
}
.ow-nav__link::after {
    content: "";
    position: absolute;
    left: 18px; right: 18px; bottom: 6px;
    height: 1px;
    background: var(--ow-primary);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .3s var(--ow-ease);
}
.ow-nav__link:hover,
.ow-nav__link.is-active {
    color: var(--ow-primary);
}
.ow-nav__link:hover::after,
.ow-nav__link.is-active::after {
    transform: scaleX(1);
}

/* mobile menu toggle */
.ow-nav__toggle {
    display: none;
    width: 40px; height: 40px;
    padding: 0;
    background: transparent;
    border: 1px solid var(--ow-line);
    cursor: pointer;
    position: relative;
    z-index: 102;
}
.ow-nav__toggle span {
    display: block;
    position: absolute;
    left: 10px; right: 10px;
    height: 1.5px;
    background: var(--ow-ink);
    transition: all .3s var(--ow-ease);
}
.ow-nav__toggle span:nth-child(1) { top: 13px; }
.ow-nav__toggle span:nth-child(2) { top: 19px; }
.ow-nav__toggle span:nth-child(3) { top: 25px; }
.ow-nav__toggle.is-open span:nth-child(1) {
    top: 19px;
    transform: rotate(45deg);
    background: var(--ow-accent);
}
.ow-nav__toggle.is-open span:nth-child(2) { opacity: 0; }
.ow-nav__toggle.is-open span:nth-child(3) {
    top: 19px;
    transform: rotate(-45deg);
    background: var(--ow-accent);
}

/* mobile drawer */
@media (max-width: 992px) {
    /* Let <nav> participate in layout: the <ul> drawer below is
       position: fixed so it doesn't take flex space. This prevents
       the .ow-nav wrapper from pushing .ow-nav__toggle off the right edge. */
    .ow-header__inner{
        padding-left: 15px;
        padding-right: 15px;
        justify-content: space-between;
    }
    .ow-nav { display: contents; }
    .ow-nav__toggle { display: block; }
    .ow-nav__list {
        position: fixed;
        top: 0; right: 0;
        width: 78%;
        max-width: 320px;
        height: 100vh;
        background: #fff;
        flex-direction: column;
        align-items: stretch;
        justify-content: start;
        gap: 0;
        padding: 80px 28px 28px;
        box-shadow: -20px 0 40px rgba(10, 14, 26, .1);
        transform: translateX(100%);
        transition: transform .4s var(--ow-ease);
        z-index: 101;
    }
    .ow-nav__list.is-open { transform: translateX(0); }
    .ow-nav__item { border-bottom: 1px solid var(--ow-line); }
    .ow-nav__link {
        display: block;
        padding: 18px 0;
        font-size: 16px;
    }
    .ow-nav__link::after { display: none; }
    .ow-body.is-menu-open::before {
        content: "";
        position: fixed;
        inset: 0;
        background: rgba(10, 14, 26, .5);
        z-index: 100;
        animation: ow-fade .3s var(--ow-ease);
    }
    @keyframes ow-fade {
        from { opacity: 0; }
        to { opacity: 1; }
    }
}

/* ==========================================================================
   Section common
   ========================================================================== */
.ow-section {
    /* padding-top is reduced (was 110px) so that the section title sits
       close to the sticky header once scroll-margin-top compensates the
       header height. Keep padding-bottom large to maintain the visual
       gap between adjacent sections. */
    padding: 70px 0 110px;
    position: relative;
    /* Anchor offset (title flush under header):
       title box top = sectionTop + padding-top(70px).
       To land it exactly at the header's bottom edge (y = --ow-header-h),
       offset = header height - 70px = 100 - 70 = 30px.
       The h2's line-box half-leading (~14px) provides the natural
       visual breathing room, so the title is flush, not cramped. */
    scroll-margin-top: calc(var(--ow-header-h) - 70px);
}
/* Home exception: #home has no title, clicking it must always show the
   very top of the page. Its document top equals the header height
   (~99px), so giving it a scroll-margin of --ow-header-h makes the
   browser compute y = 99 - 100 = -1, clamped to 0. Repeat clicks stay
   at exactly 0 - no drifting. */
#home { scroll-margin-top: var(--ow-header-h); }
.ow-section::after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1000px;
    height: 1px;
    background-color: #eee;
}
@media (max-width: 768px) {
    /* Mobile: padding-top shrinks to 50px, so the anchor offset formula
       must switch here (NOT at <=560px - that gap broke 561-768px where
       the title landed 19px under the header). The --ow-header-h var is
       overridden to 84px in the <=560px block, calc() auto-adapts. */
    .ow-section {
        padding: 50px 0 70px;
        scroll-margin-top: calc(var(--ow-header-h) - 50px);
    }
}
.ow-section--alt { background: #fff; }
.ow-section--ink {
    background: var(--ow-bg-dark);
    color: #fff;
}
.ow-section--ink .ow-eyebrow { color: #fff; }
.ow-section--ink .ow-eyebrow::before { background: var(--ow-accent); }
.ow-section--ink h2 { color: #fff; }
.ow-section--ink p { color: rgba(255, 255, 255, .7); }

.ow-section__head {
    max-width: 720px;
    margin: 0 auto 60px;
    text-align: center;
}
.ow-section__head--left { text-align: left; margin-left: 0; }
.ow-section__title {
    font-size: clamp(28px, 3.6vw, 44px);
    line-height: 1.15;
    font-weight: 600;
    margin: 0 0 18px;
}
.ow-section__sub {
    font-size: 16px;
    line-height: 1.7;
    color: var(--ow-muted);
    margin: 0;
}
.ow-section--ink .ow-section__sub { color: rgba(255, 255, 255, .7); }

/* ==========================================================================
   Products (Product Line - categorized list, no cards)
   ========================================================================== */
.ow-products__title {
    font-family: var(--ow-fs-head);
    font-size: clamp(36px, 4vw, 48px);
    font-weight: 700;
    line-height: 1.15;
    color: var(--ow-ink);
    text-align: left;
    margin: 0 0 60px;
}
.ow-product-lines {
    display: block;
    padding: 5px;
    /*border: 1px solid #eee;*/
    width: 100%;
    max-width: 100%;
    position: relative;
}
.ow-product-lines table,.ow-product-lines img,.ow-product-lines video{
    max-width: 100% !important;
}
.ow-product-lines a{
    color: var(--ow-text);
    text-decoration: underline;
}
.ow-product-line__name {
    font-family: var(--ow-fs-body);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--ow-accent);
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--ow-line);
    position: relative;
}
.ow-product-line__name::after {
    content: "";
    position: absolute;
    left: 0; bottom: -1px;
    width: 40px; height: 2px;
    background: var(--ow-accent);
}
.ow-product-line__items {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
}
.ow-product-tag {
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    font-family: var(--ow-fs-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--ow-text);
    background: #fff;
    border: 1px solid var(--ow-line);
    text-decoration: none;
    line-height: 1.4;
    white-space: nowrap;
    transition: color .25s var(--ow-ease), background .25s var(--ow-ease), border-color .25s var(--ow-ease);
}
.ow-product-tag:hover {
    color: #fff !important;
    background: var(--ow-primary);
    border-color: var(--ow-primary);
}
@media (max-width: 768px) {
    .ow-product-lines { grid-template-columns: 1fr; gap: 44px; }
    .ow-product-line__items { gap: 6px 8px; }
    .ow-product-tag { padding: 6px 12px; font-size: 13px; }
}

/* ==========================================================================
   News (minimal list - 2 columns, no categories, no excerpts, no arrows)
   ========================================================================== */
.ow-news__title {
    font-family: var(--ow-fs-head);
    font-size: clamp(36px, 4vw, 48px);
    font-weight: 700;
    line-height: 1.2;
    color: #000;
    text-align: left;
    margin: 0 0 36px;
    padding: 0 5px;
}
.ow-news-list {
    display: block;
    padding: 5px;
    /*border: 1px solid #eee;*/
    width: 100%;
    max-width: 100%;
    position: relative;
}
.ow-news-list table,.ow-news-list img,.ow-news-list video{
    max-width: 100% !important;
}
.ow-news-list a{
    color: var(--ow-text);
    text-decoration: underline;
}
.ow-news-item {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 22px 0;
    border-bottom: 1px solid var(--ow-line);
}
.ow-news-time {
    font-family: var(--ow-fs-body);
    font-size: 13px;
    font-weight: 500;
    color: var(--ow-muted);
    letter-spacing: 0.04em;
    white-space: nowrap;
}
.ow-news-link {
    font-family: var(--ow-fs-head);
    font-size: 16px;
    font-weight: 600;
    color: var(--ow-ink);
    line-height: 1.4;
}
@media (max-width: 768px) {
    .ow-news-list { grid-template-columns: 1fr; column-gap: 0; }
    .ow-news-item { padding: 18px 0; }
    .ow-news-time { font-size: 12px; }
    .ow-news-link { font-size: 16px; }
}

/* ==========================================================================
   Contact (minimal - matches Product Line / News style)
   ========================================================================== */
.ow-contact__title {
    font-family: var(--ow-fs-head);
    font-size: clamp(36px, 4vw, 48px);
    font-weight: 700;
    line-height: 1.2;
    color: #000;
    text-align: left;
    margin: 0 0 32px;
    padding: 0 5px;
}
.ow-contact-intro {
    padding: 0 5px;
    margin: 0 0 10px;
}
.ow-contact-intro p {
    font-size: 16px;
    line-height: 1.75;
    color: var(--ow-text);
    margin: 0;
}
.ow-contact-divider {
    height: 1px;
    background: var(--ow-line);
    margin: 0 5px 40px;
}
.ow-contact-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px 48px;
    padding: 0 5px;
}
.ow-contact-item {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ow-contact-label {
    font-family: var(--ow-fs-body);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--ow-muted);
}
.ow-contact-value {
    font-family: var(--ow-fs-head);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
    color: #000;
    word-break: break-word;
}
.ow-contact-value a {
    display: block;
    width: fit-content;
    color: #000;
    text-decoration: none;
    position: relative;
    padding-bottom: 3px;
}
.ow-contact-value a::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 100%;
    height: 1px;
    background: #000;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s var(--ow-ease);
}
.ow-contact-value a:hover::after {
    transform: scaleX(1);
}
@media (max-width: 768px) {
    .ow-contact-grid { grid-template-columns: 1fr; gap: 28px; }
    .ow-contact-intro p { font-size: 15px; }
    .ow-contact-value { font-size: 15px; }
}

/* ==========================================================================
   Footer (minimal centered)
   ========================================================================== */
.ow-footer {
    background: #eee;
    color: #000;
    padding: 60px 0 36px;
    text-align: center;
}
.ow-footer a {
    color: #000;
    text-decoration: none;
    transition: color .25s var(--ow-ease);
}
.ow-footer a:hover { color: #000; }
.ow-footer__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px;
}
.ow-footer__brand {
    display: inline-block;
    text-decoration: none;
}
.ow-footer__logo {
    display: block;
    height: 70px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    /*filter: brightness(0) invert(1);*/
}
.ow-footer__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px;
    font-family: var(--ow-fs-body);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.ow-footer__legal {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 12px;
    color: #000;
    letter-spacing: 0.02em;
}
.ow-footer__copy { color: #000; }
.ow-footer__legal a { color: #000; }
.ow-footer__legal a:hover { color: #000; }
.ow-footer__sep {
    color: #666;
    margin: 0 6px;
    user-select: none;
}
@media (max-width: 560px) {
    .ow-footer { padding: 48px 0 28px; }
    .ow-footer__inner { gap: 22px; }
    .ow-footer__logo { height: 40px; }
    .ow-footer__nav { font-size: 12px; }
    .ow-footer__legal { font-size: 11px; gap: 6px; }
    .ow-footer__sep { margin: 0 4px; }
}

/* ==========================================================================
   Scroll reveal (optional - uses animate.css class .wow if loaded)
   ========================================================================== */