/* Karya Sentosa | Property & Potential | Frontend V14.
   Scoped components: no modification of the V13 renovation/project layouts. */
.ks-property { --kp-ink:#10283f; --kp-muted:#536474; --kp-line:#dcdedc; --kp-paper:#fbf7ef; --kp-orange:#bc4d12; }
.ks-property .kp-wrap { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.ks-property main { overflow:clip; }
.ks-property .kp-section { padding:72px 0; }
.ks-property .kp-white { background:#fffefa; }
.ks-property .kp-label { display:block; color:var(--kp-orange); font-size:11px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; line-height:1.6; }
.ks-property .kp-overline { display:flex; align-items:center; gap:11px; color:#174a7e; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; line-height:1.6; }
.ks-property .kp-overline::before { content:""; width:27px; height:2px; background:#ef6b19; flex:none; }
.ks-property h1 { font-size:clamp(40px,4.7vw,65px); line-height:1.04; letter-spacing:-.038em; margin:20px 0; }
.ks-property h2 { font-size:clamp(31px,3.15vw,44px); line-height:1.12; letter-spacing:-.03em; }
.ks-property h3 { font-size:21px; line-height:1.3; letter-spacing:-.02em; }
.ks-property p { margin:0 0 16px; }
.ks-property .kp-lead { font-size:18px; line-height:1.7; color:var(--kp-muted); max-width:650px; }
.ks-property .kp-small { font-size:13px; line-height:1.7; color:var(--kp-muted); }
.ks-property .kp-crumb { font-size:12px; color:var(--kp-muted); margin-bottom:28px; display:flex; flex-wrap:wrap; gap:9px; }
.ks-property .kp-crumb a { text-decoration:none; }
.ks-property .kp-hero { padding:48px 0 58px; }
.ks-property .kp-hero-grid { display:grid; grid-template-columns:1.12fr .88fr; gap:66px; align-items:center; }
.ks-property .kp-hero h1 em { color:#b94c16; font-weight:inherit; }
.ks-property .kp-actions { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:26px; }
.ks-property .kp-button { display:inline-flex; justify-content:center; align-items:center; gap:12px; min-height:48px; padding:13px 21px; border:1px solid #0b315d; background:#0b315d; color:#fff; border-radius:7px; font-weight:750; font-size:14px; line-height:1.5; text-decoration:none; cursor:pointer; transition:transform .2s ease,background .2s ease; }
.ks-property .kp-button:hover { transform:translateY(-2px); background:#164a7b; }
.ks-property .kp-button.kp-ghost { background:transparent; color:#0b315d; border-color:#c5cbc9; }
.ks-property .kp-link { display:inline-flex; align-items:center; gap:10px; font-size:14px; color:#0b315d; font-weight:700; text-decoration:none; padding:10px 0; border-bottom:1px solid #0b315d; }
.ks-property :is(a,button,input,select):focus-visible { outline:3px solid #db671f; outline-offset:4px; }
.ks-property .kp-icon { width:25px; height:25px; display:block; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.ks-property .kp-sheet { border:1px solid #d9d8d0; border-radius:12px; padding:27px; background:#fffefa; box-shadow:0 16px 40px rgba(16,40,63,.06); }
.ks-property .kp-sheet-top { display:flex; justify-content:space-between; align-items:center; gap:14px; padding-bottom:18px; border-bottom:1px solid #e4e2dc; }
.ks-property .kp-sheet-top span { font-size:10px; letter-spacing:.13em; font-weight:800; color:#657482; }
.ks-property .kp-sheet-top b { font-family:Georgia,serif; font-size:20px; }
.ks-property .kp-sheet-pair { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:22px 0; }
.ks-property .kp-sheet-tile { aspect-ratio:1.14; border:1px solid #e2dfd6; border-radius:6px; background:#f2eee7; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:17px; text-align:center; font-size:11px; font-weight:700; line-height:1.55; padding:14px; }
.ks-property .kp-sheet-tile .kp-icon { width:40px; height:40px; color:#315777; }
.ks-property .kp-sheet-tile.kp-navy { background:#102d4b; color:#fff; border-color:#102d4b; }
.ks-property .kp-sheet-tile.kp-navy .kp-icon { color:#efa065; }
.ks-property .kp-sheet-row { padding:13px 0; display:flex; justify-content:space-between; gap:20px; border-top:1px solid #e8e5df; font-size:12px; }
.ks-property .kp-sheet-row span { color:#607282; }
.ks-property .kp-sheet-foot { font-size:12px; line-height:1.6; color:#6b726f; margin:18px 0 0; }
.ks-property .kp-principles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-block:1px solid #ddd8cf; }
.ks-property .kp-principle { padding:25px 29px; display:flex; align-items:flex-start; gap:17px; border-right:1px solid #ddd8cf; }
.ks-property .kp-principle:first-child { padding-left:0; }
.ks-property .kp-principle:last-child { border-right:0; }
.ks-property .kp-principle b { display:block; font-size:14px; margin-bottom:3px; }
.ks-property .kp-principle p { font-size:12px; color:var(--kp-muted); margin:0; }
.ks-property .kp-section-head { display:flex; justify-content:space-between; gap:40px; align-items:flex-end; margin-bottom:27px; }
.ks-property .kp-section-head h2 { margin:9px 0 0; }
.ks-property .kp-section-head p { max-width:380px; color:var(--kp-muted); font-size:14px; margin:0; }
.ks-property .kp-filters { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:14px; padding:20px; background:#f2eee6; border-radius:9px; margin-bottom:24px; }
.ks-property .kp-field { display:flex; flex-direction:column; gap:7px; min-width:0; }
.ks-property .kp-field label { font-size:12px; font-weight:750; }
.ks-property .kp-field :is(input,select) { width:100%; min-height:48px; border:1px solid #c6cecc; border-radius:5px; padding:10px 12px; background:#fffefa; color:#10283f; font-size:15px; }
.ks-property .kp-empty { display:flex; gap:22px; align-items:flex-start; border:1px solid #ddd8cf; border-radius:9px; padding:28px; background:#fffefa; }
.ks-property .kp-empty .kp-icon { width:30px; height:30px; color:#b85825; }
.ks-property .kp-empty h3 { font-size:19px; margin:0 0 9px; }
.ks-property .kp-empty p { font-size:14px; color:var(--kp-muted); max-width:660px; margin:0 0 12px; }
.ks-property .kp-catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.ks-property .kp-catalog-card { border:1px solid #ddd8cf; border-radius:10px; overflow:hidden; background:#fffefa; display:flex; flex-direction:column; }
.ks-property .kp-catalog-card .kp-card-image { width:100%; aspect-ratio:4/3; object-fit:cover; background:#f2eee6; }
.ks-property .kp-catalog-card .kp-card-copy { padding:23px; flex:1; display:flex; flex-direction:column; }
.ks-property .kp-catalog-card h3 { font-family:Georgia,serif; font-size:25px; margin:10px 0; }
.ks-property .kp-catalog-card .kp-card-link { margin-top:auto; padding-top:17px; }
.ks-property .kp-tags { display:flex; flex-wrap:wrap; gap:7px; margin:14px 0 0; }
.ks-property .kp-tag { font-size:11px; font-weight:700; padding:5px 9px; border:1px solid #ced7d5; border-radius:4px; line-height:1.5; color:#385773; background:#f8faf8; }
.ks-property .kp-demo-marker { display:flex; align-items:flex-start; gap:10px; padding:14px 18px; border:1px solid #e2c49a; border-radius:6px; color:#73431a; background:#fff6e8; font-size:12px; line-height:1.65; }
.ks-property .kp-demo-marker strong { font-weight:850; }
.ks-property .kp-demo-marker .kp-icon { width:20px; height:20px; margin-top:1px; }
.ks-property .kp-sample { display:grid; grid-template-columns:1fr 1fr; gap:0; background:#fffefa; border:1px solid #ddd8cf; border-radius:12px; overflow:hidden; margin-top:20px; }
.ks-property .kp-sample-visual { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:27px; background:#eeede7; align-items:center; }
.ks-property .kp-sample-copy { padding:35px; }
.ks-property .kp-sample-copy h3 { font-family:Georgia,serif; font-size:31px; line-height:1.12; margin:11px 0 18px; }
.ks-property .kp-sample-copy p { font-size:14px; color:var(--kp-muted); }
.ks-property .kp-price { font-size:27px; font-weight:800; line-height:1.25; letter-spacing:-.035em; margin:6px 0 8px; color:#10283f; }
.ks-property .kp-potential-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:25px; margin-top:28px; }
.ks-property .kp-potential-step { border-top:1px solid #b9c6c8; padding-top:20px; }
.ks-property .kp-potential-step span { color:var(--kp-orange); font-size:12px; font-weight:800; }
.ks-property .kp-potential-step h3 { font-size:18px; margin:13px 0 10px; }
.ks-property .kp-potential-step p { font-size:14px; color:var(--kp-muted); }
.ks-property .kp-faq { max-width:820px; margin-top:30px; }
.ks-property .kp-faq details { padding:20px 0; border-top:1px solid #ddd8cf; }
.ks-property .kp-faq details:last-child { border-bottom:1px solid #ddd8cf; }
.ks-property .kp-faq summary { font-size:16px; font-weight:750; cursor:pointer; padding-right:10px; }
.ks-property .kp-faq p { color:var(--kp-muted); font-size:15px; margin:14px 0 0; }
.ks-property .kp-cta { background:#07182b; color:#fff; padding:43px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:40px; border-radius:10px; }
.ks-property .kp-cta h2 { color:#fff; max-width:680px; }
.ks-property .kp-cta p { color:#c6d1da; margin:0; max-width:620px; }
.ks-property .kp-cta .kp-button { background:#fffefa; color:#07182b; border-color:#fffefa; white-space:nowrap; }
.ks-property .kp-cta .kp-button:hover { background:#ffe9d2; }
.ks-property .footer { margin-top:36px; }
.ks-property [hidden] { display:none!important; }
.ks-property .kp-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.ks-property .kp-skip { position:fixed; top:-100px; left:20px; z-index:200; background:#fff; color:#0b315d; padding:12px; }
.ks-property .kp-skip:focus { top:10px; }
/* Detail: data and concept are kept in separate, readable blocks. */
.ks-property .kp-detail-head { padding:38px 0 28px; }
.ks-property .kp-detail-head h1 { max-width:950px; font-size:clamp(37px,4.4vw,58px); margin-bottom:14px; }
.ks-property .kp-detail-intro { max-width:780px; color:var(--kp-muted); font-size:16px; }
.ks-property .kp-detail-top { display:grid; grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr); gap:30px; align-items:start; margin-top:30px; }
.ks-property figure { margin:0; }
.ks-property .kp-photo-box { width:100%; min-height:290px; aspect-ratio:4/3; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:15px; padding:30px; border:1px dashed #b9c3c0; border-radius:9px; color:#375067; background:linear-gradient(130deg,#f2eee6,#e9eeeb); text-align:center; }
.ks-property .kp-photo-box .kp-icon { width:50px; height:50px; stroke-width:1; }
.ks-property .kp-photo-box b { font-size:16px; }
.ks-property .kp-photo-box span { font-size:12px; color:#526473; max-width:290px; }
.ks-property .kp-actual-image { width:100%; height:auto; max-height:440px; object-fit:contain; background:#ece9e2; border-radius:9px; }
.ks-property .kp-photo-caption { margin-top:12px; color:#52616d; font-size:12px; line-height:1.65; }
.ks-property .kp-actual-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:20px; }
.ks-property .kp-actual-gallery img { max-height:240px; }
.ks-property .kp-summary { border:1px solid #d7dcd7; border-radius:9px; padding:28px; background:#fffefa; }
.ks-property .kp-summary .kp-price { font-size:34px; margin:7px 0; }
.ks-property .kp-data-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 24px; margin:21px 0 12px; }
.ks-property .kp-data-grid > div { padding:13px 0; border-top:1px solid #e4e6df; min-width:0; }
.ks-property .kp-data-grid dt { font-size:11px; font-weight:600; color:#607182; margin-bottom:4px; }
.ks-property .kp-data-grid dd { font-size:14px; line-height:1.5; font-weight:750; margin:0; overflow-wrap:anywhere; }
.ks-property .kp-summary .kp-button { width:100%; margin-top:18px; }
.ks-property .kp-status { display:inline-block; background:#f0ede7; color:#655948; padding:5px 9px; border-radius:4px; font-size:11px; font-weight:700; }
.ks-property .kp-subnav { display:flex; flex-wrap:wrap; gap:9px 24px; margin:28px 0 0; padding:17px 0; border-block:1px solid #ddd8cf; }
.ks-property .kp-subnav a { font-size:13px; font-weight:750; text-decoration:none; padding:5px 0; }
.ks-property :is([id^="kp-"],#katalog,#contoh-format) { scroll-margin-top:105px; }
.ks-property .kp-analysis-grid { display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-top:24px; }
.ks-property .kp-analysis-card { border:1px solid #dcded7; background:#fffefa; border-radius:8px; padding:26px; }
.ks-property .kp-analysis-card h3 { font-size:19px; margin-bottom:14px; }
.ks-property .kp-bullets { padding:0 0 0 18px; margin:0; font-size:14px; color:#536474; }
.ks-property .kp-bullets li { margin-bottom:11px; padding-left:4px; }
.ks-property .kp-bullets li:last-child { margin-bottom:0; }
.ks-property .kp-tabs { display:flex; flex-wrap:wrap; gap:10px; margin:25px 0; }
.ks-property .kp-tab { padding:12px 19px; border:1px solid #b6c0c5; border-radius:6px; background:#fffefa; color:#193951; font-size:14px; font-weight:750; cursor:pointer; min-height:48px; }
.ks-property .kp-tab[aria-selected="true"] { background:#0b315d; color:#fff; border-color:#0b315d; }
.ks-property .kp-scenario-panel { background:#fffefa; border:1px solid #d6ddd9; border-radius:10px; padding:29px; }
.ks-property .kp-scenario-layout { display:grid; grid-template-columns:.92fr 1.08fr; gap:34px; align-items:start; }
.ks-property .kp-scenario-layout h3 { font-family:Georgia,serif; font-size:29px; line-height:1.15; margin:12px 0 16px; }
.ks-property .kp-scenario-layout p { font-size:14px; color:#536474; }
.ks-property .kp-preview-box { min-height:280px; aspect-ratio:4/3; background:#102d4b; color:#fff; border:1px solid #31516e; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; padding:30px; border-radius:7px; text-align:center; }
.ks-property .kp-preview-box .kp-icon { width:65px; height:65px; stroke-width:1; color:#efa56e; }
.ks-property .kp-preview-box b { font-family:Georgia,serif; font-size:29px; line-height:1.15; font-weight:500; }
.ks-property .kp-preview-box span { color:#b9c9d7; font-size:12px; }
.ks-property .kp-caption-note { background:#f1f3f0; padding:12px 14px; font-size:12px; color:#435869; border-radius:5px; margin-top:12px; }
.ks-property .kp-scenario-facts { display:grid; grid-template-columns:1fr 1fr; gap:25px; margin-top:24px; padding-top:22px; border-top:1px solid #dcded9; }
.ks-property .kp-scenario-facts h4 { font-size:14px; line-height:1.5; margin:0 0 12px; }
.ks-property .kp-scenario-facts p { font-size:14px; color:#536474; margin:0; }
.ks-property .kp-range-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; margin-top:24px; }
.ks-property .kp-range { background:#fffefa; border:1px solid #d7ddd7; border-top:3px solid #a8b8bb; padding:23px; border-radius:4px; }
.ks-property .kp-range:first-child { border-top-color:#e37c3c; }
.ks-property .kp-range h3 { font-size:13px; margin:0 0 14px; font-weight:700; }
.ks-property .kp-range b { font-size:24px; letter-spacing:-.02em; display:block; margin:0 0 10px; line-height:1.2; }
.ks-property .kp-range p { font-size:12px; margin:0; color:#526473; }
.ks-property .kp-checklist { margin-top:22px; border-top:1px solid #d2d9d3; }
.ks-property .kp-checkrow { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr) auto; gap:25px; padding:19px 0; border-bottom:1px solid #d2d9d3; align-items:start; }
.ks-property .kp-checkrow b { font-size:14px; line-height:1.55; }
.ks-property .kp-checkrow p { font-size:14px; line-height:1.6; color:#536474; margin:0; }
.ks-property .kp-review { display:flex; flex-wrap:wrap; gap:16px 38px; padding:20px 0; font-size:12px; color:#536474; }
.ks-property .kp-review b { display:block; color:#193951; font-size:13px; margin-top:4px; }
.ks-property .kp-disclaimer { padding:20px 24px; background:#f0eee6; border-left:3px solid #d78345; font-size:13px; line-height:1.75; color:#4b5c68; margin-top:24px; }
.ks-property .kp-full-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
@media(min-width:1001px) { .ks-property .navlinks { gap:22px; } }
@media(max-width:1000px) {
 .ks-property .kp-hero-grid { gap:35px; grid-template-columns:1.05fr .95fr; }
 .ks-property .kp-sheet { padding:20px; }
 .ks-property .kp-principle { padding:22px 15px; }
 .ks-property .kp-potential-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .ks-property .kp-cta { grid-template-columns:1fr; gap:24px; }
 .ks-property .kp-cta .kp-button { width:fit-content; }
 .ks-property .kp-detail-top { grid-template-columns:1fr 1fr; gap:22px; }
 .ks-property .kp-summary { padding:20px; }
 .ks-property .kp-range-grid { gap:12px; }
 .ks-property .kp-range { padding:18px; }
 .ks-property .kp-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
 .ks-property .kp-wrap { width:calc(100% - 36px); }
 .ks-property .kp-section { padding:48px 0; }
 .ks-property .kp-hero { padding:28px 0 38px; }
 .ks-property .kp-hero-grid,.ks-property .kp-sample,.ks-property .kp-detail-top,.ks-property .kp-scenario-layout,.ks-property .kp-analysis-grid { grid-template-columns:minmax(0,1fr); gap:25px; }
 .ks-property .kp-hero-grid { gap:32px; }
 .ks-property h1 { font-size:clamp(37px,8.6vw,51px); line-height:1.07; }
 .ks-property h2 { font-size:clamp(30px,7.4vw,38px); }
 .ks-property .kp-lead { font-size:16px; }
 .ks-property .kp-crumb { margin-bottom:22px; font-size:11px; }
 .ks-property .kp-sheet { max-width:480px; width:100%; }
 .ks-property .kp-principles { grid-template-columns:1fr; }
 .ks-property .kp-principle,.ks-property .kp-principle:first-child { padding:19px 0; border-right:0; border-bottom:1px solid #ddd8cf; }
 .ks-property .kp-principle:last-child { border-bottom:0; }
 .ks-property .kp-section-head { display:block; }
 .ks-property .kp-section-head p { margin-top:14px; max-width:100%; }
 .ks-property .kp-filters { grid-template-columns:1fr 1fr; padding:16px; gap:13px; }
 .ks-property .kp-filters .kp-field:first-child { grid-column:1/-1; }
 .ks-property .kp-empty { padding:22px; gap:15px; }
 .ks-property .kp-empty .kp-icon { width:25px; }
 .ks-property .kp-sample { gap:0; }
 .ks-property .kp-sample-visual { padding:20px; }
 .ks-property .kp-sample-copy { padding:25px; }
 .ks-property .kp-actions .kp-button { width:100%; }
 .ks-property .kp-cta { padding:30px 24px; }
 .ks-property .kp-cta .kp-button { width:100%; }
 .ks-property .kp-detail-head h1 { font-size:clamp(36px,8.4vw,48px); }
 .ks-property .kp-detail-head { padding-top:28px; }
 .ks-property .kp-detail-top { margin-top:22px; }
 .ks-property .kp-photo-box { min-height:230px; aspect-ratio:4/3; padding:22px; }
 .ks-property .kp-summary { padding:23px; }
 .ks-property .kp-summary .kp-price { font-size:30px; }
 .ks-property .kp-scenario-panel { padding:21px; }
 .ks-property .kp-preview-box { min-height:235px; }
 .ks-property .kp-scenario-facts { grid-template-columns:1fr; gap:22px; }
 .ks-property .kp-range-grid { grid-template-columns:1fr; }
 .ks-property .kp-range { padding:22px; }
 .ks-property .kp-checkrow { grid-template-columns:1fr; gap:9px; }
 .ks-property .kp-checkrow .kp-status { justify-self:start; }
 .ks-property .kp-subnav { gap:6px 18px; }
 .ks-property .kp-potential-step h3 { font-size:17px; }
 .ks-property .kp-potential-step p { font-size:13px; }
 .ks-property .kp-tabs { gap:8px; }
 .ks-property .kp-tab { flex:1; min-width:0; padding:12px; }
 .ks-property .kp-catalog-grid { grid-template-columns:1fr; }
 .ks-property .kp-disclaimer { padding:17px; }
 .ks-property .footer { padding-bottom:82px; }
 .ks-property .float-wa { bottom:max(12px,env(safe-area-inset-bottom)); }
}
@media(max-width:370px) {
 .ks-property .kp-wrap { width:calc(100% - 30px); }
 .ks-property .kp-filters { grid-template-columns:1fr; }
 .ks-property .kp-filters .kp-field:first-child { grid-column:auto; }
 .ks-property .kp-label,.ks-property .kp-overline { font-size:10px; }
 .ks-property .kp-sample-copy { padding:21px; }
 .ks-property .kp-summary .kp-price { font-size:28px; }
 .ks-property .kp-sheet { padding:17px; }
 .ks-property .kp-sheet-pair { gap:9px; }
}
/* On phones the in-content contact buttons remain available without covering
   photo captions, form fields or analysis text. Desktop keeps the fixed CTA. */
@media(max-width:760px){.ks-property .float-wa{display:none}}
/* Explicit minimum tracks prevent aspect-ratio tiles expanding a narrow grid. */
.ks-property .kp-sheet-pair,.ks-property .kp-sample-visual{grid-template-columns:repeat(2,minmax(0,1fr))}
.ks-property .kp-sheet-tile{min-width:0}
.ks-property .kp-sheet-tile span{max-width:100%;overflow-wrap:break-word}
.ks-property .kp-preview-box{width:100%;min-width:0}
.ks-property :is(.kp-hero-grid,.kp-detail-top,.kp-scenario-layout,.kp-analysis-grid)>*{min-width:0}

/* V29: keep the larger Tanya Della WhatsApp control visible on mobile property pages. */
@media(max-width:760px){
  .ks-property .float-wa{display:flex!important;right:12px!important;bottom:max(12px,env(safe-area-inset-bottom))!important;min-width:168px!important;height:58px!important}
}