/* Pages in Indian languages (/hi/, /bn/, /ta/...). Loaded after site.css
   and page.css on every page that is not English.

   Indian scripts stack vowel signs above and below the letters, and several
   (Devanagari, Bengali, Gurmukhi) hang letters from a line along the top.
   So they need what Latin does not: no letter-spacing (any tracking breaks
   letters and that top line apart), taller lines, and headline masks with
   room above and below. */

/* Headlines in a Noto serif cut for each script, so they sit beside
   Fraunces. Latin, digits and the rupee sign still come from Fraunces,
   which is listed first. A face only downloads on a page that uses it. */
@font-face { font-family: "Noto Serif Devanagari"; src: url("../assets/fonts/noto-serif-devanagari.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Noto Serif Bengali"; src: url("../assets/fonts/noto-serif-bengali.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+25CC, U+A8F1; }
@font-face { font-family: "Noto Serif Tamil"; src: url("../assets/fonts/noto-serif-tamil.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0964-0965, U+0B82-0BFA, U+200C-200D, U+25CC; }
@font-face { font-family: "Noto Serif Telugu"; src: url("../assets/fonts/noto-serif-telugu.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0951-0952, U+0964-0965, U+0C00-0C7F, U+1CDA, U+1CF2, U+200C-200D, U+25CC; }
@font-face { font-family: "Noto Serif Gujarati"; src: url("../assets/fonts/noto-serif-gujarati.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0951-0952, U+0964-0965, U+0A80-0AFF, U+200C-200D, U+25CC, U+A830-A839; }
@font-face { font-family: "Noto Serif Kannada"; src: url("../assets/fonts/noto-serif-kannada.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0951-0952, U+0964-0965, U+0C80-0CF3, U+1CD0, U+1CD2-1CD3, U+1CDA, U+1CF2, U+1CF4, U+200C-200D, U+25CC, U+A830-A835; }
@font-face { font-family: "Noto Serif Malayalam"; src: url("../assets/fonts/noto-serif-malayalam.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0307, U+0323, U+0951-0952, U+0964-0965, U+0D00-0D7F, U+1CDA, U+1CF2, U+200C-200D, U+25CC, U+A830-A832; }
@font-face { font-family: "Noto Serif Gurmukhi"; src: url("../assets/fonts/noto-serif-gurmukhi.woff2") format("woff2"); font-weight: 400 800; font-display: swap;
  unicode-range: U+0951-0952, U+0964-0965, U+0A01-0A76, U+200C-200D, U+25CC, U+262C, U+A830-A839; }
@font-face { font-family: "Noto Serif Oriya"; src: url("../assets/fonts/noto-serif-oriya.woff2") format("woff2"); font-weight: 400 700; font-display: swap;
  unicode-range: U+0951-0952, U+0964-0965, U+0B01-0B77, U+1CDA, U+1CF2, U+200C-200D, U+25CC; }

:root {
  --serif-rest: "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --body: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Nirmala UI", sans-serif;
}
/* Each page names only its own script's face, so it fetches only that one. */
:root:lang(hi), :root:lang(mr) { --display: "Fraunces", "Noto Serif Devanagari", var(--serif-rest); }
:root:lang(bn), :root:lang(as) { --display: "Fraunces", "Noto Serif Bengali", var(--serif-rest); }
:root:lang(ta) { --display: "Fraunces", "Noto Serif Tamil", var(--serif-rest); }
:root:lang(te) { --display: "Fraunces", "Noto Serif Telugu", var(--serif-rest); }
:root:lang(gu) { --display: "Fraunces", "Noto Serif Gujarati", var(--serif-rest); }
:root:lang(kn) { --display: "Fraunces", "Noto Serif Kannada", var(--serif-rest); }
:root:lang(ml) { --display: "Fraunces", "Noto Serif Malayalam", var(--serif-rest); }
:root:lang(pa) { --display: "Fraunces", "Noto Serif Gurmukhi", var(--serif-rest); }
:root:lang(or) { --display: "Fraunces", "Noto Serif Oriya", var(--serif-rest); }

body { line-height: 1.7; }

/* Tracking off everywhere, including the small upper-case labels. This
   sheet only loads on these pages, so the blanket rule is safe. */
*, *::before, *::after { letter-spacing: normal !important; }
/* Upper case would only catch the English words inside the labels
   ("WHATSAPP पर"), so it goes too. */
*, *::before, *::after { text-transform: none !important; }

/* These scripts have no italic; the browser would only slant them. */
em, i, q, cite, .msg--voice q { font-style: normal; }

h1, h2, h3, h4 { line-height: 1.3; }
/* Some words run very long (Tamil, Malayalam); on a phone a word wider than
   the screen wraps instead of spilling over the edge. */
h1, h2, h3, h4 { overflow-wrap: break-word; }

/* Hero: words run wider than English ones, so a notch smaller. */
.hero__title { font-size: clamp(2.4rem, 7.4vw, 5.8rem); line-height: 1.1; }
@media (min-width: 1100px) {
  .hero__title { font-size: clamp(2.4rem, 5.6vw, 5.2rem); }
}
@media (min-width: 1100px) and (max-width: 1299px) {
  .hero__title { font-size: 5vw; }
}
/* Tamil, Malayalam and Kannada words run longest of all, and the Punjabi,
   Odia and Assamese first lines (ਤੁਹਾਡਾ ਨਵਾਂ ਮੁਲਾਜ਼ਮ, ଆପଣଙ୍କ ନୂଆ କର୍ମଚାରୀ,
   আপোনাৰ নতুন কৰ্মচাৰী) are long: a further notch. */
:root:lang(ta) .hero__title, :root:lang(ml) .hero__title, :root:lang(kn) .hero__title, :root:lang(pa) .hero__title, :root:lang(or) .hero__title, :root:lang(as) .hero__title { font-size: clamp(2.2rem, 6.8vw, 5.3rem); }
@media (min-width: 1100px) {
  :root:lang(ta) .hero__title, :root:lang(ml) .hero__title, :root:lang(kn) .hero__title, :root:lang(pa) .hero__title, :root:lang(or) .hero__title, :root:lang(as) .hero__title { font-size: clamp(2.2rem, 4.2vw, 4.1rem); }
}
@media (min-width: 1100px) and (max-width: 1299px) {
  :root:lang(ta) .hero__title, :root:lang(ml) .hero__title, :root:lang(kn) .hero__title, :root:lang(pa) .hero__title, :root:lang(or) .hero__title, :root:lang(as) .hero__title { font-size: 3.9vw; }
}
/* Malayalam, the widest, one more on larger screens. */
:root:lang(ml) .hero__title { font-size: clamp(2.1rem, 6.2vw, 4.6rem); }
@media (min-width: 1100px) {
  :root:lang(ml) .hero__title { font-size: clamp(2.1rem, 3.7vw, 3.6rem); }
}
@media (min-width: 1100px) and (max-width: 1299px) {
  :root:lang(ml) .hero__title { font-size: 3.4vw; }
}
/* Room inside each rising mask for the vowel signs above and below. The
   whole extra height is taken back as one bottom margin: a top and a bottom
   margin between two lines would collapse into one and leave a gap. */
.line { padding-block: .16em .24em; margin-block: 0 -.4em; }
.line:first-child { margin-top: -.16em; }
.line:last-child { margin-bottom: -.24em; }

.story.is-pinned .job h3 { line-height: 1.2; }
.closing h2, .cta h2 { line-height: 1.22; }
.phero h1 { line-height: 1.2; }
.footer__mark { line-height: 1.3; }
.agent__tag, .how__line, .mix { line-height: 1.4; }
/* Chat headers stack the name over "online"; at Latin line height the name
   hides the signs on top of the second line (ऑनलाइन). */
.wa__bar b, .wa__bar span, .phone__bar b, .phone__bar span { line-height: 1.5; }

/* The small labels were sized for spaced-out capitals; these scripts read
   better a little larger instead. */
.phero__kicker, .hub__group, .hello__name, .price__name,
.footer__cols h2, .phone__notif b { font-size: .95rem; }

/* The sticker's centre ("3 days / free") in the scripts whose words for
   "days" run long, so it clears the ring of text around it. */
:root:lang(te) .price__sticker span, :root:lang(ta) .price__sticker span,
:root:lang(kn) .price__sticker span, :root:lang(ml) .price__sticker span,
:root:lang(gu) .price__sticker span { font-size: .82rem; }
:root:lang(te) .price__sticker b, :root:lang(ta) .price__sticker b,
:root:lang(kn) .price__sticker b, :root:lang(ml) .price__sticker b,
:root:lang(gu) .price__sticker b { font-size: 1.12rem; }
:root:lang(ml) .price__sticker b { font-size: .95rem; }

/* Paragraphs: a touch more room between lines. */
.faq details p, .lede, .hero__lede { line-height: 1.75; }