/* ============================================================
   Brandbox theme1 — Editorial Luxury (serif headings, deep shadows)
   Structural identity only. Colors are owned by the admin palette
   and reach this theme through the foundation aliases.
   ============================================================ */

:root {
  /* Typography: editorial serif headings on a humanist sans body */
  --font-serif: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --font-sans:  'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --nav-link-size:    clamp(15px, 0.35vw + 14px, 17px);
  --nav-cta-size:     clamp(13px, 0.25vw + 12px, 15px);
  --nav-link-tracking: 0.055em;

  /* Shape: gently rounded, generous shadows */
  --radius:    8px;
  --radius-lg: 18px;
  --transition:      all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  --shadow-card: 0 14px 48px color-mix(in srgb, var(--color-bg) 40%, transparent);

  /* Navbar: dark glass over hero, hairline accent edge */
  --navbar-bg: linear-gradient(
    180deg,
    color-mix(in srgb, var(--color-surface) 96%, transparent) 0%,
    color-mix(in srgb, var(--color-bg) 92%, transparent) 50%,
    color-mix(in srgb, var(--color-bg) 88%, transparent) 100%
  );
  --navbar-bg-scrolled: linear-gradient(
    180deg,
    color-mix(in srgb, var(--color-surface) 99%, transparent) 0%,
    color-mix(in srgb, var(--color-bg) 98%, transparent) 100%
  );
  --navbar-edge:    color-mix(in srgb, var(--color-primary) 22%, transparent);
  --navbar-shadow:  0 10px 40px color-mix(in srgb, var(--color-bg) 55%, transparent);
  --navbar-shadow-scrolled: 0 6px 32px color-mix(in srgb, var(--color-bg) 60%, transparent);

  --hero-top-clearance: clamp(96px, 11vh, 132px);
}

/* Editorial title underline — slim gold filament */
.title-underline {
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--color-primary), transparent);
}

/* Section tags: tracked uppercase, serif feel */
.section-tag {
  font-family: var(--font-sans);
  letter-spacing: 0.32em;
}

/* Property cards: deep luxury shadow, generous radius */
.property-card {
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}
.property-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 60px color-mix(in srgb, var(--color-bg) 45%, transparent);
}
