/* ============================================================
   NÜXGROW · โหมดกระทัดรัด (dense) v0.1.2 (14 ต.ค. 2569 · ตัวเลือกพืชคอลัมน์เดียว · คำบรรยาย/legend/หัวรอง/ท้ายหน้า 14 px)
   ใช้เฉพาะหน้าที่ใส่ <body class="… dt-dense"> · โหลดต่อท้ายไฟล์สไตล์อื่นของหน้า
   หลัก: ลดระยะว่าง/ปรับกริด เป็นหลัก · ตัวอักษรเนื้อหาไม่ต่ำกว่า 14 px · ตัวแปร --qp-* เท่านั้น
   ============================================================ */

/* ── ตัวแปรกลาง (ทับชุดใน deeptech.css) ── */
.dt-dense {
  --dt-fs-mega: clamp(28px, 3.4vw, 46px);
  --dt-fs-title: clamp(21px, 1.9vw, 27px);
  --dt-fs-h: clamp(16px, 1.3vw, 19px);
  --dt-fs-lead: 15px;
  --dt-fs-num-xl: clamp(40px, 4.2vw, 58px);
  --dt-fs-num-lg: clamp(26px, 2.6vw, 36px);
  --dt-fs-num-md: clamp(19px, 1.6vw, 23px);
  --dt-pad-top: clamp(18px, 2.2vw, 28px);
  --dt-pad-bot: clamp(16px, 2vw, 24px);
  --dt-hero-top: 80px;
  --dt-gap: clamp(12px, 1.6vw, 22px);
  --dt-card-pad: clamp(12px, 1.2vw, 16px);
  --dt-stack: 8px;
  --pfx-pad: clamp(14px, 2.4vw, 32px);
}
.dt-dense .dt-wrap { padding: 0 clamp(14px, 2.4vw, 32px); }
.dt-dense .dt-ch { padding: var(--dt-pad-top) 0 var(--dt-pad-bot); }
.dt-dense main > .dt-ch:first-child, .dt-dense main > header.dt-ch, .dt-dense header.dt-ch { padding-top: var(--dt-hero-top); }
.dt-dense .dt-lead { line-height: 1.6; max-width: 72ch; }
.dt-dense .dt-label { font-size: 11px; letter-spacing: .16em; gap: 8px; }
.dt-dense .dt-actions { margin-top: 12px; gap: 8px; }
.dt-dense .dt-btn { height: 40px; padding: 0 18px; font-size: 14px; }
.dt-dense .dt-btn--sm { height: 34px; padding: 0 12px; font-size: 13px; }
.dt-dense .dt-pill { height: 24px; padding: 0 10px; font-size: 12px; }
@media (pointer: coarse) { .dt-dense .dt-btn, .dt-dense .dt-btn--sm { min-height: 44px; } }

/* ท้ายหน้า */
.dt-dense .dt-foot { padding: 20px 0 14px; font-size: 14px; }
.dt-dense .dt-foot__grid { gap: 14px 20px; }
.dt-dense .dt-foot h5 { margin-bottom: 8px; }
.dt-dense .dt-foot ul { gap: 5px; }
.dt-dense .dt-foot__base { margin-top: 12px; padding-top: 10px; }
.dt-dense .pfc-foot__lg { margin-top: 10px; font-size: 12px; }

/* หัวหน้า / หัวบท (pfc = /app /devices) */
.dt-dense .pfc-bc { margin-bottom: 8px; font-size: 12px; }
.dt-dense .pfc-head { margin-bottom: 12px; }
.dt-dense .pfc-p { font-size: 15px; margin-top: 6px; line-height: 1.6; }
.dt-dense .pfc-h1 { font-size: clamp(24px, 2.4vw, 32px); line-height: 1.25; }
.dt-dense .app-hero { padding-bottom: 18px; }
.dt-dense .pfc-hero .dt-ch__bg { opacity: .35; }

/* หัวหน้าแบบ 2 ฝั่ง: ข้อความซ้าย · สรุป/สถานะขวา */
.dn-hero { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--dt-gap); align-items: end; }
.dn-hero > * { min-width: 0; }
@media (max-width: 900px) { .dn-hero { grid-template-columns: minmax(0, 1fr); } }

/* หัวรองเล็ก (ไทย) */
.dn-sub { margin: 0 0 6px; font-size: 14px; font-weight: 600; color: var(--qp-ink-2); }

/* ตารางสรุปสั้นในหัวหน้า (เช่น สถานะ) */
.dn-kv { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 0; border: 1px solid var(--qp-line); border-radius: 6px; overflow: hidden; font-size: 14px; background: color-mix(in srgb, var(--qp-surface) 80%, transparent); }
.dn-kv > dt, .dn-kv > dd { margin: 0; padding: 7px 12px; border-top: 1px solid var(--qp-line); line-height: 1.5; }
.dn-kv > dt:first-of-type, .dn-kv > dt:first-of-type + dd { border-top: 0; }
.dn-kv > dt { color: var(--qp-ink-2); font-weight: 500; }
.dn-kv > dd { color: var(--qp-ink); }
.dn-kv .dt-pill { white-space: normal; height: auto; min-height: 22px; padding: 2px 9px; line-height: 1.35; }
@media (max-width: 520px) { .dn-kv { grid-template-columns: minmax(0, 1fr); } .dn-kv > dd { border-top: 0; padding-top: 0; } }

/* แถบติดต่อบรรทัดเดียว (แทนบทติดต่อเต็มจอ) */
.dn-strip { display: flex; align-items: center; justify-content: space-between; gap: 10px 20px; flex-wrap: wrap; padding: 12px 16px; border: 1px solid var(--qp-line-strong); border-radius: 8px; background: color-mix(in srgb, var(--qp-surface) 85%, transparent); }
.dn-strip > p { margin: 0; font-size: 15px; color: var(--qp-ink-2); line-height: 1.55; }
.dn-strip > p b { color: var(--qp-ink); font-weight: 600; }
.dn-strip .dt-actions { margin-top: 0; }
.dt-dense .app-ct, .dt-dense .dn-ct { padding: 14px 0 18px; }

/* ── /app · /devices (app.css) ── */
.dt-dense .app-feats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dt-dense .app-feat { gap: 4px; padding: 12px 14px; }
.dt-dense .app-feat h3 { font-size: 16px; line-height: 1.4; }
.dt-dense .app-feat p { font-size: 14px; line-height: 1.55; }
.dt-dense .app-also { margin-top: 10px; font-size: 14px; line-height: 1.55; }
.dt-dense .app-shots { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.dt-dense .app-shot { gap: 6px; }
.dt-dense .app-shot figcaption { font-size: 14px; line-height: 1.45; }
.dt-dense .app-tiers { gap: 10px; }
.dt-dense .app-tier { gap: 5px; padding: 12px 14px; }
.dt-dense .app-tier h3 { font-size: 18px; }
.dt-dense .app-price { font-size: 18px; }
.dt-dense .app-fit { font-size: 14px; line-height: 1.5; }
.dt-dense .app-tier ul { gap: 2px; font-size: 14px; line-height: 1.5; }
.dt-dense .app-care { margin-top: 12px; padding: 12px 16px; gap: 6px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.dt-dense .app-care > * { grid-column: 1; }
.dt-dense .app-care > .dt-actions { grid-column: 2; grid-row: 1 / span 4; margin-top: 0; flex-direction: column; }
.dt-dense .app-care h3 { font-size: 18px; }
.dt-dense .app-care p { font-size: 14px; line-height: 1.55; }
.dt-dense .app-status { font-size: 14px; }
.dt-dense .app-status th { padding: 0 16px 6px 0; }
.dt-dense .app-status td { padding: 7px 16px 7px 0; line-height: 1.5; }
.dt-dense .app-live { margin-bottom: 12px !important; }
.dt-dense .app-live figcaption { margin-top: 6px !important; font-size: 14px; }
/* บท 2 คอลัมน์ในหน้า /app /devices: ภาพ/ตัวจำลอง ซ้าย · การ์ด ขวา */
.dn-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--dt-gap); align-items: start; }
.dn-split > * { min-width: 0; }
.dn-split .app-feats { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.dn-split .app-feats--one, .dt-dense .app-feats--one { grid-template-columns: minmax(0, 1fr); }
.dn-split--even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 1100px) { .dt-dense .app-shots { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 959px) { .dt-dense .app-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dn-split, .dn-split--even { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .dt-dense .app-feats, .dn-split .app-feats { grid-template-columns: minmax(0, 1fr); } .dt-dense .app-shots { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dt-dense .app-care { grid-template-columns: minmax(0, 1fr); } .dt-dense .app-care > .dt-actions { grid-column: 1; grid-row: auto; flex-direction: row; } }

/* ── /we-grow · /you-grow (home-v.css) ── */
.dt-dense .v-svc__head { margin-bottom: 12px; gap: var(--dt-gap); }
.dt-dense .v-svc__head .dt-lead { max-width: 60ch; }
.dt-dense .v-blk { margin-top: 16px; }
.dt-dense .v-bento { gap: 10px; }
.dt-dense .v-box { gap: 6px; }
.dt-dense .v-box .dt-actions { padding-top: 8px; }
.dt-dense .v-box--rd { gap: 16px; }
.dt-dense .v-env__head { margin-bottom: 8px; }
.dt-dense .v-env__panel { padding: 8px var(--dt-card-pad) 2px; }
.dt-dense .v-env__panel .dt-row { padding: 6px 0; }
.dt-dense .v-env p { font-size: 14px; }
.dt-dense .v-axis { padding-bottom: 6px; }
.dt-dense .n6-trace { height: 26px; }
.dt-dense .n6-dots { gap: 4px; max-width: 520px; }
.dt-dense .n6-legend { margin-top: 10px; gap: 6px 16px; font-size: 14px; }
.dt-dense .v-mini { min-height: 0; }
.dt-dense .v-cta { padding: 14px 16px; }
.dt-dense .dt-split { gap: var(--dt-gap); }
/* /you-grow: อุปกรณ์ + แอป แถวเดียวกัน */
.dt-dense .v-bento--pair { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); }
.dt-dense .v-bento--pair > .v-box { grid-column: auto; }
@media (max-width: 1000px) { .dt-dense .v-bento--pair { grid-template-columns: minmax(0, 1fr); } }

/* ── /plant-factory (pf-skin.css) ── */
.dt-dense .pfx-head { margin-bottom: 12px; }
.dt-dense .pfx-hero { padding-bottom: 12px; }
.dt-dense .pfx-hero__h { margin-top: 4px; }
.dt-dense .pfx-hero__base { margin-top: 14px; }
.dt-dense .pfx-hero__base .dt-ticker { padding-top: 10px; }
.dt-dense .pfx-hero__sub { font-size: 16px !important; }
.dt-dense .pfx-helix__grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); align-items: start; }
.dt-dense .pfx-fig__stage { max-width: 420px; }
.dt-dense .pfx-ana__i { padding: 8px 0; }
.dt-dense .pfx-ana h3 { font-size: 15px; }
.dt-dense .pfx-ana p { font-size: 14px; }
.dt-dense .pfx-helix__foot { margin-top: 10px; }
.dt-dense #vSpec { margin-top: 14px !important; }
.dt-dense .pkgrid { gap: 10px; }
.dt-dense .pk { padding: 18px 14px 14px; }
.dt-dense .pk .pkfor { min-height: 0; margin-top: 4px; }
.dt-dense .pk .pkprice { font-size: 28px; margin-top: 10px; }
.dt-dense .pk .pkunit { margin-top: 10px; padding-top: 8px; }
.dt-dense .pk ul { margin-top: 8px; gap: 4px; }
.dt-dense .pknote { margin-top: 12px; padding-top: 10px; line-height: 1.6; }
.dt-dense .pfx-river { padding: 8px 0; }
.dt-dense .pfx-dlv { margin-top: 10px; }
.dt-dense .pfx-dlv li { padding: 8px 0; font-size: 15px; }
.dt-dense .pfx-chart { padding: 14px 32px 12px 14px; }
.dt-dense .pfx-cust { text-align: left; }
.dt-dense .pfx-cust__in { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 20px; align-items: center; }
.dt-dense .pfx-cust__in > * { grid-column: 1; }
.dt-dense .pfx-cust__in > .dt-actions { grid-column: 2; grid-row: 1 / span 4; margin-top: 0; justify-content: flex-end; }
.dt-dense .pfx-cust .dt-lead { margin: 0; }
.dt-dense .pfx-cust__u { margin: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; justify-content: flex-start; }
.dt-dense .pfx-cfg-head { padding-bottom: 12px; }
.dt-dense .wrap { padding-bottom: 28px; gap: 12px; }
.dt-dense .step { padding: 14px 16px; }
.dt-dense .slab { margin-bottom: 10px; }
.dt-dense .cat { padding: 8px 4px 6px; }
.dt-dense .cat .e { font-size: 18px; }
.dt-dense .cat .t { margin-top: 2px; }
.dt-dense .search, .dt-dense .sel, .dt-dense .crin { padding: 9px 12px; }
.dt-dense .seg .segbtn { padding: 8px 12px; }
.dt-dense .opt { padding: 8px 12px; }
.dt-dense .fld { margin-bottom: 10px; }
.dt-dense .subblk { margin-top: 10px; padding-top: 10px; }
@media (max-width: 760px) { .dt-dense .pfx-helix__grid { grid-template-columns: minmax(0, 1fr); } .dt-dense .pfx-fig__stage { max-width: 320px; margin: 0 auto; } .dt-dense .pfx-cust__in { grid-template-columns: minmax(0, 1fr); } .dt-dense .pfx-cust__in > .dt-actions { grid-column: 1; grid-row: auto; justify-content: flex-start; } }

/* /plant-factory รอบ 2: ตัวจำลองแสงเตี้ยลง · ตัวเลือกพืชเรียง 2 คอลัมน์บนจอกว้าง */
.dt-dense .sim-sr__stage { height: clamp(220px, 36vh, 340px); min-height: 220px; }
/* (14 ต.ค. 69: ตัวเลือกพืชกลับเป็นคอลัมน์เดียว · 2 คอลัมน์ทำให้ช่องว่างไม่เท่ากัน) */


/* มือถือ: ตารางสถานะเป็นแถวเดียว (ชื่อ | ป้าย) · การ์ดอุปกรณ์ 2 คอลัมน์ */
@media (max-width: 700px) {
  .dt-dense .app-status tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, auto); gap: 4px 10px; align-items: center; padding: 7px 0; }
  .dt-dense .app-status td:last-child { width: auto; margin-top: 0; text-align: right; }
  .dt-dense .app-feat { padding: 10px 12px; }
}
@media (max-width: 640px) and (min-width: 360px) { .dn-split .app-feats:not(.app-feats--one) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
