/* Selected plot: a compact summary with optional, complete details. */
#plotCard{background:#fff;border:1px solid #dce2d8;border-radius:16px;box-shadow:0 8px 28px #20382e08;min-width:0}
#plotCard .plot-panel-heading{padding:24px 24px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
#plotCard .plot-panel-heading>div{min-width:0}
#plotCard .plot-kicker{font-size:10px;line-height:1.5;color:#7a8378;letter-spacing:.025em}
#plotCard h3{font:500 30px/1.2 Arial,sans-serif;letter-spacing:-1px;margin:6px 0 0;color:#203b2e;overflow-wrap:anywhere}
#plotCard .status{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 16px;font-size:14px;line-height:1.5;font-weight:700;border:1px solid #c7e2ce;border-radius:10px;background:#e8f4ec;color:#22643c;white-space:nowrap;flex-shrink:0}
#plotCard .status i{width:9px;height:9px;flex:none;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px #22643c0c}
#plotCard .status.sold{background:#fcecec;color:#ad3737;border-color:#edc7c7}
#plotCard .status.reserved{background:#fcf3dd;color:#8d650e;border-color:#ead7a6}
#plotCard .plot-location{font-size:11px;line-height:1.7;color:#778075;margin:12px 24px 18px;overflow-wrap:anywhere}
#plotCard .plot-location span{padding:0 5px;color:#b0b7ac}
#plotCard .plot-preview{position:relative;margin:0 16px;overflow:hidden;border-radius:9px;background:#e7ece3}
#plotCard .plot-preview img{display:block;width:100%;height:144px;object-fit:cover;object-position:center 58%}
#plotCard .plot-preview figcaption{position:absolute;right:8px;bottom:8px;padding:4px 7px;background:#172e27c9;color:#fff;border-radius:4px;font-size:9px;line-height:1.4}
#plotCard .plot-body{padding:0 24px 6px}
#plotCard .plot-spec{margin:0;padding:22px 0 20px;border-top:0;border-bottom:1px solid #edf0e9;gap:16px}
#plotCard .plot-spec>div{min-width:0}
#plotCard .plot-spec>div+div{border-left:1px solid #e8ece4;padding-left:20px}
#plotCard .plot-spec small{font-size:10px;line-height:1.5;color:#7b8377;margin-bottom:8px}
#plotCard .plot-spec strong{font:500 22px/1.2 Arial,sans-serif;letter-spacing:-.6px;white-space:nowrap}
#plotCard .plot-spec strong span{font-size:13px;color:#7b8377;letter-spacing:0;font-weight:400}
#plotCard .plot-total{border:0;padding:20px 0;gap:8px}
#plotCard .plot-total small{font-size:10px;color:#7b8377}
#plotCard .plot-total strong{font:500 31px/1.1 Arial,sans-serif;letter-spacing:-1px;font-variant-numeric:tabular-nums}
#plotCard .plot-actions{display:grid;gap:4px}
#plotCard .plot-actions button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:46px;padding:12px 16px;margin:0;font-size:11px;line-height:1.6;border-radius:7px}
#plotCard .plot-actions .primary{background:#244735;color:#fff;transition:background .15s;transform:none}
#plotCard .plot-actions .primary:hover{background:#355c46}
#plotCard #openInterior{border:0;background:transparent;color:#50664f;padding:10px 4px;min-height:42px}
#plotCard #openInterior:hover{color:#1b3d2b;background:#f5f7f2}
#plotCard .plot-more{margin-top:12px;border-top:1px solid #e6ebe1}
#plotCard .plot-more summary{display:flex;justify-content:space-between;align-items:center;gap:12px;list-style:none;cursor:pointer;font-size:11px;font-weight:500;padding:19px 0;color:#50654e;min-height:48px}
#plotCard .plot-more summary::-webkit-details-marker{display:none}
#plotCard .plot-more summary>span{font:20px Arial;color:#82917a;transition:transform .18s}
#plotCard .plot-more[open] summary>span{transform:rotate(45deg)}
#plotCard .plot-more summary:focus-visible{outline:2px solid #b99a62;outline-offset:3px;border-radius:4px}
#plotCard .plot-details{margin:0 0 14px}
#plotCard .plot-details>div{font-size:11px;gap:14px;padding:11px 0;align-items:baseline}
#plotCard .plot-details dt{min-width:0;line-height:1.6}
#plotCard .plot-details dd{max-width:48%;overflow-wrap:anywhere;color:#304d39}
#plotCard .plot-description{font-size:10px;line-height:1.8;color:#808879;margin:16px 0}
#plotCard .plot-calculator-link{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#3d6549;padding:10px 0}
#plotCard .architecture-label{margin:14px 0 18px;color:#788371;line-height:1.6}
#plotCard .concept-choice{font-size:11px;border-radius:6px;background:#f8faf6}
@media(max-width:850px){#plotCard .plot-preview img{height:180px}#plotCard .plot-panel-heading{padding-top:22px}}
@media(max-width:380px){#plotCard .plot-panel-heading{padding:20px 18px 0;gap:8px}#plotCard .plot-body{padding-left:18px;padding-right:18px}#plotCard .plot-location{margin-left:18px;margin-right:18px}#plotCard .status{font-size:14px;padding:12px 14px}#plotCard h3{font-size:27px}}
@media(prefers-reduced-motion:reduce){#plotCard *{transition:none!important}}

#plotCard .plot-more{overflow:hidden;overflow-anchor:none}
#plotCard .plot-more-content{display:flow-root}
#plotCard .plot-more.is-closing summary>span{transform:rotate(0)}
#plotCard .plot-more summary>span{transition:transform .3s cubic-bezier(.22,1,.36,1)}

.plot-hover-status{position:absolute;left:0;top:0;z-index:10;pointer-events:none;padding:10px 14px;background:#fff;border:1px solid #d9e5db;border-radius:9px;box-shadow:0 5px 18px #142d2426;line-height:1.5;max-width:calc(100% - 16px)}
.plot-hover-status[hidden]{display:none}
.plot-hover-status small{display:block;color:#748173;font:11px/1.5 Arial,sans-serif;margin-bottom:3px}
.plot-hover-status strong{display:flex;align-items:center;gap:8px;color:#22643c;font-size:12px;font-weight:600}
.plot-hover-status strong:before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor}
.plot-hover-status[data-status=sold] strong{color:#ad3737}
.plot-hover-status[data-status=reserved] strong{color:#8d650e}

.plot-hover-area{display:block;margin-top:7px;padding-top:7px;border-top:1px solid #e8ece5;color:#50604f;font-size:11px}

/* Compact plot hover card. */
.plot-hover-status{padding:7px 9px;border-radius:7px;line-height:1.35}
.plot-hover-status small{font-size:10px;margin-bottom:2px}
.plot-hover-status strong{font-size:11px;gap:6px}
.plot-hover-status strong:before{width:5px;height:5px}
.plot-hover-area{font-size:10px;margin-top:4px;padding-top:4px}
