const MIN_VW = 768;
const MAX_VW = 1440;

/**
 * Fluid clamp() between two px values, scaling with viewport width from
 * `minVw` to `maxVw`. Below `minVw` the clamp() floor freezes the value —
 * that's the "Tablet-Floor" behavior baked into the formula itself, no
 * separate mobile media query needed for sizing.
 */
export function fluid(minPx: number, maxPx: number, minVw = MIN_VW, maxVw = MAX_VW): string {
  const slope = (maxPx - minPx) / (maxVw - minVw);
  const yIntercept = minPx - slope * minVw;
  const minRem = minPx / 16;
  const maxRem = maxPx / 16;
  const yRem = yIntercept / 16;
  const slopeVw = slope * 100;
  return `clamp(${minRem}rem, ${yRem}rem + ${slopeVw}vw, ${maxRem}rem)`;
}