/* kapish.css — Kapish Homes' page (kapish-homes.html, Nov 7, 2026), on top of /assets/vita/builder.css: the community map
   (the developer's drawing, zoomable, Kapish's lots in colour — the inventory app's map colours), the plan chips with their
   prices, the plans row, the spec home and the visit facts. Phone first; on a computer every block shares one column. */
:root{--km-land:#E7E3D6;--km-road:#F6F4EC;--km-park:#D6DFC6;--km-water:#C9DCE1;--km-trail:#C4BBA0;--km-lot:#FBFAF4;--km-lot-line:rgba(52,47,28,.28);--km-open:#544E2E;--km-open-ink:#F7F5EE;--km-spec:#B9862A;--km-spec-ink:#1D1A10;}
html.sar-dark{--km-land:#151410;--km-road:#22211A;--km-park:#1E2619;--km-water:#16252A;--km-trail:#3A3626;--km-lot:#1C1B14;--km-lot-line:rgba(232,228,214,.22);--km-open:#C9BE9A;--km-open-ink:#0B0A07;--km-spec:#E7C680;--km-spec-ink:#1D1A10;}

/* ---- the map ---- */
.km{padding:8px;}
.km-box{position:relative;touch-action:pan-y;user-select:none;-webkit-user-select:none;border-radius:14px;overflow:hidden;background:var(--km-land);}
.km-box.zoomed{touch-action:none;}
.vx svg.km-svg{display:block;width:100%;height:auto;aspect-ratio:318/296;max-height:72vh;stroke:none;cursor:grab;}
.km-svg .a-land{fill:var(--km-land);}
.km-svg .a-road,.km-svg .a-school{fill:var(--km-road);}
.km-svg .a-park{fill:var(--km-park);}
.km-svg .a-field,.km-svg .a-play{fill:var(--km-park);opacity:.8;}
.km-svg .a-water{fill:var(--km-water);}
.km-svg .a-trail,.km-svg .a-bld{fill:var(--km-trail);}
.km-svg .a-stage{fill:none;stroke:var(--ink3);stroke-width:1;stroke-dasharray:4 3;vector-effect:non-scaling-stroke;pointer-events:none;}
.km-svg .lot{fill:var(--km-lot);stroke:var(--km-lot-line);stroke-width:.4;vector-effect:non-scaling-stroke;}
.km-svg .lot.far{opacity:.72;}
.km-svg .lot.ours{cursor:pointer;stroke:var(--card);stroke-width:1.2;outline:none;}
.km-svg .lot.st-open{fill:var(--km-open);}
.km-svg .lot.st-spec{fill:var(--km-spec);}
.km-svg .lot.ours:hover{filter:brightness(1.15);}
.km-svg .lot.ours[aria-pressed="true"]{fill:var(--gold);stroke:var(--ink);stroke-width:2.4;}
.km-svg .lot.ours:focus-visible{stroke:var(--gold);stroke-width:3;}
.km-svg .num{fill:var(--km-open-ink);font-family:var(--sans);font-weight:600;text-anchor:middle;dominant-baseline:central;pointer-events:none;}
.km-svg .num.st-spec{fill:var(--km-spec-ink);}
.km-svg .num.on{fill:var(--card);}
html.sar-dark .km-svg .num.on{fill:#0B0A07;}
.km-svg .street{fill:var(--ink3);font-family:var(--sans);font-weight:500;letter-spacing:.12em;text-anchor:middle;dominant-baseline:central;pointer-events:none;}
.km-svg .t-water{fill:#4F7C88;} .km-svg .t-green{fill:#5E7146;} .km-svg .t-area,.km-svg .t-school{fill:var(--ink3);letter-spacing:.2em;}
.km-svg .m-tag rect{fill:var(--ink);opacity:.86;}
.km-svg .m-tag text{fill:var(--bg);font:600 18px var(--sans);text-anchor:middle;dominant-baseline:central;letter-spacing:.04em;}
.km-box.close .m-tag{display:none;}
.km-zoom{position:absolute;right:10px;bottom:10px;display:grid;gap:6px;}
.vx .km-zoom button{width:44px;height:44px;padding:0;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;box-shadow:var(--shadow);cursor:pointer;}
.vx .km-zoom button:disabled{opacity:.4;cursor:default;}
.km-zoom svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.km-view{position:absolute;left:10px;top:10px;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 20px);}
.vx .km-view .chip{min-height:40px;background:var(--card);box-shadow:var(--shadow);font-size:13px;}
.km-box.full{position:fixed;inset:0;z-index:95;border-radius:0;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);}
.vx .km-box.full svg.km-svg{width:100%;height:100%;max-height:none;aspect-ratio:auto;}
.km-box.full .km-zoom{right:calc(14px + env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom));}
.km-box.full .km-view{top:calc(12px + env(safe-area-inset-top));}
body.km-full{overflow:hidden;}
.plan .k-open{background:var(--km-open);border-color:var(--km-open)!important;}
.plan .k-spec{background:var(--km-spec);border-color:var(--km-spec)!important;}
.plan .k-far{background:var(--km-lot);border-color:var(--km-lot-line)!important;}
.km figcaption .linkish{margin-right:12px;}

/* ---- the lot panel: plan chips with prices, the suite option, the rebate ---- */
.kp-ch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px;}
@media (min-width:560px){.kp-ch{grid-template-columns:repeat(3,minmax(0,1fr));}}
.vx .kp-ch .chip{flex-direction:column;align-items:flex-start;justify-content:center;min-height:56px;padding:8px 12px;text-align:left;line-height:1.25;white-space:normal;}
.kp-ch .chip span{font-size:14px;color:var(--ink);}
.kp-ch .chip small{font-size:11.5px;color:var(--ink3);}
.vx .kp-ch .chip[aria-pressed="true"] span,.vx .kp-ch .chip[aria-pressed="true"] small{color:inherit;}
.k-opt{display:flex;align-items:center;gap:10px;min-height:48px;margin-top:10px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);cursor:pointer;font-size:14px;color:var(--ink2);}
.k-opt input{width:20px;height:20px;accent-color:var(--olive);flex:none;}
.k-opt b{color:var(--ink);font-weight:500;}
.k-opt small{color:var(--ink3);}
.lp-money .m-row.reb b{color:var(--ok);}
.lp-say .linkish{min-height:0;font-size:inherit;}

/* ---- the plans ---- */
.kp-list{gap:14px;align-items:stretch;}
.kp-list>.kp{width:min(78vw,340px);}
@media (min-width:1100px){.kp-list.rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;overflow:visible;padding:0;margin-inline:0;} .kp-list>.kp{width:auto;}}
.kp{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:var(--card);border:1px solid var(--line);}
.vx .kp-img,.vx .ks-img{position:relative;display:block;width:100%;padding:0;border:0;background:#fff;cursor:zoom-in;}
.kp-img img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center top;}
.kp-tag{position:absolute;left:10px;top:10px;padding:5px 9px;border-radius:999px;background:var(--olive);color:#F4F2EB;font:500 10.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;}
.kp-b{display:flex;flex-direction:column;gap:8px;padding:16px 16px 18px;flex:1;}
.kp-b h3{font-size:clamp(21px,5vw,25px);line-height:1.15;}
.kp-f{margin:0;font-size:14px;color:var(--ink2);} .kp-f b{color:var(--ink);font-weight:500;}
.kp-fit{margin:0;font-size:12.5px;color:var(--gold);}
.kp .des-a .btn{flex:1 1 130px;}

/* ---- the spec home ---- */
.ks{display:grid;gap:0;border-radius:20px;overflow:hidden;background:var(--card);border:1px solid var(--line);}
@media (min-width:860px){.ks{grid-template-columns:minmax(0,5fr) minmax(0,6fr);}}
.ks-img img{display:block;width:100%;height:100%;max-height:520px;object-fit:cover;object-position:center top;}
.ks-b{display:flex;flex-direction:column;gap:10px;padding:18px;}
.ks-b h3{font-size:clamp(26px,6vw,34px);line-height:1.1;}
.ks .des-h li{font-size:14px;}

/* ---- visit ---- */
.kf{display:grid;gap:8px;grid-template-columns:minmax(0,1fr);margin:0;}
@media (min-width:760px){.kf{grid-template-columns:repeat(2,minmax(0,1fr));}}
.kf div{padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line);}
.kf dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);}
.kf dd{margin:4px 0 0;font:400 17px/1.35 var(--serif);color:var(--ink);}
.kc{margin-top:14px;padding:14px 16px;border-radius:14px;border:1px dashed var(--line2);}
.kc .eyebrow{margin:0 0 6px;}
.kc ul{margin:0 0 10px;padding-left:18px;font-size:14px;line-height:1.6;color:var(--ink2);}
#visit .des-a{margin-top:14px;}
#visit .des-a .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;margin-right:6px;}

/* ---- the header: room for "Back" above the breadcrumb when the words fill the photo (a phone) ---- */
.kap .bh-in{padding-top:calc(var(--navh) + 76px);}
@media (max-width:859px){.ks-img img{max-height:380px;}}

/* Fadi, Nov 9: one line at the top instead of the price figures */
.bh .bh-from{margin:18px 0 0;font:400 24px/1.25 var(--serif);}
.bh .bh-from b{font-weight:400;white-space:nowrap;}