/* STOWN reference layout. Scoped to the alternate landing page. */
.redesign { --red:#ed002d; --red-dark:#c90025; --red-orange:#ff5d30; --orange:#ff8c34; --ink:#34343b; --ink-soft:#7a7a80; --cream:#fcfaf7; --beige:#f0e5df; --grad:linear-gradient(100deg,#ec002e,#ff7731); --shadow:0 7px 23px #ac59350a; --gutter:24px; --max:1200px; color:var(--ink); background:var(--cream); font-size:14px; }
.redesign .bar-top { display:none; }
.redesign h1,.redesign h2,.redesign h3,.redesign h4 { font-family:var(--font-body); }
.redesign .wrap { max-width:var(--max); }
.redesign a { text-underline-offset:3px; }
.redesign .btn { min-height:42px; border-radius:5px; padding:10px 23px; font-size:12px; letter-spacing:0; gap:12px; border-width:1px; }
.redesign .btn:hover { box-shadow:0 4px 12px #e8002b1c; }
.redesign .btn-ghost { background:#fff; border:1px solid #ff9aab; color:var(--red); }
.redesign .btn-ghost:hover { background:#fff0f2; }
.redesign .card { border:1px solid var(--beige); border-radius:9px; box-shadow:var(--shadow); }
.ui-icon { width:25px; height:25px; display:block; flex:none; }
.btn .ui-icon { width:17px; height:17px; }
.skip-link { position:fixed; top:-80px; left:16px; background:white; color:var(--red); z-index:100; padding:12px 20px; }
.skip-link:focus { top:8px; }
.redesign .topbar { background:#fffffffa; border:0; box-shadow:0 2px 8px #4c272807; }
.redesign .topbar-in { min-height:65px; gap:22px; }
.redesign .brand { text-decoration:none; display:flex; align-items:center; color:var(--red); }
.redesign .nav { display:flex; gap:23px; margin-left:auto; align-items:center; }
.redesign .nav a { font-size:11px; color:#404047; padding:15px 0; font-weight:500; white-space:nowrap; }
.redesign .nav a:hover { color:var(--red); }
.redesign .header-cta { margin-left:20px; min-height:38px; font-size:11px; padding:9px 20px; }
.redesign .menu-toggle,.redesign .mobile-member { display:none; }
.redesign .hero { position:relative; isolation:isolate; overflow:hidden; background:linear-gradient(110deg,#e90030 0%,#f33728 30%,#ff9d43 54%); color:white; padding:0; }
.redesign .hero-in { display:block; padding-top:52px; padding-bottom:72px; min-height:500px; }
.redesign .hero-copy { position:relative; z-index:2; width:41%; max-width:490px; padding-right:12px; }
.redesign .hero .eyebrow { font-size:11px; font-weight:500; letter-spacing:.1em; color:white; opacity:1; margin:0 0 10px; }
.redesign .hero h1 { text-transform:uppercase; font-size:clamp(35px,3.9vw,53px); font-weight:700; line-height:1.04; letter-spacing:-.025em; margin:0 0 8px; white-space:normal; }
.redesign .hero .hero-lead { font-size:12px; line-height:1.75; font-weight:400; margin:0 0 18px; max-width:375px; opacity:.95; }
.hero-actions { display:flex; gap:13px; flex-wrap:wrap; }
.redesign .btn-light { background:#fff; color:var(--red); }
.redesign .btn-outline-light { border-color:#ffb0a9; background:transparent; color:white; }
.hero-status { font-size:10px; line-height:1.7; margin:14px 0 0; color:#fff9e9; }
.reference-hero-photo { position:absolute; z-index:-1; top:0; bottom:0; right:0; width:60%; border-radius:48% 0 0 48% / 78% 0 0 78%; margin:0; overflow:hidden; background:#d6e6ee; }
.reference-hero-photo>img { width:100%; height:100%; object-fit:cover; object-position:center 35%; }
.reference-hero-photo>figcaption { position:absolute; right:15px; bottom:45px; margin:0; padding:3px 8px; font-size:9px; color:#fff; background:#213f5477; border-radius:3px; }
.hero-leaves { position:absolute; z-index:-1; inset:0; pointer-events:none; overflow:hidden; }
.hero-leaves:after { content:''; position:absolute; height:200px; width:220px; left:-70px; bottom:-125px; border-radius:50%; border:25px solid #ffbf391c; box-shadow:35px -30px 0 15px #ffbf3910; }
.hero-leaves i { position:absolute; left:-60px; top:70px; width:150px; height:55px; background:#ffc47c24; border-radius:0 100%; transform:rotate(50deg); }
.hero-leaves i:nth-child(2) { top:160px; left:-40px; width:140px; height:45px; transform:rotate(22deg); }
.hero-leaves i:nth-child(3) { top:20px; left:-40px; width:70px; height:120px; transform:rotate(-20deg); }
.redesign .facts { position:relative; display:block; z-index:3; margin-top:-32px; padding-top:0; padding-bottom:0; }
.facts-panel { display:grid; grid-template-columns:1.05fr 1fr .85fr 1.25fr 1.15fr; border-radius:12px; background:#fff; border:1px solid #fff7f1; box-shadow:0 8px 25px #915f3710; padding:23px 14px; }
.redesign .fact { display:flex; align-items:center; gap:16px; text-align:left; padding:0 20px; border-right:1px solid #f2d8d7; }
.redesign .fact:last-child { border-right:0; }
.redesign .fact>.ui-icon { width:33px; height:33px; color:#ff6231; }
.redesign .fact b { font:700 21px/1.2 var(--font-body); color:var(--red); white-space:nowrap; letter-spacing:-.04em; }
.redesign .fact span { display:block; font-size:10px; line-height:1.6; white-space:normal; color:#737279; margin-top:3px; }

.redesign .sec { padding-top:34px; padding-bottom:0; scroll-margin-top:85px; }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:0 0 18px; }
.section-heading>div { min-width:0; }
.redesign .h-section { margin:0; padding:0 0 0 18px; font-size:24px; font-weight:700; line-height:1.23; text-transform:uppercase; letter-spacing:-.03em; color:var(--red); position:relative; }
.redesign .h-section:before { content:''; position:absolute; left:0; top:2px; bottom:1px; width:4px; height:auto; border-radius:0; background:linear-gradient(#f91238,#ff8831); }
.redesign .h-section:after { display:none; }
.section-subtitle { font-size:12px; color:var(--ink-soft); line-height:1.65; margin:4px 0 0 18px; }
.redesign .muted { color:var(--ink-soft); font-size:12px; line-height:1.75; }
.redesign .small { font-size:10px; }
.redesign figcaption { font-size:10px; line-height:1.5; }
.redesign .newsbar.has-news { position:relative; border:0; background:transparent; box-shadow:none; padding:0; margin:0; display:flex; gap:0; }
.redesign .newsbar-tag { display:none; }
.redesign .newsbar.has-news .newsbar-body { order:1; }
.redesign .nb-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.redesign .nb-card { min-width:0; border:1px solid var(--beige); background:#fff; border-radius:9px; box-shadow:var(--shadow); overflow:hidden; gap:0; position:relative; }
.redesign .nb-thumb { display:block; aspect-ratio:1.9; background:var(--grad); }
.redesign .nb-thumb img { width:100%; height:100%; aspect-ratio:1.9; object-fit:cover; border:0; }
.redesign .nb-txt { padding:13px 13px 10px; }
.article-category { display:inline-block; position:absolute; top:10px; left:10px; background:#ff6134; color:white; border-radius:3px; font-size:8px; font-weight:700; padding:3px 7px; }
.redesign .news-date { display:block; color:#9a9697; font-size:10px; font-weight:400; }
.redesign .nb-title { font:600 13px/1.5 var(--font-body); margin:5px 0 6px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; min-height:58px; }
.redesign .nb-sum { font-size:11px; line-height:1.6; -webkit-line-clamp:2; }
.redesign .nb-more { font-size:10px; font-weight:500; margin-top:6px; text-decoration:none; display:inline-flex; align-items:center; gap:5px; min-height:24px; }
.redesign .nb-more:after { content:'➜'; }
.redesign .newsbar.has-news .newsbar-ctl { position:absolute; right:0; top:-51px; order:0; gap:3px; margin:0; }
.redesign .newsbar-ctl button { background:transparent; border:0; color:var(--red); min-width:27px; min-height:32px; font-size:17px; }
.redesign .newsbar-ctl .newsbar-all { padding:0 2px 0 9px; font-size:10px; text-decoration:underline; }
.redesign .newslist { margin-top:15px; }
.showcase-band { margin-top:34px; padding:25px 0; background:linear-gradient(110deg,#fff0e6,#fceadf 55%,#fff8f0); position:relative; overflow:hidden; scroll-margin-top:85px; }
.showcase-band:before,.checker-band:before,.foot:before { content:''; position:absolute; left:-85px; bottom:-100px; width:240px; height:280px; border:28px solid #ff9a6320; border-radius:75% 0; transform:rotate(30deg); pointer-events:none; }
.showcase-grid { display:grid; grid-template-columns:.48fr 1fr; align-items:center; gap:34px; }
.showcase-copy { padding:10px 0; }
.showcase-copy>.h-section { font-size:27px; }
.showcase-copy>p { margin:20px 0 19px 18px; font-size:12px; color:#7f7875; line-height:1.85; }
.gallery-main { height:100%; width:100%; }
.gallery-main>img { width:100%; height:100%; object-fit:cover; object-position:center; }
.photo-note { position:absolute; bottom:8px; right:12px; padding:3px 7px; font-size:8px; color:white; background:#0005; border-radius:3px; pointer-events:none; }
.redesign .s3d { min-height:310px; height:310px; border-radius:7px; max-height:none; }
.location-grid { display:grid; grid-template-columns:1.95fr 1fr; gap:25px; align-items:stretch; }
.redesign .img-frame { margin:0; border:0; border-radius:8px; overflow:hidden; position:relative; background:white; }
.redesign .img-frame img { width:100%; height:385px; object-fit:cover; border:0; object-position:center; }
.redesign #vi-tri .img-frame figcaption { position:absolute; left:0; bottom:0; right:0; margin:0; padding:8px 13px; font-size:9px; background:#ffffffeb; color:#777; }
.amenities { padding:17px 18px 10px; }
.amenities>h3 { color:var(--red); font-size:16px; border-left:3px solid var(--red); padding-left:10px; margin:0 0 8px; }
.amenity { display:flex; align-items:center; gap:13px; padding:12px 0; border-bottom:1px solid #f2ede8; }
.amenity:last-child { border:0; }
.amenity>span { background:#fff3e9; color:#ff6530; padding:8px; border-radius:7px; }
.amenity h4 { font-size:11px; font-weight:600; margin:0 0 3px; }
.amenity p { font-size:10px; line-height:1.55; color:#8b8583; margin:0; }
.redesign .legend { margin:10px 0 0; font-size:10px; gap:8px 16px; }
.redesign .legend i { height:7px; width:7px; border-radius:50%; }
.redesign .legal-list { grid-template-columns:repeat(4,1fr); gap:15px; }
.redesign .lg-card { display:flex; padding:15px 13px; gap:12px; align-items:center; min-height:110px; }
.redesign .lg-thumb { flex:0 0 39px; width:39px; }
.redesign .lg-ic { width:39px; min-height:51px; border-radius:4px; background:#fff0ef; color:#ff6468; font-size:10px; position:relative; font-weight:700; }
.redesign .lg-ic:before { content:''; position:absolute; left:8px; right:8px; top:8px; bottom:7px; border:1.5px solid #ff8c8c; border-radius:2px; }
.redesign .lg-txt { gap:4px; }
.redesign .lg-txt b { font:600 11px/1.5 var(--font-body); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.redesign .lg-txt time { font-size:8px; order:2; }
.redesign .lg-sum { font-size:9px; line-height:1.4; -webkit-line-clamp:1; order:3; }
.redesign .lg-more { font-size:9px; order:4; margin-top:3px; }
.redesign .lg-pending .lg-more { color:#aaa0a0; }
.redesign .lg-thumb img { width:39px; min-height:55px; max-height:65px; border:0; border-radius:4px; }
.redesign .tabs { flex-wrap:nowrap; margin:0; gap:0; border:1px solid #f0e6e0; border-radius:5px; background:#fff; overflow:hidden; }
.redesign .tab { font-size:10px; border:0; padding:10px 15px; min-height:38px; white-space:nowrap; color:#666; }
.redesign .tab i { display:none; }
.redesign .tab[aria-selected=true] { color:white; background:var(--red); }
.redesign .unit { display:grid; grid-template-columns:.95fr 1fr .93fr; padding:20px; gap:27px; }
.redesign .unit-plan { margin:0; padding:7px; background:#f9f7f3; border-radius:5px; align-self:start; }
.redesign .unit-plan img { height:280px; width:100%; object-fit:contain; border:0; mix-blend-mode:multiply; }
.redesign .unit-plan figcaption { font-size:8px; text-align:center; }
.redesign .unit-info { padding-top:7px; }
.redesign .unit-info h3 { font-size:17px; color:var(--red); line-height:1.4; font-weight:700; letter-spacing:0; margin-bottom:12px; }
.redesign .specs>div { display:flex; font-size:10px; gap:10px; padding:9px 0; border-color:#f3ece7; line-height:1.55; }
.redesign .specs dt { flex:0 0 42%; }
.redesign .specs dd { font-weight:600; }
.redesign #unit-note { font-size:9px; margin:9px 0; }

.unit-gallery { min-width:0; display:flex; flex-direction:column; align-items:center; gap:12px; }
.redesign .unit-shots { display:grid; grid-template-columns:1fr 1fr; gap:6px; width:100%; }
.redesign .unit-shots>button:first-child { grid-column:1/-1; }
.redesign .unit-shots img { height:105px; aspect-ratio:auto; width:100%; object-fit:cover; border:0; border-radius:4px; }
.redesign .unit-shots>button:first-child img { height:145px; }

.redesign .conds { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0; }
.redesign .conds li { display:flex; gap:13px; padding:18px 15px; align-items:flex-start; }
.redesign .n { background:#fff0e7; color:#ff6938; width:47px; flex:0 0 47px; height:47px; border-radius:50%; }
.redesign .n .ui-icon { width:30px; height:30px; }
.redesign .conds h3 { font-size:11px; margin:8px 0 8px; line-height:1.5; font-weight:600; }
.redesign .conds p { color:#8a8381; font-size:10px; line-height:1.6; margin:0; }
.conditions-basis { margin-top:12px; color:#8a8381; font-size:10px; }
.conditions-basis>summary { cursor:pointer; padding:4px 0; }
.conditions-basis>p { margin:8px 0 0; }
.checker-band { position:relative; overflow:hidden; background:linear-gradient(115deg,#e9002d 0%,#f22b2d 55%,#ff7b2e 100%); margin-top:28px; padding:25px 0; scroll-margin-top:90px; }
.checker-band:after { content:''; position:absolute; width:130px; height:240px; right:-60px; top:20px; transform:rotate(-40deg); border-radius:100% 0; background:#ffbe6330; pointer-events:none; }
.redesign .check { border:0; box-shadow:none; background:transparent; border-radius:0; padding:0; margin:0; display:grid; grid-template-columns:.8fr 1.2fr; gap:35px; align-items:center; position:relative; z-index:1; scroll-margin-top:95px; }
.redesign .check-head { color:white; }
.redesign .check-head h2 { color:white; font-size:24px; line-height:1.3; font-weight:700; letter-spacing:-.02em; padding-left:18px; border-left:4px solid white; margin:0 0 10px; }
.redesign .check-head>.muted { color:#fff; margin:9px 0 12px 22px; font-size:12px; line-height:1.7; }
.redesign .check-head>.small { font-size:10px; color:#ffe7d5; }
.check-benefits { display:flex; gap:16px; flex-wrap:wrap; margin:20px 0 0 22px; }
.check-benefits>span { display:flex; align-items:center; gap:6px; font-size:9px; color:white; }
.check-benefits .ui-icon { width:22px; height:22px; }
.redesign #check-form { background:#fff; border-radius:10px; padding:18px 20px 17px; }
.redesign .progress { margin:0 0 6px; height:3px; border-radius:3px; background:#fff0eb; overflow:hidden; }
.redesign .step-label { font-size:9px; color:var(--red); margin:0 0 8px; }
.redesign legend.label { font-size:12px; font-weight:600; margin:0 0 10px; }
.entry-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px 16px; }
.redesign .field { margin-bottom:10px; min-width:0; }
.redesign .entry-grid .field { margin:0; }
.redesign .field label,.redesign .field>.label { font-size:10px; font-weight:500; margin:0 0 5px; display:block; }
.redesign .field input:not([type=checkbox]),.redesign .field select,.redesign #group-select { border:1px solid #ece8e5; width:100%; padding:9px 10px; min-height:36px; border-radius:5px; font:400 11px/1.4 var(--font-body); background:white; color:#555; }
.redesign #group-select { padding-right:20px; }
.redesign .opt { font-size:8px; }
.redesign .opts { gap:7px; margin:0 0 10px; }
.redesign .entry-grid .opts { margin:0; }
.redesign .check #opt-group { grid-template-columns:1fr; }
.required { color:var(--red); }
.redesign .actions { margin-top:13px; gap:8px; }
.redesign .actions .btn { font-size:11px; min-height:36px; padding:9px 14px; }
.redesign .actions .btn:not(.btn-ghost):after { content:'➜'; margin-left:10px; }
.redesign .opt-card span { border:1px solid #efe4e0; border-radius:5px; min-height:40px; padding:11px 13px; font-size:11px; }
.redesign .opt-card input:checked+span { background:#fff4f4; border-color:var(--red); box-shadow:inset 0 0 0 .5px var(--red); }
.redesign .check #opt-marital,.redesign .check #opt-housing,.redesign .check #opt-spouseGroup { grid-template-columns:1fr; }
.redesign .err { font-size:10px; line-height:1.5; }
.redesign .check-line { font-size:10px; line-height:1.7; gap:8px; }
.redesign .check-line input { width:17px; height:17px; flex-basis:17px; }
.redesign .hint { font-size:10px; line-height:1.6; }
.redesign .result { grid-column:1/-1; background:#fff; border-radius:9px; padding:22px; }
.project-timeline { display:grid; grid-template-columns:repeat(5,1fr); gap:15px; list-style:none; padding:0; margin:24px 0; }
.project-timeline>li { display:flex; gap:10px; align-items:flex-start; position:relative; }
.project-timeline>li:after { content:''; position:absolute; left:35px; right:0; height:2px; top:12px; background:#e6e1dc; z-index:0; }
.project-timeline>li:last-child:after { display:none; }
.project-timeline>li>span { display:grid; place-items:center; border-radius:50%; width:25px; height:25px; background:#f0ebe6; color:#a99c93; font-size:10px; z-index:1; }
.project-timeline>li>div { background:var(--cream); z-index:1; padding-right:7px; margin-top:2px; }
.project-timeline b { display:block; font-size:10px; font-weight:600; }
.project-timeline small { display:block; font-size:8px; margin-top:4px; color:#9a918d; }
.redesign .progress-list { grid-template-columns:repeat(4,1fr); gap:15px; margin:18px 0 0; }
.redesign .prog { padding:12px; }
.redesign .prog h3 { font-size:12px; }
.redesign .prog time { font-size:10px; }
.redesign .prog p { font-size:11px; }
.redesign .prog-imgs { grid-template-columns:1fr; }
.progress-placeholder { grid-column:1/-1; border:1px dashed #e8d9cf; border-radius:8px; background:linear-gradient(100deg,#fff,#fff7ee); padding:26px; display:flex; gap:18px; align-items:center; }
.progress-placeholder>.ui-icon { width:42px; height:42px; padding:9px; box-sizing:content-box; border-radius:50%; color:#ff7443; background:#fff0e4; }
.progress-placeholder strong { font-size:12px; font-weight:600; }
.progress-placeholder p { margin:3px 0 0; font-size:11px; color:#9a918d; }
.redesign .faq { display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
.redesign .faq details { border:1px solid var(--beige); border-radius:6px; box-shadow:var(--shadow); background:white; margin-bottom:10px; }
.redesign .faq summary { font-size:11px; font-weight:600; padding:14px 35px 14px 27px; line-height:1.5; }
.redesign .faq summary:before { content:'?'; color:var(--red); font-size:9px; position:absolute; left:12px; top:15px; }
.redesign .faq summary:after { content:'⌄'; font-size:14px; top:11px; right:14px; color:var(--red); }
.redesign .faq details[open] summary:after { content:'⌃'; }
.redesign .faq p { padding:0 22px 15px 27px; font-size:11px; line-height:1.8; color:#8a8381; }
.redesign .social { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:0; }
.redesign .soc { flex-direction:row; gap:18px; text-align:left; padding:17px 20px; border:1px solid var(--beige); border-radius:7px; align-items:center; }
.redesign .soc-qr { padding:0; border:0; }
.redesign .soc-qr img { height:82px; width:82px; }
.redesign .soc-body { justify-items:start; gap:4px; }
.redesign .soc h3 { color:#3e3a3b; text-transform:none; font-size:12px; letter-spacing:0; }
.redesign .soc-host { font-size:10px; color:#948a85; }
.redesign .soc .btn { font-size:10px; min-height:31px; padding:8px 15px; border-radius:4px; min-width:115px; }
.redesign .foot { background:linear-gradient(110deg,#e8002c,#f52e24 60%,#ff7931); margin-top:30px; position:relative; overflow:hidden; color:white; }
.redesign .foot-in { display:grid; grid-template-columns:.8fr 1.1fr 1fr; gap:55px; padding-top:30px; padding-bottom:25px; }
.foot-brand>p { margin:18px 0 0 10px; font:italic 16px/1.4 cursive; }
.foot-in h3 { color:#fff; font-size:11px; margin:0 0 14px; font-weight:600; }
.foot-links>div { display:grid; grid-template-columns:1fr 1fr; gap:8px 20px; }
.foot-links a { color:white; font-size:10px; text-decoration:none; }
.foot-advice { padding-left:30px; border-left:1px solid #ffffff55; }
.foot-advice p { margin:0 0 7px; font-size:10px; line-height:1.65; }
.redesign #foot-contact { display:grid; gap:5px; }
.redesign #foot-contact>a { color:#fff; font-size:10px; font-weight:400; text-decoration:none; overflow-wrap:anywhere; }
.redesign .sticky-cta { background:#fffffff5; border-top:1px solid #f2e4dc; padding:9px 16px calc(9px + env(safe-area-inset-bottom)); gap:8px; box-shadow:0 -5px 16px #6b2c2407; }
.redesign .sticky-cta>.btn { flex:1; min-height:44px; padding:10px 8px; font-size:11px; }
.redesign #sticky-call,.redesign #sticky-zalo { display:none; }
.redesign .lightbox { background:#261b1d; }
@media(min-width:1001px) { .redesign .mobile-member { display:none; } }
@media(max-width:1100px) {
 .redesign .nav { gap:15px; } .redesign .nav a { font-size:10px; } .redesign .topbar-in { gap:15px; }
 .redesign .header-cta { margin-left:5px; padding:10px 15px; }
 .redesign .hero h1 { font-size:42px; }
 .redesign .hero .hero-lead { font-size:11px; } .redesign .hero-in { min-height:420px; }
 .redesign .fact { gap:10px; padding:0 13px; } .redesign .fact>.ui-icon { width:27px; height:27px; }
 .redesign .fact b { font-size:18px; } .redesign .fact span { font-size:9px; }
 .showcase-copy>.h-section { font-size:23px; } .showcase-grid { gap:25px; }
 .redesign .conds li { flex-direction:column; padding:16px; gap:0; }
 .redesign .unit { gap:20px; padding:17px; } .redesign .unit-plan img { height:270px; }
 .redesign .unit-info h3 { font-size:15px; } .redesign .specs>div { font-size:9px; }
 .redesign .soc { gap:12px; padding:15px; } .redesign .soc-qr img { width:65px; height:65px; }
}
@media(max-width:900px) {
 .redesign { --gutter:22px; }
 .redesign .topbar-in { min-height:65px; }
 .redesign .menu-toggle { display:grid; place-items:center; width:42px; height:42px; padding:0; border:1px solid #f2e4df; border-radius:5px; background:#fff; color:var(--red); font-size:21px; cursor:pointer; }
 .redesign .header-cta { margin-left:auto; min-height:42px; }
 .redesign .nav { display:none; position:absolute; top:100%; left:0; right:0; margin:0; padding:14px 22px 20px; background:#fff; border-bottom:1px solid var(--beige); box-shadow:0 10px 12px #8a353410; max-height:calc(100dvh - 80px); overflow-y:auto; }
 .redesign .nav.is-open { display:grid; grid-template-columns:1fr 1fr; gap:0 20px; }
 .redesign .nav a { font-size:13px; padding:13px 4px; border-bottom:1px solid #f5eae5; }
 .redesign .nav .mobile-member { display:block; }
 .redesign .hero h1 { font-size:36px; }
 .redesign .hero-copy { width:44%; } .reference-hero-photo { width:58%; } .redesign .hero .btn { font-size:10px; padding:10px 14px; }
 .redesign .fact { gap:8px; padding:0 10px; } .redesign .fact>.ui-icon { width:22px; height:22px; }
 .redesign .fact b { font-size:16px; }.redesign .fact span { font-size:8px; }
 .redesign .nb-grid { gap:12px; } .redesign .nb-txt { padding:10px; }
 .redesign .nb-title { font-size:12px; min-height:54px; } .redesign .nb-sum { font-size:10px; }
 .showcase-grid { grid-template-columns:.7fr 1fr; } .showcase-copy>.h-section { font-size:22px; }
 .showcase-copy>p { font-size:11px; } .redesign .s3d { height:300px; }
 .location-grid { gap:18px; grid-template-columns:1.5fr 1fr; } .redesign .img-frame img { height:390px; }
 .amenities { padding:17px 13px 8px; } .amenity { gap:9px; padding:12px 0; }
 .amenity>span { padding:6px; } .amenity h4 { font-size:10px; } .amenity p { font-size:9px; }
 .redesign .legal-list { grid-template-columns:1fr 1fr; }
 .redesign .unit { grid-template-columns:.85fr 1.15fr; } .unit-gallery { grid-column:1/-1; }
 .redesign .unit-shots { grid-template-columns:repeat(3,1fr); } .redesign .unit-shots>button:first-child { grid-column:auto; }
 .redesign .unit-shots img,.redesign .unit-shots>button:first-child img { height:140px; }

 .redesign .unit-info h3 { font-size:19px; } .redesign .specs>div { font-size:11px; }
 .redesign .conds { gap:12px; } .redesign .check { grid-template-columns:.7fr 1fr; gap:20px; }
 .redesign .check-head h2 { font-size:22px; } .check-benefits { gap:8px; }
 .redesign #check-form { padding:16px; } .entry-grid { gap:10px; }
 .redesign .social { gap:12px; } .redesign .soc { flex-direction:column; text-align:center; }
 .redesign .soc-body { justify-items:center; } .redesign .soc-qr img { width:75px; height:75px; }
 .redesign .foot-in { gap:25px; } .foot-advice { padding-left:20px; }
}
@media(max-width:719px) {
 .redesign { --gutter:18px; padding-bottom:73px; }
 .redesign .topbar-in { min-height:63px; gap:10px; }
 .redesign .header-cta { font-size:11px; min-height:40px; padding:10px 14px; }
 .redesign .menu-toggle { width:40px; height:40px; }
 .redesign .hero-in { min-height:0; padding-top:30px; padding-bottom:280px; }
 .redesign .hero-copy { width:100%; max-width:450px; padding:0; }
 .redesign .hero .eyebrow { font-size:10px; margin-bottom:12px; }
 .redesign .hero h1 { font-size:40px; line-height:1.07; letter-spacing:-.025em; margin:0 0 10px; }
 .redesign .hero .hero-lead { font-size:12px; line-height:1.75; max-width:390px; margin-bottom:17px; }
 .redesign .hero .btn { font-size:11px; min-height:44px; padding:10px 18px; }
 .hero-status { font-size:10px; margin-top:12px; }
 .reference-hero-photo { top:auto; bottom:0; height:250px; width:100%; border-radius:40% 0 0 0 / 22% 0 0 0; }
 .reference-hero-photo>img { object-position:center 54%; }
 .reference-hero-photo>figcaption { bottom:25px; right:15px; font-size:8px; }
 .redesign .facts { margin-top:-15px; }
 .facts-panel { grid-template-columns:repeat(6,1fr); gap:15px 0; padding:20px 8px 17px; border-radius:9px; }
 .redesign .fact { grid-column:span 2; padding:0 9px; gap:8px; }
 .redesign .fact:nth-child(3) { border-right:0; }
 .redesign .fact:nth-child(4),.redesign .fact:nth-child(5) { grid-column:span 3; border-top:1px solid #f5e5e1; padding-top:13px; }
 .redesign .fact:nth-child(4) { padding-left:18px; }

 .redesign .fact b { font-size:18px; }

 .redesign .fact>.ui-icon { height:24px; width:24px; }
 .redesign .fact span { font-size:8px; line-height:1.6; }
 .redesign .sec { padding-top:28px; scroll-margin-top:83px; }
 .redesign .h-section { font-size:20px; padding-left:13px; line-height:1.3; }
 .redesign .h-section:before { width:3px; }
 .section-subtitle { margin-left:13px; font-size:11px; line-height:1.7; }
 .section-heading { margin-bottom:16px; gap:12px; flex-wrap:wrap; }
 .redesign .nb-grid { grid-template-columns:1fr 1fr; grid-auto-flow:row; grid-auto-columns:auto; overflow:visible; gap:12px; }
 .redesign .nb-thumb,.redesign .nb-thumb img { aspect-ratio:1.65; }
 .redesign .nb-title { font-size:11px; line-height:1.55; min-height:51px; }
 .redesign .nb-sum { font-size:10px; -webkit-line-clamp:2; }
 .redesign .nb-more { min-height:32px; font-size:10px; }
 .redesign .news-date { font-size:8px; }
 .article-category { font-size:7px; padding:3px 5px; left:7px; top:7px; }
 .redesign .newsbar.has-news .newsbar-ctl { position:static; order:4; margin-top:10px; margin-left:auto; }
 .redesign .newsbar-ctl button { min-width:42px; min-height:42px!important; font-size:21px; border:1px solid #f0e4df; background:#fff; border-radius:4px; }
 .redesign .newsbar-ctl .newsbar-all { font-size:11px; padding:0 13px; text-decoration:none; }
 .showcase-band { margin-top:28px; padding:25px 0; }
 .showcase-grid { grid-template-columns:1fr; gap:20px; }
 .showcase-copy { padding:0; } .showcase-copy>.h-section { font-size:22px; }
 .showcase-copy>p { margin:13px 0 13px 13px; font-size:12px; }
 .redesign .s3d { min-height:390px; height:390px; aspect-ratio:auto; }
 .redesign .s3d-bar { flex-wrap:nowrap; left:6px; right:6px; gap:3px; } .redesign .s3d-bar button { flex:1; padding:3px 2px; white-space:nowrap; font-size:11px; }
 .location-grid { grid-template-columns:1fr; gap:15px; }
 .redesign .img-frame img { height:auto; max-height:none; object-fit:contain; }
 .redesign #vi-tri .img-frame figcaption { position:static; font-size:9px; padding:10px; }
 .amenities { padding:17px 18px 9px; }
 .amenities>h3 { font-size:16px; }
 .amenity { padding:12px 0; gap:14px; } .amenity>span { padding:8px; }
 .amenity h4 { font-size:12px; } .amenity p { font-size:11px; }
 .redesign .legend { font-size:9px; gap:8px 12px; }
 .redesign .legal-list { gap:10px; }
 .redesign .lg-card { padding:13px 10px; gap:8px; min-height:115px; }
 .redesign .lg-thumb { flex-basis:29px; width:29px; }
 .redesign .lg-ic { width:29px; min-height:44px; font-size:8px; }
 .redesign .lg-ic:before { left:4px; right:4px; top:6px; bottom:5px; }
 .redesign .lg-txt b { font-size:10px; } .redesign .lg-sum { font-size:8px; }
 .redesign .lg-more { font-size:9px; }
 .redesign .tabs { width:100%; margin-top:4px; }
 .redesign .tab { flex:1; font-size:11px; min-height:44px; padding:10px 8px; white-space:normal; }
 .redesign .unit { grid-template-columns:1fr; padding:16px; gap:19px; }
 .redesign .unit-plan img { height:305px; } .redesign .unit-plan figcaption { font-size:9px; }
 .redesign .unit-info { padding:0; } .redesign .unit-info h3 { font-size:19px; }
 .redesign .specs>div { font-size:11px; padding:11px 0; }

 .redesign #unit-note { font-size:10px; }
 .redesign .unit-shots { grid-template-columns:1fr 1fr; gap:7px; }
 .redesign .unit-shots>button:first-child { grid-column:1/-1; }
 .redesign .unit-shots img { height:110px; } .redesign .unit-shots>button:first-child img { height:170px; }

 .redesign .conds { grid-template-columns:1fr 1fr; gap:11px; }
 .redesign .conds li { padding:17px 14px; }
 .redesign .n { width:42px; height:42px; flex-basis:42px; }
 .redesign .n .ui-icon { width:27px; height:27px; }
 .redesign .conds h3 { font-size:12px; margin-top:12px; }
 .redesign .conds p { font-size:11px; line-height:1.75; }
 .conditions-basis { font-size:11px; margin-top:15px; }
 .conditions-basis>summary { min-height:40px; }
 .checker-band { margin-top:20px; padding:28px 0; }
 .redesign .check { grid-template-columns:1fr; gap:18px; }
 .redesign .check-head h2 { font-size:23px; padding-left:13px; }
 .redesign .check-head>.muted { margin-left:17px; font-size:12px; }
 .redesign .check-head>.small { font-size:11px; }
 .check-benefits { margin:18px 0 0 17px; gap:14px; }
 .check-benefits>span { font-size:9px; gap:5px; } .check-benefits .ui-icon { height:20px; width:20px; }
 .redesign #check-form { padding:18px 16px; }
 .redesign .progress { height:4px; } .redesign .step-label { font-size:10px; margin:4px 0 12px; }
 .redesign legend.label { font-size:14px; }
 .entry-grid { grid-template-columns:1fr; gap:13px; }
 .redesign .field label { font-size:12px; margin-bottom:6px; }
 .redesign .field input:not([type=checkbox]),.redesign .field select,.redesign #group-select { min-height:44px; font-size:13px; padding:11px 12px; }
 .redesign .actions .btn { min-height:44px; font-size:12px; }
 .redesign .opt { font-size:10px; }
 .redesign .opt-card span { font-size:12px; min-height:44px; }
 .redesign .check-line { font-size:11px; gap:9px; }
 .redesign .check-line input { width:21px; height:21px; flex-basis:21px; }
 .redesign .hint,.redesign .err { font-size:11px; }
 .project-timeline { grid-template-columns:1fr; gap:13px; margin:20px 0; }
 .project-timeline>li { gap:13px; }
 .project-timeline>li:after { width:2px; height:auto; top:28px; bottom:-13px; left:12px; right:auto; }
 .project-timeline>li>div { padding-top:0; } .project-timeline b { font-size:12px; }
 .project-timeline small { font-size:10px; margin-top:2px; }
 .progress-placeholder { padding:20px 16px; gap:13px; align-items:flex-start; }
 .progress-placeholder>.ui-icon { width:28px; height:28px; padding:8px; }
 .progress-placeholder strong { font-size:12px; } .progress-placeholder p { font-size:11px; line-height:1.7; }
 .redesign .progress-list { grid-template-columns:1fr; }
 .redesign .faq { grid-template-columns:1fr; gap:0; }
 .redesign .faq summary { font-size:12px; padding:16px 32px 16px 29px; }
 .redesign .faq summary:before { top:17px; } .redesign .faq summary:after { top:14px; }
 .redesign .faq p { font-size:12px; line-height:1.8; }
 .redesign .social { grid-template-columns:1fr; gap:12px; }
 .redesign .soc { flex-direction:row; text-align:left; padding:16px 20px; gap:22px; }
 .redesign .soc-qr img { width:80px; height:80px; }
 .redesign .soc-body { justify-items:start; }
 .redesign .soc h3 { font-size:14px; } .redesign .soc-host { font-size:11px; }
 .redesign .soc .btn { min-height:40px; font-size:11px; min-width:140px; }
 .redesign .foot-in { grid-template-columns:1fr; gap:27px; padding:30px 25px; }
 .foot-brand>p { font-size:17px; margin-top:13px; }
 .foot-in h3 { font-size:13px; }
 .foot-links a { font-size:12px; padding:5px 0; }
 .foot-advice { border:0; border-top:1px solid #ffffff55; padding:22px 0 0; }
 .foot-advice p,.redesign #foot-contact>a { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .redesign * { transition:none!important; } }

/* logo thật */
.brand img { display:block; height:48px; width:auto; }
.foot-logo { display:block; height:auto; width:190px; max-width:100%; }
@media (max-width: 720px) { .brand img { height:40px; } .foot-logo { width:160px; } }

/* khối kêu gọi đăng ký thành viên */
.member-band { margin-top:34px; scroll-margin-top:90px; }
.mb-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:35px; align-items:center; position:relative; z-index:1; }
.mb-demo { margin:18px 0 0; }
.mb-demo img { display:block; width:100%; height:auto; border-radius:10px; border:2px solid #ffffff66; box-shadow:0 10px 26px rgba(0,0,0,.22); background:#ffffff22; }
.mb-demo figcaption { margin-top:8px; font-size:12px; color:#ffffffd9; }
.mb-card { background:#fff; border-radius:10px; padding:20px 22px 16px; }
.mb-list { list-style:none; margin:0 0 16px; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:14px 22px; }
.mb-list li { display:flex; gap:11px; align-items:flex-start; }
.mb-ic { flex:0 0 40px; height:40px; display:grid; place-items:center; background:#fff1ec; color:var(--red); border-radius:10px; }
.mb-ic .ui-icon { width:22px; height:22px; }
.mb-list b { display:block; font-size:12.5px; margin:0 0 3px; color:var(--ink); }
.mb-list p { margin:0; font-size:11px; line-height:1.6; color:var(--ink-soft); }
.mb-cta { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.mb-cta .btn { min-height:46px; padding:10px 28px; font-size:14px; }
@media (max-width: 860px) { .mb-grid { grid-template-columns:1fr; gap:18px; } .mb-list { grid-template-columns:1fr; } .mb-cta .btn { flex:1 1 100%; } }

/* điện thoại: tin tức chỉ 2 tin (muốn xem hết bấm "Tất cả tin"); tiến độ chỉ giữ ảnh cập nhật, bỏ các mốc */
@media (max-width: 719px) {
  .nb-grid .nb-card:nth-child(n+3) { display: none; }
  #news-prev, #news-next { display: none; }
  .project-timeline { display: none; }
}

/* hai nút cân đối: Đăng ký / Vào khu vực thành viên */
.mb-cta { gap:12px; flex-wrap:nowrap; }
.mb-cta .btn { flex:1 1 0; min-width:0; text-align:center; justify-content:center; }
.mb-cta .btn-ghost { background:#fff; color:var(--red); border:1.5px solid var(--red); }
.mb-cta .btn-ghost:hover { background:#fff1ec; }
@media (max-width: 860px) { .mb-cta { flex-direction:column; } .mb-cta .btn { flex:none; width:100%; } }

/* bản đồ vị trí: ảnh đã cắt sát nội dung, hiện đủ khung, không cắt thêm bằng CSS */
.redesign #vi-tri .img-frame img { height:auto; max-height:none; object-fit:contain; }
.redesign #vi-tri .location-grid { align-items:stretch; }
.redesign #vi-tri .amenities { display:flex; flex-direction:column; justify-content:space-between; }

/* điện thoại: "Tất cả tin" là liên kết chữ cạnh tiêu đề, không phải nút */
.news-all-top { display:none; }
@media (max-width: 719px) {
  #tin-tuc .section-heading { position:relative; }
  .news-all-top:not([hidden]) { display:inline-block; position:absolute; right:0; top:4px; font-size:13px; font-weight:600; color:var(--red); text-decoration:underline; text-underline-offset:3px; }
  #tin-tuc #news-all { display:none; }
}
@media (max-width: 389px) { .news-all-top:not([hidden]) { position:static; display:block; margin:6px 0 0 22px; } }

/* khung xem dự án: 3D + ảnh, chọn bằng hình nhỏ bên dưới */
.viewer { min-width:0; }
.viewer-stage { position:relative; aspect-ratio:16 / 9; min-height:300px; max-height:72vh; border-radius:8px; overflow:hidden; background:var(--cream, #fcfaf7); }
.viewer-stage .s3d { position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; min-height:0; max-height:none; border:0; border-radius:0; }
.viewer-stage .s3d[hidden], .viewer-photo[hidden] { display:none; }
.viewer-photo { position:absolute; inset:0; background:#efebdf; }
.viewer-photo .gallery-main { display:block; height:100%; width:100%; padding:0; border:0; background:none; cursor:zoom-in; }
.viewer-photo .gallery-main>img { width:100%; height:100%; object-fit:cover; }
.viewer-thumbs { display:flex; gap:8px; margin-top:10px; overflow-x:auto; padding:2px 2px 4px; }
.viewer-thumbs .vt { flex:0 0 auto; width:92px; height:58px; padding:2px; border:2px solid #fff; border-radius:6px; background:#fff; cursor:pointer; box-shadow:0 2px 7px #0002; }
.viewer-thumbs .vt img { width:100%; height:100%; object-fit:cover; border-radius:3px; display:block; }
.viewer-thumbs .vt[aria-pressed=true] { border-color:#ff6532; }
.viewer-thumbs .vt-3d { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; width:92px; background:var(--grad-cover, linear-gradient(135deg,#d7192a,#f7861f)); color:#fff; font:600 10.5px var(--font-body); }
.viewer-thumbs .vt-3d .ui-icon { width:22px; height:22px; }
.viewer-thumbs .vt-3d[aria-pressed=true] { border-color:#ff6532; box-shadow:0 0 0 2px #ff653255, 0 2px 7px #0002; }
@media (max-width: 719px) { .viewer-stage { aspect-ratio:1 / 1.05; max-height:70vh; min-height:300px; } .viewer-thumbs .vt, .viewer-thumbs .vt-3d { width:80px; height:52px; } }

/* ===== điện thoại: hero theo mẫu (ảnh phủ nền, chữ phủ lên, thẻ số liệu đè lên mép dưới) ===== */
@media (max-width: 719px) {
  .redesign .header-cta { background:linear-gradient(90deg,#e8002e,#ff5a38); border-radius:9px; box-shadow:0 3px 10px #e8002e40; display:inline-flex; align-items:center; gap:6px; }
  .redesign .header-cta::after { content:'\203A'; font-size:20px; line-height:1; margin-top:-2px; }

  .redesign .hero { background:#e90030; }
  .redesign .reference-hero-photo { position:absolute; inset:0; top:0; bottom:0; right:0; width:100%; height:100%; border-radius:0; z-index:-1; }
  .redesign .reference-hero-photo>img { width:100%; height:100%; object-fit:cover; object-position:30% 70%; }
  .redesign .reference-hero-photo::after { content:''; position:absolute; inset:0; background:linear-gradient(158deg, #e90030 0%, rgba(233,0,48,.94) 32%, rgba(240,60,42,.62) 58%, rgba(255,140,58,.12) 82%, transparent 100%); pointer-events:none; }
  .redesign .reference-hero-photo>figcaption, .redesign .hero-status { display:none; }
  .redesign .hero-in { min-height:560px; padding-top:34px; padding-bottom:110px; }
  .redesign .hero-copy { width:100%; max-width:none; }
  .redesign .hero .eyebrow { font-size:11px; letter-spacing:.14em; margin-bottom:14px; }
  .redesign .hero h1 { font-size:44px; line-height:1.05; margin:0 0 12px; }

  .redesign .hero .hero-lead { font-size:13.5px; line-height:1.7; max-width:74%; margin:0 0 22px; }
  .redesign .hero-actions { flex-direction:column; align-items:flex-start; gap:12px; }
  .redesign .hero .btn { width:196px; min-height:46px; font-size:14px; display:flex; align-items:center; justify-content:space-between; padding:10px 18px; border-radius:9px; }
  .redesign .hero .btn::after { content:'\203A'; font-size:22px; line-height:1; margin-top:-2px; }
  .redesign .hero .btn-light { background:linear-gradient(90deg,#e8002e,#ff5a38); color:#fff; border:1.5px solid #ffffff55; box-shadow:0 4px 12px #0003; }
  .redesign .hero .btn-outline-light { background:#ffffff14; color:#fff; border:1.5px solid #ffffffb0; }

  .redesign .facts { margin-top:-64px; }
  .redesign .facts-panel { box-shadow:0 10px 28px #5b1a0a26; }
  .redesign .fact:nth-child(-n+3) { flex-direction:column; justify-content:flex-start; text-align:center; gap:6px; padding:0 4px; }
  .redesign .fact:nth-child(-n+3)>div { text-align:center; }
  .redesign .fact:nth-child(-n+3) b { font-size:24px; }
  .redesign .fact:nth-child(-n+3) span { font-size:11px; line-height:1.4; color:#5f5b5a; }
  .redesign .fact:nth-child(-n+3)>.ui-icon { width:28px; height:28px; }
}
/* hero điện thoại, phiên bản 2: công trình nằm đáy bên phải, mép trên ảnh hòa vào nền đỏ */
@media (max-width: 719px) {
  .redesign .reference-hero-photo { inset:auto 0 0 auto; top:auto; width:122%; height:auto; right:-14%; background:transparent; -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 42%); mask-image:linear-gradient(to bottom, transparent 0, #000 42%); }
  .redesign .reference-hero-photo>img { width:100%; height:auto; object-fit:contain; object-position:center bottom; display:block; }
  .redesign .reference-hero-photo::after { background:linear-gradient(100deg, #e90030 0%, rgba(233,0,48,.85) 28%, rgba(240,60,42,.25) 55%, transparent 75%); }
  .redesign .hero-in { min-height:600px; }
}

/* hero điện thoại, phiên bản 3: chữ nhỏ hơn, nhiều ảnh hơn, nền chuyển sắc đỏ → cam, họa tiết cánh phượng */
@media (max-width: 719px) {
  .redesign .hero { background:linear-gradient(118deg, #e90030 0%, #f23a2c 42%, #ff8a34 100%); }
  .redesign .hero::before { content:''; position:absolute; z-index:0; right:16px; top:42px; width:132px; height:150px; background:url(/img/phoenix-trang.png) no-repeat right top / contain; opacity:.3; pointer-events:none; }
  .redesign .hero-in { min-height:520px; padding-top:28px; padding-bottom:112px; }
  .redesign .hero .eyebrow { font-size:10px; margin-bottom:10px; }
  .redesign .hero h1 { font-size:34px; line-height:1.06; margin:0 0 8px; }

  .redesign .hero .hero-lead { font-size:12.5px; line-height:1.65; max-width:78%; margin:0 0 16px; }
  .redesign .hero-actions { gap:10px; }
  .redesign .hero .btn { min-height:42px; font-size:13px; width:178px; }
  .redesign .reference-hero-photo { -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 26%); mask-image:linear-gradient(to bottom, transparent 0, #000 26%); }
  .redesign .reference-hero-photo::after { background:linear-gradient(100deg, rgba(233,0,48,.82) 0%, rgba(240,70,44,.38) 36%, transparent 60%); }
}
@media (max-width: 719px) { .redesign .hero .hero-lead { text-shadow:0 1px 8px rgba(160,0,30,.65), 0 0 2px rgba(160,0,30,.35); } }

/* hero điện thoại, phiên bản 4: chỉ hình con phượng (bỏ vòng chữ O), cao hơn và mờ hơn; chỉ 1 nút */
@media (max-width: 719px) {
  .redesign .hero::before { top:6px; right:14px; width:108px; height:166px; opacity:.17; background-position:right top; }
  .redesign .hero .btn-light { display:none; }
  .redesign .hero .btn-outline-light { background:linear-gradient(90deg,#e8002e,#ff5a38); color:#fff; border:1.5px solid #ffffff55; box-shadow:0 4px 12px #0003; }
}

/* hero điện thoại, phiên bản 5: ảnh đẩy xuống, đỉnh tòa nhà cách chữ cuối (nút) khoảng 1 hàng chữ */
@media (max-width: 719px) {
  .redesign .hero-in { min-height:0; padding-bottom:364px; }
  .redesign .reference-hero-photo { -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 12%); mask-image:linear-gradient(to bottom, transparent 0, #000 12%); }
  .redesign .reference-hero-photo::after { background:linear-gradient(100deg, rgba(233,0,48,.5) 0%, rgba(240,70,44,.18) 32%, transparent 58%); }
}

/* ===== hero điện thoại, phiên bản 6: nền hoàng hôn sáng, chữ tối, 2 nút ngang, ảnh nhuộm ấm ===== */
@media (max-width: 719px) {
  .redesign .hero { background:linear-gradient(180deg, #fff6ec 0%, #ffe6cf 34%, #ffcc9e 68%, #ffab6b 100%); color:#2b2b33; }
  .redesign .hero-leaves { display:none; }
  /* cánh phượng cam nhạt phía trên bên phải */
  .redesign .hero::before { content:''; position:absolute; z-index:0; top:4px; right:-18px; width:190px; height:292px; background:linear-gradient(160deg,#ff9a55,#ff6a3a); -webkit-mask:url(/img/phoenix-trang.png) no-repeat right top / contain; mask:url(/img/phoenix-trang.png) no-repeat right top / contain; opacity:.34; pointer-events:none; }
  .redesign .hero .eyebrow { color:#4a4a52; font-size:11px; letter-spacing:.16em; margin:0 0 20px; position:relative; }
  .redesign .hero .eyebrow::after { content:''; display:block; width:34px; height:2px; background:#ff6a35; margin-top:9px; }
  .redesign .hero h1 { font-size:42px; line-height:1.06; margin:0 0 10px; color:#2b2b33; text-shadow:none; }
  .redesign .hero h1 .h1-a { background:linear-gradient(90deg,#f0382a,#ff7a38); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; }

  .redesign .hero .hero-lead { color:#3d3d45; text-shadow:none; font-size:13px; line-height:1.6; max-width:none; margin:0 0 20px; opacity:1; }
  .redesign .hero-actions { flex-direction:row; flex-wrap:nowrap; align-items:center; gap:12px; }
  .redesign .hero .btn { width:auto; flex:0 0 auto; min-height:44px; font-size:13px; padding:10px 18px; display:inline-flex; align-items:center; gap:8px; justify-content:center; }
  .redesign .hero .btn::after { content:''; display:none; }
  .redesign .hero .btn-light { display:inline-flex; background:linear-gradient(90deg,#e8002e,#ff5a38); color:#fff; border:0; box-shadow:0 5px 14px #e8002e40; }
  .redesign .hero .btn-light::after { content:'\2192'; display:inline; font-size:15px; margin:0; }
  .redesign .hero .btn-outline-light { background:#ffffff80; color:#e8431f; border:1.5px solid #ff9c70; box-shadow:none; }
  /* ảnh công trình: nhuộm ấm, mép trên hòa vào nền */
  .redesign .reference-hero-photo { inset:auto 0 0 0; width:100%; right:0; left:0; height:auto; isolation:isolate; background:transparent; -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 13%); mask-image:linear-gradient(to bottom, transparent 0, #000 13%); }
  .redesign .reference-hero-photo>img { width:100%; height:auto; object-fit:contain; object-position:center bottom; display:block; }
  .redesign .reference-hero-photo::after { background:linear-gradient(to top, rgba(255,120,40,.55) 0%, rgba(255,160,80,.75) 45%, rgba(255,190,120,.85) 100%); mix-blend-mode:color; }
  .redesign .hero-in { min-height:0; padding-bottom:300px; }
  .redesign .facts { margin-top:-58px; }
  .redesign .fact:nth-child(-n+3) { flex-direction:row; text-align:left; gap:7px; padding:0 8px; align-items:center; }
  .redesign .fact:nth-child(-n+3)>div { text-align:left; }
  .redesign .fact:nth-child(-n+3)>.ui-icon { width:26px; height:26px; flex:0 0 auto; }
  .redesign .fact:nth-child(-n+3) b { font-size:20px; }
  .redesign .fact:nth-child(-n+3) span { font-size:10px; line-height:1.35; }
}
@media (max-width: 719px) {
  .redesign .hero::before { width:150px; height:230px; right:-10px; top:8px; opacity:.26; }
  .redesign .hero .hero-lead { max-width:80%; }
  .redesign .reference-hero-photo::after { background:linear-gradient(to top, rgba(255,120,40,.2) 0%, rgba(255,160,80,.38) 45%, rgba(255,190,120,.55) 100%); }
}

/* ===== hero điện thoại, phiên bản 7: nền cam đỏ đồng bộ theme, chữ trắng, bỏ hai nút ===== */
@media (max-width: 719px) {
  .redesign .hero { background:linear-gradient(160deg, #e90030 0%, #f0352b 42%, #ff8a34 100%); color:#fff; }
  .redesign .hero::before { background:#fff; opacity:.16; }
  .redesign .hero .eyebrow { color:#fff; }
  .redesign .hero .eyebrow::after { background:#ffc15a; }
  .redesign .hero h1 { color:#fff; }
  .redesign .hero h1 .h1-a { background:none; -webkit-background-clip:border-box; background-clip:border-box; color:#fff; -webkit-text-fill-color:#fff; }
  
  .redesign .hero .hero-lead { color:#fff; opacity:.96; text-shadow:0 1px 8px rgba(150,0,30,.4); margin:0; }
  .redesign .hero-actions { display:none; }
  .redesign .reference-hero-photo::after { mix-blend-mode:normal; background:linear-gradient(180deg, rgba(240,60,42,.32) 0%, rgba(255,140,52,.16) 40%, transparent 70%); }
}
@media (max-width: 719px) { .redesign .hero { background:linear-gradient(150deg, #e90030 0%, #f33a2a 30%, #ff7e32 66%, #ffa044 100%); } }

/* ===== hero điện thoại, phiên bản 8: tiêu đề nhỏ một nửa, slogan chữ viết tay một dòng, chuyển màu ảnh mềm hơn ===== */
@media (max-width: 719px) {
  .redesign .hero h1 { font-size:21px; line-height:1.15; margin:0 0 8px; letter-spacing:.01em; }

  .redesign .reference-hero-photo { -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.04) 5%, rgba(0,0,0,.14) 11%, rgba(0,0,0,.32) 18%, rgba(0,0,0,.55) 26%, rgba(0,0,0,.78) 35%, rgba(0,0,0,.93) 44%, #000 54%); mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.04) 5%, rgba(0,0,0,.14) 11%, rgba(0,0,0,.32) 18%, rgba(0,0,0,.55) 26%, rgba(0,0,0,.78) 35%, rgba(0,0,0,.93) 44%, #000 54%); }
}

/* ===== hero điện thoại, phiên bản 9 ===== */
@media (max-width: 719px) {
  .redesign .hero h1 { font-size:30px; line-height:1.1; }

  .redesign .hero .hero-lead { max-width:none; width:100%; text-align:justify; text-justify:inter-word; hyphens:none; }
}

/* ===== hero điện thoại, phiên bản 10: slogan nằm trong ảnh công trình ===== */
@media (max-width: 719px) {
  .redesign .hero-copy { position:static; }

  .redesign .hero h1 { margin-bottom:14px; }
}

/* ===== ảnh hero hoàng hôn (đã có sẵn slogan trong ảnh); slogan chân trang chữ viết tay ===== */
.redesign .reference-hero-photo>img { object-position:center 4%; }
.foot-brand>p { font-family:'Dancing Script','Segoe Script','Brush Script MT',cursive; font-weight:700; font-size:24px; line-height:1.25; text-transform:capitalize; margin:12px 0 0; }
@media (max-width: 719px) {
  .redesign .hero-in { padding-bottom:432px; }
  .redesign .reference-hero-photo { inset:auto 0 0 auto; left:auto; right:0; width:150%; margin-right:0; background:transparent;
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 3.5%, rgba(0,0,0,.8) 6.5%, #000 10%); mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 3.5%, rgba(0,0,0,.8) 6.5%, #000 10%); }
  .redesign .reference-hero-photo>img { width:100%; height:auto; object-fit:contain; object-position:right bottom; }
  .redesign .reference-hero-photo::after { mix-blend-mode:normal; background:linear-gradient(180deg, rgba(255,128,50,.42) 0%, rgba(255,150,70,.14) 24%, transparent 42%); }
}
.foot-brand>.foot-slogan { font-size:23px; margin:8px 0 0 4px; white-space:nowrap; color:#fff; text-shadow:0 1px 6px rgba(120,0,20,.35); }
@media (max-width: 719px) { .foot-brand>.foot-slogan { font-size:24px; margin-left:2px; } }

/* ===== hero máy tính: mép trái ảnh cong theo cánh phượng (hình phượng của logo làm mặt nạ) ===== */
@media (min-width: 720px) {
  .reference-hero-photo { width:68%; border-radius:0; background:transparent;
    -webkit-mask-image:url(/img/phoenix-trang.png), linear-gradient(#000,#000);
    mask-image:url(/img/phoenix-trang.png), linear-gradient(#000,#000);
    -webkit-mask-repeat:no-repeat, no-repeat; mask-repeat:no-repeat, no-repeat;
    -webkit-mask-position:left center, right center; mask-position:left center, right center;
    -webkit-mask-size:auto 104%, calc(100% - 190px) 100%; mask-size:auto 104%, calc(100% - 190px) 100%; }
}
@media (min-width: 720px) {
  .reference-hero-photo { width:62%;
    -webkit-mask-image:url(/img/hero-canh-phuong-mask.svg); mask-image:url(/img/hero-canh-phuong-mask.svg);
    -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-position:center; mask-position:center;
    -webkit-mask-size:100% 100%; mask-size:100% 100%; }
}
@media (min-width: 720px) {
  .redesign .hero::before { content:''; position:absolute; z-index:0; top:6%; bottom:14%; right:55%; width:250px; background:url(/img/phoenix-trang.png) no-repeat center / contain; opacity:.2; pointer-events:none; }
}
@media (min-width: 720px) {
  /* mép ảnh lượn theo bụng con phượng; mỏ phượng nằm sát ngoài mép ảnh, không bị che */
  .redesign .hero::before { top:5%; bottom:7%; right:53.6%; width:min(330px, 25vw); background-position:right center; background-size:contain; opacity:.24; }
}
@media (min-width: 720px) { .redesign .hero::before { opacity:.3; } }
@media (min-width: 720px) { .redesign .hero::before { width:min(297px, 22.5vw); right:calc(53.6% + 38px); opacity:.15; } }
@media (max-width: 719px) { .redesign .hero::before { right:28px; } }
@media (max-width: 719px) { .redesign .reference-hero-photo { bottom:-38px; } }

/* ===== hero điện thoại: dải chuyển màu đỏ → cam mềm xuống tận ảnh ===== */
@media (max-width: 719px) {
  .redesign .reference-hero-photo { padding-top:110px; box-sizing:content-box;
    background:linear-gradient(to bottom, rgba(255,128,52,0) 0, rgba(255,128,52,.55) 46px, rgba(247,176,128,.92) 100px, rgb(244,184,140) 110px) no-repeat top / 100% 110px;
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.25) 12%, rgba(0,0,0,.62) 24%, rgba(0,0,0,.9) 34%, #000 42%);
    mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.25) 12%, rgba(0,0,0,.62) 24%, rgba(0,0,0,.9) 34%, #000 42%); }
}
@media (max-width: 719px) {
  .redesign .reference-hero-photo { padding-top:0; background:transparent;
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.08) 3%, rgba(0,0,0,.22) 6%, rgba(0,0,0,.42) 10%, rgba(0,0,0,.66) 14%, rgba(0,0,0,.86) 19%, rgba(0,0,0,.96) 24%, #000 30%);
    mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.08) 3%, rgba(0,0,0,.22) 6%, rgba(0,0,0,.42) 10%, rgba(0,0,0,.66) 14%, rgba(0,0,0,.86) 19%, rgba(0,0,0,.96) 24%, #000 30%); }
  .redesign .reference-hero-photo::after { background:linear-gradient(180deg, rgba(255,110,48,.5) 0%, rgba(255,140,60,.22) 22%, transparent 46%); }
}

/* slogan trong ảnh phải rõ: mép mờ chỉ nằm trong phần trời phía trên chữ */
@media (max-width: 719px) {
  .redesign .reference-hero-photo {
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.16) 1.8%, rgba(0,0,0,.45) 3.6%, rgba(0,0,0,.78) 5.6%, rgba(0,0,0,.96) 7.4%, #000 9%);
    mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.16) 1.8%, rgba(0,0,0,.45) 3.6%, rgba(0,0,0,.78) 5.6%, rgba(0,0,0,.96) 7.4%, #000 9%); }
  .redesign .reference-hero-photo::after { background:linear-gradient(180deg, rgba(255,120,50,.32) 0%, rgba(255,140,60,.1) 5%, transparent 9%); }
}

/* điện thoại: ảnh có sẵn dải trời kéo dài trong suốt phía trên nên chuyển màu mượt, không cần mặt nạ */
@media (max-width: 719px) {
  .redesign .reference-hero-photo { -webkit-mask-image:none; mask-image:none; padding-top:0; background:transparent; }
  .redesign .reference-hero-photo::after { display:none; }
  .redesign .reference-hero-photo picture { display:block; }
  .redesign .reference-hero-photo>picture>img { width:100%; height:auto; display:block; object-fit:contain; }
}

/* hero điện thoại: nền chuyển từ đỏ sang cam ngay quanh đoạn giới thiệu, nối liền với dải trời của ảnh */
@media (max-width: 719px) {
  .redesign .hero { background:linear-gradient(180deg, #e90030 0%, #ee2a2d 13%, #f6502f 27%, #fd6f34 38%, #ff7a36 46%, #ff7a36 100%); }
}
@media (max-width: 719px) { .redesign .hero { background:linear-gradient(180deg, #e90030 0%, #ee2a2d 7%, #f64a2f 16%, #fd6a34 25%, #ff7a36 31%, #ff7a36 100%); } }

/* hero điện thoại: nền chuyển đỏ → đỏ cam đều từ đầu tới điểm bắt đầu dải trời, rồi dải trời trong ảnh nối tiếp sang cam đào */
@media (max-width: 719px) { .redesign .hero { background:linear-gradient(180deg, #e90030 0%, #ef3a2d 8%, #f13d2c 14%, #f13d2c 100%); } }

/* hero máy tính: mép ảnh theo đường Boss vẽ (đỉnh nhọn gần giữa trên, lượn xuống chếch về bên trái); khung ảnh rộng hơn để đường cong nằm trọn trong ảnh */
@media (min-width: 720px) {
  .reference-hero-photo { width:67%; }
  .redesign .hero::before { right:calc(100% - 37.6%); }
}

/* hero máy tính: mép ảnh là cung tròn ôm lấy khối chữ (lồi sang phải), không lượn chữ S */
@media (min-width: 720px) {
  .reference-hero-photo { width:73%; }
  .redesign .hero::before { right:calc(100% - 31.5%); }
}

/* vị trí khung ảnh và con phượng do redesign-v2.js đặt theo khối chữ (biến --hero-photo-left, --hero-phoenix-right); mặc định cho lúc chưa có JS */
@media (min-width: 720px) {
  .reference-hero-photo { left:var(--hero-photo-left, 27%); right:0; width:auto; }
  .redesign .hero::before { right:var(--hero-phoenix-right, 68.5%); }
}

/* ảnh nằm trong <picture>: phủ kín khung ảnh trên máy tính */
@media (min-width: 720px) {
  .reference-hero-photo>picture { display:block; width:100%; height:100%; }
  .reference-hero-photo>picture>img { width:100%; height:100%; object-fit:cover; object-position:center 4%; display:block; max-width:none; }
}

@media (min-width: 720px) {
  .redesign .hero::before { width:var(--hero-phoenix-w, 230px); top:9%; bottom:15%; opacity:.24; background-position:right center; }
}

/* ===== kiểm tra điều kiện: form nhỏ ở trang chủ + popup làm phần còn lại ===== */
.redesign #check-mini { background:#fff; border-radius:10px; padding:20px 22px 22px; position:relative; z-index:1; }
.redesign #check-mini .btn { width:100%; margin-top:14px; min-height:46px; font-size:14px; justify-content:center; }
.redesign #check-mini .field label { font-size:12px; }
.redesign #check-mini select, .redesign #check-mini input { font-size:13px; min-height:42px; }
.redesign #check-mini .step-label { font-size:11px; }
.redesign #check-mini .entry-grid { grid-template-columns:1fr 1fr; gap:12px 16px; }
@media (max-width: 719px) { .redesign #check-mini .entry-grid { grid-template-columns:1fr; } }

body.modal-open { overflow:hidden; }
.check-modal { border:0; padding:0; border-radius:14px; width:min(660px, calc(100vw - 24px)); max-height:calc(100dvh - 24px); background:#fff; color:var(--ink); box-shadow:0 26px 80px rgba(40,8,6,.45); overflow:hidden; }
.check-modal[open] { display:flex; flex-direction:column; }
.check-modal::backdrop { background:rgba(40,8,6,.58); }
.cm-head { flex:0 0 auto; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 18px; border-bottom:1px solid var(--beige); background:#fff; }
.cm-head h2 { margin:0; font:700 16px/1.3 var(--font-head); color:var(--red); letter-spacing:0; }
.cm-close { flex:0 0 auto; width:36px; height:36px; border:0; border-radius:50%; background:#f6efe9; color:var(--ink); font-size:16px; cursor:pointer; }
.cm-close:hover { background:#ffe1d6; }
.cm-body { flex:1 1 auto; overflow-y:auto; padding:16px 18px 20px; }
.check-modal #check-form { background:transparent; padding:0; border-radius:0; display:block; }
.check-modal #result { margin:0; }
.check-modal .field label, .check-modal .field > .label { font-size:13px; }
.check-modal .field input:not([type=checkbox]), .check-modal .field select { font-size:14px; min-height:44px; padding:10px 12px; }
.check-modal legend.label { font-size:15px; margin-bottom:12px; }
.check-modal .opt-card span { font-size:14px; }
.check-modal .step-label { font-size:12px; }
.check-modal .actions .btn { min-height:46px; font-size:14px; }
.check-modal .hint { font-size:12px; }
.check-modal .check-line { font-size:12.5px; }
@media (max-width: 719px) { .check-modal { width:calc(100vw - 16px); max-height:calc(100dvh - 16px); border-radius:12px; } .cm-body { padding:14px 14px 18px; } }

/* điện thoại: thẻ thông tin dự án chỉ 3 mục (quy mô, căn hộ, vốn đầu tư) */
.facts-m { display:none; }
@media (max-width: 719px) {
  .redesign .facts-panel:not(.facts-m) { display:none; }
  .redesign .facts-m { display:grid; grid-template-columns:repeat(3, 1fr); gap:0; padding:18px 6px 16px; }
  .redesign .facts-m .fact { grid-column:auto; flex-direction:column; text-align:center; gap:8px; padding:0 6px; border-top:0; align-items:center; justify-content:flex-start; border-right:1px solid #f2d8d7; }
  .redesign .facts-m .fact:last-child { border-right:0; }
  .redesign .facts-m .fact>div { text-align:center; }
  .redesign .facts-m .fact>.ui-icon { width:28px; height:28px; }
  .redesign .facts-m .fm-k { display:block; font-size:11px; color:#737279; line-height:1.3; margin:0 0 3px; }
  .redesign .facts-m .fact b { font-size:16px; line-height:1.25; white-space:normal; letter-spacing:-.02em; }
}
@media (max-width: 719px) { .redesign .facts-m .fact b { font-size:15px; white-space:nowrap; } }

/* hero máy tính: dùng ảnh nới rộng bên trái (scripts/make-hero-wide.py) nên khi thu nhỏ ảnh vẫn lấp đầy khung, thấy cả hai tòa và đế nhà */
@media (min-width: 720px) {
  .reference-hero-photo>picture>img { object-position:right 25%; }
}
/* màn rất rộng: hero cao theo bề ngang (≈ 28vw) để khung ảnh không quá dẹt, ảnh không bị cắt mất đế nhà */
@media (min-width: 1900px) { .redesign .hero-in { min-height:28vw; } }

/* chữ máy tính to thêm một bậc (17/10): cỡ nhỏ +2px, cỡ vừa +1px, tiêu đề lớn giữ nguyên; điện thoại không đổi */
@media (min-width: 720px) {
  .redesign { font-size:15px; }
  .redesign .btn { font-size:14px; }
  .redesign .nav a { font-size:13px; }
  .redesign .header-cta { font-size:13px; }
  .redesign .hero .eyebrow { font-size:13px; }
  
  .redesign .hero .hero-lead { font-size:14px; }
  .hero-status { font-size:12px; }
  .reference-hero-photo>figcaption { font-size:11px; }
  .redesign .fact span { font-size:12px; }

  .section-subtitle { font-size:14px; }
  .redesign .muted { font-size:14px; }
  .redesign .small { font-size:12px; }
  .redesign figcaption { font-size:12px; }
  .article-category { font-size:10px; }
  .redesign .news-date { font-size:12px; }
  .redesign .nb-sum { font-size:13px; }
  .redesign .nb-more { font-size:12px; }
  .redesign .newsbar-ctl button { font-size:18px; }
  .redesign .newsbar-ctl .newsbar-all { font-size:12px; }
  .showcase-copy>p { font-size:14px; }
  .photo-note { font-size:10px; }
  .redesign #vi-tri .img-frame figcaption { font-size:11px; }
  .amenities>h3 { font-size:17px; }
  .amenity h4 { font-size:13px; }
  .amenity p { font-size:12px; }
  .redesign .legend { font-size:12px; }
  .redesign .lg-ic { font-size:12px; }
  .redesign .lg-txt time { font-size:10px; }
  .redesign .lg-sum { font-size:11px; }
  .redesign .lg-more { font-size:11px; }
  .redesign .tab { font-size:12px; }
  .redesign .unit-plan figcaption { font-size:10px; }
  .redesign .unit-info h3 { font-size:18px; }
  .redesign .specs>div { font-size:12px; }
  .redesign #unit-note { font-size:11px; }

  .redesign .conds h3 { font-size:13px; }
  .redesign .conds p { font-size:12px; }
  .conditions-basis { font-size:12px; }
  .redesign .check-head>.muted { font-size:14px; }
  .redesign .check-head>.small { font-size:12px; }
  .check-benefits>span { font-size:11px; }
  .redesign .step-label { font-size:11px; }
  .redesign legend.label { font-size:14px; }
  .redesign .field label,.redesign .field>.label { font-size:12px; }
  .redesign .opt { font-size:10px; }
  .redesign .actions .btn { font-size:13px; }
  .redesign .opt-card span { font-size:13px; }
  .redesign .err { font-size:12px; }
  .redesign .check-line { font-size:12px; }
  .redesign .hint { font-size:12px; }
  
  .project-timeline>li>span { font-size:12px; }
  .project-timeline b { font-size:12px; }
  .project-timeline small { font-size:10px; }
  .redesign .prog h3 { font-size:14px; }
  .redesign .prog time { font-size:12px; }
  .redesign .prog p { font-size:13px; }
  .progress-placeholder strong { font-size:14px; }
  .progress-placeholder p { font-size:13px; }
  .redesign .faq summary { font-size:13px; }
  .redesign .faq summary:before { font-size:11px; }
  .redesign .faq summary:after { font-size:15px; }
  .redesign .faq p { font-size:13px; }
  .redesign .soc h3 { font-size:14px; }
  .redesign .soc-host { font-size:12px; }
  .redesign .soc .btn { font-size:12px; }
  
  .foot-in h3 { font-size:13px; }
  .foot-links a { font-size:12px; }
  .foot-advice p { font-size:12px; }
  .redesign #foot-contact>a { font-size:12px; }
  
  .redesign .sticky-cta>.btn { font-size:13px; }
  .mb-list b { font-size:14.5px; }
  .mb-list p { font-size:13px; }
  .mb-cta .btn { font-size:15px; }

  .redesign #check-mini .btn { font-size:15px; }
  .redesign #check-mini .field label { font-size:14px; }
  .redesign #check-mini select, .redesign #check-mini input { font-size:15px; }
  .redesign #check-mini .step-label { font-size:13px; }
  .cm-close { font-size:17px; }
  .check-modal .field label, .check-modal .field > .label { font-size:15px; }
  .check-modal .field input:not([type=checkbox]), .check-modal .field select { font-size:15px; }
  .check-modal legend.label { font-size:16px; }
  .check-modal .opt-card span { font-size:15px; }
  .check-modal .step-label { font-size:14px; }
  .check-modal .actions .btn { font-size:15px; }
  .check-modal .hint { font-size:14px; }
  .check-modal .check-line { font-size:14.5px; }
}
@media (min-width: 720px) {
  .redesign .hero .hero-lead { max-width:440px; }
  .redesign .fact span { white-space:nowrap; }
}

/* điện thoại: chữ to thêm nửa cỡ (+0,5px) (17/10) */
@media (max-width: 719px) {
  .redesign { font-size:14.5px; }
  .redesign .btn { font-size:12.5px; }
  .redesign .muted { font-size:12.5px; }
  .redesign .small { font-size:10.5px; }
  .redesign figcaption { font-size:10.5px; }
  .photo-note { font-size:8.5px; }
  .redesign .lg-txt time { font-size:8.5px; }
  .redesign .field label,.redesign .field>.label { font-size:10.5px; }
  .redesign .err { font-size:10.5px; }
  .redesign .hint { font-size:10.5px; }
  
  .project-timeline>li>span { font-size:10.5px; }
  .redesign .prog h3 { font-size:12.5px; }
  .redesign .prog time { font-size:10.5px; }
  .redesign .prog p { font-size:11.5px; }
  .redesign .faq summary:before { font-size:9.5px; }
  .redesign .faq summary:after { font-size:14.5px; }
  .foot-advice p { font-size:10.5px; }
  .redesign #foot-contact>a { font-size:10.5px; }
  .redesign .sticky-cta>.btn { font-size:11.5px; }
  .redesign .menu-toggle { font-size:21.5px; }
  .redesign .nav a { font-size:13.5px; }
  
  .redesign .header-cta { font-size:11.5px; }
  
  .hero-status { font-size:10.5px; }
  .reference-hero-photo>figcaption { font-size:8.5px; }

  .redesign .fact b { font-size:18.5px; }

  .redesign .fact span { font-size:8.5px; }
  .redesign .h-section { font-size:20.5px; }
  .section-subtitle { font-size:11.5px; }
  .redesign .nb-title { font-size:11.5px; }
  .redesign .nb-sum { font-size:10.5px; }
  .redesign .nb-more { font-size:10.5px; }
  .redesign .news-date { font-size:8.5px; }
  .article-category { font-size:7.5px; }
  .redesign .newsbar-ctl button { font-size:21.5px; }
  .redesign .newsbar-ctl .newsbar-all { font-size:11.5px; }
  .showcase-copy>.h-section { font-size:22.5px; }
  .showcase-copy>p { font-size:12.5px; }

  .redesign #vi-tri .img-frame figcaption { font-size:9.5px; }
  .amenities>h3 { font-size:16.5px; }
  .amenity h4 { font-size:12.5px; }
  .amenity p { font-size:11.5px; }
  .redesign .legend { font-size:9.5px; }
  .redesign .lg-ic { font-size:8.5px; }
  .redesign .lg-txt b { font-size:10.5px; }
  .redesign .lg-sum { font-size:8.5px; }
  .redesign .lg-more { font-size:9.5px; }
  .redesign .tab { font-size:11.5px; }
  .redesign .unit-plan figcaption { font-size:9.5px; }
  .redesign .unit-info h3 { font-size:19.5px; }
  .redesign .specs>div { font-size:11.5px; }

  .redesign #unit-note { font-size:10.5px; }

  .redesign .conds h3 { font-size:12.5px; }
  .redesign .conds p { font-size:11.5px; }
  .conditions-basis { font-size:11.5px; }
  .redesign .check-head h2 { font-size:23.5px; }
  .redesign .check-head>.muted { font-size:12.5px; }
  .redesign .check-head>.small { font-size:11.5px; }
  .check-benefits>span { font-size:9.5px; }
  .redesign .step-label { font-size:10.5px; }
  .redesign legend.label { font-size:14.5px; }
  .redesign .field label { font-size:12.5px; }
  .redesign .field input:not([type=checkbox]),.redesign .field select,.redesign #group-select { font-size:13.5px; }
  .redesign .actions .btn { font-size:12.5px; }
  .redesign .opt { font-size:10.5px; }
  .redesign .opt-card span { font-size:12.5px; }
  .redesign .check-line { font-size:11.5px; }
  .redesign .hint,.redesign .err { font-size:11.5px; }
  .project-timeline b { font-size:12.5px; }
  .project-timeline small { font-size:10.5px; }
  .progress-placeholder strong { font-size:12.5px; }
  .progress-placeholder p { font-size:11.5px; }
  .redesign .faq summary { font-size:12.5px; }
  .redesign .faq p { font-size:12.5px; }
  .redesign .soc h3 { font-size:14.5px; }
  .redesign .soc-host { font-size:11.5px; }
  .redesign .soc .btn { font-size:11.5px; }
  
  .foot-in h3 { font-size:13.5px; }
  .foot-links a { font-size:12.5px; }
  .foot-advice p,.redesign #foot-contact>a { font-size:12.5px; }
  
  .mb-list b { font-size:13px; }
  .mb-list p { font-size:11.5px; }
  .mb-cta .btn { font-size:14.5px; }

  .news-all-top:not([hidden]) { font-size:13.5px; }
  .redesign .header-cta::after { font-size:20.5px; }
  .redesign .hero .btn::after { font-size:22.5px; }
  .redesign .hero .eyebrow { font-size:11.5px; }
  .redesign .hero .hero-lead { font-size:13.5px; }
  .redesign .hero .btn { font-size:13.5px; }
  .redesign .hero .btn-light::after { font-size:15.5px; }
  .redesign .fact:nth-child(-n+3) b { font-size:20.5px; }
  .redesign .fact:nth-child(-n+3) span { font-size:10.5px; }
  .foot-brand>p { font-size:24.5px; }
  .foot-brand>.foot-slogan { font-size:24.5px; }
  .redesign #check-mini .btn { font-size:14.5px; }
  .redesign #check-mini .field label { font-size:12.5px; }
  .redesign #check-mini select, .redesign #check-mini input { font-size:13.5px; }
  .redesign #check-mini .step-label { font-size:11.5px; }
  .cm-close { font-size:16.5px; }
  .check-modal .field label, .check-modal .field > .label { font-size:13.5px; }
  .check-modal .field input:not([type=checkbox]), .check-modal .field select { font-size:14.5px; }
  .check-modal legend.label { font-size:15.5px; }
  .check-modal .opt-card span { font-size:14.5px; }
  .check-modal .step-label { font-size:12.5px; }
  .check-modal .actions .btn { font-size:14.5px; }
  .check-modal .hint { font-size:12.5px; }
  .check-modal .check-line { font-size:13px; }
  .redesign .facts-m .fm-k { font-size:11.5px; }
  .redesign .facts-m .fact b { font-size:15.5px; }
}

/* nút đăng nhập cư dân ở header: chữ đầy đủ trên máy tính, rút gọn trên điện thoại */
.header-cta .hc-short { display:none; }
@media (max-width: 719px) { .header-cta .hc-long { display:none; } .header-cta .hc-short { display:inline; } }

/* tiện ích nội khu tầng 1–4, đặt dưới đoạn giới thiệu khối phối cảnh */
.inhouse { margin:6px 0 0 18px; }
.inhouse h3 { margin:0 0 12px; font-size:15px; font-weight:700; color:#e90030; letter-spacing:.01em; }
.inhouse h3 em { font-style:normal; font-weight:500; color:#7f7875; }
.inhouse ul { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr; gap:8px; }
.inhouse li { display:flex; gap:10px; align-items:flex-start; background:#ffffffb8; border:1px solid #f4dccf; border-radius:10px; padding:10px 12px; }
.inhouse .ui-icon { flex:none; width:24px; height:24px; color:#e8431f; margin-top:1px; }
.inhouse b { display:block; font-size:14px; color:#34343b; }
.inhouse span { display:block; margin-top:2px; font-size:12.5px; line-height:1.45; color:#7f7875; }
@media (max-width: 719px) {
  .inhouse { margin-left:13px; }
  .inhouse ul { grid-template-columns:1fr; gap:8px; }
  .inhouse h3 { font-size:15.5px; } .inhouse b { font-size:14.5px; } .inhouse span { font-size:13px; }
}

/* dải hình nhỏ của khung phối cảnh: luôn một hàng, cuộn ngang (điện thoại vuốt, bấm hình thì dải tự cuộn tới hình đó) */
.viewer-thumbs { position:relative; flex-wrap:nowrap; scroll-snap-type:x proximity; scrollbar-width:thin; -webkit-overflow-scrolling:touch; }
.viewer-thumbs .vt { scroll-snap-align:center; }
@media (max-width: 719px) {
  .viewer-thumbs { scrollbar-width:none; margin-right:-16px; padding-right:16px; }
  .viewer-thumbs::-webkit-scrollbar { display:none; }
}
@media (min-width: 720px) {
  .viewer-thumbs { overflow-x:hidden; }
  .viewer-thumbs .vt, .viewer-thumbs .vt-3d { flex:1 1 0; min-width:0; width:auto; max-width:104px; }
}

/* lightbox: nút trước/sau, số thứ tự */
.lightbox .lb-nav { position:absolute; top:50%; z-index:3; width:48px; height:48px; margin-top:-24px; border:0; border-radius:50%; background:#ffffffd9; color:#34343b; font-size:34px; line-height:44px; padding:0 0 4px; cursor:pointer; box-shadow:0 2px 10px #0006; }
.lightbox .lb-nav:hover { background:#fff; }
.lightbox .lb-nav[hidden], .lightbox .lb-count[hidden] { display:none; }
.lightbox .lb-prev { left:14px; } .lightbox .lb-next { right:14px; }
.lightbox .lb-count { position:absolute; left:50%; bottom:16px; z-index:3; transform:translateX(-50%); padding:4px 12px; border-radius:14px; background:#000a; color:#fff; font-size:14px; }
@media (max-width: 719px) { .lightbox .lb-nav { width:42px; height:42px; margin-top:-21px; font-size:30px; line-height:38px; } .lightbox .lb-prev { left:8px; } .lightbox .lb-next { right:8px; } .lightbox img { touch-action:pan-y; } }

/* thanh số liệu trên máy tính bảng: năm ô phải vừa một hàng, nhãn được xuống dòng */
@media (min-width: 720px) and (max-width: 1000px) {
  .redesign .fact { gap:7px; padding:0 8px; }
  .redesign .fact>.ui-icon { width:22px; height:22px; flex:none; }
  .redesign .fact b { font-size:15.5px; letter-spacing:-.03em; }
  .redesign .fact span { white-space:normal; font-size:10.5px; line-height:1.4; }
}

/* nút điều khiển mô hình 3D ở trang chủ: dùng kiểu kính mờ trong suốt như mô hình chọn căn (stown-3d.css); chỉ đặt lại chỗ ghi nguồn bản đồ */
.redesign .s3d-osm { bottom:8px; right:8px; }
@media (max-width: 719px) { .redesign .s3d-osm { bottom:46px; } }

/* lightbox: phóng to/thu nhỏ bằng cuộn chuột, chụm hai ngón, nhấp đúp; kéo để di chuyển khi đã phóng to */
.lightbox { overflow:hidden; }
.lightbox img { touch-action:none; user-select:none; -webkit-user-select:none; -webkit-user-drag:none; cursor:zoom-in; transform-origin:center center; will-change:transform; }
.lightbox img.zoomed { cursor:grab; }
.lightbox img.zoomed:active { cursor:grabbing; }
@media (max-width: 719px) { .lightbox img { touch-action:none; } }

/* liên kết Đăng nhập trên thanh menu, chỉ máy tính */
.redesign .nav .desk-login { display:none; }
@media(min-width:1001px) { .redesign .nav .desk-login { display:inline; font-weight:700; color:var(--red,#d7192a); } }

/* Các loại căn hộ: nút chọn loại nằm dưới thẻ, căn giữa (máy tính); điện thoại để trên thẻ, ảnh gộp liền một cụm */
#can-ho { display:flex; flex-direction:column; }
#can-ho .section-heading { order:0; }
#can-ho #unit-panel { order:2; }
#can-ho #unit-tabs { order:3; align-self:center; margin:18px 0 0; }
@media (max-width:719px) {
  #can-ho #unit-tabs { order:1; align-self:stretch; margin:0 0 12px; }
  .redesign .unit { gap:0; }
  .redesign .unit-plan { order:1; margin-bottom:6px; }
  .redesign .unit-gallery { order:2; margin-bottom:18px; }
  .redesign .unit-info { order:3; }
  .redesign .unit-shots { grid-template-columns:repeat(3,1fr); }
  .redesign .unit-shots>button:first-child { grid-column:auto; }
  .redesign .unit-shots img, .redesign .unit-shots>button:first-child img { height:84px; }
}

/* Mặt bằng căn hộ + sơ đồ vị trí căn trên hai tòa: cùng một khung, tự chuyển ảnh */
.redesign .up-slides { display:grid; }
.redesign .up-slide { grid-area:1/1; display:block; width:100%; padding:0; border:0; background:none; opacity:0; visibility:hidden; transition:opacity .6s ease, visibility .6s; }
.redesign .up-slide.is-on { opacity:1; visibility:visible; }
.redesign .unit-plan .up-slide img { height:280px; }
.redesign .up-dots { display:flex; justify-content:center; gap:4px; margin-top:2px; }
.redesign .up-dots button { position:relative; width:26px; height:22px; padding:0; border:0; background:none; cursor:pointer; }
.redesign .up-dots button::after { content:''; position:absolute; left:6px; right:6px; top:9px; height:4px; border-radius:2px; background:#e3d9d2; transition:background .3s; }
.redesign .up-dots button[aria-current]::after { background:var(--red); }
@media (prefers-reduced-motion:reduce) { .redesign .up-slide { transition:none; } }
@media (max-width:900px) { .redesign .unit-plan .up-slide img { height:270px; } }
@media (max-width:719px) { .redesign .unit-plan .up-slide img { height:305px; } }

/* nút mở Google Maps dưới bản đồ vị trí */
.redesign .map-link { display:inline-flex; align-items:center; gap:8px; margin-top:12px; }
.redesign .map-link .ui-icon { width:18px; height:18px; flex:none; }
@media (max-width: 719px) { .redesign .map-link { display:flex; justify-content:center; width:100%; } }
/* máy tính: nút Google Maps nằm trong góc ảnh bản đồ */
@media (min-width: 720px) {
  .redesign .location-grid .img-frame { position:relative; }
  .redesign .map-link { position:absolute; right:14px; bottom:14px; margin:0; background:#fff; border-color:#f1b9c0; box-shadow:0 4px 14px rgba(60,20,20,.28); }
  .redesign .map-link:hover { background:#fff3f4; }
}
.redesign .map-link { padding-left:2ch; padding-right:2ch; }
@media (min-width: 720px) {
  .redesign .map-link { padding:0 1.3ch; min-height:34px; font-size:12.5px; gap:6px; right:12px; bottom:12px; }
  .redesign .map-link .ui-icon { width:15px; height:15px; }
}
/* thông số căn hộ: nhãn vừa đủ chữ, giá trị không xuống dòng trên máy tính */
@media (min-width: 1000px) {
  .redesign .specs dt { flex:0 0 auto; }
  .redesign .specs dd { margin-left:auto; text-align:right; white-space:nowrap; }
}

/* thư viện phối cảnh: ảnh ngày (tỉ lệ 6:5) và đêm (16:9) đều hiện đủ, không cắt tòa nhà */

/* Album tiến độ thi công: điện thoại vuốt ngang từng ảnh, máy tính 4 ảnh + nút xem tiếp */
.redesign .progress-list.has-album { display:block; margin:18px 0 0; }
.redesign .progress-list.has-album .prog { margin-top:16px; }
.album { position:relative; }
.alb-track { display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; padding:2px 0 4px; outline:none; }
.alb-track::-webkit-scrollbar { display:none; }
.alb-item { flex:0 0 calc((100% - 42px) / 4); margin:0; scroll-snap-align:start; background:#fff; border:1px solid #f1e6df; border-radius:10px; overflow:hidden; box-shadow:0 2px 10px #4c272808; }
.alb-item>button { display:block; width:100%; padding:0; border:0; background:#efebdf; cursor:zoom-in; }
.alb-item img { display:block; width:100%; aspect-ratio:4 / 3; object-fit:cover; }
.alb-item figcaption { display:flex; flex-direction:column; gap:2px; padding:9px 11px 11px; font-size:12.5px; line-height:1.4; color:#4a3f3a; }
.alb-item figcaption time { font-size:11.5px; color:#9a8f8b; }
.alb-nav { position:absolute; top:calc(50% - 40px); z-index:3; width:42px; height:42px; border:0; border-radius:50%; background:#fff; color:#e90030; font-size:28px; line-height:1; cursor:pointer; box-shadow:0 3px 14px #3a161240; display:flex; align-items:center; justify-content:center; padding:0 0 3px; }
.alb-nav[hidden] { display:none; }
.alb-nav:disabled { opacity:.35; cursor:default; }
.alb-prev { left:-14px; } .alb-next { right:-14px; }
.alb-count { margin:10px 0 0; text-align:center; font-size:12.5px; color:#8a7f7b; }
@media (max-width: 719px) {
  .alb-track { gap:12px; margin:0 -16px; padding:2px 16px 4px; scroll-padding-left:16px; }
  .alb-item { flex:0 0 86%; scroll-snap-align:center; }
}

/* Ảnh phối cảnh: bỏ dải nền xám lạc tone quanh ảnh (đặc biệt ở điện thoại) */
.viewer-photo { background:var(--cream); }
@media (max-width:719px) {
  .viewer-stage:has(.viewer-photo:not([hidden])) { aspect-ratio:16 / 10; min-height:0; max-height:none; }
}
/* ảnh phối cảnh phủ kín khung (không còn nền mờ hai bên) */
.viewer-photo { overflow:hidden; }
.viewer-photo .gallery-main { position:relative; z-index:1; }
.viewer-photo .gallery-main>img { object-fit:cover; object-position:center; }
.viewer-photo .photo-note { z-index:2; }

/* Lightbox trên điện thoại: 100vh lớn hơn vùng nhìn thấy khi thanh địa chỉ còn hiện nên nút Đóng và số trang bị che.
   Dùng đơn vị dvh (vùng nhìn thấy thật) + chừa vùng an toàn. */
.lightbox { position:fixed; inset:0; margin:0; width:100vw; height:100vh; max-width:100vw; max-height:100vh; }
@supports (height:100dvh) { .lightbox { width:100dvw; height:100dvh; max-width:100dvw; max-height:100dvh; } }
.lightbox form { top:max(10px, env(safe-area-inset-top)); right:max(10px, env(safe-area-inset-right)); }
.lightbox .lb-count { bottom:max(16px, env(safe-area-inset-bottom)); }

/* Mốc tiến độ đang thực hiện (bước 1: chuẩn bị dự án) */
.project-timeline>li.is-current>span { background:var(--red); color:#fff; box-shadow:0 0 0 4px #e9003022; }
.project-timeline>li.is-current b { color:var(--red); }
.project-timeline>li.is-current small { color:var(--red); font-weight:600; }
.unit-gallery[hidden] { display:none !important; }
