:root { --wine:#760600; --wine-deep:#530000; --gold:#d9aa35; --ink:#311d19; --cream:#fffdf9; --line:#edddd0; } *{box-sizing:border-box} html{scroll-behavior:smooth} body{background:#fffdfb;color:var(--ink);font:14px 'Be Vietnam Pro',sans-serif;line-height:1.65;margin:0} a{text-decoration:none;color:inherit} img{display:block;width:100%}.topbar{background:var(--wine-deep);color:#fff7ed;font-size:9px;height:24px}.topbar .container{align-items:center;display:flex;gap:19px;height:100%;justify-content:flex-end}.header{background:#fff;box-shadow:0 2px 4px #2c0d0b15;position:sticky;top:0;z-index:30}.navbar{min-height:70px;padding:6px 12px}.navbar-brand,.footer-brand{display:grid;line-height:.8}.navbar-brand strong,.footer-brand strong{color:var(--wine);font-family:Georgia,serif;font-size:42px;font-weight:900;letter-spacing:-3px}.navbar-brand sup,.footer-brand sup{font-family:'Be Vietnam Pro';font-size:10px;letter-spacing:0}.navbar-brand em,.footer-brand em{color:var(--wine);font-family:Georgia,serif;font-size:11px;font-weight:bold;letter-spacing:0}.navbar-nav{gap:20px}.nav-link{color:#241b19;font-size:11px;font-weight:800;padding:10px 0!important;text-transform:uppercase}.nav-link.active,.nav-link:hover{color:var(--wine)}.nav-link b{font-size:12px}.search-button{background:#fff;border:1px solid #eee;border-radius:4px;font-size:20px;height:32px;margin-left:25px;width:34px}.navbar-toggler{border:0;box-shadow:none!important;padding:5px}.navbar-toggler span{background:var(--wine);display:block;height:2px;margin:4px;width:24px}.hero{background:radial-gradient(circle at 65% 56%,#941309 0, var(--wine-deep) 42%,#450000 100%);color:#fff;min-height:405px;overflow:hidden;position:relative}.hero-building{background:repeating-linear-gradient(90deg,transparent 0 35px,#cc742520 36px 38px),repeating-linear-gradient(0deg,transparent 0 26px,#cc742520 27px 29px);border:2px solid #c977272c;height:255px;position:absolute;right:-15px;top:18px;transform:perspective(400px) rotateY(-18deg);width:570px}.hero-inner{position:relative;z-index:1}.hero-copy{padding:30px 12px 13px 18px}.hero h1{color:#e0ae3c;font-family:'Roboto Condensed',sans-serif;font-size:44px;font-weight:800;line-height:1;margin:0;text-transform:uppercase}.hero h2{font-family:'Roboto Condensed',sans-serif;font-size:19px;font-weight:800;line-height:1.2;margin:7px 0 11px;text-transform:uppercase}.hero-copy p{font-size:10px;line-height:1.65;margin-bottom:8px;max-width:430px}.hero-actions{display:flex;gap:13px;margin:14px 0 18px}.btn{border-radius:4px;font-size:10px;font-weight:800;padding:9px 20px;text-transform:uppercase}.btn-gold{background:#e5b438;color:#4a1700}.btn-ghost{border:1px solid #e6b63b;color:#fff}.hero-benefits{display:flex;gap:30px}.hero-benefits>div{align-items:center;display:grid;grid-template-columns:39px auto;column-gap:6px}.hero-benefits i{border:1px solid #e6b63b;border-radius:50%;color:#e6b63b;display:grid;font-size:18px;grid-row:span 2;height:35px;place-items:center;width:35px}.hero-benefits strong{color:#e6b63b;font-size:8px;text-transform:uppercase}.hero-benefits small{font-size:7px;white-space:nowrap}.hero-products{height:405px;position:relative}.paint-floor{background:repeating-linear-gradient(90deg,#5b2608 0 5px,#7e3a12 6px 8px);border-radius:50%;bottom:13px;box-shadow:0 -6px 18px #2e080a;filter:perspective(100px) rotateX(15deg);height:90px;position:absolute;right:-40px;width:540px}.can-large,.can-small{border-radius:9px;bottom:45px;box-shadow:0 14px 20px #220000a0;object-fit:cover;position:absolute}.can-large{height:300px;right:90px;width:270px}.can-small{bottom:32px;height:165px;right:-2px;width:135px}.section{padding:56px 0}.section-small{border-top:1px solid #eee6dd;padding:19px 0}.about-copy{padding:20px 31px}.title-left,.section-title{color:var(--wine);font-family:'Roboto Condensed',sans-serif;font-size:23px;font-weight:800;margin-bottom:17px;text-transform:uppercase}.title-left::after{background:var(--gold);content:'';display:block;height:2px;margin-top:8px;width:67px}.about-copy p{font-size:10px;line-height:1.75}.btn-wine{background:var(--wine);color:#fff;font-size:9px;margin-top:7px}.about-image{border:1px solid #e3c99c;border-radius:7px;box-shadow:0 3px 8px #24110e30;overflow:hidden}.about-image img{height:200px;object-fit:cover}.section-title{text-align:center}.section-title::after{background:#e8bb45;content:'';display:block;height:2px;margin:7px auto 0;width:72px}.product-row{display:grid;grid-template-columns:1.35fr 1.18fr 1.35fr 1.18fr}.product-card{border:1px solid #edd7b6;border-radius:7px;min-height:164px;overflow:hidden;position:relative}.product-card img{height:100%;object-fit:cover;position:absolute}.product-card::after{background:linear-gradient(0deg,#40000080,transparent);content:'';inset:0;position:absolute}.product-heading{background:var(--wine);border-radius:0 0 6px 6px;color:#fff;font-size:11px;font-weight:800;left:50%;padding:7px 35px;position:absolute;text-align:center;text-transform:uppercase;top:0;transform:translateX(-50%);white-space:nowrap;z-index:1}.product-list{border:1px solid #edd7b6;border-left:0;border-radius:0 7px 7px 0;font-size:8px;padding:15px 18px}.product-list ul{line-height:1.75;margin:0 0 7px;padding-left:15px}.product-list li::marker{color:#d59518}.small-btn{font-size:7px;margin:0;padding:6px 11px}.compact{padding-top:50px}.certificate-row{align-items:center;display:flex;gap:14px}.certificate-list{display:grid;flex:1;gap:14px;grid-template-columns:repeat(5,1fr)}.certificate-list figure{border:1px solid #e6e3df;border-radius:6px;height:110px;margin:0;padding:5px}.certificate-list img{height:100%;object-fit:contain}.carousel-arrow{background:var(--wine);border:0;border-radius:50%;color:#fff;font-size:22px;height:25px;line-height:1;width:25px}.news-card{border:1px solid #ead8c3;border-radius:7px;display:block;height:100%;overflow:hidden}.news-image{height:130px;position:relative}.news-image img{height:100%;object-fit:cover}.news-image::after{background:#36000035;content:'';inset:0;position:absolute}.news-card time{background:#fff;color:var(--wine);display:flex;font-family:'Roboto Condensed';font-weight:800;left:13px;line-height:.9;padding:6px;position:absolute;top:78px;z-index:1}.news-card time b{font-size:18px}.news-card time span{font-size:7px;margin-left:4px}.news-card>div:last-child{padding:13px}.news-card h3{color:var(--wine);font-size:11px;font-weight:800;line-height:1.45;margin:0 0 7px}.news-card p{color:#5e5049;font-size:8px;line-height:1.6;margin:0}.btn-outline-wine{border:1px solid var(--wine);color:var(--wine);font-size:8px;padding:6px 22px}.review-card{border:1px solid #ead8c3;border-radius:7px;height:100%;padding:14px}.review-head{align-items:center;display:flex;gap:10px}.avatar{border:2px solid #eccb83;border-radius:50%;color:#fff;display:grid;font-size:18px;font-weight:bold;height:49px;place-items:center;width:49px}.avatar-one{background:#7b573e}.avatar-two{background:#b68b78}.avatar-three{background:#514a43}.review-head strong,.review-head span,.review-head b{display:block;font-size:9px;line-height:1.45}.review-head span{font-size:8px}.review-head b{color:#e2a222;font-size:11px}.review-head i{color:#e3ad32;font-family:Georgia;font-size:38px;font-style:normal;margin-left:auto}.review-card p{font-size:9px;font-style:italic;line-height:1.55;margin:10px 0 0}.stats{background:var(--wine-deep);border-radius:7px;color:#f5c13f;margin:0 auto 21px;max-width:1120px}.stats .container{display:grid;grid-template-columns:repeat(4,1fr);padding:13px 30px}.stats .container>div{align-items:center;border-right:1px solid #d7a62d55;display:grid;grid-template-columns:35px auto;column-gap:5px}.stats .container>div:last-child{border:0}.stats i{font-size:25px;grid-row:span 2}.stats strong{font-size:22px;line-height:1}.stats span{color:#fff5d7;font-size:7px}.footer{background:var(--wine-deep);color:#fff;padding:28px 0 10px}.footer-brand strong{color:#f0bd3a}.footer-brand em{color:#f1bc3a}.company-name{font-size:10px;font-weight:bold;margin:18px 0 7px}.contact-list{font-size:9px;line-height:1.8;list-style:none;margin:0;padding:0}.footer h3{color:#f0bd3a;font-size:10px;font-weight:800;margin:0 0 12px;text-transform:uppercase}.footer .col-6 a{display:block;font-size:9px;margin:5px 0}.socials{display:flex;gap:9px}.socials a{align-items:center;background:#1877ce;border-radius:50%;display:flex;font-size:12px;font-weight:bold;height:25px;justify-content:center;width:25px}.socials a:nth-child(2){background:#f21b1b}.socials a:nth-child(3){background:#127eea;font-size:7px;width:34px}.download-button{background:#198fd3;border:2px solid #fff;border-radius:18px;color:#fff;font-size:9px;font-weight:bold;margin-top:16px;padding:7px 12px;text-transform:uppercase}.footer-bottom{border-top:1px solid #ffffff45;display:flex;font-size:8px;justify-content:space-between;margin-top:22px;padding-top:10px}@media(max-width:991px){.navbar-collapse{border-top:1px solid #eee;margin-top:8px}.navbar-nav{gap:0}.search-button{margin:8px 0}.hero-products{height:330px}.hero{min-height:auto}.product-row{grid-template-columns:1fr 1fr}.product-list{border-left:1px solid #edd7b6;border-radius:7px;margin-bottom:12px}.hero-copy{padding-left:0}.stats{border-radius:0}.about-image{margin-top:20px}}@media(max-width:575px){.topbar{height:auto;padding:4px 0}.topbar .container{font-size:7px;justify-content:center}.navbar-brand strong{font-size:34px}.hero h1{font-size:38px}.hero-benefits{gap:8px}.hero-benefits>div{grid-template-columns:1fr;text-align:center}.hero-benefits i{margin:auto}.hero-benefits small{white-space:normal}.hero-products{height:260px}.can-large{height:220px;right:65px;width:190px}.can-small{height:120px;width:105px}.product-row{grid-template-columns:1fr}.product-card{height:190px}.product-list{margin:0 0 10px}.certificate-list{gap:5px}.certificate-list figure{height:75px;padding:2px}.carousel-arrow{display:none}.news-card{margin-bottom:5px}.stats .container{grid-template-columns:1fr 1fr;gap:11px;padding:14px}.stats .container>div:nth-child(2){border:0}.footer-bottom{display:grid;gap:5px}.section{padding:33px 0}.about-copy{padding:6px 0}.section-small{padding:18px 0}}
.hero-products { overflow: visible; }
.hero-reference-product { bottom: 0; height: 360px; object-fit: cover; object-position: right center; position: absolute; right: -14px; width: min(100%, 540px); }
@media (max-width: 991px) { .hero-reference-product { height: 330px; right: 0; width: 100%; } }
@media (max-width: 575px) { .hero-reference-product { height: 260px; object-position: right center; } }
/* Hero bám theo bố cục của ảnh mẫu: nền xưởng và cụm lon sơn chiếm nửa phải. */
.hero { background: url('../images/hero-reference-layout.png') center center / 100% 100% no-repeat; height: 350px; min-height: 350px; }
.hero::after { background: linear-gradient(90deg, #640000 0%, #640000 41%, rgba(100, 0, 0, .9) 46%, rgba(100, 0, 0, 0) 54%); content: ''; inset: 0; position: absolute; }
.hero-building, .hero-products { display: none; }
.hero-inner { height: 100%; }
.hero-inner .row { height: 100%; }
.hero-copy { padding: 30px 0 12px 18px; position: relative; z-index: 2; }
.hero h1 { font-size: 39px; line-height: .92; }
.hero h2 { font-size: 17px; margin: 7px 0 10px; }
.hero-copy p { font-size: 9px; line-height: 1.58; margin-bottom: 6px; max-width: 372px; }
.hero-actions { margin: 12px 0 16px; }
.hero-benefits { gap: 26px; }
@media (max-width: 991px) { .hero { background-size: auto 100%; background-position: 62% center; height: auto; min-height: 500px; } .hero::after { background: linear-gradient(90deg, #640000 0%, #640000 54%, rgba(100,0,0,.78) 70%, rgba(100,0,0,.08) 100%); } .hero-copy { padding: 48px 12px; } }
@media (max-width: 575px) { .hero { min-height: 480px; } .hero::after { background: linear-gradient(90deg, #640000 0%, #640000 65%, rgba(100,0,0,.72) 100%); } .hero h1 { font-size: 35px; } .hero-copy { padding: 38px 4px; } .hero-copy p { max-width: 290px; } }
/* Đường cong đáy hero: đỏ kéo xuống ở giữa, nâng lên về hai mép như mẫu. */
.hero { border-bottom: 7px solid var(--gold); border-bottom-left-radius: 50% 11%; border-bottom-right-radius: 50% 11%; margin-bottom: 18px; overflow: hidden; }
.hero::after { border-bottom-left-radius: 50% 11%; border-bottom-right-radius: 50% 11%; }
@media (max-width: 991px) { .hero { border-bottom-left-radius: 50% 6%; border-bottom-right-radius: 50% 6%; margin-bottom: 10px; } .hero::after { border-bottom-left-radius: 50% 6%; border-bottom-right-radius: 50% 6%; } }
/* Thay cung tròn bằng mép sóng nhiều nhịp như ảnh mẫu. */
.hero { border: 0; border-radius: 0; margin-bottom: 0; overflow: hidden; }
.hero::after { border-radius: 0; }
.hero-wave { bottom: 0; display: block; height: 42px; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; }
.hero-wave path:first-child { fill: #fffdfb; }
.hero-wave-line { fill: none; stroke: var(--gold); stroke-width: 10; vector-effect: non-scaling-stroke; }
.hero-inner { z-index: 2; }
@media (max-width: 991px) { .hero-wave { height: 34px; } }
/* Ảnh ghép từ tư liệu AKIO: hero là cụm sản phẩm, các khối còn lại là bộ sưu tập ảnh thật. */
.hero { background: radial-gradient(circle at 71% 43%, #9c1408 0%, var(--wine-deep) 48%, #470000 100%); }
.hero-building { display: block; }
.hero-products { display: block; height: 100%; overflow: hidden; }
.hero-reference-product { bottom: -19px; display: block; height: auto; max-width: none; object-fit: contain; position: absolute; right: -32px; width: 800px; }
.hero::after { background: linear-gradient(90deg, #640000 0%, rgba(100,0,0,.94) 43%, rgba(100,0,0,.12) 73%, rgba(100,0,0,0) 100%); }
@media (max-width: 991px) { .hero-reference-product { right: -80px; width: 700px; } }
@media (max-width: 575px) { .hero-reference-product { bottom: -10px; right: -170px; width: 560px; } }
/* Biên độ sóng lớn hơn, gồm nhiều đỉnh và hõm rõ ràng. */
.hero-wave { height: 76px; }
.hero-wave-line { stroke-width: 12; }
@media (max-width: 991px) { .hero-wave { height: 56px; } }
@media (max-width: 575px) { .hero-wave { height: 42px; } }
/* Hai nhịp sóng lớn ở mép dưới hero. */
.hero-wave { height: 92px; }
.hero-wave-line { stroke-width: 13; }
@media (max-width: 991px) { .hero-wave { height: 64px; } }
@media (max-width: 575px) { .hero-wave { height: 45px; } }
/* Tăng kích thước chữ để đọc tốt hơn trên cả desktop và điện thoại. */
body { font-size: 16px; }
.topbar { font-size: 11px; }
.nav-link { font-size: 12px; }
.search-button { font-size: 22px; }
.hero h1 { font-size: 48px; }
.hero h2 { font-size: 22px; }
.hero-copy p { font-size: 12px; line-height: 1.7; max-width: 440px; }
.btn { font-size: 11px; }
.hero-benefits strong { font-size: 10px; }
.hero-benefits small { font-size: 9px; }
.title-left, .section-title { font-size: 28px; }
.about-copy p { font-size: 13px; }
.product-heading { font-size: 13px; }
.product-list { font-size: 11px; }
.small-btn { font-size: 9px; }
.news-card h3 { font-size: 14px; }
.news-card p { font-size: 10px; }
.review-head strong { font-size: 11px; }
.review-head span { font-size: 10px; }
.review-head b { font-size: 12px; }
.review-card p { font-size: 11px; }
.stats strong { font-size: 26px; }
.stats span { font-size: 9px; }
.company-name, .footer h3 { font-size: 12px; }
.contact-list, .footer .col-6 a { font-size: 11px; }
.footer-bottom { font-size: 10px; }
@media (max-width: 575px) { .hero h1 { font-size: 39px; } .hero h2 { font-size: 19px; } .hero-copy p { font-size: 11px; } .title-left, .section-title { font-size: 25px; } }
/* Trang con */
.subhero { background: linear-gradient(105deg, #530000, #8c0e06 72%, #5e0000); color: #fff; padding: 66px 0 58px; position: relative; overflow: hidden; }
.subhero::after { border: 1px solid #d9aa3566; border-radius: 50%; content: ''; height: 440px; position: absolute; right: -100px; top: -255px; width: 440px; }
.subhero p, .kicker { color: var(--gold); font-size: 11px; font-weight: 800; letter-spacing: .1em; margin-bottom: 10px; text-transform: uppercase; }
.subhero h1, .page-section h1, .article-page h1 { font-family: 'Roboto Condensed', sans-serif; font-size: clamp(40px, 6vw, 67px); font-weight: 800; line-height: .95; margin: 0; text-transform: uppercase; }
.subhero nav, .breadcrumb-simple { font-size: 12px; margin-top: 21px; }.subhero nav span, .breadcrumb-simple span { color: var(--gold); margin: 0 7px; }
.page-section { padding: 75px 0; }.page-section h2, .detail-list-section h2 { color: var(--wine); font-family: 'Roboto Condensed', sans-serif; font-size: clamp(31px, 4vw, 49px); font-weight: 800; line-height: .97; text-transform: uppercase; }.large-copy { color: #543d35; font-size: 18px; line-height: 1.75; }.page-image { border: 1px solid #e1c078; border-radius: 10px; box-shadow: 13px 13px 0 #eee1c5; }.info-box { background: #fffaf4; border: 1px solid #eedcc2; border-radius: 9px; height: 100%; padding: 25px; }.info-box b { color: var(--gold); font: 800 30px 'Roboto Condensed'; }.info-box h3 { color: var(--wine); font: 800 22px 'Roboto Condensed'; margin: 17px 0 7px; text-transform: uppercase; }.info-box p { color: #66554c; font-size: 14px; margin: 0; }.section-intro { margin: auto; max-width: 710px; }.section-intro .kicker { display: flex; }.section-intro > p:last-child { color: #685950; font-size: 16px; }.category-card { background: var(--wine-deep); border-radius: 12px; color: #fff; min-height: 440px; overflow: hidden; position: relative; }.category-card::after { background: linear-gradient(0deg, #4b0000ee, transparent 75%); content: ''; inset: 0; position: absolute; }.category-card img { height: 100%; object-fit: cover; position: absolute; }.category-card > div { bottom: 0; left: 0; padding: 32px; position: absolute; right: 0; z-index: 1; }.category-card p { color: var(--gold); font-size: 11px; font-weight: bold; letter-spacing: .1em; }.category-card h3 { font: 800 42px 'Roboto Condensed'; margin: 0 0 5px; text-transform: uppercase; }.category-card span { display: block; font-size: 13px; margin-bottom: 19px; }.consult-strip, .article-cta { align-items: center; background: #fff5e6; border-left: 5px solid var(--gold); display: flex; justify-content: space-between; padding: 25px 30px; }.consult-strip b, .article-cta b { display: block; font-size: 18px; }.consult-strip span, .article-cta span { color: #6c5a50; display: block; font-size: 14px; }.back-link { color: var(--wine); font-size: 12px; font-weight: 800; text-transform: uppercase; }.product-detail .breadcrumb-simple { margin: 0 0 35px; }.product-detail h1 { color: var(--wine); }.detail-spec { border-bottom: 1px solid #eadbce; border-top: 1px solid #eadbce; margin: 26px 0; }.detail-spec div { border-bottom: 1px solid #eadbce; display: grid; gap: 20px; grid-template-columns: 135px 1fr; padding: 13px 0; }.detail-spec div:last-child { border: 0; }.detail-spec b { color: var(--wine); font-size: 13px; }.detail-spec span { color: #685950; font-size: 14px; }.detail-list-section { margin-top: 80px; }.detail-list-section h2 { margin-bottom: 26px; }.product-item { align-items: center; background: #fffaf4; border: 1px solid #edddc8; border-radius: 7px; display: flex; gap: 13px; min-height: 74px; padding: 14px; }.product-item b { color: var(--gold); font: 800 22px 'Roboto Condensed'; }.product-item span { font-size: 14px; font-weight: 600; }.news-filter { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }.news-filter button { background: #fff; border: 1px solid #ead8c3; border-radius: 4px; color: #6b5146; font-size: 12px; font-weight: 700; padding: 9px 16px; }.news-filter button.active { background: var(--wine); color: #fff; }.news-card-page label { color: var(--gold); font-size: 10px; font-weight: 800; }.article-page { padding: 55px 0 80px; }.article-page header { margin: 32px auto; max-width: 850px; text-align: center; }.article-page h1 { color: var(--wine); }.article-date { color: #816b5d; font-size: 13px; font-weight: 700; margin-top: 17px; }.article-cover { border-radius: 10px; height: 450px; object-fit: cover; }.article-content { font-size: 16px; line-height: 1.9; margin: 45px auto; max-width: 810px; }.article-content .lead { color: #513b32; font-size: 20px; font-weight: 600; }.article-content h2 { color: var(--wine); font: 800 31px 'Roboto Condensed'; margin: 33px 0 9px; text-transform: uppercase; }.certificate-grid { display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); }.certificate-grid figure { background: #fff; border: 1px solid #eadfd5; border-radius: 8px; margin: 0; padding: 16px; }.certificate-grid img { height: 255px; object-fit: contain; }.certificate-grid figcaption { color: var(--wine); font-size: 13px; font-weight: 700; padding-top: 12px; text-align: center; }.contact-page-info { border-top: 1px solid #eadbce; margin-top: 30px; }.contact-page-info div { border-bottom: 1px solid #eadbce; display: grid; gap: 5px; padding: 15px 0; }.contact-page-info b { color: var(--wine); font-size: 12px; text-transform: uppercase; }.contact-page-info span, .contact-page-info a { color: #5c4d45; font-size: 15px; }.contact-page-form { background: #fff7ed; border: 1px solid #ecd9bc; border-radius: 10px; padding: 30px; }.contact-page-form label { color: var(--wine); display: block; font-size: 12px; font-weight: 800; margin-bottom: 6px; text-transform: uppercase; }.contact-page-form input, .contact-page-form select, .contact-page-form textarea { background: #fff; border: 1px solid #dfcdb7; border-radius: 4px; font: inherit; padding: 11px; width: 100%; }.form-note { color: var(--wine); margin: 13px 0 0; }
@media (max-width: 767px) { .subhero { padding: 50px 0; }.page-section { padding: 50px 0; }.large-copy { font-size: 16px; }.category-card { min-height: 340px; }.consult-strip, .article-cta { align-items: flex-start; flex-direction: column; gap: 16px; padding: 22px; }.certificate-grid { grid-template-columns: repeat(2, 1fr); }.certificate-grid img { height: 180px; }.article-cover { height: 280px; }.article-content { font-size: 15px; margin: 30px auto; }.detail-spec div { grid-template-columns: 1fr; gap: 3px; }.contact-page-form { padding: 22px; } }
/* Hiệu chỉnh theo phản hồi trực tiếp trên trang chủ. */
.hero { height: auto; min-height: 500px; }
.hero-inner, .hero-inner .row { height: auto; min-height: 500px; }
.hero-copy { padding-bottom: 98px; }
.hero-products { height: 500px; }
.hero-reference-product { bottom: 12px; right: -18px; width: 760px; }
.certificate-list figure { height: 172px; padding: 8px; }
.certificate-list img { height: 100%; }
.news-image { height: 220px; }
.news-content { min-height: 220px; }
@media (max-width: 991px) { .hero, .hero-inner, .hero-inner .row { min-height: 580px; } .hero-products { height: 340px; } .hero-copy { padding-bottom: 20px; } .hero-reference-product { bottom: -25px; right: -55px; width: 690px; } }
@media (max-width: 575px) { .hero, .hero-inner, .hero-inner .row { min-height: 660px; } .hero-products { height: 260px; } .hero-copy { padding-bottom: 0; } .hero-reference-product { right: -155px; width: 570px; } .certificate-list figure { height: 115px; } .news-image { height: 185px; } }
/* Bố cục tin tức dạng tạp chí: một bài chính và hai bài phụ xếp tầng. */
.news-mosaic { display: grid; gap: 22px; grid-template-columns: 1.13fr .87fr; margin-top: 28px; }
.featured-news { background: var(--wine-deep); color: #fff; min-height: 480px; overflow: hidden; position: relative; }
.featured-news a { display: block; height: 100%; }.featured-news-image { height: 300px; overflow: hidden; position: relative; }.featured-news-image::after { background: linear-gradient(0deg, #3c000090, transparent 55%); content: ''; inset: 0; position: absolute; }.featured-news-image img { height: 100%; object-fit: cover; transition: transform .45s ease; }.featured-news:hover img { transform: scale(1.04); }.news-date { background: var(--gold); color: var(--wine-deep); font-size: 9px; font-weight: 800; left: 20px; line-height: 1.25; padding: 9px 10px; position: absolute; top: 20px; z-index: 1; }.news-date b { display: block; font: 800 31px 'Roboto Condensed'; line-height: .8; }.featured-news-copy { padding: 25px 28px; }.featured-news-copy p, .side-news p { color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: .09em; margin-bottom: 8px; }.featured-news-copy h3 { font: 800 29px/1.05 'Roboto Condensed'; margin: 0 0 10px; text-transform: uppercase; }.featured-news-copy span { color: #ffeeda; font-size: 13px; }.featured-news-copy i { color: var(--gold); font-size: 19px; font-style: normal; }.side-news { display: grid; gap: 22px; grid-template-rows: 1fr 1fr; }.side-news article { background: #fffaf4; border: 1px solid #ead7bf; min-height: 0; overflow: hidden; }.side-news article a { display: grid; grid-template-columns: 43% 57%; height: 100%; }.side-news img { height: 100%; min-height: 200px; object-fit: cover; }.side-news article div { display: flex; flex-direction: column; justify-content: center; padding: 19px; }.side-news p { color: var(--wine); font-size: 9px; }.side-news time { color: #9a887b; font-weight: 600; letter-spacing: 0; margin-left: 8px; }.side-news h3 { color: var(--wine); font: 800 21px/1.08 'Roboto Condensed'; margin: 0 0 12px; text-transform: uppercase; }.side-news span { color: #a67a18; font-size: 11px; font-weight: 800; text-transform: uppercase; }
@media (max-width: 767px) { .news-mosaic { grid-template-columns: 1fr; }.featured-news { min-height: auto; }.featured-news-image { height: 245px; }.featured-news-copy h3 { font-size: 26px; }.side-news article { min-height: 190px; }.side-news img { min-height: 190px; }.side-news h3 { font-size: 18px; } }
@media (max-width: 450px) { .side-news article a { grid-template-columns: 1fr; }.side-news img { height: 170px; }.side-news article div { min-height: 165px; } }
/* Ba tin bổ sung dạng danh sách gọn. */
.news-mini-grid { border-top: 1px solid #ead8c3; display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 22px; }
.news-mini-grid a { align-items: center; border-right: 1px solid #ead8c3; display: grid; gap: 13px; grid-template-columns: 31px 1fr 17px; min-height: 94px; padding: 14px 18px; }.news-mini-grid a:last-child { border-right: 0; }.news-mini-grid a:hover { background: #fff7ed; }.news-mini-grid > a > span { color: var(--gold); font: 800 23px 'Roboto Condensed'; }.news-mini-grid p { color: #a27d22; font-size: 9px; font-weight: 800; letter-spacing: .08em; margin: 0 0 4px; }.news-mini-grid h3 { color: var(--wine); font: 800 16px/1.08 'Roboto Condensed'; margin: 0; text-transform: uppercase; }.news-mini-grid i { color: var(--wine); font-size: 18px; font-style: normal; }
@media (max-width: 767px) { .news-mini-grid { grid-template-columns: 1fr; }.news-mini-grid a { border-bottom: 1px solid #ead8c3; border-right: 0; }.news-mini-grid a:last-child { border-bottom: 0; } }
/* Khối tin tức: một bài lớn ở trái và năm bài gọn ở phải. */
.news-mosaic { align-items: stretch; grid-template-columns: 1.05fr .95fr; min-height: 550px; }
.featured-news { min-height: 550px; }.featured-news-image { height: 345px; }
.side-news { gap: 9px; grid-template-rows: repeat(5, 1fr); }.side-news article a { grid-template-columns: 31% 69%; }.side-news img { min-height: 0; }.side-news article div { padding: 11px 14px; }.side-news p { font-size: 8px; margin-bottom: 3px; }.side-news h3 { font-size: 16px; margin: 0; }.side-news span { display: none; }
@media (max-width: 767px) { .news-mosaic { min-height: 0; }.featured-news { min-height: auto; }.side-news { grid-template-rows: none; }.side-news article { min-height: 125px; }.side-news article a { grid-template-columns: 34% 66%; }.side-news img { min-height: 125px; } }
/* Nén năm tin ở cột phải thành các dòng tin ngắn. */
.news-mosaic { min-height: 450px; }
.featured-news { min-height: 450px; }.featured-news-image { height: 258px; }
.side-news { align-content: start; grid-auto-rows: 82px; grid-template-rows: repeat(5, 82px); }.side-news article { height: 82px; }.side-news article a { grid-template-columns: 28% 72%; }.side-news article div { overflow: hidden; padding: 8px 12px; }.side-news p { line-height: 1.1; white-space: nowrap; }.side-news h3 { -webkit-box-orient: vertical; -webkit-line-clamp: 2; display: -webkit-box; font-size: 14px; line-height: 1.05; overflow: hidden; }
@media (max-width: 767px) { .news-mosaic { min-height: 0; }.side-news { grid-auto-rows: auto; grid-template-rows: none; }.side-news article { height: 105px; }.side-news img { min-height: 105px; } }
/* Ảnh tin phụ là khung vuông, hiển thị đủ sản phẩm thay vì cắt ảnh. */
.side-news article a { grid-template-columns: 82px 1fr; }
.side-news img { background: #f7f2e9; height: 82px; object-fit: contain; padding: 3px; width: 82px; }
@media (max-width: 767px) { .side-news article a { grid-template-columns: 105px 1fr; }.side-news img { height: 105px; width: 105px; } }
/* Carousel chứng nhận: ba hình cùng lúc, hình giữa là trọng tâm. */
.certificate-row { align-items: center; gap: 24px; justify-content: center; margin: 18px auto 0; max-width: 1050px; }
.certificate-list { align-items: center; display: flex; flex: 1; gap: 20px; justify-content: center; min-height: 310px; overflow: hidden; }
.certificate-list figure { background: #fff; border: 1px solid #e7d5b7; border-radius: 10px; box-shadow: 0 5px 16px #3b16091c; display: none; margin: 0; padding: 12px; transition: transform .35s ease, opacity .35s ease; }
.certificate-list figure.cert-prev, .certificate-list figure.cert-next { display: block; height: 215px; opacity: .62; transform: scale(.84); width: 170px; }
.certificate-list figure.cert-active { border-color: var(--gold); box-shadow: 0 12px 28px #3b160936; display: block; height: 290px; opacity: 1; transform: scale(1); width: 235px; animation: certificateReveal .42s cubic-bezier(.2,.75,.25,1); }
.certificate-list figure img { height: 100%; object-fit: contain; width: 100%; }
.certificate-list .cert-prev { transform-origin: right center; }.certificate-list .cert-next { transform-origin: left center; }
.carousel-arrow { background: var(--wine); box-shadow: 0 4px 10px #4a000032; flex: 0 0 36px; font-size: 29px; height: 36px; transition: transform .2s ease, background .2s ease; width: 36px; }.carousel-arrow:hover { background: var(--gold); color: var(--wine); transform: scale(1.08); }
@keyframes certificateReveal { 0% { opacity: .3; transform: scale(.76); } 65% { transform: scale(1.06); } 100% { opacity: 1; transform: scale(1); } }
@media (max-width: 575px) { .certificate-row { gap: 8px; }.certificate-list { gap: 2px; min-height: 190px; }.certificate-list figure.cert-prev, .certificate-list figure.cert-next { height: 130px; width: 90px; }.certificate-list figure.cert-active { height: 182px; width: 138px; }.carousel-arrow { flex-basis: 28px; font-size: 22px; height: 28px; width: 28px; } }
/* Phóng lớn carousel chứng nhận. */
.certificate-list { min-height: 420px; }
.certificate-list figure.cert-prev, .certificate-list figure.cert-next { height: 300px; width: 235px; }
.certificate-list figure.cert-active { height: 390px; width: 315px; }
@media (max-width: 575px) { .certificate-list { min-height: 245px; }.certificate-list figure.cert-prev, .certificate-list figure.cert-next { height: 165px; width: 112px; }.certificate-list figure.cert-active { height: 230px; width: 175px; } }
/* Banner sản phẩm được dùng làm nền hero. */
.hero { background: url('../images/banner.png') center center / cover no-repeat; }
.hero-building { display: none; }
.hero::after { background: linear-gradient(90deg, rgba(65,0,0,.48) 0%, rgba(65,0,0,.18) 45%, rgba(65,0,0,0) 70%); }
/* Logo ảnh thương hiệu. */
.navbar-brand .brand-logo { display: block; height: 48px; object-fit: contain; object-position: left center; width: auto; }
@media (max-width: 575px) { .navbar-brand .brand-logo { height: 40px; } }
/* Điều hướng: bỏ mũi tên sản phẩm và căn chính giữa biểu tượng tìm kiếm. */
.search-button { align-items: center; display: inline-flex; font-size: 0; justify-content: center; line-height: 1; padding: 0; }
.search-button::before { content: '⌕'; font-size: 22px; line-height: 1; transform: translateY(-1px); }
/* Thẻ sản phẩm trong từng hệ có ảnh và dẫn đến trang chi tiết riêng. */
.product-item-card { background: #fffaf4; border: 1px solid #edddc8; border-radius: 8px; display: block; height: 100%; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }.product-item-card:hover { box-shadow: 0 8px 20px #4b160d1c; transform: translateY(-4px); }.product-item-card img { background: #f4ede3; height: 145px; object-fit: cover; width: 100%; }.product-item-card div { display: grid; gap: 3px; grid-template-columns: 37px 1fr; padding: 13px; }.product-item-card b { color: var(--gold); font: 800 24px 'Roboto Condensed'; grid-row: span 2; }.product-item-card span { color: var(--wine); font-size: 15px; font-weight: 800; }.product-item-card i { color: #9d741d; font-size: 11px; font-style: normal; font-weight: 700; text-transform: uppercase; }.subproduct-page { min-height: 640px; }
@media (max-width: 575px) { .product-item-card img { height: 125px; } }
/* Menu chính luôn hiển thị giữa header ở trang chi tiết. */
@media (min-width: 992px) { .detail-header .navbar { position: relative; }.detail-header .navbar-collapse { justify-content: center; }.detail-header .navbar-nav { left: 50%; position: absolute; transform: translateX(-50%); white-space: nowrap; } }
/* Tiêu đề banner trang sản phẩm gọn trên một hàng ở desktop. */
.product-subhero h1 { font-size: clamp(30px, 3.6vw, 46px); white-space: nowrap; }
@media (max-width: 767px) { .product-subhero h1 { white-space: normal; } }
/* Lightbox xem chứng nhận kích thước lớn. */
.certificate-clickable { cursor: zoom-in; }.certificate-clickable img { transition: transform .2s ease; }.certificate-clickable:hover img { transform: scale(1.03); }.certificate-lightbox { align-items: center; background: rgba(20, 7, 4, .9); display: flex; flex-direction: column; inset: 0; justify-content: center; opacity: 0; padding: 40px; pointer-events: none; position: fixed; transition: opacity .2s ease; z-index: 200; }.certificate-lightbox.open { opacity: 1; pointer-events: auto; }.certificate-lightbox img { background: #fff; box-shadow: 0 16px 55px #000; max-height: calc(100vh - 110px); max-width: min(860px, 94vw); object-fit: contain; }.certificate-lightbox p { color: #fff; font-size: 14px; font-weight: 700; margin: 13px 0 0; }.lightbox-close { background: var(--gold); border: 0; border-radius: 50%; color: var(--wine); font-size: 28px; height: 38px; line-height: 1; position: absolute; right: 24px; top: 20px; width: 38px; }.lightbox-open { overflow: hidden; }
/* Giữ nút xem chi tiết luôn sát đáy từng danh mục sản phẩm. */
.product-list { display: flex; flex-direction: column; }
.product-list .small-btn { align-self: flex-start; margin-top: auto; }

/* Nút kết nối giữ đúng hình tròn, không bị co khi cột footer hẹp. */
.socials { align-items: center; flex-wrap: wrap; }
.socials a { flex: 0 0 32px; height: 32px; min-width: 32px; width: 32px; }
.socials a:nth-child(2) { flex-basis: 32px; }
.socials a:nth-child(3) { border-radius: 16px; flex-basis: 46px; font-size: 8px; min-width: 46px; width: 46px; }

/* Thanh liên hệ cố định, luôn sẵn sàng ở cạnh phải trang. */
.floating-contact { bottom: 28px; display: grid; gap: 9px; position: fixed; right: 20px; z-index: 80; }
.floating-contact a { align-items: center; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 6px 18px rgba(50, 0, 0, .28); color: #fff; display: flex; font-family: Arial, sans-serif; font-size: 15px; font-weight: 800; height: 46px; justify-content: center; transition: transform .2s ease, box-shadow .2s ease; width: 46px; }
.floating-contact a:hover { box-shadow: 0 9px 22px rgba(50, 0, 0, .38); color: #fff; transform: translateY(-3px); }
.floating-contact .floating-phone { background: var(--wine); font-size: 18px; }
.floating-contact .floating-zalo { background: #147fe9; font-size: 10px; }
.floating-contact .floating-facebook { background: #1877ce; font-size: 22px; }
@media (max-width: 575px) { .floating-contact { bottom: 18px; right: 12px; }.floating-contact a { height: 40px; width: 40px; } }

/* Icon tuyến tính ổn định, không phụ thuộc các ký tự biểu tượng của font. */
.hero-benefits i, .stats i { flex: 0 0 auto; font-family: Arial, sans-serif; font-style: normal; }
.hero-benefits i::before, .stats i::before { align-items: center; display: flex; height: 100%; justify-content: center; width: 100%; }
.hero-benefits .benefit-quality::before { content: '✓'; }
.hero-benefits .benefit-technology::before { content: '✦'; }
.hero-benefits .benefit-support::before { content: '?'; }
.stats i { height: 28px; position: relative; width: 28px; }
.stats i::before { border: 1px solid var(--gold); border-radius: 50%; font-size: 14px; }
.stats .stat-experience::before { content: '10'; font-size: 10px; }
.stats .stat-partners::before { content: '★'; }
.stats .stat-projects::before { content: '✓'; }
.stats .stat-market::before { content: '◆'; font-size: 10px; }

/* Ảnh giới thiệu dạng showcase: một khung xưởng lớn cùng nhãn nhận diện nổi bật. */
.about-showcase { background: var(--wine-deep); box-shadow: 16px 16px 0 #ead9bb; height: 280px; isolation: isolate; position: relative; }
.about-showcase::after { background: linear-gradient(105deg, rgba(83, 0, 0, .72), transparent 58%); content: ''; inset: 0; position: absolute; z-index: 1; }
.about-showcase > img { height: 100%; object-fit: cover; object-position: center; }
.about-showcase-label { background: var(--wine-deep); border-left: 4px solid var(--gold); bottom: 18px; color: #fff; left: 0; padding: 14px 18px; position: absolute; z-index: 2; }
.about-showcase-label span { color: var(--gold); display: block; font-size: 9px; font-weight: 800; letter-spacing: .15em; margin-bottom: 3px; }
.about-showcase-label b { font: 800 22px/1 'Roboto Condensed', sans-serif; }
.about-showcase-accent { align-items: center; background: var(--gold); color: var(--wine-deep); display: flex; gap: 7px; padding: 9px 12px; position: absolute; right: 16px; top: 16px; z-index: 2; }
.about-showcase-accent span { font: 800 32px/1 'Roboto Condensed', sans-serif; }
.about-showcase-accent small { font-size: 8px; font-weight: 800; line-height: 1.2; }
@media (max-width: 991px) { .about-showcase { height: 320px; margin-top: 22px; } }
@media (max-width: 575px) { .about-showcase { box-shadow: 9px 9px 0 #ead9bb; height: 245px; }.about-showcase-label { bottom: 12px; padding: 11px 13px; }.about-showcase-label b { font-size: 18px; }.about-showcase-accent { right: 10px; top: 10px; } }

/* Dải dấu ấn toàn trang đặt trước chứng nhận. */
.stats { background: linear-gradient(90deg, rgba(62, 0, 0, .95), rgba(104, 5, 0, .82)), url('../../images/Kho xưởng/1784272364529_3472759908942407795_3472759908942407795_7c59d7f9ad474f88ff7440a70b07f2c2.jpg') center / cover; border-radius: 0; color: #fff; margin: 0; max-width: none; overflow: hidden; padding: 39px 0; position: relative; }
.stats::before { border: 1px solid rgba(215, 204, 108, .38); border-radius: 50%; content: ''; height: 410px; position: absolute; right: -115px; top: -178px; width: 410px; }
.stats .container { align-items: center; display: grid; gap: 42px; grid-template-columns: .95fr 2.05fr; padding: 0 12px; position: relative; }
.stats-intro { border-left: 3px solid var(--gold); padding-left: 17px; }
.stats-intro span { color: var(--gold); display: block; font-size: 10px; font-weight: 800; letter-spacing: .15em; margin-bottom: 6px; }
.stats-intro b { font: 800 29px/1.03 'Roboto Condensed', sans-serif; }
.stats-items { display: grid; grid-template-columns: repeat(4, 1fr); }
.stats-items > div { align-items: center; border-left: 1px solid rgba(215, 204, 108, .38); column-gap: 11px; display: grid; grid-template-columns: 38px 1fr; padding: 9px 17px; }
.stats-items i { color: var(--gold); grid-row: span 2; height: 34px; width: 34px; }
.stats-items i::before { border-color: var(--gold); font-size: 15px; }
.stats-items strong { color: var(--gold); font: 800 31px/1 'Roboto Condensed', sans-serif; }
.stats-items span { color: #fff6df; font-size: 10px; line-height: 1.2; }
@media (max-width: 991px) { .stats .container { gap: 28px; grid-template-columns: 1fr; }.stats-intro { text-align: center; }.stats-items { grid-template-columns: repeat(4, 1fr); }.stats-items > div { padding: 7px 10px; } }
@media (max-width: 575px) { .stats { padding: 31px 0; }.stats-intro b { font-size: 25px; }.stats-items { grid-template-columns: 1fr 1fr; margin-top: 5px; }.stats-items > div { border-bottom: 1px solid rgba(215, 204, 108, .28); min-height: 65px; }.stats-items > div:nth-child(odd) { border-left: 0; }.stats-items strong { font-size: 28px; } }

/* Trang giới thiệu: banner gọn hơn và ảnh công ty đặt dưới nội dung thương hiệu. */
.gioi-thieu-subhero h1 { font-size: clamp(37px, 4.2vw, 55px); line-height: 1.02; }
.company-wide-image { border: 1px solid #e4c68d; border-radius: 10px; box-shadow: 13px 13px 0 #eee1c5; margin: 43px 0 0; overflow: hidden; position: relative; }
.company-wide-image img { height: 360px; object-fit: cover; object-position: center; }
.company-wide-image::after { background: linear-gradient(90deg, rgba(68, 0, 0, .74), rgba(68, 0, 0, .05) 70%); content: ''; inset: 0; position: absolute; }
.company-wide-image figcaption { bottom: 0; color: #fff; left: 0; max-width: 440px; padding: 27px 31px; position: absolute; z-index: 1; }
.company-wide-image figcaption span { color: var(--gold); display: block; font-size: 10px; font-weight: 800; letter-spacing: .14em; margin-bottom: 5px; }
.company-wide-image figcaption b { font: 800 29px/1.05 'Roboto Condensed', sans-serif; text-transform: uppercase; }
@media (max-width: 575px) { .gioi-thieu-subhero h1 { font-size: 34px; }.company-wide-image { box-shadow: 8px 8px 0 #eee1c5; margin-top: 30px; }.company-wide-image img { height: 235px; }.company-wide-image figcaption { padding: 18px; }.company-wide-image figcaption b { font-size: 21px; } }

/* Thẻ sản phẩm: ảnh vuông, xem trọn vẹn bao bì và không đánh số thứ tự. */
.product-item-card img { aspect-ratio: 1 / 1; background: #fff; height: auto; object-fit: contain; padding: 10px; }
.product-item-card div { display: flex; flex-direction: column; gap: 4px; padding: 14px 15px 16px; }
.product-item-card div span { color: var(--wine); font-size: 15px; font-weight: 800; }
.product-item-card div i { color: #9d741d; font-size: 11px; font-style: normal; font-weight: 700; text-transform: uppercase; }

/* Ảnh công ty hiển thị nguyên bản, đầy đủ chiều ngang và không chèn nội dung. */
.company-wide-image { border: 0; border-radius: 0; box-shadow: none; margin: 43px 0 0; }
.company-wide-image::after { display: none; }
.company-wide-image img { height: auto; object-fit: initial; width: 100%; }

/* Ảnh minh họa giới thiệu được thiết kế riêng thành một bố cục showcase. */
.about-showcase { background: transparent; box-shadow: 14px 14px 0 #ead9bb; height: auto; }
.about-showcase::after { display: none; }
.about-showcase > img { height: auto; object-fit: initial; width: 100%; }
.about-showcase-label, .about-showcase-accent { display: none; }
@media (max-width: 991px) { .about-showcase { height: auto; } }

/* Dải dấu ấn tối giản: nền sáng, họa tiết vàng mờ và số liệu rõ ràng. */
.stats { background: radial-gradient(circle at 92% 18%, rgba(215, 204, 108, .22) 0 2px, transparent 3px 100%), linear-gradient(105deg, #fffdf9 0%, #fff7e9 100%); border-bottom: 1px solid #e7d6aa; border-top: 1px solid #e7d6aa; color: var(--wine); padding: 38px 0; }
.stats::before { border: 1px solid rgba(215, 204, 108, .42); height: 280px; right: -80px; top: -110px; width: 280px; }
.stats .container { gap: 50px; grid-template-columns: .85fr 2.15fr; }
.stats-intro { border-left-color: var(--wine); }
.stats-intro span { color: #aa8224; }
.stats-intro b { color: var(--wine); font-size: 27px; }
.stats-items { background: rgba(255,255,255,.58); border: 1px solid #eadac0; border-radius: 6px; overflow: hidden; }
.stats-items > div { border-left-color: #eadac0; padding: 13px 16px; }
.stats-items i { color: var(--wine); }
.stats-items i::before { border-color: #c99a2c; color: var(--wine); }
.stats-items strong { color: var(--wine); font-size: 30px; }
.stats-items span { color: #685950; font-size: 10px; }
@media (max-width: 991px) { .stats .container { gap: 25px; }.stats-items { border-radius: 5px; } }
@media (max-width: 575px) { .stats { padding: 30px 0; }.stats-items > div { border-bottom-color: #eadac0; }.stats-items strong { font-size: 27px; } }

/* Bố cục mới cho dải năng lực: tiêu đề trung tâm và bốn thẻ số liệu độc lập. */
.stats { padding: 46px 0 50px; }
.stats .container { display: block; max-width: 1120px; padding: 0 12px; }
.stats .container > .stats-intro { border: 0; display: block; margin: 0 auto 28px; padding: 0; text-align: center; }
.stats-intro span { display: block; font-size: 10px; letter-spacing: .18em; margin: 0 0 8px; }
.stats-intro b { display: block; font-size: 30px; line-height: 1.05; }
.stats-intro > i { background: var(--gold); display: block; height: 3px; margin: 14px auto 0; width: 58px; }
.stats-items { background: transparent; border: 0; border-radius: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; overflow: visible; }
.stats-items > article { align-items: center; background: rgba(255,255,255,.86); border: 1px solid #ead9bb; border-radius: 7px; display: grid; grid-template-columns: 44px 1fr; min-height: 102px; padding: 17px 15px; }
.stats-items > article i { color: var(--wine); grid-row: span 2; height: 38px; width: 38px; }
.stats-items > article i::before { border-color: var(--gold); color: var(--wine); font-size: 16px; }
.stats-items > article strong { color: var(--wine); font: 800 31px/1 'Roboto Condensed', sans-serif; }
.stats-items > article span { color: #685950; font-size: 10px; line-height: 1.25; }
@media (max-width: 767px) { .stats { padding: 36px 0; }.stats-intro b { font-size: 25px; }.stats-items { grid-template-columns: 1fr 1fr; }.stats-items > article { min-height: 88px; padding: 12px; } }
@media (max-width: 420px) { .stats-items { grid-template-columns: 1fr; } }

.stats .container > .stats-items { border-right: 0; padding: 0; }

/* Footer dùng chung logo ảnh với phần điều hướng trên cùng. */
.footer-brand { display: inline-flex; line-height: 1; }
.footer-brand .footer-logo { height: 53px; object-fit: contain; object-position: left center; width: auto; }
@media (max-width: 575px) { .footer-brand .footer-logo { height: 46px; } }

/* Khóa bố cục desktop thành một hàng ngang, tránh CSS cũ ghi đè grid. */
.stats .container > .stats-items { align-items: stretch; background: transparent; border: 0; column-gap: 14px; display: flex; grid-template-columns: none; padding: 0; width: 100%; }
.stats .container > .stats-items > article { flex: 1 1 0; min-width: 0; }
@media (max-width: 767px) { .stats .container > .stats-items { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }.stats .container > .stats-items > article { min-width: auto; } }
@media (max-width: 420px) { .stats .container > .stats-items { grid-template-columns: 1fr; } }

/* Tạo khoảng đệm riêng giữa hai nhóm Sơn gỗ và Sơn kim loại. */
@media (min-width: 992px) {
  .product-row { column-gap: 0; grid-template-columns: 1.35fr 1.18fr 22px 1.35fr 1.18fr; }
  .product-row .product-card.metal { grid-column: 4; }
  .product-row .product-list.compact { grid-column: 5; }
}

/* Nhịp thở đồng đều giữa các khu vực trên trang chủ. */
.home-main > section + section { margin-top: 34px; }
@media (max-width: 767px) { .home-main > section + section { margin-top: 24px; } }

.home-main > #gioi-thieu { margin-top: 0; }

.home-main > #san-pham { border-top: 0; }

.home-main > #chung-nhan { border-top: 0; }

.home-main > .reviews { border-top: 0; }

.home-main > #tin-tuc { border-top: 0; }

/* Hiệu ứng cuộn giữ nhịp nhẹ; người dùng giảm chuyển động sẽ không thấy animation. */
@media (prefers-reduced-motion: reduce) {
  [data-aos] { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* Biến thể chuyển động AKIO: trượt rõ ràng hơn thay vì chỉ mờ dần. */
[data-aos="akio-slide-up"], [data-aos="akio-slide-left"], [data-aos="akio-slide-right"] { opacity: 0; transition-duration: 720ms; transition-property: opacity, transform; transition-timing-function: cubic-bezier(.22,.8,.25,1); }
[data-aos="akio-slide-up"] { transform: translate3d(0, 64px, 0); }
[data-aos="akio-slide-left"] { transform: translate3d(78px, 0, 0); }
[data-aos="akio-slide-right"] { transform: translate3d(-78px, 0, 0); }
[data-aos="akio-slide-up"].aos-animate, [data-aos="akio-slide-left"].aos-animate, [data-aos="akio-slide-right"].aos-animate { opacity: 1; transform: translate3d(0, 0, 0); }
@media (max-width: 767px) { [data-aos="akio-slide-left"], [data-aos="akio-slide-right"] { transform: translate3d(0, 45px, 0); } }


/* Giảm hiện tượng chữ đổi kiểu sau khi trang đã hiện nội dung. */
body { font-synthesis: none; }

/* Icon SVG riêng cho các chỉ số năng lực, đồng nhất nét và ý nghĩa. */
.stats-items > article i::before { display: none; }
.stats-items > article i { align-items: center; display: flex; justify-content: center; }
.stats-items > article i svg { height: 20px; overflow: visible; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 20px; }

.stats-items > article i svg, .stats-items > article i svg * { fill: none; }

/* Phóng lớn icon trong dải năng lực. */
.stats-items > article { grid-template-columns: 58px 1fr; }
.stats-items > article i { height: 50px; width: 50px; }
.stats-items > article i svg { height: 29px; stroke-width: 2; width: 29px; }

/* Tăng cỡ chữ đọc mặc định trên toàn website. */
body { font-size: 17px; }
.topbar { font-size: 12px; }
.nav-link { font-size: 13px; }
.hero-copy p { font-size: 14px; }
.hero-benefits strong { font-size: 11px; }
.hero-benefits small { font-size: 10px; }
.about-copy p { font-size: 15px; }
.product-list { font-size: 13px; }
.small-btn, .btn { font-size: 11px; }
.review-head strong { font-size: 13px; }
.review-head span { font-size: 12px; }
.review-head b { font-size: 13px; }
.review-card p { font-size: 12px; }
.news-card h3 { font-size: 15px; }
.news-card p { font-size: 12px; }
.featured-news-copy span { font-size: 14px; }
.side-news h3 { font-size: 15px; }
.stats-items span { font-size: 11px; }
.company-name, .footer h3 { font-size: 13px; }
.contact-list, .footer .col-6 a { font-size: 12px; }
.footer-bottom { font-size: 11px; }
@media (max-width: 575px) { body { font-size: 16px; }.topbar { font-size: 10px; }.hero-copy p { font-size: 13px; } }

/* Tạo khoảng thở lớn hơn phía trên phần nội dung hero. */
.hero-copy { padding-top: 58px; }
@media (max-width: 991px) { .hero-copy { padding-top: 42px; } }
@media (max-width: 575px) { .hero-copy { padding-top: 34px; } }