/* KETURAH × FAM — sub-page components (chapter pages generated by gen).
   Builds on css/main.css tokens + kxf-detail.css; champagne accent #9a906c.
   Covers: chapter sub-navigation, breadcrumb, prev/next, gallery grid,
   residence-hub cards, unit spec layout, downloads. */
:root{ --kxp-accent:#9a906c; }

/* ── chapter sub-navigation (under the hero) ─────────────────────────────── */
.kxp-subnav{position:sticky;top:0;z-index:40;background:rgba(8,8,8,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.kxp-subnav .in{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}
.kxp-crumb{display:flex;align-items:center;gap:9px;padding:13px 0 0;font-family:var(--ff-sans);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-4);flex-wrap:wrap}
.kxp-crumb a{color:var(--ink-4);transition:color .25s}
.kxp-crumb a:hover{color:var(--kxp-accent)}
.kxp-crumb .sep{opacity:.5}
.kxp-crumb .cur{color:var(--ink-2)}
.kxp-chips{display:flex;gap:4px;overflow-x:auto;padding:11px 0;margin:0;list-style:none;-ms-overflow-style:none;scrollbar-width:none}
.kxp-chips::-webkit-scrollbar{display:none}
.kxp-chips a{display:inline-block;white-space:nowrap;font-family:var(--ff-sans);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:8px 14px;border:1px solid transparent;border-radius:999px;transition:color .25s,border-color .25s,background .25s}
.kxp-chips a:hover{color:var(--ink)}
.kxp-chips a.is-active{color:#0c0c0c;background:var(--kxp-accent);border-color:var(--kxp-accent)}

/* ── prev / next ─────────────────────────────────────────────────────────── */
.kxp-prevnext{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
@media(max-width:600px){.kxp-prevnext{grid-template-columns:1fr}}
.kxp-prevnext a{background:#070707;padding:clamp(26px,3.4vw,46px) clamp(20px,3vw,40px);transition:background .35s}
.kxp-prevnext a:hover{background:#0c0c0c}
.kxp-prevnext .d{font-family:var(--ff-sans);font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:var(--kxp-accent);margin-bottom:10px}
.kxp-prevnext .t{font-family:var(--ff-serif);font-weight:400;font-size:clamp(20px,2.4vw,30px);color:var(--ink);line-height:1.05}
.kxp-prevnext .nx{text-align:right}

/* ── gallery grid ────────────────────────────────────────────────────────── */
.kxg{max-width:var(--container);margin:0 auto;padding:clamp(40px,5vw,72px) var(--gutter) clamp(56px,7vw,108px);display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:860px){.kxg{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.kxg{grid-template-columns:1fr}}
.kxg a{display:block;margin:0;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--line);cursor:zoom-in}
.kxg img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease,ease),filter .8s var(--ease,ease);filter:saturate(.92)}
.kxg a:hover img{transform:scale(1.05);filter:saturate(1)}

/* ── residences hub cards (image + body + link) ──────────────────────────── */
.kxp-res{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);max-width:var(--container);margin:0 auto}
@media(max-width:880px){.kxp-res{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.kxp-res{grid-template-columns:1fr}}
.kxp-rescard{display:flex;flex-direction:column;border:1px solid var(--line);background:#070707;overflow:hidden;transition:border-color .4s}
.kxp-rescard:hover{border-color:var(--line-2)}
.kxp-rescard .im{aspect-ratio:4/3;overflow:hidden}
.kxp-rescard .im img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease,ease)}
.kxp-rescard:hover .im img{transform:scale(1.05)}
.kxp-rescard .bd{padding:clamp(20px,2.2vw,28px);display:flex;flex-direction:column;flex:1}
.kxp-rescard h4{font-family:var(--ff-serif);font-weight:400;font-size:21px;line-height:1.08;margin:0 0 8px;color:var(--ink)}
.kxp-rescard .sp{font-family:var(--ff-sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4);margin-bottom:12px}
.kxp-rescard p{font-size:12px;line-height:1.7;color:var(--ink-3);margin:0 0 18px}
.kxp-rescard .go{margin-top:auto;font-family:var(--ff-sans);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--kxp-accent);display:inline-flex;align-items:center;gap:9px}
.kxp-rescard .go svg{width:20px;height:7px}

/* ── unit spec page ──────────────────────────────────────────────────────── */
.kxp-unit{max-width:var(--container);margin:0 auto;padding:clamp(48px,6vw,96px) var(--gutter)}
.kxp-specs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:clamp(34px,4vw,56px)}
@media(max-width:680px){.kxp-specs{grid-template-columns:repeat(2,1fr)}}
.kxp-spec{background:#060606;padding:clamp(20px,2.4vw,30px) clamp(14px,2vw,22px);text-align:center}
.kxp-spec .n{font-family:var(--ff-serif);font-weight:400;font-size:clamp(19px,2.2vw,28px);color:var(--ink);line-height:1.05}
.kxp-spec .l{margin-top:9px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-4)}
.kxp-lede{max-width:760px;font-size:14px;line-height:1.9;color:var(--ink-2)}
.kxp-plans{margin-top:clamp(20px,2.4vw,30px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:680px){.kxp-plans{grid-template-columns:1fr}}
.kxp-plan{border:1px solid var(--line);background:#fff;margin:0;cursor:zoom-in;overflow:hidden}
.kxp-plan img{display:block;width:100%;height:auto}
.kxp-plan .cap{background:#070707;border-top:1px solid var(--line);padding:13px 18px;display:flex;flex-direction:column;gap:5px}
.kxp-plan .cap .tl{font-family:var(--ff-sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.kxp-plan .cap .td{font-family:var(--ff-sans);font-size:11px;letter-spacing:.02em;color:var(--ink-3);text-transform:none}
/* types fallback table (no floor plan) */
.kxp-types{border:1px solid var(--line)}
.kxp-trow{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 18px;padding:14px clamp(16px,2vw,22px);border-bottom:1px solid var(--line)}
.kxp-trow:last-child{border-bottom:0}
.kxp-trow .tl{font-family:var(--ff-serif);font-size:17px;color:var(--ink)}
.kxp-trow .td{font-family:var(--ff-sans);font-size:12px;color:var(--ink-3)}
.kxp-faclist{list-style:none;margin:clamp(30px,3.6vw,48px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(24px,4vw,56px)}
@media(max-width:600px){.kxp-faclist{grid-template-columns:1fr}}
.kxp-faclist li{position:relative;padding:13px 0 13px 24px;border-top:1px solid var(--line);font-size:12.5px;color:var(--ink-2)}
.kxp-faclist li::before{content:"";position:absolute;left:0;top:20px;width:11px;height:1px;background:var(--kxp-accent)}
.kxp-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(34px,4vw,52px)}

/* ── downloads ───────────────────────────────────────────────────────────── */
.kxp-dl{max-width:760px;margin:0 auto;border:1px solid var(--line)}
.kxp-dlrow{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px clamp(18px,2.4vw,28px);border-bottom:1px solid var(--line);cursor:pointer;background:transparent;width:100%;text-align:left;color:inherit;transition:background .3s}
.kxp-dlrow:last-child{border-bottom:0}
.kxp-dlrow:hover{background:#0c0c0c}
.kxp-dlrow .nm{font-family:var(--ff-serif);font-size:19px;color:var(--ink)}
.kxp-dlrow .nm small{display:block;font-family:var(--ff-sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4);margin-top:5px}
.kxp-dlrow .ic{color:var(--kxp-accent);flex:0 0 auto}
.kxp-dlrow .ic svg{width:20px;height:20px}

/* ── section heading + facility cross-nav ────────────────────────────────── */
.kxp-h2{font-family:var(--ff-serif);font-weight:400;font-size:clamp(22px,2.6vw,34px);line-height:1.08;margin:clamp(34px,4vw,56px) 0 22px;color:var(--ink)}
.kxp-facnav{margin:clamp(32px,4vw,52px) 0 0;padding-top:26px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.kxp-facnav span{font-family:var(--ff-sans);font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--kxp-accent);margin-right:6px}
.kxp-facnav a{font-family:var(--ff-sans);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line-2);border-radius:999px;padding:8px 15px;transition:color .25s,border-color .25s}
.kxp-facnav a:hover{color:var(--ink);border-color:var(--kxp-accent)}

/* ── single-page scroll-to sections ──────────────────────────────────────── */
html{scroll-behavior:smooth}
/* overflow-x:hidden on <body> (main.css) turns body into a scroll container and
   breaks position:sticky for the chapter nav — `clip` prevents the side-scroll
   WITHOUT establishing a scroll container, so sticky works again. */
body{overflow-x:clip}
.kxd-anchor{scroll-margin-top:clamp(70px,9vh,96px)}
.kxd-anchor>section:first-child,.kxd-anchor>.kxd-band:first-child{border-top:0}
/* breadcrumb bar (chapter tabs removed — continuous scroll flow) */
.kxp-crumbnav{border-bottom:1px solid var(--line)}
.kxp-crumbnav .in{max-width:var(--container);margin:0 auto;padding:15px var(--gutter)}
.kxp-crumb{display:flex;align-items:center;gap:9px;font-family:var(--ff-sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-4);flex-wrap:wrap}
.kxp-crumb a{color:var(--ink-4);transition:color .25s}
.kxp-crumb a:hover{color:var(--kxp-accent)}
.kxp-crumb .sep{opacity:.5}
.kxp-crumb .cur{color:var(--ink-2)}
/* overview band image (was an empty black column) */
.kxd-bandimg{overflow:hidden;border:1px solid var(--line);align-self:stretch;min-height:260px}
.kxd-bandimg img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:760px){.kxd-bandimg{min-height:220px;margin-bottom:8px}}

/* ── detailed fact-sheet sections (Resort mansions + residences) ── */
.kxp-fs{margin-top:clamp(34px,4.4vw,64px)}
.kxp-story{max-width:880px}
.kxp-kick{display:block;font-family:var(--ff-sans);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--kxp-accent);margin-bottom:18px}
.kxp-kick em{font-style:normal;color:var(--ink-2)}
.kxp-statement{font-family:var(--ff-serif);font-weight:400;font-size:clamp(22px,2.9vw,38px);line-height:1.18;color:var(--ink);margin:0 0 22px}
.kxp-eyebrow{font-family:var(--ff-sans);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-4);margin:26px 0 13px;font-weight:400}
.kxp-mat{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 6px}
.kxp-mat span{font-family:var(--ff-sans);font-size:11px;letter-spacing:.04em;color:var(--ink-2);padding:8px 15px;border:1px solid var(--line-2);border-radius:999px}
.kxp-mat.kxp-tags{margin-top:14px}
.kxp-mat.kxp-tags span{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-4);border-color:var(--line);padding:6px 12px}
/* across the levels */
.kxp-levels{border:1px solid var(--line);border-bottom:0;margin-top:6px}
.kxp-level{display:grid;grid-template-columns:minmax(180px,260px) 1fr;gap:10px clamp(20px,3vw,46px);padding:18px clamp(16px,2vw,24px);border-bottom:1px solid var(--line)}
@media(max-width:640px){.kxp-level{grid-template-columns:1fr;gap:6px}}
.kxp-level .lv{font-family:var(--ff-serif);font-size:18px;color:var(--ink)}
.kxp-level .ld{font-size:13px;line-height:1.7;color:var(--ink-3)}
/* by the numbers */
.kxp-nums{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:6px}
@media(max-width:640px){.kxp-nums{grid-template-columns:1fr}}
.kxp-num{background:#060606;display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:15px clamp(16px,2vw,22px)}
.kxp-num .nk{font-family:var(--ff-sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-4)}
.kxp-num .nv{font-family:var(--ff-serif);font-size:15px;color:var(--ink);text-align:right}
/* residential wellness pathways */
.kxp-pathwrap{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:8px}
@media(max-width:860px){.kxp-pathwrap{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.kxp-pathwrap{grid-template-columns:1fr}}
.kxp-path{background:#060606;padding:22px clamp(16px,1.6vw,20px)}
.kxp-path .dh{font-family:var(--ff-sans);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--kxp-accent);margin-bottom:13px}
.kxp-path p{font-size:12px;line-height:1.65;color:var(--ink-3);margin:0}
/* interiors & craftsmanship — brand rows */
.kxp-brands{border:1px solid var(--line);border-bottom:0;margin-top:8px}
.kxp-brand{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:8px clamp(20px,3vw,46px);padding:16px clamp(16px,2vw,24px);border-bottom:1px solid var(--line)}
@media(max-width:640px){.kxp-brand{grid-template-columns:1fr;gap:4px}}
.kxp-brand .bk{font-family:var(--ff-sans);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-4)}
.kxp-brand .bv{font-size:13px;line-height:1.7;color:var(--ink-2)}
.kxp-faclist-2 li{font-size:12px}

/* top-of-page CTA bar on unit pages */
.kxp-topcta{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 clamp(30px,3.6vw,48px)}
@media(max-width:560px){.kxp-topcta{gap:9px}.kxp-topcta .btn-pill{flex:1 1 100%;justify-content:center}}

/* AEO FAQ block on unit pages */
.kxp-faqs{border:1px solid var(--line);border-bottom:0;margin-top:8px;max-width:900px}
.kxp-faq{padding:18px clamp(16px,2vw,24px);border-bottom:1px solid var(--line)}
.kxp-faq-q{font-family:var(--ff-serif);font-weight:400;font-size:clamp(16px,1.9vw,21px);line-height:1.2;color:var(--ink);margin:0 0 9px}
.kxp-faq-a{font-size:13px;line-height:1.75;color:var(--ink-3);margin:0}
