/* Hindi localization of the existing Tamil guide directory/tutorial format. */
.hg-page { font-family: "Noto Sans Devanagari", "Nirmala UI", system-ui, sans-serif; }
.hg-page h1 { letter-spacing: 0; }
.hg-page .hero p { color: var(--ink); }
.hg-page ::selection { background: var(--primary-dark); color: var(--paper); }
.hg-page :focus-visible { outline: 3px solid var(--primary); outline-offset: 4px; }
.hg-page a { text-underline-offset: .2em; }
.hg-page .nav-links a:not(.btn) { display: inline-flex; align-items: center; min-height: 44px; }
.hg-page .nav-links [aria-current="page"] { color: var(--primary-dark); text-decoration: underline; }
.hg-page .nav-links .btn:hover { color: var(--paper); }
.hg-page .hg-directory > section { margin-block: 40px; }
.hg-page .hg-directory .guide-card h3 { margin: 14px 0 9px; font-size: 1.25rem; line-height: 1.45; }
.hg-page .hg-main { padding-bottom: 48px; }
.hg-page .article p { max-width: 74ch; }
.hg-page .step-list { padding: 0; list-style: none; }
.hg-page .toc a { display: flex; align-items: center; min-height: 44px; }
.hg-page figure.step-image-frame { margin: 24px 0; }
.hg-page figure img { width: 100%; height: auto; }
.hg-page .hg-note { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.hg-page .hg-links, .hg-page .footer-links { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.hg-page .hg-links a, .hg-page .footer-links a { display: inline-flex; align-items: center; min-height: 44px; }
.hg-page .site-footer .brand { color: var(--paper); }
.hg-page .footer-inner { align-items: flex-start; }
.hg-skip { position: fixed; left: 16px; top: 12px; z-index: 30; padding: 12px 20px; transform: translateY(-200%); background: var(--paper); color: var(--primary-dark); border: 1px solid var(--primary); border-radius: 8px; }
.hg-skip:focus { transform: translateY(0); }
@media (max-width: 640px) {
  .hg-page .nav-inner { flex-wrap: wrap; gap: 4px; padding-block: 12px; }
  .hg-page .nav-links { width: 100%; justify-content: space-between; gap: 8px; font-size: .9rem; }
  .hg-page .nav-links .btn { min-height: 44px; padding: 9px 12px; }
  .hg-page .article .tutorial-step-card { grid-template-columns: 44px minmax(0,1fr); padding: 18px; gap: 16px; }
  .hg-page .article .step-number { width: 44px; height: 44px; }
  .hg-page .footer-inner { flex-direction: column; gap: 16px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }