/*
 * Fluid type scale
 * Source model:
 * - min font size: 14px
 * - max font size: 20px
 * - min ratio: 1.25
 * - max ratio: 1.3333333333
 * - viewport range: 320px -> 1500px
 *
 * We use the pow() system as the design authoring model, but expose the
 * resulting steps as explicit clamp() tokens for WordPress presets and CSS.
 */
:root {
  --fluid-step-xs: clamp(0.7000rem, 0.6356rem + 0.3220vw, 0.9375rem);
  --fluid-step-base: clamp(0.8750rem, 0.7733rem + 0.5085vw, 1.2500rem);
  --fluid-step-s: clamp(1.0938rem, 0.9384rem + 0.7768vw, 1.6667rem);
  --fluid-step-m: clamp(1.3672rem, 1.1353rem + 1.1594vw, 2.2222rem);
  --fluid-step-l: clamp(1.7090rem, 1.3689rem + 1.7003vw, 2.9630rem);
  --fluid-step-xl: clamp(2.1362rem, 1.6442rem + 2.4602vw, 3.9506rem);
  --fluid-step-xxl: clamp(2.6703rem, 1.9660rem + 3.5216vw, 5.2675rem);
  --fluid-step-xxxl: clamp(3.3379rem, 2.3384rem + 4.9972vw, 7.0233rem);
}

body,
p,
li,
textarea,
input,
select,
button,
th,
td,
.fs-base,
.fluid {
  font-size: var(--fluid-step-base);
}

h1,
.h1,
.fs-xxl {
  font-size: var(--fluid-step-xxl);
}

h2,
.h2,
.fs-xl {
  font-size: var(--fluid-step-xl);
}

h3,
.h3,
.fs-l {
  font-size: var(--fluid-step-l);
}

h4,
.h4,
.fs-m {
  font-size: var(--fluid-step-m);
}

h5,
.h5,
.fs-s {
  font-size: var(--fluid-step-s);
}

h6,
.h6 {
  font-size: var(--fluid-step-base);
}

.fs-xs {
  font-size: var(--fluid-step-xs);
}

.fs-sm {
  font-size: var(--fluid-step-base);
}

.fs-md {
  font-size: var(--fluid-step-s);
}

.fs-lg {
  font-size: var(--fluid-step-m);
}

.fs-2xl {
  font-size: var(--fluid-step-xxl);
}

.fs-3xl {
  font-size: var(--fluid-step-xxxl);
}