/* Rezidence Vlčí důl — Design Tokens & Shared Styles */
/* Jediný zdroj pravdy pro vzhled dle design.md (odvozeno z design.html) */

:root {
  /* Light Theme */
  --color-primary: #c4a15a;
  --color-primary-hover: #b3914e;
  --color-primary-light: rgba(196, 161, 90, 0.1);
  --color-secondary: #4f7942;
  --color-bg: #fdfbf7;
  --color-surface: #ffffff;
  --color-text: #2d3748;
  --color-text-muted: #718096;
  --color-border: #e2e8f0;
}

.dark {
  /* Dark Theme (Default) */
  --color-primary: #d4b16a;
  --color-primary-hover: #e5c37d;
  --color-primary-light: rgba(212, 177, 106, 0.15);
  --color-secondary: #87a96b;
  --color-bg: #1f2421;
  --color-surface: #2a302c;
  --color-text: #f0f4f8;
  --color-text-muted: #9fb3c8;
  --color-border: #3d4641;
}

/* Base Styles */
html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--color-bg);
  color: var(--color-text);
  transition: background-color 0.4s ease, color 0.4s ease;
  -webkit-font-smoothing: antialiased;
}

/* Keyboard Focus Accessibility */
:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* Glassmorphism Navigation */
.glass-nav {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--color-border);
}

.dark .glass-nav {
  background: rgba(42, 48, 44, 0.85);
}

/* Scroll Animations */
.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}

.stagger-1 { transition-delay: 100ms; }
.stagger-2 { transition-delay: 200ms; }
.stagger-3 { transition-delay: 300ms; }

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  .fade-in-up {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .faq-content,
  .faq-icon {
    transition: none;
  }
}

/* FAQ Accordion Smooth Opening */
.faq-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease-out;
}

.faq-content > div {
  overflow: hidden;
}

.faq-item.active .faq-content {
  grid-template-rows: 1fr;
}

.faq-icon {
  transition: transform 0.3s ease;
}

.faq-item.active .faq-icon {
  transform: rotate(180deg);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--color-bg);
}

::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 4px;
}

/* Visualization / Floorplan Badge */
.media-badge {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid var(--color-border);
  color: var(--color-text);
}

.dark .media-badge {
  background: rgba(42, 48, 44, 0.9);
}

/* Skip to content link for keyboard users */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
}

.skip-link:focus {
  left: 1rem;
  top: 1rem;
  padding: 0.75rem 1.25rem;
  background: var(--color-primary);
  color: #ffffff;
  border-radius: 9999px;
  font-weight: 600;
}