:root{
  --navy:#0a1f3d; --navy-2:#13294b; --gold:#c9a14a; --gold-2:#e6c478;
  --ink:#0f172a; --muted:#5b6b82; --line:#e8ecf2; --bg:#ffffff; --soft:#f7f5ef;
}
*{ -webkit-font-smoothing:antialiased; }
html{ scroll-behavior:smooth; }
body{ font-family:'Inter',system-ui,sans-serif; color:var(--ink); background:var(--bg); line-height:1.6; }
h1,h2,h3,h4,.serif{ font-family:'Cormorant Garamond',serif; font-weight:600; letter-spacing:-.01em; }
.eyebrow{ text-transform:uppercase; letter-spacing:.22em; font-size:.78rem; font-weight:600; color:var(--gold); }
.text-navy{ color:var(--navy)!important; }
.text-muted-2{ color:var(--muted)!important; }
.bg-soft{ background:var(--soft)!important; }
.section{ padding:5rem 0; }

/* nav (lightweight) */
.topbar{
  background:#fff; border-bottom:1px solid var(--line); padding:1rem 0;
  position:sticky; top:0; z-index:50;
}
.topbar .brand{ display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--navy); font-family:'Cormorant Garamond',serif; font-weight:700; font-size:1.4rem; }
.topbar .brand img{ height:38px; }
.topbar a.nav-link{ color:var(--navy); font-weight:500; font-size:.92rem; }
.topbar a.nav-link:hover{ color:var(--gold); }
.lang-pill{ display:inline-flex; gap:.25rem; }
.lang-pill button{ background:transparent; border:1px solid var(--line); border-radius:2px; padding:.25rem .5rem; font-size:.75rem; font-weight:600; color:var(--muted); cursor:pointer; }
.lang-pill button.active{ background:var(--navy); color:#fff; border-color:var(--navy); }

/* buttons */
.btn-gold{ background:var(--gold); color:#fff; border:0; padding:.85rem 1.6rem; border-radius:2px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; font-size:.82rem; transition:all .25s ease; text-decoration:none; display:inline-flex; align-items:center; gap:.5rem; }
.btn-gold:hover{ background:var(--gold-2); color:#fff; transform:translateY(-2px); }
.btn-navy{ background:var(--navy); color:#fff; border:0; padding:.85rem 1.6rem; border-radius:2px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; font-size:.82rem; text-decoration:none; display:inline-flex; align-items:center; gap:.5rem; transition:all .25s ease;}
.btn-navy:hover{ background:var(--navy-2); color:#fff; }
.btn-outline-navy{ background:transparent; border:1px solid var(--navy); color:var(--navy); padding:.7rem 1.3rem; border-radius:2px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:.78rem; text-decoration:none; display:inline-flex; align-items:center; gap:.5rem; transition:all .25s ease;}
.btn-outline-navy:hover{ background:var(--navy); color:#fff; }

/* property card (mirrors index.html) */
.prop-card{
  background:#fff; border:1px solid var(--line); border-radius:4px; overflow:hidden;
  transition:all .4s ease; height:100%; display:flex; flex-direction:column;
}
.prop-card:hover{ transform:translateY(-6px); box-shadow:0 30px 60px -25px rgba(10,31,61,.2); }
.prop-img-link{ display:block; }
.prop-img{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.prop-img img{ width:100%; height:100%; object-fit:cover; transition:transform .8s ease; }
.prop-card:hover .prop-img img{ transform:scale(1.06); }
.prop-badge{ position:absolute; top:1rem; left:1rem; background:var(--gold); color:#fff; padding:.3rem .75rem; font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; font-weight:600; border-radius:2px; }
.prop-body{ padding:1.5rem; flex:1; display:flex; flex-direction:column; }
.prop-loc{ font-size:.78rem; color:var(--muted); text-transform:uppercase; letter-spacing:.15em; margin-bottom:.5rem; }
.prop-loc i{ color:var(--gold); margin-right:.35rem; }
.prop-title{ font-family:'Cormorant Garamond',serif; font-size:1.5rem; font-weight:600; color:var(--navy); margin-bottom:.75rem; }
.prop-specs{ display:flex; gap:1rem; padding:.85rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:1rem; font-size:.85rem; color:var(--muted); flex-wrap:wrap; }
.prop-specs span i{ color:var(--gold); margin-right:.35rem; }
.prop-foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.prop-price{ font-family:'Cormorant Garamond',serif; font-size:1.8rem; font-weight:700; color:var(--navy); line-height:1.1; }
.prop-price small{ display:block; font-size:.78rem; color:var(--muted); font-weight:400; font-family:'Inter',sans-serif; }
.btn-details{ display:inline-flex; align-items:center; gap:.45rem; padding:.55rem 1.1rem; border:1px solid var(--navy); color:var(--navy); background:transparent; font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; border-radius:2px; text-decoration:none; transition:all .25s ease; white-space:nowrap; }
.btn-details:hover{ background:var(--navy); color:#fff; }
.btn-details i{ font-size:.7rem; transition:transform .25s ease; }
.btn-details:hover i{ transform:translateX(3px); }

/* gallery */
.gallery-main{ aspect-ratio:16/10; overflow:hidden; border-radius:6px; background:#000; position:relative; }
.gallery-main img{ width:100%; height:100%; object-fit:cover; display:block; }
.gallery-main .badge-overlay{ position:absolute; top:1.25rem; left:1.25rem; background:var(--gold); color:#fff; padding:.4rem .85rem; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600; border-radius:2px; }
.gallery-thumbs{ display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin-top:.75rem; }
.gallery-thumbs button{ all:unset; cursor:pointer; aspect-ratio:4/3; overflow:hidden; border-radius:4px; border:2px solid transparent; transition:border-color .2s ease; }
.gallery-thumbs button.active{ border-color:var(--gold); }
.gallery-thumbs img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.gallery-thumbs button:hover img{ transform:scale(1.05); }

.detail-card{ background:#fff; border:1px solid var(--line); border-radius:4px; padding:2rem; }
.spec-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem 1.25rem; margin:1.25rem 0; }
.spec-grid .item{ border-top:1px solid var(--line); padding-top:.75rem; }
.spec-grid .item small{ display:block; text-transform:uppercase; letter-spacing:.14em; color:var(--muted); font-size:.7rem; margin-bottom:.2rem; }
.spec-grid .item strong{ font-family:'Cormorant Garamond',serif; font-size:1.35rem; color:var(--navy); font-weight:600; }
.feat-list{ list-style:none; padding:0; margin:0; }
.feat-list li{ padding:.55rem 0; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:.6rem; color:var(--navy); font-size:.95rem; }
.feat-list li i{ color:var(--gold); }
.price-big{ font-family:'Cormorant Garamond',serif; font-size:2.6rem; font-weight:700; color:var(--navy); line-height:1; }
.price-big small{ display:block; font-size:.85rem; color:var(--muted); font-weight:400; font-family:'Inter',sans-serif; margin-top:.35rem; letter-spacing:.06em; }

.page-hero{ background:var(--soft); padding:3.5rem 0 2rem; border-bottom:1px solid var(--line); }
.crumbs{ font-size:.8rem; color:var(--muted); margin-bottom:.5rem; }
.crumbs a{ color:var(--muted); text-decoration:none; }
.crumbs a:hover{ color:var(--gold); }

/* shared navbar (matches index, forced light/scrolled style on subpages) */
.navbar-custom{ position:sticky; top:0; left:0; right:0; z-index:1030; padding:.7rem 0; background:rgba(255,255,255,.96); box-shadow:0 6px 30px rgba(10,31,61,.06); transition:all .35s ease; }
.navbar-custom .brand{ font-family:'Cormorant Garamond',serif; font-size:1.6rem; font-weight:700; color:var(--navy); text-decoration:none; letter-spacing:-.01em; }
.navbar-custom .brand .dot{ color:var(--gold); }
.navbar-custom .nav-link{ color:var(--navy); font-weight:500; font-size:.95rem; margin:0 .35rem; padding:.5rem .75rem!important; text-decoration:none; }
.navbar-custom .nav-link:hover{ color:var(--gold)!important; }
.lang-switch{ display:inline-flex; align-items:center; gap:.25rem; margin:0 .35rem; background:var(--soft); border:1px solid var(--line); border-radius:2px; padding:.2rem .25rem; }
.lang-switch button{ background:transparent; border:0; cursor:pointer; padding:.3rem .45rem; border-radius:2px; display:inline-flex; align-items:center; gap:.3rem; color:var(--navy); font-size:.78rem; font-weight:600; letter-spacing:.04em; line-height:1; }
.lang-switch button .flag{ width:22px; height:16px; border-radius:2px; object-fit:cover; }
.lang-switch button:hover{ background:#eee6d2; }
.lang-switch button.active{ background:var(--gold); color:#fff; }
.btn-gold{ background:var(--gold); color:#fff; border:0; padding:.7rem 1.3rem; font-weight:600; letter-spacing:.04em; border-radius:2px; text-transform:uppercase; font-size:.78rem; text-decoration:none; display:inline-block; }
.btn-gold:hover{ background:var(--navy); color:#fff; }
@media (max-width:575px){ .lang-switch button .code{ display:none; } }

.prop-code-tag{ display:inline-flex; align-items:center; gap:.35rem; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); background:var(--soft); border:1px solid var(--line); padding:.3rem .55rem; border-radius:2px; margin:.1rem 0 .85rem; }
.prop-code-tag strong{ color:var(--navy); letter-spacing:.12em; margin-left:.15rem; }
.copy-code-btn{ background:transparent; border:0; color:var(--gold); cursor:pointer; font-size:.85rem; padding:.15rem .25rem; transition:all .2s ease; display:inline-flex; align-items:center; justify-content:center; }
.copy-code-btn:hover{ color:var(--navy); transform:scale(1.15); }
.copy-code-btn.copied{ color:#2e7d32; }
.ref-banner{ display:flex; align-items:center; gap:.85rem; background:#fff; border:1px solid var(--line); border-left:3px solid var(--gold); padding:.85rem 1rem; border-radius:2px; margin-bottom:1.25rem; }
.ref-banner .lbl{ font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); }
.ref-banner .code{ font-weight:700; color:var(--navy); letter-spacing:.12em; }
