/* Search Hive — Typography tokens
   ------------------------------------------------------------------
   One family carries the entire scale. Display weights stay MODEST
   (500–700) — the system trusts photography for visual heft. The one
   loud typographic moment is the rating display (64 / 800).

   Each ramp step exposes four tokens: -size / -weight / -lh / -ls.
   (@kind tags keep the token compiler from mis-bucketing them.)
   ------------------------------------------------------------------ */

:root {
  /* ---- Families ------------------------------------------------- */
  --font-sans: "Hanken Grotesk", -apple-system, system-ui, "Segoe UI",
    Roboto, "Helvetica Neue", sans-serif; /* @kind font */
  --font-display: var(--font-sans);       /* @kind font */

  /* ---- Weights -------------------------------------------------- */
  --weight-regular: 400;   /* @kind other */
  --weight-medium: 500;    /* @kind other */
  --weight-semibold: 600;  /* @kind other */
  --weight-bold: 700;      /* @kind other */
  --weight-extrabold: 800; /* @kind other */

  /* ---- Type ramp ------------------------------------------------ */

  /* rating-display — the single loud moment */
  --t-rating-size: 64px;   /* @kind font  */
  --t-rating-weight: 800;  /* @kind other */
  --t-rating-lh: 1.1;      /* @kind other */
  --t-rating-ls: -1px;     /* @kind other */

  /* display-xl — homepage h1 */
  --t-display-xl-size: 30px;   /* @kind font  */
  --t-display-xl-weight: 700;  /* @kind other */
  --t-display-xl-lh: 1.2;      /* @kind other */
  --t-display-xl-ls: -0.6px;   /* @kind other */

  /* display-lg — listing detail h1 */
  --t-display-lg-size: 24px;   /* @kind font  */
  --t-display-lg-weight: 600;  /* @kind other */
  --t-display-lg-lh: 1.18;     /* @kind other */
  --t-display-lg-ls: -0.4px;   /* @kind other */

  /* display-md — section heads */
  --t-display-md-size: 21px;   /* @kind font  */
  --t-display-md-weight: 700;  /* @kind other */
  --t-display-md-lh: 1.3;      /* @kind other */
  --t-display-md-ls: -0.2px;   /* @kind other */

  /* display-sm — sub-section titles */
  --t-display-sm-size: 20px;   /* @kind font  */
  --t-display-sm-weight: 600;  /* @kind other */
  --t-display-sm-lh: 1.25;     /* @kind other */
  --t-display-sm-ls: -0.18px;  /* @kind other */

  /* title-md — card / link-block titles */
  --t-title-md-size: 16px;     /* @kind font  */
  --t-title-md-weight: 600;    /* @kind other */
  --t-title-md-lh: 1.3;        /* @kind other */
  --t-title-md-ls: 0;          /* @kind other */

  /* title-sm — footer column heads */
  --t-title-sm-size: 16px;     /* @kind font  */
  --t-title-sm-weight: 500;    /* @kind other */
  --t-title-sm-lh: 1.3;        /* @kind other */
  --t-title-sm-ls: 0;          /* @kind other */

  /* body-md — default running text */
  --t-body-md-size: 16px;      /* @kind font  */
  --t-body-md-weight: 400;     /* @kind other */
  --t-body-md-lh: 1.5;         /* @kind other */
  --t-body-md-ls: 0;           /* @kind other */

  /* body-sm — card meta, dates, prices */
  --t-body-sm-size: 14px;      /* @kind font  */
  --t-body-sm-weight: 400;     /* @kind other */
  --t-body-sm-lh: 1.45;        /* @kind other */
  --t-body-sm-ls: 0;           /* @kind other */

  /* caption — search-segment labels */
  --t-caption-size: 14px;      /* @kind font  */
  --t-caption-weight: 500;     /* @kind other */
  --t-caption-lh: 1.3;         /* @kind other */
  --t-caption-ls: 0;           /* @kind other */

  /* caption-sm — legal line */
  --t-caption-sm-size: 13px;   /* @kind font  */
  --t-caption-sm-weight: 400;  /* @kind other */
  --t-caption-sm-lh: 1.25;     /* @kind other */
  --t-caption-sm-ls: 0;        /* @kind other */

  /* badge — floating photo badge */
  --t-badge-size: 11px;        /* @kind font  */
  --t-badge-weight: 600;       /* @kind other */
  --t-badge-lh: 1.2;           /* @kind other */
  --t-badge-ls: 0.1px;         /* @kind other */

  /* micro-label — card amenity micro-labels */
  --t-micro-size: 12px;        /* @kind font  */
  --t-micro-weight: 700;       /* @kind other */
  --t-micro-lh: 1.33;          /* @kind other */
  --t-micro-ls: 0;             /* @kind other */

  /* uppercase-tag — "NEW" nav badge */
  --t-uppercase-size: 9px;     /* @kind font  */
  --t-uppercase-weight: 700;   /* @kind other */
  --t-uppercase-lh: 1.25;      /* @kind other */
  --t-uppercase-ls: 0.6px;     /* @kind other */

  /* nav-link — top product-nav labels */
  --t-nav-size: 16px;          /* @kind font  */
  --t-nav-weight: 600;         /* @kind other */
  --t-nav-lh: 1.25;            /* @kind other */
  --t-nav-ls: 0;               /* @kind other */

  /* button-md — primary CTA labels */
  --t-button-md-size: 16px;    /* @kind font  */
  --t-button-md-weight: 600;   /* @kind other */
  --t-button-md-lh: 1.25;      /* @kind other */
  --t-button-md-ls: 0;         /* @kind other */

  /* button-sm — pill button labels */
  --t-button-sm-size: 14px;    /* @kind font  */
  --t-button-sm-weight: 600;   /* @kind other */
  --t-button-sm-lh: 1.3;       /* @kind other */
  --t-button-sm-ls: 0;         /* @kind other */

  /* link — inline body links */
  --t-link-size: 14px;         /* @kind font  */
  --t-link-weight: 500;        /* @kind other */
  --t-link-lh: 1.45;           /* @kind other */
  --t-link-ls: 0;              /* @kind other */
}
