/* Generated by tools/tokens.js from tokens/figma-variables.json — do not edit.
   Source: Figma file lku8ICcBCPYcllZIIjVi3u — Style Guide & Component Library (exported 2026-10-12)
   Modes → screen widths: 1920 1680px+ · 1440 1280px+ · Desktop 1024px+ · Tablet 768px+ · Mobile Landscape 480px+ · Mobile Portrait 0px+ */

/* 1920 */
:root {
  --width-container-small: 768px;
  --width-column-widest: 1280px;
  --width-column-wider: 1024px;
  --width-column-wide: 768px;
  --width-column-medium: 560px;
  --width-column-tight: 480px;
  --width-column-tighter: 400px;
  --width-column-tightest: 320px;
  --width-container-medium: 1200px;
  --width-container-large: 1600px;
  --width-container-full: 100%;
  --padding-gap-none: 0;
  --padding-gap-tiny: 8px;
  --padding-gap-small: 16px;
  --padding-gap-medium: 24px;
  --padding-gap-large: 40px;
  --padding-gap-huge: 80px;
  --padding-block-none: 0;
  --padding-section-global: 120px;
  --padding-section-large: var(--padding-block-large);
  --padding-section-medium: var(--padding-block-medium);
  --padding-section-small: var(--padding-block-small);
  --padding-block-tiny: 24px;
  --padding-block-small: 56px;
  --padding-block-medium: 96px;
  --padding-block-large: 160px;
  --padding-block-huge: 320px;
  --corners-modal: var(--radius-large);
  --corners-card: var(--radius-large);
  --corners-media: var(--radius-medium);
  --corners-button: var(--radius-medium);
  --corners-tag: var(--radius-small);
  --corners-avatar: var(--radius-round);
  --corners-input: var(--radius-small);
  --corners-control: var(--radius-tiny);
  --radius-round: 9999px;
  --radius-huge: 32px;
  --radius-large: 24px;
  --radius-medium: 16px;
  --radius-small: 4px;
  --radius-tiny: 2px;
  --radius-none: 0;
  --padding-control-none: 0;
  --padding-control-tiny: 4px;
  --padding-control-small: 8px;
  --padding-control-medium: 16px;
  --padding-control-large: 24px;
  --padding-control-huge: 32px;
  --padding-gap-media: 32px;
  --padding-container-none: 0;
  --padding-container-small: 16px;
  --padding-container-medium: 24px;
  --padding-container-large: 32px;
  --typeface-family-headline: "Dela Gothic One";
  --typeface-family-text: "Inter";
  --typeface-family-decorative: "Roboto Mono";
  --size-headline-hero: 168px;
  --size-headline-huge: 116px;
  --size-headline-large: 80px;
  --size-headline-medium: 52px;
  --size-headline-small: 32px;
  --size-headline-tiny: 22px;
  --size-text-huge: 52px;
  --size-text-large: 38px;
  --size-text-medium: 24px;
  --size-text-small: 16px;
  --size-text-tiny: 14px;
  --typeface-weight-regular: 400;
  --typeface-weight-medium: 500;
  --typeface-weight-semibold: 600;
  --typeface-weight-bold: 700;
}

/* 1440 */
@media (max-width: 1679.98px) {
  :root {
    --width-container-medium: 1120px;
    --width-container-large: 1440px;
    --padding-gap-tiny: 4px;
    --padding-gap-small: 12px;
    --padding-gap-medium: 20px;
    --padding-gap-large: 36px;
    --padding-gap-huge: 72px;
    --padding-section-global: 80px;
    --padding-block-tiny: 20px;
    --padding-block-small: 44px;
    --padding-block-medium: 80px;
    --padding-block-large: 144px;
    --padding-block-huge: 288px;
    --size-headline-hero: 144px;
    --size-headline-huge: 100px;
    --size-headline-large: 70px;
    --size-headline-medium: 48px;
    --size-headline-small: 30px;
    --size-headline-tiny: 20px;
    --size-text-huge: 48px;
    --size-text-large: 36px;
  }
}

/* Desktop */
@media (max-width: 1279.98px) {
  :root {
    --width-container-medium: 1024px;
    --width-container-large: 1280px;
    --padding-gap-small: 8px;
    --padding-gap-medium: 16px;
    --padding-gap-large: 32px;
    --padding-gap-huge: 64px;
    --padding-section-global: 64px;
    --padding-block-tiny: 16px;
    --padding-block-small: 32px;
    --padding-block-medium: 64px;
    --padding-block-large: 128px;
    --padding-block-huge: 256px;
    --padding-container-medium: 20px;
    --padding-container-large: 24px;
    --size-headline-hero: 128px;
    --size-headline-huge: 90px;
    --size-headline-large: 64px;
    --size-headline-medium: 45px;
    --size-headline-small: 28px;
  }
}

/* Tablet */
@media (max-width: 1023.98px) {
  :root {
    --padding-gap-large: 24px;
    --padding-gap-huge: 48px;
    --padding-section-global: 48px;
    --padding-block-tiny: 12px;
    --padding-block-small: 24px;
    --padding-block-medium: 48px;
    --padding-block-large: 96px;
    --padding-block-huge: 192px;
    --padding-container-medium: 16px;
    --padding-container-large: 20px;
    --size-headline-hero: 96px;
    --size-headline-huge: 72px;
    --size-headline-large: 56px;
    --size-headline-medium: 40px;
    --size-headline-small: 26px;
    --size-text-huge: 40px;
    --size-text-large: 32px;
    --size-text-medium: 22px;
    --size-text-small: 18px;
  }
}

/* Mobile Landscape */
@media (max-width: 767.98px) {
  :root {
    --padding-gap-medium: 12px;
    --padding-gap-large: 20px;
    --padding-gap-huge: 40px;
    --padding-section-global: 32px;
    --padding-block-small: 20px;
    --padding-block-medium: 40px;
    --padding-block-large: 72px;
    --padding-block-huge: 144px;
    --corners-tag: var(--radius-tiny);
    --padding-gap-media: 16px;
    --padding-container-large: 16px;
    --typeface-family-headline: "Inter Tight";
    --size-headline-hero: 64px;
    --size-headline-huge: 52px;
    --size-headline-large: 42px;
    --size-headline-medium: 34px;
    --size-headline-tiny: 18px;
    --size-text-huge: 32px;
    --size-text-large: 28px;
    --size-text-medium: 20px;
    --size-text-small: 17px;
  }
}

/* Mobile Portrait */
@media (max-width: 479.98px) {
  :root {
    --padding-gap-large: 16px;
    --padding-gap-huge: 32px;
    --padding-section-global: 20px;
    --padding-block-tiny: 8px;
    --padding-block-small: 16px;
    --padding-block-medium: 32px;
    --padding-block-large: 56px;
    --padding-block-huge: 112px;
    --size-headline-hero: 52px;
    --size-headline-huge: 44px;
    --size-headline-large: 36px;
    --size-headline-medium: 30px;
    --size-headline-small: 24px;
    --size-text-huge: 30px;
    --size-text-large: 26px;
  }
}