/* ============================================
   Rulaxy MAIL — Product Brand Layer
   ============================================
   v1.0 (2026-07-22)

   Loaded AFTER tokens.css (the shared Rulaxy design-token SSOT, synced from
   landing-page/). This file is the SINGLE place where the mail product
   diverges from the marketplace brand — it must stay a thin override layer:

   - Typography: Inter (modern email-provider look — Proton/Fastmail class)
     instead of the aviation-manual slab serif. Self-hosted variable woff2,
     no third-party CDN call, no IP-leak, no cookie (same privacy rule as
     the slab). SIL OFL license.
   - Tracking: Inter is a neutral grotesque — needs tighter display tracking
     and wider caps spacing than the roomy slab.

   Colors, spacing, radius, shadows, z-index etc. stay 1:1 on the shared
   tokens — do NOT redefine them here.
   ============================================ */

/* ============================================================
   FONT FACE — Inter (Variable, self-hosted)
   ============================================================ */
@font-face {
  font-family: "Inter";
  src: url("fonts/inter-variable-latin.woff2") format("woff2-variations"),
       url("fonts/inter-variable-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ============================================================
   TYPOGRAPHY OVERRIDES (mail product only)
   ============================================================ */
:root {
  --font-family-display: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
                         Roboto, "Helvetica Neue", Arial, sans-serif;

  --font-family-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
                         Roboto, "Helvetica Neue", Arial, sans-serif;

  --font-family-sans:    var(--font-family-body);

  /* Inter tracking: tighter display, roomier caps than the slab */
  --letter-spacing-display: -0.022em;
  --letter-spacing-tight:   -0.012em;
  --letter-spacing-caps:     0.06em;
}

body {
  font-optical-sizing: auto;
}