@charset "UTF-8";
/*!
* Start Bootstrap - Agency v7.0.12 (https://startbootstrap.com/theme/agency)
* Copyright 2013-2023 Start Bootstrap
* Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-agency/blob/master/LICENSE)
*/
/*!
 * Bootstrap  v5.2.3 (https://getbootstrap.com/)
 * Copyright 2011-2022 The Bootstrap Authors
 * Copyright 2011-2022 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc800;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #ffc800;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc800;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-primary-rgb: 255, 200, 0;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 52, 217, 107;
  --bs-info-rgb: 13, 202, 240;
  --bs-warning-rgb: 255, 200, 0;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light-rgb: 237, 239, 240; /*248, 249, 250;*/
  --bs-dark-rgb: 33, 37, 41;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: Roboto Slab, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-bg: #fff;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-2xl: 2rem;
  --bs-border-radius-pill: 50rem;
  --bs-link-color: #ffc800;
  --bs-link-hover-color: #cca000;
  --bs-code-color: #d63384;
  --bs-highlight-bg: #fff4cc;
  /* InsightArcs brand palette */
  --brand-bg: #15405e; /* #244f6a;*/         /* dark nav background when shrunk */
  --brand-bg-light: #4d7187;   /* lighter nav background initial */
  --brand-fg: #FFFFFF;         /* default link text */
  --brand-accent: #f3ae18;     /* main gold/yellow */
  --brand-hover: #FFD562;      /* lighter accent on hover */
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference)  {
  :root {
    scroll-behavior: smooth;
  }
}

/*! Small, tasteful styling for the language dropdown to look like a pill button in the navbar. */
.lang-dropdown .dropdown-toggle {
  border-radius: 9999px;
  padding: .4rem .9rem;
  border: 1px solid rgba(255,255,255,.4);
  backdrop-filter: saturate(180%) blur(6px);
}
.lang-dropdown .dropdown-menu {
  min-width: 8rem;
}
.lang-flag {
  font-size: 1rem;
  line-height: 1;
  margin-right: .5rem;
}
.dropdown-item.active .checkmark {
  visibility: visible;
}
.checkmark {
  visibility: hidden;
  float: right;
}
/***********************************************************************************************/

body {
  margin: 0;
  font-family: var(--bs-body-font-family);
  font-size: var(--bs-body-font-size);
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  color: var(--bs-body-color);
  text-align: var(--bs-body-text-align);
  background-color: var(--bs-body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

hr {
  margin: 1rem 0;
  color: inherit;
  border: 0;
  border-top: 1px solid;
  opacity: 0.25;
}

h6,
h5,
.h5,
h4,
.h4,
h3,
.h3,
h2,
.h2,
h1,
.h1 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  line-height: 1.2;
}

h1, .h1 {
  font-size: calc(1.375rem + 1.5vw);
}
@media (min-width: 1200px)  {
  h1, .h1 {
    font-size: 2.5rem;
  }
}

h2, .h2 {
  font-size: calc(1.325rem + 0.9vw);
}
@media (min-width: 1200px)  {
  h2, .h2 {
    font-size: 2rem;
  }
}

h3, .h3 {
  font-size: calc(1.3rem + 0.6vw);
}
@media (min-width: 1200px)  {
  h3, .h3 {
    font-size: 1.75rem;
  }
}

h4, .h4 {
  font-size: calc(1.275rem + 0.3vw);
}
@media (min-width: 1200px)  {
  h4, .h4 {
    font-size: 1.5rem;
  }
}

h5, .h5 {
  font-size: 1.25rem;
}

h6 {
  font-size: 1rem;
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

ol,
ul {
  padding-left: 2rem;
}

ol,
ul {
  margin-top: 0;
  margin-bottom: 1rem;
}

ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;
}

blockquote {
  margin: 0 0 1rem;
}

b,
strong {
  font-weight: bolder;
}

small, .small {
  font-size: 0.875em;
}

a {
  color: var(--bs-link-color);
  text-decoration: underline;
}
a:hover {
  color: var(--bs-link-hover-color);
}

a:not([href]):not([class]), a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

pre,
code {
  font-family: var(--bs-font-monospace);
  font-size: 1em;
}

pre {
  display: block;
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
  font-size: 0.875em;
}
pre code {
  font-size: inherit;
  color: inherit;
  word-break: normal;
}

code {
  font-size: 0.875em;
  color: var(--bs-code-color);
  word-wrap: break-word;
}
a > code {
  color: inherit;
}

img,
svg {
  vertical-align: middle;
}

table {
  caption-side: bottom;
  border-collapse: collapse;
}

th {
  text-align: inherit;
  text-align: -webkit-match-parent;
}

thead,
tbody,
tr,
td,
th {
  border-color: inherit;
  border-style: solid;
  border-width: 0;
}

label {
  display: inline-block;
}

button {
  border-radius: 0;
}

button:focus:not(:focus-visible) {
  outline: 0;
}

input,
button,
select,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button,
select {
  text-transform: none;
}

[role=button] {
  cursor: pointer;
}

select {
  word-wrap: normal;
}
select:disabled {
  opacity: 1;
}

[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
  display: none !important;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}
button:not(:disabled),
[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled) {
  cursor: pointer;
}

::-moz-focus-inner {
  padding: 0;
  border-style: none;
}

textarea {
  resize: vertical;
}

::-webkit-datetime-edit-fields-wrapper,
::-webkit-datetime-edit-text,
::-webkit-datetime-edit-minute,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-year-field {
  padding: 0;
}

::-webkit-inner-spin-button {
  height: auto;
}

[type=search] {
  outline-offset: -2px;
  -webkit-appearance: textfield;
}

/* rtl:raw:
[type="tel"],
[type="url"],
[type="email"],
[type="number"] {
  direction: ltr;
}
*/
::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-color-swatch-wrapper {
  padding: 0;
}

::file-selector-button {
  font: inherit;
  -webkit-appearance: button;
}

iframe {
  border: 0;
}

[hidden] {
  display: none !important;
}

.lead {
  font-size: 1.25rem;
  font-weight: 300;
}

.display-5 {
  font-size: calc(1.425rem + 2.1vw);
  font-weight: 300;
  line-height: 1.2;
}
@media (min-width: 1200px)  {
  .display-5 {
    font-size: 3rem;
  }
}

.list-unstyled {
  padding-left: 0;
  list-style: none;
}

.list-inline {
  padding-left: 0;
  list-style: none;
}

.blockquote {
  margin-bottom: 1rem;
  font-size: 1.25rem;
}
.blockquote > :last-child {
  margin-bottom: 0;
}

.container,
.container-xxl {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px)  {
  .container {
    max-width: 540px;
  }
}
@media (min-width: 768px)  {
  .container {
    max-width: 720px;
  }
}
@media (min-width: 992px)  {
  .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px)  {
  .container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px)  {
  .container-xxl,
.container {
    max-width: 1320px;
  }
}
.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x));
}
.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.col {
  flex: 1 0 0%;
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

.g-4 {
  --bs-gutter-x: 1.5rem;
}

.g-4 {
  --bs-gutter-y: 1.5rem;
}

.g-5 {
  --bs-gutter-x: 3rem;
}

.g-5 {
  --bs-gutter-y: 3rem;
}
@media (min-width: 768px)  {
  .col-md {
    flex: 1 0 0%;
  }
  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }
}
@media (min-width: 992px)  {
  .col-lg {
    flex: 1 0 0%;
  }
  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
}
@media (min-width: 1400px)  {
  .col-xxl {
    flex: 1 0 0%;
  }
  .col-xxl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
}
.table {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--bs-border-color);
  --bs-table-accent-bg: transparent;
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-striped-bg: rgba(0, 0, 0, 0.05);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-active-bg: rgba(0, 0, 0, 0.1);
  --bs-table-hover-color: var(--bs-body-color);
  --bs-table-hover-bg: rgba(0, 0, 0, 0.075);
  width: 100%;
  margin-bottom: 1rem;
  color: var(--bs-table-color);
  vertical-align: top;
  border-color: var(--bs-table-border-color);
}
.table > :not(caption) > * > * {
  padding: 0.5rem 0.5rem;
  background-color: var(--bs-table-bg);
  border-bottom-width: 1px;
  box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}
.table > tbody {
  vertical-align: inherit;
}
.table > thead {
  vertical-align: bottom;
}
.form-label {
  margin-bottom: 0.5rem;
}

.form-control {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 0.375rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce)  {
  .form-control {
    transition: none;
  }
}
.form-control[type=file] {
  overflow: hidden;
}
.form-control:focus {
  color: #212529;
  background-color: #fff;
  border-color: #ffe480;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(255, 200, 0, 0.25);
}
.form-control::-webkit-date-and-time-value {
  height: 1.5em;
}
.form-control::-moz-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control::placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control:disabled {
  background-color: #e9ecef;
  opacity: 1;
}
.form-control::file-selector-button {
  padding: 0.375rem 0.75rem;
  margin: -0.375rem -0.75rem;
  -webkit-margin-end: 0.75rem;
          margin-inline-end: 0.75rem;
  color: #212529;
  background-color: #e9ecef;
  pointer-events: none;
  border-color: inherit;
  border-style: solid;
  border-width: 0;
  border-inline-end-width: 1px;
  border-radius: 0;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce)  {
  .form-control::file-selector-button {
    transition: none;
  }
}

textarea.form-control {
  min-height: calc(1.5em + 0.75rem + 2px);
}

.form-select {
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
@media (prefers-reduced-motion: reduce)  {
  .form-select {
    transition: none;
  }
}
.form-select:focus {
  border-color: #ffe480;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(255, 200, 0, 0.25);
}
.form-select[size]:not([size="1"]) {
  padding-right: 0.75rem;
  background-image: none;
}
.form-select:disabled {
  background-color: #e9ecef;
}
.form-select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #212529;
}

.invalid-feedback {
  display: none;
  width: 100%;
  margin-top: 0.25rem;
  font-size: 0.875em;
  color: #dc3545;
}

.btn {
  --bs-btn-padding-x: 0.75rem;
  --bs-btn-padding-y: 0.375rem;
  --bs-btn-font-family: ;
  --bs-btn-font-size: 1rem;
  --bs-btn-font-weight: 400;
  --bs-btn-line-height: 1.5;
  --bs-btn-color: #212529;
  --bs-btn-bg: transparent;
  --bs-btn-border-width: 1px;
  --bs-btn-border-color: transparent;
  --bs-btn-border-radius: 0.375rem;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
  --bs-btn-disabled-opacity: 0.65;
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
  display: inline-block;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-family: var(--bs-btn-font-family);
  font-size: var(--bs-btn-font-size);
  font-weight: var(--bs-btn-font-weight);
  line-height: var(--bs-btn-line-height);
  color: var(--bs-btn-color);
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
  border-radius: var(--bs-btn-border-radius);
  background-color: var(--bs-btn-bg);
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce)  {
  .btn {
    transition: none;
  }
}
.btn:hover {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
}
.btn:focus-visible {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
  outline: 0;
  box-shadow: var(--bs-btn-focus-box-shadow);
}
.btn:first-child:active,
.btn.active,
.btn.show {
  color: var(--bs-btn-active-color);
  background-color: var(--bs-btn-active-bg);
  border-color: var(--bs-btn-active-border-color);
}
.btn:first-child:active:focus-visible,
.btn.active:focus-visible,
.btn.show:focus-visible {
  box-shadow: var(--bs-btn-focus-box-shadow);
}
.btn:disabled,
.btn.disabled {
  color: var(--bs-btn-disabled-color);
  pointer-events: none;
  background-color: var(--bs-btn-disabled-bg);
  border-color: var(--bs-btn-disabled-border-color);
  opacity: var(--bs-btn-disabled-opacity);
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--brand-accent); /* #ffc800;*/
  --bs-btn-border-color: var(--brand-accent);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--brand-hover); /*#d9aa00;*/
  --bs-btn-hover-border-color: #cca000;
  --bs-btn-focus-shadow-rgb: 255, 208, 38;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #cca000;
  --bs-btn-active-border-color: #bf9600;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--brand-accent); /* #ffc800;*/
  --bs-btn-disabled-border-color: var(--brand-accent); /* #ffc800;*/
}

.btn-dark {
  --bs-btn-color: #fff;
  --bs-btn-bg: #212529;
  --bs-btn-border-color: #212529;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #424649;
  --bs-btn-hover-border-color: #373b3e;
  --bs-btn-focus-shadow-rgb: 66, 70, 73;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #4d5154;
  --bs-btn-active-border-color: #373b3e;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #212529;
  --bs-btn-disabled-border-color: #212529;
}

.btn-outline-primary {
  --bs-btn-color: #ffc800;
  --bs-btn-border-color: #ffc800;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #ffc800;
  --bs-btn-hover-border-color: #ffc800;
  --bs-btn-focus-shadow-rgb: 255, 200, 0;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #ffc800;
  --bs-btn-active-border-color: #ffc800;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #ffc800;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #ffc800;
  --bs-gradient: none;
}

.btn-outline-light {
  --bs-btn-color: #f8f9fa;
  --bs-btn-border-color: #f8f9fa;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #f8f9fa;
  --bs-btn-hover-border-color: #f8f9fa;
  --bs-btn-focus-shadow-rgb: 248, 249, 250;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #f8f9fa;
  --bs-btn-active-border-color: #f8f9fa;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #f8f9fa;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #f8f9fa;
  --bs-gradient: none;
}

.btn-lg {
  --bs-btn-padding-y: 0.5rem;
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 1.25rem;
  --bs-btn-border-radius: 0.5rem;
}

.fade {
  transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion: reduce)  {
  .fade {
    transition: none;
  }
}
.fade:not(.show) {
  opacity: 0;
}

.collapse:not(.show) {
  display: none;
}

.collapsing {
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}
@media (prefers-reduced-motion: reduce)  {
  .collapsing {
    transition: none;
  }
}
.collapsing.collapse-horizontal {
  width: 0;
  height: auto;
  transition: width 0.35s ease;
}
@media (prefers-reduced-motion: reduce)  {
  .collapsing.collapse-horizontal {
    transition: none;
  }
}

.dropdown {
  position: relative;
}

.dropdown-toggle {
  white-space: nowrap;
}
.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}
.dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropdown-menu {
  --bs-dropdown-zindex: 1000;
  --bs-dropdown-min-width: 10rem;
  --bs-dropdown-padding-x: 0;
  --bs-dropdown-padding-y: 0.5rem;
  --bs-dropdown-spacer: 0.125rem;
  --bs-dropdown-font-size: 1rem;
  --bs-dropdown-color: #212529;
  --bs-dropdown-bg: #fff;
  --bs-dropdown-border-color: var(--bs-border-color-translucent);
  --bs-dropdown-border-radius: 0.375rem;
  --bs-dropdown-border-width: 1px;
  --bs-dropdown-inner-border-radius: calc(0.375rem - 1px);
  --bs-dropdown-divider-bg: var(--bs-border-color-translucent);
  --bs-dropdown-divider-margin-y: 0.5rem;
  --bs-dropdown-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-dropdown-link-color: #212529;
  --bs-dropdown-link-hover-color: #1e2125;
  --bs-dropdown-link-hover-bg: #e9ecef;
  --bs-dropdown-link-active-color: #fff;
  --bs-dropdown-link-active-bg: #ffc800;
  --bs-dropdown-link-disabled-color: #adb5bd;
  --bs-dropdown-item-padding-x: 1rem;
  --bs-dropdown-item-padding-y: 0.25rem;
  --bs-dropdown-header-color: #6c757d;
  --bs-dropdown-header-padding-x: 1rem;
  --bs-dropdown-header-padding-y: 0.5rem;
  position: absolute;
  z-index: var(--bs-dropdown-zindex);
  display: none;
  min-width: var(--bs-dropdown-min-width);
  padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
  margin: 0;
  font-size: var(--bs-dropdown-font-size);
  color: var(--bs-dropdown-color);
  text-align: left;
  list-style: none;
  background-color: var(--bs-dropdown-bg);
  background-clip: padding-box;
  border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
  border-radius: var(--bs-dropdown-border-radius);
}
.dropdown-menu[data-bs-popper] {
  top: 100%;
  left: 0;
  margin-top: var(--bs-dropdown-spacer);
}
.dropdown-menu-start[data-bs-popper] {
  right: auto;
  left: 0;
}

.dropdown-menu-end {
  --bs-position: end;
}
.dropdown-menu-end[data-bs-popper] {
  right: 0;
  left: auto;
}

@media (min-width: 576px)  {
  .dropdown-menu-sm-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-sm-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 768px)  {
  .dropdown-menu-md-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-md-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 992px)  {
  .dropdown-menu-lg-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-lg-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 1200px)  {
  .dropdown-menu-xl-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-xl-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 1400px)  {
  .dropdown-menu-xxl-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-xxl-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
.dropup .dropdown-menu[data-bs-popper] {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: var(--bs-dropdown-spacer);
}

.dropend .dropdown-menu[data-bs-popper] {
  top: 0;
  right: auto;
  left: 100%;
  margin-top: 0;
  margin-left: var(--bs-dropdown-spacer);
}

.dropstart .dropdown-menu[data-bs-popper] {
  top: 0;
  right: 100%;
  left: auto;
  margin-top: 0;
  margin-right: var(--bs-dropdown-spacer);
}

.dropdown-item {
  display: block;
  width: 100%;
  padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);
  clear: both;
  font-weight: 400;
  color: var(--bs-dropdown-link-color);
  text-align: inherit;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
}
.dropdown-item:hover, .dropdown-item:focus {
  color: var(--bs-dropdown-link-hover-color);
  background-color: var(--bs-dropdown-link-hover-bg);
}
.dropdown-item.active, .dropdown-item:active {
  color: var(--bs-dropdown-link-active-color);
  text-decoration: none;
  background-color: var(--bs-dropdown-link-active-bg);
}
.dropdown-item.disabled, .dropdown-item:disabled {
  color: var(--bs-dropdown-link-disabled-color);
  pointer-events: none;
  background-color: transparent;
}

.dropdown-menu.show {
  display: block;
}

.dropdown-header {
  display: block;
  padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);
  margin-bottom: 0;
  font-size: 1rem !important;
  color: var(--bs-dropdown-header-color);
  white-space: nowrap;
}

/* ------------------------------------------------------------------
   Navbar
--------------------------------------------------------------------*/

/* =========================
   Core nav + tabs/pills
   ========================= */
.nav{
  --bs-nav-link-padding-x:1rem;
  --bs-nav-link-padding-y:0.5rem;
  --bs-nav-link-font-weight:1rem;
  --bs-nav-link-color:var(--bs-link-color);
  --bs-nav-link-hover-color:var(--bs-link-hover-color);
  --bs-nav-link-disabled-color:#6c757d;
  display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none
}
.nav-link{
  display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);
  color:var(--bs-nav-link-color);text-decoration:none;
  transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out
}
@media (prefers-reduced-motion:reduce) {.nav-link{transition:none}}
.nav-link:hover,.nav-link:focus{color:var(--bs-nav-link-hover-color)}
.nav-link.disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}

/* =========================
   Navbar base (Bootstrap)
   ========================= */
.navbar{
  --bs-navbar-padding-x:0;--bs-navbar-padding-y:.5rem;
  --bs-navbar-brand-padding-y:.3125rem;--bs-navbar-brand-margin-end:1rem;--bs-navbar-brand-font-size:1.25rem;
  --bs-navbar-nav-link-padding-x:.5rem;--bs-navbar-toggler-padding-y:.25rem;--bs-navbar-toggler-padding-x:.75rem;
  --bs-navbar-toggler-font-size:1.25rem;--bs-navbar-toggler-border-radius:.375rem;--bs-navbar-toggler-focus-width:.25rem;
  --bs-navbar-toggler-transition:box-shadow .15s ease-in-out;
  position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  padding:var(--bs-navbar-padding-y) var(--bs-navbar-padding-x)
}
.navbar>.container,
.navbar>.container-xxl {display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}
.navbar-brand{padding-top:var(--bs-navbar-brand-padding-y);padding-bottom:var(--bs-navbar-brand-padding-y);margin-right:var(--bs-navbar-brand-margin-end);font-size:var(--bs-navbar-brand-font-size);color:var(--bs-navbar-brand-color);text-decoration:none;white-space:nowrap}
.navbar-brand:hover,.navbar-brand:focus{color:var(--bs-navbar-brand-hover-color)}
.navbar-nav{
  --bs-nav-link-padding-x:0;--bs-nav-link-padding-y:.5rem;--bs-nav-link-font-weight:1rem;
  --bs-nav-link-color:var(--bs-navbar-color);--bs-nav-link-hover-color:var(--bs-navbar-hover-color);--bs-nav-link-disabled-color:var(--bs-navbar-disabled-color);
  display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none
}
.navbar-nav .show>.nav-link,.navbar-nav .nav-link.active{color:var(--bs-navbar-active-color)}
.navbar-nav .dropdown-menu{position:static}
.navbar-collapse{flex-basis:100%;flex-grow:1;align-items:center}

.navbar-toggler{
  padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
  font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;
  border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);
  border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)
}
@media (prefers-reduced-motion:reduce) {.navbar-toggler{transition:none}}
.navbar-toggler:hover{text-decoration:none}
.navbar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}
@media (min-width:992px) {.navbar-expand-lg{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-lg .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}}
.navbar-expand{flex-wrap:nowrap;justify-content:flex-start}
.navbar-expand .navbar-nav{flex-direction:row}
.navbar-expand .navbar-nav .dropdown-menu{position:absolute}
.navbar-expand .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}
.navbar-expand .navbar-collapse{display:flex!important;flex-basis:auto}
.navbar-expand .navbar-toggler{display:none}

.navbar-dark{
  --bs-navbar-color:rgba(255,255,255,.55);
  --bs-navbar-hover-color:rgba(255,255,255,.75);
  --bs-navbar-disabled-color:rgba(255,255,255,.25);
  --bs-navbar-active-color:#fff;
  --bs-navbar-brand-color:#fff;
  --bs-navbar-brand-hover-color:#fff;
  --bs-navbar-toggler-border-color:rgba(255,255,255,.1);
  --bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

/* =========================
   Mega menu (Solutions)
   ========================= */
#mainNav .dropdown-mega{position:static}
#mainNav .dropdown-mega .dropdown-menu.mega-menu{
  position:absolute!important;left:0;right:0;top:100%;
  width:100%;z-index:1050;margin-top:0;border:0;border-radius:0 0 1rem 1rem;
  background:rgba(10,25,47,.98);box-shadow:0 1rem 2rem rgba(0,0,0,.35);padding:1.25rem 0
}

/* Typography + headers */
#mainNav .mega-menu,#mainNav .mega-menu *{
  line-height:1.35;text-transform:none
}

#mainNav .mega-menu .dropdown-header{
  font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;
  color:rgba(255,255,255,.6);margin:0 0 .5rem;padding:0;text-align:left
}

/* Make mega-menu headings act as links */
#mainNav .mega-menu .dropdown-header.heading-link {
  display: block;
  text-decoration: none;
  cursor: pointer;
  /* inherits your existing .dropdown-header typography */
}

/* Hover/focus state to match item behavior */
#mainNav .mega-menu .dropdown-header.heading-link:hover,
#mainNav .mega-menu .dropdown-header.heading-link:focus {
  color: var(--brand-accent);
}

/* Items */
#mainNav .mega-menu .dropdown-item{
  display:flex;align-items:center;gap:.5rem;padding:.35rem 0;
  color:rgba(255,255,255,.9);
  background:none!important;background-image:none!important;box-shadow:none!important;text-shadow:none!important;text-decoration:none
}
#mainNav .mega-menu .dropdown-item:hover,
#mainNav .mega-menu .dropdown-item:focus{color:var(--brand-accent,#ffc800)!important}

/* Layout: container width + 3 columns */
#mainNav .dropdown-mega .mega-menu>.row{
  max-width:1140px;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem
}
@media (min-width:992px) {
  #mainNav .dropdown-mega .mega-menu>.row{display:grid;grid-template-columns:repeat(3,minmax(360px,1fr));gap:1.5rem}
  #mainNav .mega-menu .dropdown-item{white-space:nowrap;max-width:none;width:auto}
}
@media (min-width:1200px) {#mainNav .dropdown-mega .mega-menu>.row{max-width:1260px}}
@media (min-width:1400px) {#mainNav .dropdown-mega .mega-menu>.row{max-width:1320px;grid-template-columns:repeat(3,minmax(360px,1fr))}}
@media (min-width:1600px) {#mainNav .dropdown-mega .mega-menu>.row{grid-template-columns:repeat(3,minmax(400px,1fr))}}

/* Mobile/tablet */
@media (max-width:991.98px) {

  /* [ADD] Absolute guard so German compound words can't widen the page */
  html, body { max-width: 100%; overflow-x: hidden; }

  /* [ADD] Keep the header container from exceeding the viewport width */
  #mainNav > .container { max-width: 100%; overflow-x: hidden; }

  /* [ADD] Let the logo shrink a bit and never consume too much width */
  #mainNav .navbar-brand { min-width: 0; }
  #mainNav .navbar-brand img {
    height: 2.25rem;          /* was 2.5rem */
    max-width: 58vw;          /* prevents logo from crowding the burger */
    width: auto;
  }

  /* [ADD] Allow nav text to wrap (helps with long German labels) */
  #mainNav .navbar-nav .nav-link {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  #mainNav .navbar-collapse{
    max-height:100vh;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch
  }

  #mainNav .dropdown-mega .dropdown-menu.mega-menu{
    position:static!important;
    max-height:calc(100vh - 6rem);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    box-shadow:none;
    border-radius:0;
    background:transparent;
    padding:.25rem 0 .75rem;

    /* [ADD] Ensure the hidden mega menu never creates a horizontal scroll */
    overflow-x: hidden;
  }

  #mainNav .mega-menu .dropdown-item{white-space:normal}

  #mainNav .lang-dropdown .dropdown-menu{
    position: static !important;
    transform: none !important;
    width: 100%;
    margin-top: .5rem;
    box-shadow: none; /* keep it clean in the collapsible list */
  }
}

/* Keep navbar link spacing tidy */
#mainNav .navbar-nav .nav-link{padding-left:.85rem;padding-right:.85rem}

/* DESKTOP hover-gap fix */

/* Desktop behaviour */
@media (min-width: 992px)  {
  /* 1) Pull the panel up so it physically overlaps the navbar a bit */
  #mainNav .dropdown-mega .dropdown-menu.mega-menu {
    top: calc(100% - 14px);   /* adjust 18–26px if you ever need a larger overlap */
  }

  /* 2) Make the panel itself own the space just above it */
  #mainNav .dropdown-mega .dropdown-menu.mega-menu::before {
    content: "";
    position: absolute;
    left: 0; right: 0;
    top: -24px;               /* extends into the gap */
    height: 24px;             /* match the overlap above */
  }

  /* 3) Extend the hover area down from the trigger (moved to ::before) */
  #mainNav .dropdown-mega { position: static; }  /* keep full-width menu */
  #mainNav .dropdown-mega > .nav-link { position: relative; }
  #mainNav .dropdown-mega > .nav-link::before {
    content: "";
    position: absolute;
    left: -12px; right: -12px;
    bottom: -22px;            /* reaches into the gap */
    height: 22px;

    /* kill any decorative underline some themes draw here */
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* Keep the menu visible while pointer is on trigger or panel */
  #mainNav .dropdown-mega:hover > .dropdown-menu,
  #mainNav .dropdown-mega:focus-within > .dropdown-menu,
  #mainNav .dropdown-mega .dropdown-menu:hover {
    display: block;
  }
}

/* Caret next to “Solutions” (inherits link color via mask) */
#mainNav .dropdown-mega > .nav-link {
  padding-right: 1.25rem; /* space for caret */
}

/* caret on ::after so text is unaffected */
#mainNav .dropdown-mega > .nav-link::after {
  content: "";
  display: inline-block;
  width: 0.6rem; height: 0.6rem;
  margin-left: 0.35rem;
  vertical-align: middle;

  /* down-caret mask */
  --ia-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M3 6l5 5 5-5z'/%3E%3C/svg%3E");
  background-color: currentColor;       /* caret color follows link color */
  -webkit-mask-image: var(--ia-caret);
  mask-image: var(--ia-caret);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;        mask-size: 100% 100%;
  -webkit-mask-position: center;       mask-position: center;

  transition: transform 150ms ease;
}

/* up-caret when menu is open */
#mainNav .dropdown-mega.show > .nav-link::after,
#mainNav .dropdown-mega .dropdown-toggle[aria-expanded='true']::after {
  --ia-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M3 10l5-5 5 5z'/%3E%3C/svg%3E");
}


/* =========================
   Site-specific #mainNav styling
   (scoped so it won't affect the mega menu)
   ========================= */
#mainNav{padding-top:1rem;padding-bottom:1rem;background-color:var(--brand-bg)}
#mainNav .navbar-toggler{
  padding:.75rem;
  font-size:.75rem;
  font-family:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  text-transform:uppercase;
  font-weight:700
}
#mainNav .navbar-brand{
  color:#ffc800;
  font-family:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-weight:700;
  letter-spacing:.0625em;
  text-transform:uppercase
}
#mainNav .navbar-brand img{
  height:2.5rem;
  width:auto
}
#mainNav .navbar-nav .nav-item .nav-link{
  font-family:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-size:.95rem;
  color:#fff;
  letter-spacing:.0625em
}
#mainNav .navbar-nav .nav-item .nav-link.active,#mainNav .navbar-nav .nav-item .nav-link:hover{
  color:var(--brand-accent)
}

@media (min-width:992px) {
  #mainNav{
    padding-top:1.5rem;
    padding-bottom:1.5rem;
    border:none;
    background-color:transparent;
    transition:padding-top .3s ease-in-out,padding-bottom .3s ease-in-out
  }
  #mainNav.navbar{background:transparent;
    --bs-navbar-color:rgba(255,255,255,.85);
    --bs-navbar-hover-color:var(--brand-hover);
    --bs-navbar-active-color:var(--brand-accent);
    --bs-navbar-brand-color:var(--brand-accent);
    --bs-navbar-brand-hover-color:var(--brand-hover);
    --bs-navbar-toggler-border-color:rgba(255,255,255,.35);
    --bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23F2B224' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
  }
  #mainNav.navbar-shrink{padding-top:1rem;padding-bottom:1rem;background:var(--brand-bg);box-shadow:0 6px 24px rgba(0,0,0,.35)}
  #mainNav .nav-link:hover,#mainNav .nav-link:focus{color:var(--brand-hover)}
  #mainNav .nav-link.active{color:var(--brand-accent)}
  #mainNav .navbar-brand{font-size:1.5em;transition:font-size .3s ease-in-out}
  #mainNav .navbar-brand img{height:3.5rem;width:auto;transition:height .3s ease-in-out}
  #mainNav.navbar-shrink .navbar-brand{font-size:1.25em}
  #mainNav.navbar-shrink .navbar-brand svg,#mainNav.navbar-shrink .navbar-brand img{height:3rem;width:auto}
  #mainNav .navbar-nav .nav-item{margin-right:1rem}
  #mainNav .navbar-nav .nav-item:last-child{margin-right:0}

  /* Brand dropdowns EXCEPT the mega menu */
  #mainNav .dropdown-menu:not(.mega-menu){background:var(--brand-bg);border-color:rgba(255,255,255,.1)}
  #mainNav .dropdown-menu:not(.mega-menu) .dropdown-item{color:var(--brand-fg)}
  #mainNav .dropdown-menu:not(.mega-menu) .dropdown-item:hover,
  #mainNav .dropdown-menu:not(.mega-menu) .dropdown-item:focus{color:var(--brand-bg);background:var(--brand-accent)}
  #mainNav .dropdown-menu:not(.mega-menu) .checkmark{color:var(--brand-accent)}
}

/* Language button (all sizes) */
#mainNav .lang-dropdown .btn.btn-outline-light{color:var(--brand-fg);border-color:var(--brand-fg)}
#mainNav .lang-dropdown .btn.btn-outline-light:hover{color:var(--brand-bg);background-color:var(--brand-accent);border-color:var(--brand-accent)}


.card {
  --bs-card-spacer-y: 1rem;
  --bs-card-spacer-x: 1rem;
  --bs-card-title-spacer-y: 0.5rem;
  --bs-card-border-width: 1px;
  --bs-card-border-color: var(--bs-border-color-translucent);
  --bs-card-border-radius: 0.375rem;
  --bs-card-box-shadow: ;
  --bs-card-inner-border-radius: calc(0.375rem - 1px);
  --bs-card-cap-padding-y: 0.5rem;
  --bs-card-cap-padding-x: 1rem;
  --bs-card-cap-bg: rgba(0, 0, 0, 0.03);
  --bs-card-cap-color: ;
  --bs-card-height: ;
  --bs-card-color: ;
  --bs-card-bg: #fff;
  --bs-card-img-overlay-padding: 1rem;
  --bs-card-group-margin: 0.75rem;
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: var(--bs-card-height);
  word-wrap: break-word;
  background-color: var(--bs-card-bg);
  background-clip: border-box;
  border: var(--bs-card-border-width) solid var(--bs-card-border-color);
  border-radius: var(--bs-card-border-radius);
}
.card > hr {
  margin-right: 0;
  margin-left: 0;
}

/* ------------------------------------------------------------------
   Team Cards
--------------------------------------------------------------------*/

/* Layout tweaks */
.team-lead { max-width: 1200px; margin: 0 auto 1.25rem; line-height: 1.6; }
.team-row + .team-row { margin-top: 2.5rem; }
@media (min-width: 992px) { .team-row + .team-row { margin-top: 3rem; } }

/* Card container: transparent until hover/focus/expanded */
.team-card{
  position: relative;
  border-radius: 16px;
  background: transparent;
  outline: 1px solid transparent;
  padding: 1.25rem;
  text-align: center;
  transition: outline-color .2s ease, box-shadow .25s ease, background-color .2s ease;
  cursor: default;
}

/* Turn “on” the panel (desktop hover, focus, or mobile expanded) */
.team-card:hover,
.team-card:focus-within,
.team-card.expanded{
  background: #fff;
  outline-color: rgba(0,0,0,.06);
  box-shadow: 0 10px 25px rgba(0,0,0,.08);
}

.team-avatar{
  width: 180px; height: 180px; object-fit: cover; margin-bottom: .5rem;
  border-radius: 50%; border: 6px solid var(--bs-gray-300);
}
.team-name{ margin-top: .25rem; font-weight: 700; }
.team-title{ margin-top: -.25rem; color: var(--bs-gray-700); }

.team-chips{
  display:flex; flex-wrap:wrap; justify-content:center; gap:.4rem;
  padding:0; margin:.75rem 0 0; list-style:none;
}
.team-chips li{
  font-size:.8rem; padding:.25rem .55rem; border-radius:999px;
  background: var(--brand-bg-light); color: var(--bs-white);
}

/* Expandable content */
.team-expandable{
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height .35s ease, opacity .25s ease, margin-top .25s ease;
}

/* Desktop: expand on hover */
@media (hover: hover) and (pointer: fine) {
  .team-toggle{ display:none !important; }
  .team-card:hover .team-expandable{
    max-height: 340px; opacity: 1; margin-top: 1rem;
  }
}

/* Mobile: expand via class toggle */
.team-card.expanded .team-expandable{
  max-height: 340px; opacity: 1; margin-top: 1rem;
}

/* Bio + actions */
.team-bio{ font-size:.95rem; color:#495057; line-height:1.6; margin-bottom:1rem; }
.team-actions{ display:flex; align-items:center; gap:.5rem; }
.team-actions .btn{
  flex: 1;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.team-actions .btn:hover{ filter: brightness(0.95); }

.team-linkedin{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%;
  background:#eef2f6; color:#0a66c2; text-decoration:none; border-color: #e6edf5; border-width: 2px; border-style: solid;
}
.team-linkedin:hover{ background:#e6edf5; color:var(--brand-bg); }

/* Mobile toggle row (brand colors) */
.team-toggle{
  width:100%; margin-top:.75rem; padding:.5rem .75rem;
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  border:1px solid var(--bs-gray-300); border-radius:10px; background:#fff;
  color: var(--bs-gray-900); font-weight:600; cursor:pointer;
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
}
.team-toggle:hover{ background:#f8f9fa; border-color:var(--bs-gray-400); box-shadow:0 4px 12px rgba(0,0,0,.04); }
.team-toggle .chev{ transition: transform .25s ease; color: var(--bs-primary); }
.team-card.expanded .team-toggle .chev{ transform: rotate(180deg); }

/* Responsive trims */
@media (max-width: 576px) {
  .team-avatar{ width:104px; height:104px; margin-bottom:.4rem; }
  .team-name{ font-size:1.05rem; }
  .team-title{ font-size:.9rem; }
  .team-chips{ gap:.3rem; margin-top:.6rem; }
  .team-chips li{ font-size:.75rem; padding:.2rem .45rem; }
  .team-bio{ font-size:.9rem; line-height:1.5; margin-bottom:.75rem; }
}

/* ------------------------------------------------------------------
   Partner carousel
--------------------------------------------------------------------*/

:root{
  --partner-gap: 2rem;
  --partner-radius: 16px;
  --partner-pad: 1.25rem;
  --partner-focus: #244f6a33;
}

/* Space under the section heading */
#partners .section-heading{
  margin-bottom: clamp(1.25rem, 3vw, 2.5rem);
}

.partners-carousel{
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1rem;
  align-items: center;
  width: 100%;
}

.partners-viewport{
  overflow: hidden;
  min-width: 0;
}

.partners-track{
  display: flex;
  gap: var(--partner-gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: 0.25rem 0;
}

.partners-track::-webkit-scrollbar{
  display: none;
}

.partner-card{
  flex: 0 0 100%;
  min-width: 0;
  text-decoration: none;
  scroll-snap-align: start;
}

@media (min-width: 576px) {
  .partner-card{
    flex-basis: calc((100% - var(--partner-gap)) / 2);
  }
}

@media (min-width: 992px) {
  .partner-card{
    flex-basis: calc((100% - (2 * var(--partner-gap))) / 3);
  }
}

@media (min-width: 1200px) {
  .partner-card{
    flex-basis: calc((100% - (3 * var(--partner-gap))) / 4);
  }
}

/* Square card with rounded corners + shadow */
.partner-tile{
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #fff;
  border-radius: var(--partner-radius);
  box-shadow: 0 10px 28px rgba(0,0,0,.10), 0 2px 10px rgba(0,0,0,.05);
  display: grid;
  place-items: center;
  padding: var(--partner-pad);
  transition: transform .2s ease, box-shadow .2s ease;
}

/* Logo sizing without distortion */
.partner-logo{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Hover + keyboard focus */
.partner-card:hover .partner-tile{
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(0,0,0,.12), 0 4px 12px rgba(0,0,0,.06);
}

.partner-card:focus-visible .partner-tile{
  outline: none;
  box-shadow:
    0 0 0 3px var(--partner-focus),
    0 14px 36px rgba(0,0,0,.12),
    0 4px 12px rgba(0,0,0,.06);
}

.partners-nav{
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #244f6a;
  box-shadow: 0 6px 18px rgba(0,0,0,.10);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
  z-index: 1;
}

.partners-nav span{
  font-size: 1.5rem;
  line-height: 1;
}

.partners-nav:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0,0,0,.14);
}

.partners-nav:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px var(--partner-focus),
    0 10px 24px rgba(0,0,0,.14);
}

@media (max-width: 575.98px) {
  .partners-carousel{
    grid-template-columns: 1fr;
  }

  .partners-nav{
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .partners-track{
    scroll-behavior: auto;
  }

  .partner-tile,
  .partners-nav{
    transition: none;
  }
}

/*------------------------------------------------------------------*/

.accordion {
  --bs-accordion-color: #212529;
  --bs-accordion-bg: #fff;
  --bs-accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
  --bs-accordion-border-color: var(--bs-border-color);
  --bs-accordion-border-width: 1px;
  --bs-accordion-border-radius: 0.375rem;
  --bs-accordion-inner-border-radius: calc(0.375rem - 1px);
  --bs-accordion-btn-padding-x: 1.25rem;
  --bs-accordion-btn-padding-y: 1rem;
  --bs-accordion-btn-color: #212529;
  --bs-accordion-btn-bg: var(--bs-accordion-bg);
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-icon-width: 1.25rem;
  --bs-accordion-btn-icon-transform: rotate(-180deg);
  --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23e6b400'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-focus-border-color: #ffe480;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(255, 200, 0, 0.25);
  --bs-accordion-body-padding-x: 1.25rem;
  --bs-accordion-body-padding-y: 1rem;
  --bs-accordion-active-color: #e6b400;
  --bs-accordion-active-bg: #fffae6;
}

.accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
  font-size: 1rem;
  color: var(--bs-accordion-btn-color);
  text-align: left;
  background-color: var(--bs-accordion-btn-bg);
  border: 0;
  border-radius: 0;
  overflow-anchor: none;
  transition: var(--bs-accordion-transition);
}
@media (prefers-reduced-motion: reduce)  {
  .accordion-button {
    transition: none;
  }
}
.accordion-button:not(.collapsed) {
  color: var(--bs-accordion-active-color);
  background-color: var(--bs-accordion-active-bg);
  box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}
.accordion-button:not(.collapsed)::after {
  background-image: var(--bs-accordion-btn-active-icon);
  transform: var(--bs-accordion-btn-icon-transform);
}
.accordion-button::after {
  flex-shrink: 0;
  width: var(--bs-accordion-btn-icon-width);
  height: var(--bs-accordion-btn-icon-width);
  margin-left: auto;
  content: "";
  background-image: var(--bs-accordion-btn-icon);
  background-repeat: no-repeat;
  background-size: var(--bs-accordion-btn-icon-width);
  transition: var(--bs-accordion-btn-icon-transition);
}
@media (prefers-reduced-motion: reduce)  {
  .accordion-button::after {
    transition: none;
  }
}
.accordion-button:hover {
  z-index: 2;
}
.accordion-button:focus {
  z-index: 3;
  border-color: var(--bs-accordion-btn-focus-border-color);
  outline: 0;
  box-shadow: var(--bs-accordion-btn-focus-box-shadow);
}

.accordion-header {
  margin-bottom: 0;
}

.accordion-item {
  color: var(--bs-accordion-color);
  background-color: var(--bs-accordion-bg);
  border: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color);
}
.accordion-item:first-of-type {
  border-top-left-radius: var(--bs-accordion-border-radius);
  border-top-right-radius: var(--bs-accordion-border-radius);
}
.accordion-item:first-of-type .accordion-button {
  border-top-left-radius: var(--bs-accordion-inner-border-radius);
  border-top-right-radius: var(--bs-accordion-inner-border-radius);
}
.accordion-item:not(:first-of-type) {
  border-top: 0;
}
.accordion-item:last-of-type {
  border-bottom-right-radius: var(--bs-accordion-border-radius);
  border-bottom-left-radius: var(--bs-accordion-border-radius);
}
.accordion-item:last-of-type .accordion-button.collapsed {
  border-bottom-right-radius: var(--bs-accordion-inner-border-radius);
  border-bottom-left-radius: var(--bs-accordion-inner-border-radius);
}
.accordion-item:last-of-type .accordion-collapse {
  border-bottom-right-radius: var(--bs-accordion-border-radius);
  border-bottom-left-radius: var(--bs-accordion-border-radius);
}

.accordion-body {
  padding: var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x);
}

@keyframes progress-bar-stripes {
  0% {
    background-position-x: 1rem;
  }
}

.modal {
  --bs-modal-zindex: 1055;
  --bs-modal-width: 500px;
  --bs-modal-padding: 1rem;
  --bs-modal-margin: 0.5rem;
  --bs-modal-color: ;
  --bs-modal-bg: #fff;
  --bs-modal-border-color: var(--bs-border-color-translucent);
  --bs-modal-border-width: 1px;
  --bs-modal-border-radius: 0.5rem;
  --bs-modal-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-modal-inner-border-radius: calc(0.5rem - 1px);
  --bs-modal-header-padding-x: 1rem;
  --bs-modal-header-padding-y: 1rem;
  --bs-modal-header-padding: 1rem 1rem;
  --bs-modal-header-border-color: var(--bs-border-color);
  --bs-modal-header-border-width: 1px;
  --bs-modal-title-line-height: 1.5;
  --bs-modal-footer-gap: 0.5rem;
  --bs-modal-footer-bg: ;
  --bs-modal-footer-border-color: var(--bs-border-color);
  --bs-modal-footer-border-width: 1px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--bs-modal-zindex);
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}

.modal-dialog {
  position: relative;
  width: auto;
  margin: var(--bs-modal-margin);
  pointer-events: none;
}
.modal.fade .modal-dialog {
  transition: transform 0.3s ease-out;
  transform: translate(0, -50px);
}
@media (prefers-reduced-motion: reduce)  {
  .modal.fade .modal-dialog {
    transition: none;
  }
}
.modal.show .modal-dialog {
  transform: none;
}
.modal.modal-static .modal-dialog {
  transform: scale(1.02);
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  color: var(--bs-modal-color);
  pointer-events: auto;
  background-color: var(--bs-modal-bg);
  background-clip: padding-box;
  border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
  border-radius: var(--bs-modal-border-radius);
  outline: 0;
}

.modal-backdrop {
  --bs-backdrop-zindex: 1050;
  --bs-backdrop-bg: #000;
  --bs-backdrop-opacity: 0.5;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--bs-backdrop-zindex);
  width: 100vw;
  height: 100vh;
  background-color: var(--bs-backdrop-bg);
}
.modal-backdrop.fade {
  opacity: 0;
}
.modal-backdrop.show {
  opacity: var(--bs-backdrop-opacity);
}

.modal-body {
  position: relative;
  flex: 1 1 auto;
  padding: var(--bs-modal-padding);
}

@media (min-width: 576px)  {
  .modal {
    --bs-modal-margin: 1.75rem;
    --bs-modal-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  }
  .modal-dialog {
    max-width: var(--bs-modal-width);
    margin-right: auto;
    margin-left: auto;
  }
}

.carousel {
  position: relative;
}

@keyframes spinner-border {
  to {
    transform: rotate(360deg) /* rtl:ignore */;
  }
}

@keyframes spinner-grow {
  0% {
    transform: scale(0);
  }
  50% {
    opacity: 1;
    transform: none;
  }
}

.placeholder {
  display: inline-block;
  min-height: 1em;
  vertical-align: middle;
  cursor: wait;
  background-color: currentcolor;
  opacity: 0.5;
}
.placeholder.btn::before {
  display: inline-block;
  content: "";
}

@keyframes placeholder-glow {
  50% {
    opacity: 0.2;
  }
}

@keyframes placeholder-wave {
  100% {
    -webkit-mask-position: -200% 0%;
            mask-position: -200% 0%;
  }
}

.link-dark {
  color: #212529 !important;
}
.link-dark:hover, .link-dark:focus {
  color: #1a1e21 !important;
}

.fixed-top {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030;
}

.d-flex {
  display: flex !important;
}

.d-none {
  display: none !important;
}

.shadow {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.border {
  border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

.w-100 {
  width: 100% !important;
}

.flex-wrap {
  flex-wrap: wrap !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-between {
  justify-content: space-between !important;
}

.align-items-center {
  align-items: center !important;
}

.align-items-stretch {
  align-items: stretch !important;
}

.mx-2 {
  margin-right: 0.5rem !important;
  margin-left: 0.5rem !important;
}

.mx-auto {
  margin-right: auto !important;
  margin-left: auto !important;
}

.my-3 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
}

.mt-3 {
  margin-top: 1rem !important;
}

.mt-4 {
  margin-top: 1.5rem !important;
}

.mt-5 {
  margin-top: 3rem !important;
}

.me-1 {
  margin-right: 0.25rem !important;
}

.me-2 {
  margin-right: 0.5rem !important;
}

.me-3 {
  margin-right: 1rem !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-1 {
  margin-bottom: 0.25rem !important;
}

.mb-3 {
  margin-bottom: 1rem !important;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.mb-5 {
  margin-bottom: 3rem !important;
}

.ms-1 {
  margin-left: 0.25rem !important;
}

.ms-auto {
  margin-left: auto !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.px-4 {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important;
}

.py-4 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}

.gap-3 {
  gap: 1rem !important;
}

.fs-3 {
  font-size: calc(1.3rem + 0.6vw) !important;
}

.fs-5 {
  font-size: 1.25rem !important;
}

.fw-bold {
  font-weight: 700 !important;
}

.fw-semibold {
  font-weight: 600 !important;
}

.fw-bolder {
  font-weight: bolder !important;
}

.text-center {
  text-align: center !important;
}

.text-decoration-none {
  text-decoration: none !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-success {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-success-rgb), var(--bs-text-opacity)) !important;
}

.text-danger {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important;
}

.text-light {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
}

.text-white {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important;
}

.text-muted {
  --bs-text-opacity: 1;
  color: #6c757d !important;
}

.bg-light {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
}

.rounded {
  border-radius: var(--bs-border-radius) !important;
}

.rounded-circle {
  border-radius: 50% !important;
}

.visible {
  visibility: visible !important;
}
@media (min-width: 768px)  {
  .mb-md-0 {
    margin-bottom: 0 !important;
  }
}
@media (min-width: 992px)  {
  .d-lg-none {
    display: none !important;
  }
  .flex-lg-nowrap {
    flex-wrap: nowrap !important;
  }
  .justify-content-lg-end {
    justify-content: flex-end !important;
  }
  .my-lg-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .mb-lg-5 {
    margin-bottom: 3rem !important;
  }
  .ms-lg-3 {
    margin-left: 1rem !important;
  }
  .py-lg-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .gap-lg-4 {
    gap: 1.5rem !important;
  }
  .text-lg-start {
    text-align: left !important;
  }
}
@media (min-width: 1200px)  {
  .fs-3 {
    font-size: 1.75rem !important;
  }
}
html {
  scroll-padding-top: 4.5rem;
}

body {
  position: relative;
}

p {
  line-height: 1.75;
}

.page-section {
  padding: 6rem 0;
}
.page-section h2.section-heading, .page-section .section-heading.h2 {
  font-size: 2.5rem;
  margin-top: 0;
  margin-bottom: 1rem;
}
.page-section h3.section-subheading, .page-section .section-subheading.h3 {
  font-size: 2rem;
  font-weight: 400;
  font-style: italic;
  font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  margin-bottom: 4rem;
}

@media (min-width: 768px)  {
  section {
    padding: 9rem 0;
  }
}
.btn-xl {
  padding: 1.25rem 2.5rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1.125rem;
  font-weight: 700;
}

.btn-social {
  height: 2.5rem;
  width: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 100%;
}

/* =========================
   Masthead
   ========================= */

/* Defaults = English */
:root{
  /* headline sizing */
  --hero-h1-min: 2.75rem;
  --hero-h1-ideal: 4.5vw;
  --hero-h1-max: 7rem;

  /* how wide the lines are allowed to run */
  --hero-text-width: 24ch;   /* ~24 characters per line */

  /* NEW: navbar height variable used in the min-height calc below */
  --nav-h: 64px; /* approx mobile navbar height */
}
/* NEW: desktop navbar height */
@media (min-width: 992px) {
  :root{ --nav-h: 72px; }
}

/* German tends to be longer → reduce cap & allow a bit more width */
html:lang(de){
  --hero-h1-max: 6rem;
  --hero-text-width: 28ch;
}

/* Apply to heading + subheading */
.masthead-heading h1{
  font-size: clamp(var(--hero-h1-min), var(--hero-h1-ideal), var(--hero-h1-max));
  line-height: 1.05;
  text-wrap: balance;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--hero-text-width); /* keeps H1 from getting too wide */
}

/* Gradient text for the arrows */
.arrow-gradient{
  /* draw a left→right gradient like the logo */
  background-image: linear-gradient(90deg, var(--brand-hover), var(--brand-accent));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;           /* reveal the gradient through text */
  display: inline-block;        /* makes background-clip reliable */
  font-weight: inherit;         /* keep weight consistent with the H1 */
}

/* Fallback for older/HC modes: show solid orange */
@supports not (-webkit-background-clip: text)  {
  .arrow-gradient{ color: var(--brand-orange); background: none; }
}

/* High-contrast accessibility fallback */
@media (forced-colors: active) {
  .arrow-gradient{ color: CanvasText; background: none; }
}

/* keep arrows with following word to avoid ugly wraps */
.masthead-heading h1 .arrow-gradient { margin: 0 .35ch; }
.masthead-heading h1 span { white-space: nowrap; }

.masthead-subheading p {
  margin-left: auto;
  margin-right: auto;
  max-width: 60ch; /* “not much wider” */
}

/* Optional: tweak only at large screens */
@media (min-width: 992px)  {
  :root{
    --hero-h1-ideal: 3.8vw;   /* a gentler slope on big screens */
  }
  html:lang(de){
    --hero-h1-ideal: 3.4vw;
  }
}

/* -------------------------
   Masthead box + spacing
   ------------------------- */

header.masthead {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding-top: 6.5rem;
  padding-bottom: 6rem;
  text-align: center;
  color: #fff;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center center;
  background-size: cover;

  min-height: calc(100vh - var(--nav-h));   /* fallback */
  min-height: calc(100svh - var(--nav-h));  /* modern mobile-friendly */
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

/* Photo painted on ::before (not directly on the header) so it can be
   scaled up past its cover size and clipped by the header's own
   overflow:hidden — masthead-network-wave.jpg has a white canvas margin +
   rounded corners baked into the source file, so a plain `cover` alone
   would still show a sliver of that margin along whichever edge doesn't
   get cropped. Scaling ~18% past cover and clipping the overflow pushes
   the margin/corners outside the visible box without recropping the
   source image itself. */
header.masthead::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(0, 0, 0, .45), rgba(0, 0, 0, .45)),
    url("../assets/img/masthead-network-wave.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transform: scale(1.18);
}

header.masthead .masthead-subheading {
  margin-bottom: 1rem;
  font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
header.masthead .masthead-heading {
  margin-bottom: 1.25rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

@media (min-width: 768px)  {
  header.masthead {
    padding-top: 12rem;
    padding-bottom: 10rem;
  }
  header.masthead .masthead-subheading {
    margin-bottom: 1.25rem;
  }
  header.masthead .masthead-heading {
    margin-bottom: 1.75rem;
  }
}

/* -------------------------
   Container width controls
   ------------------------- */

/* Slightly wider layout only for the masthead at lg+ */
@media (min-width: 992px)  {
  header.masthead .container-xxl {
    max-width: 1500px; /* bump if you want even more width */
  }
}
@media (min-width: 1400px) {
  header.masthead .container-xxl{ max-width: 1800px; }
}
@media (min-width: 1800px) {
  header.masthead .container-xxl{ max-width: 2000px; }
}

.portfolio-modal .modal-dialog {
  margin: 1rem;
  max-width: 100vw;
}
.portfolio-modal .modal-content {
  padding-top: 6rem;
  padding-bottom: 6rem;
  text-align: center;
}
.portfolio-modal .modal-content h2, .portfolio-modal .modal-content .h2 {
  font-size: 3rem;
  line-height: 3rem;
}
.portfolio-modal .modal-content p.item-intro {
  font-style: italic;
  margin-bottom: 2rem;
  font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.portfolio-modal .modal-content p {
  margin-bottom: 2rem;
}
.portfolio-modal .modal-content ul.list-inline {
  margin-bottom: 2rem;
}
.portfolio-modal .modal-content img {
  margin-bottom: 2rem;
}
.portfolio-modal .close-modal {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  width: 3rem;
  height: 3rem;
  cursor: pointer;
  background-color: transparent;
}
.portfolio-modal .close-modal:hover {
  opacity: 0.3;
}


section#contact {
  background-color: #15405e;
  background-image: url("../assets/img/map-image.jpg");
  background-repeat: no-repeat;
  background-position: left;
}
section#contact .section-heading {
  color: #fff;
}
section#contact form#contactForm .form-group {
  margin-bottom: 1.5rem;
}
section#contact form#contactForm .form-group input,
section#contact form#contactForm .form-group textarea {
  padding: 1.25rem;
}
section#contact form#contactForm .form-group input.form-control {
  height: auto;
}
section#contact form#contactForm .form-group-textarea {
  height: 100%;
}
section#contact form#contactForm .form-group-textarea textarea {
  height: 100%;
  min-height: 10rem;
}
section#contact form#contactForm .form-control:focus {
  border-color: #ffc800;
  box-shadow: none;
}
section#contact form#contactForm ::-webkit-input-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}
section#contact form#contactForm :-moz-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}
section#contact form#contactForm ::-moz-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}
section#contact form#contactForm :-ms-input-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}
/*------------------------------------------------------------------------------*/

.footer {
  text-align: center;
  font-size: 0.9rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* Keep legal links on one line on large screens, wrap naturally below lg */
@media (min-width: 992px)  {
  .footer .footer-links {
    white-space: nowrap;      /* prevent wrapping on lg+ */
  }
  .footer .footer-links a {
    margin: 0 !important;     /* we use the container gap instead of .me-3 */
  }
}

/* (optional) slightly tighter spacing so German fits more comfortably */
.footer .footer-links {
  gap: 0.75rem;               /* default; adjust to taste */
}

/*------------------------------------------------------------------------------*/
/* Cookie Banner */
/*------------------------------------------------------------------------------*/

#cookieBanner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: var(--bs-white);
  border-bottom: 1px solid rgba(21, 69, 94, 0.15); /* subtle brand-tinted border */
  box-shadow: 0 4px 12px rgba(21, 69, 94, 0.08);
  padding: 20px 24px;
  z-index: 1500;
  transform: translateY(-100%);
  transition: transform 0.3s ease;
}

#cookieBanner.show {
  transform: translateY(0);
}

/* Single source of truth for the space reserved above the fixed nav while
   the banner is shown — both rules below derive from the same variable
   (set once in js/scripts.js) instead of two separately-computed inline
   styles, so they can't drift out of sync with each other. */
:root {
  --cookie-banner-h: 0px;
}
body.cookie-open {
  padding-top: var(--cookie-banner-h);
}
body.cookie-open #mainNav {
  top: var(--cookie-banner-h);
}

.cookie-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.cookie-text {
  flex: 1;
  min-width: 250px;
  color: var(--brand-bg);
  font-size: 0.9rem;
  line-height: 1.5;
  max-width: 800px;
}

.cookie-header {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--brand-bg);
  margin: 0 0 6px 0;
}

.cookie-text p {
  margin: 0;
}

.cookie-buttons {
  display: flex;
  gap: 16px;
  flex-shrink: 0;
  align-items: center;
}

.btn-cookie {
  padding: 8px 20px;
  border-radius: 10px;
  font-size: 0.9rem;
  font-weight: 500;
  border: 2px solid;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}

/* Reject (secondary) */
.btn-cookie-reject {
  background: transparent;
  color: var(--brand-bg);
  border-color: rgba(21, 69, 94, 0.3);
}

.btn-cookie-reject:hover {
  background: rgba(21, 69, 94, 0.08);
  color: var(--brand-bg);
}

/* Accept (primary) */
.btn-cookie-accept {
  background: var(--brand-bg);
  color: var(--brand-fg);
  border-color: var(--brand-bg);
}

.btn-cookie-accept:hover {
  background: var(--brand-hover);
  border-color: var(--brand-hover);
}

/* Mobile */
@media (max-width: 768px)  {
  .cookie-content {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .cookie-buttons {
    width: 100%;
    justify-content: flex-start;
  }
}

/*==============================================================================*/
/* Homepage — AI/Software Solutions rows, Real Estate spotlight banner, and
   the fade-up/scroll-reveal entrance motion. */
/*==============================================================================*/

/* ---------- Hero entrance ---------- */
/* Simple on-load fade-up, staggered via inline --reveal-delay. The hero is
   always in the initial viewport, so a scroll trigger isn't needed here. */
@media (prefers-reduced-motion: no-preference) {
  .hero-fade {
    opacity: 0;
    transform: translateY(16px);
    animation: hero-fade-up .7s ease forwards;
    animation-delay: var(--reveal-delay, 0ms);
  }
}
@keyframes hero-fade-up {
  to { opacity: 1; transform: translateY(0); }
}

/* ---------- Scroll-reveal ---------- */
/* Toggled by the small IntersectionObserver in js/scripts.js. Falls back to
   visible-on-load if reduced motion is requested or IntersectionObserver is
   unavailable (handled in the script, not just here).

   Uses the standalone `translate` property (not `transform`) for the reveal
   offset — some revealed elements (e.g. .zigzag-row) also have their own
   hover-lift on `transform`. Since `transition` is a single property that
   gets replaced wholesale by whichever rule wins the cascade, having both
   reveal and hover animate `transform` would let the reveal's slower
   duration silently take over the hover lift too. Keeping them on separate
   properties lets each keep its own speed. */
@media (prefers-reduced-motion: no-preference) {
  .scroll-reveal {
    opacity: 0;
    translate: 0 20px;
    transition: opacity 1.2s ease, translate 1.2s ease;
    transition-delay: var(--reveal-delay, 0ms);
  }
  .scroll-reveal.in-view {
    opacity: 1;
    translate: 0 0;
  }
}

/* ---------- AI Solutions / Software Solutions: alternating photo rows ---------- */
/* Equal emphasis for every offer — no card is bigger or more prominent
   than another. */

.zigzag-list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.zigzag-row {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  border-radius: .85rem;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--bs-gray-200, #dee2e6);
  text-decoration: none;
  color: inherit;
}
.zigzag-row:hover,
.zigzag-row:focus-visible {
  text-decoration: none;
  color: inherit;
}
@media (prefers-reduced-motion: no-preference) {
  .zigzag-row {
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  .zigzag-row:hover {
    transform: translateY(-4px);
  }
}
.zigzag-row:hover {
  border-color: color-mix(in oklab, var(--brand-accent) 45%, var(--bs-gray-200, #dee2e6));
  box-shadow: 0 16px 36px rgba(21, 64, 94, .12);
}

/* AI Solutions sits on a white section background, so its rows get the
   same light grey as the Software Solutions section background
   (--bs-light-rgb) — gives contrast against the white section instead of
   blending into it. Software Solutions itself is already on a grey
   section, so its rows stay white by contrast. */
#ai-solutions .zigzag-row {
  background: rgb(var(--bs-light-rgb, 237, 239, 240));
}

.zigzag-media {
  flex: 0 0 auto;
  min-height: 220px;
  color: #fff;
  display: flex;
  align-items: flex-end;
  padding: 1.25rem;
  background-size: cover;
  background-position: center;
}

/* Generated photos (assets/img/services/*.png), one per offer. Native size
   is ~1.9:1 landscape — the row/media proportions below (taller, narrower
   media column) are tuned to crop them minimally. */
.zigzag-media--ai-competence       { background-image: url("../assets/img/services/service-ai-competence.jpg"); }
.zigzag-media--on-prem-ai          { background-image: url("../assets/img/services/service-on-prem-ai.jpg"); }
.zigzag-media--azure-ai            { background-image: url("../assets/img/services/service-azure-ai.jpg"); }
.zigzag-media--process-automation { background-image: url("../assets/img/services/service-process-automation.jpg"); }
.zigzag-media--custom-software     { background-image: url("../assets/img/services/service-custom-software.jpg"); }
.zigzag-media--crm-historisation   { background-image: url("../assets/img/services/service-crm-historisation.jpg"); }

.zigzag-text {
  flex: 1 1 auto;
  padding: 1.75rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.zigzag-text h4 {
  color: var(--brand-bg);
  font-weight: 700;
  margin-bottom: .6rem;
}
.zigzag-text p {
  color: var(--bs-gray-600, #6c757d);
  font-size: 1.1rem;
  margin-bottom: 1rem;
}
.solution-card-cta {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-weight: 600;
  font-size: .95rem;
  color: var(--brand-bg);
}
.zigzag-text .solution-card-cta {
  color: var(--brand-bg);
  font-size: 1.05rem;
}
.zigzag-row:hover .solution-card-cta {
  color: color-mix(in oklab, var(--brand-accent) 70%, var(--brand-bg));
}

@media (min-width: 768px) {
  .zigzag-row {
    flex-direction: row;
    align-items: stretch;
    min-height: 300px;
  }
  /* Wider media column so the ~1.9:1 photos are closer to their native
     aspect ratio at this height (~1100px container × 52% ÷ 300px height
     ≈ 1.9) — much less left/right cropping than a narrower column. */
  .zigzag-media {
    flex: 0 0 52%;
    min-height: auto;
  }
  /* Alternate sides so no single row/offer looks "featured" — the format
     is identical either way, only the media/text order flips. */
  .zigzag-row--reverse {
    flex-direction: row-reverse;
  }
}

/* ---------- Real Estate spotlight banner ---------- */

.re-spotlight-banner {
  position: relative;
  overflow: hidden;
  /* Tinted with --brand-bg (the nav bar's own navy) rather than near-black,
     so the overlay reads as the same navy as the nav instead of a darker,
     separate tone. */
  background-image:
    linear-gradient(180deg, rgba(21, 64, 94, .35), rgba(21, 64, 94, .55)),
    url("../assets/img/services/masthead-real-estate.jpg");
  background-size: cover;
  background-position: center;
  color: #fff;
}

.re-spotlight-banner .section-heading,
.re-spotlight-banner .section-subheading {
  color: #fff;
}
.re-spotlight-banner .section-subheading {
  opacity: .8;
}
.re-spotlight-banner .lead {
  color: rgba(255, 255, 255, .92);
}

.re-spotlight-banner .container {
  position: relative;
  z-index: 1;
}

/* Frosted-glass panel instead of a solid white card, so "What's Included"
   reads as part of the banner rather than a bolted-on box on top of it. */
.re-glass-card {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: .85rem;
  padding: 2.5rem;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.re-glass-card h3 {
  color: #fff;
}
.re-glass-card .lp-offer-list li {
  color: rgba(255, 255, 255, .92);
}
.re-glass-card .lp-icon-chip--good {
  background: color-mix(in oklab, var(--brand-accent) 25%, transparent);
  color: var(--brand-accent);
}

/* Checklist + icon-chip, copied in from css/landing.css (the offer-page
   stylesheet) rather than linking that whole file just for these two small
   pieces — keeps every homepage style in this one file. */
.lp-icon-chip {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: .55rem;
  font-size: .85rem;
}
.lp-icon-chip--good {
  background: color-mix(in oklab, var(--bs-success) 12%, transparent);
  color: var(--bs-success);
}
.lp-offer-list {
  list-style: none;
  margin: 1.5rem 0;
  padding: 0;
}
.lp-offer-list li {
  display: flex;
  align-items: center;
  gap: .85rem;
  padding: .5rem 0;
}