/* ==========================================================================
   POLICY PAGES — the previous site's design, rebuilt from its own tokens
   --------------------------------------------------------------------------
   /privacy-policy, /refund-policy, /terms-and-conditions.

   These three documents lived on the previous jeevmedia.net site, a Zyro
   (now Hostinger) builder site that has since been deleted. They were not
   carried into this repo when the site was rebuilt as a single page, and a
   domain-wide 301 on .net to the .com ROOT then made the old URLs
   unreachable — every request landed on the new homepage instead.

   NOTHING HERE IS INVENTED. The builder's two compiled stylesheets
   (/_astro-1775395358687/_slug_.*.css) were never archived and are gone with
   the account, but they turned out not to be needed: the old pages carried
   the whole design as 158 CSS custom properties inline on <main>, and the
   Internet Archive captured that. Every size, weight, line height, family
   and colour below is read from there — the desktop AND mobile scales both.
   The archived values, verbatim:

     --font-primary   'Epilogue', sans-serif      (headings)
     --font-secondary 'Work Sans', sans-serif     (body)

     h1  120px / 65px mobile   800   1.2
     h2   64px / 38px          800   1.2
     h3   48px / 32px          700   1.2      <- the policy titles
     h4   32px / 28px          700   1.2
     h5   24px / 24px          700   1.2
     h6   20px / 20px          700   1.2      <- the section headings
     body        16px          400   1.5
     body-large  18px          400   1.8
     body-small  14px          400   1.5
     nav link    15px / 16px   400   1.8      colour rgb(255,255,255)

   THE CONTENT WIDTH WAS NOT IN THE TOKENS, so it was solved for instead of
   guessed. Each archived block records the height it rendered at on desktop —
   2255px, 1601px and 3934px — and block height is a function of how many
   lines the text wraps to, which is a function of the measure. Sweeping the
   measure from 720px to 1300px and fitting all three heights at once lands on
   a single width, with the block's own top and bottom padding falling out as
   the shared constant:

     text width 1120px, padding 71px top / 177px bottom
       privacy-policy        archived 2255   rebuilt 2240   off 15px
       refund-policy         archived 1601   rebuilt 1617   off 16px
       terms-and-conditions  archived 3934   rebuilt 3932   off  2px

   Three documents of different lengths agreeing to within 16px on blocks up
   to 3900px tall is not a coincidence; the line breaks are landing where the
   original's did. 1224px — Zyro's default site width — was the first guess and
   came out 5-8% short on all three, which is what a too-wide measure does.

   If any of this is ever retuned, re-run the fit rather than eyeballing it:
   the heights above are the ground truth.
   ========================================================================== */

.legacy {
  /* --page-bg is set per page in the markup: each policy block carried its
     own background on the old site and no two were the same grey. */
  margin: 0;
  background: var(--page-bg, rgb(148, 148, 148));

  --font-primary: "Epilogue", sans-serif;
  --font-secondary: "Work Sans", sans-serif;

  font-family: var(--font-secondary);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: rgb(26, 26, 26);
  -webkit-font-smoothing: antialiased;
}

/* Zyro's site grid, which the header and footer sat on. */
.legacy-shell {
  width: 100%;
  max-width: 1224px;
  margin-inline: auto;
  padding-inline: 24px;
}

/* The measured text measure — see the fit in the header. The document sat
   narrower than the grid it was placed on, which is why this is its own cap
   rather than the shell's. */
.legacy-doc {
  max-width: 1120px;
  margin-inline: auto;
}

/* --- Header --------------------------------------------------------------
   The old header sat on rgb(0, 8, 135) with white nav links, and its four
   links went to /about, /talents, /services and /contacts — every one of
   which 404s on the current site. The bar and its colour are reproduced; the
   nav is not, because four dead links is not a restoration. The wordmark goes
   home, which is where the old one went too. */
.legacy-top {
  background: rgb(0, 8, 135);
  padding-block: 20px;
}

.legacy-top__mark {
  font-family: var(--font-primary);
  font-size: 24px;
  font-weight: 800;
  line-height: 1.2;
  color: rgb(255, 255, 255);
  text-decoration: none;
}

/* --- The document ------------------------------------------------------- */

/* Both numbers measured, not chosen. 71px is the text box's archived top
   offset within its block. The bottom is 113px rather than the 177px the
   first fit produced: that fit measured the document element, and the last
   paragraph's own `margin-bottom` collapses out of it while being contained
   by this padding — so 177px double-counted it. 113px is what makes the
   RENDERED block height match the archive, which is the number that matters. */
.legacy-main {
  padding-block: 71px 113px;
}

/* The heading scale, exactly as the archived tokens set it. The policy title
   is an <h3> and the section headings are <h6> because that is what the
   pages had — promoting them would be a change, and the ask was none. */
.legacy-doc h1,
.legacy-doc h2,
.legacy-doc h3,
.legacy-doc h4,
.legacy-doc h5,
.legacy-doc h6 {
  font-family: var(--font-primary);
  font-style: normal;
  line-height: 1.2;
  letter-spacing: normal;
  text-transform: none;
  color: rgb(26, 26, 26);
}

.legacy-doc h1 { font-size: 120px; font-weight: 800; }
.legacy-doc h2 { font-size: 64px;  font-weight: 800; }
.legacy-doc h3 { font-size: 48px;  font-weight: 700; }
.legacy-doc h4 { font-size: 32px;  font-weight: 700; }
.legacy-doc h5 { font-size: 24px;  font-weight: 700; }
.legacy-doc h6 { font-size: 20px;  font-weight: 700; }

/* `.body` is the builder's body-copy class, carried on every <p> in the
   archived markup. It is defined here so those attributes keep meaning
   something instead of being dead weight. */
.legacy-doc p,
.legacy-doc .body,
.legacy-doc li {
  font-family: var(--font-secondary);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: normal;
}

.legacy-doc .body-large { font-size: 18px; line-height: 1.8; }
.legacy-doc .body-small { font-size: 14px; }

/* The vertical rhythm comes from the inline `margin-bottom` on each element,
   which is how the builder stored it and which is still on every one of them
   — 40px under a title, 16px between paragraphs in a run, 32px before the
   next heading. Nothing here may set a margin that would fight those. */
.legacy-doc ul,
.legacy-doc ol {
  margin: 0 0 16px;
  padding-left: 24px;
}

.legacy-doc li {
  margin-bottom: 8px;
}

.legacy-doc strong { font-weight: 500; }

.legacy-doc a {
  color: rgb(26, 26, 26);
  text-decoration: underline;
  overflow-wrap: anywhere;
}

/* --- Footer --------------------------------------------------------------
   The old footer carried four more blocks: an EYDIT service banner, a Global
   Footprints country list, a For Brands panel with a phone and an address,
   and a Location block naming the Ganges Residency headquarters. All four are
   left out on purpose — the address in that last one is superseded by the
   Ecospace one now on the homepage, and restoring a stale registered address
   is the one kind of "exactly as it was" that would be a mistake. The
   copyright line and the policy links are reproduced. */
.legacy-foot {
  background: rgb(0, 8, 135);
  padding-block: 24px;
  color: rgb(255, 255, 255);
}

.legacy-foot .legacy-shell {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
}

.legacy-foot__copy {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

.legacy-foot__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
}

/* The archived nav-link spec: 15px desktop, 16px mobile, weight 400,
   line-height 1.8, white. */
.legacy-foot__nav a {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
  color: rgb(255, 255, 255);
  text-decoration: none;
}

.legacy-foot__nav a:hover,
.legacy-foot__nav a[aria-current="page"] {
  text-decoration: underline;
}

/* --- Mobile --------------------------------------------------------------
   The builder kept a separate mobile size for every text style, which is why
   these are the archived `--*-m-font-size` values rather than a scale of my
   own. Its own breakpoint was 768px. */
@media (max-width: 768px) {
  .legacy-doc h1 { font-size: 65px; }
  .legacy-doc h2 { font-size: 38px; }
  .legacy-doc h3 { font-size: 32px; }
  .legacy-doc h4 { font-size: 28px; }
  .legacy-doc h5 { font-size: 24px; }
  .legacy-doc h6 { font-size: 20px; }

  .legacy-foot__nav a { font-size: 16px; }

  .legacy-main {
    padding-block: 48px 56px;
  }
}