/* Đồng Xanh (nongsan5) — trang trong theo mockup (giới thiệu, cửa hàng, sản phẩm, liên hệ), dùng chung lớp dx-* trang chủ */
.dxi-wrap { max-width: 1300px; margin: 0 auto; padding: 0 15px; }
.dxi-crumb { color: var(--dx-text) !important; font-size: 14.5px !important; margin: 0 0 16px !important; } .dxi-crumb a { color: var(--dx-text) !important; } .dxi-crumb i { font-style: normal; margin: 0 10px; }
.dxi-hero-in { height: 440px; } .dxi-hero .dx-hero-t { padding-top: 40px; } .dxi-title { font-size: 56px !important; } .dxi-lead-b { display: block; color: var(--dx-dark); font-size: 25px; font-weight: 700; margin-bottom: 14px; }
.dxi-farm { position: relative; } .dxi-farm > img { width: 92%; height: 400px; object-fit: cover; border-radius: 10px; } .dxi-farm .dx-pol { right: 0; bottom: 20px; width: 230px; transform: rotate(4deg); } .dxi-farm .dx-pol img { height: 190px; }
.dxi-vals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; } .dxi-vals p { display: flex; flex-direction: column; align-items: center; text-align: left; gap: 8px; background: #FAF7EF; border-radius: 12px; padding: 24px 34px; margin: 0 !important; color: var(--dx-text); font-size: 15px; line-height: 1.6; }
.dxi-vals img { width: 80px; height: 80px; } .dxi-vals b { color: var(--dx-ink); font-size: 19px; font-weight: 600; text-align: center; width: 100%; }
.dxi-mb0 { margin-bottom: 4px !important; } .dxi-subc { color: var(--dx-text) !important; font-size: 17px !important; margin: 0 0 18px !important; }
.dxi-jn { display: flex; align-items: flex-start; gap: 8px; } .dxi-jn p { flex: 1; margin: 0 !important; color: var(--dx-muted); font-size: 14.5px; } .dxi-jn img { width: 100%; height: 190px; object-fit: cover; border-radius: 8px; margin-bottom: 12px; } .dxi-jn b { display: block; color: var(--dx-ink); font-size: 16.5px; font-weight: 600; margin-bottom: 4px; } .dxi-jn i { font-style: normal; color: var(--dx-dark); font-size: 24px; margin-top: 80px; }
.dxi-cta .col { padding: 0 !important; } .dxi-cta-in { height: 340px; background-size: cover; background-position: right center; position: relative; display: flex; align-items: center; } .dxi-cta-in::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(30,86,49,.97) 0%, rgba(30,86,49,.85) 40%, rgba(30,86,49,0) 62%); }
.dxi-cta-in > div { position: relative; padding-left: max(80px, calc((100vw - 1300px) / 2 + 15px)); } .dxi-cta h2 { color: #fff !important; font-size: 50px !important; font-weight: 700 !important; line-height: 1.15 !important; margin: 0 0 12px !important; } .dxi-cta p { color: #fff !important; font-size: 19px; margin: 0 0 22px !important; }
.dxi-btn-w { background: #fff; color: var(--dx-dark) !important; } .dxi-btn-lw { border: 2px solid #fff; color: #fff !important; }
/* liên hệ */
.dxi-ct3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 30px; } .dxi-ct3 > div { display: flex; gap: 24px; align-items: center; background: #fff; border: 1px solid var(--dx-line); border-radius: 10px; padding: 18px 26px; }
.dxi-ct3 span { width: 88px; height: 88px; flex: 0 0 88px; border-radius: 50%; background: #EEF3E4; display: flex; align-items: center; justify-content: center; } .dxi-ct3 span img { width: 48px; height: 48px; }
.dxi-ct3 p { display: flex; flex-direction: column; margin: 0 !important; color: var(--dx-ink); font-size: 18px; font-weight: 600; } .dxi-ct3 .big { color: var(--dx-dark) !important; font-size: 30px; font-weight: 800; } .dxi-ct3 .mail { color: var(--dx-dark) !important; font-size: 16px; } .dxi-ct3 small { color: var(--dx-muted); font-size: 15px; font-weight: 400; } .dxi-ct3 b { color: var(--dx-text); font-size: 17px; font-weight: 400; line-height: 1.5; }
.dxi-form { background: #fff; border: 1px solid var(--dx-line); border-radius: 12px; padding: 26px 32px; } .dxi-form h2 { color: var(--dx-dark) !important; font-size: 32px !important; font-weight: 700 !important; margin: 0 !important; } .dxi-form > p { color: var(--dx-text); font-size: 17px; margin: 0 0 14px !important; }
.dxi-form .wpcf7 p { margin: 0 !important; } .dxi-form .wpcf7 br { display: none; } .dxi-form label { display: block; color: var(--dx-ink); font-size: 16px; font-weight: 600; margin: 0 0 12px; } .dxi-form label i { color: var(--dx-red); font-style: normal; }
.dxi-form input:not([type=submit]), .dxi-form select, .dxi-form textarea { margin: 6px 0 0 !important; border: 1.5px solid #D9D5C7 !important; border-radius: 6px !important; box-shadow: none !important; height: 46px; font-size: 15.5px !important; font-weight: 400; } .dxi-form textarea { height: 110px !important; min-height: 110px; }
.dxc-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .dxi-form input[type=submit] { background: var(--dx-dark) !important; color: #fff !important; border: 0 !important; border-radius: 30px !important; min-height: 52px; padding: 0 40px !important; font-size: 17px !important; font-weight: 600; text-transform: none; letter-spacing: 0; margin: 4px 0 0 !important; }
.dxi-ct-img { width: 100%; height: 100%; min-height: 560px; object-fit: cover; border-radius: 12px; } .dxi-map { width: 100%; height: 320px; border: 0; border-radius: 12px; display: block; margin-top: 26px; }
/* cửa hàng */
.dxi-sband { position: relative; height: 330px; background-color: var(--dx-cream); background-size: 55% auto; background-position: right center; background-repeat: no-repeat; display: flex; align-items: center; } .dxi-sband::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--dx-cream) 45%, rgba(250,247,239,0) 62%); }
.dxi-sband .dxi-wrap { position: relative; z-index: 2; width: 100%; } .dxi-sband .dx-sign { top: 120px; right: 50px; } .dxi-sband .dx-leaves { z-index: 1; }
.dxi-sgrid { display: grid; grid-template-columns: 290px 1fr; gap: 30px; padding-top: 24px; padding-bottom: 30px; } .dxi-side { display: flex; flex-direction: column; gap: 16px; }
.dxi-box { background: #fff; border-radius: 10px; padding: 16px 18px; box-shadow: 0 2px 12px rgba(30,86,49,.05); } .dxi-cats { padding: 0 0 8px; overflow: hidden; } .dxi-cats h3 { background: var(--dx-dark); color: #fff !important; font-size: 19px !important; font-weight: 600 !important; margin: 0 0 8px !important; padding: 12px 20px; }
.dxi-cats ul { list-style: none; margin: 0 !important; } .dxi-cats li { margin: 0 !important; border-bottom: 1px solid #EFEBDF; } .dxi-cats li:last-child { border: 0; } .dxi-cats a { display: flex; justify-content: space-between; padding: 10px 20px; color: var(--dx-text) !important; font-size: 16px; } .dxi-cats i { font-style: normal; color: var(--dx-muted); } .dxi-cats i::after { content: "  ›"; } .dxi-cats li.on a { background: #EEF3E4; color: var(--dx-dark) !important; font-weight: 600; box-shadow: inset 4px 0 0 var(--dx-dark); }
.dxi-h3 { color: var(--dx-ink) !important; font-size: 19px !important; font-weight: 600 !important; margin: 0 0 14px !important; } .dxi-range { height: 4px; background: var(--dx-dark); border-radius: 4px; margin: 12px 8px 12px !important; position: relative; } .dxi-range::before, .dxi-range::after { content: ""; position: absolute; top: -8px; width: 20px; height: 20px; border-radius: 50%; background: var(--dx-dark); } .dxi-range::before { left: -8px; } .dxi-range::after { right: -8px; }
.dxi-rl { display: flex; justify-content: space-between; color: var(--dx-text); font-size: 14px; margin: 0 0 12px !important; } .dxi-apply { display: block; text-align: center; background: var(--dx-dark); color: #fff !important; border-radius: 6px; padding: 9px; font-weight: 600; }
.dxi-fp { display: grid; grid-template-columns: 64px 1fr; gap: 14px; padding: 8px 0; border-top: 1px solid #EFEBDF; color: var(--dx-text) !important; font-size: 14.5px; } .dxi-fp img { width: 64px; height: 56px; object-fit: contain; } .dxi-fp b { display: block; color: var(--dx-red); font-size: 16px; }
.dxi-bar { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; } .dxi-bar p { margin: 0 !important; color: var(--dx-text); font-size: 15px; } .dxi-sort { margin-left: auto !important; background: #fff; border: 1px solid var(--dx-line); border-radius: 6px; padding: 8px 14px; white-space: nowrap; } .dxi-view { display: flex; gap: 6px; } .dxi-view b, .dxi-view span { width: 36px; height: 36px; border: 1px solid var(--dx-line); border-radius: 6px; display: flex; align-items: center; justify-content: center; background: #fff; } .dxi-view b { background: var(--dx-dark); color: #fff; }
.dxi-grid3 { grid-template-columns: repeat(3, 1fr); } .dxi-ccat { display: block; color: var(--dx-muted); font-size: 13px; } .dxi-pager { display: flex; justify-content: center; gap: 8px; } .dxi-pager .page-numbers { min-width: 38px; height: 38px; border: 1px solid var(--dx-line); border-radius: 6px; background: #fff; display: inline-flex; align-items: center; justify-content: center; color: var(--dx-ink); } .dxi-pager .current { background: var(--dx-dark); color: #fff; }
/* sản phẩm */
.dxi-crumb-d { margin: 18px 0 16px !important; } .dxi-pgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }
.dxi-gmain { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 2px 12px rgba(30,86,49,.05); } .dxi-gmain img { width: 100%; height: 440px; object-fit: contain; display: block; } .dxi-gth { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 14px; } .dxi-gth a { background: #fff; border: 2px solid transparent; border-radius: 8px; padding: 6px; } .dxi-gth a.on { border-color: var(--dx-dark); } .dxi-gth img { width: 100%; height: 100px; object-fit: cover; }
.dxi-ptag { display: inline-block; background: var(--dx-dark); color: #fff !important; border-radius: 999px; padding: 4px 16px; font-size: 14px; margin-bottom: 8px; } .dxi-ptitle { color: var(--dx-ink) !important; font-size: 40px !important; font-weight: 700 !important; line-height: 1.2 !important; margin: 0 0 4px !important; }
.dxi-psub { color: var(--dx-text) !important; font-size: 22px !important; font-style: italic; margin: 0 0 8px !important; } .dxi-stock { color: var(--dx-dark) !important; font-size: 15px !important; margin: 0 0 12px !important; padding-bottom: 12px; border-bottom: 1px solid var(--dx-line); } .dxi-stock::before { content: "● "; color: #3BA148; }
.dxi-price { color: var(--dx-text) !important; font-size: 20px !important; margin: 0 0 6px !important; } .dxi-price b { color: var(--dx-red); font-size: 34px; font-weight: 800; } .dxi-meta { color: var(--dx-text) !important; font-size: 15.5px !important; line-height: 1.7 !important; margin: 0 0 8px !important; } .dxi-short { color: var(--dx-text); font-size: 15.5px; line-height: 1.6; }
.dxi-hl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 12px 0 !important; } .dxi-hl span { display: flex; align-items: center; gap: 12px; color: var(--dx-ink); font-size: 14.5px; line-height: 1.35; } .dxi-hl img { width: 34px; height: 34px; }
.dxi-qty { display: flex; align-items: center; gap: 22px; color: var(--dx-text); font-size: 16px; margin: 0 0 14px !important; } .dxi-qty span { display: flex; border: 1px solid var(--dx-line); border-radius: 6px; } .dxi-qty i, .dxi-qty b { width: 44px; height: 40px; display: flex; align-items: center; justify-content: center; font-style: normal; } .dxi-qty b { border-left: 1px solid var(--dx-line); border-right: 1px solid var(--dx-line); }
.dxi-buy { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 12px !important; } .dxi-buy a, .dxi-call { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; border-radius: 8px; font-size: 18px; font-weight: 600; } .dxi-cart { background: var(--dx-dark); color: #fff !important; } .dxi-cart img { filter: brightness(0) invert(1); width: 26px; height: 26px; } .dxi-now { background: var(--dx-orange); color: #fff !important; }
.dxi-call { border: 1.5px solid var(--dx-dark); color: var(--dx-dark) !important; margin-bottom: 14px; } .dxi-call img { width: 26px; height: 26px; }
.dxi-trust { display: grid; grid-template-columns: repeat(3, 1fr); background: #EEF3E4; border-radius: 8px; padding: 12px 16px; margin: 0 !important; } .dxi-trust span { display: flex; align-items: center; gap: 12px; color: var(--dx-ink); font-size: 14px; line-height: 1.35; padding: 0 10px; border-right: 1px solid #D6DFC6; } .dxi-trust span:last-child { border: 0; } .dxi-trust img { width: 40px; height: 40px; }
.dxi-tabs { background: #fff; border-radius: 12px; padding: 8px 30px 26px; margin: 24px 0 20px; } .dxi-tabnav { display: flex; gap: 40px; border-bottom: 1px solid var(--dx-line); margin: 0 0 18px !important; } .dxi-tabnav a { color: var(--dx-text) !important; font-size: 18px; padding: 12px 30px; } .dxi-tabnav a.on { color: var(--dx-dark) !important; font-weight: 600; box-shadow: inset 0 -3px 0 var(--dx-dark); }
.dxi-tab { display: none; } .dxi-tab.on { display: block; } .dxi-desc { display: grid; grid-template-columns: 1.3fr 1fr; gap: 40px; } .dxi-desc h2 { color: var(--dx-ink) !important; font-size: 30px !important; font-weight: 700 !important; margin: 0 0 10px !important; } .dxi-desc h3 { color: var(--dx-ink) !important; font-size: 24px !important; font-weight: 700 !important; margin: 16px 0 8px !important; } .dxi-desc p { color: var(--dx-text); font-size: 16px; line-height: 1.6; }
.dxi-desc img { width: 100%; height: 320px; object-fit: cover; border-radius: 8px; margin-bottom: 12px; } .dxi-specs { width: 100%; border-collapse: separate; border-spacing: 0 4px; } .dxi-specs th, .dxi-specs td { background: #EEF3E4; padding: 8px 18px !important; font-size: 15px; border: 0 !important; text-transform: none; letter-spacing: 0; } .dxi-specs th { width: 40%; color: var(--dx-ink); font-weight: 600; border-radius: 6px 0 0 6px; } .dxi-specs td { color: var(--dx-text); border-radius: 0 6px 6px 0; }
.dxi-dots { margin: 6px 0 0 !important; padding-left: 20px; } .dxi-dots li { color: var(--dx-text); font-size: 16px; margin: 0 0 8px !important; } .dxi-dots li::marker { color: var(--dx-green); }
.dxi-rel { padding-bottom: 20px; } .dxi-garden { position: relative; display: flex; align-items: center; gap: 40px; min-height: 180px; border-radius: 999px 20px 20px 999px; background-color: #EEF3E4; background-size: auto 100%; background-position: 70% center; background-repeat: no-repeat; padding: 20px 60px; margin-bottom: 20px; overflow: hidden; }
.dxi-garden::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #EEF3E4 38%, rgba(238,243,228,0) 58%, rgba(238,243,228,0) 80%, #EEF3E4 92%); } .dxi-garden > * { position: relative; } .dxi-garden h2 { color: var(--dx-dark) !important; font-size: 32px !important; font-weight: 700 !important; line-height: 1.2 !important; margin: 0 0 8px !important; } .dxi-garden p { color: var(--dx-text); font-size: 15px; margin: 0 !important; max-width: 400px; } .dxi-garden .dx-script { margin-left: auto !important; color: var(--dx-dark); font-size: 24px; transform: rotate(-8deg); }
@media (max-width: 849px) {
  .dxi-title { font-size: 34px !important; } .dxi-farm > img { width: 100%; height: 280px; } .dxi-farm .dx-pol { display: none; } .dxi-vals, .dxi-ct3, .dxc-2, .dxi-sgrid, .dxi-pgrid, .dxi-desc, .dxi-buy, .dxi-trust { grid-template-columns: 1fr; } .dxi-jn { flex-direction: column; } .dxi-jn i { display: none; }
  .dxi-cta-in > div { padding: 30px 20px; } .dxi-cta h2 { font-size: 32px !important; } .dxi-cta-in::before { background: rgba(30,86,49,.82); } .dxi-ct-img { min-height: 300px; } .dxi-sband { background-size: cover; } .dxi-sband::before { background: rgba(250,247,239,.85); } .dxi-sband .dx-sign { display: none; }
  .dxi-grid3 { grid-template-columns: 1fr 1fr; } .dxi-bar { flex-wrap: wrap; } .dxi-gmain img { height: 300px; } .dxi-ptitle { font-size: 28px !important; } .dxi-hl { grid-template-columns: 1fr; } .dxi-tabs { padding: 8px 14px 20px; } .dxi-tabnav { gap: 6px; overflow-x: auto; } .dxi-tabnav a { padding: 10px; font-size: 15px; white-space: nowrap; } .dxi-garden { flex-direction: column; border-radius: 16px; padding: 24px; background-image: none !important; }
}
.wpcf7 .wpcf7-form-control-wrap { display: block; width: 100%; } .wpcf7 input:not([type=checkbox]):not([type=radio]):not([type=submit]), .wpcf7 select, .wpcf7 textarea { width: 100% !important; max-width: 100% !important; }

@media (min-width: 1200px) { .dxi-ct3 .mail, a.mail { white-space: nowrap; font-size: 14.5px; } }

/* cf7-pair: CF7 bọc 2 nhãn liền nhau trong 1 <p> -> lưới 2 cột chỉ còn 1 con */
.wpcf7-form div > p:has(> label ~ label) { display: contents; }