/**
 * Global i18n typography: balanced wrapping + RU/HY density tweaks.
 * Loaded after page styles so :lang() rules tune heading sizes.
 */

/* ── Balanced line breaks (supported in Chromium / Safari recent) ── */
h1,
h2,
h3,
.page-title,
.hero-headline,
.hero-title,
.section-title,
.sec-h,
.cta-h,
.step-title,
.login-title,
.pillar-title,
.prob-h,
.success-h,
.pricing-ot-headline {
  text-wrap: balance;
}

/* Pretty fallback where balance is unsupported */
@supports not (text-wrap: balance) {
  h1,
  h2,
  h3,
  .page-title,
  .hero-headline,
  .hero-title,
  .section-title,
  .sec-h,
  .cta-h,
  .step-title,
  .login-title,
  .pillar-title,
  .prob-h,
  .success-h,
  .pricing-ot-headline {
    text-wrap: pretty;
  }
}

/* ── Russian: ~16–18% smaller display headings, looser leading ── */
html:lang(ru) h1,
html:lang(ru) .page-title,
html:lang(ru) .hero-headline {
  font-size: 67px;
  line-height: 0.96;
  letter-spacing: -0.008em;
}

html:lang(ru) .sec-h {
  font-size: 35px;
  line-height: 1.12;
}

html:lang(ru) .sec-h--portal {
  font-size: 32px !important;
  line-height: 1.1;
}

html:lang(ru) .cta-h {
  font-size: 43px;
  line-height: 1.02;
}

html:lang(ru) .login-title {
  font-size: 37px;
  line-height: 0.98;
}

html:lang(ru) .pillar-title {
  font-size: 33px;
  line-height: 1.08;
}

html:lang(ru) .prob-h {
  font-size: 32px;
  line-height: 1.12;
}

html:lang(ru) .success-h {
  font-size: 27px;
  line-height: 1.1;
}

html:lang(ru) .pricing-ot-headline {
  font-size: 27px;
  line-height: 1.12;
}

/* How it works: large step headings (detail sections) */
html:lang(ru) section.step .step-title {
  font-size: 43px;
  line-height: 0.96;
}

html:lang(ru) .steps .step-title {
  font-size: 15px;
  line-height: 1.25;
}

html:lang(ru) .auth-main h1 {
  font-size: 30px;
  line-height: 1.05;
}

@media (max-width: 768px) {
  html:lang(ru) h1,
  html:lang(ru) .page-title,
  html:lang(ru) .hero-headline {
    font-size: 44px;
    line-height: 0.98;
  }

  html:lang(ru) section.step .step-title {
    font-size: 34px;
    line-height: 0.98;
  }
}

@media (max-width: 900px) {
  html:lang(ru) .hero-headline {
    font-size: 44px;
    line-height: 0.98;
  }
}

/* ── Armenian: same density treatment as Russian ── */
html:lang(hy) h1,
html:lang(hy) .page-title,
html:lang(hy) .hero-headline {
  font-size: 67px;
  line-height: 0.96;
  letter-spacing: -0.008em;
}

html:lang(hy) .sec-h {
  font-size: 35px;
  line-height: 1.12;
}

html:lang(hy) .sec-h--portal {
  font-size: 32px !important;
  line-height: 1.1;
}

html:lang(hy) .cta-h {
  font-size: 43px;
  line-height: 1.02;
}

html:lang(hy) .login-title {
  font-size: 37px;
  line-height: 0.98;
}

html:lang(hy) .pillar-title {
  font-size: 33px;
  line-height: 1.08;
}

html:lang(hy) .prob-h {
  font-size: 32px;
  line-height: 1.12;
}

html:lang(hy) .success-h {
  font-size: 27px;
  line-height: 1.1;
}

html:lang(hy) .pricing-ot-headline {
  font-size: 27px;
  line-height: 1.12;
}

html:lang(hy) section.step .step-title {
  font-size: 43px;
  line-height: 0.96;
}

html:lang(hy) .steps .step-title {
  font-size: 15px;
  line-height: 1.25;
}

html:lang(hy) .auth-main h1 {
  font-size: 30px;
  line-height: 1.05;
}

@media (max-width: 768px) {
  html:lang(hy) h1,
  html:lang(hy) .page-title,
  html:lang(hy) .hero-headline {
    font-size: 44px;
    line-height: 0.98;
  }

  html:lang(hy) section.step .step-title {
    font-size: 34px;
    line-height: 0.98;
  }
}

@media (max-width: 900px) {
  html:lang(hy) .hero-headline {
    font-size: 44px;
    line-height: 0.98;
  }
}

/* ═══ WCAG 2.1 AA — contrast, focus, placeholders, tap targets (loaded after page :root) ═══ */

/* Muted text token: was #4E4B47 (~2.28:1 on #0a0a0a ✗) → #9a9590 (~6.67:1 on #0a0a0a ✓ AA) */
:root {
  --t3: #9a9590;
  --color-text-muted: #9a9590;
  --color-placeholder: #8a8680; /* on #181818 input bg ~4.91:1 ✓ AA */
  --color-border-ui: #4a4a4a; /* ~3.2:1 vs #181818 ✓ non-text UI */
}

main {
  display: block;
}

/* Footer on #0a0a0a: body #c8c8c8 ~11.8:1 ✓ AA; links underlined + lighter */
footer .foot-copy,
footer .foot-col-title,
footer .lang-btn {
  color: #c8c8c8;
}

footer .foot-link {
  color: #d4d4d4; /* ~13.4:1 on #0a0a0a ✓ AA */
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  font-weight: 400;
}

footer .foot-link:hover {
  color: #f0ede7;
}

footer .foot-link--accent {
  color: #7ec4f0; /* ~10.4:1 on #0a0a0a ✓ AA — accent link in footer */
  text-decoration: underline;
  text-underline-offset: 3px;
}

footer .foot-legal a {
  color: #b8dfff; /* ~14.2:1 on #0a0a0a ✓ AA */
  text-decoration: underline;
  text-underline-offset: 3px;
}

footer .foot-legal a:hover {
  color: #e8f4ff;
}

/* Login / auth footers */
.login-footer .lf-text {
  color: #c8c8c8;
}

.login-footer .lf-link {
  color: #b8dfff;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.login-footer .lf-link:hover {
  color: #e8f4ff;
}

/* Placeholders — enforce readable gray on dark inputs */
input::placeholder,
textarea::placeholder,
.form-input::placeholder,
.form-textarea::placeholder {
  color: var(--color-placeholder, #8a8680);
  opacity: 1;
}

/* Focus visible — UI component 3:1 outline vs page bg */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
.nav-login:focus-visible,
.nav-cta:focus-visible,
.foot-link:focus-visible,
.faq-q:focus-visible {
  outline: 2px solid #f0ede7;
  outline-offset: 2px;
}

.nav-ham:focus-visible {
  outline: 2px solid #f0ede7;
  outline-offset: 2px;
}

/* Hamburger hit target ≥44×44 (WCAG 2.5.5 target size) */
button.nav-ham {
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

/* Nav drawer links — taller tap targets on narrow viewports */
@media (max-width: 1024px) {
  .nav-drawer a {
    min-height: 44px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
  }

  /* Body copy ≥14px where pages used 13px helpers */
  .form-input,
  .form-textarea,
  .form-select,
  textarea.form-input {
    font-size: max(14px, 0.8125rem);
  }

  p.page-sub,
  p.hero-sub,
  .sec-sub,
  .cta-sub,
  .cta-note,
  .prob-body,
  .pillar-body,
  .step-body,
  .svc-body,
  .contact-main p,
  .legal-body p {
    font-size: max(14px, 1em);
    line-height: 1.5;
  }

  .proof-label,
  .form-label,
  .foot-copy {
    font-size: max(11px, 12px);
  }
}

input:disabled,
textarea:disabled,
select:disabled,
button:disabled {
  color: #9a9590; /* ≥3:1 vs typical #111–#181818 ✓ */
  opacity: 1;
}

/* FAQ chevron — was #4E4B47 (fails); #9a9590 ~6.67:1 on #111 ✓ */
.faq-arrow path {
  stroke: #9a9590;
}
