:root {
  --ink: #103235;
  --deep: #082a2d;
  --paper: #f2eee5;
  --paper-dark: #e7e1d5;
  --orange: #f16a3d;
  --yellow: #f2c94c;
  --white: #fffaf0;
  --line: rgba(16, 50, 53, 0.18);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--paper); font-family: "Roboto", Arial, Helvetica, sans-serif; }
body::selection { color: var(--deep); background: var(--yellow); }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
.shell { width: min(1280px, calc(100% - 80px)); margin-inline: auto; }

.header {
  position: fixed; z-index: 50; top: 0; left: 0; width: 100%; min-height: 80px;
  display: flex; align-items: center; justify-content: space-between; padding: 12px 40px;
  color: var(--white); background: rgba(8, 42, 45, 0.92); border-bottom: 1px solid rgba(255,255,255,.13);
  backdrop-filter: blur(16px);
}
.brand { display: flex; align-items: center; gap: 12px; position: relative; z-index: 2; }
.brand > span:last-child { display: flex; flex-direction: column; gap: 3px; }
.brand strong { font-size: 14px; letter-spacing: .05em; }
.brand small { color: rgba(255,255,255,.55); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }
.brand-mark { width: 46px; height: 46px; display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; transform: rotate(-2deg); }
.brand-mark b { display: grid; place-items: center; color: var(--deep); background: var(--yellow); font-size: 18px; }
.brand-mark b:last-child { color: white; background: var(--orange); }
.nav { display: flex; align-items: center; gap: 30px; font-size: 12px; font-weight: 700; }
.nav > a:not(.nav-cta) { color: rgba(255,255,255,.75); }
.nav > a:not(.nav-cta):hover { color: var(--yellow); }
.nav-cta { padding: 13px 18px; color: var(--deep); background: var(--yellow); box-shadow: 4px 4px 0 var(--orange); transition: .2s; }
.nav-cta:hover { transform: translate(2px,2px); box-shadow: 2px 2px 0 var(--orange); }
.menu { display: none; }

.hero { min-height: 820px; display: grid; grid-template-columns: 53% 47%; color: var(--white); background: var(--deep); overflow: hidden; }
.hero-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 155px 4vw 80px max(40px, calc((100vw - 1280px)/2)); }
.eyebrow { display: flex; align-items: center; gap: 11px; margin: 0 0 24px; color: var(--yellow); font: 700 10px/1.2 "Roboto", Arial, sans-serif; letter-spacing: .14em; }
.eyebrow i { width: 27px; height: 2px; display: block; background: var(--orange); }
.eyebrow.dark { color: var(--ink); }
.hero h1, h2 { margin: 0; font-weight: 900; letter-spacing: -.065em; line-height: .92; }
.hero h1 { max-width: 720px; font-size: clamp(60px, 6.4vw, 105px); }
.hero h1 em { display: block; color: transparent; font-style: normal; -webkit-text-stroke: 1.5px var(--orange); }
.hero-lead { max-width: 580px; margin: 30px 0 0; color: rgba(255,255,255,.68); font-size: 16px; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 34px; }
.button { min-height: 57px; display: flex; align-items: center; gap: 35px; padding: 0 23px; background: var(--orange); box-shadow: 6px 6px 0 var(--yellow); font-size: 13px; font-weight: 800; transition: .2s; }
.button:hover { transform: translate(3px,3px); box-shadow: 3px 3px 0 var(--yellow); }
.button span { font-size: 20px; }
.text-link { padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.45); font-size: 12px; font-weight: 700; }
.hero-stats { width: 100%; max-width: 610px; display: grid; grid-template-columns: .8fr 1.1fr 1.2fr; margin-top: 62px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.15); }
.hero-stats div { display: flex; flex-direction: column; gap: 4px; padding-right: 18px; border-right: 1px solid rgba(255,255,255,.12); }
.hero-stats div:not(:first-child) { padding-left: 22px; }
.hero-stats div:last-child { border: 0; }
.hero-stats strong { color: var(--yellow); font-size: 19px; }
.hero-stats small { color: rgba(255,255,255,.4); font-size: 9px; letter-spacing: .09em; text-transform: uppercase; }

.hero-art { min-height: 820px; position: relative; display: grid; place-items: center; padding: 110px 5vw 70px 2vw; background: var(--orange); clip-path: polygon(11% 0,100% 0,100% 100%,0 100%); }
.blueprint { width: min(470px, 39vw); aspect-ratio: .84; position: relative; overflow: hidden; background-color: #0d3a3d; background-image: linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px); background-size: 30px 30px; border: 1px solid rgba(255,255,255,.45); box-shadow: 17px 17px 0 rgba(8,42,45,.25),34px 34px 0 rgba(242,201,76,.24); transform: rotate(-2deg); animation: float 6s ease-in-out infinite; }
@keyframes float { 50% { transform: rotate(-.5deg) translateY(-11px); } }
.blueprint-name,.blueprint-code { position: absolute; z-index: 5; top: 18px; left: 20px; color: var(--yellow); font: 700 8px "Roboto",Arial,sans-serif; letter-spacing: .15em; }
.blueprint-code { top: auto; left: auto; right: 18px; bottom: 15px; color: rgba(255,255,255,.45); }
.cement { position: absolute; z-index: 4; left: 51%; bottom: 66px; width: 165px; height: 228px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--deep); background: #e7dfcf; border: 2px solid var(--deep); box-shadow: 9px 10px 0 rgba(0,0,0,.2); transform: translateX(-50%) rotate(3deg); }
.cement::before { content:""; position:absolute; inset:48px 13px; border:1px solid rgba(8,42,45,.35); }
.cement::after { content:""; position:absolute; top:10px; left:10px; right:10px; border-top:2px dashed var(--deep); }
.cement small,.cement strong,.cement b { position:relative; z-index:2; }
.cement small { font-size:7px; letter-spacing:.15em; }
.cement strong { width:85px; margin-top:9px; font-size:25px; line-height:.86; text-align:center; }
.cement b { margin-top:11px; padding:4px 9px; color:white; background:var(--orange); font-size:9px; }
.bricks { position:absolute; z-index:5; left:20px; bottom:38px; width:165px; display:grid; grid-template-columns:1fr 1fr; gap:4px; }
.bricks span { height:45px; position:relative; background:var(--orange); border:2px solid #6f291b; box-shadow:inset -6px -6px rgba(111,41,27,.18); }
.bricks span::before,.bricks span::after { content:""; position:absolute; top:12px; width:15px; height:17px; background:var(--deep); border-radius:9px; }
.bricks span::before { left:16px; }.bricks span::after { right:16px; }
.steel { position:absolute; z-index:3; right:-55px; bottom:65px; width:220px; height:130px; transform:rotate(-8deg); }
.steel span { position:absolute; right:0; width:215px; height:14px; border:3px solid #abb5ae; background:repeating-linear-gradient(90deg,#5d6963 0 8px,#c5ccc7 8px 11px); box-shadow:0 4px rgba(0,0,0,.25); }
.steel span:nth-child(2){top:24px;right:15px}.steel span:nth-child(3){top:48px}.steel span:nth-child(4){top:72px;right:24px}.steel span:nth-child(5){top:96px;right:8px}
.gravel { position:absolute; z-index:3; right:-12px; bottom:-24px; width:210px; height:120px; background-color:#a49a86; background-image:radial-gradient(#5f5b51 1.5px,transparent 2px),radial-gradient(#d1c5ad 2px,transparent 2.5px); background-position:0 0,7px 8px; background-size:15px 15px; clip-path:polygon(0 100%,20% 52%,52% 0,73% 32%,100% 100%); }
.stamp { position:absolute; z-index:6; top:57px; right:20px; width:110px; height:110px; display:grid; place-items:center; align-content:center; color:var(--yellow); border:2px solid var(--yellow); border-radius:50%; font:700 7px/1.5 "Roboto",Arial,sans-serif; letter-spacing:.08em; text-align:center; animation:spin 20s linear infinite; }
.stamp b { font:22px "Roboto",Arial,sans-serif; }
@keyframes spin { to { transform:rotate(360deg); } }
.orbit { position:absolute; border:1px dashed rgba(8,42,45,.35); border-radius:50%; animation:spin 22s linear infinite; }
.orbit::after { content:""; position:absolute; top:18%; left:5%; width:12px; height:12px; background:var(--yellow); border-radius:50%; }
.orbit-one{width:570px;height:570px}.orbit-two{width:680px;height:680px;animation-direction:reverse;animation-duration:30s}
.art-note { position:absolute; z-index:8; display:flex; align-items:center; gap:10px; margin:0; padding:9px 13px; color:white; background:var(--deep); box-shadow:4px 4px rgba(8,42,45,.2); font-size:9px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.art-note b { width:26px; height:26px; display:grid; place-items:center; color:var(--deep); background:var(--yellow); font:9px "Roboto",Arial,sans-serif; }
.note-one{top:27%;left:4%;transform:rotate(-5deg)}.note-two{right:3%;bottom:14%;transform:rotate(3deg)}

.ticker { overflow:hidden; color:var(--deep); background:var(--yellow); border-block:2px solid var(--deep); transform:rotate(-1deg) scale(1.02); }
.ticker div { width:max-content; display:flex; align-items:center; gap:26px; padding:15px 0; animation:marquee 24s linear infinite; }
.ticker span { font-size:15px; font-weight:900; letter-spacing:.1em; }.ticker b{color:var(--orange)}
@keyframes marquee{to{transform:translateX(-50%)}}

.about { display:grid; grid-template-columns:210px 1fr; gap:7vw; padding-block:150px; }
.section-label { height:fit-content; display:flex; align-items:center; gap:14px; padding-top:7px; border-top:2px solid var(--ink); font-size:9px; font-weight:800; letter-spacing:.14em; }
.section-label b { color:var(--orange); font:11px "Roboto",Arial,sans-serif; }.section-label.light{border-color:rgba(255,255,255,.5)}
h2 { font-size:clamp(45px,5vw,79px); } h2 em { color:var(--orange); font-style:normal; }
.about-copy { max-width:900px; }
.about-text { display:grid; grid-template-columns:1fr 1fr; gap:50px; margin-top:50px; }
.about-text p { margin:0; padding-left:20px; color:rgba(16,50,53,.68); border-left:2px solid var(--orange); font-size:14px; line-height:1.85; }

.products { padding-block:130px 140px; color:var(--white); background:var(--deep); }
.product-head { display:grid; grid-template-columns:210px 1fr; gap:7vw; margin-bottom:60px; }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.14); }
.product-card { min-height:455px; display:flex; flex-direction:column; padding:24px; background:#0d3033; transition:.3s; }
.product-card:hover { position:relative; z-index:2; background:#123b3e; transform:translateY(-7px); }
.product-visual { height:190px; position:relative; display:grid; place-items:center; margin-bottom:24px; overflow:hidden; color:var(--deep); background:#e6dfd2; background-image:linear-gradient(rgba(8,42,45,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(8,42,45,.15) 1px,transparent 1px); background-size:25px 25px; }
.product-visual b { position:relative; z-index:3; font-size:58px; letter-spacing:-.1em; transition:.3s; }.product-card:hover .product-visual b{transform:scale(1.08) rotate(-3deg)}
.product-visual i { position:absolute; display:block; width:75px; height:16px; left:8%; top:18%; background:var(--orange); transform:rotate(-10deg); }
.product-visual i:last-child { width:55px; height:55px; left:auto; top:auto; right:8%; bottom:10%; background:transparent; border:8px solid var(--yellow); border-radius:50%; }
.steel-card{background-color:#bfc7c1}.steel-card i{width:150px;height:9px;background:#52615b;box-shadow:0 15px #7c8a84,0 30px #43514c}.steel-card i:last-child{box-shadow:none;border-color:var(--orange);background:transparent}
.brick-card{background-color:#d9785a}.brick-card i:last-child{border-color:var(--deep)}
.sand-card{background-color:#d5b96c}.pipe-card{background-color:#9db7ae}.pipe-card i{width:145px;height:58px;background:transparent;border:15px solid var(--deep);border-radius:50%}.finish-card i{width:65px;height:105px;top:45px;transform:rotate(-6deg)}
.product-card small { color:var(--yellow); font:8px "Roboto",Arial,sans-serif; letter-spacing:.1em; }
.product-card h3 { margin:9px 0 10px; font-size:25px; }.product-card p{flex:1;margin:0;color:rgba(255,255,255,.52);font-size:12px;line-height:1.7}
.product-card a{width:fit-content;display:flex;gap:13px;margin-top:22px;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.4);font-size:10px;font-weight:800;text-transform:uppercase}.product-card a span{color:var(--orange);font-size:16px}

.commitment { display:grid; grid-template-columns:.88fr 1.12fr; gap:8vw; align-items:center; padding-block:145px; }
.commitment-art { aspect-ratio:.9; position:relative; overflow:hidden; color:white; background:var(--orange); box-shadow:13px 13px var(--yellow); }
.giant-number { position:absolute; top:-75px; right:-5px; color:rgba(8,42,45,.17); font-size:280px; line-height:1; letter-spacing:-.12em; }
.commitment-art > span { position:absolute; top:25px; left:25px; font:700 9px/1.4 "Roboto",Arial,sans-serif; letter-spacing:.12em; }
.commitment-art > h3 { position:absolute; z-index:3; bottom:22px; left:27px; margin:0; font-size:clamp(24px,3vw,41px); line-height:.9; letter-spacing:-.06em; }
.pillars { position:absolute; inset:23% 8% 17%; }.pillars i{position:absolute;bottom:18%;width:18%;background:var(--deep);border-top:11px solid var(--yellow)}.pillars i:nth-child(1){left:5%;height:38%}.pillars i:nth-child(2){left:36%;height:60%}.pillars i:nth-child(3){right:7%;height:82%}.pillars b{position:absolute;left:0;right:0;bottom:11%;height:29px;background:var(--deep);transform:skewX(-15deg)}
.commitment-copy h2{font-size:clamp(42px,4.5vw,70px)}
.values{margin-top:45px;border-top:1px solid var(--line)}.values article{display:grid;grid-template-columns:45px 1fr 1.4fr;gap:14px;padding:22px 0;border-bottom:1px solid var(--line)}.values b{color:var(--orange);font:10px "Roboto",Arial,sans-serif}.values h3,.values p{margin:0}.values h3{font-size:16px}.values p{color:rgba(16,50,53,.62);font-size:12px;line-height:1.65}

.process{padding-block:135px;background:var(--paper-dark);border-top:1px solid var(--line)}
.process-head{display:flex;align-items:end;justify-content:space-between;gap:35px}.process-head>p{max-width:300px;margin:0;color:rgba(16,50,53,.62);font-size:13px;line-height:1.7}
.steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:70px;border-top:2px solid var(--ink)}.steps article{min-height:270px;padding:27px 25px;border-right:1px solid var(--line)}.steps article:first-child{border-left:1px solid var(--line)}.steps article>b{color:var(--orange);font:10px "Roboto",Arial,sans-serif}.steps article>i{width:65px;height:65px;display:grid;place-items:center;margin:25px 0;border:1px solid var(--ink);border-radius:50%;font:30px normal;transition:.25s}.steps article:hover>i{background:var(--yellow);transform:rotate(45deg)}.steps h3{margin:0 0 11px;font-size:20px}.steps p{margin:0;color:rgba(16,50,53,.6);font-size:12px;line-height:1.65}

.contact{padding-block:125px;color:var(--deep);background-color:var(--orange);background-image:linear-gradient(rgba(8,42,45,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(8,42,45,.08) 1px,transparent 1px);background-size:42px 42px}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:9vw;align-items:center}.contact h2{font-size:clamp(50px,5.5vw,85px)}.contact h2 em{color:var(--white)}
.contact-copy>p:not(.eyebrow){max-width:500px;margin:30px 0 0;font-size:14px;line-height:1.75}.contact-copy>div{display:flex;flex-wrap:wrap;gap:12px 20px;margin-top:27px;font-size:10px;font-weight:800;text-transform:uppercase}.contact-copy>div span::first-letter{color:white}
.contact-card{min-height:535px;padding:31px;color:var(--ink);background:var(--white);border:2px solid var(--deep);box-shadow:11px 11px var(--yellow),13px 13px var(--deep)}
.contact-card>header{display:flex;justify-content:space-between;margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid var(--ink);font:700 10px "Roboto",Arial,sans-serif;letter-spacing:.11em}.contact-card>header span{color:var(--orange)}
.contact-list{border-top:1px solid rgba(16,50,53,.18)}
.contact-item{min-height:165px;display:grid;grid-template-columns:46px 1fr 35px;gap:18px;align-items:center;padding:24px 2px;border-bottom:1px solid rgba(16,50,53,.2);transition:background .25s,padding .25s}
.contact-item:hover{padding-inline:12px;background:rgba(242,201,76,.16)}
.contact-number{align-self:start;padding-top:4px;color:var(--orange);font:700 10px "Roboto",Arial,sans-serif}
.contact-item small{display:block;margin-bottom:12px;font:700 9px "Roboto",Arial,sans-serif;letter-spacing:.12em}
.contact-item strong{display:block;font-size:clamp(25px,2.7vw,40px);line-height:1.05;letter-spacing:-.055em}
.contact-item p{margin:11px 0 0;color:rgba(16,50,53,.55);font-size:11px;line-height:1.55}
.contact-arrow{width:34px;height:34px;display:grid;place-items:center;align-self:center;color:white;background:var(--deep);font-size:18px;transition:transform .25s,background .25s}
.contact-item:hover .contact-arrow{background:var(--orange);transform:rotate(45deg)}
.contact-card-note{display:flex;align-items:center;justify-content:center;gap:14px;padding-top:27px;color:rgba(16,50,53,.55);font:700 8px "Roboto",Arial,sans-serif;letter-spacing:.14em}
.contact-card-note i{width:36px;height:1px;background:rgba(16,50,53,.3)}

.footer{color:var(--white);background:var(--deep)}.footer-main{min-height:210px;display:grid;grid-template-columns:1fr 1fr;align-items:center;border-bottom:1px solid rgba(255,255,255,.12)}.footer-brand{display:flex;align-items:center;gap:19px}.footer-brand .brand-mark{width:66px;height:66px}.footer-brand strong{font-size:20px;letter-spacing:.04em}.footer-brand p{margin:6px 0 0;color:rgba(255,255,255,.5);font-size:11px}.footer-links{display:flex;justify-content:flex-end;gap:25px;color:rgba(255,255,255,.6);font-size:11px}.footer-links a:hover{color:var(--yellow)}.footer-bottom{min-height:72px;display:flex;align-items:center;justify-content:space-between;color:rgba(255,255,255,.35);font:8px "Roboto",Arial,sans-serif;letter-spacing:.05em}.footer-bottom a{color:white;font-weight:700}

.floating-contact{position:fixed;z-index:45;right:19px;top:80%;display:flex;flex-direction:column;gap:14px;transform:translateY(-50%)}
.floating-button{width:60px;height:60px;position:relative;display:grid;place-items:center;color:white;border:0;border-radius:50%;box-shadow:0 0 10px 2px var(--glow),0 5px 12px rgba(8,42,45,.3);transition:transform .2s;animation:contact-glow 2.2s ease-in-out infinite}
.floating-button::before{content:"";position:absolute;inset:-4px;border-radius:50%;box-shadow:0 0 0 0 var(--glow);animation:contact-ring 2.2s ease-out infinite;pointer-events:none}
.floating-button:hover,.floating-button:focus-visible{transform:translateX(-4px) scale(1.04);outline:none}
.floating-button>img{display:block;object-fit:contain;animation:icon-wiggle 2.8s ease-in-out infinite;transform-origin:center;user-select:none;pointer-events:none}
.map-button{--glow:rgba(241,61,67,.72);background:#f13d43}.zalo-button{--glow:rgba(20,104,236,.74);background:#fff;animation-delay:.18s}.phone-button{--glow:rgba(239,52,59,.74);background:#ef343b;animation-delay:.36s}
.zalo-button::before{animation-delay:.18s}.phone-button::before{animation-delay:.36s}.zalo-button>img{animation-delay:.22s}.phone-button>img{animation-delay:.44s}
.map-button>img{width:21px;height:30px}.zalo-button>img{width:49px;height:49px;border-radius:15px}.phone-button>img{width:24px;height:24px}
@keyframes contact-glow{0%,100%{box-shadow:0 0 8px 2px var(--glow),0 5px 12px rgba(8,42,45,.3)}50%{box-shadow:0 0 22px 7px var(--glow),0 7px 17px rgba(8,42,45,.34)}}
@keyframes contact-ring{0%{opacity:.7;box-shadow:0 0 0 0 var(--glow)}70%,100%{opacity:0;box-shadow:0 0 0 10px var(--glow)}}
@keyframes icon-wiggle{0%,72%,100%{transform:rotate(0)}76%{transform:rotate(-9deg)}80%{transform:rotate(9deg)}84%{transform:rotate(-6deg)}88%{transform:rotate(6deg)}92%{transform:rotate(0)}}

.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}

@media(max-width:1050px){.shell{width:calc(100% - 56px)}.header{padding-inline:28px}.hero{grid-template-columns:55% 45%}.hero-copy{padding-left:35px}.blueprint{width:40vw}.product-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){
  .header{min-height:72px}.brand small{display:none}.menu{width:42px;height:42px;position:relative;z-index:3;display:block;background:transparent;border:1px solid rgba(255,255,255,.25)}.menu span{position:absolute;left:10px;width:20px;height:2px;background:white;transition:.25s}.menu span:first-child{top:15px}.menu span:last-child{top:23px}.menu.open span:first-child{top:19px;transform:rotate(45deg)}.menu.open span:last-child{top:19px;transform:rotate(-45deg)}
  .nav{position:fixed;inset:0;flex-direction:column;align-items:flex-start;justify-content:center;gap:26px;padding:80px 10vw;background:var(--deep);transform:translateY(-100%);opacity:0;pointer-events:none;transition:.3s}.nav.open{transform:none;opacity:1;pointer-events:auto}.nav a{font-size:27px}.nav-cta{margin-top:10px}
  .hero{grid-template-columns:1fr}.hero-copy{min-height:720px;padding:135px 28px 70px}.hero-art{min-height:680px;padding:80px 28px;clip-path:polygon(0 7%,100% 0,100% 100%,0 100%)}.blueprint{width:min(500px,82vw)}
  .about{grid-template-columns:1fr;gap:45px;padding-block:105px}.section-label{width:190px}.products{padding-block:105px}.product-head{grid-template-columns:1fr;gap:40px}.commitment{grid-template-columns:1fr;padding-block:105px}.commitment-art{width:min(550px,100%)}.steps{grid-template-columns:repeat(2,1fr)}.process{padding-block:105px}.contact-grid{grid-template-columns:1fr;gap:55px}.contact{padding-block:95px}.footer-main{grid-template-columns:1fr;gap:35px;padding-block:50px}.footer-links{justify-content:flex-start}
}
@media(max-width:540px){
  .shell{width:calc(100% - 34px)}.header{padding-inline:17px}.brand strong{font-size:12px}.hero-copy{min-height:670px;padding-inline:17px}.hero h1{font-size:57px}.hero-actions{width:100%;flex-direction:column;align-items:flex-start}.button{width:100%;justify-content:space-between}.hero-stats{grid-template-columns:1fr 1fr;gap:20px}.hero-stats div:nth-child(2){border:0}.hero-stats div:last-child{padding-left:0}.hero-art{min-height:590px}.blueprint{width:92vw}.cement{width:140px;height:200px}.bricks{left:12px;width:135px}.bricks span{height:38px}.steel{right:-95px}.stamp{width:86px;height:86px;right:11px}.about,.products,.commitment,.process{padding-block:85px}h2,.commitment-copy h2{font-size:42px}.about-text{grid-template-columns:1fr;gap:23px;margin-top:36px}.product-grid{grid-template-columns:1fr}.product-card{min-height:430px}.values article{grid-template-columns:35px 1fr}.values p{grid-column:2}.process-head{align-items:flex-start;flex-direction:column}.steps{grid-template-columns:1fr}.steps article{min-height:235px;border-left:1px solid var(--line)}.contact{padding-block:75px}.contact-grid{width:calc(100% - 26px)}.contact-card{min-height:auto;padding:23px 19px;box-shadow:7px 7px var(--yellow),9px 9px var(--deep)}.contact-item{grid-template-columns:30px 1fr 30px;gap:10px}.contact-item strong{font-size:25px}.contact-arrow{width:30px;height:30px}.footer-links{display:grid;grid-template-columns:1fr 1fr}.footer-bottom{flex-direction:column;align-items:flex-start;justify-content:center;gap:10px}.floating-contact{right:8px;top:56%;bottom:auto;flex-direction:column;gap:9px;transform:translateY(-50%)}.floating-button{width:54px;height:54px}.floating-button:hover,.floating-button:focus-visible{transform:translateX(-3px)}.map-button>img{width:18px;height:26px}.zalo-button>img{width:43px;height:43px;border-radius:13px}.phone-button>img{width:21px;height:21px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}