/* Master plan and plot list, in the manner of a printed site plan: plots coloured by size band on paper, a key card, one clean list. */
:root{--band-0:#f4e9cc;--band-1:#e8cf92;--band-2:#d29f4a;--band-3:#a2722a;--paper:#fbfcf5;--road:#d6cfbd}

/* solid header: page text no longer shows through it */
.site-header{background:var(--mint);-webkit-backdrop-filter:none;backdrop-filter:none}

.tv-plan__head{margin-bottom:36px}
.tv-plan .finder input{background:#fff}

/* plan + key */
.plan-board{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);gap:28px;align-items:stretch}
.tv-plan .plan-board .plan-frame{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:0;box-shadow:none;overflow:hidden}
.plan-board .site-plan{display:block;width:100%;height:auto}
.plan-board .plan-contours path{stroke:var(--forest);stroke-opacity:.13}
.plan-board .plan-contours path.M{stroke-opacity:.24}
.plan-board .plan-outline{fill:none;stroke:var(--forest-2);stroke-width:.8;stroke-dasharray:3 2.2;stroke-opacity:.7}
.plan-board .plan-road{stroke:var(--road);stroke-opacity:1}
.plan-board .plan-pond{fill:#8fbccd;fill-opacity:1;stroke:#6d9fb3;stroke-width:.4}
.plan-board .plan-plot polygon{fill-opacity:1;stroke:#fff;stroke-opacity:1;stroke-width:.7;transition:fill .2s,stroke .2s,opacity .2s}
.plan-board .plan-plot text{font:700 6.2px var(--sans);fill:var(--ink);fill-opacity:.9}
.plan-board .plan-plot.band-0 polygon{fill:var(--band-0)}
.plan-board .plan-plot.band-1 polygon{fill:var(--band-1)}
.plan-board .plan-plot.band-2 polygon{fill:var(--band-2)}
.plan-board .plan-plot.band-3 polygon{fill:var(--band-3)}
.plan-board .plan-plot.band-3 text{fill:#fff}
/* hover, selection, search and filter states keep the band visible underneath */
.plan-board .plan-plot.hot polygon,.plan-board .plan-plot:focus-visible polygon{fill:var(--forest-2)!important;fill-opacity:1!important;stroke:#fff!important;stroke-width:1!important}
.plan-board .plan-plot.hot text,.plan-board .plan-plot:focus-visible text{fill:#fff;fill-opacity:1}
.plan-board .plan-plot.selected polygon{stroke:var(--forest-3)!important;stroke-width:1.6!important;fill-opacity:1!important}
.plan-board .plan-plot.selected:not(.hot) polygon{fill:var(--gold)!important}
.plan-board .plan-plot.match polygon{fill-opacity:1!important;stroke:var(--forest-3)!important;stroke-width:1.2!important}
.plan-board .plan-plot.match.band-0:not(.hot):not(.selected) polygon{fill:var(--band-0)!important}.plan-board .plan-plot.match.band-1:not(.hot):not(.selected) polygon{fill:var(--band-1)!important}.plan-board .plan-plot.match.band-2:not(.hot):not(.selected) polygon{fill:var(--band-2)!important}.plan-board .plan-plot.match.band-3:not(.hot):not(.selected) polygon{fill:var(--band-3)!important}
.plan-board .plan-plot.dim{opacity:.28}
.plan-board .plan-plot.compared:not(.hot) polygon{stroke:var(--forest-3)!important;stroke-dasharray:2 1.2;stroke-width:1.1!important}
.plan-board .plan-plot.found polygon{fill:var(--forest-2)!important;stroke:#fff!important}
.plan-board .plan-plot.found text{fill:#fff}
.site-plan[data-band] .plan-plot{opacity:.25}
.site-plan[data-band="0"] .band-0,.site-plan[data-band="1"] .band-1,.site-plan[data-band="2"] .band-2,.site-plan[data-band="3"] .band-3{opacity:1}
.plan-board .plan-legend{color:var(--ink-2)}
.plan-board .plan-north i{background:var(--ink-2)}
.plan-board .plan-north i:before{border-bottom-color:var(--ink-2)}
.plan-board .plan-scale i{border-color:var(--ink-2)}

/* floating label */
.plan-tip{position:absolute;left:0;top:0;z-index:3;pointer-events:none;background:var(--forest-3);color:#fff;padding:12px 15px 11px;min-width:170px;box-shadow:0 12px 30px rgba(30,38,24,.3);display:grid;gap:2px;font:400 13px/1.45 var(--sans);transition:transform .12s var(--ease)}
.plan-tip[hidden]{display:none}
.plan-tip b{font:400 24px/1.1 var(--serif);margin-bottom:3px}
.plan-tip em{font:700 10px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi);font-style:normal;margin-top:5px}

/* key card */
.plan-key{background:#fff;border:1px solid var(--line);border-top:3px solid var(--gold);padding:30px 30px 26px;display:flex;flex-direction:column;gap:28px}
.key-stats{display:grid;grid-template-columns:repeat(3,auto);justify-content:space-between;gap:16px}
.key-stats b{display:block;font:400 clamp(36px,3.4vw,50px)/1 var(--serif);color:var(--forest-3)}
.key-stats span{display:block;margin-top:8px;font:700 10px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.key-h{margin:0 0 12px;font:700 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#8a6a22}
.key-bands,.key-land{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.key-bands li{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:12px;padding:7px 8px;margin:0 -8px;cursor:default;transition:background .2s}
.key-bands li:hover{background:var(--mint)}
.key-bands span{font-size:15px;color:var(--ink)}
.key-bands small{display:block;font-size:12px;color:var(--ink-2);line-height:1.3}
.key-bands b{font:700 14px/1 var(--sans);color:var(--forest-3)}
.key-land li{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--ink);padding:3px 0}
.key-note{margin:10px 0 0;font-size:13px;line-height:1.55;color:var(--ink-2)}
.sw{display:inline-block;width:24px;height:16px;flex:none;border:1px solid rgba(47,56,40,.14)}
.sw.band-0{background:var(--band-0)}.sw.band-1{background:var(--band-1)}.sw.band-2{background:var(--band-2)}.sw.band-3{background:var(--band-3)}
.sw-road{background:var(--road)}.sw-pond{background:#8fbccd}
.sw-edge{border:1.5px dashed var(--forest-2);background:transparent;opacity:.8}

/* the list */
.plots-list{max-width:1180px;margin:clamp(70px,9vw,120px) auto 0}
.list-head{max-width:640px;margin-bottom:26px}
.list-head p{margin:0;font-size:17px;color:var(--ink-2)}
.plots-list .tv-chips{max-width:none;margin:0 0 14px}
.plots-list .plot-tools{border-top:0;margin-bottom:0;min-height:0;padding:10px 0 14px}
.plot-table-wrap{border:1px solid var(--line);background:#fff}
.plot-table{width:100%;border-collapse:collapse;font-size:15px}
.plot-table thead th{position:sticky;top:76px;z-index:2;background:var(--forest-3);color:#fff;text-align:left;font:700 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;padding:15px 16px}
.plot-table th.num,.plot-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.plot-table td,.plot-table tbody th{padding:13px 16px;border-top:1px solid var(--line);vertical-align:middle;text-align:left;font-weight:400}
.plot-table tbody tr:nth-child(even){background:#f8faf2}
/* rows reuse .plot-cell for selection and hover, so undo the old card styling */
.plot-table tr.plot-cell{display:table-row;min-height:0;padding:0;border:0;box-shadow:none;cursor:pointer;transition:background .15s}
.plot-table tr.plot-cell:hover,.plot-table tr.plot-cell.hot{background:var(--mint)}
.plot-table tr.plot-cell.selected{background:var(--mint-2);box-shadow:inset 3px 0 var(--gold)}
.plot-table .c-no{font:400 26px/1 var(--serif);color:var(--forest-3);white-space:nowrap}
.plot-table .c-no .sw{width:12px;height:12px;margin-right:14px;vertical-align:middle;position:relative;top:-3px}
.plot-table .c-set{color:var(--ink);line-height:1.4}
.plot-table .plot-tags{display:block;margin-top:3px;font:700 10px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#8a6a22}
.plot-table .c-act{text-align:right;white-space:nowrap}
.see3d{border:1px solid var(--forest-2);background:transparent;color:var(--forest-3);padding:10px 14px;font:700 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.see3d:hover{background:var(--forest-3);color:#fff}
.row-enquire{margin-left:16px;font:700 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#1f7a4d;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}
.plot-table td.empty{padding:28px 16px;color:var(--ink-2)}
.plot-table .chip--clear{border:0;background:none;text-decoration:underline;color:var(--forest-3);cursor:pointer;font:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media(max-width:1080px){.plan-board{grid-template-columns:1fr}.plan-key{display:grid;grid-template-columns:1fr 1fr;gap:28px 40px}.key-stats{grid-column:1/-1;justify-content:start;gap:48px}}
@media(max-width:760px){
 .plan-key{display:flex;padding:24px 20px 20px}
 .key-stats{justify-content:space-between;gap:12px}
 .plan-tip{min-width:150px;padding:10px 12px}
 .plan-tip b{font-size:21px}
 .plot-table{font-size:14px}
 .plot-table .c-m2,.plot-table .c-act{display:none}
 .plot-table thead th{top:76px;padding:13px 10px;font-size:10px;letter-spacing:.1em}
 .plot-table td,.plot-table tbody th{padding:12px 10px}
 .plot-table .c-no{font-size:22px}
 .plot-table .c-no .sw{width:9px;height:9px;margin-right:9px}
 .plot-table .c-set{font-size:13px}
 .plot-table .plot-tags{font-size:9px}
}
.plot-filter[hidden],.plan-readout[hidden]{display:none!important}