@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto/Roboto-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

:root {
    /*Foreground*/
    --colorNeutralForeground1: #242424;
    --colorNeutralForeground1Hover: #242424;
    --colorBrandForegroundLink: #115ea3;
    --colorBrandForegroundLinkHover: #0f548c;
    --colorBrandForegroundLinkPressed: #0c3b5e;
    --colorBrandForegroundLinkSelected: #115ea3;
    --colorNeutralForegroundInverted: #ffffff;
    /*Background*/
    --colorNeutralBackground1: #ffffff;
    --colorNeutralBackground1Hover: #f5f5f5;
    --colorNeutralBackground1Pressed: #e0e0e0;
    --colorNeutralBackground1Selected: #ebebeb;
    --colorBrandBackground: #0f6cbd;
    --colorBrandBackgroundHover: #115ea3;
    --colorBrandBackgroundPressed: #0c3b5e;
    --colorBrandBackgroundSelected: #0f548c;
    --body-bg: #ededed;
    --colorGreen1: #005525;
    --color-blue: #2563eb;
    --color-blue-contrast: #1642A2;
    /*Card*/
    --colorNeutralCardBackground: #fafafa;
    --colorNeutralCardBackgroundHover: #ffffff;
    --colorNeutralCardBackgroundPressed: #f5f5f5;
    --colorNeutralCardBackgroundSelected: #ebebeb;
    /*Stroke*/
    --colorNeutralStroke1: #d1d1d1;
    --colorNeutralStroke1Hover: #c7c7c7;
    --colorBrandStroke1: #0f6cbd;
    /*Contact Page*/
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --secondary-gradient: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --dark-bg: #1a202c;
    --light-bg: #f7fafc;
    --bs-breadcrumb-divider: '/';
}

html, body {
    font-family: Roboto, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    font-size: 12px;
}

body {
    line-height: 1.6;
    color: #333;
    background: var(--body-bg);
}

a {
    color: var(--color-blue)
}

.content {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 16px;
    flex: 1;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

body {
    margin: 0;
    background-color: #f5f5f5;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}