:root{
    --brand-primary:#00b5c1;
    --brand-primary-dark:#006b73;
    --brand-primary-light:#00a8b5;
    --color-title:#333333;
    --color-body:#666666;
    --color-light:#999999;
    --color-white:#ffffff;
    --color-black:#111111;
    --color-bg-light:#f8f8f6;
    --color-bg-dark:#1a1a1a;
    --color-border:#e8e8e8;
    --font-heading:'Montserrat','Helvetica Neue',Arial,sans-serif;
    --font-body:'Inter','Helvetica Neue',Arial,sans-serif;
    --transition:all 0.3s ease;
    --shadow-sm:0 2px 12px rgba(0,0,0,0.06);
    --shadow-md:0 8px 32px rgba(0,0,0,0.10);
    --shadow-lg:0 16px 48px rgba(0,0,0,0.14);
    --max-width:1400px;
    --section-padding:90px 0
}
 *,::after,::before{
    box-sizing:border-box;
    margin:0;
    padding:0
}
 html{
    scroll-behavior:smooth;
    font-size:16px
}
 body{
    font-family:var(--font-body);
    color:var(--color-body);
    background:var(--color-white);
    line-height:1.7;
    -webkit-font-smoothing:antialiased
}
 img{
    max-width:100%;
    height:auto;
    display:block
}
 a{
    text-decoration:none;
    color:inherit;
    transition:var(--transition)
}
 ol,ul{
    list-style:none
}
 button{
    cursor:pointer;
    border:none;
    background:0 0;
    font-family:inherit
}
 h1,h2,h3,h4,h5,h6{
    font-family:var(--font-heading);
    color:var(--color-title);
    line-height:1.2;
    font-weight:700
}
 .section-label{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-size:11px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    color:var(--brand-primary);
    margin-bottom:16px
}
 .section-label::before{
    content:'';
    display:block;
    width:24px;
    height:1px;
    background:var(--brand-primary);
    flex-shrink:0
}
 .section-title{
    font-size:34px;
    font-weight:700;
    color:var(--color-title);
    line-height:1.2;
    margin-bottom:20px
}
 .section-desc{
    font-size:15px;
    color:var(--color-body);
    line-height:1.8
}
 .section-heading{
    display:flex;
    flex-direction:column;
    gap:18px
}
 .section-heading .section-title{
    margin-bottom:0
}
 .section-heading .section-desc{
    margin-bottom:0;
    font-size:16px
}
 .section-heading--split{
    flex-direction:row;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px
}
 .section-heading-main{
    display:flex;
    flex-direction:column;
    gap:18px;
    min-width:0;
    max-width:80%
}
 .section-heading--center{
    text-align:center;
    align-items:center
}
 .section-heading--center .section-desc{
    margin:0 auto
}
 .section-heading--light .section-title{
    color:var(--color-white)
}
 .section-heading--light .section-desc{
    color:rgba(255,255,255,.65)
}
 .container{
    max-width:var(--max-width);
    margin:0 auto;
    padding:0
}
 .section{
    padding:var(--section-padding)
}
 .section--dark{
    background:var(--color-bg-dark);
    color:var(--color-white)
}
 .section--light{
    background:var(--color-bg-light)
}
 .btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 20px;
    font-size:14px;
    font-weight:600;
    letter-spacing:1px;
    text-transform:uppercase;
    border-radius:5px;
    transition:var(--transition);
    cursor:pointer
}
 .btn--primary{
    background:var(--brand-primary);
    color:var(--color-white);
    border:1px solid var(--brand-primary)
}
 .btn--primary:hover{
    background:var(--brand-primary-dark);
    border-color:var(--brand-primary-dark);
    transform:translateY(-1px)
}
 .btn--outline{
    background:0 0;
    color:var(--color-white);
    border:1px solid rgba(255,255,255,.6)
}
 .btn--outline:hover{
    background:var(--color-white);
    color:var(--color-title);
    border-color:var(--color-white)
}
 .btn--outline-dark{
    background:0 0;
    color:var(--color-title);
    border:1px solid var(--color-title)
}
 .btn--outline-dark:hover{
    background:var(--color-title);
    color:var(--color-white)
}
 @keyframes pulse-ring{
    0%{
        box-shadow:0 0 0 0 rgba(37,211,102,.4)
    }
     70%{
        box-shadow:0 0 0 10px rgba(37,211,102,0)
    }
     100%{
        box-shadow:0 0 0 0 rgba(37,211,102,0)
    }
}
 .btn-whatsapp{
    border-color:rgba(37,211,102,.5)!important
}
 .btn-whatsapp:hover{
    background:#25d366!important;
    border-color:#25d366!important;
    color:#fff!important
}
 .btn-whatsapp.pulse{
    animation:pulse-ring .6s ease
}
 .fade-in{
    opacity:0;
    transform:translateY(30px);
    transition:opacity .7s ease,transform .7s ease
}
 .fade-in.visible{
    opacity:1;
    transform:translateY(0)
}
 .fade-in-delay-1{
    transition-delay:0.1s
}
 .fade-in-delay-2{
    transition-delay:0.2s
}
 .fade-in-delay-3{
    transition-delay:0.3s
}
 .fade-in-delay-4{
    transition-delay:0.4s
}
 .fade-in-delay-5{
    transition-delay:0.5s
}
 .fade-in-delay-6{
    transition-delay:0.6s
}
 .site-header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:1000;
    padding:0 60px;
    height:80px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    transition:background .4s ease,box-shadow .4s ease,height .3s ease;
    background:0 0;
    backdrop-filter:blur(10px)
}
 .site-header.scrolled{
    background:rgba(255,255,255,.97);
    box-shadow:0 1px 20px rgba(0,0,0,.08);
    height:68px
}
 .site-header.scrolled .nav-logo{
    color:var(--color-title)
}
 .site-header.scrolled .nav-brand-positioning,.site-header.scrolled .nav-logo-tagline{
    color:var(--color-text)
}
 .site-header.scrolled .nav-menu .nav-link,.site-header.scrolled .nav-menu>a{
    color:var(--color-title)
}
 .site-header.scrolled .nav-menu .nav-link:hover,.site-header.scrolled .nav-menu>a:hover{
    color:var(--brand-primary)
}
 .site-header.site-header--inner,
 body:has(.page_banner) .site-header,
 body:has(.product_detail) .site-header{
    background:rgba(255,255,255,.97);
    box-shadow:0 1px 20px rgba(0,0,0,.08)
}
 .site-header.site-header--inner .nav-brand-positioning,
 .site-header.site-header--inner .nav-logo-tagline,
 .site-header.site-header--inner .nav-menu .nav-link,
 .site-header.site-header--inner .nav-menu>a,
 body:has(.page_banner) .site-header .nav-brand-positioning,
 body:has(.page_banner) .site-header .nav-logo-tagline,
 body:has(.page_banner) .site-header .nav-menu .nav-link,
 body:has(.page_banner) .site-header .nav-menu>a,
 body:has(.product_detail) .site-header .nav-brand-positioning,
 body:has(.product_detail) .site-header .nav-logo-tagline,
 body:has(.product_detail) .site-header .nav-menu .nav-link,
 body:has(.product_detail) .site-header .nav-menu>a{
    color:var(--color-title)
}
 .site-header.site-header--inner .nav-menu .nav-link.active,
 .site-header.site-header--inner .nav-menu .nav-link:hover,
 .site-header.site-header--inner .nav-menu>a.active,
 .site-header.site-header--inner .nav-menu>a:hover,
 body:has(.page_banner) .site-header .nav-menu .nav-link.active,
 body:has(.page_banner) .site-header .nav-menu .nav-link:hover,
 body:has(.page_banner) .site-header .nav-menu>a.active,
 body:has(.page_banner) .site-header .nav-menu>a:hover,
 body:has(.product_detail) .site-header .nav-menu .nav-link.active,
 body:has(.product_detail) .site-header .nav-menu .nav-link:hover,
 body:has(.product_detail) .site-header .nav-menu>a.active,
 body:has(.product_detail) .site-header .nav-menu>a:hover{
    color:var(--brand-primary)
}
 .site-header.site-header--inner .nav-products-toggle,
 .site-header.site-header--inner .nav-search-btn,
 body:has(.page_banner) .site-header .nav-products-toggle,
 body:has(.page_banner) .site-header .nav-search-btn,
 body:has(.product_detail) .site-header .nav-products-toggle,
 body:has(.product_detail) .site-header .nav-search-btn{
    color:var(--color-title)
}
 .site-header.site-header--inner .nav-toggle,
 body:has(.page_banner) .site-header .nav-toggle,
 body:has(.product_detail) .site-header .nav-toggle{
    border-color:rgba(20,30,26,.2)
}
 .site-header.site-header--inner .nav-toggle span,
 body:has(.page_banner) .site-header .nav-toggle span,
 body:has(.product_detail) .site-header .nav-toggle span{
    background:#1d2421
}
 .nav-brand{
    display:flex;
    align-items:center;
    gap:18px;
    min-width:0
}
 .nav-logo{
    display:inline-flex;
    flex-direction:column;
    gap:4px;
    text-align:center
}
 .nav-logo img{
    display:block;
    height:40px;
    width:auto
}
 .nav-logo-tagline{
    font-size:12px;
    line-height:1;
    letter-spacing:1.4px;
    color:#fff;
    white-space:nowrap
}
 .nav-brand-positioning{
    font-size:15px;
    line-height:1.4;
    color:rgba(255,255,255,.9);
    max-width:340px
}
 .nav-menu{
    display:flex;
    align-items:center;
    gap:36px;
    position:relative
}
 .nav-menu .nav-link,.nav-menu>a{
    font-size:16px;
    font-weight:500;
    color:var(--color-white);
    position:relative;
    padding-bottom:4px;
    display:inline-flex;
    align-items:center;
    gap:8px
}
 .nav-menu .nav-link::after,.nav-menu>a::after{
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    width:0;
    height:1px;
    background:var(--brand-primary);
    transition:width .3s ease
}
 .nav-item{
    position:relative
}
 .nav-item--has-dropdown{
    padding-bottom:0;
    margin-bottom:0
}
 .nav-item--has-dropdown::after{
    content:'';
    position:absolute;
    top:100%;
    left:-48px;
    right:-48px;
    height:14px
}
 .nav-link i{
    font-size:11px;
    opacity:.8;
    transition:transform .3s ease
}
 .nav-item--has-dropdown:hover .nav-link i{
    transform:rotate(180deg)
}
 .nav-item--has-dropdown:focus-within .nav-link i{
    transform:rotate(180deg)
}
 .nav-item--has-dropdown.is-open .nav-link i{
    transform:rotate(180deg)
}
 .nav-dropdown{
    position:absolute;
    top:calc(100% + 18px);
    left:50%;
    transform:translateX(-50%) translateY(8px);
    width:960px;
    background:#fff;
    border:1px solid #e2e8e5;
    border-radius:8px;
    padding:20px 22px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .25s ease,transform .25s ease;
    z-index:30
}
 .nav-item--has-dropdown:hover .nav-dropdown{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0)
}
 .nav-item--has-dropdown:focus-within .nav-dropdown{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0)
}
 .nav-dropdown:hover{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0)
}
 .nav-item--has-dropdown.is-open .nav-dropdown{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0)
}
 .nav-dropdown-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(220px,1fr));
    gap:18px 20px
}
 .nav-group{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0
}
 .nav-group-title{
    font-size:14px;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#0f1412;
    margin-bottom:0;
    line-height:1.4
}
 .nav-sub-link{
    font-size:14px;
    color:#4d5753;
    line-height:1.5;
    text-transform:none;
    letter-spacing:0;
    padding-left:10px;
    position:relative
}
 .nav-sub-link::before{
    content:'';
    position:absolute;
    left:0;
    top:8px;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#9fb0a8
}
 .nav-group-title:hover,.nav-sub-link:hover{
    color:var(--brand-primary)
}
 .nav-sub-link:hover::before{
    background:var(--brand-primary)
}
 .nav-quote{
    margin-left:16px;
    padding:10px 24px;
    font-size:12px;
    font-weight:700;
    letter-spacing:1.2px;
    text-transform:uppercase;
    background:var(--brand-primary);
    color:var(--color-white);
    border-radius:5px;
    transition:var(--transition)
}
 .nav-quote:hover{
    background:var(--brand-primary-dark);
    transform:translateY(-1px)
}
 .hero{
    position:relative;
    height:860px;
    min-height:700px;
    overflow:hidden;
    display:flex;
    align-items:center
}
 .hero-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center 30%;
    background-repeat:no-repeat;
    transform:scale(1.05);
    transition:transform 8s ease
}
 .hero-bg.loaded{
    transform:scale(1)
}
 .hero-overlay{
    position:absolute;
    inset:0;
    background:rgb(0 0 0 / 20%)
}
 .hero-title{
    font-size:54px;
    font-weight:700;
    color:var(--color-white);
    margin-bottom:20px
}
 .hero-subtitle{
    font-size:20px;
    color:var(--color-white);
    line-height:1.65;
    margin-bottom:34px
}
 .hero-title:first-child{
    color:var(--brand-primary)
}
 .hero-slide:first-child .hero-content .hero-subtitle{
    color:#333
}
 .hero-actions{
    display:flex;
    gap:16px;
    flex-wrap:wrap;
    justify-content:center
}
 .hero-actions .btn.btn--outline{
    background:var(--color-white);
    color:#333
}
 .hero-scroll{
    position:absolute;
    bottom:40px;
    left:50%;
    transform:translateX(-50%);
    z-index:2;
    display:flex;
    align-items:center;
    gap:12px;
    color:rgba(255,255,255,.6);
    font-size:11px;
    letter-spacing:1.8px;
    text-transform:uppercase
}
 .hero-scroll::before{
    content:'';
    display:block;
    width:40px;
    height:1px;
    background:rgba(255,255,255,.4)
}
 .cert-gallery{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:16px;
    margin-top:50px;
    padding-top:40px;
    border-top:1px solid var(--color-border)
}
 .cert-doc{
    border:1px solid var(--color-border);
    border-radius:10px;
    overflow:hidden;
    background:#f8f8f8;
    aspect-ratio:3/4;
    transition:var(--transition);
    cursor:pointer
}
 .cert-doc:hover{
    border-color:var(--brand-primary);
    box-shadow:0 4px 20px rgba(0,137,147,.12);
    transform:translateY(-3px)
}
 .cert-doc img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}
 .solutions{
    padding:var(--section-padding);
    background:var(--color-white)
}
 .solutions-header{
    margin-bottom:60px
}
 .solutions-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px
}
 .solution-card{
    position:relative;
    overflow:hidden;
    height:440px;
    cursor:pointer
}
 .solution-card-img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .6s ease
}
 .solution-card:hover .solution-card-img{
    transform:scale(1.05)
}
 .solution-card-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.3) 25%,transparent 50%);
    transition:var(--transition);
    opacity:1
}
 .solution-card:hover .solution-card-overlay{
    background:linear-gradient(to top,rgba(0,0,0,.3) 25%,transparent 50%)
}
 .solution-card-content{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    padding:36px;
    color:var(--color-bg-light)
}
 .solution-card-number{
    font-size:14px;
    font-weight:700;
    letter-spacing:2px;
    color:var(--color-bg-light);
    margin-bottom:10px;
    display:block
}
 .solution-card-title{
    font-size:18px;
    font-weight:700;
    color:var(--color-white);
    margin-bottom:10px
}
 .solution-card-desc{
    font-size:15px;
    line-height:1.6;
    max-height:0;
    overflow:hidden;
    transition:max-height .4s ease,opacity .4s ease;
    opacity:0
}
 .solution-card:hover .solution-card-desc{
    max-height:100px;
    opacity:1
}
 .core-systems{
    padding:var(--section-padding);
    background:var(--color-bg-light)
}
 .core-systems-header{
    margin-bottom:44px
}
 .core-systems-header .view-more-btn{
    margin-top:20px;
    margin-bottom:0
}
 .core-systems-inner{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center
}
 .core-systems-visual{
    position:relative;
    height:560px;
    overflow:hidden;
    border-radius:10px
}
 .system-img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0;
    transition:opacity .5s ease
}
 .system-img.active{
    opacity:1
}
 .core-systems-content{
    padding:20px 0
}
 .systems-tabs{
    display:flex;
    flex-direction:column;
    gap:0;
    margin-top:0
}
 .system-tab{
    padding:24px 0;
    border-bottom:1px solid var(--color-border);
    cursor:pointer;
    transition:var(--transition)
}
 .system-tab:first-child{
    border-top:1px solid var(--color-border)
}
 .system-tab-header{
    display:flex;
    align-items:center;
    justify-content:space-between
}
 .system-tab-title{
    font-size:17px;
    font-weight:600;
    color:var(--color-title);
    font-family:var(--font-heading);
    transition:color .3s ease
}
 .system-tab-icon{
    width:20px;
    height:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--color-light);
    transition:var(--transition);
    font-size:24px;
    line-height:1
}
 .system-tab.active{
    border-bottom-color:var(--brand-primary)
}
 .system-tab.active .system-tab-title{
    color:var(--brand-primary)
}
 .system-tab.active .system-tab-icon{
    color:var(--brand-primary);
    transform:rotate(45deg)
}
 .system-tab-body{
    display:none;
    overflow:hidden;
    padding-top:0
}
 .system-tab.active .system-tab-body{
    padding-top:14px
}
 .system-tab-body p{
    font-size:15px;
    color:var(--color-body);
    line-height:1.7
}
 .system-tab-body .system-link{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-top:12px;
    font-size:13px;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase;
    color:var(--brand-primary)
}
 .system-tab-body .system-link:hover{
    gap:10px
}
 .projects{
    padding:var(--section-padding);
    background:var(--color-white)
}
 .projects-header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:50px
}
 .projects-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px
}
 .project-card{
    position:relative;
    overflow:hidden;
    border-radius:10px
}
 .project-card-img-wrap{
    position:relative;
    overflow:hidden;
    height:320px
}
 .project-card-img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .6s ease
}
 .project-card:hover .project-card-img{
    transform:scale(1.06)
}
 .project-card-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.6) 0,transparent 60%);
    opacity:0;
    transition:opacity .4s ease
}
 .project-card:hover .project-card-overlay{
    opacity:1
}
 .project-card-info{
    padding:20px 0;
    border-bottom:1px solid var(--color-border)
}
 .project-card-type{
    font-size:11px;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
    color:var(--brand-primary);
    margin-bottom:8px
}
 .project-card-title{
    font-size:18px;
    font-weight:600;
    color:var(--color-title);
    line-height:1.3
}
 .why-us{
    padding:var(--section-padding)
}
 .why-us .section-title{
    color:var(--color-white)
}
 .why-us .section-desc{
    color:rgba(255,255,255,.65)
}
 .why-us-header{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:start;
    margin-bottom:70px
}
 .why-us-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1px;
    background:rgba(255,255,255,.08)
}
 .why-card{
    background:rgb(255 255 255 / 60%);
    padding:44px 36px;
    transition:var(--transition);
    position:relative;
    overflow:hidden
}
 .why-card::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:0;
    height:2px;
    background:var(--brand-primary);
    transition:width .4s ease
}
 .why-card:hover::before{
    width:100%
}
 .why-card:hover{
    background:var(--color-bg-light)
}
 .why-card-num{
    font-size:42px;
    font-weight:800;
    color:var(--brand-primary);
    font-family:var(--font-heading);
    line-height:1;
    margin-bottom:16px;
    letter-spacing:-.8px
}
 .why-card-title{
    font-size:16px;
    font-weight:700;
    color:var(--color-title);
    margin-bottom:12px;
    font-family:var(--font-heading)
}
 .why-card-desc{
    font-size:15px;
    color:var(--color-title);
    line-height:1.7
}
 .factory{
    padding:var(--section-padding);
    background:var(--color-white)
}
 .factory-inner{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:stretch
}
 .factory-visual{
    position:relative;
    display:flex;
    height:100%
}
 .factory-visual .factory-img-wrap{
    height:100%
}
 .factory-img-accent{
    position:absolute;
    bottom:-30px;
    right:-30px;
    width:200px;
    height:150px;
    object-fit:cover;
    border:4px solid var(--color-white);
    box-shadow:var(--shadow-lg);
    border-radius:10px
}
 .factory-content{
    padding:20px 0
}
 .factory-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
    margin:40px 0;
    padding:32px 0;
    border-top:1px solid var(--color-border);
    border-bottom:1px solid var(--color-border);
    justify-items:center
}
 .factory-stat-num{
    font-size:30px;
    font-weight:800;
    color:var(--brand-primary);
    font-family:var(--font-heading);
    line-height:1;
    margin-bottom:8px
}
 .factory-stat-label{
    font-size:15px;
    color:var(--color-body);
    line-height:1.4
}
 .factory-actions{
    display:flex;
    gap:16px;
    margin-top:36px
}
 .certifications-header{
    margin-bottom:60px
}
 .certs-row{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:60px;
    flex-wrap:wrap
}
 .cert-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:16px;
    opacity:.75;
    transition:opacity .3s ease
}
 .cert-item:hover{
    opacity:1
}
 .cert-badge{
    width:80px;
    height:80px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:50%;
    font-size:18px;
    font-weight:800;
    color:var(--brand-primary);
    font-family:var(--font-heading);
    letter-spacing:-.8px;
    box-shadow:var(--shadow-sm)
}
 .cert-name{
    font-size:12px;
    font-weight:600;
    letter-spacing:1.2px;
    text-transform:uppercase;
    color:var(--color-body)
}
 .cert-divider{
    width:1px;
    height:50px;
    background:var(--color-border)
}
 .insights{
    padding:var(--section-padding);
    background:var(--color-white)
}
 .insights-header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:50px
}
 .insights-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:36px
}
 .insight-card{
    cursor:pointer
}
 .insight-card-img-wrap{
    overflow:hidden;
    height:220px;
    margin-bottom:24px;
    border-radius:10px
}
 .insight-card-img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .5s ease
}
 .insight-card:hover .insight-card-img{
    transform:scale(1.04)
}
 .insight-card-meta{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:12px
}
 .insight-card-tag{
    font-size:10px;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
    color:var(--brand-primary);
    padding:3px 10px;
    border:1px solid var(--brand-primary);
    border-radius:10px
}
 .insight-card-date{
    font-size:12px;
    color:var(--color-light)
}
 .insight-card-title{
    font-size:17px;
    font-weight:700;
    color:var(--color-title);
    line-height:1.4;
    margin-bottom:10px;
    transition:color .3s ease
}
 .insight-card:hover .insight-card-title{
    color:var(--brand-primary)
}
 .insight-card-desc{
    font-size:14px;
    color:var(--color-body);
    line-height:1.6
}
 .cta-section{
    padding:120px 0;
    background:var(--color-bg-dark);
    position:relative;
    overflow:hidden;
    text-align:center
}
 .cta-section::before{
    content:'';
    position:absolute;
    top:-200px;
    left:50%;
    transform:translateX(-50%);
    width:600px;
    height:600px;
    background:radial-gradient(circle,rgba(0,137,147,.12) 0,transparent 70%);
    pointer-events:none
}
 .cta-label{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-size:11px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    color:var(--brand-primary-light);
    margin-bottom:20px
}
 .cta-label::before{
    content:'';
    display:block;
    width:24px;
    height:1px;
    background:var(--brand-primary-light);
    flex-shrink:0
}
 .cta-title{
    font-size:44px;
    font-weight:800;
    color:var(--color-white);
    line-height:1.15;
    margin-bottom:20px;
    max-width:700px;
    margin-left:auto;
    margin-right:auto
}
 .cta-desc{
    font-size:16px;
    color:rgba(255,255,255,.6);
    line-height:1.7;
    max-width:600px;
    margin:0 auto 48px
}
 .cta-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    flex-wrap:wrap
}
 .cta-contact-info{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:40px;
    margin-top:48px;
    padding-top:40px;
    border-top:1px solid rgba(255,255,255,.08)
}
 .cta-contact-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px
}
 .cta-contact-label{
    font-size:11px;
    font-weight:600;
    letter-spacing:1.4px;
    text-transform:uppercase;
    color:rgba(255,255,255,.4)
}
 .cta-contact-value{
    font-size:15px;
    color:rgba(255,255,255,.85);
    font-weight:500
}
 .site-footer{
    position:relative;
    overflow:hidden;
    background:#111;
    color:rgba(255,255,255,.6)
}
 .footer-deco-logo{
    position:absolute;
    width:50%;
    height:auto;
    opacity:.01;
    pointer-events:none;
    user-select:none;
    z-index:0;
    filter:brightness(0) invert(1)
}
 .footer-deco-logo--tl{
    left:-52px
}
 .footer-deco-logo--br{
    right:-66px;
    bottom:0
}
 .footer-top{
    padding:var(--section-padding);
    border-bottom:1px solid rgba(255,255,255,.07);
    text-align:center;
    padding-bottom:60px
}
 .footer-top .container{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px
}
 .footer-brand-name{
    display:inline-flex;
    flex-direction:column;
    align-items:center;
    gap:6px
}
 .footer-brand-name img{
    display:block;
    height:60px;
    width:auto
}
 .footer-logo-tagline{
    font-size:10px;
    line-height:1;
    letter-spacing:1.8px;
    color:rgba(255,255,255,.82);
    white-space:nowrap
}
 .footer-company-name{
    font-size:16px;
    color:rgba(255,255,255,.35);
    letter-spacing:.5px
}
 .footer-social{
    display:flex;
    gap:18px;
    margin-top:10px
}
 .footer-social a{
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.15);
    color:rgba(255,255,255,.55);
    font-size:16px;
    transition:all .3s ease
}
 .footer-social a:hover{
    background:var(--brand-primary);
    border-color:var(--brand-primary);
    color:#fff
}
 .footer-main{
    position:relative;
    z-index:1;
    padding:var(--section-padding);
    padding-top:60px;
    border-bottom:1px solid rgba(255,255,255,.07)
}
 .footer-main-grid{
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(220px,0.95fr) minmax(0,1.35fr);
    gap:42px;
    align-items:start
}
 .footer-contact-col,.footer-form-col,.footer-nav-col{
    min-width:0
}
 .footer-form-col .footer-form-intro{
    font-size:16px;
    color:rgba(255,255,255,.7);
    line-height:1.65;
    margin-bottom:24px;
    max-width:420px
}
 .footer-enquiry-form{
    display:flex;
    flex-direction:column;
    gap:12px
}
 .footer-enquiry-form .input{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px
}
 .footer-enquiry-form .input>div{
    min-width:0
}
 .footer-form-row{
    display:flex;
    gap:12px
}
 .footer-form-row--2col{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px
}
 .footer-enquiry-form input,.footer-enquiry-form textarea{
    width:100%;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    border-radius:3px;
    padding:11px 14px;
    font-size:13px;
    color:rgba(255,255,255,.75);
    font-family:var(--font-body);
    outline:0;
    transition:border-color .3s ease
}
 .footer-enquiry-form input::placeholder,.footer-enquiry-form textarea::placeholder{
    color:rgba(255,255,255,.3)
}
 .footer-enquiry-form input:focus,.footer-enquiry-form textarea:focus{
    border-color:var(--brand-primary)
}
 .footer-enquiry-form textarea{
    height:110px;
    resize:none
}
 .footer-enquiry-form .submit{
    display:flex;
    align-items:center
}
 .footer-form-btn{
    background:var(--brand-primary);
    color:#fff;
    border:none;
    padding:13px 28px;
    font-size:14px;
    font-weight:700;
    letter-spacing:1.4px;
    text-transform:uppercase;
    cursor:pointer;
    border-radius:3px;
    transition:background .3s ease;
    align-self:flex-start
}
 .footer-form-btn:hover{
    background:var(--brand-primary-dark)
}
 .form-success{
    color:var(--brand-primary-light);
    font-size:13px;
    padding:10px 0
}
 .footer-nav-col{
    padding-top:4px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:32px;
    align-content:start
}
 .footer-col-title{
    font-size:16px;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
    color:var(--color-white);
    margin-bottom:20px
}
 .footer-nav-group--products{
    margin-top:0
}
 .footer-links{
    display:flex;
    flex-direction:column;
    gap:10px
}
 .footer-links a{
    font-size:15px;
    color:rgba(255,255,255,.5);
    transition:color .3s ease
}
 .footer-links a:hover{
    color:var(--brand-primary-light)
}
 .footer-contact-col{
    padding-top:4px
}
 .footer-contact-list{
    display:flex;
    flex-direction:column;
    gap:16px;
    margin-bottom:28px
}
 .footer-contact-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px
}
 .footer-contact-item{
    display:flex;
    flex-direction:column;
    gap:3px
}
 .footer-contact-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:1.4px;
    text-transform:uppercase;
    color:rgba(255,255,255,.28)
}
 .footer-contact-value{
    font-size:14px;
    color:rgba(255,255,255,.7);
    line-height:1.5;
    font-weight:500
}
 .footer-contact-list a,.footer-contact-value a{
    color:rgba(255,255,255,.7);
    transition:color .3s ease
}
 .footer-contact-list a:hover,.footer-contact-value a:hover{
    color:var(--brand-primary-light)
}
 .foot_subscribe,.footer-subscribe-form{
    display:flex;
    gap:0;
    border:1px solid rgba(255,255,255,.15);
    border-radius:3px;
    overflow:hidden
}
 .foot_subscribe input,.footer-subscribe-form input{
    flex:1;
    background:rgba(255,255,255,.05);
    border:none;
    padding:11px 14px;
    font-size:14px;
    color:rgba(255,255,255,.7);
    font-family:var(--font-body);
    outline:0
}
 .foot_subscribe input::placeholder,.footer-subscribe-form input::placeholder{
    color:rgba(255,255,255,.3)
}
 .foot_subscribe button,.footer-subscribe-form button{
    background:var(--brand-primary);
    color:#fff;
    border:none;
    padding:11px 18px;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
    white-space:nowrap;
    transition:background .3s ease
}
 .foot_subscribe button:hover,.footer-subscribe-form button:hover{
    background:var(--brand-primary-dark)
}
 .footer-bottom{
    position:relative;
    z-index:1;
    padding:20px 0
}
 .footer-bottom .container{
    display:flex;
    align-items:center;
    justify-content:space-between
}
 .footer-copyright{
    font-size:14px;
    color:rgba(255,255,255,.28)
}
 .footer-bottom-links{
    display:flex;
    gap:24px
}
 .footer-bottom-links a{
    font-size:14px;
    color:rgba(255,255,255,.28);
    transition:color .3s ease
}
 .footer-bottom-links a:hover{
    color:rgba(255,255,255,.6)
}
 .deco-dots{
    position:absolute;
    width:180px;
    height:180px;
    background-image:radial-gradient(circle,rgba(0,137,147,.18) 1.5px,transparent 1.5px);
    background-size:18px 18px;
    pointer-events:none;
    z-index:0
}
 .deco-dots--tr{
    top:40px;
    right:40px
}
 .deco-dots--bl{
    bottom:40px;
    left:40px
}
 .deco-line-v{
    position:absolute;
    top:0;
    bottom:0;
    width:1px;
    background:linear-gradient(to bottom,transparent,rgba(0,137,147,.15) 30%,rgba(0,137,147,.15) 70%,transparent);
    pointer-events:none;
    z-index:0
}
 .deco-line-v--right{
    right:80px
}
 .certifications,.contact-section,.factory,.solutions{
    position:relative;
    overflow:hidden
}
 .nav-actions{
    display:flex;
    align-items:center;
    gap:12px
}
 .nav-search-btn{
    width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:rgba(255,255,255,.85);
    font-size:14px;
    border-radius:50%;
    transition:var(--transition)
}
 .site-header.scrolled .nav-search-btn{
    color:var(--color-title)
}
 .nav-search-btn:hover{
    background:rgba(0,137,147,.12);
    color:var(--brand-primary)
}
 .about_page .site-header,.contact_page .site-header,.faq_page .site-header,.list_case_page .site-header,.list_news_page .site-header,.list_products_page .site-header,.oem_odm_page .site-header,.product_detail_page .site-header{
    background:rgba(255,255,255,.97);
    box-shadow:0 1px 20px rgba(0,0,0,.08)
}
 .about_page .nav-logo,.contact_page .nav-logo,.faq_page .nav-logo,.list_case_page .nav-logo,.list_news_page .nav-logo,.list_products_page .nav-logo,.oem_odm_page .nav-logo,.product_detail_page .nav-logo{
    color:var(--color-title)
}
 .about_page .nav-brand-positioning,.about_page .nav-logo-tagline,.about_page .nav-menu .nav-link,.about_page .nav-menu>a,.contact_page .nav-brand-positioning,.contact_page .nav-logo-tagline,.contact_page .nav-menu .nav-link,.contact_page .nav-menu>a,.faq_page .nav-brand-positioning,.faq_page .nav-logo-tagline,.faq_page .nav-menu .nav-link,.faq_page .nav-menu>a,.list_case_page .nav-brand-positioning,.list_case_page .nav-logo-tagline,.list_case_page .nav-menu .nav-link,.list_case_page .nav-menu>a,.list_news_page .nav-brand-positioning,.list_news_page .nav-logo-tagline,.list_news_page .nav-menu .nav-link,.list_news_page .nav-menu>a,.list_products_page .nav-brand-positioning,.list_products_page .nav-logo-tagline,.list_products_page .nav-menu .nav-link,.list_products_page .nav-menu>a,.oem_odm_page .nav-brand-positioning,.oem_odm_page .nav-logo-tagline,.oem_odm_page .nav-menu .nav-link,.oem_odm_page .nav-menu>a,.product_detail_page .nav-brand-positioning,.product_detail_page .nav-logo-tagline,.product_detail_page .nav-menu .nav-link,.product_detail_page .nav-menu>a{
    color:var(--color-title)
}
 .about_page .nav-menu .nav-link.active,.about_page .nav-menu .nav-link:hover,.about_page .nav-menu>a.active,.about_page .nav-menu>a:hover,.contact_page .nav-menu .nav-link.active,.contact_page .nav-menu .nav-link:hover,.contact_page .nav-menu>a.active,.contact_page .nav-menu>a:hover,.faq_page .nav-menu .nav-link.active,.faq_page .nav-menu .nav-link:hover,.faq_page .nav-menu>a.active,.faq_page .nav-menu>a:hover,.list_case_page .nav-menu .nav-link.active,.list_case_page .nav-menu .nav-link:hover,.list_case_page .nav-menu>a.active,.list_case_page .nav-menu>a:hover,.list_news_page .nav-menu .nav-link.active,.list_news_page .nav-menu .nav-link:hover,.list_news_page .nav-menu>a.active,.list_news_page .nav-menu>a:hover,.list_products_page .nav-menu .nav-link.active,.list_products_page .nav-menu .nav-link:hover,.list_products_page .nav-menu>a.active,.list_products_page .nav-menu>a:hover,.oem_odm_page .nav-menu .nav-link.active,.oem_odm_page .nav-menu .nav-link:hover,.oem_odm_page .nav-menu>a.active,.oem_odm_page .nav-menu>a:hover,.product_detail_page .nav-menu .nav-link.active,.product_detail_page .nav-menu .nav-link:hover,.product_detail_page .nav-menu>a.active,.product_detail_page .nav-menu>a:hover{
    color:var(--brand-primary)
}
 .about_page .nav-products-toggle,.about_page .nav-search-btn,.contact_page .nav-products-toggle,.contact_page .nav-search-btn,.faq_page .nav-products-toggle,.faq_page .nav-search-btn,.list_case_page .nav-products-toggle,.list_case_page .nav-search-btn,.list_news_page .nav-products-toggle,.list_news_page .nav-search-btn,.list_products_page .nav-products-toggle,.list_products_page .nav-search-btn,.oem_odm_page .nav-products-toggle,.oem_odm_page .nav-search-btn,.product_detail_page .nav-products-toggle,.product_detail_page .nav-search-btn{
    color:var(--color-title)
}
 .about_page .nav-toggle,.contact_page .nav-toggle,.faq_page .nav-toggle,.list_case_page .nav-toggle,.list_news_page .nav-toggle,.list_products_page .nav-toggle,.oem_odm_page .nav-toggle,.product_detail_page .nav-toggle{
    border-color:rgba(20,30,26,.2)
}
 .about_page .nav-toggle span,.contact_page .nav-toggle span,.faq_page .nav-toggle span,.list_case_page .nav-toggle span,.list_news_page .nav-toggle span,.list_products_page .nav-toggle span,.oem_odm_page .nav-toggle span,.product_detail_page .nav-toggle span{
    background:#1d2421
}
 .about_page .site-footer .container,.contact_page .site-footer .container,.faq_page .site-footer .container,.list_case_page .site-footer .container,.list_news_page .site-footer .container,.list_products_page .site-footer .container,.oem_odm_page .site-footer .container,.product_detail_page .site-footer .container{
    max-width:1400px;
    padding-left:32px;
    padding-right:32px
}
 .search-overlay{
    position:fixed;
    inset:0;
    background:rgba(10,10,10,.96);
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    pointer-events:none;
    transition:opacity .3s ease
}
 .search-overlay.active{
    opacity:1;
    pointer-events:all
}
 .search-close{
    position:absolute;
    top:32px;
    right:40px;
    color:rgba(255,255,255,.6);
    font-size:22px;
    transition:var(--transition)
}
 .search-close:hover{
    color:var(--brand-primary)
}
 .search-inner{
    text-align:center;
    width:100%;
    max-width:700px;
    padding:0 40px
}
 .search-hint{
    font-size:13px;
    letter-spacing:1.8px;
    text-transform:uppercase;
    color:rgba(255,255,255,.4);
    margin-bottom:32px
}
 .search-input-wrap{
    display:flex;
    align-items:center;
    gap:16px;
    border-bottom:2px solid rgba(255,255,255,.2);
    padding-bottom:16px;
    transition:border-color .3s ease
}
 .search-input-wrap:focus-within{
    border-color:var(--brand-primary)
}
 .search-input-wrap i{
    color:rgba(255,255,255,.4);
    font-size:20px
}
 .search-input-wrap input{
    flex:1;
    background:0 0;
    border:none;
    outline:0;
    font-size:28px;
    color:var(--color-white);
    font-family:var(--font-heading)
}
 .search-input-wrap input::placeholder{
    color:rgba(255,255,255,.25)
}
 .hero{
    position:relative;
    height:860px;
    min-height:700px;
    overflow:hidden
}
 .hero-slides{
    position:absolute;
    inset:0
}
 .hero-slides .swiper-wrapper{
    height:100%
}
 .hero-slide{
    position:relative;
    height:100%
}
 .hero-slide .hero-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center 30%;
    background-repeat:no-repeat;
    transform:scale(1.05);
    transition:transform 8s ease
}
 .hero-slide.swiper-slide-active .hero-bg{
    transform:scale(1)
}
 .hero-slide .hero-overlay{
    position:absolute;
    inset:0;
    background:rgb(0 0 0 / 5%);
    opacity:0
}
 .hero-slide .hero-content{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    z-index:2;
    width:max-content;
    max-width:80%;
    text-align:center
}
 .hero-next,.hero-prev{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:10;
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.25);
    color:var(--color-white);
    font-size:16px;
    border-radius:50%;
    transition:var(--transition);
    backdrop-filter:blur(4px)
}
 .hero-prev{
    left:32px
}
 .hero-next{
    right:32px
}
 .hero-next:hover,.hero-prev:hover{
    background:var(--brand-primary);
    border-color:var(--brand-primary)
}
 .hero-dots{
    position:absolute;
    bottom:36px;
    left:50%;
    transform:translateX(-50%);
    z-index:10;
    display:flex;
    gap:10px
}
 .hero-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:rgba(255,255,255,.4);
    cursor:pointer;
    transition:var(--transition)
}
 .hero-dot.active{
    background:var(--brand-primary);
    transform:scale(1.3)
}
 .projects{
    position:relative;
    background-image:url('images/factory/factory-2.webp');
    background-size:cover;
    background-position:center
}
 .projects-bg-overlay{
    position:absolute;
    inset:0;
    background:rgba(248,248,246,.94);
    z-index:0
}
 .projects .container{
    position:relative;
    z-index:1
}
 .certifications{
    padding:90px 0
}
 .cert-carousel-wrap{
    margin-top:50px;
    overflow:hidden;
    width:100%
}
 .cert-swiper{
    overflow:hidden;
    width:100%
}
 .cert-carousel-track{
    transition:transform .5s ease
}
 .cert-slide{
    width:auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px
}
 .cert-doc{
    width:100%;
    aspect-ratio:3/4.5;
    border:1px solid var(--color-border);
    border-radius:10px;
    overflow:hidden;
    background:#fff;
    transition:var(--transition);
    cursor:pointer
}
 .cert-doc:hover{
    border-color:var(--brand-primary);
    box-shadow:0 4px 20px rgba(0,137,147,.12);
    transform:translateY(-3px)
}
 .cert-doc img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}
 .cert-slide-name{
    font-size:15px;
    font-weight:600;
    letter-spacing:1.2px;
    color:var(--color-body);
    text-align:center
}
 .cert-carousel-btn{
    width:44px;
    height:44px;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--color-white);
    border:1px solid var(--color-border);
    border-radius:50%;
    color:var(--color-title);
    font-size:14px;
    transition:var(--transition);
    box-shadow:var(--shadow-sm)
}
 .cert-carousel-btn:hover{
    background:var(--brand-primary);
    border-color:var(--brand-primary);
    color:var(--color-white)
}
 .blog{
    position:relative;
    padding:var(--section-padding);
    overflow:hidden;
    background:#f4f4f4
}
 .blog-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center
}
 .blog-bg-overlay{
    position:absolute;
    inset:0;
    background:rgba(26,26,26,.88);
    z-index:0
}
 .blog .container{
    position:relative;
    z-index:1
}
 .blog-header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:50px
}
 .blog-carousel{
    position:relative
}
 .blog-swiper{
    overflow:hidden
}
 .blog-card{
    width:auto;
    background:#fff;
    border:1px solid #e4e9e7;
    border-radius:10px;
    overflow:hidden;
    transition:var(--transition);
    cursor:pointer;
    margin-top:5px
}
 .blog-card:hover{
    background:#fff;
    border-color:var(--brand-primary);
    transform:translateY(-5px)
}
 .blog-card-img-wrap{
    height:255px;
    overflow:hidden
}
 .blog-card-img-wrap img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .5s ease
}
 .blog-card:hover .blog-card-img-wrap img{
    transform:scale(1.05)
}
 .blog-card-body{
    padding:24px
}
 .blog-card-meta{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:12px
}
 .blog-card-tag{
    font-size:10px;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
    color:var(--brand-primary);
    padding:3px 10px;
    border:1px solid var(--brand-primary);
    border-radius:10px
}
 .blog-card-date{
    font-size:12px;
    color:#6b7471
}
 .blog-card-title{
    font-size:16px;
    font-weight:700;
    color:var(--color-title);
    line-height:1.4;
    margin-bottom:10px;
    transition:color .3s ease
}
 .blog-card:hover .blog-card-title{
    color:var(--brand-primary)
}
 .blog-card-desc{
    font-size:15px;
    color:var(--color-body);
    line-height:1.6;
    margin-bottom:16px
}
 .blog-card-link{
    font-size:13px;
    font-weight:700;
    letter-spacing:1.2px;
    text-transform:uppercase;
    color:var(--brand-primary);
    display:inline-flex;
    align-items:center;
    gap:6px;
    transition:gap .3s ease
}
 .blog-card:hover .blog-card-link{
    gap:10px
}
 .blog-carousel-btn{
    width:44px;
    height:44px;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.2);
    border-radius:50%;
    color:var(--color-white);
    font-size:14px;
    transition:var(--transition)
}
 .blog-carousel-btn:hover{
    background:var(--brand-primary);
    border-color:var(--brand-primary)
}
 .contact-section{
    padding:var(--section-padding);
    background:var(--color-white)
}
 .contact-inner{
    display:grid;
    grid-template-columns:1fr 1.4fr;
    gap:80px;
    align-items:start
}
 .contact-info-list{
    margin-top:40px;
    display:flex;
    flex-direction:column;
    gap:24px
}
 .contact-info-item{
    display:flex;
    align-items:flex-start;
    gap:16px
}
 .contact-info-icon{
    width:40px;
    height:40px;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,137,147,.08);
    border-radius:50%;
    color:var(--brand-primary);
    font-size:15px
}
 .contact-info-label{
    font-size:10px;
    font-weight:700;
    letter-spacing:1.4px;
    text-transform:uppercase;
    color:var(--color-light);
    margin-bottom:4px
}
 .contact-info-value{
    font-size:14px;
    color:var(--color-title);
    line-height:1.5
}
 .contact-info-value a{
    color:var(--brand-primary)
}
 .contact-form-card{
    background:var(--color-bg-light);
    border-radius:10px;
    padding:44px 40px;
    border:1px solid var(--color-border)
}
 .contact-form-title{
    font-size:20px;
    font-weight:700;
    color:var(--color-title);
    margin-bottom:32px;
    display:flex;
    align-items:center;
    gap:10px
}
 .contact-form-title i{
    color:var(--brand-primary)
}
 .form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px
}
 .form-group{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin-bottom:20px
}
 .form-group label{
    font-size:12px;
    font-weight:600;
    letter-spacing:.8px;
    text-transform:uppercase;
    color:var(--color-title);
    display:flex;
    align-items:center;
    gap:6px
}
 .form-group label i{
    color:var(--brand-primary);
    font-size:11px
}
 .required{
    color:#e05252
}
 .form-group input,.form-group select,.form-group textarea{
    padding:12px 16px;
    border:1px solid var(--color-border);
    border-radius:10px;
    font-family:var(--font-body);
    font-size:14px;
    color:var(--color-title);
    background:var(--color-white);
    transition:border-color .3s ease,box-shadow .3s ease;
    outline:0
}
 .form-group input:focus,.form-group select:focus,.form-group textarea:focus{
    border-color:var(--brand-primary);
    box-shadow:0 0 0 3px rgba(0,137,147,.08)
}
 .form-group textarea{
    min-height:120px;
    resize:vertical
}
 .btn--full{
    width:100%;
    justify-content:center;
    padding:16px 32px;
    font-size:14px
}
 .form-note{
    font-size:12px;
    color:var(--color-light);
    margin-top:14px;
    text-align:center;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px
}
 .form-success{
    text-align:center;
    padding:60px 20px
}
 .form-success i{
    font-size:56px;
    color:var(--brand-primary);
    margin-bottom:20px;
    display:block
}
 .form-success h4{
    font-size:22px;
    color:var(--color-title);
    margin-bottom:12px
}
 .form-success p{
    color:var(--color-body)
}
 .float-actions,.floating-sidebar{
    position:fixed;
    right:24px;
    bottom:100px;
    z-index:900;
    display:flex;
    flex-direction:column;
    gap:10px;
    opacity:0;
    transform:translateX(20px);
    transition:opacity .4s ease,transform .4s ease;
    pointer-events:none
}
 .float-actions.visible,.floating-sidebar.visible{
    opacity:1;
    transform:translateX(0);
    pointer-events:all
}
 .float-btn{
    position:relative;
    border:0;
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    font-size:18px;
    color:var(--color-white);
    transition:var(--transition);
    cursor:pointer
}
 .float-icon-svg{
    width:27px;
    height:27px;
    display:block;
    flex-shrink:0
}
 .float-btn:hover{
    transform:scale(1.1)
}
 .float-label{
    position:absolute;
    right:56px;
    background:rgba(30,30,30,.9);
    color:#fff;
    font-size:11px;
    font-weight:600;
    letter-spacing:.8px;
    padding:5px 10px;
    border-radius:3px;
    white-space:nowrap;
    opacity:0;
    pointer-events:none;
    transition:opacity .2s ease
}
 .float-btn:hover .float-label{
    opacity:1
}
 .float-whatsapp{
    background:#25d366
}
 .float-whatsapp:hover{
    background:#20b858
}
 .float-phone,.float-tel{
    background:var(--brand-primary)
}
 .float-phone:hover,.float-tel:hover{
    background:var(--brand-primary-dark)
}
 .float-email{
    background:#555
}
 .float-email:hover{
    background:#333
}
 .float-top{
    background:var(--color-bg-dark)
}
 .float-top:hover{
    background:var(--brand-primary)
}
 @keyframes float-pulse{
    0%{
        box-shadow:0 0 0 0 rgba(37,211,102,.5)
    }
     70%{
        box-shadow:0 0 0 10px rgba(37,211,102,0)
    }
     100%{
        box-shadow:0 0 0 0 rgba(37,211,102,0)
    }
}
 .float-whatsapp.pulse{
    animation:float-pulse .8s ease
}
 .section-title-row{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:16px
}
 .section-title-row .section-title{
    margin-bottom:0
}
 .view-more-btn{
    flex-shrink:0;
    white-space:nowrap;
    font-size:13px;
    padding:10px 22px;
    margin-bottom:6px
}
 .cert-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:24px;
    margin-top:48px
}
 .cert-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px
}
 .cert-item .cert-doc{
    width:100%;
    aspect-ratio:3/4;
    overflow:hidden;
    border-radius:10px;
    border:1px solid var(--color-border);
    background:#fff;
    transition:var(--transition);
    display:flex;
    align-items:center;
    justify-content:center
}
 .cert-item .cert-doc:hover{
    border-color:var(--brand-primary);
    box-shadow:0 4px 20px rgba(0,137,147,.12);
    transform:translateY(-4px)
}
 .cert-item .cert-doc img{
    width:100%;
    height:100%;
    object-fit:cover
}
 .cert-item-name{
    font-size:12px;
    font-weight:600;
    letter-spacing:.6px;
    color:var(--color-title);
    text-align:center;
    text-transform:uppercase
}
 .blog-carousel-btn{
    display:none!important
}
 .blog-carousel--static .blog-carousel-viewport{
    overflow:visible
}
 .blog-carousel--static .blog-carousel-track{
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    gap:24px!important;
    transform:none!important;
    transition:none!important
}
 .blog-carousel--static .blog-card{
    flex:none!important;
    width:auto!important
}
 .why-us{
    position:relative;
    background-image:url('images/why-us-bg.webp')!important;
    background-size:cover!important;
    background-position:center!important
}
 .why-us::before{
    content:'';
    position:absolute;
    inset:0;
    background:rgb(0 0 0 / 35%);
    z-index:0
}
 .why-us .container{
    position:relative;
    z-index:1
}
 .projects{
    padding:0!important;
    overflow:hidden
}
 .projects-header-wrap{
    padding:80px 0 48px;
    position:relative;
    z-index:1
}
 .projects-fullwidth-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:0;
    width:100%
}
 .projects-fullwidth-grid .project-card{
    border-radius:0;
    margin:0
}
 .projects-fullwidth-grid .project-card-img-wrap{
    height:420px;
    border-radius:0
}
 .projects-fullwidth-grid .project-card-info{
    padding:20px 24px;
    border-bottom:none;
    background:#fff
}
 .core-systems-inner{
    align-items:stretch!important
}
 .core-systems-visual{
    height:auto!important;
    min-height:400px
}
 .core-systems-visual,.core-systems-visual .factory-img-wrap{
    height:100%
}
 .system-img{
    height:100%
}
 .factory-img-wrap{
    position:relative;
    display:block;
    overflow:hidden;
    border-radius:10px;
    flex:1
}
 .factory-img-wrap .factory-img-main{
    position:relative;
    z-index:0;
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:10px
}
 .video-play-btn{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:72px;
    height:72px;
    border-radius:50%;
    background:rgba(255,255,255,.15);
    border:2px solid rgba(255,255,255,.8);
    color:#fff;
    font-size:22px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .3s ease;
    backdrop-filter:blur(4px);
    z-index:2;
    padding-left:4px
}
 .video-play-btn:hover{
    background:var(--brand-primary);
    border-color:var(--brand-primary);
    transform:translate(-50%,-50%) scale(1.1);
    box-shadow:0 0 0 12px rgba(0,137,147,.2)
}
 .video-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    pointer-events:none;
    transition:opacity .3s ease
}
 .video-modal.active{
    opacity:1;
    pointer-events:all
}
 .video-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.85);
    cursor:pointer
}
 .video-modal-content{
    position:relative;
    z-index:1;
    width:90%;
    max-width:900px;
    aspect-ratio:16/9;
    background:#000;
    border-radius:10px;
    overflow:hidden
}
 .video-modal-close{
    position:absolute;
    top:12px;
    right:12px;
    width:36px;
    height:36px;
    border-radius:50%;
    background:rgba(255,255,255,.15);
    border:none;
    color:#fff;
    font-size:16px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:2;
    transition:background .2s
}
 .video-modal-close i{
    display:none
}
 .video-modal-close:before{
    content:"\00d7";
    font-size:24px;
    line-height:1
}
 .video-modal-close:hover{
    background:var(--brand-primary)
}
 .video-modal-player{
    position:relative;
    aspect-ratio:16/9;
    background:#111
}
 .video-modal-player video{
    width:100%;
    height:100%;
    display:block
}
 #companyVideo{
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
    background:#000
}
 .image-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:32px;
    opacity:0;
    pointer-events:none;
    transition:opacity .3s ease
}
 .image-modal.active{
    opacity:1;
    pointer-events:all
}
 .image-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.86);
    cursor:pointer
}
 .image-modal-content{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:center;
    width:min(1100px,92vw);
    max-height:88vh;
    padding:22px;
    border-radius:10px;
    background:#fff;
    box-shadow:0 30px 90px rgba(0,0,0,.35)
}
 .image-modal-content img{
    display:block;
    width:100%;
    max-height:calc(88vh - 44px);
    object-fit:contain
}
 .image-modal-close{
    position:absolute;
    top:12px;
    right:12px;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border:0;
    border-radius:50%;
    background:rgba(7,43,49,.82);
    color:#fff;
    cursor:pointer;
    transition:background .2s ease,transform .2s ease
}
 .image-modal-close i{
    display:none
}
 .image-modal-close:before{
    content:"\00d7";
    font-size:26px;
    line-height:1
}
 .image-modal-close:hover{
    background:var(--brand-primary);
    transform:rotate(90deg)
}
 .video-placeholder{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:rgba(255,255,255,.5);
    font-size:14px;
    gap:12px;
    pointer-events:none
}
 .video-modal.active .video-placeholder{
    display:none
}
 .video-placeholder i{
    font-size:48px;
    color:rgba(255,255,255,.2)
}
 .projects-showcase{
    position:relative;
    width:100%;
    min-height:660px;
    overflow:hidden;
    display:flex;
    align-items:center;
    padding:var(--section-padding)
}
 .ps-bg-swiper{
    position:absolute;
    inset:0;
    z-index:0
}
 .ps-bg-swiper .swiper-slide,.ps-bg-swiper .swiper-wrapper{
    height:100%
}
 .ps-bg-layer{
    position:relative;
    background-size:cover;
    background-position:center;
    transform:scale(1.04);
    transition:transform 6s ease
}
 .ps-bg-swiper:not(.swiper-initialized) .ps-bg-layer{
    opacity:0
}
 .ps-bg-swiper:not(.swiper-initialized) .ps-bg-layer:first-child{
    opacity:1
}
 .ps-bg-layer.swiper-slide-active{
    transform:scale(1)
}
 .ps-bg-overlay{
    position:absolute;
    inset:0;
    background:rgb(0 0 0 / 35%);
    z-index:1
}
 .ps-content{
    position:relative;
    z-index:2;
    width:100%;
    max-width:var(--container-max,1400px);
    margin:0 auto;
    padding:0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center
}
 .ps-left{
    display:flex;
    flex-direction:column;
    gap:36px
}
 .ps-heading{
    display:flex;
    flex-direction:column;
    gap:14px
}
 .ps-title{
    font-size:56px;
    font-weight:700;
    line-height:1.1;
    color:#fff;
    letter-spacing:-.8px
}
 .ps-subtitle{
    font-size:15px;
    color:rgba(255,255,255,.65);
    line-height:1.6
}
 .ps-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:0;
    border-top:1px solid rgba(255,255,255,.12)
}
 .ps-item{
    display:flex;
    align-items:center;
    gap:20px;
    padding:18px 0;
    border-bottom:1px solid rgba(255,255,255,.1);
    cursor:pointer;
    transition:all .3s ease;
    position:relative
}
 .ps-item::before{
    content:'';
    position:absolute;
    left:-60px;
    top:0;
    bottom:0;
    width:3px;
    background:var(--brand-primary,#008993);
    opacity:0;
    transition:opacity .3s ease
}
 .ps-item.active::before,.ps-item:hover::before{
    opacity:1
}
 .ps-item-num{
    font-size:16px;
    font-weight:700;
    letter-spacing:1.2px;
    color:#fff;
    min-width:28px;
    transition:color .3s
}
 .ps-item.active .ps-item-num,.ps-item:hover .ps-item-num{
    color:var(--brand-primary,#008993)
}
 .ps-item-info{
    flex:1;
    display:flex;
    flex-direction:column;
    gap:3px
}
 .ps-item-name{
    font-size:16px;
    font-weight:600;
    color:#fff;
    transition:color .3s
}
 .ps-item.active .ps-item-name,.ps-item:hover .ps-item-name{
    color:#fff
}
 .ps-item-arrow{
    color:rgba(255,255,255,.2);
    font-size:14px;
    transition:all .3s;
    transform:translateX(0)
}
 .ps-item.active .ps-item-arrow,.ps-item:hover .ps-item-arrow{
    color:var(--brand-primary,#008993);
    transform:translateX(4px)
}
 .ps-cta{
    align-self:flex-start;
    border-color:rgba(255,255,255,.35)!important;
    color:rgba(255,255,255,.8)!important
}
 .ps-cta:hover{
    border-color:var(--brand-primary,#008993)!important;
    color:#fff!important;
    background:0 0!important
}
 .ps-right{
    display:flex;
    justify-content:flex-end;
    align-items:center
}
 .ps-info-card{
    background:rgba(255,255,255,.4);
    backdrop-filter:blur(16px);
    border-radius:12px;
    padding:40px;
    max-width:100%;
    width:100%;
    transition:all .5s ease;
    display:none;
    opacity:0;
    transform:translateY(8px)
}
 .ps-info-card.active{
    display:block;
    opacity:1;
    transform:translateY(0)
}
 .ps-info-title{
    font-size:20px;
    font-weight:700;
    color:#fff;
    line-height:1.5;
    margin-bottom:16px
}
 .ps-info-desc{
    font-size:15px;
    color:#fff;
    line-height:1.5;
    margin-bottom:28px
}
 .ps-info-image{
    margin-top:8px;
    border-radius:10px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.12);
    aspect-ratio:16/10;
    background:rgba(255,255,255,.04)
}
 .ps-info-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}
 .ps-progress{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    height:3px;
    background:rgba(255,255,255,.1);
    z-index:3
}
 .ps-progress-bar{
    height:100%;
    background:var(--brand-primary,#008993);
    width:0%;
    transition:width .1s linear
}
 .nav-toggle{
    display:none;
    width:38px;
    height:38px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.28);
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    transition:var(--transition)
}
 .site-header.scrolled .nav-toggle{
    border-color:rgba(20,30,26,.2)
}
 .nav-toggle span{
    display:block;
    width:16px;
    height:2px;
    background:rgba(255,255,255,.92);
    transition:var(--transition)
}
 .site-header.scrolled .nav-toggle span{
    background:#1d2421
}
 .nav-toggle.active span:first-child{
    transform:translateY(7px) rotate(45deg)
}
 .nav-toggle.active span:nth-child(2){
    opacity:0
}
 .nav-toggle.active span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg)
}
 .mobile-nav{
    position:fixed;
    inset:0;
    z-index:1200;
    pointer-events:none
}
 .mobile-nav-backdrop{
    position:absolute;
    inset:0;
    background:rgba(10,18,16,.45);
    opacity:0;
    transition:opacity .25s ease
}
 .mobile-nav-panel{
    position:absolute;
    top:0;
    right:0;
    width:340px;
    max-width:100%;
    height:100%;
    background:#fff;
    padding:20px;
    display:flex;
    flex-direction:column;
    gap:18px;
    transform:translateX(100%);
    transition:transform .28s ease;
    overflow-y:auto;
    box-shadow:-18px 0 38px rgba(10,20,16,.12)
}
 .mobile-nav.active{
    pointer-events:auto
}
 .mobile-nav.active .mobile-nav-backdrop{
    opacity:1
}
 .mobile-nav.active .mobile-nav-panel{
    transform:translateX(0)
}
 .mobile-nav-close{
    align-self:flex-end;
    width:34px;
    height:34px;
    border:1px solid #dbe5e1;
    border-radius:3px;
    color:#2a3330
}
 .mobile-nav-links,.mobile-nav-products{
    display:flex;
    flex-direction:column;
    gap:10px
}
 .mobile-nav-links a,.mobile-nav-products a{
    font-size:14px;
    color:#2f3935;
    border-bottom:1px solid #eef3f1;
    padding:8px 0
}
 .mobile-product-item{
    border-bottom:1px solid #eef3f1
}
 .mobile-product-toggle{
    width:100%;
    padding:10px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    font-size:14px;
    font-weight:500;
    color:#2f3935;
    text-align:left
}
 .mobile-product-toggle i{
    font-size:12px;
    color:#7f8d87;
    transition:transform .25s ease
}
 .mobile-product-item.active .mobile-product-toggle i{
    transform:rotate(180deg)
}
 .mobile-product-submenu{
    display:none;
    padding:0 0 6px 10px
}
 .mobile-product-submenu a{
    border-bottom:none;
    padding:7px 0;
    font-size:13px;
    color:#5b6963
}
 .mobile-nav-title{
    margin-top:6px;
    font-size:12px;
    font-weight:700;
    letter-spacing:1.2px;
    text-transform:uppercase;
    color:#7f8d87
}
 .mobile-nav-quote{
    margin-top:auto;
    width:100%;
    justify-content:center
}
 body.mobile-nav-open{
    overflow:hidden
}
 .mobile-tree,.mobile-tree-submenu{
    list-style:none;
    margin:0;
    padding:0
}
 .mobile-tree-item{
    border-bottom:1px solid #eef3f1
}
 .mobile-tree-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px
}
 .mobile-tree-link{
    display:block;
    flex:1;
    padding:10px 0;
    font-size:14px;
    color:#2f3935;
    border-bottom:none!important
}
 .mobile-tree-arrow{
    width:30px;
    height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid #e1eae6;
    border-radius:3px;
    color:#7f8d87;
    flex-shrink:0
}
 .mobile-tree-arrow i{
    font-size:11px;
    transition:transform .25s ease
}
 .mobile-tree-item.active>.mobile-tree-row .mobile-tree-arrow i{
    transform:rotate(180deg)
}
 .mobile-tree-submenu{
    display:none;
    padding:0 0 8px 12px
}
 .mobile-tree--level2>.mobile-tree-item{
    border-bottom:none
}
 .mobile-tree--level2 .mobile-tree-link{
    font-size:13px;
    color:#5b6963;
    padding:8px 0
}
 .mobile-tree--level2 .mobile-tree-submenu{
    padding-left:12px
}
 .mobile-tree--level2>.mobile-tree-item.has-children>.mobile-tree-row .mobile-tree-link{
    font-size:13px;
    color:#5b6963
}
 .mobile-tree--level2>.mobile-tree-item.has-children>.mobile-tree-row .mobile-tree-arrow{
    width:28px;
    height:28px
}
 .mobile-tree--level3>.mobile-tree-item{
    border-bottom:none
}
 .mobile-tree--level3 .mobile-tree-link{
    font-size:12px;
    color:#7a8781;
    padding:6px 0
}
 .mobile-tree--level3{
    padding-left:12px
}
 .nav-group-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px
}
 .nav-group-sub{
    display:flex;
    flex-direction:column;
    gap:8px
}
 .nav-group-toggle{
    display:none;
    width:26px;
    height:26px;
    align-items:center;
    justify-content:center;
    border:1px solid #d9e2de;
    border-radius:3px;
    color:#71807a;
    flex-shrink:0
}
 .nav-group-toggle i{
    font-size:11px;
    transition:transform .25s ease
}
 .nav-group.is-open .nav-group-toggle i{
    transform:rotate(180deg)
}
 .mobile-nav-backdrop{
    position:fixed;
    inset:0;
    background:rgba(10,18,16,.45);
    z-index:1100;
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease
}
 .mobile-nav-backdrop.active{
    opacity:1;
    pointer-events:auto
}
 .nav-item-head{
    display:inline-flex;
    align-items:center;
    gap:6px
}
 .nav-products-toggle{
    width:20px;
    height:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:rgba(255,255,255,.9)
}
 .site-header.scrolled .nav-products-toggle{
    color:var(--color-title)
}
 .nav-products-toggle i{
    margin-top:-5px;
    font-size:15px;
    transition:transform .25s ease
}
 .nav-item--has-dropdown.is-open .nav-products-toggle i,.nav-item--has-dropdown:hover .nav-products-toggle i{
    transform:rotate(180deg)
}
 .blog-card-title,.ps-info-title,.solution-card-desc,.system-tab-body p,.why-card-desc{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden
}
 .blog-card-desc,.ps-info-desc{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    overflow:hidden
}
 .blog-card-meta{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:12px
}
 .blog-meta-item{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-size:14px;
    color:#6b7471
}
 .blog-meta-item i{
    font-size:15px
}
 .auto-container{
    max-width:var(--max-width);
    margin:0 auto
}
 .line-1,.line-2,.line-3,.line-4,.line-5,.line-6,.line-7,.line-8,.line-9{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    overflow:hidden
}
 .line-1{
    -webkit-line-clamp:1
}
 .line-2{
    -webkit-line-clamp:2
}
 .line-3{
    -webkit-line-clamp:3
}
 .line-4{
    -webkit-line-clamp:4
}
 .line-5{
    -webkit-line-clamp:5
}
 .line-6{
    -webkit-line-clamp:6
}
 .line-7{
    -webkit-line-clamp:7
}
 .line-8{
    -webkit-line-clamp:8
}
 .line-9{
    -webkit-line-clamp:9
}
 .scale{
    transition:transform .6s ease
}
 .page_banner{
    position:relative;
    max-height:350px;
    overflow:hidden;
    margin-top:86px;
    background:#081f24
}
 .page_banner .page_banner_img img{
    width:100%;
    height:350px;
    object-fit:cover
}
 .page_banner::after{
    content:'';
    position:absolute;
    inset:0;
    background:rgb(0 0 0 / 40%)
}
 .page_banner .page_banner_content{
    position:absolute;
    inset:0;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center
}
 .page_banner .page_banner_content h1,
 .page_banner .page_banner_content .page_banner_title{
    display:block;
    color:var(--color-white);
    font-size:48px;
    line-height:1.08;
    font-weight:700;
    margin-bottom:16px
}
 .page_banner .page_banner_content p{
    max-width:760px;
    margin:0 auto;
    color:rgba(255,255,255,.82);
    font-size:17px;
    line-height:1.8
}
 .page_inside{
    background:var(--color-white);
    border-bottom:1px solid var(--color-border);
}
 .page_inside .auto-container{
    min-height:54px;
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    color:var(--color-light)
}
 .page_inside i{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:14px;
    height:14px;
    color:#8a989c;
    font-style:normal;
    font-size:0;
    line-height:1;
    flex:0 0 14px
}
 .page_inside i::before{
    content:'';
    width:6px;
    height:6px;
    border-top:1.5px solid currentColor;
    border-right:1.5px solid currentColor;
    transform:rotate(45deg)
}
 .page_inside a{
    color:var(--color-title);
    font-weight:600
}
 .page_inside a:hover{
    color:var(--brand-primary)
}
 .list_products .page_content{
    padding:58px 0 90px;
    background:linear-gradient(180deg,#f7faf9 0,#fff 40%,#fff 100%)
}
 .list_products .product_category_bar{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin-bottom:52px
}
 .list_products .product_category_bar .category_item{
    min-height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:11px 18px;
    border:1px solid #dfe7e8;
    border-radius:999px;
    background:rgba(255,255,255,.88);
    font-size:15px;
    font-weight:700;
    text-align:center;
    transition:var(--transition);
    min-width:0
}
 .list_products .product_category_bar .category_item span:last-child{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
 .list_products .product_category_bar .category_item.active,.list_products .product_category_bar .category_item:hover{
    color:var(--color-white);
    border-color:#008895;
    background:linear-gradient(135deg,#008e9b,#006f78);
    transform:translateY(-1px)
}
 .list_products .product_category_bar .category_icon{
    width:21px;
    height:21px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 21px;
    opacity:.9
}
 .list_products .product_category_bar .category_icon img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    filter:grayscale(1) brightness(.72)
}
 .list_products .product_category_bar .active .category_icon img,.list_products .product_category_bar .category_item:hover .category_icon img{
    filter:brightness(0) invert(1)
}
 .list_products .page_content_box{
    width:100%
}
 .list_products .products_head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:28px;
    margin-bottom:30px
}
 .list_products .products_head .title{
    font-size:32px;
    margin:0
}
 .list_products .products_head .remark{
    max-width:440px;
    color:var(--color-body);
    font-size:15px;
    line-height:1.75
}
 .list_products .products_grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:28px
}
 .list_products .item_box{
    min-width:0
}
 .list_products .item_box .item{
    height:100%;
    overflow:hidden;
    border:1px solid #e4ecec;
    border-radius:8px;
    background:var(--color-white);
    cursor:pointer;
    position:relative;
    transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease
}
 .list_products .item_box .item:hover{
    transform:translateY(-6px);
    border-color:rgba(0,181,193,.42)
}
 .list_products .item_box .product_card_body{
    height:100%;
    display:flex;
    flex-direction:column
}
 .list_products .item_box .product_card_link{
    height:100%;
    display:flex;
    flex-direction:column;
    color:inherit;
    text-decoration:none
}
 .list_products .item_box .product_card_link:hover{
    color:inherit
}
 .list_products .item_box .img_box{
    aspect-ratio:1.18/1;
    overflow:hidden;
    background:#eef4f4
}
 .list_products .item_box .img_box img{
    width:100%;
    height:100%;
    object-fit:cover
}
 .list_products .item_box .item:hover .img_box img{
    transform:scale(1.06)
}
 .list_products .item_box .text_box{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:22px 22px 24px
}
 .list_products .item_box .product_card_link .text_box{
    padding-bottom:0
}
 .list_products .item_box .text_box h2{
    min-height:48px;
    font-size:19px;
    color:#182f35;
    margin-bottom:12px
}
 .list_products .item_box .text_box p{
    min-height:52px;
    font-size:16px;
    color:var(--color-body);
    line-height:1.75;
    margin-bottom:14px
}
 .list_products .product_card_meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:10px;
    margin-top:auto;
    padding-top:12px;
    border-top:1px solid #edf4f4;
    font-size:14px;
    font-weight:500
}
 .list_products .product_card_rating{
    display:inline-flex;
    gap:2px;
    color:#f5a400;
    font-size:13px;
    line-height:1
}
 .list_products .product_card_views{
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap
}
 .list_products .product_card_views i{
    color:var(--brand-primary-dark)
}
 .list_products .product_card_actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-top:16px
}
 .list_products .product_card_link .product_card_actions{
    margin-top:0;
    padding:16px 180px 24px 22px
}
 .list_products .btn_effect4{
    width:max-content;
    max-width:100%;
    overflow:hidden;
    border-radius:4px;
    color:var(--color-white);
    background:var(--brand-primary-dark);
    cursor:pointer
}
 .list_products .btn_small_wrap{
    position:relative;
    min-width:138px;
    height:42px;
    overflow:hidden
}
 .list_products .btn_small_list{
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:0 18px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.8px;
    text-transform:uppercase;
    transition:transform .32s ease
}
 .list_products .btn_small_list.hover{
    position:absolute;
    inset:0;
    background:var(--brand-primary);
    transform:translateY(100%)
}
 .list_products .item:hover .btn_small_list:first-child{
    transform:translateY(-100%)
}
 .list_products .item:hover .btn_small_list.hover{
    transform:translateY(0)
}
 .list_products .inquire{
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 18px;
    border:1px solid rgba(0,107,115,.28);
    border-radius:4px;
    background:#fff;
    color:var(--brand-primary-dark);
    font-size:12px;
    font-weight:800;
    letter-spacing:.8px;
    line-height:1;
    text-transform:uppercase;
    cursor:pointer;
    transition:var(--transition)
}
 .list_products .item>.inquire{
    position:absolute;
    right:22px;
    bottom:24px;
    z-index:2
}
 .list_products .inquire:hover{
    border-color:var(--brand-primary);
    background:rgba(0,181,193,.08);
    color:var(--brand-primary)
}
.list_products_editor {
                padding: 86px 0;
                background: #f7faf9;
            }
 .inside-pagination{
    margin-top:48px;
    display:flex;
    justify-content:center
}
 .inside-pagination ul{
    display:flex;
    align-items:center;
    gap:10px
}
 .inside-pagination li a{
    width:42px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid #e5ecec;
    border-radius:5px;
    background:var(--color-white);
    font-size:13px;
    font-weight:700
}
 .inside-pagination li.active a{
    color:var(--color-white);
    border-color:#008895;
    background:#008895
}
 .inside-pagination .ellipsis a{
    width:34px;
    border-color:transparent;
    background:0 0;
    box-shadow:none;
    color:#6f7e82
}
 .inside-pagination .next-page a,.inside-pagination .pre-page a{
    width:42px;
    color:#66767a
}
 .inside-pagination .next-page img,.inside-pagination .pre-page img{
    filter: grayscale(1);
}
 .inside-pagination .pre-page img{
    transform:rotate(180deg)
}
 .inside-pagination li:not(.active):not(.ellipsis) a:hover{
    color:var(--brand-primary-dark);
    border-color:rgba(0,181,193,.4);
    transform:translateY(-1px)
}
 .list_products_footer{
    background:#0f2428;
    color:rgba(255,255,255,.76);
    padding:34px 0
}
 .list_products_footer .auto-container{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px
}
 .list_products_footer .footer_brand{
    display:flex;
    align-items:center;
    gap:18px;
    min-width:0
}
 .list_products_footer .footer_brand img{
    width:138px;
    height:auto
}
 .list_products_footer .footer_brand p{
    font-size:13px;
    font-weight:700;
    color:var(--color-white)
}
 .list_products_footer .footer_contact{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:8px 20px;
    font-size:13px;
    text-align:right
}
 .list_products_footer .footer_contact a{
    color:var(--color-white);
    font-weight:700
}
 .list_news .page_content{
    padding:72px 0 96px;
    background:linear-gradient(180deg,#f7faf9 0,#fff 34%,#fff 100%)
}
 .list_news .page_content_box{
    width:100%
}
 .list_news .news_head{
    display:flex;
    flex-direction:column;
    gap:16px;
    max-width:760px;
    margin-bottom:34px
}
 .list_news .news_head .section-label{
    margin-bottom:0
}
 .list_news .news_head .title{
    margin:0;
    font-size:34px;
    color:#162f35
}
 .list_news .news_head .remark{
    max-width:680px;
    color:var(--color-body);
    font-size:16px;
    line-height:1.75
}
 .list_news .news_grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:28px
}
 .list_news .item_box{
    min-width:0
}
 .list_news .item_box .item{
    height:100%;
    overflow:hidden;
    border:1px solid #e2ebec;
    border-radius:8px;
    background:#fff;
    transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease
}
 .list_news .item_box .item:hover{
    transform:translateY(-6px);
    border-color:rgba(0,181,193,.42)
}
 .list_news .item_box .item a{
    height:100%;
    display:flex;
    flex-direction:column
}
 .list_news .item_box .img_box{
    aspect-ratio:1.18/1;
    overflow:hidden;
    background:#edf4f4
}
 .list_news .item_box .img_box img{
    width:100%;
    height:100%;
    object-fit:cover
}
 .list_news .item_box .item:hover .img_box img{
    transform:scale(1.06)
}
 .list_news .item_box .text_box{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:24px 24px 26px
}
 .list_news .item_box .date{
    width:max-content;
    margin-bottom:13px;
    padding:5px 10px;
    border-radius:999px;
    background:rgba(0,181,193,.1);
    color:var(--brand-primary-dark);
    font-size:12px;
    font-weight:800;
    letter-spacing:.7px
}
 .list_news .item_box h3{
    min-height:54px;
    margin-bottom:12px;
    color:#173238;
    font-size:20px;
    line-height:1.35
}
 .list_news .item_box .remark{
    min-height:78px;
    margin-bottom:22px;
    color:var(--color-body);
    font-size:14px;
    line-height:1.75
}
 .list_news .news_link{
    margin-top:auto;
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:max-content;
    color:var(--brand-primary-dark);
    font-size:12px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
    transition:var(--transition)
}
 .list_news .item:hover .news_link{
    gap:12px;
    color:var(--brand-primary)
}
 .list_case .page_content{
    padding:72px 0 96px;
    background:linear-gradient(180deg,#f8faf9 0,#fff 34%,#fff 100%)
}
 .list_case .page_content_box{
    width:100%
}
 .list_case .case_head{
    max-width:760px;
    margin-bottom:36px
}
 .list_case .case_head .section-label{
    margin-bottom:14px
}
 .list_case .case_head .title{
    margin:0 0 16px;
    font-size:34px;
    color:#162f35
}
 .list_case .case_head .remark{
    color:var(--color-body);
    font-size:16px;
    line-height:1.75
}
 .list_case .case_grid{
    display:grid;
    grid-template-columns:1fr;
    gap:10px
}
 .list_case .case_row{
    min-height:300px;
    background:#fff;
    box-shadow:0 14px 36px rgba(18,48,54,.06);
    cursor:pointer
}
 .list_case .case_row_link{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:stretch;
    min-height:300px;
    color:inherit;
    text-decoration:none
}
 .list_case .case_row_link:hover{
    color:inherit
}
 .list_case .case_row_reverse .case_media{
    order:2
}
 .list_case .case_media{
    min-height:300px;
    overflow:hidden;
    background:#edf3f4
}
 .list_case .case_media img{
    width:100%;
    height:100%;
    object-fit:cover
}
 .list_case .case_row:hover .case_media img{
    transform:scale(1.05)
}
 .list_case .case_text{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:46px 64px;
    background:linear-gradient(135deg,#fff 0,#fbfcfc 100%)
}
 .list_case .case_num{
    position:relative;
    width:max-content;
    margin-bottom:26px;
    color:var(--brand-primary-dark);
    font-size:16px;
    font-weight:800;
    letter-spacing:.8px
}
 .list_case .case_num::after{
    content:'';
    position:absolute;
    left:0;
    bottom:-12px;
    width:22px;
    height:2px;
    background:var(--brand-primary)
}
 .list_case .case_text h3{
    margin:0 0 16px;
    font-size:24px;
    line-height:1.3
}
 .list_case .case_text p{
    margin-bottom:24px;
    font-size:16px;
    line-height:1.72
}
 .list_case .case_link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:max-content;
    color:var(--brand-primary-dark);
    font-size:14px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
    transition:var(--transition)
}
 .list_case .case_link:hover{
    gap:12px;
    color:var(--brand-primary)
}
 .about_us .page_content{
    padding:90px 0;
    background:#fff
}
 .about_us .about_intro{
    padding-bottom:0
}
 .about_us .page_content:nth-of-type(odd){
    background:#f7faf9
}
 .about_us .page_content_box{
    width:100%
}
 .about_section_head{
    max-width:760px;
    margin-bottom:34px
}
 .about_section_head_center{
    margin-left:auto;
    margin-right:auto;
    text-align:center
}
 .about_section_head .section-label{
    margin-bottom:14px
}
 .about_intro_text h2,.about_section_head h2{
    margin:0;
    color:#162f35;
    font-size:36px;
    line-height:1.22
}
 .about_section_head p{
    margin-top:16px;
    color:#627175;
    font-size:16px;
    line-height:1.78
}
 .about_intro_heading{
    max-width:1120px;
    margin:0 auto 38px;
    text-align:center
}
 .about_intro_heading .section-label{
    position:relative;
    margin-bottom:18px;
    color:var(--brand-primary-dark);
    font-size:22px;
    letter-spacing:0;
    text-transform:uppercase
}
 .about_intro_heading .section-label::after,.about_intro_heading .section-label::before{
    content:'';
    position:absolute;
    top:50%;
    width:78px;
    height:1px;
    background:linear-gradient(90deg,rgba(0,128,139,0),rgba(0,128,139,.75))
}
 .about_intro_heading .section-label::before{
    right:calc(100% + 20px)
}
 .about_intro_heading .section-label::after{
    left:calc(100% + 20px);
    transform:rotate(180deg)
}
 .about_intro_heading h2{
    margin:0;
    font-size:36px;
    line-height:1.14;
    margin-bottom:20px
}
 .about_intro_image{
    position:relative;
    overflow:hidden;
    border-radius:8px;
    background:#eaf2f2;
    box-shadow:0 22px 60px rgba(16,48,56,.08)
}
 .about_intro_image img{
    display:block;
    width:100%;
    height:390px;
    object-fit:cover
}
 .about_intro_play{
    width:86px;
    height:86px;
    font-size:25px
}
 .about_intro_play i{
    display:none
}
 .about_intro_play:before{
    content:"";
    display:block;
    width:0;
    height:0;
    border-top:12px solid transparent;
    border-bottom:12px solid transparent;
    border-left:18px solid #fff;
    margin-left:5px
}
 .about_intro_columns{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0;
    margin:38px auto 0
}
 .about_intro_columns>div{
    min-width:0;
    padding:0;
    padding-right:40px
}
 .about_intro_columns>div+div{
    border-left:1px solid #d7e1e3;
    padding-left:40px;
    padding-right:0
}
 .about_intro_columns p{
    color:#2d3546;
    font-size:17px;
    line-height:1.72
}
 .about_culture{
    padding-top:74px!important;
    padding-bottom:0!important;
    background:#fff!important;
    overflow:hidden
}
 .about_culture .auto-container{
    padding:0
}
 .culture_heading{
    box-sizing:border-box;
    max-width:940px;
    margin:0 auto 34px;
    padding:0 24px;
    text-align:center
}
 .culture_heading .section-label{
    margin-bottom:14px;
    color:var(--brand-primary-dark);
    font-size:18px;
    letter-spacing:8px;
    text-transform:uppercase
}
 .culture_heading .section-label::after{
    content:'';
    display:block;
    width:58px;
    height:2px;
    margin:12px auto 0;
    background:var(--brand-primary-dark)
}
 .culture_heading h2{
    margin:0 0 18px;
    font-size:36px;
    line-height:1.14
}
 .culture_heading p{
    color:#5f636d;
    font-size:17px;
    line-height:1.6
}
 .culture_timeline{
    position:relative
}
 .culture_row{
    box-sizing:border-box;
    position:relative;
    display:grid;
    grid-template-columns:1fr 1fr;
    min-height:245px
}
 .culture_row_reverse .culture_panel_text{
    grid-column:2
}
 .culture_row_reverse .culture_panel_image{
    grid-column:1;
    grid-row:1
}
 .culture_panel{
    box-sizing:border-box;
    min-width:0
}
 .culture_panel_text{
    box-sizing:border-box;
    width:100%;
    display:flex;
    align-items:center;
    gap:20px;
    padding:40px clamp(30px,8vw,30px);
    flex-wrap:wrap
}
 .culture_row_reverse .culture_panel_text{
    flex-direction:row;
}
 .culture_icon{
    flex:0 0 90px;
    width:90px;
    height:90px;
    display:flex;
    align-items:center;
    justify-content:center
}
 .culture_icon img{
    width:74px;
    height:74px;
    object-fit:contain
}
 .culture_copy{
    min-width:0;
    max-width:560px
}
 .culture_copy h3{
    margin:0 0 16px;
    font-family:var(--font-heading);
    font-size:34px;
    font-weight:500;
    line-height:1.2;
    overflow-wrap:anywhere
}
 .culture_copy p{
    color:#5e656d;
    font-size:16px;
    line-height:1.7;
    overflow-wrap:anywhere
}
 .culture_panel_image{
    box-sizing:border-box;
    min-height:245px;
    overflow:hidden
}
 .culture_panel_image img{
    width:100%;
    height:100%;
    object-fit:cover
}
 .about_certs{
    position:relative;
    padding:90px 0 90px!important;
    overflow:hidden
}
 .about_certs .page_content_box{
    width:100%
}
 .certs_head{
    margin:0 auto 70px;
    text-align:center
}
 .certs_head i{
    display:block;
    margin-bottom:18px;
    color:#0a5860;
    font-size:25px
}
 .certs_head span{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:18px;
    color:#15565e;
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase
}
 .certs_head span::after,.certs_head span::before{
    content:'';
    width:76px;
    height:1px;
    background:#b8c4c7
}
 .certs_head h2{
    margin:0 0 20px;
    font-size:36px;
    line-height:1
}
 .certs_head p{
    margin:0 auto;
    font-size:17px;
    line-height:1.75
}
 .certs_showcase{
    position:relative;
    max-width:1280px;
    margin:0 auto
}
 .about_cert_swiper{
    overflow:hidden
}
 .about_cert_grid{
    align-items:stretch
}
 .about_cert_item{
    height:auto;
    min-width:0;
    text-align:center
}
 .cert_doc{
    width:100%;
    border:1px solid var(--color-border);
    border-radius:10px;
    overflow:hidden;
    background:#fff;
    transition:var(--transition);
    cursor:pointer;
    margin-bottom:20px
}
 .cert_doc:hover{
    border-color:var(--brand-primary);
    transform:translateY(-3px)
}
 .cert_doc img{
    width:100%;
    height:100%;
    object-fit:contain
}
 .about_cert_item strong{
    display:block;
    margin-bottom:9px;
    font-size:16px;
    line-height:1.35
}
 .about_cert_item span{
    display:block;
    line-height:1.45
}
 .certs_arrow{
    position:absolute;
    top:45%;
    z-index:2;
    width:54px;
    height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:50%;
    background:#fff;
    font-size:21px;
    cursor:pointer
}
 .certs_arrow_prev{
    left:-90px
}
 .certs_arrow_next{
    right:-90px
}
 .certs_dots{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    bottom:50px!important
}
 .certs_dots .swiper-pagination-bullet{
    width:12px;
    height:12px;
    margin:0!important;
    opacity:1;
    border-radius:50%;
    background:#d8dcdd
}
 .certs_dots .swiper-pagination-bullet-active{
    background:#0b717a
}
 .about_history{
    padding:92px 0 84px!important;
    overflow:hidden;
    background:#f6f7f6 url('images/about/history/history-bg.png') center top/cover no-repeat!important
}
 .about_history .page_content_box{
    width:100%
}
 .history_head{
    margin:0 auto 60px;
    text-align:center
}
 .history_head span{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:18px;
    margin-bottom:24px;
    color:#155b62;
    font-size:14px;
    font-weight:800;
    letter-spacing:6px;
    text-transform:uppercase
}
 .history_head span::after,.history_head span::before{
    content:'';
    width:28px;
    height:1px;
    background:#155b62
}
 .history_head h2{
    margin:0 0 20px;
    font-size:36px
}
 .history_head p{
    font-size:17px;
    line-height:1.75
}
 .history_carousel_wrap{
    position:relative
}
 .history_swiper{
    position:relative;
    overflow:hidden;
    border-top:3px solid #0d626a;
    padding-bottom:50px
}
 .history_slide{
    height:auto;
    display:grid;
    grid-template-columns:36% 64%;
    min-height:390px;
    background:#fff;
    border-right:1px solid #d7e0e2
}
 .history_slide::before{
    content:'';
    position:absolute;
    top:-5px;
    left:50%;
    width:24px;
    height:24px;
    background:#f6f7f6;
    border-right:5px solid #0d626a;
    border-bottom:5px solid #0d626a;
    transform:translate(-50%,-50%) rotate(45deg)
}
 .history_image{
    min-width:0;
    overflow:hidden;
    background:#e9eeee
}
 .history_image img{
    width:100%;
    height:100%;
    object-fit:cover
}
 .history_card{
    min-width:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:46px 38px 34px
}
 .history_year{
    margin-bottom:20px;
    font-size:56px;
    line-height:1
}
 .history_card h3{
    margin:0 0 22px;
    font-family:var(--font-heading);
    font-size:22px;
    line-height:1.24
}
 .history_card p{
    margin-bottom:42px;
    font-size:16px
}
 .history_icon{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#0d6068;
    font-family:"Font Awesome 6 Free";
    font-size:26px;
    font-weight:900;
    line-height:1
}
 .history_icon::before{
    display:block
}
 .history_icon_building::before{
    content:"\f1ad"
}
 .history_icon_global::before{
    content:"\f0ac"
}
 .history_icon_cube::before{
    content:"\f1b2"
}
 .history_icon_team::before{
    content:"\f0c0"
}
 .history_icon_leaf::before{
    content:"\f06c"
}
 .history_scrollbar{
    position:relative!important;
    left:auto!important;
    bottom:auto!important;
    width:calc(100% - 144px)!important;
    height:5px!important;
    margin:48px auto 34px;
    border-radius:999px;
    background:#d5d8d9
}
 .history_scrollbar .swiper-scrollbar-drag{
    height:5px;
    border-radius:999px;
    background:#0d6971
}
 .history_controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:34px
}
 .history_arrow{
    width:58px;
    height:58px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(0,96,104,.55);
    border-radius:50%;
    background:rgba(255,255,255,.74);
    color:#0d6068;
    font-size:26px;
    line-height:1;
    cursor:pointer
}
 .history_arrow:hover{
    background:#0d6068;
    color:#fff
}
 .history_dots{
    position:static!important;
    width:auto!important;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px
}
 .history_dots .swiper-pagination-bullet{
    width:12px;
    height:12px;
    margin:0!important;
    opacity:1;
    background:#d4d6d7
}
 .history_dots .swiper-pagination-bullet-active{
    background:#0d6971
}
 .about_factory_gallery{
    padding:86px 0 78px!important;
    overflow:hidden
}
 .about_factory_gallery .page_content_box{
    width:100%
}
 .factory_showcase_head{
    margin:0 0 58px
}
 .factory_showcase_head span{
    display:flex;
    align-items:center;
    gap:18px;
    margin-bottom:26px;
    color:var(--brand-primary-dark);
    font-size:17px;
    font-weight:800;
    letter-spacing:0;
    text-transform:uppercase
}
 .factory_showcase_head span::after{
    content:'';
    width:52px;
    height:2px;
    background:var(--brand-primary-dark)
}
 .factory_showcase_head h2{
    margin:0 0 24px;
    font-size:36px;
    line-height:1.08
}
 .factory_showcase_head p{
    color:#69737a;
    font-size:17px;
    line-height:1.78
}
 .factory_showcase_wrap{
    position:relative
}
 .factory_swiper{
    overflow:visible;
    padding:0 5.8vw
}
 .factory_slide{
    position:relative;
    height:380px;
    overflow:hidden;
    border-radius:10px;
    background:#dfe8e9;
    box-shadow:0 20px 46px rgba(16,42,48,.1)
}
 .factory_slide::after{
    content:'';
    position:absolute;
    inset:auto 0 0;
    height:42%;
    background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.56))
}
 .factory_slide img{
    width:100%;
    height:100%;
    object-fit:cover
}
 .factory_slide:hover img{
    transform:scale(1.05)
}
 .factory_slide span{
    position:absolute;
    left:0;
    right:0;
    bottom:20px;
    z-index:1;
    color:#fff;
    font-size:16px;
    font-weight:800;
    text-align:center;
    text-shadow:0 2px 12px rgba(0,0,0,.35)
}
 .factory_arrow{
    position:absolute;
    top:50%;
    z-index:5;
    width:58px;
    height:58px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:50%;
    background:#fff;
    color:#0b6b73;
    font-size:22px;
    box-shadow:0 14px 32px rgba(16,42,48,.14);
    transform:translateY(-50%);
    cursor:pointer
}
 .factory_arrow_prev{
    left:3vw
}
 .factory_arrow_next{
    right:3vw
}
 .factory_arrow:hover{
    background:#0b6b73;
    color:#fff
}
 .factory_dots{
    position:static!important;
    display:flex;
    justify-content:center;
    gap:16px;
    margin-top:46px
}
 .factory_dots .swiper-pagination-bullet{
    width:12px;
    height:12px;
    margin:0!important;
    opacity:1;
    background:#d3d7d8
}
 .factory_dots .swiper-pagination-bullet-active{
    background:#0b737b
}
 .about_video_grid{
    display:grid;
    grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);
    gap:48px;
    align-items:center
}
 .about_video_box{
    overflow:hidden;
    border-radius:8px;
    background:#0d2429;
    box-shadow:0 24px 70px rgba(8,42,48,.18)
}
 .about_video_box video{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    object-fit:cover
}
 .about_services{
    background:#f7f8f6;
    background-image:radial-gradient(circle at 12% 18%,rgba(0,137,147,.06),transparent 28%),linear-gradient(135deg,rgba(20,67,70,.04) 0 1px,transparent 1px);
    background-size:auto,42px 42px
}
 .company_services_head{
    margin:0 auto 54px;
    text-align:center
}
 .company_services_head h2{
    margin-bottom:22px;
    font-size:36px
}
 .company_services_head p{
    margin:0 auto;
    font-size:17px;
    line-height:1.65
}
 .about_intro_heading,.certs_head,.company_services_head,.culture_heading,.factory_showcase_head,.history_head{
    margin:0 auto 52px;
    padding:0 24px;
    text-align:center
}
 .company_services_head h2::after,.history_head h2::after{
    display:none;
    content:none
}
 .about_intro_heading h2,.certs_head h2,.company_services_head h2,.culture_heading h2,.factory_showcase_head h2,.history_head h2{
    margin:0 0 16px;
    font-family:var(--font-heading);
    font-size:42px;
    line-height:1.15;
    letter-spacing:0;
    text-transform:none
}
 .about_intro_heading p,.certs_head p,.company_services_head p,.culture_heading p,.factory_showcase_head p,.history_head p{
    margin:0 auto;
    color:#607176;
    font-size:16px;
    line-height:1.75
}
 .about_service_grid{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:30px
}
 .about_service_card{
    min-width:0;
    min-height:260px;
    overflow:hidden;
    display:grid;
    background:#fff;
    border:1px solid #dce4e2;
    border-radius:8px
}
 .about_service_card_large{
    grid-column:span 3;
    grid-template-columns:minmax(0,1.18fr) minmax(0,.88fr)
}
 .about_service_card_small{
    grid-column:span 2;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.8fr)
}
 .service_card_media{
    position:relative;
    min-height:260px;
    overflow:hidden
}
 .service_card_media img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}
 .about_service_card:first-child .service_card_media img{
    object-position:left center
}
 .service_card_media_left{
    clip-path:polygon(0 0,100% 0,84% 100%,0% 100%)
}
 .service_card_media_right{
    clip-path:polygon(16% 0,100% 0,100% 100%,0% 100%)
}
 .service_card_content{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:30px 20px;
    background:#fff
}
 .service_card_top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px
}
 .service_card_top span{
    display:flex;
    align-items:center;
    gap:18px;
    color:#0b6b6d;
    font-family:var(--font-heading);
    font-size:27px;
    font-weight:700;
    line-height:1
}
 .service_card_top span:after{
    content:"";
    display:block;
    width:58px;
    height:1px;
    background:#8fa9aa
}
 .service_card_top img{
    width:50px;
    height:50px;
    flex:0 0 auto;
    border-radius:50%;
    object-fit:contain
}
 .about_service_card h3{
    margin-bottom:16px;
    font-size:20px;
    line-height:1.12
}
 .about_service_card h3:after{
    content:"";
    display:block;
    width:44px;
    height:2px;
    margin-top:18px;
    background:#ddd
}
 .about_service_card p{
    max-width:320px;
    color:#5d696c;
    font-size:14px;
    line-height:1.68
}
 .faq_main{
    background:#fff
}
 .faq_section{
    padding:54px 0 92px
}
 .faq_head{
    max-width:760px;
    margin-bottom:36px
}
 .faq_contact_intro>span,.faq_head>span{
    display:block;
    width:46px;
    height:2px;
    margin-bottom:18px;
    background:var(--brand-primary-dark)
}
 .faq_contact_intro h2,.faq_head h2{
    color:#161c20;
    font-family:var(--font-heading);
    font-size:52px;
    font-weight:500;
    line-height:1.08
}
 .faq_head p{
    max-width:680px;
    margin-top:24px;
    color:#38484d;
    font-size:18px;
    line-height:1.72
}
 .faq_list{
    display:grid;
    gap:12px;
    margin-top:24px
}
 .faq_item{
    overflow:hidden;
    border:1px solid #d9e5e6;
    border-radius:8px;
    background:#fff;
    /* box-shadow:0 10px 34px rgba(7,43,49,.04); */
    transition:border-color .25s ease,box-shadow .25s ease
}
 .faq_item.active{
    border-color:var(--brand-primary-dark);
    /* box-shadow:0 18px 48px rgba(0,87,96,.08); */
}
 .faq_question{
    position:relative;
    display:flex;
    width:100%;
    align-items:center;
    gap:18px;
    min-height:70px;
    padding:22px 68px 22px 40px;
    border:0;
    background:none;
    color:#15262c;
    font-size:20px;
    font-weight:800;
    line-height:1.35;
    cursor:pointer;
    list-style:none
}
 .faq_question span{
    color:var(--brand-primary-dark);
    font-size:19px;
    font-weight:800
}
 .faq_question:after{
    content:"\f107";
    position:absolute;
    top:50%;
    right:32px;
    color:#0a3f47;
    font-family:"Font Awesome 6 Free";
    font-size:18px;
    font-weight:900;
    transform:translateY(-50%);
    transition:transform .25s ease
}
 .faq_item.active .faq_question:after{
    transform:translateY(-50%) rotate(180deg)
}
 .faq_answer{
    padding:0 72px 34px 98px
}
 .faq_answer,
 .faq_answer p{
    max-width:900px;
    color:#46595f;
    font-size:16px;
    line-height:1.82
}
 .faq_contact_panel{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);
    gap:34px;
    align-items:center;
    margin-top:34px;
    padding:46px 56px;
    border-radius:8px;
    background:linear-gradient(135deg,#eef8f8 0,#fff 100%);
    box-shadow:0 16px 50px rgba(7,43,49,.06)
}
 .faq_contact_intro h2{
    font-size:34px
}
 .faq_contact_intro p{
    max-width:430px;
    margin:18px 0 26px;
    color:#52666b;
    font-size:16px;
    line-height:1.72
}
 .faq_contact_intro a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-height:54px;
    padding:0 28px;
    border-radius:6px;
    background:var(--brand-primary-dark);
    color:#fff;
    font-size:14px;
    font-weight:800;
    letter-spacing:.6px;
    text-transform:uppercase;
    transition:background .25s ease,transform .25s ease
}
 .faq_contact_intro a:hover{
    background:var(--brand-primary);
    color:#fff;
    transform:translateY(-2px)
}
 .faq_contact_cards{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0
}
 .faq_contact_card{
    display:grid;
    justify-items:center;
    min-width:0;
    padding:14px 22px;
    border-left:1px solid #d6e4e5;
    color:#172a30;
    text-align:center
}
 .faq_contact_card:first-child{
    border-left:0
}
 .faq_contact_card img{
    width:66px;
    height:66px;
    margin-bottom:18px;
    object-fit:contain
}
 .faq_contact_card b{
    color:#182a30;
    font-size:15px;
    line-height:1.25
}
 .faq_contact_card em{
    display:block;
    max-width:100%;
    margin-top:10px;
    overflow:hidden;
    color:#53676c;
    font-size:14px;
    font-style:normal;
    line-height:1.4;
    text-overflow:ellipsis;
    white-space:nowrap
}
 .pd_section{
    padding:90px 0
}
 .pd_faq_section,.pd_packaging,.pd_reviews{
    padding-bottom:0
}
 .pd_hero_section{
    padding:90px 0;
    background:#fff
}
.pd_hero_section{
    /* padding-bottom: 0; */
}
 .pd_layout{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    gap:30px;
    align-items:start
}
 .pd_gallery{
    min-width:0
}
 .pd_gallery_main{
    position:relative;
    overflow:hidden;
    border:1px solid #dde9ea;
    border-radius:8px;
    background:#fff
}
 .pd_gallery_main .swiper-slide{
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f9fbfb
}
 .pd_gallery_main img{
    display:block;
    width:100%;
    aspect-ratio:1/1;
    object-fit:cover;
    max-height:580px;
    background:#f9fbfb
}
 .pd_zoom_btn{
    position:absolute;
    top:16px;
    left:16px;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border:1px solid rgba(9,78,87,.16);
    border-radius:8px;
    background:rgba(255,255,255,.92);
    color:var(--brand-primary-dark);
    font-size:18px;
    cursor:pointer;
    box-shadow:0 12px 28px rgba(7,43,49,.12);
    transition:background .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease
}
 .pd_zoom_btn:hover{
    background:var(--brand-primary-dark);
    color:#fff;
    transform:translateY(-2px);
    box-shadow:0 16px 32px rgba(7,43,49,.2)
}
 .pd_gallery_arrow{
    position:absolute;
    top:50%;
    z-index:3;
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border:1px solid rgba(9,78,87,.16);
    border-radius:50%;
    background:rgba(255,255,255,.94);
    color:var(--brand-primary-dark);
    cursor:pointer;
    transform:translateY(-50%);
    transition:background .25s ease,color .25s ease,transform .25s ease,opacity .25s ease
}
 .pd_gallery_prev{
    left:16px
}
 .pd_gallery_next{
    right:16px
}
 .pd_gallery_arrow:hover{
    background:var(--brand-primary-dark);
    color:#fff;
    transform:translateY(-50%) scale(1.06)
}
 .pd_gallery_arrow.swiper-button-disabled{
    opacity:.35;
    cursor:default;
    pointer-events:none
}
 .pd_gallery_thumbs{
    margin-top:14px;
    padding:3px 3px 8px
}
 .pd_thumb{
    padding:0;
    overflow:hidden;
    border:1px solid #d8e4e5;
    border-radius:8px;
    background:#fff;
    cursor:pointer;
    opacity:.72;
    transition:border-color .25s ease,box-shadow .25s ease,opacity .25s ease
}
 .pd_thumb img{
    display:block;
    width:100%;
    aspect-ratio:1/1;
    object-fit:cover
}
 .pd_thumb.swiper-slide-thumb-active{
    opacity:1;
    border-color:var(--brand-primary)
}
 .pd_summary{
    min-width:0;
    padding:32px;
    border:1px solid #dce8e9;
    border-radius:8px;
    background:#fff
}
 .pd_inquiry_text span,.pd_kicker,.pd_section_head span{
    display:block;
    margin-bottom:14px;
    color:var(--brand-primary-dark);
    font-size:13px;
    font-weight:800;
    letter-spacing:1.6px;
    text-transform:uppercase
}
 .pd_summary h1{
    margin-bottom: 20px;
    font-size: 22px;
    font-weight: bold;
    line-height: 1.35;
    overflow-wrap:anywhere
}
 .pd_meta{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:14px;
    margin-bottom:18px;
    font-size:14px;
    font-weight:500
}
 .pd_rating{
    display:inline-flex;
    gap:3px;
    color:#f5a400;
    letter-spacing:1px
}
 .pd_views{
    display:inline-flex;
    align-items:center;
    gap:7px
}
 .pd_views i{
    color:var(--brand-primary-dark)
}
 .pd_specs{
    display:grid;
    gap:0;
    margin-bottom:24px;
    border-radius:8px;
    overflow:hidden
}
 .pd_specs div{
    display:grid;
    grid-template-columns:170px minmax(0,1fr);
    border-top:1px solid #fff
}
 .pd_specs div:first-child{
    border-top:0
}
 .pd_specs dd,.pd_specs dt{
    padding:12px 14px;
    font-size:15px;
    line-height:1.45
}
 .pd_specs dt{
    background:#f3f8f8;
    font-weight:600
}
 .pd_specs dd{
    color:#5b6d71
}
 .pd_summary_actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin:-4px 0 20px
}
 .pd_summary_btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-width:0;
    min-height:50px;
    padding:0 18px;
    border:1px solid transparent;
    border-radius:8px;
    font-size:14px;
    font-weight:800;
    letter-spacing:.4px;
    line-height:1.2;
    text-align:center;
    transition:background .25s ease,border-color .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease
}
 .pd_summary_btn:hover{
    transform:translateY(-2px)
}
 .pd_summary_btn_primary{
    background: var(--brand-primary);
    color:#fff
}
 .pd_summary_btn_primary:hover{
    background: var(--brand-primary-dark);
    color:#fff
}
 .pd_summary_btn_secondary{
    border-color:#cfe2e4;
    background:#f7fbfb;
    /* color:#123f47; */
}
 .pd_summary_btn_secondary:hover{
    border-color:var(--brand-primary);
    background:#fff;
    /* color:var(--brand-primary-dark); */
}
 .pd_contact_card{
    display:grid;
    gap:12px
}
 .pd_contact_link{
    display:flex;
    align-items:center;
    gap:14px;
    transition:var( --transition)
}
 .pd_contact_link:hover{
    border-color:rgba(255,255,255,.42);
    background:rgba(255,255,255,.15)
}
 .pd_contact_link i{
    width:38px;
    height:38px;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--brand-primary);
    color:#fff;
    font-size:18px
}
 .pd_contact_link span{
    display:flex;
    gap:13px
}
 .pd_contact_link b{
    display:block
}
 .pd_section_head{
    margin-bottom:38px
}
 .pd_inquiry_text h2,.pd_section_head h2{
    font-size: 30px;
    line-height:1.16
}
 .pd_recommend_grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px
}
 .pd_recommend_carousel{
    position:relative;
    padding:0 54px 48px
}
 .pd_recommend_swiper{
    overflow:hidden
}
 .pd_recommend .products_grid{
    display:flex;
    gap:0
}
 .pd_recommend .item_box{
    height:auto
}
 .pd_recommend .item_box .item{
    height:100%
}
 .pd_rec_arrow{
    position:absolute;
    top:42%;
    z-index:4;
    width:44px;
    height:44px;
    border:1px solid #d6e4e5;
    border-radius:50%;
    background:#fff;
    color:var(--brand-primary-dark);
    cursor:pointer;
    transition:var(--transition)
}
 .pd_rec_arrow:hover{
    border-color:var(--brand-primary);
    background:var(--brand-primary);
    color:#fff
}
 .pd_rec_prev{
    left:0
}
 .pd_rec_next{
    right:0
}
 .pd_rec_dots{
    bottom:0!important;
    display:flex;
    justify-content:center;
    gap:12px
}
 .pd_rec_dots .swiper-pagination-bullet{
    width:10px;
    height:10px;
    margin:0!important;
    opacity:1;
    background:#c9d8da
}
 .pd_rec_dots .swiper-pagination-bullet-active{
    background:var(--brand-primary)
}
 .pd_rec_card{
    min-width:0;
    overflow:hidden;
    display:block;
    border:1px solid #dce8e9;
    border-radius:8px;
    background:#fff;
    box-shadow:0 16px 36px rgba(7,43,49,.06);
    transition:transform .25s ease,box-shadow .25s ease
}
 .pd_rec_card:hover{
    transform:translateY(-5px);
    box-shadow:0 24px 52px rgba(7,43,49,.12)
}
 .pd_rec_card img{
    width:100%;
    height:220px;
    object-fit:cover
}
 .pd_rec_card div{
    padding:20px
}
 .pd_rec_card span{
    color:var(--brand-primary-dark);
    font-size:12px;
    font-weight:800;
    text-transform:uppercase
}
 .pd_rec_card h3{
    margin-top:8px;
    color:#1b3035;
    font-size:18px;
    line-height:1.35
}
.sf_show_products_box{
    padding-top: 45px;
    background: #fafafa;
}
 .pd_video_box{
    position:relative;
    min-height:460px;
    overflow:hidden;
    border-radius:8px
}
 .pd_video_detail{padding-bottom: 0;background: #fafafa;}
 .pd_video_detail_head{
    margin-bottom:22px
}
 .pd_video_detail_head h2{
    /* color:#10292e; */
}
 .pd_video_detail .pd_video_box{
    height:min(450px,52vw);
    min-height:300px;
    max-height:450px
}
 .pd_video_box>img{
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.58
}
 .pd_video_detail .pd_video_box>img{
    opacity:1
}
 .pd_video_box:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(6,34,39,.78),rgba(6,34,39,.18))
}
 .pd_video_detail .pd_video_box:after{
    background:rgba(5,37,42,.22)
}
 .pd_video_play{
    width:86px;
    height:86px
}
 .pd_video_play i{
    display:none
}
 .pd_video_play:before{
    content:"";
    display:block;
    width:0;
    height:0;
    margin-left:5px;
    border-top:12px solid transparent;
    border-bottom:12px solid transparent;
    border-left:18px solid #fff
}
 .pd_video_text{
    position:absolute;
    left:54px;
    bottom:50px;
    z-index:3;
    max-width:520px;
    color:#fff
}
 .pd_video_text span{
    display:block;
    margin-bottom:14px;
    color:#8de5eb;
    font-weight:800;
    letter-spacing:1.6px;
    text-transform:uppercase
}
 .pd_video_text h2{
    margin-bottom:14px;
    font-size:40px;
    line-height:1.12
}
 .pd_video_text p{
    color:rgba(255,255,255,.82);
    font-size:16px;
    line-height:1.7
}
.pd_recommend{
    padding-bottom: 0;
}
 .pd_inquiry_section{
    position:relative;
    background:#fff;
    /* padding-top:0; */
}
 .pd_inquiry_box{
    display:grid;
    grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
    gap:0;
    overflow:hidden;
    border:1px solid #dce8e9;
    border-radius:8px;
    background:#fff
}
 .pd_inquiry_text{
    position:relative;
    overflow:hidden;
    min-height:100%;
    padding:48px;
    background:linear-gradient(145deg,rgba(0,180,192,.18),rgba(0,180,192,0) 42%),#073f46;
    color:#fff
}
 .pd_inquiry_text:after{
    content:"";
    position:absolute;
    right:-86px;
    bottom:-92px;
    width:250px;
    height:250px;
    border:42px solid rgba(255,255,255,.06);
    border-radius:50%
}
 .pd_inquiry_text span{
    color:#65e0e6
}
 .pd_inquiry_text h2{
    max-width:520px;
    color:#fff;
    font-size: 30px;
    line-height:1.14
}
 .pd_inquiry_text p{
    margin-top:18px;
    max-width:520px;
    color:rgba(255,255,255,.78);
    font-size:16px;
    line-height:1.72;
}
 .pd_inquiry_channels{
    position:relative;
    z-index:1;
    display:grid;
    gap:12px;
    margin-top:34px
}
 .pd_inquiry_channels a{
    display:grid;
    grid-template-columns:44px 1fr;
    column-gap:14px;
    align-items:center;
    min-width:0;
    padding:15px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:8px;
    background:rgba(255,255,255,.08);
    color:#fff;
    transition:background .25s ease,border-color .25s ease,transform .25s ease
}
 .pd_inquiry_channels a:hover{
    border-color:rgba(101,224,230,.55);
    background:rgba(255,255,255,.13);
    transform:translateY(-2px)
}
 .pd_inquiry_channels i{
    grid-row:span 2;
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border-radius:8px;
    background:#fff;
    color:var(--brand-primary-dark);
    font-size:20px
}
 .pd_inquiry_channels em{
    color:rgba(255,255,255,.64);
    font-size:12px;
    font-style:normal;
    font-weight:800;
    letter-spacing:1.1px;
    line-height:1;
    text-transform:uppercase
}
 .pd_inquiry_channels strong{
    min-width:0;
    overflow:hidden;
    color:#fff;
    font-size:15px;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap
}
 .pd_inquiry_form{
    padding:48px;
    background:#fff
}
 .pd_inquiry_form .input{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px
}
 .pd_inquiry_form input,.pd_inquiry_form textarea{
    width:100%;
    border:1px solid #d9e7e8;
    border-radius:8px;
    background:#f7fbfb;
    color:#162d33;
    font-family:var(--font-body);
    font-size:14px;
    outline:0;
    transition:border-color .25s ease,background .25s ease,box-shadow .25s ease
}
 .pd_inquiry_form input{
    height:54px;
    padding:0 18px
}
 .pd_inquiry_form textarea{
    height:150px;
    margin:16px 0 18px;
    padding:18px;
    resize:none
}
 .pd_inquiry_form input:focus,.pd_inquiry_form textarea:focus{
    border-color:var(--brand-primary);
    background:#fff;
    box-shadow:0 0 0 4px rgba(0,180,192,.12)
}
 .pd_inquiry_form input::placeholder,.pd_inquiry_form textarea::placeholder{
    color:#8ca0a4
}
 .pd_inquiry_form .btn_effect4{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-width:210px;
    height:54px;
    padding:0 28px;
    border:0;
    border-radius:8px;
    background:var(--brand-primary-dark);
    color:#fff;
    font-size:14px;
    font-weight:800;
    letter-spacing:.8px;
    text-transform:uppercase;
    cursor:pointer;
    transition:background .25s ease,transform .25s ease,box-shadow .25s ease
}
 .pd_inquiry_form .btn_effect4:hover{
    background:var(--brand-primary);
    transform:translateY(-2px)
}

/* Contact page */
.contact_scope{
    max-width:1400px;
    margin:0 auto;
    padding:90px 0 90px
}
.contact_scope .contact_intro{
    margin:0 auto 46px;
    text-align:center
}
.contact_scope .contact_intro h2{
    font-size:30px;
    line-height:1.14
}
.contact_scope .contact_intro p{
    margin:20px auto 0;
    font-size:16px
}
.contact_scope .contact_cards{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:24px;
    margin-bottom:34px
}
.contact_scope .contact_cards article{
    min-width:0;
    padding:34px 28px;
    border:1px solid #e1e9ea;
    border-radius:8px;
    background:#fff;
    text-align:center
}
.contact_scope .contact_cards i{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:60px;
    height:60px;
    margin-bottom:18px;
    border-radius:50%;
    background:var(--brand-primary-dark);
    color:#fff;
    font-size:23px
}
.contact_scope .contact_cards h3{
    margin-bottom:14px;
    font-family:var(--font-heading);
    font-size:18px;
    font-weight:600
}
.contact_scope .contact_cards a,
.contact_scope .contact_cards p{
    color:#53646a;
    font-size:15px;
    line-height:1.65
}
.contact_scope .contact_form_map{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:24px;
    margin-bottom:70px
}
.contact_scope .contact_form_box,
.contact_scope .contact_map{
    min-width:0;
    min-height:520px;
    border:1px solid #e1e9ea;
    border-radius:8px
}
.contact_scope .contact_form_box{
    padding:34px
}
.contact_scope .contact_form_box h2{
    margin-bottom:10px;
    font-size:30px
}
.contact_scope .contact_form_box>p{
    margin-bottom:22px;
    color:#627277;
    font-size:15px
}
.contact_scope .contact_form .input{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px
}
.contact_scope .contact_form input,
.contact_scope .contact_form textarea{
    width:100%;
    border:1px solid #d8e4e5;
    border-radius:6px;
    background:#fff;
    color:#17242a;
    font-family:var(--font-body);
    font-size:14px;
    outline:0;
    transition:border-color .25s ease,box-shadow .25s ease
}
.contact_scope .contact_form input{
    height:50px;
    padding:0 16px
}
.contact_scope .contact_form>input{
    margin-top:14px
}
.contact_scope .contact_form textarea{
    height:132px;
    margin-top:14px;
    padding:16px;
    resize:none
}
.contact_scope .contact_form input:focus,
.contact_scope .contact_form textarea:focus{
    border-color:var(--brand-primary);
    box-shadow:0 0 0 4px rgba(0,180,192,.12)
}
.contact_scope .contact_policy{
    display:flex;
    align-items:center;
    gap:10px;
    margin:16px 0 20px;
    color:#53646a;
    font-size:14px
}
.contact_scope .contact_policy input{
    width:16px;
    height:16px;
    flex:0 0 auto
}
.contact_scope .contact_form button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:52px;
    padding:0 28px;
    border:0;
    border-radius:6px;
    background:var(--brand-primary-dark);
    color:#fff;
    font-weight:800;
    cursor:pointer;
    transition:background .25s ease,transform .25s ease
}
.contact_scope .contact_form button:hover{
    background:var(--brand-primary);
    transform:translateY(-2px)
}
.contact_scope .contact_map{
    position:relative;
    overflow:hidden;
    background:#eef6f6
}
.contact_scope .contact_map iframe{
    display:block;
    width:100%;
    height:100%;
    min-height:520px;
    border:0
}
.contact_scope .contact_map:after,
.contact_scope .contact_map:before{
    display:none
}
.contact_scope .contact_team{
    position:relative;
    padding:60px 0 30px
}
.contact_scope .contact_team .contact_intro{
    margin-bottom:50px
}
.contact_scope .contact_team_wrap{
    position:relative;
    padding:0 55px 60px
}
.contact_scope .contact_member{
    display:grid;
    grid-template-columns:128px 1fr;
    gap:24px;
    padding:24px;
    border:1px solid #e1e9ea;
    border-radius:8px;
    background:#fff
}
.contact_scope .contact_avatar{
    display:flex;
    align-items:center;
    justify-content:center;
    width:128px;
    height:156px;
    border-radius:8px;
    overflow:hidden;
    background:#eef6f6
}
.contact_scope .contact_avatar img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover
}
.contact_scope .contact_member h3{
    margin-bottom:10px;
    font-size:20px;
    font-weight:600
}
.contact_scope .contact_member span{
    display:block;
    margin-bottom:16px;
    color:#6a7a7e;
    font-size:14px
}
.contact_scope .contact_member p{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:9px;
    font-size:14px
}
.contact_scope .contact_member p i{
    color:var(--brand-primary-dark)
}
.contact_scope .contact_member p a{
    color:#6a7a7e;
    text-decoration:none
}
.contact_scope .contact_member p a:hover{
    color:var(--brand-primary-dark)
}
.contact_scope .contact_member .contact_member_btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:8px;
    padding:5px 10px;
    border:1px solid var(--brand-primary-dark);
    border-radius:6px;
    color:var(--brand-primary-dark);
    font-size:13px;
    font-weight:800
}
.contact_scope .contact_member .contact_member_btn:hover{
    background:var(--brand-primary-dark);
    color:#fff
}
.contact_scope .contact_team_arrow{
    position:absolute;
    top:50%;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border:1px solid #d8e4e5;
    border-radius:50%;
    background:#fff;
    color:var(--brand-primary-dark);
    cursor:pointer;
    transform:translateY(-50%)
}
.contact_scope .contact_team_prev{
    left:0
}
.contact_scope .contact_team_next{
    right:0
}
.contact_scope .contact_team_dots{
    bottom:8px!important
}
.contact_scope .contact_team_dots .swiper-pagination-bullet{
    background:#9db8bb;
    opacity:1
}
.contact_scope .contact_team_dots .swiper-pagination-bullet-active{
    background:var(--brand-primary-dark)
}
.contact_scope .contact_social{
    text-align:center
}
.contact_scope .contact_social div{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:22px
}
.contact_scope .contact_social a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:52px;
    height:52px;
    border-radius:50%;
    background:var(--brand-primary-dark);
    color:#fff;
    font-size:20px;
    transition:transform .25s ease,background .25s ease
}
.contact_scope .contact_social a:hover{
    background:var(--brand-primary);
    transform:translateY(-3px)
}

.quotation-page{
    background:linear-gradient(180deg,#fff 0,#f4fbfb 100%);
    color:var(--color-body)
}
.quotation-page .contact-shell{
    width:min(var(--max-width),calc(100% - 48px));
    margin:0 auto;
    padding:72px 0 96px
}
.quotation-intro{
    max-width:900px;
    margin:0 auto 36px;
    text-align:center
}
.quotation-intro h1{
    margin:0 0 14px;
    color:var(--color-title);
    font-size:clamp(32px,3.8vw,48px);
    line-height:1.12;
    font-weight:800
}
.quotation-intro p{
    max-width:820px;
    margin:0 auto;
    color:var(--color-body);
    font-size:16px;
    line-height:1.8
}
.quotation-layout{
    display:grid;
    grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);
    gap:28px;
    align-items:start
}
.quotation-page .form-card,
.quote-selection-card{
    background:#fff;
    border:1px solid rgba(0,107,115,.12);
    border-radius:8px;
    box-shadow:0 18px 48px rgba(7,43,49,.06)
}
.quote-selection-card{
    padding:30px
}
.quote-card-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:22px
}
.quotation-page .form-card-header h2,
.quote-card-head h2{
    margin:0;
    color:var(--color-title);
    font-size:22px;
    line-height:1.25;
    font-weight:800
}
.quote-list-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px
}
.quotation-page .btn-continue,
.quote-list-actions button{
    border:1px solid rgba(0,107,115,.18);
    background:#eefafa;
    color:var(--brand-primary-dark);
    border-radius:999px;
    padding:10px 15px;
    font-size:14px;
    font-weight:700;
    cursor:pointer;
    transition:background .2s,color .2s,border-color .2s,transform .2s
}
.quotation-page .btn-continue:hover,
.quote-list-actions button:hover{
    background:var(--brand-primary-dark);
    border-color:var(--brand-primary-dark);
    color:#fff;
    transform:translateY(-1px)
}
.quote-empty{
    border:1px dashed rgba(0,107,115,.28);
    border-radius:8px;
    background:#f4fbfb;
    padding:34px 24px;
    text-align:center
}
.quote-empty h3{
    margin:0 0 8px;
    color:var(--color-title);
    font-size:18px;
    font-weight:800
}
.quote-empty p{
    margin:0 0 18px;
    color:var(--color-body);
    font-size:14px;
    line-height:1.7
}
.quotation-page .btn-cta,
.quotation-page .btn-submit{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    border:0;
    border-radius:999px;
    padding:12px 24px;
    background:var(--brand-primary);
    color:#fff;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
    transition:transform .2s,box-shadow .2s,background .2s
}
.quotation-page .btn-cta:hover,
.quotation-page .btn-submit:hover{
    background:var(--brand-primary-dark);
    transform:translateY(-1px);
    box-shadow:0 12px 26px rgba(0,107,115,.2)
}
.quote-product-list{
    display:flex;
    flex-direction:column;
    gap:12px
}
.quote-product-item{
    display:grid;
    grid-template-columns:76px minmax(0,1fr);
    gap:14px;
    align-items:center;
    padding:12px;
    border:1px solid rgba(0,107,115,.12);
    border-radius:8px;
    background:#f8fcfc
}
.quote-product-media{
    width:76px;
    height:76px;
    border-radius:8px;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(0,107,115,.12)
}
.quote-product-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}
.quote-product-body{
    min-width:0
}
.quote-product-title{
    display:block;
    color:var(--color-title);
    font-size:15px;
    font-weight:700;
    line-height:1.35;
    text-decoration:none
}
.quote-product-title:hover{
    color:var(--brand-primary-dark)
}
.quote-product-actions{
    grid-column:1/-1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px
}
.quote-product-select{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--color-body);
    font-size:14px;
    font-weight:700;
    cursor:pointer
}
.quote-product-check{
    width:16px;
    height:16px;
    accent-color:var(--brand-primary-dark)
}
.quote-product-remove{
    border:0;
    background:0 0;
    color:#dc2626;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
    padding:4px 0
}
.quote-list-footer{
    margin-top:20px
}
.quote-list-footer p{
    margin:0;
    color:var(--color-body);
    font-size:14px;
    font-weight:700
}
.quotation-page .form-card{
    padding:34px 36px 32px
}
.quotation-page .form-card-header{
    margin-bottom:24px
}
.quotation-page .form-card-header p{
    color:var(--color-body);
    font-size:14px;
    line-height:1.7;
    margin:8px 0 0
}
.quotation-page .form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px
}
.quotation-page .form-group{
    display:flex;
    flex-direction:column;
    gap:7px
}
.quotation-page .form-group.full{
    grid-column:1/-1
}
.quotation-page .form-group label{
    color:var(--color-title);
    font-size:13px;
    font-weight:800
}
.quotation-page .form-group label span{
    color:#dc2626
}
.quotation-page .form-group input,
.quotation-page .form-group textarea{
    width:100%;
    border:1px solid rgba(0,107,115,.18);
    border-radius:8px;
    background:#f7fbfb;
    color:var(--color-title);
    font-size:16px;
    padding:15px;
    outline:0;
    font-family:inherit;
    transition:border-color .2s,box-shadow .2s,background .2s
}
.quotation-page .form-group textarea{
    min-height:150px;
    resize:vertical
}
.quotation-page .form-group input:focus,
.quotation-page .form-group textarea:focus{
    border-color:var(--brand-primary);
    background:#fff;
    box-shadow:0 0 0 3px rgba(0,181,193,.12)
}
.quotation-submit{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    margin-top:24px
}

.bd-page{
    background:linear-gradient(180deg,#f6fbfb 0,#f6fbfb 100%);
    color:var(--color-body)
}
.page_detail .bd-layout{
    display: block;
}
.bd-page .container{
    max-width:var(--max-width);
    width:min(var(--max-width),calc(100% - 48px));
    margin:0 auto
}
.bd-hero{
    padding: 90px 0 0;
    /* background: #fafafa; */
}
.bd-hero-grid{
    display:block;
    max-width:90%;
    margin:0 auto;
    text-align:center
}
.bd-hero-copy h1{
    margin:0;
    color:var(--color-title);
    font-size: clamp(20px,3.2vw,26px);
    line-height:1.22;
    letter-spacing:0;
    font-weight: 600;
}
.bd-meta{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:20px;
    margin:20px 0 0;
    color:var(--color-body);
    font-size: 15px;
    font-weight:500
}
.bd-meta-item{
    display:inline-flex;
    align-items:center;
    gap: 10px;
    /* min-height:26px; */
    white-space:nowrap;
    /* font-size: 15px; */
}
.bd-meta-item svg{
    width:20px;
    height:20px;
    flex:0 0 auto;
    fill:none;
    stroke:var(--color-body);
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round
}
.bd-content{
    padding: 70px 0 90px;
    /* background: #fafafa; */
}
.bd-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:30px;
    align-items:start;
    /* margin-bottom:40px; */
}
.bd-article{
    min-width:0
}
.bd-body{
    padding: 30px;
    /* border:1px solid var(--color-border); */
    border-radius:8px;
    background:#fff;
    /* box-shadow:0 18px 48px rgba(7,43,49,.05); */
}
.bd-body>:first-child{
    margin-top:0
}
.bd-body>:last-child{
    margin-bottom:0
}
.bd-body p{
    margin:0 0 20px;
    color:var(--color-body);
    font-size:16px;
    line-height: 1.55;
    overflow-wrap:anywhere
}
.bd-body h2,
.bd-body h3,
.bd-body h4{
    color:var(--color-title);
    scroll-margin-top:110px
}
.bd-body h2{
    position:relative;
    margin: 30px 0 15px;
    /* padding-left:18px; */
    font-size: 22px;
    line-height:1.25;
    font-weight: 600;
}
.bd-body h3{
    margin:34px 0 14px;
    font-size:24px;
    line-height:1.3;
    font-weight:800
}
.bd-body h4{
    margin:28px 0 12px;
    font-size:20px;
    line-height:1.35;
    font-weight:800
}
.bd-body img{
    /* width:100%; */
    max-width:100%!important;
    height:auto;
    display:block;
    margin:28px 0 12px;
    border-radius:5px
}
.bd-body p:has(> img){
    margin: 20px 0 15px;
}
.bd-body p:has(> img) img{
    margin:0
}
.bd-body p:has(> strong):not(:has(img)){
    margin-top:-2px;
    color:var(--color-light);
    font-size:14px;
    line-height:1.6;
    text-align:center
}
.bd-body strong{
    color:var(--color-title);
    font-weight: 600;
}
.bd-body a{
    color:var(--brand-primary-dark);
    font-weight:700;
    text-decoration:underline;
    text-underline-offset:3px
}
.bd-body ol,
.bd-body ul{
    display:grid;
    gap:10px;
    margin:0 0 24px 24px;
    color:var(--color-body);
    font-size:16px;
    line-height:1.85
}
.bd-body li::marker{
    color:var(--brand-primary-dark);
    font-weight:800
}
.bd-table-wrap{
    overflow:auto;
    margin:28px 0
}
.bd-body table{
    width:100%;
    min-width:680px;
    border-collapse:collapse;
    border-radius:8px;
    overflow:hidden;
    box-shadow:0 0 0 1px var(--color-border)
}
.bd-body td,
.bd-body th{
    padding:14px 16px;
    border-bottom:1px solid var(--color-border);
    color:var(--color-body);
    font-size:15px;
    line-height:1.6;
    text-align:left
}
.bd-body th{
    background:#eefafa;
    color:var(--color-title);
    font-weight:800
}
.bd-sidebar{
    position:sticky;
    top:96px;
    display:grid;
    gap:18px
}
.bd-sidecard{
    padding: 20px;
    /* border:1px solid var(--color-border); */
    border-radius:8px;
    background:#fff;
    /* box-shadow:0 12px 34px rgba(7,43,49,.04); */
}
.bd-sidecard-tag{
    display:inline-block;
    margin-bottom:12px;
    color:var(--brand-primary-dark);
    font-size: 14px;
    /* font-weight:900; */
    letter-spacing:2px;
    text-transform:uppercase
}
.bd-sidecard h3,
.bd-toc-card .sidebar-widget-title{
    margin:0 0 12px;
    color:var(--color-title);
    font-size:18px;
    line-height:1.25
}
.bd-sidecard p{
    margin:0;
    color:var(--color-body);
    font-size:14px;
    line-height:1.75
}
.bd-side-list{
    display:grid;
    gap: 10px;
    margin:10px 0 0;
    padding:0;
    list-style:none
}
.bd-side-list a{
    display:block;
    padding: 0;
    color:var(--color-body);
    font-size: 15px;
    font-weight:500;
    line-height:1.45;
    text-decoration:none;
    transition:color .2s,padding-left .2s
}
.bd-side-list a.active,
.bd-side-list a:hover,
.bd-side-list li.active>a{
    padding-left: 4px;
    color:var(--brand-primary-dark)
}
.bd-toc-fab,
.bd-toc-mask{
    display:none
}
body.bd-toc-open{
    overflow:hidden
}
.bd-sidecard-dark{
    background:linear-gradient(135deg,#10292d 0,var(--brand-primary-dark) 100%);
    color:#fff
}
.bd-sidecard-dark h3,
.bd-sidecard-dark p{
    color:#fff
}
.bd-sidecard-dark .bd-sidecard-tag{
    color:#a8f8ff
}
.bd-side-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    margin-top:18px;
    padding:10px 18px;
    border-radius:999px;
    background:#fff;
    color:var(--brand-primary-dark);
    font-size:14px;
    font-weight:900;
    text-decoration:none;
    transition:transform .2s,box-shadow .2s
}
.bd-side-btn:hover{
    transform:translateY(-1px);
    box-shadow:0 12px 24px rgba(0,0,0,.14)
}
.bd-related-list{
    display:grid;
    gap:14px
}
.bd-related-item{
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    gap:12px;
    align-items:center;
    color:inherit;
    text-decoration:none
}
.bd-related-item img{
    width:82px;
    height:82px;
    border-radius:8px;
    object-fit:cover;
    background:#eefafa
}
.bd-related-item strong{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    overflow:hidden;
    color:var(--color-title);
    font-size: 15px;
    line-height:1.45;
    font-weight: 600;
}
.bd-related-item span{
    display:block;
    margin-top:5px;
    color:var(--color-light);
    font-size: 14px;
}
.bd-post-nav{
    padding:0 0 96px
}
.bd-post-nav-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px
}
.bd-post-nav-grid:empty{
    display:none
}
.bd-post-nav-item{
    display:grid;
    gap:10px;
    padding:20px;
    /* border:1px solid var(--color-border); */
    border-radius:8px;
    background:#fff;
    color:inherit;
    text-decoration:none;
    transition:transform .2s,border-color .2s,box-shadow .2s
}
.bd-post-nav-item:hover{
    transform:translateY(-2px);
    border-color:rgba(0,107,115,.24);
    /* box-shadow:0 12px 30px rgba(7,43,49,.06); */
}
.bd-post-nav-empty-item{
    background:#f7fbfb;
    color:var(--color-light);
    box-shadow:none
}
.bd-post-nav-empty-item:hover{
    transform:none;
    border-color:var(--color-border);
    box-shadow:none
}
.bd-post-nav-empty-item .bd-post-nav-label{
    color:var(--color-title)
}
.bd-post-nav-next{
    text-align:right
}
.bd-post-nav-label{
    color:var(--brand-primary-dark);
    font-size: 13px;
    font-weight: 600;
    text-transform:uppercase
}
.bd-post-nav-item strong{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    color:var(--color-title);
    font-size: 16px;
    line-height:1.4;
    font-weight: 500;
}
.loading-box{
    position:fixed;
    inset:0;
    z-index:99999;
    display:none;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,.48);
}
.loading-box[style*="block"]{
    display:flex!important;
}
.loading-spinner{
    width:48px;
    height:48px;
    border:4px solid rgba(255,255,255,.35);
    border-top-color:#fff;
    border-radius:50%;
    animation:loadingSpin .8s linear infinite;
}
@keyframes loadingSpin{
    to{transform:rotate(360deg);}
}