/* ================= NAV ================= */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--nav-h);
  transition:background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  background:transparent;
}
.nav.scrolled{background:rgba(15,45,32,.98);backdrop-filter:blur(10px);box-shadow:var(--shadow-sm)}
.nav-inner{
  height:100%;display:flex;align-items:center;justify-content:space-between;
  max-width:var(--container);margin:0 auto;padding:0 var(--sp-5);
}
@media (min-width:768px){.nav-inner{padding:0 var(--sp-6)}}
@media (min-width:1024px){.nav-inner{padding:0 var(--sp-8)}}

/* When on light pages (about, contact, properties, property) — non-transparent nav */
.nav.solid{background:var(--primary-dark);box-shadow:var(--shadow-sm)}

.brand{display:flex;align-items:center;gap:.6rem;color:var(--cream);font-family:var(--font-serif);font-size:1.4rem;letter-spacing:.02em;font-weight:600}
.brand-mark{
  width:56px;height:56px;display:grid;place-items:center;
  background:transparent;
  border-radius:0;
}
.brand-mark-img{
  width:56px;height:56px;object-fit:contain;display:block;
}
.brand-name{line-height:1;font-size:1.2rem}
.brand-tag{display:block;font-family:var(--font-sans);font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--accent);font-weight:500;margin-top:2px}
.brand-logo-full{height:50px;width:auto;display:block}

.nav-links{display:none;align-items:center;gap:2rem;list-style:none;margin:0;padding:0}
.nav-links a{color:var(--cream);font-size:.92rem;font-weight:400;letter-spacing:.03em;position:relative;padding:.5rem 0}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--accent);transition:width var(--dur) var(--ease)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
@media (min-width:1024px){.nav-links{display:flex}}

.nav-cta{display:none;align-items:center;gap:.5rem;color:var(--cream);font-weight:500;font-size:.9rem;padding:.55rem 1.1rem;border:1px solid rgba(201,169,97,.6);border-radius:var(--radius-sm);transition:all var(--dur) var(--ease)}
.nav-cta:hover{background:var(--accent);color:var(--primary-darker);border-color:var(--accent)}
.nav-cta svg{width:16px;height:16px}
@media (min-width:1024px){.nav-cta{display:inline-flex}}

.nav-toggle{
  display:grid;place-items:center;
  width:44px;height:44px;color:var(--cream);
}
@media (min-width:1024px){.nav-toggle{display:none}}
.nav-toggle svg{width:26px;height:26px}