:root{--navy:#0B1F3A;--navy2:#0B1F3A;--blue:#1B4B7A;--green:#1ca45c;--lime:#97d51f;--ink:#0B1F3A;--sub:#5A6B7D;--line:#E3EAF1;--paper:#fff;--mist:#F4F7FA;--cream:#F4F7FA;--shadow:0 18px 50px rgba(8,31,61,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font-family:"IBM Plex Sans Thai",sans-serif;line-height:1.5}.shell{width:min(1180px,calc(100% - 40px));margin:auto}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}.topbar{height:74px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:100;backdrop-filter:blur(12px)}.topbar-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}.logo{display:flex;align-items:center;gap:10px;flex:none}.logo img{width:38px;height:38px}.logo span{display:flex;flex-direction:column;line-height:1}.logo b{font-size:19px;color:var(--navy)}.logo small{font:700 8px/1.3 var(--nj-font);letter-spacing:2px;color:#1B4B7A;margin-top:4px}.topbar nav{display:flex;align-items:center;gap:30px;height:100%}.topbar nav a{font-size:14px;font-weight:600;color:#5A6B7D;position:relative}.topbar nav a:hover,.topbar nav a.active{color:var(--navy)}.topbar nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-26px;height:3px;background:var(--green);border-radius:3px}.top-actions{display:flex;align-items:center;gap:12px}.saved-link{font-size:13px;font-weight:600;color:var(--navy)}.saved-link:first-letter{font-size:20px}.post-btn{background:var(--navy);color:#fff;padding:11px 17px;border-radius:8px;font-size:13px;font-weight:700}
.hero{position:relative;background:linear-gradient(112deg,#F4F7FA 0%,#eef5ee 51%,#E7EEF5 100%);padding:64px 0 0;overflow:hidden}.hero:before{content:"";position:absolute;width:540px;height:540px;border:1px solid rgba(18,97,168,.12);border-radius:50%;right:-120px;top:-270px;box-shadow:0 0 0 80px rgba(255,255,255,.16),0 0 0 160px rgba(255,255,255,.12)}.hero-grid{display:grid;grid-template-columns:1fr .86fr;gap:70px;min-height:420px;align-items:center}.hero-copy{padding-bottom:80px;position:relative;z-index:2}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:#1c6c43;font-size:13px;font-weight:700;margin-bottom:18px}.eyebrow span{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#d8f2df;color:var(--green)}h1,h2,h3,p{margin-top:0}.hero h1{font-size:clamp(40px,5vw,66px);line-height:1.08;letter-spacing:-2.5px;color:var(--navy);margin-bottom:18px}.hero h1 em{font-style:normal;color:var(--green)}.hero-copy>p{font-size:16px;line-height:1.8;color:var(--sub);max-width:570px;margin-bottom:26px}.trust-row{display:flex;gap:0}.trust-row div{padding:0 25px;border-left:1px solid #D8E1EA}.trust-row div:first-child{padding-left:0;border:0}.trust-row strong{font:800 22px/1 var(--nj-font);color:var(--navy);display:block}.trust-row span{display:block;font-size:11px;color:#8798A9;margin-top:6px}.map-art{height:340px;position:relative;align-self:end;background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(197,218,214,.4));border-radius:160px 160px 0 0;transform:perspective(700px) rotateX(5deg);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}.map-art:before,.map-art:after{content:"";position:absolute;background:#fff;border:1px solid #D8E1EA}.map-art:before{width:420px;height:54px;transform:rotate(-28deg);top:150px;left:4px}.map-art:after{width:360px;height:40px;transform:rotate(47deg);top:158px;left:80px}.plot{position:absolute;z-index:2;background:rgba(151,213,31,.24);border:3px solid #61a921;clip-path:polygon(12% 8%,89% 0,100% 78%,24% 100%,0 55%);display:grid;place-items:center;color:#2d681b;font-size:11px;font-weight:700}.plot-a{width:170px;height:128px;left:40px;top:50px;transform:rotate(-7deg)}.plot-b{width:150px;height:115px;right:34px;bottom:32px;transform:rotate(10deg)}.road{position:absolute;z-index:3;left:177px;top:168px;transform:rotate(-28deg);font-size:10px;color:#8798A9}.map-pin{position:absolute;z-index:5;background:#fff;padding:9px 13px 9px 28px;border-radius:8px;box-shadow:0 9px 25px rgba(4,37,72,.18);font:700 12px var(--nj-font);color:var(--navy)}.map-pin i{position:absolute;width:13px;height:13px;border-radius:50% 50% 50% 0;background:var(--green);left:10px;top:10px;transform:rotate(-45deg)}.pin-a{left:80px;top:34px}.pin-b{right:12px;bottom:23px}.verified-float{position:absolute;z-index:6;right:35px;top:24px;background:var(--navy);color:#fff;padding:10px 15px;border-radius:10px;font-size:12px;font-weight:700;box-shadow:var(--shadow)}
.search-box{position:relative;z-index:10;margin-top:-38px;transform:translateY(38px);display:grid;grid-template-columns:120px 1.6fr 1fr 1fr auto;background:#fff;border-radius:13px;padding:10px;box-shadow:0 16px 50px rgba(8,36,68,.16);border:1px solid rgba(8,36,68,.07)}.purpose-tabs{display:grid;grid-template-columns:1fr 1fr;background:#F4F7FA;padding:5px;border-radius:9px;align-self:stretch}.purpose-tabs button{border:0;background:transparent;color:#8798A9;font-weight:700;border-radius:7px}.purpose-tabs button.selected{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(0,0,0,.08)}.search-box label{padding:5px 16px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;min-width:0}.field-label{font-size:10px;color:#8798A9;font-weight:600;margin-bottom:1px}.field-line{display:flex;align-items:center;gap:8px}.field-line b{color:var(--green);font-size:20px}.search-box input,.search-box select{width:100%;border:0;outline:0;background:transparent;color:var(--navy);font-size:13px;font-weight:600}.search-box input::placeholder{color:#8798A9}.search-submit{border:0;background:var(--green);color:#fff;border-radius:9px;padding:0 24px;font-weight:700;white-space:nowrap}.search-submit span{font-size:20px;margin-right:4px}
.quick{display:grid;grid-template-columns:repeat(4,1fr);padding-top:78px;padding-bottom:44px}.quick a{display:grid;grid-template-columns:50px 1fr;grid-template-rows:auto auto;column-gap:12px;padding:15px 22px;border-right:1px solid var(--line)}.quick a:last-child{border:0}.quick-icon{grid-row:1/3;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font:800 22px var(--nj-font)}.quick-icon.green{background:#e4f6e9;color:var(--green)}.quick-icon.blue{background:#E7EEF5;color:#1B4B7A}.quick-icon.gold{background:#fff1d7;color:#d88b16}.quick-icon.mint{background:#E7EEF5;color:#1B4B7A}.quick b{font-size:14px;color:var(--navy)}.quick small{font-size:11px;color:#8798A9}
.listing-section{background:var(--mist);padding:65px 0 80px}.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:28px}.kicker{display:block;font:800 10px/1 var(--nj-font);letter-spacing:1.8px;color:var(--green);margin-bottom:10px}.kicker.light{color:#8fe2b6}.section-head h2,.proof-copy h2,.guide-section h2,.sell-inner h2{font-size:32px;line-height:1.25;color:var(--navy);margin-bottom:4px}.section-head p{color:#8798A9;font-size:13px;margin:0}.view-tools{display:flex;align-items:center;gap:7px}.view-tools button{width:35px;height:35px;border:1px solid var(--line);background:#fff;border-radius:7px;color:#8798A9}.view-tools button.view-active{background:var(--navy);border-color:var(--navy);color:#fff}.view-tools a{font-size:13px;font-weight:700;margin-left:14px;color:var(--navy)}.view-tools a span{color:var(--green);font-size:18px}.listing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.loading{grid-column:1/-1;min-height:180px;display:grid;place-items:center;color:#8798A9}.loading span{width:28px;height:28px;border:3px solid #E3EAF1;border-top-color:var(--green);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.land-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid #E7EEF5;transition:.2s;position:relative}.land-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.card-media{height:220px;background:linear-gradient(145deg,#cde0d2,#E7EEF5);position:relative;overflow:hidden}.card-media img{width:100%;height:100%;object-fit:cover}.fallback-land{width:100%;height:100%;background:linear-gradient(172deg,#8798A9 0 48%,#7fbc61 49% 61%,#56913e 62% 100%);position:relative}.fallback-land:before{content:"";position:absolute;left:-10%;right:-10%;bottom:23%;height:25px;background:#D8E1EA;transform:rotate(-6deg);box-shadow:0 0 0 7px #CBD8E4}.fallback-land:after{content:"";position:absolute;right:12%;bottom:33%;width:34%;height:28%;background:#315e28;clip-path:polygon(50% 0,100% 100%,0 100%)}.card-tags{position:absolute;left:12px;top:12px;display:flex;gap:6px}.card-tags span{background:rgba(11,37,73,.9);color:#fff;border-radius:5px;padding:5px 9px;font-size:10px;font-weight:700;backdrop-filter:blur(4px)}.card-tags span.verified{background:rgba(28,164,92,.94)}.save-btn{position:absolute;right:11px;top:11px;width:35px;height:35px;border-radius:50%;background:rgba(255,255,255,.93);border:0;color:var(--navy);font-size:21px;box-shadow:0 4px 12px rgba(0,0,0,.12)}.save-btn.saved{background:var(--green);color:#fff}.photo-count{position:absolute;right:11px;bottom:10px;background:rgba(8,23,43,.7);color:#fff;border-radius:5px;padding:4px 8px;font-size:10px}.card-body{padding:18px}.card-price{font:800 24px/1.2 var(--nj-font);color:var(--navy);margin-bottom:5px}.card-unit{font-size:10px;color:#8798A9;margin-left:5px}.card-title{font-size:15px;color:#213A57;margin:0 0 6px;line-height:1.45}.card-location{font-size:12px;color:#5A6B7D;margin-bottom:14px}.card-facts{display:flex;gap:7px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.card-facts span{font-size:10.5px;color:#5A6B7D;background:#F4F7FA;padding:5px 8px;border-radius:5px}.card-agent{display:flex;align-items:center;gap:9px;margin-top:13px}.agent-avatar{width:30px;height:30px;background:var(--navy);color:#fff;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700}.card-agent div{flex:1}.card-agent b,.card-agent small{display:block}.card-agent b{font-size:11px}.card-agent small{font-size:9px;color:#8798A9}.contact-mini{display:flex;gap:6px}.contact-mini a{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;font-size:13px;background:#F4F7FA;color:var(--navy)}.contact-mini a.line{background:#dcf7df;color:#0c9d45}.contact-mini a.fb{background:#E7EEF5;color:#0084ff;font:800 15px/1 var(--nj-font)}.result-note{background:#e8f5ed;color:#246943;border:1px solid #cce9d7;border-radius:9px;padding:11px 15px;font-size:13px;margin:-10px 0 20px}.empty-result{grid-column:1/-1;text-align:center;background:#fff;border:1px dashed #D8E1EA;border-radius:12px;padding:45px;color:#5A6B7D}.empty-result b{display:block;font-size:18px;color:var(--navy);margin-bottom:7px}
.proof-section{background:var(--navy);color:#fff;padding:82px 0;position:relative;overflow:hidden}.proof-section:after{content:"";position:absolute;width:400px;height:400px;border:1px solid rgba(255,255,255,.08);border-radius:50%;right:-130px;top:-130px;box-shadow:0 0 0 70px rgba(255,255,255,.02)}.proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.proof-copy h2{color:#fff;font-size:38px}.proof-copy p{color:#CBD8E4;max-width:480px;line-height:1.8}.outline-btn{display:inline-block;border:1px solid rgba(255,255,255,.4);padding:12px 18px;border-radius:7px;font-size:13px;font-weight:700;margin-top:8px}.proof-list{position:relative;z-index:2}.proof-list article{display:grid;grid-template-columns:58px 1fr;gap:20px;border-bottom:1px solid rgba(255,255,255,.14);padding:22px 0}.proof-list article>span{font:800 15px var(--nj-font);color:#74d79f}.proof-list b{font-size:17px}.proof-list p{font-size:12px;color:#CBD8E4;margin:6px 0 0}
.guide-section{padding-top:78px;padding-bottom:90px}.section-head.compact{align-items:center}.text-link{font-size:13px;font-weight:700;color:var(--navy)}.guide-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:36px}.guide-feature{display:grid;grid-template-columns:.8fr 1fr;background:var(--cream);border-radius:13px;overflow:hidden}.guide-visual{background:var(--green);color:#fff;padding:28px;min-height:270px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.guide-visual:after{content:"";position:absolute;width:190px;height:190px;border:1px solid rgba(255,255,255,.25);border-radius:50%;right:-80px;bottom:-80px;box-shadow:0 0 0 45px rgba(255,255,255,.07)}.guide-visual span{font-size:11px}.guide-visual b{font:800 39px/1.05 var(--nj-font);position:relative;z-index:1}.guide-feature>div:last-child{padding:32px}.guide-feature small,.guide-side small{font-size:10px;color:var(--green);font-weight:700}.guide-feature h3{font-size:21px;line-height:1.5;color:var(--navy);margin:10px 0}.guide-feature p{font-size:12px;color:#8798A9}.guide-feature a{font-size:12px;font-weight:700;color:var(--navy)}.guide-side{display:grid}.guide-side article{display:grid;grid-template-columns:48px 1fr;gap:15px;align-items:start;border-bottom:1px solid var(--line);padding:18px 0}.guide-side article:first-child{padding-top:0}.guide-num{font:800 21px var(--nj-font);color:#D8E1EA}.guide-side h3{font-size:15px;line-height:1.5;color:var(--navy);margin:5px 0}
.sell-banner{background:#e8f4ea;padding:0 0 70px}.sell-inner{background:linear-gradient(105deg,#e4f3df,#E7EEF5);padding:46px 55px;border-radius:16px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden}.sell-inner:after{content:"";position:absolute;right:210px;width:190px;height:190px;border:38px solid rgba(28,164,92,.08);border-radius:50%}.sell-inner span{font-size:11px;color:var(--green);font-weight:700}.sell-inner h2{font-size:30px;margin:7px 0}.sell-inner p{font-size:12px;color:#5A6B7D;margin:0}.sell-inner>a{position:relative;z-index:1;background:var(--green);color:#fff;padding:16px 24px;border-radius:8px;font-size:14px;font-weight:700}.sell-inner>a b{margin-left:24px}
footer{background:#0B1F3A;color:#fff;padding:55px 0 25px}.footer-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:50px}.footer-logo b{color:#fff}.footer-grid>div>p{font-size:11px;color:#8798A9;max-width:270px;margin-top:16px}.footer-grid>div:not(:first-child){display:flex;flex-direction:column;gap:10px}.footer-grid>div>b{font-size:12px;margin-bottom:6px}.footer-grid>div>a,.footer-grid>div>span{font-size:11px;color:#8798A9}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:20px;display:flex;justify-content:space-between;color:#5A6B7D;font-size:10px}.mobile-nav{display:none}
@media(max-width:900px){.topbar nav{display:none}.hero-grid{grid-template-columns:1fr;min-height:auto}.hero-copy{padding-bottom:25px;text-align:center}.hero-copy>p{margin-left:auto;margin-right:auto}.trust-row{justify-content:center}.map-art{height:250px;max-width:560px;width:100%;margin:auto}.search-box{grid-template-columns:110px 1fr 1fr}.search-box label:nth-of-type(3){display:none}.search-submit{grid-column:auto}.quick{grid-template-columns:repeat(2,1fr)}.quick a:nth-child(2){border-right:0}.listing-grid{grid-template-columns:repeat(2,1fr)}.proof-grid{gap:40px}.guide-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}.footer-grid>div:last-child{display:block}}
@media(max-width:640px){body{padding-bottom:69px}.shell{width:min(100% - 28px,1180px)}.topbar{height:62px}.topbar-inner{gap:10px}.logo img{width:34px;height:34px}.logo b{font-size:17px}.topbar .saved-link span,.topbar .post-btn{display:none}.saved-link{font-size:25px}.hero{padding-top:35px}.hero-grid{display:block}.hero-copy{text-align:left;padding-bottom:35px}.eyebrow{font-size:11px}.hero h1{font-size:39px;letter-spacing:-1.5px}.hero-copy>p{font-size:14px;margin-left:0}.trust-row{justify-content:flex-start;overflow-x:auto}.trust-row div{padding:0 14px;min-width:max-content}.trust-row strong{font-size:18px}.map-art{height:210px;border-radius:110px 110px 0 0}.plot-a{width:130px;height:95px;left:20px}.plot-b{width:110px;height:85px}.map-art:before{width:320px}.pin-a{left:33px}.verified-float{right:12px}.search-box{width:calc(100% - 24px);grid-template-columns:1fr 1fr;margin-top:-22px;transform:translateY(30px;padding:8px)}.purpose-tabs{grid-column:1/3;height:43px}.search-box label{border-right:0;border-bottom:1px solid var(--line);padding:9px 12px}.search-location{grid-column:1/3}.search-box label:nth-of-type(2){display:none}.search-submit{height:48px;grid-column:1/3}.quick{padding-top:58px;padding-bottom:30px;gap:8px}.quick a{padding:12px 4px;grid-template-columns:42px 1fr;column-gap:8px;border:0}.quick-icon{width:40px;height:40px;font-size:17px}.quick b{font-size:12px}.quick small{font-size:9px}.listing-section{padding:42px 0 55px}.section-head{align-items:center}.section-head h2,.guide-section h2{font-size:26px}.section-head p,.view-tools button{display:none}.view-tools a{margin:0}.listing-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-right:-14px;padding-right:14px}.land-card{flex:0 0 86%;scroll-snap-align:start}.card-media{height:205px}.proof-section{padding:55px 0}.proof-grid{grid-template-columns:1fr}.proof-copy h2{font-size:29px}.proof-list article{grid-template-columns:42px 1fr}.guide-section{padding-top:52px;padding-bottom:55px}.section-head.compact .text-link{display:none}.guide-feature{grid-template-columns:1fr}.guide-visual{min-height:190px}.guide-feature>div:last-child{padding:24px}.guide-side article{grid-template-columns:40px 1fr}.sell-banner{padding-bottom:0}.sell-inner{width:100%;border-radius:0;padding:38px 22px;display:block}.sell-inner:after{display:none}.sell-inner h2{font-size:26px}.sell-inner>a{display:block;text-align:center;margin-top:22px}footer{padding:42px 0 92px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}.footer-grid>div:first-child{grid-column:1/3}.footer-bottom{display:block;line-height:1.9}.mobile-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:200;background:rgba(255,255,255,.98);border-top:1px solid var(--line);padding:7px 6px calc(7px + env(safe-area-inset-bottom));box-shadow:0 -7px 22px rgba(8,31,61,.1)}.mobile-nav a{display:flex;flex-direction:column;align-items:center;font-size:9px;color:#8798A9;gap:1px}.mobile-nav a span{font-size:20px;line-height:1}.mobile-nav a.active{color:var(--green)}.mobile-nav .mobile-post{color:var(--navy);font-weight:700}.mobile-nav .mobile-post span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;margin-top:-18px;border:4px solid #fff;font-size:22px}.mobile-nav .mobile-post{gap:4px}.result-note{font-size:12px}.empty-result{min-width:calc(100vw - 28px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media(max-width:640px){.search-box{transform:translateY(30px);padding:8px}}

/* ปุ่มในกล่อง "ยังไม่มีแปลงประกาศ" — เปลี่ยนทางตันให้เป็นทางไปต่อ
   (กล่องนี้คือสิ่งที่คนเห็นจริงตอนนี้ เพราะยังไม่มีแปลงผ่านเกณฑ์ขึ้นเว็บ) */
.empty-actions{
  display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:18px;
}
.empty-actions .outline-btn,
.empty-actions .post-btn{margin:0}
@media (max-width:560px){
  .empty-actions{flex-direction:column;align-items:stretch}
  .empty-actions a{text-align:center}
}

/* ป้ายระดับ 1 บนการ์ด — สีเหลือง ต้องต่างจากป้ายเขียว "รังวัดยืนยันแล้ว" ให้เห็นชัดตั้งแต่แวบแรก
   ถ้าสองระดับดูเหมือนกัน ป้ายเขียวจะหมดความหมายทันที */
.card-tags span.basic{background:rgba(107,87,30,.96);color:#FFFFFF}
/* การ์ดคลิกได้ทั้งใบ (marketplace.js พาไปหน้ารายละเอียด) แต่ยังไม่ใช่ <a> เพราะมีปุ่มติดต่อซ้อนอยู่ข้างใน */
.land-card[data-href]{cursor:pointer}
.card-title a{color:inherit;text-decoration:none}
.card-title a:hover{text-decoration:underline}

/* เนื้อที่ + ราคาต่อตารางวา — ดูเหตุผลที่ home.css (สไตล์การ์ดถูกเขียนซ้ำ 2 ชุดตามชุดสีของแต่ละหน้า) */
.card-meta{font-size:13.5px;font-weight:600;color:var(--blue);letter-spacing:.2px}

/* ---------- จุดตัดเมนูบนแถบหัวเว็บ ----------
   ของเดิมซ่อน .topbar nav ที่ 900px ซึ่งช้าเกินไปสำหรับความยาวข้อความเมนูปัจจุบัน
   ระหว่าง 901–1079px เมนูยังโชว์อยู่แต่พื้นที่ไม่พอ flex จึงบีบข้อความทุกข้อให้ขึ้นสองบรรทัด
   (ที่จอ 1024 ซึ่งเป็นความกว้างแท็บเล็ตแนวนอนมาตรฐาน เห็นชัดว่าแถบหัวเว็บพัง)
   แถบปุ่มขวามือ (.top-actions) ก็สูงขึ้นจาก 42 เป็น 61–81px ในช่วงเดียวกันด้วยเหตุผลเดียวกัน

   วัดจริงบน listings.html: เมนู 7 ข้อ (ลิงก์แชทถูกซ่อนไปแล้วที่ 1224 — ดู njchat.css)
   ต้องการ 569px · พอดีตัวที่พื้นที่เนื้อหา 1060px · ที่ 1035px ขึ้นสองบรรทัดแล้ว
   จึงตัดที่ 1079 (เผื่อจากจุดที่วัดแล้วดีจริงอีก ~20px)

   ⚠️ ตัวเลข 900 ในบล็อกจอเล็กด้านบนยังอยู่ตามเดิม เพราะบล็อกนั้นคุมของอื่นอีกหลายอย่าง
   (hero · listing-grid · footer) ที่ไม่ได้เกี่ยวกับแถบหัวเว็บ — บรรทัดนี้ครอบมันไปแล้วเท่านั้น
   menu.js เอาปุ่มลิ้นชักมาแทนให้เองอัตโนมัติ เพราะตัดสินจาก getComputedStyle ของ nav ไม่ใช่เลข breakpoint
   ⚠️ เพิ่ม/แก้ข้อความในเมนูเมื่อไหร่ ต้องวัดใหม่ทุกครั้ง */
@media (max-width:1079px){ .topbar nav{ display:none; } }

/* ป้ายผังสีบนการ์ด (2026-09-18) — สีมาจาก NJVocab.ZONE_HEX ผ่าน inline style ของ listingcard.js */
.card-zone{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-size:12.5px;color:#5A6B7D}
.card-zone i{width:14px;height:14px;border-radius:3px;border:1px solid rgba(0,0,0,.3);flex:none}

/* ---------- การ์ดประกาศ: รหัสทรัพย์ + ปุ่มดูรายละเอียด (Sprint 3 · งานที่ 7) ----------
 * ⚠️ สไตล์การ์ดยังแยกสามชุดตามชุดสี — เพิ่มคลาสใหม่ต้องเพิ่มครบทั้งสามไฟล์
 *    ใส่ที่เดียว = อีกหน้าไม่มีสไตล์โดยไม่มี error (กติกาใน CLAUDE.md หัวข้อ listingcard.js) */
.card-code {
  margin: 6px 0 2px;
  font-size: var(--nj-fs-xs);
  color: var(--nj-text-muted);
  letter-spacing: 0.02em;
}
.card-code b { color: var(--nj-navy-600); font-weight: var(--nj-fw-semi); }

.card-more {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  margin-top: 4px;
  color: var(--nj-navy-600);
  font-size: var(--nj-fs-sm);
  font-weight: var(--nj-fw-semi);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.card-more:focus-visible { outline: 2px solid var(--nj-focus); outline-offset: 2px; }