/* assets/css/travel-typography.css */
/* Герой-секция */
.hero-title {
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: var(--font-bold);
  line-height: 1.1;
  letter-spacing: var(--tracking-tight);
  margin-bottom: var(--space-lg);
}

.hero-subtitle {
  font-family: var(--font-accent);
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-weight: var(--font-light);
  line-height: var(--leading-relaxed);
  opacity: 0.9;
  margin-bottom: var(--space-xl);
}

/* Карточки туров */
.tour-title {
  font-family: var(--font-primary);
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  line-height: var(--leading-tight);
  color: var(--text-primary);
  margin-bottom: var(--space-xs);
}

.tour-location {
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: var(--font-normal);
  color: var(--text-tertiary);
  margin-bottom: var(--space-sm);
}

.tour-description {
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: var(--font-normal);
  line-height: var(--leading-relaxed);
  color: var(--text-secondary);
  margin-bottom: var(--space-md);
}

/* Навигация и фильтры */
.nav-brand {
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: var(--font-bold);
  color: var(--primary-600);
}

.filter-title {
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: var(--text-secondary);
  margin-bottom: var(--space-sm);
}

/* Отзывы и рейтинги */
.review-text {
  font-family: var(--font-accent);
  font-size: var(--text-base);
  font-weight: var(--font-normal);
  line-height: var(--leading-relaxed);
  color: var(--text-secondary);
  font-style: italic;
}

.review-author {
  font-family: var(--font-primary);
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--text-primary);
}

/* Кнопки с иконками */
.btn-with-icon {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-family: var(--font-primary);
  font-weight: var(--font-medium);
}

/* Адаптивная типографика */
@media (max-width: 768px) {
  :root {
    --text-5xl: 2.5rem;
    --text-4xl: 2rem;
    --text-3xl: 1.75rem;
    --text-2xl: 1.5rem;
    --text-xl: 1.25rem;
    --text-lg: 1.125rem;
  }
  
  .hero-title {
    font-size: 2.5rem;
  }
  
  .hero-subtitle {
    font-size: 1.25rem;
  }
}