/* Custom properties */
:root {
  --sc-red: #C0392B;
  --sc-dark: #2C3E50;
  --sc-bg: #FAFAF8;
  --sc-orange: #E67E22;
}

/* Base */
html { scroll-behavior: smooth; }
body { background-color: var(--sc-bg); color: var(--sc-dark); }

/* Hero parallax */
.hero-section {
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .hero-section { background-attachment: scroll; }
}

/* Scroll arrow bounce */
@keyframes bounce-arrow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(10px); }
}
.scroll-arrow { animation: bounce-arrow 1.8s ease-in-out infinite; }

/* Hero animations */
@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slide-up {
  from { 
    opacity: 0;
    transform: translateY(30px);
  }
  to { 
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes bounce-in {
  0% { 
    opacity: 0;
    transform: scale(0.8) translateY(20px);
  }
  50% { 
    transform: scale(1.05) translateY(-5px);
  }
  100% { 
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.animate-fade-in {
  animation: fade-in 1s ease-out forwards;
}

.animate-slide-up {
  animation: slide-up 1.2s ease-out forwards;
  animation-delay: 0.3s;
  opacity: 0;
}

.animate-slide-up-delay {
  animation: slide-up 1.2s ease-out forwards;
  animation-delay: 0.6s;
  opacity: 0;
}

.animate-bounce-in {
  animation: bounce-in 1.5s ease-out forwards;
  animation-delay: 0.9s;
  opacity: 0;
}

/* Cards */
.card { transition: box-shadow 0.3s ease; }
.card:hover { box-shadow: 0 20px 40px rgba(0,0,0,0.15); }
.card-img-wrap { overflow: hidden; }
.card-img-wrap img { transition: transform 0.4s ease; }
.card:hover .card-img-wrap img { transform: scale(1.05); }

/* Stats */
.stat-value { color: var(--sc-red); }

/* Section title underline */
.section-title { position: relative; display: inline-block; }
.section-title::after {
  content: '';
  position: absolute;
  bottom: -8px; left: 0;
  width: 60px; height: 3px;
  background: var(--sc-red);
  border-radius: 2px;
}

/* Nav links */
.nav-link { position: relative; transition: color 0.2s; }
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 2px;
  background: var(--sc-red);
  transition: width 0.25s ease;
}
.nav-link:hover::after { width: 100%; }
.nav-link:hover { color: var(--sc-red); }

/* Language select */
#lang-select, #lang-select-mobile {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.5);
  color: white;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.82rem;
  outline: none;
}
#lang-select option, #lang-select-mobile option {
  color: var(--sc-dark);
  background: white;
}

/* Season badges */
.season-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 12px;
  font-size: 0.78rem;
  font-weight: 600;
  white-space: nowrap;
}
.badge-best     { background: #27AE60; color: white; }
.badge-second   { background: #2980B9; color: white; }
.badge-avoid    { background: #E74C3C; color: white; }
.badge-optional { background: #7F8C8D; color: white; }

/* Location tag */
.location-tag {
  font-size: 0.75rem;
  color: var(--sc-orange);
  display: flex;
  align-items: center;
  gap: 4px;
}

/* Mobile nav toggle */
nav.mobile-nav-open .mobile-menu { display: flex !important; }

/* RTL overrides */
[dir="rtl"] .section-title::after { left: auto; right: 0; }
[dir="rtl"] .nav-link::after     { left: auto; right: 0; }
[dir="rtl"] #lang-select,
[dir="rtl"] #lang-select-mobile  { direction: rtl; }
[dir="rtl"] .location-tag        { flex-direction: row-reverse; }