@font-face {
    font-family: 'Gilroy';
    src: url('../../../font/Gilroy-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../../../font/Gilroy-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../../../font/Gilroy-SemiBold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../../../font/Gilroy-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

:root {
    --color-primary: #086be0;
    --color-primary-hover: #0058c0;
    --color-primary-loading: #83b8f6;
    --color-text: #505050;
    --color-text-muted: #959595;
    --color-border: #d3d3d3;
    --color-button-text: #f9f9fb;
    --color-bg-page: #f4f4f4;
    --color-bg-panel: #ffffff;
    --color-error: #c0392b;
    --color-notice-bg: rgba(188, 217, 251, 0.5);
    --color-notice-border: #086be0;
    --color-notice-text: #004ba4;

    --font-family: 'Gilroy', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --font-size-title: 40px;
    --font-size-label: 12px;
    --font-size-input: 12px;
    --font-size-button: 14px;
    --font-size-link: 12px;
    --font-size-footer: 11px;

    --radius-input: 8px;
    --radius-button: 8px;

    --input-height: 32px;
    --panel-width-desktop: 568px;
    --form-inner-width: 341px;
    --panel-padding-x-desktop: 101px;
    --panel-padding-top-desktop: 80px;
    --panel-padding-bottom-desktop: 80px;

    --gap-logo-title: clamp(40px, 12vh, 120px);
    --gap-header-form: clamp(32px, 10vh, 104px);
    --gap-form-sections: 36px;
    --gap-fields: 28px;
    --gap-password-group: 16px;
    --gap-label-input: 4px;
    --gap-footer-items: 24px;
}