/*
  Public-site typography foundation.
  These tokens intentionally live outside the authenticated application system:
  customer-facing pages follow the Figma public brand, while app/admin surfaces
  continue to use the operational CityBites typography tokens.
*/

@font-face {
    font-family: "Plus Jakarta Sans";
    src: url("../fonts/public/plus-jakarta-sans-latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 300 800;
    font-display: swap;
}

@font-face {
    font-family: "Schibsted Grotesk";
    src: url("../fonts/public/schibsted-grotesk-latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
}

[data-cb-experience="public"] {
    --cb-public-font-body: "Plus Jakarta Sans", "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
    --cb-public-font-display: var(--cb-public-font-body);

    --cb-public-weight-regular: 400;
    --cb-public-weight-medium: 500;
    --cb-public-weight-semibold: 600;
    --cb-public-weight-bold: 700;
    --cb-public-weight-extrabold: 800;

    --cb-public-text-nav: 1.03125rem;
    --cb-public-text-action: 1rem;
    --cb-public-text-cta: .9375rem;
    --cb-public-text-eyebrow: .8125rem;
    --cb-public-text-badge: .90625rem;
    --cb-public-text-input: .96875rem;
    --cb-public-text-caption: .84375rem;
    --cb-public-text-stat-title: 1.0625rem;
    --cb-public-text-stat-body: .96875rem;
    --cb-public-text-body: 1.0625rem;
    --cb-public-text-lead: clamp(1rem, 2vw, 1.1875rem);
    --cb-public-display-hero: clamp(3.25rem, 5.8vw, 6rem);
    --cb-public-display-intro: clamp(2.375rem, 4vw, 3.625rem);
    --cb-public-display-section: clamp(2.25rem, 4vw, 3.75rem);
    --cb-public-display-feature: clamp(2.75rem, 4.4vw, 4.25rem);

    --cb-public-leading-display: .96;
    --cb-public-leading-heading: 1.04;
    --cb-public-leading-body: 1.65;
    --cb-public-tracking-display: -.048em;
    --cb-public-tracking-heading: -.042em;
    --cb-public-tracking-accent: -.02em;
    --cb-public-tracking-nav: -.01em;
    --cb-public-tracking-eyebrow: .13em;

    /* Existing public components consume the canonical aliases. Scoping the
       aliases here keeps authenticated and admin typography unchanged. */
    --cb-font-sans: var(--cb-public-font-body);
    --cb-font-heading: var(--cb-public-font-display);
    --cb-font-display: var(--cb-public-font-display);
    --cb-font-weight-regular: var(--cb-public-weight-regular);
    --cb-font-weight-medium: var(--cb-public-weight-medium);
    --cb-font-weight-semibold: var(--cb-public-weight-semibold);
    --cb-font-weight-bold: var(--cb-public-weight-bold);
    --cb-font-weight-extrabold: var(--cb-public-weight-extrabold);

    font-family: var(--cb-public-font-body);
    font-synthesis: none;
}

[data-cb-experience="public"] :is(button, input, select, textarea) {
    font-family: inherit;
}