.plots-grid {
display: grid;
gap: 28px;
grid-template-columns: repeat(3, 1fr);
margin: 25px 0 40px;
}
@media (max-width: 1024px) {
.plots-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.plots-grid {
grid-template-columns: 1fr;
}
}

/* =========== Card =========== */
.plot-card {
background: #ffffff;
border: 1px solid #e0e0e0;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
display: flex;
flex-direction: column;
transition: all 0.3s ease;
padding: 30px;
}

.plot-card:hover {
background-color: #121C59;
color: #ffffff;
}

.plot-card img {
width: 100%;
height: 220px;
object-fit: cover;
background: #f3f3f3;
border: 3px solid #121C59;
border-radius: 8px;
transition: border 0.3s ease;
}

.plot-card:hover img {
border-color: #ffffff;
}

/* =========== Card Body =========== */
.plot-card-body {
padding: 15px 18px 20px;
flex: 1;
display: flex;
flex-direction: column;
}

.plot-card-body h3 {
margin: 0 0 6px;
font-size: 19px;
color: #222;
transition: color 0.3s ease;
}

.plot-card:hover .plot-card-body h3 {
color: #ffffff;
}

.plot-card-body .desc {
color: #555;
font-size: 14px;
line-height: 1.45;
margin-bottom: 10px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
transition: color 0.3s ease;
}

.plot-card:hover .plot-card-body .desc {
color: #e0e0e0;
}

.plot-card-body .meta {
list-style: none;
padding: 0;
margin: 0 0 10px;
font-size: 14px;
color: #444;
}

.plot-card-body .meta li {
margin-bottom: 4px;
transition: color 0.3s ease;
}

.plot-card:hover .plot-card-body .meta li {
color: #e0e0e0;
}

details {
margin-top: auto;
border-top: 1px dashed #ccc;
padding-top: 8px;
font-size: 14px;
}
details summary {
cursor: pointer;
font-weight: 600;
outline: none;
}

/* =========== Land Type Badge =========== */
.land-type {
padding: 2px 6px;
border-radius: 4px;
color: white;
font-weight: bold;
display: inline-block;
font-size: 13px;
}

.land-type.commercial {
background-color: #d9534f; /* red */
}

.land-type.agricultural {
background-color: #5cb85c; /* green */
}

.land-type.industrial {
background-color: #5bc0de; /* blue */
}

/* =========== No‑plots message =========== */
.no-plots {
text-align: center;
margin: 45px 0;
font-size: 18px;
color: #777;
}

/* =========== Page Heading =========== */
.page-heading {
margin-top: 30px;
font-size: 26px;
text-align: center;
color: #333;
}.plots-grid {
display: grid;
gap: 28px;
grid-template-columns: repeat(3, 1fr);
margin: 25px 0 40px;
}
@media (max-width: 1024px) {
.plots-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.plots-grid {
grid-template-columns: 1fr;
}
}

/* =========== Card =========== */
.plot-card {
background: #ffffff;
border: 1px solid #e0e0e0;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
display: flex;
flex-direction: column;
transition: all 0.3s ease;
padding: 30px;
}

.plot-card:hover {
background-color: #121C59;
color: #ffffff;
}

.plot-card img {
width: 100%;
height: 220px;
object-fit: cover;
background: #f3f3f3;
border: 3px solid #121C59;
border-radius: 8px;
transition: border 0.3s ease;
}

.plot-card:hover img {
border-color: #ffffff;
}

/* =========== Card Body =========== */
.plot-card-body {
padding: 15px 18px 20px;
flex: 1;
display: flex;
flex-direction: column;
}

.plot-card-body h3 {
margin: 0 0 6px;
font-size: 19px;
color: #222;
transition: color 0.3s ease;
}

.plot-card:hover .plot-card-body h3 {
color: #ffffff;
}

.plot-card-body .desc {
color: #555;
font-size: 14px;
line-height: 1.45;
margin-bottom: 10px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
transition: color 0.3s ease;
}

.plot-card:hover .plot-card-body .desc {
color: #e0e0e0;
}

.plot-card-body .meta {
list-style: none;
padding: 0;
margin: 0 0 10px;
font-size: 14px;
color: #444;
}

.plot-card-body .meta li {
margin-bottom: 4px;
transition: color 0.3s ease;
}

.plot-card:hover .plot-card-body .meta li {
color: #e0e0e0;
}

details {
margin-top: auto;
border-top: 1px dashed #ccc;
padding-top: 8px;
font-size: 14px;
}
details summary {
cursor: pointer;
font-weight: 600;
outline: none;
}

/* =========== Land Type Badge =========== */
.land-type {
padding: 2px 6px;
border-radius: 4px;
color: white;
font-weight: bold;
display: inline-block;
font-size: 13px;
}

.land-type.commercial {
background-color: #d9534f; /* red */
}

.land-type.agricultural {
background-color: #5cb85c; /* green */
}

.land-type.industrial {
background-color: #5bc0de; /* blue */
}

/* =========== No‑plots message =========== */
.no-plots {
text-align: center;
margin: 45px 0;
font-size: 18px;
color: #777;
}

/* =========== Page Heading =========== */
.page-heading {
margin-top: 30px;
font-size: 26px;
text-align: center;
color: #333;
}