/* VNCERAMICA / SINOMART — responsive B2B tile factory website */
:root{--navy:#0d2b45;--navy2:#163d5d;--ink:#202a33;--muted:#66727c;--cream:#f4f0e8;--paper:#fbfaf7;--line:#d8dde0;--gold:#b59562;--zalo:#0878f9;--white:#fff;--shadow:0 14px 40px rgba(13,43,69,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,"Noto Sans",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}img{max-width:100%;display:block}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}.container{width:min(1180px,calc(100% - 40px));margin:auto}.section{padding:90px 0}.eyebrow{margin:0 0 15px;color:var(--gold);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.section-title{margin:0;font-family:Georgia,serif;font-size:clamp(34px,4vw,54px);line-height:1.12;font-weight:400;color:var(--navy)}.section-lead{max-width:660px;margin:20px 0 0;color:var(--muted);font-size:15px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:44px}.section-head>a{color:var(--navy);font-size:12px;font-weight:700;border-bottom:1px solid var(--navy);padding-bottom:7px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:50px;padding:0 21px;border:1px solid var(--navy);background:var(--navy);color:#fff;font-size:12px;font-weight:700;letter-spacing:.03em;cursor:pointer}.btn.light{background:#fff;color:var(--navy);border-color:#fff}.btn.outline{background:transparent;color:var(--navy)}.btn.zalo{background:var(--zalo);border-color:var(--zalo)}.btn:hover{filter:brightness(1.08)}
.topline{height:36px;background:#081d2f;color:#c7d1d8;font-size:10px}.topline .container{height:100%;display:flex;align-items:center;justify-content:space-between}.topline-links{display:flex;gap:22px}.topline strong{color:#fff}.header{height:86px;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}.header .container{height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px}.brand{display:flex;align-items:center;gap:11px;width:max-content}.brand-mark{width:42px;height:42px;display:grid;place-items:center;background:var(--navy);color:#fff;font-family:Georgia,serif;font-size:25px}.brand-name{font-size:16px;line-height:1;font-weight:800;letter-spacing:.14em;color:var(--navy)}.brand-name small{display:block;margin-top:6px;color:var(--muted);font-size:7px;font-weight:400;letter-spacing:.2em}.nav{display:flex;gap:26px}.nav a{font-size:12px;font-weight:700;color:#263743;padding:33px 0;position:relative}.nav a::after{content:"";height:2px;background:var(--gold);position:absolute;left:0;right:100%;bottom:23px;transition:.2s}.nav a:hover::after,.nav a.active::after{right:0}.head-actions{justify-self:end;display:flex;align-items:center;gap:12px}.lang{display:flex;align-items:center;gap:5px}.lang button{border:0;background:none;padding:6px 3px;color:#929da4;font-size:10px;cursor:pointer}.lang button.active{color:var(--navy);font-weight:800}.menu-btn{display:none;border:0;background:none;padding:9px}.menu-btn i{display:block;width:22px;height:1px;background:var(--navy);margin:5px}
.hero{height:700px;position:relative;overflow:hidden;background:var(--navy);color:#fff}.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .55s;background-position:center;background-size:cover}.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,24,38,.84) 0%,rgba(6,24,38,.48) 43%,rgba(6,24,38,.08) 75%)}.hero-slide.active{opacity:1}.hero-content{position:absolute;z-index:2;left:max(20px,calc((100% - 1180px)/2));top:50%;transform:translateY(-50%);width:min(620px,calc(100% - 40px))}.hero .eyebrow{color:#e0c69e}.hero h1{font-family:Georgia,serif;font-size:clamp(46px,5.5vw,78px);font-weight:400;line-height:1.04;margin:22px 0}.hero p{color:#d7e0e5;max-width:560px;font-size:15px}.hero-actions{display:flex;gap:12px;margin-top:32px}.hero-dots{position:absolute;z-index:3;bottom:32px;left:max(20px,calc((100% - 1180px)/2));display:flex;gap:8px}.hero-dots button{width:34px;height:3px;border:0;background:rgba(255,255,255,.35);padding:0;cursor:pointer}.hero-dots button.active{background:#fff}.hero-trust{position:absolute;z-index:3;right:max(20px,calc((100% - 1180px)/2));bottom:0;background:#fff;color:var(--ink);padding:22px 28px;display:flex;gap:28px}.hero-trust div{border-left:2px solid var(--gold);padding-left:12px}.hero-trust b{display:block;color:var(--navy);font-size:17px}.hero-trust span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.factory-intro{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center}.factory-copy .factory-stamp{display:inline-block;background:var(--navy);color:#fff;padding:11px 14px;font-size:11px;font-weight:800;letter-spacing:.09em;margin-bottom:22px}.factory-copy p{color:var(--muted)}.factory-points{display:grid;grid-template-columns:1fr 1fr;margin:30px 0;border-top:1px solid var(--line)}.factory-points div{padding:18px 15px 18px 0;border-bottom:1px solid var(--line)}.factory-points b{display:block;color:var(--navy);font-size:22px;font-family:Georgia,serif}.factory-points span{font-size:10px;color:var(--muted)}.factory-media{display:grid;grid-template-columns:1.15fr .85fr;gap:12px}.factory-media figure{margin:0;position:relative;overflow:hidden}.factory-media figure:first-child{grid-row:span 2;height:540px}.factory-media figure:not(:first-child){height:264px}.factory-media img{width:100%;height:100%;object-fit:cover}.media-label{position:absolute;left:10px;bottom:10px;background:rgba(8,29,47,.86);color:#fff;padding:7px 9px;font-size:8px;letter-spacing:.08em}.placeholder-note{display:block;margin-top:9px;color:#9a6d44;font-size:9px}
.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.category-card{min-height:420px;position:relative;overflow:hidden;color:#fff}.category-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.45s}.category-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(6,24,38,.9))}.category-card:hover img{transform:scale(1.035)}.category-copy{position:absolute;z-index:2;left:23px;right:23px;bottom:22px}.category-copy span{font-size:9px;letter-spacing:.12em;color:#d7c39f}.category-copy h3{font-family:Georgia,serif;font-size:25px;font-weight:400;margin:8px 0}.category-copy p{font-size:10px;color:#d3dce1;margin:0 0 13px}.category-copy b{font-size:10px}
.applications{background:var(--navy);color:#fff}.applications .section-title{color:#fff}.applications .section-lead{color:#becbd4}.gallery-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;grid-auto-rows:260px;gap:12px}.gallery-item{position:relative;overflow:hidden}.gallery-item:first-child{grid-row:span 2}.gallery-item:nth-child(4){grid-column:span 2}.gallery-item img{width:100%;height:100%;object-fit:cover;transition:.4s}.gallery-item:hover img{transform:scale(1.03)}.gallery-item figcaption{position:absolute;left:14px;right:14px;bottom:14px;background:rgba(7,28,45,.84);padding:10px 12px;font-size:10px}.gallery-item figcaption b{display:block;font-size:12px}.gallery-item figcaption span{color:#c2cfd7;font-size:9px}
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.project-card{border:1px solid var(--line);background:#fff}.project-card img{height:260px;width:100%;object-fit:cover}.project-body{padding:20px}.project-body small{font-size:8px;color:var(--gold);letter-spacing:.13em}.project-body h3{font-family:Georgia,serif;color:var(--navy);font-weight:400;font-size:22px;margin:8px 0}.project-body p{font-size:11px;color:var(--muted)}
.trust{background:var(--cream)}.trust-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}.quote-card{padding:32px;background:#fff;border-left:3px solid var(--gold)}.quote-card p{font-family:Georgia,serif;font-size:21px;color:var(--navy)}.quote-card span{font-size:10px;color:var(--muted)}.logos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.logo-placeholder,.certificate{min-height:90px;border:1px dashed #9ba6ad;background:rgba(255,255,255,.6);display:grid;place-items:center;text-align:center;padding:10px;color:#78858d;font-size:9px}.cert-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.certificate{min-height:135px}.cta-band{background:var(--navy2);color:#fff;padding:60px 0}.cta-band .container{display:flex;align-items:center;justify-content:space-between;gap:40px}.cta-band h2{font-family:Georgia,serif;font-size:36px;font-weight:400;margin:0 0 9px}.cta-band p{margin:0;color:#c0ced7;font-size:13px}.cta-actions{display:flex;gap:10px;flex-shrink:0}
.page-hero{min-height:360px;background:linear-gradient(90deg,rgba(8,29,47,.92),rgba(8,29,47,.58)),var(--hero-image) center/cover;color:#fff;display:flex;align-items:center}.page-hero h1{font-family:Georgia,serif;font-size:clamp(42px,5vw,64px);font-weight:400;margin:14px 0}.page-hero p{max-width:650px;color:#d3dce2}.breadcrumb{font-size:10px;color:#d8c8a8;letter-spacing:.1em}.product-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:35px}.product-filters{display:flex;flex-wrap:wrap;gap:7px}.product-filters button{padding:9px 12px;background:#fff;border:1px solid var(--line);font-size:10px;color:var(--muted);cursor:pointer}.product-filters button.active{background:var(--navy);border-color:var(--navy);color:#fff}.product-search{min-width:250px;border:1px solid var(--line);background:#fff;padding:10px 12px}.products-list{display:grid;gap:32px}.product-row{display:grid;grid-template-columns:1.05fr .95fr;background:#fff;border:1px solid var(--line);overflow:hidden}.product-images{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:5px;height:420px}.product-images img{width:100%;height:100%;object-fit:cover}.product-images img:first-child{grid-row:span 2}.product-detail{padding:34px;display:flex;flex-direction:column}.product-detail small{color:var(--gold);letter-spacing:.12em;font-size:9px}.product-detail h2{font-family:Georgia,serif;font-size:30px;color:var(--navy);font-weight:400;margin:10px 0}.product-detail>p{font-size:12px;color:var(--muted)}.specs{display:grid;grid-template-columns:1fr 1fr;margin:17px 0;border-top:1px solid var(--line)}.specs div{padding:12px 0;border-bottom:1px solid var(--line);font-size:10px}.specs span{display:block;color:var(--muted);font-size:8px}.application-tag{color:var(--navy);background:var(--cream);padding:8px 10px;font-size:9px;width:max-content;margin-top:auto}.product-detail .btn{margin-top:17px;width:max-content}
.case-masonry{columns:3;column-gap:14px}.case-card{break-inside:avoid;margin:0 0 14px;position:relative}.case-card img{width:100%}.case-card figcaption{position:absolute;left:0;right:0;bottom:0;padding:25px 16px 13px;background:linear-gradient(transparent,rgba(7,26,42,.88));color:#fff;font-size:11px}.case-card b{display:block}.stats-band{background:var(--navy);color:#fff;padding:46px 0}.stats{display:grid;grid-template-columns:repeat(4,1fr)}.stats div{text-align:center;border-right:1px solid rgba(255,255,255,.16)}.stats div:last-child{border:0}.stats b{display:block;font-family:Georgia,serif;font-size:40px;color:#d8c19b}.stats span{font-size:9px;color:#bdcbd4;letter-spacing:.09em}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.about-grid img{width:100%;height:480px;object-fit:cover}.about-copy p{color:var(--muted);font-size:14px}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.timeline article{border-top:2px solid var(--gold);padding-top:20px}.timeline b{font-family:Georgia,serif;color:var(--navy);font-size:28px}.timeline h3{font-size:14px}.timeline p{font-size:11px;color:var(--muted)}
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.service-card{background:#fff;border:1px solid var(--line);padding:30px}.service-card>span{width:44px;height:44px;background:var(--navy);color:#fff;display:grid;place-items:center;font-family:Georgia,serif}.service-card h2{font-family:Georgia,serif;color:var(--navy);font-weight:400}.service-card p,.service-card li{color:var(--muted);font-size:12px}.process{display:grid;grid-template-columns:repeat(5,1fr)}.process article{border-top:1px solid var(--line);padding:22px 18px 0 0;position:relative}.process article::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--gold);position:absolute;top:-5px}.process b{font-family:Georgia,serif;color:var(--navy);font-size:22px}.process h3{font-size:13px}.process p{color:var(--muted);font-size:10px}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}.contact-info{background:var(--navy);color:#fff;padding:38px}.contact-info h2{font-family:Georgia,serif;font-size:32px;font-weight:400}.contact-info p{color:#bdcad2;font-size:12px}.contact-item{border-top:1px solid rgba(255,255,255,.16);padding:18px 0}.contact-item span{display:block;color:#cfb88f;font-size:8px;letter-spacing:.12em}.contact-item a,.contact-item b{font-size:16px;font-weight:400}.form{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form label{font-size:10px;color:var(--muted)}.form input,.form textarea,.form select{display:block;width:100%;border:1px solid var(--line);background:#fff;padding:13px;margin-top:7px;outline:none}.form textarea{min-height:130px;resize:vertical}.form .full{grid-column:1/-1}.form-note{font-size:10px;color:var(--muted)}
.footer{background:#081d2f;color:#fff;padding:65px 0 25px}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr 1fr 1fr;gap:45px}.footer .brand-name{color:#fff}.footer .brand-name small{color:#8395a2}.footer-about{color:#9eb0bc;font-size:11px;margin-top:20px}.footer h3{font-size:11px;letter-spacing:.1em;color:#d9c49e}.footer ul{list-style:none;padding:0;margin:16px 0}.footer li{margin:8px 0;color:#9eb0bc;font-size:10px}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;margin-top:40px;display:flex;justify-content:space-between;color:#728794;font-size:9px}.float-contact{position:fixed;right:14px;bottom:14px;z-index:45;display:flex;flex-direction:column;gap:8px}.float-contact a{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;box-shadow:0 8px 20px rgba(0,0,0,.2)}.float-contact .z{background:var(--zalo)}.float-contact .w{background:#20b96a}.float-label{position:absolute;right:56px;white-space:nowrap;background:#fff;color:var(--ink);padding:6px 9px;font-size:9px;box-shadow:var(--shadow);opacity:0;pointer-events:none}.float-contact a:hover .float-label{opacity:1}
@media(max-width:980px){.header .container{grid-template-columns:1fr auto}.nav{position:absolute;left:0;right:0;top:86px;background:#fff;display:flex;flex-direction:column;gap:0;padding:10px 20px 24px;transform:scaleY(0);opacity:0;transform-origin:top;transition:.2s}.nav.open{transform:scaleY(1);opacity:1}.nav a{padding:13px 0}.nav a::after{display:none}.menu-btn{display:block}.head-actions .btn{display:none}.hero-trust{display:none}.factory-intro,.about-grid{grid-template-columns:1fr}.category-grid,.projects-grid{grid-template-columns:1fr 1fr}.gallery-grid{grid-template-columns:1fr 1fr}.gallery-item:first-child{grid-row:span 1}.gallery-item:nth-child(4){grid-column:span 1}.trust-grid,.contact-grid{grid-template-columns:1fr}.product-row{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.process{grid-template-columns:1fr 1fr;gap:30px 0}.case-masonry{columns:2}}
@media(max-width:640px){.container{width:min(100% - 28px,1180px)}.topline{height:32px}.topline-links span:first-child{display:none}.header{height:72px}.header .container{gap:10px}.nav{top:72px}.brand-mark{width:35px;height:35px}.brand-name{font-size:13px}.hero{height:620px}.hero-content{left:14px;width:calc(100% - 28px)}.hero-actions,.cta-actions{flex-direction:column;align-items:stretch}.hero-dots{left:14px}.section{padding:65px 0}.section-head{align-items:flex-start;flex-direction:column}.factory-media{grid-template-columns:1fr}.factory-media figure:first-child{grid-row:auto;height:310px}.factory-media figure:not(:first-child){height:220px}.factory-points{grid-template-columns:1fr}.category-grid,.projects-grid,.gallery-grid{grid-template-columns:1fr}.gallery-grid{grid-auto-rows:270px}.gallery-item:first-child{height:360px}.trust-grid{gap:30px}.logos{grid-template-columns:1fr 1fr}.cta-band .container{align-items:flex-start;flex-direction:column}.page-hero{min-height:310px}.product-toolbar{align-items:stretch;flex-direction:column}.product-search{width:100%}.product-images{height:360px}.product-detail{padding:24px}.specs{grid-template-columns:1fr}.case-masonry{columns:1}.stats{grid-template-columns:1fr 1fr;gap:25px}.stats div:nth-child(2){border:0}.timeline{grid-template-columns:1fr 1fr}.service-grid{grid-template-columns:1fr}.process{grid-template-columns:1fr}.contact-info{padding:26px}.form{grid-template-columns:1fr}.form .full{grid-column:auto}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:7px}.head-actions{gap:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-slide,.category-card img,.gallery-item img{transition:none}}

/* Brand asset and factory gallery refinements */
.brand{display:flex;align-items:center;width:max-content;gap:0}
.brand-logo{display:block;width:168px;height:62px;object-fit:contain}
.footer .brand-logo{width:190px;height:76px;filter:drop-shadow(0 5px 12px rgba(0,0,0,.18))}
.float-contact a{width:50px;height:50px;font-size:0}
.float-contact a img{width:27px;height:27px;object-fit:contain}
.factory-gallery{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:14px;margin-top:50px}
.factory-gallery figure{margin:0;background:#fff;border:1px solid var(--line);overflow:hidden}
.factory-gallery figure:first-child{grid-row:span 2}
.factory-gallery img{width:100%;height:250px;object-fit:cover}
.factory-gallery figure:first-child img{height:100%}
.factory-gallery figcaption{padding:14px 16px}
.factory-gallery b{display:block;color:var(--navy);font-size:12px}
.factory-gallery span{font-size:9px;color:var(--muted)}
.hero-slide-copy{position:absolute;z-index:2;left:max(20px,calc((100% - 1180px)/2));bottom:82px;color:#fff;background:rgba(8,29,47,.76);padding:12px 15px;border-left:3px solid var(--gold)}
.hero-slide-copy b{display:block;font-size:12px}.hero-slide-copy span{font-size:9px;color:#ccd7df}
@media(max-width:980px){.factory-gallery{grid-template-columns:1fr 1fr}.factory-gallery figure:first-child{grid-row:auto;grid-column:span 2}.factory-gallery figure:first-child img{height:330px}}
@media(max-width:640px){.brand-logo{width:132px;height:54px}.factory-gallery{grid-template-columns:1fr}.factory-gallery figure:first-child{grid-column:auto}.factory-gallery img,.factory-gallery figure:first-child img{height:240px}.hero-slide-copy{left:14px;bottom:68px;right:14px}}