/* =============================================================================
   Devanagari typography
   -----------------------------------------------------------------------------
   Loaded after tune.css.

   The heading rules in tune.css set letter-spacing: -0.021em. On Latin text
   that tightens a large heading nicely. On Devanagari it is actively harmful:
   the script positions vowel signs relative to their base consonant, and
   forcing extra tracking between glyphs drags the matra away from the letter
   it belongs to. "आपकी कुंडली" ends up reading as "आपकों कुंडलों" — the matras
   land on the wrong consonants.

   The same applies to word-spacing and to any font-feature-settings inherited
   from the numeric rules, so all three are reset wherever Devanagari appears.

   This was a real defect introduced by the typography tuning, not a font
   problem on the reader's machine.
   ========================================================================== */

/* Devanagari is never letter-spaced. There is no correct negative value. */
[lang="hi"],
[lang="hi"] *,
:lang(hi),
:lang(hi) * {
    letter-spacing: normal !important;
    word-spacing: normal !important;
    font-feature-settings: normal;
    font-variant-ligatures: normal;
}

/* Devanagari sits lower and needs more room between lines than Latin at the
   same size — the matras occupy space above and below the x-height that Latin
   simply does not use. Without this, stacked matras from consecutive lines
   collide. */
[lang="hi"] h1, :lang(hi) h1,
[lang="hi"] h2, :lang(hi) h2,
[lang="hi"] h3, :lang(hi) h3,
[lang="hi"] .display, :lang(hi) .display {
    line-height: 1.35;
}

[lang="hi"] p, :lang(hi) p,
[lang="hi"] li, :lang(hi) li,
[lang="hi"] td, :lang(hi) td {
    line-height: 1.85;
}

/* An explicit Devanagari stack, so the browser picks a font built for the
   script rather than falling back from a Latin display face. Noto Sans
   Devanagari first where present; the rest are the defaults shipped with
   Windows, macOS, Android and common Linux distributions in that order. */
:root {
    --font-devanagari:
        "Noto Sans Devanagari",
        "Nirmala UI",
        "Kohinoor Devanagari",
        "Noto Serif Devanagari",
        "Mangal",
        "Lohit Devanagari",
        "Samyak Devanagari",
        sans-serif;
}

[lang="hi"], :lang(hi) {
    font-family: var(--font-devanagari);
}

/* Headings keep the site's display face for Latin characters and fall through
   to the Devanagari stack for the rest, so a mixed heading stays consistent. */
[lang="hi"] h1, :lang(hi) h1,
[lang="hi"] h2, :lang(hi) h2,
[lang="hi"] .display, :lang(hi) .display,
[lang="hi"] .grad-text, :lang(hi) .grad-text {
    /* The display face is deliberately absent. Listing it first meant
       the browser took base consonants from a Latin serif that has no
       mark-attachment tables, leaving every matra unpositioned. */
    font-family: var(--font-devanagari);
}

/* Hindi runs longer than English for the same meaning — often 15 to 20 per
   cent more characters. A heading capped at 18ch in tune.css wraps badly. */
[lang="hi"] .section:first-of-type h1,
:lang(hi) .section:first-of-type h1,
[lang="hi"] .hero h1,
:lang(hi) .hero h1 {
    max-width: 24ch;
}

@media (min-width: 900px) {
    [lang="hi"] .section:first-of-type h1,
    :lang(hi) .section:first-of-type h1 {
        max-width: 28ch;
    }
}

/* =============================================================================
   Chart glyphs
   ========================================================================== */

/* Sizes now come from the SVG itself in viewBox units so they scale with the
   chart. Any font-size here would override that and reintroduce the overlap. */
.chakra__graha {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0;
    fill: var(--marigold, #FFC93C);
    dominant-baseline: middle;
}

.chakra__house {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 500;
    letter-spacing: 0;
    fill: var(--text-faint, #8b8b9a);
    opacity: 0.65;
    dominant-baseline: middle;
}

.chakra__frame {
    fill: none;
    stroke: url(#chakraGrad);
    stroke-width: 0.7;
}

.chakra__inner {
    fill: none;
    stroke: var(--border, #2a2a3a);
    stroke-width: 0.5;
}

/* =============================================================================
   Table readability
   ========================================================================== */

/* Tabular figures were being applied through a descendant selector that also
   caught Devanagari cells. Restrict it to the numeric columns. */
.table td.num, .table th.num, .figure {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

.table td:not(.num), .table th:not(.num) {
    font-feature-settings: normal;
}