/* ORANGKOMODO - halaman properti (situs publik). Dimuat bersama situs.css. */
/* ---------- hero ---------- */
.ph{position:relative;background:linear-gradient(135deg,#062a30 0%,#0a5c64 55%,#0e7c86 100%);color:#fff;padding:2.6rem 0 5.6rem;overflow:hidden}
.ph:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 20%,rgba(242,176,74,.28),transparent 42%),radial-gradient(circle at 10% 90%,rgba(255,255,255,.08),transparent 40%)}
.ph svg.land{position:absolute;left:0;right:0;bottom:0;width:100%;height:96px;opacity:.5}
.ph .in{position:relative;z-index:1}
.ph .crumb a{color:#bfe3e7}.ph .crumb{color:#bfe3e7;font-size:.82rem;margin-bottom:.8rem}.ph .crumb .text-muted{color:#e6f6f7!important}
.ph h1{font-weight:800;font-size:clamp(1.7rem,4vw,2.7rem);line-height:1.15;margin:0 0 .6rem;letter-spacing:-.5px}
.ph h1 em{font-style:normal;color:var(--accent)}
.ph p.lead{color:#cfe8ea;max-width:620px;font-size:1.02rem;margin:0 0 1.3rem}
.ph .stat{display:flex;flex-wrap:wrap;gap:.6rem}
.ph .stat a{display:flex;align-items:center;gap:.55rem;text-decoration:none;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(4px);padding:.5rem .9rem;border-radius:14px;transition:.2s}
.ph .stat a:hover,.ph .stat a.on{background:rgba(255,255,255,.22);transform:translateY(-2px)}
.ph .stat b{font-size:1.15rem;line-height:1}.ph .stat small{color:#cfe8ea;display:block;font-size:.72rem;line-height:1.1}
.ph .stat i{font-size:1.2rem;color:var(--accent)}
.ph .cta-top{position:absolute;right:0;top:0}
/* ---------- panel cari ---------- */
.pp{position:relative;z-index:5;margin-top:-3.6rem;background:#fff;border:1px solid var(--border);border-radius:20px;box-shadow:0 18px 40px rgba(6,42,48,.14);padding:1.1rem 1.2rem}
.pp .jt{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.2rem;margin-bottom:.8rem;scrollbar-width:none}.pp .jt::-webkit-scrollbar{display:none}
.pp .jt a{white-space:nowrap;text-decoration:none;font-weight:700;font-size:.86rem;color:#475f66;background:var(--soft);border:1.5px solid transparent;border-radius:999px;padding:.42rem .95rem;transition:.15s}
.pp .jt a small{color:#8aa0a6;font-weight:600;margin-left:.15rem}
.pp .jt a:hover{border-color:var(--primary);color:var(--primary)}
.pp .jt a.on{background:var(--primary);color:#fff}.pp .jt a.on small{color:#cdeef1}
.pp .form-control,.pp .form-select{border:1.5px solid var(--border);background:#fbfdfd;border-radius:12px;padding:.62rem .9rem}
.pp .form-control:focus,.pp .form-select:focus{border-color:var(--primary);box-shadow:0 0 0 .22rem rgba(14,124,134,.14);background:#fff}
.pp .sw{position:relative}.pp .sw>i{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);color:#8aa0a6}.pp .sw .form-control{padding-left:2.4rem}
.hs{margin-top:.9rem;padding-top:.9rem;border-top:1px dashed var(--border)}
.hs label{font-size:.78rem;font-weight:700;color:#475f66;display:flex;justify-content:space-between;margin-bottom:.15rem}.hs label b{color:var(--primary-d)}
.hs input[type=range]{width:100%;accent-color:var(--primary);height:1.6rem}
.hs .tip{font-size:.74rem;color:#8aa0a6}
/* ---------- hasil ---------- */
.rh{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin:1.6rem 0 1rem}
.rh .n{font-size:1.05rem}.rh .n b{font-size:1.25rem}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chips a{display:inline-flex;align-items:center;gap:.35rem;background:#e6f4f5;color:var(--primary-d);border-radius:999px;padding:.28rem .7rem;font-size:.78rem;font-weight:700;text-decoration:none}
.chips a:hover{background:#d3ecee}.chips a.all{background:transparent;color:#b42318}
/* ---------- kartu ---------- */
.pc{position:relative;height:100%;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:20px;overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s}
.pc:hover{transform:translateY(-5px);box-shadow:0 20px 36px rgba(6,42,48,.14);border-color:#cfe3e6}
.pc-cover{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#dfeef0}
.pc-cover .pc-svg{width:100%;height:100%;display:block;transition:transform .6s}
.pc:hover .pc-svg{transform:scale(1.06)}
.pc-cover:after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(to top,rgba(4,24,28,.7),transparent)}
.pc-tag{position:absolute;z-index:2;top:.7rem;left:.7rem;display:flex;gap:.35rem;flex-wrap:wrap}
.pc-tag span{font-size:.7rem;font-weight:800;border-radius:999px;padding:.22rem .65rem;background:rgba(255,255,255,.92);color:#0a3b41;backdrop-filter:blur(3px)}
.pc-tag .j-Kos{background:#7c3aed;color:#fff}.pc-tag .j-Jual-Tanah{background:#15803d;color:#fff}.pc-tag .j-Sewa-Tanah{background:#c2670a;color:#fff}
.pc-tag .baru{background:var(--accent);color:#3a2300}
.pc-hrg{position:absolute;z-index:2;left:.9rem;bottom:.7rem;color:#fff;line-height:1.05;text-shadow:0 2px 8px rgba(0,0,0,.35)}
.pc-hrg b{font-size:1.35rem;font-weight:800;letter-spacing:-.3px}.pc-hrg small{font-size:.76rem;opacity:.9;font-weight:600}
.pc-hrg .rp{font-size:.8rem;font-weight:700;margin-right:.15rem}
.pc-body{padding:.95rem 1.05rem 1rem;display:flex;flex-direction:column;flex:1}
.pc-clu{font-size:.72rem;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--primary);margin-bottom:.25rem}
.pc-body h3{font-size:1.02rem;font-weight:800;line-height:1.3;margin:0 0 .3rem}
.pc-body h3 a{color:var(--ink);text-decoration:none}.pc-body h3 a:before{content:"";position:absolute;inset:0;z-index:1}
.pc-loc{font-size:.82rem;color:var(--muted);margin-bottom:.65rem}.pc-loc i{color:#e04848}
.pc-spec{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem}
.pc-spec span{display:inline-flex;align-items:center;gap:.3rem;background:var(--soft);border-radius:10px;padding:.28rem .6rem;font-size:.76rem;font-weight:600;color:#3b545b}.pc-spec i{color:var(--primary)}
.pc-foot{margin-top:auto;display:flex;align-items:center;gap:.6rem;padding-top:.75rem;border-top:1px dashed var(--border);position:relative;z-index:2}
.pc-foot .av{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--primary),#14a0ab);color:#fff;font-size:.72rem;font-weight:800;display:grid;place-items:center;flex:none}
.pc-foot .nm{font-size:.82rem;font-weight:700;color:var(--ink);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-foot .wa{width:36px;height:36px;border-radius:11px;background:#e7f8ee;color:#16a34a;display:grid;place-items:center;text-decoration:none;font-size:1.1rem;transition:.2s}.pc-foot .wa:hover{background:#16a34a;color:#fff}
/* ---------- kosong, cara, banner ---------- */
.pk-kosong{background:#fff;border:2px dashed var(--border);border-radius:20px;text-align:center;padding:3rem 1rem;color:var(--muted)}
.pk-kosong i{font-size:2.6rem;color:#b5ccd0}
.cara{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2.4rem}
.cara .st{background:#fff;border:1px solid var(--border);border-radius:18px;padding:1.1rem 1.2rem;position:relative}
.cara .st .no{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--accent),#e08e1c);color:#10282e;font-weight:800;display:grid;place-items:center;margin-bottom:.6rem}
.cara .st b{display:block;margin-bottom:.15rem}.cara .st span{font-size:.84rem;color:var(--muted)}
@media(max-width:767px){.cara{grid-template-columns:1fr}.ph{padding-bottom:5rem}.ph .cta-top{position:static;margin-bottom:.8rem}}
.iklan{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.6rem;padding:1.3rem 1.5rem;border-radius:20px;background:linear-gradient(135deg,#0e7c86,#062a30);color:#fff;position:relative;overflow:hidden}
.iklan:after{content:"";position:absolute;right:-40px;top:-60px;width:200px;height:200px;border-radius:50%;background:rgba(242,176,74,.18)}
.iklan>*{position:relative;z-index:1}.iklan .small{color:#cfe8ea}.iklan .btn{background:var(--accent);color:#3a2300;font-weight:800;border:0;border-radius:12px;padding:.65rem 1.2rem}
.info-prop{background:#fffbeb;border:1px solid #fde68a;border-radius:14px;padding:.8rem 1rem;font-size:.86rem;color:#78350f}
/* ---------- detail ---------- */
.pd-cover{position:relative;border-radius:24px;overflow:hidden;width:100%;max-width:100%;height:clamp(230px,38vw,330px);background:#dfeef0}
.pd-cover .pc-svg{width:100%;height:100%;display:block}
.pd-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,24,28,.78),rgba(4,24,28,.05) 65%)}
.pd-cover .cap{position:absolute;z-index:2;left:1.4rem;right:1.4rem;bottom:1.1rem;color:#fff}
.pd-cover .cap h1{font-size:clamp(1.3rem,3vw,2.1rem);font-weight:800;margin:.4rem 0 .2rem;line-height:1.2;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.pd-cover .cap .loc{color:#e1f1f3;font-size:.92rem}
.pd-cover .pc-tag{top:1rem;left:1.2rem}
.pfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.8rem;margin:1.2rem 0 1.6rem}
.pfact{background:#fff;border:1px solid var(--border);border-radius:16px;padding:.85rem 1rem}
.pfact i{width:34px;height:34px;border-radius:10px;background:#e6f4f5;color:var(--primary);display:grid;place-items:center;font-size:1.05rem;margin-bottom:.4rem}
.pfact small{display:block;color:var(--muted);font-size:.74rem;font-weight:600}.pfact b{font-size:.95rem;line-height:1.25;display:block}
.pfas{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:0}
.pfas li{background:#fff;border:1px solid var(--border);border-radius:999px;padding:.38rem .85rem;font-size:.84rem;font-weight:600;color:#3b545b}.pfas i{color:#16a34a;margin-right:.3rem}
.pbox{background:#fff;border:1px solid var(--border);border-radius:22px;padding:1.3rem;position:sticky;top:96px;box-shadow:0 14px 34px rgba(6,42,48,.08)}
.pbox .lbl{font-size:.75rem;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--primary)}
.pbox .big{font-size:1.9rem;font-weight:800;color:var(--primary-d);line-height:1.1;margin:.2rem 0 .1rem}.pbox .big small{font-size:.9rem;color:var(--muted);font-weight:600}
.pbox .own{display:flex;align-items:center;gap:.7rem;margin:1rem 0;padding:.75rem;background:var(--soft);border-radius:14px}
.pbox .own .av{width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,var(--primary),#14a0ab);color:#fff;font-weight:800;display:grid;place-items:center}
.pbox .own small{color:var(--muted);display:block;font-size:.74rem}
.pbox .btn-wa{padding:.85rem 1.2rem;font-size:1rem}
.pbox .sh{display:flex;gap:.5rem;margin-top:.6rem}.pbox .sh .btn{flex:1;font-size:.84rem;border-radius:11px}
.ptips{background:linear-gradient(135deg,#fffbeb,#fff7e0);border:1px solid #fde68a;border-radius:18px;padding:1.1rem 1.3rem}
.ptips b{color:#78350f}.ptips ul{margin:.5rem 0 0;padding-left:1.1rem;color:#6b4a14;font-size:.88rem}.ptips li{margin-bottom:.2rem}
.pmob{display:none}
@media(max-width:991px){.pbox{position:static}.pmob{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;background:#fff;border-top:1px solid var(--border);padding:.6rem .9rem;gap:.7rem;align-items:center;box-shadow:0 -8px 24px rgba(6,42,48,.1)}.pmob .hg{flex:1;line-height:1.1}.pmob .hg b{color:var(--primary-d);font-size:1.05rem}.pmob .hg small{display:block;color:var(--muted);font-size:.72rem}body.has-pmob{padding-bottom:70px}}
.ph .cta-top .btn{background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.4);color:#fff}.ph .cta-top .btn:hover{background:#fff;color:var(--primary-d)}
.pc-media{position:relative}
/* kartu paket memakai kerangka .pc yang sama */
.pc-tag .j-Laut{background:#0e7c86;color:#fff}.pc-tag .j-Darat{background:#c2670a;color:#fff}.pc-tag .j-Gabungan{background:#0369a1;color:#fff}
.pc-hrg small:first-child{font-size:.7rem;font-weight:600;opacity:.9}
.pk .pc-hrg b{font-size:1.2rem}
.pc .pc-body h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
