/* Layout adjustments for longer English and Armenian copy. */
html[lang="en"],
html[lang="hy"] {
  hyphens: auto;
}

html[lang="en"] body,
html[lang="hy"] body {
  overflow-wrap: break-word;
}

html[lang="en"] h1,
html[lang="en"] h2,
html[lang="hy"] h1,
html[lang="hy"] h2 {
  text-wrap: balance;
}

html[lang="en"] p,
html[lang="en"] li,
html[lang="hy"] p,
html[lang="hy"] li {
  hyphens: auto;
  overflow-wrap: break-word;
}

html[lang="en"] .hero-grid,
html[lang="hy"] .hero-grid {
  gap: clamp(28px, 3.4vw, 48px);
  grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr);
}

html[lang="en"] .hero-copy,
html[lang="hy"] .hero-copy {
  max-width: 640px;
  min-width: 0;
}

html[lang="en"] .hero-copy p,
html[lang="hy"] .hero-copy p {
  line-height: 1.65;
  max-width: 620px;
  text-wrap: pretty;
}

@media (min-width: 1121px) {
  html[lang="en"] .hero-copy {
    max-width: 520px;
  }

  html[lang="en"] .hero-copy p {
    hyphens: none;
    max-width: 480px;
    overflow-wrap: normal;
  }
}

@media (min-width: 1121px) and (max-width: 1350px) {
  html[lang="en"] .hero-media {
    right: -72px;
    width: 60vw;
  }

  html[lang="en"] .hero-copy p {
    max-width: 460px;
  }
}

@media (min-width: 1121px) and (max-width: 1600px) {
  html[lang="en"] .hero-grid {
    gap: 28px;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr);
  }

  html[lang="en"] .hero-copy {
    max-width: 860px;
  }

  html[lang="en"] .hero-copy h1 {
    font-size: clamp(42px, 4vw, 54px);
    line-height: 1.12;
    max-width: 860px;
    text-wrap: balance;
    width: 100%;
  }

  html[lang="en"] .hero-copy h1 span {
    white-space: nowrap;
  }

  html[lang="en"] .hero-copy p {
    max-width: 800px;
  }

  html[lang="en"] .hero-media {
    right: -160px;
    width: min(52vw, 760px);
  }
}

html[lang="en"] .hero-actions .btn,
html[lang="hy"] .hero-actions .btn {
  align-items: center;
  gap: 10px;
  justify-content: center;
  line-height: 1.35;
  text-align: center;
}

html[lang="en"] .section-head p,
html[lang="hy"] .section-head p,
html[lang="en"] .about-copy p,
html[lang="hy"] .about-copy p {
  line-height: 1.7;
  max-width: 900px;
  text-wrap: pretty;
}

html[lang="en"] .course-hero-grid,
html[lang="hy"] .course-hero-grid {
  max-width: 820px;
}

html[lang="en"] .course-hero p,
html[lang="hy"] .course-hero p,
html[lang="en"] .instructors-hero p,
html[lang="hy"] .instructors-hero p {
  line-height: 1.65;
  max-width: 780px;
  text-wrap: pretty;
}

html[lang="en"] .course-programs-head,
html[lang="hy"] .course-programs-head {
  max-width: 920px;
}

html[lang="en"] .course-plan-card,
html[lang="hy"] .course-plan-card,
html[lang="en"] .mentor-card,
html[lang="hy"] .mentor-card,
html[lang="en"] .tariff-card,
html[lang="hy"] .tariff-card {
  min-width: 0;
}

html[lang="en"] .price-hero-inner,
html[lang="hy"] .price-hero-inner {
  max-width: 920px;
}

html[lang="en"] .price-hero h1,
html[lang="hy"] .price-hero h1,
html[lang="en"] .instructors-hero h1,
html[lang="hy"] .instructors-hero h1 {
  text-wrap: balance;
}

html[lang="en"] .price-hero p,
html[lang="hy"] .price-hero p {
  line-height: 1.65;
  max-width: 840px;
}

/* Keep package cards in three columns on wide screens, then stack responsively. */
@media (min-width: 1121px) {
  html[lang="en"] .price-cards-grid,
  html[lang="hy"] .price-cards-grid {
    gap: clamp(18px, 2vw, 32px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html[lang="en"] .tariff-card,
  html[lang="en"] .tariff-card-featured,
  html[lang="hy"] .tariff-card,
  html[lang="hy"] .tariff-card-featured {
    padding: clamp(24px, 3vw, 42px);
  }
}

html[lang="en"] .test-hero-copy,
html[lang="hy"] .test-hero-copy,
html[lang="en"] .exam-hero-copy,
html[lang="hy"] .exam-hero-copy {
  max-width: 900px;
  min-width: 0;
}

html[lang="en"] .test-hero p,
html[lang="hy"] .test-hero p,
html[lang="en"] .exam-hero p,
html[lang="hy"] .exam-hero p,
html[lang="en"] .test-section-head p,
html[lang="hy"] .test-section-head p {
  line-height: 1.65;
  max-width: 880px;
  text-wrap: pretty;
}

html[lang="en"] .test-section-head,
html[lang="hy"] .test-section-head,
html[lang="en"] .theory-heading,
html[lang="hy"] .theory-heading {
  max-width: 1040px;
}

html[lang="en"] .theory-topic strong,
html[lang="hy"] .theory-topic strong,
html[lang="en"] .test-card-link,
html[lang="hy"] .test-card-link {
  hyphens: auto;
  overflow-wrap: break-word;
}

html[lang="en"] .faq-category-btn,
html[lang="hy"] .faq-category-btn {
  height: auto;
  line-height: 1.4;
  min-height: 72px;
  padding-block: 14px;
}

html[lang="en"] .faq-main .faq-item.open .faq-content,
html[lang="hy"] .faq-main .faq-item.open .faq-content {
  max-height: 1200px;
}

html[lang="en"] .faq-main .faq-content,
html[lang="hy"] .faq-main .faq-content,
html[lang="en"] .faq-main-toggle,
html[lang="hy"] .faq-main-toggle {
  min-width: 0;
  overflow-wrap: break-word;
  text-wrap: pretty;
}

html[lang="en"] .legal-document,
html[lang="hy"] .legal-document,
html[lang="en"] .legal-nav,
html[lang="hy"] .legal-nav {
  min-width: 0;
}

html[lang="en"] .instructor-modal-content,
html[lang="hy"] .instructor-modal-content,
html[lang="en"] .instructor-modal-role,
html[lang="hy"] .instructor-modal-role,
html[lang="en"] .instructor-modal-bio,
html[lang="hy"] .instructor-modal-bio,
html[lang="en"] .instructor-modal-fact strong,
html[lang="hy"] .instructor-modal-fact strong,
html[lang="en"] .instructor-modal-actions small,
html[lang="hy"] .instructor-modal-actions small {
  hyphens: auto;
  overflow-wrap: break-word;
}

html[lang="en"] .legal-section p,
html[lang="en"] .legal-section li,
html[lang="hy"] .legal-section p,
html[lang="hy"] .legal-section li {
  line-height: 1.7;
  text-wrap: pretty;
}

@media (max-width: 1120px) {
  html[lang="en"] .hero-grid,
  html[lang="hy"] .hero-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  html[lang="en"] .hero-copy,
  html[lang="hy"] .hero-copy {
    max-width: 780px;
  }

  html[lang="en"] .price-cards-grid,
  html[lang="hy"] .price-cards-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  html[lang="en"] .course-hero-grid,
  html[lang="hy"] .course-hero-grid {
    max-width: 780px;
  }
}

@media (max-width: 760px) {
  html[lang="en"] .hero-copy h1,
  html[lang="hy"] .hero-copy h1,
  html[lang="en"] .price-hero h1,
  html[lang="hy"] .price-hero h1,
  html[lang="en"] .instructors-hero h1,
  html[lang="hy"] .instructors-hero h1,
  html[lang="en"] .course-hero h1,
  html[lang="hy"] .course-hero h1,
  html[lang="en"] .test-hero h1,
  html[lang="hy"] .test-hero h1 {
    font-size: clamp(30px, 8vw, 40px);
    line-height: 1.16;
    text-wrap: balance;
  }

  html[lang="en"] .hero-copy p,
  html[lang="hy"] .hero-copy p,
  html[lang="en"] .course-hero p,
  html[lang="hy"] .course-hero p,
  html[lang="en"] .price-hero p,
  html[lang="hy"] .price-hero p,
  html[lang="en"] .instructors-hero p,
  html[lang="hy"] .instructors-hero p,
  html[lang="en"] .test-hero p,
  html[lang="hy"] .test-hero p {
    font-size: 16px;
    line-height: 1.6;
  }

  html[lang="en"] .hero-actions,
  html[lang="hy"] .hero-actions {
    align-items: stretch;
    flex-direction: column;
  }

  html[lang="en"] .hero-actions .btn,
  html[lang="hy"] .hero-actions .btn {
    min-height: 52px;
    padding: 12px 18px;
    width: 100%;
  }

  html[lang="en"] .faq-category-btn,
  html[lang="hy"] .faq-category-btn {
    min-height: 60px;
    padding: 12px 16px;
  }

  html[lang="en"] .faq-main-toggle,
  html[lang="hy"] .faq-main-toggle {
    font-size: 16px;
    line-height: 1.45;
    padding: 18px;
  }

  html[lang="en"] .faq-main .faq-content,
  html[lang="hy"] .faq-main .faq-content {
    font-size: 15px;
    line-height: 1.6;
    padding-left: 18px;
    padding-right: 18px;
  }
}

html[lang="hy"] .hero-copy h1 {
  font-size: clamp(40px, 4.2vw, 58px);
  line-height: 1.12;
  max-width: 720px;
  overflow-wrap: normal;
  text-wrap: balance;
}

@media (max-width: 1120px) {
  html[lang="hy"] .hero-copy h1 {
    font-size: clamp(38px, 5vw, 46px);
    line-height: 1.15;
  }
}

@media (max-width: 760px) {
  html[lang="hy"] .hero-copy h1 {
    font-size: clamp(28px, 8vw, 36px);
    line-height: 1.16;
    max-width: 100%;
  }
}

@media (max-width: 420px) {
  html[lang="en"] .container,
  html[lang="hy"] .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  html[lang="en"] .hero-copy h1,
  html[lang="hy"] .hero-copy h1,
  html[lang="en"] .price-hero h1,
  html[lang="hy"] .price-hero h1,
  html[lang="en"] .instructors-hero h1,
  html[lang="hy"] .instructors-hero h1,
  html[lang="en"] .course-hero h1,
  html[lang="hy"] .course-hero h1,
  html[lang="en"] .test-hero h1,
  html[lang="hy"] .test-hero h1 {
    font-size: 30px;
  }
}

/* Armenian copy needs a little more line length to stay easy to scan. */
html[lang="hy"] .section-head p,
html[lang="hy"] .faq-main-head p {
  max-width: 1020px;
}

html[lang="hy"] .about-inner {
  max-width: 1240px;
}

html[lang="hy"] .about-copy p {
  max-width: none;
}

html[lang="hy"] .course-hero-grid {
  max-width: 900px;
}

html[lang="hy"] .course-hero p,
html[lang="hy"] .instructors-hero p {
  max-width: 860px;
}

html[lang="hy"] .instructors-hero-copy {
  max-width: 860px;
}

html[lang="hy"] .price-hero-inner {
  max-width: 1040px;
}

html[lang="hy"] .price-hero p {
  max-width: 960px;
}

html[lang="hy"] .test-hero-copy,
html[lang="hy"] .exam-hero-copy {
  max-width: 1020px;
}

html[lang="hy"] .test-hero p,
html[lang="hy"] .exam-hero p,
html[lang="hy"] .test-section-head p {
  max-width: 980px;
}

html[lang="hy"] .test-section-head,
html[lang="hy"] .theory-heading {
  max-width: 1120px;
}

html[lang="hy"] .legal-hero-inner {
  max-width: 1080px;
}

html[lang="hy"] .legal-lead {
  max-width: 960px;
}

@media (min-width: 1121px) {
  html[lang="hy"] .hero-grid {
    grid-template-columns: minmax(0, 1.26fr) minmax(0, 0.74fr);
  }

  html[lang="hy"] .hero-copy {
    max-width: 860px;
  }

  html[lang="hy"] .hero-copy h1 {
    font-size: clamp(42px, 4vw, 54px);
    max-width: 860px;
    width: 100%;
  }

  html[lang="hy"] .hero-copy p {
    max-width: 800px;
  }

  html[lang="hy"] .hero-media {
    right: clamp(-250px, -15vw, -150px);
    width: min(62vw, 900px);
  }
}

@media (max-width: 1120px) {
  html[lang="hy"] .hero-copy,
  html[lang="hy"] .course-hero-grid,
  html[lang="hy"] .instructors-hero-copy,
  html[lang="hy"] .test-hero-copy,
  html[lang="hy"] .exam-hero-copy {
    max-width: 920px;
  }

  html[lang="hy"] .hero-copy h1 {
    max-width: 100%;
    width: 100%;
  }
}

@media (max-width: 760px) {
  html[lang="hy"] .hero-copy,
  html[lang="hy"] .hero-copy p,
  html[lang="hy"] .course-hero-grid,
  html[lang="hy"] .course-hero p,
  html[lang="hy"] .instructors-hero-copy,
  html[lang="hy"] .instructors-hero p,
  html[lang="hy"] .price-hero-inner,
  html[lang="hy"] .price-hero p,
  html[lang="hy"] .test-hero-copy,
  html[lang="hy"] .test-hero p,
  html[lang="hy"] .legal-hero-inner,
  html[lang="hy"] .legal-lead {
    max-width: 100%;
  }
}