:root{
  color-scheme:light;
  --navy:#00427D; --blue:#0150A6; --orange:#FF7E2E; --orange-d:#E8661A;
  --ink:#02141C; --muted:#676767; --line:#E5E7EB; --panel:#F4F6F9; --tint:#E3F4F8; --teal:#158AA4;
  --icon:#054985; --wa:#12B555; --white:#FFFFFF; --note:#8A8F98; --noteBg:#FFF6EF;
  --sans:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --wrap:1200px;
}
*{box-sizing:border-box}
body{background:var(--white);color:var(--ink);font:400 16px/24px var(--sans);overflow-x:clip}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;color:inherit;background:none;border:0;padding:0}
input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:24px}
@media(max-width:600px){.wrap{padding-inline:16px}}


/* top bar + header (villasepeti: dark contact bar, white header) */
.topbar{background:var(--navy);color:#DCE6F2;font-size:13px;line-height:18px}
.topbar .wrap{display:flex;gap:22px;align-items:center;min-height:40px;flex-wrap:wrap}
.topbar .r{margin-left:auto;display:flex;gap:18px}
.topbar em{font-style:normal;color:#FFB88A}
@media(max-width:760px){.topbar{display:none}}
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--white);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;gap:24px;min-height:64px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:8px;flex-shrink:0}
.brand img{width:34px;height:34px}
.brand b{font:700 22px/1 var(--sans);letter-spacing:-.02em;color:#005EB2}
.brand b i{font-style:normal;color:#FF7A00;font-weight:400}
.nav{display:flex;gap:20px;font-size:14px;font-weight:500}
.nav a:hover{color:var(--blue)}
.hdr-r{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500}
.pill-btn{border:1px solid var(--line);border-radius:999px;padding:7px 14px;background:var(--white)}
.cta{background:var(--orange);color:#fff;border:0;border-radius:999px;padding:9px 18px;font-weight:600;font-size:14px}
.cta:hover{background:var(--orange-d)}
.hdr .mini{display:none;flex:1;max-width:520px}
.hdr .menubtn{color:#11181C}
body.inner .hdr .nav{display:none}
body.inner .hdr .mini{display:block}
@media(max-width:960px){.nav{display:none}}
@media(max-width:700px){.hdr-r .pill-btn{display:none}.hdr .mini{order:3;flex-basis:100%;max-width:none;padding-bottom:10px}}

/* search bar (hero + compact) */
.sb{display:grid;grid-template-columns:1.3fr 1.2fr 1fr auto;background:var(--white);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,20,40,.12);position:relative}
.sb .fld{display:block;text-align:left;padding:12px 18px;border-right:1px solid var(--line);min-width:0}
.sb .fld small{display:block;font-size:12px;line-height:16px;font-weight:600;color:var(--muted)}
.sb .fld span{display:block;font-size:15px;line-height:22px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb .fld span.ph{color:#9AA0A8;font-weight:400}
.sb .fld[aria-expanded="true"]{background:var(--panel)}
.sb .go{background:var(--orange);color:#fff;border-radius:0 11px 11px 0;padding:0 28px;font-weight:600;font-size:15px}
.sb.compact{box-shadow:none;border-radius:999px;grid-template-columns:1fr 1fr .8fr auto}
.sb.compact .fld{padding:6px 16px}
.sb.compact .fld small{display:none}
.sb.compact .fld span{font-size:14px}
.sb.compact .go{border-radius:0 999px 999px 0;padding:0 16px}
@media(max-width:800px){.sb:not(.compact){grid-template-columns:1fr}.sb:not(.compact) .fld{border-right:0;border-bottom:1px solid var(--line)}.sb:not(.compact) .go{border-radius:0 0 11px 11px;padding:14px}}

/* popover panels */
#pop{position:absolute;z-index:50;background:var(--white);border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 50px rgba(0,20,40,.2);padding:18px;width:min(640px,calc(100vw - 32px))}
#pop[hidden]{display:none}
.pop-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.pop-h h4{margin:0;font-size:15px}
.next{border:1px solid var(--teal);color:var(--teal);border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600}
.dsearch{width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 12px;margin-bottom:12px;font-size:14px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.chipb{border:1px solid var(--line);border-radius:6px;padding:4px 10px;font-size:13px;font-weight:500}
.chipb.on{border-color:var(--teal);background:var(--tint);color:var(--teal)}
.rlist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px;max-height:300px;overflow-y:auto;overflow-x:hidden;font-size:13px;line-height:18px;padding-right:4px}
.rlist label{display:flex;gap:7px;align-items:flex-start;padding:4px 0}
.rlist input{accent-color:var(--teal);margin-top:1px}
.rlist .new{color:var(--orange-d);font-size:11px;font-weight:600;margin-left:4px}
.rlist .n{color:var(--note);margin-left:4px}
.clear{color:var(--teal);font-size:13px;font-weight:600}
.tabs{display:inline-flex;border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px}
.tabs button{padding:5px 12px;border-radius:7px;font-size:13px;font-weight:500}
.tabs button[aria-pressed="true"]{background:var(--teal);color:#fff}
.cal{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cal h5{margin:0 0 8px;text-align:center;font-size:14px;font-weight:600}
.cal .g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center;font-size:13px}
.cal .g i{font-style:normal;color:var(--note);font-size:11px;padding:4px 0}
.cal .g button{padding:7px 0;border-radius:6px;font-variant-numeric:tabular-nums}
.cal .g button:disabled{color:#C9CDD2;cursor:default}
.cal .g button.in{background:var(--tint)}
.cal .g button.edge{background:var(--teal);color:#fff}
.calnav{display:flex;justify-content:space-between;margin-bottom:4px}
.calnav button{width:28px;height:28px;border-radius:50%;border:1px solid var(--line)}
@media(max-width:600px){.cal{grid-template-columns:1fr}.cal>div:nth-child(2){display:none}}
.flexrow{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.q{font-size:14px;font-weight:600;margin:12px 0 2px}
.q+small{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}
.guest{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.guest b{display:block;font-size:14px}
.guest small{font-size:12px;color:var(--muted)}
.step{display:flex;align-items:center;gap:12px;font-variant-numeric:tabular-nums}
.step button{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);font-size:16px;line-height:1}
.step button:disabled{opacity:.35;cursor:default}
.popfoot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;gap:10px}
.btn2{border:1px solid var(--teal);color:var(--teal);border-radius:8px;padding:7px 16px;font-size:14px;font-weight:600}
.btn1{background:var(--teal);color:#fff;border-radius:8px;padding:8px 18px;font-size:14px;font-weight:600}
@media(max-width:700px){#pop{position:fixed;left:0!important;right:0;top:auto!important;bottom:0;width:100%;border-radius:18px 18px 0 0;max-height:86dvh;overflow:auto;padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}}

.view{display:none}.view.on{display:block}
.note{font-size:12px;line-height:17px;color:#7A5A40;background:var(--noteBg);border-radius:6px;padding:6px 10px;margin-top:10px}
.src{font-size:12px;line-height:16px;color:var(--note);margin-top:10px}

/* HOME */
/* ===== admin panel (prototype) ===== */
body.panel .topbar,body.panel .hdr,body.panel .ftr,body.panel .tabbar{display:none}
body.panel{background:#F4F6F8}
.pn{display:grid;grid-template-columns:232px 1fr;min-height:100dvh}
.pn-side{background:#093A45;color:#CFE3E8;padding:18px 12px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100dvh}
.pn-side .brand{padding:4px 8px 16px}
.pn-side .brand b{color:#fff}
.pn-side small{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#7FA7B1;padding:12px 10px 4px}
.pn-side button{display:flex;justify-content:space-between;align-items:center;text-align:left;padding:9px 10px;border-radius:8px;font-size:14px;font-weight:500;color:#E2EEF1}
.pn-side button:hover{background:rgba(255,255,255,.08)}
.pn-side button[aria-current="true"]{background:#fff;color:#093A45}
.pn-side button span{font-size:12px;opacity:.7}
.pn-side .out{margin-top:auto;border:1px solid rgba(255,255,255,.2)}
.pn-main{padding:24px 28px 80px;min-width:0}
.pn-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.pn-h h1{font:700 22px/30px var(--sans);margin:0;margin-right:auto}
.pn-h .sub{font-size:13px;color:#52525B;width:100%;margin-top:-10px}
.pbtn{height:36px;padding:0 14px;border-radius:8px;border:1px solid #D4D4D8;background:#fff;font-size:13px;font-weight:600;color:#11181C;display:inline-flex;align-items:center;gap:6px}
.pbtn.pri{background:#158AA4;border-color:#158AA4;color:#fff}
.pbtn.dan{color:#B91C1C}
.pbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.pbar input,.pbar select,.pf input,.pf select,.pf textarea{height:36px;border:1px solid #D4D4D8;border-radius:8px;padding:0 10px;font-size:13px;background:#fff;color:#11181C;color-scheme:light}
.pbar input{width:260px}
.pcard{background:#fff;border:1px solid #E4E4E7;border-radius:12px}
.ptable{width:100%;border-collapse:collapse;font-size:13px}
.ptable th{text-align:left;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#71717A;font-weight:600;padding:10px 12px;border-bottom:1px solid #E4E4E7;white-space:nowrap}
.ptable td{padding:10px 12px;border-bottom:1px solid #F1F1F3;vertical-align:middle}
.ptable tr:last-child td{border-bottom:0}
.ptable tr:hover td{background:#FAFAFA}
.ptable .th{width:56px;height:40px;border-radius:6px;background:#F4F4F5 center/cover}
.ptable b{font-weight:600}
.ptable small{display:block;color:#71717A;font-size:11px}
.pill2{display:inline-block;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:600;white-space:nowrap}
.pill2.ok{background:#DCFCE7;color:#166534}.pill2.sm{background:#FFEDD5;color:#9A3412}.pill2.dr{background:#F4F4F5;color:#52525B}.pill2.wa{background:#FEF3C7;color:#92400E}
.ptw{overflow-x:auto}
.ptabs{display:flex;gap:2px;border-bottom:1px solid #E4E4E7;margin-bottom:18px;overflow-x:auto}
.ptabs button{padding:10px 14px;font-size:13px;font-weight:500;color:#52525B;border-bottom:2px solid transparent;white-space:nowrap}
.ptabs button[aria-selected="true"]{color:#093A45;border-bottom-color:#158AA4;font-weight:600}
.pf{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px 18px;padding:20px}
.pf label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:600;color:#3F3F46}
.pf label.w{grid-column:1/-1}
.pf label.ck{flex-direction:row;align-items:center;gap:8px;font-weight:500}
.pf textarea{height:auto;min-height:120px;padding:8px 10px;line-height:20px;font-family:inherit}
.pf .hint{font-weight:400;color:#71717A;font-size:11px}
.pf h3{grid-column:1/-1;margin:6px 0 -4px;font-size:14px}
.pchecks{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px 16px}
.pchecks label{flex-direction:row;align-items:center;gap:8px;font-weight:400;font-size:13px}
.plang{display:flex;gap:6px;flex-wrap:wrap;grid-column:1/-1}
.plang button{border:1px solid #D4D4D8;border-radius:8px;padding:5px 10px;font-size:12px;font-weight:600;background:#fff}
.plang button[aria-pressed="true"]{background:#093A45;color:#fff;border-color:#093A45}
.plang button i{font-style:normal;font-weight:500;margin-left:6px;font-size:11px}
.pgal{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.pgal div{position:relative;aspect-ratio:3/2;border-radius:8px;background:#F4F4F5 center/cover;overflow:hidden}
.pgal .cv{position:absolute;left:8px;top:8px;background:#fff;border-radius:999px;padding:1px 8px;font-size:11px;font-weight:700}
.pgal .ops{position:absolute;right:6px;bottom:6px;display:flex;gap:4px}
.pgal .ops button{width:26px;height:26px;border-radius:6px;background:rgba(255,255,255,.92);font-size:13px;font-weight:700}
.pdrop{display:grid;place-items:center;border:2px dashed #CBD5DB;border-radius:8px;aspect-ratio:3/2;font-size:12px;color:#52525B;text-align:center;cursor:pointer}
.prow{grid-column:1/-1;display:grid;grid-template-columns:1.2fr 1fr 2fr auto;gap:8px;align-items:center}
.prow.p4{grid-template-columns:1fr 1fr 1fr .7fr auto}
.prow.p3{grid-template-columns:1.2fr 1.4fr .8fr .6fr auto}
.prow .x{width:32px;height:32px;border-radius:8px;border:1px solid #E4E4E7;color:#B91C1C}
.prow.hd{font-size:11px;color:#71717A;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.pcal{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.pcal h5{margin:0 0 6px;font-size:13px}
.pcal .g{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.pcal .g i{font-style:normal;font-size:10px;color:#A1A1AA;text-align:center}
.pcal .g button{height:40px;border-radius:6px;font-size:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:13px;background:#E3F4F8}
.pcal .g button small{font-size:8px;color:#158AA4}
.pcal .g button.bk{background:#FDE2E2;color:#991B1B;text-decoration:line-through}
.pcal .g button:disabled{background:none;color:#D4D4D8}
.pnote{grid-column:1/-1;background:#F0F9FB;border:1px solid #CDE9EF;border-radius:8px;padding:10px 12px;font-size:12px;line-height:18px;color:#0F4C5C}
.pnote.w{background:#FFF7ED;border-color:#FED7AA;color:#7C2D12}
.ptoast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#11181C;color:#fff;border-radius:10px;padding:10px 16px;font-size:13px;z-index:100;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.ptoast[hidden]{display:none}
.pstat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.pstat div{background:#fff;border:1px solid #E4E4E7;border-radius:12px;padding:14px}
.pstat b{display:block;font-size:22px;line-height:28px}
.pstat span{font-size:12px;color:#71717A}
@media(max-width:900px){.pn{grid-template-columns:1fr}.pn-side{position:static;height:auto;flex-direction:row;flex-wrap:wrap}.pn-side small,.pn-side .out{display:none}.pn-main{padding:16px}.pbar input{width:100%}.prow,.prow.p4,.prow.p3{grid-template-columns:1fr 1fr}.pstat{grid-template-columns:1fr 1fr}}

/* ===== listing page — villasepeti measurements (desktop 1440 / mobile 390) ===== */
body.detail .tabbar{display:none}
.xd{padding-block:20px 72px}
.xd-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#52525B;margin-bottom:12px;min-height:36px}
.xd-top b{color:#11181C;font-weight:600}
.xd-act{display:flex;gap:24px}
.xd-act button{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500}
.xd-act svg,.xd-mbtn svg{width:18px;height:18px;stroke:#11181C;fill:none;stroke-width:1.8}
.xd-grid{display:grid;grid-template-columns:minmax(0,764px) 388px;gap:24px;justify-content:space-between;align-items:start}
.xd-gal{position:relative;aspect-ratio:763/573;border-radius:8px;overflow:hidden;background:#F4F4F5 center/cover}
.xd-gal .gp{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:500}
.xd-gal .gc{position:absolute;bottom:14px;right:14px;background:rgba(0,0,0,.55);color:#fff;border-radius:999px;padding:7px 12px;font-size:12px;font-weight:600}
.xd-gal .nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.9);display:grid;place-items:center;font-size:18px}
.xd-gal .nav.l{left:12px}.xd-gal .nav.r{right:12px}
.xd-mbtn{display:none}
.xd-th{display:flex;gap:8px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
.xd-th button{width:68px;height:48px;border-radius:6px;background:#F4F4F5 center/cover;flex-shrink:0;outline-offset:2px}
.xd-th button[aria-current="true"]{outline:2px solid #158AA4}
.xd-th .more{display:grid;place-items:center;font-size:12px;font-weight:600;color:#52525B;background:#F4F4F5}
.xd-loc{font-size:12px;color:#71717A;margin-top:22px}
.xd h1{font:600 32px/40px var(--sans);margin:4px 0 16px}
.xd-rate{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:#E3F4F8;border-radius:12px;padding:12px}
.xd-rate .pill{display:flex;align-items:center;gap:6px;background:#fff;border-radius:8px;padding:6px 10px;font-size:15px;font-weight:600}
.xd-rate .pill u{font-size:12px;font-weight:400;color:#52525B}
.xd-rate span{font-size:12px;color:#11181C}
.star{color:#F5A623}
.xd-spec{display:flex;gap:28px;flex-wrap:wrap;padding:18px 0;border-bottom:1px solid #E5E7EB;font-size:14px}
.xd-spec div{display:flex;align-items:center;gap:8px}
.xd-spec svg,.xd-ico{width:20px;height:20px;stroke:#11181C;fill:none;stroke-width:1.6;flex-shrink:0}
.xs{padding:28px 0;border-bottom:1px solid #E5E7EB}
.xs h2{font:700 20px/28px var(--sans);margin:0 0 16px}
.xs .txt{font-size:13px;line-height:21px;color:#27272A}
.xs .txt.clamp{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.xs .lnk{color:#158AA4;font-size:13px;font-weight:500;margin-top:6px}
.xs .chk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 16px;font-size:13px}
.xs .chk div{display:flex;align-items:center;gap:8px}
.xs .chk svg{width:18px;height:18px;stroke:#158AA4;fill:none;stroke-width:1.8;flex-shrink:0}
.xroom{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:14px 0;border-top:1px solid #F1F1F3}
.xroom:first-child{border-top:0;padding-top:0}
.xroom .ic{display:flex;gap:6px;margin-bottom:4px}
.xroom b{display:block;font-size:14px;font-weight:600}
.xroom small{font-size:11px;color:#71717A}
.xroom .ft{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;font-size:12px}
.xroom .ft span::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#158AA4;margin-right:5px;vertical-align:middle}
.xroom .ft .mo{background:#E3F4F8;color:#158AA4;border-radius:999px;padding:1px 8px}
.xroom .ft .mo::before{display:none}
.xs .pool{display:flex;align-items:center;gap:10px;font-size:13px}
.xs .range{font-size:13px;color:#27272A;margin:0 0 14px}
.xcal{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.xcal h5{margin:0 0 10px;text-align:center;font-size:14px;font-weight:500}
.xcal .g{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}
.xcal .g i{font-style:normal;color:#A1A1AA;font-size:11px;padding:6px 0}
.xcal .g button{height:44px;border-radius:6px;font-size:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:14px;font-variant-numeric:tabular-nums}
.xcal .g button small{font-size:8px;color:#158AA4}
.xcal .g button.av{background:#E3F4F8}
.xcal .g button.full{color:#C4C4C8;text-decoration:line-through;cursor:default}
.xcal .g button:disabled{color:#D4D4D8;background:none;cursor:default}
.xcal .g button.in{background:#B8E3EC}
.xcal .g button.edge{background:#158AA4;color:#fff}
.xcal .g button.edge small{color:#fff}
.xcal-nav{display:flex;justify-content:space-between;margin-bottom:-26px;position:relative;z-index:1}
.xcal-nav button{width:28px;height:28px;color:#71717A;font-size:18px}
.xleg{display:flex;gap:16px;font-size:12px;color:#52525B;margin-top:12px;align-items:center;flex-wrap:wrap}
.xleg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:middle}
.xleg button{margin-left:auto;color:#158AA4;font-weight:600}
.xnote{font-size:12px;line-height:19px;color:#27272A;margin-top:14px;display:grid;gap:6px}
.xnote div::before{content:"•";color:#158AA4;margin-right:6px}
.xmap{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:764/360;background:#DDEFD3}
.xmap svg{display:block;width:100%;height:100%}
.xmap .sm{position:absolute;right:12px;bottom:12px;display:flex;align-items:center;gap:6px;background:#fff;border-radius:8px;padding:7px 12px;font-size:12px;font-weight:500}
.xmap .cap{position:absolute;left:12px;top:12px;background:#fff;border-radius:6px;padding:5px 10px;font-size:12px;font-weight:600}
.xrules{background:#FFF1E8;border-radius:12px;padding:16px;font-size:12px;line-height:22px}
.xrules b.t{display:block;font-size:13px;margin-bottom:4px}
.xinfo{display:grid;gap:10px;margin-top:16px;font-size:12px}
.xinfo div{display:flex;gap:8px;align-items:flex-start}
.xinfo svg{width:16px;height:16px;fill:none;stroke-width:1.8;flex-shrink:0;margin-top:1px}
.xinfo .ok svg{stroke:#16A34A}.xinfo .wn svg{stroke:#EA8A1A}.xinfo .no svg{stroke:#DC2626}
.xinfo u{cursor:pointer}
.xnear{display:grid;grid-template-columns:1fr 1fr;gap:12px 40px;font-size:12px}
.xnear div{display:flex;align-items:center;gap:8px}
.xnear svg{width:18px;height:18px;stroke:#158AA4;fill:none;stroke-width:1.6;flex-shrink:0}
.xc-h{display:flex;align-items:center;gap:14px}
.xc-h h2{margin:0}
.xc-h b{font-size:15px}
.xc-h u{font-size:12px;color:#52525B}
.xcm{background:#F4F4F5;border-radius:12px;padding:16px;margin-top:14px;font-size:13px;line-height:20px}
.xcm .h{display:flex;gap:10px;align-items:flex-start;margin-bottom:8px}
.xcm .h b{display:block;font-size:13px}
.xcm .h small{color:#71717A;font-size:11px}
.xcm .sc{font-weight:600;font-size:13px;white-space:nowrap}
.xcm .tr{display:inline-block;margin-top:8px;background:#E4E4E7;border-radius:999px;padding:1px 8px;font-size:10px;font-weight:600}
.xall{margin-top:16px;border:1px solid #158AA4;color:#158AA4;border-radius:999px;padding:6px 14px;font-size:12px}
.xlic{display:flex;align-items:center;gap:12px;padding-top:24px;font-size:12px}
.xlic i{width:40px;height:40px;border-radius:50%;border:2px solid #C8102E;display:grid;place-items:center;color:#C8102E;font-style:normal;font-size:10px;font-weight:700}
.xlic b{display:block;font-size:13px}
.xb{position:sticky;top:88px;border:1px solid #E5E7EB;border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:12px}
.xb .top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.xb .pr{font-size:20px;font-weight:700}
.xb .pr span{font-size:12px;font-weight:400;color:#71717A}
.xb .badge{background:#FDBA8C;color:#7C2D12;border-radius:6px;padding:3px 8px;font-size:11px;font-weight:600}
.xb .fld{display:flex;align-items:center;gap:10px;border:1px solid #E5E7EB;border-radius:8px;height:44px;padding:0 12px;font-size:13px;text-align:left;width:100%}
.xb .fld svg{width:18px;height:18px;stroke:#11181C;fill:none;stroke-width:1.6}
.xb .ln{display:flex;justify-content:space-between;font-size:13px}
.xb .ln b{font-weight:600}
.xb .ln.dc b{color:#EA8A1A}
.xb hr{border:0;border-top:1px solid #E5E7EB;margin:2px 0}
.xb .tot{font-size:13px}.xb .tot b{font-size:20px;font-weight:700}
.xb .hint{font-size:12px;color:#71717A}
.xb .warn{font-size:12px;color:#B45309;background:#FFF7ED;border-radius:8px;padding:8px 10px}
.xb .go1{background:#158AA4;color:#fff;border-radius:999px;height:44px;font-size:14px;font-weight:600}
.xb .go2{border:1px solid #158AA4;color:#158AA4;border-radius:999px;height:44px;font-size:14px;font-weight:500}
.xb .opp{background:#FFF1E8;border-radius:8px;padding:10px 12px;font-size:12px;text-align:center}
.stag{position:absolute;right:10px;top:10px;background:#FFB88A;color:#1B1F24;font-size:11px;font-weight:700;border-radius:999px;padding:2px 9px;letter-spacing:.02em}
.xd-mh{display:none}
.xd-mbar{display:none}
@media(max-width:900px){
  body.detail{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}
  .xd{padding-top:0}
  .xd .wrap{padding-inline:0}
  .xd-top{display:none}
  .xd-grid{grid-template-columns:1fr;gap:0}
  .xd-gal{border-radius:0;aspect-ratio:390/260}
  .xd-gal .nav{display:none}
  .xd-mbtn{display:flex;position:absolute;inset:12px 12px auto 12px;justify-content:space-between;pointer-events:none}
  .xd-mbtn div{display:flex;gap:10px}
  .xd-mbtn button{pointer-events:auto;width:36px;height:36px;border-radius:50%;background:#fff;display:grid;place-items:center}
  .xd-th{display:none}
  .xd-left{padding-inline:16px}
  .xd-code{font-size:11px;color:#52525B;margin-top:16px}
  .xd-loc{margin-top:8px}
  .xd h1{font-size:18px;line-height:26px;margin:4px 0 14px}
  .xd-rate{flex-direction:column;align-items:flex-start;gap:10px}
  .xd-spec{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 8px}
  .xd-spec div{flex-direction:column;align-items:flex-start;gap:4px;font-size:12px}
  .xs h2{font-size:17px;line-height:24px}
  .xs .chk{grid-template-columns:1fr;gap:12px}
  .xcal{grid-template-columns:1fr}
  .xcal>div:nth-child(2){display:none}
  .xnear{grid-template-columns:1fr}
  .xroom{flex-direction:column;align-items:flex-start;gap:8px}
  .xroom .ft{justify-content:flex-start}
  .xb{display:none}
  .xd-mh{display:flex;position:fixed;left:0;right:0;top:0;z-index:45;background:#fff;border-bottom:1px solid #E5E7EB;height:52px;align-items:center;gap:12px;padding:env(safe-area-inset-top,0px) 16px 0;transform:translateY(-100%);transition:transform .15s}
  .xd-mh.on{transform:none}
  .xd-mh b{flex:1;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .xd-mh svg{width:20px;height:20px;stroke:#11181C;fill:none;stroke-width:1.8}
  .xd-mbar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:45;background:#fff;border-top:1px solid #E5E7EB;padding:10px 16px calc(12px + env(safe-area-inset-bottom,0px));box-shadow:0 -6px 16px rgba(0,0,0,.06)}
  .xd-mbar .row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;font-size:12px}
  .xd-mbar .row .d{display:flex;align-items:center;gap:6px;font-size:12px;text-align:left}
  .xd-mbar .row svg{width:16px;height:16px;stroke:#158AA4;fill:none;stroke-width:2}
  .xd-mbar .row .p{display:flex;align-items:center;gap:8px}
  .xd-mbar .row .p b{font-size:16px}
  .xd-mbar .row .p span{color:#71717A}
  .xd-mbar .row .p button{width:26px;height:26px;border-radius:6px;background:#F4F4F5;display:grid;place-items:center}
  .xd-mbar .go1,.xd-mbar .go2{display:block;width:100%;height:40px;border-radius:999px;font-size:13px;font-weight:600}
  .xd-mbar .go1{background:#158AA4;color:#fff;margin-bottom:8px}
  .xd-mbar .go2{border:1px solid #158AA4;color:#158AA4;font-weight:500}
  .xd-mbar .bd{display:grid;gap:8px;font-size:12px;padding:4px 0 12px;border-bottom:1px solid #E5E7EB;margin-bottom:10px}
  .xd-mbar .bd div{display:flex;justify-content:space-between}
}
@media(min-width:901px){.xd-code{display:none}}

/* forms always light, even when the viewer is in dark mode */
#pop,.modal,#msheet,#menu,.vbar{color-scheme:light}
#pop input[type=text],#pop .dsearch,#msheet input[type=text],.modal input{background:#fff;color:#11181C;border:1px solid #E5E7EB}
input[type=checkbox],input[type=radio]{accent-color:#158AA4}

/* mobile search sheet — villasepeti mobile flow */
#msheet{position:fixed;inset:0;z-index:80;background:#fff;color:#11181C;display:flex;flex-direction:column}
#msheet[hidden]{display:none}
.ms-h{display:flex;align-items:stretch;gap:6px;border-bottom:1px solid #E5E7EB;padding:0 0 0 12px;height:56px;flex-shrink:0;padding-top:env(safe-area-inset-top,0px)}
.ms-h .x{width:36px;display:grid;place-items:center}
.ms-h .x svg{width:20px;height:20px;stroke:#11181C;fill:none;stroke-width:1.8}
.ms-tabs{display:flex;overflow-x:auto;scrollbar-width:none}
.ms-tabs button{padding:0 12px;font-size:13px;font-weight:500;color:#71717A;border-bottom:2px solid transparent;white-space:nowrap}
.ms-tabs button[aria-selected="true"]{color:#11181C;border-bottom-color:#11181C}
.ms-b{flex:1;overflow-y:auto;padding:20px}
.ms-f{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #E5E7EB;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));flex-shrink:0}
.ms-field{display:flex;align-items:center;gap:10px;width:100%;border:1px solid #E5E7EB;border-radius:8px;height:40px;padding:0 10px;font-size:14px;margin-bottom:8px;text-align:left;color:#11181C}
.ms-field svg{width:18px;height:18px;stroke:#11181C;fill:none;stroke-width:1.8;flex-shrink:0}
.ms-field span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-more{display:flex;align-items:center;gap:6px;margin:22px auto 0;color:#158AA4;font-size:13px;font-weight:500}
.ms-more svg{width:16px;height:16px;stroke:#158AA4;fill:none;stroke-width:1.8}
.ms-go{background:#158AA4;color:#fff;border-radius:999px;height:40px;padding:0 24px;font-size:15px;font-weight:500;display:flex;align-items:center;gap:8px}
.ms-go svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.2}
.ms-clear{color:#158AA4;font-size:13px;font-weight:600}
.ms-sel{font-size:14px;font-weight:500;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-srch{display:flex;align-items:center;gap:8px;border:1px solid #E5E7EB;border-radius:8px;height:40px;padding:0 10px}
.ms-srch svg{width:16px;height:16px;stroke:#A1A1AA;fill:none;stroke-width:1.8;flex-shrink:0}
.ms-srch input{flex:1;border:0!important;outline:none;font-size:14px;min-width:0}
.ms-h2{font-size:14px;font-weight:600;margin:22px 0 10px}
.ms-list label{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13px;line-height:18px}
.ms-list input{width:16px;height:16px;margin:0}
.seg2{display:flex;border:1px solid #E5E7EB;border-radius:8px;padding:4px;gap:4px;margin-bottom:18px}
.seg2 button{flex:1;height:30px;border-radius:6px;font-size:12px;color:#52525B}
.seg2 button[aria-pressed="true"]{background:#158AA4;color:#fff}
.ms-cal .calnav{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.ms-cal .calnav span{font-size:14px;color:#52525B}
.ms-cal .calnav button{width:28px;height:28px;border:0;color:#71717A}
#msheet .cal{grid-template-columns:1fr}
#msheet .cal h5{display:none}
#msheet .cal .g button{padding:9px 0}
#msheet .guest{padding:14px 0}

/* menu — villasepeti has none; ours lists every home type and region */
.menubtn{width:40px;height:40px;display:grid;place-items:center;border-radius:8px;color:inherit}
.menubtn svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2}
.vnav{display:flex;gap:2px;margin:0 auto 0 28px}
.vnav>div{position:relative}
.vnav>div>button{height:40px;padding:0 12px;font-size:14px;font-weight:600;border-radius:8px;color:inherit;display:flex;gap:4px;align-items:center}
.vnav>div>button svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.vnav>div>button:hover{background:rgba(255,255,255,.12)}
.mega{position:absolute;top:100%;left:0;background:#fff;color:#11181C;border:1px solid #E5E7EB;border-radius:12px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);padding:12px;min-width:240px;z-index:60;display:none}
.vnav>div:hover .mega,.vnav>div:focus-within .mega{display:block}
.mega button{display:flex;justify-content:space-between;width:100%;padding:7px 10px;border-radius:6px;font-size:14px;text-align:left}
.mega button:hover{background:#F4F4F5}
.mega button.all{color:#158AA4;font-weight:600;border-top:1px solid #E5E7EB;border-radius:0 0 6px 6px;margin-top:6px;padding-top:10px}
.mega h5{font-size:12px;line-height:16px;color:#71717A;margin:6px 10px 4px;font-weight:600}
.mega.wide{min-width:720px;left:auto;right:-200px}
.vnav>div:hover .mega.wide,.vnav>div:focus-within .mega.wide{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 8px}
.mega.wide .sub{padding-left:22px;font-size:13px;color:#52525B}
@media(max-width:1100px){.vnav{display:none}}
@media(min-width:1101px){.vh-top .menubtn{display:none}}
#menu{position:fixed;inset:0;z-index:90;background:rgba(2,20,28,.45);display:flex;justify-content:flex-start}
#menu[hidden]{display:none}
#menu .panel{width:min(360px,100%);height:100%;background:#fff;color:#11181C;display:flex;flex-direction:column}
#menu .ph2{display:flex;justify-content:space-between;align-items:center;height:56px;padding:0 8px 0 16px;border-bottom:1px solid #E5E7EB;flex-shrink:0}
#menu .ph2 .brand b{color:#005EB2}
#menu .mb{flex:1;overflow-y:auto;padding:8px 0}
#menu details{border-bottom:1px solid #F1F1F3}
#menu summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:14px 16px;font-size:15px;font-weight:600;cursor:pointer}
#menu summary::-webkit-details-marker{display:none}
#menu summary svg{width:16px;height:16px;stroke:#71717A;fill:none;stroke-width:2;transition:transform .15s}
#menu details[open] summary svg{transform:rotate(180deg)}
#menu details button{display:block;width:100%;text-align:left;padding:9px 28px;font-size:14px}
#menu details button.sub{padding-left:44px;font-size:13px;color:#52525B}
#menu details button.all{color:#158AA4;font-weight:600}
#menu .ml{display:block;width:100%;text-align:left;padding:14px 16px;font-size:15px;font-weight:600;border-bottom:1px solid #F1F1F3}
#menu .mf{display:flex;gap:10px;align-items:center;padding:14px 16px;border-top:1px solid #E5E7EB;font-size:14px;font-weight:600}
#menu .mf .ms-go{margin-left:auto}

/* villasepeti hero — measured: desktop 1440px / mobile 390px */
.topbar{background:#093A45;color:#fff;font-size:14px;line-height:22px;font-weight:600}
.topbar .wrap{max-width:none;display:flex;gap:24px;align-items:center;min-height:56px;padding:8px 32px;flex-wrap:nowrap}
.topbar .r{margin-left:auto;display:flex;gap:18px;align-items:center}
.topbar .hn{background:rgba(255,255,255,.12);border:0;border-radius:999px;padding:6px 14px;color:#fff;font:500 13px/18px var(--sans);width:200px}
.topbar .hn::placeholder{color:#C8D6DA}
@media(max-width:900px){.topbar .d{display:none}.topbar .wrap{padding:8px 16px}}
body:not(.inner) .hdr{display:none}
.vhero{position:relative;height:384px;background:#02141C center/cover no-repeat;color:#fff;padding:0 32px}
.vh-top{display:flex;align-items:center;justify-content:space-between;padding-top:12px;height:52px;position:relative;z-index:6}
.vh-top .brand b{color:#fff}
.vh-lic{position:absolute;left:0;right:0;top:68px;text-align:center;font-size:14px;line-height:20px;color:#E4E4E7;pointer-events:none}
.vh-r{display:flex;align-items:center;gap:14px;font-size:14px;line-height:22px;font-weight:500}
.vh-r svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:1.8}
.vhero h1{margin:52px auto 0;max-width:672px;text-align:center;font:700 32px/40px var(--sans)}
.vh-sub{margin:12px auto 0;max-width:672px;text-align:center;font-size:18px;line-height:26px}
.vh-radio{display:flex;justify-content:center;gap:44px;margin-top:20px;font-size:16px;line-height:24px;font-weight:600}
.vh-radio label{display:flex;align-items:center;gap:8px;cursor:pointer}
.vh-radio input{accent-color:#158AA4;width:13px;height:13px}
.vh-bar{position:absolute;left:50%;top:352px;transform:translateX(-50%);width:min(919px,calc(100% - 32px));z-index:5}
.vbar{display:flex;align-items:center;height:64px;background:#fff;border-radius:12px;padding:0 8px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);color:#11181C}
.vbar .vf{flex:1;text-align:left;padding:8px 16px;border-radius:12px;min-width:0}
.vbar .vf small{display:block;font-size:12px;line-height:16px;font-weight:600;color:#000}
.vbar .vf span{display:block;font-size:14px;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vbar .vf[aria-expanded="true"]{background:#F4F4F5}
.vbar .dv{width:1px;height:32px;background:#D9D9D9;flex-shrink:0}
.vbar .vfilter{width:48px;height:48px;border-radius:9999px;border:1px solid #D4D4D8;display:grid;place-items:center;flex-shrink:0;margin-left:8px}
.vbar .vfilter svg{width:20px;height:20px;stroke:#11181C;fill:none;stroke-width:1.8}
.vbar .vgo{height:48px;padding:0 24px;border-radius:16px;background:#158AA4;color:#fff;font-size:16px;display:flex;align-items:center;gap:8px;margin-left:8px;flex-shrink:0}
.vbar .vgo svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2.2}
.vbar .hq{flex:1;border:0;outline:none;padding:0 16px;font-size:14px;color:#11181C;background:transparent}
.vmob{display:none}
.vchips{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:68px;padding-inline:16px}
.vchips button{height:32px;padding:0 12px;border:1px solid #D4D4D8;border-radius:9999px;color:#158AA4;font-size:12px;line-height:16px;font-weight:500}
.vexplore{margin:28px auto 0;width:min(393px,calc(100% - 32px));min-height:56px;display:flex;align-items:center;justify-content:center;background:#E3F4F8;border-radius:12px;font-size:14px;line-height:22px;color:#0F6274;text-align:center;padding:0 16px}
.vexplore b{font-weight:700}
.vexplore+.sec{padding-top:32px}
.sec-h h2{font-size:24px!important;line-height:32px!important}
@media(max-width:700px){
  .vhero{height:320px;padding:0 16px}
  .vh-lic{top:64px;font-size:12px;line-height:16px}
  .vhero h1{margin-top:70px;max-width:326px;font-size:20px;line-height:28px}
  .vh-sub{display:none}
  .vh-radio{margin-top:34px;gap:16px;font-size:14px;line-height:22px}
  .vh-radio label{white-space:nowrap}
  .vh-r .hide-m{display:none}
  .vh-bar{top:286px;width:calc(100% - 32px)}
  .vbar{display:none}
  .vmob{display:flex;width:100%;align-items:center;justify-content:space-between;background:#fff;border:1px solid #E5E7EB;border-radius:12px;padding:12px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);color:#11181C;font-size:14px;line-height:22px;font-weight:500;text-align:left}
  .vmob i{width:40px;height:40px;border-radius:8px;background:#158AA4;display:grid;place-items:center}
  .vmob svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2.2}
  .vchips,.vexplore{display:none}
  .vexplore+.sec{padding-top:64px}
  .sec-h h2{font-size:20px!important;line-height:28px!important}
}
body:not(.notes) .note,body:not(.notes) .src,body:not(.notes) .rlist .new,body:not(.notes) .rlist .n,body:not(.notes) .two em,body:not(.notes) .two .new,body:not(.notes) .col.new b::after,body:not(.notes) .nn{display:none}
.member{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--navy);color:#fff;border-radius:12px;padding:22px 26px;flex-wrap:wrap}
.member b{font-size:18px;line-height:26px}
.revs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rev{border:1px solid var(--line);border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:6px}
.rev .h{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.rev .h small{display:block;font-size:12px;color:var(--muted)}
.rev .h b{font-size:15px}
.rev .s{background:var(--navy);color:#fff;border-radius:6px;padding:1px 8px;font-weight:600;font-size:14px}
.rev .who{font-size:13px;color:var(--muted)}
.rev p{margin:4px 0 0;font-size:14px;line-height:22px}
.rev .tr{font-size:12px;color:var(--note);margin-top:auto}
@media(max-width:900px){.revs{grid-template-columns:1fr}}
.why-lead{max-width:760px;color:#44474D;margin:0 0 24px}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 32px}
.why b{display:block;font-size:18px;line-height:26px;font-weight:600;margin-bottom:4px}
.why p{margin:0;font-size:14px;line-height:22px;color:#44474D}
@media(max-width:760px){.why{grid-template-columns:1fr}}
.owner{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:28px}
.owner h2{margin:0;font-size:20px;line-height:28px}
.owner p{margin:6px 0 0;color:#44474D;font-size:15px;max-width:680px}
@media(max-width:700px){.owner{grid-template-columns:1fr}}
.odate{display:inline-block;margin-top:10px;background:var(--tint);color:var(--teal);border-radius:6px;padding:1px 8px;font-size:12px;font-weight:600;align-self:flex-start}
.legend{display:flex;gap:14px;font-size:13px;color:var(--muted);margin-top:10px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:middle}
.lic{border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:13px;margin-top:14px;color:#44474D}
.linkb{color:var(--teal);font-weight:600;font-size:14px;margin-top:10px}
.ftr .hours{display:grid;gap:4px;margin-top:12px}
.sec{padding-block:48px}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.sec-h h2{font:600 20px/28px var(--sans);margin:0}
.sec-h p{margin:4px 0 0;color:var(--muted)}
.link{font-size:14px;font-weight:600;color:var(--blue)}
.band{background:var(--tint)}
.row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 72px)/4);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
.row>*{scroll-snap-align:start}
@media(max-width:1000px){.row{grid-auto-columns:calc((100% - 24px)/2.2)}}
@media(max-width:600px){.row{grid-auto-columns:82%}}
.months{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.month{border:1px solid var(--line);border-radius:10px;padding:16px 18px}
.month h3{margin:0 0 8px;font-size:16px}
.month button{display:flex;width:100%;justify-content:space-between;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.month button b{color:var(--blue);font-variant-numeric:tabular-nums}
@media(max-width:760px){.months{grid-template-columns:1fr}}
.cols{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.col{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden;text-align:left}
.col .im{aspect-ratio:16/9;background:var(--panel) center/cover;width:100%}
.col .tx{padding:12px 14px 14px}
.col b{display:block;font-size:18px;line-height:26px;font-weight:600}
.col span{display:block;font-size:14px;line-height:20px;color:var(--muted)}
.col.new b::after{content:"yeni";margin-left:8px;font-size:11px;color:var(--orange-d)}
@media(max-width:900px){.cols{grid-template-columns:1fr 1fr}}
.dests{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.dest{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:15px;font-weight:600}
.dest i{display:block;width:100%;aspect-ratio:1;border-radius:50%;background:var(--navy) center/cover;border:3px solid var(--white);box-shadow:0 2px 8px rgba(0,20,40,.12)}
.dest small{font-size:12px;font-weight:400;color:var(--muted);margin-top:-4px}
@media(max-width:900px){.dests{grid-template-columns:repeat(4,1fr)}}
@media(max-width:480px){.dests{grid-template-columns:repeat(3,1fr)}}

/* CARD (villasepeti measurements) */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 24px}
@media(max-width:980px){.grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.grid{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;cursor:pointer;min-width:0;text-align:left}
.card .ph{aspect-ratio:3/2;border-radius:8px;background:var(--panel) center/cover;position:relative}
.card .tag{position:absolute;left:10px;top:10px;background:var(--white);color:var(--navy);font-size:11px;font-weight:700;border-radius:999px;padding:2px 9px}
.card .top{display:flex;justify-content:space-between;align-items:center;margin-top:12px;gap:8px}
.card .loc{font-size:12px;line-height:16px;color:var(--muted)}
.card .sc{display:flex;align-items:center;gap:6px;font-size:12px;line-height:16px;color:#6B7280;flex-shrink:0}
.card .sc b{font-size:14px;line-height:22px;font-weight:600;color:#000}
.card h3{font-size:16px;line-height:24px;font-weight:600;margin:4px 0 0}
.card .kind{font-size:12px;line-height:16px;font-weight:500}
.card .spec{display:flex;gap:14px;margin-top:10px;font-size:14px;line-height:22px;font-weight:500;flex-wrap:wrap}
.card .feat{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.chip{font-size:12px;line-height:16px;color:#27272A;background:var(--panel);border-radius:999px;padding:2px 9px}
.chip.more{color:var(--teal);background:var(--tint)}
.card .price{margin-top:12px;font-size:14px;line-height:22px;font-weight:600}
.card .price span{font-weight:300;color:var(--muted)}
.card .price.na{font-weight:500;color:var(--muted)}
.grid.list{grid-template-columns:1fr;gap:16px}
.grid.list .card{display:grid;grid-template-columns:300px 1fr;gap:0 20px;border:1px solid var(--line);border-radius:12px;padding:12px}
.grid.list .card .ph{grid-row:1/8}
.grid.list .card .top{margin-top:0}
@media(max-width:700px){.grid.list .card{grid-template-columns:1fr}.grid.list .card .ph{grid-row:auto}}

/* RESULTS */
.dhero{background:var(--panel);border-bottom:1px solid var(--line)}
.dhero .wrap{padding-block:28px 22px}
.crumb{font-size:12px;color:var(--muted)}
.dhero h1{font:700 26px/34px var(--sans);margin:6px 0 4px}
.dhero p{margin:0;color:#44474D;max-width:760px}
.subs{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.subs button{border:1px solid var(--line);background:var(--white);border-radius:999px;padding:5px 12px;font-size:13px;font-weight:500}
.subs button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.toolbar{display:flex;align-items:center;gap:10px;padding-block:18px;flex-wrap:wrap}
.toolbar .cnt{margin-right:auto;font-size:14px;color:#44474D}
.toolbar .cnt b{color:var(--ink)}
.tbtn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:7px 14px;font-size:14px;font-weight:500;background:var(--white)}
.tbtn .badge{background:var(--orange);color:#fff;border-radius:999px;font-size:11px;padding:0 6px}
.sortm{position:relative}
.sortm ul{position:absolute;right:0;top:calc(100% + 6px);list-style:none;margin:0;padding:6px;background:var(--white);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(0,20,40,.12);min-width:190px;z-index:20}
.sortm li button{width:100%;text-align:left;padding:7px 10px;border-radius:6px;font-size:14px}
.sortm li button[aria-pressed="true"]{background:var(--tint);color:var(--teal);font-weight:600}
.vt{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.vt button{padding:7px 10px}
.vt button[aria-pressed="true"]{background:var(--tint)}
.vt svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:1.8;display:block}
.active{display:flex;gap:6px;flex-wrap:wrap;margin:-6px 0 16px}
.active button{background:var(--tint);color:var(--teal);border-radius:999px;padding:3px 10px;font-size:13px;font-weight:500}
.empty{border:1px dashed #C5CFDB;border-radius:10px;padding:40px 20px;text-align:center;color:var(--muted)}
.empty b{display:block;color:var(--navy);font-size:17px;margin-bottom:4px}
.pager{display:flex;gap:6px;justify-content:center;margin:36px 0 12px;flex-wrap:wrap}
.pager a{min-width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;font-size:14px;padding:0 8px}
.pager a.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-block:28px 56px}
.guide div{border:1px solid var(--line);border-radius:10px;padding:16px}
.guide b{display:block;margin-bottom:4px}
.guide p{margin:0;font-size:14px;color:var(--muted)}
@media(max-width:760px){.guide{grid-template-columns:1fr}}

/* OPTIONS MODAL */
.modal{position:fixed;inset:0;z-index:60;background:rgba(2,20,28,.45);display:grid;place-items:center;padding:16px}
.modal[hidden]{display:none}
.mbox{background:var(--white);border-radius:14px;width:min(760px,100%);max-height:88dvh;display:flex;flex-direction:column}
.mbox header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.mbox header b{font-size:17px}
.mbox header button{font-size:22px;line-height:1;padding:4px 8px}
.mbody{overflow:auto;padding:4px 20px 12px}
.mbody h4{margin:18px 0 10px;font-size:15px}
.two{columns:2 220px;column-gap:24px}
.two label{display:flex;gap:9px;align-items:flex-start;padding:4px 0;font-size:14px;line-height:20px;break-inside:avoid}
.two input{accent-color:var(--teal);margin-top:2px}
.two em{font-style:normal;font-size:11px;color:var(--note);margin-left:4px}
.two .new{color:var(--orange-d);font-size:11px;font-weight:600;margin-left:4px}
.info{background:var(--tint);color:#0F4C5C;border-radius:8px;padding:10px 12px;font-size:13px;line-height:19px}
.prices{display:flex;gap:10px}
.prices label{flex:1;font-size:12px;color:var(--muted)}
.prices input{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:14px;color:var(--ink);margin-top:2px}
.mbox footer{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-top:1px solid var(--line)}

/* DETAIL */
.dgal{margin-top:20px;aspect-ratio:21/9;border-radius:12px;background:var(--panel) center/cover;position:relative}
.dgal span{position:absolute;right:12px;bottom:12px;background:var(--white);border-radius:8px;padding:5px 10px;font-size:13px;font-weight:600}
@media(max-width:700px){.dgal{aspect-ratio:3/2}}
.det{display:grid;grid-template-columns:1fr 360px;gap:56px;padding-block:24px 72px}
@media(max-width:960px){.det{grid-template-columns:1fr}}
.det h1{font:700 28px/36px var(--sans);margin:6px 0 8px}
.meta{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:14px}
.meta b{background:var(--navy);color:#fff;border-radius:6px;padding:1px 7px}
.specs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:8px;margin:22px 0}
.specs div{padding:14px 16px;border-right:1px solid var(--line)}
.specs div:last-child{border-right:0}
.specs b{display:block;font-size:20px;line-height:28px;font-variant-numeric:tabular-nums}
.specs span{font-size:12px;color:var(--muted)}
@media(max-width:520px){.specs{grid-template-columns:1fr 1fr}.specs div:nth-child(2){border-right:0}.specs div:nth-child(-n+2){border-bottom:1px solid var(--line)}}
.blk{padding-block:22px;border-top:1px solid var(--line)}
.blk h2{font-size:18px;line-height:26px;font-weight:600;margin:0 0 12px}
.hl{display:flex;flex-wrap:wrap;gap:8px}
.todo{display:grid;gap:8px}
.todo i{display:block;height:12px;border-radius:4px;background:var(--panel)}
.mapbox{position:relative;border-radius:8px;overflow:hidden;background:#E9EEF3;aspect-ratio:16/7}
.mapbox svg{display:block;width:100%;height:100%}
.mapbox .cap{position:absolute;left:12px;bottom:12px;background:var(--white);border-radius:6px;padding:8px 12px;font-size:13px;line-height:18px;box-shadow:0 2px 8px rgba(0,20,40,.12)}
.book{position:sticky;top:88px;border:1px solid var(--line);border-radius:12px;padding:22px;box-shadow:0 6px 24px rgba(0,20,40,.08);align-self:start}
.book .pr{font-size:22px;line-height:30px;font-weight:700}
.book .pr span{font-size:14px;font-weight:300;color:var(--muted)}
.book .bf{border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-top:8px;font-size:15px;width:100%;text-align:left}
.book .bf small{display:block;font-size:12px;font-weight:600;color:var(--muted)}
.book .cta{width:100%;padding:13px;border-radius:8px;font-size:15px;margin-top:12px}
.book .alt{width:100%;padding:12px;border-radius:8px;border:1px solid var(--navy);color:var(--navy);font-weight:600;margin-top:8px}

/* footer + tab bar */
.ftr{border-top:1px solid var(--line);padding-block:40px 28px;font-size:14px;color:var(--muted)}
.ftr .wrap{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
.ftr h4{margin:0 0 10px;font-size:13px;color:var(--ink)}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
@media(max-width:760px){.ftr .wrap{grid-template-columns:1fr 1fr}}
.tabbar{display:none}
@media(max-width:900px){
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  .tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--white);border-top:1px solid #E0E0E0;padding:12.5px 0 calc(10px + env(safe-area-inset-bottom,0px))}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:12px;line-height:16px;font-weight:500;color:#222}
  .tabbar svg{width:28px;height:28px;stroke:var(--icon);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
  .tabbar .wa{color:var(--wa)}
  .tabbar .wa .med{width:48px;height:48px;margin-top:-30px;border-radius:50%;background:var(--wa);display:grid;place-items:center;border:4px solid var(--white);box-shadow:0 4px 12px rgba(0,0,0,.18)}
  .tabbar .wa svg{width:24px;height:24px;stroke:#fff}
}

/* ===== v9: exact villasepeti listing page (measured 24.09.2026, 1440 + 390) ===== */
.hic,.hlog{display:flex;align-items:center;gap:8px;font-size:14px;line-height:22px;font-weight:500;color:#11181C}
.hic svg,.hlog svg{width:24px;height:24px;stroke:#11181C;fill:none;stroke-width:1.7}
.hdr .wrap{min-height:64px}
body.detail .hdr .mini,body.pageview .hdr .mini{display:none}
@media(max-width:760px){
  .topbar{display:block}
  .topbar .wrap{padding:8px 16px;min-height:56px;gap:0}
  .topbar .r{margin-left:0;width:100%;gap:16px}
  .topbar .r .cur{margin-left:auto}
  .hlog{gap:6px}
}
@media(max-width:420px){.hlog span{font-size:13px}.hdr .brand b{font-size:19px}.hdr .brand img{width:30px;height:30px}.hdr .wrap{gap:12px}}
.xd-rate .star{color:#F5A623;font-size:18px}
.xd-th{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;overflow:visible}
.xd-th button{width:auto;height:auto;aspect-ratio:88/60}
.xd-gal .nav{opacity:0;transition:opacity .15s}
.xd-gal:hover .nav{opacity:1}
.xroom .nm .ic{display:flex;gap:6px;margin-bottom:6px}
.xroom .nm .ic svg{width:22px;height:22px}
.xs .chk .more-amen{display:none}
@media(max-width:900px){
  .xd-code{font-size:12px;line-height:16px;color:#676767;margin-top:16px}
  .xd-code b{color:#11181C;font-weight:400}
  .xd-loc{font-size:14px;line-height:22px;color:#848484;margin-top:8px}
  .xd h1{font-size:20px;line-height:28px;font-weight:600;margin:4px 0 20px}
  .xd-rate{padding:16px;gap:12px}
  .xd-rate .pill{font-size:16px;padding:8px 12px}
  .xd-rate .pill u{font-size:14px}
  .xd-rate span{font-size:14px;line-height:22px}
  .xd-spec{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 8px;padding:24px 0}
  .xd-spec div{font-size:14px;line-height:22px;font-weight:500;gap:6px}
  .xd-spec svg{width:24px;height:24px}
  .xs{padding:24px 0}
  .xs h2{font-size:18px;line-height:26px;font-weight:600;margin-bottom:14px}
  .xs .txt{font-size:14px;line-height:22px}
  .xs .lnk{font-size:14px}
  .xs .chk{gap:12px;font-size:14px;line-height:22px}
  .xs .chk svg{width:22px;height:22px}
  .xs .chk .more-amen{display:none}
  .xs .chk.all .more-amen{display:flex}
  .xs .seeall{display:block;margin-top:14px;color:#158AA4;font-size:14px;font-weight:500}
  .xroom{flex-direction:column;align-items:stretch;gap:12px;padding:20px 0}
  .xroom .nm{display:flex;gap:14px;align-items:flex-start}
  .xroom .nm .ic{margin:0}
  .xroom b{font-size:16px;line-height:24px}
  .xroom small{font-size:12px;line-height:16px;color:#676767}
  .xroom .ft{justify-content:flex-start;font-size:14px;line-height:22px;gap:14px}
  .xroom .ft span::before{width:8px;height:8px;margin-right:6px}
  .xroom .ft .mo{padding:4px 12px}
  .xnear{font-size:14px;line-height:22px}
  .xcm{font-size:14px;line-height:22px}
  .xcm .h b{font-size:14px}
  .xlic{font-size:14px}
  .xlic b{font-size:16px;line-height:24px}
  .xrules{font-size:14px;line-height:24px}
  .xinfo{font-size:14px;line-height:22px}
  .xd-mh{height:64px;gap:14px}
  .xd-mh b{font-size:18px;font-weight:600}
  .xd-mh svg{width:24px;height:24px}
  body.detail{padding-bottom:calc(190px + env(safe-area-inset-bottom,0px))}
  .xd-mbar{padding:14px 16px calc(14px + env(safe-area-inset-bottom,0px))}
  .xd-mbar .row{margin-bottom:12px;font-size:14px}
  .xd-mbar .row .d{font-size:14px;line-height:22px;gap:8px}
  .xd-mbar .row .d svg{width:20px;height:20px}
  .xd-mbar .row .p b{font-size:18px;line-height:26px}
  .xd-mbar .row .p span{font-size:14px}
  .xd-mbar .row .p button{width:32px;height:32px;border-radius:8px}
  .xd-mbar .go1,.xd-mbar .go2{height:48px;font-size:14px}
  .xd-mbar .go1{font-weight:400;margin-bottom:12px}
  .xd-mbar .go2{font-weight:500}
}
/* ===== v10: villasepeti search page + card (measured 24.09.2026) ===== */
.csb{display:flex;align-items:center;background:#fff;border:1px solid #E4E4E7;border-radius:12px;height:48px;padding:0 6px 0 4px;color:#11181C}
.csb .cf{flex:1;min-width:0;text-align:left;padding:0 14px;font-size:14px;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.csb .cf.ph{color:#71717A}
.csb i{width:1px;height:28px;background:#D9D9D9;flex-shrink:0}
.csb .cgo{width:36px;height:36px;border-radius:999px;background:#158AA4;display:grid;place-items:center;flex-shrink:0}
.csb .cgo svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2.2}
.csb .cm{display:none}
@media(min-width:901px){
  body.results .hdr{background:#093A45;border-bottom:0}
  body.results .hdr .brand b{color:#fff}body.results .hdr .brand b i{color:#FF7A00}
  body.results .hdr .hic svg,body.results .hdr .hlog svg{stroke:#fff}
  body.results .hdr .hlog,body.results .hdr .menubtn{color:#fff}
  body.results .hdr .mini{max-width:560px;margin:0 auto}
}
@media(max-width:900px){
  .csb{height:auto;padding:10px 12px;border-color:#E5E7EB}
  .csb .cf,.csb i{display:none}
  .csb .cm{display:flex;flex-direction:column;flex:1;min-width:0;text-align:left}
  .csb .cm small{font-size:12px;line-height:16px;color:#676767;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .csb .cm b{font-size:14px;line-height:22px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .csb .cgo{width:32px;height:32px;border-radius:8px}
  body.inner:not(.detail) .hdr .mini{order:3;flex-basis:100%;padding:0 0 12px}
}
/* destination banner (Hevlov Homes addition) */
.rb{position:relative;height:280px;background:#093A45 center/cover no-repeat;color:#fff;display:flex;align-items:flex-end}
.rb::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,20,28,.15),rgba(2,20,28,.7))}
.rb .wrap{position:relative;width:100%;padding-block:28px}
.rb .crumb{color:rgba(255,255,255,.85);font-size:12px}
.rb h1{font:700 28px/36px var(--sans);margin:6px 0 0;max-width:760px;text-wrap:balance}
.rb p{margin:8px 0 0;font-size:14px;line-height:22px;max-width:680px;opacity:.95}
.rsubs{display:flex;gap:6px;flex-wrap:wrap;padding-top:16px}
.rsubs button{border:1px solid #E4E4E7;background:#fff;border-radius:999px;padding:5px 12px;font-size:13px;font-weight:500}
.rsubs button.on{background:#093A45;border-color:#093A45;color:#fff}
@media(max-width:900px){.rb{height:200px}.rb h1{font-size:20px;line-height:28px}.rb .wrap{padding-block:18px}}
.toolbar .cnt .m{display:none}
.tbtn{height:40px;border-radius:8px;font-size:14px}
#optBtn{border-color:#D4D4D8}
#sortBtn{border-color:#E4E4E7;font-weight:600}
@media(max-width:900px){
  .toolbar{padding-block:16px;gap:8px;align-items:flex-start;flex-wrap:nowrap}
  .toolbar .cnt{font-size:14px;line-height:22px;color:#676767;width:64px;flex-shrink:0}
  .toolbar .cnt .d{display:none}.toolbar .cnt .m{display:inline}
  .toolbar .cnt b{color:#676767;font-weight:700}
  .tbtn{height:32px;padding:0 12px;font-size:12px;font-weight:500}
  #sortBtn{font-size:14px;font-weight:600;flex:1;justify-content:center}
  #optBtn{margin-left:auto}
  .vt{display:none}
}
/* listing card — villasepeti card */
.card .ph{border-radius:8px}
.card .fav{position:absolute;right:10px;top:10px;width:32px;height:32px;display:grid;place-items:center}
.card .fav svg{width:26px;height:26px;stroke:#fff;fill:rgba(0,0,0,.08);stroke-width:1.6;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}
.card .stag{right:auto;left:10px}
.card .top{align-items:flex-start;margin-top:12px}
.card .loc{font-size:12px;line-height:16px;color:#676767}
.card .sc{gap:10px;font-size:12px;line-height:16px;color:#6B7280}
.card .sc u{text-underline-offset:2px}
.card .sc .sp{display:inline-flex;align-items:center;gap:6px;background:#E3F4F8;border-radius:8px;padding:3px 10px;font-size:14px;line-height:22px;font-weight:600;color:#000}
.card .sc .sp i{font-style:normal;color:#F5A623;font-size:13px}
.card h3{font-size:16px;line-height:24px;font-weight:600;margin:0;color:#02141C}
.card .kind{font-size:12px;line-height:16px;font-weight:500;color:#02141C;margin-top:4px}
.card .spec{gap:16px;margin-top:14px;font-size:14px;line-height:22px;font-weight:500;color:#02141C}
.card .spec span{display:flex;align-items:center;gap:6px}
.card .spec svg{width:20px;height:20px;stroke:#02141C;fill:none;stroke-width:1.5}
.card .feat{gap:6px 20px;margin-top:14px;align-items:center}
.card .feat .f{font-size:12px;line-height:16px;color:#27272A;display:flex;align-items:center;gap:6px}
.card .feat .f::before{content:"";width:8px;height:8px;border-radius:50%;background:#158AA4;flex-shrink:0}
.card .feat .mo{font-size:14px;line-height:22px;color:#158AA4;background:#E3F4F8;border-radius:999px;padding:2px 12px}
.card .price{margin-top:18px;font-size:14px;line-height:22px;font-weight:600;color:#02141C}
.card .price span{font-weight:300;color:#676767}
.xd-mbar:empty,.xd-mh:empty{display:none!important}
@media(max-width:900px){body.detail:not(.hasbar){padding-bottom:0}}

/* ===== v11: TakeYacht-shaped listing card ===== */
.hc{display:flex;flex-direction:column;background:#fff;border:1px solid #CCD6E0;border-radius:14px;overflow:hidden;cursor:pointer;min-width:0;text-align:left;color:#202B3D}
.hc .ph{position:relative;aspect-ratio:348/229;background:#E9EEF2;border-radius:0}
.hc .trk{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.hc .trk::-webkit-scrollbar{display:none}
.hc .trk div{flex:0 0 100%;height:100%;background:#E9EEF2 center/cover;scroll-snap-align:start}
.hc .ar{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:100px;background:rgba(255,255,255,.92);box-shadow:0 5px 35px 5px rgba(0,0,0,.12);display:grid;place-items:center;color:#158AA4}
.hc .ar svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6}
.hc .ar.p{left:15px}.hc .ar.n{right:15px}
.hc .dots{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;gap:6px;align-items:center}
.hc .dots i{width:6px;height:6px;border-radius:99px;background:rgba(255,255,255,.55)}
.hc .dots i.on{width:18px;background:#fff}
.hc .cnt{position:absolute;left:10px;bottom:9px;background:rgba(18,55,75,.61);color:#fff;border-radius:15px;padding:4px 8px;font-size:12px;line-height:18px}
.hc .fav{position:absolute;right:10px;top:10px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.7);display:grid;place-items:center}
.hc .fav svg{width:18px;height:18px;stroke:#158AA4;fill:none;stroke-width:2}
.hc .fav.on svg{fill:#158AA4}
.hc .off{position:absolute;left:0;top:10px;background:#E5484D;color:#fff;font-size:12px;line-height:16px;font-weight:700;padding:4px 10px 4px 10px;border-radius:0 999px 999px 0}
.hc .stag{top:auto;bottom:38px;left:10px;right:auto}
.hc .bd{padding:17px 12px 14px;display:flex;flex-direction:column;gap:10px;flex:1}
.hc .lc{display:flex;align-items:center;gap:6px;font-size:13.5px;line-height:20px;font-weight:600;color:#158AA4}
.hc .lc svg{width:12px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;flex-shrink:0}
.hc h3{margin:0;font-size:17px;line-height:23.8px;font-weight:700;color:#202B3D}
.hc .kd{font-size:12px;line-height:16px;color:#4D6478;margin-top:-6px}
.hc .rt{display:flex;align-items:center;gap:6px;font-size:14px;line-height:21px}
.hc .rt i{font-style:normal;color:#F5A623;font-size:16px}
.hc .rt b{font-weight:600;color:#3D4B5C}
.hc .rt small{font-size:14px;color:#1A1A1A}
.hc .sp{margin:0;font-size:13px;line-height:19.5px;color:#4D6478}
.hc .ft2{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;line-height:16px;color:#27272A}
.hc .ft2 span{display:flex;align-items:center;gap:6px}
.hc .ft2 span::before{content:"";width:7px;height:7px;border-radius:50%;background:#158AA4}
.hc .ft2 .mo{background:#E3F4F8;color:#158AA4;border-radius:999px;padding:1px 9px}
.hc .ft2 .mo::before{display:none}
.hc .od{align-self:flex-start;background:#E3F4F8;color:#0F6274;border-radius:6px;padding:1px 8px;font-size:12px;font-weight:600}
.hc .fo{background:#F1F2F3;border-radius:0 0 13px 13px}
.hc .rate{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:16px 12px;border-top:1px solid #E9ECF0}
.hc .rate .t{display:flex;align-items:center;gap:6px;font-size:13px;line-height:19.5px;color:#7D8C99}
.hc .rate .t svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8}
.hc .rate .pr{display:flex;align-items:baseline;gap:5px;white-space:nowrap}
.hc .rate .pr small{font-size:13px;line-height:13px;font-weight:500;color:#55636F}
.hc .rate .pr s{font-size:16px;line-height:16px;color:#E5484D}
.hc .rate .pr strong{font-size:21px;line-height:21px;font-weight:600;color:#303A49}
.hc .act{padding:0 12px 12px}
.hc .act button{width:100%;height:41px;border-radius:6px;background:#158AA4;color:#fff;font-size:13px;line-height:18px;font-weight:700}
.row .hc,.grid .hc{height:100%}
.grid.list .hc{display:grid;grid-template-columns:340px 1fr;grid-template-rows:1fr auto}
.grid.list .hc .ph{grid-row:1/3;aspect-ratio:auto;height:100%}
.grid.list .hc .fo{border-radius:0 0 13px 0}
@media(max-width:700px){.grid.list .hc{display:flex}.grid.list .hc .ph{aspect-ratio:348/229}}

.pgb{position:relative;height:280px;background:#093A45 center/cover no-repeat;color:#fff;display:flex;align-items:flex-end;margin-bottom:28px}
.pgb::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,20,28,.15),rgba(2,20,28,.72))}
.pgb .wrap{position:relative;width:100%;padding-block:28px}
.pgb .crumb{color:rgba(255,255,255,.85)!important;font-size:12px}
.pgb h1{color:#fff!important;margin:6px 0 0!important;max-width:880px;font:700 32px/40px var(--sans)!important;text-wrap:balance}
@media(max-width:700px){.pgb h1{font-size:24px!important;line-height:32px!important}}
.pgb .by{color:rgba(255,255,255,.9)!important;margin-top:8px;font-size:13px}
@media(max-width:900px){.pgb{height:220px}.pgb .wrap{padding-block:20px}}
#v-page .pg{padding-top:0}
/* ===== v12: content pages (About, FAQ, Contact, Rent your home, Blog) ===== */
.pg{padding-block:28px 72px}
.pg .crumb{font-size:12px;color:#676767}
.pg h1{font:700 32px/40px var(--sans);margin:6px 0 8px;color:#02141C;text-wrap:balance}
.pg .lead{font-size:16px;line-height:26px;color:#3F3F46;max-width:760px;margin:0 0 24px}
.pg h2{font:700 22px/30px var(--sans);margin:36px 0 12px;color:#02141C}
.pg h3{font:600 17px/24px var(--sans);margin:22px 0 8px}
.pg p,.pg li{font-size:15px;line-height:25px;color:#27272A}
.pg .narrow{max-width:820px}
.pg .box{background:#F4F6F9;border-radius:12px;padding:18px 20px;font-size:14px;line-height:22px}
.pg .ph-in{color:#9A3412}
@media(max-width:700px){.pg h1{font-size:24px;line-height:32px}.pg h2{font-size:19px;line-height:26px}}
.faqtabs{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0 14px}
.faqtabs button{border:1px solid #E4E4E7;border-radius:999px;padding:7px 14px;font-size:14px;font-weight:500}
.faqtabs button[aria-pressed="true"]{background:#158AA4;border-color:#158AA4;color:#fff}
.faqsearch{width:100%;max-width:420px;height:42px;border:1px solid #D4D4D8;border-radius:10px;padding:0 14px;font-size:14px;background:#fff;color:#11181C;color-scheme:light}
.faq details{border-bottom:1px solid #E4E4E7}
.faq summary{list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:16px 2px;font-size:16px;line-height:24px;font-weight:600;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;color:#158AA4;font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 2px 18px;font-size:15px;line-height:25px;color:#3F3F46;white-space:pre-line}
.offices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}
.office{border:1px solid #E4E4E7;border-radius:12px;padding:18px}
.office small{display:block;font-size:12px;color:#676767}
.office b{display:block;font-size:17px;margin:2px 0 8px}
.office p{margin:0 0 8px;font-size:14px;line-height:22px}
.office ul{margin:0;padding-left:18px;font-size:13px;color:#52525B}
@media(max-width:900px){.offices{grid-template-columns:1fr}}
.frm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:760px;margin-top:14px}
.frm label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:#3F3F46}
.frm label.w{grid-column:1/-1}
.frm input,.frm select,.frm textarea{height:44px;border:1px solid #D4D4D8;border-radius:10px;padding:0 12px;font-size:14px;background:#fff;color:#11181C;font-family:inherit;color-scheme:light}
.frm textarea{height:110px;padding:10px 12px}
.frm .go{grid-column:1/-1;display:flex;gap:10px;justify-content:flex-end}
.frm .go button{height:44px;padding:0 22px;border-radius:999px;font-weight:600;font-size:14px}
.frm .go .pri{background:#158AA4;color:#fff}
.frm .go .sec{border:1px solid #158AA4;color:#158AA4}
@media(max-width:600px){.frm{grid-template-columns:1fr}}
.steps3{display:flex;gap:8px;margin:10px 0 6px;font-size:13px;color:#71717A}
.steps3 span{padding:4px 12px;border-radius:999px;background:#F4F4F5}
.steps3 span.on{background:#158AA4;color:#fff}
.bgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:20px}
.bcard{display:flex;flex-direction:column;border:1px solid #CCD6E0;border-radius:14px;overflow:hidden;text-align:left;background:#fff}
.bcard .im{aspect-ratio:16/10;background:#E9EEF2 center/cover}
.bcard .tx{padding:16px;display:flex;flex-direction:column;gap:8px}
.bcard .tg{font-size:12px;font-weight:600;color:#158AA4}
.bcard b{font-size:17px;line-height:24px;color:#202B3D}
.bcard p{margin:0;font-size:13px;line-height:20px;color:#4D6478}
.bcard .rd{font-size:13px;font-weight:600;color:#158AA4}
@media(max-width:900px){.bgrid{grid-template-columns:1fr}}
.art{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;align-items:start}
.art .cover{aspect-ratio:21/9;border-radius:14px;background:#E9EEF2 center/cover;margin:18px 0 8px}
.art .by{font-size:13px;color:#676767}
.kt{background:#E3F4F8;border-radius:12px;padding:18px 22px;margin:22px 0}
.kt b{display:block;font-size:16px;margin-bottom:8px;color:#0F4C5C}
.kt ul{margin:0;padding-left:20px}
.kt li{font-size:15px;line-height:24px;margin:4px 0}
.prose-ph{border:1px dashed #F0B98F;background:#FFF7F0;border-radius:10px;padding:12px 14px;font-size:13px;line-height:20px;color:#9A3412;margin:8px 0 14px}
.tbl{width:100%;border-collapse:collapse;font-size:14px;margin:10px 0 6px}
.tbl th{text-align:left;font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:#71717A;border-bottom:1px solid #D4D4D8;padding:8px 10px}
.tbl td{border-bottom:1px solid #F1F1F3;padding:9px 10px}
.tbl td a,.tbl td button{color:#158AA4;font-weight:600}
.tblw{overflow-x:auto}
.toc{position:sticky;top:88px;border:1px solid #E4E4E7;border-radius:12px;padding:16px;font-size:13px}
.toc b{display:block;margin-bottom:8px}
.toc a{display:block;padding:4px 0;color:#3F3F46}
.toc .cta2{display:block;margin-top:14px;background:#158AA4;color:#fff;border-radius:999px;text-align:center;padding:10px;font-weight:600}
.seo{font-size:12px;color:#71717A;margin-top:6px}
@media(max-width:1000px){.art{grid-template-columns:1fr}.toc{position:static}}

@media(min-width:901px){.xs .seeall{display:none}.xs .chk .more-amen{display:flex}}
@media(max-width:900px){
  .xd-th{display:none}
  .xd-gal{margin-inline:-16px}
  .xd-spec div:nth-child(5){grid-column:span 2}
}
@media(max-width:480px){
  .hdr .wrap{gap:8px;padding-inline:16px;flex-wrap:nowrap}
  .hdr .brand{gap:6px}
  .hdr .brand img{width:28px;height:28px}
  .hdr .brand b{font-size:18px}
  .hdr .hdr-r{gap:8px}
  .hlog{gap:4px}
  .hlog span{font-size:13px}
  .hic svg,.hlog svg{width:22px;height:22px}
  .hdr .menubtn{width:32px;height:32px}
  body.inner:not(.detail) .hdr .wrap{flex-wrap:wrap}
}

/* Iskelette dugme olan, sitede baglanti olan ogeler (Google baglantilari izleyebilsin). */
.mega a{display:flex;justify-content:space-between;width:100%;padding:7px 10px;border-radius:6px;font-size:14px;text-align:left}
.mega a:hover{background:#F4F4F5}
.mega a.all{color:#158AA4;font-weight:600;border-top:1px solid #E5E7EB;border-radius:0 0 6px 6px;margin-top:6px;padding-top:10px}
.mega.wide a.sub{padding-left:20px;font-size:13px;color:#52525B}
.vnav>div>a{height:40px;padding:0 12px;font-size:14px;font-weight:600;border-radius:8px;color:inherit;display:flex;align-items:center}
.vnav>div>a:hover{background:rgba(255,255,255,.12)}
#menu details a{display:block;width:100%;text-align:left;padding:9px 28px;font-size:14px}
#menu details a.sub{padding-left:44px;font-size:13px;color:#52525B}
#menu details a.all{color:#158AA4;font-weight:600}
#menu .mb a.ml{display:block}
.rsubs a{border:1px solid #E4E4E7;background:#fff;border-radius:999px;padding:5px 12px;font-size:13px;font-weight:500}
.rsubs a.on{background:#093A45;border-color:#093A45;color:#fff}
.hc .act a{display:grid;place-items:center;width:100%;height:41px;border-radius:6px;background:#158AA4;color:#fff;font-size:13px;line-height:18px;font-weight:700}
.hc .trk img{width:100%;height:100%;object-fit:cover;display:block}
.hc h3 a{color:inherit}
.owner a.cta{display:inline-block}
a.col,a.dest{color:inherit}
/* Ilan galerisi: kaydirilabilir fotograflar */
.xd-slides{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.xd-slides::-webkit-scrollbar{display:none}
.xd-slides img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;scroll-snap-align:start}
/* Dil secici */
details.lang{position:relative}
details.lang summary{list-style:none;cursor:pointer}
details.lang summary::-webkit-details-marker{display:none}
details.lang > div{position:absolute;right:0;top:calc(100% + 8px);background:#fff;color:#11181C;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(0,20,40,.12);padding:6px;z-index:60;min-width:140px}
details.lang a{display:block;padding:6px 10px;border-radius:6px;font-size:14px}
details.lang a:hover{background:#F4F4F5}
details.lang a[aria-current="true"]{font-weight:700}
#menu .mf details.lang > div{top:auto;bottom:calc(100% + 8px);left:0;right:auto}
.pager a[rel]{font-weight:700}
.rb:not([style]){background:#093A45}
[dir="rtl"] .xd-gal .nav.l{left:auto;right:12px}[dir="rtl"] .xd-gal .nav.r{right:auto;left:12px}
.hlog span{white-space:nowrap}
@media(max-width:420px){.hdr .brand b{font-size:17px}.hdr .brand{gap:5px}.hdr .brand img{width:28px;height:28px}.hdr .hdr-r{gap:8px}.hdr .hlog span{font-size:12px}}
/* Ana sayfa banner, telefon: villasepeti'de olculdu -- secenekler arasi 8px,
   sigmazsa alt satira iner (onceden 16px ve tek satir, ekrandan tasiyordu). */
@media(max-width:700px){.vh-radio{gap:6px;flex-wrap:wrap;margin-inline:calc(50% - 50vw)}.vh-radio label{padding:8px 0;gap:6px}}

/* Liste sayfasi, telefon (villasepeti olculdu, 375px):
   logo satiri kayar gider; arama kutusu koyu seritte (#093A45, 8px 16px,
   68px) ve altindaki sayi + Options + Recommended satiri ustte yapisik kalir. */
.msb{display:none}
@media(max-width:700px){
  body.results .hdr{position:static;background:#fff}
  body.results .hdr .mini{display:none}
  body.results .hdr .brand b{color:var(--d-brandBColor,#005EB2)}body.results .hdr .brand b i{color:var(--d-brandAColor,#FF7A00)}
  body.results .hdr .hic svg,body.results .hdr .hlog svg{stroke:#11181C}body.results .hdr .hlog,body.results .hdr .menubtn{color:#11181C}
  .msb{display:block;position:sticky;top:0;z-index:31;background:#fff;padding:8px 16px}
  .msb.stuck{background:var(--d-hdrBgResults,#093A45)}
  .msb .csb{margin:0}
  body.results .toolbar{position:sticky;top:68px;z-index:30;background:#fff;margin-inline:-16px;padding:8px 16px}
  body.results .toolbar .tbtn{height:32px;border-radius:8px;font-size:12px;line-height:16px;padding:0 12px;border:1px solid #D4D4D8}
  body.results .toolbar #sortBtn{border-color:#E4E4E7}
  body.results .toolbar .cnt{font-size:14px;line-height:22px}
}