/* ===== CSS ПЕРЕМЕННЫЕ ДЛЯ БЫСТРОЙ НАСТРОЙКИ ===== */
:root {
  /* ЦВЕТА */
  --color-primary: #000000;
  --color-white: #ffffff;
  --color-text: #ffffff;
  
  /* ПРОЗРАЧНОСТИ */
  --opacity-low: 0.1;
  --opacity-medium: 0.3;
  --opacity-high: 0.7;
  --opacity-very-high: 0.9;
  
  /* РАЗМЫТИЯ */
  --blur-small: 5px;
  --blur-medium: 10px;
  --blur-large: 20px;
  
  /* ОТСТУПЫ */
  --spacing-xs: 10px;
  --spacing-sm: 20px;
  --spacing-md: 30px;
  --spacing-lg: 40px;
  --spacing-xl: 60px;
  --spacing-xxl: 80px;
  
  /* РАДИУСЫ */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 15px;
  --radius-xl: 20px;
  
  /* ТЕНИ */
  --shadow-light: 0 8px 32px rgba(0, 0, 0, 0.3);
  --shadow-medium: 0 20px 40px rgba(0, 0, 0, 0.3);
  --shadow-glow: 0 0 30px rgba(255, 255, 255, 0.2);
  
  /* АНИМАЦИИ */
  --transition-fast: 0.3s ease;
  --transition-medium: 0.4s ease;
  --transition-slow: 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  
  /* РАЗМЕРЫ ШРИФТОВ */
  --font-xs: 0.85rem;
  --font-sm: 0.95rem;
  --font-md: 1rem;
  --font-lg: 1.1rem;
  --font-xl: 1.2rem;
  --font-xxl: 1.3rem;
  --font-heading-sm: 1.5rem;
  --font-heading-md: 1.8rem;
  --font-heading-lg: 2rem;
  --font-heading-xl: 2.5rem;
  --font-heading-xxl: 3rem;
}

/* ===== БАЗОВЫЕ СТИЛИ ===== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Helvetica Neue', Arial, sans-serif;
  color: var(--color-text);
  background: var(--color-primary);
}

/* ===== ФОН И ВИДЕО ===== */
.video-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

#bg-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.7);
}

.video-background::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(var(--blur-small));
  -webkit-backdrop-filter: blur(var(--blur-small));
}

.video-background::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  animation: fadeOut 2s ease-in-out 1s forwards;
  z-index: 1;
}

/* ===== ГЛАВНАЯ СТРАНИЦА ===== */
.content {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: var(--spacing-sm);
}

/* ЛОГОТИПЫ */
.logo-bg {
  position: absolute;
  width: 80%;
  max-width: 800px;
  opacity: 0.1;
  z-index: 0;
  animation: fadeInScale 3s ease-out forwards;
}

.logo {
  width: 300px;
  height: auto;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  animation: logoPulse 6s ease-in-out 2s infinite;
}

.tagline {
  font-family: 'Oswald', sans-serif;
  font-weight: 350;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: var(--font-heading-md);
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  margin: 0;
  animation: taglinePulse 6s ease-in-out 2s infinite;
}

/* ===== МЕНЮ ===== */
.menu {
  position: fixed;
  bottom: -125vh;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(var(--blur-large)) saturate(180%);
  -webkit-backdrop-filter: blur(var(--blur-large)) saturate(180%);
  display: flex;
  justify-content: center;
  align-items: center;
  transition: bottom var(--transition-slow);
  z-index: 1000;
  border-top: 1px solid rgba(255, 255, 255, var(--opacity-low));
}

.menu.active { 
  bottom: 0; 
}

.menu-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
  text-align: center;
  position: absolute;
  top: 48%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.menu-btn {
  color: rgba(255, 255, 255, var(--opacity-very-high));
  text-decoration: none;
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  font-size: var(--font-heading-sm);
  padding: 18px 63px;
  border: none;
  transition: all var(--transition-medium);
  background: rgba(255, 255, 255, var(--opacity-low));
  backdrop-filter: blur(var(--blur-large));
  -webkit-backdrop-filter: blur(var(--blur-large));
  border-radius: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, var(--opacity-low));
}

.menu-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, var(--opacity-medium));
  transform: scale(0.9);
  box-shadow: var(--shadow-glow), inset 0 0 20px rgba(255, 255, 255, var(--opacity-low));
}

/* КНОПКА МЕНЮ */
.notch {
  position: fixed;
  bottom: var(--spacing-lg);
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 60px;
  cursor: pointer;
  z-index: 1001;
  transition: all var(--transition-slow);
  opacity: 0;
  background: transparent;
}

.notch::before {
  content: 'НАВИГАЦИЯ';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 180px;
  height: 50px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(var(--blur-large));
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-lg);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.9);
  transition: all var(--transition-medium);
}

.notch.visible {
  opacity: 1;
}

.notch.rotated {
  bottom: calc(100vh - 70px);
  opacity: 0;
}

.notch.rotated::before {
  width: 200px;
  background: rgba(255, 255, 255, 0.05);
}

.notch:hover::before { 
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.3);
}

.notch.rotated:hover::before { 
  background: rgba(255, 255, 255, 0.1);
}

/* ФИКСИРОВАННАЯ кнопка для полноэкранных страниц */
.notch.static {
  position: fixed;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 1 !important;
}

.notch.static.visible {
  opacity: 1;
}

/* ===== ПОРТФОЛИО ===== */
.portfolio-content {
  position: relative;
  z-index: 1;
  padding: var(--spacing-xxl) var(--spacing-sm);
  max-width: 1400px;
  margin: 0 auto;
}

.portfolio-content h1 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-xxl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-xl);
  opacity: 0;
  animation: fadeInUp 1.5s ease-out 0.5s forwards;
}

.portfolio-item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--spacing-xl);
  align-items: center;
  margin-bottom: var(--spacing-xxl);
  opacity: 0;
  animation: fadeInUp 1s ease-out forwards;
}

.portfolio-item:nth-child(2) { 
  animation-delay: 0.3s; 
}

.portfolio-item:nth-child(3) { 
  animation-delay: 0.6s; 
}

/* КАРУСЕЛЬ */
.portfolio-carousel {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-medium);
  height: 400px;
  background: #000;
}

.carousel-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all 0.8s ease-in-out;
}

.carousel-slide.active { 
  opacity: 1; 
  z-index: 2; 
}

.carousel-slide.slide-in-right { 
  animation: slideInRight 0.8s ease-in-out forwards; 
}

.carousel-slide.slide-out-left { 
  animation: slideOutLeft 0.8s ease-in-out forwards; 
}

.carousel-slide.slide-in-left { 
  animation: slideInLeft 0.8s ease-in-out forwards; 
}

.carousel-slide.slide-out-right { 
  animation: slideOutRight 0.8s ease-in-out forwards; 
}

.carousel-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.carousel-controls {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  z-index: 1000;
  padding: 0 var(--spacing-sm);
}

.carousel-prev,
.carousel-next {
  background: rgba(0, 0, 0, var(--opacity-medium));
  border: none;
  color: white;
  cursor: pointer;
  font-size: 24px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition-fast);
  line-height: 1;
  padding: 0;
  margin: 0;
  position: relative;
}

.carousel-prev { 
  transform: translateX(-2px); 
}

.carousel-next { 
  transform: translateX(2px); 
}

.carousel-prev:hover,
.carousel-next:hover {
  background: rgba(0, 0, 0, 0.6);
  transform: scale(1.1);
}

/* АДАПТИВНОСТЬ ДЛЯ ПОРТФОЛИО */
@media (max-width: 768px) {
  .portfolio-item {
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
  }
  
  .portfolio-carousel {
    height: 300px;
    order: 1;
  }
  
  .portfolio-info {
    order: 2;
    padding: var(--spacing-sm) 0;
  }
  
  .portfolio-content h1 {
    font-size: var(--font-heading-xl);
  }
  
  .portfolio-info h2 {
    font-size: var(--font-heading-md);
  }
  
  .portfolio-info p {
    font-size: var(--font-md);
  }
}

@media (max-width: 480px) {
  .portfolio-carousel {
    height: 250px;
  }
  
  .carousel-controls {
    padding: 0 var(--spacing-xs);
  }
  
  .carousel-prev,
  .carousel-next {
    width: 40px;
    height: 40px;
    font-size: 20px;
  }
}

/* ИНФОРМАЦИЯ О ПРОЕКТЕ */
.portfolio-info { 
  padding: var(--spacing-sm); 
}

.portfolio-info h2 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-lg);
  letter-spacing: 0.1em;
  margin-bottom: var(--spacing-sm);
  text-transform: uppercase;
}

.portfolio-info p {
  font-size: var(--font-lg);
  line-height: 1.6;
  margin-bottom: var(--spacing-md);
  opacity: var(--opacity-very-high);
}

.project-meta { 
  display: flex; 
  gap: var(--spacing-sm); 
}

.project-category,
.project-year {
  background: rgba(255, 255, 255, var(--opacity-low));
  backdrop-filter: blur(var(--blur-medium));
  padding: 8px 16px;
  border-radius: var(--radius-xl);
  font-size: var(--font-xs);
  border: 1px solid rgba(255, 255, 255, var(--opacity-medium));
}

/* ===== ПОДХОД ===== */
.approach-page { 
  overflow-y: auto; 
}

.approach-content {
  position: relative;
  z-index: 1;
  padding: var(--spacing-xxl) var(--spacing-sm);
  max-width: 1200px;
  margin: 0 auto;
}

.approach-content h1 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-xxl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-xxl);
  text-align: center;
  opacity: 0;
  animation: fadeInUp 1.5s ease-out 0.5s forwards;
}

/* КАРТОЧКИ ПРЕИМУЩЕСТВ */
.approach-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: var(--spacing-lg);
  margin-bottom: var(--spacing-xxl);
}

.approach-card {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(var(--blur-large));
  border: 1px solid rgba(255, 255, 255, var(--opacity-low));
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg) var(--spacing-md);
  transition: all var(--transition-fast);
  opacity: 0;
  animation: fadeInUp 1s ease-out forwards;
}

.approach-card:nth-child(1) { animation-delay: 0.2s; }
.approach-card:nth-child(2) { animation-delay: 0.4s; }
.approach-card:nth-child(3) { animation-delay: 0.6s; }
.approach-card:nth-child(4) { animation-delay: 0.8s; }
.approach-card:nth-child(5) { animation-delay: 1.0s; }
.approach-card:nth-child(6) { animation-delay: 1.2s; }

.approach-card:hover {
  transform: translateY(-10px);
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, var(--opacity-medium));
  box-shadow: var(--shadow-medium);
}

.approach-icon {
  font-family: 'Oswald', sans-serif;
  font-size: var(--font-heading-sm);
  font-weight: 300;
  color: rgba(255, 255, 255, var(--opacity-high));
  margin-bottom: var(--spacing-sm);
}

.approach-card h3 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-sm);
  margin-bottom: 15px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.approach-card p {
  line-height: 1.6;
  opacity: var(--opacity-medium);
  font-size: var(--font-md);
}

/* ГАРАНТИИ */
.guarantees-section { 
  margin-bottom: var(--spacing-xxl); 
}

.guarantees-section h2 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-xl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-xl);
  text-align: center;
}

.guarantees-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--spacing-md);
}

.guarantee-item {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: var(--radius-md);
  padding: var(--spacing-md) 25px;
  transition: all var(--transition-fast);
}

.guarantee-item:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, var(--opacity-low));
}

.guarantee-item h4 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-xl);
  margin-bottom: var(--spacing-xs);
  text-align: center;
}

.guarantee-item p {
  opacity: var(--opacity-high);
  line-height: 1.5;
  font-size: var(--font-sm);
  text-align: center;
}

/* ПРОЦЕСС */
.process-section h2 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-xl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-xl);
  text-align: center;
}

.process-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--spacing-lg);
}

.process-step {
  text-align: center;
  padding: var(--spacing-lg) var(--spacing-sm);
}

.step-number {
  width: 60px;
  height: 60px;
  background: rgba(255, 255, 255, var(--opacity-low));
  border: 2px solid rgba(255, 255, 255, var(--opacity-medium));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: var(--font-heading-sm);
  margin: 0 auto var(--spacing-sm);
  transition: all var(--transition-fast);
}

.process-step:hover .step-number {
  background: rgba(255, 255, 255, 0.2);
  transform: scale(1.1);
}

.process-step h4 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-xxl);
  margin-bottom: 15px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.process-step p {
  opacity: var(--opacity-medium);
  line-height: 1.5;
}

/* ===== КОНТАКТЫ ===== */
.contacts-page { 
  overflow-y: auto; 
}

.contacts-content {
  position: relative;
  z-index: 1;
  padding: var(--spacing-xxl) var(--spacing-sm);
  max-width: 1400px;
  margin: 0 auto;
}

.contacts-content h1 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-xxl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-xxl);
  text-align: center;
  opacity: 0;
  animation: fadeInUp 1.5s ease-out 0.5s forwards;
}

.contacts-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-xxl);
}

/* Обновленные стили для кликабельной карточки */
.contact-card {
  flex: 0 0 calc(33.333% - var(--spacing-md));
  max-width: 280px;
  min-width: 250px;
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(var(--blur-large));
  border: 1px solid rgba(255, 255, 255, var(--opacity-low));
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg) var(--spacing-md);
  text-align: center;
  transition: all var(--transition-fast);
  opacity: 0;
  animation: fadeInUp 1s ease-out forwards;
  text-decoration: none;
  color: inherit;
  display: block;
  cursor: pointer;
}

/* Для обычных карточек (не ссылок) добавляем класс */
.contact-card:not([href]) {
  cursor: default;
}

.contact-card:nth-child(1) { animation-delay: 0.2s; }
.contact-card:nth-child(2) { animation-delay: 0.4s; }
.contact-card:nth-child(3) { animation-delay: 0.6s; }
.contact-card:nth-child(4) { animation-delay: 0.8s; }

/* Ховер эффект только для кликабельных карточек */
.contact-card[href]:hover {
  transform: translateY(-10px);
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, var(--opacity-medium));
  box-shadow: var(--shadow-medium);
}

.contact-icon {
  font-size: 3rem;
  margin-bottom: var(--spacing-sm);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
}

.whatsapp-icon {
  width: 16px;
  height: 16px;
}

.contact-icon img {
  display: block;
  width: 40%;
  height: auto;
  margin: 0 auto;
}

.contact-card h3 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-sm);
  margin-bottom: 15px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* Обновляем стиль для текста "Написать" */
.contact-link {
  color: white;
  font-size: var(--font-xl);
  text-decoration: none;
  display: block;
  margin-bottom: var(--spacing-xs);
  transition: all var(--transition-fast);
  padding: 8px 0;
  border-bottom: 1px solid transparent;
}

/* Убираем ховер эффект у текста, так как вся карточка кликабельна */
.contact-card[href] .contact-link:hover {
  color: white;
  border-bottom: 1px solid transparent;
}

.contact-card p {
  line-height: 1.5;
  opacity: var(--opacity-high);
  font-size: var(--font-sm);
  margin: 0;
}

.contacts-info { 
  margin-bottom: var(--spacing-xl); 
}

.info-card {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(var(--blur-large));
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: var(--radius-lg);
  padding: 50px 40px;
  max-width: 800px;
  margin: 0 auto;
}

.info-card h2 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-lg);
  margin-bottom: 25px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  text-align: center;
}

.info-card > p {
  line-height: 1.6;
  opacity: var(--opacity-medium);
  text-align: center;
  margin-bottom: var(--spacing-lg);
  font-size: var(--font-lg);
}

.work-hours,
.response-time {
  margin-bottom: var(--spacing-md);
}

.work-hours:last-child,
.response-time:last-child {
  margin-bottom: 0;
}

.work-hours h4,
.response-time h4 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-xl);
  margin-bottom: 15px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.work-hours p,
.response-time p {
  line-height: 1.5;
  opacity: var(--opacity-high);
  margin-bottom: 8px;
  padding-left: var(--spacing-sm);
}

.work-hours p:last-child,
.response-time p:last-child {
  margin-bottom: 0;
}

/* ===== MATERIAL COSMIC ===== */
.cosmic-page { 
  overflow-y: auto; 
}

.cosmic-content {
  position: relative;
  z-index: 1;
  padding: var(--spacing-xxl) var(--spacing-sm);
  max-width: 1200px;
  margin: 0 auto;
}

.cosmic-content h1 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-xxl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-xxl);
  text-align: center;
  opacity: 0;
  animation: fadeInUp 1.5s ease-out 0.5s forwards;
}

.cosmic-philosophy {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: var(--spacing-lg);
  margin-bottom: var(--spacing-xxl);
}

.philosophy-card {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(var(--blur-large));
  border: 1px solid rgba(255, 255, 255, var(--opacity-low));
  border-radius: var(--radius-lg);
  padding: 50px 40px;
  text-align: center;
  transition: all var(--transition-fast);
  opacity: 0;
  animation: fadeInUp 1s ease-out forwards;
}

.philosophy-card:nth-child(1) { animation-delay: 0.3s; }
.philosophy-card:nth-child(2) { animation-delay: 0.6s; }
.philosophy-card:nth-child(3) { animation-delay: 0.9s; }

.philosophy-card:hover {
  transform: translateY(-10px);
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, var(--opacity-medium));
  box-shadow: var(--shadow-medium);
}

.philosophy-icon {
  font-size: 4rem;
  margin-bottom: 25px;
  display: block;
}

.philosophy-card h2 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-md);
  margin-bottom: var(--spacing-sm);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.philosophy-card p {
  line-height: 1.7;
  opacity: var(--opacity-very-high);
  font-size: var(--font-lg);
}

.cosmic-principles { 
  margin-bottom: 100px; 
}

.cosmic-principles h2 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-heading-xl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-xl);
  text-align: center;
}

.principles-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--spacing-md);
}

.principle-item {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: var(--radius-md);
  padding: 35px 30px;
  transition: all var(--transition-fast);
}

.principle-item:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, var(--opacity-low));
  transform: translateY(-5px);
}

.principle-item h3 {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-xxl);
  margin-bottom: 15px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255, 255, 255, var(--opacity-very-high));
}

.principle-item p {
  line-height: 1.6;
  opacity: var(--opacity-medium);
}

.cosmic-quote {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
  padding: var(--spacing-xl) 0;
}

.cosmic-quote blockquote {
  font-family: 'Oswald', sans-serif;
  font-weight: 200;
  font-size: var(--font-heading-lg);
  line-height: 1.4;
  font-style: italic;
  margin-bottom: var(--spacing-sm);
  color: rgba(255, 255, 255, var(--opacity-very-high));
  position: relative;
}

.cosmic-quote blockquote::before {
  content: '"';
  font-size: 4rem;
  position: absolute;
  top: -20px;
  left: -40px;
  opacity: var(--opacity-medium);
}

.quote-author {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
  font-size: var(--font-lg);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  opacity: var(--opacity-high);
}

/* ===== СИСТЕМА ЭФФЕКТОВ ===== */
.effects-menu-btn {
  position: absolute;
  bottom: var(--spacing-md);
  right: var(--spacing-md);
  background: rgba(255, 255, 255, var(--opacity-low));
  backdrop-filter: blur(var(--blur-medium));
  border: 1px solid rgba(255, 255, 255, var(--opacity-medium));
  border-radius: var(--radius-sm);
  padding: 2px 8px;
  color: white;
  font-family: 'Oswald', sans-serif;
  font-weight: 50;
  font-size: var(--font-md);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  cursor: pointer;
  transition: all var(--transition-fast);
  z-index: 1001;
}

.effects-menu-btn:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: scale(1.05);
}

/* ===== УПРОЩЕННЫЕ ЭФФЕКТЫ ===== */
.simple-effects .video-background { 
  display: none !important; 
}

.simple-effects body { 
  background: #000000 !important; 
}

.simple-effects .video-background::after { 
  display: none !important; 
}

.simple-effects .menu {
  backdrop-filter: none !important;
  background: rgba(0, 0, 0, var(--opacity-very-high)) !important;
}

.simple-effects .menu-btn {
  backdrop-filter: none !important;
  background: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, var(--opacity-medium)) !important;
}

.simple-effects .approach-card,
.simple-effects .info-card,
.simple-effects .philosophy-card,
.simple-effects .principle-item,
.simple-effects .contact-card,
.simple-effects .guarantee-item,
.simple-effects .order-form {
  backdrop-filter: none !important;
  background: rgba(0, 0, 0, 0.8) !important;
  border: 1px solid rgba(255, 255, 255, var(--opacity-medium)) !important;
}

.simple-effects .approach-card:hover,
.simple-effects .contact-card:hover,
.simple-effects .philosophy-card:hover,
.simple-effects .principle-item:hover,
.simple-effects .guarantee-item:hover {
  transform: none !important;
  background: rgba(0, 0, 0, var(--opacity-very-high)) !important;
}

.simple-effects .menu-btn:hover {
  transform: none !important;
  background: rgba(255, 255, 255, var(--opacity-medium)) !important;
}

.simple-effects .effects-menu-btn {
  backdrop-filter: none !important;
  background: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, var(--opacity-medium)) !important;
}

.simple-effects .effects-menu-btn:hover {
  background: rgba(255, 255, 255, var(--opacity-medium)) !important;
  transform: none !important;
}

/* Отключение всех анимаций */
.simple-effects .portfolio-content h1,
.simple-effects .portfolio-item,
.simple-effects .approach-content h1,
.simple-effects .approach-card,
.simple-effects .guarantees-section,
.simple-effects .process-section,
.simple-effects .contacts-content h1,
.simple-effects .contact-card,
.simple-effects .cosmic-content h1,
.simple-effects .philosophy-card,
.simple-effects .principle-item,
.simple-effects .cosmic-quote blockquote,
.simple-effects .cosmic-principles h2,
.simple-effects .order-content h1,
.simple-effects .form-group,
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.simple-effects .philosophy-card:nth-child(1),
.simple-effects .philosophy-card:nth-child(2),
.simple-effects .philosophy-card:nth-child(3),
.simple-effects .approach-card:nth-child(1),
.simple-effects .approach-card:nth-child(2),
.simple-effects .approach-card:nth-child(3),
.simple-effects .approach-card:nth-child(4),
.simple-effects .approach-card:nth-child(5),
.simple-effects .approach-card:nth-child(6),
.simple-effects .contact-card:nth-child(1),
.simple-effects .contact-card:nth-child(2),
.simple-effects .contact-card:nth-child(3),
.simple-effects .contact-card:nth-child(4),
.simple-effects .portfolio-item:nth-child(2),
.simple-effects .portfolio-item:nth-child(3),
.simple-effects .form-group:nth-child(1),
.simple-effects .form-group:nth-child(2),
.simple-effects .form-group:nth-child(3),
.simple-effects .form-group:nth-child(4),
.simple-effects .form-group:nth-child(5) {
  animation-delay: 0s !important;
}

/* Отключение hover эффектов для интерактивных элементов */
.simple-effects .carousel-prev:hover,
.simple-effects .carousel-next:hover,
.simple-effects .process-step:hover .step-number,
.simple-effects .submit-btn:hover {
  transform: none !important;
  background: rgba(0, 0, 0, 0.6) !important;
}

.simple-effects .service-option input:checked + .service-label,
.simple-effects .messenger-option input:checked + .messenger-label {
  box-shadow: none !important;
}

/* ===== СТИЛИ ДЛЯ СТРАНИЦЫ ЗАКАЗА ===== */
.order-page {
    overflow-y: auto;
    min-height: 100vh;
}

.order-content {
    position: relative;
    z-index: 1;
    padding: var(--spacing-xxl) var(--spacing-sm);
    max-width: 800px;
    margin: 0 auto;
}

.order-content h1 {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: var(--font-heading-xxl);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: var(--spacing-xl);
    text-align: center;
    opacity: 0;
    animation: fadeInUp 1.5s ease-out 0.5s forwards;
}

.order-form {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(var(--blur-large));
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-medium);
}

.form-group {
    margin-bottom: var(--spacing-lg);
    opacity: 0;
    animation: fadeInUp 1s ease-out forwards;
}

.form-group:nth-child(1) { animation-delay: 0.3s; }
.form-group:nth-child(2) { animation-delay: 0.5s; }
.form-group:nth-child(3) { animation-delay: 0.7s; }
.form-group:nth-child(4) { animation-delay: 0.9s; }
.form-group:nth-child(5) { animation-delay: 1.1s; }

.form-group label {
    display: block;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: var(--font-lg);
    margin-bottom: var(--spacing-xs);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.form-control {
    width: 100%;
    padding: 15px 20px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-md);
    color: var(--color-text);
    font-size: var(--font-md);
    transition: all var(--transition-fast);
    font-family: inherit;
}

.form-control:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, var(--opacity-medium));
    box-shadow: var(--shadow-glow);
}

textarea.form-control {
    min-height: 120px;
    resize: vertical;
}

/* Центрированные кнопки выбора услуги */
.service-options {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    justify-content: center;
}

.service-option {
    position: relative;
    cursor: pointer;
    flex: 0 0 calc(33.333% - var(--spacing-sm));
    max-width: 200px;
}

.service-option input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.service-label {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 25px 15px 20px; /* Больше паддинга сверху, меньше снизу */
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    width: 100%;
    height: 100%;
    min-height: 80px;
    text-align: center;
    /* Опускаем текст чуть ниже */
    padding-top: 28px;
    padding-bottom: 16px;
}

.service-option input:checked + .service-label {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, var(--opacity-medium));
    box-shadow: var(--shadow-glow);
}

/* Центрированные иконки мессенджеров */
.messenger-selection {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
    justify-content: center;
}

.messenger-option {
    position: relative;
    cursor: pointer;
    flex: 0 0 calc(33.333% - var(--spacing-sm));
    max-width: 120px;
}

.messenger-option input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.messenger-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start; /* Меняем на flex-start и используем паддинг */
    padding: 12px var(--spacing-sm) 8px; /* Больше паддинга сверху, меньше снизу */
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
    width: 100%;
    height: 100px;
    text-align: center;
    /* Убираем gap и используем точные отступы */
}

.messenger-option input:checked + .messenger-label {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, var(--opacity-medium));
    box-shadow: var(--shadow-glow);
}

.messenger-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 6px; /* Контролируемый отступ между иконкой и текстом */
}

.messenger-icon img {
    width: 100%;
    height: auto;
    display: block;
}

.messenger-name {
    font-size: var(--font-sm);
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-align: center;
    line-height: 1.2;
    width: 100%;
    /* Поднимаем текст еще выше */
    margin-top: -2px;
}

/* Контактные данные */
.contact-input-wrapper {
    position: relative;
    width: 100%;
}

.contact-input-group {
    display: flex;
    gap: var(--spacing-sm);
    width: 100%;
}

/* Исправление для email - показываем поле ввода */
.email-contact .contact-input-group {
    display: flex !important;
}

.email-contact .messenger-prefix {
    display: none !important;
}

.messenger-prefix {
    flex: 0 0 auto;
    padding: 15px 20px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    min-width: 120px;
}

.contact-input {
    flex: 1;
}

.submit-btn {
    width: 100%;
    padding: 18px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-md);
    color: var(--color-text);
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: var(--font-lg);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: all var(--transition-medium);
    margin-top: var(--spacing-md);
}

.submit-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, var(--opacity-medium));
    box-shadow: var(--shadow-glow);
    transform: translateY(-2px);
}

/* Адаптивность для страницы заказа */
@media (max-width: 768px) {
    .order-content {
        padding: var(--spacing-xl) var(--spacing-sm);
    }
    
    .order-content h1 {
        font-size: var(--font-heading-lg);
    }
    
    .order-form {
        padding: var(--spacing-lg);
    }
    
    .service-option {
        flex: 0 0 calc(50% - var(--spacing-sm));
        max-width: 180px;
    }
    
    .messenger-option {
        flex: 0 0 calc(33.333% - var(--spacing-sm));
        max-width: 110px;
    }
    
  .contact-input-group {
    flex-direction: row; /* Меняем с column на row */
    gap: 10px; /* Уменьшаем gap */
  }
  
  .messenger-prefix {
    min-width: 60px; /* Уменьшаем минимальную ширину */
    padding: 12px 8px; /* Корректируем паддинг */
    font-size: var(--font-sm);
  }
  
  .contact-input {
    flex: 1;
  }
}

@media (max-width: 480px) {
    .service-option {
        flex: 0 0 100%;
        max-width: 250px;
    }
    
    .messenger-option {
        flex: 0 0 calc(50% - var(--spacing-sm));
        max-width: 130px;
    }
    
    .service-label {
        padding: 15px 10px;
        min-height: 70px;
    }
    
    .messenger-label {
        height: 90px;
        padding: 15px 10px;
    }
  .contact-input-group {
    flex-direction: row;
    gap: 8px;
  }
  
  .messenger-prefix {
    min-width: 50px;
    padding: 10px 6px;
    font-size: var(--font-xs);
  }
  
  .form-control {
    padding: 12px 15px; /* Немного уменьшаем паддинг для мобильных */
  }
}

/* ===== АНИМАЦИИ ===== */
@keyframes fadeOut {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes fadeInScale {
  from { opacity: 0.5; transform: scale(0.3); }
  to { opacity: 0; transform: scale(0.3); }
}

@keyframes logoPulse {
  0% { opacity: 0; }
  16.5% { opacity: 1; }
  33% { opacity: 1; }
  49.5% { opacity: 0; }
  100% { opacity: 0; }
}

@keyframes taglinePulse {
  0% { opacity: 0; }
  49.5% { opacity: 0; }
  66% { opacity: 1; }
  82.5% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% { transform: translateX(-50%) translateY(0); }
  40% { transform: translateX(-50%) translateY(-10px); }
  60% { transform: translateX(-50%) translateY(-5px); }
}

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

@keyframes slideInRight {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

@keyframes slideOutLeft {
  from { transform: translateX(0); opacity: 1; }
  to { transform: translateX(-100%); opacity: 0; }
}

@keyframes slideInLeft {
  from { transform: translateX(-100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

@keyframes slideOutRight {
  from { transform: translateX(0); opacity: 1; }
  to { transform: translateX(100%); opacity: 0; }
}

/* ===== АДАПТИВНОСТЬ ===== */
@media (max-width: 1200px) {
  .guarantees-grid,
  .principles-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .portfolio-item { 
    grid-template-columns: 1fr; 
    gap: var(--spacing-md); 
  }
  
  .portfolio-content h1 { 
    font-size: var(--font-heading-lg); 
  }
  
  .menu-btn { 
    padding: 20px 40px; 
    font-size: var(--font-xl); 
  }
  
  .logo { 
    width: 200px; 
  }
  
  .tagline { 
    font-size: var(--font-xl); 
  }
  
  .carousel-controls { 
    margin: 0 -50px; 
  }
  
  .carousel-prev,
  .carousel-next { 
    font-size: 2.5rem; 
    width: 40px; 
    height: 40px; 
  }
  
  .approach-content { 
    padding: var(--spacing-xxl) var(--spacing-sm); 
  }
  
  .approach-content h1 { 
    font-size: var(--font-heading-lg); 
    margin-bottom: var(--spacing-xl); 
  }
  
  .approach-grid { 
    grid-template-columns: 1fr; 
    gap: var(--spacing-md); 
  }
  
  .approach-card { 
    padding: var(--spacing-md) var(--spacing-sm); 
  }
  
  .guarantees-section h2,
  .process-section h2 { 
    font-size: var(--font-heading-lg); 
  }
  
  .process-steps { 
    grid-template-columns: 1fr; 
    gap: var(--spacing-md); 
  }
  
  .contacts-content { 
    padding: var(--spacing-xxl) var(--spacing-sm); 
  }
  
  .contacts-content h1 { 
    font-size: var(--font-heading-lg); 
    margin-bottom: var(--spacing-xl); 
  }
  
  .contacts-grid { 
    grid-template-columns: 1fr; 
    gap: var(--spacing-sm); 
  }
  
  .contact-card { 
    padding: var(--spacing-md) var(--spacing-sm); 
  }
  
  .info-card { 
    padding: var(--spacing-md) var(--spacing-sm); 
  }
  
  .info-card h2 { 
    font-size: var(--font-heading-sm); 
  }
  
  .contact-icon { 
    font-size: 2.5rem; 
  }
  
  .cosmic-content { 
    padding: var(--spacing-xxl) var(--spacing-sm); 
  }
  
  .cosmic-content h1 { 
    font-size: var(--font-heading-lg); 
    margin-bottom: var(--spacing-xl); 
  }
  
  .cosmic-philosophy { 
    grid-template-columns: 1fr; 
    gap: var(--spacing-md); 
  }
  
  .philosophy-card { 
    padding: var(--spacing-md) 25px; 
  }
  
  .philosophy-icon { 
    font-size: 3rem; 
  }
  
  .cosmic-principles h2 { 
    font-size: var(--font-heading-lg); 
  }
  
  .principles-grid { 
    grid-template-columns: 1fr; 
  }
  
  .cosmic-quote blockquote { 
    font-size: var(--font-heading-sm); 
  }
  
  .cosmic-quote blockquote::before { 
    left: -20px; 
  }
  
  /* Адаптивность для страницы заказа */
  .order-content {
      padding: var(--spacing-xl) var(--spacing-sm);
  }
  
  .order-content h1 {
      font-size: var(--font-heading-lg);
  }
  
  .order-form {
      padding: var(--spacing-lg);
  }
  
  .messenger-selection {
      grid-template-columns: repeat(3, 1fr);
  }
  
  .service-options {
      grid-template-columns: 1fr;
  }
  
  .contact-input-group {
      flex-direction: column;
  }
  
  .messenger-prefix {
      min-width: auto;
      padding: 10px;
  }
}

@media (max-width: 480px) {
  .messenger-selection {
      grid-template-columns: repeat(2, 1fr);
  }
}

/* ===== СТИЛИ ДЛЯ СТРАНИЦЫ ПОЛИТИКИ КОНФИДЕНЦИАЛЬНОСТИ ===== */
.privacy-page {
    overflow-y: auto;
    min-height: 100vh;
}

.legal-content {
    position: relative;
    z-index: 1;
    padding: var(--spacing-xxl) var(--spacing-sm);
    max-width: 1000px;
    margin: 0 auto;
}

.legal-container {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(var(--blur-large));
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-medium);
}

.legal-content h1 {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: var(--font-heading-xl);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: var(--spacing-xl);
    text-align: center;
    opacity: 0;
    animation: fadeInUp 1.5s ease-out 0.5s forwards;
}

.legal-section {
    margin-bottom: var(--spacing-lg);
    opacity: 0;
    animation: fadeInUp 1s ease-out forwards;
}

.legal-section:nth-child(1) { animation-delay: 0.3s; }
.legal-section:nth-child(2) { animation-delay: 0.5s; }
.legal-section:nth-child(3) { animation-delay: 0.7s; }
.legal-section:nth-child(4) { animation-delay: 0.9s; }
.legal-section:nth-child(5) { animation-delay: 1.1s; }
.legal-section:nth-child(6) { animation-delay: 1.3s; }
.legal-section:nth-child(7) { animation-delay: 1.5s; }
.legal-section:nth-child(8) { animation-delay: 1.7s; }

.legal-section h2 {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: var(--font-heading-sm);
    margin-bottom: var(--spacing-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, var(--opacity-very-high));
}

.legal-section p {
    line-height: 1.6;
    margin-bottom: var(--spacing-xs);
    opacity: var(--opacity-high);
}

.legal-section ul {
    margin-left: var(--spacing-md);
    margin-bottom: var(--spacing-xs);
}

.legal-section li {
    line-height: 1.6;
    margin-bottom: 8px;
    opacity: var(--opacity-high);
}

.legal-date {
    text-align: center;
    margin-top: var(--spacing-xl);
    padding-top: var(--spacing-md);
    border-top: 1px solid rgba(255, 255, 255, var(--opacity-low));
    opacity: var(--opacity-medium);
}

/* АДАПТИВНОСТЬ ДЛЯ СТРАНИЦЫ ПОЛИТИКИ */
@media (max-width: 768px) {
    .legal-content {
        padding: var(--spacing-xl) var(--spacing-sm);
    }
    
    .legal-container {
        padding: var(--spacing-lg);
    }
    
    .legal-content h1 {
        font-size: var(--font-heading-lg);
    }
    
    .legal-section h2 {
        font-size: var(--font-xl);
    }
}

@media (max-width: 480px) {
    .legal-container {
        padding: var(--spacing-md);
    }
    
    .legal-content h1 {
        font-size: var(--font-heading-md);
    }
}

/* ===== СТИЛИ ДЛЯ СТРАНИЦЫ "СВЕДЕНИЯ" ===== */
.about-page {
    overflow-y: auto;
    min-height: 100vh;
}

.about-content {
    position: relative;
    z-index: 1;
    padding: var(--spacing-xxl) var(--spacing-sm);
    max-width: 1000px;
    margin: 0 auto;
}

.about-container {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(var(--blur-large));
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-medium);
}

.about-content h1 {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: var(--font-heading-xl);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: var(--spacing-xl);
    text-align: center;
    opacity: 0;
    animation: fadeInUp 1.5s ease-out 0.5s forwards;
}

.about-section {
    margin-bottom: var(--spacing-lg);
    padding-bottom: var(--spacing-md);
    border-bottom: 1px solid rgba(255, 255, 255, var(--opacity-low));
    opacity: 0;
    animation: fadeInUp 1s ease-out forwards;
}

.about-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.about-section:nth-child(1) { animation-delay: 0.3s; }
.about-section:nth-child(2) { animation-delay: 0.5s; }
.about-section:nth-child(3) { animation-delay: 0.7s; }
.about-section:nth-child(4) { animation-delay: 0.9s; }
.about-section:nth-child(5) { animation-delay: 1.1s; }
.about-section:nth-child(6) { animation-delay: 1.3s; }

.about-section h2 {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: var(--font-heading-sm);
    margin-bottom: var(--spacing-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, var(--opacity-very-high));
}

.about-section p {
    line-height: 1.6;
    margin-bottom: var(--spacing-xs);
    opacity: var(--opacity-high);
}

.about-section strong {
    color: rgba(255, 255, 255, var(--opacity-very-high));
    font-weight: 400;
}

.about-section ul {
    margin-left: var(--spacing-md);
    margin-bottom: var(--spacing-xs);
}

.about-section li {
    line-height: 1.6;
    margin-bottom: 8px;
    opacity: var(--opacity-high);
    position: relative;
}

.about-section li::before {
    content: "•";
    color: rgba(255, 255, 255, var(--opacity-medium));
    margin-right: 8px;
}

.about-note {
    text-align: center;
    margin-top: var(--spacing-xl);
    padding-top: var(--spacing-md);
    border-top: 1px solid rgba(255, 255, 255, var(--opacity-low));
    opacity: var(--opacity-medium);
    font-size: var(--font-sm);
}

/* АДАПТИВНОСТЬ ДЛЯ СТРАНИЦЫ "СВЕДЕНИЯ" */
@media (max-width: 768px) {
    .about-content {
        padding: var(--spacing-xl) var(--spacing-sm);
    }
    
    .about-container {
        padding: var(--spacing-lg);
    }
    
    .about-content h1 {
        font-size: var(--font-heading-lg);
    }
    
    .about-section h2 {
        font-size: var(--font-xl);
    }
    
    .about-section ul {
        margin-left: var(--spacing-sm);
    }
}

@media (max-width: 480px) {
    .about-container {
        padding: var(--spacing-md);
    }
    
    .about-content h1 {
        font-size: var(--font-heading-md);
    }
    
    .about-section {
        margin-bottom: var(--spacing-md);
        padding-bottom: var(--spacing-sm);
    }
}

@media (max-width: 480px) {
  .service-label {
    padding: 20px 10px 15px; /* Увеличиваем верхний паддинг */
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Добавляем небольшой отступ сверху для текста */
    padding-top: 25px;
  }
}

@media (max-width: 768px) {
  .service-label {
    padding: 20px 10px 15px; /* Увеличиваем верхний паддинг */
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Добавляем небольшой отступ сверху для текста */
    padding-top: 25px;
  }
}

/* ===== ИСПРАВЛЕНИЯ ДЛЯ ТЕЛЕФОНА ===== */

/* Исправление смещения текста в выборе дизайна */
@media (max-width: 480px) {
  .service-label {
    padding: 20px 10px 15px;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 25px;
  }
}

/* Исправление расположения префикса и поля ввода */
@media (max-width: 768px) {
  .contact-input-group {
    flex-direction: row;
    gap: 10px;
  }
  
  .messenger-prefix {
    min-width: 60px;
    padding: 12px 8px;
    font-size: var(--font-sm);
  }
}

@media (max-width: 480px) {
  .contact-input-group {
    flex-direction: row;
    gap: 8px;
  }
  
  .messenger-prefix {
    min-width: 50px;
    padding: 10px 6px;
    font-size: var(--font-xs);
  }
  
  .form-control {
    padding: 12px 15px;
  }
}

/* Исправление заголовка политики конфиденциальности */
.legal-content h1 {
    font-size: var(--font-heading-lg);
    letter-spacing: 0.08em;
    padding: 0 var(--spacing-sm);
    word-wrap: break-word;
}

@media (max-width: 768px) {
  .legal-content h1 {
    font-size: var(--font-heading-md);
    letter-spacing: 0.05em;
    padding: 0 var(--spacing-xs);
  }
}

@media (max-width: 480px) {
  .legal-content h1 {
    font-size: var(--font-heading-sm);
    letter-spacing: 0.03em;
    line-height: 1.3;
  }
}

/* ===== ИСПРАВЛЕНИЕ ТЕКСТА В КНОПКАХ ВЫБОРА УСЛУГ ===== */
@media (max-width: 480px) {
  .service-option {
    flex: 0 0 100%;
    max-width: 250px;
    margin: 0 auto;
  }
  
  .service-label {
    padding: 25px 15px 20px !important; /* Принудительно применяем паддинги */
    min-height: 85px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center;
    line-height: 1.3;
    /* Специфичные стили для выравнивания текста */
    padding-top: 20px !important;
    padding-bottom: 18px !important;
  }
  
  /* Убедимся, что текст не смещается вверх */
  .service-label span {
    display: block;
    margin-top: 5px; /* Добавляем отступ сверху для текста */
  }
}

/* Дополнительное исправление для очень маленьких экранов */
@media (max-width: 360px) {
  .service-label {
    padding: 22px 12px 18px !important;
    min-height: 80px !important;
    font-size: var(--font-md) !important;
  }
}

/* ===== СТИЛИ ДЛЯ ВЫБОРА БЮДЖЕТА ===== */
.budget-selection {
    display: flex;
    gap: var(--spacing-md);
    align-items: stretch;
}

.budget-input-wrapper {
    flex: 1;
}

.budget-input {
    width: 100%;
    height: 100%;
    text-align: center;
    font-size: var(--font-lg);
    font-weight: 300;
}

.currency-selection {
    display: flex;
    gap: var(--spacing-xs);
}

.currency-option {
    position: relative;
    cursor: pointer;
}

.currency-option input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.currency-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 15px 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, var(--opacity-low));
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
    min-width: 70px;
    height: 100%;
    text-align: center;
}

.currency-option input:checked + .currency-label {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, var(--opacity-medium));
    box-shadow: var(--shadow-glow);
}

.currency-symbol {
    font-size: var(--font-xl);
    font-weight: 300;
    margin-bottom: 4px;
}

.currency-name {
    font-size: var(--font-xs);
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: var(--opacity-high);
}

/* Адаптивность для выбора бюджета */
@media (max-width: 768px) {
    .budget-selection {
        flex-direction: column;
        gap: var(--spacing-sm);
    }
    
    .currency-selection {
        justify-content: center;
    }
    
    .currency-label {
        min-width: 60px;
        padding: 12px 8px;
    }
}

@media (max-width: 480px) {
    .currency-selection {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .currency-option {
        flex: 0 0 calc(33.333% - var(--spacing-xs));
    }
    
    .currency-label {
        min-width: auto;
        padding: 10px 6px;
    }
    
    .currency-symbol {
        font-size: var(--font-lg);
    }
    
    .currency-name {
        font-size: 0.75rem;
    }
}

/* ===== УБИРАЕМ СТРЕЛКИ У ЧИСЛОВОГО ПОЛЯ ===== */
.budget-input {
    /* Убираем стрелки в Chrome, Safari, Edge */
    -moz-appearance: textfield;
    appearance: textfield;
}

.budget-input::-webkit-outer-spin-button,
.budget-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Для Firefox */
.budget-input[type=number] {
    -moz-appearance: textfield;
}