/*
 * Webflow code components — typography (Shadow DOM)
 *
 * Site variables and inherited properties work inside code components:
 * https://developers.webflow.com/code-components/styling-components
 *
 * Adobe Fonts (Typekit) register under slugs like `centra-no-2`, not marketing
 * names like `Centra No2`. Hardcoded family strings in CSS modules won’t match
 * the global @font-face on the host, so components use CSS variables instead.
 *
 * In Webflow: Variables (or your root typography) — create / reuse stacks and
 * “Copy CSS” so the custom property name matches what you map below.
 *
 * Recommended site-level tokens (set on :root / body scope in Webflow):
 *
 *   --wf-code-font--accent  → small labels / uppercase chip (Cartograph-style)
 *   --wf-code-font--body    → headings, body copy, buttons
 *
 * Example values (replace with your Adobe / Webflow font stacks):
 *
 *   --wf-code-font--accent: "some-display-font", sans-serif;
 *   --wf-code-font--body: centra-no-2, sans-serif;
 *
 * You can alias existing site variables, e.g.:
 *   --wf-code-font--body: var(--_typography---font-family-body, inherit);
 *
 * Local Vite / Storybook: defaults live in src/styles/globals.css (:root).
 */

.GHWajKkrldT4ev4dbPKX {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: transparent;
}

.RNkoxfUafz2rQ1tYrqvd {
  position: absolute;
  inset: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.LyAkauk4Mx6U7iIhtoGr {
  display: block;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  flex-shrink: 0;
}

.BTMxHbfqH5FlGnYsDTUM {
  transition-property: opacity;
  transition-timing-function: ease-out;
}

.mrHrS72P_W3Cd7uE9Vp7 {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}

.FfU0t8dPK_iVWUW2MMqb {
  background-size: contain;
  background-repeat: no-repeat;
}