/* Trang GPT Nội Thất — Hoàn Thiện Nội Thất Trọn Gói (10/11/2026). Dùng chung style.css + trang-phu.css */
.nt-hero{position:relative; background:var(--hero); color:var(--hero-ink); overflow:hidden}
.nt-hero::before{content:""; position:absolute; inset:0; background:radial-gradient(80% 90% at 85% 10%,rgba(142,27,46,.55),transparent 60%),radial-gradient(60% 70% at 0% 100%,rgba(216,174,85,.16),transparent 60%)}
.nt-hero .wrap{position:relative; display:grid; grid-template-columns:1.02fr 1fr; gap:clamp(28px,5vw,64px); align-items:center; padding-top:clamp(36px,6vw,84px); padding-bottom:clamp(44px,7vw,96px)}
.nt-hero .tp-vet{padding:0 0 18px; color:var(--hero-soft)} .nt-hero .tp-vet a{color:var(--hero-soft)}
.nt-tag{display:inline-flex; gap:8px; align-items:center; font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-2)}
.nt-tag::before{content:""; width:28px; height:1px; background:var(--gold-2)}
.nt-hero h1{font-size:clamp(34px,5.4vw,62px); line-height:1.06; font-weight:800; margin-top:16px; letter-spacing:-.01em}
.nt-hero h1 em{font-style:normal; color:var(--gold-2); display:block}
.nt-hero .lead{font-size:clamp(16px,1.9vw,18.5px); color:var(--hero-soft); margin-top:18px; max-width:54ch}
.nt-hero .btn-ghost{border-color:rgba(255,255,255,.3); color:#fff}
.nt-cam{display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:28px; padding-top:22px; border-top:1px solid rgba(255,255,255,.12); font-size:14.5px; color:var(--hero-soft)}
.nt-cam span{display:flex; gap:8px; align-items:center} .nt-cam span::before{content:"✓"; color:var(--gold-2); font-weight:800}
.nt-ghep{display:grid; grid-template-columns:1.25fr 1fr; grid-template-rows:1fr 1fr; gap:12px; aspect-ratio:1/1.02}
.nt-ghep a{position:relative; border-radius:16px; overflow:hidden; background:#2a1a17; display:block}
.nt-ghep a:first-child{grid-row:1/3}
.nt-ghep img{width:100%; height:100%; object-fit:cover; transition:transform .7s ease}
.nt-ghep a:hover img{transform:scale(1.05)}
.nt-ghep small{position:absolute; left:10px; bottom:10px; background:rgba(15,8,7,.68); color:#fff; font-size:12px; padding:4px 10px; border-radius:999px}

.nt-sec{padding:clamp(52px,7vw,96px) 0}
.nt-sec.nen{background:var(--surface-2)}
.nt-dau{max-width:720px; margin-bottom:clamp(26px,3.5vw,40px)}
.nt-dau .nt-tag{color:var(--cherry)} .nt-dau .nt-tag::before{background:var(--cherry)}
.nt-dau h2{font-size:clamp(26px,3.6vw,40px); font-weight:800; line-height:1.15; margin-top:12px}
.nt-dau p{color:var(--ink-soft); margin-top:12px; font-size:clamp(15.5px,1.7vw,17px)}

/* trọn gói gồm gì */
.nt-goi{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.nt-o{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px; transition:border-color .2s,box-shadow .2s}
.nt-o:hover{border-color:var(--cherry-line); box-shadow:var(--shadow)}
.nt-o i{display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:var(--cherry-bg); color:var(--cherry); font-style:normal; font-weight:800; font-size:15px}
.nt-o h3{font-size:18px; margin-top:16px} .nt-o p{color:var(--ink-soft); font-size:15px; margin-top:6px}

/* phong cách */
.nt-pc{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.nt-pc a{position:relative; display:block; border-radius:18px; overflow:hidden; aspect-ratio:3/4; background:#222; color:#fff; text-decoration:none}
.nt-pc img{width:100%; height:100%; object-fit:cover; transition:transform .7s ease}
.nt-pc a:hover img{transform:scale(1.05)}
.nt-pc a::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(15,8,7,.9) 0%,rgba(15,8,7,.2) 48%,transparent 70%)}
.nt-pc .pc{position:absolute; left:0; right:0; bottom:0; padding:22px; z-index:1}
.nt-pc h3{font-size:clamp(20px,2.3vw,24px)} .nt-pc p{font-size:14.5px; color:rgba(255,255,255,.82); margin-top:6px}

/* thư viện ảnh */
.nt-loc{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px}
.nt-loc button{font:inherit; font-size:14.5px; font-weight:600; padding:9px 18px; border-radius:999px; border:1px solid var(--line); background:var(--surface); color:var(--ink-soft); cursor:pointer}
.nt-loc button.on{background:var(--cherry); border-color:var(--cherry); color:#fff}
.nt-anh{columns:3 260px; column-gap:12px}
.nt-anh a{display:block; break-inside:avoid; margin-bottom:12px; border-radius:12px; overflow:hidden; position:relative; background:var(--line-soft)}
.nt-anh img{width:100%; height:auto; display:block; transition:transform .5s ease}
.nt-anh a:hover img{transform:scale(1.04)}
.nt-anh a span{position:absolute; left:8px; bottom:8px; background:rgba(15,8,7,.66); color:#fff; font-size:12px; padding:3px 9px; border-radius:999px}
.nt-anh a[hidden]{display:none}
.nt-ghi{font-size:13.5px; color:var(--ink-faint); margin-top:6px}

/* quy trình */
.nt-buoc{display:grid; grid-template-columns:repeat(7,1fr); gap:10px; counter-reset:b; list-style:none; padding:0}
.nt-buoc li{counter-increment:b; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:18px 14px; position:relative}
.nt-buoc li::before{content:counter(b,decimal-leading-zero); display:block; font-size:26px; font-weight:800; color:var(--cherry); line-height:1}
.nt-buoc b{display:block; font-size:15.5px; margin-top:10px} .nt-buoc span{display:block; font-size:13.5px; color:var(--ink-soft); margin-top:4px}
.nt-buoc li::after{content:"📷 có ảnh"; display:inline-block; margin-top:10px; font-size:11.5px; font-weight:600; color:var(--gold); background:var(--gold-bg); border-radius:999px; padding:2px 8px}

/* bài đăng từ công trình */
.nt-bai{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.nt-the{background:var(--surface); border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column}
.nt-the .m{position:relative; aspect-ratio:4/3; overflow:hidden; background:#1d1210; display:block; cursor:pointer; border:0; padding:0; width:100%}
.nt-the .m img,.nt-the .m video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.nt-the .m .so{position:absolute; top:10px; right:10px; background:rgba(0,0,0,.6); color:#fff; font-size:12px; padding:3px 10px; border-radius:999px}
.nt-the .m .play{position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-size:46px; text-shadow:0 2px 14px rgba(0,0,0,.6); pointer-events:none}
.nt-the .nd{padding:18px 18px 20px; display:flex; flex-direction:column; gap:8px; flex:1}
.nt-the time{font-size:12.5px; font-weight:700; color:var(--gold); letter-spacing:.06em; text-transform:uppercase}
.nt-the h3{font-size:17.5px; line-height:1.35}
.nt-the p{font-size:14.5px; color:var(--ink-soft); white-space:pre-line; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden}
.nt-the.mo p{-webkit-line-clamp:unset; display:block}
.nt-the .xem{align-self:flex-start; background:none; border:0; padding:0; font:inherit; font-size:14px; font-weight:700; color:var(--cherry); cursor:pointer}
.nt-trong{border:1px dashed var(--line); border-radius:16px; padding:34px 22px; text-align:center; color:var(--ink-soft); background:var(--surface)}
.nt-trong b{display:block; color:var(--ink); font-size:17px; margin-bottom:6px}
.nt-them{text-align:center; margin-top:22px}

/* hỏi đáp */
.nt-hd{max-width:820px}
.nt-hd details{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); margin-bottom:10px}
.nt-hd summary{cursor:pointer; padding:18px 20px; font-weight:700; list-style:none; display:flex; justify-content:space-between; gap:16px}
.nt-hd summary::-webkit-details-marker{display:none}
.nt-hd summary::after{content:"+"; color:var(--cherry); font-size:22px; line-height:1}
.nt-hd details[open] summary::after{content:"–"}
.nt-hd details p{padding:0 20px 18px; color:var(--ink-soft)}

.lb-main video{max-width:100%; max-height:100%}
#lbI{max-width:100%; max-height:100%; object-fit:contain}

@media (max-width:1000px){
  .nt-buoc{grid-template-columns:repeat(4,1fr)}
  .nt-bai{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .nt-hero .wrap{grid-template-columns:1fr}
  .nt-goi{grid-template-columns:1fr 1fr}
  .nt-pc{grid-template-columns:1fr 1fr 1fr; gap:10px}
  .nt-pc a{aspect-ratio:3/4.4} .nt-pc .pc{padding:14px} .nt-pc p{display:none}
}
@media (max-width:600px){
  .nt-goi,.nt-bai{grid-template-columns:1fr}
  .nt-pc{grid-template-columns:1fr; gap:12px} .nt-pc a{aspect-ratio:16/11} .nt-pc p{display:block}
  .nt-buoc{grid-template-columns:1fr 1fr}
  .nt-anh{columns:2; column-gap:8px} .nt-anh a{margin-bottom:8px}
  .nt-ghep{aspect-ratio:1/0.9}
}
