/* ═══════════════════════════════════════════════════════════════
   KP Divine Realty — Theme (cream / ink / gold, Playfair + Inter)
   Loaded AFTER style.css. It (1) re-maps the legacy colour tokens so every
   existing page picks up the new look, and (2) adds the new components.
   ═══════════════════════════════════════════════════════════════ */

:root {
  --ink:#0b0f14; --ink-2:#111820; --cream:#f7f4ee; --cream-2:#efeae1;
  --gold:#c9a96a; --gold-2:#e3cfa4; --muted:#7b8391; --line:rgba(11,15,20,.1);
  --ease:cubic-bezier(.22,1,.36,1);

  /* legacy tokens (style.css) re-mapped to the new palette */
  --brand:#c9a96a; --brand-dark:#a8884a; --brand-coral:#e3cfa4;
  --parchment:#f7f4ee; --ivory:#ffffff; --warm-sand:#efeae1; --white:#ffffff;
  --dark:#0b0f14; --dark-mid:#111820; --dark-warm:#1b2430;
  --text:#0b0f14; --text-mid:#5d6470; --text-light:#7b8391; --text-warm:#4d5461; --text-silver:#b8bdc7;
  --border:rgba(11,15,20,.08); --border-mid:rgba(11,15,20,.14);
  --ring:rgba(11,15,20,.14); --ring-deep:rgba(11,15,20,.22);
  --gold-light:#e3cfa4; --gold-dark:#a8884a;
  --navy:#0b0f14; --navy-mid:#111820; --navy-light:#1b2430;
  --cream-dark:#efeae1;
  --shadow:0 18px 40px -24px rgba(11,15,20,.28);
  --radius:3px; --radius-lg:3px; --radius-xl:4px; --radius-2xl:999px;
  --font-display:'Playfair Display',Georgia,'Times New Roman',serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}

html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { background:var(--cream); color:var(--ink); font-family:var(--font-body); line-height:1.6; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4 { font-family:var(--font-display); font-weight:400; letter-spacing:-.015em; }
img { max-width:100%; }
::selection { background:var(--gold); color:#fff; }
section[id] { scroll-margin-top:90px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }

.skip-link { position:absolute; left:-9999px; top:8px; z-index:2000; background:var(--gold); color:var(--ink); padding:10px 16px; font-weight:600; }
.skip-link:focus { left:8px; }

.kp-progress { position:fixed; top:0; left:0; right:0; height:2px; z-index:1100; pointer-events:none; }
.kp-progress i { display:block; height:100%; width:0; background:linear-gradient(90deg,var(--gold),var(--gold-2)); }

/* ─── NAV ─────────────────────────────────────────── */
/* style.css styles the bare `nav` element — neutralise it for our inner <nav> */
.kp-nav nav, .kp-footer nav { position:static; height:auto; background:none; border:0; padding:0; backdrop-filter:none; display:flex; }

.kp-nav {
  position:fixed; inset:0 0 auto 0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:22px clamp(18px,5vw,64px); color:#fff; height:auto;
  transition:padding .45s var(--ease);
}
.kp-nav::before { /* background layer lives here so the header itself has no backdrop-filter
                     (backdrop-filter would trap the fixed mobile menu inside the header) */
  content:''; position:absolute; inset:0; z-index:-1; opacity:0;
  background:rgba(9,13,18,.86); backdrop-filter:blur(20px) saturate(160%); -webkit-backdrop-filter:blur(20px) saturate(160%);
  box-shadow:0 1px 0 rgba(255,255,255,.08); transition:opacity .45s;
}
.kp-nav.scrolled { padding:10px clamp(18px,5vw,64px); }
.kp-nav.scrolled::before { opacity:1; }
body.nav-solid .kp-nav::before { background:rgba(9,13,18,.97); }

.kp-logo { display:flex; align-items:center; gap:12px; color:#fff; text-decoration:none; white-space:nowrap; flex:none; }
.kp-logo-mark { width:44px; height:44px; object-fit:contain; display:block; }
.kp-logo-text { font-family:var(--font-display); font-size:17px; letter-spacing:.22em; text-transform:uppercase; line-height:1.15; display:flex; flex-direction:column; }
.kp-logo-text small { font-family:var(--font-body); font-size:9.5px; letter-spacing:.42em; color:var(--gold); font-weight:500; margin-top:3px; }

.kp-links { display:flex; gap:clamp(16px,2.2vw,32px); align-items:center; font-size:12px; letter-spacing:.15em; text-transform:uppercase; font-weight:500; }
.kp-links a { position:relative; padding:6px 0; color:#fff; opacity:.82; text-decoration:none; transition:opacity .3s; }
.kp-links a::after { content:''; position:absolute; left:0; bottom:0; height:1px; width:0; background:var(--gold-2); transition:width .45s var(--ease); }
.kp-links a:hover, .kp-links a.active { opacity:1; }
.kp-links a:hover::after, .kp-links a.active::after { width:100%; }
.kp-links .kp-link-minor { font-size:11px; opacity:.6; letter-spacing:.12em; }
.kp-links .kp-cta { padding:12px 22px; border:1px solid rgba(255,255,255,.34); border-radius:2px; font-size:11px; font-weight:600; opacity:1; transition:.4s var(--ease); }
.kp-links .kp-cta::after { display:none; }
.kp-links .kp-cta:hover { background:var(--gold); border-color:var(--gold); color:var(--ink); }

.kp-burger { display:none; flex:none; width:34px; height:22px; position:relative; z-index:2; background:none; border:0; cursor:pointer; }
.kp-burger span { position:absolute; left:0; right:0; height:1.5px; background:#fff; transition:.4s var(--ease); }
.kp-burger span:nth-child(1) { top:4px; }
.kp-burger span:nth-child(2) { top:15px; }
.kp-burger.active span:nth-child(1) { top:10px; transform:rotate(45deg); }
.kp-burger.active span:nth-child(2) { top:10px; transform:rotate(-45deg); }

.kp-flash { margin:64px 0 0 !important; border-radius:0 !important; padding:.9rem clamp(18px,5vw,64px) !important; }

/* ─── BUTTONS ─────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 28px; font-family:var(--font-body); font-size:11.5px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; border-radius:2px; border:1px solid transparent; transition:all .45s var(--ease); text-decoration:none; cursor:pointer; line-height:1.3; }
.btn-sm { padding:10px 18px; font-size:10.5px; }
.btn-gold { background:var(--gold); color:var(--ink); box-shadow:none; }
.btn-gold:hover { background:var(--gold-2); transform:translateY(-2px); box-shadow:0 18px 36px -16px rgba(201,169,106,.9); }
.btn-outline { background:transparent; border-color:rgba(11,15,20,.3); color:var(--ink); }
.btn-outline:hover { background:var(--ink); border-color:var(--ink); color:var(--cream); transform:translateY(-2px); }
.btn-navy, .btn-dark { background:var(--ink); color:var(--cream); border-color:var(--ink); }
.btn-navy:hover, .btn-dark:hover { background:var(--gold); border-color:var(--gold); color:var(--ink); transform:translateY(-2px); }
.btn-ghost { border-color:rgba(255,255,255,.42); color:#fff; background:transparent; }
.btn-ghost:hover { background:#fff; color:var(--ink); border-color:#fff; transform:translateY(-2px); }
.btn svg { transition:transform .45s var(--ease); flex:none; }
.btn:hover svg { transform:translateX(5px); }

/* ─── SECTION TITLES ──────────────────────────────── */
.section-label, .kp-eyebrow { display:inline-flex; align-items:center; gap:12px; font-size:10.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold); font-weight:600; margin-bottom:16px; }
.section-label::before, .kp-eyebrow::before { content:''; width:34px; height:1px; background:currentColor; opacity:.65; flex:none; }
.section-title { font-family:var(--font-display); font-weight:400; color:var(--ink); line-height:1.1; font-size:clamp(1.9rem,4vw,3rem); }
.section-title em, .kp-title em { font-style:italic; color:var(--gold); }
.section-title.light { color:#fff; }
.section-sub { color:var(--muted); font-weight:300; font-size:15px; line-height:1.8; }
.cities-inner .section-label, .testi-inner .section-label { justify-content:center; }

/* ─── HERO ────────────────────────────────────────── */
.kp-hero { position:relative; min-height:100vh; min-height:100svh; background:var(--ink); color:#fff; isolation:isolate; display:flex; flex-direction:column; overflow:hidden; }
.kp-bgs { position:absolute; inset:0; z-index:-1; }
.kp-bg { position:absolute; inset:0; opacity:0; transition:opacity 1.2s ease; }
.kp-bg.active { opacity:1; }
.kp-bg img { width:100%; height:100%; object-fit:cover; transform:scale(1.04); }
.kp-bg.active img { animation:kpKen 9s ease-out forwards; }
@keyframes kpKen { from { transform:scale(1.03); } to { transform:scale(1.16); } }
.kp-bgs::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(6,10,15,.92) 0%,rgba(6,10,15,.64) 46%,rgba(6,10,15,.18) 80%),linear-gradient(to top,rgba(6,10,15,.85),transparent 52%); }

.kp-hero-body { flex:1; display:flex; flex-direction:column; justify-content:center; padding:clamp(120px,16vh,170px) clamp(20px,7vw,110px) 24px; max-width:1180px; width:100%; }
.kp-texts { display:grid; }
.kp-text { grid-area:1/1; opacity:0; visibility:hidden; transition:opacity .9s ease,visibility .9s; }
.kp-text.active { opacity:1; visibility:visible; }
.kp-hero .kp-eyebrow { color:var(--gold-2); }
.kp-hero .kp-title { font-family:var(--font-display); font-size:clamp(2.4rem,6vw,5rem); line-height:1.03; margin-bottom:22px; color:#fff; font-weight:400; }
.kp-hero .kp-title em { font-style:italic; color:var(--gold-2); }
.kp-hero .kp-lead { max-width:540px; font-size:clamp(.95rem,1.15vw,1.06rem); line-height:1.85; color:rgba(255,255,255,.78); font-weight:300; margin-bottom:34px; }
.kp-actions { display:flex; gap:14px; flex-wrap:wrap; }
.kp-text .kp-anim { opacity:0; transform:translateY(34px); }
.kp-text.active .kp-anim { animation:kpRise 1.05s var(--ease) forwards; animation-delay:calc(var(--i,0)*.11s + .15s); }
@keyframes kpRise { to { opacity:1; transform:none; } }

/* search bar */
.kp-search { margin-top:clamp(26px,4vh,44px); display:grid; grid-template-columns:130px minmax(180px,1.7fr) 1fr 1fr auto; background:rgba(255,255,255,.97); border-radius:3px; box-shadow:0 30px 60px -30px rgba(0,0,0,.7); max-width:980px; }
.kp-search select, .kp-search input { border:0; border-right:1px solid var(--line); background:transparent; color:var(--ink); font-family:var(--font-body); font-size:13.5px; padding:18px 16px; outline-offset:-2px; min-width:0; width:100%; border-radius:0; }
.kp-search input::placeholder { color:#8a919d; }
.kp-search button { background:var(--gold); color:var(--ink); border:0; padding:0 30px; font-family:var(--font-body); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:600; cursor:pointer; transition:.4s var(--ease); border-radius:0 3px 3px 0; }
.kp-search button:hover { background:var(--ink); color:var(--gold-2); }

.kp-hero-ui { padding:8px clamp(20px,7vw,110px) clamp(26px,4vw,46px) max(96px,clamp(20px,7vw,110px)); display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.kp-dots { display:flex; gap:12px; align-items:center; }
.kp-dot { width:52px; height:2px; background:rgba(255,255,255,.26); position:relative; overflow:hidden; border:0; padding:8px 0; background-clip:content-box; cursor:pointer; }
.kp-dot i { position:absolute; left:0; top:8px; height:2px; width:0; background:var(--gold-2); }
.kp-dot.active i { width:100%; transition:width 6.5s linear; }
.kp-hero-right { display:flex; align-items:center; gap:22px; }
.kp-counter { font-size:12px; letter-spacing:.2em; color:rgba(255,255,255,.72); font-variant-numeric:tabular-nums; }
.kp-counter b { color:#fff; font-weight:600; }
.kp-arrows { display:flex; gap:10px; }
.kp-arrow { width:50px; height:50px; border:1px solid rgba(255,255,255,.3); border-radius:50%; display:grid; place-items:center; transition:.4s var(--ease); background:none; color:#fff; cursor:pointer; }
.kp-arrow:hover { background:var(--gold); border-color:var(--gold); color:var(--ink); transform:scale(1.07); }

/* ─── STATS ───────────────────────────────────────── */
.kp-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border-bottom:1px solid var(--line); }
.kp-stat { background:var(--cream); padding:clamp(30px,4vw,54px) clamp(12px,2.5vw,34px); text-align:center; }
.kp-stat strong { display:block; font-family:var(--font-display); font-weight:400; font-size:clamp(1.9rem,3.6vw,3rem); line-height:1; }
.kp-stat strong .plus { color:var(--gold); font-size:.62em; vertical-align:super; margin-left:2px; }
.kp-stat > span { display:block; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-top:12px; font-weight:500; }

/* ─── SHARED SECTION SHELL ────────────────────────── */
.kp-section { padding:clamp(64px,9vw,120px) clamp(20px,6vw,90px); }
.kp-sec-head { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:clamp(34px,5vw,60px); flex-wrap:wrap; }
.kp-sec-head h2 { font-size:clamp(1.9rem,4vw,3.1rem); max-width:18ch; line-height:1.08; }
.kp-sec-head h2 em { font-style:italic; color:var(--gold); }
.kp-sec-head p { max-width:380px; color:var(--muted); font-size:15px; font-weight:300; line-height:1.8; }
.kp-sec-head.center { justify-content:center; text-align:center; flex-direction:column; align-items:center; gap:0; }
.kp-sec-head.center h2 { max-width:24ch; }
.kp-more { display:flex; justify-content:center; margin-top:clamp(34px,5vw,56px); }

/* ─── QUICK TABS ──────────────────────────────────── */
.feature-tabs { background:var(--cream); border-bottom:1px solid var(--line); }
.tab-strip { display:flex; justify-content:center; overflow-x:auto; padding:0 12px; scrollbar-width:none; }
.tab-strip::-webkit-scrollbar { display:none; }
.tab-strip a { padding:1.15rem 1.5rem; font-size:11px; letter-spacing:.18em; font-weight:500; color:var(--muted); border-bottom:2px solid transparent; }
.tab-strip a:hover { color:var(--ink); }
.tab-strip a.active { color:var(--ink); border-bottom-color:var(--gold); }

/* ─── PROPERTY CARDS ──────────────────────────────── */
.featured { background:var(--cream); }
.featured-grid, .listings-grid, .wishlist-grid { gap:clamp(20px,2.4vw,32px); }
.prop-card { background:#fff; border:0; border-radius:3px; box-shadow:0 1px 2px rgba(11,15,20,.05); overflow:hidden; transition:transform .6s var(--ease),box-shadow .6s var(--ease); position:relative; }
.prop-card:hover { transform:translateY(-10px); box-shadow:0 40px 64px -34px rgba(11,15,20,.4); }
.prop-img { height:auto; aspect-ratio:4/3; background:var(--ink-2); }
.prop-img::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(6,10,15,.34),transparent 55%); opacity:0; transition:opacity .5s; pointer-events:none; }
.prop-card:hover .prop-img::after { opacity:1; }
.prop-img-photo { transition:transform 1.2s var(--ease); }
.prop-card:hover .prop-img-photo { transform:scale(1.09); }
.prop-img-placeholder { background:linear-gradient(135deg,var(--ink-2),var(--navy-light)); }
.prop-badge { top:14px; left:14px; z-index:2; background:rgba(241, 187, 9, 0.94); color:var(--ink); backdrop-filter:blur(6px); padding:6px 13px; font-size:10px; letter-spacing:.18em; font-weight:600; border-radius:2px; }
.prop-badge.rent { background:rgba(241, 187, 9, 0.94); color:var(--ink); }
.prop-body { padding:22px 22px 24px; }
.prop-price { font-family:var(--font-display); font-size:1.32rem; font-weight:400; color:var(--ink); letter-spacing:-.01em; margin-bottom:0; }
.prop-name { font-family:var(--font-display); font-size:1.12rem; font-weight:400; margin:6px 0 8px; line-height:1.25; transition:color .3s; }
.prop-card:hover .prop-name { color:var(--gold); }
.prop-loc { display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--muted); margin-bottom:18px; }
.prop-loc svg, .prop-meta svg { color:var(--gold); flex:none; }
.prop-meta { gap:16px; padding-top:16px; border-top:1px solid var(--line); font-size:12px; color:#5d6470; font-weight:500; flex-wrap:wrap; }
.prop-meta span { gap:7px; }
.listings-grid.list-view .prop-img { aspect-ratio:auto; min-height:210px; }

/* ─── ABOUT TEASER / ABOUT PAGE SHARED ────────────── */
.kp-about-sec { background:var(--cream-2); }
.kp-about { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); align-items:center; max-width:1280px; margin:0 auto; }
.kp-about-media { position:relative; }
.kp-about-media img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px; position:relative; z-index:1; background:var(--ink-2); }
.kp-about-media::before { content:''; position:absolute; top:26px; right:-26px; bottom:-26px; left:26px; border:1px solid var(--gold); border-radius:3px; z-index:0; }
.kp-badge { position:absolute; left:-18px; bottom:38px; z-index:2; background:var(--ink); color:#fff; padding:20px 26px; border-radius:3px; display:flex; align-items:center; gap:16px; box-shadow:0 28px 54px -22px rgba(11,15,20,.55); }
.kp-badge strong { font-family:var(--font-display); font-weight:400; font-size:34px; color:var(--gold); line-height:1; }
.kp-badge span { font-size:9.5px; letter-spacing:.2em; text-transform:uppercase; line-height:1.6; opacity:.78; }
.kp-about-copy h2 { font-size:clamp(1.85rem,3.6vw,2.9rem); margin-bottom:20px; line-height:1.1; }
.kp-about-copy h2 em { font-style:italic; color:var(--gold); }
.kp-about-copy > p { color:var(--muted); font-weight:300; font-size:15px; line-height:1.85; max-width:500px; margin-bottom:34px; }
.kp-features { list-style:none; display:grid; gap:24px; margin:0 0 36px; padding:0; }
.kp-features li { display:flex; gap:16px; align-items:flex-start; }
.kp-fi { flex:none; width:38px; height:38px; border-radius:50%; background:rgba(201,169,106,.16); color:var(--gold); display:grid; place-items:center; transition:.4s var(--ease); }
.kp-features li:hover .kp-fi { background:var(--gold); color:#fff; transform:rotate(-8deg) scale(1.06); }
.kp-features h3 { font-family:var(--font-body); font-size:14.5px; font-weight:600; letter-spacing:0; margin-bottom:3px; }
.kp-features p { font-size:13.5px; color:var(--muted); font-weight:300; line-height:1.65; }

/* ─── CITIES ──────────────────────────────────────── */
.cities { background:var(--cream); }
.cities-inner { padding:clamp(64px,9vw,110px) clamp(20px,6vw,90px); max-width:1280px; }
.city-card { background:#fff; border:1px solid var(--line); border-radius:3px; padding:1.6rem; }
.city-card::before { background:var(--gold); }
.city-name { font-family:var(--font-display); font-size:1.2rem; font-weight:400; color:var(--ink); }
.city-card:hover { box-shadow:var(--shadow); transform:translateY(-4px); }

/* ─── CLIENTS ─────────────────────────────────────── */
.kp-clients { background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.kp-clients-wrap { max-width:1280px; margin:0 auto; }
.kp-clients-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:3px; overflow:hidden; }
.kp-client { background:#fff; padding:34px 20px 28px; text-align:center; transition:background .4s,transform .5s var(--ease); display:flex; flex-direction:column; align-items:center; text-decoration:none; color:inherit; }
a.kp-client:hover, .kp-client:hover { background:var(--cream); }
.kp-client-logo { height:76px; display:flex; align-items:center; justify-content:center; margin-bottom:16px; }
.kp-client-logo img { max-height:76px; max-width:150px; width:auto; height:auto; object-fit:contain; filter:grayscale(1); opacity:.78; transition:filter .5s,opacity .5s,transform .6s var(--ease); }
.kp-client:hover .kp-client-logo img { filter:none; opacity:1; transform:scale(1.05); }
.kp-client-mono { width:72px; height:72px; border-radius:50%; background:var(--ink); color:var(--gold); font-family:var(--font-display); font-size:1.5rem; display:grid; place-items:center; letter-spacing:.04em; box-shadow:0 0 0 4px rgba(201,169,106,.18); }
.kp-client h3 { font-family:var(--font-display); font-size:1.02rem; font-weight:500; line-height:1.3; }
.kp-client small { display:block; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-top:5px; }
.kp-empty-note { border:1px dashed var(--gold); padding:2rem; text-align:center; color:var(--muted); font-size:14px; border-radius:3px; }

/* ─── QUOTES / TESTIMONIALS ───────────────────────── */
.kp-quotes { background:var(--ink); color:#fff; position:relative; overflow:hidden; text-align:center; padding:clamp(64px,9vw,120px) clamp(20px,6vw,90px); }
.kp-quotes::before { content:''; position:absolute; top:-140px; left:50%; transform:translateX(-50%); width:560px; height:560px; border-radius:50%; background:radial-gradient(circle,rgba(201,169,106,.16),transparent 68%); pointer-events:none; }
.kp-q-wrap { max-width:880px; margin:0 auto; position:relative; z-index:1; }
.kp-qmark { color:var(--gold); opacity:.5; margin:0 auto 28px; display:block; }
.kp-q-slide { transition:opacity .45s ease,transform .45s var(--ease); }
.kp-q-slide.fade { opacity:0; transform:translateY(14px); }
.kp-q-text { font-family:var(--font-display); font-style:italic; font-size:clamp(1.2rem,2.6vw,1.95rem); line-height:1.55; color:rgba(255,255,255,.94); margin-bottom:34px; }
.kp-q-name { font-size:13px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.kp-q-role { font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-top:6px; }
.kp-q-dots { display:flex; gap:10px; justify-content:center; margin-top:40px; }
.kp-q-dot { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.24); transition:.4s var(--ease); border:0; padding:0; cursor:pointer; }
.kp-q-dot.active { background:var(--gold); width:26px; border-radius:4px; }

/* ─── CTA ─────────────────────────────────────────── */
.kp-cta-sec { position:relative; overflow:hidden; text-align:center; color:#fff; padding:clamp(80px,13vw,160px) clamp(20px,6vw,90px); background:var(--ink) url('https://images.unsplash.com/photo-1600585154526-990dced4db0d?auto=format&fit=crop&w=1800&q=50') center/cover no-repeat; }
.kp-cta-sec::before { content:''; position:absolute; inset:0; background:rgba(6,10,15,.78); }
.kp-cta-sec > * { position:relative; z-index:1; }
.kp-cta-sec h2 { font-size:clamp(1.9rem,4.4vw,3.3rem); max-width:20ch; margin:0 auto 20px; line-height:1.08; color:#fff; }
.kp-cta-sec h2 em { font-style:italic; color:var(--gold-2); }
.kp-cta-sec p { max-width:520px; margin:0 auto 38px; color:rgba(255,255,255,.76); font-weight:300; line-height:1.85; }

/* ─── FOOTER ──────────────────────────────────────── */
footer.kp-footer { background:var(--ink-2); color:#fff; padding:clamp(52px,7vw,84px) clamp(20px,6vw,90px) 30px; border-top:0; }
.kp-foot-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:clamp(28px,4vw,56px); margin-bottom:52px; max-width:1280px; margin-left:auto; margin-right:auto; }
.kp-foot-brand .kp-logo { margin-bottom:18px; }
.kp-foot-brand p { font-size:13.5px; color:rgba(255,255,255,.5); font-weight:300; line-height:1.85; max-width:290px; }
.kp-foot-col h2 { font-family:var(--font-body); font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); margin-bottom:18px; font-weight:600; }
.kp-foot-col a { display:block; font-size:13.5px; color:rgba(255,255,255,.62); padding:6px 0; font-weight:300; text-decoration:none; transition:.3s; }
.kp-foot-col a:hover { color:#fff; transform:translateX(4px); }
.kp-foot-bottom { border-top:1px solid rgba(255,255,255,.09); padding-top:24px; display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; font-size:12px; color:rgba(255,255,255,.42); font-weight:300; max-width:1280px; margin:0 auto; }
.kp-socials { display:flex; gap:20px; flex-wrap:wrap; }
.kp-socials a { display:inline-flex; align-items:center; gap:8px; color:rgba(255,255,255,.7); text-decoration:none; transition:color .3s; }
.kp-socials a:hover { color:var(--gold); }

/* ─── CHAT / TOAST ────────────────────────────────── */
.chat-toggle { background:var(--ink); border-color:var(--gold); }
.chat-header { background:var(--ink); }
.chat-msg.user, .chat-input-row button { background:var(--gold); color:var(--ink); }
.toast { background:var(--ink); color:#fff; border-left-color:var(--gold); border-radius:3px; }

/* ═══════ INNER PAGES — harmonise existing templates ═══════ */
.listings-header, .wishlist-hero, .compare-hero, .sell-hero, .blog-hero { background:var(--ink); position:relative; }
.listings-header, .wishlist-hero, .compare-hero { padding:clamp(20px,6vw,8px) clamp(20px,5vw,64px); }
.listings-title, .wishlist-hero h1 { font-family:var(--font-display); font-weight:400; font-size:clamp(1rem,3vw,1.5rem); }
.listings-header::after, .wishlist-hero::after, .compare-hero::after { content:''; position:absolute; left:clamp(20px,5vw,64px); bottom:0; width:64px; height:2px; background:var(--gold); }
.about-hero { background:var(--ink); }
.filter-sidebar { background:#fff; }
.listings-main, .dash-main { background:var(--cream); }
.filter-group select, .filter-group input[type=text], .sell-form input, .sell-form select, .sell-form textarea, .auth-form input, .contact-form input, .contact-form select, .contact-form textarea { border-radius:2px; }
.filter-group select:focus, .filter-group input:focus, .sell-form input:focus, .sell-form select:focus, .sell-form textarea:focus, .auth-form input:focus, .contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color:var(--gold); outline:2px solid rgba(201,169,106,.28); }
.range-val { color:var(--gold-dark); }
.view-toggle a.active { background:var(--ink); border-color:var(--ink); }
.detail-price { color:var(--ink); font-weight:400; }
.detail-name { font-family:var(--font-display); font-size:1.6rem; font-weight:400; }
.detail-meta-item { background:#fff; border:1px solid var(--line); }
.detail-meta-item strong { font-family:var(--font-display); font-weight:500; }
.amenity { background:#fff; border:1px solid var(--line); }
.amenity-icon { color:var(--gold); }
.contact-card, .sell-form, .auth-card { background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); }
.agent-avatar, .dash-avatar, .team-avatar, .testi-avatar { background:var(--ink); color:var(--gold); }
.whatsapp-btn { border-radius:2px; letter-spacing:.12em; text-transform:uppercase; font-size:11px; font-weight:600; }
.auth-page { background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 100%); }
.auth-logo { color:var(--gold); font-weight:400; }
.auth-tabs a.active, .tab-strip a.active { color:var(--ink); border-bottom-color:var(--gold); }
.contact-left { background:var(--ink); }
.contact-right { background:#fff; }
.contact-detail-icon { background:rgba(201,169,106,.15); border-color:rgba(201,169,106,.3); }
.blog-tag { background:rgba(201,169,106,.14); color:var(--gold-dark); }
.blog-card, .dash-card, .inquiry-item { background:#fff; }
.dash-sidebar { background:var(--ink); }
.dash-nav a.active, .dash-nav a:hover { background:rgba(201,169,106,.12); color:var(--gold-2); }
.dash-card-num, .stat-item strong { color:var(--gold); }
.stats-strip { background:var(--ink); }
.compare-table th { background:var(--ink); }
.compare-price { color:var(--gold-dark); }
.testimonials { background:var(--ink); }
.testi-card { border-color:rgba(255,255,255,.1); }

/* ─── RESPONSIVE ──────────────────────────────────── */
@media (max-width:1024px) {
  .kp-about { grid-template-columns:1fr; gap:64px; }
  .kp-about-media { max-width:520px; }
  .kp-about-media img { aspect-ratio:5/4; }
  .kp-search { grid-template-columns:120px 1fr 1fr; }
  .kp-search input { grid-column:span 2; border-right:0; border-bottom:1px solid var(--line); }
  .kp-search select:nth-of-type(1) { border-bottom:1px solid var(--line); }
  .kp-search button { grid-column:1/-1; padding:16px; border-radius:0 0 3px 3px; }
}
@media (max-width:980px) {
  .kp-foot-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:900px) {
  .kp-nav nav.kp-links { position:fixed; inset:0; z-index:-1; background:rgba(9,13,18,.995); flex-direction:column; justify-content:center; gap:24px; font-size:18px; letter-spacing:.1em; opacity:0; pointer-events:none; transition:opacity .45s var(--ease); height:100vh; height:100dvh; }
  .kp-nav.open nav.kp-links { opacity:1; pointer-events:auto; }
  .kp-links a, .kp-links .kp-link-minor { opacity:.92; font-size:inherit; }
  .kp-links .kp-cta { margin-top:10px; padding:14px 34px; font-size:12px; }
  .kp-burger { display:block; }
  .kp-logo, .kp-burger { position:relative; z-index:2; }
  body.menu-open { overflow:hidden; }
  /* style.css hides .nav-links on mobile — not used any more, but keep inner <nav> visible */
}
@media (max-width:768px) {
  .kp-stats { grid-template-columns:repeat(2,1fr); }
  .kp-hero-ui { flex-direction:column; align-items:flex-start; gap:20px; }
  .kp-hero-right { width:100%; justify-content:space-between; }
  .kp-sec-head { flex-direction:column; align-items:flex-start; gap:16px; }
  .kp-badge { left:10px; bottom:20px; padding:16px 20px; }
  .kp-foot-bottom { flex-direction:column; align-items:flex-start; }
}
@media (max-width:640px) {
  .kp-foot-grid { grid-template-columns:1fr; gap:32px; }
  .kp-dot { width:36px; }
  .kp-arrow { width:44px; height:44px; }
  .kp-actions .btn { width:100%; }
  .kp-about-media::before { display:none; }
  .kp-search { grid-template-columns:1fr 1fr; }
  .kp-search select:nth-of-type(1), .kp-search input { grid-column:1/-1; }
  .kp-search select { border-bottom:1px solid var(--line); }
  .kp-logo-text { font-size:15px; }
  .kp-hero-body { padding-top:104px; }
  .featured-grid { grid-template-columns:1fr; }
}

/* ─── REVEAL (only active when JS is running) ─────── */
.js [data-reveal] { opacity:0; transform:translateY(34px); transition:opacity .95s var(--ease),transform .95s var(--ease); }
.js [data-reveal].in { opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  html { scroll-behavior:auto; }
  .js [data-reveal] { opacity:1; transform:none; }
}

/* ─── ABOUT PAGE ──────────────────────────────────── */
.kp-page-hero { position:relative; min-height:clamp(480px,78vh,720px); display:flex; align-items:flex-end; background:var(--ink); color:#fff; overflow:hidden; isolation:isolate; }
.kp-page-hero-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.kp-page-hero::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(6,10,15,.9),rgba(6,10,15,.5) 60%,rgba(6,10,15,.2)),linear-gradient(to top,rgba(6,10,15,.8),transparent 55%); }
.kp-page-hero-body { padding:140px clamp(20px,7vw,110px) clamp(48px,8vw,90px); max-width:960px; }
.kp-collage { position:relative; padding-bottom:70px; }
.kp-collage-main { width:82%; aspect-ratio:4/5; object-fit:cover; border-radius:3px; display:block; background:var(--ink-2); }
.kp-collage-side { position:absolute; right:0; bottom:0; width:56%; aspect-ratio:4/3; object-fit:cover; border-radius:3px; border:8px solid var(--cream); box-shadow:0 30px 60px -30px rgba(11,15,20,.5); background:var(--ink-2); }
.kp-stats-dark { background:rgba(255,255,255,.1); }
.kp-stats-dark .kp-stat { background:var(--ink); color:#fff; }
.kp-stats-dark .kp-stat > span { color:rgba(255,255,255,.55); }
.kp-gallery { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.kp-gallery figure { margin:0; overflow:hidden; border-radius:3px; aspect-ratio:3/4; background:var(--ink-2); }
.kp-gallery figure:nth-child(even) { transform:translateY(28px); }
.kp-gallery img { width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease); }
.kp-gallery figure:hover img { transform:scale(1.08); }
.kp-why { background:var(--ink); color:#fff; margin-top:40px; }
.kp-why-grid { display:grid; grid-template-columns:1fr 1fr; max-width:1400px; margin:0 auto; }
.kp-why-media img { width:100%; height:100%; min-height:420px; object-fit:cover; display:block; }
.kp-why-copy { padding:clamp(48px,8vw,110px) clamp(20px,6vw,90px); align-self:center; }
.kp-why-copy h2 { font-size:clamp(1.9rem,3.6vw,2.9rem); color:#fff; margin-bottom:30px; line-height:1.1; }
.kp-why-copy h2 em { color:var(--gold-2); font-style:italic; }
.kp-features-light h3 { color:#fff; } .kp-features-light p { color:rgba(255,255,255,.6); }
@media (max-width:1024px){ .kp-why-grid{grid-template-columns:1fr;} .kp-why-media img{min-height:300px;max-height:420px;} }
@media (max-width:768px){ .kp-gallery{grid-template-columns:repeat(2,1fr);} .kp-gallery figure:nth-child(even){transform:none;} .kp-collage-main{width:88%;} }

/* ─── EMI CALCULATOR ──────────────────────────────── */
.kp-emi { background:#fff; border:1px solid var(--line); border-radius:3px; padding:clamp(20px,3vw,34px); display:grid; gap:22px; }
.kp-emi-title { font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.kp-emi-result { background:var(--ink); color:#fff; border-radius:3px; padding:20px 22px; }
.kp-emi-label { display:block; font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.6); }
.kp-emi-value { display:block; font-family:var(--font-display); font-weight:400; font-size:clamp(1.9rem,4vw,2.6rem); color:var(--gold-2); line-height:1.15; margin:6px 0 14px; }
.kp-emi-bar { height:6px; background:rgba(255,255,255,.18); border-radius:3px; overflow:hidden; }
.kp-emi-bar i { display:block; height:100%; background:var(--gold); transition:width .35s var(--ease); }
.kp-emi-legend { display:flex; gap:18px; margin-top:10px; font-size:11.5px; color:rgba(255,255,255,.7); flex-wrap:wrap; }
.kp-emi-legend i { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; }
.kp-emi-legend i.p { background:var(--gold); } .kp-emi-legend i.i { background:rgba(255,255,255,.35); }
.kp-emi-legend b { color:#fff; font-weight:600; margin-left:3px; }
.kp-emi-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin:0; }
.kp-emi-stats div { background:var(--cream); padding:12px 14px; }
.kp-emi-stats dt { font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.kp-emi-stats dd { margin:4px 0 0; font-family:var(--font-display); font-size:1.02rem; overflow-wrap:anywhere; }
.kp-emi-fields { display:grid; gap:20px; }
.kp-emi-field label { display:flex; justify-content:space-between; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-bottom:8px; }
.kp-emi-field label b { color:var(--ink); font-weight:600; letter-spacing:0; text-transform:none; }
.kp-emi-field small { display:block; margin-top:6px; font-size:11.5px; color:var(--muted); }
.kp-emi-field input[type=text] { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:2px; font:inherit; margin-bottom:10px; background:#fff; }
.kp-emi input[type=range] { -webkit-appearance:none; appearance:none; width:100%; height:4px; background:rgba(11,15,20,.14); border-radius:2px; outline-offset:6px; }
.kp-emi input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:var(--gold); border:3px solid #fff; box-shadow:0 0 0 1px var(--gold-dark),0 2px 6px rgba(0,0,0,.25); cursor:pointer; }
.kp-emi input[type=range]::-moz-range-thumb { width:14px; height:14px; border-radius:50%; background:var(--gold); border:3px solid #fff; box-shadow:0 0 0 1px var(--gold-dark); cursor:pointer; }
.kp-emi-link { font-size:12.5px; color:var(--gold-dark); font-weight:600; }
.kp-emi-note { font-size:11.5px; color:var(--muted); margin:0; }
.kp-emi-sched summary { cursor:pointer; font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; padding:6px 0; }
.kp-emi-table-wrap { overflow-x:auto; max-height:380px; margin-top:12px; border:1px solid var(--line); }
.kp-emi-table-wrap table { width:100%; border-collapse:collapse; font-size:13px; min-width:420px; }
.kp-emi-table-wrap th, .kp-emi-table-wrap td { padding:10px 14px; text-align:right; border-bottom:1px solid var(--line); }
.kp-emi-table-wrap th:first-child, .kp-emi-table-wrap td:first-child { text-align:left; }
.kp-emi-table-wrap th { background:var(--ink); color:#fff; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; position:sticky; top:0; }
.kp-emi-card { margin-top:1rem; }
.kp-emi-compact { padding:18px; gap:16px; }
.kp-emi-compact .kp-emi-stats { grid-template-columns:1fr; }
.kp-emi-compact .kp-emi-stats div { display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.kp-emi-compact .kp-emi-stats dd { margin:0; }
.kp-emi-hero { background:var(--ink); color:#fff; padding:clamp(110px,14vw,150px) clamp(20px,6vw,90px) clamp(40px,6vw,64px); text-align:center; }
.kp-emi-hero h1 { font-size:clamp(2rem,4.6vw,3.4rem); margin-bottom:12px; }
.kp-emi-hero h1 em { color:var(--gold-2); font-style:italic; }
.kp-emi-hero p { color:rgba(255,255,255,.7); font-weight:300; max-width:520px; margin:0 auto; }
.kp-emi-page { background:var(--cream); }
.kp-emi-wrap { max-width:860px; margin:0 auto; }
.kp-emi-wrap .kp-emi { grid-template-columns:1fr 1fr; align-items:start; }
.kp-emi-wrap .kp-emi-fields, .kp-emi-wrap .kp-emi-sched, .kp-emi-wrap .kp-emi-note { grid-column:1/-1; }
.kp-emi-wrap .kp-emi-fields { grid-template-columns:1fr 1fr; gap:22px 32px; }
.kp-emi-wrap .kp-emi-field:first-child:has(input[type=text]) { grid-column:1/-1; }
.kp-emi-faq { max-width:760px; margin:clamp(40px,6vw,72px) auto 0; }
.kp-emi-faq h2 { font-size:1.7rem; margin-bottom:16px; }
.kp-emi-faq details { border-bottom:1px solid var(--line); padding:14px 0; }
.kp-emi-faq summary { cursor:pointer; font-weight:500; }
.kp-emi-faq p { color:var(--muted); font-weight:300; line-height:1.8; margin-top:10px; }
@media (max-width:700px){ .kp-emi-wrap .kp-emi, .kp-emi-wrap .kp-emi-fields { grid-template-columns:1fr; } .kp-emi-stats { grid-template-columns:1fr; } .kp-emi-stats div { display:flex; justify-content:space-between; } }

/* ─── LIVE CHAT ───────────────────────────────────── */
.chat-toggle { position:relative; }
.chat-unread { position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px; border-radius:10px; background:#dc2626; color:#fff; font-size:11px; font-weight:700; display:grid; place-items:center; line-height:1; }
.chat-unread[hidden] { display:none; }
.chat-msg.sys { align-self:center; background:transparent; color:var(--muted); font-size:.74rem; text-align:center; font-style:italic; max-width:92%; }
.chat-msg .chat-from { display:block; font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-dark); margin-bottom:2px; font-weight:600; }
.chat-prefill { display:flex; gap:6px; padding:8px 10px; background:var(--cream); border-top:1px solid var(--line); }
.chat-prefill input { flex:1; min-width:0; padding:7px 9px; border:1px solid var(--line); border-radius:2px; font-size:.78rem; background:#fff; }

/* ─── PRIVACY / LEGAL PAGE ───────────────────────── */
.kp-banner { background:var(--ink); color:#fff; padding:clamp(110px,14vw,150px) clamp(20px,6vw,90px) clamp(40px,6vw,64px); text-align:center; }
.kp-banner h1 { font-size:clamp(2rem,4.6vw,3.4rem); margin-bottom:10px; }
.kp-banner h1 em { color:var(--gold-2); font-style:italic; }
.kp-banner p { color:rgba(255,255,255,.65); font-weight:300; }
.kp-legal-sec { background:var(--cream); }
.kp-legal { max-width:780px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:3px; padding:clamp(24px,5vw,56px); }
.kp-legal-lead { font-size:1.05rem; color:var(--muted); line-height:1.8; margin-bottom:8px; }
.kp-legal h2 { font-size:1.35rem; margin:2rem 0 .6rem; padding-top:1.4rem; border-top:1px solid var(--line); }
.kp-legal h3 { font-family:var(--font-body); font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-dark); margin:1.2rem 0 .4rem; font-weight:600; }
.kp-legal p, .kp-legal li { color:#3d4552; line-height:1.85; font-size:.95rem; }
.kp-legal ul { padding-left:1.2rem; margin:.4rem 0 .8rem; } .kp-legal li { margin-bottom:.4rem; }
.kp-legal a { color:var(--gold-dark); text-decoration:underline; }
.chat-privacy { font-size:.66rem; color:var(--muted); padding:5px 10px; background:var(--cream); text-align:center; border-top:1px solid var(--line); }
.chat-privacy a { color:var(--gold-dark); text-decoration:underline; }

/* ─── WHATSAPP BUTTON + CHAT GREETING ─────────────── */
.chat-widget { display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.chat-box { bottom:132px; }   /* opens above the WhatsApp + chat buttons */
.kp-wa { position:relative; width:52px; height:52px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(37,211,102,.45); transition:transform .3s var(--ease),box-shadow .3s; text-decoration:none; }
.kp-wa:hover { transform:scale(1.08); box-shadow:0 10px 24px rgba(37,211,102,.6); }
.kp-wa-tip { position:absolute; left:62px; white-space:nowrap; background:var(--ink); color:#fff; font-size:12px; padding:6px 11px; border-radius:3px; opacity:0; pointer-events:none; transform:translateX(-6px); transition:.25s; }
.kp-wa:hover .kp-wa-tip, .kp-wa:focus-visible .kp-wa-tip { opacity:1; transform:none; }
.chat-chips { display:flex; flex-direction:column; gap:6px; align-self:stretch; }
.chat-chips button { text-align:left; padding:8px 11px; border:1px solid var(--gold); background:#fff; color:var(--ink); border-radius:16px; font:inherit; font-size:.78rem; cursor:pointer; transition:.2s; }
.chat-chips button:hover { background:var(--gold); }
.kp-foot-contact { margin-top:14px; }
.kp-foot-contact a { color:rgba(255,255,255,.78); text-decoration:none; line-height:2; font-size:13.5px; }
.kp-foot-contact a:hover { color:var(--gold-2); }
@media (max-width:640px) { .kp-wa-tip { display:none; } }

.chat-box { width:300px; }
.chat-messages { min-height:230px; max-height:320px; }