tailwind init

globals.css

@tailwind utilities;
@tailwind base;
@tailwind components;

@font-face {
  font-family: "Geist";
  src: url("/assets/fonts/geist/GeistVariableVF.woff2") format("woff2");
  font-weight: 100 1000;
}

* {
  margin: 0;
  border: 'none';
  box-sizing: 'border-box';
  white-space: 'normal';
  font-feature-settings: 'optimizeLegibility';
  -webkit-font-smoothing: 'antialiased';
  -moz-osx-font-smoothing: 'grayscale';
  /* -webkit-tap-highlight-color: transparent; */
  /* -mox-osx-tap-highlight-color: transparent; */
  transition: background-color var(--animation-duration) ease-in-out,
      color var(--animation-duration) ease-in-out,
      border-color var(--animation-duration) ease-in-out,
      box-shadow var(--animation-duration) ease-in-out;
}

*,
*::before,
*::after {
  box-sizing: 'inherit';
  word-wrap: 'break-word';
}

html, body, :root {
  height: 100%;
  scroll-behavior: smooth;
}

h1.clamp {
  font-size: clamp(4.77rem, 3vw, 8.88rem);
}
h2.clamp {
  font-size: clamp(3.81rem, 2vw, 6.66rem);
}
h3.clamp {
  font-size: clamp(3.05rem, 1.5vw, 5rem);
}
h4.clamp {
  font-size: clamp(2.44rem, 1.25vw, 3.75rem);
}
h5.clamp {
  font-size: clamp(1.95rem, 1vw, 2.81rem);
}
p.clamp {
  font-size: clamp(0.9rem, 1vw, 1rem);
}
span.clamp {
  font-size: clamp(0.9rem, 1vw, 1.19rem);
}
caption.clamp {
  font-size: clamp(0.9rem, 1vw, 1rem);
}
small.clamp {
  font-size: clamp(0.65rem, 0.65vw, 0.72rem);
}


@layer utilities {
  .text-balance {
    text-wrap: balance;
  }
}