/* Astra — noithat2 "Mộc An" dựng Y HỆT mockup (2026-09-27). Tiền tố ntm-. */
@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600&family=Playfair+Display:wght@400;500;600&display=swap");
:root { --ntm-gold:#A8814A; --ntm-gold2:#B89060; --ntm-cream:#F6F2EB; --ntm-ink:#2B231D; --ntm-text:#5A5048; --ntm-line:#E6DCCB; }
body, p, a, li, input, select, textarea, button, .nav > li > a { font-family: "Be Vietnam Pro", Arial, sans-serif !important; }
h1, h2, h3, .heading-font, .ntm-h2, .ntm-h3 { font-family: "Playfair Display", Georgia, serif !important; }
body { background: var(--ntm-cream); color: var(--ntm-ink); }

/* Header */
#header .header-main { background: #F8F5EF !important; height: 74px; box-shadow: 0 1px 0 var(--ntm-line); }
#header .header-main .nav > li > a { font-size: 14px !important; font-weight: 400 !important; color: #3A302A !important; text-transform: none !important; letter-spacing: 0 !important; }
#header .header-main .nav > li { margin: 0 14px !important; }
#header .header-main .nav > li.active > a { color: var(--ntm-gold) !important; }
#header #logo { width: 220px !important; }
#header #logo a { display: flex; align-items: center; gap: 12px; font-family: "Playfair Display", serif !important; font-size: 24px; color: #2B231D !important; text-transform: uppercase; letter-spacing: .04em; position: relative; top: -5px; }
#header #logo a::before { content: ""; width: 46px; height: 46px; background: url(icons/logo-gold.png) center/contain no-repeat; flex: 0 0 46px; }
#header #logo a::after { content: "NỘI THẤT GỖ ÓC CHÓ CAO CẤP"; position: absolute; left: 58px; top: 50%; margin-top: 12px; font-size: 7.5px; letter-spacing: .12em; color: #6E6259; font-family: "Be Vietnam Pro", sans-serif; }
#header .header-button-1 .button { border: 1px solid var(--ntm-gold) !important; background: transparent !important; color: #3A302A !important; border-radius: 2px !important; text-transform: none !important; font-weight: 500 !important; letter-spacing: 0 !important; padding: 0 20px !important; min-height: 40px; line-height: 38px; font-size: 14px !important; }
#header .header-button-1 .button::before { content: ""; display: inline-block; width: 16px; height: 16px; margin: 0 10px -3px 0; background: url(icons/phone.png) center/contain no-repeat; }

/* Chung */
.ntm-sec p { color: var(--ntm-text); font-size: 15px; line-height: 1.65; }
.ntm-sec .col { padding-bottom: 0; }
.ntm-head { padding-bottom: 18px !important; }
.ntm-right .col-inner { text-align: right; }
.ntm-eyebrow { color: var(--ntm-gold) !important; font-size: 13px !important; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; margin: 0 0 6px !important; }
.ntm-line { display: flex; align-items: center; gap: 22px; }
.ntm-line::after { content: ""; width: 60px; height: 1px; background: var(--ntm-gold2); }
.ntm-h2 { font-size: 40px !important; font-weight: 400 !important; color: var(--ntm-ink) !important; line-height: 1.2 !important; margin: 0 0 6px !important; }
.ntm-h3 { font-size: 26px !important; font-weight: 400 !important; color: var(--ntm-ink) !important; margin: 16px 0 6px !important; }
.ntm-btn { display: inline-flex; align-items: center; gap: 12px; padding: 0 26px; height: 46px; font-size: 14px; font-weight: 500; border-radius: 2px; }
.ntm-btn-gold { background: #A8814A; color: #fff !important; }
.ntm-btn-line { border: 1px solid rgba(255,255,255,.85); color: #fff !important; margin-left: 14px; }
.ntm-link a, .ntm-more a { color: var(--ntm-gold) !important; font-size: 14px; border-bottom: 1px solid var(--ntm-gold2); padding-bottom: 2px; }
.ntm-link span, .ntm-more span { margin-left: 10px; }
.ntm-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); margin: 0 !important; pointer-events: none; }
.ntm-play img { width: 60px; height: 60px; }

/* Hero */
.ntm-hero .banner-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(20,14,10,.78) 0%,rgba(20,14,10,.45) 40%,rgba(20,14,10,.05) 70%); }
.ntm-kicker { color: #E9DCC6 !important; font-size: 15px !important; letter-spacing: .2em; text-transform: uppercase; margin: 0 0 10px !important; }
.ntm-hero-title { color: #fff !important; font-size: 64px !important; font-weight: 400 !important; line-height: 1.12 !important; margin: 0 0 16px !important; }
.ntm-hero-lead { color: #fff !important; font-size: 17px !important; margin: 0 0 26px !important; }
.ntm-hero-btns { margin: 0 0 40px !important; }
.ntm-hero-pager { color: rgba(255,255,255,.7) !important; font-size: 13px !important; display: flex; align-items: center; gap: 10px; margin: 0 !important; }
.ntm-hero-pager span { color: #fff; }
.ntm-hero-pager i { display: inline-block; width: 100px; height: 1px; background: rgba(255,255,255,.4); position: relative; } .ntm-hero-pager i::before { content: ""; position: absolute; left: 0; top: -1px; width: 34px; height: 3px; background: #fff; }
.ntm-hero-pager b { font-weight: 400; color: #fff; margin-left: 8px; }
.ntm-hero-note p { color: rgba(255,255,255,.75) !important; font-size: 11px !important; letter-spacing: .2em; text-transform: uppercase; line-height: 1.6 !important; }

/* Giải pháp */
.ntm-sol-card .col-inner { background: #fff; border: 1px solid var(--ntm-line); padding: 0 0 20px; }
.ntm-sol-card .img { margin-bottom: 0 !important; }
.ntm-sol-card h3, .ntm-sol-card p { padding: 0 24px; }
.ntm-sol-card p { font-size: 14px !important; margin-bottom: 10px !important; }

/* Showroom + xưởng */
.ntm-show-text .col-inner { padding-right: 20px; }
.ntm-addr { display: flex; gap: 10px; align-items: center; color: var(--ntm-text) !important; margin: 18px 0 22px !important; }
.ntm-addr img { width: 18px; height: 18px; }
.ntm-show-media .col-inner, .ntm-work-media .col-inner, .ntm-vid .col-inner { position: relative; }
.ntm-note-line { font-size: 12px !important; color: #7A6E64 !important; border-bottom: 1px solid var(--ntm-gold2); display: inline-block; padding: 0 0 6px 40px; margin: 0 0 8px !important; }
.ntm-work-media { padding-bottom: 20px !important; }
.ntm-feat .col-inner { border-left: 1px solid var(--ntm-line); padding-left: 26px; }
.ntm-feat:first-of-type .col-inner, .ntm-work .ntm-feat:nth-child(4) .col-inner { border-left: 0; padding-left: 0; }
.ntm-feat-row { display: flex; gap: 18px; align-items: flex-start; margin: 0 !important; font-size: 13px !important; color: #7A6E64 !important; line-height: 1.5 !important; }
.ntm-feat-row img { width: 34px; height: 34px; }
.ntm-feat-row strong { display: block; font-family: "Playfair Display", serif; font-size: 17px; font-weight: 500; color: var(--ntm-ink); margin-bottom: 4px; }

/* Dự án */
.ntm-tabs { display: flex; gap: 12px; margin: 8px 0 0 !important; }
.ntm-tabs a { font-size: 13px; padding: 5px 26px; background: #F3EEE6; color: #3A302A; border-radius: 2px; }
.ntm-tabs a.is-active { background: var(--ntm-gold); color: #fff; }
.ntm-mosaic { display: grid; grid-template-columns: 1.55fr 1fr 1fr 1fr; grid-template-rows: 225px 225px; gap: 10px; }
.ntm-tile { position: relative; background-size: cover; background-position: center; border-radius: 2px; overflow: hidden; display: block; }
.ntm-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,0) 45%); }
.ntm-tile span { position: absolute; left: 18px; bottom: 14px; z-index: 2; color: rgba(255,255,255,.85); font-size: 12px; line-height: 1.4; }
.ntm-tile strong { display: block; font-family: "Playfair Display", serif; font-size: 18px; font-weight: 500; color: #fff; }
.ntm-tile-big { grid-row: 1 / span 2; }
.ntm-tile-w:nth-child(2) { grid-column: 2 / span 2; }
.ntm-tile-w:nth-child(3) { grid-column: 4; }

/* Video */
.ntm-dur { position: absolute; right: 12px; top: 12px; background: rgba(0,0,0,.6); color: #fff !important; font-size: 12px !important; padding: 2px 8px; margin: 0 !important; }
.ntm-vid .img { margin-bottom: 12px !important; }
.ntm-vid-title { font-family: "Be Vietnam Pro", sans-serif !important; font-size: 17px !important; font-weight: 500 !important; color: var(--ntm-ink) !important; }

/* Báo chí */
.ntm-press-title { font-size: 26px !important; font-weight: 400 !important; color: #3A302A !important; margin: 0 0 12px !important; }
.ntm-press-logos { display: flex; justify-content: space-around; align-items: center; margin: 0 !important; }
.ntm-press-logos img { height: 48px; width: auto; filter: grayscale(1) contrast(1.1); opacity: .8; }

/* Blog */
.ntm-blog-list .col-inner { background: none; }
.ntm-blog-list .box-text { padding: 12px 0 0 !important; }
.ntm-blog-list .post-meta { color: #7A6E64; font-size: 12px !important; opacity: 1 !important; }
.ntm-blog-list .post-title { font-family: "Playfair Display", serif; font-size: 19px !important; font-weight: 500; color: var(--ntm-ink); line-height: 1.3; }
.ntm-blog-list .from_the_blog_excerpt { color: #7A6E64; font-size: 13.5px; }
.ntm-blog-list .is-divider, .ntm-blog-list .badge { display: none !important; }

/* CTA + footer */
.ntm-cta { background: #2B231D !important; border-bottom: 1px solid rgba(255,255,255,.1); }
.ntm-cta-title { font-family: "Playfair Display", serif !important; color: #F3EBDD !important; font-size: 30px !important; font-weight: 400 !important; margin: 0 !important; }
.ntm-cta-sub { color: rgba(255,255,255,.7) !important; margin: 0 !important; }
.ntm-footer p, .ntm-footer li { color: rgba(255,255,255,.72) !important; font-size: 14px !important; }
.ntm-footer a { color: rgba(255,255,255,.75) !important; }
.ntm-footer p.ntm-ft-logo, .ntm-ft-logo { display: flex; gap: 14px; align-items: center; font-family: "Playfair Display", serif; font-size: 26px !important; color: #F3EBDD !important; text-transform: uppercase; letter-spacing: .06em; margin: 0 0 10px !important; }
.ntm-ft-logo img { width: 54px; height: 54px; }
.ntm-ft-list, .ntm-ft-links { list-style: none; margin: 0 !important; }
.ntm-ft-list li { list-style: none; display: flex; gap: 12px; align-items: center; margin: 0 0 8px !important; }
.ntm-ft-list img { width: 18px; height: 18px; }
.ntm-ft-col .col-inner { border-left: 1px solid rgba(255,255,255,.12); padding-left: 24px; }
.ntm-ft-title { font-family: "Be Vietnam Pro", sans-serif !important; color: #D9B77E !important; font-size: 15px !important; font-weight: 500 !important; margin: 0 0 12px !important; }
.ntm-ft-links li { list-style: none; border-bottom: 1px solid rgba(255,255,255,.08); padding: 6px 0; margin: 0 !important; }
.ntm-ft-social { display: flex; gap: 10px; }
.ntm-ft-social img { width: 30px; height: 30px; }
.ntm-ft-motto { color: #C9A76E !important; font-size: 11px !important; letter-spacing: .2em; text-transform: uppercase; border-top: 1px solid rgba(255,255,255,.12); padding-top: 16px; margin-top: 20px !important; }
.ntm-ft-copy { border-top: 1px solid rgba(255,255,255,.1); padding-top: 14px !important; margin-top: 14px; }
.ntm-ft-copy p { font-size: 12.5px !important; margin: 0 !important; }
.ntm-ft-copy span { margin: 0 8px; }
#footer .absolute-footer { display: none; }

@media (max-width: 849px) {
  .ntm-hero-title { font-size: 40px !important; } .ntm-h2 { font-size: 28px !important; }
  .ntm-btn-line { margin: 10px 0 0; } .ntm-hero-pager, .ntm-hero-note { display: none !important; }
  .ntm-right .col-inner { text-align: left; }
  .ntm-mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: auto; } .ntm-mosaic .ntm-tile { height: 170px; grid-column: auto !important; grid-row: auto !important; } .ntm-tile-big { grid-column: 1 / span 2 !important; height: 240px !important; }
  .ntm-feat .col-inner, .ntm-ft-col .col-inner { border: 0; padding-left: 0; } .ntm-feat { padding-bottom: 14px !important; }
  .ntm-press-logos { flex-wrap: wrap; gap: 20px; } .ntm-press-logos img { height: 34px; }
}
/* r3 fix: wpautop chèn <br> vào lưới dự án */
.ntm-mosaic > br, .ntm-mosaic br { display: none !important; }
/* ruler:auto BEGIN — tools/astra-bridge/lab/ruler_fix.py, đừng sửa tay */
@media (min-width: 850px) {
  .ntm-cta h2.ntm-cta-title { font-size: 39.6px !important; }
  .ntm-diff-text h2.ntm-h2 { font-size: 49.2px !important; }
  .ntm-ft-col h3.ntm-ft-title { font-size: 18.4px !important; }
  .ntm-head h2.ntm-h2 { font-size: 48.0px !important; }
  .ntm-hero-box h1.ntm-hero-title { font-size: 80.6px !important; }
  .ntm-hero-box h1.ntm-ititle { font-size: 62.4px !important; }
  .ntm-plan h3 { font-size: 29.9px !important; }
  .ntm-sol-card h3.ntm-h3 { font-size: 35.4px !important; }
  .ntm-vid h3.ntm-vid-title { font-size: 21.1px !important; }
  .ntm-addr img[src*="/icons/pin.png"] { width: 44px !important; height: 44px !important; max-width: none !important; flex: 0 0 auto !important; object-fit: contain; }
  .ntm-diff-grid img { width: 76px !important; height: 76px !important; max-width: none !important; flex: 0 0 auto !important; object-fit: contain; }
  .ntm-feat-row img { width: 76px !important; height: 76px !important; max-width: none !important; flex: 0 0 auto !important; object-fit: contain; }
  .ntm-ft-social img { width: 58px !important; height: 58px !important; max-width: none !important; flex: 0 0 auto !important; object-fit: contain; }
  .ntm-play img[src*="/icons/play.png"] { width: 120px !important; height: 120px !important; max-width: none !important; flex: 0 0 auto !important; object-fit: contain; }
}
@media (max-width: 849px) {
  .ntm-addr img[src*="/icons/pin.png"] { width: 30px !important; height: 30px !important; }
  .ntm-diff-grid img { width: 54px !important; height: 54px !important; }
  .ntm-feat-row img { width: 54px !important; height: 54px !important; }
  .ntm-ft-social img { width: 40px !important; height: 40px !important; }
  .ntm-play img[src*="/icons/play.png"] { width: 84px !important; height: 84px !important; }
}
/* ruler:auto END */
/* header r4 — cỡ theo mockup */
@media (min-width: 850px) {
  #header #logo { width: 270px !important; }
  #header #logo a { font-size: 30px !important; }
  #header #logo a::before { width: 60px !important; height: 60px !important; flex: 0 0 60px !important; }
  #header #logo a::after { left: 72px !important; font-size: 9px !important; margin-top: 15px !important; }
  #header .header-button-1 .button { font-size: 16px !important; min-height: 46px !important; line-height: 46px !important; padding: 0 26px !important; }
  #header .header-button-1 .button::before { width: 20px !important; height: 20px !important; margin-bottom: -4px !important; }
}
/* ruler:manual — chỉnh sau khi xem review, 09-28 */
@media (min-width: 850px) {
  .ntm-hero-box h1.ntm-hero-title { font-size: 70px !important; }
  .ntm-sol-card h3.ntm-h3 { font-size: 28px !important; }
  .ntm-addr img[src*="/icons/pin.png"] { width: 28px !important; height: 28px !important; }
  .ntm-diff-grid img { width: 36px !important; height: 36px !important; }
  .ntm-feat-row img { width: 40px !important; height: 40px !important; }
  .ntm-ft-social img { width: 34px !important; height: 34px !important; }
  .ntm-play img[src*="/icons/play.png"] { width: 72px !important; height: 72px !important; }
}

/* 2026-10-04: bỏ dải "Báo chí nói về chúng tôi" (logo 24h/Zing/CafeBiz/VTV thật, mờ, ngụ ý được báo chí đưa tin) -> 4 cam kết trung tính */
.ntm-trust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 10px; }
.ntm-trust > div { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 8px 18px; border-left: 1px solid #DCCFBE; }
.ntm-trust > div:first-child { border-left: 0; }
.ntm-trust img { width: 44px; height: 44px; margin-bottom: 4px; }
.ntm-trust b { font-family: "Playfair Display", serif; font-size: 18px; font-weight: 500; color: #2B231D; }
.ntm-trust span { font-size: 13.5px; color: #6E6258; }
@media (max-width: 849px) { .ntm-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; } .ntm-trust > div:nth-child(3) { border-left: 0; } }
/* 2026-10-04: ô video có 2 nút play (Flatsome tự thêm .overlay-icon cho ux_image link YouTube + nút .ntm-play của mình) -> giữ nút của mình */
.ntm-sec .open-video .overlay-icon, .ntm-sec .img .overlay-icon { display: none !important; }
/* 2026-10-04: khẩu hiệu chân trang ngắt "GIÁ / TRỊ" giữa từ ở cột hẹp -> mỗi vế một dòng, giãn chữ nhỏ hơn */
.ntm-footer p.ntm-ft-motto { letter-spacing: .08em !important; font-size: 11.5px !important; line-height: 1.8 !important; white-space: nowrap; }
@media (max-width: 1199px) { .ntm-footer p.ntm-ft-motto { white-space: normal; } }
/* 2026-10-04 mid-fix 850-1199: menu rớt 2 hàng + nút SĐT tràn phải 35-59px ở 900-1024 */
@media (min-width: 850px) and (max-width: 1199px) {
  #header #logo { width: 200px !important; } #header #logo a { font-size: 21px !important; }
  #header .header-main .header-nav-main > li { margin: 0 7px !important; } #header .header-main .header-nav-main > li > a { font-size: 14px !important; white-space: nowrap; padding-left: 0 !important; padding-right: 0 !important; }
  #header .header-main .header-nav-main { flex-wrap: nowrap !important; }
  #header .header-button-1 .button { padding: 0 12px !important; font-size: 0 !important; } #header .header-button-1 .button::before { margin: 0 !important; }
}
.ntm-ft-social { flex-wrap: wrap; } /* 2026-10-04: icon MXH thứ 5 tràn ra ngoài ở 900-1024 */
/* 2026-10-04: ruler phóng riêng icon pin chân trang 44/30/26px (lệch nhóm phone/mail 18px) -> bỏ, cả nhóm 18px; khẩu hiệu logo ::after chạm chữ ở 390 */
@media (max-width: 849px) { #header #logo a::after { margin-top: 15px !important; } }