/* tokens.css — freenet REAL design system (reskin: match freenet.de 1:1).
 * Palette + type lifted from freenet's live site (navy + lime green, Open Sans +
 * Montserrat). This replaces the earlier invented magenta look. */

@font-face {
  font-family: "Open Sans";
  src: url("/assets/opensans-latin-7177765c.woff2") format("woff2");
  font-weight: 300 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  src: url("/assets/opensans-latin-ext-f937d69c.woff2") format("woff2");
  font-weight: 300 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("/assets/montserrat-latin-9fa5e944.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("/assets/montserrat-latin-ext-9d7ec31b.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
}

:root {
  /* freenet brand */
  --fn-navy: #092043;        /* primary brand + primary CTA + ink */
  --fn-navy-2: #0E2243;
  --fn-green: #84BC34;        /* lime accent */
  --fn-green-2: #A0C860;
  --fn-green-d: #659A0A;
  --fn-green-light: #E2EDCF;
  --fn-coral: #EB5C47;        /* badges / highlights */

  /* surfaces + text */
  --fn-ink: #092043;
  --fn-slate: #6D7C97;        /* secondary text / labels */
  --fn-surface: #ffffff;
  --fn-soft: #E3E8F3;         /* checkout page background */
  --fn-line: #e5e5e5;
  --fn-white: #FBFDFF;
  --fn-red: #df002e;          /* validation errors (freenet red) */

  /* type */
  --fn-font-body: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --fn-font-display: "Montserrat", var(--fn-font-body);

  /* scale */
  --fn-radius: 16px;
  --fn-radius-btn: 28px;
  --fn-radius-pill: 9999px;
  --fn-radius-input: 4px;
  --fn-radius-sm: 8px;
  --fn-tap: 48px;
  --fn-gap: 16px;
  --fn-gap-lg: 24px;
  --fn-maxw: 560px;
  --fn-shadow: 0 2px 8px rgba(9, 32, 67, .16);
  --fn-shadow-lg: 0 4px 16px rgba(9, 32, 67, .20);
}