@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap');
:root{--red:#ef233c;--dark:#19212c;--ink:#242a33;--muted:#647080;--blueprint:#f4f6f8;--line:#e5e8ec;--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;color:var(--ink);background:white;font-family:'Be Vietnam Pro',Arial,sans-serif;line-height:1.65}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}button{cursor:pointer}img{max-width:100%}.container{width:min(1200px,calc(100% - 44px));margin:auto}.topbar{height:5px;background:var(--red)}.site-head{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 4px 22px #17253614}.header{display:flex;align-items:center;justify-content:space-between;min-height:90px;gap:28px}.brand{display:flex;align-items:center;gap:11px;flex-shrink:0}.brand img{width:168px;max-height:64px;object-fit:contain;object-position:left center}.brand-tag{font-size:11px;color:#8d98a4;letter-spacing:.17em}.nav{display:flex;align-items:center;gap:26px;font-size:13px;font-weight:700}.nav>a,.nav-parent>button{border:none;background:transparent;color:var(--ink);padding:12px 0;white-space:nowrap}.nav>a:hover,.nav-parent>button:hover{color:var(--red)}.nav .contact-link{background:var(--red);color:#fff;padding:13px 19px;border-radius:9px}.nav .contact-link:hover{color:white;background:#c90d28}.mobile-toggle{display:none;border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 14px}.nav-parent{position:relative}.mega{position:absolute;left:-25px;top:100%;width:275px;padding:9px;background:white;border:1px solid var(--line);box-shadow:0 16px 40px #0002;border-radius:12px;opacity:0;visibility:hidden;transform:translateX(-25px);transition:opacity .3s,transform .3s,visibility .3s;z-index:15}.mega.visible,.nav-parent:hover .mega,.nav-parent:focus-within .mega{opacity:1;visibility:visible;transform:translateX(0)}.mega a{display:block;border-radius:8px;padding:13px 12px;color:#394352}.mega a:hover{background:#fff0f1;color:var(--red)}.hero{position:relative;min-height:530px;display:flex;align-items:center;overflow:hidden;background:#151c28;color:#fff}.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;background:linear-gradient(95deg,#0b1427f2,#101b30bb 46%,#151c282e),linear-gradient(120deg,#6b1728,#343d4a)}.hero-slide.active{opacity:1}.hero-slide img,.hero-slide video{height:100%;width:100%;object-fit:cover}.hero-slide:has(img):after,.hero-slide:has(video):after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#101621db,#1016217d 65%,#10162124)}.hero-content{position:relative;z-index:2;padding:86px 0 100px;pointer-events:none}.hero-content a{pointer-events:auto}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--red)}.hero .eyebrow{color:#ff7c8d}.hero h1{font-weight:800;font-size:clamp(38px,5vw,70px);line-height:1.22;max-width:760px;letter-spacing:-.045em;margin:20px 0}.hero p{max-width:580px;color:#e1e4e9;font-size:16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--red);color:white;border:0;border-radius:9px;padding:14px 24px;font-weight:800;font-size:13px;transition:background .2s,transform .2s}.btn:hover{background:#c80e28;transform:translateY(-2px)}.btn-dark{background:#1d2633}.btn-outline{background:transparent;border:1px solid #d7dbe1;color:#202b37}.hero-controls{position:absolute;bottom:30px;right:max(22px,calc((100vw - 1200px)/2));z-index:3;display:flex;gap:8px}.hero-controls button{border:1px solid #ffffff55;background:#ffffff20;color:#fff;border-radius:6px;padding:8px 14px}.hero-controls button:hover{background:#fff4}.hero-dots{position:absolute;left:max(22px,calc((100vw - 1200px)/2));bottom:36px;z-index:4;display:flex;gap:8px}.hero-dots button{height:8px;width:24px;border-radius:20px;border:none;background:#ffffff66;padding:0}.hero-dots button.active{width:42px;background:var(--red)}.section{padding:86px 0}.section.light{background:var(--blueprint)}.section-heading{max-width:850px;margin:0 auto 38px;text-align:center}.section-heading h2{margin:7px 0 14px;font-weight:800;font-size:clamp(27px,3.7vw,44px);line-height:1.25;letter-spacing:-.025em;color:#151c28}.section-heading p{color:var(--muted)}.cat-list{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:30px}.cat-list a{border:1px solid #d7dce2;border-radius:999px;background:white;padding:9px 16px;font-weight:700;font-size:12px}.cat-list a:hover{color:var(--red);border-color:var(--red)}.catalog-stripe{padding:26px 0 36px;scroll-margin-top:110px}.catalog-stripe:not(:last-child){border-bottom:1px solid var(--line)}.stripe-top{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:20px}.stripe-top h3{font-size:25px;margin:0;font-weight:800}.stripe-top small{color:var(--muted)}.product-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px}.product-card{border:1px solid #e5e8ed;border-radius:14px;overflow:hidden;background:white;display:flex;flex-direction:column;transition:box-shadow .25s,transform .25s}.product-card:hover{transform:translateY(-5px);box-shadow:0 18px 35px #111a2420}.product-visual{aspect-ratio:1.36;display:grid;place-items:center;background:#f5f6f8;overflow:hidden}.product-visual img{width:100%;height:100%;object-fit:cover}.product-body{padding:18px;flex:1;display:flex;flex-direction:column}.product-body strong{font-size:16px;line-height:1.42}.product-body .sku{color:var(--red);font-size:11px;font-weight:800;margin-top:5px}.product-body p{font-size:12px;color:var(--muted);line-height:1.65;flex:1}.product-body .actions{display:flex;gap:8px}.product-body .actions button{padding:9px 12px;flex:1;border:1px solid #d9dfe5;background:white;border-radius:7px;font-weight:700;font-size:12px}.product-body .actions button:last-child{background:var(--red);border-color:var(--red);color:#fff}.empty{text-align:center;padding:35px;border:1px dashed #d9dce2;border-radius:14px;color:#7f8994}.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.about-graphic{min-height:330px;border-radius:25px;background:radial-gradient(circle at 65% 25%,#f77988,#ea2942 38%,#8e1223 90%);display:flex;align-items:center;justify-content:center;color:#fff;position:relative;overflow:hidden}.about-graphic:before{content:"";position:absolute;width:410px;height:410px;border:60px solid #ffffff1d;border-radius:50%;transform:translate(-110px,90px)}.about-graphic .word{font-size:clamp(42px,7vw,102px);font-weight:800;letter-spacing:-.09em;z-index:2}.about-layout h2{font-size:40px;line-height:1.22;margin:12px 0}.about-layout p{color:var(--muted)}.point{display:flex;align-items:center;gap:12px;margin-top:18px;font-weight:700}.point span{color:var(--red)}.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.media-item{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:white}.media-item img,.media-item video{height:210px;width:100%;object-fit:cover;background:#f4f5f6}.media-item .body{padding:18px}.media-item strong{display:block;font-size:14px}.media-item small{color:var(--muted)}.contact-section{background:#1a202b;color:white}.contact-section .section-heading h2{color:white}.contact-section .section-heading p{color:#aab5c2}.contact-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:58px}.contact-rows{display:grid;gap:16px}.contact-line{padding:17px 0;border-bottom:1px solid #ffffff22}.contact-line small{display:block;color:#adb9c7}.contact-form{background:white;padding:30px;border-radius:18px;color:var(--ink);display:grid;gap:13px}.contact-form label{display:grid;gap:5px;font-size:12px;font-weight:700}.contact-form input,.contact-form textarea,.contact-form select{width:100%;border:1px solid #dce0e6;border-radius:8px;padding:12px;color:var(--ink);background:white}.contact-form textarea{min-height:110px;resize:vertical}.contact-form .honeypot{display:none}.contact-form [data-status]{color:#167b52;font-size:12px}.footer{background:#10151d;color:#b9c0c9;padding:44px 0 24px}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:25px}.footer img{width:165px;max-height:66px;object-fit:contain;background:#fff;border-radius:7px;padding:6px}.footer small{display:block;margin-top:12px}.footer a:hover{color:white}.copy{margin-top:30px;border-top:1px solid #ffffff26;padding-top:17px;font-size:11px}.product-modal{border:none;border-radius:18px;width:min(800px,calc(100vw - 28px));padding:0;box-shadow:0 30px 90px #0007}.product-modal::backdrop{background:#0f1721ba}.modal-layout{display:grid;grid-template-columns:1fr 1fr}.modal-layout img{width:100%;height:100%;min-height:330px;object-fit:contain;background:#f4f5f7}.modal-layout .detail{padding:32px}.modal-layout h2{line-height:1.35}.modal-layout p{color:var(--muted)}.close-modal{float:right;border:none;background:#eff1f4;border-radius:6px;padding:7px 12px}.admin-editable{outline:2px dashed transparent;cursor:pointer;transition:outline .15s,background .15s}.admin-editable:hover{outline:2px dashed #f23650;background:#ffeff10b}.editing-ribbon{position:sticky;top:0;z-index:90;background:#121b27;color:white;display:flex;gap:14px;align-items:center;padding:10px 30px}.editing-ribbon a{font-size:12px}.editing-ribbon button{background:var(--red);color:white;border:0;padding:8px 13px;border-radius:6px}.editor-panel{position:fixed;z-index:200;right:0;top:0;bottom:0;width:min(410px,100vw);background:white;box-shadow:-20px 0 55px #0002;transform:translateX(110%);transition:transform .25s;padding:22px;overflow-y:auto}.editor-panel.open{transform:translateX(0)}.editor-panel label{display:grid;font-size:12px;font-weight:700;gap:5px;margin-bottom:12px}.editor-panel input,.editor-panel textarea,.editor-panel select{width:100%;border:1px solid #d8dce2;border-radius:8px;padding:10px}.editor-panel textarea{min-height:90px}.editor-panel .buttons{display:flex;gap:10px;flex-wrap:wrap}.editor-panel button{border:0;background:var(--red);color:white;border-radius:7px;padding:10px 15px}.editor-panel button.secondary{background:#edf0f3;color:#25303d}.editor-panel [data-upload-area]{border:1px dashed #cbd1d9;border-radius:10px;padding:12px;margin-bottom:15px}.editor-panel .muted{font-size:12px;color:var(--muted)}.edit-target{cursor:pointer;outline:2px dashed transparent;outline-offset:5px}.edit-target:hover{outline-color:#ef233c}.builder-only{display:none}.is-builder .builder-only{display:block}@media(max-width:980px){.nav{gap:13px}.brand img{width:135px}.product-row{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-grid{gap:24px}.media-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:740px){.container{width:min(100% - 30px,1200px)}.mobile-toggle{display:block}.header{min-height:74px}.brand img{width:128px;max-height:50px}.nav{position:absolute;left:0;right:0;top:100%;background:white;padding:15px 22px 25px;display:none;flex-direction:column;align-items:stretch;gap:7px;box-shadow:0 12px 22px #0002}.nav.open{display:flex}.nav-parent{width:100%}.mega{position:static;width:100%;box-shadow:none;display:none;transform:none;opacity:1;visibility:visible;margin-top:5px}.mega.visible,.nav-parent:hover .mega,.nav-parent:focus-within .mega{display:block}.hero{min-height:520px}.hero-content{padding:75px 0 105px}.hero h1{font-size:39px}.section{padding:58px 0}.about-layout,.contact-grid,.modal-layout{grid-template-columns:1fr;gap:26px}.media-grid,.product-row{grid-template-columns:1fr 1fr}.stripe-top{align-items:flex-start;flex-direction:column}.about-graphic{min-height:260px}.footer-inner{align-items:flex-start;flex-direction:column}.editing-ribbon{flex-wrap:wrap;padding:9px 15px}}@media(max-width:510px){.product-row,.media-grid{grid-template-columns:1fr}.hero h1{font-size:34px}.contact-form{padding:21px}.header{gap:7px}.hero p{font-size:13px}.about-layout h2{font-size:31px}}
/* Blueprint-inspired left navigation and video showcase */
.showcase-shell{display:grid;grid-template-columns:minmax(170px,225px) minmax(0,1fr);background:#111925}
.showcase-main{min-width:0}
.showcase-shell .hero{min-height:540px}
.side-nav{background:#17202c;position:relative;z-index:10}
.side-nav .nav{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:18px 0;position:sticky;top:100px}
.side-nav .nav>a,.side-nav .nav-parent>button{display:block;width:100%;padding:20px 25px;text-align:left;border:0;border-bottom:1px solid #ffffff1c;background:transparent;color:#e9edf3;font-size:13px;font-weight:700}
.side-nav .nav-parent>button:hover,.side-nav .nav>a:hover{background:var(--red);color:white}
.side-nav .nav .contact-link{margin:20px 14px 0;background:var(--red);border-radius:8px;width:calc(100% - 28px);text-align:center;padding:15px;color:white}
.side-nav .nav-parent{width:100%;position:relative}
.side-nav .mega{top:0;left:100%;width:300px;transform:translateX(-28px);border-radius:0 13px 13px 0;box-shadow:14px 16px 35px #0003}
.side-nav .mega.visible,.side-nav .nav-parent:hover .mega,.side-nav .nav-parent:focus-within .mega{transform:translateX(0)}
.side-nav .mega a{padding:16px;border-bottom:1px solid #f0f2f4}
.showcase-shell .hero-content{padding:92px 5% 110px}
.showcase-shell .hero h1{font-size:clamp(36px,4.3vw,62px)}
.showcase-shell .hero-controls{right:26px}
.showcase-shell .hero-dots{left:6%}
@media(max-width:740px){.showcase-shell{display:block}.side-nav{background:#fff}.side-nav .nav{display:none;position:absolute;top:0;left:0;right:0;z-index:60;background:#17202c;padding:10px 0;box-shadow:0 18px 40px #0003}.side-nav .nav.open{display:flex}.side-nav .nav-parent>button,.side-nav .nav>a{padding:14px 20px}.side-nav .mega{position:static;display:none;width:100%;border-radius:0;transform:none!important;box-shadow:none}.side-nav .mega.visible,.side-nav .nav-parent:hover .mega,.side-nav .nav-parent:focus-within .mega{display:block}.showcase-shell .hero-content{padding:76px 22px 100px}}

:root{--red:#a0212e}
.site-head,.footer{background:#1d2836;color:#fff}
.site-head .brand-tag,.site-head a,.site-head button,.footer a{color:#fff}
#about{position:relative;background:linear-gradient(90deg,rgba(13,21,30,.95),rgba(13,21,30,.78) 54%,rgba(13,21,30,.35)),url('/assets/img/gioi-thieu.webp') center 55%/cover;color:white}
#about .about-layout{display:block;padding-block:45px}
#about .about-layout>div{max-width:590px}
#about h2,#about p,#about .eyebrow,#about .point{color:white}
.product-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.product-card .product-visual img{object-fit:cover}
.product-detail-link{display:inline-flex;align-items:center;padding:.55rem .8rem;border:1px solid #d5d9de;border-radius:6px;color:#1d2836}
.product-content{padding-block:44px;max-width:1000px;margin:auto}
.product-content h1{margin:18px 0 26px}
.product-summary{display:grid;grid-template-columns:1.3fr 1fr;gap:28px;align-items:center;margin-bottom:36px}
.product-summary figure{margin:0}.product-summary img{width:100%;border-radius:10px}.product-summary figcaption{font-size:.85rem;color:#4b5563}
.product-description{margin-bottom:36px}
.product-description img{max-width:100%;height:auto}
.product-specs{width:100%;border-collapse:collapse;margin-bottom:24px}
.product-specs caption{text-align:left;background:#1d2836;color:#fff;font-weight:bold;padding:12px}
.product-specs td,.product-specs th{padding:10px 12px;text-align:left;border-bottom:1px solid #dce1e6;overflow-wrap:anywhere}
.product-specs th{width:43%;font-weight:600}.product-specs tr:nth-child(even){background:#f1f3f5}
@media(max-width:650px){.product-summary,.product-row{grid-template-columns:1fr}#about .about-layout{padding-block:22px}}

#tin-tuc.news-section{background:#f3f5f7;color:#202c3b}
#tin-tuc .section-heading h2{color:#172334}
.news-card{max-width:850px;margin:20px auto;padding:clamp(20px,4vw,44px);background:#fff;border:1px solid #dce2e8;border-radius:14px;color:#253142;overflow-wrap:anywhere}
.news-card h3{font-size:clamp(21px,2.3vw,30px);line-height:1.35;margin:0 0 18px;color:#172334}
.news-card p{font-size:17px;line-height:1.75;margin:0 0 14px}
.news-card p:last-child{margin-bottom:0}
.mtz-footer{width:100%}
.mtz-footer-grid{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:32px;padding-bottom:28px}
.mtz-footer-grid h2{font-size:17px;margin:0 0 12px;color:#fff}
.mtz-footer-grid a{display:block;margin-bottom:8px;overflow-wrap:anywhere}
.mtz-footer-grid p{margin:8px 0;color:#e0e6ee}
.mtz-footer-grid img{max-width:100%;height:auto}
.is-builder [data-edit-type]{cursor:pointer;outline:2px dashed #f33a52;outline-offset:4px}
.is-builder .editing-ribbon{position:relative;z-index:101}
@media(max-width:650px){.mtz-footer-grid{grid-template-columns:1fr;gap:20px}}
