/* ============================================================
   Tehri Properties — SHARED STYLESHEET
   Two background colors: #F8F6F2 (cream) and #F0EDE6 (warm off-white)
   Accents: Gold #C9A84C | Forest #3A5A40
   ============================================================ */

/* ── GOOGLE FONTS ── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Jost:wght@300;400;500;600&display=swap');

/* ── CSS VARIABLES ── */
:root {
  --cream:        #F8F6F2;
  --off-white:    #F0EDE6;
  --charcoal:     #2C2A27;
  --forest:       #3A5A40;
  --forest-dark:  #2A4430;
  --gold:         #C9A84C;
  --gold-light:   #E8C97E;
  --gold-dark:    #A07830;
  --text-dark:    #1A1816;
  --text-mid:     #4A4642;
  --text-light:   #8A8480;
  --border:       rgba(201,168,76,0.22);
  --border-grey:  rgba(26,24,22,0.10);
  --shadow:       0 20px 60px rgba(26,24,22,0.10);
  --shadow-hover: 0 32px 80px rgba(26,24,22,0.18);
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Jost',sans-serif; background:var(--cream); color:var(--text-dark); overflow-x:hidden; cursor:none; }
img { display:block; max-width:100%; }
a { text-decoration:none; }

/* ── CUSTOM CURSOR ── */
.cursor {
  position:fixed; width:9px; height:9px; background:var(--gold);
  border-radius:50%; pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%); transition:width .2s,height .2s,opacity .2s;
}
.cursor-ring {
  position:fixed; width:34px; height:34px; border:1px solid var(--gold);
  border-radius:50%; pointer-events:none; z-index:9998;
  transform:translate(-50%,-50%); transition:all .14s ease; opacity:.55;
}
body:has(a:hover) .cursor,
body:has(button:hover) .cursor { width:14px; height:14px; opacity:.5; }

/* ── FLOATING BTNS ── */
.float-cta {
  position:fixed; bottom:32px; right:32px; z-index:800;
  display:flex; flex-direction:column; gap:10px;
}
.float-btn {
  width:50px; height:50px; border-radius:50%; display:flex;
  align-items:center; justify-content:center; font-size:20px;
  box-shadow:0 4px 20px rgba(0,0,0,0.18); transition:transform .3s; cursor:none;
  text-decoration:none;
}
.float-btn:hover { transform:scale(1.12); }
.float-wa  { background:#25D366; color:#fff; }
.float-call{ background:var(--forest); color:#fff; }

/* ══════════════════════════════════════════════
   NAVIGATION
══════════════════════════════════════════════ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:82px; padding:0 64px;
  display:flex; align-items:center; justify-content:space-between;
  transition:all .4s ease;
}
.nav.scrolled {
  background:rgba(248,246,242,.97);
  backdrop-filter:blur(18px);
  height:68px;
  box-shadow:0 1px 0 var(--border), 0 6px 30px rgba(26,24,22,.06);
}
/* Logo */
.nav-logo { display:flex; flex-direction:column; cursor:none; }
.nav-logo-main {
  font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:600;
  letter-spacing:.07em; color:#fff; transition:color .4s; line-height:1;
}
.nav.scrolled .nav-logo-main { color:var(--text-dark); }
.nav-logo-sub {
  font-size:8.5px; font-weight:300; letter-spacing:.38em; text-transform:uppercase;
  color:var(--gold); margin-top:4px;
}
/* Links */
.nav-links { display:flex; align-items:center; gap:36px; list-style:none; }
.nav-links > li > a {
  font-size:11.5px; font-weight:400; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(255,255,255,.82); cursor:none; position:relative; transition:color .3s;
}
.nav.scrolled .nav-links > li > a { color:var(--text-mid); }
.nav-links > li > a::after {
  content:''; position:absolute; bottom:-5px; left:0;
  width:0; height:1px; background:var(--gold); transition:width .3s;
}
.nav-links > li > a:hover::after { width:100%; }
.nav-links > li > a:hover { color:var(--gold) !important; }
/* Active page link */
.nav-links > li > a.active-link { color:var(--gold) !important; }
.nav-links > li > a.active-link::after { width:100%; }
/* Dropdown */
.nav-drop { position:relative; }
.nav-drop-menu {
  position:absolute; top:calc(100% + 2px); left:50%;
  transform:translateX(-50%) translateY(8px);
  min-width:210px; background:rgba(250,248,244,.98);
  backdrop-filter:blur(20px); border:1px solid var(--border);
  padding:8px 0; opacity:0; pointer-events:none;
  transition:all .28s ease;
  box-shadow:0 20px 40px rgba(26,24,22,.12);
}
.nav-drop:hover .nav-drop-menu { opacity:1; pointer-events:all; transform:translateX(-50%) translateY(0); }
.nav-drop-menu a {
  display:block; padding:10px 22px; font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-mid) !important; transition:background .2s;
}
.nav-drop-menu a:hover { background:rgba(201,168,76,.09); color:var(--gold) !important; }
/* CTA btn */
.nav-cta {
  font-family:'Jost',sans-serif; font-size:10.5px; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; padding:11px 26px;
  background:var(--gold); color:var(--charcoal); border:none; cursor:none;
  text-decoration:none; transition:all .3s;
}
.nav-cta:hover { background:var(--gold-dark); color:#fff; }
/* Hamburger */
.nav-burger { display:none; flex-direction:column; gap:5px; cursor:none; }
.nav-burger span { width:26px; height:1.5px; background:#fff; transition:all .3s; display:block; }
.nav.scrolled .nav-burger span { background:var(--text-dark); }

/* ── MOBILE NAV ── */
.mob-nav {
  position:fixed; inset:0; background:var(--cream); z-index:999;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; opacity:0; pointer-events:none; transition:opacity .35s;
}
.mob-nav.open { opacity:1; pointer-events:all; }
.mob-nav a {
  font-family:'Cormorant Garamond',serif; font-size:40px; font-weight:300;
  color:var(--text-dark); letter-spacing:.04em; transition:color .25s; cursor:none;
}
.mob-nav a:hover { color:var(--gold); }
.mob-close {
  position:absolute; top:28px; right:28px; font-size:26px;
  background:none; border:none; color:var(--text-mid); cursor:none;
}
.mob-drop {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mob-drop-toggle {
  font-family: 'Cormorant Garamond', serif;
  font-size: 40px;
  font-weight: 300;
  color: var(--text-dark);
  letter-spacing: .04em;
  background: none;
  border: none;
  cursor: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.mob-drop-toggle #mobDropArrow {
  font-size: 24px;
  transition: transform .3s;
}
.mob-drop-toggle.open #mobDropArrow {
  transform: rotate(180deg);
}
.mob-drop-menu {
  max-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  transition: max-height .35s ease;
}
.mob-drop-menu.open {
  max-height: 400px;
  margin: 6px 0;
}
.mob-drop-menu a {
  font-size: 30px;
  font-weight: 300;
  color: var(--text-mid);
  letter-spacing: .03em;
}
.mob-drop-menu a:hover {
  color: var(--gold);
}

/* ══════════════════════════════════════════════
   PAGE HERO (non-home pages)
══════════════════════════════════════════════ */
.page-hero {
  height:55vh; min-height:380px; position:relative;
  display:flex; align-items:flex-end; padding:0 80px 60px;
  overflow:hidden;
}
.page-hero-bg {
  position:absolute; inset:0; background-size:cover; background-position:center;
}
.page-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(26,24,22,.25) 0%,rgba(26,24,22,.65) 100%);
}
.page-hero-content { position:relative; z-index:2; }
.page-hero-eyebrow {
  font-size:9.5px; letter-spacing:.42em; text-transform:uppercase;
  color:var(--gold); margin-bottom:14px; display:flex; align-items:center; gap:14px;
}
.page-hero-eyebrow::before { content:''; width:36px; height:1px; background:var(--gold); }
.page-hero-title {
  font-family:'Cormorant Garamond',serif; font-size:clamp(44px,6vw,76px);
  font-weight:300; color:#fff; line-height:1.05;
}
.page-hero-title em { font-style:italic; color:var(--gold-light); }

/* ══════════════════════════════════════════════
   SECTION UTILS
══════════════════════════════════════════════ */
.sec-cream    { background:var(--cream); }
.sec-offwhite { background:var(--off-white); }
.sec-charcoal { background:var(--charcoal); }
.sec-forest   { background:var(--forest); }

.section { padding:110px 80px; }
.section-sm { padding:80px 80px; }
.container { max-width:1300px; margin:0 auto; }

.sec-label {
  font-size:9.5px; font-weight:500; letter-spacing:.42em; text-transform:uppercase;
  color:var(--gold); margin-bottom:14px;
  display:flex; align-items:center; gap:14px;
}
.sec-label::before { content:''; width:36px; height:1px; background:var(--gold); }
.sec-label.center { justify-content:center; }
.sec-label.center::before,.sec-label.center::after { content:''; width:36px; height:1px; background:var(--gold); }

.sec-title {
  font-family:'Cormorant Garamond',serif; font-size:clamp(36px,4.5vw,60px);
  font-weight:400; line-height:1.1; color:var(--text-dark);
}
.sec-title em { font-style:italic; color:var(--forest); }
.sec-title.light { color:#fff; }
.sec-title.light em { color:var(--gold-light); }

.gold-bar { width:54px; height:1px; background:linear-gradient(to right,var(--gold),transparent); margin:24px 0; }
.gold-bar.center { margin:24px auto; }

.sec-sub {
  font-size:14.5px; font-weight:300; color:var(--text-light);
  line-height:1.78; max-width:540px;
}

/* ══════════════════════════════════════════════
   BUTTONS
══════════════════════════════════════════════ */
.btn {
  display:inline-flex; align-items:center; gap:11px; cursor:none;
  font-family:'Jost',sans-serif; font-size:10.5px; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase; transition:all .32s ease;
  position:relative; overflow:hidden;
}
.btn-gold {
  padding:17px 40px; background:var(--gold); color:var(--charcoal); border:none;
}
.btn-gold::before {
  content:''; position:absolute; inset:0; background:var(--gold-dark);
  transform:scaleX(0); transform-origin:left; transition:transform .32s ease;
}
.btn-gold:hover::before { transform:scaleX(1); }
.btn-gold:hover { color:#fff; }
.btn-gold span, .btn-gold svg { position:relative; z-index:1; }

.btn-outline-light {
  padding:15px 34px; background:transparent; color:#fff;
  border:1px solid rgba(255,255,255,.38);
}
.btn-outline-light:hover { background:rgba(255,255,255,.1); border-color:#fff; }

.btn-outline-dark {
  padding:13px 28px; background:transparent;
  color:var(--text-mid); border:1px solid var(--border-grey);
}
.btn-outline-dark:hover { background:var(--gold); border-color:var(--gold); color:var(--charcoal); }

.btn-ghost {
  padding:0; background:transparent; color:var(--text-dark);
  border:none; letter-spacing:.18em; font-size:11px;
}
.btn-ghost svg { transition:transform .3s; }
.btn-ghost:hover { color:var(--gold); }
.btn-ghost:hover svg { transform:translateX(4px); }

/* ══════════════════════════════════════════════
   PROPERTY CARD
══════════════════════════════════════════════ */
.prop-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:36px;
}
.prop-card {
  background:var(--cream); overflow:hidden;
  transition:box-shadow .4s ease; border:1px solid transparent;
}
.prop-card:hover { box-shadow:var(--shadow-hover); border-color:var(--border); }

/* Gallery zone */
.pc-gallery { position:relative; height:400px; overflow:hidden; background:var(--charcoal); }
.pc-img {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .5s ease, transform .6s ease; transform:scale(1.04);
}
.pc-img.active { opacity:1; transform:scale(1); }
.prop-card:hover .pc-img.active { transform:scale(1.05); }
.pc-badge {
  position:absolute; top:22px; left:22px; z-index:2;
  background:var(--gold); padding:5px 13px;
  font-size:8.5px; font-weight:500; letter-spacing:.28em; text-transform:uppercase;
  color:var(--charcoal);
}
.pc-overlay {
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top,rgba(26,24,22,.55) 0%,transparent 55%); z-index:1;
}
.pc-price {
  position:absolute; bottom:22px; right:22px; z-index:2; text-align:right;
}
.pc-price-from {
  font-size:8.5px; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(255,255,255,.6); display:block; margin-bottom:3px;
}
.pc-price-num {
  font-family:'Cormorant Garamond',serif; font-size:26px; font-weight:600; color:#fff;
}
/* Thumbnails */
.pc-thumbs {
  display:flex; gap:7px; padding:12px 16px; background:#ECEAE5;
  overflow-x:auto; scrollbar-width:none;
}
.pc-thumbs::-webkit-scrollbar { display:none; }
.pc-thumb {
  width:68px; height:46px; flex-shrink:0; overflow:hidden;
  border:2px solid transparent; transition:border-color .22s; cursor:none;
}
.pc-thumb.active { border-color:var(--gold); }
.pc-thumb img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.pc-thumb:hover img { transform:scale(1.1); }
/* Info */
.pc-info { padding:26px 28px 30px; }
.pc-top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:14px; }
.pc-name { font-family:'Cormorant Garamond',serif; font-size:28px; font-weight:500; color:var(--text-dark); line-height:1.1; }
.pc-sector { font-size:9.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold); margin-top:5px; }
.pc-area-box { background:rgba(201,168,76,.08); border:1px solid var(--border); padding:9px 14px; text-align:center; flex-shrink:0; }
.pc-area-num { font-family:'Cormorant Garamond',serif; font-size:20px; font-weight:600; color:var(--forest); display:block; line-height:1; }
.pc-area-unit { font-size:8.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--text-light); }
.pc-divider { width:100%; height:1px; background:var(--border); margin:14px 0; }
.pc-desc { font-size:13px; font-weight:300; color:var(--text-mid); line-height:1.72; margin-bottom:22px; }
.pc-footer { display:flex; justify-content:space-between; align-items:center; }
.pc-link { display:inline-flex; align-items:center; gap:9px; font-size:10.5px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--text-dark); cursor:none; transition:color .28s; }
.pc-link svg { transition:transform .28s; }
.pc-link:hover { color:var(--gold); }
.pc-link:hover svg { transform:translateX(4px); }
.pc-heart { width:38px; height:38px; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; cursor:none; background:none; transition:all .28s; font-size:15px; color:var(--text-light); }
.pc-heart:hover { background:var(--gold); border-color:var(--gold); color:var(--charcoal); }

/* ══════════════════════════════════════════════
   GALLERY MASONRY
══════════════════════════════════════════════ */
.masonry { columns:3; column-gap:18px; }
.masonry-item {
  break-inside:avoid; margin-bottom:18px; overflow:hidden;
  position:relative; cursor:none;
}
.masonry-item img { width:100%; display:block; transition:transform .5s ease; }
.masonry-item:hover img { transform:scale(1.06); }
.masonry-overlay {
  position:absolute; inset:0; background:rgba(26,24,22,0);
  display:flex; align-items:center; justify-content:center;
  transition:background .3s;
}
.masonry-item:hover .masonry-overlay { background:rgba(26,24,22,.38); }
.masonry-zoom {
  width:48px; height:48px; border:1px solid rgba(255,255,255,.6);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:20px; opacity:0; transform:scale(.8);
  transition:all .3s;
}
.masonry-item:hover .masonry-zoom { opacity:1; transform:scale(1); }

/* Lightbox */
.lightbox {
  position:fixed; inset:0; background:rgba(26,24,22,.96); z-index:2000;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .3s;
}
.lightbox.open { opacity:1; pointer-events:all; }
.lb-img { max-width:88vw; max-height:88vh; object-fit:contain; }
.lb-close { position:absolute; top:28px; right:36px; font-size:22px; color:rgba(255,255,255,.55); background:none; border:none; cursor:none; transition:color .2s; }
.lb-close:hover { color:#fff; }
.lb-prev,.lb-next { position:absolute; top:50%; transform:translateY(-50%); width:50px; height:50px; border:1px solid rgba(255,255,255,.2); background:none; color:rgba(255,255,255,.65); cursor:none; display:flex; align-items:center; justify-content:center; font-size:18px; transition:all .28s; }
.lb-prev { left:36px; } .lb-next { right:36px; }
.lb-prev:hover,.lb-next:hover { border-color:var(--gold); color:var(--gold); }

/* ══════════════════════════════════════════════
   CONTACT FORM
══════════════════════════════════════════════ */
.form-group { display:flex; flex-direction:column; gap:8px; }
.form-label { font-size:9.5px; font-weight:500; letter-spacing:.32em; text-transform:uppercase; color:var(--text-light); }
.form-input {
  width:100%; padding:15px 18px; background:#fff; border:1px solid var(--border-grey);
  font-family:'Jost',sans-serif; font-size:14px; font-weight:300; color:var(--text-dark);
  outline:none; transition:border-color .28s; cursor:none;
}
.form-input:focus { border-color:var(--gold); }
.form-input::placeholder { color:var(--text-light); }
textarea.form-input { resize:none; height:130px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }

/* ══════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════ */
.footer { background:var(--charcoal); padding:80px 80px 36px; }
.footer-inner { max-width:1300px; margin:0 auto; }
.footer-top { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:56px; padding-bottom:56px; border-bottom:1px solid rgba(255,255,255,.07); }
.footer-brand {}
.fb-name { font-family:'Cormorant Garamond',serif; font-size:26px; font-weight:500; color:#fff; letter-spacing:.06em; }
.fb-sub { font-size:8.5px; letter-spacing:.36em; text-transform:uppercase; color:var(--gold); display:block; margin-top:4px; }
.fb-desc { font-size:13px; font-weight:300; color:rgba(255,255,255,.4); line-height:1.75; margin-top:18px; }
.footer-col h5 { font-size:9.5px; font-weight:500; letter-spacing:.32em; text-transform:uppercase; color:var(--gold); margin-bottom:22px; }
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:11px; }
.footer-col a { font-size:12.5px; font-weight:300; color:rgba(255,255,255,.45); cursor:none; transition:color .25s; }
.footer-col a:hover { color:var(--gold); }
.footer-col address { font-style:normal; font-size:12.5px; font-weight:300; color:rgba(255,255,255,.35); line-height:1.65; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:32px; }
.footer-copy { font-size:11.5px; font-weight:300; color:rgba(255,255,255,.25); }
.footer-legal { display:flex; gap:24px; }
.footer-legal a { font-size:11px; color:rgba(255,255,255,.25); cursor:none; transition:color .25s; }
.footer-legal a:hover { color:rgba(255,255,255,.55); }

/* ══════════════════════════════════════════════
   MARQUEE
══════════════════════════════════════════════ */
.marquee-strip { background:var(--charcoal); padding:17px 0; overflow:hidden; }
.marquee-track { display:flex; gap:56px; animation:marqueeScroll 26s linear infinite; white-space:nowrap; }
.marquee-item { display:flex; align-items:center; gap:13px; font-size:9.5px; font-weight:400; letter-spacing:.28em; text-transform:uppercase; color:rgba(248,246,242,.45); flex-shrink:0; }
.marquee-dot { width:4px; height:4px; background:var(--gold); border-radius:50%; }
@keyframes marqueeScroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }

/* ══════════════════════════════════════════════
   DISTANCE / LOCATION
══════════════════════════════════════════════ */
.dist-item { display:flex; justify-content:space-between; align-items:center; padding:17px 0; border-bottom:1px solid var(--border-grey); }
.dist-item:first-child { border-top:1px solid var(--border-grey); }
.dist-label { display:flex; align-items:center; gap:13px; font-size:13px; color:var(--text-mid); }
.dist-val { font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:500; color:var(--text-dark); }
.dist-val small { font-family:'Jost',sans-serif; font-size:10px; font-weight:300; color:var(--text-light); }
.attract-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:28px; }
.attract-pill { display:flex; align-items:center; gap:10px; padding:13px 16px; background:rgba(201,168,76,.07); border:1px solid var(--border); font-size:12.5px; color:var(--text-mid); }
.attract-dot { width:5px; height:5px; background:var(--gold); border-radius:50%; flex-shrink:0; }

/* ══════════════════════════════════════════════
   TESTIMONIAL
══════════════════════════════════════════════ */
.testi-card { padding:38px; border:1px solid rgba(201,168,76,.14); background:rgba(255,255,255,.035); }
.testi-stars { color:var(--gold); font-size:11px; letter-spacing:3px; margin-bottom:14px; }
.testi-quote { font-family:'Cormorant Garamond',serif; font-size:52px; font-weight:600; color:var(--gold); opacity:.35; line-height:.5; margin-bottom:14px; }
.testi-text { font-size:13.5px; font-weight:300; color:rgba(255,255,255,.65); line-height:1.8; font-style:italic; margin-bottom:26px; }
.testi-author { display:flex; align-items:center; gap:13px; }
.testi-avatar { width:42px; height:42px; border-radius:50%; object-fit:cover; border:2px solid var(--gold); }
.testi-name { font-size:13px; font-weight:500; color:#fff; }
.testi-city { font-size:11px; color:rgba(255,255,255,.38); letter-spacing:.08em; }

/* ══════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════ */
@media(max-width:1100px){
  .nav,.footer{ padding-left:40px; padding-right:40px; }
  .section,.section-sm{ padding-left:40px; padding-right:40px; }
  .page-hero { padding-left:40px; }
  .prop-grid { gap:24px; }
  .footer-top { grid-template-columns:1fr 1fr; gap:36px; }
  .masonry { columns:2; }
}
@media(max-width:768px){
  .nav { padding:0 22px; height:68px; }
  .nav-links,.nav-cta { display:none; }
  .nav-burger { display:flex; }
  .nav.scrolled { height:60px; }
  .section,.section-sm { padding:60px 22px; }
  .page-hero { padding:0 22px 44px; }
  .prop-grid { grid-template-columns:1fr; }
  .masonry { columns:1; }
  .footer { padding:50px 22px 24px; }
  .footer-top { grid-template-columns:1fr; gap:30px; }
  .footer-bottom { flex-direction:column; gap:14px; text-align:center; }
  .attract-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
}