/* KennethSek.com design system v2. Shared by the V2 pages (built by tools/build_v2_pages.py).
   Editorial direction: Concept A type and palette, Concept B decision-first structure, Concept C portrait and note.
   One stylesheet for every V2 page; components are in tools/build_v2_pages.py. */

/* ---------- 1. Tokens ---------- */
:root{
  --charcoal:#1c1c1a; --ink:#2a2926; --soft:#55524b; --muted:#5d5951;
  --ivory:#f7f4ec; --paper:#fffdf8; --stone:#e9e3d6;
  --line:rgba(28,28,26,.14); --line-soft:rgba(28,28,26,.08);
  --red:#c8102e;            /* RE/MAX red: eyebrows, numerals, rules. Never body text on ivory below 14px bold. */
  --blue:#003da5;           /* RE/MAX blue: focus ring only */
  --on-dark:#f1ece2; --on-dark-soft:rgba(241,236,226,.78); --red-on-dark:#ff8a8a;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --zh:'Noto Serif TC','PingFang HK','Microsoft JhengHei',serif;
  --wrap:1200px; --gutter:40px;
  --s1:8px; --s2:16px; --s3:24px; --s4:40px; --s5:64px; --s6:88px;
}
@media(max-width:720px){:root{--gutter:20px}}

/* ---------- 2. Base ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--ivory);color:var(--ink);font:300 1.0625rem/1.72 var(--sans);-webkit-font-smoothing:antialiased}
:lang(zh-Hant){font-family:var(--zh);font-weight:400;line-height:1.85}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-color:var(--red)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:10px 14px;z-index:10}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- 3. Type ---------- */
.eyebrow{font:500 .74rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.display{font:400 clamp(2.15rem,6.2vw,4.3rem)/1.04 var(--serif);letter-spacing:-.015em;color:var(--charcoal);margin:14px 0 18px;max-width:16ch}
.display em,h2 em{font-style:italic;font-weight:300}
.deck{font:400 italic clamp(1.15rem,2.2vw,1.45rem)/1.35 var(--serif);color:var(--soft);max-width:36ch;margin-bottom:22px}
h1.title{font:400 clamp(2.15rem,5.6vw,3.8rem)/1.06 var(--serif);letter-spacing:-.012em;color:var(--charcoal);margin:14px 0 18px;max-width:18ch}
h2{font:400 clamp(2rem,4.2vw,3.1rem)/1.08 var(--serif);color:var(--charcoal);letter-spacing:-.01em}
h3{font:400 1.32rem/1.25 var(--serif);color:var(--charcoal)}
.lede{font-size:1.12rem;line-height:1.55;color:var(--ink);max-width:58ch}
.intro{color:var(--soft);max-width:62ch;margin-top:14px}
.micro{font:400 .8rem/1.5 var(--sans);color:var(--muted);margin-top:12px}
.kicker{font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
@media(max-width:560px){.lede{font-size:1.02rem}}

/* ---------- 4. Buttons and links ---------- */
.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:14px 22px;font:500 .95rem/1.3 var(--sans);text-decoration:none;border:1px solid var(--charcoal);text-align:center}
.btn.primary{background:var(--charcoal);color:#fff}.btn.primary:hover{background:#000}
.btn.ghost{background:transparent;color:var(--charcoal)}
.on-dark .btn.ghost{color:#fff;border-color:rgba(255,255,255,.6)}
a.more{display:inline-flex;align-items:center;min-height:44px;margin-top:10px;font-weight:500}
@media(max-width:560px){.actions .btn{width:100%}}

/* ---------- 5. Masthead (brand left, brokerage name always visible) ---------- */
header.mast{background:var(--paper);border-bottom:1px solid var(--line);position:relative;z-index:2}
.mast .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px;padding-top:10px;padding-bottom:10px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0;min-height:44px}
.brand img{width:44px;height:44px;flex:none}
.brand b{display:block;font:500 1.2rem/1.1 var(--serif);color:var(--charcoal)}
.brand small{display:block;font:400 .72rem/1.3 var(--sans);color:var(--muted);margin-top:2px}
nav.top{display:flex;align-items:center;gap:20px;font:400 .86rem var(--sans)}
nav.top a{text-decoration:none;color:var(--soft);display:inline-flex;align-items:center;min-height:44px}
nav.top a[aria-current=page]{color:var(--charcoal);text-decoration:underline;text-decoration-color:var(--red)}
nav.top a.cta{color:#fff;background:var(--charcoal);padding:0 16px;white-space:nowrap;display:inline-flex;align-items:center;min-height:44px}
details.menu{display:none;position:relative}
details.menu summary{list-style:none;cursor:pointer;min-height:44px;min-width:44px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);font:500 .78rem var(--sans);padding:0 12px}
details.menu summary::-webkit-details-marker{display:none}
details.menu[open] .menu-panel{display:block}
.menu-panel{display:none;position:absolute;right:0;top:52px;background:var(--paper);border:1px solid var(--line);min-width:220px;padding:8px 0;box-shadow:0 12px 30px rgba(0,0,0,.08)}
.menu-panel a{display:flex;align-items:center;min-height:44px;padding:0 18px;text-decoration:none;color:var(--ink)}
@media(max-width:980px){nav.top a:not(.cta){display:none}details.menu{display:block}}
@media(max-width:600px){
  .mast .wrap{flex-wrap:wrap;gap:10px;padding-top:12px;padding-bottom:12px}
  .brand{flex:1 1 100%}.brand img{width:38px;height:38px}.brand b{font-size:1.1rem}.brand small{font-size:.68rem;white-space:nowrap}
  nav.top{flex:1 1 100%;gap:10px}details.menu{flex:none}nav.top a.cta{flex:1;justify-content:center}
  .menu-panel{left:0;right:auto}
}
.crumbs{font:400 .74rem var(--mono);color:var(--muted);padding:14px 0 0}
.crumbs a{text-decoration:none}

/* ---------- 6. Hero (decision-first) ---------- */
.hero{padding:34px 0 64px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:64px;align-items:start}
.proof{display:flex;flex-wrap:wrap;gap:10px 28px;margin:26px 0 30px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.proof div{font:400 .86rem/1.35 var(--sans);color:var(--soft)}
.proof b{display:block;font:400 1.6rem/1.1 var(--serif);color:var(--charcoal)}
.portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 12%}
.portrait figcaption{font:400 .76rem/1.45 var(--mono);color:var(--muted);margin-top:10px}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:32px}.portrait img{aspect-ratio:3/2;object-position:50% 18%}}
@media(max-width:560px){
  .hero{padding:22px 0 48px}
  .hero-copy{display:flex;flex-direction:column}
  .hero-copy .proof{order:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:4px 0 20px;padding:12px 0}
  .hero-copy .proof div{font-size:.74rem}.hero-copy .proof b{font-size:1.35rem}
  .hero-copy .actions{order:2}.hero-copy .micro{order:3}.hero-copy .lede{order:4;margin-top:22px}.hero-copy .note{order:5}
}

/* ---------- 7. Sections ---------- */
section.band{padding:var(--s6) 0;border-top:1px solid var(--line)}
section.band.alt{background:var(--paper)}
section.band.tint{background:var(--stone)}
.sec-head{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;margin-bottom:40px}
.sec-no{font:500 .74rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-top:12px}
@media(max-width:900px){section.band{padding:64px 0}.sec-head{grid-template-columns:1fr;gap:10px;margin-bottom:28px}}

/* ---------- 8. Decision article (the B pattern, editorial not cards) ---------- */
.question{display:grid;grid-template-columns:200px minmax(0,1fr) 300px;gap:40px;padding:44px 0;border-top:1px solid var(--line)}
.question:first-of-type{border-top:2px solid var(--charcoal)}
.q-no{font:300 3.4rem/1 var(--serif);color:var(--red)}
.question h3{font-size:clamp(1.6rem,3vw,2.15rem);line-height:1.15;margin-bottom:14px}
.question .short{font:400 1.12rem/1.6 var(--sans);color:var(--ink);margin-bottom:14px}
.question p+p{margin-top:.8em}
.question ul{margin:12px 0 0 1.1em}.question li{margin:.35em 0}
.question aside{font:400 .9rem/1.6 var(--sans);color:var(--soft);border-left:1px solid var(--line);padding-left:20px}
.question aside b{display:block;font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
@media(max-width:1060px){.question{grid-template-columns:200px minmax(0,1fr)}.question aside{grid-column:2}}
@media(max-width:900px){.question{grid-template-columns:1fr;gap:14px;padding:34px 0}.question aside{grid-column:auto;border-left:0;border-top:1px solid var(--line-soft);padding:14px 0 0}}

/* ---------- 9. Evidence (dated figures with a method note) ---------- */
.evidence{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}
.bigfig{border-top:2px solid var(--charcoal);padding-top:16px}
.bigfig .n{font:300 clamp(4rem,10vw,6.6rem)/.95 var(--serif);color:var(--charcoal);letter-spacing:-.02em}
.bigfig .n small{font-size:.38em;letter-spacing:0}
.bigfig p{margin-top:12px;max-width:46ch}
.method{font:400 .82rem/1.6 var(--sans);color:var(--soft);background:var(--stone);padding:16px 18px;margin-top:20px}
.method b{font-weight:600}
.figs{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px}
.figs div{border-top:1px solid var(--line);padding-top:12px;font-size:.92rem;color:var(--soft)}
.figs b{display:block;font:400 2rem/1.1 var(--serif);color:var(--charcoal)}
.recog{list-style:none;font-size:.88rem;color:var(--soft)}
.recog li{padding:9px 0;border-top:1px solid var(--line-soft)}
.recog li:first-child{border-top:2px solid var(--charcoal)}
@media(max-width:900px){.evidence{grid-template-columns:1fr;gap:36px}}

/* ---------- 10. Personal note (C pattern) ---------- */
.letter{display:grid;grid-template-columns:320px minmax(0,1fr);gap:56px;align-items:start}
.letter img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 10%}
.letter .body{font:400 1.18rem/1.7 var(--serif);color:var(--ink);max-width:60ch;margin-top:20px}
.letter .body p+p{margin-top:1em}
.sig{font:400 italic 1.5rem var(--serif);margin-top:22px;color:var(--charcoal)}
.sig small{display:block;font:400 normal .8rem var(--sans);color:var(--muted)}
@media(max-width:900px){.letter{grid-template-columns:1fr;gap:28px}.letter img{aspect-ratio:3/2;object-position:50% 20%}}

/* ---------- 11. Offer (dark band) and form card ---------- */
.offer{background:var(--charcoal);color:var(--on-dark);padding:var(--s6) 0}
.offer-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px}
.offer .eyebrow{color:var(--red-on-dark)}
.offer h2{color:#fff}
.offer ul{list-style:none;margin:22px 0}
.offer li{padding:14px 0 14px 28px;border-top:1px solid rgba(255,255,255,.16);position:relative}
.offer li::before{content:'';position:absolute;left:2px;top:23px;width:9px;height:9px;border:1px solid var(--red-on-dark);transform:rotate(45deg)}
.offer li b{font-weight:500;color:#fff}
.offer .terms{font-size:.9rem;color:var(--on-dark-soft)}
.formcard{background:var(--paper);color:var(--ink);padding:30px}
.formcard h3{font-size:1.5rem;margin-bottom:6px}
.formcard .sub{font-size:.88rem;color:var(--soft);margin-bottom:18px}
@media(max-width:900px){.offer-grid{grid-template-columns:1fr;gap:32px}.offer{padding:64px 0}}
@media(max-width:560px){.formcard{padding:22px 18px}}

/* ---------- 12. Lists, steps, myths, guides, FAQ ---------- */
ol.steps{list-style:none;counter-reset:st;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 40px}
ol.steps li{counter-increment:st;border-top:1px solid var(--charcoal);padding-top:14px}
ol.steps li::before{content:'0' counter(st);font:500 .74rem var(--mono);color:var(--red);display:block;margin-bottom:6px}
ol.steps h3,.pair h3{margin-bottom:6px}
ol.steps p,.pair p{font-size:.96rem;color:var(--soft)}
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 48px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}
ul.rules{list-style:none}
ul.rules li{padding:12px 0;border-top:1px solid var(--line)}
.myth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:30px;padding:24px 0;border-top:1px solid var(--line)}
.myth .claim{font:400 1.3rem/1.3 var(--serif);color:var(--muted)}
.myth .claim s{text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:1px}
.myth .claim small{display:block;font:500 .66rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--red);margin-bottom:4px}
.links4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.links4 a,.links3 a{display:block;text-decoration:none;border-top:1px solid var(--charcoal);padding:14px 0 6px;min-height:44px}
.links3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.links4 b,.links3 b{display:block;font:400 1.2rem/1.25 var(--serif);color:var(--charcoal)}
.links4 span,.links3 span{font-size:.88rem;color:var(--soft)}
.faq{columns:2;column-gap:56px}
.faq .qa{break-inside:avoid;padding:18px 0;border-top:1px solid var(--line)}
.faq h3{font-size:1.2rem;line-height:1.3;margin-bottom:6px}
.faq p{font-size:.95rem;color:var(--soft)}
@media(max-width:900px){ol.steps{grid-template-columns:1fr;gap:26px}.split{grid-template-columns:1fr;gap:26px}.links4{grid-template-columns:1fr 1fr}.links3{grid-template-columns:1fr}.faq{columns:1}}
@media(max-width:760px){.pair{grid-template-columns:1fr}.myth{grid-template-columns:1fr;gap:6px}}
@media(max-width:480px){.links4{grid-template-columns:1fr}}

/* ---------- 13. Cantonese band, closing CTA, footer ---------- */
.zh-band .inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center}
.zh-band p.zhtext{font:400 1.25rem/1.7 var(--zh)}
@media(max-width:760px){.zh-band .inner{grid-template-columns:1fr}}
.closing{text-align:center}
.closing .intro{margin:14px auto 26px}
footer.foot{background:var(--charcoal);color:var(--on-dark-soft);padding:48px 0;font:400 .84rem/1.7 var(--sans)}
footer.foot b{color:#fff;font-weight:500}
footer.foot a{color:var(--on-dark)}
footer.foot .brk-logo{width:190px;margin-bottom:16px}
footer.foot .cols{display:flex;flex-wrap:wrap;gap:8px 22px;margin:14px 0}
footer.foot .cols a{display:inline-flex;align-items:center;min-height:44px}

/* ---------- 14. Added in round 2 ---------- */
/* Seller hero: the live H1 leads as a short italic line, the display headline follows as text */
.kicker-h1{font:400 italic clamp(1.05rem,1.8vw,1.3rem)/1.4 var(--serif);color:var(--soft);max-width:44ch}
.sub{font:400 clamp(1.08rem,1.6vw,1.24rem)/1.55 var(--sans);color:var(--ink);max-width:54ch}
.hero .lede{margin-top:18px;font-size:.98rem;color:var(--soft)}
.after-q{margin-top:36px;padding-top:20px;border-top:2px solid var(--charcoal);font:400 1.1rem/1.6 var(--serif);color:var(--charcoal)}
.nbhd{margin-top:30px;padding-top:18px;border-top:1px solid var(--line);font:400 1.12rem/1.6 var(--serif);color:var(--charcoal);max-width:70ch}
ol.how{margin:10px 0 14px 1.2em}ol.how li{margin:.45em 0}
code{font:400 .85em var(--mono)}
/* Decision paths (homepage): situation, one-line answer, link to the full answer */
.paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;border-top:2px solid var(--charcoal)}
.path{display:block;text-decoration:none;padding:20px 0;border-bottom:1px solid var(--line);min-height:44px}
.path b{display:block;font:400 1.3rem/1.3 var(--serif);color:var(--charcoal)}
.path span{display:block;margin-top:4px;font-size:.95rem;color:var(--soft)}
.path:hover b{text-decoration:underline;text-decoration-color:var(--red)}
@media(max-width:760px){.paths{grid-template-columns:1fr}}
/* Quotes: verbatim, attributed, already published */
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
.quotes blockquote{border-top:1px solid var(--charcoal);padding-top:16px;font:400 italic 1.1rem/1.55 var(--serif);color:var(--charcoal)}
.quotes cite{display:block;margin-top:10px;font:400 normal .8rem var(--sans);color:var(--muted)}
@media(max-width:900px){.quotes{grid-template-columns:1fr;gap:24px}}
/* Data table (market figures, sold lists) */
table.ledger{width:100%;border-collapse:collapse;font-size:.92rem;margin:6px 0 16px}
.ledger caption{text-align:left;font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding-bottom:10px}
.ledger th{text-align:left;font:500 .7rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--charcoal);padding:8px 8px 8px 0}
.ledger td{border-bottom:1px solid var(--line-soft);padding:10px 8px 10px 0;vertical-align:top}
.ledger td.num{font-family:var(--mono);font-size:.84rem;white-space:nowrap}
.ledger .addr{display:block;font-weight:500;color:var(--charcoal)}
.ledger .area{display:block;color:var(--muted);font-size:.82rem}
@media(max-width:600px){.ledger thead{display:none}.ledger tr{display:grid;grid-template-columns:1fr 1fr;gap:2px 12px;border-bottom:1px solid var(--line-soft);padding:10px 0}
  .ledger td{border:0;padding:1px 0}.ledger td:first-child{grid-column:1/-1;font-weight:500}.ledger td.num{font-size:.8rem}}
/* Listing alerts form (live markup from site/buying.html, restyled) */
.af fieldset{border:0}
.af legend{font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.af-chips{display:flex;flex-wrap:wrap;gap:8px}
.af-chip{display:inline-flex}.af-chip input{position:absolute;opacity:0}
.af-chip span{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--line);font-size:.88rem;cursor:pointer}
.af-chip input:checked+span{background:var(--charcoal);color:#fff;border-color:var(--charcoal)}
.af-chip input:focus-visible+span{outline:2px solid var(--blue);outline-offset:2px}
.af-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.af-f{display:flex;flex-direction:column;gap:6px}.af-lbl{font:500 .72rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.af select,.af input[type=text],.af input[type=email],.af input[type=tel]{min-height:48px;border:1px solid var(--line);background:#fff;padding:0 12px;font:400 1rem var(--sans);color:var(--ink);width:100%}
.af details{margin-top:16px}.af summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:500}
.af button,.af [type=submit]{margin-top:18px;min-height:52px;width:100%;background:var(--charcoal);color:#fff;border:0;font:500 .95rem var(--sans);cursor:pointer}
.af p,.af small{font-size:.8rem;color:var(--muted)}
@media(max-width:560px){.af-grid{grid-template-columns:1fr}}
ul.rules.twocol{columns:2;column-gap:48px}ul.rules.twocol li{break-inside:avoid}
@media(max-width:760px){ul.rules.twocol{columns:1}}
blockquote.pull{margin:1.2em 0;padding-left:18px;border-left:2px solid var(--red);font:400 italic 1.15rem/1.55 var(--serif);color:var(--charcoal)}
.zh-band small{display:block;margin-top:10px;font:400 .82rem/1.5 var(--sans);color:var(--soft)}
/* Contact form (live markup from site/index.html, restyled) */
.contact-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form .form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.contact-form .form-label{font:500 .72rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.contact-form .form-input,.contact-form .form-select,.contact-form .form-textarea{min-height:48px;border:1px solid var(--line);background:#fff;padding:10px 12px;font:400 1rem var(--sans);color:var(--ink);width:100%}
.contact-form .form-textarea{min-height:110px}
.sms-consent{display:flex;gap:10px;align-items:flex-start;font-size:.78rem;line-height:1.5;color:var(--muted)}
.sms-consent input{margin-top:4px;width:20px;height:20px;flex:none}
.form-submit{margin-top:16px;min-height:52px;width:100%;background:var(--charcoal);color:#fff;border:0;font:500 .95rem var(--sans);cursor:pointer}
.contact-helper{font-size:.82rem;color:var(--muted);margin-top:10px}
@media(max-width:560px){.contact-form .form-row{grid-template-columns:1fr}}

.af-done{display:none}.af.done .af-done,.af-done.show,.af.is-done .af-done{display:block}
.af-done a{margin-right:16px}
.af.is-done>*:not(.af-done){display:none}
.af-done .af-done-email{color:var(--charcoal)!important}
/* ---------- 15. Neighbourhood pages ---------- */
.nb-map-wrap .nb-map{display:block;width:100%;height:auto;border:1px solid var(--line)}
.nb-map-wrap figcaption{font:400 .76rem/1.5 var(--mono);color:var(--muted);margin-top:8px}
.nb-map-link:hover rect,.nb-map-link:focus rect{fill:#f5edd9;stroke:#8a6a35}
dl.facts{display:grid;grid-template-columns:200px minmax(0,1fr);border-top:2px solid var(--charcoal)}
dl.facts dt,dl.facts dd{padding:12px 0;border-bottom:1px solid var(--line-soft)}
dl.facts dt{font:500 .72rem/1.8 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media(max-width:600px){dl.facts{grid-template-columns:1fr}dl.facts dt{border-bottom:0;padding-bottom:0}}
h2.h2s{font-size:clamp(1.5rem,2.6vw,1.9rem);margin-bottom:12px}
.split p+p{margin-top:.8em}
.ledger tr.total td{font-weight:500;border-top:1px solid var(--charcoal)}
.question .q-no{font-size:2.6rem}
/* ---------- 16. Chinese pages ---------- */
:lang(zh-Hant) .display,:lang(zh-Hant) h2,:lang(zh-Hant) h3{font-family:var(--zh);letter-spacing:0}
:lang(zh-Hant) .eyebrow,:lang(zh-Hant) .sec-no{letter-spacing:.06em}
:lang(zh-Hant) .display{max-width:14em}
/* Chinese typography: no synthetic italics, CJK-appropriate leading, Plex for Latin, system/Noto for Han */
:root{--zh:'IBM Plex Sans','PingFang HK','Noto Sans TC','Microsoft JhengHei',sans-serif;--zh-serif:'Songti TC','Noto Serif TC','Noto Serif CJK TC','PMingLiU','MingLiU',serif}
:lang(zh-Hant){font-family:var(--zh)}
:lang(zh-Hant) .display,:lang(zh-Hant) h2,:lang(zh-Hant) h3,:lang(zh-Hant) .brand b{font-family:var(--zh-serif);font-weight:500}
:lang(zh-Hant) .display{line-height:1.3;font-size:clamp(2rem,5.4vw,3.6rem)}
:lang(zh-Hant) h2{line-height:1.3}
:lang(zh-Hant) em,:lang(zh-Hant) .display em,:lang(zh-Hant) h2 em{font-style:normal;font-weight:400;color:var(--soft)}
:lang(zh-Hant) .zhtext{font-family:var(--zh-serif)}

/* ---------- 17. Production additions (R1) ---------- */
.page-updated{text-align:center;font:400 .76rem var(--sans);color:var(--muted);background:var(--paper);padding:18px var(--gutter);margin:0;border-top:1px solid var(--line)}
.visually-hidden-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
/* Current listings (live feed from the ksh-listings Worker; markup and homepage-ui.js unchanged) */
#listings .listing-header{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px}
#listings .listing-header p:last-child{font-size:.9rem;color:var(--soft);max-width:340px}
#listings .section-eyebrow{font:500 .74rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#listings .section-title{font:400 clamp(2rem,4.2vw,3.1rem)/1.08 var(--serif);color:var(--charcoal)}
#listings .section-title em{font-style:italic;font-weight:300}
.listing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.listing-grid[hidden]{display:none}
.listing-card{background:var(--paper);border-top:1px solid var(--charcoal)}
.listing-media{position:relative;background:var(--stone);aspect-ratio:4/3;overflow:hidden}
.listing-media img{width:100%;height:100%;object-fit:cover}
.listing-blank{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:var(--muted);font:400 .78rem var(--sans)}
.listing-blank svg{width:44px;height:44px;opacity:.6}
.listing-draft{position:absolute;top:12px;left:12px;background:var(--paper);padding:6px 10px;font:500 .62rem var(--mono);letter-spacing:.1em;text-transform:uppercase;max-width:85%}
.photo-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:1px solid var(--line);background:var(--paper);cursor:pointer;font-size:22px;color:var(--charcoal)}
.photo-prev{left:10px}.photo-next{right:10px}
.photo-count{position:absolute;bottom:12px;right:12px;background:var(--paper);padding:4px 9px;font:400 .72rem var(--mono)}
.listing-copy{padding:20px 0 0}
.listing-copy p{font:400 .82rem/1.7 var(--sans);color:var(--soft)}
.listing-copy h3{font-size:1.5rem;margin:8px 0}
.listing-meta{border-top:1px solid var(--line-soft);padding-top:12px;margin-top:12px}
.ui-outline{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;background:transparent;color:var(--charcoal);border:1px solid var(--charcoal);font:500 .88rem var(--sans);cursor:pointer;text-decoration:none}
.listing-copy .ui-outline{width:100%;margin-top:16px}
.listing-note{font:400 .8rem/1.7 var(--sans);color:var(--muted);margin-top:20px}
.listing-dialog{border:0;padding:0;width:min(1040px,94vw);max-height:92dvh;background:var(--paper);color:var(--ink);margin:auto;overflow:auto;box-shadow:0 20px 80px rgba(0,0,0,.25)}
.listing-dialog::backdrop{background:rgba(17,17,17,.7)}
.dialog-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--paper);border-bottom:1px solid var(--line)}
.dialog-top p{font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase}
.dialog-close{min-width:44px;min-height:44px;border:1px solid var(--line);background:transparent;font-size:23px;cursor:pointer}
.dialog-grid{display:flex;flex-direction:column}
.dialog-grid .listing-media{width:100%;aspect-ratio:16/9;max-height:60dvh}
.dialog-grid .listing-media img{object-fit:contain;position:absolute;inset:0}
.dialog-grid .listing-blank{position:absolute;inset:0}
.listing-thumbnails{display:flex;gap:10px;padding:12px 20px;overflow-x:auto;background:var(--stone)}
.listing-thumbnail{flex:0 0 88px;height:60px;padding:3px;background:transparent;border:2px solid transparent;cursor:pointer}
.listing-thumbnail img{width:100%;height:100%;object-fit:cover}
.listing-thumbnail[aria-pressed=true]{border-color:var(--charcoal)}
.dialog-content{padding:28px 32px 36px}
.dialog-content h2{font-size:2rem;margin:10px 0 16px}
.dialog-content p{font-size:.92rem;color:var(--soft)}
.dialog-content dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 24px;margin:20px 0}
.dialog-content dt{font:500 .7rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dialog-content dd{font-size:.92rem;margin:4px 0 0;overflow-wrap:anywhere}
#listing-enquire{display:inline-flex;margin:22px 0}
.dialog-help{padding-top:18px;border-top:1px solid var(--line);font-size:.8rem!important}
@media(max-width:900px){.listing-grid{grid-template-columns:1fr}#listings .listing-header{display:block}.dialog-content{padding:22px}.dialog-content dl{grid-template-columns:1fr 1fr}}
/* Legacy token aliases: carried-over form markup (contact form, listing alerts) uses inline styles with the
   pre-V2 variable names. Mapping them keeps that markup unchanged and on-brand. */
:root{--cream:var(--paper);--gold:var(--charcoal);--gold-pale:var(--stone);--white:#fff;--ink-soft:var(--soft);--ink-muted:var(--muted);--border:var(--line);--border-soft:var(--line)}
.contact-form .form-note{font-size:.82rem;color:var(--muted);margin-top:10px}
.sub+.actions{margin-top:26px}