@tailwind base;
@tailwind components;
@tailwind utilities;
:root {
  --background: 0 0% 100%;
  --foreground: 0 0% 3.9%;
  --card: 0 0% 100%;
  --card-foreground: 0 0% 3.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 0 0% 3.9%;
  --primary: 0 0% 9%;
  --primary-foreground: 0 0% 98%;
  --secondary: 0 0% 96.1%;
  --secondary-foreground: 0 0% 9%;
  --muted: 0 0% 96.1%;
  --muted-foreground: 0 0% 45.1%;
  --accent: 0 0% 96.1%;
  --accent-foreground: 0 0% 9%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 0 0% 98%;
  --border: 0 0% 89.8%;
  --input: 0 0% 89.8%;
  --ring: 0 0% 3.9%;
  --chart-1: 12 76% 61%;
  --chart-2: 173 58% 39%;
  --chart-3: 197 37% 24%;
  --chart-4: 43 74% 66%;
  --chart-5: 27 87% 67%;
  --radius: 0.5rem;
  --sidebar-background: 0 0% 98%;
  --sidebar-foreground: 240 5.3% 26.1%;
  --sidebar-primary: 240 5.9% 10%;
  --sidebar-primary-foreground: 0 0% 98%;
  --sidebar-accent: 240 4.8% 95.9%;
  --sidebar-accent-foreground: 240 5.9% 10%;
  --sidebar-border: 220 13% 91%;
  --sidebar-ring: 217.2 91.2% 59.8%;
}
.dark {
  --background: 0 0% 3.9%;
  --foreground: 0 0% 98%;
  --card: 0 0% 3.9%;
  --card-foreground: 0 0% 98%;
  --popover: 0 0% 3.9%;
  --popover-foreground: 0 0% 98%;
  --primary: 0 0% 98%;
  --primary-foreground: 0 0% 9%;
  --secondary: 0 0% 14.9%;
  --secondary-foreground: 0 0% 98%;
  --muted: 0 0% 14.9%;
  --muted-foreground: 0 0% 63.9%;
  --accent: 0 0% 14.9%;
  --accent-foreground: 0 0% 98%;
  --destructive: 0 62.8% 30.6%;
  --destructive-foreground: 0 0% 98%;
  --border: 0 0% 14.9%;
  --input: 0 0% 14.9%;
  --ring: 0 0% 83.1%;
  --chart-1: 220 70% 50%;
  --chart-2: 160 60% 45%;
  --chart-3: 30 80% 55%;
  --chart-4: 280 65% 60%;
  --chart-5: 340 75% 55%;
  --sidebar-background: 240 5.9% 10%;
  --sidebar-foreground: 240 4.8% 95.9%;
  --sidebar-primary: 224.3 76.3% 48%;
  --sidebar-primary-foreground: 0 0% 100%;
  --sidebar-accent: 240 3.7% 15.9%;
  --sidebar-accent-foreground: 240 4.8% 95.9%;
  --sidebar-border: 240 3.7% 15.9%;
  --sidebar-ring: 217.2 91.2% 59.8%;
}
html {
  scroll-behavior: smooth;
  font-size: 16px;
}
body {
  color: hsl(var(--foreground));
  background-color: hsl(var(--background));
  overscroll-behavior: none;
  font-synthesis-weight: none;
}
html > body * {
  border-color: hsl(var(--border));
}
::-webkit-scrollbar {
  width: 5px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: hsl(var(--border));
  border-radius: 5px;
}
* {
  scrollbar-width: thin;
  scrollbar-color: hsl(var(--border)) transparent;
}

/* subtle CTA hover lift (colors unchanged -> contrast intact) */
a[class*="rounded-md"],
button[class*="rounded-md"] {
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    filter 0.18s ease;
}
a[class*="rounded-md"]:hover,
button[class*="rounded-md"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px -8px rgba(0, 0, 0, 0.28);
}
a[class*="rounded-md"]:active,
button[class*="rounded-md"]:active {
  transform: translateY(0);
  box-shadow: 0 4px 10px -6px rgba(0, 0, 0, 0.25);
}
@media (prefers-reduced-motion: reduce) {
  a[class*="rounded-md"],
  button[class*="rounded-md"] {
    transition: none;
    transform: none;
  }
}

.fp-wrap {
  margin-top: 0.5rem;
}
button[aria-controls][data-state="open"] .lucide-chevron-down {
  transform: rotate(180deg);
}

/* fullscreen viewer for floor plans / apartment cards */
.fp-wrap img {
  cursor: zoom-in;
}
.lb {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(15, 23, 42, 0.92);
  cursor: zoom-out;
}
.lb[hidden] {
  display: none;
}
.lb img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 0.5rem;
  background: #fff;
  cursor: default;
}
.lb-close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
}
.lb-close:hover {
  background: rgba(255, 255, 255, 0.26);
}

.min-h-10 {
  min-height: 2.5rem;
}

.map-facade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  background: #e5e9ef;
  color: #1f2937;
  font:
    600 0.9rem system-ui,
    sans-serif;
  transition: background 0.15s;
}
.map-facade:hover {
  background: #d8dee7;
}
.map-facade svg {
  width: 28px;
  height: 28px;
  color: #059669;
}
.map-facade-sub {
  font-size: 0.72rem;
  color: #475569;
  font-weight: 500;
}

.int-marquee {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
}
.int-track {
  display: flex;
  gap: 1rem;
  width: max-content;
  animation: int-scroll 70s linear infinite;
}
.int-track picture {
  flex: 0 0 auto;
  display: block;
  line-height: 0;
}
.int-track img {
  display: block;
  width: auto;
  border-radius: 0.75rem;
  object-fit: cover;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
.int-desktop .int-track img {
  height: 20rem;
}
.int-mobile .int-track img {
  height: 28rem;
}
@keyframes int-scroll {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}
.int-mobile {
  display: none;
}
@media (max-width: 767px) {
  .int-desktop {
    display: none;
  }
  .int-mobile {
    display: block;
  }
  .int-track {
    animation-duration: 45s;
  }
}
@media (prefers-reduced-motion: reduce) {
  .int-track {
    animation: none;
  }
  .int-marquee {
    overflow-x: auto;
  }
}

address {
  font-style: normal;
}