@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&family=Playfair+Display:wght@400;500;600&display=swap');
:root{--paper:#f7f5ef;--ink:#293b34;--muted:#6b736c;--green:#3b5547;--line:#d9ded4}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.8 'Be Vietnam Pro',sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}img{display:block;width:100%;height:100%;object-fit:cover}header{position:sticky;top:0;background:#f7f5eff5;z-index:10;border-bottom:1px solid var(--line)}.nav{max-width:1400px;margin:auto;padding:19px 5%;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:12px}.mark{border:1px solid var(--green);padding:3px 9px;font:27px Georgia}.brand strong{font-size:18px;letter-spacing:2px;display:block;line-height:1.3}.brand small{font-size:9px;letter-spacing:3px}.links{display:flex;align-items:center;gap:26px;font-size:12px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:20px;background:var(--green);color:white;padding:14px 23px;border:1px solid var(--green);cursor:pointer;font-size:12px}.btn.light{background:transparent;color:var(--ink)}.menu{display:none;background:none;border:0;font-size:24px}.wrap{max-width:1280px;margin:auto;padding:0 5%}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:3px;font-weight:600}.hero{display:grid;grid-template-columns:46% 54%;min-height:640px}.hero-copy{padding:85px 10% 65px 11%;display:flex;flex-direction:column;justify-content:center}.hero h1{font-family:'Playfair Display',serif;font-size:clamp(40px,4.4vw,68px);line-height:1.15;font-weight:400;letter-spacing:-1px;margin:25px 0}.hero h1 em{color:#788d6f;font-weight:400}.hero p{max-width:410px;color:var(--muted);font-size:13px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:23px 0}.hero-photo{position:relative;min-height:550px}.hero-photo img{position:absolute;inset:0}.photo-note{position:absolute;bottom:28px;left:30px;color:white;background:#293b34d9;padding:13px 20px;font-size:10px;letter-spacing:1px}.small-note{font-size:10px;color:var(--muted)}.trust{display:flex;justify-content:space-between;gap:20px;padding:24px 0;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:1px}.trust span::before{content:'✧';padding-right:13px;color:#819078}section{padding:85px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:35px}h2{font-family:'Playfair Display',serif;font-size:clamp(30px,3vw,45px);line-height:1.25;font-weight:400;margin:12px 0}h3{font-size:16px;font-weight:500}.section-head p{max-width:370px;color:var(--muted);font-size:12px}.text-link{border-bottom:1px solid;padding-bottom:5px;font-size:12px}.categories{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.category .image{height:300px;overflow:hidden}.category img{transition:transform .5s}.category:hover img{transform:scale(1.04)}.category h3{margin:15px 0 2px}.category p{font-size:11px;color:var(--muted);margin:0}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.feature{background:#e9ede3}.feature-img{height:580px;position:relative}.feature-copy{padding-right:8%}.feature-copy p{font-size:13px;color:var(--muted)}.points{list-style:none;padding:0;margin:25px 0}.points li{border-bottom:1px solid #cbd2c4;padding:12px 0;font-size:12px;display:flex;gap:18px}.points span{color:#819078}.gallery{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:22px}.gallery figure{margin:0}.gallery .image{height:330px}.gallery figcaption{padding-top:13px;font-size:13px}.gallery small{display:block;color:var(--muted);font-size:10px}.materials{background:#ede8dc}.materials .image{height:420px}.material-tags{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.material-tags span{border:1px solid #ccc6b7;border-radius:30px;padding:5px 12px;font-size:10px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:40px}.step{border-top:1px solid var(--line);padding-top:22px}.step b{font:38px 'Playfair Display';color:#94a08a}.step p{font-size:12px;color:var(--muted)}.faq{max-width:820px;margin:auto}.faq h2{text-align:center;margin-bottom:32px}details{border-bottom:1px solid var(--line);padding:18px 0}summary{cursor:pointer;font-size:13px}details p{font-size:12px;color:var(--muted)}.contact{background:var(--green);color:white}.contact p{color:#d1dbcd;font-size:13px}.contact .eyebrow{color:#c9d2be}.contact form{padding:30px;background:#fff;color:var(--ink)}label{display:block;font-size:11px;margin-bottom:12px}input,select,textarea{width:100%;border:0;border-bottom:1px solid #ccd0c8;background:transparent;padding:9px 0;color:var(--ink);border-radius:0}textarea{height:75px}.contact form .btn{width:100%;margin-top:12px}.contact-list{padding:0;list-style:none;font-size:12px;line-height:2.3}.contact-list strong{font-size:24px;font-weight:400}footer{padding:45px 0 90px;font-size:11px}.footer-row{display:flex;justify-content:space-between;gap:30px}.footer-row p{max-width:350px;color:var(--muted)}.float-contact{position:fixed;right:24px;bottom:24px;background:var(--green);color:#fff;border:1px solid #ffffff66;padding:12px 22px;border-radius:30px;z-index:20;font-size:12px;box-shadow:0 4px 20px #0002}.mobile-bar{display:none}.page-title{padding:55px 0 35px}.page-title p{max-width:660px;color:var(--muted)}.filters{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:28px}.filters button{border:1px solid var(--line);background:none;padding:9px 18px;cursor:pointer;font-size:11px}.filters button.active{background:var(--green);color:white}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.project-grid article .image{height:330px}.project-grid article p{font-size:11px;color:var(--muted)}.project-grid article[hidden]{display:none}.service-row{display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:35px 0;border-bottom:1px solid var(--line);align-items:center}.service-row .image{height:360px}.service-row p{color:var(--muted);font-size:13px}.success{font-size:12px;padding:10px;background:#edf2e8}.breadcrumb{font-size:10px;color:var(--muted)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #b99162;outline-offset:4px}@media(min-width:1500px){.hero{max-width:1600px;margin:auto}}@media(max-width:1000px){.links{gap:12px;font-size:10px}.nav{padding:16px 4%}.hero-copy{padding:55px 9%}.hero h1{font-size:45px}.categories{grid-template-columns:repeat(2,1fr)}.split{gap:35px}.feature-img{height:500px}.gallery .image{height:260px}.hero{min-height:560px}}@media(max-width:700px){body{font-size:14px}.nav{padding:12px 5%}.brand strong{font-size:15px}.menu{display:block}.links{display:none;position:absolute;top:70px;left:0;right:0;background:var(--paper);padding:20px;flex-direction:column;font-size:14px;box-shadow:0 10px 15px #0001}.links.open{display:flex}.nav>.btn{display:none}.hero{grid-template-columns:1fr}.hero-copy{padding:45px 6% 30px}.hero h1{font-size:45px;margin:18px 0}.hero-photo{min-height:400px}.hero-photo img{object-position:center}.trust{display:grid;grid-template-columns:1fr 1fr;font-size:9px;padding:20px 0}.wrap{padding:0 6%}section{padding:55px 0}.section-head{display:block}.section-head p{max-width:none}.categories{gap:14px}.category .image{height:220px}.category h3{font-size:14px}.split{grid-template-columns:1fr;gap:28px}.feature-img{height:420px}.feature-copy{padding:0}.gallery{grid-template-columns:1fr}.gallery .image{height:340px}.materials .image{height:340px}.steps{grid-template-columns:1fr 1fr;gap:22px}.contact form{padding:23px}.footer-row{display:block}.float-contact{display:none}.mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:20;background:var(--paper);border-top:1px solid var(--line);padding:10px 12px;gap:10px}.mobile-bar a{flex:1;text-align:center;font-size:12px;padding:8px;background:var(--green);color:white}.project-grid{grid-template-columns:1fr}.service-row{grid-template-columns:1fr;gap:15px}.page-title{padding-top:35px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.page-heading{font:400 clamp(34px,4vw,52px)/1.25 "Playfair Display",serif;margin:15px 0 22px}

.brand-logo{width:112px;height:83px;object-fit:contain;flex-shrink:0}.nav{padding-top:8px;padding-bottom:8px}.zalo-card{display:flex;gap:20px;align-items:center;margin-top:28px;background:#fff;color:var(--ink);padding:18px;border-radius:6px}.zalo-card>img{width:170px;height:170px;object-fit:contain;flex-shrink:0;padding:8px;background:#fff}.zalo-card strong{font-size:13px}.zalo-card p{color:var(--muted);font-size:11px;line-height:1.7}.zalo-card small{display:block;font-size:10px;margin-top:10px;color:var(--muted)}.zalo-card .btn{font-size:10px;padding:8px 12px}@media(max-width:1000px){.zalo-card{flex-direction:column;align-items:flex-start}.zalo-card>img{width:195px;height:195px}}@media(max-width:700px){.brand-logo{width:90px;height:67px}.nav{padding-top:5px;padding-bottom:5px}.links{top:78px}.zalo-card{align-items:center;text-align:center}.zalo-card>img{width:220px;height:220px}footer .brand-logo{width:130px;height:96px}}

/* Comfortable content margins across every page. */
.wrap,.nav{max-width:1200px;padding-left:48px;padding-right:48px}
.hero{width:calc(100% - 96px);max-width:1104px;margin:36px auto 0;grid-template-columns:46% 54%;min-height:590px;gap:0}
.hero-copy{padding:48px 42px 48px 0}
.hero h1{font-size:clamp(40px,4vw,60px)}
.hero-photo{min-height:550px;border-radius:8px;overflow:hidden}
.hero-photo img{border-radius:8px}
.split{gap:56px}.feature-copy{padding-right:0}
.section-head{gap:40px}.categories{gap:24px}.gallery{gap:26px}
.category .image,.gallery .image,.project-grid .image,.materials .image,.feature-img{border-radius:6px;overflow:hidden}
.contact .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.split>*,.hero-copy,.category,.project-grid article{min-width:0}
.contact form{padding:32px}.contact-list{overflow-wrap:anywhere}
@media(max-width:1000px){
.wrap,.nav{padding-left:36px;padding-right:36px}
.nav{gap:16px}.links{gap:12px}.nav>.btn{padding:12px 16px}
.hero{width:calc(100% - 72px);grid-template-columns:1fr 1fr;min-height:520px}
.hero-copy{padding:36px 28px 36px 0}.hero h1{font-size:43px}
.hero-photo{min-height:520px}.split{gap:32px}
.contact form{padding:24px}
}
@media(max-width:700px){
.wrap,.nav{padding-left:24px;padding-right:24px}
.hero{width:calc(100% - 48px);margin:24px auto 0;grid-template-columns:1fr;min-height:0}
.hero-copy{padding:12px 0 28px}.hero h1{font-size:42px;line-height:1.18}
.hero-photo{min-height:390px}.photo-note{left:18px;right:18px;bottom:18px;padding:12px 14px;font-size:9px}
.split,.contact .split{grid-template-columns:1fr;gap:32px}
.categories{gap:20px}.category .image{height:200px}
.section-head{margin-bottom:28px}.section-head p{margin-top:18px}
.contact form{padding:24px}.contact-list strong{font-size:23px}
.zalo-card{padding:18px}.zalo-card>img{max-width:100%;height:auto;aspect-ratio:1}
.links{left:24px;right:24px;padding:24px}
.mobile-bar{padding-left:16px;padding-right:16px}.float-contact{right:28px}
}
@media(max-width:360px){.wrap,.nav{padding-left:20px;padding-right:20px}.hero{width:calc(100% - 40px)}.hero h1{font-size:37px}.categories{grid-template-columns:1fr}.category .image{height:290px}.contact form{padding:20px}}

/* Direct Zalo contact replaces the consultation form. */
.contact .split{display:block}.contact .split>div{display:grid;grid-template-columns:1.15fr .85fr;column-gap:64px;align-items:start}.contact .split>div>*{grid-column:1}.contact .split>div>.zalo-card{grid-column:2;grid-row:1 / span 6;align-self:center;justify-self:end;max-width:360px;width:100%;margin:0;flex-direction:column;align-items:center;text-align:center;padding:28px}.contact .zalo-card>img{width:220px;height:220px;max-width:100%;object-fit:contain}.contact .split>div>.text-link{justify-self:start}.contact .split>div>h2{margin-top:16px}.contact .split>div>.contact-list{margin-top:12px}@media(max-width:700px){.contact .split>div{grid-template-columns:1fr;gap:0}.contact .split>div>.zalo-card{grid-column:1;grid-row:auto;justify-self:center;margin-top:32px;max-width:360px;padding:24px}}
