/* ==========================================================
   ISHVAANA — Typography
   Display serif (Cormorant Garamond) for headings, paired with a
   clean, airy sans (Inter) for body copy, navigation and UI.
   Font files are loaded via <link> tags in index.html's <head>.

   --font-quote is an alias back to --font-display (Cormorant), used
   by the pull-quote and footer tagline. */

:root {
  --font-display: "Cormorant Garamond", "Times New Roman", serif;
  --font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-quote: var(--font-display);
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.7;
  letter-spacing: 0.01em;
}

h1, h2, h3, h4,
.font-display {
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: 0.01em;
  /* Every heading's spacing is set deliberately elsewhere (.divider,
     margin-bottom on the elements around it) — without this, the
     browser's own default heading margin was the one unstyled gap in
     the system, and it's what threw Introduction's h1 out of
     alignment with the sticky image beside it once the eyebrow label
     above it (which used to absorb that margin) was removed. */
  margin: 0;
}

h1, .h1 {
  font-size: clamp(1.925rem, 2.24vw + 1.26rem, 3.85rem);
  font-weight: 500;
}

h2, .h2 {
  font-size: clamp(2.1rem, 2vw + 1.4rem, 3.4rem);
}

h3, .h3 {
  font-size: clamp(1.5rem, 1vw + 1.1rem, 2rem);
}

/* A little tracking on section titles — an "engraved" quality that
   read as more formal/luxury in a comparison against palaisroyal.hk
   (whose headings measured ~0.2em; dialed back here since Cormorant
   Garamond carries more contrast/swash than their thinner display
   face, so tracking it that far looked mannered rather than refined). */
h2, .h2 {
  letter-spacing: 0.05em;
}
h3, .h3 {
  letter-spacing: 0.04em;
}

.eyebrow {
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

p {
  margin: 0 0 1.2em;
}

/* .lede carries no size of its own any more — every plain paragraph
   in a section (the opening line included) now reads at the same
   size, so the only text that reads larger/different is a genuine
   heading or an intentional accent line (a closing quote, a
   pull-quote, etc.), never a second body paragraph by accident. */

.pull-quote {
  font-family: var(--font-quote);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.3rem, 1vw + 1.05rem, 1.7rem);
  line-height: 1.5;
}

a {
  color: inherit;
  text-decoration: none;
}

.tracked {
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.78rem;
  font-weight: 600;
}