/* Desktop and large screens */
@media (min-width: 1024px) {
  .nav { display: flex; }
  .burger { display: none; }
  .hero__content { grid-template-columns: 1fr 1fr; }
  .results-form-grid { grid-template-columns: 1fr 1fr; }
  .lessons-grid { grid-template-columns: 1fr 1fr; }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {
  .site-header .header__inner { height: 70px; }
  .nav { display: none; }
  .burger { display: inline-flex; }
  
  .hero__content { 
    grid-template-columns: 1fr; 
    gap: 32px; 
    text-align: center;
  }
  
  .results-form-grid { 
    grid-template-columns: 1fr; 
    gap: 32px; 
    text-align: center;
  }
  
  .lessons-grid { 
    grid-template-columns: 1fr; 
    gap: 24px; 
  }
  
  .course-cover { 
    max-width: 400px; 
    margin: 0 auto; 
  }
}

/* Mobile */
@media (max-width: 767px) {
  :root { --header-h: 60px; }
  
  /* Предотвращение горизонтальной прокрутки */
  body { 
    overflow-x: hidden;
  }
  .container {
    padding-left: 16px;
    padding-right: 16px;
  }
  
  .logo img { height: 32px; }
  .header-cta { display: none; }
  .nav { display: none; }
  
  .header__inner { 
    align-items: center; 
    display: flex;
    justify-content: space-between;
  }
  
  .burger {
    display: inline-flex !important;
    position: relative;
    z-index: 1003;
    pointer-events: auto;
  }
  
  /* Section headers centered on mobile */
  #features .overline,
  #features .h2,
  #program .overline,
  #program .h2,
  .results-text-section .overline,
  .results-text-section .h2 {
    text-align: center;
    display: block;
  }
  
  .btn--lg { width: 100%; }
  
  .hero-section { 
    padding: 40px 0 60px; 
    min-height: 60vh;
  }
  
  .hero__content { 
    display: flex;
    flex-direction: column;
    gap: 24px; 
    text-align: center;
  }
  
  .hero-title { 
    font-size: clamp(24px, 6vw, 32px); 
    margin-bottom: 16px; 
  }
  
  .course-cover { 
    width: 100%;
    max-width: none;
    margin: 0 auto 24px auto;
  }
  
  .course-image {
    width: 100%;
    height: auto;
    border-radius: var(--radius-16);
  }
  
  .course-cover-desktop {
    display: none;
  }
  
  .course-cover-mobile {
    display: block;
    margin: 24px auto;
    max-width: none;
    width: 100%;
  }
  
  .form-title { 
    font-size: clamp(18px, 5vw, 22px); 
    margin-bottom: 16px; 
  }
  
  .section-title { 
    font-size: clamp(20px, 5vw, 28px); 
    margin-bottom: 24px; 
  }
  
  .features-list { 
    gap: 16px; 
  }
  
  .feature-item { 
    align-items: flex-start; 
    text-align: left;
  }
  
  .lessons-grid { 
    grid-template-columns: 1fr; 
    gap: 24px; 
  }
  
  .lessons-list li { 
    margin-bottom: 8px; 
  }
  
  .results-form-grid { 
    grid-template-columns: 1fr; 
    gap: 24px; 
    text-align: center;
  }
  
  .results-form .section-title { 
    text-align: center; 
  }
  
  .results-text-section {
    margin-bottom: 24px;
  }
  
  .results-form-block {
    padding: 24px;
  }
  
  .mobile-menu__cta {
    margin-top: 16px;
    width: 100%;
    justify-self: stretch;
  }
  
  .mobile-break {
    display: block;
  }
  
  .desktop-only {
    display: none;
  }

  /* Footer styles already unified for all screen sizes */
  
  .results-form-grid .course-cover {
    max-height: 200px;
    max-width: none;
    width: 100%;
    overflow: hidden;
  }
  
  .results-form-grid .course-image {
    object-fit: cover;
    height: 200px;
  }
}

/* Small Mobile Optimization (400px and below) */
@media (max-width: 400px) {
  .container {
    padding-left: 16px;
    padding-right: 16px;
  }
  
  /* Disable nowrap on narrow screens to prevent overflow */
  .nowrap-lg {
    white-space: normal !important;
  }
  
  /* Form optimizations */
  .hero-course-block { 
    padding: 20px 16px; 
  }
  
  .btn {
    padding: 12px 16px;
    font-size: var(--fs-body-sm);
  }
  
  .btn--lg {
    padding: 14px 20px;
  }
}

/* Ultra small screens (360px) */
@media (max-width: 360px) {
  .container { 
    padding-left: 12px;
    padding-right: 12px;
  }
  
  .hero-course-block { 
    padding: 16px 12px; 
  }
  
  .course-cover { 
    max-width: 240px; 
  }
  
  .form-title { 
    font-size: 18px; 
    margin-bottom: 12px; 
  }
  
  .feature-item { 
    gap: 8px; 
  }
  
  .feature-item svg { 
    width: 20px; 
    height: 20px; 
  }
  
  .lessons-list { 
    font-size: 14px; 
    padding-left: 16px; 
  }
  
  .results-text-section {
    margin-bottom: 20px;
  }
  
  .results-form-block {
    padding: 20px;
  }
}

/* Ultra small screens (320px exact) */
@media (max-width: 320px) {
  .container { 
    width: 100%;
  }
  
  .hero-course-block { 
    padding: 12px; 
  }
  
  .course-cover { 
    max-width: 200px; 
  }
  
  .hero-title { 
    font-size: 22px; 
    line-height: 1.2;
  }
  
  .form-title { 
    font-size: 16px; 
  }
  
  .results-text-section {
    margin-bottom: 16px;
  }
  
  .results-form-block {
    padding: 16px;
  }
  
  .section-title { 
    font-size: 20px; 
  }
  
  .feature-item { 
    font-size: 14px;
    gap: 6px; 
  }
  
  .lessons-list { 
    font-size: 13px; 
  }
  
  .form-fields-vertical { 
    gap: 12px; 
  }
  
  .btn--lg { 
    padding: 14px 20px; 
    font-size: 14px; 
  }
}

/* Ultra-wide screens optimizations */
@media (min-width: 1440px) {
  .hero__content { 
    gap: 60px; 
  }
  
  .results-form-grid { 
    gap: 60px; 
  }
  
  .lessons-grid { 
    gap: 60px; 
    max-width: 1000px; 
  }
}