﻿@import url(https://js01.v15cdn.com/single-template/public.css); 
#home-swiper .swiper-slide{position:relative}
#home-swiper .banner-caption{position:absolute;inset:0;display:flex;align-items:center;z-index:5;pointer-events:none}
#home-swiper .banner-caption .cap-inner{max-width:1200px;margin:0 auto;padding:0 20px;width:100%}
#home-swiper .banner-caption.banner-right{justify-content:flex-end;background:linear-gradient(90deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.5) 100%)}
#home-swiper .banner-caption.banner-right .cap-inner{text-align:right;margin:0 8% 0 auto}
#home-swiper .banner-caption.banner-left{justify-content:flex-start;background:linear-gradient(90deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,0) 65%)}
#home-swiper .banner-caption.banner-left .cap-inner{text-align:left;margin:0 auto 0 8%}
@media(max-width:768px){
#home-swiper .banner-caption.banner-right,#home-swiper .banner-caption.banner-left{justify-content:center;background:linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,.6) 100%)}
#home-swiper .banner-caption.banner-right .cap-inner,#home-swiper .banner-caption.banner-left .cap-inner{text-align:center;margin:0 auto}
}
#home-swiper .banner-eyebrow{color:#bfe0ff;font-size:16px;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;text-shadow:0 1px 8px rgba(0,0,0,.45)}
#home-swiper .banner-title{color:#fff;font-size:52px;line-height:1.15;font-weight:700;margin-bottom:14px;text-shadow:0 2px 14px rgba(0,0,0,.55)}
#home-swiper .banner-sub{color:#eaf3fb;font-size:18px;line-height:1.7;max-width:850px;text-shadow:0 1px 10px rgba(0,0,0,.55)}
#home-swiper .banner-caption.banner-right .banner-sub{margin-left:auto}
#home-swiper .banner-caption .banner-btn{display:inline-block;margin-top:22px;padding:13px 32px;background:var(--color);color:#fff;font-size:16px;font-weight:600;border-radius:4px;text-decoration:none;pointer-events:auto;transition:background .25s,transform .25s,box-shadow .25s}
#home-swiper .banner-caption .banner-btn:hover{background:#0a5d9e;transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.3)}
@media (max-width:1440px){#home-swiper .banner-eyebrow{font-size:14px}
#home-swiper .banner-title{font-size:42px}
#home-swiper .banner-sub{font-size:16px}}
@media (max-width:1200px){#home-swiper .banner-eyebrow{font-size:14px}
#home-swiper .banner-title{font-size:32px}
#home-swiper .banner-sub{font-size:14px}}
@media(max-width:768px){#home-swiper .banner-eyebrow{font-size:12px}
#home-swiper .banner-title{font-size:24px}
#home-swiper .banner-sub{font-size:12px}
#home-swiper .banner-caption .banner-btn{display:none}}
@media(max-width:600px){#home-swiper .banner-title{font-size:18px}
#home-swiper .banner-sub{display:none}}

/* Promotional Video -> Manufacturing Capabilities: keep title on one line */
#info .info-title{white-space:nowrap;font-size:30px}
@media(max-width:768px){#info .info-title{white-space:normal;font-size:24px}}

/* Section subtitles (task 3) */
.home-sub{margin:14px auto 0;color:#6b7785;font-size:16px;line-height:1.7;max-width:900px}
#about .home-sub{margin-left:0;text-align:left;max-width:640px}
#brand .home-sub{margin:14px auto 0}

/* wmpage242 contact block (task 5) — scoped so it cannot change the template accent */
.wmpage242-page1{--color:#0a5b9c;--color-dark:#074a80;--fontsize32:32px;--fontsize24:24px;--fontsize20:20px;--fontsize16:16px;--fontsize14:14px;--fontbold7:700;--fontbold4:400}
.wmpage242-page1{background-color:#f5f5f5}
.wmpage242-page1 .contact-top{display:flex;justify-content:space-between;flex-wrap:wrap;padding:5% 0;position:relative;z-index:1;align-items:center}
.wmpage242-page1 .contact-top::before{display:none}
.wmpage242-page1 .contact-top .contact-info{width:48%}
.wmpage242-page1 .contact-top .contact-info .title{font-size:var(--fontsize32);font-weight:var(--fontbold7)}
.wmpage242-page1 .contact-top .contact-info .txt{margin:20px 0}
.wmpage242-page1 .contact-top .contact-info .line{width:80px;height:2px;background-color:var(--color);display:block;margin-bottom:20px}
.wmpage242-page1 .contact-top .contact-info .tit{color:#000;font-size:var(--fontsize24);font-weight:var(--fontbold7);margin-bottom:20px}
.wmpage242-page1 .contact-top .contact-info .txt-list{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.wmpage242-page1 .contact-top .contact-info .txt-list li{width:50%;margin-bottom:10px;font-size:var(--fontsize16)}
.wmpage242-page1 .contact-top .contact-info .txt-list li em{color:var(--color);font-weight:var(--fontbold7);margin-right:6px;font-style:normal}
.wmpage242-page1 .wmkcfeedback .inquiry-form{display:flex;flex-wrap:wrap;justify-content:space-between}
.wmpage242-page1 .wmkcfeedback input,.wmpage242-page1 .wmkcfeedback textarea{outline:0;border-radius:5px;border:none;background-color:#fff;height:48px;padding:10px;margin-bottom:1em;font-family:inherit;border:1px solid #eaeaea;font-size:16px;width:100%}
.wmpage242-page1 .contact-top .contact-wmkcfeedback{width:48%;padding:40px 60px;background-color:#fff;border-radius:3px;box-shadow:0 5px 46px 3px rgba(205,205,205,.44)}
.wmpage242-page1 .contact-top .contact-wmkcfeedback .title{color:#000;font-size:var(--fontsize24);font-weight:var(--fontbold7)}
.wmpage242-page1 .contact-wmkcfeedback .wmkcfeedback .send-btn{width:100%;color:#fff}
.wmpage242-page1 .wmkcfeedback textarea{width:100%!important;flex:none!important;height:140px;resize:none}
.wmpage242-page1 .wmkcfeedback .send-btn{margin:0 auto;min-width:250px;height:48px;border-radius:5px;font-size:var(--fontsize16);background:var(--color);color:#fff;font-weight:var(--fontbold4);display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;outline:0;padding:0 20px;transition:all .1s linear;position:relative;overflow:hidden}
.wmpage242-page1 .wmkcfeedback .send-btn:hover{background:var(--color-dark)}
@media screen and (max-width:1024px){
.wmpage242-page1 .contact-top .contact-info{width:100%}
.wmpage242-page1 .contact-top{padding:40px 0}
.wmpage242-page1 .contact-top .contact-wmkcfeedback{width:100%;margin-top:20px}
.wmpage242-page1 .contact-top .contact-info .title{font-size:var(--fontsize24)}
.wmpage242-page1 .contact-top .contact-info .tit{font-size:var(--fontsize20)}
.wmpage242-page1 .contact-top .contact-wmkcfeedback .title{font-size:var(--fontsize20)}
}
@media screen and (max-width:768px){.wmpage242-page1 .contact-top .contact-wmkcfeedback{padding:20px}}

/* ===== Featured Products — wmpage187-page3 style (own title style, not the m422 template) ===== */
.wmpage187-page3{--wmpage-color19:#555;--wmpage-font17:16px;--wmpage-font20:20px;--wmpage-font14:14px;--wmpage-font15:14px;--fontbold6:500;--fontbold7:700}
.wmpage187-page3 .wmpage187-page3-top{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 auto;padding-bottom:25px;border-bottom:1px solid #b9b9be}
.wmpage187-page3 .wmpage187-page3-text{color:var(--color);font-weight:var(--fontbold7);font-size:var(--wmpage-font17)}
.wmpage187-page3 .wmpage187-page3-right{display:flex;align-items:center}
.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-next,.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-prev{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #d9d9d9;transition:all .2s linear}
.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-next{margin-right:20px}
.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-next em,.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-prev em{color:var(--wmpage-color19);transition:all .2s linear}
.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-next:hover,.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-prev:hover{background:var(--color);border-color:var(--color)}
.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-next:hover em,.wmpage187-page3 .wmpage187-page3-right .wmpage187-page3-prev:hover em{color:#fff}
.wmpage187-page3 .wmpage187-page3-bottom{padding:40px 0 10px}
.wmpage187-page3 .wmpage187-page3-bottom .wmpage187-page3-slide{position:relative;overflow:hidden;border-radius:8px}
.wmpage187-page3 .wmpage187-page3-bottom .wmpage187-page3-slide::before{position:absolute;content:'';width:0;height:100%;left:0;top:0;background:var(--color);border-radius:8px;transition:.5s;opacity:0}
.wmpage187-page3 .wmpage187-page3-bottom .wmpage187-page3-slide:hover::before{width:100%;opacity:0.5}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-img{position:relative;z-index:-1}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:1}
/* Featured Products section title — explicit so it always shows */
.wmpage187-page3 .wmpage187-page3-left .wmpage-title{color:#1a1a1a;font-size:30px;font-weight:var(--fontbold7);margin:6px 0 0;font-family:var(--fontfamily)}
/* each card: product title shown DIRECTLY on the image */
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 16px 16px;background:linear-gradient(to top,rgba(0,0,0,.62),rgba(0,0,0,0))}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-cap .wmpage187-page3-title{color:#fff;font-weight:var(--fontbold7);font-size:var(--wmpage-font20);text-shadow:0 1px 4px rgba(0,0,0,.55)}
/* hover reveals MORE DETAILED info (description + button) */
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-info{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(18px);transition:.4s;pointer-events:none}
.wmpage187-page3 .wmpage187-page3-slide:hover .wmpage187-page3-info{opacity:1;transform:translateY(0);pointer-events:auto}
.wmpage187-page3 .wmpage187-page3-slide:hover .wmpage187-page3-cap{opacity:0}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-content{margin:15px;padding:24px 20px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px);border-radius:10px;color:#fff;max-width:90%}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-desc{color:#fff;font-size:var(--wmpage-font14);line-height:1.5;padding:5px 0 12px;border-bottom:1px solid rgba(255,255,255,.2);margin-bottom:12px}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-title{color:#fff;font-weight:var(--fontbold7);font-size:var(--wmpage-font20)}
.wmpage187-page3 .wmpage187-page3-slide ul li{position:relative;margin-top:5px;padding-left:15px;color:#fff;font-size:var(--wmpage-font15)}
.wmpage187-page3 .wmpage187-page3-slide ul li::after{position:absolute;content:'';width:4px;height:4px;border-radius:50px;background:#fff;left:0;top:50%;transform:translateY(-50%)}
.wmpage187-page3 .wmpage187-page3-slide ul li span{font-weight:var(--fontbold6)}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-btn a{position:relative;display:inline-flex;justify-content:center;align-items:center;min-width:150px;height:35px;background:var(--color);padding:0 20px;color:#fff;font-weight:var(--fontbold6);margin-top:15px;border-radius:5px;overflow:hidden;z-index:1}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-btn a::before{position:absolute;left:0;top:0;width:100%;height:100%;content:'';background:#1f1f25;transform:translateY(110%);transition:.3s;transition-delay:.1s;z-index:-1}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-btn a:hover::before{transform:translateY(0)}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-btn em{font-size:13px;margin-left:10px;transform:rotate(-35deg)}
.wmpage187-page3 .wmpage187-page3-left .home-sub{max-width:540px;margin:12px 0 0;text-align:left;color:#5b6573}
@media screen and (max-width:500px){.wmpage187-page3 .wmpage187-page3-top{flex-direction:column}
.wmpage187-page3 .wmpage187-page3-right{margin-top:20px}
.wmpage187-page3 .wmpage187-page3-slide .wmpage187-page3-img img{height:510px}
}

/* ===== FIX: the m422 template styles #projects as a DARK section
   (#projects::before paints a solid #222 block over the top 65%).
   Our Featured Products header is a static element, so that block was
   painted ON TOP of the title and hid it. We neutralise the template
   design and make this section light, exactly like wmpage187-page3. ===== */
#projects{background:#fff;padding:80px 0 70px;overflow:hidden}
#projects::before,#projects::after{display:none}
#projects .wmpage187-page3{max-width:1600px;margin:0 auto;padding:0 20px;position:relative;z-index:1;box-sizing:border-box}
#projects .wmpage-lwrap{max-width:100%;padding:0}
#projects .wmpage187-page3-bottom{overflow:hidden}
/* slide becomes its own stacking context so the z-index:-1 image stays
   above the white section background (but still below the hover overlay) */
#projects .wmpage187-page3-slide{z-index:0}
/* Featured Products title — forced visible with ID-level specificity */
#projects .wmpage187-page3-left{flex:1;text-align:center}
#projects .wmpage187-page3-left .wmpage-title{display:block;color:#1a1a1a;font-size:30px;font-weight:700;margin:6px 0 0;font-family:var(--fontfamily);text-align:center}
#projects .wmpage187-page3-left .wmpage187-page3-text{color:var(--color);text-align:center}
#projects .wmpage187-page3-left .home-sub{color:#5b6573;max-width:900px;margin:12px auto 0;text-align:center}
@media(max-width:768px){#projects{padding:60px 0 50px}}

/* ===== Custom Glass & Mirror OEM/ODM Solutions section ===== */
.oem-odm-section{background:#fff;padding:80px 0 70px}
.oem-odm-section .oem-odm-inner{max-width:1600px;margin:0 auto;padding:0 20px}
.oem-odm-section .section-head{text-align:center;margin-bottom:14px}
.oem-odm-section .eyebrow{display:inline-block;color:var(--color);font-size:14px;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin-bottom:8px}
.oem-odm-section h2{font-size:34px;font-weight:700;color:#1a1a1a;margin:0}
.oem-odm-section .home-sub{max-width:940px;margin:14px auto 0;text-align:center;color:#5b6573;line-height:1.75;font-size:16px}
.oem-odm-section .sub-head{margin:48px 0 24px;text-align:center}
.oem-odm-section .sub-head h3{font-size:24px;font-weight:700;color:#1a1a1a;margin:0;position:relative;display:inline-block;padding-bottom:12px}
.oem-odm-section .sub-head h3::after{content:'';position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:60px;height:3px;background:var(--color);border-radius:2px}
.oem-odm-section .oem-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px}
.oem-odm-section .oem-card{background:#f7f8fa;border:1px solid #ecedf0;border-radius:10px;padding:30px 26px;transition:all .25s ease}
.oem-odm-section .oem-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,.08);border-color:var(--color)}
.oem-odm-section .oem-card .oem-num{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--color);color:#fff;font-weight:700;font-size:15px;margin-bottom:16px}
.oem-odm-section .oem-card h4{font-size:18px;font-weight:700;color:#1a1a1a;margin:0 0 10px}
.oem-odm-section .oem-card p{font-size:15px;line-height:1.65;color:#5b6573;margin:0}
.oem-odm-section .process-note{max-width:1000px;margin:24px auto 0;color:#5b6573;line-height:1.85;font-size:15px;text-align:center}
.oem-odm-section .process-note p{margin:0 0 14px}
@media(max-width:900px){.oem-odm-section .oem-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.oem-odm-section{padding:60px 0 50px}}
@media(max-width:600px){.oem-odm-section .oem-grid{grid-template-columns:1fr}.oem-odm-section h2{font-size:26px}.oem-odm-section .sub-head h3{font-size:20px}}

/* ===== Our Glass & Mirror Manufacturing Capabilities: background image + darken ===== */
/* Background is declared in CSS (not only via data-bg) so it still renders when the
   template lazy-load JS is unavailable or blocked. */
#info{position:relative;background-image:url(/uploads/42655/banner/2024101201293363f29.jpg);background-size:cover;background-position:center center;background-repeat:no-repeat;background-color:#3a3f45}
#info::before{content:'';width:100%;height:100%;display:block;background:rgba(0,0,0,.5);position:absolute;top:0;left:0;z-index:1;pointer-events:none}
#info .l-wrap{position:relative;z-index:2}

/* ===== OEM/ODM — wmpage74-page4 expanding image gallery ===== */
#oem-odm .wmpage74-page4{margin-top:48px}
#oem-odm .wmpage74-page4 .wmpage-lwrap{max-width:100%;padding:0;margin:0;text-align:center}
#oem-odm .wmpage74-page4 .wmpage-title{position:relative;display:inline-block;padding-bottom:12px;margin:0 0 6px;font-size:24px;font-weight:700;color:#1a1a1a}
#oem-odm .wmpage74-page4 .wmpage-title::after{content:'';position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:60px;height:3px;background:var(--color);border-radius:2px}
.wmpage74-page4-list{position:relative;margin-top:30px}
.wmpage74-page4-item{position:absolute;top:0;width:20%;height:100%;overflow:hidden;transition:width .3s,left .3s}
.wmpage74-page4-item:nth-of-type(1){left:0}
.wmpage74-page4-item:nth-of-type(2){left:20%}
.wmpage74-page4-item:nth-of-type(3){left:40%}
.wmpage74-page4-item:nth-of-type(4){left:60%}
.wmpage74-page4-item:nth-of-type(5){right:0}
.wmpage74-page4-list::after{content:'';display:block;padding-bottom:35%}
.wmpage74-page4-item img{display:block;width:100%;height:100%;object-fit:cover}
.wmpage74-page4-layer{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);padding:26% 12%;color:#fff;line-height:2;opacity:1;transition:all .3s ease-in-out}
.wmpage74-page4-number{font-size:var(--wmpage-font40,42px);font-weight:var(--fontbold5,700);color:#fff;position:absolute;right:8%;bottom:6%;z-index:2;line-height:1}
.wmpage74-page4-layer p{color:#fff;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:10;overflow:hidden;}
@media (max-width:1440px){.wmpage74-page4-layer{padding:17% 10% 32%}}
@media (max-width:1280px) and (min-width:1025px){.wmpage74-page4-layer p{line-height:1.7;-webkit-line-clamp:10;font-size:15px}}
@media (min-width:1025px){.wmpage74-page4-item:hover{width:40%;z-index:10}
.wmpage74-page4-item:hover .wmpage74-page4-layer{transform:scale(1.2);opacity:0}}
@media (max-width:1024px){
.wmpage74-page4-layer{padding:15px}
.wmpage74-page4-layer p{font-size:var(--wmpage-font14,15px);line-height:1.75}
.wmpage74-page4-number{font-size:var(--wmpage-font26,28px)}
.wmpage74-page4-list{overflow-x:auto;overflow-y:hidden}
.wmpage74-page4-item{width:300px}
.wmpage74-page4-item:nth-of-type(2){left:300px}
.wmpage74-page4-item:nth-of-type(3){left:600px}
.wmpage74-page4-item:nth-of-type(4){left:900px}
.wmpage74-page4-item:nth-of-type(5){right:1200px}
.wmpage74-page4-list::after{padding-bottom:435px}
}