/* dh-cards R02 (LEAD131 27/10/2026, LO8T R03; sửa theo B3 vòng 1) — lưới thẻ 1/2/3/4 cột theo bề rộng khối (container query), biến thể
   --steps (đánh số) và --bento (thẻ đầu lớn). CSS thuần; JS chỉ để đo select_property_type. Tiền tố .dh-cards. */
.dh-cards{margin:28px 0;container-type:inline-size}
.dh-cards__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin:0;padding:0;list-style:none;counter-reset:dhc}
.dh-cards__card{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0;margin:0;padding:18px;border:1px solid var(--line,#c5c5b5);border-radius:10px;background:rgba(255,255,255,.45)}
.dh-cards.dh-cards .dh-cards__card>*{margin:0}
.dh-cards__card img{display:block;width:100%!important;height:auto!important;aspect-ratio:3/2;object-fit:cover;border-radius:6px}
.dh-cards.dh-cards .dh-cards__title{font-size:1.08em;font-weight:600;line-height:1.35}
.dh-cards__card p{line-height:1.7}
.dh-cards .dh-cards__link{display:inline-flex;align-items:center;align-self:flex-start;min-height:44px;margin-top:auto;padding:0;border:0;background:none;font:inherit;text-align:left;cursor:pointer;font-weight:500;color:var(--green,#2e3c2d);text-decoration:underline;text-underline-offset:3px}
.dh-cards.dh-cards .dh-cards__card>.dh-cards__link{margin-top:auto}
.dh-cards--link .dh-cards__link:after{content:"";position:absolute;inset:0;border-radius:10px}
.dh-cards--link .dh-cards__card:hover{border-color:var(--green,#2e3c2d)}
.dh-cards__link:focus-visible{outline:3px solid #c59f4c;outline-offset:3px}
.dh-cards--link .dh-cards__link:focus-visible{outline:0}
.dh-cards--link .dh-cards__link:focus-visible:after{outline:3px solid #c59f4c;outline-offset:3px}
.dh-cards--steps .dh-cards__card{counter-increment:dhc}
.dh-cards--steps .dh-cards__card:before{content:counter(dhc,decimal-leading-zero);font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--green,#2e3c2d)}
@container (min-width:480px){
  .dh-cards__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dh-cards--bento .dh-cards__card:first-child{grid-row:span 2}
}
@container (min-width:640px){.dh-cards[data-cols="3"] .dh-cards__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (min-width:900px){.dh-cards[data-cols="4"] .dh-cards__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
